vlite3 0.4.8 → 0.5.2

package/components/DateRangePicker.vue.js

@@ -0,0 +1,231 @@
+import { defineComponent as V, ref as w, watch as L, computed as u, openBlock as d, createBlock as m, unref as h, withCtx as y, createElementVNode as i, createElementBlock as x, Fragment as z, renderList as B, createCommentVNode as E, createVNode as g, normalizeClass as k, toDisplayString as R } from "vue";
+import T from "./Dropdown/Dropdown.vue.js";
+import f from "./Icon.vue.js";
+import { $t as l } from "../utils/i18n.js";
+import P from "./Button.vue.js";
+import p from "v-datepicker-lite";
+import "v-datepicker-lite/style.css";
+const $ = { class: "flex items-center gap-2" }, H = { class: "flex flex-col sm:flex-row bg-background rounded-md" }, Q = {
+  key: 0,
+  class: "flex flex-col gap-1 sm:pr-3 py-2 sm:border-r border-border max-h-[280px]"
+}, j = { class: "flex flex-col sm:flex-row items-center gap-4 py-2 p-3" }, O = { class: "border border-border rounded-md overflow-hidden bg-background" }, I = { class: "flex items-center justify-center shrink-0" }, U = { class: "border border-border rounded-md overflow-hidden bg-background" }, Z = /* @__PURE__ */ V({
+  __name: "DateRangePicker",
+  props: {
+    modelValue: {},
+    placeholderStart: { default: "Start Date" },
+    placeholderEnd: { default: "End Date" },
+    minDate: {},
+    maxDate: {},
+    disabled: { type: Boolean },
+    readonly: { type: Boolean },
+    size: {},
+    variant: {},
+    showQuickRanges: { type: Boolean, default: !0 }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(r, { emit: M }) {
+    const v = r, D = M, o = w(!1), c = w(0);
+    L(o, (t) => {
+      t && c.value++;
+    });
+    const n = u({
+      get: () => v.modelValue || { start: null, end: null },
+      set: (t) => {
+        D("update:modelValue", t), D("change", t);
+      }
+    }), Y = (t) => {
+      n.value = { ...n.value, start: t };
+    }, _ = (t) => {
+      n.value = { ...n.value, end: t };
+    }, S = u(() => {
+      if (n.value.end) {
+        const t = new Date(n.value.end);
+        if (!isNaN(t.getTime())) return t.toISOString();
+      }
+      return v.maxDate;
+    }), N = u(() => {
+      if (n.value.start) {
+        const t = new Date(n.value.start);
+        if (!isNaN(t.getTime())) return t.toISOString();
+      }
+      return v.minDate;
+    }), b = (t) => {
+      if (!t) return "";
+      try {
+        const e = new Date(t);
+        return isNaN(e.getTime()) ? "" : e.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
+      } catch {
+        return "";
+      }
+    }, C = u(() => [
+      {
+        label: l("vlite.dateRangePicker.today") !== "vlite.dateRangePicker.today" ? l("vlite.dateRangePicker.today") : "Today",
+        value: "today",
+        icon: "lucide:calendar"
+      },
+      {
+        label: l("vlite.dateRangePicker.yesterday") !== "vlite.dateRangePicker.yesterday" ? l("vlite.dateRangePicker.yesterday") : "Yesterday",
+        value: "yesterday",
+        icon: "lucide:calendar-minus"
+      },
+      {
+        label: l("vlite.dateRangePicker.last7Days") !== "vlite.dateRangePicker.last7Days" ? l("vlite.dateRangePicker.last7Days") : "Last 7 Days",
+        value: "last_7_days",
+        icon: "lucide:calendar-days"
+      },
+      {
+        label: l("vlite.dateRangePicker.last30Days") !== "vlite.dateRangePicker.last30Days" ? l("vlite.dateRangePicker.last30Days") : "Last 30 Days",
+        value: "last_30_days",
+        icon: "lucide:calendar-days"
+      },
+      {
+        label: l("vlite.dateRangePicker.thisMonth") !== "vlite.dateRangePicker.thisMonth" ? l("vlite.dateRangePicker.thisMonth") : "This Month",
+        value: "this_month",
+        icon: "lucide:calendar-range"
+      },
+      {
+        label: l("vlite.dateRangePicker.lastMonth") !== "vlite.dateRangePicker.lastMonth" ? l("vlite.dateRangePicker.lastMonth") : "Last Month",
+        value: "last_month",
+        icon: "lucide:calendar-range"
+      },
+      {
+        label: l("vlite.dateRangePicker.last6Months") !== "vlite.dateRangePicker.last6Months" ? l("vlite.dateRangePicker.last6Months") : "Last 6 Months",
+        value: "last_6_months",
+        icon: "lucide:history"
+      },
+      {
+        label: l("vlite.dateRangePicker.thisYear") !== "vlite.dateRangePicker.thisYear" ? l("vlite.dateRangePicker.thisYear") : "This Year",
+        value: "this_year",
+        icon: "lucide:calendar-check"
+      },
+      {
+        label: l("vlite.dateRangePicker.lastYear") !== "vlite.dateRangePicker.lastYear" ? l("vlite.dateRangePicker.lastYear") : "Last Year",
+        value: "last_year",
+        icon: "lucide:history"
+      }
+    ]), F = (t) => {
+      const e = /* @__PURE__ */ new Date();
+      let a = /* @__PURE__ */ new Date(), s = /* @__PURE__ */ new Date();
+      switch (e.setHours(0, 0, 0, 0), a.setHours(0, 0, 0, 0), s.setHours(0, 0, 0, 0), t.value) {
+        case "today":
+          a = new Date(e), s = new Date(e);
+          break;
+        case "yesterday":
+          a = new Date(e), a.setDate(a.getDate() - 1), s = new Date(a);
+          break;
+        case "last_7_days":
+          a = new Date(e), a.setDate(a.getDate() - 6), s = new Date(e);
+          break;
+        case "last_30_days":
+          a = new Date(e), a.setDate(a.getDate() - 29), s = new Date(e);
+          break;
+        case "this_month":
+          a = new Date(e.getFullYear(), e.getMonth(), 1), s = new Date(e);
+          break;
+        case "last_month":
+          a = new Date(e.getFullYear(), e.getMonth() - 1, 1), s = new Date(e.getFullYear(), e.getMonth(), 0);
+          break;
+        case "last_6_months":
+          a = new Date(e.getFullYear(), e.getMonth() - 5, 1), s = new Date(e);
+          break;
+        case "this_year":
+          a = new Date(e.getFullYear(), 0, 1), s = new Date(e);
+          break;
+        case "last_year":
+          a = new Date(e.getFullYear() - 1, 0, 1), s = new Date(e.getFullYear() - 1, 11, 31);
+          break;
+      }
+      n.value = { start: a, end: s }, c.value++, o.value = !1;
+    };
+    return (t, e) => (d(), m(h(T), {
+      isOpen: o.value,
+      "onUpdate:isOpen": e[0] || (e[0] = (a) => o.value = a),
+      position: "bottom-start",
+      disabled: r.disabled || r.readonly,
+      class: "w-full sm:w-auto inline-block",
+      maxHeight: "none"
+    }, {
+      trigger: y(({ isOpen: a }) => [
+        g(P, {
+          icon: "lucide:calendar",
+          variant: r.variant || "outline",
+          size: r.size || "md",
+          disabled: r.disabled,
+          class: k(["w-full sm:min-w-[280px] justify-start text-left font-normal", { "ring-2 ring-ring ring-offset-2": a }])
+        }, {
+          default: y(() => [
+            i("div", $, [
+              i("span", {
+                class: k({ "text-muted-foreground": !n.value.start })
+              }, R(n.value.start ? b(n.value.start) : r.placeholderStart), 3),
+              g(f, {
+                icon: "lucide:arrow-right",
+                class: "w-4 h-4 text-muted-foreground opacity-50 shrink-0"
+              }),
+              i("span", {
+                class: k({ "text-muted-foreground": !n.value.end })
+              }, R(n.value.end ? b(n.value.end) : r.placeholderEnd), 3)
+            ])
+          ]),
+          _: 1
+        }, 8, ["variant", "size", "disabled", "class"])
+      ]),
+      menu: y(() => [
+        i("div", H, [
+          r.showQuickRanges ? (d(), x("div", Q, [
+            e[1] || (e[1] = i("div", { class: "text-xs pl-2 pb-2 font-semibold text-muted-foreground uppercase tracking-wider" }, " Quick Ranges ", -1)),
+            (d(!0), x(z, null, B(C.value, (a) => (d(), m(P, {
+              key: a.value,
+              text: a.label,
+              icon: a.icon,
+              variant: "ghost",
+              size: "sm",
+              class: "justify-start w-full font-normal",
+              onClick: (s) => F(a)
+            }, null, 8, ["text", "icon", "onClick"]))), 128))
+          ])) : E("", !0),
+          i("div", j, [
+            i("div", O, [
+              (d(), m(h(p), {
+                key: "start-" + c.value,
+                value: n.value.start,
+                onChange: Y,
+                mode: "date",
+                "max-date": S.value,
+                "min-date": r.minDate,
+                disabled: r.disabled,
+                readonly: r.readonly
+              }, null, 8, ["value", "max-date", "min-date", "disabled", "readonly"]))
+            ]),
+            i("div", I, [
+              g(f, {
+                icon: "lucide:arrow-right",
+                class: "w-5 h-5 text-muted-foreground hidden sm:block opacity-50"
+              }),
+              g(f, {
+                icon: "lucide:arrow-down",
+                class: "w-5 h-5 text-muted-foreground sm:hidden opacity-50"
+              })
+            ]),
+            i("div", U, [
+              (d(), m(h(p), {
+                key: "end-" + c.value,
+                value: n.value.end,
+                onChange: _,
+                mode: "date",
+                "min-date": N.value,
+                "max-date": r.maxDate,
+                disabled: r.disabled,
+                readonly: r.readonly
+              }, null, 8, ["value", "min-date", "max-date", "disabled", "readonly"]))
+            ])
+          ])
+        ])
+      ]),
+      _: 1
+    }, 8, ["isOpen", "disabled"]));
+  }
+});
+export {
+  Z as default
+};

package/components/DateRangePicker.vue2.js

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

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

@@ -1,4 +1,4 @@
-import { IDropdownOptions, IDropdownOption } from '../../types';
+import { IDropdownOption, ButtonProps } from '../../types';
 import { TooltTipPlacement } from 'v-tooltip-lite/types';
 type __VLS_Props = {
     selected?: any;
@@ -8,7 +8,7 @@ type __VLS_Props = {
     position?: TooltTipPlacement;
     closeOnSelect?: boolean;
     toggleSelection?: boolean;
-    options?: IDropdownOptions;
+    options?: (IDropdownOption | string | number)[];
     canCloseOutside?: boolean;
     caret?: boolean;
     offset?: [number, number];
@@ -30,6 +30,9 @@ type __VLS_Props = {
     hasMore?: boolean;
     searchable?: boolean;
     remote?: boolean;
+    debounceTime?: number;
+    fetchSelected?: (ids: any[]) => Promise<IDropdownOption[]>;
+    triggerProps?: ButtonProps;
     direction?: 'ltr' | 'rtl';
 };
 declare function __VLS_template(): {
@@ -60,8 +63,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
         data?: any;
     }) => any;
     "update:modelValue": (value: any) => any;
-    onClose: () => any;
     onOpen: () => any;
+    onClose: () => any;
     "update:isOpen": (value: boolean) => any;
     "load-more": () => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
@@ -71,21 +74,21 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
         data?: any;
     }) => any;
     "onUpdate:modelValue"?: (value: any) => any;
