Axon 911 Frontend DocsAxon 911 Frontend Docs
Axon 911 Frontend Docs
    Loading navigation…
U
User
Switch to light mode
  1. Blocks
  2. Takeover Dialog
  3. API and Development

Takeover dialog

API and Development

View SourceOpens in a new tabSubmit IssueOpens in a new tab
Import
Load blocks/takeover-dialog/styles.css and the stylesheets of Dialog, Box, Button, Icon, and Text.
TakeoverDialog
NameRequiredDescription
titleyesHeading and accessible name.
closeLabelyesAccessible name of the close control.
childrenyesScrolling body.
descriptionnoSupporting text under the title. Accessible description.
footernoActions, ordered tertiary, Cancel, then one primary.
scrollRegionLabelnoName of the body scroll region when it overflows.
triggernoOne Button or Link that opens the dialog.
opennoControlled open state.
defaultOpennoInitial open state when uncontrolled.
onOpenChangenoRequested open state and cancelable details.
refnoThe dialog element.
classNamenoClasses on the dialog surface.
Replacing @prepared911/ui-takeover-page
OldNew
TakeoverPageTakeoverDialog
onCloseonOpenChange when open is false
footerContentfooter
titlePrefix, headerContentRender them in children
TakeoverPageHeader, TakeoverPageBody, TakeoverPageFooterThe block's header, children, and footer
TakeoverPagePortal, TAKEOVER_PAGE_PORTAL_IDDo not mount a portal. The dialog opens in the trigger's document.
useTakeoverCloseDelete it. Dialog runs the exit.
A display value for titleA LocalizedMessage
The dialog fills the viewport. It does not sit below a navbar offset.
Previous
Takeover dialog / Usage
Next
Takeover dialog / Accessibility
On this page
Import
TakeoverDialog
Replacing @prepared911/ui-takeover-page