hakumi_components 0.1.17.pre → 0.1.19.pre

data/app/components/hakumi_components/skeleton/avatar/component.rb

@@ -0,0 +1,88 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    module Avatar
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
+
+        AvatarSize = T.type_alias { T.any(Symbol, Numeric) }
+        ShapeInput = T.type_alias { Types::HtmlKey }
+        SHAPES = T.let(%i[circle square].freeze, T::Array[Symbol])
+
+        sig do
+          params(
+            active: T::Boolean,
+            size: AvatarSize,
+            shape: ShapeInput,
+            html_options: Types::HtmlAttributeValue
+          ).void
+        end
+        def initialize(active: false, size: :default, shape: :circle, **html_options)
+          @active = T.let(active, T::Boolean)
+          @size = T.let(normalize_size(size), AvatarSize)
+          @shape = T.let(normalize_shape(shape), Symbol)
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+
+          validate_props!
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+        end
+
+        sig { returns(String) }
+        def avatar_classes
+          modifiers = T.let({}, Types::ClassModifiers)
+          if !@size.is_a?(Numeric) && @size != :default
+            modifiers[@size] = true
+          end
+          modifiers[@shape] = true
+
+          class_names("skeleton-avatar", modifiers)
+        end
+
+        sig { returns(T.nilable(String)) }
+        def avatar_style
+          return nil unless @size.is_a?(Numeric)
+
+          "width: #{@size}px; height: #{@size}px;"
+        end
+
+        private
+
+        sig { params(size: AvatarSize).returns(AvatarSize) }
+        def normalize_size(size)
+          return size if size.is_a?(Numeric)
+
+          size.to_sym
+        end
+
+        sig { params(shape: ShapeInput).returns(Symbol) }
+        def normalize_shape(shape)
+          shape.to_sym
+        end
+
+        sig { returns(String) }
+        def wrapper_classes
+          component_classes("skeleton", { element: true, active: @active }, @html_options)
+        end
+
+        sig { void }
+        def validate_props!
+          validate_inclusion_value(name: :size, value: @size, allowed: SIZES) if !@size.is_a?(Numeric)
+          validate_inclusion_value(name: :shape, value: @shape, allowed: SHAPES)
+        end
+
+        sig { params(name: Symbol, value: Symbol, allowed: T::Array[Symbol]).void }
+        def validate_inclusion_value(name:, value:, allowed:)
+          return if allowed.include?(value)
+
+          raise ArgumentError, "#{name} must be one of #{allowed.inspect}, got #{value.inspect}"
+        end
+      end
+    end
+  end
+end

data/app/components/hakumi_components/skeleton/avatar_config.rb

@@ -0,0 +1,79 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    class AvatarConfig
+      extend T::Sig
+
+      Size = T.type_alias { T.any(Symbol, Numeric) }
+      ShapeInput = T.type_alias { T.any(Symbol, String) }
+      Input = T.type_alias { T.any(T::Boolean, Types::HtmlAttributes, HakumiComponents::Skeleton::AvatarConfig) }
+      SHAPES = T.let(%i[circle square].freeze, T::Array[Symbol])
+
+      sig { params(size: Size, shape: Symbol).void }
+      def initialize(size: :default, shape: :circle)
+        @size = T.let(normalize_size(size), Size)
+        @shape = T.let(normalize_shape(shape), Symbol)
+        validate!
+      end
+
+      sig { returns(Size) }
+      attr_reader :size
+
+      sig { returns(Symbol) }
+      attr_reader :shape
+
+      sig { params(value: Input).returns(T.nilable(HakumiComponents::Skeleton::AvatarConfig)) }
+      def self.coerce(value)
+        return nil if value == false
+        return new if value == true
+        return value if value.is_a?(HakumiComponents::Skeleton::AvatarConfig)
+
+        size = value[:size]
+        shape = value[:shape]
+        resolved_size = if size.is_a?(Symbol) || size.is_a?(Numeric)
+          size
+        elsif size.is_a?(String)
+          size.to_sym
+        else
+          :default
+        end
+        resolved_shape = if shape.is_a?(Symbol)
+          shape
+        elsif shape.is_a?(String)
+          shape.to_sym
+        else
+          :circle
+        end
+
+        new(size: resolved_size, shape: resolved_shape)
+      end
+
+      private
+
+      sig { params(size: Size).returns(Size) }
+      def normalize_size(size)
+        return size if size.is_a?(Numeric)
+
+        size.to_sym
+      end
+
+      sig { params(shape: ShapeInput).returns(Symbol) }
+      def normalize_shape(shape)
+        shape.to_sym
+      end
+
+      sig { void }
+      def validate!
+        allowed_sizes = HakumiComponents::BaseComponent::SIZES
+        if !@size.is_a?(Numeric) && !allowed_sizes.include?(@size)
+          raise ArgumentError, "avatar size must be one of #{allowed_sizes.inspect}, got #{@size.inspect}"
+        end
+        return if SHAPES.include?(@shape)
+
+        raise ArgumentError, "avatar shape must be one of #{SHAPES.inspect}, got #{@shape.inspect}"
+      end
+    end
+  end
+end

