stimulus_plumbers 0.2.9 → 0.3.1

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

@@ -12,7 +12,7 @@ module StimulusPlumbers
           }
         end
 
-        def render(format: :h12, step: 1, value: nil, **_kwargs)
+        def render(format: :h12, step: 1, value: nil)
           @format = format
           @step   = [1, step.to_i].max
           @time   = parse_time(value)

data/lib/stimulus_plumbers/components/combobox/trigger.rb

@@ -11,25 +11,34 @@ module StimulusPlumbers
           readonly: true,
           aria_autocomplete: nil,
           aria_label: nil,
+          aria: {},
+          id: nil,
           data: {},
-          **_rest
+          **kwargs
         )
-          base_data = {
+          stimulus_data = {
             "#{stimulus_controller}_target": "trigger",
             input_format_target:             "input",
             action:                          "focus->#{stimulus_controller}#open keydown.esc->#{stimulus_controller}#close"
           }
 
-          aria = { haspopup: haspopup, expanded: "false", controls: popover_id }
-          aria[:autocomplete] = aria_autocomplete if aria_autocomplete
-          aria[:label]        = aria_label        if aria_label
+          trigger_aria = { haspopup: haspopup, expanded: "false", controls: popover_id }
+          trigger_aria[:autocomplete] = aria_autocomplete if aria_autocomplete
+          trigger_aria[:label]        = aria_label        if aria_label
 
           template.tag.input(
-            type:     "text",
-            readonly: (readonly ? true : nil),
-            role:     "combobox",
-            aria:     aria,
-            data:     merge_data_options(base_data, data.symbolize_keys)
+            **merge_html_options(
+              { classes: theme.resolve(:combobox_trigger).fetch(:classes, "") },
+              {
+                id:       id,
+                type:     "text",
+                readonly: (readonly ? true : nil),
+                role:     "combobox",
+                aria:     trigger_aria.deep_merge(aria),
+                data:     merge_data_options(stimulus_data, data)
+              },
+              kwargs
+            )
           )
         end
       end

data/lib/stimulus_plumbers/components/combobox.rb

@@ -7,52 +7,62 @@ module StimulusPlumbers
       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?
+      def self.popover_id_for(trigger_id)
+        [trigger_id, "popover"].compact.join("_")
+      end
 
-        html_options = merge_html_options({ data: base_data }, kwargs)
+      def render(trigger: {}, input: {}, popover: {}, **kwargs, &block)
+        popover_id    = self.class.popover_id_for(trigger[:id])
+        initial_value = input[:value]
+        haspopup      = popover.delete(:haspopup) { popover[:role] || "dialog" }
+        html_options  = merge_html_options({ data: build_stimulus_data(initial_value) }, kwargs)
 
         template.content_tag(:div, **html_options) do
           template.safe_join(
             [
-              trigger(popover_id, options),
-              hidden_input(options.fetch(:input, {})),
-              popover(popover_id, options)
+              combobox_trigger(popover_id, trigger, haspopup),
+              hidden_input(input),
+              combobox_popover(popover_id, popover, &block)
             ]
           )
         end
       end
 
-      def trigger(popover_id, options)
-        haspopup = options.dig(:popover, :haspopup) || options.dig(:popover, :role) || "dialog"
+      private
+
+      def build_stimulus_data(initial_value)
+        {
+          controller: "#{STIMULUS_CONTROLLER} #{FORMAT_CONTROLLER}",
+          action:     FORMAT_ACTION
+        }.tap do |data|
+          data[:input_combobox_value_value] = initial_value if initial_value.present?
+        end
+      end
+
+      def combobox_trigger(popover_id, trigger, haspopup)
         Combobox::Trigger.new(template).render(
           stimulus_controller: STIMULUS_CONTROLLER,
           popover_id:          popover_id,
           haspopup:            haspopup,
-          **options.fetch(:trigger, {})
+          **trigger
         )
       end
 
-      def popover(popover_id, options)
+      def combobox_popover(popover_id, popover, &block)
         Combobox::Popover.new(template).render(
           stimulus_controller: STIMULUS_CONTROLLER,
           id:                  popover_id,
-          **options.fetch(:popover, {})
+          **popover,
+          &block
         )
       end
 
-      private
-
-      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)
+      def hidden_input(input)
+        stimulus_data = merge_html_options(
+          { "#{STIMULUS_CONTROLLER}_target": "value" },
+          input.fetch(:data, {})
+        )
+        template.tag.input(type: "hidden", name: input[:name], value: input[:value], data: stimulus_data)
       end
     end
   end

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

