Apresentando um pacote modal flexível do Laravel Livewire

Laravel e Livewire revolucionaram a maneira como construímos aplicativos dinâmicos com o mínimo de JavaScript. Mas quando se trata de lidar com modais, a maioria das soluções tende a nos prender a estruturas de design específicas, como Bootstrap ou Tailwind CSS. E se você precisar de flexibilidade para escolher seu sistema de design? É aí que entra meu pacote Laravel Livewire Modal recém-lançado!

? O que é este pacote?

O pacote Laravel Livewire Modal é uma solução independente de estrutura para lidar com modais em seus projetos Livewire. Ele foi projetado para funcionar perfeitamente com Bootstrap, Tailwind CSS ou qualquer estilo personalizado. Esteja você trabalhando em um projeto totalmente novo ou integrando um já existente, este pacote se adapta às suas necessidades.

✨ Principais recursos

• Framework-Agnostic: Use com Bootstrap, Tailwind CSS ou seus próprios estilos personalizados.
• Fácil Integração: Eventos Livewire simples para abrir e fechar modais.
• Manipulação dinâmica de dados: passe dados sem esforço para seus componentes modais.
• Personalizável e leve: Sem estilos forçados, permitindo que você mantenha controle total sobre seu design.

?️ Instalação e configuração

Você pode começar instalando o pacote via Composer:

composer require sagor110090/livewire-modal

Em seguida, adicione a seguinte linha ao arquivo de layout app.blade.php para ativar modais em todo o seu aplicativo:

Além disso, não se esqueça de incluir o JS e CSS necessários em seu resources/js/app.js:

import '../../vendor/sagor110090/livewire-modal/resources/js/loader.js';
import '../../vendor/sagor110090/livewire-modal/resources/css/loader.css';

? Exemplo de uso

Veja como é fácil abrir e fechar modais usando este pacote:

Abrindo um Modal

    Open Modal

Fechando um Modal

    Cancel

Criando um componente Livewire

Para começar, aqui está um exemplo de componente Livewire para editar um usuário:

user = User::find($id);
    }

    public function render()
    {
        return view('livewire.edit-user');
    }
}

Personalizando seu design modal

Este pacote é completamente independente de design, o que significa que você pode usar qualquer estrutura para estilizar seus modais. Por exemplo, se você estiver usando Tailwind CSS:

Sinta-se à vontade para substituir o estilo por Bootstrap, CSS personalizado ou qualquer sistema de design de sua preferência.

? Por que usar este pacote?

A maioria das soluções modais está vinculada a estruturas de design específicas, limitando sua flexibilidade. Este pacote oferece controle total sobre como você estiliza seus modais, ao mesmo tempo que fornece integração perfeita com os poderosos componentes do Livewire.

Esteja você criando um aplicativo grande ou um projeto simples, este pacote foi projetado para ser leve, flexível e fácil de usar.

? Comece hoje mesmo!

Se você está pronto para simplificar o gerenciamento modal em seus projetos Laravel Livewire, experimente este pacote! Você pode instalá-lo via Composer:

composer require sagor110090/livewire-modal

E não deixe de conferir o repositório GitHub para mais detalhes e suporte.

Obrigado pela leitura! Espero que este pacote ajude você a construir aplicações Laravel mais flexíveis e dinâmicas. Se você tiver alguma dúvida ou feedback, sinta-se à vontade para entrar em contato nos comentários.

Boa codificação! ?