RwPopupWindow
제목과 임의의 본문을 간단한 모달 창으로 표시하는 구성요소입니다. 별도의 결과 계약이 필요하지 않은 안내, 조회와 짧은 보조 화면에 사용하고, 확인 결과가 필요한 작업은 RwConfirmWindow를 사용합니다.
구성 항목
| 항목 | 형식 | 용도 |
|---|---|---|
Title |
string |
창 상단 제목 |
ChildContent |
RenderFragment |
창에 표시할 Razor 내용 |
Open() |
메서드 | 모달 표시 |
Close() |
메서드 | 모달 닫기 |
구성요소 내부에는 제목, 닫기 버튼과 본문 영역이 있으며, 열림 상태는 인스턴스가 관리합니다.
기본 사용
<RwPopupWindow @ref="detailWindow" Title="작업 상세">
<ChildContent>
<WorkDetail Item="selectedItem" />
</ChildContent>
</RwPopupWindow>
항목을 선택한 뒤 detailWindow.Open()을 호출하고, 외부 작업 완료 후 닫아야 하면 detailWindow.Close()를 호출합니다.
본문 구성
ChildContent에는 조회 정보나 간단한 폼을 넣을 수 있습니다. 창 자체는 업무 저장과 취소 결과를 반환하지 않으므로 폼 버튼과 저장 상태는 본문 구성요소에서 명시적으로 처리합니다.
사용 구분
단순 조회나 도움말처럼 배경 화면의 맥락을 유지해야 하는 경우에 적합합니다. 여러 단계 입력, 넓은 표, 복잡한 탐색처럼 작업 공간이 필요한 경우에는 RwWindow나 RwSlideItemViewer를 사용합니다. 사용자 결정을 기다리는 삭제 확인은 RwConfirmWindow로 구현합니다.
열기 전 데이터
창을 열기 전에 선택 대상과 표시 데이터를 준비합니다. 서버 조회가 필요한 경우 로딩 상태를 보여 주고, 이전에 선택한 항목의 내용이 잠깐 보이지 않도록 초기화합니다. 연속으로 다른 항목을 선택할 수 있는 화면에서는 늦게 도착한 응답을 구분합니다.
닫기 동작
상단 닫기 버튼 외에 Escape 키나 배경 클릭을 허용할지는 창 안의 작업 성격에 따라 정합니다. 저장하지 않은 입력이 있다면 본문에서 변경 여부를 추적하고 닫기 전에 확인 절차를 제공합니다.
접근성
제목은 창의 목적을 설명해야 하고, 닫기 버튼에는 화면 읽기 프로그램이 이해할 수 있는 이름을 제공합니다. 창이 열렸을 때 키보드 초점이 배경 화면으로 빠지지 않는지, 닫은 뒤에는 창을 열었던 요소로 돌아가는지 확인합니다.
문제 확인
- 같은 인스턴스를 반복해서 열고 닫아도 본문 상태가 의도대로 초기화되는지 확인합니다.
- 모달 뒤의 버튼이나 링크가 키보드로 실행되지 않게 합니다.
- 모바일 너비에서 본문이 화면 밖으로 잘리지 않는지 확인합니다.
- 중첩 모달은 닫기 순서와 포커스 복원이 복잡하므로 가능한 한 사용하지 않습니다.
