03 · Components · 피드백
모달Modal
사용자의 주의가 필요한 짧은 결정이나 폼 입력을 위해 본문을 가리는 대화상자. 네이티브 dialog 요소를 기반으로 포커스 트랩과 ESC 닫기를 상속합니다.
StableWCAG AA
확인 모달
파괴적 동작
삭제처럼 되돌릴 수 없는 작업은 별도의 위험 색상 버튼과 함께 결과를 명시적으로 안내하세요.
네이티브 <dialog>의 showModal()은 포커스 트랩·스크롤 잠금·ESC 닫기를 브라우저 레벨에서 처리합니다. 배경 클릭으로도 닫히며 onClose로 동기화됩니다.
Props API
| Prop | Type | Default | Description |
|---|---|---|---|
open | boolean | 열림 상태. | |
onClose | () => void | ESC · 배경 클릭 · 닫기 버튼 호출 콜백. | |
title | string | 상단 굵은 제목. | |
description | string | 제목 아래 보조 설명. | |
footer | ReactNode | 우측 정렬된 액션 영역. | |
size | "sm" | "md" | "lg" | "md" | 최대 너비 380 / 520 / 720px. |