Todos los componentes (204)

Proveedor de idioma

Más · LocaleProvider

Qué es y cuándo usarlo

Fija el idioma de los componentes que formatean datos: fechas, horas, números e importes, y hacia qué lado se escriben (un idioma de derecha a izquierda da la vuelta a deslizadores y calendarios). locale es una etiqueta BCP-47; por defecto, es-ES: día, mes y año, semana que empieza en lunes y coma decimal. Sin proveedor, los componentes también usan es-ES, no el idioma del navegador: así una fecha no sale al revés (10/15/2026) en una máquina en inglés.

Cuándo usarlo

Una vez, arriba del árbol, cuando la aplicación no va en es-ES. Si ya está AmsetProvider, no hace falta: lo lleva dentro (con su prop locale).
Dentro de otro, para una parte de la página en otro idioma: manda el más cercano.

Cuándo no

Para que la persona elija idioma: eso es LocalePicker, y lo que elija es lo que luego se pasa aquí.
Para traducir los textos de la aplicación: esto formatea, no traduce.

Teclado: no tiene, es un proveedor.

Accesibilidad: los segmentos de fecha y los números se leen en el idioma que se fija aquí. Lo que la librería escribe con sus propias palabras (por ejemplo, «Abrir calendario» en el selector de fecha) sigue en español.

Aspecto fino: no pinta nada.

Cómo se ve

Español (España)

1234,56 €

Entrega (es-ES)

24102026

Inglés (Estados Unidos)

€1,234.56

Entrega (en-US)

10242026

Alemán (Alemania)

1.234,56 €

Entrega (de-DE)

24102026

<LocaleProvider locale="en-US">
  <Amount quantity={1234.56} />
  <DatePicker label="Entrega" defaultValue={{ year: 2026, month: 10, day: 24 }} />
</LocaleProvider>

Props

Se importa con import { LocaleProvider } from '@amset/ui'. Las obligatorias van marcadas.

Prop	Tipo	Para qué sirve
`children`obligatoria	`ReactNode`	—
`catalogs`	`Readonly<Record<string, CatalogSource>>`	Idiomas enteros escritos por la aplicacion, por etiqueta BCP-47. Cada uno es el JSON (`{ fr, 'pt-BR': ptBR }`) o una funcion que lo carga solo cuando se usa (`{ fr: () => import('./fr.json') }`), de modo que un idioma que nadie pide no pesa. Se usa el del `locale` activo, y los textos que no traiga caen en inglés clave a clave; mientras llega uno perezoso salen los de la biblioteca. La plantilla de claves esta en `@amset/ui/locales/es.json`.
`locale`	`string`	Etiqueta BCP-47. Por defecto `es-ES`.
`messages`	`MessageOverrides`	Textos propios que mandan sobre los de la biblioteca (por ejemplo `{ 'Alert.closeLabel': 'Dismiss' }`). Los idiomas que la biblioteca no trae caen en inglés; con esto se cambia lo que haga falta. Mandan sobre los de `catalogs`.
`onCatalogError`	`CatalogErrorHandler`	Se llama si un catalogo perezoso no se pudo cargar (red, ruta rota). Mientras tanto salen los textos de la biblioteca.

En el banco de pruebas

Cada estado y cada variante, para tocarlos de uno en uno, en su ficha de ui.amset.tech: