GitHub

Reference headless

dialog

interface 3 type 4 function 1
interface Interfaces 3

# CreateDialogOptions

Members

closeOnEscape?
optional closeOnEscape?: boolean

###### Inherited from

CreateDialogInput.closeOnEscape

closeOnOutsideClick?
optional closeOnOutsideClick?: boolean

###### Inherited from

CreateDialogInput.closeOnOutsideClick

defaultOpen?
optional defaultOpen?: boolean

###### Inherited from

CreateDialogInput.defaultOpen

id?
optional id?: string
modal?
optional modal?: boolean

###### Inherited from

CreateDialogInput.modal

onOpenChange?
optional onOpenChange?: (open) => void

###### Parameters

###### open

boolean

###### Returns

void

requireTitle?
optional requireTitle?: boolean

If true, the title attachment is required for the content to label itself. Defaults true — APG mandates an accessible name for modal dialogs. The Layer 4 component enforces this at the type level.

interface

# DialogContext

Members

closeOnEscape
closeOnEscape: boolean
closeOnOutsideClick
closeOnOutsideClick: boolean
modal
modal: boolean

# DialogController

Members

close
readonly close: Attachment
content
readonly content: Attachment
contentId
readonly contentId: string
context
readonly context: Readonly<DialogContext>
description
readonly description: Attachment
descriptionId
readonly descriptionId: string
id
readonly id: string
machine
readonly machine: DialogMachine
open
readonly open: boolean
overlay
readonly overlay: Attachment
state
readonly state: DialogState
title
readonly title: Attachment
titleId
readonly titleId: string
trigger
readonly trigger: Attachment
triggerId
readonly triggerId: string

DOM ids for ARIA wiring.

hide()
hide(): void

###### Returns

void

setCloseOnEscape()
setCloseOnEscape(value): void

###### Parameters

###### value

boolean

###### Returns

void

setCloseOnOutsideClick()
setCloseOnOutsideClick(value): void

###### Parameters

###### value

boolean

###### Returns

void

setModal()
setModal(modal): void

###### Parameters

###### modal

boolean

###### Returns

void

setOpen()
setOpen(open): void

###### Parameters

###### open

boolean

###### Returns

void

show()
show(): void

###### Returns

void

subscribe()
subscribe(listener): () => void

###### Parameters

###### listener

(snapshot) => void

###### Returns

() => void

toggle()
toggle(): void

###### Returns

void

type Type Aliases 4

# Attachment

Attachment = (node) => void | (() => void)

Parameters

node
HTMLElement

Returns

void | (() => void)
type

# DialogEvent

DialogEvent = { type: "OPEN"; } | { type: "CLOSE"; } | { type: "TOGGLE"; } | { open: boolean; type: "SET.OPEN"; } | { type: "ESCAPE"; } | { type: "OUTSIDE_CLICK"; } | { modal: boolean; type: "SET.MODAL"; } | { type: "SET.CLOSE_ON_ESCAPE"; value: boolean; } | { type: "SET.CLOSE_ON_OUTSIDE_CLICK"; value: boolean; }
type

# DialogState

DialogState = "closed" | "open"
function Functions 1

# createDialog ( )

createDialog(options?): DialogController

Create a Dialog controller plus its six attachment factories.

Parameters

options?
CreateDialogOptions = {}

Returns

DialogController