@dialpad/dialtone-vue 3.120.0 → 3.120.2

package/dist/lib/tooltip.cjs

@@ -1,2 +1,461 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../chunks/popover_constants-hOEhklvr.js"),l=require("./utils.cjs"),o=require("vue"),u=require("../chunks/_plugin-vue_export-helper-6_y-gaV6.js"),d=require("./lazy-show.cjs");require("tippy.js");require("./constants.cjs");const p={name:"DtTooltip",components:{DtLazyShow:d.DtLazyShow},props:{id:{type:String,default(){return l.getUniqueString()}},fallbackPlacements:{type:Array,default:()=>["auto"]},inverted:{type:Boolean,default:!1},offset:{type:Array,default:()=>[0,-4]},placement:{type:String,default:"top",validator(e){return i.T.includes(e)}},sticky:{type:[Boolean,String],default:!1,validator:e=>i.j.includes(e)},appendTo:{type:[HTMLElement,String],default:"body",validator:e=>i.e.includes(e)||e instanceof HTMLElement},contentClass:{type:[String,Object,Array],default:""},message:{type:String,default:""},enabled:{type:Boolean,default:!0},show:{type:Boolean,default:null},transition:{type:String,default:"fade"},contentAppear:{type:Boolean,default:!1},delay:{type:Boolean,default:!0},externalAnchor:{type:String,default:null}},emits:["shown","update:show"],data(){return{TOOLTIP_KIND_MODIFIERS:i.i,hasSlotContent:l.hasSlotContent,tip:null,inTimer:null,isShown:!1,currentPlacement:this.placement,isTouchDevice:!1}},computed:{isVisible(){var a,n;const e=!!((a=this.message)!=null&&a.trim()),t=!!((n=this.$slots)!=null&&n.default),r=!this.isTouchDevice;return this.isShown&&this.enabled&&(e||t)&&r},tooltipListeners(){return{"after-leave":()=>{this.onLeaveTransitionComplete()},"after-enter":()=>{this.onEnterTransitionComplete()}}},tippyProps(){return{offset:this.offset,interactive:!1,trigger:"manual",placement:this.placement,sticky:this.sticky,popperOptions:i.l({fallbackPlacements:this.fallbackPlacements,hasHideModifierEnabled:!0,onChangePlacement:this.onChangePlacement})}},anchor(){return this.externalAnchor?document.body.querySelector(this.externalAnchor):i.m(this.$refs.anchor)}},watch:{tippyProps:{handler:"setProps",deep:!0},show:{handler:function(e){e!==null&&(this.isShown=e)},immediate:!0},isShown(e){e?(this.setProps(),this.tip.show()):this.tip.hide()},sticky(e){this.tip.setProps({sticky:e})}},mounted(){!this.enabled&&this.show!=null&&(console.warn("Tooltip: You cannot use both the enabled and show props at the same time."),console.warn("The show prop will be ignored.")),this.externalAnchor&&this.addExternalAnchorEventListeners(),this.tip=i.n(this.anchor,this.initOptions()),this.isShown&&this.tip.show()},beforeUnmount(){var e;this.externalAnchor&&this.removeExternalAnchorEventListeners(),this.tip&&((e=this.tip)==null||e.destroy())},methods:{calculateAnchorZindex(){return this.$el.getRootNode().querySelector('.d-modal[aria-hidden="false"], .d-modal--transparent[aria-hidden="false"]')||this.$el.closest(".d-zi-drawer")?651:400},hasVisibleFocus(){return this.anchor.matches(":focus-visible")},onEnterAnchor(e){this.isTouchDevice&&!e.relatedTarget||(this.delay?this.inTimer=setTimeout((function(t){this.triggerShow(t)}).bind(this,e),i.h):this.triggerShow(e),this.isTouchDevice=!1)},triggerShow(e){e.type==="focusin"?this.show===null&&this.hasVisibleFocus()&&(this.isShown=!0):this.show===null&&(this.isShown=!0)},onLeaveAnchor(e){e.type==="keydown"&&e.code!=="Escape"||(clearTimeout(this.inTimer),this.triggerHide())},triggerHide(){this.show===null&&(this.isShown=!1)},onChangePlacement(e){this.currentPlacement=e},onLeaveTransitionComplete(){var e;(e=this.tip)==null||e.unmount(),this.$emit("shown",!1),this.show!==null&&this.$emit("update:show",!1)},onEnterTransitionComplete(){this.$emit("shown",!0),this.show!==null&&this.$emit("update:show",!0)},setProps(){var e,t;this.tip&&this.tip.setProps&&this.tip.setProps({...this.tippyProps,zIndex:this.calculateAnchorZindex(),appendTo:this.appendTo==="body"?(t=(e=this.anchor)==null?void 0:e.getRootNode())==null?void 0:t.querySelector("body"):this.appendTo})},onMount(){this.setProps()},initOptions(){return{contentElement:this.$refs.content.$el,allowHTML:!0,zIndex:this.calculateAnchorZindex(),onMount:this.onMount,...this.tippyProps}},addExternalAnchorEventListeners(){["focusin","mouseenter"].forEach(e=>{this.anchor.addEventListener(e,t=>this.onEnterAnchor(t))}),["focusout","mouseleave","keydown"].forEach(e=>{this.anchor.addEventListener(e,t=>this.onLeaveAnchor(t))})},removeExternalAnchorEventListeners(){["focusin","mouseenter"].forEach(e=>{this.anchor.removeEventListener(e,t=>this.onEnterAnchor(t))}),["focusout","mouseleave","keydown"].forEach(e=>{this.anchor.removeEventListener(e,t=>this.onLeaveAnchor(t))})},onTouchStart(){this.isTouchDevice=!0}}},f={"data-qa":"dt-tooltip-container"};function m(e,t,r,h,a,n){const c=o.resolveComponent("dt-lazy-show");return o.openBlock(),o.createElementBlock("div",f,[r.externalAnchor?o.createCommentVNode("",!0):(o.openBlock(),o.createElementBlock("span",{key:0,ref:"anchor","data-qa":"dt-tooltip-anchor",onFocusin:t[0]||(t[0]=(...s)=>n.onEnterAnchor&&n.onEnterAnchor(...s)),onFocusout:t[1]||(t[1]=(...s)=>n.onLeaveAnchor&&n.onLeaveAnchor(...s)),onMouseenter:t[2]||(t[2]=(...s)=>n.onEnterAnchor&&n.onEnterAnchor(...s)),onMouseleave:t[3]||(t[3]=(...s)=>n.onLeaveAnchor&&n.onLeaveAnchor(...s)),onKeydown:t[4]||(t[4]=o.withKeys((...s)=>n.onLeaveAnchor&&n.onLeaveAnchor(...s),["esc"])),onTouchstart:t[5]||(t[5]=(...s)=>n.onTouchStart&&n.onTouchStart(...s))},[o.renderSlot(e.$slots,"anchor")],544)),o.createVNode(c,o.mergeProps({id:r.id,ref:"content",show:n.isVisible,role:"tooltip","aria-hidden":"false","data-qa":"dt-tooltip",appear:r.contentAppear,transition:r.transition,class:["d-tooltip",`d-tooltip__arrow-tippy--${a.currentPlacement}`,{[a.TOOLTIP_KIND_MODIFIERS.inverted]:r.inverted},r.contentClass]},o.toHandlers(n.tooltipListeners)),{default:o.withCtx(()=>[o.renderSlot(e.$slots,"default",{},()=>[o.createTextVNode(o.toDisplayString(r.message),1)])]),_:3},16,["id","show","appear","transition","class"])])}const y=u._(p,[["render",m]]);exports.TOOLTIP_DELAY_MS=i.h;exports.TOOLTIP_DIRECTIONS=i.T;exports.TOOLTIP_HIDE_ON_CLICK_VARIANTS=i.k;exports.TOOLTIP_KIND_MODIFIERS=i.i;exports.TOOLTIP_STICKY_VALUES=i.j;exports.DtTooltip=y;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const popover_constants = require("../chunks/popover_constants-JwBF9h1Z.js");
+const common_utils = require("../common/utils.cjs");
+const vue = require("vue");
+const _pluginVue_exportHelper = require("../chunks/_plugin-vue_export-helper-fhnQq0tA.js");
+const lib_lazyShow = require("./lazy-show.cjs");
+require("tippy.js");
+require("../common/constants.cjs");
+const _sfc_main = {
+  name: "DtTooltip",
+  components: {
+    DtLazyShow: lib_lazyShow.DtLazyShow
+  },
+  props: {
+    /**
+     * The id of the tooltip
+     */
+    id: {
+      type: String,
+      default() {
+        return common_utils.getUniqueString();
+      }
+    },
+    /**
+     * If the popover does not fit in the direction described by "placement",
+     * it will attempt to change its direction to the "fallbackPlacements"
+     * if defined, otherwise it will automatically position to a new location
+     * as it sees best fit. See
+     * <a
+     *   class="d-link"
+     *   href="https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements"
+     *   target="_blank"
+     * >
+     *   Popper.js docs
+     * </a>
+     * */
+    fallbackPlacements: {
+      type: Array,
+      default: () => ["auto"]
+    },
+    /**
+     * If true, applies inverted styles to the tooltip
+     * @values true, false
+     */
+    inverted: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     *  Displaces the tooltip from its reference element
+     *  by the specified number of pixels. See
+     *  <a
+     *    class="d-link"
+     *    href="https://atomiks.github.io/tippyjs/v6/all-props/#offset"
+     *    target="_blank"
+     *  >
+     *    Tippy.js docs
+     *  </a>
+     */
+    offset: {
+      type: Array,
+      default: () => [0, -4]
+    },
+    /**
+     * The direction the popover displays relative to the anchor. See
+     * <a
+     *   class="d-link"
+     *   href="https://atomiks.github.io/tippyjs/v6/all-props/#placement"
+     *   target="_blank"
+     * >
+     *   Tippy.js docs
+     * </a>
+     * @values top, top-start, top-end,
+     * right, right-start, right-end,
+     * left, left-start, left-end,
+     * bottom, bottom-start, bottom-end,
+     * auto, auto-start, auto-end
+     */
+    placement: {
+      type: String,
+      default: "top",
+      validator(placement) {
+        return popover_constants.TOOLTIP_DIRECTIONS.includes(placement);
+      }
+    },
+    /**
+     * If the tooltip sticks to the anchor. This is usually not needed, but can be needed
+     * if the reference element's position is animating, or to automatically update the popover
+     * position in those cases the DOM layout changes the reference element's position.
+     * `true` enables it, `reference` only checks the "reference" rect for changes and `popper` only
+     * checks the "popper" rect for changes. See
+     * <a
+     *   class="d-link"
+     *   href="https://atomiks.github.io/tippyjs/v6/all-props/#sticky"
+     *   target="_blank"
+     * >
+     *   Tippy.js docs
+     * </a>
+     * @values true, false, reference, popper
+     */
+    sticky: {
+      type: [Boolean, String],
+      default: false,
+      validator: (sticky) => {
+        return popover_constants.TOOLTIP_STICKY_VALUES.includes(sticky);
+      }
+    },
+    /**
+     * Sets the element to which the tooltip is going to append to.
+     * 'body' will append to the nearest body (supports shadow DOM).
+     * This prop is not reactive, must be set on initial render.
+     * @values 'body', 'parent', HTMLElement,
+     */
+    appendTo: {
+      type: [HTMLElement, String],
+      default: "body",
+      validator: (appendTo) => {
+        return popover_constants.POPOVER_APPEND_TO_VALUES.includes(appendTo) || appendTo instanceof HTMLElement;
+      }
+    },
+    /**
+     * Additional css classes for the tooltip content element.
+     * Can accept all of String, Object, and Array, i.e. has the
+     * same api as Vue's built-in handling of the class attribute.
+     */
+    contentClass: {
+      type: [String, Object, Array],
+      default: ""
+    },
+    /**
+     * A provided message for the tooltip content
+     */
+    message: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Controls whether hover/focus causes the tooltip to appear.
+     * Cannot be combined with the show prop. show value will be ignored.
+     * by default this is true, if you override with false, the tooltip will never show up.
+     */
+    enabled: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * Controls whether the tooltip is shown. Leaving this null will have the tooltip trigger on mouseover by default.
+     * If you set this value, the default mouseover behavior will be disabled and you can control it as you need.
+     * Supports .sync modifier
+     * @values null, true, false
+     */
+    show: {
+      type: Boolean,
+      default: null
+    },
+    /**
+     * Named transition when the content display is toggled.
+     * @see DtLazyShow
+     */
+    transition: {
+      type: String,
+      default: "fade"
+    },
+    /**
+     * Whether to apply transition on initial render in the content lazy show component.
+     * @values true, false
+     */
+    contentAppear: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * Whether the tooltip will have a delay when being focused or moused over.
+     * @values true, false
+     */
+    delay: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * External anchor id to use in those cases the anchor can't be provided via the slot.
+     * For instance, using the combobox's input as the anchor for the popover.
+     */
+    externalAnchor: {
+      type: String,
+      default: null
+    }
+  },
+  emits: [
+    /**
+     * Emitted when tooltip is shown or hidden
+     *
+     * @event shown
+     * @type {Boolean}
+     */
+    "shown",
+    /**
+     * Sync show value
+     *
+     * @event update:show
+     */
+    "update:show"
+  ],
+  data() {
+    return {
+      TOOLTIP_KIND_MODIFIERS: popover_constants.TOOLTIP_KIND_MODIFIERS,
+      hasSlotContent: common_utils.hasSlotContent,
+      tip: null,
+      inTimer: null,
+      // Internal state for whether the tooltip is shown. Changing the prop
+      // will update this.
+      isShown: false,
+      // this is where the placement currently is, this can be different than
+      // the placement prop when there is not enough available room for the tip
+      // to display and it uses a fallback placement.
+      currentPlacement: this.placement,
+      // flag check touch based device
+      isTouchDevice: false
+    };
+  },
+  computed: {
+    // whether the tooltip is visible or not.
+    isVisible() {
+      var _a, _b;
+      const hasMessage = !!((_a = this.message) == null ? void 0 : _a.trim());
+      const hasDefaultSlot = !!((_b = this.$slots) == null ? void 0 : _b.default);
+      const isDeviceCompatible = !this.isTouchDevice;
+      const shouldBeVisible = this.isShown && this.enabled && (hasMessage || hasDefaultSlot);
+      return shouldBeVisible && isDeviceCompatible;
+    },
+    tooltipListeners() {
+      return {
+        "after-leave": () => {
+          this.onLeaveTransitionComplete();
+        },
+        "after-enter": () => {
+          this.onEnterTransitionComplete();
+        }
+      };
+    },
+    tippyProps() {
+      return {
+        offset: this.offset,
+        interactive: false,
+        trigger: "manual",
+        placement: this.placement,
+        sticky: this.sticky,
+        popperOptions: popover_constants.getPopperOptions({
+          fallbackPlacements: this.fallbackPlacements,
+          hasHideModifierEnabled: true,
+          onChangePlacement: this.onChangePlacement
+        })
+      };
+    },
+    anchor() {
+      return this.externalAnchor ? document.body.querySelector(this.externalAnchor) : popover_constants.getAnchor(this.$refs.anchor);
+    }
+  },
+  watch: {
+    tippyProps: {
+      handler: "setProps",
+      deep: true
+    },
+    show: {
+      handler: function(show) {
+        if (show !== null) {
+          this.isShown = show;
+        }
+      },
+      immediate: true
+    },
+    isShown(isShown) {
+      if (isShown) {
+        this.setProps();
+        this.tip.show();
+      } else {
+        this.tip.hide();
+      }
+    },
+    sticky(sticky) {
+      this.tip.setProps({
+        sticky
+      });
+    }
+  },
+  mounted() {
+    if (!this.enabled && this.show != null) {
+      console.warn("Tooltip: You cannot use both the enabled and show props at the same time.");
+      console.warn("The show prop will be ignored.");
+    }
+    this.externalAnchor && this.addExternalAnchorEventListeners();
+    this.tip = popover_constants.createTippy(this.anchor, this.initOptions());
+    if (this.isShown) {
+      this.tip.show();
+    }
+  },
+  beforeUnmount() {
+    var _a;
+    this.externalAnchor && this.removeExternalAnchorEventListeners();
+    if (this.tip) {
+      (_a = this.tip) == null ? void 0 : _a.destroy();
+    }
+  },
+  methods: {
+    calculateAnchorZindex() {
+      if (this.$el.getRootNode().querySelector('.d-modal[aria-hidden="false"], .d-modal--transparent[aria-hidden="false"]') || // Special case because we don't have any dialtone drawer component yet. Render at 651 when
+      // anchor of popover is within a drawer.
+      this.$el.closest(".d-zi-drawer")) {
+        return 651;
+      } else {
+        return 400;
+      }
+    },
+    hasVisibleFocus() {
+      return this.anchor.matches(":focus-visible");
+    },
+    onEnterAnchor(e) {
+      if (this.isTouchDevice && !e.relatedTarget)
+        return;
+      if (this.delay) {
+        this.inTimer = setTimeout((function(event) {
+          this.triggerShow(event);
+        }).bind(this, e), popover_constants.TOOLTIP_DELAY_MS);
+      } else {
+        this.triggerShow(e);
+      }
+      this.isTouchDevice = false;
+    },
+    triggerShow(e) {
+      if (e.type === "focusin") {
+        if (this.show === null && this.hasVisibleFocus()) {
+          this.isShown = true;
+        }
+      } else {
+        if (this.show === null)
+          this.isShown = true;
+      }
+    },
+    onLeaveAnchor(e) {
+      if (e.type === "keydown" && e.code !== "Escape")
+        return;
+      clearTimeout(this.inTimer);
+      this.triggerHide();
+    },
+    triggerHide() {
+      if (this.show === null)
+        this.isShown = false;
+    },
+    onChangePlacement(placement) {
+      this.currentPlacement = placement;
+    },
+    onLeaveTransitionComplete() {
+      var _a;
+      (_a = this.tip) == null ? void 0 : _a.unmount();
+      this.$emit("shown", false);
+      if (this.show !== null) {
+        this.$emit("update:show", false);
+      }
+    },
+    onEnterTransitionComplete() {
+      this.$emit("shown", true);
+      if (this.show !== null) {
+        this.$emit("update:show", true);
+      }
+    },
+    setProps() {
+      var _a, _b;
+      if (this.tip && this.tip.setProps) {
+        this.tip.setProps({
+          ...this.tippyProps,
+          zIndex: this.calculateAnchorZindex(),
+          appendTo: this.appendTo === "body" ? (_b = (_a = this.anchor) == null ? void 0 : _a.getRootNode()) == null ? void 0 : _b.querySelector("body") : this.appendTo
+        });
+      }
+    },
+    onMount() {
+      this.setProps();
+    },
+    initOptions() {
+      return {
+        contentElement: this.$refs.content.$el,
+        allowHTML: true,
+        zIndex: this.calculateAnchorZindex(),
+        onMount: this.onMount,
+        ...this.tippyProps
+      };
+    },
+    addExternalAnchorEventListeners() {
+      ["focusin", "mouseenter"].forEach((listener) => {
+        this.anchor.addEventListener(listener, (event) => this.onEnterAnchor(event));
+      });
+      ["focusout", "mouseleave", "keydown"].forEach((listener) => {
+        this.anchor.addEventListener(listener, (event) => this.onLeaveAnchor(event));
+      });
+    },
+    removeExternalAnchorEventListeners() {
+      ["focusin", "mouseenter"].forEach((listener) => {
+        this.anchor.removeEventListener(listener, (event) => this.onEnterAnchor(event));
+      });
+      ["focusout", "mouseleave", "keydown"].forEach((listener) => {
+        this.anchor.removeEventListener(listener, (event) => this.onLeaveAnchor(event));
+      });
+    },
+    onTouchStart() {
+      this.isTouchDevice = true;
+    }
+  }
+};
+const _hoisted_1 = { "data-qa": "dt-tooltip-container" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_dt_lazy_show = vue.resolveComponent("dt-lazy-show");
+  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+    !$props.externalAnchor ? (vue.openBlock(), vue.createElementBlock("span", {
+      key: 0,
+      ref: "anchor",
+      "data-qa": "dt-tooltip-anchor",
+      onFocusin: _cache[0] || (_cache[0] = (...args) => $options.onEnterAnchor && $options.onEnterAnchor(...args)),
+      onFocusout: _cache[1] || (_cache[1] = (...args) => $options.onLeaveAnchor && $options.onLeaveAnchor(...args)),
+      onMouseenter: _cache[2] || (_cache[2] = (...args) => $options.onEnterAnchor && $options.onEnterAnchor(...args)),
+      onMouseleave: _cache[3] || (_cache[3] = (...args) => $options.onLeaveAnchor && $options.onLeaveAnchor(...args)),
+      onKeydown: _cache[4] || (_cache[4] = vue.withKeys((...args) => $options.onLeaveAnchor && $options.onLeaveAnchor(...args), ["esc"])),
+      onTouchstart: _cache[5] || (_cache[5] = (...args) => $options.onTouchStart && $options.onTouchStart(...args))
+    }, [
+      vue.renderSlot(_ctx.$slots, "anchor")
+    ], 544)) : vue.createCommentVNode("", true),
+    vue.createVNode(_component_dt_lazy_show, vue.mergeProps({
+      id: $props.id,
+      ref: "content",
+      show: $options.isVisible,
+      role: "tooltip",
+      "aria-hidden": "false",
+      "data-qa": "dt-tooltip",
+      appear: $props.contentAppear,
+      transition: $props.transition,
+      class: [
+        "d-tooltip",
+        `d-tooltip__arrow-tippy--${$data.currentPlacement}`,
+        {
+          [$data.TOOLTIP_KIND_MODIFIERS.inverted]: $props.inverted
+        },
+        $props.contentClass
+      ]
+    }, vue.toHandlers($options.tooltipListeners)), {
+      default: vue.withCtx(() => [
+        vue.renderSlot(_ctx.$slots, "default", {}, () => [
+          vue.createTextVNode(vue.toDisplayString($props.message), 1)
+        ])
+      ]),
+      _: 3
+    }, 16, ["id", "show", "appear", "transition", "class"])
+  ]);
+}
+const DtTooltip = /* @__PURE__ */ _pluginVue_exportHelper._export_sfc(_sfc_main, [["render", _sfc_render]]);
+exports.TOOLTIP_DELAY_MS = popover_constants.TOOLTIP_DELAY_MS;
+exports.TOOLTIP_DIRECTIONS = popover_constants.TOOLTIP_DIRECTIONS;
+exports.TOOLTIP_HIDE_ON_CLICK_VARIANTS = popover_constants.TOOLTIP_HIDE_ON_CLICK_VARIANTS;
+exports.TOOLTIP_KIND_MODIFIERS = popover_constants.TOOLTIP_KIND_MODIFIERS;
+exports.TOOLTIP_STICKY_VALUES = popover_constants.TOOLTIP_STICKY_VALUES;
+exports.DtTooltip = DtTooltip;
 //# sourceMappingURL=tooltip.cjs.map

