Array of tab configurations
Optional configuration for initial tab and change callback
Tab state and handlers
const tabs: Tab[] = [
{ id: 'tab1', label: 'First Tab', content: <div>Content 1</div> },
{ id: 'tab2', label: 'Second Tab', content: <div>Content 2</div> },
];
const { activeTab, selectTab, handleKeyDown, tabRefs } = useTabs(tabs, {
initialTab: 'tab1',
onChange: (tabId) => console.log('Tab changed to:', tabId),
});
Hook for managing tab state with keyboard navigation
This hook provides: