README

Un componente Blade riutilizzabile per input numerici decimali con Alpine.js per il filtraggio da tastiera e da incolla.
Compatibile con i form Laravel classici (name), Livewire (wire:model) e il binding reattivo Livewire live (wire:model.live).
Lo stile è configurabile: Tailwind CSS (default), Bootstrap, o senza stile.

✨ Features

• ✅ Componente Blade pronto all'uso, zero configurazione obbligatoria
• 🎯 Compatibile con Laravel 10, 11 e 12
• ⚡ Integrazione nativa con Livewire 3 (wire:model e wire:model.live)
• 🎨 Tre stili inclusi: Tailwind CSS, Bootstrap, o unstyled
• 🔢 Separatori decimali e delle migliaia configurabili (formato IT/EU e US/UK)
• ⌨️ Filtraggio input da tastiera e da incolla tramite Alpine.js
• 🔧 Config pubblicabile e viste personalizzabili

📦 Installazione

Installa il pacchetto tramite Composer:

composer require francescobruno-cmv/laravel-decimal-input

Il service provider viene registrato automaticamente. Nessuna configurazione manuale necessaria.

Pubblica la configurazione (opzionale)

php artisan vendor:publish --tag=decimal-input-config

Pubblica le viste per personalizzarle (opzionale)

php artisan vendor:publish --tag=decimal-input-views

⚙️ Requisiti

• PHP >= 8.1
• Laravel 10 / 11 / 12
• Alpine.js caricato nel layout (CDN o via npm)

⚙️ Configurazione

config/decimal-input.php (dopo la pubblicazione):

return [
    'style'               => 'tailwind',   // 'tailwind' | 'bootstrap' | 'none'
    'decimals'            => 2,
    'decimal_separator'   => ',',          // IT/EU: ','  —  US/UK: '.'
    'thousands_separator' => '.',          // IT/EU: '.'  —  US/UK: ','
];

🚀 Utilizzo

Form Laravel classico (name + value)

<x-decimal-input
    name="polizza"
    :value="old('polizza', number_format($preventivo?->polizza ?? 3, 2, ',', '.'))"
/>

Livewire — lazy binding (default)

<x-decimal-input
    model="polizza"
/>

Livewire — live / reactive binding

<x-decimal-input
    model="polizza"
    :live="true"
/>

📋 Props disponibili

📝 Esempi

Stile Bootstrap

<x-decimal-input name="importo" :value="1234.50" style="bootstrap" />

Senza stile (classi personalizzate)

<x-decimal-input
    name="importo"
    style="none"
    class="my-custom-class px-4 py-2"
/>

Separatori in formato US per componente

<x-decimal-input
    name="amount"
    :value="1234.56"
    decimalSep="."
    thousandsSep=","
/>

Livewire con attributi aggiuntivi

<x-decimal-input
    model="invoice.amount"
    :live="true"
    :decimals="4"
    id="amount-field"
    :required="true"
    placeholder="0,00"
    class="text-right"
/>

🤝 Contributi

Le contribuzioni sono benvenute!

1. Fai fork del progetto
2. Crea un branch (feature/nome-feature)
3. Commit delle modifiche
4. Push sul branch
5. Apri una Pull Request

📄 Licenza

Questo pacchetto è distribuito sotto licenza MIT.
Vedi il file LICENSE.md per maggiori dettagli.

👤 Autore

Francesco Bruno

⭐ Supporto

Se il pacchetto ti è utile, lascia una ⭐ su GitHub!