@poveste/controls 0.17.0 → 0.17.2

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

@@ -2,7 +2,7 @@ import type { Awaitable } from '@poveste/shared';
 declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: import("vue").DefineComponent<{
-    content: string | (() => Awaitable<string>);
+    content: string | undefined | (() => Awaitable<string | undefined>);
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    content: string | (() => Awaitable<string>);
+    content: string | undefined | (() => Awaitable<string | undefined>);
 }> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/index.d.ts

@@ -402,9 +402,9 @@ export declare const HstTokenGrid: {
     };
 });
 export declare const HstCopyIcon: import("vue").DefineComponent<{
-    content: string | (() => import("@poveste/shared").Awaitable<string>);
+    content: string | undefined | (() => import("@poveste/shared").Awaitable<string | undefined>);
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-    content: string | (() => import("@poveste/shared").Awaitable<string>);
+    content: string | undefined | (() => import("@poveste/shared").Awaitable<string | undefined>);
 }> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 /**
  * Public because `@poveste/app` uses it too: one wrapper for the whole chrome
@@ -1285,9 +1285,9 @@ export declare const components: {
         };
     });
     HstCopyIcon: import("vue").DefineComponent<{
-        content: string | (() => import("@poveste/shared").Awaitable<string>);
+        content: string | undefined | (() => import("@poveste/shared").Awaitable<string | undefined>);
     }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
-        content: string | (() => import("@poveste/shared").Awaitable<string>);
+        content: string | undefined | (() => import("@poveste/shared").Awaitable<string | undefined>);
     }> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
     HstColorSelect: {
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<{

package/dist/index.es.js

@@ -3,10 +3,10 @@ import { a as p, i as m, n as h, o as g, r as _, s as v, t as y } from "./Popove
 import { n as ee, r as b, t as x } from "./VisuallyHiddenInput-0it-_FH2.es.js";
 import { t as te } from "./useKbd-DQM4Oqri.es.js";
 import { Fragment as S, computed as C, createBlock as w, createCommentVNode as T, createElementBlock as E, createElementVNode as D, createTextVNode as O, createVNode as k, defineAsyncComponent as A, defineComponent as j, getCurrentInstance as ne, guardReactiveProps as M, mergeProps as N, nextTick as P, normalizeClass as F, normalizeProps as I, normalizeStyle as L, onBeforeMount as re, onMounted as ie, onUnmounted as R, openBlock as z, ref as B, renderList as V, renderSlot as H, resolveDynamicComponent as U, shallowRef as ae, toDisplayString as W, toRefs as G, unref as K, useAttrs as oe, vModelText as se, watch as ce, withCtx as q, withDirectives as J, withKeys as Y, withMemo as le, withModifiers as X } from "@poveste/vendors/vue";
-import { createEventHook as ue, useClipboard as de, useEventListener as fe, useLiveAnnouncer as pe, useVModel as Z } from "@poveste/vendors/vue-use";
-import { Icon as me } from "@poveste/vendors/iconify";
+import { createEventHook as ue, useClipboard as de, useEventListener as fe, useLiveAnnouncer as pe, useTimeoutFn as me, useVModel as Z } from "@poveste/vendors/vue-use";
+import { Icon as he } from "@poveste/vendors/iconify";
 //#region src/components/button/HstButton.vue?vue&type=script&setup=true&lang.ts
-var he = ["data-color"], ge = /* @__PURE__ */ j({
+var ge = ["data-color"], _e = /* @__PURE__ */ j({
 	name: "HstButton",
 	props: { color: {} },
 	setup(e) {
@@ -14,15 +14,15 @@ var he = ["data-color"], ge = /* @__PURE__ */ j({
 			class: "poveste-button",
 			"data-slot": "button",
 			"data-color": e.color ?? "default"
-		}, [H(t.$slots, "default")], 8, he));
+		}, [H(t.$slots, "default")], 8, ge));
 	}
 });
 //#endregion
 //#region ../../node_modules/.pnpm/ohash@2.0.11/node_modules/ohash/dist/shared/ohash.D__AXeF1.mjs
