Akan의 headless `Dialog` state 위에 구성된 controlled modal wrapper입니다. full dialog namespace를 직접 조합하지 않고 title/content/action slot만 필요한 일반 app overlay에 사용합니다.
Props / API
이름
타입
설명
open
boolean
controlled open state입니다.
onCancel
() => void
modal이 닫힘을 요청할 때 호출됩니다.
title
string | ReactNode
optional title slot입니다.
action
ReactNode
optional footer/action slot입니다.
confirmClose
boolean
닫기 전에 confirmation을 요청합니다.
사용 예시
Dialog
custom modal composition을 위한 headless compound dialog namespace입니다. `Modal`보다 custom trigger, title, content, action layout이 필요할 때 사용합니다.
Props / API
이름
타입
설명
Dialog
{ open?, defaultOpen?, className? }
dialog state를 위한 provider/root입니다.
Dialog.Trigger
component
custom trigger content로 dialog를 엽니다.
Dialog.Modal
component
modal surface와 close behavior를 제공합니다.
Dialog.Title / Content / Action
components
이름이 있는 modal slot입니다.
사용 예시
Popconfirm
파괴적이거나 되돌릴 수 없는 action을 위한 inline confirmation popover입니다. trigger element를 감싸고 localized OK/cancel button을 표시합니다.
Props / API
이름
타입
설명
title
string
confirmation title입니다.
description
ReactNode
optional detailed message입니다.
onConfirm
() => void
사용자가 confirm할 때 호출됩니다.
okText / cancelText
string
custom button label입니다.
사용 예시
Dropdown
compact dropdown menu wrapper입니다. list UI의 row action, comment/story menu, context action에 자주 사용됩니다.
Props / API
이름
타입
설명
value
ReactNode
trigger button content입니다.
content
ReactNode
dropdown menu content입니다.
buttonClassName
string
trigger button에 적용할 class입니다.
dropdownClassName
string
menu panel에 적용할 class입니다.
사용 예시
Copy
clipboard에 복사하고 Akan store message로 global success message를 보여주는 trigger입니다.