import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button } from './button';
const meta = {
    title: 'UI/Button',
    component: Button,
    parameters: {
        layout: 'centered',
    },
    tags: ['autodocs'],
    argTypes: {
        variant: {
            control: 'select',
            options: ['default', 'destructive', 'outline', 'secondary', 'ghost', 'link'],
        },
        size: {
            control: 'select',
            options: ['default', 'sm', 'lg', 'icon'],
        },
        disabled: {
            control: 'boolean',
        },
    },
};
export default meta;
export const Default = {
    args: {
        children: 'Button',
        variant: 'default',
    },
};
export const Destructive = {
    args: {
        children: 'Destructive',
        variant: 'destructive',
    },
};
export const Outline = {
    args: {
        children: 'Outline',
        variant: 'outline',
    },
};
export const Secondary = {
    args: {
        children: 'Secondary',
        variant: 'secondary',
    },
};
export const Ghost = {
    args: {
        children: 'Ghost',
        variant: 'ghost',
    },
};
export const Link = {
    args: {
        children: 'Link',
        variant: 'link',
    },
};
export const Small = {
    args: {
        children: 'Small',
        size: 'sm',
    },
};
export const Large = {
    args: {
        children: 'Large',
        size: 'lg',
    },
};
export const Disabled = {
    args: {
        children: 'Disabled',
        disabled: true,
    },
};
export const AllVariants = {
    render: () => (_jsxs("div", { className: "flex flex-wrap gap-4", children: [_jsx(Button, { variant: "default", children: "Default" }), _jsx(Button, { variant: "destructive", children: "Destructive" }), _jsx(Button, { variant: "outline", children: "Outline" }), _jsx(Button, { variant: "secondary", children: "Secondary" }), _jsx(Button, { variant: "ghost", children: "Ghost" }), _jsx(Button, { variant: "link", children: "Link" })] })),
};
export const AllSizes = {
    render: () => (_jsxs("div", { className: "flex items-center gap-4", children: [_jsx(Button, { size: "sm", children: "Small" }), _jsx(Button, { size: "default", children: "Default" }), _jsx(Button, { size: "lg", children: "Large" })] })),
};
