Components Tooltip
Petal Pro

Tooltip

v0.1.0 +
Easily create a tooltip on any element. Uses the Tippy.js library under the hood.
heex 
          <.button
  label="Has tooltip"
  data-tippy-content="Here is the tooltip"
  phx-hook="TippyHook"
  id="button_tooltip_example"
/>

<.button
  label="Has tooltip"
  data-tippy-content="Bottom tooltip"
  data-tippy-placement="bottom"
  phx-hook="TippyHook"
  id="button_tooltip_example2"
/>

<.button
  label="On click"
  data-tippy-content="Here is the tooltip"
  data-tippy-trigger="click"
  phx-hook="TippyHook"
  id="button_tooltip_example3"
/>

You can use the Tippy hook on any element. Just ensure you have the data-tippy-content attribute, phx-hook="TippyHook" and an id attribute.

How to access

Membership
$299
-> 
See plans

This comes with Petal Pro. Purchase a membership to get access to this package. It can be used with any Phoenix project. Post-expiration, you'll retain access but won't be eligible for updates from newer versions.