From 2d1b9ae397f1eb384944004c095a8c222effe6cd Mon Sep 17 00:00:00 2001
From: Euihyun Yang <euihyun.yang.9x@gmail.com>
Date: Mon, 11 Nov 2024 23:03:40 +0900
Subject: [PATCH] feat(typography): add typography story

---
 .../typography/src/Typography.stories.tsx     | 46 ++++++++++++++++++-
 1 file changed, 45 insertions(+), 1 deletion(-)

diff --git a/packages/typography/src/Typography.stories.tsx b/packages/typography/src/Typography.stories.tsx
index 56c3871..0fffbe5 100644
--- a/packages/typography/src/Typography.stories.tsx
+++ b/packages/typography/src/Typography.stories.tsx
@@ -11,4 +11,48 @@ export default meta;
 
 type Story = StoryObj<typeof meta>;
 
-export const Basic: Story = {};
+export const Basic: Story = {
+  render() {
+    return (
+      <section>
+        <Typography asChild={true} size={32} weight="bold">
+          <h1>Weight</h1>
+        </Typography>
+        <Typography weight="regular">
+          [기본 값] regular(400) - 사이프 디자인 시스템
+        </Typography>
+        <Typography weight="medium">
+          medium(500) - 사이프 디자인 시스템
+        </Typography>
+        <Typography weight="semiBold">
+          semiBold(600) - 사이프 디자인 시스템
+        </Typography>
+        <Typography weight="bold">bold(700) - 사이프 디자인 시스템</Typography>
+
+        <Typography asChild={true} size={32} weight="bold">
+          <h1>Size</h1>
+        </Typography>
+        <Typography size={12}>12 - 사이프 디자인 시스템</Typography>
+        <Typography size={14}>[기본 값] 14 - 사이프 디자인 시스템</Typography>
+        <Typography size={16}>16 - 사이프 디자인 시스템</Typography>
+        <Typography size={18}>18 - 사이프 디자인 시스템</Typography>
+        <Typography size={20}>20 - 사이프 디자인 시스템</Typography>
+        <Typography size={24}>24 - 사이프 디자인 시스템</Typography>
+        <Typography size={28}>28 - 사이프 디자인 시스템</Typography>
+        <Typography size={32}>32 - 사이프 디자인 시스템</Typography>
+        <Typography size={36}>36 - 사이프 디자인 시스템</Typography>
+        <Typography size={48}>48 - 사이프 디자인 시스템</Typography>
+
+        <Typography asChild={true} size={32} weight="bold">
+          <h1>Line Height</h1>
+        </Typography>
+        <Typography lineHeight="regular">
+          [기본 값] regular(1.5) - 사이프 디자인 시스템
+        </Typography>
+        <Typography lineHeight="compact">
+          compact(1.3) - 사이프 디자인 시스템
+        </Typography>
+      </section>
+    );
+  },
+};