fernandes-ui 0.1.1 → 0.1.4

data/app/behaviors/ui/badge_behavior.rb

@@ -1,50 +1,57 @@
 # frozen_string_literal: true
 
-    # BadgeBehavior
-    #
-    # Shared behavior for Badge component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent variant styling and HTML attribute generation.
-    #
-    # Based on shadcn/ui Badge: https://ui.shadcn.com/docs/components/badge
-    module UI::BadgeBehavior
-      # Returns HTML attributes for the badge element
-      def badge_html_attributes
-        {
-          class: badge_classes,
-          data: { slot: "badge" }
-        }
-      end
+# UI::BadgeBehavior
+#
+# @ui_component Badge
+# @ui_description Badge - Phlex implementation
+# @ui_category data-display
+#
+# @ui_anatomy Badge - Displays a badge or a component that looks like a badge. (required)
+#
+# @ui_feature Custom styling with Tailwind classes
+# @ui_feature ARIA attributes for accessibility
+#
+# @ui_related avatar
+#
+module UI::BadgeBehavior
+  # Returns HTML attributes for the badge element
+  def badge_html_attributes
+    {
+      class: badge_classes,
+      data: {slot: "badge"}
+    }
+  end
 
-      # Returns combined CSS classes for the badge
-      def badge_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          badge_base_classes,
-          badge_variant_classes,
-          classes_value
-        ].compact.join(" "))
-      end
+  # Returns combined CSS classes for the badge
+  def badge_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      badge_base_classes,
+      badge_variant_classes,
+      classes_value
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to all badges
-      # Matches shadcn/ui v4 exactly
-      def badge_base_classes
-        "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden"
-      end
+  # Base classes applied to all badges
+  # Matches shadcn/ui v4 exactly
+  def badge_base_classes
+    "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden"
+  end
 
-      # Variant-specific classes based on @variant
-      # Matches shadcn/ui v4 variants exactly
-      def badge_variant_classes
-        case @variant.to_s
-        when "secondary"
-          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90"
-        when "destructive"
-          "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
-        when "outline"
-          "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
-        else # default
-          "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90"
-        end
-      end
+  # Variant-specific classes based on @variant
+  # Matches shadcn/ui v4 variants exactly
+  def badge_variant_classes
+    case @variant.to_s
+    when "secondary"
+      "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90"
+    when "destructive"
+      "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
+    when "outline"
+      "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground"
+    else # default
+      "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90"
     end
+  end
+end

data/app/behaviors/ui/blockquote_behavior.rb

@@ -2,22 +2,30 @@
 
 require "tailwind_merge"
 
-    # Shared behavior for Blockquote component
-    module UI::BlockquoteBehavior
-      # Base CSS classes for Blockquote
-      def blockquote_base_classes
-        "mt-6 border-l-2 pl-6 italic"
-      end
+# UI::BlockquoteBehavior
+#
+# @ui_component Blockquote
+# @ui_category typography
+#
+# @ui_anatomy Blockquote - Blockquote component part (required)
+#
+# @ui_feature Custom styling with Tailwind classes
+#
+module UI::BlockquoteBehavior
+  # Base CSS classes for Blockquote
+  def blockquote_base_classes
+    "mt-6 border-l-2 pl-6 italic"
+  end
 
-      # Merge base classes with custom classes using TailwindMerge
-      def blockquote_classes
-        TailwindMerge::Merger.new.merge([blockquote_base_classes, @classes].compact.join(" "))
-      end
+  # Merge base classes with custom classes using TailwindMerge
+  def blockquote_classes
+    TailwindMerge::Merger.new.merge([blockquote_base_classes, @classes].compact.join(" "))
+  end
 
-      # Build complete HTML attributes hash
-      def blockquote_html_attributes
-        {
-          class: blockquote_classes
-        }
-      end
-    end
+  # Build complete HTML attributes hash
+  def blockquote_html_attributes
+    {
+      class: blockquote_classes
+    }
+  end
+end

data/app/behaviors/ui/breadcrumb_behavior.rb

