ModalsManager
모달을 한 번에 하나만 열고 초점 복귀 순서를 관리.
- 라이브러리 전용
개요
미리보기
Nothing run yet.
예시
상태
대기
Nothing run yet.
이렇게 · 이렇게 하지 않기
- 이렇게 닫으면 연 요소로 초점을 돌린다. 확인 흐름은 ConfirmDialog를 써서 문구 규칙을 같게 유지한다.
- 이렇게 하지 않기 모달 위에 모달을 쌓지 않는다. 확인 1단계까지만 허용한다.
토큰과 속성
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
children? | ReactNode | — | 앱. 이 아래 어디서든 useModals()를 쓴다. |
useModals().open(spec) → id | null | — | — | Modal을 연다. 깊이 2(모달 1 + 확인 1)를 넘으면 열지 않고 null과 개발 경고를 낸다. |
openConfirm(spec) / close(id) / closeAll() | — | — | ConfirmDialog를 연다. onConfirm이 promise면 확인 버튼 loading, 실패하면 안에 오류를 보이고 닫지 않는다. 닫으면 한 단계씩 초점이 돌아간다. |
접근성
키보드: Modal·ConfirmDialog와 같다. Esc는 가장 위의 대화상자 하나만 닫는다.
- 대화상자마다 열 때의 document.activeElement를 저장하고 닫을 때 그 요소로 돌아간다. 중첩이면 확인 → 모달 안 버튼 → 호출자 순서.