Finestra modale

Finestre di dialogo modali accessibili con sfondo oscurato, trappola del focus e animazioni fluide. Disponibile nelle varianti predefinita, avviso, conferma e prompt. Costruita con Stimulus e Tailwind CSS.

Predefinita

Finestra modale generica con titolo, contenuto e pulsante di chiusura

Opzioni

Nome Tipo Predefinito Descrizione
title * String obbligatorio Modal heading text
content String Modal body text (or pass a block)

Avviso

Dialogo di avviso con icona variante, messaggio e pulsante OK singolo

Opzioni

Nome Tipo Predefinito Descrizione
variant Symbol :info Visual style: :info, :warning, :danger, :success
title * String obbligatorio Alert heading text
message * String obbligatorio Alert body message
confirm_label String "OK" Text for the confirm button

Conferma

Dialogo di conferma con icona, messaggio e pulsanti Annulla/Conferma

Opzioni

Nome Tipo Predefinito Descrizione
variant Symbol :info Visual style: :info, :warning, :danger, :success
title * String obbligatorio Confirm heading text
message * String obbligatorio Confirm body message
confirm_label String "Confirm" Text for the confirm button
cancel_label String "Cancel" Text for the cancel button

Prompt

Dialogo prompt con icona, messaggio, campo di input e pulsanti Annulla/Invia

Opzioni

Nome Tipo Predefinito Descrizione
variant Symbol :info Visual style: :info, :warning, :danger, :success
title * String obbligatorio Prompt heading text
message * String obbligatorio Prompt body message
input_label String Label for the input field
input_placeholder String Placeholder text for the input field
input_value String "" Default value for the input field
confirm_label String "Submit" Text for the submit button
cancel_label String "Cancel" Text for the cancel button

Registro delle modifiche v2.0.0

- v2.0.0: Converted to multi-style with alert, confirm, and prompt variants
- v1.1.0: Added ViewComponent format support
- v1.0.0: Initial release with focus trap, backdrop click to close

Ottieni l'Accesso Completo

Sblocca il codice sorgente di questo componente e di tutti gli altri. Un solo pagamento per l'accesso a vita.

Ottieni l'Accesso Ora