fernandes-ui 0.1.1 → 0.1.2

data/app/view_components/ui/dialog_trigger_component.rb

@@ -1,71 +1,71 @@
 # frozen_string_literal: true
 
-    # Dialog trigger component (ViewComponent)
-    # Opens the dialog on click
-    #
-    # @example As button (default)
-    #   <%= render UI::TriggerComponent.new { "Open Dialog" } %>
-    #
-    # @example As child (composition pattern)
-    #   <%= render UI::TriggerComponent.new(as_child: true) do %>
-    #     <%= render UI::ButtonComponent.new(variant: :outline) { "Open" } %>
-    #   <% end %>
-    class UI::DialogTriggerComponent < 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
-        trigger_attrs = {
-          data: { action: "click->ui--dialog#open" }
-        }.deep_merge(@attributes)
+# Dialog trigger component (ViewComponent)
+# Opens the dialog on click
+#
+# @example As button (default)
+#   <%= render UI::TriggerComponent.new { "Open Dialog" } %>
+#
+# @example As child (composition pattern)
+#   <%= render UI::TriggerComponent.new(as_child: true) do %>
+#     <%= render UI::ButtonComponent.new(variant: :outline) { "Open" } %>
+#   <% end %>
+class UI::DialogTriggerComponent < 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
+    trigger_attrs = {
+      data: {action: "click->ui--dialog#open"}
+    }.deep_merge(@attributes)
 
-          if first_element
-            # Merge data attributes (convert Rails naming to HTML)
-            trigger_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 trigger_attrs[:class]
-              existing_classes = first_element["class"] || ""
-              merged_classes = TailwindMerge::Merger.new.merge([existing_classes, trigger_attrs[:class]].join(" "))
-              first_element["class"] = merged_classes
-            end
+      if first_element
+        # Merge data attributes (convert Rails naming to HTML)
+        trigger_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)
-            trigger_attrs.except(:data, :class).each do |key, value|
-              first_element[key.to_s] = value
-            end
+        # Merge CSS classes with TailwindMerge
+        if trigger_attrs[:class]
+          existing_classes = first_element["class"] || ""
+          merged_classes = TailwindMerge::Merger.new.merge([existing_classes, trigger_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,
-            **trigger_attrs
-          ).with_content(content))
+        # Merge other attributes (except data and class)
+        trigger_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,
+        **trigger_attrs
+      ).with_content(content))
     end
+  end
+end

data/app/view_components/ui/drawer_close_component.rb

@@ -1,35 +1,35 @@
 # frozen_string_literal: true
 
-    # Drawer close component (ViewComponent)
-    # Close button for drawer
-    #
-    # @example
-    #   <%= render UI::CloseComponent.new { "Cancel" } %>
-    #
-    # @example With custom variant
-    #   <%= render UI::CloseComponent.new(variant: :ghost) { "Close" } %>
-    class UI::DrawerCloseComponent < ViewComponent::Base
-      include UI::DrawerCloseBehavior
+# Drawer close component (ViewComponent)
+# Close button for drawer
+#
+# @example
+#   <%= render UI::CloseComponent.new { "Cancel" } %>
+#
+# @example With custom variant
+#   <%= render UI::CloseComponent.new(variant: :ghost) { "Close" } %>
+class UI::DrawerCloseComponent < ViewComponent::Base
+  include UI::DrawerCloseBehavior
 
-      # @param variant [Symbol] button variant (:default, :outline, :ghost, etc.)
-      # @param size [Symbol] button size (:default, :sm, :lg, etc.)
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(variant: :outline, size: :default, classes: "", attributes: {})
-        @variant = variant
-        @size = size
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param variant [Symbol] button variant (:default, :outline, :ghost, etc.)
+  # @param size [Symbol] button size (:default, :sm, :lg, etc.)
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(variant: :outline, size: :default, classes: "", attributes: {})
+    @variant = variant
+    @size = size
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        render UI::ButtonComponent.new(
-          variant: @variant,
-          size: @size,
-          classes: @classes,
-          **drawer_close_data_attributes.merge(@attributes)
-        ) do
-          content
-        end
-      end
+  def call
+    render UI::ButtonComponent.new(
+      variant: @variant,
+      size: @size,
+      classes: @classes,
+      **drawer_close_data_attributes.merge(@attributes)
+    ) do
+      content
     end
+  end
+end

data/app/view_components/ui/drawer_component.rb

@@ -1,81 +1,81 @@
 # frozen_string_literal: true
 
