Class: BetterUi::Breadcrumb::BreadcrumbComponent

Inherits:
ApplicationComponent show all
Defined in:
app/components/better_ui/breadcrumb/breadcrumb_component.rb

Overview

A breadcrumb navigation component that renders an ordered list of items with configurable separators and sizes.

This is a compound component that uses ItemComponent for individual breadcrumb items. The last item (without href) is typically rendered as the current page indicator.

Examples:

Basic breadcrumb

<%= render BetterUi::Breadcrumb::BreadcrumbComponent.new do |breadcrumb| %>
  <% breadcrumb.with_item(label: "Home", href: "/") %>
  <% breadcrumb.with_item(label: "Products", href: "/products") %>
  <% breadcrumb.with_item(label: "Widget") %>
<% end %>

With chevron separator and large size

<%= render BetterUi::Breadcrumb::BreadcrumbComponent.new(separator: :chevron, size: :lg) do |breadcrumb| %>
  <% breadcrumb.with_item(label: "Home", href: "/") %>
  <% breadcrumb.with_item(label: "Settings") %>
<% end %>

Constant Summary collapse

SEPARATORS =

Allowed separator types

i[slash chevron dot].freeze
SIZES =

Allowed size options

i[sm md lg].freeze

Constants inherited from ApplicationComponent

ApplicationComponent::SHADOWS, ApplicationComponent::VARIANTS, ApplicationComponent::VARIANT_BODY_DIVIDE, ApplicationComponent::VARIANT_DIVIDE, ApplicationComponent::VARIANT_HEADER_BG, ApplicationComponent::VARIANT_HEADER_TEXT, ApplicationComponent::VARIANT_HIGHLIGHTED, ApplicationComponent::VARIANT_HOVERABLE, ApplicationComponent::VARIANT_RING, ApplicationComponent::VARIANT_SORT_ICON, ApplicationComponent::VARIANT_STRIPED

Instance Method Summary collapse

Constructor Details

#initialize(separator: :slash, size: :md, container_classes: nil, **options) ⇒ BreadcrumbComponent

Initializes a new breadcrumb component.

Parameters:

  • separator (Symbol) (defaults to: :slash) —

    the separator type (:slash, :chevron, :dot), defaults to :slash

  • size (Symbol) (defaults to: :md) —

    the text size (:sm, :md, :lg), defaults to :md

  • container_classes (String, nil) (defaults to: nil) —

    additional CSS classes for the nav element

  • options (Hash) —

    additional HTML attributes passed to the nav element

Raises:

  • (ArgumentError) —

    if separator is not one of the allowed values

  • (ArgumentError) —

    if size is not one of the allowed values



47
48
49
50
51
52
53
54
55
56
57
 
# File 'app/components/better_ui/breadcrumb/breadcrumb_component.rb', line 47

def initialize(
  separator: :slash,
  size: :md,
  container_classes: nil,
  **options
)
  @separator = validate_separator(separator)
  @size = validate_size(size)
  @container_classes = container_classes
  @options = options
end

Instance Method Details

#with_item {|item| ... } ⇒ Object

Slot for rendering breadcrumb items.

Parameters:

  • label (String) —

    the item label text

  • href (String, nil) —

    the item link URL

Yield Parameters:

Yield Returns:

  • (String) —

    the HTML content for the item



30
 
# File 'app/components/better_ui/breadcrumb/breadcrumb_component.rb', line 30

renders_many :items, BetterUi::Breadcrumb::ItemComponent