refactor(ui): extract reusable component package

packages/ui/src/stories/GridFrame.stories.tsx

@@ -0,0 +1,25 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { GridFrame } from "../components/GridFrame";
+import { ModuleCard } from "../components/ModuleCard";
+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",
+  },
+};