Skip to main content

Tabs

Tabs are used to show different views or sections of content within the same context.

https://www.figma.com/design/JesXQFLaPJLc1BdBM4sisI/%F0%9F%A6%93-ZDS---Components?node-id=21265-29001

Demo​

zeta-web v1.4.2
Web Components


A tab item to be used in a zeta-tab-bar

Storybook​

https://design.zebra.com/web/storybook/?path=/docs/components-tab-bar--docs

Slots​

NameDescriptionType
defaultThe content of the menu item.text

Attributes​

NameDescriptionTypeDefault
activebooleanfalse
selectedbooleanfalse

Inherited Attributes​

NameDescriptionTypeDefaultInherited From
roundedWhether the component is rounded or sharp.When true, rounded will set the border radius of the first child, and any children with class 'contourable-target' to --radius-minimal.Otherwise, this value will be --radius-none.boolean | undefinedtrueContourable
disabledBoolean for if component is disabled.This will apply disabled styles.booleanfalseInteractive
tabIndexThe tab index of the component, used to determine the order in which elements receive focus when the user navigates through the document by pressing the Tab key.number0Interactive