import { jsx as _jsx } from "react/jsx-runtime";
import { PieChartSkeleton, Skeleton, TableSkeleton } from "../Skeleton";
const meta = {
    title: "Components/Skeleton",
    component: Skeleton,
    parameters: {
        layout: "centered",
        docs: {
            description: {
                component: "```tsx\nimport { Skeleton, TableSkeleton, PieChartSkeleton } from '@openuidev/react-ui';\n```",
            },
        },
    },
    decorators: [
        (Story) => (_jsx("div", { style: { width: "400px" }, children: _jsx(Story, {}) })),
    ],
    tags: ["!dev", "autodocs"],
};
export default meta;
export const Default = {
    render: () => _jsx(Skeleton, { count: 3 }),
    parameters: {
        docs: {
            description: {
                story: "A stack of generic skeleton bars with a pulsing opacity animation.",
            },
        },
    },
};
export const Table = {
    render: () => _jsx(TableSkeleton, { rows: 4, columns: 3 }),
    parameters: {
        docs: {
            description: {
                story: "A table-shaped skeleton placeholder used while query data is loading.",
            },
        },
    },
};
export const PieChartCircular = {
    render: () => _jsx(PieChartSkeleton, { variant: "pie", appearance: "circular", size: 180 }),
    parameters: {
        docs: {
            description: {
                story: "Skeleton for a full circular pie chart while data is loading.",
            },
        },
    },
};
export const PieChartSemiCircular = {
    render: () => _jsx(PieChartSkeleton, { variant: "pie", appearance: "semiCircular", size: 180 }),
    parameters: {
        docs: {
            description: {
                story: "Skeleton for a semicircular pie chart while data is loading.",
            },
        },
    },
};
export const PieChartDonut = {
    render: () => _jsx(PieChartSkeleton, { variant: "donut", appearance: "circular", size: 180 }),
    parameters: {
        docs: {
            description: {
                story: "Skeleton for a full circular donut chart while data is loading.",
            },
        },
    },
};
export const PieChartSemiDonut = {
    render: () => _jsx(PieChartSkeleton, { variant: "donut", appearance: "semiCircular", size: 180 }),
    parameters: {
        docs: {
            description: {
                story: "Skeleton for a semicircular donut chart while data is loading.",
            },
        },
    },
};
//# sourceMappingURL=Skeleton.stories.js.map