feat: Button 컴포넌트에 fullWidth prop 추가하여 전체 너비 지원

Author: Seojunhwan

src/components/ui/Button/Button.css.ts

@@ -64,6 +64,11 @@ export const button = recipe({
         borderRadius: radius[160],
       },
     },
+    fullWidth: {
+      true: {
+        width: "100%",
+      },
+    },
   },
   defaultVariants: {
     variant: "primary",

src/components/ui/Button/Button.tsx

@@ -8,17 +8,19 @@ type ButtonSize = "small" | "medium" | "large" | "fullWidth";
 export type ButtonProps = {
   variant?: ButtonVariant;
   size?: ButtonSize;
+  fullWidth?: boolean;
   className?: string;
 } & ComponentProps<"button">;
 
 export const Button = ({
   children,
   variant = "primary",
   size = "medium",
+  fullWidth = false,
   className,
   ...props
 }: ButtonProps) => {
-  const variantClass = button({ variant, size });
+  const variantClass = button({ variant, size, fullWidth });
 
   return (
     <button className={`${variantClass} ${className ?? ""}`} {...props}>