stimulus-overlay-helpers 2.0.0 → 3.1.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 86ae555d09ee9af3eae8fec2e46e53de2d2b907679cb7d7721196d44fdb5835f
-  data.tar.gz: 5bb2badc10b8d1278e93cc6083d35f468a551703fb88e989e738057805083f4e
+  metadata.gz: 39101cef1d9fef4cba42c3dc3e19766b1936cadb91c04b8120cb40d436959764
+  data.tar.gz: 583c4630ee41e316dab54038034d849b0dd858132fb08804b802ab56a39d29da
 SHA512:
-  metadata.gz: 933332441daf7824da520ba1ec4acfcebd9d783aa2605d803a2b68847fa32911a2a879650c18f013609e908d7aeb51751b05b447adb69144aa70cca70a641607
-  data.tar.gz: 5b0136dd827abba33dba52ec1fb0ec8c3685f83abee61f9ee77968426561dd5a3e00e9ff1d785aa0f35b2854473cdacd7a922fbef3f888673e3e047c08f54051
+  metadata.gz: 756f24cf638fcde7836f0ca95419c526b26c646d2d6cf92ebe3796a8ddabd0ab097b3bee8969b3bcabf714a260a13f20804f9154e672c87087a31cb577c47561
+  data.tar.gz: da5451bfbb0c43d1cb1fa35cd92cb7e02cb9b0a0af5575ce29d5300c5676c4339d1e59f1aebba97519bdf3a65b9c32d606a9e02501340cf79ebcf834c4c567ef

data/README.md

