@studiolxd/brand 41.0.0 → 42.0.0

package/dist/card.css

@@ -1 +1 @@
-.card{box-shadow:none;color:inherit;padding-inline:var(--card-padding-inline);align-items:flex-start;gap:var(--card-gap);border-radius:var(--card-border-radius);flex-direction:column;padding-block-start:var(--card-padding-block-start);padding-block-end:var(--card-padding-block-end);text-decoration:none;display:flex}.card p:not(.paragraph){font-size:var(--card-description-font-size);margin-block-end:var(--card-description-margin-block-end)}.card .arrow{margin-block-start:auto}:where(button.card){appearance:none;font:inherit;text-align:start;cursor:pointer;background:0 0;border:0;inline-size:100%;margin:0}.card__footer.card__footer--column{flex-direction:column;align-items:stretch}.card.card--primary{background-color:var(--card-primary-bg);color:var(--card-primary-color);--text-list-color:var(--card-primary-color);--text-h1-color:var(--card-primary-color);--text-h2-color:var(--card-primary-color);--text-h3-color:var(--card-primary-color);--text-h4-color:var(--card-primary-color);--text-h5-color:var(--card-primary-color);--text-h6-color:var(--card-primary-color)}.card.card--outline{background-color:var(--card-outline-bg);color:var(--card-outline-color);border:var(--card-outline-border-width) solid var(--card-outline-border-color)}.card.card--accent-1{background-color:var(--card-accent-1-bg);color:var(--card-accent-1-color);--text-list-color:var(--card-accent-1-color)}.card.card--accent-2{background-color:var(--card-accent-2-bg);color:var(--card-accent-2-color);--text-list-color:var(--card-accent-2-color)}.card.card--support-1{background-color:var(--card-support-1-bg);color:var(--card-support-1-color);--text-list-color:var(--card-support-1-color)}.card.card--support-2{background-color:var(--card-support-2-bg);color:var(--card-support-2-color);--text-list-color:var(--card-support-2-color)}.card.card--square,.card.card--split{gap:0;padding-block:0;padding-inline:0}.card__body{align-items:flex-start;gap:var(--card-gap);inline-size:100%;padding-inline:var(--card-padding-inline);flex-direction:column;flex:1;padding-block-start:var(--card-padding-block-start);padding-block-end:var(--card-padding-block-end);display:flex}.card__media img{object-fit:cover;block-size:100%;inline-size:100%;display:block}.card--square .card__media,.card--split .card__media{aspect-ratio:1;inline-size:100%}@media (width>=768px){.card.card--split{flex-direction:row;align-items:stretch}.card--split .card__media,.card--split .card__body{flex:50%;inline-size:50%}.card--split .card__media{aspect-ratio:auto}}.card__header,.card__content,.card__footer{inline-size:100%}.card__header{align-items:start;column-gap:var(--card-header-gap);row-gap:var(--card-header-row-gap);grid-template-columns:minmax(0,1fr) auto;display:grid}.card__header>*{grid-column:1}.card__header>.card__action{grid-area:1/2;justify-self:end}.card__title{font-weight:var(--card-title-font-weight);color:inherit;margin-block:0}.card__description{color:inherit;margin-block:0}.card__description--lines-1{min-block-size:1lh}.card__description--lines-2{min-block-size:2lh}.card__description--lines-3{min-block-size:3lh}.card__footer{gap:var(--card-footer-gap);margin-block-start:auto;display:flex}.card.card--selectable{cursor:pointer;position:relative}.card--selectable .radio-field,.card--selectable .checkbox-field{margin:0;position:absolute;inset:0}.card--selectable .radio-field__control,.card--selectable .checkbox-field__control{opacity:0;cursor:pointer;position:absolute;inset:0}.card.card--selectable:has(input:focus-visible){outline:var(--card-selectable-focus-ring-width) solid var(--card-selectable-focus-ring-color);outline-offset:var(--card-selectable-focus-ring-offset)}.card.card--selectable.card--selected{background-color:var(--card-accent-1-bg);color:var(--card-accent-1-color);border-color:var(--card-accent-1-bg);--text-list-color:var(--card-accent-1-color)}.card.card--selectable:has(input:checked){background-color:var(--card-accent-1-bg);color:var(--card-accent-1-color);border-color:var(--card-accent-1-bg);--text-list-color:var(--card-accent-1-color)}
+.card{box-shadow:none;color:inherit;padding-inline:var(--card-padding-inline);align-items:flex-start;gap:var(--card-gap);border-radius:var(--card-border-radius);flex-direction:column;padding-block-start:var(--card-padding-block-start);padding-block-end:var(--card-padding-block-end);text-decoration:none;display:flex}.card p:not(.paragraph){font-size:var(--card-description-font-size);margin-block-end:var(--card-description-margin-block-end)}.card .arrow{margin-block-start:auto}:where(button.card){appearance:none;font:inherit;text-align:start;cursor:pointer;background:0 0;border:0;inline-size:100%;margin:0}.card__footer.card__footer--column{flex-direction:column;align-items:stretch}.card.card--primary{background-color:var(--card-primary-bg);color:var(--card-primary-color);--text-list-color:var(--card-primary-color);--text-h1-color:var(--card-primary-color);--text-h2-color:var(--card-primary-color);--text-h3-color:var(--card-primary-color);--text-h4-color:var(--card-primary-color);--text-h5-color:var(--card-primary-color);--text-h6-color:var(--card-primary-color)}.card.card--outline{background-color:var(--card-outline-bg);color:var(--card-outline-color);border:var(--card-outline-border-width) solid var(--card-outline-border-color)}.card.card--accent-1{background-color:var(--card-accent-1-bg);color:var(--card-accent-1-color);--text-list-color:var(--card-accent-1-color)}.card.card--accent-2{background-color:var(--card-accent-2-bg);color:var(--card-accent-2-color);--text-list-color:var(--card-accent-2-color)}.card.card--support-1{background-color:var(--card-support-1-bg);color:var(--card-support-1-color);--text-list-color:var(--card-support-1-color)}.card.card--support-2{background-color:var(--card-support-2-bg);color:var(--card-support-2-color);--text-list-color:var(--card-support-2-color)}.card.card--square,.card.card--split{gap:0;padding-block:0;padding-inline:0}.card__body{align-items:flex-start;gap:var(--card-gap);inline-size:100%;padding-inline:var(--card-padding-inline);flex-direction:column;flex:1;padding-block-start:var(--card-padding-block-start);padding-block-end:var(--card-padding-block-end);display:flex}.card__media img{object-fit:cover;block-size:100%;inline-size:100%;display:block}.card--square .card__media,.card--split .card__media{aspect-ratio:1;inline-size:100%}@media (width>=768px){.card.card--split{flex-direction:row;align-items:stretch}.card--split .card__media,.card--split .card__body{flex:50%;inline-size:50%}.card--split .card__media{aspect-ratio:auto}}.card__header,.card__content,.card__footer{inline-size:100%}.card__header{align-items:start;column-gap:var(--card-header-gap);row-gap:var(--card-header-row-gap);grid-template-columns:minmax(0,1fr) auto;display:grid}.card__header>*{grid-column:1}.card__header>.card__action{grid-area:1/2;justify-self:end}.card__title{font-weight:var(--card-title-font-weight);color:inherit;margin-block:0}.card__description{color:inherit;margin-block:0}.card__description--lines-1{min-block-size:1lh}.card__description--lines-2{min-block-size:2lh}.card__description--lines-3{min-block-size:3lh}.card__footer{align-items:stretch;gap:var(--card-footer-gap);flex-direction:column;margin-block-start:auto;display:flex}.card__footer>*{inline-size:100%}@media (width>=768px){.card__footer:not(.card__footer--column){flex-direction:row}.card__footer:not(.card__footer--column)>*{inline-size:auto}}.card.card--selectable{cursor:pointer;position:relative}.card--selectable .radio-field,.card--selectable .checkbox-field{margin:0;position:absolute;inset:0}.card--selectable .radio-field__control,.card--selectable .checkbox-field__control{opacity:0;cursor:pointer;position:absolute;inset:0}.card.card--selectable:has(input:focus-visible){outline:var(--card-selectable-focus-ring-width) solid var(--card-selectable-focus-ring-color);outline-offset:var(--card-selectable-focus-ring-offset)}.card.card--selectable.card--selected{background-color:var(--card-accent-1-bg);color:var(--card-accent-1-color);border-color:var(--card-accent-1-bg);--text-list-color:var(--card-accent-1-color)}.card.card--selectable:has(input:checked){background-color:var(--card-accent-1-bg);color:var(--card-accent-1-color);border-color:var(--card-accent-1-bg);--text-list-color:var(--card-accent-1-color)}

