@hanifhan1f/vidstack-react 1.12.25 → 1.12.30

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 (46) hide show
  1. package/dev/chunks/vidstack-BalWqr4j.js +1422 -0
  2. package/dev/chunks/vidstack-CKsUl4ll.js +1384 -0
  3. package/dev/chunks/vidstack-CqNX679o.js +669 -0
  4. package/dev/chunks/vidstack-D3ZXOE4d.js +643 -0
  5. package/dev/chunks/vidstack-DjqYvkVp.js +84 -0
  6. package/dev/chunks/vidstack-DqaqkU4T.js +9 -0
  7. package/dev/chunks/vidstack-FuCbl228.js +226 -0
  8. package/dev/chunks/vidstack-PREbBNMG.js +125 -0
  9. package/dev/chunks/vidstack-gqKBE4xH.js +376 -0
  10. package/dev/player/vidstack-default-components.js +9 -8
  11. package/dev/player/vidstack-default-icons.js +1 -1
  12. package/dev/player/vidstack-default-layout.js +9 -8
  13. package/dev/player/vidstack-plyr-layout.js +77 -63
  14. package/dev/player/vidstack-remotion.js +6 -6
  15. package/dev/vidstack.js +22 -133
  16. package/package.json +1 -1
  17. package/prod/chunks/vidstack-BCBskRpc.js +664 -0
  18. package/prod/chunks/vidstack-BZVrgeRF.js +9 -0
  19. package/prod/chunks/vidstack-CKapDFwB.js +376 -0
  20. package/prod/chunks/vidstack-CYK75vJF.js +1382 -0
  21. package/prod/chunks/vidstack-CtxjO6HG.js +84 -0
  22. package/prod/chunks/vidstack-D91K36KQ.js +206 -0
  23. package/prod/chunks/vidstack-DJThTSEm.js +125 -0
  24. package/prod/chunks/vidstack-DXSNXDnS.js +1384 -0
  25. package/prod/chunks/vidstack-DdiGCJVp.js +504 -0
  26. package/prod/player/vidstack-default-components.js +9 -8
  27. package/prod/player/vidstack-default-icons.js +1 -1
  28. package/prod/player/vidstack-default-layout.js +9 -8
  29. package/prod/player/vidstack-plyr-layout.js +77 -63
  30. package/prod/player/vidstack-remotion.js +6 -6
  31. package/prod/vidstack.js +22 -204
  32. package/server/chunks/vidstack-B4rJ1ZKK.js +376 -0
  33. package/server/chunks/vidstack-BTdEfKqV.js +84 -0
  34. package/server/chunks/vidstack-D4t_SZbb.js +1416 -0
  35. package/server/chunks/vidstack-DOIUveQF.js +504 -0
  36. package/server/chunks/vidstack-DbNoKLjz.js +664 -0
  37. package/server/chunks/vidstack-DeS67_gx.js +9 -0
  38. package/server/chunks/vidstack-DiHlnSws.js +1384 -0
  39. package/server/chunks/vidstack-DnoqxmOs.js +125 -0
  40. package/server/chunks/vidstack-SkX-mSrw.js +206 -0
  41. package/server/player/vidstack-default-components.js +9 -8
  42. package/server/player/vidstack-default-icons.js +1 -1
  43. package/server/player/vidstack-default-layout.js +9 -8
  44. package/server/player/vidstack-plyr-layout.js +77 -63
  45. package/server/player/vidstack-remotion.js +6 -6
  46. package/server/vidstack.js +22 -204
@@ -1,207 +1,25 @@
1
1
  "use client"
2
2
 
