@lazycatcloud/vue-media-preview 0.0.0-stage → 0.1.1

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 (43) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +109 -2
  3. package/dist/components/MediaPreview.vue.d.ts +171 -0
  4. package/dist/components/PreviewStage.vue.d.ts +147 -0
  5. package/dist/components/VirtualTimeline.vue.d.ts +42 -0
  6. package/dist/components/video/VideoControls.vue.d.ts +21 -0
  7. package/dist/components/video/VideoIcon.vue.d.ts +14 -0
  8. package/dist/core/errors.d.ts +1 -0
  9. package/dist/core/gestures/edgePaging.d.ts +5 -0
  10. package/dist/core/gestures/pointerGesture.d.ts +5 -0
  11. package/dist/core/gestures/pressHold.d.ts +5 -0
  12. package/dist/core/gestures/wheelZoom.d.ts +2 -0
  13. package/dist/core/math.d.ts +11 -0
  14. package/dist/core/resources/imageLimits.d.ts +11 -0
  15. package/dist/core/resources/imagePolicy.d.ts +14 -0
  16. package/dist/core/resources/imageRequest.d.ts +15 -0
  17. package/dist/core/resources/imageStore.d.ts +30 -0
  18. package/dist/core/resources/imageTransport.d.ts +9 -0
  19. package/dist/core/resources/initialImage.d.ts +11 -0
  20. package/dist/core/resources/usePreviewResources.d.ts +13 -0
  21. package/dist/core/timeline/layout.d.ts +28 -0
  22. package/dist/core/transition/anchor.d.ts +12 -0
  23. package/dist/core/transition/geometry.d.ts +27 -0
  24. package/dist/core/transition/rect.d.ts +2 -0
  25. package/dist/core/transition/sharedTransition.d.ts +12 -0
  26. package/dist/core/transition/sourceViewport.d.ts +3 -0
  27. package/dist/core/types.d.ts +69 -0
  28. package/dist/core/usePreviewPager.d.ts +26 -0
  29. package/dist/core/usePreviewViewport.d.ts +29 -0
  30. package/dist/core/video/captureVideoFrame.d.ts +3 -0
  31. package/dist/core/video/useVideoPlayback.d.ts +46 -0
  32. package/dist/core/video/useVideoSource.d.ts +5 -0
  33. package/dist/index.d.ts +17 -0
  34. package/dist/renderers/ImageCanvasRenderer.vue.d.ts +71 -0
  35. package/dist/renderers/LivePhotoRenderer.vue.d.ts +94 -0
  36. package/dist/renderers/VideoDomRenderer.vue.d.ts +166 -0
  37. package/dist/vue-media-preview.cjs +1 -0
  38. package/dist/vue-media-preview.css +1 -0
  39. package/dist/vue-media-preview.js +2403 -0
  40. package/docs/testing.md +141 -0
  41. package/docs/ui-alignment.md +44 -0
  42. package/docs/vue-media-preview.md +193 -0
  43. package/package.json +71 -4
