Laravel Toaster Magic

https://github.com/devrabiul/laravel-toaster-magic
Admin
Laravel Toaster Magic is a lightweight, dependency-free toast notification package for Laravel...
Tokens:36,624
Snippets:266
Trust Score:9.2
License:MIT
Update:1 month ago
Show doc for...
Tokens:
Raw
### Install package with Composer

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Installs the package via Composer. This is the first step in the installation process.

```bash
composer require devrabiul/laravel-toaster-magic
```

--------------------------------

### ToastMagic Preset Examples

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

A comprehensive list of usage examples for various ToastMagic presets, demonstrating how to trigger different animations and configure toast properties like custom buttons and timeouts.

```php
use Devrabiul\ToastMagic\Facades\ToastMagic;

// 1. Add to cart — bouncing cart
ToastMagic::success('Added to cart', 'Nike Air Max ×1', [
    'preset' => 'cart-add',
]);

// 1b. Cart updated — quantity arrows fire in opposition
ToastMagic::info('Cart updated', 'Quantity changed to 3.', [
    'preset' => 'cart-update',
]);

// 1c. Removed from cart — the basket tips out
ToastMagic::warning('Removed from cart', 'Apple MacBook Pro M5 removed.', [
    'preset' => 'cart-remove',
]);

// 2. Added to wishlist — heart pop + particles
ToastMagic::success('Saved to wishlist', 'Nike Air Max', [
    'preset' => 'wishlist-add',
]);

// 3. Removed from wishlist — heart flinches, crack draws across
ToastMagic::info('Removed from wishlist', 'Nike Air Max', [
    'preset' => 'wishlist-remove',
]);

// 4. Order placed — parcel drops in and settles
ToastMagic::success('Order placed', 'Order #10482 is confirmed.', [
    'preset'        => 'order-placed',
    'customBtnText' => 'Track order',
    'customBtnLink' => '/orders/10482',
]);

// 5. Payment successful — note swipes in, coin pops
ToastMagic::success('Payment successful', '€129.00 charged to •••• 4242.', [
    'preset' => 'payment-success',
]);

// 6. Payment failed — strike draws across the card, toast shakes
ToastMagic::error('Payment failed', 'Your card was declined.', [
    'preset'  => 'payment-failed',
    'timeOut' => 0, // stays until dismissed — the user must act
]);

// 7. Item removed — trash lid lifts
ToastMagic::warning('Item removed', 'Nike Air Max ×1 removed from your cart.', [
    'preset' => 'item-removed',
]);

// 8. Copied to clipboard — clip snaps onto the board
ToastMagic::success('Copied to clipboard', null, [
    'preset'  => 'clipboard-copy',
    'timeOut' => 2000,
]);

// 9. Link shared — share nodes pulse
ToastMagic::info('Link shared', 'Anyone with the link can view this.', [
    'preset' => 'link-shared',
]);

// 10. Profile updated — head pops, shoulders rise
ToastMagic::success('Profile updated', 'Your changes are live.', [
    'preset' => 'profile-updated',
]);

// 11. Settings saved — gear turns a full rotation
ToastMagic::success('Settings saved', null, [
    'preset' => 'settings-saved',
]);

// 12. Download complete — arrow drops into the tray
ToastMagic::success('Download complete', 'invoice-10482.pdf', [
    'preset' => 'download-complete',
]);

// 13. Upload complete — arrow lifts out of the tray
ToastMagic::success('Upload complete', '3 files uploaded.', [
    'preset' => 'upload-complete',
]);

// 14. Connection restored — wi-fi signal rebuilds
ToastMagic::success('Back online', 'Your connection has been restored.', [
    'preset' => 'connection-restored',
]);

// 15. Connection lost — strike draws across the signal
ToastMagic::error('You are offline', 'Reconnecting…', [
    'preset'  => 'connection-lost',
    'timeOut' => 0, // keep it up until the connection is back
]);

// 16. Loading — spins until dismissed
ToastMagic::info('Generating your report', 'This can take a minute.', [
    'preset'  => 'loading',
    'timeOut' => 0, // required: the spinner is a progress signal, not a result
]);

// 17. Session expiring — hands sweep the clock
ToastMagic::warning('Session expiring', 'You will be signed out in 2 minutes.', [
    'preset'        => 'session-expiring',
    'timeOut'       => 0,
    'customBtnText' => 'Stay signed in',
    'customBtnLink' => '/session/extend',
]);

// 18. Out of stock — parcel sags, cross flashes
ToastMagic::warning('Out of stock', 'This size is unavailable.', [
    'preset' => 'out-of-stock',
]);

// 19. Back in stock — the bell rings
ToastMagic::success('Back in stock', 'Apple MacBook Pro M5 is available again.', [
    'preset'        => 'back-in-stock',
    'customBtnText' => 'View',
    'customBtnLink' => '/products/42',
]);

// 20. Coupon applied — the ticket is punched
ToastMagic::success('Coupon applied', 'SAVE20 — €25.80 off.', [
    'preset' => 'coupon-applied',
]);
```

