Class: NitroKit::Tooltip

Inherits:
Component
  • Object
show all
Defined in:
app/components/nitro_kit/tooltip.rb

Defined Under Namespace

Classes: Trigger, TriggerAttributes

Constant Summary collapse

PLACEMENTS =
%i[top right bottom left].freeze
HTML_TRIGGERS =
%i[div span].freeze

Constants inherited from Component

Component::ADDITIVE_DATA_ATTRIBUTES, Component::COMPONENT_OWNED_DATA_ATTRIBUTES, Component::FORBIDDEN_ATTRIBUTES, Component::RESERVED_DATA_ATTRIBUTES

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(id:, content:, placement: :top, html: {}, aria: {}, data: {}, desperately_need_a_class: nil) ⇒ Tooltip

Returns a new instance of Tooltip.



30
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
# File 'app/components/nitro_kit/tooltip.rb', line 30

def initialize(
  id:,
  content:,
  placement: :top,
  html: {},
  aria: {},
  data: {},
  desperately_need_a_class: nil
)
  @identifier = component_id(id)
  @content = tooltip_content(content)
  @placement = validate_choice!(:placement, placement, PLACEMENTS)

  super(
    component: :tooltip,
    attributes: {
      id: @identifier,
      data: {
        controller: "nk--tooltip",
        placement: @placement,
        dismissed: nil,
        action: "pointerleave->nk--tooltip#resetIfUninterested focusout->nk--tooltip#resetIfUninterested"
      }
    },
    html:,
    aria:,
    data:,
    desperately_need_a_class:
  )
end

Instance Attribute Details

#contentObject (readonly)

Returns the value of attribute content.



61
62
63
# File 'app/components/nitro_kit/tooltip.rb', line 61

def content
  @content
end

#identifierObject (readonly)

Returns the value of attribute identifier.



61
62
63
# File 'app/components/nitro_kit/tooltip.rb', line 61

def identifier
  @identifier
end

#placementObject (readonly)

Returns the value of attribute placement.



61
62
63
# File 'app/components/nitro_kit/tooltip.rb', line 61

def placement
  @placement
end

Instance Method Details

#trigger(text = nil, as: Button, href: nil, variant: :default, size: :md, icon: nil, icon_end: nil, label: nil, target: nil, rel: nil, download: nil, html: {}, aria: {}, data: {}, desperately_need_a_class: nil, &content) ⇒ Object

Raises:

  • (ArgumentError)


80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
# File 'app/components/nitro_kit/tooltip.rb', line 80

def trigger(
  text = nil,
  as: Button,
  href: nil,
  variant: :default,
  size: :md,
  icon: nil,
  icon_end: nil,
  label: nil,
  target: nil,
  rel: nil,
  download: nil,
  html: {},
  aria: {},
  data: {},
  desperately_need_a_class: nil,
  &content
)
  ensure_collecting!
  raise ArgumentError, "Tooltip accepts exactly one trigger" if @trigger
  unless as == Button || as == :custom || HTML_TRIGGERS.include?(as)
    raise ArgumentError, "Tooltip as: must be NitroKit::Button, :custom, :div, or :span"
  end
  if text.nil? && !content && icon.nil?
    raise ArgumentError, "Tooltip trigger requires text, a block, or an icon"
  end
  if as == :custom && content&.arity != 1
    raise ArgumentError, "Tooltip custom trigger block must accept trigger attributes"
  end
  if as != Button && [ href, icon, icon_end, label, target, rel, download ].any?
    raise ArgumentError, "Tooltip #{as.inspect} trigger does not accept Button options"
  end

  @trigger = Trigger.new(
    as:,
    text:,
    href:,
    variant:,
    size:,
    icon:,
    icon_end:,
    label:,
    disabled: false,
    target:,
    rel:,
    download:,
    html:,
    aria:,
    data:,
    css_class: desperately_need_a_class,
    content:
  )
  nil
end

#view_template(&block) ⇒ Object



63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
# File 'app/components/nitro_kit/tooltip.rb', line 63

def view_template(&block)
  collect_trigger(&block)

  span(**root_attributes) do
    render_trigger
    span(
      **slot_attributes(
        :content,
        attributes: {
          id: content_id,
          role: "tooltip"
        }
      )
    ) { plain(content) }
  end
end