Django Toast Component

Toast renders a fixed-position notification container using daisyUI's toast layout. Place an alert inside a toast to show feedback messages that don't interrupt the user's workflow.

Basic Toast

Preview

New message arrived.

Code

<div class="relative h-32 w-full">
  <c-lb.toast class="absolute">
    <c-lb.alert variant="info">New message arrived.</c-lb.alert>
  </c-lb.toast>
</div>

Positions

Preview

Top Start

Middle Center

Bottom End

Code

<div class="relative h-48 w-full">
  <c-lb.toast horizontal="start" vertical="top" class="absolute">
    <c-lb.alert variant="info">Top Start</c-lb.alert>
  </c-lb.toast>
  <c-lb.toast horizontal="center" vertical="middle" class="absolute">
    <c-lb.alert variant="success">Middle Center</c-lb.alert>
  </c-lb.toast>
  <c-lb.toast horizontal="end" vertical="bottom" class="absolute">
    <c-lb.alert variant="warning">Bottom End</c-lb.alert>
  </c-lb.toast>
</div>

API Reference

`c-lb.toast`

Property	Type	Default	Required	Description
class	string	-	No	Additional CSS classes to apply
horizontal	start center end	-	No	Horizontal position
vertical	top middle bottom	-	No	Vertical position

Slot Name	Description
default	Toast content (typically alert components)