-    onOnClose?: () => any;
     onOnOpen?: () => any;
+    onOnClose?: () => any;
     "onUpdate:isOpen"?: (value: boolean) => any;
     "onLoad-more"?: () => any;
 }>, {
-    isOpen: boolean;
     loading: boolean;
-    direction: "ltr" | "rtl";
     selectable: boolean;
+    options: (IDropdownOption | string | number)[];
     columns: number | string;
     canCloseOutside: boolean;
     closeOnSelect: boolean;
     toggleSelection: boolean;
     emptyMessage: string;
     offset: [number, number];
+    isOpen: boolean;
     teleport: boolean;
     selectedIndex: number | null;
     maxHeight: string;
@@ -95,6 +98,8 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     hasMore: boolean;
     searchable: boolean;
     remote: boolean;
+    debounceTime: number;
+    direction: "ltr" | "rtl";
 }, {}, {}, {}, 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,12 +1,12 @@
-import { defineComponent as z, ref as d, computed as C, watch as $, reactive as D, toRefs as R, openBlock as k, createElementBlock as j, normalizeStyle as E, createVNode as h, unref as v, withCtx as r, renderSlot as c, createBlock as U, normalizeClass as q, createSlots as F, normalizeProps as S, guardReactiveProps as w, createCommentVNode as G } from "vue";
-import J from "v-tooltip-lite";
+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 ee from "v-tooltip-lite";
 import "v-tooltip-lite/style.css";
