import { r as h, h as s, H as d, g as f } from "./index.e6beb8d9.js";
import { b as u, c as m, o as c, f as b, a as w, s as g } from "./floating-ui.dom-CLsTbQHn.fe95e3a6.js";
import { c as v } from "./index-orsBiyT_.fc4357c3.js";
import { o as n } from "./utils-CCck-DTo.e4e43b6a.js";
import "react";
import "react-dom";
const y = () => ":host{display:contents;font-weight:var(--s-font-weight-normal)}:host *{box-sizing:border-box}.tooltip{display:contents}.tooltip--visible .tooltip__popper{display:block;animation:tooltip-fade-in 0.15s;animation-delay:0.1s;animation-fill-mode:forwards;opacity:0}.tooltip--actual-placement-top .tooltip__arrow{top:calc(100% - 0.0625rem);transform:translate3d(0, -50%, 0) rotate(45deg)}.tooltip--actual-placement-bottom .tooltip__arrow{bottom:calc(100% - 0.0625rem);transform:translate3d(0, 50%, 0) rotate(45deg)}.tooltip--actual-placement-left .tooltip__arrow{left:calc(100% - 0.0625rem);transform:translate3d(-50%, 0, 0) rotate(45deg)}.tooltip--actual-placement-right .tooltip__arrow{right:calc(100% - 0.0625rem);transform:translate3d(50%, 0, 0) rotate(45deg)}.tooltip .tooltip__reference{display:contents}.tooltip__popper{position:fixed;display:none;opacity:0;border:none;padding:0;margin:0;background:transparent;overflow:visible}.tooltip__popper::backdrop{display:none}.tooltip__bubble{position:relative;display:block;padding-top:var(--s-space-8);padding-right:var(--s-space-12);padding-bottom:calc(var(--s-space-8) + 0.0625rem);padding-left:var(--s-space-12);border-radius:var(--s-border-radius-sm);color:var(--s-text-on-status);background-color:var(--s-surface-neutral-default);line-height:var(--s-line-height-base);text-align:start;box-shadow:var(--s-shadow-level-2)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tooltip__bubble{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.tooltip__content{white-space:normal}.tooltip__arrow{position:absolute;width:0.6875rem;height:0.6875rem;border-radius:0.125rem;background-color:var(--s-surface-neutral-default)}.tooltip--intent-info .tooltip__bubble,.tooltip--intent-info .tooltip__arrow{background-color:var(--s-surface-info-default)}.tooltip--intent-primary .tooltip__bubble,.tooltip--intent-primary .tooltip__arrow{background-color:var(--s-action-primary-default);color:var(--s-text-on-action-primary)}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}", _ = class {
  constructor(i) {
    h(this, i), this.active = !0, this.delay = 200, this.enableFlip = !0, this.intent = "default", this.maxWidth = "17.5rem", this.position = "top", this.trigger = ["focus", "hover"], this.visible = !1, this.onKeydown = (t) => {
      t.code === "Escape" && this.hide();
    }, this.onFocusIn = () => {
      this.trigger.includes("focus") && this.show();
    }, this.onFocusOut = () => {
      this.trigger.includes("focus") && this.hide();
    }, this.reposition = async () => {
      var r, l;
      const t = this.el.children[0];
      if (!Boolean(t) || !Boolean(this.popperEl))
        return;
      const a = [
        ...this.options.middleware.filter((p) => p && p.name !== "arrow"),
        u({ element: this.arrowElement, padding: 12 })
      ];
      this.actualPosition = await m(t, this.popperEl, { ...this.options, middleware: a });
      const e = (r = this.actualPosition.middlewareData.arrow) == null ? void 0 : r.x, o = (l = this.actualPosition.middlewareData.arrow) == null ? void 0 : l.y;
      this.arrowStyles = {
        left: Boolean(e) ? e + "px" : void 0,
        top: Boolean(o) ? o + "px" : void 0
      };
    }, this.showWithDelay = () => {
      !this.active || (Boolean(this.showTimeout) && (clearTimeout(this.showTimeout), this.showTimeout = void 0), this.showTimeout = setTimeout(() => {
        this.show();
      }, this.delay));
    }, this.updateOptions = () => {
      const t = n("--s-space-12"), a = n("--s-space-8"), e = n("--s-space-16"), o = g({
        padding: {
          top: a,
          bottom: a,
          left: e,
          right: e
        }
      });
      this.options = {
        middleware: this.enableFlip ? [c(t), o, b()] : [c(t), o],
        placement: this.position,
        strategy: "fixed"
      };
    };
  }
  watchPosition() {
    this.updateOptions();
  }
  watchEnableFlip() {
    this.updateOptions();
  }
  onMouseEnter() {
    this.trigger.includes("hover") && this.showWithDelay();
  }
  onMouseLeave() {
    this.trigger.includes("hover") && this.hide();
  }
  onWindowResize() {
    !this.active || this.reposition();
  }
  onWindowScroll() {
    !this.active || !this.visible || this.reposition();
  }
  componentWillLoad() {
    this.reposition();
  }
  componentDidLoad() {
    this.positioning !== void 0 && console.warn('[Swirl] The "positioning" prop of swirl-tooltip is deprecated and will be removed with the next major release. "fixed" is now the default positioning strategy.'), this.updateOptions();
  }
  async show() {
    !this.active || (this.visible = !0, requestAnimationFrame(() => {
      var t;
      const i = this.el.children[0];
      !Boolean(i) || ((t = this.popperEl) == null || t.showPopover(), this.reposition(), this.disableAutoUpdate = w(i, this.popperEl, this.reposition.bind(this)));
    }));
  }
  async hide() {
    var i, t;
    Boolean(this.showTimeout) && (clearTimeout(this.showTimeout), this.showTimeout = void 0), this.visible = !1, (i = this.popperEl) == null || i.hidePopover(), (t = this.disableAutoUpdate) == null || t.call(this);
  }
  render() {
    var t, a, e;
    const i = v("tooltip", `tooltip--actual-placement-${(t = this.actualPosition) == null ? void 0 : t.placement}`, `tooltip--intent-${this.intent}`, {
      "tooltip--visible": this.visible
    });
    return s(d, { key: "1e73aa7fda37312ffe735e64aada284b64757636", onKeydown: this.onKeydown }, s("span", { key: "cf410f2df66d6dab87fe69575badff76c68a28c4", class: i }, s("span", { key: "1406087c620860e51e36c75b6261b27fdf0b85f0", class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.onFocusOut, onClick: this.hide, onFocusin: this.onFocusIn }, s("slot", { key: "61948bb331b79b6cd21931bda79ac5f31607df5f" })), s("span", { key: "c4381b3449d496583c12849d48b0ec32b0c2a378", class: "tooltip__popper", popover: "manual", ref: (o) => this.popperEl = o, style: {
      top: Boolean(this.actualPosition) ? `${(a = this.actualPosition) == null ? void 0 : a.y}px` : "",
      left: Boolean(this.actualPosition) ? `${(e = this.actualPosition) == null ? void 0 : e.x}px` : "",
      maxWidth: this.maxWidth
    } }, this.visible && s("span", { key: "eb2d184168f3a6b4c8e56a4c7f0190022c51cc72", class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, s("span", { key: "12f634e430549cae1f4370766a85a9454a8fccef", class: "tooltip__content", innerHTML: this.content })), s("span", { key: "c9ca0cf1d9260e483cab3dee3d98c5203b031a54", class: "tooltip__arrow", ref: (o) => this.arrowElement = o, style: {
      ...this.arrowStyles,
      visibility: this.visible ? "visible" : "hidden"
    } }))));
  }
  get el() {
    return f(this);
  }
  static get watchers() {
    return {
      position: [{
        watchPosition: 0
      }],
      enableFlip: [{
        watchEnableFlip: 0
      }]
    };
  }
};
_.style = y();
export {
  _ as swirl_tooltip
};
