@hanifhan1f/vidstack-react 1.12.19 → 1.12.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (59) hide show
  1. package/dev/chunks/vidstack-BPymmnxm.js +551 -0
  2. package/dev/chunks/vidstack-BSpAxhO6.js +643 -0
  3. package/dev/chunks/vidstack-BoLZuw80.js +34 -0
  4. package/dev/chunks/vidstack-CFOPpDTy.js +476 -0
  5. package/dev/chunks/vidstack-CXrXBlpD.js +11692 -0
  6. package/dev/chunks/vidstack-DOtIyh4c.js +288 -0
  7. package/dev/chunks/vidstack-DY2iivhG.js +84 -0
  8. package/dev/chunks/vidstack-Dov8gjdq.js +401 -0
  9. package/dev/chunks/vidstack-DwdhbP5c.js +189 -0
  10. package/dev/chunks/vidstack-DweQYzVw.js +180 -0
  11. package/dev/chunks/vidstack-H9OdEKUQ.js +375 -0
  12. package/dev/chunks/vidstack-KntYDWMe.js +668 -0
  13. package/dev/chunks/vidstack-NCBSBZE-.js +61 -0
  14. package/dev/chunks/vidstack-UWMPvwsa.js +1537 -0
  15. package/dev/player/vidstack-default-components.js +5 -5
  16. package/dev/player/vidstack-default-layout.js +5 -5
  17. package/dev/player/vidstack-plyr-layout.js +4 -4
  18. package/dev/player/vidstack-remotion.js +3 -3
  19. package/dev/vidstack.js +7 -7
  20. package/package.json +1 -1
  21. package/player/styles/default/layouts/video.css +94 -77
  22. package/prod/chunks/vidstack-B9nEslvl.js +11197 -0
  23. package/prod/chunks/vidstack-BOObgZd8.js +504 -0
  24. package/prod/chunks/vidstack-B_wD853-.js +386 -0
  25. package/prod/chunks/vidstack-C4tNkfXj.js +470 -0
  26. package/prod/chunks/vidstack-CNJwYQRW.js +84 -0
  27. package/prod/chunks/vidstack-CVzVtf1j.js +61 -0
  28. package/prod/chunks/vidstack-CiQEyk_l.js +189 -0
  29. package/prod/chunks/vidstack-CiTWSpv_.js +34 -0
  30. package/prod/chunks/vidstack-CzjHdPIT.js +375 -0
  31. package/prod/chunks/vidstack-Djmla_FM.js +545 -0
  32. package/prod/chunks/vidstack-DpQw1Y33.js +663 -0
  33. package/prod/chunks/vidstack-VTpvHAdU.js +1537 -0
  34. package/prod/chunks/vidstack-dbLRgf2L.js +159 -0
  35. package/prod/chunks/vidstack-rHvQ8f6c.js +288 -0
  36. package/prod/player/vidstack-default-components.js +5 -5
  37. package/prod/player/vidstack-default-layout.js +5 -5
  38. package/prod/player/vidstack-plyr-layout.js +4 -4
  39. package/prod/player/vidstack-remotion.js +3 -3
  40. package/prod/vidstack.js +7 -7
  41. package/server/chunks/vidstack-BV_VpWlJ.js +1537 -0
  42. package/server/chunks/vidstack-ByG5MvLs.js +545 -0
  43. package/server/chunks/vidstack-C0xOpWYR.js +470 -0
  44. package/server/chunks/vidstack-C481iXqe.js +386 -0
  45. package/server/chunks/vidstack-CbNRZgUA.js +11197 -0
  46. package/server/chunks/vidstack-D7D9kiW6.js +34 -0
  47. package/server/chunks/vidstack-DJJmNib6.js +504 -0
  48. package/server/chunks/vidstack-DWt5LAKE.js +375 -0
  49. package/server/chunks/vidstack-DsZKgA8y.js +663 -0
  50. package/server/chunks/vidstack-NXcLNXxO.js +84 -0
  51. package/server/chunks/vidstack-OKdxH1xx.js +189 -0
  52. package/server/chunks/vidstack-iVN8uBAv.js +288 -0
  53. package/server/chunks/vidstack-m8aA99tE.js +159 -0
  54. package/server/chunks/vidstack-rUHVQoo3.js +61 -0
  55. package/server/player/vidstack-default-components.js +5 -5
  56. package/server/player/vidstack-default-layout.js +5 -5
  57. package/server/player/vidstack-plyr-layout.js +4 -4
  58. package/server/player/vidstack-remotion.js +3 -3
  59. package/server/vidstack.js +7 -7
