From 8148f1fbe3ab2fb3083505299febbf65349239da Mon Sep 17 00:00:00 2001
From: sikkzz <sling0623@gmail.com>
Date: Wed, 17 Jul 2024 17:41:15 +0900
Subject: [PATCH] issue #309 refactor: spinner story description add

---
 .../src/components/Spinner/Spinner.stories.tsx     | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/waggle-design-system/src/components/Spinner/Spinner.stories.tsx b/packages/waggle-design-system/src/components/Spinner/Spinner.stories.tsx
index 5478dd31..e3df112d 100644
--- a/packages/waggle-design-system/src/components/Spinner/Spinner.stories.tsx
+++ b/packages/waggle-design-system/src/components/Spinner/Spinner.stories.tsx
@@ -2,6 +2,8 @@ import type { Meta, StoryObj } from "@storybook/react";
 
 import Spinner from "@/components/Spinner/Spinner";
 
+import { containerStyle, informationStyle, titleStyle } from "../../../.storybook/styles";
+
 const meta: Meta<typeof Spinner> = {
   title: "Spinner",
   component: Spinner,
@@ -22,5 +24,15 @@ const meta: Meta<typeof Spinner> = {
 export default meta;
 
 export const Primary: StoryObj<typeof meta> = {
-  render: ({ size, width }) => <Spinner size={size} width={width} />,
+  render: ({ size, width }) => (
+    <ul css={containerStyle}>
+      <li css={informationStyle}>
+        <h6 css={titleStyle}>
+          <span>size : {size}</span>width : {width}
+        </h6>
+
+        <Spinner size={size} width={width} />
+      </li>
+    </ul>
+  ),
 };