nitro_kit 0.9.0 → 2.0.0.alpha.2

data/app/components/nitro_kit/field_group.rb

@@ -2,18 +2,25 @@
 
 module NitroKit
   class FieldGroup < Component
-    def initialize(**attrs)
-      super(attrs, class: base_class, data: { slot: "control" })
+    def initialize(
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      super(
+        component: :field_group,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
+      )
     end
 
     def view_template(&block)
-      div(**attrs, &block)
-    end
-
-    private
+      raise ArgumentError, "field group requires a block" unless block
 
-    def base_class
-      "space-y-6"
+      div(**root_attributes, &block)
     end
   end
 end

data/app/components/nitro_kit/fieldset.rb

@@ -2,57 +2,55 @@
 
 module NitroKit
   class Fieldset < Component
-    def initialize(legend: nil, description: nil, **attrs)
-      @legend = legend
-      @description = description
-      super(
-        attrs,
-        class: base_class
-      )
-    end
+    alias :html_legend :legend
 
-    def view_template
-      fieldset(**attrs) do
-        legend(@legend) if @legend
-        description(@description) if @description
+    def initialize(
+      legend: nil,
+      description: nil,
+      disabled: false,
+      name: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      @legend_content = content_from_keyword(:legend, legend)
+      @description_content = content_from_keyword(:description, description)
+      disabled = validate_boolean!(:disabled, disabled)
 
-        yield
-      end
+      super(
+        component: :fieldset,
+        attributes: { disabled:, name: }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
+      )
     end
 
-    alias :html_legend :legend
+    def view_template(&block)
+      raise ArgumentError, "Fieldset requires a block" unless block
 
-    def legend(text = nil, **attrs, &block)
-      builder do
-        html_legend(**mattr(attrs, class: legend_class)) do
-          text_or_block(text, &block)
-        end
-      end
-    end
+      fields = capture(self) { |fieldset| yield fieldset }
+      require_content!("Fieldset", :legend, @legend_content)
 
-    def description(text = nil, **attrs, &block)
-      builder do
-        div(**mattr(attrs, class: description_class, data: { slot: "text" })) do
-          text_or_block(text, &block)
+      fieldset(**root_attributes) do
+        html_legend(**slot_attributes(:legend)) { render_deferred_content(@legend_content) }
+        if @description_content
+          p(**slot_attributes(:description)) { render_deferred_content(@description_content) }
         end
+        div(**slot_attributes(:fields)) { raw(safe(fields)) }
       end
     end
 
-    private
-
-    def base_class
-      [
-        "[&>*+[data-slot=control]]:mt-6 [&>*+[data-slot=text]]:mt-1",
-        "[&+&]:mt-8"
-      ]
-    end
-
-    def legend_class
-      "text-lg font-semibold"
+    def legend(text = nil, &block)
+      @legend_content = declare_content(:legend, @legend_content, text, &block)
+      nil
     end
 
-    def description_class
-      "text-sm text-muted-content"
+    def description(text = nil, &block)
+      @description_content = declare_content(:description, @description_content, text, &block)
+      nil
     end
   end
 end

data/app/components/nitro_kit/flex.rb

@@ -0,0 +1,49 @@
+# frozen_string_literal: true
+
+module NitroKit
+  class Flex < Component
+    GAPS = LayoutOptions::GAPS
+    DIRECTIONS = %i[row col row_reverse col_reverse].freeze
+    ALIGNMENTS = %i[start center end stretch baseline].freeze
+    JUSTIFICATIONS = %i[start center end between around evenly].freeze
+    WRAPS = %i[nowrap wrap wrap_reverse].freeze
+
+    def initialize(
+      dir:,
+      gap: 4,
+      align: :start,
+      justify: :start,
+      wrap: :nowrap,
+      id: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      dir = responsive_value(:dir, dir, DIRECTIONS)
+      gap = responsive_value(:gap, gap, GAPS)
+      align = responsive_value(:align, align, ALIGNMENTS)
+      justify = responsive_value(:justify, justify, JUSTIFICATIONS)
+      wrap = responsive_value(:wrap, wrap, WRAPS)
+
+      super(
+        component: :flex,
+        attributes: { id:, data: { dir:, gap:, align:, justify:, wrap: } }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
+      )
+    end
+
+    def view_template
+      div(**root_attributes) { yield if block_given? }
+    end
+
+    private
+
+    def responsive_value(property, value, allowed)
+      ResponsiveValue.new(property:, value:, allowed:).to_s
+    end
+  end
+end

data/app/components/nitro_kit/form_builder.rb

@@ -2,102 +2,343 @@
 
 module NitroKit
   class FormBuilder < ActionView::Helpers::FormBuilder
-    # Fields
+    FIELD_TYPES = {
+      color_field: :color,
+      date_field: :date,
+      datetime_field: :datetime_local,
+      datetime_local_field: :datetime_local,
+      email_field: :email,
+      file_field: :file,
+      hidden_field: :hidden,
+      month_field: :month,
+      number_field: :number,
+      password_field: :password,
+      phone_field: :tel,
+      range_field: :range,
+      search_field: :search,
+      telephone_field: :tel,
+      text_area: :textarea,
+      text_field: :text,
+      time_field: :time,
+      url_field: :url,
+      week_field: :week
+    }.freeze
+    CONTROL_OPTIONS = %i[
+      id name value placeholder disabled readonly required autocomplete checked
+      multiple accept min max step minlength maxlength rows cols wrap pattern inputmode
+    ].freeze
+    UNSUPPORTED_HELPERS = {
+      label: "form.field(:attribute, label: \"...\")",
+      collection_select: "form.field(:attribute, as: :select, options: ...)",
+      grouped_collection_select: "form.field(:attribute, as: :select, option_tags: ...)",
+      collection_radio_buttons: "form.field(:attribute, as: :radio_group, options: ...)",
+      collection_check_boxes: "NitroKit::CheckboxGroup through form.field(:attribute, as: :checkbox)",
+      date_select: "form.field(:attribute, as: :date)",
+      time_zone_select: "form.field(:attribute, as: :select, options: ...)"
+    }.freeze
 
-    def fieldset(**attrs, &block)
-      @template.render(NitroKit::Fieldset.new(**attrs), &block)
+    UNSUPPORTED_HELPERS.each do |method_name, replacement|
+      define_method(method_name) do |*_arguments, **_options, &_block|
+        raise ArgumentError,
+          "NitroKit::FormBuilder does not implement #{method_name}; use #{replacement}"
+      end
     end
 
-    def field(field_name, label: nil, errors: nil, **attrs, &block)
-      if label.nil?
-        label = attrs.fetch(:label, field_name.to_s.humanize)
-      end
+    def fieldset(**attributes, &block)
+      @template.render(NitroKit::Fieldset.new(**attributes), &block)
+    end
 
-      if errors.nil?
-        errors = object && object.respond_to?(:errors) && object.errors.include?(field_name) ? object
-          .errors
-          .full_messages_for(field_name) : nil
-      end
+    def field(
+      field_name,
+      as: :string,
+      label: nil,
+      errors: nil,
+      html: {},
+      aria: {},
+      data: {},
+      control_html: {},
+      control_aria: {},
+      control_data: {},
+      wrapper_html: {},
+      wrapper_aria: {},
+      wrapper_data: {},
+      **attributes,
+      &block
+    )
+      as = validate_as!(as)
+      label = default_label_for(field_name) if label.nil?
+      errors ||= errors_for(field_name)
+      control_html = merge_control_boundary(:html, control_html, html)
+      control_aria = merge_control_boundary(:aria, control_aria, aria)
+      control_data = merge_control_boundary(:data, control_data, data)
 
-      @template.render(NitroKit::Field.new(self, field_name, label:, errors:, **attrs), &block)
-    end
-
-    def group(**attrs, &block)
-      @template.render(FieldGroup.new(**attrs), &block)
-    end
-
-    # Input types
-
-    %i[
-      color_field
-      date_field
-      datetime_field
-      datetime_local_field
-      email_field
-      file_field
-      hidden_field
-      month_field
-      number_field
-      password_field
-      phone_field
-      radio_button
-      range_field
-      search_field
-      telephone_field
-      text_area
-      text_field
-      time_field
-      url_field
-      week_field
-    ]
-      .each do |method|
-        define_method(method) do |*args, **attrs, &block|
-          type = method.to_s.gsub(/_field$/, "")
-          field(*args, **attrs, type:, label: false, &block)
-        end
+      if as == :rich_text
+        return rich_text_field(
+          field_name,
+          label:,
+          errors:,
+          control_html:,
+          control_aria:,
+          control_data:,
+          html: wrapper_html,
+          aria: wrapper_aria,
+          data: wrapper_data,
+          **attributes
+        )
       end
+      self.multipart = true if as == :file
+
+      @template.render(
+        NitroKit::Field.new(
+          self,
+          field_name,
+          as:,
+          label:,
+          errors:,
+          html: wrapper_html,
+          aria: wrapper_aria,
+          data: wrapper_data,
+          control_html:,
+          control_aria:,
+          control_data:,
+          **attributes
+        ),
+        &block
+      )
+    end
 
-    def radio_button(method, value = "1", **attrs)
-      field(method, as: :radio_button, label: false, value:, **attrs)
+    def group(**attributes, &block)
+      @template.render(NitroKit::FieldGroup.new(**attributes), &block)
     end
 
-    def checkbox(method, checked_value = "1", unchecked_value = "0", *args, include_hidden: true, **attrs)
-      if include_hidden
-        @template.concat(hidden_field(method, value: unchecked_value))
+    def dropzone(
+      field_name,
+      id: nil,
+      label: I18n.t("nitro_kit.dropzone.label"),
+      description: nil,
+      presentation: :input,
+      direct_upload: true,
+      multiple: false,
+      accept: nil,
+      max_files: 1,
+      max_bytes: nil,
+      disabled: false,
+      required: false,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      self.multipart = true
+
+      @template.render(
+        Dropzone.new(
+          id: id || field_id(field_name),
+          name: self.field_name(field_name, multiple:),
+          label:,
+          description:,
+          presentation:,
+          direct_upload:,
+          multiple:,
+          accept:,
+          max_files:,
+          max_bytes:,
+          disabled:,
+          required:,
+          html:,
+          aria:,
+          data:,
+          desperately_need_a_class:
+        )
+      )
+    end
+
+    FIELD_TYPES.each do |method_name, field_type|
+      define_method(method_name) do |field_name, options = {}, **attributes|
+        self.multipart = true if field_type == :file
+        field(
+          field_name,
+          as: field_type,
+          label: false,
+          **normalize_control_options(options.merge(attributes))
+        )
       end
+    end
+
+    def hidden_field(field_name, options = {}, **attributes)
+      options = options.merge(attributes).symbolize_keys
+      value = options.key?(:value) ? options.delete(:value) : value_for(field_name)
 
-      field(method, *args, as: :checkbox, label: false, value: checked_value, **attrs)
+      @template.render(
+        Input.new(
+          type: :hidden,
+          id: options.delete(:id) || field_id(field_name),
+          name: options.delete(:name) || self.field_name(field_name),
+          value:,
+          disabled: options.delete(:disabled) { false },
+          autocomplete: options.delete(:autocomplete),
+          data: options.delete(:data) || {},
+          aria: options.delete(:aria) || {},
+          html: options
+        )
+      )
     end
 
-    # Buttons
+    def radio_button(field_name, tag_value = "1", options = {}, **attributes)
+      control_options = normalize_control_options(options.merge(attributes))
+      control_options[:control_aria] = accessible_control_aria(field_name, control_options[:control_aria])
 
-    def submit(value = nil, **attrs, &block)
-      if value.nil? && !block_given?
-        value = "Save changes"
-      end
+      field(
+        field_name,
+        as: :radio_button,
+        label: false,
+        options: [ [ tag_value, tag_value ] ],
+        **control_options
+      )
+    end
+
+    def check_box(
+      field_name,
+      options = {},
+      checked_value = "1",
+      unchecked_value = "0",
+      **attributes
+    )
+      options = options.merge(attributes).symbolize_keys
+      include_hidden = options.delete(:include_hidden) { true }
+      control_options = normalize_control_options(options)
+      control_options[:control_aria] = accessible_control_aria(field_name, control_options[:control_aria])
 
-      @template.render(NitroKit::Button.new(value, variant: :primary, type: :submit, **attrs), &block)
+      field(
+        field_name,
+        as: :checkbox,
+        label: false,
+        checked_value:,
+        unchecked_value:,
+        include_hidden:,
+        **control_options
+      )
     end
 
-    def button(value = nil, **attrs, &block)
-      if value.nil? && !block_given?
-        value = "Save changes"
-      end
+    alias :checkbox :check_box
+
+    def submit(value = nil, options = {}, **attributes, &block)
+      options = options.symbolize_keys.merge(attributes)
+      value = I18n.t("nitro_kit.form.submit") if value.nil? && !block
+      options[:name] = "commit" unless options.key?(:name)
+      options[:value] = value if value && options[:name] == "commit" && !options.key?(:value)
 
-      @template.render(NitroKit::Button.new(value, **attrs), &block)
+      @template.render(Button.new(value, variant: :primary, type: :submit, **options), &block)
     end
 
-    def select(method, choices = nil, options = {}, html_options = {}, &block)
-      field_options = {
+    def button(value = nil, options = {}, **attributes, &block)
+      options = options.symbolize_keys.merge(attributes)
+      value = I18n.t("nitro_kit.form.submit") if value.nil? && !block
+      options[:type] = :submit unless options.key?(:type)
+
+      @template.render(Button.new(value, **options), &block)
+    end
+
+    def select(field_name, choices = nil, options = {}, html_options = {}, &block)
+      options = options.symbolize_keys
+      option_tags = @template.capture(&block) if block
+      option_tags ||= choices if choices.is_a?(ActiveSupport::SafeBuffer)
+      prompt = options[:prompt] == true ? I18n.t("helpers.select.prompt", default: "Please select") : options[:prompt]
+      selected = options.key?(:selected) ? { value: options[:selected] } : {}
+
+      field(
+        field_name,
         as: :select,
-        options: choices,
+        options: option_tags ? nil : choices,
+        option_tags:,
         include_blank: options[:include_blank],
-        prompt: options[:prompt]
-      }.compact
+        prompt:,
+        label: false,
+        **selected,
+        **normalize_control_options(html_options)
+      )
+    end
+
+    private
 
-      field_attributes = options.except(:include_blank, :prompt, :selected)
+    def rich_text_field(field_name, label:, errors:, description: nil, control_html: {}, **attributes)
+      editor_options = {
+        id: field_id(field_name),
+        placeholder: attributes[:placeholder],
+        required: attributes[:required]
+      }.compact.merge(control_html)
+      editor = rich_text_area(field_name, editor_options)
+
+      @template.render(
+        NitroKit::Field.new(
+          self,
+          field_name,
+          as: :rich_text,
+          label:,
+          description:,
+          errors:,
+          rich_text_content: editor,
+          **attributes
+        )
+      )
+    end
+
+    def accessible_control_aria(field_name, aria)
+      has_name = aria.any? do |key, value|
+        %w[label labelledby].include?(key.to_s.tr("_", "-")) && value.to_s.present?
+      end
+      has_name ? aria : aria.merge(label: default_label_for(field_name))
+    end
+
+    def default_label_for(field_name)
+      if object && object.class.respond_to?(:human_attribute_name)
+        object.class.human_attribute_name(field_name)
+      else
+        field_name.to_s.humanize
+      end
+    end
+
+    def validate_as!(as)
+      normalized = as.to_s.tr("-", "_").to_sym
+      return normalized if NitroKit::Field::TYPES.include?(normalized)
+
+      raise ArgumentError,
+        "Unknown as: #{as.inspect}; expected one of: #{NitroKit::Field::TYPES.map(&:inspect).join(", ")}"
+    end
+
+    def merge_control_boundary(name, control, shorthand)
+      control = (control || {}).symbolize_keys
+      shorthand = (shorthand || {}).symbolize_keys
+      duplicates = control.keys & shorthand.keys
+      if duplicates.any?
+        raise ArgumentError, "#{duplicates.first} was given through both #{name}: and control_#{name}:"
+      end
+
+      control.merge(shorthand)
+    end
+
+    def errors_for(field_name)
+      return unless object&.respond_to?(:errors) && object.errors.include?(field_name)
+
+      object.errors.full_messages_for(field_name)
+    end
+
+    def normalize_control_options(options)
+      options = options.symbolize_keys
+      normalized = options.extract!(*CONTROL_OPTIONS)
+      control_html = merge_control_boundary(:html, options.delete(:control_html), options.delete(:html))
+      control_data = merge_control_boundary(:data, options.delete(:control_data), options.delete(:data))
+      control_aria = merge_control_boundary(:aria, options.delete(:control_aria), options.delete(:aria))
+
+      normalized.merge(
+        control_html: merge_control_boundary(:html, control_html, options),
+        control_data:,
+        control_aria:
+      )
+    end
 
-      field(method, **field_options, **field_attributes, **html_options, &block)
+    def value_for(field_name)
+      object.public_send(field_name) if object&.respond_to?(field_name)
     end
   end
 end

data/app/components/nitro_kit/form_section.rb

@@ -0,0 +1,79 @@
+# frozen_string_literal: true
+
+module NitroKit
+  class FormSection < Component
+    Child = Data.define(:component, :content)
+
+    def initialize(
+      title: nil,
+      description: nil,
+      id: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      @title_content = content_from_keyword(:title, title)
+      @description_content = content_from_keyword(:description, description)
+      @status = nil
+      @form = nil
+      @title_id = "#{id || "nk-form-section-#{SecureRandom.hex(4)}"}-title"
+
+      super(
+        component: :form_section,
+        attributes: { id:, aria: { labelledby: @title_id } }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
+      )
+    end
+
+    def view_template
+      yield self if block_given?
+      require_content!("FormSection", :title, @title_content)
+      raise ArgumentError, "FormSection requires exactly one form" unless @form
+
+      section(**root_attributes) do
+        header(**slot_attributes(:header)) do
+          h2(**slot_attributes(:title, attributes: { id: @title_id })) do
+            render_deferred_content(@title_content)
+          end
+          if @description_content
+            p(**slot_attributes(:description)) { render_deferred_content(@description_content) }
+          end
+        end
+        render_in_slot(@status.component, :status, &@status.content) if @status
+        div(**slot_attributes(:form), &@form)
+      end
+    end
+
+    def title(text = nil, &block)
+      @title_content = declare_content(:title, @title_content, text, &block)
+      nil
+    end
+
+    def description(text = nil, &block)
+      @description_content = declare_content(:description, @description_content, text, &block)
+      nil
+    end
+
+    def status(component, &content)
+      unless component.is_a?(NitroKit::Alert)
+        raise ArgumentError, "FormSection status must be a NitroKit::Alert"
+      end
+      raise ArgumentError, "FormSection accepts at most one status" if @status
+
+      @status = Child.new(component:, content:)
+      nil
+    end
+
+    def form(&content)
+      raise ArgumentError, "FormSection form requires a block" unless content
+      raise ArgumentError, "FormSection accepts exactly one form" if @form
+
+      @form = content
+      nil
+    end
+  end
+end