--------------------------------

### Install dependencies

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CONTRIBUTING.md

Install the necessary project dependencies using Composer.

```sh
composer install
```

--------------------------------

### Compact Theme with Custom Spacing

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Example of tuning the compact theme with tighter spacing overrides.

```php
'theme' => 'compact',
'spacing' => [
    'enable' => true,
    'container' => '6px 8px',
    'icon_gap' => '5px',
    'content_gap' => '0px',
    'close_gap' => '4px',
],
```

--------------------------------

### Config Override Example

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Since v2.5, the published config merges defaults automatically; set only overrides like theme, gradient, and color mode.

```php
'options' => [
    'theme' => 'default',
    'gradient_enable' => false,
    'color_mode' => false,
],
```

--------------------------------

### Set theme to neon in config

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Configure the toaster theme by setting the 'theme' key in the config file. The example uses 'neon', which is described as best for dark mode.

```php
// config/laravel-toaster-magic.php
'theme' => 'neon', 
```

--------------------------------

### Tighter spacing configuration

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Tighter spacing configuration for toasts, using smaller padding and gaps than the default example.

```php
'spacing' => [
    'enable' => true,
    'container' => '6px 8px',
    'icon_gap' => '5px',
    'content_gap' => '0px',
    'close_gap' => '4px',
],
```

--------------------------------

### Enable preset packs

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Add desired preset packs to the presets array in your configuration file.

```php
'presets' => ['general', 'commerce'],
```

--------------------------------

### Publish config file

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Publishes the package configuration file. This step is optional.

```bash
php artisan vendor:publish --tag=toast-magic-config
```

--------------------------------

### Following preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a follow action.

```php
ToastMagic::success('Following', 'You will see their updates.', [
    'preset' => 'follow-added',
]);
```

--------------------------------

### Clone the repository

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CONTRIBUTING.md

Fork the repository on GitHub and clone it to your local machine to begin development.

```sh
git clone https://github.com/your-username/laravel-toaster-magic.git
cd laravel-toaster-magic
```

--------------------------------

### Enable Livewire support in config

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Enable Livewire support in the config file by setting 'livewire_enabled' to true.

```php
// config/laravel-toaster-magic.php

return [
    'options' => [
        // your toast options...
    ],
    'livewire_enabled' => true,
];
```

--------------------------------

### Usage with custom options

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Presets can be combined with other existing toast options.

```php
ToastMagic::success('Added to cart', 'Nike Air Max ×1', [
    'preset'        => 'cart-add',
    'showCloseBtn'  => true,
    'customBtnText' => 'View cart',
    'customBtnLink' => '/cart',
    'timeOut'       => 8000,
    'showDuration'  => 300,
]);
```

--------------------------------

### Full Configuration Reference for laravel-toaster-magic

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Full configuration reference for the laravel-toaster-magic package. Shows all available options with defaults and comments explaining behavior, including toast appearance, animation, accessibility, spacing, typography, Livewire bridge, CSP nonce, and asset path prefix.

```php
// config/laravel-toaster-magic.php

return [
    'options' => [
        'escape_html'       => true,  // Escape toast text. Leave this on.
        'closeButton'       => true,
        'positionClass'     => 'toast-top-end',
        'preventDuplicates' => false,
        'showDuration'      => 300,
        'timeOut'           => 5000,  // 0 = stay until dismissed
        'stagger'           => 800,   // Gap between consecutive queued toasts (ms)
        'maxVisible'        => 15,    // Most toasts on screen at once; 0 = no limit
        'theme'             => 'default', // default, material, ios, glassmorphism, neon, minimal, neumorphism, neumorphic, compact
        'gradient_enable'   => false,
        'color_mode'        => false,
        'pauseOnHover'      => true, // Keyboard focus always pauses the timer
        'animation'         => 'default', // default, slide, fade, pop, bounce

        // Accessible names
        'closeButtonLabel'  => 'Close notification',
        'containerLabel'    => 'Notifications',

        // Global spacing — 'enable' => false uses each theme's own spacing.
        'spacing' => [
            'enable'      => true,
            'container'   => '10px 12px',
            'icon_gap'    => '8px',
            'content_gap' => '2px',
            'close_gap'   => '6px',
        ],

        // Global typography — 'enable' => false uses each theme's own typography.
        // 'title_weight', 'description_weight' and 'line_height' are optional.
        'typography' => [
            'enable'           => true,
            'title_size'       => '14px',
            'description_size' => '13px',
        ],
    ],

    // One event bridge serves both Livewire v3 and v4.
    'livewire_enabled'  => false,

    // CSP nonce for the inline <script> blocks (or use ToastMagic::nonce()).
    'csp_nonce'         => null,

    // null auto-detects. Set 'public' if your document root is the project
    // root, or '' to force no prefix on published asset URLs.
    'asset_path_prefix' => null,
];
```

