PHPackages                             cloudstudio/laravel-livewire-modal - 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. cloudstudio/laravel-livewire-modal

ActiveLibrary

cloudstudio/laravel-livewire-modal
==================================

This is my package laravel-livewire-modal

v1.0.13(1mo ago)55961MITPHPPHP ^8.3CI failing

Since Mar 2Pushed 1mo ago1 watchersCompare

[ Source](https://github.com/cloudstudio/laravel-livewire-modal)[ Packagist](https://packagist.org/packages/cloudstudio/laravel-livewire-modal)[ Docs](https://github.com/cloudstudio/laravel-livewire-modal)[ GitHub Sponsors](https://github.com/cloudstudio)[ RSS](/packages/cloudstudio-laravel-livewire-modal/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (18)Versions (17)Used By (0)

Laravel Livewire Modal
======================

[](#laravel-livewire-modal)

[![Latest Version on Packagist](https://camo.githubusercontent.com/76f473e3f6199f9a324302950a19c19968f0b061ed8089ca5832cfd0500f85ad/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f636c6f756473747564696f2f6c61726176656c2d6c697665776972652d6d6f64616c2e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/cloudstudio/laravel-livewire-modal)[![Total Downloads](https://camo.githubusercontent.com/3caa1cf63377635de2ed8fb7f9bddd564823d40775e4701232a2f3e584cc3b29/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f636c6f756473747564696f2f6c61726176656c2d6c697665776972652d6d6f64616c2e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/cloudstudio/laravel-livewire-modal)

This package is inspired by [wire-elements/modal](https://github.com/wire-elements/modal), forked and rebuilt from scratch to provide full support for Livewire v3 and Tailwind 4. It provides a powerful Livewire component that gives you a modal system that supports multiple child modals while maintaining state.

Features
--------

[](#features)

- 🚀 Fully compatible with Livewire v3
- 🎨 Styled with Tailwind 4
- 🔄 Maintains component state between modal interactions
- 📦 Support for nested/stacked modals
- 🛡️ Secure handling of data
- ⚡ Optimized performance
- 🔧 Highly customizable

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

[](#installation)

You can install the package via composer:

```
composer require cloudstudio/laravel-livewire-modal
```

After installing the package, you need to include the modal component in your blade layout file:

```

```

Tailwind Configuration
----------------------

[](#tailwind-configuration)

To properly configure Tailwind 4 with this package, add these lines to your `app.css` file:

```
@import '../../vendor/cloudstudio/laravel-livewire-modal/dist/modal.css';
```

Then run:

```
yarn build
```

This ensures Tailwind can properly scan and generate the necessary styles for the modal components.

Basic Usage
-----------

[](#basic-usage)

### Creating a Modal Component

[](#creating-a-modal-component)

Create a Livewire component that extends the `LivewireModal` class:

```