import { useEventListener as e } from "../composition/useEventListener.js";
import { eventListener as t } from "../helpers/dom.js";
import { computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, normalizeStyle as s, openBlock as c, ref as l, unref as u } from "vue";
var d = /* @__PURE__ */ o({
	__name: "HScroll",
	props: {
		scrollLeft: {},
		clientWidth: {},
		scrollWidth: {}
	},
	emits: ["update:scrollLeft"],
	setup(o, { emit: d }) {
		let f = d, p = o, m = l(), h = n(() => p.clientWidth / (p.scrollWidth || 1)), g = n(() => h.value < 1), _ = n(() => {
			let e = u(h);
			return {
				left: p.scrollLeft * e + "px",
				width: Math.floor(p.clientWidth * e) + "px"
			};
		});
		return e(m, "pointerdown", (e) => {
			let n = { clientX: e.clientX }, r = t(document, "mousemove", (e) => {
				let t = (e.clientX - n.clientX) / h.value;
				f("update:scrollLeft", p.scrollLeft + t), n.clientX = e.clientX;
			});
			["mouseup", "pointercancel"].forEach((e) => {
				document.addEventListener(e, r, { once: !0 });
			});
		}), (e, t) => g.value ? (c(), i("div", {
			key: 0,
			ref_key: "scrollRef",
			ref: m,
			class: "h-scroll"
		}, [a("div", {
			class: "h-scroll__scrollbar",
			style: s(_.value)
		}, null, 4)], 512)) : r("", !0);
	}
});
export { d as default };

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