@glhrmoura/vue-virtualize 0.1.3 → 0.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
- import { shallowRef as xe, ref as L, toValue as l, watch as me, onBeforeUnmount as ge, computed as b, defineComponent as ee, openBlock as R, createBlock as j, resolveDynamicComponent as q, normalizeStyle as V, withCtx as Y, renderSlot as A, createElementBlock as C, Fragment as H, renderList as P, unref as B, mergeProps as te, createElementVNode as oe, toDisplayString as le, createTextVNode as pe } from "vue";
2
- function U(e) {
1
+ import { shallowRef as Me, ref as L, toValue as o, watch as ge, onBeforeUnmount as ve, computed as R, defineComponent as ie, openBlock as T, createBlock as Y, resolveDynamicComponent as q, normalizeStyle as F, withCtx as U, renderSlot as G, createElementBlock as $, Fragment as D, renderList as P, unref as K, mergeProps as ne, createElementVNode as ue, toDisplayString as ce, createTextVNode as Oe } from "vue";
2
+ function ee(e) {
3
3
  return !Number.isFinite(e) || e < 0 ? 0 : e;
4
4
  }
5
- class be {
5
+ class Re {
6
6
  sizes = /* @__PURE__ */ new Map();
7
7
  divergent = !1;
8
8
  get(t) {
@@ -30,32 +30,45 @@ class be {
30
30
  }
31
31
  }
32
32
  }
33
- function ve(e, t, i) {
33
+ function Se(e, t, i) {
34
34
  return Math.min(i, Math.max(t, e));
35
35
  }
36
- function Q(e, t, i) {
36
+ const Te = 16777216;
37
+ function H(e, t, i) {
37
38
  const n = Math.max(0, t - Math.max(0, i));
38
- return ve(Number.isFinite(e) ? e : 0, 0, n);
39
+ return Se(Number.isFinite(e) ? e : 0, 0, n);
39
40
  }
40
- function Ie(e, t, i) {
41
+ function N(e, t) {
42
+ const i = Math.max(0, Number.isFinite(e) ? e : 0), n = Math.min(i, Te);
43
+ return t === void 0 || !Number.isFinite(t) || t <= 0 ? n : Math.min(n, t);
44
+ }
45
+ function Ee(e, t, i, n) {
46
+ const r = Math.max(0, t - Math.max(0, n)), s = Math.max(0, i - Math.max(0, n));
47
+ return r <= 0 ? 0 : s <= 0 || s >= r ? H(e, t, n) : Math.max(0, e) / s * r;
48
+ }
49
+ function ke(e, t, i, n) {
50
+ const r = Math.max(0, t - Math.max(0, n)), s = Math.max(0, i - Math.max(0, n));
51
+ return s <= 0 ? 0 : r <= 0 || s >= r ? H(e, t, n) : H(e, t, n) / r * s;
52
+ }
53
+ function Ce(e, t, i) {
41
54
  if (e <= 0) return 0;
42
55
  let n = 0, r = e - 1, s = e - 1;
43
56
  for (; n <= r; ) {
44
- const f = n + r >>> 1;
45
- i(f) > t ? (s = f, r = f - 1) : n = f + 1;
57
+ const u = n + r >>> 1;
58
+ i(u) > t ? (s = u, r = u - 1) : n = u + 1;
46
59
  }
47
60
  return s;
48
61
  }
49
- function Oe(e, t, i) {
62
+ function $e(e, t, i) {
50
63
  if (e <= 0) return 0;
51
64
  let n = 0, r = e - 1, s = 0;
52
65
  for (; n <= r; ) {
53
- const f = n + r >>> 1;
54
- i(f) < t ? (s = f, n = f + 1) : r = f - 1;
66
+ const u = n + r >>> 1;
67
+ i(u) < t ? (s = u, n = u + 1) : r = u - 1;
55
68
  }
56
69
  return s;
57
70
  }
58
- function Re(e) {
71
+ function Ve(e) {
59
72
  const t = e.start + e.size;
60
73
  let i = e.align;
61
74
  if (i === "auto") {
@@ -65,7 +78,7 @@ function Re(e) {
65
78
  }
66
79
  return i === "center" ? e.start - (e.viewport - e.size) / 2 : i === "end" ? t - e.viewport : e.start;
67
80
  }
68
- class Te {
81
+ class Ae {
69
82
  count = 0;
70
83
  estimateSize = () => 0;
71
84
  overscan = 0;
@@ -77,14 +90,14 @@ class Te {
77
90
  viewportSize = 0;
78
91
  scrollOffset = 0;
79
92
  getItemKey = (t) => t;
80
- measurements = new be();
93
+ measurements = new Re();
81
94
  built = 0;
82
95
  offsets = [];
83
96
  laneCursor = [];
84
97
  laneEnd = [];
85
98
  setOptions(t) {
86
- const i = Math.max(1, Math.floor(t.lanes ?? 1)), n = t.gap ?? 0, r = t.paddingStart ?? 0, s = t.paddingEnd ?? 0, f = Math.max(0, Math.floor(t.count)), m = t.itemSize === void 0 || t.itemSize === null ? null : U(t.itemSize), y = this.itemSize, p = i !== this.lanes || n !== this.gap || r !== this.paddingStart || s !== this.paddingEnd || t.estimateSize !== this.estimateSize || m !== this.itemSize;
87
- this.count = f, this.lanes = i, this.gap = n, this.paddingStart = r, this.paddingEnd = s, this.overscan = Math.max(0, Math.floor(t.overscan ?? 0)), this.estimateSize = t.estimateSize, this.itemSize = m, this.getItemKey = t.getItemKey ?? ((v) => v), t.viewportSize !== void 0 && (this.viewportSize = Math.max(0, t.viewportSize)), m !== y && this.measurements.clear(), this.measurements.trim(this.count, this.itemSize), (p || this.built > this.count) && this.resetGeometry();
99
+ const i = Math.max(1, Math.floor(t.lanes ?? 1)), n = t.gap ?? 0, r = t.paddingStart ?? 0, s = t.paddingEnd ?? 0, u = Math.max(0, Math.floor(t.count)), p = t.itemSize === void 0 || t.itemSize === null ? null : ee(t.itemSize), x = this.itemSize, I = i !== this.lanes || n !== this.gap || r !== this.paddingStart || s !== this.paddingEnd || t.estimateSize !== this.estimateSize || p !== this.itemSize;
100
+ this.count = u, this.lanes = i, this.gap = n, this.paddingStart = r, this.paddingEnd = s, this.overscan = Math.max(0, Math.floor(t.overscan ?? 0)), this.estimateSize = t.estimateSize, this.itemSize = p, this.getItemKey = t.getItemKey ?? ((w) => w), t.viewportSize !== void 0 && (this.viewportSize = Math.max(0, t.viewportSize)), p !== x && this.measurements.clear(), this.measurements.trim(this.count, this.itemSize), (I || this.built > this.count) && this.resetGeometry();
88
101
  }
89
102
  setScrollOffset(t) {
90
103
  this.scrollOffset = Number.isFinite(t) ? t : 0;
@@ -97,7 +110,7 @@ class Te {
97
110
  }
98
111
  measure(t, i) {
99
112
  if (t < 0 || t >= this.count) return !1;
100
- const n = U(i), r = this.measurements.get(t);
113
+ const n = ee(i), r = this.measurements.get(t);
101
114
  if (r !== void 0 && Math.abs(r - n) < 0.5) return !1;
102
115
  const s = this.getItemSize(t);
103
116
  return this.measurements.set(t, n, this.itemSize), Math.abs(s - n) < 0.5 ? !1 : (this.resetGeometry(), !0);
@@ -107,7 +120,7 @@ class Te {
107
120
  }
108
121
  getItemSize(t) {
109
122
  const i = this.measurements.get(t);
110
- return i !== void 0 ? i : this.itemSize !== null ? this.itemSize : U(this.estimateSize(t));
123
+ return i !== void 0 ? i : this.itemSize !== null ? this.itemSize : ee(this.estimateSize(t));
111
124
  }
112
125
  getItemOffset(t) {
113
126
  if (t <= 0 || this.count <= 0) return this.paddingStart;
@@ -124,8 +137,8 @@ class Te {
124
137
  let i = this.paddingStart;
125
138
  const n = this.itemSize ?? 0;
126
139
  for (let r = 0; r < this.lanes && r < this.count; r += 1) {
127
- const s = this.laneLength(r), f = this.paddingStart + s * n + Math.max(0, s - 1) * this.gap;
128
- f > i && (i = f);
140
+ const s = this.laneLength(r), u = this.paddingStart + s * n + Math.max(0, s - 1) * this.gap;
141
+ u > i && (i = u);
129
142
  }
130
143
  return i + this.paddingEnd;
131
144
  }
@@ -139,23 +152,23 @@ class Te {
139
152
  }
140
153
  getVirtualItems() {
141
154
  if (this.count <= 0 || this.viewportSize <= 0) return [];
142
- const t = Q(this.scrollOffset, this.getTotalSize(), this.viewportSize), i = t + this.viewportSize, n = [];
155
+ const t = H(this.scrollOffset, this.getTotalSize(), this.viewportSize), i = t + this.viewportSize, n = [];
143
156
  for (let r = 0; r < this.lanes; r += 1) {
144
157
  const s = this.laneLength(r);
145
158
  if (s <= 0) continue;
146
- const f = Ie(s, t, (v) => {
147
- const w = this.ordinalIndex(r, v);
148
- return this.getItemOffset(w) + this.getItemSize(w);
149
- }), m = Oe(
159
+ const u = Ce(s, t, (w) => {
160
+ const b = this.ordinalIndex(r, w);
161
+ return this.getItemOffset(b) + this.getItemSize(b);
162
+ }), p = $e(
150
163
  s,
151
164
  i,
152
- (v) => this.getItemOffset(this.ordinalIndex(r, v))
153
- ), y = Math.max(0, Math.min(f, m) - this.overscan), p = Math.min(s - 1, Math.max(f, m) + this.overscan);
154
- for (let v = y; v <= p; v += 1) {
155
- const w = this.ordinalIndex(r, v), E = this.getItemOffset(w), k = this.getItemSize(w);
165
+ (w) => this.getItemOffset(this.ordinalIndex(r, w))
166
+ ), x = Math.max(0, Math.min(u, p) - this.overscan), I = Math.min(s - 1, Math.max(u, p) + this.overscan);
167
+ for (let w = x; w <= I; w += 1) {
168
+ const b = this.ordinalIndex(r, w), E = this.getItemOffset(b), k = this.getItemSize(b);
156
169
  n.push({
157
- index: w,
158
- key: this.getItemKey(w),
170
+ index: b,
171
+ key: this.getItemKey(b),
159
172
  start: E,
160
173
  size: k,
161
174
  end: E + k,
@@ -167,14 +180,14 @@ class Te {
167
180
  }
168
181
  getOffsetForIndex(t, i = "auto") {
169
182
  if (this.count <= 0) return 0;
170
- const n = ve(t, 0, this.count - 1), r = this.getItemOffset(n), s = this.getItemSize(n), f = Re({
183
+ const n = Se(t, 0, this.count - 1), r = this.getItemOffset(n), s = this.getItemSize(n), u = Ve({
171
184
  start: r,
172
185
  size: s,
173
186
  viewport: this.viewportSize,
174
187
  current: this.scrollOffset,
175
188
  align: i
176
189
  });
177
- return Q(f, this.getTotalSize(), this.viewportSize);
190
+ return H(u, this.getTotalSize(), this.viewportSize);
178
191
  }
179
192
  usesFixedPath() {
180
193
  return this.itemSize !== null && !this.measurements.hasDivergent;
@@ -199,13 +212,13 @@ class Te {
199
212
  this.built = 0, this.offsets = [], this.laneCursor = Array.from({ length: this.lanes }, () => this.paddingStart), this.laneEnd = Array.from({ length: this.lanes }, () => this.paddingStart);
200
213
  }
201
214
  }
202
- function W() {
215
+ function Z() {
203
216
  return typeof window < "u" && typeof document < "u";
204
217
  }
205
- function Se(e) {
218
+ function ze(e) {
206
219
  return typeof Element > "u" ? null : e instanceof Element ? e : null;
207
220
  }
208
- function X(e, t, i, n) {
221
+ function Fe(e, t, i, n) {
209
222
  if (n === "smooth" && typeof e.scrollTo == "function") {
210
223
  e.scrollTo({
211
224
  top: i ? e.scrollTop : t,
@@ -216,19 +229,22 @@ function X(e, t, i, n) {
216
229
  }
217
230
  i ? e.scrollLeft = t : e.scrollTop = t;
218
231
  }
219
- function J(e, t) {
232
+ function fe(e, t) {
220
233
  return t ? e.scrollLeft : e.scrollTop;
221
234
  }
222
- function ue(e, t) {
235
+ function de(e, t) {
223
236
  return t ? e.clientWidth : e.clientHeight;
224
237
  }
225
- function ce(e) {
238
+ function Ke(e, t) {
239
+ return t ? e.scrollWidth : e.scrollHeight;
240
+ }
241
+ function Le(e) {
226
242
  return typeof requestAnimationFrame == "function" ? requestAnimationFrame(e) : setTimeout(e, 0);
227
243
  }
228
- function fe(e) {
244
+ function je(e) {
229
245
  e && (typeof cancelAnimationFrame == "function" ? cancelAnimationFrame(e) : clearTimeout(e));
230
246
  }
231
- function Ee(e, t) {
247
+ function Ge(e, t) {
232
248
  if (e.length !== t.length) return !1;
233
249
  for (let i = 0; i < e.length; i += 1) {
234
250
  const n = e[i], r = t[i];
@@ -237,154 +253,179 @@ function Ee(e, t) {
237
253
  }
238
254
  return !0;
239
255
  }
240
- function Z(e) {
241
- const t = new Te(), i = xe([]), n = L(0), r = L(0), s = L(!1), f = (c) => e.estimateSize(c);
242
- let m = null, y = null, p = null, v = 0, w = 0, E = 0, k = l(e.revision);
243
- const o = /* @__PURE__ */ new Map(), u = /* @__PURE__ */ new Map(), a = [];
244
- function d() {
245
- const c = l(e.container);
246
- return typeof HTMLElement > "u" ? null : c instanceof HTMLElement ? c : null;
256
+ function te(e) {
257
+ const t = new Ae(), i = Me([]), n = L(0), r = L(0), s = L(0), u = L(!1), p = (a) => e.estimateSize(a);
258
+ let x = null, I = null, w = null, b = 0, E = 0, k = 0, f = o(e.revision);
259
+ const d = /* @__PURE__ */ new Map(), h = /* @__PURE__ */ new Map(), l = [];
260
+ function z() {
261
+ const a = o(e.container);
262
+ return typeof HTMLElement > "u" ? null : a instanceof HTMLElement ? a : null;
247
263
  }
248
- function S() {
249
- return l(e.horizontal) ?? !1;
264
+ function m() {
265
+ return o(e.horizontal) ?? !1;
266
+ }
267
+ function j() {
268
+ const a = o(e.initialRect);
269
+ return a ? m() ? a.width : a.height : 0;
250
270
  }
251
- function K() {
252
- const c = l(e.initialRect);
253
- return c ? S() ? c.width : c.height : 0;
271
+ function X(a, c) {
272
+ return a ? N(c, Ke(a, m())) : N(c);
254
273
  }
255
- function M() {
256
- const c = l(e.revision);
257
- Object.is(c, k) || (k = c, t.clearMeasurements());
258
- const z = d(), x = z ? ue(z, S()) : 0, O = l(e.viewportInset) ?? 0, T = Math.max(0, (x > 0 ? x : K()) - O), F = l(e.itemSize);
274
+ function _(a, c, g) {
275
+ return Ee(
276
+ fe(a, m()),
277
+ c,
278
+ X(a, c),
279
+ g
280
+ );
281
+ }
282
+ function v(a, c, g, M, O) {
283
+ Fe(
284
+ a,
285
+ ke(c, g, X(a, g), M),
286
+ m(),
287
+ O
288
+ );
289
+ }
290
+ function y() {
291
+ const a = o(e.revision);
292
+ Object.is(a, f) || (f = a, t.clearMeasurements());
293
+ const c = z(), g = c ? de(c, m()) : 0, M = o(e.viewportInset) ?? 0, O = Math.max(0, (g > 0 ? g : j()) - M), C = o(e.itemSize);
259
294
  t.setOptions({
260
- count: l(e.count),
261
- estimateSize: f,
262
- overscan: l(e.overscan) ?? 5,
263
- gap: l(e.gap) ?? 0,
264
- paddingStart: l(e.paddingStart) ?? 0,
265
- paddingEnd: l(e.paddingEnd) ?? 0,
266
- lanes: l(e.lanes) ?? 1,
267
- itemSize: F ?? null,
295
+ count: o(e.count),
296
+ estimateSize: p,
297
+ overscan: (o(e.overscan) ?? 8) + k,
298
+ gap: o(e.gap) ?? 0,
299
+ paddingStart: o(e.paddingStart) ?? 0,
300
+ paddingEnd: o(e.paddingEnd) ?? 0,
301
+ lanes: o(e.lanes) ?? 1,
302
+ itemSize: C ?? null,
268
303
  getItemKey: e.getItemKey,
269
- viewportSize: T
304
+ viewportSize: O
270
305
  });
271
- const G = Math.max(0, t.getTotalSize() - T);
272
- t.getScrollOffset() > G && (t.setScrollOffset(G), z && J(z, S()) !== G && X(z, G, S(), "auto"));
273
- const re = t.getVirtualItems();
274
- Ee(i.value, re) || (i.value = re);
275
- const se = t.getTotalSize();
276
- n.value !== se && (n.value = se);
277
- const ae = t.getScrollOffset();
278
- r.value !== ae && (r.value = ae);
279
- }
280
- function _() {
281
- if (!W()) {
282
- M();
283
- return;
284
- }
285
- v || (v = ce(() => {
286
- v = 0, s.value = !0, M(), typeof window < "u" && (window.clearTimeout(E), E = window.setTimeout(() => {
287
- s.value = !1;
288
- }, 150));
289
- }));
306
+ const A = t.getTotalSize(), J = Math.max(0, A - O);
307
+ t.getScrollOffset() > J && (t.setScrollOffset(J), c && v(c, J, A, O, "auto"));
308
+ const ae = t.getVirtualItems();
309
+ Ge(i.value, ae) || (i.value = ae), n.value !== A && (n.value = A);
310
+ const Q = t.getScrollOffset();
311
+ r.value !== Q && (r.value = Q);
312
+ const le = c ? Q - fe(c, m()) : 0;
313
+ s.value !== le && (s.value = le);
314
+ }
315
+ function S() {
316
+ u.value = !1, k = 0;
317
+ for (const [a, c] of d)
318
+ l.push({ element: a, index: c });
319
+ se(), y();
290
320
  }
291
- function h() {
292
- const c = d();
293
- c && (t.setScrollOffset(J(c, S())), _());
294
- }
295
- function I() {
296
- const c = d();
297
- if (c === m || (m && (m.removeEventListener("scroll", h), y?.disconnect(), y = null), m = c, !c || !W())) return;
298
- const z = S();
299
- t.getScrollOffset() > 0 ? X(c, t.getScrollOffset(), z, "auto") : t.setScrollOffset(J(c, z)), c.addEventListener("scroll", h, { passive: !0 }), typeof ResizeObserver < "u" && (y = new ResizeObserver(() => M()), y.observe(c));
300
- }
301
- function g() {
302
- return !W() || typeof ResizeObserver > "u" ? null : (p || (p = new ResizeObserver((c) => {
303
- const z = S();
304
- let x = !1;
305
- for (const O of c) {
306
- const T = o.get(O.target);
307
- if (T === void 0) continue;
308
- const F = O.borderBoxSize?.[0], G = z ? F?.inlineSize ?? O.contentRect.width : F?.blockSize ?? O.contentRect.height;
309
- G > 0 && t.measure(T, G) && (x = !0);
321
+ function V() {
322
+ u.value = !0, !(typeof window > "u") && (window.clearTimeout(E), E = window.setTimeout(S, 120));
323
+ }
324
+ function B() {
325
+ const a = z();
326
+ if (!a) return;
327
+ V();
328
+ const c = t.getViewportSize(), g = t.getTotalSize(), M = _(a, g, c), O = t.getScrollOffset(), C = Math.max(1, o(e.itemSize) ?? 48);
329
+ k = Math.min(24, Math.ceil(Math.abs(M - O) / C)), t.setScrollOffset(M), y();
330
+ }
331
+ function we() {
332
+ const a = z();
333
+ if (a === x || (x && (x.removeEventListener("scroll", B), I?.disconnect(), I = null), x = a, !a || !Z())) return;
334
+ const c = t.getViewportSize(), g = t.getTotalSize();
335
+ t.getScrollOffset() > 0 ? v(a, t.getScrollOffset(), g, c, "auto") : t.setScrollOffset(_(a, g, c)), a.addEventListener("scroll", B, { passive: !0 }), typeof ResizeObserver < "u" && (I = new ResizeObserver(() => y()), I.observe(a));
336
+ }
337
+ function xe() {
338
+ return !Z() || typeof ResizeObserver > "u" ? null : (w || (w = new ResizeObserver((a) => {
339
+ const c = m();
340
+ let g = !1;
341
+ if (!u.value) {
342
+ for (const M of a) {
343
+ const O = d.get(M.target);
344
+ if (O === void 0) continue;
345
+ const C = M.borderBoxSize?.[0], A = Math.round(
346
+ c ? C?.inlineSize ?? M.contentRect.width : C?.blockSize ?? M.contentRect.height
347
+ );
348
+ A > 0 && t.measure(O, A) && (g = !0);
349
+ }
350
+ g && y();
310
351
  }
311
- x && M();
312
- })), p);
313
- }
314
- function $() {
315
- w = 0;
316
- const c = a.splice(0, a.length), z = S();
317
- let x = !1;
318
- for (const O of c) {
319
- if (!O.element.isConnected) continue;
320
- const T = O.element.getBoundingClientRect(), F = z ? T.width : T.height;
321
- F > 0 && t.measure(O.index, F) && (x = !0);
352
+ })), w);
353
+ }
354
+ function se() {
355
+ if (b = 0, u.value) return;
356
+ const a = l.splice(0, l.length), c = m();
357
+ let g = !1;
358
+ for (const M of a) {
359
+ if (!M.element.isConnected) continue;
360
+ const O = M.element.getBoundingClientRect(), C = Math.round(c ? O.width : O.height);
361
+ C > 0 && t.measure(M.index, C) && (g = !0);
322
362
  }
323
- x && M();
363
+ g && y();
324
364
  }
325
- function D(c, z) {
326
- const x = Se(c), O = g(), T = u.get(z);
327
- T && T !== x && (O?.unobserve(T), o.delete(T), u.delete(z)), x && (u.set(z, x), o.set(x, z), O?.observe(x), a.push({ element: x, index: z }), !w && (w = ce($)));
365
+ function pe(a, c) {
366
+ const g = ze(a), M = xe(), O = h.get(c);
367
+ O && O !== g && (M?.unobserve(O), d.delete(O), h.delete(c)), g && (h.set(c, g), d.set(g, c), M?.observe(g), l.push({ element: g, index: c }), !(u.value || b) && (b = Le(se)));
328
368
  }
329
- function ne(c, z = "auto") {
330
- const x = d(), O = x ? ue(x, S()) : 0, T = O > 0 ? O : t.getViewportSize(), F = Q(c, t.getTotalSize(), T);
331
- t.setScrollOffset(F), x && X(x, F, S(), z), M();
369
+ function oe(a, c = "auto") {
370
+ const g = z(), M = g ? de(g, m()) : 0, O = M > 0 ? M : t.getViewportSize(), C = t.getTotalSize(), A = H(a, C, O);
371
+ t.setScrollOffset(A), g && v(g, A, C, O, c), y();
332
372
  }
333
- function ye(c, z) {
334
- const x = t.getOffsetForIndex(c, z?.align ?? "auto");
335
- ne(x, z?.behavior ?? "auto");
373
+ function be(a, c) {
374
+ const g = t.getOffsetForIndex(a, c?.align ?? "auto");
375
+ oe(g, c?.behavior ?? "auto");
336
376
  }
337
- function we(c, z) {
338
- t.measure(c, z) && M();
377
+ function Ie(a, c) {
378
+ t.measure(a, c) && y();
339
379
  }
340
- return M(), me(
380
+ return y(), ge(
341
381
  () => [
342
- l(e.count),
343
- l(e.overscan),
344
- l(e.gap),
345
- l(e.paddingStart),
346
- l(e.paddingEnd),
347
- l(e.lanes),
348
- l(e.horizontal),
349
- l(e.itemSize),
350
- l(e.viewportInset),
351
- l(e.revision),
352
- l(e.container),
353
- l(e.initialRect)?.width,
354
- l(e.initialRect)?.height
382
+ o(e.count),
383
+ o(e.overscan),
384
+ o(e.gap),
385
+ o(e.paddingStart),
386
+ o(e.paddingEnd),
387
+ o(e.lanes),
388
+ o(e.horizontal),
389
+ o(e.itemSize),
390
+ o(e.viewportInset),
391
+ o(e.revision),
392
+ o(e.container),
393
+ o(e.initialRect)?.width,
394
+ o(e.initialRect)?.height
355
395
  ],
356
396
  () => {
357
- I(), M();
397
+ we(), y();
358
398
  },
359
399
  { flush: "post" }
360
- ), ge(() => {
361
- m && m.removeEventListener("scroll", h), y?.disconnect(), p?.disconnect(), fe(v), fe(w), typeof window < "u" && window.clearTimeout(E), o.clear(), u.clear(), a.length = 0;
400
+ ), ve(() => {
401
+ x && x.removeEventListener("scroll", B), I?.disconnect(), w?.disconnect(), je(b), typeof window < "u" && window.clearTimeout(E), d.clear(), h.clear(), l.length = 0;
362
402
  }), {
363
- virtualItems: b(() => i.value),
364
- totalSize: b(() => n.value),
365
- scrollOffset: b(() => r.value),
366
- isScrolling: b(() => s.value),
367
- scrollToIndex: ye,
368
- scrollToOffset: ne,
369
- measure: we,
370
- measureElement: D
403
+ virtualItems: R(() => i.value),
404
+ totalSize: R(() => n.value),
405
+ scrollOffset: R(() => r.value),
406
+ scrollAdjust: R(() => s.value),
407
+ isScrolling: R(() => u.value),
408
+ scrollToIndex: be,
409
+ scrollToOffset: oe,
410
+ measure: Ie,
411
+ measureElement: pe
371
412
  };
372
413
  }
373
- function Me(e, t, i) {
414
+ function Ne(e, t, i) {
374
415
  return typeof e == "function" ? e(t, i) : typeof e == "number" ? e : 48;
375
416
  }
376
- function ze(e) {
377
- const t = Z({
378
- count: () => l(e.items).length,
417
+ function ye(e) {
418
+ const t = te({
419
+ count: () => o(e.items).length,
379
420
  estimateSize: (n) => {
380
- const r = l(e.items);
381
- return Me(e.estimateSize, n, r[n]);
421
+ const r = o(e.items);
422
+ return Ne(e.estimateSize, n, r[n]);
382
423
  },
383
424
  getItemKey: (n) => {
384
- const s = l(e.items)[n];
425
+ const s = o(e.items)[n];
385
426
  return e.getItemKey?.(s, n) ?? n;
386
427
  },
387
- itemSize: () => e.itemSize !== void 0 ? l(e.itemSize) : typeof e.estimateSize == "number" ? e.estimateSize : void 0,
428
+ itemSize: () => e.itemSize !== void 0 ? o(e.itemSize) : typeof e.estimateSize == "number" ? e.estimateSize : void 0,
388
429
  container: e.container,
389
430
  horizontal: e.horizontal,
390
431
  overscan: e.overscan,
@@ -396,8 +437,8 @@ function ze(e) {
396
437
  revision: e.revision
397
438
  });
398
439
  return {
399
- virtualItems: b(() => {
400
- const n = l(e.items);
440
+ virtualItems: R(() => {
441
+ const n = o(e.items);
401
442
  return t.virtualItems.value.map((r) => {
402
443
  const s = n[r.index];
403
444
  return {
@@ -409,6 +450,7 @@ function ze(e) {
409
450
  }),
410
451
  totalSize: t.totalSize,
411
452
  scrollOffset: t.scrollOffset,
453
+ scrollAdjust: t.scrollAdjust,
412
454
  isScrolling: t.isScrolling,
413
455
  scrollToIndex: t.scrollToIndex,
414
456
  scrollToOffset: t.scrollToOffset,
@@ -416,102 +458,104 @@ function ze(e) {
416
458
  measureElement: t.measureElement
417
459
  };
418
460
  }
419
- function de(e, t, i) {
461
+ function he(e, t, i) {
420
462
  return typeof e == "function" ? e(t) : typeof e == "number" ? e : i;
421
463
  }
422
- function ke(e) {
423
- const t = b(() => Math.max(1, Math.floor(l(e.columnCount) || 1))), i = b(() => Math.ceil(l(e.items).length / t.value)), n = /* @__PURE__ */ new Map(), r = Z({
464
+ function Be(e) {
465
+ const t = R(() => Math.max(1, Math.floor(o(e.columnCount) || 1))), i = R(() => Math.ceil(o(e.items).length / t.value)), n = /* @__PURE__ */ new Map(), r = te({
424
466
  count: () => i.value,
425
- estimateSize: (o) => de(l(e.estimateRowSize), o, 48),
467
+ estimateSize: (f) => he(o(e.estimateRowSize), f, 48),
426
468
  itemSize: () => {
427
- const o = l(e.estimateRowSize);
428
- return typeof o == "number" ? o : void 0;
469
+ const f = o(e.estimateRowSize);
470
+ return typeof f == "number" ? f : void 0;
429
471
  },
430
- overscan: () => l(e.overscanRows) ?? l(e.overscan) ?? 2,
431
- gap: () => l(e.rowGap) ?? 0,
472
+ overscan: () => o(e.overscanRows) ?? o(e.overscan) ?? 2,
473
+ gap: () => o(e.rowGap) ?? 0,
432
474
  horizontal: !1,
433
475
  container: e.container,
434
476
  initialRect: e.initialRect,
435
477
  revision: e.revision
436
- }), s = Z({
478
+ }), s = te({
437
479
  count: () => t.value,
438
- estimateSize: (o) => de(l(e.estimateColumnSize), o, 160),
480
+ estimateSize: (f) => he(o(e.estimateColumnSize), f, 160),
439
481
  itemSize: () => {
440
- const o = l(e.estimateColumnSize);
441
- return typeof o == "number" ? o : void 0;
482
+ const f = o(e.estimateColumnSize);
483
+ return typeof f == "number" ? f : void 0;
442
484
  },
443
- overscan: () => l(e.overscanColumns) ?? l(e.overscan) ?? 1,
444
- gap: () => l(e.columnGap) ?? 0,
485
+ overscan: () => o(e.overscanColumns) ?? o(e.overscan) ?? 1,
486
+ gap: () => o(e.columnGap) ?? 0,
445
487
  horizontal: !0,
446
488
  container: e.container,
447
489
  initialRect: e.initialRect,
448
490
  revision: e.revision
449
- }), f = b(() => {
450
- const o = l(e.items), u = t.value, a = [];
451
- for (const d of r.virtualItems.value)
452
- for (const S of s.virtualItems.value) {
453
- const K = d.index * u + S.index;
454
- if (K >= o.length) continue;
455
- const M = o[K];
456
- a.push({
457
- index: K,
458
- key: e.getItemKey?.(M, K) ?? K,
459
- item: M,
460
- row: d,
461
- column: S
491
+ }), u = R(() => {
492
+ const f = o(e.items), d = t.value, h = [];
493
+ for (const l of r.virtualItems.value)
494
+ for (const z of s.virtualItems.value) {
495
+ const m = l.index * d + z.index;
496
+ if (m >= f.length) continue;
497
+ const j = f[m];
498
+ h.push({
499
+ index: m,
500
+ key: e.getItemKey?.(j, m) ?? m,
501
+ item: j,
502
+ row: l,
503
+ column: z
462
504
  });
463
505
  }
464
- return a;
506
+ return h;
465
507
  });
466
- function m(o, u) {
467
- const a = l(e.items);
468
- if (!a.length) return;
469
- const d = Math.min(Math.max(o, 0), a.length - 1), S = t.value;
470
- r.scrollToIndex(Math.floor(d / S), u), s.scrollToIndex(d % S, u);
508
+ function p(f, d) {
509
+ const h = o(e.items);
510
+ if (!h.length) return;
511
+ const l = Math.min(Math.max(f, 0), h.length - 1), z = t.value;
512
+ r.scrollToIndex(Math.floor(l / z), d), s.scrollToIndex(l % z, d);
471
513
  }
472
- function y(o, u = "auto") {
473
- o.top !== void 0 && r.scrollToOffset(o.top, u), o.left !== void 0 && s.scrollToOffset(o.left, u);
514
+ function x(f, d = "auto") {
515
+ f.top !== void 0 && r.scrollToOffset(f.top, d), f.left !== void 0 && s.scrollToOffset(f.left, d);
474
516
  }
475
- function p(o, u) {
476
- const a = Math.max(n.get(o) ?? 0, u);
477
- a <= 0 || a === n.get(o) || (n.set(o, a), r.measure(o, a));
517
+ function I(f, d) {
518
+ const h = Math.max(n.get(f) ?? 0, d);
519
+ h <= 0 || h === n.get(f) || (n.set(f, h), r.measure(f, h));
478
520
  }
479
- let v = null;
480
- const w = /* @__PURE__ */ new Map();
521
+ let w = null;
522
+ const b = /* @__PURE__ */ new Map();
481
523
  function E() {
482
- return !W() || typeof ResizeObserver > "u" ? null : (v || (v = new ResizeObserver((o) => {
483
- for (const u of o) {
484
- const a = w.get(u.target);
485
- if (a === void 0) continue;
486
- const S = u.borderBoxSize?.[0]?.blockSize ?? u.contentRect.height;
487
- S > 0 && p(a, S);
524
+ return !Z() || typeof ResizeObserver > "u" ? null : (w || (w = new ResizeObserver((f) => {
525
+ for (const d of f) {
526
+ const h = b.get(d.target);
527
+ if (h === void 0) continue;
528
+ const z = d.borderBoxSize?.[0]?.blockSize ?? d.contentRect.height;
529
+ z > 0 && I(h, z);
488
530
  }
489
- })), v);
531
+ })), w);
490
532
  }
491
- function k(o, u) {
492
- const a = Se(o), d = E();
493
- if (!a) return;
494
- w.set(a, u), d?.observe(a);
495
- const S = a.getBoundingClientRect().height;
496
- S > 0 && p(u, S);
533
+ function k(f, d) {
534
+ const h = ze(f), l = E();
535
+ if (!h) return;
536
+ b.set(h, d), l?.observe(h);
537
+ const z = h.getBoundingClientRect().height;
538
+ z > 0 && I(d, z);
497
539
  }
498
- return ge(() => {
499
- v?.disconnect(), w.clear();
540
+ return ve(() => {
541
+ w?.disconnect(), b.clear();
500
542
  }), {
501
543
  virtualRows: r.virtualItems,
502
544
  virtualColumns: s.virtualItems,
503
- virtualCells: f,
545
+ virtualCells: u,
504
546
  totalHeight: r.totalSize,
505
547
  totalWidth: s.totalSize,
506
- scrollToIndex: m,
507
- scrollToOffset: y,
508
- measureRow: p,
548
+ scrollAdjustX: s.scrollAdjust,
549
+ scrollAdjustY: r.scrollAdjust,
550
+ scrollToIndex: p,
551
+ scrollToOffset: x,
552
+ measureRow: I,
509
553
  measureRowElement: k,
510
554
  measureColumn: s.measure
511
555
  };
512
556
  }
513
- function Ce(e) {
514
- const t = ze({
557
+ function He(e) {
558
+ const t = ye({
515
559
  items: e.rows,
516
560
  estimateSize: e.estimateRowSize,
517
561
  container: e.container,
@@ -521,28 +565,29 @@ function Ce(e) {
521
565
  viewportInset: e.viewportInset,
522
566
  revision: e.revision,
523
567
  itemSize: e.itemSize
524
- }), i = b(() => {
525
- const s = l(e.columns);
526
- let f = 0;
527
- return s.map((m) => {
528
- const y = m.width ?? m.minWidth ?? 160, p = {
529
- ...m,
530
- start: f,
531
- size: y,
532
- end: f + y
568
+ }), i = R(() => {
569
+ const s = o(e.columns);
570
+ let u = 0;
571
+ return s.map((p) => {
572
+ const x = p.width ?? p.minWidth ?? 160, I = {
573
+ ...p,
574
+ start: u,
575
+ size: x,
576
+ end: u + x
533
577
  };
534
- return f += y, p;
578
+ return u += x, I;
535
579
  });
536
- }), n = b(() => {
580
+ }), n = R(() => {
537
581
  const s = i.value;
538
582
  return s.length ? s[s.length - 1]?.end ?? 0 : 0;
539
583
  });
540
584
  return {
541
- virtualRows: b(() => t.virtualItems.value),
585
+ virtualRows: R(() => t.virtualItems.value),
542
586
  columns: i,
543
587
  totalHeight: t.totalSize,
544
588
  totalWidth: n,
545
589
  scrollOffset: t.scrollOffset,
590
+ scrollAdjust: t.scrollAdjust,
546
591
  isScrolling: t.isScrolling,
547
592
  scrollToIndex: t.scrollToIndex,
548
593
  scrollToOffset: t.scrollToOffset,
@@ -550,11 +595,11 @@ function Ce(e) {
550
595
  measureElement: t.measureElement
551
596
  };
552
597
  }
553
- function he(e) {
598
+ function me(e) {
554
599
  if (typeof e == "number" && Number.isFinite(e)) return `${e}px`;
555
600
  if (typeof e == "string" && e.trim()) return e;
556
601
  }
557
- function N(e) {
602
+ function W(e) {
558
603
  if (typeof e == "number" && Number.isFinite(e)) return e;
559
604
  if (typeof e != "string") return 0;
560
605
  const t = /^(-?\d+(?:\.\d+)?)px$/.exec(e.trim());
@@ -562,33 +607,37 @@ function N(e) {
562
607
  const i = Number(t[1]);
563
608
  return Number.isFinite(i) ? i : 0;
564
609
  }
565
- function ie(e) {
610
+ function re(e) {
566
611
  return {
567
612
  overflow: "auto",
568
613
  position: "relative",
569
- height: he(e.height) ?? (e.horizontal ? "100%" : void 0),
570
- width: he(e.width) ?? (e.horizontal ? void 0 : "100%"),
614
+ height: me(e.height) ?? (e.horizontal ? "100%" : void 0),
615
+ width: me(e.width) ?? (e.horizontal ? void 0 : "100%"),
571
616
  overflowAnchor: "none"
572
617
  };
573
618
  }
574
- function $e(e, t) {
619
+ function We(e, t) {
620
+ const i = N(e);
575
621
  return {
576
622
  position: "relative",
577
- width: t ? `${e}px` : "100%",
578
- height: t ? "100%" : `${e}px`
623
+ width: t ? `${i}px` : "100%",
624
+ height: t ? "100%" : `${i}px`
579
625
  };
580
626
  }
581
- function Fe(e, t) {
627
+ function _e(e, t, i) {
582
628
  return {
583
629
  position: "absolute",
584
630
  top: 0,
585
631
  left: 0,
586
- width: t ? void 0 : "100%",
587
- height: t ? "100%" : void 0,
588
- transform: t ? `translateX(${e}px)` : `translateY(${e}px)`
632
+ width: t ? i === void 0 ? void 0 : `${i}px` : "100%",
633
+ height: t ? "100%" : i === void 0 ? void 0 : `${i}px`,
634
+ transform: t ? `translateX(${e}px)` : `translateY(${e}px)`,
635
+ contain: "layout style",
636
+ boxSizing: "border-box",
637
+ overflow: "hidden"
589
638
  };
590
639
  }
591
- const Ae = /* @__PURE__ */ ee({
640
+ const Ye = /* @__PURE__ */ ie({
592
641
  __name: "VirtualList",
593
642
  props: {
594
643
  items: {},
@@ -596,7 +645,7 @@ const Ae = /* @__PURE__ */ ee({
596
645
  height: {},
597
646
  width: {},
598
647
  horizontal: { type: Boolean, default: !1 },
599
- overscan: { default: 5 },
648
+ overscan: { default: 8 },
600
649
  gap: { default: 0 },
601
650
  paddingStart: { default: 0 },
602
651
  paddingEnd: { default: 0 },
@@ -607,11 +656,11 @@ const Ae = /* @__PURE__ */ ee({
607
656
  revision: {}
608
657
  },
609
658
  setup(e, { expose: t }) {
610
- const i = e, n = L(null), { virtualItems: r, totalSize: s, scrollToIndex: f, scrollToOffset: m, measure: y, measureElement: p } = ze({
659
+ const i = e, n = L(null), { virtualItems: r, totalSize: s, scrollAdjust: u, scrollToIndex: p, scrollToOffset: x, measure: I, measureElement: w } = ye({
611
660
  items: () => i.items,
612
- estimateSize: (o, u) => {
613
- const a = i.estimateSize;
614
- return typeof a == "number" ? a : a(o, u);
661
+ estimateSize: (d, h) => {
662
+ const l = i.estimateSize;
663
+ return typeof l == "number" ? l : l(d, h);
615
664
  },
616
665
  itemSize: () => typeof i.estimateSize == "number" ? i.estimateSize : void 0,
617
666
  container: n,
@@ -620,72 +669,72 @@ const Ae = /* @__PURE__ */ ee({
620
669
  gap: () => i.gap,
621
670
  paddingStart: () => i.paddingStart,
622
671
  paddingEnd: () => i.paddingEnd,
623
- getItemKey: (o, u) => i.getItemKey?.(o, u) ?? u,
672
+ getItemKey: (d, h) => i.getItemKey?.(d, h) ?? h,
624
673
  initialRect: () => ({
625
- width: N(i.width),
626
- height: N(i.height)
674
+ width: W(i.width),
675
+ height: W(i.height)
627
676
  }),
628
677
  revision: () => i.revision
629
- }), v = b(
630
- () => ie({
678
+ }), b = R(
679
+ () => re({
631
680
  height: i.height,
632
681
  width: i.width,
633
682
  horizontal: i.horizontal
634
683
  })
635
- ), w = b(() => $e(s.value, i.horizontal));
636
- function E(o) {
637
- return Fe(o, i.horizontal);
684
+ ), E = R(() => We(s.value, i.horizontal));
685
+ function k(d, h) {
686
+ return _e(d, i.horizontal, h);
638
687
  }
639
- function k(o) {
640
- return (u) => {
641
- p(u, o);
688
+ function f(d) {
689
+ return (h) => {
690
+ w(h, d);
642
691
  };
643
692
  }
644
693
  return t({
645
- scrollToIndex: f,
646
- scrollToOffset: m,
647
- measure: y
648
- }), (o, u) => (R(), j(q(e.tag), {
694
+ scrollToIndex: p,
695
+ scrollToOffset: x,
696
+ measure: I
697
+ }), (d, h) => (T(), Y(q(e.tag), {
649
698
  ref_key: "container",
650
699
  ref: n,
651
700
  "data-virtual-container": "",
652
701
  role: "list",
653
- style: V(v.value)
702
+ style: F(b.value)
654
703
  }, {
655
- default: Y(() => [
656
- e.items.length ? (R(), C("div", {
704
+ default: U(() => [
705
+ e.items.length ? (T(), $("div", {
657
706
  key: 1,
658
707
  "data-virtual-spacer": "",
659
- style: V(w.value)
708
+ style: F(E.value)
660
709
  }, [
661
- (R(!0), C(H, null, P(B(r), (a) => (R(), j(q(e.itemTag), te({
662
- key: a.key,
710
+ (T(!0), $(D, null, P(K(r), (l) => (T(), Y(q(e.itemTag), ne({
711
+ key: l.key,
663
712
  ref_for: !0,
664
- ref: k(a.index),
713
+ ref: f(l.index),
665
714
  role: "listitem",
666
- "data-index": a.index,
667
- "data-key": String(a.key),
715
+ "data-index": l.index,
716
+ "data-key": String(l.key),
668
717
  "aria-setsize": e.items.length,
669
- "aria-posinset": a.index + 1,
670
- style: E(a.start)
718
+ "aria-posinset": l.index + 1,
719
+ style: k(l.start - K(u), l.size)
671
720
  }, { ref_for: !0 }, e.itemAttrs), {
672
- default: Y(() => [
673
- A(o.$slots, "default", {
674
- item: a.item,
675
- index: a.index,
676
- start: a.start,
677
- size: a.size,
678
- end: a.end
721
+ default: U(() => [
722
+ G(d.$slots, "default", {
723
+ item: l.item,
724
+ index: l.index,
725
+ start: l.start,
726
+ size: l.size,
727
+ end: l.end
679
728
  })
680
729
  ]),
681
730
  _: 2
682
731
  }, 1040, ["data-index", "data-key", "aria-setsize", "aria-posinset", "style"]))), 128))
683
- ], 4)) : A(o.$slots, "empty", {}, void 0, void 0, 0)
732
+ ], 4)) : G(d.$slots, "empty", {}, void 0, void 0, 0)
684
733
  ]),
685
734
  _: 3
686
735
  }, 8, ["style"]));
687
736
  }
688
- }), Ve = ["data-index", "data-key"], Be = /* @__PURE__ */ ee({
737
+ }), De = ["data-index", "data-key"], qe = /* @__PURE__ */ ie({
689
738
  __name: "VirtualGrid",
690
739
  props: {
691
740
  items: {},
@@ -708,12 +757,14 @@ const Ae = /* @__PURE__ */ ee({
708
757
  const i = e, n = L(null), {
709
758
  virtualCells: r,
710
759
  totalWidth: s,
711
- totalHeight: f,
712
- scrollToIndex: m,
713
- scrollToOffset: y,
714
- measureRow: p,
715
- measureRowElement: v
716
- } = ke({
760
+ totalHeight: u,
761
+ scrollAdjustX: p,
762
+ scrollAdjustY: x,
763
+ scrollToIndex: I,
764
+ scrollToOffset: w,
765
+ measureRow: b,
766
+ measureRowElement: E
767
+ } = Be({
717
768
  items: () => i.items,
718
769
  columnCount: () => i.columnCount,
719
770
  estimateRowSize: () => i.estimateRowSize,
@@ -724,78 +775,82 @@ const Ae = /* @__PURE__ */ ee({
724
775
  overscanColumns: () => i.overscanColumns,
725
776
  rowGap: () => i.rowGap,
726
777
  columnGap: () => i.columnGap,
727
- getItemKey: (u, a) => i.getItemKey?.(u, a) ?? a,
778
+ getItemKey: (l, z) => i.getItemKey?.(l, z) ?? z,
728
779
  initialRect: () => ({
729
- width: N(i.width),
730
- height: N(i.height)
780
+ width: W(i.width),
781
+ height: W(i.height)
731
782
  }),
732
783
  revision: () => i.revision
733
- }), w = b(
734
- () => ie({
784
+ }), k = R(
785
+ () => re({
735
786
  height: i.height,
736
787
  width: i.width,
737
788
  horizontal: !1
738
789
  })
739
- ), E = b(() => ({
790
+ ), f = R(() => ({
740
791
  position: "relative",
741
- width: `${s.value}px`,
742
- height: `${f.value}px`
792
+ width: `${N(s.value)}px`,
793
+ height: `${N(u.value)}px`
743
794
  }));
744
- function k(u) {
745
- return (a) => {
746
- v(a, u);
795
+ function d(l) {
796
+ return (z) => {
797
+ E(z, l);
747
798
  };
748
799
  }
749
- function o(u, a, d) {
800
+ function h(l, z, m, j) {
750
801
  return {
751
802
  position: "absolute",
752
803
  top: 0,
753
804
  left: 0,
754
- width: `${a}px`,
755
- transform: `translate(${u}px, ${d}px)`
805
+ width: `${z}px`,
806
+ height: `${j}px`,
807
+ transform: `translate(${l}px, ${m}px)`,
808
+ contain: "layout style",
809
+ boxSizing: "border-box",
810
+ overflow: "hidden"
756
811
  };
757
812
  }
758
813
  return t({
759
- scrollToIndex: m,
760
- scrollToOffset: y,
761
- measureRow: p
762
- }), (u, a) => (R(), j(q(e.tag), {
814
+ scrollToIndex: I,
815
+ scrollToOffset: w,
816
+ measureRow: b
817
+ }), (l, z) => (T(), Y(q(e.tag), {
763
818
  ref_key: "container",
764
819
  ref: n,
765
820
  "data-virtual-container": "",
766
821
  role: "grid",
767
- style: V(w.value)
822
+ style: F(k.value)
768
823
  }, {
769
- default: Y(() => [
770
- e.items.length ? (R(), C("div", {
824
+ default: U(() => [
825
+ e.items.length ? (T(), $("div", {
771
826
  key: 1,
772
827
  "data-virtual-spacer": "",
773
- style: V(E.value)
828
+ style: F(f.value)
774
829
  }, [
775
- (R(!0), C(H, null, P(B(r), (d) => (R(), C("div", te({
776
- key: d.key,
830
+ (T(!0), $(D, null, P(K(r), (m) => (T(), $("div", ne({
831
+ key: m.key,
777
832
  ref_for: !0,
778
- ref: k(d.row.index),
833
+ ref: d(m.row.index),
779
834
  role: "gridcell",
780
- "data-index": d.index,
781
- "data-key": String(d.key),
782
- style: o(d.column.start, d.column.size, d.row.start)
835
+ "data-index": m.index,
836
+ "data-key": String(m.key),
837
+ style: h(m.column.start - K(p), m.column.size, m.row.start - K(x), m.row.size)
783
838
  }, { ref_for: !0 }, e.itemAttrs), [
784
- A(u.$slots, "default", {
785
- item: d.item,
786
- index: d.index,
787
- rowIndex: d.row.index,
788
- columnIndex: d.column.index,
789
- row: d.row,
790
- column: d.column
839
+ G(l.$slots, "default", {
840
+ item: m.item,
841
+ index: m.index,
842
+ rowIndex: m.row.index,
843
+ columnIndex: m.column.index,
844
+ row: m.row,
845
+ column: m.column
791
846
  })
792
- ], 16, Ve))), 128))
793
- ], 4)) : A(u.$slots, "empty", {}, void 0, void 0, 0)
847
+ ], 16, De))), 128))
848
+ ], 4)) : G(l.$slots, "empty", {}, void 0, void 0, 0)
794
849
  ]),
795
850
  _: 3
796
851
  }, 8, ["style"]));
797
852
  }
798
- }), Ke = ["data-index", "data-key", "aria-rowindex"], Ne = /* @__PURE__ */ ee({
853
+ }), Pe = ["data-index", "data-key", "aria-rowindex"], Ue = /* @__PURE__ */ ie({
799
854
  __name: "VirtualTable",
800
855
  props: {
801
856
  rows: {},
@@ -803,7 +858,7 @@ const Ae = /* @__PURE__ */ ee({
803
858
  estimateRowSize: { type: [Number, Function], default: 44 },
804
859
  height: {},
805
860
  width: {},
806
- overscan: { default: 5 },
861
+ overscan: { default: 8 },
807
862
  getRowKey: {},
808
863
  stickyHeader: { type: Boolean, default: !0 },
809
864
  tag: { default: "div" },
@@ -812,145 +867,150 @@ const Ae = /* @__PURE__ */ ee({
812
867
  },
813
868
  setup(e, { expose: t }) {
814
869
  const i = e, n = L(null), r = L(null), s = L(0), {
815
- virtualRows: f,
816
- columns: m,
817
- totalWidth: y,
818
- totalHeight: p,
819
- scrollToIndex: v,
820
- scrollToOffset: w,
821
- measure: E,
822
- measureElement: k
823
- } = Ce({
870
+ virtualRows: u,
871
+ columns: p,
872
+ totalWidth: x,
873
+ totalHeight: I,
874
+ scrollAdjust: w,
875
+ scrollToIndex: b,
876
+ scrollToOffset: E,
877
+ measure: k,
878
+ measureElement: f
879
+ } = He({
824
880
  rows: () => i.rows,
825
881
  columns: () => i.columns,
826
- estimateRowSize: (h, I) => {
827
- const g = i.estimateRowSize;
828
- return typeof g == "number" ? g : g(h, I);
882
+ estimateRowSize: (v, y) => {
883
+ const S = i.estimateRowSize;
884
+ return typeof S == "number" ? S : S(v, y);
829
885
  },
830
886
  container: n,
831
887
  overscan: () => i.overscan,
832
- getRowKey: (h, I) => i.getRowKey?.(h, I) ?? I,
888
+ getRowKey: (v, y) => i.getRowKey?.(v, y) ?? y,
833
889
  initialRect: () => ({
834
- width: N(i.width),
835
- height: N(i.height)
890
+ width: W(i.width),
891
+ height: W(i.height)
836
892
  }),
837
893
  viewportInset: s,
838
894
  revision: () => i.revision,
839
895
  itemSize: () => typeof i.estimateRowSize == "number" ? i.estimateRowSize : void 0
840
896
  });
841
- me(r, (h, I, g) => {
842
- if (I === h && !h || !h || !W() || typeof ResizeObserver > "u") return;
843
- const $ = () => {
844
- s.value = h.getBoundingClientRect().height;
845
- }, D = new ResizeObserver($);
846
- D.observe(h), $(), g(() => D.disconnect());
897
+ ge(r, (v, y, S) => {
898
+ if (y === v && !v || !v || !Z() || typeof ResizeObserver > "u") return;
899
+ const V = () => {
900
+ s.value = v.getBoundingClientRect().height;
901
+ }, B = new ResizeObserver(V);
902
+ B.observe(v), V(), S(() => B.disconnect());
847
903
  });
848
- const o = b(
849
- () => ie({
904
+ const d = R(
905
+ () => re({
850
906
  height: i.height,
851
907
  width: i.width,
852
908
  horizontal: !1
853
909
  })
854
- ), u = b(() => ({
855
- minWidth: `${y.value}px`
856
- })), a = b(() => ({
910
+ ), h = R(() => ({
911
+ minWidth: `${x.value}px`
912
+ })), l = R(() => ({
857
913
  position: i.stickyHeader ? "sticky" : "relative",
858
914
  top: i.stickyHeader ? "0px" : void 0,
859
915
  zIndex: 1,
860
916
  display: "flex",
861
- width: `${y.value}px`
862
- })), d = b(() => ({
917
+ width: `${x.value}px`
918
+ })), z = R(() => ({
863
919
  position: "relative",
864
- height: `${p.value}px`,
865
- width: `${y.value}px`
920
+ height: `${N(I.value)}px`,
921
+ width: `${N(x.value)}px`
866
922
  }));
867
- function S(h) {
923
+ function m(v) {
868
924
  return {
869
- width: `${h.size}px`,
870
- minWidth: `${h.size}px`,
925
+ width: `${v.size}px`,
926
+ minWidth: `${v.size}px`,
871
927
  flex: "0 0 auto",
872
- textAlign: h.align ?? "left"
928
+ textAlign: v.align ?? "left"
873
929
  };
874
930
  }
875
- function K(h) {
931
+ function j(v, y) {
876
932
  return {
877
933
  position: "absolute",
878
934
  top: 0,
879
935
  left: 0,
880
936
  width: "100%",
937
+ height: `${y}px`,
881
938
  display: "flex",
882
- transform: `translateY(${h}px)`
939
+ transform: `translateY(${v}px)`,
940
+ contain: "layout style",
941
+ boxSizing: "border-box",
942
+ overflow: "hidden"
883
943
  };
884
944
  }
885
- function M(h) {
886
- return (I) => {
887
- k(I, h);
945
+ function X(v) {
946
+ return (y) => {
947
+ f(y, v);
888
948
  };
889
949
  }
890
- function _(h, I, g) {
891
- return I.accessor ? I.accessor(h, g) : h && typeof h == "object" && I.id in h ? h[I.id] : "";
950
+ function _(v, y, S) {
951
+ return y.accessor ? y.accessor(v, S) : v && typeof v == "object" && y.id in v ? v[y.id] : "";
892
952
  }
893
953
  return t({
894
- scrollToIndex: v,
895
- scrollToOffset: w,
896
- measure: E
897
- }), (h, I) => (R(), j(q(e.tag), {
954
+ scrollToIndex: b,
955
+ scrollToOffset: E,
956
+ measure: k
957
+ }), (v, y) => (T(), Y(q(e.tag), {
898
958
  ref_key: "container",
899
959
  ref: n,
900
960
  "data-virtual-container": "",
901
961
  role: "table",
902
- style: V(o.value)
962
+ style: F(d.value)
903
963
  }, {
904
- default: Y(() => [
905
- oe("div", {
906
- style: V(u.value)
964
+ default: U(() => [
965
+ ue("div", {
966
+ style: F(h.value)
907
967
  }, [
908
- oe("div", {
968
+ ue("div", {
909
969
  ref_key: "header",
910
970
  ref: r,
911
971
  role: "row",
912
- style: V(a.value)
972
+ style: F(l.value)
913
973
  }, [
914
- A(h.$slots, "header", { columns: B(m) }, () => [
915
- (R(!0), C(H, null, P(B(m), (g) => (R(), C("div", {
916
- key: g.id,
974
+ G(v.$slots, "header", { columns: K(p) }, () => [
975
+ (T(!0), $(D, null, P(K(p), (S) => (T(), $("div", {
976
+ key: S.id,
917
977
  role: "columnheader",
918
- style: V(S(g))
919
- }, le(g.header), 5))), 128))
978
+ style: F(m(S))
979
+ }, ce(S.header), 5))), 128))
920
980
  ])
921
981
  ], 4),
922
- e.rows.length ? (R(), C("div", {
982
+ e.rows.length ? (T(), $("div", {
923
983
  key: 1,
924
984
  "data-virtual-spacer": "",
925
985
  role: "rowgroup",
926
- style: V(d.value)
986
+ style: F(z.value)
927
987
  }, [
928
- (R(!0), C(H, null, P(B(f), (g) => (R(), C("div", te({
929
- key: g.key,
988
+ (T(!0), $(D, null, P(K(u), (S) => (T(), $("div", ne({
989
+ key: S.key,
930
990
  ref_for: !0,
931
- ref: M(g.index),
991
+ ref: X(S.index),
932
992
  role: "row",
933
- "data-index": g.index,
934
- "data-key": String(g.key),
935
- "aria-rowindex": g.index + 1,
936
- style: K(g.start)
993
+ "data-index": S.index,
994
+ "data-key": String(S.key),
995
+ "aria-rowindex": S.index + 1,
996
+ style: j(S.start - K(w), S.size)
937
997
  }, { ref_for: !0 }, e.rowAttrs), [
938
- (R(!0), C(H, null, P(B(m), ($) => (R(), C("div", {
939
- key: $.id,
998
+ (T(!0), $(D, null, P(K(p), (V) => (T(), $("div", {
999
+ key: V.id,
940
1000
  role: "cell",
941
- style: V(S($))
1001
+ style: F(m(V))
942
1002
  }, [
943
- A(h.$slots, "cell", {
944
- row: g.item,
945
- column: $,
946
- rowIndex: g.index,
947
- value: _(g.item, $, g.index)
1003
+ G(v.$slots, "cell", {
1004
+ row: S.item,
1005
+ column: V,
1006
+ rowIndex: S.index,
1007
+ value: _(S.item, V, S.index)
948
1008
  }, () => [
949
- pe(le(_(g.item, $, g.index)), 1)
1009
+ Oe(ce(_(S.item, V, S.index)), 1)
950
1010
  ])
951
1011
  ], 4))), 128))
952
- ], 16, Ke))), 128))
953
- ], 4)) : A(h.$slots, "empty", {}, void 0, void 0, 0)
1012
+ ], 16, Pe))), 128))
1013
+ ], 4)) : G(v.$slots, "empty", {}, void 0, void 0, 0)
954
1014
  ], 4)
955
1015
  ]),
956
1016
  _: 3
@@ -958,17 +1018,20 @@ const Ae = /* @__PURE__ */ ee({
958
1018
  }
959
1019
  });
960
1020
  export {
961
- be as MeasurementCache,
962
- Be as VirtualGrid,
963
- Ae as VirtualList,
964
- Ne as VirtualTable,
965
- Te as Virtualizer,
966
- Q as clampScrollOffset,
967
- U as normalizeSize,
968
- Re as resolveScrollOffset,
969
- ke as useVirtualGrid,
970
- ze as useVirtualList,
971
- Ce as useVirtualTable,
972
- Z as useVirtualizer
1021
+ Re as MeasurementCache,
1022
+ qe as VirtualGrid,
1023
+ Ye as VirtualList,
1024
+ Ue as VirtualTable,
1025
+ Ae as Virtualizer,
1026
+ H as clampScrollOffset,
1027
+ Ee as mapDomOffsetToVirtual,
1028
+ ke as mapVirtualOffsetToDom,
1029
+ ee as normalizeSize,
1030
+ Ve as resolveScrollOffset,
1031
+ N as scrollContentSize,
1032
+ Be as useVirtualGrid,
1033
+ ye as useVirtualList,
1034
+ He as useVirtualTable,
1035
+ te as useVirtualizer
973
1036
  };
974
1037
  //# sourceMappingURL=index.mjs.map