Class: UI::SelectComponent

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

Overview

SelectComponent - ViewComponent implementation

A custom select component with keyboard navigation, scrollable viewport, and form integration. Root container that wraps trigger, content, and items.

Examples:

Basic usage

<%= render UI::SelectComponent.new(value: "apple") do %>
  <%= render UI::TriggerComponent.new(placeholder: "Select a fruit...") %>
  <%= render UI::ContentComponent.new do %>
    <%= render UI::ItemComponent.new(value: "apple") { "Apple" } %>
    <%= render UI::ItemComponent.new(value: "banana") { "Banana" } %>
  <% end %>
<% end %>

Instance Method Summary collapse

Methods included from SelectBehavior

#select_classes, #select_html_attributes

Constructor Details

#initialize(value: nil, classes: "", as_child: false, **attributes) ⇒ SelectComponent

Returns a new instance of SelectComponent.

Parameters:

  • value (String) (defaults to: nil)

    Currently selected value

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

    Additional CSS classes to merge

  • as_child (Boolean) (defaults to: false)

    If true, renders without wrapper div but preserves controller on inner element

  • attributes (Hash)

    Additional HTML attributes



23
24
25
26
27
28
# File 'app/view_components/ui/select_component.rb', line 23

def initialize(value: nil, classes: "", as_child: false, **attributes)
  @value = value
  @classes = classes
  @as_child = as_child
  @attributes = attributes
end

Instance Method Details

#callObject



30
31
32
33
34
35
36
37
38
39
40
41
# File 'app/view_components/ui/select_component.rb', line 30

def call
  attrs = select_html_attributes.deep_merge(@attributes)
  if @as_child
    # When as_child, we still need a wrapper for the Stimulus controller
    # but we use a minimal inline wrapper that doesn't break flex layouts
    # Override class to use 'contents' which makes the element invisible to layout
    attrs[:class] = "contents"
     :span, content, **attrs
  else
     :div, content, **attrs
  end
end