@studiolxd/brand 49.28.0 → 50.0.0

package/dist/skeleton.js

@@ -1,18 +1,20 @@
 import './skeleton.css';
-import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
 //#region src/stories/atoms/Skeleton/Skeleton.tsx
-function t({ width: t, height: n, circle: r = !1, className: i, ...a }) {
-	return /* @__PURE__ */ e("svg", {
+var n = e(function({ width: e, height: n, circle: r = !1, className: i, ...a }, o) {
+	return /* @__PURE__ */ t("svg", {
+		ref: o,
 		"aria-hidden": "true",
 		className: [
 			"skeleton",
 			r ? "skeleton--circle" : "",
 			i
 		].filter(Boolean).join(" "),
-		width: t,
+		width: e,
 		height: n,
 		...a
 	});
-}
+});
 //#endregion
-export { t as Skeleton };
+export { n as Skeleton };

package/dist/sortable.js

@@ -1,26 +1,27 @@
 'use client';
 import './sortable.css';
-import { t as e } from "./_shared/css-properties.js";
-import { forwardRef as t, useCallback as n } from "react";
-import { jsx as r } from "react/jsx-runtime";
+import { t as e } from "./_shared/assign-ref.js";
+import { t } from "./_shared/css-properties.js";
+import { forwardRef as n, useCallback as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
 //#region src/stories/atoms/Sortable/Sortable.tsx
-var i = t(function({ as: t = "div", transform: i, transition: a, dragging: o = !1, className: s, children: c, ...l }, u) {
-	let d = e({
-		"--sortable-x": i ? `${i.x}px` : void 0,
-		"--sortable-y": i ? `${i.y}px` : void 0,
-		"--sortable-scale-x": i?.scaleX === void 0 ? void 0 : String(i.scaleX),
-		"--sortable-scale-y": i?.scaleY === void 0 ? void 0 : String(i.scaleY),
-		"--sortable-transition": a ?? void 0
+var a = n(function({ as: n = "div", transform: a, transition: o, dragging: s = !1, className: c, children: l, ...u }, d) {
+	let f = t({
+		"--sortable-x": a ? `${a.x}px` : void 0,
+		"--sortable-y": a ? `${a.y}px` : void 0,
+		"--sortable-scale-x": a?.scaleX === void 0 ? void 0 : String(a.scaleX),
+		"--sortable-scale-y": a?.scaleY === void 0 ? void 0 : String(a.scaleY),
+		"--sortable-transition": o ?? void 0
 	});
-	return /* @__PURE__ */ r(t, {
-		ref: n((e) => {
-			d(e), typeof u == "function" ? u(e) : u && (u.current = e);
-		}, [d, u]),
-		className: ["sortable", s].filter(Boolean).join(" "),
-		"data-dragging": o ? "" : void 0,
-		...l,
-		children: c
+	return /* @__PURE__ */ i(n, {
+		ref: r((t) => {
+			f(t), e(d, t);
+		}, [f, d]),
+		className: ["sortable", c].filter(Boolean).join(" "),
+		"data-dragging": s ? "" : void 0,
+		...u,
+		children: l
 	});
 });
 //#endregion
-export { i as Sortable };
+export { a as Sortable };

package/dist/spinner.js

@@ -19,19 +19,23 @@ function i() {
 		})
 	});
 }
-function a({ size: a = "md", label: o, "aria-hidden": s }) {
-	let c = e("spinner");
+function a({ size: a = "md", label: o, "aria-hidden": s, className: c }) {
+	let l = e("spinner"), u = [
+		"spinner",
+		`spinner--${a}`,
+		c
+	].filter(Boolean).join(" ");
 	if (s) return /* @__PURE__ */ n("span", {
-		className: `spinner spinner--${a}`,
+		className: u,
 		"aria-hidden": "true",
 		children: /* @__PURE__ */ n(i, {})
 	});
-	let l = c("label", o);
+	let d = l("label", o);
 	return /* @__PURE__ */ r("span", {
-		className: `spinner spinner--${a}`,
+		className: u,
 		role: "status",
-		"aria-label": l,
-		children: [/* @__PURE__ */ n(i, {}), /* @__PURE__ */ n(t, { children: l })]
+		"aria-label": d,
+		children: [/* @__PURE__ */ n(i, {}), /* @__PURE__ */ n(t, { children: d })]
 	});
 }
 //#endregion

package/dist/stat-tile.js

@@ -1,59 +1,57 @@
+'use client';
 import './stat-tile.css';
-import { Icon as e } from "./icon.js";
-import { VisuallyHidden as t } from "./visually-hidden.js";
-import { Tag as n } from "./tag.js";
-import { forwardRef as r } from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Icon as t } from "./icon.js";
+import { VisuallyHidden as n } from "./visually-hidden.js";
+import { Tag as r } from "./tag.js";
+import { forwardRef as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/stories/molecules/StatTile/StatTile.tsx
-var o = {
+var s = {
 	up: "positive",
 	down: "negative",
 	flat: "neutral"
-}, s = {
+}, c = {
 	positive: "success",
 	negative: "danger",
 	neutral: "neutral"
-}, c = {
-	up: "Sube",
-	down: "Baja",
-	flat: "Sin cambio"
-}, l = r(function({ label: r, value: l, delta: u, description: d, icon: f, size: p = "md", className: m, ...h }, g) {
-	let _ = [
+}, l = i(function({ label: i, value: l, delta: u, description: d, icon: f, size: p = "md", className: m, ...h }, g) {
+	let _ = e("statTile"), v = [
 		"stat-tile",
 		p === "md" ? "" : `stat-tile--${p}`,
 		m ?? ""
-	].filter(Boolean).join(" "), v = u?.direction ?? "flat", y = u?.tone ?? o[v], b = u?.label ?? c[v];
-	return /* @__PURE__ */ a("div", {
+	].filter(Boolean).join(" "), y = u?.direction ?? "flat", b = u?.tone ?? s[y];
+	return /* @__PURE__ */ o("div", {
 		ref: g,
-		className: _,
+		className: v,
 		...h,
 		children: [
-			/* @__PURE__ */ a("p", {
+			/* @__PURE__ */ o("p", {
 				className: "stat-tile__label",
-				children: [f && /* @__PURE__ */ i("span", {
+				children: [f && /* @__PURE__ */ a("span", {
 					className: "stat-tile__icon",
 					"aria-hidden": "true",
 					children: f
-				}), r]
+				}), i]
 			}),
-			/* @__PURE__ */ i("p", {
+			/* @__PURE__ */ a("p", {
 				className: "stat-tile__value",
 				children: l
 			}),
-			u && /* @__PURE__ */ a(n, {
-				variant: s[y],
+			u && /* @__PURE__ */ o(r, {
+				variant: c[b],
 				className: "stat-tile__delta",
 				children: [
-					/* @__PURE__ */ i(e, {
+					/* @__PURE__ */ a(t, {
 						name: "arrow",
 						size: "sm",
-						className: `stat-tile__delta-icon stat-tile__delta-icon--${v}`
+						className: `stat-tile__delta-icon stat-tile__delta-icon--${y}`
 					}),
-					/* @__PURE__ */ i(t, { children: b }),
+					/* @__PURE__ */ a(n, { children: _(y, u.label) }),
 					u.value
 				]
 			}),
-			d && /* @__PURE__ */ i("p", {
+			d && /* @__PURE__ */ a("p", {
 				className: "stat-tile__description",
 				children: d
 			})

package/dist/switcher.css

@@ -1 +1 @@
-.switcher{all:unset;box-sizing:border-box;width:var(--switcher-track-width);height:var(--switcher-track-height);padding-inline:var(--switcher-track-padding);border-radius:var(--switcher-track-border-radius);background-color:var(--switcher-track-bg);cursor:var(--switcher-cursor);transition:background-color var(--switcher-transition-duration) var(--switcher-transition-easing);flex-shrink:0;align-items:center;display:inline-flex;position:relative}.switcher:after{content:"";inline-size:max(100%, var(--switcher-target-size));block-size:max(100%, var(--switcher-target-size));position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}.switcher[data-checked]{background-color:var(--switcher-track-bg-checked)}.switcher__thumb{width:var(--switcher-thumb-size);height:var(--switcher-thumb-size);border-radius:var(--switcher-thumb-border-radius);background-color:var(--switcher-thumb-bg);transition:transform var(--switcher-transition-duration) var(--switcher-transition-easing);will-change:transform;display:block}.switcher[data-checked] .switcher__thumb{transform:translateX(calc(var(--switcher-track-width) - var(--switcher-track-padding) * 2 - var(--switcher-thumb-size)))}.switcher.switcher--error{outline:var(--switcher-error-ring-width) solid var(--switcher-error-ring-color);outline-offset:var(--switcher-error-ring-offset)}.switcher:focus-visible{outline:var(--switcher-focus-ring-width) solid var(--switcher-focus-ring-color);outline-offset:var(--switcher-focus-ring-offset)}.switcher[data-disabled]{opacity:var(--switcher-disabled-opacity);cursor:var(--switcher-disabled-cursor);pointer-events:none}.switcher.switcher--sm{--switcher-track-width:var(--switcher-sm-track-width);--switcher-track-height:var(--switcher-sm-track-height);--switcher-thumb-size:var(--switcher-sm-thumb-size)}.switcher.switcher--lg{--switcher-track-width:var(--switcher-lg-track-width);--switcher-track-height:var(--switcher-lg-track-height);--switcher-thumb-size:var(--switcher-lg-thumb-size)}
+.switcher{all:unset;box-sizing:border-box;inline-size:var(--switcher-track-width);block-size:var(--switcher-track-height);padding-inline:var(--switcher-track-padding);border-radius:var(--switcher-track-border-radius);background-color:var(--switcher-track-bg);cursor:var(--switcher-cursor);transition:background-color var(--switcher-transition-duration) var(--switcher-transition-easing);flex-shrink:0;align-items:center;display:inline-flex;position:relative}.switcher:after{content:"";inline-size:max(100%, var(--switcher-target-size));block-size:max(100%, var(--switcher-target-size));position:absolute;inset-block-start:50%;inset-inline-start:50%;translate:-50% -50%}.switcher[data-checked]{background-color:var(--switcher-track-bg-checked)}.switcher__thumb{inline-size:var(--switcher-thumb-size);block-size:var(--switcher-thumb-size);border-radius:var(--switcher-thumb-border-radius);background-color:var(--switcher-thumb-bg);transition:transform var(--switcher-transition-duration) var(--switcher-transition-easing);will-change:transform;display:block}.switcher[data-checked] .switcher__thumb{transform:translateX(calc(var(--switcher-track-width) - var(--switcher-track-padding) * 2 - var(--switcher-thumb-size)))}.switcher.switcher--error{outline:var(--switcher-error-ring-width) solid var(--switcher-error-ring-color);outline-offset:var(--switcher-error-ring-offset)}.switcher:focus-visible{outline:var(--switcher-focus-ring-width) solid var(--switcher-focus-ring-color);outline-offset:var(--switcher-focus-ring-offset)}.switcher[data-disabled]{opacity:var(--switcher-disabled-opacity);cursor:var(--switcher-disabled-cursor);pointer-events:none}.switcher.switcher--sm{--switcher-track-width:var(--switcher-sm-track-width);--switcher-track-height:var(--switcher-sm-track-height);--switcher-thumb-size:var(--switcher-sm-thumb-size)}.switcher.switcher--lg{--switcher-track-width:var(--switcher-lg-track-width);--switcher-track-height:var(--switcher-lg-track-height);--switcher-thumb-size:var(--switcher-lg-thumb-size)}

package/dist/table.css

@@ -1 +1 @@
-.table__wrapper{width:100%;overflow-x:auto}.table{border-collapse:collapse;width:100%;font-family:var(--table-font-family);font-size:var(--table-font-size);font-weight:var(--table-font-weight);line-height:var(--table-line-height);color:var(--table-color);background:var(--table-bg)}.table__header{padding-block:var(--table-header-padding-block);padding-inline:var(--table-header-padding-inline);font-weight:var(--table-header-font-weight);text-align:left;border-bottom-width:var(--table-header-border-width);border-bottom-style:solid;border-bottom-color:var(--table-header-border-color);white-space:nowrap}.table__header-content{align-items:center;gap:var(--table-header-content-gap);font:inherit;color:inherit;text-align:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;margin:0;padding:0;display:inline-flex}.table__header-content:focus-visible{outline:var(--table-focus-ring-width) solid var(--table-focus-ring-color);outline-offset:var(--table-focus-ring-offset)}.table__sort-icon{color:var(--table-sort-icon-color);transition:transform var(--table-transition-duration) var(--table-transition-easing), color var(--table-transition-duration) var(--table-transition-easing);flex-shrink:0;transform:rotate(90deg)}.table__header-content:hover .table__sort-icon{color:var(--table-sort-icon-active-color)}.table__header--sorted-asc .table__sort-icon{color:var(--table-sort-icon-active-color);transform:rotate(-90deg)}.table__header--sorted-desc .table__sort-icon{color:var(--table-sort-icon-active-color);transform:rotate(90deg)}.table__row{transition:box-shadow var(--table-transition-duration) var(--table-transition-easing), color var(--table-transition-duration) var(--table-transition-easing)}.table tbody .table__row:last-child .table__cell,.table tbody .table__row:last-child .table__header{border-bottom:none}.table__row.table__row--selected{color:var(--table-row-selected-color);font-weight:var(--table-row-selected-font-weight)}.table__row.table__row--interactive{cursor:pointer}.table__row.table__row--interactive:hover{box-shadow:inset var(--table-row-hover-marker-width) 0 0 var(--table-row-hover-marker-color)}.table__row.table__row--interactive:focus-visible{outline:var(--table-focus-ring-width) solid var(--table-focus-ring-color);outline-offset:calc(var(--table-focus-ring-offset) * -1)}.table tfoot{background-color:var(--table-footer-bg);border-top-width:var(--table-footer-border-width);border-top-style:solid;border-top-color:var(--table-footer-border-color)}.table tfoot .table__cell{font-weight:var(--table-footer-font-weight)}.table__cell{padding-block:var(--table-cell-padding-block);padding-inline:var(--table-cell-padding-inline);border-bottom-width:var(--table-border-width);border-bottom-style:solid;border-bottom-color:var(--table-row-border-color)}.table__header.table__header--actions{width:1px}.table__cell.table__cell--actions,.table__cell.table__cell--nowrap,.table__header.table__header--nowrap{white-space:nowrap}.table__header.table__header--sticky,.table__cell.table__cell--sticky{z-index:1;background-color:var(--table-sticky-bg);position:sticky;inset-inline-end:0}.table.table--sm{font-size:var(--table-sm-font-size)}.table.table--sm .table__header{padding-block:var(--table-sm-header-padding-block);padding-inline:var(--table-sm-header-padding-inline)}.table.table--sm .table__cell{padding-block:var(--table-sm-cell-padding-block);padding-inline:var(--table-sm-cell-padding-inline)}
+.table__wrapper{inline-size:100%;overflow-x:auto}.table{border-collapse:collapse;inline-size:100%;font-family:var(--table-font-family);font-size:var(--table-font-size);font-weight:var(--table-font-weight);line-height:var(--table-line-height);color:var(--table-color);background:var(--table-bg)}.table__header{padding-block:var(--table-header-padding-block);padding-inline:var(--table-header-padding-inline);font-weight:var(--table-header-font-weight);text-align:start;border-block-end-width:var(--table-header-border-width);border-block-end-style:solid;border-block-end-color:var(--table-header-border-color);white-space:nowrap}.table__header-content{align-items:center;gap:var(--table-header-content-gap);font:inherit;color:inherit;text-align:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:none;margin:0;padding:0;display:inline-flex}.table__wrapper:focus-visible,.table__header-content:focus-visible{outline:var(--table-focus-ring-width) solid var(--table-focus-ring-color);outline-offset:var(--table-focus-ring-offset)}.table__sort-icon{color:var(--table-sort-icon-color);transition:transform var(--table-transition-duration) var(--table-transition-easing), color var(--table-transition-duration) var(--table-transition-easing);flex-shrink:0;transform:rotate(90deg)}.table__header-content:hover .table__sort-icon{color:var(--table-sort-icon-active-color)}.table__header--sorted-asc .table__sort-icon{color:var(--table-sort-icon-active-color);transform:rotate(-90deg)}.table__header--sorted-desc .table__sort-icon{color:var(--table-sort-icon-active-color);transform:rotate(90deg)}.table__row{transition:box-shadow var(--table-transition-duration) var(--table-transition-easing), color var(--table-transition-duration) var(--table-transition-easing)}.table tbody .table__row:last-child .table__cell,.table tbody .table__row:last-child .table__header{border-block-end:none}.table__row.table__row--selected{color:var(--table-row-selected-color);font-weight:var(--table-row-selected-font-weight)}.table__row.table__row--interactive{cursor:pointer}.table__row.table__row--interactive:hover{box-shadow:inset var(--table-row-hover-marker-width) 0 0 var(--table-row-hover-marker-color)}.table__row.table__row--interactive:focus-visible{outline:var(--table-focus-ring-width) solid var(--table-focus-ring-color);outline-offset:calc(var(--table-focus-ring-offset) * -1)}.table tfoot{background-color:var(--table-footer-bg);border-block-start-width:var(--table-footer-border-width);border-block-start-style:solid;border-block-start-color:var(--table-footer-border-color)}.table tfoot .table__cell{font-weight:var(--table-footer-font-weight)}.table__cell{padding-block:var(--table-cell-padding-block);padding-inline:var(--table-cell-padding-inline);border-block-end-width:var(--table-border-width);border-block-end-style:solid;border-block-end-color:var(--table-row-border-color)}.table__header.table__header--actions{inline-size:var(--table-actions-inline-size)}.table__cell.table__cell--actions,.table__cell.table__cell--nowrap,.table__header.table__header--nowrap{white-space:nowrap}.table__header.table__header--sticky,.table__cell.table__cell--sticky{z-index:1;background-color:var(--table-sticky-bg);position:sticky;inset-inline-end:0}.table.table--sm{font-size:var(--table-sm-font-size)}.table.table--sm .table__header{padding-block:var(--table-sm-header-padding-block);padding-inline:var(--table-sm-header-padding-inline)}.table.table--sm .table__cell{padding-block:var(--table-sm-cell-padding-block);padding-inline:var(--table-sm-cell-padding-inline)}

package/dist/table.js

@@ -3,121 +3,133 @@ import './table.css';
 import { n as e } from "./_shared/brandmessagescontext.js";
 import { Icon as t } from "./icon.js";
 import { VisuallyHidden as n } from "./visually-hidden.js";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { t as r } from "./_shared/overflow-focusable.js";
+import { useId as i, useRef as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/stories/molecules/Table/Table.tsx
-function a({ children: e, ...t }) {
-	return /* @__PURE__ */ r("thead", {
+function c({ children: e, ...t }) {
+	return /* @__PURE__ */ o("thead", {
 		...t,
 		children: e
 	});
 }
-function o({ children: e, ...t }) {
-	return /* @__PURE__ */ r("tfoot", {
+function l({ children: e, ...t }) {
+	return /* @__PURE__ */ o("tfoot", {
 		...t,
 		children: e
 	});
 }
-function s({ children: e, ...t }) {
-	return /* @__PURE__ */ r("tbody", {
+function u({ children: e, ...t }) {
+	return /* @__PURE__ */ o("tbody", {
 		...t,
 		children: e
 	});
 }
-function c({ sortable: a = !1, sorted: o = !1, onSort: s, actions: c = !1, actionsLabel: l, sortedAscLabel: u, sortedDescLabel: d, sortableLabel: f, sticky: p, nowrap: m = !1, children: h, className: g, scope: _ = "col", ...v }) {
+function d({ sortable: r = !1, sorted: i = !1, onSort: a, actions: c = !1, actionsLabel: l, sortedAscLabel: u, sortedDescLabel: d, sortableLabel: f, sticky: p, nowrap: m = !1, children: h, className: g, scope: _ = "col", ...v }) {
 	let y = e("table"), b = [
 		"table__header",
-		a ? "table__header--sortable" : "",
-		o === "asc" ? "table__header--sorted-asc" : "",
-		o === "desc" ? "table__header--sorted-desc" : "",
+		r ? "table__header--sortable" : "",
+		i === "asc" ? "table__header--sorted-asc" : "",
+		i === "desc" ? "table__header--sorted-desc" : "",
 		c ? "table__header--actions" : "",
 		p === "end" ? "table__header--sticky" : "",
 		m ? "table__header--nowrap" : "",
 		g
 	].filter(Boolean).join(" ");
-	return a ? /* @__PURE__ */ i("th", {
+	return r ? /* @__PURE__ */ s("th", {
 		...v,
 		scope: _,
 		className: b,
-		"aria-sort": o === "asc" ? "ascending" : o === "desc" ? "descending" : "none",
-		children: [/* @__PURE__ */ i("button", {
+		"aria-sort": i === "asc" ? "ascending" : i === "desc" ? "descending" : "none",
+		children: [/* @__PURE__ */ s("button", {
 			type: "button",
 			className: "table__header-content",
-			onClick: s,
-			children: [h, /* @__PURE__ */ r(t, {
+			onClick: a,
+			children: [h, /* @__PURE__ */ o(t, {
 				name: "chevron",
 				size: "sm",
 				className: "table__sort-icon"
 			})]
-		}), /* @__PURE__ */ r(n, { children: o === "asc" ? y("sortedAscending", u) : o === "desc" ? y("sortedDescending", d) : y("sortable", f) })]
-	}) : c ? /* @__PURE__ */ r("th", {
+		}), /* @__PURE__ */ o(n, { children: i === "asc" ? y("sortedAscending", u) : i === "desc" ? y("sortedDescending", d) : y("sortable", f) })]
+	}) : c ? /* @__PURE__ */ o("th", {
 		...v,
 		scope: _,
 		className: b,
-		children: /* @__PURE__ */ r(n, { children: h ?? y("actions", l) })
-	}) : /* @__PURE__ */ r("th", {
+		children: /* @__PURE__ */ o(n, { children: h ?? y("actions", l) })
+	}) : /* @__PURE__ */ o("th", {
 		...v,
 		scope: _,
 		className: b,
 		children: h
 	});
 }
-function l({ onClick: e, interactive: t = !1, selected: n = !1, label: i, children: a, className: o, ...s }) {
+function f({ onClick: e, interactive: t = !1, selected: n = !1, label: r, children: i, className: a, ...s }) {
 	let c = t || !!e, l = c ? n : n || void 0, u = [
 		"table__row",
 		c ? "table__row--interactive" : "",
 		n ? "table__row--selected" : "",
-		o
+		a
 	].filter(Boolean).join(" ");
-	return c ? /* @__PURE__ */ r("tr", {
+	return c ? /* @__PURE__ */ o("tr", {
 		...s,
 		className: u,
-		"aria-label": i,
+		"aria-label": r,
 		"aria-selected": l,
 		onClick: e,
 		onKeyDown: (t) => {
 			(t.key === "Enter" || t.key === " ") && (t.preventDefault(), e?.());
 		},
 		tabIndex: 0,
-		children: a
-	}) : /* @__PURE__ */ r("tr", {
+		children: i
+	}) : /* @__PURE__ */ o("tr", {
 		...s,
 		className: u,
-		"aria-label": i,
+		"aria-label": r,
 		"aria-selected": l,
-		children: a
+		children: i
 	});
 }
-function u({ sticky: e, actions: t = !1, nowrap: n = !1, children: i, className: a, ...o }) {
+function p({ sticky: e, actions: t = !1, nowrap: n = !1, children: r, className: i, ...a }) {
 	let s = [
 		"table__cell",
 		e === "end" ? "table__cell--sticky" : "",
 		t ? "table__cell--actions" : "",
 		n ? "table__cell--nowrap" : "",
-		a
+		i
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ r("td", {
-		...o,
+	return /* @__PURE__ */ o("td", {
+		...a,
 		className: s,
-		children: i
+		children: r
 	});
 }
-function d({ caption: e, children: t, size: n = "md", className: a, ...o }) {
-	return /* @__PURE__ */ r("div", {
+function m({ caption: e, children: t, size: n = "md", className: c, ...l }) {
+	let u = [
+		"table",
+		n === "sm" ? "table--sm" : "",
+		c ?? ""
+	].filter(Boolean).join(" "), d = a(null), f = i(), p = r(d), m = e ? { "aria-labelledby": f } : l["aria-labelledby"] ? { "aria-labelledby": l["aria-labelledby"] } : l["aria-label"] ? { "aria-label": l["aria-label"] } : void 0;
+	return /* @__PURE__ */ o("div", {
+		ref: d,
 		className: "table__wrapper",
-		children: /* @__PURE__ */ i("table", {
-			className: [
-				"table",
-				n === "sm" ? "table--sm" : "",
-				a ?? ""
-			].filter(Boolean).join(" "),
-			...o,
-			children: [e && /* @__PURE__ */ r("caption", {
+		...p ? {
+			tabIndex: 0,
+			...m && {
+				role: "region",
+				...m
+			}
+		} : void 0,
+		children: /* @__PURE__ */ s("table", {
+			className: u,
+			...l,
+			children: [e && /* @__PURE__ */ o("caption", {
+				id: f,
 				className: "visually-hidden",
 				children: e
 			}), t]
 		})
 	});
 }
-d.Head = a, d.Footer = o, d.Header = c, d.Body = s, d.Row = l, d.Cell = u;
+m.Head = c, m.Footer = l, m.Header = d, m.Body = u, m.Row = f, m.Cell = p;
 //#endregion
-export { d as Table, s as TableBody, u as TableCell, o as TableFooter, a as TableHead, c as TableHeader, l as TableRow };
+export { m as Table, u as TableBody, p as TableCell, l as TableFooter, c as TableHead, d as TableHeader, f as TableRow };

package/dist/textarea.css

@@ -1 +1 @@
-.textarea{width:var(--textarea-width);min-height:var(--textarea-min-height);padding-block:var(--textarea-padding-block);padding-inline:var(--textarea-padding-inline);border-radius:var(--textarea-border-radius);border-width:var(--textarea-border-width);border-style:var(--textarea-border-style);border-color:var(--textarea-border-color);background-color:var(--textarea-bg);color:var(--textarea-color);font-family:var(--textarea-font-family);font-size:var(--textarea-font-size);font-weight:var(--textarea-font-weight);line-height:var(--textarea-line-height);resize:var(--textarea-resize);cursor:var(--textarea-cursor);box-sizing:border-box;transition:border-color var(--textarea-transition-duration) var(--textarea-transition-easing)}.textarea::placeholder{color:var(--textarea-placeholder-color)}.textarea:focus-visible{box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-bg);border-color:var(--textarea-focus-border-color);outline:none}.textarea:disabled{cursor:var(--textarea-disabled-cursor);background-color:var(--textarea-disabled-bg);color:var(--textarea-disabled-color);border-color:var(--textarea-disabled-border-color);pointer-events:none}.textarea.textarea--error{background-color:var(--textarea-error-bg);color:var(--textarea-error-color);border-color:var(--textarea-error-border-color)}.textarea.textarea--error::placeholder{color:var(--textarea-error-placeholder-color)}.textarea.textarea--error:focus-visible{box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-error-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-error-bg);border-color:var(--textarea-error-focus-border-color);outline:none}.textarea.textarea--sm{--textarea-min-height:var(--textarea-sm-min-height);--textarea-padding-block:var(--textarea-sm-padding-block);--textarea-padding-inline:var(--textarea-sm-padding-inline);--textarea-font-size:var(--textarea-sm-font-size)}.textarea.textarea--lg{--textarea-min-height:var(--textarea-lg-min-height);--textarea-padding-block:var(--textarea-lg-padding-block);--textarea-padding-inline:var(--textarea-lg-padding-inline);--textarea-font-size:var(--textarea-lg-font-size)}.textarea:autofill{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:autofill:hover{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:autofill:focus{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:-webkit-autofill{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:-webkit-autofill:hover{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:-webkit-autofill:focus{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}:-webkit-any(.textarea.textarea--error:-webkit-autofill,.textarea.textarea--error:autofill){-webkit-text-fill-color:var(--textarea-error-color);box-shadow:inset 0 0 0 1000px var(--textarea-error-bg)}:is(.textarea.textarea--error:autofill,.textarea.textarea--error:autofill){-webkit-text-fill-color:var(--textarea-error-color);box-shadow:inset 0 0 0 1000px var(--textarea-error-bg)}:-webkit-any(.textarea.textarea--error:-webkit-autofill:focus-visible,.textarea.textarea--error:autofill:focus-visible){box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-error-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-error-bg), inset 0 0 0 1000px var(--textarea-error-bg)}:is(.textarea.textarea--error:autofill:focus-visible,.textarea.textarea--error:autofill:focus-visible){box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-error-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-error-bg), inset 0 0 0 1000px var(--textarea-error-bg)}.textarea.textarea--bare{--textarea-bg:var(--textarea-bare-bg);--textarea-border-color:var(--textarea-bare-border-color);--textarea-focus-border-color:var(--textarea-bare-border-color);--textarea-min-height:var(--textarea-bare-min-height);--textarea-padding-block:var(--textarea-bare-padding-block);--textarea-padding-inline:var(--textarea-bare-padding-inline);--textarea-focus-ring-width:var(--textarea-bare-focus-ring-width);--textarea-focus-ring-inset-offset:var(--textarea-bare-focus-ring-width);--textarea-resize:var(--textarea-bare-resize);--textarea-disabled-bg:var(--textarea-bare-disabled-bg);--textarea-disabled-border-color:var(--textarea-bare-disabled-border-color);--textarea-error-bg:var(--textarea-bare-bg)}
+.textarea{inline-size:var(--textarea-width);min-block-size:var(--textarea-min-height);padding-block:var(--textarea-padding-block);padding-inline:var(--textarea-padding-inline);border-radius:var(--textarea-border-radius);border-width:var(--textarea-border-width);border-style:var(--textarea-border-style);border-color:var(--textarea-border-color);background-color:var(--textarea-bg);color:var(--textarea-color);font-family:var(--textarea-font-family);font-size:var(--textarea-font-size);font-weight:var(--textarea-font-weight);line-height:var(--textarea-line-height);resize:var(--textarea-resize);cursor:var(--textarea-cursor);box-sizing:border-box;transition:border-color var(--textarea-transition-duration) var(--textarea-transition-easing)}.textarea::placeholder{color:var(--textarea-placeholder-color)}.textarea:focus-visible{box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-bg);border-color:var(--textarea-focus-border-color);outline:none}.textarea:disabled{cursor:var(--textarea-disabled-cursor);background-color:var(--textarea-disabled-bg);color:var(--textarea-disabled-color);border-color:var(--textarea-disabled-border-color);pointer-events:none}.textarea.textarea--error{background-color:var(--textarea-error-bg);color:var(--textarea-error-color);border-color:var(--textarea-error-border-color)}.textarea.textarea--error::placeholder{color:var(--textarea-error-placeholder-color)}.textarea.textarea--error:focus-visible{box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-error-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-error-bg);border-color:var(--textarea-error-focus-border-color);outline:none}.textarea.textarea--sm{--textarea-min-height:var(--textarea-sm-min-height);--textarea-padding-block:var(--textarea-sm-padding-block);--textarea-padding-inline:var(--textarea-sm-padding-inline);--textarea-font-size:var(--textarea-sm-font-size)}.textarea.textarea--lg{--textarea-min-height:var(--textarea-lg-min-height);--textarea-padding-block:var(--textarea-lg-padding-block);--textarea-padding-inline:var(--textarea-lg-padding-inline);--textarea-font-size:var(--textarea-lg-font-size)}.textarea:autofill{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:autofill:hover{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:autofill:focus{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:-webkit-autofill{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:-webkit-autofill:hover{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}.textarea:-webkit-autofill:focus{-webkit-text-fill-color:var(--textarea-color);caret-color:var(--textarea-color);box-shadow:inset 0 0 0 1000px var(--textarea-bg);transition:background-color 9999s ease-out}:-webkit-any(.textarea.textarea--error:-webkit-autofill,.textarea.textarea--error:autofill){-webkit-text-fill-color:var(--textarea-error-color);box-shadow:inset 0 0 0 1000px var(--textarea-error-bg)}:is(.textarea.textarea--error:autofill,.textarea.textarea--error:autofill){-webkit-text-fill-color:var(--textarea-error-color);box-shadow:inset 0 0 0 1000px var(--textarea-error-bg)}:-webkit-any(.textarea.textarea--error:-webkit-autofill:focus-visible,.textarea.textarea--error:autofill:focus-visible){box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-error-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-error-bg), inset 0 0 0 1000px var(--textarea-error-bg)}:is(.textarea.textarea--error:autofill:focus-visible,.textarea.textarea--error:autofill:focus-visible){box-shadow:inset 0 0 0 calc(var(--textarea-focus-ring-width) + var(--textarea-focus-ring-inset-offset)) var(--textarea-error-focus-ring-color), inset 0 0 0 var(--textarea-focus-ring-inset-offset) var(--textarea-error-bg), inset 0 0 0 1000px var(--textarea-error-bg)}.textarea.textarea--bare{--textarea-bg:var(--textarea-bare-bg);--textarea-border-color:var(--textarea-bare-border-color);--textarea-focus-border-color:var(--textarea-bare-border-color);--textarea-min-height:var(--textarea-bare-min-height);--textarea-padding-block:var(--textarea-bare-padding-block);--textarea-padding-inline:var(--textarea-bare-padding-inline);--textarea-focus-ring-width:var(--textarea-bare-focus-ring-width);--textarea-focus-ring-inset-offset:var(--textarea-bare-focus-ring-width);--textarea-resize:var(--textarea-bare-resize);--textarea-disabled-bg:var(--textarea-bare-disabled-bg);--textarea-disabled-border-color:var(--textarea-bare-disabled-border-color);--textarea-error-bg:var(--textarea-bare-bg)}

package/dist/theme-switcher.js

@@ -1,12 +1,14 @@
 'use client';
 import './theme-switcher.css';
-import { Icon as e } from "./icon.js";
-import { Button as t } from "./button.js";
-import { Menu as n } from "./menu.js";
-import { DropdownField as r } from "./dropdown-field.js";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Icon as t } from "./icon.js";
+import { Button as n } from "./button.js";
+import { Menu as r } from "./menu.js";
+import { DropdownField as i } from "./dropdown-field.js";
+import { useId as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/stories/molecules/ThemeSwitcher/ThemeSwitcher.tsx
-var o = [
+var c = [
 	{
 		value: "light",
 		icon: "sun"
@@ -20,87 +22,86 @@ var o = [
 		icon: "device-desktop"
 	}
 ];
-function s({ value: s, onChange: c, labels: l, id: u = "theme-switcher", variant: d = "compact", layout: f = "inline", size: p = "md", className: m }) {
-	let h = {
-		group: "Tema",
-		light: "Claro",
-		dark: "Oscuro",
-		system: "Sistema",
-		...l
-	}, g = o.find((e) => e.value === s) ?? o[2];
-	if (d === "list") return /* @__PURE__ */ i("div", {
+function l({ value: l, onChange: u, labels: d, id: f, variant: p = "compact", layout: m = "inline", size: h = "md", className: g }) {
+	let _ = a(), v = f ?? _, y = e("themeSwitcher"), b = {
+		group: () => y("group", d?.group),
+		light: () => y("light", d?.light),
+		dark: () => y("dark", d?.dark),
+		system: () => y("system", d?.system)
+	}, x = c.find((e) => e.value === l) ?? c[2];
+	if (p === "list") return /* @__PURE__ */ o("div", {
 		className: [
 			"theme-switcher",
 			"theme-switcher--list",
-			m
+			g
 		].filter(Boolean).join(" "),
 		role: "group",
-		"aria-label": h.group,
-		children: /* @__PURE__ */ i("ul", {
+		"aria-label": b.group(),
+		children: /* @__PURE__ */ o("ul", {
 			className: "theme-switcher__list",
-			children: o.map(({ value: t, icon: n }) => {
-				let r = t === s;
-				return /* @__PURE__ */ i("li", { children: /* @__PURE__ */ a("button", {
+			children: c.map(({ value: e, icon: n }) => {
+				let r = e === l;
+				return /* @__PURE__ */ o("li", { children: /* @__PURE__ */ s("button", {
 					type: "button",
 					className: ["theme-switcher__option", r ? "theme-switcher__option--current" : ""].filter(Boolean).join(" "),
 					"aria-pressed": r,
-					onClick: r ? void 0 : () => c?.(t),
-					children: [/* @__PURE__ */ i(e, {
+					onClick: r ? void 0 : () => u?.(e),
+					children: [/* @__PURE__ */ o(t, {
 						name: n,
 						size: "sm"
-					}), /* @__PURE__ */ i("span", { children: h[t] })]
-				}) }, t);
+					}), /* @__PURE__ */ o("span", { children: b[e]() })]
+				}) }, e);
 			})
 		})
 	});
-	let _ = o.map(({ value: t, icon: n }) => ({
+	let S = c.map(({ value: e, icon: n }) => ({
 		type: "radio",
-		value: t,
-		label: /* @__PURE__ */ a("span", {
+		value: e,
+		label: /* @__PURE__ */ s("span", {
 			className: "theme-switcher__item",
-			children: [/* @__PURE__ */ i(e, {
+			children: [/* @__PURE__ */ o(t, {
 				name: n,
 				size: "sm"
-			}), h[t]]
+			}), b[e]()]
 		})
 	}));
-	if (d === "icon") return /* @__PURE__ */ i(n, {
-		className: m,
+	if (p === "icon") return /* @__PURE__ */ o(r, {
+		className: g,
 		align: "end",
-		size: p,
-		value: s,
-		onValueChange: (e) => c?.(e),
-		items: _,
-		trigger: /* @__PURE__ */ i(t, {
+		size: h,
+		value: l,
+		onValueChange: (e) => u?.(e),
+		items: S,
+		trigger: /* @__PURE__ */ o(n, {
 			variant: "ghost",
-			size: p,
+			size: h,
 			iconOnly: !0,
-			"aria-label": `${h.group}: ${h[g.value]}`,
-			children: /* @__PURE__ */ i(e, {
-				name: g.icon,
+			"aria-label": y("trigger", d?.trigger)(b.group(), b[x.value]()),
+			children: /* @__PURE__ */ o(t, {
+				name: x.icon,
 				size: "md"
 			})
 		})
 	});
-	let v = [
+	let C = [
 		"theme-switcher",
 		"theme-switcher--compact",
-		m
+		g
 	].filter(Boolean).join(" ");
-	return /* @__PURE__ */ a(r, {
-		id: u,
-		label: h.group,
-		inline: f === "inline",
-		size: p,
-		className: v,
-		value: s,
-		onValueChange: (e) => c?.(e),
-		items: _,
-		children: [/* @__PURE__ */ i(e, {
-			name: g.icon,
+	return /* @__PURE__ */ s(i, {
+		id: v,
+		label: b.group(),
+		inline: m === "inline",
+		size: h,
+		className: C,
+		value: l,
+		onValueChange: (e) => u?.(e),
+		items: S,
+		children: [/* @__PURE__ */ o(t, {
+			name: x.icon,
 			size: "sm"
-		}), h[g.value]]
+		}), b[x.value]()]
 	});
 }
 //#endregion
-export { s as ThemeSwitcher };
+export { l as ThemeSwitcher };