Skip to content

Tab

@astryxdesign/core v0.7.1 · Tab

Props ​

PropTypeDefaultDescription
valuestring—Unique value of this tab. The surrounding TabList matches its own value against it to decide the selection. Required.
labelstring—Visible text. The default slot wins when both are given, and this prop becomes the accessible name while the label is hidden.
panelIdstring—ID of the panel this tab controls, for aria-controls. Only used when the strip is a role="tablist".
disabledbooleanfalseWhether the tab is disabled. Keyboard navigation skips it.
hrefstring—URL to navigate to. Outside the tabs pattern the tab renders as a link. Ignored inside a role="tablist" strip.
asNavLinkComponent'a'Link root component, such as a router link. Only applies when there is an href and the strip is not a tablist.
isLabelHiddenbooleanfalseHides the label visually. Only the icon and the end content show, and label becomes the accessible name.

Slots ​

  • default: the label text. Falls back to the label prop.
  • icon: icon shown while the tab is not selected.
  • selectedIcon: icon shown while the tab is selected. Falls back to icon.
  • endContent: content after the label, such as a badge count or a status dot.