fernandes-ui 0.1.1 → 0.1.4

data/app/view_components/ui/select_group_component.rb

@@ -1,26 +1,26 @@
 # frozen_string_literal: true
 
-    # GroupComponent - ViewComponent implementation
-    #
-    # Container for grouping select items with a label.
-    #
-    # @example Basic usage
-    #   <%= render UI::GroupComponent.new do %>
-    #     <%= render UI::LabelComponent.new { "North America" } %>
-    #     <%= render UI::ItemComponent.new(value: "america/new_york") { "Eastern Time" } %>
-    #     <%= render UI::ItemComponent.new(value: "america/chicago") { "Central Time" } %>
-    #   <% end %>
-    class UI::SelectGroupComponent < ViewComponent::Base
-      include UI::SelectGroupBehavior
+# GroupComponent - ViewComponent implementation
+#
+# Container for grouping select items with a label.
+#
+# @example Basic usage
+#   <%= render UI::GroupComponent.new do %>
+#     <%= render UI::LabelComponent.new { "North America" } %>
+#     <%= render UI::ItemComponent.new(value: "america/new_york") { "Eastern Time" } %>
+#     <%= render UI::ItemComponent.new(value: "america/chicago") { "Central Time" } %>
+#   <% end %>
+class UI::SelectGroupComponent < ViewComponent::Base
+  include UI::SelectGroupBehavior
 
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(classes: "", **attributes)
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(classes: "", **attributes)
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, content, **select_group_html_attributes.deep_merge(@attributes)
-      end
-    end
+  def call
+    content_tag :div, content, **select_group_html_attributes.deep_merge(@attributes)
+  end
+end

data/app/view_components/ui/select_item_component.rb

@@ -1,45 +1,44 @@
 # frozen_string_literal: true
 
-    # ItemComponent - ViewComponent implementation
-    #
-    # Individual selectable option in the dropdown.
-    #
-    # @example Basic usage
-    #   <%= render UI::ItemComponent.new(value: "apple") { "Apple" } %>
-    #
-    # @example Disabled item
-    #   <%= render UI::ItemComponent.new(value: "angular", disabled: true) { "Angular (Coming Soon)" } %>
-    class UI::SelectItemComponent < ViewComponent::Base
-      include UI::SelectItemBehavior
+# ItemComponent - ViewComponent implementation
+#
+# Individual selectable option in the dropdown.
+#
+# @example Basic usage
+#   <%= render UI::ItemComponent.new(value: "apple") { "Apple" } %>
+#
+# @example Disabled item
+#   <%= render UI::ItemComponent.new(value: "angular", disabled: true) { "Angular (Coming Soon)" } %>
+class UI::SelectItemComponent < ViewComponent::Base
+  include UI::SelectItemBehavior
 
-      # @param value [String] Value of this option
-      # @param disabled [Boolean] Whether the item is disabled
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(value: nil, disabled: false, classes: "", **attributes)
-        @value = value
-        @disabled = disabled
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param value [String] Value of this option
+  # @param disabled [Boolean] Whether the item is disabled
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(value: nil, disabled: false, classes: "", **attributes)
+    @value = value
+    @disabled = disabled
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, **select_item_html_attributes.deep_merge(@attributes) do
-          safe_join([
-            content_tag(:span, content, class: "flex-1"),
-            content_tag(:svg,
-              content_tag(:path, nil, d: "M20 6 9 17l-5-5"),
-              data: { ui__select_target: "itemCheck" },
-              class: "ml-auto size-4 opacity-0 transition-opacity",
-              xmlns: "http://www.w3.org/2000/svg",
-              viewBox: "0 0 24 24",
-              fill: "none",
-              stroke: "currentColor",
-              stroke_width: "2",
-              stroke_linecap: "round",
-              stroke_linejoin: "round"
-            )
-          ])
-        end
-      end
+  def call
+    content_tag :div, **select_item_html_attributes.deep_merge(@attributes) do
+      safe_join([
+        content_tag(:span, content, class: "flex-1"),
+        content_tag(:svg,
+          content_tag(:path, nil, d: "M20 6 9 17l-5-5"),
+          data: {ui__select_target: "itemCheck"},
+          class: "ml-auto size-4 opacity-0 transition-opacity",
+          xmlns: "http://www.w3.org/2000/svg",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          stroke_width: "2",
+          stroke_linecap: "round",
+          stroke_linejoin: "round")
+      ])
     end
