Tall Toast is an elegant & beautiful toast notification library for laravel. A Toast global that can be called from the backend (via Controllers, Blade Views, Components) or frontend (JS, Alpine Components) to render customizable toasts

Why choose Tall Toast

If you are building a web app with the TALL stack, you must choose this library over the other outdated libraries available:

Size does matter

Since the frontend is a pure AlpineJS component with no reliance on external JS libs, and since the backend handles most of the logic, the javascript footprint is tiny (less than ONE kilobyte!).

The CSS footprint is also negligible as it uses the default TailwindCSS classes. Even if you override the default views, you will rest assured that Tailwind’s purging will only keep the styles/classes you have used.

In plain English, it will not bloat your generated JS/CSS files nor add extra files to download as when using other JS libs!

Takes advantage of all the niceties that come with TALL

You can call it from anywhere! Memorize Toast for the frontend and toast() for the backend.

See the usage section for examples.

Customizable

You have control over the view: As you are overriding the blade view, you’ll be able to shape it as you like using TailwindCSS classes.

No more messing with custom CSS overrides!

Usage

From The Frontend

Toast.info('Notification from the front-end...', 'The Title');

Toast.success('A toast without a title also works');

Toast.warning('Watch out!');

Toast.danger('I warned you!', 'Yikes');

Toast.debug('I will NOT show in production! Locally, I will also log in console...', 'A Debug Message');

From The Backend

toast()
    ->info('I will appear only on the next page!')
    ->pushOnNextPage();

toast()
    ->info('Notification from the backend...', 'The Title')
    ->push();

toast()
    ->success('A toast without a title also works')
    ->push();

toast()
    ->warning('Watch out!')
    ->push();

toast()
    ->danger('I warned you!', 'Yikes')
    ->push();

toast()
    ->danger('I will go…<br><i>to the next line ?</i>', 'I am <span style="color:red;">HOT</span>')
    ->doNotSanitize()
    ->push();

toast()
    ->debug('I will NOT show in production! Locally, I will also log in console...', 'A Debug Message')
    ->push();

// debug also accepts objects as message
toast()
    ->debug(User::factory()->createOne()->only(['name', 'email']), 'A User Dump')
    ->push();

You can call the above toast helper from controllers, blade views, and components.

To properly call it from inside livewire components, add the trait:

use Livewire\Component;
use Usernotnull\Toast\Concerns\WireToast;

class DemoComponent extends Component
{
    use WireToast; // <-- add this

    public function sendCookie(): void
    {
        toast()
            ->success('You earned a cookie! ?')
            ->pushOnNextPage();

        redirect()->route('dashboard');
    }

For more details about setup and installation, please visit Github.