Tier C

RN-universal RadioGroup pilot

Scaffolded

Single-select list. Root holds value in state (controlled or uncontrolled). Items consume value via React context. accessibilityRole='radiogroup' on the root; accessibilityRole='radio' + accessibilityState.checked on each item.

Side-by-side: controlled

shadcn (Radix RadioGroup)
RN (Pressable + context via RN Web)
daily
weekly
monthly

Shared state: selecting on either surface updates both.

Rich option cards

Basic
Up to 100 students · email support
Pro
Up to 1,000 students · priority support
Enterprise
Unlimited · dedicated success manager

Selected plan: pro

Disabled item

Available option A
Available option B
Unavailable (disabled)

Semantics

AspectshadcnRNNotes
Root roleimplicit on Radix rootaccessibilityRole="radiogroup"Root announces as a group
Item rolerole="radio" via RadixaccessibilityRole="radio"Role parity
SelectionRadix orchestrates focusReact context holds valueNative parity — context works everywhere
Controlledvalue + onValueChangesameAPI parity
Keyboardarrow keys move selectioninherits RN Web keyboard handling on PressableNative keyboard nav: Phase 7