import { r as d, h as e, H as c, g as h } from "./index.61732cef.js";
import { b as f, c as u, o as m, s as b, f as w, a 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)}@keyframes tooltip-fade-in{from{opacity:0}to{opacity:1}}", _ = class {
  constructor(o) {
    d(this, o), this.active = !0, this.delay = 200, 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 s = [
        ...this.options.middleware.filter((p) => p && p.name !== "arrow"),
        f({ element: this.arrowElement, padding: 12 })
      ];
      this.actualPosition = await u(t, this.popperEl, { ...this.options, middleware: s });
      const i = (r = this.actualPosition.middlewareData.arrow) == null ? void 0 : r.x, a = (l = this.actualPosition.middlewareData.arrow) == null ? void 0 : l.y;
      this.arrowStyles = {
        left: Boolean(i) ? i + "px" : void 0,
        top: Boolean(a) ? a + "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"), s = n("--s-space-8"), i = n("--s-space-16");
      this.options = {
        middleware: [
          m(t),
          b({
            padding: {
              top: s,
              bottom: s,
              left: i,
              right: i
            }
          }),
          w()
        ],
        placement: this.position,
        strategy: "fixed"
      };
    };
  }
  watchPosition() {
    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 o = this.el.children[0];
      !Boolean(o) || ((t = this.popperEl) == null || t.showPopover(), this.reposition(), this.disableAutoUpdate = g(o, this.popperEl, this.reposition.bind(this)));
    }));
  }
  async hide() {
    var o, t;
    Boolean(this.showTimeout) && (clearTimeout(this.showTimeout), this.showTimeout = void 0), this.visible = !1, (o = this.popperEl) == null || o.hidePopover(), (t = this.disableAutoUpdate) == null || t.call(this);
  }
  render() {
    var t, s, i;
    const o = v("tooltip", `tooltip--actual-placement-${(t = this.actualPosition) == null ? void 0 : t.placement}`, `tooltip--intent-${this.intent}`, {
      "tooltip--visible": this.visible
    });
    return e(c, { key: "1dd85438065ad5b0fb1753693badcd517c08cc74", onKeydown: this.onKeydown }, e("span", { key: "cec96b53ce14d09093bb19d740de8fc768863347", class: o }, e("span", { key: "d2fc2f7501a50e94430bb630c9994593f29dc19d", class: "tooltip__reference", "aria-describedby": "tooltip", onFocusout: this.onFocusOut, onClick: this.hide, onFocusin: this.onFocusIn }, e("slot", { key: "61cf62d730c48c8fd63b83847afe60376fe7d931" })), e("span", { key: "9c8fb12661cf80e005c1f6511d187a449a9dc035", class: "tooltip__popper", popover: "manual", ref: (a) => this.popperEl = a, style: {
      top: Boolean(this.actualPosition) ? `${(s = this.actualPosition) == null ? void 0 : s.y}px` : "",
      left: Boolean(this.actualPosition) ? `${(i = this.actualPosition) == null ? void 0 : i.x}px` : "",
      maxWidth: this.maxWidth
    } }, this.visible && e("span", { key: "b121c81db6689177e2e3d49c5665124ad699015b", class: "tooltip__bubble", id: "tooltip", part: "tooltip__bubble", role: "tooltip" }, e("span", { key: "61b17017e5d15d0c7111a297ee9a0ff9c6c6e531", class: "tooltip__content", innerHTML: this.content })), e("span", { key: "0fc2bd719134a3e51d0ee38a4883544b799249df", class: "tooltip__arrow", ref: (a) => this.arrowElement = a, style: {
      ...this.arrowStyles,
      visibility: this.visible ? "visible" : "hidden"
    } }))));
  }
  get el() {
    return h(this);
  }
  static get watchers() {
    return {
      position: [{
        watchPosition: 0
      }]
    };
  }
};
_.style = y();
export {
  _ as swirl_tooltip
};