3
- import { TextTrackSymbol, RadioGroupController, useMediaContext, menuContext, Primitive, MediaPlayerInstance, MediaProviderInstance, isRemotionProvider, mediaState, TextTrack, ToggleButtonInstance, PosterInstance, useMediaState, ThumbnailsLoader, updateSliderPreviewPlacement } from './chunks/vidstack-BtitkRvR.js';
4
- export { ARIAKeyShortcuts, AUDIO_EXTENSIONS, AUDIO_TYPES, AirPlayButtonInstance, AudioGainSliderInstance, AudioProviderLoader, AudioTrackList, CaptionButtonInstance, CaptionsInstance, ControlsGroupInstance, ControlsInstance, DASHProviderLoader, DASH_VIDEO_EXTENSIONS, DASH_VIDEO_TYPES, FullscreenButtonInstance, FullscreenController, GestureInstance, GoogleCastButtonInstance, HLSProviderLoader, HLS_VIDEO_EXTENSIONS, HLS_VIDEO_TYPES, List, LiveButtonInstance, LocalMediaStorage, MEDIA_KEY_SHORTCUTS, MediaAnnouncerInstance, MediaControls, MediaRemoteControl, MenuButtonInstance, MenuInstance, MenuItemInstance, MenuItemsInstance, MenuPortalInstance, MuteButtonInstance, PIPButtonInstance, PlayButtonInstance, QualitySliderInstance, RadioGroupInstance, RadioInstance, ScreenOrientationController, SeekButtonInstance, SliderChaptersInstance, SliderInstance, SliderPreviewInstance, SliderThumbnailInstance, SliderValueInstance, SliderVideoInstance, SpeedSliderInstance, TextRenderers, TextTrackList, ThumbnailInstance, TimeInstance, TimeRange, TimeSliderInstance, TooltipContentInstance, TooltipInstance, TooltipTriggerInstance, VIDEO_EXTENSIONS, VIDEO_TYPES, VideoProviderLoader, VideoQualityList, VimeoProviderLoader, VolumeSliderInstance, YouTubeProviderLoader, boundTime, canChangeVolume, canFullscreen, canGoogleCastSrc, canOrientScreen, canPlayHLSNatively, canRotateScreen, canUsePictureInPicture, canUseVideoPresentation, findActiveCue, formatSpokenTime, formatTime, getDownloadFile, getTimeRangesEnd, getTimeRangesStart, isAudioProvider, isAudioSrc, isCueActive, isDASHProvider, isDASHSrc, isGoogleCastProvider, isHLSProvider, isHLSSrc, isHTMLAudioElement, isHTMLIFrameElement, isHTMLMediaElement, isHTMLVideoElement, isMediaStream, isTrackCaptionKind, isVideoProvider, isVideoQualitySrc, isVideoSrc, isVimeoProvider, isYouTubeProvider, mediaContext, normalizeTimeIntervals, parseJSONCaptionsFile, sliderState, softResetMediaState, sortVideoQualities, updateTimeIntervals, useMediaStore, useSliderState, useSliderStore, watchActiveTextTrack, watchCueTextChange } from './chunks/vidstack-BtitkRvR.js';
3
+ export * from 'vidstack/exports/core.ts';
4
+ export * from 'vidstack/exports/events.ts';
5
+ export * from 'vidstack/exports/foundation.ts';
6
+ export * from 'vidstack/exports/maverick.ts';
7
+ export * from 'vidstack/exports/providers.ts';
8
+ export * from 'vidstack/exports/utils.ts';
9
+ export { DEFAULT_AUDIO_GAINS, DEFAULT_PLAYBACK_RATES, sliderState } from 'vidstack/exports/components.ts';
10
+ import { Primitive, MediaPlayerInstance, MediaProviderInstance, isRemotionProvider, ToggleButtonInstance, PosterInstance, useMediaState } from './chunks/vidstack-SkX-mSrw.js';
11
+ export { AirPlayButtonInstance, AudioGainSliderInstance, CaptionButtonInstance, CaptionsInstance, ControlsGroupInstance, ControlsInstance, FullscreenButtonInstance, GestureInstance, GoogleCastButtonInstance, LiveButtonInstance, MediaAnnouncerInstance, MenuButtonInstance, MenuInstance, MenuItemInstance, MenuItemsInstance, MenuPortalInstance, MuteButtonInstance, PIPButtonInstance, PlayButtonInstance, QualitySliderInstance, RadioGroupInstance, RadioInstance, SeekButtonInstance, SliderChaptersInstance, SliderInstance, SliderPreviewInstance, SliderThumbnailInstance, SliderValueInstance, SliderVideoInstance, SpeedSliderInstance, ThumbnailInstance, TimeInstance, TimeSliderInstance, TooltipContentInstance, TooltipInstance, TooltipTriggerInstance, VolumeSliderInstance, useMediaStore, useSliderState, useSliderStore } from './chunks/vidstack-SkX-mSrw.js';
5
12
  import * as React from 'react';
