175 lines
9.0 KiB
TypeScript
Executable File
175 lines
9.0 KiB
TypeScript
Executable File
import { createId } from "@paralleldrive/cuid2";
|
|
import { GenFormArgs } from "./types";
|
|
|
|
export const genFormSubmit = ({}: GenFormArgs) => {
|
|
return {
|
|
id: createId(),
|
|
dim: { h: "fit", w: "full", hUnit: "px", wUnit: "px" },
|
|
name: "submit",
|
|
type: "item",
|
|
adv: {
|
|
css: "",
|
|
js: '<>\n {\n /** if */\n fm.status === "ready" ? (\n /** then */\n <div {...props} className={cx(props.className, "")}>\n {children}\n </div>\n ) : (\n /** else */\n <div {...props} className={cx(props.className, "")}>\n <FieldLoading />\n </div>\n )\n }\n</>',
|
|
jsBuilt:
|
|
'render(/* @__PURE__ */ React.createElement(\n React.Fragment,\n null,\n /** if */\n fm.status === "ready" ? (\n /** then */\n /* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "") }, children)\n ) : (\n /** else */\n /* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "") }, /* @__PURE__ */ React.createElement(FieldLoading, null))\n )\n));\n',
|
|
},
|
|
childs: [
|
|
{
|
|
id: createId(),
|
|
dim: { h: "fit", w: "fit", hUnit: "px", wUnit: "px" },
|
|
name: "bottom",
|
|
type: "item",
|
|
childs: [
|
|
{
|
|
id: createId(),
|
|
adv: {
|
|
js: '<Button\n {...props}\n onClick={(e) => {\n console.log(isEditor);\n if (!isEditor) on_click(e);\n }}\n variant={variant !== "primary" ? variant : undefined}\n size={size !== "default" ? size : undefined}\n>\n {label}\n</Button>',
|
|
css: "& {\n display: flex;\n box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;\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 console.log(isEditor);\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: [],
|
|
mobile: { linktag: {} },
|
|
script: {
|
|
props: {
|
|
size: { value: ' "default";\n' },
|
|
variant: { value: ' "primary";\n' },
|
|
on_click: {
|
|
value:
|
|
" (e) => {\n e.preventDefault();\n e.stopPropagation();\n fm.submit();\n};\n",
|
|
},
|
|
},
|
|
},
|
|
component: {
|
|
id: "a15d152d-0118-408f-89f1-f6b2dfbd2e05",
|
|
props: {
|
|
size: {
|
|
idx: 5,
|
|
meta: {
|
|
type: "option",
|
|
options: '["default", "sm", "lg", "icon","nosize"]',
|
|
optionsBuilt:
|
|
' ["default", "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: createId(),
|
|
adv: {
|
|
js: '<div {...props} className={cx(props.className, "")}>\n {children}\n</div>',
|
|
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: createId(),
|
|
name: "Wrapped",
|
|
type: "item",
|
|
childs: [
|
|
{
|
|
id: createId(),
|
|
adv: {
|
|
js: '<div {...props} className={cx(props.className, "")}>\n <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeWidth="2"><path d="M16 21v-2c0-1.886 0-2.828-.586-3.414C14.828 15 13.886 15 12 15h-1c-1.886 0-2.828 0-3.414.586C7 16.172 7 17.114 7 19v2" /><path strokeLinecap="round" d="M7 8h5" /><path d="M3 9c0-2.828 0-4.243.879-5.121C4.757 3 6.172 3 9 3h7.172c.408 0 .613 0 .796.076c.184.076.329.22.618.51l2.828 2.828c.29.29.434.434.51.618c.076.183.076.388.076.796V15c0 2.828 0 4.243-.879 5.121C19.243 21 17.828 21 15 21H9c-2.828 0-4.243 0-5.121-.879C3 19.243 3 17.828 3 15z" /></g></svg>\n</div>',
|
|
css: "",
|
|
jsBuilt:
|
|
'render(/* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "") }, /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24" }, /* @__PURE__ */ React.createElement("g", { fill: "none", stroke: "currentColor", "strokeWidth": "2" }, /* @__PURE__ */ React.createElement("path", { d: "M16 21v-2c0-1.886 0-2.828-.586-3.414C14.828 15 13.886 15 12 15h-1c-1.886 0-2.828 0-3.414.586C7 16.172 7 17.114 7 19v2" }), /* @__PURE__ */ React.createElement("path", { "strokeLinecap": "round", d: "M7 8h5" }), /* @__PURE__ */ React.createElement("path", { d: "M3 9c0-2.828 0-4.243.879-5.121C4.757 3 6.172 3 9 3h7.172c.408 0 .613 0 .796.076c.184.076.329.22.618.51l2.828 2.828c.29.29.434.434.51.618c.076.183.076.388.076.796V15c0 2.828 0 4.243-.879 5.121C19.243 21 17.828 21 15 21H9c-2.828 0-4.243 0-5.121-.879C3 19.243 3 17.828 3 15z" })))));\n',
|
|
},
|
|
dim: { h: "full", w: "full" },
|
|
html: "aadd",
|
|
name: "new_text",
|
|
text: "",
|
|
type: "text",
|
|
layout: { dir: "col", gap: 0, align: "center" },
|
|
script: {},
|
|
},
|
|
{
|
|
id: createId(),
|
|
adv: {
|
|
js: '<div {...props} className={cx(props.className, "")}>\n Save\n</div>',
|
|
css: "",
|
|
jsBuilt:
|
|
'render(/* @__PURE__ */ React.createElement("div", { ...props, className: cx(props.className, "") }, "Save"));\n',
|
|
},
|
|
dim: { h: "full", w: "full" },
|
|
name: "new_item",
|
|
type: "item",
|
|
childs: [],
|
|
script: {},
|
|
},
|
|
],
|
|
layout: {
|
|
dir: "row",
|
|
gap: 10,
|
|
wrap: "flex-nowrap",
|
|
align: "top-left",
|
|
},
|
|
},
|
|
],
|
|
hidden: false,
|
|
layout: {
|
|
dir: "col",
|
|
gap: 0,
|
|
wrap: "flex-nowrap",
|
|
align: "center",
|
|
},
|
|
script: {},
|
|
},
|
|
valueBuilt: '"hello"',
|
|
},
|
|
variant: {
|
|
idx: 3,
|
|
meta: {
|
|
type: "option",
|
|
options:
|
|
'["primary", "secondary", "outline", "ghost", "link", "destructive"]',
|
|
option_mode: "button",
|
|
optionsBuilt:
|
|
' ["primary", "secondary", "outline", "ghost", "link", "destructive"];\n',
|
|
},
|
|
name: "prop_3",
|
|
type: "string",
|
|
value: '"primary"',
|
|
valueBuilt: ' "primary";\n',
|
|
},
|
|
on_click: {
|
|
idx: 1,
|
|
meta: { type: "text" },
|
|
name: "prop_1",
|
|
type: "string",
|
|
value:
|
|
"(e) => {\n e.preventDefault();\n e.stopPropagation();\n fm.submit();\n}",
|
|
valueBuilt:
|
|
" (e) => {\n e.preventDefault();\n e.stopPropagation();\n fm.submit();\n};\n",
|
|
},
|
|
},
|
|
},
|
|
},
|
|
],
|
|
layout: {
|
|
dir: "col",
|
|
gap: 0,
|
|
wrap: "flex-nowrap",
|
|
align: "center",
|
|
},
|
|
},
|
|
],
|
|
padding: { b: 10, l: 10, r: 10, t: 10 },
|
|
};
|
|
};
|