Class: UI::TooltipContent

Inherits:
Phlex::HTML
  • Object
show all
Includes:
TooltipContentBehavior
Defined in:
app/components/ui/tooltip_content.rb

Overview

Content - Phlex implementation

The popup content that displays tooltip information. Positioned by Floating UI via Stimulus controller.

Examples:

Basic usage

render UI::Content.new { "Tooltip text" }

With custom side

render UI::Content.new(side: "right") { "Appears on right" }

With side offset

render UI::Content.new(side_offset: 8) { "More spacing" }

Instance Method Summary collapse

Methods included from TooltipContentBehavior

#tooltip_content_classes, #tooltip_content_data_attributes, #tooltip_content_html_attributes

Constructor Details

#initialize(side: "top", align: "center", side_offset: 4, classes: "", **attributes) ⇒ TooltipContent

Returns a new instance of TooltipContent.

Parameters:

  • side (String) (defaults to: "top") —

    Preferred side: “top”, “right”, “bottom”, “left”

  • align (String) (defaults to: "center") —

    Alignment: “start”, “center”, “end”

  • side_offset (Integer) (defaults to: 4) —

    Distance from trigger element in pixels

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

    Additional CSS classes to merge

  • attributes (Hash) —

    Additional HTML attributes



24
25
26
27
28
29
30
 
# File 'app/components/ui/tooltip_content.rb', line 24

def initialize(side: "top", align: "center", side_offset: 4, classes: "", **attributes)
  @side = side
  @align = align
  @side_offset = side_offset
  @classes = classes
  @attributes = attributes
end

Instance Method Details

#view_template(&block) ⇒ Object 



32
33
34
 
# File 'app/components/ui/tooltip_content.rb', line 32

def view_template(&block)
  div(**tooltip_content_html_attributes.deep_merge(@attributes), &block)
end