Localização

Cada string de interface integrada (botões de fechar, rótulos de paginação, anúncios de ordenação, avisos de upload…) é resolvida através do registro de locales. Apenas en está embutido no bundle — todos os outros idiomas são carregados de fora (módulo importável ou arquivo JSON) e registrados com addLocale. O mesmo registro alimenta o @zephora/react e o @zephora/native. en, tr.

Carregando uma locale

// 1) As a module (tree-shaken, typed):
import { addLocale } from "@zephora/react";
import { trLocale } from "@zephora/theme/locales/tr";
addLocale("tr", trLocale);

// 2) As JSON over the network (e.g. from your CDN):
const messages = await fetch("/locales/tr.json").then((r) => r.json());
addLocale("tr", messages);
// JSON dosyası pakette hazır: @zephora/theme/locales/tr.json

Demo ao vivo

Troque a locale — os rótulos de paginação e os botões de diálogo se atualizam na hora.

Escolhendo uma locale

// Web
<ZephoraConfigProvider locale="tr">...</ZephoraConfigProvider>

// React Native
<ZephoraProvider theme={lightTheme} locale="tr">...</ZephoraProvider>

Registrando uma locale personalizada

addLocale mescla suas mensagens sobre o inglês, então as definições parciais são seguras. updateLocale corrige uma já existente.

import { addLocale, updateLocale } from "@zephora/react";

addLocale("de", {
  intlLocale: "de",
  firstDayOfWeek: 1,
  close: "Schließen",
  cancel: "Abbrechen",
  confirm: "Bestätigen",
  loading: "Wird geladen…",
  pageOf: "Seite {page} von {count}",
});

updateLocale("de", { clear: "Leeren" });

Lendo strings nos seus próprios componentes

import { useLocale, localeOption } from "@zephora/react";

function SaveBar() {
  const { t } = useLocale();
  return <Button>{t("apply")}</Button>;
}

// Outside React:
localeOption("cancel", "tr"); // "İptal"

Locales disponíveis

Vem com 48 traduções prontas para usar. Cada uma é um módulo independente — importe apenas o que você precisa (ou faça fetch do .json correspondente).

Referência de mensagens

O conjunto completo de chaves vive no tipo ZephoraLocale — ações (close, cancel, confirm, clear…), estados de dados (loading, noData, emptyMessage), strings de formulário (showPassword, browseFiles, removeFile), navegação (pageOf, nextPage, breadcrumb), exibição de dados (sortAscending, selectAllRows, goToSlide) e datas (prevMonth, chooseDate, firstDayOfWeek, intlLocale). Os placeholders usam a sintaxe {param} interpolada por t(key, params).