The hover card content that appears on hover.

Props

• size - Size of the content: "1", "2", "3" (default: "2")
• side - Placement side: "top", "bottom" (default: "bottom")
• align - Alignment: "start", "center", "end" (default: "start")
• max_width - Maximum width (default: "480px")
• Plus width/height props

Attributes

• id (:string) - Defaults to nil.
• size (:string) - Defaults to "2". Must be one of "1", "2", or "3".
• side (:string) - Defaults to "bottom". Must be one of "top", "bottom", "left", or "right".
• align (:string) - Defaults to "start". Must be one of "start", "center", or "end".
• container (:string) - Defaults to "body".
• class (:string) - Defaults to nil.
• style (:string) - Defaults to "".
• width (:any) - Width utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
• max_width (:any) - Max width utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
• min_width (:any) - Min width utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
• height (:any) - Height utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
• max_height (:any) - Max height utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
• min_height (:any) - Min height utility class string or map. 100px or %{xs: '100px', sm: '200px'}.
• Global attributes are accepted.

Slots

• inner_block (required)

Root container for hover card. Wraps trigger and content.

Examples

<.hover_card_root>
  <.hover_card_trigger>
    <.link href="#">Hover me</.link>
  </.hover_card_trigger>
  <.hover_card_content>
    <p>Preview content here</p>
  </.hover_card_content>
</.hover_card_root>

Attributes

• id (:string) - Defaults to nil.
• open (:boolean) - Defaults to false.
• default_open (:boolean) - Defaults to false.
• open_delay (:integer) - Delay before showing (ms). Defaults to 200.
• close_delay (:integer) - Delay before hiding (ms). Defaults to 150.
• on_open_change (:string) - Defaults to nil.
• class (:string) - Defaults to nil.
• style (:string) - Defaults to "".
• Global attributes are accepted.

Slots

• inner_block (required)

The trigger area that opens the hover card on hover. Wraps the link or element that triggers the hover card.

Attributes

• id (:string) - Defaults to nil.
• content_id (:string) - Defaults to nil.
• class (:string) - Defaults to nil.
• style (:string) - Defaults to "".
• Global attributes are accepted.

Slots

• inner_block (required)