@swapper-finance/sdk/src/utils/injectTooltipLayer.ts

JavaScript SDK form Swapper

export function injectTooltipLayer(containerId = "app-router-container") {
  const interval = setInterval(() => {
    const host = document.getElementById("swapper-sdk-widget");
    const shadow = host?.shadowRoot;

    if (!shadow) return;

    const relativeContainer = shadow.querySelector(
      `#${containerId}`,
    ) as HTMLElement;
    const alreadyExists = shadow.getElementById("tooltip-layer");

    if (alreadyExists || !relativeContainer) {
      clearInterval(interval);
      return;
    }

    const layer = document.createElement("div");
    layer.id = "tooltip-layer";
    layer.style.position = "absolute";
    layer.style.inset = "0";
    layer.style.pointerEvents = "none";
    layer.style.zIndex = "9999";

    relativeContainer.appendChild(layer);
    clearInterval(interval);
  }, 50);
}