Loading
NebulaKit ships its texts in English and no other language. An app in another language already keeps its own translations, so it passes NebulaKit the strings from that same dictionary, the one place where they live anyway.
Pass them once for the whole app through the ariaLabels prop of NebkitProvider, keyed by component. Keys you leave out keep their English defaults.
A component's own ariaLabels still win for that one instance, for example a Pagination that needs a distinct name.
The NebAriaLabels type describes every component and key, so your dictionary is checked against it.
import { NebkitProvider, type NebAriaLabels } from '@nebula-kit/core' const ariaLabels: NebAriaLabels = { Pagination: { prev: t('pagination.previous'), next: t('pagination.next') }, Dialog: { close: t('close') },} export const Root = () => ( <NebkitProvider ariaLabels={ariaLabels}> <App /> </NebkitProvider>)Pass default placeholders, headings and button texts once for the whole app through the labels prop of NebkitProvider, keyed by component. Keys you leave out keep their English defaults.
The keys match the component props that show those texts, such as placeholder, noOptionsLabel or buttonLabel. Those props still win for that one instance.
The NebLabels type describes every component and key, so your dictionary is checked against it.
import { NebkitProvider, type NebLabels } from '@nebula-kit/core' const labels: NebLabels = { Select: { placeholder: t('select.placeholder') }, Autocomplete: { noOptionsLabel: t('search.noResults') },} export const Root = () => ( <NebkitProvider labels={labels}> <App /> </NebkitProvider>)Set the locale once through the locale prop of NebkitProvider. Calendar and DatePicker format month names, weekdays and dates from it with the browser's Intl API, with no translations needed.
The locale also decides the first day of the week, Sunday for en-US and Monday for de-DE. weekStartsOn overrides it.
A component's own locale still wins, for example a calendar in the language of a destination.
Set it with server rendering. Without one, the server and the browser each use their own language and the dates differ on hydration.