@@ -19,30 +19,22 @@ module StimulusPlumbers
 
         def navigators(stimulus_controller, step)
           [
-            Navigator.new(template).render(
-              icon_options: { name: "arrow-left" },
-              aria:         { label: ["previous", step].join(" ").titleize },
-              data:         { "#{stimulus_controller}-target" => "previous" }
-            ),
-            Navigator.new(template).render(
-              aria: { label: "Day" },
-              data: { "#{stimulus_controller}-target" => "day" }
-            ),
-            Navigator.new(template).render(
-              aria: { label: "Month" },
-              data: { "#{stimulus_controller}-target" => "month" }
-            ),
-            Navigator.new(template).render(
-              aria: { label: "Year" },
-              data: { "#{stimulus_controller}-target" => "year" }
-            ),
-            Navigator.new(template).render(
-              icon_options: { name: "arrow-right" },
-              aria:         { label: ["next", step].join(" ").titleize },
-              data:         { "#{stimulus_controller}-target" => "next" }
-            )
+            navigator(stimulus_controller, target: "previous", icon: "arrow-left", label: ["previous", step].join(" ").titleize),
+            navigator(stimulus_controller, target: "day",      label: "Day"),
+            navigator(stimulus_controller, target: "month",    label: "Month"),
+            navigator(stimulus_controller, target: "year",     label: "Year"),
+            navigator(stimulus_controller, target: "next",     icon: "arrow-right", label: ["next", step].join(" ").titleize)
           ]
         end
+
+        def navigator(stimulus_controller, target:, label:, icon: nil)
+          opts = {
+            aria: { label: label },
+            data: { "#{stimulus_controller}-target" => target }
+          }
+          opts[:icon_options] = { name: icon } if icon
+          Navigator.new(template).render(**opts)
+        end
       end
     end
   end

data/lib/stimulus_plumbers/components/divider.rb

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+module StimulusPlumbers
+  module Components
+    class Divider < Plumber::Base
+      def render(**kwargs)
+        html_options = merge_html_options(
+          { classes: theme.resolve(:divider).fetch(:classes, "") },
+          kwargs
+        )
+
+        template.tag.hr(**html_options)
+      end
+    end
+  end
+end

data/lib/stimulus_plumbers/components/icon.rb

@@ -3,44 +3,38 @@
 module StimulusPlumbers
   module Components
     class Icon < Plumber::Base
-      ICONS = {
-        "arrow-left"  => "M10.5 19.5 3 12m0 0 7.5-7.5M3 12h18",
-        "arrow-right" => "M13.5 4.5 21 12m0 0-7.5 7.5M21 12H3",
-        "arrow-up"    => "M4.5 10.5 12 3m0 0 7.5 7.5M12 3v18",
-        "arrow-down"  => "M19.5 13.5 12 21m0 0-7.5-7.5M12 21V3"
-      }.freeze
-
       def render(name:, **kwargs)
         html_options = merge_html_options(
           { classes: theme.resolve(:icon).fetch(:classes, "") },
           kwargs
         )
 
-        if ICONS[name]
-          svg_icon(ICONS[name], html_options)
+        icon_data = Themes::Schema::Icon.resolve(theme.icons[name])
+        if icon_data
+          svg_icon(icon_data, html_options)
         else
-          template.content_tag(:span, nil, **html_options)
+          template.tag.span(**html_options)
         end
       end
 
       private
 
-      def svg_icon(path, html_options)
+      def svg_icon(icon_data, html_options)
         template.content_tag(
           :svg,
           xmlns:          "http://www.w3.org/2000/svg",
-          fill:           "none",
-          viewBox:        "0 0 24 24",
-          width:          "24",
-          height:         "24",
-          "stroke-width": "1.5",
-          stroke:         "currentColor",
+          fill:           icon_data[:fill],
+          viewBox:        icon_data[:view_box],
+          width:          icon_data[:width],
+          height:         icon_data[:height],
+          stroke:         icon_data[:stroke],
+          "stroke-width": icon_data[:stroke_width],
           **html_options
         ) do
           template.tag.path(
-            "stroke-linecap":  "round",
-            "stroke-linejoin": "round",
-            d:                 path
+            "stroke-linecap":  icon_data[:stroke_linecap],
+            "stroke-linejoin": icon_data[:stroke_linejoin],
+            d:                 icon_data[:d]
           )
         end
       end

