feat: add basic webui

apps/storybook/stories/drawer.stories.tsx

@@ -0,0 +1,58 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import {
+  Drawer,
+  DrawerClose,
+  DrawerContent,
+  DrawerDescription,
+  DrawerFooter,
+  DrawerHeader,
+  DrawerTitle,
+  DrawerTrigger,
+} from '@konobangu/design-system/components/ui/drawer';
+
+/**
+ * A drawer component for React.
+ */
+const meta: Meta<typeof Drawer> = {
+  title: 'ui/Drawer',
+  component: Drawer,
+  tags: ['autodocs'],
+  argTypes: {},
+  render: (args) => (
+    <Drawer {...args}>
+      <DrawerTrigger>Open</DrawerTrigger>
+      <DrawerContent>
+        <DrawerHeader>
+          <DrawerTitle>Are you sure absolutely sure?</DrawerTitle>
+          <DrawerDescription>This action cannot be undone.</DrawerDescription>
+        </DrawerHeader>
+        <DrawerFooter>
+          <button
+            type="button"
+            className="rounded bg-primary px-4 py-2 text-primary-foreground"
+          >
+            Submit
+          </button>
+          <DrawerClose>
+            <button type="button" className="hover:underline">
+              Cancel
+            </button>
+          </DrawerClose>
+        </DrawerFooter>
+      </DrawerContent>
+    </Drawer>
+  ),
+  parameters: {
+    layout: 'centered',
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+/**
+ * The default form of the drawer.
+ */
+export const Default: Story = {};