+  end
+end

data/app/view_components/ui/select_label_component.rb

@@ -1,22 +1,22 @@
 # frozen_string_literal: true
 
-    # LabelComponent - ViewComponent implementation
-    #
-    # Label for a group of select items.
-    #
-    # @example Basic usage
-    #   <%= render UI::LabelComponent.new { "North America" } %>
-    class UI::SelectLabelComponent < ViewComponent::Base
-      include UI::SelectLabelBehavior
+# LabelComponent - ViewComponent implementation
+#
+# Label for a group of select items.
+#
+# @example Basic usage
+#   <%= render UI::LabelComponent.new { "North America" } %>
+class UI::SelectLabelComponent < ViewComponent::Base
+  include UI::SelectLabelBehavior
 
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(classes: "", **attributes)
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(classes: "", **attributes)
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, content, **select_label_html_attributes.deep_merge(@attributes)
-      end
-    end
+  def call
+    content_tag :div, content, **select_label_html_attributes.deep_merge(@attributes)
+  end
+end

data/app/view_components/ui/select_scroll_down_button_component.rb

@@ -1,35 +1,35 @@
 # frozen_string_literal: true
 
-    # ScrollDownButtonComponent - ViewComponent implementation
-    #
-    # Button that appears when content is scrollable downward.
-    # Automatically hidden when at bottom of list.
-    #
-    # @example Default usage (no customization needed)
-    #   <%= render UI::ScrollDownButtonComponent.new %>
-    class UI::SelectScrollDownButtonComponent < ViewComponent::Base
-      include UI::SelectScrollDownButtonBehavior
+# ScrollDownButtonComponent - ViewComponent implementation
+#
+# Button that appears when content is scrollable downward.
+# Automatically hidden when at bottom of list.
+#
+# @example Default usage (no customization needed)
+#   <%= render UI::ScrollDownButtonComponent.new %>
+class UI::SelectScrollDownButtonComponent < ViewComponent::Base
+  include UI::SelectScrollDownButtonBehavior
 
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(classes: "", **attributes)
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(classes: "", **attributes)
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, **select_scroll_down_button_html_attributes.deep_merge(@attributes) do
-          content_tag :svg, nil,
-            class: "size-4",
-            xmlns: "http://www.w3.org/2000/svg",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            stroke_width: "2",
-            stroke_linecap: "round",
-            stroke_linejoin: "round" do
-              content_tag :path, nil, d: "m6 9 6 6 6-6"
-            end
+  def call
+    content_tag :div, **select_scroll_down_button_html_attributes.deep_merge(@attributes) do
+      content_tag :svg, nil,
+        class: "size-4",
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        stroke_width: "2",
+        stroke_linecap: "round",
+        stroke_linejoin: "round" do
+          content_tag :path, nil, d: "m6 9 6 6 6-6"
         end
-      end
     end
+  end
+end

data/app/view_components/ui/select_scroll_up_button_component.rb

@@ -1,35 +1,35 @@
 # frozen_string_literal: true
 
-    # ScrollUpButtonComponent - ViewComponent implementation
-    #
-    # Button that appears when content is scrollable upward.
-    # Automatically hidden when at top of list.
-    #
-    # @example Default usage (no customization needed)
-    #   <%= render UI::ScrollUpButtonComponent.new %>
-    class UI::SelectScrollUpButtonComponent < ViewComponent::Base
-      include UI::SelectScrollUpButtonBehavior
+# ScrollUpButtonComponent - ViewComponent implementation
+#
+# Button that appears when content is scrollable upward.
+# Automatically hidden when at top of list.
+#
+# @example Default usage (no customization needed)
+#   <%= render UI::ScrollUpButtonComponent.new %>
+class UI::SelectScrollUpButtonComponent < ViewComponent::Base
+  include UI::SelectScrollUpButtonBehavior
 
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(classes: "", **attributes)
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(classes: "", **attributes)
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, **select_scroll_up_button_html_attributes.deep_merge(@attributes) do
-          content_tag :svg, nil,
-            class: "size-4",
-            xmlns: "http://www.w3.org/2000/svg",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            stroke_width: "2",
-            stroke_linecap: "round",
-            stroke_linejoin: "round" do
-              content_tag :path, nil, d: "m18 15-6-6-6 6"
-            end
+  def call
+    content_tag :div, **select_scroll_up_button_html_attributes.deep_merge(@attributes) do
+      content_tag :svg, nil,
+        class: "size-4",
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        stroke_width: "2",
+        stroke_linecap: "round",
+        stroke_linejoin: "round" do
+          content_tag :path, nil, d: "m18 15-6-6-6 6"
         end
