hakumi_components 0.1.17.pre → 0.1.19.pre

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

@@ -0,0 +1,84 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Input
+    module Password
+      class Component < HakumiComponents::Input::Component
+        extend T::Sig
+
+        private
+
+        sig { void }
+        def before_render
+          @user_suffix = T.let(@suffix, Types::Renderable)
+          @suffix = T.let(nil, Types::Renderable)
+          super
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          base_attrs = super
+          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([
+              user_suffix_content,
+              visibility_toggle_button
+            ].compact)
+          end
+        end
+
+        sig { returns(T::Boolean) }
+        def has_affix?
+          true
+        end
+
+        sig { returns(T.nilable(T.any(String, ActiveSupport::SafeBuffer))) }
+        def user_suffix_content
+          render_affix_content(@user_suffix)
+        end
+
+        sig { returns(ActiveSupport::SafeBuffer) }
+        def visibility_toggle_button
+          content_tag(
+            :span,
+            class: "hakumi-input-password-icon",
+            role: "button",
+            tabindex: "-1",
+            data: {
+              action: "click->hakumi--input-password#toggle",
+              hakumi__input_password_target: "toggleButton"
+            }
+          ) do
+            render HakumiComponents::Icon::Component.new(
+              name: :eye_invisible,
+              data: { hakumi__input_password_target: "icon" }
+            )
+          end
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def input_attributes
+          attrs = super
+          attrs[:type] = :password
+          data_attributes = coerce_data_attributes(attrs[:data])
+          data_attributes[:hakumi__input_password_target] = "input"
+          attrs[:data] = data_attributes
+          attrs
+        end
+      end
+    end
+  end
+end

data/app/components/{hakumi → 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

@@ -0,0 +1,178 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Input
+    module TextArea
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
+
+        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: :default,
+          rows: 4,
+          disabled: false,
+          readonly: false,
+          required: false,
+          show_count: false,
+          maxlength: nil,
+          autosize: false,
+          standalone: true,
+          errors: [],
+          **html_options
+        )
+          @name = T.let(name, Types::FormFieldName)
+          @label = label
+          @caption = caption
+          @value = value
+          @placeholder = placeholder
+          @size = size
+          @rows = rows
+          @disabled = disabled
+          @readonly = readonly
+          @required = required
+          @show_count = show_count
+          @maxlength = maxlength
+          @autosize = autosize
+          @standalone = standalone
+          @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",
+            {
+              input_control_size => input_control_size != :default
+            },
+            [ html_class_name ]
+          )
+        end
+
+        sig { returns(String) }
+        def wrapper_classes
+          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,
+            data: {
+              controller: "hakumi--input-textarea",
+              hakumi__input_textarea_autosize_value: @autosize.to_s,
+              hakumi__input_textarea_maxlength_value: @maxlength,
+              count: character_count
+            }
+          }
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def textarea_attributes
+          {
+            name: form_field_name,
+            id: input_id,
+            class: textarea_classes,
+            rows: @rows,
+            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: merged_textarea_data_attributes
+          }.compact
+        end
+
+        sig { returns(String) }
+        def character_count
+          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
+end

