PrimitivesContain & overlayOverlay — modal & drawer
Overlay — modal & drawer
Centered overlay dialog — scrim, focus-trap, ESC-to-close, click-outside-to-close. Step modal, confirm modal and the drawer dock are siblings on the same overlay/modal layer.
Modal
title="Edit branch"
Confirm modal
variant="Danger"
variant="Primary"
Step modal
two-screen flow
Panel dock
koalaPanelDock()
Chase Searchflow for the outstanding local authority search.
Mortgage offer issued — valid for 6 months.
API
koala-modal flag
string (Alpine boolean)koala-modal title
stringkoala-modal size
SmallMediumLargeExtraLargeExtraExtraLargekoala-modal height
AutoFillTallkoala-modal teleport
boolkoala-modal dismissable
boolkoala-modal show-close
boolkoala-modal aria-label
stringkoala-confirm-modal variant
DangerPrimarykoala-confirm-modal form-handler
stringkoala-confirm-modal confirm-text
stringkoala-confirm-modal cancel-text
stringkoala-confirm-modal reason-field-name
stringkoala-confirm-modal choice-field-name
stringkoala-step-modal flag
string (Alpine boolean)koala-step-modal aria-label
stringkoala-step-modal dismissable
boolkoala-step-modal teleport
boolkoala-drawer flag
string (Alpine boolean)koala-drawer width
CSS lengthkoala-drawer-header close-action
Alpine expressionkoalaPanelDock columnWidth
numberkoalaPanelDock maxAutoColumns
numberkoalaPanelDock iconRegistryId
stringkoalaPanelDock iconKinds
string[]koalaPanelDock state
object (optional openPanels + activePanelKey)koalaPanelDock panelbar
boolkoalaPanelDock panels
object[] (available panel catalogue)koalaPanelDock togglePanel
method (kind, id)koalaPanelDock focusPanel
method (kind, id)koalaPanelDock isPanelOpen
method (kind, id)