@wyxos/vibe 1.6.19 → 1.6.20
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 +681 -647
- package/lib/vibe.css +1 -1
- package/package.json +1 -1
- package/src/Masonry.vue +140 -13
- package/src/components/MasonryItem.vue +431 -431
- package/src/useMasonryScroll.ts +60 -60
package/lib/index.js
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { nextTick as
|
|
2
|
-
let
|
|
3
|
-
function
|
|
4
|
-
if (
|
|
1
|
+
import { nextTick as G, defineComponent as lt, ref as T, computed as te, onMounted as rt, onUnmounted as ot, watch as oe, createElementBlock as B, openBlock as D, createCommentVNode as le, createElementVNode as j, normalizeStyle as Me, renderSlot as ee, normalizeClass as de, withModifiers as Xe, toDisplayString as Ae, Fragment as Je, renderList as Ke, createVNode as He, withCtx as we, mergeProps as xe, TransitionGroup as St, unref as $t } from "vue";
|
|
2
|
+
let Ne = null;
|
|
3
|
+
function Ht() {
|
|
4
|
+
if (Ne != null) return Ne;
|
|
5
5
|
const t = document.createElement("div");
|
|
6
6
|
t.style.visibility = "hidden", t.style.overflow = "scroll", t.style.msOverflowStyle = "scrollbar", t.style.width = "100px", t.style.height = "100px", document.body.appendChild(t);
|
|
7
7
|
const v = document.createElement("div");
|
|
8
8
|
v.style.width = "100%", t.appendChild(v);
|
|
9
9
|
const c = t.offsetWidth - v.offsetWidth;
|
|
10
|
-
return document.body.removeChild(t),
|
|
10
|
+
return document.body.removeChild(t), Ne = c, c;
|
|
11
11
|
}
|
|
12
|
-
function
|
|
12
|
+
function Qe(t, v, c, i = {}) {
|
|
13
13
|
const {
|
|
14
|
-
gutterX:
|
|
14
|
+
gutterX: I = 0,
|
|
15
15
|
gutterY: p = 0,
|
|
16
|
-
header:
|
|
17
|
-
footer:
|
|
18
|
-
paddingLeft:
|
|
16
|
+
header: r = 0,
|
|
17
|
+
footer: u = 0,
|
|
18
|
+
paddingLeft: x = 0,
|
|
19
19
|
paddingRight: E = 0,
|
|
20
20
|
sizes: S = {
|
|
21
21
|
base: 1,
|
|
@@ -25,195 +25,195 @@ function Xe(t, v, c, r = {}) {
|
|
|
25
25
|
xl: 5,
|
|
26
26
|
"2xl": 6
|
|
27
27
|
},
|
|
28
|
-
placement:
|
|
29
|
-
} =
|
|
30
|
-
let d = 0,
|
|
28
|
+
placement: k = "masonry"
|
|
29
|
+
} = i;
|
|
30
|
+
let d = 0, A = 0;
|
|
31
31
|
try {
|
|
32
32
|
if (v && v.nodeType === 1 && typeof window < "u" && window.getComputedStyle) {
|
|
33
33
|
const w = window.getComputedStyle(v);
|
|
34
|
-
d = parseFloat(w.paddingLeft) || 0,
|
|
34
|
+
d = parseFloat(w.paddingLeft) || 0, A = parseFloat(w.paddingRight) || 0;
|
|
35
35
|
}
|
|
36
36
|
} catch {
|
|
37
37
|
}
|
|
38
|
-
const
|
|
39
|
-
const M = w.width,
|
|
40
|
-
return Math.round(
|
|
38
|
+
const C = (x || 0) + d, U = (E || 0) + A, g = v.offsetWidth - v.clientWidth, o = g > 0 ? g + 2 : Ht() + 2, P = v.offsetWidth - o - C - U, y = I * (c - 1), b = Math.floor((P - y) / c), H = t.map((w) => {
|
|
39
|
+
const M = w.width, q = w.height;
|
|
40
|
+
return Math.round(b * q / M) + u + r;
|
|
41
41
|
});
|
|
42
|
-
if (
|
|
42
|
+
if (k === "sequential-balanced") {
|
|
43
43
|
const w = H.length;
|
|
44
44
|
if (w === 0) return [];
|
|
45
|
-
const M = (
|
|
46
|
-
let
|
|
47
|
-
const f = (
|
|
48
|
-
let
|
|
49
|
-
for (let
|
|
50
|
-
const
|
|
51
|
-
if (
|
|
52
|
-
|
|
53
|
-
else if (
|
|
45
|
+
const M = (L, O, Q) => L + (O > 0 ? p : 0) + Q;
|
|
46
|
+
let q = Math.max(...H), n = H.reduce((L, O) => L + O, 0) + p * Math.max(0, w - 1);
|
|
47
|
+
const f = (L) => {
|
|
48
|
+
let O = 1, Q = 0, J = 0;
|
|
49
|
+
for (let K = 0; K < w; K++) {
|
|
50
|
+
const ae = H[K], ne = M(Q, J, ae);
|
|
51
|
+
if (ne <= L)
|
|
52
|
+
Q = ne, J++;
|
|
53
|
+
else if (O++, Q = ae, J = 1, ae > L || O > c) return !1;
|
|
54
54
|
}
|
|
55
|
-
return
|
|
55
|
+
return O <= c;
|
|
56
56
|
};
|
|
57
|
-
for (;
|
|
58
|
-
const
|
|
59
|
-
f(
|
|
57
|
+
for (; q < n; ) {
|
|
58
|
+
const L = Math.floor((q + n) / 2);
|
|
59
|
+
f(L) ? n = L : q = L + 1;
|
|
60
60
|
}
|
|
61
|
-
const
|
|
62
|
-
let
|
|
63
|
-
for (let
|
|
64
|
-
const
|
|
65
|
-
!(M(
|
|
61
|
+
const $ = n, R = new Array(c).fill(0);
|
|
62
|
+
let X = c - 1, Y = 0, N = 0;
|
|
63
|
+
for (let L = w - 1; L >= 0; L--) {
|
|
64
|
+
const O = H[L], Q = L < X;
|
|
65
|
+
!(M(Y, N, O) <= $) || Q ? (R[X] = L + 1, X--, Y = O, N = 1) : (Y = M(Y, N, O), N++);
|
|
66
66
|
}
|
|
67
|
-
|
|
68
|
-
const
|
|
69
|
-
for (let
|
|
70
|
-
const
|
|
71
|
-
for (let
|
|
72
|
-
const
|
|
73
|
-
...t[
|
|
74
|
-
columnWidth:
|
|
67
|
+
R[0] = 0;
|
|
68
|
+
const ie = [], se = new Array(c).fill(0);
|
|
69
|
+
for (let L = 0; L < c; L++) {
|
|
70
|
+
const O = R[L], Q = L + 1 < c ? R[L + 1] : w, J = L * (b + I);
|
|
71
|
+
for (let K = O; K < Q; K++) {
|
|
72
|
+
const ne = {
|
|
73
|
+
...t[K],
|
|
74
|
+
columnWidth: b,
|
|
75
75
|
imageHeight: 0,
|
|
76
76
|
columnHeight: 0,
|
|
77
77
|
left: 0,
|
|
78
78
|
top: 0
|
|
79
79
|
};
|
|
80
|
-
|
|
80
|
+
ne.imageHeight = H[K] - (u + r), ne.columnHeight = H[K], ne.left = J, ne.top = se[L], se[L] += ne.columnHeight + (K + 1 < Q ? p : 0), ie.push(ne);
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
|
-
return
|
|
83
|
+
return ie;
|
|
84
84
|
}
|
|
85
|
-
const h = new Array(c).fill(0),
|
|
85
|
+
const h = new Array(c).fill(0), z = [];
|
|
86
86
|
for (let w = 0; w < t.length; w++) {
|
|
87
|
-
const M = t[w],
|
|
87
|
+
const M = t[w], q = {
|
|
88
88
|
...M,
|
|
89
89
|
columnWidth: 0,
|
|
90
90
|
imageHeight: 0,
|
|
91
91
|
columnHeight: 0,
|
|
92
92
|
left: 0,
|
|
93
93
|
top: 0
|
|
94
|
-
}, n = h.indexOf(Math.min(...h)), f = M.width,
|
|
95
|
-
|
|
94
|
+
}, n = h.indexOf(Math.min(...h)), f = M.width, $ = M.height;
|
|
95
|
+
q.columnWidth = b, q.left = n * (b + I), q.imageHeight = Math.round(b * $ / f), q.columnHeight = q.imageHeight + u + r, q.top = h[n], h[n] += q.columnHeight + p, z.push(q);
|
|
96
96
|
}
|
|
97
|
-
return
|
|
97
|
+
return z;
|
|
98
98
|
}
|
|
99
|
-
var
|
|
100
|
-
function
|
|
101
|
-
var v =
|
|
99
|
+
var Nt = typeof global == "object" && global && global.Object === Object && global, Ft = typeof self == "object" && self && self.Object === Object && self, it = Nt || Ft || Function("return this")(), Te = it.Symbol, st = Object.prototype, At = st.hasOwnProperty, Wt = st.toString, be = Te ? Te.toStringTag : void 0;
|
|
100
|
+
function Bt(t) {
|
|
101
|
+
var v = At.call(t, be), c = t[be];
|
|
102
102
|
try {
|
|
103
|
-
t[
|
|
104
|
-
var
|
|
103
|
+
t[be] = void 0;
|
|
104
|
+
var i = !0;
|
|
105
105
|
} catch {
|
|
106
106
|
}
|
|
107
|
-
var
|
|
108
|
-
return
|
|
107
|
+
var I = Wt.call(t);
|
|
108
|
+
return i && (v ? t[be] = c : delete t[be]), I;
|
|
109
109
|
}
|
|
110
|
-
var
|
|
111
|
-
function
|
|
112
|
-
return
|
|
110
|
+
var Dt = Object.prototype, zt = Dt.toString;
|
|
111
|
+
function Ot(t) {
|
|
112
|
+
return zt.call(t);
|
|
113
113
|
}
|
|
114
|
-
var
|
|
115
|
-
function
|
|
116
|
-
return t == null ? t === void 0 ?
|
|
114
|
+
var Rt = "[object Null]", jt = "[object Undefined]", Ze = Te ? Te.toStringTag : void 0;
|
|
115
|
+
function Ct(t) {
|
|
116
|
+
return t == null ? t === void 0 ? jt : Rt : Ze && Ze in Object(t) ? Bt(t) : Ot(t);
|
|
117
117
|
}
|
|
118
|
-
function
|
|
118
|
+
function qt(t) {
|
|
119
119
|
return t != null && typeof t == "object";
|
|
120
120
|
}
|
|
121
|
-
var
|
|
122
|
-
function
|
|
123
|
-
return typeof t == "symbol" ||
|
|
121
|
+
var Yt = "[object Symbol]";
|
|
122
|
+
function Vt(t) {
|
|
123
|
+
return typeof t == "symbol" || qt(t) && Ct(t) == Yt;
|
|
124
124
|
}
|
|
125
|
-
var
|
|
126
|
-
function
|
|
127
|
-
for (var v = t.length; v-- &&
|
|
125
|
+
var Ut = /\s/;
|
|
126
|
+
function _t(t) {
|
|
127
|
+
for (var v = t.length; v-- && Ut.test(t.charAt(v)); )
|
|
128
128
|
;
|
|
129
129
|
return v;
|
|
130
130
|
}
|
|
131
|
-
var
|
|
132
|
-
function
|
|
133
|
-
return t && t.slice(0,
|
|
131
|
+
var Gt = /^\s+/;
|
|
132
|
+
function Xt(t) {
|
|
133
|
+
return t && t.slice(0, _t(t) + 1).replace(Gt, "");
|
|
134
134
|
}
|
|
135
|
-
function
|
|
135
|
+
function We(t) {
|
|
136
136
|
var v = typeof t;
|
|
137
137
|
return t != null && (v == "object" || v == "function");
|
|
138
138
|
}
|
|
139
|
-
var
|
|
140
|
-
function
|
|
139
|
+
var et = NaN, Jt = /^[-+]0x[0-9a-f]+$/i, Kt = /^0b[01]+$/i, Qt = /^0o[0-7]+$/i, Zt = parseInt;
|
|
140
|
+
function tt(t) {
|
|
141
141
|
if (typeof t == "number")
|
|
142
142
|
return t;
|
|
143
|
-
if (
|
|
144
|
-
return
|
|
145
|
-
if (
|
|
143
|
+
if (Vt(t))
|
|
144
|
+
return et;
|
|
145
|
+
if (We(t)) {
|
|
146
146
|
var v = typeof t.valueOf == "function" ? t.valueOf() : t;
|
|
147
|
-
t =
|
|
147
|
+
t = We(v) ? v + "" : v;
|
|
148
148
|
}
|
|
149
149
|
if (typeof t != "string")
|
|
150
150
|
return t === 0 ? t : +t;
|
|
151
|
-
t =
|
|
152
|
-
var c =
|
|
153
|
-
return c ||
|
|
151
|
+
t = Xt(t);
|
|
152
|
+
var c = Kt.test(t);
|
|
153
|
+
return c || Qt.test(t) ? Zt(t.slice(2), c ? 2 : 8) : Jt.test(t) ? et : +t;
|
|
154
154
|
}
|
|
155
|
-
var
|
|
156
|
-
return
|
|
157
|
-
},
|
|
158
|
-
function
|
|
159
|
-
var
|
|
155
|
+
var Fe = function() {
|
|
156
|
+
return it.Date.now();
|
|
157
|
+
}, ea = "Expected a function", ta = Math.max, aa = Math.min;
|
|
158
|
+
function at(t, v, c) {
|
|
159
|
+
var i, I, p, r, u, x, E = 0, S = !1, k = !1, d = !0;
|
|
160
160
|
if (typeof t != "function")
|
|
161
|
-
throw new TypeError(
|
|
162
|
-
v =
|
|
163
|
-
function
|
|
164
|
-
var
|
|
165
|
-
return
|
|
161
|
+
throw new TypeError(ea);
|
|
162
|
+
v = tt(v) || 0, We(c) && (S = !!c.leading, k = "maxWait" in c, p = k ? ta(tt(c.maxWait) || 0, v) : p, d = "trailing" in c ? !!c.trailing : d);
|
|
163
|
+
function A(h) {
|
|
164
|
+
var z = i, w = I;
|
|
165
|
+
return i = I = void 0, E = h, r = t.apply(w, z), r;
|
|
166
166
|
}
|
|
167
|
-
function
|
|
168
|
-
return E = h,
|
|
167
|
+
function C(h) {
|
|
168
|
+
return E = h, u = setTimeout(o, v), S ? A(h) : r;
|
|
169
169
|
}
|
|
170
|
-
function
|
|
171
|
-
var
|
|
172
|
-
return
|
|
170
|
+
function U(h) {
|
|
171
|
+
var z = h - x, w = h - E, M = v - z;
|
|
172
|
+
return k ? aa(M, p - w) : M;
|
|
173
173
|
}
|
|
174
174
|
function g(h) {
|
|
175
|
-
var
|
|
176
|
-
return
|
|
175
|
+
var z = h - x, w = h - E;
|
|
176
|
+
return x === void 0 || z >= v || z < 0 || k && w >= p;
|
|
177
177
|
}
|
|
178
178
|
function o() {
|
|
179
|
-
var h =
|
|
179
|
+
var h = Fe();
|
|
180
180
|
if (g(h))
|
|
181
|
-
return
|
|
182
|
-
|
|
181
|
+
return P(h);
|
|
182
|
+
u = setTimeout(o, U(h));
|
|
183
183
|
}
|
|
184
|
-
function
|
|
185
|
-
return
|
|
184
|
+
function P(h) {
|
|
185
|
+
return u = void 0, d && i ? A(h) : (i = I = void 0, r);
|
|
186
186
|
}
|
|
187
187
|
function y() {
|
|
188
|
-
|
|
188
|
+
u !== void 0 && clearTimeout(u), E = 0, i = x = I = u = void 0;
|
|
189
189
|
}
|
|
190
|
-
function
|
|
191
|
-
return
|
|
190
|
+
function b() {
|
|
191
|
+
return u === void 0 ? r : P(Fe());
|
|
192
192
|
}
|
|
193
193
|
function H() {
|
|
194
|
-
var h =
|
|
195
|
-
if (
|
|
196
|
-
if (
|
|
197
|
-
return
|
|
198
|
-
if (
|
|
199
|
-
return clearTimeout(
|
|
194
|
+
var h = Fe(), z = g(h);
|
|
195
|
+
if (i = arguments, I = this, x = h, z) {
|
|
196
|
+
if (u === void 0)
|
|
197
|
+
return C(x);
|
|
198
|
+
if (k)
|
|
199
|
+
return clearTimeout(u), u = setTimeout(o, v), A(x);
|
|
200
200
|
}
|
|
201
|
-
return
|
|
201
|
+
return u === void 0 && (u = setTimeout(o, v)), r;
|
|
202
202
|
}
|
|
203
|
-
return H.cancel = y, H.flush =
|
|
203
|
+
return H.cancel = y, H.flush = b, H;
|
|
204
204
|
}
|
|
205
|
-
function
|
|
206
|
-
const c = v ?? (typeof window < "u" ? window.innerWidth : 1024),
|
|
207
|
-
return c >= 1536 &&
|
|
205
|
+
function he(t, v) {
|
|
206
|
+
const c = v ?? (typeof window < "u" ? window.innerWidth : 1024), i = t.sizes;
|
|
207
|
+
return c >= 1536 && i["2xl"] ? i["2xl"] : c >= 1280 && i.xl ? i.xl : c >= 1024 && i.lg ? i.lg : c >= 768 && i.md ? i.md : c >= 640 && i.sm ? i.sm : i.base;
|
|
208
208
|
}
|
|
209
|
-
function
|
|
209
|
+
function na(t) {
|
|
210
210
|
const v = t ?? (typeof window < "u" ? window.innerWidth : 1024);
|
|
211
211
|
return v >= 1536 ? "2xl" : v >= 1280 ? "xl" : v >= 1024 ? "lg" : v >= 768 ? "md" : v >= 640 ? "sm" : "base";
|
|
212
212
|
}
|
|
213
|
-
function
|
|
214
|
-
return t.reduce((c,
|
|
213
|
+
function la(t) {
|
|
214
|
+
return t.reduce((c, i) => Math.max(c, i.top + i.columnHeight), 0) + 500;
|
|
215
215
|
}
|
|
216
|
-
function
|
|
216
|
+
function ra(t) {
|
|
217
217
|
return {
|
|
218
218
|
transform: `translate3d(${t.left}px, ${t.top}px, 0)`,
|
|
219
219
|
top: "0px",
|
|
@@ -222,114 +222,114 @@ function ea(t) {
|
|
|
222
222
|
height: `${t.columnHeight}px`
|
|
223
223
|
};
|
|
224
224
|
}
|
|
225
|
-
function
|
|
225
|
+
function oa(t, v = 0) {
|
|
226
226
|
return {
|
|
227
|
-
style:
|
|
227
|
+
style: ra(t),
|
|
228
228
|
"data-top": t.top,
|
|
229
229
|
"data-left": t.left,
|
|
230
230
|
"data-id": `${t.page}-${t.id}`,
|
|
231
231
|
"data-index": v
|
|
232
232
|
};
|
|
233
233
|
}
|
|
234
|
-
function
|
|
234
|
+
function Be(t, v) {
|
|
235
235
|
if (!t.length || v <= 0)
|
|
236
236
|
return new Array(Math.max(1, v)).fill(0);
|
|
237
|
-
const
|
|
238
|
-
for (let
|
|
239
|
-
const p = new Array(
|
|
240
|
-
for (const
|
|
241
|
-
const
|
|
242
|
-
|
|
237
|
+
const i = Array.from(new Set(t.map((r) => r.left))).sort((r, u) => r - u).slice(0, v), I = /* @__PURE__ */ new Map();
|
|
238
|
+
for (let r = 0; r < i.length; r++) I.set(i[r], r);
|
|
239
|
+
const p = new Array(i.length).fill(0);
|
|
240
|
+
for (const r of t) {
|
|
241
|
+
const u = I.get(r.left);
|
|
242
|
+
u != null && (p[u] = Math.max(p[u], r.top + r.columnHeight));
|
|
243
243
|
}
|
|
244
244
|
for (; p.length < v; ) p.push(0);
|
|
245
245
|
return p;
|
|
246
246
|
}
|
|
247
|
-
function
|
|
248
|
-
function c(
|
|
249
|
-
const
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
const
|
|
253
|
-
d ?
|
|
247
|
+
function ia(t, v) {
|
|
248
|
+
function c(r, u) {
|
|
249
|
+
const x = parseInt(r.dataset.left || "0", 10), E = parseInt(r.dataset.top || "0", 10), S = parseInt(r.dataset.index || "0", 10), k = Math.min(S * 20, 160), d = r.style.getPropertyValue("--masonry-opacity-delay");
|
|
250
|
+
r.style.setProperty("--masonry-opacity-delay", `${k}ms`), requestAnimationFrame(() => {
|
|
251
|
+
r.style.opacity = "1", r.style.transform = `translate3d(${x}px, ${E}px, 0) scale(1)`;
|
|
252
|
+
const A = () => {
|
|
253
|
+
d ? r.style.setProperty("--masonry-opacity-delay", d) : r.style.removeProperty("--masonry-opacity-delay"), r.removeEventListener("transitionend", A), u();
|
|
254
254
|
};
|
|
255
|
-
|
|
255
|
+
r.addEventListener("transitionend", A);
|
|
256
256
|
});
|
|
257
257
|
}
|
|
258
|
-
function r
|
|
259
|
-
const
|
|
260
|
-
|
|
258
|
+
function i(r) {
|
|
259
|
+
const u = parseInt(r.dataset.left || "0", 10), x = parseInt(r.dataset.top || "0", 10);
|
|
260
|
+
r.style.opacity = "0", r.style.transform = `translate3d(${u}px, ${x + 10}px, 0) scale(0.985)`;
|
|
261
261
|
}
|
|
262
|
-
function
|
|
263
|
-
const
|
|
264
|
-
|
|
265
|
-
|
|
262
|
+
function I(r) {
|
|
263
|
+
const u = parseInt(r.dataset.left || "0", 10), x = parseInt(r.dataset.top || "0", 10);
|
|
264
|
+
r.style.transition = "none", r.style.opacity = "1", r.style.transform = `translate3d(${u}px, ${x}px, 0) scale(1)`, r.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
|
|
265
|
+
r.style.transition = "";
|
|
266
266
|
});
|
|
267
267
|
}
|
|
268
|
-
function p(
|
|
269
|
-
const
|
|
270
|
-
let
|
|
271
|
-
if (!Number.isFinite(
|
|
272
|
-
const o = getComputedStyle(
|
|
273
|
-
|
|
268
|
+
function p(r, u) {
|
|
269
|
+
const x = parseInt(r.dataset.left || "0", 10), E = parseInt(r.dataset.top || "0", 10), S = typeof (v == null ? void 0 : v.leaveDurationMs) == "number" ? v.leaveDurationMs : NaN;
|
|
270
|
+
let k = Number.isFinite(S) && S > 0 ? S : NaN;
|
|
271
|
+
if (!Number.isFinite(k)) {
|
|
272
|
+
const o = getComputedStyle(r).getPropertyValue("--masonry-leave-duration") || "", P = parseFloat(o);
|
|
273
|
+
k = Number.isFinite(P) && P > 0 ? P : 200;
|
|
274
274
|
}
|
|
275
|
-
const d =
|
|
276
|
-
|
|
277
|
-
},
|
|
278
|
-
(!g || g.target ===
|
|
279
|
-
},
|
|
280
|
-
|
|
281
|
-
},
|
|
275
|
+
const d = r.style.transitionDuration, A = () => {
|
|
276
|
+
r.removeEventListener("transitionend", C), clearTimeout(U), r.style.transitionDuration = d || "";
|
|
277
|
+
}, C = (g) => {
|
|
278
|
+
(!g || g.target === r) && (A(), u());
|
|
279
|
+
}, U = setTimeout(() => {
|
|
280
|
+
A(), u();
|
|
281
|
+
}, k + 100);
|
|
282
282
|
requestAnimationFrame(() => {
|
|
283
|
-
|
|
283
|
+
r.style.transitionDuration = `${k}ms`, r.style.opacity = "0", r.style.transform = `translate3d(${x}px, ${E + 10}px, 0) scale(0.985)`, r.addEventListener("transitionend", C);
|
|
284
284
|
});
|
|
285
285
|
}
|
|
286
286
|
return {
|
|
287
287
|
onEnter: c,
|
|
288
|
-
onBeforeEnter:
|
|
289
|
-
onBeforeLeave:
|
|
288
|
+
onBeforeEnter: i,
|
|
289
|
+
onBeforeLeave: I,
|
|
290
290
|
onLeave: p
|
|
291
291
|
};
|
|
292
292
|
}
|
|
293
|
-
function
|
|
293
|
+
function sa({
|
|
294
294
|
container: t,
|
|
295
295
|
masonry: v,
|
|
296
296
|
columns: c,
|
|
297
|
-
containerHeight:
|
|
298
|
-
isLoading:
|
|
297
|
+
containerHeight: i,
|
|
298
|
+
isLoading: I,
|
|
299
299
|
pageSize: p,
|
|
300
|
-
refreshLayout:
|
|
301
|
-
setItemsRaw:
|
|
302
|
-
loadNext:
|
|
300
|
+
refreshLayout: r,
|
|
301
|
+
setItemsRaw: u,
|
|
302
|
+
loadNext: x,
|
|
303
303
|
loadThresholdPx: E
|
|
304
304
|
}) {
|
|
305
305
|
let S = 0;
|
|
306
|
-
async function
|
|
306
|
+
async function k(d) {
|
|
307
307
|
if (!t.value) return;
|
|
308
|
-
const
|
|
308
|
+
const A = d ?? Be(v.value, c.value), C = A.length ? Math.max(...A) : 0, U = t.value.scrollTop + t.value.clientHeight, g = t.value.scrollTop > S + 1;
|
|
309
309
|
S = t.value.scrollTop;
|
|
310
|
-
const o = typeof E == "number" ? E : 200,
|
|
311
|
-
if (
|
|
312
|
-
await
|
|
310
|
+
const o = typeof E == "number" ? E : 200, P = o >= 0 ? Math.max(0, C - o) : Math.max(0, C + o);
|
|
311
|
+
if (U >= P && g && !I.value) {
|
|
312
|
+
await x(), await G();
|
|
313
313
|
return;
|
|
314
314
|
}
|
|
315
315
|
}
|
|
316
316
|
return {
|
|
317
|
-
handleScroll:
|
|
317
|
+
handleScroll: k
|
|
318
318
|
};
|
|
319
319
|
}
|
|
320
|
-
const
|
|
320
|
+
const ua = { class: "flex-1 relative min-h-0" }, va = { class: "w-full h-full rounded-xl overflow-hidden shadow-sm transition-all duration-300 bg-white relative" }, ca = {
|
|
321
321
|
key: 0,
|
|
322
322
|
class: "absolute inset-0 flex flex-col items-center justify-center bg-slate-100 text-slate-400 text-sm p-4 text-center"
|
|
323
|
-
},
|
|
323
|
+
}, fa = {
|
|
324
324
|
key: 1,
|
|
325
325
|
class: "relative w-full h-full"
|
|
326
|
-
},
|
|
326
|
+
}, da = ["src"], ma = ["src", "autoplay", "controls"], ha = { class: "w-12 h-12 rounded-full bg-white/80 backdrop-blur-sm flex items-center justify-center shadow-sm" }, ga = {
|
|
327
327
|
key: 3,
|
|
328
328
|
class: "absolute bottom-2 left-1/2 transform -translate-x-1/2 flex items-center justify-center z-10"
|
|
329
|
-
},
|
|
329
|
+
}, pa = {
|
|
330
330
|
key: 4,
|
|
331
331
|
class: "absolute inset-0 flex flex-col items-center justify-center bg-slate-50 text-slate-400 text-sm p-4 text-center"
|
|
332
|
-
},
|
|
332
|
+
}, Ie = /* @__PURE__ */ lt({
|
|
333
333
|
__name: "MasonryItem",
|
|
334
334
|
props: {
|
|
335
335
|
item: {},
|
|
@@ -343,109 +343,109 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
343
343
|
},
|
|
344
344
|
emits: ["preload:success", "preload:error", "mouse-enter", "mouse-leave"],
|
|
345
345
|
setup(t, { emit: v }) {
|
|
346
|
-
const c = t,
|
|
347
|
-
let
|
|
348
|
-
const g =
|
|
346
|
+
const c = t, i = v, I = T(!1), p = T(!1), r = T(null), u = T(!1), x = T(!1), E = T(null), S = T(!1), k = T(!1), d = T(!1), A = T(null), C = T(null);
|
|
347
|
+
let U = null;
|
|
348
|
+
const g = te(() => {
|
|
349
349
|
var n;
|
|
350
350
|
return c.type ?? ((n = c.item) == null ? void 0 : n.type) ?? "image";
|
|
351
|
-
}), o =
|
|
351
|
+
}), o = te(() => {
|
|
352
352
|
var n;
|
|
353
353
|
return c.notFound ?? ((n = c.item) == null ? void 0 : n.notFound) ?? !1;
|
|
354
|
-
}),
|
|
354
|
+
}), P = te(() => !!c.inSwipeMode);
|
|
355
355
|
function y(n) {
|
|
356
|
-
|
|
356
|
+
i("mouse-enter", { item: c.item, type: n });
|
|
357
357
|
}
|
|
358
|
-
function
|
|
359
|
-
|
|
358
|
+
function b(n) {
|
|
359
|
+
i("mouse-leave", { item: c.item, type: n });
|
|
360
360
|
}
|
|
361
361
|
function H(n) {
|
|
362
|
-
if (
|
|
362
|
+
if (P.value) return;
|
|
363
363
|
const f = n.target;
|
|
364
364
|
f && (f.paused ? f.play() : f.pause());
|
|
365
365
|
}
|
|
366
366
|
function h(n) {
|
|
367
367
|
const f = n.target;
|
|
368
|
-
f && (
|
|
368
|
+
f && (P.value || f.play(), y("video"));
|
|
369
369
|
}
|
|
370
|
-
function
|
|
370
|
+
function z(n) {
|
|
371
371
|
const f = n.target;
|
|
372
|
-
f && (
|
|
372
|
+
f && (P.value || f.pause(), b("video"));
|
|
373
373
|
}
|
|
374
374
|
function w(n) {
|
|
375
|
-
return new Promise((f,
|
|
375
|
+
return new Promise((f, $) => {
|
|
376
376
|
if (!n) {
|
|
377
377
|
const N = new Error("No image source provided");
|
|
378
|
-
|
|
378
|
+
i("preload:error", { item: c.item, type: "image", src: n, error: N }), $(N);
|
|
379
379
|
return;
|
|
380
380
|
}
|
|
381
|
-
const
|
|
382
|
-
|
|
383
|
-
const N = Date.now() -
|
|
381
|
+
const R = new Image(), X = Date.now(), Y = 300;
|
|
382
|
+
R.onload = () => {
|
|
383
|
+
const N = Date.now() - X, ie = Math.max(0, Y - N);
|
|
384
384
|
setTimeout(async () => {
|
|
385
|
-
|
|
386
|
-
},
|
|
387
|
-
},
|
|
388
|
-
p.value = !0,
|
|
385
|
+
I.value = !0, p.value = !1, k.value = !1, await G(), await new Promise((se) => setTimeout(se, 100)), d.value = !0, i("preload:success", { item: c.item, type: "image", src: n }), f();
|
|
386
|
+
}, ie);
|
|
387
|
+
}, R.onerror = () => {
|
|
388
|
+
p.value = !0, I.value = !1, k.value = !1;
|
|
389
389
|
const N = new Error("Failed to load image");
|
|
390
|
-
|
|
391
|
-
},
|
|
390
|
+
i("preload:error", { item: c.item, type: "image", src: n, error: N }), $(N);
|
|
391
|
+
}, R.src = n;
|
|
392
392
|
});
|
|
393
393
|
}
|
|
394
394
|
function M(n) {
|
|
395
|
-
return new Promise((f,
|
|
395
|
+
return new Promise((f, $) => {
|
|
396
396
|
if (!n) {
|
|
397
397
|
const N = new Error("No video source provided");
|
|
398
|
-
|
|
398
|
+
i("preload:error", { item: c.item, type: "video", src: n, error: N }), $(N);
|
|
399
399
|
return;
|
|
400
400
|
}
|
|
401
|
-
const
|
|
402
|
-
|
|
403
|
-
const N = Date.now() -
|
|
401
|
+
const R = document.createElement("video"), X = Date.now(), Y = 300;
|
|
402
|
+
R.preload = "metadata", R.muted = !0, R.onloadedmetadata = () => {
|
|
403
|
+
const N = Date.now() - X, ie = Math.max(0, Y - N);
|
|
404
404
|
setTimeout(async () => {
|
|
405
|
-
|
|
406
|
-
},
|
|
407
|
-
},
|
|
408
|
-
|
|
405
|
+
u.value = !0, x.value = !1, k.value = !1, await G(), await new Promise((se) => setTimeout(se, 100)), d.value = !0, i("preload:success", { item: c.item, type: "video", src: n }), f();
|
|
406
|
+
}, ie);
|
|
407
|
+
}, R.onerror = () => {
|
|
408
|
+
x.value = !0, u.value = !1, k.value = !1;
|
|
409
409
|
const N = new Error("Failed to load video");
|
|
410
|
-
|
|
411
|
-
},
|
|
410
|
+
i("preload:error", { item: c.item, type: "video", src: n, error: N }), $(N);
|
|
411
|
+
}, R.src = n;
|
|
412
412
|
});
|
|
413
413
|
}
|
|
414
|
-
async function
|
|
414
|
+
async function q() {
|
|
415
415
|
var f;
|
|
416
|
-
if (!S.value ||
|
|
416
|
+
if (!S.value || k.value || o.value || g.value === "video" && u.value || g.value === "image" && I.value)
|
|
417
417
|
return;
|
|
418
418
|
const n = (f = c.item) == null ? void 0 : f.src;
|
|
419
419
|
if (n)
|
|
420
|
-
if (
|
|
421
|
-
E.value = n,
|
|
420
|
+
if (k.value = !0, d.value = !1, g.value === "video") {
|
|
421
|
+
E.value = n, u.value = !1, x.value = !1;
|
|
422
422
|
try {
|
|
423
423
|
await M(n);
|
|
424
424
|
} catch {
|
|
425
425
|
}
|
|
426
426
|
} else {
|
|
427
|
-
|
|
427
|
+
r.value = n, I.value = !1, p.value = !1;
|
|
428
428
|
try {
|
|
429
429
|
await w(n);
|
|
430
430
|
} catch {
|
|
431
431
|
}
|
|
432
432
|
}
|
|
433
433
|
}
|
|
434
|
-
return
|
|
435
|
-
|
|
434
|
+
return rt(() => {
|
|
435
|
+
A.value && (U = new IntersectionObserver(
|
|
436
436
|
(n) => {
|
|
437
437
|
n.forEach((f) => {
|
|
438
|
-
f.isIntersecting && f.intersectionRatio >= 1 ? S.value || (S.value = !0,
|
|
438
|
+
f.isIntersecting && f.intersectionRatio >= 1 ? S.value || (S.value = !0, q()) : f.isIntersecting;
|
|
439
439
|
});
|
|
440
440
|
},
|
|
441
441
|
{
|
|
442
442
|
// Only trigger when item is 100% visible (full height in view)
|
|
443
443
|
threshold: [1]
|
|
444
444
|
}
|
|
445
|
-
),
|
|
446
|
-
}),
|
|
447
|
-
|
|
448
|
-
}),
|
|
445
|
+
), U.observe(A.value));
|
|
446
|
+
}), ot(() => {
|
|
447
|
+
U && (U.disconnect(), U = null);
|
|
448
|
+
}), oe(
|
|
449
449
|
() => {
|
|
450
450
|
var n;
|
|
451
451
|
return (n = c.item) == null ? void 0 : n.src;
|
|
@@ -453,15 +453,15 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
453
453
|
async (n) => {
|
|
454
454
|
if (!(!n || o.value)) {
|
|
455
455
|
if (g.value === "video") {
|
|
456
|
-
if (n !== E.value && (
|
|
457
|
-
|
|
456
|
+
if (n !== E.value && (u.value = !1, x.value = !1, E.value = n, S.value)) {
|
|
457
|
+
k.value = !0;
|
|
458
458
|
try {
|
|
459
459
|
await M(n);
|
|
460
460
|
} catch {
|
|
461
461
|
}
|
|
462
462
|
}
|
|
463
|
-
} else if (n !==
|
|
464
|
-
|
|
463
|
+
} else if (n !== r.value && (I.value = !1, p.value = !1, r.value = n, S.value)) {
|
|
464
|
+
k.value = !0;
|
|
465
465
|
try {
|
|
466
466
|
await w(n);
|
|
467
467
|
} catch {
|
|
@@ -469,149 +469,149 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
469
469
|
}
|
|
470
470
|
}
|
|
471
471
|
}
|
|
472
|
-
),
|
|
472
|
+
), oe(
|
|
473
473
|
() => c.isActive,
|
|
474
474
|
(n) => {
|
|
475
|
-
|
|
475
|
+
!P.value || !C.value || (n ? C.value.play() : C.value.pause());
|
|
476
476
|
}
|
|
477
|
-
), (n, f) => (
|
|
477
|
+
), (n, f) => (D(), B("div", {
|
|
478
478
|
ref_key: "containerRef",
|
|
479
|
-
ref:
|
|
479
|
+
ref: A,
|
|
480
480
|
class: "relative w-full h-full flex flex-col"
|
|
481
481
|
}, [
|
|
482
|
-
n.headerHeight > 0 ? (
|
|
482
|
+
n.headerHeight > 0 ? (D(), B("div", {
|
|
483
483
|
key: 0,
|
|
484
484
|
class: "relative z-10",
|
|
485
|
-
style:
|
|
485
|
+
style: Me({ height: `${n.headerHeight}px` })
|
|
486
486
|
}, [
|
|
487
|
-
|
|
487
|
+
ee(n.$slots, "header", {
|
|
488
488
|
item: n.item,
|
|
489
489
|
remove: n.remove,
|
|
490
|
-
imageLoaded:
|
|
490
|
+
imageLoaded: I.value,
|
|
491
491
|
imageError: p.value,
|
|
492
|
-
videoLoaded:
|
|
493
|
-
videoError:
|
|
492
|
+
videoLoaded: u.value,
|
|
493
|
+
videoError: x.value,
|
|
494
494
|
showNotFound: o.value,
|
|
495
|
-
isLoading:
|
|
495
|
+
isLoading: k.value,
|
|
496
496
|
mediaType: g.value
|
|
497
497
|
})
|
|
498
|
-
], 4)) :
|
|
499
|
-
|
|
500
|
-
|
|
498
|
+
], 4)) : le("", !0),
|
|
499
|
+
j("div", ua, [
|
|
500
|
+
ee(n.$slots, "default", {
|
|
501
501
|
item: n.item,
|
|
502
502
|
remove: n.remove,
|
|
503
|
-
imageLoaded:
|
|
503
|
+
imageLoaded: I.value,
|
|
504
504
|
imageError: p.value,
|
|
505
|
-
videoLoaded:
|
|
506
|
-
videoError:
|
|
505
|
+
videoLoaded: u.value,
|
|
506
|
+
videoError: x.value,
|
|
507
507
|
showNotFound: o.value,
|
|
508
|
-
isLoading:
|
|
508
|
+
isLoading: k.value,
|
|
509
509
|
mediaType: g.value,
|
|
510
|
-
imageSrc:
|
|
510
|
+
imageSrc: r.value,
|
|
511
511
|
videoSrc: E.value,
|
|
512
512
|
showMedia: d.value
|
|
513
513
|
}, () => [
|
|
514
|
-
|
|
515
|
-
o.value ? (
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
]))) : (
|
|
520
|
-
g.value === "image" &&
|
|
514
|
+
j("div", va, [
|
|
515
|
+
o.value ? (D(), B("div", ca, f[3] || (f[3] = [
|
|
516
|
+
j("i", { class: "fas fa-search text-3xl mb-3 opacity-50" }, null, -1),
|
|
517
|
+
j("span", { class: "font-medium" }, "Not Found", -1),
|
|
518
|
+
j("span", { class: "text-xs mt-1 opacity-75" }, "This item could not be located", -1)
|
|
519
|
+
]))) : (D(), B("div", fa, [
|
|
520
|
+
g.value === "image" && r.value ? (D(), B("img", {
|
|
521
521
|
key: 0,
|
|
522
|
-
src:
|
|
523
|
-
class:
|
|
522
|
+
src: r.value,
|
|
523
|
+
class: de([
|
|
524
524
|
"w-full h-full object-cover transition-opacity duration-700 ease-in-out",
|
|
525
|
-
|
|
525
|
+
I.value && d.value ? "opacity-100" : "opacity-0"
|
|
526
526
|
]),
|
|
527
527
|
style: { position: "absolute", top: "0", left: "0" },
|
|
528
528
|
loading: "lazy",
|
|
529
529
|
decoding: "async",
|
|
530
530
|
alt: "",
|
|
531
|
-
onMouseenter: f[0] || (f[0] = (
|
|
532
|
-
onMouseleave: f[1] || (f[1] = (
|
|
533
|
-
}, null, 42,
|
|
534
|
-
g.value === "video" && E.value ? (
|
|
531
|
+
onMouseenter: f[0] || (f[0] = ($) => y("image")),
|
|
532
|
+
onMouseleave: f[1] || (f[1] = ($) => b("image"))
|
|
533
|
+
}, null, 42, da)) : le("", !0),
|
|
534
|
+
g.value === "video" && E.value ? (D(), B("video", {
|
|
535
535
|
key: 1,
|
|
536
536
|
ref_key: "videoEl",
|
|
537
|
-
ref:
|
|
537
|
+
ref: C,
|
|
538
538
|
src: E.value,
|
|
539
|
-
class:
|
|
539
|
+
class: de([
|
|
540
540
|
"w-full h-full object-cover transition-opacity duration-700 ease-in-out",
|
|
541
|
-
|
|
541
|
+
u.value && d.value ? "opacity-100" : "opacity-0"
|
|
542
542
|
]),
|
|
543
543
|
style: { position: "absolute", top: "0", left: "0" },
|
|
544
544
|
muted: "",
|
|
545
545
|
loop: "",
|
|
546
546
|
playsinline: "",
|
|
547
|
-
autoplay:
|
|
548
|
-
controls:
|
|
549
|
-
onClick:
|
|
550
|
-
onTouchend:
|
|
547
|
+
autoplay: P.value && c.isActive,
|
|
548
|
+
controls: P.value,
|
|
549
|
+
onClick: Xe(H, ["stop"]),
|
|
550
|
+
onTouchend: Xe(H, ["stop", "prevent"]),
|
|
551
551
|
onMouseenter: h,
|
|
552
|
-
onMouseleave:
|
|
553
|
-
onError: f[2] || (f[2] = (
|
|
554
|
-
}, null, 42,
|
|
555
|
-
!
|
|
552
|
+
onMouseleave: z,
|
|
553
|
+
onError: f[2] || (f[2] = ($) => x.value = !0)
|
|
554
|
+
}, null, 42, ma)) : le("", !0),
|
|
555
|
+
!I.value && !u.value && !p.value && !x.value ? (D(), B("div", {
|
|
556
556
|
key: 2,
|
|
557
|
-
class:
|
|
557
|
+
class: de([
|
|
558
558
|
"absolute inset-0 bg-slate-100 flex items-center justify-center transition-opacity duration-500",
|
|
559
559
|
d.value ? "opacity-0 pointer-events-none" : "opacity-100"
|
|
560
560
|
])
|
|
561
561
|
}, [
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
class:
|
|
562
|
+
j("div", ha, [
|
|
563
|
+
j("i", {
|
|
564
|
+
class: de(g.value === "video" ? "fas fa-video text-xl text-slate-400" : "fas fa-image text-xl text-slate-400")
|
|
565
565
|
}, null, 2)
|
|
566
566
|
])
|
|
567
|
-
], 2)) :
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
567
|
+
], 2)) : le("", !0),
|
|
568
|
+
k.value ? (D(), B("div", ga, f[4] || (f[4] = [
|
|
569
|
+
j("div", { class: "bg-white/90 backdrop-blur-sm rounded-full px-3 py-1.5 shadow-sm" }, [
|
|
570
|
+
j("div", { class: "animate-spin rounded-full h-4 w-4 border-b-2 border-blue-500" })
|
|
571
571
|
], -1)
|
|
572
|
-
]))) :
|
|
573
|
-
g.value === "image" && p.value || g.value === "video" &&
|
|
574
|
-
|
|
575
|
-
class:
|
|
572
|
+
]))) : le("", !0),
|
|
573
|
+
g.value === "image" && p.value || g.value === "video" && x.value ? (D(), B("div", pa, [
|
|
574
|
+
j("i", {
|
|
575
|
+
class: de(g.value === "video" ? "fas fa-video text-2xl mb-2 opacity-50" : "fas fa-image text-2xl mb-2 opacity-50")
|
|
576
576
|
}, null, 2),
|
|
577
|
-
|
|
578
|
-
])) :
|
|
577
|
+
j("span", null, "Failed to load " + Ae(g.value), 1)
|
|
578
|
+
])) : le("", !0)
|
|
579
579
|
]))
|
|
580
580
|
])
|
|
581
581
|
])
|
|
582
582
|
]),
|
|
583
|
-
n.footerHeight > 0 ? (
|
|
583
|
+
n.footerHeight > 0 ? (D(), B("div", {
|
|
584
584
|
key: 1,
|
|
585
585
|
class: "relative z-10",
|
|
586
|
-
style:
|
|
586
|
+
style: Me({ height: `${n.footerHeight}px` })
|
|
587
587
|
}, [
|
|
588
|
-
|
|
588
|
+
ee(n.$slots, "footer", {
|
|
589
589
|
item: n.item,
|
|
590
590
|
remove: n.remove,
|
|
591
|
-
imageLoaded:
|
|
591
|
+
imageLoaded: I.value,
|
|
592
592
|
imageError: p.value,
|
|
593
|
-
videoLoaded:
|
|
594
|
-
videoError:
|
|
593
|
+
videoLoaded: u.value,
|
|
594
|
+
videoError: x.value,
|
|
595
595
|
showNotFound: o.value,
|
|
596
|
-
isLoading:
|
|
596
|
+
isLoading: k.value,
|
|
597
597
|
mediaType: g.value
|
|
598
598
|
})
|
|
599
|
-
], 4)) :
|
|
599
|
+
], 4)) : le("", !0)
|
|
600
600
|
], 512));
|
|
601
601
|
}
|
|
602
|
-
}),
|
|
602
|
+
}), ya = { class: "w-full h-full flex items-center justify-center p-4" }, wa = { class: "w-full h-full max-w-full max-h-full relative" }, xa = {
|
|
603
603
|
key: 0,
|
|
604
604
|
class: "w-full py-8 text-center"
|
|
605
|
-
},
|
|
605
|
+
}, ba = {
|
|
606
606
|
key: 1,
|
|
607
607
|
class: "w-full py-8 text-center"
|
|
608
|
-
},
|
|
608
|
+
}, Ma = { class: "text-red-500 dark:text-red-400" }, Ea = {
|
|
609
609
|
key: 0,
|
|
610
610
|
class: "w-full py-8 text-center"
|
|
611
|
-
},
|
|
611
|
+
}, Ta = {
|
|
612
612
|
key: 1,
|
|
613
613
|
class: "w-full py-8 text-center"
|
|
614
|
-
},
|
|
614
|
+
}, Ia = { class: "text-red-500 dark:text-red-400" }, La = /* @__PURE__ */ lt({
|
|
615
615
|
__name: "Masonry",
|
|
616
616
|
props: {
|
|
617
617
|
getNextPage: {
|
|
@@ -730,7 +730,7 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
730
730
|
"item:mouse-leave"
|
|
731
731
|
],
|
|
732
732
|
setup(t, { expose: v, emit: c }) {
|
|
733
|
-
const
|
|
733
|
+
const i = t, I = {
|
|
734
734
|
sizes: { base: 1, sm: 2, md: 3, lg: 4, xl: 5, "2xl": 6 },
|
|
735
735
|
gutterX: 10,
|
|
736
736
|
gutterY: 10,
|
|
@@ -739,19 +739,19 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
739
739
|
paddingLeft: 0,
|
|
740
740
|
paddingRight: 0,
|
|
741
741
|
placement: "masonry"
|
|
742
|
-
}, p =
|
|
742
|
+
}, p = te(() => {
|
|
743
743
|
var e;
|
|
744
744
|
return {
|
|
745
|
-
...
|
|
746
|
-
...
|
|
745
|
+
...I,
|
|
746
|
+
...i.layout,
|
|
747
747
|
sizes: {
|
|
748
|
-
...
|
|
749
|
-
...((e =
|
|
748
|
+
...I.sizes,
|
|
749
|
+
...((e = i.layout) == null ? void 0 : e.sizes) || {}
|
|
750
750
|
}
|
|
751
751
|
};
|
|
752
|
-
}),
|
|
752
|
+
}), r = T(null), u = T(typeof window < "u" ? window.innerWidth : 1024), x = T(typeof window < "u" ? window.innerHeight : 768), E = T(null);
|
|
753
753
|
let S = null;
|
|
754
|
-
function
|
|
754
|
+
function k(e) {
|
|
755
755
|
return {
|
|
756
756
|
sm: 640,
|
|
757
757
|
md: 768,
|
|
@@ -760,48 +760,48 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
760
760
|
"2xl": 1536
|
|
761
761
|
}[e] || 768;
|
|
762
762
|
}
|
|
763
|
-
const d =
|
|
764
|
-
if (
|
|
765
|
-
if (
|
|
766
|
-
const e = typeof
|
|
767
|
-
return
|
|
768
|
-
}),
|
|
763
|
+
const d = te(() => {
|
|
764
|
+
if (i.layoutMode === "masonry") return !1;
|
|
765
|
+
if (i.layoutMode === "swipe") return !0;
|
|
766
|
+
const e = typeof i.mobileBreakpoint == "string" ? k(i.mobileBreakpoint) : i.mobileBreakpoint;
|
|
767
|
+
return u.value < e;
|
|
768
|
+
}), A = te(() => {
|
|
769
769
|
if (!d.value || o.value.length === 0) return null;
|
|
770
770
|
const e = Math.max(0, Math.min(n.value, o.value.length - 1));
|
|
771
771
|
return o.value[e] || null;
|
|
772
|
-
}),
|
|
773
|
-
if (!d.value || !
|
|
772
|
+
}), C = te(() => {
|
|
773
|
+
if (!d.value || !A.value) return null;
|
|
774
774
|
const e = n.value + 1;
|
|
775
775
|
return e >= o.value.length ? null : o.value[e] || null;
|
|
776
|
-
}),
|
|
777
|
-
if (!d.value || !
|
|
776
|
+
}), U = te(() => {
|
|
777
|
+
if (!d.value || !A.value) return null;
|
|
778
778
|
const e = n.value - 1;
|
|
779
779
|
return e < 0 ? null : o.value[e] || null;
|
|
780
|
-
}), g = c, o =
|
|
781
|
-
get: () =>
|
|
780
|
+
}), g = c, o = te({
|
|
781
|
+
get: () => i.items,
|
|
782
782
|
set: (e) => g("update:items", e)
|
|
783
|
-
}),
|
|
784
|
-
function
|
|
783
|
+
}), P = T(7), y = T(null), b = T([]), H = T(null), h = T(!1), z = T(0), w = T(!1), M = T(null), q = te(() => na(u.value)), n = T(0), f = T(0), $ = T(!1), R = T(0), X = T(0), Y = T(null), N = T(/* @__PURE__ */ new Set());
|
|
784
|
+
function ie(e) {
|
|
785
785
|
return typeof e == "number" && Number.isFinite(e) && e > 0;
|
|
786
786
|
}
|
|
787
|
-
function
|
|
787
|
+
function se(e, a) {
|
|
788
788
|
try {
|
|
789
789
|
if (!Array.isArray(e) || e.length === 0) return;
|
|
790
|
-
const
|
|
791
|
-
if (
|
|
790
|
+
const l = e.filter((s) => !ie(s == null ? void 0 : s.width) || !ie(s == null ? void 0 : s.height));
|
|
791
|
+
if (l.length === 0) return;
|
|
792
792
|
const m = [];
|
|
793
|
-
for (const
|
|
794
|
-
const
|
|
795
|
-
N.value.has(
|
|
793
|
+
for (const s of l) {
|
|
794
|
+
const F = (s == null ? void 0 : s.id) ?? `idx:${e.indexOf(s)}`;
|
|
795
|
+
N.value.has(F) || (N.value.add(F), m.push(F));
|
|
796
796
|
}
|
|
797
797
|
if (m.length > 0) {
|
|
798
|
-
const
|
|
798
|
+
const s = m.slice(0, 10);
|
|
799
799
|
console.warn(
|
|
800
800
|
"[Masonry] Items missing width/height detected:",
|
|
801
801
|
{
|
|
802
802
|
context: a,
|
|
803
803
|
count: m.length,
|
|
804
|
-
sampleIds:
|
|
804
|
+
sampleIds: s,
|
|
805
805
|
hint: "Ensure each item has positive width and height. Consider providing fallbacks (e.g., 512x512) at the data layer."
|
|
806
806
|
}
|
|
807
807
|
);
|
|
@@ -809,72 +809,72 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
809
809
|
} catch {
|
|
810
810
|
}
|
|
811
811
|
}
|
|
812
|
-
const
|
|
812
|
+
const L = T(0), O = T(0), Q = i.virtualBufferPx, J = T(!1), K = T({
|
|
813
813
|
distanceToTrigger: 0,
|
|
814
814
|
isNearTrigger: !1
|
|
815
|
-
}),
|
|
815
|
+
}), ae = (e) => {
|
|
816
816
|
if (!y.value) return;
|
|
817
|
-
const { scrollTop: a, clientHeight:
|
|
818
|
-
|
|
819
|
-
distanceToTrigger: Math.round(
|
|
820
|
-
isNearTrigger:
|
|
817
|
+
const { scrollTop: a, clientHeight: l } = y.value, m = a + l, s = e ?? Be(o.value, P.value), F = s.length ? Math.max(...s) : 0, W = typeof i.loadThresholdPx == "number" ? i.loadThresholdPx : 200, ue = W >= 0 ? Math.max(0, F - W) : Math.max(0, F + W), ve = Math.max(0, ue - m), ce = ve <= 100;
|
|
818
|
+
K.value = {
|
|
819
|
+
distanceToTrigger: Math.round(ve),
|
|
820
|
+
isNearTrigger: ce
|
|
821
821
|
};
|
|
822
|
-
}, { onEnter:
|
|
823
|
-
function
|
|
824
|
-
if (
|
|
825
|
-
const
|
|
826
|
-
e.style.transition = "none", e.style.opacity = "1", e.style.transform = `translate3d(${
|
|
822
|
+
}, { onEnter: ne, onBeforeEnter: ut, onBeforeLeave: vt, onLeave: ct } = ia(o, { leaveDurationMs: i.leaveDurationMs });
|
|
823
|
+
function ft(e, a) {
|
|
824
|
+
if (J.value) {
|
|
825
|
+
const l = parseInt(e.dataset.left || "0", 10), m = parseInt(e.dataset.top || "0", 10);
|
|
826
|
+
e.style.transition = "none", e.style.opacity = "1", e.style.transform = `translate3d(${l}px, ${m}px, 0) scale(1)`, e.style.removeProperty("--masonry-opacity-delay"), requestAnimationFrame(() => {
|
|
827
827
|
e.style.transition = "", a();
|
|
828
828
|
});
|
|
829
829
|
} else
|
|
830
|
-
|
|
830
|
+
ne(e, a);
|
|
831
831
|
}
|
|
832
|
-
function
|
|
833
|
-
if (
|
|
834
|
-
const a = parseInt(e.dataset.left || "0", 10),
|
|
835
|
-
e.style.transition = "none", e.style.opacity = "1", e.style.transform = `translate3d(${a}px, ${
|
|
832
|
+
function dt(e) {
|
|
833
|
+
if (J.value) {
|
|
834
|
+
const a = parseInt(e.dataset.left || "0", 10), l = parseInt(e.dataset.top || "0", 10);
|
|
835
|
+
e.style.transition = "none", e.style.opacity = "1", e.style.transform = `translate3d(${a}px, ${l}px, 0) scale(1)`, e.style.removeProperty("--masonry-opacity-delay");
|
|
836
836
|
} else
|
|
837
|
-
|
|
837
|
+
ut(e);
|
|
838
838
|
}
|
|
839
|
-
function
|
|
840
|
-
|
|
839
|
+
function mt(e) {
|
|
840
|
+
J.value || vt(e);
|
|
841
841
|
}
|
|
842
|
-
function
|
|
843
|
-
|
|
842
|
+
function ht(e, a) {
|
|
843
|
+
J.value ? a() : ct(e, a);
|
|
844
844
|
}
|
|
845
|
-
const
|
|
846
|
-
const e =
|
|
847
|
-
return !
|
|
848
|
-
const
|
|
849
|
-
return m.top + m.columnHeight >= e &&
|
|
845
|
+
const gt = te(() => {
|
|
846
|
+
const e = L.value - Q, a = L.value + O.value + Q, l = o.value;
|
|
847
|
+
return !l || l.length === 0 ? [] : l.filter((m) => {
|
|
848
|
+
const s = m.top;
|
|
849
|
+
return m.top + m.columnHeight >= e && s <= a;
|
|
850
850
|
});
|
|
851
|
-
}), { handleScroll:
|
|
851
|
+
}), { handleScroll: pt } = sa({
|
|
852
852
|
container: y,
|
|
853
853
|
masonry: o,
|
|
854
|
-
columns:
|
|
855
|
-
containerHeight:
|
|
854
|
+
columns: P,
|
|
855
|
+
containerHeight: z,
|
|
856
856
|
isLoading: h,
|
|
857
|
-
pageSize:
|
|
858
|
-
refreshLayout:
|
|
857
|
+
pageSize: i.pageSize,
|
|
858
|
+
refreshLayout: Z,
|
|
859
859
|
setItemsRaw: (e) => {
|
|
860
860
|
o.value = e;
|
|
861
861
|
},
|
|
862
|
-
loadNext:
|
|
863
|
-
loadThresholdPx:
|
|
862
|
+
loadNext: me,
|
|
863
|
+
loadThresholdPx: i.loadThresholdPx
|
|
864
864
|
});
|
|
865
|
-
function
|
|
866
|
-
E.value = e, e ? (e.width !== void 0 && (
|
|
867
|
-
|
|
868
|
-
})) :
|
|
865
|
+
function yt(e) {
|
|
866
|
+
E.value = e, e ? (e.width !== void 0 && (u.value = e.width), e.height !== void 0 && (x.value = e.height), !d.value && y.value && o.value.length > 0 && G(() => {
|
|
867
|
+
P.value = he(p.value, u.value), Z(o.value), ae();
|
|
868
|
+
})) : r.value && (u.value = r.value.clientWidth, x.value = r.value.clientHeight);
|
|
869
869
|
}
|
|
870
870
|
v({
|
|
871
871
|
isLoading: h,
|
|
872
|
-
refreshLayout:
|
|
872
|
+
refreshLayout: Z,
|
|
873
873
|
// Container dimensions (wrapper element)
|
|
874
|
-
containerWidth:
|
|
875
|
-
containerHeight:
|
|
874
|
+
containerWidth: u,
|
|
875
|
+
containerHeight: x,
|
|
876
876
|
// Masonry content height (for backward compatibility, old containerHeight)
|
|
877
|
-
contentHeight:
|
|
877
|
+
contentHeight: z,
|
|
878
878
|
// Current page
|
|
879
879
|
currentPage: H,
|
|
880
880
|
// End of list tracking
|
|
@@ -882,98 +882,100 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
882
882
|
// Load error tracking
|
|
883
883
|
loadError: M,
|
|
884
884
|
// Set fixed dimensions (overrides ResizeObserver)
|
|
885
|
-
setFixedDimensions:
|
|
886
|
-
remove:
|
|
887
|
-
removeMany:
|
|
888
|
-
removeAll:
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
885
|
+
setFixedDimensions: yt,
|
|
886
|
+
remove: ge,
|
|
887
|
+
removeMany: xt,
|
|
888
|
+
removeAll: Et,
|
|
889
|
+
restore: bt,
|
|
890
|
+
restoreMany: Mt,
|
|
891
|
+
loadNext: me,
|
|
892
|
+
loadPage: Le,
|
|
893
|
+
refreshCurrentPage: ke,
|
|
894
|
+
reset: It,
|
|
895
|
+
destroy: Lt,
|
|
896
|
+
init: kt,
|
|
897
|
+
paginationHistory: b,
|
|
898
|
+
cancelLoad: Pe,
|
|
899
|
+
scrollToTop: Oe,
|
|
900
|
+
totalItems: te(() => o.value.length),
|
|
901
|
+
currentBreakpoint: q
|
|
900
902
|
});
|
|
901
903
|
function De(e) {
|
|
902
|
-
const a =
|
|
903
|
-
let
|
|
904
|
+
const a = la(e);
|
|
905
|
+
let l = 0;
|
|
904
906
|
if (y.value) {
|
|
905
|
-
const { scrollTop: m, clientHeight:
|
|
906
|
-
|
|
907
|
+
const { scrollTop: m, clientHeight: s } = y.value;
|
|
908
|
+
l = m + s + 100;
|
|
907
909
|
}
|
|
908
|
-
|
|
910
|
+
z.value = Math.max(a, l);
|
|
909
911
|
}
|
|
910
|
-
function
|
|
912
|
+
function Z(e) {
|
|
911
913
|
if (d.value) {
|
|
912
914
|
o.value = e;
|
|
913
915
|
return;
|
|
914
916
|
}
|
|
915
917
|
if (!y.value) return;
|
|
916
|
-
|
|
917
|
-
const a = e.map((m,
|
|
918
|
+
se(e, "refreshLayout");
|
|
919
|
+
const a = e.map((m, s) => ({
|
|
918
920
|
...m,
|
|
919
|
-
originalIndex:
|
|
920
|
-
})),
|
|
921
|
+
originalIndex: s
|
|
922
|
+
})), l = y.value;
|
|
921
923
|
if (E.value && E.value.width !== void 0) {
|
|
922
|
-
const m =
|
|
923
|
-
|
|
924
|
-
const
|
|
925
|
-
|
|
924
|
+
const m = l.style.width, s = l.style.boxSizing;
|
|
925
|
+
l.style.boxSizing = "border-box", l.style.width = `${E.value.width}px`, l.offsetWidth;
|
|
926
|
+
const F = Qe(a, l, P.value, p.value);
|
|
927
|
+
l.style.width = m, l.style.boxSizing = s, De(F), o.value = F;
|
|
926
928
|
} else {
|
|
927
|
-
const m =
|
|
929
|
+
const m = Qe(a, l, P.value, p.value);
|
|
928
930
|
De(m), o.value = m;
|
|
929
931
|
}
|
|
930
932
|
}
|
|
931
|
-
function
|
|
932
|
-
return new Promise((
|
|
933
|
-
const m = Math.max(0, e | 0),
|
|
933
|
+
function ze(e, a) {
|
|
934
|
+
return new Promise((l) => {
|
|
935
|
+
const m = Math.max(0, e | 0), s = Date.now();
|
|
934
936
|
a(m, m);
|
|
935
|
-
const
|
|
936
|
-
if (
|
|
937
|
-
clearInterval(
|
|
937
|
+
const F = setInterval(() => {
|
|
938
|
+
if (_.value) {
|
|
939
|
+
clearInterval(F), l();
|
|
938
940
|
return;
|
|
939
941
|
}
|
|
940
|
-
const
|
|
941
|
-
a(
|
|
942
|
+
const W = Date.now() - s, ue = Math.max(0, m - W);
|
|
943
|
+
a(ue, m), ue <= 0 && (clearInterval(F), l());
|
|
942
944
|
}, 100);
|
|
943
945
|
});
|
|
944
946
|
}
|
|
945
|
-
async function
|
|
947
|
+
async function Ee(e) {
|
|
946
948
|
try {
|
|
947
|
-
const a = await
|
|
948
|
-
return
|
|
949
|
+
const a = await wt(() => i.getNextPage(e));
|
|
950
|
+
return Z([...o.value, ...a.items]), a;
|
|
949
951
|
} catch (a) {
|
|
950
952
|
throw console.error("Error in getContent:", a), a;
|
|
951
953
|
}
|
|
952
954
|
}
|
|
953
|
-
async function
|
|
955
|
+
async function wt(e) {
|
|
954
956
|
let a = 0;
|
|
955
|
-
const
|
|
956
|
-
let m =
|
|
957
|
+
const l = i.retryMaxAttempts;
|
|
958
|
+
let m = i.retryInitialDelayMs;
|
|
957
959
|
for (; ; )
|
|
958
960
|
try {
|
|
959
|
-
const
|
|
960
|
-
return a > 0 && g("retry:stop", { attempt: a, success: !0 }),
|
|
961
|
-
} catch (
|
|
962
|
-
if (a++, a >
|
|
963
|
-
throw g("retry:stop", { attempt: a - 1, success: !1 }),
|
|
964
|
-
g("retry:start", { attempt: a, max:
|
|
965
|
-
g("retry:tick", { attempt: a, remainingMs:
|
|
966
|
-
}), m +=
|
|
961
|
+
const s = await e();
|
|
962
|
+
return a > 0 && g("retry:stop", { attempt: a, success: !0 }), s;
|
|
963
|
+
} catch (s) {
|
|
964
|
+
if (a++, a > l)
|
|
965
|
+
throw g("retry:stop", { attempt: a - 1, success: !1 }), s;
|
|
966
|
+
g("retry:start", { attempt: a, max: l, totalMs: m }), await ze(m, (F, W) => {
|
|
967
|
+
g("retry:tick", { attempt: a, remainingMs: F, totalMs: W });
|
|
968
|
+
}), m += i.retryBackoffStepMs;
|
|
967
969
|
}
|
|
968
970
|
}
|
|
969
|
-
async function
|
|
971
|
+
async function Le(e) {
|
|
970
972
|
if (!h.value) {
|
|
971
|
-
|
|
973
|
+
_.value = !1, h.value = !0, w.value = !1, M.value = null;
|
|
972
974
|
try {
|
|
973
975
|
const a = o.value.length;
|
|
974
|
-
if (
|
|
975
|
-
const
|
|
976
|
-
return
|
|
976
|
+
if (_.value) return;
|
|
977
|
+
const l = await Ee(e);
|
|
978
|
+
return _.value ? void 0 : (M.value = null, H.value = e, b.value.push(l.nextPage), l.nextPage == null && (w.value = !0), await ye(a), l);
|
|
977
979
|
} catch (a) {
|
|
978
980
|
throw console.error("Error loading page:", a), M.value = a instanceof Error ? a : new Error(String(a)), a;
|
|
979
981
|
} finally {
|
|
@@ -981,19 +983,19 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
981
983
|
}
|
|
982
984
|
}
|
|
983
985
|
}
|
|
984
|
-
async function
|
|
986
|
+
async function me() {
|
|
985
987
|
if (!h.value && !w.value) {
|
|
986
|
-
|
|
988
|
+
_.value = !1, h.value = !0, M.value = null;
|
|
987
989
|
try {
|
|
988
990
|
const e = o.value.length;
|
|
989
|
-
if (
|
|
990
|
-
const a =
|
|
991
|
+
if (_.value) return;
|
|
992
|
+
const a = b.value[b.value.length - 1];
|
|
991
993
|
if (a == null) {
|
|
992
994
|
w.value = !0, h.value = !1;
|
|
993
995
|
return;
|
|
994
996
|
}
|
|
995
|
-
const
|
|
996
|
-
return
|
|
997
|
+
const l = await Ee(a);
|
|
998
|
+
return _.value ? void 0 : (M.value = null, H.value = a, b.value.push(l.nextPage), l.nextPage == null && (w.value = !0), await ye(e), l);
|
|
997
999
|
} catch (e) {
|
|
998
1000
|
throw console.error("Error loading next page:", e), M.value = e instanceof Error ? e : new Error(String(e)), e;
|
|
999
1001
|
} finally {
|
|
@@ -1001,21 +1003,21 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
1001
1003
|
}
|
|
1002
1004
|
}
|
|
1003
1005
|
}
|
|
1004
|
-
async function
|
|
1006
|
+
async function ke() {
|
|
1005
1007
|
if (!h.value) {
|
|
1006
|
-
|
|
1008
|
+
_.value = !1, h.value = !0;
|
|
1007
1009
|
try {
|
|
1008
1010
|
const e = H.value;
|
|
1009
1011
|
if (e == null) {
|
|
1010
|
-
console.warn("[Masonry] No current page to refresh - currentPage:", H.value, "paginationHistory:",
|
|
1012
|
+
console.warn("[Masonry] No current page to refresh - currentPage:", H.value, "paginationHistory:", b.value);
|
|
1011
1013
|
return;
|
|
1012
1014
|
}
|
|
1013
|
-
o.value = [],
|
|
1014
|
-
const a = await
|
|
1015
|
-
if (
|
|
1016
|
-
M.value = null, H.value = e,
|
|
1017
|
-
const
|
|
1018
|
-
return await
|
|
1015
|
+
o.value = [], z.value = 0, w.value = !1, M.value = null, b.value = [e], await G();
|
|
1016
|
+
const a = await Ee(e);
|
|
1017
|
+
if (_.value) return;
|
|
1018
|
+
M.value = null, H.value = e, b.value.push(a.nextPage), a.nextPage == null && (w.value = !0);
|
|
1019
|
+
const l = o.value.length;
|
|
1020
|
+
return await ye(l), a;
|
|
1019
1021
|
} catch (e) {
|
|
1020
1022
|
throw console.error("[Masonry] Error refreshing current page:", e), M.value = e instanceof Error ? e : new Error(String(e)), e;
|
|
1021
1023
|
} finally {
|
|
@@ -1023,112 +1025,142 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
1023
1025
|
}
|
|
1024
1026
|
}
|
|
1025
1027
|
}
|
|
1026
|
-
async function
|
|
1027
|
-
const a = o.value.filter((
|
|
1028
|
-
if (o.value = a, await
|
|
1029
|
-
if (
|
|
1030
|
-
await
|
|
1028
|
+
async function ge(e) {
|
|
1029
|
+
const a = o.value.filter((l) => l.id !== e.id);
|
|
1030
|
+
if (o.value = a, await G(), a.length === 0 && b.value.length > 0) {
|
|
1031
|
+
if (i.autoRefreshOnEmpty)
|
|
1032
|
+
await ke();
|
|
1031
1033
|
else
|
|
1032
1034
|
try {
|
|
1033
|
-
await
|
|
1035
|
+
await me(), await ye(0, !0);
|
|
1034
1036
|
} catch {
|
|
1035
1037
|
}
|
|
1036
1038
|
return;
|
|
1037
1039
|
}
|
|
1038
|
-
await new Promise((
|
|
1039
|
-
|
|
1040
|
+
await new Promise((l) => requestAnimationFrame(() => l())), requestAnimationFrame(() => {
|
|
1041
|
+
Z(a);
|
|
1040
1042
|
});
|
|
1041
1043
|
}
|
|
1042
|
-
async function
|
|
1044
|
+
async function xt(e) {
|
|
1043
1045
|
if (!e || e.length === 0) return;
|
|
1044
|
-
const a = new Set(e.map((m) => m.id)),
|
|
1045
|
-
if (o.value =
|
|
1046
|
-
if (
|
|
1047
|
-
await
|
|
1046
|
+
const a = new Set(e.map((m) => m.id)), l = o.value.filter((m) => !a.has(m.id));
|
|
1047
|
+
if (o.value = l, await G(), l.length === 0 && b.value.length > 0) {
|
|
1048
|
+
if (i.autoRefreshOnEmpty)
|
|
1049
|
+
await ke();
|
|
1048
1050
|
else
|
|
1049
1051
|
try {
|
|
1050
|
-
await
|
|
1052
|
+
await me(), await ye(0, !0);
|
|
1051
1053
|
} catch {
|
|
1052
1054
|
}
|
|
1053
1055
|
return;
|
|
1054
1056
|
}
|
|
1055
1057
|
await new Promise((m) => requestAnimationFrame(() => m())), requestAnimationFrame(() => {
|
|
1056
|
-
|
|
1058
|
+
Z(l);
|
|
1057
1059
|
});
|
|
1058
1060
|
}
|
|
1059
|
-
function
|
|
1061
|
+
async function bt(e, a) {
|
|
1062
|
+
if (!e) return;
|
|
1063
|
+
const l = o.value;
|
|
1064
|
+
if (l.findIndex((W) => W.id === e.id) !== -1) return;
|
|
1065
|
+
const s = [...l], F = Math.min(a, s.length);
|
|
1066
|
+
s.splice(F, 0, e), o.value = s, await G(), d.value || (await new Promise((W) => requestAnimationFrame(() => W())), requestAnimationFrame(() => {
|
|
1067
|
+
Z(s);
|
|
1068
|
+
}));
|
|
1069
|
+
}
|
|
1070
|
+
async function Mt(e, a) {
|
|
1071
|
+
var Ge;
|
|
1072
|
+
if (!e || e.length === 0) return;
|
|
1073
|
+
if (!a || a.length !== e.length) {
|
|
1074
|
+
console.warn("[Masonry] restoreMany: items and indices arrays must have the same length");
|
|
1075
|
+
return;
|
|
1076
|
+
}
|
|
1077
|
+
const l = o.value, m = new Set(l.map((V) => V.id)), s = [];
|
|
1078
|
+
for (let V = 0; V < e.length; V++)
|
|
1079
|
+
m.has((Ge = e[V]) == null ? void 0 : Ge.id) || s.push({ item: e[V], index: a[V] });
|
|
1080
|
+
if (s.length === 0) return;
|
|
1081
|
+
const F = /* @__PURE__ */ new Map();
|
|
1082
|
+
for (const { item: V, index: Pt } of s)
|
|
1083
|
+
F.set(Pt, V);
|
|
1084
|
+
const W = s.length > 0 ? Math.max(...s.map(({ index: V }) => V)) : -1, ue = Math.max(l.length - 1, W), ve = [];
|
|
1085
|
+
let ce = 0;
|
|
1086
|
+
for (let V = 0; V <= ue; V++)
|
|
1087
|
+
F.has(V) ? ve.push(F.get(V)) : ce < l.length && (ve.push(l[ce]), ce++);
|
|
1088
|
+
for (; ce < l.length; )
|
|
1089
|
+
ve.push(l[ce]), ce++;
|
|
1090
|
+
o.value = ve, await G(), d.value || (await new Promise((V) => requestAnimationFrame(() => V())), requestAnimationFrame(() => {
|
|
1091
|
+
Z(ve);
|
|
1092
|
+
}));
|
|
1093
|
+
}
|
|
1094
|
+
function Oe(e) {
|
|
1060
1095
|
y.value && y.value.scrollTo({
|
|
1061
1096
|
top: 0,
|
|
1062
1097
|
behavior: (e == null ? void 0 : e.behavior) ?? "smooth",
|
|
1063
1098
|
...e
|
|
1064
1099
|
});
|
|
1065
1100
|
}
|
|
1066
|
-
async function
|
|
1067
|
-
|
|
1101
|
+
async function Et() {
|
|
1102
|
+
Oe({ behavior: "smooth" }), o.value = [], x.value = 0, await G(), g("remove-all:complete");
|
|
1068
1103
|
}
|
|
1069
|
-
function
|
|
1070
|
-
|
|
1104
|
+
function Tt() {
|
|
1105
|
+
P.value = he(p.value, u.value), Z(o.value), y.value && (L.value = y.value.scrollTop, O.value = y.value.clientHeight);
|
|
1071
1106
|
}
|
|
1072
|
-
let
|
|
1073
|
-
const
|
|
1074
|
-
async function
|
|
1075
|
-
if (!a && !
|
|
1076
|
-
const
|
|
1077
|
-
if (!
|
|
1078
|
-
if (
|
|
1107
|
+
let pe = !1;
|
|
1108
|
+
const _ = T(!1);
|
|
1109
|
+
async function ye(e, a = !1) {
|
|
1110
|
+
if (!a && !i.backfillEnabled || pe || _.value || w.value) return;
|
|
1111
|
+
const l = (e || 0) + (i.pageSize || 0);
|
|
1112
|
+
if (!i.pageSize || i.pageSize <= 0) return;
|
|
1113
|
+
if (b.value[b.value.length - 1] == null) {
|
|
1079
1114
|
w.value = !0;
|
|
1080
1115
|
return;
|
|
1081
1116
|
}
|
|
1082
|
-
if (!(o.value.length >=
|
|
1083
|
-
|
|
1117
|
+
if (!(o.value.length >= l)) {
|
|
1118
|
+
pe = !0, h.value = !0;
|
|
1084
1119
|
try {
|
|
1085
|
-
let
|
|
1086
|
-
for (g("backfill:start", { target:
|
|
1120
|
+
let s = 0;
|
|
1121
|
+
for (g("backfill:start", { target: l, fetched: o.value.length, calls: s }); o.value.length < l && s < i.backfillMaxCalls && b.value[b.value.length - 1] != null && !_.value && !w.value && (await ze(i.backfillDelayMs, (W, ue) => {
|
|
1087
1122
|
g("backfill:tick", {
|
|
1088
1123
|
fetched: o.value.length,
|
|
1089
|
-
target:
|
|
1090
|
-
calls:
|
|
1091
|
-
remainingMs:
|
|
1092
|
-
totalMs:
|
|
1124
|
+
target: l,
|
|
1125
|
+
calls: s,
|
|
1126
|
+
remainingMs: W,
|
|
1127
|
+
totalMs: ue
|
|
1093
1128
|
});
|
|
1094
|
-
}), !
|
|
1095
|
-
const
|
|
1096
|
-
if (
|
|
1129
|
+
}), !_.value); ) {
|
|
1130
|
+
const F = b.value[b.value.length - 1];
|
|
1131
|
+
if (F == null) {
|
|
1097
1132
|
w.value = !0;
|
|
1098
1133
|
break;
|
|
1099
1134
|
}
|
|
1100
1135
|
try {
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
|
-
M.value = _ instanceof Error ? _ : new Error(String(_));
|
|
1107
|
-
} finally {
|
|
1108
|
-
h.value = !1;
|
|
1136
|
+
const W = await Ee(F);
|
|
1137
|
+
if (_.value) break;
|
|
1138
|
+
M.value = null, b.value.push(W.nextPage), W.nextPage == null && (w.value = !0);
|
|
1139
|
+
} catch (W) {
|
|
1140
|
+
M.value = W instanceof Error ? W : new Error(String(W));
|
|
1109
1141
|
}
|
|
1110
|
-
|
|
1142
|
+
s++;
|
|
1111
1143
|
}
|
|
1112
|
-
g("backfill:stop", { fetched: o.value.length, calls:
|
|
1144
|
+
g("backfill:stop", { fetched: o.value.length, calls: s });
|
|
1113
1145
|
} finally {
|
|
1114
|
-
|
|
1146
|
+
pe = !1, h.value = !1;
|
|
1115
1147
|
}
|
|
1116
1148
|
}
|
|
1117
1149
|
}
|
|
1118
|
-
function
|
|
1119
|
-
|
|
1150
|
+
function Pe() {
|
|
1151
|
+
_.value = !0, h.value = !1, pe = !1;
|
|
1120
1152
|
}
|
|
1121
|
-
function
|
|
1122
|
-
|
|
1153
|
+
function It() {
|
|
1154
|
+
Pe(), _.value = !1, y.value && y.value.scrollTo({
|
|
1123
1155
|
top: 0,
|
|
1124
1156
|
behavior: "smooth"
|
|
1125
|
-
}), o.value = [],
|
|
1157
|
+
}), o.value = [], x.value = 0, H.value = i.loadAtPage, b.value = [i.loadAtPage], w.value = !1, M.value = null, K.value = {
|
|
1126
1158
|
distanceToTrigger: 0,
|
|
1127
1159
|
isNearTrigger: !1
|
|
1128
1160
|
};
|
|
1129
1161
|
}
|
|
1130
|
-
function
|
|
1131
|
-
|
|
1162
|
+
function Lt() {
|
|
1163
|
+
Pe(), o.value = [], z.value = 0, H.value = null, b.value = [], w.value = !1, M.value = null, h.value = !1, pe = !1, _.value = !1, n.value = 0, f.value = 0, $.value = !1, L.value = 0, O.value = 0, J.value = !1, K.value = {
|
|
1132
1164
|
distanceToTrigger: 0,
|
|
1133
1165
|
isNearTrigger: !1
|
|
1134
1166
|
}, N.value.clear(), y.value && y.value.scrollTo({
|
|
@@ -1137,154 +1169,155 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
1137
1169
|
// Instant scroll for destroy
|
|
1138
1170
|
});
|
|
1139
1171
|
}
|
|
1140
|
-
const
|
|
1172
|
+
const fe = at(async () => {
|
|
1141
1173
|
if (d.value) return;
|
|
1142
|
-
y.value && (
|
|
1143
|
-
const e =
|
|
1144
|
-
|
|
1145
|
-
}, 200),
|
|
1146
|
-
function
|
|
1147
|
-
d.value && (
|
|
1174
|
+
y.value && (L.value = y.value.scrollTop, O.value = y.value.clientHeight), J.value = !0, await G(), await new Promise((a) => requestAnimationFrame(() => a())), J.value = !1;
|
|
1175
|
+
const e = Be(o.value, P.value);
|
|
1176
|
+
pt(e), ae(e);
|
|
1177
|
+
}, 200), Re = at(Tt, 200);
|
|
1178
|
+
function je(e) {
|
|
1179
|
+
d.value && ($.value = !0, R.value = e.touches[0].clientY, X.value = f.value, e.preventDefault());
|
|
1148
1180
|
}
|
|
1149
|
-
function
|
|
1150
|
-
if (!d.value ||
|
|
1151
|
-
const a = e.touches[0].clientY -
|
|
1152
|
-
f.value =
|
|
1181
|
+
function Ce(e) {
|
|
1182
|
+
if (!d.value || !$.value) return;
|
|
1183
|
+
const a = e.touches[0].clientY - R.value;
|
|
1184
|
+
f.value = X.value + a, e.preventDefault();
|
|
1153
1185
|
}
|
|
1154
|
-
function
|
|
1155
|
-
if (!d.value ||
|
|
1156
|
-
|
|
1157
|
-
const a = f.value -
|
|
1158
|
-
Math.abs(a) > 100 ? a > 0 &&
|
|
1186
|
+
function qe(e) {
|
|
1187
|
+
if (!d.value || !$.value) return;
|
|
1188
|
+
$.value = !1;
|
|
1189
|
+
const a = f.value - X.value;
|
|
1190
|
+
Math.abs(a) > 100 ? a > 0 && U.value ? Ue() : a < 0 && C.value ? Ve() : re() : re(), e.preventDefault();
|
|
1159
1191
|
}
|
|
1160
|
-
function
|
|
1161
|
-
d.value && (
|
|
1192
|
+
function Ye(e) {
|
|
1193
|
+
d.value && ($.value = !0, R.value = e.clientY, X.value = f.value, e.preventDefault());
|
|
1162
1194
|
}
|
|
1163
|
-
function
|
|
1164
|
-
if (!d.value ||
|
|
1165
|
-
const a = e.clientY -
|
|
1166
|
-
f.value =
|
|
1195
|
+
function Se(e) {
|
|
1196
|
+
if (!d.value || !$.value) return;
|
|
1197
|
+
const a = e.clientY - R.value;
|
|
1198
|
+
f.value = X.value + a, e.preventDefault();
|
|
1167
1199
|
}
|
|
1168
|
-
function
|
|
1169
|
-
if (!d.value ||
|
|
1170
|
-
|
|
1171
|
-
const a = f.value -
|
|
1172
|
-
Math.abs(a) > 100 ? a > 0 &&
|
|
1200
|
+
function $e(e) {
|
|
1201
|
+
if (!d.value || !$.value) return;
|
|
1202
|
+
$.value = !1;
|
|
1203
|
+
const a = f.value - X.value;
|
|
1204
|
+
Math.abs(a) > 100 ? a > 0 && U.value ? Ue() : a < 0 && C.value ? Ve() : re() : re(), e.preventDefault();
|
|
1173
1205
|
}
|
|
1174
|
-
function
|
|
1175
|
-
if (!
|
|
1176
|
-
|
|
1206
|
+
function Ve() {
|
|
1207
|
+
if (!C.value) {
|
|
1208
|
+
me();
|
|
1177
1209
|
return;
|
|
1178
1210
|
}
|
|
1179
|
-
n.value++,
|
|
1211
|
+
n.value++, re(), n.value >= o.value.length - 5 && me();
|
|
1180
1212
|
}
|
|
1181
|
-
function
|
|
1182
|
-
|
|
1213
|
+
function Ue() {
|
|
1214
|
+
U.value && (n.value--, re());
|
|
1183
1215
|
}
|
|
1184
|
-
function
|
|
1185
|
-
if (!
|
|
1186
|
-
const e =
|
|
1216
|
+
function re() {
|
|
1217
|
+
if (!Y.value) return;
|
|
1218
|
+
const e = Y.value.clientHeight;
|
|
1187
1219
|
f.value = -n.value * e;
|
|
1188
1220
|
}
|
|
1189
|
-
function
|
|
1190
|
-
!d.value && n.value > 0 && (n.value = 0, f.value = 0), d.value && o.value.length === 0 && !h.value &&
|
|
1221
|
+
function _e() {
|
|
1222
|
+
!d.value && n.value > 0 && (n.value = 0, f.value = 0), d.value && o.value.length === 0 && !h.value && Le(b.value[0]), d.value && re();
|
|
1191
1223
|
}
|
|
1192
|
-
function
|
|
1193
|
-
H.value = a,
|
|
1224
|
+
function kt(e, a, l) {
|
|
1225
|
+
H.value = a, b.value = [a], b.value.push(l), w.value = l == null, se(e, "init"), d.value ? (o.value = [...o.value, ...e], n.value === 0 && o.value.length > 0 && (f.value = 0)) : (Z([...o.value, ...e]), ae());
|
|
1194
1226
|
}
|
|
1195
|
-
return
|
|
1227
|
+
return oe(
|
|
1196
1228
|
p,
|
|
1197
1229
|
() => {
|
|
1198
|
-
d.value || y.value && (
|
|
1230
|
+
d.value || y.value && (P.value = he(p.value, u.value), Z(o.value));
|
|
1199
1231
|
},
|
|
1200
1232
|
{ deep: !0 }
|
|
1201
|
-
),
|
|
1202
|
-
E.value && E.value.width !== void 0 ?
|
|
1203
|
-
}),
|
|
1204
|
-
e && !d.value ? (e.removeEventListener("scroll",
|
|
1205
|
-
}, { immediate: !0 }),
|
|
1206
|
-
a === void 0 && e === !1 ||
|
|
1207
|
-
e ? (document.addEventListener("mousemove",
|
|
1233
|
+
), oe(() => i.layoutMode, () => {
|
|
1234
|
+
E.value && E.value.width !== void 0 ? u.value = E.value.width : r.value && (u.value = r.value.clientWidth);
|
|
1235
|
+
}), oe(y, (e) => {
|
|
1236
|
+
e && !d.value ? (e.removeEventListener("scroll", fe), e.addEventListener("scroll", fe, { passive: !0 })) : e && e.removeEventListener("scroll", fe);
|
|
1237
|
+
}, { immediate: !0 }), oe(d, (e, a) => {
|
|
1238
|
+
a === void 0 && e === !1 || G(() => {
|
|
1239
|
+
e ? (document.addEventListener("mousemove", Se), document.addEventListener("mouseup", $e), y.value && y.value.removeEventListener("scroll", fe), n.value = 0, f.value = 0, o.value.length > 0 && re()) : (document.removeEventListener("mousemove", Se), document.removeEventListener("mouseup", $e), y.value && r.value && (E.value && E.value.width !== void 0 ? u.value = E.value.width : u.value = r.value.clientWidth, y.value.removeEventListener("scroll", fe), y.value.addEventListener("scroll", fe, { passive: !0 }), o.value.length > 0 && (P.value = he(p.value, u.value), Z(o.value), L.value = y.value.scrollTop, O.value = y.value.clientHeight, ae())));
|
|
1208
1240
|
});
|
|
1209
|
-
}, { immediate: !0 }),
|
|
1210
|
-
e && (e.addEventListener("touchstart",
|
|
1211
|
-
}),
|
|
1212
|
-
d.value && e > 0 && a === 0 && (n.value = 0,
|
|
1213
|
-
}),
|
|
1241
|
+
}, { immediate: !0 }), oe(Y, (e) => {
|
|
1242
|
+
e && (e.addEventListener("touchstart", je, { passive: !1 }), e.addEventListener("touchmove", Ce, { passive: !1 }), e.addEventListener("touchend", qe), e.addEventListener("mousedown", Ye));
|
|
1243
|
+
}), oe(() => o.value.length, (e, a) => {
|
|
1244
|
+
d.value && e > 0 && a === 0 && (n.value = 0, G(() => re()));
|
|
1245
|
+
}), oe(r, (e) => {
|
|
1214
1246
|
S && (S.disconnect(), S = null), e && typeof ResizeObserver < "u" ? (S = new ResizeObserver((a) => {
|
|
1215
1247
|
if (!E.value)
|
|
1216
|
-
for (const
|
|
1217
|
-
const m =
|
|
1218
|
-
|
|
1248
|
+
for (const l of a) {
|
|
1249
|
+
const m = l.contentRect.width, s = l.contentRect.height;
|
|
1250
|
+
u.value !== m && (u.value = m), x.value !== s && (x.value = s);
|
|
1219
1251
|
}
|
|
1220
|
-
}), S.observe(e), E.value || (
|
|
1221
|
-
}, { immediate: !0 }),
|
|
1222
|
-
e !== a && e > 0 && !d.value && y.value && o.value.length > 0 &&
|
|
1223
|
-
|
|
1252
|
+
}), S.observe(e), E.value || (u.value = e.clientWidth, x.value = e.clientHeight)) : e && (E.value || (u.value = e.clientWidth, x.value = e.clientHeight));
|
|
1253
|
+
}, { immediate: !0 }), oe(u, (e, a) => {
|
|
1254
|
+
e !== a && e > 0 && !d.value && y.value && o.value.length > 0 && G(() => {
|
|
1255
|
+
P.value = he(p.value, e), Z(o.value), ae();
|
|
1224
1256
|
});
|
|
1225
|
-
}),
|
|
1257
|
+
}), rt(async () => {
|
|
1226
1258
|
try {
|
|
1227
|
-
await
|
|
1228
|
-
const e =
|
|
1229
|
-
|
|
1259
|
+
await G(), r.value && !S && (u.value = r.value.clientWidth, x.value = r.value.clientHeight), d.value || (P.value = he(p.value, u.value), y.value && (L.value = y.value.scrollTop, O.value = y.value.clientHeight));
|
|
1260
|
+
const e = i.loadAtPage;
|
|
1261
|
+
b.value = [e], i.skipInitialLoad || await Le(b.value[0]), d.value ? G(() => re()) : ae();
|
|
1230
1262
|
} catch (e) {
|
|
1231
1263
|
console.error("Error during component initialization:", e), h.value = !1;
|
|
1232
1264
|
}
|
|
1233
|
-
window.addEventListener("resize",
|
|
1234
|
-
}),
|
|
1265
|
+
window.addEventListener("resize", Re), window.addEventListener("resize", _e);
|
|
1266
|
+
}), ot(() => {
|
|
1235
1267
|
var e;
|
|
1236
|
-
S && (S.disconnect(), S = null), (e = y.value) == null || e.removeEventListener("scroll",
|
|
1237
|
-
}), (e, a) => (
|
|
1268
|
+
S && (S.disconnect(), S = null), (e = y.value) == null || e.removeEventListener("scroll", fe), window.removeEventListener("resize", Re), window.removeEventListener("resize", _e), Y.value && (Y.value.removeEventListener("touchstart", je), Y.value.removeEventListener("touchmove", Ce), Y.value.removeEventListener("touchend", qe), Y.value.removeEventListener("mousedown", Ye)), document.removeEventListener("mousemove", Se), document.removeEventListener("mouseup", $e);
|
|
1269
|
+
}), (e, a) => (D(), B("div", {
|
|
1238
1270
|
ref_key: "wrapper",
|
|
1239
|
-
ref:
|
|
1271
|
+
ref: r,
|
|
1240
1272
|
class: "w-full h-full flex flex-col relative"
|
|
1241
1273
|
}, [
|
|
1242
|
-
d.value ? (
|
|
1274
|
+
d.value ? (D(), B("div", {
|
|
1243
1275
|
key: 0,
|
|
1244
|
-
class:
|
|
1276
|
+
class: de(["overflow-hidden w-full flex-1 swipe-container touch-none select-none", { "force-motion": i.forceMotion, "cursor-grab": !$.value, "cursor-grabbing": $.value }]),
|
|
1245
1277
|
ref_key: "swipeContainer",
|
|
1246
|
-
ref:
|
|
1278
|
+
ref: Y,
|
|
1247
1279
|
style: { height: "100%", "max-height": "100%", position: "relative" }
|
|
1248
1280
|
}, [
|
|
1249
|
-
|
|
1281
|
+
j("div", {
|
|
1250
1282
|
class: "relative w-full",
|
|
1251
|
-
style:
|
|
1283
|
+
style: Me({
|
|
1252
1284
|
transform: `translateY(${f.value}px)`,
|
|
1253
|
-
transition:
|
|
1285
|
+
transition: $.value ? "none" : `transform ${t.transitionDurationMs}ms ${t.transitionEasing}`,
|
|
1254
1286
|
height: `${o.value.length * 100}%`
|
|
1255
1287
|
})
|
|
1256
1288
|
}, [
|
|
1257
|
-
(
|
|
1258
|
-
key: `${
|
|
1289
|
+
(D(!0), B(Je, null, Ke(o.value, (l, m) => (D(), B("div", {
|
|
1290
|
+
key: `${l.page}-${l.id}`,
|
|
1259
1291
|
class: "absolute top-0 left-0 w-full",
|
|
1260
|
-
style:
|
|
1292
|
+
style: Me({
|
|
1261
1293
|
top: `${m * (100 / o.value.length)}%`,
|
|
1262
1294
|
height: `${100 / o.value.length}%`
|
|
1263
1295
|
})
|
|
1264
1296
|
}, [
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
item:
|
|
1269
|
-
remove:
|
|
1297
|
+
j("div", ya, [
|
|
1298
|
+
j("div", wa, [
|
|
1299
|
+
ee(e.$slots, "default", {
|
|
1300
|
+
item: l,
|
|
1301
|
+
remove: ge,
|
|
1302
|
+
index: l.originalIndex ?? i.items.indexOf(l)
|
|
1270
1303
|
}, () => [
|
|
1271
|
-
|
|
1272
|
-
item:
|
|
1273
|
-
remove:
|
|
1304
|
+
He(Ie, {
|
|
1305
|
+
item: l,
|
|
1306
|
+
remove: ge,
|
|
1274
1307
|
"header-height": p.value.header,
|
|
1275
1308
|
"footer-height": p.value.footer,
|
|
1276
1309
|
"in-swipe-mode": !0,
|
|
1277
1310
|
"is-active": m === n.value,
|
|
1278
|
-
"onPreload:success": a[0] || (a[0] = (
|
|
1279
|
-
"onPreload:error": a[1] || (a[1] = (
|
|
1280
|
-
onMouseEnter: a[2] || (a[2] = (
|
|
1281
|
-
onMouseLeave: a[3] || (a[3] = (
|
|
1311
|
+
"onPreload:success": a[0] || (a[0] = (s) => g("item:preload:success", s)),
|
|
1312
|
+
"onPreload:error": a[1] || (a[1] = (s) => g("item:preload:error", s)),
|
|
1313
|
+
onMouseEnter: a[2] || (a[2] = (s) => g("item:mouse-enter", s)),
|
|
1314
|
+
onMouseLeave: a[3] || (a[3] = (s) => g("item:mouse-leave", s))
|
|
1282
1315
|
}, {
|
|
1283
|
-
header:
|
|
1284
|
-
|
|
1316
|
+
header: we((s) => [
|
|
1317
|
+
ee(e.$slots, "item-header", xe({ ref_for: !0 }, s), void 0, !0)
|
|
1285
1318
|
]),
|
|
1286
|
-
footer:
|
|
1287
|
-
|
|
1319
|
+
footer: we((s) => [
|
|
1320
|
+
ee(e.$slots, "item-footer", xe({ ref_for: !0 }, s), void 0, !0)
|
|
1288
1321
|
]),
|
|
1289
1322
|
_: 2
|
|
1290
1323
|
}, 1032, ["item", "header-height", "footer-height", "is-active"])
|
|
@@ -1293,61 +1326,62 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
1293
1326
|
])
|
|
1294
1327
|
], 4))), 128))
|
|
1295
1328
|
], 4),
|
|
1296
|
-
w.value && o.value.length > 0 ? (
|
|
1297
|
-
|
|
1298
|
-
a[8] || (a[8] =
|
|
1329
|
+
w.value && o.value.length > 0 ? (D(), B("div", xa, [
|
|
1330
|
+
ee(e.$slots, "end-message", {}, () => [
|
|
1331
|
+
a[8] || (a[8] = j("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
|
|
1299
1332
|
], !0)
|
|
1300
|
-
])) :
|
|
1301
|
-
M.value && o.value.length > 0 ? (
|
|
1302
|
-
|
|
1303
|
-
|
|
1333
|
+
])) : le("", !0),
|
|
1334
|
+
M.value && o.value.length > 0 ? (D(), B("div", ba, [
|
|
1335
|
+
ee(e.$slots, "error-message", { error: M.value }, () => [
|
|
1336
|
+
j("p", Ma, "Failed to load content: " + Ae(M.value.message), 1)
|
|
1304
1337
|
], !0)
|
|
1305
|
-
])) :
|
|
1306
|
-
], 2)) : (
|
|
1338
|
+
])) : le("", !0)
|
|
1339
|
+
], 2)) : (D(), B("div", {
|
|
1307
1340
|
key: 1,
|
|
1308
|
-
class:
|
|
1341
|
+
class: de(["overflow-auto w-full flex-1 masonry-container", { "force-motion": i.forceMotion }]),
|
|
1309
1342
|
ref_key: "container",
|
|
1310
1343
|
ref: y
|
|
1311
1344
|
}, [
|
|
1312
|
-
|
|
1345
|
+
j("div", {
|
|
1313
1346
|
class: "relative",
|
|
1314
|
-
style:
|
|
1347
|
+
style: Me({ height: `${z.value}px`, "--masonry-duration": `${t.transitionDurationMs}ms`, "--masonry-leave-duration": `${t.leaveDurationMs}ms`, "--masonry-ease": t.transitionEasing })
|
|
1315
1348
|
}, [
|
|
1316
|
-
|
|
1349
|
+
He(St, {
|
|
1317
1350
|
name: "masonry",
|
|
1318
1351
|
css: !1,
|
|
1319
|
-
onEnter:
|
|
1320
|
-
onBeforeEnter:
|
|
1321
|
-
onLeave:
|
|
1322
|
-
onBeforeLeave:
|
|
1352
|
+
onEnter: ft,
|
|
1353
|
+
onBeforeEnter: dt,
|
|
1354
|
+
onLeave: ht,
|
|
1355
|
+
onBeforeLeave: mt
|
|
1323
1356
|
}, {
|
|
1324
|
-
default:
|
|
1325
|
-
(
|
|
1326
|
-
key: `${
|
|
1357
|
+
default: we(() => [
|
|
1358
|
+
(D(!0), B(Je, null, Ke(gt.value, (l, m) => (D(), B("div", xe({
|
|
1359
|
+
key: `${l.page}-${l.id}`,
|
|
1327
1360
|
class: "absolute masonry-item",
|
|
1328
1361
|
ref_for: !0
|
|
1329
|
-
},
|
|
1330
|
-
|
|
1331
|
-
item:
|
|
1332
|
-
remove:
|
|
1362
|
+
}, $t(oa)(l, m)), [
|
|
1363
|
+
ee(e.$slots, "default", {
|
|
1364
|
+
item: l,
|
|
1365
|
+
remove: ge,
|
|
1366
|
+
index: l.originalIndex ?? t.items.indexOf(l)
|
|
1333
1367
|
}, () => [
|
|
1334
|
-
|
|
1335
|
-
item:
|
|
1336
|
-
remove:
|
|
1368
|
+
He(Ie, {
|
|
1369
|
+
item: l,
|
|
1370
|
+
remove: ge,
|
|
1337
1371
|
"header-height": p.value.header,
|
|
1338
1372
|
"footer-height": p.value.footer,
|
|
1339
1373
|
"in-swipe-mode": !1,
|
|
1340
1374
|
"is-active": !1,
|
|
1341
|
-
"onPreload:success": a[4] || (a[4] = (
|
|
1342
|
-
"onPreload:error": a[5] || (a[5] = (
|
|
1343
|
-
onMouseEnter: a[6] || (a[6] = (
|
|
1344
|
-
onMouseLeave: a[7] || (a[7] = (
|
|
1375
|
+
"onPreload:success": a[4] || (a[4] = (s) => g("item:preload:success", s)),
|
|
1376
|
+
"onPreload:error": a[5] || (a[5] = (s) => g("item:preload:error", s)),
|
|
1377
|
+
onMouseEnter: a[6] || (a[6] = (s) => g("item:mouse-enter", s)),
|
|
1378
|
+
onMouseLeave: a[7] || (a[7] = (s) => g("item:mouse-leave", s))
|
|
1345
1379
|
}, {
|
|
1346
|
-
header:
|
|
1347
|
-
|
|
1380
|
+
header: we((s) => [
|
|
1381
|
+
ee(e.$slots, "item-header", xe({ ref_for: !0 }, s), void 0, !0)
|
|
1348
1382
|
]),
|
|
1349
|
-
footer:
|
|
1350
|
-
|
|
1383
|
+
footer: we((s) => [
|
|
1384
|
+
ee(e.$slots, "item-footer", xe({ ref_for: !0 }, s), void 0, !0)
|
|
1351
1385
|
]),
|
|
1352
1386
|
_: 2
|
|
1353
1387
|
}, 1032, ["item", "header-height", "footer-height"])
|
|
@@ -1357,31 +1391,31 @@ const la = { class: "flex-1 relative min-h-0" }, ra = { class: "w-full h-full ro
|
|
|
1357
1391
|
_: 3
|
|
1358
1392
|
})
|
|
1359
1393
|
], 4),
|
|
1360
|
-
w.value && o.value.length > 0 ? (
|
|
1361
|
-
|
|
1362
|
-
a[9] || (a[9] =
|
|
1394
|
+
w.value && o.value.length > 0 ? (D(), B("div", Ea, [
|
|
1395
|
+
ee(e.$slots, "end-message", {}, () => [
|
|
1396
|
+
a[9] || (a[9] = j("p", { class: "text-gray-500 dark:text-gray-400" }, "You've reached the end", -1))
|
|
1363
1397
|
], !0)
|
|
1364
|
-
])) :
|
|
1365
|
-
M.value && o.value.length > 0 ? (
|
|
1366
|
-
|
|
1367
|
-
|
|
1398
|
+
])) : le("", !0),
|
|
1399
|
+
M.value && o.value.length > 0 ? (D(), B("div", Ta, [
|
|
1400
|
+
ee(e.$slots, "error-message", { error: M.value }, () => [
|
|
1401
|
+
j("p", Ia, "Failed to load content: " + Ae(M.value.message), 1)
|
|
1368
1402
|
], !0)
|
|
1369
|
-
])) :
|
|
1403
|
+
])) : le("", !0)
|
|
1370
1404
|
], 2))
|
|
1371
1405
|
], 512));
|
|
1372
1406
|
}
|
|
1373
|
-
}),
|
|
1407
|
+
}), ka = (t, v) => {
|
|
1374
1408
|
const c = t.__vccOpts || t;
|
|
1375
|
-
for (const [
|
|
1376
|
-
c[
|
|
1409
|
+
for (const [i, I] of v)
|
|
1410
|
+
c[i] = I;
|
|
1377
1411
|
return c;
|
|
1378
|
-
},
|
|
1412
|
+
}, nt = /* @__PURE__ */ ka(La, [["__scopeId", "data-v-2168600e"]]), Sa = {
|
|
1379
1413
|
install(t) {
|
|
1380
|
-
t.component("WyxosMasonry",
|
|
1414
|
+
t.component("WyxosMasonry", nt), t.component("WMasonry", nt), t.component("WyxosMasonryItem", Ie), t.component("WMasonryItem", Ie);
|
|
1381
1415
|
}
|
|
1382
1416
|
};
|
|
1383
1417
|
export {
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1418
|
+
nt as Masonry,
|
|
1419
|
+
Ie as MasonryItem,
|
|
1420
|
+
Sa as default
|
|
1387
1421
|
};
|