@pdanpdan/virtual-scroll 0.3.0 → 0.4.0

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
@@ -56,6 +56,15 @@ var FenwickTree = class {
56
56
  e > 0 ? n.set(this.values.subarray(0, Math.min(t - e, this.values.length)), e) : n.set(this.values.subarray(-e)), this.values = n, this.rebuild();
57
57
  }
58
58
  };
59
+ function isWindow(e) {
60
+ return e === null || typeof window < "u" && e === window;
61
+ }
62
+ function isBody(e) {
63
+ return !!e && typeof e == "object" && "tagName" in e && e.tagName === "BODY";
64
+ }
65
+ function isWindowLike(e) {
66
+ return isWindow(e) || isBody(e);
67
+ }
59
68
  function isElement(e) {
60
69
  return !!e && "getBoundingClientRect" in e;
61
70
  }
@@ -66,17 +75,173 @@ function isScrollToIndexOptions(e) {
66
75
  return typeof e == "object" && !!e && ("align" in e || "behavior" in e || "isCorrection" in e);
67
76
  }
68
77
  function getPaddingX(e, t) {
69
- return typeof e == "object" && e ? e.x || 0 : t === "horizontal" && e || 0;
78
+ return typeof e == "object" && e ? e.x || 0 : (t === "horizontal" || t === "both") && e || 0;
70
79
  }
71
80
  function getPaddingY(e, t) {
72
81
  return typeof e == "object" && e ? e.y || 0 : (t === "vertical" || t === "both") && e || 0;
73
82
  }
83
+ function calculateScrollTarget(e) {
84
+ let { rowIndex: t, colIndex: n, options: r, itemsLength: i, columnCount: a, direction: o, usableWidth: s, usableHeight: c, totalWidth: l, totalHeight: u, gap: d, columnGap: f, fixedSize: p, fixedWidth: m, relativeScrollX: h, relativeScrollY: g, getItemSizeY: _, getItemSizeX: v, getItemQueryY: y, getItemQueryX: b, getColumnSize: x, getColumnQuery: S, stickyIndices: C } = e, w;
85
+ w = isScrollToIndexOptions(r) ? r.align : r;
86
+ let T = (typeof w == "object" ? w.x : w) || "auto", E = (typeof w == "object" ? w.y : w) || "auto", D = o === "vertical" || o === "both", O = o === "horizontal" || o === "both", k = h, A = g, j = 0, M = 0, N = T === "auto" ? "auto" : T, P = E === "auto" ? "auto" : E;
87
+ if (t != null) {
88
+ let e = 0;
89
+ if (D && C && C.length > 0) {
90
+ let n, r = 0, i = C.length - 1;
91
+ for (; r <= i;) {
92
+ let e = r + i >>> 1;
93
+ C[e] < t ? (n = C[e], r = e + 1) : i = e - 1;
94
+ }
95
+ n !== void 0 && (e = p === null ? _(n) - d : p);
96
+ }
97
+ let n = 0;
98
+ if (t >= i ? (n = u, M = 0) : (n = p === null ? y(t) : t * (p + d), M = p === null ? _(t) - d : p), E === "start") A = n - e;
99
+ else if (E === "center") A = n - (c - M) / 2;
100
+ else if (E === "end") A = n - (c - M);
101
+ else if (!(M <= c - e ? n >= g + e - .5 && n + M <= g + c + .5 : n <= g + e + .5 && n + M >= g + c - .5)) {
102
+ let t = n - e, r = n - (c - M);
103
+ M <= c - e ? n < g + e ? (A = t, P = "start") : (A = r, P = "end") : Math.abs(t - g) < Math.abs(r - g) ? (A = t, P = "start") : (A = r, P = "end");
104
+ }
105
+ }
106
+ if (n != null) {
107
+ let e = 0;
108
+ if (O && C && C.length > 0 && (o === "horizontal" || o === "both")) {
109
+ let t, r = 0, i = C.length - 1;
110
+ for (; r <= i;) {
111
+ let e = r + i >>> 1;
112
+ C[e] < n ? (t = C[e], r = e + 1) : i = e - 1;
113
+ }
114
+ t !== void 0 && (e = o === "horizontal" ? p === null ? v(t) - f : p : m === null ? x(t) - f : m);
115
+ }
116
+ let t = 0;
117
+ if (n >= a && a > 0 ? (t = l, j = 0) : o === "horizontal" ? (t = p === null ? b(n) : n * (p + f), j = p === null ? v(n) - f : p) : (t = S(n), j = x(n) - f), T === "start") k = t - e;
118
+ else if (T === "center") k = t - (s - j) / 2;
119
+ else if (T === "end") k = t - (s - j);
120
+ else if (!(j <= s - e ? t >= h + e - .5 && t + j <= h + s + .5 : t <= h + e + .5 && t + j >= h + s - .5)) {
121
+ let n = t - e, r = t - (s - j);
122
+ j <= s - e ? t < h + e ? (k = n, N = "start") : (k = r, N = "end") : Math.abs(n - h) < Math.abs(r - h) ? (k = n, N = "start") : (k = r, N = "end");
123
+ }
124
+ }
125
+ return k = Math.max(0, Math.min(k, Math.max(0, l - s))), A = Math.max(0, Math.min(A, Math.max(0, u - c))), {
126
+ targetX: k,
127
+ targetY: A,
128
+ itemWidth: j,
129
+ itemHeight: M,
130
+ effectiveAlignX: N,
131
+ effectiveAlignY: P
132
+ };
133
+ }
134
+ function calculateRange(e) {
135
+ let { direction: t, relativeScrollX: n, relativeScrollY: r, usableWidth: i, usableHeight: a, itemsLength: o, bufferBefore: s, bufferAfter: c, gap: l, columnGap: u, fixedSize: d, findLowerBoundY: f, findLowerBoundX: p, queryY: m, queryX: h } = e, g = t === "vertical" || t === "both", _ = 0, v = o;
136
+ if (g) if (d !== null) _ = Math.floor(r / (d + l)), v = Math.ceil((r + a) / (d + l));
137
+ else {
138
+ _ = f(r);
139
+ let e = r + a;
140
+ v = f(e), v < o && m(v) < e && v++;
141
+ }
142
+ else if (d !== null) _ = Math.floor(n / (d + u)), v = Math.ceil((n + i) / (d + u));
143
+ else {
144
+ _ = p(n);
145
+ let e = n + i;
146
+ v = p(e), v < o && h(v) < e && v++;
147
+ }
148
+ return {
149
+ start: Math.max(0, _ - s),
150
+ end: Math.min(o, v + c)
151
+ };
152
+ }
153
+ function calculateColumnRange(e) {
154
+ let { columnCount: t, relativeScrollX: n, usableWidth: r, colBuffer: i, fixedWidth: a, columnGap: o, findLowerBound: s, query: c, totalColsQuery: l } = e;
155
+ if (!t) return {
156
+ start: 0,
157
+ end: 0,
158
+ padStart: 0,
159
+ padEnd: 0
160
+ };
161
+ let u = 0, d = t;
162
+ if (a !== null) u = Math.floor(n / (a + o)), d = Math.ceil((n + r) / (a + o));
163
+ else {
164
+ u = s(n);
165
+ let e = c(u), i = u;
166
+ for (; i < t && e < n + r;) e = c(++i);
167
+ d = i;
168
+ }
169
+ let f = Math.max(0, u - i), p = Math.min(t, d + i), m = a === null ? c(f) : f * (a + o), h = a === null ? Math.max(0, l() - o) : t * (a + o) - o, g = a === null ? c(p) - (p >= t ? o : 0) : p * (a + o) - (p >= t ? o : 0);
170
+ return {
171
+ start: f,
172
+ end: p,
173
+ padStart: m,
174
+ padEnd: Math.max(0, h - g)
175
+ };
176
+ }
177
+ function calculateStickyItem(e) {
178
+ let { index: t, isSticky: n, direction: r, relativeScrollX: i, relativeScrollY: a, originalX: o, originalY: s, width: c, height: l, stickyIndices: u, fixedSize: d, fixedWidth: f, gap: p, columnGap: m, getItemQueryY: h, getItemQueryX: g } = e, _ = !1, v = {
179
+ x: 0,
180
+ y: 0
181
+ };
182
+ if (!n) return {
183
+ isStickyActive: _,
184
+ stickyOffset: v
185
+ };
186
+ if ((r === "vertical" || r === "both") && a > s) {
187
+ let e, n = 0, r = u.length - 1;
188
+ for (; n <= r;) {
189
+ let i = n + r >>> 1;
190
+ u[i] > t ? (e = u[i], r = i - 1) : n = i + 1;
191
+ }
192
+ if (e !== void 0) {
193
+ let t = d === null ? h(e) : e * (d + p);
194
+ a >= t ? _ = !1 : (_ = !0, v.y = Math.max(0, Math.min(l, t - a)) - l);
195
+ } else _ = !0;
196
+ }
197
+ if ((r === "horizontal" || r === "both" && !_) && i > o) {
198
+ let e, n = 0, a = u.length - 1;
199
+ for (; n <= a;) {
200
+ let r = n + a >>> 1;
201
+ u[r] > t ? (e = u[r], a = r - 1) : n = r + 1;
202
+ }
203
+ if (e !== void 0) {
204
+ let t = r === "horizontal" ? d === null ? g(e) : e * (d + m) : f === null ? g(e) : e * (f + m);
205
+ i >= t ? _ = !1 : (_ = !0, v.x = Math.max(0, Math.min(c, t - i)) - c);
206
+ } else _ = !0;
207
+ }
208
+ return {
209
+ isStickyActive: _,
210
+ stickyOffset: v
211
+ };
212
+ }
213
+ function calculateItemPosition(e) {
214
+ let { index: t, direction: n, fixedSize: r, gap: i, columnGap: a, usableWidth: o, usableHeight: s, totalWidth: c, queryY: l, queryX: u, getSizeY: d, getSizeX: f } = e, p = 0, m = 0, h = 0, g = 0;
215
+ return n === "horizontal" ? (p = r === null ? u(t) : t * (r + a), h = r === null ? f(t) - a : r, g = s) : (m = (n === "vertical" || n === "both") && r !== null ? t * (r + i) : l(t), g = r === null ? d(t) - i : r, h = n === "both" ? c : o), {
216
+ height: g,
217
+ width: h,
218
+ x: p,
219
+ y: m
220
+ };
221
+ }
222
+ function calculateItemStyle(e) {
223
+ let { item: t, direction: n, itemSize: r, containerTag: i, paddingStartX: a, paddingStartY: o, isHydrated: s } = e, c = n === "vertical", l = n === "horizontal", u = n === "both", d = r == null || r === 0, f = { blockSize: l ? "100%" : d ? "auto" : `${t.size.height}px` };
224
+ return c && i === "table" ? f.minInlineSize = "100%" : f.inlineSize = c ? "100%" : d ? "auto" : `${t.size.width}px`, d && (c || (f.minInlineSize = "1px"), l || (f.minBlockSize = "1px")), s && (t.isStickyActive ? ((c || u) && (f.insetBlockStart = `${o}px`), (l || u) && (f.insetInlineStart = `${a}px`), f.transform = `translate(${t.stickyOffset.x}px, ${t.stickyOffset.y}px)`) : f.transform = `translate(${t.offset.x}px, ${t.offset.y}px)`), f;
225
+ }
226
+ function calculateTotalSize(e) {
227
+ let { direction: t, itemsLength: n, columnCount: r, fixedSize: i, fixedWidth: a, gap: o, columnGap: s, usableWidth: c, usableHeight: l, queryY: u, queryX: d, queryColumn: f } = e, p = 0, m = 0;
228
+ return t === "both" ? (r > 0 && (p = a === null ? Math.max(0, f(r) - s) : r * (a + s) - s), m = i === null ? Math.max(0, u(n) - (n > 0 ? o : 0)) : Math.max(0, n * (i + o) - (n > 0 ? o : 0)), p = Math.max(p, c), m = Math.max(m, l)) : t === "horizontal" ? (p = i === null ? Math.max(0, d(n) - (n > 0 ? s : 0)) : Math.max(0, n * (i + s) - (n > 0 ? s : 0)), m = l) : (p = c, m = i === null ? Math.max(0, u(n) - (n > 0 ? o : 0)) : Math.max(0, n * (i + o) - (n > 0 ? o : 0))), {
229
+ width: p,
230
+ height: m
231
+ };
232
+ }
74
233
  const DEFAULT_ITEM_SIZE = 40, DEFAULT_COLUMN_WIDTH = 100, DEFAULT_BUFFER = 5;