-import K from "./DropdownMenu.vue.js";
-import Q from "./DropdownTrigger.vue.js";
-import W from "../ConfirmationModal.vue.js";
-import { useDropdownIds as X } from "./composables/useDropdownIds.js";
-import { useDropdownSelection as Y } from "./composables/useDropdownSelection.js";
-const se = /* @__PURE__ */ z({
+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 { useDropdownSelection as ae } from "./composables/useDropdownSelection.js";
+const ve = /* @__PURE__ */ G({
   __name: "Dropdown",
   props: {
     selected: {},
@@ -16,7 +16,7 @@ const se = /* @__PURE__ */ z({
     position: {},
     closeOnSelect: { type: Boolean, default: !0 },
     toggleSelection: { type: Boolean, default: !0 },
-    options: {},
+    options: { default: () => [] },
     canCloseOutside: { type: Boolean, default: !0 },
     caret: { type: Boolean },
     offset: { default: () => [0, 8] },
@@ -38,175 +38,213 @@ const se = /* @__PURE__ */ z({
     hasMore: { type: Boolean, default: !1 },
     searchable: { type: Boolean, default: !0 },
     remote: { type: Boolean, default: !1 },
+    debounceTime: { default: 300 },
+    fetchSelected: {},
+    triggerProps: {},
     direction: { default: "ltr" }
   },
   emits: ["onSelect", "update:modelValue", "onOpen", "onClose", "update:isOpen", "load-more", "search"],
-  setup(t, { emit: B }) {
-    const l = t, f = B, m = d(!1), u = d(null), a = d({
+  setup(o, { emit: M }) {
+    const l = o, y = M, h = 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"
-    }), I = C(() => l.position ? l.position : l.direction === "rtl" ? "bottom-end" : "bottom-start"), T = C(() => l.nestedPosition ? l.nestedPosition : l.direction === "rtl" ? "left-start" : "right-start"), y = d(l.isOpen || !1);
-    $(
+    }), 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,
       (e) => {
-        e !== void 0 && (y.value = e);
+        e !== void 0 && (b.value = e);
       }
     );
-    const O = (e) => {
-      y.value = e, f("update:isOpen", e), f(e ? "onOpen" : "onClose");
-    }, s = d([]);
-    $(
-      () => l.options,
+    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,
       (e) => {
         if (e)
           if (l.remote) {
-            const n = [...s.value];
-            e.forEach((o) => {
-              n.some((i) => i.value !== void 0 && o.value !== void 0 ? typeof i.value == "object" && i.key && o.key ? i.key === o.key && i.value[i.key] === o.value[o.key] : i.value === o.value : i.label === o.label) || n.push(o);
-            }), s.value = n;
+            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;
           } else
-            s.value = e;
+            f.value = e;
       },
       { immediate: !0, deep: !0 }
     );
-    const { getAllRecursiveIds: P } = X(), N = D({
-      ...R(l),
-      options: s
-    }), { currentValue: x, selectedLabel: g, selectOption: M } = Y(
-      N,
-      // Cast to any to satisfy strict prop types if needed, or define interface
-      f
-    ), H = C(() => {
-      const e = l.ignoreClickOutside || [], n = P(s.value);
-      return [.../* @__PURE__ */ new Set([...e, ...n])];
-    }), L = (e) => {
-      l.doubleConfirmation || !!e.confirmation ? (u.value = e, typeof e.confirmation == "object" ? a.value = {
+    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;
+      });
+      if (n.length) {
+        C.value = !0;
+        try {
+          (await l.fetchSelected(n)).forEach((a) => {
+            m.value.set(a.value ?? a.label, a);
+          });
+        } catch (i) {
+          console.error("[Dropdown] Hydration failed:", i);
+        } finally {
+          C.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));
+      }), e;
+    }), { getAllRecursiveIds: j } = le(), z = J({
+      ...K(l),
+      options: p
+    }), { currentValue: B, selectedLabel: T, selectOption: D } = ae(
+      z,
+      y
+    );
+    w(
+      () => B.value,
+      (e) => {
+        V(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 = {
         title: e.confirmation.title || "Confirm Selection",
         description: e.confirmation.description || "Are you sure you want to select this option?",
         confirmText: e.confirmation.confirmText || "Confirm",
         cancelText: e.confirmation.cancelText || "Cancel",
         variant: e.confirmation.variant || "primary"
-      } : a.value = {
+      } : s.value = {
         title: "Confirm Selection",
         description: `Are you sure you want to select "${e.label}"?`,
         confirmText: "Confirm",
         cancelText: "Cancel",
         variant: "primary"
-      }, m.value = !0, p()) : (b(e), l.closeOnSelect && p());
-    }, b = (e) => {
-      M(e);
-    }, A = () => {
-      u.value && (b(u.value), u.value = null, m.value = !1);
-    }, V = () => {
-      u.value = null, m.value = !1;
-    }, p = () => {
-      O(!1);
+      }, 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);
+    }, U = () => {
+      d.value = null, h.value = !1;
+    }, S = () => {
+      k(!1);
     };
-    return (e, n) => (k(), j("div", {
+    return (e, t) => (N(), Q("div", {
       class: "relative inline-block text-left",
-      style: E({ direction: t.direction })
+      style: W({ direction: o.direction })
     }, [
-      h(v(J), {
+      $(g(ee), {
         content: "",
         trigger: "click",
         arrow: !1,
-        teleport: t.teleport,
-        offset: t.offset,
-        placement: I.value,
-        isOpen: y.value,
-        menuId: t.menuId,
-        ignoreClickOutside: H.value,
+        teleport: o.teleport,
+        offset: o.offset,
+        placement: A.value,
+        isOpen: b.value,
+        menuId: o.menuId,
+        ignoreClickOutside: E.value,
         class: "w-full",
-        className: "dropdown " + (t.className || ""),
-        onOnShow: n[2] || (n[2] = (o) => e.$emit("onOpen")),
-        onOnHide: n[3] || (n[3] = (o) => e.$emit("onClose")),
-        "onUpdate:isOpen": O,
+        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,
         triggerClass: "w-full",
         styles: { padding: "0" }
       }, {
-        trigger: r(({ isOpen: o }) => [
-          c(e.$slots, "trigger", S(w({ selectedLabel: v(g), isOpen: o })), () => [
-            h(Q, {
-              "selected-label": v(g),
-              "is-open": o,
-              direction: t.direction,
+        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,
               class: "w-full"
-            }, null, 8, ["selected-label", "is-open", "direction"])
+            }, null, 8, ["selected-label", "is-open", "direction", "triggerProps"])
           ])
         ]),
-        default: r(() => [
-          c(e.$slots, "default"),
-          t.options?.length || s.value.length || e.$slots.menu || e.$slots.item || t.remote || t.searchable ? (k(), U(K, {
+        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, {
             key: 0,
-            options: t.options,
-            cachedOptions: s.value,
-            class: q(t.className),
-            selected: v(x),
-            selectedIndex: t.selectedIndex,
-            maxHeight: t.maxHeight,
-            nestedPosition: T.value,
-            nestedOffset: t.nestedOffset,
-            selectable: t.selectable,
-            direction: t.direction,
-            layout: t.layout,
-            columns: t.columns,
-            loading: t.loading,
-            hasMore: t.hasMore,
-            searchable: t.searchable,
-            remote: t.remote,
-            onSelect: L,
-            onClose: p,
-            onLoadMore: n[0] || (n[0] = (o) => e.$emit("load-more")),
-            onSearch: n[1] || (n[1] = (o) => e.$emit("search", o))
-          }, F({ _: 2 }, [
+            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))
+          }, Z({ _: 2 }, [
             e.$slots.menu ? {
               name: "menu",
-              fn: r(() => [
-                c(e.$slots, "menu")
+              fn: c(() => [
+                u(e.$slots, "menu")
               ]),
               key: "0"
             } : void 0,
             e.$slots.item ? {
               name: "item",
-              fn: r((o) => [
-                c(e.$slots, "item", S(w(o)))
+              fn: c((n) => [
+                u(e.$slots, "item", x(H(n)))
               ]),
               key: "1"
             } : void 0,
             e.$slots.header ? {
               name: "header",
-              fn: r(() => [
-                c(e.$slots, "header")
+              fn: c(() => [
+                u(e.$slots, "header")
               ]),
               key: "2"
             } : void 0,
             e.$slots.footer ? {
               name: "footer",
-              fn: r(() => [
-                c(e.$slots, "footer")
+              fn: c(() => [
+                u(e.$slots, "footer")
               ]),
               key: "3"
             } : void 0
-          ]), 1032, ["options", "cachedOptions", "class", "selected", "selectedIndex", "maxHeight", "nestedPosition", "nestedOffset", "selectable", "direction", "layout", "columns", "loading", "hasMore", "searchable", "remote"])) : G("", !0)
+          ]), 1032, ["options", "cachedOptions", "class", "selected", "selectedIndex", "maxHeight", "nestedPosition", "nestedOffset", "selectable", "direction", "layout", "columns", "loading", "hasMore", "searchable", "remote", "debounceTime"])) : _("", !0)
         ]),
         _: 3
       }, 8, ["teleport", "offset", "placement", "isOpen", "menuId", "ignoreClickOutside", "className"]),
-      h(W, {
-        show: m.value,
-        title: a.value.title,
-        description: a.value.description,
-        "confirm-text": a.value.confirmText,
-        "cancel-text": a.value.cancelText,
-        variant: a.value.variant,
-        onConfirm: A,
-        onCancel: V
+      $(oe, {
+        show: h.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
       }, null, 8, ["show", "title", "description", "confirm-text", "cancel-text", "variant"])
     ], 4));
   }
 });
 export {
-  se as default
+  ve as default
 };