├── .styleci.yml ├── screenshots ├── livewire-notifier.jpg └── livewire-notifier-basic.jpg ├── .gitignore ├── resources └── views │ ├── livewire │ ├── notifier.blade.php │ └── notifier-message.blade.php │ └── icons │ ├── error.blade.php │ ├── info.blade.php │ └── success.blade.php ├── tests ├── Feature │ └── Console │ │ └── Commands │ │ └── LivewireNotifierInstallTest.php ├── TestCase.php ├── Unit │ └── NotifierLivewireComponentTest.php └── Pest.php ├── changelog.md ├── license.md ├── contributing.md ├── phpunit.xml ├── .github └── workflows │ └── run-tests.yml ├── composer.json ├── src ├── Http │ └── Livewire │ │ ├── Notifier.php │ │ └── NotifierMessage.php ├── Console │ └── Commands │ │ └── LivewireNotifierInstall.php └── LivewireNotifierServiceProvider.php ├── config └── livewire-notifier.php └── readme.md /.styleci.yml: -------------------------------------------------------------------------------- 1 | preset: laravel -------------------------------------------------------------------------------- /screenshots/livewire-notifier.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codespb/livewire-notifier/HEAD/screenshots/livewire-notifier.jpg -------------------------------------------------------------------------------- /screenshots/livewire-notifier-basic.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codespb/livewire-notifier/HEAD/screenshots/livewire-notifier-basic.jpg -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | /public/hot 3 | /public/storage 4 | /storage/*.key 5 | /vendor 6 | .env 7 | .env.backup 8 | .phpunit.result.cache 9 | docker-compose.override.yml 10 | Homestead.json 11 | Homestead.yaml 12 | npm-debug.log 13 | yarn-error.log 14 | .DS_Store -------------------------------------------------------------------------------- /resources/views/livewire/notifier.blade.php: -------------------------------------------------------------------------------- 1 |
2 | @foreach ($messages as $message) 3 | 4 | @endforeach 5 |
6 | -------------------------------------------------------------------------------- /tests/Feature/Console/Commands/LivewireNotifierInstallTest.php: -------------------------------------------------------------------------------- 1 | artisan('livewire-notifier:install'); 5 | // $artisan->expectsOutput("Livewire Notifier is installed"); 6 | $artisan->assertExitCode(1); 7 | 8 | }); 9 | -------------------------------------------------------------------------------- /changelog.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | All notable changes to `LaravelLivewireNotifier` will be documented in this file. 4 | 5 | ## 1.0.3 2021-13-04 6 | - **Changed** Readme update. 7 | - **Changed** Update installation command. 8 | 9 | ## 1.0.2 2021-10-04 10 | ### Added 11 | - Screenshots for README 12 | - Changelog 13 | ### Changed 14 | - README. Add requirements and installation instructions. 15 | ### Removed 16 | - Delete unused boilerplate code. 17 | 18 | ## 1.0.1 2021-10-04 19 | ### Added 20 | - Badges to readme 21 | ### Fixed 22 | - Install command for proper tuning `tailwind.config.js` / add extra path for purging -------------------------------------------------------------------------------- /resources/views/icons/error.blade.php: -------------------------------------------------------------------------------- 1 | 3 | 5 | 7 | 9 | 10 | -------------------------------------------------------------------------------- /resources/views/icons/info.blade.php: -------------------------------------------------------------------------------- 1 | 3 | 5 | 7 | 9 | 10 | -------------------------------------------------------------------------------- /resources/views/icons/success.blade.php: -------------------------------------------------------------------------------- 1 | 3 | 5 | 7 | 9 | 10 | -------------------------------------------------------------------------------- /license.md: -------------------------------------------------------------------------------- 1 | # MIT License 2 | 3 | ## Copyright (c) 2021 CodeSPB 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /contributing.md: -------------------------------------------------------------------------------- 1 | # Contributing 2 | 3 | Contributions are welcome and will be fully credited. 4 | 5 | Contributions are accepted via Pull Requests on [Github](https://github.com/codespb/laravel-livewire-notifier). 6 | 7 | # Things you could do 8 | If you want to contribute but do not know where to start, this list provides some starting points. 9 | - Add license text 10 | - Set up TravisCI, StyleCI, ScrutinizerCI 11 | - Write a comprehensive ReadMe 12 | 13 | ## Pull Requests 14 | 15 | - **Add tests!** - Your patch won't be accepted if it doesn't have tests. 16 | 17 | - **Document any change in behaviour** - Make sure the `readme.md` and any other relevant documentation are kept up-to-date. 18 | 19 | - **Consider our release cycle** - We try to follow [SemVer v2.0.0](http://semver.org/). Randomly breaking public APIs is not an option. 20 | 21 | - **One pull request per feature** - If you want to do more than one thing, send multiple pull requests. 22 | 23 | - **Send coherent history** - Make sure each individual commit in your pull request is meaningful. If you had to make multiple intermediate commits while developing, please [squash them](http://www.git-scm.com/book/en/v2/Git-Tools-Rewriting-History#Changing-Multiple-Commit-Messages) before submitting. 24 | 25 | 26 | **Happy coding**! 27 | -------------------------------------------------------------------------------- /phpunit.xml: -------------------------------------------------------------------------------- 1 | 2 | 16 | 17 | 18 | src/ 19 | 20 | 21 | 22 | 23 | ./tests/Unit 24 | 25 | 26 | ./tests/Feature 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | -------------------------------------------------------------------------------- /.github/workflows/run-tests.yml: -------------------------------------------------------------------------------- 1 | name: run-tests 2 | 3 | on: 4 | push: 5 | branches: [main] 6 | pull_request: 7 | branches: [main] 8 | 9 | jobs: 10 | test: 11 | runs-on: ${{ matrix.os }} 12 | strategy: 13 | fail-fast: true 14 | matrix: 15 | os: [ubuntu-latest] 16 | php: [7.4,8.0] 17 | laravel: [8.*] 18 | stability: [prefer-stable] 19 | include: 20 | - laravel: 8.* 21 | testbench: ^6.6 22 | 23 | name: P${{ matrix.php }} - L${{ matrix.laravel }} - ${{ matrix.stability }} - ${{ matrix.os }} 24 | 25 | steps: 26 | - name: Checkout code 27 | uses: actions/checkout@v2 28 | 29 | - name: Setup PHP 30 | uses: shivammathur/setup-php@v2 31 | with: 32 | php-version: ${{ matrix.php }} 33 | extensions: dom, curl, libxml, mbstring, zip, pcntl, pdo, sqlite, pdo_sqlite, bcmath, soap, intl, gd, exif, iconv, imagick, fileinfo 34 | coverage: none 35 | 36 | - name: Setup problem matchers 37 | run: | 38 | echo "::add-matcher::${{ runner.tool_cache }}/php.json" 39 | echo "::add-matcher::${{ runner.tool_cache }}/phpunit.json" 40 | 41 | - name: Install dependencies 42 | run: | 43 | composer require "laravel/framework:${{ matrix.laravel }}" "orchestra/testbench:${{ matrix.testbench }}" --no-interaction --no-update 44 | composer update --${{ matrix.stability }} --prefer-dist --no-interaction 45 | 46 | - name: Execute tests 47 | run: vendor/bin/pest 48 | -------------------------------------------------------------------------------- /tests/TestCase.php: -------------------------------------------------------------------------------- 1 | 'CodeSPB\\LivewireNotifier\\Database\\Factories\\'.class_basename($modelName).'Factory' 18 | // ); 19 | // $this->viewsDirectory = __DIR__.'/views'; 20 | } 21 | 22 | protected function getPackageProviders($app) 23 | { 24 | return [ 25 | LivewireNotifierServiceProvider::class, 26 | LivewireServiceProvider::class 27 | ]; 28 | } 29 | // protected function overrideApplicationProviders($app) 30 | // { 31 | // return [ 32 | // 'Livewire' => 'Livewire\Livewire', 33 | // ]; 34 | // } 35 | public function getEnvironmentSetUp($app) 36 | { 37 | $app['config']->set('database.default', 'sqlite'); 38 | $app['config']->set('database.connections.sqlite', [ 39 | 'driver' => 'sqlite', 40 | 'database' => ':memory:', 41 | 'prefix' => '', 42 | ]); 43 | 44 | /* 45 | include_once __DIR__.'/../database/migrations/create_livewire_notifier_table.php.stub'; 46 | (new \CreatePackageTable())->up(); 47 | */ 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /composer.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "codespb/livewire-notifier", 3 | "description": "Simple Livewire notifications system without any dependencies except TALL-stack.", 4 | "license": "MIT", 5 | "version": "1.0.3", 6 | "authors": [ 7 | { 8 | "name": "Dmitriy Belyaev", 9 | "email": "db@codespb.com", 10 | "homepage": "https://codespb.com" 11 | } 12 | ], 13 | "homepage": "https://github.com/codespb/livewire-notifier", 14 | "keywords": ["Laravel", "LivewireNotifier","Toast","Growl","Livewire"], 15 | "require": { 16 | "illuminate/support": "~7|~8" 17 | }, 18 | "require-dev": { 19 | "phpunit/phpunit": "^9.5", 20 | "orchestra/testbench": "^6.0", 21 | "livewire/livewire": "^2.4", 22 | "pestphp/pest": "^1.0", 23 | "pestphp/pest-plugin-laravel": "^1.0", 24 | "pestphp/pest-plugin-livewire": "^1.0", 25 | "orchestra/canvas": "^6.1", 26 | "nunomaduro/collision": "^5.3" 27 | }, 28 | "autoload": { 29 | "psr-4": { 30 | "CodeSPB\\LivewireNotifier\\": "src/" 31 | } 32 | }, 33 | "autoload-dev": { 34 | "psr-4": { 35 | "CodeSPB\\LivewireNotifier\\Tests\\": "tests" 36 | } 37 | }, 38 | "extra": { 39 | "laravel": { 40 | "providers": [ 41 | "CodeSPB\\LivewireNotifier\\LivewireNotifierServiceProvider" 42 | ], 43 | "aliases": { 44 | "LivewireNotifier": "CodeSPB\\LivewireNotifier\\Facades\\LaravelLivewireNotifier" 45 | } 46 | } 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /tests/Unit/NotifierLivewireComponentTest.php: -------------------------------------------------------------------------------- 1 | message = [ 9 | 'text' => "Let's have fun!" 10 | ]; 11 | $this->messageFromMessageBag = [ 12 | 'text' => "Let's have fun!", 13 | 'title' => '', 14 | 'icon' => '', 15 | 'type' => 'success' 16 | ]; 17 | }); 18 | // it('accepts message argument', function () { 19 | // livewire(Notifier::class)->set('message',$this->message)->assertSet('message',$this->message); 20 | // }); 21 | it('adds message to message bag received as an argument',function(){ 22 | $livewire = livewire(Notifier::class,['message'=>$this->message]); 23 | $this->assertCount(1,$livewire->messages); 24 | }); 25 | it('adds message to message bag by calling addMsg action',function(){ 26 | $livewire = livewire(Notifier::class)->call('addMsg',$this->message); 27 | $this->assertCount(1,$livewire->messages); 28 | $this->assertEquals($this->messageFromMessageBag,$livewire->messages->pop()); 29 | }); 30 | it('grab message from session',function(){ 31 | session()->flash('notifier',$this->message); 32 | $livewire = livewire(Notifier::class); 33 | $this->assertCount(1,$livewire->messages); 34 | }); 35 | it('reacts on "notifier" event',function(){ 36 | $this->message = [ 37 | 'text' => "Let's have fun!" 38 | ]; 39 | $livewire = livewire(Notifier::class); 40 | $livewire->emit('message',$this->message); 41 | $this->assertCount(1,$livewire->messages); 42 | }); 43 | -------------------------------------------------------------------------------- /tests/Pest.php: -------------------------------------------------------------------------------- 1 | in(__DIR__); 14 | /* 15 | |-------------------------------------------------------------------------- 16 | | Expectations 17 | |-------------------------------------------------------------------------- 18 | | 19 | | When you're writing tests, you often need to check that values meet certain conditions. The 20 | | "expect()" function gives you access to a set of "expectations" methods that you can use 21 | | to assert different things. Of course, you may extend the Expectation API at any time. 22 | | 23 | */ 24 | 25 | // expect()->extend('toBeOne', function () { 26 | // return $this->toBe(1); 27 | // }); 28 | 29 | /* 30 | |-------------------------------------------------------------------------- 31 | | Functions 32 | |-------------------------------------------------------------------------- 33 | | 34 | | While Pest is very powerful out-of-the-box, you may have some testing code specific to your 35 | | project that you don't want to repeat in every file. Here you can also expose helpers as 36 | | global functions to help you to reduce the number of lines of code in your test files. 37 | | 38 | */ 39 | 40 | // function something() 41 | // { 42 | // // .. 43 | // } 44 | -------------------------------------------------------------------------------- /src/Http/Livewire/Notifier.php: -------------------------------------------------------------------------------- 1 | 'addMsg', 26 | 'render' => 'render' 27 | ]; 28 | /** 29 | * Catch session messages in the constructor 30 | * 31 | * @return void 32 | */ 33 | public function mount() 34 | { 35 | $this->messages = collect($this->messages); 36 | $this->message && $this->addMsg($this->message); 37 | $this->reset('message'); 38 | if ($msg = session('notifier')) { 39 | $this->addMsg($msg); 40 | } 41 | $this->duration = $this->duration ?? config('livewire-notifier.duration'); 42 | } 43 | /** 44 | * Add message to messages bag. 45 | * 46 | * @param mixed $options 47 | * @return void 48 | */ 49 | public function addMsg($message) 50 | { 51 | if (!is_array($message) && $json = json_decode($message)) { 52 | $message = $json; 53 | } elseif (is_string($message)) { 54 | $message = ['text'=>$message]; 55 | } 56 | $message = array_merge([ 57 | 'text'=>'', 58 | 'title' => '', 59 | 'icon' => '', 60 | 'type' => 'success', 61 | ], $message); 62 | $this->messages->push($message); 63 | } 64 | 65 | public function render() 66 | { 67 | return view('livewire-notifier::livewire.notifier'); 68 | } 69 | } 70 | -------------------------------------------------------------------------------- /src/Http/Livewire/NotifierMessage.php: -------------------------------------------------------------------------------- 1 | duration = $this->duration ?? config('livewire-notifier.duration'); 38 | $this->closable = $this->closable ?? config('livewire-notifier.closable'); 39 | $this->msgClass = $this->msgClass ?? config('livewire-notifier.types.' . ($this->message['type'] ?? 'default') . '.msgClass',config('livewire-notifier.types.default.msgClass')); 40 | $this->progressClass = $this->progressClass ?? config('livewire-notifier.types.' . ($this->message['type'] ?? 'default') . '.progressClass',config('livewire-notifier.types.default.progressClass')); 41 | } 42 | 43 | public function render() 44 | { 45 | $this->message = array_merge([ 46 | 'text'=>'', 47 | 'title' => '', 48 | 'icon' => '', 49 | 'type' => 'success', 50 | 'duration' => $this->duration, 51 | 'msgClass' => $this->msgClass, 52 | 'progressClass' => $this->progressClass, 53 | 'closable' => $this->closable, 54 | ], $this->message); 55 | return view('livewire-notifier::livewire.notifier-message'); 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /config/livewire-notifier.php: -------------------------------------------------------------------------------- 1 | 'absolute top-0 right-0', 4 | 'defaultMsgClass' => 'w-80 rounded-xl shadow-xl', 5 | 'duration' => 5000, 6 | 'types' => [ 7 | 'success' => [ 8 | // 'msgClass'=>'bg-green-200', 9 | 'msgClass'=>'bg-gradient-to-r from-green-200 to-green-300', 10 | 'progressClass' => 'bg-green-500', 11 | 'icon' => 'livewire-notifier::icons.success', 12 | ], 13 | 'error' => [ 14 | // 'msgClass'=>'bg-red-200', 15 | 'msgClass'=>'bg-gradient-to-r from-red-200 to-red-300', 16 | 'progressClass' => 'bg-red-500', 17 | 'icon' => 'livewire-notifier::icons.error', 18 | ], 19 | 'fail' => [ 20 | // 'msgClass'=>'bg-red-200', 21 | 'msgClass'=>'bg-gradient-to-r from-red-200 to-red-300', 22 | 'progressClass' => 'bg-red-500', 23 | 'icon' => 'livewire-notifier::icons.error', 24 | ], 25 | 'warning' => [ 26 | // 'msgClass'=>'bg-yellow-200', 27 | 'msgClass'=>'bg-gradient-to-r from-yellow-200 to-yellow-300', 28 | 'progressClass' => 'bg-yellow-500', 29 | 'icon' => 'livewire-notifier::icons.error', 30 | ], 31 | 'warn' => [ 32 | // 'msgClass'=>'bg-yellow-200', 33 | 'msgClass'=>'bg-gradient-to-r from-yellow-200 to-yellow-300', 34 | 'progressClass' => 'bg-yellow-500', 35 | 'icon' => 'livewire-notifier::icons.error', 36 | ], 37 | 'info' => [ 38 | // 'msgClass'=>'bg-blue-200', 39 | 'msgClass'=>'bg-gradient-to-r from-blue-200 to-blue-300', 40 | 'progressClass' => 'bg-blue-500', 41 | 'icon' => 'livewire-notifier::icons.info', 42 | ], 43 | 'default' => [ 44 | // 'msgClass'=>'bg-gray-200', 45 | 'msgClass'=>'bg-gradient-to-r from-gray-200 to-gray-300', 46 | 'progressClass' => 'bg-gray-700', 47 | 'icon' => 'livewire-notifier::icons.info', 48 | ] 49 | ] 50 | ]; 51 | -------------------------------------------------------------------------------- /resources/views/livewire/notifier-message.blade.php: -------------------------------------------------------------------------------- 1 |
12 |
13 |
14 |
15 | @if ($message['icon']) 16 | {!! $message['icon'] !!} 17 | @else 18 | @include(config('livewire-notifier.types.'.$message['type'].'.icon')) 19 | @endif 20 |
21 |
22 | @if ($message['text']) 23 |

