사용법
확인 다이얼로그
중요한 결정 전에 사용자 확인을 받을 때 사용해요. 왼쪽 버튼은 닫기, 오른쪽 버튼은 확인 행동으로 배치해요.
스타일 커스터마이징
Dialog는 className과 style prop으로 루트 스타일을 덮어쓸 수 있어요.
<Dialog className="rounded-full px-4" style={{ opacity: 0.9 }} />인터페이스
DialogProps
| 속성 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| open | boolean | — | 열림 상태 (제어형) |
| onOpenChange | (open: boolean) => void | — | 상태 변경 콜백 |
| title | string | — | 다이얼로그 제목 |
| description | string | — | 본문 설명 |
Dialog 컴포넌트 Props 표
가져오기
import { Dialog } from "@/components/ui/Dialog";