Components

Alert Dialog

되돌리기 어려운 행동을 확인받는 대화상자입니다. 네이티브 alert/confirm은 금지입니다.

에이전트를 삭제할까요?
삭제하면 연결된 플로우가 함께 중지됩니다. 이 작업은 되돌릴 수 없습니다.
코드 보기
<div class="tn-dialog" role="alertdialog">
  <div class="dt">제목 — 질문형</div>
  <div class="dd3">결과 설명 + 되돌릴 수 없음 고지</div>
  <div class="row">취소(Ghost) + 실행(Primary)</div>
</div>

Variants

이름설명미리보기
확인취소 + 실행 2버튼
삭제할까요?
알림확인 1버튼
저장되었습니다

Guidelines

✓ Do
  • 제목은 질문형 한 줄 ("삭제할까요?")
  • 되돌릴 수 없으면 반드시 명시
  • 취소가 왼쪽, 실행이 오른쪽
✕ Don't
  • 네이티브 alert/confirm/prompt 절대 금지
  • 버튼 3개 이상 금지
  • 중첩 다이얼로그 금지

Specification

속성토큰/값비고
radius12px
그림자0 10px 40px 18%
최대폭340px