fernandes-ui 0.1.0

data/app/view_components/ui/dropdown_menu_trigger_component.rb

@@ -0,0 +1,52 @@
+# frozen_string_literal: true
+
+    # TriggerComponent - ViewComponent implementation
+    class UI::DropdownMenuTriggerComponent < ViewComponent::Base
+      include UI::DropdownMenuTriggerBehavior
+
+      def initialize(as_child: false, classes: "", **attributes)
+        @as_child = as_child
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        trigger_attrs = dropdown_menu_trigger_html_attributes.deep_merge(@attributes)
+
+        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? }
+
+          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
+
+            # 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
+
+            # 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 mode: render as div
+          content_tag :div, **trigger_attrs do
+            content
+          end
+        end
+      end
+    end

data/app/view_components/ui/empty_component.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+    # EmptyComponent - ViewComponent implementation
+    class UI::EmptyComponent < ViewComponent::Base
+      include UI::EmptyBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        tag.div(**empty_html_attributes.merge(@attributes)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/empty_content_component.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+    # EmptyContentComponent - ViewComponent implementation
+    class UI::EmptyContentComponent < ViewComponent::Base
+      include UI::EmptyContentBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        tag.div(**empty_content_html_attributes.merge(@attributes)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/empty_description_component.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+    # EmptyDescriptionComponent - ViewComponent implementation
+    class UI::EmptyDescriptionComponent < ViewComponent::Base
+      include UI::EmptyDescriptionBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        tag.p(**empty_description_html_attributes.merge(@attributes)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/empty_header_component.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+    # EmptyHeaderComponent - ViewComponent implementation
+    class UI::EmptyHeaderComponent < ViewComponent::Base
+      include UI::EmptyHeaderBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        tag.div(**empty_header_html_attributes.merge(@attributes)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/empty_media_component.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+    # EmptyMediaComponent - ViewComponent implementation
+    class UI::EmptyMediaComponent < ViewComponent::Base
+      include UI::EmptyMediaBehavior
+
+      def initialize(variant: "default", classes: "", **attributes)
+        @variant = variant
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        tag.div(**empty_media_html_attributes.merge(@attributes)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/empty_title_component.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+    # EmptyTitleComponent - ViewComponent implementation
+    class UI::EmptyTitleComponent < ViewComponent::Base
+      include UI::EmptyTitleBehavior
+
+      def initialize(classes: "", **attributes)
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        tag.h3(**empty_title_html_attributes.merge(@attributes)) do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_component.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+    # FieldComponent - ViewComponent implementation
+    #
+    # Core wrapper for a single form field with support for different orientations.
+    # Uses FieldBehavior concern for shared styling logic.
+    #
+    # @example Basic usage
+    #   <%= render UI::FieldComponent.new do %>
+    #     Field content here
+    #   <% end %>
+    #
+    # @example With orientation
+    #   <%= render UI::FieldComponent.new(orientation: "horizontal") do %>
+    #     Field content
+    #   <% end %>
+    #
+    # @example With validation state
+    #   <%= render UI::FieldComponent.new(data_invalid: true) do %>
+    #     Field content
+    #   <% end %>
+    class UI::FieldComponent < ViewComponent::Base
+      include UI::FieldBehavior
+
+      # @param orientation [String] Layout orientation: "vertical", "horizontal", or "responsive"
+      # @param data_invalid [Boolean] Whether field is in invalid state
+      # @param classes [String] Additional CSS classes to merge
+      # @param attributes [Hash] Additional HTML attributes
+      def initialize(orientation: "vertical", data_invalid: nil, classes: "", **attributes)
+        @orientation = orientation
+        @data_invalid = data_invalid
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag :div, **field_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_content_component.rb

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+    # FieldContentComponent - ViewComponent implementation
+    #
+    # Flex column that groups control and descriptions.
+    # Uses FieldContentBehavior concern for shared styling logic.
+    #
+    # @example Basic usage
+    #   <%= render UI::FieldContentComponent.new do %>
+    #     Content here
+    #   <% end %>
+    class UI::FieldContentComponent < ViewComponent::Base
+      include UI::FieldContentBehavior
+
+      # @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, **field_content_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_description_component.rb

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+    # FieldDescriptionComponent - ViewComponent implementation
+    #
+    # Helper text for form fields.
+    # Uses FieldDescriptionBehavior concern for shared styling logic.
+    #
+    # @example With block
+    #   <%= render UI::FieldDescriptionComponent.new do %>
+    #     Helper text
+    #   <% end %>
+    class UI::FieldDescriptionComponent < ViewComponent::Base
+      include UI::FieldDescriptionBehavior
+
+      # @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 :p, **field_description_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_error_component.rb

@@ -0,0 +1,63 @@
+# frozen_string_literal: true
+
+    # FieldErrorComponent - ViewComponent implementation
+    #
+    # Error message display for form fields with accessibility support.
+    # Uses FieldErrorBehavior concern for shared styling logic.
+    #
+    # @example With single error
+    #   <%= render UI::FieldErrorComponent.new(errors: ["Email is required"]) %>
+    #
+    # @example With multiple errors
+    #   <%= render UI::FieldErrorComponent.new(errors: ["Email is required", "Email is invalid"]) %>
+    #
+    # @example With block
+    #   <%= render UI::FieldErrorComponent.new do %>
+    #     Error message
+    #   <% end %>
+    class UI::FieldErrorComponent < ViewComponent::Base
+      include UI::FieldErrorBehavior
+
+      # @param errors [Array] Array of error messages
+      # @param classes [String] Additional CSS classes to merge
+      # @param attributes [Hash] Additional HTML attributes
+      def initialize(errors: nil, classes: "", **attributes)
+        @errors = errors
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        return unless has_errors? || content?
+
+        if has_errors?
+          render_errors
+        else
+          render_content
+        end
+      end
+
+      private
+
+      attr_reader :classes, :attributes
+
+      def render_errors
+        if single_error?
+          content_tag :p, **field_error_html_attributes do
+            error_message(@errors.first)
+          end
+        else
+          content_tag :ul, **field_error_html_attributes do
+            safe_join(@errors.map { |error|
+              content_tag :li, error_message(error)
+            })
+          end
+        end
+      end
+
+      def render_content
+        content_tag :p, **field_error_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_group_component.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+    # FieldGroupComponent - ViewComponent implementation
+    #
+    # Layout wrapper that stacks Field components.
+    # Uses FieldGroupBehavior concern for shared styling logic.
+    #
+    # @example Basic usage
+    #   <%= render UI::FieldGroupComponent.new do %>
+    #     <%= render UI::FieldComponent.new do %>
+    #       Field 1
+    #     <% end %>
+    #     <%= render UI::FieldComponent.new do %>
+    #       Field 2
+    #     <% end %>
+    #   <% end %>
+    class UI::FieldGroupComponent < ViewComponent::Base
+      include UI::FieldGroupBehavior
+
+      # @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, **field_group_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_label_component.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+    # FieldLabelComponent - ViewComponent implementation
+    #
+    # Label styled for form fields with disability states.
+    # Uses FieldLabelBehavior concern for shared styling logic.
+    #
+    # @example With block
+    #   <%= render UI::FieldLabelComponent.new(for_id: "email") do %>
+    #     Email Address
+    #   <% end %>
+    class UI::FieldLabelComponent < ViewComponent::Base
+      include UI::FieldLabelBehavior
+
+      # @param for_id [String] ID of the associated form control
+      # @param classes [String] Additional CSS classes to merge
+      # @param attributes [Hash] Additional HTML attributes
+      def initialize(for_id: nil, classes: "", **attributes)
+        @for_id = for_id
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag :label, **field_label_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_legend_component.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+    # FieldLegendComponent - ViewComponent implementation
+    #
+    # Legend element for FieldSet with variant support.
+    # Uses FieldLegendBehavior concern for shared styling logic.
+    #
+    # @example With block
+    #   <%= render UI::FieldLegendComponent.new do %>
+    #     Personal Information
+    #   <% end %>
+    #
+    # @example With variant
+    #   <%= render UI::FieldLegendComponent.new(variant: "label") do %>
+    #     Settings
+    #   <% end %>
+    class UI::FieldLegendComponent < ViewComponent::Base
+      include UI::FieldLegendBehavior
+
+      # @param variant [String] Style variant: "legend" or "label"
+      # @param classes [String] Additional CSS classes to merge
+      # @param attributes [Hash] Additional HTML attributes
+      def initialize(variant: "legend", classes: "", **attributes)
+        @variant = variant
+        @classes = classes
+        @attributes = attributes
+      end
+
+      def call
+        content_tag :legend, **field_legend_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_separator_component.rb

@@ -0,0 +1,53 @@
+# frozen_string_literal: true
+
+    # FieldSeparatorComponent - ViewComponent implementation
+    #
+    # Visual divider to separate sections inside FieldGroup.
+    # Uses FieldSeparatorBehavior concern for shared styling logic.
+    #
+    # @example Basic separator (line only)
+    #   <%= render UI::FieldSeparatorComponent.new %>
+    #
+    # @example With block
+    #   <%= render UI::FieldSeparatorComponent.new do %>
+    #     OR
+    #   <% end %>
+    class UI::FieldSeparatorComponent < ViewComponent::Base
+      include UI::FieldSeparatorBehavior
+
+      # @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, **field_separator_html_attributes do
+          if content?
+            render_with_label
+          else
+            render_line_only
+          end
+        end
+      end
+
+      private
+
+      attr_reader :classes, :attributes
+
+      def render_with_label
+        safe_join([
+          content_tag(:div, class: "border-border bg-background absolute inset-x-0 flex items-center") do
+            content_tag(:div, "", class: "border-border w-full border-t")
+          end,
+          content_tag(:span, class: "bg-background text-muted-foreground relative px-2") do
+            content
+          end
+        ])
+      end
+
+      def render_line_only
+        content_tag(:div, "", class: "border-border w-full border-t")
+      end
+    end

data/app/view_components/ui/field_set_component.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+    # FieldSetComponent - ViewComponent implementation
+    #
+    # Semantic fieldset container for grouped fields.
+    # Uses FieldSetBehavior concern for shared styling logic.
+    #
+    # @example Basic usage
+    #   <%= render UI::FieldSetComponent.new do %>
+    #     <%= render UI::FieldLegendComponent.new do %>
+    #       Contact Information
+    #     <% end %>
+    #     Field groups here
+    #   <% end %>
+    class UI::FieldSetComponent < ViewComponent::Base
+      include UI::FieldSetBehavior
+
+      # @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 :fieldset, **field_set_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/field_title_component.rb

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+    # FieldTitleComponent - ViewComponent implementation
+    #
+    # Title with label styling inside FieldContent.
+    # Uses FieldTitleBehavior concern for shared styling logic.
+    #
+    # @example With block
+    #   <%= render UI::FieldTitleComponent.new do %>
+    #     Section Title
+    #   <% end %>
+    class UI::FieldTitleComponent < ViewComponent::Base
+      include UI::FieldTitleBehavior
+
+      # @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, **field_title_html_attributes do
+          content
+        end
+      end
+    end

data/app/view_components/ui/h1_component.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+module UI
+  class H1Component < ViewComponent::Base
+    # @param classes [String] Additional CSS classes
+    def initialize(classes: nil, **attributes)
+      @classes = classes
+      @attributes = attributes
+    end
+
+    def call
+      extend UI::H1Behavior
+
+      attrs = h1_html_attributes
+
+      content_tag :h1, **attrs.merge(@attributes) do
+        content
+      end
+    end
+  end
+end

data/app/view_components/ui/h2_component.rb

@@ -0,0 +1,21 @@
+# frozen_string_literal: true
+
+module UI
+  class H2Component < ViewComponent::Base
+    # @param classes [String] Additional CSS classes
+    def initialize(classes: nil, **attributes)
+      @classes = classes
+      @attributes = attributes
+    end
+
+    def call
+      extend UI::H2Behavior
+
+      attrs = h2_html_attributes
+
+      content_tag :h2, **attrs.merge(@attributes) do
+        content
+      end
+    end
+  end
+end

data/app/view_components/ui/h3_component.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module UI
+  class H3Component < ViewComponent::Base
+    def initialize(classes: nil, **attributes)
+      @classes = classes
+      @attributes = attributes
+    end
+
+    def call
+      extend UI::H3Behavior
+      attrs = h3_html_attributes
+      content_tag :h3, **attrs.merge(@attributes) do
+        content
+      end
+    end
+  end
+end

data/app/view_components/ui/h4_component.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module UI
+  class H4Component < ViewComponent::Base
+    def initialize(classes: nil, **attributes)
+      @classes = classes
+      @attributes = attributes
+    end
+
+    def call
+      extend UI::H4Behavior
+      attrs = h4_html_attributes
+      content_tag :h4, **attrs.merge(@attributes) do
+        content
+      end
+    end
+  end
+end

data/app/view_components/ui/hover_card_component.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+    # HoverCardComponent - ViewComponent implementation
+    #
+    # Container for hover card trigger and content.
+    # Uses HoverCardBehavior for shared styling logic.
+    #
+    # @example Basic usage
+    #   <%= render UI::HoverCardComponent.new do %>
+    #     <%= render UI::TriggerComponent.new { "Hover me" } %>
+    #     <%= render UI::ContentComponent.new { "Content" } %>
+    #   <% end %>
+    class UI::HoverCardComponent < ViewComponent::Base
+      include UI::HoverCardBehavior
+
+      # @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
+        attrs = hover_card_html_attributes
+
+        content_tag :div, **attrs.merge(@attributes) do
+          content
+        end
+      end
+    end