remotion 4.0.524 → 4.0.526

package/dist/cjs/timeline-position-state.d.ts

@@ -11,6 +11,7 @@ export declare const clampFrameToCompositionRange: (frame: number, durationInFra
 export declare const useTimelineContext: () => TimelineContextValue;
 export declare const usePlaybackRate: () => PlaybackRateContextValue;
 export declare const useTimelinePosition: () => number;
+export declare const useIsInsideFreeze: () => boolean;
 export declare const useAbsoluteTimelinePosition: () => number;
 export declare const useTimelineSetFrame: () => (u: import("react").SetStateAction<Record<string, number>>) => void;
 export { usePlaying } from './use-playing.js';

package/dist/cjs/timeline-position-state.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useBuffering = exports.usePlaying = exports.useTimelineSetFrame = exports.useAbsoluteTimelinePosition = exports.useTimelinePosition = exports.usePlaybackRate = exports.useTimelineContext = exports.clampFrameToCompositionRange = exports.getFrameForComposition = exports.getInitialFrameState = exports.persistCurrentFrame = void 0;
+exports.useBuffering = exports.usePlaying = exports.useTimelineSetFrame = exports.useAbsoluteTimelinePosition = exports.useIsInsideFreeze = exports.useTimelinePosition = exports.usePlaybackRate = exports.useTimelineContext = exports.clampFrameToCompositionRange = exports.getFrameForComposition = exports.getInitialFrameState = exports.persistCurrentFrame = void 0;
 const react_1 = require("react");
 const TimelineContext_js_1 = require("./TimelineContext.js");
 const use_remotion_environment_js_1 = require("./use-remotion-environment.js");
@@ -69,6 +69,10 @@ const useTimelinePosition = () => {
     return useTimelinePositionFromContext(state);
 };
 exports.useTimelinePosition = useTimelinePosition;
+const useIsInsideFreeze = () => {
+    return (0, exports.useTimelineContext)().isInsideFreeze;
+};
+exports.useIsInsideFreeze = useIsInsideFreeze;
 const useAbsoluteTimelinePosition = () => {
     const state = (0, react_1.useContext)(TimelineContext_js_1.AbsoluteTimeContext);
     if (state === null) {

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-export declare const VERSION = "4.0.524";
+export declare const VERSION = "4.0.526";

package/dist/cjs/version.js

@@ -7,4 +7,4 @@ exports.VERSION = void 0;
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-exports.VERSION = '4.0.524';
+exports.VERSION = '4.0.526';

package/dist/cjs/video/OffthreadVideoForRendering.js

@@ -5,6 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const absolute_src_js_1 = require("../absolute-src.js");
 const use_audio_frame_js_1 = require("../audio/use-audio-frame.js");
+const use_media_audio_state_js_1 = require("../audio/use-media-audio-state.js");
 const cancel_render_js_1 = require("../cancel-render.js");
 const default_css_js_1 = require("../default-css.js");
 const Img_js_1 = require("../Img.js");
@@ -15,6 +16,7 @@ const timeline_position_state_js_1 = require("../timeline-position-state.js");
 const truthy_js_1 = require("../truthy.js");
 const use_current_frame_js_1 = require("../use-current-frame.js");
 const use_delay_render_js_1 = require("../use-delay-render.js");
+const use_media_enabled_js_1 = require("../use-media-enabled.js");
 const use_unsafe_video_config_js_1 = require("../use-unsafe-video-config.js");
 const volume_prop_js_1 = require("../volume-prop.js");
 const volume_safeguard_js_1 = require("../volume-safeguard.js");
@@ -42,27 +44,27 @@ crossOrigin, audioStreamIndex, preservePitch: _preservePitch, ...props }) => {
         sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,
         sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames,
     ]);
-    if (!videoConfig) {
-        throw new Error('No video config found');
-    }
     const volume = (0, volume_prop_js_1.evaluateVolume)({
         volume: volumeProp,
         frame: volumePropsFrame,
         mediaVolume: 1,
     });
     (0, volume_safeguard_js_1.warnAboutTooHighVolume)(volume);
