import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Card, CardHeader, CardTitle, CardDescription, CardContent, CardFooter } from './card';
import { Button } from './button';
const meta = {
    title: 'UI/Card',
    component: Card,
    parameters: {
        layout: 'centered',
    },
    tags: ['autodocs'],
};
export default meta;
export const Default = {
    render: () => (_jsxs(Card, { className: "w-[350px]", children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Card Title" }), _jsx(CardDescription, { children: "Card description goes here." })] }), _jsx(CardContent, { children: _jsx("p", { children: "Card content goes here. You can put any content you want." }) })] })),
};
export const WithFooter = {
    render: () => (_jsxs(Card, { className: "w-[350px]", children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Create project" }), _jsx(CardDescription, { children: "Deploy your new project in one-click." })] }), _jsx(CardContent, { children: _jsx("p", { children: "This is the content area where you can add forms or other content." }) }), _jsxs(CardFooter, { className: "flex justify-between", children: [_jsx(Button, { variant: "outline", children: "Cancel" }), _jsx(Button, { children: "Deploy" })] })] })),
};
export const HeaderOnly = {
    render: () => (_jsx(Card, { className: "w-[350px]", children: _jsxs(CardHeader, { children: [_jsx(CardTitle, { children: "Notifications" }), _jsx(CardDescription, { children: "You have 3 unread messages." })] }) })),
};
export const ContentOnly = {
    render: () => (_jsx(Card, { className: "w-[350px]", children: _jsx(CardContent, { className: "pt-6", children: _jsx("p", { children: "This card only has content, no header or footer." }) }) })),
};
