vane-waterfall 2.0.1 → 2.0.2

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.
Files changed (65) hide show
  1. package/README.md +4 -4
  2. package/dist/chunks/WaterfallCore-EdAZuWAY.js +695 -0
  3. package/dist/chunks/{doc-kTbJE7rY.js → doc-BCmEnh39.js} +31 -29
  4. package/dist/chunks/doc-BQQoKNto.js +126 -0
  5. package/dist/chunks/{doc-j4W9SUrY.js → doc-BSnWbrkH.js} +39 -27
  6. package/dist/chunks/{doc-BCGQ8Cp5.js → doc-BXaJl1By.js} +54 -41
  7. package/dist/chunks/{doc-CraXjOaA.js → doc-BindRMfO.js} +30 -26
  8. package/dist/chunks/{doc-78xF08vt.js → doc-BmoijI6q.js} +35 -35
  9. package/dist/chunks/{doc-BtzhgTYj.js → doc-CN4edvn_.js} +27 -27
  10. package/dist/chunks/{doc-NhL4Ux8q.js → doc-CkU5GtLw.js} +65 -54
  11. package/dist/chunks/doc-DAieSXLy.js +86 -0
  12. package/dist/chunks/{doc-BP0DmB7-.js → doc-D_ozEn0Q.js} +27 -27
  13. package/dist/chunks/{doc-f4Uijujv.js → doc-KN6Bvmty.js} +54 -32
  14. package/dist/chunks/{doc-B6kLfMPv.js → doc-a0MK2S3n.js} +61 -40
  15. package/dist/chunks/{index-COaun3nf.js → index-B8o6R4RZ.js} +2 -2
  16. package/dist/chunks/{index-DXAtA2f6.js → index-BFyYpEY_.js} +2 -2
  17. package/dist/chunks/{index-wLI6UXkY.js → index-CF0tYRop.js} +1 -1
  18. package/dist/chunks/{index-gjoCq0yC.js → index-CJR0Buju.js} +4 -4
  19. package/dist/chunks/{index-DsRLmBW-.js → index-DHTB3QEP.js} +3 -3
  20. package/dist/chunks/withPlugins-DG3YpSgL.js +655 -0
  21. package/dist/components/WaterfallPlugin/WaterfallCore.d.ts +19 -0
  22. package/dist/components/WaterfallPlugin/WaterfallCore.d.ts.map +1 -1
  23. package/dist/components/WaterfallPlugin/layout.d.ts +7 -0
  24. package/dist/components/WaterfallPlugin/layout.d.ts.map +1 -1
  25. package/dist/components/WaterfallPlugin/plugins/types.d.ts +3 -0
  26. package/dist/components/WaterfallPlugin/plugins/types.d.ts.map +1 -1
  27. package/dist/components/WaterfallPlugin/withPlugins.d.ts.map +1 -1
  28. package/dist/custom-plugins/A11yPlugin/create.d.ts.map +1 -1
  29. package/dist/custom-plugins/A11yPlugin/index.js +1 -1
  30. package/dist/custom-plugins/BookmarkPlugin/create.d.ts.map +1 -1
  31. package/dist/custom-plugins/BookmarkPlugin/index.js +1 -1
  32. package/dist/custom-plugins/ClickAnalyticsPlugin/create.d.ts +2 -0
  33. package/dist/custom-plugins/ClickAnalyticsPlugin/create.d.ts.map +1 -1
  34. package/dist/custom-plugins/ClickAnalyticsPlugin/index.js +1 -1
  35. package/dist/custom-plugins/GapPlugin/create.d.ts.map +1 -1
  36. package/dist/custom-plugins/GapPlugin/index.js +1 -1
  37. package/dist/custom-plugins/GroupingPlugin/create.d.ts.map +1 -1
  38. package/dist/custom-plugins/GroupingPlugin/index.js +1 -1
  39. package/dist/custom-plugins/HeatmapAnalyticsPlugin/create.d.ts +2 -0
  40. package/dist/custom-plugins/HeatmapAnalyticsPlugin/create.d.ts.map +1 -1
  41. package/dist/custom-plugins/HeatmapAnalyticsPlugin/index.js +1 -1
  42. package/dist/custom-plugins/InfiniteScrollPlugin/create.d.ts.map +1 -1
  43. package/dist/custom-plugins/InfiniteScrollPlugin/index.js +1 -1
  44. package/dist/custom-plugins/PaginationPlugin/create.d.ts.map +1 -1
  45. package/dist/custom-plugins/PaginationPlugin/index.js +1 -1
  46. package/dist/custom-plugins/RecyclePlugin/create.d.ts.map +1 -1
  47. package/dist/custom-plugins/RecyclePlugin/index.js +1 -1
  48. package/dist/custom-plugins/StatePersistencePlugin/create.d.ts.map +1 -1
  49. package/dist/custom-plugins/StatePersistencePlugin/index.js +1 -1
  50. package/dist/custom-plugins/StickyHeaderPlugin/create.d.ts.map +1 -1
  51. package/dist/custom-plugins/StickyHeaderPlugin/index.js +1 -1
  52. package/dist/custom-plugins/URLSyncPlugin/create.d.ts.map +1 -1
  53. package/dist/custom-plugins/URLSyncPlugin/index.js +1 -1
  54. package/dist/custom-plugins/index.js +5 -5
  55. package/dist/entries/core.js +1 -1
  56. package/dist/entries/plugins.js +6 -6
  57. package/dist/index.js +2 -2
  58. package/dist/presets/dashboard/index.js +2 -2
  59. package/dist/presets/photo-feed/index.js +2 -2
  60. package/dist/presets/product-feed/index.js +1 -1
  61. package/package.json +31 -23
  62. package/dist/chunks/WaterfallCore-BSXw7bl_.js +0 -581
  63. package/dist/chunks/doc-B-7dugGv.js +0 -79
  64. package/dist/chunks/doc-DJjxOYzW.js +0 -111
  65. package/dist/chunks/withPlugins-DLoKg4AP.js +0 -559
