adverich-kun-ui
Version:
Una librería de componentes Vue.js con Tailwind CSS
32 lines (31 loc) • 1.55 kB
JavaScript
const x = ({ trackRef: r, thumbs: c, props: e, emit: o }) => {
const m = (a) => {
const n = r.value.getBoundingClientRect(), t = e.vertical ? (a.clientY - n.top) / n.height : (a.clientX - n.left) / n.width;
return Math.min(1, Math.max(0, e.vertical ? 1 - t : t));
}, d = (a) => {
const n = e.min + a * (e.max - e.min), t = Math.round((n - e.min) / e.step) * e.step + e.min;
return Math.min(e.max, Math.max(e.min, t));
};
return { onPointerDown: (a, n) => {
if (a.preventDefault(), e.disabled || e.range && (n === 0 && newVal > c.value[1] || n === 1 && newVal < c.value[0]))
return;
const t = (l) => {
const v = m(l), s = d(v), u = [...c.value];
u[n] = Math.min(e.max, Math.max(e.min, s)), o("update:modelValue", e.range ? u : u[0]);
}, i = () => {
document.removeEventListener("pointermove", t), document.removeEventListener("pointerup", i);
};
document.addEventListener("pointermove", t), document.addEventListener("pointerup", i);
}, onTrackClick: (a) => {
if (e.disabled) return;
const n = m(a), t = d(n), i = [...c.value], l = e.range ? Math.abs(t - i[0]) < Math.abs(t - i[1]) ? 0 : 1 : 0;
i[l] = Math.min(e.max, Math.max(e.min, t)), o("update:modelValue", e.range ? i : i[0]);
}, onTickClick: (a) => {
if (e.disabled) return;
const n = e.min + a * e.step, t = [...c.value], i = e.range ? Math.abs(n - t[0]) < Math.abs(n - t[1]) ? 0 : 1 : 0;
t[i] = n, o("update:modelValue", e.range ? t : t[0]);
} };
};
export {
x as useSliderInteractions
};