-      end
     end
+  end
+end

data/app/view_components/ui/select_trigger_component.rb

@@ -1,27 +1,27 @@
 # frozen_string_literal: true
 
-    # TriggerComponent - ViewComponent implementation
-    #
-    # Button that opens the select dropdown.
-    # Note: ViewComponent version uses template for asChild support
-    #
-    # @example Default button
-    #   <%= render UI::TriggerComponent.new(placeholder: "Select a fruit...") %>
-    class UI::SelectTriggerComponent < ViewComponent::Base
-      include UI::SelectTriggerBehavior
+# TriggerComponent - ViewComponent implementation
+#
+# Button that opens the select dropdown.
+# Note: ViewComponent version uses template for asChild support
+#
+# @example Default button
+#   <%= render UI::TriggerComponent.new(placeholder: "Select a fruit...") %>
+class UI::SelectTriggerComponent < ViewComponent::Base
+  include UI::SelectTriggerBehavior
 
-      # @param placeholder [String] Placeholder text when no value selected
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(placeholder: "Select...", classes: "", **attributes)
-        @placeholder = placeholder
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param placeholder [String] Placeholder text when no value selected
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(placeholder: "Select...", classes: "", **attributes)
+    @placeholder = placeholder
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :button, **select_trigger_html_attributes.deep_merge(@attributes) do
-          content_tag :span, @placeholder, data: { ui__select_target: "valueDisplay" }
-        end
-      end
+  def call
+    content_tag :button, **select_trigger_html_attributes.deep_merge(@attributes) do
+      content_tag :span, @placeholder, data: {ui__select_target: "valueDisplay"}
     end
+  end
+end

data/app/view_components/ui/separator_component.rb

@@ -1,27 +1,27 @@
 # frozen_string_literal: true
 
-    # Separator - ViewComponent implementation
-    #
-    # Visually or semantically separates content.
-    # Uses SeparatorBehavior module for shared styling logic.
-    #
-    # Based on shadcn/ui Separator: https://ui.shadcn.com/docs/components/separator
-    # Based on Radix UI Separator: https://www.radix-ui.com/primitives/docs/components/separator
-    class UI::SeparatorComponent < ViewComponent::Base
-      include UI::SeparatorBehavior
+# Separator - ViewComponent implementation
+#
+# Visually or semantically separates content.
+# Uses SeparatorBehavior module for shared styling logic.
+#
+# Based on shadcn/ui Separator: https://ui.shadcn.com/docs/components/separator
+# Based on Radix UI Separator: https://www.radix-ui.com/primitives/docs/components/separator
+class UI::SeparatorComponent < ViewComponent::Base
+  include UI::SeparatorBehavior
 
-      # @param orientation [Symbol, String] Direction of the separator (:horizontal, :vertical)
-      # @param decorative [Boolean] Whether the separator is purely decorative (true) or has semantic meaning (false)
-      # @param classes [String] Additional CSS classes to merge
-      # @param attributes [Hash] Additional HTML attributes
-      def initialize(orientation: :horizontal, decorative: true, classes: "", **attributes)
-        @orientation = orientation
-        @decorative = decorative
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param orientation [Symbol, String] Direction of the separator (:horizontal, :vertical)
+  # @param decorative [Boolean] Whether the separator is purely decorative (true) or has semantic meaning (false)
+  # @param classes [String] Additional CSS classes to merge
+  # @param attributes [Hash] Additional HTML attributes
+  def initialize(orientation: :horizontal, decorative: true, classes: "", **attributes)
+    @orientation = orientation
+    @decorative = decorative
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        tag.div(**separator_html_attributes.deep_merge(@attributes))
-      end
-    end
+  def call
+    tag.div(**separator_html_attributes.deep_merge(@attributes))
+  end
+end

