vue-virtual-scroller
Version:
Smooth scrolling for any amount of data
1,686 lines (1,685 loc) • 52.1 kB
JavaScript
import { computed as Z, toValue as u, watch as q, nextTick as He, ref as ae, onMounted as ut, onActivated as Ct, onBeforeUnmount as dt, markRaw as en, shallowReactive as tn, reactive as Ft, provide as Ne, onDeactivated as nn, onUnmounted as rn, effectScope as on, shallowRef as Ge, defineComponent as Le, openBlock as oe, createBlock as Ve, resolveDynamicComponent as Ze, withCtx as Te, renderSlot as me, createElementBlock as Re, withDirectives as Vt, unref as K, normalizeClass as Ke, createCommentVNode as Pe, normalizeStyle as ot, Fragment as At, renderList as Et, mergeProps as Qe, toHandlers as ln, createVNode as Dt, createSlots as sn, normalizeProps as cn, guardReactiveProps as an, inject as wt, getCurrentInstance as un, onBeforeUpdate as dn } from "vue";
import fn from "mitt";
function ft(e, n, i) {
if (!i)
return n;
const t = e == null ? void 0 : e[i];
if (t == null)
throw new Error(`Key is ${t} on item (keyField is '${i}')`);
return t;
}
function Fe(e, n) {
return e.map((i, t) => ft(i, t, n));
}
function mn(e, n, i) {
const t = [], l = [];
for (let d = 0; d < e.length; d++) {
const h = e[d], S = ft(h, d, n), v = i(h, d, S);
t.push(S), l.push(typeof v == "number" && v > 0 ? v : null);
}
return {
keys: t,
sizes: l
};
}
function vn(e, n, i) {
if (!e || e.keys.length !== n.length || e.sizes.length !== n.length)
return !1;
for (let t = 0; t < n.length; t++)
if (e.keys[t] !== ft(n[t], t, i))
return !1;
return !0;
}
function lt(e, n, i) {
if (!vn(e, n, i))
return {};
const t = {};
for (let l = 0; l < e.keys.length; l++) {
const d = e.sizes[l];
typeof d == "number" && d > 0 && (t[e.keys[l]] = d);
}
return t;
}
function Ot(e, n) {
if (!e.length || n.length <= e.length)
return 0;
const i = e[0], t = n.indexOf(i);
if (t <= 0 || t + e.length < n.length && e.length > n.length - t)
return 0;
for (let l = 0; l < e.length; l++)
if (n[t + l] !== e[l])
return 0;
return t;
}
function bt(e, n, i, t, l, d = 0) {
const h = l ?? "start";
if (h === "nearest") {
const S = i + t, v = e + n;
return e >= i && v <= S ? null : e < i ? e + d : v - t + d;
}
return h === "end" ? e + n - t + d : h === "center" ? e + (n - t) / 2 + d : e + d;
}
function Bt(e, n, i, t) {
let l = null, d = null, h = null, S = !1, v = null;
const C = [], T = i.resizeObserver ? () => {
} : i.onVscrollUpdate(le), g = Z(() => {
const f = u(e);
if (i.vscrollData.simpleArray) {
if (f.index == null)
throw new Error("index is required when using simple-array mode with dynamic item measurement");
return f.index;
}
if (i.vscrollData.keyField in f.item)
return f.item[i.vscrollData.keyField];
throw new Error(`keyField '${i.vscrollData.keyField}' not found in your item. You should set a valid keyField prop on your Scroller`);
}), A = Z(() => i.vscrollData.sizes[g.value] || 0), X = Z(() => u(e).active && i.vscrollData.active);
function ee() {
X.value ? d !== g.value && (d = g.value, l = null, h = null, te(g.value)) : l = g.value;
}
function Y() {
u(e).watchData && !i.resizeObserver ? v = q(() => u(e).item, () => {
O();
}, {
deep: !0
}) : v && (v(), v = null);
}
function le({ force: f }) {
!X.value && f && (h = g.value), (l === g.value || f || !A.value) && ee();
}
function O() {
ee();
}
function H(f) {
i.undefinedMap[f] && i.undefinedSizeCount.value--, i.undefinedMap[f] = void 0;
}
function G(f, F) {
if (i.vscrollData.sizes[f]) {
H(f);
return;
}
if (F) {
i.undefinedMap[f] || i.undefinedSizeCount.value++, i.undefinedMap[f] = !0;
return;
}
i.undefinedMap[f] && (i.undefinedSizeCount.value--, i.undefinedMap[f] = !1);
}
function te(f) {
He(() => {
if (g.value === f) {
const F = u(n);
if (!F)
return;
const W = F.offsetWidth, E = F.offsetHeight;
se(W, E);
}
d = null;
});
}
function se(f, F) {
const W = ~~(i.direction.value === "vertical" ? F : f);
W && A.value !== W && J(W);
}
function J(f) {
var F, W;
H(g.value), i.vscrollData.sizes[g.value] = f, u(e).emitResize && ((W = (F = u(t)) == null ? void 0 : F.onResize) == null || W.call(F, g.value));
}
function z() {
if (!i.resizeObserver || S)
return;
const f = u(n);
f && (i.resizeObserver.observe(f), f.$_vs_id = g.value, f.$_vs_onResize = re, S = !0);
}
function L() {
if (!i.resizeObserver || !S)
return;
const f = u(n);
f && (i.resizeObserver.unobserve(f), f.$_vs_onResize = void 0, S = !1);
}
function re(f, F, W) {
g.value === f && se(F, W);
}
C.push(q(() => u(e).watchData, () => {
Y();
})), i.resizeObserver || C.push(q(() => u(e).sizeDependencies, () => {
O();
}, {
deep: !0
})), C.push(q(g, (f, F) => {
const W = u(n);
W && (W.$_vs_id = f), H(F), G(f, X.value);
const E = i.vscrollData.sizes[f];
if (!E) {
l = f, O();
return;
}
H(f), S && (i.vscrollData.sizes[f] = E);
})), C.push(q(X, (f) => {
G(g.value, f), i.resizeObserver ? f ? z() : L() : f && h === g.value && ee();
})), Y();
function R() {
X.value && (ee(), z());
}
function Q() {
T(), L(), H(g.value);
const f = u(n);
f && (f.$_vs_id = void 0, f.$_vs_onResize = void 0), v && (v(), v = null);
for (const F of C)
F();
C.length = 0;
}
return {
id: g,
size: A,
finalActive: X,
updateSize: ee,
mount: R,
unmount: Q
};
}
const Pt = {
itemsLimit: 1e3
};
function Ht(e) {
return typeof window < "u" && e === window;
}
const pn = (() => {
if (typeof document > "u")
return "negative";
const e = document.createElement("div"), n = document.createElement("div");
e.style.width = "4px", e.style.height = "1px", e.style.overflow = "auto", e.style.direction = "rtl", n.style.width = "8px", n.style.height = "1px", e.appendChild(n), document.body.appendChild(e), e.scrollLeft = -1;
const i = e.scrollLeft < 0;
return document.body.removeChild(e), i ? "negative" : "default";
})();
function Be(e, n, i) {
return n !== "horizontal" || !i || Ht(i) || getComputedStyle(i).direction !== "rtl" ? e : pn === "negative" ? -e : e;
}
function yn(e, n, i) {
return Be(e, n, i);
}
function nt(e, n, i, t) {
const l = yn(i, n, e), d = !!(t != null && t.smooth);
if (Ht(e)) {
n === "vertical" ? e.scrollTo({
top: l,
behavior: d ? "smooth" : "auto"
}) : e.scrollTo({
left: l,
behavior: d ? "smooth" : "auto"
});
return;
}
if (typeof e.scrollTo == "function") {
e.scrollTo(n === "vertical" ? { top: l, behavior: d ? "smooth" : "auto" } : { left: l, behavior: d ? "smooth" : "auto" });
return;
}
n === "vertical" ? e.scrollTop = l : e.scrollLeft = l;
}
function hn(e, n, i) {
return i ? n === "vertical" ? window.innerHeight : window.innerWidth : n === "vertical" ? e.clientHeight : e.clientWidth;
}
const gn = /auto|scroll/;
function Lt(e, n) {
return e.parentNode === null ? n : Lt(e.parentNode, [...n, e]);
}
function it(e, n) {
return getComputedStyle(e, null).getPropertyValue(n);
}
function zn(e) {
return it(e, "overflow") + it(e, "overflow-y") + it(e, "overflow-x");
}
function Sn(e) {
return gn.test(zn(e));
}
function Je(e) {
if (!(e instanceof HTMLElement || e instanceof SVGElement))
return;
const n = Lt(e.parentNode, []);
for (let i = 0; i < n.length; i += 1)
if (n[i] instanceof Element && Sn(n[i]))
return n[i];
return document.scrollingElement || document.documentElement;
}
let st = !1;
function wn() {
return st;
}
if (typeof window < "u") {
st = !1;
try {
const e = Object.defineProperty({}, "passive", {
get() {
st = !0;
}
});
window.addEventListener("test", null, e);
} catch {
}
}
let bn = 0;
function rt(e) {
const n = e;
n._vs_styleStamp++;
}
function _n(e, n, i) {
const t = e == null ? void 0 : e[i];
if (t == null)
throw new Error(`Key is ${t} on item (keyField is '${i}')`);
return t;
}
function mt(e, n, i, t, l) {
const d = ae([]), h = ae(0), S = ae(!1);
let v = 0, C = 0;
const T = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map();
let A = !1, X = 0, ee = 0, Y = !1, le = null, O = null, H = null, G = 0, te = null, se = [], J = null, z = null, L = !1;
const re = ae({}), R = Z(() => {
const r = u(e);
return r.items.length > 0 && typeof r.items[0] != "object";
}), Q = Z(() => {
const r = u(e);
if (r.itemSize === null) {
const s = {
[-1]: { accumulator: 0 }
}, a = r.items, m = r.sizeField ?? "size", p = r.minItemSize, x = re.value;
let M = 1e4, D = 0, ie;
for (let B = 0, U = a.length; B < U; B++) {
const N = R.value ? B : _n(a[B], B, r.keyField);
ie = x[N] || a[B][m] || p, ie < M && (M = ie), D += ie, s[B] = { accumulator: D, size: ie };
}
return G = M, s;
}
return [];
}), f = Z(
() => d.value.filter((r) => r.nr.used).sort((r, s) => r.nr.index - s.nr.index)
), F = Z(() => {
const r = u(e), s = R.value ? null : r.keyField;
return mn(r.items, s, (a, m, p) => r.itemSize != null ? r.itemSize : re.value[p] || (a == null ? void 0 : a[r.sizeField ?? "size"]) || void 0);
});
function W(r) {
const s = u(e);
return re.value = lt(r, s.items, R.value ? null : s.keyField), Object.keys(re.value).length > 0;
}
function E(r) {
let s = g.get(r);
return s || (s = [], g.set(r, s)), s;
}
function ze(r, s, a, m, p) {
const x = en({
id: bn++,
index: s,
used: !0,
key: m,
type: p
}), M = tn({
item: a,
position: 0,
offset: 0,
nr: x,
_vs_styleStamp: 0
});
return r.push(M), M;
}
function ne(r) {
const s = E(r);
if (s && s.length) {
const a = s.pop();
return a.nr.used = !0, rt(a), a;
}
}
function he(r) {
const s = r.nr.type;
E(s).push(r), r.nr.used = !1, r.position = -9999, rt(r), T.delete(r.nr.key);
}
function et() {
T.clear(), g.clear();
for (let r = 0, s = d.value.length; r < s; r++) {
const a = d.value[r];
a && he(a);
}
}
function Ae() {
var r;
(r = l == null ? void 0 : l.onResize) == null || r.call(l), S.value && ye(!1);
}
function Ee() {
J && !L && _();
const r = u(e);
if (!A) {
if (A = !0, le)
return;
const s = () => requestAnimationFrame(() => {
A = !1;
const { continuous: a } = ye(!1, !0);
a || (O && clearTimeout(O), O = setTimeout(Ee, r.updateInterval + 100));
});
s(), r.updateInterval && (le = setTimeout(() => {
le = null, A && s();
}, r.updateInterval));
}
}
function tt(r, s) {
var a, m;
S.value && (r || s.boundingClientRect.width !== 0 || s.boundingClientRect.height !== 0 ? ((a = l == null ? void 0 : l.onVisible) == null || a.call(l), requestAnimationFrame(() => {
ye(!1);
})) : (m = l == null ? void 0 : l.onHidden) == null || m.call(l));
}
function Ue() {
const r = Je(u(n));
return window.document && (r === window.document.documentElement || r === window.document.body) ? window : r || window;
}
function o() {
const r = u(i);
return r ? u(e).direction === "vertical" ? r.scrollHeight : r.scrollWidth : 0;
}
function c() {
const r = u(n), s = u(e), a = s.direction === "vertical";
let m;
if (s.pageMode) {
const p = r.getBoundingClientRect(), x = a ? p.height : p.width;
let M = -(a ? p.top : p.left), D = a ? window.innerHeight : window.innerWidth;
M < 0 && (D += M, M = 0), M + D > x && (D = x - M), m = {
start: M,
end: M + D
};
} else a ? m = {
start: r.scrollTop,
end: r.scrollTop + r.clientHeight
} : m = {
start: Be(r.scrollLeft, s.direction, r),
end: Be(r.scrollLeft, s.direction, r) + r.clientWidth
};
return m;
}
function y() {
const r = u(n);
if (u(e).direction === "vertical") {
const a = Be(r.scrollLeft, "horizontal", r);
return {
start: a,
end: a + r.clientWidth
};
}
return {
start: r.scrollTop,
end: r.scrollTop + r.clientHeight
};
}
function w(r) {
const s = u(e);
if (s.itemSize != null)
return s.itemSize;
const a = Q.value[r];
return (a == null ? void 0 : a.size) || Number(s.minItemSize) || 0;
}
function I(r) {
var m;
const s = u(e), a = s.gridItems || 1;
return r <= 0 ? 0 : s.itemSize != null ? Math.floor(r / a) * s.itemSize : ((m = Q.value[r - 1]) == null ? void 0 : m.accumulator) || 0;
}
function b(r) {
const s = u(e), a = s.items.length, m = s.gridItems || 1;
if (!a)
return 0;
if (s.itemSize != null) {
const D = Math.floor(r / s.itemSize) * m;
return Math.min(Math.max(D, 0), a - 1);
}
let p = 0, x = a - 1, M = 0;
for (; p <= x; ) {
const D = Math.floor((p + x) / 2);
I(D) <= r ? (M = D, p = D + 1) : x = D - 1;
}
return M;
}
function _() {
z && (clearTimeout(z), z = null), J = null;
}
function ue() {
z && clearTimeout(z), z = setTimeout(() => {
J = null, z = null;
}, 150);
}
function ve(r, s) {
if (!r.length) {
_();
return;
}
const a = Math.max(c().start - o(), 0), m = Math.min(b(a), r.length - 1), p = r[m], x = s ? p == null ? void 0 : p[s] : m;
if (x == null) {
_();
return;
}
const M = o() + I(m);
J = {
key: x,
offset: c().start - M
};
}
function de(r) {
if (!J)
return !1;
const s = u(e), a = r ?? s.items, m = R.value ? null : s.keyField, x = Fe(a, m).indexOf(J.key);
if (x === -1)
return _(), !1;
const M = o() + I(x) + J.offset, D = c().start;
return Math.abs(M - D) < 0.5 ? !1 : (L = !0, qe(M), requestAnimationFrame(() => {
L = !1;
}), !0);
}
function pe() {
u(e).pageMode ? be() : We();
}
function be() {
te = Ue(), te.addEventListener("scroll", Ee, wn() ? { passive: !0 } : !1), te.addEventListener("resize", Ae);
}
function We() {
te && (te.removeEventListener("scroll", Ee), te.removeEventListener("resize", Ae), te = null);
}
function jt(r, s, a, m, p, x) {
const M = Math.ceil(r / s) * a, D = Math.max(0, Math.floor(p.start / a)), ie = Math.min(Math.ceil(p.end / a), Math.ceil(r / s)), B = Math.max(0, Math.floor(x.start / m)), U = Math.min(Math.ceil(x.end / m), s), N = [];
for (let Se = D; Se < ie; Se++) {
const xe = Se * s;
for (let P = B; P < U; P++) {
const V = xe + P;
if (V >= r)
break;
N.push(V);
}
}
const De = N[0] ?? 0, Me = N.at(-1) ?? -1;
return {
renderedIndices: N,
startIndex: De,
endIndex: Me + 1,
visibleStartIndex: De,
visibleEndIndex: Me,
totalSize: M
};
}
function Xt() {
const r = u(e);
if (!r.gridItems || r.itemSize == null)
return !1;
const s = u(n);
if (!s)
return !1;
const a = r.itemSecondarySize || r.itemSize, m = r.direction === "vertical" ? s.clientWidth : s.clientHeight;
return a * r.gridItems > m;
}
function ye(r, s = !1) {
var ht, gt;
const a = u(e), m = a.itemSize, p = a.gridItems || 1, x = a.itemSecondarySize || m, M = G, D = a.typeField, ie = R.value ? null : a.keyField, B = a.items, U = B.length, N = Q.value, De = T, Me = d.value;
let Se = null, xe = null, P, V, Oe, ge, we;
if (!U)
P = V = ge = we = Oe = 0;
else if (Y)
P = ge = 0, V = we = Math.min(a.prerender, B.length), Oe = 0;
else {
const $ = c(), _e = y();
if (s) {
let j = $.start - X;
j < 0 && (j = -j);
let Ce = _e.start - ee;
Ce < 0 && (Ce = -Ce);
const Xe = m === null && j >= M || m !== null && j >= m, fe = p > 1 && m != null && Ce >= x;
if (!Xe && !fe)
return {
continuous: !0
};
}
X = $.start, ee = _e.start;
const ce = a.buffer;
$.start -= ce, $.end += ce, _e.start -= ce, _e.end += ce;
let Ie = 0;
const je = u(i);
je && (Ie = je.scrollHeight, $.start -= Ie);
const zt = u(t);
if (zt) {
const j = zt.scrollHeight;
$.end += j;
}
if (m === null) {
let j, Ce = 0, Xe = U - 1, fe = ~~(U / 2), St;
do
St = fe, j = N[fe].accumulator, j < $.start ? Ce = fe : fe < U - 1 && N[fe + 1].accumulator > $.start && (Xe = fe), fe = ~~((Ce + Xe) / 2);
while (fe !== St);
for (fe < 0 && (fe = 0), P = fe, Oe = N[U - 1].accumulator, V = fe; V < U && N[V].accumulator < $.end; V++) ;
for (V === -1 ? V = B.length - 1 : (V++, V > U && (V = U)), ge = P; ge < U && Ie + N[ge].accumulator < $.start; ge++) ;
for (we = ge; we < U && Ie + N[we].accumulator < $.end; we++) ;
} else if (p > 1) {
const j = jt(
U,
p,
m,
x,
$,
_e
);
Se = j.renderedIndices, xe = new Set(Se), P = j.startIndex, V = j.endIndex, ge = j.visibleStartIndex, we = j.visibleEndIndex, Oe = j.totalSize;
} else {
P = ~~($.start / m * p);
const j = P % p;
P -= j, V = Math.ceil($.end / m * p), ge = Math.max(0, Math.floor(($.start - Ie) / m * p)), we = Math.floor(($.end - Ie) / m * p), P < 0 && (P = 0), V > U && (V = U), ge < 0 && (ge = 0), we > U && (we = U), Oe = Math.ceil(U / p) * m;
}
}
V - P > Pt.itemsLimit && Gt(), h.value = Oe;
let k;
const yt = P <= C && V >= v;
if (!yt || r)
et();
else
for (let $ = 0, _e = Me.length; $ < _e; $++) {
const ce = Me[$];
if (ce && (k = ce, k.nr.used)) {
const Ie = xe ? xe.has(k.nr.index) : k.nr.index >= P && k.nr.index < V, je = m || N[k.nr.index] && N[k.nr.index].size;
(!Ie || !je) && he(k);
}
}
let ke, Ye;
const Zt = Se ?? Array.from({ length: Math.max(0, V - P) }, ($, _e) => P + _e);
for (const $ of Zt) {
if (!(m || N[$] && N[$].size))
continue;
ke = B[$];
const ce = ie ? ke[ie] : $;
if (ce == null)
throw new Error(`Key is ${ce} on item (keyField is '${ie}')`);
if (k = De.get(ce), k)
k.item !== ke && (k.item = ke), k.nr.used || console.warn(`Expected existing view's used flag to be true, got ${k.nr.used}`);
else {
if (Ye = ke[D], k = ne(Ye), k) {
const Ie = k.nr.index !== $ || k.nr.key !== ce;
k.item = ke, k.nr.index = $, k.nr.key = ce, k.nr.type !== Ye && console.warn("Reused view's type does not match pool's type"), Ie && rt(k);
} else
k = ze(Me, $, ke, ce, Ye);
De.set(ce, k);
}
m === null ? (k.position = ((ht = N[$ - 1]) == null ? void 0 : ht.accumulator) || 0, k.offset = 0) : (k.position = Math.floor($ / p) * m, k.offset = $ % p * x);
}
return v = P, C = V, a.emitUpdate && ((gt = l == null ? void 0 : l.onUpdate) == null || gt.call(l, P, V, ge, we)), H && clearTimeout(H), H = setTimeout(pt, a.updateInterval + 300), {
continuous: yt
};
}
function Gt() {
throw setTimeout(() => {
console.warn("It seems the scroller element isn't scrolling, so it tries to render all the items at once.", "Scroller:", u(n)), console.warn("Make sure the scroller has a fixed height (or width) and 'overflow-y' (or 'overflow-x') set to 'auto' so it can scroll correctly and only render the items visible in the scroll viewport.");
}), new Error("Rendered items limit reached");
}
function Jt() {
if (Xt())
return !1;
const r = d.value.filter(({ nr: s }) => s.used);
for (let s = 1; s < r.length; s++)
if (r[s].nr.index !== r[s - 1].nr.index + 1)
return !0;
return !1;
}
function pt() {
d.value.sort((r, s) => r.nr.index - s.nr.index), Jt() && (ye(!1), H && clearTimeout(H));
}
function Qt(r, s) {
const a = u(e), m = Math.max(0, Math.min(r, a.items.length - 1)), p = c().start, x = hn(u(n), a.direction, a.pageMode), M = I(m), D = w(m), ie = bt(
M,
D,
p,
x,
s == null ? void 0 : s.align,
(s == null ? void 0 : s.offset) ?? 0
);
if (ie != null && (qe(ie, s), a.gridItems && a.itemSize != null)) {
const B = u(n), U = a.gridItems, N = a.itemSecondarySize || a.itemSize, Me = m % U * N, Se = a.direction === "vertical" ? "horizontal" : "vertical", xe = Se === "horizontal" ? Be(B.scrollLeft, "horizontal", B) : B.scrollTop, P = Se === "horizontal" ? B.clientWidth : B.clientHeight, V = bt(
Me,
N,
xe,
P,
s == null ? void 0 : s.align,
(s == null ? void 0 : s.offset) ?? 0
);
V != null && nt(B, Se, V, s);
}
}
function qe(r, s) {
const a = u(e), m = u(n);
if (a.pageMode) {
const p = Je(m), x = p.getBoundingClientRect(), M = m.getBoundingClientRect(), D = a.direction === "vertical" ? "top" : "left", ie = Je(m) === document.documentElement || Je(m) === document.body ? a.direction === "vertical" ? window.scrollY : window.scrollX : Be(
a.direction === "vertical" ? p.scrollTop : p.scrollLeft,
a.direction,
p
), B = M[D] - x[D];
nt(p.tagName === "HTML" ? window : p, a.direction, r + ie + B, s);
} else
nt(m, a.direction, r, s);
}
const $e = u(e);
return se = Fe($e.items, $e.items.length > 0 && typeof $e.items[0] != "object" ? null : $e.keyField), $e.cache && W($e.cache), $e.prerender && (Y = !0, ye(!1)), $e.gridItems && !$e.itemSize && console.error("[vue-recycle-scroller] You must provide an itemSize when using gridItems"), ut(() => {
pe(), He(() => {
Y = !1, ye(!0), S.value = !0;
});
}), Ct(() => {
const r = X;
typeof r == "number" && He(() => {
qe(r);
});
}), dt(() => {
We();
}), q(() => u(e).cache, (r) => {
W(r), ye(!0);
}), q(() => u(e).items, (r, s) => {
const a = u(e), m = R.value ? null : a.keyField, p = Fe(r, m);
if (a.shift) {
const x = s ? Fe(s, m) : se;
Ot(x, p) > 0 ? ve(s ?? [], m) : _();
} else
_();
se = p, de(r), ye(!0);
}), q(() => u(e).pageMode, () => {
pe(), ye(!1);
}), q(Q, () => {
de() && ue(), ye(!1);
}, { deep: !0 }), q(() => u(e).gridItems, () => {
ye(!0);
}), q(() => u(e).itemSecondarySize, () => {
ye(!0);
}), {
pool: d,
visiblePool: f,
totalSize: h,
ready: S,
sizes: Q,
simpleArray: R,
scrollToItem: Qt,
scrollToPosition: qe,
getScroll: c,
findItemIndex: b,
getItemOffset: I,
getItemSize: w,
cacheSnapshot: F,
restoreCache: W,
updateVisibleItems: ye,
handleScroll: Ee,
handleResize: Ae,
handleVisibilityChange: tt,
sortViews: pt
};
}
function ct(e) {
return e.item;
}
function In(e) {
return e._vs_styleStamp ?? 0;
}
const Ut = [
"position",
"top",
"left",
"transform",
"willChange",
"visibility",
"pointerEvents"
];
function _t(e) {
const n = {};
for (const i of Ut)
n[i] = e.style[i];
return n;
}
function Wt(e, n) {
for (const i of Ut)
e.style[i] = n[i] ?? "";
}
function It(e, n, i, t) {
if (!("view" in n)) {
Wt(e, t);
return;
}
const l = i === "vertical", d = e.tagName === "TR", h = l ? `translateY(${n.view.position}px) translateX(${n.view.offset}px)` : `translateX(${n.view.position}px) translateY(${n.view.offset}px)`;
e.style.position = "absolute", e.style.top = l && d ? `${n.view.position}px` : "0px", e.style.left = !l && d ? `${n.view.position}px` : "0px", e.style.transform = d ? "" : h, e.style.willChange = d ? "unset" : "transform", e.style.visibility = n.view.nr.used ? "visible" : "hidden", e.style.pointerEvents = n.view.nr.used ? "" : "none";
}
function Tt(e) {
return "view" in e ? {
item: ct(e.view).item,
active: e.view.nr.used,
index: e.view.nr.index,
watchData: e.watchData ?? !1,
emitResize: e.emitResize ?? !1,
sizeDependencies: e.sizeDependencies ?? null,
onResize: e.onResize
} : {
watchData: !1,
emitResize: !1,
sizeDependencies: null,
...e
};
}
function $t(e, n, i, t) {
return i ? t ?? null : (e == null ? void 0 : e[n]) ?? null;
}
function Tn(e) {
let n = 0, i = {};
const t = fn();
let l = !1, d, h = !1, S = [], v = null, C = null;
const T = Ft({
active: !0,
sizes: {},
keyField: u(e).keyField,
simpleArray: !1
}), g = Z(() => u(e).direction), A = Z(() => u(u(e).el)), X = Z(() => u(u(e).before)), ee = Z(() => u(u(e).after)), Y = /* @__PURE__ */ new Map();
typeof ResizeObserver < "u" && (d = new ResizeObserver((o) => {
requestAnimationFrame(() => {
if (Array.isArray(o)) {
for (const c of o)
if (c.target && c.target.$_vs_onResize) {
let y, w;
if (c.borderBoxSize) {
const I = c.borderBoxSize[0];
y = I.inlineSize, w = I.blockSize;
} else
y = c.contentRect.width, w = c.contentRect.height;
c.target.$_vs_onResize(c.target.$_vs_id, y, w);
}
}
});
}));
const le = {
vscrollData: T,
resizeObserver: d,
direction: g,
undefinedMap: i,
undefinedSizeCount: {
get value() {
return n;
},
set value(o) {
n = o;
}
},
onVscrollUpdate(o) {
const c = (y) => {
o(y);
};
return t.on("vscroll:update", c), () => t.off("vscroll:update", c);
}
};
Ne("vscrollData", T), Ne("vscrollParent", {
get $_undefinedSizes() {
return n;
},
set $_undefinedSizes(o) {
n = o;
},
get $_undefinedMap() {
return i;
},
set $_undefinedMap(o) {
i = o;
},
$_events: t,
direction: g
}), Ne("vscrollResizeObserver", d), Ne("vscrollMeasurementContext", le), Ne("vscrollAnchorRegistry", {
delete(o) {
Y.delete(o);
},
set(o, c) {
Y.set(o, c);
}
});
const O = Z(() => {
const o = u(e);
return o.items.length > 0 && typeof o.items[0] != "object";
}), H = Z(() => {
const o = [], c = u(e), { items: y, keyField: w } = c, I = O.value, b = T.sizes, _ = y.length;
for (let ue = 0; ue < _; ue++) {
const ve = y[ue], de = I ? ue : ve[w];
let pe = b[de];
typeof pe > "u" && !i[de] && (pe = 0), o.push({
item: ve,
id: de,
size: pe
});
}
return o;
}), G = u(e);
S = Fe(G.items, O.value ? null : G.keyField), G.cache && (T.sizes = lt(G.cache, G.items, O.value ? null : G.keyField));
const te = Z(() => {
const o = u(e);
return {
items: H.value,
keyField: "id",
direction: o.direction,
itemSize: null,
gridItems: void 0,
itemSecondarySize: void 0,
minItemSize: o.minItemSize,
sizeField: "size",
typeField: "type",
buffer: o.buffer ?? 200,
pageMode: o.pageMode ?? !1,
shift: !1,
cache: o.cache,
prerender: o.prerender ?? 0,
emitUpdate: o.emitUpdate ?? !1,
updateInterval: o.updateInterval ?? 0
};
});
function se() {
var o, c;
he(), (c = (o = u(e)).onResize) == null || c.call(o);
}
function J() {
var o, c;
t.emit("vscroll:update", { force: !1 }), (c = (o = u(e)).onVisible) == null || c.call(o);
}
const z = mt(
te,
A,
X,
ee,
{
onResize: se,
onVisible: J,
onHidden: () => {
var o, c;
return (c = (o = u(e)).onHidden) == null ? void 0 : c.call(o);
},
onUpdate: (o, c, y, w) => {
var I, b;
return (b = (I = u(e)).onUpdate) == null ? void 0 : b.call(I, o, c, y, w);
}
}
), L = /* @__PURE__ */ new WeakMap();
function re() {
C != null && (cancelAnimationFrame(C), C = null);
}
function R() {
re(), v = null;
}
function Q() {
v == null || C != null || (C = requestAnimationFrame(() => {
C = null, E();
}));
}
function f() {
const o = A.value;
if (!o)
return null;
const c = o.getBoundingClientRect();
let y = null;
for (const [w, I] of Y.entries()) {
if (!I.active || getComputedStyle(w).visibility === "hidden")
continue;
const b = w.getBoundingClientRect();
if (b.bottom <= c.top || b.top >= c.bottom)
continue;
const _ = Math.max(b.top, c.top) - c.top;
(!y || _ < y.score) && (y = {
key: I.id,
offset: b.top - c.top,
score: _
});
}
return y;
}
function F(o) {
const c = A.value;
if (!c) {
R();
return;
}
const y = c.scrollTop, w = Math.min(z.findItemIndex(y), o.length - 1), I = o[w];
if (I == null) {
R();
return;
}
const b = f();
v = {
logicalKey: I,
logicalOffset: y - z.getItemOffset(w),
pendingKeys: /* @__PURE__ */ new Set(),
stableFrames: 0,
visualKey: (b == null ? void 0 : b.key) ?? null,
visualOffset: (b == null ? void 0 : b.offset) ?? 0
};
}
function W(o) {
const c = A.value;
return !c || Math.abs(c.scrollTop - o) < 0.5 ? !1 : (h = !0, c.scrollTop = o, c.dispatchEvent(new Event("scroll")), requestAnimationFrame(() => {
h = !1;
}), !0);
}
function E() {
const o = v, c = A.value;
if (!o || !c)
return;
const y = H.value.findIndex((_) => _.id === o.logicalKey);
if (y === -1) {
R();
return;
}
let w = !1;
const I = z.getItemOffset(y) + o.logicalOffset;
if (w = W(I) || w, o.visualKey != null)
for (const [_, ue] of Y.entries()) {
if (!ue.active || ue.id !== o.visualKey || getComputedStyle(_).visibility === "hidden")
continue;
const ve = _.getBoundingClientRect().top - c.getBoundingClientRect().top - o.visualOffset;
w = W(c.scrollTop + ve) || w;
break;
}
let b = !0;
for (const _ of o.pendingKeys)
if (!(typeof T.sizes[_] == "number" && T.sizes[_] > 0)) {
b = !1;
break;
}
if (!w && b) {
if (o.stableFrames++, o.stableFrames >= 2) {
R();
return;
}
} else
o.stableFrames = 0;
Q();
}
function ze(o, c, y, w) {
const I = on(), b = Ge(c), _ = Ge(y), ue = Ge({
onResize: y.onResize
}), ve = Ge(o), de = I.run(() => (q(() => {
const pe = b.value;
if (!("view" in pe))
return {
active: _.value.active,
direction: g.value,
id: $t(
_.value.item,
u(e).keyField,
T.simpleArray,
_.value.index
),
legacy: !0
};
const { view: be } = pe;
return {
active: be.nr.used,
direction: g.value,
id: ct(be).id,
legacy: !1,
position: be.position,
offset: be.offset,
styleStamp: In(be)
};
}, () => {
const pe = ve.value;
if (pe) {
const be = b.value, We = "view" in be ? ct(be.view).id : $t(
_.value.item,
u(e).keyField,
T.simpleArray,
_.value.index
);
We != null && Y.set(pe, {
active: _.value.active && T.active,
id: We
}), It(pe, b.value, g.value, w);
}
}, {
immediate: !0
}), Bt(
_,
ve,
le,
ue
)));
de.mount(), L.set(o, {
binding: b,
scope: I,
options: _,
callbacks: ue,
el: ve,
controller: de,
restoreStyles: w
});
}
const ne = {
mounted(o, c) {
const y = _t(o);
ze(o, c.value, Tt(c.value), y);
},
updated(o, c) {
const y = L.get(o), w = Tt(c.value);
if (!y) {
const I = _t(o);
ze(o, c.value, w, I);
return;
}
y.binding.value = c.value, y.options.value = w, y.callbacks.value = {
onResize: w.onResize
}, y.el.value = o, It(o, c.value, g.value, y.restoreStyles);
},
unmounted(o) {
const c = L.get(o);
c && (c.controller.unmount(), c.scope.stop(), Wt(o, c.restoreStyles), Y.delete(o), L.delete(o));
}
};
function he(o = !1) {
(o || O.value) && (T.sizes = {}), t.emit("vscroll:update", { force: !0 });
}
function et(o, c) {
z.scrollToItem(o, c);
}
function Ae(o) {
const c = u(e);
return T.sizes = lt(o, c.items, O.value ? null : c.keyField), z.restoreCache(o);
}
function Ee(o, c) {
const y = u(e), w = O.value ? c ?? y.items.indexOf(o) : o[y.keyField];
return T.sizes[w] || 0;
}
function tt() {
const o = A.value;
o && (l || (l = !0, He(() => {
o.scrollTop = o.scrollHeight + 5e3;
const c = () => {
o.scrollTop = o.scrollHeight + 5e3, requestAnimationFrame(() => {
o.scrollTop = o.scrollHeight + 5e3, n === 0 ? l = !1 : requestAnimationFrame(c);
});
};
requestAnimationFrame(c);
})));
}
function Ue() {
v && !h && R();
}
return q(() => u(e).items, (o, c) => {
const y = u(e), w = O.value ? null : y.keyField, I = Fe(o, w);
if (y.shift) {
const b = c ? Fe(c, w) : S, _ = Ot(b, I);
_ > 0 ? (F(b), v && (v.pendingKeys = new Set(I.slice(0, _)), v.stableFrames = 0, He(() => {
v && E();
}))) : R();
} else
R();
S = I, he();
}, { flush: "sync" }), q(() => u(e).cache, (o) => {
o && Ae(o);
}), q(O, (o) => {
T.simpleArray = o;
}, { immediate: !0 }), q(() => u(e).direction, () => {
R(), he(!0);
}), q(A, (o, c) => {
c == null || c.removeEventListener("scroll", Ue), o == null || o.addEventListener("scroll", Ue);
}, {
immediate: !0
}), q(H, (o, c) => {
const y = A.value;
if (!y)
return;
if (v) {
E();
return;
}
const w = y.scrollTop, I = u(e);
let b = 0, _ = 0;
const ue = Math.min(o.length, c.length);
for (let de = 0; de < ue && !(b >= w); de++)
b += c[de].size || I.minItemSize, _ += o[de].size || I.minItemSize;
const ve = _ - b;
ve !== 0 && (y.scrollTop += ve);
}, { flush: "post" }), Ct(() => {
T.active = !0;
}), nn(() => {
T.active = !1;
}), rn(() => {
var o;
re(), (o = A.value) == null || o.removeEventListener("scroll", Ue), t.all.clear();
}), {
vscrollData: T,
itemsWithSize: H,
resizeObserver: d,
measurementContext: le,
vDynamicScrollerItem: ne,
...z,
simpleArray: O,
forceUpdate: he,
scrollToItem: et,
restoreCache: Ae,
getItemSize: Ee,
scrollToBottom: tt,
onScrollerResize: se,
onScrollerVisible: J
};
}
const vt = /* @__PURE__ */ new WeakMap();
function $n(e) {
return typeof e == "function" ? {
callback: e,
observer: null,
intersection: void 0,
visible: null
} : {
callback: e.callback,
observer: null,
intersection: e.intersection,
visible: null
};
}
function Rt(e, n) {
Nt(e);
const i = $n(n.value);
if (vt.set(e, i), typeof IntersectionObserver > "u") {
const t = e.getBoundingClientRect();
i.visible = !0, i.callback(!0, {
boundingClientRect: t
});
return;
}
i.observer = new IntersectionObserver((t) => {
const l = t[0], d = !!(l != null && l.isIntersecting);
i.visible !== null && i.visible === d || (i.visible = d, i.callback(d, l));
}, i.intersection), i.observer.observe(e);
}
function Nt(e) {
const n = vt.get(e);
n != null && n.observer && (n.observer.disconnect(), n.observer = null);
}
const Kt = {
mounted(e, n) {
Rt(e, n);
},
updated(e, n) {
n.value !== n.oldValue && Rt(e, n);
},
unmounted(e) {
Nt(e), vt.delete(e);
}
}, qt = /* @__PURE__ */ Le({
__name: "ItemView",
props: {
view: {},
itemTag: {}
},
setup(e) {
const n = e;
return (i, t) => (oe(), Ve(Ze(n.itemTag), { class: "vue-recycle-scroller__item-view" }, {
default: Te(() => [
me(i.$slots, "default", {
item: n.view.item,
index: n.view.nr.index,
active: n.view.nr.used
})
]),
_: 3
}));
}
}), Rn = /* @__PURE__ */ Le({
__name: "ResizeObserver",
emits: ["notify"],
setup(e, { emit: n }) {
const i = n, t = ae();
let l = null, d = null;
function h() {
i("notify");
}
return ut(() => {
var v;
const S = (v = t.value) == null ? void 0 : v.parentElement;
if (S) {
if (typeof ResizeObserver < "u") {
l = new ResizeObserver(() => {
h();
}), l.observe(S);
return;
}
d = () => h(), window.addEventListener("resize", d);
}
}), dt(() => {
l && (l.disconnect(), l = null), d && (window.removeEventListener("resize", d), d = null);
}), (S, v) => (oe(), Re("div", {
ref_key: "el",
ref: t,
class: "vue-recycle-scroller__resize-observer",
"aria-hidden": "true"
}, null, 512));
}
}), Mn = (e, n) => {
const i = e.__vccOpts || e;
for (const [t, l] of n)
i[t] = l;
return i;
}, Yt = /* @__PURE__ */ Mn(Rn, [["__scopeId", "data-v-08cc04ab"]]), at = /* @__PURE__ */ Le({
__name: "RecycleScroller",
props: {
items: {},
keyField: { default: "id" },
direction: { default: "vertical" },
listTag: { default: "div" },
itemTag: { default: "div" },
itemSize: { default: null },
gridItems: { default: void 0 },
itemSecondarySize: { default: void 0 },
minItemSize: { default: null },
sizeField: { default: "size" },
typeField: { default: "type" },
buffer: { default: 200 },
pageMode: { type: Boolean, default: !1 },
shift: { type: Boolean, default: !1 },
cache: { default: void 0 },
prerender: { default: 0 },
emitUpdate: { type: Boolean, default: !1 },
disableTransform: { type: Boolean, default: !1 },
updateInterval: { default: 0 },
skipHover: { type: Boolean, default: !1 },
listClass: { default: "" },
itemClass: { default: "" }
},
emits: ["resize", "visible", "hidden", "update", "scrollStart", "scrollEnd"],
setup(e, { expose: n, emit: i }) {
const t = e, l = i, d = Kt, h = ae(), S = ae(), v = ae(), C = ae(null), T = mt(
t,
h,
S,
v,
{
onResize: () => l("resize"),
onVisible: () => l("visible"),
onHidden: () => l("hidden"),
onUpdate: (E, ze, ne, he) => {
l("update", E, ze, ne, he), ne <= 0 && l("scrollStart"), he >= t.items.length - 1 && l("scrollEnd");
}
}
), {
pool: g,
visiblePool: A,
totalSize: X,
ready: ee,
scrollToItem: Y,
scrollToPosition: le,
getScroll: O,
findItemIndex: H,
getItemOffset: G,
getItemSize: te,
cacheSnapshot: se,
restoreCache: J,
updateVisibleItems: z,
handleScroll: L,
handleResize: re,
handleVisibilityChange: R
} = T;
function Q(E) {
C.value = E;
}
function f() {
C.value = null;
}
const F = Z(() => {
const E = {
[t.direction === "vertical" ? "minHeight" : "minWidth"]: `${X.value}px`
};
if (t.gridItems && t.itemSize != null) {
const ze = (t.itemSecondarySize || t.itemSize) * t.gridItems;
E[t.direction === "vertical" ? "minWidth" : "minHeight"] = `${ze}px`;
}
return E;
});
return n({
el: h,
visiblePool: A,
scrollToItem: Y,
scrollToPosition: le,
getScroll: O,
findItemIndex: H,
getItemOffset: G,
getItemSize: te,
cacheSnapshot: se,
restoreCache: J,
updateVisibleItems: z
}), (E, ze) => Vt((oe(), Re("div", {
ref_key: "el",
ref: h,
class: Ke(["vue-recycle-scroller", {
"grid-mode": t.gridItems,
ready: K(ee),
"page-mode": t.pageMode,
[`direction-${t.direction}`]: !0
}]),
onScrollPassive: ze[0] || (ze[0] = //@ts-ignore
(...ne) => K(L) && K(L)(...ne))
}, [
E.$slots.before ? (oe(), Re("div", {
key: 0,
ref_key: "before",
ref: S,
class: "vue-recycle-scroller__slot"
}, [
me(E.$slots, "before")
], 512)) : Pe("", !0),
(oe(), Ve(Ze(t.listTag), {
style: ot(F.value),
class: Ke(["vue-recycle-scroller__item-wrapper", t.listClass])
}, {
default: Te(() => [
(oe(!0), Re(At, null, Et(K(g), (ne) => (oe(), Ve(qt, Qe({
key: ne.nr.id,
view: ne,
"item-tag": t.itemTag,
style: K(ee) ? [
t.disableTransform ? { [t.direction === "vertical" ? "top" : "left"]: `${ne.position}px`, willChange: "unset" } : { transform: `translate${t.direction === "vertical" ? "Y" : "X"}(${ne.position}px) translate${t.direction === "vertical" ? "X" : "Y"}(${ne.offset}px)` },
{
width: t.gridItems ? `${t.direction === "vertical" && t.itemSecondarySize || t.itemSize}px` : void 0,
height: t.gridItems ? `${t.direction === "horizontal" && t.itemSecondarySize || t.itemSize}px` : void 0,
visibility: ne.nr.used ? "visible" : "hidden"
}
] : null,
class: ["vue-recycle-scroller__item-view", [
t.itemClass,
{
hover: !t.skipHover && C.value === ne.nr.key
}
]]
}, ln(t.skipHover ? {} : {
mouseenter: () => {
Q(ne.nr.key);
},
mouseleave: () => {
f();
}
})), {
default: Te((he) => [
me(E.$slots, "default", Qe({ ref_for: !0 }, he))
]),
_: 2
}, 1040, ["view", "item-tag", "style", "class"]))), 128)),
t.items.length === 0 ? me(E.$slots, "empty", { key: 0 }) : Pe("", !0)
]),
_: 3
}, 8, ["style", "class"])),
E.$slots.after ? (oe(), Re("div", {
key: 1,
ref_key: "after",
ref: v,
class: "vue-recycle-scroller__slot"
}, [
me(E.$slots, "after")
], 512)) : Pe("", !0),
Dt(Yt, { onNotify: K(re) }, null, 8, ["onNotify"])
], 34)), [
[K(d), K(R)]
]);
}
}), Mt = /* @__PURE__ */ Le({
inheritAttrs: !1,
__name: "DynamicScroller",
props: {
items: {},
keyField: { default: "id" },
direction: { default: "vertical" },
listTag: { default: "div" },
itemTag: { default: "div" },
minItemSize: {},
shift: { type: Boolean, default: !1 },
cache: { default: void 0 }
},
emits: ["resize", "visible"],
setup(e, { expose: n, emit: i }) {
const t = e, l = i, d = ae(), h = Z(() => {
var L;
const z = (L = d.value) == null ? void 0 : L.el;
return z && typeof z == "object" && "value" in z ? z.value : z;
}), S = Z(() => ({
items: t.items,
keyField: t.keyField,
direction: t.direction,
minItemSize: t.minItemSize,
shift: t.shift,
cache: t.cache,
el: h.value,
onResize: () => l("resize"),
onVisible: () => l("visible")
})), v = Tn(
S
), {
itemsWithSize: C,
forceUpdate: T,
scrollToItem: g,
scrollToPosition: A,
findItemIndex: X,
getItemOffset: ee,
getItemSize: Y,
cacheSnapshot: le,
restoreCache: O,
scrollToBottom: H,
onScrollerResize: G,
onScrollerVisible: te
} = v;
function se(z, L, re) {
return {
item: z.item,
index: L,
active: re,
itemWithSize: z
};
}
return n({
scrollToItem: g,
scrollToPosition: A,
findItemIndex: X,
getItemOffset: ee,
scrollToBottom: H,
getItemSize: Y,
cacheSnapshot: le,
restoreCache: O,
forceUpdate: T
}), (z, L) => (oe(), Ve(at, Qe({
ref_key: "scroller",
ref: d,
items: K(C),
"min-item-size": t.minItemSize,
direction: t.direction,
cache: t.cache,
"key-field": "id",
"list-tag": t.listTag,
"item-tag": t.itemTag
}, z.$attrs, {
onResize: K(G),
onVisible: K(te)
}), sn({
default: Te(({ item: re, index: R, active: Q }) => [
me(z.$slots, "default", cn(an(se(re, R, Q))))
]),
empty: Te(() => [
me(z.$slots, "empty")
]),
_: 2
}, [
z.$slots.before ? {
name: "before",
fn: Te(() => [
me(z.$slots, "before")
]),
key: "0"
} : void 0,
z.$slots.after ? {
name: "after",
fn: Te(() => [
me(z.$slots, "after")
]),
key: "1"
} : void 0
]), 1040, ["items", "min-item-size", "direction", "cache", "list-tag", "item-tag", "onResize", "onVisible"]));
}
});
function xn(e, n, i) {
const t = wt("vscrollMeasurementContext"), l = wt("vscrollAnchorRegistry", null), d = Bt(
e,
n,
t,
i
);
return ut(() => {
d.mount();
}), l && q(
[d.id, d.finalActive, () => u(n)],
([h, S, v], [C, T, g]) => {
g && g !== v && l.delete(g), v && l.set(v, {
active: S,
id: h
});
},
{
immediate: !0
}
), dt(() => {
const h = u(n);
l && h && l.delete(h), d.unmount();
}), {
id: d.id,
size: d.size,
finalActive: d.finalActive,
updateSize: d.updateSize
};
}
const xt = /* @__PURE__ */ Le({
__name: "DynamicScrollerItem",
props: {
item: {},
watchData: { type: Boolean, default: !1 },
active: { type: Boolean },
index: { default: void 0 },
sizeDependencies: { default: null },
emitResize: { type: Boolean, default: !1 },
tag: { default: "div" }
},
emits: ["resize"],
setup(e, { emit: n }) {
const i = e, t = n, l = ae();
return xn(
i,
l,
{
onResize: (d) => t("resize", d)
}
), (d, h) => (oe(), Ve(Ze(i.tag), {
ref_key: "el",
ref: l
}, {
default: Te(() => [
me(d.$slots, "default")
]),
_: 3
}, 512));
}
});
function kn(e, n, i, t, l) {
return mt(Z(() => ({
...u(e),
pageMode: !0
})), n, i, t, l);
}
const kt = /* @__PURE__ */ Le({
__name: "WindowScroller",
props: {
items: {},
keyField: { default: "id" },
direction: { default: "vertical" },
listTag: { default: "div" },
itemTag: { default: "div" },
itemSize: { default: null },
gridItems: { default: void 0 },
itemSecondarySize: { default: void 0 },
minItemSize: { default: null },
sizeField: { default: "size" },
typeField: { default: "type" },
buffer: { default: 200 },
shift: { type: Boolean, default: !1 },
cache: { default: void 0 },
prerender: { default: 0 },
emitUpdate: { type: Boolean, default: !1 },
disableTransform: { type: Boolean, default: !1 },
updateInterval: { default: 0 },
listClass: { default: "" },
itemClass: { default: "" }
},
emits: ["resize", "visible", "hidden", "update"],
setup(e, { expose: n, emit: i }) {
const t = e, l = i, d = Kt, h = ae(), S = ae(), v = ae(), C = kn(
t,
h,
S,
v,
{
onResize: () => l("resize"),
onVisible: () => l("visible"),
onHidden: () => l("hidden"),
onUpdate: (R, Q, f, F) => l("update", R, Q, f, F)
}
), {
pool: T,
totalSize: g,
ready: A,
scrollToItem: X,
scrollToPosition: ee,
getScroll: Y,
findItemIndex: le,
getItemOffset: O,
getItemSize: H,
cacheSnapshot: G,
restoreCache: te,
updateVisibleItems: se,
handleScroll: J,
handleResize: z,
handleVisibilityChange: L
} = C;
return n({
el: h,
scrollToItem: X,
scrollToPosition: ee,
getScroll: Y,
findItemIndex: le,
getItemOffset: O,
getItemSize: H,
cacheSnapshot: G,
restoreCache: te,
updateVisibleItems: se
}), (R, Q) => Vt((oe(), Re("div", {
ref_key: "el",
ref: h,
class: Ke(["vue-recycle-scroller vue-window-scroller", {
ready: K(A),
[`direction-${t.direction}`]: !0
}]),
onScrollPassive: Q[0] || (Q[0] = //@ts-ignore
(...f) => K(J) && K(J)(...f))
}, [
R.$slots.before ? (oe(), Re("div", {
key: 0,
ref_key: "before",
ref: S,
class: "vue-recycle-scroller__slot"
}, [
me(R.$slots, "before")
], 512)) : Pe("", !0),
(oe(), Ve(Ze(t.listTag), {
style: ot({ [t.direction === "vertical" ? "minHeight" : "minWidth"]: `${K(g)}px` }),
class: Ke(["vue-recycle-scroller__item-wrapper", t.listClass])
}, {
default: Te(() => [
(oe(!0), Re(At, null, Et(K(T), (f) => (oe(), Ve(qt, {
key: f.nr.id,
view: f,
"item-tag": t.itemTag,
style: ot(K(A) ? [
t.disableTransform ? { [t.direction === "vertical" ? "top" : "left"]: `${f.position}px`, willChange: "unset" } : { transform: `translate${t.direction === "vertical" ? "Y" : "X"}(${f.position}px) translate${t.direction === "vertical" ? "X" : "Y"}(${f.offset}px)` },
{
width: t.gridItems ? `${t.direction === "vertical" && t.itemSecondarySize || t.itemSize}px` : void 0,
height: t.gridItems ? `${t.direction === "horizontal" && t.itemSecondarySize || t.itemSize}px` : void 0,
visibility: f.nr.used ? "visible" : "hidden"
}
] : null),
class: Ke(["vue-recycle-scroller__item-view", t.itemClass])
}, {
default: Te((F) => [
me(R.$slots, "default", Qe({ ref_for: !0 }, F))
]),
_: 2
}, 1032, ["view", "item-tag", "style", "class"]))), 128)),
t.items.length === 0 ? me(R.$slots, "empty", { key: 0 }) : Pe("", !0)
]),
_: 3