# LanguageSwitcher

Canonical page: https://docs.ovok.com/native-sdk/guide/components/language-switcher

`LanguageSwitcher` is a controlled `View` that provides the selected language and change callback to its option children. It does not own an i18n instance, a language catalog, persistence, or translation loading.

```tsx
const [language, setLanguage] = React.useState("en_US");

<LanguageSwitcher
  selectedLanguage={language}
  onLanguageChange={setLanguage}
>
  <LanguageSwitcher.Option value="en_US">
    <LanguageSwitcher.Option.RadioButton />
    <LanguageSwitcher.Option.Label>English</LanguageSwitcher.Option.Label>
  </LanguageSwitcher.Option>
  <LanguageSwitcher.Option value="de_DE">
    <LanguageSwitcher.Option.RadioButton />
    <LanguageSwitcher.Option.Label>Deutsch</LanguageSwitcher.Option.Label>
  </LanguageSwitcher.Option>
</LanguageSwitcher>;
```

## Props and behavior [#props-and-behavior]

Required props are `selectedLanguage: string` and `onLanguageChange(language: string)`. The component also accepts React Native `ViewProps`. There is no `languages` prop; render the option children your app supports.

`LanguageSwitcher.Option` accepts `value`, `TouchableOpacityProps`, and children. Pressing an option calls `onLanguageChange(value)` and then its optional caller `onPress`. It also provides option state to `RadioButton`, `Label`, and `Flag`.

- `Option.RadioButton` wraps Paper's Android radio button and controls `status` and `value` from context; those two props cannot be overridden.
- `Option.Label` wraps Paper `Text`, applies the SDK bold label style, and accepts Paper text props.
- `Option.Flag` is a plain `View` wrapper; the app supplies the flag content.

## Hook and context [#hook-and-context]

`useLanguageSwitcher` reads the provider and throws when used outside `LanguageSwitcher`. `LanguageSwitcherContext` and `LanguageSwitcherContextType` are public escape hatches. The SDK only communicates the selected string; the integrating app decides how that string changes the active locale and whether it is persisted.

See [Language switcher hook and context](/native-sdk/guide/components/language-switcher/advanced-api/) for a custom child example.