Dialog
Modal overlay molecule with configurable mode context
Presets
Props
Visual context mode - children inherit this
Dialog title
Dialog description
Dialog size
Show close button and allow dismissal
Close when clicking backdrop
Close when pressing Escape
Center dialog vertically
Apply blur to backdrop
Usage
<Dialog open={showModal} title="Confirm Action">
<p>Are you sure you want to proceed?</p>
<svelte:fragment slot="footer">
<Button variant="ghost">Cancel</Button>
<Button variant="primary">Confirm</Button>
</svelte:fragment>
</Dialog>Event Log
Interact with the component to see events
Accessibility
Uses native dialog element with proper ARIA labelling, focus trap, and keyboard navigation.