diff --git a/app/components/dialog_component.html.erb b/app/components/dialog_component.html.erb index 8b2a67be..5f2ef647 100644 --- a/app/components/dialog_component.html.erb +++ b/app/components/dialog_component.html.erb @@ -1,4 +1,4 @@ - +<%= wrapper_element do %> <%= tag.dialog class: "w-full h-full bg-transparent theme-dark:backdrop:bg-alpha-black-900 backdrop:bg-overlay #{drawer? ? "lg:p-3" : "lg:p-1"}", **merged_opts do %> <%= tag.div class: dialog_outer_classes do %> <%= tag.div class: dialog_inner_classes, data: { dialog_target: "content" } do %> @@ -35,4 +35,4 @@ <% end %> <% end %> <% end %> - +<% end %> diff --git a/app/components/dialog_component.rb b/app/components/dialog_component.rb index 16f04bdc..97788691 100644 --- a/app/components/dialog_component.rb +++ b/app/components/dialog_component.rb @@ -33,7 +33,7 @@ class DialogComponent < ViewComponent::Base end end - attr_reader :variant, :auto_open, :reload_on_close, :frame, :width, :opts + attr_reader :variant, :auto_open, :reload_on_close, :width, :disable_frame, :opts VARIANTS = %w[modal drawer].freeze WIDTHS = { @@ -43,17 +43,22 @@ class DialogComponent < ViewComponent::Base full: "lg:max-w-full" }.freeze - def initialize(variant: "modal", auto_open: true, reload_on_close: false, frame: nil, width: "md", **opts) + def initialize(variant: "modal", auto_open: true, reload_on_close: false, width: "md", disable_frame: false, **opts) @variant = variant.to_sym @auto_open = auto_open @reload_on_close = reload_on_close - @frame = frame @width = width.to_sym + @disable_frame = disable_frame @opts = opts end - def frame - @frame || variant + # Caller must "opt-out" of using the default turbo-frame based on the variant + def wrapper_element(&block) + if disable_frame + content_tag(:div, &block) + else + content_tag("turbo-frame", id: variant, &block) + end end def dialog_outer_classes @@ -80,7 +85,7 @@ class DialogComponent < ViewComponent::Base end class_names( - "flex flex-col bg-container lg:rounded-xl lg:shadow-border-xs w-full overflow-hidden", + "flex flex-col bg-container rounded-xl shadow-border-xs mx-3 lg:mx-0 w-full overflow-hidden", variant_classes ) end diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 5c30f2c2..6766bb0b 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -11,13 +11,13 @@ <%= render "layouts/shared/htmldoc" do %>