@@ -59,7 +59,7 @@ This matches the behavior of the [Svelte overlays from `@csedl/hotwire-svelte-he
 ```
 
 ```haml
-= tooltip('tooltip-text-or-proc', class: 'primary-tooltip') do
+= tooltip('tooltip-text-or-proc') do
     tooltip-content
 ```
 

data/lib/stimulus-overlay-helpers.rb

@@ -4,7 +4,7 @@ require 'stimulus_overlay_helpers/view_helpers'
 # Provides helpers and configuration for Stimulus overlay behavior.
 module StimulusOverlayHelpers
   class << self
-    attr_accessor :close_button_proc
+    attr_accessor :close_button_proc, :dropdown_arrow
 
     def configure
       yield self
@@ -12,9 +12,11 @@ module StimulusOverlayHelpers
 
     def reset_config!
       self.close_button_proc = nil
+      self.dropdown_arrow = true
     end
   end
 
   # Default fallback if no config is set
   self.close_button_proc = nil
+  self.dropdown_arrow = false
 end

data/lib/stimulus_overlay_helpers/view_helpers.rb

@@ -1,5 +1,7 @@
 module StimulusOverlayHelpers
   module ViewHelpers
+
+
     #== dropdown helper
     # @param [button_content] Proc or String for content of the button element
     # @param [panel_at_place] true (default: false) => it would render the panel into content_for(:overlays_box) on sticky parts (left-menu / top-bar) panels should be at place for avoiding that the panel would scroll with the content
@@ -8,6 +10,10 @@ module StimulusOverlayHelpers
     # * a) wraps the button_content in element like: %button{ data: { controller: 'dropdown', ... } } and renders it at place
     # * b) wraps the panel_content in a corresponding element and renders it to the overlays_box (because of z-index-hierarchy)
     # * c) the stimulus controller always adds the class .dropdown-panel to the panel
+    # * options:
+    # ** class: custom class for the dropdown-button
+    # ** panel_class: custom class for the dropdown-panel
+    # ** src: custom src for the dropdown-panel, triggers a GET xhr request that fills up the panel
     def dropdown(button_content, title = nil, options = {}, &panel_content)
       if title.is_a?(Hash)
         options = title.dup
@@ -15,34 +21,29 @@ module StimulusOverlayHelpers
       end
 
       panel_at_place = options.delete(:panel_at_place)
+      src = options.delete(:src)
+      button_class = [options.delete(:button_class), 'dropdown-button', options[:class]].compact.join(' ')
+      panel_class = [options.delete(:class), 'dropdown-panel'].compact.join(' ')
+      close_btn_proc = StimulusOverlayHelpers.close_button_proc
 
       id = "dropdown-panel-#{SecureRandom.hex(4)}"
 
-      src = options.delete(:src)
-
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # create the Button
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      button_options = options.dup
-      button_options[:class] = [options[:class], 'dropdown-button'].compact.join(' ')
-      button_options = button_options.merge(data: { controller: 'hotwire-svelte-helpers-dropdown', panel_id: id })
-
-      button_content = capture(&button_content) if button_content.is_a?(Proc)
-      btn = content_tag(:div, button_content, button_options)
+      button_content = capture(&panel_content_button = button_content) if button_content.is_a?(Proc)
+      button_options = options.merge(class: button_class, data: { controller: 'hotwire-svelte-helpers-dropdown', panel_id: id })
+      button_element = content_tag(:div, button_content, button_options)
 
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # create the panel
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      panel_options = options.dup
-      panel_options[:class] = [options[:class], 'dropdown-panel'].compact.join(' ')
-      panel_options[:style] = "display: none;"
-      panel_options[:id] = id
-      panel_options['data-src'] = src if src
-      close_btn_proc = StimulusOverlayHelpers.close_button_proc
+      panel_options = options.merge(class: panel_class, style: 'display: none;', id: id)
+      panel_options['data-src'] = src if src.present?
 
-      panel = content_tag(:div, panel_options) do
+      panel_element = content_tag(:div, panel_options) do
         safe_join([
                     content_tag(:div, class: 'header') do
                       concat content_tag(:div, title, class: 'title')
@@ -50,18 +51,31 @@ module StimulusOverlayHelpers
                     end,
                     content_tag(:div, class: 'content') do
                       capture(&panel_content) if block_given?
-                    end
+                    end,
+                    (content_tag(:div, nil, id: 'arrow') if StimulusOverlayHelpers.dropdown_arrow),
                   ])
       end
 
+      # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+      # return the result
+      # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+
       if panel_at_place
-        btn + panel
+        button_element + panel_element
       else
-        content_for(:overlays_box, panel)
-        btn
+        content_for(:overlays_box, panel_element)
+        button_element
       end
     end
 
+    #== modal helper
+    # @param [button_content] Proc or String for content of the button element
+    # @param [panel_at_place] true (default: false) => it would render the overlay into content_for(:overlays_box) on sticky parts (left-menu / top-bar) overlays should be at place for avoiding that the overlay would scroll with the content
+    # @block [panel_content] Panel Content as block
+    # what it does:
+    # * a) wraps the button_content in element like: %button{ data: { controller: 'modal', ... } } and renders it at place
+    # * b) wraps the panel_content in a full-screen overlay element and renders it to the overlays_box (because of z-index-hierarchy)
+    # * c) the stimulus controller always adds the class .modal-panel to the panel and .modal-overlay to the backdrop
     def modal(button_content, title = nil, options = {}, &panel_content)
       if title.is_a?(Hash)
         options = title.dup
@@ -69,32 +83,29 @@ module StimulusOverlayHelpers
       end
 
       panel_at_place = options.delete(:panel_at_place)
+      src = options.delete(:src)
+      button_class = [options.delete(:button_class) || 'modal-button', options[:class]].compact.join(' ')
+      panel_class = [options.delete(:class), 'modal-panel'].compact.join(' ')
+      close_btn_proc = StimulusOverlayHelpers.close_button_proc
 
       id = "modal-overlay-#{SecureRandom.hex(4)}"
 
-      src = options.delete(:src)
-
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # create the Button
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      button_options = options.dup
-      button_options[:class] = [options[:class], 'modal-button'].compact.join(' ')
-      button_options = button_options.merge(data: { controller: 'hotwire-svelte-helpers-modal', panel_id: id })
-
       button_content = capture(&button_content) if button_content.is_a?(Proc)
-      btn = content_tag(:div, button_content, button_options)
+      button_options = options.merge(class: button_class, data: { controller: 'hotwire-svelte-helpers-modal', panel_id: id })
+      button_element = content_tag(:div, button_content, button_options)
 
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # create the overlay
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      panel_options = options.dup
-      panel_options[:class] = [options[:class], 'modal-panel'].compact.join(' ')
-      panel_options['data-src'] = src if src
-      close_btn_proc = StimulusOverlayHelpers.close_button_proc
+      panel_options = options.merge(class: panel_class)
+      panel_options['data-src'] = src if src.present?
 
-      overlay = content_tag(:div, class: 'modal-overlay', style: 'display:none;', id: id) do
+      overlay_element = content_tag(:div, class: 'modal-overlay', style: 'display:none;', id: id) do
         content_tag(:div, panel_options) do
           safe_join([
                       content_tag(:div, class: 'header') do
@@ -108,81 +119,70 @@ module StimulusOverlayHelpers
         end
       end
 
+      # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+      # return the result
+      # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
+
       if panel_at_place
-        btn + overlay
+        button_element + overlay_element
       else
-        content_for(:overlays_box, overlay)
-        btn
+        content_for(:overlays_box, overlay_element)
+        button_element
       end
     end
 
-    def tooltip(label, options = {}, &content)
+    #== tooltip helper
+    # @param [tip] Proc or String for the tooltip content (the panel shown on hover)
+    # @param [panel_at_place] true (default: false) => it would render the panel into content_for(:overlays_box) on sticky parts (left-menu / top-bar) panels should be at place for avoiding that the panel would scroll with the content
+    # @param [delay] Number (default: 0.4) => delay in seconds before the tooltip is shown
+    # @block [label] the visible label/element that triggers the tooltip on hover
+    # what it does:
+    # * a) wraps the label in element like: %span{ data: { controller: 'tooltip', ... } } and renders it at place
+    # * b) wraps the tip in a corresponding panel element and renders it to the overlays_box (because of z-index-hierarchy)
+    # * c) the stimulus controller always adds the class .tooltip-panel to the panel
+    def tooltip(tip, options = {}, &)
+      label = capture(&) if block_given?
+      tip = capture &tip if tip.is_a?(Proc)
+      return '' if label.blank?
+      return label if tip.blank?
 
       panel_at_place = options.delete(:panel_at_place) || false
       delay = options.delete(:delay) || 0.4
       src = options.delete(:src)
-      label_class = options.delete(:label_class) || 'tooltip-label'
+      label_class = [options.delete(:label_class) || 'tooltip-label', options[:class]].compact.join(' ')
+      panel_class = [options.delete(:class), 'tooltip-panel'].compact.join(' ')
 
-      id = ['tooltip', SecureRandom.hex(4)].join('-')
-
-      lab = if label.is_a?(Proc)
-              capture &label
-            else
-              label
-            end
-      cont = capture(&content) if block_given?
+      id = "tooltip-#{SecureRandom.hex(4)}"
 
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # create the Label
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      label_options = options.dup
-      label_options[:id] = options.delete(:id)
-      label_options[:class] = [options[:class], label_class].compact.join(' ')
-      label_options = label_options.merge(data: { controller: 'hotwire-svelte-helpers-tooltip', panel_id: id, delay: delay })
-
-      label_element = if block_given? && cont.present?
-                        content_tag(:span, label_options) do
-                          lab
-                        end
-                      else
-                        lab
-                      end
+      label_options = options.merge(class: label_class, data: { controller: 'hotwire-svelte-helpers-tooltip', panel_id: id, delay: delay })
+      label_element = content_tag(:span, label, label_options)
 
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # create the panel
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      panel_options = options.dup
-      panel_options[:class] = [options[:class], 'tooltip-panel'].compact.join(' ')
-      panel_options[:id] = id
-      panel_options[:style] = 'display: none;'
-      panel_options['data-src'] = src if src
+      panel_options = options.merge(class: panel_class, style: 'display: none', id: id)
+      panel_options['data-src'] = src if src.present?
 
-      panel_element = if block_given? && cont.present?
-                        content_tag(:div, panel_options) do
-                          content_tag(:div, class: 'content') do
-                            cont
-                          end
-                        end
-                      end
+      panel_element = content_tag(:div, panel_options) do
+        content_tag( :div, '', id: "arrow") +
+          content_tag(:div, tip, class: 'tooltip-content')
+      end
 
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
       # return the result
       # xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
 
-      if !panel_element
-        label_element
-      elsif panel_at_place
-        r = label_element
-        r << panel_element
+      if panel_at_place
+        label_element + panel_element
       else
-        content_for(:overlays_box) do
-          panel_element
-        end
+        content_for(:overlays_box, panel_element)
         label_element
       end
-
     end
 
   end

metadata

@@ -1,16 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: stimulus-overlay-helpers
 version: !ruby/object:Gem::Version
-  version: 2.0.0
+  version: 3.1.0
 platform: ruby
 authors:
 - Christian Sedlmair
-autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-05-23 00:00:00.000000000 Z
+date: 1980-01-02 00:00:00.000000000 Z
 dependencies: []
-description:
 email: christian@sedlmair.ch
 executables: []
 extensions: []
@@ -27,7 +25,6 @@ metadata:
   homepage_uri: https://gitlab.com/sedl/stimulus-overlay-helpers
   source_code_uri: https://gitlab.com/sedl/stimulus-overlay-helpers
   changelog_uri: https://gitlab.com/sedl/stimulus-overlay-helpers
-post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -42,8 +39,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.1.6
-signing_key:
+rubygems_version: 3.6.7
 specification_version: 4
 summary: View helpers for the npm package @csedl/hotwire-svelte-helpers
 test_files: []