RubyGems - stimulus_plumbers - Versions diffs - 0.2.2 → 0.2.8 - Mend

stimulus_plumbers 0.2.2 → 0.2.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

data/app/assets/javascripts/stimulus-plumbers/stimulus-plumbers-controllers.umd.js ADDED Viewed

@@ -0,0 +1 @@

data/lib/stimulus_plumbers/components/combobox/autocomplete.rb ADDED Viewed

@@ -0,0 +1,57 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      # Renders a listbox popover body for autocomplete.
+      # Re-uses combobox-dropdown for selection/filtering; input-combobox relays
+      # the trigger input event via the combobox-dropdown outlet.
+      class Autocomplete < Plumber::Base
+        include OptionGroup
+        DROPDOWN_CONTROLLER = "combobox-dropdown"
+        DROPDOWN_ACTION     = [
+          "click->combobox-dropdown#select",
+          "keydown->combobox-dropdown#navigate",
+          "combobox-dropdown:selected->input-combobox#onSelected"
+        ].join(" ").freeze
+        def self.default_opts
+          {
+            popover: {
+              tag:      :div,
+              haspopup: "listbox",
+              data:     { controller: DROPDOWN_CONTROLLER, action: DROPDOWN_ACTION }
+            },
+            trigger: { aria_autocomplete: "list", readonly: false }
+          }
+        end
+        def render(options: [], value: nil, label: nil, **_kwargs)
+          listbox_attrs = { role: "listbox", data: { "#{DROPDOWN_CONTROLLER}_target": "listbox" } }
+          listbox_attrs[:aria] = { label: label } if label
+          listbox = template.content_tag(:ul, **listbox_attrs) do
+            render_items(options, value: value)
+          end
+          loading = template.content_tag(
+            :div,
+            hidden: "",
+            aria:   { live: "polite" },
+            data:   { "#{DROPDOWN_CONTROLLER}_target": "loading" }
+          ) { "" }
+          empty = template.content_tag(
+            :div,
+            hidden: "",
+            role:   "status",
+            data:   { "#{DROPDOWN_CONTROLLER}_target": "empty" }
+          ) { "No results" }
+          template.safe_join([listbox, loading, empty])
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/combobox/date.rb ADDED Viewed

