@remotion/player - npm Package Compare versions

Comparing version 2.4.0-alpha.47569d29 to 2.4.0-alpha.90748bec

dist/Player.d.ts

@@ -23,4 +23,5 @@ import React, { MutableRefObject } from 'react';
     spaceKeyToPlayOrPause?: boolean;
+    numberOfSharedAudioTags?: number;
 } & PropsIfHasProps<T> & CompProps<T>;
-export declare const PlayerFn: <T>({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls, loop, autoPlay, showVolumeControls, allowFullscreen, clickToPlay, doubleClickToFullscreen, spaceKeyToPlayOrPause, ...componentProps }: PlayerProps<T>, ref: MutableRefObject<PlayerRef>) => JSX.Element;
+export declare const PlayerFn: <T>({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls, loop, autoPlay, showVolumeControls, allowFullscreen, clickToPlay, doubleClickToFullscreen, spaceKeyToPlayOrPause, numberOfSharedAudioTags, ...componentProps }: PlayerProps<T>, ref: MutableRefObject<PlayerRef>) => JSX.Element;
 declare module 'react' {
@@ -27,0 +28,0 @@ function forwardRef<T, P = {}>(render: (props: P, ref: React.MutableRefObject<T>) => React.ReactElement | null): (props: P & React.RefAttributes<T>) => React.ReactElement | null;

dist/Player.js

@@ -16,3 +16,4 @@ "use strict";
 remotion_1.Internals.CSSUtils.injectCSS(remotion_1.Internals.CSSUtils.makeDefaultCSS(`.${player_css_classname_1.PLAYER_CSS_CLASSNAME}`));
-const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay, doubleClickToFullscreen = false, spaceKeyToPlayOrPause = true, ...componentProps }, ref) => {
+// eslint-disable-next-line complexity
+const PlayerFn = ({ durationInFrames, compositionHeight, compositionWidth, fps, inputProps, style, controls = false, loop = false, autoPlay = false, showVolumeControls = true, allowFullscreen = true, clickToPlay, doubleClickToFullscreen = false, spaceKeyToPlayOrPause = true, numberOfSharedAudioTags = 5, ...componentProps }, ref) => {
     react_1.useLayoutEffect(() => {
@@ -69,2 +70,9 @@ if (typeof window !== 'undefined') {
     }
+    if (typeof numberOfSharedAudioTags !== 'number' ||
+        numberOfSharedAudioTags % 1 !== 0 ||
+        !Number.isFinite(numberOfSharedAudioTags) ||
+        Number.isNaN(numberOfSharedAudioTags) ||
+        numberOfSharedAudioTags < 0) {
+        throw new TypeError(`'numberOfSharedAudioTags' must be an integer but got '${numberOfSharedAudioTags}' instead`);
+    }
     const setMediaVolumeAndPersist = react_1.useCallback((vol) => {
@@ -137,5 +145,5 @@ setMediaVolume(vol);
     }, [inputProps]);
-    return (jsx_runtime_1.jsx(remotion_1.Internals.Timeline.TimelineContext.Provider, Object.assign({ value: timelineContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.Timeline.SetTimelineContext.Provider, Object.assign({ value: setTimelineContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.CompositionManager.Provider, Object.assign({ value: compositionManagerContext }, { children: jsx_runtime_1.jsx(remotion_1.Internals.MediaVolumeContext.Provider, Object.assign({ value: mediaVolumeContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.SetMediaVolumeContext.Provider, Object.assign({ value: setMediaVolumeContextValue }, { children: jsx_runtime_1.jsx(emitter_context_1.PlayerEventEmitterContext.Provider, Object.assign({ value: emitter }, { children: jsx_runtime_1.jsx(PlayerUI_1.default, { ref: rootRef, autoPlay: Boolean(autoPlay), loop: Boolean(loop), controls: Boolean(controls), style: style, inputProps: passedInputProps, allowFullscreen: Boolean(allowFullscreen), clickToPlay: typeof clickToPlay === 'boolean'
-                                    ? clickToPlay
-                                    : Boolean(controls), showVolumeControls: Boolean(showVolumeControls), setMediaVolume: setMediaVolumeAndPersist, mediaVolume: mediaVolume, mediaMuted: mediaMuted, doubleClickToFullscreen: Boolean(doubleClickToFullscreen), setMediaMuted: setMediaMuted, spaceKeyToPlayOrPause: Boolean(spaceKeyToPlayOrPause) }, void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0));
+    return (jsx_runtime_1.jsx(remotion_1.Internals.Timeline.TimelineContext.Provider, Object.assign({ value: timelineContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.Timeline.SetTimelineContext.Provider, Object.assign({ value: setTimelineContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.CompositionManager.Provider, Object.assign({ value: compositionManagerContext }, { children: jsx_runtime_1.jsx(remotion_1.Internals.MediaVolumeContext.Provider, Object.assign({ value: mediaVolumeContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.SetMediaVolumeContext.Provider, Object.assign({ value: setMediaVolumeContextValue }, { children: jsx_runtime_1.jsx(remotion_1.Internals.SharedAudioContextProvider, Object.assign({ numberOfAudioTags: numberOfSharedAudioTags }, { children: jsx_runtime_1.jsx(emitter_context_1.PlayerEventEmitterContext.Provider, Object.assign({ value: emitter }, { children: jsx_runtime_1.jsx(PlayerUI_1.default, { ref: rootRef, autoPlay: Boolean(autoPlay), loop: Boolean(loop), controls: Boolean(controls), style: style, inputProps: passedInputProps, allowFullscreen: Boolean(allowFullscreen), clickToPlay: typeof clickToPlay === 'boolean'
+                                        ? clickToPlay
+                                        : Boolean(controls), showVolumeControls: Boolean(showVolumeControls), setMediaVolume: setMediaVolumeAndPersist, mediaVolume: mediaVolume, mediaMuted: mediaMuted, doubleClickToFullscreen: Boolean(doubleClickToFullscreen), setMediaMuted: setMediaMuted, spaceKeyToPlayOrPause: Boolean(spaceKeyToPlayOrPause) }, void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0) }), void 0));
 };
@@ -142,0 +150,0 @@ exports.PlayerFn = PlayerFn;

dist/use-player.js

@@ -13,2 +13,3 @@ "use strict";
     const setTimelinePosition = remotion_1.Internals.Timeline.useTimelineSetFrame();
+    const audioContext = react_1.useContext(remotion_1.Internals.SharedAudioContext);
     const frameRef = react_1.useRef();
@@ -35,5 +36,8 @@ frameRef.current = frame;
         }
+        if (audioContext && audioContext.numberOfAudioTags > 0) {
+            audioContext.playAllAudios();
+        }
         setPlaying(true);
         emitter.dispatchPlay();
-    }, [playing, isLastFrame, setPlaying, emitter, seek]);
+    }, [playing, isLastFrame, audioContext, setPlaying, emitter, seek]);
     const pause = react_1.useCallback(() => {
@@ -40,0 +44,0 @@ if (playing) {

package.json

 {
 	"name": "@remotion/player",
-	"version": "2.4.0-alpha.47569d29",
+	"version": "2.4.0-alpha.90748bec",
 	"description": "Remotion Player",
@@ -27,3 +27,3 @@ "main": "dist/index.js",
 	"dependencies": {
-		"remotion": "2.4.0-alpha.47569d29"
+		"remotion": "2.4.0-alpha.90748bec"
 	},
@@ -30,0 +30,0 @@ "peerDependencies": {

No alert changes

Improved metrics

Total package byte prevSize

147395

increased by0.96%

Lines of code

1885

increased by0.75%

Dependency changes

• + Addedremotion@2.4.0-alpha.90748bec(transitive)

• - Removedremotion@2.4.0-alpha.47569d29(transitive)

• Updatedremotion@2.4.0-alpha.90748bec