@steveencues/starter-react-ui 1.0.6 → 1.0.7

package/dist/index.js

@@ -1,60 +1,60 @@
 import { createContext as e, useCallback as t, useContext as n, useEffect as r, useMemo as i, useState as a } from "react";
-import { jsx as o } from "react/jsx-runtime";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/libs/aplicacion/contexts/translate.context.ts
-var s = e(null), c = e(null);
+var c = e(null), l = e(null);
 //#endregion
 //#region src/libs/aplicacion/hooks/use-language.ts
-function l() {
-	let e = n(s);
+function u() {
+	let e = n(c);
 	if (e === null) throw Error("useLanguage must be used inside TranslateProvider.");
 	return e;
 }
 //#endregion
 //#region src/libs/aplicacion/hooks/use-theme.ts
-var u = () => {
-	let e = n(c);
+var d = () => {
+	let e = n(l);
 	if (!e) throw Error("useTheme must be used inside ThemeProvider.");
 	return e;
 };
 //#endregion
 //#region src/libs/infraestructura/storage/encrypted-preference.storage.ts
-async function d(e, t, n) {
+async function f(e, t, n) {
 	if (t.length !== 0 && n.length !== 0) try {
-		let r = U();
+		let r = H();
 		if (r === void 0) return;
-		let i = await X(t, n);
+		let i = await Y(t, n);
 		if (i === void 0) return;
 		r.setItem(e, i);
 	} catch {}
 }
-async function f(e, t) {
+async function p(e, t) {
 	if (t.length !== 0) try {
-		let n = U();
+		let n = H();
 		if (n === void 0) return;
 		let r = n.getItem(e);
-		return r === null ? void 0 : await Z(r, t);
+		return r === null ? void 0 : await X(r, t);
 	} catch {
 		return;
 	}
 }
 //#endregion
 //#region src/libs/infraestructura/storage/language-preference.storage.ts
-var p = "starter-react-ui:language-preference:v1";
-function m(e, t) {
-	return d(p, e, t);
+var m = "starter-react-ui:language-preference:v1";
+function h(e, t) {
+	return f(m, e, t);
 }
-async function h(e, t) {
-	let n = await f(p, t);
+async function g(e, t) {
+	let n = await p(m, t);
 	if (n !== void 0 && e.includes(n)) return n;
 }
 //#endregion
 //#region src/libs/infraestructura/storage/theme-preference.storage.ts
-var g = "starter-react-ui:theme-preference:v1";
-function _(e, t) {
-	return d(g, e, t);
+var _ = "starter-react-ui:theme-preference:v1";
+function ee(e, t) {
+	return f(_, e, t);
 }
-async function ee(e, t) {
-	let n = await f(g, t);
+async function te(e, t) {
+	let n = await p(_, t);
 	if (n !== void 0) return e.find((e) => e.name === n)?.name;
 }
 //#endregion
@@ -69,73 +69,73 @@ function v(e, t, n) {
 function y(e, t) {
 	return e.translations === t.translations && e.initialLanguage === t.initialLanguage && e.fallbackLanguage === t.fallbackLanguage && e.languageEncryptionKey === t.languageEncryptionKey && e.languages === t.languages;
 }
-async function te(e) {
+async function ne(e) {
 	try {
-		return await h(e.languages, e.languageEncryptionKey);
+		return await g(e.languages, e.languageEncryptionKey);
 	} catch {
 		return;
 	}
 }
-function ne(e, t) {
+function re(e, t) {
 	r(() => {
 		let n = !0;
 		return (async () => {
-			let r = await te(e);
+			let r = await ne(e);
 			if (!n) return;
-			let i = k(e.translations, e.initialLanguage, e.fallbackLanguage);
+			let i = O(e.translations, e.initialLanguage, e.fallbackLanguage);
 			t((t) => y(t, e) && t.isLoaded ? t : v(e, r ?? i, !0));
 		})(), () => {
 			n = !1;
 		};
 	}, [e, t]);
 }
-function b(e, t, n) {
+function ie(e, t, n) {
 	r(() => {
-		n && m(t, e.languageEncryptionKey);
+		n && h(t, e.languageEncryptionKey);
 	}, [
 		e.languageEncryptionKey,
 		t,
 		n
 	]);
 }
-function re(e, n) {
+function ae(e, n) {
 	return t((t) => {
-		j(e.translations, t), n(v(e, t, !0));
+		A(e.translations, t), n(v(e, t, !0));
 	}, [e, n]);
 }
-function ie(e) {
+function oe(e) {
 	let [t, n] = a(() => v(e, e.initialLanguage, !1));
-	ne(e, n);
-	let r = y(t, e), i = r ? t.selectedLanguage : e.initialLanguage, o = r && t.isLoaded, s = re(e, n);
+	re(e, n);
+	let r = y(t, e), i = r ? t.selectedLanguage : e.initialLanguage, o = r && t.isLoaded, s = ae(e, n);
 	return {
-		language: A(e.translations, i, e.initialLanguage, e.fallbackLanguage),
+		language: k(e.translations, i, e.initialLanguage, e.fallbackLanguage),
 		isLoaded: o,
 		setLanguage: s
 	};
 }
-function ae({ translations: e, initialLanguage: t, fallbackLanguage: n = "en", languageEncryptionKey: r, children: a }) {
-	let c = i(() => Object.keys(e), [e]), l = i(() => ({
+function se({ translations: e, initialLanguage: t, fallbackLanguage: n = "en", languageEncryptionKey: r, children: a }) {
+	let s = i(() => Object.keys(e), [e]), l = i(() => ({
 		translations: e,
 		initialLanguage: t,
 		fallbackLanguage: n,
 		languageEncryptionKey: r,
-		languages: c
+		languages: s
 	}), [
 		e,
 		t,
 		n,
 		r,
-		c
-	]), u = ie(l);
-	b(l, u.language, u.isLoaded);
-	let d = oe(l, u);
-	return /* @__PURE__ */ o(s.Provider, {
+		s
+	]), u = oe(l);
+	ie(l, u.language, u.isLoaded);
+	let d = ce(l, u);
+	return /* @__PURE__ */ o(c.Provider, {
 		value: d,
 		children: a
 	});
 }
-function oe(e, n) {
-	let r = e.translations[n.language], a = e.translations[e.fallbackLanguage], o = t((e, t) => I(r, a, e, t), [r, a]);
+function ce(e, n) {
+	let r = e.translations[n.language], a = e.translations[e.fallbackLanguage], o = t((e, t) => F(r, a, e, t), [r, a]);
 	return i(() => ({
 		language: n.language,
 		languages: e.languages,
@@ -150,38 +150,38 @@ function oe(e, n) {
 }
 //#endregion
 //#region src/libs/aplicacion/providers/theme-provider.tsx
-var se = (e, t) => {
-	let n = L(e, t);
+var le = (e, t) => {
+	let n = I(e, t);
 	if (n !== void 0) return n;
 	if (e.length === 0) throw Error("ThemeProvider requires at least one theme.");
 	return e[0];
-}, ce = (e, t) => e.some((e) => e.name === t.name) ? e.map((e) => e.name === t.name ? t : e) : [...e, t], le = (e, t, n, r) => ({
+}, ue = (e, t) => e.some((e) => e.name === t.name) ? e.map((e) => e.name === t.name ? t : e) : [...e, t], de = (e, t, n, r) => ({
 	theme: e,
 	themeName: e.name,
 	themes: t,
 	setTheme: n,
 	registerTheme: r
-}), ue = ({ themes: e, initialTheme: n, children: s }) => {
-	let [l, u] = a([]), d = i(() => [...e, ...l], [e, l]), [f, p] = a(() => z(e, n)), m = i(() => se(d, f), [d, f]), h = t((e) => {
-		$.register(e), u((t) => ce(t, e));
+}), fe = ({ themes: e, initialTheme: n, children: s }) => {
+	let [c, u] = a([]), d = i(() => [...e, ...c], [e, c]), [f, p] = a(() => R(e, n)), m = i(() => le(d, f), [d, f]), h = t((e) => {
+		Q.register(e), u((t) => ue(t, e));
 	}, []), g = t((e) => {
-		let t = L(d, e);
-		t !== void 0 && (R(t) && $.register(t), p(t.name));
+		let t = I(d, e);
+		t !== void 0 && (L(t) && Q.register(t), p(t.name));
 	}, [d]);
 	r(() => {
-		B(m.name), V(m.name);
+		z(m.name), B(m.name);
 	}, [m.name]);
-	let _ = i(() => le(m, d, g, h), [
+	let _ = i(() => de(m, d, g, h), [
 		m,
 		d,
 		g,
 		h
 	]);
-	return /* @__PURE__ */ o(c.Provider, {
+	return /* @__PURE__ */ o(l.Provider, {
 		value: _,
 		children: s
 	});
-}, x = Object.freeze({ INTERPOLATION_PLACEHOLDER: String.raw`\{\{([a-zA-Z0-9_]+)\}\}` }), de = "g", S = "AES-GCM", fe = 12, C = "SHA-256", pe = "raw", me = ".", w = ["encrypt", "decrypt"], T = 2, E = {
+}, b = Object.freeze({ INTERPOLATION_PLACEHOLDER: String.raw`\{\{([a-zA-Z0-9_]+)\}\}` }), pe = "g", x = "AES-GCM", me = 12, S = "SHA-256", he = "raw", C = ".", w = ["encrypt", "decrypt"], ge = 2, T = {
 	primary: "--color-primary",
 	primaryContent: "--color-primary-content",
 	secondary: "--color-secondary",
@@ -202,28 +202,28 @@ var se = (e, t) => {
 	warningContent: "--color-warning-content",
 	error: "--color-error",
 	errorContent: "--color-error-content"
-}, D = [
-	["primary", E.primary],
-	["primaryContent", E.primaryContent],
-	["secondary", E.secondary],
-	["secondaryContent", E.secondaryContent],
-	["accent", E.accent],
-	["accentContent", E.accentContent],
-	["neutral", E.neutral],
-	["neutralContent", E.neutralContent],
-	["base100", E.base100],
-	["base200", E.base200],
-	["base300", E.base300],
-	["baseContent", E.baseContent],
-	["info", E.info],
-	["infoContent", E.infoContent],
-	["success", E.success],
-	["successContent", E.successContent],
-	["warning", E.warning],
-	["warningContent", E.warningContent],
-	["error", E.error],
-	["errorContent", E.errorContent]
-], he = {
+}, E = [
+	["primary", T.primary],
+	["primaryContent", T.primaryContent],
+	["secondary", T.secondary],
+	["secondaryContent", T.secondaryContent],
+	["accent", T.accent],
+	["accentContent", T.accentContent],
+	["neutral", T.neutral],
+	["neutralContent", T.neutralContent],
+	["base100", T.base100],
+	["base200", T.base200],
+	["base300", T.base300],
+	["baseContent", T.baseContent],
+	["info", T.info],
+	["infoContent", T.infoContent],
+	["success", T.success],
+	["successContent", T.successContent],
+	["warning", T.warning],
+	["warningContent", T.warningContent],
+	["error", T.error],
+	["errorContent", T.errorContent]
+], _e = {
 	THIN: 100,
 	EXTRA_LIGHT: 200,
 	LIGHT: 300,
@@ -236,27 +236,27 @@ var se = (e, t) => {
 };
 //#endregion
 //#region src/libs/aplicacion/utils/translation.utils.ts
-function O(e, t) {
+function D(e, t) {
 	return Object.hasOwn(e, t);
 }
-function ge(e) {
+function ve(e) {
 	let [t] = Object.keys(e);
 	return t;
 }
-function k(e, t, n) {
-	if (O(e, t)) return t;
-	if (O(e, n)) return n;
-	let r = ge(e);
+function O(e, t, n) {
+	if (D(e, t)) return t;
+	if (D(e, n)) return n;
+	let r = ve(e);
 	if (r === void 0) throw Error("TranslateProvider requires at least one translation catalog.");
 	return r;
 }
-function A(e, t, n, r) {
-	return O(e, t) ? t : k(e, n, r);
+function k(e, t, n, r) {
+	return D(e, t) ? t : O(e, n, r);
 }
-function j(e, t) {
-	if (!O(e, t)) throw Error(`Language "${t}" is not available in the translation catalog.`);
+function A(e, t) {
+	if (!D(e, t)) throw Error(`Language "${t}" is not available in the translation catalog.`);
 }
-function _e(e, t) {
+function ye(e, t) {
 	let n = e;
 	for (let e of t.split(".")) {
 		if (typeof n == "string" || !Object.hasOwn(n, e)) return;
@@ -264,43 +264,43 @@ function _e(e, t) {
 	}
 	return n;
 }
-function M(e, t) {
+function j(e, t) {
 	if (e === void 0 || t === "") return;
-	let n = _e(e, t);
+	let n = ye(e, t);
 	return typeof n == "string" ? n : void 0;
 }
-function N(e, t, n) {
+function M(e, t, n) {
 	let r = n?.[t];
 	return r === void 0 ? e : String(r);
 }
-function P(e, t) {
-	let n = new RegExp(x.INTERPOLATION_PLACEHOLDER, "g");
-	return e.replace(n, (e, n) => N(e, n, t));
+function N(e, t) {
+	let n = new RegExp(b.INTERPOLATION_PLACEHOLDER, "g");
+	return e.replace(n, (e, n) => M(e, n, t));
 }
-function F(e, t, n) {
-	let r = M(e, n);
-	return r === void 0 ? M(t, n) ?? n : r;
+function P(e, t, n) {
+	let r = j(e, n);
+	return r === void 0 ? j(t, n) ?? n : r;
 }
-function I(e, t, n, r) {
-	return P(F(e, t, n), r);
+function F(e, t, n, r) {
+	return N(P(e, t, n), r);
 }
 //#endregion
 //#region src/libs/aplicacion/utils/theme.utils.ts
-var L = (e, t) => e.find((e) => e.name === t), R = (e) => "daisyUI" in e, z = (e, t) => {
+var I = (e, t) => e.find((e) => e.name === t), L = (e) => "daisyUI" in e, R = (e, t) => {
 	if (typeof window < "u") {
 		let t = window.localStorage.getItem("app_theme");
-		if (t !== null && t.length > 0 && L(e, t) !== void 0) return t;
+		if (t !== null && t.length > 0 && I(e, t) !== void 0) return t;
 	}
-	let n = L(e, t);
+	let n = I(e, t);
 	return n === void 0 ? e.length === 0 ? t : e[0].name : n.name;
-}, B = (e) => {
+}, z = (e) => {
 	typeof document < "u" && document.documentElement.setAttribute("data-theme", e);
-}, V = (e) => {
+}, B = (e) => {
 	typeof window < "u" && window.localStorage.setItem("app_theme", e);
 };
 //#endregion
 //#region src/libs/aplicacion/utils/crypto-api.util.ts
-function H() {
+function V() {
 	try {
 		return globalThis.crypto;
 	} catch {
@@ -309,7 +309,7 @@ function H() {
 }
 //#endregion
 //#region src/libs/aplicacion/utils/storage-api.util.ts
-function U() {
+function H() {
 	try {
 		return globalThis.localStorage;
 	} catch {
@@ -318,104 +318,104 @@ function U() {
 }
 //#endregion
 //#region src/libs/aplicacion/utils/text-encoding.util.ts
-function W(e) {
+function U(e) {
 	return new TextEncoder().encode(e);
 }
-function G(e) {
+function W(e) {
 	return new TextDecoder().decode(e);
 }
 //#endregion
 //#region src/libs/aplicacion/utils/base64.util.ts
-function K(e) {
+function G(e) {
 	let t = "";
 	for (let n of e) t += String.fromCharCode(n);
 	return btoa(t);
 }
-function q(e) {
+function K(e) {
 	let t = atob(e), n = new Uint8Array(t.length);
 	for (let e = 0; e < t.length; e += 1) n[e] = t.charCodeAt(e);
 	return n;
 }
 //#endregion
 //#region src/libs/aplicacion/services/encryption.service.ts
-async function J(e) {
-	let t = H();
+async function q(e) {
+	let t = V();
 	if (t === void 0 || e.length === 0) return;
-	let n = await t.subtle.digest(C, W(e));
-	return t.subtle.importKey("raw", n, { name: S }, !1, w);
+	let n = await t.subtle.digest(S, U(e));
+	return t.subtle.importKey("raw", n, { name: x }, !1, w);
 }
-function ve() {
-	let e = H();
+function be() {
+	let e = V();
 	if (e === void 0) throw Error("Cryptographic API is unavailable.");
 	return e.getRandomValues(/* @__PURE__ */ new Uint8Array(12));
 }
-function ye(e) {
+function xe(e) {
 	try {
-		let t = q(e);
+		let t = K(e);
 		return t.length === 12 ? t : void 0;
 	} catch {
 		return;
 	}
 }
-function be(e) {
+function Se(e) {
 	return e.length === 2;
 }
-function xe(e) {
-	if (be(e)) return [e[0], e[1]];
+function Ce(e) {
+	if (Se(e)) return [e[0], e[1]];
 }
-function Se(e) {
-	let t = xe(e.split("."));
+function we(e) {
+	let t = Ce(e.split("."));
 	if (t === void 0) return;
-	let [n, r] = t, i = ye(n);
+	let [n, r] = t, i = xe(n);
 	if (i !== void 0) try {
 		return {
 			iv: i,
-			ciphertext: q(r)
+			ciphertext: K(r)
 		};
 	} catch {
 		return;
 	}
 }
-async function Ce(e, t, n) {
-	return Y().subtle.encrypt({
-		name: S,
+async function Te(e, t, n) {
+	return J().subtle.encrypt({
+		name: x,
 		iv: n
 	}, t, e);
 }
-async function we(e, t) {
-	return Y().subtle.decrypt({
-		name: S,
+async function Ee(e, t) {
+	return J().subtle.decrypt({
+		name: x,
 		iv: e.iv
 	}, t, e.ciphertext);
 }
-function Y() {
-	let e = H();
+function J() {
+	let e = V();
 	if (e === void 0) throw Error("Cryptographic API is unavailable.");
 	return e;
 }
-async function X(e, t) {
+async function Y(e, t) {
 	try {
-		let n = await J(t);
+		let n = await q(t);
 		if (n === void 0) return;
-		let r = ve(), i = await Ce(W(e), n, r);
-		return [K(r), K(new Uint8Array(i))].join(".");
+		let r = be(), i = await Te(U(e), n, r);
+		return [G(r), G(new Uint8Array(i))].join(".");
 	} catch {
 		return;
 	}
 }
-async function Z(e, t) {
+async function X(e, t) {
 	try {
-		let n = Se(e);
+		let n = we(e);
 		if (n === void 0) return;
-		let r = await J(t);
-		return r === void 0 ? void 0 : G(await we(n, r));
+		let r = await q(t);
+		return r === void 0 ? void 0 : W(await Ee(n, r));
 	} catch {
 		return;
 	}
 }
 //#endregion
 //#region src/libs/aplicacion/services/custom-theme.service.ts
-var Q = class e {
+var Z = class e {
 	static STYLE_ID_PREFIX = "daisyui-custom-theme-";
 	register(e) {
 		this.validateThemeName(e.name);
@@ -432,7 +432,7 @@ var Q = class e {
 		if (!/^[a-zA-Z][a-zA-Z0-9_-]*$/.test(e)) throw Error(`Invalid theme name: ${e}`);
 	}
 	createColorDeclarations(e) {
-		return D.map(([t, n]) => {
+		return E.map(([t, n]) => {
 			let r = e.daisyUI[t];
 			return this.validateCssColor(t, r), `${n}: ${r};`;
 		}).join("\n");
@@ -458,16 +458,206 @@ var Q = class e {
 	getStyleElementId(t) {
 		return `${e.STYLE_ID_PREFIX}${t}`;
 	}
-}, $ = new Q(), Te = ({ label: e, className: t = "", ...n }) => {
-	let { t: r } = l();
+}, Q = new Z(), De = ({ label: e, className: t = "", ...n }) => {
+	let { t: r } = u();
 	return /* @__PURE__ */ o("button", {
 		...n,
 		type: n.type ?? "button",
 		className: `btn btn-primary ${t}`,
 		children: e ?? r("common.button")
 	});
+}, $ = ({ theme: e, isOpen: t, onToggle: n }) => /* @__PURE__ */ s("button", {
+	type: "button",
+	"aria-haspopup": "listbox",
+	"aria-expanded": t,
+	onClick: n,
+	className: "flex w-full items-center gap-3 rounded-2xl border border-base-300 bg-base-100 p-3 text-left shadow-sm transition hover:border-primary/50 hover:shadow-md focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
+	children: [
+		/* @__PURE__ */ o("span", {
+			"data-theme": e.name,
+			className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-primary text-primary-content shadow-sm",
+			children: /* @__PURE__ */ o("span", {
+				className: "text-lg font-bold",
+				children: e.manifest.name.charAt(0).toUpperCase()
+			})
+		}),
+		/* @__PURE__ */ s("span", {
+			className: "min-w-0 flex-1",
+			children: [/* @__PURE__ */ o("span", {
+				className: "block truncate font-semibold text-base-content",
+				children: e.manifest.name
+			}), /* @__PURE__ */ o("span", {
+				className: "block text-xs text-base-content/60",
+				children: "Tema seleccionado"
+			})]
+		}),
+		/* @__PURE__ */ o("svg", {
+			"aria-hidden": "true",
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			className: `h-5 w-5 shrink-0 transition-transform ${t ? "rotate-180" : ""}`,
+			children: /* @__PURE__ */ o("path", {
+				d: "m6 9 6 6 6-6",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		})
+	]
+}), Oe = ({ value: e, placeholder: t, onChange: n }) => /* @__PURE__ */ s("label", {
+	className: "input input-bordered flex w-full items-center gap-2 rounded-xl",
+	children: [/* @__PURE__ */ s("svg", {
+		"aria-hidden": "true",
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		className: "h-4 w-4 opacity-60",
+		children: [/* @__PURE__ */ o("circle", {
+			cx: "11",
+			cy: "11",
+			r: "7"
+		}), /* @__PURE__ */ o("path", {
+			d: "m16 16 4 4",
+			strokeLinecap: "round"
+		})]
+	}), /* @__PURE__ */ o("input", {
+		type: "search",
+		value: e,
+		onChange: (e) => n(e.target.value),
+		placeholder: t,
+		"aria-label": t,
+		className: "grow"
+	})]
+}), ke = ({ theme: e, isSelected: t, showDescription: n, onSelect: r }) => /* @__PURE__ */ o("li", { children: /* @__PURE__ */ s("button", {
+	type: "button",
+	role: "option",
+	"aria-selected": t,
+	onClick: () => r(e.name),
+	className: `flex w-full items-center gap-3 rounded-xl p-3 text-left transition ${t ? "bg-primary/10 text-primary" : "text-base-content hover:bg-base-200"}`,
+	children: [
+		/* @__PURE__ */ s("span", {
+			"data-theme": e.name,
+			className: "flex h-10 w-10 shrink-0 items-center justify-center gap-1 overflow-hidden rounded-xl border border-base-300 bg-base-100 p-1",
+			children: [
+				/* @__PURE__ */ o("span", { className: "h-full w-2 rounded-full bg-primary" }),
+				/* @__PURE__ */ o("span", { className: "h-full w-2 rounded-full bg-secondary" }),
+				/* @__PURE__ */ o("span", { className: "h-full w-2 rounded-full bg-accent" })
+			]
+		}),
+		/* @__PURE__ */ s("span", {
+			className: "min-w-0 flex-1",
+			children: [/* @__PURE__ */ o("span", {
+				className: "block truncate text-sm font-semibold",
+				children: e.manifest.name
+			}), n && /* @__PURE__ */ o("span", {
+				className: "mt-0.5 block truncate text-xs text-base-content/60",
+				children: e.manifest.description
+			})]
+		}),
+		t && /* @__PURE__ */ o("svg", {
+			"aria-hidden": "true",
+			viewBox: "0 0 24 24",
+			fill: "none",
+			stroke: "currentColor",
+			strokeWidth: "2.5",
+			className: "h-5 w-5 shrink-0",
+			children: /* @__PURE__ */ o("path", {
+				d: "m5 12 4 4L19 6",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		})
+	]
+}) }), Ae = ({ themes: e, selectedTheme: t, showDescriptions: n, label: r, onSelect: i }) => /* @__PURE__ */ s("ul", {
+	role: "listbox",
+	"aria-label": r,
+	className: "max-h-72 space-y-1 overflow-y-auto p-2",
+	children: [e.map((e) => /* @__PURE__ */ o(ke, {
+		theme: e,
+		isSelected: e.name === t,
+		showDescription: n,
+		onSelect: i
+	}, e.name)), e.length === 0 && /* @__PURE__ */ o("li", {
+		className: "px-3 py-8 text-center text-sm text-base-content/60",
+		children: "No se encontraron temas."
+	})]
+}), je = ({ themes: e, totalThemes: t, selectedTheme: n, search: r, showSearch: i, placeholder: a, label: c, showDescriptions: l, onSearchChange: u, onSelectTheme: d }) => /* @__PURE__ */ s("div", {
+	className: "absolute left-0 right-0 top-full z-50 mt-2 overflow-hidden rounded-2xl border border-base-300 bg-base-100 shadow-xl",
+	children: [
+		/* @__PURE__ */ s("div", {
+			className: "border-b border-base-300 p-3",
+			children: [/* @__PURE__ */ o("p", {
+				className: "mb-2 text-xs font-semibold uppercase tracking-wider text-base-content/60",
+				children: "Selecciona un tema"
+			}), i && /* @__PURE__ */ o(Oe, {
+				value: r,
+				placeholder: a,
+				onChange: u
+			})]
+		}),
+		/* @__PURE__ */ o(Ae, {
+			themes: e,
+			selectedTheme: n,
+			showDescriptions: l,
+			label: c,
+			onSelect: d
+		}),
+		/* @__PURE__ */ o("div", {
+			className: "border-t border-base-300 px-3 py-2",
+			children: /* @__PURE__ */ s("p", {
+				className: "text-xs text-base-content/50",
+				children: [
+					e.length,
+					" de ",
+					t,
+					" temas"
+				]
+			})
+		})
+	]
+}), Me = 5, Ne = (e, t) => {
+	let n = t.trim().toLocaleLowerCase();
+	return e.filter((e) => [
+		e.name,
+		e.manifest.name,
+		e.manifest.description
+	].some((e) => e.toLocaleLowerCase().includes(n)));
+}, Pe = ({ label: e = "Tema visual", placeholder: t = "Buscar tema...", className: n = "", showDescriptions: r = !0 }) => {
+	let { theme: i, themes: c, setTheme: l } = d(), [u, f] = a(!1), [p, m] = a(""), h = Ne(c, p);
+	return /* @__PURE__ */ s("div", {
+		className: `relative w-full max-w-sm ${n}`,
+		children: [
+			/* @__PURE__ */ o("label", {
+				className: "mb-2 block text-sm font-semibold text-base-content",
+				children: e
+			}),
+			/* @__PURE__ */ o($, {
+				theme: i,
+				isOpen: u,
+				onToggle: () => {
+					f((e) => !e), m("");
+				}
+			}),
+			u && /* @__PURE__ */ o(je, {
+				themes: h,
+				totalThemes: c.length,
+				selectedTheme: i.name,
+				search: p,
+				showSearch: c.length > Me,
+				placeholder: t,
+				label: e,
+				showDescriptions: r,
+				onSearchChange: m,
+				onSelectTheme: (e) => {
+					l(e), f(!1), m("");
+				}
+			})
+		]
+	});
 };
 //#endregion
-export { S as AES_GCM_ALGORITHM, fe as AES_GCM_IV_LENGTH, Te as Button, E as CSS_THEME_TOKENS, D as CSS_THEME_TOKEN_ENTRIES, Q as CustomThemeService, T as ENCRYPTED_VALUE_PART_COUNT, de as GLOBAL_REGEX_FLAG, w as KEY_USAGES, pe as RAW_KEY_FORMAT, C as SHA_256_ALGORITHM, me as STORAGE_VALUE_SEPARATOR, he as THEME_FONT_WEIGHT, c as ThemeContext, ue as ThemeProvider, s as TranslateContext, ae as TranslateProvider, x as TranslationRegex, B as applyThemeToDocument, j as assertLanguageExists, $ as customThemeService, q as decodeBase64, G as decodeText, Z as decryptText, K as encodeBase64, W as encodeText, X as encryptText, L as findThemeByName, M as findTranslation, H as getCryptoApi, U as getLocalStorage, P as interpolateTranslation, R as isCustomThemeDefinition, f as loadEncryptedPreference, h as loadLanguagePreference, ee as loadThemePreference, V as persistTheme, A as resolveActiveLanguage, k as resolveInitialLanguage, z as resolveInitialTheme, d as saveEncryptedPreference, m as saveLanguagePreference, _ as saveThemePreference, I as translateMessage, l as useLanguage, u as useTheme };
+export { x as AES_GCM_ALGORITHM, me as AES_GCM_IV_LENGTH, De as Button, T as CSS_THEME_TOKENS, E as CSS_THEME_TOKEN_ENTRIES, Z as CustomThemeService, ge as ENCRYPTED_VALUE_PART_COUNT, pe as GLOBAL_REGEX_FLAG, w as KEY_USAGES, he as RAW_KEY_FORMAT, S as SHA_256_ALGORITHM, C as STORAGE_VALUE_SEPARATOR, _e as THEME_FONT_WEIGHT, l as ThemeContext, fe as ThemeProvider, Pe as ThemeSelector, c as TranslateContext, se as TranslateProvider, b as TranslationRegex, z as applyThemeToDocument, A as assertLanguageExists, Q as customThemeService, K as decodeBase64, W as decodeText, X as decryptText, G as encodeBase64, U as encodeText, Y as encryptText, I as findThemeByName, j as findTranslation, V as getCryptoApi, H as getLocalStorage, N as interpolateTranslation, L as isCustomThemeDefinition, p as loadEncryptedPreference, g as loadLanguagePreference, te as loadThemePreference, B as persistTheme, k as resolveActiveLanguage, O as resolveInitialLanguage, R as resolveInitialTheme, f as saveEncryptedPreference, h as saveLanguagePreference, ee as saveThemePreference, F as translateMessage, u as useLanguage, d as useTheme };
 
 //# sourceMappingURL=index.js.map