nitro_kit 0.9.0 → 2.0.0.alpha.2

data/app/components/nitro_kit/grid.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+module NitroKit
+  class Grid < Component
+    COLUMNS = (1..12).to_a.freeze
+    GAPS = LayoutOptions::GAPS
+
+    def initialize(
+      cols:,
+      gap: 4,
+      id: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      cols = ResponsiveValue.new(property: :cols, value: cols, allowed: COLUMNS).to_s
+      gap = ResponsiveValue.new(property: :gap, value: gap, allowed: GAPS).to_s
+
+      super(
+        component: :grid,
+        attributes: { id:, data: { cols:, gap: } }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
+      )
+    end
+
+    def view_template
+      div(**root_attributes) { yield if block_given? }
+    end
+  end
+end

data/app/components/nitro_kit/icon.rb

@@ -1,45 +1,74 @@
 # frozen_string_literal: true
 
+require "lucide-rails"
+
 module NitroKit
   class Icon < Component
-    register_output_helper :lucide_icon
+    SIZES = %i[xs sm md lg xl].freeze
+    STROKE_WIDTHS = (0.5..4).freeze
+
+    def initialize(
+      name,
+      size: :md,
+      label: nil,
+      stroke_width: 1.5,
+      id: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      @name = name.to_s.tr("_", "-")
+      @size = validate_choice!(:size, size, SIZES)
+      @label = label
+      if !label.nil? && (!label.is_a?(String) || label.strip.empty?)
+        raise ArgumentError, "Icon label: must be a non-blank String"
+      end
+      @stroke_width = validate_stroke_width!(stroke_width)
+      @icon = LucideRails::IconProvider.icon(@name)
 
-    def initialize(name, size: :md, **attrs)
-      @name = name
-      @size = size
+      raise ArgumentError, "Unknown icon #{@name.inspect}" unless @icon
+
+      icon_aria = label ? { label:, hidden: false } : { hidden: true }
 
       super(
-        attrs,
-        class: size_class,
-        stroke_width: 1.5
+        component: :icon,
+        attributes: {
+          id:,
+          width: 24,
+          height: 24,
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          stroke_width: @stroke_width,
+          stroke_linecap: "round",
+          stroke_linejoin: "round",
+          focusable: false,
+          role: label && "img",
+          aria: icon_aria
+        }.compact,
+        html:,
+        aria:,
+        data:,
+        size:,
+        desperately_need_a_class:
       )
     end
 
-    attr_reader :name, :size
+    attr_reader :name, :size, :label, :stroke_width
 
     def view_template
-      lucide_icon(name, **dasherized_attrs)
+      svg(**root_attributes) { raw safe(@icon) }
     end
 
     private
 
-    def size_class
-      case size
-      when :xs
-        "size-3"
-      when :sm
-        "size-4"
-      when :md
-        "size-5"
-      when :lg
-        "size-7"
-      else
-        raise ArgumentError, "Unknown size `#{size}'"
-      end
-    end
+    def validate_stroke_width!(value)
+      return value if value.is_a?(Numeric) && !value.is_a?(Complex) && STROKE_WIDTHS.cover?(value)
 
-    def dasherized_attrs
-      attrs.transform_keys { |k| k.to_s.dasherize }
+      raise ArgumentError,
+        "Icon stroke_width: must be a number between #{STROKE_WIDTHS.begin} and #{STROKE_WIDTHS.end}; " \
+        "received #{value.inspect}"
     end
   end
 end

data/app/components/nitro_kit/input.rb

@@ -2,25 +2,112 @@
 
 module NitroKit
   class Input < Component
-    def initialize(**attrs)
+    TYPES = %i[
+      button checkbox color date datetime-local email file hidden month number password radio
+      range search tel text time url week
+    ].freeze
+    OWNED_ATTRIBUTES = %i[
+      type id name value placeholder disabled readonly required autocomplete min max step
+      minlength maxlength multiple accept pattern inputmode checked
+    ].freeze
+
+    def initialize(
+      type: :text,
+      id: nil,
+      name: nil,
+      value: nil,
+      placeholder: nil,
+      disabled: false,
+      readonly: false,
+      required: false,
+      autocomplete: nil,
+      min: nil,
+      max: nil,
+      step: nil,
+      minlength: nil,
+      maxlength: nil,
+      multiple: false,
+      accept: nil,
+      pattern: nil,
+      inputmode: nil,
+      checked: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      normalized_type = type.to_s.tr("_", "-").to_sym
+      @type = validate_choice!(:type, normalized_type, TYPES)
+      disabled = validate_boolean!(:disabled, disabled)
+      readonly = validate_boolean!(:readonly, readonly)
+      required = validate_boolean!(:required, required)
+      multiple = validate_boolean!(:multiple, multiple)
+      checked = validate_boolean!(:checked, checked, allow_nil: true)
+      minlength = validate_non_negative_integer!(:minlength, minlength)
+      maxlength = validate_non_negative_integer!(:maxlength, maxlength)
+      if minlength && maxlength && minlength > maxlength
+        raise ArgumentError, "minlength cannot exceed maxlength"
+      end
+      if @type == :file && !value.nil?
+        raise ArgumentError, "file inputs never carry a value; omit value:"
+      end
+      reject_owned_attributes!(html)
+
       super(
-        attrs,
-        class: base_class
+        component: :input,
+        attributes: {
+          type: @type,
+          id:,
+          name:,
+          value:,
+          placeholder:,
+          disabled:,
+          readonly:,
+          required:,
+          autocomplete:,
+          min:,
+          max:,
+          step:,
+          minlength:,
+          maxlength:,
+          multiple:,
+          accept:,
+          pattern:,
+          inputmode:,
+          checked:
+        }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
       )
     end
 
+    attr_reader :type
+
     def view_template
-      input(**attrs)
+      input(**root_attributes)
     end
 
     private
 
-    def base_class
-      [
-        "block rounded-md border bg-background border-border text-base px-3 py-2 h-10",
-        # Focus
-        "focus-visible:outline-none ring-ring ring-offset-2 ring-offset-background focus-visible:ring-2"
-      ]
+    def reject_owned_attributes!(html)
+      return unless html.is_a?(Hash)
+
+      html.each_key do |key|
+        normalized = key.to_s.downcase.tr("_", "-")
+        owned = OWNED_ATTRIBUTES.find { |name| name.to_s.tr("_", "-") == normalized }
+        next unless owned
+
+        raise ArgumentError, "#{normalized} is owned by Input; pass #{owned}: as a keyword"
+      end
+    end
+
+    def validate_non_negative_integer!(name, value)
+      return if value.nil?
+      return value if value.is_a?(Integer) && value >= 0
+
+      raise ArgumentError, "#{name} must be a non-negative Integer"
     end
   end
 end

data/app/components/nitro_kit/label.rb

@@ -2,22 +2,38 @@
 
 module NitroKit
   class Label < Component
-    def initialize(text = nil, **attrs)
+    def initialize(
+      text = nil,
+      for: nil,
+      id: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      if !text.nil? && (!text.is_a?(String) || text.strip.empty?)
+        raise ArgumentError, "label text must be a non-blank String"
+      end
       @text = text
 
       super(
-        attrs,
-        class: "text-sm font-medium select-none",
-        data: { slot: "label" }
+        component: :label,
+        attributes: { for:, id: }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
       )
     end
 
     attr_reader :text
 
     def view_template(&block)
-      label(**attrs) do
-        text_or_block(text, &block)
+      if text.nil? && !block
+        raise ArgumentError, "label requires text or a block"
       end
+
+      label(**root_attributes) { text_or_block(text, &block) }
     end
   end
 end

data/app/components/nitro_kit/layout_options.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module NitroKit
+  module LayoutOptions
+    GAPS = [ 0, 1, 2, 3, 4, 5, 6, 8, 10, 12, 16 ].freeze
+  end
+end

data/app/components/nitro_kit/page_header.rb

@@ -0,0 +1,76 @@
+# frozen_string_literal: true
+
+module NitroKit
+  class PageHeader < Component
+    Child = Data.define(:component, :content)
+    TITLE_LEVELS = (1..6).freeze
+
+    def initialize(
+      title: nil,
+      eyebrow: nil,
+      description: nil,
+      level: 1,
+      id: nil,
+      html: {},
+      aria: {},
+      data: {},
+      desperately_need_a_class: nil
+    )
+      @title_content = content_from_keyword(:title, title)
+      @eyebrow_content = content_from_keyword(:eyebrow, eyebrow)
+      @description_content = content_from_keyword(:description, description)
+      @level = validate_choice!(:level, level, TITLE_LEVELS)
+      @actions = nil
+
+      super(
+        component: :page_header,
+        attributes: { id: }.compact,
+        html:,
+        aria:,
+        data:,
+        desperately_need_a_class:
+      )
+    end
+
+    attr_reader :level
+
+    def view_template
+      yield self if block_given?
+      require_content!("PageHeader", :title, @title_content)
+
+      header(**root_attributes) do
+        p(**slot_attributes(:eyebrow)) { render_deferred_content(@eyebrow_content) } if @eyebrow_content
+        public_send(:"h#{level}", **slot_attributes(:title)) { render_deferred_content(@title_content) }
+        if @description_content
+          p(**slot_attributes(:description)) { render_deferred_content(@description_content) }
+        end
+        render_in_slot(@actions.component, :actions, &@actions.content) if @actions
+      end
+    end
+
+    def eyebrow(text = nil, &block)
+      @eyebrow_content = declare_content(:eyebrow, @eyebrow_content, text, &block)
+      nil
+    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 actions(component, &content)
+      unless component.is_a?(NitroKit::ButtonGroup)
+        raise ArgumentError, "PageHeader actions must be a NitroKit::ButtonGroup"
+      end
+      raise ArgumentError, "PageHeader accepts at most one actions group" if @actions
+
+      @actions = Child.new(component:, content:)
+      nil
+    end
+  end
+end