package/dist/lib/tooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.cjs","sources":["../../components/tooltip/tooltip.vue"],"sourcesContent":["<template>\n  <div data-qa=\"dt-tooltip-container\">\n    <!-- disabling as the below events are for capturing events from interactive\n         elements within the span rather than on the span itself -->\n    <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n    <span\n      v-if=\"!externalAnchor\"\n      ref=\"anchor\"\n      data-qa=\"dt-tooltip-anchor\"\n      @focusin=\"onEnterAnchor\"\n      @focusout=\"onLeaveAnchor\"\n      @mouseenter=\"onEnterAnchor\"\n      @mouseleave=\"onLeaveAnchor\"\n      @keydown.esc=\"onLeaveAnchor\"\n      @touchstart=\"onTouchStart\"\n    >\n      <!-- @slot Slot for the anchor element -->\n      <slot\n        name=\"anchor\"\n      />\n    </span>\n    <dt-lazy-show\n      :id=\"id\"\n      ref=\"content\"\n      :show=\"isVisible\"\n      role=\"tooltip\"\n      aria-hidden=\"false\"\n      data-qa=\"dt-tooltip\"\n      :appear=\"contentAppear\"\n      :transition=\"transition\"\n      :class=\"[\n        'd-tooltip',\n        `d-tooltip__arrow-tippy--${currentPlacement}`,\n        {\n          [ TOOLTIP_KIND_MODIFIERS.inverted ]: inverted,\n        },\n        contentClass,\n      ]\"\n      v-on=\"tooltipListeners\"\n    >\n      <!-- In case when transitionend event doesn't work correct (for ex. tooltip component with custom trigger) -->\n      <!-- after-leave event can be used instead of transitionend -->\n      <!-- @slot Slot for the content, defaults to message prop -->\n      <slot>\n        {{ message }}\n      </slot>\n    </dt-lazy-show>\n  </div>\n</template>\n\n<script>\nimport {\n  TOOLTIP_KIND_MODIFIERS,\n  TOOLTIP_DIRECTIONS,\n  TOOLTIP_STICKY_VALUES,\n  TOOLTIP_DELAY_MS,\n} from './tooltip_constants.js';\nimport {\n  POPOVER_APPEND_TO_VALUES,\n} from '../popover/popover_constants';\nimport { getUniqueString, hasSlotContent } from '@/common/utils';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport {\n  createTippy,\n  getAnchor,\n  getPopperOptions,\n} from '@/components/popover/tippy_utils';\n\n/**\n * A tooltip is a floating label that briefly explains an action, function, or an element.\n * Its content is exclusively text and shouldn't be vital information for users.\n * If richer media is desired, consider using a popover instead.\n * @see https://dialtone.dialpad.com/components/tooltip.html\n */\nexport default {\n  name: 'DtTooltip',\n  components: {\n    DtLazyShow,\n  },\n\n  props: {\n    /**\n     * The id of the tooltip\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * If the popover does not fit in the direction described by \"placement\",\n     * it will attempt to change its direction to the \"fallbackPlacements\"\n     * if defined, otherwise it will automatically position to a new location\n     * as it sees best fit. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => ['auto'],\n    },\n\n    /**\n     * If true, applies inverted styles to the tooltip\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     *  Displaces the tooltip from its reference element\n     *  by the specified number of pixels. See\n     *  <a\n     *    class=\"d-link\"\n     *    href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n     *    target=\"_blank\"\n     *  >\n     *    Tippy.js docs\n     *  </a>\n     */\n    offset: {\n      type: Array,\n      default: () => [0, -4],\n    },\n\n    /**\n     * The direction the popover displays relative to the anchor. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values top, top-start, top-end,\n     * right, right-start, right-end,\n     * left, left-start, left-end,\n     * bottom, bottom-start, bottom-end,\n     * auto, auto-start, auto-end\n     */\n    placement: {\n      type: String,\n      default: 'top',\n      validator (placement) {\n        return TOOLTIP_DIRECTIONS.includes(placement);\n      },\n    },\n\n    /**\n     * If the tooltip sticks to the anchor. This is usually not needed, but can be needed\n     * if the reference element's position is animating, or to automatically update the popover\n     * position in those cases the DOM layout changes the reference element's position.\n     * `true` enables it, `reference` only checks the \"reference\" rect for changes and `popper` only\n     * checks the \"popper\" rect for changes. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#sticky\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values true, false, reference, popper\n     */\n    sticky: {\n      type: [Boolean, String],\n      default: false,\n      validator: (sticky) => {\n        return TOOLTIP_STICKY_VALUES.includes(sticky);\n      },\n    },\n\n    /**\n     * Sets the element to which the tooltip is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * This prop is not reactive, must be set on initial render.\n     * @values 'body', 'parent', HTMLElement,\n     */\n    appendTo: {\n      type: [HTMLElement, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n\n    /**\n     * Additional css classes for the tooltip content element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    contentClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * A provided message for the tooltip content\n     */\n    message: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Controls whether hover/focus causes the tooltip to appear.\n     * Cannot be combined with the show prop. show value will be ignored.\n     * by default this is true, if you override with false, the tooltip will never show up.\n     */\n    enabled: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls whether the tooltip is shown. Leaving this null will have the tooltip trigger on mouseover by default.\n     * If you set this value, the default mouseover behavior will be disabled and you can control it as you need.\n     * Supports .sync modifier\n     * @values null, true, false\n     */\n    show: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n\n    /**\n     * Whether to apply transition on initial render in the content lazy show component.\n     * @values true, false\n     */\n    contentAppear: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether the tooltip will have a delay when being focused or moused over.\n     * @values true, false\n     */\n    delay: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * External anchor id to use in those cases the anchor can't be provided via the slot.\n     * For instance, using the combobox's input as the anchor for the popover.\n     */\n    externalAnchor: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Emitted when tooltip is shown or hidden\n     *\n     * @event shown\n     * @type {Boolean}\n     */\n    'shown',\n\n    /**\n     * Sync show value\n     *\n     * @event update:show\n     */\n    'update:show',\n  ],\n\n  data () {\n    return {\n      TOOLTIP_KIND_MODIFIERS,\n      hasSlotContent,\n      tip: null,\n\n      inTimer: null,\n\n      // Internal state for whether the tooltip is shown. Changing the prop\n      // will update this.\n      isShown: false,\n\n      // this is where the placement currently is, this can be different than\n      // the placement prop when there is not enough available room for the tip\n      // to display and it uses a fallback placement.\n      currentPlacement: this.placement,\n\n      // flag check touch based device\n      isTouchDevice: false,\n    };\n  },\n\n  computed: {\n    // whether the tooltip is visible or not.\n    isVisible () {\n      const hasMessage = !!this.message?.trim();\n      const hasDefaultSlot = !!this.$slots?.default;\n      const isDeviceCompatible = !this.isTouchDevice;\n\n      const shouldBeVisible = this.isShown && this.enabled && (hasMessage || hasDefaultSlot);\n\n      return shouldBeVisible && isDeviceCompatible;\n    },\n\n    tooltipListeners () {\n      return {\n        'after-leave': () => {\n          this.onLeaveTransitionComplete();\n        },\n\n        'after-enter': () => {\n          this.onEnterTransitionComplete();\n        },\n      };\n    },\n\n    tippyProps () {\n      return {\n        offset: this.offset,\n        interactive: false,\n        trigger: 'manual',\n        placement: this.placement,\n        sticky: this.sticky,\n        popperOptions: getPopperOptions({\n          fallbackPlacements: this.fallbackPlacements,\n          hasHideModifierEnabled: true,\n          onChangePlacement: this.onChangePlacement,\n        }),\n      };\n    },\n\n    anchor () {\n      return this.externalAnchor ? document.body.querySelector(this.externalAnchor) : getAnchor(this.$refs.anchor);\n    },\n  },\n\n  watch: {\n\n    tippyProps: {\n      handler: 'setProps',\n      deep: true,\n    },\n\n    show: {\n      handler: function (show) {\n        if (show !== null) {\n          this.isShown = show;\n        }\n      },\n\n      immediate: true,\n    },\n\n    isShown (isShown) {\n      if (isShown) {\n        this.setProps();\n        this.tip.show();\n      } else {\n        this.tip.hide();\n      }\n    },\n\n    sticky (sticky) {\n      this.tip.setProps({\n        sticky,\n      });\n    },\n  },\n\n  mounted () {\n    if (!this.enabled && this.show != null) {\n      console.warn('Tooltip: You cannot use both the enabled and show props at the same time.');\n      console.warn('The show prop will be ignored.');\n    }\n\n    this.externalAnchor && this.addExternalAnchorEventListeners();\n    this.tip = createTippy(this.anchor, this.initOptions());\n\n    // immediate watcher fires before mounted, so have this here in case\n    // show prop was initially set to true.\n    if (this.isShown) {\n      this.tip.show();\n    }\n  },\n\n  beforeUnmount () {\n    this.externalAnchor && this.removeExternalAnchorEventListeners();\n\n    if (this.tip) {\n      this.tip?.destroy();\n    }\n  },\n\n  methods: {\n    calculateAnchorZindex () {\n      // if a modal is currently active render at modal-element z-index, otherwise at tooltip z-index\n      if (this.$el.getRootNode()\n        .querySelector('.d-modal[aria-hidden=\"false\"], .d-modal--transparent[aria-hidden=\"false\"]') ||\n        // Special case because we don't have any dialtone drawer component yet. Render at 651 when\n        // anchor of popover is within a drawer.\n        this.$el.closest('.d-zi-drawer')) {\n        return 651;\n      } else {\n        return 400;\n      }\n    },\n\n    hasVisibleFocus () {\n      return this.anchor.matches(':focus-visible');\n    },\n\n    onEnterAnchor (e) {\n      // Note: This is to stop the call of mouseenter event when touchstart event is triggered,\n      //       as when triggered by click or touch, the relatedTarget property of MouseEvent is null\n      if (this.isTouchDevice && !e.relatedTarget) return;\n\n      if (this.delay) {\n        this.inTimer = setTimeout(function (event) {\n          this.triggerShow(event);\n        }.bind(this, e), TOOLTIP_DELAY_MS);\n      } else {\n        this.triggerShow(e);\n      }\n\n      // since this method will be trigger by mouse event, updating the flag is non-touch device\n      this.isTouchDevice = false;\n    },\n\n    triggerShow (e) {\n      if (e.type === 'focusin') {\n        // only show tooltips on visible focus when triggered via focus.\n        // when the user is using the mouse they only want tooltips to display\n        // on mouseover.\n        //\n        // Example: anchor of a popover is a button with tooltip.\n        // closing it with the mouse would trigger the tooltip to display as\n        // the anchor is focused on close. Not what we want.\n        if (this.show === null && this.hasVisibleFocus()) {\n          this.isShown = true;\n        }\n      } else {\n        if (this.show === null) this.isShown = true;\n      }\n    },\n\n    onLeaveAnchor (e) {\n      if (e.type === 'keydown' && e.code !== 'Escape') return;\n\n      clearTimeout(this.inTimer);\n      this.triggerHide();\n    },\n\n    triggerHide () {\n      if (this.show === null) this.isShown = false;\n    },\n\n    onChangePlacement (placement) {\n      this.currentPlacement = placement;\n    },\n\n    onLeaveTransitionComplete () {\n      this.tip?.unmount();\n      this.$emit('shown', false);\n      if (this.show !== null) {\n        this.$emit('update:show', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      this.$emit('shown', true);\n      if (this.show !== null) {\n        this.$emit('update:show', true);\n      }\n    },\n\n    setProps () {\n      if (this.tip && this.tip.setProps) {\n        this.tip.setProps({\n          ...this.tippyProps,\n          zIndex: this.calculateAnchorZindex(),\n          appendTo: this.appendTo === 'body' ? this.anchor?.getRootNode()?.querySelector('body') : this.appendTo,\n        });\n      }\n    },\n\n    onMount () {\n      this.setProps();\n    },\n\n    initOptions () {\n      return {\n        contentElement: this.$refs.content.$el,\n        allowHTML: true,\n        zIndex: this.calculateAnchorZindex(),\n        onMount: this.onMount,\n        ...this.tippyProps,\n      };\n    },\n\n    addExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    removeExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    onTouchStart () {\n      this.isTouchDevice = true;\n    },\n  },\n};\n</script>\n\n<style lang=\"less\">\n.tippy-box[data-popper-reference-hidden] {\n  .d-tooltip {\n    visibility: hidden;\n    pointer-events: none;\n  }\n}\n</style>\n"],"names":["_sfc_main","DtLazyShow","getUniqueString","placement","TOOLTIP_DIRECTIONS","sticky","TOOLTIP_STICKY_VALUES","appendTo","POPOVER_APPEND_TO_VALUES","TOOLTIP_KIND_MODIFIERS","hasSlotContent","hasMessage","_a","hasDefaultSlot","_b","isDeviceCompatible","getPopperOptions","getAnchor","show","isShown","createTippy","event","TOOLTIP_DELAY_MS","listener","_hoisted_1","_openBlock","_createElementBlock","$props","$options","args","_renderSlot","_ctx","_createVNode","_component_dt_lazy_show","_mergeProps","$data","_toHandlers"],"mappings":"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"}
+{"version":3,"file":"tooltip.cjs","sources":["../../components/tooltip/tooltip.vue"],"sourcesContent":["<template>\n  <div data-qa=\"dt-tooltip-container\">\n    <!-- disabling as the below events are for capturing events from interactive\n         elements within the span rather than on the span itself -->\n    <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -->\n    <span\n      v-if=\"!externalAnchor\"\n      ref=\"anchor\"\n      data-qa=\"dt-tooltip-anchor\"\n      @focusin=\"onEnterAnchor\"\n      @focusout=\"onLeaveAnchor\"\n      @mouseenter=\"onEnterAnchor\"\n      @mouseleave=\"onLeaveAnchor\"\n      @keydown.esc=\"onLeaveAnchor\"\n      @touchstart=\"onTouchStart\"\n    >\n      <!-- @slot Slot for the anchor element -->\n      <slot\n        name=\"anchor\"\n      />\n    </span>\n    <dt-lazy-show\n      :id=\"id\"\n      ref=\"content\"\n      :show=\"isVisible\"\n      role=\"tooltip\"\n      aria-hidden=\"false\"\n      data-qa=\"dt-tooltip\"\n      :appear=\"contentAppear\"\n      :transition=\"transition\"\n      :class=\"[\n        'd-tooltip',\n        `d-tooltip__arrow-tippy--${currentPlacement}`,\n        {\n          [ TOOLTIP_KIND_MODIFIERS.inverted ]: inverted,\n        },\n        contentClass,\n      ]\"\n      v-on=\"tooltipListeners\"\n    >\n      <!-- In case when transitionend event doesn't work correct (for ex. tooltip component with custom trigger) -->\n      <!-- after-leave event can be used instead of transitionend -->\n      <!-- @slot Slot for the content, defaults to message prop -->\n      <slot>\n        {{ message }}\n      </slot>\n    </dt-lazy-show>\n  </div>\n</template>\n\n<script>\nimport {\n  TOOLTIP_KIND_MODIFIERS,\n  TOOLTIP_DIRECTIONS,\n  TOOLTIP_STICKY_VALUES,\n  TOOLTIP_DELAY_MS,\n} from './tooltip_constants.js';\nimport {\n  POPOVER_APPEND_TO_VALUES,\n} from '../popover/popover_constants';\nimport { getUniqueString, hasSlotContent } from '@/common/utils';\nimport { DtLazyShow } from '@/components/lazy_show';\nimport {\n  createTippy,\n  getAnchor,\n  getPopperOptions,\n} from '@/components/popover/tippy_utils';\n\n/**\n * A tooltip is a floating label that briefly explains an action, function, or an element.\n * Its content is exclusively text and shouldn't be vital information for users.\n * If richer media is desired, consider using a popover instead.\n * @see https://dialtone.dialpad.com/components/tooltip.html\n */\nexport default {\n  name: 'DtTooltip',\n  components: {\n    DtLazyShow,\n  },\n\n  props: {\n    /**\n     * The id of the tooltip\n     */\n    id: {\n      type: String,\n      default () { return getUniqueString(); },\n    },\n\n    /**\n     * If the popover does not fit in the direction described by \"placement\",\n     * it will attempt to change its direction to the \"fallbackPlacements\"\n     * if defined, otherwise it will automatically position to a new location\n     * as it sees best fit. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements\"\n     *   target=\"_blank\"\n     * >\n     *   Popper.js docs\n     * </a>\n     * */\n    fallbackPlacements: {\n      type: Array,\n      default: () => ['auto'],\n    },\n\n    /**\n     * If true, applies inverted styles to the tooltip\n     * @values true, false\n     */\n    inverted: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     *  Displaces the tooltip from its reference element\n     *  by the specified number of pixels. See\n     *  <a\n     *    class=\"d-link\"\n     *    href=\"https://atomiks.github.io/tippyjs/v6/all-props/#offset\"\n     *    target=\"_blank\"\n     *  >\n     *    Tippy.js docs\n     *  </a>\n     */\n    offset: {\n      type: Array,\n      default: () => [0, -4],\n    },\n\n    /**\n     * The direction the popover displays relative to the anchor. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#placement\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values top, top-start, top-end,\n     * right, right-start, right-end,\n     * left, left-start, left-end,\n     * bottom, bottom-start, bottom-end,\n     * auto, auto-start, auto-end\n     */\n    placement: {\n      type: String,\n      default: 'top',\n      validator (placement) {\n        return TOOLTIP_DIRECTIONS.includes(placement);\n      },\n    },\n\n    /**\n     * If the tooltip sticks to the anchor. This is usually not needed, but can be needed\n     * if the reference element's position is animating, or to automatically update the popover\n     * position in those cases the DOM layout changes the reference element's position.\n     * `true` enables it, `reference` only checks the \"reference\" rect for changes and `popper` only\n     * checks the \"popper\" rect for changes. See\n     * <a\n     *   class=\"d-link\"\n     *   href=\"https://atomiks.github.io/tippyjs/v6/all-props/#sticky\"\n     *   target=\"_blank\"\n     * >\n     *   Tippy.js docs\n     * </a>\n     * @values true, false, reference, popper\n     */\n    sticky: {\n      type: [Boolean, String],\n      default: false,\n      validator: (sticky) => {\n        return TOOLTIP_STICKY_VALUES.includes(sticky);\n      },\n    },\n\n    /**\n     * Sets the element to which the tooltip is going to append to.\n     * 'body' will append to the nearest body (supports shadow DOM).\n     * This prop is not reactive, must be set on initial render.\n     * @values 'body', 'parent', HTMLElement,\n     */\n    appendTo: {\n      type: [HTMLElement, String],\n      default: 'body',\n      validator: appendTo => {\n        return POPOVER_APPEND_TO_VALUES.includes(appendTo) ||\n            (appendTo instanceof HTMLElement);\n      },\n    },\n\n    /**\n     * Additional css classes for the tooltip content element.\n     * Can accept all of String, Object, and Array, i.e. has the\n     * same api as Vue's built-in handling of the class attribute.\n     */\n    contentClass: {\n      type: [String, Object, Array],\n      default: '',\n    },\n\n    /**\n     * A provided message for the tooltip content\n     */\n    message: {\n      type: String,\n      default: '',\n    },\n\n    /**\n     * Controls whether hover/focus causes the tooltip to appear.\n     * Cannot be combined with the show prop. show value will be ignored.\n     * by default this is true, if you override with false, the tooltip will never show up.\n     */\n    enabled: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * Controls whether the tooltip is shown. Leaving this null will have the tooltip trigger on mouseover by default.\n     * If you set this value, the default mouseover behavior will be disabled and you can control it as you need.\n     * Supports .sync modifier\n     * @values null, true, false\n     */\n    show: {\n      type: Boolean,\n      default: null,\n    },\n\n    /**\n     * Named transition when the content display is toggled.\n     * @see DtLazyShow\n     */\n    transition: {\n      type: String,\n      default: 'fade',\n    },\n\n    /**\n     * Whether to apply transition on initial render in the content lazy show component.\n     * @values true, false\n     */\n    contentAppear: {\n      type: Boolean,\n      default: false,\n    },\n\n    /**\n     * Whether the tooltip will have a delay when being focused or moused over.\n     * @values true, false\n     */\n    delay: {\n      type: Boolean,\n      default: true,\n    },\n\n    /**\n     * External anchor id to use in those cases the anchor can't be provided via the slot.\n     * For instance, using the combobox's input as the anchor for the popover.\n     */\n    externalAnchor: {\n      type: String,\n      default: null,\n    },\n  },\n\n  emits: [\n    /**\n     * Emitted when tooltip is shown or hidden\n     *\n     * @event shown\n     * @type {Boolean}\n     */\n    'shown',\n\n    /**\n     * Sync show value\n     *\n     * @event update:show\n     */\n    'update:show',\n  ],\n\n  data () {\n    return {\n      TOOLTIP_KIND_MODIFIERS,\n      hasSlotContent,\n      tip: null,\n\n      inTimer: null,\n\n      // Internal state for whether the tooltip is shown. Changing the prop\n      // will update this.\n      isShown: false,\n\n      // this is where the placement currently is, this can be different than\n      // the placement prop when there is not enough available room for the tip\n      // to display and it uses a fallback placement.\n      currentPlacement: this.placement,\n\n      // flag check touch based device\n      isTouchDevice: false,\n    };\n  },\n\n  computed: {\n    // whether the tooltip is visible or not.\n    isVisible () {\n      const hasMessage = !!this.message?.trim();\n      const hasDefaultSlot = !!this.$slots?.default;\n      const isDeviceCompatible = !this.isTouchDevice;\n\n      const shouldBeVisible = this.isShown && this.enabled && (hasMessage || hasDefaultSlot);\n\n      return shouldBeVisible && isDeviceCompatible;\n    },\n\n    tooltipListeners () {\n      return {\n        'after-leave': () => {\n          this.onLeaveTransitionComplete();\n        },\n\n        'after-enter': () => {\n          this.onEnterTransitionComplete();\n        },\n      };\n    },\n\n    tippyProps () {\n      return {\n        offset: this.offset,\n        interactive: false,\n        trigger: 'manual',\n        placement: this.placement,\n        sticky: this.sticky,\n        popperOptions: getPopperOptions({\n          fallbackPlacements: this.fallbackPlacements,\n          hasHideModifierEnabled: true,\n          onChangePlacement: this.onChangePlacement,\n        }),\n      };\n    },\n\n    anchor () {\n      return this.externalAnchor ? document.body.querySelector(this.externalAnchor) : getAnchor(this.$refs.anchor);\n    },\n  },\n\n  watch: {\n\n    tippyProps: {\n      handler: 'setProps',\n      deep: true,\n    },\n\n    show: {\n      handler: function (show) {\n        if (show !== null) {\n          this.isShown = show;\n        }\n      },\n\n      immediate: true,\n    },\n\n    isShown (isShown) {\n      if (isShown) {\n        this.setProps();\n        this.tip.show();\n      } else {\n        this.tip.hide();\n      }\n    },\n\n    sticky (sticky) {\n      this.tip.setProps({\n        sticky,\n      });\n    },\n  },\n\n  mounted () {\n    if (!this.enabled && this.show != null) {\n      console.warn('Tooltip: You cannot use both the enabled and show props at the same time.');\n      console.warn('The show prop will be ignored.');\n    }\n\n    this.externalAnchor && this.addExternalAnchorEventListeners();\n    this.tip = createTippy(this.anchor, this.initOptions());\n\n    // immediate watcher fires before mounted, so have this here in case\n    // show prop was initially set to true.\n    if (this.isShown) {\n      this.tip.show();\n    }\n  },\n\n  beforeUnmount () {\n    this.externalAnchor && this.removeExternalAnchorEventListeners();\n\n    if (this.tip) {\n      this.tip?.destroy();\n    }\n  },\n\n  methods: {\n    calculateAnchorZindex () {\n      // if a modal is currently active render at modal-element z-index, otherwise at tooltip z-index\n      if (this.$el.getRootNode()\n        .querySelector('.d-modal[aria-hidden=\"false\"], .d-modal--transparent[aria-hidden=\"false\"]') ||\n        // Special case because we don't have any dialtone drawer component yet. Render at 651 when\n        // anchor of popover is within a drawer.\n        this.$el.closest('.d-zi-drawer')) {\n        return 651;\n      } else {\n        return 400;\n      }\n    },\n\n    hasVisibleFocus () {\n      return this.anchor.matches(':focus-visible');\n    },\n\n    onEnterAnchor (e) {\n      // Note: This is to stop the call of mouseenter event when touchstart event is triggered,\n      //       as when triggered by click or touch, the relatedTarget property of MouseEvent is null\n      if (this.isTouchDevice && !e.relatedTarget) return;\n\n      if (this.delay) {\n        this.inTimer = setTimeout(function (event) {\n          this.triggerShow(event);\n        }.bind(this, e), TOOLTIP_DELAY_MS);\n      } else {\n        this.triggerShow(e);\n      }\n\n      // since this method will be trigger by mouse event, updating the flag is non-touch device\n      this.isTouchDevice = false;\n    },\n\n    triggerShow (e) {\n      if (e.type === 'focusin') {\n        // only show tooltips on visible focus when triggered via focus.\n        // when the user is using the mouse they only want tooltips to display\n        // on mouseover.\n        //\n        // Example: anchor of a popover is a button with tooltip.\n        // closing it with the mouse would trigger the tooltip to display as\n        // the anchor is focused on close. Not what we want.\n        if (this.show === null && this.hasVisibleFocus()) {\n          this.isShown = true;\n        }\n      } else {\n        if (this.show === null) this.isShown = true;\n      }\n    },\n\n    onLeaveAnchor (e) {\n      if (e.type === 'keydown' && e.code !== 'Escape') return;\n\n      clearTimeout(this.inTimer);\n      this.triggerHide();\n    },\n\n    triggerHide () {\n      if (this.show === null) this.isShown = false;\n    },\n\n    onChangePlacement (placement) {\n      this.currentPlacement = placement;\n    },\n\n    onLeaveTransitionComplete () {\n      this.tip?.unmount();\n      this.$emit('shown', false);\n      if (this.show !== null) {\n        this.$emit('update:show', false);\n      }\n    },\n\n    onEnterTransitionComplete () {\n      this.$emit('shown', true);\n      if (this.show !== null) {\n        this.$emit('update:show', true);\n      }\n    },\n\n    setProps () {\n      if (this.tip && this.tip.setProps) {\n        this.tip.setProps({\n          ...this.tippyProps,\n          zIndex: this.calculateAnchorZindex(),\n          appendTo: this.appendTo === 'body' ? this.anchor?.getRootNode()?.querySelector('body') : this.appendTo,\n        });\n      }\n    },\n\n    onMount () {\n      this.setProps();\n    },\n\n    initOptions () {\n      return {\n        contentElement: this.$refs.content.$el,\n        allowHTML: true,\n        zIndex: this.calculateAnchorZindex(),\n        onMount: this.onMount,\n        ...this.tippyProps,\n      };\n    },\n\n    addExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.addEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    removeExternalAnchorEventListeners () {\n      ['focusin', 'mouseenter'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onEnterAnchor(event));\n      });\n      ['focusout', 'mouseleave', 'keydown'].forEach(listener => {\n        this.anchor.removeEventListener(listener, (event) => this.onLeaveAnchor(event));\n      });\n    },\n\n    onTouchStart () {\n      this.isTouchDevice = true;\n    },\n  },\n};\n</script>\n\n<style lang=\"less\">\n.tippy-box[data-popper-reference-hidden] {\n  .d-tooltip {\n    visibility: hidden;\n    pointer-events: none;\n  }\n}\n</style>\n"],"names":["DtLazyShow","getUniqueString","TOOLTIP_DIRECTIONS","TOOLTIP_STICKY_VALUES","POPOVER_APPEND_TO_VALUES","TOOLTIP_KIND_MODIFIERS","hasSlotContent","getPopperOptions","getAnchor","createTippy","TOOLTIP_DELAY_MS","_openBlock","_createElementBlock","_renderSlot","_createVNode","_mergeProps","_toHandlers"],"mappings":"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"}