Skip to main content

UI language

The <Designer> speaks English by default. Pass locale="pt-BR" to switch its own UI (buttons, tabs, warnings, placeholders) to Portuguese:

<Designer
locale="pt-BR"
template={template}
onChangeTemplate={setTemplate}
bindings={bindings}
onChangeBindings={setBindings}
/>

This is purely a UI-chrome setting — it never changes how the generated PDF formats dates or currency (that's {DATE(...)}/ {CURRENCY(...)} written into the template's own content by whoever designs it, see Data binding), and it never changes the internal name your templates already use for existing fields.

Standalone components​

If you use any of the package's components standalone (PdfPreview, FieldList, etc.) without wrapping them in <Designer>, they render in English by default too — wrap them in <I18nProvider locale="pt-BR"> yourself if you need them in Portuguese:

import { I18nProvider } from "json-pdf-designer";
import { PdfPreview } from "json-pdf-designer/preview";

<I18nProvider locale="pt-BR">
<PdfPreview bytes={pdfBytes} />
</I18nProvider>

useT()/useLocale() (exported) give you the active dictionary/locale code inside your own components — the same context <Designer> uses internally.