DocumentationLanguage

Language (i18n)

All built-in copy (instructions, drag states, format/size labels, upload failure, retry) is translated. Pick a language with locale: "en" (default), "es", "fr" or "de":

<DropUpload locale="fr" />

If you don't pass instructionLabel, it falls back to the selected locale's default instruction text instead of always being English.

A language the component doesn't ship falls back to English rather than rendering nothing, which is handy when locale comes from a user profile or a database column you don't control.

Overriding individual strings

Use translations to override specific strings on top of the chosen locale, without having to translate everything yourself:

<DropUpload
  locale="es"
  translations={{
    retry: "Reintentar de nuevo",
  }}
/>

Adding a language

The same prop takes a language the component doesn't ship: hand translations a full dictionary and nothing falls back.

import type { DropUploadTranslations } from "@/components/DropUpload"

const pt: DropUploadTranslations = {
  instructionLabel: "Solte os seus ficheiros aqui",
  /* …the rest of the keys */
}

<DropUpload translations={pt} />

Or add it to locales/translations.ts next to the four that ship. It is one more object of the same shape, and DropUploadLocale picks it up on its own. Every view reads its copy from a single t context value, so there is no hardcoded string left anywhere else to find.

See locales/translations.ts in the component source for the full list of translatable keys and the en/es/fr/de dictionaries.