data/lib/stimulus_plumbers/components/popover/builder.rb

@@ -8,8 +8,8 @@ module StimulusPlumbers
 
         def initialize(template)
           @template = template
-          @activator_html = "".html_safe
-          @content_html   = "".html_safe
+          @activator_html = nil
+          @content_html   = nil
         end
 
         def activator(&block)

data/lib/stimulus_plumbers/components/popover.rb

@@ -13,12 +13,17 @@ module StimulusPlumbers
         template.capture(builder, &block)
 
         template.content_tag(:div, **html_options) do
-          wrapped_content = if interactive
-                              template.content_tag(:template, builder.content_html)
-                            else
-                              builder.content_html
-                            end
-          template.safe_join([builder.activator_html, wrapped_content])
+          template.safe_join([builder.activator_html, wrap_content(interactive, builder)])
+        end
+      end
+
+      private
+
+      def wrap_content(interactive, builder)
+        if interactive
+          template.content_tag(:template, builder.content_html)
+        else
+          builder.content_html
         end
       end
     end

data/lib/stimulus_plumbers/configuration.rb

@@ -1,19 +1,14 @@
 # frozen_string_literal: true
 
 require_relative "themes/base"
-require_relative "themes/tailwind_theme"
+require_relative "themes/configuration"
 
 module StimulusPlumbers
   class Configuration
-    DEFAULT_LOG_FORMATTER  = ->(message) { "[StimulusPlumbers] #{message}" }
-    THEME_KLASS_FORMATTER  = ->(type) { "StimulusPlumbers::Themes::#{type.to_s.classify}Theme" }
+    DEFAULT_LOG_FORMATTER = ->(message) { "[StimulusPlumbers] #{message}" }
 
     def theme
-      @theme ||= build_theme(:tailwind)
-    end
-
-    def theme=(value)
-      @theme = build_theme(value)
+      @theme ||= Themes::Configuration.new
     end
 
     def log_formatter
@@ -25,15 +20,5 @@ module StimulusPlumbers
 
       @log_formatter = callable
     end
-
-    private
-
-    def build_theme(type)
-      return type if type.is_a?(Themes::Base)
-
-      klass_name = THEME_KLASS_FORMATTER.call(type)
-      klass_name.safe_constantize&.new or
-        raise ArgumentError, "Unknown theme #{type.inspect}: #{klass_name} is not defined."
-    end
   end
 end

data/lib/stimulus_plumbers/engine.rb

@@ -8,8 +8,8 @@ module StimulusPlumbers
 
     config.autoload_paths << File.expand_path("../stimulus-plumbers", __dir__)
 
-    initializer "stimulus_plumbers.assets" do |app|
-      app.config.assets.paths << root.join("app/assets/javascripts")
+    initializer "stimulus_plumbers.assets", after: :set_default_precompile do |app|
+      app.config.assets.precompile += %w[stimulus_plumbers/tokens.css] if app.config.respond_to?(:assets)
     end
 
     initializer "stimulus_plumbers.helpers" do

data/lib/stimulus_plumbers/form/builder.rb

@@ -3,63 +3,59 @@
 require "action_view/version"
 
 require_relative "field"
-require_relative "fields/choice"
-require_relative "fields/combobox"
-require_relative "fields/file"
-require_relative "fields/password"
-require_relative "fields/renderer"
-require_relative "fields/search"
-require_relative "fields/select"
-require_relative "fields/text"
-require_relative "fields/text_area"
-require_relative "fields/submit"
+require_relative "fields/fieldset"
+require_relative "fields/inputs/choice"
+require_relative "fields/inputs/datetime"
+require_relative "fields/inputs/file"
+require_relative "fields/inputs/password"
+require_relative "fields/inputs/search"
+require_relative "fields/inputs/select"
+require_relative "fields/inputs/select/grouped"
+require_relative "fields/inputs/select/timezone"
+require_relative "fields/inputs/select/weekday"
+require_relative "fields/inputs/submit"
+require_relative "fields/inputs/text"
+require_relative "fields/inputs/text_area"
 require_relative "../plumber/html_options"
 
 module StimulusPlumbers
   module Form
     class Builder < ActionView::Helpers::FormBuilder
       include Plumber::HtmlOptions
