import { flushPromises as e, getUniqueString as t, hasSlotContent as n, returnFirstEl as r, warnIfUnmounted as i } from "../../common/utils/index.js";
import { t as a } from "../../_plugin-vue_export-helper-BTgDAbhb.js";
import { createTippy as o, getAnchor as s, getPopperOptions as c } from "../popover/tippy-utils.js";
import { TOOLTIP_DIRECTIONS as l, TOOLTIP_KIND_MODIFIERS as u, TOOLTIP_STICKY_VALUES as d } from "./tooltip-constants.js";
import { POPOVER_APPEND_TO_VALUES as f } from "../popover/popover-constants.js";
import { createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, normalizeClass as _, openBlock as v, renderSlot as y, toDisplayString as b, withKeys as x } from "vue";
//#region components/tooltip/tooltip.vue
var S = {
	compatConfig: { MODE: 3 },
	name: "DtTooltip",
	props: {
		id: {
			type: String,
			default() {
				return t();
			}
		},
		fallbackPlacements: {
			type: Array,
			default: () => ["auto"]
		},
		inverted: {
			type: Boolean,
			default: !1
		},
		offset: {
			type: Array,
			default: () => [0, 12]
		},
		placement: {
			type: String,
			default: "top",
			validator(e) {
				return l.includes(e);
			}
		},
		sticky: {
			type: [Boolean, String],
			default: !0,
			validator: (e) => d.includes(e)
		},
		appendTo: {
			type: [HTMLElement, String],
			default: "body",
			validator: (e) => f.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: Boolean,
			default: !0
		},
		delay: {
			type: Boolean,
			default: !0
		},
		theme: {
			type: String,
			default: null
		},
		externalAnchor: {
			type: String,
			default: null
		},
		externalAnchorElement: {
			type: HTMLElement,
			default: null
		}
	},
	emits: ["shown", "update:show"],
	data() {
		return {
			TOOLTIP_KIND_MODIFIERS: u,
			hasSlotContent: n,
			tip: null,
			inTimer: null,
			internalShow: !1,
			currentPlacement: this.placement
		};
	},
	computed: {
		tippyProps() {
			return {
				offset: this.offset,
				delay: this.delay ? 300 : !1,
				placement: this.placement,
				sticky: this.sticky,
				theme: this.inverted ? "inverted" : this.theme,
				animation: this.transition ? "fade" : !1,
				onShown: (e) => this.onShow(e, "onShown"),
				onShow: (e) => this.onShow(e, "onShow"),
				onHidden: this.onHide,
				popperOptions: c({
					fallbackPlacements: this.fallbackPlacements,
					hasHideModifierEnabled: !0,
					onChangePlacement: this.onChangePlacement
				})
			};
		},
		anchor() {
			return this.externalAnchorElement ? this.externalAnchorElement : this.externalAnchor ? document.body.querySelector(this.externalAnchor) : s(this.$refs.anchor);
		}
	},
	watch: {
		tippyProps: {
			handler: "setProps",
			deep: !0
		},
		show: {
			handler: function(e) {
				e !== null && this.enabled && (this.internalShow = e);
			},
			immediate: !0
		},
		internalShow(e) {
			!this.tip || !this.anchor || (e ? (this.setProps(), this.tip.show()) : this.tip.hide());
		},
		sticky(e) {
			this.tip.setProps({ sticky: e });
		}
	},
	async 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.tip = o(this.anchor, this.initOptions()), (this.externalAnchor || this.externalAnchorElement) && (await e(), this.addExternalAnchorEventListeners()), i(r(this.$el), this.$options.name);
	},
	beforeUnmount() {
		(this.externalAnchor || this.externalAnchorElement) && this.removeExternalAnchorEventListeners(), this.anchor?._tippy && this.tip?.destroy();
	},
	methods: {
		calculateAnchorZindex() {
			return r(this.$el).getRootNode().querySelector(".d-modal[aria-hidden=\"false\"],\n          .d-modal--transparent[aria-hidden=\"false\"],\n          .d-modal:not([aria-hidden]),\n          .d-modal--transparent:not([aria-hidden])") || r(this.$el).closest(".d-zi-drawer") ? 651 : 400;
		},
		hasVisibleFocus() {
			return this.anchor.matches(":focus-visible");
		},
		onEnterAnchor(e) {
			this.enabled && (this.delay && this.inTimer === null ? this.inTimer = setTimeout(() => {
				this.triggerShow(e);
			}, 300) : this.triggerShow(e));
		},
		triggerShow(e) {
			e.type === "focusin" ? this.show === null && this.hasVisibleFocus() && (this.internalShow = !0) : this.show === null && (this.internalShow = !0);
		},
		onLeaveAnchor(e) {
			e.type === "keydown" && e.code !== "Escape" || (clearTimeout(this.inTimer), this.inTimer = null, this.triggerHide());
		},
		triggerHide() {
			this.show === null && (this.internalShow = !1);
		},
		onChangePlacement(e) {
			this.currentPlacement = e;
		},
		onHide() {
			this.tip?.unmount(), this.$emit("shown", !1), this.show !== null && this.$emit("update:show", !1);
		},
		onShow(e, t) {
			if (!this.tooltipHasContent(e)) return !1;
			this.transition && t === "onShow" || (this.$emit("shown", !0), this.show !== null && this.$emit("update:show", !0));
		},
		setProps() {
			!this.tip || !this.tip.setProps || !this.anchor || this.tip && this.tip.setProps && this.tip.setProps({
				...this.tippyProps,
				appendTo: this.appendTo === "body" ? this.anchor?.getRootNode()?.querySelector("body") : this.appendTo,
				zIndex: this.calculateAnchorZindex()
			});
		},
		onMount() {
			this.setProps();
		},
		tooltipHasContent(e) {
			return e.props.content.textContent.trim().length !== 0;
		},
		initOptions() {
			return {
				content: this.$refs.content,
				arrow: "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"7\"><path d=\"M 14.5,7 8,0 1.5,7 Z\"/></svg>",
				duration: 180,
				interactive: !1,
				trigger: "manual",
				hideOnClick: !1,
				touch: !1,
				onMount: this.onMount,
				showOnCreate: this.internalShow,
				popperOptions: c({ hasHideModifierEnabled: !0 })
			};
		},
		addExternalAnchorEventListeners() {
			["focusin", "mouseenter"].forEach((e) => {
				this.anchor?.addEventListener(e, (e) => this.onEnterAnchor(e));
			}), [
				"focusout",
				"mouseleave",
				"keydown"
			].forEach((e) => {
				this.anchor?.addEventListener(e, (e) => this.onLeaveAnchor(e));
			});
		},
		removeExternalAnchorEventListeners() {
			["focusin", "mouseenter"].forEach((e) => {
				this.anchor?.removeEventListener(e, (e) => this.onEnterAnchor(e));
			}), [
				"focusout",
				"mouseleave",
				"keydown"
			].forEach((e) => {
				this.anchor?.removeEventListener(e, (e) => this.onLeaveAnchor(e));
			});
		}
	}
}, C = { "data-qa": "dt-tooltip-container" }, w = ["id"];
function T(e, t, n, r, i, a) {
	return v(), m("div", C, [!n.externalAnchor && !n.externalAnchorElement ? (v(), m("span", {
		key: 0,
		ref: "anchor",
		"data-qa": "dt-tooltip-anchor",
		onFocusin: t[0] || (t[0] = (...e) => a.onEnterAnchor && a.onEnterAnchor(...e)),
		onFocusout: t[1] || (t[1] = (...e) => a.onLeaveAnchor && a.onLeaveAnchor(...e)),
		onMouseenter: t[2] || (t[2] = (...e) => a.onEnterAnchor && a.onEnterAnchor(...e)),
		onMouseleave: t[3] || (t[3] = (...e) => a.onLeaveAnchor && a.onLeaveAnchor(...e)),
		onKeydown: t[4] || (t[4] = x((...e) => a.onLeaveAnchor && a.onLeaveAnchor(...e), ["esc"]))
	}, [y(e.$slots, "anchor")], 544)) : p("", !0), h("div", {
		id: n.id,
		ref: "content",
		"data-qa": "dt-tooltip",
		class: _([
			"d-tooltip",
			{ [i.TOOLTIP_KIND_MODIFIERS.inverted]: n.inverted },
			n.contentClass
		])
	}, [y(e.$slots, "default", {}, () => [g(b(n.message), 1)])], 10, w)]);
}
var E = /* @__PURE__ */ a(S, [["render", T]]);
//#endregion
export { E as default };

//# sourceMappingURL=tooltip.js.map