--------------------------------

### Enable compact theme in config

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Selects the 'compact' theme, a denser toast with a 320px track (vs. the default 370px) and reduced padding. Supports success, error, warning, info, avatar toasts, custom action button, color mode, and all animation options.

```php
// config/laravel-toaster-magic.php
'options' => [
    'theme' => 'compact',
],
```

--------------------------------

### Use window.toastMagic with options object in JavaScript

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Shows the recommended JavaScript usage with the shared window.toastMagic instance. Use the options object for heading, description, showCloseBtn, customBtnText, customBtnLink, avatar, timeOut, showDuration, and html. Do not call new ToastMagic() as it would create a second competing instance. Also demonstrates animated presets and programmatic dismissal with clear() or dismissAll().

```js
// Options object (recommended)
toastMagic.success({ heading: 'Success!', description: 'Your data has been saved!' });
toastMagic.error({ heading: 'Error!', description: 'Something went wrong.' });

toastMagic.info({
    heading: 'New message',
    description: 'Hey, are you free to chat?',
    showCloseBtn: true,
    customBtnText: 'Reply',
    customBtnLink: '/messages/42',
    avatar: '/avatars/42.png',
    timeOut: 10000,   // 0 = stay until dismissed
    showDuration: 300,
    html: false,      // true renders the text as HTML — you own its safety
});

// Animated icon preset, layered on top of the type
toastMagic.success({ heading: 'Added to cart', preset: 'cart-add' });

// Programmatically dismiss all visible toasts
toastMagic.clear();      // or toastMagic.dismissAll();
```

--------------------------------

### Signed in preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a user login event.

```php
ToastMagic::success('Welcome back', 'Signed in as nipon@6amtech.com.', [
    'preset' => 'login',
]);
```

--------------------------------

### Usage with title only

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

The description argument remains optional when using a preset.

```php
ToastMagic::success('Added to cart', null, [
    'preset' => 'cart-add',
]);
```

--------------------------------

### Update package and publish assets

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Run these commands to update the package and force-publish the updated CSS and JS assets.

```bash
composer update devrabiul/laravel-toaster-magic
php artisan vendor:publish --tag=toast-magic-assets --force
```

--------------------------------

### No results preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a warning toast when no results are found.

```php
ToastMagic::warning('No results', 'Nothing matched "macbok pro".', [
    'preset' => 'no-results',
]);
```

--------------------------------

### Standard ToastMagic API Usage

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Demonstrates standard usage of ToastMagic without presets. Existing calls remain unchanged and render with default type icons.

```php
ToastMagic::success('Successfully Created');

ToastMagic::info('Info!', 'Your data has been saved!');
ToastMagic::error('Error!', 'Your data has been saved!');
ToastMagic::warning('Warning!', 'Your data has been saved!');

ToastMagic::success('Success!', 'Your data has been saved!');

ToastMagic::info('New message', 'Hey, are you free to chat?', [
    'avatar' => 'https://example.com/avatar.jpg',
]);
```

--------------------------------

### Basic usage with preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Add a preset to the options array when dispatching a success toast.

```php
use Devrabiul\ToastMagic\Facades\ToastMagic;

ToastMagic::success('Added to cart', 'Nike Air Max ×1', [
    'preset' => 'cart-add',
]);
```

--------------------------------

### Usage with title and description

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Provide both a title and a description alongside the preset.

```php
ToastMagic::success('Added to cart', 'Nike Air Max ×1 — €129.00', [
    'preset' => 'cart-add',
]);
```

--------------------------------

### Compact Theme Configuration

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Set the theme to 'compact' in the config file to enable the Compact theme (v2.5).

```php
// config/laravel-toaster-magic.php
'theme' => 'compact',
```

--------------------------------

### Run tests

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CONTRIBUTING.md

Execute the test suite using Pest to ensure all tests pass before submitting your contribution.

```sh
vendor/bin/pest
```

--------------------------------

### Subscription upgraded preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a subscription upgrade event.

```php
ToastMagic::success('Welcome to Pro', 'Every feature is unlocked.', [
    'preset' => 'subscription-upgraded',
]);
```

--------------------------------

### Render raw HTML in toast with html option

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Opt in per toast to render raw HTML. With ['html' => true] you own the safety of that string; escape any user input inside it yourself.

```php
ToastMagic::success('<strong>Saved</strong>', null, ['html' => true]);
```

--------------------------------

### Republish assets after upgrade

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CHANGELOG.md

Run this Artisan command to republish the package assets (CSS and JS) after upgrading, as both files changed.

