feat #67 : 종속성 있는 타입끼리 제한

depromeet · Feb 25, 2025 · 13e7d01 · 13e7d01
1 parent 9055d06
commit 13e7d01
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 12 deletions.
diff --git a/src/common/components/button/Button.tsx b/src/common/components/button/Button.tsx
@@ -5,13 +5,39 @@ import { BaseButton, BaseButtonProps } from '@/common/components/base-button/bas
 
 import { generateCss } from './button.styles';
 
-export interface ButtonProps extends BaseButtonProps {
-  size: Size;
-  usage: Usage;
-  variant: ButtonVariant;
+// 공통 prop들
+type CommonProps = {
   icon?: ReactNode;
   iconPosition?: 'left' | 'right';
-}
+  size: Size;
+  variant: ButtonVariant;
+} & BaseButtonProps;
+
+// 텍스트만 있는 경우 (normal)
+type TextOnlyProps = CommonProps & {
+  usage: 'normal';
+  children: ReactNode;
+  icon?: never;
+  iconPosition?: never;
+};
+
+// 텍스트와 아이콘이 모두 있는 경우 (normal)
+type TextAndIconProps = CommonProps & {
+  usage: 'normal';
+  children: ReactNode;
+  icon: ReactNode;
+  iconPosition: 'left' | 'right';
+};
+
+// 아이콘만 있는 경우 (iconOnly)
+type IconOnlyProps = CommonProps & {
+  usage: 'iconOnly';
+  icon: ReactNode;
+  children?: never;
+};
+
+// 최종 ButtonProps
+export type ButtonProps = TextOnlyProps | TextAndIconProps | IconOnlyProps;
 
 const Button = forwardRef<HTMLButtonElement, ButtonProps>(
   ({ size, usage, variant, icon, children, iconPosition, ...props }, ref) => {

diff --git a/src/route.tsx b/src/route.tsx
@@ -11,13 +11,7 @@ export const router = createBrowserRouter([
     path: '/',
     element: (
       <div>
-        <Button
-          size="large"
-          usage="normal"
-          variant="purlple"
-          icon={<Icon name="pin" width={24} />}
-          iconPosition="right"
-        >
+        <Button size="large" usage="normal" variant="purlple">
           hahaha
         </Button>