sigma_kit

defmodule SigmaKit.Components.Popups do
  use Phoenix.LiveComponent

  attr :text, :string
  slot :inner_block

  def tooltip(assigns) do
    assigns = assign(assigns, :id, SigmaKit.Util.random_string())

    ~H"""
    <div class="inline-block" id={@id} phx-hook="TippyHook" data-tippy-content={@text}>
      {render_slot(@inner_block)}
    </div>
    """
  end

  attr :placement, :string, default: "top"
  attr :class, :any, default: nil

  attr :plain, :boolean,
    default: false,
    doc: "If true, the popover will not have a shadow or border."

  attr :nopad, :boolean,
    default: false,
    doc: "If true, the popover will not have internal padding"

  attr :rest, :global, doc: "Any additional HTML attributes to add to the floating container."

  attr :trigger_click,
       :boolean,
       default: false,
       doc: "If true the popover will open on click, instead of on hover"

  attr :minwidth, :boolean,
    default: false,
    doc: "If true the popover will have a min-width equal to the trigger element"

  slot :trigger
  slot :inner_block

  def popover(assigns) do
    assigns = assign(assigns, :id, SigmaKit.Util.random_string())

    ~H"""
    <div id={@id}>
      {render_slot(@trigger)}
    </div>

    <div
      id={"float-#{@id}"}
      style="z-index: 100"
      class={[
        "hidden absolute w-max top-0 left-0 transition-opacity [&_.child]:z-index-100 z-index-100",
        !@plain && "bg-white/70 backdrop-blur border shadow-lg rounded overflow-hidden",
        !@nopad && "p-2",
        @class
      ]}
      tabindex="0"
      phx-hook="FloatingHook"
      data-min-width={@minwidth}
      data-trigger={if @trigger_click, do: "click", else: "hover"}
      data-attach-to-id={@id}
      data-placement={@placement}
      {@rest}
    >
      {render_slot(@inner_block)}
    </div>
    """
  end
end