```bash
php artisan vendor:publish --tag=toast-magic-assets --force
```

--------------------------------

### Enable color mode in config

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Enable color mode by setting 'color_mode' to true in the config file. This forces toast backgrounds to match the toast type (e.g., green for success, red for error), overriding theme backgrounds.

```php
// config/laravel-toaster-magic.php
'color_mode' => true
```

--------------------------------

### Configure global spacing options

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Configures global spacing options for toasts. The `enable` key controls whether the values are applied; omitting a key or setting it to `null` falls back to the theme's default for that value.

```php
return [
    'options' => [
        'spacing' => [
            'enable' => true,
            'container' => '10px 12px', // Padding inside the toast
            'icon_gap' => '8px',        // Icon <-> content
            'content_gap' => '2px',     // Title <-> description
            'close_gap' => '6px',       // Content <-> close/action controls
        ],
    ],
];
```

--------------------------------

### Configure preset packs

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Define which preset packs to include in your project via the config/laravel-toaster-magic.php file. Presets from packs not listed in the array are ignored.

```php
// config/laravel-toaster-magic.php
'presets' => ['general'],          // default
'presets' => ['general', 'commerce'],
'presets' => 'all',                // every pack
'presets' => [],                   // none
```

--------------------------------

### Enable gradient mode in config

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Enable gradient mode by setting 'gradient_enable' to true in the config file. This adds a gradient effect based on toast type and works best with Default, Material, Neon, and Glassmorphism themes.

```php
// config/laravel-toaster-magic.php
'gradient_enable' => true
```

--------------------------------

### Configure toast animation with the animation option

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Set the toast animation style. The value can be default, slide, fade, pop, or bounce. The default is slide in from the toast's position; slide is position-aware with its own easing, fade has no movement, pop scales up with a soft overshoot, and bounce slides in with a springy overshoot.

```php
return [
    'options' => [
        'animation' => 'slide', // default, slide, fade, pop, bounce
    ],
];
```

--------------------------------

### Bookmarked preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a bookmarking event.

```php
ToastMagic::success('Bookmarked', 'Find it later under Saved.', [
    'preset' => 'bookmark-saved',
]);
```

--------------------------------

### Static toast dispatch

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Quick static method for dispatching toasts.

```php
use Devrabiul\ToastMagic\Facades\ToastMagic;

ToastMagic::success('Operation Successful');
ToastMagic::error('Something went wrong');
```

--------------------------------

### Appointment booked preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for an appointment booking event.

```php
ToastMagic::success('Appointment booked', 'Tuesday 2 September, 10:30.', [
    'preset' => 'appointment-booked',
]);
```

--------------------------------

### ToastMagic::success with preset option

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CHANGELOG.md

Shows how to use the new 'preset' option to display an animated icon (e.g., 'cart-add') on a success toast. The preset is layered on top of the type, which still controls color, progress bar, theme, and announcement.

```php
ToastMagic::success('Added to cart', 'Nike Air Max ×1', ['preset' => 'cart-add']);
```

--------------------------------

### Configure toast typography with title_size and description_size

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Configure toast typography globally. The enable key controls whether the size values are applied; title_size and description_size set the font sizes. Optional keys like title_weight, description_weight, and line_height can be omitted to let each theme keep its own values.

```php
return [
    'options' => [
        'typography' => [
            'enable' => true,
            'title_size' => '14px',
            'description_size' => '13px',
        ],
    ],
];
```

--------------------------------

### Update Composer to v2.0

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Run this Composer command to upgrade the package to version 2.0.

```bash
composer require devrabiul/laravel-toaster-magic "^2.0"
```

--------------------------------

### Fluent syntax usage

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Use the fluent dispatch syntax to trigger a toast with a preset.

```php
ToastMagic::dispatch()->success('Added to cart', 'Nike Air Max ×1', [
    'preset' => 'cart-add',
]);
```

--------------------------------

### Order shipped preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers an info toast for an order shipment, including custom button text and link.

```php
ToastMagic::info('On its way', 'Order #10482 shipped via DHL.', [
    'preset'        => 'order-shipped',
    'customBtnText' => 'Track',
    'customBtnLink' => '/orders/10482/tracking',
]);
```

--------------------------------

### Use positional signature for toastMagic.success

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Shows the positional signature for backward compatibility. Parameters are heading, description, showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, and avatar.

```js
toastMagic.success('Heading', 'Description', showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, avatar);
```

--------------------------------

### Permission denied preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers an error toast for a permission denied event.

```php
ToastMagic::error('Permission denied', 'You need an admin role for that.', [
    'preset' => 'permission-denied',
]);
```

--------------------------------

### Sync complete preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a data synchronization completion.

```php
ToastMagic::success('Sync complete', '48 records updated.', [
    'preset' => 'sync-complete',
]);
```

--------------------------------

