@duxweb/dvha-pro 1.1.28 → 1.1.30

package/dist/esm/components/designEditor/editor.js

@@ -1,17 +1,17 @@
-import { defineComponent as f, provide as g, watch as d, ref as x, createVNode as a } from "vue";
-import { useI18n as v } from "@duxweb/dvha-core";
-import u from "clsx";
-import { cloneDeep as i } from "lodash-es";
-import { NScrollbar as b } from "naive-ui";
-import w from "short-unique-id";
-import { VueDraggable as h } from "vue-draggable-plus";
-import { DuxCard as y } from "../card/card.js";
+import { defineComponent as v, provide as x, watch as i, createVNode as t } from "vue";
+import { useI18n as h } from "@duxweb/dvha-core";
+import d from "clsx";
+import { cloneDeep as s } from "lodash-es";
+import { NScrollbar as w } from "naive-ui";
+import y from "short-unique-id";
+import { VueDraggable as D } from "vue-draggable-plus";
+import { DuxCard as k } from "../card/card.js";
 import "@vueuse/core";
-import { duxFormEditorGrid as D } from "./components/grid.js";
-import { useEditor as k } from "./editor/hook.js";
-import { DuxWidgetEditorPreview as c } from "./editor/preview.js";
-import { WidgetEditorSetting as C } from "./editor/setting.js";
-const M = /* @__PURE__ */ f({
+import { duxFormEditorGrid as E } from "./components/grid.js";
+import { useEditor as C } from "./editor/hook.js";
+import { DuxWidgetEditorPreview as u } from "./editor/preview.js";
+import { WidgetEditorSetting as U } from "./editor/setting.js";
+const O = /* @__PURE__ */ v({
   name: "DuxDesignEditor",
   props: {
     data: Object,
@@ -22,86 +22,81 @@ const M = /* @__PURE__ */ f({
     actionRender: Function,
     previewWrapper: Function
   },
-  setup(r) {
+  setup(l) {
     const {
       t: o
-    } = v(), t = k({
-      settingPage: r.settingPage
+    } = h(), a = C({
+      settingPage: l.settingPage
     });
-    g("editor.use", t), d([() => r.components, () => r.groups], () => {
-      t.clearGroup(), t.clearComponent(), t.addGroup({
+    x("editor.use", a), i([() => l.components, () => l.groups], () => {
+      a.clearGroup(), a.clearComponent(), a.addGroup({
         name: "layout",
         label: o("components.designEditor.layout") || "Layout",
         icon: "i-tabler:layout"
-      }), r.groups?.forEach((e) => {
-        t.addGroup(e);
-      }), t.addComponent(D(o)), r.components?.forEach((e) => {
-        t.addComponent(e);
+      }), l.groups?.forEach((e) => {
+        a.addGroup(e);
+      }), a.addComponent(E(o)), l.components?.forEach((e) => {
+        a.addComponent(e);
       });
     }, {
       immediate: !0,
       deep: !0
     });
-    const l = x(), {
-      randomUUID: p
-    } = new w({
+    const {
+      randomUUID: g
+    } = new y({
       length: 10
     }), m = (e) => ({
-      key: p(),
+      key: g(),
       name: e.name,
-      options: i(e.settingDefault)
+      options: s(e.settingDefault)
     });
-    return d(() => r.data, (e) => {
-      const n = r.settingPage?.default || {};
-      t.value.value = {
+    i(() => l.data, (e) => {
+      const r = l.settingPage?.default || {};
+      a.value.value = {
         config: {
-          ...n,
-          ...i(e?.config || {})
+          ...r,
+          ...s(e?.config || {})
         },
-        data: i(e?.data || [])
+        data: s(e?.data || [])
       };
     }, {
       deep: !0,
       immediate: !0
-    }), d(t.value, (e) => {
-      r.onUpdateData?.(e);
+    }), i(a.value, (e) => {
+      l.onUpdateData?.(e);
     }, {
       deep: !0
-    }), () => a(y, {
+    });
+    const c = ["bg-red-500", "bg-orange-500", "bg-amber-500", "bg-yellow-500", "bg-lime-500", "bg-green-500", "bg-emerald-500", "bg-teal-500", "bg-cyan-500", "bg-sky-500", "bg-blue-500", "bg-indigo-500", "bg-violet-500", "bg-purple-500", "bg-fuchsia-500", "bg-pink-500", "bg-rose-500"];
+    return () => t(k, {
       class: "h-full",
       shadow: !0
     }, {
-      default: () => [a("div", {
-        class: "h-full flex flex-row  text-default"
-      }, [a("div", {
-        class: "flex-none flex flex-col gap-2  border-r border-default bg-default p-2"
-      }, [a(s, {
-        title: o("components.designEditor.all") || "All",
-        icon: "i-tabler:hexagons",
-        active: !l.value,
-        onClick: () => {
-          l.value = void 0;
-        }
-      }, null), t.group.value?.map((e, n) => a(s, {
-        key: n,
-        active: l.value === e.name,
-        title: e.label,
-        icon: e.icon,
-        onClick: () => {
-          l.value = e.name;
-        }
-      }, null))]), a("div", {
-        class: "flex-none text-xs w-180px bg-default",
-        id: "comp-list"
-      }, [a(b, null, {
-        default: () => [a("div", {
-          class: "flex flex-col gap-4 p-2"
-        }, [t.tree.value?.filter((e) => l.value ? e.name === l.value : !0).map((e) => a("div", {
+      default: () => [t("div", {
+        class: "h-full w-full relative text-default bg-muted rounded-md"
+      }, [t("div", {
+        class: "absolute top-4 left-4 bottom-4 z-10"
+      }, [t("div", {
+        class: "h-full w-220px bg-default shadow rounded"
+      }, [t("div", {
+        class: "h-full flex flex-col"
+      }, [t(w, {
+        class: "flex-1 min-h-0"
+      }, {
+        default: () => [t("div", {
+          class: "p-4 space-y-4",
+          id: "comp-list"
+        }, [a.tree.value?.filter((e) => e.children && e.children.length > 0).map((e, r) => t("div", {
           key: e.name,
-          class: "flex flex-col gap-2"
-        }, [a("div", {
-          class: "bg-muted border border-muted rounded p-2 flex justify-center"
-        }, [e.label]), a(h, {
+          class: "space-y-2"
+        }, [t("div", {
+          class: "flex items-center gap-2 text-sm px-1"
+        }, [t("div", {
+          class: d(["size-4", e.icon])
+        }, null), t("span", {
+          class: "truncate"
+        }, [e.label])]), t(D, {
           modelValue: e.children || [],
           animation: 150,
           group: {
@@ -111,52 +106,52 @@ const M = /* @__PURE__ */ f({
           },
           sort: !1,
           clone: m,
-          class: "grid grid-cols-2 items-start gap-2 "
+          class: "space-y-2"
         }, {
-          default: () => [e.children?.map((n) => a("div", {
-            key: n.name,
-            class: "border border-muted rounded-sm p-2 flex flex-col items-center gap-2 cursor-pointer hover:bg-muted  edit-drag"
-          }, [a("div", {
-            class: u(["size-6", n.icon])
-          }, null), a("div", {
-            class: "truncate whitespace-nowrap px-2 overflow-hidden"
-          }, [n.label])]))]
-        })]))])]
-      })]), a("div", {
-        class: "flex-1 shadow-sm flex flex-col items-center p-6 overflow-auto",
+          default: () => [e.children?.map((n, p) => {
+            const f = (r * 20 + p) % c.length, b = c[f];
+            return t("div", {
+              key: n.name,
+              class: "rounded-lg px-3 py-2 cursor-move transition-all bg-default dark:bg-muted hover:bg-elevated edit-drag flex items-center gap-3"
+            }, [t("div", {
+              class: d(["size-8 rounded-lg flex items-center justify-center flex-shrink-0", b])
+            }, [t("div", {
+              class: d(["size-4 text-white", n.icon])
+            }, null)]), t("div", {
+              class: "flex-1 min-w-0"
+            }, [t("div", {
+              class: "text-sm font-medium truncate"
+            }, [n.label]), n.description && t("div", {
+              class: "text-xs truncate opacity-80"
+            }, [n.description])])]);
+          })]
+        })])), a.tree.value?.filter((e) => e.children && e.children.length > 0).length === 0 && t("div", {
+          class: "text-xs text-muted text-center py-4"
+        }, [o("components.designEditor.empty") || "No components"])])]
+      })])])]), t("div", {
+        class: "absolute inset-0 shadow-sm flex flex-col items-center p-6 overflow-auto",
         style: "background: linear-gradient(45deg, rgba(0,0,0, 0.1) 25%, transparent 25%), linear-gradient(-45deg, rgba(0,0,0, 0.1) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(0,0,0, 0.1) 75%), linear-gradient(-45deg, transparent 75%, rgba(0,0,0, 0.1) 75%); background-size: 20px 20px; background-position: 0 0, 0 10px, 10px -10px, -10px 0px;"
-      }, [a("div", {
+      }, [t("div", {
         class: "max-w-2xl w-full flex-1 bg-default shadow p-2",
         onClick: () => {
-          t.selected.value = void 0;
+          a.selected.value = void 0;
         }
-      }, [r.previewWrapper ? r.previewWrapper(a(c, {
-        modelValue: t.value.value?.data,
-        onUpdate: (e) => t.value.value.data = e
-      }, null), t) : a(c, {
-        modelValue: t.value.value?.data,
-        onUpdate: (e) => t.value.value.data = e
-      }, null)])]), a(C, {
-        actionRender: r.actionRender
-      }, null)])]
+      }, [l.previewWrapper ? l.previewWrapper(t(u, {
+        modelValue: a.value.value?.data,
+        onUpdate: (e) => a.value.value.data = e
+      }, null), a) : t(u, {
+        modelValue: a.value.value?.data,
+        onUpdate: (e) => a.value.value.data = e
+      }, null)])]), t("div", {
+        class: "absolute top-4 right-4 bottom-4 z-10"
+      }, [t("div", {
+        class: "h-full w-300px bg-default shadow rounded"
+      }, [t(U, {
+        actionRender: l.actionRender
+      }, null)])])])]
     });
   }
 });
-function s({
-  title: r,
-  icon: o,
-  active: t,
-  onClick: l
-}) {
-  return a("div", {
-    class: u(["flex flex-col items-center px-3 py-2 hover:bg-primary/10 cursor-pointer rounded-sm", t ? "bg-primary/10 text-primary" : ""]),
-    onClick: l
-  }, [a("div", {
-    class: u(["size-4", o])
-  }, null), a("div", {
-    class: "truncate whitespace-nowrap text-default text-sm"
-  }, [r])]);
-}
 export {
-  M as DuxDesignEditor
+  O as DuxDesignEditor
 };

package/dist/esm/components/editor/aiEditor.js

@@ -45,8 +45,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../pages/page404.js";
 import "vue-draggable-plus";
 import "short-unique-id";

package/dist/esm/components/flowEditor/components/setting.js

@@ -46,8 +46,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "vue-draggable-plus";
 import "short-unique-id";

package/dist/esm/components/formEditor/base/base.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/cascader.js

@@ -48,8 +48,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/checkbox.js

@@ -48,8 +48,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/color.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/date.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/dynamicInput.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/dynamicTags.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/editor.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/fileUpload.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/imageUpload.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/input.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/inputNumber.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/radio.js

@@ -48,8 +48,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/region.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/select.js

@@ -48,8 +48,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/sider.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/switch.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/time.js

@@ -47,8 +47,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";

package/dist/esm/components/formEditor/components/treeSelect.js

@@ -48,8 +48,8 @@ import "unocss/preset-wind4";
 import "@vee-validate/i18n/dist/locale/en.json";
 import "@vee-validate/i18n/dist/locale/zh_CN.json";
 import "vee-validate";
-import "vue-command-palette";
 import "@duxweb/dvha-naiveui";
+import "vue-command-palette";
 import "../../../pages/page404.js";
 import "lodash-es/cloneDeep";
 import "short-unique-id";