vlite3 0.3.6 → 0.3.8

package/components/Screen/Screen.vue.js

@@ -1,31 +1,35 @@
-import { defineComponent as H, ref as k, watch as I, computed as T, resolveComponent as L, openBlock as t, createElementBlock as d, createElementVNode as s, renderSlot as h, toDisplayString as r, createCommentVNode as v, normalizeClass as j, createVNode as u, createBlock as o, resolveDynamicComponent as A, Fragment as w, mergeProps as c, withCtx as l, createTextVNode as m, unref as O } from "vue";
-import Q from "../Input.vue.js";
-import f from "../Button.vue.js";
-import V from "../Icon.vue.js";
-import D from "../Modal.vue.js";
-import W from "../Pagination/Pagination.vue.js";
-import q from "./ScreenFilter.vue.js";
-const G = { class: "flex flex-col w-full space-y-8" }, J = {
-  key: 0,
-  class: "flex flex-col md:flex-row sm:items-start md:items-center justify-between gap-4"
-}, K = { class: "flex flex-col shrink-0" }, M = {
+import { defineComponent as W, computed as S, ref as y, provide as E, watch as N, resolveComponent as X, openBlock as a, createElementBlock as i, normalizeClass as D, createElementVNode as h, renderSlot as B, toDisplayString as f, createCommentVNode as m, createBlock as s, unref as I, createVNode as r, resolveDynamicComponent as R, Fragment as P, mergeProps as c, withCtx as o, createTextVNode as v } from "vue";
+import Y from "../Input.vue.js";
+import u from "../Button.vue.js";
+import F from "../Icon.vue.js";
+import H from "../Modal.vue.js";
+import Z from "../ConfirmationModal.vue.js";
+import p from "../Pagination/Pagination.vue.js";
+import _ from "../Empty/Empty.vue.js";
+import ee from "./ScreenFilter.vue.js";
+import { usePersistentState as te } from "../../utils/usePersistentState.js";
+const ae = { class: "flex flex-col w-full space-y-8" }, ne = { class: "flex flex-col shrink-0" }, le = {
   key: 0,
   class: "text-fs-7.5 font-bold text-foreground"
-}, X = {
-  key: 0,
-  class: "text-sm text-gray-700 mt-1.5 md:max-w-[450px]"
-}, Y = { class: "flex flex-col sm:flex-row items-start sm:items-center gap-3 w-full justify-end" }, Z = { class: "flex items-center gap-3 w-full sm:w-auto flex-1 md:flex-none justify-start sm:justify-end" }, p = {
+}, de = {
   key: 0,
+  class: "text-sm text-gray-700 mt-1 md:max-w-[450px]"
+}, ie = { class: "flex flex-col sm:flex-row items-start sm:items-center gap-2.5 w-full justify-end" }, oe = { class: "flex items-center gap-2 w-full sm:w-auto flex-1 md:flex-none justify-start sm:justify-end" }, se = {
+  key: 1,
   class: "flex items-center p-1 rounded-md border border-border shrink-0"
-}, _ = {
-  key: 3,
-  class: "w-full md:w-64! max-sm:order-last"
-}, ee = { class: "flex items-center gap-3 max-sm:w-full sm:w-auto max-sm:order-last" }, te = ["href", "target"], ae = { class: "flex-1 w-full relative min-h-[300px]" }, ne = { class: "flex flex-col items-center justify-center py-16 px-4 text-center bg-card border border-border rounded-lg shadow-sm" }, de = { class: "flex h-16 w-16 items-center justify-center rounded-full bg-muted mb-4" }, le = { class: "text-lg font-semibold text-foreground" }, ie = { class: "mt-2 text-sm text-muted-foreground max-w-sm" }, oe = { class: "mt-6" }, se = ["href", "target"], re = {
+}, re = {
+  key: 4,
+  class: "w-full md:w-60! max-sm:order-last"
+}, ue = { class: "flex items-center gap-3 max-sm:w-full sm:w-auto max-sm:order-last" }, ce = ["href", "target"], fe = ["href", "target"], me = {
   key: 1,
   class: "p-8 text-center text-muted-foreground border border-dashed border-border rounded-lg"
-}, ue = { key: 2 }, Be = /* @__PURE__ */ H({
+}, ve = {
+  key: 2,
+  class: "-mt-2"
+}, $e = /* @__PURE__ */ W({
   __name: "Screen",
   props: {
+    name: { default: "" },
     title: { default: "" },
     description: { default: "" },
     pageInfo: {},
@@ -39,7 +43,7 @@ const G = { class: "flex flex-col w-full space-y-8" }, J = {
       itemsPerPageOptions: [10, 25, 50, 100]
     }) },
     emptyTitle: { default: "No records found" },
-    emptyDescription: { default: "We could not find any records matching your criteria." },
+    emptyDescription: { default: "There are currently no items to show" },
     emptyIcon: { default: "lucide:inbox" },
     addComponent: {},
     addBtn: {},
@@ -51,123 +55,148 @@ const G = { class: "flex flex-col w-full space-y-8" }, J = {
     pagination: { type: Boolean, default: !0 },
     filterSchema: { default: () => [] },
     filterType: { default: "modal" },
-    showRefresh: { type: Boolean, default: !1 }
+    showRefresh: { type: Boolean, default: !1 },
+    containerClass: {},
+    headerClass: {}
   },
-  emits: ["add", "change"],
-  setup(e, { emit: R }) {
-    const i = e, U = R, B = k(i.table ? "table" : "list"), x = k(""), C = k({}), y = k(i.pageInfo?.currentPage || 1), P = k(i.pageInfo?.itemsPerPage || i.paginationProps?.itemsPerPage || 10);
-    I(
-      () => i.pageInfo?.currentPage,
-      (a) => {
-        a && (y.value = a);
+  emits: ["add", "delete"],
+  setup(e, { emit: L }) {
+    const l = e, U = L, K = S(() => l.name || l.title || "default-screen"), b = te(
+      `view-mode-${K.value}`,
+      l.table ? "table" : "list"
+    ), x = y(""), A = y({}), w = y(l.pageInfo?.currentPage || 1), $ = y(l.pageInfo?.itemsPerPage || l.paginationProps?.itemsPerPage || 10), g = y([]), j = y([]), k = y(!1);
+    E("screen-selected-rows", g), E("screen-request-delete", (t) => T(t));
+    const T = (t) => {
+      j.value = t, k.value = !0;
+    }, O = () => {
+      U("delete", j.value), k.value = !1, g.value = [];
+    }, Q = (t) => {
+      U("delete", t), g.value = [];
+    };
+    N(
+      () => l.pageInfo?.currentPage,
+      (t) => {
+        t && (w.value = t);
       }
-    ), I(
-      () => i.pageInfo?.itemsPerPage,
-      (a) => {
-        a && (P.value = a);
+    ), N(
+      () => l.pageInfo?.itemsPerPage,
+      (t) => {
+        t && ($.value = t);
       }
     );
-    let $ = null;
-    I(x, (a) => {
-      $ && clearTimeout($), $ = setTimeout(() => {
-        y.value = 1, b();
+    let V = null;
+    N(x, (t) => {
+      V && clearTimeout(V), V = setTimeout(() => {
+        w.value = 1, C();
       }, 300);
     });
-    const z = (a) => {
-      y.value = a, b();
-    }, E = (a) => {
-      P.value = a, y.value = 1, b();
-    }, b = () => {
-      const a = {
+    const G = (t) => {
+      w.value = t, C();
+    }, J = (t) => {
+      $.value = t, w.value = 1, C();
+    }, C = () => {
+      const t = {
         pageinfo: {
-          page: y.value,
-          limit: P.value
+          page: w.value,
+          limit: $.value
         },
         pagination: {
-          page: y.value,
-          limit: P.value
+          page: w.value,
+          limit: $.value
         },
         search: x.value,
-        filter: C.value
+        filter: A.value
       };
-      U("change", a), i.refetch && i.refetch(a);
-    }, N = T(() => B.value === "table" && i.table ? i.table : i.list), F = T(() => i.data && i.data.length > 0);
-    return (a, n) => {
-      const S = L("router-link");
-      return t(), d("div", G, [
-        e.customHeader ? h(a.$slots, "custom-header", { key: 1 }) : (t(), d("div", J, [
-          s("div", K, [
-            h(a.$slots, "title", {}, () => [
-              e.title ? (t(), d("h1", M, r(e.title), 1)) : v("", !0)
+      l.refetch && l.refetch(t);
+    }, z = S(() => b.value === "table" && l.table ? l.table : l.list), M = S(() => l.data && l.data.length > 0);
+    return (t, n) => {
+      const q = X("router-link");
+      return a(), i("div", ae, [
+        e.customHeader ? B(t.$slots, "custom-header", { key: 1 }) : (a(), i("div", {
+          key: 0,
+          class: D([e.headerClass, "flex flex-col md:flex-row sm:items-start md:items-center justify-between gap-4"])
+        }, [
+          h("div", ne, [
+            B(t.$slots, "title", {}, () => [
+              e.title ? (a(), i("h1", le, f(e.title), 1)) : m("", !0)
             ]),
-            h(a.$slots, "description", {}, () => [
-              e.description ? (t(), d("p", X, r(e.description), 1)) : v("", !0)
+            B(t.$slots, "description", {}, () => [
+              e.description ? (a(), i("p", de, f(e.description), 1)) : m("", !0)
             ])
           ]),
-          s("div", Y, [
-            s("div", Z, [
-              e.table && e.list ? (t(), d("div", p, [
-                s("button", {
-                  onClick: n[0] || (n[0] = (g) => B.value = "list"),
-                  class: j(["p-1.5 rounded transition-colors", [
-                    B.value === "list" ? "bg-secondary/70 shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"
+          h("div", ie, [
+            h("div", oe, [
+              g.value.length > 0 ? (a(), s(u, {
+                key: 0,
+                variant: "outline",
+                class: "hover:bg-destructive/10 shrink-0 h-9! w-9!",
+                icon: "lucide:trash-2",
+                title: "Delete Selected",
+                onClick: n[0] || (n[0] = (d) => T(g.value))
+              })) : m("", !0),
+              e.table && e.list ? (a(), i("div", se, [
+                h("button", {
+                  onClick: n[1] || (n[1] = (d) => b.value = "list"),
+                  class: D(["p-1.5 rounded", [
+                    I(b) === "list" ? "bg-secondary/85 dark:bg-gray-250 shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"
                   ]]),
                   title: "List View"
                 }, [
-                  u(V, {
+                  r(F, {
                     icon: "lucide:layout-grid",
                     class: "w-4 h-4"
                   })
                 ], 2),
-                s("button", {
-                  onClick: n[1] || (n[1] = (g) => B.value = "table"),
-                  class: j(["p-1.5 rounded transition-colors", [
-                    B.value === "table" ? "bg-secondary/70 shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"
+                h("button", {
+                  onClick: n[2] || (n[2] = (d) => b.value = "table"),
+                  class: D(["p-1.5 rounded", [
+                    I(b) === "table" ? "bg-secondary/85 dark:bg-gray-250 shadow-sm text-foreground" : "text-muted-foreground hover:text-foreground"
                   ]]),
                   title: "Table View"
                 }, [
-                  u(V, {
+                  r(F, {
                     icon: "lucide:list",
                     class: "w-4 h-4"
                   })
                 ], 2)
-              ])) : v("", !0),
-              h(a.$slots, "before-search"),
-              e.showRefresh ? (t(), o(f, {
-                key: 1,
+              ])) : m("", !0),
+              B(t.$slots, "before-search"),
+              e.showRefresh ? (a(), s(u, {
+                key: 2,
                 variant: "outline",
                 icon: "lucide:refresh-cw",
                 size: "lg",
                 class: "shrink-0 h-9! w-9!",
                 title: "Refresh",
                 disabled: e.loading,
-                onClick: b
-              }, null, 8, ["disabled"])) : v("", !0),
-              e.filterSchema && e.filterSchema.length > 0 ? (t(), o(q, {
-                key: 2,
+                onClick: C
+              }, null, 8, ["disabled"])) : m("", !0),
+              e.filterSchema && e.filterSchema.length > 0 ? (a(), s(ee, {
+                key: 3,
                 schema: e.filterSchema,
                 type: e.filterType,
-                modelValue: C.value,
-                "onUpdate:modelValue": n[2] || (n[2] = (g) => C.value = g),
-                onChange: b
-              }, null, 8, ["schema", "type", "modelValue"])) : v("", !0),
-              e.canSearch ? (t(), d("div", _, [
-                u(Q, {
+                modelValue: A.value,
+                "onUpdate:modelValue": n[3] || (n[3] = (d) => A.value = d),
+                onChange: C
+              }, null, 8, ["schema", "type", "modelValue"])) : m("", !0),
+              e.canSearch ? (a(), i("div", re, [
+                r(Y, {
+                  lazy: "",
                   modelValue: x.value,
-                  "onUpdate:modelValue": n[3] || (n[3] = (g) => x.value = g),
+                  "onUpdate:modelValue": n[4] || (n[4] = (d) => x.value = d),
                   icon: "lucide:search",
                   placeholder: "Search...",
                   variant: "outline",
                   class: "bg-background w-full",
                   "show-clear-button": !0
                 }, null, 8, ["modelValue"])
-              ])) : v("", !0)
+              ])) : m("", !0)
             ]),
-            s("div", ee, [
-              h(a.$slots, "actions", {}, () => [
-                e.addComponent ? (t(), o(A(e.addComponent), { key: 0 })) : e.canAdd ? (t(), d(w, { key: 1 }, [
-                  e.addBtn ? (t(), d(w, { key: 0 }, [
-                    e.addBtn.modal ? (t(), o(D, c({
+            h("div", ue, [
+              B(t.$slots, "actions", {}, () => [
+                e.addComponent ? (a(), s(R(e.addComponent), { key: 0 })) : e.canAdd ? (a(), i(P, { key: 1 }, [
+                  e.addBtn ? (a(), i(P, { key: 0 }, [
+                    e.addBtn.modal ? (a(), s(H, c({
                       key: 0,
                       body: e.addBtn.modal
                     }, e.addBtn.modalProps, {
@@ -176,195 +205,211 @@ const G = { class: "flex flex-col w-full space-y-8" }, J = {
                       triggerClass: "w-full",
                       loading: e.loading
                     }), {
-                      trigger: l(() => [
-                        u(f, c({
+                      trigger: o(() => [
+                        r(u, c({
                           class: "w-full",
-                          icon: e.addBtn.icon || "lucide:plus",
+                          icon: e.addBtn.icon || "fluent:add-16-filled",
                           variant: e.addBtn.variant || "primary"
                         }, e.addBtn.buttonProps), {
-                          default: l(() => [
-                            m(r(e.addBtn.label || "Add"), 1)
+                          default: o(() => [
+                            v(f(e.addBtn.label || "Add"), 1)
                           ]),
                           _: 1
                         }, 16, ["icon", "variant"])
                       ]),
                       _: 1
-                    }, 16, ["body", "refetch", "data", "loading"])) : e.addBtn.to ? (t(), o(S, {
+                    }, 16, ["body", "refetch", "data", "loading"])) : e.addBtn.to ? (a(), s(q, {
                       key: 1,
                       to: e.addBtn.to,
                       class: "inline-flex w-full sm:w-auto"
                     }, {
-                      default: l(() => [
-                        u(f, c({
+                      default: o(() => [
+                        r(u, c({
                           class: "w-full",
-                          icon: e.addBtn.icon || "lucide:plus",
+                          icon: e.addBtn.icon || "fluent:add-16-filled",
                           variant: e.addBtn.variant || "primary"
                         }, e.addBtn.buttonProps), {
-                          default: l(() => [
-                            m(r(e.addBtn.label || "Add"), 1)
+                          default: o(() => [
+                            v(f(e.addBtn.label || "Add"), 1)
                           ]),
                           _: 1
                         }, 16, ["icon", "variant"])
                       ]),
                       _: 1
-                    }, 8, ["to"])) : e.addBtn.href ? (t(), d("a", {
+                    }, 8, ["to"])) : e.addBtn.href ? (a(), i("a", {
                       key: 2,
                       href: e.addBtn.href,
                       target: e.addBtn.target,
                       class: "inline-flex w-full sm:w-auto"
                     }, [
-                      u(f, c({
+                      r(u, c({
                         class: "w-full",
-                        icon: e.addBtn.icon || "lucide:plus",
+                        icon: e.addBtn.icon || "fluent:add-16-filled",
                         variant: e.addBtn.variant || "primary"
                       }, e.addBtn.buttonProps), {
-                        default: l(() => [
-                          m(r(e.addBtn.label || "Add"), 1)
+                        default: o(() => [
+                          v(f(e.addBtn.label || "Add"), 1)
                         ]),
                         _: 1
                       }, 16, ["icon", "variant"])
-                    ], 8, te)) : (t(), o(f, c({
+                    ], 8, ce)) : (a(), s(u, c({
                       key: 3,
                       class: "w-full sm:w-auto",
-                      icon: e.addBtn.icon || "lucide:plus",
+                      icon: e.addBtn.icon || "fluent:add-16-filled",
                       variant: e.addBtn.variant || "primary"
                     }, e.addBtn.buttonProps, {
-                      onClick: n[4] || (n[4] = (g) => e.addBtn.onClick ? e.addBtn.onClick() : a.$emit("add"))
+                      onClick: n[5] || (n[5] = (d) => e.addBtn.onClick ? e.addBtn.onClick() : t.$emit("add"))
                     }), {
-                      default: l(() => [
-                        m(r(e.addBtn.label || "Add"), 1)
+                      default: o(() => [
+                        v(f(e.addBtn.label || "Add"), 1)
                       ]),
                       _: 1
                     }, 16, ["icon", "variant"]))
-                  ], 64)) : (t(), o(f, {
+                  ], 64)) : (a(), s(u, {
                     key: 1,
                     class: "w-full sm:w-auto",
-                    icon: "lucide:plus",
+                    icon: "fluent:add-16-filled",
                     variant: "primary",
-                    onClick: n[5] || (n[5] = (g) => a.$emit("add"))
+                    onClick: n[6] || (n[6] = (d) => t.$emit("add"))
                   }, {
-                    default: l(() => [...n[8] || (n[8] = [
-                      m(" Add ", -1)
+                    default: o(() => [...n[12] || (n[12] = [
+                      v(" Add ", -1)
                     ])]),
                     _: 1
                   }))
-                ], 64)) : v("", !0)
+                ], 64)) : m("", !0)
               ]),
-              h(a.$slots, "after-add")
+              B(t.$slots, "after-add")
             ])
           ])
-        ])),
-        s("div", ae, [
-          !F.value && !e.loading ? h(a.$slots, "empty", { key: 0 }, () => [
-            s("div", ne, [
-              s("div", de, [
-                u(V, {
-                  icon: e.emptyIcon,
-                  class: "h-8 w-8 text-muted-foreground"
-                }, null, 8, ["icon"])
-              ]),
-              s("h3", le, r(e.emptyTitle), 1),
-              s("p", ie, r(e.emptyDescription), 1),
-              s("div", oe, [
-                e.addComponent ? (t(), o(A(e.addComponent), { key: 0 })) : e.canAdd ? (t(), d(w, { key: 1 }, [
-                  e.addBtn ? (t(), d(w, { key: 0 }, [
-                    e.addBtn.modal ? (t(), o(D, c({
+        ], 2)),
+        h("div", {
+          class: D(["flex-1 w-full relative min-h-[300px]", e.containerClass])
+        }, [
+          !M.value && !e.loading ? B(t.$slots, "empty", { key: 0 }, () => [
+            r(I(_), {
+              title: e.emptyTitle,
+              description: e.emptyDescription,
+              icon: e.emptyIcon
+            }, {
+              action: o(() => [
+                e.addComponent ? (a(), s(R(e.addComponent), { key: 0 })) : e.canAdd ? (a(), i(P, { key: 1 }, [
+                  e.addBtn ? (a(), i(P, { key: 0 }, [
+                    e.addBtn.modal ? (a(), s(H, c({
                       key: 0,
                       body: e.addBtn.modal
                     }, e.addBtn.modalProps), {
-                      trigger: l(() => [
-                        u(f, c({
-                          icon: e.addBtn.icon || "lucide:plus",
-                          variant: e.addBtn.variant || "outline"
+                      trigger: o(() => [
+                        r(u, c({
+                          icon: e.addBtn.icon || "fluent:add-16-filled",
+                          variant: e.addBtn.variant || "primary",
+                          rounded: "full",
+                          class: "px-6!"
                         }, e.addBtn.buttonProps), {
-                          default: l(() => [
-                            m(r(e.addBtn.label || "Add New"), 1)
+                          default: o(() => [
+                            v(f(e.addBtn.label || "Add New"), 1)
                           ]),
                           _: 1
                         }, 16, ["icon", "variant"])
                       ]),
                       _: 1
-                    }, 16, ["body"])) : e.addBtn.to ? (t(), o(S, {
+                    }, 16, ["body"])) : e.addBtn.to ? (a(), s(q, {
                       key: 1,
                       to: e.addBtn.to,
                       class: "inline-flex"
                     }, {
-                      default: l(() => [
-                        u(f, c({
-                          icon: e.addBtn.icon || "lucide:plus",
+                      default: o(() => [
+                        r(u, c({
+                          icon: e.addBtn.icon || "fluent:add-16-filled",
                           variant: e.addBtn.variant || "outline"
                         }, e.addBtn.buttonProps), {
-                          default: l(() => [
-                            m(r(e.addBtn.label || "Add New"), 1)
+                          default: o(() => [
+                            v(f(e.addBtn.label || "Add New"), 1)
                           ]),
                           _: 1
                         }, 16, ["icon", "variant"])
                       ]),
                       _: 1
-                    }, 8, ["to"])) : e.addBtn.href ? (t(), d("a", {
+                    }, 8, ["to"])) : e.addBtn.href ? (a(), i("a", {
                       key: 2,
                       href: e.addBtn.href,
                       target: e.addBtn.target,
                       class: "inline-flex"
                     }, [
-                      u(f, c({
+                      r(u, c({
                         icon: e.addBtn.icon || "lucide:plus",
                         variant: e.addBtn.variant || "outline"
                       }, e.addBtn.buttonProps), {
-                        default: l(() => [
-                          m(r(e.addBtn.label || "Add New"), 1)
+                        default: o(() => [
+                          v(f(e.addBtn.label || "Add New"), 1)
                         ]),
                         _: 1
                       }, 16, ["icon", "variant"])
-                    ], 8, se)) : (t(), o(f, c({
+                    ], 8, fe)) : (a(), s(u, c({
                       key: 3,
                       icon: e.addBtn.icon || "lucide:plus",
                       variant: e.addBtn.variant || "outline"
                     }, e.addBtn.buttonProps, {
-                      onClick: n[6] || (n[6] = (g) => e.addBtn.onClick ? e.addBtn.onClick() : a.$emit("add"))
+                      onClick: n[7] || (n[7] = (d) => e.addBtn.onClick ? e.addBtn.onClick() : t.$emit("add"))
                     }), {
-                      default: l(() => [
-                        m(r(e.addBtn.label || "Add New"), 1)
+                      default: o(() => [
+                        v(f(e.addBtn.label || "Add New"), 1)
                       ]),
                       _: 1
                     }, 16, ["icon", "variant"]))
-                  ], 64)) : (t(), o(f, {
+                  ], 64)) : (a(), s(u, {
                     key: 1,
                     icon: "lucide:plus",
                     variant: "outline",
-                    onClick: n[7] || (n[7] = (g) => a.$emit("add"))
+                    onClick: n[8] || (n[8] = (d) => t.$emit("add"))
                   }, {
-                    default: l(() => [...n[9] || (n[9] = [
-                      m(" Add New ", -1)
+                    default: o(() => [...n[13] || (n[13] = [
+                      v(" Add New ", -1)
                     ])]),
                     _: 1
                   }))
-                ], 64)) : v("", !0)
-              ])
-            ])
-          ]) : (t(), d(w, { key: 1 }, [
-            N.value ? (t(), o(A(N.value), {
+                ], 64)) : m("", !0)
+              ]),
+              _: 1
+            }, 8, ["title", "description", "icon"])
+          ]) : (a(), i(P, { key: 1 }, [
+            z.value ? (a(), s(R(z.value), {
               key: 0,
               data: e.data,
               loading: e.loading,
-              refetch: e.refetch
-            }, null, 8, ["data", "loading", "refetch"])) : (t(), d("div", re, " Please provide a `:list` or `:table` component. "))
+              refetch: e.refetch,
+              selectedRows: g.value,
+              "onUpdate:selectedRows": n[9] || (n[9] = (d) => g.value = d),
+              delete: T,
+              onDelete: Q
+            }, null, 40, ["data", "loading", "refetch", "selectedRows"])) : (a(), i("div", me, " Please provide a `:list` or `:table` component. "))
           ], 64))
-        ]),
-        e.pagination && e.pageInfo && e.pageInfo.totalPages > 1 ? (t(), d("div", ue, [
-          u(O(W), c({
+        ], 2),
+        e.pagination && e.pageInfo && e.pageInfo.totalPages > 1 ? (a(), i("div", ve, [
+          r(I(p), c({
             "current-page": e.pageInfo.currentPage,
             "total-pages": e.pageInfo.totalPages,
             "total-items": e.pageInfo.totalItems
           }, e.paginationProps, {
-            onChange: z,
-            "onUpdate:itemsPerPage": E
+            onChange: G,
+            "onUpdate:itemsPerPage": J
           }), null, 16, ["current-page", "total-pages", "total-items"])
-        ])) : v("", !0)
+        ])) : m("", !0),
+        r(Z, {
+          show: k.value,
+          "onUpdate:show": n[10] || (n[10] = (d) => k.value = d),
+          title: "Confirm Deletion",
+          description: "Are you sure you want to delete the selected items? This action cannot be undone.",
+          "confirm-text": "Delete",
+          "cancel-text": "Cancel",
+          variant: "danger",
+          onConfirm: O,
+          onCancel: n[11] || (n[11] = (d) => k.value = !1)
+        }, null, 8, ["show"])
       ]);
     };
   }
 });
 export {
-  Be as default
+  $e as default
 };