### Handling Unknown or Invalid Presets

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Demonstrates that unrecognized or invalid preset values are ignored silently, causing the toast to render with the standard type icon.

```php
// Renders a completely normal success toast.
ToastMagic::success('Added to cart', 'Nike Air Max ×1', [
    'preset' => 'cart-added',   // typo — not a registered preset
]);
```

--------------------------------

### Configure maxVisible toasts

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Set maxVisible to 0 in your config to remove the default 15-toast limit.

```php
'options' => [
    'maxVisible' => 0,  // no limit, the pre-2.6 behaviour
],
```

--------------------------------

### Create a new branch

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CONTRIBUTING.md

Create a new branch for your specific feature or bugfix before making any changes.

```sh
git checkout -b feature-or-fix-name
```

--------------------------------

### Basic Blade layout with ToastMagic

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Basic layout for integrating ToastMagic. Place the styles() call inside the <head> tag and the scripts() call just before the closing </body> tag.

```blade
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Page Title</title>

    {!! ToastMagic::styles() !!}
</head>
<body>

    <!-- Your Content -->

    {!! ToastMagic::scripts() !!}
</body>
</html>
```

--------------------------------

### Fluent toast dispatch

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Fluent dispatch style for advanced toast configuration.

```php
ToastMagic::dispatch()->success(
    'User Created',
    'The user has been successfully created.',
    [
        'showCloseBtn'  => true,
        'customBtnText' => 'View Profile',
        'customBtnLink' => 'https://example.com',
    ]
);
```

--------------------------------

### Signed out preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers an info toast for a user logout event.

```php
ToastMagic::info('Signed out', 'See you next time.', [
    'preset' => 'logout',
]);
```

--------------------------------

### Configure maxVisible option

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Sets a limit on the number of visible toasts in the stack to prevent overflow. Setting this to 0 disables the limit.

```php
'options' => [
    'maxVisible' => 15,  // 0 = no limit
],
```

--------------------------------

### Spacing and Typography Configuration

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Global spacing and typography sections independent of theme; each resolves to CSS custom properties with theme fallbacks.

```php
// config/laravel-toaster-magic.php
'spacing' => [
    'enable' => true,
    'container' => '10px 12px', // Toast padding
    'icon_gap' => '8px',        // Icon <-> content
    'content_gap' => '2px',     // Title <-> description
    'close_gap' => '6px',       // Content <-> close/action controls
],

'typography' => [
    'enable' => true,
    'title_size' => '14px',
    'description_size' => '13px',
    // Optional: 'title_weight', 'description_weight', 'line_height'
],
```

--------------------------------

### New message preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers an info toast for a new message notification.

```php
ToastMagic::info('New message', 'Hey, are you free to chat?', [
    'preset' => 'message-received',
]);
```

--------------------------------

### JavaScript toastMagic.success with preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Use toastMagic.success with an options object to include the 'preset' key. The positional signature is frozen and does not accept new parameters.

```JavaScript
toastMagic.success({
    heading: 'Added to cart',
    description: 'Nike Air Max ×1',
    preset: 'cart-add',
});
```

--------------------------------

### Push to GitHub

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CONTRIBUTING.md

Push your local branch to the remote repository on GitHub.

```sh
git push origin feature-or-fix-name
```

--------------------------------

### Order delivered preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for an order delivery event.

```php
ToastMagic::success('Delivered', 'Left with the concierge.', [
    'preset' => 'order-delivered',
]);
```

--------------------------------

### Commit changes

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/CONTRIBUTING.md

Stage and commit your changes with a meaningful message.

```sh
git add .
git commit -m "Add feature/fix description"
```

--------------------------------

### ToastMagic Preset and Avatar Interaction

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Shows that when both an avatar and a preset are provided, the avatar takes precedence and the preset icon is skipped.

```php
// Renders the avatar image. 'cart-add' is ignored.
ToastMagic::success('Added to cart', 'Nike Air Max ×1', [
    'avatar' => '/img/product-42.png',
    'preset' => 'cart-add',
]);
```

--------------------------------

### Apply monochrome style to all presets

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Reset all icon parts to use the current text colour, creating a monochrome effect.

```css
.toast-body-icon-container.tm-preset {
    --tm-i1: currentColor;
    --tm-i2: currentColor;
    --tm-i3: currentColor;
}
```

--------------------------------

### Match brand colours across all presets

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Apply brand-specific CSS variables to the global preset class to update the entire set.

```css
.toast-body-icon-container.tm-preset {
    --tm-i1: var(--brand-700);
    --tm-i2: var(--brand-500);
}
```

--------------------------------

### Configure default theme in config/laravel-toaster-magic.php

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Sets the default theme in the configuration file. The 'theme' option accepts one of the built-in theme names, such as 'default', 'material', 'ios', 'glassmorphism', 'neon', 'minimal', 'neumorphism', 'neumorphic', or 'compact'.

