Notification
A dismissible role="alert" banner island. The close button calls a signal to hide the component. Use autoClose with a millisecond delay to auto-dismiss.
Default
Update available
import { Notification } from '@davaux/ui'
<Notification title="Update available" message="A new version is ready to install." />Colors
Info
Success
Warning
Error
<Notification color="blue" title="Info" message="Request processing." icon={infoIconHtml} />
<Notification color="green" title="Success" message="Changes saved." icon={checkIconHtml} />
<Notification color="yellow" title="Warning" message="Session expiring soon." />
<Notification color="red" title="Error" message="Something went wrong." />Without close button
Persistent notification
<Notification
color="violet"
title="Persistent"
message="Cannot be dismissed."
withCloseButton={false}
/>Props
| Prop | Type | Default | Description |
|---|---|---|---|
title | string | — | Heading text above the message |
message | string | '' | Main body text |
color | string | 'blue' | Theme color applied to the icon and accent |
icon | string | — | Raw SVG HTML string for the notification icon |
visible | boolean | true | Initial visibility state |
withCloseButton | boolean | true | Shows the dismiss button |
autoClose | number | 0 | Auto-dismiss after this many milliseconds (0 = disabled) |