data/app/view_components/ui/sheet_close_component.rb

@@ -1,71 +1,71 @@
 # frozen_string_literal: true
 
-    # Sheet close component (ViewComponent)
-    # Closes the sheet on click
-    #
-    # @example As button (default)
-    #   <%= render UI::CloseComponent.new { "Close" } %>
-    #
-    # @example As child (composition pattern)
-    #   <%= render UI::CloseComponent.new(as_child: true) do %>
-    #     <%= render UI::ButtonComponent.new(variant: :outline) { "Cancel" } %>
-    #   <% end %>
-    class UI::SheetCloseComponent < ViewComponent::Base
-      # @param as_child [Boolean] merge attributes into child element
-      # @param variant [Symbol] button variant (when not using as_child)
-      # @param size [Symbol] button size (when not using as_child)
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(as_child: false, variant: :outline, size: :default, classes: "", **attributes)
-        @as_child = as_child
-        @variant = variant
-        @size = size
-        @classes = classes
-        @attributes = attributes
-      end
-
-      def call
-        close_attrs = {
-          data: { action: "click->ui--dialog#close" }
-        }.deep_merge(@attributes)
+# Sheet close component (ViewComponent)
+# Closes the sheet on click
+#
+# @example As button (default)
+#   <%= render UI::CloseComponent.new { "Close" } %>
+#
+# @example As child (composition pattern)
+#   <%= render UI::CloseComponent.new(as_child: true) do %>
+#     <%= render UI::ButtonComponent.new(variant: :outline) { "Cancel" } %>
+#   <% end %>
+class UI::SheetCloseComponent < ViewComponent::Base
+  # @param as_child [Boolean] merge attributes into child element
+  # @param variant [Symbol] button variant (when not using as_child)
+  # @param size [Symbol] button size (when not using as_child)
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(as_child: false, variant: :outline, size: :default, classes: "", **attributes)
+    @as_child = as_child
+    @variant = variant
+    @size = size
+    @classes = classes
+    @attributes = attributes
+  end
 
-        if @as_child
-          # asChild mode: merge attributes into child element
-          rendered = content.to_s
-          doc = Nokogiri::HTML::DocumentFragment.parse(rendered)
-          first_element = doc.children.find { |node| node.element? }
+  def call
+    close_attrs = {
+      data: {action: "click->ui--dialog#close"}
+    }.deep_merge(@attributes)
 
-          if first_element
-            # Merge data attributes (convert Rails naming to HTML)
-            close_attrs.fetch(:data, {}).each do |key, value|
-              html_key = key.to_s.gsub("__", "--").gsub("_", "-")
-              first_element["data-#{html_key}"] = value
-            end
+    if @as_child
+      # asChild mode: merge attributes into child element
+      rendered = content.to_s
+      doc = Nokogiri::HTML::DocumentFragment.parse(rendered)
+      first_element = doc.children.find { |node| node.element? }
 
-            # Merge CSS classes with TailwindMerge
-            if close_attrs[:class]
-              existing_classes = first_element["class"] || ""
-              merged_classes = TailwindMerge::Merger.new.merge([existing_classes, close_attrs[:class]].join(" "))
-              first_element["class"] = merged_classes
-            end
+      if first_element
+        # Merge data attributes (convert Rails naming to HTML)
+        close_attrs.fetch(:data, {}).each do |key, value|
+          html_key = key.to_s.gsub("__", "--").tr("_", "-")
+          first_element["data-#{html_key}"] = value
+        end
 
-            # Merge other attributes (except data and class)
-            close_attrs.except(:data, :class).each do |key, value|
-              first_element[key.to_s] = value
-            end
+        # Merge CSS classes with TailwindMerge
+        if close_attrs[:class]
+          existing_classes = first_element["class"] || ""
+          merged_classes = TailwindMerge::Merger.new.merge([existing_classes, close_attrs[:class]].join(" "))
+          first_element["class"] = merged_classes
+        end
 
