hakumi_components 0.1.18.pre → 0.1.19.pre

data/app/components/hakumi_components/input/component.rb

@@ -1,33 +1,41 @@
+# typed: strict
 # frozen_string_literal: true
 
 module HakumiComponents
   module Input
-    # Hakumi Input component
-    # A basic widget for getting user input, supporting text, number, email, etc.
-    #
-    # @example Basic usage
-    #   <%= render HakumiComponents::Input::Component.new(name: "email", placeholder: "Enter email") %>
-    #
-    # @example With label and caption
-    #   <%= render HakumiComponents::Input::Component.new(
-    #     name: "username",
-    #     label: "Username",
-    #     caption: "Choose a unique username",
-    #     required: true
-    #   ) %>
-    #
-    # @example With prefix and suffix
-    #   <%= render HakumiComponents::Input::Component.new(
-    #     name: "amount",
-    #     prefix: "dollar",
-    #     suffix: "USD",
-    #     placeholder: "0.00"
-    #   ) %>
-    class Component < HakumiComponents::BaseComponent
-      include HakumiComponents::Concerns::FormField
-
-      SIZES = [ :small, :middle, :large ].freeze
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
 
+        include HakumiComponents::Concerns::InputControl
+
+        InputType = T.type_alias { Types::HtmlKey }
+        IconName = T.type_alias { BaseComponent::SymbolInput }
+        AffixContent = T.type_alias { Types::RenderedContent }
+
+      sig do
+        params(
+          name: Types::FormFieldName,
+          label: T.nilable(String),
+          caption: T.nilable(String),
+          value: Types::FormFieldValue,
+          placeholder: T.nilable(String),
+          type: InputType,
+          size: Symbol,
+          disabled: T::Boolean,
+          readonly: T::Boolean,
+          required: T::Boolean,
+          prefix: Types::Renderable,
+          suffix: Types::Renderable,
+          prefix_icon: IconName,
+          suffix_icon: IconName,
+          allow_clear: T::Boolean,
+          maxlength: T.nilable(Integer),
+          standalone: T::Boolean,
+          rules: T.nilable(T::Array[Types::ValidationRule]),
+          errors: Types::FormFieldErrors,
+          html_options: Types::HtmlAttributeValue
+        ).void
+      end
       def initialize(
         name:,
         label: nil,
@@ -35,7 +43,7 @@ module HakumiComponents
         value: nil,
         placeholder: nil,
         type: :text,
-        size: :middle,
+        size: :default,
         disabled: false,
         readonly: false,
         required: false,
@@ -50,12 +58,12 @@ module HakumiComponents
         errors: [],
         **html_options
       )
-        @name = name
+        @name = T.let(name, Types::FormFieldName)
         @label = label
         @caption = caption
         @value = value
         @placeholder = placeholder
-        @type = type
+        @type = T.let(type, InputType)
         @size = size
         @disabled = disabled
         @readonly = readonly
@@ -67,111 +75,136 @@ module HakumiComponents
         @allow_clear = allow_clear
         @maxlength = maxlength
         @standalone = standalone
-        @rules = rules
-        @errors = Array(errors)
-        @html_options = html_options
-
+        @rules = T.let(rules, T.nilable(T::Array[Types::ValidationRule]))
+        @errors = T.let(errors, Types::FormFieldErrors)
+        @html_options = T.let(html_options, Types::HtmlAttributes)
+        initialize_input_control_contract!(
+          name: @name,
+          label: @label,
+          caption: @caption,
+          value: @value,
+          placeholder: @placeholder,
+          size: @size,
+          disabled: @disabled,
+          readonly: @readonly,
+          errors: @errors,
+          standalone: @standalone,
+          required: @required,
+          html_options: @html_options,
+          rules: @rules
+        )
         validate_props!
       end
 
       private
 
+      sig { void }
       def validate_props!
         validate_inclusion!(:size, SIZES)
       end
 
+      sig { returns(T::Boolean) }
       def has_affix?
-        @prefix.present? || @suffix.present? || @prefix_icon.present? || @suffix_icon.present? || @allow_clear
+        value_present?(@prefix) || value_present?(@suffix) || !@prefix_icon.nil? || !@suffix_icon.nil? || @allow_clear
       end
 
+      sig { returns(String) }
       def wrapper_classes
         class_names(
           "input-affix-wrapper",
           {
-            @size => (@size != :middle),
-            "disabled": @disabled
+            input_control_size => input_control_size != :default,
+            disabled: input_control_disabled
           },
-          [ @html_options[:wrapper_class] ]
+          [ wrapper_class_name ]
         )
       end
 
