Forms
Forms
Componenti form — input, select, date picker, toggle, upload e componenti speciali. 31 componenti totali.
Componenti
| Componente | Descrizione |
|---|---|
| InputText | Campo testo base con supporto validazione e stati |
| InputNumber | Campo numerico con formattazione, step e limiti min/max |
| Password | Campo password con toggle visibilità e indicatore forza |
| Textarea | Area testo multiriga con auto-resize opzionale |
| InputMask | Input con maschera per formati fissi (telefono, CF, ecc.) |
| PinInput | Input PIN/OTP a celle separate con navigazione automatica |
| InputGroup | Contenitore per raggruppare input con prefissi/suffissi |
| FloatLabel | Label flottante animata sopra il campo al focus/fill |
| FormLabel | Etichetta semantica per campi form con supporto required |
| FormHelperText | Testo di supporto/errore sotto i campi form |
| Select | Dropdown a selezione singola con ricerca opzionale |
| MultiSelect | Dropdown a selezione multipla con chip e ricerca |
| AutoComplete | Input con suggerimenti dinamici e ricerca asincrona |
| Listbox | Lista scrollabile con selezione singola o multipla |
| TreeSelect | Dropdown con struttura ad albero per dati gerarchici |
| SelectableCard | Card cliccabile usabile come alternativa visiva a radio/checkbox |
| Checkbox | Casella di spunta con stato indeterminato opzionale |
| RadioButton | Bottone radio per selezione esclusiva in un gruppo |
| ToggleSwitch | Interruttore on/off con animazione e label opzionale |
| Rating | Valutazione a stelle con punteggio configurabile |
| Slider | Cursore per selezione valore in un intervallo continuo |
| ColorPicker | Selettore colore con palette, HEX, RGB e HSL |
| DatePicker | Selettore data con calendario popup e navigazione mese/anno |
| TimePicker | Selettore orario con formato 12h/24h e step minuti |
| DateTimePicker | Selettore combinato data e ora in un unico componente |
| Calendar | Calendario inline per visualizzazione e selezione date |
| Clock | Orologio analogico interattivo per selezione orario |
| FileUpload | Upload file con drag & drop, preview e validazione tipo/size |
| SignatureInput | Canvas per firma digitale con export immagine |
| Int4RangeInput | Input per intervalli interi PostgreSQL (int4range) |
| IntervalInput | Input per durate e intervalli temporali (formato ISO 8601) |
Plugin
import { FormsPlugin } from '@pzeta/vue-components'
app.use(FormsPlugin)
Componenti per sottocategoria
Input Base
InputText, InputNumber, Password, Textarea, InputMask, PinInput, InputGroup, FloatLabel, FormLabel, FormHelperText
Select e Dropdown
Select, MultiSelect, AutoComplete, Listbox, TreeSelect, SelectableCard
Toggle e Controlli
Checkbox, RadioButton, ToggleSwitch, Rating, Slider, ColorPicker
Date, Time e Speciali
DatePicker, TimePicker, DateTimePicker, Calendar, Clock, FileUpload, SignatureInput, Int4RangeInput, IntervalInput
TreeSelect
Dropdown con struttura ad albero per selezione gerarchica. Supporta modalità single, multiple e checkbox con selezione a cascata, filtro e visualizzazione chip.
Accordion
Sistema di pannelli espandibili composto da quattro sub-componenti (Accordion, AccordionPanel, AccordionHeader, AccordionContent). Supporta modalità singola e multipla, lazy loading e icone personalizzabili.