@@ -0,0 +1,52 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      # Renders the date picker popover body: navigation + calendar grid.
+      # Wires ComboboxDateController; dispatches combobox-date:selected → InputComboboxController.
+      class Date < Plumber::Base
+        PICKER_CONTROLLER   = "combobox-date"
+        CALENDAR_OUTLET_KEY = "#{PICKER_CONTROLLER.tr("-", "_")}_calendar_month_outlet".freeze
+        def self.default_opts
+          {
+            input:   { data: { combobox_date_date_value: nil } },
+            popover: { label: "Picker", role: "dialog", tag: :div }
+          }
+        end
+        def render(value: nil, **_kwargs)
+          calendar_id = "combobox_date_#{SecureRandom.hex(8)}_calendar"
+          template.content_tag(
+            :div,
+            data: {
+              controller:        PICKER_CONTROLLER,
+              CALENDAR_OUTLET_KEY => "##{calendar_id}",
+              action:            [
+                "calendar-month-observer:selected->#{PICKER_CONTROLLER}#onSelected",
+                "#{PICKER_CONTROLLER}:selected->input-combobox#onSelected"
+              ].join(" ")
+            }.tap { |d| d["#{PICKER_CONTROLLER.tr("-", "_")}_date_value"] = value if value }
+          ) do
+            template.safe_join([navigation, calendar_month(id: calendar_id)])
+          end
+        end
+        private
+        def navigation
+          DatePicker::Navigation.new(template).render(
+            step:                "month",
+            stimulus_controller: PICKER_CONTROLLER
+          )
+        end
+        def calendar_month(**kwargs)
+          Calendar::Renderer.new(template).month(**kwargs)
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/combobox/dropdown.rb ADDED Viewed

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      # Renders a static listbox popover body with combobox-dropdown controller.
+      # Supports flat options, descriptions, and option groups.
+      class Dropdown < Plumber::Base
+        include OptionGroup
+        DROPDOWN_CONTROLLER = "combobox-dropdown"
+        DROPDOWN_ACTION     = [
+          "click->combobox-dropdown#select",
+          "keydown->combobox-dropdown#navigate",
+          "combobox-dropdown:selected->input-combobox#onSelected"
+        ].join(" ").freeze
+        def self.default_opts
+          {
+            popover: {
+              tag:      :div,
+              haspopup: "listbox",
+              data:     { controller: DROPDOWN_CONTROLLER, action: DROPDOWN_ACTION }
+            }
+          }
+        end
+        def render(options: [], value: nil, label: nil, **_kwargs)
+          listbox_attrs = { role: "listbox", data: { "#{DROPDOWN_CONTROLLER}_target": "listbox" } }
+          listbox_attrs[:aria] = { label: label } if label
+          listbox = template.content_tag(:ul, **listbox_attrs) do
+            render_items(options, value: value)
+          end
+          template.safe_join([listbox])
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/combobox/option.rb ADDED Viewed

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      class Option < Plumber::Base
+        def render(label:, value:, description: nil, disabled: false, selected: false)
+          aria = { selected: selected ? "true" : "false" }
+          aria[:disabled] = "true" if disabled
+          template.content_tag(:li, role: "option", aria: aria, data: { value: value }) do
+            if description
+              template.safe_join(
+                [
+                  template.content_tag(:span, label),
+                  template.content_tag(:span, description)
+                ]
+              )
+            else
+              label
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/combobox/option_group.rb ADDED Viewed

@@ -0,0 +1,52 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      module OptionGroup
+        private
+        def render_items(items, value: nil)
+          @selected_value = value.to_s
+          template.safe_join(items.map { |item| render_item(item) })
+        end
+        def render_item(item)
+          case item
+          when Hash
+            item.key?(:options) ? render_group(item[:label], item[:options]) : render_option_hash(item)
+          else
+            render_option(item[0], item[1].to_s, item[2] || {})
+          end
+        end
+        def render_option_hash(item)
+          render_option(item[:label], item[:value].to_s, item.except(:label, :value))
+        end
+        def render_option(label, value, attrs = {})
+          Option.new(template).render(
+            label:       label,
+            value:       value,
+            selected:    @selected_value == value,
+            disabled:    attrs[:disabled] || false,
+            description: attrs[:description]
+          )
+        end
+        def render_group(label, options)
+          template.content_tag(:li, role: "group", aria: { label: label }) do
+            template.safe_join(
+              [
+                template.content_tag(:span, label, aria: { hidden: "true" }),
+                template.content_tag(:ul) do
+                  template.safe_join(options.map { |opt| render_item(opt) })
+                end
+              ]
+            )
+          end
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/combobox/renderer.rb ADDED Viewed

