@studiolxd/brand 49.28.0 → 51.0.0

package/dist/_shared/{calendargrid.js → calendar.js}

@@ -1,3 +1,4 @@
+import '../calendar.css';
 import { Icon as e } from "../icon.js";
 import { useCallback as t, useEffect as n, useMemo as r, useRef as i, useState as a } from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
@@ -139,32 +140,32 @@ function x(e, t) {
 	return new Date(n.getFullYear(), n.getMonth(), Math.min(e.getDate(), r));
 }
 function S(e) {
+	let [t] = a(() => /* @__PURE__ */ new Date());
+	return e ?? t;
+}
+function C(e) {
 	return `${e.getFullYear()}-${e.getMonth()}-${e.getDate()}`;
 }
-function C({ month: e, onMonthChange: o, selected: s, onActivate: u, minDate: d, maxDate: f }) {
-	let [p, m] = a(() => s ?? /* @__PURE__ */ new Date()), h = i(/* @__PURE__ */ new Map()), g = i(!1), _ = r(() => {
-		if (l(p, e)) return p;
-		if (s && l(s, e)) return s;
-		let t = /* @__PURE__ */ new Date();
-		return l(t, e) ? t : new Date(e.getFullYear(), e.getMonth(), 1);
-	}, [
-		p,
+function w({ month: e, onMonthChange: o, selected: s, today: u, onActivate: d, minDate: f, maxDate: p }) {
+	let [m, h] = a(() => s ?? u), g = i(/* @__PURE__ */ new Map()), _ = i(!1), v = r(() => l(m, e) ? m : s && l(s, e) ? s : l(u, e) ? u : new Date(e.getFullYear(), e.getMonth(), 1), [
+		m,
 		e,
-		s
+		s,
+		u
 	]);
 	n(() => {
-		g.current && (g.current = !1, h.current.get(S(_))?.focus());
-	}, [_]);
-	let v = t((t) => {
-		let n = y(t, d, f);
-		g.current = !0, m(n), l(n, e) || o(new Date(n.getFullYear(), n.getMonth(), 1));
+		_.current && (_.current = !1, g.current.get(C(v))?.focus());
+	}, [v]);
+	let S = t((t) => {
+		let n = y(t, f, p);
+		_.current = !0, h(n), l(n, e) || o(new Date(n.getFullYear(), n.getMonth(), 1));
 	}, [
+		p,
 		f,
-		d,
 		e,
 		o
-	]), C = t((e) => {
-		let t = _, n = null;
+	]), w = t((e) => {
+		let t = v, n = null;
 		switch (e.key) {
 			case "ArrowLeft":
 				n = b(t, -1);
@@ -192,46 +193,46 @@ function C({ month: e, onMonthChange: o, selected: s, onActivate: u, minDate: d,
 				break;
 			case "Enter":
 			case " ":
-				u && (e.preventDefault(), u(t));
+				d && (e.preventDefault(), d(t));
 				return;
 			default: return;
 		}
-		e.preventDefault(), v(n);
+		e.preventDefault(), S(n);
 	}, [
-		_,
 		v,
-		u
-	]), w = t((e) => (t) => {
-		let n = S(e);
-		t ? h.current.set(n, t) : h.current.delete(n);
+		S,
+		d
+	]), T = t((e) => (t) => {
+		let n = C(e);
+		t ? g.current.set(n, t) : g.current.delete(n);
 	}, []);
 	return {
-		activeDate: _,
-		isTabbable: t((e) => c(e, _), [_]),
-		cellRef: w,
-		onKeyDown: C,
-		onCellFocus: t((e) => m(e), [])
+		activeDate: v,
+		isTabbable: t((e) => c(e, v), [v]),
+		cellRef: T,
+		onKeyDown: w,
+		onCellFocus: t((e) => h(e), [])
 	};
 }
-function w({ weekStart: e, onWeekChange: o, onActivate: s, minDate: l, maxDate: u }) {
-	let [d, p] = a(() => /* @__PURE__ */ new Date()), m = i(/* @__PURE__ */ new Map()), h = i(!1), g = r(() => f(e), [e]), _ = r(() => {
-		if (c(f(d), g)) return d;
-		let e = /* @__PURE__ */ new Date();
-		return c(f(e), g) ? e : g;
-	}, [d, g]);
+function T({ weekStart: e, onWeekChange: o, today: s, onActivate: l, minDate: u, maxDate: d }) {
+	let [p, m] = a(() => s), h = i(/* @__PURE__ */ new Map()), g = i(!1), _ = r(() => f(e), [e]), v = r(() => c(f(p), _) ? p : c(f(s), _) ? s : _, [
+		p,
+		_,
+		s
+	]);
 	n(() => {
-		h.current && (h.current = !1, m.current.get(S(_))?.focus());
-	}, [_]);
-	let v = t((e) => {
-		let t = y(e, l, u);
-		h.current = !0, p(t), c(f(t), g) || o(f(t));
+		g.current && (g.current = !1, h.current.get(C(v))?.focus());
+	}, [v]);
+	let x = t((e) => {
+		let t = y(e, u, d);
+		g.current = !0, m(t), c(f(t), _) || o(f(t));
 	}, [
+		d,
 		u,
-		l,
 		o,
-		g
-	]), x = t((e) => {
-		let t = _, n = null;
+		_
+	]), S = t((e) => {
+		let t = v, n = null;
 		switch (e.key) {
 			case "ArrowLeft":
 			case "ArrowUp":
@@ -255,26 +256,35 @@ function w({ weekStart: e, onWeekChange: o, onActivate: s, minDate: l, maxDate:
 				break;
 			case "Enter":
 			case " ":
-				s && (e.preventDefault(), s(t));
+				l && (e.preventDefault(), l(t));
 				return;
 			default: return;
 		}
-		e.preventDefault(), v(n);
+		e.preventDefault(), x(n);
 	}, [
-		_,
 		v,
-		s
-	]), C = t((e) => (t) => {
-		let n = S(e);
-		t ? m.current.set(n, t) : m.current.delete(n);
+		x,
+		l
+	]), w = t((e) => (t) => {
+		let n = C(e);
+		t ? h.current.set(n, t) : h.current.delete(n);
 	}, []);
 	return {
-		activeDate: _,
-		isTabbable: t((e) => c(e, _), [_]),
-		cellRef: C,
-		onKeyDown: x,
-		onCellFocus: t((e) => p(e), [])
+		activeDate: v,
+		isTabbable: t((e) => c(e, v), [v]),
+		cellRef: w,
+		onKeyDown: S,
+		onCellFocus: t((e) => m(e), [])
 	};
 }
 //#endregion
-export { c as a, _ as c, f as d, C as f, g as i, u as l, d as n, l as o, w as p, m as r, v as s, h as t, p as u };
+//#region src/stories/messages/es/calendar.ts
+var E = {
+	previousMonth: "Mes anterior",
+	nextMonth: "Mes siguiente",
+	previousYears: "Años anteriores",
+	nextYears: "Años siguientes",
+	yearGrid: "Elegir año"
+};
+//#endregion
+export { g as a, v as c, p as d, f, S as h, m as i, _ as l, T as m, h as n, c as o, w as p, d as r, l as s, E as t, u };

package/dist/_shared/closebutton.js

@@ -0,0 +1,34 @@
+import '../closebutton.css';
+import { r as e } from "./brandmessagescontext.js";
+import { Icon as t } from "../icon.js";
+import { t as n } from "./focusable-when-disabled.js";
+import { forwardRef as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/stories/messages/es/closeButton.ts
+var a = { label: "Cerrar" }, o = r(function({ label: n, size: r = "md", className: o, disabled: s, focusableWhenDisabled: c = !1, onClick: l, ...u }, d) {
+	let f = e("closeButton", a), p = [
+		"close-button",
+		r === "md" ? "" : `close-button--${r}`,
+		o
+	].filter(Boolean).join(" "), m = !!s && c;
+	return /* @__PURE__ */ i("button", {
+		ref: d,
+		type: "button",
+		className: p,
+		"aria-label": f("label", n),
+		disabled: m ? void 0 : s,
+		"aria-disabled": m ? !0 : void 0,
+		onClick: (e) => {
+			if (m) {
+				e.preventDefault(), e.stopPropagation();
+				return;
+			}
+			l?.(e);
+		},
+		...u,
+		children: /* @__PURE__ */ i(t, { name: "close" })
+	});
+});
+n(o);
+//#endregion
+export { o as t };

package/dist/_shared/colorpicker.js

@@ -1,68 +1,82 @@
 import '../colorpicker.css';
-import { n as e } from "./brandmessagescontext.js";
+import { r as e } from "./brandmessagescontext.js";
 import { VisuallyHidden as t } from "../visually-hidden.js";
 import { Button as n } from "../button.js";
 import { Input as r } from "../input.js";
 import { Popover as i } from "../popover.js";
-import { Slider as a } from "../slider.js";
+import { t as a } from "./slider.js";
 import { t as o } from "./css-properties.js";
 import { ColorSwatch as s } from "../color-swatch.js";
-import { cloneElement as c, forwardRef as l, useCallback as u, useId as d, useRef as f, useState as p } from "react";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
-import { useRender as g } from "@base-ui/react/use-render";
-import { useDirection as _ } from "@base-ui/react/direction-provider";
-//#region src/stories/molecules/ColorPicker/ColorArea.tsx
-var v = 1, y = 10, b = (e) => Math.min(100, Math.max(0, e)), x = l(function({ hueColor: e, saturation: t, brightness: n, onChange: r, onCommit: i, label: a, roleDescription: s, valueText: c, disabled: l = !1 }, d) {
-	let p = _() === "rtl", h = f(null), g = f(null), x = f({
+import { t as c } from "./requiredinput.js";
+import { cloneElement as l, forwardRef as u, useCallback as d, useId as f, useRef as p, useState as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { useRender as _ } from "@base-ui/react/use-render";
+import { useDirection as ee } from "@base-ui/react/direction-provider";
+//#region src/stories/messages/es/colorPicker.ts
+var v = {
+	trigger: "Elegir color",
+	value: (e) => `Color actual: ${e}`,
+	empty: "Sin color",
+	dialog: "Selector de color",
+	area: "Saturación y brillo",
+	areaDescription: "deslizador bidimensional",
+	areaValue: (e, t) => `Saturación ${e} %, brillo ${t} %`,
+	hue: "Tono",
+	alpha: "Opacidad",
+	hex: "Hexadecimal",
+	presets: "Colores predefinidos",
+	clear: "Quitar color"
+}, te = 1, y = 10, b = (e) => Math.min(100, Math.max(0, e)), x = u(function({ hueColor: e, saturation: t, brightness: n, onChange: r, onCommit: i, label: a, roleDescription: s, valueText: c, disabled: l = !1 }, u) {
+	let f = ee() === "rtl", m = p(null), g = p(null), _ = p({
 		s: 0,
 		v: 0
-	}), S = o({
-		"--color-picker-area-x": `${p ? 100 - t : t}%`,
+	}), v = o({
+		"--color-picker-area-x": `${f ? 100 - t : t}%`,
 		"--color-picker-area-y": `${100 - n}%`,
 		"--color-picker-area-hue": e
-	}), C = u((e) => {
-		h.current = e, S(e);
-	}, [S]), w = (e) => {
+	}), x = d((e) => {
+		m.current = e, v(e);
+	}, [v]), S = (e) => {
 		let t = e.currentTarget.getBoundingClientRect(), n = t.width ? (e.clientX - t.left) / t.width : 0, r = t.height ? (e.clientY - t.top) / t.height : 0;
 		return {
-			s: b((p ? 1 - n : n) * 100),
+			s: b((f ? 1 - n : n) * 100),
 			v: b((1 - r) * 100)
 		};
-	}, T = () => {
-		((typeof d == "function" ? null : d?.current) ?? h.current?.querySelector("[role=\"slider\"]"))?.focus({ preventScroll: !0 });
-	}, E = (e) => {
+	}, C = () => {
+		((typeof u == "function" ? null : u?.current) ?? m.current?.querySelector("[role=\"slider\"]"))?.focus({ preventScroll: !0 });
+	}, w = (e) => {
 		if (l || e.button !== 0) return;
 		e.preventDefault();
 		try {
 			e.currentTarget.setPointerCapture?.(e.pointerId);
 		} catch {}
-		g.current = e.pointerId, T();
-		let t = w(e);
-		x.current = t, r(t);
-	}, D = (e) => {
+		g.current = e.pointerId, C();
+		let t = S(e);
+		_.current = t, r(t);
+	}, T = (e) => {
 		if (g.current !== e.pointerId) return;
-		let t = w(e);
-		x.current = t, r(t);
-	}, O = (e) => {
+		let t = S(e);
+		_.current = t, r(t);
+	}, E = (e) => {
 		if (g.current === e.pointerId) {
 			g.current = null;
 			try {
 				e.currentTarget.releasePointerCapture?.(e.pointerId);
 			} catch {}
-			i(x.current);
+			i(_.current);
 		}
-	}, k = (e) => {
+	}, D = (e) => {
 		if (l) return;
-		let a = e.shiftKey ? y : v, { s: o, v: s } = {
+		let a = e.shiftKey ? y : te, { s: o, v: s } = {
 			s: t,
 			v: n
 		};
 		switch (e.key) {
 			case "ArrowRight":
-				o += p ? -a : a;
+				o += f ? -a : a;
 				break;
 			case "ArrowLeft":
-				o += p ? a : -a;
+				o += f ? a : -a;
 				break;
 			case "ArrowUp":
 				s += a;
@@ -91,17 +105,17 @@ var v = 1, y = 10, b = (e) => Math.min(100, Math.max(0, e)), x = l(function({ hu
 		};
 		r(c), i(c);
 	};
-	return /* @__PURE__ */ m("div", {
-		ref: C,
+	return /* @__PURE__ */ h("div", {
+		ref: x,
 		className: "color-picker__area",
-		"data-direction": p ? "rtl" : "ltr",
+		"data-direction": f ? "rtl" : "ltr",
 		"data-disabled": l ? "" : void 0,
-		onPointerDown: E,
-		onPointerMove: D,
-		onPointerUp: O,
-		onPointerCancel: O,
-		children: /* @__PURE__ */ m("div", {
-			ref: d,
+		onPointerDown: w,
+		onPointerMove: T,
+		onPointerUp: E,
+		onPointerCancel: E,
+		children: /* @__PURE__ */ h("div", {
+			ref: u,
 			className: "color-picker__area-thumb",
 			role: "slider",
 			tabIndex: l ? -1 : 0,
@@ -112,7 +126,7 @@ var v = 1, y = 10, b = (e) => Math.min(100, Math.max(0, e)), x = l(function({ hu
 			"aria-valuenow": Math.round(t),
 			"aria-valuetext": c,
 			"aria-disabled": l || void 0,
-			onKeyDown: k
+			onKeyDown: D
 		})
 	});
 }), S = (e, t, n) => Math.min(n, Math.max(t, e));
@@ -189,7 +203,7 @@ function A(e, t) {
 	let n = C(e);
 	return n ? T(n, t) : null;
 }
-function ee() {
+function ne() {
 	return [
 		0,
 		60,
@@ -207,128 +221,133 @@ function ee() {
 }
 //#endregion
 //#region src/stories/molecules/ColorPicker/ColorPicker.tsx
+function re(e, t) {
+	typeof e == "function" ? e(t) : e && (e.current = t);
+}
 var j = {
 	h: 0,
 	s: 0,
 	v: 0,
 	a: 1
-}, te = l(function({ value: l, defaultValue: v = null, onValueChange: y, onValueCommitted: b, alpha: S = !1, presets: C, clearable: w = !1, onClear: T, open: E, defaultOpen: D = !1, onOpenChange: te, size: M = "md", disabled: N = !1, error: P = !1, locale: ne = "es-ES", id: re, name: F, "aria-label": I, "aria-labelledby": L, "aria-describedby": ie, dialogLabel: ae, clearLabel: oe, trigger: R, anchor: z, className: se }, B) {
-	let V = e("colorPicker"), H = _() === "rtl", [ce, U] = p(D), W = E ?? ce, G = l !== void 0, [le, ue] = p(v), K = G ? l : le, q = K ? A(K, S) : null, [J, de] = p(() => q && O(q) || j), [fe, pe] = p(q);
-	q !== fe && (pe(q), q && k(J, S) !== q && de(O(q) ?? j));
-	let me = k(J, S), he = k({
+}, ie = u(function({ value: u, defaultValue: te = null, onValueChange: y, onValueCommitted: b, alpha: S = !1, presets: C, clearable: w = !1, onClear: T, open: E, defaultOpen: D = !1, onOpenChange: ie, size: M = "md", disabled: N = !1, error: P = !1, locale: ae = "es-ES", id: oe, name: se, required: ce = !1, "aria-label": F, "aria-labelledby": I, "aria-describedby": le, dialogLabel: ue, clearLabel: de, trigger: L, anchor: R, className: z }, B) {
+	let V = e("colorPicker", v), H = ee() === "rtl", [fe, U] = m(D), W = E ?? fe, G = u !== void 0, [pe, me] = m(te), K = G ? u : pe, q = K ? A(K, S) : null, [J, he] = m(() => q && O(q) || j), [ge, _e] = m(q);
+	q !== ge && (_e(q), q && k(J, S) !== q && he(O(q) ?? j));
+	let ve = k(J, S), ye = k({
 		...J,
 		a: 1
-	}, !1), Y = u((e, t) => {
+	}, !1), Y = d((e, t) => {
 		let n = S ? e : {
 			...e,
 			a: 1
 		};
-		de(n);
+		he(n);
 		let r = k(n, S);
-		G || ue(r), y?.(r), t && b?.(r);
+		G || me(r), y?.(r), t && b?.(r);
 	}, [
 		S,
 		G,
 		y,
 		b
-	]), [X, Z] = p(null), [ge, _e] = p(W);
-	W !== ge && (_e(W), W || Z(null));
-	let ve = (e, t) => {
+	]), [X, Z] = m(null), [be, xe] = m(W);
+	W !== be && (xe(W), W || Z(null));
+	let Se = (e, t) => {
 		let n = A(e, S), r = n ? O(n) : null;
 		return r ? (Y(r, t), !0) : !1;
-	}, ye = (e) => {
+	}, Ce = (e) => {
 		let t = e.target.value;
 		Z(t);
 		let n = t.trim().replace(/^#/, "").length;
-		(n === 6 || S && n === 8) && ve(t, !0);
-	}, be = () => {
-		X !== null && ve(X, !0), Z(null);
-	}, xe = () => {
-		G || ue(null), T?.(), E === void 0 && U(!1);
-	}, Se = (e, t) => {
-		e && N || (E === void 0 && U(e), te?.(e, t));
-	}, Ce = f(null), Q = d(), we = o({
-		"--color-picker-hue-gradient": `linear-gradient(to ${H ? "left" : "right"}, ${ee().join(", ")})`,
-		"--color-picker-alpha-gradient": `linear-gradient(to ${H ? "left" : "right"}, transparent, ${he})`
-	}), Te = (e) => Y({
+		(n === 6 || S && n === 8) && Se(t, !0);
+	}, we = () => {
+		X !== null && Se(X, !0), Z(null);
+	}, Te = () => {
+		G || me(null), T?.(), E === void 0 && U(!1);
+	}, Ee = (e, t) => {
+		e && N || (E === void 0 && U(e), ie?.(e, t));
+	}, De = p(null), Q = f(), Oe = o({
+		"--color-picker-hue-gradient": `linear-gradient(to ${H ? "left" : "right"}, ${ne().join(", ")})`,
+		"--color-picker-alpha-gradient": `linear-gradient(to ${H ? "left" : "right"}, transparent, ${ye})`
+	}), ke = (e) => Y({
 		...J,
 		s: e.s,
 		v: e.v
-	}, !1), Ee = (e) => Y({
+	}, !1), Ae = (e) => Y({
 		...J,
 		s: e.s,
 		v: e.v
-	}, !0), De = (C ?? []).map((e) => ({
+	}, !0), je = (C ?? []).map((e) => ({
 		...e,
 		hex: A(e.color, S)
-	})).filter((e) => e.hex !== null), Oe = [
+	})).filter((e) => e.hex !== null), Me = [
 		"color-picker",
 		M === "md" ? "" : `color-picker--${M}`,
-		P ? "color-picker--error" : "",
-		se ?? ""
-	].filter(Boolean).join(" "), ke = [Q, ie].filter(Boolean).join(" "), Ae = /* @__PURE__ */ h("button", {
-		ref: B,
-		id: re,
+		P ? "color-picker--error" : ""
+	].filter(Boolean).join(" "), Ne = L === void 0 && R === void 0, Pe = [Q, le].filter(Boolean).join(" "), Fe = p(null), Ie = d((e) => {
+		Fe.current = e, re(B, e);
+	}, [B]), Le = /* @__PURE__ */ g("button", {
+		ref: Ie,
+		id: oe,
 		type: "button",
-		className: "color-picker__trigger",
+		className: ["color-picker__trigger", Ne ? z : void 0].filter(Boolean).join(" "),
 		disabled: N,
-		"aria-label": I ?? (L ? void 0 : V("trigger")),
-		"aria-labelledby": I ? void 0 : L,
-		"aria-describedby": ke,
+		"aria-label": F ?? (I ? void 0 : V("trigger")),
+		"aria-labelledby": F ? void 0 : I,
+		"aria-describedby": Pe,
 		"aria-haspopup": "dialog",
 		"aria-expanded": W,
 		"aria-invalid": P || void 0,
-		children: [/* @__PURE__ */ m(s, {
+		children: [/* @__PURE__ */ h(s, {
 			color: K,
 			className: "color-picker__swatch"
-		}), /* @__PURE__ */ m(t, {
+		}), /* @__PURE__ */ h(t, {
 			id: Q,
 			children: K ? V("value")(q ?? K) : V("empty")
 		})]
-	}), je = R?.props ?? {}, Me = g({
-		render: R && c(R, {
-			disabled: N || je.disabled || void 0,
-			"aria-describedby": [ke, je["aria-describedby"]].filter(Boolean).join(" ")
+	}), Re = L?.props ?? {}, ze = _({
+		render: L && l(L, {
+			disabled: N || Re.disabled || void 0,
+			"aria-describedby": [Pe, Re["aria-describedby"]].filter(Boolean).join(" ")
 		}),
-		ref: B,
-		enabled: R !== void 0,
+		ref: Ie,
+		enabled: L !== void 0,
 		props: {
-			id: re,
-			"aria-label": I,
-			"aria-labelledby": I ? void 0 : L,
+			id: oe,
+			"aria-label": F,
+			"aria-labelledby": F ? void 0 : I,
 			"aria-haspopup": "dialog",
 			"aria-expanded": W,
 			"aria-invalid": P || void 0
 		}
 	}), $;
-	return Me ? $ = Me : z === void 0 && ($ = Ae), /* @__PURE__ */ h("div", {
-		className: Oe,
+	return ze ? $ = ze : R === void 0 && ($ = Le), /* @__PURE__ */ g("div", {
+		className: Me,
 		children: [
-			F && /* @__PURE__ */ m("input", {
-				type: "hidden",
-				name: F,
-				value: q ?? ""
+			/* @__PURE__ */ h(c, {
+				name: se,
+				value: q ?? "",
+				required: ce,
+				focusTarget: () => Fe.current
 			}),
-			R && /* @__PURE__ */ m(t, {
+			L && /* @__PURE__ */ h(t, {
 				id: Q,
 				children: K ? V("value")(q ?? K) : V("empty")
 			}),
-			/* @__PURE__ */ m(i, {
+			/* @__PURE__ */ h(i, {
 				trigger: $,
-				anchor: z,
-				label: V("dialog", ae),
+				anchor: R,
+				label: V("dialog", ue),
 				open: W,
-				onOpenChange: Se,
+				onOpenChange: Ee,
 				side: "bottom",
 				align: "start",
-				initialFocus: Ce,
-				className: "color-picker__popover",
-				children: /* @__PURE__ */ h("div", {
-					ref: we,
+				initialFocus: De,
+				className: ["color-picker__popover", Ne ? void 0 : z].filter(Boolean).join(" "),
+				children: /* @__PURE__ */ g("div", {
+					ref: Oe,
 					className: "color-picker__panel",
 					children: [
-						/* @__PURE__ */ m(x, {
-							ref: Ce,
+						/* @__PURE__ */ h(x, {
+							ref: De,
 							hueColor: k({
 								h: J.h,
 								s: 100,
@@ -337,13 +356,13 @@ var j = {
 							}, !1),
 							saturation: J.s,
 							brightness: J.v,
-							onChange: Te,
-							onCommit: Ee,
+							onChange: ke,
+							onCommit: Ae,
 							label: V("area"),
 							roleDescription: V("areaDescription"),
 							valueText: V("areaValue")(Math.round(J.s), Math.round(J.v))
 						}),
-						/* @__PURE__ */ m(a, {
+						/* @__PURE__ */ h(a, {
 							className: "color-picker__channel color-picker__channel--hue",
 							label: V("hue"),
 							min: 0,
@@ -354,7 +373,7 @@ var j = {
 								style: "unit",
 								unit: "degree"
 							},
-							locale: ne,
+							locale: ae,
 							onValueChange: (e) => Y({
 								...J,
 								h: e
@@ -364,7 +383,7 @@ var j = {
 								h: e
 							}, !0)
 						}),
-						S && /* @__PURE__ */ m(a, {
+						S && /* @__PURE__ */ h(a, {
 							className: "color-picker__channel color-picker__channel--alpha",
 							label: V("alpha"),
 							min: 0,
@@ -375,7 +394,7 @@ var j = {
 								style: "unit",
 								unit: "percent"
 							},
-							locale: ne,
+							locale: ae,
 							onValueChange: (e) => Y({
 								...J,
 								a: e / 100
@@ -385,7 +404,7 @@ var j = {
 								a: e / 100
 							}, !0)
 						}),
-						/* @__PURE__ */ m(r, {
+						/* @__PURE__ */ h(r, {
 							className: "color-picker__hex",
 							type: "text",
 							size: M,
@@ -393,36 +412,36 @@ var j = {
 							autoComplete: "off",
 							spellCheck: !1,
 							maxLength: S ? 9 : 7,
-							value: X ?? me,
-							onChange: ye,
-							onBlur: be,
+							value: X ?? ve,
+							onChange: Ce,
+							onBlur: we,
 							onKeyDown: (e) => {
-								e.key === "Enter" && (e.preventDefault(), be());
+								e.key === "Enter" && (e.preventDefault(), we());
 							}
 						}),
-						De.length > 0 && /* @__PURE__ */ m("div", {
+						je.length > 0 && /* @__PURE__ */ h("div", {
 							className: "color-picker__presets",
 							role: "group",
 							"aria-label": V("presets"),
-							children: De.map((e) => /* @__PURE__ */ m("button", {
+							children: je.map((e) => /* @__PURE__ */ h("button", {
 								type: "button",
 								className: "color-picker__preset",
 								title: e.title,
 								"aria-label": e.title,
-								"aria-pressed": e.hex === me,
+								"aria-pressed": e.hex === ve,
 								onClick: () => Y(O(e.hex) ?? j, !0),
-								children: /* @__PURE__ */ m(s, {
+								children: /* @__PURE__ */ h(s, {
 									color: e.hex,
 									className: "color-picker__preset-swatch"
 								})
 							}, `${e.hex}-${e.title}`))
 						}),
-						w && /* @__PURE__ */ m(n, {
+						w && /* @__PURE__ */ h(n, {
 							variant: "ghost",
 							size: "sm",
 							className: "color-picker__clear",
-							onClick: xe,
-							children: V("clear", oe)
+							onClick: Te,
+							children: V("clear", de)
 						})
 					]
 				})
@@ -431,4 +450,4 @@ var j = {
 	});
 });
 //#endregion
-export { te as t };
+export { ie as t };