-    # Drawer container component (ViewComponent)
-    # A mobile-first drawer with gesture-based drag-to-close
-    #
-    # @example Basic usage
-    #   <%= render UI::DrawerComponent.new(open: false) do %>
-    #     <%= render UI::TriggerComponent.new { "Open Drawer" } %>
-    #     <%= render UI::OverlayComponent.new %>
-    #     <%= render UI::ContentComponent.new do %>
-    #       <%= render UI::HeaderComponent.new do %>
-    #         <%= render UI::TitleComponent.new { "Drawer Title" } %>
-    #         <%= render UI::DescriptionComponent.new { "Drawer description" } %>
-    #       <% end %>
-    #       <!-- Content -->
-    #       <%= render UI::FooterComponent.new do %>
-    #         <%= render UI::CloseComponent.new { "Cancel" } %>
-    #       <% end %>
-    #     <% end %>
-    #   <% end %>
-    #
-    # @example With snap points
-    #   <%= render UI::DrawerComponent.new(
-    #     snap_points: ["148px", "355px", 1],
-    #     modal: false
-    #   ) do %>
-    #     <!-- Drawer content -->
-    #   <% end %>
-    class UI::DrawerComponent < ViewComponent::Base
-      include UI::DrawerBehavior
+# Drawer container component (ViewComponent)
+# A mobile-first drawer with gesture-based drag-to-close
+#
+# @example Basic usage
+#   <%= render UI::DrawerComponent.new(open: false) do %>
+#     <%= render UI::TriggerComponent.new { "Open Drawer" } %>
+#     <%= render UI::OverlayComponent.new %>
+#     <%= render UI::ContentComponent.new do %>
+#       <%= render UI::HeaderComponent.new do %>
+#         <%= render UI::TitleComponent.new { "Drawer Title" } %>
+#         <%= render UI::DescriptionComponent.new { "Drawer description" } %>
+#       <% end %>
+#       <!-- Content -->
+#       <%= render UI::FooterComponent.new do %>
+#         <%= render UI::CloseComponent.new { "Cancel" } %>
+#       <% end %>
+#     <% end %>
+#   <% end %>
+#
+# @example With snap points
+#   <%= render UI::DrawerComponent.new(
+#     snap_points: ["148px", "355px", 1],
+#     modal: false
+#   ) do %>
+#     <!-- Drawer content -->
+#   <% end %>
+class UI::DrawerComponent < ViewComponent::Base
+  include UI::DrawerBehavior
 
-      # @param open [Boolean] whether the drawer is open
-      # @param direction [String] drawer position: "bottom", "top", "left", "right"
-      # @param dismissible [Boolean] allow closing via drag/overlay/escape
-      # @param modal [Boolean] block background interaction
-      # @param snap_points [Array] snap positions (px values or 0-1)
-      # @param active_snap_point [Integer] current snap point index
-      # @param fade_from_index [Integer] overlay fade threshold
-      # @param snap_to_sequential_point [Boolean] prevent velocity-based skip
-      # @param handle_only [Boolean] restrict dragging to handle only
-      # @param reposition_inputs [Boolean] reposition when keyboard appears
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(
-        open: false,
-        direction: "bottom",
-        dismissible: true,
-        modal: true,
-        snap_points: nil,
-        active_snap_point: nil,
-        fade_from_index: nil,
-        snap_to_sequential_point: false,
-        handle_only: false,
-        reposition_inputs: true,
-        classes: "",
-        id: nil,
-        attributes: {}
-      )
-        @open = open
-        @direction = direction
-        @dismissible = dismissible
-        @modal = modal
-        @snap_points = snap_points
-        @active_snap_point = active_snap_point
-        @fade_from_index = fade_from_index
-        @snap_to_sequential_point = snap_to_sequential_point
-        @handle_only = handle_only
-        @reposition_inputs = reposition_inputs
-        @classes = classes
-        @id = id
-        @attributes = attributes
-      end
+  # @param open [Boolean] whether the drawer is open
+  # @param direction [String] drawer position: "bottom", "top", "left", "right"
+  # @param dismissible [Boolean] allow closing via drag/overlay/escape
+  # @param modal [Boolean] block background interaction
+  # @param snap_points [Array] snap positions (px values or 0-1)
+  # @param active_snap_point [Integer] current snap point index
+  # @param fade_from_index [Integer] overlay fade threshold
+  # @param snap_to_sequential_point [Boolean] prevent velocity-based skip
+  # @param handle_only [Boolean] restrict dragging to handle only
+  # @param reposition_inputs [Boolean] reposition when keyboard appears
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(
+    open: false,
+    direction: "bottom",
+    dismissible: true,
+    modal: true,
+    snap_points: nil,
+    active_snap_point: nil,
+    fade_from_index: nil,
+    snap_to_sequential_point: false,
+    handle_only: false,
+    reposition_inputs: true,
+    classes: "",
+    id: nil,
+    attributes: {}
+  )
+    @open = open
+    @direction = direction
+    @dismissible = dismissible
+    @modal = modal
+    @snap_points = snap_points
+    @active_snap_point = active_snap_point
+    @fade_from_index = fade_from_index
+    @snap_to_sequential_point = snap_to_sequential_point
+    @handle_only = handle_only
+    @reposition_inputs = reposition_inputs
+    @classes = classes
+    @id = id
+    @attributes = attributes
+  end
 