-      include Fields::Choice
-      include Fields::Combobox
-      include Fields::File
-      include Fields::Password
-      include Fields::Search
-      include Fields::Select
-      include Fields::Submit
-      include Fields::Text
-      include Fields::TextArea
+      include Fields::Inputs::Choice
+      include Fields::Inputs::Datetime
+      include Fields::Inputs::File
+      include Fields::Inputs::Password
+      include Fields::Inputs::Search
+      include Fields::Inputs::Select
+      include Fields::Inputs::Select::Grouped
+      include Fields::Inputs::Select::Timezone
+      include Fields::Inputs::Select::Weekday
+      include Fields::Inputs::Submit
+      include Fields::Inputs::Text
+      include Fields::Inputs::TextArea
 
       private
 
-      def build_field(attribute, form_field_opts, input_id: field_id(attribute))
-        Field.new(
-          object:           object,
-          attribute:        attribute,
-          input_id:         input_id,
-          label:            form_field_opts[:label],
-          details:          form_field_opts[:details],
-          error:            form_field_opts[:error],
-          required:         form_field_opts.fetch(:required, false),
-          label_visibility: form_field_opts.fetch(:label_visibility, :visible),
-          layout:           form_field_opts.fetch(:layout, :stacked)
-        )
+      def render_fieldset(attribute, field, &block)
+        Fields::Fieldset.new(@template).render(object, attribute, field_id(attribute), field, &block)
       end
 
-      def render_field(field, input_html)
-        Fields::Renderer.new(@template, theme, field).call(input_html)
+      def render_input_group(error:, leading: nil, trailing: nil, **wrapper_opts, &block)
+        Fields::InputGroup.new(@template).render(leading: leading, trailing: trailing, error: error, **wrapper_opts, &block)
       end
 
