Class: Shadcn::HoverCard::Component

Inherits:
ApplicationViewComponent show all
Defined in:
app/components/shadcn/hover_card/component.rb

Overview

Port of registry/new-york-v4/ui/hover-card.tsx, whose behaviour is Radix's HoverCard — vendored at vendor/radix/ui/hover-card.tsx.

A tooltip's larger relative, and the difference is what the delays are for: this content is meant to be entered. Moving the pointer from the trigger onto the card keeps it open, which is why the card carries the same enter and leave handlers the trigger does.

Constant Summary

Constants inherited from ApplicationViewComponent

ApplicationViewComponent::CONTENTS_STYLE, ApplicationViewComponent::VOID_TAGS

Instance Attribute Summary collapse

Attributes inherited from ApplicationViewComponent

#attributes

Instance Method Summary collapse

Methods inherited from ApplicationViewComponent

#css_classes, default_tag, #merged_style, #render_element, #shadcn_t, slot_name, #style_variants, #tag_name

Constructor Details

#initialize(side: :bottom, align: :center, side_offset: 4, open_delay: 700, close_delay: 300, **attributes) ⇒ Component

open_delay and close_delay are Radix's own defaults (vendor/radix/ui/hover-card.tsx:59-60), not numbers chosen here. The closing one is the longer-lived decision of the two: it is the window in which you can cross the gap between the trigger and the card.



24
25
26
27
28
29
30
31
32
 
# File 'app/components/shadcn/hover_card/component.rb', line 24

def initialize(side: :bottom, align: :center, side_offset: 4,
               open_delay: 700, close_delay: 300, **attributes)
  @side = side&.to_sym || :bottom
  @align = align&.to_sym || :center
  @side_offset = side_offset
  @open_delay = open_delay
  @close_delay = close_delay
  super(**attributes)
end

Instance Attribute Details

#align ⇒ Object (readonly)

Returns the value of attribute align.



18
19
20
 
# File 'app/components/shadcn/hover_card/component.rb', line 18

def align
  @align
end

#close_delay ⇒ Object (readonly)

Returns the value of attribute close_delay.



18
19
20
 
# File 'app/components/shadcn/hover_card/component.rb', line 18

def close_delay
  @close_delay
end

#open_delay ⇒ Object (readonly)

Returns the value of attribute open_delay.



18
19
20
 
# File 'app/components/shadcn/hover_card/component.rb', line 18

def open_delay
  @open_delay
end

#side ⇒ Object (readonly)

Returns the value of attribute side.



18
19
20
 
# File 'app/components/shadcn/hover_card/component.rb', line 18

def side
  @side
end

#side_offset ⇒ Object (readonly)

Returns the value of attribute side_offset.



18
19
20
 
# File 'app/components/shadcn/hover_card/component.rb', line 18

def side_offset
  @side_offset
end

Instance Method Details

#call ⇒ Object 



46
47
48
 
# File 'app/components/shadcn/hover_card/component.rb', line 46

def call
  render_element(body: safe_join([ trigger, hover_card_content, content ].compact))
end

#element_attributes(**defaults) ⇒ Object 



34
35
36
37
38
39
40
41
42
43
44
 
# File 'app/components/shadcn/hover_card/component.rb', line 34

def element_attributes(**defaults)
  super(**{
    style: merged_style(CONTENTS_STYLE),
    "data-controller" => "shadcn--hover-card",
    "data-shadcn--hover-card-side-value" => side,
    "data-shadcn--hover-card-align-value" => align,
    "data-shadcn--hover-card-side-offset-value" => side_offset,
    "data-shadcn--hover-card-open-delay-value" => open_delay,
    "data-shadcn--hover-card-close-delay-value" => close_delay
  }.merge(defaults))
end