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

chore: remove storybook

Browse source
This commit is contained in:
Eric Liu 2020-10-14 16:23:44 -07:00
commit 378fe06e03
116 changed files with 103 additions and 14249 deletions
Download patch file Download diff file Expand all files Collapse all files

96
src/OverflowMenu/OverflowMenu.Story.svelte
View file

@ -1,96 +0,0 @@
<script>
export let story = undefined;
import OverflowMenu from "./OverflowMenu.svelte";
import OverflowMenuItem from "./OverflowMenuItem.svelte";
$: primaryFocus = true;
</script>
<div style="padding-left: 6rem">
{#if story === 'links'}
<OverflowMenu
{...$$props.menu}
on:close="{({ detail }) => {
console.log('close', detail);
}}"
>
<OverflowMenuItem
{...$$props.menuItem}
href="https://ibm.com"
text="Option 1"
bind:primaryFocus
/>
<OverflowMenuItem
{...$$props.menuItem}
href="https://ibm.com"
text="Option 2 is an example of a really long string and how we
recommend handling this"
requireTitle
/>
<OverflowMenuItem
{...$$props.menuItem}
href="https://ibm.com"
text="Option 3"
disabled
/>
<OverflowMenuItem
{...$$props.menuItem}
href="https://ibm.com"
text="Option 4"
/>
<OverflowMenuItem
{...$$props.menuItem}
href="https://ibm.com"
text="Danger option"
danger
/>
</OverflowMenu>
{:else if story === 'trigger'}
<OverflowMenu
{...$$props.menu}
on:close="{({ detail }) => {
console.log('close', detail);
}}"
style="width: auto"
>
<div slot="menu" style="padding: 0 1rem">Menu</div>
<OverflowMenuItem
{...$$props.menuItem}
text="Option 1"
bind:primaryFocus
/>
<OverflowMenuItem
{...$$props.menuItem}
text="Option 2 is an example of a really long string and how we
recommend handling this"
requireTitle
/>
<OverflowMenuItem {...$$props.menuItem} text="Option 3" disabled />
<OverflowMenuItem {...$$props.menuItem} text="Option 4" />
<OverflowMenuItem {...$$props.menuItem} text="Danger option" danger />
</OverflowMenu>
{:else}
<OverflowMenu
{...$$props.menu}
on:close="{({ detail }) => {
console.log('close', detail);
}}"
>
<OverflowMenuItem
{...$$props.menuItem}
text="Option 1"
bind:primaryFocus
/>
<OverflowMenuItem
{...$$props.menuItem}
text="Option 2 is an example of a really long string and how we
recommend handling this"
requireTitle
/>
<OverflowMenuItem {...$$props.menuItem} text="Option 3" disabled />
<OverflowMenuItem {...$$props.menuItem} text="Option 4" />
<OverflowMenuItem {...$$props.menuItem} text="Danger option" danger />
</OverflowMenu>
{/if}
</div>

71
src/OverflowMenu/OverflowMenu.stories.js
View file

@ -1,71 +0,0 @@
import { withKnobs, select, text, boolean } from "@storybook/addon-knobs";
import Component from "./OverflowMenu.Story.svelte";
export default { title: "OverflowMenu", decorators: [withKnobs] };
const directions = {
"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),
},
menuItem: {
disabled: boolean("Disabled (disabled)", false),
requireTitle: boolean(
"Use hover over text for menu item (requireTitle)",
false
),
},
},
});
export const WithLinks = () => ({
Component,
props: {
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),
},
menuItem: {
disabled: boolean("Disabled (disabled)", false),
requireTitle: boolean(
"Use hover over text for menu item (requireTitle)",
false
),
},
},
});
export const CustomTrigger = () => ({
Component,
props: {
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),
},
menuItem: {
disabled: boolean("Disabled (disabled)", false),
requireTitle: boolean(
"Use hover over text for menu item (requireTitle)",
false
),
},
},
});