Dialog

集中の空間。ユーザーの注意を要する重要なアクションに使用するモーダルダイアログ。

基本

TSX

<Dialog>
  <DialogTrigger asChild>
    <Button>ダイアログを開く</Button>
  </DialogTrigger>
  <DialogContent>
    <DialogHeader>
      <DialogTitle>タイトル</DialogTitle>
      <DialogDescription>説明文</DialogDescription>
    </DialogHeader>
    {/* コンテンツ */}
    <DialogFooter>
      <Button variant="ghost">キャンセル</Button>
      <Button>保存</Button>
    </DialogFooter>
  </DialogContent>
</Dialog>

サブコンポーネント

Prop	Type	Default	説明
`Dialog`	`Provider`	—	ダイアログの状態を管理するラッパー
`DialogTrigger`	`button`	—	開閉トリガー（asChild対応）
`DialogContent`	`div`	—	モーダルコンテンツ（ESCで閉じる）
`DialogHeader`	`div`	—	ヘッダー領域
`DialogTitle`	`h2`	—	タイトル
`DialogDescription`	`p`	—	説明文
`DialogFooter`	`div`	—	フッター（ボタン配置）