6
- import { DOMEvent, isString, EventsController, prop, method, Component, hasProvidedContext, useContext, effect, createReactComponent, useStateContext, useSignal, composeRefs, useSignalRecord, useReactScope, signal } from './chunks/vidstack-D_bWd66h.js';
7
- export { appendTriggerEvent, findTriggerEvent, hasTriggerEvent, isKeyboardClick, isKeyboardEvent, isPointerEvent, walkTriggerEventChain } from './chunks/vidstack-D_bWd66h.js';
8
- import { createSignal, useScoped } from './chunks/vidstack-DH6N0AoF.js';
9
- export { audioGainSlider as AudioGainSlider, Captions, ChapterTitle, controls as Controls, GoogleCastButton, MediaAnnouncer, qualitySlider as QualitySlider, speedSlider as SpeedSlider, spinner as Spinner, Title, tooltip as Tooltip, useActiveTextCues, useActiveTextTrack, useChapterOptions, useChapterTitle, useTextCues } from './chunks/vidstack-DH6N0AoF.js';
10
- import { useMediaContext as useMediaContext$1 } from './chunks/vidstack-Dbs_rXUT.js';
11
- export { AirPlayButton, CaptionButton, FullscreenButton, Gesture, LiveButton, menu as Menu, MuteButton, PIPButton, PlayButton, radioGroup as RadioGroup, SeekButton, slider as Slider, thumbnail as Thumbnail, Time, timeSlider as TimeSlider, volumeSlider as VolumeSlider, useAudioOptions, useCaptionOptions, useMediaPlayer } from './chunks/vidstack-Dbs_rXUT.js';
13
+ import { createReactComponent, useStateContext, useSignal, isString, composeRefs, useSignalRecord, effect, useReactScope, signal, EventsController } from './chunks/vidstack-D4t_SZbb.js';
14
+ import { createSignal, useScoped } from './chunks/vidstack-B4rJ1ZKK.js';
15
+ export { audioGainSlider as AudioGainSlider, Captions, ChapterTitle, controls as Controls, GoogleCastButton, MediaAnnouncer, qualitySlider as QualitySlider, speedSlider as SpeedSlider, spinner as Spinner, Title, tooltip as Tooltip, useActiveTextCues, useActiveTextTrack, useChapterOptions, useChapterTitle, useTextCues } from './chunks/vidstack-B4rJ1ZKK.js';
16
+ import { mediaState, TextTrack, ThumbnailsLoader, updateSliderPreviewPlacement, DEFAULT_AUDIO_GAINS } from 'vidstack';
17
+ import { useMediaContext } from './chunks/vidstack-DbNoKLjz.js';
18
+ export { AirPlayButton, CaptionButton, FullscreenButton, Gesture, LiveButton, menu as Menu, MuteButton, PIPButton, PlayButton, radioGroup as RadioGroup, SeekButton, slider as Slider, thumbnail as Thumbnail, Time, timeSlider as TimeSlider, volumeSlider as VolumeSlider, useAudioOptions, useCaptionOptions, useMediaPlayer } from './chunks/vidstack-DbNoKLjz.js';
12
19
  import { Icon } from './chunks/vidstack-CBF7iUqu.js';
13
- export { DEFAULT_PLAYBACK_RATES, useMediaRemote, usePlaybackRateOptions, useVideoQualityOptions } from './chunks/vidstack-B3AXUfgF.js';
14
- import '@floating-ui/dom';
20
+ export { useMediaRemote, usePlaybackRateOptions, useVideoQualityOptions } from './chunks/vidstack-DnoqxmOs.js';
15
21
  import 'react-dom';