75
234
  function useVirtualScroll(e) {
76
235
  let n = ref(0), r = ref(0), i = ref(!1), a = ref(!1), o = ref(!1), l = ref(!1), u = ref(0), p = ref(0), g = reactive({
77
236
  x: 0,
78
237
  y: 0
79
- }), _, v = ref(!1), y = new FenwickTree(e.value.items.length), b = new FenwickTree(e.value.items.length), x = new FenwickTree(e.value.columnCount || 0), C = ref(0), D = new Uint8Array(), O = new Uint8Array(), k = new Uint8Array(), A = ref(null), re = ref(!1), j = [], M = computed(() => e.value.itemSize === void 0 || e.value.itemSize === null || e.value.itemSize === 0), N = computed(() => e.value.columnWidth === void 0 || e.value.columnWidth === null || e.value.columnWidth === 0), P = computed(() => typeof e.value.itemSize == "number" && e.value.itemSize > 0 ? e.value.itemSize : null), F = computed(() => e.value.defaultItemSize || P.value || 40), I = computed(() => [...e.value.stickyIndices || []].sort((e, t) => e - t)), L = computed(() => {
238
+ }), _, v = ref(!1), y = new FenwickTree(e.value.items?.length || 0), b = new FenwickTree(e.value.items?.length || 0), x = new FenwickTree(e.value.columnCount || 0), C = ref(0), T = new Uint8Array(), E = new Uint8Array(), D = new Uint8Array(), I = ref(null), re = ref(!1), L = [], R = computed(() => e.value.itemSize === void 0 || e.value.itemSize === null || e.value.itemSize === 0), ie = computed(() => e.value.columnWidth === void 0 || e.value.columnWidth === null || e.value.columnWidth === 0), z = computed(() => typeof e.value.itemSize == "number" && e.value.itemSize > 0 ? e.value.itemSize : null), B = computed(() => typeof e.value.columnWidth == "number" && e.value.columnWidth > 0 ? e.value.columnWidth : null), V = computed(() => e.value.defaultItemSize || z.value || 40), H = computed(() => [...e.value.stickyIndices || []].sort((e, t) => e - t)), U = computed(() => new Set(H.value)), W = computed(() => getPaddingX(e.value.scrollPaddingStart, e.value.direction)), ae = computed(() => getPaddingX(e.value.scrollPaddingEnd, e.value.direction)), oe = computed(() => getPaddingY(e.value.scrollPaddingStart, e.value.direction)), G = computed(() => getPaddingY(e.value.scrollPaddingEnd, e.value.direction)), K = computed(() => {
239
+ let t = e.value.direction === "horizontal" || e.value.direction === "both";
240
+ return u.value - (t ? W.value + ae.value : 0);
241
+ }), q = computed(() => {
242
+ let t = e.value.direction === "vertical" || e.value.direction === "both";
243
+ return p.value - (t ? oe.value + G.value : 0);
244
+ }), J = computed(() => {
80
245
  if (C.value, !a.value && e.value.ssrRange && !l.value) {
81
246
  let { start: t = 0, end: n = 0, colStart: r = 0, colEnd: i = 0 } = e.value.ssrRange, a = e.value.columnCount || 0;
82
247
  if (e.value.direction === "both") {
@@ -84,56 +249,62 @@ function useVirtualScroll(e) {
84
249
  let t = i || a, n = x.query(t) - x.query(r);
85
250
  return Math.max(0, n - (t > r && e.value.columnGap || 0));
86
251
  }
87
- /* v8 ignore else -- @preserve */
88
252
  if (e.value.direction === "horizontal") {
89
- if (P.value !== null) {
253
+ if (z.value !== null) {
90
254
  let r = n - t;
91
- return Math.max(0, r * (P.value + (e.value.columnGap || 0)) - (r > 0 && e.value.columnGap || 0));
255
+ return Math.max(0, r * (z.value + (e.value.columnGap || 0)) - (r > 0 && e.value.columnGap || 0));
92
256
  }
93
257
  let r = y.query(n) - y.query(t);
94
258
  return Math.max(0, r - (n > t && e.value.columnGap || 0));
95
259
  }
96
260
  }
97
- if (e.value.direction === "both") {
98
- let t = e.value.columnCount || 0;
99
- if (t <= 0) return 0;
100
- let n = x.query(t);
101
- return Math.max(0, n - (e.value.columnGap || 0));
102
- }
103
- if (e.value.direction === "vertical") return 0;
104
- if (P.value !== null) {
105
- let t = e.value.items.length;
106
- return Math.max(0, t * (P.value + (e.value.columnGap || 0)) - (t > 0 && e.value.columnGap || 0));
107
- }
108
- let t = y.query(e.value.items.length);
109
- return Math.max(0, t - (e.value.items.length > 0 && e.value.columnGap || 0));
110
- }), R = computed(() => {
261
+ return calculateTotalSize({
262
+ direction: e.value.direction || "vertical",
263
+ itemsLength: e.value.items.length,
264
+ columnCount: e.value.columnCount || 0,
265
+ fixedSize: z.value,
266
+ fixedWidth: B.value,
267
+ gap: e.value.gap || 0,
268
+ columnGap: e.value.columnGap || 0,
269
+ usableWidth: K.value,
270
+ usableHeight: q.value,
271
+ queryY: (e) => b.query(e),
272
+ queryX: (e) => y.query(e),
273
+ queryColumn: (e) => x.query(e)
274
+ }).width;
275
+ }), Y = computed(() => {
111
276
  if (C.value, !a.value && e.value.ssrRange && !l.value) {
112
277
  let { start: t, end: n } = e.value.ssrRange;
113
- /* v8 ignore else -- @preserve */
114
278
  if (e.value.direction === "vertical" || e.value.direction === "both") {
115
- if (P.value !== null) {
279
+ if (z.value !== null) {
116
280
  let r = n - t;
117
- return Math.max(0, r * (P.value + (e.value.gap || 0)) - (r > 0 && e.value.gap || 0));
281
+ return Math.max(0, r * (z.value + (e.value.gap || 0)) - (r > 0 && e.value.gap || 0));
118
282
  }
119
283
  let r = b.query(n) - b.query(t);
120
284
  return Math.max(0, r - (n > t && e.value.gap || 0));
121
285
  }
122
286
  }
123
- if (e.value.direction === "horizontal") return 0;
124
- if (P.value !== null) {
125
- let t = e.value.items.length;
126
- return Math.max(0, t * (P.value + (e.value.gap || 0)) - (t > 0 && e.value.gap || 0));
127
- }
128
- let t = b.query(e.value.items.length);
129
- return Math.max(0, t - (e.value.items.length > 0 && e.value.gap || 0));
130
- }), z = computed(() => {
287
+ return calculateTotalSize({
288
+ direction: e.value.direction || "vertical",
289
+ itemsLength: e.value.items.length,
290
+ columnCount: e.value.columnCount || 0,
291
+ fixedSize: z.value,
292
+ fixedWidth: B.value,
293
+ gap: e.value.gap || 0,
294
+ columnGap: e.value.columnGap || 0,
295
+ usableWidth: K.value,
296
+ usableHeight: q.value,
297
+ queryY: (e) => b.query(e),
298
+ queryX: (e) => y.query(e),
299
+ queryColumn: (e) => x.query(e)
300
+ }).height;
301
+ }), X = computed(() => {
131
302
  let t = e.value.direction === "horizontal" || e.value.direction === "both" ? getPaddingX(e.value.scrollPaddingStart, e.value.direction) : 0;
132
303
  return Math.max(0, n.value + t - g.x);
133
- }), B = computed(() => {
304
+ }), Z = computed(() => {
134
305
  let t = e.value.direction === "vertical" || e.value.direction === "both" ? getPaddingY(e.value.scrollPaddingStart, e.value.direction) : 0;
135
306
  return Math.max(0, r.value + t - g.y);
136
- }), V = (t) => {
307
+ }), se = (t) => {
137
308
  C.value;
138
309
  let n = e.value.columnWidth;
139
310
  if (typeof n == "number" && n > 0) return n;
@@ -142,119 +313,141 @@ function useVirtualScroll(e) {
142
313
  return r != null && r > 0 ? r : e.value.defaultColumnWidth || 100;
143
314
  }
144
315
  return typeof n == "function" ? n(t) : x.get(t) || e.value.defaultColumnWidth || 100;
145
- }, H = (t, a, o) => {
146
- let s = typeof o == "object" && o && "isCorrection" in o ? o.isCorrection : !1;
147
- s || (A.value = {
316
+ }, ce = (t, i, a) => {
317
+ let o = typeof a == "object" && a && "isCorrection" in a ? a.isCorrection : !1, s = e.value.container || window, c = e.value.direction === "vertical" || e.value.direction === "both", l = e.value.direction === "horizontal" || e.value.direction === "both", { targetX: u, targetY: d, effectiveAlignX: f, effectiveAlignY: p } = calculateScrollTarget({
148
318
  rowIndex: t,
149
- colIndex: a,
150
- options: o
319
+ colIndex: i,
320
+ options: a,
321
+ itemsLength: e.value.items.length,
322
+ columnCount: e.value.columnCount || 0,
323
+ direction: e.value.direction || "vertical",
324
+ usableWidth: K.value,
325
+ usableHeight: q.value,
326
+ totalWidth: J.value,
327
+ totalHeight: Y.value,
328
+ gap: e.value.gap || 0,
329
+ columnGap: e.value.columnGap || 0,
330
+ fixedSize: z.value,
331
+ fixedWidth: B.value,
332
+ relativeScrollX: X.value,
333
+ relativeScrollY: Z.value,
334
+ getItemSizeY: (e) => b.get(e),
335
+ getItemSizeX: (e) => y.get(e),
336
+ getItemQueryY: (e) => b.query(e),
337
+ getItemQueryX: (e) => y.query(e),
338
+ getColumnSize: (e) => x.get(e),
339
+ getColumnQuery: (e) => x.query(e),
340
+ stickyIndices: H.value
151
341
  });
152
- let c = e.value.container || window, l = P.value, d = e.value.gap || 0, f = e.value.columnGap || 0, m, h;
153
- isScrollToIndexOptions(o) ? (m = o.align, h = o.behavior) : m = o;
154
- let _ = (typeof m == "object" ? m.x : m) || "auto", S = (typeof m == "object" ? m.y : m) || "auto", C = getPaddingX(e.value.scrollPaddingStart, e.value.direction), w = getPaddingX(e.value.scrollPaddingEnd, e.value.direction), D = getPaddingY(e.value.scrollPaddingStart, e.value.direction), O = getPaddingY(e.value.scrollPaddingEnd, e.value.direction), k = e.value.direction === "vertical" || e.value.direction === "both", re = e.value.direction === "horizontal" || e.value.direction === "both", j = u.value - (re ? C + w : 0), M = p.value - (k ? D + O : 0), N = z.value, F = B.value, I = 0, V = 0;
155
- if (t != null && (t >= e.value.items.length ? (F = R.value, V = 0) : (F = l === null ? b.query(t) : t * (l + d), V = l === null ? b.get(t) - d : l), S === "start" || (S === "center" ? F -= (M - V) / 2 : S === "end" ? F -= M - V : F >= B.value && F + V <= B.value + M || F < B.value || (F -= M - V))), a != null) {
156
- let t = e.value.columnCount || 0;
157
- a >= t && t > 0 ? (N = L.value, I = 0) : e.value.direction === "horizontal" ? (N = l === null ? y.query(a) : a * (l + f), I = l === null ? y.get(a) - f : l) : (N = x.query(a), I = x.get(a) - f), _ === "start" || (_ === "center" ? N -= (j - I) / 2 : _ === "end" ? N -= j - I : N >= z.value && N + I <= z.value + j || N < z.value || (N -= j - I));
158
- }
159
- N = Math.max(0, Math.min(N, Math.max(0, L.value - j))), F = Math.max(0, Math.min(F, Math.max(0, R.value - M)));
160
- let H = N + g.x - (re ? C : 0), U = F + g.y - (k ? D : 0), W = a == null || Math.abs(z.value - N) < 1, G = t == null || Math.abs(B.value - F) < 1;
161
- if (!W || !G) {
162
- let e = 0, n = 0, r = 0, i = 0, o = 0, s = 0;
163
- /* v8 ignore else -- @preserve */
164
- if (typeof window < "u") {
165
- if (c === window ? (e = window.scrollX, n = window.scrollY, r = document.documentElement.scrollWidth, i = document.documentElement.scrollHeight, o = window.innerWidth, s = window.innerHeight) : isElement(c) && (e = c.scrollLeft, n = c.scrollTop, r = c.scrollWidth, i = c.scrollHeight, o = c.clientWidth, s = c.clientHeight), !W && a != null) {
166
- let t = e <= 1 && H <= 1, n = e >= r - o - 1 && H >= r - o - 1;
167
- /* v8 ignore else -- @preserve */
168
- (t || n) && (W = !0);
342
+ if (!o) {
343
+ let e = isScrollToIndexOptions(a) ? a.behavior : void 0;
344
+ I.value = {
345
+ rowIndex: t,
346
+ colIndex: i,
347
+ options: {
348
+ align: {
349
+ x: f,
350
+ y: p
351
+ },
352
+ ...e == null ? {} : { behavior: e }
169
353
  }
170
- if (!G && t != null) {
171
- let e = n <= 1 && U <= 1, t = n >= i - s - 1 && U >= i - s - 1;
172
- (e || t) && (G = !0);
173
- }
174
- }
354
+ };
175
355
  }
176
- let K = s ? "auto" : h || "smooth";
177
- if (v.value = !0, typeof window < "u" && c === window) window.scrollTo({
178
- left: a == null ? void 0 : Math.max(0, H),
179
- top: t == null ? void 0 : Math.max(0, U),
180
- behavior: K
356
+ let m = u + g.x - (l ? W.value : 0), h = d + g.y - (c ? oe.value : 0), _;
357
+ isScrollToIndexOptions(a) && (_ = a.behavior);
358
+ let S = o ? "auto" : _ || "smooth";
359
+ if (v.value = !0, typeof window < "u" && s === window) window.scrollTo({
360
+ left: i == null ? void 0 : Math.max(0, m),
361
+ top: t == null ? void 0 : Math.max(0, h),
362
+ behavior: S
181
363
  });
182
- else if (isScrollableElement(c)) {
183
- let e = { behavior: K };
184
- a != null && (e.left = Math.max(0, H)), t != null && (e.top = Math.max(0, U)), typeof c.scrollTo == "function" ? c.scrollTo(e) : (e.left !== void 0 && (c.scrollLeft = e.left), e.top !== void 0 && (c.scrollTop = e.top));
364
+ else if (isScrollableElement(s)) {
365
+ let e = { behavior: S };
366
+ i != null && (e.left = Math.max(0, m)), t != null && (e.top = Math.max(0, h)), typeof s.scrollTo == "function" ? s.scrollTo(e) : (e.left !== void 0 && (s.scrollLeft = e.left), e.top !== void 0 && (s.scrollTop = e.top));
185
367
  }
186
- (K === "auto" || K === void 0) && (a != null && (n.value = Math.max(0, H)), t != null && (r.value = Math.max(0, U))), W && G && !i.value && (A.value = null);
187
- }, U = (t, i, a) => {
368
+ (S === "auto" || S === void 0) && (i != null && (n.value = Math.max(0, m)), t != null && (r.value = Math.max(0, h)));
369
+ }, le = (t, i, a) => {
188
370
  let o = e.value.container || window;
189
371
  v.value = !0;
190
- let s = e.value.direction === "vertical" || e.value.direction === "both", c = e.value.direction === "horizontal" || e.value.direction === "both", l = getPaddingX(e.value.scrollPaddingStart, e.value.direction), d = getPaddingY(e.value.scrollPaddingStart, e.value.direction), f = getPaddingX(e.value.scrollPaddingEnd, e.value.direction), m = getPaddingY(e.value.scrollPaddingEnd, e.value.direction), h = u.value - (c ? l + f : 0), _ = p.value - (s ? d + m : 0), y = t == null ? null : c ? Math.max(0, Math.min(t, Math.max(0, L.value - h))) : Math.max(0, t), b = i == null ? null : s ? Math.max(0, Math.min(i, Math.max(0, R.value - _))) : Math.max(0, i), x = typeof window < "u" && o === window ? window.scrollX : o.scrollLeft, S = typeof window < "u" && o === window ? window.scrollY : o.scrollTop, C = y === null ? x : y + g.x - (c ? l : 0), w = b === null ? S : b + g.y - (s ? d : 0);
372
+ let s = e.value.direction === "vertical" || e.value.direction === "both", c = e.value.direction === "horizontal" || e.value.direction === "both", l = t == null ? null : c ? Math.max(0, Math.min(t, Math.max(0, J.value - K.value))) : Math.max(0, t), u = i == null ? null : s ? Math.max(0, Math.min(i, Math.max(0, Y.value - q.value))) : Math.max(0, i), d = typeof window < "u" && o === window ? window.scrollX : o.scrollLeft, f = typeof window < "u" && o === window ? window.scrollY : o.scrollTop, p = l === null ? d : l + g.x - (c ? W.value : 0), m = u === null ? f : u + g.y - (s ? oe.value : 0);
191
373
  if (typeof window < "u" && o === window) window.scrollTo({
192
- left: t == null ? void 0 : C,
193
- top: i == null ? void 0 : w,
374
+ left: t == null ? void 0 : p,
375
+ top: i == null ? void 0 : m,
194
376
  behavior: a?.behavior || "auto"
195
377
  });
196
378
  else if (isScrollableElement(o)) {
197
379
  let e = { behavior: a?.behavior || "auto" };
198
- t != null && (e.left = C), i != null && (e.top = w), typeof o.scrollTo == "function" ? o.scrollTo(e) : (e.left !== void 0 && (o.scrollLeft = e.left), e.top !== void 0 && (o.scrollTop = e.top));
380
+ t != null && (e.left = p), i != null && (e.top = m), typeof o.scrollTo == "function" ? o.scrollTo(e) : (e.left !== void 0 && (o.scrollLeft = e.left), e.top !== void 0 && (o.scrollTop = e.top));
199
381
  }
200
- (a?.behavior === "auto" || a?.behavior === void 0) && (t != null && (n.value = C), i != null && (r.value = w));
201
- }, W = () => {
382
+ (a?.behavior === "auto" || a?.behavior === void 0) && (t != null && (n.value = p), i != null && (r.value = m));
383
+ }, ue = () => {
202
384
  let t = e.value.items, n = t.length, r = e.value.columnCount || 0;
203
- if (y.resize(n), b.resize(n), x.resize(r), O.length !== n) {
385
+ if (y.resize(n), b.resize(n), x.resize(r), E.length !== n) {
204
386
  let e = new Uint8Array(n);
205
- e.set(O.subarray(0, Math.min(n, O.length))), O = e;
387
+ e.set(E.subarray(0, Math.min(n, E.length))), E = e;
206
388
  }
207
- if (k.length !== n) {
389
+ if (D.length !== n) {
208
390
  let e = new Uint8Array(n);
209
- e.set(k.subarray(0, Math.min(n, k.length))), k = e;
391
+ e.set(D.subarray(0, Math.min(n, D.length))), D = e;
210
392
  }
211
- if (D.length !== r) {
393
+ if (T.length !== r) {
212
394
  let e = new Uint8Array(r);
213
- e.set(D.subarray(0, Math.min(r, D.length))), D = e;
395
+ e.set(T.subarray(0, Math.min(r, T.length))), T = e;
214
396
  }
215
397
  let i = 0;
216
- if (e.value.restoreScrollOnPrepend && j.length > 0 && n > j.length) {
217
- let e = j[0];
218
- /* v8 ignore else -- @preserve */
398
+ if (e.value.restoreScrollOnPrepend && L.length > 0 && n > L.length) {
399
+ let e = L[0];
219
400
  if (e !== void 0) {
220
- for (let r = 1; r <= n - j.length; r++) if (t[r] === e) {
401
+ for (let r = 1; r <= n - L.length; r++) if (t[r] === e) {
221
402
  i = r;
222
403
  break;
223
404
  }
224
405
  }
225
406
  }
226
407
  if (i > 0) {
227
- y.shift(i), b.shift(i), A.value && A.value.rowIndex !== null && A.value.rowIndex !== void 0 && (A.value.rowIndex += i);
408
+ y.shift(i), b.shift(i), I.value && I.value.rowIndex !== null && I.value.rowIndex !== void 0 && (I.value.rowIndex += i);
228
409
  let r = new Uint8Array(n), a = new Uint8Array(n);
229
- r.set(O.subarray(0, Math.min(n - i, O.length)), i), a.set(k.subarray(0, Math.min(n - i, k.length)), i), O = r, k = a;
410
+ r.set(E.subarray(0, Math.min(n - i, E.length)), i), a.set(D.subarray(0, Math.min(n - i, D.length)), i), E = r, D = a;
230
411
  let o = e.value.gap || 0, s = e.value.columnGap || 0, l = 0, u = 0;
231
412
  for (let n = 0; n < i; n++) {
232
- let r = typeof e.value.itemSize == "function" ? e.value.itemSize(t[n], n) : F.value;
413
+ let r = typeof e.value.itemSize == "function" ? e.value.itemSize(t[n], n) : V.value;
233
414
  e.value.direction === "horizontal" ? l += r + s : u += r + o;
234
415
  }
235
- /* v8 ignore else -- @preserve */
236
416
  (l > 0 || u > 0) && nextTick(() => {
237
- U(l > 0 ? z.value + l : null, u > 0 ? B.value + u : null, { behavior: "auto" });
417
+ le(l > 0 ? X.value + l : null, u > 0 ? Z.value + u : null, { behavior: "auto" });
238
418
  });
239
419
  }
240
420
  if (r > 0) {
241
- let t = e.value.columnGap || 0, n = !1;
242
- for (let e = 0; e < r; e++) {
243
- let r = V(e), i = x.get(e), a = D[e] === 1;
244
- if (!N.value || !a || i === 0) {
245
- let a = r + t;
246
- Math.abs(i - a) > .5 ? (x.set(e, a), D[e] = N.value ? 0 : 1, n = !0) : N.value || (D[e] = 1);
421
+ let t = e.value.columnGap || 0, n = !1, i = e.value.columnWidth;
422
+ for (let a = 0; a < r; a++) {
423
+ let r = x.get(a), o = T[a] === 1;
424
+ if (!ie.value || !o && r === 0) {
425
+ let o = 0;
426
+ o = typeof i == "number" && i > 0 ? i : Array.isArray(i) && i.length > 0 ? i[a % i.length] || e.value.defaultColumnWidth || 100 : typeof i == "function" ? i(a) : e.value.defaultColumnWidth || 100;
427
+ let s = o + t;
428
+ Math.abs(r - s) > .5 ? (x.set(a, s), T[a] = ie.value ? 0 : 1, n = !0) : ie.value || (T[a] = 1);
247
429
  }
248
430
  }
249
431
  n && x.rebuild();
250
432
  }
251
433
  let a = e.value.gap || 0, o = e.value.columnGap || 0, s = !1;
252
434
  for (let t = 0; t < n; t++) {
253
- let n = e.value.items[t], r = y.get(t), i = b.get(t), c = typeof e.value.itemSize == "function" ? e.value.itemSize(n, t) : F.value, l = e.value.direction === "vertical", u = e.value.direction === "horizontal", d = e.value.direction === "both", f = u ? c + o : 0, p = l || d ? c + a : 0, m = O[t] === 1, h = k[t] === 1;
254
- u ? (!M.value || !m || r === 0) && (Math.abs(r - f) > .5 ? (y.set(t, f), O[t] = M.value ? 0 : 1, s = !0) : M.value || (O[t] = 1)) : r !== 0 && (y.set(t, 0), O[t] = 0, s = !0), l || d ? (!M.value || !h || i === 0) && (Math.abs(i - p) > .5 ? (b.set(t, p), k[t] = M.value ? 0 : 1, s = !0) : M.value || (k[t] = 1)) : i !== 0 && (b.set(t, 0), k[t] = 0, s = !0);
435
+ let n = e.value.items[t], r = y.get(t), i = b.get(t), c = e.value.direction === "vertical", l = e.value.direction === "horizontal", u = e.value.direction === "both", d = E[t] === 1, f = D[t] === 1;
436
+ if (l) {
437
+ if (!R.value || !d && r === 0) {
438
+ let i = (typeof e.value.itemSize == "function" ? e.value.itemSize(n, t) : V.value) + o;
439
+ Math.abs(r - i) > .5 ? (y.set(t, i), E[t] = R.value ? 0 : 1, s = !0) : R.value || (E[t] = 1);
440
+ }
441
+ } else r !== 0 && (y.set(t, 0), E[t] = 0, s = !0);
442
+ if (c || u) {
443
+ if (!R.value || !f && i === 0) {
444
+ let r = (typeof e.value.itemSize == "function" ? e.value.itemSize(n, t) : V.value) + a;
445
+ Math.abs(i - r) > .5 ? (b.set(t, r), D[t] = R.value ? 0 : 1, s = !0) : R.value || (D[t] = 1);
446
+ }
447
+ } else i !== 0 && (b.set(t, 0), D[t] = 0, s = !0);
255
448
  }
256
- s && (y.rebuild(), b.rebuild()), j = [...t], re.value = !0, C.value++;
257
- }, G = () => {
449
+ s && (y.rebuild(), b.rebuild()), L = [...t], re.value = !0, C.value++;
450
+ }, Q = () => {
258
451
  if (e.value.hostElement && typeof window < "u") {
259
452
  let t = e.value.hostElement.getBoundingClientRect(), n = e.value.container || window, r = 0, i = 0;
260
453
  if (n === window) r = t.left + window.scrollX, i = t.top + window.scrollY;
@@ -268,6 +461,7 @@ function useVirtualScroll(e) {
268
461
  };
269
462
  watch([
270
463
  () => e.value.items,
464
+ () => e.value.items.length,
271
465
  () => e.value.direction,
272
466
  () => e.value.columnCount,
273
467
  () => e.value.columnWidth,
@@ -276,110 +470,115 @@ function useVirtualScroll(e) {
276
470
  () => e.value.columnGap,
277
471
  () => e.value.defaultItemSize,
278
472
  () => e.value.defaultColumnWidth
279
- ], W, { immediate: !0 }), watch(() => [e.value.container, e.value.hostElement], () => {
280
- G();
473
+ ], ue, { immediate: !0 }), watch(() => [e.value.container, e.value.hostElement], () => {
474
+ Q();
281
475
  });
282
- let K = computed(() => {
476
+ let de = computed(() => {
283
477
  if (C.value, (!a.value || o.value) && e.value.ssrRange) return {
284
478
  start: e.value.ssrRange.start,
285
479
  end: e.value.ssrRange.end
286
480
  };
287
- let t = e.value.direction || "vertical", n = e.value.ssrRange && !i.value ? 0 : e.value.bufferBefore ?? 5, r = e.value.bufferAfter ?? 5, s = e.value.gap || 0, c = e.value.columnGap || 0, l = P.value, d = getPaddingX(e.value.scrollPaddingStart, t), f = getPaddingX(e.value.scrollPaddingEnd, t), m = getPaddingY(e.value.scrollPaddingStart, t), h = getPaddingY(e.value.scrollPaddingEnd, t), g = t === "vertical" || t === "both", _ = t === "horizontal" || t === "both", v = u.value - (_ ? d + f : 0), x = p.value - (g ? m + h : 0), S = 0, w = e.value.items.length;
288
- if (g) if (l !== null) S = Math.floor(B.value / (l + s)), w = Math.ceil((B.value + x) / (l + s));
289
- else {
290
- S = b.findLowerBound(B.value);
291
- let t = b.query(S), n = S;
292
- for (; n < e.value.items.length && t < B.value + x;) t = b.query(++n);
293
- w = n;
294
- }
295
- else if (l !== null) S = Math.floor(z.value / (l + c)), w = Math.ceil((z.value + v) / (l + c));
296
- else {
297
- S = y.findLowerBound(z.value);
298
- let t = y.query(S), n = S;
299
- for (; n < e.value.items.length && t < z.value + v;) t = y.query(++n);
300
- w = n;
301
- }
302
- return {
303
- start: Math.max(0, S - n),
304
- end: Math.min(e.value.items.length, w + r)
305
- };
306
- }), q = computed(() => {
481
+ let t = e.value.ssrRange && !i.value ? 0 : e.value.bufferBefore ?? 5, n = e.value.bufferAfter ?? 5;
482
+ return calculateRange({
483
+ direction: e.value.direction || "vertical",
484
+ relativeScrollX: X.value,
485
+ relativeScrollY: Z.value,
486
+ usableWidth: K.value,
487
+ usableHeight: q.value,
488
+ itemsLength: e.value.items.length,
489
+ bufferBefore: t,
490
+ bufferAfter: n,
491
+ gap: e.value.gap || 0,
492
+ columnGap: e.value.columnGap || 0,
493
+ fixedSize: z.value,
494
+ findLowerBoundY: (e) => b.findLowerBound(e),
495
+ findLowerBoundX: (e) => y.findLowerBound(e),
496
+ queryY: (e) => b.query(e),
497
+ queryX: (e) => y.query(e)
498
+ });
499
+ }), fe = computed(() => {
307
500
  C.value;
308
- let t = P.value, n = e.value.gap || 0, r = e.value.columnGap || 0;
309
- return e.value.direction === "horizontal" ? t === null ? y.findLowerBound(z.value) : Math.floor(z.value / (t + r)) : t === null ? b.findLowerBound(B.value) : Math.floor(B.value / (t + n));
310
- }), ie = computed(() => {
501
+ let t = z.value, n = e.value.gap || 0, r = e.value.columnGap || 0;
502
+ return e.value.direction === "horizontal" ? t === null ? y.findLowerBound(X.value) : Math.floor(X.value / (t + r)) : t === null ? b.findLowerBound(Z.value) : Math.floor(Z.value / (t + n));
503
+ }), $ = [], pe = computed(() => {
311
504
  C.value;
312
- let { start: t, end: n } = K.value, r = [], i = P.value, o = e.value.gap || 0, s = e.value.columnGap || 0, c = I.value, l = /* @__PURE__ */ new Set();
313
- for (let e = t; e < n; e++) l.add(e);
505
+ let { start: t, end: n } = de.value, r = [], i = z.value, o = e.value.gap || 0, s = e.value.columnGap || 0, c = H.value, l = U.value, u = /* @__PURE__ */ new Set();
506
+ for (let e = t; e < n; e++) u.add(e);
314
507
  if (a.value || !e.value.ssrRange) {
315
- let e = q.value, r, i = 0, a = c.length - 1;
508
+ let e = fe.value, r, i = 0, a = c.length - 1;
316
509
  for (; i <= a;) {
317
510
  let t = i + a >>> 1;
318
511
  c[t] < e ? (r = c[t], i = t + 1) : a = t - 1;
319
512
  }
320
- r !== void 0 && l.add(r);
321
- for (let e of c) e >= t && e < n && l.add(e);
513
+ r !== void 0 && u.add(r);
514
+ let o = 0, s = c.length - 1, l = -1;
515
+ for (; o <= s;) {
516
+ let e = o + s >>> 1;
517
+ c[e] >= t ? (l = e, s = e - 1) : o = e + 1;
518
+ }
519
+ if (l !== -1) for (let e = l; e < c.length; e++) {
520
+ let t = c[e];
521
+ if (t >= n) break;
522
+ u.add(t);
523
+ }
322
524
  }
323
- let d = Array.from(l).sort((e, t) => e - t), f = e.value.ssrRange?.start || 0, m = e.value.ssrRange?.colStart || 0, h = 0, g = 0;
324
- !a.value && e.value.ssrRange && (g = e.value.direction === "vertical" || e.value.direction === "both" ? i === null ? b.query(f) : f * (i + o) : 0, e.value.direction === "horizontal" ? h = i === null ? y.query(m) : m * (i + s) : e.value.direction === "both" && (h = x.query(m)));
525
+ let d = Array.from(u).sort((e, t) => e - t), f = e.value.ssrRange?.start || 0, p = e.value.ssrRange?.colStart || 0, m = 0, h = 0;
526
+ !a.value && e.value.ssrRange && (h = e.value.direction === "vertical" || e.value.direction === "both" ? i === null ? b.query(f) : f * (i + o) : 0, e.value.direction === "horizontal" ? m = i === null ? y.query(p) : p * (i + s) : e.value.direction === "both" && (m = x.query(p)));
527
+ let g = new Map($.map((e) => [e.index, e]));
325
528
  for (let t of d) {
326
529
  let n = e.value.items[t];
327
530
  if (n === void 0) continue;
328
- let a = 0, l = 0, d = 0, f = 0;
329
- e.value.direction === "horizontal" ? (a = i === null ? y.query(t) : t * (i + s), d = i === null ? y.get(t) - s : i, f = p.value) : (l = (e.value.direction === "vertical" || e.value.direction === "both") && i !== null ? t * (i + o) : b.query(t), f = i === null ? b.get(t) - o : i, d = e.value.direction === "both" ? L.value : u.value);
330
- let m = c.includes(t), _ = a, v = l, x = !1, S = {
331
- x: 0,
332
- y: 0
333
- };
334
- if (m) {
335
- if (e.value.direction === "vertical" || e.value.direction === "both") {
336
- if (B.value > v) {
337
- x = !0;
338
- let e, n = 0, r = c.length - 1;
339
- for (; n <= r;) {
340
- let i = n + r >>> 1;
341
- c[i] > t ? (e = c[i], r = i - 1) : n = i + 1;
342
- }
343
- if (e !== void 0) {
344
- let t = (i === null ? b.query(e) : e * (i + o)) - B.value;
345
- /* v8 ignore else -- @preserve */
346
- t < f && (S.y = -(f - t));
347
- }
348
- }
349
- } else if (e.value.direction === "horizontal" && z.value > _) {
350
- x = !0;
351
- let e, n = 0, r = c.length - 1;
352
- for (; n <= r;) {
353
- let i = n + r >>> 1;
354
- c[i] > t ? (e = c[i], r = i - 1) : n = i + 1;
355
- }
356
- if (e !== void 0) {
357
- let t = (i === null ? y.query(e) : e * (i + s)) - z.value;
358
- /* v8 ignore else -- @preserve */
359
- t < d && (S.x = -(d - t));
360
- }
361
- }
362
- }
363
- r.push({
531
+ let { x: i, y: a, width: o, height: s } = calculateItemPosition({
532
+ index: t,
533
+ direction: e.value.direction || "vertical",
534
+ fixedSize: z.value,
535
+ gap: e.value.gap || 0,
536
+ columnGap: e.value.columnGap || 0,
537
+ usableWidth: K.value,
538
+ usableHeight: q.value,
539
+ totalWidth: J.value,
540
+ queryY: (e) => b.query(e),
541
+ queryX: (e) => y.query(e),
542
+ getSizeY: (e) => b.get(e),
543
+ getSizeX: (e) => y.get(e)
544
+ }), u = l.has(t), d = i, f = a, { isStickyActive: p, stickyOffset: _ } = calculateStickyItem({
545
+ index: t,
546
+ isSticky: u,
547
+ direction: e.value.direction || "vertical",
548
+ relativeScrollX: X.value,
549
+ relativeScrollY: Z.value,
550
+ originalX: d,
551
+ originalY: f,
552
+ width: o,
553
+ height: s,
554
+ stickyIndices: c,
555
+ fixedSize: z.value,
556
+ fixedWidth: B.value,
557
+ gap: e.value.gap || 0,
558
+ columnGap: e.value.columnGap || 0,
559
+ getItemQueryY: (e) => b.query(e),
560
+ getItemQueryX: (e) => y.query(e)
561
+ }), v = d - m, x = f - h, S = g.get(t);
562
+ S && S.item === n && S.offset.x === v && S.offset.y === x && S.size.width === o && S.size.height === s && S.isSticky === u && S.isStickyActive === p && S.stickyOffset.x === _.x && S.stickyOffset.y === _.y ? r.push(S) : r.push({
364
563
  item: n,
365
564
  index: t,
366
565
  offset: {
367
- x: _ - h,
368
- y: v - g
566
+ x: v,
567
+ y: x
369
568
  },
370
569
  size: {
371
- width: d,
372
- height: f
570
+ width: o,
571
+ height: s
373
572
  },
374
- originalX: _,
375
- originalY: v,
376
- isSticky: m,
377
- isStickyActive: x,
378
- stickyOffset: S
573
+ originalX: d,
574
+ originalY: f,
575
+ isSticky: u,
576
+ isStickyActive: p,
577
+ stickyOffset: _
379
578
  });
380
579
  }
381
- return r;
382
- }), J = computed(() => {
580
+ return $ = r, r;
581
+ }), me = computed(() => {
383
582
  C.value;
384
583
  let t = e.value.columnCount || 0;
385
584
  if (!t) return {
@@ -397,122 +596,176 @@ function useVirtualScroll(e) {
397
596
  padEnd: 0
398
597
  };
399
598
  }
400
- let n = x.findLowerBound(z.value), r = x.query(n), s = n;
401
- for (; s < t && r < z.value + u.value;) r = x.query(++s);
402
- let c = e.value.ssrRange && !i.value ? 0 : 2, l = Math.max(0, n - c), d = Math.min(t, s + c);
403
- return {
404
- start: l,
405
- end: d,
406
- padStart: x.query(l),
407
- padEnd: x.query(t) - x.query(d)
408
- };
409
- }), Y = computed(() => {
599
+ let n = e.value.ssrRange && !i.value ? 0 : 2;
600
+ return calculateColumnRange({
601
+ columnCount: t,
602
+ relativeScrollX: X.value,
603
+ usableWidth: K.value,
604
+ colBuffer: n,
605
+ fixedWidth: B.value,
606
+ columnGap: e.value.columnGap || 0,
607
+ findLowerBound: (e) => x.findLowerBound(e),
608
+ query: (e) => x.query(e),
609
+ totalColsQuery: () => x.query(t)
610
+ });
611
+ }), he = computed(() => {
410
612
  C.value;
411
- let t = P.value, n = e.value.columnGap || 0, r = 0;
412
- return (e.value.direction === "horizontal" || e.value.direction === "both") && (r = t === null ? y.findLowerBound(z.value) : Math.floor(z.value / (t + n))), {
413
- items: ie.value,
414
- currentIndex: q.value,
613
+ let t = z.value, n = e.value.columnGap || 0, r = 0;
614
+ return e.value.direction === "horizontal" ? r = t === null ? y.findLowerBound(X.value) : Math.floor(X.value / (t + n)) : e.value.direction === "both" && (r = x.findLowerBound(X.value)), {
615
+ items: pe.value,
616
+ currentIndex: fe.value,
415
617
  currentColIndex: r,
416
618
  scrollOffset: {
417
- x: z.value,
418
- y: B.value
619
+ x: X.value,
620
+ y: Z.value
419
621
  },
420
622
  viewportSize: {
421
623
  width: u.value,
422
624
  height: p.value
423
625
  },
424
626
  totalSize: {
425
- width: L.value,
426
- height: R.value
627
+ width: J.value,
628
+ height: Y.value
427
629
  },
428
630
  isScrolling: i.value,
429
631
  isProgrammaticScroll: v.value,
430
- range: K.value,
431
- columnRange: J.value
632
+ range: de.value,
633
+ columnRange: me.value
432
634
  };
433
- }), X = () => {
434
- v.value = !1, A.value = null;
435
- }, Z = (e) => {
635
+ }), ge = () => {
636
+ v.value = !1, I.value = null;
637
+ }, _e = (e) => {
436
638
  let t = e.target;
437
- typeof window > "u" || (t === window || t === document ? (n.value = window.scrollX, r.value = window.scrollY) : isScrollableElement(t) && (n.value = t.scrollLeft, r.value = t.scrollTop), i.value ||= (v.value || (A.value = null), !0), clearTimeout(_), _ = setTimeout(() => {
639
+ typeof window > "u" || (t === window || t === document ? (n.value = window.scrollX, r.value = window.scrollY, u.value = document.documentElement.clientWidth, p.value = document.documentElement.clientHeight) : isScrollableElement(t) && (n.value = t.scrollLeft, r.value = t.scrollTop, u.value = t.clientWidth, p.value = t.clientHeight), i.value ||= (v.value || (I.value = null), !0), clearTimeout(_), _ = setTimeout(() => {
438
640
  i.value = !1, v.value = !1;
439
641
  }, 250));
440
- }, ae = (t) => {
441
- let n = !1, r = e.value.gap || 0, i = e.value.columnGap || 0;
442
- for (let { index: a, inlineSize: o, blockSize: s, element: c } of t) {
443
- if ((M.value || typeof e.value.itemSize == "function") && a >= 0) {
444
- if (e.value.direction === "horizontal") {
445
- let e = y.get(a), t = o + i;
446
- /* v8 ignore else -- @preserve */
447
- (!O[a] || Math.abs(t - e) > .5) && (y.update(a, t - e), O[a] = 1, n = !0);
642
+ }, ve = (t) => {
643
+ let n = !1, r = 0, i = 0, a = e.value.gap || 0, o = e.value.columnGap || 0, s = X.value, c = Z.value, l = e.value.direction === "horizontal" ? z.value === null ? y.findLowerBound(s) : Math.floor(s / (z.value + o)) : z.value === null ? b.findLowerBound(c) : Math.floor(c / (z.value + a)), u = e.value.direction === "both" ? x.findLowerBound(s) : e.value.direction === "horizontal" ? l : 0, d = e.value.direction === "horizontal", f = e.value.direction === "vertical", p = e.value.direction === "both", m = /* @__PURE__ */ new Set(), h = /* @__PURE__ */ new Set();
644
+ for (let { index: s, inlineSize: c, blockSize: g, element: _ } of t) {
645
+ if (c <= 0 && g <= 0) continue;
646
+ let t = R.value || typeof e.value.itemSize == "function";
647
+ if (s >= 0 && !m.has(s) && t && g > 0) {
648
+ if (m.add(s), d && c > 0) {
649
+ let e = y.get(s), t = c + o;
650
+ if (!E[s] || Math.abs(t - e) > .1) {
651
+ let i = t - e;
652
+ y.update(s, i), E[s] = 1, n = !0, s < l && (r += i);
653
+ }
448
654
  }
449
- if (e.value.direction === "vertical" || e.value.direction === "both") {
450
- let t = b.get(a), i = s + r;
451
- e.value.direction, (!k[a] || Math.abs(i - t) > .5) && (b.update(a, i - t), k[a] = 1, n = !0);
655
+ if (f || p) {
656
+ let e = b.get(s), t = g + a;
657
+ if (!D[s] || Math.abs(t - e) > .1) {
658
+ let r = t - e;
659
+ b.update(s, r), D[s] = 1, n = !0, s < l && (i += r);
660
+ }
452
661
  }
453
662
  }
454
- let t = N.value || typeof e.value.columnWidth == "function";
455
- if (e.value.direction === "both" && c && e.value.columnCount && t) {
456
- let t = c.dataset.colIndex === void 0 ? Array.from(c.querySelectorAll("[data-col-index]")) : [c];
457
- for (let r of t) {
458
- let t = Number.parseInt(r.dataset.colIndex, 10);
459
- /* v8 ignore else -- @preserve */
460
- if (t >= 0 && t < (e.value.columnCount || 0)) {
461
- let e = r.offsetWidth, a = x.get(t), o = e + i;
462
- Math.abs(a - o) > .5 && (x.update(t, o - a), D[t] = 1, n = !0);
663
+ let v = ie.value || typeof e.value.columnWidth == "function";
664
+ if (p && _ && e.value.columnCount && v && (c > 0 || _.dataset.colIndex === void 0)) {
665
+ let t = _.dataset.colIndex;
666
+ if (t != null) {
667
+ let i = Number.parseInt(t, 10);
668
+ if (i >= 0 && i < (e.value.columnCount || 0) && !h.has(i)) {
669
+ h.add(i);
670
+ let e = x.get(i), t = c + o;
671
+ if (!T[i] || Math.abs(e - t) > .1) {
672
+ let a = t - e;
673
+ Math.abs(a) > .1 && (x.update(i, a), n = !0, i < u && (r += a)), T[i] = 1;
674
+ }
675
+ }
676
+ } else {
677
+ let t = _.dataset.colIndex === void 0 ? Array.from(_.querySelectorAll("[data-col-index]")) : [_];
678
+ for (let i of t) {
679
+ let t = Number.parseInt(i.dataset.colIndex, 10);
680
+ if (t >= 0 && t < (e.value.columnCount || 0) && !h.has(t)) {
681
+ h.add(t);
682
+ let e = i.getBoundingClientRect().width, a = x.get(t), s = e + o;
683
+ if (!T[t] || Math.abs(a - s) > .1) {
684
+ let e = s - a;
685
+ Math.abs(e) > .1 && (x.update(t, e), n = !0, t < u && (r += e)), T[t] = 1;
686
+ }
687
+ }
463
688
  }
464
689
  }
465
690
  }
466
691
  }
467
- n && C.value++;
468
- }, oe = (e, t, n, r) => {
469
- ae([{
692
+ n && (C.value++, !(I.value !== null || v.value) && (r !== 0 || i !== 0) && le(r === 0 ? null : s + r, i === 0 ? null : c + i, { behavior: "auto" }));
693
+ }, ye = (e, t, n, r) => {
694
+ ve([{
470
695
  index: e,
471
696
  inlineSize: t,
472
697
  blockSize: n,
473
698
  element: r
474
699
  }]);
475
- }, Q = () => {
476
- if (A.value && !o.value) {
477
- let { rowIndex: e, colIndex: t, options: n } = A.value;
478
- H(e, t, isScrollToIndexOptions(n) ? {
479
- ...n,
700
+ }, be = () => {
701
+ if (I.value && !o.value) {
702
+ let { rowIndex: t, colIndex: n, options: r } = I.value;
703
+ if (isScrollToIndexOptions(r) && r.behavior === "smooth" && i.value) return;
704
+ let { targetX: a, targetY: o } = calculateScrollTarget({
705
+ rowIndex: t,
706
+ colIndex: n,
707
+ options: r,
708
+ itemsLength: e.value.items.length,
709
+ columnCount: e.value.columnCount || 0,
710
+ direction: e.value.direction || "vertical",
711
+ usableWidth: K.value,
712
+ usableHeight: q.value,
713
+ totalWidth: J.value,
714
+ totalHeight: Y.value,
715
+ gap: e.value.gap || 0,
716
+ columnGap: e.value.columnGap || 0,
717
+ fixedSize: z.value,
718
+ fixedWidth: B.value,
719
+ relativeScrollX: X.value,
720
+ relativeScrollY: Z.value,
721
+ getItemSizeY: (e) => b.get(e),
722
+ getItemSizeX: (e) => y.get(e),
723
+ getItemQueryY: (e) => b.query(e),
724
+ getItemQueryX: (e) => y.query(e),
725
+ getColumnSize: (e) => x.get(e),
726
+ getColumnQuery: (e) => x.query(e),
727
+ stickyIndices: H.value
728
+ }), s = n == null || Math.abs(X.value - a) < 1, c = t == null || Math.abs(Z.value - o) < 1, l = n == null || n === void 0 || T[n] === 1, u = t == null || t === void 0 || D[t] === 1;
729
+ s && c ? l && u && (I.value = null) : ce(t, n, isScrollToIndexOptions(r) ? {
730
+ ...r,
480
731
  isCorrection: !0
481
732
  } : {
482
- align: n,
733
+ align: r,
483
734
  isCorrection: !0
484
735
  });
485
736
  }
486
737
  };
487
- watch(C, Q), watch(i, (e) => {
488
- e || Q();
738
+ watch([
739
+ C,
740
+ u,
741
+ p
742
+ ], be), watch(i, (e) => {
743
+ e || be();
489
744
  });
490
- let $ = null, se = (e) => {
745
+ let xe = null, Se = (e) => {
491
746
  if (!e || typeof window > "u") return;
492
747
  let t = e === window ? document : e;
493
- if (t.addEventListener("scroll", Z, { passive: !0 }), e === window) {
494
- u.value = window.innerWidth, p.value = window.innerHeight, n.value = window.scrollX, r.value = window.scrollY;
748
+ if (t.addEventListener("scroll", _e, { passive: !0 }), e === window) {
749
+ u.value = document.documentElement.clientWidth, p.value = document.documentElement.clientHeight, n.value = window.scrollX, r.value = window.scrollY;
495
750
  let e = () => {
496
- u.value = window.innerWidth, p.value = window.innerHeight, G();
751
+ u.value = document.documentElement.clientWidth, p.value = document.documentElement.clientHeight, Q();
497
752
  };
498
753
  return window.addEventListener("resize", e), () => {
499
- t.removeEventListener("scroll", Z), window.removeEventListener("resize", e);
754
+ t.removeEventListener("scroll", _e), window.removeEventListener("resize", e);
500
755
  };
501
- } else return u.value = e.clientWidth, p.value = e.clientHeight, n.value = e.scrollLeft, r.value = e.scrollTop, $ = new ResizeObserver((t) => {
502
- for (let n of t)
503
- /* v8 ignore else -- @preserve */
504
- n.target === e && (u.value = e.clientWidth, p.value = e.clientHeight, G());
505
- }), $.observe(e), () => {
506
- t.removeEventListener("scroll", Z), $?.disconnect();
756
+ } else return u.value = e.clientWidth, p.value = e.clientHeight, n.value = e.scrollLeft, r.value = e.scrollTop, xe = new ResizeObserver((t) => {
757
+ for (let n of t) n.target === e && (u.value = e.clientWidth, p.value = e.clientHeight, Q());
758
+ }), xe.observe(e), () => {
759
+ t.removeEventListener("scroll", _e), xe?.disconnect();
507
760
  };
508
- }, ce;
761
+ }, Ce;
509
762
  return getCurrentInstance() && (onMounted(() => {
510
763
  l.value = !0, watch(() => e.value.container, (e) => {
511
- ce?.(), ce = se(e || null);
512
- }, { immediate: !0 }), G(), e.value.ssrRange || e.value.initialScrollIndex !== void 0 ? nextTick(() => {
513
- G();
764
+ Ce?.(), Ce = Se(e || null);
765
+ }, { immediate: !0 }), Q(), e.value.ssrRange || e.value.initialScrollIndex !== void 0 ? nextTick(() => {
766
+ Q();
514
767
  let t = e.value.initialScrollIndex === void 0 ? e.value.ssrRange?.start : e.value.initialScrollIndex, n = e.value.initialScrollAlign || "start";
515
- t != null && H(t, e.value.ssrRange?.colStart, {
768
+ t != null && ce(t, e.value.ssrRange?.colStart, {
516
769
  align: n,
517
770
  behavior: "auto"
518
771
  }), a.value = !0, o.value = !0, nextTick(() => {
@@ -520,22 +773,22 @@ function useVirtualScroll(e) {
520
773
  });
521
774
  }) : a.value = !0;
522
775
  }), onUnmounted(() => {
523
- ce?.();
776
+ Ce?.();
524
777
  })), {
525
- renderedItems: ie,
526
- totalWidth: L,
527
- totalHeight: R,
528
- scrollDetails: Y,
529
- scrollToIndex: H,
530
- scrollToOffset: U,
531
- stopProgrammaticScroll: X,
532
- updateItemSize: oe,
533
- updateItemSizes: ae,
534
- updateHostOffset: G,
535
- columnRange: J,
536
- getColumnWidth: V,
778
+ renderedItems: pe,
779
+ totalWidth: J,
780
+ totalHeight: Y,
781
+ scrollDetails: he,
782
+ scrollToIndex: ce,
783
+ scrollToOffset: le,
784
+ stopProgrammaticScroll: ge,
785
+ updateItemSize: ye,
786
+ updateItemSizes: ve,
787
+ updateHostOffset: Q,
788
+ columnRange: me,
789
+ getColumnWidth: se,
537
790
  refresh: () => {
538
- y.resize(0), b.resize(0), x.resize(0), D.fill(0), O.fill(0), k.fill(0), W();
791
+ y.resize(0), b.resize(0), x.resize(0), T.fill(0), E.fill(0), D.fill(0), ue();
539
792
  },
540
793
  isHydrated: a
541
794
  };
@@ -599,20 +852,21 @@ var _hoisted_1 = {
599
852
  "visibleRangeChange"
600
853
  ],
601
854
  setup(o, { expose: s, emit: m }) {
602
- let w = o, T = m, ne = useSlots(), E = ref(null), D = ref(null), O = ref(null), k = ref(null), j = /* @__PURE__ */ new Map(), M = ref(0), N = ref(0), P = computed(() => {
603
- let e = w.container === void 0 ? E.value : w.container;
604
- return e === E.value || typeof window < "u" && (e === window || e === null);
605
- }), { isHydrated: F, columnRange: I, renderedItems: L, scrollDetails: R, totalHeight: z, totalWidth: B, getColumnWidth: V, scrollToIndex: H, scrollToOffset: U, updateHostOffset: W, updateItemSizes: G, refresh: K, stopProgrammaticScroll: q } = useVirtualScroll(computed(() => {
606
- let e = w.scrollPaddingStart, t = w.scrollPaddingEnd, n = typeof e == "object" ? e.x || 0 : w.direction === "horizontal" && e || 0, r = typeof e == "object" ? e.y || 0 : w.direction === "horizontal" ? 0 : e || 0, i = typeof t == "object" ? t.x || 0 : w.direction === "horizontal" && t || 0, a = typeof t == "object" ? t.y || 0 : w.direction === "horizontal" ? 0 : t || 0;
607
- /* v8 ignore stop -- @preserve */
855
+ let w = o, T = m, E = useSlots(), O = ref(null), k = ref(null), ee = ref(null), A = ref(null), j = /* @__PURE__ */ new Map(), M = ref(0), N = ref(0), P = computed(() => {
856
+ let e = w.container === void 0 ? O.value : w.container;
857
+ return e === O.value || typeof window < "u" && (e === window || e === null);
858
+ }), te = computed(() => {
859
+ let e = w.scrollPaddingStart, t = w.scrollPaddingEnd;
860
+ w.items.length;
861
+ let n = typeof e == "object" ? e.x || 0 : (w.direction === "horizontal" || w.direction === "both") && e || 0, r = typeof e == "object" ? e.y || 0 : (w.direction === "vertical" || w.direction === "both") && e || 0, i = typeof t == "object" ? t.x || 0 : (w.direction === "horizontal" || w.direction === "both") && t || 0, a = typeof t == "object" ? t.y || 0 : (w.direction === "vertical" || w.direction === "both") && t || 0;
608
862
  return {
609
863
  items: w.items,
610
864
  itemSize: w.itemSize,
611
865
  direction: w.direction,
612
866
  bufferBefore: w.bufferBefore,
613
867
  bufferAfter: w.bufferAfter,
614
- container: w.container === void 0 ? E.value : w.container,
615
- hostElement: D.value,
868
+ container: w.container === void 0 ? O.value : w.container,
869
+ hostElement: k.value,
616
870
  ssrRange: w.ssrRange,
617
871
  columnCount: w.columnCount,
618
872
  columnWidth: w.columnWidth,
@@ -636,22 +890,20 @@ var _hoisted_1 = {
636
890
  defaultColumnWidth: w.defaultColumnWidth,
637
891
  debug: w.debug
638
892
  };
639
- }));
640
- function ie() {
641
- K(), nextTick(() => {
893
+ }), { isHydrated: F, columnRange: ne, renderedItems: re, scrollDetails: L, totalHeight: R, totalWidth: B, getColumnWidth: V, scrollToIndex: H, scrollToOffset: U, updateHostOffset: W, updateItemSizes: ae, refresh: oe, stopProgrammaticScroll: G } = useVirtualScroll(te);
894
+ function K() {
895
+ oe(), nextTick(() => {
642
896
  let e = [];
643
- for (let [t, n] of j.entries())
644
- /* v8 ignore else -- @preserve */
645
- n && e.push({
897
+ for (let [t, n] of j.entries()) n && e.push({
646
898
  index: t,
647
899
  inlineSize: n.offsetWidth,
648
900
  blockSize: n.offsetHeight,
649
901
  element: n
650
902
  });
651
- e.length > 0 && G(e);
903
+ e.length > 0 && ae(e);
652
904
  });
653
905
  }
654
- watch(R, (e, t) => {
906
+ watch(L, (e, t) => {
655
907
  F.value && (T("scroll", e), (!t || e.range.start !== t.range.start || e.range.end !== t.range.end || e.columnRange.start !== t.columnRange.start || e.columnRange.end !== t.columnRange.end) && T("visibleRangeChange", {
656
908
  start: e.range.start,
657
909
  end: e.range.end,
@@ -659,125 +911,89 @@ var _hoisted_1 = {
659
911
  colEnd: e.columnRange.end
660
912
  }), !w.loading && (w.direction !== "horizontal" && e.totalSize.height - (e.scrollOffset.y + e.viewportSize.height) <= w.loadDistance && T("load", "vertical"), w.direction !== "vertical" && e.totalSize.width - (e.scrollOffset.x + e.viewportSize.width) <= w.loadDistance && T("load", "horizontal")));
661
913
  }), watch(F, (e) => {
662
- /* v8 ignore else -- @preserve */
663
914
  e && T("visibleRangeChange", {
664
- start: R.value.range.start,
665
- end: R.value.range.end,
666
- colStart: R.value.columnRange.start,
667
- colEnd: R.value.columnRange.end
915
+ start: L.value.range.start,
916
+ end: L.value.range.end,
917
+ colStart: L.value.columnRange.start,
918
+ colEnd: L.value.columnRange.end
668
919
  });
669
920
  }, { once: !0 });
670
- /* v8 ignore next 2 -- @preserve */
671
- let J = typeof window > "u" ? null : new ResizeObserver(W), Y = typeof window > "u" ? null : new ResizeObserver((e) => {
921
+ let q = typeof window > "u" ? null : new ResizeObserver(W), J = typeof window > "u" ? null : new ResizeObserver((e) => {
672
922
  let t = [];
673
923
  for (let n of e) {
674
- let e = n.target, r = Number(e.dataset.index);
675
- if (e.dataset.colIndex !== void 0) t.push({
924
+ let e = n.target, r = Number(e.dataset.index), i = e.dataset.colIndex, a = n.contentRect.width, o = n.contentRect.height;
925
+ n.borderBoxSize && n.borderBoxSize.length > 0 ? (a = n.borderBoxSize[0].inlineSize, o = n.borderBoxSize[0].blockSize) : (a = e.offsetWidth, o = e.offsetHeight), i === void 0 ? Number.isNaN(r) || t.push({
926
+ index: r,
927
+ inlineSize: a,
928
+ blockSize: o,
929
+ element: e
930
+ }) : t.push({
676
931
  index: -1,
677
- inlineSize: 0,
678
- blockSize: 0,
932
+ inlineSize: a,
933
+ blockSize: o,
679
934
  element: e
680
935
  });
681
- else if (!Number.isNaN(r)) {
682
- let i = n.contentRect.width, a = n.contentRect.height;
683
- n.borderBoxSize && n.borderBoxSize.length > 0 ? (i = n.borderBoxSize[0].inlineSize, a = n.borderBoxSize[0].blockSize) : (i = e.offsetWidth, a = e.offsetHeight), t.push({
684
- index: r,
685
- inlineSize: i,
686
- blockSize: a,
687
- element: e
688
- });
689
- }
690
936
  }
691
- /* v8 ignore else -- @preserve */
692
- t.length > 0 && G(t);
693
- }), X = typeof window > "u" ? null : new ResizeObserver(() => {
694
- M.value = O.value?.offsetHeight || 0, N.value = k.value?.offsetHeight || 0, W();
937
+ t.length > 0 && ae(t);
938
+ }), Y = typeof window > "u" ? null : new ResizeObserver(() => {
939
+ M.value = ee.value?.offsetHeight || 0, N.value = A.value?.offsetHeight || 0, W();
695
940
  });
696
- watch(O, (e, t) => {
697
- t && X?.unobserve(t), e && X?.observe(e);
698
- }, { immediate: !0 }), watch(k, (e, t) => {
699
- t && X?.unobserve(t), e && X?.observe(e);
700
- }, { immediate: !0 });
701
- let Z = computed(() => L.value[0]?.index);
702
- watch(Z, (e, t) => {
703
- if (w.direction === "both") {
704
- /* v8 ignore else -- @preserve */
705
- if (t !== void 0) {
706
- let e = j.get(t);
707
- e && e.querySelectorAll("[data-col-index]").forEach((e) => Y?.unobserve(e));
708
- }
709
- if (e !== void 0) {
710
- let t = j.get(e);
711
- /* v8 ignore else -- @preserve */
712
- t && t.querySelectorAll("[data-col-index]").forEach((e) => Y?.observe(e));
713
- }
714
- }
715
- }, { flush: "post" }), onMounted(() => {
716
- /* v8 ignore else -- @preserve */
717
- E.value && J?.observe(E.value);
718
- for (let e of j.values()) Y?.observe(e);
719
- /* v8 ignore else -- @preserve */
720
- if (Z.value !== void 0) {
721
- let e = j.get(Z.value);
722
- /* v8 ignore else -- @preserve */
723
- e && e.querySelectorAll("[data-col-index]").forEach((e) => Y?.observe(e));
724
- }
725
- }), watch([E, D], ([e], [t]) => {
726
- t && J?.unobserve(t), e && J?.observe(e);
941
+ watch(ee, (e, t) => {
942
+ t && Y?.unobserve(t), e && Y?.observe(e);
943
+ }, { immediate: !0 }), watch(A, (e, t) => {
944
+ t && Y?.unobserve(t), e && Y?.observe(e);
945
+ }, { immediate: !0 }), onMounted(() => {
946
+ O.value && q?.observe(O.value);
947
+ for (let e of j.values()) J?.observe(e), w.direction === "both" && e.querySelectorAll("[data-col-index]").forEach((e) => J?.observe(e));
948
+ }), watch([O, k], ([e], [t]) => {
949
+ t && q?.unobserve(t), e && q?.observe(e);
727
950
  });
728
- function ae(e, t) {
729
- if (e) j.set(t, e), Y?.observe(e);
951
+ function X(e, t) {
952
+ if (e) j.set(t, e), J?.observe(e), w.direction === "both" && e.querySelectorAll("[data-col-index]").forEach((e) => J?.observe(e));
730
953
  else {
731
954
  let e = j.get(t);
732
- /* v8 ignore else -- @preserve */
733
- e && (Y?.unobserve(e), j.delete(t));
955
+ e && (J?.unobserve(e), w.direction === "both" && e.querySelectorAll("[data-col-index]").forEach((e) => J?.unobserve(e)), j.delete(t));
734
956
  }
735
957
  }
736
- function oe(e) {
737
- q();
738
- let { viewportSize: t, scrollOffset: n } = R.value, r = w.direction !== "vertical", i = w.direction !== "horizontal";
739
- if (e.key === "Home") {
740
- e.preventDefault(), H(0, 0, "start");
741
- return;
742
- }
743
- if (e.key === "End") {
744
- e.preventDefault();
745
- let t = w.items.length - 1, n = (w.columnCount || 0) > 0 ? w.columnCount - 1 : 0;
746
- r ? i ? H(t, n, "end") : H(0, t, "end") : H(t, 0, "end");
747
- return;
748
- }
749
- if (e.key === "ArrowUp") {
750
- e.preventDefault(), U(null, n.y - 40);
751
- return;
752
- }
753
- if (e.key === "ArrowDown") {
754
- e.preventDefault(), U(null, n.y + 40);
755
- return;
756
- }
757
- if (e.key === "ArrowLeft") {
758
- e.preventDefault(), U(n.x - 40, null);
759
- return;
760
- }
761
- if (e.key === "ArrowRight") {
762
- e.preventDefault(), U(n.x + 40, null);
763
- return;
764
- }
765
- if (e.key === "PageUp") {
766
- e.preventDefault(), U(!i && r ? n.x - t.width : null, i ? n.y - t.height : null);
767
- return;
958
+ function Z(e) {
959
+ let { viewportSize: t, scrollOffset: n } = L.value, r = w.direction !== "vertical", i = w.direction !== "horizontal";
960
+ switch (e.key) {
961
+ case "Home":
962
+ e.preventDefault(), G(), H(0, 0, "start");
963
+ break;
964
+ case "End": {
965
+ e.preventDefault(), G();
966
+ let t = w.items.length - 1, n = (w.columnCount || 0) > 0 ? w.columnCount - 1 : 0;
967
+ r ? i ? H(t, n, "end") : H(0, t, "end") : H(t, 0, "end");
968
+ break;
969
+ }
970
+ case "ArrowUp":
971
+ e.preventDefault(), G(), U(null, n.y - 40);
972
+ break;
973
+ case "ArrowDown":
974
+ e.preventDefault(), G(), U(null, n.y + 40);
975
+ break;
976
+ case "ArrowLeft":
977
+ e.preventDefault(), G(), U(n.x - 40, null);
978
+ break;
979
+ case "ArrowRight":
980
+ e.preventDefault(), G(), U(n.x + 40, null);
981
+ break;
982
+ case "PageUp":
983
+ e.preventDefault(), G(), U(!i && r ? n.x - t.width : null, i ? n.y - t.height : null);
984
+ break;
985
+ case "PageDown":
986
+ e.preventDefault(), G(), U(!i && r ? n.x + t.width : null, i ? n.y + t.height : null);
987
+ break;
768
988
  }
769
- e.key === "PageDown" && (e.preventDefault(), U(!i && r ? n.x + t.width : null, i ? n.y + t.height : null));
770
989
  }
771
990
  onUnmounted(() => {
772
- J?.disconnect(), Y?.disconnect(), X?.disconnect();
991
+ q?.disconnect(), J?.disconnect(), Y?.disconnect();
773
992
  });
774
- let Q = computed(() => {
775
- let e = w.container;
776
- return e === null || typeof window < "u" && e === window ? !0 : e && typeof e == "object" && "tagName" in e ? e.tagName === "BODY" : !1;
777
- }), $ = computed(() => Q.value ? { ...w.direction === "vertical" ? {} : { whiteSpace: "nowrap" } } : w.containerTag === "table" ? { minInlineSize: w.direction === "vertical" ? "100%" : "auto" } : { ...w.direction === "vertical" ? {} : { whiteSpace: "nowrap" } }), se = computed(() => ({
993
+ let se = computed(() => isWindowLike(w.container)), ce = computed(() => se.value ? { ...w.direction === "vertical" ? {} : { whiteSpace: "nowrap" } } : w.containerTag === "table" ? { minInlineSize: w.direction === "vertical" ? "100%" : "auto" } : { ...w.direction === "vertical" ? {} : { whiteSpace: "nowrap" } }), le = computed(() => ({
778
994
  inlineSize: w.direction === "vertical" ? "100%" : `${B.value}px`,
779
- blockSize: w.direction === "horizontal" ? "100%" : `${z.value}px`
780
- })), ce = computed(() => {
995
+ blockSize: w.direction === "horizontal" ? "100%" : `${R.value}px`
996
+ })), ue = computed(() => {
781
997
  let e = w.direction === "horizontal";
782
998
  return {
783
999
  display: e ? "inline-block" : "block",
@@ -786,43 +1002,50 @@ var _hoisted_1 = {
786
1002
  verticalAlign: "top"
787
1003
  } : { inlineSize: "100%" }
788
1004
  };
789
- }), le = computed(() => ({
1005
+ }), Q = computed(() => ({
790
1006
  inlineSize: w.direction === "vertical" ? "1px" : `${B.value}px`,
791
- blockSize: w.direction === "horizontal" ? "1px" : `${z.value}px`
1007
+ blockSize: w.direction === "horizontal" ? "1px" : `${R.value}px`
792
1008
  }));
793
- function ue(e) {
794
- let t = w.direction === "vertical", n = w.direction === "horizontal", r = w.direction === "both", i = w.itemSize === void 0 || w.itemSize === null || w.itemSize === 0, a = { blockSize: n ? "100%" : i ? "auto" : `${e.size.height}px` };
795
- return t && w.containerTag === "table" ? a.minInlineSize = "100%" : a.inlineSize = t ? "100%" : i ? "auto" : `${e.size.width}px`, i && (t || (a.minInlineSize = "1px"), n || (a.minBlockSize = "1px")), F.value && (e.isStickyActive ? ((t || r) && (a.insetBlockStart = `${getPaddingY(w.scrollPaddingStart, w.direction)}px`), (n || r) && (a.insetInlineStart = `${getPaddingX(w.scrollPaddingStart, w.direction)}px`), a.transform = `translate(${e.stickyOffset.x}px, ${e.stickyOffset.y}px)`) : a.transform = `translate(${e.offset.x}px, ${e.offset.y}px)`), a;
1009
+ function de(e) {
1010
+ return calculateItemStyle({
1011
+ containerTag: w.containerTag,
1012
+ direction: w.direction,
1013
+ isHydrated: F.value,
1014
+ item: e,
1015
+ itemSize: w.itemSize,
1016
+ paddingStartX: te.value.scrollPaddingStart.x,
1017
+ paddingStartY: te.value.scrollPaddingStart.y
1018
+ });
796
1019
  }
797
- let de = computed(() => w.debug), fe = computed(() => w.containerTag === "table"), pe = computed(() => fe.value ? "thead" : "div"), me = computed(() => fe.value ? "tfoot" : "div");
1020
+ let fe = computed(() => w.debug), $ = computed(() => w.containerTag === "table"), pe = computed(() => $.value ? "thead" : "div"), me = computed(() => $.value ? "tfoot" : "div");
798
1021
  return s({
799
- scrollDetails: R,
800
- columnRange: I,
1022
+ scrollDetails: L,
1023
+ columnRange: ne,
801
1024
  getColumnWidth: V,
802
1025
  scrollToIndex: H,
803
1026
  scrollToOffset: U,
804
- refresh: ie,
805
- stopProgrammaticScroll: q
1027
+ refresh: K,
1028
+ stopProgrammaticScroll: G
806
1029
  }), (t, s) => (openBlock(), createBlock(resolveDynamicComponent(o.containerTag), {
807
1030
  ref_key: "hostRef",
808
- ref: E,
1031
+ ref: O,
809
1032
  class: normalizeClass(["virtual-scroll-container", [`virtual-scroll--${o.direction}`, {
810
1033
  "virtual-scroll--hydrated": unref(F),
811
- "virtual-scroll--window": Q.value,
812
- "virtual-scroll--table": fe.value
1034
+ "virtual-scroll--window": se.value,
1035
+ "virtual-scroll--table": $.value
813
1036
  }]]),
814
- style: normalizeStyle($.value),
1037
+ style: normalizeStyle(ce.value),
815
1038
  tabindex: "0",
816
- onKeydown: oe,
817
- onWheelPassive: unref(q),
818
- onPointerdownPassive: unref(q),
819
- onTouchstartPassive: unref(q)
1039
+ onKeydown: Z,
1040
+ onWheelPassive: unref(G),
1041
+ onPointerdownPassive: unref(G),
1042
+ onTouchstartPassive: unref(G)
820
1043
  }, {
821
1044
  default: withCtx(() => [
822
- ne.header ? (openBlock(), createBlock(resolveDynamicComponent(pe.value), {
1045
+ E.header ? (openBlock(), createBlock(resolveDynamicComponent(pe.value), {
823
1046
  key: 0,
824
1047
  ref_key: "headerRef",
825
- ref: O,
1048
+ ref: ee,
826
1049
  class: normalizeClass(["virtual-scroll-header", { "virtual-scroll--sticky": o.stickyHeader }])
827
1050
  }, {
828
1051
  default: withCtx(() => [renderSlot(t.$slots, "header", {}, void 0, !0)]),
@@ -830,14 +1053,14 @@ var _hoisted_1 = {
830
1053
  }, 8, ["class"])) : createCommentVNode("", !0),
831
1054
  (openBlock(), createBlock(resolveDynamicComponent(o.wrapperTag), {
832
1055
  ref_key: "wrapperRef",
833
- ref: D,
1056
+ ref: k,
834
1057
  class: "virtual-scroll-wrapper",
835
- style: normalizeStyle(se.value)
1058
+ style: normalizeStyle(le.value)
836
1059
  }, {
837
- default: withCtx(() => [fe.value ? (openBlock(), createBlock(resolveDynamicComponent(o.itemTag), {
1060
+ default: withCtx(() => [$.value ? (openBlock(), createBlock(resolveDynamicComponent(o.itemTag), {
838
1061
  key: 0,
839
1062
  class: "virtual-scroll-spacer",
840
- style: normalizeStyle(le.value)
1063
+ style: normalizeStyle(Q.value)
841
1064
  }, {
842
1065
  default: withCtx(() => [...s[0] ||= [createElementVNode("td", { style: {
843
1066
  padding: "0",
@@ -845,25 +1068,25 @@ var _hoisted_1 = {
845
1068
  "block-size": "inherit"
846
1069
  } }, null, -1)]]),
847
1070
  _: 1
848
- }, 8, ["style"])) : createCommentVNode("", !0), (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(L), (e) => (openBlock(), createBlock(resolveDynamicComponent(o.itemTag), {
1071
+ }, 8, ["style"])) : createCommentVNode("", !0), (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(re), (e) => (openBlock(), createBlock(resolveDynamicComponent(o.itemTag), {
849
1072
  key: e.index,
850
1073
  ref_for: !0,
851
- ref: (t) => ae(t, e.index),
1074
+ ref: (t) => X(t, e.index),
852
1075
  "data-index": e.index,
853
1076
  class: normalizeClass(["virtual-scroll-item", {
854
1077
  "virtual-scroll--sticky": e.isStickyActive,
855
- "virtual-scroll--debug": de.value
1078
+ "virtual-scroll--debug": fe.value
856
1079
  }]),
857
- style: normalizeStyle(ue(e))
1080
+ style: normalizeStyle(de(e))
858
1081
  }, {
859
1082
  default: withCtx(() => [renderSlot(t.$slots, "item", {
860
1083
  item: e.item,
861
1084
  index: e.index,
862
- columnRange: unref(I),
1085
+ columnRange: unref(ne),
863
1086
  getColumnWidth: unref(V),
864
1087
  isSticky: e.isSticky,
865
1088
  isStickyActive: e.isStickyActive
866
- }, void 0, !0), de.value ? (openBlock(), createElementBlock("div", _hoisted_1, " #" + toDisplayString(e.index) + " (" + toDisplayString(Math.round(e.offset.x)) + ", " + toDisplayString(Math.round(e.offset.y)) + ") ", 1)) : createCommentVNode("", !0)]),
1089
+ }, void 0, !0), fe.value ? (openBlock(), createElementBlock("div", _hoisted_1, " #" + toDisplayString(e.index) + " (" + toDisplayString(Math.round(e.offset.x)) + ", " + toDisplayString(Math.round(e.offset.y)) + ") ", 1)) : createCommentVNode("", !0)]),
867
1090
  _: 2
868
1091
  }, 1032, [
869
1092
  "data-index",
@@ -872,15 +1095,15 @@ var _hoisted_1 = {
872
1095
  ]))), 128))]),
873
1096
  _: 3
874
1097
  }, 8, ["style"])),
875
- o.loading && ne.loading ? (openBlock(), createElementBlock("div", {
1098
+ o.loading && E.loading ? (openBlock(), createElementBlock("div", {
876
1099
  key: 1,
877
1100
  class: "virtual-scroll-loading",
878
- style: normalizeStyle(ce.value)
1101
+ style: normalizeStyle(ue.value)
879
1102
  }, [renderSlot(t.$slots, "loading", {}, void 0, !0)], 4)) : createCommentVNode("", !0),
880
- ne.footer ? (openBlock(), createBlock(resolveDynamicComponent(me.value), {
1103
+ E.footer ? (openBlock(), createBlock(resolveDynamicComponent(me.value), {
881
1104
  key: 2,
882
1105
  ref_key: "footerRef",
883
- ref: k,
1106
+ ref: A,
884
1107
  class: normalizeClass(["virtual-scroll-footer", { "virtual-scroll--sticky": o.stickyFooter }])
885
1108
  }, {
886
1109
  default: withCtx(() => [renderSlot(t.$slots, "footer", {}, void 0, !0)]),
@@ -896,7 +1119,7 @@ var _hoisted_1 = {
896
1119
  "onTouchstartPassive"
897
1120
  ]));
898
1121
  }
899
- }), [["__scopeId", "data-v-d61a0f1d"]]);
900
- export { DEFAULT_BUFFER, DEFAULT_COLUMN_WIDTH, DEFAULT_ITEM_SIZE, FenwickTree, VirtualScroll_default as VirtualScroll, getPaddingX, getPaddingY, isElement, isScrollToIndexOptions, isScrollableElement, useVirtualScroll };
1122
+ }), [["__scopeId", "data-v-922485f2"]]);
1123
+ export { DEFAULT_BUFFER, DEFAULT_COLUMN_WIDTH, DEFAULT_ITEM_SIZE, FenwickTree, VirtualScroll_default as VirtualScroll, calculateColumnRange, calculateItemPosition, calculateItemStyle, calculateRange, calculateScrollTarget, calculateStickyItem, calculateTotalSize, getPaddingX, getPaddingY, isBody, isElement, isScrollToIndexOptions, isScrollableElement, isWindow, isWindowLike, useVirtualScroll };
901
1124
 
902
1125
  //# sourceMappingURL=index.mjs.map