data/app/components/hakumi_components/skeleton/button/component.rb

@@ -0,0 +1,77 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    module Button
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
+
+        SHAPES = T.let(%i[default circle round].freeze, T::Array[Symbol])
+
+        sig do
+          params(
+            active: T::Boolean,
+            size: T.any(Symbol, String),
+            shape: T.any(Symbol, String),
+            block: T::Boolean,
+            html_options: Types::HtmlAttributeValue
+          ).void
+        end
+        def initialize(active: false, size: :default, shape: :default, block: false, **html_options)
+          @active = T.let(active, T::Boolean)
+          @size = T.let(normalize_size(size), Symbol)
+          @shape = T.let(normalize_shape(shape), Symbol)
+          @block = T.let(block, T::Boolean)
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+
+          validate_props!
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+        end
+
+        sig { returns(String) }
+        def button_classes
+          modifiers = T.let({}, Types::ClassModifiers)
+          modifiers[@size] = true if @size != :default
+          modifiers[@shape] = true if @shape != :default
+
+          class_names("skeleton-button", modifiers)
+        end
+
+        private
+
+        sig { params(size: T.any(Symbol, String)).returns(Symbol) }
+        def normalize_size(size)
+          size.to_sym
+        end
+
+        sig { params(shape: T.any(Symbol, String)).returns(Symbol) }
+        def normalize_shape(shape)
+          shape.to_sym
+        end
+
+        sig { returns(String) }
+        def wrapper_classes
+          component_classes("skeleton", { element: true, active: @active, block: @block }, @html_options)
+        end
+
+        sig { void }
+        def validate_props!
+          validate_inclusion_value(name: :size, value: @size, allowed: SIZES)
+          validate_inclusion_value(name: :shape, value: @shape, allowed: SHAPES)
+        end
+
+        sig { params(name: Symbol, value: Symbol, allowed: T::Array[Symbol]).void }
+        def validate_inclusion_value(name:, value:, allowed:)
+          return if allowed.include?(value)
+
+          raise ArgumentError, "#{name} must be one of #{allowed.inspect}, got #{value.inspect}"
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,186 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    class Component < HakumiComponents::BaseComponent
+      extend T::Sig
+
+      ConfigToggle = T.type_alias { T::Boolean }
+      ConfigInput = T.type_alias { T.any(ConfigToggle, Types::HtmlAttributes) }
+      ConfigParam = T.type_alias { T.any(ActionController::Parameters, Types::HtmlAttributeValue) }
+      ConfigValue = T.type_alias { T.nilable(T.any(ConfigToggle, Types::HtmlAttributes)) }
+      AvatarInput = T.type_alias { T.any(ConfigInput, HakumiComponents::Skeleton::AvatarConfig) }
+      TitleInput = T.type_alias { T.any(ConfigInput, HakumiComponents::Skeleton::TitleConfig) }
+      ParagraphInput = T.type_alias { T.any(ConfigInput, HakumiComponents::Skeleton::ParagraphConfig) }
+      DEFAULT_PARAGRAPH_ROWS = T.let(3, Integer)
+
+      sig { params(params: BaseComponent::ControllerOptions).returns(T::Hash[Symbol, ConfigValue]) }
+      def self.extract_controller_locals(params)
+        loading_value = html_param(params, :loading)
+        avatar_value = html_param(params, :avatar)
+        title_value = html_param(params, :title)
+        paragraph_value = html_param(params, :paragraph)
+
+        locals = {
+          loading: loading_value.nil? ? true : boolean_html_param(loading_value) != false,
+          active: boolean_html_param(html_param(params, :active)) == true,
+          round: boolean_html_param(html_param(params, :round)) == true
+        }
+
+        locals[:avatar] = normalize_config_param(avatar_value) unless avatar_value.nil?
+        locals[:title] = normalize_config_param(title_value) unless title_value.nil?
+        locals[:paragraph] = normalize_config_param(paragraph_value) unless paragraph_value.nil?
+
+        locals
+      end
+
+      sig do
+        params(
+          loading: T::Boolean,
+          active: T::Boolean,
+          avatar: AvatarInput,
+          title: TitleInput,
+          paragraph: ParagraphInput,
+          round: T::Boolean,
+          html_options: Types::HtmlAttributeValue
+        ).void
+      end
+      def initialize(
+        loading: true,
+        active: false,
+        avatar: false,
+        title: true,
+        paragraph: true,
+        round: false,
+        **html_options
+      )
+        @loading = T.let(loading, T::Boolean)
+        @active = T.let(active, T::Boolean)
+        @round = T.let(round, T::Boolean)
+        @avatar = T.let(HakumiComponents::Skeleton::AvatarConfig.coerce(avatar), T.nilable(HakumiComponents::Skeleton::AvatarConfig))
+        @title = T.let(HakumiComponents::Skeleton::TitleConfig.coerce(title), T.nilable(HakumiComponents::Skeleton::TitleConfig))
+        @paragraph = T.let(HakumiComponents::Skeleton::ParagraphConfig.coerce(paragraph), T.nilable(HakumiComponents::Skeleton::ParagraphConfig))
+        @html_options = T.let(html_options, Types::HtmlAttributes)
+      end
+
+      sig { returns(T::Boolean) }
+      def loading?
+        @loading
+      end
+
+      sig { returns(Types::HtmlAttributes) }
+      def wrapper_attributes
+        merge_attributes(
+          { class: wrapper_classes },
+          @html_options.except(:class)
+        )
+      end
+
+      sig { returns(T::Boolean) }
+      def avatar?
+        !@avatar.nil?
+      end
+
+      sig { returns(T::Boolean) }
+      def title?
+        !@title.nil?
+      end
+
+      sig { returns(T::Boolean) }
+      def paragraph?
+        !@paragraph.nil?
+      end
+
+      sig { returns(String) }
+      def avatar_classes
+        modifiers = {}
+        modifiers[avatar_size] = true if avatar_size != :default
+        modifiers[avatar_shape] = true if avatar_shape
+
+        class_names("skeleton-avatar", modifiers)
+      end
+
+      sig { returns(T.nilable(String)) }
+      def avatar_style
+        return nil unless avatar_size.is_a?(Numeric)
+
+        "width: #{avatar_size}px; height: #{avatar_size}px;"
+      end
+
+      sig { returns(T.nilable(String)) }
+      def title_style
+        width = @title.nil? ? nil : dimension_to_css(@title.width)
+        return nil unless width
+
+        "width: #{width};"
+      end
+
+      sig { returns(T::Array[T.nilable(String)]) }
+      def paragraph_row_widths
+        return [] unless paragraph?
+        paragraph = @paragraph
+        return [] if paragraph.nil?
+
+        paragraph.row_widths(DEFAULT_PARAGRAPH_ROWS).map { |value| dimension_to_css(value) }
+      end
+
+      sig { params(width: T.nilable(String)).returns(T.nilable(String)) }
+      def paragraph_row_style(width)
+        return nil unless width
+
+        "width: #{width};"
+      end
+
+      private
+
+      sig { params(value: ConfigParam).returns(ConfigValue) }
+      def self.normalize_config_param(value)
+        return nil if value.nil?
+
+        if value.is_a?(ActionController::Parameters) || value.is_a?(Hash)
+          source = value.is_a?(ActionController::Parameters) ? value.to_unsafe_h : value
+          attrs = T.let({}, Types::HtmlAttributes)
+          source.each do |key, entry|
+            next unless key.is_a?(String) || key.is_a?(Symbol)
+            next unless entry.nil? || entry.is_a?(String) || entry.is_a?(Symbol) || entry.is_a?(TrueClass) || entry.is_a?(FalseClass) || entry.is_a?(Numeric) || entry.is_a?(Hash) || entry.is_a?(Array)
+
+            attrs[key.to_sym] = entry
+          end
+          return attrs
+        end
+
+        return cast_boolean(value) if value.is_a?(String) || value.is_a?(Symbol) || value.is_a?(TrueClass) || value.is_a?(FalseClass) || value.is_a?(Numeric)
+
+        nil
+      end
+
+      sig { returns(String) }
+      def wrapper_classes
+        modifiers = {
+          active: @active,
+          "with-avatar": avatar?,
+          "with-title": title?,
+          "with-paragraph": paragraph?,
+          round: @round
+        }
+
+        component_classes("skeleton", modifiers, @html_options)
+      end
+
+      sig { returns(T.any(Symbol, Numeric)) }
+      def avatar_size
+        return :default if @avatar.nil?
+
+        @avatar.size
+      end
+
+      sig { returns(Symbol) }
+      def avatar_shape
+        return :circle if @avatar.nil?
+
+        @avatar.shape
+      end
+    end
+  end
+end