```php
return [
    'options' => [
        "theme" => "default", // See options below
    ],
];
```

--------------------------------

### Follow OS dark mode with prefers-color-scheme

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Follow the OS dark mode setting by copying dark tokens into a media query. The body:not([theme]) selector ensures it only applies when no theme attribute is set.

```css
/* …or follow the OS setting directly */
@media (prefers-color-scheme: dark) {
    body:not([theme]) { /* copy the dark tokens you want here */ }
}
```

--------------------------------

### Review submitted preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a review submission event.

```php
ToastMagic::success('Thanks for your review', 'You rated this 5 stars.', [
    'preset' => 'review-submitted',
]);
```

--------------------------------

### toastMagic.info (JavaScript)

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Triggers an info toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

```APIDOC
## toastMagic.info (JavaScript)

### Description
Triggers an info toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

### Method
JavaScript method

### Endpoint
toastMagic.info(options) or toastMagic.info(heading, description, showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, avatar)

### Parameters
- **options** (object) - Optional - Options object with fields: heading (string), description (string), showCloseBtn (bool), customBtnText (string), customBtnLink (string), avatar (string, URL), timeOut (int, ms), showDuration (int, ms), html (bool), preset (string).
- **heading** (string) - Optional - The main toast heading (positional signature).
- **description** (string) - Optional - The toast description (positional signature).
- **showCloseBtn** (bool) - Optional - Show close button (positional signature).
- **customBtnText** (string) - Optional - Custom button text (positional signature).
- **customBtnLink** (string) - Optional - Custom button link (positional signature).
- **timeOut** (int) - Optional - Auto-dismiss time in ms, 0 = stay until dismissed (positional signature).
- **showDuration** (int) - Optional - Show animation delay in ms (positional signature).
- **avatar** (string) - Optional - Avatar URL (positional signature).

### Request Example
```js
toastMagic.info({
    heading: 'New message',
    description: 'Hey, are you free to chat?',
    showCloseBtn: true,
    customBtnText: 'Reply',
    customBtnLink: '/messages/42',
    avatar: '/avatars/42.png',
    timeOut: 10000,
    showDuration: 300,
    html: false,
});
```

### Response
No return value documented.
```

--------------------------------

### Enable dark mode with theme attribute

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Add the theme attribute to the body tag to enable dark mode. Every shipped theme has a dark treatment; neon is dark by design and neumorphism keeps its light surface deliberately.

```html
<body theme="dark">
```

--------------------------------

### Dispatch toast from Livewire component

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Dispatch toast notifications from any Livewire component. Supported status values: success, info, warning, error. Both showCloseBtn and closeButton option keys are supported; showCloseBtn takes priority if both are provided.

```php
// With full options
$this->dispatch('toastMagic',
    status: 'success',
    title: 'User Created',
    message: 'The user has been successfully created.',
    options: [
        'showCloseBtn' => true,
        'customBtnText' => 'View Profile',
        'customBtnLink' => 'https://example.com',
    ],
);

// Simple dispatch
$this->dispatch('toastMagic',
    status: 'info',
    title: 'Heads Up',
    message: 'Your session will expire soon.'
);
```

--------------------------------

### Render avatar-style toast with ToastMagic::info

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Renders an avatar image in place of the type icon by passing an 'avatar' URL. Ideal for 'new message' or 'new follower' style notifications.

```php
ToastMagic::info('New message', 'Hey, are you free to chat?', [
    'avatar' => $user->avatar_url,
]);
```

--------------------------------

### toastMagic.success (JavaScript)

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Triggers a success toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

```APIDOC
## toastMagic.success (JavaScript)

### Description
Triggers a success toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

### Method
JavaScript method

### Endpoint
toastMagic.success(options) or toastMagic.success(heading, description, showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, avatar)

### Parameters
- **options** (object) - Optional - Options object with fields: heading (string), description (string), showCloseBtn (bool), customBtnText (string), customBtnLink (string), avatar (string, URL), timeOut (int, ms), showDuration (int, ms), html (bool), preset (string).
- **heading** (string) - Optional - The main toast heading (positional signature).
- **description** (string) - Optional - The toast description (positional signature).
- **showCloseBtn** (bool) - Optional - Show close button (positional signature).
- **customBtnText** (string) - Optional - Custom button text (positional signature).
- **customBtnLink** (string) - Optional - Custom button link (positional signature).
- **timeOut** (int) - Optional - Auto-dismiss time in ms, 0 = stay until dismissed (positional signature).
- **showDuration** (int) - Optional - Show animation delay in ms (positional signature).
- **avatar** (string) - Optional - Avatar URL (positional signature).

### Request Example
```js
toastMagic.success({ heading: 'Success!', description: 'Your data has been saved!' });
```

### Response
No return value documented.
```

