UnderlinePanels

The underline panels are used to break related content into tabbed panels.

v0.36.1AlphaNot reviewed for accessibility

Description

Use UnderlinePanels to style tabs with an associated panel and an underlined selected state.

Arguments

NameTypeDefaultDescription
label
String

N/A

Sets an aria-label that helps assistive technology users understand the purpose of the tabs.

align
Symbol

:left

One of :left or :right. - Defaults to left

body_arguments
Hash

{}

System arguments for the body wrapper.

wrapper_arguments
Hash

{}

System arguments for the TabContainer wrapper.

system_arguments
Hash

N/A

Examples

Slots

tabs

Use to render a button and an associated panel slot. See the example below or refer to Primer::Alpha::Navigation::Tab.

NameTypeDefaultDescription
id
String

N/A

Unique ID of tab.

selected
Boolean

N/A

Whether the tab is selected.

system_arguments
Hash

N/A

actions

Use actions for a call to action.

NameTypeDefaultDescription
tag
Symbol

:div

One of :div or :span.

system_arguments
Hash

N/A