+      sig { returns(String) }
       def input_classes
         class_names(
           "input",
           {
-            @size => (@size != :middle)
+            input_control_size => input_control_size != :default
           },
-          [ @html_options[:class] ]
+          [ html_class_name ]
         )
       end
 
+      sig { returns(Types::HtmlAttributes) }
       def input_attributes
-        attrs = {
+        attrs = T.let({
           type: @type,
-          name: @name,
+          name: form_field_name,
           id: input_id,
-          value: @value,
-          placeholder: @placeholder,
+          value: input_control_value,
+          placeholder: input_control_placeholder,
+          maxlength: @maxlength,
           class: has_affix? ? nil : input_classes,
-          disabled: @disabled ? true : nil,
-          readonly: @readonly ? true : nil,
-          "aria-invalid": has_error? ? "true" : nil,
+          disabled: input_control_disabled ? true : nil,
+          readonly: input_control_readonly ? true : nil,
+          "aria-invalid": error? ? "true" : nil,
           "aria-describedby": describedby_ids,
-          data: { action: "input->hakumi--input#handleInput" }
-        }.compact
-
-        # Merge data attributes
-        if @html_options[:data]
-          attrs[:data] = attrs[:data].merge(@html_options[:data])
-        end
+          data: merged_input_data_attributes
+        }.compact, Types::HtmlAttributes)
 
         attrs
       end
 
+      sig { returns(Types::HtmlAttributes) }
       def wrapper_attributes
         {
           class: wrapper_classes,
           data: {
             controller: "hakumi--input",
-            hakumi__input_has_clear_value: @allow_clear ? "true" : "false"
+            hakumi__input_has_clear_value: @allow_clear
           }
         }
       end
 
+      sig { returns(T.nilable(ActiveSupport::SafeBuffer)) }
       def prefix_element
-        return nil unless @prefix || @prefix_icon
+        prefix_content = if @prefix_icon
+          render(HakumiComponents::Icon::Component.new(name: @prefix_icon)).to_s
+        else
+          rendered_prefix = render_affix_content(@prefix)
+          return nil if rendered_prefix.nil?
+
+          rendered_prefix
+        end
 
         content_tag(:span, class: "hakumi-input-prefix") do
-          if @prefix_icon
-            render HakumiComponents::Icon::Component.new(name: @prefix_icon)
-          elsif @prefix
-            @prefix
-          end
+          prefix_content
         end
       end
 
+      sig { returns(T.nilable(ActiveSupport::SafeBuffer)) }
       def suffix_element
-        return nil unless @suffix || @suffix_icon || @allow_clear
+        suffix_content = suffix_content()
+        return nil if suffix_content.nil? && !@allow_clear
 
         content_tag(:span, class: "hakumi-input-suffix") do
           safe_join([ suffix_content, clear_button ].compact)
         end
       end
 
+      sig { returns(AffixContent) }
       def suffix_content
-        return nil unless @suffix || @suffix_icon
+        return nil unless value_present?(@suffix) || @suffix_icon
 
         if @suffix_icon
-          render HakumiComponents::Icon::Component.new(name: @suffix_icon)
-        elsif @suffix
-          @suffix
+          render(HakumiComponents::Icon::Component.new(name: @suffix_icon)).to_s
+        else
+          render_affix_content(@suffix)
         end
       end
 
+      sig { returns(T.nilable(ActiveSupport::SafeBuffer)) }
       def clear_button
         return nil unless @allow_clear
 
