A touchable option component for individual language selection. Provides context for its child components and handles selection state, styling, and interaction feedback with Material Design 3 theming.

Basic Example

Selected: Primary border color and background emphasis
Unselected: Disabled border color and transparent background
Pressed: Touch opacity feedback for interaction
Disabled: Reduced opacity and disabled interactions

import { LanguageSwitcher } from "@ovok/native";
import * as React from "react";

const BasicLanguageSwitcherOption = () => (
  // This component needs to be wrapped in a LanguageSwitcher component to work
  <LanguageSwitcher selectedLanguage="en_US" onLanguageChange={() => {}}>
    <LanguageSwitcher.Option value="en_US">
      <LanguageSwitcher.Option.RadioButton />
      <LanguageSwitcher.Option.Label>English</LanguageSwitcher.Option.Label>
    </LanguageSwitcher.Option>
  </LanguageSwitcher>
);

export default BasicLanguageSwitcherOption;