import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Sheet, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, } from './sheet.js';
import { Button } from './button.js';
import { Input } from './input.js';
import { Label } from './label.js';
const meta = {
    title: 'Primitives/Sheet',
    parameters: {
        layout: 'centered',
    },
    tags: ['autodocs'],
};
export default meta;
export const Default = {
    render: () => (_jsxs(Sheet, { children: [_jsx(SheetTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Open Sheet" }) }), _jsxs(SheetContent, { children: [_jsxs(SheetHeader, { children: [_jsx(SheetTitle, { children: "Edit profile" }), _jsx(SheetDescription, { children: "Update your public profile details." })] }), _jsxs("div", { className: "grid gap-4 px-4", children: [_jsxs("div", { className: "grid gap-2", children: [_jsx(Label, { htmlFor: "sheet-name", children: "Name" }), _jsx(Input, { id: "sheet-name", defaultValue: "Pedro Duarte" })] }), _jsxs("div", { className: "grid gap-2", children: [_jsx(Label, { htmlFor: "sheet-username", children: "Username" }), _jsx(Input, { id: "sheet-username", defaultValue: "@peduarte" })] })] }), _jsx(SheetFooter, { children: _jsx(Button, { children: "Save changes" }) })] })] })),
};
export const LeftSide = {
    render: () => (_jsxs(Sheet, { children: [_jsx(SheetTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Open Left Sheet" }) }), _jsxs(SheetContent, { side: "left", children: [_jsxs(SheetHeader, { children: [_jsx(SheetTitle, { children: "Navigation" }), _jsx(SheetDescription, { children: "Left-side panel for navigation or filters." })] }), _jsxs("div", { className: "space-y-2 px-4 text-sm", children: [_jsx("p", { className: "font-medium", children: "Project" }), _jsx("p", { className: "text-muted-foreground", children: "Issues, pull requests, and releases." })] })] })] })),
};
export const TopSide = {
    render: () => (_jsxs(Sheet, { children: [_jsx(SheetTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Open Top Sheet" }) }), _jsx(SheetContent, { side: "top", children: _jsxs(SheetHeader, { children: [_jsx(SheetTitle, { children: "Deployment queued" }), _jsx(SheetDescription, { children: "Top sheets work well for compact status updates." })] }) })] })),
};
export const BottomSide = {
    render: () => (_jsxs(Sheet, { children: [_jsx(SheetTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Open Bottom Sheet" }) }), _jsxs(SheetContent, { side: "bottom", children: [_jsxs(SheetHeader, { children: [_jsx(SheetTitle, { children: "Command palette" }), _jsx(SheetDescription, { children: "Bottom sheets can hold mobile-first actions." })] }), _jsxs(SheetFooter, { children: [_jsx(Button, { variant: "outline", children: "Dismiss" }), _jsx(Button, { children: "Run command" })] })] })] })),
};
export const WithoutCloseButton = {
    render: () => (_jsxs(Sheet, { children: [_jsx(SheetTrigger, { asChild: true, children: _jsx(Button, { variant: "outline", children: "Open Persistent Sheet" }) }), _jsxs(SheetContent, { showCloseButton: false, children: [_jsxs(SheetHeader, { children: [_jsx(SheetTitle, { children: "Persistent panel" }), _jsx(SheetDescription, { children: "This variant hides the default close button for custom action layouts." })] }), _jsx(SheetFooter, { children: _jsx(Button, { children: "Primary action" }) })] })] })),
};