16
22
 
17
- const GROUPED_LOG = Symbol(0);
18
- class GroupedLog {
19
- constructor(logger, level, title, root, parent) {
20
- this.logger = logger;
21
- this.level = level;
22
- this.title = title;
23
- this.root = root;
24
- this.parent = parent;
25
- }
26
- [GROUPED_LOG] = true;
27
- logs = [];
28
- log(...data) {
29
- this.logs.push({ data });
30
- return this;
31
- }
32
- labelledLog(label, ...data) {
33
- this.logs.push({ label, data });
34
- return this;
35
- }
36
- groupStart(title) {
37
- return new GroupedLog(this.logger, this.level, title, this.root ?? this, this);
38
- }
39
- groupEnd() {
40
- this.parent?.logs.push(this);
41
- return this.parent ?? this;
42
- }
43
- dispatch() {
44
- return this.logger.dispatch(this.level, this.root ?? this);
45
- }
46
- }
47
-
48
- class Logger {
49
- #target = null;
50
- error(...data) {
51
- return this.dispatch("error", ...data);
52
- }
53
- warn(...data) {
54
- return this.dispatch("warn", ...data);
55
- }
56
- info(...data) {
57
- return this.dispatch("info", ...data);
58
- }
59
- debug(...data) {
60
- return this.dispatch("debug", ...data);
61
- }
62
- errorGroup(title) {
63
- return new GroupedLog(this, "error", title);
64
- }
65
- warnGroup(title) {
66
- return new GroupedLog(this, "warn", title);
67
- }
68
- infoGroup(title) {
69
- return new GroupedLog(this, "info", title);
70
- }
71
- debugGroup(title) {
72
- return new GroupedLog(this, "debug", title);
73
- }
74
- setTarget(newTarget) {
75
- this.#target = newTarget;
76
- }
77
- dispatch(level, ...data) {
78
- return this.#target?.dispatchEvent(
79
- new DOMEvent("vds-log", {
80
- bubbles: true,
81
- composed: true,
82
- detail: { level, data }
83
- })
84
- ) || false;
85
- }
86
- }
87
-
88
- class LibASSTextRenderer {
89
- constructor(loader, config) {
90
- this.loader = loader;
91
- this.config = config;
92
- }
93
- priority = 1;
94
- #instance = null;
95
- #track = null;
96
- #typeRE = /(ssa|ass)$/;
97
- canRender(track, video) {
98
- return !!video && !!track.src && (isString(track.type) && this.#typeRE.test(track.type) || this.#typeRE.test(track.src));
99
- }
100
- attach(video) {
101
- if (!video) return;
102
- this.loader().then(async (mod) => {
103
- this.#instance = new mod.default({
104
- ...this.config,
105
- video,
106
- subUrl: this.#track?.src || ""
107
- });
108
- new EventsController(this.#instance).add("ready", () => {
109
- const canvas = this.#instance?._canvas;
110
- if (canvas) canvas.style.pointerEvents = "none";
111
- }).add("error", (event) => {
112
- if (!this.#track) return;
113
- this.#track[TextTrackSymbol.readyState] = 3;
114
- this.#track.dispatchEvent(
115
- new DOMEvent("error", {
116
- trigger: event,
117
- detail: event.error
118
- })
119
- );
120
- });
121
- });
122
- }
123
- changeTrack(track) {
124
- if (!track || track.readyState === 3) {
125
- this.#freeTrack();
126
- } else if (this.#track !== track) {
127
- this.#instance?.setTrackByUrl(track.src);
128
- this.#track = track;
129
- }
130
- }
131
- detach() {
132
- this.#freeTrack();
133
- }
134
- #freeTrack() {
135
- this.#instance?.freeTrack();
136
- this.#track = null;
137
- }
138
- }
139
-
140
- const DEFAULT_AUDIO_GAINS = [1, 1.25, 1.5, 1.75, 2, 2.5, 3, 4];
141
- class AudioGainRadioGroup extends Component {
142
- static props = {
143
- normalLabel: "Disabled",
144
- gains: DEFAULT_AUDIO_GAINS
145
- };
146
- #media;
147
- #menu;
148
- #controller;
149
- get value() {
150
- return this.#controller.value;
151
- }
152
- get disabled() {
153
- const { gains } = this.$props, { canSetAudioGain } = this.#media.$state;
154
- return !canSetAudioGain() || gains().length === 0;
155
- }
156
- constructor() {
157
- super();
158
- this.#controller = new RadioGroupController();
159
- this.#controller.onValueChange = this.#onValueChange.bind(this);
160
- }
161
- onSetup() {
162
- this.#media = useMediaContext();
163
- if (hasProvidedContext(menuContext)) {
164
- this.#menu = useContext(menuContext);
165
- }
166
- }
167
- onConnect(el) {
168
- effect(this.#watchValue.bind(this));
169
- effect(this.#watchHintText.bind(this));
170
- effect(this.#watchControllerDisabled.bind(this));
171
- }
172
- getOptions() {
173
- const { gains, normalLabel } = this.$props;
174
- return gains().map((gain) => ({
175
- label: gain === 1 || gain === null ? normalLabel : String(gain * 100) + "%",
176
- value: gain.toString()
177
- }));
178
- }
179
- #watchValue() {
180
- this.#controller.value = this.#getValue();
181
- }
182
- #watchHintText() {
183
- const { normalLabel } = this.$props, { audioGain } = this.#media.$state, gain = audioGain();
184
- this.#menu?.hint.set(gain === 1 || gain == null ? normalLabel() : String(gain * 100) + "%");
185
- }
186
- #watchControllerDisabled() {
187
- this.#menu?.disable(this.disabled);
188
- }
189
- #getValue() {
190
- const { audioGain } = this.#media.$state;
191
- return audioGain()?.toString() ?? "1";
192
- }
193
- #onValueChange(value, trigger) {
194
- if (this.disabled) return;
195
- const gain = +value;
196
- this.#media.remote.changeAudioGain(gain, trigger);
197
- this.dispatch("change", { detail: gain, trigger });
198
- }
199
- }
200
- const audiogainradiogroup__proto = AudioGainRadioGroup.prototype;
201
- prop(audiogainradiogroup__proto, "value");
202
- prop(audiogainradiogroup__proto, "disabled");
203
- method(audiogainradiogroup__proto, "getOptions");
204
-
205
23
  const playerCallbacks = [
206
24
  "onAbort",
207
25
  "onAudioTrackChange",
@@ -296,10 +114,10 @@ const MediaProvider = React.forwardRef(
296
114
  );
297
115
  MediaProvider.displayName = "MediaProvider";
298
116
  function MediaOutlet({ provider, mediaProps, iframeProps }) {
299
- const { sources, crossOrigin, poster, remotePlaybackInfo, nativeControls, viewType } = useStateContext(mediaState), { loader } = provider.$state, { $provider: $$provider, $providerSetup: $$providerSetup } = useMediaContext$1(), $sources = useSignal(sources), $nativeControls = useSignal(nativeControls), $crossOrigin = useSignal(crossOrigin), $poster = useSignal(poster), $loader = useSignal(loader), $provider = useSignal($$provider), $providerSetup = useSignal($$providerSetup), $remoteInfo = useSignal(remotePlaybackInfo), $mediaType = $loader?.mediaType(), $viewType = useSignal(viewType), isAudioView = $viewType === "audio", isYouTubeEmbed = $loader?.name === "youtube", isVimeoEmbed = $loader?.name === "vimeo", isEmbed = isYouTubeEmbed || isVimeoEmbed, isRemotion = $loader?.name === "remotion", isGoogleCast = $loader?.name === "google-cast", [googleCastIconPaths, setGoogleCastIconPaths] = React.useState(""), [hasMounted, setHasMounted] = React.useState(false);
117
+ const { sources, crossOrigin, poster, remotePlaybackInfo, nativeControls, viewType } = useStateContext(mediaState), { loader } = provider.$state, { $provider: $$provider, $providerSetup: $$providerSetup } = useMediaContext(), $sources = useSignal(sources), $nativeControls = useSignal(nativeControls), $crossOrigin = useSignal(crossOrigin), $poster = useSignal(poster), $loader = useSignal(loader), $provider = useSignal($$provider), $providerSetup = useSignal($$providerSetup), $remoteInfo = useSignal(remotePlaybackInfo), $mediaType = $loader?.mediaType(), $viewType = useSignal(viewType), isAudioView = $viewType === "audio", isYouTubeEmbed = $loader?.name === "youtube", isVimeoEmbed = $loader?.name === "vimeo", isEmbed = isYouTubeEmbed || isVimeoEmbed, isRemotion = $loader?.name === "remotion", isGoogleCast = $loader?.name === "google-cast", [googleCastIconPaths, setGoogleCastIconPaths] = React.useState(""), [hasMounted, setHasMounted] = React.useState(false);
300
118
  React.useEffect(() => {
301
119
  if (!isGoogleCast || googleCastIconPaths) return;
302
- import('./chunks/vidstack-D_bWd66h.js').then(function (n) { return n.chromecast; }).then((mod) => {
120
+ import('./chunks/vidstack-D4t_SZbb.js').then(function (n) { return n.chromecast; }).then((mod) => {
303
121
  setGoogleCastIconPaths(mod.default);
304
122
  });
305
123
  }, [isGoogleCast]);
@@ -363,7 +181,7 @@ function MediaOutlet({ provider, mediaProps, iframeProps }) {
363
181
  MediaOutlet.displayName = "MediaOutlet";
364
182
 
365
183
  function createTextTrack(init) {
366
- const media = useMediaContext$1(), track = React.useMemo(() => new TextTrack(init), Object.values(init));
184
+ const media = useMediaContext(), track = React.useMemo(() => new TextTrack(init), Object.values(init));
367
185
  React.useEffect(() => {
368
186
  media.textTracks.add(track);
369
187
  return () => void media.textTracks.remove(track);
@@ -500,7 +318,7 @@ function useStore(ctor, ref) {
500
318
  }
501
319
 
502
320
  function useMediaProvider() {
503
- const [provider, setProvider] = React.useState(null), context = useMediaContext$1();
321
+ const [provider, setProvider] = React.useState(null), context = useMediaContext();
504
322
  React.useEffect(() => {
505
323
  if (!context) return;
506
324
  return effect(() => {
@@ -613,7 +431,7 @@ function useAudioGainOptions({
613
431
  gains = DEFAULT_AUDIO_GAINS,
614
432
  disabledLabel = "disabled"
615
433
  } = {}) {
616
- const media = useMediaContext$1(), { audioGain, canSetAudioGain } = media.$state;
434
+ const media = useMediaContext(), { audioGain, canSetAudioGain } = media.$state;
617
435
  useSignal(audioGain);
618
436
  useSignal(canSetAudioGain);
619
437
  return React.useMemo(() => {
@@ -645,4 +463,4 @@ function useAudioGainOptions({
645
463
  }, [gains]);
646
464
  }
647
465
 
648
- export { caption as Caption, DEFAULT_AUDIO_GAINS, Icon, LibASSTextRenderer, Logger, MediaPlayer, MediaPlayerInstance, MediaProvider, MediaProviderInstance, Poster, PosterInstance, TextTrack, ToggleButton, ToggleButtonInstance, Track, createTextTrack, mediaState, useActiveThumbnail, useAudioGainOptions, useMediaContext$1 as useMediaContext, useMediaProvider, useMediaState, useSliderPreview, useState, useStore, useThumbnails };
466
+ export { caption as Caption, Icon, MediaPlayer, MediaPlayerInstance, MediaProvider, MediaProviderInstance, Poster, PosterInstance, ToggleButton, ToggleButtonInstance, Track, createTextTrack, useActiveThumbnail, useAudioGainOptions, useMediaContext, useMediaProvider, useMediaState, useSliderPreview, useState, useStore, useThumbnails };