# Alerts & Toasts API Reference

### Alerts

The simplest alert is a div wrapped with a span:

See Source

See Output

This is a plain alert

[code]

    def ex_alerts1(): return Alert("This is a plain alert")
    
[/code]

Alert colors are defined by the alert styles:

See Source

See Output

Your purchase has been confirmed!

[code]

    def ex_alerts2(): return Alert("Your purchase has been confirmed!", cls=AlertT.success)
    
[/code]

It often looks nice to use icons in alerts:

See Source

See Output

Please enter a valid email.

[code]

    def ex_alerts3():
        return Alert(
            DivLAligned(UkIcon('triangle-alert'), 
                        P("Please enter a valid email.")),
            cls=AlertT.error)
    
[/code]

### Alert

Source

[code]

    Alert(*c, cls='', **kwargs) -> fastcore.xml.FT
[/code]

> Alert informs users about important events.

**Params**

  * `c` Content for Alert (often text and/or icon)

  * `cls` Class for the alert (often an `AlertT` option)

  * `kwargs`

**Returns:** Div(Span(...), cls='alert', role='alert')

* * *

### AlertT

_Alert styles from DaisyUI_

Option | Value | Option | Value  
---|---|---|---  
info | alert-info | success | alert-success  
warning | alert-warning | error | alert-error  
  
* * *

### Toasts

To define a toast with a particular location, add horizontal or vertical toast type classes:

See Source

See Output

First Example Toast

[code]

    def ex_toasts1():
        return Toast("First Example Toast", cls=(ToastHT.start, ToastVT.bottom), dur=300)
    
[/code]

To define toast colors, set the class of the alert wrapped by the toast:

See Source

See Output

Second Example Toast

[code]

    def ex_toasts2():
        return Toast("Second Example Toast", alert_cls=AlertT.info, dur=300)
    
[/code]

Toasts will disappear automatically after 5 seconds. To change the duration of the toast set the `dur` param like this `Toast('Content', dur=10)`.

Here's a demo app showing how to trigger a toast.

### Toast

Source

[code]

    Toast(*c, cls='', alert_cls='', dur=5.0, **kwargs) -> fastcore.xml.FT
[/code]

> Toasts are stacked announcements, positioned on the corner of page.

**Params**

  * `c` Content for toast (often test)

  * `cls` Classes for toast (often `ToastHT` and `ToastVT` options)

  * `alert_cls` classes for altert (often `AlertT` options)

  * `dur` no. of seconds before the toast disappears

  * `kwargs`

**Returns:** Div(Alert(...), cls='toast')

* * *

### ToastHT

_Horizontal position for Toast_

Option | Value | Option | Value  
---|---|---|---  
start | toast-start | center | toast-center  
end | toast-end |  |   
  
* * *

### ToastVT

_Vertical position for Toast_

Option | Value | Option | Value  
---|---|---|---  
top | toast-top | middle | toast-middle  
bottom | toast-bottom |  |