feat: add basic webui

apps/storybook/stories/tabs.stories.tsx

@@ -0,0 +1,47 @@
+import type { Meta, StoryObj } from '@storybook/react';
+
+import {
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+} from '@konobangu/design-system/components/ui/tabs';
+
+/**
+ * A set of layered sections of content—known as tab panels—that are displayed
+ * one at a time.
+ */
+const meta = {
+  title: 'ui/Tabs',
+  component: Tabs,
+  tags: ['autodocs'],
+  argTypes: {},
+  args: {
+    defaultValue: 'account',
+    className: 'w-96',
+  },
+  render: (args) => (
+    <Tabs {...args}>
+      <TabsList className="grid grid-cols-2">
+        <TabsTrigger value="account">Account</TabsTrigger>
+        <TabsTrigger value="password">Password</TabsTrigger>
+      </TabsList>
+      <TabsContent value="account">
+        Make changes to your account here.
+      </TabsContent>
+      <TabsContent value="password">Change your password here.</TabsContent>
+    </Tabs>
+  ),
+  parameters: {
+    layout: 'centered',
+  },
+} satisfies Meta<typeof Tabs>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
+
+/**
+ * The default form of the tabs.
+ */
+export const Default: Story = {};