Class: DropdownComponent

Inherits:
Component show all
Defined in:
app/components/dropdown_component.rb

Overview

Dropdown — selection dropdowns with search and multi-select.

Usage:

Dropdown(selection: true, placeholder: "Select...", name: "country") {
  MenuItem { text "United States" }
  MenuItem { text "Canada" }
}

Constant Summary

Constants inherited from Component

Component::HTML_OPTIONS

Instance Method Summary collapse

Methods inherited from Component

default, #initialize, #render_in, slot

Constructor Details

This class inherits a constructor from Component

Instance Method Details

#to_s ⇒ Object 



31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
# File 'app/components/dropdown_component.rb', line 31

def to_s
  classes = class_names(
    "ui",
    pointing && "#{pointing} pointing",
    { "selection" => selection, "search" => search, "multiple" => multiple,
      "clearable" => clearable, "fluid" => fluid, "compact" => compact,
      "scrolling" => scrolling, "inline" => inline, "floating" => floating,
      "button" => button, "labeled" => labeled, "loading" => loading,
      "disabled" => disabled },
    "dropdown"
  )

  data = { controller: "fui-dropdown" }
  data[:fui_dropdown_clearable_value] = "true" if clearable
  data[:fui_dropdown_placeholder_value] = placeholder if placeholder && !inline
  data[:fui_dropdown_action_value] = action if action

  hidden_opts = { type: "hidden", value: default_value || "" }
  hidden_opts[:name] = name if name

  search_el = search ? tag.input(class: "search") : nil
  text_el = if inline
    tag.div(class: "text") { tag.h2(class: "ui header") { placeholder || "" } }
  else
    tag.div(class: "text") { placeholder || "" }
  end
  menu_el = tag.div(class: "menu") { @content }

  tag.div(class: classes, data: data) {
    safe_join([
      tag.input(**hidden_opts),
      search_el,
      text_el,
      tag.i(class: "dropdown icon"),
      menu_el
    ])
  }
end