useTabListState

Provides state management for a Tabs component. Tabs include a TabList which tracks which tab is currently selected and displays the content associated with that Tab in a TabPanel.

installyarn add @react-stately/tabs
version3.0.4
usageimport {useTabListState} from '@react-stately/tabs'

API#


useTabListState<T>( (props: TabListProps<T> )): TabListState<T>

Interface#


Properties

NameTypeDescription
selectedKeyKeyThe key for the currently selected item.
selectedItemNode<T>The value of the currently selected item.
collectionCollection<Node<T>>A collection of items in the list.
disabledKeysSet<Key>A set of items that are disabled.
selectionManagerSelectionManagerA selection manager to read and update multiple selection state.

Methods

MethodDescription
setSelectedKey( (key: Key )): voidSets the selected key.

Example#


See the docs for useTabList in react-aria for an example of useTabListState.