{{ $message['title'] }}

24 | @endif 25 |

26 | {{ $message['text'] }} 27 |

28 |
29 |
30 | @if($message['progressClass']) 31 |
35 |
36 | @endif 37 |
38 |
39 | -------------------------------------------------------------------------------- /src/Console/Commands/LivewireNotifierInstall.php: -------------------------------------------------------------------------------- 1 | table(['Livewire Notifier'], [ 31 | ['Simple notifications system with zero dependencies above TALL-stack.'], 32 | ["\nVisit site:\nhttps://github.com/codespb/livewire-notifier"] 33 | ]); 34 | $this->info('😎 Installing Livewire Notifier…'); 35 | if (!strpos(file_get_contents('./composer.json'), 'livewire/livewire')) { 36 | $this->comment('Please, make sure that livewire/livewire package is installed!'); 37 | return 1; 38 | } 39 | $tailwind_config_path = './tailwind.config.js'; 40 | if (!file_exists($tailwind_config_path)) { 41 | $this->comment('Please, make sure that Tailwind CSS is installed and tailwind.config.js file is in the project root folder!'); 42 | return 1; 43 | } else { 44 | $tailwind_config = file_get_contents($tailwind_config_path); 45 | if (!strpos($tailwind_config, 'livewire-notifier')) { 46 | $tailwind_config = preg_replace("#purge:\s*\[\n(.+)\]#imsU", "purge: [\n \"./config/livewire-notifier.php\",\n$1]", $tailwind_config); 47 | file_put_contents($tailwind_config_path, $tailwind_config); 48 | } 49 | } 50 | $this->call('vendor:publish', ['--tag'=>'livewire-notifier.config']); 51 | $this->call('vendor:publish', ['--tag'=>'livewire-notifier.views']); 52 | $this->info('🥳 Livewire Notifier is installed!'); 53 | return 0; 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /src/LivewireNotifierServiceProvider.php: -------------------------------------------------------------------------------- 1 | app->runningInConsole()) { 23 | $this->bootForConsole(); 24 | } 25 | Livewire::component('notifier', Notifier::class); 26 | Livewire::component('notifier-message', NotifierMessage::class); 27 | $this->loadViewsFrom(__DIR__.'/../resources/views', 'livewire-notifier'); 28 | 29 | } 30 | 31 | /** 32 | * Register any package services. 33 | * 34 | * @return void 35 | */ 36 | public function register(): void 37 | { 38 | $this->mergeConfigFrom(__DIR__.'/../config/livewire-notifier.php', 'livewire-notifier'); 39 | 40 | // Register the service the package provides. 41 | // $this->app->singleton('livewire-notifier', function ($app) { 42 | // return new LivewireNotifier; 43 | // }); 44 | } 45 | 46 | // /** 47 | // * Get the services provided by the provider. 48 | // * 49 | // * @return array 50 | // */ 51 | // public function provides() 52 | // { 53 | // return ['livewire-notifier']; 54 | // } 55 | 56 | /** 57 | * Console-specific booting. 58 | * 59 | * @return void 60 | */ 61 | protected function bootForConsole(): void 62 | { 63 | // Publishing the configuration file. 64 | $this->publishes([ 65 | __DIR__.'/../config/livewire-notifier.php' => config_path('livewire-notifier.php'), 66 | ], 'livewire-notifier.config'); 67 | 68 | // Publishing the views. 69 | $this->publishes([ 70 | __DIR__.'/../resources/views' => base_path('resources/views/vendor/livewire-notifier'), 71 | ], 'livewire-notifier.views'); 72 | 73 | // Registering package commands. 74 | $this->commands([LivewireNotifierInstall::class]); 75 | } 76 | } 77 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | # Livewire - Notifier 2 | 3 | [![Latest Stable Version](https://poser.pugx.org/codespb/livewire-notifier/v)](//packagist.org/packages/codespb/livewire-notifier) [![run-tests](https://github.com/codespb/livewire-notifier/actions/workflows/run-tests.yml/badge.svg)](https://github.com/codespb/livewire-notifier/actions/workflows/run-tests.yml) [![Total Downloads](https://poser.pugx.org/codespb/livewire-notifier/downloads)](//packagist.org/packages/codespb/livewire-notifier) [![License](https://poser.pugx.org/codespb/livewire-notifier/license)](//packagist.org/packages/phpunit/phpunit) 4 | 5 | 6 | Livewire Notifier is a simple notifications system with zero dependencies above [TALL-stack](https://tallstack.dev/) (Tailwind CSS, Alpine.JS, Laravel and Livewire). 7 |

8 | Livewire Notifier 9 |

10 | 11 | ## Requirements 12 | 13 | Make sure that [Livewire](https://laravel-livewire.com/) and [Alpine.JS](https://github.com/alpinejs/alpine) are installed properly. 14 | The easiest way to do it is to install [Laravel Jetstream](https://jetstream.laravel.com) with **Livewire stack** (post-install command `php artisan jetstream:install livewire`). 15 | 16 | **Alpine.JS** must be imported in `resources/js/app.js` package: 17 | ```javascript 18 | import 'alpinejs' 19 | ``` 20 | **Livewire** scripts and styles tags must be present in the layout file: 21 | ```html 22 | … 23 | 24 | … 25 | 26 | … 27 | 28 | 29 | … 30 | 31 | 32 | 33 | ``` 34 | ## Installation 35 | 36 | Via Composer 37 | 38 | ```bash 39 | $ composer require codespb/livewire-notifier 40 | ``` 41 | 42 | Proceed with installation process: 43 | 44 | ```bash 45 | $ php artisan livewire-notifier:install 46 | ``` 47 | 48 | Afterwards the package config can be found at `config/livewire-notifier.php` and views at `resources/views/vendor/livewire-notifier/`. 49 | 50 | It's required because of Tailwind config is needed to be extended with new purge paths. 51 | 52 | Otherwise you won't see messages styled properly. 53 | 54 |

55 | Livewire Notifier 56 |

57 | 58 | ## Usage 59 | 60 | Put Livewire-component `` into the app layout. 61 | Make sure to insert it into correct context because it may be positioned absolutely. 62 | 63 | Now you can use it from frontend and backend both. 64 | 65 | ## Message options 66 | 67 | Message added at backend (from any Livewire component) must have type of `array`. 68 | Message added at frontend (from JavaScript) must have type of `object`. 69 | 70 | ``` php 71 | $message = [ 72 | 'text' => __('Post is saved!'), 73 | 'title' => '', // Optional 74 | 'type' => 'success', // Optional. By default: success | optional: error (or fail), warning (or warn), info 75 | // you can find all types options in the config file 76 | 'icon' => '', // Optional. It replaces the default type icon. Can be pure html or svg code 77 | 78 | // Attention! The following options override ones from the config file 79 | 80 | 'duration' => 5000, // Optional. The time of message to be shown. To show infinitely set to 0 81 | 'msgClass' => 'bg-gradient-to-r from-green-200 to-green-300', // Optional. Tailwind class for message container 82 | 'progressClass' => 'bg-green-500', // Optional. Tailwind class for progress bar. If null progress bar won't be shown 83 | 'closable' => false, // Optional. True by default. Whether message is closable by click on message or Esc key press on window 84 | ] 85 | ``` 86 | ``` javascript 87 | let message = { 88 | text: 'Post is saved!' 89 | } 90 | ``` 91 | 92 | ### Backend 93 | 94 | **Livewire event** 95 | 96 | From any Livewire component push `emit` trigger to render new message. 97 | 98 | ``` php 99 | public function save(){ 100 | ... 101 | $this->emitTo('notifier','message',['text'=>__('The post is saved!')]); 102 | } 103 | ``` 104 | 105 | **Session flash variable** 106 | ``` php 107 | public function save(){ 108 | ... 109 | session()->flash('notifier',['text'=>__('The post is saved!')]); 110 | return $this->redirect(route('posts')); 111 | } 112 | ``` 113 | 114 | ### Frontend 115 | Add new message from javascript: 116 | ``` javascript 117 | Livewire.emitTo('notifier','message',{text:'The post is saved!'}) 118 | ``` 119 | 120 | ### Example 121 | Try to put the following code (with Laravel Jetstream w/Livewire stack installed): 122 | ```html 123 |
124 | Success 125 | Error 126 | Warning 127 | Info 128 | Default 129 |
130 | ``` 131 | 132 | ## Config file 133 | 134 | After `php artisan livewire-notifier:install` command is fired, config file will be published to `config/livewire-notifier.php`. There you can change some value for customization. 135 | ``` php 136 | 'absolute top-0 right-0', 140 | // Default message Tailwind stylinh 141 | 'defaultMsgClass' => 'w-80 rounded-xl shadow-xl', 142 | // Time of each message to be shown by default 143 | 'duration' => 2200, 144 | // Messages types 145 | 'types' => [ 146 | 'success' => [ 147 | // 'msgClass'=>'bg-green-200', 148 | 'msgClass'=>'bg-gradient-to-r from-green-200 to-green-300', 149 | 'progressClass' => 'bg-green-500', 150 | // View for icon 151 | 'icon' => 'livewire-notifier::icons.success', 152 | ], 153 | 'error' => [ 154 | // 'msgClass'=>'bg-red-200', 155 | 'msgClass'=>'bg-gradient-to-r from-red-200 to-red-300', 156 | 'progressClass' => 'bg-red-500', 157 | // View for icon 158 | 'icon' => 'livewire-notifier::icons.error', 159 | ], 160 | 'fail' => [ 161 | // 'msgClass'=>'bg-red-200', 162 | 'msgClass'=>'bg-gradient-to-r from-red-200 to-red-300', 163 | 'progressClass' => 'bg-red-500', 164 | // View for icon 165 | 'icon' => 'livewire-notifier::icons.error', 166 | ], 167 | 'warning' => [ 168 | // 'msgClass'=>'bg-yellow-200', 169 | 'msgClass'=>'bg-gradient-to-r from-yellow-200 to-yellow-300', 170 | 'progressClass' => 'bg-yellow-500', 171 | // View for icon 172 | 'icon' => 'livewire-notifier::icons.error', 173 | ], 174 | 'warn' => [ 175 | // 'msgClass'=>'bg-yellow-200', 176 | 'msgClass'=>'bg-gradient-to-r from-yellow-200 to-yellow-300', 177 | 'progressClass' => 'bg-yellow-500', 178 | // View for icon 179 | 'icon' => 'livewire-notifier::icons.error', 180 | ], 181 | 'info' => [ 182 | // 'msgClass'=>'bg-blue-200', 183 | 'msgClass'=>'bg-gradient-to-r from-blue-200 to-blue-300', 184 | 'progressClass' => 'bg-blue-500', 185 | // View for icon 186 | 'icon' => 'livewire-notifier::icons.info', 187 | ], 188 | 'default' => [ 189 | // 'msgClass'=>'bg-gray-200', 190 | 'msgClass'=>'bg-gradient-to-r from-gray-200 to-gray-300', 191 | 'progressClass' => 'bg-gray-700', 192 | // View for icon 193 | 'icon' => 'livewire-notifier::icons.info', 194 | ] 195 | ] 196 | ]; 197 | ``` 198 | 199 | ## Troubleshooting 200 | 201 | Your messages don't get any styles? Please, run `livewire-notifier:install` command to publish views. Therefore Laravel Mix compiler will find package Blade-views and will purge CSS properly. 202 | 203 | ## Updating 204 | 205 | Simply update like all other packages with `composer update`. Be sure to run `livewire-notifier:install` to updated published views. 206 | 207 | ## Change log 208 | 209 | Please see the [changelog](changelog.md) for more information on what has changed recently. 210 | 211 | ## Testing 212 | 213 | ```bash 214 | $ composer test 215 | ``` 216 | 217 | ## Contributing 218 | 219 | Please see [contributing.md](contributing.md) for details and a todolist. 220 | 221 | ## Security 222 | 223 | If you discover any security related issues, please email author email instead of using the issue tracker. 224 | 225 | ## Credits 226 | 227 | - [Dmitriy Belyaev](https://codespb.com) 228 | 229 | ## License 230 | 231 | Please see the [license file](license.md) for more information. 232 | --------------------------------------------------------------------------------