vlite3 0.7.9 → 0.7.11

package/components/Dropdown/Dropdown.vue.js

@@ -108,7 +108,7 @@ const be = /* @__PURE__ */ K({
       p
     ), q = m(() => {
       const e = n.ignoreClickOutside || [], o = E(u.value);
-      return [.../* @__PURE__ */ new Set([...e, ...o])];
+      return [.../* @__PURE__ */ new Set([...e, ...o, ".tooltip-container"])];
     });
     T(
       () => $.value,

package/components/Screen/Screen.vue.d.ts

@@ -25,6 +25,8 @@ declare const __VLS_component: import('vue').DefineComponent<ScreenProps, {}, {}
     filterSchema: import('../Form').IForm[];
     filterType: "modal" | "dropdown";
     showRefresh: boolean;
+    viewProps: Record<string, any>;
+    canSelectRows: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, any, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/components/Screen/Screen.vue.js

@@ -1,40 +1,40 @@
-import { defineComponent as $e, useSlots as Ie, computed as i, ref as y, provide as z, watch as H, resolveComponent as Se, openBlock as a, createElementBlock as s, normalizeClass as A, createElementVNode as x, renderSlot as w, toDisplayString as m, createBlock as c, withCtx as d, createVNode as u, createCommentVNode as f, unref as p, resolveDynamicComponent as K, Fragment as P, mergeProps as g, createTextVNode as B, renderList as Te } from "vue";
-import Ve from "../Input.vue.js";
+import { defineComponent as $e, useSlots as Ie, computed as i, ref as y, provide as z, watch as H, resolveComponent as Te, openBlock as a, createElementBlock as s, normalizeClass as A, createElementVNode as x, renderSlot as w, toDisplayString as m, createBlock as c, withCtx as d, createVNode as u, createCommentVNode as f, unref as p, resolveDynamicComponent as K, Fragment as P, mergeProps as v, createTextVNode as B, renderList as Ve } from "vue";
+import Re from "../Input.vue.js";
 /* empty css            */
 import h from "../Button.vue.js";
 import N from "../Icon.vue.js";
-import Re from "../Tooltip.vue.js";
+import Ee from "../Tooltip.vue.js";
 import J from "../Modal.vue.js";
-import Ee from "../ConfirmationModal.vue.js";
-import Oe from "../Pagination/Pagination.vue.js";
-import je from "../Empty/Empty.vue.js";
-import Ae from "./ScreenFilter.vue.js";
-import Ne from "../Dropdown/Dropdown.vue.js";
-import Fe from "../ExportData/ExportData.vue.js";
-import Le from "../ImportData/ImportData.vue.js";
-import { usePersistentState as Me } from "../../utils/usePersistentState.js";
-import { useVLiteConfig as Ue } from "../../core/config.js";
+import Oe from "../ConfirmationModal.vue.js";
+import je from "../Pagination/Pagination.vue.js";
+import Ae from "../Empty/Empty.vue.js";
+import Ne from "./ScreenFilter.vue.js";
+import Fe from "../Dropdown/Dropdown.vue.js";
+import Le from "../ExportData/ExportData.vue.js";
+import Me from "../ImportData/ImportData.vue.js";
+import { usePersistentState as Ue } from "../../utils/usePersistentState.js";
+import { useVLiteConfig as qe } from "../../core/config.js";
 import { $t as r } from "../../utils/i18n.js";
-import { SCREEN_CONTEXT_KEY as qe } from "../DataTable/types.js";
-const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex-col shrink-0" }, Ke = {
+import { SCREEN_CONTEXT_KEY as ze } from "../DataTable/types.js";
+const He = { class: "flex flex-col w-full space-y-8" }, Ke = { class: "flex flex-col shrink-0" }, Je = {
   key: 0,
   class: "flex items-center! gap-2"
-}, Je = { class: "text-fs-7.5 font-bold text-foreground" }, Qe = {
+}, Qe = { class: "text-fs-7.5 font-bold text-foreground" }, Xe = {
   key: 0,
   class: "text-sm text-gray-700 mt-1 md:max-w-[450px]"
-}, Xe = { class: "flex flex-col sm:flex-row items-start sm:items-center gap-2.5 w-full justify-end" }, Ye = { class: "flex items-center gap-2 w-full sm:w-auto flex-1 md:flex-none justify-start sm:justify-end" }, Ge = {
+}, Ye = { class: "flex flex-col sm:flex-row items-start sm:items-center gap-2.5 w-full justify-end" }, Ge = { class: "flex items-center gap-2 w-full sm:w-auto flex-1 md:flex-none justify-start sm:justify-end" }, We = {
   key: 1,
   class: "flex items-center p-1 rounded-md border border-border shrink-0"
-}, We = ["title"], Ze = ["title"], _e = {
+}, Ze = ["title"], _e = ["title"], et = {
   key: 4,
   class: "w-full md:w-60! max-sm:order-last"
-}, et = { class: "flex items-center gap-3 max-sm:w-full sm:w-auto max-sm:order-last" }, tt = ["href", "target"], lt = ["href", "target"], at = {
+}, tt = { class: "flex items-center gap-3 max-sm:w-full sm:w-auto max-sm:order-last" }, lt = ["href", "target"], at = ["href", "target"], nt = {
   key: 4,
   class: "p-8 text-center text-muted-foreground border border-dashed border-border rounded-lg"
-}, nt = {
+}, ot = {
   key: 2,
   class: "-mt-2"
-}, ot = { class: "px-1 py-1 text-sm" }, it = { class: "font-medium mb-3 text-muted-foreground" }, rt = { class: "space-y-3" }, dt = { key: 4 }, St = /* @__PURE__ */ $e({
+}, it = { class: "px-1 py-1 text-sm" }, rt = { class: "font-medium mb-3 text-muted-foreground" }, dt = { class: "space-y-3" }, st = { key: 4 }, It = /* @__PURE__ */ $e({
   __name: "Screen",
   props: {
     name: { default: "" },
@@ -78,32 +78,34 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
     filterType: { default: "modal" },
     showRefresh: { type: Boolean, default: !1 },
     containerClass: {},
-    headerClass: {}
+    headerClass: {},
+    viewProps: { default: () => ({}) },
+    canSelectRows: { type: Boolean, default: !0 }
   },
   emits: ["add", "delete"],
   setup(t, { emit: te }) {
-    const l = t, $ = Ue(), Q = te, V = Ie(), le = i(() => l.name || l.title || "default-screen"), k = Me(
+    const l = t, S = qe(), Q = te, V = Ie(), le = i(() => l.name || l.title || "default-screen"), k = Ue(
       `view-mode-${le.value}`,
       l.table || V.table ? "table" : "list"
-    ), I = y(""), R = y({}), X = y({ field: "", order: "" }), S = y(l.pageInfo?.currentPage || 1), F = y(l.pageInfo?.itemsPerPage || l.paginationProps?.itemsPerPage || 10), v = y([]), E = y([]), T = y(!1);
-    z(qe, {
+    ), $ = y(""), R = y({}), X = y({ field: "", order: "" }), I = y(l.pageInfo?.currentPage || 1), F = y(l.pageInfo?.itemsPerPage || l.paginationProps?.itemsPerPage || 10), g = y([]), E = y([]), T = y(!1), ae = {
       disableSearch: !0,
-      forceSelectable: !0,
+      forceSelectable: l.canSelectRows,
       onTableChange: (e) => {
         X.value = { field: e.sort.field, order: e.sort.order }, C();
       }
-    }), z("screen-selected-rows", v), z("screen-request-delete", (e) => D(e));
+    };
+    z(ze, ae), z("screen-selected-rows", g), z("screen-request-delete", (e) => D(e));
     const D = (e) => {
       E.value = e, T.value = !0;
-    }, ae = () => {
-      Q("delete", E.value), T.value = !1, v.value = [];
-    }, ne = (e) => {
-      Q("delete", e), v.value = [];
+    }, ne = () => {
+      Q("delete", E.value), T.value = !1, g.value = [];
+    }, oe = (e) => {
+      Q("delete", e), g.value = [];
     };
     H(
       () => l.pageInfo?.currentPage,
       (e) => {
-        e && (S.value = e);
+        e && (I.value = e);
       }
     ), H(
       () => l.pageInfo?.itemsPerPage,
@@ -112,52 +114,52 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
       }
     );
     let L = null;
-    H(I, () => {
+    H($, () => {
       L && clearTimeout(L), L = setTimeout(() => {
-        S.value = 1, C();
+        I.value = 1, C();
       }, 300);
     });
-    const oe = (e) => {
-      S.value = e, C();
-    }, ie = (e) => {
-      F.value = e, S.value = 1, C();
+    const ie = (e) => {
+      I.value = e, C();
+    }, re = (e) => {
+      F.value = e, I.value = 1, C();
     }, C = () => {
       l.refetch && l.refetch({
-        pagination: { page: S.value, limit: F.value },
-        search: I.value,
+        pagination: { page: I.value, limit: F.value },
+        search: $.value,
         sort: { ...X.value },
         filter: { ...R.value }
       });
-    }, Y = i(() => k.value === "table" ? l.table || !!V.table : l.list || !!V.list || !!V.grid), re = i(() => l.data && l.data.length > 0), G = i(() => l.titleI18n ? r(l.titleI18n) : l.title), W = i(
+    }, Y = i(() => k.value === "table" ? l.table || !!V.table : l.list || !!V.list || !!V.grid), de = i(() => l.data && l.data.length > 0), G = i(() => l.titleI18n ? r(l.titleI18n) : l.title), W = i(
       () => l.descriptionI18n ? r(l.descriptionI18n) : l.description
-    ), de = i(() => {
+    ), se = i(() => {
       const e = r("vlite.screen.deleteSelected");
       return e !== "vlite.screen.deleteSelected" ? e : "Delete Selected";
-    }), se = i(() => {
+    }), ce = i(() => {
       const e = r("vlite.screen.listView");
       return e !== "vlite.screen.listView" ? e : "List View";
-    }), ce = i(() => {
+    }), ue = i(() => {
       const e = r("vlite.screen.tableView");
       return e !== "vlite.screen.tableView" ? e : "Table View";
-    }), ue = i(() => {
+    }), fe = i(() => {
       const e = r("vlite.screen.refresh");
       return e !== "vlite.screen.refresh" ? e : "Refresh";
-    }), fe = i(() => {
+    }), me = i(() => {
       const e = r("vlite.screen.searchPlaceholder");
       return e !== "vlite.screen.searchPlaceholder" ? e : "Search...";
-    }), me = i(() => {
+    }), ve = i(() => {
       const e = r("vlite.screen.confirmDeleteTitle");
       return e !== "vlite.screen.confirmDeleteTitle" ? e : "Confirm Deletion";
-    }), ve = i(() => {
+    }), ge = i(() => {
       const e = r("vlite.screen.confirmDeleteDesc", { count: E.value.length });
       return e !== "vlite.screen.confirmDeleteDesc" ? e : `Are you sure you want to delete the selected ${E.value.length > 1 ? "items" : "item"}?`;
-    }), ge = i(() => {
+    }), he = i(() => {
       const e = r("vlite.screen.confirmDeleteBtn");
       return e !== "vlite.screen.confirmDeleteBtn" ? e : "Delete";
-    }), he = i(() => {
+    }), ye = i(() => {
       const e = r("vlite.screen.cancelBtn");
       return e !== "vlite.screen.cancelBtn" ? e : "Cancel";
-    }), ye = i(() => {
+    }), xe = i(() => {
       const e = r("vlite.screen.missingView");
       return e !== "vlite.screen.missingView" ? e : "Please provide a `:list` or `:table` component or slot.";
     }), b = i(() => {
@@ -173,23 +175,23 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
     }), _ = i(() => {
       const e = r("vlite.screen.importData");
       return e !== "vlite.screen.importData" ? e : "Import Data";
-    }), xe = i(() => {
+    }), we = i(() => {
       const e = [];
       return l.exportProps !== !1 && e.push({ value: "export", label: M.value, icon: "lucide:download" }), l.importProps !== !1 && e.push({ value: "import", label: _.value, icon: "lucide:upload" }), e;
-    }), U = y(null), we = y(null), O = y(!1), q = y(!1), pe = (e) => {
+    }), U = y(null), pe = y(null), O = y(!1), q = y(!1), be = (e) => {
       e.value === "export" ? O.value = !0 : e.value === "import" && (q.value = !0);
-    }, be = i(
+    }, Be = i(
       () => (l.exportSchema || []).map((e) => ({
         field: e.name || e.field,
         title: e.label || e.title || e.name || e.field
       }))
-    ), Be = i(
+    ), ke = i(
       () => (l.importSchema || []).map((e) => ({
         field: e.name || e.field,
         title: e.label || e.title || e.name || e.field,
         required: e.required || !1
       }))
-    ), ke = async (e) => $?.services?.importApi && l.importType ? await $.services.importApi(l.importType, e) : (console.warn(
+    ), Ce = async (e) => S?.services?.importApi && l.importType ? await S.services.importApi(l.importType, e) : (console.warn(
       "VLite Screen: No importApi configured or no importType provided for generic import."
     ), {
       processed: e.data.length,
@@ -198,29 +200,29 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
       skipped: 0,
       failed: 0,
       errors: []
-    }), Ce = () => C(), De = i(
-      () => l.exportMode || $?.exportData?.mode || "frontend"
-    ), Pe = async (e) => {
-      $?.services?.exportApi && l.exportType ? await $.services.exportApi(l.exportType, {
+    }), De = () => C(), Pe = i(
+      () => l.exportMode || S?.exportData?.mode || "frontend"
+    ), Se = async (e) => {
+      S?.services?.exportApi && l.exportType ? await S.services.exportApi(l.exportType, {
         format: e,
-        search: I.value,
+        search: $.value,
         filter: R.value
       }) : console.warn(
         "VLite Screen: No exportApi configured or no exportType provided for generic backend export."
       );
     };
     return (e, n) => {
-      const ee = Se("router-link");
-      return a(), s("div", ze, [
+      const ee = Te("router-link");
+      return a(), s("div", He, [
         t.customHeader ? w(e.$slots, "custom-header", { key: 1 }) : (a(), s("div", {
           key: 0,
           class: A([t.headerClass, "flex flex-col md:flex-row sm:items-start md:items-center justify-between gap-4"])
         }, [
-          x("div", He, [
+          x("div", Ke, [
             w(e.$slots, "title", {}, () => [
-              G.value ? (a(), s("div", Ke, [
-                x("h1", Je, m(G.value), 1),
-                t.info || t.infoI18n ? (a(), c(Re, {
+              G.value ? (a(), s("div", Je, [
+                x("h1", Qe, m(G.value), 1),
+                t.info || t.infoI18n ? (a(), c(Ee, {
                   key: 0,
                   content: t.info,
                   "content-i18n": t.infoI18n,
@@ -237,44 +239,44 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
               ])) : f("", !0)
             ]),
             w(e.$slots, "description", {}, () => [
-              W.value ? (a(), s("p", Qe, m(W.value), 1)) : f("", !0)
+              W.value ? (a(), s("p", Xe, m(W.value), 1)) : f("", !0)
             ])
           ]),
-          x("div", Xe, [
-            x("div", Ye, [
-              v.value.length > 0 ? (a(), c(h, {
+          x("div", Ye, [
+            x("div", Ge, [
+              g.value.length > 0 && t.canSelectRows ? (a(), c(h, {
                 key: 0,
                 variant: "outline",
                 class: "hover:bg-destructive/10 shrink-0 h-9! w-9!",
                 icon: "lucide:trash-2",
-                title: de.value,
-                onClick: n[0] || (n[0] = (o) => D(v.value))
+                title: se.value,
+                onClick: n[0] || (n[0] = (o) => D(g.value))
               }, null, 8, ["title"])) : f("", !0),
-              (t.table || e.$slots.table) && (t.list || e.$slots.list || e.$slots.grid) ? (a(), s("div", Ge, [
+              (t.table || e.$slots.table) && (t.list || e.$slots.list || e.$slots.grid) ? (a(), s("div", We, [
                 x("button", {
                   onClick: n[1] || (n[1] = (o) => k.value = "list"),
                   class: A(["p-1.5 rounded", [
                     p(k) === "list" ? "bg-secondary/85 dark:bg-secondary shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"
                   ]]),
-                  title: se.value
+                  title: ce.value
                 }, [
                   u(N, {
                     icon: "lucide:layout-grid",
                     class: "w-4 h-4"
                   })
-                ], 10, We),
+                ], 10, Ze),
                 x("button", {
                   onClick: n[2] || (n[2] = (o) => k.value = "table"),
                   class: A(["p-1.5 rounded", [
                     p(k) === "table" ? "bg-secondary/85 dark:bg-secondary shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"
                   ]]),
-                  title: ce.value
+                  title: ue.value
                 }, [
                   u(N, {
                     icon: "lucide:list",
                     class: "w-4 h-4"
                   })
-                ], 10, Ze)
+                ], 10, _e)
               ])) : f("", !0),
               w(e.$slots, "before-search"),
               t.showRefresh ? (a(), c(h, {
@@ -283,11 +285,11 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                 icon: "lucide:refresh-cw",
                 size: "lg",
                 class: "shrink-0 h-9! w-9!",
-                title: ue.value,
+                title: fe.value,
                 disabled: t.loading,
                 onClick: C
               }, null, 8, ["title", "disabled"])) : f("", !0),
-              t.filterSchema && t.filterSchema.length > 0 ? (a(), c(Ae, {
+              t.filterSchema && t.filterSchema.length > 0 ? (a(), c(Ne, {
                 key: 3,
                 schema: t.filterSchema,
                 type: t.filterType,
@@ -295,24 +297,24 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                 "onUpdate:modelValue": n[3] || (n[3] = (o) => R.value = o),
                 onChange: C
               }, null, 8, ["schema", "type", "modelValue"])) : f("", !0),
-              t.canSearch ? (a(), s("div", _e, [
-                u(Ve, {
+              t.canSearch ? (a(), s("div", et, [
+                u(Re, {
                   lazy: "",
-                  modelValue: I.value,
-                  "onUpdate:modelValue": n[4] || (n[4] = (o) => I.value = o),
+                  modelValue: $.value,
+                  "onUpdate:modelValue": n[4] || (n[4] = (o) => $.value = o),
                   icon: "lucide:search",
-                  placeholder: fe.value,
+                  placeholder: me.value,
                   variant: "outline",
                   class: "bg-background w-full",
                   "show-clear-button": !0
                 }, null, 8, ["modelValue", "placeholder"])
               ])) : f("", !0)
             ]),
-            x("div", et, [
+            x("div", tt, [
               w(e.$slots, "actions", {}, () => [
                 t.addComponent ? (a(), c(K(t.addComponent), { key: 0 })) : t.canAdd ? (a(), s(P, { key: 1 }, [
                   t.addBtn ? (a(), s(P, { key: 0 }, [
-                    t.addBtn.modal ? (a(), c(J, g({
+                    t.addBtn.modal ? (a(), c(J, v({
                       key: 0,
                       body: t.addBtn.modal
                     }, t.addBtn.modalProps, {
@@ -322,7 +324,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                       loading: t.loading
                     }), {
                       trigger: d(() => [
-                        u(h, g({
+                        u(h, v({
                           class: "w-full",
                           icon: t.addBtn.icon || "fluent:add-16-filled",
                           variant: t.addBtn.variant || "primary"
@@ -340,7 +342,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                       class: "inline-flex w-full sm:w-auto"
                     }, {
                       default: d(() => [
-                        u(h, g({
+                        u(h, v({
                           class: "w-full",
                           icon: t.addBtn.icon || "fluent:add-16-filled",
                           variant: t.addBtn.variant || "primary"
@@ -358,7 +360,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                       target: t.addBtn.target,
                       class: "inline-flex w-full sm:w-auto"
                     }, [
-                      u(h, g({
+                      u(h, v({
                         class: "w-full",
                         icon: t.addBtn.icon || "fluent:add-16-filled",
                         variant: t.addBtn.variant || "primary"
@@ -368,7 +370,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                         ]),
                         _: 1
                       }, 16, ["icon", "variant"])
-                    ], 8, tt)) : (a(), c(h, g({
+                    ], 8, lt)) : (a(), c(h, v({
                       key: 3,
                       class: "w-full sm:w-auto",
                       icon: t.addBtn.icon || "fluent:add-16-filled",
@@ -384,12 +386,12 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                   ], 64)) : f("", !0)
                 ], 64)) : f("", !0)
               ]),
-              Z.value ? (a(), c(Ne, {
+              Z.value ? (a(), c(Fe, {
                 key: 0,
                 closeOnSelect: "",
                 position: "bottom-end",
-                options: xe.value,
-                onOnSelect: pe
+                options: we.value,
+                onOnSelect: be
               }, {
                 trigger: d(() => [
                   u(h, {
@@ -409,8 +411,8 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
         x("div", {
           class: A(["flex-1 w-full relative", t.containerClass])
         }, [
-          !re.value && !t.loading ? w(e.$slots, "empty", { key: 0 }, () => [
-            u(p(je), {
+          !de.value && !t.loading ? w(e.$slots, "empty", { key: 0 }, () => [
+            u(p(Ae), {
               title: t.emptyTitle,
               titleI18n: t.emptyTitleI18n,
               description: t.emptyDescription,
@@ -420,12 +422,12 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
               action: d(() => [
                 t.addComponent ? (a(), c(K(t.addComponent), { key: 0 })) : t.canAdd ? (a(), s(P, { key: 1 }, [
                   t.addBtn ? (a(), s(P, { key: 0 }, [
-                    t.addBtn.modal ? (a(), c(J, g({
+                    t.addBtn.modal ? (a(), c(J, v({
                       key: 0,
                       body: t.addBtn.modal
                     }, t.addBtn.modalProps), {
                       trigger: d(() => [
-                        u(h, g({
+                        u(h, v({
                           icon: t.addBtn.icon || "fluent:add-16-filled",
                           variant: t.addBtn.variant || "primary",
                           rounded: "full",
@@ -444,7 +446,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                       class: "inline-flex"
                     }, {
                       default: d(() => [
-                        u(h, g({
+                        u(h, v({
                           icon: t.addBtn.icon || "fluent:add-16-filled",
                           variant: t.addBtn.variant || "outline"
                         }, t.addBtn.buttonProps), {
@@ -461,7 +463,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                       target: t.addBtn.target,
                       class: "inline-flex"
                     }, [
-                      u(h, g({
+                      u(h, v({
                         icon: t.addBtn.icon || "lucide:plus",
                         variant: t.addBtn.variant || "outline"
                       }, t.addBtn.buttonProps), {
@@ -470,7 +472,7 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
                         ]),
                         _: 1
                       }, 16, ["icon", "variant"])
-                    ], 8, lt)) : (a(), c(h, g({
+                    ], 8, at)) : (a(), c(h, v({
                       key: 3,
                       icon: t.addBtn.icon || "lucide:plus",
                       variant: t.addBtn.variant || "outline"
@@ -502,54 +504,54 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
               key: 0,
               data: t.data,
               loading: t.loading,
-              selectedRows: v.value,
+              selectedRows: g.value,
               delete: D,
-              updateSelectedRows: (o) => v.value = o
+              updateSelectedRows: (o) => g.value = o
             }) : p(k) === "list" && e.$slots.list ? w(e.$slots, "list", {
               key: 1,
               data: t.data,
               loading: t.loading,
-              selectedRows: v.value,
+              selectedRows: g.value,
               delete: D,
-              updateSelectedRows: (o) => v.value = o
+              updateSelectedRows: (o) => g.value = o
             }) : p(k) === "list" && e.$slots.grid ? w(e.$slots, "grid", {
               key: 2,
               data: t.data,
               loading: t.loading,
-              selectedRows: v.value,
+              selectedRows: g.value,
               delete: D,
-              updateSelectedRows: (o) => v.value = o
-            }) : Y.value ? (a(), c(K(Y.value), {
+              updateSelectedRows: (o) => g.value = o
+            }) : Y.value ? (a(), c(K(Y.value), v({
               key: 3,
               data: t.data,
               loading: t.loading,
               refetch: t.refetch,
-              selectedRows: v.value,
-              "onUpdate:selectedRows": n[8] || (n[8] = (o) => v.value = o),
+              selectedRows: g.value,
+              "onUpdate:selectedRows": n[8] || (n[8] = (o) => g.value = o),
               delete: D,
-              onDelete: ne
-            }, null, 40, ["data", "loading", "refetch", "selectedRows"])) : (a(), s("div", at, m(ye.value), 1))
+              onDelete: oe
+            }, t.viewProps), null, 16, ["data", "loading", "refetch", "selectedRows"])) : (a(), s("div", nt, m(xe.value), 1))
           ], 64))
         ], 2),
-        t.pagination && t.pageInfo && t.pageInfo.totalPages > 1 ? (a(), s("div", nt, [
-          u(p(Oe), g({
+        t.pagination && t.pageInfo && t.pageInfo.totalPages > 1 ? (a(), s("div", ot, [
+          u(p(je), v({
             "current-page": t.pageInfo.currentPage,
             "total-pages": t.pageInfo.totalPages,
             "total-items": t.pageInfo.totalItems
           }, t.paginationProps, {
-            onChange: oe,
-            "onUpdate:itemsPerPage": ie
+            onChange: ie,
+            "onUpdate:itemsPerPage": re
           }), null, 16, ["current-page", "total-pages", "total-items"])
         ])) : f("", !0),
-        u(Ee, {
+        u(Oe, {
           show: T.value,
           "onUpdate:show": n[9] || (n[9] = (o) => T.value = o),
-          title: me.value,
-          description: ve.value,
-          "confirm-text": ge.value,
-          "cancel-text": he.value,
+          title: ve.value,
+          description: ge.value,
+          "confirm-text": he.value,
+          "cancel-text": ye.value,
           variant: "danger",
-          onConfirm: ae,
+          onConfirm: ne,
           onCancel: n[10] || (n[10] = (o) => T.value = !1)
         }, null, 8, ["show", "title", "description", "confirm-text", "cancel-text"]),
         O.value ? (a(), c(J, {
@@ -560,21 +562,21 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
           "max-width": "sm:max-w-[400px]"
         }, {
           default: d(({ close: o }) => [
-            u(Fe, g({
+            u(Le, v({
               ref_key: "exportDataRef",
               ref: U,
               data: t.data || [],
-              fields: be.value,
-              mode: De.value,
-              "on-export": Pe
+              fields: Be.value,
+              mode: Pe.value,
+              "on-export": Se
             }, typeof t.exportProps == "object" ? t.exportProps : {}, {
               title: M.value,
               class: "hidden!"
             }), null, 16, ["data", "fields", "mode", "title"]),
-            x("div", ot, [
-              x("h6", it, m(p(r)("vlite.exportData.selectFormat") !== "vlite.exportData.selectFormat" ? p(r)("vlite.exportData.selectFormat") : "Select Export Format"), 1),
-              x("div", rt, [
-                (a(!0), s(P, null, Te(U.value?.availableFormats || [
+            x("div", it, [
+              x("h6", rt, m(p(r)("vlite.exportData.selectFormat") !== "vlite.exportData.selectFormat" ? p(r)("vlite.exportData.selectFormat") : "Select Export Format"), 1),
+              x("div", dt, [
+                (a(!0), s(P, null, Ve(U.value?.availableFormats || [
                   { value: "excel", label: "Excel (.xlsx)", icon: "lucide:file-spreadsheet" },
                   { value: "csv", label: "CSV (.csv)", icon: "lucide:file-text" },
                   { value: "json", label: "JSON (.json)", icon: "lucide:file-json" }
@@ -598,15 +600,15 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
           ]),
           _: 1
         }, 8, ["show", "title"])) : f("", !0),
-        Z.value ? (a(), s("div", dt, [
-          u(Le, g({
+        Z.value ? (a(), s("div", st, [
+          u(Me, v({
             show: q.value,
             "onUpdate:show": n[12] || (n[12] = (o) => q.value = o),
             ref_key: "importDataRef",
-            ref: we,
-            fields: Be.value,
-            processBatch: ke,
-            onComplete: Ce
+            ref: pe,
+            fields: ke.value,
+            processBatch: Ce,
+            onComplete: De
           }, typeof t.importProps == "object" ? t.importProps : {}, {
             title: _.value,
             class: "hidden!"
@@ -617,5 +619,5 @@ const ze = { class: "flex flex-col w-full space-y-8" }, He = { class: "flex flex
   }
 });
 export {
-  St as default
+  It as default
 };

package/components/Screen/types.d.ts

@@ -70,4 +70,6 @@ export interface ScreenProps {
     showRefresh?: boolean;
     containerClass?: string;
     headerClass?: string;
+    viewProps?: Record<string, any>;
+    canSelectRows?: boolean;
 }

package/components/Tooltip.vue.js

@@ -1,6 +1,6 @@
 import { defineComponent as r, computed as c, openBlock as l, createElementBlock as i, renderSlot as n, createBlock as p, unref as d, mergeProps as u, withCtx as a } from "vue";
-import f from "v-tooltip-lite";
 import "v-tooltip-lite/style.css";
+import f from "v-tooltip-lite";
 import { $t as m } from "../utils/i18n.js";
 const y = {
   key: 0,

package/package.json

@@ -3,7 +3,7 @@
   "private": false,
   "description": "A Vue 3 UI component library built with Tailwind CSS.",
   "license": "MIT",
-  "version": "0.7.9",
+  "version": "0.7.11",
   "type": "module",
   "main": "index.js",
   "module": "index.js",
@@ -48,7 +48,7 @@
     "scrollreveal": "^4.0.9",
     "tailwindcss": "^4.1.18",
     "v-datepicker-lite": "^0.1.6",
-    "v-tooltip-lite": "^0.2.5",
+    "v-tooltip-lite": "^0.2.6",
     "vue-carousel-lite": "^0.2.7",
     "vue-draggable-plus": "^0.5.3",
     "vue3-google-signin": "^2.1.1",