mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-17 11:11:25 +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

77
src/components/OverflowMenu/OverflowMenu.stories.js
View file

@ -1,62 +1,71 @@
import { withKnobs, select, text, boolean } from '@storybook/addon-knobs';
import Component from './OverflowMenu.Story.svelte';
import { withKnobs, select, text, boolean } from "@storybook/addon-knobs";
import Component from "./OverflowMenu.Story.svelte";
export default { title: 'OverflowMenu', decorators: [withKnobs] };
export default { title: "OverflowMenu", decorators: [withKnobs] };
const directions = {
'Bottom of the trigger button (bottom)': 'bottom',
'Top of the trigger button (top)': 'top'
"Bottom of the trigger button (bottom)": "bottom",
"Top of the trigger button (top)": "top",
};
export const Default = () => ({
Component,
props: {
menu: {
direction: select('Menu direction (direction)', directions, 'bottom'),
ariaLabel: text('ARIA label (ariaLabel)', 'Menu'),
iconDescription: text('Icon description (iconDescription)', ''),
flipped: boolean('Flipped (flipped)', false),
light: boolean('Light (light)', false)
direction: select("Menu direction (direction)", directions, "bottom"),
ariaLabel: text("ARIA label (ariaLabel)", "Menu"),
iconDescription: text("Icon description (iconDescription)", ""),
flipped: boolean("Flipped (flipped)", false),
light: boolean("Light (light)", false),
},
menuItem: {
disabled: boolean('Disabled (disabled)', false),
requireTitle: boolean('Use hover over text for menu item (requireTitle)', false)
}
}
disabled: boolean("Disabled (disabled)", false),
requireTitle: boolean(
"Use hover over text for menu item (requireTitle)",
false
),
},
},
});
export const WithLinks = () => ({
Component,
props: {
story: 'links',
story: "links",
menu: {
direction: select('Menu direction (direction)', directions, 'bottom'),
ariaLabel: text('ARIA label (ariaLabel)', 'Menu'),
iconDescription: text('Icon description (iconDescription)', ''),
flipped: boolean('Flipped (flipped)', false),
light: boolean('Light (light)', false)
direction: select("Menu direction (direction)", directions, "bottom"),
ariaLabel: text("ARIA label (ariaLabel)", "Menu"),
iconDescription: text("Icon description (iconDescription)", ""),
flipped: boolean("Flipped (flipped)", false),
light: boolean("Light (light)", false),
},
menuItem: {
disabled: boolean('Disabled (disabled)', false),
requireTitle: boolean('Use hover over text for menu item (requireTitle)', false)
}
}
disabled: boolean("Disabled (disabled)", false),
requireTitle: boolean(
"Use hover over text for menu item (requireTitle)",
false
),
},
},
});
export const CustomTrigger = () => ({
Component,
props: {
story: 'trigger',
story: "trigger",
menu: {
direction: select('Menu direction (direction)', directions, 'bottom'),
ariaLabel: text('ARIA label (ariaLabel)', 'Menu'),
iconDescription: text('Icon description (iconDescription)', ''),
flipped: boolean('Flipped (flipped)', false),
light: boolean('Light (light)', false)
direction: select("Menu direction (direction)", directions, "bottom"),
ariaLabel: text("ARIA label (ariaLabel)", "Menu"),
iconDescription: text("Icon description (iconDescription)", ""),
flipped: boolean("Flipped (flipped)", false),
light: boolean("Light (light)", false),
},
menuItem: {
disabled: boolean('Disabled (disabled)', false),
requireTitle: boolean('Use hover over text for menu item (requireTitle)', false)
}
}
disabled: boolean("Disabled (disabled)", false),
requireTitle: boolean(
"Use hover over text for menu item (requireTitle)",
false
),
},
},
});