@@ -0,0 +1,655 @@
1
+ import { jsxs as he, Fragment as pe, jsx as re } from "react/jsx-runtime";
2
+ import we, { useRef as L, useState as A, useCallback as E, useMemo as U, useLayoutEffect as ie, createContext as ye, forwardRef as ve, useEffect as X } from "react";
3
+ function be() {
4
+ const o = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map(), i = (e, a) => {
5
+ const l = o.get(e);
6
+ if (l)
7
+ for (const r of [...l])
8
+ try {
9
+ r(a);
10
+ } catch (s) {
11
+ console.warn(`[PluginBus] handler error for event "${e}"`, s);
12
+ }
13
+ }, g = (e, a) => {
14
+ let l = o.get(e);
15
+ return l || (l = /* @__PURE__ */ new Set(), o.set(e, l)), l.add(a), () => {
16
+ l?.delete(a);
17
+ };
18
+ }, d = (e, a) => {
19
+ const l = (r) => {
20
+ a(r), u(e, l);
21
+ };
22
+ return g(e, l);
23
+ }, u = (e, a) => {
24
+ if (!a) {
25
+ o.delete(e);
26
+ return;
27
+ }
28
+ o.get(e)?.delete(a);
29
+ };
30
+ return { emit: i, on: g, once: d, off: u, getData: (e) => t.get(e), setData: (e, a) => {
31
+ const l = t.get(e);
32
+ t.set(e, a), l !== a && i(e, a);
33
+ }, deleteData: (e) => {
34
+ const a = t.has(e);
35
+ t.delete(e), a && i(e, void 0);
36
+ }, hasData: (e) => t.has(e), getAll: () => {
37
+ const e = {};
38
+ return t.forEach((a, l) => {
39
+ e[l] = a;
40
+ }), e;
41
+ }, clear: () => {
42
+ o.clear(), t.clear();
43
+ } };
44
+ }
45
+ function fe(o) {
46
+ const t = new Map(o.map((a) => [a.name, a])), i = [];
47
+ for (const a of o)
48
+ for (const l of a.dependencies ?? [])
49
+ t.has(l) || i.push(`${a.name} -> ${l}`);
50
+ const g = [], d = /* @__PURE__ */ new Set(), u = [...o], e = (a) => (a.dependencies ?? []).every((l) => d.has(l) || !t.has(l));
51
+ for (; u.length > 0; ) {
52
+ const a = u.filter(e);
53
+ if (a.length === 0)
54
+ throw new Error(
55
+ `[vane/plugin-core] 插件循环依赖: ${u.map((r) => r.name).join(" <-> ")}`
56
+ );
57
+ let l = a[0];
58
+ for (const r of a)
59
+ (r.priority ?? 0) > (l.priority ?? 0) && (l = r);
60
+ g.push(l), d.add(l.name), u.splice(u.indexOf(l), 1);
61
+ }
62
+ return i.length > 0 && console.warn(
63
+ `[vane/plugin-core] 以下插件依赖未注册,将被忽略:
64
+ ${i.join(`
65
+ `)}`
66
+ ), g;
67
+ }
68
+ async function Pe(o, t = {}) {
69
+ const { timeout: i = 3e3, name: g = "anonymous", hook: d = "unknown" } = t;
70
+ if (!i || i <= 0)
71
+ return await o();
72
+ let u;
73
+ const e = new Promise((a, l) => {
74
+ u = setTimeout(() => {
75
+ l(new Error(`[vane/plugin-core] 插件 ${g} 的钩子 ${d} 超时(${i}ms)`));
76
+ }, i);
77
+ });
78
+ try {
79
+ return await Promise.race([Promise.resolve().then(o), e]);
80
+ } finally {
81
+ u && clearTimeout(u);
82
+ }
83
+ }
84
+ const Ie = /* @__PURE__ */ new Set(["onMount", "onUnmount", "onPropsChange", "onError"]);
85
+ function ke(o = {}) {
86
+ const t = o.logger ?? console, i = o.sandbox ?? !0, g = o.timeout ?? 3e3, d = [], u = [], e = /* @__PURE__ */ new Map(), a = () => fe([...e.values()].filter((r) => r.enabled !== !1)), l = (r) => {
87
+ e.set(r.name, { ...r, enabled: r.enabled ?? !0 }), r.init && Promise.resolve(r.init()).catch((s) => {
88
+ t.warn(`[PluginManager] init failed for ${r.name}`, s);
89
+ });
90
+ };
91
+ return {
92
+ register: l,
93
+ registerAll: (r) => {
94
+ for (const s of r) l(s);
95
+ },
96
+ unregister: (r) => {
97
+ const s = e.get(r);
98
+ s && (s.destroy && Promise.resolve(s.destroy()).catch((x) => {
99
+ t.warn(`[PluginManager] destroy failed for ${s.name}`, x);
100
+ }), e.delete(r));
101
+ },
102
+ getPlugin: (r) => e.get(r),
103
+ getAllPlugins: () => [...e.values()],
104
+ getEnabledPlugins: () => [...e.values()].filter((r) => r.enabled !== !1),
105
+ getExecutionOrder: a,
106
+ enable: (r) => {
107
+ const s = e.get(r);
108
+ s && (s.enabled = !0);
109
+ },
110
+ disable: (r) => {
111
+ const s = e.get(r);
112
+ s && (s.enabled = !1);
113
+ },
114
+ has: (r) => e.has(r),
115
+ executeHook: async (r, s, ...x) => {
116
+ for (const p of a()) {
117
+ const H = p.hooks?.[r];
118
+ if (typeof H != "function") continue;
119
+ const D = p.sandbox ?? i, z = p.timeout ?? g;
120
+ let R;
121
+ try {
122
+ R = D ? await Pe(
123
+ () => H(s, ...x),
124
+ { timeout: z, name: p.name, hook: String(r) }
125
+ ) : await H(s, ...x);
126
+ } catch ($) {
127
+ if (d.push({ plugin: p.name, hook: String(r), error: $ }), t.warn(
128
+ `[PluginManager] hook ${String(r)} failed in ${p.name}`,
129
+ $
130
+ ), o.onError?.(p.name, String(r), $), r === "onError") break;
131
+ continue;
132
+ }
133
+ if (Ie.has(String(r)) && typeof R == "function") {
134
+ u.push(R);
135
+ continue;
136
+ }
137
+ if (R === !1) return !1;
138
+ if (R !== void 0 && R !== !0) return R;
139
+ }
140
+ },
141
+ clear: () => {
142
+ const r = u.splice(0);
143
+ for (const s of r.reverse())
144
+ try {
145
+ s();
146
+ } catch (x) {
147
+ t.warn("[PluginManager] cleanup failed", x);
148
+ }
149
+ for (const s of e.values())
150
+ s.destroy && Promise.resolve(s.destroy()).catch((x) => {
151
+ t.warn(`[PluginManager] destroy failed for ${s.name}`, x);
152
+ });
153
+ e.clear();
154
+ },
155
+ getErrors: () => [...d]
156
+ };
157
+ }
158
+ var Me = Object.defineProperty, xe = (o, t, i) => t in o ? Me(o, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : o[t] = i, Ce = (o, t, i) => xe(o, t + "", i);
159
+ class me extends we.Component {
160
+ constructor() {
161
+ super(...arguments), Ce(this, "state", { error: null });
162
+ }
163
+ static getDerivedStateFromError(t) {
164
+ return { error: t };
165
+ }
166
+ componentDidCatch(t, i) {
167
+ console.warn("[vane/plugin-core] 插件渲染错误已被隔离", t, i), this.props.onError?.(t, i);
168
+ }
169
+ render() {
170
+ const { error: t } = this.state;
171
+ return t ? this.props.fallback ? this.props.fallback(t) : null : this.props.children;
172
+ }
173
+ }
174
+ let Z = null;
175
+ function Le(o = !1) {
176
+ if (Z && !o) return Z;
177
+ const t = typeof window < "u" ? window.innerWidth : 1024, i = typeof window < "u" ? window.innerHeight : 768, g = typeof window < "u" && window.devicePixelRatio || 1, d = typeof navigator < "u" && navigator.userAgent || "", u = /iPad|Tablet/i.test(d), e = /Mobile|Android|iPhone/i.test(d), a = typeof window < "u" && ("ontouchstart" in window || (navigator.maxTouchPoints ?? 0) > 0);
178
+ return Z = {
179
+ type: u ? "tablet" : e ? "mobile" : "desktop",
180
+ os: d,
181
+ browser: d,
182
+ devicePixelRatio: g,
183
+ viewportWidth: t,
184
+ viewportHeight: i,
185
+ isTouchDevice: a,
186
+ isRetina: g >= 2
187
+ }, Z;
188
+ }
189
+ function le(o, t) {
190
+ if (Object.is(o, t)) return !0;
191
+ if (typeof o != "object" || typeof t != "object" || o === null || t === null)
192
+ return !1;
193
+ const i = Object.keys(o), g = Object.keys(t);
194
+ return i.length !== g.length ? !1 : i.every(
195
+ (d) => Object.is(o[d], t[d])
196
+ );
197
+ }
198
+ function Re(o) {
199
+ const {
200
+ plugins: t,
201
+ props: i,
202
+ data: g,
203
+ initialState: d,
204
+ containerRef: u,
205
+ enableDebug: e = !1,
206
+ managerOptions: a,
207
+ extendContext: l
208
+ } = o, r = L(null), s = u ?? r, x = L(null);
209
+ x.current || (x.current = ke(a));
210
+ const p = x.current, H = L(null);
211
+ H.current || (H.current = be());
212
+ const D = H.current, z = L(/* @__PURE__ */ new Map()), [R, $] = A(d ?? {}), [, te] = A(0), q = E(() => te((k) => k + 1), []), N = U(() => Le(), []), F = L(t), G = F.current;
213
+ (G.length !== t.length || t.some((k, v) => k !== G[v])) && (F.current = t);
214
+ const j = F.current, ae = j.map((k) => k.name).join("|");
215
+ ie(() => {
216
+ p.clear(), p.registerAll(j), e && console.debug("[vane/plugin-core] plugins registered:", ae);
217
+ }, [j]), ie(
218
+ () => () => {
219
+ p.executeHook("onUnmount", S.current), p.clear();
220
+ },
221
+ [p]
222
+ );
223
+ const P = U(
224
+ () => fe(j),
225
+ [j]
226
+ ), S = L(null), w = L(i);
227
+ le(w.current, i) || (w.current = i);
228
+ const V = w.current, Y = L(g);
229
+ le(Y.current, g) || (Y.current = g);
230
+ const J = Y.current, O = U(() => {
231
+ const k = {
232
+ props: V,
233
+ data: J,
234
+ bus: D,
235
+ refs: { container: s, getContainer: () => s.current },
236
+ state: R,
237
+ setState: (v) => $((W) => ({ ...W, ...v })),
238
+ shared: z.current,
239
+ deviceInfo: N,
240
+ forceUpdate: q,
241
+ getSize: () => {
242
+ const v = s.current;
243
+ return v ? { width: v.offsetWidth, height: v.offsetHeight } : { width: 0, height: 0 };
244
+ },
245
+ logger: console
246
+ };
247
+ return l ? l(k) : k;
248
+ }, [V, J, R, N, D, l]);
249
+ S.current = O;
250
+ const y = E(
251
+ (k) => {
252
+ let v = k;
253
+ for (const W of P) {
254
+ const B = W.hooks?.transformProps;
255
+ if (typeof B == "function")
256
+ try {
257
+ v = B(v);
258
+ } catch (_) {
259
+ (S.current?.logger ?? console).warn(
260
+ `[plugin-core] ${W.name}.transformProps 执行失败,已跳过`,
261
+ _
262
+ );
263
+ }
264
+ }
265
+ return v;
266
+ },
267
+ [P]
268
+ ), Q = E(
269
+ (k) => {
270
+ let v = k;
271
+ for (const W of P) {
272
+ const B = W.hooks?.transformData;
273
+ if (typeof B == "function")
274
+ try {
275
+ v = B(S.current, v);
276
+ } catch (_) {
277
+ (S.current?.logger ?? console).warn(
278
+ `[plugin-core] ${W.name}.transformData 执行失败,已跳过`,
279
+ _
280
+ );
281
+ }
282
+ }
283
+ return v;
284
+ },
285
+ [P]
286
+ ), ne = E(
287
+ (k, ...v) => p.executeHook(k, S.current, ...v),
288
+ [p]
289
+ );
290
+ return {
291
+ manager: p,
292
+ bus: D,
293
+ context: O,
294
+ state: R,
295
+ setState: O.setState,
296
+ execute: ne,
297
+ transformProps: y,
298
+ transformData: Q,
299
+ orderedPlugins: P
300
+ };
301
+ }
302
+ ye(null);
303
+ function ee(o, t, i) {
304
+ const { hook: g, position: d = "after" } = i;
305
+ return o.filter((u) => u.enabled !== !1).filter((u) => typeof u.hooks?.[g] == "function").filter((u) => {
306
+ const e = u.config?.slotPosition;
307
+ return d === "before" ? e === "before" : d === "footer" ? e === void 0 || e === "after" || e === "footer" : e === void 0 || e === "after";
308
+ }).sort(
309
+ (u, e) => (u.config?.order ?? 0) - (e.config?.order ?? 0) || (e.priority ?? 0) - (u.priority ?? 0)
310
+ ).map((u) => {
311
+ try {
312
+ const e = u.hooks[g](t);
313
+ return e == null ? null : /* @__PURE__ */ re(me, { children: e }, `vane-slot-${u.name}`);
314
+ } catch (e) {
315
+ return console.warn(`[vane/plugin-core] 插件 ${u.name} 的 ${g} 渲染失败`, e), null;
316
+ }
317
+ });
318
+ }
319
+ function Se(o, t, i) {
320
+ return /* @__PURE__ */ he(pe, { children: [
321
+ ee(o, t, { hook: "renderHeader", position: "before" }),
322
+ i,
323
+ ee(o, t, { hook: "renderOverlay" }),
324
+ ee(o, t, { hook: "renderHeader", position: "after" }),
325
+ ee(o, t, { hook: "renderFooter", position: "footer" })
326
+ ] });
327
+ }
328
+ const Te = {
329
+ columns: 0,
330
+ columnWidth: 0,
331
+ gap: 0,
332
+ columnHeights: [],
333
+ totalHeight: 0,
334
+ containerWidth: 0,
335
+ containerHeight: 0
336
+ }, Ee = {
337
+ scrollTop: 0,
338
+ scrollLeft: 0,
339
+ scrollHeight: 0,
340
+ scrollWidth: 0,
341
+ clientHeight: 0,
342
+ clientWidth: 0,
343
+ isScrolling: !1,
344
+ direction: null
345
+ };
346
+ function T(o, t, ...i) {
347
+ if (typeof t == "function")
348
+ try {
349
+ return t(...i);
350
+ } catch (g) {
351
+ console.warn(`[vane-waterfall] ${o} 回调抛错,已忽略`, g);
352
+ return;
353
+ }
354
+ }
355
+ async function ce(o, t, ...i) {
356
+ if (typeof t == "function")
357
+ try {
358
+ return await t(...i);
359
+ } catch (g) {
360
+ console.warn(`[vane-waterfall] ${o} 回调抛错,已忽略`, g);
361
+ return;
362
+ }
363
+ }
364
+ function He() {
365
+ const o = typeof navigator < "u" ? navigator : void 0, t = o?.connection || o?.mozConnection || o?.webkitConnection;
366
+ if (t)
367
+ return {
368
+ effectiveType: t.effectiveType || "4g",
369
+ downlink: Number(t.downlink || 10),
370
+ rtt: Number(t.rtt || 50),
371
+ saveData: !!t.saveData,
372
+ online: o?.onLine !== !1
373
+ };
374
+ }
375
+ function ue(o, t, i) {
376
+ let g = Number.POSITIVE_INFINITY, d = -1;
377
+ return o.forEach((u, e) => {
378
+ Math.max(
379
+ 0,
380
+ Math.min(t + i, u.y + u.height) - Math.max(t, u.y)
381
+ ) > 0 && (e < g && (g = e), e > d && (d = e));
382
+ }), d < 0 ? { start: 0, end: 0 } : { start: g, end: d };
383
+ }
384
+ function Be(o, t) {
385
+ const i = Array.isArray(t) ? { plugins: t } : t, { plugins: g, enableDebug: d = !1 } = i, u = ve(
386
+ (e, a) => {
387
+ const l = L(null), r = L(/* @__PURE__ */ new Map()), s = L(null), x = U(() => He(), []), p = L(null), [H, D] = A(Te), [z, R] = A(
388
+ () => /* @__PURE__ */ new Map()
389
+ ), [$, te] = A(Ee), [q, N] = A(!1), [F, G] = A(0), j = E(
390
+ (n) => {
391
+ const f = () => s.current?.getLayoutInfo() ?? H, h = () => s.current?.getAllItemPositions() ?? z, b = () => s.current?.getViewportInfo() ?? $, c = () => p.current?.items ?? n.props?.items ?? [], C = () => n.props?.items ?? [], I = () => {
392
+ const m = s.current?.getVisibleItems();
393
+ if (m && m.size > 0) return m;
394
+ const K = b(), se = /* @__PURE__ */ new Set();
395
+ return h().forEach((oe, de) => {
396
+ Math.max(
397
+ 0,
398
+ Math.min(K.scrollTop + K.clientHeight, oe.y + oe.height) - Math.max(K.scrollTop, oe.y)
399
+ ) > 0 && se.add(de);
400
+ }), se;
401
+ }, M = {
402
+ ...n,
403
+ items: c(),
404
+ itemCount: c().length,
405
+ rawItems: C(),
406
+ containerRef: l,
407
+ itemRefs: r.current,
408
+ getItemRef: (m) => r.current.get(m) ?? null,
409
+ layout: f(),
410
+ itemPositions: h(),
411
+ getItemPosition: (m) => h().get(m) ?? null,
412
+ viewport: b(),
413
+ visibleItems: I(),
414
+ visibleRange: ue(
415
+ h(),
416
+ b().scrollTop,
417
+ b().clientHeight
418
+ ),
419
+ isLayouting: q,
420
+ isScrolling: $.isScrolling,
421
+ isDragging: !!n.state?.dragInfo?.isDragging,
422
+ isLoading: !!(n.state?.isLoading ?? !1),
423
+ hasMore: !!(n.state?.hasMore ?? !0),
424
+ error: n.state?.error ?? null,
425
+ sharedData: n.shared,
426
+ networkInfo: x,
427
+ dragInfo: n.state?.dragInfo,
428
+ relayout: () => s.current?.relayout(),
429
+ scrollToItem: (m, K) => s.current?.scrollToItem(m, K),
430
+ scrollToTop: (m) => s.current?.scrollToTop(m),
431
+ scrollToBottom: (m) => s.current?.scrollToBottom(m),
432
+ measureItem: (m) => s.current?.measureItem(m) ?? Promise.resolve({ width: 0, height: 0 })
433
+ };
434
+ return Object.defineProperties(M, {
435
+ layout: { get: f, enumerable: !0, configurable: !0 },
436
+ itemPositions: { get: h, enumerable: !0, configurable: !0 },
437
+ viewport: { get: b, enumerable: !0, configurable: !0 },
438
+ items: { get: c, enumerable: !0, configurable: !0 },
439
+ itemCount: {
440
+ get: () => c().length,
441
+ enumerable: !0,
442
+ configurable: !0
443
+ },
444
+ rawItems: { get: C, enumerable: !0, configurable: !0 },
445
+ visibleItems: { get: I, enumerable: !0, configurable: !0 },
446
+ // 宿主 props 优先:`hasMore` / `isLoading` 从「恒 true / 恒 false」改成
447
+ // 「props 能覆盖插件状态」,页面不用 hand-roll 一个插件就能控制(P2-2)
448
+ hasMore: {
449
+ get: () => p.current?.hasMore ?? n.state?.hasMore ?? !0,
450
+ enumerable: !0,
451
+ configurable: !0
452
+ },
453
+ isLoading: {
454
+ get: () => p.current?.isLoading ?? n.state?.isLoading ?? !1,
455
+ enumerable: !0,
456
+ configurable: !0
457
+ },
458
+ props: {
459
+ get: () => p.current ?? n.props,
460
+ enumerable: !0,
461
+ configurable: !0
462
+ },
463
+ visibleRange: {
464
+ get: () => {
465
+ const m = b();
466
+ return ue(h(), m.scrollTop, m.clientHeight);
467
+ },
468
+ enumerable: !0,
469
+ configurable: !0
470
+ }
471
+ }), M;
472
+ },
473
+ [H, z, $, q, x]
474
+ ), P = Re({
475
+ plugins: g,
476
+ props: e,
477
+ enableDebug: d,
478
+ containerRef: l,
479
+ extendContext: j
480
+ }), S = L(P.context);
481
+ ie(() => {
482
+ S.current = P.context;
483
+ }), X(
484
+ () => P.bus.on("props:invalidate", () => G((n) => n + 1)),
485
+ [P.bus]
486
+ );
487
+ const w = E(
488
+ (n, ...f) => P.execute(n, ...f),
489
+ // eslint-disable-next-line react-hooks/exhaustive-deps
490
+ [P.manager]
491
+ ), V = P.orderedPlugins, Y = g.map((n) => n.name).join("|"), J = U(() => {
492
+ const n = V.filter(
493
+ (c) => typeof c.hooks?.calculateColumns == "function"
494
+ ), f = V.filter(
495
+ (c) => typeof c.hooks?.calculateColumnWidth == "function"
496
+ ), h = V.filter(
497
+ (c) => typeof c.hooks?.calculateItemPosition == "function"
498
+ );
499
+ if (!n.length && !f.length && !h.length)
500
+ return;
501
+ const b = (c, C, I) => console.warn(`[vane-waterfall] ${c} 的 ${C} 执行失败`, I);
502
+ return {
503
+ calculateColumns: n.length ? (c) => {
504
+ const C = S.current?.containerRef?.current?.clientWidth ?? 0;
505
+ for (const I of n)
506
+ try {
507
+ const M = I.hooks.calculateColumns(S.current, C);
508
+ if (typeof M == "number" && Number.isFinite(M)) return M;
509
+ } catch (M) {
510
+ b(I.name, "calculateColumns", M);
511
+ }
512
+ } : void 0,
513
+ calculateColumnWidth: f.length ? (c, C, I) => {
514
+ for (const M of f)
515
+ try {
516
+ const m = M.hooks.calculateColumnWidth(
517
+ S.current,
518
+ I,
519
+ C
520
+ );
521
+ if (typeof m == "number" && Number.isFinite(m)) return m;
522
+ } catch (m) {
523
+ b(M.name, "calculateColumnWidth", m);
524
+ }
525
+ } : void 0,
526
+ calculateItemPosition: h.length ? (c, C, I) => {
527
+ for (const M of h)
528
+ try {
529
+ const m = M.hooks.calculateItemPosition(
530
+ S.current,
531
+ c,
532
+ C,
533
+ I
534
+ );
535
+ if (m) return m;
536
+ } catch (m) {
537
+ b(M.name, "calculateItemPosition", m);
538
+ }
539
+ } : void 0
540
+ };
541
+ }, [V]), O = E(() => {
542
+ const n = s.current;
543
+ if (!n) return;
544
+ const f = n.getLayoutInfo(), h = n.getAllItemPositions(), b = n.getViewportInfo();
545
+ D(
546
+ (c) => c.totalHeight === f.totalHeight && c.columns === f.columns && c.columnWidth === f.columnWidth && c.containerWidth === f.containerWidth ? c : f
547
+ ), R((c) => {
548
+ if (c === h) return c;
549
+ if (c.size !== h.size) return h;
550
+ let C = !0;
551
+ return h.forEach((I, M) => {
552
+ if (C === !1) return;
553
+ const m = c.get(M);
554
+ (!m || m.x !== I.x || m.y !== I.y || m.width !== I.width || m.height !== I.height || m.column !== I.column) && (C = !1);
555
+ }), C ? c : h;
556
+ }), te(
557
+ (c) => c.scrollTop === b.scrollTop && c.clientHeight === b.clientHeight && c.scrollHeight === b.scrollHeight && c.isScrolling === b.isScrolling ? c : b
558
+ );
559
+ }, []), y = U(() => P.transformProps(e), [P.transformProps, e, F]);
560
+ X(() => {
561
+ g.some((n) => n.name === "PaginationPlugin") && g.some((n) => n.name === "InfiniteScrollPlugin") && console.warn(
562
+ "[vane-waterfall] PaginationPlugin 与 InfiniteScrollPlugin 互斥:两者都会改写 items,请只保留一个"
563
+ );
564
+ }, [Y]), X(() => {
565
+ w("onMount");
566
+ }, [w]);
567
+ const Q = L(e);
568
+ X(() => {
569
+ const n = Q.current;
570
+ n !== e && (Q.current = e, w("onPropsChange", n, e));
571
+ }, [e, w]), p.current = y;
572
+ const ne = E(async () => (N(!0), await w("onBeforeLayout") === !1 ? (N(!1), !1) : !0), [w]), k = E(() => {
573
+ w("onLayout");
574
+ }, [w]), v = E(() => {
575
+ N(!1), w("onLayoutComplete"), Promise.resolve().then(O);
576
+ }, [w, O]), W = U(
577
+ () => V.filter((n) => typeof n.hooks?.renderItemWrapper == "function"),
578
+ [V]
579
+ ), B = y.renderItem, _ = E(
580
+ (n, f) => {
581
+ let h = B?.(n, f) ?? null;
582
+ for (const b of W)
583
+ try {
584
+ const c = b.hooks.renderItemWrapper(S.current, h, f);
585
+ c != null && (h = c);
586
+ } catch (c) {
587
+ console.warn(`[vane-waterfall] ${b.name} 的 renderItemWrapper 失败`, c);
588
+ }
589
+ return h;
590
+ },
591
+ // 身份保持稳定(插件链与基础 renderItem 不变时不变):Core 里项单元是 memo 的,
592
+ // 这里每次渲染都给新函数等于把 memo 全部击穿(P2-11)
593
+ [B, W]
594
+ ), ge = {
595
+ ...y,
596
+ containerRefExternal: l,
597
+ itemRefsExternal: r,
598
+ debug: y.debug ?? d,
599
+ layoutHooks: J ?? y.layoutHooks,
600
+ renderItem: _,
601
+ children: /* @__PURE__ */ re(me, { children: Se(P.orderedPlugins, P.context, y.children) }),
602
+ onMount: () => {
603
+ T("onMount", y.onMount);
604
+ },
605
+ onUnmount: () => {
606
+ T("onUnmount", y.onUnmount);
607
+ },
608
+ onBeforeLayout: async () => await ne() === !1 ? !1 : await ce("onBeforeLayout", y.onBeforeLayout) ?? !0,
609
+ onLayout: () => {
610
+ T("onLayout", y.onLayout), k();
611
+ },
612
+ onLayoutComplete: () => {
613
+ T("onLayoutComplete", y.onLayoutComplete), v();
614
+ },
615
+ onItemMount: (n, f) => {
616
+ T("onItemMount", y.onItemMount, n, f), w("onItemMount", n, f);
617
+ },
618
+ onItemUnmount: (n) => {
619
+ T("onItemUnmount", y.onItemUnmount, n), w("onItemUnmount", n);
620
+ },
621
+ onItemEnterViewport: (n, f) => {
622
+ T("onItemEnterViewport", y.onItemEnterViewport, n, f), w("onItemEnterViewport", n, f);
623
+ },
624
+ onItemLeaveViewport: (n, f) => {
625
+ T("onItemLeaveViewport", y.onItemLeaveViewport, n, f), w("onItemLeaveViewport", n, f);
626
+ },
627
+ onScroll: (n, f) => {
628
+ T("onScroll", y.onScroll, n, f), w("onScroll", n, f), O();
629
+ },
630
+ onResize: (n, f) => {
631
+ T("onResize", y.onResize, n, f), w("onResize", n, f);
632
+ },
633
+ onReachBottom: async (n) => {
634
+ await ce("onReachBottom", y.onReachBottom, n), await w("onReachBottom", n);
635
+ },
636
+ onItemClick: (n, f, h) => {
637
+ T("onItemClick", y.onItemClick, n, f, h), w("onItemClick", n, f, h);
638
+ }
639
+ };
640
+ return /* @__PURE__ */ re(
641
+ o,
642
+ {
643
+ ref: (n) => {
644
+ s.current = n, typeof a == "function" ? a(n) : a && (a.current = n);
645
+ },
646
+ ...ge
647
+ }
648
+ );
649
+ }
650
+ );
651
+ return u.displayName = "WithPlugins(WaterfallCore)", u;
652
+ }
653
+ export {
654
+ Be as w
655
+ };
@@ -39,6 +39,23 @@ export interface WaterfallCoreProps<T = any> {
39
39
  * 无限滚动类插件靠它提前预加载(旧版写死 100,插件配多大都没用)。
40
40
  */
41
41
  reachBottomOffset?: number;
42
+ /**
43
+ * 零高度项的最小占位高度,默认 48(设 0 关闭,退回旧行为:该项不占位且不可见)。
44
+ *
45
+ * 图片 404 / 懒加载尚未解码 / 字体度量未就绪时首测 `offsetHeight` 为 0,
46
+ * 旧实现直接跳过 → 该DOM 节点被 `opacity:0` 隐藏、不在 `positions` 里,
47
+ * `scrollToItem` / `onItemEnterViewport` 也永远命中不到。
48
+ */
49
+ minItemHeight?: number;
50
+ /**
51
+ * 滚动锚定:布局前后补偿 `scrollTop`,让第一个可见项在屏幕上的位置不变,默认 true。
52
+ * 视口上方的项从估值变成真高时,不补偿会让内容整体「跳一下」。
53
+ */
54
+ scrollAnchor?: boolean;
55
+ /** 是否还有更多数据(`InfiniteScrollPlugin` 读取),优先于插件内部状态 */
56
+ hasMore?: boolean;
57
+ /** 数据是否在加载中(`aria-busy` 等读取),优先于插件内部状态 */
58
+ isLoading?: boolean;
42
59
  /**
43
60
  * 虚拟化:只渲染视口附近的项。
44
61
  * 千项以上、项高度可估(图片卡、商品卡)时开;与 `RecyclePlugin` 不要同开。
@@ -101,6 +118,8 @@ export interface WaterfallCoreRef {
101
118
  start: number;
102
119
  end: number;
103
120
  };
121
+ /** 当前与视口有重叠的索引集合(滚动时维护,供插件上下文使用) */
122
+ getVisibleItems: () => Set<number>;
104
123
  forceUpdate: () => void;
105
124
  getContainer: () => HTMLDivElement | null;
106
125
  getItemElement: (index: number) => HTMLElement | null;