Alert (alert)

An alert keeps users informed of important and sometimes time-sensitive changes.

🔗 External documentation.

                        type: boolean

                      

                        type: boolean

                      

            id: alert
label: Alert
description: 'An alert keeps users informed of important and sometimes time-sensitive changes.'
group: 'Alerts / Banner'
homepage: 'https://designsystem.digital.gov/components/alert/'
variants:
    info:
        id: info
        label: Informative
    warning:
        id: warning
        label: Warning
    error:
        id: error
        label: Error
    success:
        id: success
        label: Success
    emergency:
        id: emergency
        label: Emergency
slots:
    heading:
        id: heading
        label: Heading
        description: 'The alert heading. Optional.'
    message:
        id: message
        label: Message
        description: 'The alert message'
props:
    slim:
        id: slim
        label: Slim
        description: 'Display an alert slimmer then default.'
        schema:
            type: boolean
    no_icon:
        id: no_icon
        label: 'No Icon'
        description: 'Display an alert without an icon.'
        schema:
            type: boolean
examples:
    preview:
        id: preview
        label: Preview
        renderable:
            '@component': alert
            heading: 'Hello world'
            message: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.'