Filament Signature Field

Campo de firma digital para Filament v4 con soporte táctil, múltiples formatos de exportación y dark mode.

Instalación

composer require cursosdesarrolloweb/filament-signature-field

Después de instalar, publica los assets:

php artisan filament:assets

Uso Rápido

Añade un campo de firma en tu formulario:

use CursosDesarrolloWeb\SignatureField\Forms\Components\SignatureField;

SignatureField::make('signature')
    ->label('Firma')

Campo de Formulario

use CursosDesarrolloWeb\SignatureField\Forms\Components\SignatureField;

// Uso básico
SignatureField::make('signature')
    ->label('Firma del cliente')

// Personalizar colores del trazo
SignatureField::make('signature')
    ->penColor('#1e40af')
    ->penColorDark('#93c5fd')

// Personalizar grosor del trazo
SignatureField::make('signature')
    ->strokeMinWidth(0.5)
    ->strokeMaxWidth(3.0)

// Personalizar color de fondo
SignatureField::make('signature')
    ->backgroundColor('#f8fafc')

// Cambiar altura del canvas
SignatureField::make('signature')
    ->canvasHeight(250)

// Cambiar formato de exportación (png, jpg, svg)
SignatureField::make('signature')
    ->exportFormat('png')

// Requerido con validación
SignatureField::make('signature')
    ->required()

// Ejemplo completo
SignatureField::make('signature')
    ->label('Firma del contrato')
    ->penColor('#1e40af')
    ->penColorDark('#93c5fd')
    ->strokeMinWidth(0.5)
    ->strokeMaxWidth(3.0)
    ->backgroundColor('#ffffff')
    ->canvasHeight(200)
    ->exportFormat('png')
    ->required()

Métodos Disponibles

Base de Datos

La firma se guarda como base64 (data URI). Usa TEXT o LONGTEXT para el campo:

Schema::table('contracts', function (Blueprint $table) {
    $table->longText('signature')->nullable();
});

Características

• Soporte táctil completo (móvil/tablet)
• Botón para limpiar la firma
• Dark mode automático
• Responsive (se adapta al ancho del contenedor)
• Alta resolución (soporte para pantallas retina)
• Múltiples formatos de exportación (PNG, JPG, SVG)

Requisitos

• PHP 8.2+
• Laravel 11+
• Filament 4.x|5.x

Licencia

Propietario - Solo para suscriptores de CursosDesarrolloWeb.