PHPackages                             kevsuarez/livewire-notiflix - 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. [Utility & Helpers](/categories/utility)
4. /
5. kevsuarez/livewire-notiflix

ActiveLibrary[Utility & Helpers](/categories/utility)

kevsuarez/livewire-notiflix
===========================

Notiflix Wrapper for Livewire

v1.0.0(4y ago)39MITPHPPHP ^7.2|^8.0

Since Jul 12Pushed 4y ago1 watchersCompare

[ Source](https://github.com/kevsuarez/livewire-notiflix)[ Packagist](https://packagist.org/packages/kevsuarez/livewire-notiflix)[ Docs](https://github.com/kevsuarez/livewire-notiflix)[ RSS](/packages/kevsuarez-livewire-notiflix/feed)WikiDiscussions main Synced 1mo ago

READMEChangelogDependencies (4)Versions (2)Used By (0)

Livewire Notiflix
=================

[](#livewire-notiflix)

This package provides the non-blocking notifications and pop-up boxes utilities for your **livewire** components.
Currently using [**notiflix**](https://www.notiflix.com) library under the hood. You can now use your favorite [**notiflix**](https://www.notiflix.com) library without writing any custom Javascript.

Installation
------------

[](#installation)

You can install the package via composer:

```
composer require kevsuarez/livewire-notiflix
```

Requirements
------------

[](#requirements)

This package uses [**`livewire/livewire`**](https://laravel-livewire.com) under the hood. Please make sure you include it in your dependencies before using this package.

- [**PHP v7.2 or higher**](https://www.php.net/)
- [**Laravel v7 or v8**](https://www.laravel.com)
- [**Livewire v2**](https://www.laravel-livewire.com)
- [**Notiflix**](https://www.notiflix.com)

Register Service Provider
-------------------------

[](#register-service-provider)

The service provider will automatically get registered. Or you may manually add the service provider in your `config/app.php` file:

```
'providers' => [
    // ...
    Kevsuarez\LivewireNotiflix\LivewireNotiflixServiceProvider::class,
];
```

Publish Config File
-------------------

[](#publish-config-file)

This package publishes a `config/livewire-notiflix.php` file:

```
php artisan vendor:publish --provider="Kevsuarez\LivewireNotiflix\LivewireNotiflixServiceProvider" --tag="config"
```

Usage
-----

[](#usage)

Insert [**notiflix**](https://www.notiflix.com) and livewire notiflix scripts directive after livewire scripts directive.

> **NOTE: Notiflix script is not included by default so make sure you include it before @livewireNotiflixScripts**

```

    ...
    @livewireScripts
    ...

    ...
    @livewireNotiflixScripts
    ...

```

---

### `1` : `Notify`

[](#1--notify)

#### Params

[](#params)

```
/*
* @param1 {String}: Optional, type text in String format.
*   -> Supported values:
*       • success
*       • info
*       • warning
*       • error
*       • failure
*
*   -> Default value: 'success'
*
* @param2 {String}: Optional, message text in String format.
*   -> Default value: 'Message'
*
* @param3 {Array}: Optional, extend the initialize options with new options and the callback for each notification element.
*   -> Default value: []
*
* @param4 {Bool}: Optional, enable the callback that is triggered when the notification element has been clicked.
    -> Default value: false
*/
```

#### Example

[](#example)

```
public function triggerNotify()
{
    $type        = 'success';
    $message     = 'Hello World!';
    $options     = [];
    $useCallback = false;

    $this->notify($type, $message, $options, $useCallback);
}
```

#### Using Callback

[](#using-callback)

First, setup your action method for onNotifyClick callback. Of course you can name your method anything you want.

```
public function onNotifyClick()
{
    $this->notify(
        'success',
        'Thanks! consider giving it a star on github.',
    );
}
```

Make sure you register onNotifyClick method as event listeners. See: [**Events | Laravel Livewire**](https://laravel-livewire.com/docs/2.x/events) for more information about event listeners.

```
protected $listeners = [
    'onNotifyClick',
    ...
];
```

Finally, create an action method that triggers the notify box with onNotifyClick callback pointed to the event listeners you registered.

```
public function triggerNotify()
{
    $type        = 'info';
    $message     = 'Click Me';
    $options     = [];
    $useCallback = true;

    $this->notify($type, $message, $options, $useCallback);
}
```

---

### `2` : `Alert (Report)`

[](#2--alert-report)

#### Params

[](#params-1)

```
/*
* @param1 {String}: Optional, type text in String format.
*   -> Supported values:
*       • success
*       • info
*       • warning
*       • error
*       • failure
*
*   -> Default value: 'success'
*
* @param2 {String}: Optional, title text in String format.
*   -> Default value: 'Title'
*
* @param3 {String}: Optional, message text in String format.
*   -> Default value: 'Message'
*
* @param4 {String}: Optional, button text in String format.
*   -> Default value: 'Okay'
*
* @param5 {Array}: Optional, extend the initialize options with new options and the callback for each element.
*   -> Default value: []
*
* @param6 {Bool}: Optional, enable the callback that is triggered when the 'Okay' button has been clicked.
*   -> Default value: false
*/
```

#### Example

[](#example-1)

```
public function triggerAlert()
{
    $type        = 'success';
    $title       = 'Success!';
    $message     = 'Place you success message here!';
    $buttonText  = 'Okay';
    $options     = [];
    $useCallback = false;

    $this->alert($type, $title, $message, $buttonText, $options, $useCallback);
}
```

#### Using Callback

[](#using-callback-1)

First, setup your action method for onAlertClick callback. Of course you can name your method anything you want.

```
public function onAlertClick()
{
    $this->alert(
        'success',
        'Good job!',
        'You clicked the button!.'
    );
}
```

Make sure you register onAlertClick method as event listeners. See: [**Events | Laravel Livewire**](https://laravel-livewire.com/docs/2.x/events) for more information about event listeners.

```
protected $listeners = [
    'onAlertClick',
    ...
];
```

Finally, create an action method that triggers the alert box with onAlertClick callback pointed to the event listeners you registered.

```
public function triggerAlert()
{
    $type        = 'info';
    $title       = 'Hi!';
    $message     = 'Press Ok button to continue.';
    $buttonText  = 'Ok';
    $options     = [];
    $useCallback = true;

    $this->alert($type, $title, $message, $buttonText, $options, $useCallback);
}
```

---

### `3` : `Flash`

[](#3--flash)

#### Params

[](#params-2)

```
/*
* @param1 {String}: Optional, mode text in String format.
*   -> Supported values:
*       • notify
*       • alert
*
*   -> Default value: 'notify'
*
* @param2 {Array}: Optional, arguments in Array format.
*   -> Supports all "notify or alert" arguments as an associative array.
*
*   -> Default value: All "notify" arguments as an associative array.
*/
```

#### Example

[](#example-2)

```
public function triggerFlash()
{
    //Mode: notify
    $this->flash('notify', [
        'type'        => 'success',
        'message'     => 'Hello World!',
        'options'     => [],
        'useCallback' => false,
    ]);

    //Or

    //Mode: alert
    $this->flash('alert', [
        'type'        => 'success',
        'title'       => 'Success!',
        'message'     => 'Place you success message here!',
        'buttonText'  => 'Okay',
        'options'     => [],
        'useCallback' => false,
    ]);
}
```

> **NOTE: Callback is enabled for both modes.**

---

### `4` : `Confirm`

[](#4--confirm)

#### Params

[](#params-3)

```
/*
* @param1 {String}: Optional, title text in String format.
*   -> Default value: 'Title'
*
* @param2 {String}: Optional, message text in String format.
*   -> Default value: 'Message'
*
* @param3 {String}: Optional, confirm button text in String format.
*   -> Default value: 'Confirm'
*
* @param4 {String}: Optional, cancel button text in String format.
*   -> Default value: 'Cancel'
*
* @param5 {Array}: Optional, extend the initialize options with new options and the callbacks for each confirm box.
*   -> Default value: []
*/
```

#### Example

[](#example-3)

First, setup your action methods for confirmed and cancelled (optional) callback. Of course you can name your methods anything you want.

```
public function confirmed($params)
{
    $this->notify(
        'success',
        'Thanks! consider giving it a star on github.'
    );
}

public function cancelled()
{
    $this->notify(
        'info',
        'Understood',
    );
}
```

Make sure you register onConfirmed and onCancelled methods as event listeners. See: [**Events | Laravel Livewire**](https://laravel-livewire.com/docs/2.x/events) for more information about event listeners.

```
protected $listeners = [
    'onConfirmed' => 'confirmed',
    'onCancelled' => 'cancelled'
    ...
];
```

Finally, create an action method that triggers the confirmation box with onConfirmed and onCancelled callbacks pointed to the event listeners you registered.

```
public function triggerConfirm()
{
    $title             = 'Livewire Notiflix';
    $message           = 'Do you love Livewire Notiflix?';
    $confirmButtonText = 'Yes';
    $cancelButtonText  = 'Nope';
    $options           = [
        'onConfirmed' => 'onConfirmed',
        'onCancelled' => 'onCancelled',

        //You can pass the value as an argument to the confirm method, if you want.
        'params'      => 'Thanks! for choose Livewire Notiflix.',
    ];

    $this->confirm($title, $message, $confirmButtonText, $cancelButtonText, $options);
}
```

---

### `5` : `Ask`

[](#5--ask)

#### Params

[](#params-4)

```
/*
* @param1 {String}: Optional, title text in String format.
*   -> Default value: 'Title'
*
* @param2 {String}: Optional, question text in String format.
*   -> Default value: 'Question'
*
* @param3 {String}: Optional, answer text in String format.
*   -> Default value: 'Answer'
*
* @param4 {String}: Optional, answer button text in String format.
*   -> Default value: 'Answer'
*
* @param5 {String}: Optional, cancel button text in String format.
*   -> Default value: 'Cancel'
*
* @param6 {Array}: Optional, extend the initialize options with new options and the callbacks for each confirm box.
*   -> Default value: []
*/
```

#### Example

[](#example-4)

First, setup your action methods for onAskConfirmed and onAskCancelled (optional) callback. Of course you can name your methods anything you want.

```
public function onAskConfirmed($params)
{
    $this->notify(
        'success',
        'Thanks! consider giving it a star on github.'
    );
}

public function onAskCancelled()
{
    $this->notify(
        'info',
        'Understood',
    );
}
```

Make sure you register onAskConfirmed and onAskCancelled methods as event listeners. See: [**Events | Laravel Livewire**](https://laravel-livewire.com/docs/2.x/events) for more information about event listeners.

```
protected $listeners = [
    'onAskConfirmed',
    'onAskCancelled',
    ...
];
```

Finally, create an action method that triggers the confirmation box with onAskConfirmed and onAskCancelled callbacks pointed to the event listeners you registered.

```
public function triggerAsk()
{
    $title             = 'Livewire Notiflix';
    $question          = 'Do you love Livewire Notiflix?';
    $answer            = 'Yes';
    $answerButtonText  = 'Answer';
    $cancelButtonText  = 'Cancel';
    $options           = [
        'onAskConfirmed' => 'onAskConfirmed',
        'onAskCancelled' => 'onAskCancelled',

        //You can pass the value as an argument to the onAskConfirmed method, if you want.
        'params'         => 'Thanks! for choose Livewire Notiflix.',
    ];

    $this->ask($title, $question, $answer, $answerButtonText, $cancelButtonText, $options);
}
```

---

Testing
-------

[](#testing)

```
composer test
```

Changelog
---------

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.

Contributing
------------

[](#contributing)

Please see [CONTRIBUTING](CONTRIBUTING.md) for details.

Security
--------

[](#security)

If you discover any security related issues, please email  instead of using the issue tracker.

Credits
-------

[](#credits)

- [Kevin Suárez](https://github.com/kevsuarez)
- [All Contributors](../../contributors)

Copyright
---------

[](#copyright)

Copyright © Kevin Suárez

License
-------

[](#license)

Livewire Notiflix is open-sourced software licensed under the [MIT license](LICENSE).

###  Health Score

25

—

LowBetter than 37% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity8

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity56

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% 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

Unknown

Total

1

Last Release

1765d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/832b58dfa3774133e8155266a38770cf38539304bc2c35d51e009db1da8cc49e?d=identicon)[kevsuarez](/maintainers/kevsuarez)

---

Top Contributors

[![kevsuarez](https://avatars.githubusercontent.com/u/48132211?v=4)](https://github.com/kevsuarez "kevsuarez (4 commits)")

---

Tags

livewire-notiflixkevsuarez

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/kevsuarez-livewire-notiflix/health.svg)

```
[![Health](https://phpackages.com/badges/kevsuarez-livewire-notiflix/health.svg)](https://phpackages.com/packages/kevsuarez-livewire-notiflix)
```

###  Alternatives

[livewire/flux

The official UI component library for Livewire.

9385.0M86](/packages/livewire-flux)[jantinnerezo/livewire-alert

This package provides a simple alert utilities for your livewire components.

8041.2M20](/packages/jantinnerezo-livewire-alert)[spatie/laravel-livewire-wizard

Build wizards using Livewire

4061.0M4](/packages/spatie-laravel-livewire-wizard)[kirschbaum-development/commentions

A package to allow you to create comments, tag users and more

12369.2k](/packages/kirschbaum-development-commentions)[revolution/self-ordering

Self Ordering System

2112.7k](/packages/revolution-self-ordering)[joelwmale/livewire-quill

Easily add QuillJS with image support to any Laravel Livewire component.

1314.0k](/packages/joelwmale-livewire-quill)

PHPackages © 2026

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