import type { Meta, StoryObj } from "@storybook/react";
import {
    Table,
    TableBody,
    TableCaption,
    TableCell,
    TableHead,
    TableHeader,
    TableRow,
} from "../src/index.js";

const meta = {
    title: "Basic/Table",
    component: Table,
    tags: ["autodocs"],
} satisfies Meta<typeof Table>;

export default meta;
type Story = StoryObj<typeof meta>;

export const Default: Story = {
    render: () => (
        <Table>
            <TableCaption>示例数据表</TableCaption>
            <TableHeader>
                <TableRow>
                    <TableHead className="w-[100px]">ID</TableHead>
                    <TableHead>名称</TableHead>
                    <TableHead>状态</TableHead>
                </TableRow>
            </TableHeader>
            <TableBody>
                <TableRow>
                    <TableCell className="font-mono text-xs">a1b2c3d4</TableCell>
                    <TableCell>应用模板</TableCell>
                    <TableCell>活跃</TableCell>
                </TableRow>
                <TableRow>
                    <TableCell className="font-mono text-xs">e5f6g7h8</TableCell>
                    <TableCell>组件库</TableCell>
                    <TableCell>草稿</TableCell>
                </TableRow>
            </TableBody>
        </Table>
    ),
};