@@ -0,0 +1,78 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      class Renderer < Plumber::Base
+        STIMULUS_CONTROLLER = "input-combobox"
+        FORMAT_CONTROLLER   = "input-format"
+        FORMAT_ACTION       = "input-combobox:changed->input-format#format"
+        def render(base_id:, options: {}, **kwargs)
+          popover_id    = "#{base_id}_popover"
+          initial_value = options.dig(:input, :value)
+          base_data = {
+            controller: "#{STIMULUS_CONTROLLER} #{FORMAT_CONTROLLER}",
+            action:     FORMAT_ACTION
+          }
+          base_data[:input_combobox_value_value] = initial_value if initial_value.present?
+          html_options = merge_html_options({ data: base_data }, kwargs)
+          template.content_tag(:div, **html_options) do
+            template.safe_join(
+              [
+                trigger_input(
+                  popover_id,
+                  options.dig(:popover, :haspopup) || options.dig(:popover, :role) || "dialog",
+                  options.fetch(:trigger, {})
+                ),
+                hidden_input(options.fetch(:input, {})),
+                popover_element(popover_id, options.fetch(:popover, {}))
+              ]
+            )
+          end
+        end
+        private
+        def trigger_input(popover_id, haspopup, opts)
+          base_data = {
+            "#{STIMULUS_CONTROLLER}_target": "trigger",
+            input_format_target:             "input",
+            action:                          "focus->#{STIMULUS_CONTROLLER}#open keydown.esc->#{STIMULUS_CONTROLLER}#close"
+          }
+          data = merge_data_options(base_data, opts.fetch(:data, {}).symbolize_keys)
+          aria = { haspopup: haspopup, expanded: "false", controls: popover_id }
+          aria[:autocomplete] = opts[:aria_autocomplete] if opts[:aria_autocomplete]
+          aria[:label]        = opts[:aria_label]        if opts[:aria_label]
+          template.tag.input(
+            type:     "text",
+            readonly: (opts.fetch(:readonly, true) ? true : nil),
+            role:     "combobox",
+            aria:     aria,
+            data:     data
+          )
+        end
+        def hidden_input(opts)
+          data = { "#{STIMULUS_CONTROLLER}_target": "value" }.merge(opts.fetch(:data, {}))
+          template.tag.input(type: "hidden", name: opts[:name], value: opts[:value], data: data)
+        end
+        def popover_element(popover_id, opts)
+          base_data = { "#{STIMULUS_CONTROLLER}_target": "popover" }
+          data = merge_data_options(base_data, (opts[:data] || {}).symbolize_keys)
+          attrs = { id: popover_id, hidden: "", data: data }
+          attrs[:role] = opts[:role] if opts[:role]
+          attrs[:aria] = { label: opts[:label] } if opts[:label]
+          template.content_tag(opts.fetch(:tag, :div), **attrs) { opts[:content] }
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/combobox/time.rb ADDED Viewed

@@ -0,0 +1,103 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module Combobox
+      # Renders an iOS-style drum/wheel time picker as the popover body.
+      # Wires ComboboxTimeController; dispatches combobox-time:selected → InputComboboxController.
+      class Time < Plumber::Base
+        PICKER_CONTROLLER = "combobox-time"
+        def self.default_opts
+          {
+            popover: { label: "Picker", role: "dialog", tag: :div }
+          }
+        end
+        def render(format: :h12, step: 1, value: nil, **_kwargs)
+          @format = format
+          @step   = [1, step.to_i].max
+          @time   = parse_time(value)
+          template.content_tag(
+            :div,
+            data: {
+              controller: PICKER_CONTROLLER,
+              action:     "#{PICKER_CONTROLLER}:selected->input-combobox#onSelected"
+            }
+          ) do
+            template.safe_join(drums)
+          end
+        end
+        private
+        def drums
+          cols = [hour_drum, minute_drum]
+          cols << period_drum if @format == :h12
+          cols
+        end
+        def hour_drum
+          drum.render(target: "hour", label: "Hour", items: hour_items, selected: current_hour)
+        end
+        def minute_drum
+          items = (0...60).step(@step).map do |m|
+            s = m.to_s.rjust(2, "0")
+            [s, s]
+          end
+          selected = @time ? snap_minute(@time.min).to_s.rjust(2, "0") : nil
+          drum.render(target: "minute", label: "Minute", items: items, selected: selected)
+        end
+        def period_drum
+          selected = if @time
+                       @time.hour < 12 ? "AM" : "PM"
+                     end
+          drum.render(target: "period", label: "Period", items: [%w[AM AM], %w[PM PM]], selected: selected)
+        end
+        def hour_items
+          if @format == :h12
+            (1..12).map { |h| [h.to_s, h.to_s] }
+          else
+            (0..23).map do |h|
+              s = h.to_s.rjust(2, "0")
+              [s, s]
+            end
+          end
+        end
+        def current_hour
+          return nil unless @time
+          if @format == :h12
+            h = @time.hour % 12
+            (h.zero? ? 12 : h).to_s
+          else
+            @time.hour.to_s.rjust(2, "0")
+          end
+        end
+        def snap_minute(minute)
+          return minute if @step == 1
+          ((minute.to_f / @step).round * @step) % 60
+        end
+        def drum
+          TimePicker::Renderer.new(template)
+        end
+        def parse_time(value)
+          return nil if value.nil? || value.to_s.strip.empty?
+          ::Time.parse(value.to_s)
+        rescue ArgumentError
+          nil
+        end
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/date_picker/navigation.rb CHANGED Viewed

