diff --git a/src/Tabs.tsx b/src/Tabs.tsx index bcfa7233..e8f2eea9 100644 --- a/src/Tabs.tsx +++ b/src/Tabs.tsx @@ -35,6 +35,7 @@ export namespace TabsProps { iconId?: FrIconClassName | RiIconClassName; content: ReactNode; isDefault?: boolean; + disabled?: boolean; }[]; selectedTabId?: undefined; onTabChange?: (params: { tabIndex: number; tab: Uncontrolled["tabs"][number] }) => void; @@ -46,6 +47,7 @@ export namespace TabsProps { tabId: string; label: ReactNode; iconId?: FrIconClassName | RiIconClassName; + disabled?: boolean; }[]; selectedTabId: string; onTabChange: (tabId: string) => void; @@ -156,7 +158,7 @@ export const Tabs = memo( aria-label={label} onKeyDownCapture={e => onKeyboardNavigation(e)} > - {tabs.map(({ label, iconId }, tabIndex) => ( + {tabs.map(({ label, iconId, disabled }, tabIndex) => (
Content of tab1
}, { label: "Tab 2", iconId: "fr-icon-ball-pen-fill", isDefault: true, content:Content of tab2
}, - { label: "Tab 3", content:Content of tab3
} + { label: "Tab 3", content:Content of tab3
}, + { label: "Tab 4", content: null, disabled: true } ]} /> \`\`\` @@ -40,6 +41,7 @@ function ControlledTabs() { { tabId: "tab1", label: "Tab 1", iconId: "fr-icon-add-line" }, { tabId: "tab2", label: "Tab 2", iconId: "fr-icon-ball-pen-fill" }, { tabId: "tab3", label: "Tab 3" }, + { tabId: "tab4", label: "Tab 4", disabled: true }, ]} onTabChange={setSelectedTabId} > @@ -64,7 +66,8 @@ export const Default = getStory({ "iconId": "fr-icon-ball-pen-fill", "content":Content of tab2
}, - { "label": "Tab 3", "content":Content of tab3
} + { "label": "Tab 3", "content":Content of tab3
}, + { "label": "Tab 4", "content": null, disabled: true } ], "label": "Name of the tabs system", ...logCallbacks(["onTabChange"]) @@ -79,7 +82,8 @@ export const WithTab2OpenedByDefault = getStory({ "isDefault": true, "content":Content of tab2
}, - { "label": "Tab 3", "content":Content of tab3
} + { "label": "Tab 3", "content":Content of tab3
}, + { "label": "Tab 4", "content": null, "disabled": true } ], "label": "Name of the tabs system", ...logCallbacks(["onTabChange"])