Button Toggle

Headless primitive examples first, followed by component-wrapper examples using <tng-button-toggle-group> and <tng-button-toggle>.

Headless Primitives: `tngButtonToggleGroup` + `tngButtonToggle`

Use arrow keys to move focus. In single mode, one item stays selected by default.

Single-select alignment

Multi-select text styles

Primitive state: align=left, styles=bold

Wrapper layer forwards to the same primitive behavior, including keyboard navigation.

Single-select alignment

Multi-select text styles

Component state: align=left, styles=bold