From 61845dc62be9ccc828d40fb0ef55c888850c87d4 Mon Sep 17 00:00:00 2001 From: rizky Date: Sun, 3 Nov 2024 21:01:36 -0700 Subject: [PATCH] checkpoint --- .../Datepicker/components/Calendar/Days.tsx | 202 +++++-- .../Datepicker/components/Calendar/Months.tsx | 5 +- .../Datepicker/components/Calendar/Week.tsx | 25 +- .../Datepicker/components/Calendar/index.tsx | 12 +- comps/custom/Datepicker/helpers/index.ts | 10 +- comps/custom/Datepicker/types/index.ts | 3 +- comps/custom/QrLabel.tsx | 1 + comps/custom/QrScanner.tsx | 107 ++++ comps/dialog/Dialog.tsx | 2 + comps/filter/FilterContent.tsx | 7 + comps/filter/MasterFilter.tsx | 22 +- comps/filter/gen/gen-filter.ts | 416 +++++++++++++- comps/form/base/BaseField.tsx | 2 +- comps/form/field/Field.tsx | 12 +- comps/form/field/FieldInput.tsx | 33 ++ comps/form/field/Label.tsx | 74 ++- comps/form/field/table-edit/TableEdit.tsx | 206 +++---- comps/form/field/type/TypeButton.tsx | 7 +- comps/form/field/type/TypeDropdown.tsx | 11 +- comps/form/field/type/TypeInput.tsx | 5 +- comps/form/field/type/TypeLink.tsx | 42 +- comps/form/field/type/TypeMoney.tsx | 2 +- comps/form/gen/gen-field.ts | 2 +- comps/form/typings.ts | 9 +- comps/form/utils/init.tsx | 7 +- comps/form/utils/use-field.tsx | 13 +- comps/import/Import.tsx | 8 +- comps/list/TableList.tsx | 525 ++++++++++-------- comps/md/gen/gen-table-list.ts | 3 + comps/md/gen/md-list.ts | 1 - comps/sheet/sheet.tsx | 137 +++-- comps/slide/Slide.tsx | 44 ++ comps/tab/parts/PanelTab.tsx | 3 +- comps/tab/utils/typings.ts | 2 + comps/ui/aspect-ratio.tsx | 7 + comps/ui/carousel.tsx | 2 +- comps/ui/sheet.tsx | 4 +- comps/ui/typeahead.tsx | 169 +++--- exports.tsx | 18 +- preset/login/utils/logout.ts | 1 + preset/login/utils/register.ts | 4 + preset/menu/Layout.tsx | 16 +- utils/ranged_date.ts | 27 + 43 files changed, 1592 insertions(+), 616 deletions(-) create mode 100755 comps/custom/QrScanner.tsx create mode 100755 comps/slide/Slide.tsx create mode 100755 comps/ui/aspect-ratio.tsx create mode 100755 utils/ranged_date.ts diff --git a/comps/custom/Datepicker/components/Calendar/Days.tsx b/comps/custom/Datepicker/components/Calendar/Days.tsx index 4ee0b9a..6332e77 100755 --- a/comps/custom/Datepicker/components/Calendar/Days.tsx +++ b/comps/custom/Datepicker/components/Calendar/Days.tsx @@ -27,6 +27,7 @@ interface Props { onClickDay: (day: number) => void; onClickNextDays: (day: number) => void; onIcon?: (day: number, date: Date) => any; + style?: string; } const Days: React.FC = ({ @@ -35,6 +36,7 @@ const Days: React.FC = ({ onClickDay, onClickNextDays, onIcon, + style, }) => { // Contexts const { @@ -241,13 +243,18 @@ const Days: React.FC = ({ const buttonClass = useCallback( (day: number, type: "current" | "next" | "previous") => { - const baseClass = - "c-flex c-items-center c-justify-center c-w-12 c-h-12 lg:c-w-10 lg:c-h-10 c-relative"; + let baseClass = `calender-day c-flex c-items-center c-justify-center ${ + style === "google" + ? " c-w-6 c-h-6 c-m-1" + : "c-w-12 c-h-12 lg:c-w-10 lg:c-h-10" + } c-relative`; if (type === "current") { return cn( baseClass, !activeDateData(day).active ? hoverClassByDay(day) + : style === "google" + ? "" : activeDateData(day).className, isDateDisabled(day, type) && "c-text-gray-400 c-cursor-not-allowed" ); @@ -403,62 +410,171 @@ const Days: React.FC = ({ return typeof onIcon === "function" ? onIcon(day, res) : null; }; return ( -
+
{calendarData.days.previous.map((item, index) => ( - +
+ {style === "google" ? ( + <> + +
{load_marker(item, "previous")}
+ + ) : ( + <> + + + )} +
+
))} {calendarData.days.current.map((item, index) => ( - +
+ {style === "google" ? ( + <> + +
{load_marker(item, "current")}
+ + ) : ( + <> + + + )} +
+
))} {calendarData.days.next.map((item, index) => ( - +
+ {style === "google" ? ( + <> + +
{load_marker(item, "next")}
+ + ) : ( + <> + + + )} +
+ ))} ); diff --git a/comps/custom/Datepicker/components/Calendar/Months.tsx b/comps/custom/Datepicker/components/Calendar/Months.tsx index 3379605..205cd9c 100755 --- a/comps/custom/Datepicker/components/Calendar/Months.tsx +++ b/comps/custom/Datepicker/components/Calendar/Months.tsx @@ -9,9 +9,10 @@ import { RoundedButton } from "../utils"; interface Props { currentMonth: number; clickMonth: (month: number) => void; + style?: string } -const Months: React.FC = ({ currentMonth, clickMonth }) => { +const Months: React.FC = ({ currentMonth, clickMonth, style }) => { const { i18n } = useContext(DatepickerContext); loadLanguageModule(i18n); return ( @@ -25,7 +26,7 @@ const Months: React.FC = ({ currentMonth, clickMonth }) => { }} active={currentMonth === item} > - <>{dayjs(`2022-${item}-01`).locale(i18n).format("MMM")} + <>{dayjs(`2022-${item}-01`).locale(i18n).format(style === "google" ? "MMMM" :"MMM")} ))} diff --git a/comps/custom/Datepicker/components/Calendar/Week.tsx b/comps/custom/Datepicker/components/Calendar/Week.tsx index 9693208..a773213 100755 --- a/comps/custom/Datepicker/components/Calendar/Week.tsx +++ b/comps/custom/Datepicker/components/Calendar/Week.tsx @@ -4,11 +4,15 @@ import React, { useContext, useMemo } from "react"; import { DAYS } from "../../constants"; import DatepickerContext from "../../contexts/DatepickerContext"; import { loadLanguageModule, shortString, ucFirst } from "../../helpers"; - -const Week: React.FC = () => { +interface Props { + style?: string +} +const Week: React.FC = ({style}) => { const { i18n, startWeekOn } = useContext(DatepickerContext); loadLanguageModule(i18n); const startDateModifier = useMemo(() => { + console.log(startWeekOn); + if (startWeekOn) { switch (startWeekOn) { case "mon": @@ -33,19 +37,22 @@ const Week: React.FC = () => { }, [startWeekOn]); return ( -
+
{DAYS.map((item) => (
- {ucFirst( - shortString( - dayjs(`2022-11-${6 + (item + startDateModifier)}`) + {style === "google" ? dayjs(`2022-11-${6 + (item + startDateModifier)}`) .locale(i18n) - .format("ddd") - ) - )} + .format("dddd") : ucFirst( + shortString( + dayjs(`2022-11-${6 + (item + startDateModifier)}`) + .locale(i18n) + .format("dddd") + ), + + )}
))}
diff --git a/comps/custom/Datepicker/components/Calendar/index.tsx b/comps/custom/Datepicker/components/Calendar/index.tsx index ad506a9..34aefdf 100755 --- a/comps/custom/Datepicker/components/Calendar/index.tsx +++ b/comps/custom/Datepicker/components/Calendar/index.tsx @@ -45,6 +45,7 @@ interface Props { changeYear: (year: number) => void; mode?: "monthly" | "daily"; onMark?: (day: number, date: Date) => any; + style?: string } const Calendar: React.FC = ({ @@ -57,6 +58,7 @@ const Calendar: React.FC = ({ changeYear, onMark, mode = "daily", + style = "prasi" }) => { // Contexts const { @@ -266,7 +268,7 @@ const Calendar: React.FC = ({ ); return ( -
+
= ({ hideYears(); }} > - <>{calendarData.date.locale(i18n).format("MMM")} + <>{calendarData.date.locale(i18n).format(style === "google" ? "MMMM" :"MMM")}
@@ -341,11 +343,12 @@ const Calendar: React.FC = ({
)}
-
+
{showMonths && ( )} @@ -361,13 +364,14 @@ const Calendar: React.FC = ({ {!showMonths && !showYears && ( <> - + { if(typeof onMark === "function"){ return onMark(day, date) diff --git a/comps/custom/Datepicker/helpers/index.ts b/comps/custom/Datepicker/helpers/index.ts index 7f9014a..e84f6b9 100755 --- a/comps/custom/Datepicker/helpers/index.ts +++ b/comps/custom/Datepicker/helpers/index.ts @@ -174,7 +174,15 @@ export function getNumberOfDay( } } - [ + isMobile ? [ + "S", + "M", + "T", + "W", + "T", + "F", + "S", + ]: [ "Sunday", "Monday", "Tuesday", diff --git a/comps/custom/Datepicker/types/index.ts b/comps/custom/Datepicker/types/index.ts index c8c3b4b..3967018 100755 --- a/comps/custom/Datepicker/types/index.ts +++ b/comps/custom/Datepicker/types/index.ts @@ -84,7 +84,8 @@ export interface DatepickerType { popoverDirection?: PopoverDirectionType; mode?: "daily" | "monthly"; onMark?: (day: number, date: Date) => any; - onLoad?: () => Promise + onLoad?: (day: any) => Promise; + style?: "google" | "prasi" } diff --git a/comps/custom/QrLabel.tsx b/comps/custom/QrLabel.tsx index a40c11a..eea23c7 100755 --- a/comps/custom/QrLabel.tsx +++ b/comps/custom/QrLabel.tsx @@ -7,6 +7,7 @@ export const QrLabel: FC<{ fgcolor: string, size: number }> = ({ value, bgcolor, fgcolor, size }) => { + console.log(value); return (
{} }> = ({ onSuccess }) => { + const w = window as any; + const scanner = useRef(); + const videoEl = useRef(null); + const qrBoxEl = useRef(null); + const [qrOn, setQrOn] = useState(true); + const [scannedResult, setScannedResult] = useState(""); + const [hasScanned, setHasScanned] = useState(false); + const onScanSuccess = (result: ScanQr.ScanResult) => { + if (!hasScanned) { + console.log(result); + setScannedResult(result?.data); + setHasScanned(true); + scanner.current?.stop(); + + setTimeout(() => { + onSuccess(result?.data); + }, 1000); + } + }; + const onScanFail = (err: string | Error) => { + console.log("failed", err); + }; + const openCameraScanner = () => { + if (w.AndroidBridge && w.AndroidBridge.openCameraScanner) { + w.AndroidBridge.openCameraScanner(); + } else { + console.error("AndroidBridge or openCameraScanner function is not available."); + } + }; + if (w.AndroidBridge && w.AndroidBridge.openCameraScanner) { + useEffect(() => { + openCameraScanner(); + }, []); + + useEffect(() => { + w.onScannerResult = (scannedData: string) => { + console.log('Scanned Data:', scannedData); + onSuccess(scannedData); + }; + }, []); + return ( +
+

QR/Barcode Scanner

+
+ ); + } else { + console.log("Bridge not found"); + useEffect(() => { + if (videoEl?.current && !scanner.current) { + scanner.current = new ScanQr(videoEl?.current, onScanSuccess, { + onDecodeError: onScanFail, + preferredCamera: "environment", + highlightScanRegion: true, + highlightCodeOutline: true, + overlay: qrBoxEl?.current || undefined, + }); + + scanner?.current + ?.start() + .then(() => setQrOn(true)) + .catch((err) => { + if (err) setQrOn(false); + }); + } + + return () => { + if (!videoEl?.current) { + scanner?.current?.stop(); + } + }; + }, []); + + useEffect(() => { + if (!qrOn) + alert( + "Kamera tidak bisa diakses. Tolong beri izin untuk akses kamera dan silahkan reload." + ); + }, [qrOn]); + + return ( +
+ +
+ +
+ {scannedResult && ( +

+ Scanned Result: {scannedResult} +

+ )} +
+ ); + } +}; \ No newline at end of file diff --git a/comps/dialog/Dialog.tsx b/comps/dialog/Dialog.tsx index 6ac018b..ebbee77 100755 --- a/comps/dialog/Dialog.tsx +++ b/comps/dialog/Dialog.tsx @@ -3,6 +3,7 @@ import { Button } from "lib/comps/ui/button"; import { Dialog, DialogContent, + DialogDescription, DialogHeader, DialogOverlay, DialogTitle, @@ -73,6 +74,7 @@ export const Pop: FC<{ + { + if (!form?.fm.data?.[e]) { + delete form.fm?.data[e]; + } + }); + } const submit = async (fm: FMLocal) => { fm.render(); if (typeof onSubmit === "function") { diff --git a/comps/filter/MasterFilter.tsx b/comps/filter/MasterFilter.tsx index e1cf96a..085ef94 100755 --- a/comps/filter/MasterFilter.tsx +++ b/comps/filter/MasterFilter.tsx @@ -43,11 +43,12 @@ export const MasterFilter: FC = ({ if (!isEditor) { const wf = getFilter(name); if (wf) { - if (wf.filter.ref[_item.id]) { + if (wf.filter.ref?.[_item.id]) { filter.data = wf.filter.ref[_item.id].data; filter.raw_status = "ready"; filter.render(); } else { + filter.data = {}; if (mode === "raw" && onLoad) { if (filter.raw_status === "init") { filter.raw_status = "loading"; @@ -55,8 +56,24 @@ export const MasterFilter: FC = ({ if (data instanceof Promise) { data.then((e) => { filter.data = e; + if (typeof onSubmit === "function") { + const data = onSubmit({ data: e } as any); + + if (data instanceof Promise) { + data.then((ex) => { + filter.data = { + __status: "submit", + ...e, + _where: ex, + }; + filter.render(); + }); + } + console.log({ data }); + } filter.raw_status = "ready"; filter.render(); + }); } else { filter.raw_status = "ready"; @@ -69,6 +86,9 @@ export const MasterFilter: FC = ({ wf.filter.ref[_item.id] = filter; wf.list.render(); } + } else { + filter.raw_status = "ready"; + filter.render(); } }, []); diff --git a/comps/filter/gen/gen-filter.ts b/comps/filter/gen/gen-filter.ts index 0064ef3..3d69b0e 100755 --- a/comps/filter/gen/gen-filter.ts +++ b/comps/filter/gen/gen-filter.ts @@ -1,5 +1,411 @@ -export const generateFilter = ( - data: any, - item: PrasiItem, - commit: boolean -) => {}; +export const generateFilter = (data: any, item: PrasiItem, commit: boolean) => { + console.log("log", { data, item, commit }); +}; + +const frameFilter = { + dim: { h: "full", w: "full", hUnit: "px", wUnit: "px" }, + name: "Wrapped", + type: "item", + childs: [ + { + bg: { pos: "center", size: "cover", color: "" }, + dim: { h: "full", w: "full", hUnit: "px", wUnit: "px" }, + name: "Wrapped", + type: "item", + childs: [ + { + id: "r9u5j1gxxbuv73x8magw7smp", + adv: { + js: '{child}', + css: "", + jsBuilt: + 'const _jsxFileName = "[item: scroll-area - ehqmu8gsesbvqyxmiw8l580t]";render (React.createElement(ScrollArea, { className: cx(props.className, ""), orientation: orientation, __self: this, __source: {fileName: _jsxFileName, lineNumber: 1}}, child))', + }, + dim: { h: "full", w: "full" }, + name: "scroll-area", + type: "item", + childs: [ + { + name: "jsx:child", + id: "c7nakvqt2ih6zbbrnq59omup", + }, + ], + script: { + props: { + orientation: { value: '"vertical"', valueBuilt: '"vertical"' }, + }, + }, + component: { + id: "bb74d83b-5fd5-45a5-902d-f2f2ec8a48a7", + props: { + child: { + idx: 1, + meta: { type: "content-element" }, + name: "new_prop_1", + type: "string", + value: '"hello"', + content: { + bg: { pos: "center", size: "cover", color: "" }, + id: "vpvydv6rjhrtw6j9xkgl2t8f", + adv: { js: "", css: "", jsBuilt: "render ()" }, + dim: { h: "full", w: "full", hUnit: "px", wUnit: "px" }, + name: "child", + type: "item", + childs: [ + { + bg: { pos: "center", size: "cover", color: "" }, + id: "j1jtff4t8hvk4c2zn2spseww", + adv: { + js: '
\n {children}\n
', + jsBuilt: + 'const _jsxFileName = "[item: absolute - bs6mzs6otarkqrqciv6hd0to]";render (React.createElement(\'div\', { ...props, className: cx(props.className, ""), id: "cek", __self: this, __source: {fileName: _jsxFileName, lineNumber: 1}}\n , children\n))', + }, + dim: { h: "full", w: "full", hUnit: "px", wUnit: "px" }, + name: "absolute", + type: "item", + childs: [ + { + id: "tlfpdpv1g6y7f7klumtbecet", + dim: { + h: "fit", + w: "full", + hUnit: "px", + wUnit: "px", + }, + name: "container", + type: "item", + childs: [ + { + id: "epmv1gh58uso1iyi747oqlpf", + adv: { + js: '
\n {children}\n
', + jsBuilt: + 'render(/* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "form-fields") }, children));\n', + }, + dim: { + h: "full", + w: "full", + hUnit: "px", + wUnit: "px", + }, + name: "fields-filter", + type: "item", + childs: [], + layout: { + dir: "row", + gap: 0, + wrap: "flex-wrap", + align: "top-left", + }, + script: {}, + }, + ], + hidden: false, + }, + ], + hidden: false, + script: {}, + padding: { b: 0, l: 0, r: 5, t: 0 }, + }, + ], + script: {}, + }, + valueBuilt: '"hello"', + jsxCalledBy: [ + "yych4cm4do7t4jt0d42dasrk", + "ehqmu8gsesbvqyxmiw8l580t", + ], + }, + orientation: { + idx: 1, + meta: { + type: "option", + options: '["horizontal", "vertical"]', + optionsBuilt: '["horizontal", "vertical"]', + }, + name: "new_prop_1", + type: "string", + value: '"vertical"', + valueBuilt: '"vertical"', + }, + }, + ref_ids: {}, + useStyle: true, + }, + hidden: false, + }, + ], + hidden: false, + }, + { + id: "s9kb580m1bjmpe4xj9dtkgnz", + dim: { h: "fit", w: "full", hUnit: "px", wUnit: "px" }, + name: "Wrapped", + type: "item", + childs: [ + { + id: "hf0pxf4slu2xqhcuoropnkc6", + dim: { h: "fit", w: "full", hUnit: "px", wUnit: "px" }, + name: "Reset", + type: "item", + childs: [ + { + id: "jvnbd14f1sgcnmdhy4dcfuo4", + adv: { + js: ' {\n if (!isEditor) on_click(e);\n }}\n variant={variant !== "primary" ? variant : undefined}\n size={size !== "default" ? size : undefined}\n>\n {label}\n', + css: "& {\n display: flex;\n\n &:hover {\n cursor: pointer;\n\n\n\n\n\n // &.mobile {}\n // &.desktop {}\n // &:hover {}\n }\n}", + jsBuilt: + 'render(/* @__PURE__ */ React.createElement(\n Button,\n {\n ...props,\n onClick: (e) => {\n if (!isEditor)\n on_click(e);\n },\n variant: variant !== "primary" ? variant : void 0,\n size: size !== "default" ? size : void 0\n },\n label\n));\n', + }, + dim: { h: "full", w: "full" }, + name: "button", + type: "item", + childs: [ + { + name: "jsx: label", + id: "k59ppuxhzf4tnkb4b4enyxxe", + }, + ], + mobile: { linktag: {} }, + script: { + props: { + size: { value: ' "default";\n', valueBuilt: ' "default";\n' }, + variant: { value: '"ghost"', valueBuilt: '"ghost"' }, + on_click: { + value: + 'async (e) => {\r\n fm.data = {};\r\n filter.data = {};\r\n filter.render();\r\n fm.render();\r\n await fm.submit();\r\n sheet.close();\r\n // const res = getFilter("root");\r\n // res.list.reload();\r\n}', + valueBuilt: + 'async (e) => {\r\n fm.data = {};\r\n filter.data = {};\r\n filter.render();\r\n fm.render();\r\n await fm.submit();\r\n sheet.close();\r\n // const res = getFilter("root");\r\n // res.list.reload();\r\n}', + }, + }, + }, + component: { + id: "a15d152d-0118-408f-89f1-f6b2dfbd2e05", + props: { + size: { + idx: 5, + meta: { + type: "option", + options: + '["default", "xs", "sm", "lg", "icon", "nosize"]', + optionsBuilt: + ' ["default", "xs", "sm", "lg", "icon", "nosize"];\n', + }, + name: "prop_5", + type: "string", + value: '"default"', + valueBuilt: ' "default";\n', + }, + label: { + idx: 1, + meta: { type: "content-element" }, + name: "prop_1", + type: "string", + value: '"hello"', + content: { + id: "bb91ryll6mtk827zpibo6k65", + adv: { + js: '
\n {children}\n
', + css: "", + jsBuilt: + 'render(/* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "") }, children));\n', + }, + dim: { h: "full", w: "full" }, + name: "label", + type: "item", + childs: [ + { + id: "zhmnkaup9uxpou42lyn4splr", + adv: { + js: '
\n Reset\n
', + css: "", + jsBuilt: + 'const _jsxFileName = "[item: new_text - feo7cgson0fo2zjjujwqkr8l]";render (React.createElement(\'div\', { ...props, className: cx(props.className, ""), __self: this, __source: {fileName: _jsxFileName, lineNumber: 1}}, "Reset"\n\n))', + }, + dim: { h: "full", w: "full" }, + html: "submit", + name: "new_text", + text: "", + type: "text", + layout: { dir: "col", gap: 0, align: "center" }, + script: {}, + }, + ], + script: {}, + }, + valueBuilt: '"hello"', + jsxCalledBy: [ + "frq12uxc65i9zn8myzan4huk", + "q278u9p4cejubvfwqc72ey73", + ], + }, + variant: { + idx: 3, + meta: { + type: "option", + options: + '["primary", "secondary", "outline", "ghost", "link", "destructive","no-style"]', + option_mode: "button", + optionsBuilt: + ' ["primary", "secondary", "outline", "ghost", "link", "destructive", "no-style"];\n', + }, + name: "prop_3", + type: "string", + value: '"ghost"', + valueBuilt: '"ghost"', + }, + on_click: { + idx: 1, + meta: { type: "text" }, + name: "prop_1", + type: "string", + value: + 'async (e: React.MouseEvent) => {\r\n fm.data = {};\r\n filter.data = {};\r\n filter.render();\r\n fm.render();\r\n await fm.submit();\r\n sheet.close();\r\n // const res = getFilter("root");\r\n // res.list.reload();\r\n}', + valueBuilt: + 'async (e) => {\r\n fm.data = {};\r\n filter.data = {};\r\n filter.render();\r\n fm.render();\r\n await fm.submit();\r\n sheet.close();\r\n // const res = getFilter("root");\r\n // res.list.reload();\r\n}', + }, + }, + }, + originalId: "q278u9p4cejubvfwqc72ey73", + }, + ], + padding: { b: 10, l: 10, r: 0, t: 10 }, + }, + { + id: "zidglf2tal6pgxe6c1ey7i5x", + dim: { h: "fit", w: "full", hUnit: "px", wUnit: "px" }, + name: "Apply", + type: "item", + childs: [ + { + id: "hjaeik76bqh3ufszscmzw0bm", + adv: { + js: ' {\n if (!isEditor) on_click(e);\n }}\n variant={variant !== "primary" ? variant : undefined}\n size={size !== "default" ? size : undefined}\n>\n {label}\n', + css: "& {\n display: flex;\n\n &:hover {\n cursor: pointer;\n\n\n\n\n\n // &.mobile {}\n // &.desktop {}\n // &:hover {}\n }\n}", + jsBuilt: + 'render(/* @__PURE__ */ React.createElement(\n Button,\n {\n ...props,\n onClick: (e) => {\n if (!isEditor)\n on_click(e);\n },\n variant: variant !== "primary" ? variant : void 0,\n size: size !== "default" ? size : void 0\n },\n label\n));\n', + }, + dim: { h: "full", w: "full" }, + name: "button", + type: "item", + childs: [ + { + name: "jsx: label", + id: "w8i2j4uq3a186ozueanxisx9", + originalId: "hglwmigw09h2b8a9vlz2cme5", + }, + ], + mobile: { linktag: {} }, + script: { + props: { + size: { value: ' "default";\n', valueBuilt: ' "default";\n' }, + variant: { + value: ' "primary";\n', + valueBuilt: ' "primary";\n', + }, + on_click: { + value: + 'async (e) => {\r\n await fm.submit();\r\n const res = getFilter("root");\r\n res.list.reload();\r\n sheet.close();\r\n}', + valueBuilt: + 'async (e) => {\r\n await fm.submit();\r\n const res = getFilter("root");\r\n res.list.reload();\r\n sheet.close();\r\n}', + }, + }, + }, + component: { + id: "a15d152d-0118-408f-89f1-f6b2dfbd2e05", + props: { + size: { + idx: 5, + meta: { + type: "option", + options: + '["default", "xs", "sm", "lg", "icon", "nosize"]', + optionsBuilt: + ' ["default", "xs", "sm", "lg", "icon", "nosize"];\n', + }, + name: "prop_5", + type: "string", + value: '"default"', + valueBuilt: ' "default";\n', + }, + label: { + idx: 1, + meta: { type: "content-element" }, + name: "prop_1", + type: "string", + value: '"hello"', + content: { + id: "dlq5kemqyq8d0os6uu34l4wd", + adv: { + js: '
\n {children}\n
', + css: "", + jsBuilt: + 'render(/* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "") }, children));\n', + }, + dim: { h: "full", w: "full" }, + name: "label", + type: "item", + childs: [ + { + id: "nbho83c6uggcc4mxjn0e2tr9", + adv: { + js: '
\n Apply\n
', + css: "", + jsBuilt: + 'const _jsxFileName = "[item: new_text - to0gkiai6fbns9utxj6re1pw]";render (React.createElement(\'div\', { ...props, className: cx(props.className, ""), __self: this, __source: {fileName: _jsxFileName, lineNumber: 1}}, "Apply"\n\n))', + }, + dim: { h: "full", w: "full" }, + html: "submit", + name: "new_text", + text: "", + type: "text", + layout: { dir: "col", gap: 0, align: "center" }, + script: {}, + }, + ], + script: {}, + }, + valueBuilt: '"hello"', + jsxCalledBy: [ + "frq12uxc65i9zn8myzan4huk", + "q278u9p4cejubvfwqc72ey73", + ], + }, + variant: { + idx: 3, + meta: { + type: "option", + options: + '["primary", "secondary", "outline", "ghost", "link", "destructive","no-style"]', + option_mode: "button", + optionsBuilt: + ' ["primary", "secondary", "outline", "ghost", "link", "destructive", "no-style"];\n', + }, + name: "prop_3", + type: "string", + value: '"primary"', + valueBuilt: ' "primary";\n', + }, + on_click: { + idx: 1, + meta: { type: "text" }, + name: "prop_1", + type: "string", + value: + 'async (e: React.MouseEvent) => {\r\n await fm.submit();\r\n const res = getFilter("root");\r\n res.list.reload();\r\n sheet.close();\r\n}', + valueBuilt: + 'async (e) => {\r\n await fm.submit();\r\n const res = getFilter("root");\r\n res.list.reload();\r\n sheet.close();\r\n}', + }, + }, + }, + originalId: "q278u9p4cejubvfwqc72ey73", + }, + ], + padding: { b: 10, l: 10, r: 0, t: 10 }, + }, + ], + layout: { dir: "row", gap: 0, wrap: "flex-nowrap", align: "top-left" }, + padding: { b: 0, l: 5, r: 5, t: 0 }, + }, + ], +}; diff --git a/comps/form/base/BaseField.tsx b/comps/form/base/BaseField.tsx index 59408b7..f8cbb92 100755 --- a/comps/form/base/BaseField.tsx +++ b/comps/form/base/BaseField.tsx @@ -56,7 +56,7 @@ export const BaseField = (prop: { "filled" )} > - {arg.show_label !== "n" &&