View Source SaladUI.AlertDialog (SaladUI v1.0.0-beta.1)
Implementation of Alert Dialog component for SaladUI framework.
Alert Dialogs are modal dialogs that require a user action before they can be dismissed, used to confirm user decisions or provide critical information.
Examples:
<.alert_dialog id="delete-confirmation">
<.alert_dialog_trigger>
<.button variant="destructive">Delete Account</.button>
</.alert_dialog_trigger>
<.alert_dialog_content>
<.alert_dialog_header>
<.alert_dialog_title>Are you absolutely sure?</.alert_dialog_title>
<.alert_dialog_description>
This action cannot be undone. This will permanently delete your
account and remove your data from our servers.
</.alert_dialog_description>
</.alert_dialog_header>
<.alert_dialog_footer>
<.alert_dialog_cancel>Cancel</.alert_dialog_cancel>
<.alert_dialog_action>Continue</.alert_dialog_action>
</.alert_dialog_footer>
</.alert_dialog_content>
</.alert_dialog>
Summary
Functions
The main alert dialog component.
The primary action button for the alert dialog.
The cancel button for the alert dialog.
The content container of the alert dialog.
The description of the alert dialog.
The footer section of the alert dialog containing action buttons.
The header section of the alert dialog.
The title of the alert dialog.
The trigger element that opens the alert dialog.
Functions
The main alert dialog component.
Options
:id
- Required unique identifier for the alert dialog.:open
- Whether the alert dialog is initially open. Defaults tofalse
.:on-open
- Handler for alert dialog open event.:on-close
- Handler for alert dialog close event.:class
- Additional CSS classes.
Attributes
id
(:string
) (required) - Unique identifier for the alert dialog.open
(:boolean
) - Whether the alert dialog is initially open. Defaults tofalse
.on-open
(:any
) - Handler for alert dialog open event. Defaults tonil
.on-close
(:any
) - Handler for alert dialog close event. Defaults tonil
.class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
The primary action button for the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.variant
(:string
) - Defaults to"default"
.size
(:string
) - Defaults to"default"
.- Global attributes are accepted.
Slots
inner_block
(required)
The cancel button for the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.variant
(:string
) - Defaults to"outline"
.size
(:string
) - Defaults to"default"
.- Global attributes are accepted.
Slots
inner_block
(required)
The content container of the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
The description of the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
The header section of the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
The title of the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.- Global attributes are accepted.
Slots
inner_block
(required)
The trigger element that opens the alert dialog.
Attributes
class
(:string
) - Defaults tonil
.as
(:any
) - Defaults to"div"
.- Global attributes are accepted.
Slots
inner_block
(required)