mylaraveltools/alertas

Alertas modales y toasts estilo SweetAlert para Laravel — My Laravel Tools

dev-main 2026-06-20 09:52 UTC

Requires

• php: ^8.2
• illuminate/support: ^11.0|^12.0|^13.0

Requires (Dev)

• orchestra/testbench: ^9.0|^10.0
• phpunit/phpunit: ^11.0

MIT

• Alberto Gallardo Morales

• laravel
• modal
• alpine
• sweetalert
• toast
• livewire
• mylaraveltools
• alertas

README

Parte del ecosistema My Laravel Tools (mylaraveltools/*). Alertas modales y toasts estilo SweetAlert para Laravel. Sin dependencias JavaScript externas — usa Alpine.js (incluido con Livewire 3).

composer require mylaraveltools/alertas

Requisitos

• PHP 8.2+
• Laravel 11, 12 o 13
• Alpine.js en el layout (Livewire 3 lo incluye)

Instalación

composer require mylaraveltools/alertas
php artisan alertas:install

Repositorio local (desarrollo):

{
  "repositories": [
    { "type": "path", "url": "../alertas-library" }
  ],
  "require": {
    "mylaraveltools/alertas": "@dev"
  }
}

Layout

Añade el contenedor antes de </body>:

@alertas

o:

<x-alertas::contenedor />

Uso

Controlador (redirect con flash)

use MyLaravelTools\Alertas\Facades\Alertas;

Alertas::exito('Guardado', 'Los cambios se aplicaron.');

return redirect()->back();

Atajos: Alertas::error(), Alertas::aviso(), Alertas::info(), Alertas::toast('Mensaje', 'exito').

Livewire

use MyLaravelTools\Alertas\Livewire\Concerns\DispatchaAlertas;
use MyLaravelTools\Alertas\Livewire\Concerns\EscuchaConfirmacionAlertas;

class MiComponente extends Component
{
    use DispatchaAlertas, EscuchaConfirmacionAlertas;

    public function guardar(): void
    {
        // ...
        $this->alertaExito('Guardado');
    }

    public function pedirBorrado(int $id): void
    {
        $this->alertaConfirmar('¿Eliminar?', 'No se puede deshacer', 'borrar', ['id' => $id]);
    }

    public function borrar(array $datos): void
    {
        // $datos['id']
        $this->alertaExito('Eliminado');
    }
}

JavaScript

Tras cargar la página, window.Alertas está disponible:

// Modal simple
await Alertas.exito('¡Hecho!', 'Registro guardado')

// Confirmación (Promise)
const ok = await Alertas.confirmar('¿Continuar?', 'Esta acción no se puede deshacer')
if (ok) { /* ... */ }

// Prompt con entrada
const nombre = await Alertas.prompt('Tu nombre', 'Introduce tu nombre', 'Ej: Ana')

// Toast
Alertas.toast('Copiado al portapapeles', 'info')

// API completa (alias en inglés compatibles)
Alertas.fire({ title: 'Hola', text: 'Mundo', icon: 'success', toast: true })

Configuración

Publicada en config/alertas.php:

Clave	Descripción
botones.confirmar / cancelar	Textos por defecto
toast.posicion	top-start, top-end, bottom-start, bottom-end
toast.duracion	ms antes de cerrar toast
tema	claro, oscuro, auto
colores.*	Variables CSS por tipo de alerta

Tipos de icono

exito · error · aviso · info · pregunta

Alias en inglés: success, warning, question.

Licencia

MIT — Alberto Gallardo Morales