@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
34 lines (33 loc) • 1.12 kB
JavaScript
import { defineComponent as i, ref as s, onMounted as u, onUnmounted as v } from "vue";
const d = i({
name: "NeonSwiper",
props: {
/**
* Display fade in / fade out styling when there is an overflow.
*/
fade: { type: Boolean, default: !0 }
},
setup() {
const e = s(null), t = s(!1), a = s(!1), n = s(!1), o = () => {
e.value ? (a.value = e.value.scrollLeft <= 0, n.value = e.value.scrollLeft + e.value.clientWidth > e.value.scrollWidth - 1) : (a.value = !1, n.value = !1);
}, r = () => {
e.value ? t.value = e.value.scrollWidth > e.value.clientWidth : t.value = !1, o();
};
return u(() => {
var l;
window.addEventListener("resize", r, { passive: !0 }), (l = e.value) == null || l.addEventListener("scroll", o, { passive: !0 }), r();
}), v(() => {
var l;
window.removeEventListener("resize", r), (l = e.value) == null || l.removeEventListener("scroll", o);
}), {
isOverflowing: t,
isScrollStart: a,
isScrollEnd: n,
scrollable: e
};
}
});
export {
d as default
};
//# sourceMappingURL=NeonSwiper.es.js.map