--------------------------------

### Livewire dispatch toastMagic event

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Dispatch the 'toastMagic' event from Livewire (v3 & v4) with status, title, message, and options array containing the preset.

```PHP
$this->dispatch('toastMagic',
    status: 'success',
    title: 'Added to cart',
    message: 'Nike Air Max ×1',
    options: [
        'preset' => 'cart-add',
    ],
);
```

--------------------------------

### Restore stagger pacing

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Explicitly set the stagger option to 250ms to restore the pre-2.6 animation pacing.

```php
'options' => [
    'stagger' => 250,
],
```

--------------------------------

### Trigger toast notifications from a controller with ToastMagic facade

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Shows how to trigger toast notifications from a Laravel controller using the ToastMagic facade. Covers simple messages, messages with descriptions, and custom options like showCloseBtn, customBtnText, customBtnLink, timeOut, and showDuration. The available toast types are success, info, warning, and error.

```php
use Devrabiul\ToastMagic\Facades\ToastMagic;

public function store()
{
    // Simple message
    ToastMagic::success('Successfully Created');

    // Message with description
    ToastMagic::success('Success!', 'Your data has been saved!');

    // With custom options
    ToastMagic::success('Success!', 'Your data has been saved!', [
        'showCloseBtn' => true,
        'customBtnText' => 'View Record',
        'customBtnLink' => 'https://example.com',
        'timeOut' => 10000,    // Optional: override the auto-dismiss time (ms) for this toast only
        'showDuration' => 300, // Optional: override the show animation delay (ms) for this toast only
    ]);

    return back();
}
```

--------------------------------

### Email verified preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for an email verification event.

```php
ToastMagic::success('Email verified', 'Your address is confirmed.', [
    'preset' => 'email-verified',
]);
```

--------------------------------

### Email sent preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for an email sent event.

```php
ToastMagic::success('Email sent', 'A receipt is on its way.', [
    'preset' => 'email-sent',
]);
```

--------------------------------

### Enable neumorphic theme in config

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Enables the 'neumorphic' soft-UI theme. It uses dual-direction shadows and a hairline inner bevel; the surface stays monochromatic for all toast types, with only the icon, progress fill, and focus ring picking up the semantic accent. Note: 'neumorphic' is separate from the original 'neumorphism' theme.

```php
// config/laravel-toaster-magic.php
'options' => [
    'theme' => 'neumorphic',
],
```

--------------------------------

### Draft saved preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers an info toast for a draft saved event with a custom timeout.

```php
ToastMagic::info('Draft saved', 'Saved automatically a moment ago.', [
    'preset'  => 'draft-saved',
    'timeOut' => 2000,
]);
```

--------------------------------

### Multi-line toast message with newlines

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Multi-line messages work; newlines become real <br> elements after escaping.

```php
ToastMagic::info("First line\nSecond line");
```

--------------------------------

### toastMagic.warning (JavaScript)

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Triggers a warning toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

```APIDOC
## toastMagic.warning (JavaScript)

### Description
Triggers a warning toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

### Method
JavaScript method

### Endpoint
toastMagic.warning(options) or toastMagic.warning(heading, description, showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, avatar)

### Parameters
- **options** (object) - Optional - Options object with fields: heading (string), description (string), showCloseBtn (bool), customBtnText (string), customBtnLink (string), avatar (string, URL), timeOut (int, ms), showDuration (int, ms), html (bool), preset (string).
- **heading** (string) - Optional - The main toast heading (positional signature).
- **description** (string) - Optional - The toast description (positional signature).
- **showCloseBtn** (bool) - Optional - Show close button (positional signature).
- **customBtnText** (string) - Optional - Custom button text (positional signature).
- **customBtnLink** (string) - Optional - Custom button link (positional signature).
- **timeOut** (int) - Optional - Auto-dismiss time in ms, 0 = stay until dismissed (positional signature).
- **showDuration** (int) - Optional - Show animation delay in ms (positional signature).
- **avatar** (string) - Optional - Avatar URL (positional signature).

### Request Example
```js
toastMagic.warning({ heading: 'Warning!', description: 'Please check your input.' });
```

### Response
No return value documented.
```

--------------------------------

### Refund issued preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers an info toast for a refund issuance event.

```php
ToastMagic::info('Refund issued', '€129.00 back to •••• 4242 in 3-5 days.', [
    'preset' => 'refund-issued',
]);
```

--------------------------------

### Add nonce to inline scripts for CSP

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Emit the two inline script blocks with a nonce when the CSP disallows 'unsafe-inline'. Alternatively set csp_nonce in the config when the value is known at config time.

```php
{!! ToastMagic::nonce($nonce)->scripts() !!}
```

--------------------------------

### Password changed preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Triggers a success toast for a password change event.

