Components / Editable Text Radio Group

Editable Text Radio Group

Choosing one text option while keeping every option editable in place: hook pickers and other pick-one-then-tweak lists.

import { EditableTextRadioGroup } from '@layers/ui/editable-text-radio-group'

Rendered stock

House rules

  • Controlled by index: selectedIndex plus onSelectedIndexChange handle selection; onItemChange(index, value) receives edits as the user types.
  • isLoading renders skeleton rows in the same frame (skeletonCount, default 7); no separate loading layout needed.
  • Rows are contentEditable, so editing a row does not change the selection; clicking a row selects it.