mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs(tabs): add example "Disabled tabs" (#1322)

Browse source
This commit is contained in:
metonym 2022-05-29 10:32:22 -07:00 • committed by GitHub
commit f431104057
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

19
docs/src/pages/components/Tabs.svx
View file

@ -41,6 +41,25 @@ Set `autoWidth` to `true` for tabs to have an automatically set width.
<FileSource src="/framed/Tabs/TabsReactive" /> <FileSource src="/framed/Tabs/TabsReactive" />
### Disabled tabs
Setting `disabled` to `true` on the `Tab` component will prevent it from being clickable.
Using keyboard navigation (left and right arrow keys) will skip to the next non-disabled tab.
<Tabs>
<Tab label="Tab label 1" />
<Tab label="Tab label 2" disabled />
<Tab label="Tab label 3" disabled />
<Tab label="Tab label 4" />
<svelte:fragment slot="content">
<TabContent>Content 1</TabContent>
<TabContent>Content 2</TabContent>
<TabContent>Content 3</TabContent>
<TabContent>Content 4</TabContent>
</svelte:fragment>
</Tabs>
### Container type ### Container type
<Tabs type="container"> <Tabs type="container">