(#0) Button Disabled 추가

thebbodek · Dec 9, 2023 · 6b4a10b · 6b4a10b
1 parent de7a0a0
commit 6b4a10b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/src/core/components/Button/Button.stories.tsx b/src/core/components/Button/Button.stories.tsx
@@ -62,6 +62,10 @@ const meta = {
       control: "boolean",
       description: "Button With Underline",
     },
+    disabled: {
+      control: "boolean",
+      description: "Button With disabled",
+    },
   },
 } satisfies Meta<typeof Button>;
 

diff --git a/src/core/components/Button/index.tsx b/src/core/components/Button/index.tsx
@@ -17,6 +17,7 @@ const Button = forwardRef(({
   content,
   rightIcon,
   hasUnderline = false,
+  disabled,
   ...props
 }: ButtonProps,
 ref: React.Ref<HTMLButtonElement>,
@@ -29,7 +30,7 @@ ref: React.Ref<HTMLButtonElement>,
       ref = {ref}
       type = {"button"}
       className = {clsx(
-        "flex items-center justify-center",
+        "flex items-center justify-center disabled:cursor-not-allowed disabled:text-white disabled:bg-gray-03 disabled:border-gray-03",
         `text-${theme}`,
         `text-${color}`,
         `bg-${backgroundColor}`,
@@ -38,7 +39,8 @@ ref: React.Ref<HTMLButtonElement>,
         BUTTON_ROUNDED[rounded],
         borderColor && `border border-${borderColor}`,
         className,
-        )}
+      )}
+      disabled = {disabled}
       {...rest}
     >
       {leftIcon && <div>{leftIcon}</div>}