@pdanpdan/virtual-scroll 0.4.0 → 0.5.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
@@ -1,1125 +1,2225 @@
1
- import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, getCurrentInstance, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, reactive, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, watch, withCtx } from "vue";
2
- var FenwickTree = class {
3
- tree;
4
- values;
5
- constructor(e) {
6
- this.tree = new Float64Array(e + 1), this.values = new Float64Array(e);
7
- }
8
- update(e, t) {
9
- if (!(e < 0 || e >= this.values.length)) for (this.values[e] = this.values[e] + t, e++; e < this.tree.length;) this.tree[e] = this.tree[e] + t, e += e & -e;
10
- }
11
- query(e) {
12
- let t = 0;
13
- for (; e > 0;) t += this.tree[e] || 0, e -= e & -e;
14
- return t;
15
- }
16
- set(e, t) {
17
- e < 0 || e >= this.values.length || (this.values[e] = t);
18
- }
19
- get length() {
20
- return this.values.length;
21
- }
22
- get(e) {
23
- return this.values[e] || 0;
24
- }
25
- getValues() {
26
- return this.values;
27
- }
28
- findLowerBound(e) {
29
- let t = 0, n = this.tree.length, r = 1 << Math.floor(Math.log2(n - 1));
30
- for (; r > 0;) {
31
- let i = t + r;
32
- if (i < n) {
33
- let n = this.tree[i] || 0;
34
- n <= e && (t = i, e -= n);
35
- }
36
- r >>= 1;
37
- }
38
- return t;
39
- }
40
- rebuild() {
41
- this.tree.fill(0);
42
- for (let e = 0; e < this.values.length; e++) this.tree[e + 1] = this.values[e] || 0;
43
- for (let e = 1; e < this.tree.length; e++) {
44
- let t = e + (e & -e);
45
- t < this.tree.length && (this.tree[t] = this.tree[t] + this.tree[e]);
46
- }
47
- }
48
- resize(e) {
49
- if (e === this.values.length) return;
50
- let t = new Float64Array(e);
51
- t.set(this.values.subarray(0, Math.min(e, this.values.length))), this.values = t, this.tree = new Float64Array(e + 1), this.rebuild();
52
- }
53
- shift(e) {
54
- if (e === 0) return;
55
- let t = this.values.length, n = new Float64Array(t);
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
- }
58
- };
59
- function isWindow(e) {
60
- return e === null || typeof window < "u" && e === window;
1
+ import { computed as u, toValue as st, ref as ee, reactive as jt, watch as Me, nextTick as kt, getCurrentInstance as fl, onMounted as hl, onUnmounted as ll, defineComponent as gl, openBlock as Ee, createElementBlock as It, normalizeProps as St, guardReactiveProps as il, unref as tt, createElementVNode as el, useSlots as yl, useId as Sl, toRefs as bl, createBlock as Je, resolveDynamicComponent as ht, normalizeStyle as gt, normalizeClass as Bt, withCtx as mt, renderSlot as pt, mergeProps as Vt, createCommentVNode as et, Fragment as wl, renderList as xl, toDisplayString as Qt } from "vue";
2
+ class Kt {
3
+ tree;
4
+ values;
5
+ /**
6
+ * Creates a new Fenwick Tree with the specified size.
7
+ *
8
+ * @param size - The number of elements in the tree.
9
+ */
10
+ constructor(e) {
11
+ this.tree = new Float64Array(e + 1), this.values = new Float64Array(e);
12
+ }
13
+ /**
14
+ * Update the value at a specific index and propagate changes throughout the tree.
15
+ *
16
+ * @param index - The 0-based index to update.
17
+ * @param delta - The change in value (new value - old value).
18
+ */
19
+ update(e, i) {
20
+ if (!(e < 0 || e >= this.values.length))
21
+ for (this.values[e] = this.values[e] + i, e++; e < this.tree.length; )
22
+ this.tree[e] = this.tree[e] + i, e += e & -e;
23
+ }
24
+ /**
25
+ * Get the prefix sum up to a specific index (exclusive).
26
+ *
27
+ * @param index - 0-based index. `query(n)` returns sum of values from index 0 to n-1.
28
+ * @returns Sum of values in range [0, index).
29
+ */
30
+ query(e) {
31
+ let i = 0;
32
+ for (; e > 0; )
33
+ i += this.tree[e] || 0, e -= e & -e;
34
+ return i;
35
+ }
36
+ /**
37
+ * Set the individual value at an index without updating the prefix sum tree.
38
+ * Call `rebuild()` after multiple sets to update the tree efficiently in O(n).
39
+ *
40
+ * @param index - The 0-based index.
41
+ * @param value - The new value.
42
+ */
43
+ set(e, i) {
44
+ e < 0 || e >= this.values.length || (this.values[e] = i);
45
+ }
46
+ /**
47
+ * Get the number of items in the tree.
48
+ */
49
+ get length() {
50
+ return this.values.length;
51
+ }
52
+ /**
53
+ * Get the individual value at a specific index.
54
+ *
55
+ * @param index - The 0-based index.
56
+ * @returns The value at the specified index.
57
+ */
58
+ get(e) {
59
+ return this.values[e] || 0;
60
+ }
61
+ /**
62
+ * Get the underlying values array as a read-only Float64Array.
63
+ *
64
+ * @returns The read-only values array.
65
+ */
66
+ getValues() {
67
+ return this.values;
68
+ }
69
+ /**
70
+ * Find the largest index such that the prefix sum is less than or equal to the given value.
71
+ * Highly efficient search used to find which item is at a specific scroll offset.
72
+ *
73
+ * @param value - The prefix sum value to search for.
74
+ * @returns The 0-based index.
75
+ */
76
+ findLowerBound(e) {
77
+ let i = 0;
78
+ const t = this.tree.length;
79
+ let s = 1 << Math.floor(Math.log2(t - 1));
80
+ for (; s > 0; ) {
81
+ const d = i + s;
82
+ if (d < t) {
83
+ const S = this.tree[d] || 0;
84
+ S <= e && (i = d, e -= S);
85
+ }
86
+ s >>= 1;
87
+ }
88
+ return i;
89
+ }
90
+ /**
91
+ * Rebuild the entire prefix sum tree from the current values array.
92
+ * Time complexity: O(n).
93
+ */
94
+ rebuild() {
95
+ this.tree.fill(0);
96
+ for (let e = 0; e < this.values.length; e++)
97
+ this.tree[e + 1] = this.values[e] || 0;
98
+ for (let e = 1; e < this.tree.length; e++) {
99
+ const i = e + (e & -e);
100
+ i < this.tree.length && (this.tree[i] = this.tree[i] + this.tree[e]);
101
+ }
102
+ }
103
+ /**
104
+ * Resize the tree while preserving existing values and rebuilding the prefix sums.
105
+ *
106
+ * @param size - The new size of the tree.
107
+ */
108
+ resize(e) {
109
+ if (e === this.values.length)
110
+ return;
111
+ const i = new Float64Array(e);
112
+ i.set(this.values.subarray(0, Math.min(e, this.values.length))), this.values = i, this.tree = new Float64Array(e + 1), this.rebuild();
113
+ }
114
+ /**
115
+ * Shift values by a given offset and rebuild the tree.
116
+ * Useful when items are prepended to the list to maintain existing measurements.
117
+ *
118
+ * @param offset - Number of positions to shift. Positive for prepending (shifts right).
119
+ */
120
+ shift(e) {
121
+ if (e === 0)
122
+ return;
123
+ const i = this.values.length, t = new Float64Array(i);
124
+ e > 0 ? t.set(this.values.subarray(0, Math.min(i - e, this.values.length)), e) : t.set(this.values.subarray(-e)), this.values = t, this.rebuild();
125
+ }
126
+ }
127
+ const bt = 1e7;
128
+ function zl(a) {
129
+ return a === null || a === document.documentElement || typeof window < "u" && a === window;
130
+ }
131
+ function Ml(a) {
132
+ return a != null && typeof a == "object" && "tagName" in a && a.tagName === "BODY";
133
+ }
134
+ function Pl(a) {
135
+ return zl(a) || Ml(a);
136
+ }
137
+ function Zt(a) {
138
+ return a != null && "getBoundingClientRect" in a;
139
+ }
140
+ function Jt(a) {
141
+ return a != null && "scrollLeft" in a;
142
+ }
143
+ function yt(a) {
144
+ return typeof a == "object" && a != null && ("align" in a || "behavior" in a || "isCorrection" in a);
61
145
  }
62
- function isBody(e) {
63
- return !!e && typeof e == "object" && "tagName" in e && e.tagName === "BODY";
146
+ function lt(a, e) {
147
+ return typeof a == "object" && a !== null ? a.x || 0 : (e === "horizontal" || e === "both") && a || 0;
64
148
  }
65
- function isWindowLike(e) {
66
- return isWindow(e) || isBody(e);
149
+ function at(a, e) {
150
+ return typeof a == "object" && a !== null ? a.y || 0 : (e === "vertical" || e === "both") && a || 0;
67
151
  }
68
- function isElement(e) {
69
- return !!e && "getBoundingClientRect" in e;
152
+ function ml({
153
+ scrollPos: a,
154
+ containerSize: e,
155
+ count: i,
156
+ bufferBefore: t,
157
+ bufferAfter: s,
158
+ gap: d,
159
+ fixedSize: S,
160
+ findLowerBound: w,
161
+ query: m
162
+ }) {
163
+ let z = 0, h = i;
164
+ const E = a + e;
165
+ if (S !== null) {
166
+ const b = S + d;
167
+ z = Math.floor(a / b), h = Math.ceil(E / b);
168
+ } else
169
+ z = w(a), h = w(E), h < i && m(h) < E && h++;
170
+ return {
171
+ start: Math.max(0, z - t),
172
+ end: Math.min(i, h + s)
173
+ };
70
174
  }
71
- function isScrollableElement(e) {
72
- return !!e && "scrollLeft" in e;
175
+ function rl(a, e) {
176
+ let i = 0, t = a.length - 1, s;
177
+ for (; i <= t; ) {
178
+ const d = i + t >>> 1;
179
+ a[d] > e ? (s = a[d], t = d - 1) : i = d + 1;
180
+ }
181
+ return s;
73
182
  }
74
- function isScrollToIndexOptions(e) {
75
- return typeof e == "object" && !!e && ("align" in e || "behavior" in e || "isCorrection" in e);
183
+ function pl(a, e) {
184
+ let i = 0, t = a.length - 1, s;
185
+ for (; i <= t; ) {
186
+ const d = i + t >>> 1;
187
+ a[d] < e ? (s = a[d], i = d + 1) : t = d - 1;
188
+ }
189
+ return s;
76
190
  }
77
- function getPaddingX(e, t) {
78
- return typeof e == "object" && e ? e.x || 0 : (t === "horizontal" || t === "both") && e || 0;
191
+ function kl({
192
+ align: a,
193
+ targetPos: e,
194
+ itemSize: i,
195
+ scrollPos: t,
196
+ viewSize: s,
197
+ stickyOffsetStart: d,
198
+ stickyOffsetEnd: S
199
+ }) {
200
+ const w = e - d, m = e - (s - S - i);
201
+ if (a === "start")
202
+ return { target: w, effectiveAlign: "start" };
203
+ if (a === "center")
204
+ return {
205
+ target: e - d - (s - d - S - i) / 2,
206
+ effectiveAlign: "center"
207
+ };
208
+ if (a === "end")
209
+ return { target: m, effectiveAlign: "end" };
210
+ if (Il(e, i, t, s, d, S))
211
+ return { target: t, effectiveAlign: "auto" };
212
+ const z = s - d - S;
213
+ return i <= z ? e < t + d ? {
214
+ target: w,
215
+ effectiveAlign: "start"
216
+ } : {
217
+ target: m,
218
+ effectiveAlign: "end"
219
+ } : Math.abs(w - t) < Math.abs(m - t) ? {
220
+ target: w,
221
+ effectiveAlign: "start"
222
+ } : {
223
+ target: m,
224
+ effectiveAlign: "end"
225
+ };
79
226
  }
80
- function getPaddingY(e, t) {
81
- return typeof e == "object" && e ? e.y || 0 : (t === "vertical" || t === "both") && e || 0;
227
+ function Rt(a, e, i, t) {
228
+ return a <= 0 ? 0 : e !== null ? Math.max(0, a * (e + i) - i) : Math.max(0, t(a) - i);
82
229
  }
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
- };
230
+ function ul({
231
+ index: a,
232
+ align: e,
233
+ viewSize: i,
234
+ scrollPos: t,
235
+ fixedSize: s,
236
+ gap: d,
237
+ query: S,
238
+ getSize: w,
239
+ stickyIndices: m,
240
+ stickyStart: z,
241
+ stickyEnd: h = 0
242
+ }) {
243
+ let E = z;
244
+ if (m && m.length > 0) {
245
+ const T = pl(m, a);
246
+ T !== void 0 && (E += Rt(1, s, 0, () => w(T)));
247
+ }
248
+ const b = s !== null ? a * (s + d) : S(a), V = s !== null ? s : w(a) - d, { target: X, effectiveAlign: R } = kl({
249
+ align: e,
250
+ targetPos: b,
251
+ itemSize: V,
252
+ scrollPos: t,
253
+ viewSize: i,
254
+ stickyOffsetStart: E,
255
+ stickyOffsetEnd: h
256
+ });
257
+ return { target: X, itemSize: V, effectiveAlign: R };
133
258
  }
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
- };
259
+ function Il(a, e, i, t, s = 0, d = 0) {
260
+ const S = i + s, w = i + t - d, m = t - s - d;
261
+ return e <= m ? a >= S - 0.5 && a + e <= w + 0.5 : a <= S + 0.5 && a + e >= w - 0.5;
152
262
  }
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
- };
263
+ function ct(a, e, i) {
264
+ return (a - e) * i;
176
265
  }
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
- };
266
+ function Ht(a, e, i) {
267
+ return a / i + e;
212
268
  }
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
- };
269
+ function sl({
270
+ rowIndex: a,
271
+ colIndex: e,
272
+ options: i,
273
+ direction: t,
274
+ viewportWidth: s,
275
+ viewportHeight: d,
276
+ totalWidth: S,
277
+ totalHeight: w,
278
+ gap: m,
279
+ columnGap: z,
280
+ fixedSize: h,
281
+ fixedWidth: E,
282
+ relativeScrollX: b,
283
+ relativeScrollY: V,
284
+ getItemSizeY: X,
285
+ getItemSizeX: R,
286
+ getItemQueryY: T,
287
+ getItemQueryX: $,
288
+ getColumnSize: L,
289
+ getColumnQuery: k,
290
+ scaleX: C,
291
+ scaleY: W,
292
+ hostOffsetX: P,
293
+ hostOffsetY: x,
294
+ stickyIndices: q,
295
+ stickyStartX: H = 0,
296
+ stickyStartY: K = 0,
297
+ stickyEndX: Q = 0,
298
+ stickyEndY: Z = 0,
299
+ flowPaddingStartX: Y = 0,
300
+ flowPaddingStartY: re = 0,
301
+ paddingStartX: de = 0,
302
+ paddingStartY: G = 0,
303
+ paddingEndX: le = 0,
304
+ paddingEndY: Be = 0
305
+ }) {
306
+ let ue;
307
+ yt(i) ? ue = i.align : ue = i;
308
+ const wt = (ue && typeof ue == "object" ? ue.x : ue) || "auto", te = (ue && typeof ue == "object" ? ue.y : ue) || "auto";
309
+ let Pe = b, ce = V, Le = 0, ae = 0, Te = "auto", ie = "auto";
310
+ const ke = C === 1 ? S : bt, fe = W === 1 ? w : bt, _e = Math.max(0, P + ke - s), pe = Math.max(0, x + fe - d), be = (_e - P) * C, ye = (pe - x) * W, Ge = Y + H + de, nt = re + K + G;
311
+ if (a != null) {
312
+ const ne = ul({
313
+ index: a,
314
+ align: te,
315
+ viewSize: d,
316
+ scrollPos: V,
317
+ fixedSize: h,
318
+ gap: m,
319
+ query: T,
320
+ getSize: X,
321
+ stickyIndices: q,
322
+ stickyStart: K + G,
323
+ stickyEnd: Z + Be
324
+ });
325
+ ce = ne.target + nt, ae = ne.itemSize, ie = ne.effectiveAlign;
326
+ }
327
+ if (e != null) {
328
+ const ne = t === "both", Ie = ul({
329
+ index: e,
330
+ align: wt,
331
+ viewSize: s,
332
+ scrollPos: b,
333
+ fixedSize: ne ? E : h,
334
+ gap: ne || t === "horizontal" ? z : m,
335
+ query: ne ? k : $,
336
+ getSize: ne ? L : R,
337
+ stickyIndices: q,
338
+ stickyStart: H + de,
339
+ stickyEnd: Q + le
340
+ });
341
+ Pe = Ie.target + Ge, Le = Ie.itemSize, Te = Ie.effectiveAlign;
342
+ }
343
+ return Pe = Math.max(0, Math.min(Pe, be)), ce = Math.max(0, Math.min(ce, ye)), { targetX: Pe, targetY: ce, itemWidth: Le, itemHeight: ae, effectiveAlignX: Te, effectiveAlignY: ie };
221
344
  }
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;
345
+ function Rl({
346
+ direction: a,
347
+ relativeScrollX: e,
348
+ relativeScrollY: i,
349
+ usableWidth: t,
350
+ usableHeight: s,
351
+ itemsLength: d,
352
+ bufferBefore: S,
353
+ bufferAfter: w,
354
+ gap: m,
355
+ columnGap: z,
356
+ fixedSize: h,
357
+ findLowerBoundY: E,
358
+ findLowerBoundX: b,
359
+ queryY: V,
360
+ queryX: X
361
+ }) {
362
+ const R = a === "vertical" || a === "both";
363
+ return ml({
364
+ scrollPos: R ? i : e,
365
+ containerSize: R ? s : t,
366
+ count: d,
367
+ bufferBefore: S,
368
+ bufferAfter: w,
369
+ gap: R ? m : z,
370
+ fixedSize: h,
371
+ findLowerBound: R ? E : b,
372
+ query: R ? V : X
373
+ });
225
374
  }
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
- };
375
+ function Xl({
376
+ columnCount: a,
377
+ relativeScrollX: e,
378
+ usableWidth: i,
379
+ colBuffer: t,
380
+ fixedWidth: s,
381
+ columnGap: d,
382
+ findLowerBound: S,
383
+ query: w,
384
+ totalColsQuery: m
385
+ }) {
386
+ if (!a)
387
+ return { start: 0, end: 0, padStart: 0, padEnd: 0 };
388
+ const { start: z, end: h } = ml({
389
+ scrollPos: e,
390
+ containerSize: i,
391
+ count: a,
392
+ bufferBefore: t,
393
+ bufferAfter: t,
394
+ gap: d,
395
+ fixedSize: s,
396
+ findLowerBound: S,
397
+ query: w
398
+ }), E = z, b = h, V = s !== null ? E * (s + d) : w(E), X = s !== null ? a * (s + d) - d : Math.max(0, m() - d), R = s !== null ? b * (s + d) - (b > 0 ? d : 0) : w(b) - (b > 0 ? d : 0);
399
+ return {
400
+ start: E,
401
+ end: b,
402
+ padStart: V,
403
+ padEnd: Math.max(0, X - R)
404
+ };
232
405
  }
233
- const DEFAULT_ITEM_SIZE = 40, DEFAULT_COLUMN_WIDTH = 100, DEFAULT_BUFFER = 5;
234
- function useVirtualScroll(e) {
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({
236
- x: 0,
237
- y: 0
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(() => {
245
- if (C.value, !a.value && e.value.ssrRange && !l.value) {
246
- let { start: t = 0, end: n = 0, colStart: r = 0, colEnd: i = 0 } = e.value.ssrRange, a = e.value.columnCount || 0;
247
- if (e.value.direction === "both") {
248
- if (a <= 0) return 0;
249
- let t = i || a, n = x.query(t) - x.query(r);
250
- return Math.max(0, n - (t > r && e.value.columnGap || 0));
251
- }
252
- if (e.value.direction === "horizontal") {
253
- if (z.value !== null) {
254
- let r = n - t;
255
- return Math.max(0, r * (z.value + (e.value.columnGap || 0)) - (r > 0 && e.value.columnGap || 0));
256
- }
257
- let r = y.query(n) - y.query(t);
258
- return Math.max(0, r - (n > t && e.value.columnGap || 0));
259
- }
260
- }
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(() => {
276
- if (C.value, !a.value && e.value.ssrRange && !l.value) {
277
- let { start: t, end: n } = e.value.ssrRange;
278
- if (e.value.direction === "vertical" || e.value.direction === "both") {
279
- if (z.value !== null) {
280
- let r = n - t;
281
- return Math.max(0, r * (z.value + (e.value.gap || 0)) - (r > 0 && e.value.gap || 0));
282
- }
283
- let r = b.query(n) - b.query(t);
284
- return Math.max(0, r - (n > t && e.value.gap || 0));
285
- }
286
- }
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(() => {
302
- let t = e.value.direction === "horizontal" || e.value.direction === "both" ? getPaddingX(e.value.scrollPaddingStart, e.value.direction) : 0;
303
- return Math.max(0, n.value + t - g.x);
304
- }), Z = computed(() => {
305
- let t = e.value.direction === "vertical" || e.value.direction === "both" ? getPaddingY(e.value.scrollPaddingStart, e.value.direction) : 0;
306
- return Math.max(0, r.value + t - g.y);
307
- }), se = (t) => {
308
- C.value;
309
- let n = e.value.columnWidth;
310
- if (typeof n == "number" && n > 0) return n;
311
- if (Array.isArray(n) && n.length > 0) {
312
- let r = n[t % n.length];
313
- return r != null && r > 0 ? r : e.value.defaultColumnWidth || 100;
314
- }
315
- return typeof n == "function" ? n(t) : x.get(t) || e.value.defaultColumnWidth || 100;
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({
318
- rowIndex: t,
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
341
- });
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 }
353
- }
354
- };
355
- }
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
363
- });
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));
367
- }
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) => {
370
- let o = e.value.container || window;
371
- v.value = !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);
373
- if (typeof window < "u" && o === window) window.scrollTo({
374
- left: t == null ? void 0 : p,
375
- top: i == null ? void 0 : m,
376
- behavior: a?.behavior || "auto"
377
- });
378
- else if (isScrollableElement(o)) {
379
- let e = { behavior: a?.behavior || "auto" };
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));
381
- }
382
- (a?.behavior === "auto" || a?.behavior === void 0) && (t != null && (n.value = p), i != null && (r.value = m));
383
- }, ue = () => {
384
- let t = e.value.items, n = t.length, r = e.value.columnCount || 0;
385
- if (y.resize(n), b.resize(n), x.resize(r), E.length !== n) {
386
- let e = new Uint8Array(n);
387
- e.set(E.subarray(0, Math.min(n, E.length))), E = e;
388
- }
389
- if (D.length !== n) {
390
- let e = new Uint8Array(n);
391
- e.set(D.subarray(0, Math.min(n, D.length))), D = e;
392
- }
393
- if (T.length !== r) {
394
- let e = new Uint8Array(r);
395
- e.set(T.subarray(0, Math.min(r, T.length))), T = e;
396
- }
397
- let i = 0;
398
- if (e.value.restoreScrollOnPrepend && L.length > 0 && n > L.length) {
399
- let e = L[0];
400
- if (e !== void 0) {
401
- for (let r = 1; r <= n - L.length; r++) if (t[r] === e) {
402
- i = r;
403
- break;
404
- }
405
- }
406
- }
407
- if (i > 0) {
408
- y.shift(i), b.shift(i), I.value && I.value.rowIndex !== null && I.value.rowIndex !== void 0 && (I.value.rowIndex += i);
409
- let r = new Uint8Array(n), a = new Uint8Array(n);
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;
411
- let o = e.value.gap || 0, s = e.value.columnGap || 0, l = 0, u = 0;
412
- for (let n = 0; n < i; n++) {
413
- let r = typeof e.value.itemSize == "function" ? e.value.itemSize(t[n], n) : V.value;
414
- e.value.direction === "horizontal" ? l += r + s : u += r + o;
415
- }
416
- (l > 0 || u > 0) && nextTick(() => {
417
- le(l > 0 ? X.value + l : null, u > 0 ? Z.value + u : null, { behavior: "auto" });
418
- });
419
- }
420
- if (r > 0) {
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);
429
- }
430
- }
431
- n && x.rebuild();
432
- }
433
- let a = e.value.gap || 0, o = e.value.columnGap || 0, s = !1;
434
- for (let t = 0; t < n; t++) {
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);
448
- }
449
- s && (y.rebuild(), b.rebuild()), L = [...t], re.value = !0, C.value++;
450
- }, Q = () => {
451
- if (e.value.hostElement && typeof window < "u") {
452
- let t = e.value.hostElement.getBoundingClientRect(), n = e.value.container || window, r = 0, i = 0;
453
- if (n === window) r = t.left + window.scrollX, i = t.top + window.scrollY;
454
- else if (n === e.value.hostElement) r = 0, i = 0;
455
- else if (isElement(n)) {
456
- let e = n.getBoundingClientRect();
457
- r = t.left - e.left + n.scrollLeft, i = t.top - e.top + n.scrollTop;
458
- }
459
- (Math.abs(g.x - r) > .1 || Math.abs(g.y - i) > .1) && (g.x = r, g.y = i);
460
- }
461
- };
462
- watch([
463
- () => e.value.items,
464
- () => e.value.items.length,
465
- () => e.value.direction,
466
- () => e.value.columnCount,
467
- () => e.value.columnWidth,
468
- () => e.value.itemSize,
469
- () => e.value.gap,
470
- () => e.value.columnGap,
471
- () => e.value.defaultItemSize,
472
- () => e.value.defaultColumnWidth
473
- ], ue, { immediate: !0 }), watch(() => [e.value.container, e.value.hostElement], () => {
474
- Q();
475
- });
476
- let de = computed(() => {
477
- if (C.value, (!a.value || o.value) && e.value.ssrRange) return {
478
- start: e.value.ssrRange.start,
479
- end: e.value.ssrRange.end
480
- };
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(() => {
500
- C.value;
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(() => {
504
- C.value;
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);
507
- if (a.value || !e.value.ssrRange) {
508
- let e = fe.value, r, i = 0, a = c.length - 1;
509
- for (; i <= a;) {
510
- let t = i + a >>> 1;
511
- c[t] < e ? (r = c[t], i = t + 1) : a = t - 1;
512
- }
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
- }
524
- }
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]));
528
- for (let t of d) {
529
- let n = e.value.items[t];
530
- if (n === void 0) continue;
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({
563
- item: n,
564
- index: t,
565
- offset: {
566
- x: v,
567
- y: x
568
- },
569
- size: {
570
- width: o,
571
- height: s
572
- },
573
- originalX: d,
574
- originalY: f,
575
- isSticky: u,
576
- isStickyActive: p,
577
- stickyOffset: _
578
- });
579
- }
580
- return $ = r, r;
581
- }), me = computed(() => {
582
- C.value;
583
- let t = e.value.columnCount || 0;
584
- if (!t) return {
585
- start: 0,
586
- end: 0,
587
- padStart: 0,
588
- padEnd: 0
589
- };
590
- if ((!a.value || o.value) && e.value.ssrRange) {
591
- let { colStart: n = 0, colEnd: r = 0 } = e.value.ssrRange;
592
- return {
593
- start: Math.max(0, n),
594
- end: Math.min(t, r || t),
595
- padStart: 0,
596
- padEnd: 0
597
- };
598
- }
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(() => {
612
- C.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,
617
- currentColIndex: r,
618
- scrollOffset: {
619
- x: X.value,
620
- y: Z.value
621
- },
622
- viewportSize: {
623
- width: u.value,
624
- height: p.value
625
- },
626
- totalSize: {
627
- width: J.value,
628
- height: Y.value
629
- },
630
- isScrolling: i.value,
631
- isProgrammaticScroll: v.value,
632
- range: de.value,
633
- columnRange: me.value
634
- };
635
- }), ge = () => {
636
- v.value = !1, I.value = null;
637
- }, _e = (e) => {
638
- let t = e.target;
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(() => {
640
- i.value = !1, v.value = !1;
641
- }, 250));
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
- }
654
- }
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
- }
661
- }
662
- }
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
- }
688
- }
689
- }
690
- }
691
- }
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([{
695
- index: e,
696
- inlineSize: t,
697
- blockSize: n,
698
- element: r
699
- }]);
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,
731
- isCorrection: !0
732
- } : {
733
- align: r,
734
- isCorrection: !0
735
- });
736
- }
737
- };
738
- watch([
739
- C,
740
- u,
741
- p
742
- ], be), watch(i, (e) => {
743
- e || be();
744
- });
745
- let xe = null, Se = (e) => {
746
- if (!e || typeof window > "u") return;
747
- let t = e === window ? document : e;
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;
750
- let e = () => {
751
- u.value = document.documentElement.clientWidth, p.value = document.documentElement.clientHeight, Q();
752
- };
753
- return window.addEventListener("resize", e), () => {
754
- t.removeEventListener("scroll", _e), window.removeEventListener("resize", e);
755
- };
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();
760
- };
761
- }, Ce;
762
- return getCurrentInstance() && (onMounted(() => {
763
- l.value = !0, watch(() => e.value.container, (e) => {
764
- Ce?.(), Ce = Se(e || null);
765
- }, { immediate: !0 }), Q(), e.value.ssrRange || e.value.initialScrollIndex !== void 0 ? nextTick(() => {
766
- Q();
767
- let t = e.value.initialScrollIndex === void 0 ? e.value.ssrRange?.start : e.value.initialScrollIndex, n = e.value.initialScrollAlign || "start";
768
- t != null && ce(t, e.value.ssrRange?.colStart, {
769
- align: n,
770
- behavior: "auto"
771
- }), a.value = !0, o.value = !0, nextTick(() => {
772
- o.value = !1;
773
- });
774
- }) : a.value = !0;
775
- }), onUnmounted(() => {
776
- Ce?.();
777
- })), {
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,
790
- refresh: () => {
791
- y.resize(0), b.resize(0), x.resize(0), T.fill(0), E.fill(0), D.fill(0), ue();
792
- },
793
- isHydrated: a
794
- };
406
+ function Cl({
407
+ index: a,
408
+ isSticky: e,
409
+ direction: i,
410
+ relativeScrollX: t,
411
+ relativeScrollY: s,
412
+ originalX: d,
413
+ originalY: S,
414
+ width: w,
415
+ height: m,
416
+ stickyIndices: z,
417
+ fixedSize: h,
418
+ fixedWidth: E,
419
+ gap: b,
420
+ columnGap: V,
421
+ getItemQueryY: X,
422
+ getItemQueryX: R
423
+ }) {
424
+ let T = !1;
425
+ const $ = { x: 0, y: 0 };
426
+ if (!e)
427
+ return { isStickyActive: T, stickyOffset: $ };
428
+ if ((i === "vertical" || i === "both") && s > S) {
429
+ const L = rl(z, a);
430
+ if (L !== void 0) {
431
+ const k = h !== null ? L * (h + b) : X(L);
432
+ s >= k ? T = !1 : (T = !0, $.y = Math.max(0, Math.min(m, k - s)) - m);
433
+ } else
434
+ T = !0;
435
+ }
436
+ if ((i === "horizontal" || i === "both" && !T) && t > d) {
437
+ const L = rl(z, a);
438
+ if (L !== void 0) {
439
+ const k = i === "horizontal" ? h !== null ? L * (h + V) : R(L) : E !== null ? L * (E + V) : R(L);
440
+ t >= k ? T = !1 : (T = !0, $.x = Math.max(0, Math.min(w, k - t)) - w);
441
+ } else
442
+ T = !0;
443
+ }
444
+ return { isStickyActive: T, stickyOffset: $ };
795
445
  }
