@studiolxd/brand 39.0.0 → 40.1.0

package/dist/button.js

@@ -1,15 +1,15 @@
 'use client';
 import './button.css';
 import { n as e } from "./_shared/form-size.js";
-import { jsx as t } from "react/jsx-runtime";
-import { forwardRef as n } from "react";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
 import { useRender as r } from "@base-ui/react/use-render";
 //#region src/stories/atoms/Button/Button.tsx
-var i = n(function({ variant: n = "primary", tone: i = "accent", destructive: a = !1, size: o, block: s = !1, iconOnly: c = !1, children: l, type: u = "button", disabled: d, onClick: f, href: p, external: m = !1, render: h, className: g, ..._ }, v) {
+var i = t(function({ variant: t = "primary", tone: i = "accent", destructive: a = !1, size: o, block: s = !1, iconOnly: c = !1, children: l, type: u = "button", disabled: d, onClick: f, href: p, external: m = !1, render: h, className: g, ..._ }, v) {
 	let y = e(o), b = [
 		"button",
-		`button--${n}`,
-		n === "text" && i === "ink" ? "button--ink" : "",
+		`button--${t}`,
+		t === "text" && i === "ink" ? "button--ink" : "",
 		a ? "button--destructive-intent" : "",
 		y === "md" ? "" : `button--${y}`,
 		s === "mobile" ? "button--block-mobile" : s ? "button--block" : "",
@@ -33,7 +33,7 @@ var i = n(function({ variant: n = "primary", tone: i = "accent", destructive: a
 			..._,
 			children: l
 		}
-	}) || (p === void 0 ? /* @__PURE__ */ t("button", {
+	}) || (p === void 0 ? /* @__PURE__ */ n("button", {
 		ref: v,
 		className: b,
 		type: u,
@@ -41,7 +41,7 @@ var i = n(function({ variant: n = "primary", tone: i = "accent", destructive: a
 		onClick: f,
 		..._,
 		children: l
-	}) : /* @__PURE__ */ t("a", {
+	}) : /* @__PURE__ */ n("a", {
 		ref: v,
 		className: b,
 		href: d ? void 0 : p,

package/dist/calendar-planner.js

@@ -4,11 +4,11 @@ import { VisuallyHidden as e } from "./visually-hidden.js";
 import { Tag as t } from "./tag.js";
 import { Modal as n } from "./modal.js";
 import { c as r, i, l as a, n as o, o as s, r as c, s as l, t as u } from "./_shared/calendargrid.js";
-import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
-import { useCallback as m, useId as h, useState as g } from "react";
+import { useCallback as d, useId as f, useState as p } from "react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
 //#region src/stories/molecules/CalendarPlanner/CalendarPlanner.tsx
 function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b, showMoreDialog: x, onDayClick: S, month: C, defaultMonth: w, onMonthChange: T, navigable: E = !0, locale: D = "es-ES", previousMonthLabel: O = "Mes anterior", nextMonthLabel: k = "Mes siguiente", gridLabel: A, moreLabel: j = (e) => `+${e} más`, size: M = "md", className: N }) {
-	let [P, F] = g(() => C ?? w ?? /* @__PURE__ */ new Date()), [I, L] = g(null), R = x ?? !b, z = m(() => L(null), []), B = C ?? P, V = m((e) => {
+	let [P, F] = p(() => C ?? w ?? /* @__PURE__ */ new Date()), [I, L] = p(null), R = x ?? !b, z = d(() => L(null), []), B = C ?? P, V = d((e) => {
 		F(e), T?.(e);
 	}, [T]), H = /* @__PURE__ */ new Date(), U = M === "sm" ? "xs" : M === "lg" ? "md" : "sm", W = new Intl.DateTimeFormat(D, {
 		month: "long",
@@ -27,8 +27,8 @@ function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b
 		month: B,
 		onMonthChange: V,
 		onActivate: S ? (e) => S(e, Z(e)) : void 0
-	}), $ = `${h()}-planner-title-${B.getFullYear()}-${B.getMonth()}`;
-	return /* @__PURE__ */ p("div", {
+	}), $ = `${f()}-planner-title-${B.getFullYear()}-${B.getMonth()}`;
+	return /* @__PURE__ */ g("div", {
 		className: [
 			"calendar-planner",
 			`calendar-planner--${M}`,
@@ -46,7 +46,7 @@ function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b
 				onNext: () => V(X),
 				chevronSize: U
 			}),
-			/* @__PURE__ */ p("div", {
+			/* @__PURE__ */ g("div", {
 				className: "calendar-planner__grid",
 				role: "grid",
 				"aria-label": A,
@@ -56,7 +56,7 @@ function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b
 					block: "calendar-planner",
 					rowModifier: "header",
 					weekdays: q
-				}), J.map((n, r) => /* @__PURE__ */ f("div", {
+				}), J.map((n, r) => /* @__PURE__ */ h("div", {
 					role: "row",
 					className: "calendar-planner__row",
 					children: n.map(({ date: n, outside: r }) => {
@@ -69,7 +69,7 @@ function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b
 							a && "calendar-planner__day-number--today",
 							r && "calendar-planner__day-number--outside"
 						].filter(Boolean).join(" ");
-						return /* @__PURE__ */ p("div", {
+						return /* @__PURE__ */ g("div", {
 							ref: S ? Q.cellRef(n) : void 0,
 							role: "gridcell",
 							className: [l, S ? "calendar-planner__cell--clickable" : ""].filter(Boolean).join(" "),
@@ -77,18 +77,18 @@ function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b
 							tabIndex: S ? Q.isTabbable(n) ? 0 : -1 : void 0,
 							onFocus: S ? () => Q.onCellFocus(n) : void 0,
 							onClick: S ? () => S(n, o) : void 0,
-							children: [/* @__PURE__ */ p("span", {
+							children: [/* @__PURE__ */ g("span", {
 								className: u,
-								children: [/* @__PURE__ */ f(e, { children: G.format(n) }), /* @__PURE__ */ f("span", {
+								children: [/* @__PURE__ */ h(e, { children: G.format(n) }), /* @__PURE__ */ h("span", {
 									"aria-hidden": "true",
 									children: n.getDate()
 								})]
-							}), /* @__PURE__ */ f("div", {
+							}), /* @__PURE__ */ h("div", {
 								className: "calendar-planner__cell-body",
-								children: v ? v(n, o) : /* @__PURE__ */ p(d, { children: [s.map((e) => /* @__PURE__ */ f(t, {
+								children: v ? v(n, o) : /* @__PURE__ */ g(m, { children: [s.map((e) => /* @__PURE__ */ h(t, {
 									variant: e.variant ?? "neutral",
 									children: e.label
-								}, e.id)), c > 0 && /* @__PURE__ */ f("button", {
+								}, e.id)), c > 0 && /* @__PURE__ */ h("button", {
 									type: "button",
 									className: "calendar-planner__more",
 									onClick: (e) => {
@@ -104,13 +104,13 @@ function _({ events: _ = [], renderDay: v, maxItemsPerDay: y = 3, onMoreClick: b
 					})
 				}, r))]
 			}),
-			/* @__PURE__ */ f(n, {
+			/* @__PURE__ */ h(n, {
 				open: I !== null,
 				onClose: z,
 				title: I ? K.format(I.date) : void 0,
-				children: /* @__PURE__ */ f("div", {
+				children: /* @__PURE__ */ h("div", {
 					className: "calendar-planner__modal-events",
-					children: I?.events.map((e) => /* @__PURE__ */ f(t, {
+					children: I?.events.map((e) => /* @__PURE__ */ h(t, {
 						variant: e.variant ?? "neutral",
 						children: e.label
 					}, e.id))

package/dist/calendar.js

@@ -1,17 +1,17 @@
 'use client';
 import './calendar.css';
-import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s as ee, t as s } from "./_shared/calendargrid.js";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useCallback as u, useEffect as te, useId as ne, useRef as d, useState as f } from "react";
+import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s as ee, t as te } from "./_shared/calendargrid.js";
+import { useCallback as s, useEffect as c, useId as ne, useRef as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/stories/molecules/Calendar/Calendar.tsx
 var p = 12, m = 4;
 function h(e) {
 	return Math.floor(e / p) * p;
 }
-function g({ value: g, onChange: _, defaultMonth: v, month: y, onMonthChange: b, navigable: re = !0, disabledDates: x, minDate: S, maxDate: C, locale: w = "es-ES", previousMonthLabel: ie = "Mes anterior", nextMonthLabel: ae = "Mes siguiente", previousYearsLabel: T = "Años anteriores", nextYearsLabel: E = "Años siguientes", yearGridLabel: oe = "Elegir año", gridLabel: D, size: O = "md", className: k }) {
-	let [A, se] = f(() => y ?? v ?? (g instanceof Date ? g : /* @__PURE__ */ new Date())), j = y ?? A, M = u((e) => {
-		se(e), b?.(e);
-	}, [b]), N = /* @__PURE__ */ new Date(), ce = u((e) => S && e < S || C && e > C ? !0 : Array.isArray(x) ? x.some((t) => n(t, e)) : typeof x == "function" ? x(e) : !1, [
+function g({ value: g, onChange: _, defaultMonth: v, month: y, onMonthChange: b, navigable: re = !0, disabledDates: x, minDate: S, maxDate: C, locale: w = "es-ES", previousMonthLabel: T = "Mes anterior", nextMonthLabel: ie = "Mes siguiente", previousYearsLabel: ae = "Años anteriores", nextYearsLabel: oe = "Años siguientes", yearGridLabel: se = "Elegir año", gridLabel: E, size: D = "md", className: O }) {
+	let [k, A] = u(() => y ?? v ?? (g instanceof Date ? g : /* @__PURE__ */ new Date())), j = y ?? k, M = s((e) => {
+		A(e), b?.(e);
+	}, [b]), N = /* @__PURE__ */ new Date(), ce = s((e) => S && e < S || C && e > C ? !0 : Array.isArray(x) ? x.some((t) => n(t, e)) : typeof x == "function" ? x(e) : !1, [
 		x,
 		S,
 		C
@@ -21,32 +21,32 @@ function g({ value: g, onChange: _, defaultMonth: v, month: y, onMonthChange: b,
 		selected: g ?? null,
 		minDate: S,
 		maxDate: C
-	}), [F, I] = f("days"), [L, R] = f(() => h(j.getFullYear())), [z, B] = f(() => j.getFullYear()), V = d(null), H = d(/* @__PURE__ */ new Map()), U = d(null), W = u(() => {
+	}), [F, I] = u("days"), [L, R] = u(() => h(j.getFullYear())), [z, B] = u(() => j.getFullYear()), V = l(null), H = l(/* @__PURE__ */ new Map()), U = l(null), W = s(() => {
 		let e = j.getFullYear();
 		R(h(e)), B(e), U.current = "year", I("years");
-	}, [j]), G = u(() => {
+	}, [j]), G = s(() => {
 		U.current = "title", I("days");
-	}, []), K = u((e) => {
+	}, []), le = s((e) => {
 		M(new Date(e, j.getMonth(), 1)), G();
 	}, [
 		G,
 		j,
 		M
 	]);
-	te(() => {
+	c(() => {
 		if (!U.current) return;
 		let e = U.current;
 		U.current = null, e === "title" ? V.current?.focus() : H.current.get(z)?.focus();
 	}, [F, z]);
-	let le = O === "sm" ? "xs" : O === "lg" ? "md" : "sm", ue = new Intl.DateTimeFormat(w, {
+	let ue = D === "sm" ? "xs" : D === "lg" ? "md" : "sm", de = new Intl.DateTimeFormat(w, {
 		month: "long",
 		year: "numeric"
-	}).format(j), de = new Intl.DateTimeFormat(w, { year: "numeric" }), q = (e) => de.format(new Date(e, 0, 1)), fe = Array.from({ length: p }, (e, t) => L + t), pe = `${q(L)}–${q(L + p - 1)}`, me = new Intl.DateTimeFormat(w, {
+	}).format(j), fe = new Intl.DateTimeFormat(w, { year: "numeric" }), K = (e) => fe.format(new Date(e, 0, 1)), pe = Array.from({ length: p }, (e, t) => L + t), me = `${K(L)}–${K(L + p - 1)}`, he = new Intl.DateTimeFormat(w, {
 		weekday: "long",
 		day: "numeric",
 		month: "long",
 		year: "numeric"
-	}), he = o(w, "narrow"), ge = s(i(j)), J = t(j, -1), Y = t(j, 1), _e = S ? !e(J, S) && J < S : !1, ve = C ? !e(Y, C) && Y > C : !1, ye = (e) => (S ? e < S.getFullYear() : !1) || (C ? e > C.getFullYear() : !1), be = S ? L - 1 < S.getFullYear() : !1, xe = C ? L + p > C.getFullYear() : !1, X = F === "years", Z = z >= L && z <= L + p - 1 ? z : L, Se = (e) => {
+	}), ge = o(w, "narrow"), _e = te(i(j)), q = t(j, -1), J = t(j, 1), Y = S ? !e(q, S) && q < S : !1, ve = C ? !e(J, C) && J > C : !1, ye = (e) => (S ? e < S.getFullYear() : !1) || (C ? e > C.getFullYear() : !1), be = S ? L - 1 < S.getFullYear() : !1, xe = C ? L + p > C.getFullYear() : !1, X = F === "years", Z = z >= L && z <= L + p - 1 ? z : L, Se = (e) => {
 		(e < L || e > L + p - 1) && R(h(e)), U.current = "year", B(e);
 	}, Ce = (e) => {
 		let t = null;
@@ -82,38 +82,38 @@ function g({ value: g, onChange: _, defaultMonth: v, month: y, onMonthChange: b,
 		}
 		e.preventDefault(), Se(t);
 	}, Q = ne(), $ = X ? `${Q}-calendar-title-${L}` : `${Q}-calendar-title-${j.getFullYear()}-${j.getMonth()}`;
-	return /* @__PURE__ */ l("div", {
+	return /* @__PURE__ */ f("div", {
 		className: [
 			"calendar",
-			`calendar--${O}`,
-			k
+			`calendar--${D}`,
+			O
 		].filter(Boolean).join(" "),
 		children: [a({
 			block: "calendar",
-			title: X ? pe : ue,
+			title: X ? me : de,
 			titleId: $,
 			navigable: re,
-			previousLabel: X ? T : ie,
-			nextLabel: X ? E : ae,
-			prevDisabled: X ? be : _e,
+			previousLabel: X ? ae : T,
+			nextLabel: X ? oe : ie,
+			prevDisabled: X ? be : Y,
 			nextDisabled: X ? xe : ve,
-			onPrev: X ? () => R(L - p) : () => M(J),
-			onNext: X ? () => R(L + p) : () => M(Y),
-			chevronSize: le,
+			onPrev: X ? () => R(L - p) : () => M(q),
+			onNext: X ? () => R(L + p) : () => M(J),
+			chevronSize: ue,
 			onTitleClick: X ? G : W,
 			titleExpanded: X,
 			titleRef: V
-		}), X ? /* @__PURE__ */ c("div", {
+		}), X ? /* @__PURE__ */ d("div", {
 			className: "calendar__years",
 			role: "grid",
-			"aria-label": oe,
+			"aria-label": se,
 			onKeyDown: Ce,
-			children: Array.from({ length: p / m }, (e, t) => /* @__PURE__ */ c("div", {
+			children: Array.from({ length: p / m }, (e, t) => /* @__PURE__ */ d("div", {
 				role: "row",
 				className: "calendar__row",
-				children: fe.slice(t * m, t * m + m).map((e) => {
+				children: pe.slice(t * m, t * m + m).map((e) => {
 					let t = ye(e), n = e === N.getFullYear(), r = g instanceof Date ? g.getFullYear() === e : !1;
-					return /* @__PURE__ */ c("button", {
+					return /* @__PURE__ */ d("button", {
 						ref: (t) => {
 							t ? H.current.set(e, t) : H.current.delete(e);
 						},
@@ -130,21 +130,21 @@ function g({ value: g, onChange: _, defaultMonth: v, month: y, onMonthChange: b,
 						"aria-current": n ? "date" : void 0,
 						tabIndex: e === Z ? 0 : -1,
 						onFocus: () => B(e),
-						onClick: t ? void 0 : () => K(e),
-						children: q(e)
+						onClick: t ? void 0 : () => le(e),
+						children: K(e)
 					}, e);
 				})
 			}, t))
-		}) : /* @__PURE__ */ l("div", {
+		}) : /* @__PURE__ */ f("div", {
 			className: "calendar__grid",
 			role: "grid",
-			"aria-label": D,
-			"aria-labelledby": D ? void 0 : $,
+			"aria-label": E,
+			"aria-labelledby": E ? void 0 : $,
 			onKeyDown: P.onKeyDown,
 			children: [ee({
 				block: "calendar",
-				weekdays: he
-			}), ge.map((e, t) => /* @__PURE__ */ c("div", {
+				weekdays: ge
+			}), _e.map((e, t) => /* @__PURE__ */ d("div", {
 				role: "row",
 				className: "calendar__row",
 				children: e.map(({ date: e, outside: t }) => {
@@ -155,12 +155,12 @@ function g({ value: g, onChange: _, defaultMonth: v, month: y, onMonthChange: b,
 						a && "calendar__day--selected",
 						r && "calendar__day--disabled"
 					].filter(Boolean).join(" ");
-					return /* @__PURE__ */ c("button", {
+					return /* @__PURE__ */ d("button", {
 						ref: P.cellRef(e),
 						type: "button",
 						role: "gridcell",
 						className: o,
-						"aria-label": me.format(e),
+						"aria-label": he.format(e),
 						"aria-selected": a,
 						"aria-disabled": r ? "true" : void 0,
 						"aria-current": i ? "date" : void 0,

package/dist/card.js

@@ -4,11 +4,11 @@ import { VisuallyHidden as e } from "./visually-hidden.js";
 import { Arrow as t } from "./arrow.js";
 import { Heading as n } from "./heading.js";
 import { Paragraph as r } from "./paragraph.js";
-import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
-import { forwardRef as s } from "react";
+import { forwardRef as i } from "react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 import { useRender as c } from "@base-ui/react/use-render";
 //#region src/stories/molecules/Card/Card.tsx
-var l = s(function({ href: r, render: s, external: l = !1, title: u, description: d, ctaLabel: f, color: p = "outline", variant: m = "default", media: h, selectable: g = !1, selected: _ = !1, className: v, children: y, ...b }, x) {
+var l = i(function({ href: r, render: i, external: l = !1, title: u, description: d, ctaLabel: f, color: p = "outline", variant: m = "default", media: h, selectable: g = !1, selected: _ = !1, className: v, children: y, ...b }, x) {
 	let S = [
 		"card",
 		`card--${p}`,
@@ -16,40 +16,40 @@ var l = s(function({ href: r, render: s, external: l = !1, title: u, description
 		g ? "card--selectable" : "",
 		g && _ ? "card--selected" : "",
 		v ?? ""
-	].filter(Boolean).join(" "), C = /* @__PURE__ */ o(i, { children: [
-		u !== void 0 && /* @__PURE__ */ a(n, {
+	].filter(Boolean).join(" "), C = /* @__PURE__ */ s(a, { children: [
+		u !== void 0 && /* @__PURE__ */ o(n, {
 			level: 2,
 			size: 8,
 			children: u
 		}),
-		d && (typeof d == "string" ? /* @__PURE__ */ a("p", { children: d }) : d),
+		d && (typeof d == "string" ? /* @__PURE__ */ o("p", { children: d }) : d),
 		y,
-		f !== void 0 && /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a(e, { children: f }), /* @__PURE__ */ a(t, { size: "lg" })] })
-	] }), w = h && /* @__PURE__ */ a("div", {
+		f !== void 0 && /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o(e, { children: f }), /* @__PURE__ */ o(t, { size: "lg" })] })
+	] }), w = h && /* @__PURE__ */ o("div", {
 		className: "card__media",
-		children: /* @__PURE__ */ a("img", {
+		children: /* @__PURE__ */ o("img", {
 			src: h.src,
 			alt: h.alt
 		})
-	}), T = m === "default" && !h ? C : /* @__PURE__ */ o(i, { children: [w, /* @__PURE__ */ a("div", {
+	}), T = m === "default" && !h ? C : /* @__PURE__ */ s(a, { children: [w, /* @__PURE__ */ o("div", {
 		className: "card__body",
 		children: C
 	})] });
 	return c({
-		render: s,
+		render: i,
 		ref: x,
-		enabled: s !== void 0,
+		enabled: i !== void 0,
 		props: {
 			className: S,
 			...b,
 			children: T
 		}
-	}) || (r === void 0 ? /* @__PURE__ */ a("div", {
+	}) || (r === void 0 ? /* @__PURE__ */ o("div", {
 		ref: x,
 		className: S,
 		...b,
 		children: y
-	}) : /* @__PURE__ */ a("a", {
+	}) : /* @__PURE__ */ o("a", {
 		ref: x,
 		href: r,
 		className: S,
@@ -60,23 +60,23 @@ var l = s(function({ href: r, render: s, external: l = !1, title: u, description
 		...b,
 		children: T
 	}));
-}), u = s(function({ className: e, ...t }, n) {
-	return /* @__PURE__ */ a("div", {
+}), u = i(function({ className: e, ...t }, n) {
+	return /* @__PURE__ */ o("div", {
 		ref: n,
 		className: ["card__header", e].filter(Boolean).join(" "),
 		...t
 	});
-}), d = s(function({ level: e = 3, size: t = 4, className: r, children: i, ...o }, s) {
-	return /* @__PURE__ */ a(n, {
+}), d = i(function({ level: e = 3, size: t = 4, className: r, children: i, ...a }, s) {
+	return /* @__PURE__ */ o(n, {
 		ref: s,
 		level: e,
 		size: t,
 		className: ["card__title", r].filter(Boolean).join(" "),
-		...o,
+		...a,
 		children: i
 	});
-}), f = s(function({ size: e = "small", lines: t, className: n, children: i, ...o }, s) {
-	return /* @__PURE__ */ a(r, {
+}), f = i(function({ size: e = "small", lines: t, className: n, children: i, ...a }, s) {
+	return /* @__PURE__ */ o(r, {
 		ref: s,
 		size: e,
 		className: [
@@ -84,23 +84,23 @@ var l = s(function({ href: r, render: s, external: l = !1, title: u, description
 			t ? `card__description--lines-${t}` : "",
 			n
 		].filter(Boolean).join(" "),
-		...o,
+		...a,
 		children: i
 	});
-}), p = s(function({ className: e, ...t }, n) {
-	return /* @__PURE__ */ a("div", {
+}), p = i(function({ className: e, ...t }, n) {
+	return /* @__PURE__ */ o("div", {
 		ref: n,
 		className: ["card__action", e].filter(Boolean).join(" "),
 		...t
 	});
-}), m = s(function({ className: e, ...t }, n) {
-	return /* @__PURE__ */ a("div", {
+}), m = i(function({ className: e, ...t }, n) {
+	return /* @__PURE__ */ o("div", {
 		ref: n,
 		className: ["card__content", e].filter(Boolean).join(" "),
 		...t
 	});
-}), h = s(function({ direction: e = "row", className: t, ...n }, r) {
-	return /* @__PURE__ */ a("div", {
+}), h = i(function({ direction: e = "row", className: t, ...n }, r) {
+	return /* @__PURE__ */ o("div", {
 		ref: r,
 		className: [
 			"card__footer",

package/dist/carousel.js

@@ -4,11 +4,11 @@ import { Icon as e } from "./icon.js";
 import { VisuallyHidden as t } from "./visually-hidden.js";
 import { Button as n } from "./button.js";
 import { t as r } from "./_shared/css-properties.js";
-import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Children as s, useCallback as c, useEffect as l, useRef as u, useState as d } from "react";
+import { Children as i, useCallback as a, useEffect as o, useRef as s, useState as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/stories/molecules/Carousel/Carousel.tsx
 function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel", trackLabel: h = "Diapositivas", slideSize: g, controls: _ = !0, indicators: v = !1, autoplay: y, prevLabel: b = "Anterior", nextLabel: x = "Siguiente", indicatorLabel: S = (e) => `Ir a la diapositiva ${e + 1}`, pauseLabel: C = "Pausar", playLabel: w = "Reproducir", slideStatusLabel: T = (e, t) => `Diapositiva ${e + 1} de ${t}`, className: E, id: D }) {
-	let O = u(null), [k, A] = d(0), j = u(0), [M, N] = d(!1), [P, F] = d(!1), I = s.count(f), L = y !== void 0 && !P, R = (e) => Array.from(e.children), z = c((e) => {
+	let O = s(null), [k, A] = c(0), j = s(0), [M, N] = c(!1), [P, F] = c(!1), I = i.count(f), L = y !== void 0 && !P, R = (e) => Array.from(e.children), z = a((e) => {
 		let t = O.current;
 		if (!t) return;
 		let n = R(t);
@@ -19,7 +19,7 @@ function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel"
 			behavior: i ? "auto" : "smooth"
 		});
 	}, []);
-	l(() => {
+	o(() => {
 		let e = O.current;
 		if (!e) return;
 		let t = () => {
@@ -32,7 +32,7 @@ function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel"
 			}), j.current = r, A(r);
 		};
 		return t(), e.addEventListener("scroll", t, { passive: !0 }), () => e.removeEventListener("scroll", t);
-	}, [f]), l(() => {
+	}, [f]), o(() => {
 		if (!y || P || M || I < 2 || window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
 		let e = window.setInterval(() => z(j.current + 1), y);
 		return () => window.clearInterval(e);
@@ -46,7 +46,7 @@ function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel"
 	let B = (e) => {
 		e.key === "ArrowRight" ? (e.preventDefault(), z(k + 1)) : e.key === "ArrowLeft" && (e.preventDefault(), z(k - 1));
 	};
-	return /* @__PURE__ */ o("div", {
+	return /* @__PURE__ */ d("div", {
 		id: D,
 		ref: r({ "--carousel-slide-size": g }),
 		className: ["carousel", E].filter(Boolean).join(" "),
@@ -58,7 +58,7 @@ function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel"
 		onFocus: () => N(!0),
 		onBlur: () => N(!1),
 		children: [
-			/* @__PURE__ */ a("div", {
+			/* @__PURE__ */ u("div", {
 				ref: O,
 				className: "carousel__track",
 				tabIndex: 0,
@@ -67,44 +67,44 @@ function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel"
 				onKeyDown: B,
 				children: f
 			}),
-			/* @__PURE__ */ a(t, {
+			/* @__PURE__ */ u(t, {
 				as: "div",
 				role: "status",
 				"aria-live": L ? "off" : "polite",
 				"aria-atomic": "true",
 				children: T(k, I)
 			}),
-			(_ || v || y !== void 0) && /* @__PURE__ */ o("div", {
+			(_ || v || y !== void 0) && /* @__PURE__ */ d("div", {
 				className: "carousel__controls",
-				children: [v && /* @__PURE__ */ a("div", {
+				children: [v && /* @__PURE__ */ u("div", {
 					className: "carousel__indicators",
-					children: Array.from({ length: I }, (e, t) => /* @__PURE__ */ a("button", {
+					children: Array.from({ length: I }, (e, t) => /* @__PURE__ */ u("button", {
 						type: "button",
 						className: "carousel__indicator",
 						"aria-label": S(t),
 						"aria-current": t === k ? "true" : void 0,
 						onClick: () => z(t)
 					}, t))
-				}), (_ || y !== void 0) && /* @__PURE__ */ o("div", {
+				}), (_ || y !== void 0) && /* @__PURE__ */ d("div", {
 					className: "carousel__buttons",
-					children: [y !== void 0 && /* @__PURE__ */ a(n, {
+					children: [y !== void 0 && /* @__PURE__ */ u(n, {
 						variant: "ghost",
 						iconOnly: !0,
 						"aria-label": L ? C : w,
 						onClick: () => F((e) => !e),
-						children: /* @__PURE__ */ a(e, { name: L ? "pause" : "play" })
-					}), _ && /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a(n, {
+						children: /* @__PURE__ */ u(e, { name: L ? "pause" : "play" })
+					}), _ && /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(n, {
 						variant: "ghost",
 						iconOnly: !0,
 						"aria-label": b,
 						onClick: () => z(k - 1),
-						children: /* @__PURE__ */ a(e, { name: "arrow-left" })
-					}), /* @__PURE__ */ a(n, {
+						children: /* @__PURE__ */ u(e, { name: "arrow-left" })
+					}), /* @__PURE__ */ u(n, {
 						variant: "ghost",
 						iconOnly: !0,
 						"aria-label": x,
 						onClick: () => z(k + 1),
-						children: /* @__PURE__ */ a(e, { name: "arrow" })
+						children: /* @__PURE__ */ u(e, { name: "arrow" })
 					})] })]
 				})]
 			})
@@ -112,7 +112,7 @@ function f({ children: f, label: p = "Carrusel", roleDescription: m = "carrusel"
 	});
 }
 function p({ roleDescription: e = "diapositiva", className: t, children: n, ...r }) {
-	return /* @__PURE__ */ a("div", {
+	return /* @__PURE__ */ u("div", {
 		className: ["carousel__slide", t].filter(Boolean).join(" "),
 		role: "group",
 		"aria-roledescription": e,