+    const audioEnabled = (0, use_media_enabled_js_1.useAudioEnabled)();
+    const { shouldUseAudio } = (0, use_media_audio_state_js_1.useMediaAudioState)({
+        muted,
+        volume,
+        audioEnabled,
+    });
+    if (!videoConfig) {
+        throw new Error('No video config found');
+    }
     (0, react_1.useEffect)(() => {
         var _a;
         if (!src) {
             throw new Error('No src passed');
         }
-        if (!window.remotion_audioEnabled) {
-            return;
-        }
-        if (muted) {
-            return;
-        }
-        if (volume <= 0) {
+        if (!shouldUseAudio) {
             return;
         }
         registerRenderAsset({
@@ -79,7 +81,7 @@ crossOrigin, audioStreamIndex, preservePitch: _preservePitch, ...props }) => {
         });
         return () => unregisterRenderAsset(id);
     }, [
-        muted,
+        shouldUseAudio,
         src,
         registerRenderAsset,
         id,

package/dist/cjs/video/VideoForPreview.js

@@ -39,6 +39,7 @@ const react_1 = __importStar(require("react"));
 const shared_audio_tags_js_1 = require("../audio/shared-audio-tags.js");
 const shared_element_source_node_js_1 = require("../audio/shared-element-source-node.js");
 const use_audio_frame_js_1 = require("../audio/use-audio-frame.js");
+const use_media_audio_state_js_1 = require("../audio/use-media-audio-state.js");
 const get_cross_origin_value_js_1 = require("../get-cross-origin-value.js");
 const log_level_context_js_1 = require("../log-level-context.js");
 const playback_logging_js_1 = require("../playback-logging.js");
@@ -111,12 +112,16 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
         throw new Error('acceptableTimeShift has been removed. Use acceptableTimeShiftInSeconds instead.');
     }
     const [mediaVolume] = (0, volume_position_state_js_1.useMediaVolumeState)();
-    const [playerMuted] = (0, volume_position_state_js_1.usePlayerMutedState)();
     const userPreferredVolume = (0, volume_prop_js_1.evaluateVolume)({
         frame: volumePropFrame,
         volume,
         mediaVolume,
     });
+    const { isMutedForTimeline, isMutedForPlayback } = (0, use_media_audio_state_js_1.useMediaAudioState)({
+        muted: muted !== null && muted !== void 0 ? muted : false,
+        volume: userPreferredVolume,
+        audioEnabled: true,
+    });
     (0, volume_safeguard_js_1.warnAboutTooHighVolume)(userPreferredVolume);
     const getStack = (0, react_1.useCallback)(() => {
         return _remotionInternalStack !== null && _remotionInternalStack !== void 0 ? _remotionInternalStack : null;
@@ -138,7 +143,7 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
             ? 'https://www.remotion.dev/docs/offthreadvideo'
             : 'https://www.remotion.dev/docs/html5-video',
         refForOutline: videoRef,
-        muted: muted !== null && muted !== void 0 ? muted : false,
+        muted: isMutedForTimeline,
     });
     // putting playback before useVolume
     // because volume looks at playbackrate
@@ -284,7 +289,7 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
         requestsVideoFrame: Boolean(onVideoFrame),
         isClientSideRendering: false,
     });
-    const video = (jsx_runtime_1.jsx("video", { ...nativeProps, ref: videoRef, muted: muted || playerMuted || userPreferredVolume <= 0, playsInline: true, src: actualSrc, loop: _remotionInternalNativeLoopPassed, style: actualStyle, disableRemotePlayback: true, crossOrigin: crossOriginValue, controls: false }));
+    const video = (jsx_runtime_1.jsx("video", { ...nativeProps, ref: videoRef, muted: isMutedForPlayback, playsInline: true, src: actualSrc, loop: _remotionInternalNativeLoopPassed, style: actualStyle, disableRemotePlayback: true, crossOrigin: crossOriginValue, controls: false }));
     return isStudio ? (jsx_runtime_1.jsx(sequence_order_marker_js_1.SequenceOrderMarker, { sequenceId: timelineId, children: video })) : (video);
 };
 exports.VideoForPreview = (0, react_1.forwardRef)(VideoForDevelopmentRefForwardingFunction);

