vlite3 0.3.2 → 0.3.6

package/components/Pagination/Pagination.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as N, computed as z, openBlock as s, createElementBlock as l, normalizeClass as S, createElementVNode as d, Fragment as P, renderList as $, toDisplayString as x, createVNode as b, createCommentVNode as m, createTextVNode as h, createBlock as v, withCtx as w } from "vue";
+import { defineComponent as N, computed as z, openBlock as s, createElementBlock as r, normalizeClass as S, createElementVNode as d, Fragment as P, renderList as $, toDisplayString as x, createVNode as b, createCommentVNode as m, createTextVNode as h, createBlock as v, withCtx as w } from "vue";
 import O from "../Icon.vue.js";
 import o from "../Button.vue.js";
 const R = {
@@ -24,7 +24,7 @@ const R = {
   props: {
     currentPage: { default: 1 },
     totalPages: {},
-    siblingCount: { default: 1 },
+    totalItems: { default: 1 },
     disabled: { type: Boolean, default: !1 },
     showEdges: { type: Boolean, default: !1 },
     showPageInfo: { type: Boolean, default: !1 },
@@ -36,31 +36,31 @@ const R = {
   },
   emits: ["update:currentPage", "change", "update:itemsPerPage", "change:itemsPerPage"],
   setup(e, { emit: j }) {
-    const a = e, u = j, r = (i) => {
-      a.disabled || i < 1 || i > a.totalPages || i !== a.currentPage && (u("update:currentPage", i), u("change", i));
-    }, T = (i) => {
-      const t = i.target, n = parseInt(t.value);
+    const a = e, u = j, i = (l) => {
+      a.disabled || l < 1 || l > a.totalPages || l !== a.currentPage && (u("update:currentPage", l), u("change", l));
+    }, T = (l) => {
+      const t = l.target, n = parseInt(t.value);
       u("update:itemsPerPage", n), u("change:itemsPerPage", n), u("update:currentPage", 1), u("change", 1);
     }, D = z(() => {
-      if (a.siblingCount * 2 + 5 >= a.totalPages)
+      if (a.totalItems * 2 + 5 >= a.totalPages)
         return y(1, a.totalPages);
-      const t = Math.max(a.currentPage - a.siblingCount, 1), n = Math.min(a.currentPage + a.siblingCount, a.totalPages), g = t > 2, c = n < a.totalPages - 2, k = 1, C = a.totalPages;
+      const t = Math.max(a.currentPage - a.totalItems, 1), n = Math.min(a.currentPage + a.totalItems, a.totalPages), g = t > 2, c = n < a.totalPages - 2, k = 1, I = a.totalPages;
       if (!g && c) {
-        let f = 3 + 2 * a.siblingCount;
-        return [...y(1, f), "DOTS", C];
+        let f = 3 + 2 * a.totalItems;
+        return [...y(1, f), "DOTS", I];
       }
       if (g && !c) {
-        let f = 3 + 2 * a.siblingCount, I = y(a.totalPages - f + 1, a.totalPages);
-        return [k, "DOTS", ...I];
+        let f = 3 + 2 * a.totalItems, C = y(a.totalPages - f + 1, a.totalPages);
+        return [k, "DOTS", ...C];
       }
       if (g && c) {
         let f = y(t, n);
-        return [k, "DOTS", ...f, "DOTS", C];
+        return [k, "DOTS", ...f, "DOTS", I];
       }
       return [];
-    }), y = (i, t) => {
-      let n = t - i + 1;
-      return Array.from({ length: n }, (g, c) => c + i);
+    }), y = (l, t) => {
+      let n = t - l + 1;
+      return Array.from({ length: n }, (g, c) => c + l);
     }, B = z(() => {
       if (a.alignment)
         switch (a.alignment) {
@@ -69,17 +69,17 @@ const R = {
           case "end":
             return "justify-end";
           case "between":
-            return "justify-between";
+            return "justify-between!";
           default:
             return "justify-center";
         }
       return a.showPageInfo || a.showItemsPerPage ? "justify-between" : "justify-center";
     });
-    return (i, t) => (s(), l("div", {
+    return (l, t) => (s(), r("div", {
       class: S(["flex flex-col md:flex-row items-center gap-4 w-full", [B.value]])
     }, [
-      e.showPageInfo || e.showItemsPerPage ? (s(), l("div", R, [
-        e.showItemsPerPage ? (s(), l("div", E, [
+      e.showPageInfo || e.showItemsPerPage ? (s(), r("div", R, [
+        e.showItemsPerPage ? (s(), r("div", E, [
           t[8] || (t[8] = d("span", { class: "whitespace-nowrap" }, "Show", -1)),
           d("div", V, [
             d("select", {
@@ -88,7 +88,7 @@ const R = {
               disabled: e.disabled,
               onChange: T
             }, [
-              (s(!0), l(P, null, $(e.itemsPerPageOptions, (n) => (s(), l("option", {
+              (s(!0), r(P, null, $(e.itemsPerPageOptions, (n) => (s(), r("option", {
                 key: n,
                 value: n
               }, x(n), 9, M))), 128))
@@ -100,8 +100,8 @@ const R = {
           ]),
           t[9] || (t[9] = d("span", { class: "whitespace-nowrap" }, "per page", -1))
         ])) : m("", !0),
-        e.showItemsPerPage && e.showPageInfo ? (s(), l("div", A)) : m("", !0),
-        e.showPageInfo ? (s(), l("span", F, [
+        e.showItemsPerPage && e.showPageInfo ? (s(), r("div", A)) : m("", !0),
+        e.showPageInfo ? (s(), r("span", F, [
           t[10] || (t[10] = h(" Page ", -1)),
           d("span", q, x(e.currentPage), 1),
           t[11] || (t[11] = h(" of ", -1)),
@@ -115,7 +115,7 @@ const R = {
           size: "sm",
           icon: "lucide:chevrons-left",
           disabled: e.disabled || e.currentPage === 1,
-          onClick: t[0] || (t[0] = (n) => r(1))
+          onClick: t[0] || (t[0] = (n) => i(1))
         }, null, 8, ["disabled"])) : m("", !0),
         e.navType === "icon" ? (s(), v(o, {
           key: 1,
@@ -123,14 +123,14 @@ const R = {
           size: "sm",
           icon: "lucide:chevron-left",
           disabled: e.disabled || e.currentPage === 1,
-          onClick: t[1] || (t[1] = (n) => r(e.currentPage - 1))
-        }, null, 8, ["disabled"])) : (s(), l(P, { key: 2 }, [
+          onClick: t[1] || (t[1] = (n) => i(e.currentPage - 1))
+        }, null, 8, ["disabled"])) : (s(), r(P, { key: 2 }, [
           b(o, {
             variant: "ghost",
             size: "sm",
             class: "hidden sm:flex",
             disabled: e.disabled || e.currentPage === 1,
-            onClick: t[2] || (t[2] = (n) => r(e.currentPage - 1))
+            onClick: t[2] || (t[2] = (n) => i(e.currentPage - 1))
           }, {
             default: w(() => [...t[12] || (t[12] = [
               h(" Previous ", -1)
@@ -143,11 +143,11 @@ const R = {
             icon: "lucide:chevron-left",
             class: "flex sm:hidden",
             disabled: e.disabled || e.currentPage === 1,
-            onClick: t[3] || (t[3] = (n) => r(e.currentPage - 1))
+            onClick: t[3] || (t[3] = (n) => i(e.currentPage - 1))
           }, null, 8, ["disabled"])
         ], 64)),
-        (s(!0), l(P, null, $(D.value, (n, g) => (s(), l(P, { key: g }, [
-          n === "DOTS" ? (s(), l("div", J, "...")) : (s(), v(o, {
+        (s(!0), r(P, null, $(D.value, (n, g) => (s(), r(P, { key: g }, [
+          n === "DOTS" ? (s(), r("div", J, "...")) : (s(), v(o, {
             key: 1,
             size: "sm",
             variant: n === e.currentPage ? "outline" : "ghost",
@@ -156,7 +156,7 @@ const R = {
               "text-gray-600 hover:bg-gray-100": n !== e.currentPage
             }),
             disabled: e.disabled,
-            onClick: (c) => r(n)
+            onClick: (c) => i(n)
           }, {
             default: w(() => [
               h(x(n), 1)
@@ -170,14 +170,14 @@ const R = {
           size: "sm",
           icon: "lucide:chevron-right",
           disabled: e.disabled || e.currentPage === e.totalPages,
-          onClick: t[4] || (t[4] = (n) => r(e.currentPage + 1))
-        }, null, 8, ["disabled"])) : (s(), l(P, { key: 4 }, [
+          onClick: t[4] || (t[4] = (n) => i(e.currentPage + 1))
+        }, null, 8, ["disabled"])) : (s(), r(P, { key: 4 }, [
           b(o, {
             variant: "ghost",
             size: "sm",
             class: "hidden sm:flex",
             disabled: e.disabled || e.currentPage === e.totalPages,
-            onClick: t[5] || (t[5] = (n) => r(e.currentPage + 1))
+            onClick: t[5] || (t[5] = (n) => i(e.currentPage + 1))
           }, {
             default: w(() => [...t[13] || (t[13] = [
               h(" Next ", -1)
@@ -190,7 +190,7 @@ const R = {
             icon: "lucide:chevron-right",
             class: "flex sm:hidden",
             disabled: e.disabled || e.currentPage === e.totalPages,
-            onClick: t[6] || (t[6] = (n) => r(e.currentPage + 1))
+            onClick: t[6] || (t[6] = (n) => i(e.currentPage + 1))
           }, null, 8, ["disabled"])
         ], 64)),
         e.showEdges ? (s(), v(o, {
@@ -199,7 +199,7 @@ const R = {
           size: "sm",
           icon: "lucide:chevrons-right",
           disabled: e.disabled || e.currentPage === e.totalPages,
-          onClick: t[7] || (t[7] = (n) => r(e.totalPages))
+          onClick: t[7] || (t[7] = (n) => i(e.totalPages))
         }, null, 8, ["disabled"])) : m("", !0)
       ])
     ], 2));

package/components/Pagination/index.d.ts

@@ -1 +1,20 @@
 export { default as Pagination } from './Pagination.vue';
+export interface PageInfo {
+    currentPage: number;
+    totalPages: number;
+    totalItems?: number;
+    itemsPerPage?: number;
+}
+export interface PaginationProps {
+    currentPage?: number;
+    totalPages: number;
+    totalItems?: number;
+    disabled?: boolean;
+    showEdges?: boolean;
+    showPageInfo?: boolean;
+    showItemsPerPage?: boolean;
+    itemsPerPage?: number;
+    itemsPerPageOptions?: number[];
+    navType?: 'text' | 'icon';
+    alignment?: 'start' | 'center' | 'end' | 'between';
+}

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

@@ -0,0 +1,68 @@
+import { ScreenProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        title?(_: {}): any;
+        description?(_: {}): any;
+        'before-search'?(_: {}): any;
+        actions?(_: {}): any;
+        'after-add'?(_: {}): any;
+        'custom-header'?(_: {}): any;
+        empty?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<ScreenProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    change: (payload: {
+        pageinfo: {
+            page: number;
+            limit: number;
+        };
+        pagination: {
+            page: number;
+            limit: number;
+        };
+        search: string;
+        filter: Record<string, any>;
+    }) => any;
+    add: () => any;
+}, string, import('vue').PublicProps, Readonly<ScreenProps> & Readonly<{
+    onChange?: (payload: {
+        pageinfo: {
+            page: number;
+            limit: number;
+        };
+        pagination: {
+            page: number;
+            limit: number;
+        };
+        search: string;
+        filter: Record<string, any>;
+    }) => any;
+    onAdd?: () => any;
+}>, {
+    title: string;
+    description: string;
+    data: any[];
+    loading: boolean;
+    pagination: boolean;
+    emptyTitle: string;
+    emptyDescription: string;
+    emptyIcon: string;
+    paginationProps: import('./types').ScreenPaginationProps;
+    customHeader: boolean;
+    canSearch: boolean;
+    canAdd: boolean;
+    filterSchema: import('../Form').IForm[];
+    filterType: "modal" | "dropdown";
+    showRefresh: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/Screen/Screen.vue.js

@@ -0,0 +1,370 @@
+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 = {
+  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 = {
+  key: 0,
+  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 = {
+  key: 1,
+  class: "p-8 text-center text-muted-foreground border border-dashed border-border rounded-lg"
+}, ue = { key: 2 }, Be = /* @__PURE__ */ H({
+  __name: "Screen",
+  props: {
+    title: { default: "" },
+    description: { default: "" },
+    pageInfo: {},
+    data: { default: () => [] },
+    loading: { type: Boolean, default: !1 },
+    refetch: {},
+    paginationProps: { default: () => ({
+      alignment: "end",
+      navType: "icon",
+      showItemsPerPage: !1,
+      itemsPerPageOptions: [10, 25, 50, 100]
+    }) },
+    emptyTitle: { default: "No records found" },
+    emptyDescription: { default: "We could not find any records matching your criteria." },
+    emptyIcon: { default: "lucide:inbox" },
+    addComponent: {},
+    addBtn: {},
+    list: {},
+    table: {},
+    customHeader: { type: Boolean, default: !1 },
+    canSearch: { type: Boolean, default: !0 },
+    canAdd: { type: Boolean, default: !0 },
+    pagination: { type: Boolean, default: !0 },
+    filterSchema: { default: () => [] },
+    filterType: { default: "modal" },
+    showRefresh: { type: Boolean, default: !1 }
+  },
+  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);
+      }
+    ), I(
+      () => i.pageInfo?.itemsPerPage,
+      (a) => {
+        a && (P.value = a);
+      }
+    );
+    let $ = null;
+    I(x, (a) => {
+      $ && clearTimeout($), $ = setTimeout(() => {
+        y.value = 1, b();
+      }, 300);
+    });
+    const z = (a) => {
+      y.value = a, b();
+    }, E = (a) => {
+      P.value = a, y.value = 1, b();
+    }, b = () => {
+      const a = {
+        pageinfo: {
+          page: y.value,
+          limit: P.value
+        },
+        pagination: {
+          page: y.value,
+          limit: P.value
+        },
+        search: x.value,
+        filter: C.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)
+            ]),
+            h(a.$slots, "description", {}, () => [
+              e.description ? (t(), d("p", X, r(e.description), 1)) : v("", !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"
+                  ]]),
+                  title: "List View"
+                }, [
+                  u(V, {
+                    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"
+                  ]]),
+                  title: "Table View"
+                }, [
+                  u(V, {
+                    icon: "lucide:list",
+                    class: "w-4 h-4"
+                  })
+                ], 2)
+              ])) : v("", !0),
+              h(a.$slots, "before-search"),
+              e.showRefresh ? (t(), o(f, {
+                key: 1,
+                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,
+                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: x.value,
+                  "onUpdate:modelValue": n[3] || (n[3] = (g) => x.value = g),
+                  icon: "lucide:search",
+                  placeholder: "Search...",
+                  variant: "outline",
+                  class: "bg-background w-full",
+                  "show-clear-button": !0
+                }, null, 8, ["modelValue"])
+              ])) : v("", !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({
+                      key: 0,
+                      body: e.addBtn.modal
+                    }, e.addBtn.modalProps, {
+                      refetch: e.refetch,
+                      data: e.data,
+                      triggerClass: "w-full",
+                      loading: e.loading
+                    }), {
+                      trigger: l(() => [
+                        u(f, c({
+                          class: "w-full",
+                          icon: e.addBtn.icon || "lucide:plus",
+                          variant: e.addBtn.variant || "primary"
+                        }, e.addBtn.buttonProps), {
+                          default: l(() => [
+                            m(r(e.addBtn.label || "Add"), 1)
+                          ]),
+                          _: 1
+                        }, 16, ["icon", "variant"])
+                      ]),
+                      _: 1
+                    }, 16, ["body", "refetch", "data", "loading"])) : e.addBtn.to ? (t(), o(S, {
+                      key: 1,
+                      to: e.addBtn.to,
+                      class: "inline-flex w-full sm:w-auto"
+                    }, {
+                      default: l(() => [
+                        u(f, c({
+                          class: "w-full",
+                          icon: e.addBtn.icon || "lucide:plus",
+                          variant: e.addBtn.variant || "primary"
+                        }, e.addBtn.buttonProps), {
+                          default: l(() => [
+                            m(r(e.addBtn.label || "Add"), 1)
+                          ]),
+                          _: 1
+                        }, 16, ["icon", "variant"])
+                      ]),
+                      _: 1
+                    }, 8, ["to"])) : e.addBtn.href ? (t(), d("a", {
+                      key: 2,
+                      href: e.addBtn.href,
+                      target: e.addBtn.target,
+                      class: "inline-flex w-full sm:w-auto"
+                    }, [
+                      u(f, c({
+                        class: "w-full",
+                        icon: e.addBtn.icon || "lucide:plus",
+                        variant: e.addBtn.variant || "primary"
+                      }, e.addBtn.buttonProps), {
+                        default: l(() => [
+                          m(r(e.addBtn.label || "Add"), 1)
+                        ]),
+                        _: 1
+                      }, 16, ["icon", "variant"])
+                    ], 8, te)) : (t(), o(f, c({
+                      key: 3,
+                      class: "w-full sm:w-auto",
+                      icon: e.addBtn.icon || "lucide:plus",
+                      variant: e.addBtn.variant || "primary"
+                    }, e.addBtn.buttonProps, {
+                      onClick: n[4] || (n[4] = (g) => e.addBtn.onClick ? e.addBtn.onClick() : a.$emit("add"))
+                    }), {
+                      default: l(() => [
+                        m(r(e.addBtn.label || "Add"), 1)
+                      ]),
+                      _: 1
+                    }, 16, ["icon", "variant"]))
+                  ], 64)) : (t(), o(f, {
+                    key: 1,
+                    class: "w-full sm:w-auto",
+                    icon: "lucide:plus",
+                    variant: "primary",
+                    onClick: n[5] || (n[5] = (g) => a.$emit("add"))
+                  }, {
+                    default: l(() => [...n[8] || (n[8] = [
+                      m(" Add ", -1)
+                    ])]),
+                    _: 1
+                  }))
+                ], 64)) : v("", !0)
+              ]),
+              h(a.$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({
+                      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"
+                        }, e.addBtn.buttonProps), {
+                          default: l(() => [
+                            m(r(e.addBtn.label || "Add New"), 1)
+                          ]),
+                          _: 1
+                        }, 16, ["icon", "variant"])
+                      ]),
+                      _: 1
+                    }, 16, ["body"])) : e.addBtn.to ? (t(), o(S, {
+                      key: 1,
+                      to: e.addBtn.to,
+                      class: "inline-flex"
+                    }, {
+                      default: l(() => [
+                        u(f, 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)
+                          ]),
+                          _: 1
+                        }, 16, ["icon", "variant"])
+                      ]),
+                      _: 1
+                    }, 8, ["to"])) : e.addBtn.href ? (t(), d("a", {
+                      key: 2,
+                      href: e.addBtn.href,
+                      target: e.addBtn.target,
+                      class: "inline-flex"
+                    }, [
+                      u(f, 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)
+                        ]),
+                        _: 1
+                      }, 16, ["icon", "variant"])
+                    ], 8, se)) : (t(), o(f, 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"))
+                    }), {
+                      default: l(() => [
+                        m(r(e.addBtn.label || "Add New"), 1)
+                      ]),
+                      _: 1
+                    }, 16, ["icon", "variant"]))
+                  ], 64)) : (t(), o(f, {
+                    key: 1,
+                    icon: "lucide:plus",
+                    variant: "outline",
+                    onClick: n[7] || (n[7] = (g) => a.$emit("add"))
+                  }, {
+                    default: l(() => [...n[9] || (n[9] = [
+                      m(" Add New ", -1)
+                    ])]),
+                    _: 1
+                  }))
+                ], 64)) : v("", !0)
+              ])
+            ])
+          ]) : (t(), d(w, { key: 1 }, [
+            N.value ? (t(), o(A(N.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. "))
+          ], 64))
+        ]),
+        e.pagination && e.pageInfo && e.pageInfo.totalPages > 1 ? (t(), d("div", ue, [
+          u(O(W), c({
+            "current-page": e.pageInfo.currentPage,
+            "total-pages": e.pageInfo.totalPages,
+            "total-items": e.pageInfo.totalItems
+          }, e.paginationProps, {
+            onChange: z,
+            "onUpdate:itemsPerPage": E
+          }), null, 16, ["current-page", "total-pages", "total-items"])
+        ])) : v("", !0)
+      ]);
+    };
+  }
+});
+export {
+  Be as default
+};

package/components/Screen/Screen.vue2.js

@@ -0,0 +1,4 @@
+import f from "./Screen.vue.js";
+export {
+  f as default
+};

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

@@ -0,0 +1,15 @@
+type __VLS_Props = {
+    schema: any[];
+    modelValue: Record<string, any>;
+    type?: 'modal' | 'dropdown';
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (val: Record<string, any>) => any;
+    change: (val: Record<string, any>) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: (val: Record<string, any>) => any;
+    onChange?: (val: Record<string, any>) => any;
+}>, {
+    type: "modal" | "dropdown";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;