tab

➤ wl-tab

Organize navigation between groups of content.

➤ Properties

Property	Attribute	Type	Default	Description
ariaChecked	aria-checked	string		Aria checked attribute.
checked	checked	boolean	false	Checks the switch.
disabled	disabled	boolean	false	Disables the element.
name	name	string		Name of the native form element.
readonly	readonly	boolean	false	Makes the element readonly (disabled but tabbable)
required	required	boolean	false	Makes the element required in a form context.
role	role	AriaRole	"tab"	Role of the tab.
value	value	string	""	Value of the form element.
vertical	vertical	boolean	false	Vertical tab style.

➤ Events

Event	Description
change	Dispatched when the checked property changes due to a user interaction.

➤ CSS Custom Properties

Property	Description
--tab-before-margin	Margin of the before slot
--tab-before-margin-vertical	margin of the before slot when vertical
--tab-bg	default background
--tab-bg-active	background when active
--tab-bg-active-filled	background when active and filled
--tab-bg-active-hover	background when active and hover
--tab-bg-active-hover-filled	background when active, hover and filled
--tab-bg-disabled	background when disabled
--tab-bg-disabled-filled	background when disabled and filled
--tab-bg-filled	default background when filled
--tab-bg-hover	background when hover
--tab-bg-hover-filled	background when hover and filled
--tab-color	default color
--tab-color-active	color when active
--tab-color-active-filled	color when active and filled
--tab-color-active-hover	color when active and hover
--tab-color-active-hover-filled	color when active, hover and filled
--tab-color-disabled	color when disabled
--tab-color-disabled-filled	color when disabled and filled
--tab-color-filled	default color when filled
--tab-color-hover	color when hover
--tab-color-hover-filled	color when hover and filled
--tab-opacity-disabled	opacity when disabled
--tab-padding	Padding
--tab-padding-vertical	Padding when vertical
--tab-transition	transition

➤ Slots

Name	Description
	Default content.
before	Default content.

➤ Usage

Go here to try the demo.

➤ Contributors

Andreas Mehlsen	You?

➤ License

Licensed under MIT.