vlite3 0.4.7 → 0.4.10

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

@@ -4,8 +4,8 @@ import "@iconify/vue";
 import O from "../Input.vue.js";
 import "../../core/config.js";
 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/Dropdown/Dropdown.vue.d.ts

@@ -1,4 +1,4 @@
-import { IDropdownOptions, IDropdownOption } from '../../types';
+import { IDropdownOptions, IDropdownOption, ButtonProps } from '../../types';
 import { TooltTipPlacement } from 'v-tooltip-lite/types';
 type __VLS_Props = {
     selected?: any;
@@ -30,6 +30,7 @@ type __VLS_Props = {
     hasMore?: boolean;
     searchable?: boolean;
     remote?: boolean;
+    triggerProps?: ButtonProps;
     direction?: 'ltr' | 'rtl';
 };
 declare function __VLS_template(): {

package/components/Dropdown/Dropdown.vue.js

@@ -38,6 +38,7 @@ const se = /* @__PURE__ */ z({
     hasMore: { type: Boolean, default: !1 },
     searchable: { type: Boolean, default: !0 },
     remote: { type: Boolean, default: !1 },
+    triggerProps: {},
     direction: { default: "ltr" }
   },
   emits: ["onSelect", "update:modelValue", "onOpen", "onClose", "update:isOpen", "load-more", "search"],

package/components/Dropdown/DropdownBooleanItem.vue.js

@@ -1,8 +1,8 @@
-import { defineComponent as m, computed as d, openBlock as l, createElementBlock as u, withModifiers as p, normalizeClass as f, createElementVNode as a, createBlock as g, createCommentVNode as v, toDisplayString as h, createVNode as x } from "vue";
+import { defineComponent as r, computed as d, openBlock as l, createElementBlock as u, withModifiers as p, normalizeClass as f, createElementVNode as a, createBlock as g, createCommentVNode as v, toDisplayString as h, createVNode as x } from "vue";
 import y from "../Switch.vue.js";
 import b from "../Icon.vue.js";
 import { $t as k } from "../../utils/i18n.js";
-const w = { class: "flex items-center gap-2 flex-1 min-w-0" }, B = { class: "truncate font-medium" }, D = /* @__PURE__ */ m({
+const w = { class: "flex items-center gap-2 flex-1 min-w-0" }, B = { class: "truncate font-medium" }, N = /* @__PURE__ */ r({
   __name: "DropdownBooleanItem",
   props: {
     option: {},
@@ -11,7 +11,7 @@ const w = { class: "flex items-center gap-2 flex-1 min-w-0" }, B = { class: "tru
   },
   emits: ["change"],
   setup(e, { emit: c }) {
-    const o = e, s = c, r = d(() => o.option.labelI18n ? k(o.option.labelI18n) : o.option.label), t = (n) => {
+    const o = e, s = c, m = d(() => o.option.labelI18n ? k(o.option.labelI18n) : o.option.label), t = (n) => {
       s("change", n, o.option);
     };
     return (n, i) => (l(), u("div", {
@@ -19,15 +19,16 @@ const w = { class: "flex items-center gap-2 flex-1 min-w-0" }, B = { class: "tru
       class: f(["relative flex cursor-pointer select-none items-center justify-between rounded-sm px-2 py-1.5 text-sm outline-none transition-colors", [
         e.focused ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground"
       ]]),
-      onClick: i[0] || (i[0] = p((C) => t(!e.value), ["stop"]))
+      onClick: i[0] || (i[0] = p((j) => t(!e.value), ["stop"]))
     }, [
       a("div", w, [
-        e.option.icon ? (l(), g(b, {
+        e.option.icon || e.option.emoji ? (l(), g(b, {
           key: 0,
           icon: e.option.icon,
+          emoji: e.option.emoji,
           class: "h-4 w-4 shrink-0 opacity-70"
-        }, null, 8, ["icon"])) : v("", !0),
-        a("span", B, h(r.value), 1)
+        }, null, 8, ["icon", "emoji"])) : v("", !0),
+        a("span", B, h(m.value), 1)
       ]),
       x(y, {
         "model-value": e.value,
@@ -38,5 +39,5 @@ const w = { class: "flex items-center gap-2 flex-1 min-w-0" }, B = { class: "tru
   }
 });
 export {
-  D as default
+  N as default
 };

package/components/Dropdown/DropdownGroupedLayout.vue.js

@@ -1,14 +1,14 @@
-import { defineComponent as _, computed as C, openBlock as t, createElementBlock as c, normalizeStyle as $, Fragment as a, renderList as i, createElementVNode as m, normalizeClass as h, toDisplayString as w, createBlock as d, createCommentVNode as f, createVNode as B } from "vue";
-import N from "../Icon.vue.js";
+import { defineComponent as _, computed as C, openBlock as l, createElementBlock as c, normalizeStyle as $, Fragment as a, renderList as i, createElementVNode as m, normalizeClass as h, toDisplayString as j, createBlock as u, createCommentVNode as f, createVNode as w } from "vue";
+import B from "../Icon.vue.js";
 import y from "./DropdownItem.vue.js";
-import { $t as S } from "../../utils/i18n.js";
-const L = { class: "font-semibold text-sm text-foreground" }, V = { class: "flex flex-col space-y-1" }, z = {
+import { $t as N } from "../../utils/i18n.js";
+const S = { class: "font-semibold text-sm text-foreground" }, L = { class: "flex flex-col space-y-1" }, V = {
   key: 0,
   class: "flex flex-col space-y-1 ml-3 pl-3 border-l border-border mt-0.5 mb-1.5"
-}, A = {
+}, z = {
   key: 1,
   class: "px-2 text-xs text-muted-foreground italic"
-}, F = /* @__PURE__ */ _({
+}, q = /* @__PURE__ */ _({
   __name: "DropdownGroupedLayout",
   props: {
     options: { default: () => [] },
@@ -19,56 +19,57 @@ const L = { class: "font-semibold text-sm text-foreground" }, V = { class: "flex
     headerClass: {}
   },
   emits: ["select", "mouseenter"],
-  setup(o, { emit: D }) {
-    const l = o, k = C(() => {
-      const e = l.columns;
+  setup(r, { emit: A }) {
+    const s = r, k = C(() => {
+      const e = s.columns;
       return typeof e == "number" ? { gridTemplateColumns: `repeat(${e}, minmax(0, 1fr))` } : { gridTemplateColumns: e };
-    }), u = (e) => l.selected ? Array.isArray(l.selected) ? l.selected.includes(e.value) : typeof l.selected == "object" && l.selected !== null && e.key && e.key in l.selected ? l.selected[e.key] === e.value : l.selected === e.value : !1, b = (e) => e.labelI18n ? S(e.labelI18n) : e.label;
-    return (e, E) => (t(), c("div", {
+    }), d = (e) => s.selected ? Array.isArray(s.selected) ? s.selected.includes(e.value) : typeof s.selected == "object" && s.selected !== null && e.key && e.key in s.selected ? s.selected[e.key] === e.value : s.selected === e.value : !1, b = (e) => e.labelI18n ? N(e.labelI18n) : e.label;
+    return (e, D) => (l(), c("div", {
       class: "grid gap-6 p-4",
       style: $(k.value)
     }, [
-      (t(!0), c(a, null, i(o.options, (s, p) => (t(), c("div", {
-        key: s.key || s.value || p,
+      (l(!0), c(a, null, i(r.options, (t, x) => (l(), c("div", {
+        key: t.key || t.value || x,
         class: "flex flex-col space-y-2 min-w-[150px]"
       }, [
         m("div", {
-          class: h(["flex items-center gap-2 px-2 py-1 mb-1", o.headerClass])
+          class: h(["flex items-center gap-2 px-2 py-1 mb-1", r.headerClass])
         }, [
-          m("span", L, w(b(s)), 1),
-          s.icon ? (t(), d(N, {
+          m("span", S, j(b(t)), 1),
+          t.icon || t.emoji ? (l(), u(B, {
             key: 0,
-            icon: s.icon,
+            icon: t.icon,
+            emoji: t.emoji,
             class: "w-4 h-4 text-muted-foreground"
-          }, null, 8, ["icon"])) : f("", !0)
+          }, null, 8, ["icon", "emoji"])) : f("", !0)
         ], 2),
-        m("div", V, [
-          s.children && s.children.length ? (t(!0), c(a, { key: 0 }, i(s.children, (n, x) => (t(), c(a, {
-            key: n.key || n.value || x
+        m("div", L, [
+          t.children && t.children.length ? (l(!0), c(a, { key: 0 }, i(t.children, (n, p) => (l(), c(a, {
+            key: n.key || n.value || p
           }, [
-            B(y, {
+            w(y, {
               option: n,
-              selected: u(n),
-              selectable: o.selectable,
+              selected: d(n),
+              selectable: r.selectable,
               class: "w-full",
-              onClick: (r) => e.$emit("select", n)
+              onClick: (o) => e.$emit("select", n)
             }, null, 8, ["option", "selected", "selectable", "onClick"]),
-            n.children && n.children.length ? (t(), c("div", z, [
-              (t(!0), c(a, null, i(n.children, (r, v) => (t(), d(y, {
-                key: r.key || r.value || v,
-                option: r,
-                selected: u(r),
-                selectable: o.selectable,
+            n.children && n.children.length ? (l(), c("div", V, [
+              (l(!0), c(a, null, i(n.children, (o, v) => (l(), u(y, {
+                key: o.key || o.value || v,
+                option: o,
+                selected: d(o),
+                selectable: r.selectable,
                 class: "w-full text-xs",
-                onClick: (G) => e.$emit("select", r)
+                onClick: (E) => e.$emit("select", o)
               }, null, 8, ["option", "selected", "selectable", "onClick"]))), 128))
             ])) : f("", !0)
-          ], 64))), 128)) : (t(), c("div", A, "No items"))
+          ], 64))), 128)) : (l(), c("div", z, "No items"))
         ])
       ]))), 128))
     ], 4));
   }
 });
 export {
-  F as default
+  q as default
 };

package/components/Dropdown/DropdownItem.vue.js

@@ -1,13 +1,13 @@
 import { defineComponent as k, computed as l, openBlock as o, createElementBlock as s, normalizeClass as h, renderSlot as g, normalizeProps as w, guardReactiveProps as I, createBlock as p, createCommentVNode as i, createElementVNode as a, toDisplayString as c } from "vue";
 import f from "../Icon.vue.js";
 import { $t as d } from "../../utils/i18n.js";
-const B = ["data-disabled"], $ = { class: "flex flex-col flex-1 min-w-0" }, C = { class: "flex items-center justify-between gap-2" }, D = { class: "truncate font-medium" }, S = {
+const B = ["data-disabled"], $ = { class: "flex flex-col flex-1 min-w-0" }, j = { class: "flex items-center justify-between gap-2" }, C = { class: "truncate font-medium" }, D = {
   key: 0,
   class: "text-xs text-muted-foreground whitespace-nowrap opacity-90"
-}, z = {
+}, S = {
   key: 0,
   class: "text-[10px] text-muted-foreground truncate opacity-70"
-}, V = /* @__PURE__ */ k({
+}, P = /* @__PURE__ */ k({
   __name: "DropdownItem",
   props: {
     option: {},
@@ -31,17 +31,18 @@ const B = ["data-disabled"], $ = { class: "flex flex-col flex-1 min-w-0" }, C =
       onMouseenter: n[1] || (n[1] = (v) => m.$emit("mouseenter", e.index ?? -1))
     }, [
       g(m.$slots, "default", w(I({ option: e.option, index: e.index, selected: e.selected })), () => [
-        e.option.icon ? (o(), p(f, {
+        e.option.icon || e.option.emoji ? (o(), p(f, {
           key: 0,
           icon: e.option.icon,
+          emoji: e.option.emoji,
           class: "mr-2 h-4 w-4 shrink-0 mt-0.5"
-        }, null, 8, ["icon"])) : i("", !0),
+        }, null, 8, ["icon", "emoji"])) : i("", !0),
         a("div", $, [
-          a("div", C, [
-            a("span", D, c(y.value), 1),
-            r.value ? (o(), s("span", S, c(r.value), 1)) : i("", !0)
+          a("div", j, [
+            a("span", C, c(y.value), 1),
+            r.value ? (o(), s("span", D, c(r.value), 1)) : i("", !0)
           ]),
-          u.value ? (o(), s("span", z, c(u.value), 1)) : i("", !0)
+          u.value ? (o(), s("span", S, c(u.value), 1)) : i("", !0)
         ]),
         e.selectable && e.selected ? (o(), p(f, {
           key: 1,
@@ -53,5 +54,5 @@ const B = ["data-disabled"], $ = { class: "flex flex-col flex-1 min-w-0" }, C =
   }
 });
 export {
-  V as default
+  P as default
 };

package/components/Dropdown/DropdownMenu.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as Y, defineAsyncComponent as Z, ref as C, computed as v, watch as T, toRef as ee, onMounted as te, onBeforeUnmount as le, openBlock as o, createElementBlock as c, createVNode as x, createCommentVNode as i, renderSlot as g, unref as n, normalizeStyle as se, normalizeClass as D, toDisplayString as E, createBlock as m, Fragment as N, renderList as oe, withCtx as V, createElementVNode as S, createSlots as ne, mergeProps as re, nextTick as de } from "vue";
+import { defineComponent as Y, defineAsyncComponent as Z, ref as C, computed as v, watch as j, toRef as ee, onMounted as te, onBeforeUnmount as le, openBlock as o, createElementBlock as c, createVNode as x, createCommentVNode as i, renderSlot as g, unref as n, normalizeStyle as se, normalizeClass as T, toDisplayString as D, createBlock as m, Fragment as E, renderList as oe, withCtx as N, createElementVNode as S, createSlots as ne, mergeProps as re, nextTick as de } from "vue";
 import $ from "../Icon.vue.js";
 import ce from "../Input.vue.js";
 import ae from "./DropdownItem.vue.js";
@@ -25,7 +25,7 @@ const he = ["dir"], ye = {
 }, Se = {
   key: 3,
   class: "shrink-0 border-t mt-1 pt-1"
-}, Ne = /* @__PURE__ */ Y({
+}, Ee = /* @__PURE__ */ Y({
   __name: "DropdownMenu",
   props: {
     options: { default: () => [] },
@@ -46,8 +46,8 @@ const he = ["dir"], ye = {
     direction: { default: "ltr" }
   },
   emits: ["select", "close", "load-more", "search"],
-  setup(r, { emit: j }) {
-    const P = Z(() => import("./Dropdown.vue2.js")), t = r, u = j, M = C(null), f = C(""), { getMenuId: _, getAllRecursiveIds: H } = me(), R = v(() => {
+  setup(r, { emit: V }) {
+    const P = Z(() => import("./Dropdown.vue2.js")), t = r, u = V, M = C(null), f = C(""), { getMenuId: _, getAllRecursiveIds: H } = me(), R = v(() => {
       const e = I("vlite.dropdown.empty");
       return e !== "vlite.dropdown.empty" ? e : "No options found";
     }), z = v(() => {
@@ -55,7 +55,7 @@ const he = ["dir"], ye = {
       return e !== "vlite.dropdown.search" ? e : "Search...";
     }), A = v(() => t.remote ? t.searchable : t.searchable && (t.options?.length || 0) > 9);
     let k = null;
-    T(f, (e) => {
+    j(f, (e) => {
       t.remote && (k && clearTimeout(k), k = setTimeout(() => {
         e && u("search", e);
       }, 100));
@@ -69,7 +69,6 @@ const he = ["dir"], ye = {
       focusedIndex: h,
       isKeyboardMode: w,
       filteredOptions: F,
-      // rename
       handleKeyDown: O,
       handleMouseMove: B,
       onMouseEnterItem: p,
@@ -107,7 +106,7 @@ const he = ["dir"], ye = {
       let e = -1;
       t.layout !== "grouped" && (t.selectedIndex !== null && t.selectedIndex >= 0 ? e = t.selectedIndex : t.selected !== void 0 && typeof t.selected != "object" && (e = t.options.findIndex((s) => s.value === t.selected)), e !== -1 && K(e));
     };
-    T(
+    j(
       () => y.value,
       () => {
         h.value = -1;
@@ -143,7 +142,7 @@ const he = ["dir"], ye = {
         ref: M,
         tabindex: "0",
         role: "menu",
-        class: D([
+        class: T([
           "w-full p-1 space-y-0.5 overflow-y-auto overflow-x-hidden focus:outline-none flex-1",
           t.class
         ]),
@@ -152,7 +151,7 @@ const he = ["dir"], ye = {
         (...l) => n(B) && n(B)(...l)),
         onScroll: L
       }, [
-        y.value.length === 0 && r.options?.length > 0 && !r.loading ? (o(), c("div", ge, E(R.value), 1)) : i("", !0),
+        y.value.length === 0 && r.options?.length > 0 && !r.loading ? (o(), c("div", ge, D(R.value), 1)) : i("", !0),
         r.layout === "grouped" ? (o(), m(ue, {
           key: 1,
           options: y.value,
@@ -160,7 +159,7 @@ const he = ["dir"], ye = {
           selectable: r.selectable,
           columns: r.columns,
           onSelect: b
-        }, null, 8, ["options", "selected", "selectable", "columns"])) : (o(!0), c(N, { key: 2 }, oe(y.value, (l, d) => (o(), c(N, { key: d }, [
+        }, null, 8, ["options", "selected", "selectable", "columns"])) : (o(!0), c(E, { key: 2 }, oe(y.value, (l, d) => (o(), c(E, { key: d }, [
           l.label === "---" ? (o(), c("div", ke)) : l.data?.isBoolean ? (o(), m(ie, {
             key: 1,
             option: l,
@@ -183,22 +182,23 @@ const he = ["dir"], ye = {
             direction: r.direction,
             onOnSelect: (a) => Q(l, a)
           }, {
-            trigger: V(() => [
+            trigger: N(() => [
               S("div", {
                 "data-dropdown-item": "",
-                class: D(["relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm font-medium outline-none transition-colors justify-between w-full", [
+                class: T(["relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm font-medium outline-none transition-colors justify-between w-full", [
                   n(w) && n(h) === d ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground",
                   l.disabled ? "opacity-50 cursor-not-allowed" : ""
                 ]]),
                 onMouseenter: (a) => n(p)(d)
               }, [
                 S("div", we, [
-                  l.icon ? (o(), m($, {
+                  l.icon || l.emoji ? (o(), m($, {
                     key: 0,
                     icon: l.icon,
+                    emoji: l.emoji,
                     class: "mr-2 h-4 w-4 shrink-0 mt-0.5"
-                  }, null, 8, ["icon"])) : i("", !0),
-                  S("span", pe, E(X(l)), 1)
+                  }, null, 8, ["icon", "emoji"])) : i("", !0),
+                  S("span", pe, D(X(l)), 1)
                 ]),
                 x($, {
                   icon: r.direction === "rtl" ? "lucide:chevron-left" : "lucide:chevron-right",
@@ -219,7 +219,7 @@ const he = ["dir"], ye = {
           }, ne({ _: 2 }, [
             e.$slots.item ? {
               name: "default",
-              fn: V((a) => [
+              fn: N((a) => [
                 g(e.$slots, "item", re({ ref_for: !0 }, a))
               ]),
               key: "0"
@@ -241,5 +241,5 @@ const he = ["dir"], ye = {
   }
 });
 export {
-  Ne as default
+  Ee as default
 };

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

@@ -1,3 +1,4 @@
+import { ButtonProps } from '../../types';
 interface Props {
     selectedLabel?: string;
     placeholder?: string;
@@ -5,6 +6,7 @@ interface Props {
     disabled?: boolean;
     className?: string;
     direction?: 'ltr' | 'rtl';
+    triggerProps?: ButtonProps;
 }
 declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
     disabled: boolean;

package/components/Dropdown/DropdownTrigger.vue.js

@@ -1,6 +1,6 @@
-import { defineComponent as a, openBlock as l, createBlock as t, normalizeClass as o } from "vue";
+import { defineComponent as t, openBlock as a, createBlock as l, mergeProps as o } from "vue";
 import n from "../Button.vue.js";
-const s = /* @__PURE__ */ a({
+const s = /* @__PURE__ */ t({
   __name: "DropdownTrigger",
   props: {
     selectedLabel: { default: "" },
@@ -8,17 +8,19 @@ const s = /* @__PURE__ */ a({
     isOpen: { type: Boolean },
     disabled: { type: Boolean, default: !1 },
     className: {},
-    direction: { default: "ltr" }
+    direction: { default: "ltr" },
+    triggerProps: {}
   },
   setup(e) {
-    return (i, d) => (l(), t(n, {
+    return (r, i) => (a(), l(n, o({
       text: e.selectedLabel || e.placeholder,
       iconRight: "iconamoon:arrow-down-2",
       variant: "outline",
       disabled: e.disabled,
-      dir: e.direction,
-      class: o(["w-full justify-between! font-normal", e.className])
-    }, null, 8, ["text", "disabled", "dir", "class"]));
+      dir: e.direction
+    }, e.triggerProps, {
+      class: ["w-full justify-between! font-normal", e.className]
+    }), null, 16, ["text", "disabled", "dir", "class"]));
   }
 });
 export {