@@ -1,22 +1,38 @@
 # frozen_string_literal: true
 
-    # BreadcrumbBehavior
-    #
-    # Shared behavior for Breadcrumb component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for the breadcrumb container.
-    module UI::BreadcrumbBehavior
-      # Returns HTML attributes for the breadcrumb container element
-      def breadcrumb_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_classes,
-          "aria-label": "breadcrumb"
-        }.merge(attributes_value || {})
-      end
+# UI::BreadcrumbBehavior
+#
+# @ui_component Breadcrumb
+# @ui_description Breadcrumb - Phlex implementation
+# @ui_category navigation
+#
+# @ui_anatomy Breadcrumb - A navigation breadcrumb component for displaying hierarchical navigation. (required)
+# @ui_anatomy Ellipsis - Indicator for collapsed/hidden breadcrumb items.
+# @ui_anatomy Item - Individual breadcrumb entry within the breadcrumb list.
+# @ui_anatomy Link - Clickable breadcrumb link for navigation.
+# @ui_anatomy List - Container for breadcrumb items, rendered as an ordered list.
+# @ui_anatomy Page - Current page indicator (non-clickable) for breadcrumbs.
+# @ui_anatomy Separator - Visual divider between breadcrumb items with default chevron icon.
+#
+# @ui_feature ARIA attributes for accessibility
+#
+# @ui_aria_pattern Breadcrumb
+# @ui_aria_reference https://www.w3.org/WAI/ARIA/apg/patterns/breadcrumb/
+# @ui_aria_attr aria-label
+#
+module UI::BreadcrumbBehavior
+  # Returns HTML attributes for the breadcrumb container element
+  def breadcrumb_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_classes,
+      "aria-label": "breadcrumb"
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb container
-      def breadcrumb_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        classes_value || ""
-      end
-    end
+  # Returns combined CSS classes for the breadcrumb container
+  def breadcrumb_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    classes_value || ""
+  end
+end

data/app/behaviors/ui/breadcrumb_ellipsis_behavior.rb

@@ -1,34 +1,34 @@
 # frozen_string_literal: true
 
-    # BreadcrumbEllipsisBehavior
-    #
-    # Shared behavior for Breadcrumb Ellipsis component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for collapsed items indicator.
-    module UI::BreadcrumbEllipsisBehavior
-      # Returns HTML attributes for the breadcrumb ellipsis element
-      def breadcrumb_ellipsis_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_ellipsis_classes,
-          role: "presentation",
-          "aria-hidden": "true"
-        }.merge(attributes_value || {})
-      end
+# BreadcrumbEllipsisBehavior
+#
+# Shared behavior for Breadcrumb Ellipsis component across ERB, ViewComponent, and Phlex implementations.
+# This module provides consistent HTML attribute generation for collapsed items indicator.
+module UI::BreadcrumbEllipsisBehavior
+  # Returns HTML attributes for the breadcrumb ellipsis element
+  def breadcrumb_ellipsis_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_ellipsis_classes,
+      role: "presentation",
+      "aria-hidden": "true"
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb ellipsis
-      def breadcrumb_ellipsis_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          breadcrumb_ellipsis_base_classes,
-          classes_value
+  # Returns combined CSS classes for the breadcrumb ellipsis
+  def breadcrumb_ellipsis_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      breadcrumb_ellipsis_base_classes,
+      classes_value
 
-        ].compact.join(" "))
-      end
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to breadcrumb ellipsis
-      def breadcrumb_ellipsis_base_classes
-        "flex h-9 w-9 items-center justify-center"
-      end
-    end
+  # Base classes applied to breadcrumb ellipsis
+  def breadcrumb_ellipsis_base_classes
+    "flex h-9 w-9 items-center justify-center"
+  end
+end

data/app/behaviors/ui/breadcrumb_item_behavior.rb

@@ -1,32 +1,32 @@
 # frozen_string_literal: true
 
