Livevire Modal

Package for opening any Livewire component inside modal. Powered by Livewire 3 and Bootstrap 5.

Created by: SteelAnts s.r.o.

Usage

Include modal in layout

@livewire('modal-basic', key('modal'))

Opening modal from blade or JavaScript

<button onclick="Livewire.dispatch('openModal', {livewireComponents: 'livewire-component-name', title: 'Modal title', parameters: [...]})">Open modal</button>

Opening modal from component

$this->dispatch('openModal', 'livewire-component-name', 'Modal title', $componentParameters)

openModal parameters

/**
 * Open modal
 *
 * @param string|Array $livewireComponents Component name, can be array
 * @param string $title Modal title
 * @param array $parameters Component parameters
 * @return void
 */
public function openModal($livewireComponents, $title = "", $parameters = [])

Example

<button onclick="Livewire.dispatch('openModal', {livewireComponents: 'user-form', title:  'Create user'})">Create User</button>

<button onclick="Livewire.dispatch('openModal', {livewireComponents: 'user-form', title: 'Edit user', parameters: ['user' => $userId]})">Edit User</button>

use Livewire\Component;

class UserForm extends Component
{
  public function mount(User $user)
  {
    $this->user = $user;
  }
}

Contributors

Other Packages

steelants/laravel-auth steelants/laravel-boilerplate steelants/datatable steelants/form steelants/modal steelants/laravel-tenant