data/app/components/{hakumi → 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,9 +12,9 @@
           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 Hakumi::Icon::Component.new(name: :caret_up, size: 10) %>
+          <%= render HakumiComponents::Icon::Component.new(name: :caret_up, size: 10) %>
         </button>
         <button
           type="button"
@@ -22,9 +22,9 @@
           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 Hakumi::Icon::Component.new(name: :caret_down, size: 10) %>
+          <%= render HakumiComponents::Icon::Component.new(name: :caret_down, size: 10) %>
         </button>
       </span>
     <% end %>
@@ -48,9 +48,9 @@
                 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 Hakumi::Icon::Component.new(name: :caret_up, size: 10) %>
+                <%= render HakumiComponents::Icon::Component.new(name: :caret_up, size: 10) %>
               </button>
               <button
                 type="button"
@@ -58,9 +58,9 @@
                 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 Hakumi::Icon::Component.new(name: :caret_down, size: 10) %>
+                <%= render HakumiComponents::Icon::Component.new(name: :caret_down, size: 10) %>
               </button>
             </span>
           <% end %>

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

@@ -0,0 +1,280 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module InputNumber
+    class Component < HakumiComponents::BaseComponent
+      extend T::Sig
+
+      include HakumiComponents::Concerns::InputControl
+
+      NumericLike = T.type_alias { T.any(String, Numeric) }
+      FormatterOptions = T.type_alias { T::Hash[Symbol, T.nilable(T.any(String, Symbol, T::Boolean, Numeric))] }
+
+      VARIANTS = T.let([ :default, :filled, :borderless ].freeze, T::Array[Symbol])
+      STATUSES = T.let([ :default, :success, :warning, :error ].freeze, T::Array[Symbol])
+
+      sig do
+        params(
+          name: Types::FormFieldName,
+          label: T.nilable(String),
+          caption: T.nilable(String),
+          value: Types::FormFieldValue,
+          placeholder: T.nilable(String),
+          min: T.nilable(NumericLike),
+          max: T.nilable(NumericLike),
+          step: NumericLike,
+          precision: T.nilable(NumericLike),
+          size: Symbol,
+          variant: Symbol,
+          status: Symbol,
+          disabled: T::Boolean,
+          readonly: T::Boolean,
+          required: T::Boolean,
+          prefix: Types::Renderable,
+          suffix: Types::Renderable,
+          controls: T::Boolean,
+          keyboard: T::Boolean,
+          wheel: T::Boolean,
+          formatter: T.nilable(FormatterOptions),
+          standalone: T::Boolean,
+          rules: T.nilable(T::Array[Types::ValidationRule]),
+          errors: Types::FormFieldErrors,
+          html_options: Types::HtmlAttributeValue
+        ).void
+      end
+      def initialize(
+        name:,
+        label: nil,
+        caption: nil,
+        value: nil,
+        placeholder: nil,
+        min: nil,
+        max: nil,
+        step: 1,
+        precision: nil,
+        size: :default,
+        variant: :default,
+        status: :default,
+        disabled: false,
+        readonly: false,
+        required: false,
+        prefix: nil,
+        suffix: nil,
+        controls: true,
+        keyboard: true,
+        wheel: false,
+        formatter: nil,
+        standalone: true,
+        rules: nil,
+        errors: [],
+        **html_options
+      )
+        @name = T.let(name, Types::FormFieldName)
+        @label = label
+        @caption = caption
+        @value = value
+        @placeholder = placeholder
+        @min = min
+        @max = max
+        @step = T.let(step, NumericLike)
+        @precision = precision
+        @size = size
+        @variant = variant
+        @status = status
+        @disabled = disabled
+        @readonly = readonly
+        @required = required
+        @prefix = prefix
+        @suffix = suffix
+        @controls = controls
+        @keyboard = keyboard
+        @wheel = wheel
+        @formatter = T.let(formatter, T.nilable(FormatterOptions))
+        @standalone = standalone
+        @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)
+        validate_inclusion!(:variant, VARIANTS)
+        validate_inclusion!(:status, STATUSES)
+        validate_numeric_like!(@step, "step")
+        validate_numeric_like!(@min, "min")
+        validate_numeric_like!(@max, "max")
+        validate_numeric_like!(@precision, "precision")
+      end
+
+      sig { params(value: T.nilable(NumericLike), name: String).void }
+      def validate_numeric_like!(value, name)
+        return if value.nil?
+        return if value.is_a?(Numeric) || value.is_a?(String)
+
+        raise ArgumentError, "#{name} must be a number or string"
+      end
+
+      sig { returns(String) }
+      def component_html_class
+        class_names(
+          "input-number",
+          {
+            input_control_size => input_control_size != :default,
+            @variant => @variant != :default,
+            disabled: input_control_disabled,
+            readonly: input_control_readonly,
+            "no-controls": !@controls,
+            "has-prefix": value_present?(@prefix),
+            "has-suffix": value_present?(@suffix),
+            status: @status != :default ? @status : nil
+          },
+          [ wrapper_class_name ]
+        )
+      end
+
+      sig { returns(Types::HtmlAttributes) }
+      def wrapper_attributes
+        merge_attributes(
+          {
+            class: component_html_class,
+            data: {
+              controller: "hakumi--input-number",
+              hakumi__input_number_step_value: @step,
+              hakumi__input_number_min_value: @min,
+              hakumi__input_number_max_value: @max,
+              hakumi__input_number_precision_value: @precision,
+              hakumi__input_number_keyboard_value: @keyboard,
+              hakumi__input_number_wheel_value: @wheel,
+              hakumi__input_number_disabled_value: input_control_disabled,
+              hakumi__input_number_formatter_options_value: formatter_options_json
+            }.compact
+          },
+          {
+            id: input_id,
+            data: html_data_attributes
+          }.compact
+        )
+      end
+
+      sig { returns(String) }
+      def input_classes
+        class_names("input-number-input", {}, [ html_class_name ])
+      end
+
+      sig { returns(Types::HtmlAttributes) }
+      def input_attributes
+        merge_attributes(
+          {
+            type: "text",
+            inputmode: "decimal",
+            name: form_field_name,
+            id: input_id,
+            value: input_control_value,
+            placeholder: input_control_placeholder,
+            class: input_classes,
+            disabled: input_control_disabled ? true : nil,
+            readonly: input_control_readonly ? true : nil,
+            autocomplete: "off",
+            role: "spinbutton",
+            "aria-invalid": error? ? "true" : nil,
+            "aria-describedby": describedby_ids,
+            "aria-valuemin": @min,
+            "aria-valuemax": @max,
+            "aria-valuenow": input_control_value,
+            data: {
+              action: "input->hakumi--input-number#handleInput focus->hakumi--input-number#handleFocus blur->hakumi--input-number#handleBlur keydown->hakumi--input-number#handleKeydown wheel->hakumi--input-number#handleWheel",
+              hakumi__input_number_target: "input"
+            }
+          }.compact,
+          form_field_html_options.except(:id, :wrapper_class)
+        )
+      end
+
+      sig { returns(T.nilable(ActiveSupport::SafeBuffer)) }
+      def prefix_element
+        prefix_content = render_adornment_content(@prefix)
+        return nil if prefix_content.nil?
+
+        content_tag(:span, prefix_content, class: "hakumi-input-number-prefix")
+      end
+
+      sig { returns(T.nilable(ActiveSupport::SafeBuffer)) }
+      def suffix_element
+        suffix_content = render_adornment_content(@suffix)
+        return nil if suffix_content.nil?
+
+        content_tag(:span, suffix_content, class: "hakumi-input-number-suffix")
+      end
+
+      sig { returns(T::Boolean) }
+      def controls?
+        @controls
+      end
+
+      sig { returns(T.nilable(String)) }
+      def formatter_options_json
+        return nil if @formatter.nil? || @formatter.empty?
+
+        @formatter.to_json
+      end
+
+      sig { params(value: Types::Renderable).returns(T.nilable(T.any(String, ActiveSupport::SafeBuffer))) }
+      def render_adornment_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(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
+
+      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/layout/component.html.erb

@@ -0,0 +1 @@
+<%= content_tag :section, content, wrapper_attributes %>

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

@@ -0,0 +1,28 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Layout
+    class Component < BaseComponent
+      extend T::Sig
+
+      sig { params(has_sider: T::Boolean, html_options: Types::HtmlAttributeValue).void }
+      def initialize(has_sider: false, **html_options)
+        @has_sider = T.let(has_sider, T::Boolean)
+        @html_options = T.let(html_options, Types::HtmlAttributes)
+      end
+
+      private
+
+      sig { returns(String) }
+      def wrapper_classes
+        component_classes("layout", { "has-sider": @has_sider }, @html_options)
+      end
+
+      sig { returns(Types::HtmlAttributes) }
+      def wrapper_attributes
+        merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+      end
+    end
+  end
+end

data/app/components/hakumi_components/layout/content/component.html.erb

@@ -0,0 +1 @@
+<%= content_tag :main, content, wrapper_attributes %>

data/app/components/hakumi_components/layout/content/component.rb

@@ -0,0 +1,29 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Layout
+    module Content
+      class Component < BaseComponent
+        extend T::Sig
+
+        sig { params(html_options: Types::HtmlAttributeValue).void }
+        def initialize(**html_options)
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+        end
+
+        private
+
+        sig { returns(String) }
+        def wrapper_classes
+          component_classes("layout-content", {}, @html_options)
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+        end
+      end
+    end
+  end
+end

data/app/components/hakumi_components/layout/footer/component.html.erb

@@ -0,0 +1 @@
+<%= content_tag :footer, content, wrapper_attributes %>