PHPackages                             devrabiul/laravel-toaster-magic - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Mail &amp; Notifications](/categories/mail)
4. /
5. devrabiul/laravel-toaster-magic

ActiveLibrary[Mail &amp; Notifications](/categories/mail)

devrabiul/laravel-toaster-magic
===============================

Laravel Toaster Magic is a lightweight, flexible toast library for Laravel projects, with no jQuery, Bootstrap, or Tailwind dependency.

2.3.0(2mo ago)22678.5k↓34.2%161MITJavaScriptPHP ^8.0CI passing

Since Apr 8Pushed 3w ago6 watchersCompare

[ Source](https://github.com/devrabiul/laravel-toaster-magic)[ Packagist](https://packagist.org/packages/devrabiul/laravel-toaster-magic)[ Docs](https://github.com/devrabiul/laravel-toaster-magic)[ RSS](/packages/devrabiul-laravel-toaster-magic/feed)WikiDiscussions main Synced 2w ago

READMEChangelog (10)Dependencies (3)Versions (17)Used By (1)

🍞 Laravel Toaster Magic — v2.3
==============================

[](#-laravel-toaster-magic--v23)

Laravel Toaster Magic is a lightweight, dependency-free toast notification package for Laravel with Livewire v3 &amp; v4 support.

Laravel Toaster Magic provides elegant, fully customizable toast notifications for Laravel applications — with **zero dependency** on jQuery, Bootstrap, or Tailwind CSS. It works out of the box with Livewire, supports multiple modern themes, and is simple enough to drop into any project in minutes.

[![Tests](https://github.com/devrabiul/laravel-toaster-magic/actions/workflows/tests.yml/badge.svg)](https://github.com/devrabiul/laravel-toaster-magic/actions/workflows/tests.yml)[![Latest Stable Version](https://camo.githubusercontent.com/a8ff2b2f9edfd804248aa6119abd401034aa8ee49f968bb007ae317dbf0e6603/68747470733a2f2f706f7365722e707567782e6f72672f64657672616269756c2f6c61726176656c2d746f61737465722d6d616769632f762f737461626c65)](https://packagist.org/packages/devrabiul/laravel-toaster-magic)[![Total Downloads](https://camo.githubusercontent.com/5041f002bac594402763148a4d677a8b13db89c2d26005a91a9a1fe5e85ac383/68747470733a2f2f706f7365722e707567782e6f72672f64657672616269756c2f6c61726176656c2d746f61737465722d6d616769632f646f776e6c6f616473)](https://packagist.org/packages/devrabiul/laravel-toaster-magic)[![Monthly Downloads](https://camo.githubusercontent.com/a3466b5b350781e208f71c05ecd60db65dc60880ef9a1d6eea7890464403df2b/68747470733a2f2f706f7365722e707567782e6f72672f64657672616269756c2f6c61726176656c2d746f61737465722d6d616769632f642f6d6f6e74686c79)](https://packagist.org/packages/devrabiul/laravel-toaster-magic)[![GitHub License](https://camo.githubusercontent.com/5629272e087524c8d6ff042aebb16994d2b3bd1f8a436bf1a17ee4a0655555b4/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f64657672616269756c2f6c61726176656c2d746f61737465722d6d61676963)](LICENSE)[![Buy us a tree](https://camo.githubusercontent.com/130148911f548b001b2ac68a32c0a06559977ca60ada3bf480c72ae4ea093175/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f54726565776172652d2546302539462538432542332d6c69676874677265656e)](https://plant.treeware.earth/devrabiul/laravel-toaster-magic)[![GitHub Stars](https://camo.githubusercontent.com/6edaae3ba09979d185257e9f2c997eeeaa8de24cdf5db5683f9cdba358415f10/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f73746172732f64657672616269756c2f6c61726176656c2d746f61737465722d6d616769633f7374796c653d736f6369616c)](https://github.com/devrabiul/laravel-toaster-magic)

---

🚀 Live Demo
-----------

[](#-live-demo)

👉 [Try the Live Demo](https://laravel-toaster-magic.rixetbd.com)

[![Live Demo Thumbnail](https://camo.githubusercontent.com/4dc038c1f81a45f56db2d1ae52cff58a465ab2f22311ef6b68aa713adea12253/68747470733a2f2f726978657462642e636f6d2f73746f726167652f6170702f7075626c69632f7061636b6167652f64657672616269756c2f6c61726176656c2d746f61737465722d6d616769632e77656270)](https://camo.githubusercontent.com/4dc038c1f81a45f56db2d1ae52cff58a465ab2f22311ef6b68aa713adea12253/68747470733a2f2f726978657462642e636f6d2f73746f726167652f6170702f7075626c69632f7061636b6167652f64657672616269756c2f6c61726176656c2d746f61737465722d6d616769632e77656270)

---

✨ Features
----------

[](#-features)

- 🔥 **Easy to Use** — Simple, intuitive API with support for both static and fluent syntax.
- 🌍 **RTL Support** — Full compatibility with right-to-left languages.
- 🌙 **Dark Mode** — Built-in dark mode support via a single HTML attribute.
- 🎨 **7+ Themes** — iOS, Neon, Glassmorphism, Material, Minimal, Neumorphism, and Default.
- 🎞️ **Entrance/Exit Animations** — Choose how toasts enter and leave: `slide`, `fade`, `pop`, or `bounce`.
- 🪄 **Smooth Stack Reflow** — Remaining toasts glide into place (FLIP) when one is added or dismissed. Respects `prefers-reduced-motion`.
- 🖼️ **Avatar Toasts** — Render an image in place of the type icon for notification-style toasts.
- ⚡ **Livewire Ready** — First-class support for Livewire v3 &amp; v4 with event-based dispatching.
- 🔒 **Safe Button Links** — Custom button URLs are sanitized before being rendered into the DOM. See the [Security](#-security) section for how message content is handled.
- ✅ **Zero Dependencies** — No jQuery, Bootstrap, or Tailwind required.

---

📦 Installation
--------------

[](#-installation)

Install the package via Composer:

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

Publish the package assets:

```
php artisan vendor:publish --provider="Devrabiul\ToastMagic\ToastMagicServiceProvider"
```

> **Note:** Assets are also auto-published on the first page load and automatically refreshed whenever the package is updated.

---

⚙️ Basic Setup
--------------

[](#️-basic-setup)

Add the stylesheet inside your `` tag and the scripts just before the closing `` tag:

```

    Page Title

    {!! ToastMagic::styles() !!}

    {!! ToastMagic::scripts() !!}

```

---

🧑‍💻 Usage
---------

[](#‍-usage)

### 1. Controller Usage

[](#1-controller-usage)

Trigger toast notifications from your controllers using the `ToastMagic` facade:

```
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();
}
```

**Available toast types:** `success`, `info`, `warning`, `error`

You can also pass a validation `MessageBag` directly — its messages are flattened into a single toast, one per line:

```
ToastMagic::error($validator->errors());
```

#### 🖼️ Avatar / notification-style toasts

[](#️-avatar--notification-style-toasts)

Pass an `avatar` URL to render an image in place of the type icon — ideal for "new message" / "new follower" style notifications:

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

---

### 2. JavaScript Usage

[](#2-javascript-usage)

Use ToastMagic directly in JavaScript for AJAX responses or client-side events:

```
const toastMagic = new ToastMagic();

toastMagic.success('Success!', 'Your data has been saved!');
toastMagic.error('Error!', 'Something went wrong.');
toastMagic.warning('Warning!', 'Check your input.', true);
toastMagic.info('Info!', 'Click for details.', false, 'Learn More', 'https://example.com');

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

**Signature:** `toastMagic.{type}(heading, description, showCloseBtn, customBtnText, customBtnLink, timeOut, showDuration, avatar)`

> `timeOut` and `showDuration` are optional per-toast overrides (in milliseconds). `avatar` is an optional image URL shown in place of the type icon. When omitted, the global config values are used.

---

### 3. Livewire Support (v3 &amp; v4)

[](#3-livewire-support-v3--v4)

Enable Livewire support in your config file:

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

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

Dispatch toast notifications from any Livewire component:

```
// 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.'
);
```

**Supported status values:** `success`, `info`, `warning`, `error`

> **Backward Compatibility:** Both `showCloseBtn` and `closeButton` option keys are supported in Livewire events. If both are provided, `showCloseBtn` takes priority.

---

### 4. Alternative &amp; Fluent Syntax

[](#4-alternative--fluent-syntax)

ToastMagic supports both a quick static method and a fluent dispatch style.

**Static (Quick):**

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

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

**Fluent (Advanced):**

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

---

📍 Position Options
------------------

[](#-position-options)

Control where toasts appear on screen using the `positionClass` config option:

ValuePosition`toast-top-start`Top left`toast-top-end`Top right *(default)*`toast-top-center`Top center`toast-bottom-start`Bottom left`toast-bottom-end`Bottom right`toast-bottom-center`Bottom center---

🎨 Themes
--------

[](#-themes)

ToastMagic includes 7 built-in themes. Set your preferred theme in `config/laravel-toaster-magic.php`:

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

ThemeDescription`default`Clean, classic look`material`Material Design — flat and bold`ios`Apple-style notifications with backdrop blur`glassmorphism`Heavy blur, semi-transparent, modern aesthetic`neon`Dark background with glowing borders — ideal for dark UIs`minimal`Clean design with colored left-side accent`neumorphism`Soft UI with extruded shadow stylingFor a full theme preview, see [THEMES.md](THEMES.md).

---

🌈 Color Mode
------------

[](#-color-mode)

Enable color mode to apply toast-type colors automatically to backgrounds and accents:

```
return [
    'options' => [
        'color_mode' => true,
    ],
];
```

---

🌟 Gradient Mode
---------------

[](#-gradient-mode)

Enable gradient mode to apply subtle gradients to toast backgrounds:

```
return [
    'options' => [
        "gradient_enable" => true,
    ],
];
```

> **Note:** Gradient mode works best with the `default`, `material`, and `neon` themes.

---

🎞️ Animations
-------------

[](#️-animations)

Choose how toasts enter and leave the screen using the `animation` config option:

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

ValueEffect`default`Slide in from the toast's position *(default)*`slide`Same as default — explicit slide`fade`Fade in/out with no movement`pop`Scale up from slightly smaller, with a soft overshoot`bounce`Slide in with a springy overshoot> **Smooth stack reflow:** When a toast is added or dismissed, the remaining toasts glide smoothly into their new positions (using the FLIP technique) instead of jumping. This honors the user's `prefers-reduced-motion` setting and requires no configuration.

---

🌙 Dark Mode
-----------

[](#-dark-mode)

Add `theme="dark"` to your `` tag to enable dark mode globally:

```

```

---

⚙️ Full Configuration Reference
-------------------------------

[](#️-full-configuration-reference)

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

return [
    'options' => [
        'closeButton'       => true,
        'positionClass'     => 'toast-top-end',
        'preventDuplicates' => false,
        'showDuration'      => 300,
        'timeOut'           => 5000,
        'theme'             => 'default', // default, material, ios, glassmorphism, neon, minimal, neumorphism
        'gradient_enable'   => false,
        'color_mode'        => false,
        'pauseOnHover'      => true, // Pause the auto-dismiss timer while hovering a toast
        'animation'         => 'default', // default, slide, fade, pop, bounce
    ],
    'livewire_enabled'  => false,
    'livewire_version'  => 'v3',
];
```

---

🔒 Security
----------

[](#-security)

**Custom button links** (`customBtnLink`) are validated before being rendered into `href` attributes. Only URLs starting with `http://`, `https://`, `/`, or `#` are allowed; all other values are safely replaced with `#`.

**Message content is rendered as HTML.** The toast heading and description are inserted into the DOM as HTML — this is what enables multi-line messages (newlines become ``). Because of this, **you should never pass unescaped, user-supplied input directly into a toast**, as it can introduce a cross-site scripting (XSS) vulnerability. If a value may contain user input, escape it first — for example with Laravel's `e()` helper or `strip_tags()`:

```
ToastMagic::success('Welcome, ' . e($user->name) . '!');
```

> **Roadmap:** A future major release (v3.0.0) will escape message content by default, with an opt-in flag for cases where HTML is intentional.

---

📝 Changelog
-----------

[](#-changelog)

See [CHANGELOG.md](CHANGELOG.md) for a list of notable changes in each release.

---

🤝 Contributing
--------------

[](#-contributing)

Contributions are welcome! Please fork the repository, make your changes, and open a pull request. For bug reports or feature requests, [open an issue on GitHub](https://github.com/devrabiul/laravel-toaster-magic/issues).

---

📄 License
---------

[](#-license)

This package is open-source software licensed under the [MIT License](LICENSE).

---

🌱 Treeware
----------

[](#-treeware)

This package is [Treeware](https://treeware.earth). If you use it in production, we ask that you [**buy the world a tree**](https://plant.treeware.earth/devrabiul/laravel-toaster-magic) to thank us for our work. By contributing to the Treeware forest you'll be creating employment for local families and restoring wildlife habitats.

---

📬 Contact &amp; Links
---------------------

[](#-contact--links)

- 🔗 **GitHub:** [devrabiul/laravel-toaster-magic](https://github.com/devrabiul/laravel-toaster-magic)
- 🔗 **Live Demo:** [laravel-toaster-magic.rixetbd.com](https://laravel-toaster-magic.rixetbd.com)
- 🔗 **Packagist:** [packagist.org/packages/devrabiul/laravel-toaster-magic](https://packagist.org/packages/devrabiul/laravel-toaster-magic)
- 📧 **Email:**

###  Health Score

56

—

FairBetter than 97% of packages

Maintenance92

Actively maintained with recent releases

Popularity50

Moderate usage in the ecosystem

Community18

Small or concentrated contributor base

Maturity51

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 60% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~31 days

Recently: every ~40 days

Total

15

Last Release

61d ago

Major Versions

v1.6 → v2.02026-01-19

### Community

Maintainers

![](https://www.gravatar.com/avatar/9eaf28cb5d9d5d87660cbe335e7b82a08bc7801a40556c3a99740e22282d9e17?d=identicon)[devrabiul](/maintainers/devrabiul)

---

Top Contributors

[![devrabiul](https://avatars.githubusercontent.com/u/112581088?v=4)](https://github.com/devrabiul "devrabiul (69 commits)")[![rabiul6am](https://avatars.githubusercontent.com/u/128285760?v=4)](https://github.com/rabiul6am "rabiul6am (46 commits)")

---

Tags

laravel-toaster-magiclivewirelivewire-toastertoaster-magictoaster-magic-prophplaravelnotificationslivewiretoastrmagicflash-notificationstoasterdynamic-notificationslaravel-toastrlivewire-toaster

###  Code Quality

TestsPest

### Embed Badge

![Health badge](/badges/devrabiul-laravel-toaster-magic/health.svg)

```
[![Health](https://phpackages.com/badges/devrabiul-laravel-toaster-magic/health.svg)](https://phpackages.com/packages/devrabiul-laravel-toaster-magic)
```

###  Alternatives

[propaganistas/laravel-disposable-email

Disposable email validator

6023.2M7](/packages/propaganistas-laravel-disposable-email)[php-flasher/flasher-laravel

Seamlessly integrate flash notifications into your Laravel applications with PHPFlasher. Enhance user feedback and engagement with minimal setup.

443.0M45](/packages/php-flasher-flasher-laravel)[php-flasher/flasher-toastr-laravel

Leverage Toastr for stylish toast notifications in Laravel with PHPFlasher. Add Toastr's sleek notifications to your Laravel projects effortlessly.

31640.4k5](/packages/php-flasher-flasher-toastr-laravel)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
