@wyxos/vibe 1.6.25 → 1.6.26
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/lib/index.js +999 -934
- package/lib/vibe.css +1 -1
- package/package.json +1 -1
- package/src/Masonry.vue +1043 -1037
- package/src/components/MasonryItem.vue +501 -434
- package/src/useMasonryItems.ts +240 -218
- package/src/useMasonryLayout.ts +4 -0
- package/src/useMasonryPagination.ts +116 -4
package/lib/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { nextTick as
|
|
1
|
+
import { nextTick as _, ref as D, computed as Z, defineComponent as et, onMounted as tt, onUnmounted as at, watch as te, createElementBlock as q, openBlock as Y, createCommentVNode as ae, createElementVNode as U, normalizeStyle as ge, renderSlot as J, normalizeClass as ie, withModifiers as Ye, toDisplayString as Ne, unref as X, Fragment as Ue, renderList as _e, createVNode as He, withCtx as fe, mergeProps as de, TransitionGroup as Tt } from "vue";
|
|
2
2
|
let $e = null;
|
|
3
3
|
function It() {
|
|
4
4
|
if ($e != null) return $e;
|
|
@@ -6,17 +6,17 @@ function It() {
|
|
|
6
6
|
e.style.visibility = "hidden", e.style.overflow = "scroll", e.style.msOverflowStyle = "scrollbar", e.style.width = "100px", e.style.height = "100px", document.body.appendChild(e);
|
|
7
7
|
const l = document.createElement("div");
|
|
8
8
|
l.style.width = "100%", e.appendChild(l);
|
|
9
|
-
const
|
|
10
|
-
return document.body.removeChild(e), $e =
|
|
9
|
+
const o = e.offsetWidth - l.offsetWidth;
|
|
10
|
+
return document.body.removeChild(e), $e = o, o;
|
|
11
11
|
}
|
|
12
|
-
function Xe(e, l,
|
|
12
|
+
function Xe(e, l, o, a = {}) {
|
|
13
13
|
const {
|
|
14
|
-
gutterX:
|
|
15
|
-
gutterY:
|
|
16
|
-
header:
|
|
14
|
+
gutterX: m = 0,
|
|
15
|
+
gutterY: h = 0,
|
|
16
|
+
header: c = 0,
|
|
17
17
|
footer: i = 0,
|
|
18
|
-
paddingLeft:
|
|
19
|
-
paddingRight:
|
|
18
|
+
paddingLeft: x = 0,
|
|
19
|
+
paddingRight: M = 0,
|
|
20
20
|
sizes: n = {
|
|
21
21
|
base: 1,
|
|
22
22
|
sm: 2,
|
|
@@ -25,193 +25,193 @@ function Xe(e, l, r, t = {}) {
|
|
|
25
25
|
xl: 5,
|
|
26
26
|
"2xl": 6
|
|
27
27
|
},
|
|
28
|
-
placement:
|
|
29
|
-
} =
|
|
30
|
-
let
|
|
28
|
+
placement: b = "masonry"
|
|
29
|
+
} = a;
|
|
30
|
+
let P = 0, T = 0;
|
|
31
31
|
try {
|
|
32
32
|
if (l && l.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
|
|
33
|
-
const
|
|
34
|
-
|
|
33
|
+
const E = window.getComputedStyle(l);
|
|
34
|
+
P = parseFloat(E.paddingLeft) || 0, T = parseFloat(E.paddingRight) || 0;
|
|
35
35
|
}
|
|
36
36
|
} catch {
|
|
37
37
|
}
|
|
38
|
-
const
|
|
39
|
-
const
|
|
40
|
-
return Math.round(
|
|
38
|
+
const f = (x || 0) + P, y = (M || 0) + T, r = l.offsetWidth - l.clientWidth, g = r > 0 ? r + 2 : It() + 2, s = l.offsetWidth - g - f - y, d = m * (o - 1), L = Math.floor((s - d) / o), p = e.map((E) => {
|
|
39
|
+
const O = E.width, j = E.height;
|
|
40
|
+
return Math.round(L * j / O) + i + c;
|
|
41
41
|
});
|
|
42
|
-
if (
|
|
43
|
-
const
|
|
44
|
-
if (
|
|
45
|
-
const
|
|
46
|
-
let
|
|
47
|
-
const
|
|
48
|
-
let
|
|
49
|
-
for (let K = 0; K <
|
|
50
|
-
const
|
|
51
|
-
if (ee <=
|
|
52
|
-
|
|
53
|
-
else if (
|
|
42
|
+
if (b === "sequential-balanced") {
|
|
43
|
+
const E = p.length;
|
|
44
|
+
if (E === 0) return [];
|
|
45
|
+
const O = (I, N, A) => I + (N > 0 ? h : 0) + A;
|
|
46
|
+
let j = Math.max(...p), k = p.reduce((I, N) => I + N, 0) + h * Math.max(0, E - 1);
|
|
47
|
+
const z = (I) => {
|
|
48
|
+
let N = 1, A = 0, ne = 0;
|
|
49
|
+
for (let K = 0; K < E; K++) {
|
|
50
|
+
const re = p[K], ee = O(A, ne, re);
|
|
51
|
+
if (ee <= I)
|
|
52
|
+
A = ee, ne++;
|
|
53
|
+
else if (N++, A = re, ne = 1, re > I || N > o) return !1;
|
|
54
54
|
}
|
|
55
|
-
return
|
|
55
|
+
return N <= o;
|
|
56
56
|
};
|
|
57
|
-
for (;
|
|
58
|
-
const
|
|
59
|
-
|
|
57
|
+
for (; j < k; ) {
|
|
58
|
+
const I = Math.floor((j + k) / 2);
|
|
59
|
+
z(I) ? k = I : j = I + 1;
|
|
60
60
|
}
|
|
61
|
-
const
|
|
62
|
-
let
|
|
63
|
-
for (let
|
|
64
|
-
const
|
|
65
|
-
!(
|
|
61
|
+
const F = k, t = new Array(o).fill(0);
|
|
62
|
+
let w = o - 1, S = 0, H = 0;
|
|
63
|
+
for (let I = E - 1; I >= 0; I--) {
|
|
64
|
+
const N = p[I], A = I < w;
|
|
65
|
+
!(O(S, H, N) <= F) || A ? (t[w] = I + 1, w--, S = N, H = 1) : (S = O(S, H, N), H++);
|
|
66
66
|
}
|
|
67
|
-
|
|
68
|
-
const
|
|
69
|
-
for (let
|
|
70
|
-
const
|
|
71
|
-
for (let K =
|
|
67
|
+
t[0] = 0;
|
|
68
|
+
const V = [], C = new Array(o).fill(0);
|
|
69
|
+
for (let I = 0; I < o; I++) {
|
|
70
|
+
const N = t[I], A = I + 1 < o ? t[I + 1] : E, ne = I * (L + m);
|
|
71
|
+
for (let K = N; K < A; K++) {
|
|
72
72
|
const ee = {
|
|
73
73
|
...e[K],
|
|
74
|
-
columnWidth:
|
|
74
|
+
columnWidth: L,
|
|
75
75
|
imageHeight: 0,
|
|
76
76
|
columnHeight: 0,
|
|
77
77
|
left: 0,
|
|
78
78
|
top: 0
|
|
79
79
|
};
|
|
80
|
-
ee.imageHeight =
|
|
80
|
+
ee.imageHeight = p[K] - (i + c), ee.columnHeight = p[K], ee.left = ne, ee.top = C[I], C[I] += ee.columnHeight + (K + 1 < A ? h : 0), V.push(ee);
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
|
-
return
|
|
83
|
+
return V;
|
|
84
84
|
}
|
|
85
|
-
const
|
|
86
|
-
for (let
|
|
87
|
-
const
|
|
88
|
-
...
|
|
85
|
+
const v = new Array(o).fill(0), $ = [];
|
|
86
|
+
for (let E = 0; E < e.length; E++) {
|
|
87
|
+
const O = e[E], j = {
|
|
88
|
+
...O,
|
|
89
89
|
columnWidth: 0,
|
|
90
90
|
imageHeight: 0,
|
|
91
91
|
columnHeight: 0,
|
|
92
92
|
left: 0,
|
|
93
93
|
top: 0
|
|
94
|
-
},
|
|
95
|
-
|
|
94
|
+
}, k = v.indexOf(Math.min(...v)), z = O.width, F = O.height;
|
|
95
|
+
j.columnWidth = L, j.left = k * (L + m), j.imageHeight = Math.round(L * F / z), j.columnHeight = j.imageHeight + i + c, j.top = v[k], v[k] += j.columnHeight + h, $.push(j);
|
|
96
96
|
}
|
|
97
|
-
return
|
|
97
|
+
return $;
|
|
98
98
|
}
|
|
99
|
-
var
|
|
99
|
+
var Pt = typeof global == "object" && global && global.Object === Object && global, Lt = typeof self == "object" && self && self.Object === Object && self, nt = Pt || Lt || Function("return this")(), xe = nt.Symbol, lt = Object.prototype, Et = lt.hasOwnProperty, kt = lt.toString, he = xe ? xe.toStringTag : void 0;
|
|
100
100
|
function St(e) {
|
|
101
|
-
var l =
|
|
101
|
+
var l = Et.call(e, he), o = e[he];
|
|
102
102
|
try {
|
|
103
103
|
e[he] = void 0;
|
|
104
|
-
var
|
|
104
|
+
var a = !0;
|
|
105
105
|
} catch {
|
|
106
106
|
}
|
|
107
|
-
var
|
|
108
|
-
return
|
|
107
|
+
var m = kt.call(e);
|
|
108
|
+
return a && (l ? e[he] = o : delete e[he]), m;
|
|
109
109
|
}
|
|
110
110
|
var Ht = Object.prototype, $t = Ht.toString;
|
|
111
|
-
function
|
|
111
|
+
function Ft(e) {
|
|
112
112
|
return $t.call(e);
|
|
113
113
|
}
|
|
114
|
-
var
|
|
115
|
-
function
|
|
116
|
-
return e == null ? e === void 0 ?
|
|
114
|
+
var Nt = "[object Null]", Bt = "[object Undefined]", Ge = xe ? xe.toStringTag : void 0;
|
|
115
|
+
function Dt(e) {
|
|
116
|
+
return e == null ? e === void 0 ? Bt : Nt : Ge && Ge in Object(e) ? St(e) : Ft(e);
|
|
117
117
|
}
|
|
118
|
-
function
|
|
118
|
+
function zt(e) {
|
|
119
119
|
return e != null && typeof e == "object";
|
|
120
120
|
}
|
|
121
121
|
var At = "[object Symbol]";
|
|
122
|
-
function
|
|
123
|
-
return typeof e == "symbol" ||
|
|
122
|
+
function Rt(e) {
|
|
123
|
+
return typeof e == "symbol" || zt(e) && Dt(e) == At;
|
|
124
124
|
}
|
|
125
|
-
var
|
|
125
|
+
var Wt = /\s/;
|
|
126
126
|
function Ot(e) {
|
|
127
|
-
for (var l = e.length; l-- &&
|
|
127
|
+
for (var l = e.length; l-- && Wt.test(e.charAt(l)); )
|
|
128
128
|
;
|
|
129
129
|
return l;
|
|
130
130
|
}
|
|
131
131
|
var Ct = /^\s+/;
|
|
132
|
-
function
|
|
132
|
+
function Vt(e) {
|
|
133
133
|
return e && e.slice(0, Ot(e) + 1).replace(Ct, "");
|
|
134
134
|
}
|
|
135
|
-
function
|
|
135
|
+
function Be(e) {
|
|
136
136
|
var l = typeof e;
|
|
137
137
|
return e != null && (l == "object" || l == "function");
|
|
138
138
|
}
|
|
139
|
-
var Je = NaN,
|
|
139
|
+
var Je = NaN, jt = /^[-+]0x[0-9a-f]+$/i, qt = /^0b[01]+$/i, Yt = /^0o[0-7]+$/i, Ut = parseInt;
|
|
140
140
|
function Ke(e) {
|
|
141
141
|
if (typeof e == "number")
|
|
142
142
|
return e;
|
|
143
|
-
if (
|
|
143
|
+
if (Rt(e))
|
|
144
144
|
return Je;
|
|
145
|
-
if (
|
|
145
|
+
if (Be(e)) {
|
|
146
146
|
var l = typeof e.valueOf == "function" ? e.valueOf() : e;
|
|
147
|
-
e =
|
|
147
|
+
e = Be(l) ? l + "" : l;
|
|
148
148
|
}
|
|
149
149
|
if (typeof e != "string")
|
|
150
150
|
return e === 0 ? e : +e;
|
|
151
|
-
e =
|
|
152
|
-
var
|
|
153
|
-
return
|
|
151
|
+
e = Vt(e);
|
|
152
|
+
var o = qt.test(e);
|
|
153
|
+
return o || Yt.test(e) ? Ut(e.slice(2), o ? 2 : 8) : jt.test(e) ? Je : +e;
|
|
154
154
|
}
|
|
155
|
-
var
|
|
155
|
+
var Fe = function() {
|
|
156
156
|
return nt.Date.now();
|
|
157
157
|
}, _t = "Expected a function", Xt = Math.max, Gt = Math.min;
|
|
158
|
-
function Qe(e, l,
|
|
159
|
-
var
|
|
158
|
+
function Qe(e, l, o) {
|
|
159
|
+
var a, m, h, c, i, x, M = 0, n = !1, b = !1, P = !0;
|
|
160
160
|
if (typeof e != "function")
|
|
161
161
|
throw new TypeError(_t);
|
|
162
|
-
l = Ke(l) || 0,
|
|
163
|
-
function T(
|
|
164
|
-
var
|
|
165
|
-
return
|
|
162
|
+
l = Ke(l) || 0, Be(o) && (n = !!o.leading, b = "maxWait" in o, h = b ? Xt(Ke(o.maxWait) || 0, l) : h, P = "trailing" in o ? !!o.trailing : P);
|
|
163
|
+
function T(v) {
|
|
164
|
+
var $ = a, E = m;
|
|
165
|
+
return a = m = void 0, M = v, c = e.apply(E, $), c;
|
|
166
166
|
}
|
|
167
|
-
function
|
|
168
|
-
return
|
|
167
|
+
function f(v) {
|
|
168
|
+
return M = v, i = setTimeout(g, l), n ? T(v) : c;
|
|
169
169
|
}
|
|
170
|
-
function
|
|
171
|
-
var
|
|
172
|
-
return
|
|
170
|
+
function y(v) {
|
|
171
|
+
var $ = v - x, E = v - M, O = l - $;
|
|
172
|
+
return b ? Gt(O, h - E) : O;
|
|
173
173
|
}
|
|
174
|
-
function
|
|
175
|
-
var
|
|
176
|
-
return
|
|
174
|
+
function r(v) {
|
|
175
|
+
var $ = v - x, E = v - M;
|
|
176
|
+
return x === void 0 || $ >= l || $ < 0 || b && E >= h;
|
|
177
177
|
}
|
|
178
|
-
function
|
|
179
|
-
var
|
|
180
|
-
if (
|
|
181
|
-
return v
|
|
182
|
-
i = setTimeout(
|
|
178
|
+
function g() {
|
|
179
|
+
var v = Fe();
|
|
180
|
+
if (r(v))
|
|
181
|
+
return s(v);
|
|
182
|
+
i = setTimeout(g, y(v));
|
|
183
183
|
}
|
|
184
|
-
function v
|
|
185
|
-
return i = void 0,
|
|
184
|
+
function s(v) {
|
|
185
|
+
return i = void 0, P && a ? T(v) : (a = m = void 0, c);
|
|
186
186
|
}
|
|
187
|
-
function
|
|
188
|
-
i !== void 0 && clearTimeout(i),
|
|
187
|
+
function d() {
|
|
188
|
+
i !== void 0 && clearTimeout(i), M = 0, a = x = m = i = void 0;
|
|
189
189
|
}
|
|
190
|
-
function
|
|
191
|
-
return i === void 0 ?
|
|
190
|
+
function L() {
|
|
191
|
+
return i === void 0 ? c : s(Fe());
|
|
192
192
|
}
|
|
193
|
-
function
|
|
194
|
-
var
|
|
195
|
-
if (
|
|
193
|
+
function p() {
|
|
194
|
+
var v = Fe(), $ = r(v);
|
|
195
|
+
if (a = arguments, m = this, x = v, $) {
|
|
196
196
|
if (i === void 0)
|
|
197
|
-
return
|
|
198
|
-
if (
|
|
199
|
-
return clearTimeout(i), i = setTimeout(
|
|
197
|
+
return f(x);
|
|
198
|
+
if (b)
|
|
199
|
+
return clearTimeout(i), i = setTimeout(g, l), T(x);
|
|
200
200
|
}
|
|
201
|
-
return i === void 0 && (i = setTimeout(
|
|
201
|
+
return i === void 0 && (i = setTimeout(g, l)), c;
|
|
202
202
|
}
|
|
203
|
-
return
|
|
203
|
+
return p.cancel = d, p.flush = L, p;
|
|
204
204
|
}
|
|
205
205
|
function ue(e, l) {
|
|
206
|
-
const
|
|
207
|
-
return
|
|
206
|
+
const o = l ?? (typeof window < "u" ? window.innerWidth : 1024), a = e.sizes;
|
|
207
|
+
return o >= 1536 && a["2xl"] ? a["2xl"] : o >= 1280 && a.xl ? a.xl : o >= 1024 && a.lg ? a.lg : o >= 768 && a.md ? a.md : o >= 640 && a.sm ? a.sm : a.base;
|
|
208
208
|
}
|
|
209
209
|
function Jt(e) {
|
|
210
210
|
const l = e ?? (typeof window < "u" ? window.innerWidth : 1024);
|
|
211
211
|
return l >= 1536 ? "2xl" : l >= 1280 ? "xl" : l >= 1024 ? "lg" : l >= 768 ? "md" : l >= 640 ? "sm" : "base";
|
|
212
212
|
}
|
|
213
213
|
function Kt(e) {
|
|
214
|
-
return e.reduce((
|
|
214
|
+
return e.reduce((o, a) => Math.max(o, a.top + a.columnHeight), 0) + 500;
|
|
215
215
|
}
|
|
216
216
|
function Qt(e) {
|
|
217
217
|
return {
|
|
@@ -234,219 +234,219 @@ function Zt(e, l = 0) {
|
|
|
234
234
|
function be(e, l) {
|
|
235
235
|
if (!e.length || l <= 0)
|
|
236
236
|
return new Array(Math.max(1, l)).fill(0);
|
|
237
|
-
const
|
|
238
|
-
for (let
|
|
239
|
-
const
|
|
240
|
-
for (const
|
|
241
|
-
const i =
|
|
242
|
-
i != null && (
|
|
237
|
+
const a = Array.from(new Set(e.map((c) => c.left))).sort((c, i) => c - i).slice(0, l), m = /* @__PURE__ */ new Map();
|
|
238
|
+
for (let c = 0; c < a.length; c++) m.set(a[c], c);
|
|
239
|
+
const h = new Array(a.length).fill(0);
|
|
240
|
+
for (const c of e) {
|
|
241
|
+
const i = m.get(c.left);
|
|
242
|
+
i != null && (h[i] = Math.max(h[i], c.top + c.columnHeight));
|
|
243
243
|
}
|
|
244
|
-
for (;
|
|
245
|
-
return
|
|
244
|
+
for (; h.length < l; ) h.push(0);
|
|
245
|
+
return h;
|
|
246
246
|
}
|
|
247
247
|
function ea(e, l) {
|
|
248
|
-
let
|
|
249
|
-
const
|
|
250
|
-
function
|
|
251
|
-
var
|
|
252
|
-
const
|
|
253
|
-
if (
|
|
254
|
-
const
|
|
255
|
-
|
|
248
|
+
let o = 0, a = 0;
|
|
249
|
+
const m = 1e3;
|
|
250
|
+
function h(n, b) {
|
|
251
|
+
var f;
|
|
252
|
+
const P = (f = e.container) == null ? void 0 : f.value;
|
|
253
|
+
if (P) {
|
|
254
|
+
const y = P.scrollTop, r = P.clientHeight;
|
|
255
|
+
o = y - m, a = y + r + m;
|
|
256
256
|
}
|
|
257
|
-
return n +
|
|
257
|
+
return n + b >= o && n <= a;
|
|
258
258
|
}
|
|
259
|
-
function
|
|
260
|
-
var
|
|
261
|
-
const
|
|
262
|
-
if ((
|
|
263
|
-
n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${
|
|
264
|
-
n.style.transition = "",
|
|
259
|
+
function c(n, b) {
|
|
260
|
+
var s;
|
|
261
|
+
const P = parseInt(n.dataset.left || "0", 10), T = parseInt(n.dataset.top || "0", 10), f = parseInt(n.dataset.index || "0", 10), y = n.offsetHeight || parseInt(getComputedStyle(n).height || "200", 10) || 200;
|
|
262
|
+
if ((s = l == null ? void 0 : l.virtualizing) != null && s.value) {
|
|
263
|
+
n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${P}px, ${T}px, 0) scale(1)`, n.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
|
|
264
|
+
n.style.transition = "", b();
|
|
265
265
|
});
|
|
266
266
|
return;
|
|
267
267
|
}
|
|
268
|
-
if (!
|
|
269
|
-
n.style.opacity = "1", n.style.transform = `translate3d(${
|
|
268
|
+
if (!h(T, y)) {
|
|
269
|
+
n.style.opacity = "1", n.style.transform = `translate3d(${P}px, ${T}px, 0) scale(1)`, n.style.transition = "none", b();
|
|
270
270
|
return;
|
|
271
271
|
}
|
|
272
|
-
const
|
|
273
|
-
n.style.setProperty("--masonry-opacity-delay", `${
|
|
274
|
-
n.style.opacity = "1", n.style.transform = `translate3d(${
|
|
275
|
-
const
|
|
276
|
-
|
|
272
|
+
const r = Math.min(f * 20, 160), g = n.style.getPropertyValue("--masonry-opacity-delay");
|
|
273
|
+
n.style.setProperty("--masonry-opacity-delay", `${r}ms`), requestAnimationFrame(() => {
|
|
274
|
+
n.style.opacity = "1", n.style.transform = `translate3d(${P}px, ${T}px, 0) scale(1)`;
|
|
275
|
+
const d = () => {
|
|
276
|
+
g ? n.style.setProperty("--masonry-opacity-delay", g) : n.style.removeProperty("--masonry-opacity-delay"), n.removeEventListener("transitionend", d), b();
|
|
277
277
|
};
|
|
278
|
-
n.addEventListener("transitionend",
|
|
278
|
+
n.addEventListener("transitionend", d);
|
|
279
279
|
});
|
|
280
280
|
}
|
|
281
281
|
function i(n) {
|
|
282
282
|
var T;
|
|
283
|
-
const
|
|
283
|
+
const b = parseInt(n.dataset.left || "0", 10), P = parseInt(n.dataset.top || "0", 10);
|
|
284
284
|
if ((T = l == null ? void 0 : l.virtualizing) != null && T.value) {
|
|
285
|
-
n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${
|
|
285
|
+
n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${b}px, ${P}px, 0) scale(1)`, n.style.removeProperty("--masonry-opacity-delay");
|
|
286
286
|
return;
|
|
287
287
|
}
|
|
288
|
-
n.style.opacity = "0", n.style.transform = `translate3d(${
|
|
288
|
+
n.style.opacity = "0", n.style.transform = `translate3d(${b}px, ${P + 10}px, 0) scale(0.985)`;
|
|
289
289
|
}
|
|
290
|
-
function
|
|
291
|
-
var
|
|
292
|
-
const
|
|
293
|
-
if (!((
|
|
294
|
-
if (!
|
|
290
|
+
function x(n) {
|
|
291
|
+
var f;
|
|
292
|
+
const b = parseInt(n.dataset.left || "0", 10), P = parseInt(n.dataset.top || "0", 10), T = n.offsetHeight || parseInt(getComputedStyle(n).height || "200", 10) || 200;
|
|
293
|
+
if (!((f = l == null ? void 0 : l.virtualizing) != null && f.value)) {
|
|
294
|
+
if (!h(P, T)) {
|
|
295
295
|
n.style.transition = "none";
|
|
296
296
|
return;
|
|
297
297
|
}
|
|
298
|
-
n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${
|
|
298
|
+
n.style.transition = "none", n.style.opacity = "1", n.style.transform = `translate3d(${b}px, ${P}px, 0) scale(1)`, n.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
|
|
299
299
|
n.style.transition = "";
|
|
300
300
|
});
|
|
301
301
|
}
|
|
302
302
|
}
|
|
303
|
-
function
|
|
304
|
-
var
|
|
305
|
-
const
|
|
306
|
-
if ((
|
|
307
|
-
|
|
303
|
+
function M(n, b) {
|
|
304
|
+
var p;
|
|
305
|
+
const P = parseInt(n.dataset.left || "0", 10), T = parseInt(n.dataset.top || "0", 10), f = n.offsetHeight || parseInt(getComputedStyle(n).height || "200", 10) || 200;
|
|
306
|
+
if ((p = l == null ? void 0 : l.virtualizing) != null && p.value) {
|
|
307
|
+
b();
|
|
308
308
|
return;
|
|
309
309
|
}
|
|
310
|
-
if (!
|
|
311
|
-
n.style.transition = "none", n.style.opacity = "0",
|
|
310
|
+
if (!h(T, f)) {
|
|
311
|
+
n.style.transition = "none", n.style.opacity = "0", b();
|
|
312
312
|
return;
|
|
313
313
|
}
|
|
314
|
-
const
|
|
315
|
-
let
|
|
316
|
-
if (!Number.isFinite(
|
|
317
|
-
const
|
|
318
|
-
|
|
314
|
+
const y = typeof (l == null ? void 0 : l.leaveDurationMs) == "number" ? l.leaveDurationMs : NaN;
|
|
315
|
+
let r = Number.isFinite(y) && y > 0 ? y : NaN;
|
|
316
|
+
if (!Number.isFinite(r)) {
|
|
317
|
+
const $ = getComputedStyle(n).getPropertyValue("--masonry-leave-duration") || "", E = parseFloat($);
|
|
318
|
+
r = Number.isFinite(E) && E > 0 ? E : 200;
|
|
319
319
|
}
|
|
320
|
-
const
|
|
321
|
-
n.removeEventListener("transitionend",
|
|
322
|
-
},
|
|
323
|
-
(!
|
|
324
|
-
},
|
|
325
|
-
|
|
326
|
-
},
|
|
320
|
+
const g = n.style.transitionDuration, s = () => {
|
|
321
|
+
n.removeEventListener("transitionend", d), clearTimeout(L), n.style.transitionDuration = g || "";
|
|
322
|
+
}, d = (v) => {
|
|
323
|
+
(!v || v.target === n) && (s(), b());
|
|
324
|
+
}, L = setTimeout(() => {
|
|
325
|
+
s(), b();
|
|
326
|
+
}, r + 100);
|
|
327
327
|
requestAnimationFrame(() => {
|
|
328
|
-
n.style.transitionDuration = `${
|
|
328
|
+
n.style.transitionDuration = `${r}ms`, n.style.opacity = "0", n.style.transform = `translate3d(${P}px, ${T + 10}px, 0) scale(0.985)`, n.addEventListener("transitionend", d);
|
|
329
329
|
});
|
|
330
330
|
}
|
|
331
331
|
return {
|
|
332
|
-
onEnter:
|
|
332
|
+
onEnter: c,
|
|
333
333
|
onBeforeEnter: i,
|
|
334
|
-
onBeforeLeave:
|
|
335
|
-
onLeave:
|
|
334
|
+
onBeforeLeave: x,
|
|
335
|
+
onLeave: M
|
|
336
336
|
};
|
|
337
337
|
}
|
|
338
338
|
function ta({
|
|
339
339
|
container: e,
|
|
340
340
|
masonry: l,
|
|
341
|
-
columns:
|
|
342
|
-
containerHeight:
|
|
343
|
-
isLoading:
|
|
344
|
-
pageSize:
|
|
345
|
-
refreshLayout:
|
|
341
|
+
columns: o,
|
|
342
|
+
containerHeight: a,
|
|
343
|
+
isLoading: m,
|
|
344
|
+
pageSize: h,
|
|
345
|
+
refreshLayout: c,
|
|
346
346
|
setItemsRaw: i,
|
|
347
|
-
loadNext:
|
|
348
|
-
loadThresholdPx:
|
|
347
|
+
loadNext: x,
|
|
348
|
+
loadThresholdPx: M
|
|
349
349
|
}) {
|
|
350
350
|
let n = 0;
|
|
351
|
-
async function
|
|
351
|
+
async function b(P, T = !1) {
|
|
352
352
|
if (!e.value) return;
|
|
353
|
-
const
|
|
353
|
+
const f = P ?? be(l.value, o.value), y = f.length ? Math.max(...f) : 0, r = e.value.scrollTop + e.value.clientHeight, g = e.value.scrollTop > n + 1;
|
|
354
354
|
n = e.value.scrollTop;
|
|
355
|
-
const
|
|
356
|
-
if (
|
|
357
|
-
await
|
|
355
|
+
const s = typeof M == "number" ? M : 200, d = s >= 0 ? Math.max(0, y - s) : Math.max(0, y + s);
|
|
356
|
+
if (r >= d && (g || T) && !m.value) {
|
|
357
|
+
await x(), await _();
|
|
358
358
|
return;
|
|
359
359
|
}
|
|
360
360
|
}
|
|
361
361
|
return {
|
|
362
|
-
handleScroll:
|
|
362
|
+
handleScroll: b
|
|
363
363
|
};
|
|
364
364
|
}
|
|
365
365
|
function aa(e) {
|
|
366
|
-
const { useSwipeMode: l, masonry:
|
|
367
|
-
if (!l.value ||
|
|
368
|
-
const
|
|
369
|
-
return
|
|
370
|
-
}),
|
|
366
|
+
const { useSwipeMode: l, masonry: o, isLoading: a, loadNext: m, loadPage: h, paginationHistory: c } = e, i = D(0), x = D(0), M = D(!1), n = D(0), b = D(0), P = D(null), T = Z(() => {
|
|
367
|
+
if (!l.value || o.value.length === 0) return null;
|
|
368
|
+
const k = Math.max(0, Math.min(i.value, o.value.length - 1));
|
|
369
|
+
return o.value[k] || null;
|
|
370
|
+
}), f = Z(() => {
|
|
371
371
|
if (!l.value || !T.value) return null;
|
|
372
|
-
const
|
|
373
|
-
return
|
|
374
|
-
}),
|
|
372
|
+
const k = i.value + 1;
|
|
373
|
+
return k >= o.value.length ? null : o.value[k] || null;
|
|
374
|
+
}), y = Z(() => {
|
|
375
375
|
if (!l.value || !T.value) return null;
|
|
376
|
-
const
|
|
377
|
-
return
|
|
376
|
+
const k = i.value - 1;
|
|
377
|
+
return k < 0 ? null : o.value[k] || null;
|
|
378
378
|
});
|
|
379
|
-
function
|
|
380
|
-
if (!
|
|
381
|
-
const
|
|
382
|
-
|
|
379
|
+
function r() {
|
|
380
|
+
if (!P.value) return;
|
|
381
|
+
const k = P.value.clientHeight;
|
|
382
|
+
x.value = -i.value * k;
|
|
383
383
|
}
|
|
384
|
-
function
|
|
385
|
-
if (!
|
|
386
|
-
|
|
384
|
+
function g() {
|
|
385
|
+
if (!f.value) {
|
|
386
|
+
m();
|
|
387
387
|
return;
|
|
388
388
|
}
|
|
389
|
-
i.value++,
|
|
389
|
+
i.value++, r(), i.value >= o.value.length - 5 && m();
|
|
390
390
|
}
|
|
391
|
-
function
|
|
392
|
-
|
|
391
|
+
function s() {
|
|
392
|
+
y.value && (i.value--, r());
|
|
393
393
|
}
|
|
394
|
-
function
|
|
395
|
-
l.value && (
|
|
394
|
+
function d(k) {
|
|
395
|
+
l.value && (M.value = !0, n.value = k.touches[0].clientY, b.value = x.value, k.preventDefault());
|
|
396
396
|
}
|
|
397
|
-
function
|
|
398
|
-
if (!l.value || !
|
|
399
|
-
const
|
|
400
|
-
|
|
397
|
+
function L(k) {
|
|
398
|
+
if (!l.value || !M.value) return;
|
|
399
|
+
const z = k.touches[0].clientY - n.value;
|
|
400
|
+
x.value = b.value + z, k.preventDefault();
|
|
401
401
|
}
|
|
402
|
-
function
|
|
403
|
-
if (!l.value || !
|
|
404
|
-
|
|
405
|
-
const
|
|
406
|
-
Math.abs(
|
|
402
|
+
function p(k) {
|
|
403
|
+
if (!l.value || !M.value) return;
|
|
404
|
+
M.value = !1;
|
|
405
|
+
const z = x.value - b.value;
|
|
406
|
+
Math.abs(z) > 100 ? z > 0 && y.value ? s() : z < 0 && f.value ? g() : r() : r(), k.preventDefault();
|
|
407
407
|
}
|
|
408
|
-
function
|
|
409
|
-
l.value && (
|
|
408
|
+
function v(k) {
|
|
409
|
+
l.value && (M.value = !0, n.value = k.clientY, b.value = x.value, k.preventDefault());
|
|
410
410
|
}
|
|
411
|
-
function
|
|
412
|
-
if (!l.value || !
|
|
413
|
-
const
|
|
414
|
-
|
|
411
|
+
function $(k) {
|
|
412
|
+
if (!l.value || !M.value) return;
|
|
413
|
+
const z = k.clientY - n.value;
|
|
414
|
+
x.value = b.value + z, k.preventDefault();
|
|
415
415
|
}
|
|
416
|
-
function
|
|
417
|
-
if (!l.value || !
|
|
418
|
-
|
|
419
|
-
const
|
|
420
|
-
Math.abs(
|
|
416
|
+
function E(k) {
|
|
417
|
+
if (!l.value || !M.value) return;
|
|
418
|
+
M.value = !1;
|
|
419
|
+
const z = x.value - b.value;
|
|
420
|
+
Math.abs(z) > 100 ? z > 0 && y.value ? s() : z < 0 && f.value ? g() : r() : r(), k.preventDefault();
|
|
421
421
|
}
|
|
422
|
-
function
|
|
423
|
-
!l.value && i.value > 0 && (i.value = 0,
|
|
422
|
+
function O() {
|
|
423
|
+
!l.value && i.value > 0 && (i.value = 0, x.value = 0), l.value && o.value.length === 0 && !a.value && h(c.value[0]), l.value && r();
|
|
424
424
|
}
|
|
425
|
-
function
|
|
426
|
-
i.value = 0,
|
|
425
|
+
function j() {
|
|
426
|
+
i.value = 0, x.value = 0, M.value = !1;
|
|
427
427
|
}
|
|
428
428
|
return {
|
|
429
429
|
// State
|
|
430
430
|
currentSwipeIndex: i,
|
|
431
|
-
swipeOffset:
|
|
432
|
-
isDragging:
|
|
433
|
-
swipeContainer:
|
|
431
|
+
swipeOffset: x,
|
|
432
|
+
isDragging: M,
|
|
433
|
+
swipeContainer: P,
|
|
434
434
|
// Computed
|
|
435
435
|
currentItem: T,
|
|
436
|
-
nextItem:
|
|
437
|
-
previousItem:
|
|
436
|
+
nextItem: f,
|
|
437
|
+
previousItem: y,
|
|
438
438
|
// Functions
|
|
439
|
-
handleTouchStart:
|
|
440
|
-
handleTouchMove:
|
|
441
|
-
handleTouchEnd:
|
|
442
|
-
handleMouseDown:
|
|
443
|
-
handleMouseMove:
|
|
444
|
-
handleMouseUp:
|
|
445
|
-
goToNextItem:
|
|
446
|
-
goToPreviousItem:
|
|
447
|
-
snapToCurrentItem:
|
|
448
|
-
handleWindowResize:
|
|
449
|
-
reset:
|
|
439
|
+
handleTouchStart: d,
|
|
440
|
+
handleTouchMove: L,
|
|
441
|
+
handleTouchEnd: p,
|
|
442
|
+
handleMouseDown: v,
|
|
443
|
+
handleMouseMove: $,
|
|
444
|
+
handleMouseUp: E,
|
|
445
|
+
goToNextItem: g,
|
|
446
|
+
goToPreviousItem: s,
|
|
447
|
+
snapToCurrentItem: r,
|
|
448
|
+
handleWindowResize: O,
|
|
449
|
+
reset: j
|
|
450
450
|
};
|
|
451
451
|
}
|
|
452
452
|
function me(e) {
|
|
@@ -455,413 +455,445 @@ function me(e) {
|
|
|
455
455
|
function na(e) {
|
|
456
456
|
const {
|
|
457
457
|
getNextPage: l,
|
|
458
|
-
masonry:
|
|
459
|
-
isLoading:
|
|
460
|
-
hasReachedEnd:
|
|
461
|
-
loadError:
|
|
462
|
-
currentPage:
|
|
458
|
+
masonry: o,
|
|
459
|
+
isLoading: a,
|
|
460
|
+
hasReachedEnd: m,
|
|
461
|
+
loadError: h,
|
|
462
|
+
currentPage: c,
|
|
463
463
|
paginationHistory: i,
|
|
464
|
-
refreshLayout:
|
|
465
|
-
retryMaxAttempts:
|
|
464
|
+
refreshLayout: x,
|
|
465
|
+
retryMaxAttempts: M,
|
|
466
466
|
retryInitialDelayMs: n,
|
|
467
|
-
retryBackoffStepMs:
|
|
468
|
-
|
|
467
|
+
retryBackoffStepMs: b,
|
|
468
|
+
mode: P,
|
|
469
469
|
backfillDelayMs: T,
|
|
470
|
-
backfillMaxCalls:
|
|
471
|
-
pageSize:
|
|
472
|
-
autoRefreshOnEmpty:
|
|
473
|
-
emits:
|
|
474
|
-
} = e,
|
|
475
|
-
let
|
|
476
|
-
function
|
|
477
|
-
return
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
470
|
+
backfillMaxCalls: f,
|
|
471
|
+
pageSize: y,
|
|
472
|
+
autoRefreshOnEmpty: r,
|
|
473
|
+
emits: g
|
|
474
|
+
} = e, s = D(!1);
|
|
475
|
+
let d = !1;
|
|
476
|
+
function L(F) {
|
|
477
|
+
return o.value.filter((t) => t.page === F).length;
|
|
478
|
+
}
|
|
479
|
+
function p(F, t) {
|
|
480
|
+
return new Promise((w) => {
|
|
481
|
+
const S = Math.max(0, F | 0), H = Date.now();
|
|
482
|
+
t(S, S);
|
|
483
|
+
const V = setInterval(() => {
|
|
484
|
+
if (s.value) {
|
|
485
|
+
clearInterval(V), w();
|
|
483
486
|
return;
|
|
484
487
|
}
|
|
485
|
-
const
|
|
486
|
-
|
|
488
|
+
const C = Date.now() - H, I = Math.max(0, S - C);
|
|
489
|
+
t(I, S), I <= 0 && (clearInterval(V), w());
|
|
487
490
|
}, 100);
|
|
488
491
|
});
|
|
489
492
|
}
|
|
490
|
-
async function
|
|
491
|
-
let
|
|
492
|
-
const
|
|
493
|
-
let
|
|
493
|
+
async function v(F) {
|
|
494
|
+
let t = 0;
|
|
495
|
+
const w = M;
|
|
496
|
+
let S = n;
|
|
494
497
|
for (; ; )
|
|
495
498
|
try {
|
|
496
|
-
const
|
|
497
|
-
return
|
|
498
|
-
} catch (
|
|
499
|
-
if (
|
|
500
|
-
throw
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
}),
|
|
499
|
+
const H = await F();
|
|
500
|
+
return t > 0 && g("retry:stop", { attempt: t, success: !0 }), H;
|
|
501
|
+
} catch (H) {
|
|
502
|
+
if (t++, t > w)
|
|
503
|
+
throw g("retry:stop", { attempt: t - 1, success: !1 }), H;
|
|
504
|
+
g("retry:start", { attempt: t, max: w, totalMs: S }), await p(S, (V, C) => {
|
|
505
|
+
g("retry:tick", { attempt: t, remainingMs: V, totalMs: C });
|
|
506
|
+
}), S += b;
|
|
504
507
|
}
|
|
505
508
|
}
|
|
506
|
-
async function
|
|
509
|
+
async function $(F) {
|
|
507
510
|
try {
|
|
508
|
-
const
|
|
509
|
-
return
|
|
510
|
-
} catch (
|
|
511
|
-
throw
|
|
511
|
+
const t = await v(() => l(F));
|
|
512
|
+
return x([...o.value, ...t.items]), t;
|
|
513
|
+
} catch (t) {
|
|
514
|
+
throw t;
|
|
512
515
|
}
|
|
513
516
|
}
|
|
514
|
-
async function
|
|
515
|
-
if (!
|
|
516
|
-
const
|
|
517
|
-
if (!
|
|
517
|
+
async function E(F, t = !1) {
|
|
518
|
+
if (!t && P !== "backfill" || d || s.value || m.value) return;
|
|
519
|
+
const w = (F || 0) + (y || 0);
|
|
520
|
+
if (!y || y <= 0) return;
|
|
518
521
|
if (i.value[i.value.length - 1] == null) {
|
|
519
|
-
|
|
522
|
+
m.value = !0;
|
|
520
523
|
return;
|
|
521
524
|
}
|
|
522
|
-
if (!(
|
|
523
|
-
|
|
525
|
+
if (!(o.value.length >= w)) {
|
|
526
|
+
d = !0, a.value = !0;
|
|
524
527
|
try {
|
|
525
|
-
let
|
|
526
|
-
for (
|
|
527
|
-
|
|
528
|
-
fetched:
|
|
529
|
-
target:
|
|
530
|
-
calls:
|
|
531
|
-
remainingMs:
|
|
532
|
-
totalMs:
|
|
528
|
+
let H = 0;
|
|
529
|
+
for (g("backfill:start", { target: w, fetched: o.value.length, calls: H }); o.value.length < w && H < f && i.value[i.value.length - 1] != null && !s.value && !m.value && d && (await p(T, (C, I) => {
|
|
530
|
+
g("backfill:tick", {
|
|
531
|
+
fetched: o.value.length,
|
|
532
|
+
target: w,
|
|
533
|
+
calls: H,
|
|
534
|
+
remainingMs: C,
|
|
535
|
+
totalMs: I
|
|
533
536
|
});
|
|
534
|
-
}), !(
|
|
535
|
-
const
|
|
536
|
-
if (
|
|
537
|
-
|
|
537
|
+
}), !(s.value || !d)); ) {
|
|
538
|
+
const V = i.value[i.value.length - 1];
|
|
539
|
+
if (V == null) {
|
|
540
|
+
m.value = !0;
|
|
538
541
|
break;
|
|
539
542
|
}
|
|
540
543
|
try {
|
|
541
|
-
if (
|
|
542
|
-
const
|
|
543
|
-
if (
|
|
544
|
-
|
|
545
|
-
} catch (
|
|
546
|
-
if (
|
|
547
|
-
|
|
544
|
+
if (s.value || !d) break;
|
|
545
|
+
const C = await $(V);
|
|
546
|
+
if (s.value || !d) break;
|
|
547
|
+
h.value = null, i.value.push(C.nextPage), C.nextPage == null && (m.value = !0);
|
|
548
|
+
} catch (C) {
|
|
549
|
+
if (s.value || !d) break;
|
|
550
|
+
h.value = me(C);
|
|
548
551
|
}
|
|
549
|
-
|
|
552
|
+
H++;
|
|
550
553
|
}
|
|
551
|
-
|
|
554
|
+
g("backfill:stop", { fetched: o.value.length, calls: H });
|
|
552
555
|
} finally {
|
|
553
|
-
|
|
556
|
+
d = !1, a.value = !1, g("loading:stop", { fetched: o.value.length });
|
|
554
557
|
}
|
|
555
558
|
}
|
|
556
559
|
}
|
|
557
|
-
async function
|
|
558
|
-
if (!
|
|
559
|
-
|
|
560
|
+
async function O(F) {
|
|
561
|
+
if (!a.value) {
|
|
562
|
+
s.value = !1, a.value = !0, m.value = !1, h.value = null;
|
|
560
563
|
try {
|
|
561
|
-
const
|
|
562
|
-
if (
|
|
563
|
-
const
|
|
564
|
-
return
|
|
565
|
-
} catch (
|
|
566
|
-
throw
|
|
564
|
+
const t = o.value.length;
|
|
565
|
+
if (s.value) return;
|
|
566
|
+
const w = await $(F);
|
|
567
|
+
return s.value ? void 0 : (h.value = null, c.value = F, i.value.push(w.nextPage), w.nextPage == null && (m.value = !0), await E(t), w);
|
|
568
|
+
} catch (t) {
|
|
569
|
+
throw h.value = me(t), t;
|
|
567
570
|
} finally {
|
|
568
|
-
|
|
571
|
+
a.value = !1;
|
|
569
572
|
}
|
|
570
573
|
}
|
|
571
574
|
}
|
|
572
|
-
async function
|
|
573
|
-
if (!
|
|
574
|
-
|
|
575
|
+
async function j() {
|
|
576
|
+
if (!a.value && !m.value) {
|
|
577
|
+
s.value = !1, a.value = !0, h.value = null;
|
|
575
578
|
try {
|
|
576
|
-
const
|
|
577
|
-
if (
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
579
|
+
const F = o.value.length;
|
|
580
|
+
if (s.value) return;
|
|
581
|
+
if (P === "refresh" && c.value != null && L(c.value) < y) {
|
|
582
|
+
const H = await v(() => l(c.value));
|
|
583
|
+
if (s.value) return;
|
|
584
|
+
const V = [...o.value], C = H.items.filter((N) => !N || N.id == null || N.page == null ? !1 : !V.some((A) => A && A.id === N.id && A.page === N.page));
|
|
585
|
+
if (C.length > 0) {
|
|
586
|
+
const N = [...o.value, ...C];
|
|
587
|
+
x(N), await new Promise((A) => setTimeout(A, 0));
|
|
588
|
+
}
|
|
589
|
+
if (h.value = null, C.length === 0) {
|
|
590
|
+
const N = i.value[i.value.length - 1];
|
|
591
|
+
if (N == null) {
|
|
592
|
+
m.value = !0;
|
|
593
|
+
return;
|
|
594
|
+
}
|
|
595
|
+
const A = await $(N);
|
|
596
|
+
return s.value ? void 0 : (h.value = null, c.value = N, i.value.push(A.nextPage), A.nextPage == null && (m.value = !0), await E(F), A);
|
|
597
|
+
}
|
|
598
|
+
if (L(c.value) >= y) {
|
|
599
|
+
const N = i.value[i.value.length - 1];
|
|
600
|
+
if (N == null) {
|
|
601
|
+
m.value = !0;
|
|
602
|
+
return;
|
|
603
|
+
}
|
|
604
|
+
const A = await $(N);
|
|
605
|
+
return s.value ? void 0 : (h.value = null, c.value = N, i.value.push(A.nextPage), A.nextPage == null && (m.value = !0), await E(F), A);
|
|
606
|
+
} else
|
|
607
|
+
return H;
|
|
608
|
+
}
|
|
609
|
+
const t = i.value[i.value.length - 1];
|
|
610
|
+
if (t == null) {
|
|
611
|
+
m.value = !0;
|
|
581
612
|
return;
|
|
582
613
|
}
|
|
583
|
-
const
|
|
584
|
-
return
|
|
585
|
-
} catch (
|
|
586
|
-
throw
|
|
614
|
+
const w = await $(t);
|
|
615
|
+
return s.value ? void 0 : (h.value = null, c.value = t, i.value.push(w.nextPage), w.nextPage == null && (m.value = !0), await E(F), w);
|
|
616
|
+
} catch (F) {
|
|
617
|
+
throw h.value = me(F), F;
|
|
587
618
|
} finally {
|
|
588
|
-
|
|
619
|
+
a.value = !1, g("loading:stop", { fetched: o.value.length });
|
|
589
620
|
}
|
|
590
621
|
}
|
|
591
622
|
}
|
|
592
|
-
async function
|
|
593
|
-
if (!
|
|
594
|
-
|
|
623
|
+
async function k() {
|
|
624
|
+
if (!a.value) {
|
|
625
|
+
s.value = !1, a.value = !0;
|
|
595
626
|
try {
|
|
596
|
-
const
|
|
597
|
-
if (
|
|
598
|
-
console.warn("[Masonry] No current page to refresh - currentPage:",
|
|
627
|
+
const F = c.value;
|
|
628
|
+
if (F == null) {
|
|
629
|
+
console.warn("[Masonry] No current page to refresh - currentPage:", c.value, "paginationHistory:", i.value);
|
|
599
630
|
return;
|
|
600
631
|
}
|
|
601
|
-
|
|
602
|
-
const
|
|
603
|
-
if (
|
|
604
|
-
|
|
605
|
-
const
|
|
606
|
-
return await
|
|
607
|
-
} catch (
|
|
608
|
-
throw
|
|
632
|
+
o.value = [], m.value = !1, h.value = null, i.value = [F];
|
|
633
|
+
const t = await $(F);
|
|
634
|
+
if (s.value) return;
|
|
635
|
+
h.value = null, c.value = F, i.value.push(t.nextPage), t.nextPage == null && (m.value = !0);
|
|
636
|
+
const w = o.value.length;
|
|
637
|
+
return await E(w), t;
|
|
638
|
+
} catch (F) {
|
|
639
|
+
throw h.value = me(F), F;
|
|
609
640
|
} finally {
|
|
610
|
-
|
|
641
|
+
a.value = !1, g("loading:stop", { fetched: o.value.length });
|
|
611
642
|
}
|
|
612
643
|
}
|
|
613
644
|
}
|
|
614
|
-
function
|
|
615
|
-
const
|
|
616
|
-
|
|
645
|
+
function z() {
|
|
646
|
+
const F = d;
|
|
647
|
+
s.value = !0, a.value = !1, d = !1, F && g("backfill:stop", { fetched: o.value.length, calls: 0, cancelled: !0 }), g("loading:stop", { fetched: o.value.length });
|
|
617
648
|
}
|
|
618
649
|
return {
|
|
619
|
-
loadPage:
|
|
620
|
-
loadNext:
|
|
621
|
-
refreshCurrentPage:
|
|
622
|
-
cancelLoad:
|
|
623
|
-
maybeBackfillToTarget:
|
|
624
|
-
getContent:
|
|
650
|
+
loadPage: O,
|
|
651
|
+
loadNext: j,
|
|
652
|
+
refreshCurrentPage: k,
|
|
653
|
+
cancelLoad: z,
|
|
654
|
+
maybeBackfillToTarget: E,
|
|
655
|
+
getContent: $
|
|
625
656
|
};
|
|
626
657
|
}
|
|
627
658
|
function la(e) {
|
|
628
659
|
const {
|
|
629
660
|
masonry: l,
|
|
630
|
-
useSwipeMode:
|
|
631
|
-
refreshLayout:
|
|
632
|
-
refreshCurrentPage:
|
|
633
|
-
loadNext:
|
|
634
|
-
maybeBackfillToTarget:
|
|
661
|
+
useSwipeMode: o,
|
|
662
|
+
refreshLayout: a,
|
|
663
|
+
refreshCurrentPage: m,
|
|
664
|
+
loadNext: h,
|
|
665
|
+
maybeBackfillToTarget: c,
|
|
635
666
|
autoRefreshOnEmpty: i,
|
|
636
|
-
paginationHistory:
|
|
667
|
+
paginationHistory: x
|
|
637
668
|
} = e;
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
if (
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
}
|
|
650
|
-
await new Promise((a) => requestAnimationFrame(() => a())), requestAnimationFrame(() => {
|
|
651
|
-
t(m);
|
|
652
|
-
});
|
|
669
|
+
let M = /* @__PURE__ */ new Set(), n = null, b = !1;
|
|
670
|
+
async function P() {
|
|
671
|
+
if (M.size === 0 || b) return;
|
|
672
|
+
b = !0;
|
|
673
|
+
const d = Array.from(M);
|
|
674
|
+
M.clear(), n = null, await f(d), b = !1;
|
|
675
|
+
}
|
|
676
|
+
async function T(d) {
|
|
677
|
+
M.add(d), n && clearTimeout(n), n = setTimeout(() => {
|
|
678
|
+
P();
|
|
679
|
+
}, 16);
|
|
653
680
|
}
|
|
654
|
-
async function
|
|
655
|
-
if (!
|
|
656
|
-
const
|
|
657
|
-
if (l.value =
|
|
681
|
+
async function f(d) {
|
|
682
|
+
if (!d || d.length === 0) return;
|
|
683
|
+
const L = new Set(d.map((v) => v.id)), p = l.value.filter((v) => !L.has(v.id));
|
|
684
|
+
if (l.value = p, await _(), p.length === 0 && x.value.length > 0) {
|
|
658
685
|
if (i)
|
|
659
|
-
await
|
|
686
|
+
await m();
|
|
660
687
|
else
|
|
661
688
|
try {
|
|
662
|
-
await
|
|
689
|
+
await h(), await c(0, !0);
|
|
663
690
|
} catch {
|
|
664
691
|
}
|
|
665
692
|
return;
|
|
666
693
|
}
|
|
667
|
-
await new Promise((
|
|
668
|
-
|
|
694
|
+
await new Promise((v) => requestAnimationFrame(() => v())), requestAnimationFrame(() => {
|
|
695
|
+
a(p);
|
|
669
696
|
});
|
|
670
697
|
}
|
|
671
|
-
async function
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
698
|
+
async function y(d) {
|
|
699
|
+
!d || d.length === 0 || (d.forEach((L) => M.add(L)), n && clearTimeout(n), n = setTimeout(() => {
|
|
700
|
+
P();
|
|
701
|
+
}, 16));
|
|
702
|
+
}
|
|
703
|
+
async function r(d, L) {
|
|
704
|
+
if (!d) return;
|
|
705
|
+
const p = l.value;
|
|
706
|
+
if (p.findIndex((O) => O.id === d.id) !== -1) return;
|
|
707
|
+
const $ = [...p], E = Math.min(L, $.length);
|
|
708
|
+
$.splice(E, 0, d), l.value = $, await _(), o.value || (await new Promise((O) => requestAnimationFrame(() => O())), requestAnimationFrame(() => {
|
|
709
|
+
a($);
|
|
678
710
|
}));
|
|
679
711
|
}
|
|
680
|
-
async function
|
|
681
|
-
var
|
|
682
|
-
if (!
|
|
683
|
-
if (!
|
|
712
|
+
async function g(d, L) {
|
|
713
|
+
var F;
|
|
714
|
+
if (!d || d.length === 0) return;
|
|
715
|
+
if (!L || L.length !== d.length) {
|
|
684
716
|
console.warn("[Masonry] restoreMany: items and indices arrays must have the same length");
|
|
685
717
|
return;
|
|
686
718
|
}
|
|
687
|
-
const
|
|
688
|
-
for (let
|
|
689
|
-
|
|
690
|
-
if (
|
|
691
|
-
const
|
|
692
|
-
for (const { item:
|
|
693
|
-
|
|
694
|
-
const
|
|
695
|
-
let
|
|
696
|
-
for (let
|
|
697
|
-
|
|
698
|
-
for (;
|
|
699
|
-
|
|
700
|
-
l.value =
|
|
701
|
-
|
|
719
|
+
const p = l.value, v = new Set(p.map((t) => t.id)), $ = [];
|
|
720
|
+
for (let t = 0; t < d.length; t++)
|
|
721
|
+
v.has((F = d[t]) == null ? void 0 : F.id) || $.push({ item: d[t], index: L[t] });
|
|
722
|
+
if ($.length === 0) return;
|
|
723
|
+
const E = /* @__PURE__ */ new Map();
|
|
724
|
+
for (const { item: t, index: w } of $)
|
|
725
|
+
E.set(w, t);
|
|
726
|
+
const O = $.length > 0 ? Math.max(...$.map(({ index: t }) => t)) : -1, j = Math.max(p.length - 1, O), k = [];
|
|
727
|
+
let z = 0;
|
|
728
|
+
for (let t = 0; t <= j; t++)
|
|
729
|
+
E.has(t) ? k.push(E.get(t)) : z < p.length && (k.push(p[z]), z++);
|
|
730
|
+
for (; z < p.length; )
|
|
731
|
+
k.push(p[z]), z++;
|
|
732
|
+
l.value = k, await _(), o.value || (await new Promise((t) => requestAnimationFrame(() => t())), requestAnimationFrame(() => {
|
|
733
|
+
a(k);
|
|
702
734
|
}));
|
|
703
735
|
}
|
|
704
|
-
async function
|
|
736
|
+
async function s() {
|
|
705
737
|
l.value = [];
|
|
706
738
|
}
|
|
707
739
|
return {
|
|
708
|
-
remove:
|
|
709
|
-
removeMany:
|
|
710
|
-
restore:
|
|
711
|
-
restoreMany:
|
|
712
|
-
removeAll:
|
|
740
|
+
remove: T,
|
|
741
|
+
removeMany: y,
|
|
742
|
+
restore: r,
|
|
743
|
+
restoreMany: g,
|
|
744
|
+
removeAll: s
|
|
713
745
|
};
|
|
714
746
|
}
|
|
715
747
|
function oa(e) {
|
|
716
748
|
const {
|
|
717
749
|
masonry: l,
|
|
718
|
-
useSwipeMode:
|
|
719
|
-
container:
|
|
720
|
-
columns:
|
|
721
|
-
containerWidth:
|
|
722
|
-
masonryContentHeight:
|
|
750
|
+
useSwipeMode: o,
|
|
751
|
+
container: a,
|
|
752
|
+
columns: m,
|
|
753
|
+
containerWidth: h,
|
|
754
|
+
masonryContentHeight: c,
|
|
723
755
|
layout: i,
|
|
724
|
-
fixedDimensions:
|
|
725
|
-
checkItemDimensions:
|
|
756
|
+
fixedDimensions: x,
|
|
757
|
+
checkItemDimensions: M
|
|
726
758
|
} = e;
|
|
727
759
|
let n = [];
|
|
728
|
-
function
|
|
729
|
-
const
|
|
730
|
-
let
|
|
731
|
-
if (
|
|
732
|
-
const { scrollTop:
|
|
733
|
-
|
|
760
|
+
function b(y) {
|
|
761
|
+
const r = Kt(y);
|
|
762
|
+
let g = 0;
|
|
763
|
+
if (a.value) {
|
|
764
|
+
const { scrollTop: s, clientHeight: d } = a.value;
|
|
765
|
+
g = s + d + 100;
|
|
734
766
|
}
|
|
735
|
-
|
|
767
|
+
c.value = Math.max(r, g);
|
|
736
768
|
}
|
|
737
|
-
function
|
|
738
|
-
var
|
|
739
|
-
if (
|
|
740
|
-
l.value =
|
|
769
|
+
function P(y) {
|
|
770
|
+
var d, L;
|
|
771
|
+
if (o.value) {
|
|
772
|
+
l.value = y;
|
|
741
773
|
return;
|
|
742
774
|
}
|
|
743
|
-
if (!
|
|
744
|
-
if (
|
|
745
|
-
let
|
|
746
|
-
for (let
|
|
747
|
-
if (((
|
|
748
|
-
|
|
775
|
+
if (l.value = y, !a.value) return;
|
|
776
|
+
if (M(y, "refreshLayout"), y.length > 1e3 && n.length > y.length && n.length - y.length < 100) {
|
|
777
|
+
let p = !0;
|
|
778
|
+
for (let v = 0; v < y.length; v++)
|
|
779
|
+
if (((d = y[v]) == null ? void 0 : d.id) !== ((L = n[v]) == null ? void 0 : L.id)) {
|
|
780
|
+
p = !1;
|
|
749
781
|
break;
|
|
750
782
|
}
|
|
751
|
-
if (
|
|
752
|
-
const
|
|
753
|
-
...n[
|
|
754
|
-
originalIndex:
|
|
783
|
+
if (p) {
|
|
784
|
+
const v = y.map(($, E) => ({
|
|
785
|
+
...n[E],
|
|
786
|
+
originalIndex: E
|
|
755
787
|
}));
|
|
756
|
-
|
|
788
|
+
b(v), l.value = v, n = v;
|
|
757
789
|
return;
|
|
758
790
|
}
|
|
759
791
|
}
|
|
760
|
-
const
|
|
761
|
-
...
|
|
762
|
-
originalIndex:
|
|
763
|
-
})),
|
|
764
|
-
if (
|
|
765
|
-
const
|
|
766
|
-
|
|
767
|
-
const
|
|
768
|
-
|
|
792
|
+
const g = y.map((p, v) => ({
|
|
793
|
+
...p,
|
|
794
|
+
originalIndex: v
|
|
795
|
+
})), s = a.value;
|
|
796
|
+
if (x.value && x.value.width !== void 0) {
|
|
797
|
+
const p = s.style.width, v = s.style.boxSizing;
|
|
798
|
+
s.style.boxSizing = "border-box", s.style.width = `${x.value.width}px`, s.offsetWidth;
|
|
799
|
+
const $ = Xe(g, s, m.value, i.value);
|
|
800
|
+
s.style.width = p, s.style.boxSizing = v, b($), l.value = $, n = $;
|
|
769
801
|
} else {
|
|
770
|
-
const
|
|
771
|
-
p
|
|
802
|
+
const p = Xe(g, s, m.value, i.value);
|
|
803
|
+
b(p), l.value = p, n = p;
|
|
772
804
|
}
|
|
773
805
|
}
|
|
774
|
-
function T(
|
|
775
|
-
|
|
776
|
-
|
|
806
|
+
function T(y, r) {
|
|
807
|
+
x.value = y, y && (y.width !== void 0 && (h.value = y.width), !o.value && a.value && l.value.length > 0 && _(() => {
|
|
808
|
+
m.value = ue(i.value, h.value), P(l.value), r && r();
|
|
777
809
|
}));
|
|
778
810
|
}
|
|
779
|
-
function
|
|
780
|
-
|
|
811
|
+
function f() {
|
|
812
|
+
m.value = ue(i.value, h.value), P(l.value);
|
|
781
813
|
}
|
|
782
814
|
return {
|
|
783
|
-
refreshLayout:
|
|
815
|
+
refreshLayout: P,
|
|
784
816
|
setFixedDimensions: T,
|
|
785
|
-
onResize:
|
|
786
|
-
calculateHeight:
|
|
817
|
+
onResize: f,
|
|
818
|
+
calculateHeight: b
|
|
787
819
|
};
|
|
788
820
|
}
|
|
789
|
-
function
|
|
821
|
+
function ia(e) {
|
|
790
822
|
const {
|
|
791
823
|
masonry: l,
|
|
792
|
-
container:
|
|
793
|
-
columns:
|
|
794
|
-
virtualBufferPx:
|
|
795
|
-
loadThresholdPx:
|
|
796
|
-
} = e,
|
|
824
|
+
container: o,
|
|
825
|
+
columns: a,
|
|
826
|
+
virtualBufferPx: m,
|
|
827
|
+
loadThresholdPx: h
|
|
828
|
+
} = e, c = D(e.handleScroll), i = D(0), x = D(0), M = m, n = D(!1), b = D({
|
|
797
829
|
distanceToTrigger: 0,
|
|
798
830
|
isNearTrigger: !1
|
|
799
|
-
}),
|
|
800
|
-
const
|
|
801
|
-
return !
|
|
802
|
-
if (typeof
|
|
831
|
+
}), P = Z(() => {
|
|
832
|
+
const r = i.value - M, g = i.value + x.value + M, s = l.value;
|
|
833
|
+
return !s || s.length === 0 ? [] : s.filter((L) => {
|
|
834
|
+
if (typeof L.top != "number" || typeof L.columnHeight != "number")
|
|
803
835
|
return !0;
|
|
804
|
-
const
|
|
805
|
-
return
|
|
836
|
+
const p = L.top;
|
|
837
|
+
return L.top + L.columnHeight >= r && p <= g;
|
|
806
838
|
});
|
|
807
839
|
});
|
|
808
|
-
function T(
|
|
809
|
-
if (!
|
|
810
|
-
const { scrollTop:
|
|
811
|
-
|
|
812
|
-
distanceToTrigger: Math.round(
|
|
813
|
-
isNearTrigger:
|
|
840
|
+
function T(r) {
|
|
841
|
+
if (!o.value) return;
|
|
842
|
+
const { scrollTop: g, clientHeight: s } = o.value, d = g + s, L = r ?? be(l.value, a.value), p = L.length ? Math.max(...L) : 0, v = typeof h == "number" ? h : 200, $ = v >= 0 ? Math.max(0, p - v) : Math.max(0, p + v), E = Math.max(0, $ - d), O = E <= 100;
|
|
843
|
+
b.value = {
|
|
844
|
+
distanceToTrigger: Math.round(E),
|
|
845
|
+
isNearTrigger: O
|
|
814
846
|
};
|
|
815
847
|
}
|
|
816
|
-
async function
|
|
817
|
-
if (
|
|
818
|
-
const
|
|
819
|
-
i.value =
|
|
848
|
+
async function f() {
|
|
849
|
+
if (o.value) {
|
|
850
|
+
const g = o.value.scrollTop, s = o.value.clientHeight || window.innerHeight, d = s > 0 ? s : window.innerHeight;
|
|
851
|
+
i.value = g, x.value = d;
|
|
820
852
|
}
|
|
821
|
-
n.value = !0, await
|
|
822
|
-
const
|
|
823
|
-
|
|
853
|
+
n.value = !0, await _(), await new Promise((g) => requestAnimationFrame(() => g())), n.value = !1;
|
|
854
|
+
const r = be(l.value, a.value);
|
|
855
|
+
c.value(r), T(r);
|
|
824
856
|
}
|
|
825
|
-
function
|
|
826
|
-
i.value = 0,
|
|
857
|
+
function y() {
|
|
858
|
+
i.value = 0, x.value = 0, n.value = !1, b.value = {
|
|
827
859
|
distanceToTrigger: 0,
|
|
828
860
|
isNearTrigger: !1
|
|
829
861
|
};
|
|
830
862
|
}
|
|
831
863
|
return {
|
|
832
864
|
viewportTop: i,
|
|
833
|
-
viewportHeight:
|
|
865
|
+
viewportHeight: x,
|
|
834
866
|
virtualizing: n,
|
|
835
|
-
scrollProgress:
|
|
836
|
-
visibleMasonry:
|
|
867
|
+
scrollProgress: b,
|
|
868
|
+
visibleMasonry: P,
|
|
837
869
|
updateScrollProgress: T,
|
|
838
|
-
updateViewport:
|
|
839
|
-
reset:
|
|
840
|
-
handleScroll:
|
|
870
|
+
updateViewport: f,
|
|
871
|
+
reset: y,
|
|
872
|
+
handleScroll: c
|
|
841
873
|
};
|
|
842
874
|
}
|
|
843
|
-
function
|
|
844
|
-
const { masonry: l } = e,
|
|
845
|
-
function
|
|
846
|
-
return typeof
|
|
875
|
+
function ra(e) {
|
|
876
|
+
const { masonry: l } = e, o = D(/* @__PURE__ */ new Set());
|
|
877
|
+
function a(c) {
|
|
878
|
+
return typeof c == "number" && c > 0 && Number.isFinite(c);
|
|
847
879
|
}
|
|
848
|
-
function
|
|
880
|
+
function m(c, i) {
|
|
849
881
|
try {
|
|
850
|
-
if (!Array.isArray(
|
|
851
|
-
const
|
|
852
|
-
if (
|
|
853
|
-
const
|
|
854
|
-
for (const n of
|
|
855
|
-
const
|
|
856
|
-
|
|
882
|
+
if (!Array.isArray(c) || c.length === 0) return;
|
|
883
|
+
const x = c.filter((n) => !a(n == null ? void 0 : n.width) || !a(n == null ? void 0 : n.height));
|
|
884
|
+
if (x.length === 0) return;
|
|
885
|
+
const M = [];
|
|
886
|
+
for (const n of x) {
|
|
887
|
+
const b = (n == null ? void 0 : n.id) ?? `idx:${l.value.indexOf(n)}`;
|
|
888
|
+
o.value.has(b) || (o.value.add(b), M.push(b));
|
|
857
889
|
}
|
|
858
|
-
if (
|
|
859
|
-
const n =
|
|
890
|
+
if (M.length > 0) {
|
|
891
|
+
const n = M.slice(0, 10);
|
|
860
892
|
console.warn(
|
|
861
893
|
"[Masonry] Items missing width/height detected:",
|
|
862
894
|
{
|
|
863
895
|
context: i,
|
|
864
|
-
count:
|
|
896
|
+
count: M.length,
|
|
865
897
|
sampleIds: n,
|
|
866
898
|
hint: "Ensure each item has positive width and height. Consider providing fallbacks (e.g., 512x512) at the data layer."
|
|
867
899
|
}
|
|
@@ -870,13 +902,13 @@ function ia(e) {
|
|
|
870
902
|
} catch {
|
|
871
903
|
}
|
|
872
904
|
}
|
|
873
|
-
function
|
|
874
|
-
|
|
905
|
+
function h() {
|
|
906
|
+
o.value.clear();
|
|
875
907
|
}
|
|
876
908
|
return {
|
|
877
|
-
checkItemDimensions:
|
|
878
|
-
invalidDimensionIds:
|
|
879
|
-
reset:
|
|
909
|
+
checkItemDimensions: m,
|
|
910
|
+
invalidDimensionIds: o,
|
|
911
|
+
reset: h
|
|
880
912
|
};
|
|
881
913
|
}
|
|
882
914
|
const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm transition-all duration-300 bg-white relative" }, ca = {
|
|
@@ -901,264 +933,295 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
901
933
|
headerHeight: { default: 0 },
|
|
902
934
|
footerHeight: { default: 0 },
|
|
903
935
|
isActive: { type: Boolean, default: !1 },
|
|
904
|
-
inSwipeMode: { type: Boolean, default: !1 }
|
|
936
|
+
inSwipeMode: { type: Boolean, default: !1 },
|
|
937
|
+
preloadThreshold: { default: 1 }
|
|
905
938
|
},
|
|
906
|
-
emits: ["preload:success", "preload:error", "mouse-enter", "mouse-leave"],
|
|
939
|
+
emits: ["preload:success", "preload:error", "mouse-enter", "mouse-leave", "in-view", "in-view-and-loaded"],
|
|
907
940
|
setup(e, { emit: l }) {
|
|
908
|
-
const
|
|
909
|
-
let
|
|
910
|
-
const
|
|
911
|
-
var
|
|
912
|
-
return
|
|
941
|
+
const o = e, a = l, m = D(!1), h = D(!1), c = D(null), i = D(!1), x = D(!1), M = D(null), n = D(!1), b = D(!1), P = D(!1), T = D(!1), f = D(!1), y = D(null), r = D(null);
|
|
942
|
+
let g = null;
|
|
943
|
+
const s = Z(() => {
|
|
944
|
+
var t;
|
|
945
|
+
return o.type ?? ((t = o.item) == null ? void 0 : t.type) ?? "image";
|
|
913
946
|
}), d = Z(() => {
|
|
914
|
-
var
|
|
915
|
-
return
|
|
916
|
-
}),
|
|
917
|
-
function
|
|
918
|
-
t
|
|
947
|
+
var t;
|
|
948
|
+
return o.notFound ?? ((t = o.item) == null ? void 0 : t.notFound) ?? !1;
|
|
949
|
+
}), L = Z(() => !!o.inSwipeMode);
|
|
950
|
+
function p(t, w) {
|
|
951
|
+
const S = t === "image" ? m.value : i.value;
|
|
952
|
+
b.value && S && !P.value && (P.value = !0, a("in-view-and-loaded", { item: o.item, type: t, src: w }));
|
|
919
953
|
}
|
|
920
|
-
function
|
|
921
|
-
|
|
954
|
+
function v(t) {
|
|
955
|
+
a("mouse-enter", { item: o.item, type: t });
|
|
922
956
|
}
|
|
923
|
-
function
|
|
924
|
-
|
|
925
|
-
const u = o.target;
|
|
926
|
-
u && (u.paused ? u.play() : u.pause());
|
|
957
|
+
function $(t) {
|
|
958
|
+
a("mouse-leave", { item: o.item, type: t });
|
|
927
959
|
}
|
|
928
|
-
function
|
|
929
|
-
|
|
930
|
-
|
|
960
|
+
function E(t) {
|
|
961
|
+
if (L.value) return;
|
|
962
|
+
const w = t.target;
|
|
963
|
+
w && (w.paused ? w.play() : w.pause());
|
|
931
964
|
}
|
|
932
|
-
function
|
|
933
|
-
const
|
|
934
|
-
|
|
965
|
+
function O(t) {
|
|
966
|
+
const w = t.target;
|
|
967
|
+
w && (L.value || w.play(), v("video"));
|
|
935
968
|
}
|
|
936
|
-
function
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
969
|
+
function j(t) {
|
|
970
|
+
const w = t.target;
|
|
971
|
+
w && (L.value || w.pause(), $("video"));
|
|
972
|
+
}
|
|
973
|
+
function k(t) {
|
|
974
|
+
return new Promise((w, S) => {
|
|
975
|
+
if (!t) {
|
|
976
|
+
const I = new Error("No image source provided");
|
|
977
|
+
a("preload:error", { item: o.item, type: "image", src: t, error: I }), S(I);
|
|
941
978
|
return;
|
|
942
979
|
}
|
|
943
|
-
const
|
|
944
|
-
|
|
945
|
-
const
|
|
980
|
+
const H = new Image(), V = Date.now(), C = 300;
|
|
981
|
+
H.onload = () => {
|
|
982
|
+
const I = Date.now() - V, N = Math.max(0, C - I);
|
|
946
983
|
setTimeout(async () => {
|
|
947
|
-
|
|
948
|
-
},
|
|
949
|
-
},
|
|
950
|
-
|
|
951
|
-
const
|
|
952
|
-
|
|
953
|
-
},
|
|
984
|
+
m.value = !0, h.value = !1, T.value = !1, await _(), await new Promise((A) => setTimeout(A, 100)), f.value = !0, a("preload:success", { item: o.item, type: "image", src: t }), p("image", t), w();
|
|
985
|
+
}, N);
|
|
986
|
+
}, H.onerror = () => {
|
|
987
|
+
h.value = !0, m.value = !1, T.value = !1;
|
|
988
|
+
const I = new Error("Failed to load image");
|
|
989
|
+
a("preload:error", { item: o.item, type: "image", src: t, error: I }), S(I);
|
|
990
|
+
}, H.src = t;
|
|
954
991
|
});
|
|
955
992
|
}
|
|
956
|
-
function
|
|
957
|
-
return new Promise((
|
|
958
|
-
if (!
|
|
959
|
-
const
|
|
960
|
-
|
|
993
|
+
function z(t) {
|
|
994
|
+
return new Promise((w, S) => {
|
|
995
|
+
if (!t) {
|
|
996
|
+
const I = new Error("No video source provided");
|
|
997
|
+
a("preload:error", { item: o.item, type: "video", src: t, error: I }), S(I);
|
|
961
998
|
return;
|
|
962
999
|
}
|
|
963
|
-
const
|
|
964
|
-
|
|
965
|
-
const
|
|
1000
|
+
const H = document.createElement("video"), V = Date.now(), C = 300;
|
|
1001
|
+
H.preload = "metadata", H.muted = !0, H.onloadedmetadata = () => {
|
|
1002
|
+
const I = Date.now() - V, N = Math.max(0, C - I);
|
|
966
1003
|
setTimeout(async () => {
|
|
967
|
-
i.value = !0,
|
|
968
|
-
},
|
|
969
|
-
},
|
|
970
|
-
|
|
971
|
-
const
|
|
972
|
-
|
|
973
|
-
},
|
|
1004
|
+
i.value = !0, x.value = !1, T.value = !1, await _(), await new Promise((A) => setTimeout(A, 100)), f.value = !0, a("preload:success", { item: o.item, type: "video", src: t }), p("video", t), w();
|
|
1005
|
+
}, N);
|
|
1006
|
+
}, H.onerror = () => {
|
|
1007
|
+
x.value = !0, i.value = !1, T.value = !1;
|
|
1008
|
+
const I = new Error("Failed to load video");
|
|
1009
|
+
a("preload:error", { item: o.item, type: "video", src: t, error: I }), S(I);
|
|
1010
|
+
}, H.src = t;
|
|
974
1011
|
});
|
|
975
1012
|
}
|
|
976
|
-
async function
|
|
977
|
-
var
|
|
978
|
-
if (!n.value ||
|
|
1013
|
+
async function F() {
|
|
1014
|
+
var w;
|
|
1015
|
+
if (!n.value || T.value || d.value || s.value === "video" && i.value || s.value === "image" && m.value)
|
|
979
1016
|
return;
|
|
980
|
-
const
|
|
981
|
-
if (
|
|
982
|
-
if (
|
|
983
|
-
|
|
1017
|
+
const t = (w = o.item) == null ? void 0 : w.src;
|
|
1018
|
+
if (t)
|
|
1019
|
+
if (T.value = !0, f.value = !1, s.value === "video") {
|
|
1020
|
+
M.value = t, i.value = !1, x.value = !1;
|
|
984
1021
|
try {
|
|
985
|
-
await
|
|
1022
|
+
await z(t);
|
|
986
1023
|
} catch {
|
|
987
1024
|
}
|
|
988
1025
|
} else {
|
|
989
|
-
|
|
1026
|
+
c.value = t, m.value = !1, h.value = !1;
|
|
990
1027
|
try {
|
|
991
|
-
await
|
|
1028
|
+
await k(t);
|
|
992
1029
|
} catch {
|
|
993
1030
|
}
|
|
994
1031
|
}
|
|
995
1032
|
}
|
|
996
|
-
return tt(() => {
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1033
|
+
return tt(async () => {
|
|
1034
|
+
if (!y.value) return;
|
|
1035
|
+
const t = [o.preloadThreshold, 1].filter((S, H, V) => V.indexOf(S) === H).sort((S, H) => S - H);
|
|
1036
|
+
g = new IntersectionObserver(
|
|
1037
|
+
(S) => {
|
|
1038
|
+
S.forEach((H) => {
|
|
1039
|
+
const V = H.intersectionRatio, C = V >= 1, I = V >= o.preloadThreshold;
|
|
1040
|
+
if (C && !b.value) {
|
|
1041
|
+
b.value = !0, a("in-view", { item: o.item, type: s.value });
|
|
1042
|
+
const N = s.value === "image" ? c.value : M.value, A = s.value === "image" ? m.value : i.value;
|
|
1043
|
+
N && A && p(s.value, N);
|
|
1044
|
+
}
|
|
1045
|
+
I && !n.value ? (n.value = !0, F()) : H.isIntersecting;
|
|
1001
1046
|
});
|
|
1002
1047
|
},
|
|
1003
1048
|
{
|
|
1004
|
-
//
|
|
1005
|
-
threshold:
|
|
1049
|
+
// Trigger at both preloadThreshold and 1.0 (fully in view)
|
|
1050
|
+
threshold: t
|
|
1051
|
+
}
|
|
1052
|
+
), g.observe(y.value), await _(), requestAnimationFrame(() => {
|
|
1053
|
+
requestAnimationFrame(() => {
|
|
1054
|
+
w();
|
|
1055
|
+
});
|
|
1056
|
+
}), setTimeout(() => {
|
|
1057
|
+
w();
|
|
1058
|
+
}, 100);
|
|
1059
|
+
function w() {
|
|
1060
|
+
if (!y.value || b.value) return;
|
|
1061
|
+
const S = y.value.getBoundingClientRect(), H = window.innerHeight, V = window.innerWidth;
|
|
1062
|
+
if (S.top >= 0 && S.bottom <= H && S.left >= 0 && S.right <= V && S.height > 0 && S.width > 0) {
|
|
1063
|
+
b.value = !0, a("in-view", { item: o.item, type: s.value });
|
|
1064
|
+
const I = s.value === "image" ? c.value : M.value, N = s.value === "image" ? m.value : i.value;
|
|
1065
|
+
I && N && p(s.value, I);
|
|
1006
1066
|
}
|
|
1007
|
-
|
|
1067
|
+
}
|
|
1008
1068
|
}), at(() => {
|
|
1009
|
-
|
|
1069
|
+
g && (g.disconnect(), g = null);
|
|
1010
1070
|
}), te(
|
|
1011
1071
|
() => {
|
|
1012
|
-
var
|
|
1013
|
-
return (
|
|
1072
|
+
var t;
|
|
1073
|
+
return (t = o.item) == null ? void 0 : t.src;
|
|
1014
1074
|
},
|
|
1015
|
-
async (
|
|
1016
|
-
if (!(!
|
|
1017
|
-
if (
|
|
1018
|
-
if (
|
|
1019
|
-
|
|
1075
|
+
async (t) => {
|
|
1076
|
+
if (!(!t || d.value)) {
|
|
1077
|
+
if (s.value === "video") {
|
|
1078
|
+
if (t !== M.value && (i.value = !1, x.value = !1, M.value = t, n.value)) {
|
|
1079
|
+
T.value = !0;
|
|
1020
1080
|
try {
|
|
1021
|
-
await
|
|
1081
|
+
await z(t);
|
|
1022
1082
|
} catch {
|
|
1023
1083
|
}
|
|
1024
1084
|
}
|
|
1025
|
-
} else if (
|
|
1026
|
-
|
|
1085
|
+
} else if (t !== c.value && (m.value = !1, h.value = !1, c.value = t, n.value)) {
|
|
1086
|
+
T.value = !0;
|
|
1027
1087
|
try {
|
|
1028
|
-
await
|
|
1088
|
+
await k(t);
|
|
1029
1089
|
} catch {
|
|
1030
1090
|
}
|
|
1031
1091
|
}
|
|
1032
1092
|
}
|
|
1033
1093
|
}
|
|
1034
1094
|
), te(
|
|
1035
|
-
() =>
|
|
1036
|
-
(
|
|
1037
|
-
!
|
|
1095
|
+
() => o.isActive,
|
|
1096
|
+
(t) => {
|
|
1097
|
+
!L.value || !r.value || (t ? r.value.play() : r.value.pause());
|
|
1038
1098
|
}
|
|
1039
|
-
), (
|
|
1099
|
+
), (t, w) => (Y(), q("div", {
|
|
1040
1100
|
ref_key: "containerRef",
|
|
1041
|
-
ref:
|
|
1101
|
+
ref: y,
|
|
1042
1102
|
class: "relative w-full h-full flex flex-col"
|
|
1043
1103
|
}, [
|
|
1044
|
-
|
|
1104
|
+
t.headerHeight > 0 ? (Y(), q("div", {
|
|
1045
1105
|
key: 0,
|
|
1046
1106
|
class: "relative z-10",
|
|
1047
|
-
style: ge({ height: `${
|
|
1107
|
+
style: ge({ height: `${t.headerHeight}px` })
|
|
1048
1108
|
}, [
|
|
1049
|
-
|
|
1050
|
-
item:
|
|
1051
|
-
remove:
|
|
1052
|
-
imageLoaded:
|
|
1053
|
-
imageError:
|
|
1109
|
+
J(t.$slots, "header", {
|
|
1110
|
+
item: t.item,
|
|
1111
|
+
remove: t.remove,
|
|
1112
|
+
imageLoaded: m.value,
|
|
1113
|
+
imageError: h.value,
|
|
1054
1114
|
videoLoaded: i.value,
|
|
1055
|
-
videoError:
|
|
1115
|
+
videoError: x.value,
|
|
1056
1116
|
showNotFound: d.value,
|
|
1057
|
-
isLoading:
|
|
1058
|
-
mediaType:
|
|
1117
|
+
isLoading: T.value,
|
|
1118
|
+
mediaType: s.value,
|
|
1119
|
+
isFullyInView: b.value
|
|
1059
1120
|
})
|
|
1060
1121
|
], 4)) : ae("", !0),
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
item:
|
|
1064
|
-
remove:
|
|
1065
|
-
imageLoaded:
|
|
1066
|
-
imageError:
|
|
1122
|
+
U("div", sa, [
|
|
1123
|
+
J(t.$slots, "default", {
|
|
1124
|
+
item: t.item,
|
|
1125
|
+
remove: t.remove,
|
|
1126
|
+
imageLoaded: m.value,
|
|
1127
|
+
imageError: h.value,
|
|
1067
1128
|
videoLoaded: i.value,
|
|
1068
|
-
videoError:
|
|
1129
|
+
videoError: x.value,
|
|
1069
1130
|
showNotFound: d.value,
|
|
1070
|
-
isLoading:
|
|
1071
|
-
mediaType:
|
|
1072
|
-
imageSrc:
|
|
1073
|
-
videoSrc:
|
|
1074
|
-
showMedia:
|
|
1131
|
+
isLoading: T.value,
|
|
1132
|
+
mediaType: s.value,
|
|
1133
|
+
imageSrc: c.value,
|
|
1134
|
+
videoSrc: M.value,
|
|
1135
|
+
showMedia: f.value,
|
|
1136
|
+
isFullyInView: b.value
|
|
1075
1137
|
}, () => [
|
|
1076
|
-
|
|
1077
|
-
d.value ? (
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
]))) : (
|
|
1082
|
-
|
|
1138
|
+
U("div", ua, [
|
|
1139
|
+
d.value ? (Y(), q("div", ca, w[3] || (w[3] = [
|
|
1140
|
+
U("i", { class: "fas fa-search text-3xl mb-3 opacity-50" }, null, -1),
|
|
1141
|
+
U("span", { class: "font-medium" }, "Not Found", -1),
|
|
1142
|
+
U("span", { class: "text-xs mt-1 opacity-75" }, "This item could not be located", -1)
|
|
1143
|
+
]))) : (Y(), q("div", va, [
|
|
1144
|
+
s.value === "image" && c.value ? (Y(), q("img", {
|
|
1083
1145
|
key: 0,
|
|
1084
|
-
src:
|
|
1085
|
-
class:
|
|
1146
|
+
src: c.value,
|
|
1147
|
+
class: ie([
|
|
1086
1148
|
"w-full h-full object-cover transition-opacity duration-700 ease-in-out",
|
|
1087
|
-
|
|
1149
|
+
m.value && f.value ? "opacity-100" : "opacity-0"
|
|
1088
1150
|
]),
|
|
1089
1151
|
style: { position: "absolute", top: "0", left: "0" },
|
|
1090
1152
|
loading: "lazy",
|
|
1091
1153
|
decoding: "async",
|
|
1092
1154
|
alt: "",
|
|
1093
|
-
onMouseenter:
|
|
1094
|
-
onMouseleave:
|
|
1155
|
+
onMouseenter: w[0] || (w[0] = (S) => v("image")),
|
|
1156
|
+
onMouseleave: w[1] || (w[1] = (S) => $("image"))
|
|
1095
1157
|
}, null, 42, fa)) : ae("", !0),
|
|
1096
|
-
|
|
1158
|
+
s.value === "video" && M.value ? (Y(), q("video", {
|
|
1097
1159
|
key: 1,
|
|
1098
1160
|
ref_key: "videoEl",
|
|
1099
|
-
ref:
|
|
1100
|
-
src:
|
|
1101
|
-
class:
|
|
1161
|
+
ref: r,
|
|
1162
|
+
src: M.value,
|
|
1163
|
+
class: ie([
|
|
1102
1164
|
"w-full h-full object-cover transition-opacity duration-700 ease-in-out",
|
|
1103
|
-
i.value &&
|
|
1165
|
+
i.value && f.value ? "opacity-100" : "opacity-0"
|
|
1104
1166
|
]),
|
|
1105
1167
|
style: { position: "absolute", top: "0", left: "0" },
|
|
1106
1168
|
muted: "",
|
|
1107
1169
|
loop: "",
|
|
1108
1170
|
playsinline: "",
|
|
1109
|
-
autoplay:
|
|
1110
|
-
controls:
|
|
1111
|
-
onClick: Ye(
|
|
1112
|
-
onTouchend: Ye(
|
|
1113
|
-
onMouseenter:
|
|
1114
|
-
onMouseleave:
|
|
1115
|
-
onError:
|
|
1171
|
+
autoplay: L.value && o.isActive,
|
|
1172
|
+
controls: L.value,
|
|
1173
|
+
onClick: Ye(E, ["stop"]),
|
|
1174
|
+
onTouchend: Ye(E, ["stop", "prevent"]),
|
|
1175
|
+
onMouseenter: O,
|
|
1176
|
+
onMouseleave: j,
|
|
1177
|
+
onError: w[2] || (w[2] = (S) => x.value = !0)
|
|
1116
1178
|
}, null, 42, da)) : ae("", !0),
|
|
1117
|
-
!
|
|
1179
|
+
!m.value && !i.value && !h.value && !x.value ? (Y(), q("div", {
|
|
1118
1180
|
key: 2,
|
|
1119
|
-
class:
|
|
1181
|
+
class: ie([
|
|
1120
1182
|
"absolute inset-0 bg-slate-100 flex items-center justify-center transition-opacity duration-500",
|
|
1121
|
-
|
|
1183
|
+
f.value ? "opacity-0 pointer-events-none" : "opacity-100"
|
|
1122
1184
|
])
|
|
1123
1185
|
}, [
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
class:
|
|
1186
|
+
U("div", ha, [
|
|
1187
|
+
J(t.$slots, "placeholder-icon", { mediaType: s.value }, () => [
|
|
1188
|
+
U("i", {
|
|
1189
|
+
class: ie(s.value === "video" ? "fas fa-video text-xl text-slate-400" : "fas fa-image text-xl text-slate-400")
|
|
1128
1190
|
}, null, 2)
|
|
1129
1191
|
])
|
|
1130
1192
|
])
|
|
1131
1193
|
], 2)) : ae("", !0),
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1194
|
+
T.value ? (Y(), q("div", ma, w[4] || (w[4] = [
|
|
1195
|
+
U("div", { class: "bg-white/90 backdrop-blur-sm rounded-full px-3 py-1.5 shadow-sm" }, [
|
|
1196
|
+
U("div", { class: "animate-spin rounded-full h-4 w-4 border-b-2 border-blue-500" })
|
|
1135
1197
|
], -1)
|
|
1136
1198
|
]))) : ae("", !0),
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
class:
|
|
1199
|
+
s.value === "image" && h.value || s.value === "video" && x.value ? (Y(), q("div", ga, [
|
|
1200
|
+
U("i", {
|
|
1201
|
+
class: ie(s.value === "video" ? "fas fa-video text-2xl mb-2 opacity-50" : "fas fa-image text-2xl mb-2 opacity-50")
|
|
1140
1202
|
}, null, 2),
|
|
1141
|
-
|
|
1203
|
+
U("span", null, "Failed to load " + Ne(s.value), 1)
|
|
1142
1204
|
])) : ae("", !0)
|
|
1143
1205
|
]))
|
|
1144
1206
|
])
|
|
1145
1207
|
])
|
|
1146
1208
|
]),
|
|
1147
|
-
|
|
1209
|
+
t.footerHeight > 0 ? (Y(), q("div", {
|
|
1148
1210
|
key: 1,
|
|
1149
1211
|
class: "relative z-10",
|
|
1150
|
-
style: ge({ height: `${
|
|
1212
|
+
style: ge({ height: `${t.footerHeight}px` })
|
|
1151
1213
|
}, [
|
|
1152
|
-
|
|
1153
|
-
item:
|
|
1154
|
-
remove:
|
|
1155
|
-
imageLoaded:
|
|
1156
|
-
imageError:
|
|
1214
|
+
J(t.$slots, "footer", {
|
|
1215
|
+
item: t.item,
|
|
1216
|
+
remove: t.remove,
|
|
1217
|
+
imageLoaded: m.value,
|
|
1218
|
+
imageError: h.value,
|
|
1157
1219
|
videoLoaded: i.value,
|
|
1158
|
-
videoError:
|
|
1220
|
+
videoError: x.value,
|
|
1159
1221
|
showNotFound: d.value,
|
|
1160
|
-
isLoading:
|
|
1161
|
-
mediaType:
|
|
1222
|
+
isLoading: T.value,
|
|
1223
|
+
mediaType: s.value,
|
|
1224
|
+
isFullyInView: b.value
|
|
1162
1225
|
})
|
|
1163
1226
|
], 4)) : ae("", !0)
|
|
1164
1227
|
], 512));
|
|
@@ -1175,7 +1238,7 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1175
1238
|
}, Ta = {
|
|
1176
1239
|
key: 1,
|
|
1177
1240
|
class: "w-full py-8 text-center"
|
|
1178
|
-
}, Ia = { class: "text-red-500 dark:text-red-400" },
|
|
1241
|
+
}, Ia = { class: "text-red-500 dark:text-red-400" }, Pa = /* @__PURE__ */ et({
|
|
1179
1242
|
__name: "Masonry",
|
|
1180
1243
|
props: {
|
|
1181
1244
|
getNextPage: {
|
|
@@ -1218,9 +1281,10 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1218
1281
|
default: 40
|
|
1219
1282
|
},
|
|
1220
1283
|
// Backfill configuration
|
|
1221
|
-
|
|
1222
|
-
type:
|
|
1223
|
-
default:
|
|
1284
|
+
mode: {
|
|
1285
|
+
type: String,
|
|
1286
|
+
default: "backfill",
|
|
1287
|
+
validator: (e) => ["backfill", "none", "refresh"].includes(e)
|
|
1224
1288
|
},
|
|
1225
1289
|
backfillDelayMs: {
|
|
1226
1290
|
type: Number,
|
|
@@ -1294,6 +1358,7 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1294
1358
|
"retry:start",
|
|
1295
1359
|
"retry:tick",
|
|
1296
1360
|
"retry:stop",
|
|
1361
|
+
"loading:stop",
|
|
1297
1362
|
"remove-all:complete",
|
|
1298
1363
|
// Re-emit item-level preload events from the default MasonryItem
|
|
1299
1364
|
"item:preload:success",
|
|
@@ -1302,8 +1367,8 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1302
1367
|
"item:mouse-enter",
|
|
1303
1368
|
"item:mouse-leave"
|
|
1304
1369
|
],
|
|
1305
|
-
setup(e, { expose: l, emit:
|
|
1306
|
-
const
|
|
1370
|
+
setup(e, { expose: l, emit: o }) {
|
|
1371
|
+
const a = e, m = {
|
|
1307
1372
|
sizes: { base: 1, sm: 2, md: 3, lg: 4, xl: 5, "2xl": 6 },
|
|
1308
1373
|
gutterX: 10,
|
|
1309
1374
|
gutterY: 10,
|
|
@@ -1312,126 +1377,126 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1312
1377
|
paddingLeft: 0,
|
|
1313
1378
|
paddingRight: 0,
|
|
1314
1379
|
placement: "masonry"
|
|
1315
|
-
},
|
|
1316
|
-
var
|
|
1380
|
+
}, h = Z(() => {
|
|
1381
|
+
var u;
|
|
1317
1382
|
return {
|
|
1318
|
-
...
|
|
1319
|
-
...
|
|
1383
|
+
...m,
|
|
1384
|
+
...a.layout,
|
|
1320
1385
|
sizes: {
|
|
1321
|
-
...
|
|
1322
|
-
...((
|
|
1386
|
+
...m.sizes,
|
|
1387
|
+
...((u = a.layout) == null ? void 0 : u.sizes) || {}
|
|
1323
1388
|
}
|
|
1324
1389
|
};
|
|
1325
|
-
}),
|
|
1390
|
+
}), c = D(null), i = D(typeof window < "u" ? window.innerWidth : 1024), x = D(typeof window < "u" ? window.innerHeight : 768), M = D(null);
|
|
1326
1391
|
let n = null;
|
|
1327
|
-
function
|
|
1392
|
+
function b(u) {
|
|
1328
1393
|
return {
|
|
1329
1394
|
sm: 640,
|
|
1330
1395
|
md: 768,
|
|
1331
1396
|
lg: 1024,
|
|
1332
1397
|
xl: 1280,
|
|
1333
1398
|
"2xl": 1536
|
|
1334
|
-
}[
|
|
1399
|
+
}[u] || 768;
|
|
1335
1400
|
}
|
|
1336
|
-
const
|
|
1337
|
-
if (
|
|
1338
|
-
if (
|
|
1339
|
-
const
|
|
1340
|
-
return i.value <
|
|
1341
|
-
}), T =
|
|
1342
|
-
get: () =>
|
|
1343
|
-
set: (
|
|
1344
|
-
}),
|
|
1345
|
-
masonry:
|
|
1346
|
-
}), { checkItemDimensions:
|
|
1347
|
-
masonry:
|
|
1348
|
-
useSwipeMode:
|
|
1349
|
-
container:
|
|
1350
|
-
columns:
|
|
1401
|
+
const P = Z(() => {
|
|
1402
|
+
if (a.layoutMode === "masonry") return !1;
|
|
1403
|
+
if (a.layoutMode === "swipe") return !0;
|
|
1404
|
+
const u = typeof a.mobileBreakpoint == "string" ? b(a.mobileBreakpoint) : a.mobileBreakpoint;
|
|
1405
|
+
return i.value < u;
|
|
1406
|
+
}), T = o, f = Z({
|
|
1407
|
+
get: () => a.items,
|
|
1408
|
+
set: (u) => T("update:items", u)
|
|
1409
|
+
}), y = D(7), r = D(null), g = D([]), s = D(null), d = D(!1), L = D(0), p = D(!1), v = D(null), $ = Z(() => Jt(i.value)), E = ra({
|
|
1410
|
+
masonry: f
|
|
1411
|
+
}), { checkItemDimensions: O, reset: j } = E, k = oa({
|
|
1412
|
+
masonry: f,
|
|
1413
|
+
useSwipeMode: P,
|
|
1414
|
+
container: r,
|
|
1415
|
+
columns: y,
|
|
1351
1416
|
containerWidth: i,
|
|
1352
|
-
masonryContentHeight:
|
|
1353
|
-
layout:
|
|
1354
|
-
fixedDimensions:
|
|
1355
|
-
checkItemDimensions:
|
|
1356
|
-
}), { refreshLayout:
|
|
1357
|
-
masonry:
|
|
1358
|
-
container:
|
|
1359
|
-
columns:
|
|
1360
|
-
virtualBufferPx:
|
|
1361
|
-
loadThresholdPx:
|
|
1417
|
+
masonryContentHeight: L,
|
|
1418
|
+
layout: h,
|
|
1419
|
+
fixedDimensions: M,
|
|
1420
|
+
checkItemDimensions: O
|
|
1421
|
+
}), { refreshLayout: z, setFixedDimensions: F, onResize: t } = k, w = ia({
|
|
1422
|
+
masonry: f,
|
|
1423
|
+
container: r,
|
|
1424
|
+
columns: y,
|
|
1425
|
+
virtualBufferPx: a.virtualBufferPx,
|
|
1426
|
+
loadThresholdPx: a.loadThresholdPx,
|
|
1362
1427
|
handleScroll: () => {
|
|
1363
1428
|
}
|
|
1364
1429
|
// Will be set after pagination is initialized
|
|
1365
|
-
}), { viewportTop:
|
|
1366
|
-
{ container:
|
|
1367
|
-
{ leaveDurationMs:
|
|
1368
|
-
), ot = ne,
|
|
1369
|
-
getNextPage:
|
|
1370
|
-
masonry:
|
|
1371
|
-
isLoading:
|
|
1372
|
-
hasReachedEnd:
|
|
1373
|
-
loadError:
|
|
1374
|
-
currentPage:
|
|
1375
|
-
paginationHistory:
|
|
1376
|
-
refreshLayout:
|
|
1377
|
-
retryMaxAttempts:
|
|
1378
|
-
retryInitialDelayMs:
|
|
1379
|
-
retryBackoffStepMs:
|
|
1380
|
-
|
|
1381
|
-
backfillDelayMs:
|
|
1382
|
-
backfillMaxCalls:
|
|
1383
|
-
pageSize:
|
|
1384
|
-
autoRefreshOnEmpty:
|
|
1430
|
+
}), { viewportTop: S, viewportHeight: H, virtualizing: V, visibleMasonry: C, updateScrollProgress: I, updateViewport: N, reset: A } = w, { onEnter: ne, onBeforeEnter: K, onBeforeLeave: re, onLeave: ee } = ea(
|
|
1431
|
+
{ container: r },
|
|
1432
|
+
{ leaveDurationMs: a.leaveDurationMs, virtualizing: V }
|
|
1433
|
+
), ot = ne, it = K, rt = re, st = ee, ut = na({
|
|
1434
|
+
getNextPage: a.getNextPage,
|
|
1435
|
+
masonry: f,
|
|
1436
|
+
isLoading: d,
|
|
1437
|
+
hasReachedEnd: p,
|
|
1438
|
+
loadError: v,
|
|
1439
|
+
currentPage: s,
|
|
1440
|
+
paginationHistory: g,
|
|
1441
|
+
refreshLayout: z,
|
|
1442
|
+
retryMaxAttempts: a.retryMaxAttempts,
|
|
1443
|
+
retryInitialDelayMs: a.retryInitialDelayMs,
|
|
1444
|
+
retryBackoffStepMs: a.retryBackoffStepMs,
|
|
1445
|
+
mode: a.mode,
|
|
1446
|
+
backfillDelayMs: a.backfillDelayMs,
|
|
1447
|
+
backfillMaxCalls: a.backfillMaxCalls,
|
|
1448
|
+
pageSize: a.pageSize,
|
|
1449
|
+
autoRefreshOnEmpty: a.autoRefreshOnEmpty,
|
|
1385
1450
|
emits: T
|
|
1386
|
-
}), { loadPage: Te, loadNext: pe, refreshCurrentPage:
|
|
1387
|
-
useSwipeMode:
|
|
1388
|
-
masonry:
|
|
1389
|
-
isLoading:
|
|
1451
|
+
}), { loadPage: Te, loadNext: pe, refreshCurrentPage: De, cancelLoad: Ie, maybeBackfillToTarget: ct } = ut, Q = aa({
|
|
1452
|
+
useSwipeMode: P,
|
|
1453
|
+
masonry: f,
|
|
1454
|
+
isLoading: d,
|
|
1390
1455
|
loadNext: pe,
|
|
1391
1456
|
loadPage: Te,
|
|
1392
|
-
paginationHistory:
|
|
1393
|
-
}), { handleScroll:
|
|
1394
|
-
container:
|
|
1395
|
-
masonry:
|
|
1396
|
-
columns:
|
|
1397
|
-
containerHeight:
|
|
1398
|
-
isLoading:
|
|
1399
|
-
pageSize:
|
|
1400
|
-
refreshLayout:
|
|
1401
|
-
setItemsRaw: (
|
|
1402
|
-
|
|
1457
|
+
paginationHistory: g
|
|
1458
|
+
}), { handleScroll: ze } = ta({
|
|
1459
|
+
container: r,
|
|
1460
|
+
masonry: f,
|
|
1461
|
+
columns: y,
|
|
1462
|
+
containerHeight: L,
|
|
1463
|
+
isLoading: d,
|
|
1464
|
+
pageSize: a.pageSize,
|
|
1465
|
+
refreshLayout: z,
|
|
1466
|
+
setItemsRaw: (u) => {
|
|
1467
|
+
f.value = u;
|
|
1403
1468
|
},
|
|
1404
1469
|
loadNext: pe,
|
|
1405
|
-
loadThresholdPx:
|
|
1470
|
+
loadThresholdPx: a.loadThresholdPx
|
|
1406
1471
|
});
|
|
1407
|
-
|
|
1472
|
+
w.handleScroll.value = ze;
|
|
1408
1473
|
const vt = la({
|
|
1409
|
-
masonry:
|
|
1410
|
-
useSwipeMode:
|
|
1411
|
-
refreshLayout:
|
|
1412
|
-
refreshCurrentPage:
|
|
1474
|
+
masonry: f,
|
|
1475
|
+
useSwipeMode: P,
|
|
1476
|
+
refreshLayout: z,
|
|
1477
|
+
refreshCurrentPage: De,
|
|
1413
1478
|
loadNext: pe,
|
|
1414
1479
|
maybeBackfillToTarget: ct,
|
|
1415
|
-
autoRefreshOnEmpty:
|
|
1416
|
-
paginationHistory:
|
|
1480
|
+
autoRefreshOnEmpty: a.autoRefreshOnEmpty,
|
|
1481
|
+
paginationHistory: g
|
|
1417
1482
|
}), { remove: ce, removeMany: ft, restore: dt, restoreMany: ht, removeAll: mt } = vt;
|
|
1418
|
-
function gt(
|
|
1419
|
-
|
|
1483
|
+
function gt(u) {
|
|
1484
|
+
F(u, I), !u && c.value && (i.value = c.value.clientWidth, x.value = c.value.clientHeight);
|
|
1420
1485
|
}
|
|
1421
1486
|
l({
|
|
1422
|
-
isLoading:
|
|
1423
|
-
refreshLayout:
|
|
1487
|
+
isLoading: d,
|
|
1488
|
+
refreshLayout: z,
|
|
1424
1489
|
// Container dimensions (wrapper element)
|
|
1425
1490
|
containerWidth: i,
|
|
1426
|
-
containerHeight:
|
|
1491
|
+
containerHeight: x,
|
|
1427
1492
|
// Masonry content height (for backward compatibility, old containerHeight)
|
|
1428
|
-
contentHeight:
|
|
1493
|
+
contentHeight: L,
|
|
1429
1494
|
// Current page
|
|
1430
|
-
currentPage:
|
|
1495
|
+
currentPage: s,
|
|
1431
1496
|
// End of list tracking
|
|
1432
|
-
hasReachedEnd:
|
|
1497
|
+
hasReachedEnd: p,
|
|
1433
1498
|
// Load error tracking
|
|
1434
|
-
loadError:
|
|
1499
|
+
loadError: v,
|
|
1435
1500
|
// Set fixed dimensions (overrides ResizeObserver)
|
|
1436
1501
|
setFixedDimensions: gt,
|
|
1437
1502
|
remove: ce,
|
|
@@ -1441,185 +1506,185 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1441
1506
|
restoreMany: ht,
|
|
1442
1507
|
loadNext: pe,
|
|
1443
1508
|
loadPage: Te,
|
|
1444
|
-
refreshCurrentPage:
|
|
1509
|
+
refreshCurrentPage: De,
|
|
1445
1510
|
reset: xt,
|
|
1446
1511
|
destroy: bt,
|
|
1447
|
-
init:
|
|
1448
|
-
restoreItems:
|
|
1449
|
-
paginationHistory:
|
|
1512
|
+
init: je,
|
|
1513
|
+
restoreItems: ke,
|
|
1514
|
+
paginationHistory: g,
|
|
1450
1515
|
cancelLoad: Ie,
|
|
1451
1516
|
scrollToTop: pt,
|
|
1452
1517
|
scrollTo: yt,
|
|
1453
|
-
totalItems: Z(() =>
|
|
1454
|
-
currentBreakpoint:
|
|
1518
|
+
totalItems: Z(() => f.value.length),
|
|
1519
|
+
currentBreakpoint: $
|
|
1455
1520
|
});
|
|
1456
|
-
const se = Q.currentSwipeIndex, ve = Q.swipeOffset, ye = Q.isDragging, le = Q.swipeContainer, Ae = Q.handleTouchStart,
|
|
1457
|
-
function pt(
|
|
1458
|
-
|
|
1521
|
+
const se = Q.currentSwipeIndex, ve = Q.swipeOffset, ye = Q.isDragging, le = Q.swipeContainer, Ae = Q.handleTouchStart, Re = Q.handleTouchMove, We = Q.handleTouchEnd, Oe = Q.handleMouseDown, Pe = Q.handleMouseMove, Le = Q.handleMouseUp, Ee = Q.snapToCurrentItem;
|
|
1522
|
+
function pt(u) {
|
|
1523
|
+
r.value && r.value.scrollTo({
|
|
1459
1524
|
top: 0,
|
|
1460
|
-
behavior: (
|
|
1461
|
-
...
|
|
1525
|
+
behavior: (u == null ? void 0 : u.behavior) ?? "smooth",
|
|
1526
|
+
...u
|
|
1462
1527
|
});
|
|
1463
1528
|
}
|
|
1464
|
-
function yt(
|
|
1465
|
-
|
|
1466
|
-
top:
|
|
1467
|
-
left:
|
|
1468
|
-
behavior:
|
|
1469
|
-
}),
|
|
1529
|
+
function yt(u) {
|
|
1530
|
+
r.value && (r.value.scrollTo({
|
|
1531
|
+
top: u.top ?? r.value.scrollTop,
|
|
1532
|
+
left: u.left ?? r.value.scrollLeft,
|
|
1533
|
+
behavior: u.behavior ?? "auto"
|
|
1534
|
+
}), r.value && (S.value = r.value.scrollTop, H.value = r.value.clientHeight || window.innerHeight));
|
|
1470
1535
|
}
|
|
1471
1536
|
function wt() {
|
|
1472
|
-
|
|
1537
|
+
t(), r.value && (S.value = r.value.scrollTop, H.value = r.value.clientHeight);
|
|
1473
1538
|
}
|
|
1474
1539
|
function xt() {
|
|
1475
|
-
Ie(),
|
|
1540
|
+
Ie(), r.value && r.value.scrollTo({
|
|
1476
1541
|
top: 0,
|
|
1477
1542
|
behavior: "smooth"
|
|
1478
|
-
}),
|
|
1543
|
+
}), f.value = [], x.value = 0, s.value = a.loadAtPage, g.value = [a.loadAtPage], p.value = !1, v.value = null, A(), we = !1;
|
|
1479
1544
|
}
|
|
1480
1545
|
function bt() {
|
|
1481
|
-
Ie(),
|
|
1546
|
+
Ie(), f.value = [], L.value = 0, s.value = null, g.value = [], p.value = !1, v.value = null, d.value = !1, se.value = 0, ve.value = 0, ye.value = !1, A(), j(), r.value && r.value.scrollTo({
|
|
1482
1547
|
top: 0,
|
|
1483
1548
|
behavior: "auto"
|
|
1484
1549
|
// Instant scroll for destroy
|
|
1485
1550
|
});
|
|
1486
1551
|
}
|
|
1487
1552
|
const oe = Qe(async () => {
|
|
1488
|
-
|
|
1553
|
+
P.value || await N();
|
|
1489
1554
|
}, 200), Ce = Qe(wt, 200);
|
|
1490
|
-
function
|
|
1555
|
+
function Ve() {
|
|
1491
1556
|
Q.handleWindowResize();
|
|
1492
1557
|
}
|
|
1493
|
-
function
|
|
1494
|
-
|
|
1495
|
-
|
|
1558
|
+
function je(u, B, R) {
|
|
1559
|
+
s.value = B, g.value = [B], g.value.push(R), p.value = R == null, O(u, "init"), P.value ? (f.value = [...f.value, ...u], se.value === 0 && f.value.length > 0 && (ve.value = 0)) : (z([...f.value, ...u]), r.value && (S.value = r.value.scrollTop, H.value = r.value.clientHeight || window.innerHeight), _(() => {
|
|
1560
|
+
r.value && (S.value = r.value.scrollTop, H.value = r.value.clientHeight || window.innerHeight, I());
|
|
1496
1561
|
}));
|
|
1497
1562
|
}
|
|
1498
|
-
async function
|
|
1499
|
-
if (!
|
|
1500
|
-
|
|
1563
|
+
async function ke(u, B, R) {
|
|
1564
|
+
if (!a.skipInitialLoad) {
|
|
1565
|
+
je(u, B, R);
|
|
1501
1566
|
return;
|
|
1502
1567
|
}
|
|
1503
|
-
if (
|
|
1504
|
-
|
|
1505
|
-
else if (u
|
|
1506
|
-
|
|
1507
|
-
const
|
|
1508
|
-
qe >= Mt && !
|
|
1568
|
+
if (s.value = B, g.value = [B], R != null && g.value.push(R), p.value = R === null, v.value = null, O(u, "restoreItems"), P.value)
|
|
1569
|
+
f.value = u, se.value === 0 && f.value.length > 0 && (ve.value = 0);
|
|
1570
|
+
else if (z(u), r.value && (S.value = r.value.scrollTop, H.value = r.value.clientHeight || window.innerHeight), await _(), r.value) {
|
|
1571
|
+
S.value = r.value.scrollTop, H.value = r.value.clientHeight || window.innerHeight, I(), await _();
|
|
1572
|
+
const G = be(f.value, y.value), W = G.length ? Math.max(...G) : 0, qe = r.value.scrollTop + r.value.clientHeight, Se = typeof a.loadThresholdPx == "number" ? a.loadThresholdPx : 200, Mt = Se >= 0 ? Math.max(0, W - Se) : Math.max(0, W + Se);
|
|
1573
|
+
qe >= Mt && !p.value && !d.value && g.value.length > 0 && g.value[g.value.length - 1] != null && await ze(G, !0);
|
|
1509
1574
|
}
|
|
1510
1575
|
}
|
|
1511
1576
|
te(
|
|
1512
|
-
|
|
1577
|
+
h,
|
|
1513
1578
|
() => {
|
|
1514
|
-
|
|
1579
|
+
P.value || r.value && (y.value = ue(h.value, i.value), z(f.value));
|
|
1515
1580
|
},
|
|
1516
1581
|
{ deep: !0 }
|
|
1517
|
-
), te(() =>
|
|
1518
|
-
|
|
1519
|
-
}), te(
|
|
1520
|
-
|
|
1582
|
+
), te(() => a.layoutMode, () => {
|
|
1583
|
+
M.value && M.value.width !== void 0 ? i.value = M.value.width : c.value && (i.value = c.value.clientWidth);
|
|
1584
|
+
}), te(r, (u) => {
|
|
1585
|
+
u && !P.value ? (u.removeEventListener("scroll", oe), u.addEventListener("scroll", oe, { passive: !0 })) : u && u.removeEventListener("scroll", oe);
|
|
1521
1586
|
}, { immediate: !0 });
|
|
1522
1587
|
let we = !1;
|
|
1523
1588
|
return te(
|
|
1524
|
-
() => [
|
|
1525
|
-
([
|
|
1526
|
-
if (
|
|
1589
|
+
() => [a.items, a.skipInitialLoad, a.initialPage, a.initialNextPage],
|
|
1590
|
+
([u, B, R, G]) => {
|
|
1591
|
+
if (B && u && u.length > 0 && !we) {
|
|
1527
1592
|
we = !0;
|
|
1528
|
-
const
|
|
1529
|
-
|
|
1593
|
+
const W = R ?? a.loadAtPage;
|
|
1594
|
+
ke(u, W, G !== void 0 ? G : void 0);
|
|
1530
1595
|
}
|
|
1531
1596
|
},
|
|
1532
1597
|
{ immediate: !1 }
|
|
1533
|
-
), te(
|
|
1534
|
-
|
|
1535
|
-
|
|
1598
|
+
), te(P, (u, B) => {
|
|
1599
|
+
B === void 0 && u === !1 || _(() => {
|
|
1600
|
+
u ? (document.addEventListener("mousemove", Pe), document.addEventListener("mouseup", Le), r.value && r.value.removeEventListener("scroll", oe), se.value = 0, ve.value = 0, f.value.length > 0 && Ee()) : (document.removeEventListener("mousemove", Pe), document.removeEventListener("mouseup", Le), r.value && c.value && (M.value && M.value.width !== void 0 ? i.value = M.value.width : i.value = c.value.clientWidth, r.value.removeEventListener("scroll", oe), r.value.addEventListener("scroll", oe, { passive: !0 }), f.value.length > 0 && (y.value = ue(h.value, i.value), z(f.value), S.value = r.value.scrollTop, H.value = r.value.clientHeight, I())));
|
|
1536
1601
|
});
|
|
1537
|
-
}, { immediate: !0 }), te(le, (
|
|
1538
|
-
|
|
1539
|
-
}), te(() =>
|
|
1540
|
-
|
|
1541
|
-
}), te(
|
|
1542
|
-
n && (n.disconnect(), n = null),
|
|
1543
|
-
if (!
|
|
1544
|
-
for (const
|
|
1545
|
-
const
|
|
1546
|
-
i.value !==
|
|
1602
|
+
}, { immediate: !0 }), te(le, (u) => {
|
|
1603
|
+
u && (u.addEventListener("touchstart", Ae, { passive: !1 }), u.addEventListener("touchmove", Re, { passive: !1 }), u.addEventListener("touchend", We), u.addEventListener("mousedown", Oe));
|
|
1604
|
+
}), te(() => f.value.length, (u, B) => {
|
|
1605
|
+
P.value && u > 0 && B === 0 && (se.value = 0, _(() => Ee()));
|
|
1606
|
+
}), te(c, (u) => {
|
|
1607
|
+
n && (n.disconnect(), n = null), u && typeof ResizeObserver < "u" ? (n = new ResizeObserver((B) => {
|
|
1608
|
+
if (!M.value)
|
|
1609
|
+
for (const R of B) {
|
|
1610
|
+
const G = R.contentRect.width, W = R.contentRect.height;
|
|
1611
|
+
i.value !== G && (i.value = G), x.value !== W && (x.value = W);
|
|
1547
1612
|
}
|
|
1548
|
-
}), n.observe(
|
|
1549
|
-
}, { immediate: !0 }), te(i, (
|
|
1550
|
-
|
|
1551
|
-
|
|
1613
|
+
}), n.observe(u), M.value || (i.value = u.clientWidth, x.value = u.clientHeight)) : u && (M.value || (i.value = u.clientWidth, x.value = u.clientHeight));
|
|
1614
|
+
}, { immediate: !0 }), te(i, (u, B) => {
|
|
1615
|
+
u !== B && u > 0 && !P.value && r.value && f.value.length > 0 && _(() => {
|
|
1616
|
+
y.value = ue(h.value, u), z(f.value), I();
|
|
1552
1617
|
});
|
|
1553
1618
|
}), tt(async () => {
|
|
1554
1619
|
try {
|
|
1555
|
-
await
|
|
1556
|
-
const
|
|
1557
|
-
if (
|
|
1558
|
-
await Te(
|
|
1559
|
-
else if (
|
|
1560
|
-
const
|
|
1561
|
-
await
|
|
1620
|
+
await _(), c.value && !n && (i.value = c.value.clientWidth, x.value = c.value.clientHeight), P.value || (y.value = ue(h.value, i.value), r.value && (S.value = r.value.scrollTop, H.value = r.value.clientHeight));
|
|
1621
|
+
const u = a.loadAtPage;
|
|
1622
|
+
if (g.value = [u], !a.skipInitialLoad)
|
|
1623
|
+
await _(), await Te(g.value[0]);
|
|
1624
|
+
else if (a.items && a.items.length > 0) {
|
|
1625
|
+
const B = a.initialPage !== null && a.initialPage !== void 0 ? a.initialPage : a.loadAtPage, R = a.initialNextPage !== void 0 ? a.initialNextPage : void 0;
|
|
1626
|
+
await ke(a.items, B, R), we = !0;
|
|
1562
1627
|
}
|
|
1563
|
-
|
|
1564
|
-
} catch (
|
|
1565
|
-
|
|
1628
|
+
P.value ? _(() => Ee()) : I();
|
|
1629
|
+
} catch (u) {
|
|
1630
|
+
v.value || (console.error("Error during component initialization:", u), v.value = me(u)), d.value = !1;
|
|
1566
1631
|
}
|
|
1567
|
-
window.addEventListener("resize", Ce), window.addEventListener("resize",
|
|
1632
|
+
window.addEventListener("resize", Ce), window.addEventListener("resize", Ve);
|
|
1568
1633
|
}), at(() => {
|
|
1569
|
-
var
|
|
1570
|
-
n && (n.disconnect(), n = null), (
|
|
1571
|
-
}), (
|
|
1634
|
+
var u;
|
|
1635
|
+
n && (n.disconnect(), n = null), (u = r.value) == null || u.removeEventListener("scroll", oe), window.removeEventListener("resize", Ce), window.removeEventListener("resize", Ve), le.value && (le.value.removeEventListener("touchstart", Ae), le.value.removeEventListener("touchmove", Re), le.value.removeEventListener("touchend", We), le.value.removeEventListener("mousedown", Oe)), document.removeEventListener("mousemove", Pe), document.removeEventListener("mouseup", Le);
|
|
1636
|
+
}), (u, B) => (Y(), q("div", {
|
|
1572
1637
|
ref_key: "wrapper",
|
|
1573
|
-
ref:
|
|
1638
|
+
ref: c,
|
|
1574
1639
|
class: "w-full h-full flex flex-col relative"
|
|
1575
1640
|
}, [
|
|
1576
|
-
|
|
1641
|
+
P.value ? (Y(), q("div", {
|
|
1577
1642
|
key: 0,
|
|
1578
|
-
class:
|
|
1643
|
+
class: ie(["overflow-hidden w-full flex-1 swipe-container touch-none select-none", { "force-motion": a.forceMotion, "cursor-grab": !X(ye), "cursor-grabbing": X(ye) }]),
|
|
1579
1644
|
ref_key: "swipeContainer",
|
|
1580
1645
|
ref: le,
|
|
1581
1646
|
style: { height: "100%", "max-height": "100%", position: "relative" }
|
|
1582
1647
|
}, [
|
|
1583
|
-
|
|
1648
|
+
U("div", {
|
|
1584
1649
|
class: "relative w-full",
|
|
1585
1650
|
style: ge({
|
|
1586
|
-
transform: `translateY(${
|
|
1587
|
-
transition:
|
|
1588
|
-
height: `${
|
|
1651
|
+
transform: `translateY(${X(ve)}px)`,
|
|
1652
|
+
transition: X(ye) ? "none" : `transform ${e.transitionDurationMs}ms ${e.transitionEasing}`,
|
|
1653
|
+
height: `${f.value.length * 100}%`
|
|
1589
1654
|
})
|
|
1590
1655
|
}, [
|
|
1591
|
-
(
|
|
1592
|
-
key: `${
|
|
1656
|
+
(Y(!0), q(Ue, null, _e(f.value, (R, G) => (Y(), q("div", {
|
|
1657
|
+
key: `${R.page}-${R.id}`,
|
|
1593
1658
|
class: "absolute top-0 left-0 w-full",
|
|
1594
1659
|
style: ge({
|
|
1595
|
-
top: `${
|
|
1596
|
-
height: `${100 /
|
|
1660
|
+
top: `${G * (100 / f.value.length)}%`,
|
|
1661
|
+
height: `${100 / f.value.length}%`
|
|
1597
1662
|
})
|
|
1598
1663
|
}, [
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
item:
|
|
1603
|
-
remove:
|
|
1604
|
-
index:
|
|
1664
|
+
U("div", pa, [
|
|
1665
|
+
U("div", ya, [
|
|
1666
|
+
J(u.$slots, "default", {
|
|
1667
|
+
item: R,
|
|
1668
|
+
remove: X(ce),
|
|
1669
|
+
index: R.originalIndex ?? f.value.indexOf(R)
|
|
1605
1670
|
}, () => [
|
|
1606
1671
|
He(Me, {
|
|
1607
|
-
item:
|
|
1608
|
-
remove:
|
|
1609
|
-
"header-height":
|
|
1610
|
-
"footer-height":
|
|
1672
|
+
item: R,
|
|
1673
|
+
remove: X(ce),
|
|
1674
|
+
"header-height": h.value.header,
|
|
1675
|
+
"footer-height": h.value.footer,
|
|
1611
1676
|
"in-swipe-mode": !0,
|
|
1612
|
-
"is-active":
|
|
1613
|
-
"onPreload:success":
|
|
1614
|
-
"onPreload:error":
|
|
1615
|
-
onMouseEnter:
|
|
1616
|
-
onMouseLeave:
|
|
1677
|
+
"is-active": G === X(se),
|
|
1678
|
+
"onPreload:success": B[0] || (B[0] = (W) => T("item:preload:success", W)),
|
|
1679
|
+
"onPreload:error": B[1] || (B[1] = (W) => T("item:preload:error", W)),
|
|
1680
|
+
onMouseEnter: B[2] || (B[2] = (W) => T("item:mouse-enter", W)),
|
|
1681
|
+
onMouseLeave: B[3] || (B[3] = (W) => T("item:mouse-leave", W))
|
|
1617
1682
|
}, {
|
|
1618
|
-
header: fe((
|
|
1619
|
-
|
|
1683
|
+
header: fe((W) => [
|
|
1684
|
+
J(u.$slots, "item-header", de({ ref_for: !0 }, W), void 0, !0)
|
|
1620
1685
|
]),
|
|
1621
|
-
footer: fe((
|
|
1622
|
-
|
|
1686
|
+
footer: fe((W) => [
|
|
1687
|
+
J(u.$slots, "item-footer", de({ ref_for: !0 }, W), void 0, !0)
|
|
1623
1688
|
]),
|
|
1624
1689
|
_: 2
|
|
1625
1690
|
}, 1032, ["item", "remove", "header-height", "footer-height", "is-active"])
|
|
@@ -1628,62 +1693,62 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1628
1693
|
])
|
|
1629
1694
|
], 4))), 128))
|
|
1630
1695
|
], 4),
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1696
|
+
p.value && f.value.length > 0 ? (Y(), q("div", wa, [
|
|
1697
|
+
J(u.$slots, "end-message", {}, () => [
|
|
1698
|
+
B[8] || (B[8] = U("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
|
|
1634
1699
|
], !0)
|
|
1635
1700
|
])) : ae("", !0),
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1701
|
+
v.value && f.value.length > 0 ? (Y(), q("div", xa, [
|
|
1702
|
+
J(u.$slots, "error-message", { error: v.value }, () => [
|
|
1703
|
+
U("p", ba, "Failed to load content: " + Ne(v.value.message), 1)
|
|
1639
1704
|
], !0)
|
|
1640
1705
|
])) : ae("", !0)
|
|
1641
|
-
], 2)) : (
|
|
1706
|
+
], 2)) : (Y(), q("div", {
|
|
1642
1707
|
key: 1,
|
|
1643
|
-
class:
|
|
1708
|
+
class: ie(["overflow-auto w-full flex-1 masonry-container", { "force-motion": a.forceMotion }]),
|
|
1644
1709
|
ref_key: "container",
|
|
1645
|
-
ref:
|
|
1710
|
+
ref: r
|
|
1646
1711
|
}, [
|
|
1647
|
-
|
|
1712
|
+
U("div", {
|
|
1648
1713
|
class: "relative",
|
|
1649
|
-
style: ge({ height: `${
|
|
1714
|
+
style: ge({ height: `${L.value}px`, "--masonry-duration": `${e.transitionDurationMs}ms`, "--masonry-leave-duration": `${e.leaveDurationMs}ms`, "--masonry-ease": e.transitionEasing })
|
|
1650
1715
|
}, [
|
|
1651
1716
|
He(Tt, {
|
|
1652
1717
|
name: "masonry",
|
|
1653
1718
|
css: !1,
|
|
1654
|
-
onEnter:
|
|
1655
|
-
onBeforeEnter:
|
|
1656
|
-
onLeave:
|
|
1657
|
-
onBeforeLeave:
|
|
1719
|
+
onEnter: X(ot),
|
|
1720
|
+
onBeforeEnter: X(it),
|
|
1721
|
+
onLeave: X(st),
|
|
1722
|
+
onBeforeLeave: X(rt)
|
|
1658
1723
|
}, {
|
|
1659
1724
|
default: fe(() => [
|
|
1660
|
-
(
|
|
1661
|
-
key: `${
|
|
1725
|
+
(Y(!0), q(Ue, null, _e(X(C), (R, G) => (Y(), q("div", de({
|
|
1726
|
+
key: `${R.page}-${R.id}`,
|
|
1662
1727
|
class: "absolute masonry-item",
|
|
1663
1728
|
ref_for: !0
|
|
1664
|
-
},
|
|
1665
|
-
|
|
1666
|
-
item:
|
|
1667
|
-
remove:
|
|
1668
|
-
index:
|
|
1729
|
+
}, X(Zt)(R, G)), [
|
|
1730
|
+
J(u.$slots, "default", {
|
|
1731
|
+
item: R,
|
|
1732
|
+
remove: X(ce),
|
|
1733
|
+
index: R.originalIndex ?? f.value.indexOf(R)
|
|
1669
1734
|
}, () => [
|
|
1670
1735
|
He(Me, {
|
|
1671
|
-
item:
|
|
1672
|
-
remove:
|
|
1673
|
-
"header-height":
|
|
1674
|
-
"footer-height":
|
|
1736
|
+
item: R,
|
|
1737
|
+
remove: X(ce),
|
|
1738
|
+
"header-height": h.value.header,
|
|
1739
|
+
"footer-height": h.value.footer,
|
|
1675
1740
|
"in-swipe-mode": !1,
|
|
1676
1741
|
"is-active": !1,
|
|
1677
|
-
"onPreload:success":
|
|
1678
|
-
"onPreload:error":
|
|
1679
|
-
onMouseEnter:
|
|
1680
|
-
onMouseLeave:
|
|
1742
|
+
"onPreload:success": B[4] || (B[4] = (W) => T("item:preload:success", W)),
|
|
1743
|
+
"onPreload:error": B[5] || (B[5] = (W) => T("item:preload:error", W)),
|
|
1744
|
+
onMouseEnter: B[6] || (B[6] = (W) => T("item:mouse-enter", W)),
|
|
1745
|
+
onMouseLeave: B[7] || (B[7] = (W) => T("item:mouse-leave", W))
|
|
1681
1746
|
}, {
|
|
1682
|
-
header: fe((
|
|
1683
|
-
|
|
1747
|
+
header: fe((W) => [
|
|
1748
|
+
J(u.$slots, "item-header", de({ ref_for: !0 }, W), void 0, !0)
|
|
1684
1749
|
]),
|
|
1685
|
-
footer: fe((
|
|
1686
|
-
|
|
1750
|
+
footer: fe((W) => [
|
|
1751
|
+
J(u.$slots, "item-footer", de({ ref_for: !0 }, W), void 0, !0)
|
|
1687
1752
|
]),
|
|
1688
1753
|
_: 2
|
|
1689
1754
|
}, 1032, ["item", "remove", "header-height", "footer-height"])
|
|
@@ -1693,25 +1758,25 @@ const sa = { class: "flex-1 relative min-h-0" }, ua = { class: "w-full h-full ro
|
|
|
1693
1758
|
_: 3
|
|
1694
1759
|
}, 8, ["onEnter", "onBeforeEnter", "onLeave", "onBeforeLeave"])
|
|
1695
1760
|
], 4),
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1761
|
+
p.value && f.value.length > 0 ? (Y(), q("div", Ma, [
|
|
1762
|
+
J(u.$slots, "end-message", {}, () => [
|
|
1763
|
+
B[9] || (B[9] = U("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
|
|
1699
1764
|
], !0)
|
|
1700
1765
|
])) : ae("", !0),
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1766
|
+
v.value && f.value.length > 0 ? (Y(), q("div", Ta, [
|
|
1767
|
+
J(u.$slots, "error-message", { error: v.value }, () => [
|
|
1768
|
+
U("p", Ia, "Failed to load content: " + Ne(v.value.message), 1)
|
|
1704
1769
|
], !0)
|
|
1705
1770
|
])) : ae("", !0)
|
|
1706
1771
|
], 2))
|
|
1707
1772
|
], 512));
|
|
1708
1773
|
}
|
|
1709
|
-
}),
|
|
1710
|
-
const
|
|
1711
|
-
for (const [
|
|
1712
|
-
|
|
1713
|
-
return
|
|
1714
|
-
}, Ze = /* @__PURE__ */
|
|
1774
|
+
}), La = (e, l) => {
|
|
1775
|
+
const o = e.__vccOpts || e;
|
|
1776
|
+
for (const [a, m] of l)
|
|
1777
|
+
o[a] = m;
|
|
1778
|
+
return o;
|
|
1779
|
+
}, Ze = /* @__PURE__ */ La(Pa, [["__scopeId", "data-v-84ab92bd"]]), Ha = {
|
|
1715
1780
|
install(e) {
|
|
1716
1781
|
e.component("WyxosMasonry", Ze), e.component("WMasonry", Ze), e.component("WyxosMasonryItem", Me), e.component("WMasonryItem", Me);
|
|
1717
1782
|
}
|