From ce50437d73b0334fca028d02342e3cd86a66f713 Mon Sep 17 00:00:00 2001
From: Jeongmin Lee <clcl6084@gmail.com>
Date: Fri, 2 Aug 2024 03:49:55 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=85=20style:=20add=20dummy=20stories?=
 =?UTF-8?q?=20for=20chromatic=20build?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .storybook/preview.tsx                        |  2 --
 .../button/SquareTabButton.stories.tsx        | 28 +++++++++++++++++++
 src/components/button/SquareTabButton.tsx     | 25 +++++++++++++++++
 3 files changed, 53 insertions(+), 2 deletions(-)
 create mode 100644 src/components/button/SquareTabButton.stories.tsx
 create mode 100644 src/components/button/SquareTabButton.tsx

diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx
index 7f9c15d..ed8f18d 100644
--- a/.storybook/preview.tsx
+++ b/.storybook/preview.tsx
@@ -1,10 +1,8 @@
 import type { Preview } from "@storybook/react";
 import React from "react";
 
-import { Pretendard } from "../src/app/fonts/index";
 import "../src/styles/globals.css";
 import "../src/styles/theme.css";
-import { cn } from "../src/utils/cn";
 
 const preview: Preview = {
   parameters: {
diff --git a/src/components/button/SquareTabButton.stories.tsx b/src/components/button/SquareTabButton.stories.tsx
new file mode 100644
index 0000000..40a3e28
--- /dev/null
+++ b/src/components/button/SquareTabButton.stories.tsx
@@ -0,0 +1,28 @@
+import type { Meta, StoryObj } from "@storybook/react";
+
+import SquareTabButton from "./SquareTabButton";
+
+const meta: Meta<typeof SquareTabButton> = {
+  title: "SquareTabButton",
+  component: SquareTabButton,
+  parameters: {
+    layout: "centered",
+  },
+
+  argTypes: {
+    active: {
+      control: {
+        type: "boolean",
+      },
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+export const Typographys: Story = {
+  args: {
+    active: false,
+  },
+};
diff --git a/src/components/button/SquareTabButton.tsx b/src/components/button/SquareTabButton.tsx
new file mode 100644
index 0000000..e4e3004
--- /dev/null
+++ b/src/components/button/SquareTabButton.tsx
@@ -0,0 +1,25 @@
+import { Button, ButtonProps } from "@radix-ui/themes";
+import { FC } from "react";
+
+import { cn } from "@/utils/cn";
+
+export interface Props extends ButtonProps {
+  active: boolean;
+}
+
+const SquareTabButton: FC<Props> = ({ active = false, ...props }) => {
+  return (
+    <Button
+      className={cn(
+        "w-[108px] h-[108px] duration-300",
+        active ? "bg-primary-01" : "bg-primary-04",
+        props.className,
+      )}
+      {...props}
+    >
+      {props.children}
+    </Button>
+  );
+};
+
+export default SquareTabButton;