@@ -0,0 +1,663 @@
1
+ "use client"
2
+
3
+ import * as React from 'react';
4
+ import { useReactContext, createReactComponent, composeRefs, useSignal, noop, useStateContext, signal, effect, isString } from './vidstack-CZgUA94N.js';
5
+ import { mediaContext, AirPlayButtonInstance, Primitive, PlayButtonInstance, CaptionButtonInstance, FullscreenButtonInstance, MuteButtonInstance, PIPButtonInstance, SeekButtonInstance, LiveButtonInstance, SliderValueInstance, SliderInstance, SliderPreviewInstance, useSliderState, VolumeSliderInstance, IS_SERVER, ThumbnailInstance, TimeSliderInstance, SliderChaptersInstance, SliderThumbnailInstance, SliderVideoInstance, mediaState, RadioGroupInstance, RadioInstance, MenuInstance, MenuButtonInstance, useMediaState, MenuItemsInstance, MenuItemInstance, GestureInstance, TimeInstance, isTrackCaptionKind } from './vidstack-B9nEslvl.js';
6
+ import { createPortal } from 'react-dom';
7
+
8
+ function useMediaContext() {
9
+ return useReactContext(mediaContext);
10
+ }
11
+
12
+ const AirPlayButtonBridge = createReactComponent(AirPlayButtonInstance, {
13
+ domEventsRegex: /^onMedia/
14
+ });
15
+ const AirPlayButton = React.forwardRef(
16
+ ({ children, ...props }, forwardRef) => {
17
+ return /* @__PURE__ */ React.createElement(AirPlayButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
18
+ Primitive.button,
19
+ {
20
+ ...props2,
21
+ ref: composeRefs(props2.ref, forwardRef)
22
+ },
23
+ children
24
+ ));
25
+ }
26
+ );
27
+ AirPlayButton.displayName = "AirPlayButton";
28
+
29
+ const PlayButtonBridge = createReactComponent(PlayButtonInstance, {
30
+ domEventsRegex: /^onMedia/
31
+ });
32
+ const PlayButton = React.forwardRef(
33
+ ({ children, ...props }, forwardRef) => {
34
+ return /* @__PURE__ */ React.createElement(PlayButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
35
+ Primitive.button,
36
+ {
37
+ ...props2,
38
+ ref: composeRefs(props2.ref, forwardRef)
39
+ },
40
+ children
41
+ ));
42
+ }
43
+ );
44
+ PlayButton.displayName = "PlayButton";
45
+
46
+ const CaptionButtonBridge = createReactComponent(CaptionButtonInstance, {
47
+ domEventsRegex: /^onMedia/
48
+ });
49
+ const CaptionButton = React.forwardRef(
50
+ ({ children, ...props }, forwardRef) => {
51
+ return /* @__PURE__ */ React.createElement(CaptionButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
52
+ Primitive.button,
53
+ {
54
+ ...props2,
55
+ ref: composeRefs(props2.ref, forwardRef)
56
+ },
57
+ children
58
+ ));
59
+ }
60
+ );
61
+ CaptionButton.displayName = "CaptionButton";
62
+
63
+ const FullscreenButtonBridge = createReactComponent(FullscreenButtonInstance, {
64
+ domEventsRegex: /^onMedia/
65
+ });
66
+ const FullscreenButton = React.forwardRef(
67
+ ({ children, ...props }, forwardRef) => {
68
+ return /* @__PURE__ */ React.createElement(FullscreenButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
69
+ Primitive.button,
70
+ {
71
+ ...props2,
72
+ ref: composeRefs(props2.ref, forwardRef)
73
+ },
74
+ children
75
+ ));
76
+ }
77
+ );
78
+ FullscreenButton.displayName = "FullscreenButton";
79
+
80
+ const MuteButtonBridge = createReactComponent(MuteButtonInstance, {
81
+ domEventsRegex: /^onMedia/
82
+ });
83
+ const MuteButton = React.forwardRef(
84
+ ({ children, ...props }, forwardRef) => {
85
+ return /* @__PURE__ */ React.createElement(MuteButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
86
+ Primitive.button,
87
+ {
88
+ ...props2,
89
+ ref: composeRefs(props2.ref, forwardRef)
90
+ },
91
+ children
92
+ ));
93
+ }
94
+ );
95
+ MuteButton.displayName = "MuteButton";
96
+
97
+ const PIPButtonBridge = createReactComponent(PIPButtonInstance, {
98
+ domEventsRegex: /^onMedia/
99
+ });
100
+ const PIPButton = React.forwardRef(
101
+ ({ children, ...props }, forwardRef) => {
102
+ return /* @__PURE__ */ React.createElement(PIPButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
103
+ Primitive.button,
104
+ {
105
+ ...props2,
106
+ ref: composeRefs(props2.ref, forwardRef)
107
+ },
108
+ children
109
+ ));
110
+ }
111
+ );
112
+ PIPButton.displayName = "PIPButton";
113
+
114
+ const SeekButtonBridge = createReactComponent(SeekButtonInstance, {
115
+ domEventsRegex: /^onMedia/
116
+ });
117
+ const SeekButton = React.forwardRef(
118
+ ({ children, ...props }, forwardRef) => {
119
+ return /* @__PURE__ */ React.createElement(SeekButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
120
+ Primitive.button,
121
+ {
122
+ ...props2,
123
+ ref: composeRefs(props2.ref, forwardRef)
124
+ },
125
+ children
126
+ ));
127
+ }
128
+ );
129
+ SeekButton.displayName = "SeekButton";
130
+
131
+ const LiveButtonBridge = createReactComponent(LiveButtonInstance, {
132
+ domEventsRegex: /^onMedia/
133
+ });
134
+ const LiveButton = React.forwardRef(
135
+ ({ children, ...props }, forwardRef) => {
136
+ return /* @__PURE__ */ React.createElement(LiveButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
137
+ Primitive.button,
138
+ {
139
+ ...props2,
140
+ ref: composeRefs(props2.ref, forwardRef)
141
+ },
142
+ children
143
+ ));
144
+ }
145
+ );
146
+ LiveButton.displayName = "LiveButton";
147
+
148
+ const sliderCallbacks = [
149
+ "onDragStart",
150
+ "onDragEnd",
151
+ "onDragValueChange",
152
+ "onValueChange",
153
+ "onPointerValueChange"
154
+ ];
155
+
156
+ const SliderValueBridge = createReactComponent(SliderValueInstance);
157
+
158
+ const SliderBridge = createReactComponent(SliderInstance, {
159
+ events: sliderCallbacks
160
+ });
161
+ const Root$5 = React.forwardRef(({ children, ...props }, forwardRef) => {
162
+ return /* @__PURE__ */ React.createElement(SliderBridge, { ...props, ref: forwardRef }, (props2) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props2 }, children));
163
+ });
164
+ Root$5.displayName = "Slider";
165
+ const Thumb = React.forwardRef((props, forwardRef) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }));
166
+ Thumb.displayName = "SliderThumb";
167
+ const Track = React.forwardRef((props, forwardRef) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }));
168
+ Track.displayName = "SliderTrack";
169
+ const TrackFill = React.forwardRef((props, forwardRef) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }));
170
+ TrackFill.displayName = "SliderTrackFill";
171
+ const PreviewBridge = createReactComponent(SliderPreviewInstance);
172
+ const Preview = React.forwardRef(
173
+ ({ children, ...props }, forwardRef) => {
174
+ return /* @__PURE__ */ React.createElement(PreviewBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
175
+ Primitive.div,
176
+ {
177
+ ...props2,
178
+ ref: composeRefs(props2.ref, forwardRef)
179
+ },
180
+ children
181
+ ));
182
+ }
183
+ );
184
+ Preview.displayName = "SliderPreview";
185
+ const Value = React.forwardRef(({ children, ...props }, forwardRef) => {
186
+ return /* @__PURE__ */ React.createElement(SliderValueBridge, { ...props }, (props2, instance) => {
187
+ const $text = useSignal(() => instance.getValueText(), instance);
188
+ return /* @__PURE__ */ React.createElement(Primitive.div, { ...props2, ref: forwardRef }, $text, children);
189
+ });
190
+ });
191
+ Value.displayName = "SliderValue";
192
+ const Steps = React.forwardRef(({ children, ...props }, forwardRef) => {
193
+ const $min = useSliderState("min"), $max = useSliderState("max"), $step = useSliderState("step"), steps = ($max - $min) / $step;
194
+ return /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }, Array.from({ length: Math.floor(steps) + 1 }).map((_, step) => children(step)));
195
+ });
196
+ Steps.displayName = "SliderSteps";
197
+
198
+ var slider = /*#__PURE__*/Object.freeze({
199
+ __proto__: null,
200
+ Preview: Preview,
201
+ Root: Root$5,
202
+ Steps: Steps,
203
+ Thumb: Thumb,
204
+ Track: Track,
205
+ TrackFill: TrackFill,
206
+ Value: Value
207
+ });
208
+
209
+ const VolumeSliderBridge = createReactComponent(VolumeSliderInstance, {
210
+ events: sliderCallbacks,
211
+ domEventsRegex: /^onMedia/
212
+ });
213
+ const Root$4 = React.forwardRef(
214
+ ({ children, ...props }, forwardRef) => {
215
+ return /* @__PURE__ */ React.createElement(VolumeSliderBridge, { ...props, ref: forwardRef }, (props2) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props2 }, children));
216
+ }
217
+ );
218
+ Root$4.displayName = "VolumeSlider";
219
+
220
+ var volumeSlider = /*#__PURE__*/Object.freeze({
221
+ __proto__: null,
222
+ Preview: Preview,
223
+ Root: Root$4,
224
+ Steps: Steps,
225
+ Thumb: Thumb,
226
+ Track: Track,
227
+ TrackFill: TrackFill,
228
+ Value: Value
229
+ });
230
+
231
+ function createVTTCue(startTime = 0, endTime = 0, text = "") {
232
+ if (IS_SERVER) {
233
+ return {
234
+ startTime,
235
+ endTime,
236
+ text,
237
+ addEventListener: noop,
238
+ removeEventListener: noop,
239
+ dispatchEvent: noop
240
+ };
241
+ }
242
+ return new window.VTTCue(startTime, endTime, text);
243
+ }
244
+ function appendParamsToURL(baseUrl, params) {
245
+ const url = new URL(baseUrl);
246
+ for (const key of Object.keys(params)) {
247
+ url.searchParams.set(key, params[key] + "");
248
+ }
249
+ return url.toString();
250
+ }
251
+
252
+ const ThumbnailBridge = createReactComponent(ThumbnailInstance);
253
+ const Root$3 = React.forwardRef(({ children, ...props }, forwardRef) => {
254
+ return /* @__PURE__ */ React.createElement(ThumbnailBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
255
+ Primitive.div,
256
+ {
257
+ ...props2,
258
+ ref: composeRefs(props2.ref, forwardRef)
259
+ },
260
+ children
261
+ ));
262
+ });
263
+ Root$3.displayName = "Thumbnail";
264
+ const Img = React.forwardRef(({ children, ...props }, forwardRef) => {
265
+ const { src, img, crossOrigin } = useStateContext(ThumbnailInstance.state), $src = useSignal(src), $crossOrigin = useSignal(crossOrigin);
266
+ return /* @__PURE__ */ React.createElement(
267
+ Primitive.img,
268
+ {
269
+ crossOrigin: $crossOrigin,
270
+ ...props,
271
+ src: $src || void 0,
272
+ ref: composeRefs(img.set, forwardRef)
273
+ },
274
+ children
275
+ );
276
+ });
277
+ Img.displayName = "ThumbnailImg";
278
+
279
+ var thumbnail = /*#__PURE__*/Object.freeze({
280
+ __proto__: null,
281
+ Img: Img,
282
+ Root: Root$3
283
+ });
284
+
285
+ const TimeSliderContext = React.createContext({
286
+ $chapters: signal(null)
287
+ });
288
+ TimeSliderContext.displayName = "TimeSliderContext";
289
+ const TimeSliderBridge = createReactComponent(TimeSliderInstance, {
290
+ events: sliderCallbacks,
291
+ domEventsRegex: /^onMedia/
292
+ });
293
+ const Root$2 = React.forwardRef(
294
+ ({ children, ...props }, forwardRef) => {
295
+ const $chapters = React.useMemo(() => signal(null), []);
296
+ return /* @__PURE__ */ React.createElement(TimeSliderContext.Provider, { value: { $chapters } }, /* @__PURE__ */ React.createElement(TimeSliderBridge, { ...props, ref: forwardRef }, (props2) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props2 }, children)));
297
+ }
298
+ );
299
+ Root$2.displayName = "TimeSlider";
300
+ const SliderChaptersBridge = createReactComponent(SliderChaptersInstance);
301
+ const Chapters = React.forwardRef(
302
+ ({ children, ...props }, forwardRef) => {
303
+ return /* @__PURE__ */ React.createElement(SliderChaptersBridge, { ...props }, (props2, instance) => /* @__PURE__ */ React.createElement(
304
+ Primitive.div,
305
+ {
306
+ ...props2,
307
+ ref: composeRefs(props2.ref, forwardRef)
308
+ },
309
+ /* @__PURE__ */ React.createElement(ChapterTracks, { instance }, children)
310
+ ));
311
+ }
312
+ );
313
+ Chapters.displayName = "SliderChapters";
314
+ function ChapterTracks({ instance, children }) {
315
+ const $cues = useSignal(() => instance.cues, instance), refs = React.useRef([]), emptyCue = React.useRef(null), { $chapters } = React.useContext(TimeSliderContext);
316
+ if (!emptyCue.current) {
317
+ emptyCue.current = createVTTCue();
318
+ }
319
+ React.useEffect(() => {
320
+ $chapters.set(instance);
321
+ return () => void $chapters.set(null);
322
+ }, [instance]);
323
+ React.useEffect(() => {
324
+ instance.setRefs(refs.current);
325
+ }, [$cues]);
326
+ return children($cues.length ? $cues : [emptyCue.current], (el) => {
327
+ if (!el) {
328
+ refs.current.length = 0;
329
+ return;
330
+ }
331
+ refs.current.push(el);
332
+ });
333
+ }
334
+ ChapterTracks.displayName = "SliderChapterTracks";
335
+ const ChapterTitle = React.forwardRef(
336
+ ({ children, ...props }, forwardRef) => {
337
+ const { $chapters } = React.useContext(TimeSliderContext), [title, setTitle] = React.useState();
338
+ React.useEffect(() => {
339
+ return effect(() => {
340
+ const chapters = $chapters(), cue = chapters?.activePointerCue || chapters?.activeCue;
341
+ setTitle(cue?.text || "");
342
+ });
343
+ }, []);
344
+ return /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }, title, children);
345
+ }
346
+ );
347
+ ChapterTitle.displayName = "SliderChapterTitle";
348
+ const Progress = React.forwardRef((props, forwardRef) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }));
349
+ Progress.displayName = "SliderProgress";
350
+ const SliderThumbnailBridge = createReactComponent(SliderThumbnailInstance);
351
+ const ThumbnailRoot = React.forwardRef(
352
+ ({ children, ...props }, forwardRef) => {
353
+ return /* @__PURE__ */ React.createElement(SliderThumbnailBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props2, ref: composeRefs(props2.ref, forwardRef) }, children));
354
+ }
355
+ );
356
+ ThumbnailRoot.displayName = "SliderThumbnail";
357
+ const Thumbnail = {
358
+ Root: ThumbnailRoot,
359
+ Img: Img
360
+ };
361
+ const VideoBridge = createReactComponent(SliderVideoInstance, {
362
+ events: ["onCanPlay", "onError"]
363
+ });
364
+ const Video = React.forwardRef(
365
+ ({ children, ...props }, forwardRef) => {
366
+ return /* @__PURE__ */ React.createElement(VideoBridge, { ...props }, (props2, instance) => /* @__PURE__ */ React.createElement(
367
+ VideoProvider,
368
+ {
369
+ ...props2,
370
+ instance,
371
+ ref: composeRefs(props2.ref, forwardRef)
372
+ },
373
+ children
374
+ ));
375
+ }
376
+ );
377
+ Video.displayName = "SliderVideo";
378
+ const VideoProvider = React.forwardRef(
379
+ ({ instance, children, ...props }, forwardRef) => {
380
+ const { canLoad } = useStateContext(mediaState), { src, video, crossOrigin } = instance.$state, $src = useSignal(src), $canLoad = useSignal(canLoad), $crossOrigin = useSignal(crossOrigin);
381
+ return /* @__PURE__ */ React.createElement(
382
+ Primitive.video,
383
+ {
384
+ style: { maxWidth: "unset" },
385
+ ...props,
386
+ src: $src || void 0,
387
+ muted: true,
388
+ playsInline: true,
389
+ preload: $canLoad ? "auto" : "none",
390
+ crossOrigin: $crossOrigin || void 0,
391
+ ref: composeRefs(video.set, forwardRef)
392
+ },
393
+ children
394
+ );
395
+ }
396
+ );
397
+ VideoProvider.displayName = "SliderVideoProvider";
398
+
399
+ var timeSlider = /*#__PURE__*/Object.freeze({
400
+ __proto__: null,
401
+ ChapterTitle: ChapterTitle,
402
+ Chapters: Chapters,
403
+ Preview: Preview,
404
+ Progress: Progress,
405
+ Root: Root$2,
406
+ Steps: Steps,
407
+ Thumb: Thumb,
408
+ Thumbnail: Thumbnail,
409
+ Track: Track,
410
+ TrackFill: TrackFill,
411
+ Value: Value,
412
+ Video: Video
413
+ });
414
+
415
+ const RadioGroupBridge = createReactComponent(RadioGroupInstance, {
416
+ events: ["onChange"]
417
+ });
418
+ const Root$1 = React.forwardRef(
419
+ ({ children, ...props }, forwardRef) => {
420
+ return /* @__PURE__ */ React.createElement(RadioGroupBridge, { ...props, ref: forwardRef }, (props2) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props2 }, children));
421
+ }
422
+ );
423
+ Root$1.displayName = "RadioGroup";
424
+ const ItemBridge$1 = createReactComponent(RadioInstance, {
425
+ events: ["onChange", "onSelect"]
426
+ });
427
+ const Item$1 = React.forwardRef(({ children, ...props }, forwardRef) => {
428
+ return /* @__PURE__ */ React.createElement(ItemBridge$1, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
429
+ Primitive.div,
430
+ {
431
+ ...props2,
432
+ ref: composeRefs(props2.ref, forwardRef)
433
+ },
434
+ children
435
+ ));
436
+ });
437
+ Item$1.displayName = "RadioItem";
438
+
439
+ var radioGroup = /*#__PURE__*/Object.freeze({
440
+ __proto__: null,
441
+ Item: Item$1,
442
+ Root: Root$1
443
+ });
444
+
445
+ const MenuBridge = createReactComponent(MenuInstance, {
446
+ events: ["onOpen", "onClose"],
447
+ domEventsRegex: /^onMedia/
448
+ });
449
+ const Root = React.forwardRef(({ children, ...props }, forwardRef) => {
450
+ return /* @__PURE__ */ React.createElement(MenuBridge, { ...props, ref: forwardRef }, (props2, instance) => /* @__PURE__ */ React.createElement(
451
+ Primitive.div,
452
+ {
453
+ ...props2,
454
+ style: { display: !instance.isSubmenu ? "contents" : void 0, ...props2.style }
455
+ },
456
+ children
457
+ ));
458
+ });
459
+ Root.displayName = "Menu";
460
+ const ButtonBridge = createReactComponent(MenuButtonInstance, {
461
+ events: ["onSelect"]
462
+ });
463
+ const Button = React.forwardRef(
464
+ ({ children, ...props }, forwardRef) => {
465
+ return /* @__PURE__ */ React.createElement(ButtonBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
466
+ Primitive.button,
467
+ {
468
+ ...props2,
469
+ ref: composeRefs(props2.ref, forwardRef)
470
+ },
471
+ children
472
+ ));
473
+ }
474
+ );
475
+ Button.displayName = "MenuButton";
476
+ const Portal = React.forwardRef(
477
+ ({ container = null, disabled = false, children, ...props }, forwardRef) => {
478
+ let fullscreen = useMediaState("fullscreen"), shouldPortal = disabled === "fullscreen" ? !fullscreen : !disabled;
479
+ const target = React.useMemo(() => {
480
+ if (IS_SERVER) return null;
481
+ const node = isString(container) ? document.querySelector(container) : container;
482
+ return node ?? document.body;
483
+ }, [container]);
484
+ return !target || !shouldPortal ? children : createPortal(
485
+ /* @__PURE__ */ React.createElement(
486
+ Primitive.div,
487
+ {
488
+ ...props,
489
+ style: { display: "contents", ...props.style },
490
+ ref: forwardRef
491
+ },
492
+ children
493
+ ),
494
+ target
495
+ );
496
+ }
497
+ );
498
+ Portal.displayName = "MenuPortal";
499
+ const ItemsBridge = createReactComponent(MenuItemsInstance);
500
+ const Items = React.forwardRef(({ children, ...props }, forwardRef) => {
501
+ return /* @__PURE__ */ React.createElement(ItemsBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
502
+ Primitive.div,
503
+ {
504
+ ...props2,
505
+ ref: composeRefs(props2.ref, forwardRef)
506
+ },
507
+ children
508
+ ));
509
+ });
510
+ Items.displayName = "MenuItems";
511
+ const ItemBridge = createReactComponent(MenuItemInstance);
512
+ const Item = React.forwardRef(({ children, ...props }, forwardRef) => {
513
+ return /* @__PURE__ */ React.createElement(ItemBridge, { ...props }, (props2) => /* @__PURE__ */ React.createElement(
514
+ Primitive.div,
515
+ {
516
+ ...props2,
517
+ ref: composeRefs(props2.ref, forwardRef)
518
+ },
519
+ children
520
+ ));
521
+ });
522
+ Item.displayName = "MenuItem";
523
+
524
+ var menu = /*#__PURE__*/Object.freeze({
525
+ __proto__: null,
526
+ Button: Button,
527
+ Content: Items,
528
+ Item: Item,
529
+ Items: Items,
530
+ Portal: Portal,
531
+ Radio: Item$1,
532
+ RadioGroup: Root$1,
533
+ Root: Root
534
+ });
535
+
536
+ const GestureBridge = createReactComponent(GestureInstance, {
537
+ events: ["onWillTrigger", "onTrigger"]
538
+ });
539
+ const Gesture = React.forwardRef(
540
+ ({ children, ...props }, forwardRef) => {
541
+ return /* @__PURE__ */ React.createElement(GestureBridge, { ...props, ref: forwardRef }, (props2) => /* @__PURE__ */ React.createElement(Primitive.div, { ...props2 }, children));
542
+ }
543
+ );
544
+ Gesture.displayName = "Gesture";
545
+
546
+ const TimeBridge = createReactComponent(TimeInstance);
547
+ const Time = React.forwardRef(({ children, ...props }, forwardRef) => {
548
+ return /* @__PURE__ */ React.createElement(TimeBridge, { ...props }, (props2, instance) => /* @__PURE__ */ React.createElement(
549
+ TimeText,
550
+ {
551
+ ...props2,
552
+ instance,
553
+ ref: composeRefs(props2.ref, forwardRef)
554
+ },
555
+ children
556
+ ));
557
+ });
558
+ Time.displayName = "Time";
559
+ const TimeText = React.forwardRef(
560
+ ({ instance, children, ...props }, forwardRef) => {
561
+ const { timeText } = instance.$state, $timeText = useSignal(timeText);
562
+ return /* @__PURE__ */ React.createElement(Primitive.div, { ...props, ref: forwardRef }, $timeText, children);
563
+ }
564
+ );
565
+ TimeText.displayName = "TimeText";
566
+
567
+ function useMediaPlayer() {
568
+ const context = useMediaContext();
569
+ return context?.player || null;
570
+ }
571
+
572
+ function useAudioOptions() {
573
+ const media = useMediaContext(), { audioTracks, audioTrack } = media.$state, $audioTracks = useSignal(audioTracks);
574
+ useSignal(audioTrack);
575
+ return React.useMemo(() => {
576
+ const options = $audioTracks.map((track) => ({
577
+ track,
578
+ label: track.label,
579
+ value: getTrackValue$1(track),
580
+ get selected() {
581
+ return audioTrack() === track;
582
+ },
583
+ select(trigger) {
584
+ const index = audioTracks().indexOf(track);
585
+ if (index >= 0) media.remote.changeAudioTrack(index, trigger);
586
+ }
587
+ }));
588
+ Object.defineProperty(options, "disabled", {
589
+ get() {
590
+ return options.length <= 1;
591
+ }
592
+ });
593
+ Object.defineProperty(options, "selectedTrack", {
594
+ get() {
595
+ return audioTrack();
596
+ }
597
+ });
598
+ Object.defineProperty(options, "selectedValue", {
599
+ get() {
600
+ const track = audioTrack();
601
+ return track ? getTrackValue$1(track) : void 0;
602
+ }
603
+ });
604
+ return options;
605
+ }, [$audioTracks]);
606
+ }
607
+ function getTrackValue$1(track) {
608
+ return track.label.toLowerCase();
609
+ }
610
+
611
+ function useCaptionOptions({ off = true } = {}) {
612
+ const media = useMediaContext(), { textTracks, textTrack } = media.$state, $textTracks = useSignal(textTracks);
613
+ useSignal(textTrack);
614
+ return React.useMemo(() => {
615
+ const captionTracks = $textTracks.filter(isTrackCaptionKind), options = captionTracks.map((track) => ({
616
+ track,
617
+ label: track.label,
618
+ value: getTrackValue(track),
619
+ get selected() {
620
+ return textTrack() === track;
621
+ },
622
+ select(trigger) {
623
+ const index = textTracks().indexOf(track);
624
+ if (index >= 0) media.remote.changeTextTrackMode(index, "showing", trigger);
625
+ }
626
+ }));
627
+ if (off) {
628
+ options.unshift({
629
+ track: null,
630
+ label: isString(off) ? off : "Off",
631
+ value: "off",
632
+ get selected() {
633
+ return !textTrack();
634
+ },
635
+ select(trigger) {
636
+ media.remote.toggleCaptions(trigger);
637
+ }
638
+ });
639
+ }
640
+ Object.defineProperty(options, "disabled", {
641
+ get() {
642
+ return !captionTracks.length;
643
+ }
644
+ });
645
+ Object.defineProperty(options, "selectedTrack", {
646
+ get() {
647
+ return textTrack();
648
+ }
649
+ });
650
+ Object.defineProperty(options, "selectedValue", {
651
+ get() {
652
+ const track = textTrack();
653
+ return track ? getTrackValue(track) : "off";
654
+ }
655
+ });
656
+ return options;
657
+ }, [$textTracks]);
658
+ }
659
+ function getTrackValue(track) {
660
+ return track.id + ":" + track.kind + "-" + track.label.toLowerCase();
661
+ }
662
+
663
+ export { AirPlayButton, Button, CaptionButton, ChapterTitle, Chapters, FullscreenButton, Gesture, Img, Item$1 as Item, Items, LiveButton, MuteButton, PIPButton, PlayButton, Portal, Preview, Progress, Root$3 as Root, Root$2 as Root$1, Root as Root$2, Root$1 as Root$3, Root$4, Root$5, SeekButton, Steps, Thumb, Thumbnail, Time, Track, TrackFill, Value, appendParamsToURL, menu, radioGroup, slider, sliderCallbacks, thumbnail, timeSlider, useAudioOptions, useCaptionOptions, useMediaContext, useMediaPlayer, volumeSlider };