Toast
A succinct message that is displayed temporarily.
Examples
Properties
Toasts are triggered by passing an object to the addToast() function with the following properties:
| Property | Type | Default | Description |
|---|---|---|---|
| message | string | - | Required. The primary notification text. |
| title | string | null | Optional bold heading. |
| type | string | null |
Options: success, error, info.
|
| duration | number | 3000 | Delay in ms before auto-closing. |
| autoclose | boolean | true | Whether to close automatically. |
Usage
Triggering from Blade/Alpine
blade
<x-plume::button
x-on:click="addToast({
type: 'success',
title: 'Saved',
message: 'Your profile has been updated.',
duration: 3000
})"
>
Save Profile
</x-plume::button>Toaster Layout (Required in App Layout)
blade
<!-- Include this once in your main layout -->
<x-plume::toaster />