-    # BreadcrumbItemBehavior
-    #
-    # Shared behavior for Breadcrumb Item component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for individual breadcrumb items.
-    module UI::BreadcrumbItemBehavior
-      # Returns HTML attributes for the breadcrumb item element
-      def breadcrumb_item_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_item_classes
-        }.merge(attributes_value || {})
-      end
+# BreadcrumbItemBehavior
+#
+# Shared behavior for Breadcrumb Item component across ERB, ViewComponent, and Phlex implementations.
+# This module provides consistent HTML attribute generation for individual breadcrumb items.
+module UI::BreadcrumbItemBehavior
+  # Returns HTML attributes for the breadcrumb item element
+  def breadcrumb_item_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_item_classes
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb item
-      def breadcrumb_item_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          breadcrumb_item_base_classes,
-          classes_value
+  # Returns combined CSS classes for the breadcrumb item
+  def breadcrumb_item_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      breadcrumb_item_base_classes,
+      classes_value
 
-        ].compact.join(" "))
-      end
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to breadcrumb item
-      def breadcrumb_item_base_classes
-        "inline-flex items-center gap-1.5"
-      end
-    end
+  # Base classes applied to breadcrumb item
+  def breadcrumb_item_base_classes
+    "inline-flex items-center gap-1.5"
+  end
+end

data/app/behaviors/ui/breadcrumb_link_behavior.rb

@@ -1,33 +1,33 @@
 # frozen_string_literal: true
 
-    # BreadcrumbLinkBehavior
-    #
-    # Shared behavior for Breadcrumb Link component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for breadcrumb links.
-    module UI::BreadcrumbLinkBehavior
-      # Returns HTML attributes for the breadcrumb link element
-      def breadcrumb_link_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_link_classes,
-          href: @href || "#"
-        }.merge(attributes_value || {})
-      end
+# BreadcrumbLinkBehavior
+#
+# Shared behavior for Breadcrumb Link component across ERB, ViewComponent, and Phlex implementations.
+# This module provides consistent HTML attribute generation for breadcrumb links.
+module UI::BreadcrumbLinkBehavior
+  # Returns HTML attributes for the breadcrumb link element
+  def breadcrumb_link_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_link_classes,
+      href: @href || "#"
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb link
-      def breadcrumb_link_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          breadcrumb_link_base_classes,
-          classes_value
+  # Returns combined CSS classes for the breadcrumb link
+  def breadcrumb_link_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      breadcrumb_link_base_classes,
+      classes_value
 
-        ].compact.join(" "))
-      end
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to breadcrumb link
-      def breadcrumb_link_base_classes
-        "transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded-sm"
-      end
-    end
+  # Base classes applied to breadcrumb link
+  def breadcrumb_link_base_classes
+    "transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded-sm"
+  end
+end

data/app/behaviors/ui/breadcrumb_list_behavior.rb

@@ -1,32 +1,32 @@
 # frozen_string_literal: true
 
-    # BreadcrumbListBehavior
-    #
-    # Shared behavior for Breadcrumb List component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for the breadcrumb list container.
-    module UI::BreadcrumbListBehavior
-      # Returns HTML attributes for the breadcrumb list element
-      def breadcrumb_list_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_list_classes
-        }.merge(attributes_value || {})
-      end
+# BreadcrumbListBehavior
+#
+# Shared behavior for Breadcrumb List component across ERB, ViewComponent, and Phlex implementations.
+# This module provides consistent HTML attribute generation for the breadcrumb list container.
+module UI::BreadcrumbListBehavior
+  # Returns HTML attributes for the breadcrumb list element
+  def breadcrumb_list_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_list_classes
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb list
-      def breadcrumb_list_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          breadcrumb_list_base_classes,
-          classes_value
+  # Returns combined CSS classes for the breadcrumb list
+  def breadcrumb_list_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      breadcrumb_list_base_classes,
+      classes_value
 
-        ].compact.join(" "))
-      end
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to breadcrumb list
-      def breadcrumb_list_base_classes
-        "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5"
-      end
-    end
+  # Base classes applied to breadcrumb list
+  def breadcrumb_list_base_classes
+    "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5"
+  end
+end

