import type { Meta, StoryObj } from "@storybook/react-vite";
import { GridFrame, ModuleCard } from "../index";
import { moduleBlocks } from "./story-data";

const meta = {
  title: "UI/GridFrame",
  component: GridFrame,
  render: (args) => (
    <GridFrame {...args}>
      <ModuleCard module={moduleBlocks.compact} />
      <ModuleCard module={moduleBlocks.unavailable} />
      <ModuleCard module={moduleBlocks.long} />
    </GridFrame>
  ),
} satisfies Meta<typeof GridFrame>;

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

export const Dense: Story = {
  args: {
    density: "dense",
  },
};