Feature/#192 모달 컴포넌트 size props 추가 (#194)

BDD-CLUB · Apr 8, 2024 · a19e303 · a19e303
1 parent 9ac5b15
commit a19e303
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 4 deletions.
diff --git a/src/components/Modal/ActionModal/index.tsx b/src/components/Modal/ActionModal/index.tsx
@@ -11,9 +11,10 @@ const ActionModal = ({
   onSubButtonClick,
   mainButtonText,
   onMainButtonClick,
+  size,
 }: ActionModalProps) => {
   return (
-    <Modal isCentered isOpen={isOpen} onClose={onClose}>
+    <Modal isCentered isOpen={isOpen} onClose={onClose} size={size || 'md'}>
       <ModalOverlay />
       <ModalContent rounded="2xl">
         <Text textStyle="bold_2xl" px="4" pt="4">

diff --git a/src/components/Modal/AlertModal/index.tsx b/src/components/Modal/AlertModal/index.tsx
@@ -2,9 +2,9 @@ import { Text, Modal, ModalOverlay, ModalContent, ModalBody, Flex, ModalCloseBut
 
 import { AlertModalProps } from '../types';
 
-const AlertModal = ({ isOpen, onClose, title, children }: AlertModalProps) => {
+const AlertModal = ({ isOpen, onClose, title, children, size }: AlertModalProps) => {
   return (
-    <Modal isCentered isOpen={isOpen} onClose={onClose}>
+    <Modal isCentered isOpen={isOpen} onClose={onClose} size={size || 'md'}>
       <ModalOverlay />
       <ModalContent overflow="hidden" rounded="2xl">
         <Text textStyle="bold_2xl" h="12" textColor="white" lineHeight="48px" textAlign="center" bg="orange">

diff --git a/src/components/Modal/ConfirmModal/index.tsx b/src/components/Modal/ConfirmModal/index.tsx
@@ -9,9 +9,10 @@ const ConfirmModal = ({
   children,
   confirmButtonText,
   onConfirmButtonClick,
+  size,
 }: ConfirmModalProps) => {
   return (
-    <Modal isCentered isOpen={isOpen} onClose={onClose}>
+    <Modal isCentered isOpen={isOpen} onClose={onClose} size={size || 'md'}>
       <ModalOverlay />
       <ModalContent overflow="hidden" rounded="2xl">
         <Flex textStyle="bold_2xl" align="center" justify="center" h="12" textColor="white" bg="orange">

diff --git a/src/components/Modal/types.ts b/src/components/Modal/types.ts
@@ -7,13 +7,15 @@ export interface ActionModalProps {
   onSubButtonClick: () => void;
   mainButtonText: string;
   onMainButtonClick: () => void;
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full';
 }
 
 export interface AlertModalProps {
   isOpen: boolean;
   onClose: () => void;
   title: string;
   children: React.ReactNode;
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full';
 }
 
 export interface ConfirmModalProps {
@@ -23,4 +25,5 @@ export interface ConfirmModalProps {
   children: React.ReactNode;
   confirmButtonText: string;
   onConfirmButtonClick: () => void;
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | 'full';
 }