package/dist/cjs/video/VideoForRendering.js

@@ -5,6 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const absolute_src_js_1 = require("../absolute-src.js");
 const use_audio_frame_js_1 = require("../audio/use-audio-frame.js");
+const use_media_audio_state_js_1 = require("../audio/use-media-audio-state.js");
 const is_approximately_the_same_js_1 = require("../is-approximately-the-same.js");
 const log_level_context_js_1 = require("../log-level-context.js");
 const random_js_1 = require("../random.js");
@@ -13,6 +14,7 @@ const SequenceContext_js_1 = require("../SequenceContext.js");
 const timeline_position_state_js_1 = require("../timeline-position-state.js");
 const use_current_frame_js_1 = require("../use-current-frame.js");
 const use_delay_render_js_1 = require("../use-delay-render.js");
+const use_media_enabled_js_1 = require("../use-media-enabled.js");
 const use_remotion_environment_js_1 = require("../use-remotion-environment.js");
 const use_unsafe_video_config_js_1 = require("../use-unsafe-video-config.js");
 const volume_prop_js_1 = require("../volume-prop.js");
@@ -22,6 +24,7 @@ const get_current_time_js_1 = require("./get-current-time.js");
 const MediaPlaybackError_js_1 = require("./MediaPlaybackError.js");
 const seek_until_right_js_1 = require("./seek-until-right.js");
 const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAmplificationDuringRender, playbackRate, onDuration, toneFrequency, name, acceptableTimeShiftInSeconds, delayRenderRetries, delayRenderTimeoutInMilliseconds, loopVolumeCurveBehavior, audioStreamIndex, onVideoFrame, preservePitch: _preservePitch, ...props }, ref) => {
+    var _a;
     const absoluteFrame = (0, timeline_position_state_js_1.useTimelinePosition)();
     const frame = (0, use_current_frame_js_1.useCurrentFrame)();
     const volumePropsFrame = (0, use_audio_frame_js_1.useFrameForVolumeProp)(loopVolumeCurveBehavior !== null && loopVolumeCurveBehavior !== void 0 ? loopVolumeCurveBehavior : 'repeat');
@@ -45,27 +48,27 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
         sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,
         sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames,
     ]);
-    if (!videoConfig) {
-        throw new Error('No video config found');
-    }
     const volume = (0, volume_prop_js_1.evaluateVolume)({
         volume: volumeProp,
         frame: volumePropsFrame,
         mediaVolume: 1,
     });
     (0, volume_safeguard_js_1.warnAboutTooHighVolume)(volume);
+    const audioEnabled = (0, use_media_enabled_js_1.useAudioEnabled)();
+    const { shouldUseAudio } = (0, use_media_audio_state_js_1.useMediaAudioState)({
+        muted: (_a = props.muted) !== null && _a !== void 0 ? _a : false,
+        volume,
+        audioEnabled,
+    });
+    if (!videoConfig) {
+        throw new Error('No video config found');
+    }
     (0, react_1.useEffect)(() => {
         var _a;
         if (!props.src) {
             throw new Error('No src passed');
         }
-        if (props.muted) {
-            return;
-        }
-        if (volume <= 0) {
-            return;
-        }
-        if (!window.remotion_audioEnabled) {
+        if (!shouldUseAudio) {
             return;
         }
         registerRenderAsset({
@@ -82,7 +85,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
         });
         return () => unregisterRenderAsset(id);
     }, [
-        props.muted,
+        shouldUseAudio,
         props.src,
         registerRenderAsset,
         id,