DEV Community

waziri ally amiri
waziri ally amiri

Posted on

Waziri Livewire Toast: A Package to Display Toast Notifications in Laravel

Waziri Livewire Toast is a Laravel package that makes it easy to display toast notifications in your Livewire applications. It is based on the TALL Stack, which means that it uses Tailwind CSS, Alpine.js, and Livewire.

Requirements

To use Livewire Toast, you will need to have the following installed:

  • Livewire
  • TailwindCSS
  • Alpine.js

Installation

To install Livewire Toast, run the following command:

composer require waziri123/waziri-livewire-toast:dev-master

Enter fullscreen mode Exit fullscreen mode

Once Livewire Toast is installed, you need to publish the configuration files and views:

php artisan vendor:publish --tag=config
php artisan vendor:publish --tag=views

Enter fullscreen mode Exit fullscreen mode

Usage

To use Livewire Toast, simply add the following component to your app layout:

@livewire('livewire-toast')

Enter fullscreen mode Exit fullscreen mode

Once you have added the component to your app layout, you can start displaying toast notifications by calling the following methods from your Livewire components, controllers, or views:

Livewire::emitTo('livewire-toast', 'show', 'Project Added Successfully'); // Will show a success message
Livewire::emitTo('livewire-toast', 'showError', 'There was an Error!'); // Will show an error message

// You can also specify the type and message of the toast notification as an array:
Livewire::emitTo('livewire-toast', 'show', ['type' => 'warning', 'message' => 'This is a warning!']);

Enter fullscreen mode Exit fullscreen mode

Configurations

Livewire Toast comes with a number of configuration options that you can customize to meet your needs. To view the configuration options, open the config/livewire-toast.php file.

Troubleshooting

If you are having trouble getting Livewire Toast to work, please check the following:

  • Make sure that Livewire, Tailwind CSS, and Alpine.js are installed and configured correctly.
  • Make sure that you have published the Livewire Toast configuration files and views.
  • If you are using Tailwind CSS, make sure that you have purged your CSS.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Credits

  • Waziri123

  • AscSoftwares

License

Livewire Toast is licensed under the MIT license.

Top comments (0)