vlite3 0.9.2 → 0.9.4

package/components/NumberInput.vue2.js

@@ -1,5 +1,5 @@
 import { defineComponent as K, ref as g, watch as R, computed as a, openBlock as c, createElementBlock as m, normalizeClass as o, createVNode as x, createCommentVNode as h, createElementVNode as y, withKeys as p, withModifiers as k } from "vue";
-import b from "./Icon.vue.js";
+import f from "./Icon.vue.js";
 const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disabled", "readonly", "onKeydown"], L = ["disabled"], M = {
   key: 2,
   class: "flex flex-col h-full border-l border-input"
@@ -22,22 +22,22 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
   },
   emits: ["update:modelValue", "change", "focus", "blur"],
   setup(e, { emit: N }) {
-    const t = e, s = N, d = g(t.modelValue ?? "");
+    const l = e, s = N, d = g(l.modelValue ?? "");
     R(
-      () => t.modelValue,
-      (l) => {
-        l !== void 0 && (d.value = l);
+      () => l.modelValue,
+      (t) => {
+        t !== void 0 && (d.value = t);
       }
     );
     const z = g(null), r = a(() => {
-      const l = {
+      const t = {
         xs: { h: "h-7", text: "text-xs", px: "px-2", icon: "w-3 h-3" },
         sm: { h: "h-8", text: "text-xs", px: "px-2", icon: "w-3.5 h-3.5" },
         md: { h: "h-9", text: "text-sm", px: "px-3", icon: "w-4 h-4" },
         lg: { h: "h-10", text: "text-sm", px: "px-4", icon: "w-5 h-5" },
         xl: { h: "h-12", text: "text-lg", px: "px-5", icon: "w-6 h-6" }
       };
-      return l[t.size] || l.md;
+      return t[l.size] || t.md;
     }), C = a(() => ({
       none: "rounded-none",
       sm: "rounded-sm",
@@ -46,7 +46,7 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
       xl: "rounded-xl",
       "2xl": "rounded-2xl",
       full: "rounded-full"
-    })[t.rounded] || "rounded-md"), V = a(() => ({
+    })[l.rounded] || "rounded-md"), V = a(() => ({
       none: "rounded-l-none",
       sm: "rounded-l-sm",
       md: "rounded-l-md",
@@ -54,7 +54,7 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
       xl: "rounded-l-xl",
       "2xl": "rounded-l-2xl",
       full: "rounded-l-full"
-    })[t.rounded] || "rounded-l-md"), B = a(() => ({
+    })[l.rounded] || "rounded-l-md"), B = a(() => ({
       none: "rounded-r-none",
       sm: "rounded-r-sm",
       md: "rounded-r-md",
@@ -62,50 +62,50 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
       xl: "rounded-r-xl",
       "2xl": "rounded-r-2xl",
       full: "rounded-r-full"
-    })[t.rounded] || "rounded-r-md"), S = a(() => [
+    })[l.rounded] || "rounded-r-md"), S = a(() => [
       "flex items-center w-full relative transition-all duration-200",
-      t.disabled ? "opacity-50 cursor-not-allowed" : "",
-      t.mode === "solid" ? "bg-muted" : "",
-      t.mode === "outline" ? "border border-input bg-background" : "",
-      t.mode === "ghost" ? "bg-transparent" : "",
+      l.disabled ? "opacity-50 cursor-not-allowed" : "",
+      l.mode === "solid" ? "bg-muted" : "",
+      l.mode === "outline" ? "border border-input bg-background" : "",
+      l.mode === "ghost" ? "bg-transparent" : "",
       r.value.h,
       C.value
     ]), j = a(() => [
       "flex-1 w-full bg-transparent focus:outline-none appearance-none",
-      t.variant === "split" ? "text-center" : "text-left pl-3",
+      l.variant === "split" ? "text-center" : "text-left pl-3",
       "placeholder:text-muted-foreground/50",
       r.value.text,
-      t.disabled ? "cursor-not-allowed" : ""
+      l.disabled ? "cursor-not-allowed" : ""
     ]), w = a(() => {
-      const l = "flex items-center justify-center transition-colors active:scale-95 shrink-0 select-none", n = t.disabled ? "" : "hover:text-primary hover:bg-muted/50";
-      return t.size === "xs" || t.size, t.variant === "split" ? t.mode === "solid" ? [
-        l,
-        t.disabled ? "" : "hover:text-primary hover:bg-background/80",
+      const t = "flex items-center justify-center transition-colors active:scale-95 shrink-0 select-none", n = l.disabled ? "" : "hover:text-primary hover:bg-muted/50";
+      return l.size === "xs" || l.size, l.variant === "split" ? l.mode === "solid" ? [
+        t,
+        l.disabled ? "" : "hover:text-primary hover:bg-background/80",
         "bg-background shadow-sm rounded-full mx-1 my-0.5 aspect-square self-center h-[calc(100%-12px)] w-auto max-w-[calc(100%-12px)] flex items-center justify-center"
-      ] : [l, n, "h-full", "px-2"] : [l, n, "h-1/2 w-8 border-l border-input/50"];
-    }), u = (l) => {
-      if (t.disabled || t.readonly) return;
-      let n = l;
-      t.min !== void 0 && n < t.min && (n = t.min), t.max !== void 0 && n > t.max && (n = t.max), d.value = n, s("update:modelValue", n), s("change", n);
-    }, f = () => {
-      const l = Number(d.value) || 0;
-      u(l + t.step);
+      ] : [t, n, "h-full", "px-2"] : [t, n, "h-1/2 w-8 border-l border-input/50"];
+    }), u = (t) => {
+      if (l.disabled || l.readonly) return;
+      let n = t;
+      l.min !== void 0 && n < l.min && (n = l.min), l.max !== void 0 && n > l.max && (n = l.max), d.value = n, s("update:modelValue", n), s("change", n);
+    }, b = () => {
+      const t = Number(d.value) || 0;
+      u(t + l.step);
     }, v = () => {
-      const l = Number(d.value) || 0;
-      u(l - t.step);
-    }, F = (l) => {
-      const n = l.target, i = parseFloat(n.value);
+      const t = Number(d.value) || 0;
+      u(t - l.step);
+    }, F = (t) => {
+      const n = t.target, i = parseFloat(n.value);
       if (isNaN(i)) {
         d.value = n.value;
         return;
       }
       u(i);
-    }, I = (l) => {
-      s("blur", l);
+    }, I = (t) => {
+      s("blur", t);
       const n = parseFloat(String(d.value));
-      isNaN(n) ? u(t.min || 0) : u(n);
+      isNaN(n) ? u(l.min || 0) : u(n);
     };
-    return (l, n) => (c(), m("div", {
+    return (t, n) => (c(), m("div", {
       class: o([S.value, "overflow-hidden"])
     }, [
       e.variant === "split" ? (c(), m("button", {
@@ -119,7 +119,7 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
         disabled: e.disabled || e.min !== void 0 && Number(d.value) <= e.min,
         onClick: v
       }, [
-        x(b, {
+        x(f, {
           icon: "lucide:minus",
           class: o(r.value.icon)
         }, null, 8, ["class"])
@@ -140,7 +140,7 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
         onFocus: n[0] || (n[0] = (i) => s("focus", i)),
         onBlur: I,
         onKeydown: [
-          p(k(f, ["prevent"]), ["up"]),
+          p(k(b, ["prevent"]), ["up"]),
           p(k(v, ["prevent"]), ["down"])
         ]
       }, null, 42, q),
@@ -153,9 +153,9 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
           e.variant === "split" && e.mode !== "solid" ? B.value : ""
         ]),
         disabled: e.disabled || e.max !== void 0 && Number(d.value) >= e.max,
-        onClick: f
+        onClick: b
       }, [
-        x(b, {
+        x(f, {
           icon: "lucide:plus",
           class: o(r.value.icon)
         }, null, 8, ["class"])
@@ -165,10 +165,10 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
           type: "button",
           class: "flex-1 flex items-center justify-center hover:bg-muted/50 w-8 border-b border-input",
           disabled: e.disabled || e.max !== void 0 && Number(d.value) >= e.max,
-          onClick: f
+          onClick: b
         }, [
-          x(b, {
-            icon: "lucide:chevron-up",
+          x(f, {
+            icon: "fluent:chevron-up-20-filled",
             class: o(e.size === "xs" || e.size === "sm" ? "w-3 h-3" : "w-3.5 h-3.5")
           }, null, 8, ["class"])
         ], 8, $),
@@ -178,8 +178,8 @@ const E = ["disabled"], q = ["value", "min", "max", "step", "placeholder", "disa
           disabled: e.disabled || e.min !== void 0 && Number(d.value) <= e.min,
           onClick: v
         }, [
-          x(b, {
-            icon: "lucide:chevron-down",
+          x(f, {
+            icon: "fluent:chevron-down-20-filled",
             class: o(e.size === "xs" || e.size === "sm" ? "w-3 h-3" : "w-3.5 h-3.5")
           }, null, 8, ["class"])
         ], 8, A)

package/components/Screen/Screen.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as ge, useSlots as ye, computed as n, ref as s, markRaw as we, provide as F, watch as R, openBlock as o, createElementBlock as m, normalizeClass as q, createVNode as w, createSlots as ke, withCtx as Q, renderSlot as d, createElementVNode as I, createBlock as p, createCommentVNode as c, isRef as be, unref as D, Fragment as M, resolveDynamicComponent as xe, mergeProps as A, toDisplayString as Ce } from "vue";
+import { defineComponent as ge, useSlots as ye, computed as n, ref as s, markRaw as we, provide as F, watch as R, openBlock as o, createElementBlock as f, normalizeClass as q, createVNode as w, createSlots as ke, withCtx as Q, renderSlot as d, createElementVNode as I, createBlock as h, createCommentVNode as u, isRef as be, unref as D, Fragment as M, resolveDynamicComponent as xe, mergeProps as A, toDisplayString as Ce } from "vue";
 import De from "../Input.vue.js";
 /* empty css            */
 import O from "../Button.vue.js";
@@ -8,7 +8,7 @@ import $e from "./ScreenFilter.vue.js";
 import Ie from "../ImportData/ImportData.vue.js";
 import { usePersistentState as Be } from "../../utils/usePersistentState.js";
 import { useVLiteConfig as Ve } from "../../core/config.js";
-import { $t as f } from "../../utils/i18n.js";
+import { $t as v } from "../../utils/i18n.js";
 import { SCREEN_CONTEXT_KEY as Te } from "../DataTable/types.js";
 import Fe from "./components/ScreenHeaderTitle.vue.js";
 import Re from "./components/ScreenViewToggle.vue.js";
@@ -83,23 +83,23 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
   },
   emits: ["add", "delete"],
   setup(t, { emit: K }) {
-    const l = t, x = Ve(), E = K, P = ye(), L = n(() => l.name || l.title || "default-screen"), h = Be(
+    const l = t, x = Ve(), E = K, P = ye(), L = n(() => l.name || l.title || "default-screen"), g = Be(
       `view-mode-${L.value}`,
       l.table || P.table ? "table" : "list"
-    ), g = s(""), u = s({}), j = s({ field: "", order: "" }), k = s(l.pageInfo?.currentPage || 1), B = s(l.pageInfo?.itemsPerPage || l.paginationProps?.itemsPerPage || 10), r = s([]), S = s([]), C = s(!1), y = s(
+    ), y = s(""), m = s({}), j = s({ field: "", order: "" }), k = s(l.pageInfo?.currentPage || 1), B = s(l.pageInfo?.itemsPerPage || l.paginationProps?.itemsPerPage || 10), r = s([]), S = s([]), C = s(!1), c = s(
       l.defaultQuickFilter !== void 0 ? l.defaultQuickFilter : l.quickFilters && l.quickFilters.length > 0 ? l.quickFilters[0].value : ""
     ), z = n(() => l.quickFilters && l.quickFilters.length > 0), H = (e) => {
-      y.value = e, k.value = 1, v();
+      c.value = e, k.value = 1, p();
     }, U = n(() => {
       let e;
-      return h.value === "table" ? e = l.table || !!P.table : e = l.list || !!P.list || !!P.grid, typeof e == "object" && e !== null ? we(e) : e;
-    }), X = n(() => g.value && g.value.trim() !== "" ? !0 : u.value ? Object.keys(u.value).some(
-      (e) => u.value[e] !== "" && u.value[e] !== null && u.value[e] !== void 0
+      return g.value === "table" ? e = l.table || !!P.table : e = l.list || !!P.list || !!P.grid, typeof e == "object" && e !== null ? we(e) : e;
+    }), X = n(() => y.value && y.value.trim() !== "" || c.value !== "" && c.value !== null && c.value !== void 0 ? !0 : m.value ? Object.keys(m.value).some(
+      (e) => m.value[e] !== "" && m.value[e] !== null && m.value[e] !== void 0
     ) : !1), Y = {
       disableSearch: !0,
       forceSelectable: !l.hideSelectable,
       onTableChange: (e) => {
-        j.value = { field: e.sort.field, order: e.sort.order }, v();
+        j.value = { field: e.sort.field, order: e.sort.order }, p();
       }
     };
     F(Te, Y), F("screen-selected-rows", r), F("screen-request-delete", (e) => b(e));
@@ -122,52 +122,52 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
       }
     );
     let V = null;
-    R(g, () => {
+    R(y, () => {
       V && clearTimeout(V), V = setTimeout(() => {
-        k.value = 1, v();
+        k.value = 1, p();
       }, 300);
     });
     const W = (e) => {
-      k.value = e, v();
+      k.value = e, p();
     }, Z = (e) => {
-      B.value = e, k.value = 1, v();
-    }, v = () => {
+      B.value = e, k.value = 1, p();
+    }, p = () => {
       if (!l.refetch) return;
-      const e = { ...u.value };
-      y.value !== "" && y.value !== null && y.value !== void 0 && (e[l.quickFilterKey] = y.value), l.refetch({
+      const e = { ...m.value };
+      c.value !== "" && c.value !== null && c.value !== void 0 && (e[l.quickFilterKey] = c.value), l.refetch({
         pagination: { page: k.value, limit: B.value },
-        search: g.value,
+        search: y.value,
         sort: { ...j.value },
         filter: e
       });
     }, _ = n(() => l.data && l.data.length > 0), ee = n(() => {
-      const e = f("vlite.screen.deleteSelected");
+      const e = v("vlite.screen.deleteSelected");
       return e !== "vlite.screen.deleteSelected" ? e : "Delete Selected";
     }), te = n(() => {
-      const e = f("vlite.screen.refresh");
+      const e = v("vlite.screen.refresh");
       return e !== "vlite.screen.refresh" ? e : "Refresh";
     }), le = n(() => {
-      const e = f("vlite.screen.searchPlaceholder");
+      const e = v("vlite.screen.searchPlaceholder");
       return e !== "vlite.screen.searchPlaceholder" ? e : "Search...";
     }), ae = n(() => {
-      const e = f("vlite.screen.confirmDeleteTitle");
+      const e = v("vlite.screen.confirmDeleteTitle");
       return e !== "vlite.screen.confirmDeleteTitle" ? e : "Confirm Deletion";
     }), ie = n(() => {
-      const e = f("vlite.screen.confirmDeleteDesc", { count: S.value.length });
+      const e = v("vlite.screen.confirmDeleteDesc", { count: S.value.length });
       return e !== "vlite.screen.confirmDeleteDesc" ? e : `Are you sure you want to delete the selected ${S.value.length > 1 ? "items" : "item"}?`;
     }), ne = n(() => {
-      const e = f("vlite.screen.confirmDeleteBtn");
+      const e = v("vlite.screen.confirmDeleteBtn");
       return e !== "vlite.screen.confirmDeleteBtn" ? e : "Delete";
     }), oe = n(() => {
-      const e = f("vlite.screen.cancelBtn");
+      const e = v("vlite.screen.cancelBtn");
       return e !== "vlite.screen.cancelBtn" ? e : "Cancel";
     }), re = n(() => {
-      const e = f("vlite.screen.missingView");
+      const e = v("vlite.screen.missingView");
       return e !== "vlite.screen.missingView" ? e : "Please provide a `:list` or `:table` component or slot.";
     }), N = n(
       () => l.exportSchema && l.exportSchema.length > 0 && l.exportProps !== !1 || l.importSchema && l.importSchema.length > 0 && l.importProps !== !1
     ), se = n(() => {
-      const e = f("vlite.screen.importData");
+      const e = v("vlite.screen.importData");
       return e !== "vlite.screen.importData" ? e : "Import Data";
     }), de = s(null), $ = s(!1), T = s(!1), ce = (e) => {
       e.value === "export" ? $.value = !0 : e.value === "import" && (T.value = !0);
@@ -191,19 +191,19 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
       skipped: 0,
       failed: 0,
       errors: []
-    }), ve = () => v(), pe = n(
+    }), ve = () => p(), pe = n(
       () => l.exportMode || x?.exportData?.mode || "frontend"
     ), he = async (e) => {
       x?.services?.exportApi && l.exportType ? await x.services.exportApi(l.exportType, {
         format: e,
-        search: g.value,
-        filter: u.value
+        search: y.value,
+        filter: m.value
       }) : console.warn(
         "VLite Screen: No exportApi configured or no exportType provided for generic backend export."
       );
     };
-    return (e, i) => (o(), m("div", Ne, [
-      t.customHeader ? d(e.$slots, "custom-header", { key: 1 }) : (o(), m("div", {
+    return (e, i) => (o(), f("div", Ne, [
+      t.customHeader ? d(e.$slots, "custom-header", { key: 1 }) : (o(), f("div", {
         key: 0,
         class: q([t.headerClass, "flex flex-col md:flex-row sm:items-start md:items-center justify-between gap-4"])
       }, [
@@ -234,21 +234,21 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
         ]), 1032, ["title", "title-i18n", "title-class", "description", "description-i18n", "description-class", "info", "info-i18n"]),
         I("div", Qe, [
           I("div", Me, [
-            r.value.length > 0 && !t.hideSelectable && !t.hideDeleteBtn ? (o(), p(O, {
+            r.value.length > 0 && !t.hideSelectable && !t.hideDeleteBtn ? (o(), h(O, {
               key: 0,
               variant: "outline",
               class: "hover:bg-destructive/10 shrink-0 h-9! w-9!",
               icon: "lucide:trash-2",
               title: ee.value,
               onClick: i[0] || (i[0] = (a) => b(r.value))
-            }, null, 8, ["title"])) : c("", !0),
-            (t.table || e.$slots.table) && (t.list || e.$slots.list || e.$slots.grid) ? (o(), p(Re, {
+            }, null, 8, ["title"])) : u("", !0),
+            (t.table || e.$slots.table) && (t.list || e.$slots.list || e.$slots.grid) ? (o(), h(Re, {
               key: 1,
-              modelValue: D(h),
-              "onUpdate:modelValue": i[1] || (i[1] = (a) => be(h) ? h.value = a : null)
-            }, null, 8, ["modelValue"])) : c("", !0),
+              modelValue: D(g),
+              "onUpdate:modelValue": i[1] || (i[1] = (a) => be(g) ? g.value = a : null)
+            }, null, 8, ["modelValue"])) : u("", !0),
             d(e.$slots, "before-search"),
-            t.showRefresh ? (o(), p(O, {
+            t.showRefresh ? (o(), h(O, {
               key: 2,
               variant: "outline",
               icon: "lucide:refresh-cw",
@@ -256,28 +256,28 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
               class: "shrink-0 h-9! w-9!",
               title: te.value,
               disabled: t.loading,
-              onClick: v
-            }, null, 8, ["title", "disabled"])) : c("", !0),
-            t.filterSchema && t.filterSchema.length > 0 ? (o(), p($e, {
+              onClick: p
+            }, null, 8, ["title", "disabled"])) : u("", !0),
+            t.filterSchema && t.filterSchema.length > 0 ? (o(), h($e, {
               key: 3,
               schema: t.filterSchema,
               type: t.filterType,
-              modelValue: u.value,
-              "onUpdate:modelValue": i[2] || (i[2] = (a) => u.value = a),
-              onChange: v
-            }, null, 8, ["schema", "type", "modelValue"])) : c("", !0),
-            t.canSearch ? (o(), m("div", Oe, [
+              modelValue: m.value,
+              "onUpdate:modelValue": i[2] || (i[2] = (a) => m.value = a),
+              onChange: p
+            }, null, 8, ["schema", "type", "modelValue"])) : u("", !0),
+            t.canSearch ? (o(), f("div", Oe, [
               w(De, {
                 lazy: "",
-                modelValue: g.value,
-                "onUpdate:modelValue": i[3] || (i[3] = (a) => g.value = a),
+                modelValue: y.value,
+                "onUpdate:modelValue": i[3] || (i[3] = (a) => y.value = a),
                 icon: "lucide:search",
                 placeholder: le.value,
                 variant: "outline",
                 class: "bg-background w-full",
                 "show-clear-button": !0
               }, null, 8, ["modelValue", "placeholder"])
-            ])) : c("", !0)
+            ])) : u("", !0)
           ]),
           I("div", Ke, [
             d(e.$slots, "actions", {}, () => [
@@ -291,34 +291,34 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
                 onAdd: i[4] || (i[4] = (a) => e.$emit("add"))
               }, null, 8, ["can-add", "add-component", "add-btn", "loading", "data", "refetch"])
             ]),
-            N.value ? (o(), p(qe, {
+            N.value ? (o(), h(qe, {
               key: 0,
               "export-props": t.exportProps,
               "import-props": t.importProps,
               onSelect: ce
-            }, null, 8, ["export-props", "import-props"])) : c("", !0),
+            }, null, 8, ["export-props", "import-props"])) : u("", !0),
             d(e.$slots, "after-add")
           ])
         ])
       ], 2)),
       d(e.$slots, "sub-header"),
-      z.value ? (o(), m("div", {
+      z.value ? (o(), f("div", {
         key: 2,
-        class: q(["-mt-1", t.quickFilterVariant == "line" ? "mb-1.5 sm:mb-1" : "mb-2"])
+        class: q(["-mt-1 max-sm:hidden!", t.quickFilterVariant == "line" ? "mb-1.5 sm:mb-1" : "mb-2"])
       }, [
         w(Ue, {
-          modelValue: y.value,
-          "onUpdate:modelValue": i[5] || (i[5] = (a) => y.value = a),
+          modelValue: c.value,
+          "onUpdate:modelValue": i[5] || (i[5] = (a) => c.value = a),
           options: t.quickFilters,
           variant: t.quickFilterVariant,
           onChange: H
         }, null, 8, ["modelValue", "options", "variant"])
-      ], 2)) : c("", !0),
+      ], 2)) : u("", !0),
       I("div", {
         class: q(["flex-1 w-full relative", t.containerClass])
       }, [
-        !_.value && !t.loading ? (o(), m(M, { key: 0 }, [
-          e.$slots.empty ? d(e.$slots, "empty", { key: 0 }) : (o(), p(Ee, {
+        !_.value && !t.loading ? (o(), f(M, { key: 0 }, [
+          e.$slots.empty ? d(e.$slots, "empty", { key: 0 }) : (o(), h(Ee, {
             key: 1,
             "empty-title": t.emptyTitle,
             "empty-title-i18n": t.emptyTitleI18n,
@@ -330,29 +330,29 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
             "add-component": t.addComponent,
             "add-btn": t.addBtn
           }, null, 8, ["empty-title", "empty-title-i18n", "empty-description", "empty-description-i18n", "empty-icon", "is-filtered", "can-add", "add-component", "add-btn"]))
-        ], 64)) : (o(), m(M, { key: 1 }, [
-          D(h) === "table" && e.$slots.table ? d(e.$slots, "table", {
+        ], 64)) : (o(), f(M, { key: 1 }, [
+          D(g) === "table" && e.$slots.table ? d(e.$slots, "table", {
             key: 0,
             data: t.data,
             loading: t.loading,
             selectedRows: r.value,
             delete: b,
             updateSelectedRows: (a) => r.value = a
-          }) : D(h) === "list" && e.$slots.list ? d(e.$slots, "list", {
+          }) : D(g) === "list" && e.$slots.list ? d(e.$slots, "list", {
             key: 1,
             data: t.data,
             loading: t.loading,
             selectedRows: r.value,
             delete: b,
             updateSelectedRows: (a) => r.value = a
-          }) : D(h) === "list" && e.$slots.grid ? d(e.$slots, "grid", {
+          }) : D(g) === "list" && e.$slots.grid ? d(e.$slots, "grid", {
             key: 2,
             data: t.data,
             loading: t.loading,
             selectedRows: r.value,
             delete: b,
             updateSelectedRows: (a) => r.value = a
-          }) : U.value ? (o(), p(xe(U.value), A({
+          }) : U.value ? (o(), h(xe(U.value), A({
             key: 3,
             data: t.data,
             loading: t.loading,
@@ -361,10 +361,10 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
             "onUpdate:selectedRows": i[6] || (i[6] = (a) => r.value = a),
             delete: b,
             onDelete: J
-          }, t.viewProps), null, 16, ["data", "loading", "refetch", "selectedRows"])) : (o(), m("div", Le, Ce(re.value), 1))
+          }, t.viewProps), null, 16, ["data", "loading", "refetch", "selectedRows"])) : (o(), f("div", Le, Ce(re.value), 1))
         ], 64))
       ], 2),
-      t.pagination && t.pageInfo && t.pageInfo.totalPages > 1 ? (o(), m("div", ze, [
+      t.pagination && t.pageInfo && t.pageInfo.totalPages > 1 ? (o(), f("div", ze, [
         w(D(Se), A({
           "current-page": t.pageInfo.currentPage,
           "total-pages": t.pageInfo.totalPages,
@@ -373,7 +373,7 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
           onChange: W,
           "onUpdate:itemsPerPage": Z
         }), null, 16, ["current-page", "total-pages", "total-items"])
-      ])) : c("", !0),
+      ])) : u("", !0),
       w(Pe, {
         show: C.value,
         "onUpdate:show": i[7] || (i[7] = (a) => C.value = a),
@@ -385,7 +385,7 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
         onConfirm: G,
         onCancel: i[8] || (i[8] = (a) => C.value = !1)
       }, null, 8, ["show", "title", "description", "confirm-text", "cancel-text"]),
-      $.value ? (o(), p(je, {
+      $.value ? (o(), h(je, {
         key: 4,
         show: $.value,
         "onUpdate:show": i[9] || (i[9] = (a) => $.value = a),
@@ -394,8 +394,8 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
         mode: pe.value,
         "export-props": t.exportProps,
         "on-export": he
-      }, null, 8, ["show", "data", "fields", "mode", "export-props"])) : c("", !0),
-      N.value ? (o(), m("div", He, [
+      }, null, 8, ["show", "data", "fields", "mode", "export-props"])) : u("", !0),
+      N.value ? (o(), f("div", He, [
         w(Ie, A({
           show: T.value,
           "onUpdate:show": i[10] || (i[10] = (a) => T.value = a),
@@ -408,7 +408,7 @@ const Ne = { class: "flex flex-col w-full space-y-8" }, Qe = { class: "flex flex
           title: se.value,
           class: "hidden!"
         }), null, 16, ["show", "fields", "title"])
-      ])) : c("", !0)
+      ])) : u("", !0)
     ]));
   }
 });

package/components/Screen/ScreenFilter.vue.js

@@ -15,13 +15,14 @@ import "@vueuse/core";
 /* empty css                           */
 import "iconify-icon-picker";
 import "iconify-icon-picker/style.css";
+import "vue-draggable-plus";
 /* empty css                        */
 /* empty css                      */
 import "../../core/config.js";
 const A = { class: "text-gray-800! h-4! w-4! flex items-center justify-center" }, E = { style: { "will-change": "transform", contain: "layout style" } }, I = {
   class: "py-4 px-3.5 min-w-[290px]",
   style: { "will-change": "transform", contain: "layout style" }
-}, le = /* @__PURE__ */ B({
+}, se = /* @__PURE__ */ B({
   __name: "ScreenFilter",
   props: {
     schema: {},
@@ -180,5 +181,5 @@ const A = { class: "text-gray-800! h-4! w-4! flex items-center justify-center" }
   }
 });
 export {
-  le as default
+  se as default
 };

package/components/Screen/components/ScreenEmptyState.vue.js

@@ -1,9 +1,9 @@
-import { defineComponent as C, computed as m, markRaw as k, resolveComponent as p, openBlock as n, createBlock as a, unref as h, withCtx as d, createElementBlock as o, Fragment as u, resolveDynamicComponent as w, mergeProps as i, createVNode as f, createTextVNode as y, toDisplayString as B, createCommentVNode as l } from "vue";
+import { defineComponent as p, computed as m, markRaw as k, resolveComponent as C, openBlock as n, createBlock as a, unref as h, withCtx as d, createElementBlock as o, Fragment as u, resolveDynamicComponent as w, mergeProps as i, createVNode as f, createTextVNode as s, toDisplayString as y, createCommentVNode as l } from "vue";
 import x from "../../Empty/Empty.vue.js";
-import s from "../../Button.vue.js";
+import B from "../../Button.vue.js";
 import A from "../../Modal.vue.js";
 import { $t as I } from "../../../utils/i18n.js";
-const D = ["href", "target"], $ = /* @__PURE__ */ C({
+const D = ["href", "target"], $ = /* @__PURE__ */ p({
   __name: "ScreenEmptyState",
   props: {
     emptyTitle: {},
@@ -28,8 +28,9 @@ const D = ["href", "target"], $ = /* @__PURE__ */ C({
       return r !== "vlite.screen.addNew" ? r : "Add New";
     });
     return (r, N) => {
-      const g = p("router-link");
+      const g = C("router-link");
       return n(), a(h(x), {
+        class: "py-0.5!",
         title: e.emptyTitle,
         titleI18n: e.emptyTitleI18n,
         description: e.emptyDescription,
@@ -45,14 +46,14 @@ const D = ["href", "target"], $ = /* @__PURE__ */ C({
                   body: b.value
                 }, e.addBtn.modalProps), {
                   trigger: d(() => [
-                    f(s, i({
+                    f(B, i({
                       icon: e.addBtn.icon || "fluent:add-16-filled",
                       variant: "secondary",
                       rounded: "full",
                       class: "px-6!"
                     }, e.addBtn.buttonProps), {
                       default: d(() => [
-                        y(B(c.value), 1)
+                        s(y(c.value), 1)
                       ]),
                       _: 1
                     }, 16, ["icon"])
@@ -64,12 +65,12 @@ const D = ["href", "target"], $ = /* @__PURE__ */ C({
                   class: "inline-flex"
                 }, {
                   default: d(() => [
-                    f(s, i({
+                    f(B, i({
                       icon: e.addBtn.icon || "fluent:add-16-filled",
                       variant: "secondary"
                     }, e.addBtn.buttonProps), {
                       default: d(() => [
-                        y(B(c.value), 1)
+                        s(y(c.value), 1)
                       ]),
                       _: 1
                     }, 16, ["icon"])
@@ -81,12 +82,12 @@ const D = ["href", "target"], $ = /* @__PURE__ */ C({
                   target: e.addBtn.target,
                   class: "inline-flex"
                 }, [
-                  f(s, i({
+                  f(B, i({
                     icon: e.addBtn.icon || "lucide:plus",
                     variant: "secondary"
                   }, e.addBtn.buttonProps), {
                     default: d(() => [
-                      y(B(c.value), 1)
+                      s(y(c.value), 1)
                     ]),
                     _: 1
                   }, 16, ["icon"])

package/components/Screen/components/ScreenQuickFilters.vue.js

@@ -1,6 +1,6 @@
 import { defineComponent as i, computed as s, openBlock as r, createElementBlock as u, createVNode as m, unref as d } from "vue";
 import b from "../../Tabes/Tabes.vue.js";
-const p = { class: "w-max" }, V = /* @__PURE__ */ i({
+const p = { class: "w-max" }, g = /* @__PURE__ */ i({
   __name: "ScreenQuickFilters",
   props: {
     modelValue: {},
@@ -22,7 +22,7 @@ const p = { class: "w-max" }, V = /* @__PURE__ */ i({
     };
     return (e, v) => (r(), u("div", p, [
       m(d(b), {
-        class: "border-b-0! border-0! pb-0",
+        class: "border-b-0! border-0! pb-0 gap-3.5!",
         "model-value": a.modelValue,
         options: t.value,
         variant: a.variant || "line",
@@ -32,5 +32,5 @@ const p = { class: "w-max" }, V = /* @__PURE__ */ i({
   }
 });
 export {
-  V as default
+  g as default
 };