iryx-ui 0.24.1 → 0.26.0

package/dist/components/AvatarGroup.vue.d.ts

@@ -11,21 +11,27 @@ export interface AvatarGroupProps {
     max?: number;
     size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
     shape?: 'circle' | 'square';
+    /**
+     * Show each person's `name` in a tooltip, and lift the avatar under the
+     * pointer or focus out of the stack.
+     */
+    tooltip?: boolean;
     /** Skip built-in classes; you take over styling entirely. */
     unstyled?: boolean;
     class?: ClassValue;
     /** Override classes per element, e.g. `{ overflow: 'bg-primary' }`. */
     ui?: {
         root?: string;
+        trigger?: string;
         item?: string;
         overflow?: string;
     };
 }
-declare var __VLS_1: {
+declare var __VLS_8: {
     count: number;
 };
 type __VLS_Slots = {} & {
-    overflow?: (props: typeof __VLS_1) => any;
+    overflow?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<AvatarGroupProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AvatarGroupProps> & Readonly<{}>, {
     unstyled: boolean;

package/dist/components/AvatarGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,15 +1,17 @@
 import { useIryxUiConfig as e } from "../config.js";
 import { avatarGroupTheme as t } from "../theme/avatar.js";
 import n from "./Avatar.js";
-import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createTextVNode as c, defineComponent as l, mergeProps as u, normalizeClass as d, openBlock as f, renderList as p, renderSlot as m, toDisplayString as h } from "vue";
+import r from "./Tooltip.js";
+import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeProps as p, normalizeClass as m, openBlock as h, renderList as g, renderSlot as _, toDisplayString as v, withCtx as y } from "vue";
 //#region src/components/AvatarGroup.vue?vue&type=script&setup=true&lang.ts
-var g = /*@__PURE__*/ l({
+var b = ["tabindex"], x = ["tabindex"], S = /*@__PURE__*/ f({
 	__name: "AvatarGroup",
 	props: {
 		items: {},
 		max: {},
 		size: {},
 		shape: {},
+		tooltip: { type: Boolean },
 		unstyled: {
 			type: Boolean,
 			default: void 0
@@ -22,29 +24,61 @@ var g = /*@__PURE__*/ l({
 		] },
 		ui: {}
 	},
-	setup(l) {
-		let g = l, _ = i(() => g.items ?? []), v = i(() => {
-			let e = g.max;
-			return [...e !== void 0 && _.value.length > e ? _.value.slice(0, e) : _.value].reverse();
-		}), y = i(() => {
-			let e = g.max;
-			return e === void 0 || _.value.length <= e ? 0 : _.value.length - e;
-		}), b = e(), x = i(() => g.unstyled ?? b.unstyled), S = i(() => t({ size: g.size })), C = i(() => x.value ? [g.ui?.root, g.class] : S.value.root({ class: [g.ui?.root, g.class] })), w = i(() => x.value ? g.ui?.item : S.value.item({ class: g.ui?.item })), T = i(() => x.value ? g.ui?.overflow : S.value.overflow({ class: g.ui?.overflow }));
-		return (e, t) => (f(), s("div", { class: d(C.value) }, [y.value ? (f(), s("span", {
+	setup(f) {
+		let S = f, C = a(() => S.items ?? []), w = a(() => {
+			let e = S.max;
+			return [...e !== void 0 && C.value.length > e ? C.value.slice(0, e) : C.value].reverse();
+		}), T = a(() => {
+			let e = S.max;
+			return e === void 0 || C.value.length <= e ? 0 : C.value.length - e;
+		}), E = a(() => C.value.slice(C.value.length - T.value).map((e) => e.name).filter(Boolean).join(", ")), D = e(), O = a(() => S.unstyled ?? D.unstyled), k = a(() => t({
+			size: S.size,
+			tooltip: S.tooltip
+		})), A = a(() => O.value ? [S.ui?.root, S.class] : k.value.root({ class: [S.ui?.root, S.class] })), j = a(() => O.value ? S.ui?.trigger : k.value.trigger({ class: S.ui?.trigger })), M = a(() => O.value ? S.ui?.item : k.value.item({ class: S.ui?.item })), N = a(() => O.value ? S.ui?.overflow : k.value.overflow({ class: S.ui?.overflow }));
+		return (e, t) => (h(), c("div", { class: m(A.value) }, [T.value ? (h(), o(r, {
 			key: 0,
-			class: d(T.value)
-		}, [m(e.$slots, "overflow", { count: y.value }, () => [c("+" + h(y.value), 1)])], 2)) : o("", !0), (f(!0), s(r, null, p(v.value, (e, t) => (f(), a(n, u({ key: t }, { ref_for: !0 }, e, {
-			size: g.size,
-			shape: g.shape,
-			unstyled: x.value,
-			class: w.value
-		}), null, 16, [
-			"size",
-			"shape",
-			"unstyled",
-			"class"
+			text: E.value,
+			disabled: !S.tooltip || !E.value,
+			"side-offset": 10,
+			unstyled: O.value
+		}, {
+			trigger: y(() => [l("span", {
+				class: m(N.value),
+				tabindex: S.tooltip && E.value ? 0 : void 0
+			}, [_(e.$slots, "overflow", { count: T.value }, () => [u("+" + v(T.value), 1)])], 10, b)]),
+			_: 3
+		}, 8, [
+			"text",
+			"disabled",
+			"unstyled"
+		])) : s("", !0), (h(!0), c(i, null, g(w.value, (e, t) => (h(), o(r, {
+			key: t,
+			text: e.name,
+			disabled: !S.tooltip || !e.name,
+			"side-offset": 10,
+			unstyled: O.value
+		}, {
+			trigger: y(() => [l("span", {
+				class: m(j.value),
+				tabindex: S.tooltip && e.name ? 0 : void 0
+			}, [d(n, p({ ref_for: !0 }, e, {
+				size: S.size,
+				shape: S.shape,
+				unstyled: O.value,
+				class: M.value
+			}), null, 16, [
+				"size",
+				"shape",
+				"unstyled",
+				"class"
+			])], 10, x)]),
+			_: 2
+		}, 1032, [
+			"text",
+			"disabled",
+			"unstyled"
 		]))), 128))], 2));
 	}
 });
 //#endregion
-export { g as default };
+export { S as default };

package/dist/components/Breadcrumb.vue.d.ts

@@ -15,6 +15,13 @@ export interface BreadcrumbProps {
      * apps.
      */
     label?: string;
+    /**
+     * Show at most this many crumbs: the first, then a "…" menu holding the
+     * middle, then the last `max - 1`. Below 2 it is treated as 2.
+     */
+    max?: number;
+    /** Accessible name for the "…" button — override for non-English apps. */
+    moreLabel?: string;
     /** Skip built-in classes; you take over styling entirely. */
     unstyled?: boolean;
     class?: ClassValue;
@@ -28,13 +35,14 @@ export interface BreadcrumbProps {
         separator?: string;
     };
 }
-declare var __VLS_26: {};
+declare var __VLS_38: {};
 type __VLS_Slots = {} & {
-    separator?: (props: typeof __VLS_26) => any;
+    separator?: (props: typeof __VLS_38) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<BreadcrumbProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<BreadcrumbProps> & Readonly<{}>, {
     label: string;
     unstyled: boolean;
+    moreLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/Breadcrumb.vue_vue_type_script_setup_true_lang.js

@@ -1,15 +1,18 @@
 import { useIryxUiConfig as e } from "../config.js";
 import t from "./Icon.js";
 import { breadcrumbTheme as n } from "../theme/breadcrumb.js";
-import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, normalizeClass as f, openBlock as p, renderList as m, renderSlot as h, resolveDynamicComponent as g, toDisplayString as _, unref as v, withCtx as y } from "vue";
-import { ArrowRight01Icon as b } from "@hugeicons/core-free-icons";
-import { Primitive as x } from "reka-ui";
+import r from "./DropdownMenu.js";
+import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, normalizeClass as p, openBlock as m, renderList as h, renderSlot as g, resolveDynamicComponent as _, toDisplayString as v, unref as y, withCtx as b } from "vue";
+import { ArrowRight01Icon as x, MoreHorizontalIcon as S } from "@hugeicons/core-free-icons";
+import { Primitive as C } from "reka-ui";
 //#region src/components/Breadcrumb.vue?vue&type=script&setup=true&lang.ts
-var S = /*@__PURE__*/ d({
+var w = ["aria-label"], T = /*@__PURE__*/ f({
 	__name: "Breadcrumb",
 	props: {
 		items: {},
 		label: { default: "Breadcrumb" },
+		max: {},
+		moreLabel: { default: "Show hidden pages" },
 		unstyled: {
 			type: Boolean,
 			default: void 0
@@ -22,52 +25,81 @@ var S = /*@__PURE__*/ d({
 		] },
 		ui: {}
 	},
-	setup(d) {
-		let S = d, C = e(), w = i(() => S.unstyled ?? C.unstyled), T = i(() => S.items ?? []), E = i(() => T.value.length - 1), D = i(() => n());
-		function O(e) {
-			let t = S.ui?.[e];
-			return w.value ? t : D.value[e]({ class: t });
+	setup(f) {
+		let T = f, E = e(), D = a(() => T.unstyled ?? E.unstyled), O = a(() => T.items ?? []), k = a(() => O.value.length - 1), A = a(() => {
+			if (T.max === void 0) return 0;
+			let e = Math.max(T.max, 2);
+			return O.value.length > e ? O.value.length - e : 0;
+		}), j = a(() => {
+			let e = O.value.map((e, t) => ({
+				item: e,
+				index: t
+			}));
+			return A.value ? [
+				e[0],
+				null,
+				...e.slice(1 + A.value)
+			] : e;
+		}), M = a(() => O.value.slice(1, 1 + A.value).map((e) => ({
+			label: e.label,
+			icon: e.icon,
+			onSelect: e.onSelect ?? (e.href ? () => window.location.assign(e.href) : void 0)
+		}))), N = a(() => n());
+		function P(e) {
+			let t = T.ui?.[e];
+			return D.value ? t : N.value[e]({ class: t });
 		}
-		return (e, n) => (p(), a(v(x), {
+		return (e, n) => (m(), o(y(C), {
 			as: "nav",
-			"aria-label": S.label,
-			class: f(w.value ? [S.ui?.root, S.class] : D.value.root({ class: [S.ui?.root, S.class] }))
+			"aria-label": T.label,
+			class: p(D.value ? [T.ui?.root, T.class] : N.value.root({ class: [T.ui?.root, T.class] }))
 		}, {
-			default: y(() => [c("ol", { class: f(O("list")) }, [(p(!0), s(r, null, m(T.value, (n, r) => (p(), s("li", {
-				key: r,
-				class: f(O("item"))
-			}, [r === E.value ? (p(), s("span", {
-				key: 0,
+			default: b(() => [l("ol", { class: p(P("list")) }, [(m(!0), c(i, null, h(j.value, (n) => (m(), c("li", {
+				key: n?.index ?? "more",
+				class: p(P("item"))
+			}, [n ? n.index === k.value ? (m(), c("span", {
+				key: 1,
 				"aria-current": "page",
-				class: f(O("current"))
-			}, [n.icon ? (p(), a(t, {
+				class: p(P("current"))
+			}, [n.item.icon ? (m(), o(t, {
 				key: 0,
-				icon: n.icon
-			}, null, 8, ["icon"])) : o("", !0), l(" " + _(n.label), 1)], 2)) : (p(), a(g(n.href ? "a" : "button"), {
-				key: 1,
-				href: n.href,
-				type: n.href ? void 0 : "button",
-				class: f(O("link")),
-				onClick: (e) => n.onSelect?.()
+				icon: n.item.icon
+			}, null, 8, ["icon"])) : s("", !0), u(" " + v(n.item.label), 1)], 2)) : (m(), o(_(n.item.href ? "a" : "button"), {
+				key: 2,
+				href: n.item.href,
+				type: n.item.href ? void 0 : "button",
+				class: p(P("link")),
+				onClick: (e) => n.item.onSelect?.()
 			}, {
-				default: y(() => [n.icon ? (p(), a(t, {
+				default: b(() => [n.item.icon ? (m(), o(t, {
 					key: 0,
-					icon: n.icon
-				}, null, 8, ["icon"])) : o("", !0), l(" " + _(n.label), 1)]),
+					icon: n.item.icon
+				}, null, 8, ["icon"])) : s("", !0), u(" " + v(n.item.label), 1)]),
 				_: 2
 			}, 1032, [
 				"href",
 				"type",
 				"class",
 				"onClick"
-			])), r === E.value ? o("", !0) : (p(), s("span", {
-				key: 2,
+			])) : (m(), o(r, {
+				key: 0,
+				items: M.value,
+				unstyled: D.value
+			}, {
+				trigger: b(() => [l("button", {
+					type: "button",
+					"aria-label": T.moreLabel,
+					class: p(P("link"))
+				}, [d(t, { icon: y(S) }, null, 8, ["icon"])], 10, w)]),
+				_: 1
+			}, 8, ["items", "unstyled"])), n?.index === k.value ? s("", !0) : (m(), c("span", {
+				key: 3,
 				"aria-hidden": "true",
-				class: f(O("separator"))
-			}, [h(e.$slots, "separator", {}, () => [u(t, { icon: v(b) }, null, 8, ["icon"])])], 2))], 2))), 128))], 2)]),
+				class: p(P("separator"))
+			}, [g(e.$slots, "separator", {}, () => [d(t, { icon: y(x) }, null, 8, ["icon"])])], 2))], 2))), 128))], 2)]),
 			_: 3
 		}, 8, ["aria-label", "class"]));
 	}
 });
 //#endregion
-export { S as default };
+export { T as default };

package/dist/components/CommandPalette.vue.d.ts

@@ -15,6 +15,16 @@ export interface CommandPaletteProps {
     hotkey?: string | null;
     /** Close once a command is chosen. */
     closeOnSelect?: boolean;
+    /**
+     * Remember recently chosen commands under this `localStorage` key and list
+     * them first while the search is empty. Unset (the default) remembers
+     * nothing. Use a different key per palette.
+     */
+    recentKey?: string;
+    /** How many recent commands to keep. */
+    recentLimit?: number;
+    /** Heading over the recent commands. Override for non-English apps. */
+    recentLabel?: string;
     /** Hint row along the bottom. Set `false` to drop it. */
     footer?: boolean;
     /** Skip built-in classes; you take over styling entirely. */
@@ -53,6 +63,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
     emptyText: string;
     hotkey: string | null;
     closeOnSelect: boolean;
+    recentLimit: number;
+    recentLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/components/CommandPalette.vue_vue_type_script_setup_true_lang.js

@@ -1,15 +1,15 @@
 import { useIryxUiConfig as e } from "../config.js";
 import t from "./Icon.js";
-import { commandHaystack as n, matchesHotkey as r, toCommandGroups as i } from "../composables/command-palette.js";
-import { commandPaletteTheme as a } from "../theme/command-palette.js";
-import o from "./Kbd.js";
-import { Fragment as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as p, createVNode as m, defineComponent as h, mergeModels as g, normalizeClass as _, onBeforeUnmount as v, onMounted as y, openBlock as b, ref as x, renderList as S, renderSlot as C, toDisplayString as w, unref as T, useModel as E, watch as D, withCtx as O } from "vue";
-import { Search01Icon as k } from "@hugeicons/core-free-icons";
-import { DialogContent as ee, DialogOverlay as te, DialogPortal as ne, DialogRoot as A, DialogTitle as j, ListboxContent as M, ListboxFilter as N, ListboxGroup as P, ListboxGroupLabel as F, ListboxItem as I, ListboxRoot as L, VisuallyHidden as R, useFilter as z } from "reka-ui";
+import { commandHaystack as n, commandId as r, matchesHotkey as i, pushRecent as a, toCommandGroups as o } from "../composables/command-palette.js";
+import { commandPaletteTheme as s } from "../theme/command-palette.js";
+import c from "./Kbd.js";
+import { Fragment as l, computed as u, createBlock as d, createCommentVNode as f, createElementBlock as p, createElementVNode as m, createTextVNode as h, createVNode as g, defineComponent as _, mergeModels as v, normalizeClass as y, onBeforeUnmount as b, onMounted as x, openBlock as S, ref as C, renderList as w, renderSlot as T, toDisplayString as E, unref as D, useModel as O, watch as k, withCtx as A } from "vue";
+import { Search01Icon as j } from "@hugeicons/core-free-icons";
+import { DialogContent as M, DialogOverlay as ee, DialogPortal as te, DialogRoot as ne, DialogTitle as re, ListboxContent as ie, ListboxFilter as ae, ListboxGroup as oe, ListboxGroupLabel as se, ListboxItem as N, ListboxRoot as P, VisuallyHidden as F, useFilter as I } from "reka-ui";
 //#region src/components/CommandPalette.vue?vue&type=script&setup=true&lang.ts
-var B = /*@__PURE__*/ h({
+var L = /*@__PURE__*/ _({
 	__name: "CommandPalette",
-	props: /*@__PURE__*/ g({
+	props: /*@__PURE__*/ v({
 		items: {},
 		placeholder: { default: "Search commands…" },
 		emptyText: { default: "No matching commands." },
@@ -19,6 +19,9 @@ var B = /*@__PURE__*/ h({
 			type: Boolean,
 			default: !0
 		},
+		recentKey: {},
+		recentLimit: { default: 5 },
+		recentLabel: { default: "Recent" },
 		footer: {
 			type: Boolean,
 			default: !0
@@ -41,109 +44,143 @@ var B = /*@__PURE__*/ h({
 		},
 		openModifiers: {}
 	}),
-	emits: /*@__PURE__*/ g(["select"], ["update:open"]),
-	setup(h, { emit: g }) {
-		let B = h, V = g, H = E(h, "open"), U = x("");
-		D(H, (e) => {
-			e || (U.value = "");
+	emits: /*@__PURE__*/ v(["select"], ["update:open"]),
+	setup(_, { emit: v }) {
+		let L = _, R = v, z = O(_, "open"), B = C("");
+		k(z, (e) => {
+			e || (B.value = "");
 		});
-		let { contains: W } = z({ sensitivity: "base" }), G = c(() => i(B.items)), K = c(() => {
-			let e = U.value.trim();
-			return G.value.map((t) => ({
+		let { contains: V } = I({ sensitivity: "base" }), H = u(() => o(L.items)), U = C([]);
+		function W() {
+			if (L.recentKey) try {
+				let e = JSON.parse(window.localStorage.getItem(L.recentKey) ?? "[]");
+				U.value = Array.isArray(e) ? e.filter((e) => typeof e == "string") : [];
+			} catch {
+				U.value = [];
+			}
+		}
+		function G(e, t) {
+			if (L.recentKey) {
+				U.value = a(U.value, r(e, t), L.recentLimit);
+				try {
+					window.localStorage.setItem(L.recentKey, JSON.stringify(U.value));
+				} catch {}
+			}
+		}
+		x(W), k(() => L.recentKey, W);
+		let K = u(() => {
+			if (!L.recentKey || !U.value.length) return;
+			let e = /* @__PURE__ */ new Map();
+			for (let t of H.value) for (let n of t.items) e.set(r(n, t.label), {
+				item: n,
+				group: t.label
+			});
+			let t = U.value.slice(0, L.recentLimit).map((t) => e.get(t)).filter((e) => !!e && !e.item.disabled);
+			return t.length ? {
+				label: L.recentLabel,
+				items: t.map((e) => e.item),
+				sources: t.map((e) => e.group)
+			} : void 0;
+		}), q = u(() => {
+			let e = B.value.trim(), t = H.value.map((t) => ({
 				...t,
-				items: e ? t.items.filter((r) => W(n(r, t.label), e)) : t.items
+				items: e ? t.items.filter((r) => V(n(r, t.label), e)) : t.items
+			})).map((e) => ({
+				...e,
+				sources: e.items.map(() => e.label)
 			})).filter((e) => e.items.length > 0);
-		}), q = c(() => K.value.length === 0);
+			return !e && K.value ? [K.value, ...t] : t;
+		}), ce = u(() => q.value.length === 0);
 		function J(e, t) {
 			return `${e}:${t}`;
 		}
-		function Y(e) {
-			e.disabled || (V("select", e), e.onSelect?.(), B.closeOnSelect && (H.value = !1));
+		function le(e, t) {
+			e.disabled || (G(e, t), R("select", e), e.onSelect?.(), L.closeOnSelect && (z.value = !1));
 		}
-		function X(e) {
-			B.hotkey && r(e, B.hotkey) && (e.preventDefault(), H.value = !H.value);
+		function Y(e) {
+			L.hotkey && i(e, L.hotkey) && (e.preventDefault(), z.value = !z.value);
 		}
-		y(() => window.addEventListener("keydown", X)), v(() => window.removeEventListener("keydown", X));
-		let re = e(), Z = c(() => B.unstyled ?? re.unstyled), Q = c(() => a());
+		x(() => window.addEventListener("keydown", Y)), b(() => window.removeEventListener("keydown", Y));
+		let X = e(), Z = u(() => L.unstyled ?? X.unstyled), Q = u(() => s());
 		function $(e, t) {
-			let n = B.ui?.[e];
+			let n = L.ui?.[e];
 			return Z.value ? [n, t].filter(Boolean).join(" ") : Q.value[e]({ class: [n, t] });
 		}
-		function ie(e) {
+		function ue(e) {
 			return e.split(" ").filter(Boolean);
 		}
-		return (e, n) => (b(), l(T(A), {
-			open: H.value,
-			"onUpdate:open": n[1] ||= (e) => H.value = e
+		return (e, n) => (S(), d(D(ne), {
+			open: z.value,
+			"onUpdate:open": n[1] ||= (e) => z.value = e
 		}, {
-			default: O(() => [m(T(ne), null, {
-				default: O(() => [m(T(te), { class: _($("overlay")) }, null, 8, ["class"]), m(T(ee), {
-					class: _(Z.value ? [B.ui?.content, B.class] : Q.value.content({ class: [B.ui?.content, B.class] })),
-					"aria-label": B.label,
+			default: A(() => [g(D(te), null, {
+				default: A(() => [g(D(ee), { class: y($("overlay")) }, null, 8, ["class"]), g(D(M), {
+					class: y(Z.value ? [L.ui?.content, L.class] : Q.value.content({ class: [L.ui?.content, L.class] })),
+					"aria-label": L.label,
 					"aria-describedby": void 0
 				}, {
-					default: O(() => [
-						m(T(R), null, {
-							default: O(() => [m(T(j), null, {
-								default: O(() => [p(w(B.label), 1)]),
+					default: A(() => [
+						g(D(F), null, {
+							default: A(() => [g(D(re), null, {
+								default: A(() => [h(E(L.label), 1)]),
 								_: 1
 							})]),
 							_: 1
 						}),
-						m(T(L), {
+						g(D(P), {
 							"highlight-on-hover": "",
-							class: _($("list"))
+							class: y($("list"))
 						}, {
-							default: O(() => [f("div", { class: _($("header")) }, [f("span", { class: _($("icon")) }, [m(t, { icon: T(k) }, null, 8, ["icon"])], 2), m(T(N), {
-								modelValue: U.value,
-								"onUpdate:modelValue": n[0] ||= (e) => U.value = e,
+							default: A(() => [m("div", { class: y($("header")) }, [m("span", { class: y($("icon")) }, [g(t, { icon: D(j) }, null, 8, ["icon"])], 2), g(D(ae), {
+								modelValue: B.value,
+								"onUpdate:modelValue": n[0] ||= (e) => B.value = e,
 								"auto-focus": "",
-								placeholder: B.placeholder,
-								class: _($("input"))
+								placeholder: L.placeholder,
+								class: y($("input"))
 							}, null, 8, [
 								"modelValue",
 								"placeholder",
 								"class"
-							])], 2), m(T(M), { class: _($("viewport")) }, {
-								default: O(() => [q.value ? (b(), d("p", {
+							])], 2), g(D(ie), { class: y($("viewport")) }, {
+								default: A(() => [ce.value ? (S(), p("p", {
 									key: 0,
-									class: _($("empty"))
-								}, [C(e.$slots, "empty", { query: U.value }, () => [p(w(B.emptyText), 1)])], 2)) : u("", !0), (b(!0), d(s, null, S(K.value, (n, r) => (b(), l(T(P), {
+									class: y($("empty"))
+								}, [T(e.$slots, "empty", { query: B.value }, () => [h(E(L.emptyText), 1)])], 2)) : f("", !0), (S(!0), p(l, null, w(q.value, (n, r) => (S(), d(D(oe), {
 									key: n.label || r,
-									class: _($("group"))
+									class: y($("group"))
 								}, {
-									default: O(() => [n.label ? (b(), l(T(F), {
+									default: A(() => [n.label ? (S(), d(D(se), {
 										key: 0,
-										class: _($("groupLabel"))
+										class: y($("groupLabel"))
 									}, {
-										default: O(() => [p(w(n.label), 1)]),
+										default: A(() => [h(E(n.label), 1)]),
 										_: 2
-									}, 1032, ["class"])) : u("", !0), (b(!0), d(s, null, S(n.items, (n, i) => (b(), l(T(I), {
-										key: J(r, i),
-										value: J(r, i),
-										disabled: n.disabled,
-										"aria-disabled": n.disabled || void 0,
-										as: n.href ? "a" : "div",
-										href: n.href,
-										class: _($("item")),
-										onSelect: (e) => Y(n)
+									}, 1032, ["class"])) : f("", !0), (S(!0), p(l, null, w(n.items, (i, a) => (S(), d(D(N), {
+										key: J(r, a),
+										value: J(r, a),
+										disabled: i.disabled,
+										"aria-disabled": i.disabled || void 0,
+										as: i.href ? "a" : "div",
+										href: i.href,
+										class: y($("item")),
+										onSelect: (e) => le(i, n.sources[a] ?? n.label)
 									}, {
-										default: O(() => [C(e.$slots, "item", { item: n }, () => [
-											n.icon ? (b(), d("span", {
+										default: A(() => [T(e.$slots, "item", { item: i }, () => [
+											i.icon ? (S(), p("span", {
 												key: 0,
-												class: _($("itemIcon"))
-											}, [m(t, { icon: n.icon }, null, 8, ["icon"])], 2)) : u("", !0),
-											f("span", { class: _($("itemLabel")) }, w(n.label), 3),
-											n.shortcut ? (b(), l(o, {
+												class: y($("itemIcon"))
+											}, [g(t, { icon: i.icon }, null, 8, ["icon"])], 2)) : f("", !0),
+											m("span", { class: y($("itemLabel")) }, E(i.label), 3),
+											i.shortcut ? (S(), d(c, {
 												key: 1,
-												keys: ie(n.shortcut),
-												class: _($("shortcut")),
-												ui: { key: B.ui?.key }
+												keys: ue(i.shortcut),
+												class: y($("shortcut")),
+												ui: { key: L.ui?.key }
 											}, null, 8, [
 												"keys",
 												"class",
 												"ui"
-											])) : u("", !0)
+											])) : f("", !0)
 										])]),
 										_: 2
 									}, 1032, [
@@ -161,23 +198,23 @@ var B = /*@__PURE__*/ h({
 							}, 8, ["class"])]),
 							_: 3
 						}, 8, ["class"]),
-						B.footer ? (b(), d("div", {
+						L.footer ? (S(), p("div", {
 							key: 0,
-							class: _($("footer"))
-						}, [C(e.$slots, "footer", {}, () => [
-							f("span", null, [m(o, {
+							class: y($("footer"))
+						}, [T(e.$slots, "footer", {}, () => [
+							m("span", null, [g(c, {
 								keys: ["up", "down"],
-								ui: { key: B.ui?.key }
-							}, null, 8, ["ui"]), n[2] ||= p(" to navigate", -1)]),
-							f("span", null, [m(o, {
+								ui: { key: L.ui?.key }
+							}, null, 8, ["ui"]), n[2] ||= h(" to navigate", -1)]),
+							m("span", null, [g(c, {
 								keys: "enter",
-								ui: { key: B.ui?.key }
-							}, null, 8, ["ui"]), n[3] ||= p(" to select", -1)]),
-							f("span", null, [m(o, {
+								ui: { key: L.ui?.key }
+							}, null, 8, ["ui"]), n[3] ||= h(" to select", -1)]),
+							m("span", null, [g(c, {
 								keys: "escape",
-								ui: { key: B.ui?.key }
-							}, null, 8, ["ui"]), n[4] ||= p(" to close", -1)])
-						])], 2)) : u("", !0)
+								ui: { key: L.ui?.key }
+							}, null, 8, ["ui"]), n[4] ||= h(" to close", -1)])
+						])], 2)) : f("", !0)
 					]),
 					_: 3
 				}, 8, ["class", "aria-label"])]),
@@ -188,4 +225,4 @@ var B = /*@__PURE__*/ h({
 	}
 });
 //#endregion
-export { B as default };
+export { L as default };

package/dist/components/ConfirmPopover.vue.d.ts

@@ -48,10 +48,10 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
 }>, {
     unstyled: boolean;
     side: "top" | "right" | "bottom" | "left";
+    arrow: boolean;
     sideOffset: number;
     confirmLabel: string;
     cancelLabel: string;
-    arrow: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;