fix: RadioButton 컴포넌트 수정

-value와 label props 분리
prgrms-web-devcourse · Apr 29, 2024 · 1fbbf18 · 1fbbf18
1 parent 9ea28d4
commit 1fbbf18
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/v1/base/RadioButton.tsx b/src/v1/base/RadioButton.tsx
@@ -1,14 +1,14 @@
 import { ComponentPropsWithoutRef, forwardRef, Ref } from 'react';
 
+type RadioButtonProps = {
+  label?: string;
+} & Omit<ComponentPropsWithoutRef<'input'>, 'id' | 'type' | 'className'>;
+
 const BASE_RADIO_BUTTON_CLASSES =
   'px-[1.2rem] py-[0.5rem] bg-main-600/[0.18] text-main-900 text-sm font-normal rounded-[2rem] cursor-pointer w-full h-full peer-checked:bg-main-900 peer-checked:text-white';
 
 const RadioButton = (
-  {
-    name,
-    value,
-    ...props
-  }: Omit<ComponentPropsWithoutRef<'input'>, 'id' | 'type' | 'className'>,
+  { name, value, label, ...props }: RadioButtonProps,
   ref: Ref<HTMLInputElement>
 ) => {
   return (
@@ -22,7 +22,7 @@ const RadioButton = (
         ref={ref}
         {...props}
       />
-      <span className={BASE_RADIO_BUTTON_CLASSES}>{value}</span>
+      <span className={BASE_RADIO_BUTTON_CLASSES}>{label ?? value}</span>
     </label>
   );
 };