-            doc.to_html.html_safe
-          else
-            content
-          end
-        else
-          # Default: render as Button component
-          render(UI::ButtonComponent.new(
-            variant: @variant,
-            size: @size,
-            classes: @classes,
-            **close_attrs
-          ).with_content(content))
+        # Merge other attributes (except data and class)
+        close_attrs.except(:data, :class).each do |key, value|
+          first_element[key.to_s] = value
         end
+
+        doc.to_html.html_safe
+      else
+        content
       end
+    else
+      # Default: render as Button component
+      render(UI::ButtonComponent.new(
+        variant: @variant,
+        size: @size,
+        classes: @classes,
+        **close_attrs
+      ).with_content(content))
     end
+  end
+end

data/app/view_components/ui/sheet_component.rb

@@ -1,50 +1,50 @@
 # frozen_string_literal: true
 
-    # Sheet container component (ViewComponent)
-    # A panel that slides in from the edge of the screen
-    #
-    # @example Basic usage
-    #   <%= render UI::SheetComponent.new do %>
-    #     <%= render UI::TriggerComponent.new { "Open Sheet" } %>
-    #     <%= render UI::OverlayComponent.new do %>
-    #       <%= render UI::ContentComponent.new do %>
-    #         <%= render UI::HeaderComponent.new do %>
-    #           <%= render UI::TitleComponent.new { "Sheet Title" } %>
-    #           <%= render UI::DescriptionComponent.new { "Sheet description" } %>
-    #         <% end %>
-    #         <!-- Content -->
-    #         <%= render UI::FooterComponent.new do %>
-    #           <%= render UI::CloseComponent.new { "Cancel" } %>
-    #         <% end %>
-    #       <% end %>
-    #     <% end %>
-    #   <% end %>
-    class UI::SheetComponent < ViewComponent::Base
-      include UI::SheetBehavior
+# Sheet container component (ViewComponent)
+# A panel that slides in from the edge of the screen
+#
+# @example Basic usage
+#   <%= render UI::SheetComponent.new do %>
+#     <%= render UI::TriggerComponent.new { "Open Sheet" } %>
+#     <%= render UI::OverlayComponent.new do %>
+#       <%= render UI::ContentComponent.new do %>
+#         <%= render UI::HeaderComponent.new do %>
+#           <%= render UI::TitleComponent.new { "Sheet Title" } %>
+#           <%= render UI::DescriptionComponent.new { "Sheet description" } %>
+#         <% end %>
+#         <!-- Content -->
+#         <%= render UI::FooterComponent.new do %>
+#           <%= render UI::CloseComponent.new { "Cancel" } %>
+#         <% end %>
+#       <% end %>
+#     <% end %>
+#   <% end %>
+class UI::SheetComponent < ViewComponent::Base
+  include UI::SheetBehavior
 
-      # @param open [Boolean] whether the sheet is open
-      # @param close_on_escape [Boolean] close on Escape key press
-      # @param close_on_overlay_click [Boolean] close on overlay click
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(
-        open: false,
-        close_on_escape: true,
-        close_on_overlay_click: true,
-        classes: "",
-        **attributes
-      )
-        @open = open
-        @close_on_escape = close_on_escape
-        @close_on_overlay_click = close_on_overlay_click
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param open [Boolean] whether the sheet is open
+  # @param close_on_escape [Boolean] close on Escape key press
+  # @param close_on_overlay_click [Boolean] close on overlay click
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(
+    open: false,
+    close_on_escape: true,
+    close_on_overlay_click: true,
+    classes: "",
+    **attributes
+  )
+    @open = open
+    @close_on_escape = close_on_escape
+    @close_on_overlay_click = close_on_overlay_click
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        attrs = sheet_html_attributes
-        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+  def call
+    attrs = sheet_html_attributes
+    attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
 
-        content_tag :div, content, **attrs.merge(@attributes.except(:data))
-      end
-    end
+    content_tag :div, content, **attrs.merge(@attributes.except(:data))
+  end
+end