Module: BetterUi::General::Components::Modal::ModalHelper

Included in:
ApplicationHelper
Defined in:
app/helpers/better_ui/general/components/modal/modal_helper.rb

Instance Method Summary collapse

Instance Method Details

#bui_modal(close_on_backdrop: true, close_on_escape: true, lock_scroll: true, classes: nil, **html_options, &block) ⇒ String

Helper per renderizzare un modal con trigger e contenuto

Examples:

Utilizzo base con button trigger

<%= bui_modal do |modal| %>
  <% modal.with_trigger(label: "Apri Modal", as: :button, type: :primary) %>
  <% modal.with_modal(title: "Conferma azione") do %>
    <p>Sei sicuro di voler continuare?</p>
  <% end %>
<% end %>

Con link trigger

<%= bui_modal do |modal| %>
  <% modal.with_trigger(label: "Visualizza dettagli", as: :link, variant: :underline) %>
  <% modal.with_modal(title: "Dettagli elemento", theme: :blue, size: :large) do %>
    <p>Informazioni dettagliate sull'elemento selezionato.</p>
  <% end %>
<% end %>

Modal con configurazione avanzata

<%= bui_modal(close_on_backdrop: false, lock_scroll: false) do |modal| %>
  <% modal.with_trigger(label: "Elimina", as: :button, type: :red, size: :small) %>
  <% modal.with_modal(title: "Elimina elemento", theme: :red, backdrop: true, closable: true) do %>
    <p>Sei sicuro di voler eliminare questo elemento?</p>
    <p class="text-sm text-gray-600 mt-2">Questa azione non può essere annullata.</p>

    <div class="flex justify-end space-x-3 mt-6">
      <%= bui_button(label: "Annulla", type: :white, size: :medium) %>
      <%= bui_button(label: "Elimina", type: :red, size: :medium) %>
    </div>
  <% end %>
<% end %>

Parameters:

  • close_on_backdrop (Boolean) (defaults to: true) —

    Se chiudere il modal cliccando sul backdrop

  • close_on_escape (Boolean) (defaults to: true) —

    Se chiudere il modal premendo Escape

  • lock_scroll (Boolean) (defaults to: true) —

    Se bloccare lo scroll del body quando il modal è aperto

  • classes (String) (defaults to: nil) —

    Classi CSS aggiuntive per il contenitore

  • html_options (Hash) —

    Attributi HTML aggiuntivi

  • theme (Hash) —

    a customizable set of options

  • size (Hash) —

    a customizable set of options

  • rounded (Hash) —

    a customizable set of options

Returns:

  • (String) —

    HTML del modal



65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
 
# File 'app/helpers/better_ui/general/components/modal/modal_helper.rb', line 65

def bui_modal(
  close_on_backdrop: true,
  close_on_escape: true,
  lock_scroll: true,
  classes: nil,
  **html_options,
  &block
)
  render BetterUi::General::Modal::Component.new(
    close_on_backdrop: close_on_backdrop,
    close_on_escape: close_on_escape,
    lock_scroll: lock_scroll,
    classes: classes,
    **html_options
  ), &block
end