<span data-polaris-tooltip-active-value="true" data-polaris-tooltip-position-value="bottom" data-action="mouseenter->polaris-tooltip#show mouseleave->polaris-tooltip#hide focus->polaris-tooltip#show blur->polaris-tooltip#hide" data-controller="polaris-tooltip">
  <button type="button" data-controller="polaris-button" class="Polaris-Button Polaris-Button--iconOnly">
    <span class="Polaris-Button__Content">
      <div class="Polaris-Button__Icon">
        <span class="Polaris-Icon">
          <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true"><path d="M6.25 10a.75.75 0 0 1 .75-.75h2.25v-2.25a.75.75 0 0 1 1.5 0v2.25h2.25a.75.75 0 0 1 0 1.5h-2.25v2.25a.75.75 0 0 1-1.5 0v-2.25h-2.25a.75.75 0 0 1-.75-.75Z"></path><path fill-rule="evenodd" d="M10 17a7 7 0 1 0 0-14 7 7 0 0 0 0 14Zm0-1.5a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11Z"></path></svg>
        </span>
      </div>
    </span>
  </button>
  <template data-polaris-tooltip-target="template">
    <div class="Polaris-Tooltip-TooltipOverlay__Content Polaris-Tooltip-TooltipOverlay--default">
      Add product
    </div>
    <div class="Polaris-Tooltip-Arrow" data-tooltip-arrow="true"></div>
  </template>
</span>