-      def call
-        attrs = drawer_html_attributes
-        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
-        attrs[:id] = @id if @id
+  def call
+    attrs = drawer_html_attributes
+    attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+    attrs[:id] = @id if @id
 
-        content_tag :div, content, **attrs.merge(@attributes.except(:data))
-      end
-    end
+    content_tag :div, content, **attrs.merge(@attributes.except(:data))
+  end
+end

data/app/view_components/ui/drawer_content_component.rb

@@ -1,32 +1,32 @@
 # frozen_string_literal: true
 
-    # Drawer content component (ViewComponent)
-    # Main draggable panel with direction support
-    #
-    # @example
-    #   <%= render UI::ContentComponent.new(direction: "bottom") do %>
-    #     <!-- Drawer content -->
-    #   <% end %>
-    class UI::DrawerContentComponent < ViewComponent::Base
-      include UI::DrawerContentBehavior
+# Drawer content component (ViewComponent)
+# Main draggable panel with direction support
+#
+# @example
+#   <%= render UI::ContentComponent.new(direction: "bottom") do %>
+#     <!-- Drawer content -->
+#   <% end %>
+class UI::DrawerContentComponent < ViewComponent::Base
+  include UI::DrawerContentBehavior
 
-      # @param open [Boolean] whether the drawer is open
-      # @param direction [String] drawer position: "bottom", "top", "left", "right"
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(open: false, direction: "bottom", classes: "", attributes: {})
-        @open = open
-        @direction = direction
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param open [Boolean] whether the drawer is open
+  # @param direction [String] drawer position: "bottom", "top", "left", "right"
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(open: false, direction: "bottom", classes: "", attributes: {})
+    @open = open
+    @direction = direction
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        attrs = drawer_content_html_attributes
-        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+  def call
+    attrs = drawer_content_html_attributes
+    attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
 
-        content_tag :div, class: "group/drawer-content", **attrs.merge(@attributes.except(:data)) do
-          content
-        end
-      end
+    content_tag :div, class: "group/drawer-content", **attrs.merge(@attributes.except(:data)) do
+      content
     end
+  end
+end

data/app/view_components/ui/drawer_description_component.rb

@@ -1,21 +1,21 @@
 # frozen_string_literal: true
 
-    # Drawer description component (ViewComponent)
-    # ARIA-compliant description for drawer
-    #
-    # @example
-    #   <%= render UI::DescriptionComponent.new { "Drawer description text" } %>
-    class UI::DrawerDescriptionComponent < ViewComponent::Base
-      include UI::DrawerDescriptionBehavior
+# Drawer description component (ViewComponent)
+# ARIA-compliant description for drawer
+#
+# @example
+#   <%= render UI::DescriptionComponent.new { "Drawer description text" } %>
+class UI::DrawerDescriptionComponent < ViewComponent::Base
+  include UI::DrawerDescriptionBehavior
 
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(classes: "", attributes: {})
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(classes: "", attributes: {})
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :p, content, **drawer_description_html_attributes.merge(@attributes)
-      end
-    end
+  def call
+    content_tag :p, content, **drawer_description_html_attributes.merge(@attributes)
+  end
+end

data/app/view_components/ui/drawer_footer_component.rb

@@ -1,24 +1,24 @@
 # frozen_string_literal: true
 
-    # Drawer footer component (ViewComponent)
-    # Action area for drawer (buttons, etc.)
-    #
-    # @example
-    #   <%= render UI::FooterComponent.new do %>
-    #     <%= render UI::ButtonComponent.new { "Submit" } %>
-    #     <%= render UI::CloseComponent.new { "Cancel" } %>
-    #   <% end %>
-    class UI::DrawerFooterComponent < ViewComponent::Base
-      include UI::DrawerFooterBehavior
+# Drawer footer component (ViewComponent)
+# Action area for drawer (buttons, etc.)
+#
+# @example
+#   <%= render UI::FooterComponent.new do %>
+#     <%= render UI::ButtonComponent.new { "Submit" } %>
+#     <%= render UI::CloseComponent.new { "Cancel" } %>
+#   <% end %>
+class UI::DrawerFooterComponent < ViewComponent::Base
+  include UI::DrawerFooterBehavior
 
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(classes: "", attributes: {})
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(classes: "", attributes: {})
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, content, **drawer_footer_html_attributes.merge(@attributes)
-      end
-    end
+  def call
+    content_tag :div, content, **drawer_footer_html_attributes.merge(@attributes)
+  end
+end

