Dialog

A dialog for peace.

Example

Props

    🕹ī¸ standard props
    open
    boolean
    Controls the visibility of the dialog.
    false
    transition
    fly-down | fly-up | fly-horizontal | scale | fade
    Defines the transition effect when opening/closing the dialog.
    'fly-up'
    _overlayOpacity
    string
    The opacity of the overlay.
    "30%"
    _overlayColor
    string
    The background color of the overlay.
    "#282828"
    _overlayBackdropFilter
    string
    CSS filter applied to the backdrop of the overlay.
    undefined
    _transitionTimingFunction
    string
    The timing function for the transition.
    "cubic-bezier(0.075, 0.82, 0.165, 1)"
    _transitionDuration
    string
    The duration of the transition.
    "0.5s"
    🎨 style props
    --dialog-overlay-opacity
    opacity
    Opacity of the overlay.
    30%
    --dialog-transition-timing-function
    timing-function
    Timing function for the dialog transition.
    "cubic-bezier(0.075, 0.82, 0.165, 1)"
    --dialog-transition-duration
    duration
    Duration of the dialog transition.
    "0.5s"
    --dialog-z-index
    z-index
    Z-index of the dialog.
    50

Slots

    topRightSnippet
    Custom content rendered in the top-right area of the dialog.
    centerLeftSnippet
    Custom content rendered in the center-left area of the dialog.
    centerRightSnippet
    Custom content rendered in the center-right area of the dialog.
    children
    Custom content rendered within the dialog.

Events

    No data available