@studiolxd/brand 41.1.0 → 43.0.0

package/CHANGELOG.md

@@ -7,6 +7,124 @@ El paquete sigue [semver](https://semver.org/lang/es/): **patch** para bug fixes
 regeneración de `dist`, **minor** para componentes/props/variantes/tokens nuevos, **major**
 para breaking changes.
 
+## [43.0.0] — 2026-09-15
+
+> **Major.** Cuarta familia al proveedor de textos: fecha y hora. `Calendar`, `DatePicker`
+> y `TimeSelect` dejan de traer castellano puesto, y con ellos se cierran los reenvíos que
+> las olas anteriores dejaron inventariados.
+
+### Fecha y hora leen del proveedor
+
+Tres espacios nuevos en `BrandMessages`: **`calendar`** (previousMonth, nextMonth,
+previousYears, nextYears, yearGrid), **`datePicker`** (openCalendar, invalid, calendar y
+las letras de la máscara) y **`timeSelect`** (hours, minutes y sus máscaras). Los campos
+que los envuelven —`DatePickerField`, `DateTimeField`, `TimeField`— no pierden props: sus
+reenvíos quedan como anulación puntual, pero ya no hay que enhebrar nada para traducir,
+porque el proveedor llega por contexto a la pieza que pinta el texto. Se ha retirado
+`SPANISH_MASK_LETTERS`, el último juego de letras castellanas vivo en el código.
+
+Mismo orden que en las tres olas anteriores —**prop → proveedor → error**— y misma
+naturaleza: incompatible **en tiempo de compilación**. El texto que no se pinta no se
+exige: un `Calendar` sin navegación no pide las flechas, un `DatePicker` con fecha válida no
+pide el aviso, un `TimeSelect` con hora no pide las máscaras.
+
+### Una máscara tiene dos mitades
+
+`dd/mm/aaaa` no es una cosa, son dos decididas en sitios distintos. **El orden y el
+separador son formato**: salen del `locale` vía `Intl.DateTimeFormat`, y una aplicación en
+inglés que enseñe fechas españolas las quiere en orden español. **Las letras son idioma**:
+`aaaa` es «año», `yyyy` es *year*, `jjjj` es *Jahr* — la abreviatura de una palabra, y se
+traduce. Por eso el catálogo guarda las tres letras sueltas y nunca la máscara montada: la
+arma el componente poniendo las letras en el orden del `locale`.
+
+Lo mismo con `HH/MM`: parecen notación técnica, pero son la inicial de una palabra, y en
+alemán son `SS/MM`. Lo que no se traduce es el dibujo —dos cifras, la hora antes que el
+minuto, dos puntos en medio—.
+
+La regla, en una frase, escrita en `Foundations › Internacionalización`: **si cambia al
+cambiar de idioma es cromo; si cambia al cambiar de país es formato.**
+
+### Lo que se queda como prop
+
+`label`, `helperText` y `errorMessage` de los tres campos; `gridLabel` del `Calendar`, que
+nombra a ESE calendario («Fecha de alta») y sin el cual la rejilla toma el título del mes,
+que ya viene del `locale`; `calendarLabel` cuando lo pone un campo, porque es su etiqueta;
+y el `placeholder` del `DatePicker` cuando dice algo del campo («Desde»), que sustituye a la
+máscara entera.
+
+### Pendiente, anotado
+
+`CalendarPlanner` y `CalendarRoster` siguen con «Mes anterior» y «Mes siguiente» cableados:
+es el mismo texto que `Calendar` y pueden leer de `calendar.*` tal cual. Y `TimeSelect` es
+de 24 horas por construcción; el reloj de 12 con AM/PM es cosa del `locale`, no del idioma,
+y hoy una aplicación en inglés americano ve las horas en formato militar. No es un texto,
+y queda por decidir.
+
+## [42.0.0] — 2026-09-15
+
+> **Major.** Tercera familia al proveedor de textos: los átomos y moléculas de formulario
+> dejan de traer castellano puesto. Y la barra de filtros apila de verdad por debajo del
+> punto de ruptura, no solo cuando la aritmética de la rejilla lo permitía.
+
+### Los formularios leen del proveedor
+
+Doce componentes, doce espacios nuevos en `BrandMessages`: `inputField`, `passwordField`,
+`select`, `multiSelect`, `numberInput`, `otpInput`, `inputPhone`, `asyncSelect`,
+`asyncMultiSelect`, `searchForm`, `docsSearch` y `filterBar`. Los `*Field` que los envuelven
+son reenvío puro y no tienen espacio propio: pasan la prop al átomo, y el átomo lee del
+catálogo. Mismo orden que en las dos olas anteriores —**prop → proveedor → error**— y
+mismo carácter: incompatible **en tiempo de compilación**, que es lo que se busca.
+
+Esta familia iba ahora, y no más tarde, por un reenvío: `DataTable` pasaba
+`searchClearLabel` a un `InputField` que seguía con su «Borrar» cableado, así que las
+tablas no quedaban limpias del todo en una aplicación francesa hasta que cayera el átomo.
+Ese reenvío está cerrado. Y de paso se ha visto lo que tapaba: `removeLabel`,
+`decrementLabel`, `incrementLabel`, `digitLabel`, `countryLabel` y `loadingLabel` **no se
+pasaban en ningún sitio de la suite** — esos controles salían en castellano dentro de las
+aplicaciones en francés, alemán, neerlandés y portugués, y nadie lo había parcheado porque
+nadie lo veía. Con el proveedor se corrigen sin tocar un solo punto de uso.
+
+### Lo que se queda como prop, y las dudosas
+
+`label`, `helperText`, `errorMessage` y el `placeholder` que dice algo del campo son
+**contenido de ese campo** y siguen siendo props; ninguno traía castellano que retirar. Las
+que hubo que decidir mirando **el valor y no el nombre**: `Select.placeholder`
+(«Seleccionar…») es cromo, y la prop gana cuando el marcador dice algo del campo;
+`SearchForm.label` («Buscar») es cromo, porque el buscador de sitio se llama igual en toda
+la suite; `AsyncSelect.emptyMessage` («Sin resultados») es cromo, con la prop intacta para
+un vacío propio. `DocsSearch.clearLabel` no tiene clave: el aspa es la del `InputField` de
+debajo, y darle clave obligaría a traducir «Borrar» dos veces y a que coincidieran.
+`InputPhone.internationalLabel` conserva su «🌐»: un glifo no se traduce.
+
+El sistema **no tiene marca de obligatorio ni de «opcional»** — ni `Label` ni ningún
+`*Field` la emiten. No había nada que migrar ahí; si algún día se quiere, es una pieza
+nueva.
+
+### `FilterBar`: una columna por debajo de `md`, de verdad
+
+Su documentación prometía una columna por debajo del punto de ruptura y sus acciones sí
+conmutaban ahí, pero los filtros se dejaban a la aritmética de la rejilla
+(`minmax(min(192px, 100%), 1fr)`), que solo apila por fuerza por debajo de unos 400px.
+Medido en Chromium: a 320 y 390px, una columna; **a 430, 600, 700 y 760px, dos o tres
+columnas y un selector a media línea**. Es justo lo que se veía en un teléfono apaisado.
+Ahora la base es `1fr` y la rejilla `auto-fill` vive dentro del `@media (min-width: 768px)`
+que ya existía.
+
+El test que debía haberlo cogido medía la caja equivocada: comprobaba que la **celda**
+llenaba la línea —y lo hacía siempre—, no el **control** de dentro, que era lo que se
+quedaba corto, y solo en una franja que ningún preset de ventana de Storybook toca. El test
+nuevo mide el control y mide a 600px.
+
+`FilterBar` pasa a ser componente cliente: leer del contexto lo exige.
+
+### Un solo fixture inglés para las historias
+
+Las historias «Textos desde el proveedor (otro idioma)» de esta ola y de las dos anteriores
+importan un único `.storybook/brandMessagesFixtureEn.ts`, hermano del castellano, en vez de
+repetir el literal en cada una. El test que vigila que ningún fixture se publica ahora
+enumera lo que hay en `.storybook/`, así que el de la próxima ola queda cubierto por
+existir.
+
 ## [41.1.0] — 2026-09-15
 
 > **Minor.** El interruptor de la barra de filtros se centra con el campo que tiene al

package/dist/_shared/datepicker.js

@@ -1,16 +1,13 @@
 import '../datepicker.css';
-import { Icon as e } from "../icon.js";
-import { Input as t } from "../input.js";
-import { Popover as n } from "../popover.js";
-import { Calendar as r } from "../calendar.js";
-import { forwardRef as i, useCallback as a, useId as o, useMemo 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 "./brandmessagescontext.js";
+import { Icon as t } from "../icon.js";
+import { Input as n } from "../input.js";
+import { Popover as r } from "../popover.js";
+import { Calendar as i } from "../calendar.js";
+import { forwardRef as a, useCallback as o, useId as s, useMemo 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/DatePicker/dateMask.ts
-var f = {
-	day: "dd",
-	month: "mm",
-	year: "aaaa"
-}, p = /[‎‏؜]/g, m = new Date(2026, 8, 25);
+var p = /[‎‏؜]/g, m = new Date(2026, 8, 25);
 function h(e, t) {
 	return String(e).padStart(t, "0");
 }
@@ -60,110 +57,110 @@ function g(e) {
 function _(e) {
 	return `${String(e.getFullYear()).padStart(4, "0")}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}`;
 }
-var v = i(function({ value: i, onChange: p, placeholder: m, maskLetters: h = f, invalidMessage: v = "Escribe una fecha completa, con el día, el mes y el año.", openCalendarLabel: y = "Abrir calendario", minDate: b, maxDate: ee, disabledDates: x, size: S = "md", disabled: C, readOnly: w, error: T = !1, locale: E = "es-ES", id: D, name: O, describedBy: k, "aria-describedby": te, "aria-label": ne, calendarLabel: A = "Calendario", previousMonthLabel: re, nextMonthLabel: j, previousYearsLabel: M, nextYearsLabel: N, yearGridLabel: P, gridLabel: F, onBlur: I, className: L }, R) {
-	let [z, B] = l(!1), V = s(() => g(E), [E]), H = i instanceof Date ? V.format(i) : "", [U, W] = l(H), [G, K] = l(H);
-	H !== G && (K(H), W(H));
-	let q = c(null), J = a((e) => {
-		q.current = e, typeof R == "function" ? R(e) : R && (R.current = e);
-	}, [R]), Y = U.trim(), X = Y ? V.parse(U) : null, Z = Y !== "" && !X, ie = T || Z, Q = `${o()}-date-picker-invalid`, ae = [k ?? te, Z ? Q : void 0].filter(Boolean).join(" ") || void 0, oe = a((e) => {
-		(w || C) && e || B(e);
-	}, [C, w]), $ = a((e) => {
+var v = a(function({ value: a, onChange: p, placeholder: m, maskLetters: h, invalidMessage: v, openCalendarLabel: y, minDate: b, maxDate: x, disabledDates: S, size: C = "md", disabled: w, readOnly: T, error: E = !1, locale: D = "es-ES", id: O, name: k, describedBy: ee, "aria-describedby": te, "aria-label": ne, calendarLabel: re, previousMonthLabel: ie, nextMonthLabel: ae, previousYearsLabel: A, nextYearsLabel: j, yearGridLabel: M, gridLabel: N, onBlur: P, className: F }, I) {
+	let L = e("datePicker"), [R, z] = u(!1), B = c(() => g(D), [D]), V = a instanceof Date ? B.format(a) : "", [H, U] = u(V), [W, G] = u(V);
+	V !== W && (G(V), U(V));
+	let K = l(null), q = o((e) => {
+		K.current = e, typeof I == "function" ? I(e) : I && (I.current = e);
+	}, [I]), J = H.trim(), Y = J ? B.parse(H) : null, X = J !== "" && !Y, oe = E || X, Z = `${s()}-date-picker-invalid`, se = [ee ?? te, X ? Z : void 0].filter(Boolean).join(" ") || void 0, ce = o((e) => {
+		(T || w) && e || z(e);
+	}, [w, T]), le = o((e) => {
 		let t = e.target.value;
-		if (W(t), t.trim() === "") {
+		if (U(t), t.trim() === "") {
 			p?.(null);
 			return;
 		}
-		let n = V.parse(t);
+		let n = B.parse(t);
 		n && p?.(n);
-	}, [V, p]), se = a((e) => {
-		if (e.key === "ArrowDown" && !w && !C) {
-			e.preventDefault(), B(!0);
+	}, [B, p]), ue = o((e) => {
+		if (e.key === "ArrowDown" && !T && !w) {
+			e.preventDefault(), z(!0);
 			return;
 		}
-		e.key === "Escape" && z && (e.preventDefault(), B(!1));
+		e.key === "Escape" && R && (e.preventDefault(), z(!1));
 	}, [
-		C,
-		z,
-		w
-	]), ce = a((e) => {
-		W(V.format(e)), p?.(e), B(!1), requestAnimationFrame(() => q.current?.focus());
-	}, [V, p]), le = /* @__PURE__ */ u("button", {
+		w,
+		R,
+		T
+	]), Q = o((e) => {
+		U(B.format(e)), p?.(e), z(!1), requestAnimationFrame(() => K.current?.focus());
+	}, [B, p]), de = /* @__PURE__ */ d("button", {
 		type: "button",
 		className: "date-picker__button",
-		"aria-label": y,
+		"aria-label": L("openCalendar", y),
 		"aria-haspopup": "dialog",
-		"aria-expanded": z,
-		disabled: C,
-		tabIndex: w ? -1 : void 0,
-		children: /* @__PURE__ */ u(e, {
+		"aria-expanded": R,
+		disabled: w,
+		tabIndex: T ? -1 : void 0,
+		children: /* @__PURE__ */ d(t, {
 			name: "calendar",
 			size: "sm",
 			className: "date-picker__glyph"
 		})
-	});
-	return /* @__PURE__ */ d("div", {
+	}), $ = L("calendar", re);
+	return /* @__PURE__ */ f("div", {
 		className: [
 			"date-picker",
-			S === "md" ? "" : `date-picker--${S}`,
-			L ?? ""
+			C === "md" ? "" : `date-picker--${C}`,
+			F ?? ""
 		].filter(Boolean).join(" "),
 		children: [
-			O && /* @__PURE__ */ u("input", {
+			k && /* @__PURE__ */ d("input", {
 				type: "hidden",
-				name: O,
-				value: i instanceof Date ? _(i) : ""
+				name: k,
+				value: a instanceof Date ? _(a) : ""
 			}),
-			/* @__PURE__ */ d("div", {
+			/* @__PURE__ */ f("div", {
 				className: "date-picker__control",
-				children: [/* @__PURE__ */ u(t, {
-					ref: J,
-					id: D,
+				children: [/* @__PURE__ */ d(n, {
+					ref: q,
+					id: O,
 					className: "date-picker__input",
 					type: "text",
 					inputMode: "numeric",
 					autoComplete: "off",
-					size: S,
-					error: ie,
-					value: U,
-					placeholder: m ?? V.mask(h),
-					disabled: C,
-					readOnly: w,
+					size: C,
+					error: oe,
+					value: H,
+					placeholder: m ?? B.mask(L("maskLetters", h)),
+					disabled: w,
+					readOnly: T,
 					"aria-label": ne,
-					"aria-describedby": ae,
-					onChange: $,
-					onKeyDown: se,
-					onBlur: I
-				}), /* @__PURE__ */ u(n, {
-					trigger: le,
-					label: A,
-					open: z,
-					onOpenChange: oe,
+					"aria-describedby": se,
+					onChange: le,
+					onKeyDown: ue,
+					onBlur: P
+				}), /* @__PURE__ */ d(r, {
+					trigger: de,
+					label: $,
+					open: R,
+					onOpenChange: ce,
 					side: "bottom",
 					align: "end",
 					sideOffset: -1,
 					className: "date-picker__popover",
-					children: /* @__PURE__ */ u(r, {
-						value: X ?? i ?? null,
-						onChange: ce,
-						gridLabel: F ?? A,
-						previousMonthLabel: re,
-						nextMonthLabel: j,
-						previousYearsLabel: M,
-						nextYearsLabel: N,
-						yearGridLabel: P,
+					children: /* @__PURE__ */ d(i, {
+						value: Y ?? a ?? null,
+						onChange: Q,
+						gridLabel: N ?? $,
+						previousMonthLabel: ie,
+						nextMonthLabel: ae,
+						previousYearsLabel: A,
+						nextYearsLabel: j,
+						yearGridLabel: M,
 						minDate: b,
-						maxDate: ee,
-						disabledDates: x,
-						locale: E,
-						size: S
+						maxDate: x,
+						disabledDates: S,
+						locale: D,
+						size: C
 					})
 				})]
 			}),
-			Z && /* @__PURE__ */ u("span", {
-				id: Q,
+			X && /* @__PURE__ */ d("span", {
+				id: Z,
 				className: "date-picker__message",
 				role: "alert",
-				children: v
+				children: L("invalid", v)
 			})
 		]
 	});

package/dist/_types/atoms/AsyncMultiSelect/AsyncMultiSelect.d.ts

@@ -4,6 +4,21 @@ export interface AsyncMultiSelectOption {
     value: string;
     label: string;
 }
+/**
+ * Los textos que el control emite por su cuenta. Todos son cromo: dicen lo
+ * mismo en toda la suite y no hablan de lo que se busca. Lo que sí es de esta
+ * pantalla —las opciones que devuelve `onSearch`— no pasa por aquí.
+ */
+export interface AsyncMultiSelectMessages {
+    /** Pista dentro del campo de búsqueda. */
+    placeholder: string;
+    /** Aviso cuando la búsqueda no devuelve opciones. */
+    empty: string;
+    /** Nombre accesible del spinner mientras se busca. */
+    loading: string;
+    /** Nombre accesible del aspa de cada ficha, con la etiqueta de su opción. */
+    remove: (label: string) => string;
+}
 export interface AsyncMultiSelectProps {
     onSearch: (query: string) => Promise<AsyncMultiSelectOption[]>;
     value?: string[];
@@ -21,6 +36,10 @@ export interface AsyncMultiSelectProps {
      * componente las recuerda—, solo para los valores de `defaultValue`.
      */
     selectedOptions?: AsyncMultiSelectOption[];
+    /**
+     * Pista dentro del campo de búsqueda. **Sin default**: sale de la clave
+     * `placeholder` del espacio de este control.
+     */
     placeholder?: string;
     disabled?: boolean;
     readOnly?: boolean;
@@ -53,16 +72,20 @@ export interface AsyncMultiSelectProps {
      */
     'aria-label'?: string;
     'aria-describedby'?: string;
-    /** aria-label del botón que quita un valor. Default: `Quitar ${etiqueta}` (castellano). */
+    /**
+     * aria-label del botón que quita un valor. **Sin default**: sale de
+     * `asyncMultiSelect.remove`.
+     */
     removeLabel?: (label: string) => string;
     /**
-     * Texto mostrado cuando la búsqueda no devuelve opciones. Default: "Sin resultados"
-     * (castellano). Es texto **visible**: una app multiidioma debe pasarlo traducido.
+     * Texto mostrado cuando la búsqueda no devuelve opciones. **Sin default**:
+     * sale de la clave `empty` del espacio de este control en el
+     * `BrandMessagesProvider`.
      */
     emptyMessage?: string;
     /**
-     * Etiqueta accesible del spinner mientras se busca. Default: "Buscando…" (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * Etiqueta accesible del spinner mientras se busca. **Sin default**: sale de
+     * la clave `loading` del espacio de este control.
      */
     loadingLabel?: string;
     /**

package/dist/_types/atoms/AsyncSelect/AsyncSelect.d.ts

@@ -4,12 +4,31 @@ export interface AsyncSelectOption {
     value: string;
     label: string;
 }
+/**
+ * Los textos que el control emite por su cuenta. Todos son cromo: dicen lo
+ * mismo en toda la suite y no hablan de lo que se busca. Lo que sí es de esta
+ * pantalla —las opciones que devuelve `onSearch`— no pasa por aquí.
+ */
+export interface AsyncSelectMessages {
+    /** Pista dentro del campo de búsqueda. */
+    placeholder: string;
+    /** Aviso cuando la búsqueda no devuelve opciones. */
+    empty: string;
+    /** Nombre accesible del spinner mientras se busca. */
+    loading: string;
+    /** Nombre accesible del botón que vacía la selección. */
+    clear: string;
+}
 export interface AsyncSelectProps {
     onSearch: (query: string) => Promise<AsyncSelectOption[]>;
     value?: string | null;
     onValueChange?: (value: string | null, option: AsyncSelectOption | null) => void;
     /** Label of the currently selected option — required when `value` is set so the component can display it */
     selectedOption?: AsyncSelectOption | null;
+    /**
+     * Pista dentro del campo de búsqueda. **Sin default**: sale de la clave
+     * `placeholder` del espacio de este control.
+     */
     placeholder?: string;
     disabled?: boolean;
     readOnly?: boolean;
@@ -43,18 +62,19 @@ export interface AsyncSelectProps {
     'aria-label'?: string;
     'aria-describedby'?: string;
     /**
-     * Texto mostrado cuando la búsqueda no devuelve opciones. Default: "Sin resultados"
-     * (castellano). Es texto **visible**: una app multiidioma debe pasarlo traducido.
+     * Texto mostrado cuando la búsqueda no devuelve opciones. **Sin default**:
+     * sale de la clave `empty` del espacio de este control en el
+     * `BrandMessagesProvider`.
      */
     emptyMessage?: string;
     /**
-     * Etiqueta accesible del spinner mientras se busca. Default: "Buscando…" (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * Etiqueta accesible del spinner mientras se busca. **Sin default**: sale de
+     * la clave `loading` del espacio de este control.
      */
     loadingLabel?: string;
     /**
-     * aria-label del botón de limpiar selección. Default: "Limpiar selección" (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * aria-label del botón de limpiar selección. **Sin default**: sale de
+     * `asyncSelect.clear`.
      */
     clearLabel?: string;
     /**

package/dist/_types/atoms/InputPhone/InputPhone.d.ts

@@ -1,6 +1,15 @@
 import { Select as BaseSelect } from '@base-ui/react/select';
 import type { Country } from 'react-phone-number-input';
 import './InputPhone.css';
+/**
+ * El único texto que el campo emite por su cuenta: el nombre accesible del
+ * selector de país. Los **nombres de los países** no están aquí: los resuelve
+ * `Intl` desde el `locale`, como los meses y las fechas.
+ */
+export interface InputPhoneMessages {
+    /** Nombre accesible del selector de prefijo/país. */
+    country: string;
+}
 export interface InputPhoneProps {
     value?: string;
     defaultCountry?: Country;
@@ -24,14 +33,16 @@ export interface InputPhoneProps {
     onBlur?: React.FocusEventHandler<HTMLInputElement>;
     onFocus?: React.FocusEventHandler<HTMLInputElement>;
     /**
-     * aria-label del selector de país. Default: "País" (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * aria-label del selector de país. **Sin default**: sale de
+     * `inputPhone.country` del `BrandMessagesProvider`.
      */
     countryLabel?: string;
     /**
      * Lo que enseña el selector cuando no hay país elegido (número en formato
-     * internacional). Default: "🌐". Es contenido visible: una app que no quiera
-     * el emoji pasa aquí su propio texto o glifo.
+     * internacional). Default: "🌐". **No pasa por el catálogo de textos a
+     * propósito**: un glifo no se traduce, dice lo mismo en los seis idiomas y
+     * meterlo en el catálogo obligaría a repetirlo seis veces. Una app que no
+     * quiera el emoji pasa aquí su propio texto o glifo.
      */
     internationalLabel?: string;
     /**

package/dist/_types/atoms/MultiSelect/MultiSelect.d.ts

@@ -1,5 +1,17 @@
 import { Popover as BasePopover } from '@base-ui/react/popover';
 import './MultiSelect.css';
+/**
+ * Los dos textos que el control emite por su cuenta: el marcador de sitio sin
+ * nada elegido y el nombre del aspa de cada ficha. Los dos son cromo — dicen
+ * lo mismo en toda la suite, y el segundo solo interpola la etiqueta de la
+ * opción, que es un dato.
+ */
+export interface MultiSelectMessages {
+    /** Marcador de sitio de la caja sin valores elegidos. */
+    placeholder: string;
+    /** Nombre accesible del aspa de una ficha, con la etiqueta de su opción. */
+    remove: (label: string) => string;
+}
 export interface MultiSelectOption {
     value: string;
     label: string;
@@ -9,6 +21,10 @@ export interface MultiSelectProps {
     options: MultiSelectOption[];
     value?: string[];
     defaultValue?: string[];
+    /**
+     * Marcador de sitio sin valores elegidos. **Sin default**: sale de
+     * `multiSelect.placeholder` del `BrandMessagesProvider`.
+     */
     placeholder?: string;
     disabled?: boolean;
     readOnly?: boolean;
@@ -32,7 +48,10 @@ export interface MultiSelectProps {
     'aria-labelledby'?: string;
     /** Ids de ayuda/error que describen el control (lo pone el campo). */
     'aria-describedby'?: string;
-    /** aria-label del botón que quita un valor. Default: `Quitar ${etiqueta}` (castellano). */
+    /**
+     * aria-label del botón que quita un valor. **Sin default**: sale de
+     * `multiSelect.remove` del `BrandMessagesProvider`.
+     */
     removeLabel?: (label: string) => string;
     /**
      * Nodo DOM donde montar el portal del dropdown (reenviado a Base UI

package/dist/_types/atoms/NumberInput/NumberInput.d.ts

@@ -1,5 +1,15 @@
 import { type ComponentPropsWithoutRef } from 'react';
 import './NumberInput.css';
+/**
+ * Los dos textos que el control emite por su cuenta: los nombres accesibles de
+ * sus dos botones. Cromo puro — no dicen nada de qué se cuenta.
+ */
+export interface NumberInputMessages {
+    /** Nombre accesible del botón que resta un paso. */
+    decrement: string;
+    /** Nombre accesible del botón que suma un paso. */
+    increment: string;
+}
 export interface NumberInputProps extends Omit<ComponentPropsWithoutRef<'input'>, 'size' | 'type' | 'value' | 'defaultValue' | 'onChange'> {
     value?: number;
     defaultValue?: number;
@@ -20,13 +30,13 @@ export interface NumberInputProps extends Omit<ComponentPropsWithoutRef<'input'>
     /** Se añade DESPUÉS de las clases propias del componente (el consumidor añade, no sustituye). */
     className?: string;
     /**
-     * aria-label del botón de decremento. Default: "Decrementar" (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * aria-label del botón de decremento. **Sin default**: sale de
+     * `numberInput.decrement` del `BrandMessagesProvider`.
      */
     decrementLabel?: string;
     /**
-     * aria-label del botón de incremento. Default: "Incrementar" (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * aria-label del botón de incremento. **Sin default**: sale de
+     * `numberInput.increment` del `BrandMessagesProvider`.
      */
     incrementLabel?: string;
     onChange?: (value: number) => void;

package/dist/_types/atoms/OtpInput/OtpInput.d.ts

@@ -1,4 +1,15 @@
 import './OtpInput.css';
+/**
+ * Los textos que el control emite por su cuenta: el nombre del grupo cuando va
+ * suelto y el de cada celda. Cromo — el segundo solo interpola la posición de
+ * la celda, que es una cifra.
+ */
+export interface OtpInputMessages {
+    /** Nombre accesible del grupo de celdas cuando el control va suelto. */
+    group: string;
+    /** Nombre accesible de una celda, con su posición y el total. */
+    digit: (index: number, length: number) => string;
+}
 export interface OtpInputProps {
     /** Número de celdas a renderizar. Requerido. */
     length: number;
@@ -22,8 +33,8 @@ export interface OtpInputProps {
     'aria-labelledby'?: string;
     /**
      * Nombre accesible del grupo cuando no se pasa `aria-label` ni
-     * `aria-labelledby` — el caso del control suelto. Default: "Código de
-     * verificación" (castellano). Una app multiidioma debe pasarla traducida.
+     * `aria-labelledby` — el caso del control suelto. **Sin default**: sale de
+     * `otpInput.group` del `BrandMessagesProvider`.
      */
     groupLabel?: string;
     id?: string;
@@ -39,8 +50,8 @@ export interface OtpInputProps {
     /** Se añade DESPUÉS de las clases propias del componente. */
     className?: string;
     /**
-     * Etiqueta accesible de cada celda. Default: `Dígito N de M` (castellano).
-     * Una app multiidioma debe pasarla traducida.
+     * Etiqueta accesible de cada celda. **Sin default**: sale de
+     * `otpInput.digit` del `BrandMessagesProvider`.
      */
     digitLabel?: (index: number, length: number) => string;
 }

package/dist/_types/atoms/Select/Select.d.ts

@@ -2,6 +2,18 @@ import type { ReactNode } from 'react';
 import { Select as BaseSelect } from '@base-ui/react/select';
 import type { SeparatorProps as BaseSeparatorProps } from '@base-ui/react/separator';
 import './Select.css';
+/**
+ * El único texto que el desplegable emite por su cuenta: el marcador de sitio
+ * genérico del disparador, el que dice «aquí no has elegido nada todavía».
+ *
+ * Es cromo, no contenido: cuando el marcador dice algo de ESTE campo («Elige
+ * un país») lo escribe quien monta el campo y viaja por la prop `placeholder`,
+ * que sigue ganando. Las **opciones** tampoco están aquí: son datos.
+ */
+export interface SelectMessages {
+    /** Marcador de sitio del disparador sin valor elegido. */
+    placeholder: string;
+}
 export interface SelectOption {
     value: string;
     label: string;
@@ -34,7 +46,12 @@ export interface SelectProps {
     options: SelectOptionOrGroup[];
     value?: string;
     defaultValue?: string;
-    /** Placeholder del trigger. Default: "Seleccionar…" (en la API compuesta lo pone cada consumidor vía `Select.Value`). */
+    /**
+     * Placeholder del trigger. **Sin default**: sale de `select.placeholder` del
+     * `BrandMessagesProvider`, y esta prop es la anulación puntual cuando el
+     * marcador dice algo de este campo concreto. En la API compuesta lo pone cada
+     * consumidor vía `Select.Value`.
+     */
     placeholder?: string;
     disabled?: boolean;
     readOnly?: boolean;