-        content_tag(:span,
+        content_tag(
+          :span,
           class: "hakumi-input-clear-icon hakumi-input-clear-icon-hidden",
           role: "button",
           tabindex: "-1",
@@ -180,6 +213,49 @@ module HakumiComponents
           render HakumiComponents::Icon::Component.new(name: :close_circle, theme: :filled)
         end
       end
-    end
+
+      sig { returns(Types::DataAttributes) }
+      def merged_input_data_attributes
+        {
+          action: "input->hakumi--input#handleInput"
+        }.merge(coerce_data_attributes(form_field_html_options[:data]))
+      end
+
+      sig { params(raw_data: Types::HtmlAttributeValue).returns(Types::DataAttributes) }
+      def coerce_data_attributes(raw_data)
+        data_attributes = T.let({}, Types::DataAttributes)
+        return data_attributes unless raw_data.is_a?(Hash)
+
+        raw_data.each do |key, value|
+          next unless key.is_a?(String) || key.is_a?(Symbol)
+          next unless value.nil? || value.is_a?(String) || value.is_a?(Symbol) || value.is_a?(TrueClass) || value.is_a?(FalseClass) || value.is_a?(Numeric)
+
+          data_attributes[key] = value
+        end
+
+        data_attributes
+      end
+
+      sig { params(value: Types::Renderable).returns(AffixContent) }
+      def render_affix_content(value)
+        return nil unless value_present?(value)
+        return value if value.is_a?(ActiveSupport::SafeBuffer) || value.is_a?(String)
+        return render(value).to_s if value.is_a?(ViewComponent::Base)
+
+        nil
+      end
+
+      sig { returns(T.nilable(String)) }
+      def html_class_name
+        css_class = form_field_html_options[:class]
+        css_class.is_a?(String) ? css_class : nil
+      end
+
+      sig { returns(T.nilable(String)) }
+      def wrapper_class_name
+        wrapper_class = form_field_html_options[:wrapper_class]
+        wrapper_class.is_a?(String) ? wrapper_class : nil
+      end
+      end
   end
 end

data/app/components/hakumi_components/input/password/component.rb

@@ -1,51 +1,36 @@
+# typed: strict
 # frozen_string_literal: true
 
 module HakumiComponents
   module Input
     module Password
-      # Hakumi Password Input component
-      # A password input with visibility toggle functionality
-      #
-      # @example Basic usage
-      #   <%= render HakumiComponents::Input::Password::Component.new(
-      #     name: "password",
-      #     label: "Password",
-      #     placeholder: "Enter password"
-      #   ) %>
-      #
-      # @example With size and validation
-      #   <%= render HakumiComponents::Input::Password::Component.new(
-      #     name: "password",
-      #     label: "Password",
-      #     size: :large,
-      #     required: true,
-      #     errors: ["Password is too short"]
-      #   ) %>
       class Component < HakumiComponents::Input::Component
-        def initialize(**options)
-          # Force type to password
-          options[:type] = :password
+        extend T::Sig
 
-          # Password fields always have a suffix (visibility toggle)
-          # Store the user's suffix separately if provided
-          @user_suffix = options.delete(:suffix)
+        private
 
-          super(**options)
+        sig { void }
+        def before_render
+          @user_suffix = T.let(@suffix, Types::Renderable)
+          @suffix = T.let(nil, Types::Renderable)
+          super
         end
 
-        private
-
+        sig { returns(Types::HtmlAttributes) }
         def wrapper_attributes
           base_attrs = super
-
-          # Merge password-specific data attributes
-          base_attrs[:data] ||= {}
-          base_attrs[:data][:controller] = [ base_attrs[:data][:controller], "hakumi--input-password" ].compact.join(" ")
-          base_attrs[:data][:hakumi__input_password_visible_value] = "false"
-
+          data_attributes = coerce_data_attributes(base_attrs[:data])
+          controller_names = T.let([], T::Array[String])
+          current_controller = data_attributes[:controller]
+          controller_names << current_controller if current_controller.is_a?(String)
+          controller_names << "hakumi--input-password"
+          data_attributes[:controller] = controller_names.join(" ")
+          data_attributes[:hakumi__input_password_visible_value] = "false"
+          base_attrs[:data] = data_attributes
           base_attrs
         end
 
+        sig { returns(ActiveSupport::SafeBuffer) }
         def suffix_element
           content_tag(:span, class: "hakumi-input-suffix") do
             safe_join([
@@ -55,18 +40,20 @@ module HakumiComponents
           end
         end
 
+        sig { returns(T::Boolean) }
         def has_affix?
-          true # Password always has affix (visibility toggle)
+          true
         end
 
+        sig { returns(T.nilable(T.any(String, ActiveSupport::SafeBuffer))) }
         def user_suffix_content
-          return nil unless @user_suffix
-
-          @user_suffix
+          render_affix_content(@user_suffix)
         end
 
+        sig { returns(ActiveSupport::SafeBuffer) }
         def visibility_toggle_button
-          content_tag(:span,
+          content_tag(
+            :span,
             class: "hakumi-input-password-icon",
             role: "button",
             tabindex: "-1",
@@ -82,11 +69,13 @@ module HakumiComponents
           end
         end
 
+        sig { returns(Types::HtmlAttributes) }
         def input_attributes
           attrs = super
-          # Add target for Stimulus controller
-          attrs[:data] ||= {}
-          attrs[:data][:hakumi__input_password_target] = "input"
+          attrs[:type] = :password
+          data_attributes = coerce_data_attributes(attrs[:data])
+          data_attributes[:hakumi__input_password_target] = "input"
+          attrs[:data] = data_attributes
           attrs
         end
       end

data/app/components/hakumi_components/input/text_area/component.html.erb

@@ -1,10 +1,10 @@
 <% textarea_control = capture do %>
   <span <%= tag.attributes(wrapper_attributes).to_s.html_safe %>>
-    <%= content_tag(:textarea, @value, **textarea_attributes) %>
+    <%= content_tag(:textarea, input_control_value, **textarea_attributes) %>
   </span>
 <% end %>
 
-<% if @standalone %>
+<% if standalone? %>
   <%= textarea_control %>
 <% else %>
   <div <%= tag.attributes(form_item_attributes).to_s.html_safe %>>

data/app/components/hakumi_components/input/text_area/component.rb

@@ -1,37 +1,41 @@
+# typed: strict
 # frozen_string_literal: true
 
 module HakumiComponents
   module Input
     module TextArea
-      # Hakumi TextArea component
-      # Multi-line text input with optional character count and auto-resize
-      #
-      # @example Basic usage
-      #   <%= render HakumiComponents::Input::TextArea::Component.new(
-      #     name: "bio",
-      #     label: "Biography",
-      #     rows: 4
-      #   ) %>
-      #
-      # @example With character count
-      #   <%= render HakumiComponents::Input::TextArea::Component.new(
-      #     name: "description",
-      #     label: "Description",
-      #     show_count: true,
-      #     maxlength: 200
-      #   ) %>
       class Component < HakumiComponents::BaseComponent
-        include HakumiComponents::Concerns::FormField
+        extend T::Sig
 
-        SIZES = [ :small, :middle, :large ].freeze
+        include HakumiComponents::Concerns::InputControl
 
+        sig do
+          params(
+            name: Types::FormFieldName,
+            label: T.nilable(String),
+            caption: T.nilable(String),
+            value: Types::FormFieldValue,
+            placeholder: T.nilable(String),
+            size: Symbol,
+            rows: Integer,
+            disabled: T::Boolean,
+            readonly: T::Boolean,
+            required: T::Boolean,
+            show_count: T::Boolean,
+            maxlength: T.nilable(Integer),
+            autosize: T::Boolean,
+            standalone: T::Boolean,
+            errors: Types::FormFieldErrors,
+            html_options: Types::HtmlAttributeValue
+          ).void
+        end
         def initialize(
           name:,
           label: nil,
           caption: nil,
           value: nil,
           placeholder: nil,
-          size: :middle,
+          size: :default,
           rows: 4,
           disabled: false,
           readonly: false,
@@ -43,7 +47,7 @@ module HakumiComponents
           errors: [],
           **html_options
         )
-          @name = name
+          @name = T.let(name, Types::FormFieldName)
           @label = label
           @caption = caption
           @value = value
@@ -57,34 +61,52 @@ module HakumiComponents
           @maxlength = maxlength
           @autosize = autosize
           @standalone = standalone
-          @errors = Array(errors)
-          @html_options = html_options
+          @errors = T.let(errors, Types::FormFieldErrors)
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+          initialize_input_control_contract!(
+            name: @name,
+            label: @label,
+            caption: @caption,
+            value: @value,
+            placeholder: @placeholder,
+            size: @size,
+            disabled: @disabled,
+            readonly: @readonly,
+            errors: @errors,
+            standalone: @standalone,
+            required: @required,
+            html_options: @html_options
+          )
 
           validate_props!
         end
 
         private
 
+        sig { void }
         def validate_props!
           validate_inclusion!(:size, SIZES)
         end
 
+        sig { returns(String) }
         def textarea_classes
           class_names(
             "input",
             {
-              @size => (@size != :middle)
+              input_control_size => input_control_size != :default
             },
-            [ @html_options[:class] ]
+            [ html_class_name ]
           )
         end
 
+        sig { returns(String) }
         def wrapper_classes
-          classes = [ "hakumi-input-textarea" ]
+          classes = T.let([ "hakumi-input-textarea" ], T::Array[String])
           classes << "hakumi-input-textarea-show-count" if @show_count
           classes.join(" ")
         end
 
+        sig { returns(Types::HtmlAttributes) }
         def wrapper_attributes
           {
             class: wrapper_classes,
@@ -97,34 +119,59 @@ module HakumiComponents
           }
         end
 
+        sig { returns(Types::HtmlAttributes) }
         def textarea_attributes
-          attrs = {
-            name: @name,
+          {
+            name: form_field_name,
             id: input_id,
             class: textarea_classes,
             rows: @rows,
-            placeholder: @placeholder,
-            disabled: @disabled ? true : nil,
-            readonly: @readonly ? true : nil,
-            "aria-invalid": has_error? ? "true" : nil,
+            placeholder: input_control_placeholder,
+            maxlength: @maxlength,
+            disabled: input_control_disabled ? true : nil,
+            readonly: input_control_readonly ? true : nil,
+            "aria-invalid": error? ? "true" : nil,
             "aria-describedby": describedby_ids,
-            data: { action: "input->hakumi--input-textarea#handleInput" }
+            data: merged_textarea_data_attributes
           }.compact
-
-          # Merge user data attributes
-          if @html_options[:data]
-            attrs[:data].merge!(@html_options[:data])
-          end
-
-          attrs
         end
 
+        sig { returns(String) }
         def character_count
-          current = @value.to_s.length
-          return current.to_s unless @maxlength
+          current = input_control_value.to_s.length
+          return current.to_s if @maxlength.nil?
 
           "#{current} / #{@maxlength}"
         end
+
+        sig { returns(Types::DataAttributes) }
+        def merged_textarea_data_attributes
+          {
+            action: "input->hakumi--input-textarea#handleInput"
+          }.merge(html_data_attributes)
+        end
+
+        sig { returns(Types::DataAttributes) }
+        def html_data_attributes
+          data_attributes = T.let({}, Types::DataAttributes)
+          html_data = form_field_html_options[:data]
+          return data_attributes unless html_data.is_a?(Hash)
+
+          html_data.each do |key, value|
+            next unless key.is_a?(String) || key.is_a?(Symbol)
+            next unless value.nil? || value.is_a?(String) || value.is_a?(Symbol) || value.is_a?(TrueClass) || value.is_a?(FalseClass) || value.is_a?(Numeric)
+
+            data_attributes[key] = value
+          end
+
+          data_attributes
+        end
+
+        sig { returns(T.nilable(String)) }
+        def html_class_name
+          css_class = form_field_html_options[:class]
+          css_class.is_a?(String) ? css_class : nil
+        end
       end
     end
   end

data/app/components/hakumi_components/input_number/component.html.erb

@@ -1,4 +1,4 @@
-<% if @standalone %>
+<% if standalone? %>
   <%= content_tag(:span, wrapper_attributes) do %>
     <%= prefix_element %>
     <%= tag.input(**input_attributes) %>
@@ -12,7 +12,7 @@
           aria-label="Increase value"
           data-hakumi--input-number-target="up"
           data-action="mousedown->hakumi--input-number#handleStepUp"
-          <%= "disabled" if @disabled || @readonly %>
+          <%= "disabled" if input_control_disabled || input_control_readonly %>
         >
           <%= render HakumiComponents::Icon::Component.new(name: :caret_up, size: 10) %>
         </button>
@@ -22,7 +22,7 @@
           aria-label="Decrease value"
           data-hakumi--input-number-target="down"
           data-action="mousedown->hakumi--input-number#handleStepDown"
-          <%= "disabled" if @disabled || @readonly %>
+          <%= "disabled" if input_control_disabled || input_control_readonly %>
         >
           <%= render HakumiComponents::Icon::Component.new(name: :caret_down, size: 10) %>
         </button>
@@ -48,7 +48,7 @@
                 aria-label="Increase value"
                 data-hakumi--input-number-target="up"
                 data-action="mousedown->hakumi--input-number#handleStepUp"
-                <%= "disabled" if @disabled || @readonly %>
+                <%= "disabled" if input_control_disabled || input_control_readonly %>
               >
                 <%= render HakumiComponents::Icon::Component.new(name: :caret_up, size: 10) %>
               </button>
@@ -58,7 +58,7 @@
                 aria-label="Decrease value"
                 data-hakumi--input-number-target="down"
                 data-action="mousedown->hakumi--input-number#handleStepDown"
-                <%= "disabled" if @disabled || @readonly %>
+                <%= "disabled" if input_control_disabled || input_control_readonly %>
               >
                 <%= render HakumiComponents::Icon::Component.new(name: :caret_down, size: 10) %>
               </button>