-function _e(e) {
-	return typeof e == "string" ? `'${e}'` : new ve().serialize(e);
+function ve(e) {
+	return typeof e == "string" ? `'${e}'` : new ye().serialize(e);
 }
-var ve = /*@__PURE__*/ function() {
+var ye = /*@__PURE__*/ function() {
 	class e {
 		#e = /* @__PURE__ */ new Map();
 		compare(e, t) {
@@ -120,11 +120,11 @@ var ve = /*@__PURE__*/ function() {
 	return e;
 }();
 function Q(e, t) {
-	return e === t || _e(e) === _e(t);
+	return e === t || ve(e) === ve(t);
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/arrays.js
-function ye(e, t, n) {
+function be(e, t, n) {
 	let r = e.findIndex((e) => Q(e, t)), i = e.findIndex((e) => Q(e, n));
 	if (r === -1 || i === -1) return [];
 	let [a, o] = [r, i].sort((e, t) => e - t);
@@ -132,18 +132,18 @@ function ye(e, t, n) {
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/isValueEqualOrExist.js
-function be(e, n) {
+function xe(e, n) {
 	return t(e) ? !1 : Array.isArray(e) ? e.some((e) => Q(e, n)) : Q(e, n);
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/useForwardScopeId.js
-function xe() {
+function Se() {
 	let e = ne()?.vnode?.scopeId;
 	return e ? { [e]: "" } : {};
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/useTypeahead.js
-function Se(t) {
+function Ce(t) {
 	let n = e("", 1e3);
 	return {
 		search: n,
@@ -153,7 +153,7 @@ function Se(t) {
 				let e = v(), t = r.map((e) => ({
 					...e,
 					textValue: e.value?.textValue ?? e.ref.textContent?.trim() ?? ""
-				})), i = t.find((t) => t.ref === e), a = we(t.map((e) => e.textValue), n.value, i?.textValue), o = t.find((e) => e.textValue === a);
+				})), i = t.find((t) => t.ref === e), a = Te(t.map((e) => e.textValue), n.value, i?.textValue), o = t.find((e) => e.textValue === a);
 				return o && o.ref.focus(), o?.ref;
 			}
 		},
@@ -162,34 +162,34 @@ function Se(t) {
 		}
 	};
 }
-function Ce(e, t) {
+function we(e, t) {
 	return e.map((n, r) => e[(t + r) % e.length]);
 }
-function we(e, t, n) {
-	let r = t.length > 1 && Array.from(t).every((e) => e === t[0]) ? t[0] : t, i = n ? e.indexOf(n) : -1, a = Ce(e, Math.max(i, 0));
+function Te(e, t, n) {
+	let r = t.length > 1 && Array.from(t).every((e) => e === t[0]) ? t[0] : t, i = n ? e.indexOf(n) : -1, a = we(e, Math.max(i, 0));
 	r.length === 1 && (a = a.filter((e) => e !== n));
 	let o = a.find((e) => e.toLowerCase().startsWith(r.toLowerCase()));
 	return o === n ? void 0 : o;
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/shared/useSingleOrMultipleValue.js
-function Te({ type: e, defaultValue: t, modelValue: n }) {
+function Ee({ type: e, defaultValue: t, modelValue: n }) {
 	let r = n || t;
 	return n !== void 0 || t !== void 0 ? Array.isArray(r) ? "multiple" : "single" : e ?? "single";
 }
-function Ee({ type: e, defaultValue: t, modelValue: n }) {
-	return e || Te({
+function De({ type: e, defaultValue: t, modelValue: n }) {
+	return e || Ee({
 		type: e,
 		defaultValue: t,
 		modelValue: n
 	});
 }
-function De({ type: e, defaultValue: t }) {
+function Oe({ type: e, defaultValue: t }) {
 	return t === void 0 ? e === "single" ? void 0 : [] : t;
 }
-function Oe(e, t) {
-	let n = C(() => Ee(e)), r = Z(e, "modelValue", t, {
-		defaultValue: De(e),
+function ke(e, t) {
+	let n = C(() => De(e)), r = Z(e, "modelValue", t, {
+		defaultValue: Oe(e),
 		passive: e.modelValue === void 0,
 		deep: !0
 	});
@@ -197,7 +197,7 @@ function Oe(e, t) {
 		if (n.value === "single") r.value = Q(e, r.value) ? void 0 : e;
 		else {
 			let t = Array.isArray(r.value) ? [...r.value || []] : [r.value].filter(Boolean);
-			if (be(t, e)) {
+			if (xe(t, e)) {
 				let n = t.findIndex((t) => Q(t, e));
 				t.splice(n, 1);
 			} else t.push(e);
@@ -212,18 +212,18 @@ function Oe(e, t) {
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/Listbox/utils.js
-function ke(e, t, n) {
-	return e === void 0 ? !1 : Array.isArray(e) ? e.some((e) => Ae(e, t, n)) : Ae(e, t, n);
-}
 function Ae(e, t, n) {
+	return e === void 0 ? !1 : Array.isArray(e) ? e.some((e) => je(e, t, n)) : je(e, t, n);
+}
+function je(e, t, n) {
 	return e === void 0 || t === void 0 ? !1 : typeof e == "string" ? e === t : typeof n == "function" ? n(e, t) : typeof n == "string" ? e?.[n] === t?.[n] : Q(e, t);
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/RovingFocus/utils.js
-var je = "rovingFocusGroup.onEntryFocus", Me = {
+var Me = "rovingFocusGroup.onEntryFocus", Ne = {
 	bubbles: !1,
 	cancelable: !0
-}, Ne = {
+}, Pe = {
 	ArrowLeft: "prev",
 	ArrowUp: "prev",
 	ArrowRight: "next",
@@ -233,23 +233,23 @@ var je = "rovingFocusGroup.onEntryFocus", Me = {
 	PageDown: "last",
 	End: "last"
 };
-function Pe(e, t) {
+function Fe(e, t) {
 	return t === "rtl" ? e === "ArrowLeft" ? "ArrowRight" : e === "ArrowRight" ? "ArrowLeft" : e : e;
 }
-function Fe(e, t, n) {
-	let r = Pe(e.key, n);
-	if (!(t === "vertical" && ["ArrowLeft", "ArrowRight"].includes(r)) && !(t === "horizontal" && ["ArrowUp", "ArrowDown"].includes(r))) return Ne[r];
+function Ie(e, t, n) {
+	let r = Fe(e.key, n);
+	if (!(t === "vertical" && ["ArrowLeft", "ArrowRight"].includes(r)) && !(t === "horizontal" && ["ArrowUp", "ArrowDown"].includes(r))) return Pe[r];
 }
-function Ie(e, t = !1) {
+function Le(e, t = !1) {
 	let n = v();
 	for (let r of e) if (r === n || (r.focus({ preventScroll: t }), v() !== n)) return;
 }
-function Le(e, t) {
+function Re(e, t) {
 	return e.map((n, r) => e[(t + r) % e.length]);
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/Listbox/ListboxRoot.js
-var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("ListboxHighlightScroll"), He = /* @__PURE__ */ j({
+var [ze, Be] = /*#__PURE__*/ o("ListboxRoot"), [Ve, He] = /*#__PURE__*/ o("ListboxHighlightScroll"), Ue = /* @__PURE__ */ j({
 	__name: "ListboxRoot",
 	props: {
 		modelValue: {
@@ -314,8 +314,8 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 		"leave"
 	],
 	setup(e, { expose: t, emit: n }) {
-		let r = e, i = n, { multiple: o, highlightOnHover: s, orientation: c, disabled: l, selectionBehavior: u, dir: p } = G(r), { getItems: m, getItem: h } = ee({ isProvider: !0 }), { handleTypeaheadSearch: _ } = Se(), { primitiveElement: v, currentElement: y } = g(), S = te(), C = f(p), E = Be(null);
-		Ve({
+		let r = e, i = n, { multiple: o, highlightOnHover: s, orientation: c, disabled: l, selectionBehavior: u, dir: p } = G(r), { getItems: m, getItem: h } = ee({ isProvider: !0 }), { handleTypeaheadSearch: _ } = Ce(), { primitiveElement: v, currentElement: y } = g(), S = te(), C = f(p), E = Ve(null);
+		He({
 			suppressHighlightScroll: B(!1),
 			onHighlightScrollRequest: () => {}
 		});
@@ -326,9 +326,9 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 		});
 		function ne(e) {
 			if (k.value = !0, r.multiple) {
-				let t = Array.isArray(j.value) ? [...j.value] : [], n = t.findIndex((t) => Ae(t, e, r.by));
+				let t = Array.isArray(j.value) ? [...j.value] : [], n = t.findIndex((t) => je(t, e, r.by));
 				r.selectionBehavior === "toggle" ? (n === -1 ? t.push(e) : t.splice(n, 1), j.value = t) : (j.value = [e], O.value = e);
-			} else r.selectionBehavior === "toggle" && Ae(j.value, e, r.by) ? j.value = void 0 : j.value = e;
+			} else r.selectionBehavior === "toggle" && je(j.value, e, r.by) ? j.value = void 0 : j.value = e;
 			setTimeout(() => {
 				k.value = !1;
 			}, 1);
@@ -351,7 +351,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 		function U(e) {
 			if (F.value) ie.trigger(e);
 			else {
-				let t = m().find((t) => Ae(t.value, e, r.by));
+				let t = m().find((t) => je(t.value, e, r.by));
 				t && (M.value = t.ref, V(t.ref));
 			}
 		}
@@ -412,7 +412,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			}
 		}
 		function X(e) {
-			let t = Fe(e, c.value, C.value);
+			let t = Ie(e, c.value, C.value);
 			if (!t) return;
 			let n = R();
 			if (M.value) {
@@ -434,7 +434,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			if (!F.value && r.selectionBehavior === "replace" && o.value && Array.isArray(j.value) && (!e.altKey && !e.ctrlKey && !e.metaKey || e.shiftKey) && e.shiftKey) {
 				let n = m().filter((e) => e.ref.dataset.disabled !== ""), r = n.find((e) => e.ref === t)?.value;
 				if (e.key === S.END ? r = n.at(-1)?.value : e.key === S.HOME && (r = n[0]?.value), !r || !O.value) return;
-				let i = ye(n.map((e) => e.value), O.value, r);
+				let i = be(n.map((e) => e.value), O.value, r);
 				j.value = i;
 			}
 		}
@@ -467,7 +467,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			highlightFirstItem: J,
 			highlightSelected: fe,
 			getItems: m
-		}), ze({
+		}), Be({
 			modelValue: j,
 			onValueChange: ne,
 			multiple: o,
@@ -526,7 +526,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			"data-disabled"
 		]));
 	}
-}), Ue = /* @__PURE__ */ j({
+}), We = /* @__PURE__ */ j({
 	__name: "ListboxContent",
 	props: {
 		asChild: {
@@ -539,7 +539,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 		}
 	},
 	setup(t) {
-		let { CollectionSlot: n } = ee(), r = Re(), i = e(!1, 10);
+		let { CollectionSlot: n } = ee(), r = ze(), i = e(!1, 10);
 		return (e, t) => (z(), w(K(n), null, {
 			default: q(() => [k(K(d), {
 				role: "listbox",
@@ -582,7 +582,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			_: 3
 		}));
 	}
-}), We = "listbox.select", [Ge, Ke] = /*#__PURE__*/ o("ListboxItem"), qe = /* @__PURE__ */ j({
+}), Ge = "listbox.select", [Ke, qe] = /*#__PURE__*/ o("ListboxItem"), Je = /* @__PURE__ */ j({
 	__name: "ListboxItem",
 	props: {
 		value: {
@@ -605,7 +605,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 	},
 	emits: ["select"],
 	setup(e, { emit: t }) {
-		let i = e, a = t, o = s(void 0, "reka-listbox-item"), { CollectionItem: c } = ee(), { forwardRef: l, currentElement: u } = r(), f = Re(), p = C(() => u.value != null && u.value === f.highlightedElement.value), m = C(() => ke(f.modelValue.value, i.value, f.by)), h = C(() => f.disabled.value || i.disabled);
+		let i = e, a = t, o = s(void 0, "reka-listbox-item"), { CollectionItem: c } = ee(), { forwardRef: l, currentElement: u } = r(), f = ze(), p = C(() => u.value != null && u.value === f.highlightedElement.value), m = C(() => Ae(f.modelValue.value, i.value, f.by)), h = C(() => f.disabled.value || i.disabled);
 		async function g(e) {
 			a("select", e), !e?.defaultPrevented && !h.value && e && (f.onValueChange(i.value), f.changeHighlight(u.value));
 		}
@@ -614,9 +614,9 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 				originalEvent: e,
 				value: i.value
 			};
-			n(We, g, t);
+			n(Ge, g, t);
 		}
-		return Ke({ isSelected: m }), (e, t) => (z(), w(K(c), { value: e.value }, {
+		return qe({ isSelected: m }), (e, t) => (z(), w(K(c), { value: e.value }, {
 			default: q(() => [le([
 				p.value,
 				m.value,
@@ -657,7 +657,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			_: 3
 		}, 8, ["value"]));
 	}
-}), [Je, Ye] = /*#__PURE__*/ o("RovingFocusGroup"), Xe = /* @__PURE__ */ j({
+}), [Ye, Xe] = /*#__PURE__*/ o("RovingFocusGroup"), Ze = /* @__PURE__ */ j({
 	__name: "RovingFocusGroup",
 	props: {
 		orientation: {
@@ -705,10 +705,10 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 		function _(e) {
 			let t = !p.value;
 			if (e.currentTarget && e.target === e.currentTarget && t && !u.value) {
-				let t = new CustomEvent(je, Me);
+				let t = new CustomEvent(Me, Ne);
 				if (e.currentTarget.dispatchEvent(t), i("entryFocus", t), !t.defaultPrevented) {
 					let e = h().map((e) => e.ref).filter((e) => e.dataset.disabled !== "");
-					Ie([
+					Le([
 						e.find((e) => e.getAttribute("data-active") === ""),
 						e.find((e) => e.getAttribute("data-highlighted") === ""),
 						e.find((e) => e.id === l.value),
@@ -723,7 +723,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 				p.value = !1;
 			}, 1);
 		}
-		return t({ getItems: h }), Ye({
+		return t({ getItems: h }), Xe({
 			loop: a,
 			dir: c,
 			orientation: o,
@@ -765,7 +765,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			_: 3
 		}));
 	}
-}), Ze = /* @__PURE__ */ j({
+}), Qe = /* @__PURE__ */ j({
 	__name: "RovingFocusItem",
 	props: {
 		tabStopId: {
@@ -796,7 +796,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 		}
 	},
 	setup(e) {
-		let t = e, n = Je(), r = s(), i = C(() => t.tabStopId || r), a = C(() => n.currentTabStopId.value === i.value), { getItems: o, CollectionItem: c } = ee();
+		let t = e, n = Ye(), r = s(), i = C(() => t.tabStopId || r), a = C(() => n.currentTabStopId.value === i.value), { getItems: o, CollectionItem: c } = ee();
 		ie(() => {
 			t.focusable && n.onFocusableItemAdd();
 		}), R(() => {
@@ -810,7 +810,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 				return;
 			}
 			if (e.target !== e.currentTarget) return;
-			let r = Fe(e, n.orientation.value, n.dir.value);
+			let r = Ie(e, n.orientation.value, n.dir.value);
 			if (r !== void 0) {
 				if (e.metaKey || e.ctrlKey || e.altKey || !t.allowShiftKey && e.shiftKey) return;
 				e.preventDefault();
@@ -819,9 +819,9 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 				else if (r === "prev" || r === "next") {
 					r === "prev" && i.reverse();
 					let t = i.indexOf(e.currentTarget);
-					i = n.loop.value ? Le(i, t + 1) : i.slice(t + 1);
+					i = n.loop.value ? Re(i, t + 1) : i.slice(t + 1);
 				}
-				P(() => Ie(i));
+				P(() => Le(i));
 			}
 		}
 		return (e, t) => (z(), w(K(c), null, {
@@ -851,7 +851,7 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			_: 3
 		}));
 	}
-}), [Qe, $e] = /*#__PURE__*/ o("CheckboxGroupRoot"), et = /* @__PURE__ */ j({
+}), [$e, et] = /*#__PURE__*/ o("CheckboxGroupRoot"), tt = /* @__PURE__ */ j({
 	__name: "CheckboxGroupRoot",
 	props: {
 		defaultValue: {
@@ -910,11 +910,11 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 			dir: s.value,
 			orientation: n.orientation
 		} : {});
-		return $e({
+		return et({
 			modelValue: p,
 			rovingFocus: a,
 			disabled: i
-		}), (e, t) => (z(), w(U(K(a) ? K(Xe) : K(d)), N({
+		}), (e, t) => (z(), w(U(K(a) ? K(Ze) : K(d)), N({
 			ref_key: "primitiveElement",
 			ref: c,
 			as: e.as,
@@ -936,15 +936,15 @@ var [Re, ze] = /*#__PURE__*/ o("ListboxRoot"), [Be, Ve] = /*#__PURE__*/ o("Listb
 });
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/utils.js
-function tt(e) {
+function nt(e) {
 	return e === "indeterminate";
 }
-function nt(e) {
-	return tt(e) ? "indeterminate" : e ? "checked" : "unchecked";
+function rt(e) {
+	return nt(e) ? "indeterminate" : e ? "checked" : "unchecked";
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/Checkbox/CheckboxRoot.js
-var [rt, it] = /*#__PURE__*/ o("CheckboxRoot"), at = /* @__PURE__ */ j({
+var [it, at] = /*#__PURE__*/ o("CheckboxRoot"), ot = /* @__PURE__ */ j({
 	inheritAttrs: !1,
 	__name: "CheckboxRoot",
 	props: {
@@ -1000,28 +1000,28 @@ var [rt, it] = /*#__PURE__*/ o("CheckboxRoot"), at = /* @__PURE__ */ j({
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: n }) {
-		let i = e, a = n, { forwardRef: o, currentElement: s } = r(), c = Qe(null), l = Z(i, "modelValue", a, {
+		let i = e, a = n, { forwardRef: o, currentElement: s } = r(), c = $e(null), l = Z(i, "modelValue", a, {
 			defaultValue: i.defaultValue ?? i.falseValue,
 			passive: i.modelValue === void 0
-		}), u = C(() => c?.disabled.value || i.disabled), f = C(() => Q(l.value, i.trueValue)), p = C(() => t(c?.modelValue.value) ? l.value === "indeterminate" ? "indeterminate" : f.value : be(c.modelValue.value, i.value));
+		}), u = C(() => c?.disabled.value || i.disabled), f = C(() => Q(l.value, i.trueValue)), p = C(() => t(c?.modelValue.value) ? l.value === "indeterminate" ? "indeterminate" : f.value : xe(c.modelValue.value, i.value));
 		function m() {
 			if (t(c?.modelValue.value)) l.value === "indeterminate" ? l.value = i.trueValue : l.value = f.value ? i.falseValue : i.trueValue;
 			else {
 				let e = [...c.modelValue.value || []];
-				if (be(e, i.value)) {
+				if (xe(e, i.value)) {
 					let t = e.findIndex((e) => Q(e, i.value));
 					e.splice(t, 1);
 				} else e.push(i.value);
 				c.modelValue.value = e;
 			}
 		}
-		let h = b(s), g = xe(), _ = oe(), v = C(() => {
+		let h = b(s), g = Se(), _ = oe(), v = C(() => {
 			if (!_["aria-label"]) return i.id && s.value ? document.querySelector(`[for="${i.id}"]`)?.innerText : void 0;
 		});
-		return it({
+		return at({
 			disabled: u,
 			state: p
-		}), (e, t) => (z(), E(S, null, [(z(), w(U(K(c)?.rovingFocus.value ? K(Ze) : K(d)), N({
+		}), (e, t) => (z(), E(S, null, [(z(), w(U(K(c)?.rovingFocus.value ? K(Qe) : K(d)), N({
 			...e.$attrs,
 			...K(g)
 		}, {
@@ -1031,10 +1031,10 @@ var [rt, it] = /*#__PURE__*/ o("CheckboxRoot"), at = /* @__PURE__ */ j({
 			"as-child": e.asChild,
 			as: e.as,
 			type: e.as === "button" ? "button" : void 0,
-			"aria-checked": K(tt)(p.value) ? "mixed" : p.value,
+			"aria-checked": K(nt)(p.value) ? "mixed" : p.value,
 			"aria-required": e.required,
 			"aria-label": e.$attrs["aria-label"] || v.value,
-			"data-state": K(nt)(p.value),
+			"data-state": K(rt)(p.value),
 			"data-disabled": u.value ? "" : void 0,
 			disabled: u.value,
 			focusable: K(c)?.rovingFocus.value ? !u.value : void 0,
@@ -1075,7 +1075,7 @@ var [rt, it] = /*#__PURE__*/ o("CheckboxRoot"), at = /* @__PURE__ */ j({
 			"required"
 		])) : T("v-if", !0)], 64));
 	}
-}), ot = /* @__PURE__ */ j({
+}), st = /* @__PURE__ */ j({
 	__name: "PopoverAnchor",
 	props: {
 		reference: {
@@ -1104,7 +1104,7 @@ var [rt, it] = /*#__PURE__*/ o("CheckboxRoot"), at = /* @__PURE__ */ j({
 			_: 3
 		}, 16));
 	}
-}), st = /* @__PURE__ */ j({
+}), ct = /* @__PURE__ */ j({
 	__name: "Label",
 	props: {
 		for: {
@@ -1130,16 +1130,16 @@ var [rt, it] = /*#__PURE__*/ o("CheckboxRoot"), at = /* @__PURE__ */ j({
 			_: 3
 		}, 16));
 	}
-}), ct = "radio.select";
-function lt(e, t, r) {
-	n(ct, r, {
+}), lt = "radio.select";
+function ut(e, t, r) {
+	n(lt, r, {
 		originalEvent: e,
 		value: t
 	});
 }
 //#endregion
 //#region ../../node_modules/.pnpm/reka-ui@2.10.5_vue@3.5.43_typescript@6.0.3_/node_modules/reka-ui/dist/RadioGroup/Radio.js
-var ut = /* @__PURE__ */ j({
+var dt = /* @__PURE__ */ j({
 	inheritAttrs: !1,
 	__name: "Radio",
 	props: {
@@ -1181,9 +1181,9 @@ var ut = /* @__PURE__ */ j({
 	},
 	emits: ["update:checked", "select"],
 	setup(e, { emit: t }) {
-		let n = e, i = t, a = Z(n, "checked", i, { passive: n.checked === void 0 }), { value: o } = G(n), { forwardRef: s, currentElement: c } = r(), l = b(c), u = xe(), f = C(() => n.id && c.value ? document.querySelector(`[for="${n.id}"]`)?.innerText : void 0);
+		let n = e, i = t, a = Z(n, "checked", i, { passive: n.checked === void 0 }), { value: o } = G(n), { forwardRef: s, currentElement: c } = r(), l = b(c), u = Se(), f = C(() => n.id && c.value ? document.querySelector(`[for="${n.id}"]`)?.innerText : void 0);
 		function p(e) {
-			n.disabled || lt(e, n.value, (e) => {
+			n.disabled || ut(e, n.value, (e) => {
 				i("select", e), !e?.defaultPrevented && (a.value = !0, l.value && e.stopPropagation());
 			});
 		}
@@ -1238,7 +1238,7 @@ var ut = /* @__PURE__ */ j({
 			"required"
 		])) : T("v-if", !0)], 64));
 	}
-}), [dt, ft] = /*#__PURE__*/ o("RadioGroupRoot"), pt = /* @__PURE__ */ j({
+}), [ft, pt] = /*#__PURE__*/ o("RadioGroupRoot"), mt = /* @__PURE__ */ j({
 	__name: "RadioGroupRoot",
 	props: {
 		modelValue: {
@@ -1292,7 +1292,7 @@ var ut = /* @__PURE__ */ j({
 			defaultValue: n.defaultValue,
 			passive: n.modelValue === void 0
 		}), { disabled: c, loop: l, orientation: u, name: p, required: m, dir: h } = G(n), g = f(h), _ = b(o);
-		return ft({
+		return pt({
 			modelValue: s,
 			changeModelValue: (e) => {
 				s.value = e;
@@ -1302,7 +1302,7 @@ var ut = /* @__PURE__ */ j({
 			orientation: u,
 			name: p?.value,
 			required: m
-		}), (e, t) => (z(), w(K(Xe), {
+		}), (e, t) => (z(), w(K(Ze), {
 			"as-child": "",
 			orientation: K(u),
 			dir: K(g),
@@ -1346,7 +1346,7 @@ var ut = /* @__PURE__ */ j({
 			"loop"
 		]));
 	}
-}), [mt, ht] = /*#__PURE__*/ o("RadioGroupItem"), gt = /* @__PURE__ */ j({
+}), [ht, gt] = /*#__PURE__*/ o("RadioGroupItem"), _t = /* @__PURE__ */ j({
 	inheritAttrs: !1,
 	__name: "RadioGroupItem",
 	props: {
@@ -1383,8 +1383,8 @@ var ut = /* @__PURE__ */ j({
 	},
 	emits: ["select"],
 	setup(e, { emit: t }) {
-		let n = e, i = t, { forwardRef: a, currentElement: o } = r(), s = dt(), c = C(() => s.disabled.value || n.disabled), l = C(() => s.required.value || n.required), u = C(() => Q(s.modelValue?.value, n.value));
-		ht({
+		let n = e, i = t, { forwardRef: a, currentElement: o } = r(), s = ft(), c = C(() => s.disabled.value || n.disabled), l = C(() => s.required.value || n.required), u = C(() => Q(s.modelValue?.value, n.value));
+		gt({
 			disabled: c,
 			checked: u
 		});
@@ -1404,15 +1404,15 @@ var ut = /* @__PURE__ */ j({
 				d.value && o.value?.click();
 			}, 0);
 		}
-		let m = xe();
-		return (e, t) => (z(), w(K(Ze), {
+		let m = Se();
+		return (e, t) => (z(), w(K(Qe), {
 			checked: u.value,
 			disabled: c.value,
 			"as-child": "",
 			focusable: !c.value,
 			active: u.value
 		}, {
-			default: q(() => [k(ut, N({
+			default: q(() => [k(dt, N({
 				...K(m),
 				...e.$attrs,
 				...n
@@ -1445,7 +1445,7 @@ var ut = /* @__PURE__ */ j({
 			"active"
 		]));
 	}
-}), [_t, vt] = /*#__PURE__*/ o("ToggleGroupRoot"), yt = /* @__PURE__ */ j({
+}), [vt, yt] = /*#__PURE__*/ o("ToggleGroupRoot"), bt = /* @__PURE__ */ j({
 	__name: "ToggleGroupRoot",
 	props: {
 		rovingFocus: {
@@ -1502,8 +1502,8 @@ var ut = /* @__PURE__ */ j({
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let n = e, i = t, { loop: a, rovingFocus: o, disabled: s, dir: c } = G(n), l = f(c), { forwardRef: u, currentElement: p } = r(), { modelValue: m, changeModelValue: h, isSingle: g } = Oe(n, i), _ = b(p);
-		return vt({
+		let n = e, i = t, { loop: a, rovingFocus: o, disabled: s, dir: c } = G(n), l = f(c), { forwardRef: u, currentElement: p } = r(), { modelValue: m, changeModelValue: h, isSingle: g } = ke(n, i), _ = b(p);
+		return yt({
 			isSingle: g,
 			modelValue: m,
 			changeModelValue: h,
@@ -1512,7 +1512,7 @@ var ut = /* @__PURE__ */ j({
 			loop: a,
 			rovingFocus: o,
 			disabled: s
-		}), (e, t) => (z(), w(U(K(o) ? K(Xe) : K(d)), {
+		}), (e, t) => (z(), w(U(K(o) ? K(Ze) : K(d)), {
 			"as-child": "",
 			orientation: K(o) ? e.orientation : void 0,
 			dir: K(l),
@@ -1543,7 +1543,7 @@ var ut = /* @__PURE__ */ j({
 			"loop"
 		]));
 	}
-}), bt = /* @__PURE__ */ j({
+}), xt = /* @__PURE__ */ j({
 	inheritAttrs: !1,
 	__name: "Toggle",
 	props: {
@@ -1581,7 +1581,7 @@ var ut = /* @__PURE__ */ j({
 	},
 	emits: ["update:modelValue"],
 	setup(e, { emit: t }) {
-		let n = e, i = t, { forwardRef: a, currentElement: o } = r(), s = xe(), c = _t(null), l = Z(n, "modelValue", i, {
+		let n = e, i = t, { forwardRef: a, currentElement: o } = r(), s = Se(), c = vt(null), l = Z(n, "modelValue", i, {
 			defaultValue: n.defaultValue,
 			passive: n.modelValue === void 0
 		});
@@ -1629,7 +1629,7 @@ var ut = /* @__PURE__ */ j({
 			"required"
 		])) : T("v-if", !0)], 64));
 	}
-}), xt = /* @__PURE__ */ j({
+}), St = /* @__PURE__ */ j({
 	__name: "ToggleGroupItem",
 	props: {
 		value: {
@@ -1651,12 +1651,12 @@ var ut = /* @__PURE__ */ j({
 		}
 	},
 	setup(e) {
-		let t = e, n = _t(), i = C(() => n.disabled?.value || t.disabled), a = C(() => be(n.modelValue.value, t.value)), { forwardRef: o } = r(), s = xe();
-		return (e, r) => (z(), w(U(K(n).rovingFocus.value ? K(Ze) : K(d)), N({ "as-child": "" }, K(n).rovingFocus.value ? {
+		let t = e, n = vt(), i = C(() => n.disabled?.value || t.disabled), a = C(() => xe(n.modelValue.value, t.value)), { forwardRef: o } = r(), s = Se();
+		return (e, r) => (z(), w(U(K(n).rovingFocus.value ? K(Qe) : K(d)), N({ "as-child": "" }, K(n).rovingFocus.value ? {
 			focusable: !i.value,
 			active: a.value
 		} : {}), {
-			default: q(() => [k(K(bt), N({
+			default: q(() => [k(K(xt), N({
 				...K(s),
 				...t
 			}, {
@@ -1671,7 +1671,7 @@ var ut = /* @__PURE__ */ j({
 			_: 3
 		}, 16));
 	}
-}), St = /* @__PURE__ */ j({
+}), Ct = /* @__PURE__ */ j({
 	name: "HstButtonGroup",
 	props: {
 		title: {},
@@ -1696,19 +1696,19 @@ var ut = /* @__PURE__ */ j({
 			class: "poveste-button-group"
 		}, {
 			actions: q(() => [H(t.$slots, "actions")]),
-			default: q(() => [k(K(yt), {
+			default: q(() => [k(K(bt), {
 				type: "single",
 				class: "poveste-button-group-options",
 				"data-slot": "options",
 				"model-value": e.modelValue ?? null,
 				"onUpdate:modelValue": a
 			}, {
-				default: q(() => [(z(!0), E(S, null, V(i.value, ({ label: e, value: t }) => (z(), w(K(xt), {
+				default: q(() => [(z(!0), E(S, null, V(i.value, ({ label: e, value: t }) => (z(), w(K(St), {
 					key: t,
 					"as-child": "",
 					value: t
 				}, {
-					default: q(() => [k(ge, {
+					default: q(() => [k(_e, {
 						class: "poveste-button-group-option",
 						"data-slot": "option"
 					}, {
@@ -1722,16 +1722,16 @@ var ut = /* @__PURE__ */ j({
 			_: 3
 		}, 8, ["title"]));
 	}
-}), Ct = {
+}), wt = {
 	class: "poveste-checkbox-visual",
 	"data-slot": "visual"
-}, wt = {
+}, Tt = {
 	width: "16",
 	height: "16",
 	viewBox: "0 0 24 24",
 	class: "poveste-checkbox-visual-check",
 	"data-slot": "visual-check"
-}, Tt = ["stroke-dasharray", "stroke-dashoffset"], Et = /* @__PURE__ */ j({
+}, Et = ["stroke-dasharray", "stroke-dashoffset"], Dt = /* @__PURE__ */ j({
 	name: "CheckboxVisual",
 	props: { modelValue: { type: Boolean } },
 	setup(e) {
@@ -1740,10 +1740,10 @@ var ut = /* @__PURE__ */ j({
 			o.value = !0;
 		}), ce(n, () => {
 			r.value = n.value?.getTotalLength?.() ?? 21.21;
-		}), (e, t) => (z(), E("span", Ct, [t[0] ||= D("span", {
+		}), (e, t) => (z(), E("span", wt, [t[0] ||= D("span", {
 			class: "poveste-checkbox-visual-box",
 			"data-slot": "visual-box"
-		}, null, -1), (z(), E("svg", wt, [D("path", {
+		}, null, -1), (z(), E("svg", Tt, [D("path", {
 			ref_key: "path",
 			ref: n,
 			d: "m 4 12 l 5 5 l 10 -10",
@@ -1751,9 +1751,9 @@ var ut = /* @__PURE__ */ j({
 			class: F(o.value ? "poveste-checkbox-visual-animated" : void 0),
 			"stroke-dasharray": r.value,
 			"stroke-dashoffset": a.value
-		}, null, 10, Tt)]))]));
+		}, null, 10, Et)]))]));
 	}
-}), Dt = ["data-checked"], Ot = /* @__PURE__ */ j({
+}), Ot = ["data-checked"], kt = /* @__PURE__ */ j({
 	name: "HstSimpleCheckbox",
 	props: {
 		modelValue: { type: Boolean },
@@ -1762,7 +1762,7 @@ var ut = /* @__PURE__ */ j({
 	emits: { "update:modelValue": (e) => !0 },
 	setup(e, { emit: t }) {
 		let n = t;
-		return (t, r) => e.withToggle ? (z(), w(K(at), {
+		return (t, r) => e.withToggle ? (z(), w(K(ot), {
 			key: 0,
 			"model-value": e.modelValue ?? !1,
 			class: "poveste-simple-checkbox poveste-simple-checkbox-interactive",
@@ -1770,16 +1770,16 @@ var ut = /* @__PURE__ */ j({
 			"data-checked": e.modelValue ? "" : void 0,
 			"onUpdate:modelValue": r[0] ||= (e) => n("update:modelValue", e === !0)
 		}, {
-			default: q(() => [k(Et, { "model-value": e.modelValue }, null, 8, ["model-value"])]),
+			default: q(() => [k(Dt, { "model-value": e.modelValue }, null, 8, ["model-value"])]),
 			_: 1
 		}, 8, ["model-value", "data-checked"])) : (z(), E("span", {
 			key: 1,
 			class: "poveste-simple-checkbox",
 			"data-slot": "box",
 			"data-checked": e.modelValue ? "" : void 0
-		}, [k(Et, { "model-value": e.modelValue }, null, 8, ["model-value"])], 8, Dt));
+		}, [k(Dt, { "model-value": e.modelValue }, null, 8, ["model-value"])], 8, Ot));
 	}
-}), kt = /* @__PURE__ */ j({
+}), At = /* @__PURE__ */ j({
 	name: "HstCheckbox",
 	props: {
 		modelValue: { type: [
@@ -1797,7 +1797,7 @@ var ut = /* @__PURE__ */ j({
 			title: e.title
 		}, {
 			actions: q(() => [H(t.$slots, "actions")]),
-			default: q(() => [k(K(at), {
+			default: q(() => [k(K(ot), {
 				"model-value": i.value ? String(a.value) : a.value,
 				"true-value": !i.value || "true",
 				"false-value": i.value ? "false" : !1,
@@ -1805,7 +1805,7 @@ var ut = /* @__PURE__ */ j({
 				"data-slot": "control",
 				"onUpdate:modelValue": n[0] ||= (e) => r("update:modelValue", e)
 			}, {
-				default: q(() => [k(Ot, { "model-value": a.value }, null, 8, ["model-value"])]),
+				default: q(() => [k(kt, { "model-value": a.value }, null, 8, ["model-value"])]),
 				_: 1
 			}, 8, [
 				"model-value",
@@ -1815,7 +1815,7 @@ var ut = /* @__PURE__ */ j({
 			_: 3
 		}, 8, ["title"]));
 	}
-}), At = /* @__PURE__ */ j({
+}), jt = /* @__PURE__ */ j({
 	name: "HstCheckboxList",
 	props: {
 		title: {},
@@ -1832,23 +1832,23 @@ var ut = /* @__PURE__ */ j({
 			style: L(t.$attrs.style)
 		}, {
 			actions: q(() => [H(t.$slots, "actions")]),
-			default: q(() => [k(K(et), {
+			default: q(() => [k(K(tt), {
 				"model-value": e.modelValue,
 				class: "poveste-checkbox-list-options",
 				"data-slot": "options",
 				"onUpdate:modelValue": n[0] ||= (e) => r("update:modelValue", e)
 			}, {
-				default: q(() => [(z(!0), E(S, null, V(i.value, (t, n) => (z(), w(K(st), {
+				default: q(() => [(z(!0), E(S, null, V(i.value, (t, n) => (z(), w(K(ct), {
 					key: n,
 					class: "poveste-checkbox-list-option",
 					"data-slot": "option"
 				}, {
-					default: q(() => [k(K(at), {
+					default: q(() => [k(K(ot), {
 						value: n,
 						class: "poveste-checkbox-list-box",
 						"data-slot": "control"
 					}, {
-						default: q(() => [k(Ot, { "model-value": e.modelValue.includes(n) }, null, 8, ["model-value"])]),
+						default: q(() => [k(kt, { "model-value": e.modelValue.includes(n) }, null, 8, ["model-value"])]),
 						_: 2
 					}, 1032, ["value"]), O(" " + W(t), 1)]),
 					_: 2
@@ -1862,7 +1862,7 @@ var ut = /* @__PURE__ */ j({
 			"style"
 		]));
 	}
-}), jt = { class: "flex flex-row gap-1" }, Mt = ["value"], Nt = /* @__PURE__ */ j({
+}), Mt = { class: "flex flex-row gap-1" }, Nt = ["value"], Pt = /* @__PURE__ */ j({
 	name: "HstColorSelect",
 	inheritAttrs: !1,
 	props: {
@@ -1901,7 +1901,7 @@ var ut = /* @__PURE__ */ j({
 			style: L(t.$attrs.style)
 		}, {
 			actions: q(() => [H(t.$slots, "actions")]),
-			default: q(() => [D("div", jt, [J(D("input", N({
+			default: q(() => [D("div", Mt, [J(D("input", N({
 				...t.$attrs,
 				class: null,
 				style: null
@@ -1913,7 +1913,7 @@ var ut = /* @__PURE__ */ j({
 				type: "color",
 				value: e.modelValue,
 				onInput: n[1] ||= ((e) => s(e.target.value))
-			}, null, 40, Mt)])]),
+			}, null, 40, Nt)])]),
 			_: 3
 		}, 8, [
 			"title",
@@ -1925,32 +1925,38 @@ var ut = /* @__PURE__ */ j({
 	name: "HstCopyIcon",
 	props: { content: { type: [String, Function] } },
 	setup(e) {
-		let t = e, { copy: n, copied: r } = de(), { polite: i } = pe();
-		async function a() {
+		let t = e, { copy: n, copied: r } = de(), { polite: i } = pe(), a = B(!1), { start: o } = me(() => {
+			a.value = !1;
+		}, 1500, { immediate: !1 });
+		async function s() {
 			let e = typeof t.content == "function" ? await t.content() : t.content;
-			await n(e), r.value && i("Copied");
+			if (!e) {
+				a.value = !0, o(), i("Nothing to copy");
+				return;
+			}
+			a.value = !1, await n(e), r.value && i("Copied");
 		}
 		return (e, t) => (z(), w(c, {
-			content: "Copied!",
-			open: K(r),
+			content: a.value ? "Nothing to copy" : "Copied!",
+			open: K(r) || a.value,
 			offset: 12
 		}, {
 			default: q(() => [D("button", {
 				type: "button",
 				"aria-label": "Copy",
 				class: "flex p-0 bg-transparent border-0 text-inherit opacity-50 hover:opacity-100 focus-visible:opacity-100 hover:text-primary-500 cursor-pointer",
-				onClick: t[0] ||= (e) => a()
-			}, [k(K(me), {
+				onClick: t[0] ||= (e) => s()
+			}, [k(K(he), {
 				icon: "carbon:copy-file",
 				class: "w-4 h-4"
 			})])]),
 			_: 1
-		}, 8, ["open"]));
+		}, 8, ["content", "open"]));
 	}
-}), Pt = {
+}), Ft = {
 	key: 0,
 	class: "poveste-color-shades grid gap-4 grid-cols-[repeat(auto-fill,minmax(200px,1fr))] m-4"
-}, Ft = ["onMouseenter"], It = { class: "flex gap-1" }, Lt = { class: "my-0 truncate shrink" }, Rt = { class: "flex gap-1" }, zt = { class: "my-0 opacity-50 truncate shrink" }, Bt = /* @__PURE__ */ j({
+}, It = ["onMouseenter"], Lt = { class: "flex gap-1" }, Rt = { class: "my-0 truncate shrink" }, zt = { class: "flex gap-1" }, Bt = { class: "my-0 opacity-50 truncate shrink" }, Vt = /* @__PURE__ */ j({
 	name: "HstColorShades",
 	props: {
 		shades: {},
@@ -1983,7 +1989,7 @@ var ut = /* @__PURE__ */ j({
 			}
 			return e;
 		}), a = B(null);
-		return (e, t) => i.value.length ? (z(), E("div", Pt, [(z(!0), E(S, null, V(i.value, (n) => (z(), E("div", {
+		return (e, t) => i.value.length ? (z(), E("div", Ft, [(z(!0), E(S, null, V(i.value, (n) => (z(), E("div", {
 			key: n.key,
 			class: "flex flex-col gap-2",
 			onMouseenter: (e) => a.value = n.key,
@@ -1991,23 +1997,23 @@ var ut = /* @__PURE__ */ j({
 		}, [H(e.$slots, "default", { color: n.color }, () => [D("div", {
 			class: "rounded-full w-16 h-16",
 			style: L({ backgroundColor: n.color })
-		}, null, 4)]), D("div", null, [D("div", It, [k(c, { content: n.name.length > 23 ? n.name : "" }, {
-			default: q(() => [D("pre", Lt, W(n.name), 1)]),
+		}, null, 4)]), D("div", null, [D("div", Lt, [k(c, { content: n.name.length > 23 ? n.name : "" }, {
+			default: q(() => [D("pre", Rt, W(n.name), 1)]),
 			_: 2
 		}, 1032, ["content"]), a.value === n.key ? (z(), w($, {
 			key: 0,
 			content: n.name,
 			class: "flex-none"
-		}, null, 8, ["content"])) : T("", !0)]), D("div", Rt, [k(c, { content: n.color.length > 23 ? n.color : "" }, {
-			default: q(() => [D("pre", zt, W(n.color), 1)]),
+		}, null, 8, ["content"])) : T("", !0)]), D("div", zt, [k(c, { content: n.color.length > 23 ? n.color : "" }, {
+			default: q(() => [D("pre", Bt, W(n.color), 1)]),
 			_: 2
 		}, 1032, ["content"]), a.value === n.key ? (z(), w($, {
 			key: 0,
 			content: n.color,
 			class: "flex-none"
-		}, null, 8, ["content"])) : T("", !0)])])], 40, Ft))), 128))])) : T("", !0);
+		}, null, 8, ["content"])) : T("", !0)])])], 40, It))), 128))])) : T("", !0);
 	}
-}), Vt = ["onMouseenter"], Ht = { class: "flex gap-1" }, Ut = { class: "my-0 truncate shrink" }, Wt = { class: "flex gap-1" }, Gt = { class: "my-0 opacity-50 truncate shrink" }, Kt = /* @__PURE__ */ j({
+}), Ht = ["onMouseenter"], Ut = { class: "flex gap-1" }, Wt = { class: "my-0 truncate shrink" }, Gt = { class: "flex gap-1" }, Kt = { class: "my-0 opacity-50 truncate shrink" }, qt = /* @__PURE__ */ j({
 	name: "HstTokenGrid",
 	props: {
 		tokens: {},
@@ -2034,23 +2040,23 @@ var ut = /* @__PURE__ */ j({
 			class: "flex flex-col gap-2",
 			onMouseenter: (e) => i.value = n.key,
 			onMouseleave: o[0] ||= (e) => i.value = null
-		}, [H(t.$slots, "default", { token: n }), D("div", null, [D("div", Ht, [k(c, { content: n.name.length > e.colSize / 8 ? n.name : "" }, {
-			default: q(() => [D("pre", Ut, W(n.name), 1)]),
+		}, [H(t.$slots, "default", { token: n }), D("div", null, [D("div", Ut, [k(c, { content: n.name.length > e.colSize / 8 ? n.name : "" }, {
+			default: q(() => [D("pre", Wt, W(n.name), 1)]),
 			_: 2
 		}, 1032, ["content"]), i.value === n.key ? (z(), w($, {
 			key: 0,
 			content: n.name,
 			class: "flex-none"
-		}, null, 8, ["content"])) : T("", !0)]), D("div", Wt, [k(c, { content: a(n.value, e.colSize / 8) }, {
-			default: q(() => [D("pre", Gt, W(n.value), 1)]),
+		}, null, 8, ["content"])) : T("", !0)]), D("div", Gt, [k(c, { content: a(n.value, e.colSize / 8) }, {
+			default: q(() => [D("pre", Kt, W(n.value), 1)]),
 			_: 2
 		}, 1032, ["content"]), i.value === n.key ? (z(), w($, {
 			key: 0,
 			content: typeof n.value == "string" ? n.value : JSON.stringify(n.value),
 			class: "flex-none"
-		}, null, 8, ["content"])) : T("", !0)])])], 40, Vt))), 128))], 4));
+		}, null, 8, ["content"])) : T("", !0)])])], 40, Ht))), 128))], 4));
 	}
-}), qt = ["onMouseenter"], Jt = { class: "mx-4" }, Yt = { class: "flex gap-1" }, Xt = { class: "my-0 truncate shrink" }, Zt = { class: "flex gap-1" }, Qt = { class: "my-0 opacity-50 truncate shrink" }, $t = /* @__PURE__ */ j({
+}), Jt = ["onMouseenter"], Yt = { class: "mx-4" }, Xt = { class: "flex gap-1" }, Zt = { class: "my-0 truncate shrink" }, Qt = { class: "flex gap-1" }, $t = { class: "my-0 opacity-50 truncate shrink" }, en = /* @__PURE__ */ j({
 	name: "HstTokenList",
 	props: {
 		tokens: {},
@@ -2070,17 +2076,17 @@ var ut = /* @__PURE__ */ j({
 			class: "poveste-token-list flex flex-col gap-2 my-8",
 			onMouseenter: (e) => r.value = n.key,
 			onMouseleave: t[0] ||= (e) => r.value = null
-		}, [H(e.$slots, "default", { token: n }), D("div", Jt, [D("div", Yt, [D("pre", Xt, W(n.name), 1), r.value === n.key ? (z(), w($, {
+		}, [H(e.$slots, "default", { token: n }), D("div", Yt, [D("div", Xt, [D("pre", Zt, W(n.name), 1), r.value === n.key ? (z(), w($, {
 			key: 0,
 			content: n.name,
 			class: "flex-none"
-		}, null, 8, ["content"])) : T("", !0)]), D("div", Zt, [D("pre", Qt, W(n.value), 1), r.value === n.key ? (z(), w($, {
+		}, null, 8, ["content"])) : T("", !0)]), D("div", Qt, [D("pre", $t, W(n.value), 1), r.value === n.key ? (z(), w($, {
 			key: 0,
 			content: typeof n.value == "string" ? n.value : JSON.stringify(n.value),
 			class: "flex-none"
-		}, null, 8, ["content"])) : T("", !0)])])], 40, qt))), 128));
+		}, null, 8, ["content"])) : T("", !0)])])], 40, Jt))), 128));
 	}
-}), en = /* @__PURE__ */ j({
+}), tn = /* @__PURE__ */ j({
 	name: "HstNumber",
 	inheritAttrs: !1,
 	props: {
@@ -2146,7 +2152,7 @@ var ut = /* @__PURE__ */ j({
 			"data-dragging"
 		]));
 	}
-}), tn = /* @__PURE__ */ j({
+}), nn = /* @__PURE__ */ j({
 	name: "HstRadio",
 	props: {
 		title: {},
@@ -2163,18 +2169,18 @@ var ut = /* @__PURE__ */ j({
 			style: L(t.$attrs.style)
 		}, {
 			actions: q(() => [H(t.$slots, "actions")]),
-			default: q(() => [k(K(pt), {
+			default: q(() => [k(K(mt), {
 				"model-value": e.modelValue ?? null,
 				class: "poveste-radio-options",
 				"data-slot": "options",
 				"onUpdate:modelValue": n[0] ||= (e) => r("update:modelValue", e)
 			}, {
-				default: q(() => [(z(!0), E(S, null, V(i.value, (e, t) => (z(), w(K(st), {
+				default: q(() => [(z(!0), E(S, null, V(i.value, (e, t) => (z(), w(K(ct), {
 					key: t,
 					class: "poveste-radio-option",
 					"data-slot": "option"
 				}, {
-					default: q(() => [k(K(gt), {
+					default: q(() => [k(K(_t), {
 						value: t,
 						class: "poveste-radio-box",
 						"data-slot": "control"
@@ -2196,14 +2202,14 @@ var ut = /* @__PURE__ */ j({
 			"style"
 		]));
 	}
-}), nn = {
+}), rn = {
 	type: "button",
 	class: "poveste-select-trigger",
 	"data-slot": "trigger"
-}, rn = {
+}, an = {
 	class: "poveste-select-label",
 	"data-slot": "value"
-}, an = /* @__PURE__ */ j({
+}, on = /* @__PURE__ */ j({
 	name: "CustomSelect",
 	props: {
 		modelValue: {},
@@ -2224,7 +2230,7 @@ var ut = /* @__PURE__ */ j({
 			"onUpdate:open": n[0] ||= (e) => i.value = e
 		}, {
 			default: q(() => [k(K(y), { "as-child": "" }, {
-				default: q(() => [D("button", nn, [D("span", rn, [H(t.$slots, "default", { label: s.value }, () => [O(W(s.value), 1)])]), k(K(me), {
+				default: q(() => [D("button", rn, [D("span", an, [H(t.$slots, "default", { label: s.value }, () => [O(W(s.value), 1)])]), k(K(he), {
 					icon: "carbon:chevron-sort",
 					class: "poveste-select-chevron"
 				})])]),
@@ -2239,7 +2245,7 @@ var ut = /* @__PURE__ */ j({
 					"side-offset": 6,
 					"collision-padding": 8
 				}, {
-					default: q(() => [k(K(He), {
+					default: q(() => [k(K(Ue), {
 						class: "poveste-select-options",
 						"data-slot": "options",
 						"selection-behavior": "replace",
@@ -2247,11 +2253,11 @@ var ut = /* @__PURE__ */ j({
 						"model-value": e.modelValue,
 						"onUpdate:modelValue": c
 					}, {
-						default: q(() => [k(K(Ue), {
+						default: q(() => [k(K(We), {
 							class: "poveste-select-list",
 							"data-slot": "listbox"
 						}, {
-							default: q(() => [(z(!0), E(S, null, V(o.value, ([e, t]) => (z(), w(K(qe), {
+							default: q(() => [(z(!0), E(S, null, V(o.value, ([e, t]) => (z(), w(K(Je), {
 								key: t,
 								class: "poveste-select-option",
 								"data-slot": "option",
@@ -2271,7 +2277,7 @@ var ut = /* @__PURE__ */ j({
 			_: 3
 		}, 8, ["open"]));
 	}
-}), on = /* @__PURE__ */ j({
+}), sn = /* @__PURE__ */ j({
 	name: "HstSelect",
 	props: {
 		title: {},
@@ -2288,7 +2294,7 @@ var ut = /* @__PURE__ */ j({
 			style: L(t.$attrs.style)
 		}, {
 			actions: q(() => [H(t.$slots, "actions")]),
-			default: q(() => [k(an, {
+			default: q(() => [k(on, {
 				options: e.options,
 				"model-value": e.modelValue,
 				"onUpdate:modelValue": r[0] ||= (e) => n("update:modelValue", e)
@@ -2300,10 +2306,10 @@ var ut = /* @__PURE__ */ j({
 			"style"
 		]));
 	}
-}), sn = {
+}), cn = {
 	class: "poveste-slider-field",
 	"data-slot": "field"
-}, cn = /* @__PURE__ */ j({
+}, ln = /* @__PURE__ */ j({
 	name: "HstSlider",
 	inheritAttrs: !1,
 	props: {
@@ -2325,7 +2331,7 @@ var ut = /* @__PURE__ */ j({
 			title: e.title,
 			style: L(t.$attrs.style)
 		}, {
-			default: q(() => [D("div", sn, [
+			default: q(() => [D("div", cn, [
 				n[3] ||= D("div", { class: "poveste-slider-track-area" }, [D("div", {
 					class: "poveste-slider-track",
 					"data-slot": "track"
@@ -2370,7 +2376,7 @@ var ut = /* @__PURE__ */ j({
 			"style"
 		]));
 	}
-}), ln = ["value"], un = /* @__PURE__ */ j({
+}), un = ["value"], dn = /* @__PURE__ */ j({
 	name: "HstText",
 	inheritAttrs: !1,
 	props: {
@@ -2400,7 +2406,7 @@ var ut = /* @__PURE__ */ j({
 				"data-slot": "control",
 				value: e.modelValue,
 				onInput: i[0] ||= (e) => n("update:modelValue", e.target.value)
-			}), null, 16, ln)]),
+			}), null, 16, un)]),
 			_: 3
 		}, 8, [
 			"title",
@@ -2408,7 +2414,7 @@ var ut = /* @__PURE__ */ j({
 			"style"
 		]));
 	}
-}), dn = ["value"], fn = /* @__PURE__ */ j({
+}), fn = ["value"], pn = /* @__PURE__ */ j({
 	name: "HstTextarea",
 	inheritAttrs: !1,
 	props: {
@@ -2437,7 +2443,7 @@ var ut = /* @__PURE__ */ j({
 				"data-slot": "control",
 				value: e.modelValue,
 				onInput: i[0] ||= (e) => n("update:modelValue", e.target.value)
-			}), null, 16, dn)]),
+			}), null, 16, fn)]),
 			_: 3
 		}, 8, [
 			"title",
@@ -2445,34 +2451,34 @@ var ut = /* @__PURE__ */ j({
 			"style"
 		]));
 	}
-}), pn = ge, mn = St, hn = kt, gn = At, _n = un, vn = en, yn = cn, bn = fn, xn = on, Sn = Bt, Cn = $t, wn = Kt, Tn = $, En = c, Dn = tn, On = Object.assign(A(() => import("./HstJson-D83KEa9o.es.js")), {
+}), mn = _e, hn = Ct, gn = At, _n = jt, vn = dn, yn = tn, bn = ln, xn = pn, Sn = sn, Cn = Vt, wn = en, Tn = qt, En = $, Dn = c, On = nn, kn = Object.assign(A(() => import("./HstJson-D83KEa9o.es.js")), {
 	name: "HstJson",
 	emits: ["update:modelValue"]
-}), kn = Object.assign(A(() => import("./HstDate-Ct5Jp_ZD.es.js")), {
+}), An = Object.assign(A(() => import("./HstDate-Ct5Jp_ZD.es.js")), {
 	name: "HstDate",
 	emits: ["update:modelValue"]
-}), An = Object.assign(A(() => import("./HstColor-DHgxKTkm.es.js")), {
+}), jn = Object.assign(A(() => import("./HstColor-DHgxKTkm.es.js")), {
 	name: "HstColor",
 	emits: ["update:modelValue"]
-}), jn = Nt, Mn = {
-	HstButton: pn,
-	HstButtonGroup: mn,
-	HstCheckbox: hn,
-	HstCheckboxList: gn,
-	HstText: _n,
-	HstNumber: vn,
-	HstSlider: yn,
-	HstTextarea: bn,
-	HstSelect: xn,
-	HstRadio: Dn,
-	HstColor: An,
-	HstDate: kn,
-	HstJson: On,
-	HstColorShades: Sn,
-	HstTokenList: Cn,
-	HstTokenGrid: wn,
-	HstCopyIcon: Tn,
-	HstColorSelect: jn
+}), Mn = Pt, Nn = {
+	HstButton: mn,
+	HstButtonGroup: hn,
+	HstCheckbox: gn,
+	HstCheckboxList: _n,
+	HstText: vn,
+	HstNumber: yn,
+	HstSlider: bn,
+	HstTextarea: xn,
+	HstSelect: Sn,
+	HstRadio: On,
+	HstColor: jn,
+	HstDate: An,
+	HstJson: kn,
+	HstColorShades: Cn,
+	HstTokenList: wn,
+	HstTokenGrid: Tn,
+	HstCopyIcon: En,
+	HstColorSelect: Mn
 };
 //#endregion
-export { pn as HstButton, mn as HstButtonGroup, hn as HstCheckbox, gn as HstCheckboxList, An as HstColor, jn as HstColorSelect, Sn as HstColorShades, Tn as HstCopyIcon, kn as HstDate, On as HstJson, vn as HstNumber, Dn as HstRadio, xn as HstSelect, yn as HstSlider, _n as HstText, bn as HstTextarea, wn as HstTokenGrid, Cn as HstTokenList, En as HstTooltip, ot as PopoverAnchor, _ as PopoverContent, h as PopoverPortal, m as PopoverRoot, y as PopoverTrigger, Mn as components, l as portalTarget };
+export { mn as HstButton, hn as HstButtonGroup, gn as HstCheckbox, _n as HstCheckboxList, jn as HstColor, Mn as HstColorSelect, Cn as HstColorShades, En as HstCopyIcon, An as HstDate, kn as HstJson, yn as HstNumber, On as HstRadio, Sn as HstSelect, bn as HstSlider, vn as HstText, xn as HstTextarea, Tn as HstTokenGrid, wn as HstTokenList, Dn as HstTooltip, st as PopoverAnchor, _ as PopoverContent, h as PopoverPortal, m as PopoverRoot, y as PopoverTrigger, Nn as components, l as portalTarget };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@poveste/controls",
   "type": "module",
-  "version": "0.17.0",
+  "version": "0.17.2",
   "description": "Prebuilt controls components",
   "author": {
     "name": "Sorin Gitlan",
@@ -52,8 +52,8 @@
     "@codemirror/state": "^6.7.6",
     "@codemirror/theme-one-dark": "^6.1.2",
     "@codemirror/view": "^6.43.13",
-    "@poveste/shared": "^0.17.0",
-    "@poveste/vendors": "^0.17.0"
+    "@poveste/shared": "^0.17.2",
+    "@poveste/vendors": "^0.17.2"
   },
   "devDependencies": {
     "@iconify/vue": "^5.0.3",