RAPIDA UI

Language Switcher

Allows field reporters to switch between available languages. Composes Badge atoms as radio-style selectors. Critical for multilingual crisis contexts where reports must be submitted in the reporter's preferred language.

Preview — Three Languages

Preview — Arabic Selected

Configurations

Two languages

Five languages

Accessibility

  • Uses role="radiogroup" with descriptive aria-label.
  • Each radio input has an aria-label with the full language name.
  • Focus is visible via peer-focus-visible:ring-2 on the badge.
  • Touch targets meet the 48px minimum for field use.

Trauma-Informed Design

  • Language codes are universally recognizable — EN, AR, NE — reducing cognitive load.
  • Active language uses high-contrast rapida-blue to clearly indicate the current selection.
  • Switcher works offline — language change does not require a network request.
  • Large touch targets accommodate stressed users in field conditions.