> ## Documentation Index
> Fetch the complete documentation index at: https://docs.fanfare.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Internationalization

> Set locales and override component text.

Fanfare components ship with default text and locale support. You can set the active locale and override any message key your integration needs to own.

## Set locale on the provider

```tsx theme={null}
import { FanfareProvider } from "@fanfare-io/fanfare-sdk-react";

export function App() {
  return (
    <FanfareProvider
      organizationId="org_123"
      publishableKey="pk_live_123"
      locale="fr"
    >
      <ProductLaunchPage />
    </FanfareProvider>
  );
}
```

Supported default locale data includes English, Spanish, French, German, Italian, Portuguese, Japanese, and Chinese. Locale values are extensible so your app can pass regional locale tags where needed.

## Override messages

```tsx theme={null}
import { FanfareProvider } from "@fanfare-io/fanfare-sdk-react";

export function App() {
  return (
    <FanfareProvider
      organizationId="org_123"
      publishableKey="pk_live_123"
      translations={{
        "queue.enter": "Join the line",
        "queue.leave": "Leave the line",
        "granted.cta": "Continue to checkout",
        "error.retry": "Try again",
      }}
    >
      <ProductLaunchPage />
    </FanfareProvider>
  );
}
```

Translation overrides are partial. Any key you do not override falls back to the SDK default for the active locale.

## Use translations in custom UI

```tsx theme={null}
import { useTranslations } from "@fanfare-io/fanfare-sdk-react";

export function CustomButton({ onClick }: { onClick: () => void }) {
  const { t } = useTranslations();

  return <button onClick={onClick}>{t("queue.enter")}</button>;
}
```

## Type-safe keys

```ts theme={null}
import type { TranslationMessageKey } from "@fanfare-io/fanfare-sdk-react";

const customCopy: Partial<Record<TranslationMessageKey, string>> = {
  "common.continue": "Continue",
  "granted.cta": "Shop now",
};
```

Use customer-friendly copy. For verification and access decisions, keep the message outcome-oriented and avoid describing private enforcement logic.
