Something went wrong. Try again.
Monorepo for Tangled
Something went wrong. Try again.
Svelte
12345678910111213141516171819202122232425262728293031323334353637383940414243<script module lang="ts"> import { defineMeta } from "@storybook/addon-svelte-csf"; import Settings from "$icon/settings"; import ButtonCard from "./ButtonCard.svelte";
const { Story } = defineMeta({ title: "UI/ButtonCard", component: ButtonCard, tags: ["autodocs"], argTypes: { variant: { control: { type: "select" }, options: ["default", "ghost"] }, insetShadow: { control: "boolean" }, disabled: { control: "boolean" }, title: { control: "text" }, description: { control: "text" } }, args: { variant: "default", insetShadow: false, disabled: false, title: "Button", description: "Description" } });</script>
<Story name="Default" /><Story name="Ghost" args={{ variant: "ghost" }} /><Story name="WithIcon" args={{ icon: Settings }} /><Story name="Disabled" args={{ disabled: true }} /><Story name="Href" args={{ href: "/", icon: Settings }} /><Story name="Inset shadow" args={{ insetShadow: true, icon: Settings }} />
<Story name="Variants"> <div class="grid grid-cols-2 gap-3"> <ButtonCard variant="default" icon={Settings} title="Default" description="Bordered card" /> <ButtonCard variant="ghost" icon={Settings} title="Ghost" description="Transparent card" /> </div></Story>