@@ -4,7 +4,7 @@ module StimulusPlumbers
   module Components
     module DatePicker
       class Navigation < Plumber::Base
-        def render(stimulus_controller:, step:, **kwargs)
+        def render(step:, stimulus_controller:, **kwargs)
           html_options = merge_html_options(
             { classes: theme.resolve(:calendar_navigation).fetch(:classes, ""), aria: { label: "DatePicker Navigation" } },
             kwargs

data/lib/stimulus_plumbers/components/plumber/html_options.rb CHANGED Viewed

@@ -9,10 +9,29 @@ module StimulusPlumbers
         extend ActiveSupport::Concern
         def merge_html_options(*hashes)
-          classes = hashes.flat_map { |h| [h[:class], h[:classes]] }
-          rest    = hashes.map { |h| h.except(:class, :classes) }.reduce({}, :deep_merge)
+          classes     = hashes.flat_map { |h| [h[:class], h[:classes]] }
+          data_hashes = hashes.map { |h| h[:data] || {} }
+          rest        = hashes.map { |h| h.except(:class, :classes, :data) }.reduce({}, :deep_merge)
           class_value = merge_string_option(*classes).presence
-          class_value ? rest.merge(class: class_value) : rest
+          merged_data = merge_data_options(*data_hashes)
+          result = class_value ? rest.merge(class: class_value) : rest
+          merged_data.present? ? result.merge(data: merged_data) : result
+        end
+        STIMULUS_SPACEJOIN_KEYS = %i[controller action].freeze
+        def merge_data_options(*hashes, spacejoin: STIMULUS_SPACEJOIN_KEYS)
+          hashes.reduce({}) do |acc, d|
+            acc.merge(d) do |key, old_val, new_val|
+              if spacejoin.include?(key.to_sym)
+                merge_string_option(old_val, new_val).presence || new_val
+              else
+                new_val
+              end
+            end
+          end
         end
         def merge_string_option(*parts, delimiter: " ")

data/lib/stimulus_plumbers/components/time_picker/renderer.rb ADDED Viewed

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+module StimulusPlumbers
+  module Components
+    module TimePicker
+      # Renders a single scrollable drum column (hour, minute, or period) as a listbox.
+      class Renderer < Plumber::Base
+        CONTROLLER = "combobox-time"
+        def render(items:, label:, target:, selected: nil)
+          template.content_tag(
+            :ul,
+            role: "listbox",
+            aria: { label: label },
+            data: {
+              "#{CONTROLLER}_target": target,
+              action:                 "click->#{CONTROLLER}#select keydown->#{CONTROLLER}#navigate"
+            }
+          ) do
+            template.safe_join(items.map { |text, value| render_item(text, value, selected) })
+          end
+        end
+        private
+        def render_item(text, value, selected)
+          template.content_tag(
+            :li,
+            text,
+            role: "option",
+            aria: { selected: value.to_s == selected.to_s ? "true" : "false" },
+            data: { value: value }
+          )
+        end
+      end
+    end
+  end
+end