data/app/view_components/ui/drawer_handle_component.rb

@@ -1,24 +1,24 @@
 # frozen_string_literal: true
 
-    # Drawer handle component (ViewComponent)
-    # Visual affordance for drag gesture (shown on bottom/top drawers only)
-    #
-    # @example
-    #   <%= render UI::HandleComponent.new %>
-    class UI::DrawerHandleComponent < ViewComponent::Base
-      include UI::DrawerHandleBehavior
+# Drawer handle component (ViewComponent)
+# Visual affordance for drag gesture (shown on bottom/top drawers only)
+#
+# @example
+#   <%= render UI::HandleComponent.new %>
+class UI::DrawerHandleComponent < ViewComponent::Base
+  include UI::DrawerHandleBehavior
 
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(classes: "", attributes: {})
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(classes: "", attributes: {})
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        attrs = drawer_handle_html_attributes
-        attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
+  def call
+    attrs = drawer_handle_html_attributes
+    attrs[:data] = attrs[:data].merge(@attributes.fetch(:data, {}))
 
-        content_tag :div, "", **attrs.merge(@attributes.except(:data))
-      end
-    end
+    content_tag :div, "", **attrs.merge(@attributes.except(:data))
+  end
+end

data/app/view_components/ui/drawer_header_component.rb

@@ -1,24 +1,24 @@
 # frozen_string_literal: true
 
-    # Drawer header component (ViewComponent)
-    # Header section for drawer
-    #
-    # @example
-    #   <%= render UI::HeaderComponent.new do %>
-    #     <%= render UI::TitleComponent.new { "Title" } %>
-    #     <%= render UI::DescriptionComponent.new { "Description" } %>
-    #   <% end %>
-    class UI::DrawerHeaderComponent < ViewComponent::Base
-      include UI::DrawerHeaderBehavior
+# Drawer header component (ViewComponent)
+# Header section for drawer
+#
+# @example
+#   <%= render UI::HeaderComponent.new do %>
+#     <%= render UI::TitleComponent.new { "Title" } %>
+#     <%= render UI::DescriptionComponent.new { "Description" } %>
+#   <% end %>
+class UI::DrawerHeaderComponent < ViewComponent::Base
+  include UI::DrawerHeaderBehavior
 
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(classes: "", attributes: {})
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(classes: "", attributes: {})
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        content_tag :div, content, **drawer_header_html_attributes.merge(@attributes)
-      end
-    end
+  def call
+    content_tag :div, content, **drawer_header_html_attributes.merge(@attributes)
+  end
+end

data/app/view_components/ui/drawer_overlay_component.rb

@@ -1,28 +1,28 @@
 # frozen_string_literal: true
 
-    # Drawer overlay component (ViewComponent)
-    # Backdrop with fade animation
-    #
-    # @example
-    #   <%= render UI::OverlayComponent.new(open: false) %>
-    class UI::DrawerOverlayComponent < ViewComponent::Base
-      include UI::DrawerOverlayBehavior
+# Drawer overlay component (ViewComponent)
+# Backdrop with fade animation
+#
+# @example
+#   <%= render UI::OverlayComponent.new(open: false) %>
+class UI::DrawerOverlayComponent < ViewComponent::Base
+  include UI::DrawerOverlayBehavior
 
-      # @param open [Boolean] whether the drawer is open
-      # @param classes [String] additional CSS classes
-      # @param attributes [Hash] additional HTML attributes
-      def initialize(open: false, classes: "", attributes: {})
-        @open = open
-        @classes = classes
-        @attributes = attributes
-      end
+  # @param open [Boolean] whether the drawer is open
+  # @param classes [String] additional CSS classes
+  # @param attributes [Hash] additional HTML attributes
+  def initialize(open: false, classes: "", attributes: {})
+    @open = open
+    @classes = classes
+    @attributes = attributes
+  end
 
-      def call
-        container_attrs = drawer_overlay_container_html_attributes
-        container_attrs[:data] = container_attrs[:data].merge(@attributes.fetch(:data, {}))
+  def call
+    container_attrs = drawer_overlay_container_html_attributes
+    container_attrs[:data] = container_attrs[:data].merge(@attributes.fetch(:data, {}))
 
-        content_tag :div, **container_attrs.merge(@attributes.except(:data)) do
-          content_tag :div, "", **drawer_overlay_html_attributes
-        end
-      end
+    content_tag :div, **container_attrs.merge(@attributes.except(:data)) do
+      content_tag :div, "", **drawer_overlay_html_attributes
     end
+  end
+end