chore: remove storybook

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

View file

@ -1,73 +0,0 @@
<script>
export let story = undefined;
import Button from "./Button.svelte";
import ButtonSkeleton from "./Button.Skeleton.svelte";
import ButtonSet from "./ButtonSet.svelte";
import Add16 from "carbon-icons-svelte/lib/Add16";
const {
kind,
disabled,
size,
iconDescription,
small,
tooltipPosition,
tooltipAlignment,
stacked,
} = $$props;
const regularProps = {
kind,
disabled,
size,
iconDescription,
small,
};
const iconOnlyProps = {
hasIconOnly: true,
kind,
disabled,
size,
icon: Add16,
iconDescription,
tooltipPosition,
tooltipAlignment,
};
const setProps = { stacked, disabled, small, size, iconDescription };
</script>
<div>
{#if story === 'skeleton'}
<ButtonSkeleton />
&nbsp;
<ButtonSkeleton href="#" />
&nbsp;
<ButtonSkeleton small />
{:else if story === 'inline'}
<Button />
{:else if story === 'icon-only buttons'}
<Button {...iconOnlyProps} />
{:else if story === 'set of buttons'}
<ButtonSet stacked="{setProps.stacked}">
<Button kind="ghost" {...setProps}>Ghost button</Button>
<Button kind="secondary" {...setProps}>Secondary button</Button>
<Button kind="primary" {...setProps}>Primary button</Button>
</ButtonSet>
{:else}
<Button {...regularProps}>Button</Button>
&nbsp;
<Button {...regularProps} href="#">Link</Button>
&nbsp;
<Button {...regularProps} as let:props>
<p {...props}>Element</p>
</Button>
&nbsp;
<Button {...regularProps} as let:props>
<!-- svelte-ignore a11y-missing-attribute -->
<a {...props}>Custom component</a>
</Button>
{/if}
</div>

View file

@ -1,62 +0,0 @@
import { withKnobs, select, boolean, text } from "@storybook/addon-knobs";
import Component from "./Button.Story.svelte";
export default { title: "Button", decorators: [withKnobs] };
const kinds = {
"Primary button (primary)": "primary",
"Secondary button (secondary)": "secondary",
"Tertiary button (tertiary)": "tertiary",
"Danger button (danger)": "danger",
"Ghost button (ghost)": "ghost",
};
const sizes = {
Default: "default",
Field: "field",
Small: "small",
};
export const Default = () => ({
Component,
props: {
kind: select("Button kind (kind)", kinds, "primary"),
disabled: boolean("Disabled (disabled)", false),
size: select("Button size (size)", sizes, "default"),
iconDescription: text("Icon description (iconDescription)", "Button icon"),
},
});
export const IconOnlyButtons = () => ({
Component,
props: {
story: "icon-only buttons",
kind: select("Button kind (kind)", kinds, "primary"),
disabled: boolean("Disabled (disabled)", false),
size: select("Button size (size)", sizes, "default"),
iconDescription: text("Icon description (iconDescription)", "Button icon"),
tooltipPosition: select(
"Tooltip position (tooltipPosition)",
["top", "right", "bottom", "left"],
"bottom"
),
tooltipAlignment: select(
"Tooltip alignment (tooltipAlignment)",
["start", "center", "end"],
"center"
),
},
});
export const SetOfButtons = () => ({
Component,
props: {
story: "set of buttons",
disabled: boolean("Disabled (disabled)", false),
stacked: boolean("Stacked (stacked)", false),
size: select("Button size (size)", sizes, "default"),
iconDescription: text("Icon description (iconDescription)", "Button icon"),
},
});
export const Skeleton = () => ({ Component, props: { story: "skeleton" } });