@@ -0,0 +1,2403 @@
1
+ var qt = Object.defineProperty;
2
+ var zt = (a, t, e) => t in a ? qt(a, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[t] = e;
3
+ var tt = (a, t, e) => zt(a, typeof t != "symbol" ? t + "" : t, e);
4
+ import { ref as R, onMounted as ze, watch as ee, onBeforeUnmount as Re, shallowRef as gt, reactive as mt, computed as U, defineComponent as Le, nextTick as ye, openBlock as z, createElementBlock as H, Fragment as De, createElementVNode as $, createCommentVNode as ie, withModifiers as J, toDisplayString as le, unref as g, normalizeClass as qe, normalizeStyle as Se, mergeProps as Ue, toHandlers as pt, createVNode as Be, renderList as ot, createTextVNode as It, withKeys as at, createBlock as rt, Teleport as Ct, resolveDynamicComponent as At, useAttrs as Ot, getCurrentInstance as _t, withDirectives as Vt, vShow as Yt, renderSlot as ft } from "vue";
5
+ function Ae(a) {
6
+ return a instanceof Error ? a : new Error(String(a));
7
+ }
8
+ const lt = (a, t) => (a.src = t.videoSrc || t.src, () => {
9
+ a.removeAttribute("src"), a.load();
10
+ });
11
+ function Et(a, t, e, n, o) {
12
+ const i = R(0);
13
+ let s = () => {
14
+ }, r = () => {
15
+ };
16
+ return ze(() => {
17
+ r = ee(
18
+ () => [t().id, t().src, t().videoSrc, e(), n(), i.value],
19
+ () => {
20
+ s(), s = () => {
21
+ }, e() && (s = n()(a(), t(), o));
22
+ },
23
+ { immediate: !0, flush: "post" }
24
+ );
25
+ }), Re(() => {
26
+ r(), s();
27
+ }), () => i.value++;
28
+ }
29
+ function de(a, t, e) {
30
+ return Math.min(Math.max(a, t), e);
31
+ }
32
+ function yt(a, t = 2) {
33
+ return Number(a.toFixed(t));
34
+ }
35
+ function Ht(a, t) {
36
+ return a.width <= 0 || a.height <= 0 || t.width <= 0 || t.height <= 0 ? 1 : Math.min(t.width / a.width, t.height / a.height);
37
+ }
38
+ function wt(a) {
39
+ const t = (a % 360 + 360) % 360;
40
+ return t === 90 || t === 180 || t === 270 ? t : 0;
41
+ }
42
+ function Xt(a, t) {
43
+ return t === 90 || t === 270 ? { width: a.height, height: a.width } : a;
44
+ }
45
+ function Ut(a, t, e) {
46
+ return `translate3d(${yt(a)}px, ${yt(t)}px, 0) scale3d(${e}, ${e}, 1)`;
47
+ }
48
+ function Wt(a) {
49
+ return 1 - (1 - a) ** 3;
50
+ }
51
+ function nt(a, t) {
52
+ return Math.hypot(a.x - t.x, a.y - t.y);
53
+ }
54
+ function bt(a, t) {
55
+ return { x: (a.x + t.x) / 2, y: (a.y + t.y) / 2 };
56
+ }
57
+ function Nt(a, t, e) {
58
+ return Math.hypot(a, t) < 9 ? "pending" : e > 1.01 ? "pan" : Math.abs(a) > Math.abs(t) * 1.1 ? "page" : t > 0 && Math.abs(t) > Math.abs(a) * 1.1 ? "dismiss" : "pending";
59
+ }
60
+ function Zt(a, t) {
61
+ return a.deltaMode === 1 ? 2 ** (-a.deltaY * 0.05) : a.deltaMode === 2 ? 2 ** -a.deltaY : t || Math.abs(a.deltaY) >= 40 ? 2 ** (-a.deltaY * 2e-3) : Math.exp(-a.deltaY * 8e-3);
62
+ }
63
+ function jt(a, t, e = 650) {
64
+ let n = { kind: "idle" };
65
+ function o() {
66
+ const s = n;
67
+ n = { kind: "idle" }, s.kind === "pending" && clearTimeout(s.timer), s.kind === "active" && t();
68
+ }
69
+ function i() {
70
+ o(), n = {
71
+ kind: "pending",
72
+ timer: setTimeout(() => {
73
+ n = { kind: "active" }, a();
74
+ }, e)
75
+ };
76
+ }
77
+ return { arm: i, cancel: o };
78
+ }
79
+ function Kt(a, t, e) {
80
+ const n = de(a, -t, t);
81
+ return { offsetX: n, pageOffset: e ? a - n : 0 };
82
+ }
83
+ function Gt(a = {}) {
84
+ const t = {
85
+ motionActive: () => !1,
86
+ onTap: () => {
87
+ },
88
+ onDoubleTap: () => {
89
+ },
90
+ onScale: (c) => {
91
+ },
92
+ onSwipeDownProgress: (c) => {
93
+ },
94
+ onSwipeDownClose: () => {
95
+ },
96
+ onSwipeLeft: () => {
97
+ },
98
+ onSwipeRight: () => {
99
+ },
100
+ onPageDrag: (c) => {
101
+ },
102
+ onPageRelease: (c, F) => {
103
+ Math.abs(c) < 60 || (c < 0 ? t.onSwipeLeft() : t.onSwipeRight());
104
+ },
105
+ interactive: () => !0,
106
+ zoomable: () => !0,
107
+ doubleTapZoom: () => 2.5,
108
+ zoomLimit: () => 8,
109
+ holdable: () => !1,
110
+ onHoldStart: () => {
111
+ },
112
+ onHoldEnd: () => {
113
+ },
114
+ ...a
115
+ }, e = R(), n = R(), o = gt(), i = R({ width: 1, height: 1 }), s = R({ width: 1, height: 1 }), r = mt({
116
+ level: 1,
117
+ offsetX: 0,
118
+ offsetY: 0,
119
+ rotation: 0,
120
+ zooming: !1,
121
+ draggingDown: !1,
122
+ downOffsetX: 0,
123
+ downOffsetY: 0,
124
+ downScale: 1
125
+ }), f = U(() => Xt(s.value, r.rotation)), y = U(() => Ht(f.value, i.value)), m = U(() => y.value * r.level), b = U(() => ({
126
+ width: f.value.width * m.value,
127
+ height: f.value.height * m.value
128
+ })), B = U(() => ({
129
+ transform: Ut(r.downOffsetX, r.downOffsetY, r.downScale)
130
+ })), L = /* @__PURE__ */ new Set(), P = R(!1), p = R(!1), v = R(!1), T = U(
131
+ () => P.value || p.value || v.value || t.motionActive()
132
+ );
133
+ let I, w = 0, u = 0, k = setTimeout(() => {
134
+ }, 0), h = -1e3, d = { x: 0, y: 0 }, M = !1, C = "idle", E = !0, A = !1, V = 0;
135
+ const _ = /* @__PURE__ */ new Map();
136
+ let N = { x: 0, y: 0 }, Y = { x: 0, y: 0, time: 0 }, Pe = 0, se = 0, fe = 0, K = { left: 0, top: 0 }, Ze = 1, Oe = { x: 0, y: 0 }, D = Q();
137
+ const q = jt(
138
+ () => {
139
+ C = "hold", clearTimeout(k), h = -1e3, t.onHoldStart();
140
+ },
141
+ () => t.onHoldEnd()
142
+ ), W = new ResizeObserver((c) => {
143
+ for (const F of c) G(F.contentRect);
144
+ }), Ce = /* @__PURE__ */ new Set(), je = (c) => {
145
+ (c.key === "Control" || c.key === "Meta") && Ce.add(c.key);
146
+ }, te = (c) => Ce.delete(c.key), ge = () => {
147
+ q.cancel(), Ce.clear();
148
+ }, $e = () => {
149
+ document.hidden && q.cancel();
150
+ };
151
+ ze(() => {
152
+ W.observe(e.value), G(e.value.getBoundingClientRect()), window.addEventListener("keydown", je), window.addEventListener("keyup", te), window.addEventListener("blur", ge), document.addEventListener("visibilitychange", $e);
153
+ }), Re(() => {
154
+ M = !0, q.cancel(), window.removeEventListener("keydown", je), window.removeEventListener("keyup", te), window.removeEventListener("blur", ge), document.removeEventListener("visibilitychange", $e), W.disconnect(), cancelAnimationFrame(w), cancelAnimationFrame(u), clearTimeout(k), clearTimeout(I);
155
+ });
156
+ function G(c) {
157
+ i.value = { width: c.width, height: c.height }, Object.assign(r, ve(r.offsetX, r.offsetY, r.level)), pe();
158
+ }
159
+ function pe() {
160
+ M || w || (w = requestAnimationFrame(() => {
161
+ w = 0, L.forEach((c) => c());
162
+ }));
163
+ }
164
+ function Q() {
165
+ return { level: r.level, offsetX: r.offsetX, offsetY: r.offsetY };
166
+ }
167
+ function ve(c, F, X) {
168
+ const Z = Math.max(
169
+ 0,
170
+ (f.value.width * y.value * X - i.value.width) / 2
171
+ ), ae = Math.max(
172
+ 0,
173
+ (f.value.height * y.value * X - i.value.height) / 2
174
+ );
175
+ return { offsetX: de(c, -Z, Z), offsetY: de(F, -ae, ae) };
176
+ }
177
+ function me(c) {
178
+ Object.assign(r, c), t.onScale(r.level), pe();
179
+ }
180
+ function xe(c, F = 250) {
181
+ cancelAnimationFrame(u), P.value = !0;
182
+ const X = Q(), Z = performance.now(), ae = matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : F, oe = (we) => {
183
+ const re = ae === 0 ? 1 : de((we - Z) / ae, 0, 1), be = Wt(re);
184
+ me({
185
+ level: X.level + (c.level - X.level) * be,
186
+ offsetX: X.offsetX + (c.offsetX - X.offsetX) * be,
187
+ offsetY: X.offsetY + (c.offsetY - X.offsetY) * be
188
+ }), re < 1 ? u = requestAnimationFrame(oe) : P.value = !1;
189
+ };
190
+ u = requestAnimationFrame(oe);
191
+ }
192
+ function ne() {
193
+ return { x: i.value.width / 2, y: i.value.height / 2 };
194
+ }
195
+ function he(c, F = ne(), X = !1) {
196
+ if (!t.zoomable()) return;
197
+ cancelAnimationFrame(u), P.value = !1;
198
+ const Z = de(c, 1, t.zoomLimit()), ae = Z / r.level, oe = ne(), we = ve(
199
+ F.x - oe.x - (F.x - oe.x - r.offsetX) * ae,
200
+ F.y - oe.y - (F.y - oe.y - r.offsetY) * ae,
201
+ Z
202
+ ), re = { level: Z, ...we };
203
+ X ? xe(re) : me(re);
204
+ }
205
+ function Ee() {
206
+ r.draggingDown = !1, r.downOffsetX = 0, r.downOffsetY = 0, r.downScale = 1, t.onSwipeDownProgress(0);
207
+ }
208
+ function Me(c = !1) {
209
+ c && (cancelAnimationFrame(u), P.value = !1), q.cancel(), _.clear(), p.value = !1, v.value = !1, clearTimeout(I), C = "idle", V = 0, r.zooming = !1, c || (Ee(), t.onPageDrag(0)), clearTimeout(k), h = -1e3;
210
+ }
211
+ function Fe(c = 0) {
212
+ cancelAnimationFrame(u), P.value = !1, Me();
213
+ const F = { level: 1, offsetX: 0, offsetY: 0 };
214
+ c > 0 && (r.level !== 1 || r.offsetX !== 0 || r.offsetY !== 0) ? xe(F, c) : me(F);
215
+ }
216
+ function Te(c, F = K) {
217
+ return { x: c.clientX - F.left, y: c.clientY - F.top };
218
+ }
219
+ function st() {
220
+ q.cancel(), E = !1, A = !1, V = 0;
221
+ const [c, F] = [..._.values()];
222
+ Ze = Math.max(1, nt(c, F)), Oe = bt(c, F), D = Q(), C = "pinch", r.zooming = !0, Ee(), t.onPageDrag(0), clearTimeout(k), h = -1e3;
223
+ }
224
+ function ut(c, F = e.value.getBoundingClientRect()) {
225
+ if (!t.interactive() || c.pointerType === "mouse" && c.button !== 0)
226
+ return !1;
227
+ const X = c.target;
228
+ if (X.closest("button, input, a, select") || X instanceof HTMLVideoElement && X.controls && c.clientY > X.getBoundingClientRect().bottom - 48)
229
+ return !1;
230
+ if (cancelAnimationFrame(u), P.value = !1, p.value = !0, _.size === 0 && (K = F), _.set(c.pointerId, Te(c)), e.value.setPointerCapture(c.pointerId), _.size >= 2)
231
+ return st(), !0;
232
+ N = Te(c), Y = { ...N, time: performance.now() }, Pe = Y.time, se = 0, fe = 0, D = Q(), C = "pending", E = !0, A = !1, V = 0;
233
+ const Z = b.value.width / 2, ae = b.value.height / 2, oe = ne();
234
+ return t.holdable() && Math.abs(N.x - oe.x - r.offsetX) <= Z && Math.abs(N.y - oe.y - r.offsetY) <= ae && (clearTimeout(k), q.arm()), !0;
235
+ }
236
+ function ct(c) {
237
+ if (!_.has(c.pointerId)) return;
238
+ const F = Te(c);
239
+ if (_.set(c.pointerId, F), C === "pinch" && _.size >= 2) {
240
+ if (!t.zoomable()) return;
241
+ const [we, re] = [..._.values()], be = ne(), Qe = bt(we, re), Ye = de(
242
+ D.level * nt(we, re) / Ze,
243
+ 0.75,
244
+ t.zoomLimit()
245
+ ), Je = Ye / D.level;
246
+ me({
247
+ level: Ye,
248
+ ...ve(
249
+ Qe.x - be.x - (Oe.x - be.x - D.offsetX) * Je,
250
+ Qe.y - be.y - (Oe.y - be.y - D.offsetY) * Je,
251
+ Ye
252
+ )
253
+ }), c.preventDefault();
254
+ return;
255
+ }
256
+ if (C === "idle") return;
257
+ const X = F.x - N.x, Z = F.y - N.y;
258
+ if (C === "hold") {
259
+ if (c.preventDefault(), Math.hypot(X, Z) < 9) return;
260
+ q.cancel(), C = "pending";
261
+ }
262
+ Math.hypot(X, Z) >= 9 && q.cancel();
263
+ const ae = performance.now(), oe = Math.max(8, ae - Y.time);
264
+ if (se = (F.x - Y.x) / oe, fe = (F.y - Y.y) / oe, Y = { ...F, time: ae }, C === "pending" && (C = Nt(X, Z, r.level), A = C === "pan" && E && Math.abs(X) > Math.abs(Z) * 1.1), C !== "pending")
265
+ if (clearTimeout(k), h = -1e3, c.preventDefault(), C === "pan") {
266
+ const we = Math.max(0, (b.value.width - i.value.width) / 2), re = Kt(D.offsetX + X, we, A);
267
+ me({ level: r.level, ...ve(re.offsetX, D.offsetY + Z, r.level) }), re.pageOffset !== V && (V = re.pageOffset, t.onPageDrag(V));
268
+ } else C === "page" ? t.onPageDrag(X) : C === "dismiss" && (r.draggingDown = !0, r.downOffsetX = X * 0.65, r.downOffsetY = Math.max(0, Z), r.downScale = de(1 - Math.max(0, Z) / i.value.height * 0.6, 0.65, 1), t.onSwipeDownProgress(de(Z / (i.value.height * 0.55), 0, 0.85)));
269
+ }
270
+ function j(c) {
271
+ if (!_.has(c.pointerId)) return;
272
+ if (q.cancel(), _.delete(c.pointerId), p.value = _.size > 0, C === "pinch") {
273
+ _.size > 0 ? (N = [..._.values()][0], D = Q(), C = "pan") : (C = "idle", r.zooming = !1, he(Math.max(1, r.level), ne(), !0));
274
+ return;
275
+ }
276
+ if (_.size > 0) return;
277
+ const F = Te(c), X = F.x - N.x, Z = F.y - N.y, ae = performance.now() - Y.time < 100;
278
+ C === "page" || C === "pan" && V !== 0 ? t.onPageRelease(C === "page" ? X : V, ae ? se : 0) : C === "dismiss" ? Z > i.value.height * 0.18 || Z > 45 && ae && fe > 0.7 ? t.onSwipeDownClose() : Ee() : C === "pending" && performance.now() - Pe < 300 && nt(N, F) < 9 ? Ge(F) : r.level < 1 && he(1, ne(), !0), r.zooming = !1, C = "idle";
279
+ }
280
+ function Ke(c) {
281
+ if (!_.has(c.pointerId)) return;
282
+ const F = C === "page" || C === "pan" && V !== 0;
283
+ Me(), F && t.onPageRelease(0, 0), r.level < 1 && he(1, ne(), !0);
284
+ }
285
+ function Ge(c) {
286
+ const F = performance.now();
287
+ F - h < 280 && nt(c, d) < 36 ? (clearTimeout(k), h = -1e3, t.onDoubleTap(), he(r.level > 1.01 ? 1 : t.doubleTapZoom(), c, !0)) : (h = F, d = c, k = setTimeout(t.onTap, 280));
288
+ }
289
+ function _e(c) {
290
+ if (t.interactive()) {
291
+ if (q.cancel(), v.value = !0, clearTimeout(I), I = setTimeout(() => {
292
+ v.value = !1;
293
+ }, 120), c.ctrlKey || c.metaKey)
294
+ c.preventDefault(), he(
295
+ r.level * Zt(c, Ce.size > 0),
296
+ Te(c, e.value.getBoundingClientRect())
297
+ );
298
+ else if (r.level > 1) {
299
+ c.preventDefault();
300
+ const F = c.deltaMode === 1 ? 16 : 1;
301
+ me({
302
+ level: r.level,
303
+ ...ve(
304
+ r.offsetX - c.deltaX * F,
305
+ r.offsetY - c.deltaY * F,
306
+ r.level
307
+ )
308
+ });
309
+ }
310
+ }
311
+ }
312
+ const Ve = {
313
+ state: r,
314
+ motionActive: T,
315
+ containerRef: e,
316
+ canvasRef: n,
317
+ mediaRef: o,
318
+ viewportSize: i,
319
+ mediaSize: s,
320
+ visualMediaSize: f,
321
+ displaySize: b,
322
+ displayScale: m,
323
+ downDragStyle: B,
324
+ requestRender: pe,
325
+ renderNow: () => L.forEach((c) => c()),
326
+ zoomTo: he,
327
+ resetTransform: Fe,
328
+ cancelGesture: Me,
329
+ setMediaElement(c) {
330
+ o.value = c, c instanceof HTMLVideoElement && pe();
331
+ },
332
+ setMediaSize(c) {
333
+ s.value = c, pe();
334
+ },
335
+ clearMedia() {
336
+ o.value = void 0;
337
+ },
338
+ registerRenderHandler(c) {
339
+ return L.add(c), () => L.delete(c);
340
+ },
341
+ setRotation(c, F = !0) {
342
+ r.rotation = wt(c), F && Fe(), pe();
343
+ },
344
+ rotateBy(c = 90) {
345
+ Ve.setRotation(wt(r.rotation + c));
346
+ }
347
+ };
348
+ return { core: Ve, onPointerDown: ut, onPointerMove: ct, onPointerUp: j, onPointerCancel: Ke, onWheel: _e };
349
+ }
350
+ const ue = {
351
+ maxDecodedPixels: 24e6,
352
+ maxCanvasPixels: 6e6,
353
+ maxDevicePixelRatio: 2.5,
354
+ maxOriginalBytes: 32 * 1024 * 1024,
355
+ maxPreviewBytes: 12 * 1024 * 1024,
356
+ cacheBytes: 96 * 1024 * 1024,
357
+ cacheEntries: 24,
358
+ concurrency: 3
359
+ };
360
+ class Xe extends Error {
361
+ constructor(t) {
362
+ super(t), this.name = "ImageLimitError";
363
+ }
364
+ }
365
+ const Qt = async (a, t) => {
366
+ const e = await fetch(a, { signal: t.signal, credentials: "same-origin" });
367
+ if (!e.ok) throw new Error(`图片加载失败:HTTP ${e.status}`);
368
+ if (Number(e.headers.get("content-length")) > t.maxBytes)
369
+ throw await e.body.cancel(), new Xe("资源超过下载保护限制,请使用适屏图或下载原文件");
370
+ const o = e.body.getReader(), i = [];
371
+ let s = 0;
372
+ try {
373
+ for (; ; ) {
374
+ const m = await o.read();
375
+ if (m.done) break;
376
+ if (s += m.value.byteLength, s > t.maxBytes)
377
+ throw new Xe("资源超过下载保护限制,请使用适屏图或下载原文件");
378
+ i.push(new Uint8Array(m.value));
379
+ }
380
+ } catch (m) {
381
+ throw await o.cancel(), m;
382
+ } finally {
383
+ o.releaseLock();
384
+ }
385
+ t.signal.throwIfAborted();
386
+ const r = new Blob(i, { type: e.headers.get("content-type") }), f = URL.createObjectURL(r), y = new Image();
387
+ y.decoding = "async";
388
+ try {
389
+ if (await new Promise((m, b) => {
390
+ const B = () => {
391
+ y.removeAttribute("src"), b(new DOMException("请求已取消", "AbortError"));
392
+ };
393
+ y.onload = () => {
394
+ t.signal.removeEventListener("abort", B), m();
395
+ }, y.onerror = () => {
396
+ t.signal.removeEventListener("abort", B), b(new Error("图片解码失败或格式不受支持"));
397
+ }, t.signal.addEventListener("abort", B, { once: !0 }), y.src = f;
398
+ }), t.signal.throwIfAborted(), y.naturalWidth * y.naturalHeight > ue.maxDecodedPixels)
399
+ throw new Xe("图片像素超过解码保护限制,请提供较小的适屏资源");
400
+ return await y.decode(), t.signal.throwIfAborted(), y;
401
+ } finally {
402
+ URL.revokeObjectURL(f);
403
+ }
404
+ };
405
+ class Jt {
406
+ constructor(t = ue.cacheBytes, e = ue.concurrency, n = Qt) {
407
+ tt(this, "entries", /* @__PURE__ */ new Map());
408
+ tt(this, "active", 0);
409
+ tt(this, "cancelled", 0);
410
+ this.budget = t, this.concurrency = e, this.loader = n;
411
+ }
412
+ get stats() {
413
+ return {
414
+ active: this.active,
415
+ queued: [...this.entries.values()].filter((t) => t.state === "queued").length,
416
+ entries: this.entries.size,
417
+ bytes: [...this.entries.values()].reduce((t, e) => t + e.bytes, 0),
418
+ cancelled: this.cancelled
419
+ };
420
+ }
421
+ acquire(t, e = {}) {
422
+ const n = { priority: 0, maxBytes: ue.maxOriginalBytes, ...e };
423
+ if (this.entries.has(t) && ["error", "aborted"].includes(this.entries.get(t).state) && this.entries.delete(t), !this.entries.has(t)) {
424
+ let s, r;
425
+ const f = new Promise((y, m) => {
426
+ s = y, r = m;
427
+ });
428
+ f.catch(() => {
429
+ }), this.entries.set(t, {
430
+ promise: f,
431
+ resolve: s,
432
+ reject: r,
433
+ controller: new AbortController(),
434
+ users: 0,
435
+ bytes: 0,
436
+ priority: n.priority,
437
+ maxBytes: n.maxBytes,
438
+ state: "queued"
439
+ });
440
+ }
441
+ const o = this.entries.get(t);
442
+ o.users++, o.priority = Math.min(o.priority, n.priority), o.maxBytes = Math.max(o.maxBytes, n.maxBytes), this.entries.delete(t), this.entries.set(t, o), this.pump();
443
+ let i = !1;
444
+ return {
445
+ ready: o.promise,
446
+ release: () => {
447
+ i || (i = !0, o.users--, o.users === 0 && (o.state === "queued" || o.state === "loading") && (o.state = "aborted", this.cancelled++, o.controller.abort(), o.reject(new DOMException("请求已取消", "AbortError")), this.entries.get(t) === o && this.entries.delete(t)), o.users === 0 && o.state === "error" && this.entries.get(t) === o && this.entries.delete(t), this.trim(), this.pump());
448
+ }
449
+ };
450
+ }
451
+ pump() {
452
+ for (; this.active < this.concurrency; ) {
453
+ const t = [...this.entries].filter(([, o]) => o.state === "queued" && o.users > 0).sort((o, i) => o[1].priority - i[1].priority);
454
+ if (t.length === 0) return;
455
+ const [e, n] = t[0];
456
+ n.state = "loading", this.active++, this.loader(e, {
457
+ signal: n.controller.signal,
458
+ get maxBytes() {
459
+ return n.maxBytes;
460
+ }
461
+ }).then((o) => {
462
+ n.state !== "aborted" && (n.bytes = o.naturalWidth * o.naturalHeight * 4, n.state = "ready", n.resolve(o));
463
+ }).catch((o) => {
464
+ n.state !== "aborted" && (n.state = "error", n.reject(Ae(o)));
465
+ }).finally(() => {
466
+ this.active--, this.trim(), this.pump();
467
+ });
468
+ }
469
+ }
470
+ trim() {
471
+ let t = this.stats.bytes;
472
+ for (const [e, n] of this.entries)
473
+ if (!(n.users > 0 || n.state === "loading" || n.state === "queued")) {
474
+ if (t <= this.budget && this.entries.size <= ue.cacheEntries) break;
475
+ t -= n.bytes, this.entries.delete(e);
476
+ }
477
+ }
478
+ }
479
+ const ea = new Jt(), ke = { kind: "empty" };
480
+ function ta(a) {
481
+ return a.kind === "element" && a.element instanceof HTMLImageElement && a.element.complete && a.element.naturalWidth > 0 ? { kind: "image", image: a.element } : ke;
482
+ }
483
+ function kt() {
484
+ const a = document.createElement("canvas");
485
+ a.width = a.height = 1;
486
+ const t = a.getContext("2d");
487
+ return t.fillStyle = "#f3f4f5", t.fillRect(0, 0, 1, 1), a;
488
+ }
489
+ const Rt = ["thumbnail", "screen", "full"], We = {
490
+ maxOriginalPixels: ue.maxDecodedPixels,
491
+ maxOriginalBytes: ue.maxOriginalBytes,
492
+ maxPreviewBytes: ue.maxPreviewBytes
493
+ }, Ne = (a, t) => t === "full" ? a.src : t === "screen" ? a.previewSrc : a.thumbnail;
494
+ function aa(a, t) {
495
+ return a.width * a.height <= t.maxOriginalPixels;
496
+ }
497
+ function xt(a, t) {
498
+ const e = Math.min(t.width / a.width, t.height / a.height);
499
+ return Math.min(
500
+ 8,
501
+ Math.max(
502
+ 2,
503
+ Math.min(
504
+ 1 / e,
505
+ Math.max(t.width / (a.width * e), t.height / (a.height * e))
506
+ )
507
+ )
508
+ );
509
+ }
510
+ function na(a, t, e, n, o) {
511
+ const i = aa(a, e), s = {
512
+ sources: [],
513
+ originalStatus: t === "full" ? i ? "loading" : "blocked" : "idle",
514
+ originalReason: ""
515
+ };
516
+ s.originalStatus === "blocked" && (s.originalReason = "原图像素过大,当前显示适屏预览,可下载原文件");
517
+ for (const [r, f] of Rt.entries()) {
518
+ if (f === "screen" && t === "thumbnail" || f === "full" && (t !== "full" || !i)) continue;
519
+ const y = n(a, f, o);
520
+ if (!i && y === a.src) {
521
+ s.originalStatus = "blocked", s.originalReason = "大原图需要独立的适屏资源,请从相册生成预览或下载文件";
522
+ continue;
523
+ }
524
+ s.sources.push({ url: y, quality: f, rank: r });
525
+ }
526
+ return s;
527
+ }
528
+ const ia = ["aria-label"], oa = {
529
+ key: 0,
530
+ class: "mp-resource-state",
531
+ role: "status",
532
+ "aria-label": "加载中"
533
+ }, ra = /* @__PURE__ */ $("span", {
534
+ class: "mp-spinner",
535
+ "aria-hidden": "true"
536
+ }, null, -1), la = [
537
+ ra
538
+ ], sa = {
539
+ key: 1,
540
+ class: "mp-resource-state",
541
+ role: "alert"
542
+ }, ua = /* @__PURE__ */ $("span", null, "图片暂时无法加载", -1), ca = {
543
+ key: 2,
544
+ class: "mp-quality-notice",
545
+ role: "status"
546
+ }, da = {
547
+ key: 3,
548
+ class: "mp-quality-notice"
549
+ }, vt = /* @__PURE__ */ Le({
550
+ inheritAttrs: !1,
551
+ __name: "ImageCanvasRenderer",
552
+ props: {
553
+ media: {},
554
+ core: {},
555
+ quality: { default: "screen" },
556
+ rendering: { type: Boolean, default: !0 },
557
+ requestVersion: { default: 0 },
558
+ loadEnabled: { type: Boolean, default: !0 },
559
+ priority: { default: 0 },
560
+ resourcePolicy: { default: () => We },
561
+ resolveSource: { type: Function, default: Ne },
562
+ initialImage: { default: () => ke }
563
+ },
564
+ emits: ["ready", "error", "originalState"],
565
+ setup(a, { emit: t }) {
566
+ const e = a, n = t, o = R(), i = gt({ status: "empty" }), s = R("loading"), r = R(!1), f = R("idle"), y = R("");
567
+ ee(
568
+ [f, y],
569
+ () => n("originalState", f.value, y.value)
570
+ );
571
+ let m = !0, b = 0, B = e.media.id, L = [], P = () => {
572
+ }, p, v = !1, T = { kind: "empty" };
573
+ function I() {
574
+ if (e.core.motionActive.value && e.loadEnabled && B === e.media.id) {
575
+ v = !0;
576
+ return;
577
+ }
578
+ v = !1, k();
579
+ }
580
+ function w(d, M, C) {
581
+ i.value = { status: "ready", image: d, rank: M }, e.core.setMediaElement(d), s.value = "ready", r.value = !1, C === "full" && (f.value = "ready"), e.core.requestRender(), n("ready", C);
582
+ }
583
+ ee(
584
+ () => e.core.motionActive.value,
585
+ (d) => {
586
+ if (!d) {
587
+ if (T.kind === "ready") {
588
+ const M = T;
589
+ T = { kind: "empty" }, M.token === b && w(M.image, M.rank, M.quality);
590
+ }
591
+ v && I();
592
+ }
593
+ }
594
+ ), ze(() => {
595
+ const d = o.value;
596
+ p = d.getContext("2d"), e.core.canvasRef.value = d, P = e.core.registerRenderHandler(h), u(), ye(() => {
597
+ m && I();
598
+ });
599
+ }), Re(() => {
600
+ m = !1, b += 1, P(), L.forEach((d) => d.release());
601
+ }), ee(
602
+ [
603
+ () => e.media.id,
604
+ () => e.media.src,
605
+ () => e.media.thumbnail,
606
+ () => e.media.previewSrc,
607
+ () => e.quality,
608
+ () => e.loadEnabled,
609
+ () => e.priority,
610
+ () => e.resolveSource,
611
+ () => e.requestVersion
612
+ ],
613
+ () => {
614
+ I();
615
+ }
616
+ ), ee(() => e.initialImage, u), ee(
617
+ () => e.rendering,
618
+ (d) => {
619
+ d && e.core.requestRender();
620
+ }
621
+ );
622
+ function u() {
623
+ e.initialImage.kind !== "image" || i.value.status === "ready" || (i.value = { status: "ready", image: e.initialImage.image, rank: 0 }, e.core.setMediaElement(e.initialImage.image), s.value = "ready", e.core.requestRender(), n("ready", "thumbnail"));
624
+ }
625
+ async function k() {
626
+ const d = ++b;
627
+ if (T = { kind: "empty" }, r.value = !1, B !== e.media.id && (B = e.media.id, i.value = { status: "empty" }, s.value = "loading", e.core.clearMedia(), u()), !e.loadEnabled) {
628
+ L.forEach((Y) => Y.release()), L = [];
629
+ return;
630
+ }
631
+ const M = Math.ceil(
632
+ e.core.viewportSize.value.width * Math.min(devicePixelRatio, ue.maxDevicePixelRatio) * e.core.state.level
633
+ ), C = na(
634
+ e.media,
635
+ e.quality,
636
+ e.resourcePolicy,
637
+ e.resolveSource,
638
+ M
639
+ );
640
+ y.value = C.originalReason, f.value = C.originalStatus;
641
+ const { sources: E } = C, A = E.map(
642
+ (Y) => ea.acquire(Y.url, {
643
+ priority: e.priority,
644
+ maxBytes: Y.quality === "full" ? e.resourcePolicy.maxOriginalBytes : e.resourcePolicy.maxPreviewBytes
645
+ })
646
+ ), V = L;
647
+ L = A, V.forEach((Y) => Y.release()), E.length === 0 && i.value.status === "empty" && (s.value = "error", n("error", new Xe(y.value))), i.value.status === "ready" && n("ready", Rt[i.value.rank]);
648
+ let _ = i.value.status === "ready" ? i.value.rank : -1, N = 0;
649
+ await Promise.all(
650
+ E.map(async (Y, Pe) => {
651
+ const se = Y.rank, fe = A[Pe];
652
+ try {
653
+ const K = await fe.ready;
654
+ if (d !== b || se < _) return;
655
+ _ = se, e.core.motionActive.value && i.value.status === "ready" ? T = { kind: "ready", token: d, image: K, rank: se, quality: Y.quality } : w(K, se, Y.quality);
656
+ } catch (K) {
657
+ if (d !== b || K instanceof Error && K.name === "AbortError") return;
658
+ Y.quality === "full" && (f.value = K instanceof Xe ? "blocked" : "error", y.value = K instanceof Error ? K.message : "原图加载失败,可重试"), N += 1, se > _ && i.value.status === "ready" && (r.value = !0), N === E.length && i.value.status === "empty" && (s.value = "error"), n("error", Ae(K));
659
+ }
660
+ })
661
+ );
662
+ }
663
+ function h() {
664
+ if (!e.rendering || i.value.status !== "ready") return;
665
+ const d = o.value, M = e.core.viewportSize.value;
666
+ if (M.width <= 0 || M.height <= 0) return;
667
+ const C = Math.min(
668
+ devicePixelRatio,
669
+ ue.maxDevicePixelRatio,
670
+ Math.sqrt(ue.maxCanvasPixels / (M.width * M.height))
671
+ ), E = Math.max(1, Math.round(M.width * C)), A = Math.max(1, Math.round(M.height * C));
672
+ (d.width !== E || d.height !== A) && (d.width = E, d.height = A), p.setTransform(C, 0, 0, C, 0, 0), p.clearRect(0, 0, M.width, M.height), p.imageSmoothingEnabled = !0, p.imageSmoothingQuality = "high", p.translate(
673
+ M.width / 2 + e.core.state.offsetX,
674
+ M.height / 2 + e.core.state.offsetY
675
+ ), p.rotate(e.core.state.rotation * Math.PI / 180);
676
+ const { width: V, height: _ } = e.core.mediaSize.value, N = e.core.displayScale.value;
677
+ p.drawImage(
678
+ i.value.image,
679
+ -V * N / 2,
680
+ -_ * N / 2,
681
+ V * N,
682
+ _ * N
683
+ );
684
+ }
685
+ return (d, M) => (z(), H(De, null, [
686
+ $("canvas", {
687
+ ref_key: "canvasRef",
688
+ ref: o,
689
+ class: "mp-canvas-renderer",
690
+ "aria-label": d.media.title
691
+ }, null, 8, ia),
692
+ s.value === "loading" ? (z(), H("div", oa, la)) : ie("", !0),
693
+ s.value === "error" ? (z(), H("div", sa, [
694
+ ua,
695
+ $("button", {
696
+ type: "button",
697
+ onClick: J(k, ["stop"])
698
+ }, "重新加载")
699
+ ])) : ie("", !0),
700
+ f.value === "blocked" ? (z(), H("span", ca, le(y.value), 1)) : r.value ? (z(), H("span", da, "高清图加载失败,当前显示预览图")) : ie("", !0)
701
+ ], 64));
702
+ }
703
+ });
704
+ function Ie(a) {
705
+ const t = Math.max(0, Math.floor(Number.isFinite(a) ? a : 0));
706
+ return `${String(Math.floor(t / 60)).padStart(2, "0")}:${String(t % 60).padStart(2, "0")}`;
707
+ }
708
+ function Lt(a, t) {
709
+ const e = mt({
710
+ playing: !1,
711
+ buffering: !1,
712
+ duration: 0,
713
+ time: 0,
714
+ buffered: 0,
715
+ muted: !1,
716
+ ended: !1,
717
+ scrubbing: !1,
718
+ scrubTime: 0,
719
+ status: "loading"
720
+ });
721
+ let n = !1, o = 0, i = !1;
722
+ const s = U(() => e.duration > 0 && e.status !== "error"), r = U(() => e.scrubbing ? e.scrubTime : e.time), f = U(() => s.value ? r.value / e.duration * 100 : 0), y = U(
723
+ () => s.value ? e.buffered / e.duration * 100 : 0
724
+ );
725
+ function m() {
726
+ const h = a();
727
+ e.time = h.currentTime, e.duration = Number.isFinite(h.duration) ? h.duration : 0;
728
+ const d = h.buffered;
729
+ e.buffered = d.length > 0 ? d.end(d.length - 1) : 0;
730
+ }
731
+ async function b() {
732
+ if (i) return;
733
+ const h = ++o;
734
+ e.ended && (a().currentTime = 0), e.ended = !1, e.buffering = !0;
735
+ try {
736
+ await a().play();
737
+ } catch (d) {
738
+ if (h !== o) return;
739
+ e.buffering = !1, e.playing = !1, d instanceof Error && d.name !== "NotAllowedError" && d.name !== "AbortError" && t(d);
740
+ }
741
+ }
742
+ function B() {
743
+ o += 1, n = !1, e.scrubbing = !1, e.buffering = !1, a().pause();
744
+ }
745
+ function L() {
746
+ e.playing ? B() : b();
747
+ }
748
+ function P() {
749
+ !s.value || e.scrubbing || (n = e.playing, e.scrubbing = !0, e.scrubTime = e.time, a().pause());
750
+ }
751
+ function p(h) {
752
+ e.scrubTime = de(h, 0, e.duration);
753
+ }
754
+ function v(h = !0) {
755
+ if (!e.scrubbing) return;
756
+ const d = n;
757
+ n = !1, e.scrubbing = !1, h && (a().currentTime = e.scrubTime, e.time = e.scrubTime, e.ended = !1), d && b();
758
+ }
759
+ function T() {
760
+ a().muted = !a().muted, e.muted = a().muted;
761
+ }
762
+ const w = Object.fromEntries(
763
+ Object.entries({
764
+ loadedmetadata: m,
765
+ durationchange: m,
766
+ timeupdate: m,
767
+ progress: m,
768
+ loadeddata: () => {
769
+ m(), e.status = "ready", e.buffering = !1;
770
+ },
771
+ canplay: () => {
772
+ e.buffering = !1;
773
+ },
774
+ play: () => {
775
+ e.playing = !0, e.ended = !1;
776
+ },
777
+ playing: () => {
778
+ e.playing = !0, e.buffering = !1;
779
+ },
780
+ pause: () => {
781
+ e.playing = !1, e.buffering = !1;
782
+ },
783
+ ended: () => {
784
+ e.playing = !1, e.ended = !0, e.buffering = !1, m();
785
+ },
786
+ waiting: () => {
787
+ e.buffering = e.playing;
788
+ },
789
+ seeking: () => {
790
+ e.buffering = !0;
791
+ },
792
+ seeked: () => {
793
+ e.buffering = !1, m();
794
+ },
795
+ volumechange: () => {
796
+ e.muted = a().muted;
797
+ },
798
+ error: () => {
799
+ e.status = "error", e.playing = !1, e.buffering = !1, t(new Error("视频暂时无法播放,请重试或检查资源格式"));
800
+ }
801
+ }).map(([h, d]) => [
802
+ h,
803
+ () => {
804
+ i || d();
805
+ }
806
+ ])
807
+ );
808
+ function u() {
809
+ i = !0, B();
810
+ }
811
+ function k() {
812
+ e.status = "loading", e.buffering = !0, a().load();
813
+ }
814
+ return {
815
+ state: e,
816
+ seekable: s,
817
+ displayTime: r,
818
+ progress: f,
819
+ bufferedProgress: y,
820
+ events: w,
821
+ play: b,
822
+ pause: B,
823
+ toggle: L,
824
+ beginScrub: P,
825
+ scrub: p,
826
+ endScrub: v,
827
+ toggleMuted: T,
828
+ retry: k,
829
+ dispose: u
830
+ };
831
+ }
832
+ const fa = ["data-live-state"], ga = { class: "mp-dom-renderer mp-live-photo__motion" }, ma = ["preload"], pa = /* @__PURE__ */ Le({
833
+ __name: "LivePhotoRenderer",
834
+ props: {
835
+ media: {},
836
+ core: {},
837
+ playing: { type: Boolean, default: !1 },
838
+ active: { type: Boolean, default: !0 },
839
+ enabled: { type: Boolean, default: !0 },
840
+ requestVersion: { default: 0 },
841
+ loadEnabled: { type: Boolean, default: !0 },
842
+ priority: { default: 0 },
843
+ resourcePolicy: { default: () => We },
844
+ resolveSource: { type: Function, default: Ne },
845
+ rendering: { type: Boolean, default: !0 },
846
+ initialImage: { default: () => ke },
847
+ quality: { default: "screen" }
848
+ },
849
+ emits: ["ready", "error", "originalState", "liveState", "liveEnded"],
850
+ setup(a, { expose: t, emit: e }) {
851
+ const n = a, o = e, i = R(), s = R(), r = R(), f = Lt(
852
+ () => i.value,
853
+ (u) => o("error", u)
854
+ ), { state: y } = f;
855
+ Et(
856
+ () => i.value,
857
+ () => n.media,
858
+ () => n.active && n.loadEnabled,
859
+ () => lt,
860
+ (u) => {
861
+ y.status = "error", o("error", u);
862
+ }
863
+ );
864
+ let m = !1, b = () => {
865
+ };
866
+ const B = U(
867
+ () => n.active && n.enabled && y.playing && y.status === "ready" && !y.buffering
868
+ ), L = U(() => ({
869
+ transform: `translate(-50%, -50%) translate3d(${n.core.state.offsetX}px, ${n.core.state.offsetY}px, 0)`
870
+ })), P = U(() => ({
871
+ width: `${n.core.mediaSize.value.width * n.core.displayScale.value}px`,
872
+ height: `${n.core.mediaSize.value.height * n.core.displayScale.value}px`,
873
+ transform: `rotate(${n.core.state.rotation}deg)`
874
+ }));
875
+ function p() {
876
+ f.pause(), i.value.readyState >= HTMLMediaElement.HAVE_METADATA && (i.value.currentTime = 0);
877
+ }
878
+ function v() {
879
+ !n.active || !n.enabled || !n.loadEnabled || !n.playing || y.status !== "ready" || y.buffering ? p() : f.play().then(() => {
880
+ !m && !y.playing && n.playing && o("liveEnded");
881
+ });
882
+ }
883
+ ee(
884
+ () => [y.status, y.playing, y.buffering],
885
+ () => {
886
+ const u = y.status === "error" ? "error" : y.buffering || y.status === "loading" ? "loading" : B.value ? "playing" : "idle";
887
+ o("liveState", u);
888
+ },
889
+ { immediate: !0 }
890
+ );
891
+ function T() {
892
+ m || (p(), o("liveEnded"));
893
+ }
894
+ function I() {
895
+ document.hidden && (p(), o("liveEnded"));
896
+ }
897
+ ze(() => {
898
+ b = ee(() => [n.active, n.enabled, n.loadEnabled, n.playing], v, {
899
+ flush: "post"
900
+ }), v(), document.addEventListener("visibilitychange", I);
901
+ }), Re(() => {
902
+ b(), m = !0, f.dispose(), document.removeEventListener("visibilitychange", I);
903
+ });
904
+ function w() {
905
+ const u = document.createElement("canvas"), k = Math.min(
906
+ 1,
907
+ Math.sqrt(ue.maxCanvasPixels / (n.media.width * n.media.height))
908
+ );
909
+ u.width = Math.round(n.media.width * k), u.height = Math.round(n.media.height * k);
910
+ const h = u.getContext("2d"), d = Number(getComputedStyle(r.value).opacity);
911
+ h.drawImage(n.core.mediaRef.value, 0, 0, u.width, u.height), d < 1 && i.value.readyState >= HTMLMediaElement.HAVE_CURRENT_DATA && (h.globalAlpha = 1 - d, h.drawImage(i.value, 0, 0, u.width, u.height));
912
+ const M = new DOMMatrixReadOnly(getComputedStyle(s.value).transform).a;
913
+ return f.pause(), { image: u, scale: M };
914
+ }
915
+ return t({ captureFrame: w }), (u, k) => (z(), H("div", {
916
+ class: "mp-live-photo-renderer",
917
+ "data-live-state": g(y).status === "error" ? "error" : B.value ? "playing" : "idle"
918
+ }, [
919
+ $("div", {
920
+ ref_key: "effectsRef",
921
+ ref: s,
922
+ class: qe(["mp-live-photo__effects", { "is-playing": B.value }])
923
+ }, [
924
+ $("div", ga, [
925
+ $("div", {
926
+ class: "mp-dom-renderer__frame",
927
+ style: Se(L.value)
928
+ }, [
929
+ $("video", Ue({
930
+ ref_key: "videoRef",
931
+ ref: i,
932
+ class: "mp-dom-renderer__node",
933
+ style: P.value,
934
+ preload: u.active && u.enabled && u.loadEnabled ? "auto" : "none",
935
+ playsinline: "",
936
+ "webkit-playsinline": "true",
937
+ crossorigin: "anonymous"
938
+ }, pt(g(f).events, !0), {
939
+ onEnded: T,
940
+ onError: k[0] || (k[0] = (h) => o("liveEnded"))
941
+ }), null, 16, ma)
942
+ ], 4)
943
+ ]),
944
+ $("div", {
945
+ ref_key: "stillRef",
946
+ ref: r,
947
+ class: qe(["mp-live-photo__still", { "is-playing": B.value }])
948
+ }, [
949
+ Be(vt, {
950
+ "request-version": u.requestVersion,
951
+ "load-enabled": u.loadEnabled,
952
+ priority: u.priority,
953
+ "resource-policy": u.resourcePolicy,
954
+ "resolve-source": u.resolveSource,
955
+ onOriginalState: k[1] || (k[1] = (h, d) => o("originalState", h, d)),
956
+ media: u.media,
957
+ "initial-image": u.initialImage,
958
+ rendering: u.rendering,
959
+ core: u.core,
960
+ quality: u.quality,
961
+ onReady: k[2] || (k[2] = (h) => o("ready", h)),
962
+ onError: k[3] || (k[3] = (h) => o("error", h))
963
+ }, null, 8, ["request-version", "load-enabled", "priority", "resource-policy", "resolve-source", "media", "initial-image", "rendering", "core", "quality"])
964
+ ], 2)
965
+ ], 2)
966
+ ], 8, fa));
967
+ }
968
+ });
969
+ function va(a, t) {
970
+ const e = document.createElement("canvas"), n = Math.min(1, Math.sqrt(ue.maxCanvasPixels / (t.width * t.height)));
971
+ e.width = Math.max(1, Math.round(t.width * n)), e.height = Math.max(1, Math.round(t.height * n));
972
+ const o = Math.min(e.width / a.videoWidth, e.height / a.videoHeight), i = a.videoWidth * o, s = a.videoHeight * o;
973
+ return e.getContext("2d").drawImage(a, (e.width - i) / 2, (e.height - s) / 2, i, s), a.pause(), e;
974
+ }
975
+ const ha = {
976
+ class: "mp-video-icon--generic",
977
+ width: "22",
978
+ height: "22",
979
+ viewBox: "0 0 24 24",
980
+ fill: "none",
981
+ stroke: "currentColor",
982
+ "stroke-width": "1.7",
983
+ "stroke-linecap": "round",
984
+ "stroke-linejoin": "round",
985
+ "aria-hidden": "true"
986
+ }, ya = ["d", "fill"], wa = ["src"], ba = ["src"], it = /* @__PURE__ */ Le({
987
+ __name: "VideoIcon",
988
+ props: {
989
+ name: {}
990
+ },
991
+ setup(a) {
992
+ const t = a, e = {
993
+ play: ["mobile-play", "pc-play"],
994
+ replay: ["mobile-play", "pc-play"],
995
+ pause: ["mobile-pause", "pc-pause"],
996
+ fullscreen: ["mobile-fullscreen", "pc-fullscreen"],
997
+ exit: ["mobile-fullscreen", "pc-exit"]
998
+ }, n = {
999
+ "mobile-play": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='18px'%20height='18px'%20viewBox='0%200%2018%2018'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e三角形%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='2时间轴-查看视频'%20transform='translate(-18.000000,%20-687.000000)'%20fill='%23333333'%3e%3cg%20id='编组-5'%20transform='translate(0.000000,%20672.000000)'%3e%3cg%20id='编组-4'%20transform='translate(18.000000,%2012.913043)'%3e%3cpath%20d='M13.5185936,7.08213339%20L18.1443888,14.1750193%20C19.2003225,15.7941177%2018.7437874,17.9626598%2017.1246889,19.0185936%20C16.5559936,19.3894818%2015.8917011,19.5869565%2015.2127517,19.5869565%20L5.96116137,19.5869565%20C4.02816475,19.5869565%202.46116137,18.0199531%202.46116137,16.0869565%20C2.46116137,15.4080071%202.65863607,14.7437145%203.02952428,14.1750193%20L7.65531943,7.08213339%20C8.71125321,5.46303494%2010.8797953,5.00649976%2012.4988938,6.06243353%20C12.9058908,6.3278664%2013.2531607,6.67513633%2013.5185936,7.08213339%20Z'%20id='三角形'%20transform='translate(10.586957,%2011.086957)%20rotate(90.000000)%20translate(-10.586957,%20-11.086957)%20'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1000
+ "mobile-pause": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='18px'%20height='18px'%20viewBox='0%200%2018%2018'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e暂停%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='2时间轴-观看视频'%20transform='translate(-17.000000,%20-687.000000)'%20fill='%23333333'%3e%3cg%20id='编组-5'%20transform='translate(0.000000,%20672.000000)'%3e%3cg%20id='编组-3'%20transform='translate(17.000000,%2012.913043)'%3e%3cg%20id='暂停-2'%20transform='translate(0.000000,%202.086957)'%3e%3cg%20id='暂停'%20transform='translate(3.000000,%201.500000)'%3e%3crect%20id='矩形'%20x='0'%20y='0'%20width='3.5'%20height='15'%20rx='1.75'%3e%3c/rect%3e%3crect%20id='矩形备份-7'%20x='9'%20y='0'%20width='3.5'%20height='15'%20rx='1.75'%3e%3c/rect%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1001
+ "mobile-fullscreen": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='24px'%20height='24px'%20viewBox='0%200%2024%2024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e横竖屏备份%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='懒猫微服-图标库2.0'%20transform='translate(-449.000000,%20-196.000000)'%20stroke='%23333333'%20stroke-width='1.5'%3e%3cg%20id='横竖屏'%20transform='translate(449.000000,%20196.000000)'%3e%3crect%20id='矩形'%20x='3.75'%20y='9.75'%20width='16.5'%20height='10.5'%20rx='4'%3e%3c/rect%3e%3crect%20id='矩形'%20fill='%23FFFFFF'%20x='3.75'%20y='3.75'%20width='10.5'%20height='16.5'%20rx='4'%3e%3c/rect%3e%3cline%20x1='7.5'%20y1='7'%20x2='10.5'%20y2='7'%20id='路径-83'%20stroke-linecap='round'%3e%3c/line%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1002
+ "center-play": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='14px'%20height='14px'%20viewBox='0%200%2014%2014'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e播放%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill-rule='evenodd'%3e%3cg%20id='2时间轴-查看视频'%20transform='translate(-181.000000,%20-399.000000)'%20fill-rule='nonzero'%3e%3cg%20id='播放'%20transform='translate(164.000000,%20382.000000)'%3e%3cg%20id='播放-2'%20transform='translate(17.000000,%2016.000000)'%3e%3cpath%20d='M10.7364863,4.038851%20L15.2901269,12.0077221%20C15.8381469,12.966757%2015.5049534,14.1884663%2014.5459185,14.7364863%20C14.2437231,14.9091694%2013.9016945,15%2013.5536406,15%20L4.44635936,15%20C3.34178986,15%202.44635936,14.1045695%202.44635936,13%20C2.44635936,12.6519461%202.53718999,12.3099175%202.70987307,12.0077221%20L7.26351372,4.038851%20C7.81153365,3.0798161%209.03324298,2.74662265%209.99227788,3.29464259%20C10.3023404,3.47182119%2010.5593077,3.72878844%2010.7364863,4.038851%20Z'%20id='播放'%20transform='translate(9.000000,%208.000000)%20rotate(90.000000)%20translate(-9.000000,%20-8.000000)%20'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1003
+ "pc-play": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='16px'%20height='16px'%20viewBox='0%200%2016%2016'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e开始%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='2.11查看视频'%20transform='translate(-764.000000,%20-1017.000000)'%20fill='%23FFFFFF'%3e%3cg%20id='编组-7'%20transform='translate(68.000000,%200.000000)'%3e%3cg%20id='编组'%20transform='translate(646.000000,%20970.000000)'%3e%3cg%20id='开始'%20transform='translate(50.000000,%2045.022998)'%3e%3cpath%20d='M11.1122895,6.09085035%20L16.0457675,13.4910673%20C16.9648249,14.8696534%2016.5923033,16.7322614%2015.2137172,17.6513188%20C14.7209147,17.9798538%2014.1418916,18.1551679%2013.5496166,18.1551679%20L4.15581091,18.1551679%20C2.49895666,18.1551679%201.15581091,16.8120222%201.15581091,15.1551679%20C1.15581091,14.6093944%201.30469549,14.0739605%201.58643112,13.6065274%20L6.04675886,6.20631041%20C6.90204941,4.78728113%208.74574991,4.3302806%2010.1647792,5.18557115%20C10.5434695,5.41381888%2010.8670246,5.72295299%2011.1122895,6.09085035%20Z'%20id='三角形'%20transform='translate(9.000000,%2010.155168)%20rotate(90.000000)%20translate(-9.000000,%20-10.155168)%20'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1004
+ "pc-pause": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='16px'%20height='16px'%20viewBox='0%200%2016%2016'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e暂停%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='2.11查看视频'%20transform='translate(-737.000000,%20-1017.000000)'%20fill='%23FFFFFF'%3e%3cg%20id='编组-7'%20transform='translate(68.000000,%200.000000)'%3e%3cg%20id='编组'%20transform='translate(646.000000,%20970.000000)'%3e%3cg%20id='暂停-2'%20transform='translate(23.000000,%2047.000000)'%3e%3cg%20id='暂停'%20transform='translate(1.000000,%200.000000)'%3e%3crect%20id='矩形'%20x='0'%20y='0'%20width='4'%20height='16'%20rx='2'%3e%3c/rect%3e%3crect%20id='矩形备份-4'%20x='10'%20y='0'%20width='4'%20height='16'%20rx='2'%3e%3c/rect%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1005
+ "pc-fullscreen": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='16px'%20height='16px'%20viewBox='0%200%2016%2016'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e形状%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='2.11查看视频'%20transform='translate(-1236.000000,%20-1017.000000)'%20fill='%23FFFFFF'%20fill-rule='nonzero'%3e%3cg%20id='编组-7'%20transform='translate(68.000000,%200.000000)'%3e%3cg%20id='编组'%20transform='translate(646.000000,%20970.000000)'%3e%3cg%20id='形状-2'%20transform='translate(522.000000,%2047.000000)'%3e%3cpath%20d='M2.64896326,8.31181102%20C3.0069116,8.31181102%203.29792652,8.60254391%203.29792652,8.96014537%20L3.297,11.774%20L6.30847581,8.766808%20C6.56165879,8.51387038%206.97344489,8.51387038%207.22662786,8.766808%20C7.47981084,9.01974561%207.47981084,9.43113265%207.22662786,9.68407026%20L4.204,12.701%20L7.04328847,12.7018776%20C7.40123681,12.7018776%207.69225716,12.9926105%207.69225716,13.350212%20C7.6937068,13.7092671%207.40269189,14%207.04328847,14%20L3.79410695,14%20C2.80465624,14%202,13.1961236%202,12.2076317%20L2,8.96014537%20C2,8.60254391%202.29101491,8.31181102%202.64896326,8.31181102%20Z%20M12.2058931,2%20C12.6893524,2%2013.1286932,2.19192028%2013.4516066,2.50352194%20C13.4593844,2.50982425%2013.4671226,2.51718474%2013.4747181,2.52477286%20L13.4959896,2.54786191%20C13.8078935,2.87046237%2014,3.30937746%2014,3.79236826%20L14,7.03985463%20C14,7.39745609%2013.7089851,7.68818898%2013.3510367,7.68818898%20C12.9930884,7.68818898%2012.7020735,7.39745609%2012.7020735,7.03985463%20L12.702,4.213%20L9.67842852,7.23464567%20C9.55183703,7.36111448%209.38450346,7.42507571%209.21862495,7.42507571%20C9.05274645,7.42507571%208.88686795,7.36111448%208.76027646,7.23464567%20C8.50709349,6.98170806%208.50709349,6.57032102%208.76027646,6.3173834%20L11.783,3.296%20L8.95525646,3.29666869%20C8.59730811,3.29666869%208.3062932,3.0059358%208.3062932,2.64833434%20C8.3062932,2.29073289%208.59730811,2%208.95525646,2%20L12.2058931,2%20Z'%20id='全屏'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href,
1006
+ "pc-exit": new URL("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20width='16px'%20height='16px'%20viewBox='0%200%2016%2016'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3ctitle%3e形状备份%3c/title%3e%3cg%20id='页面-1'%20stroke='none'%20stroke-width='1'%20fill='none'%20fill-rule='evenodd'%3e%3cg%20id='2.11查看视频'%20transform='translate(-1275.000000,%20-1007.000000)'%20fill='%23FFFFFF'%20fill-rule='nonzero'%3e%3cg%20id='编组-7'%20transform='translate(68.000000,%200.000000)'%3e%3cg%20id='编组备份'%20transform='translate(601.000000,%20987.000000)'%3e%3cg%20id='形状-2'%20transform='translate(606.000000,%2020.000000)'%3e%3cpath%20d='M5.89959985,8.31181102%20C6.88905056,8.31181102%207.6937068,9.11568746%207.6937068,10.1041793%20L7.6937068,13.3516657%20C7.6937068,13.7092671%207.40269189,14%207.04474354,14%20C6.6867952,14%206.39578028,13.7092671%206.39578028,13.3516657%20L6.395,10.514%20L3.43761368,13.4679588%20C3.31102219,13.5958813%203.14514369,13.6583889%202.97926519,13.6583889%20C2.81338669,13.6583889%202.64750818,13.5944276%202.5209167,13.4679588%20C2.26773372,13.2150212%202.26773372,12.8036342%202.5209167,12.5506965%20L5.465,9.608%20L2.64896326,9.60847971%20C2.29101491,9.60847971%202,9.31774682%202,8.96014537%20C2,8.60254391%202.29101491,8.31181102%202.64896326,8.31181102%20L5.89959985,8.31181102%20Z%20M8.9567061,2%20C9.31465444,2%209.60566936,2.29073289%209.60566936,2.64833434%20L9.605,5.473%20L12.556566,2.52477286%20C12.809749,2.27183525%2013.2215351,2.27183525%2013.4747181,2.52477286%20C13.7279011,2.77771048%2013.7279011,3.18909752%2013.4747181,3.44203513%20L10.523,6.39%20L13.3510313,6.39006663%20C13.7089797,6.39006663%2014,6.68079952%2014,7.03840097%20C14.0014496,7.39745609%2013.7104347,7.68818898%2013.3510313,7.68818898%20L10.1018498,7.68818898%20C9.11239908,7.68818898%208.30774284,6.88431254%208.30774284,5.89582071%20L8.30774284,2.64833434%20C8.30774284,2.29073289%208.59875775,2%208.9567061,2%20Z'%20id='全屏'%3e%3c/path%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e", import.meta.url).href
1007
+ }, o = {
1008
+ play: ["m9 5 11 7-11 7Z"],
1009
+ pause: ["M8 5v14M16 5v14"],
1010
+ replay: ["M4 10a8 8 0 1 1 1 7", "M4 4v6h6"],
1011
+ fullscreen: ["M4 9V4h5M15 4h5v5M20 15v5h-5M9 20H4v-5"],
1012
+ exit: ["M9 4v5H4M20 9h-5V4M15 20v-5h5M4 15h5v5"],
1013
+ volume: ["m11 4-6 5H2v6h3l6 5Z", "M15 8a6 6 0 0 1 0 8M18 5a10 10 0 0 1 0 14"],
1014
+ muted: ["m11 4-6 5H2v6h3l6 5Z", "m16 9 6 6m0-6-6 6"]
1015
+ };
1016
+ return (i, s) => (z(), H("span", {
1017
+ class: qe(["mp-video-icon", { "has-album-icon": t.name in e }])
1018
+ }, [
1019
+ (z(), H("svg", ha, [
1020
+ (z(!0), H(De, null, ot(o[i.name], (r, f) => (z(), H("path", {
1021
+ key: f,
1022
+ d: r,
1023
+ fill: i.name === "play" ? "currentColor" : "none"
1024
+ }, null, 8, ya))), 128))
1025
+ ])),
1026
+ i.name in e ? (z(), H(De, { key: 0 }, [
1027
+ $("img", {
1028
+ class: "mp-video-icon--mobile",
1029
+ src: n[e[i.name][0]],
1030
+ alt: "",
1031
+ "aria-hidden": "true",
1032
+ draggable: "false"
1033
+ }, null, 8, wa),
1034
+ $("img", {
1035
+ class: "mp-video-icon--desktop",
1036
+ src: n[e[i.name][1]],
1037
+ alt: "",
1038
+ "aria-hidden": "true",
1039
+ draggable: "false"
1040
+ }, null, 8, ba)
1041
+ ], 64)) : ie("", !0)
1042
+ ], 2));
1043
+ }
1044
+ }), ka = {
1045
+ key: 0,
1046
+ class: "mp-video-seek-preview"
1047
+ }, xa = ["aria-label", "disabled"], Ma = { class: "mp-video-time" }, Sa = ["tabindex", "aria-disabled", "aria-valuemax", "aria-valuenow", "aria-valuetext"], Pa = /* @__PURE__ */ $("span", { class: "mp-video-progress__rail" }, null, -1), Ca = { class: "mp-video-time" }, Ea = ["aria-label", "aria-pressed"], Ra = ["aria-label", "disabled"], La = /* @__PURE__ */ Le({
1048
+ __name: "VideoControls",
1049
+ props: {
1050
+ playback: {},
1051
+ fullscreen: { type: Boolean },
1052
+ canFullscreen: { type: Boolean }
1053
+ },
1054
+ emits: ["fullscreen"],
1055
+ setup(a, { emit: t }) {
1056
+ const e = a, n = t, o = R(), { state: i, seekable: s, displayTime: r, progress: f, bufferedProgress: y } = e.playback;
1057
+ function m(p) {
1058
+ const v = o.value.getBoundingClientRect();
1059
+ e.playback.scrub((p.clientX - v.left) / Math.max(1, v.width) * i.duration);
1060
+ }
1061
+ function b(p) {
1062
+ !s.value || p.pointerType === "mouse" && p.button !== 0 || (o.value.setPointerCapture(p.pointerId), e.playback.beginScrub(), m(p));
1063
+ }
1064
+ function B(p) {
1065
+ i.scrubbing && m(p);
1066
+ }
1067
+ function L(p) {
1068
+ i.scrubbing && (m(p), e.playback.endScrub());
1069
+ }
1070
+ function P(p) {
1071
+ e.playback.beginScrub(), e.playback.scrub(r.value + p), e.playback.endScrub();
1072
+ }
1073
+ return (p, v) => (z(), H("div", {
1074
+ class: "mp-video-controls",
1075
+ "data-preview-control": "",
1076
+ onPointerdown: v[9] || (v[9] = J(() => {
1077
+ }, ["stop"])),
1078
+ onPointermove: v[10] || (v[10] = J(() => {
1079
+ }, ["stop"])),
1080
+ onPointerup: v[11] || (v[11] = J(() => {
1081
+ }, ["stop"])),
1082
+ onPointercancel: v[12] || (v[12] = J(() => {
1083
+ }, ["stop"])),
1084
+ onClick: v[13] || (v[13] = J(() => {
1085
+ }, ["stop"])),
1086
+ onDblclick: v[14] || (v[14] = J(() => {
1087
+ }, ["stop"])),
1088
+ onKeydown: v[15] || (v[15] = J(() => {
1089
+ }, ["stop"]))
1090
+ }, [
1091
+ g(i).scrubbing ? (z(), H("div", ka, [
1092
+ It(le(g(Ie)(g(r))), 1),
1093
+ $("span", null, " / " + le(g(Ie)(g(i).duration)), 1)
1094
+ ])) : ie("", !0),
1095
+ $("button", {
1096
+ type: "button",
1097
+ "aria-label": g(i).ended ? "重新播放视频" : g(i).playing ? "暂停视频" : "播放视频",
1098
+ disabled: g(i).status === "error",
1099
+ onClick: v[0] || (v[0] = //@ts-ignore
1100
+ (...T) => p.playback.toggle && p.playback.toggle(...T))
1101
+ }, [
1102
+ Be(it, {
1103
+ name: g(i).ended ? "replay" : g(i).playing ? "pause" : "play"
1104
+ }, null, 8, ["name"])
1105
+ ], 8, xa),
1106
+ $("time", Ma, le(g(Ie)(g(r))), 1),
1107
+ $("div", {
1108
+ ref_key: "track",
1109
+ ref: o,
1110
+ class: qe(["mp-video-progress", { "is-scrubbing": g(i).scrubbing }]),
1111
+ role: "slider",
1112
+ "aria-label": "视频进度",
1113
+ tabindex: g(s) ? 0 : -1,
1114
+ "aria-disabled": !g(s),
1115
+ "aria-valuemin": "0",
1116
+ "aria-valuemax": g(i).duration,
1117
+ "aria-valuenow": g(r),
1118
+ "aria-valuetext": `${g(Ie)(g(r))} / ${g(Ie)(g(i).duration)}`,
1119
+ onPointerdown: J(b, ["prevent"]),
1120
+ onPointermove: J(B, ["prevent"]),
1121
+ onPointerup: J(L, ["prevent"]),
1122
+ onPointercancel: v[1] || (v[1] = (T) => p.playback.endScrub(!1)),
1123
+ onLostpointercapture: v[2] || (v[2] = (T) => p.playback.endScrub(!1)),
1124
+ onKeydown: [
1125
+ v[3] || (v[3] = at(J((T) => P(-5), ["prevent"]), ["left"])),
1126
+ v[4] || (v[4] = at(J((T) => P(5), ["prevent"]), ["right"])),
1127
+ v[5] || (v[5] = at(J((T) => P(-g(i).duration), ["prevent"]), ["home"])),
1128
+ v[6] || (v[6] = at(J((T) => P(g(i).duration), ["prevent"]), ["end"]))
1129
+ ]
1130
+ }, [
1131
+ Pa,
1132
+ $("span", {
1133
+ class: "mp-video-progress__buffered",
1134
+ style: Se({ width: `${g(y)}%` })
1135
+ }, null, 4),
1136
+ $("span", {
1137
+ class: "mp-video-progress__played",
1138
+ style: Se({ width: `${g(f)}%` })
1139
+ }, null, 4),
1140
+ $("span", {
1141
+ class: "mp-video-progress__thumb",
1142
+ style: Se({ left: `${g(f)}%` })
1143
+ }, null, 4)
1144
+ ], 42, Sa),
1145
+ $("time", Ca, le(g(Ie)(g(i).duration)), 1),
1146
+ $("button", {
1147
+ type: "button",
1148
+ class: "mp-video-volume",
1149
+ "aria-label": g(i).muted ? "开启声音" : "静音视频",
1150
+ "aria-pressed": g(i).muted,
1151
+ onClick: v[7] || (v[7] = //@ts-ignore
1152
+ (...T) => p.playback.toggleMuted && p.playback.toggleMuted(...T))
1153
+ }, [
1154
+ Be(it, {
1155
+ name: g(i).muted ? "muted" : "volume"
1156
+ }, null, 8, ["name"])
1157
+ ], 8, Ea),
1158
+ $("button", {
1159
+ type: "button",
1160
+ "aria-label": p.fullscreen ? "退出视频全屏" : "视频全屏",
1161
+ disabled: !p.canFullscreen,
1162
+ onClick: v[8] || (v[8] = (T) => n("fullscreen"))
1163
+ }, [
1164
+ Be(it, {
1165
+ name: p.fullscreen ? "exit" : "fullscreen"
1166
+ }, null, 8, ["name"])
1167
+ ], 8, Ra)
1168
+ ], 32));
1169
+ }
1170
+ }), $a = ["data-playback"], Fa = ["muted", "loop", "preload"], Ta = {
1171
+ key: 1,
1172
+ class: "mp-video-loading",
1173
+ role: "status",
1174
+ "aria-label": "视频缓冲中"
1175
+ }, Ba = /* @__PURE__ */ $("span", { class: "mp-spinner" }, null, -1), Da = [
1176
+ Ba
1177
+ ], qa = ["aria-label"], za = {
1178
+ key: 3,
1179
+ class: "mp-resource-state",
1180
+ role: "alert"
1181
+ }, Ia = /* @__PURE__ */ $("span", null, "视频暂时无法播放", -1), Aa = ["inert"], Oa = /* @__PURE__ */ Le({
1182
+ inheritAttrs: !1,
1183
+ __name: "VideoDomRenderer",
1184
+ props: {
1185
+ initialImage: { default: () => ke },
1186
+ rendering: { type: Boolean, default: !0 },
1187
+ quality: { default: "screen" },
1188
+ requestVersion: { default: 0 },
1189
+ priority: { default: 0 },
1190
+ resourcePolicy: { default: () => We },
1191
+ resolveSource: { type: Function, default: Ne },
1192
+ media: {},
1193
+ videoLoader: { type: Function, default: lt },
1194
+ core: {},
1195
+ active: { type: Boolean, default: !0 },
1196
+ enabled: { type: Boolean, default: !0 },
1197
+ autoplay: { type: Boolean, default: !1 },
1198
+ loadEnabled: { type: Boolean, default: !0 },
1199
+ muted: { type: Boolean, default: !1 },
1200
+ loop: { type: Boolean, default: !1 },
1201
+ controls: { type: Boolean, default: !0 },
1202
+ controlsVisible: { type: Boolean, default: !0 },
1203
+ teleportControls: { type: Boolean, default: !1 },
1204
+ controlsTarget: { default: "body" }
1205
+ },
1206
+ emits: ["originalState", "ready", "error"],
1207
+ setup(a, { expose: t, emit: e }) {
1208
+ const n = a, o = e, i = R(!1), s = U(() => ({
1209
+ ...n.media,
1210
+ type: "image",
1211
+ src: n.media.poster || n.media.previewSrc || n.media.thumbnail
1212
+ })), r = R(), f = R(), y = R(!1), m = R(!1), b = Lt(
1213
+ () => r.value,
1214
+ (E) => o("error", E)
1215
+ ), B = Et(
1216
+ () => r.value,
1217
+ () => n.media,
1218
+ () => n.active && n.loadEnabled,
1219
+ () => n.videoLoader,
1220
+ (E) => {
1221
+ b.state.status = "error", b.state.buffering = !1, o("error", E);
1222
+ }
1223
+ );
1224
+ function L() {
1225
+ b.state.status = "loading", b.state.buffering = !0, B();
1226
+ }
1227
+ let P = () => {
1228
+ };
1229
+ const { state: p } = b, v = U(
1230
+ () => n.controls && n.active && n.enabled && n.controlsVisible
1231
+ );
1232
+ function T() {
1233
+ return n.teleportControls ? f.value.closest(".mp-viewer") : n.core.containerRef.value;
1234
+ }
1235
+ async function I() {
1236
+ if (m.value)
1237
+ try {
1238
+ document.fullscreenElement === T() ? await document.exitFullscreen() : document.fullscreenEnabled ? await T().requestFullscreen() : r.value.webkitEnterFullscreen();
1239
+ } catch (E) {
1240
+ o("error", Ae(E));
1241
+ }
1242
+ }
1243
+ function w() {
1244
+ y.value = document.fullscreenElement === T();
1245
+ }
1246
+ function u() {
1247
+ !n.active || !n.enabled ? b.pause() : n.autoplay && b.play();
1248
+ }
1249
+ function k() {
1250
+ document.hidden && b.pause();
1251
+ }
1252
+ ze(() => {
1253
+ p.muted = r.value.muted, m.value = document.fullscreenEnabled || "webkitEnterFullscreen" in r.value, document.addEventListener("fullscreenchange", w), document.addEventListener("visibilitychange", k), P = ee(() => [n.active, n.enabled, n.autoplay], u, {
1254
+ flush: "post"
1255
+ }), u();
1256
+ }), Re(() => {
1257
+ P(), b.dispose(), document.removeEventListener("fullscreenchange", w), document.removeEventListener("visibilitychange", k), document.fullscreenElement === T() && document.exitFullscreen().catch(() => {
1258
+ });
1259
+ });
1260
+ const h = U(() => ({
1261
+ transform: `translate(-50%, -50%) translate3d(${n.core.state.offsetX}px, ${n.core.state.offsetY}px, 0)`
1262
+ })), d = U(() => ({
1263
+ width: `${n.core.mediaSize.value.width * n.core.displayScale.value}px`,
1264
+ height: `${n.core.mediaSize.value.height * n.core.displayScale.value}px`,
1265
+ transform: `rotate(${n.core.state.rotation}deg)`
1266
+ }));
1267
+ function M() {
1268
+ i.value = !0, n.core.setMediaElement(r.value), o("ready", "screen");
1269
+ }
1270
+ function C() {
1271
+ return { image: i.value ? va(r.value, n.core.mediaSize.value) : n.core.mediaRef.value, scale: 1 };
1272
+ }
1273
+ return t({ togglePlayback: b.toggle, toggleFullscreen: I, playback: b, captureFrame: C }), (E, A) => (z(), H("div", {
1274
+ ref_key: "host",
1275
+ ref: f,
1276
+ class: "mp-dom-renderer mp-video-player",
1277
+ "data-playback": g(p).ended ? "ended" : g(p).playing ? "playing" : "paused"
1278
+ }, [
1279
+ i.value ? ie("", !0) : (z(), rt(vt, {
1280
+ key: 0,
1281
+ media: s.value,
1282
+ core: E.core,
1283
+ "initial-image": E.initialImage,
1284
+ rendering: E.rendering,
1285
+ quality: E.quality,
1286
+ "request-version": E.requestVersion,
1287
+ "load-enabled": E.loadEnabled,
1288
+ priority: E.priority,
1289
+ "resource-policy": E.resourcePolicy,
1290
+ "resolve-source": E.resolveSource,
1291
+ onReady: A[0] || (A[0] = (V) => o("ready", V)),
1292
+ onError: A[1] || (A[1] = (V) => o("error", V)),
1293
+ onOriginalState: A[2] || (A[2] = (V, _) => o("originalState", V, _))
1294
+ }, null, 8, ["media", "core", "initial-image", "rendering", "quality", "request-version", "load-enabled", "priority", "resource-policy", "resolve-source"])),
1295
+ $("div", {
1296
+ class: "mp-dom-renderer__frame",
1297
+ style: Se([h.value, { visibility: i.value ? "inherit" : "hidden" }])
1298
+ }, [
1299
+ $("video", Ue({
1300
+ ref_key: "videoRef",
1301
+ ref: r,
1302
+ class: "mp-dom-renderer__node",
1303
+ muted: E.muted,
1304
+ loop: E.loop,
1305
+ playsinline: "",
1306
+ "webkit-playsinline": "true",
1307
+ crossorigin: "anonymous",
1308
+ preload: E.active && E.loadEnabled ? "auto" : "none",
1309
+ style: d.value
1310
+ }, pt(g(b).events, !0), { onPlaying: M }), null, 16, Fa)
1311
+ ], 4),
1312
+ E.active && E.enabled && g(p).buffering && g(p).status !== "error" ? (z(), H("div", Ta, Da)) : ie("", !0),
1313
+ v.value && !g(p).playing && !g(p).buffering && g(p).status !== "error" ? (z(), H("button", {
1314
+ key: 2,
1315
+ type: "button",
1316
+ class: "mp-video-center-play",
1317
+ "data-preview-control": "",
1318
+ "aria-label": g(p).ended ? "重新播放" : "开始播放视频",
1319
+ onPointerdown: A[3] || (A[3] = J(() => {
1320
+ }, ["stop"])),
1321
+ onPointerup: A[4] || (A[4] = J(() => {
1322
+ }, ["stop"])),
1323
+ onClick: A[5] || (A[5] = J(
1324
+ //@ts-ignore
1325
+ (...V) => g(b).toggle && g(b).toggle(...V),
1326
+ ["stop"]
1327
+ ))
1328
+ }, [
1329
+ Be(it, {
1330
+ name: g(p).ended ? "replay" : "play"
1331
+ }, null, 8, ["name"])
1332
+ ], 40, qa)) : ie("", !0),
1333
+ g(p).status === "error" ? (z(), H("div", za, [
1334
+ Ia,
1335
+ $("button", {
1336
+ type: "button",
1337
+ onClick: J(L, ["stop"])
1338
+ }, "重新加载视频")
1339
+ ])) : ie("", !0),
1340
+ E.controls && E.active && E.enabled ? (z(), rt(Ct, {
1341
+ key: 4,
1342
+ to: E.controlsTarget,
1343
+ disabled: !E.teleportControls
1344
+ }, [
1345
+ $("div", {
1346
+ class: qe(["mp-video-control-layer", { "is-hidden": !v.value }]),
1347
+ inert: !v.value
1348
+ }, [
1349
+ Be(La, {
1350
+ playback: g(b),
1351
+ fullscreen: y.value,
1352
+ "can-fullscreen": m.value,
1353
+ onFullscreen: I
1354
+ }, null, 8, ["playback", "fullscreen", "can-fullscreen"])
1355
+ ], 10, Aa)
1356
+ ], 8, ["to", "disabled"])) : ie("", !0)
1357
+ ], 8, $a));
1358
+ }
1359
+ }), _a = ["data-scale", "data-rotation", "data-live-holding"], Va = /* @__PURE__ */ Le({
1360
+ __name: "PreviewStage",
1361
+ props: {
1362
+ media: {},
1363
+ videoLoader: { type: Function, default: lt },
1364
+ livePlaying: { type: Boolean, default: !1 },
1365
+ active: { type: Boolean, default: !0 },
1366
+ requestVersion: { default: 0 },
1367
+ loadEnabled: { type: Boolean, default: !0 },
1368
+ resourcePolicy: { default: () => We },
1369
+ resolveSource: { type: Function, default: Ne },
1370
+ inactiveResetDuration: { default: 0 },
1371
+ disabled: { type: Boolean, default: !1 },
1372
+ externalGestures: { type: Boolean, default: !1 },
1373
+ controlsVisible: { type: Boolean, default: !0 },
1374
+ teleportControls: { type: Boolean, default: !1 },
1375
+ controlsTarget: { default: "body" },
1376
+ rendering: { type: Boolean, default: !0 },
1377
+ paging: { type: Boolean, default: !1 },
1378
+ initialImage: { default: () => ke },
1379
+ quality: { default: "screen" }
1380
+ },
1381
+ emits: ["tap", "doubleTap", "scale", "swipeDownProgress", "close", "previous", "next", "pageDrag", "pageRelease", "ready", "error", "originalState", "liveState", "liveEnded"],
1382
+ setup(a, { expose: t, emit: e }) {
1383
+ const n = a, o = e, i = R(!1), s = R("loading"), r = Gt({
1384
+ motionActive: () => n.paging,
1385
+ interactive: () => n.active && !n.disabled,
1386
+ zoomable: () => !0,
1387
+ doubleTapZoom: () => xt(n.media, r.core.viewportSize.value),
1388
+ zoomLimit: () => Math.max(8, xt(n.media, r.core.viewportSize.value) * 2),
1389
+ holdable: () => n.media.type === "live-photo" && b.value === "ready" && s.value === "idle",
1390
+ onHoldStart: () => {
1391
+ i.value = !0;
1392
+ },
1393
+ onHoldEnd: () => {
1394
+ i.value = !1, o("liveEnded");
1395
+ },
1396
+ onTap: () => o("tap"),
1397
+ onDoubleTap: () => o("doubleTap"),
1398
+ onScale: (w) => {
1399
+ n.active && o("scale", w);
1400
+ },
1401
+ onSwipeDownProgress: (w) => {
1402
+ n.active && o("swipeDownProgress", w);
1403
+ },
1404
+ onSwipeDownClose: () => o("close"),
1405
+ onSwipeLeft: () => o("next"),
1406
+ onSwipeRight: () => o("previous"),
1407
+ onPageDrag: (w) => {
1408
+ n.active && o("pageDrag", w);
1409
+ },
1410
+ onPageRelease: (w, u) => o("pageRelease", w, u)
1411
+ }), f = r.core.containerRef, y = r.core.downDragStyle, m = r.core.state, b = R("loading"), B = R("thumbnail"), L = R(), P = U(
1412
+ () => n.media.type === "video" ? Oa : n.media.type === "live-photo" ? pa : vt
1413
+ ), p = U(
1414
+ () => B.value === "full" || n.quality === "full" ? "full" : n.quality
1415
+ );
1416
+ ee(
1417
+ [
1418
+ () => n.media.id,
1419
+ () => n.media.src,
1420
+ () => n.media.previewSrc,
1421
+ () => n.media.thumbnail
1422
+ ],
1423
+ () => {
1424
+ B.value = "thumbnail";
1425
+ }
1426
+ ), ee(
1427
+ () => n.media.id,
1428
+ () => {
1429
+ b.value = "loading", r.core.setRotation(0);
1430
+ }
1431
+ ), ee(
1432
+ [() => n.media.width, () => n.media.height],
1433
+ ([w, u]) => {
1434
+ r.core.setMediaSize({ width: w, height: u });
1435
+ },
1436
+ { immediate: !0 }
1437
+ ), ee(
1438
+ () => n.active,
1439
+ (w) => {
1440
+ w || r.core.resetTransform(n.inactiveResetDuration);
1441
+ }
1442
+ ), ee(
1443
+ () => n.disabled,
1444
+ (w) => {
1445
+ w && r.core.cancelGesture(!0);
1446
+ }
1447
+ );
1448
+ function v(w) {
1449
+ w === "full" && (B.value = w), b.value = "ready", o("ready", w);
1450
+ }
1451
+ function T(w) {
1452
+ s.value = w, o("liveState", w);
1453
+ }
1454
+ const I = U(
1455
+ () => n.externalGestures ? {} : {
1456
+ wheel: r.onWheel,
1457
+ pointerdown: r.onPointerDown,
1458
+ pointermove: r.onPointerMove,
1459
+ pointerup: r.onPointerUp,
1460
+ pointercancel: r.onPointerCancel,
1461
+ lostpointercapture: r.onPointerCancel
1462
+ }
1463
+ );
1464
+ return t({
1465
+ onPointerDown: r.onPointerDown,
1466
+ onPointerMove: r.onPointerMove,
1467
+ onPointerUp: r.onPointerUp,
1468
+ onPointerCancel: r.onPointerCancel,
1469
+ onWheel: r.onWheel,
1470
+ readiness: b,
1471
+ core: r.core,
1472
+ rotateBy: r.core.rotateBy,
1473
+ resetTransform: r.core.resetTransform,
1474
+ zoomIn: () => r.core.zoomTo(m.level * 1.5, void 0, !0),
1475
+ zoomOut: () => r.core.zoomTo(m.level / 1.5, void 0, !0),
1476
+ togglePlayback: () => L.value.togglePlayback(),
1477
+ toggleFullscreen: () => L.value.toggleFullscreen(),
1478
+ captureFrame: () => n.media.type === "live-photo" || n.media.type === "video" ? L.value.captureFrame() : { image: r.core.mediaRef.value, scale: 1 }
1479
+ }), (w, u) => (z(), H("div", Ue({
1480
+ ref_key: "containerRef",
1481
+ ref: f,
1482
+ class: ["mp-stage", { "is-zoomed": g(m).level > 1, "is-dismissing": g(m).draggingDown }],
1483
+ style: g(y),
1484
+ "data-scale": g(m).level.toFixed(3),
1485
+ "data-rotation": g(m).rotation,
1486
+ "data-live-holding": i.value,
1487
+ onContextmenu: u[3] || (u[3] = (k) => {
1488
+ w.media.type === "live-photo" && k.preventDefault();
1489
+ })
1490
+ }, pt(I.value, !0)), [
1491
+ (z(), rt(At(P.value), Ue({
1492
+ ref_key: "rendererRef",
1493
+ ref: L,
1494
+ media: w.media
1495
+ }, w.media.type === "video" ? { videoLoader: w.videoLoader } : {}, {
1496
+ "initial-image": w.initialImage,
1497
+ rendering: w.rendering,
1498
+ core: g(r).core,
1499
+ quality: p.value,
1500
+ "request-version": w.requestVersion,
1501
+ "load-enabled": w.loadEnabled,
1502
+ priority: w.active ? 0 : 2,
1503
+ "resource-policy": w.resourcePolicy,
1504
+ "resolve-source": w.resolveSource,
1505
+ playing: (w.livePlaying || i.value) && w.active,
1506
+ enabled: !w.disabled,
1507
+ "controls-visible": w.controlsVisible,
1508
+ "teleport-controls": w.teleportControls,
1509
+ "controls-target": w.controlsTarget,
1510
+ active: w.active,
1511
+ onReady: v,
1512
+ onError: u[0] || (u[0] = (k) => o("error", k)),
1513
+ onOriginalState: u[1] || (u[1] = (k, h) => o("originalState", k, h)),
1514
+ onLiveState: T,
1515
+ onLiveEnded: u[2] || (u[2] = (k) => o("liveEnded"))
1516
+ }), null, 16, ["media", "initial-image", "rendering", "core", "quality", "request-version", "load-enabled", "priority", "resource-policy", "resolve-source", "playing", "enabled", "controls-visible", "teleport-controls", "controls-target", "active"]))
1517
+ ], 16, _a));
1518
+ }
1519
+ });
1520
+ function Ya(a, t) {
1521
+ const e = R(/* @__PURE__ */ new Set()), n = R("idle"), o = R(""), i = R(0), s = R("");
1522
+ function r() {
1523
+ s.value = "", n.value = "idle", o.value = "", i.value = 0;
1524
+ }
1525
+ function f() {
1526
+ n.value !== "ready" && (n.value = "loading", o.value = "", i.value++, e.value = /* @__PURE__ */ new Set([...e.value, a().id]));
1527
+ }
1528
+ function y(m, b) {
1529
+ n.value = m, o.value = b, t(a(), m, b);
1530
+ }
1531
+ return {
1532
+ originalIds: e,
1533
+ originalStatus: n,
1534
+ originalReason: o,
1535
+ originalRequest: i,
1536
+ readyId: s,
1537
+ reset: r,
1538
+ requestOriginal: f,
1539
+ updateOriginal: y
1540
+ };
1541
+ }
1542
+ function Ha(a, t, e, n = {}) {
1543
+ const o = R(0), i = mt({
1544
+ offset: 0,
1545
+ dragging: !1,
1546
+ settling: !1,
1547
+ preparing: !1,
1548
+ grabbed: !1,
1549
+ duration: 360
1550
+ }), s = { readOffset: () => i.offset, flushLayout: () => {
1551
+ }, ...n }, r = 16, f = () => t() + r, y = U(
1552
+ () => [o.value - 1, o.value, o.value + 1].filter((d) => d >= 0 && d < a())
1553
+ );
1554
+ let m = setTimeout(() => {
1555
+ }, 0), b = () => {
1556
+ }, B = 0, L = 0;
1557
+ function P() {
1558
+ B += 1, clearTimeout(m), b(), i.settling = !1, i.preparing = !1;
1559
+ }
1560
+ Re(P);
1561
+ function p() {
1562
+ if (!i.settling && !i.preparing) return;
1563
+ const d = i.preparing ? i.offset : s.readOffset();
1564
+ P(), i.offset = d, i.grabbed = !0;
1565
+ }
1566
+ function v(d) {
1567
+ if (d === 0) {
1568
+ P(), i.dragging = !1, i.grabbed = !1, i.offset = 0, L = 0;
1569
+ return;
1570
+ }
1571
+ i.dragging || (p(), L = i.offset, P(), i.dragging = !0, i.grabbed = !0);
1572
+ const M = L + d, C = o.value === 0 && M > 0 || o.value === a() - 1 && M < 0;
1573
+ i.offset = C ? Math.sign(M) * Math.sqrt(Math.abs(M)) * 6 : M;
1574
+ }
1575
+ async function T(d, M = 0) {
1576
+ P();
1577
+ const C = B, E = o.value;
1578
+ i.offset += (d - E) * f();
1579
+ const A = Math.abs(i.offset), V = de(A / f(), 0, 1), _ = de(220 + V * 140 - Math.min(Math.abs(M), 2) * 35, 240, 360);
1580
+ i.duration = matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : _, o.value = d, i.dragging = !1, i.grabbed = !1, i.preparing = !0, d !== E && e(d), await ye(), C === B && (s.flushLayout(), i.preparing = !1, i.settling = !0, i.offset = 0, await new Promise((N) => {
1581
+ b = N, m = setTimeout(N, i.duration);
1582
+ }), C === B && (i.settling = !1, b = () => {
1583
+ }));
1584
+ }
1585
+ function I(d, M) {
1586
+ const C = i.offset, E = Math.abs(M) > 0.35 && Math.abs(d) > 16, A = Math.sign(E ? M : C), V = E || Math.abs(C) > t() * 0.14;
1587
+ T(de(o.value - (V ? A : 0), 0, a() - 1), M);
1588
+ }
1589
+ function w() {
1590
+ i.grabbed && !i.dragging && T(o.value);
1591
+ }
1592
+ function u(d) {
1593
+ if (i.dragging) return;
1594
+ p();
1595
+ const M = de(o.value + d, 0, a() - 1);
1596
+ M !== o.value ? T(M) : w();
1597
+ }
1598
+ function k(d) {
1599
+ P(), o.value = d, i.offset = 0, i.dragging = !1, i.grabbed = !1;
1600
+ }
1601
+ function h(d) {
1602
+ o.value = d;
1603
+ }
1604
+ return { index: o, state: i, slots: y, stride: f, drag: v, release: I, go: u, grab: p, resume: w, reset: k, rebase: h, cancel: P };
1605
+ }
1606
+ function $t(a, t, e) {
1607
+ const n = Math[e === "cover" ? "max" : "min"](
1608
+ t.width / a.width,
1609
+ t.height / a.height
1610
+ );
1611
+ return {
1612
+ x: t.left + t.width / 2,
1613
+ y: t.top + t.height / 2,
1614
+ width: a.width * n,
1615
+ height: a.height * n,
1616
+ rotation: 0,
1617
+ clip: { left: t.left, top: t.top, width: t.width, height: t.height },
1618
+ radius: 0
1619
+ };
1620
+ }
1621
+ function Xa(a, t, e) {
1622
+ const n = (o, i) => o + (i - o) * e;
1623
+ return {
1624
+ x: n(a.x, t.x),
1625
+ y: n(a.y, t.y),
1626
+ width: n(a.width, t.width),
1627
+ height: n(a.height, t.height),
1628
+ rotation: n(a.rotation, t.rotation),
1629
+ radius: n(a.radius, t.radius),
1630
+ clip: {
1631
+ left: n(a.clip.left, t.clip.left),
1632
+ top: n(a.clip.top, t.clip.top),
1633
+ width: n(a.clip.width, t.clip.width),
1634
+ height: n(a.clip.height, t.clip.height)
1635
+ }
1636
+ };
1637
+ }
1638
+ function Mt(a) {
1639
+ const t = a.rotation * Math.PI / 180, e = Math.abs(Math.cos(t)) * a.width + Math.abs(Math.sin(t)) * a.height, n = Math.abs(Math.sin(t)) * a.width + Math.abs(Math.cos(t)) * a.height, o = Math.max(a.x - e / 2, a.clip.left), i = Math.max(a.y - n / 2, a.clip.top);
1640
+ return {
1641
+ left: o,
1642
+ top: i,
1643
+ width: Math.max(0, Math.min(a.x + e / 2, a.clip.left + a.clip.width) - o),
1644
+ height: Math.max(0, Math.min(a.y + n / 2, a.clip.top + a.clip.height) - i)
1645
+ };
1646
+ }
1647
+ function Ua(a, t, e, n, o) {
1648
+ const i = Mt(a), s = Mt(t), r = Math.min(i.width / s.width, i.height / s.height), f = {
1649
+ width: Math.max(i.width, s.width, 1),
1650
+ height: Math.max(i.height, s.height, 1)
1651
+ }, y = 128, m = [], b = [];
1652
+ for (let B = 0; B <= y; B += 1) {
1653
+ const L = B / y, P = Xa(a, t, L);
1654
+ let p;
1655
+ if (o)
1656
+ p = {
1657
+ left: i.left + (s.left - i.left) * L,
1658
+ top: i.top + (s.top - i.top) * L,
1659
+ width: i.width + (s.width - i.width) * L,
1660
+ height: i.height + (s.height - i.height) * L
1661
+ };
1662
+ else {
1663
+ const I = Math.min(L / 0.78, 1), w = 1 - I * I * I * (I * (I * 6 - 15) + 10), u = r + (1 - r) * L, k = s.width * u + (i.width - s.width * r) * w, h = s.height * u + (i.height - s.height * r) * w;
1664
+ p = {
1665
+ left: i.left + i.width / 2 + (s.left + s.width / 2 - i.left - i.width / 2) * L - k / 2,
1666
+ top: i.top + i.height / 2 + (s.top + s.height / 2 - i.top - i.height / 2) * L - h / 2,
1667
+ width: k,
1668
+ height: h
1669
+ };
1670
+ }
1671
+ const v = Math.max(p.width, 1e-3) / f.width, T = Math.max(p.height, 1e-3) / f.height;
1672
+ m.push({
1673
+ transform: `scale(${1 / v},${1 / T}) translate3d(${P.x - p.left}px,${P.y - p.top}px,0) rotate(${P.rotation}deg) scale(${P.width / n.width}) translate3d(${-n.width / 2}px,${-n.height / 2}px,0)`,
1674
+ offset: L
1675
+ }), b.push({
1676
+ transform: `translate3d(${p.left - e.left}px,${p.top - e.top}px,0) scale(${v},${T})`,
1677
+ ...a.radius === 0 && t.radius === 0 ? {} : { borderRadius: `${P.radius / v}px / ${P.radius / T}px` },
1678
+ offset: L
1679
+ });
1680
+ }
1681
+ return { pictures: m, masks: b, maskSize: f };
1682
+ }
1683
+ function Wa() {
1684
+ let a = { kind: "idle" };
1685
+ function t() {
1686
+ a.kind === "playing" && a.animations.forEach((o) => o.cancel()), a = { kind: "idle" };
1687
+ }
1688
+ function e() {
1689
+ return a.kind !== "playing" || !a.entering ? { kind: "inactive" } : (a.entering = !1, a.animations.forEach((o) => o.reverse()), a.finished = Promise.all(a.animations.map((o) => o.finished)).then(() => {
1690
+ }).catch(() => {
1691
+ }), { kind: "reversing", finished: a.finished });
1692
+ }
1693
+ async function n(o, i, s, r, f, y, m, b, B = b ? 0 : 1, L = 340) {
1694
+ t();
1695
+ const P = Math.max(r.width, f.width), p = P * f.height / f.width, v = Math.min(
1696
+ devicePixelRatio,
1697
+ 2,
1698
+ Math.sqrt(ue.maxCanvasPixels / (P * p))
1699
+ );
1700
+ o.width = Math.max(1, Math.round(P * v)), o.height = Math.max(1, Math.round(p * v)), o.style.width = `${P}px`, o.style.height = `${p}px`;
1701
+ const T = o.getContext("2d");
1702
+ ((M) => {
1703
+ T.clearRect(0, 0, o.width, o.height), T.imageSmoothingEnabled = !0, T.imageSmoothingQuality = "high", T.drawImage(M, 0, 0, o.width, o.height);
1704
+ })(s);
1705
+ const w = Ua(r, f, y, { width: P, height: p }, b);
1706
+ i.style.width = `${w.maskSize.width}px`, i.style.height = `${w.maskSize.height}px`, i.style.borderRadius = "0";
1707
+ const k = {
1708
+ duration: matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : Math.max(0, L),
1709
+ easing: "cubic-bezier(.2,.78,.2,1)",
1710
+ fill: "both"
1711
+ }, h = [
1712
+ o.animate(w.pictures, k),
1713
+ i.animate(w.masks, k),
1714
+ m.animate([{ opacity: B }, { opacity: b ? 1 : 0 }], k)
1715
+ ], d = Promise.all(h.map((M) => M.finished)).then(() => {
1716
+ }).catch(() => {
1717
+ });
1718
+ a = { kind: "playing", entering: b, animations: h, finished: d }, await d;
1719
+ }
1720
+ return { play: n, cancel: t, reverseOpening: e };
1721
+ }
1722
+ function Ft(a, t) {
1723
+ const e = Math.max(a.left, t.left), n = Math.max(a.top, t.top);
1724
+ return {
1725
+ left: e,
1726
+ top: n,
1727
+ width: Math.max(0, Math.min(a.left + a.width, t.left + t.width) - e),
1728
+ height: Math.max(0, Math.min(a.top + a.height, t.top + t.height) - n)
1729
+ };
1730
+ }
1731
+ function Na(a, t) {
1732
+ let e = { ...t };
1733
+ const n = /^(auto|scroll|overlay)$/;
1734
+ for (let o = a.parentElement; o !== document.documentElement; o = o.parentElement) {
1735
+ const i = getComputedStyle(o), s = n.test(i.overflowX), r = n.test(i.overflowY);
1736
+ if (!s && !r) continue;
1737
+ const f = o.getBoundingClientRect(), y = Number(o.style.getPropertyValue("--mp-transition-inset-top"));
1738
+ e = Ft(e, {
1739
+ left: s ? f.left : e.left,
1740
+ top: r ? f.top + y : e.top,
1741
+ width: s ? f.width : e.width,
1742
+ height: r ? Math.max(0, f.height - y) : e.height
1743
+ });
1744
+ }
1745
+ return e;
1746
+ }
1747
+ function St(a, t, e) {
1748
+ if (a.kind === "unavailable") return a;
1749
+ const n = $t(t, a.element.getBoundingClientRect(), "cover");
1750
+ return n.clip = Ft(n.clip, Na(a.element, e)), n.clip.width <= 0 || n.clip.height <= 0 ? { kind: "unavailable" } : (n.radius = parseFloat(getComputedStyle(a.element).borderTopLeftRadius) || 0, { kind: "element", element: a.element, frame: n, viewport: e });
1751
+ }
1752
+ const Za = ["aria-label", "data-phase", "data-chrome", "inert"], ja = ["aria-hidden", "inert", "data-media-id"], Ka = {
1753
+ key: 0,
1754
+ class: "mp-resource-state mp-viewer__loading mp-viewer__pages",
1755
+ role: "status",
1756
+ "aria-label": "加载中"
1757
+ }, Ga = /* @__PURE__ */ $("span", {
1758
+ class: "mp-spinner",
1759
+ "aria-hidden": "true"
1760
+ }, null, -1), Qa = [
1761
+ Ga
1762
+ ], Ja = ["inert"], en = { class: "mp-viewer__toolbar" }, tn = { class: "mp-viewer__title" }, an = ["disabled"], nn = { class: "mp-viewer__footer" }, on = {
1763
+ class: "mp-viewer__counter",
1764
+ "aria-live": "polite"
1765
+ }, rn = {
1766
+ key: 1,
1767
+ class: "mp-viewer__detail"
1768
+ }, gn = /* @__PURE__ */ Le({
1769
+ inheritAttrs: !1,
1770
+ __name: "MediaPreview",
1771
+ props: {
1772
+ items: {},
1773
+ mobile: { type: Boolean, default: !1 },
1774
+ teleportDisabled: { type: Boolean, default: !1 },
1775
+ keyboardEnabled: { type: Boolean, default: !0 },
1776
+ gesturesEnabled: { type: Boolean, default: !0 },
1777
+ persistentChrome: { type: Boolean, default: !1 },
1778
+ videoLoader: { type: Function, default: lt },
1779
+ resourcePolicy: { default: () => We },
1780
+ resolveImageSource: { type: Function, default: Ne },
1781
+ hasMore: { type: Boolean, default: !1 },
1782
+ appearance: { default: "dark" },
1783
+ closeDuration: { default: 240 },
1784
+ transitionDuration: { default: 340 },
1785
+ resolveAnchor: { type: Function, default: () => ({ kind: "unavailable" }) }
1786
+ },
1787
+ emits: ["open", "opened", "ready", "closing", "close", "change", "error", "originalState", "loadMore", "phaseChange", "chromeChange"],
1788
+ setup(a, { expose: t, emit: e }) {
1789
+ const n = Ot(), o = a, i = e, s = R("closed");
1790
+ ee(s, (l) => i("phaseChange", l), { flush: "sync" });
1791
+ const r = `mp-video-controls-${_t().uid}`, f = R(), y = R(), m = Ya(
1792
+ () => W.value,
1793
+ (l, x, S) => i("originalState", l, x, S)
1794
+ ), { originalIds: b, originalStatus: B, originalReason: L, originalRequest: P, readyId: p } = m;
1795
+ let v = "", T = -1;
1796
+ const I = R(), w = R(), u = R(), k = R(!1), h = R(0), d = R(!0);
1797
+ ee(d, (l) => i("chromeChange", l), { flush: "sync" });
1798
+ const M = R(!1), C = R("loading"), E = R(1), A = R(!1), V = R(1), _ = R(!1), N = R(!1), Y = gt(ke);
1799
+ let Pe = "", se = { kind: "unavailable" };
1800
+ const fe = /* @__PURE__ */ new Map(), K = /* @__PURE__ */ new Map();
1801
+ function Ze(l) {
1802
+ return (x) => {
1803
+ K.set(l, x);
1804
+ };
1805
+ }
1806
+ function Oe(l) {
1807
+ return (x) => {
1808
+ fe.set(l, x);
1809
+ };
1810
+ }
1811
+ const D = Ha(
1812
+ () => o.items.length,
1813
+ () => V.value,
1814
+ (l) => {
1815
+ v = o.items[l].id, m.reset(), E.value = 1, M.value = !1, C.value = "loading", i("change", l), Fe(l);
1816
+ },
1817
+ {
1818
+ readOffset: () => new DOMMatrixReadOnly(getComputedStyle(K.get(v)).transform).m41,
1819
+ flushLayout: () => {
1820
+ K.get(v).getBoundingClientRect();
1821
+ }
1822
+ }
1823
+ ), q = D.index, W = U(() => o.items[q.value]), Ce = D.slots, je = U(
1824
+ () => s.value === "opening" || k.value ? [q.value] : Ce.value
1825
+ );
1826
+ ee(Ce, () => {
1827
+ ye(() => {
1828
+ const l = new Set(Ce.value.map((x) => o.items[x].id));
1829
+ for (const x of fe.keys()) l.has(x) || fe.delete(x);
1830
+ for (const x of K.keys()) l.has(x) || K.delete(x);
1831
+ });
1832
+ });
1833
+ const te = {
1834
+ close: F,
1835
+ setChromeVisible: (l) => {
1836
+ d.value = l;
1837
+ },
1838
+ goTo: ut,
1839
+ previous: () => D.go(-1),
1840
+ next: () => D.go(1),
1841
+ rotate: (l = 90) => j().rotateBy(l),
1842
+ reset: () => j().resetTransform(),
1843
+ zoomIn: () => j().zoomIn(),
1844
+ zoomOut: () => j().zoomOut(),
1845
+ original: m.requestOriginal,
1846
+ fullscreen: ae,
1847
+ togglePlayback: () => j().togglePlayback(),
1848
+ toggleLive: () => {
1849
+ s.value !== "open" || C.value === "loading" || C.value === "error" || (M.value = !M.value);
1850
+ },
1851
+ toggleDetail: () => {
1852
+ A.value = !A.value;
1853
+ }
1854
+ }, ge = Wa();
1855
+ let $e = Promise.resolve(), G = 0, pe = "", Q = !1, ve = "", me = "", xe = () => {
1856
+ }, ne = { kind: "idle" }, he = 0;
1857
+ const Ee = () => new Promise((l) => requestAnimationFrame(() => l())), Me = new ResizeObserver(() => {
1858
+ const l = `${y.value.clientWidth}:${y.value.clientHeight}`, x = `${f.value.clientWidth}:${f.value.clientHeight}`, S = ve !== "" && ve !== l, O = me !== "" && me !== x;
1859
+ ve = l, me = x, V.value = y.value.clientWidth, S && s.value === "open" && D.reset(q.value), O && ge.cancel();
1860
+ });
1861
+ function Fe(l) {
1862
+ o.hasMore && l >= o.items.length - 3 && T !== o.items.length && (T = o.items.length, i("loadMore", l));
1863
+ }
1864
+ function Te(l, x) {
1865
+ l === q.value && (N.value && (p.value = W.value.id), i("ready", l, x));
1866
+ }
1867
+ function st(l, x, S) {
1868
+ l === q.value && m.updateOriginal(x, S);
1869
+ }
1870
+ ee(
1871
+ () => o.items.map((l) => l.id),
1872
+ (l) => {
1873
+ if (s.value === "closed") return;
1874
+ if (l.length === 0) {
1875
+ G++, ge.cancel(), D.cancel(), he++, ne.kind === "active" && ne.animation.cancel(), Me.disconnect(), ve = "", me = "", xe(), i("closing"), s.value = "closed", Y.value = ke, fe.clear(), K.clear(), document.body.style.overflow = pe, i("close");
1876
+ return;
1877
+ }
1878
+ const x = l.indexOf(v), S = x >= 0 ? x : Math.min(q.value, l.length - 1);
1879
+ (S !== q.value || x < 0) && (x >= 0 ? D.rebase(S) : (D.reset(S), v = l[S], m.reset(), E.value = 1, M.value = !1, i("change", S))), Fe(S);
1880
+ },
1881
+ { flush: "sync" }
1882
+ );
1883
+ function ut(l) {
1884
+ if (!Number.isInteger(l) || l < 0 || l >= o.items.length)
1885
+ throw new RangeError("无效的预览下标");
1886
+ if (!(s.value !== "open" || l === q.value)) {
1887
+ if (Math.abs(l - q.value) === 1) {
1888
+ D.go(l - q.value);
1889
+ return;
1890
+ }
1891
+ D.reset(l), v = o.items[l].id, m.reset(), E.value = 1, M.value = !1, C.value = "loading", i("change", l), Fe(l);
1892
+ }
1893
+ }
1894
+ function ct() {
1895
+ o.persistentChrome || (d.value = !d.value);
1896
+ }
1897
+ function j() {
1898
+ return fe.get(v);
1899
+ }
1900
+ function Ke(l) {
1901
+ xe();
1902
+ const x = l.element.classList.contains("mp-transition-source");
1903
+ l.element.classList.add("mp-transition-source"), xe = () => {
1904
+ l.element.classList.toggle("mp-transition-source", x);
1905
+ };
1906
+ }
1907
+ function Ge() {
1908
+ const l = f.value.getBoundingClientRect();
1909
+ return { left: l.left, top: l.top, width: l.width, height: l.height };
1910
+ }
1911
+ function _e() {
1912
+ return y.value.getBoundingClientRect();
1913
+ }
1914
+ function Ve(l = 1) {
1915
+ const x = _e(), S = j().core, O = S.state, ce = O.downScale;
1916
+ return {
1917
+ x: x.left + x.width / 2 + D.state.offset + O.offsetX * ce * l + O.downOffsetX,
1918
+ y: x.top + x.height / 2 + O.offsetY * ce * l + O.downOffsetY,
1919
+ width: S.mediaSize.value.width * S.displayScale.value * ce * l,
1920
+ height: S.mediaSize.value.height * S.displayScale.value * ce * l,
1921
+ rotation: O.rotation,
1922
+ clip: x,
1923
+ radius: 0
1924
+ };
1925
+ }
1926
+ async function c(l = 0) {
1927
+ if (!Number.isInteger(l) || l < 0 || l >= o.items.length)
1928
+ throw new RangeError("无效的预览下标");
1929
+ if (s.value === "closing" && await $e, s.value !== "closed" || Q) return;
1930
+ const x = ++G;
1931
+ if (pe = document.body.style.overflow, document.body.style.overflow = "hidden", D.reset(l), v = o.items[l].id, m.reset(), E.value = 1, d.value = !0, M.value = !1, C.value = "loading", A.value = !1, h.value = 0, N.value = !1, s.value = "opening", Y.value = ke, _.value = !1, Pe = W.value.id, se = { kind: "unavailable" }, k.value = !1, i("open", l), await ye(), !(x !== G || Q)) {
1932
+ V.value = y.value.clientWidth, Me.observe(f.value), Me.observe(y.value);
1933
+ try {
1934
+ const S = await o.resolveAnchor(W.value);
1935
+ if (x !== G) return;
1936
+ const O = St(S, W.value, Ge());
1937
+ se = O, Y.value = ta(O), _.value = Y.value.kind === "image" || j().readiness === "ready";
1938
+ const ce = _e();
1939
+ if (O.kind === "element") {
1940
+ const He = j().readiness === "ready" ? j().core.mediaRef.value : Y.value.kind === "image" ? Y.value.image : kt();
1941
+ if (k.value = !0, await ye(), x !== G || Q) return;
1942
+ Ke(O), await ge.play(
1943
+ I.value,
1944
+ w.value,
1945
+ He,
1946
+ O.frame,
1947
+ $t(W.value, ce, "contain"),
1948
+ O.viewport,
1949
+ u.value,
1950
+ !0,
1951
+ 0,
1952
+ o.transitionDuration
1953
+ );
1954
+ } else
1955
+ h.value = 1, k.value = !1, await Z(!0);
1956
+ } catch (S) {
1957
+ if (x !== G) return;
1958
+ i("error", Ae(S), W.value);
1959
+ }
1960
+ x !== G || Q || (h.value = 1, s.value = "open", await ye(), !(x !== G || Q) && (j().core.renderNow(), await Ee(), !(x !== G || Q) && (k.value = !1, ge.cancel(), xe(), i("opened", l), await Ee(), !(x !== G || Q || s.value !== "open") && (N.value = !0, Fe(l)))));
1961
+ }
1962
+ }
1963
+ function F() {
1964
+ return s.value === "closed" || s.value === "closing" || ($e = X()), $e;
1965
+ }
1966
+ async function X() {
1967
+ D.grab();
1968
+ const l = h.value, x = s.value === "opening", S = !x && j().readiness === "ready" ? j().captureFrame() : {
1969
+ image: Y.value.kind === "image" && W.value.id === Pe ? Y.value.image : kt(),
1970
+ scale: 1
1971
+ };
1972
+ let O = x ? { kind: "opening" } : { kind: "captured", frame: Ve(S.scale) };
1973
+ x || j().core.cancelGesture(!0);
1974
+ const ce = ++G, He = x ? ge.reverseOpening() : { kind: "inactive" };
1975
+ He.kind === "inactive" && ge.cancel(), D.cancel(), M.value = !1, s.value = "closing", i("closing");
1976
+ try {
1977
+ if (await ye(), ce !== G || Q || (document.fullscreenElement === f.value && (await document.exitFullscreen(), await Ee(), await Ee(), O.kind === "captured" && (O.frame = Ve(S.scale))), ce !== G || Q)) return;
1978
+ const dt = x ? se : await o.resolveAnchor(W.value);
1979
+ if (ce !== G || Q) return;
1980
+ const et = x ? se : St(dt, W.value, Ge());
1981
+ if (He.kind === "reversing")
1982
+ await He.finished;
1983
+ else if (O.kind === "captured" && et.kind === "element") {
1984
+ const Dt = S.image;
1985
+ Ke(et), k.value = !0, await ye(), await ge.play(
1986
+ I.value,
1987
+ w.value,
1988
+ Dt,
1989
+ O.frame,
1990
+ et.frame,
1991
+ et.viewport,
1992
+ u.value,
1993
+ !1,
1994
+ l,
1995
+ o.closeDuration
1996
+ );
1997
+ } else
1998
+ k.value = !1, await Z(!1);
1999
+ } catch (dt) {
2000
+ i("error", Ae(dt), W.value), await Z(!1);
2001
+ }
2002
+ ce !== G || Q || (Me.disconnect(), ve = "", me = "", h.value = 0, s.value = "closed", Y.value = ke, fe.clear(), K.clear(), xe(), document.body.style.overflow = pe, i("close"), await ye(), ge.cancel());
2003
+ }
2004
+ async function Z(l) {
2005
+ const x = ++he, S = l ? 0 : Number(getComputedStyle(f.value).opacity);
2006
+ ne.kind === "active" && ne.animation.cancel(), f.value.style.opacity = String(S);
2007
+ const O = f.value.animate([{ opacity: S }, { opacity: l ? 1 : 0 }], {
2008
+ duration: matchMedia("(prefers-reduced-motion: reduce)").matches ? 0 : 180,
2009
+ fill: "forwards"
2010
+ });
2011
+ ne = { kind: "active", animation: O }, await O.finished.catch(() => {
2012
+ }), !(x !== he || Q) && (f.value.style.opacity = l ? "1" : "0", O.cancel(), ne = { kind: "idle" });
2013
+ }
2014
+ async function ae() {
2015
+ if (document.fullscreenEnabled)
2016
+ try {
2017
+ document.fullscreenElement === f.value ? await document.exitFullscreen() : await f.value.requestFullscreen();
2018
+ } catch (l) {
2019
+ i("error", Ae(l), W.value);
2020
+ }
2021
+ }
2022
+ function oe(l) {
2023
+ s.value !== "open" || !o.gesturesEnabled || j().onPointerDown(l, _e()) && D.grab();
2024
+ }
2025
+ function we(l) {
2026
+ s.value === "open" && (j().onPointerUp(l), s.value === "open" && D.resume());
2027
+ }
2028
+ function re(l) {
2029
+ s.value === "open" && (j().onPointerCancel(l), s.value === "open" && D.resume());
2030
+ }
2031
+ function be(l) {
2032
+ s.value === "open" && j().onPointerMove(l);
2033
+ }
2034
+ function Qe(l) {
2035
+ s.value === "open" && o.gesturesEnabled && j().onWheel(l);
2036
+ }
2037
+ function Ye(l) {
2038
+ s.value === "open" && (h.value = 1 - l);
2039
+ }
2040
+ function Je(l) {
2041
+ s.value === "open" && D.drag(l);
2042
+ }
2043
+ function Tt(l, x) {
2044
+ s.value === "open" && (M.value = !1, D.release(l, x));
2045
+ }
2046
+ function Bt(l) {
2047
+ E.value = l, l > 1.02 && !o.persistentChrome && (d.value = !1);
2048
+ }
2049
+ function ht(l) {
2050
+ if (!(s.value === "closed" || !o.keyboardEnabled) && !(l.key === "Escape" && document.fullscreenElement === f.value)) {
2051
+ if (l.key === "Escape") {
2052
+ l.preventDefault(), F();
2053
+ return;
2054
+ }
2055
+ if (!(s.value !== "open" || l.target.matches("input, textarea, select, button, [role='slider']"))) {
2056
+ if (W.value.type === "video") {
2057
+ if (l.code === "Space") {
2058
+ l.preventDefault(), j().togglePlayback();
2059
+ return;
2060
+ }
2061
+ if (l.key === "Enter") {
2062
+ l.preventDefault(), j().toggleFullscreen();
2063
+ return;
2064
+ }
2065
+ }
2066
+ if (W.value.type === "live-photo" && l.code === "Space") {
2067
+ l.preventDefault(), te.toggleLive();
2068
+ return;
2069
+ }
2070
+ l.key === "ArrowLeft" && (l.preventDefault(), D.go(-1)), l.key === "ArrowRight" && (l.preventDefault(), D.go(1)), (l.key === "+" || l.key === "=") && te.zoomIn(), l.key === "-" && te.zoomOut(), l.key === "0" && te.reset();
2071
+ }
2072
+ }
2073
+ }
2074
+ return ze(() => {
2075
+ document.addEventListener("keydown", ht);
2076
+ }), Re(() => {
2077
+ Q = !0, G += 1, ge.cancel(), he += 1, ne.kind === "active" && ne.animation.cancel(), xe(), Me.disconnect(), document.removeEventListener("keydown", ht), s.value !== "closed" && (document.body.style.overflow = pe);
2078
+ }), t({
2079
+ open: c,
2080
+ ...te,
2081
+ currentIndex: q,
2082
+ phase: s,
2083
+ element: f,
2084
+ mediaElement: () => j().core.mediaRef.value,
2085
+ canvasElement: () => j().core.canvasRef.value
2086
+ }), (l, x) => (z(), rt(Ct, {
2087
+ to: "body",
2088
+ disabled: l.teleportDisabled
2089
+ }, [
2090
+ s.value !== "closed" ? (z(), H("div", Ue({
2091
+ key: 0,
2092
+ ref_key: "root",
2093
+ ref: f
2094
+ }, g(n), {
2095
+ class: ["mp-viewer", { "is-mobile": l.mobile, "is-album": l.appearance === "album" }],
2096
+ role: "dialog",
2097
+ "aria-modal": "true",
2098
+ "aria-label": W.value.title,
2099
+ "data-phase": s.value,
2100
+ "data-chrome": d.value ? "visible" : "hidden",
2101
+ inert: s.value === "closing",
2102
+ onPointerdown: oe,
2103
+ onPointermove: be,
2104
+ onPointerup: we,
2105
+ onPointercancel: re,
2106
+ onLostpointercapture: re,
2107
+ onWheel: Qe
2108
+ }), [
2109
+ $("div", {
2110
+ ref_key: "backdrop",
2111
+ ref: u,
2112
+ class: "mp-viewer__backdrop",
2113
+ style: Se({ opacity: h.value })
2114
+ }, null, 4),
2115
+ $("div", {
2116
+ id: r,
2117
+ class: "mp-viewer__video-controls"
2118
+ }),
2119
+ $("div", {
2120
+ ref_key: "mediaViewport",
2121
+ ref: y,
2122
+ class: qe(["mp-viewer__pages", { "is-transitioning": k.value }])
2123
+ }, [
2124
+ (z(!0), H(De, null, ot(je.value, (S) => (z(), H("div", {
2125
+ key: l.items[S].id,
2126
+ ref_for: !0,
2127
+ ref: Ze(l.items[S].id),
2128
+ class: "mp-viewer__page",
2129
+ style: Se({
2130
+ transform: `translate3d(${(S - g(q)) * g(D).stride() + g(D).state.offset}px,0,0)`,
2131
+ transition: g(D).state.settling ? `transform ${g(D).state.duration}ms cubic-bezier(.22,.61,.36,1)` : "none"
2132
+ }),
2133
+ "aria-hidden": S !== g(q),
2134
+ inert: S !== g(q),
2135
+ "data-media-id": l.items[S].id
2136
+ }, [
2137
+ Be(Va, {
2138
+ ref_for: !0,
2139
+ ref: Oe(l.items[S].id),
2140
+ media: l.items[S],
2141
+ "video-loader": l.videoLoader,
2142
+ rendering: s.value === "open",
2143
+ paging: g(D).state.dragging || g(D).state.preparing || g(D).state.settling || g(D).state.grabbed,
2144
+ "external-gestures": "",
2145
+ active: S === g(q),
2146
+ disabled: s.value !== "open" || !l.gesturesEnabled,
2147
+ "inactive-reset-duration": g(D).state.duration,
2148
+ "resource-policy": l.resourcePolicy,
2149
+ "resolve-source": l.resolveImageSource,
2150
+ "request-version": S === g(q) ? g(P) : 0,
2151
+ "load-enabled": S === g(q) ? N.value && s.value === "open" : s.value === "open" && !k.value && g(p) === W.value.id,
2152
+ "teleport-controls": "",
2153
+ "controls-target": `#${r}`,
2154
+ "controls-visible": d.value && h.value === 1,
2155
+ "initial-image": l.items[S].id === g(Pe) ? Y.value : g(ke),
2156
+ quality: S === g(q) && g(b).has(l.items[S].id) ? "full" : S === g(q) ? "screen" : "thumbnail",
2157
+ "live-playing": M.value,
2158
+ onTap: ct,
2159
+ onScale: Bt,
2160
+ onPageDrag: Je,
2161
+ onPageRelease: Tt,
2162
+ onClose: F,
2163
+ onSwipeDownProgress: Ye,
2164
+ onLiveState: (O) => {
2165
+ S === g(q) && (C.value = O);
2166
+ },
2167
+ onLiveEnded: () => {
2168
+ S === g(q) && (M.value = !1);
2169
+ },
2170
+ onReady: (O) => Te(S, O),
2171
+ onOriginalState: (O, ce) => st(S, O, ce),
2172
+ onError: (O) => i("error", O, l.items[S])
2173
+ }, null, 8, ["media", "video-loader", "rendering", "paging", "active", "disabled", "inactive-reset-duration", "resource-policy", "resolve-source", "request-version", "load-enabled", "controls-target", "controls-visible", "initial-image", "quality", "live-playing", "onLiveState", "onLiveEnded", "onReady", "onOriginalState", "onError"])
2174
+ ], 12, ja))), 128))
2175
+ ], 2),
2176
+ Vt($("div", {
2177
+ ref_key: "transitionMask",
2178
+ ref: w,
2179
+ class: "mp-shared-clip",
2180
+ "aria-hidden": "true"
2181
+ }, [
2182
+ $("canvas", {
2183
+ ref_key: "transitionCanvas",
2184
+ ref: I,
2185
+ class: "mp-shared-transition"
2186
+ }, null, 512)
2187
+ ], 512), [
2188
+ [Yt, k.value]
2189
+ ]),
2190
+ s.value === "opening" && !_.value ? (z(), H("div", Ka, Qa)) : ie("", !0),
2191
+ $("div", {
2192
+ class: qe(["mp-viewer__chrome", { "is-hidden": !d.value || s.value !== "open" || h.value < 1 }]),
2193
+ inert: !d.value || s.value !== "open" || h.value < 1
2194
+ }, [
2195
+ ft(l.$slots, "toolbar", {
2196
+ media: W.value,
2197
+ index: g(q),
2198
+ total: l.items.length,
2199
+ scale: E.value,
2200
+ controls: te,
2201
+ originalStatus: g(B),
2202
+ originalReason: g(L),
2203
+ livePlaying: M.value,
2204
+ liveStatus: C.value
2205
+ }, () => [
2206
+ $("header", en, [
2207
+ $("button", {
2208
+ type: "button",
2209
+ "aria-label": "关闭预览",
2210
+ onClick: F
2211
+ }, "‹"),
2212
+ $("div", tn, [
2213
+ $("strong", null, le(W.value.title), 1),
2214
+ $("span", null, le(g(q) + 1) + " / " + le(l.items.length), 1)
2215
+ ]),
2216
+ $("button", {
2217
+ type: "button",
2218
+ "aria-label": "旋转图片",
2219
+ disabled: W.value.type === "video",
2220
+ onClick: x[0] || (x[0] = (S) => te.rotate())
2221
+ }, " ↻ ", 8, an)
2222
+ ]),
2223
+ $("footer", nn, [
2224
+ W.value.type !== "video" ? (z(), H(De, { key: 0 }, [
2225
+ $("button", {
2226
+ type: "button",
2227
+ "aria-label": "缩小",
2228
+ onClick: x[1] || (x[1] = //@ts-ignore
2229
+ (...S) => te.zoomOut && te.zoomOut(...S))
2230
+ }, "−"),
2231
+ $("button", {
2232
+ type: "button",
2233
+ "aria-label": "放大",
2234
+ onClick: x[2] || (x[2] = //@ts-ignore
2235
+ (...S) => te.zoomIn && te.zoomIn(...S))
2236
+ }, "+"),
2237
+ $("button", {
2238
+ type: "button",
2239
+ "aria-label": "复位",
2240
+ onClick: x[3] || (x[3] = //@ts-ignore
2241
+ (...S) => te.reset && te.reset(...S))
2242
+ }, "复位")
2243
+ ], 64)) : ie("", !0),
2244
+ $("button", {
2245
+ type: "button",
2246
+ "aria-label": "图片详情",
2247
+ onClick: x[4] || (x[4] = //@ts-ignore
2248
+ (...S) => te.toggleDetail && te.toggleDetail(...S))
2249
+ }, "ⓘ")
2250
+ ])
2251
+ ]),
2252
+ !l.mobile && g(q) > 0 ? (z(), H("button", {
2253
+ key: 0,
2254
+ class: "mp-viewer__arrow is-left",
2255
+ "aria-label": "上一张",
2256
+ onClick: x[5] || (x[5] = (S) => g(D).go(-1))
2257
+ }, " ‹ ")) : ie("", !0),
2258
+ !l.mobile && g(q) < l.items.length - 1 ? (z(), H("button", {
2259
+ key: 1,
2260
+ class: "mp-viewer__arrow is-right",
2261
+ "aria-label": "下一张",
2262
+ onClick: x[6] || (x[6] = (S) => g(D).go(1))
2263
+ }, " › ")) : ie("", !0),
2264
+ $("div", on, le(g(q) + 1) + " / " + le(l.items.length), 1)
2265
+ ], 10, Ja),
2266
+ A.value ? (z(), H("aside", rn, [
2267
+ $("button", {
2268
+ type: "button",
2269
+ "aria-label": "关闭详情",
2270
+ onClick: x[7] || (x[7] = (S) => A.value = !1)
2271
+ }, "×"),
2272
+ $("strong", null, le(W.value.title), 1),
2273
+ $("span", null, le(W.value.width) + " × " + le(W.value.height), 1),
2274
+ $("span", null, le(W.value.type) + " · " + le(E.value.toFixed(2)) + "×", 1)
2275
+ ])) : ie("", !0)
2276
+ ], 16, Za)) : ie("", !0)
2277
+ ], 8, ["disabled"]));
2278
+ }
2279
+ });
2280
+ function ln(a, t, e, n = 2) {
2281
+ const o = Math.max(1, (t - n * (e - 1)) / e), i = [], s = /* @__PURE__ */ new Map();
2282
+ let r = 0, f = 0;
2283
+ return a.forEach((y, m) => {
2284
+ m > 0 && (i.push({ kind: "header", group: m, first: 0, count: 0, start: r, end: r + 52 }), r += 52);
2285
+ for (let b = 0; b < y.items.length; b += e) {
2286
+ const B = Math.min(e, y.items.length - b), L = i.length;
2287
+ i.push({ kind: "items", group: m, first: b, count: B, start: r, end: r + o });
2288
+ for (let P = 0; P < B; P++) s.set(y.items[b + P].id, L);
2289
+ f += B, r += o + (b + B < y.items.length ? n : 0);
2290
+ }
2291
+ }), { rows: i, locations: s, height: r, size: o, total: f };
2292
+ }
2293
+ function Pt(a, t) {
2294
+ let e = 0, n = a.length;
2295
+ for (; e < n; ) {
2296
+ const o = e + n >>> 1;
2297
+ a[o].end < t ? e = o + 1 : n = o;
2298
+ }
2299
+ return Math.min(e, Math.max(0, a.length - 1));
2300
+ }
2301
+ const sn = ["data-total-items", "data-rendered-items"], un = /* @__PURE__ */ Le({
2302
+ __name: "VirtualTimeline",
2303
+ props: {
2304
+ groups: {},
2305
+ scrollElement: {},
2306
+ mobile: { type: Boolean, default: !1 },
2307
+ hasMore: { type: Boolean, default: !1 }
2308
+ },
2309
+ emits: ["loadMore", "date"],
2310
+ setup(a, { expose: t, emit: e }) {
2311
+ const n = a, o = e, i = R(), s = R(390), r = R(844), f = R(0), y = U(
2312
+ () => n.mobile ? s.value >= 640 ? 5 : s.value >= 480 ? 4 : 3 : Math.max(1, Math.floor((s.value + 2) / 172))
2313
+ ), m = U(() => ln(n.groups, s.value, y.value)), b = U(() => {
2314
+ const u = m.value.rows, k = Pt(u, Math.max(0, f.value - m.value.size * 3)), h = f.value + r.value + m.value.size * 3;
2315
+ let d = k;
2316
+ for (; d < u.length && u[d].start <= h; ) d++;
2317
+ return u.slice(k, d);
2318
+ }), B = U(() => b.value.reduce((u, k) => u + k.count, 0));
2319
+ let L = 0, P = !1, p = () => {
2320
+ };
2321
+ function v() {
2322
+ const u = n.scrollElement();
2323
+ s.value = u.clientWidth, r.value = u.clientHeight, f.value = u.scrollTop, m.value.rows.length > 0 && o("date", n.groups[m.value.rows[Pt(m.value.rows, f.value)].group].key);
2324
+ const k = f.value + r.value >= m.value.height - m.value.size * 3;
2325
+ k && n.hasMore && !P && (P = !0, o("loadMore")), k || (P = !1);
2326
+ }
2327
+ function T() {
2328
+ L === 0 && (L = requestAnimationFrame(() => {
2329
+ L = 0, v();
2330
+ }));
2331
+ }
2332
+ const I = new ResizeObserver(v);
2333
+ ze(() => {
2334
+ const u = n.scrollElement(), k = u.style.overflowAnchor;
2335
+ u.style.overflowAnchor = "none", p = () => {
2336
+ u.style.overflowAnchor = k;
2337
+ }, u.addEventListener("scroll", T, { passive: !0 }), I.observe(u), v();
2338
+ }), Re(() => {
2339
+ n.scrollElement().removeEventListener("scroll", T), I.disconnect(), cancelAnimationFrame(L), p();
2340
+ }), ee(
2341
+ () => n.groups,
2342
+ () => {
2343
+ P = !1, ye(v);
2344
+ }
2345
+ );
2346
+ async function w(u) {
2347
+ if (!m.value.locations.has(u)) return { kind: "unavailable" };
2348
+ const k = m.value.rows[m.value.locations.get(u)], h = n.scrollElement();
2349
+ return (k.start < h.scrollTop || k.end > h.scrollTop + h.clientHeight) && (h.scrollTop = Math.max(0, k.start - (h.clientHeight - m.value.size) / 2)), v(), await ye(), await new Promise((M) => requestAnimationFrame(() => M())), { kind: "element", element: [...i.value.querySelectorAll("[data-id]")].find(
2350
+ (M) => M.dataset.id === u
2351
+ ).querySelector("img") };
2352
+ }
2353
+ return t({ resolveAnchor: w, rendered: B, total: U(() => m.value.total) }), (u, k) => (z(), H("div", {
2354
+ ref_key: "root",
2355
+ ref: i,
2356
+ class: "mp-virtual-timeline",
2357
+ style: Se({ height: m.value.height + "px" }),
2358
+ "data-total-items": m.value.total,
2359
+ "data-rendered-items": B.value
2360
+ }, [
2361
+ (z(!0), H(De, null, ot(b.value, (h) => (z(), H("div", {
2362
+ key: u.groups[h.group].key + ":" + h.kind + ":" + h.first,
2363
+ class: "mp-timeline-row",
2364
+ style: Se({
2365
+ top: h.start + "px",
2366
+ height: h.end - h.start + "px",
2367
+ display: h.kind === "items" ? "grid" : "block",
2368
+ gridTemplateColumns: `repeat(${y.value},minmax(0,1fr))`,
2369
+ gap: "2px"
2370
+ })
2371
+ }, [
2372
+ h.kind === "header" ? ft(u.$slots, "header", {
2373
+ key: 0,
2374
+ group: u.groups[h.group],
2375
+ index: h.group
2376
+ }, void 0, !0) : (z(!0), H(De, { key: 1 }, ot(u.groups[h.group].items.slice(h.first, h.first + h.count), (d) => ft(u.$slots, "item", {
2377
+ key: d.id,
2378
+ item: d
2379
+ }, void 0, !0)), 128))
2380
+ ], 4))), 128))
2381
+ ], 12, sn));
2382
+ }
2383
+ }), cn = (a, t) => {
2384
+ const e = a.__vccOpts || a;
2385
+ for (const [n, o] of t)
2386
+ e[n] = o;
2387
+ return e;
2388
+ }, mn = /* @__PURE__ */ cn(un, [["__scopeId", "data-v-05c756fb"]]);
2389
+ export {
2390
+ vt as ImageCanvasRenderer,
2391
+ Jt as ImageStore,
2392
+ pa as LivePhotoRenderer,
2393
+ gn as MediaPreview,
2394
+ Va as PreviewStage,
2395
+ Oa as VideoDomRenderer,
2396
+ mn as VirtualTimeline,
2397
+ We as defaultImagePolicy,
2398
+ Ne as defaultImageSource,
2399
+ Ie as formatVideoTime,
2400
+ lt as nativeVideoSource,
2401
+ ea as previewImageStore,
2402
+ Gt as usePreviewViewport
2403
+ };