<!-- source-hash: 9e0e6c7a40dc325660ad4e61baf2efdb -->
A accessible toggle switch component built on Radix UI primitives, supporting both controlled and uncontrolled usage patterns with Flamingo ODS design tokens.

## Key Components

- **`Switch`** — A `forwardRef` wrapper around `@radix-ui/react-switch` that manages internal state while staying in sync with optional controlled props (`checked`, `onCheckedChange`).

## Usage Example

```typescript
// Uncontrolled
<Switch />

// Controlled
const [enabled, setEnabled] = React.useState(false);

<Switch
  checked={enabled}
  onCheckedChange={(val) => setEnabled(val)}
/>

// Disabled state
<Switch disabled checked={true} />
```

## Key Behaviors

- **Hybrid state management** — Maintains local `isChecked` state via `useState`, synced with the `checked` prop via `useEffect`, allowing both controlled and uncontrolled usage.
- **Thumb animation** — The inner thumb translates `8px` on toggle using inline `transform` with a `duration-200` transition.
- **ODS token styling** — Uses design tokens (`ods-accent`, `ods-text-secondary`, `ods-card`, `ods-bg-hover`, `ods-bg-active`, `ods-focus`) for consistent theming across states: default, hover, active, focus-visible, and disabled.
- **Accessibility** — Inherits Radix UI's keyboard navigation, ARIA roles, and focus ring support out of the box.