import { scrollIntoView as e } from "../../helpers/dom.js";
import { useElementPosition as t } from "../../composition/usePosition.js";
import { Teleport as n, createBlock as r, createElementVNode as i, defineComponent as a, mergeProps as o, openBlock as s, reactive as c, ref as l, renderSlot as u, toRef as d, watch as f, withModifiers as p } from "vue";
import { tapIf as m } from "@milaboratories/helpers";
var h = /* @__PURE__ */ a({
	__name: "DropdownOverlay",
	props: {
		root: {},
		gap: {}
	},
	setup(a, { expose: h }) {
		let g = a, _ = c({ optionsHeight: 0 }), v = c({
			top: void 0,
			bottom: void 0,
			left: "0px",
			width: "0px"
		}), y = d(g, "root"), b = l();
		return h({
			scrollIntoActive: () => {
				let t = b.value;
				t && m(t.querySelector(".hovered-item"), (n) => {
					e(t, n);
				});
			},
			listRef: b
		}), f(b, (e) => {
			e && requestAnimationFrame(() => {
				_.optionsHeight = e.getBoundingClientRect().height, window.dispatchEvent(new CustomEvent("adjust"));
			});
		}), t(y, (e) => {
			let t = document.body.getBoundingClientRect(), n = e.top - t.top, r = e.left - t.left, i = g.gap ?? 0, a = n + e.height + i;
			a + _.optionsHeight > e.clientHeight ? (v.bottom = t.bottom - e.bottom + e.height + i + "px", v.top = void 0) : (v.top = a + "px", v.bottom = void 0), v.left = r + "px", v.width = e.width + "px";
		}), (e, t) => (s(), r(n, { to: "body" }, [i("div", o({
			ref_key: "listRef",
			ref: b
		}, e.$attrs, {
			style: v,
			tabindex: "-1",
			onMousedown: t[0] ||= p(() => {}, ["prevent"]),
			onClick: t[1] ||= p(() => {}, ["stop"])
		}), [u(e.$slots, "default", { ref: "list" })], 16)]));
	}
});
export { h as default };

//# sourceMappingURL=DropdownOverlay.vue2.js.map