fix: 모달 키보드 이벤트로 꺼지는 버그 해결

[#275]
boostcampwm2023 · Dec 7, 2023 · e86e4a1 · e86e4a1
1 parent 0118da3
commit e86e4a1
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/packages/frontend/src/design-system/components/common/Modal/Modal.tsx b/packages/frontend/src/design-system/components/common/Modal/Modal.tsx
@@ -43,14 +43,14 @@ export default function Modal({ onClose, children }: ModalProps) {
       onClick={onClose}
       role="button"
       tabIndex={0}
-      onKeyDown={onClose}
+      onKeyDown={preventBubbling}
     >
       <div
         className={styles.container}
         onClick={preventBubbling}
         role="button"
         tabIndex={0}
-        onKeyDown={onClose}
+        onKeyDown={preventBubbling}
       >
         <IconButton className={styles.close} onClick={onClose}>
           <IoCloseOutline />

diff --git a/packages/frontend/src/utils/event.ts b/packages/frontend/src/utils/event.ts
@@ -1,4 +1,6 @@
-const preventBubbling = (e: React.MouseEvent<Element>) => {
+const preventBubbling = <T extends Element>(
+  e: React.MouseEvent<T> | React.KeyboardEvent<T>,
+) => {
   e.stopPropagation();
 };