data/app/behaviors/ui/breadcrumb_page_behavior.rb

@@ -1,35 +1,35 @@
 # frozen_string_literal: true
 
-    # BreadcrumbPageBehavior
-    #
-    # Shared behavior for Breadcrumb Page component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for the current page indicator.
-    module UI::BreadcrumbPageBehavior
-      # Returns HTML attributes for the breadcrumb page element
-      def breadcrumb_page_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_page_classes,
-          role: "link",
-          "aria-disabled": "true",
-          "aria-current": "page"
-        }.merge(attributes_value || {})
-      end
+# BreadcrumbPageBehavior
+#
+# Shared behavior for Breadcrumb Page component across ERB, ViewComponent, and Phlex implementations.
+# This module provides consistent HTML attribute generation for the current page indicator.
+module UI::BreadcrumbPageBehavior
+  # Returns HTML attributes for the breadcrumb page element
+  def breadcrumb_page_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_page_classes,
+      role: "link",
+      "aria-disabled": "true",
+      "aria-current": "page"
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb page
-      def breadcrumb_page_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          breadcrumb_page_base_classes,
-          classes_value
+  # Returns combined CSS classes for the breadcrumb page
+  def breadcrumb_page_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      breadcrumb_page_base_classes,
+      classes_value
 
-        ].compact.join(" "))
-      end
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to breadcrumb page
-      def breadcrumb_page_base_classes
-        "font-normal text-foreground"
-      end
-    end
+  # Base classes applied to breadcrumb page
+  def breadcrumb_page_base_classes
+    "font-normal text-foreground"
+  end
+end

data/app/behaviors/ui/breadcrumb_separator_behavior.rb

@@ -1,34 +1,34 @@
 # frozen_string_literal: true
 
-    # BreadcrumbSeparatorBehavior
-    #
-    # Shared behavior for Breadcrumb Separator component across ERB, ViewComponent, and Phlex implementations.
-    # This module provides consistent HTML attribute generation for breadcrumb separators.
-    module UI::BreadcrumbSeparatorBehavior
-      # Returns HTML attributes for the breadcrumb separator element
-      def breadcrumb_separator_html_attributes
-        attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
-        {
-          class: breadcrumb_separator_classes,
-          role: "presentation",
-          "aria-hidden": "true"
-        }.merge(attributes_value || {})
-      end
+# BreadcrumbSeparatorBehavior
+#
+# Shared behavior for Breadcrumb Separator component across ERB, ViewComponent, and Phlex implementations.
+# This module provides consistent HTML attribute generation for breadcrumb separators.
+module UI::BreadcrumbSeparatorBehavior
+  # Returns HTML attributes for the breadcrumb separator element
+  def breadcrumb_separator_html_attributes
+    attributes_value = respond_to?(:attributes, true) ? attributes : @attributes
+    {
+      class: breadcrumb_separator_classes,
+      role: "presentation",
+      "aria-hidden": "true"
+    }.merge(attributes_value || {})
+  end
 
-      # Returns combined CSS classes for the breadcrumb separator
-      def breadcrumb_separator_classes
-        classes_value = respond_to?(:classes, true) ? classes : @classes
-        TailwindMerge::Merger.new.merge([
-          breadcrumb_separator_base_classes,
-          classes_value
+  # Returns combined CSS classes for the breadcrumb separator
+  def breadcrumb_separator_classes
+    classes_value = respond_to?(:classes, true) ? classes : @classes
+    TailwindMerge::Merger.new.merge([
+      breadcrumb_separator_base_classes,
+      classes_value
 
-        ].compact.join(" "))
-      end
+    ].compact.join(" "))
+  end
 
-      private
+  private
 
-      # Base classes applied to breadcrumb separator
-      def breadcrumb_separator_base_classes
-        "[&>svg]:size-3.5"
-      end
-    end
+  # Base classes applied to breadcrumb separator
+  def breadcrumb_separator_base_classes
+    "[&>svg]:size-3.5"
+  end
+end