```php
ToastMagic::success('Password changed', 'Sign in again on your other devices.', [
    'preset' => 'password-changed',
]);
```

--------------------------------

### Override CSS shadow

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/release.md

Use this CSS to suppress shadows on the toast container, as the shadow_enable config key is now ignored.

```css
.toast-container {
    --toast-magic-box-shadow: none;
}
```

--------------------------------

### ToastMagic::warning

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Triggers a warning toast notification from a Laravel controller. Accepts a message, optional description, and optional custom options.

```APIDOC
## ToastMagic::warning

### Description
Triggers a warning toast notification from a Laravel controller. Accepts a message, optional description, and optional custom options.

### Method
Facade method

### Endpoint
ToastMagic::warning($message, $description = null, $options = [])

### Parameters
- **message** (string) - Required - The main toast message.
- **description** (string) - Optional - A secondary description line.
- **options** (array) - Optional - Custom options: showCloseBtn (bool), customBtnText (string), customBtnLink (string), timeOut (int, ms), showDuration (int, ms), avatar (string, URL), preset (string).

### Request Example
```php
ToastMagic::warning('Warning!', 'Please check your input.', [
    'timeOut' => 5000,
]);
```

### Response
No return value documented.
```

--------------------------------

### Retint a single preset

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Override the CSS custom properties for a specific preset to change its primary and accent colours.

```css
.toast-body-icon-container.tm-preset-wishlist-add {
    --tm-i1: #9f1239;   /* outline */
    --tm-i2: #f43f5e;   /* fill    */
}
```

--------------------------------

### toastMagic.error (JavaScript)

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Triggers an error toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

```APIDOC
## toastMagic.error (JavaScript)

### Description
Triggers an error toast from JavaScript using the shared window.toastMagic instance. Supports options object and positional signature.

### Method
JavaScript method

### Endpoint
toastMagic.error(options) or toastMagic.error(heading, description, showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, avatar)

### Parameters
- **options** (object) - Optional - Options object with fields: heading (string), description (string), showCloseBtn (bool), customBtnText (string), customBtnLink (string), avatar (string, URL), timeOut (int, ms), showDuration (int, ms), html (bool), preset (string).
- **heading** (string) - Optional - The main toast heading (positional signature).
- **description** (string) - Optional - The toast description (positional signature).
- **showCloseBtn** (bool) - Optional - Show close button (positional signature).
- **customBtnText** (string) - Optional - Custom button text (positional signature).
- **customBtnLink** (string) - Optional - Custom button link (positional signature).
- **timeOut** (int) - Optional - Auto-dismiss time in ms, 0 = stay until dismissed (positional signature).
- **showDuration** (int) - Optional - Show animation delay in ms (positional signature).
- **avatar** (string) - Optional - Avatar URL (positional signature).

### Request Example
```js
toastMagic.error({ heading: 'Error!', description: 'Something went wrong.' });
```

### Response
No return value documented.
```

--------------------------------

### HTML data attributes for toast

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/PRESETS.md

Use data-toast-type, data-toast-preset, data-toast-heading, and data-toast-description attributes on a button to trigger a toast. The data-toast-preset attribute accepts a preset name; an unregistered name is ignored.

```HTML
<button
    data-toast-type="success"
    data-toast-preset="cart-add"
    data-toast-heading="Added to cart"
    data-toast-description="Nike Air Max ×1"
>Add to cart</button>
```

--------------------------------

### Neumorphic Theme Configuration

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Set the theme to 'neumorphic' in the config file to enable the Neumorphic theme (v2.4).

```php
// config/laravel-toaster-magic.php
'theme' => 'neumorphic',
```

--------------------------------

### Dispatch toast from Livewire component

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/THEMES.md

Dispatch a toast notification from a Livewire component using the 'toastMagic' event with status, message, and title parameters. This works with Livewire v3 and v4.

```php
// Dispatch from component
$this->dispatch('toastMagic', 
    status: 'success', 
    message: 'User Saved!', 
    title: 'Great Job'
);
```

--------------------------------

### ToastMagic::info

Source: https://github.com/devrabiul/laravel-toaster-magic/blob/main/README.md

Triggers an info toast notification from a Laravel controller. Supports avatar and preset options for notification-style toasts.

```APIDOC
## ToastMagic::info

### Description
Triggers an info toast notification from a Laravel controller. Supports avatar and preset options for notification-style toasts.

### Method
Facade method

### Endpoint
ToastMagic::info($message, $description = null, $options = [])

### Parameters
- **message** (string) - Required - The main toast message.
- **description** (string) - Optional - A secondary description line.
- **options** (array) - Optional - Custom options: avatar (string, URL), preset (string), and other options as supported.

### Request Example
```php
ToastMagic::info('New message', 'Hey, are you free to chat?', [
    'avatar' => $user->avatar_url,
]);
```

### Response
No return value documented.
```
Tokens:
Raw