Class: NitroKit::Dropdown

Inherits:
Component
  • Object
show all
Includes:
Phlex::Rails::Helpers::LinkTo
Defined in:
app/components/nitro_kit/dropdown.rb

Constant Summary collapse

CONTENT = 
[
  "w-max-content absolute top-0 left-0",
  "p-1 bg-background rounded-md border shadow-sm",
  "w-fit max-w-sm flex-col text-left",
  "[&[aria-hidden=true]]:hidden flex"
].freeze
TRIGGER = 
"inline-block"
TITLE = 
"px-3 pt-2 pb-1.5 text-muted-foreground text-sm"
ITEM = 
[
  "px-3 py-1.5 rounded",
  "font-medium truncate",
  "cursor-default"
].freeze
ITEM_VARIANTS = 
{
  default: ["hover:bg-muted"],
  destructive: ["text-destructive-foreground hover:bg-destructive hover:text-white"]
}.freeze
SEPARATOR = 
"border-t my-1 -mx-1"

Instance Attribute Summary collapse

Attributes inherited from Component

#attrs

Instance Method Summary collapse

Methods inherited from Component

#data_merge, merge, #merge

Constructor Details

#initialize(placement: nil, **attrs) ⇒ Dropdown

Returns a new instance of Dropdown.



29
30
31
32
 
# File 'app/components/nitro_kit/dropdown.rb', line 29

def initialize(placement: nil, **attrs)
  @placement = placement
  @attrs = attrs
end

Instance Attribute Details

#placement ⇒ Object (readonly)

Returns the value of attribute placement.



34
35
36
 
# File 'app/components/nitro_kit/dropdown.rb', line 34

def placement
  @placement
end

Instance Method Details

#content(**attrs, &block) ⇒ Object 



59
60
61
62
63
64
65
66
67
68
69
70
71
72
 
# File 'app/components/nitro_kit/dropdown.rb', line 59

def content(**attrs, &block)

  class_list = div(
    role: "menu",
    aria: {hidden: "true"},
    **attrs,
    class: merge([CONTENT, attrs[:class]]),
    data: data_merge(
      {:"nk--dropdown-target" => "content"},
      attrs[:data]
    ),
    &block
  )
end

#destructive_item(*args, **attrs, &block) ⇒ Object 



103
104
105
 
# File 'app/components/nitro_kit/dropdown.rb', line 103

def destructive_item(*args, **attrs, &block)
  item(*args, **attrs, variant: :destructive, &block)
end

#item(text = nil, href = nil, variant: :default, **attrs) ⇒ Object 



79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
# File 'app/components/nitro_kit/dropdown.rb', line 79

def item(
  text = nil,
  href = nil,
  variant: :default,
  **attrs
)
  common_attrs = {
    role: "menuitem",
    tabindex: "-1",
    **attrs,
    class: merge([ITEM, ITEM_VARIANTS[variant], attrs[:class]])
  }

  if href
    link_to(href, **common_attrs) do
      text || yield
    end
  else
    div(**common_attrs) do
      text || yield
    end
  end
end

#separator ⇒ Object 



107
108
109
 
# File 'app/components/nitro_kit/dropdown.rb', line 107

def separator
  div(class: SEPARATOR)
end

#title(text = nil, **attrs, &block) ⇒ Object 



74
75
76
77
 
# File 'app/components/nitro_kit/dropdown.rb', line 74

def title(text = nil, **attrs, &block)
  class_list = merge([TITLE, attrs[:class]])
  div(**attrs, class: class_list) { text || block.call }
end

#trigger(**attrs, &block) ⇒ Object 



46
47
48
49
50
51
52
53
54
55
56
57
 
# File 'app/components/nitro_kit/dropdown.rb', line 46

def trigger(**attrs, &block)
  div(
    aria: {haspopup: "true", expanded: "false"},
    **attrs,
    class: merge([TRIGGER, attrs[:class]]),
    data: data_merge(
      {:"nk--dropdown-target" => "trigger", :action => "click->nk--dropdown#toggle"},
      attrs[:data]
    ),
    &block
  )
end

#view_template(&block) ⇒ Object 



36
37
38
39
40
41
42
43
44
 
# File 'app/components/nitro_kit/dropdown.rb', line 36

def view_template(&block)
  div(
    data: data_merge(
      {:controller => "nk--dropdown", :"nk--dropdown-placement-value" => placement},
      attrs[:data]
    ),
    &block
  )
end