Class: UI::NavigationMenuComponent

Inherits:
ViewComponent::Base
  • Object
show all
Includes:
NavigationMenuBehavior
Defined in:
app/view_components/ui/navigation_menu_component.rb

Overview

NavigationMenuComponent - ViewComponent implementation

A collection of links for navigating websites. Built on Radix UI patterns.

Examples:

Basic usage

<%= render UI::NavigationMenuComponent.new do %>
  <%= render UI::ListComponent.new do %>
    <%= render UI::ItemComponent.new do %>
      <%= render UI::TriggerComponent.new do %>Getting Started<% end %>
      <%= render UI::ContentComponent.new do %>
        <%= render UI::LinkComponent.new(href: "/docs") do %>Introduction<% end %>
      <% end %>
    <% end %>
  <% end %>
<% end %>

Instance Method Summary collapse

Methods included from NavigationMenuBehavior

#navigation_menu_classes, #navigation_menu_data_attributes, #navigation_menu_html_attributes

Constructor Details

#initialize(viewport: true, delay_duration: 200, skip_delay_duration: 300, classes: "", **attributes) ⇒ NavigationMenuComponent

Returns a new instance of NavigationMenuComponent.

Parameters:

  • viewport (Boolean) (defaults to: true)

    Whether to use viewport for content positioning

  • delay_duration (Integer) (defaults to: 200)

    Delay in ms before opening on hover

  • skip_delay_duration (Integer) (defaults to: 300)

    Delay skip period between items

  • classes (String) (defaults to: "")

    Additional CSS classes to merge

  • attributes (Hash)

    Additional HTML attributes



26
27
28
29
30
31
32
# File 'app/view_components/ui/navigation_menu_component.rb', line 26

def initialize(viewport: true, delay_duration: 200, skip_delay_duration: 300, classes: "", **attributes)
  @viewport = viewport
  @delay_duration = delay_duration
  @skip_delay_duration = skip_delay_duration
  @classes = classes
  @attributes = attributes
end

Instance Method Details

#callObject



34
35
36
37
38
39
40
41
# File 'app/view_components/ui/navigation_menu_component.rb', line 34

def call
   :nav, **navigation_menu_html_attributes.deep_merge(@attributes) do
    safe_join([
      content,
      (@viewport ? render(UI::ViewportComponent.new) : nil)
    ].compact)
  end
end