796
- var _hoisted_1 = {
797
- key: 0,
798
- class: "virtual-scroll-debug-info"
799
- }, VirtualScroll_default = /* @__PURE__ */ ((e, t) => {
800
- let n = e.__vccOpts || e;
801
- for (let [e, r] of t) n[e] = r;
802
- return n;
803
- })(/* @__PURE__ */ defineComponent({
804
- __name: "VirtualScroll",
805
- props: {
806
- items: {},
807
- itemSize: {},
808
- direction: { default: "vertical" },
809
- bufferBefore: { default: 5 },
810
- bufferAfter: { default: 5 },
811
- container: {},
812
- ssrRange: {},
813
- columnCount: { default: 0 },
814
- columnWidth: {},
815
- containerTag: { default: "div" },
816
- wrapperTag: { default: "div" },
817
- itemTag: { default: "div" },
818
- scrollPaddingStart: { default: 0 },
819
- scrollPaddingEnd: { default: 0 },
820
- stickyHeader: {
821
- type: Boolean,
822
- default: !1
823
- },
824
- stickyFooter: {
825
- type: Boolean,
826
- default: !1
827
- },
828
- gap: { default: 0 },
829
- columnGap: { default: 0 },
830
- stickyIndices: { default: () => [] },
831
- loadDistance: { default: 200 },
832
- loading: {
833
- type: Boolean,
834
- default: !1
835
- },
836
- restoreScrollOnPrepend: {
837
- type: Boolean,
838
- default: !1
839
- },
840
- initialScrollIndex: {},
841
- initialScrollAlign: {},
842
- defaultItemSize: {},
843
- defaultColumnWidth: {},
844
- debug: {
845
- type: Boolean,
846
- default: !1
847
- }
848
- },
849
- emits: [
850
- "scroll",
851
- "load",
852
- "visibleRangeChange"
853
- ],
854
- setup(o, { expose: s, emit: m }) {
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;
862
- return {
863
- items: w.items,
864
- itemSize: w.itemSize,
865
- direction: w.direction,
866
- bufferBefore: w.bufferBefore,
867
- bufferAfter: w.bufferAfter,
868
- container: w.container === void 0 ? O.value : w.container,
869
- hostElement: k.value,
870
- ssrRange: w.ssrRange,
871
- columnCount: w.columnCount,
872
- columnWidth: w.columnWidth,
873
- scrollPaddingStart: {
874
- x: n,
875
- y: r + (w.stickyHeader && P.value ? M.value : 0)
876
- },
877
- scrollPaddingEnd: {
878
- x: i,
879
- y: a + (w.stickyFooter && P.value ? N.value : 0)
880
- },
881
- gap: w.gap,
882
- columnGap: w.columnGap,
883
- stickyIndices: w.stickyIndices,
884
- loadDistance: w.loadDistance,
885
- loading: w.loading,
886
- restoreScrollOnPrepend: w.restoreScrollOnPrepend,
887
- initialScrollIndex: w.initialScrollIndex,
888
- initialScrollAlign: w.initialScrollAlign,
889
- defaultItemSize: w.defaultItemSize,
890
- defaultColumnWidth: w.defaultColumnWidth,
891
- debug: w.debug
892
- };
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(() => {
896
- let e = [];
897
- for (let [t, n] of j.entries()) n && e.push({
898
- index: t,
899
- inlineSize: n.offsetWidth,
900
- blockSize: n.offsetHeight,
901
- element: n
902
- });
903
- e.length > 0 && ae(e);
904
- });
905
- }
906
- watch(L, (e, t) => {
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", {
908
- start: e.range.start,
909
- end: e.range.end,
910
- colStart: e.columnRange.start,
911
- colEnd: e.columnRange.end
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")));
913
- }), watch(F, (e) => {
914
- e && T("visibleRangeChange", {
915
- start: L.value.range.start,
916
- end: L.value.range.end,
917
- colStart: L.value.columnRange.start,
918
- colEnd: L.value.columnRange.end
919
- });
920
- }, { once: !0 });
921
- let q = typeof window > "u" ? null : new ResizeObserver(W), J = typeof window > "u" ? null : new ResizeObserver((e) => {
922
- let t = [];
923
- for (let n of e) {
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({
931
- index: -1,
932
- inlineSize: a,
933
- blockSize: o,
934
- element: e
935
- });
936
- }
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();
940
- });
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);
950
- });
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));
953
- else {
954
- let e = j.get(t);
955
- e && (J?.unobserve(e), w.direction === "both" && e.querySelectorAll("[data-col-index]").forEach((e) => J?.unobserve(e)), j.delete(t));
956
- }
957
- }
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;
988
- }
989
- }
990
- onUnmounted(() => {
991
- q?.disconnect(), J?.disconnect(), Y?.disconnect();
992
- });
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(() => ({
994
- inlineSize: w.direction === "vertical" ? "100%" : `${B.value}px`,
995
- blockSize: w.direction === "horizontal" ? "100%" : `${R.value}px`
996
- })), ue = computed(() => {
997
- let e = w.direction === "horizontal";
998
- return {
999
- display: e ? "inline-block" : "block",
1000
- ...e ? {
1001
- blockSize: "100%",
1002
- verticalAlign: "top"
1003
- } : { inlineSize: "100%" }
1004
- };
1005
- }), Q = computed(() => ({
1006
- inlineSize: w.direction === "vertical" ? "1px" : `${B.value}px`,
1007
- blockSize: w.direction === "horizontal" ? "1px" : `${R.value}px`
1008
- }));
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
- });
1019
- }
1020
- let fe = computed(() => w.debug), $ = computed(() => w.containerTag === "table"), pe = computed(() => $.value ? "thead" : "div"), me = computed(() => $.value ? "tfoot" : "div");
1021
- return s({
1022
- scrollDetails: L,
1023
- columnRange: ne,
1024
- getColumnWidth: V,
1025
- scrollToIndex: H,
1026
- scrollToOffset: U,
1027
- refresh: K,
1028
- stopProgrammaticScroll: G
1029
- }), (t, s) => (openBlock(), createBlock(resolveDynamicComponent(o.containerTag), {
1030
- ref_key: "hostRef",
1031
- ref: O,
1032
- class: normalizeClass(["virtual-scroll-container", [`virtual-scroll--${o.direction}`, {
1033
- "virtual-scroll--hydrated": unref(F),
1034
- "virtual-scroll--window": se.value,
1035
- "virtual-scroll--table": $.value
1036
- }]]),
1037
- style: normalizeStyle(ce.value),
1038
- tabindex: "0",
1039
- onKeydown: Z,
1040
- onWheelPassive: unref(G),
1041
- onPointerdownPassive: unref(G),
1042
- onTouchstartPassive: unref(G)
1043
- }, {
1044
- default: withCtx(() => [
1045
- E.header ? (openBlock(), createBlock(resolveDynamicComponent(pe.value), {
1046
- key: 0,
1047
- ref_key: "headerRef",
1048
- ref: ee,
1049
- class: normalizeClass(["virtual-scroll-header", { "virtual-scroll--sticky": o.stickyHeader }])
1050
- }, {
1051
- default: withCtx(() => [renderSlot(t.$slots, "header", {}, void 0, !0)]),
1052
- _: 3
1053
- }, 8, ["class"])) : createCommentVNode("", !0),
1054
- (openBlock(), createBlock(resolveDynamicComponent(o.wrapperTag), {
1055
- ref_key: "wrapperRef",
1056
- ref: k,
1057
- class: "virtual-scroll-wrapper",
1058
- style: normalizeStyle(le.value)
1059
- }, {
1060
- default: withCtx(() => [$.value ? (openBlock(), createBlock(resolveDynamicComponent(o.itemTag), {
1061
- key: 0,
1062
- class: "virtual-scroll-spacer",
1063
- style: normalizeStyle(Q.value)
1064
- }, {
1065
- default: withCtx(() => [...s[0] ||= [createElementVNode("td", { style: {
1066
- padding: "0",
1067
- border: "none",
1068
- "block-size": "inherit"
1069
- } }, null, -1)]]),
1070
- _: 1
1071
- }, 8, ["style"])) : createCommentVNode("", !0), (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(re), (e) => (openBlock(), createBlock(resolveDynamicComponent(o.itemTag), {
1072
- key: e.index,
1073
- ref_for: !0,
1074
- ref: (t) => X(t, e.index),
1075
- "data-index": e.index,
1076
- class: normalizeClass(["virtual-scroll-item", {
1077
- "virtual-scroll--sticky": e.isStickyActive,
1078
- "virtual-scroll--debug": fe.value
1079
- }]),
1080
- style: normalizeStyle(de(e))
1081
- }, {
1082
- default: withCtx(() => [renderSlot(t.$slots, "item", {
1083
- item: e.item,
1084
- index: e.index,
1085
- columnRange: unref(ne),
1086
- getColumnWidth: unref(V),
1087
- isSticky: e.isSticky,
1088
- isStickyActive: e.isStickyActive
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)]),
1090
- _: 2
1091
- }, 1032, [
1092
- "data-index",
1093
- "class",
1094
- "style"
1095
- ]))), 128))]),
1096
- _: 3
1097
- }, 8, ["style"])),
1098
- o.loading && E.loading ? (openBlock(), createElementBlock("div", {
1099
- key: 1,
1100
- class: "virtual-scroll-loading",
1101
- style: normalizeStyle(ue.value)
1102
- }, [renderSlot(t.$slots, "loading", {}, void 0, !0)], 4)) : createCommentVNode("", !0),
1103
- E.footer ? (openBlock(), createBlock(resolveDynamicComponent(me.value), {
1104
- key: 2,
1105
- ref_key: "footerRef",
1106
- ref: A,
1107
- class: normalizeClass(["virtual-scroll-footer", { "virtual-scroll--sticky": o.stickyFooter }])
1108
- }, {
1109
- default: withCtx(() => [renderSlot(t.$slots, "footer", {}, void 0, !0)]),
1110
- _: 3
1111
- }, 8, ["class"])) : createCommentVNode("", !0)
1112
- ]),
1113
- _: 3
1114
- }, 40, [
1115
- "class",
1116
- "style",
1117
- "onWheelPassive",
1118
- "onPointerdownPassive",
1119
- "onTouchstartPassive"
1120
- ]));
1121
- }
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 };
1124
-
1125
- //# sourceMappingURL=index.mjs.map
446
+ function Yl({
447
+ index: a,
448
+ direction: e,
449
+ fixedSize: i,
450
+ gap: t,
451
+ columnGap: s,
452
+ usableWidth: d,
453
+ usableHeight: S,
454
+ totalWidth: w,
455
+ queryY: m,
456
+ queryX: z,
457
+ getSizeY: h,
458
+ getSizeX: E,
459
+ columnRange: b
460
+ }) {
461
+ let V = 0, X = 0, R = 0, T = 0;
462
+ return e === "horizontal" ? (V = i !== null ? a * (i + s) : z(a), R = i !== null ? i : E(a) - s, T = S) : e === "both" && b ? (X = i !== null ? a * (i + t) : m(a), T = i !== null ? i : h(a) - t, V = b.padStart, R = Math.max(0, w - b.padStart - b.padEnd)) : (X = i !== null ? a * (i + t) : m(a), T = i !== null ? i : h(a) - t, R = e === "both" ? w : d), { height: T, width: R, x: V, y: X };
463
+ }
464
+ function El({
465
+ item: a,
466
+ direction: e,
467
+ itemSize: i,
468
+ containerTag: t,
469
+ paddingStartX: s,
470
+ paddingStartY: d,
471
+ isHydrated: S,
472
+ isRtl: w
473
+ }) {
474
+ const m = e === "vertical", z = e === "horizontal", h = e === "both", E = i == null || i === 0, b = {
475
+ blockSize: z ? "100%" : E ? "auto" : `${a.size.height}px`
476
+ };
477
+ if (m && t === "table" ? b.minInlineSize = "100%" : b.inlineSize = m ? "100%" : E ? "auto" : `${a.size.width}px`, E && (m || (b.minInlineSize = "1px"), z || (b.minBlockSize = "1px")), S) {
478
+ const V = w ? -(a.isStickyActive ? a.stickyOffset.x : a.offset.x) : a.isStickyActive ? a.stickyOffset.x : a.offset.x;
479
+ a.isStickyActive ? ((m || h) && (b.insetBlockStart = `${d}px`), (z || h) && (b.insetInlineStart = `${s}px`), b.transform = `translate(${V}px, ${a.stickyOffset.y}px)`) : b.transform = `translate(${V}px, ${a.offset.y}px)`;
480
+ }
481
+ return b;
482
+ }
483
+ function Tl({
484
+ direction: a,
485
+ itemsLength: e,
486
+ columnCount: i,
487
+ fixedSize: t,
488
+ fixedWidth: s,
489
+ gap: d,
490
+ columnGap: S,
491
+ usableWidth: w,
492
+ usableHeight: m,
493
+ queryY: z,
494
+ queryX: h,
495
+ queryColumn: E
496
+ }) {
497
+ const b = a === "both", V = a === "horizontal";
498
+ let X = 0, R = 0;
499
+ return b ? (X = Rt(i, s, S, E), R = Rt(e, t, d, z)) : V ? (X = Rt(e, t, S, h), R = m) : (X = w, R = Rt(e, t, d, z)), {
500
+ width: b ? Math.max(X, w) : X,
501
+ height: b ? Math.max(R, m) : R
502
+ };
503
+ }
504
+ const Dt = 40, Lt = 100, cl = 5;
505
+ function Ol(a) {
506
+ const e = u(() => st(a)), i = ee(0), t = ee(0), s = ee(!1), d = ee(!1), S = ee(!1), w = ee(!1), m = ee(!1), z = ee(0), h = ee(0), E = jt({ x: 0, y: 0 }), b = jt({ x: 0, y: 0 });
507
+ let V;
508
+ const X = ee(!1), R = ee(0), T = ee(0);
509
+ let $ = null;
510
+ const L = () => {
511
+ if (typeof window > "u")
512
+ return;
513
+ const l = e.value.container || e.value.hostRef || window, r = Zt(l) ? l : document.documentElement;
514
+ (!$ || !("direction" in $)) && ($ = window.getComputedStyle(r));
515
+ const o = $.direction === "rtl";
516
+ m.value !== o && (m.value = o);
517
+ }, k = new Kt(e.value.items?.length || 0), C = new Kt(e.value.items?.length || 0), W = new Kt(e.value.columnCount || 0), P = ee(0);
518
+ let x = new Uint8Array(0), q = new Uint8Array(0), H = new Uint8Array(0);
519
+ const K = ee(null), Q = ee(!1);
520
+ let Z = [];
521
+ const Y = u(() => ["vertical", "horizontal", "both"].includes(e.value.direction) ? e.value.direction : "vertical"), re = u(
522
+ () => e.value.itemSize === void 0 || e.value.itemSize === null || e.value.itemSize === 0
523
+ ), de = u(
524
+ () => e.value.columnWidth === void 0 || e.value.columnWidth === null || e.value.columnWidth === 0
525
+ ), G = u(
526
+ () => typeof e.value.itemSize == "number" && e.value.itemSize > 0 ? e.value.itemSize : null
527
+ ), le = u(
528
+ () => typeof e.value.columnWidth == "number" && e.value.columnWidth > 0 ? e.value.columnWidth : null
529
+ ), Be = u(() => e.value.defaultItemSize || G.value || Dt), ue = u(
530
+ () => [...e.value.stickyIndices || []].sort((l, r) => l - r)
531
+ ), wt = u(() => new Set(ue.value)), te = u(() => lt(e.value.scrollPaddingStart, e.value.direction)), Pe = u(() => lt(e.value.scrollPaddingEnd, e.value.direction)), ce = u(() => at(e.value.scrollPaddingStart, e.value.direction)), Le = u(() => at(e.value.scrollPaddingEnd, e.value.direction)), ae = u(() => lt(e.value.stickyStart, e.value.direction)), Te = u(() => lt(e.value.stickyEnd, e.value.direction)), ie = u(() => at(e.value.stickyStart, e.value.direction)), ke = u(() => at(e.value.stickyEnd, e.value.direction)), fe = u(() => lt(e.value.flowPaddingStart, e.value.direction)), _e = u(() => lt(e.value.flowPaddingEnd, e.value.direction)), pe = u(() => at(e.value.flowPaddingStart, e.value.direction)), be = u(() => at(e.value.flowPaddingEnd, e.value.direction)), ye = u(() => z.value - (Y.value !== "vertical" ? ae.value + Te.value : 0)), Ge = u(() => h.value - (Y.value !== "horizontal" ? ie.value + ke.value : 0)), nt = u(() => {
532
+ if (P.value, !d.value && e.value.ssrRange && !w.value) {
533
+ const { start: l = 0, end: r = 0, colStart: o = 0, colEnd: f = 0 } = e.value.ssrRange, p = e.value.columnCount || 0, y = e.value.gap || 0, B = e.value.columnGap || 0;
534
+ let F = 0, g = 0;
535
+ if (Y.value === "both") {
536
+ if (p > 0) {
537
+ const I = f || p, U = W.query(I) - W.query(o);
538
+ F = Math.max(0, U - (I > o ? B : 0));
539
+ }
540
+ if (G.value !== null) {
541
+ const I = r - l;
542
+ g = Math.max(0, I * (G.value + y) - (I > 0 ? y : 0));
543
+ } else {
544
+ const I = C.query(r) - C.query(l);
545
+ g = Math.max(0, I - (r > l ? y : 0));
546
+ }
547
+ } else if (Y.value === "horizontal") {
548
+ if (G.value !== null) {
549
+ const I = r - l;
550
+ F = Math.max(0, I * (G.value + B) - (I > 0 ? B : 0));
551
+ } else {
552
+ const I = k.query(r) - k.query(l);
553
+ F = Math.max(0, I - (r > l ? B : 0));
554
+ }
555
+ g = Ge.value;
556
+ } else if (F = ye.value, G.value !== null) {
557
+ const I = r - l;
558
+ g = Math.max(0, I * (G.value + y) - (I > 0 ? y : 0));
559
+ } else {
560
+ const I = C.query(r) - C.query(l);
561
+ g = Math.max(0, I - (r > l ? y : 0));
562
+ }
563
+ return {
564
+ width: Math.max(F, ye.value),
565
+ height: Math.max(g, Ge.value)
566
+ };
567
+ }
568
+ return Tl({
569
+ direction: Y.value,
570
+ itemsLength: e.value.items.length,
571
+ columnCount: e.value.columnCount || 0,
572
+ fixedSize: G.value,
573
+ fixedWidth: le.value,
574
+ gap: e.value.gap || 0,
575
+ columnGap: e.value.columnGap || 0,
576
+ usableWidth: ye.value,
577
+ usableHeight: Ge.value,
578
+ queryY: (l) => C.query(l),
579
+ queryX: (l) => k.query(l),
580
+ queryColumn: (l) => W.query(l)
581
+ });
582
+ }), ne = u(() => Pl(e.value.container)), Oe = u(() => nt.value.width + te.value + Pe.value), Ie = u(() => nt.value.height + ce.value + Le.value), Ve = u(() => fe.value + ae.value + Te.value + _e.value + Oe.value), we = u(() => pe.value + ie.value + ke.value + be.value + Ie.value), Se = jt({
583
+ x: u(() => Math.max(0, E.x - (fe.value + ae.value))),
584
+ y: u(() => Math.max(0, E.y - (pe.value + ie.value)))
585
+ }), ot = u(() => ne.value ? Ve.value : Math.min(Ve.value, bt)), Qe = u(() => ne.value ? we.value : Math.min(we.value, bt)), xt = u(() => ne.value ? Oe.value : Math.max(0, ot.value - (fe.value + ae.value + Te.value + _e.value))), oe = u(() => ne.value ? Ie.value : Math.max(0, Qe.value - (pe.value + ie.value + ke.value + be.value))), he = u(() => {
586
+ if (ne.value || Ve.value <= bt)
587
+ return 1;
588
+ const l = Ve.value - z.value, r = ot.value - z.value;
589
+ return r > 0 ? l / r : 1;
590
+ }), Ae = u(() => {
591
+ if (ne.value || we.value <= bt)
592
+ return 1;
593
+ const l = we.value - h.value, r = Qe.value - h.value;
594
+ return r > 0 ? l / r : 1;
595
+ }), Re = u(() => {
596
+ if (Y.value === "vertical")
597
+ return 0;
598
+ const l = fe.value + ae.value + te.value;
599
+ return R.value - l;
600
+ }), $e = u(() => {
601
+ if (Y.value === "horizontal")
602
+ return 0;
603
+ const l = pe.value + ie.value + ce.value;
604
+ return T.value - l;
605
+ }), $t = (l) => {
606
+ P.value;
607
+ const r = e.value.columnGap || 0, o = e.value.columnWidth;
608
+ if (typeof o == "number" && o > 0)
609
+ return o;
610
+ if (Array.isArray(o) && o.length > 0) {
611
+ const p = o[l % o.length];
612
+ return p != null && p > 0 ? p : e.value.defaultColumnWidth || Lt;
613
+ }
614
+ if (typeof o == "function")
615
+ return o(l);
616
+ const f = W.get(l);
617
+ return f > 0 ? f - r : e.value.defaultColumnWidth || Lt;
618
+ }, Xt = (l) => {
619
+ if (P.value, Y.value === "horizontal")
620
+ return Ge.value;
621
+ const r = e.value.gap || 0, o = e.value.itemSize;
622
+ if (typeof o == "number" && o > 0)
623
+ return o;
624
+ if (typeof o == "function") {
625
+ const p = e.value.items[l];
626
+ return p !== void 0 ? o(p, l) : e.value.defaultItemSize || Dt;
627
+ }
628
+ const f = C.get(l);
629
+ return f > 0 ? f - r : e.value.defaultItemSize || Dt;
630
+ };
631
+ function vt(l, r, o) {
632
+ const f = typeof o == "object" && o !== null && "isCorrection" in o ? o.isCorrection : !1, p = e.value.container || window, { targetX: y, targetY: B, effectiveAlignX: F, effectiveAlignY: g } = sl({
633
+ rowIndex: l,
634
+ colIndex: r,
635
+ options: o,
636
+ direction: Y.value,
637
+ viewportWidth: z.value,
638
+ viewportHeight: h.value,
639
+ totalWidth: Ve.value,
640
+ totalHeight: we.value,
641
+ gap: e.value.gap || 0,
642
+ columnGap: e.value.columnGap || 0,
643
+ fixedSize: G.value,
644
+ fixedWidth: le.value,
645
+ relativeScrollX: Re.value,
646
+ relativeScrollY: $e.value,
647
+ getItemSizeY: (M) => C.get(M),
648
+ getItemSizeX: (M) => k.get(M),
649
+ getItemQueryY: (M) => C.query(M),
650
+ getItemQueryX: (M) => k.query(M),
651
+ getColumnSize: (M) => W.get(M),
652
+ getColumnQuery: (M) => W.query(M),
653
+ scaleX: he.value,
654
+ scaleY: Ae.value,
655
+ hostOffsetX: Se.x,
656
+ hostOffsetY: Se.y,
657
+ stickyIndices: ue.value,
658
+ stickyStartX: ae.value,
659
+ stickyStartY: ie.value,
660
+ stickyEndX: Te.value,
661
+ stickyEndY: ke.value,
662
+ flowPaddingStartX: fe.value,
663
+ flowPaddingStartY: pe.value,
664
+ flowPaddingEndX: _e.value,
665
+ flowPaddingEndY: be.value,
666
+ paddingStartX: te.value,
667
+ paddingStartY: ce.value,
668
+ paddingEndX: Pe.value,
669
+ paddingEndY: Le.value
670
+ });
671
+ if (!f) {
672
+ const M = yt(o) ? o.behavior : void 0;
673
+ K.value = {
674
+ rowIndex: l,
675
+ colIndex: r,
676
+ options: {
677
+ align: { x: F, y: g },
678
+ ...M != null ? { behavior: M } : {}
679
+ }
680
+ };
681
+ }
682
+ const I = Ht(y, Se.x, he.value), U = Ht(B, Se.y, Ae.value), D = m.value ? -I : I, J = U;
683
+ let Xe;
684
+ yt(o) && (Xe = o.behavior);
685
+ const N = f ? "auto" : Xe || "smooth";
686
+ if (X.value = !0, typeof window < "u" && p === window)
687
+ window.scrollTo({
688
+ left: r == null ? void 0 : m.value ? D : Math.max(0, D),
689
+ top: l == null ? void 0 : Math.max(0, J),
690
+ behavior: N
691
+ });
692
+ else if (Jt(p)) {
693
+ const M = {
694
+ behavior: N
695
+ };
696
+ r != null && (M.left = m.value ? D : Math.max(0, D)), l != null && (M.top = Math.max(0, J)), typeof p.scrollTo == "function" ? p.scrollTo(M) : (M.left !== void 0 && (p.scrollLeft = M.left), M.top !== void 0 && (p.scrollTop = M.top));
697
+ }
698
+ if ((N === "auto" || N === void 0) && (r != null && (i.value = m.value ? D : Math.max(0, D), R.value = y), l != null && (t.value = Math.max(0, J), T.value = B), K.value)) {
699
+ const M = K.value.options;
700
+ yt(M) ? M.behavior = "auto" : K.value.options = {
701
+ align: M,
702
+ behavior: "auto"
703
+ };
704
+ }
705
+ }
706
+ const je = (l, r, o) => {
707
+ const f = e.value.container || window;
708
+ X.value = !0, K.value = null;
709
+ const p = l != null ? Math.max(0, Math.min(l, Ve.value - z.value)) : null, y = r != null ? Math.max(0, Math.min(r, we.value - h.value)) : null;
710
+ p !== null && (R.value = p), y !== null && (T.value = y);
711
+ const B = typeof window < "u" && f === window ? window.scrollX : f.scrollLeft, F = typeof window < "u" && f === window ? window.scrollY : f.scrollTop, g = p !== null ? Ht(p, Se.x, he.value) : null, I = y !== null ? Ht(y, Se.y, Ae.value) : null, U = g !== null ? m.value ? -g : g : B, D = I !== null ? I : F;
712
+ if (typeof window < "u" && f === window)
713
+ window.scrollTo({
714
+ left: l != null ? U : void 0,
715
+ top: r != null ? D : void 0,
716
+ behavior: o?.behavior || "auto"
717
+ });
718
+ else if (Jt(f)) {
719
+ const J = {
720
+ behavior: o?.behavior || "auto"
721
+ };
722
+ l != null && (J.left = U), r != null && (J.top = D), typeof f.scrollTo == "function" ? f.scrollTo(J) : (J.left !== void 0 && (f.scrollLeft = J.left), J.top !== void 0 && (f.scrollTop = J.top));
723
+ }
724
+ (o?.behavior === "auto" || o?.behavior === void 0) && (l != null && (i.value = U), r != null && (t.value = D));
725
+ }, Ft = (l, r) => {
726
+ if (k.resize(l), C.resize(l), W.resize(r), q.length !== l) {
727
+ const o = new Uint8Array(l);
728
+ o.set(q.subarray(0, Math.min(l, q.length))), q = o;
729
+ }
730
+ if (H.length !== l) {
731
+ const o = new Uint8Array(l);
732
+ o.set(H.subarray(0, Math.min(l, H.length))), H = o;
733
+ }
734
+ if (x.length !== r) {
735
+ const o = new Uint8Array(r);
736
+ o.set(x.subarray(0, Math.min(r, x.length))), x = o;
737
+ }
738
+ }, it = () => {
739
+ const r = e.value.items.length, o = e.value.columnCount || 0, f = e.value.gap || 0, p = e.value.columnGap || 0, y = e.value.columnWidth;
740
+ let B = !1, F = !1;
741
+ if (o > 0)
742
+ for (let g = 0; g < o; g++) {
743
+ const I = W.get(g), U = x[g] === 1;
744
+ if (!de.value || !U && I === 0) {
745
+ let D = 0;
746
+ typeof y == "number" && y > 0 ? D = y : Array.isArray(y) && y.length > 0 ? D = y[g % y.length] || e.value.defaultColumnWidth || Lt : typeof y == "function" ? D = y(g) : D = e.value.defaultColumnWidth || Lt;
747
+ const J = D + p;
748
+ Math.abs(I - J) > 0.5 ? (W.set(g, J), x[g] = de.value ? 0 : 1, B = !0) : de.value || (x[g] = 1);
749
+ }
750
+ }
751
+ for (let g = 0; g < r; g++) {
752
+ const I = e.value.items[g], U = k.get(g), D = C.get(g), J = q[g] === 1, Xe = H[g] === 1;
753
+ if (Y.value === "horizontal") {
754
+ if (!re.value || !J && U === 0) {
755
+ const M = (typeof e.value.itemSize == "function" ? e.value.itemSize(I, g) : Be.value) + p;
756
+ Math.abs(U - M) > 0.5 ? (k.set(g, M), q[g] = re.value ? 0 : 1, F = !0) : re.value || (q[g] = 1);
757
+ }
758
+ } else U !== 0 && (k.set(g, 0), q[g] = 0, F = !0);
759
+ if (Y.value !== "horizontal") {
760
+ if (!re.value || !Xe && D === 0) {
761
+ const M = (typeof e.value.itemSize == "function" ? e.value.itemSize(I, g) : Be.value) + f;
762
+ Math.abs(D - M) > 0.5 ? (C.set(g, M), H[g] = re.value ? 0 : 1, F = !0) : re.value || (H[g] = 1);
763
+ }
764
+ } else D !== 0 && (C.set(g, 0), H[g] = 0, F = !0);
765
+ }
766
+ B && W.rebuild(), F && (k.rebuild(), C.rebuild());
767
+ }, Ke = () => {
768
+ const l = e.value.items, r = l.length, o = e.value.columnCount || 0;
769
+ Ft(r, o);
770
+ let f = 0;
771
+ if (e.value.restoreScrollOnPrepend && Z.length > 0 && r > Z.length) {
772
+ const p = Z[0];
773
+ if (p !== void 0) {
774
+ for (let y = 1; y <= r - Z.length; y++)
775
+ if (l[y] === p) {
776
+ f = y;
777
+ break;
778
+ }
779
+ }
780
+ }
781
+ if (f > 0) {
782
+ k.shift(f), C.shift(f), K.value && K.value.rowIndex !== null && K.value.rowIndex !== void 0 && (K.value.rowIndex += f);
783
+ const p = new Uint8Array(r), y = new Uint8Array(r);
784
+ p.set(q.subarray(0, Math.min(r - f, q.length)), f), y.set(H.subarray(0, Math.min(r - f, H.length)), f), q = p, H = y;
785
+ const B = e.value.gap || 0, F = e.value.columnGap || 0;
786
+ let g = 0, I = 0;
787
+ for (let U = 0; U < f; U++) {
788
+ const D = typeof e.value.itemSize == "function" ? e.value.itemSize(l[U], U) : Be.value;
789
+ Y.value === "horizontal" ? g += D + F : I += D + B;
790
+ }
791
+ (g > 0 || I > 0) && kt(() => {
792
+ je(
793
+ g > 0 ? Re.value + g : null,
794
+ I > 0 ? $e.value + I : null,
795
+ { behavior: "auto" }
796
+ );
797
+ });
798
+ }
799
+ it(), Z = [...l], Q.value = !0, P.value++;
800
+ }, He = () => {
801
+ if (typeof window > "u")
802
+ return;
803
+ const l = e.value.container || window, r = (o) => {
804
+ const f = o.getBoundingClientRect();
805
+ if (l === window)
806
+ return {
807
+ x: m.value ? document.documentElement.clientWidth - f.right - window.scrollX : f.left + window.scrollX,
808
+ y: f.top + window.scrollY
809
+ };
810
+ if (l === o)
811
+ return { x: 0, y: 0 };
812
+ if (Zt(l)) {
813
+ const p = l.getBoundingClientRect();
814
+ return {
815
+ x: m.value ? p.right - f.right - l.scrollLeft : f.left - p.left + l.scrollLeft,
816
+ y: f.top - p.top + l.scrollTop
817
+ };
818
+ }
819
+ return { x: 0, y: 0 };
820
+ };
821
+ if (e.value.hostElement) {
822
+ const o = r(e.value.hostElement);
823
+ (Math.abs(E.x - o.x) > 0.1 || Math.abs(E.y - o.y) > 0.1) && (E.x = o.x, E.y = o.y);
824
+ }
825
+ if (e.value.hostRef) {
826
+ const o = r(e.value.hostRef);
827
+ (Math.abs(b.x - o.x) > 0.1 || Math.abs(b.y - o.y) > 0.1) && (b.x = o.x, b.y = o.y);
828
+ }
829
+ };
830
+ Me([
831
+ () => e.value.items,
832
+ () => e.value.items.length,
833
+ () => e.value.direction,
834
+ () => e.value.columnCount,
835
+ () => e.value.columnWidth,
836
+ () => e.value.itemSize,
837
+ () => e.value.gap,
838
+ () => e.value.columnGap,
839
+ () => e.value.defaultItemSize,
840
+ () => e.value.defaultColumnWidth
841
+ ], Ke, { immediate: !0 }), Me(() => [e.value.container, e.value.hostElement], () => {
842
+ He();
843
+ }), Me(m, (l, r) => {
844
+ if (r === void 0 || l === r || !w.value)
845
+ return;
846
+ if (Y.value === "vertical") {
847
+ He();
848
+ return;
849
+ }
850
+ const o = r ? Math.abs(i.value) : i.value, f = ct(o, E.x, he.value);
851
+ He(), je(f, null, { behavior: "auto" });
852
+ }, { flush: "sync" }), Me([he, Ae], () => {
853
+ !w.value || s.value || X.value || je(R.value, T.value, { behavior: "auto" });
854
+ }), Me([() => e.value.items.length, () => e.value.columnCount], ([l, r], [o, f]) => {
855
+ kt(() => {
856
+ const p = Math.max(0, Ve.value - z.value), y = Math.max(0, we.value - h.value);
857
+ R.value > p || T.value > y ? je(
858
+ Math.min(R.value, p),
859
+ Math.min(T.value, y),
860
+ { behavior: "auto" }
861
+ ) : (l !== o && Ae.value !== 1 || r !== f && he.value !== 1) && je(R.value, T.value, { behavior: "auto" }), He();
862
+ });
863
+ });
864
+ const rt = (l) => {
865
+ const r = e.value.gap || 0, o = e.value.columnGap || 0, f = G.value;
866
+ if (Y.value === "horizontal") {
867
+ const y = (f || 0) + o;
868
+ return f !== null && y > 0 ? Math.floor(l / y) : k.findLowerBound(l);
869
+ }
870
+ const p = (f || 0) + r;
871
+ return f !== null && p > 0 ? Math.floor(l / p) : C.findLowerBound(l);
872
+ }, zt = (l) => Y.value === "both" ? W.findLowerBound(l) : Y.value === "horizontal" ? rt(l) : 0, Ct = u(() => {
873
+ if (P.value, (!d.value || S.value) && e.value.ssrRange)
874
+ return {
875
+ start: e.value.ssrRange.start,
876
+ end: e.value.ssrRange.end
877
+ };
878
+ const l = e.value.ssrRange && !s.value ? 0 : e.value.bufferBefore ?? cl, r = e.value.bufferAfter ?? cl;
879
+ return Rl({
880
+ direction: Y.value,
881
+ relativeScrollX: Re.value,
882
+ relativeScrollY: $e.value,
883
+ usableWidth: ye.value,
884
+ usableHeight: Ge.value,
885
+ itemsLength: e.value.items.length,
886
+ bufferBefore: l,
887
+ bufferAfter: r,
888
+ gap: e.value.gap || 0,
889
+ columnGap: e.value.columnGap || 0,
890
+ fixedSize: G.value,
891
+ findLowerBoundY: (o) => C.findLowerBound(o),
892
+ findLowerBoundX: (o) => k.findLowerBound(o),
893
+ queryY: (o) => C.query(o),
894
+ queryX: (o) => k.query(o)
895
+ });
896
+ }), Yt = u(() => {
897
+ P.value;
898
+ const l = Re.value + ae.value, r = $e.value + ie.value, o = Y.value === "horizontal" ? l : r;
899
+ return rt(o);
900
+ }), Ze = u(() => {
901
+ P.value;
902
+ const l = e.value.columnCount || 0;
903
+ if (!l)
904
+ return { start: 0, end: 0, padStart: 0, padEnd: 0 };
905
+ if ((!d.value || S.value) && e.value.ssrRange) {
906
+ const { colStart: o = 0, colEnd: f = 0 } = e.value.ssrRange, p = Math.max(0, o), y = Math.min(l, f || l), B = e.value.columnGap || 0, F = le.value !== null ? p * (le.value + B) : W.query(p), g = le.value !== null ? l * (le.value + B) - B : Math.max(0, W.query(l) - B), I = le.value !== null ? y * (le.value + B) - (y > 0 ? B : 0) : W.query(y) - (y > 0 ? B : 0);
907
+ return {
908
+ start: p,
909
+ end: y,
910
+ padStart: F,
911
+ padEnd: Math.max(0, g - I)
912
+ };
913
+ }
914
+ const r = e.value.ssrRange && !s.value ? 0 : 2;
915
+ return Xl({
916
+ columnCount: l,
917
+ relativeScrollX: Re.value,
918
+ usableWidth: ye.value,
919
+ colBuffer: r,
920
+ fixedWidth: le.value,
921
+ columnGap: e.value.columnGap || 0,
922
+ findLowerBound: (o) => W.findLowerBound(o),
923
+ query: (o) => W.query(o),
924
+ totalColsQuery: () => W.query(l)
925
+ });
926
+ });
927
+ let Et = [];
928
+ const Tt = u(() => {
929
+ P.value;
930
+ const { start: l, end: r } = Ct.value, o = [], f = G.value, p = e.value.gap || 0, y = e.value.columnGap || 0, B = ue.value, F = wt.value, g = [];
931
+ if (d.value || !e.value.ssrRange) {
932
+ const j = Yt.value, Ne = pl(B, j);
933
+ Ne !== void 0 && Ne < l && g.push(Ne);
934
+ }
935
+ for (let j = l; j < r; j++)
936
+ g.push(j);
937
+ const I = e.value.ssrRange?.start || 0, U = e.value.ssrRange?.colStart || 0;
938
+ let D = 0, J = 0;
939
+ !d.value && e.value.ssrRange && (J = Y.value !== "horizontal" ? f !== null ? I * (f + p) : C.query(I) : 0, Y.value === "horizontal" ? D = f !== null ? U * (f + y) : k.query(U) : Y.value === "both" && (D = W.query(U)));
940
+ const Xe = new Map(Et.map((j) => [j.index, j]));
941
+ let N = -1, M = 0, qe = -1, Ce = 0;
942
+ const Mt = (j) => j === N + 1 ? (M += k.get(N), N = j, M) : (M = k.query(j), N = j, M), me = (j) => j === qe + 1 ? (Ce += C.get(qe), qe = j, Ce) : (Ce = C.query(j), qe = j, Ce), Ue = fe.value + ae.value + te.value, se = pe.value + ie.value + ce.value, Ye = fe.value + ae.value, ze = pe.value + ie.value, ft = Ze.value;
943
+ for (const j of g) {
944
+ const Ne = e.value.items[j];
945
+ if (Ne === void 0)
946
+ continue;
947
+ const { x: Ot, y: Pt, width: Ut, height: Nt } = Yl({
948
+ index: j,
949
+ direction: Y.value,
950
+ fixedSize: G.value,
951
+ gap: e.value.gap || 0,
952
+ columnGap: e.value.columnGap || 0,
953
+ usableWidth: ye.value,
954
+ usableHeight: Ge.value,
955
+ totalWidth: nt.value.width,
956
+ queryY: me,
957
+ queryX: Mt,
958
+ getSizeY: (ut) => C.get(ut),
959
+ getSizeX: (ut) => k.get(ut),
960
+ columnRange: ft
961
+ }), _t = F.has(j), At = Ot, Wt = Pt, { isStickyActive: al, stickyOffset: qt } = Cl({
962
+ index: j,
963
+ isSticky: _t,
964
+ direction: Y.value,
965
+ relativeScrollX: Re.value,
966
+ relativeScrollY: $e.value,
967
+ originalX: At,
968
+ originalY: Wt,
969
+ width: Ut,
970
+ height: Nt,
971
+ stickyIndices: B,
972
+ fixedSize: G.value,
973
+ fixedWidth: le.value,
974
+ gap: e.value.gap || 0,
975
+ columnGap: e.value.columnGap || 0,
976
+ getItemQueryY: (ut) => C.query(ut),
977
+ getItemQueryX: (ut) => k.query(ut)
978
+ }), nl = d.value ? R.value / he.value + (At + Ue - R.value) - Ye : At - D, ol = d.value ? T.value / Ae.value + (Wt + se - T.value) - ze : Wt - J, De = Xe.get(j);
979
+ De && De.item === Ne && De.offset.x === nl && De.offset.y === ol && De.size.width === Ut && De.size.height === Nt && De.isSticky === _t && De.isStickyActive === al && De.stickyOffset.x === qt.x && De.stickyOffset.y === qt.y ? o.push(De) : o.push({
980
+ item: Ne,
981
+ index: j,
982
+ offset: { x: nl, y: ol },
983
+ size: { width: Ut, height: Nt },
984
+ originalX: At,
985
+ originalY: Wt,
986
+ isSticky: _t,
987
+ isStickyActive: al,
988
+ stickyOffset: {
989
+ x: qt.x,
990
+ y: qt.y
991
+ }
992
+ });
993
+ }
994
+ return Et = o, o;
995
+ }), n = u(() => {
996
+ P.value;
997
+ const l = Re.value + ae.value, r = $e.value + ie.value, o = Re.value + (z.value - Te.value) - 1, f = $e.value + (h.value - ke.value) - 1, p = zt(l), y = rt(r), B = rt(Y.value === "horizontal" ? o : f), F = zt(o);
998
+ return {
999
+ items: Tt.value,
1000
+ currentIndex: y,
1001
+ currentColIndex: p,
1002
+ currentEndIndex: B,
1003
+ currentEndColIndex: F,
1004
+ scrollOffset: {
1005
+ x: R.value,
1006
+ y: T.value
1007
+ },
1008
+ displayScrollOffset: {
1009
+ x: m.value ? Math.abs(i.value + b.x) : Math.max(0, i.value - b.x),
1010
+ y: Math.max(0, t.value - b.y)
1011
+ },
1012
+ viewportSize: {
1013
+ width: z.value,
1014
+ height: h.value
1015
+ },
1016
+ displayViewportSize: {
1017
+ width: z.value,
1018
+ height: h.value
1019
+ },
1020
+ totalSize: {
1021
+ width: Ve.value,
1022
+ height: we.value
1023
+ },
1024
+ isScrolling: s.value,
1025
+ isProgrammaticScroll: X.value,
1026
+ range: Ct.value,
1027
+ columnRange: Ze.value
1028
+ };
1029
+ }), v = () => {
1030
+ X.value = !1, K.value = null;
1031
+ }, c = (l) => {
1032
+ const r = l.target;
1033
+ if (typeof window > "u")
1034
+ return;
1035
+ L(), r === window || r === document ? (i.value = window.scrollX, t.value = window.scrollY, z.value = document.documentElement.clientWidth, h.value = document.documentElement.clientHeight) : Jt(r) && (i.value = r.scrollLeft, t.value = r.scrollTop, z.value = r.clientWidth, h.value = r.clientHeight);
1036
+ const o = m.value ? Math.abs(i.value) : i.value;
1037
+ R.value = ct(o, Se.x, he.value), T.value = ct(t.value, Se.y, Ae.value), s.value || (X.value || (K.value = null), s.value = !0), clearTimeout(V), V = setTimeout(() => {
1038
+ s.value = !1, X.value = !1;
1039
+ }, 250);
1040
+ }, A = (l) => {
1041
+ let r = !1, o = 0, f = 0;
1042
+ const p = e.value.gap || 0, y = e.value.columnGap || 0, B = Re.value, F = $e.value, g = rt(Y.value === "horizontal" ? B : F), I = zt(B), U = Y.value === "horizontal", D = Y.value === "both", J = /* @__PURE__ */ new Set(), Xe = /* @__PURE__ */ new Set();
1043
+ for (const { index: N, inlineSize: M, blockSize: qe, element: Ce } of l) {
1044
+ if (M <= 0 && qe <= 0)
1045
+ continue;
1046
+ const Mt = re.value || typeof e.value.itemSize == "function";
1047
+ if (N >= 0 && !J.has(N) && Mt && qe > 0) {
1048
+ if (J.add(N), U && M > 0) {
1049
+ const Ue = k.get(N), se = M + y;
1050
+ if (!q[N] || Math.abs(se - Ue) > 0.1) {
1051
+ const Ye = se - Ue;
1052
+ k.update(N, Ye), q[N] = 1, r = !0, N < g && (o += Ye);
1053
+ }
1054
+ }
1055
+ if (!U) {
1056
+ const Ue = C.get(N), se = qe + p;
1057
+ if (!H[N] || Math.abs(se - Ue) > 0.1) {
1058
+ const Ye = se - Ue;
1059
+ C.update(N, Ye), H[N] = 1, r = !0, N < g && (f += Ye);
1060
+ }
1061
+ }
1062
+ }
1063
+ const me = de.value || typeof e.value.columnWidth == "function";
1064
+ if (D && Ce && e.value.columnCount && me && (M > 0 || Ce.dataset.colIndex === void 0)) {
1065
+ const Ue = Ce.dataset.colIndex;
1066
+ if (Ue != null) {
1067
+ const se = Number.parseInt(Ue, 10);
1068
+ if (se >= 0 && se < (e.value.columnCount || 0) && !Xe.has(se)) {
1069
+ Xe.add(se);
1070
+ const Ye = W.get(se), ze = M + y;
1071
+ if (!x[se] || Math.abs(Ye - ze) > 0.1) {
1072
+ const ft = ze - Ye;
1073
+ Math.abs(ft) > 0.1 && (W.update(se, ft), r = !0, se < I && (o += ft)), x[se] = 1;
1074
+ }
1075
+ }
1076
+ } else {
1077
+ const se = Ce.dataset.colIndex !== void 0 ? [Ce] : Array.from(Ce.querySelectorAll("[data-col-index]"));
1078
+ for (const Ye of se) {
1079
+ const ze = Number.parseInt(Ye.dataset.colIndex, 10);
1080
+ if (ze >= 0 && ze < (e.value.columnCount || 0) && !Xe.has(ze)) {
1081
+ Xe.add(ze);
1082
+ const j = Ye.getBoundingClientRect().width, Ne = W.get(ze), Ot = j + y;
1083
+ if (!x[ze] || Math.abs(Ne - Ot) > 0.1) {
1084
+ const Pt = Ot - Ne;
1085
+ Math.abs(Pt) > 0.1 && (W.update(ze, Pt), r = !0, ze < I && (o += Pt)), x[ze] = 1;
1086
+ }
1087
+ }
1088
+ }
1089
+ }
1090
+ }
1091
+ }
1092
+ if (r && (P.value++, !(K.value !== null || X.value) && (o !== 0 || f !== 0))) {
1093
+ const M = fe.value + ae.value + te.value, qe = pe.value + ie.value + ce.value;
1094
+ je(
1095
+ o !== 0 ? B + o + M : null,
1096
+ f !== 0 ? F + f + qe : null,
1097
+ { behavior: "auto" }
1098
+ );
1099
+ }
1100
+ }, ve = (l, r, o, f) => {
1101
+ A([{ index: l, inlineSize: r, blockSize: o, element: f }]);
1102
+ };
1103
+ function We() {
1104
+ if (K.value && !S.value) {
1105
+ const { rowIndex: l, colIndex: r, options: o } = K.value;
1106
+ if (yt(o) && o.behavior === "smooth" && s.value)
1107
+ return;
1108
+ const p = e.value.container || window, y = typeof window < "u" && p === window ? window.scrollX : p.scrollLeft, B = typeof window < "u" && p === window ? window.scrollY : p.scrollTop, F = m.value ? Math.abs(y) : y, g = B, I = ct(F, 0, he.value), U = ct(g, 0, Ae.value), { targetX: D, targetY: J } = sl({
1109
+ rowIndex: l,
1110
+ colIndex: r,
1111
+ options: o,
1112
+ direction: Y.value,
1113
+ viewportWidth: z.value,
1114
+ viewportHeight: h.value,
1115
+ totalWidth: Oe.value,
1116
+ totalHeight: Ie.value,
1117
+ gap: e.value.gap || 0,
1118
+ columnGap: e.value.columnGap || 0,
1119
+ fixedSize: G.value,
1120
+ fixedWidth: le.value,
1121
+ relativeScrollX: I,
1122
+ relativeScrollY: U,
1123
+ getItemSizeY: (me) => C.get(me),
1124
+ getItemSizeX: (me) => k.get(me),
1125
+ getItemQueryY: (me) => C.query(me),
1126
+ getItemQueryX: (me) => k.query(me),
1127
+ getColumnSize: (me) => W.get(me),
1128
+ getColumnQuery: (me) => W.query(me),
1129
+ scaleX: he.value,
1130
+ scaleY: Ae.value,
1131
+ hostOffsetX: Se.x,
1132
+ hostOffsetY: Se.y,
1133
+ stickyIndices: ue.value,
1134
+ stickyStartX: ae.value,
1135
+ stickyStartY: ie.value,
1136
+ stickyEndX: Te.value,
1137
+ stickyEndY: ke.value,
1138
+ flowPaddingStartX: fe.value,
1139
+ flowPaddingStartY: pe.value,
1140
+ flowPaddingEndX: _e.value,
1141
+ flowPaddingEndY: be.value,
1142
+ paddingStartX: te.value,
1143
+ paddingStartY: ce.value,
1144
+ paddingEndX: Pe.value,
1145
+ paddingEndY: Le.value
1146
+ }), Xe = 2, N = 2, M = r == null || Math.abs(I - D) < Xe, qe = l == null || Math.abs(U - J) < N, Ce = r == null || r === void 0 || x[r] === 1, Mt = l == null || l === void 0 || H[l] === 1;
1147
+ if (M && qe)
1148
+ Ce && Mt && !s.value && !X.value && (K.value = null);
1149
+ else {
1150
+ const me = yt(o) ? { ...o, isCorrection: !0 } : { align: o, isCorrection: !0 };
1151
+ vt(l, r, me);
1152
+ }
1153
+ }
1154
+ }
1155
+ Me([P, z, h], We), Me(s, (l) => {
1156
+ l || We();
1157
+ });
1158
+ let xe = null, O = null, _;
1159
+ const ge = (l) => {
1160
+ if (!l || typeof window > "u")
1161
+ return;
1162
+ const r = l === window ? document : l;
1163
+ if (r.addEventListener("scroll", c, { passive: !0 }), $ = null, L(), Zt(l) && (O = new MutationObserver(() => L()), O.observe(l, { attributes: !0, attributeFilter: ["dir", "style"] })), _ = setInterval(L, 1e3), l === window) {
1164
+ z.value = document.documentElement.clientWidth, h.value = document.documentElement.clientHeight, i.value = window.scrollX, t.value = window.scrollY;
1165
+ const o = () => {
1166
+ L(), z.value = document.documentElement.clientWidth, h.value = document.documentElement.clientHeight, He();
1167
+ };
1168
+ return window.addEventListener("resize", o), () => {
1169
+ r.removeEventListener("scroll", c), window.removeEventListener("resize", o), clearInterval(_), $ = null;
1170
+ };
1171
+ } else
1172
+ return z.value = l.clientWidth, h.value = l.clientHeight, i.value = l.scrollLeft, t.value = l.scrollTop, xe = new ResizeObserver((o) => {
1173
+ L();
1174
+ for (const f of o)
1175
+ f.target === l && (z.value = l.clientWidth, h.value = l.clientHeight, He());
1176
+ }), xe.observe(l), () => {
1177
+ r.removeEventListener("scroll", c), xe?.disconnect(), O?.disconnect(), clearInterval(_), $ = null;
1178
+ };
1179
+ };
1180
+ let Fe;
1181
+ return fl() && (hl(() => {
1182
+ w.value = !0, L(), Me(() => e.value.container, (l) => {
1183
+ Fe?.(), Fe = ge(l || null);
1184
+ }, { immediate: !0 }), He(), kt(() => {
1185
+ if (He(), e.value.ssrRange || e.value.initialScrollIndex !== void 0) {
1186
+ const l = e.value.initialScrollIndex !== void 0 ? e.value.initialScrollIndex : e.value.ssrRange?.start, r = e.value.initialScrollAlign || "start";
1187
+ l != null && vt(l, e.value.ssrRange?.colStart, { align: r, behavior: "auto" }), d.value = !0, S.value = !0, kt(() => {
1188
+ S.value = !1;
1189
+ });
1190
+ } else
1191
+ d.value = !0;
1192
+ });
1193
+ }), ll(() => {
1194
+ Fe?.();
1195
+ })), {
1196
+ /**
1197
+ * Array of items currently rendered in the DOM with their calculated offsets and sizes.
1198
+ * Offsets are in Display Units (DU), sizes are in Virtual Units (VU).
1199
+ * @see RenderedItem
1200
+ */
1201
+ renderedItems: Tt,
1202
+ /**
1203
+ * Total calculated width of all items including gaps (in VU).
1204
+ */
1205
+ totalWidth: Ve,
1206
+ /**
1207
+ * Total calculated height of all items including gaps (in VU).
1208
+ */
1209
+ totalHeight: we,
1210
+ /**
1211
+ * Total width to be rendered in the DOM (clamped to browser limits, in DU).
1212
+ */
1213
+ renderedWidth: ot,
1214
+ /**
1215
+ * Total height to be rendered in the DOM (clamped to browser limits, in DU).
1216
+ */
1217
+ renderedHeight: Qe,
1218
+ /**
1219
+ * Detailed information about the current scroll state.
1220
+ * Includes currentIndex, scrollOffset (VU), displayScrollOffset (DU), viewportSize (DU), totalSize (VU), and scrolling status.
1221
+ * @see ScrollDetails
1222
+ */
1223
+ scrollDetails: n,
1224
+ /**
1225
+ * Helper to get the height of a specific row based on current configuration and measurements.
1226
+ *
1227
+ * @param index - The row index.
1228
+ * @returns The height in VU (excluding gap).
1229
+ */
1230
+ getRowHeight: Xt,
1231
+ /**
1232
+ * Helper to get the width of a specific column based on current configuration and measurements.
1233
+ *
1234
+ * @param index - The column index.
1235
+ * @returns The width in VU (excluding gap).
1236
+ */
1237
+ getColumnWidth: $t,
1238
+ /**
1239
+ * Helper to get the virtual offset of a specific row.
1240
+ *
1241
+ * @param index - The row index.
1242
+ * @returns The virtual offset in VU.
1243
+ */
1244
+ getRowOffset: (l) => pe.value + ie.value + ce.value + C.query(l),
1245
+ /**
1246
+ * Helper to get the virtual offset of a specific column.
1247
+ *
1248
+ * @param index - The column index.
1249
+ * @returns The virtual offset in VU.
1250
+ */
1251
+ getColumnOffset: (l) => fe.value + ae.value + te.value + W.query(l),
1252
+ /**
1253
+ * Helper to get the virtual offset of a specific item along the scroll axis.
1254
+ *
1255
+ * @param index - The item index.
1256
+ * @returns The virtual offset in VU.
1257
+ */
1258
+ getItemOffset: (l) => Y.value === "horizontal" ? fe.value + ae.value + te.value + k.query(l) : pe.value + ie.value + ce.value + C.query(l),
1259
+ /**
1260
+ * Helper to get the size of a specific item along the scroll axis.
1261
+ *
1262
+ * @param index - The item index.
1263
+ * @returns The size in VU (excluding gap).
1264
+ */
1265
+ getItemSize: (l) => {
1266
+ if (Y.value === "horizontal")
1267
+ return Math.max(0, k.get(l) - (e.value.columnGap || 0));
1268
+ const r = e.value.itemSize;
1269
+ if (typeof r == "number" && r > 0)
1270
+ return r;
1271
+ if (typeof r == "function") {
1272
+ const o = e.value.items[l];
1273
+ return o !== void 0 ? r(o, l) : e.value.defaultItemSize || Dt;
1274
+ }
1275
+ return Math.max(0, C.get(l) - (e.value.gap || 0));
1276
+ },
1277
+ /**
1278
+ * Programmatically scroll to a specific row and/or column.
1279
+ *
1280
+ * @param rowIndex - The row index to scroll to. Pass null to only scroll horizontally.
1281
+ * @param colIndex - The column index to scroll to. Pass null to only scroll vertically.
1282
+ * @param options - Alignment and behavior options.
1283
+ * @see ScrollAlignment
1284
+ * @see ScrollToIndexOptions
1285
+ */
1286
+ scrollToIndex: vt,
1287
+ /**
1288
+ * Programmatically scroll to a specific pixel offset relative to the content start.
1289
+ *
1290
+ * @param x - The pixel offset to scroll to on the X axis (VU). Pass null to keep current position.
1291
+ * @param y - The pixel offset to scroll to on the Y axis (VU). Pass null to keep current position.
1292
+ * @param options - Scroll options (behavior).
1293
+ */
1294
+ scrollToOffset: je,
1295
+ /**
1296
+ * Stops any currently active smooth scroll animation and clears pending corrections.
1297
+ */
1298
+ stopProgrammaticScroll: v,
1299
+ /**
1300
+ * Updates the stored size of an item. Should be called when an item is measured (e.g., via ResizeObserver).
1301
+ *
1302
+ * @param index - The item index.
1303
+ * @param width - The measured inlineSize (width in DU).
1304
+ * @param height - The measured blockSize (height in DU).
1305
+ * @param element - The measured element (optional, used for robust grid column detection).
1306
+ */
1307
+ updateItemSize: ve,
1308
+ /**
1309
+ * Updates the stored size of multiple items simultaneously.
1310
+ *
1311
+ * @param updates - Array of measurement updates (sizes in DU).
1312
+ */
1313
+ updateItemSizes: A,
1314
+ /**
1315
+ * Recalculates the host element's offset relative to the scroll container.
1316
+ * Useful if the container or host moves without a resize event.
1317
+ */
1318
+ updateHostOffset: He,
1319
+ /**
1320
+ * Detects the current direction (LTR/RTL) of the scroll container.
1321
+ */
1322
+ updateDirection: L,
1323
+ /**
1324
+ * Information about the current visible range of columns and their paddings.
1325
+ * @see ColumnRange
1326
+ */
1327
+ columnRange: Ze,
1328
+ /**
1329
+ * Resets all dynamic measurements and re-initializes from props.
1330
+ * Useful if item sizes have changed externally.
1331
+ */
1332
+ refresh: () => {
1333
+ k.resize(0), C.resize(0), W.resize(0), x.fill(0), q.fill(0), H.fill(0), Ke();
1334
+ },
1335
+ /**
1336
+ * Whether the component has finished its first client-side mount and hydration.
1337
+ */
1338
+ isHydrated: d,
1339
+ /**
1340
+ * Whether the container is the window or body.
1341
+ */
1342
+ isWindowContainer: ne,
1343
+ /**
1344
+ * Whether the scroll container is in Right-to-Left (RTL) mode.
1345
+ */
1346
+ isRtl: m,
1347
+ /**
1348
+ * Coordinate scaling factor for X axis (VU/DU).
1349
+ */
1350
+ scaleX: he,
1351
+ /**
1352
+ * Coordinate scaling factor for Y axis (VU/DU).
1353
+ */
1354
+ scaleY: Ae,
1355
+ /**
1356
+ * Absolute offset of the component within its container (DU).
1357
+ */
1358
+ componentOffset: Se,
1359
+ /**
1360
+ * Physical width of the items wrapper in the DOM (clamped to browser limits, in DU).
1361
+ */
1362
+ renderedVirtualWidth: xt,
1363
+ /**
1364
+ * Physical height of the items wrapper in the DOM (clamped to browser limits, in DU).
1365
+ */
1366
+ renderedVirtualHeight: oe
1367
+ };
1368
+ }
1369
+ function tl(a) {
1370
+ const e = u(() => st(a.axis)), i = u(() => st(a.totalSize)), t = u(() => st(a.position)), s = u(() => st(a.viewportSize)), d = u(() => st(a.containerId)), S = u(() => !!st(a.isRtl)), w = u(() => e.value === "horizontal"), m = u(() => i.value <= 0 ? 0 : Math.min(1, s.value / i.value)), z = u(() => {
1371
+ const x = i.value - s.value;
1372
+ return x <= 0 ? 0 : Math.max(0, Math.min(1, t.value / x));
1373
+ }), h = u(() => {
1374
+ const q = s.value > 0 ? 32 / s.value : 0.1;
1375
+ return Math.max(Math.min(q, 0.1), m.value) * 100;
1376
+ }), E = u(() => z.value * (100 - h.value)), b = u(() => w.value ? {
1377
+ inlineSize: `${h.value}%`,
1378
+ insetInlineStart: `${E.value}%`
1379
+ } : {
1380
+ blockSize: `${h.value}%`,
1381
+ insetBlockStart: `${E.value}%`
1382
+ }), V = u(() => {
1383
+ const x = s.value, q = "var(--vs-scrollbar-has-cross-gap, var(--vsi-scrollbar-has-cross-gap, 0)) * var(--vs-scrollbar-cross-gap, var(--vsi-scrollbar-size, 8px))";
1384
+ return w.value ? {
1385
+ inlineSize: `calc(${Math.max(0, x - 4)}px - ${q})`
1386
+ } : {
1387
+ blockSize: `calc(${Math.max(0, x - 4)}px - ${q})`
1388
+ };
1389
+ }), X = ee(!1);
1390
+ let R = 0, T = 0;
1391
+ function $(x) {
1392
+ const q = x.currentTarget;
1393
+ if (x.target !== q)
1394
+ return;
1395
+ const H = q.getBoundingClientRect(), K = w.value ? H.width : H.height;
1396
+ let Q = 0;
1397
+ w.value ? Q = S.value ? H.right - x.clientX : x.clientX - H.left : Q = x.clientY - H.top;
1398
+ const Z = h.value / 100 * K, Y = (Q - Z / 2) / (K - Z), re = i.value - s.value;
1399
+ let de = Y * re;
1400
+ de > re - 1 && (de = re), a.scrollToOffset(Math.max(0, Math.min(re, de)));
1401
+ }
1402
+ function L(x) {
1403
+ X.value = !0, R = w.value ? S.value ? -x.clientX : x.clientX : x.clientY, T = t.value, x.currentTarget.setPointerCapture(x.pointerId), x.preventDefault(), x.stopPropagation();
1404
+ }
1405
+ function k(x) {
1406
+ if (!X.value)
1407
+ return;
1408
+ const H = x.currentTarget.parentElement;
1409
+ if (!H)
1410
+ return;
1411
+ const Q = (w.value ? S.value ? -x.clientX : x.clientX : x.clientY) - R, Z = H.getBoundingClientRect(), Y = w.value ? Z.width : Z.height, re = h.value / 100 * Y, de = Y - re;
1412
+ if (de <= 0)
1413
+ return;
1414
+ const G = i.value - s.value;
1415
+ let le = T + Q / de * G;
1416
+ le > G - 1 && (le = G), a.scrollToOffset(Math.max(0, Math.min(G, le)));
1417
+ }
1418
+ function C(x) {
1419
+ X.value && (X.value = !1, x.currentTarget.releasePointerCapture(x.pointerId));
1420
+ }
1421
+ fl() && ll(() => {
1422
+ X.value = !1;
1423
+ });
1424
+ const W = u(() => ({
1425
+ class: [
1426
+ "virtual-scrollbar-track",
1427
+ `virtual-scrollbar-track--${w.value ? "horizontal" : "vertical"}`
1428
+ ],
1429
+ style: V.value,
1430
+ role: "scrollbar",
1431
+ "aria-orientation": e.value,
1432
+ "aria-valuenow": Math.round(t.value),
1433
+ "aria-valuemin": 0,
1434
+ "aria-valuemax": Math.round(i.value - s.value),
1435
+ "aria-controls": d.value,
1436
+ tabindex: -1,
1437
+ onMousedown: $
1438
+ })), P = u(() => ({
1439
+ class: [
1440
+ "virtual-scrollbar-thumb",
1441
+ `virtual-scrollbar-thumb--${w.value ? "horizontal" : "vertical"}`,
1442
+ {
1443
+ "virtual-scrollbar-thumb--active": X.value
1444
+ }
1445
+ ],
1446
+ style: b.value,
1447
+ onPointerdown: L,
1448
+ onPointermove: k,
1449
+ onPointerup: C,
1450
+ onPointercancel: C
1451
+ }));
1452
+ return {
1453
+ /** Viewport size as a percentage of total size (0 to 1). */
1454
+ viewportPercent: m,
1455
+ /** Current scroll position as a percentage of the scrollable range (0 to 1). */
1456
+ positionPercent: z,
1457
+ /** Calculated thumb size as a percentage of the track size (0 to 100). */
1458
+ thumbSizePercent: h,
1459
+ /** Calculated thumb position as a percentage of the track size (0 to 100). */
1460
+ thumbPositionPercent: E,
1461
+ /** Reactive style object for the scrollbar track. */
1462
+ trackStyle: V,
1463
+ /** Reactive style object for the scrollbar thumb. */
1464
+ thumbStyle: b,
1465
+ /** Attributes and event listeners to be bound to the track element. */
1466
+ trackProps: W,
1467
+ /** Attributes and event listeners to be bound to the thumb element. */
1468
+ thumbProps: P,
1469
+ /** Whether the thumb is currently being dragged. */
1470
+ isDragging: X
1471
+ };
1472
+ }
1473
+ const vl = /* @__PURE__ */ gl({
1474
+ __name: "VirtualScrollbar",
1475
+ props: {
1476
+ axis: { default: "vertical" },
1477
+ totalSize: {},
1478
+ position: {},
1479
+ viewportSize: {},
1480
+ scrollToOffset: {},
1481
+ containerId: {},
1482
+ isRtl: { type: Boolean, default: !1 }
1483
+ },
1484
+ emits: ["scrollToOffset"],
1485
+ setup(a, { emit: e }) {
1486
+ const i = a, t = e, { trackProps: s, thumbProps: d } = tl({
1487
+ axis: () => i.axis,
1488
+ totalSize: () => i.totalSize,
1489
+ position: () => i.position,
1490
+ viewportSize: () => i.viewportSize,
1491
+ containerId: () => i.containerId,
1492
+ isRtl: () => i.isRtl,
1493
+ scrollToOffset: (S) => {
1494
+ i.scrollToOffset?.(S), t("scrollToOffset", S);
1495
+ }
1496
+ });
1497
+ return (S, w) => (Ee(), It("div", St(il(tt(s))), [
1498
+ el("div", St(il(tt(d))), null, 16)
1499
+ ], 16));
1500
+ }
1501
+ }), Al = {
1502
+ key: 0,
1503
+ class: "virtual-scroll-scrollbar-container"
1504
+ }, Wl = {
1505
+ key: 0,
1506
+ class: "virtual-scroll-debug-info"
1507
+ }, dl = 0.95, Gt = 0.1, ql = /* @__PURE__ */ gl({
1508
+ __name: "VirtualScroll",
1509
+ props: {
1510
+ items: {},
1511
+ itemSize: {},
1512
+ direction: { default: "vertical" },
1513
+ bufferBefore: { default: 5 },
1514
+ bufferAfter: { default: 5 },
1515
+ container: {},
1516
+ ssrRange: {},
1517
+ columnCount: { default: 0 },
1518
+ columnWidth: {},
1519
+ containerTag: { default: "div" },
1520
+ wrapperTag: { default: "div" },
1521
+ itemTag: { default: "div" },
1522
+ scrollPaddingStart: { default: 0 },
1523
+ scrollPaddingEnd: { default: 0 },
1524
+ stickyHeader: { type: Boolean, default: !1 },
1525
+ stickyFooter: { type: Boolean, default: !1 },
1526
+ gap: { default: 0 },
1527
+ columnGap: { default: 0 },
1528
+ stickyIndices: { default: () => [] },
1529
+ loadDistance: { default: 200 },
1530
+ loading: { type: Boolean, default: !1 },
1531
+ restoreScrollOnPrepend: { type: Boolean, default: !1 },
1532
+ initialScrollIndex: {},
1533
+ initialScrollAlign: {},
1534
+ defaultItemSize: {},
1535
+ defaultColumnWidth: {},
1536
+ debug: { type: Boolean, default: !1 },
1537
+ virtualScrollbar: { type: Boolean, default: !1 }
1538
+ },
1539
+ emits: ["scroll", "load", "visibleRangeChange"],
1540
+ setup(a, { expose: e, emit: i }) {
1541
+ const t = a, s = i, d = yl(), S = ee(null), w = ee(null), m = ee(null), z = ee(null), h = /* @__PURE__ */ new Map(), E = Sl(), b = u(() => `vs-container-${E}`), V = ee(0), X = ee(0), R = u(() => t.container === void 0 ? S.value : t.container), T = u(() => {
1542
+ const n = R.value;
1543
+ return n === S.value || typeof window < "u" && (n === window || n === null);
1544
+ }), $ = u(() => (t.items.length, {
1545
+ items: t.items,
1546
+ itemSize: t.itemSize,
1547
+ direction: t.direction,
1548
+ bufferBefore: t.bufferBefore,
1549
+ bufferAfter: t.bufferAfter,
1550
+ container: R.value,
1551
+ hostElement: w.value,
1552
+ hostRef: S.value,
1553
+ ssrRange: t.ssrRange,
1554
+ columnCount: t.columnCount,
1555
+ columnWidth: t.columnWidth,
1556
+ scrollPaddingStart: {
1557
+ x: lt(t.scrollPaddingStart, t.direction),
1558
+ y: at(t.scrollPaddingStart, t.direction)
1559
+ },
1560
+ scrollPaddingEnd: {
1561
+ x: lt(t.scrollPaddingEnd, t.direction),
1562
+ y: at(t.scrollPaddingEnd, t.direction)
1563
+ },
1564
+ flowPaddingStart: {
1565
+ x: 0,
1566
+ y: t.stickyHeader ? 0 : V.value
1567
+ },
1568
+ flowPaddingEnd: {
1569
+ x: 0,
1570
+ y: t.stickyFooter ? 0 : X.value
1571
+ },
1572
+ stickyStart: {
1573
+ x: 0,
1574
+ y: t.stickyHeader && T.value ? V.value : 0
1575
+ },
1576
+ stickyEnd: {
1577
+ x: 0,
1578
+ y: t.stickyFooter && T.value ? X.value : 0
1579
+ },
1580
+ gap: t.gap,
1581
+ columnGap: t.columnGap,
1582
+ stickyIndices: t.stickyIndices,
1583
+ loadDistance: t.loadDistance,
1584
+ loading: t.loading,
1585
+ restoreScrollOnPrepend: t.restoreScrollOnPrepend,
1586
+ initialScrollIndex: t.initialScrollIndex,
1587
+ initialScrollAlign: t.initialScrollAlign,
1588
+ defaultItemSize: t.defaultItemSize,
1589
+ defaultColumnWidth: t.defaultColumnWidth,
1590
+ debug: t.debug
1591
+ })), {
1592
+ isHydrated: L,
1593
+ isRtl: k,
1594
+ columnRange: C,
1595
+ renderedItems: W,
1596
+ scrollDetails: P,
1597
+ renderedHeight: x,
1598
+ renderedWidth: q,
1599
+ getColumnWidth: H,
1600
+ getRowHeight: K,
1601
+ scrollToIndex: Q,
1602
+ scrollToOffset: Z,
1603
+ updateHostOffset: Y,
1604
+ updateItemSizes: re,
1605
+ updateDirection: de,
1606
+ getItemOffset: G,
1607
+ getRowOffset: le,
1608
+ getColumnOffset: Be,
1609
+ getItemSize: ue,
1610
+ refresh: wt,
1611
+ stopProgrammaticScroll: te,
1612
+ scaleX: Pe,
1613
+ scaleY: ce,
1614
+ isWindowContainer: Le,
1615
+ componentOffset: ae,
1616
+ renderedVirtualWidth: Te,
1617
+ renderedVirtualHeight: ie
1618
+ } = Ol($), ke = u(() => Pe.value !== 1 || ce.value !== 1), fe = u(() => Le.value ? !1 : t.virtualScrollbar === !0 || Pe.value !== 1 || ce.value !== 1);
1619
+ function _e(n) {
1620
+ const { displayViewportSize: v } = P.value, c = x.value - v.height;
1621
+ if (n >= c - 0.5)
1622
+ Z(null, Number.POSITIVE_INFINITY);
1623
+ else {
1624
+ const A = ct(n, ae.y, ce.value);
1625
+ Z(null, A);
1626
+ }
1627
+ }
1628
+ function pe(n) {
1629
+ const { displayViewportSize: v } = P.value, c = q.value - v.width;
1630
+ if (n >= c - 0.5)
1631
+ Z(Number.POSITIVE_INFINITY, null);
1632
+ else {
1633
+ const A = ct(n, ae.x, Pe.value);
1634
+ Z(A, null);
1635
+ }
1636
+ }
1637
+ const be = tl({
1638
+ axis: "vertical",
1639
+ totalSize: x,
1640
+ position: u(() => P.value.displayScrollOffset.y),
1641
+ viewportSize: u(() => P.value.displayViewportSize.height),
1642
+ scrollToOffset: _e,
1643
+ containerId: b,
1644
+ isRtl: k
1645
+ }), ye = tl({
1646
+ axis: "horizontal",
1647
+ totalSize: q,
1648
+ position: u(() => P.value.displayScrollOffset.x),
1649
+ viewportSize: u(() => P.value.displayViewportSize.width),
1650
+ scrollToOffset: pe,
1651
+ containerId: b,
1652
+ isRtl: k
1653
+ }), Ge = u(() => t.direction !== "both" ? C.value : {
1654
+ ...C.value,
1655
+ padStart: 0,
1656
+ padEnd: 0
1657
+ });
1658
+ function nt() {
1659
+ wt(), de(), kt(() => {
1660
+ const n = [];
1661
+ for (const [v, c] of h.entries())
1662
+ c && n.push({
1663
+ index: v,
1664
+ inlineSize: c.offsetWidth,
1665
+ blockSize: c.offsetHeight,
1666
+ element: c
1667
+ });
1668
+ n.length > 0 && re(n);
1669
+ });
1670
+ }
1671
+ Me(P, (n, v) => {
1672
+ !L.value || !n || (s("scroll", n), (!v || !v.range || !v.columnRange || n.range.start !== v.range.start || n.range.end !== v.range.end || n.columnRange.start !== v.columnRange.start || n.columnRange.end !== v.columnRange.end) && s("visibleRangeChange", {
1673
+ start: n.range.start,
1674
+ end: n.range.end,
1675
+ colStart: n.columnRange.start,
1676
+ colEnd: n.columnRange.end
1677
+ }), !t.loading && (t.direction !== "horizontal" && n.totalSize && n.totalSize.height - (n.scrollOffset.y + n.viewportSize.height) <= t.loadDistance && s("load", "vertical"), t.direction !== "vertical" && n.totalSize && n.totalSize.width - (n.scrollOffset.x + n.viewportSize.width) <= t.loadDistance && s("load", "horizontal")));
1678
+ }), Me(L, (n) => {
1679
+ n && P.value?.range && P.value?.columnRange && s("visibleRangeChange", {
1680
+ start: P.value.range.start,
1681
+ end: P.value.range.end,
1682
+ colStart: P.value.columnRange.start,
1683
+ colEnd: P.value.columnRange.end
1684
+ });
1685
+ }, { once: !0 });
1686
+ const ne = typeof window > "u" ? null : new ResizeObserver(Y), Oe = typeof window > "u" ? null : new ResizeObserver((n) => {
1687
+ const v = [];
1688
+ for (const c of n) {
1689
+ const A = c.target, ve = Number(A.dataset.index), We = A.dataset.colIndex;
1690
+ let xe = c.contentRect.width, O = c.contentRect.height;
1691
+ c.borderBoxSize && c.borderBoxSize.length > 0 ? (xe = c.borderBoxSize[0].inlineSize, O = c.borderBoxSize[0].blockSize) : (xe = A.offsetWidth, O = A.offsetHeight), We !== void 0 ? v.push({ index: -1, inlineSize: xe, blockSize: O, element: A }) : Number.isNaN(ve) || v.push({ index: ve, inlineSize: xe, blockSize: O, element: A });
1692
+ }
1693
+ v.length > 0 && re(v);
1694
+ }), Ie = typeof window > "u" ? null : new ResizeObserver(() => {
1695
+ V.value = m.value?.offsetHeight || 0, X.value = z.value?.offsetHeight || 0, Y();
1696
+ });
1697
+ Me(m, (n, v) => {
1698
+ v && Ie?.unobserve(v), n ? Ie?.observe(n) : V.value = 0;
1699
+ }, { immediate: !0 }), Me(z, (n, v) => {
1700
+ v && Ie?.unobserve(v), n ? Ie?.observe(n) : X.value = 0;
1701
+ }, { immediate: !0 }), hl(() => {
1702
+ S.value && ne?.observe(S.value);
1703
+ for (const n of h.values())
1704
+ Oe?.observe(n), t.direction === "both" && n.querySelectorAll("[data-col-index]").forEach((v) => Oe?.observe(v));
1705
+ }), Me([S, w], ([n], [v]) => {
1706
+ v && ne?.unobserve(v), n && ne?.observe(n);
1707
+ }), Me([S, ke], ([n, v], [c, A]) => {
1708
+ const ve = n !== c || v !== A;
1709
+ c && ve && c.removeEventListener("wheel", vt), n && ve && n.addEventListener("wheel", vt, { passive: !v });
1710
+ }, { immediate: !0 });
1711
+ function Ve(n, v) {
1712
+ if (n)
1713
+ h.set(v, n), Oe?.observe(n), t.direction === "both" && n.querySelectorAll("[data-col-index]").forEach((c) => Oe?.observe(c));
1714
+ else {
1715
+ const c = h.get(v);
1716
+ c && (Oe?.unobserve(c), t.direction === "both" && c.querySelectorAll("[data-col-index]").forEach((A) => Oe?.unobserve(A)), h.delete(v));
1717
+ }
1718
+ }
1719
+ const we = ee(!1);
1720
+ let Se = { x: 0, y: 0 }, ot = { x: 0, y: 0 }, Qe = { x: 0, y: 0 }, xt = 0, oe = { x: 0, y: 0 }, he = null;
1721
+ function Ae() {
1722
+ const n = () => {
1723
+ oe.x *= dl, oe.y *= dl;
1724
+ const v = P.value.scrollOffset.x, c = P.value.scrollOffset.y;
1725
+ Z(
1726
+ v + oe.x * 16,
1727
+ // Assuming ~60fps (16ms per frame)
1728
+ c + oe.y * 16,
1729
+ { behavior: "auto" }
1730
+ ), Math.abs(oe.x) > Gt || Math.abs(oe.y) > Gt ? he = requestAnimationFrame(n) : Re();
1731
+ };
1732
+ he = requestAnimationFrame(n);
1733
+ }
1734
+ function Re() {
1735
+ he !== null && (cancelAnimationFrame(he), he = null), oe = { x: 0, y: 0 };
1736
+ }
1737
+ function $e(n) {
1738
+ te(), Re(), ke.value && (n.pointerType === "mouse" && n.button !== 0 || (we.value = !0, Se = { x: n.clientX, y: n.clientY }, Qe = { x: n.clientX, y: n.clientY }, xt = performance.now(), ot = {
1739
+ x: P.value.scrollOffset.x,
1740
+ y: P.value.scrollOffset.y
1741
+ }, n.currentTarget.setPointerCapture(n.pointerId)));
1742
+ }
1743
+ function $t(n) {
1744
+ if (!we.value)
1745
+ return;
1746
+ const v = performance.now(), c = v - xt;
1747
+ if (c > 0) {
1748
+ const We = (Qe.x - n.clientX) / c, xe = (Qe.y - n.clientY) / c;
1749
+ oe.x = oe.x * 0.2 + We * 0.8, oe.y = oe.y * 0.2 + xe * 0.8;
1750
+ }
1751
+ Qe = { x: n.clientX, y: n.clientY }, xt = v;
1752
+ const A = Se.x - n.clientX, ve = Se.y - n.clientY;
1753
+ requestAnimationFrame(() => {
1754
+ Z(
1755
+ ot.x + A,
1756
+ ot.y + ve,
1757
+ { behavior: "auto" }
1758
+ );
1759
+ });
1760
+ }
1761
+ function Xt(n) {
1762
+ we.value && (we.value = !1, n.currentTarget.releasePointerCapture(n.pointerId), (Math.abs(oe.x) > Gt || Math.abs(oe.y) > Gt) && (Math.abs(oe.x) > 4 * Math.abs(oe.y) ? oe.y = 0 : Math.abs(oe.y) > 4 * Math.abs(oe.x) && (oe.x = 0), Ae()));
1763
+ }
1764
+ function vt(n) {
1765
+ const { scrollOffset: v } = P.value;
1766
+ if (te(), ke.value) {
1767
+ n.preventDefault();
1768
+ let c = n.deltaX, A = n.deltaY;
1769
+ n.shiftKey && c === 0 && (c = A, A = 0);
1770
+ const ve = v.x + c, We = v.y + A;
1771
+ Z(ve, We, { behavior: "auto" });
1772
+ }
1773
+ }
1774
+ function je(n) {
1775
+ const { viewportSize: v, scrollOffset: c } = P.value, A = t.direction !== "vertical", ve = t.direction !== "horizontal", We = $.value.stickyStart, xe = $.value.stickyEnd;
1776
+ switch (n.key) {
1777
+ case "Home": {
1778
+ n.preventDefault(), te();
1779
+ const O = Math.max(c.x, c.y), _ = t.direction === "horizontal" ? v.width : v.height, ge = O > 10 * _ ? "auto" : "smooth";
1780
+ Q(0, 0, { behavior: ge, align: "start" });
1781
+ break;
1782
+ }
1783
+ case "End": {
1784
+ n.preventDefault(), te();
1785
+ const O = t.items.length - 1, _ = (t.columnCount || 0) > 0 ? t.columnCount - 1 : 0, { totalSize: ge } = P.value, Fe = Math.max(
1786
+ ge.width - c.x - v.width,
1787
+ ge.height - c.y - v.height
1788
+ ), dt = t.direction === "horizontal" ? v.width : v.height, l = Fe > 10 * dt ? "auto" : "smooth";
1789
+ t.direction === "both" ? Q(O, _, { behavior: l, align: "end" }) : Q(
1790
+ t.direction === "vertical" ? O : 0,
1791
+ t.direction === "horizontal" ? O : 0,
1792
+ { behavior: l, align: "end" }
1793
+ );
1794
+ break;
1795
+ }
1796
+ case "ArrowUp": {
1797
+ if (n.preventDefault(), te(), !ve)
1798
+ return;
1799
+ const { currentIndex: O, scrollOffset: _ } = P.value, ge = _.y + We.y + $.value.scrollPaddingStart.y;
1800
+ le(O) < ge - 1 ? Q(O, null, { align: "start" }) : O > 0 && Q(O - 1, null, { align: "start" });
1801
+ break;
1802
+ }
1803
+ case "ArrowDown": {
1804
+ if (n.preventDefault(), te(), !ve)
1805
+ return;
1806
+ const { currentEndIndex: O } = P.value, _ = c.y + v.height - (xe.y + $.value.scrollPaddingEnd.y);
1807
+ le(O) + K(O) > _ + 1 ? Q(O, null, { align: "end" }) : O < t.items.length - 1 && Q(O + 1, null, { align: "end" });
1808
+ break;
1809
+ }
1810
+ case "ArrowLeft": {
1811
+ if (n.preventDefault(), te(), !A)
1812
+ return;
1813
+ const { currentColIndex: O, currentEndColIndex: _ } = P.value;
1814
+ if (k.value) {
1815
+ const ge = c.x + v.width - (xe.x + $.value.scrollPaddingEnd.x);
1816
+ if ((t.columnCount ? Be(_) + H(_) : G(_) + ue(_)) > ge + 1)
1817
+ Q(null, _, { align: "end" });
1818
+ else {
1819
+ const dt = t.columnCount ? t.columnCount - 1 : t.items.length - 1;
1820
+ _ < dt && Q(null, _ + 1, { align: "end" });
1821
+ }
1822
+ } else {
1823
+ const ge = c.x + We.x + $.value.scrollPaddingStart.x;
1824
+ (t.columnCount ? Be(O) : G(O)) < ge - 1 ? Q(null, O, { align: "start" }) : O > 0 && Q(null, O - 1, { align: "start" });
1825
+ }
1826
+ break;
1827
+ }
1828
+ case "ArrowRight": {
1829
+ if (n.preventDefault(), te(), !A)
1830
+ return;
1831
+ const { currentColIndex: O, currentEndColIndex: _ } = P.value;
1832
+ if (k.value) {
1833
+ const ge = c.x + We.x + $.value.scrollPaddingStart.x;
1834
+ (t.columnCount ? Be(O) : G(O)) < ge - 1 ? Q(null, O, { align: "start" }) : O > 0 && Q(null, O - 1, { align: "start" });
1835
+ } else {
1836
+ const ge = c.x + v.width - (xe.x + $.value.scrollPaddingEnd.x);
1837
+ if ((t.columnCount ? Be(_) + H(_) : G(_) + ue(_)) > ge + 1)
1838
+ Q(null, _, { align: "end" });
1839
+ else {
1840
+ const dt = t.columnCount ? t.columnCount - 1 : t.items.length - 1;
1841
+ _ < dt && Q(null, _ + 1, { align: "end" });
1842
+ }
1843
+ }
1844
+ break;
1845
+ }
1846
+ case "PageUp":
1847
+ n.preventDefault(), te(), Z(
1848
+ !ve && A ? c.x - v.width : null,
1849
+ ve ? c.y - v.height : null
1850
+ );
1851
+ break;
1852
+ case "PageDown":
1853
+ n.preventDefault(), te(), Z(
1854
+ !ve && A ? c.x + v.width : null,
1855
+ ve ? c.y + v.height : null
1856
+ );
1857
+ break;
1858
+ }
1859
+ }
1860
+ ll(() => {
1861
+ ne?.disconnect(), Oe?.disconnect(), Ie?.disconnect();
1862
+ });
1863
+ const Ft = u(() => {
1864
+ const n = {
1865
+ ...t.direction !== "vertical" ? { whiteSpace: "nowrap" } : {}
1866
+ };
1867
+ return fe.value && (n.overflow = "auto"), ke.value && (n.touchAction = "none"), Le.value ? n : t.containerTag === "table" ? {
1868
+ ...n,
1869
+ minInlineSize: t.direction === "vertical" ? "100%" : "auto"
1870
+ } : n;
1871
+ }), it = u(() => {
1872
+ if (t.direction === "horizontal")
1873
+ return null;
1874
+ const { displayViewportSize: n, displayScrollOffset: v } = P.value;
1875
+ if (x.value <= n.height)
1876
+ return null;
1877
+ const c = {
1878
+ axis: "vertical",
1879
+ totalSize: x.value,
1880
+ position: v.y,
1881
+ viewportSize: n.height,
1882
+ scrollToOffset: _e,
1883
+ containerId: b.value,
1884
+ isRtl: k.value
1885
+ };
1886
+ return {
1887
+ positionPercent: be.positionPercent.value,
1888
+ viewportPercent: be.viewportPercent.value,
1889
+ thumbSizePercent: be.thumbSizePercent.value,
1890
+ thumbPositionPercent: be.thumbPositionPercent.value,
1891
+ trackProps: be.trackProps.value,
1892
+ thumbProps: be.thumbProps.value,
1893
+ scrollbarProps: c,
1894
+ isDragging: be.isDragging.value
1895
+ };
1896
+ }), Ke = u(() => {
1897
+ if (t.direction === "vertical")
1898
+ return null;
1899
+ const { displayViewportSize: n, displayScrollOffset: v } = P.value;
1900
+ if (q.value <= n.width)
1901
+ return null;
1902
+ const c = {
1903
+ axis: "horizontal",
1904
+ totalSize: q.value,
1905
+ position: v.x,
1906
+ viewportSize: n.width,
1907
+ scrollToOffset: pe,
1908
+ containerId: b.value,
1909
+ isRtl: k.value
1910
+ };
1911
+ return {
1912
+ positionPercent: ye.positionPercent.value,
1913
+ viewportPercent: ye.viewportPercent.value,
1914
+ thumbSizePercent: ye.thumbSizePercent.value,
1915
+ thumbPositionPercent: ye.thumbPositionPercent.value,
1916
+ trackProps: ye.trackProps.value,
1917
+ thumbProps: ye.thumbProps.value,
1918
+ scrollbarProps: c,
1919
+ isDragging: ye.isDragging.value
1920
+ };
1921
+ }), He = u(() => {
1922
+ const n = t.direction === "horizontal", v = t.direction === "vertical", c = t.direction === "both", A = {
1923
+ inlineSize: v ? "100%" : `${Te.value}px`,
1924
+ blockSize: n ? "100%" : `${ie.value}px`
1925
+ };
1926
+ return L.value || (A.display = "flex", A.flexDirection = n ? "row" : "column", (n || c) && t.columnGap && (A.columnGap = `${t.columnGap}px`), (v || c) && t.gap && (A.rowGap = `${t.gap}px`)), A;
1927
+ }), rt = u(() => {
1928
+ const n = t.direction === "horizontal";
1929
+ return {
1930
+ display: n ? "inline-block" : "block",
1931
+ ...n ? { blockSize: "100%", verticalAlign: "top" } : { inlineSize: "100%" }
1932
+ };
1933
+ }), zt = u(() => ({
1934
+ inlineSize: t.direction === "vertical" ? "1px" : `${Te.value}px`,
1935
+ blockSize: t.direction === "horizontal" ? "1px" : `${ie.value}px`
1936
+ }));
1937
+ function Ct(n) {
1938
+ const v = El({
1939
+ containerTag: t.containerTag,
1940
+ direction: t.direction,
1941
+ isHydrated: L.value,
1942
+ item: n,
1943
+ itemSize: t.itemSize,
1944
+ paddingStartX: $.value.scrollPaddingStart.x,
1945
+ paddingStartY: $.value.scrollPaddingStart.y,
1946
+ isRtl: k.value
1947
+ });
1948
+ return !L.value && t.direction === "both" && (v.display = "flex", t.columnGap && (v.columnGap = `${t.columnGap}px`)), v;
1949
+ }
1950
+ const Yt = u(() => t.debug), Ze = u(() => t.containerTag === "table"), Et = u(() => Ze.value ? "thead" : "div"), Tt = u(() => Ze.value ? "tfoot" : "div");
1951
+ return e({
1952
+ ...bl(t),
1953
+ /**
1954
+ * Detailed information about the current scroll state.
1955
+ * @see ScrollDetails
1956
+ * @see useVirtualScroll
1957
+ */
1958
+ scrollDetails: P,
1959
+ /**
1960
+ * Information about the current visible range of columns.
1961
+ * @see ColumnRange
1962
+ * @see useVirtualScroll
1963
+ */
1964
+ columnRange: C,
1965
+ /**
1966
+ * Helper to get the width of a specific column.
1967
+ * @param index - The column index.
1968
+ * @see useVirtualScroll
1969
+ */
1970
+ getColumnWidth: H,
1971
+ /**
1972
+ * Helper to get the height of a specific row.
1973
+ * @param index - The row index.
1974
+ * @see useVirtualScroll
1975
+ */
1976
+ getRowHeight: K,
1977
+ /**
1978
+ * Helper to get the virtual offset of a specific row.
1979
+ * @param index - The row index.
1980
+ * @see useVirtualScroll
1981
+ */
1982
+ getRowOffset: le,
1983
+ /**
1984
+ * Helper to get the virtual offset of a specific column.
1985
+ * @param index - The column index.
1986
+ * @see useVirtualScroll
1987
+ */
1988
+ getColumnOffset: Be,
1989
+ /**
1990
+ * Helper to get the virtual offset of a specific item.
1991
+ * @param index - The item index.
1992
+ * @see useVirtualScroll
1993
+ */
1994
+ getItemOffset: G,
1995
+ /**
1996
+ * Helper to get the size of a specific item along the scroll axis.
1997
+ * @param index - The item index.
1998
+ * @see useVirtualScroll
1999
+ */
2000
+ getItemSize: ue,
2001
+ /**
2002
+ * Programmatically scroll to a specific row and/or column.
2003
+ *
2004
+ * @param rowIndex - The row index to scroll to. Pass null to only scroll horizontally.
2005
+ * @param colIndex - The column index to scroll to. Pass null to only scroll vertically.
2006
+ * @param options - Alignment and behavior options. Defaults to { align: 'auto', behavior: 'auto' }.
2007
+ * @see ScrollAlignment
2008
+ * @see ScrollToIndexOptions
2009
+ * @see useVirtualScroll
2010
+ */
2011
+ scrollToIndex: Q,
2012
+ /**
2013
+ * Programmatically scroll to a specific pixel offset.
2014
+ *
2015
+ * @param x - The pixel offset to scroll to on the X axis. Pass null to keep current position.
2016
+ * @param y - The pixel offset to scroll to on the Y axis. Pass null to keep current position.
2017
+ * @param options - Scroll options (behavior). Defaults to { behavior: 'auto' }.
2018
+ * @see useVirtualScroll
2019
+ */
2020
+ scrollToOffset: Z,
2021
+ /**
2022
+ * Resets all dynamic measurements and re-initializes from props.
2023
+ * @see useVirtualScroll
2024
+ */
2025
+ refresh: nt,
2026
+ /**
2027
+ * Immediately stops any currently active smooth scroll animation and clears pending corrections.
2028
+ * @see useVirtualScroll
2029
+ */
2030
+ stopProgrammaticScroll: () => {
2031
+ te(), Re();
2032
+ },
2033
+ /**
2034
+ * Detects the current direction (LTR/RTL) of the scroll container.
2035
+ */
2036
+ updateDirection: de,
2037
+ /**
2038
+ * Whether the scroll container is in Right-to-Left (RTL) mode.
2039
+ */
2040
+ isRtl: k,
2041
+ /**
2042
+ * Whether the component has finished its first client-side mount and hydration.
2043
+ */
2044
+ isHydrated: L,
2045
+ /**
2046
+ * Coordinate scaling factor for X axis.
2047
+ */
2048
+ scaleX: Pe,
2049
+ /**
2050
+ * Coordinate scaling factor for Y axis.
2051
+ */
2052
+ scaleY: ce,
2053
+ /**
2054
+ * Physical width of the content in the DOM (clamped to browser limits).
2055
+ */
2056
+ renderedWidth: q,
2057
+ /**
2058
+ * Physical height of the content in the DOM (clamped to browser limits).
2059
+ */
2060
+ renderedHeight: x,
2061
+ /**
2062
+ * Absolute offset of the component within its container.
2063
+ */
2064
+ componentOffset: ae,
2065
+ /**
2066
+ * Properties for the vertical scrollbar.
2067
+ * Useful when building custom scrollbar interfaces.
2068
+ */
2069
+ scrollbarPropsVertical: it,
2070
+ /**
2071
+ * Properties for the horizontal scrollbar.
2072
+ * Useful when building custom scrollbar interfaces.
2073
+ */
2074
+ scrollbarPropsHorizontal: Ke
2075
+ }), (n, v) => (Ee(), Je(ht(a.containerTag), {
2076
+ id: b.value,
2077
+ ref_key: "hostRef",
2078
+ ref: S,
2079
+ class: Bt(["virtual-scroll-container", [
2080
+ `virtual-scroll--${a.direction}`,
2081
+ {
2082
+ "virtual-scroll--hydrated": tt(L),
2083
+ "virtual-scroll--window": tt(Le),
2084
+ "virtual-scroll--table": Ze.value,
2085
+ "virtual-scroll--hide-scrollbar": fe.value
2086
+ }
2087
+ ]]),
2088
+ style: gt(Ft.value),
2089
+ tabindex: "0",
2090
+ onKeydown: je,
2091
+ onPointerdown: $e,
2092
+ onPointermove: $t,
2093
+ onPointerup: Xt,
2094
+ onPointercancel: Xt
2095
+ }, {
2096
+ default: mt(() => [
2097
+ fe.value ? (Ee(), It("div", Al, [
2098
+ el("div", {
2099
+ class: "virtual-scroll-scrollbar-viewport",
2100
+ style: gt({
2101
+ inlineSize: `${tt(P).displayViewportSize.width}px`,
2102
+ blockSize: `${tt(P).displayViewportSize.height}px`,
2103
+ "--vsi-scrollbar-has-cross-gap": a.direction === "both" ? 1 : 0
2104
+ })
2105
+ }, [
2106
+ d.scrollbar && it.value ? pt(n.$slots, "scrollbar", St(Vt({ key: 0 }, it.value)), void 0, !0) : it.value ? (Ee(), Je(vl, St(Vt({ key: 1 }, it.value.scrollbarProps)), null, 16)) : et("", !0),
2107
+ d.scrollbar && Ke.value ? pt(n.$slots, "scrollbar", St(Vt({ key: 2 }, Ke.value)), void 0, !0) : Ke.value ? (Ee(), Je(vl, St(Vt({ key: 3 }, Ke.value.scrollbarProps)), null, 16)) : et("", !0)
2108
+ ], 4)
2109
+ ])) : et("", !0),
2110
+ d.header ? (Ee(), Je(ht(Et.value), {
2111
+ key: 1,
2112
+ ref_key: "headerRef",
2113
+ ref: m,
2114
+ class: Bt(["virtual-scroll-header", { "virtual-scroll--sticky": a.stickyHeader }])
2115
+ }, {
2116
+ default: mt(() => [
2117
+ pt(n.$slots, "header", {}, void 0, !0)
2118
+ ]),
2119
+ _: 3
2120
+ }, 8, ["class"])) : et("", !0),
2121
+ (Ee(), Je(ht(a.wrapperTag), {
2122
+ ref_key: "wrapperRef",
2123
+ ref: w,
2124
+ class: "virtual-scroll-wrapper",
2125
+ style: gt(He.value)
2126
+ }, {
2127
+ default: mt(() => [
2128
+ Ze.value ? (Ee(), Je(ht(a.itemTag), {
2129
+ key: 0,
2130
+ class: "virtual-scroll-spacer",
2131
+ style: gt(zt.value)
2132
+ }, {
2133
+ default: mt(() => [...v[0] || (v[0] = [
2134
+ el("td", { style: { padding: "0", border: "none", "block-size": "inherit" } }, null, -1)
2135
+ ])]),
2136
+ _: 1
2137
+ }, 8, ["style"])) : et("", !0),
2138
+ (Ee(!0), It(wl, null, xl(tt(W), (c) => (Ee(), Je(ht(a.itemTag), {
2139
+ key: c.index,
2140
+ ref_for: !0,
2141
+ ref: (A) => Ve(A, c.index),
2142
+ "data-index": c.index,
2143
+ class: Bt(["virtual-scroll-item", {
2144
+ "virtual-scroll--sticky": c.isStickyActive,
2145
+ "virtual-scroll--debug": Yt.value
2146
+ }]),
2147
+ style: gt(Ct(c))
2148
+ }, {
2149
+ default: mt(() => [
2150
+ pt(n.$slots, "item", {
2151
+ item: c.item,
2152
+ index: c.index,
2153
+ columnRange: Ge.value,
2154
+ getColumnWidth: tt(H),
2155
+ gap: t.gap,
2156
+ columnGap: t.columnGap,
2157
+ isSticky: c.isSticky,
2158
+ isStickyActive: c.isStickyActive
2159
+ }, void 0, !0),
2160
+ Yt.value ? (Ee(), It("div", Wl, " #" + Qt(c.index) + " (" + Qt(Math.round(c.offset.x)) + ", " + Qt(Math.round(c.offset.y)) + ") ", 1)) : et("", !0)
2161
+ ]),
2162
+ _: 2
2163
+ }, 1032, ["data-index", "class", "style"]))), 128))
2164
+ ]),
2165
+ _: 3
2166
+ }, 8, ["style"])),
2167
+ a.loading && d.loading ? (Ee(), It("div", {
2168
+ key: 2,
2169
+ class: "virtual-scroll-loading",
2170
+ style: gt(rt.value)
2171
+ }, [
2172
+ pt(n.$slots, "loading", {}, void 0, !0)
2173
+ ], 4)) : et("", !0),
2174
+ d.footer ? (Ee(), Je(ht(Tt.value), {
2175
+ key: 3,
2176
+ ref_key: "footerRef",
2177
+ ref: z,
2178
+ class: Bt(["virtual-scroll-footer", { "virtual-scroll--sticky": a.stickyFooter }])
2179
+ }, {
2180
+ default: mt(() => [
2181
+ pt(n.$slots, "footer", {}, void 0, !0)
2182
+ ]),
2183
+ _: 3
2184
+ }, 8, ["class"])) : et("", !0)
2185
+ ]),
2186
+ _: 3
2187
+ }, 40, ["id", "class", "style"]));
2188
+ }
2189
+ }), Bl = (a, e) => {
2190
+ const i = a.__vccOpts || a;
2191
+ for (const [t, s] of e)
2192
+ i[t] = s;
2193
+ return i;
2194
+ }, Hl = /* @__PURE__ */ Bl(ql, [["__scopeId", "data-v-91b6ab6c"]]);
2195
+ export {
2196
+ bt as BROWSER_MAX_SIZE,
2197
+ cl as DEFAULT_BUFFER,
2198
+ Lt as DEFAULT_COLUMN_WIDTH,
2199
+ Dt as DEFAULT_ITEM_SIZE,
2200
+ Kt as FenwickTree,
2201
+ Hl as VirtualScroll,
2202
+ vl as VirtualScrollbar,
2203
+ Xl as calculateColumnRange,
2204
+ Yl as calculateItemPosition,
2205
+ El as calculateItemStyle,
2206
+ Rl as calculateRange,
2207
+ sl as calculateScrollTarget,
2208
+ Cl as calculateStickyItem,
2209
+ Tl as calculateTotalSize,
2210
+ ct as displayToVirtual,
2211
+ pl as findPrevStickyIndex,
2212
+ lt as getPaddingX,
2213
+ at as getPaddingY,
2214
+ Ml as isBody,
2215
+ Zt as isElement,
2216
+ Il as isItemVisible,
2217
+ yt as isScrollToIndexOptions,
2218
+ Jt as isScrollableElement,
2219
+ zl as isWindow,
2220
+ Pl as isWindowLike,
2221
+ Ol as useVirtualScroll,
2222
+ tl as useVirtualScrollbar,
2223
+ Ht as virtualToDisplay
2224
+ };
2225
+ //# sourceMappingURL=index.mjs.map