vlite3 1.0.10 → 1.1.2

package/components/CategoryManager/CategoryNode.vue.js

@@ -0,0 +1,224 @@
+import { defineComponent as F, inject as K, computed as p, resolveComponent as R, openBlock as r, createBlock as x, unref as l, withCtx as T, createElementBlock as s, Fragment as A, renderList as L, isMemoSame as O, createElementVNode as f, normalizeClass as u, createVNode as i, createCommentVNode as c, withDirectives as k, withModifiers as P, withKeys as w, vModelText as U, toDisplayString as Q, vShow as q } from "vue";
+import { VueDraggable as G } from "vue-draggable-plus";
+import C from "../Icon.vue.js";
+import g from "../Button.vue.js";
+import N from "../IconPicker.vue.js";
+const H = { class: "flex items-center gap-px overflow-hidden flex-1" }, J = ["onClick"], W = { class: "flex items-center gap-1.5 overflow-hidden flex-1 w-full" }, X = {
+  key: 0,
+  class: "drag-handle cursor-grab active:cursor-grabbing text-muted hover:text-foreground transition-colors p-0.5 shrink-0"
+}, Y = ["onUpdate:modelValue", "onChange"], Z = {
+  key: 0,
+  class: "flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity shrink-0 bg-background/80 px-1 rounded ml-2"
+}, ee = {
+  key: 0,
+  class: "ml-6 pl-3 border-l border-border mt-1.5 flex flex-col relative"
+}, te = {
+  key: 1,
+  class: "flex items-center gap-1.5 py-1.5 px-2 bg-background border border-border shadow-sm rounded-lg w-full mb-1.5"
+}, de = /* @__PURE__ */ F({
+  __name: "CategoryNode",
+  props: {
+    modelValue: {},
+    level: { default: 0 }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(V, { emit: D }) {
+    const S = V, y = D, t = K("categoryManager"), b = p({
+      get: () => S.modelValue,
+      set: (d) => y("update:modelValue", d)
+    }), M = (d, n) => {
+      n.children = d, y("change");
+    }, I = () => y("change"), v = p(() => t?.readonly.value || !1), a = p(() => t?.size.value || "md"), j = p(() => a.value === "sm" ? "p-1 md:p-1.5" : a.value === "lg" ? "p-2 md:p-2.5" : "py-1.5 px-2"), $ = p(() => {
+      const n = S.level === 0 ? "font-semibold" : "font-medium";
+      return a.value === "sm" ? `text-xs ${n} text-foreground` : a.value === "lg" ? `-text-fs-1 ${n} text-foreground` : `text-sm ${n} text-foreground`;
+    }), m = p(() => a.value === "sm" ? "w-3.5 h-3.5" : a.value === "lg" ? "w-4.5 h-4.5" : "w-4 h-4"), B = {
+      mounted: (d) => {
+        setTimeout(() => d.focus(), 10);
+      }
+    };
+    return (d, n) => {
+      const E = R("CategoryNode", !0);
+      return r(), x(l(G), {
+        modelValue: b.value,
+        "onUpdate:modelValue": n[10] || (n[10] = (e) => b.value = e),
+        group: "category-manager",
+        animation: 150,
+        handle: ".drag-handle",
+        "ghost-class": "opacity-50",
+        disabled: v.value,
+        class: "min-h-[2px]",
+        onChange: I
+      }, {
+        default: T(() => [
+          (r(!0), s(A, null, L(b.value, (e, ne, le, h) => {
+            const _ = [
+              e.id,
+              e.title,
+              e.icon,
+              e.children?.length,
+              l(t)?.expandedIds.value.has(e.id),
+              l(t)?.inlineState.value.targetId === e.id,
+              l(t)?.inlineState.value.mode,
+              v.value,
+              a.value
+            ];
+            if (h && h.key === e.id && O(h, _)) return h;
+            const z = (r(), s("div", {
+              key: e.id,
+              class: "mb-1.5 flex flex-col"
+            }, [
+              f("div", {
+                class: u([
+                  "group flex items-center justify-between rounded-lg transition-colors bg-body! border border-border ",
+                  j.value
+                ])
+              }, [
+                f("div", H, [
+                  e.children && e.children.length > 0 ? (r(), s("button", {
+                    key: 0,
+                    onClick: (o) => l(t)?.toggleExpand(e.id),
+                    class: u([
+                      "flex items-center justify-center shrink-0 text-muted-foreground hover:bg-muted rounded transition-colors",
+                      a.value === "sm" ? "w-4 h-4" : a.value === "lg" ? "w-6 h-6" : "w-6.5 h-6.5"
+                    ])
+                  }, [
+                    i(C, {
+                      icon: l(t)?.expandedIds.value.has(e.id) ? "lucide:chevron-down" : "lucide:chevron-right",
+                      class: u(m.value)
+                    }, null, 8, ["icon", "class"])
+                  ], 10, J)) : c("", !0),
+                  f("div", W, [
+                    v.value ? c("", !0) : (r(), s("div", X, [
+                      i(C, {
+                        icon: "lucide:grip-vertical",
+                        class: u(m.value)
+                      }, null, 8, ["class"])
+                    ])),
+                    v.value ? e.icon ? (r(), x(C, {
+                      key: 2,
+                      icon: e.icon,
+                      class: u([m.value, "shrink-0 text-muted-foreground"])
+                    }, null, 8, ["icon", "class"])) : c("", !0) : (r(), x(N, {
+                      key: 1,
+                      value: e.icon,
+                      "btn-props": {
+                        variant: "ghost",
+                        size: "xs",
+                        iconClass: m.value,
+                        class: (a.value === "sm" ? "h-5 w-5" : a.value === "lg" ? "h-7 w-7" : "h-6 w-6") + " -ml-0.5! p-0 text-muted-foreground hover:text-foreground shrink-0 rounded-md"
+                      },
+                      position: "bottom-start",
+                      onOnSelect: (o) => {
+                        console.log("IconPicker value :>> ", o), e.icon = o, l(t)?.saveItem(e);
+                      }
+                    }, null, 8, ["value", "btn-props", "onOnSelect"])),
+                    v.value ? (r(), s("span", {
+                      key: 4,
+                      class: u(["truncate", $.value])
+                    }, Q(e.title), 3)) : k((r(), s("input", {
+                      key: 3,
+                      "onUpdate:modelValue": (o) => e.title = o,
+                      class: u([
+                        "bg-transparent border-0 outline-none focus:ring-0 px-1 py-0.5 -ml-1 transition-colors w-full truncate cursor-text min-w-0 shadow-none caret-primary",
+                        $.value
+                      ]),
+                      placeholder: "Category title...",
+                      onChange: (o) => l(t)?.saveItem(e),
+                      onKeyup: n[0] || (n[0] = w((o) => o.target.blur(), ["enter"])),
+                      onClick: n[1] || (n[1] = P(() => {
+                      }, ["stop"]))
+                    }, null, 42, Y)), [
+                      [U, e.title]
+                    ])
+                  ])
+                ]),
+                v.value ? c("", !0) : (r(), s("div", Z, [
+                  i(g, {
+                    variant: "ghost",
+                    size: "xs",
+                    icon: "lucide:plus",
+                    title: "Quick Add Subcategory",
+                    class: "h-7 w-7 px-0 text-muted-foreground hover:text-primary",
+                    onClick: (o) => l(t)?.startInline("add-child", e.id)
+                  }, null, 8, ["onClick"]),
+                  i(g, {
+                    variant: "ghost",
+                    size: "xs",
+                    icon: "lucide:settings",
+                    title: "Advanced Details",
+                    class: "h-7 w-7 px-0 text-muted-foreground hover:text-primary",
+                    onClick: (o) => l(t)?.openModalForm("edit", e)
+                  }, null, 8, ["onClick"]),
+                  i(g, {
+                    variant: "ghost",
+                    size: "xs",
+                    icon: "lucide:trash-2",
+                    title: "Delete",
+                    class: "h-7 w-7 px-0 text-muted-foreground hover:text-destructive hover:bg-destructive/10",
+                    onClick: (o) => l(t)?.deleteItem(e)
+                  }, null, 8, ["onClick"])
+                ]))
+              ], 2),
+              e.children && e.children.length > 0 || l(t)?.inlineState.value.mode === "add-child" && l(t).inlineState.value.targetId === e.id ? k((r(), s("div", ee, [
+                e.children && e.children.length > 0 ? (r(), x(E, {
+                  key: 0,
+                  modelValue: e.children,
+                  "onUpdate:modelValue": (o) => M(o, e),
+                  level: V.level + 1,
+                  onChange: I
+                }, null, 8, ["modelValue", "onUpdate:modelValue", "level"])) : c("", !0),
+                l(t)?.inlineState.value.mode === "add-child" && l(t).inlineState.value.targetId === e.id ? (r(), s("div", te, [
+                  i(N, {
+                    modelValue: l(t).inlineState.value.icon,
+                    "onUpdate:modelValue": n[2] || (n[2] = (o) => l(t).inlineState.value.icon = o),
+                    "btn-props": {
+                      variant: "ghost",
+                      size: "xs",
+                      class: "h-6 w-6 p-0 text-muted-foreground hover:text-foreground shrink-0 rounded-md"
+                    },
+                    position: "bottom-start"
+                  }, null, 8, ["modelValue"]),
+                  k(f("input", {
+                    "onUpdate:modelValue": n[3] || (n[3] = (o) => l(t).inlineState.value.title = o),
+                    class: "flex-1 bg-transparent border-0 outline-none focus:ring-0 px-1 py-0.5 text-sm transition-colors w-full shadow-none caret-primary text-foreground placeholder:text-muted-foreground",
+                    placeholder: "New subcategory title...",
+                    onKeyup: [
+                      n[4] || (n[4] = w((o) => l(t).saveInline(), ["enter"])),
+                      n[5] || (n[5] = w((o) => l(t).cancelInline(), ["esc"]))
+                    ]
+                  }, null, 544), [
+                    [B],
+                    [U, l(t).inlineState.value.title]
+                  ]),
+                  i(g, {
+                    variant: "primary",
+                    size: "xs",
+                    icon: "lucide:check",
+                    class: "shrink-0 h-6 w-6 px-0",
+                    title: "Save",
+                    onClick: n[6] || (n[6] = (o) => l(t).saveInline())
+                  }),
+                  i(g, {
+                    variant: "ghost",
+                    size: "xs",
+                    icon: "lucide:x",
+                    class: "shrink-0 h-6 w-6 px-0",
+                    title: "Cancel",
+                    onClick: n[7] || (n[7] = (o) => l(t).cancelInline())
+                  })
+                ])) : c("", !0)
+              ], 512)), [
+                [q, l(t)?.expandedIds.value.has(e.id)]
+              ]) : c("", !0)
+            ]));
+            return z.memo = _, z;
+          }, n, 8), 128))
+        ]),
+        _: 1
+      }, 8, ["modelValue", "disabled"]);
+    };
+  }
+});
+export {
+  de as default
+};

package/components/CategoryManager/CategoryNode.vue2.js

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

package/components/CategoryManager/types.d.ts

@@ -6,11 +6,25 @@ export interface CategoryItem {
     icon?: string;
     description?: string;
     children?: CategoryItem[];
+    parentId?: string | number | null;
+    position?: number;
+    [key: string]: any;
+}
+export interface RawCategoryItem {
+    id: string | number;
+    name?: string;
+    title?: string;
+    icon?: string;
+    position?: number;
+    parentId?: string | number | null;
+    fullPath?: string;
     [key: string]: any;
 }
 export interface CategoryManagerProps {
     /** The nested array of category items */
     modelValue?: CategoryItem[];
+    /** Optional flat list of items to be auto-converted to a nested tree */
+    rawData?: RawCategoryItem[];
     /** Optional custom form schema for add/edit operations */
     formSchema?: IForm[];
     /** Disable drag-and-drop and mutation actions */

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;
     class: string;

package/components/ColorPicker/ColorIro.vue3.js

@@ -1,5 +1,5 @@
-import o from "./ColorIro.vue.js";
-/* empty css              */
+import o from "./ColorIro.vue2.js";
+/* empty css             */
 export {
   o as default
 };

package/components/ColorPicker/ColorPicker.vue.js

@@ -6,8 +6,8 @@ import O from "../Input.vue.js";
 import "../../core/config.js";
 /* empty css                            */
 import y from "../Button.vue.js";
-import E from "./ColorIro.vue.js";
-/* empty css              */
+import E from "./ColorIro.vue2.js";
+/* empty css             */
 import { useEyeDropper as P } from "@vueuse/core";
 const I = {
   key: 0,

package/components/CommandPalette/CommandPaletteContent.vue.js

@@ -1,7 +1,7 @@
 import t from "./CommandPaletteContent.vue2.js";
 /* empty css                           */
 import o from "../../_virtual/_plugin-vue_export-helper.js";
-const r = /* @__PURE__ */ o(t, [["__scopeId", "data-v-1bae4c0f"]]);
+const r = /* @__PURE__ */ o(t, [["__scopeId", "data-v-aa0dbb48"]]);
 export {
   r as default
 };

package/components/CommandPalette/CommandPaletteContent.vue2.js

@@ -4,17 +4,17 @@ import k from "../Icon.vue.js";
 import { $t as E } from "../../utils/i18n.js";
 import { useCommandPaletteItems as Y } from "./useCommandPaletteItems.js";
 import { useCommandPaletteNav as Z } from "./useCommandPaletteNav.js";
-import ee from "./CommandPaletteItem.vue2.js";
-const te = { class: "command-palette-content flex flex-col w-full h-full max-h-[70vh]" }, oe = { class: "flex items-center gap-3 px-4 py-3 border-b border-border/60 shrink-0" }, se = ["placeholder"], ne = ["aria-label"], re = {
+import ee from "./CommandPaletteItem.vue.js";
+const te = { class: "command-palette-content flex flex-col w-full h-full max-h-[70vh]" }, oe = { class: "flex items-center gap-3 px-4 py-3 border-b border-border/80 shrink-0" }, se = ["placeholder"], ne = ["aria-label"], re = {
   key: 0,
   class: "flex flex-col items-center justify-center py-14 px-6 text-center select-none",
   "aria-live": "polite"
 }, le = { class: "text-sm font-medium text-muted-foreground" }, ae = { class: "text-foreground font-semibold" }, de = { class: "text-xs text-muted-foreground/60 mt-1" }, ie = ["aria-label"], ue = ["aria-label"], ce = {
   key: 0,
-  class: "my-1.5 mx-3 h-px bg-border/40",
+  class: "my-1.5 mx-3 h-px bg-border/80",
   "aria-hidden": "true"
 }, me = {
-  class: "px-4 py-2.5 border-t border-border/40 flex items-center gap-4 shrink-0 bg-muted/30",
+  class: "px-4 py-2.5 border-t border-border/80 flex items-center gap-4 shrink-0 bg-muted/30",
   "aria-hidden": "true"
 }, pe = { class: "flex items-center gap-1 text-[11px] text-muted-foreground/60" }, xe = { class: "flex items-center gap-1 text-[11px] text-muted-foreground/60" }, fe = { class: "flex items-center gap-1 text-[11px] text-muted-foreground/60" }, be = { class: "ml-auto text-[11px] text-muted-foreground/50" }, Ce = /* @__PURE__ */ j({
   __name: "CommandPaletteContent",
@@ -159,15 +159,15 @@ const te = { class: "command-palette-content flex flex-col w-full h-full max-h-[
       ], 8, ne),
       o("div", me, [
         o("span", pe, [
-          s[5] || (s[5] = o("kbd", { class: "px-1 rounded border border-border/60 bg-background text-[10px]" }, "↑↓", -1)),
+          s[5] || (s[5] = o("kbd", { class: "px-1 rounded border border-border/80 bg-background text-[10px]" }, "↑↓", -1)),
           f(" " + l(O.value), 1)
         ]),
         o("span", xe, [
-          s[6] || (s[6] = o("kbd", { class: "px-1 rounded border border-border/60 bg-background text-[10px]" }, "↵", -1)),
+          s[6] || (s[6] = o("kbd", { class: "px-1 rounded border border-border/80 bg-background text-[10px]" }, "↵", -1)),
           f(" " + l(T.value), 1)
         ]),
         o("span", fe, [
-          s[7] || (s[7] = o("kbd", { class: "px-1 rounded border border-border/60 bg-background text-[10px]" }, "Esc", -1)),
+          s[7] || (s[7] = o("kbd", { class: "px-1 rounded border border-border/80 bg-background text-[10px]" }, "Esc", -1)),
           f(" " + l(F.value), 1)
         ]),
         o("span", be, l(p.value) + " " + l(p.value === 1 ? P.value : w.value), 1)

package/components/CommandPalette/{CommandPaletteItem.vue2.js → CommandPaletteItem.vue.js}

@@ -1,5 +1,5 @@
 import t from "./CommandPaletteItem.vue3.js";
-/* empty css                       */
+/* empty css                        */
 import o from "../../_virtual/_plugin-vue_export-helper.js";
 const r = /* @__PURE__ */ o(t, [["__scopeId", "data-v-66b1ae06"]]);
 export {

package/components/ConfirmationModal.vue.d.ts

@@ -22,11 +22,11 @@ declare function __VLS_template(): {
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
-    cancel: () => any;
     confirm: () => any;
+    cancel: () => any;
 }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
-    onCancel?: () => any;
     onConfirm?: () => any;
+    onCancel?: () => any;
 }>, {
     variant: "danger" | "primary" | "warning" | "success" | "info";
     loading: boolean;

package/components/CustomFieldsDisplay/CustomFieldsDisplay.vue.d.ts

@@ -0,0 +1,48 @@
+import { CustomFieldItem, CustomFieldsDisplayVariant } from './types';
+interface Props {
+    title?: string;
+    titleI18n?: string;
+    icon?: string;
+    fields?: CustomFieldItem[];
+    variant?: CustomFieldsDisplayVariant;
+    columns?: 1 | 2 | 3 | 4;
+    emptyText?: string;
+    keyProp?: string;
+    valueProp?: string;
+    class?: string;
+    listValueThreshold?: number;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        title?(_: {}): any;
+        key?(_: {
+            field: CustomFieldItem;
+            index: number;
+        }): any;
+        value?(_: {
+            field: CustomFieldItem;
+            index: number;
+        }): any;
+        empty?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    variant: CustomFieldsDisplayVariant;
+    fields: CustomFieldItem[];
+    columns: 1 | 2 | 3 | 4;
+    emptyText: string;
+    keyProp: string;
+    valueProp: string;
+    listValueThreshold: number;
+}, {}, {}, {}, 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/CustomFieldsDisplay/CustomFieldsDisplay.vue.js

@@ -0,0 +1,97 @@
+import { defineComponent as T, computed as o, openBlock as n, createElementBlock as s, normalizeClass as l, renderSlot as a, createBlock as P, createCommentVNode as g, createElementVNode as d, toDisplayString as u, Fragment as w, renderList as N, createTextVNode as c } from "vue";
+import j from "../Icon.vue.js";
+import { $t as I } from "../../utils/i18n.js";
+const L = { class: "text-sm font-semibold text-gray-900 tracking-tight" }, D = /* @__PURE__ */ T({
+  __name: "CustomFieldsDisplay",
+  props: {
+    title: {},
+    titleI18n: {},
+    icon: {},
+    fields: { default: () => [] },
+    variant: { default: "grid" },
+    columns: { default: 2 },
+    emptyText: { default: "--" },
+    keyProp: { default: "key" },
+    valueProp: { default: "value" },
+    class: {},
+    listValueThreshold: { default: 50 }
+  },
+  setup(r) {
+    const t = r, x = o(() => t.titleI18n ? I(t.titleI18n) : t.title ?? ""), v = (e) => e == null || e === "" ? t.emptyText : typeof e == "boolean" ? e ? "Yes" : "No" : Array.isArray(e) ? e.join(", ") : typeof e == "object" ? JSON.stringify(e) : String(e), b = (e) => v(e).length > t.listValueThreshold, k = o(() => t.variant === "list" ? "flex flex-col border border-border rounded-md bg-body overflow-hidden" : "flex flex-col w-full"), h = o(() => {
+      const e = {
+        1: "grid-cols-1",
+        2: "grid-cols-1 sm:grid-cols-2",
+        3: "grid-cols-1 sm:grid-cols-2 md:grid-cols-3",
+        4: "grid-cols-1 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-4"
+      };
+      return t.variant === "grid" ? `grid gap-4 px-2 ${e[t.columns] || e[2]}` : t.variant === "card" ? `grid gap-3.5 ${e[t.columns] || e[2]}` : t.variant === "list" ? "flex flex-col divide-y divide-border" : t.variant === "inline" ? "flex flex-wrap gap-3" : "";
+    }), C = (e) => t.variant !== "list" ? p.value : [
+      "flex py-3 pl-3 pr-3.5 transition-colors hover:bg-muted/30 min-w-0",
+      b(e[t.valueProp]) ? "flex-col items-start gap-1" : "flex-col sm:flex-row sm:justify-between sm:items-start gap-1 sm:gap-0"
+    ], $ = (e) => t.variant !== "list" ? y.value : [
+      "text-sm font-normal text-foreground break-words",
+      b(e[t.valueProp]) ? "w-full" : "w-full sm:w-auto sm:text-right sm:max-w-[60%]"
+    ], p = o(() => t.variant === "grid" ? "flex flex-col space-y-1 min-w-0" : t.variant === "list" ? "flex justify-between items-start py-3 pl-3 pr-3.5 transition-colors hover:bg-muted/30 min-w-0" : t.variant === "card" ? "flex flex-col space-y-1.5 p-3 rounded-lg border border-border bg-card  min-w-0" : t.variant === "inline" ? "flex items-center space-x-2 bg-muted/40 border border-border px-3 py-1.5 rounded-full min-w-0" : ""), V = o(() => t.variant === "inline" ? "text-xs font-medium text-foreground truncate max-w-[120px]" : t.variant === "list" ? "text-sm! font-medium! text-foreground! leading-snug truncate mr-4 shrink-0" : "text-xs font-semibold text-foreground uppercase tracking-wider truncate"), y = o(() => t.variant === "inline" ? "text-sm font-semibold text-foreground truncate max-w-[200px]" : t.variant === "list" ? "text-sm font-normal text-foreground text-right break-words max-w-[60%]" : "text-sm text-foreground break-words");
+    return (e, f) => (n(), s("div", {
+      class: l(["custom-fields-display", k.value, t.class])
+    }, [
+      x.value || r.icon || e.$slots.title ? (n(), s("div", {
+        key: 0,
+        class: l([
+          r.variant == "list" ? "px-3 py-2.5 border-b border-border/70 flex items-center gap-2 bg-muted/60" : "bg-muted  p-2  rounded flex items-center gap-2 mb-4.5"
+        ])
+      }, [
+        a(e.$slots, "title", {}, () => [
+          r.icon ? (n(), P(j, {
+            key: 0,
+            icon: r.icon,
+            class: "w-4 h-4 text-muted-foreground shrink-0"
+          }, null, 8, ["icon"])) : g("", !0),
+          d("h3", L, u(x.value), 1)
+        ])
+      ], 2)) : g("", !0),
+      d("div", {
+        class: l(h.value)
+      }, [
+        r.fields && r.fields.length > 0 ? (n(!0), s(w, { key: 0 }, N(r.fields, (i, m) => (n(), s("div", {
+          key: m,
+          class: l(r.variant === "list" ? C(i) : p.value)
+        }, [
+          d("div", {
+            class: l(["cf-label shrink-0", V.value])
+          }, [
+            a(e.$slots, "key", {
+              field: i,
+              index: m
+            }, () => [
+              c(u(i[r.keyProp]) + " ", 1),
+              t.variant === "inline" ? (n(), s(w, { key: 0 }, [
+                c(":")
+              ], 64)) : g("", !0)
+            ])
+          ], 2),
+          d("div", {
+            class: l(["cf-value", r.variant === "list" ? $(i) : y.value])
+          }, [
+            a(e.$slots, "value", {
+              field: i,
+              index: m
+            }, () => [
+              c(u(v(i[r.valueProp])), 1)
+            ])
+          ], 2)
+        ], 2))), 128)) : (n(), s("div", {
+          key: 1,
+          class: l(["text-sm text-muted-foreground py-6 text-center w-full bg-muted/5 rounded-lg border border-dashed border-border", r.variant === "list" ? "border-none rounded-none" : ""])
+        }, [
+          a(e.$slots, "empty", {}, () => [
+            c(u(r.emptyText), 1)
+          ])
+        ], 2))
+      ], 2)
+    ], 2));
+  }
+});
+export {
+  D as default
+};

package/components/CustomFieldsDisplay/CustomFieldsDisplay.vue2.js

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

package/components/CustomFieldsDisplay/index.d.ts

@@ -0,0 +1,2 @@
+export { default as CustomFieldsDisplay } from './CustomFieldsDisplay.vue';
+export * from './types';

package/components/CustomFieldsDisplay/types.d.ts

@@ -0,0 +1,18 @@
+export type CustomFieldsDisplayVariant = 'grid' | 'list' | 'card' | 'inline';
+export interface CustomFieldItem {
+    key?: string;
+    value?: any;
+    [key: string]: any;
+}
+export interface CustomFieldsDisplayProps {
+    title?: string;
+    titleI18n?: string;
+    icon?: string;
+    fields?: CustomFieldItem[];
+    variant?: CustomFieldsDisplayVariant;
+    columns?: 1 | 2 | 3 | 4;
+    emptyText?: string;
+    keyProp?: string;
+    valueProp?: string;
+    class?: string;
+}

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

@@ -18,24 +18,24 @@ 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;
 }>, {
     search: string;
     variant: "default" | "raised";
+    loading: boolean;
     striped: boolean;
     compact: boolean;
-    loading: boolean;
     rows: any[];
     showSearch: boolean;
     headers: TableHeader[];

package/components/DateTime/DateTime.vue.d.ts

@@ -3,6 +3,8 @@ type __VLS_Props = {
     value?: string | number | Date;
     /** Custom format string overriding the global configuration */
     format?: string;
+    /** Semantic formatting type ('date', 'dateTime', 'time') */
+    type?: 'date' | 'dateTime' | 'time';
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLSpanElement>;
 export default _default;

package/components/DateTime/DateTime.vue.js

@@ -1,31 +1,17 @@
-import { defineComponent as D, computed as n, openBlock as _, createElementBlock as g, toDisplayString as h } from "vue";
-import s from "dayjs";
-import { useVLiteConfig as y } from "../../core/config.js";
-const V = /* @__PURE__ */ D({
+import { defineComponent as r, computed as a, openBlock as n, createElementBlock as p, toDisplayString as m } from "vue";
+import { formatDate as c } from "../../utils/functions.js";
+const i = /* @__PURE__ */ r({
   __name: "DateTime",
   props: {
     value: {},
-    format: {}
+    format: {},
+    type: {}
   },
-  setup(m) {
-    const t = m, i = y(), c = n(() => t.format || i?.components?.datetime?.format || "MM/DD/YYYY"), f = n(() => {
-      if (!t.value) return "--";
-      if (typeof t.value == "string") {
-        const e = t.value.trim();
-        if (/^([01]?\d|2[0-3]):([0-5]\d)(:([0-5]\d))?$/.test(e)) {
-          const r = e.split(":"), u = r[0].padStart(2, "0"), l = r[1], p = r[2] || "00", d = `1970-01-01T${u}:${l}:${p}`, a = s(d);
-          if (a.isValid()) {
-            const v = t.format || "h:mm A";
-            return a.format(v);
-          }
-        }
-      }
-      const o = s(t.value);
-      return o.isValid() ? o.format(c.value) : String(t.value);
-    });
-    return (o, e) => (_(), g("span", null, h(f.value), 1));
+  setup(e) {
+    const t = e, o = a(() => c(t.value, t.format, t.type));
+    return (l, s) => (n(), p("span", null, m(o.value), 1));
   }
 });
 export {
-  V as default
+  i as default
 };

package/components/Dropdown/Dropdown.vue.d.ts

@@ -83,11 +83,12 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     onOnOpen?: () => any;
     "onUpdate:isOpen"?: (value: boolean) => any;
 }>, {
-    disabled: boolean;
+    columns: number | string;
     loading: boolean;
+    disabled: boolean;
+    direction: "ltr" | "rtl";
     selectable: boolean;
     options: (IDropdownOption | string | number)[];
-    columns: number | string;
     selectedIndex: number | null;
     maxHeight: string;
     layout: "default" | "grouped";
@@ -95,7 +96,6 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     searchable: boolean;
     remote: boolean;
     debounceTime: number;
-    direction: "ltr" | "rtl";
     canCloseOutside: boolean;
     closeOnSelect: boolean;
     toggleSelection: boolean;