data/app/components/{hakumi → hakumi_components}/skeleton/image/component.html.erb

@@ -1,5 +1,5 @@
 <%= tag.span(**wrapper_attributes) do %>
   <%= tag.span(class: image_classes, style: image_style) do %>
-    <%= render(Hakumi::Icon::Component.new(**icon_component_options)) %>
+    <%= render(HakumiComponents::Icon::Component.new(**icon_component_options)) %>
   <% end %>
 <% end %>

data/app/components/hakumi_components/skeleton/image/component.rb

@@ -0,0 +1,104 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    module Image
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
+
+        SizeInput = T.type_alias { BaseComponent::DimensionInput }
+        DEFAULT_ICON_NAME = T.let("picture", String)
+        DEFAULT_ICON_THEME = T.let(:outlined, Symbol)
+        DEFAULT_ICON_SIZE = T.let(48, Integer)
+        ICON_SCALE = T.let(0.55, Float)
+        MIN_ICON_SIZE = T.let(32, Integer)
+
+        sig do
+          params(
+            active: T::Boolean,
+            width: SizeInput,
+            height: SizeInput,
+            html_options: Types::HtmlAttributeValue
+          ).void
+        end
+        def initialize(active: false, width: 96, height: 96, **html_options)
+          @active = T.let(active, T::Boolean)
+          @width = T.let(width, SizeInput)
+          @height = T.let(height, SizeInput)
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+
+          validate_props!
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+        end
+
+        sig { returns(String) }
+        def image_classes
+          class_names("skeleton-image")
+        end
+
+        sig { returns(T.nilable(String)) }
+        def image_style
+          styles = T.let([], T::Array[String])
+          width_css = dimension_to_css(@width)
+          height_css = dimension_to_css(@height)
+          styles << "width: #{width_css}" if width_css
+          styles << "height: #{height_css}" if height_css
+          styles.any? ? styles.join("; ") : nil
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def icon_component_options
+          {
+            name: DEFAULT_ICON_NAME,
+            theme: DEFAULT_ICON_THEME,
+            size: calculated_icon_size,
+            color: "currentColor",
+            style: "line-height: 1"
+          }
+        end
+
+        private
+
+        sig { returns(Integer) }
+        def calculated_icon_size
+          dimension = [ numeric_dimension(@width), numeric_dimension(@height) ].compact.min
+          return DEFAULT_ICON_SIZE unless dimension
+
+          scaled = (dimension * ICON_SCALE).round.to_i
+          scaled > MIN_ICON_SIZE ? scaled : MIN_ICON_SIZE
+        end
+
+        sig { params(value: SizeInput).returns(T.nilable(Numeric)) }
+        def numeric_dimension(value)
+          return value if value.is_a?(Numeric)
+          return nil unless value.is_a?(String)
+
+          value.strip.end_with?("px") ? value.to_f : nil
+        end
+
+        sig { returns(String) }
+        def wrapper_classes
+          component_classes("skeleton", { element: true, active: @active }, @html_options)
+        end
+
+        sig { void }
+        def validate_props!
+          validate_size!(name: :width, value: @width)
+          validate_size!(name: :height, value: @height)
+        end
+
+        sig { params(name: Symbol, value: SizeInput).void }
+        def validate_size!(name:, value:)
+          return if value.is_a?(Numeric) || value.is_a?(String)
+
+          raise ArgumentError, "#{name} must be a number or string"
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,66 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    module Input
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
+
+        sig do
+          params(
+            active: T::Boolean,
+            size: T.any(Symbol, String),
+            block: T::Boolean,
+            html_options: Types::HtmlAttributeValue
+          ).void
+        end
+        def initialize(active: false, size: :default, block: false, **html_options)
+          @active = T.let(active, T::Boolean)
+          @size = T.let(normalize_size(size), Symbol)
+          @block = T.let(block, T::Boolean)
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+
+          validate_props!
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+        end
+
+        sig { returns(String) }
+        def input_classes
+          modifiers = T.let({}, Types::ClassModifiers)
+          modifiers[@size] = true if @size != :default
+
+          class_names("skeleton-input", modifiers)
+        end
+
+        private
+
+        sig { params(size: T.any(Symbol, String)).returns(Symbol) }
+        def normalize_size(size)
+          size.to_sym
+        end
+
+        sig { returns(String) }
+        def wrapper_classes
+          component_classes("skeleton", { element: true, active: @active, block: @block }, @html_options)
+        end
+
+        sig { void }
+        def validate_props!
+          validate_inclusion_value(name: :size, value: @size, allowed: SIZES)
+        end
+
+        sig { params(name: Symbol, value: Symbol, allowed: T::Array[Symbol]).void }
+        def validate_inclusion_value(name:, value:, allowed:)
+          return if allowed.include?(value)
+
+          raise ArgumentError, "#{name} must be one of #{allowed.inspect}, got #{value.inspect}"
+        end
+      end
+    end
+  end
+end

