Something went wrong. Try again.
Monorepo for Tangled
Something went wrong. Try again.
Svelte
1234567891011121314151617181920212223242526272829303132333435363738394041<script module lang="ts"> import { defineMeta } from "@storybook/addon-svelte-csf"; import Button from "$lib/components/ui/Button.svelte"; import Modal from "$lib/components/ui/Modal.svelte";
const { Story } = defineMeta({ title: "UI/Modal", component: Modal, tags: ["autodocs"] });</script>
{#snippet body()} <p class="typography-paragraph-small text-foreground-subtle"> Anything can go in here — a form, a confirmation, a summary. </p>{/snippet}
{#snippet actions()} <Button variant="default" class="flex-1">Cancel</Button> <Button variant="primary" class="flex-1">Confirm</Button>{/snippet}
<Story name="Default" asChild> <Modal open title="Delete this branch?" description="This cannot be undone." footer={actions}> {@render body()} </Modal></Story>
<Story name="Wide" asChild> <Modal open size="wide" title="Wide panel" footer={actions}> {@render body()} </Modal></Story>
<Story name="Body only" asChild> <Modal open> {@render body()} </Modal></Story>