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

refactor: use $$restProps API

Browse source 
- add ref prop for applicable components (#196)
- add slot to Content Switcher `Switch` component (#183)
- remove fillArray, css utilities
This commit is contained in:
Eric Liu 2020-07-18 20:00:20 -07:00
commit e886d772c7
288 changed files with 4681 additions and 4498 deletions
Download patch file Download diff file Expand all files Collapse all files

55
src/components/Tabs/Tabs.stories.js
View file

@ -1,45 +1,48 @@
import { withKnobs, boolean, number, text } from '@storybook/addon-knobs';
import Component from './Tabs.Story.svelte';
import { withKnobs, boolean, number, text } from "@storybook/addon-knobs";
import Component from "./Tabs.Story.svelte";
export default { title: 'Tabs', decorators: [withKnobs] };
export default { title: "Tabs", decorators: [withKnobs] };
export const Default = () => ({
Component,
props: {
tabProps: {
disabled: boolean('Disabled (disabled in <Tab>)', false),
href: text('The href for tab (href in <Tab>)', '#'),
role: text('ARIA role (role in <Tab>)', 'presentation'),
tabindex: text('Tab index (tabindex in <Tab>)', '0')
disabled: boolean("Disabled (disabled in <Tab>)", false),
href: text("The href for tab (href in <Tab>)", "#"),
role: text("ARIA role (role in <Tab>)", "presentation"),
tabindex: text("Tab index (tabindex in <Tab>)", "0"),
},
tabsProps: {
className: 'some-class',
selected: number('The index of the selected tab (selected in <Tabs>)', 1),
triggerHref: text('The href of trigger button for narrow mode (triggerHref in <Tabs>)', '#'),
role: text('ARIA role (role in <Tabs>)', 'navigation'),
className: "some-class",
selected: number("The index of the selected tab (selected in <Tabs>)", 1),
triggerHref: text(
"The href of trigger button for narrow mode (triggerHref in <Tabs>)",
"#"
),
role: text("ARIA role (role in <Tabs>)", "navigation"),
iconDescription: text(
'The description of the trigger icon for narrow mode (iconDescription in <Tabs>)',
'show menu options'
"The description of the trigger icon for narrow mode (iconDescription in <Tabs>)",
"show menu options"
),
tabContentClassName: text(
'The className for the child `<TabContent>` components',
'tab-content'
)
}
}
"The className for the child `<TabContent>` components",
"tab-content"
),
},
},
});
export const Container = () => ({
Component,
props: {
story: 'container',
story: "container",
tabProps: {
disabled: boolean('Disabled (disabled in <Tab>)', false),
href: text('The href for tab (href in <Tab>)', '#'),
role: text('ARIA role (role in <Tab>)', 'presentation'),
tabindex: text('Tab index (tabindex in <Tab>)', '0')
}
}
disabled: boolean("Disabled (disabled in <Tab>)", false),
href: text("The href for tab (href in <Tab>)", "#"),
role: text("ARIA role (role in <Tab>)", "presentation"),
tabindex: text("Tab index (tabindex in <Tab>)", "0"),
},
},
});
export const Skeleton = () => ({ Component, props: { story: 'skeleton' } });
export const Skeleton = () => ({ Component, props: { story: "skeleton" } });