-      def build_input_group(input_tag, field, trailing:, **wrapper_opts)
-        @template.content_tag(
-          :div,
-          input_tag.html_safe + trailing,
-          class: field_theme(:form_input_group, error: field.error?)[:class],
-          **wrapper_opts
+      def render_combobox(attribute, input_id:, opts:, err:, **wrapper_opts, &block)
+        combobox_opts = opts.deep_merge(
+          input:   { name: field_name(attribute) },
+          trigger: { id: input_id }
         )
-      end
 
-      def extract_options(options)
-        [options.except(*Field::OPTIONS), options.slice(*Field::OPTIONS)]
+        Components::Combobox.new(@template).render(
+          **combobox_opts,
+          **merge_html_options(wrapper_opts, field_theme(:form_combobox, error: err)),
+          &block
+        )
       end
 
       def field_theme(key, **variants)
@@ -67,11 +63,11 @@ module StimulusPlumbers
       end
 
       def theme
-        StimulusPlumbers.config.theme
+        StimulusPlumbers.config.theme.current
       end
 
       # rubocop:disable Metrics/PerceivedComplexity, Metrics/CyclomaticComplexity
-      if ActionView.version < "7.0"
+      if ActionView.version < Gem::Version.new("7.0")
         # field_id was added in Rails 7.0, backports it to Rails 6.1.
         # https://github.com/rails/rails/blob/2d670320f7b02ae879545d5202f0633841b8f196/actionview/lib/action_view/helpers/form_helper.rb#L1777
         # https://github.com/rails/rails/blob/2d670320f7b02ae879545d5202f0633841b8f196/actionview/lib/action_view/helpers/form_tag_helper.rb#L101

data/lib/stimulus_plumbers/form/field.rb

@@ -3,79 +3,130 @@
 module StimulusPlumbers
   module Form
     class Field
-      OPTIONS = %i[label details error required label_visibility layout reveal clearable].freeze
+      attr_reader :label, :required, :layout
 
-      attr_reader :object,
-                  :attribute,
-                  :input_id,
-                  :label_text,
-                  :details,
-                  :required,
-                  :label_visibility,
-                  :layout
+      def self.label_id(input_id)
+        [input_id, "label"].compact.join("_")
+      end
 
       def initialize(
-        object:,
-        attribute:,
-        input_id:,
+        template,
         label: nil,
-        details: nil,
+        hint: nil,
         error: nil,
         required: false,
-        label_visibility: :visible,
-        layout: :stacked
+        hide_label: false,
+        layout: :stacked,
+        **kwargs
       )
-        @object           = object
-        @attribute        = attribute
-        @input_id         = input_id
-        @label_text       = label || attribute.to_s.humanize
-        @details          = details
-        @error_override   = error
-        @required         = required
-        @label_visibility = label_visibility.to_sym
-        @layout           = layout.to_sym
+        @template       = template
+        @label          = label
+        @hint           = hint
+        @error_override = error
+        @required       = required
+        @hide_label     = hide_label
+        @layout         = layout.to_sym
+        @kwargs         = kwargs
+      end
+
+      def label_hidden?
+        @hide_label
+      end
+
+      def error?(object, attribute)
+        build_errors(object, attribute).any?
       end
 
-      def errors
+      def described_by(object, attribute, input_id)
+        ids = []
+        ids << hint_id(input_id) if @hint.present?
+        ids.concat(build_error_ids(object, attribute, input_id))
+        ids.join(" ").presence
+      end
+
+      def render(object, attribute, input_id:, &block)
+        @label ||= attribute.to_s.humanize
+        error          = error?(object, attribute)
+        aria           = build_aria(object, attribute, input_id)
+        generated_opts = build_html_options(input_id, aria)
+        field_html     = @template.capture(generated_opts, @kwargs, error, &block)
+        Fields::Group.new(@template).render(layout: @layout, error: error) do
+          @template.safe_join(
+            [
+              field_label(input_id),
+              field_html,
+              render_hint(input_id),
+              render_errors(object, attribute, input_id)
+            ]
+          )
+        end
+      end
+
+      def render_hint(input_id)
+        Fields::Hint.new(@template).render(text: @hint, id: hint_id(input_id)) if @hint.present?
+      end
+
+      def render_errors(object, attribute, input_id)
+        errs = build_errors(object, attribute)
+        return if errs.none?
+
+        @template.safe_join(
+          errs.map.with_index do |message, i|
+            Fields::Error.new(@template).render(message: message, id: build_error_ids(object, attribute, input_id)[i])
+          end
+        )
+      end
+
+      private
+
+      def build_errors(object, attribute)
         if @error_override
           Array(@error_override)
         elsif object.respond_to?(:errors)
-          object.errors[@attribute]
+          object.errors[attribute]
         else
           []
         end
       end
 
-      def error?
-        errors.any?
+      def build_aria(object, attribute, input_id)
+        aria = {}
+        aria[:describedby] = described_by(object, attribute, input_id)
+        aria[:invalid]     = "true" if error?(object, attribute)
+        aria[:required]    = "true" if @required
+        aria.compact
       end
 
-      def html_opts
-        attrs = { id: input_id }
-        attrs[:"aria-describedby"] = described_by if described_by
-        attrs[:"aria-invalid"]     = "true"       if error?
-        attrs[:required]           = true         if required
-        attrs[:"aria-required"]    = "true"       if required
+      def build_html_options(input_id, aria)
+        attrs = { id: input_id, aria: aria }
+        attrs[:required] = true if @required
         attrs
       end
 
-      def hint_id
-        "#{input_id}_hint"
+      def hint_id(input_id)
+        [input_id, "hint"].compact.join("_")
       end
 
-      def error_id
-        "#{input_id}_error"
+      def error_id(input_id)
+        [input_id, "error"].compact.join("_")
       end
 
-      def described_by
-        ids = []
-        ids << hint_id  if details.present?
-        ids << error_id if errors.any?
-        ids.join(" ").presence
+      def build_error_ids(object, attribute, input_id)
+        errs = build_errors(object, attribute)
+        return [] if errs.none?
+        return [error_id(input_id)] if errs.one?
+
+        errs.each_index.map { |i| [error_id(input_id), i + 1].compact.join("_") }
       end
 
-      def label_hidden?
-        label_visibility == :exclusive
+      def field_label(input_id)
+        Fields::Label.new(@template).render(
+          text:     @label,
+          for_id:   input_id,
+          id:       self.class.label_id(input_id),
+          required: @required,
+          hidden:   @hide_label
+        )
       end
     end
   end

data/lib/stimulus_plumbers/form/fields/error.rb

@@ -5,8 +5,8 @@ module StimulusPlumbers
     module Fields
       class Error < Plumber::Base
         def render(message:, id:)
-          klass = theme.resolve(:form_error).fetch(:classes, "")
-          template.content_tag(:p, message, id: id, class: klass.presence, role: "alert")
+          html_options = merge_html_options(theme.resolve(:form_error))
+          template.content_tag(:p, message, id: id, role: "alert", **html_options)
         end
       end
     end