package/dist/docs-search.js

@@ -1,60 +1,61 @@
 'use client';
 import './docs-search.css';
-import { Spinner as e } from "./spinner.js";
-import { InputField as t } from "./input-field.js";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Spinner as t } from "./spinner.js";
+import { InputField as n } from "./input-field.js";
 import "react";
-import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Autocomplete as a } from "@base-ui/react/autocomplete";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Autocomplete as o } from "@base-ui/react/autocomplete";
 //#region src/stories/molecules/DocsSearch/DocsSearch.tsx
-function o(e) {
-	return /* @__PURE__ */ r("a", { ...e });
+function s(e) {
+	return /* @__PURE__ */ i("a", { ...e });
 }
-function s({ id: s = "docs-search", query: c, onQueryChange: l, results: u, loading: d = !1, label: f = "Buscar en la documentación", labelHidden: p, placeholder: m = "Buscar…", clearable: h = !0, clearLabel: g = "Borrar", resultsLabel: _ = "Resultados", emptyLabel: v = "Sin resultados.", loadingLabel: y = "Buscando…", size: b, renderLink: x = o, onSelect: S, className: C }) {
-	let w = c.trim() !== "" && u.length === 0 ? d ? y : v : null;
-	return /* @__PURE__ */ r(a.Root, {
+function c({ id: c = "docs-search", query: l, onQueryChange: u, results: d, loading: f = !1, label: p, labelHidden: m, placeholder: h, clearable: g = !0, clearLabel: _, resultsLabel: v, emptyLabel: y, loadingLabel: b, size: x, renderLink: S = s, onSelect: C, className: w }) {
+	let T = e("docsSearch"), E = l.trim() !== "" && d.length === 0 ? f ? T("loading", b) : T("empty", y) : null;
+	return /* @__PURE__ */ i(o.Root, {
 		inline: !0,
 		open: !0,
-		items: u,
+		items: d,
 		filter: null,
-		value: c,
-		onValueChange: l,
-		children: /* @__PURE__ */ i("div", {
-			className: ["docs-search", C].filter(Boolean).join(" "),
+		value: l,
+		onValueChange: u,
+		children: /* @__PURE__ */ a("div", {
+			className: ["docs-search", w].filter(Boolean).join(" "),
 			children: [
-				/* @__PURE__ */ r(a.Input, {
-					id: s,
-					render: /* @__PURE__ */ r(t, {
-						id: s,
-						label: f,
-						labelHidden: p,
+				/* @__PURE__ */ i(o.Input, {
+					id: c,
+					render: /* @__PURE__ */ i(n, {
+						id: c,
+						label: T("label", p),
+						labelHidden: m,
 						kind: "search",
-						clearable: h,
-						clearLabel: g,
-						placeholder: m,
-						...b ? { size: b } : {}
+						clearable: g,
+						..._ === void 0 ? {} : { clearLabel: _ },
+						placeholder: T("placeholder", h),
+						...x ? { size: x } : {}
 					})
 				}),
-				/* @__PURE__ */ r(a.List, {
+				/* @__PURE__ */ i(o.List, {
 					className: "docs-search__results",
-					"aria-label": _,
-					children: (e) => /* @__PURE__ */ r(a.Item, {
+					"aria-label": T("results", v),
+					children: (e) => /* @__PURE__ */ i(o.Item, {
 						value: e,
 						className: "docs-search__result",
-						onClick: () => S?.(e),
-						render: (t) => x({
+						onClick: () => C?.(e),
+						render: (t) => S({
 							...t,
 							href: e.href,
 							className: t.className ?? "docs-search__result",
-							children: /* @__PURE__ */ i(n, { children: [
-								e.product && /* @__PURE__ */ r("span", {
+							children: /* @__PURE__ */ a(r, { children: [
+								e.product && /* @__PURE__ */ i("span", {
 									className: "docs-search__result-product",
 									children: e.product
 								}),
-								/* @__PURE__ */ r("span", {
+								/* @__PURE__ */ i("span", {
 									className: "docs-search__result-title",
 									children: e.title
 								}),
-								e.excerpt && /* @__PURE__ */ r("span", {
+								e.excerpt && /* @__PURE__ */ i("span", {
 									className: "docs-search__result-excerpt",
 									children: e.excerpt
 								})
@@ -62,17 +63,17 @@ function s({ id: s = "docs-search", query: c, onQueryChange: l, results: u, load
 						})
 					}, e.href)
 				}),
-				w && /* @__PURE__ */ i("p", {
+				E && /* @__PURE__ */ a("p", {
 					className: "docs-search__status",
 					role: "status",
-					children: [d && /* @__PURE__ */ r(e, {
+					children: [f && /* @__PURE__ */ i(t, {
 						size: "sm",
 						"aria-hidden": !0
-					}), w]
+					}), E]
 				})
 			]
 		})
 	});
 }
 //#endregion
-export { s as DocsSearch };
+export { c as DocsSearch };

package/dist/filter-bar.css

@@ -1 +1 @@
-.filter-bar{gap:var(--filter-bar-gap);flex-direction:column;display:flex}.filter-bar__search{inline-size:100%}.filter-bar__row{grid-template-columns:repeat(auto-fill, minmax(min(var(--filter-bar-column-min-inline-size), 100%), 1fr));column-gap:var(--filter-bar-column-gap);row-gap:var(--filter-bar-row-gap);display:grid}.filter-bar__filters{display:contents}.filter-bar__filter{min-inline-size:0}.filter-bar__actions{align-self:end;align-items:stretch;gap:var(--filter-bar-actions-gap);flex-direction:column;min-inline-size:0;display:flex}.filter-bar__actions>*{inline-size:100%}@media (width>=768px){.filter-bar__actions{flex-flow:wrap;align-items:center}.filter-bar__actions>*{inline-size:auto}}
+.filter-bar{gap:var(--filter-bar-gap);flex-direction:column;display:flex}.filter-bar__search{inline-size:100%}.filter-bar__row{column-gap:var(--filter-bar-column-gap);row-gap:var(--filter-bar-row-gap);grid-template-columns:1fr;display:grid}.filter-bar__filters{display:contents}.filter-bar__filter{min-inline-size:0}.filter-bar__actions{align-items:stretch;gap:var(--filter-bar-actions-gap);flex-direction:column;min-inline-size:0;display:flex}.filter-bar__actions>*{inline-size:100%}@media (width>=768px){.filter-bar__row{grid-template-columns:repeat(auto-fill, minmax(min(var(--filter-bar-column-min-inline-size), 100%), 1fr))}.filter-bar__actions{flex-flow:wrap;align-items:center}.filter-bar__actions>*{inline-size:auto}:is(.filter-bar__row:has(.label:not(.visually-hidden)) .filter-bar__filter:not(:has(.label:not(.visually-hidden))),.filter-bar__row:has(.label:not(.visually-hidden))>.filter-bar__actions){align-self:start;padding-block-start:var(--filter-bar-label-offset)}.filter-bar__row:has(.label:not(.visually-hidden)) .filter-bar__filter:not(:has(.label:not(.visually-hidden))){block-size:calc(var(--filter-bar-label-offset) + var(--filter-bar-control-block-size));flex-direction:column;justify-content:center;display:flex}.filter-bar__row:has(.label:not(.visually-hidden))>.filter-bar__actions{min-block-size:calc(var(--filter-bar-label-offset) + var(--filter-bar-control-block-size))}}

package/dist/filter-bar.js

@@ -1,31 +1,33 @@
+'use client';
 import './filter-bar.css';
-import { Children as e } from "react";
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Children as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/stories/molecules/FilterBar/FilterBar.tsx
-function r({ search: r, children: i, actions: a, ariaLabel: o = "Filtros", className: s, ...c }) {
-	let l = e.toArray(i);
-	return /* @__PURE__ */ n("div", {
-		className: ["filter-bar", s].filter(Boolean).join(" "),
+function i({ search: i, children: a, actions: o, ariaLabel: s, className: c, ...l }) {
+	let u = e("filterBar"), d = t.toArray(a);
+	return /* @__PURE__ */ r("div", {
+		className: ["filter-bar", c].filter(Boolean).join(" "),
 		role: "search",
-		"aria-label": o,
-		...c,
-		children: [r && /* @__PURE__ */ t("div", {
+		"aria-label": u("label", s),
+		...l,
+		children: [i && /* @__PURE__ */ n("div", {
 			className: "filter-bar__search",
-			children: r
-		}), (l.length > 0 || a) && /* @__PURE__ */ n("div", {
+			children: i
+		}), (d.length > 0 || o) && /* @__PURE__ */ r("div", {
 			className: "filter-bar__row",
-			children: [l.length > 0 && /* @__PURE__ */ t("div", {
+			children: [d.length > 0 && /* @__PURE__ */ n("div", {
 				className: "filter-bar__filters",
-				children: l.map((e, n) => /* @__PURE__ */ t("div", {
+				children: d.map((e, t) => /* @__PURE__ */ n("div", {
 					className: "filter-bar__filter",
 					children: e
-				}, n))
-			}), a && /* @__PURE__ */ t("div", {
+				}, t))
+			}), o && /* @__PURE__ */ n("div", {
 				className: "filter-bar__actions",
-				children: a
+				children: o
 			})]
 		})]
 	});
 }
 //#endregion
-export { r as FilterBar };
+export { i as FilterBar };

package/dist/input-field.js

@@ -1,100 +1,101 @@
 'use client';
 import './input-field.css';
-import { Icon as e } from "./icon.js";
-import { n as t } from "./_shared/form-size.js";
-import { ErrorText as n } from "./error-text.js";
-import { Input as r } from "./input.js";
-import { Label as i } from "./label.js";
-import { n as a } from "./_shared/field-labels.js";
-import { forwardRef as o, useImperativeHandle as s, useRef as c, useState as l } from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Icon as t } from "./icon.js";
+import { n } from "./_shared/form-size.js";
+import { ErrorText as r } from "./error-text.js";
+import { Input as i } from "./input.js";
+import { Label as a } from "./label.js";
+import { n as o } from "./_shared/field-labels.js";
+import { forwardRef as s, useImperativeHandle as c, useRef as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/stories/molecules/InputField/InputField.tsx
-var f = o(function({ id: o, label: f, labelHidden: p, name: m, type: h, kind: g = "text", clearable: _ = !1, clearLabel: v = "Borrar", onClear: y, placeholder: b, value: x, defaultValue: S, disabled: C, readOnly: w, size: T, error: E = !1, errorMessage: D, helperText: O, onChange: k, onBlur: A, onFocus: j, className: M, ...N }, P) {
-	let F = a(p), I = t(T), L = D ? `${o}-error` : void 0, R = O ? `${o}-helper` : void 0, z = [
-		L,
-		R,
-		N["aria-describedby"]
-	].filter(Boolean).join(" ") || void 0, B = E || !!D, V = g === "search", H = c(null);
-	s(P, () => H.current);
-	let [U, W] = l(() => (S ?? "") !== ""), G = V && _ && (x === void 0 ? U : x !== "") && !C && !w;
-	function K(e) {
-		x === void 0 && W(e.target.value !== ""), k?.(e);
+var p = s(function({ id: s, label: p, labelHidden: m, name: h, type: g, kind: _ = "text", clearable: v = !1, clearLabel: y, onClear: b, placeholder: x, value: S, defaultValue: C, disabled: w, readOnly: T, size: E, error: D = !1, errorMessage: O, helperText: k, onChange: A, onBlur: j, onFocus: M, className: N, ...P }, F) {
+	let I = e("inputField"), L = o(m), R = n(E), z = O ? `${s}-error` : void 0, B = k ? `${s}-helper` : void 0, V = [
+		z,
+		B,
+		P["aria-describedby"]
+	].filter(Boolean).join(" ") || void 0, H = D || !!O, U = _ === "search", W = l(null);
+	c(F, () => W.current);
+	let [G, K] = u(() => (C ?? "") !== ""), q = U && v && (S === void 0 ? G : S !== "") && !w && !T;
+	function J(e) {
+		S === void 0 && K(e.target.value !== ""), A?.(e);
 	}
-	function q() {
-		let e = H.current;
-		e && ((Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set)?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), W(!1), e.focus(), y?.());
+	function Y() {
+		let e = W.current;
+		e && ((Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set)?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), K(!1), e.focus(), b?.());
 	}
-	let J = /* @__PURE__ */ u(r, {
-		ref: H,
-		...V ? {
+	let X = /* @__PURE__ */ d(i, {
+		ref: W,
+		...U ? {
 			type: "text",
 			autoComplete: "off",
 			enterKeyHint: "search"
-		} : { type: h },
-		...N,
-		id: o,
-		name: m,
-		placeholder: b ?? (F ? f : void 0),
-		value: x,
-		defaultValue: S,
-		disabled: C,
-		readOnly: w,
-		size: I,
-		error: B,
-		"aria-describedby": z,
-		onChange: K,
-		onBlur: A,
-		onFocus: j
+		} : { type: g },
+		...P,
+		id: s,
+		name: h,
+		placeholder: x ?? (L ? p : void 0),
+		value: S,
+		defaultValue: C,
+		disabled: w,
+		readOnly: T,
+		size: R,
+		error: H,
+		"aria-describedby": V,
+		onChange: J,
+		onBlur: j,
+		onFocus: M
 	});
-	return /* @__PURE__ */ d("div", {
-		className: ["input-field", M].filter(Boolean).join(" "),
+	return /* @__PURE__ */ f("div", {
+		className: ["input-field", N].filter(Boolean).join(" "),
 		children: [
-			/* @__PURE__ */ u(i, {
-				htmlFor: o,
-				hidden: F,
-				size: I,
-				children: f
+			/* @__PURE__ */ d(a, {
+				htmlFor: s,
+				hidden: L,
+				size: R,
+				children: p
 			}),
-			V ? /* @__PURE__ */ d("div", {
+			U ? /* @__PURE__ */ f("div", {
 				className: [
 					"input-field__search",
-					I === "md" ? "" : `input-field__search--${I}`,
-					_ ? "input-field__search--clearable" : ""
+					R === "md" ? "" : `input-field__search--${R}`,
+					v ? "input-field__search--clearable" : ""
 				].filter(Boolean).join(" "),
 				children: [
-					/* @__PURE__ */ u("span", {
+					/* @__PURE__ */ d("span", {
 						className: "input-field__search-icon",
 						"aria-hidden": "true",
-						children: /* @__PURE__ */ u(e, {
+						children: /* @__PURE__ */ d(t, {
 							name: "search",
 							className: "input-field__search-glyph"
 						})
 					}),
-					J,
-					G && /* @__PURE__ */ u("button", {
+					X,
+					q && /* @__PURE__ */ d("button", {
 						type: "button",
 						className: "input-field__clear",
-						"aria-label": v,
-						"aria-controls": o,
-						onClick: q,
-						children: /* @__PURE__ */ u(e, {
+						"aria-label": I("clear", y),
+						"aria-controls": s,
+						onClick: Y,
+						children: /* @__PURE__ */ d(t, {
 							name: "close",
 							className: "input-field__search-glyph"
 						})
 					})
 				]
-			}) : J,
-			D && /* @__PURE__ */ u(n, {
-				id: L,
-				children: D
+			}) : X,
+			O && /* @__PURE__ */ d(r, {
+				id: z,
+				children: O
 			}),
-			O && /* @__PURE__ */ u("span", {
-				id: R,
+			k && /* @__PURE__ */ d("span", {
+				id: B,
 				className: "input-field__helper",
-				children: O
+				children: k
 			})
 		]
 	});
 });
 //#endregion
-export { f as InputField };
+export { p as InputField };

package/dist/input-phone.js

@@ -1,72 +1,73 @@
 'use client';
 import './input-phone.css';
-import { Icon as e } from "./icon.js";
-import { forwardRef as t, useMemo as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { Select as a } from "@base-ui/react/select";
-import o, { getCountryCallingCode as s } from "react-phone-number-input";
+import { n as e } from "./_shared/brandmessagescontext.js";
+import { Icon as t } from "./icon.js";
+import { forwardRef as n, useMemo as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { Select as o } from "@base-ui/react/select";
+import s, { getCountryCallingCode as c } from "react-phone-number-input";
 //#region src/stories/atoms/InputPhone/InputPhone.tsx
-function c({ value: t, onChange: n, options: o, disabled: c, size: l = "md", countryLabel: u = "País", internationalLabel: d = "🌐", container: f }) {
-	let p = "__intl__", m = (e) => e ?? p, h = (e) => e === p ? void 0 : e, g = l === "sm" ? "xs" : l === "lg" ? "md" : "sm", _ = ["input-phone__country-content", l === "md" ? "" : `input-phone__country-content--${l}`].filter(Boolean).join(" ");
-	return /* @__PURE__ */ i(a.Root, {
-		value: m(t),
-		onValueChange: (e) => n(h(e)),
-		disabled: c,
-		children: [/* @__PURE__ */ i(a.Trigger, {
+function l({ value: n, onChange: r, options: s, disabled: l, size: u = "md", countryLabel: d, internationalLabel: f = "🌐", container: p }) {
+	let m = e("inputPhone"), h = "__intl__", g = (e) => e ?? h, _ = (e) => e === h ? void 0 : e, v = u === "sm" ? "xs" : u === "lg" ? "md" : "sm", y = ["input-phone__country-content", u === "md" ? "" : `input-phone__country-content--${u}`].filter(Boolean).join(" ");
+	return /* @__PURE__ */ a(o.Root, {
+		value: g(n),
+		onValueChange: (e) => r(_(e)),
+		disabled: l,
+		children: [/* @__PURE__ */ a(o.Trigger, {
 			className: "input-phone__country",
-			"aria-label": u,
-			children: [/* @__PURE__ */ r(a.Value, { children: t ? `+${s(t)}` : d }), /* @__PURE__ */ r(e, {
+			"aria-label": m("country", d),
+			children: [/* @__PURE__ */ i(o.Value, { children: n ? `+${c(n)}` : f }), /* @__PURE__ */ i(t, {
 				name: "chevron",
 				className: "input-phone__country-icon",
-				size: g
+				size: v
 			})]
-		}), /* @__PURE__ */ r(a.Portal, {
-			container: f,
-			children: /* @__PURE__ */ r(a.Positioner, {
+		}), /* @__PURE__ */ i(o.Portal, {
+			container: p,
+			children: /* @__PURE__ */ i(o.Positioner, {
 				className: "input-phone__country-positioner",
 				side: "bottom",
 				align: "start",
 				alignItemWithTrigger: !1,
-				children: /* @__PURE__ */ r(a.Popup, {
-					className: _,
-					children: o.map(({ value: e, label: t }) => /* @__PURE__ */ r(a.Item, {
-						value: m(e),
+				children: /* @__PURE__ */ i(o.Popup, {
+					className: y,
+					children: s.map(({ value: e, label: t }) => /* @__PURE__ */ i(o.Item, {
+						value: g(e),
 						className: "input-phone__country-item",
-						children: /* @__PURE__ */ r(a.ItemText, { children: t })
-					}, m(e)))
+						children: /* @__PURE__ */ i(o.ItemText, { children: t })
+					}, g(e)))
 				})
 			})
 		})]
 	});
 }
-var l = t(function({ value: e, defaultCountry: i = "ES", placeholder: a, disabled: s, error: l = !1, size: d = "md", id: f, name: p, describedBy: m, "aria-describedby": h, "aria-label": g, autoComplete: _, required: v, readOnly: y, onChange: b, onBlur: x, onFocus: S, countryLabel: C, internationalLabel: w, container: T }, E) {
-	return /* @__PURE__ */ r(o, {
+var u = n(function({ value: e, defaultCountry: t = "ES", placeholder: a, disabled: o, error: c = !1, size: u = "md", id: f, name: p, describedBy: m, "aria-describedby": h, "aria-label": g, autoComplete: _, required: v, readOnly: y, onChange: b, onBlur: x, onFocus: S, countryLabel: C, internationalLabel: w, container: T }, E) {
+	return /* @__PURE__ */ i(s, {
 		className: [
 			"input-phone",
-			l ? "input-phone--error" : "",
-			d === "md" ? "" : `input-phone--${d}`
+			c ? "input-phone--error" : "",
+			u === "md" ? "" : `input-phone--${u}`
 		].filter(Boolean).join(" "),
 		value: e,
-		defaultCountry: i,
+		defaultCountry: t,
 		placeholder: a,
-		disabled: s,
+		disabled: o,
 		readOnly: y,
 		required: v,
 		autoComplete: _,
 		id: f,
 		name: p,
-		inputComponent: n(() => t(function(e, t) {
-			return /* @__PURE__ */ r("input", {
+		inputComponent: r(() => n(function(e, t) {
+			return /* @__PURE__ */ i("input", {
 				...e,
 				ref: (e) => {
-					u(t, e), u(E, e);
+					d(t, e), d(E, e);
 				},
 				className: "input-phone__number"
 			});
 		}), [E]),
-		countrySelectComponent: c,
+		countrySelectComponent: l,
 		countrySelectProps: {
-			size: d,
+			size: u,
 			countryLabel: C,
 			internationalLabel: w,
 			container: T
@@ -77,12 +78,12 @@ var l = t(function({ value: e, defaultCountry: i = "ES", placeholder: a, disable
 		numberInputProps: {
 			"aria-describedby": h ?? m,
 			"aria-label": g,
-			"aria-invalid": l || void 0
+			"aria-invalid": c || void 0
 		}
 	});
 });
-function u(e, t) {
+function d(e, t) {
 	typeof e == "function" ? e(t) : e && (e.current = t);
 }
 //#endregion
-export { l as InputPhone };
+export { u as InputPhone };