@car-cutter/react-webplayer 0.9.0 → 0.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,2935 @@
1
+ import { jsx as t, jsxs as O, Fragment as pe } from "react/jsx-runtime";
2
+ import { useState as j, useEffect as W, createContext as Ee, useContext as ke, useMemo as se, useCallback as T, useRef as $, Fragment as Lt } from "react";
3
+ const Pe = "cc-webplayer", je = "cc-webplayer-custom-media", $e = "cc-webplayer-icon", Ue = "composition-loading", Ge = "composition-loaded", Be = "composition-load-error", qe = "item-change", Ke = "extend-mode-on", Je = "extend-mode-off", Qe = "hotspots-on", et = "hotspots-off", tt = "gallery-open", nt = "gallery-close", It = !1, Mt = !1, Tt = !1, Nt = "quality", St = 0, zt = 1 / 0, _t = 1, Vt = !1, Pt = "*", Dt = "full_screen", rt = "cc-webplayer:", At = !1, Ht = !1;
4
+ function Kn(e, n) {
5
+ return `https://cdn.car-cutter.com/gallery/${e}/${n}/composition_v3.json`;
6
+ }
7
+ function Rt(e, n) {
8
+ const r = e.split("/"), o = r.pop();
9
+ return [r.join("/"), n, o].join("/");
10
+ }
11
+ function Jn() {
12
+ return !!customElements.get(Pe) && !!customElements.get(je) && !!customElements.get($e);
13
+ }
14
+ async function Ot(e) {
15
+ const n = await fetch(e);
16
+ if (!n.ok)
17
+ throw new Error(`Failed to fetch composition: ${n.statusText}`);
18
+ return await n.json();
19
+ }
20
+ const ze = /* @__PURE__ */ new Map(), Wt = (e) => {
21
+ const [n, r] = j({
22
+ status: "pending",
23
+ isSuccess: !1
24
+ });
25
+ return W(() => {
26
+ const o = (c) => r({ status: "success", data: c, isSuccess: !0 }), i = ze.get(e);
27
+ if (i && !(i instanceof Promise)) {
28
+ o(i);
29
+ return;
30
+ }
31
+ r({
32
+ status: "fetching",
33
+ isSuccess: !1
34
+ }), async function() {
35
+ try {
36
+ let c;
37
+ if (i)
38
+ c = await i;
39
+ else {
40
+ const p = Ot(e);
41
+ ze.set(e, p), c = await p, ze.set(e, c);
42
+ }
43
+ o(c);
44
+ } catch (c) {
45
+ r({
46
+ status: "error",
47
+ isSuccess: !1,
48
+ error: c
49
+ });
50
+ }
51
+ }();
52
+ }, [e]), n;
53
+ }, ot = Ee(null), ae = () => {
54
+ const e = ke(ot);
55
+ if (!e)
56
+ throw new Error(
57
+ "useGlobalContext must be used within a GlobalContextProvider"
58
+ );
59
+ return e;
60
+ }, Xt = ({ children: e, ...n }) => /* @__PURE__ */ t(ot.Provider, { value: n, children: e }), st = Ee(null), me = () => {
61
+ const e = ke(st);
62
+ if (!e)
63
+ throw new Error(
64
+ "useCompositionContext must be used within a CompositionContextProvider"
65
+ );
66
+ return e;
67
+ }, Zt = ({ composition: e, children: n }) => {
68
+ const {
69
+ aspectRatio: r,
70
+ categories: o,
71
+ imageHdWidth: i,
72
+ imageSubWidths: c
73
+ } = e, { minMediaWidth: p, maxMediaWidth: h, categoriesFilter: b } = ae(), k = se(() => {
74
+ if (b === "*")
75
+ return o;
76
+ function _(u) {
77
+ return b.split("|").some((f) => new RegExp(`^${f.replace(/\*/g, ".*")}$`).test(u));
78
+ }
79
+ return o.filter(({ id: u }) => _(u));
80
+ }, [o, b]), L = se(
81
+ () => k.flatMap(({ items: _ }) => _),
82
+ [k]
83
+ ), v = {
84
+ aspectRatio: r.replace(":", " / ")
85
+ }, D = se(() => {
86
+ const _ = c.concat(i), u = _.sort((l, g) => l - g), f = u.filter(
87
+ (l) => l >= p && l <= h
88
+ );
89
+ if (f.length === 0) {
90
+ const l = (p + h) / 2, g = _.reduce(
91
+ (m, a) => Math.abs(a - l) < Math.abs(m - l) ? a : m,
92
+ i
93
+ );
94
+ return console.warn(
95
+ `None of available media widths (${u.join("|")}) match the given constraints (${p > 0 ? `${p} ≤ ` : ""}width${h < 1 / 0 ? ` ≤ ${h}` : ""}).`,
96
+ `Using the closest width instead (${g}).`
97
+ ), [g];
98
+ }
99
+ return f;
100
+ }, [c, i, p, h]);
101
+ return /* @__PURE__ */ t(
102
+ st.Provider,
103
+ {
104
+ value: {
105
+ ...e,
106
+ categories: k,
107
+ items: L,
108
+ aspectRatioStyle: v,
109
+ usedMediaWidths: D
110
+ },
111
+ children: n
112
+ }
113
+ );
114
+ }, at = 500, Ve = 0.75, Ce = 1 + Ve * 2;
115
+ function de(e, n, r) {
116
+ return Math.min(Math.max(e, n), r);
117
+ }
118
+ const ye = (e, n, r) => e + (n - e) * r, it = Ee(null), De = () => ke(it), be = () => {
119
+ const e = De();
120
+ if (!e)
121
+ throw new Error(
122
+ "useCustomizationContext must be used within a CustomizationContextProvider"
123
+ );
124
+ return e;
125
+ }, We = "*:size-full", Xe = "*:object-cover *:size-full", Ft = ({ children: e }) => {
126
+ const { compositionUrl: n } = ae(), r = T(
127
+ () => document.querySelector(
128
+ `${Pe}[composition-url="${n}"]`
129
+ ),
130
+ [n]
131
+ ), o = T((u) => {
132
+ const f = u.querySelectorAll($e), l = /* @__PURE__ */ new Map();
133
+ for (const g of f) {
134
+ const m = g.getAttribute("name");
135
+ if (!m) {
136
+ console.warn("Icon element is missing a name attribute");
137
+ continue;
138
+ }
139
+ const a = g.innerHTML, s = a ? /* @__PURE__ */ t(
140
+ "div",
141
+ {
142
+ className: We,
143
+ dangerouslySetInnerHTML: { __html: a }
144
+ }
145
+ ) : void 0;
146
+ if (!s) {
147
+ console.warn(`Icon "${m}" customization is empty.`);
148
+ continue;
149
+ }
150
+ l.set(m, { Icon: s });
151
+ }
152
+ return l;
153
+ }, []), [i, c] = j(
154
+ () => {
155
+ const u = r();
156
+ return u ? o(u) : /* @__PURE__ */ new Map();
157
+ }
158
+ );
159
+ W(() => {
160
+ const u = r();
161
+ if (!u)
162
+ return;
163
+ const f = new MutationObserver(() => {
164
+ c(o(u));
165
+ });
166
+ return f.observe(u, {
167
+ childList: !0,
168
+ subtree: !0
169
+ }), () => f.disconnect();
170
+ }, [o, r]);
171
+ const p = T(
172
+ (u) => i.get(u),
173
+ [i]
174
+ ), h = T(
175
+ (u, f) => {
176
+ c((l) => {
177
+ const { Icon: g, ...m } = f;
178
+ return new Map(
179
+ l.set(u, {
180
+ ...m,
181
+ Icon: /* @__PURE__ */ t("div", { className: We, children: g })
182
+ })
183
+ );
184
+ });
185
+ },
186
+ []
187
+ ), b = T((u) => {
188
+ c((f) => (f.delete(u), new Map(f)));
189
+ }, []), k = T((u) => {
190
+ const f = u.querySelectorAll(
191
+ je
192
+ ), l = new Array();
193
+ for (const g of f) {
194
+ const m = g.innerHTML;
195
+ if (!m) {
196
+ console.warn("Custom media element is empty");
197
+ continue;
198
+ }
199
+ const a = Number(g.getAttribute("index"));
200
+ if (Number.isNaN(a)) {
201
+ console.warn("Custom media element is missing the 'index' attribute");
202
+ continue;
203
+ }
204
+ const s = g.getAttribute("thumbnail-src") ?? void 0, x = JSON.stringify({ index: a, thumbnailSrc: s });
205
+ l.push({
206
+ id: x,
207
+ Media: /* @__PURE__ */ t(
208
+ "div",
209
+ {
210
+ className: Xe,
211
+ dangerouslySetInnerHTML: { __html: m }
212
+ }
213
+ ),
214
+ index: a,
215
+ thumbnailSrc: s
216
+ });
217
+ }
218
+ return l;
219
+ }, []), [L, v] = j(() => {
220
+ const u = r();
221
+ return u ? k(u) : [];
222
+ });
223
+ W(() => {
224
+ const u = r();
225
+ if (!u)
226
+ return;
227
+ const f = new MutationObserver(() => {
228
+ v(k(u));
229
+ });
230
+ return f.observe(u, {
231
+ childList: !0,
232
+ subtree: !0
233
+ }), () => f.disconnect();
234
+ }, [k, r]);
235
+ const D = T((u) => {
236
+ const { Media: f, ...l } = u, g = /* @__PURE__ */ t("div", { className: Xe, children: f }), m = JSON.stringify(l);
237
+ return v((a) => [
238
+ ...a,
239
+ {
240
+ id: m,
241
+ Media: g,
242
+ ...l
243
+ }
244
+ ]), m;
245
+ }, []), _ = T((u) => {
246
+ v(
247
+ (f) => f.filter((l) => l.id !== u)
248
+ );
249
+ }, []);
250
+ return /* @__PURE__ */ t(
251
+ it.Provider,
252
+ {
253
+ value: {
254
+ getIconConfig: p,
255
+ registerIconConfig: h,
256
+ unregisterIconConfig: b,
257
+ customMediaList: L,
258
+ registerCustomMedia: D,
259
+ unregisterCustomMedia: _
260
+ },
261
+ children: e
262
+ }
263
+ );
264
+ }, ct = Ee(null), ne = () => {
265
+ const e = ke(ct);
266
+ if (!e)
267
+ throw new Error(
268
+ "useControlsContext must be used within a ControlsContextProvider"
269
+ );
270
+ return e;
271
+ }, Yt = ({
272
+ children: e
273
+ }) => {
274
+ const {
275
+ infiniteCarrousel: n,
276
+ extendBehavior: r,
277
+ emitEvent: o,
278
+ isFullScreen: i,
279
+ requestFullscreen: c,
280
+ exitFullscreen: p
281
+ } = ae(), { customMediaList: h } = be(), { categories: b, items: k } = me(), L = se(() => {
282
+ const R = new Array(
283
+ ...k
284
+ ), ee = h.slice().sort((K, te) => K.index < 0 && te.index < 0 ? te.index - K.index : K.index < 0 ? 1 : te.index < 0 ? -1 : K.index - te.index);
285
+ for (const K of ee) {
286
+ let te = K.index;
287
+ te < 0 && (te = R.length + te + 1), R.splice(te, 0, {
288
+ type: "custom",
289
+ ...K
290
+ });
291
+ }
292
+ return R;
293
+ }, [k, h]), [v, D] = j(L.map(() => null));
294
+ W(() => {
295
+ D(L.map(() => null));
296
+ }, [L]);
297
+ const _ = T(
298
+ (R, ee) => {
299
+ D(
300
+ (K) => K.map((te, Se) => Se === R ? ee : te)
301
+ );
302
+ },
303
+ []
304
+ ), [u, f] = j(0), [l, g] = j(null), m = l ?? u, a = L[m], s = v[m], [x, y] = j(
305
+ null
306
+ ), C = !!x, N = T(() => y(null), []), S = T(() => {
307
+ if (C || l !== null)
308
+ return;
309
+ const R = u - 1;
310
+ R >= 0 ? g(R) : n && (y("first_to_last"), g(L.length - 1));
311
+ }, [
312
+ C,
313
+ l,
314
+ u,
315
+ n,
316
+ L.length
317
+ ]), w = T(() => {
318
+ if (C || l !== null)
319
+ return;
320
+ const R = u + 1;
321
+ R < L.length ? g(R) : n && (y("last_to_first"), g(0));
322
+ }, [
323
+ C,
324
+ l,
325
+ u,
326
+ L.length,
327
+ n
328
+ ]), M = T(
329
+ (R) => {
330
+ const ee = Math.min(u, R), K = Math.max(u, R);
331
+ v.slice(ee, K + 1).filter((Se) => Se === null).length > 2 && y("instant"), g(R);
332
+ },
333
+ [u, v]
334
+ );
335
+ W(() => {
336
+ o(qe, {
337
+ index: m,
338
+ item: a
339
+ });
340
+ }, [a, o, m]);
341
+ const P = se(() => {
342
+ let R;
343
+ if (a.type === "custom") {
344
+ const ee = L.slice(0, m).reverse().find((K) => K.type !== "custom") ?? L.slice(m + 1).find((K) => K.type !== "custom");
345
+ if (!ee)
346
+ throw new Error("No non-custom item found");
347
+ R = ee;
348
+ } else
349
+ R = a;
350
+ for (const ee of b)
351
+ if (ee.items.includes(R))
352
+ return ee.id;
353
+ throw new Error("Current item not found in any category");
354
+ }, [b, a, L, m]), V = T(
355
+ (R) => {
356
+ const ee = b.find(({ id: te }) => te === R)?.items[0];
357
+ if (ee === void 0)
358
+ throw new Error("Failed to find target category");
359
+ const K = L.findIndex((te) => te === ee);
360
+ M(K);
361
+ },
362
+ [b, L, M]
363
+ ), d = se(() => {
364
+ switch (a.type) {
365
+ case "image":
366
+ return !!a.hotspots?.length;
367
+ case "360":
368
+ return s === "running" && a.images.some((R) => !!R.hotspots?.length);
369
+ default:
370
+ return !1;
371
+ }
372
+ }, [a, s]), [I, E] = j(!0), z = T(() => {
373
+ const R = !I;
374
+ E(R), o(R ? Qe : et);
375
+ }, [o, I]), A = se(() => {
376
+ switch (a.type) {
377
+ case "video":
378
+ return s !== "running";
379
+ default:
380
+ return !0;
381
+ }
382
+ }, [a, s]), [Z, F] = j(!1), B = T(() => {
383
+ const R = !Z;
384
+ F(R), o(R ? tt : nt);
385
+ }, [o, Z]), [G, X] = j(null), Y = T(() => X(null), []), U = !!G, re = se(() => {
386
+ switch (a.type) {
387
+ case "image":
388
+ return !0;
389
+ case "360":
390
+ return s === "running";
391
+ default:
392
+ return !1;
393
+ }
394
+ }, [a.type, s]), [q, ue] = j(1), Q = q !== 1, le = q < Ce, ie = q > 1, ce = T((R) => {
395
+ ue((ee) => de(ee + R, 1, Ce));
396
+ }, []), xe = T(() => ue(1), []), yt = T(() => ce(Ve), [ce]), Ct = T(() => ce(-Ve), [ce]), Le = T(() => {
397
+ xe(), Y();
398
+ }, [xe, Y]), [he, Et] = j(!1), [Ie, Re] = j(), [Me, Oe] = j(!1), fe = T(
399
+ async (R) => {
400
+ Le(), Et(R), o(R ? Ke : Je);
401
+ },
402
+ [o, Le]
403
+ ), ge = T(() => {
404
+ clearTimeout(Ie);
405
+ const R = setTimeout(() => {
406
+ Re(void 0);
407
+ }, at);
408
+ Re(R);
409
+ }, [Ie]), Te = T(async () => {
410
+ if (ge(), r === "full_screen") {
411
+ const R = await c();
412
+ if (Oe(!R), R)
413
+ return;
414
+ }
415
+ fe(!0);
416
+ }, [
417
+ r,
418
+ fe,
419
+ c,
420
+ ge
421
+ ]), Ne = T(async () => {
422
+ ge(), !(r === "full_screen" && (Oe(!1), await p())) && fe(!1);
423
+ }, [
424
+ r,
425
+ fe,
426
+ p,
427
+ ge
428
+ ]), kt = T(() => {
429
+ he ? Ne() : Te();
430
+ }, [Ne, Te, he]);
431
+ return W(() => {
432
+ r === "full_screen" && (Me && he || i !== he && (ge(), fe(i)));
433
+ }, [
434
+ r,
435
+ fe,
436
+ he,
437
+ Me,
438
+ i,
439
+ ge
440
+ ]), /* @__PURE__ */ t(
441
+ ct.Provider,
442
+ {
443
+ value: {
444
+ items: L,
445
+ setItemInteraction: _,
446
+ slidable: L.length > 1,
447
+ carrouselItemIndex: u,
448
+ setCarrouselItemIndex: f,
449
+ itemIndexCommand: l,
450
+ setItemIndexCommand: g,
451
+ masterItemIndex: m,
452
+ specialCommand: x,
453
+ isRunningSpecialCommand: C,
454
+ finishSpecialCommand: N,
455
+ prevItem: S,
456
+ nextItem: w,
457
+ scrollToItemIndex: M,
458
+ displayedCategoryId: P,
459
+ changeCategory: V,
460
+ enableHotspotsControl: d,
461
+ showHotspots: I,
462
+ toggleHotspots: z,
463
+ showGalleryControls: A,
464
+ showGallery: Z,
465
+ toggleGallery: B,
466
+ shownDetails: G,
467
+ isShowingDetails: U,
468
+ setShownDetails: X,
469
+ resetShownDetails: Y,
470
+ showZoomControls: re,
471
+ zoom: q,
472
+ isZooming: Q,
473
+ setZoom: ue,
474
+ resetZoom: xe,
475
+ canZoomIn: le,
476
+ zoomIn: yt,
477
+ canZoomOut: ie,
478
+ zoomOut: Ct,
479
+ resetView: Le,
480
+ extendMode: he,
481
+ enableExtendMode: Te,
482
+ disableExtendMode: Ne,
483
+ toggleExtendMode: kt,
484
+ extendTransition: !!Ie,
485
+ fakeFullScreen: Me
486
+ },
487
+ children: e
488
+ }
489
+ );
490
+ }, lt = ["left", "center", "right", "fullW"], ut = ["top", "middle", "bottom", "fullH"], jt = [
491
+ ...lt,
492
+ ...ut,
493
+ "top-left",
494
+ "top-center",
495
+ "top-right",
496
+ "top-fullW",
497
+ "middle-left",
498
+ "middle-center",
499
+ "middle-right",
500
+ "middle-fullW",
501
+ "bottom-left",
502
+ "bottom-center",
503
+ "bottom-right",
504
+ "bottom-fullW",
505
+ "fullH-left",
506
+ "fullH-center",
507
+ "fullH-right",
508
+ "fullW-fullW"
509
+ ];
510
+ function $t(e) {
511
+ return lt.includes(e);
512
+ }
513
+ function Ut(e) {
514
+ return ut.includes(e);
515
+ }
516
+ function Gt(e) {
517
+ return jt.includes(e);
518
+ }
519
+ function Bt(e) {
520
+ if (!Gt(e))
521
+ throw new Error(`Invalid position: ${e}`);
522
+ return Ut(e) ? [e, void 0] : $t(e) ? [void 0, e] : e.split("-");
523
+ }
524
+ function H(...e) {
525
+ return e.filter((n) => !!n).map((n) => n.trim()).join(" ");
526
+ }
527
+ function qt(e) {
528
+ switch (e) {
529
+ case "left":
530
+ return "left-1 small:left-2";
531
+ case "right":
532
+ return "right-1 small:right-2";
533
+ case "center":
534
+ return "left-1/2 -translate-x-1/2";
535
+ case "fullW":
536
+ return "inset-x-1 small:inset-x-2";
537
+ }
538
+ }
539
+ function dt(e) {
540
+ switch (e) {
541
+ case "top":
542
+ return "top-1 small:top-2";
543
+ case "bottom":
544
+ return "bottom-1 small:bottom-2";
545
+ case "middle":
546
+ return "top-1/2 -translate-y-1/2";
547
+ case "fullH":
548
+ return "inset-y-1 small:inset-y-2";
549
+ }
550
+ }
551
+ function Kt({
552
+ positionX: e,
553
+ positionY: n
554
+ }) {
555
+ const r = new Array();
556
+ return e && r.push(qt(e)), n && r.push(dt(n)), r.join(" ");
557
+ }
558
+ function we(e) {
559
+ const [n, r] = Bt(e);
560
+ return Kt({ positionX: r, positionY: n });
561
+ }
562
+ const J = ({
563
+ customizationKey: e,
564
+ className: n,
565
+ children: r
566
+ }) => {
567
+ const { getIconConfig: o } = be(), c = o(e)?.Icon;
568
+ return c ? n ? /* @__PURE__ */ t("div", { className: n, children: c }) : c : r;
569
+ }, Jt = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_CLOSE", children: /* @__PURE__ */ t(
570
+ "svg",
571
+ {
572
+ className: e,
573
+ width: "24",
574
+ height: "24",
575
+ viewBox: "0 0 24 24",
576
+ fill: "none",
577
+ xmlns: "http://www.w3.org/2000/svg",
578
+ children: /* @__PURE__ */ t(
579
+ "path",
580
+ {
581
+ d: "M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z",
582
+ fill: "currentColor"
583
+ }
584
+ )
585
+ }
586
+ ) }), Qt = {
587
+ fill: {
588
+ primary: "bg-primary text-primary-foreground hover:opacity-80",
589
+ neutral: "bg-background text-neutral-foreground hover:opacity-80"
590
+ },
591
+ ghost: {
592
+ primary: "bg-transparent text-foreground hover:bg-primary/25",
593
+ neutral: "bg-transparent text-background hover:bg-foreground/25"
594
+ }
595
+ }, en = {
596
+ button: "h-8 px-2",
597
+ icon: "size-8 p-2"
598
+ }, oe = ({
599
+ variant: e = "fill",
600
+ shape: n = "button",
601
+ color: r = "primary",
602
+ className: o,
603
+ children: i,
604
+ ...c
605
+ }) => {
606
+ const p = Qt[e][r], h = en[n];
607
+ return /* @__PURE__ */ t(
608
+ "button",
609
+ {
610
+ className: H(
611
+ "flex items-center justify-center rounded-ui text-sm transition-all disabled:opacity-60",
612
+ p,
613
+ h,
614
+ o
615
+ ),
616
+ ...c,
617
+ children: i
618
+ }
619
+ );
620
+ }, mt = (e) => /* @__PURE__ */ t(oe, { color: "neutral", shape: "icon", ...e, children: /* @__PURE__ */ t(Jt, { className: "size-full" }) }), pt = ({ text: e, className: n }) => /* @__PURE__ */ O(
621
+ "div",
622
+ {
623
+ className: H(
624
+ "flex size-full flex-col items-center justify-center gap-y-4",
625
+ n
626
+ ),
627
+ children: [
628
+ /* @__PURE__ */ t(
629
+ "img",
630
+ {
631
+ className: "h-20 small:h-28",
632
+ src: "https://cdn.car-cutter.com/libs/web-player/v3/assets/car_placeholder.png"
633
+ }
634
+ ),
635
+ /* @__PURE__ */ t("div", { className: "text-2xl font-bold", children: e })
636
+ ]
637
+ }
638
+ ), tn = {
639
+ primary: "border-primary",
640
+ foreground: "border-foreground",
641
+ background: "border-background"
642
+ }, nn = {
643
+ sm: "size-4 border",
644
+ md: "size-8 border-2",
645
+ lg: "size-12 border-4"
646
+ }, ht = ({
647
+ color: e = "foreground",
648
+ size: n = "md"
649
+ }) => {
650
+ const r = tn[e], o = nn[n];
651
+ return /* @__PURE__ */ t(
652
+ "div",
653
+ {
654
+ className: H(
655
+ "inline-block animate-rotation rounded-full border-b-transparent",
656
+ o,
657
+ r
658
+ )
659
+ }
660
+ );
661
+ }, ve = ({
662
+ src: e,
663
+ className: n,
664
+ onLoad: r,
665
+ imgInPlayerWidthRatio: o = 1,
666
+ onlyThumbnail: i,
667
+ fadeIn: c,
668
+ ...p
669
+ }) => {
670
+ const { mediaLoadStrategy: h, playerInViewportWidthRatio: b } = ae(), { imageHdWidth: k, usedMediaWidths: L } = me(), [v, D] = se(() => {
671
+ const f = L.map((g) => `${g !== k ? Rt(e, g) : e} ${g}w`);
672
+ let l;
673
+ if (i)
674
+ l = [`${L[0]}px`];
675
+ else {
676
+ const g = 1 / (o * b);
677
+ switch (h) {
678
+ case "quality": {
679
+ const m = [...L], a = m.pop();
680
+ l = m.map(
681
+ (s) => `(max-width: ${g * s}px) ${s}px`
682
+ ), l.push(`${a}px`);
683
+ break;
684
+ }
685
+ case "balanced": {
686
+ l = [];
687
+ for (let m = 0; m < L.length - 1; m++) {
688
+ const a = L[m], s = L[m + 1], x = Math.round((a + s) / 2);
689
+ l.push(
690
+ `(max-width: ${g * x}px) ${a}px`
691
+ );
692
+ }
693
+ l.push(`${L[L.length - 1]}px`);
694
+ break;
695
+ }
696
+ case "speed": {
697
+ const m = [...L], a = m.shift();
698
+ l = m.reverse().map(
699
+ (s) => `(min-width: ${g * s}px) ${s}px`
700
+ ), l.push(`${a}px`);
701
+ break;
702
+ }
703
+ }
704
+ }
705
+ return [f.join(", "), l.join(", ")];
706
+ }, [
707
+ k,
708
+ o,
709
+ h,
710
+ i,
711
+ b,
712
+ e,
713
+ L
714
+ ]), [_, u] = j();
715
+ return W(() => {
716
+ if (_ === !0)
717
+ return;
718
+ const f = setTimeout(() => {
719
+ u((l) => l ?? !1);
720
+ }, 30);
721
+ return () => clearTimeout(f);
722
+ }, [_]), /* @__PURE__ */ t(
723
+ "img",
724
+ {
725
+ src: e,
726
+ srcSet: v,
727
+ sizes: D,
728
+ className: H(
729
+ n,
730
+ c && H(
731
+ _ !== void 0 && "transition-opacity duration-200",
732
+ _ === !1 && "opacity-0",
733
+ _ === !0 && "opacity-100"
734
+ )
735
+ ),
736
+ onLoad: (f) => {
737
+ u(!0), r?.(f);
738
+ },
739
+ ...p
740
+ }
741
+ );
742
+ }, ft = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_IMAGE", children: /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ t(
743
+ "path",
744
+ {
745
+ d: "M9.5 2.5V9.5H2.5V2.5H9.5ZM9.5 1.5H2.5C1.95 1.5 1.5 1.95 1.5 2.5V9.5C1.5 10.05 1.95 10.5 2.5 10.5H9.5C10.05 10.5 10.5 10.05 10.5 9.5V2.5C10.5 1.95 10.05 1.5 9.5 1.5ZM7.07 5.93L5.57 7.865L4.5 6.57L3 8.5H9L7.07 5.93Z",
746
+ fill: "currentColor"
747
+ }
748
+ ) }) }), Ae = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_PLAY", children: /* @__PURE__ */ t(
749
+ "svg",
750
+ {
751
+ className: e,
752
+ viewBox: "0 0 24 24",
753
+ fill: "none",
754
+ stroke: "currentColor",
755
+ strokeWidth: "1.5",
756
+ strokeLinecap: "round",
757
+ strokeLinejoin: "round",
758
+ children: /* @__PURE__ */ t("polygon", { points: "6 3 20 12 6 21 6 3" })
759
+ }
760
+ ) }), gt = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_360", children: /* @__PURE__ */ O(
761
+ "svg",
762
+ {
763
+ className: e,
764
+ viewBox: "0 0 56 56",
765
+ fill: "none",
766
+ xmlns: "http://www.w3.org/2000/svg",
767
+ children: [
768
+ /* @__PURE__ */ O("g", { clipPath: "url(#clip0_134_843)", children: [
769
+ /* @__PURE__ */ t(
770
+ "path",
771
+ {
772
+ d: "M35.2497 43.93C34.4358 43.93 33.7296 43.325 33.6241 42.4966C33.51 41.5977 34.1457 40.7765 35.0442 40.662C40.2284 40.0015 44.8709 38.5967 48.1162 36.7057C51.0843 34.9767 52.7185 32.9438 52.7185 30.9819C52.7185 28.8196 50.8062 27.0504 49.2014 25.9464C48.455 25.4329 48.2662 24.4117 48.7798 23.6649C49.2933 22.9185 50.3148 22.7297 51.0612 23.2432C54.2921 25.4657 55.9998 28.1416 55.9998 30.9823C55.9998 34.2063 53.8452 37.1659 49.7684 39.5409C46.0988 41.6789 41.1509 43.1922 35.4591 43.9172C35.3886 43.9257 35.3185 43.93 35.2497 43.93Z",
773
+ fill: "currentColor"
774
+ }
775
+ ),
776
+ /* @__PURE__ */ t(
777
+ "path",
778
+ {
779
+ d: "M27.6 41.5797L23.225 37.2047C22.5842 36.5638 21.5455 36.5638 20.9047 37.2047C20.2642 37.8451 20.2642 38.8842 20.9047 39.5246L22.183 40.8029C17.2816 40.2966 12.8289 39.1555 9.38102 37.4973C5.50463 35.6333 3.28124 33.2582 3.28124 30.9818C3.28124 29.0511 4.87316 27.0443 7.76347 25.3311C8.5432 24.8692 8.8004 23.8626 8.33854 23.0833C7.87627 22.3036 6.86968 22.0464 6.09038 22.5083C1.05658 25.4922 0 28.7631 0 30.9818C0 34.622 2.82665 37.9861 7.95915 40.4547C11.9428 42.3701 17.0958 43.6531 22.7098 44.1495L20.9047 45.9546C20.2642 46.5951 20.2642 47.6341 20.9047 48.275C21.2251 48.595 21.6451 48.7552 22.0651 48.7552C22.4846 48.7552 22.9046 48.595 23.225 48.275L27.6 43.9C28.2405 43.2592 28.2405 42.2201 27.6 41.5797Z",
780
+ fill: "currentColor"
781
+ }
782
+ ),
783
+ /* @__PURE__ */ t(
784
+ "path",
785
+ {
786
+ d: "M17.1827 27.6963V27.3016C17.1827 25.9092 16.3303 25.6391 15.1874 25.6391C14.4808 25.6391 14.2522 25.0158 14.2522 24.3924C14.2522 23.7687 14.4808 23.1453 15.1874 23.1453C15.977 23.1453 16.8084 23.0415 16.8084 21.3581C16.8084 20.1529 16.1227 19.8619 15.2703 19.8619C14.2522 19.8619 13.7327 20.1114 13.7327 20.9219C13.7327 21.6282 13.4208 22.1063 12.2155 22.1063C10.7193 22.1063 10.5326 21.7944 10.5326 20.7967C10.5326 19.1762 11.696 17.0771 15.2703 17.0771C17.9098 17.0771 19.9046 18.0329 19.9046 20.8386C19.9046 22.3553 19.3437 23.7687 18.3046 24.2468C19.5308 24.7039 20.4242 25.6182 20.4242 27.3016V27.6963C20.4242 31.1045 18.076 32.393 15.1665 32.393C11.5922 32.393 10.2207 30.2111 10.2207 28.4654C10.2207 27.5301 10.6155 27.2806 11.7584 27.2806C13.0884 27.2806 13.4208 27.5716 13.4208 28.3616C13.4208 29.3382 14.3355 29.5668 15.2703 29.5668C16.6836 29.5668 17.1827 29.0473 17.1827 27.6963Z",
787
+ fill: "white"
788
+ }
789
+ ),
790
+ /* @__PURE__ */ t(
791
+ "path",
792
+ {
793
+ d: "M33.0384 27.3016V27.4887C33.0384 31.063 30.8146 32.393 27.9469 32.393C25.0792 32.393 22.8345 31.063 22.8345 27.4887V21.9815C22.8345 18.4072 25.1412 17.0771 28.134 17.0771C31.646 17.0771 33.0384 19.2591 33.0384 20.9839C33.0384 21.9815 32.5603 22.293 31.5212 22.293C30.6279 22.293 29.8379 22.0644 29.8379 21.1086C29.8379 20.3191 29.0069 19.9034 28.0302 19.9034C26.804 19.9034 26.0764 20.5477 26.0764 21.9815V23.8515C26.7416 23.1244 27.6769 22.9372 28.6745 22.9372C31.0431 22.9372 33.0384 23.9763 33.0384 27.3016ZM26.0764 27.7173C26.0764 29.1511 26.7831 29.7745 27.9469 29.7745C29.1107 29.7745 29.7964 29.1511 29.7964 27.7173V27.5301C29.7964 26.013 29.1107 25.4311 27.926 25.4311C26.804 25.4311 26.0764 25.9715 26.0764 27.343V27.7173Z",
794
+ fill: "white"
795
+ }
796
+ ),
797
+ /* @__PURE__ */ t(
798
+ "path",
799
+ {
800
+ d: "M35.5527 27.4887V21.9815C35.5527 18.4072 37.7761 17.0771 40.6442 17.0771C43.5119 17.0771 45.7562 18.4072 45.7562 21.9815V27.4887C45.7562 31.063 43.5119 32.393 40.6442 32.393C37.7761 32.393 35.5527 31.063 35.5527 27.4887ZM42.5143 21.9815C42.5143 20.5477 41.808 19.9034 40.6442 19.9034C39.4804 19.9034 38.7947 20.5477 38.7947 21.9815V27.4887C38.7947 28.9225 39.4804 29.5668 40.6442 29.5668C41.808 29.5668 42.5143 28.9225 42.5143 27.4887V21.9815Z",
801
+ fill: "white"
802
+ }
803
+ ),
804
+ /* @__PURE__ */ t(
805
+ "path",
806
+ {
807
+ d: "M49.6948 17.0625C46.9805 17.0625 44.7729 14.8545 44.7729 12.1406C44.7729 9.42675 46.9805 7.21875 49.6948 7.21875C52.4087 7.21875 54.6167 9.42675 54.6167 12.1406C54.6167 14.8545 52.4087 17.0625 49.6948 17.0625ZM49.6948 10.5C48.7899 10.5 48.0542 11.2361 48.0542 12.1406C48.0542 13.0455 48.7899 13.7812 49.6948 13.7812C50.5993 13.7812 51.3354 13.0455 51.3354 12.1406C51.3354 11.2361 50.5993 10.5 49.6948 10.5Z",
808
+ fill: "white"
809
+ }
810
+ )
811
+ ] }),
812
+ /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_134_843", children: /* @__PURE__ */ t("rect", { width: "56", height: "56", fill: "white" }) }) })
813
+ ]
814
+ }
815
+ ) }), rn = ({
816
+ src: e,
817
+ withCdn: n
818
+ }) => {
819
+ const { permanentGallery: r } = ae();
820
+ if (!e)
821
+ return null;
822
+ const o = "size-full object-cover";
823
+ return n ? /* @__PURE__ */ t(
824
+ ve,
825
+ {
826
+ className: o,
827
+ src: e,
828
+ onlyThumbnail: !0,
829
+ fadeIn: !r
830
+ }
831
+ ) : /* @__PURE__ */ t("img", { className: o, src: e });
832
+ }, _e = ({
833
+ children: e
834
+ }) => {
835
+ const { extendMode: n } = ne();
836
+ return /* @__PURE__ */ t(
837
+ "div",
838
+ {
839
+ className: H(
840
+ "flex aspect-square h-3/4 items-center justify-center rounded-full bg-foreground/50 p-1",
841
+ n && "large:h-3/5 large:p-2"
842
+ ),
843
+ children: e
844
+ }
845
+ );
846
+ }, on = ({ item: e }) => {
847
+ const { aspectRatioStyle: n } = me(), { type: r } = e;
848
+ let o, i;
849
+ switch (r) {
850
+ case "360":
851
+ o = e.images[0].src, i = !0;
852
+ break;
853
+ case "image":
854
+ o = e.src, i = !0;
855
+ break;
856
+ case "video":
857
+ o = e.poster, i = !0;
858
+ break;
859
+ case "custom":
860
+ o = e.thumbnailSrc, i = !1;
861
+ break;
862
+ }
863
+ const c = /* @__PURE__ */ t(rn, { src: o, withCdn: i });
864
+ let p;
865
+ switch (r) {
866
+ case "360":
867
+ p = /* @__PURE__ */ t(_e, { children: /* @__PURE__ */ t(gt, { className: "size-full text-primary-light" }) });
868
+ break;
869
+ case "video":
870
+ p = /* @__PURE__ */ t(_e, { children: /* @__PURE__ */ t(Ae, { className: "size-full p-0.5 text-background" }) });
871
+ break;
872
+ case "custom":
873
+ p = o ? null : /* @__PURE__ */ t(_e, { children: /* @__PURE__ */ t(ft, { className: "size-full p-0.5 text-background" }) });
874
+ break;
875
+ }
876
+ return /* @__PURE__ */ O("div", { className: "relative bg-foreground/30", style: n, children: [
877
+ c,
878
+ p && /* @__PURE__ */ t("div", { className: "absolute inset-0 flex items-center justify-center bg-foreground/25", children: p })
879
+ ] });
880
+ }, sn = {
881
+ primary: "bg-primary/50",
882
+ neutral: "bg-neutral/50",
883
+ background: "bg-background/50",
884
+ foreground: "bg-foreground/50"
885
+ }, wt = ({
886
+ color: e = "neutral",
887
+ orientation: n = "horizontal"
888
+ }) => {
889
+ const r = sn[e];
890
+ return /* @__PURE__ */ t("div", { className: H(r, n === "horizontal" ? "h-px w-full" : "w-px h-full") });
891
+ }, vt = ({
892
+ className: e = "",
893
+ containerClassName: n = ""
894
+ }) => {
895
+ const {
896
+ hideCategoriesNav: r,
897
+ infiniteCarrousel: o,
898
+ permanentGallery: i,
899
+ isFullScreen: c
900
+ } = ae(), { categories: p, aspectRatioStyle: h } = me(), {
901
+ items: b,
902
+ extendMode: k,
903
+ extendTransition: L,
904
+ masterItemIndex: v,
905
+ prevItem: D,
906
+ nextItem: _,
907
+ scrollToItemIndex: u,
908
+ resetView: f
909
+ } = ne(), l = se(() => {
910
+ if (r)
911
+ return [];
912
+ const w = new Array();
913
+ let M = p[0];
914
+ const P = (V) => p.find(
915
+ (d) => d.items.some((I) => I === V)
916
+ );
917
+ for (let V = 0; V < b.length; V++) {
918
+ const d = b[V], I = P(d);
919
+ I && I !== M && (w.push(V), M = I);
920
+ }
921
+ return w;
922
+ }, [p, r, b]), g = $(null), m = T(() => {
923
+ if (!g.current)
924
+ throw new Error("slider.current is null");
925
+ return g.current;
926
+ }, []), a = $(!1), s = $(
927
+ null
928
+ ), [x, y] = j(!1), C = T(
929
+ (w, M) => {
930
+ const P = m(), V = P.clientWidth, d = P.scrollWidth / b.length, I = (w + 1 / 2) * d - V / 2, E = P.scrollWidth - P.clientWidth;
931
+ P.scrollTo({
932
+ left: de(I, 0, E),
933
+ behavior: M
934
+ });
935
+ },
936
+ [b.length, m]
937
+ );
938
+ W(() => {
939
+ const w = g.current;
940
+ if (!w)
941
+ return;
942
+ const M = (d) => {
943
+ d.preventDefault(), a.current = !0, s.current = {
944
+ x: d.pageX - w.offsetLeft,
945
+ scrollLeft: w.scrollLeft
946
+ };
947
+ }, P = (d) => {
948
+ if (!a.current)
949
+ return;
950
+ if (s.current === null)
951
+ throw new Error("[onMouseMove] scrollStart is null");
952
+ const E = d.pageX - w.offsetLeft - s.current.x;
953
+ if (!x && Math.abs(E) < 5)
954
+ return;
955
+ const z = s.current.scrollLeft - E;
956
+ y(!0), requestAnimationFrame(() => {
957
+ w.scrollLeft = z;
958
+ });
959
+ }, V = () => {
960
+ a.current && (a.current = !1, requestAnimationFrame(() => {
961
+ y(!1);
962
+ }));
963
+ };
964
+ return w.addEventListener("mousedown", M), document.addEventListener("mousemove", P), document.addEventListener("mouseleave", V), document.addEventListener("mouseup", V), document.addEventListener("contextmenu", V), () => {
965
+ w.removeEventListener("mousedown", M), document.removeEventListener("mousemove", P), document.removeEventListener("mouseleave", V), document.removeEventListener("mouseup", V), document.removeEventListener("contextmenu", V);
966
+ };
967
+ }, [x]);
968
+ const N = $(v);
969
+ W(() => {
970
+ g.current && (C(v, "smooth"), N.current = v);
971
+ }, [v, C]), W(() => {
972
+ g.current && C(N.current, "instant");
973
+ }, [
974
+ C,
975
+ // - Run the effect when those values change
976
+ c,
977
+ k,
978
+ L
979
+ ]);
980
+ const S = (w) => {
981
+ x || (o && w === b.length - 1 && v === 0 ? D() : o && w === 0 && v === b.length - 1 ? _() : u(w), f());
982
+ };
983
+ return /* @__PURE__ */ t(
984
+ "div",
985
+ {
986
+ ref: g,
987
+ className: H(
988
+ "relative w-full overflow-x-auto no-scrollbar",
989
+ x ? "cursor-grab" : "cursor-grabbing",
990
+ e
991
+ ),
992
+ children: /* @__PURE__ */ t(
993
+ "div",
994
+ {
995
+ className: H(
996
+ "flex h-10 w-fit gap-1 small:h-12 small:gap-2",
997
+ k && "large:h-20 large:gap-4",
998
+ n
999
+ ),
1000
+ children: b.map((w, M) => /* @__PURE__ */ O(Lt, { children: [
1001
+ l.includes(M) && /* @__PURE__ */ t("div", { className: "my-2", children: /* @__PURE__ */ t(
1002
+ wt,
1003
+ {
1004
+ color: i && !c ? "neutral" : "background",
1005
+ orientation: "vertical"
1006
+ }
1007
+ ) }),
1008
+ /* @__PURE__ */ t(
1009
+ "div",
1010
+ {
1011
+ className: H(
1012
+ "relative h-full overflow-hidden rounded-gallery transition-radius",
1013
+ !x && "cursor-pointer",
1014
+ "after:absolute after:inset-0 after:rounded-gallery after:border-2 after:border-primary after:transition-all",
1015
+ M === v ? "after:opacity-100" : "after:opacity-0 hover:after:opacity-70"
1016
+ ),
1017
+ style: h,
1018
+ onClick: () => S(M),
1019
+ children: /* @__PURE__ */ t(on, { item: w })
1020
+ }
1021
+ )
1022
+ ] }, M))
1023
+ }
1024
+ )
1025
+ }
1026
+ );
1027
+ }, xt = (e) => 1 - Math.pow(1 - e, 2), an = ({
1028
+ Media: e,
1029
+ itemIndex: n
1030
+ }) => {
1031
+ const { setItemInteraction: r } = ne();
1032
+ return W(() => {
1033
+ r(n, "ready");
1034
+ }, [n, r]), e;
1035
+ }, Ze = (e, n) => Math.sqrt(
1036
+ (e.clientX - n.clientX) ** 2 + (e.clientY - n.clientY) ** 2
1037
+ ), cn = ({
1038
+ onlyPreload: e,
1039
+ ...n
1040
+ }) => {
1041
+ const { zoom: r, isZooming: o, setZoom: i } = ne(), c = $(null), p = $(null), h = T((a) => {
1042
+ if (!p.current)
1043
+ throw new Error(
1044
+ `[${a ?? "getTransformElementOrThrow"}] transformElementRef.current is null`
1045
+ );
1046
+ return p.current;
1047
+ }, []), b = $(!1), k = $(null), L = $(/* @__PURE__ */ new Map()), v = $({ x: 0, y: 0, scale: 1 }), D = $(null), _ = T(
1048
+ (a) => {
1049
+ const s = h("setTransformStyle"), {
1050
+ x,
1051
+ y,
1052
+ scale: C
1053
+ } = {
1054
+ ...v.current,
1055
+ ...a
1056
+ }, N = de(C, 1, Ce), S = s.clientWidth, w = s.clientHeight, M = S * N, P = w * N, V = de(x, -(M - S), 0), d = de(y, -(P - w), 0);
1057
+ v.current = { x: V, y: d, scale: N }, s.style.transform = `translate(${V}px, ${d}px) scale(${N})`;
1058
+ },
1059
+ [h]
1060
+ ), u = T(
1061
+ (a, s) => {
1062
+ const {
1063
+ x,
1064
+ y,
1065
+ scale: C
1066
+ } = v.current, {
1067
+ x: N,
1068
+ y: S,
1069
+ scale: w
1070
+ } = {
1071
+ ...v.current,
1072
+ ...a
1073
+ };
1074
+ D.current && (cancelAnimationFrame(D.current), D.current = null);
1075
+ const M = () => {
1076
+ _({ x: N, y: S, scale: w }), i(w);
1077
+ }, P = Math.abs(N - x) < 1 && Math.abs(S - y) < 1 && Math.abs(w - C) < 5e-3;
1078
+ if (!s || P) {
1079
+ M();
1080
+ return;
1081
+ }
1082
+ const V = (/* @__PURE__ */ new Date()).getTime(), d = () => {
1083
+ const I = () => {
1084
+ const z = (/* @__PURE__ */ new Date()).getTime() - V;
1085
+ if (z >= s) {
1086
+ M(), D.current = null;
1087
+ return;
1088
+ }
1089
+ const A = Math.min(z / s, 1), Z = xt(A), F = ye(x, N, Z), B = ye(y, S, Z), G = ye(C, w, Z);
1090
+ _({ x: F, y: B, scale: G }), d();
1091
+ };
1092
+ D.current = requestAnimationFrame(I);
1093
+ };
1094
+ d();
1095
+ },
1096
+ [_, i]
1097
+ ), f = T(
1098
+ (a, s) => {
1099
+ let { x, y } = v.current;
1100
+ a.x && (x += a.x), a.y && (y += a.y), u(
1101
+ {
1102
+ x,
1103
+ y
1104
+ },
1105
+ s
1106
+ );
1107
+ },
1108
+ [u]
1109
+ ), l = T(
1110
+ (a, s, x) => {
1111
+ const y = v.current.scale, C = de(a, 1, Ce), N = C / y, { x: S, y: w } = v.current, { x: M, y: P } = s, V = -S + M, d = -w + P, I = V * N, E = d * N, z = I - M, A = E - P, Z = -z, F = -A;
1112
+ u(
1113
+ {
1114
+ x: Z,
1115
+ y: F,
1116
+ scale: C
1117
+ },
1118
+ x
1119
+ );
1120
+ },
1121
+ [u]
1122
+ ), g = T(
1123
+ (a) => {
1124
+ const s = h(
1125
+ "shiftZoomFromButton"
1126
+ ), x = s.clientWidth, y = s.clientHeight;
1127
+ l(
1128
+ a,
1129
+ {
1130
+ x: x / 2,
1131
+ y: y / 2
1132
+ },
1133
+ 200
1134
+ );
1135
+ },
1136
+ [h, l]
1137
+ ), m = T(
1138
+ (a, s, x) => {
1139
+ const { scale: y } = v.current;
1140
+ l(
1141
+ y + a,
1142
+ s,
1143
+ x
1144
+ );
1145
+ },
1146
+ [l]
1147
+ );
1148
+ return W(() => {
1149
+ e || p.current && g(r);
1150
+ }, [e, g, r]), W(() => {
1151
+ if (e || !o)
1152
+ return;
1153
+ const a = p.current;
1154
+ if (!a)
1155
+ return;
1156
+ const s = (C) => {
1157
+ C.preventDefault(), C.stopPropagation(), b.current = !0, k.current = {
1158
+ x: C.clientX,
1159
+ y: C.clientY
1160
+ };
1161
+ }, x = (C) => {
1162
+ if (!b.current)
1163
+ return;
1164
+ if (!k.current)
1165
+ throw new Error("mouseStartXY.current is null");
1166
+ C.stopPropagation();
1167
+ const N = C.clientX - k.current.x, S = C.clientY - k.current.y;
1168
+ f({
1169
+ x: N,
1170
+ y: S
1171
+ }), k.current = {
1172
+ x: C.clientX,
1173
+ y: C.clientY
1174
+ };
1175
+ }, y = () => {
1176
+ b.current = !1;
1177
+ };
1178
+ return a.addEventListener("mousedown", s), document.addEventListener("mousemove", x), document.addEventListener("mouseleave", y), document.addEventListener("mouseup", y), document.addEventListener("contextmenu", y), () => {
1179
+ a.removeEventListener("mousedown", s), document.removeEventListener("mousemove", x), document.removeEventListener("mouseleave", y), document.removeEventListener("mouseup", y), document.removeEventListener("contextmenu", y);
1180
+ };
1181
+ }, [o, f, e]), W(() => {
1182
+ if (e)
1183
+ return;
1184
+ const a = c.current;
1185
+ if (!a)
1186
+ return;
1187
+ const s = (x) => {
1188
+ const { ctrlKey: y, clientX: C, clientY: N, deltaX: S, deltaY: w } = x;
1189
+ if (y) {
1190
+ if (!o && w >= 0)
1191
+ return;
1192
+ const { left: M, top: P } = a.getBoundingClientRect(), V = C - M, d = N - P;
1193
+ m(-0.01 * w, {
1194
+ x: V,
1195
+ y: d
1196
+ });
1197
+ } else {
1198
+ if (!o)
1199
+ return;
1200
+ f({
1201
+ x: -2 * S,
1202
+ y: -2 * w
1203
+ });
1204
+ }
1205
+ x.preventDefault();
1206
+ };
1207
+ return a.addEventListener("wheel", s), () => {
1208
+ a.removeEventListener("wheel", s);
1209
+ };
1210
+ }, [o, f, m, e]), W(() => {
1211
+ const a = c.current, s = p.current;
1212
+ if (!a || !s)
1213
+ return;
1214
+ const x = L.current, y = (S) => {
1215
+ for (let w = 0; w < S.changedTouches.length; w++) {
1216
+ const M = S.changedTouches[w];
1217
+ x.set(M.identifier, M);
1218
+ }
1219
+ }, C = (S) => {
1220
+ for (let w = 0; w < S.changedTouches.length; w++) {
1221
+ const M = S.changedTouches[w];
1222
+ x.delete(M.identifier);
1223
+ }
1224
+ }, N = (S) => {
1225
+ const w = S.touches.length;
1226
+ if (w === 1) {
1227
+ if (!o)
1228
+ return;
1229
+ S.preventDefault();
1230
+ const M = S.touches[0], P = x.get(M.identifier);
1231
+ if (!P)
1232
+ throw new Error("touchStart is null");
1233
+ const V = M.clientX - P.clientX, d = M.clientY - P.clientY;
1234
+ f({
1235
+ x: V,
1236
+ y: d
1237
+ }), x.set(M.identifier, M);
1238
+ } else if (w === 2) {
1239
+ S.preventDefault();
1240
+ const [M, P] = S.touches, V = x.get(M.identifier), d = x.get(P.identifier);
1241
+ if (!V || !d)
1242
+ throw new Error("intialTouch1 or intialTouch2 is null");
1243
+ const I = Ze(
1244
+ V,
1245
+ d
1246
+ ), z = Ze(M, P) / I, { left: A, top: Z } = a.getBoundingClientRect();
1247
+ m(z - 1, {
1248
+ x: (M.clientX + P.clientX) / 2 - A,
1249
+ y: (M.clientY + P.clientY) / 2 - Z
1250
+ }), x.set(M.identifier, M), x.set(P.identifier, P);
1251
+ }
1252
+ };
1253
+ return s.addEventListener("touchstart", y), s.addEventListener("touchmove", N), s.addEventListener("touchend", C), s.addEventListener("touchcancel", C), () => {
1254
+ s.removeEventListener("touchstart", y), s.removeEventListener("touchmove", N), s.removeEventListener("touchend", C), s.removeEventListener("touchcancel", C);
1255
+ };
1256
+ }, [o, f, m]), /* @__PURE__ */ t(
1257
+ "div",
1258
+ {
1259
+ ref: c,
1260
+ className: `relative size-full overflow-hidden ${o ? "z-zoomed-image cursor-move" : ""}`,
1261
+ children: /* @__PURE__ */ t(
1262
+ "div",
1263
+ {
1264
+ ref: p,
1265
+ className: "origin-top-left",
1266
+ children: /* @__PURE__ */ t(
1267
+ ve,
1268
+ {
1269
+ ...n,
1270
+ imgInPlayerWidthRatio: e ? 1 : r
1271
+ }
1272
+ )
1273
+ }
1274
+ )
1275
+ }
1276
+ );
1277
+ }, ln = ({ hotspot: e }) => {
1278
+ const { title: n, icon: r, description: o, position: i, detail: c } = e, { getIconConfig: p } = be(), h = r ? p(r) : void 0, { extendMode: b, setShownDetails: k } = ne(), L = !!c, v = c?.type === "image", D = !!n || !!o, _ = v ? /* @__PURE__ */ t(ft, { className: "size-4" }) : /* @__PURE__ */ t("div", { className: "size-1" }), u = () => {
1279
+ v && k({
1280
+ src: c.src,
1281
+ title: n,
1282
+ text: o
1283
+ });
1284
+ };
1285
+ return /* @__PURE__ */ O(
1286
+ "div",
1287
+ {
1288
+ className: H(
1289
+ "group absolute z-hotspot -translate-x-1/2 -translate-y-1/2 hover:z-hotspot-hover",
1290
+ L ? "cursor-pointer" : "cursor-help"
1291
+ ),
1292
+ style: {
1293
+ top: `${100 * e.position.y}%`,
1294
+ left: `${100 * e.position.x}%`
1295
+ },
1296
+ onClick: u,
1297
+ children: [
1298
+ /* @__PURE__ */ O(
1299
+ "div",
1300
+ {
1301
+ className: "relative flex items-center justify-center rounded-full border-2 border-background bg-primary text-primary-foreground",
1302
+ children: [
1303
+ /* @__PURE__ */ t(
1304
+ "div",
1305
+ {
1306
+ className: "pointer-events-none absolute -z-20 size-8 animate-hotspot-ping rounded-full border-2 border-background"
1307
+ }
1308
+ ),
1309
+ /* @__PURE__ */ t("div", { className: "p-1", children: h?.Icon ? /* @__PURE__ */ t("div", { className: "size-4", children: h.Icon }) : _ })
1310
+ ]
1311
+ }
1312
+ ),
1313
+ !v && D && /* @__PURE__ */ t(
1314
+ "div",
1315
+ {
1316
+ className: H(
1317
+ "absolute -z-10 w-max max-w-40 text-pretty rounded-ui bg-background p-2 small:max-w-48",
1318
+ b && "large:max-w-56",
1319
+ i.y < 0.55 ? "-top-1" : "-bottom-1",
1320
+ i.x < 0.55 ? "-left-1 pl-6 small:pl-8" : "-right-1 pr-4 small:pr-6",
1321
+ "pointer-events-none opacity-0 transition-opacity duration-200 group-hover:pointer-events-auto group-hover:opacity-100"
1322
+ ),
1323
+ children: /* @__PURE__ */ O("div", { className: "space-y-1 text-pretty", children: [
1324
+ n && /* @__PURE__ */ t("div", { className: "text-sm font-semibold small:text-base small:font-bold", children: n }),
1325
+ o && /* @__PURE__ */ t("div", { className: "text-xs text-foreground/65 small:text-sm", children: o })
1326
+ ] })
1327
+ }
1328
+ )
1329
+ ]
1330
+ }
1331
+ );
1332
+ }, un = ({ hotspot: e }) => {
1333
+ const { detail: n } = e, r = /* @__PURE__ */ t(ln, { hotspot: e });
1334
+ switch (n?.type) {
1335
+ case "link":
1336
+ case "pdf":
1337
+ return /* @__PURE__ */ t("a", { href: n.src, target: "_blank", rel: "noreferrer", children: r });
1338
+ default:
1339
+ return r;
1340
+ }
1341
+ }, bt = ({
1342
+ hotspots: e,
1343
+ itemIndex: n,
1344
+ className: r,
1345
+ onLoad: o,
1346
+ ...i
1347
+ }) => {
1348
+ const { isShowingDetails: c, showHotspots: p, setItemInteraction: h } = ne();
1349
+ return /* @__PURE__ */ t("div", { className: H("relative size-full overflow-hidden", r), children: /* @__PURE__ */ O(
1350
+ "div",
1351
+ {
1352
+ className: H(
1353
+ "size-full duration-details",
1354
+ c ? "scale-105" : "scale-100"
1355
+ ),
1356
+ children: [
1357
+ /* @__PURE__ */ t(
1358
+ cn,
1359
+ {
1360
+ className: "size-full object-cover",
1361
+ onLoad: (b) => {
1362
+ n !== void 0 && h(n, "ready"), o?.(b);
1363
+ },
1364
+ ...i
1365
+ }
1366
+ ),
1367
+ p && e?.map((b, k) => /* @__PURE__ */ t(un, { hotspot: b }, k))
1368
+ ]
1369
+ }
1370
+ ) });
1371
+ }, dn = 750, mn = 1250, pn = 360, hn = 480, fn = ({
1372
+ images: e,
1373
+ onlyPreload: n
1374
+ }) => {
1375
+ const { demoSpin: r, reverse360: o } = ae(), { isShowingDetails: i, isZooming: c } = ne(), p = c || i, h = $(null), b = $(null), k = $(r), L = $(null), v = T(() => {
1376
+ L.current && (clearTimeout(L.current), L.current = null);
1377
+ }, []), D = $(null), _ = () => {
1378
+ D.current && (cancelAnimationFrame(D.current), D.current = null);
1379
+ }, [u, f] = j(0), l = e.length, g = T(() => {
1380
+ f((a) => (a - 1 + l) % l);
1381
+ }, [l]), m = T(() => {
1382
+ f((a) => (a + 1) % l);
1383
+ }, [l]);
1384
+ return W(() => {
1385
+ if (p) {
1386
+ v();
1387
+ return;
1388
+ }
1389
+ const a = h.current, s = b.current;
1390
+ if (!a || !s)
1391
+ return;
1392
+ k.current && (k.current = !1, L.current = setTimeout(() => {
1393
+ const X = Date.now(), Y = () => {
1394
+ const U = () => {
1395
+ const q = (Date.now() - X) / mn, Q = Math.round(((ie) => ie * (2 - ie))(q) * l), le = de(Q % l, 0, l - 1);
1396
+ f(le), !(Q >= l) && Y();
1397
+ };
1398
+ D.current = requestAnimationFrame(U);
1399
+ };
1400
+ Y();
1401
+ }, dn));
1402
+ const x = pn / l;
1403
+ let y = null, C = [];
1404
+ const N = (X) => {
1405
+ C.push(X), C.length > 20 && C.shift();
1406
+ }, S = () => {
1407
+ const X = (() => {
1408
+ const ue = Date.now(), Q = C.filter(
1409
+ (ce) => ue - ce.timestamp < 50
1410
+ );
1411
+ if (Q.length < 2)
1412
+ return 0;
1413
+ const le = Q[0], ie = Q[Q.length - 1];
1414
+ return (ie.value - le.value) / (1e-3 * Math.max(ie.timestamp - le.timestamp, 1));
1415
+ })(), Y = Date.now();
1416
+ let U = 0, re = Y;
1417
+ const q = () => {
1418
+ const ue = () => {
1419
+ const Q = Date.now(), le = (Q - Y) / 1e3, ie = Math.pow(0.05, le), ce = X * ie, xe = (Q - re) / 1e3;
1420
+ if (U += ce * xe, Math.abs(ce) < 5 * x && Math.abs(U) < x) {
1421
+ D.current = null;
1422
+ return;
1423
+ }
1424
+ Math.abs(U) >= x && (U > 0 !== o ? m() : g(), U = 0), re = Q, q();
1425
+ };
1426
+ D.current = requestAnimationFrame(ue);
1427
+ };
1428
+ q();
1429
+ }, w = () => {
1430
+ v(), _();
1431
+ }, M = (X) => {
1432
+ if (X.button !== 0)
1433
+ return;
1434
+ X.preventDefault(), X.stopPropagation(), w();
1435
+ const Y = X.clientX;
1436
+ y = Y, C = [{ timestamp: Date.now(), value: Y }];
1437
+ }, P = (X) => {
1438
+ if (y === null)
1439
+ return;
1440
+ X.stopPropagation();
1441
+ const { clientX: Y } = X;
1442
+ N({ timestamp: Date.now(), value: Y });
1443
+ const U = Y - y;
1444
+ Math.abs(U) < x || (U > 0 !== o ? m() : g(), y = Y);
1445
+ }, V = () => {
1446
+ y !== null && (y = null, S());
1447
+ };
1448
+ a.addEventListener("mousedown", M), document.addEventListener("mousemove", P), document.addEventListener("mouseleave", V), document.addEventListener("mouseup", V), document.addEventListener("contextmenu", V);
1449
+ const d = hn / l, I = () => s.getBoundingClientRect().width, E = () => s.scrollWidth / 2 - I() / 2, z = () => {
1450
+ const X = E();
1451
+ s.scrollLeft = X;
1452
+ };
1453
+ z();
1454
+ const A = () => {
1455
+ const X = s.scrollLeft - E();
1456
+ Math.abs(X) < d || (X < 0 !== o ? m() : g(), z());
1457
+ };
1458
+ s.addEventListener("scroll", A);
1459
+ let Z = null;
1460
+ const F = (X) => {
1461
+ if (Z !== null || X.changedTouches.length !== 1)
1462
+ return;
1463
+ w();
1464
+ const { identifier: Y, clientX: U } = X.changedTouches[0];
1465
+ Z = Y, y = U, C = [{ timestamp: Date.now(), value: U }];
1466
+ }, B = (X) => {
1467
+ if (!y)
1468
+ return;
1469
+ const Y = Array.from(X.changedTouches).find(
1470
+ ({ identifier: q }) => q === Z
1471
+ );
1472
+ if (!Y)
1473
+ return;
1474
+ X.preventDefault();
1475
+ const { clientX: U } = Y;
1476
+ N({ timestamp: Date.now(), value: U });
1477
+ const re = U - y;
1478
+ Math.abs(re) < x || (re > 0 !== o ? m() : g(), y = U);
1479
+ }, G = (X) => {
1480
+ !y || !Array.from(X.changedTouches).some(
1481
+ ({ identifier: U }) => U === Z
1482
+ ) || (Z = null, y = null, S());
1483
+ };
1484
+ return s.addEventListener("touchstart", F), s.addEventListener("touchmove", B), s.addEventListener("touchend", G), s.addEventListener("touchcancel", G), () => {
1485
+ a.removeEventListener("mousedown", M), document.removeEventListener("mousemove", P), document.removeEventListener("mouseleave", V), document.removeEventListener("mouseup", V), document.removeEventListener("contextmenu", V), s.removeEventListener("scroll", A), s.removeEventListener("touchstart", F), s.removeEventListener("touchmove", B), s.removeEventListener("touchend", G), s.removeEventListener("touchcancel", G);
1486
+ };
1487
+ }, [
1488
+ v,
1489
+ m,
1490
+ g,
1491
+ p,
1492
+ o,
1493
+ l
1494
+ ]), /* @__PURE__ */ t("div", { ref: h, className: "cursor-ew-resize", children: /* @__PURE__ */ O("div", { ref: b, className: "overflow-x-scroll no-scrollbar", children: [
1495
+ /* @__PURE__ */ O("div", { className: "sticky left-0 top-0", children: [
1496
+ e.map((a) => /* @__PURE__ */ t(
1497
+ ve,
1498
+ {
1499
+ src: a.src,
1500
+ className: "pointer-events-none !absolute left-0 top-0 -z-10"
1501
+ },
1502
+ a.src
1503
+ )),
1504
+ /* @__PURE__ */ t(bt, { ...e[u], onlyPreload: n })
1505
+ ] }),
1506
+ /* @__PURE__ */ t("div", { className: "pointer-events-none -mt-px h-px w-[calc(100%+1024px)]" })
1507
+ ] }) });
1508
+ }, gn = ({ images: e, onPlaceholderImageLoaded: n, onSpinImagesLoaded: r, onError: o }) => {
1509
+ const { autoLoad360: i } = ae(), c = se(() => e.map(({ src: v }) => v), [e]), [p, h] = j(null), b = p ? [...p.values()].filter((v) => v).length / e.length * 100 : null, k = T(() => {
1510
+ b === null && h(new Map(c.map((v) => [v, !1])));
1511
+ }, [c, b]), L = T((v) => {
1512
+ h((D) => {
1513
+ const _ = new Map(D);
1514
+ return _.set(v, !0), _;
1515
+ });
1516
+ }, []);
1517
+ return W(() => {
1518
+ i && k();
1519
+ }, [i, k]), W(() => {
1520
+ b === 100 && r();
1521
+ }, [b, r]), /* @__PURE__ */ O("div", { className: "relative size-full", children: [
1522
+ b !== null && b !== 100 && // Add images to DOM to preload them
1523
+ /* @__PURE__ */ t("div", { className: "hidden", children: c.map((v) => /* @__PURE__ */ t(
1524
+ ve,
1525
+ {
1526
+ src: v,
1527
+ onLoad: () => L(v),
1528
+ onError: o
1529
+ },
1530
+ v
1531
+ )) }),
1532
+ /* @__PURE__ */ t(
1533
+ ve,
1534
+ {
1535
+ className: "size-full",
1536
+ src: c[0],
1537
+ onLoad: n
1538
+ }
1539
+ ),
1540
+ /* @__PURE__ */ O("div", { className: "absolute inset-0 flex flex-col items-center justify-center gap-y-4 bg-foreground/35", children: [
1541
+ /* @__PURE__ */ t(gt, { className: "size-20 text-primary-light" }),
1542
+ /* @__PURE__ */ t(oe, { color: "neutral", shape: "icon", onClick: k, children: /* @__PURE__ */ t(Ae, { className: "size-full" }) }),
1543
+ /* @__PURE__ */ t(
1544
+ "div",
1545
+ {
1546
+ className: H(
1547
+ "relative h-1 w-3/5 overflow-hidden rounded-full bg-background",
1548
+ b === null && "invisible"
1549
+ ),
1550
+ children: /* @__PURE__ */ t(
1551
+ "div",
1552
+ {
1553
+ className: "h-full bg-primary transition-[width]",
1554
+ style: { width: `${b ?? 0}%` }
1555
+ }
1556
+ )
1557
+ }
1558
+ )
1559
+ ] })
1560
+ ] });
1561
+ }, wn = (e) => {
1562
+ const { itemIndex: n } = e, { setItemInteraction: r } = ne(), [o, i] = j();
1563
+ return W(() => {
1564
+ o === null || o === "error" || r(n, o === "spin" ? "running" : "ready");
1565
+ }, [n, r, o]), o === "error" ? /* @__PURE__ */ t(
1566
+ pt,
1567
+ {
1568
+ className: "text-background",
1569
+ text: "Spin could not be loaded"
1570
+ }
1571
+ ) : o !== "spin" ? /* @__PURE__ */ t(
1572
+ gn,
1573
+ {
1574
+ ...e,
1575
+ onPlaceholderImageLoaded: () => i((c) => c === null ? "placeholder" : c),
1576
+ onSpinImagesLoaded: () => i("spin"),
1577
+ onError: () => i("error")
1578
+ }
1579
+ ) : /* @__PURE__ */ t(fn, { ...e });
1580
+ }, vn = (e) => /* @__PURE__ */ t(oe, { color: "neutral", shape: "icon", ...e, children: /* @__PURE__ */ t(Ae, { className: "size-full" }) }), xn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_PAUSE", children: /* @__PURE__ */ t(
1581
+ "svg",
1582
+ {
1583
+ className: e,
1584
+ width: "16",
1585
+ height: "16",
1586
+ viewBox: "0 0 16 16",
1587
+ fill: "none",
1588
+ xmlns: "http://www.w3.org/2000/svg",
1589
+ children: /* @__PURE__ */ t(
1590
+ "path",
1591
+ {
1592
+ d: "M4 12.6667H6.66667V3.33333H4V12.6667ZM9.33333 3.33333V12.6667H12V3.33333H9.33333Z",
1593
+ fill: "currentColor"
1594
+ }
1595
+ )
1596
+ }
1597
+ ) }), bn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_VOLUME", children: /* @__PURE__ */ t(
1598
+ "svg",
1599
+ {
1600
+ className: e,
1601
+ width: "16",
1602
+ height: "16",
1603
+ viewBox: "0 0 16 16",
1604
+ fill: "none",
1605
+ xmlns: "http://www.w3.org/2000/svg",
1606
+ children: /* @__PURE__ */ t(
1607
+ "path",
1608
+ {
1609
+ d: "M2 6V10H4.66667L8 13.3333V2.66667L4.66667 6H2ZM11 8C11 6.82 10.32 5.80667 9.33333 5.31334V10.68C10.32 10.1933 11 9.18 11 8ZM9.33333 2.15334V3.52667C11.26 4.1 12.6667 5.88667 12.6667 8C12.6667 10.1133 11.26 11.9 9.33333 12.4733V13.8467C12.0067 13.24 14 10.8533 14 8C14 5.14667 12.0067 2.76 9.33333 2.15334Z",
1610
+ fill: "currentColor"
1611
+ }
1612
+ )
1613
+ }
1614
+ ) }), yn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_VOLUME_OFF", children: /* @__PURE__ */ t(
1615
+ "svg",
1616
+ {
1617
+ className: e,
1618
+ width: "16",
1619
+ height: "16",
1620
+ viewBox: "0 0 16 16",
1621
+ fill: "none",
1622
+ xmlns: "http://www.w3.org/2000/svg",
1623
+ children: /* @__PURE__ */ t(
1624
+ "path",
1625
+ {
1626
+ d: "M11 8C11 6.82 10.32 5.80667 9.33333 5.31333V6.78667L10.9667 8.42C10.9867 8.28667 11 8.14667 11 8ZM12.6667 8C12.6667 8.62667 12.5333 9.21333 12.3067 9.76L13.3133 10.7667C13.7533 9.94 14 9 14 8C14 5.14667 12.0067 2.76 9.33333 2.15333V3.52667C11.26 4.1 12.6667 5.88667 12.6667 8ZM2.84667 2L2 2.84667L5.15333 6H2V10H4.66667L8 13.3333V8.84667L10.8333 11.68C10.3867 12.0267 9.88667 12.3 9.33333 12.4667V13.84C10.2533 13.6333 11.0867 13.2067 11.7933 12.6333L13.1533 14L14 13.1533L2.84667 2ZM8 2.66667L6.60667 4.06L8 5.45333V2.66667Z",
1627
+ fill: "currentColor"
1628
+ }
1629
+ )
1630
+ }
1631
+ ) }), Fe = ({ progress: e }) => /* @__PURE__ */ t("div", { className: "h-1 w-full overflow-hidden rounded-ui-sm bg-background/25", children: /* @__PURE__ */ t(
1632
+ "div",
1633
+ {
1634
+ className: "size-full rounded-ui-sm bg-background transition-transform",
1635
+ style: { transform: `translateX(-${100 * (1 - e)}%)` }
1636
+ }
1637
+ ) }), Cn = 3e3, En = ({ src: e, poster: n, itemIndex: r }) => {
1638
+ const { carrouselItemIndex: o, setItemInteraction: i } = ne(), c = $(null), p = $(null), h = T(() => {
1639
+ if (!p.current)
1640
+ throw new Error("videoRef.current is null");
1641
+ return p.current;
1642
+ }, []);
1643
+ W(() => {
1644
+ i(r, "ready");
1645
+ }, [r, i]);
1646
+ const b = T(() => {
1647
+ h().play();
1648
+ }, [h]), k = T(() => {
1649
+ h().pause();
1650
+ }, [h]);
1651
+ W(() => {
1652
+ o === r || k();
1653
+ }, [o, r, k]);
1654
+ const [L, v] = j(!1), [D, _] = j(!0), u = () => {
1655
+ v(!0), i(r, "running");
1656
+ }, f = () => {
1657
+ v(!1), i(r, "ready");
1658
+ }, l = () => {
1659
+ _(!1);
1660
+ }, g = () => {
1661
+ _(!0);
1662
+ }, [m, a] = j(null), s = (E) => {
1663
+ const z = h(), A = E.currentTarget.getBoundingClientRect(), F = (E.clientX - A.left) / A.width, B = Math.min(1, Math.max(0, F));
1664
+ z.volume = B, z.muted = !1;
1665
+ }, x = (E) => {
1666
+ const z = h();
1667
+ z.muted = E;
1668
+ };
1669
+ W(() => {
1670
+ const E = p.current;
1671
+ if (!E)
1672
+ return;
1673
+ const z = () => {
1674
+ a({
1675
+ volume: E.volume,
1676
+ isMuted: E.muted
1677
+ });
1678
+ };
1679
+ return z(), E.addEventListener("volumechange", z), () => {
1680
+ E.removeEventListener("volumechange", z);
1681
+ };
1682
+ }, []);
1683
+ const [y, C] = j(null), N = y ? y.currentTime / y.duration : 0;
1684
+ W(() => {
1685
+ const E = p.current;
1686
+ if (!E) return;
1687
+ const z = () => {
1688
+ const A = E.currentTime, Z = E.duration;
1689
+ isNaN(A) || isNaN(Z) || C({
1690
+ currentTime: A,
1691
+ duration: Z
1692
+ });
1693
+ };
1694
+ return z(), E.addEventListener("timeupdate", z), () => {
1695
+ E.removeEventListener("timeupdate", z);
1696
+ };
1697
+ }, []);
1698
+ const S = (E) => {
1699
+ const z = h(), A = E.currentTarget.getBoundingClientRect(), F = (E.clientX - A.left) / A.width, B = z.duration * F;
1700
+ z.currentTime = B;
1701
+ }, w = (E) => {
1702
+ const z = Math.floor(E % 3600 / 60), A = Math.floor(E % 60);
1703
+ return `${z}:${A.toString().padStart(2, "0")}`;
1704
+ }, [M, P] = j(!1), V = $(void 0), d = T(
1705
+ () => clearTimeout(V.current),
1706
+ []
1707
+ ), I = T(() => {
1708
+ d(), V.current = setTimeout(() => {
1709
+ P(!1);
1710
+ }, Cn);
1711
+ }, [d]);
1712
+ return W(() => {
1713
+ const E = c.current, z = p.current;
1714
+ if (!E || !z)
1715
+ return;
1716
+ const A = () => {
1717
+ I(), P(!0);
1718
+ }, Z = () => {
1719
+ d(), P(!1);
1720
+ };
1721
+ let F = !1;
1722
+ const B = () => {
1723
+ F = !0;
1724
+ }, G = () => {
1725
+ F && (F = !1, k());
1726
+ }, X = () => {
1727
+ F = !1, A();
1728
+ }, Y = (U) => {
1729
+ U.preventDefault(), U.touches.length === 1 && (I(), P((q) => !q));
1730
+ };
1731
+ return E.addEventListener("mousedown", B), E.addEventListener("mouseup", G), E.addEventListener("mouseenter", A), E.addEventListener("mousemove", X), E.addEventListener("mouseleave", Z), z.addEventListener("touchstart", Y), () => {
1732
+ E.removeEventListener("mousedown", B), E.removeEventListener("mouseup", G), E.removeEventListener("mouseenter", A), E.removeEventListener("mousemove", A), E.removeEventListener("mouseleave", Z), z.removeEventListener("touchstart", Y);
1733
+ };
1734
+ }, [d, k, I]), /* @__PURE__ */ O("div", { ref: c, className: "relative size-full", children: [
1735
+ /* @__PURE__ */ t(
1736
+ "video",
1737
+ {
1738
+ ref: p,
1739
+ className: "size-full",
1740
+ src: e,
1741
+ poster: n,
1742
+ disablePictureInPicture: !0,
1743
+ playsInline: !0,
1744
+ onPlay: u,
1745
+ onPause: f,
1746
+ onEnded: f,
1747
+ onCanPlay: l,
1748
+ onWaiting: g
1749
+ }
1750
+ ),
1751
+ L ? /* @__PURE__ */ O(pe, { children: [
1752
+ /* @__PURE__ */ O(
1753
+ "div",
1754
+ {
1755
+ className: H(
1756
+ "absolute inset-x-0 bottom-0 cursor-auto space-y-2 bg-gradient-to-t from-foreground to-transparent p-4 pr-12 pt-8 transition-opacity duration-300",
1757
+ M ? "pointer-events-auto opacity-100" : "pointer-events-none opacity-0"
1758
+ ),
1759
+ onMouseDownCapture: (E) => E.stopPropagation(),
1760
+ children: [
1761
+ /* @__PURE__ */ O("div", { className: "flex items-center justify-between text-background", children: [
1762
+ /* @__PURE__ */ O(
1763
+ "div",
1764
+ {
1765
+ className: "flex items-center gap-x-4",
1766
+ children: [
1767
+ /* @__PURE__ */ t(
1768
+ oe,
1769
+ {
1770
+ shape: "icon",
1771
+ variant: "ghost",
1772
+ color: "neutral",
1773
+ onClick: k,
1774
+ children: /* @__PURE__ */ t(xn, { className: "size-full" })
1775
+ }
1776
+ ),
1777
+ y && /* @__PURE__ */ O("span", { className: "text-sm", children: [
1778
+ w(y.currentTime),
1779
+ " /",
1780
+ " ",
1781
+ w(y.duration)
1782
+ ] })
1783
+ ]
1784
+ }
1785
+ ),
1786
+ m && /* @__PURE__ */ O(
1787
+ "div",
1788
+ {
1789
+ className: "group/volume flex items-center gap-x-4 rounded-ui-md p-2 transition-colors hover:bg-foreground/25",
1790
+ children: [
1791
+ /* @__PURE__ */ t(
1792
+ "div",
1793
+ {
1794
+ className: `w-12 cursor-pointer py-1 opacity-0 transition-opacity ${m.isMuted ? "group-hover/volume:opacity-50" : "group-hover/volume:opacity-100"}`,
1795
+ onClick: s,
1796
+ children: /* @__PURE__ */ t(Fe, { progress: m.volume })
1797
+ }
1798
+ ),
1799
+ /* @__PURE__ */ t(
1800
+ "div",
1801
+ {
1802
+ className: "size-5 cursor-pointer",
1803
+ onClick: () => x(!m.isMuted),
1804
+ children: m.isMuted ? /* @__PURE__ */ t(yn, { className: "size-full" }) : /* @__PURE__ */ t(bn, { className: "size-full" })
1805
+ }
1806
+ )
1807
+ ]
1808
+ }
1809
+ )
1810
+ ] }),
1811
+ /* @__PURE__ */ t(
1812
+ "div",
1813
+ {
1814
+ className: "cursor-pointer py-1",
1815
+ onClick: S,
1816
+ children: /* @__PURE__ */ t(Fe, { progress: N })
1817
+ }
1818
+ )
1819
+ ]
1820
+ }
1821
+ ),
1822
+ D && /* @__PURE__ */ t(
1823
+ "div",
1824
+ {
1825
+ className: "pointer-events-none absolute inset-0 flex items-center justify-center bg-foreground/25",
1826
+ children: /* @__PURE__ */ t(ht, { size: "lg", color: "background" })
1827
+ }
1828
+ )
1829
+ ] }) : /* @__PURE__ */ t(
1830
+ "div",
1831
+ {
1832
+ className: "absolute inset-0 flex items-center justify-center bg-foreground/25",
1833
+ children: /* @__PURE__ */ t(vn, { onClick: b })
1834
+ }
1835
+ )
1836
+ ] });
1837
+ }, kn = ({ index: e, item: n, isShown: r }) => {
1838
+ const { type: o } = n;
1839
+ let i;
1840
+ switch (o) {
1841
+ case "image":
1842
+ i = /* @__PURE__ */ t(bt, { itemIndex: e, onlyPreload: !r, ...n });
1843
+ break;
1844
+ case "video":
1845
+ i = /* @__PURE__ */ t(En, { itemIndex: e, ...n });
1846
+ break;
1847
+ case "360":
1848
+ i = /* @__PURE__ */ t(wn, { itemIndex: e, onlyPreload: !r, ...n });
1849
+ break;
1850
+ case "custom":
1851
+ i = /* @__PURE__ */ t(an, { itemIndex: e, ...n });
1852
+ }
1853
+ return i = /* @__PURE__ */ t("div", { className: "-ml-px h-full w-[calc(100%+2px)]", children: i }), i;
1854
+ }, Ln = (e) => {
1855
+ W(() => {
1856
+ const n = (r) => {
1857
+ r.key === "Escape" && e();
1858
+ };
1859
+ return addEventListener("keydown", n), () => {
1860
+ removeEventListener("keydown", n);
1861
+ };
1862
+ }, [e]);
1863
+ };
1864
+ function In(e) {
1865
+ return e.target === e.currentTarget;
1866
+ }
1867
+ const Mn = ({ currentIndex: e, maxIndex: n }) => /* @__PURE__ */ O("div", { className: "space-x-0.5 rounded-ui bg-foreground/40 px-1.5 py-0.5 text-xs text-background/75 transition-radius small:space-x-1 small:px-2 small:py-1 small:text-sm", children: [
1868
+ /* @__PURE__ */ t("span", { children: e + 1 }),
1869
+ /* @__PURE__ */ t("span", { children: "/" }),
1870
+ /* @__PURE__ */ t("span", { children: n + 1 })
1871
+ ] }), Ye = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_ARROW_RIGHT", children: /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t(
1872
+ "path",
1873
+ {
1874
+ d: "M4.07666 13.4868L5.25666 14.6668L11.9233 8.00016L5.25666 1.3335L4.07666 2.5135L9.56333 8.00016L4.07666 13.4868Z",
1875
+ fill: "currentColor"
1876
+ }
1877
+ ) }) }), Tn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_EXTEND", children: /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t(
1878
+ "path",
1879
+ {
1880
+ d: "M4.66683 9.3335H3.3335V12.6668H6.66683V11.3335H4.66683V9.3335ZM3.3335 6.66683H4.66683V4.66683H6.66683V3.3335H3.3335V6.66683ZM11.3335 11.3335H9.3335V12.6668H12.6668V9.3335H11.3335V11.3335ZM9.3335 3.3335V4.66683H11.3335V6.66683H12.6668V3.3335H9.3335Z",
1881
+ fill: "currentColor"
1882
+ }
1883
+ ) }) }), Nn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_GALLERY", children: /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t(
1884
+ "path",
1885
+ {
1886
+ d: "M13.3334 2.66683V10.6668H5.33337V2.66683H13.3334ZM13.3334 1.3335H5.33337C4.60004 1.3335 4.00004 1.9335 4.00004 2.66683V10.6668C4.00004 11.4002 4.60004 12.0002 5.33337 12.0002H13.3334C14.0667 12.0002 14.6667 11.4002 14.6667 10.6668V2.66683C14.6667 1.9335 14.0667 1.3335 13.3334 1.3335ZM7.66671 7.78016L8.79337 9.28683L10.4467 7.22016L12.6667 10.0002H6.00004L7.66671 7.78016ZM1.33337 4.00016V13.3335C1.33337 14.0668 1.93337 14.6668 2.66671 14.6668H12V13.3335H2.66671V4.00016H1.33337Z",
1887
+ fill: "currentColor"
1888
+ }
1889
+ ) }) }), Sn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_HOTSPOTS", children: /* @__PURE__ */ O(
1890
+ "svg",
1891
+ {
1892
+ className: e,
1893
+ width: "12",
1894
+ height: "12",
1895
+ viewBox: "0 0 12 12",
1896
+ fill: "none",
1897
+ xmlns: "http://www.w3.org/2000/svg",
1898
+ children: [
1899
+ /* @__PURE__ */ t("g", { clipPath: "url(#clip0_418_982)", children: /* @__PURE__ */ t(
1900
+ "path",
1901
+ {
1902
+ d: "M6 4C4.895 4 4 4.895 4 6C4 7.105 4.895 8 6 8C7.105 8 8 7.105 8 6C8 4.895 7.105 4 6 4ZM10.47 5.5C10.24 3.415 8.585 1.76 6.5 1.53V0.5H5.5V1.53C3.415 1.76 1.76 3.415 1.53 5.5H0.5V6.5H1.53C1.76 8.585 3.415 10.24 5.5 10.47V11.5H6.5V10.47C8.585 10.24 10.24 8.585 10.47 6.5H11.5V5.5H10.47ZM6 9.5C4.065 9.5 2.5 7.935 2.5 6C2.5 4.065 4.065 2.5 6 2.5C7.935 2.5 9.5 4.065 9.5 6C9.5 7.935 7.935 9.5 6 9.5Z",
1903
+ fill: "currentColor"
1904
+ }
1905
+ ) }),
1906
+ /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: "clip0_418_982", children: /* @__PURE__ */ t("rect", { width: "12", height: "12", fill: "white" }) }) })
1907
+ ]
1908
+ }
1909
+ ) }), zn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_MINUS", children: /* @__PURE__ */ t(
1910
+ "svg",
1911
+ {
1912
+ className: e,
1913
+ width: "16",
1914
+ height: "16",
1915
+ viewBox: "0 0 16 16",
1916
+ fill: "none",
1917
+ xmlns: "http://www.w3.org/2000/svg",
1918
+ children: /* @__PURE__ */ t(
1919
+ "path",
1920
+ {
1921
+ d: "M12.6666 8.66634H3.33325V7.33301H12.6666V8.66634Z",
1922
+ fill: "currentColor"
1923
+ }
1924
+ )
1925
+ }
1926
+ ) }), _n = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_PLUS", children: /* @__PURE__ */ t(
1927
+ "svg",
1928
+ {
1929
+ className: e,
1930
+ width: "16",
1931
+ height: "16",
1932
+ viewBox: "0 0 16 16",
1933
+ fill: "none",
1934
+ xmlns: "http://www.w3.org/2000/svg",
1935
+ children: /* @__PURE__ */ t(
1936
+ "path",
1937
+ {
1938
+ d: "M12.6666 8.66634H8.66659V12.6663H7.33325V8.66634H3.33325V7.33301H7.33325V3.33301H8.66659V7.33301H12.6666V8.66634Z",
1939
+ fill: "currentColor"
1940
+ }
1941
+ )
1942
+ }
1943
+ ) }), Vn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_REDUCE", children: /* @__PURE__ */ t("svg", { className: e, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ t(
1944
+ "path",
1945
+ {
1946
+ d: "M3.33325 10.6668H5.33325V12.6668H6.66659V9.3335H3.33325V10.6668ZM5.33325 5.3335H3.33325V6.66683H6.66659V3.3335H5.33325V5.3335ZM9.33325 12.6668H10.6666V10.6668H12.6666V9.3335H9.33325V12.6668ZM10.6666 5.3335V3.3335H9.33325V6.66683H12.6666V5.3335H10.6666Z",
1947
+ fill: "currentColor"
1948
+ }
1949
+ ) }) }), Pn = ({
1950
+ enabled: e,
1951
+ onToggle: n,
1952
+ label: r,
1953
+ className: o,
1954
+ children: i
1955
+ }) => /* @__PURE__ */ O(
1956
+ "label",
1957
+ {
1958
+ className: H(
1959
+ "flex cursor-pointer items-center justify-center gap-x-2",
1960
+ o
1961
+ ),
1962
+ children: [
1963
+ /* @__PURE__ */ t(
1964
+ "input",
1965
+ {
1966
+ type: "checkbox",
1967
+ className: "sr-only",
1968
+ checked: e,
1969
+ onChange: n
1970
+ }
1971
+ ),
1972
+ r && /* @__PURE__ */ t("div", { className: "text-xs text-background", children: r }),
1973
+ /* @__PURE__ */ t(
1974
+ "div",
1975
+ {
1976
+ className: H(
1977
+ "flex h-5 w-8 items-center justify-center rounded-full transition-colors",
1978
+ e ? "bg-primary" : "bg-background/60"
1979
+ ),
1980
+ children: /* @__PURE__ */ t(
1981
+ "div",
1982
+ {
1983
+ className: H(
1984
+ "flex size-4 items-center justify-center rounded-full p-0.5 transition",
1985
+ e ? "translate-x-1.5 bg-primary-foreground text-primary" : "-translate-x-1.5 bg-background text-foreground"
1986
+ ),
1987
+ children: i
1988
+ }
1989
+ )
1990
+ }
1991
+ )
1992
+ ]
1993
+ }
1994
+ ), Dn = ({ className: e }) => /* @__PURE__ */ t(J, { className: e, customizationKey: "UI_BURGER", children: /* @__PURE__ */ t(
1995
+ "svg",
1996
+ {
1997
+ className: e,
1998
+ width: "16",
1999
+ height: "16",
2000
+ viewBox: "0 0 16 16",
2001
+ fill: "none",
2002
+ xmlns: "http://www.w3.org/2000/svg",
2003
+ children: /* @__PURE__ */ t(
2004
+ "path",
2005
+ {
2006
+ d: "M2 12H14V10.6667H2V12ZM2 8.66667H14V7.33333H2V8.66667ZM2 4V5.33333H14V4H2Z",
2007
+ fill: "currentColor"
2008
+ }
2009
+ )
2010
+ }
2011
+ ) }), An = ({ sharedClassName: e }) => {
2012
+ const { categories: n } = me(), { displayedCategoryId: r, changeCategory: o } = ne(), [i, c] = j(!1), p = () => {
2013
+ c(!i);
2014
+ }, h = () => {
2015
+ c(!1);
2016
+ };
2017
+ return /* @__PURE__ */ O(pe, { children: [
2018
+ i && /* @__PURE__ */ t(
2019
+ "div",
2020
+ {
2021
+ className: H(e, "inset-0 small:hidden"),
2022
+ onClick: h
2023
+ }
2024
+ ),
2025
+ /* @__PURE__ */ O(
2026
+ "div",
2027
+ {
2028
+ className: H(
2029
+ e,
2030
+ we("top-left"),
2031
+ "flex gap-x-2 small:hidden"
2032
+ ),
2033
+ children: [
2034
+ /* @__PURE__ */ t(
2035
+ oe,
2036
+ {
2037
+ shape: "icon",
2038
+ color: i ? "primary" : "neutral",
2039
+ onClick: p,
2040
+ children: /* @__PURE__ */ t(Dn, {})
2041
+ }
2042
+ ),
2043
+ i && /* @__PURE__ */ t("div", { className: "rounded-ui-md bg-background transition-radius", children: /* @__PURE__ */ t("ul", { className: "space-y-0.5 p-1", children: n.map(({ id: b, title: k }) => /* @__PURE__ */ t(
2044
+ "li",
2045
+ {
2046
+ className: H(
2047
+ "cursor-pointer rounded-ui px-2 py-1 text-sm font-bold transition-all hover:bg-primary/30",
2048
+ b === r && "bg-primary/50"
2049
+ ),
2050
+ onClick: () => {
2051
+ o(b), c(!1);
2052
+ },
2053
+ children: k
2054
+ },
2055
+ b
2056
+ )) }) })
2057
+ ]
2058
+ }
2059
+ ),
2060
+ /* @__PURE__ */ t(
2061
+ "div",
2062
+ {
2063
+ className: H(
2064
+ e,
2065
+ dt("top"),
2066
+ "w-full overflow-x-auto max-small:hidden"
2067
+ ),
2068
+ children: /* @__PURE__ */ t("div", { className: "mx-auto flex w-fit gap-x-1 rounded-ui-md bg-background p-1 shadow", children: n.map(({ id: b, title: k }) => /* @__PURE__ */ t(
2069
+ oe,
2070
+ {
2071
+ variant: b === r ? "fill" : "ghost",
2072
+ onClick: () => o(b),
2073
+ children: k
2074
+ },
2075
+ b
2076
+ )) })
2077
+ }
2078
+ )
2079
+ ] });
2080
+ }, Hn = () => {
2081
+ const {
2082
+ hideCategoriesNav: e,
2083
+ infiniteCarrousel: n,
2084
+ permanentGallery: r,
2085
+ extendBehavior: o
2086
+ } = ae(), {
2087
+ aspectRatioStyle: i,
2088
+ categories: { length: c }
2089
+ } = me(), {
2090
+ items: { length: p },
2091
+ slidable: h,
2092
+ carrouselItemIndex: b,
2093
+ masterItemIndex: k,
2094
+ prevItem: L,
2095
+ nextItem: v,
2096
+ showGalleryControls: D,
2097
+ enableHotspotsControl: _,
2098
+ showHotspots: u,
2099
+ toggleHotspots: f,
2100
+ showGallery: l,
2101
+ toggleGallery: g,
2102
+ extendMode: m,
2103
+ toggleExtendMode: a,
2104
+ shownDetails: s,
2105
+ isShowingDetails: x,
2106
+ resetShownDetails: y,
2107
+ showZoomControls: C,
2108
+ isZooming: N,
2109
+ canZoomIn: S,
2110
+ zoomIn: w,
2111
+ canZoomOut: M,
2112
+ zoomOut: P,
2113
+ resetView: V
2114
+ } = ne(), d = T(
2115
+ (E) => {
2116
+ In(E) && y();
2117
+ },
2118
+ [y]
2119
+ );
2120
+ Ln(y);
2121
+ const I = "absolute z-overlay";
2122
+ return /* @__PURE__ */ O(pe, { children: [
2123
+ !e && c > 1 && /* @__PURE__ */ t(
2124
+ An,
2125
+ {
2126
+ sharedClassName: H(
2127
+ I,
2128
+ "transition-opacity",
2129
+ N ? "!pointer-events-none opacity-0" : "opacity-100"
2130
+ )
2131
+ }
2132
+ ),
2133
+ h && !N && /* @__PURE__ */ t("div", { className: H(I, we("top-right")), children: /* @__PURE__ */ t(
2134
+ Mn,
2135
+ {
2136
+ currentIndex: b,
2137
+ maxIndex: p - 1
2138
+ }
2139
+ ) }),
2140
+ h && /* @__PURE__ */ O(pe, { children: [
2141
+ /* @__PURE__ */ t(
2142
+ oe,
2143
+ {
2144
+ shape: "icon",
2145
+ color: "neutral",
2146
+ className: H(
2147
+ I,
2148
+ we("middle-left"),
2149
+ N ? "!pointer-events-none opacity-0" : "opacity-100"
2150
+ ),
2151
+ onClick: L,
2152
+ disabled: !n && k <= 0,
2153
+ children: /* @__PURE__ */ t(J, { customizationKey: "CONTROLS_PREV", children: /* @__PURE__ */ t(Ye, { className: "size-full -scale-x-100" }) })
2154
+ }
2155
+ ),
2156
+ /* @__PURE__ */ t(
2157
+ oe,
2158
+ {
2159
+ shape: "icon",
2160
+ color: "neutral",
2161
+ className: H(
2162
+ I,
2163
+ we("middle-right"),
2164
+ N ? "!pointer-events-none opacity-0" : "opacity-100"
2165
+ ),
2166
+ onClick: v,
2167
+ disabled: !n && k >= p - 1,
2168
+ children: /* @__PURE__ */ t(J, { customizationKey: "CONTROLS_NEXT", children: /* @__PURE__ */ t(Ye, { className: "size-full" }) })
2169
+ }
2170
+ )
2171
+ ] }),
2172
+ /* @__PURE__ */ O(
2173
+ "div",
2174
+ {
2175
+ className: H(
2176
+ I,
2177
+ we("bottom-fullW"),
2178
+ "pointer-events-none grid grid-cols-[auto,1fr,auto] items-end *:pointer-events-auto small:gap-x-2"
2179
+ ),
2180
+ children: [
2181
+ !r && h && /* @__PURE__ */ O(pe, { children: [
2182
+ /* @__PURE__ */ t(
2183
+ oe,
2184
+ {
2185
+ className: D && !N ? "opacity-100" : "!pointer-events-none opacity-0",
2186
+ variant: "fill",
2187
+ color: l ? "primary" : "neutral",
2188
+ shape: "icon",
2189
+ onClick: g,
2190
+ children: /* @__PURE__ */ t(Nn, { className: "size-full" })
2191
+ }
2192
+ ),
2193
+ l && /* @__PURE__ */ t(
2194
+ vt,
2195
+ {
2196
+ className: H(
2197
+ "transition-opacity",
2198
+ D && !N ? "opacity-100" : "!pointer-events-none opacity-0",
2199
+ // Left & Right gradient mask to fade the gallery
2200
+ "[mask-image:linear-gradient(to_left,transparent_0px,black_4px,black_calc(100%-4px),transparent_100%)]"
2201
+ ),
2202
+ containerClassName: "mx-1"
2203
+ }
2204
+ )
2205
+ ] }),
2206
+ /* @__PURE__ */ O("div", { className: "col-start-3 flex flex-col items-end gap-y-1 small:gap-y-2", children: [
2207
+ _ && /* @__PURE__ */ t(
2208
+ Pn,
2209
+ {
2210
+ className: H(
2211
+ "transition-opacity",
2212
+ N ? "!pointer-events-none opacity-0" : "opacity-100"
2213
+ ),
2214
+ enabled: u,
2215
+ onToggle: f,
2216
+ children: /* @__PURE__ */ t(Sn, { className: "size-full" })
2217
+ }
2218
+ ),
2219
+ C && /* @__PURE__ */ O("div", { className: "max-small:hidden", children: [
2220
+ /* @__PURE__ */ t(
2221
+ oe,
2222
+ {
2223
+ className: "rounded-b-none",
2224
+ color: "neutral",
2225
+ shape: "icon",
2226
+ disabled: !S,
2227
+ onClick: w,
2228
+ children: /* @__PURE__ */ t(_n, { className: "size-full" })
2229
+ }
2230
+ ),
2231
+ /* @__PURE__ */ t(wt, { color: "background" }),
2232
+ /* @__PURE__ */ t(
2233
+ oe,
2234
+ {
2235
+ className: "rounded-t-none",
2236
+ color: "neutral",
2237
+ shape: "icon",
2238
+ disabled: !M,
2239
+ onClick: P,
2240
+ children: /* @__PURE__ */ t(zn, { className: "size-full" })
2241
+ }
2242
+ )
2243
+ ] }),
2244
+ o !== "none" && /* @__PURE__ */ t(
2245
+ oe,
2246
+ {
2247
+ variant: "fill",
2248
+ color: m ? "primary" : "neutral",
2249
+ shape: "icon",
2250
+ onClick: a,
2251
+ children: m ? /* @__PURE__ */ t(Vn, { className: "size-full" }) : /* @__PURE__ */ t(Tn, { className: "size-full" })
2252
+ }
2253
+ )
2254
+ ] })
2255
+ ]
2256
+ }
2257
+ ),
2258
+ /* @__PURE__ */ t(
2259
+ "div",
2260
+ {
2261
+ className: H(
2262
+ I,
2263
+ "inset-0 flex justify-end overflow-hidden bg-foreground/60 transition-opacity duration-details",
2264
+ x ? "opacity-100" : "pointer-events-none opacity-0"
2265
+ ),
2266
+ onClick: d,
2267
+ children: /* @__PURE__ */ t(
2268
+ "div",
2269
+ {
2270
+ className: H(
2271
+ "h-full w-3/5 bg-background transition-transform duration-details",
2272
+ x ? "translate-x-0" : "translate-x-full"
2273
+ ),
2274
+ children: !!s && /* @__PURE__ */ O(pe, { children: [
2275
+ /* @__PURE__ */ t(
2276
+ ve,
2277
+ {
2278
+ className: "w-full bg-foreground/65",
2279
+ style: i,
2280
+ src: s.src,
2281
+ imgInPlayerWidthRatio: 0.6
2282
+ }
2283
+ ),
2284
+ /* @__PURE__ */ O(
2285
+ "div",
2286
+ {
2287
+ className: H(
2288
+ "space-y-1 px-2 py-1 small:p-3",
2289
+ m && "large:p-4"
2290
+ ),
2291
+ children: [
2292
+ s.title && /* @__PURE__ */ t(
2293
+ "span",
2294
+ {
2295
+ className: H(
2296
+ "text-sm font-semibold small:text-base small:font-bold",
2297
+ m && "large:text-lg"
2298
+ ),
2299
+ children: s.title
2300
+ }
2301
+ ),
2302
+ s.text && /* @__PURE__ */ t(
2303
+ "p",
2304
+ {
2305
+ className: H(
2306
+ "text-xs text-foreground/65 small:text-sm",
2307
+ m && "large:text-base"
2308
+ ),
2309
+ children: s.text
2310
+ }
2311
+ )
2312
+ ]
2313
+ }
2314
+ )
2315
+ ] })
2316
+ }
2317
+ )
2318
+ }
2319
+ ),
2320
+ (N || x) && /* @__PURE__ */ t(
2321
+ mt,
2322
+ {
2323
+ className: H(I, we("top-right")),
2324
+ onClick: V
2325
+ }
2326
+ )
2327
+ ] });
2328
+ }, Rn = ({ className: e = "" }) => {
2329
+ const { infiniteCarrousel: n, preloadRange: r, isFullScreen: o } = ae(), { aspectRatioStyle: i } = me(), {
2330
+ items: c,
2331
+ slidable: p,
2332
+ carrouselItemIndex: h,
2333
+ setCarrouselItemIndex: b,
2334
+ itemIndexCommand: k,
2335
+ setItemIndexCommand: L,
2336
+ specialCommand: v,
2337
+ isRunningSpecialCommand: D,
2338
+ finishSpecialCommand: _,
2339
+ extendMode: u,
2340
+ extendTransition: f
2341
+ } = ne(), l = $(null), g = T((d) => {
2342
+ if (!l.current)
2343
+ throw new Error(`[${d ?? "sliderOrThrow"}] slider.current is null`);
2344
+ return l.current;
2345
+ }, []), m = $(!1), a = $(null), s = $(null), x = $(null), y = T(() => {
2346
+ x.current && cancelAnimationFrame(x.current);
2347
+ }, []), C = T(() => {
2348
+ const d = g("computeClosestSnapIndex"), I = Array.from(d.children), E = d.scrollLeft;
2349
+ return I.reduce(
2350
+ (A, Z, F) => {
2351
+ const B = Z.offsetLeft;
2352
+ return Math.abs(B - E) < Math.abs(I[A].offsetLeft - E) ? F : A;
2353
+ },
2354
+ 0
2355
+ );
2356
+ }, [g]), N = T(
2357
+ (d) => {
2358
+ const I = g("setStyleCursor");
2359
+ I.style.cursor = d;
2360
+ },
2361
+ [g]
2362
+ ), S = T(
2363
+ (d) => {
2364
+ const I = g("setStyleSnapState");
2365
+ d === "mandatory" ? I.style.scrollSnapType = "x mandatory" : I.style.scrollSnapType = "none";
2366
+ },
2367
+ [g]
2368
+ ), w = T(
2369
+ (d, I, E) => {
2370
+ y();
2371
+ const z = g("scrollToIndex"), A = Array.from(z.children), Z = z.scrollLeft, F = A[d].offsetLeft, B = (q) => {
2372
+ z.scrollTo({
2373
+ left: q,
2374
+ behavior: "instant"
2375
+ });
2376
+ }, G = () => {
2377
+ B(F), S("mandatory"), E?.();
2378
+ }, X = Math.abs(Z - F);
2379
+ if (X < 1 || I === "instant") {
2380
+ G();
2381
+ return;
2382
+ }
2383
+ const Y = de(X / 2.5, 300, 1e3), U = (/* @__PURE__ */ new Date()).getTime();
2384
+ S("none");
2385
+ const re = () => {
2386
+ const q = () => {
2387
+ const Q = (/* @__PURE__ */ new Date()).getTime() - U;
2388
+ if (Q >= Y) {
2389
+ G();
2390
+ return;
2391
+ }
2392
+ const le = Math.min(Q / Y, 1), ie = xt(le), ce = ye(Z, F, ie);
2393
+ B(ce), re();
2394
+ };
2395
+ x.current = requestAnimationFrame(q);
2396
+ };
2397
+ re();
2398
+ },
2399
+ [y, g, S]
2400
+ ), [M, P] = j(), V = !!M;
2401
+ return W(() => {
2402
+ const d = () => {
2403
+ clearTimeout(M);
2404
+ const I = setTimeout(() => {
2405
+ P(void 0);
2406
+ }, at);
2407
+ P(I);
2408
+ };
2409
+ return addEventListener("resize", d), document.addEventListener("fullscreenchange", d), () => {
2410
+ removeEventListener("resize", d), document.removeEventListener("fullscreenchange", d);
2411
+ };
2412
+ }, [M]), W(() => {
2413
+ if (v)
2414
+ return;
2415
+ const d = C();
2416
+ Number.isNaN(d) || d !== h && w(h, "instant");
2417
+ }, [
2418
+ h,
2419
+ C,
2420
+ w,
2421
+ v,
2422
+ // - Run the effect when those values change
2423
+ c,
2424
+ M,
2425
+ o,
2426
+ u,
2427
+ f
2428
+ ]), W(() => {
2429
+ if (!p || D) {
2430
+ N("auto");
2431
+ return;
2432
+ }
2433
+ const d = l.current;
2434
+ if (!d)
2435
+ return;
2436
+ N("grab"), S("mandatory");
2437
+ const I = (A) => {
2438
+ A.button === 0 && (A.preventDefault(), A.stopPropagation(), y(), m.current = !0, a.current = A.pageX - d.offsetLeft, s.current = d.scrollLeft, N("grabbing"));
2439
+ }, E = (A) => {
2440
+ if (!m.current)
2441
+ return;
2442
+ if (a.current === null)
2443
+ throw new Error("[onMouseMove] startX is null");
2444
+ S("none");
2445
+ const F = A.pageX - d.offsetLeft - a.current;
2446
+ requestAnimationFrame(() => {
2447
+ if (s.current === null)
2448
+ throw new Error("[onMouseMove] scrollLeft is null");
2449
+ d.scrollLeft = s.current - F;
2450
+ });
2451
+ }, z = () => {
2452
+ if (!m.current)
2453
+ return;
2454
+ m.current = !1, N("grab");
2455
+ const A = C();
2456
+ w(A, "smooth");
2457
+ };
2458
+ return d.addEventListener("mousedown", I), document.addEventListener("mousemove", E), document.addEventListener("mouseleave", z), document.addEventListener("mouseup", z), document.addEventListener("contextmenu", z), () => {
2459
+ d.removeEventListener("mousedown", I), document.removeEventListener("mousemove", E), document.removeEventListener("mouseleave", z), document.removeEventListener("mouseup", z), document.removeEventListener("contextmenu", z);
2460
+ };
2461
+ }, [
2462
+ y,
2463
+ C,
2464
+ D,
2465
+ w,
2466
+ N,
2467
+ S,
2468
+ p
2469
+ ]), W(() => {
2470
+ if (f || V)
2471
+ return;
2472
+ const d = l.current;
2473
+ if (!d)
2474
+ return;
2475
+ const I = () => {
2476
+ const E = C();
2477
+ Number.isNaN(E) || (b(E), E === k && L(null));
2478
+ };
2479
+ return d.addEventListener("scroll", I), () => {
2480
+ d.removeEventListener("scroll", I);
2481
+ };
2482
+ }, [
2483
+ C,
2484
+ f,
2485
+ V,
2486
+ k,
2487
+ b,
2488
+ L
2489
+ ]), W(() => {
2490
+ if (k === null)
2491
+ return;
2492
+ const d = () => {
2493
+ setTimeout(() => {
2494
+ L(null), _();
2495
+ }, 75);
2496
+ };
2497
+ switch (v) {
2498
+ case "first_to_last":
2499
+ w(c.length - 1, "instant", d);
2500
+ break;
2501
+ case "last_to_first":
2502
+ w(0, "instant", d);
2503
+ break;
2504
+ case "instant":
2505
+ w(k, "instant", d);
2506
+ break;
2507
+ default:
2508
+ w(k, "smooth");
2509
+ break;
2510
+ }
2511
+ }, [
2512
+ v,
2513
+ _,
2514
+ k,
2515
+ c.length,
2516
+ w,
2517
+ L
2518
+ ]), /* @__PURE__ */ O(
2519
+ "div",
2520
+ {
2521
+ className: H(
2522
+ "relative overflow-hidden rounded-carrousel transition-radius",
2523
+ e
2524
+ ),
2525
+ style: i,
2526
+ children: [
2527
+ /* @__PURE__ */ t(
2528
+ "div",
2529
+ {
2530
+ ref: l,
2531
+ className: `flex size-full ${p ? "overflow-x-auto no-scrollbar *:snap-start *:snap-always" : "justify-center"}`,
2532
+ children: c.map((d, I) => {
2533
+ const E = I === h, z = I === 0, A = I === c.length - 1, Z = (() => {
2534
+ if (v === "first_to_last" && z)
2535
+ return {
2536
+ transform: `translateX(${100 * c.length}%)`
2537
+ };
2538
+ if (v === "last_to_first" && A)
2539
+ return {
2540
+ transform: `translateX(-${100 * c.length}%)`
2541
+ };
2542
+ })();
2543
+ let F = Math.abs(I - h) <= r;
2544
+ F ||= I === k, n && (F ||= h < r && c.length - I <= r - h, F ||= h >= c.length - r && I <= r - (c.length - h));
2545
+ const B = (() => {
2546
+ let G;
2547
+ switch (d.type) {
2548
+ case "360":
2549
+ G = d.images[0].src;
2550
+ break;
2551
+ case "image":
2552
+ G = d.src;
2553
+ break;
2554
+ case "video":
2555
+ G = d.poster ?? "video";
2556
+ break;
2557
+ case "custom":
2558
+ G = "custom";
2559
+ break;
2560
+ }
2561
+ return `${I}_${G}`;
2562
+ })();
2563
+ return /* @__PURE__ */ t(
2564
+ "div",
2565
+ {
2566
+ className: H(
2567
+ "h-full bg-foreground/35",
2568
+ h === I && "z-1"
2569
+ // Give high-ground to the shown item (to avoid 1px vertical line)
2570
+ ),
2571
+ style: { ...i, ...Z },
2572
+ children: F && /* @__PURE__ */ t(kn, { index: I, item: d, isShown: E })
2573
+ },
2574
+ B
2575
+ );
2576
+ })
2577
+ }
2578
+ ),
2579
+ /* @__PURE__ */ t(Hn, {})
2580
+ ]
2581
+ }
2582
+ );
2583
+ }, On = () => {
2584
+ const { permanentGallery: e } = ae(), { aspectRatioStyle: n } = me(), {
2585
+ prevItem: r,
2586
+ nextItem: o,
2587
+ isShowingDetails: i,
2588
+ resetShownDetails: c,
2589
+ extendMode: p,
2590
+ disableExtendMode: h,
2591
+ isZooming: b,
2592
+ resetZoom: k,
2593
+ fakeFullScreen: L
2594
+ } = ne(), v = $(null), D = $(null), _ = $(null);
2595
+ return W(() => {
2596
+ if (!p)
2597
+ return;
2598
+ const u = v.current, f = D.current, l = _.current;
2599
+ if (!u || !f || !l)
2600
+ return;
2601
+ let g = !1;
2602
+ const m = (x) => [u, f, l].includes(x.target), a = (x) => {
2603
+ g = m(x);
2604
+ }, s = (x) => {
2605
+ g && (m(x) && h(), g = !1);
2606
+ };
2607
+ return u.addEventListener("mousedown", a), u.addEventListener("mouseup", s), () => {
2608
+ u.removeEventListener("mousedown", a), u.removeEventListener("mouseup", s);
2609
+ };
2610
+ }, [h, p]), W(() => {
2611
+ const u = (f) => {
2612
+ f.key === "Escape" && (b ? k() : i ? c() : h());
2613
+ };
2614
+ return addEventListener("keydown", u), () => {
2615
+ removeEventListener("keydown", u);
2616
+ };
2617
+ }, [
2618
+ h,
2619
+ i,
2620
+ b,
2621
+ o,
2622
+ r,
2623
+ c,
2624
+ k
2625
+ ]), /* @__PURE__ */ O(
2626
+ "div",
2627
+ {
2628
+ ref: v,
2629
+ className: H(
2630
+ "relative",
2631
+ p && "flex size-full items-center justify-center",
2632
+ L && "fixed inset-0 z-overlay bg-foreground/75"
2633
+ ),
2634
+ children: [
2635
+ /* @__PURE__ */ O(
2636
+ "div",
2637
+ {
2638
+ ref: D,
2639
+ className: p ? "flex size-full flex-col justify-center gap-y-2 small:gap-y-4" : "space-y-2",
2640
+ children: [
2641
+ /* @__PURE__ */ t(
2642
+ "div",
2643
+ {
2644
+ ref: _,
2645
+ className: H(
2646
+ p && "mx-auto flex min-h-0 w-full max-w-[1600px] justify-center"
2647
+ ),
2648
+ style: n,
2649
+ children: /* @__PURE__ */ t(Rn, { className: H(p && "h-full min-w-0") })
2650
+ }
2651
+ ),
2652
+ e && /* @__PURE__ */ t(vt, { className: H(p && "my-2 shrink-0 small:my-4") })
2653
+ ]
2654
+ }
2655
+ ),
2656
+ p && /* @__PURE__ */ t(
2657
+ mt,
2658
+ {
2659
+ className: "absolute right-2 top-2 small:right-4 small:top-4",
2660
+ onClick: h
2661
+ }
2662
+ )
2663
+ ]
2664
+ }
2665
+ );
2666
+ }, Wn = () => {
2667
+ const { emitEvent: e, compositionUrl: n } = ae(), {
2668
+ data: r,
2669
+ status: o,
2670
+ isSuccess: i,
2671
+ error: c
2672
+ } = Wt(n);
2673
+ return W(() => {
2674
+ c ? e(Be, c) : o === "fetching" ? e(Ue, n) : i && e(Ge, r);
2675
+ }, [r, n, e, c, i, o]), c ? /* @__PURE__ */ t(
2676
+ pt,
2677
+ {
2678
+ className: "aspect-square text-foreground/70",
2679
+ text: "Player could not be loaded"
2680
+ }
2681
+ ) : i ? /* @__PURE__ */ t(Zt, { composition: r, children: /* @__PURE__ */ t(Yt, { children: /* @__PURE__ */ t(On, {}) }) }) : /* @__PURE__ */ O("div", { className: "flex aspect-square size-full flex-col items-center justify-center gap-y-4", children: [
2682
+ /* @__PURE__ */ t("div", { className: "animate-pulse text-xl", children: "Loading Player" }),
2683
+ /* @__PURE__ */ t(ht, { color: "foreground" })
2684
+ ] });
2685
+ }, Xn = ({
2686
+ compositionUrl: e,
2687
+ hideCategoriesNav: n = It,
2688
+ infiniteCarrousel: r = Mt,
2689
+ permanentGallery: o = Tt,
2690
+ mediaLoadStrategy: i = Nt,
2691
+ minMediaWidth: c = St,
2692
+ maxMediaWidth: p = zt,
2693
+ preloadRange: h = _t,
2694
+ autoLoad360: b = Vt,
2695
+ categoriesFilter: k = Pt,
2696
+ extendBehavior: L = Dt,
2697
+ eventPrefix: v = rt,
2698
+ demoSpin: D = At,
2699
+ reverse360: _ = Ht,
2700
+ children: u
2701
+ // NOTE: use to customize the player, not to display the content
2702
+ }) => {
2703
+ const f = $(null), [l, g] = j(0.5), [m, a] = j(!1), s = T(
2704
+ (C, N) => {
2705
+ const S = v + C, w = new CustomEvent(S, { detail: N });
2706
+ document.dispatchEvent(w);
2707
+ },
2708
+ [v]
2709
+ );
2710
+ W(() => {
2711
+ if (m) {
2712
+ g(1);
2713
+ return;
2714
+ }
2715
+ if (!f.current)
2716
+ return;
2717
+ const C = f.current, N = () => {
2718
+ const S = window.innerWidth, w = C.clientWidth;
2719
+ g(w / S);
2720
+ };
2721
+ return N(), addEventListener("resize", N), () => {
2722
+ removeEventListener("resize", N);
2723
+ };
2724
+ }, [m]), W(() => {
2725
+ if (L !== "full_screen")
2726
+ return;
2727
+ const C = f.current;
2728
+ if (!C)
2729
+ throw new Error("Wrapper not found");
2730
+ const N = () => {
2731
+ const { fullscreenElement: S } = document;
2732
+ a(
2733
+ S === C || // NOTE: For custom element, the web browser is making the whole custom element full-screen and not only the wrapper
2734
+ S?.localName === Pe
2735
+ );
2736
+ };
2737
+ return document.addEventListener("fullscreenchange", N), () => {
2738
+ document.removeEventListener("fullscreenchange", N);
2739
+ };
2740
+ }, [L]);
2741
+ const x = T(async () => {
2742
+ const C = f.current;
2743
+ if (!C)
2744
+ throw new Error("Wrapper not found");
2745
+ try {
2746
+ return await C.requestFullscreen(), !0;
2747
+ } catch {
2748
+ return !1;
2749
+ }
2750
+ }, []), y = T(async () => {
2751
+ try {
2752
+ return await document.exitFullscreen(), !0;
2753
+ } catch {
2754
+ return !1;
2755
+ }
2756
+ }, []);
2757
+ return /* @__PURE__ */ t(
2758
+ Xt,
2759
+ {
2760
+ compositionUrl: e,
2761
+ hideCategoriesNav: n,
2762
+ infiniteCarrousel: r,
2763
+ permanentGallery: o,
2764
+ mediaLoadStrategy: i,
2765
+ minMediaWidth: c,
2766
+ maxMediaWidth: p,
2767
+ preloadRange: h,
2768
+ categoriesFilter: k,
2769
+ autoLoad360: b,
2770
+ extendBehavior: L,
2771
+ demoSpin: D,
2772
+ reverse360: _,
2773
+ emitEvent: s,
2774
+ playerInViewportWidthRatio: l,
2775
+ isFullScreen: m,
2776
+ requestFullscreen: x,
2777
+ exitFullscreen: y,
2778
+ children: /* @__PURE__ */ O(Ft, { children: [
2779
+ /* @__PURE__ */ t(
2780
+ "div",
2781
+ {
2782
+ ref: f,
2783
+ className: "select-none text-foreground",
2784
+ style: {
2785
+ "--background": "var(--cc-webplayer-background, 0 0% 100%)",
2786
+ "--foreground": "var(--cc-webplayer-foreground, 240 10% 3.9%)",
2787
+ "--primary": "var(--cc-webplayer-primary, 216 100% 52%)",
2788
+ "--primary-foreground": "var(--cc-webplayer-primary-foreground, var(--background))",
2789
+ "--primary-light": "var(--cc-webplayer-primary-light, var(--primary))",
2790
+ "--neutral": "var(--cc-webplayer-neutral, 0 0% 39%)",
2791
+ "--neutral-foreground": "var(--cc-webplayer-neutral-foreground, var(--foreground))",
2792
+ "--radius-ui": "var(--cc-webplayer-radius-ui, 16px)",
2793
+ "--radius-carrousel": "var(--cc-webplayer-radius-carrousel, 0)",
2794
+ "--radius-gallery": "var(--cc-webplayer-radius-gallery, 0)"
2795
+ },
2796
+ children: /* @__PURE__ */ t(Wn, {})
2797
+ }
2798
+ ),
2799
+ u
2800
+ ] })
2801
+ }
2802
+ );
2803
+ }, Zn = ({ children: e, index: n, thumbnailSrc: r }) => {
2804
+ const { registerCustomMedia: o, unregisterCustomMedia: i } = be();
2805
+ return W(() => {
2806
+ if (!e)
2807
+ return;
2808
+ const c = o({
2809
+ Media: e,
2810
+ index: n,
2811
+ thumbnailSrc: r
2812
+ });
2813
+ return () => {
2814
+ i(c);
2815
+ };
2816
+ }, [e, i, n, o, r]), null;
2817
+ }, Qn = (e) => De() ? /* @__PURE__ */ t(Zn, { ...e }) : /* @__PURE__ */ t("slot", {}), Fn = ({ name: e, children: n }) => {
2818
+ const { registerIconConfig: r, unregisterIconConfig: o } = be();
2819
+ return W(() => {
2820
+ if (n)
2821
+ return r(e, {
2822
+ Icon: n
2823
+ }), () => {
2824
+ o(e);
2825
+ };
2826
+ }, [n, e, r, o]), null;
2827
+ }, er = (e) => De() ? /* @__PURE__ */ t(Fn, { ...e }) : /* @__PURE__ */ t("slot", {}), Yn = '*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.\\!container{width:100%!important}.container{width:100%}@media (min-width: 1280px){.\\!container{max-width:1280px!important}.container{max-width:1280px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.\\!pointer-events-none{pointer-events:none!important}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.invisible{visibility:hidden}.fixed{position:fixed}.\\!absolute{position:absolute!important}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.inset-x-0{left:0;right:0}.inset-x-1{left:4px;right:4px}.inset-y-1{top:4px;bottom:4px}.-bottom-1{bottom:-4px}.-left-1{left:-4px}.-right-1{right:-4px}.-top-1{top:-4px}.bottom-0{bottom:0}.bottom-1{bottom:4px}.left-0{left:0}.left-1{left:4px}.left-1\\/2{left:50%}.right-1{right:4px}.right-2{right:8px}.top-0{top:0}.top-1{top:4px}.top-1\\/2{top:50%}.top-2{top:8px}.-z-10{z-index:-10}.-z-20{z-index:-20}.z-1{z-index:1}.z-hotspot{z-index:10}.z-overlay{z-index:30}.z-zoomed-image{z-index:20}.col-start-3{grid-column-start:3}.mx-1{margin-left:4px;margin-right:4px}.mx-auto{margin-left:auto;margin-right:auto}.my-2{margin-top:8px;margin-bottom:8px}.-ml-px{margin-left:-1px}.-mt-px{margin-top:-1px}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.aspect-square{aspect-ratio:1 / 1}.size-1{width:4px;height:4px}.size-12{width:48px;height:48px}.size-20{width:80px;height:80px}.size-4{width:16px;height:16px}.size-5{width:20px;height:20px}.size-8{width:32px;height:32px}.size-full{width:100%;height:100%}.h-1{height:4px}.h-10{height:40px}.h-20{height:80px}.h-3\\/4{height:75%}.h-5{height:20px}.h-8{height:32px}.h-full{height:100%}.h-px{height:1px}.min-h-0{min-height:0}.w-12{width:48px}.w-3\\/5{width:60%}.w-8{width:32px}.w-\\[calc\\(100\\%\\+1024px\\)\\]{width:calc(100% + 1024px)}.w-\\[calc\\(100\\%\\+2px\\)\\]{width:calc(100% + 2px)}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-px{width:1px}.min-w-0{min-width:0}.max-w-40{max-width:160px}.max-w-\\[1600px\\]{max-width:1600px}.shrink-0{flex-shrink:0}.origin-top-left{transform-origin:top left}.-translate-x-1\\.5{--tw-translate-x: -6px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-1\\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0{--tw-translate-x: 0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\\.5{--tw-translate-x: 6px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-full{--tw-translate-x: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-105{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-scale-x-100{--tw-scale-x: -1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes hotspot-ping{0%{transform:scale(0)}25%{opacity:1}75%,to{transform:scale(1.5);opacity:0}}.animate-hotspot-ping{animation:hotspot-ping 3s cubic-bezier(0,0,.2,1) infinite}@keyframes pulse{50%{opacity:1}0%,to{opacity:0}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-rotation{animation:rotation 1s linear infinite}.cursor-auto{cursor:auto}.cursor-ew-resize{cursor:ew-resize}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-help{cursor:help}.cursor-move{cursor:move}.cursor-pointer{cursor:pointer}.resize{resize:both}.grid-cols-\\[auto\\,1fr\\,auto\\]{grid-template-columns:auto 1fr auto}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-x-1{-moz-column-gap:4px;column-gap:4px}.gap-x-2{-moz-column-gap:8px;column-gap:8px}.gap-x-4{-moz-column-gap:16px;column-gap:16px}.gap-y-1{row-gap:4px}.gap-y-2{row-gap:8px}.gap-y-4{row-gap:16px}.space-x-0\\.5>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(2px * var(--tw-space-x-reverse));margin-left:calc(2px * calc(1 - var(--tw-space-x-reverse)))}.space-y-0\\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(2px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2px * var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(4px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(4px * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(8px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(8px * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-scroll{overflow-x:scroll}.text-pretty{text-wrap:pretty}.rounded-carrousel{border-radius:var(--radius-carrousel)}.rounded-full{border-radius:9999px}.rounded-gallery{border-radius:var(--radius-gallery)}.rounded-ui{border-radius:var(--radius-ui)}.rounded-ui-md{border-radius:calc(var(--radius-ui) + 2px)}.rounded-ui-sm{border-radius:calc(var(--radius-ui) - 2px)}.rounded-b-none{border-bottom-right-radius:0;border-bottom-left-radius:0}.rounded-t-none{border-top-left-radius:0;border-top-right-radius:0}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-background{border-color:hsl(var(--background))}.border-foreground{border-color:hsl(var(--foreground))}.border-primary{border-color:hsl(var(--primary))}.border-b-transparent{border-bottom-color:transparent}.bg-background{background-color:hsl(var(--background))}.bg-background\\/25{background-color:hsl(var(--background) / .25)}.bg-background\\/50{background-color:hsl(var(--background) / .5)}.bg-background\\/60{background-color:hsl(var(--background) / .6)}.bg-foreground\\/25{background-color:hsl(var(--foreground) / .25)}.bg-foreground\\/30{background-color:hsl(var(--foreground) / .3)}.bg-foreground\\/35{background-color:hsl(var(--foreground) / .35)}.bg-foreground\\/40{background-color:hsl(var(--foreground) / .4)}.bg-foreground\\/50{background-color:hsl(var(--foreground) / .5)}.bg-foreground\\/60{background-color:hsl(var(--foreground) / .6)}.bg-foreground\\/65{background-color:hsl(var(--foreground) / .65)}.bg-foreground\\/75{background-color:hsl(var(--foreground) / .75)}.bg-neutral\\/50{background-color:hsl(var(--neutral) / .5)}.bg-primary{background-color:hsl(var(--primary))}.bg-primary-foreground{background-color:hsl(var(--primary-foreground))}.bg-primary\\/50{background-color:hsl(var(--primary) / .5)}.bg-transparent{background-color:transparent}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-foreground{--tw-gradient-from: hsl(var(--foreground)) var(--tw-gradient-from-position);--tw-gradient-to: hsl(var(--foreground) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.to-transparent{--tw-gradient-to: transparent var(--tw-gradient-to-position)}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\\.5{padding:2px}.p-1{padding:4px}.p-2{padding:8px}.p-4{padding:16px}.px-1\\.5{padding-left:6px;padding-right:6px}.px-2{padding-left:8px;padding-right:8px}.py-0\\.5{padding-top:2px;padding-bottom:2px}.py-1{padding-top:4px;padding-bottom:4px}.pl-6{padding-left:24px}.pr-12{padding-right:48px}.pr-4{padding-right:16px}.pt-8{padding-top:32px}.text-2xl{font-size:24px;line-height:32px}.text-sm{font-size:14px;line-height:20px}.text-xl{font-size:20px;line-height:28px}.text-xs{font-size:12px;line-height:16px}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-background{color:hsl(var(--background))}.text-background\\/75{color:hsl(var(--background) / .75)}.text-foreground{color:hsl(var(--foreground))}.text-foreground\\/65{color:hsl(var(--foreground) / .65)}.text-foreground\\/70{color:hsl(var(--foreground) / .7)}.text-neutral-foreground{color:hsl(var(--neutral-foreground))}.text-primary{color:hsl(var(--primary))}.text-primary-foreground{color:hsl(var(--primary-foreground))}.text-primary-light{color:hsl(var(--primary-light))}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\\[width\\]{transition-property:width;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-radius{transition-property:border-radius;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-details{transition-duration:.35s}.no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.no-scrollbar::-webkit-scrollbar{display:none}.\\[mask-image\\:linear-gradient\\(to_left\\,transparent_0px\\,black_4px\\,black_calc\\(100\\%-4px\\)\\,transparent_100\\%\\)\\]{-webkit-mask-image:linear-gradient(to left,transparent 0px,black 4px,black calc(100% - 4px),transparent 100%);mask-image:linear-gradient(to left,transparent 0px,black 4px,black calc(100% - 4px),transparent 100%)}.\\*\\:pointer-events-auto>*{pointer-events:auto}.\\*\\:size-full>*{width:100%;height:100%}.\\*\\:snap-start>*{scroll-snap-align:start}.\\*\\:snap-always>*{scroll-snap-stop:always}.\\*\\:object-cover>*{-o-object-fit:cover;object-fit:cover}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:inset-0:after{content:var(--tw-content);inset:0}.after\\:rounded-gallery:after{content:var(--tw-content);border-radius:var(--radius-gallery)}.after\\:border-2:after{content:var(--tw-content);border-width:2px}.after\\:border-primary:after{content:var(--tw-content);border-color:hsl(var(--primary))}.after\\:opacity-0:after{content:var(--tw-content);opacity:0}.after\\:opacity-100:after{content:var(--tw-content);opacity:1}.after\\:transition-all:after{content:var(--tw-content);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.hover\\:z-hotspot-hover:hover{z-index:11}.hover\\:bg-foreground\\/25:hover{background-color:hsl(var(--foreground) / .25)}.hover\\:bg-primary\\/25:hover{background-color:hsl(var(--primary) / .25)}.hover\\:bg-primary\\/30:hover{background-color:hsl(var(--primary) / .3)}.hover\\:opacity-80:hover{opacity:.8}.hover\\:after\\:opacity-70:hover:after{content:var(--tw-content);opacity:.7}.disabled\\:opacity-60:disabled{opacity:.6}.group:hover .group-hover\\:pointer-events-auto{pointer-events:auto}.group\\/volume:hover .group-hover\\/volume\\:opacity-100{opacity:1}.group\\/volume:hover .group-hover\\/volume\\:opacity-50{opacity:.5}.group:hover .group-hover\\:opacity-100{opacity:1}@media ((orientation: portrait) and (max-width: 767px)) or ((orientation: landscape) and (max-width: 1023px)){.max-small\\:hidden{display:none}}@media ((orientation: portrait) and (min-width: 768px)) or ((orientation: landscape) and (min-width: 1024px)){.small\\:inset-x-2{left:8px;right:8px}.small\\:inset-y-2{top:8px;bottom:8px}.small\\:bottom-2{bottom:8px}.small\\:left-2{left:8px}.small\\:right-2{right:8px}.small\\:right-4{right:16px}.small\\:top-2{top:8px}.small\\:top-4{top:16px}.small\\:my-4{margin-top:16px;margin-bottom:16px}.small\\:hidden{display:none}.small\\:h-12{height:48px}.small\\:h-28{height:112px}.small\\:max-w-48{max-width:192px}.small\\:gap-2{gap:8px}.small\\:gap-x-2{-moz-column-gap:8px;column-gap:8px}.small\\:gap-y-2{row-gap:8px}.small\\:gap-y-4{row-gap:16px}.small\\:space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(4px * var(--tw-space-x-reverse));margin-left:calc(4px * calc(1 - var(--tw-space-x-reverse)))}.small\\:p-3{padding:12px}.small\\:px-2{padding-left:8px;padding-right:8px}.small\\:py-1{padding-top:4px;padding-bottom:4px}.small\\:pl-8{padding-left:32px}.small\\:pr-6{padding-right:24px}.small\\:text-base{font-size:16px;line-height:24px}.small\\:text-sm{font-size:14px;line-height:20px}.small\\:font-bold{font-weight:700}}@media (min-width: 1280px){.large\\:h-20{height:80px}.large\\:h-3\\/5{height:60%}.large\\:max-w-56{max-width:224px}.large\\:gap-4{gap:16px}.large\\:p-2{padding:8px}.large\\:p-4{padding:16px}.large\\:text-base{font-size:16px;line-height:24px}.large\\:text-lg{font-size:18px;line-height:28px}}';
2828
+ function jn(e) {
2829
+ return e.replace(
2830
+ /([a-z0-9])([A-Z])/g,
2831
+ (n, r, o) => `${r}-${o.toLowerCase()}`
2832
+ );
2833
+ }
2834
+ function He(e) {
2835
+ return Object.entries(e).reduce((n, [r, o]) => {
2836
+ if (o !== void 0) {
2837
+ const i = jn(r);
2838
+ n[i] = o.toString();
2839
+ }
2840
+ return n;
2841
+ }, {});
2842
+ }
2843
+ const tr = (e) => /* @__PURE__ */ O(pe, { children: [
2844
+ /* @__PURE__ */ t("style", { children: Yn }),
2845
+ /* @__PURE__ */ t(Xn, { ...e })
2846
+ ] }), $n = (e) => He(e), Un = (e) => He(e), Gn = (e) => He(e), nr = ({
2847
+ onCompositionLoading: e,
2848
+ onCompositionLoaded: n,
2849
+ onCompositionLoadError: r,
2850
+ onItemChange: o,
2851
+ onExtendModeOn: i,
2852
+ onExtendModeOff: c,
2853
+ onHotspotsOn: p,
2854
+ onHotspotsOff: h,
2855
+ onGalleryOpen: b,
2856
+ onGalleryClose: k,
2857
+ className: L,
2858
+ style: v = {},
2859
+ children: D,
2860
+ ..._
2861
+ }) => {
2862
+ const u = se(() => {
2863
+ const f = $n(_);
2864
+ return L && Object.assign(f, { class: L }), f;
2865
+ }, [L, _]);
2866
+ return W(() => {
2867
+ const f = _.eventPrefix ?? rt, l = (a) => `${f}${a}`, g = {
2868
+ [Ue]: e,
2869
+ [Ge]: n,
2870
+ [Be]: r,
2871
+ [qe]: o,
2872
+ [Ke]: i,
2873
+ [Je]: c,
2874
+ [Qe]: p,
2875
+ [et]: h,
2876
+ [tt]: b,
2877
+ [nt]: k
2878
+ }, m = /* @__PURE__ */ new Map();
2879
+ return Object.entries(g).forEach(([a, s]) => {
2880
+ if (!s)
2881
+ return;
2882
+ const x = l(a), y = (C) => s(C.detail);
2883
+ m.set(x, y), document.addEventListener(x, y);
2884
+ }), () => {
2885
+ m.forEach((a, s) => {
2886
+ document.removeEventListener(s, a);
2887
+ });
2888
+ };
2889
+ }, [
2890
+ _.eventPrefix,
2891
+ e,
2892
+ n,
2893
+ r,
2894
+ o,
2895
+ i,
2896
+ c,
2897
+ p,
2898
+ h,
2899
+ b,
2900
+ k
2901
+ ]), /* @__PURE__ */ t("cc-webplayer", { style: { display: "block", ...v }, ...u, children: D });
2902
+ }, rr = ({ children: e, ...n }) => {
2903
+ const r = Un(n);
2904
+ return /* @__PURE__ */ t("cc-webplayer-custom-media", { ...r, children: e });
2905
+ }, or = ({
2906
+ children: e,
2907
+ ...n
2908
+ }) => {
2909
+ const r = Gn(n);
2910
+ return /* @__PURE__ */ t("cc-webplayer-icon", { ...r, children: e });
2911
+ };
2912
+ export {
2913
+ rt as D,
2914
+ Ue as E,
2915
+ tr as W,
2916
+ Qn as a,
2917
+ er as b,
2918
+ Jn as c,
2919
+ Pe as d,
2920
+ je as e,
2921
+ $e as f,
2922
+ nr as g,
2923
+ rr as h,
2924
+ or as i,
2925
+ Ge as j,
2926
+ Be as k,
2927
+ qe as l,
2928
+ Ke as m,
2929
+ Je as n,
2930
+ Qe as o,
2931
+ et as p,
2932
+ tt as q,
2933
+ nt as r,
2934
+ Kn as s
2935
+ };