docs(storybook): add stories for Card, Flex, Input components

src/App.tsx

@@ -4,7 +4,6 @@ function App() {
   return (
     <>
       <GlobalStyles />
-      <h1>hello world!</h1>
     </>
   );
 }

src/components/common/Card/index.stories.tsx

@@ -0,0 +1,24 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Card from '.';
+
+const meta: Meta<typeof Card> = {
+  title: 'common/Card',
+  component: Card,
+  tags: ['autodocs'],
+};
+
+export default meta;
+
+type Story = StoryObj<typeof Card>;
+
+export const Default: Story = {
+  args: {
+    borderRadius: '12px',
+    children: <h1>Hello World!</h1>,
+  },
+  render: (args) => (
+    <Card {...args} css={{ padding: '12px 24px' }}>
+      <h1>Hello World!</h1>
+    </Card>
+  ),
+};

src/components/common/Flex/index.stories.tsx

@@ -0,0 +1,38 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Flex from '.';
+
+const meta: Meta<typeof Flex> = {
+  title: 'common/Flex',
+  component: Flex,
+  tags: ['autodocs'],
+};
+
+export default meta;
+
+type Story = StoryObj<typeof Flex>;
+
+export const Default: Story = {
+  args: {
+    direction: 'row',
+    justifyContent: 'center',
+    alignItems: 'center',
+    xGap: '10px',
+    yGap: '10px',
+  },
+  render: (args) => (
+    <Flex {...args}>
+      <div style={boxStyle}>Box 1</div>
+      <div style={boxStyle}>Box 2</div>
+      <div style={boxStyle}>Box 3</div>
+    </Flex>
+  ),
+};
+
+const boxStyle = {
+  width: '100px',
+  height: '100px',
+  backgroundColor: 'lightblue',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+};

src/components/common/Input/index.stories.tsx

@@ -0,0 +1,20 @@
+import { Meta, StoryObj } from '@storybook/react';
+import Input from '.';
+
+const meta: Meta<typeof Input> = {
+  title: 'common/Input',
+  component: Input,
+  tags: ['autodocs'],
+};
+
+export default meta;
+
+type Story = StoryObj<typeof Input>;
+
+export const Default: Story = {
+  args: {
+    label: '아이디',
+    placeholder: '아이디를 입력해주세요.',
+  },
+  render: (args) => <Input {...args} css={{ padding: '12px' }} />,
+};