data/app/components/hakumi_components/skeleton/node/component.rb

@@ -0,0 +1,59 @@
+# typed: strict
+# frozen_string_literal: true
+
+module HakumiComponents
+  module Skeleton
+    module Node
+      class Component < HakumiComponents::BaseComponent
+        extend T::Sig
+
+        sig do
+          params(
+            active: T::Boolean,
+            size: T.any(Integer, String),
+            html_options: Types::HtmlAttributeValue
+          ).void
+        end
+        def initialize(active: false, size: 40, **html_options)
+          @active = T.let(active, T::Boolean)
+          @size = T.let(size, T.any(Integer, String))
+          @html_options = T.let(html_options, Types::HtmlAttributes)
+
+          validate_props!
+        end
+
+        sig { returns(Types::HtmlAttributes) }
+        def wrapper_attributes
+          merge_attributes({ class: wrapper_classes }, @html_options.except(:class))
+        end
+
+        sig { returns(String) }
+        def node_classes
+          class_names("skeleton-node")
+        end
+
+        sig { returns(T.nilable(String)) }
+        def node_style
+          css = dimension_to_css(@size)
+          return nil unless css
+
+          "width: #{css}; height: #{css};"
+        end
+
+        private
+
+        sig { returns(String) }
+        def wrapper_classes
+          component_classes("skeleton", { element: true, active: @active }, @html_options)
+        end
+
+        sig { void }
+        def validate_props!
+          return if @size.is_a?(Numeric) || @size.is_a?(String)
+
+          raise ArgumentError, "size must be a number or string"
+        end
+      end
+    end
+  end
+end