vlite3 0.8.2 → 0.8.3

package/components/BackButton.vue.js

@@ -1,7 +1,7 @@
-import { defineComponent as l, openBlock as c, createBlock as s, normalizeClass as i } from "vue";
+import { defineComponent as c, openBlock as s, createBlock as l, normalizeClass as i } from "vue";
 import { useRouter as n } from "vue-router";
 import r from "./Button.vue.js";
-const p = /* @__PURE__ */ l({
+const p = /* @__PURE__ */ c({
   __name: "BackButton",
   props: {
     icon: { default: "heroicons-solid:arrow-left" },
@@ -10,18 +10,17 @@ const p = /* @__PURE__ */ l({
     class: { default: "" },
     fallback: { default: "/" }
   },
-  setup(o) {
-    const t = o, e = n();
+  setup(t) {
+    const o = t, e = n();
     function a() {
-      window.history.state?.back ? e.back() : e.push(t.fallback);
+      window.history.state?.back ? e.back() : e.push(o.fallback);
     }
-    return (f, u) => (c(), s(r, {
+    return (f, u) => (s(), l(r, {
       variant: "ghost",
-      icon: o.icon,
-      size: o.size,
-      rounded: "full",
-      title: o.tooltip,
-      class: i(t.class),
+      icon: t.icon,
+      size: t.size,
+      title: t.tooltip,
+      class: i(o.class),
       onClick: a
     }, null, 8, ["icon", "size", "title", "class"]));
   }

package/components/Breadcrumb/Breadcrumb.vue.js

@@ -1,7 +1,7 @@
 import o from "./Breadcrumb.vue2.js";
 /* empty css                */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const m = /* @__PURE__ */ r(o, [["__scopeId", "data-v-4ca31ff0"]]);
+const e = /* @__PURE__ */ r(o, [["__scopeId", "data-v-d1e90135"]]);
 export {
-  m as default
+  e as default
 };

package/components/Chip/Chip.vue.d.ts

@@ -13,11 +13,11 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<ExtendedProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    click: (event: MouseEvent) => any;
     delete: (event: MouseEvent) => any;
+    click: (event: MouseEvent) => any;
 }, string, import('vue').PublicProps, Readonly<ExtendedProps> & Readonly<{
-    onClick?: (event: MouseEvent) => any;
     onDelete?: (event: MouseEvent) => any;
+    onClick?: (event: MouseEvent) => any;
 }>, {
     text: string;
     variant: ChipVariant | string;

package/components/ChoiceBox/ChoiceBox.vue.d.ts

@@ -28,10 +28,10 @@ declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, imp
     onChange?: (value: string | number | (string | number)[]) => any;
     "onUpdate:modelValue"?: (value: string | number | (string | number)[]) => any;
 }>, {
+    grid: number;
     disabled: boolean;
     multiple: boolean;
     modelValue: string | number | (string | number)[] | null;
-    grid: number;
     gap: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 export default _default;

package/components/DataTable/DataTable.vue.d.ts

@@ -18,15 +18,15 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<DataTableProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     select: (state: SelectionState) => any;
-    change: (state: TableState) => any;
     delete: (rows: any[]) => any;
+    change: (state: TableState) => any;
     "update:itemsPerPage": (value: number) => any;
     rowClick: (payload: RowClickPayload) => any;
     "update:selectedRows": (value: any[]) => any;
 }, string, import('vue').PublicProps, Readonly<DataTableProps> & Readonly<{
     onSelect?: (state: SelectionState) => any;
-    onChange?: (state: TableState) => any;
     onDelete?: (rows: any[]) => any;
+    onChange?: (state: TableState) => any;
     "onUpdate:itemsPerPage"?: (value: number) => any;
     onRowClick?: (payload: RowClickPayload) => any;
     "onUpdate:selectedRows"?: (value: any[]) => any;

package/components/Empty/Empty.vue.d.ts

@@ -1,9 +1,11 @@
+import { EmptyVariant } from '.';
 interface Props {
     title?: string;
     titleI18n?: string;
     description?: string;
     descriptionI18n?: string;
     icon?: string;
+    variant?: EmptyVariant;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;

package/components/Empty/Empty.vue.js

@@ -1,47 +1,64 @@
-import { defineComponent as d, computed as o, openBlock as a, createElementBlock as p, createElementVNode as i, createVNode as u, toDisplayString as f, renderSlot as s } from "vue";
-import m from "../Icon.vue.js";
-import { $t as n } from "../../utils/i18n.js";
-const h = { class: "flex flex-col items-center justify-center py-28 gap-5 rounded-3xl border border-gray-150 bg-muted/50 w-full mt-4" }, y = { class: "w-17 h-17 rounded-full bg-gray-200/60 border border-gray-250 shadow-inner flex items-center justify-center" }, g = { class: "text-center space-y-1" }, _ = { class: "text-fs-5 font-semibold text-foreground tracking-tight" }, x = ["innerHTML"], k = /* @__PURE__ */ d({
+import { defineComponent as f, computed as n, defineAsyncComponent as t, openBlock as s, createElementBlock as y, createBlock as h, resolveDynamicComponent as C, createSlots as I, withCtx as p, renderSlot as c } from "vue";
+import { $t as r } from "../../utils/i18n.js";
+import { useVLiteConfig as g } from "../../core/config.js";
+const k = { class: "flex items-center justify-center min-h-[500px] w-full py-16 px-6" }, B = /* @__PURE__ */ f({
   __name: "Empty",
   props: {
     title: {},
     titleI18n: {},
     description: {},
     descriptionI18n: {},
-    icon: { default: "lucide:inbox" }
+    icon: { default: "lucide:inbox" },
+    variant: {}
   },
-  setup(r) {
-    const t = r, l = o(() => {
-      if (t.titleI18n) return n(t.titleI18n);
-      if (t.title) return t.title;
-      const e = n("vlite.empty.title");
+  setup(o) {
+    const i = o, l = g(), m = n(() => i.variant || l?.components?.empty?.variant || "variant1"), v = n(() => {
+      if (i.titleI18n) return r(i.titleI18n);
+      if (i.title) return i.title;
+      const e = r("vlite.empty.title");
       return e !== "vlite.empty.title" ? e : "No data found";
-    }), c = o(() => {
-      if (t.descriptionI18n) return n(t.descriptionI18n);
-      if (t.description) return t.description;
-      const e = n("vlite.empty.description");
+    }), d = n(() => {
+      if (i.descriptionI18n) return r(i.descriptionI18n);
+      if (i.description) return i.description;
+      const e = r("vlite.empty.description");
       return e !== "vlite.empty.description" ? e : "There is nothing to display here right now.";
-    });
-    return (e, v) => (a(), p("div", h, [
-      i("div", y, [
-        u(m, {
-          icon: r.icon,
-          class: "w-7 h-7 text-muted-foreground",
-          "stroke-width": "1.2"
-        }, null, 8, ["icon"])
-      ]),
-      i("div", g, [
-        i("h3", _, f(l.value), 1),
-        i("p", {
-          class: "text-sm text-gray-700 font-light leading-relaxed",
-          innerHTML: c.value
-        }, null, 8, x)
-      ]),
-      s(e.$slots, "action"),
-      s(e.$slots, "default")
+    }), a = {
+      variant1: t(() => import("./variants/Variant1.vue.js")),
+      variant2: t(() => import("./variants/Variant2.vue.js")),
+      variant3: t(() => import("./variants/Variant3.vue.js")),
+      variant4: t(() => import("./variants/Variant4.vue.js")),
+      variant5: t(() => import("./variants/Variant5.vue.js")),
+      variant6: t(() => import("./variants/Variant6.vue.js")),
+      variant7: t(() => import("./variants/Variant7.vue.js")),
+      variant8: t(() => import("./variants/Variant8.vue.js")),
+      variant9: t(() => import("./variants/Variant9.vue.js")),
+      variant10: t(() => import("./variants/Variant10.vue.js")),
+      variant11: t(() => import("./variants/Variant11.vue.js"))
+    }, u = n(
+      () => a[m.value] || a.variant1
+    );
+    return (e, x) => (s(), y("div", k, [
+      (s(), h(C(u.value), {
+        title: v.value,
+        description: d.value,
+        icon: o.icon
+      }, I({
+        default: p(() => [
+          c(e.$slots, "default")
+        ]),
+        _: 2
+      }, [
+        e.$slots.action ? {
+          name: "action",
+          fn: p(() => [
+            c(e.$slots, "action")
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1032, ["title", "description", "icon"]))
     ]));
   }
 });
 export {
-  k as default
+  B as default
 };

package/components/Empty/index.d.ts

@@ -1 +1,2 @@
 export { default as Empty } from './Empty.vue';
+export type EmptyVariant = 'variant1' | 'variant2' | 'variant3' | 'variant4' | 'variant5' | 'variant6' | 'variant7' | 'variant8' | 'variant9' | 'variant10' | 'variant11';

package/components/Empty/variants/Variant1.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant1.vue.js

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

package/components/Empty/variants/Variant1.vue2.js

@@ -0,0 +1,30 @@
+import { defineComponent as n, openBlock as s, createElementBlock as i, createElementVNode as t, createVNode as r, toDisplayString as c, renderSlot as l } from "vue";
+import a from "../../Icon.vue.js";
+const d = { class: "flex flex-col items-center text-center w-full py-4" }, m = { class: "mb-6 p-6 rounded-4xl bg-card border shadow-xs transition-shadow hover:shadow-sm" }, x = { class: "text-2xl font-semibold tracking-tight text-foreground mb-2.5" }, f = ["innerHTML"], _ = /* @__PURE__ */ n({
+  __name: "Variant1",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(e) {
+    return (o, h) => (s(), i("div", d, [
+      t("div", m, [
+        r(a, {
+          icon: e.icon,
+          class: "w-8 h-8 text-foreground",
+          "stroke-width": "1.2"
+        }, null, 8, ["icon"])
+      ]),
+      t("h3", x, c(e.title), 1),
+      t("p", {
+        class: "text-sm text-muted max-w-[280px] mb-8 leading-relaxed font-normal",
+        innerHTML: e.description
+      }, null, 8, f),
+      l(o.$slots, "action")
+    ]));
+  }
+});
+export {
+  _ as default
+};

package/components/Empty/variants/Variant10.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant10.vue.js

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

package/components/Empty/variants/Variant10.vue2.js

@@ -0,0 +1,37 @@
+import { defineComponent as i, openBlock as s, createElementBlock as n, createElementVNode as t, createVNode as l, toDisplayString as c, renderSlot as r, createCommentVNode as a } from "vue";
+import d from "../../Icon.vue.js";
+const m = { class: "flex w-full flex-col items-center py-12" }, f = { class: "flex w-full max-w-md flex-col text-left" }, u = { class: "mb-6 flex w-full justify-start" }, x = { class: "text-xl font-medium tracking-tight text-foreground" }, _ = ["innerHTML"], h = {
+  key: 0,
+  class: "mt-8 flex justify-start"
+}, y = /* @__PURE__ */ i({
+  __name: "Variant10",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(e) {
+    return (o, p) => (s(), n("div", m, [
+      t("div", f, [
+        t("div", u, [
+          l(d, {
+            icon: e.icon,
+            class: "h-12 w-12 text-foreground opacity-80",
+            "stroke-width": "1.2"
+          }, null, 8, ["icon"])
+        ]),
+        t("h3", x, c(e.title), 1),
+        t("p", {
+          class: "mt-2 text-sm leading-relaxed text-muted",
+          innerHTML: e.description
+        }, null, 8, _),
+        o.$slots.action ? (s(), n("div", h, [
+          r(o.$slots, "action")
+        ])) : a("", !0)
+      ])
+    ]));
+  }
+});
+export {
+  y as default
+};

package/components/Empty/variants/Variant11.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant11.vue.js

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

package/components/Empty/variants/Variant11.vue2.js

@@ -0,0 +1,29 @@
+import { defineComponent as s, openBlock as o, createElementBlock as r, createElementVNode as t, toDisplayString as n, renderSlot as a } from "vue";
+const c = { class: "flex w-full flex-col items-center text-center text-foreground py-6" }, d = { class: "mb-6 space-y-1" }, m = { class: "text-4xl font-bold tracking-tight leading-none" }, x = { class: "text-4xl font-bold tracking-tight leading-none text-muted" }, f = ["innerHTML"], p = /* @__PURE__ */ s({
+  __name: "Variant11",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(e) {
+    return (i, l) => (o(), r("div", c, [
+      t("div", d, [
+        t("h3", m, n(e.title.split(" ")[0]) + " " + n(e.title.split(" ")[1] || ""), 1),
+        t("h4", x, n(e.title.split(" ").slice(2).join(" ")), 1)
+      ]),
+      l[0] || (l[0] = t("div", { class: "relative my-8 flex w-full max-w-[400px] items-center h-px" }, [
+        t("div", { class: "h-full flex-1 bg-linear-to-r from-transparent via-border to-transparent" }),
+        t("div", { class: "absolute right-0 h-1.5 w-1.5 rounded-full bg-muted" })
+      ], -1)),
+      t("p", {
+        class: "mb-10 max-w-sm text-sm font-normal leading-relaxed text-muted",
+        innerHTML: e.description
+      }, null, 8, f),
+      a(i.$slots, "action")
+    ]));
+  }
+});
+export {
+  p as default
+};

package/components/Empty/variants/Variant2.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant2.vue.js

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

package/components/Empty/variants/Variant2.vue2.js

@@ -0,0 +1,33 @@
+import { defineComponent as n, openBlock as s, createElementBlock as i, createElementVNode as t, createVNode as c, toDisplayString as r, renderSlot as d } from "vue";
+import l from "../../Icon.vue.js";
+const a = { class: "flex flex-col md:flex-row items-center gap-6 md:gap-8 p-8 md:p-10 rounded-3xl border bg-background w-full shadow-xs" }, m = { class: "w-16 h-16 shrink-0 rounded-2xl bg-foreground flex items-center justify-center shadow-sm" }, f = { class: "flex-1 text-center md:text-left" }, x = { class: "text-xl font-bold text-foreground tracking-tight" }, u = ["innerHTML"], h = { class: "shrink-0 mt-4 md:mt-0" }, k = /* @__PURE__ */ n({
+  __name: "Variant2",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(e) {
+    return (o, _) => (s(), i("div", a, [
+      t("div", m, [
+        c(l, {
+          icon: e.icon,
+          class: "w-7 h-7 text-background"
+        }, null, 8, ["icon"])
+      ]),
+      t("div", f, [
+        t("h3", x, r(e.title), 1),
+        t("p", {
+          class: "text-sm text-muted mt-1.5 font-medium max-w-lg",
+          innerHTML: e.description
+        }, null, 8, u)
+      ]),
+      t("div", h, [
+        d(o.$slots, "action")
+      ])
+    ]));
+  }
+});
+export {
+  k as default
+};

package/components/Empty/variants/Variant3.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant3.vue.js

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

package/components/Empty/variants/Variant3.vue2.js

@@ -0,0 +1,25 @@
+import { defineComponent as r, openBlock as s, createElementBlock as i, createElementVNode as t, toDisplayString as l, renderSlot as a } from "vue";
+const d = { class: "flex flex-col items-center text-center w-full group py-8" }, c = { class: "overflow-hidden mb-6" }, u = { class: "text-6xl md:text-7xl font-black tracking-tighter text-foreground uppercase leading-[0.85] transition-transform duration-700 group-hover:-translate-y-2" }, p = ["innerHTML"], f = /* @__PURE__ */ r({
+  __name: "Variant3",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(e) {
+    return (n, o) => (s(), i("div", d, [
+      t("div", c, [
+        t("h3", u, l(e.title), 1)
+      ]),
+      o[0] || (o[0] = t("div", { class: "h-1.5 w-16 rounded-full bg-foreground/20 mb-8 transition-all duration-500 group-hover:w-24 group-hover:bg-foreground" }, null, -1)),
+      t("p", {
+        class: "text-xs text-muted font-bold tracking-[0.2em] uppercase max-w-sm mb-12",
+        innerHTML: e.description
+      }, null, 8, p),
+      a(n.$slots, "action")
+    ]));
+  }
+});
+export {
+  f as default
+};

package/components/Empty/variants/Variant4.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant4.vue.js

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

package/components/Empty/variants/Variant4.vue2.js

@@ -0,0 +1,33 @@
+import { defineComponent as i, openBlock as n, createElementBlock as o, createElementVNode as e, toDisplayString as r, renderSlot as a, createCommentVNode as c } from "vue";
+const d = { class: "flex w-full flex-col items-center justify-center py-24 px-6 min-h-[400px]" }, m = { class: "flex flex-col w-full max-w-md text-left" }, x = { class: "text-4xl sm:text-5xl font-bold tracking-tight text-foreground leading-[1.1] max-w-[280px]" }, f = ["innerHTML"], p = {
+  key: 0,
+  class: "mt-8"
+}, g = /* @__PURE__ */ i({
+  __name: "Variant4",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(t) {
+    return (l, s) => (n(), o("div", d, [
+      e("div", m, [
+        e("h3", x, r(t.title), 1),
+        s[0] || (s[0] = e("div", { class: "flex items-center w-full my-6" }, [
+          e("div", { class: "h-[2px] flex-1 bg-gradient-to-r from-gray-150 via-gray-300 to-gray-100" }),
+          e("div", { class: "h-2.5 w-2.5 rounded-full bg-gray-300 ml-1 shrink-0" })
+        ], -1)),
+        e("p", {
+          class: "text-sm sm:text-base text-muted leading-relaxed",
+          innerHTML: t.description
+        }, null, 8, f),
+        l.$slots.action ? (n(), o("div", p, [
+          a(l.$slots, "action")
+        ])) : c("", !0)
+      ])
+    ]));
+  }
+});
+export {
+  g as default
+};

package/components/Empty/variants/Variant5.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_Props = {
+    title: string;
+    description: string;
+    icon: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        action?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, 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/Empty/variants/Variant5.vue.js

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

package/components/Empty/variants/Variant5.vue2.js

@@ -0,0 +1,33 @@
+import { defineComponent as r, openBlock as n, createElementBlock as o, createVNode as i, createElementVNode as s, toDisplayString as c, renderSlot as l, createCommentVNode as m } from "vue";
+import a from "../../Icon.vue.js";
+const d = { class: "flex w-full flex-col items-center justify-center p-10 min-h-[450px] text-center rounded-2xl border border-transparent bg-muted/20" }, u = { class: "text-lg font-medium text-foreground" }, f = ["innerHTML"], x = {
+  key: 0,
+  class: "mt-8"
+}, b = /* @__PURE__ */ r({
+  __name: "Variant5",
+  props: {
+    title: {},
+    description: {},
+    icon: {}
+  },
+  setup(e) {
+    return (t, p) => (n(), o("div", d, [
+      i(a, {
+        icon: e.icon,
+        class: "mb-5 h-12 w-12 text-muted",
+        "stroke-width": "1.2"
+      }, null, 8, ["icon"]),
+      s("h3", u, c(e.title), 1),
+      s("p", {
+        class: "mt-2 text-sm text-muted max-w-sm mx-auto",
+        innerHTML: e.description
+      }, null, 8, f),
+      t.$slots.action ? (n(), o("div", x, [
+        l(t.$slots, "action")
+      ])) : m("", !0)
+    ]));
+  }
+});
+export {
+  b as default
+};