@duxweb/dvha-pro 1.0.18 → 1.0.20

package/dist/esm/components/data/dynamicSelect.js

@@ -27,11 +27,22 @@ import "../../pages/page404.js";
 import "@iconify-json/tabler/icons.json";
 import "mime";
 import "vue-draggable-plus";
+import "vue3-ace-editor";
+import "ace-builds/src-noconflict/mode-vue";
+import "ace-builds/src-noconflict/mode-javascript";
+import "ace-builds/src-noconflict/mode-html";
+import "ace-builds/src-noconflict/mode-json";
+import "ace-builds/src-noconflict/mode-json5";
+import "ace-builds/src-noconflict/theme-tomorrow_night";
+import "ace-builds/src-noconflict/theme-tomorrow";
+import "ace-builds/src-noconflict/ext-searchbox";
+import "ace-builds/src-noconflict/ext-language_tools";
+import "ace-builds/src-noconflict/mode-snippets";
 import { useModal as C } from "../../hooks/modal.js";
 import "dayjs";
 import "@tanstack/vue-query";
 import "pinia";
-const ot = /* @__PURE__ */ y({
+const vt = /* @__PURE__ */ y({
   name: "DuxDynamicSelect",
   props: {
     rowKey: {
@@ -54,32 +65,32 @@ const ot = /* @__PURE__ */ y({
     }
   },
   setup(t, {
-    emit: n
+    emit: p
   }) {
-    const e = K(t, "value", n, {
+    const e = K(t, "value", p, {
       passive: !0,
       defaultValue: t.defaultValue,
       deep: !0
-    }), p = C(), c = D(), {
+    }), n = C(), c = D(), {
       t: f
-    } = S(), r = h(!0);
-    return d([e, r], () => {
-      var m;
-      if (!r.value || !e.value || e.value.length === 0)
+    } = S(), i = h(!0);
+    return d([e, i], () => {
+      var r;
+      if (!i.value || !e.value || e.value.length === 0)
         return;
-      const o = ((m = e.value) == null ? void 0 : m.map((a) => a[t.rowKey])) || [];
+      const o = ((r = e.value) == null ? void 0 : r.map((m) => m[t.rowKey])) || [];
       c.request({
         path: t.path,
         query: {
           ids: (o == null ? void 0 : o.join(",")) || ""
         }
-      }).then((a) => {
+      }).then((m) => {
         var l;
-        r.value = !1, (l = a == null ? void 0 : a.data) == null || l.forEach((i, u) => {
-          e.value.some((v) => v[t.rowKey] === i[t.rowKey]) ? e.value[u] = {
+        i.value = !1, (l = m == null ? void 0 : m.data) == null || l.forEach((a, u) => {
+          e.value.some((v) => v[t.rowKey] === a[t.rowKey]) ? e.value[u] = {
             ...e.value[u],
-            ...i
-          } : e.value.push(i);
+            ...a
+          } : e.value.push(a);
         });
       });
     }), () => s(A, {
@@ -87,7 +98,7 @@ const ot = /* @__PURE__ */ y({
       "onUpdate:value": (o) => e.value = o,
       columns: t.columns,
       onCreate: () => {
-        p.show({
+        n.show({
           component: () => import("./selectModal.js"),
           componentProps: {
             path: t.path,
@@ -97,8 +108,8 @@ const ot = /* @__PURE__ */ y({
           width: 1e3,
           title: f("buttons.select")
         }).then((o) => {
-          r.value = !1, o == null || o.forEach((m) => {
-            e.value.some((a) => a[t.rowKey] === m[t.rowKey]) || e.value.push(m);
+          i.value = !1, o == null || o.forEach((r) => {
+            e.value.some((m) => m[t.rowKey] === r[t.rowKey]) || e.value.push(r);
           });
         });
       }
@@ -106,5 +117,5 @@ const ot = /* @__PURE__ */ y({
   }
 });
 export {
-  ot as DuxDynamicSelect
+  vt as DuxDynamicSelect
 };

package/dist/esm/components/data/selectModal.js

@@ -1,6 +1,6 @@
-import { defineComponent as h, computed as C, ref as r, watch as b, createVNode as i, Fragment as x, h as w, mergeProps as z, isVNode as P } from "vue";
+import { defineComponent as h, computed as C, ref as m, watch as b, createVNode as i, Fragment as x, h as w, mergeProps as z, isVNode as P } from "vue";
 import { useI18n as j, useJsonSchema as k } from "@duxweb/dvha-core";
-import { NButton as u, NDataTable as K } from "naive-ui";
+import { NButton as p, NDataTable as K } from "naive-ui";
 import "vue-router";
 import "@overlastic/vue";
 import "clsx";
@@ -27,14 +27,25 @@ import "@duxweb/dvha-naiveui";
 import "../../pages/page404.js";
 import "@iconify-json/tabler/icons.json";
 import "mime";
+import "vue3-ace-editor";
+import "ace-builds/src-noconflict/mode-vue";
+import "ace-builds/src-noconflict/mode-javascript";
+import "ace-builds/src-noconflict/mode-html";
+import "ace-builds/src-noconflict/mode-json";
+import "ace-builds/src-noconflict/mode-json5";
+import "ace-builds/src-noconflict/theme-tomorrow_night";
+import "ace-builds/src-noconflict/theme-tomorrow";
+import "ace-builds/src-noconflict/ext-searchbox";
+import "ace-builds/src-noconflict/ext-language_tools";
+import "ace-builds/src-noconflict/mode-snippets";
 import "dayjs";
 import "@tanstack/vue-query";
 import { useTable as D } from "../../hooks/table.js";
 import "pinia";
-function p(e) {
-  return typeof e == "function" || Object.prototype.toString.call(e) === "[object Object]" && !P(e);
+function u(t) {
+  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !P(t);
 }
-const ue = /* @__PURE__ */ h({
+const bt = /* @__PURE__ */ h({
   name: "Select",
   props: {
     path: String,
@@ -49,13 +60,13 @@ const ue = /* @__PURE__ */ h({
     onConfirm: Function,
     onClose: Function
   },
-  setup(e) {
+  setup(t) {
     const {
-      t: l
+      t: n
     } = j(), f = C(() => [{
       type: "selection",
       fixed: "left"
-    }, ...e.columns || []]), m = r({}), n = r({
+    }, ...t.columns || []]), l = m({}), a = m({
       page: 1,
       pageSize: 10
     }), {
@@ -65,72 +76,72 @@ const ue = /* @__PURE__ */ h({
       pageSizes: S,
       checkeds: v
     } = D({
-      path: e.path || "",
+      path: t.path || "",
       columns: f.value || [],
-      filters: m,
-      pagination: n.value
-    }), c = r([]);
-    b(v, (t) => {
-      var a;
-      c.value = (a = g.value) == null ? void 0 : a.filter((o) => t.includes(o[e.rowKey]));
+      filters: l,
+      pagination: a.value
+    }), c = m([]);
+    b(v, (e) => {
+      var r;
+      c.value = (r = g.value) == null ? void 0 : r.filter((o) => e.includes(o[t.rowKey]));
     });
     const y = k({
-      data: e.filterSchema || [],
+      data: t.filterSchema || [],
       context: {
-        filter: m
+        filter: l
       }
     });
     return () => i(N, {
-      title: l("components.data.selectTitle"),
+      title: n("components.data.selectTitle"),
       onClose: () => {
-        var t;
-        (t = e.onClose) == null || t.call(e);
+        var e;
+        (e = t.onClose) == null || e.call(t);
       }
     }, {
       default: () => i("div", {
         class: "flex flex-col gap-4"
-      }, [e.filterSchema && i("div", {
+      }, [t.filterSchema && i("div", {
         class: "grid grid-cols-1 md:grid-cols-4 gap-2"
       }, [w(y.render)]), i(K, z({
         bordered: !1,
         maxHeight: 400,
-        rowKey: (t) => t[e.rowKey]
+        rowKey: (e) => e[t.rowKey]
       }, d.value, {
         pagination: {
-          page: n.value.page,
-          pageSize: n.value.pageSize,
+          page: a.value.page,
+          pageSize: a.value.pageSize,
           pageCount: s.value,
           pageSizes: S,
-          onUpdatePage: (t) => {
-            n.value.page = t;
+          onUpdatePage: (e) => {
+            a.value.page = e;
           },
-          onUpdatePageSize: (t) => {
-            n.value.pageSize = t;
+          onUpdatePageSize: (e) => {
+            a.value.pageSize = e;
           }
         }
       }), null)]),
       footer: () => {
-        let t, a;
-        return i(x, null, [i(u, {
+        let e, r;
+        return i(x, null, [i(p, {
           onClick: () => {
             var o;
-            (o = e.onClose) == null || o.call(e);
+            (o = t.onClose) == null || o.call(t);
           }
-        }, p(t = l("components.button.cancel")) ? t : {
-          default: () => [t]
-        }), i(u, {
+        }, u(e = n("components.button.cancel")) ? e : {
+          default: () => [e]
+        }), i(p, {
           type: "primary",
           onClick: () => {
             var o;
-            (o = e.onConfirm) == null || o.call(e, c.value);
+            (o = t.onConfirm) == null || o.call(t, c.value);
           }
-        }, p(a = l("components.button.select")) ? a : {
-          default: () => [a]
+        }, u(r = n("components.button.select")) ? r : {
+          default: () => [r]
         })]);
       }
     });
   }
 });
 export {
-  ue as default
+  bt as default
 };

package/dist/esm/components/drawer/drawer.js

@@ -1,11 +1,12 @@
-import { defineComponent as u, defineAsyncComponent as r, createVNode as t, Suspense as d } from "vue";
+import { defineComponent as u, defineAsyncComponent as c, createVNode as t, Suspense as d } from "vue";
 import { useExtendOverlay as f } from "@overlastic/vue";
-import { NDrawer as s, NButton as m, NSpin as b } from "naive-ui";
+import { NDrawer as r, NSpin as s } from "naive-ui";
 const w = /* @__PURE__ */ u({
   name: "DuxDrawer",
   props: {
     title: String,
     width: [Number, String],
+    maxWidth: [Number],
     placement: {
       type: String,
       default: "right"
@@ -20,17 +21,18 @@ const w = /* @__PURE__ */ u({
     const {
       visible: i,
       resolve: a,
-      reject: n,
+      reject: l,
       vanish: o
     } = f({
       duration: 1e3
-    }), l = (e == null ? void 0 : e.componentProps) || {};
-    l.onConfirm = a, l.onClose = n;
-    const c = typeof e.component == "function" ? r(e.component) : e.component;
-    return () => t(s, {
+    }), n = (e == null ? void 0 : e.componentProps) || {};
+    n.title = e.title, n.onConfirm = a, n.onClose = l;
+    const m = typeof e.component == "function" ? c(e.component) : e.component;
+    return () => t(r, {
       closeOnEsc: !1,
       maskClosable: !1,
-      minWidth: 400,
+      minWidth: 200,
+      maxWidth: (e == null ? void 0 : e.maxWidth) || 800,
       defaultWidth: (e == null ? void 0 : e.width) || 400,
       resizable: !0,
       placement: e.placement,
@@ -40,28 +42,15 @@ const w = /* @__PURE__ */ u({
         o();
       },
       onEsc: () => {
-        n();
-      }
+        l();
+      },
+      autoFocus: !1
     }, {
       default: () => [t("div", {
-        class: "h-full flex flex-col"
-      }, [t("div", {
-        class: "flex justify-between items-center px-4 py-3 border-b border-default"
-      }, [t("div", {
-        class: "text-base"
-      }, [e == null ? void 0 : e.title]), t("div", null, [t(m, {
-        quaternary: !0,
-        size: "small",
-        color: "default",
-        class: "!px-1 h-6",
-        onClick: () => n()
-      }, {
-        default: () => [t("div", {
-          class: "i-tabler:x w-5 h-5"
-        }, null)]
-      })])]), t(d, null, {
-        default: () => t(c, l, null),
-        fallback: () => t(b, {
+        class: "h-full"
+      }, [t(d, null, {
+        default: () => t(m, n, null),
+        fallback: () => t(s, {
           show: !0
         }, {
           default: () => [t("div", {

package/dist/esm/components/drawer/drawerPage.js

@@ -1,28 +1,65 @@
-import { defineComponent as f, createVNode as r } from "vue";
-import { NScrollbar as p } from "naive-ui";
-const c = /* @__PURE__ */ f({
+import { defineComponent as t, ref as u, watch as d, nextTick as m, createVNode as a } from "vue";
+import { NButton as o, NScrollbar as x } from "naive-ui";
+const h = /* @__PURE__ */ t({
   name: "DuxDrawerPage",
-  props: {},
-  setup(d, {
+  props: {
+    title: String,
+    onClose: Function,
+    onConfirm: Function,
+    scrollbar: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  setup(n, {
     slots: e
   }) {
-    return () => {
-      var a;
-      return r("div", {
-        class: "flex-1 min-h-1 flex flex-col"
-      }, [r("div", {
+    const c = u();
+    return d(c, (r) => {
+      r && m(() => {
+        var i, f;
+        (f = (i = r.$el) == null ? void 0 : i.focus) == null || f.call(i);
+      });
+    }), () => {
+      var r, i, f;
+      return a("div", {
+        class: "h-full flex flex-col"
+      }, [a("div", {
+        class: "flex justify-between items-center p-2 border-b border-default"
+      }, [a("div", {
+        class: "text-base"
+      }, [n == null ? void 0 : n.title]), a("div", {
+        class: "flex items-center gap-2"
+      }, [(r = e.header) == null ? void 0 : r.call(e), a(o, {
+        quaternary: !0,
+        ref: c,
+        size: "small",
+        color: "default",
+        class: "!px-1 h-6",
+        onClick: () => {
+          var l;
+          return (l = n.onClose) == null ? void 0 : l.call(n);
+        }
+      }, {
+        default: () => [a("div", {
+          class: "i-tabler:x w-5 h-5"
+        }, null)]
+      })])]), a("div", {
         class: "flex-1 min-h-1"
-      }, [r(p, null, {
+      }, [n.scrollbar ? a(x, null, {
         default: () => {
-          var n;
-          return [(n = e.default) == null ? void 0 : n.call(e)];
+          var l;
+          return [(l = e.default) == null ? void 0 : l.call(e)];
         }
-      })]), r("div", {
-        class: "flex-none border-t border-gray-3 p-4 flex justify-end gap-2"
-      }, [(a = e.action) == null ? void 0 : a.call(e)])]);
+      }) : (i = e.default) == null ? void 0 : i.call(e)]), e.actions && a("div", {
+        class: "flex-none border-t border-muted p-4 flex justify-end gap-2"
+      }, [(f = e.actions) == null ? void 0 : f.call(e, {
+        onClose: n.onClose,
+        onConfirm: n.onConfirm
+      })])]);
     };
   }
 });
 export {
-  c as DuxDrawerPage
+  h as DuxDrawerPage
 };

package/dist/esm/components/form/formItem.js

@@ -1,7 +1,7 @@
-import { defineComponent as x, toRef as g, computed as r, watch as b, inject as h, createVNode as l, createTextVNode as y } from "vue";
+import { defineComponent as x, toRef as b, computed as r, watch as h, inject as y, createVNode as l, createTextVNode as p } from "vue";
 import { watchThrottled as j } from "@vueuse/core";
-import { useField as S } from "vee-validate";
-const p = /* @__PURE__ */ x({
+import { useField as w } from "vee-validate";
+const q = /* @__PURE__ */ x({
   name: "DuxFormItem",
   props: {
     label: String,
@@ -17,17 +17,17 @@ const p = /* @__PURE__ */ x({
     message: [String, Object]
   },
   setup(e, {
-    slots: a
+    slots: i
   }) {
-    const c = g(e.message), {
+    const c = b(e.message), {
       errorMessage: d,
       value: m,
       setErrors: f,
       validate: s
-    } = S(e.path || "", e.rule || {}, {
+    } = w(e.path || "", e.rule || {}, {
       label: e.label
     }), o = r(() => e.rule ? typeof e.rule == "string" ? e.rule.includes("required") : typeof e.rule == "object" ? "required" in e.rule : !1 : !1), n = r(() => d.value && (c.value || d.value));
-    b(n, (t) => {
+    h(n, (t) => {
       t && f(t);
     }, {
       immediate: !0
@@ -37,20 +37,20 @@ const p = /* @__PURE__ */ x({
       throttle: 300,
       deep: !0
     });
-    const u = h("dux.form", {
+    const u = y("dux.form", {
       labelPlacement: "left",
       labelWidth: 70,
       divider: !1
-    }), i = r(() => e.labelPlacement || u.labelPlacement), v = r(() => {
+    }), a = r(() => e.labelPlacement || u.labelPlacement), v = r(() => {
       let t = e.labelWidth || u.labelWidth || 70;
-      return typeof t == "number" && (t = `${t}px`), i.value === "top" || i.value === "setting" ? "auto" : t;
-    });
+      return typeof t == "number" && (t = `${t}px`), a.value !== "left" ? "auto" : t;
+    }), g = r(() => u.divider || a.value === "page");
     return () => {
       var t;
       return l("div", {
-        class: ["flex flex-col lg:items-center", i.value !== "top" ? "md:flex-row gap-2" : "gap-1", u.divider && "pb-4", i.value === "setting" ? "md:justify-between md:items-start md:gap-4" : ""]
+        class: [a.value !== "top" ? "md:flex-row gap-2" : "gap-1", g.value ? "py-6" : "", a.value === "setting" ? "md:justify-between md:items-start md:gap-4" : "", a.value === "page" ? "grid grid-cols-1 lg:grid-cols-4 px-4" : "flex flex-col lg:items-center"]
       }, [l("div", {
-        class: [i.value !== "top" && i.value !== "setting" ? "flex lg:items-center" : ""],
+        class: [a.value === "left" ? "flex lg:items-center" : ""],
         style: {
           width: v.value
         }
@@ -60,11 +60,11 @@ const p = /* @__PURE__ */ x({
         class: "relative flex items-center gap-1"
       }, [e.label, o.value && l("span", {
         class: "text-error font-mono text-xs"
-      }, [y("*")])])]), e.description && typeof e.description == "string" && l("div", {
+      }, [p("*")])])]), e.description && typeof e.description == "string" && l("div", {
         class: "text-sm text-muted"
       }, [e.description])])]), l("div", {
-        class: ["flex flex-col gap-1", i.value !== "left" ? "md:mt-1" : "", i.value === "setting" ? "flex-none" : "flex-1"]
-      }, [l("div", null, [(t = a == null ? void 0 : a.default) == null ? void 0 : t.call(a)]), e.description && typeof e.description != "string" && l("div", {
+        class: ["flex flex-col gap-1", a.value !== "left" ? "md:mt-1" : "", a.value === "setting" ? "flex-none min-w-200px" : "flex-1", a.value === "page" ? "col-span-3" : ""]
+      }, [l("div", null, [(t = i == null ? void 0 : i.default) == null ? void 0 : t.call(i)]), e.description && typeof e.description != "string" && l("div", {
         class: "text-sm text-muted"
       }, [e.description]), n.value && l("div", {
         class: "text-error"
@@ -73,5 +73,5 @@ const p = /* @__PURE__ */ x({
   }
 });
 export {
-  p as DuxFormItem
+  q as DuxFormItem
 };

package/dist/esm/components/form/formLayout.js

@@ -1,5 +1,5 @@
-import { defineComponent as a, provide as l, createVNode as t } from "vue";
-const r = /* @__PURE__ */ a({
+import { defineComponent as d, provide as i, createVNode as t } from "vue";
+const m = /* @__PURE__ */ d({
   name: "DuxFormLayout",
   props: {
     labelPlacement: {
@@ -19,20 +19,20 @@ const r = /* @__PURE__ */ a({
     }
   },
   setup(e, {
-    slots: d
+    slots: a
   }) {
-    return l("dux.form", {
+    return i("dux.form", {
       labelPlacement: e.labelPlacement,
       labelWidth: e.labelWidth,
       divider: e.divider
     }), () => {
-      var i;
+      var l;
       return t("div", {
-        class: ["flex gap-4", e.divider && "divide-y divide-muted", e.inline ? "flex-row" : "flex-col"]
-      }, [(i = d == null ? void 0 : d.default) == null ? void 0 : i.call(d)]);
+        class: ["flex ", e.divider || e.labelPlacement === "page" ? " divide-y divide-default dark:divide-gray-800" : "", e.inline ? "flex-row" : "flex-col", e.labelPlacement === "page" || e.labelPlacement === "setting" ? "container mx-auto" : "gap-4"]
+      }, [(l = a == null ? void 0 : a.default) == null ? void 0 : l.call(a)]);
     };
   }
 });
 export {
-  r as DuxFormLayout
+  m as DuxFormLayout
 };