Tabs that switch panels without a round trip: variant: :boxed is the pill group, :line the underlined
row. A small hook moves the selection with ← → Home End (roving tabindex, aria-selected) and shows
the panel of the selected tab. With orientation: :vertical the tabs are a column beside the panels, the
list says aria-orientation="vertical" and the keys are ↑ ↓ Home End. Each tab may carry a count, in a count_tone if it should stand out.
The first tab is selected unless one says selected. What the person picks in the browser survives the
server re-rendering the tabs; when the server changes which tab says selected, that one wins. The dark
theme uses the same tokens as the light one: the track is wrap, the selected tab is card.
Summary
Functions
Tabs that switch their panels in the browser.
Functions
@spec tabs(map()) :: Phoenix.LiveView.Rendered.t()
Tabs that switch their panels in the browser.
Attributes
id(:string) (required)variant(:atom) - Defaults to:boxed. Must be one of:boxed, or:line.label(:string) (required) - the name of the tab list, for assistive technology.orientation(:atom) -:verticalputs the tabs in a column beside the panels. Defaults to:horizontal. Must be one of:horizontal, or:vertical.full(:boolean) - the tab list takes the whole width and the tabs share it. Defaults tofalse.class(:any) - Defaults tonil.- Global attributes are accepted.
Slots
tab(required) - one tab; its content is the panel. Accepts attributes:id(:string) (required) - names the tab and its panel; unique in the tabs.label(:string) (required)count(:any) - a number beside the label.count_tone(:atom) - the tone of the count: risk, warn, ok, info or neutral.selected(:boolean) - open on first render, and whenever the server changes it.