vlite3 0.5.5 → 0.5.7

package/components/Button.vue.js

@@ -105,7 +105,7 @@ const D = ["type", "disabled"], q = /* @__PURE__ */ B({
     });
     return (n, r) => G((s(), h("button", {
       type: e.type,
-      class: i(y.value),
+      class: i([y.value, "cursor-pointer"]),
       disabled: e.disabled || e.loading
     }, [
       e.loading ? (s(), d(g, {

package/components/ColorPicker/ColorIro.vue3.js

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

package/components/ColorPicker/ColorPicker.vue.js

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

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

@@ -34,6 +34,7 @@ type __VLS_Props = {
     fetchSelected?: (ids: any[]) => Promise<IDropdownOption[]>;
     triggerProps?: ButtonProps;
     direction?: 'ltr' | 'rtl';
+    isNested?: boolean;
 };
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -61,28 +62,38 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     onSelect: (payload: {
         value: any;
         data?: any;
+        option?: IDropdownOption;
     }) => any;
     "update:modelValue": (value: any) => any;
-    onOpen: () => any;
+    "load-more": () => any;
     onClose: () => any;
+    onOpen: () => any;
     "update:isOpen": (value: boolean) => any;
-    "load-more": () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
     onSearch?: (query: string) => any;
     onOnSelect?: (payload: {
         value: any;
         data?: any;
+        option?: IDropdownOption;
     }) => any;
     "onUpdate:modelValue"?: (value: any) => any;
-    onOnOpen?: () => any;
+    "onLoad-more"?: () => any;
     onOnClose?: () => any;
+    onOnOpen?: () => any;
     "onUpdate:isOpen"?: (value: boolean) => any;
-    "onLoad-more"?: () => any;
 }>, {
     loading: boolean;
     selectable: boolean;
     options: (IDropdownOption | string | number)[];
     columns: number | string;
+    selectedIndex: number | null;
+    maxHeight: string;
+    layout: "default" | "grouped";
+    hasMore: boolean;
+    searchable: boolean;
+    remote: boolean;
+    debounceTime: number;
+    direction: "ltr" | "rtl";
     canCloseOutside: boolean;
     closeOnSelect: boolean;
     toggleSelection: boolean;
@@ -90,16 +101,9 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     offset: [number, number];
     isOpen: boolean;
     teleport: boolean;
-    selectedIndex: number | null;
-    maxHeight: string;
     showSelectedLabel: boolean;
     doubleConfirmation: boolean;
-    layout: "default" | "grouped";
-    hasMore: boolean;
-    searchable: boolean;
-    remote: boolean;
-    debounceTime: number;
-    direction: "ltr" | "rtl";
+    isNested: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/components/Dropdown/Dropdown.vue.js

@@ -1,10 +1,10 @@
-import { defineComponent as G, ref as r, computed as v, watch as w, reactive as J, toRefs as K, openBlock as N, createElementBlock as Q, normalizeStyle as W, createVNode as $, unref as g, withCtx as c, renderSlot as u, createBlock as X, normalizeClass as Y, createSlots as Z, normalizeProps as x, guardReactiveProps as H, createCommentVNode as _ } from "vue";
+import { defineComponent as G, ref as r, computed as h, watch as $, reactive as J, toRefs as K, openBlock as x, createElementBlock as Q, normalizeStyle as W, createVNode as k, unref as b, withCtx as u, renderSlot as f, createBlock as X, normalizeClass as Y, createSlots as Z, normalizeProps as H, guardReactiveProps as M, createCommentVNode as _ } from "vue";
 import ee from "v-tooltip-lite";
 import "v-tooltip-lite/style.css";
 import te from "./DropdownMenu.vue.js";
 import ne from "./DropdownTrigger.vue.js";
-import oe from "../ConfirmationModal.vue.js";
-import { useDropdownIds as le } from "./composables/useDropdownIds.js";
+import le from "../ConfirmationModal.vue.js";
+import { useDropdownIds as oe } from "./composables/useDropdownIds.js";
 import { useDropdownSelection as ae } from "./composables/useDropdownSelection.js";
 const ve = /* @__PURE__ */ G({
   __name: "Dropdown",
@@ -41,84 +41,85 @@ const ve = /* @__PURE__ */ G({
     debounceTime: { default: 300 },
     fetchSelected: {},
     triggerProps: {},
-    direction: { default: "ltr" }
+    direction: { default: "ltr" },
+    isNested: { type: Boolean, default: !1 }
   },
   emits: ["onSelect", "update:modelValue", "onOpen", "onClose", "update:isOpen", "load-more", "search"],
-  setup(o, { emit: M }) {
-    const l = o, y = M, h = r(!1), d = r(null), s = r({
+  setup(l, { emit: V }) {
+    const o = l, p = V, g = r(!1), d = r(null), s = r({
       title: "Confirm Selection",
       description: "Are you sure you want to select this option?",
       confirmText: "Confirm",
       cancelText: "Cancel",
       variant: "primary"
-    }), A = v(() => l.position ? l.position : l.direction === "rtl" ? "bottom-end" : "bottom-start"), L = v(() => l.nestedPosition ? l.nestedPosition : l.direction === "rtl" ? "left-start" : "right-start"), b = r(l.isOpen || !1);
-    w(
-      () => l.isOpen,
+    }), A = h(() => o.position ? o.position : o.direction === "rtl" ? "bottom-end" : "bottom-start"), E = h(() => o.nestedPosition ? o.nestedPosition : o.direction === "rtl" ? "left-start" : "right-start"), O = r(o.isOpen || !1);
+    $(
+      () => o.isOpen,
       (e) => {
-        e !== void 0 && (b.value = e);
+        e !== void 0 && (O.value = e);
       }
     );
-    const k = (e) => {
-      b.value = e, y("update:isOpen", e), y(e ? "onOpen" : "onClose");
-    }, O = v(() => l.options ? l.options.map((e) => typeof e == "string" || typeof e == "number" ? { label: String(e), value: String(e) } : e) : []), f = r([]);
-    w(
-      O,
+    const B = (e) => {
+      O.value = e, p("update:isOpen", e), p(e ? "onOpen" : "onClose");
+    }, C = h(() => o.options ? o.options.map((e) => typeof e == "string" || typeof e == "number" ? { label: String(e), value: String(e) } : e) : []), m = r([]);
+    $(
+      C,
       (e) => {
         if (e)
-          if (l.remote) {
-            const t = [...f.value];
-            e.forEach((n) => {
-              t.some((a) => a.value !== void 0 && n.value !== void 0 ? typeof a.value == "object" && a.key && n.key ? a.key === n.key && a.value[a.key] === n.value[n.key] : a.value === n.value : a.label === n.label) || t.push(n);
-            }), f.value = t;
+          if (o.remote) {
+            const n = [...m.value];
+            e.forEach((t) => {
+              n.some((a) => a.value !== void 0 && t.value !== void 0 ? typeof a.value == "object" && a.key && t.key ? a.key === t.key && a.value[a.key] === t.value[t.key] : a.value === t.value : a.label === t.label) || n.push(t);
+            }), m.value = n;
           } else
-            f.value = e;
+            m.value = e;
       },
       { immediate: !0, deep: !0 }
     );
-    const m = r(/* @__PURE__ */ new Map()), C = r(!1), V = async (e) => {
-      if (!l.fetchSelected || e === void 0 || e === null) return;
-      let t = [];
-      Array.isArray(e) ? t = e : typeof e == "object" ? t = Object.values(e) : t = [e];
-      const n = t.filter((i) => {
-        const a = m.value.has(i), q = f.value.some((I) => (I.value ?? I.label) === i);
-        return !a && !q;
+    const v = r(/* @__PURE__ */ new Map()), S = r(!1), L = async (e) => {
+      if (!o.fetchSelected || e === void 0 || e === null) return;
+      let n = [];
+      Array.isArray(e) ? n = e : typeof e == "object" ? n = Object.values(e) : n = [e];
+      const t = n.filter((i) => {
+        const a = v.value.has(i), N = m.value.some((c) => (c.value ?? c.label) === i);
+        return !a && !N;
       });
-      if (n.length) {
-        C.value = !0;
+      if (t.length) {
+        S.value = !0;
         try {
-          (await l.fetchSelected(n)).forEach((a) => {
-            m.value.set(a.value ?? a.label, a);
+          (await o.fetchSelected(t)).forEach((a) => {
+            v.value.set(a.value ?? a.label, a);
           });
         } catch (i) {
           console.error("[Dropdown] Hydration failed:", i);
         } finally {
-          C.value = !1;
+          S.value = !1;
         }
       }
-    }, p = v(() => {
-      const e = [...f.value], t = new Set(e.map((n) => n.value ?? n.label));
-      return m.value.forEach((n, i) => {
-        t.has(i) || (e.unshift(n), t.add(i));
+    }, y = h(() => {
+      const e = [...m.value], n = new Set(e.map((t) => t.value ?? t.label));
+      return v.value.forEach((t, i) => {
+        n.has(i) || (e.unshift(t), n.add(i));
       }), e;
-    }), { getAllRecursiveIds: j } = le(), z = J({
-      ...K(l),
-      options: p
-    }), { currentValue: B, selectedLabel: T, selectOption: D } = ae(
+    }), { getAllRecursiveIds: j } = oe(), z = J({
+      ...K(o),
+      options: y
+    }), { currentValue: T, selectedLabel: P, selectOption: D } = ae(
       z,
-      y
+      p
     );
-    w(
-      () => B.value,
+    $(
+      () => T.value,
       (e) => {
-        V(e);
+        L(e);
       },
       { immediate: !0, deep: !0 }
     );
-    const E = v(() => {
-      const e = l.ignoreClickOutside || [], t = j(p.value);
-      return [.../* @__PURE__ */ new Set([...e, ...t])];
-    }), R = (e) => {
-      l.doubleConfirmation || !!e.confirmation ? (d.value = e, typeof e.confirmation == "object" ? s.value = {
+    const R = h(() => {
+      const e = o.ignoreClickOutside || [], n = j(y.value);
+      return [.../* @__PURE__ */ new Set([...e, ...n])];
+    }), F = (e) => {
+      o.doubleConfirmation || !!e.confirmation ? (d.value = e, typeof e.confirmation == "object" ? s.value = {
         title: e.confirmation.title || "Confirm Selection",
         description: e.confirmation.description || "Are you sure you want to select this option?",
         confirmText: e.confirmation.confirmText || "Confirm",
@@ -130,101 +131,113 @@ const ve = /* @__PURE__ */ G({
         confirmText: "Confirm",
         cancelText: "Cancel",
         variant: "primary"
-      }, h.value = !0, S()) : (P(e), l.closeOnSelect && S());
-    }, P = (e) => {
-      const t = e.value ?? e.label;
-      m.value.has(t) || m.value.set(t, e), D(e);
-    }, F = () => {
-      d.value && (P(d.value), d.value = null, h.value = !1);
+      }, g.value = !0, w()) : (I(e), o.closeOnSelect && w());
+    }, I = (e) => {
+      const n = e.value ?? e.label;
+      v.value.has(n) || v.value.set(n, e);
+      const t = D(e);
+      if (!o.isNested) {
+        const i = e._originalOption || e, a = i.value ?? i.label;
+        (e._path || [i]).forEach((c) => {
+          typeof c.onSelect == "function" && c.onSelect({
+            value: a,
+            option: c,
+            data: y.value || [],
+            values: t
+          });
+        });
+      }
     }, U = () => {
-      d.value = null, h.value = !1;
-    }, S = () => {
-      k(!1);
+      d.value && (I(d.value), d.value = null, g.value = !1);
+    }, q = () => {
+      d.value = null, g.value = !1;
+    }, w = () => {
+      B(!1);
     };
-    return (e, t) => (N(), Q("div", {
+    return (e, n) => (x(), Q("div", {
       class: "relative inline-block text-left",
-      style: W({ direction: o.direction })
+      style: W({ direction: l.direction })
     }, [
-      $(g(ee), {
+      k(b(ee), {
         content: "",
         trigger: "click",
         arrow: !1,
-        teleport: o.teleport,
-        offset: o.offset,
+        teleport: l.teleport,
+        offset: l.offset,
         placement: A.value,
-        isOpen: b.value,
-        menuId: o.menuId,
-        ignoreClickOutside: E.value,
+        isOpen: O.value,
+        menuId: l.menuId,
+        ignoreClickOutside: R.value,
         class: "w-full",
-        className: "dropdown " + (o.className || ""),
-        onOnShow: t[2] || (t[2] = (n) => e.$emit("onOpen")),
-        onOnHide: t[3] || (t[3] = (n) => e.$emit("onClose")),
-        "onUpdate:isOpen": k,
+        className: "dropdown " + (l.className || ""),
+        onOnShow: n[2] || (n[2] = (t) => e.$emit("onOpen")),
+        onOnHide: n[3] || (n[3] = (t) => e.$emit("onClose")),
+        "onUpdate:isOpen": B,
         triggerClass: "w-full",
         styles: { padding: "0" }
       }, {
-        trigger: c(({ isOpen: n }) => [
-          u(e.$slots, "trigger", x(H({ selectedLabel: g(T), isOpen: n })), () => [
-            $(ne, {
-              "selected-label": g(T),
-              "is-open": n,
-              direction: o.direction,
-              triggerProps: o.triggerProps,
+        trigger: u(({ isOpen: t }) => [
+          f(e.$slots, "trigger", H(M({ selectedLabel: b(P), isOpen: t })), () => [
+            k(ne, {
+              "selected-label": b(P),
+              "is-open": t,
+              direction: l.direction,
+              triggerProps: l.triggerProps,
               class: "w-full"
             }, null, 8, ["selected-label", "is-open", "direction", "triggerProps"])
           ])
         ]),
-        default: c(() => [
-          u(e.$slots, "default"),
-          O.value.length || p.value.length || e.$slots.menu || e.$slots.item || o.remote || o.searchable ? (N(), X(te, {
+        default: u(() => [
+          f(e.$slots, "default"),
+          C.value.length || y.value.length || e.$slots.menu || e.$slots.item || l.remote || l.searchable ? (x(), X(te, {
             key: 0,
-            options: O.value,
-            cachedOptions: p.value,
-            class: Y(o.className),
-            selected: g(B),
-            selectedIndex: o.selectedIndex,
-            maxHeight: o.maxHeight,
-            nestedPosition: L.value,
-            nestedOffset: o.nestedOffset,
-            selectable: o.selectable,
-            direction: o.direction,
-            layout: o.layout,
-            columns: o.columns,
-            loading: o.loading || C.value,
-            hasMore: o.hasMore,
-            searchable: o.searchable,
-            remote: o.remote,
-            debounceTime: o.debounceTime,
-            onSelect: R,
-            onClose: S,
-            onLoadMore: t[0] || (t[0] = (n) => e.$emit("load-more")),
-            onSearch: t[1] || (t[1] = (n) => e.$emit("search", n))
+            options: C.value,
+            cachedOptions: y.value,
+            class: Y(l.className),
+            selected: b(T),
+            selectedIndex: l.selectedIndex,
+            maxHeight: l.maxHeight,
+            nestedPosition: E.value,
+            nestedOffset: l.nestedOffset,
+            selectable: l.selectable,
+            direction: l.direction,
+            layout: l.layout,
+            columns: l.columns,
+            loading: l.loading || S.value,
+            hasMore: l.hasMore,
+            searchable: l.searchable,
+            remote: l.remote,
+            debounceTime: l.debounceTime,
+            onSelect: F,
+            onClose: w,
+            onLoadMore: n[0] || (n[0] = (t) => e.$emit("load-more")),
+            onSearch: n[1] || (n[1] = (t) => e.$emit("search", t))
           }, Z({ _: 2 }, [
             e.$slots.menu ? {
               name: "menu",
-              fn: c(() => [
-                u(e.$slots, "menu")
+              fn: u(() => [
+                f(e.$slots, "menu")
               ]),
               key: "0"
             } : void 0,
             e.$slots.item ? {
               name: "item",
-              fn: c((n) => [
-                u(e.$slots, "item", x(H(n)))
+              fn: u((t) => [
+                f(e.$slots, "item", H(M(t)))
               ]),
               key: "1"
             } : void 0,
             e.$slots.header ? {
               name: "header",
-              fn: c(() => [
-                u(e.$slots, "header")
+              fn: u(() => [
+                f(e.$slots, "header")
               ]),
               key: "2"
             } : void 0,
             e.$slots.footer ? {
               name: "footer",
-              fn: c(() => [
-                u(e.$slots, "footer")
+              fn: u(() => [
+                f(e.$slots, "footer")
               ]),
               key: "3"
             } : void 0
@@ -232,15 +245,15 @@ const ve = /* @__PURE__ */ G({
         ]),
         _: 3
       }, 8, ["teleport", "offset", "placement", "isOpen", "menuId", "ignoreClickOutside", "className"]),
-      $(oe, {
-        show: h.value,
+      k(le, {
+        show: g.value,
         title: s.value.title,
         description: s.value.description,
         "confirm-text": s.value.confirmText,
         "cancel-text": s.value.cancelText,
         variant: s.value.variant,
-        onConfirm: F,
-        onCancel: U
+        onConfirm: U,
+        onCancel: q
       }, null, 8, ["show", "title", "description", "confirm-text", "cancel-text", "variant"])
     ], 4));
   }

package/components/Dropdown/DropdownItem.vue.js

@@ -31,7 +31,8 @@ const j = ["data-disabled"], C = { class: "flex flex-col flex-1 min-w-0" }, D =
       class: h(["relative w-full flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-1 focus-visible:ring-primary focus-visible:ring-offset-1 data-disabled:pointer-events-none data-disabled:opacity-50", [
         e.selectable && e.selected && !e.option.children ? "bg-accent" : "",
         e.focused ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground",
-        e.option.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
+        e.option.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
+        e.option.class || ""
       ]]),
       "data-disabled": e.option.disabled ? !0 : void 0,
       onClick: o[0] || (o[0] = (p) => r("click", e.option)),

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

@@ -52,17 +52,17 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {},
     selectable: boolean;
     options: (IDropdownOption | string | number)[];
     columns: number | string;
+    cachedOptions: IDropdownOptions;
     selectedIndex: number | null;
     maxHeight: string;
+    nestedPosition: any;
+    nestedOffset: [number, number];
     layout: "default" | "grouped";
     hasMore: boolean;
     searchable: boolean;
     remote: boolean;
     debounceTime: number;
     direction: "ltr" | "rtl";
-    nestedPosition: any;
-    nestedOffset: [number, number];
-    cachedOptions: IDropdownOptions;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
     containerRef: HTMLDivElement;
 }, HTMLDivElement>;