@remotion/media 4.0.481 → 4.0.482
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.
package/dist/esm/index.mjs
CHANGED
|
@@ -39,7 +39,7 @@ var __callDispose = (stack, error, hasError) => {
|
|
|
39
39
|
// src/audio/audio.tsx
|
|
40
40
|
import { useMemo as useMemo3, useState as useState3 } from "react";
|
|
41
41
|
import {
|
|
42
|
-
Internals as
|
|
42
|
+
Internals as Internals17,
|
|
43
43
|
Interactive,
|
|
44
44
|
Sequence,
|
|
45
45
|
useRemotionEnvironment as useRemotionEnvironment2,
|
|
@@ -2143,7 +2143,7 @@ var {
|
|
|
2143
2143
|
useUnsafeVideoConfig,
|
|
2144
2144
|
Timeline,
|
|
2145
2145
|
SharedAudioContext,
|
|
2146
|
-
|
|
2146
|
+
usePlayerMutedState,
|
|
2147
2147
|
useMediaVolumeState,
|
|
2148
2148
|
useFrameForVolumeProp,
|
|
2149
2149
|
evaluateVolume,
|
|
@@ -2185,7 +2185,7 @@ var AudioForPreviewAssertedShowing = ({
|
|
|
2185
2185
|
const { playbackRate: globalPlaybackRate } = Internals7.usePlaybackRate();
|
|
2186
2186
|
const sharedAudioContext = useContext2(SharedAudioContext);
|
|
2187
2187
|
const buffer = useBufferState();
|
|
2188
|
-
const [
|
|
2188
|
+
const [playerMuted] = usePlayerMutedState();
|
|
2189
2189
|
const [mediaVolume] = useMediaVolumeState();
|
|
2190
2190
|
const volumePropFrame = useFrameForVolumeProp(loopVolumeCurveBehavior ?? "repeat");
|
|
2191
2191
|
const userPreferredVolume = evaluateVolume({
|
|
@@ -2212,7 +2212,7 @@ var AudioForPreviewAssertedShowing = ({
|
|
|
2212
2212
|
if (!bufferingContext) {
|
|
2213
2213
|
throw new Error("useMediaPlayback must be used inside a <BufferingContext>");
|
|
2214
2214
|
}
|
|
2215
|
-
const effectiveMuted = muted ||
|
|
2215
|
+
const effectiveMuted = muted || playerMuted || userPreferredVolume <= 0;
|
|
2216
2216
|
const isPlayerBuffering = Internals7.useIsPlayerBuffering(bufferingContext);
|
|
2217
2217
|
const initialPlaying = useRef(playing && !isPlayerBuffering);
|
|
2218
2218
|
const initialIsPremounting = useRef(isPremounting);
|
|
@@ -2491,7 +2491,7 @@ import { useContext as useContext3, useLayoutEffect as useLayoutEffect2, useMemo
|
|
|
2491
2491
|
import {
|
|
2492
2492
|
cancelRender as cancelRender2,
|
|
2493
2493
|
Html5Audio,
|
|
2494
|
-
Internals as
|
|
2494
|
+
Internals as Internals16,
|
|
2495
2495
|
random,
|
|
2496
2496
|
useCurrentFrame as useCurrentFrame2,
|
|
2497
2497
|
useDelayRender,
|
|
@@ -3596,7 +3596,7 @@ var combineAudioDataAndClosePrevious = (audioDataArray) => {
|
|
|
3596
3596
|
};
|
|
3597
3597
|
|
|
3598
3598
|
// src/get-sink.ts
|
|
3599
|
-
import { Internals as
|
|
3599
|
+
import { Internals as Internals14 } from "remotion";
|
|
3600
3600
|
|
|
3601
3601
|
// src/video-extraction/get-frames-since-keyframe.ts
|
|
3602
3602
|
import {
|
|
@@ -3609,6 +3609,7 @@ import {
|
|
|
3609
3609
|
VideoSampleSink,
|
|
3610
3610
|
WEBM
|
|
3611
3611
|
} from "mediabunny";
|
|
3612
|
+
import { Internals as Internals13 } from "remotion";
|
|
3612
3613
|
|
|
3613
3614
|
// src/browser-can-use-webgl2.ts
|
|
3614
3615
|
var browserCanUseWebGl2 = null;
|
|
@@ -3660,7 +3661,7 @@ var getFormatOrNullOrNetworkError = async (input) => {
|
|
|
3660
3661
|
return null;
|
|
3661
3662
|
}
|
|
3662
3663
|
};
|
|
3663
|
-
var getSinks = async (src, credentials, requestInit) => {
|
|
3664
|
+
var getSinks = async (src, logLevel, credentials, requestInit) => {
|
|
3664
3665
|
const resolvedRequestInit = resolveRequestInit({ credentials, requestInit });
|
|
3665
3666
|
const input = new Input2({
|
|
3666
3667
|
formats: ALL_FORMATS2,
|
|
@@ -3699,7 +3700,7 @@ var getSinks = async (src, credentials, requestInit) => {
|
|
|
3699
3700
|
});
|
|
3700
3701
|
const hasAlpha = startPacket?.sideData.alpha;
|
|
3701
3702
|
if (hasAlpha && !canBrowserUseWebGl2()) {
|
|
3702
|
-
|
|
3703
|
+
Internals13.Log.warn({ logLevel, tag: "@remotion/media" }, `WebGL2 is not available, using the non-fast CPU path to decode alpha for ${src}.`);
|
|
3703
3704
|
}
|
|
3704
3705
|
return {
|
|
3705
3706
|
sampleSink
|
|
@@ -3780,11 +3781,11 @@ var getSink = (src, logLevel, credentials, requestInit) => {
|
|
|
3780
3781
|
});
|
|
3781
3782
|
let promise = sinkPromises[cacheKey];
|
|
3782
3783
|
if (!promise) {
|
|
3783
|
-
|
|
3784
|
+
Internals14.Log.verbose({
|
|
3784
3785
|
logLevel,
|
|
3785
3786
|
tag: "@remotion/media"
|
|
3786
3787
|
}, `Sink for ${src} was not found, creating new sink`);
|
|
3787
|
-
promise = getSinks(src, credentials, normalizedRequestInit);
|
|
3788
|
+
promise = getSinks(src, logLevel, credentials, normalizedRequestInit);
|
|
3788
3789
|
sinkPromises[cacheKey] = promise;
|
|
3789
3790
|
}
|
|
3790
3791
|
return promise;
|
|
@@ -3922,7 +3923,7 @@ var extractAudio = (params) => {
|
|
|
3922
3923
|
};
|
|
3923
3924
|
|
|
3924
3925
|
// src/video-extraction/extract-frame.ts
|
|
3925
|
-
import { Internals as
|
|
3926
|
+
import { Internals as Internals15 } from "remotion";
|
|
3926
3927
|
var extractFrameInternal = async ({
|
|
3927
3928
|
src,
|
|
3928
3929
|
timeInSeconds: unloopedTimeInSeconds,
|
|
@@ -4005,7 +4006,7 @@ var extractFrameInternal = async ({
|
|
|
4005
4006
|
durationInSeconds: await sink.getDuration()
|
|
4006
4007
|
};
|
|
4007
4008
|
} catch (err) {
|
|
4008
|
-
|
|
4009
|
+
Internals15.Log.info({ logLevel, tag: "@remotion/media" }, `Error decoding ${src} at time ${timeInSeconds}: ${err}`, err);
|
|
4009
4010
|
return { type: "cannot-decode", durationInSeconds: mediaDurationInSeconds };
|
|
4010
4011
|
}
|
|
4011
4012
|
};
|
|
@@ -4417,13 +4418,13 @@ var AudioForRendering = ({
|
|
|
4417
4418
|
credentials,
|
|
4418
4419
|
requestInit
|
|
4419
4420
|
}) => {
|
|
4420
|
-
const defaultLogLevel =
|
|
4421
|
+
const defaultLogLevel = Internals16.useLogLevel();
|
|
4421
4422
|
const logLevel = overriddenLogLevel ?? defaultLogLevel;
|
|
4422
4423
|
const frame = useCurrentFrame2();
|
|
4423
|
-
const absoluteFrame =
|
|
4424
|
-
const videoConfig =
|
|
4425
|
-
const { registerRenderAsset, unregisterRenderAsset } = useContext3(
|
|
4426
|
-
const startsAt =
|
|
4424
|
+
const absoluteFrame = Internals16.useTimelinePosition();
|
|
4425
|
+
const videoConfig = Internals16.useUnsafeVideoConfig();
|
|
4426
|
+
const { registerRenderAsset, unregisterRenderAsset } = useContext3(Internals16.RenderAssetManager);
|
|
4427
|
+
const startsAt = Internals16.useMediaStartsAt();
|
|
4427
4428
|
const environment = useRemotionEnvironment();
|
|
4428
4429
|
if (!videoConfig) {
|
|
4429
4430
|
throw new Error("No video config found");
|
|
@@ -4435,7 +4436,7 @@ var AudioForRendering = ({
|
|
|
4435
4436
|
const { delayRender, continueRender } = useDelayRender();
|
|
4436
4437
|
const [replaceWithHtml5Audio, setReplaceWithHtml5Audio] = useState2(false);
|
|
4437
4438
|
const [initialRequestInit] = useState2(requestInit);
|
|
4438
|
-
const sequenceContext = useContext3(
|
|
4439
|
+
const sequenceContext = useContext3(Internals16.SequenceContext);
|
|
4439
4440
|
const id = useMemo2(() => `media-audio-${random(src)}-${sequenceContext?.cumulatedFrom}-${sequenceContext?.relativeFrom}-${sequenceContext?.durationInFrames}`, [
|
|
4440
4441
|
src,
|
|
4441
4442
|
sequenceContext?.cumulatedFrom,
|
|
@@ -4443,7 +4444,7 @@ var AudioForRendering = ({
|
|
|
4443
4444
|
sequenceContext?.durationInFrames
|
|
4444
4445
|
]);
|
|
4445
4446
|
const maxCacheSize = useMaxMediaCacheSize(logLevel);
|
|
4446
|
-
const audioEnabled =
|
|
4447
|
+
const audioEnabled = Internals16.useAudioEnabled();
|
|
4447
4448
|
useLayoutEffect2(() => {
|
|
4448
4449
|
const timestamp = frame / fps;
|
|
4449
4450
|
const durationInSeconds = 1 / fps;
|
|
@@ -4495,7 +4496,7 @@ var AudioForRendering = ({
|
|
|
4495
4496
|
if (action === "fail") {
|
|
4496
4497
|
cancelRender2(errorToUse);
|
|
4497
4498
|
}
|
|
4498
|
-
|
|
4499
|
+
Internals16.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
|
|
4499
4500
|
setReplaceWithHtml5Audio(true);
|
|
4500
4501
|
};
|
|
4501
4502
|
if (result.type === "unknown-container-format") {
|
|
@@ -4522,12 +4523,12 @@ var AudioForRendering = ({
|
|
|
4522
4523
|
frame,
|
|
4523
4524
|
startsAt
|
|
4524
4525
|
});
|
|
4525
|
-
const volume =
|
|
4526
|
+
const volume = Internals16.evaluateVolume({
|
|
4526
4527
|
volume: volumeProp,
|
|
4527
4528
|
frame: volumePropsFrame,
|
|
4528
4529
|
mediaVolume: 1
|
|
4529
4530
|
});
|
|
4530
|
-
|
|
4531
|
+
Internals16.warnAboutTooHighVolume(volume);
|
|
4531
4532
|
if (audio && volume > 0) {
|
|
4532
4533
|
applyVolume(audio.data, volume);
|
|
4533
4534
|
registerRenderAsset({
|
|
@@ -4606,9 +4607,9 @@ var AudioForRendering = ({
|
|
|
4606
4607
|
|
|
4607
4608
|
// src/audio/audio.tsx
|
|
4608
4609
|
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
4609
|
-
var { validateMediaProps } =
|
|
4610
|
+
var { validateMediaProps } = Internals17;
|
|
4610
4611
|
var audioSchema = {
|
|
4611
|
-
...
|
|
4612
|
+
...Internals17.baseSchema,
|
|
4612
4613
|
volume: {
|
|
4613
4614
|
type: "number",
|
|
4614
4615
|
min: 0,
|
|
@@ -4642,11 +4643,11 @@ var AudioInner = (props) => {
|
|
|
4642
4643
|
...otherProps
|
|
4643
4644
|
} = props;
|
|
4644
4645
|
const environment = useRemotionEnvironment2();
|
|
4645
|
-
const [mediaVolume] =
|
|
4646
|
-
const mediaStartsAt =
|
|
4646
|
+
const [mediaVolume] = Internals17.useMediaVolumeState();
|
|
4647
|
+
const mediaStartsAt = Internals17.useMediaStartsAt();
|
|
4647
4648
|
const videoConfig = useVideoConfig2();
|
|
4648
4649
|
const sequenceDurationInFrames = Math.min(durationInFrames ?? Infinity, Math.max(0, videoConfig.durationInFrames - (from ?? 0)));
|
|
4649
|
-
const basicInfo =
|
|
4650
|
+
const basicInfo = Internals17.useBasicMediaInTimeline({
|
|
4650
4651
|
src: props.src,
|
|
4651
4652
|
volume: props.volume,
|
|
4652
4653
|
playbackRate: props.playbackRate ?? 1,
|
|
@@ -4718,12 +4719,12 @@ var Audio = Interactive.withSchema({
|
|
|
4718
4719
|
schema: audioSchema,
|
|
4719
4720
|
supportsEffects: false
|
|
4720
4721
|
});
|
|
4721
|
-
|
|
4722
|
+
Internals17.addSequenceStackTraces(Audio);
|
|
4722
4723
|
|
|
4723
4724
|
// src/video/video.tsx
|
|
4724
4725
|
import React6, { useMemo as useMemo6, useState as useState6 } from "react";
|
|
4725
4726
|
import {
|
|
4726
|
-
Internals as
|
|
4727
|
+
Internals as Internals21,
|
|
4727
4728
|
Interactive as Interactive2,
|
|
4728
4729
|
Sequence as Sequence2,
|
|
4729
4730
|
useRemotionEnvironment as useRemotionEnvironment4,
|
|
@@ -4742,7 +4743,7 @@ import {
|
|
|
4742
4743
|
} from "react";
|
|
4743
4744
|
import {
|
|
4744
4745
|
Html5Video,
|
|
4745
|
-
Internals as
|
|
4746
|
+
Internals as Internals19,
|
|
4746
4747
|
useBufferState as useBufferState2,
|
|
4747
4748
|
useCurrentFrame as useCurrentFrame3,
|
|
4748
4749
|
useVideoConfig as useVideoConfig3
|
|
@@ -4772,7 +4773,7 @@ var getCachedVideoFrame = (src) => {
|
|
|
4772
4773
|
};
|
|
4773
4774
|
|
|
4774
4775
|
// src/video/warn-object-fit-css.ts
|
|
4775
|
-
import { Internals as
|
|
4776
|
+
import { Internals as Internals18 } from "remotion";
|
|
4776
4777
|
var OBJECT_FIT_CLASS_PATTERN = /\bobject-(contain|cover|fill|none|scale-down)\b/;
|
|
4777
4778
|
var warnedStyle = false;
|
|
4778
4779
|
var warnedClassName = false;
|
|
@@ -4783,11 +4784,11 @@ var warnAboutObjectFitInStyleOrClassName = ({
|
|
|
4783
4784
|
}) => {
|
|
4784
4785
|
if (!warnedStyle && style?.objectFit) {
|
|
4785
4786
|
warnedStyle = true;
|
|
4786
|
-
|
|
4787
|
+
Internals18.Log.warn({ logLevel, tag: "@remotion/media" }, "Use the `objectFit` prop instead of the `style` prop.");
|
|
4787
4788
|
}
|
|
4788
4789
|
if (!warnedClassName && className && OBJECT_FIT_CLASS_PATTERN.test(className)) {
|
|
4789
4790
|
warnedClassName = true;
|
|
4790
|
-
|
|
4791
|
+
Internals18.Log.warn({ logLevel, tag: "@remotion/media" }, "Use the `objectFit` prop instead of `object-*` CSS class names.");
|
|
4791
4792
|
}
|
|
4792
4793
|
};
|
|
4793
4794
|
|
|
@@ -4797,7 +4798,7 @@ var {
|
|
|
4797
4798
|
useUnsafeVideoConfig: useUnsafeVideoConfig2,
|
|
4798
4799
|
Timeline: Timeline2,
|
|
4799
4800
|
SharedAudioContext: SharedAudioContext2,
|
|
4800
|
-
|
|
4801
|
+
usePlayerMutedState: usePlayerMutedState2,
|
|
4801
4802
|
useMediaVolumeState: useMediaVolumeState2,
|
|
4802
4803
|
useFrameForVolumeProp: useFrameForVolumeProp2,
|
|
4803
4804
|
evaluateVolume: evaluateVolume2,
|
|
@@ -4805,7 +4806,7 @@ var {
|
|
|
4805
4806
|
usePreload: usePreload2,
|
|
4806
4807
|
SequenceContext: SequenceContext2,
|
|
4807
4808
|
useEffectChainState
|
|
4808
|
-
} =
|
|
4809
|
+
} = Internals19;
|
|
4809
4810
|
var VideoForPreviewAssertedShowing = ({
|
|
4810
4811
|
src: unpreloadedSrc,
|
|
4811
4812
|
style,
|
|
@@ -4848,7 +4849,7 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
4848
4849
|
const [mediaPlayerReady, setMediaPlayerReady] = useState4(false);
|
|
4849
4850
|
const [shouldFallbackToNativeVideo, setShouldFallbackToNativeVideo] = useState4(false);
|
|
4850
4851
|
const [playing] = Timeline2.usePlayingState();
|
|
4851
|
-
const { playbackRate: globalPlaybackRate } =
|
|
4852
|
+
const { playbackRate: globalPlaybackRate } = Internals19.usePlaybackRate();
|
|
4852
4853
|
const sharedAudioContext = useContext4(SharedAudioContext2);
|
|
4853
4854
|
const buffer = useBufferState2();
|
|
4854
4855
|
const canvasRefCallback = useCallback((canvas) => {
|
|
@@ -4858,7 +4859,7 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
4858
4859
|
const fallbackVideoRef = useCallback((video) => {
|
|
4859
4860
|
refForOutline.current = video;
|
|
4860
4861
|
}, [refForOutline]);
|
|
4861
|
-
const [
|
|
4862
|
+
const [playerMuted] = usePlayerMutedState2();
|
|
4862
4863
|
const [mediaVolume] = useMediaVolumeState2();
|
|
4863
4864
|
const volumePropFrame = useFrameForVolumeProp2(loopVolumeCurveBehavior);
|
|
4864
4865
|
const userPreferredVolume = evaluateVolume2({
|
|
@@ -4883,12 +4884,12 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
4883
4884
|
const currentTimeRef = useRef2(currentTime);
|
|
4884
4885
|
currentTimeRef.current = currentTime;
|
|
4885
4886
|
const preloadedSrc = usePreload2(src);
|
|
4886
|
-
const buffering = useContext4(
|
|
4887
|
+
const buffering = useContext4(Internals19.BufferingContextReact);
|
|
4887
4888
|
if (!buffering) {
|
|
4888
4889
|
throw new Error("useMediaPlayback must be used inside a <BufferingContext>");
|
|
4889
4890
|
}
|
|
4890
|
-
const effectiveMuted = muted ||
|
|
4891
|
-
const isPlayerBuffering =
|
|
4891
|
+
const effectiveMuted = muted || playerMuted || userPreferredVolume <= 0;
|
|
4892
|
+
const isPlayerBuffering = Internals19.useIsPlayerBuffering(buffering);
|
|
4892
4893
|
const initialPlaying = useRef2(playing && !isPlayerBuffering);
|
|
4893
4894
|
const initialIsPremounting = useRef2(isPremounting);
|
|
4894
4895
|
const initialIsPostmounting = useRef2(isPostmounting);
|
|
@@ -4999,7 +5000,7 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
4999
5000
|
if (action === "fail") {
|
|
5000
5001
|
throw errorToUse;
|
|
5001
5002
|
}
|
|
5002
|
-
|
|
5003
|
+
Internals19.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
|
|
5003
5004
|
setShouldFallbackToNativeVideo(true);
|
|
5004
5005
|
};
|
|
5005
5006
|
if (result.type === "unknown-container-format") {
|
|
@@ -5034,7 +5035,7 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
5034
5035
|
if (action === "fail") {
|
|
5035
5036
|
throw errorToUse;
|
|
5036
5037
|
}
|
|
5037
|
-
|
|
5038
|
+
Internals19.Log.error({ logLevel, tag: "@remotion/media" }, "[VideoForPreview] Failed to initialize MediaPlayer", errorToUse);
|
|
5038
5039
|
setShouldFallbackToNativeVideo(true);
|
|
5039
5040
|
});
|
|
5040
5041
|
} catch (error) {
|
|
@@ -5048,12 +5049,12 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
5048
5049
|
if (action === "fail") {
|
|
5049
5050
|
throw errorToUse;
|
|
5050
5051
|
}
|
|
5051
|
-
|
|
5052
|
+
Internals19.Log.error({ logLevel, tag: "@remotion/media" }, "[VideoForPreview] MediaPlayer initialization failed", errorToUse);
|
|
5052
5053
|
setShouldFallbackToNativeVideo(true);
|
|
5053
5054
|
}
|
|
5054
5055
|
return () => {
|
|
5055
5056
|
if (mediaPlayerRef.current) {
|
|
5056
|
-
|
|
5057
|
+
Internals19.Log.trace({ logLevel, tag: "@remotion/media" }, `[VideoForPreview] Disposing MediaPlayer`);
|
|
5057
5058
|
mediaPlayerRef.current.dispose();
|
|
5058
5059
|
mediaPlayerRef.current = null;
|
|
5059
5060
|
}
|
|
@@ -5078,7 +5079,7 @@ var VideoForPreviewAssertedShowing = ({
|
|
|
5078
5079
|
]);
|
|
5079
5080
|
warnAboutObjectFitInStyleOrClassName({ style, className, logLevel });
|
|
5080
5081
|
const classNameValue = useMemo4(() => {
|
|
5081
|
-
return [
|
|
5082
|
+
return [Internals19.OBJECTFIT_CONTAIN_CLASS_NAME, className].filter(Internals19.truthy).join(" ");
|
|
5082
5083
|
}, [className]);
|
|
5083
5084
|
useCommonEffects({
|
|
5084
5085
|
mediaPlayerRef,
|
|
@@ -5202,7 +5203,7 @@ import {
|
|
|
5202
5203
|
useState as useState5
|
|
5203
5204
|
} from "react";
|
|
5204
5205
|
import {
|
|
5205
|
-
Internals as
|
|
5206
|
+
Internals as Internals20,
|
|
5206
5207
|
Loop,
|
|
5207
5208
|
random as random2,
|
|
5208
5209
|
useCurrentFrame as useCurrentFrame4,
|
|
@@ -5243,11 +5244,11 @@ var VideoForRendering = ({
|
|
|
5243
5244
|
throw new TypeError("No `src` was passed to <Video>.");
|
|
5244
5245
|
}
|
|
5245
5246
|
const frame = useCurrentFrame4();
|
|
5246
|
-
const absoluteFrame =
|
|
5247
|
+
const absoluteFrame = Internals20.useTimelinePosition();
|
|
5247
5248
|
const { fps } = useVideoConfig4();
|
|
5248
|
-
const { registerRenderAsset, unregisterRenderAsset } = useContext5(
|
|
5249
|
-
const startsAt =
|
|
5250
|
-
const sequenceContext = useContext5(
|
|
5249
|
+
const { registerRenderAsset, unregisterRenderAsset } = useContext5(Internals20.RenderAssetManager);
|
|
5250
|
+
const startsAt = Internals20.useMediaStartsAt();
|
|
5251
|
+
const sequenceContext = useContext5(Internals20.SequenceContext);
|
|
5251
5252
|
const id = useMemo5(() => `media-video-${random2(src)}-${sequenceContext?.cumulatedFrom}-${sequenceContext?.relativeFrom}-${sequenceContext?.durationInFrames}`, [
|
|
5252
5253
|
src,
|
|
5253
5254
|
sequenceContext?.cumulatedFrom,
|
|
@@ -5259,10 +5260,10 @@ var VideoForRendering = ({
|
|
|
5259
5260
|
const canvasRef = useRef3(null);
|
|
5260
5261
|
const [replaceWithOffthreadVideo, setReplaceWithOffthreadVideo] = useState5(false);
|
|
5261
5262
|
const [initialRequestInit] = useState5(requestInit);
|
|
5262
|
-
const audioEnabled =
|
|
5263
|
-
const videoEnabled =
|
|
5263
|
+
const audioEnabled = Internals20.useAudioEnabled();
|
|
5264
|
+
const videoEnabled = Internals20.useVideoEnabled();
|
|
5264
5265
|
const maxCacheSize = useMaxMediaCacheSize(logLevel);
|
|
5265
|
-
const effectChainState =
|
|
5266
|
+
const effectChainState = Internals20.useEffectChainState();
|
|
5266
5267
|
const [error, setError] = useState5(null);
|
|
5267
5268
|
if (error) {
|
|
5268
5269
|
throw error;
|
|
@@ -5327,7 +5328,7 @@ var VideoForRendering = ({
|
|
|
5327
5328
|
return;
|
|
5328
5329
|
}
|
|
5329
5330
|
if (window.remotion_isMainTab) {
|
|
5330
|
-
|
|
5331
|
+
Internals20.Log.warn({ logLevel, tag: "@remotion/media" }, fallbackMessage);
|
|
5331
5332
|
}
|
|
5332
5333
|
setReplaceWithOffthreadVideo({
|
|
5333
5334
|
durationInSeconds: mediaDurationInSeconds
|
|
@@ -5365,7 +5366,7 @@ var VideoForRendering = ({
|
|
|
5365
5366
|
context.canvas.style.aspectRatio = `${context.canvas.width} / ${context.canvas.height}`;
|
|
5366
5367
|
context.drawImage(imageBitmap, 0, 0);
|
|
5367
5368
|
if (effects.length > 0) {
|
|
5368
|
-
const completed = await
|
|
5369
|
+
const completed = await Internals20.runEffectChain({
|
|
5369
5370
|
state: effectChainState.get(imageBitmap.width, imageBitmap.height),
|
|
5370
5371
|
source: context.canvas,
|
|
5371
5372
|
effects,
|
|
@@ -5396,12 +5397,12 @@ var VideoForRendering = ({
|
|
|
5396
5397
|
frame,
|
|
5397
5398
|
startsAt
|
|
5398
5399
|
});
|
|
5399
|
-
const volume =
|
|
5400
|
+
const volume = Internals20.evaluateVolume({
|
|
5400
5401
|
volume: volumeProp,
|
|
5401
5402
|
frame: volumePropsFrame,
|
|
5402
5403
|
mediaVolume: 1
|
|
5403
5404
|
});
|
|
5404
|
-
|
|
5405
|
+
Internals20.warnAboutTooHighVolume(volume);
|
|
5405
5406
|
if (audio && volume > 0) {
|
|
5406
5407
|
applyVolume(audio.data, volume);
|
|
5407
5408
|
registerRenderAsset({
|
|
@@ -5462,7 +5463,7 @@ var VideoForRendering = ({
|
|
|
5462
5463
|
]);
|
|
5463
5464
|
warnAboutObjectFitInStyleOrClassName({ style, className, logLevel });
|
|
5464
5465
|
const classNameValue = useMemo5(() => {
|
|
5465
|
-
return [
|
|
5466
|
+
return [Internals20.OBJECTFIT_CONTAIN_CLASS_NAME, className].filter(Internals20.truthy).join(" ");
|
|
5466
5467
|
}, [className]);
|
|
5467
5468
|
const styleWithObjectFit = useMemo5(() => {
|
|
5468
5469
|
return {
|
|
@@ -5471,7 +5472,7 @@ var VideoForRendering = ({
|
|
|
5471
5472
|
};
|
|
5472
5473
|
}, [objectFitProp, style]);
|
|
5473
5474
|
if (replaceWithOffthreadVideo) {
|
|
5474
|
-
const fallback = /* @__PURE__ */ jsx5(
|
|
5475
|
+
const fallback = /* @__PURE__ */ jsx5(Internals20.InnerOffthreadVideo, {
|
|
5475
5476
|
...props,
|
|
5476
5477
|
src,
|
|
5477
5478
|
playbackRate: playbackRate ?? 1,
|
|
@@ -5513,7 +5514,7 @@ var VideoForRendering = ({
|
|
|
5513
5514
|
}
|
|
5514
5515
|
return /* @__PURE__ */ jsx5(Loop, {
|
|
5515
5516
|
layout: "none",
|
|
5516
|
-
durationInFrames:
|
|
5517
|
+
durationInFrames: Internals20.calculateMediaDuration({
|
|
5517
5518
|
trimAfter: trimAfterValue,
|
|
5518
5519
|
mediaDurationInFrames: replaceWithOffthreadVideo.durationInSeconds * fps,
|
|
5519
5520
|
playbackRate,
|
|
@@ -5537,9 +5538,9 @@ var VideoForRendering = ({
|
|
|
5537
5538
|
|
|
5538
5539
|
// src/video/video.tsx
|
|
5539
5540
|
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
5540
|
-
var { validateMediaTrimProps, resolveTrimProps, validateMediaProps: validateMediaProps2 } =
|
|
5541
|
+
var { validateMediaTrimProps, resolveTrimProps, validateMediaProps: validateMediaProps2 } = Internals21;
|
|
5541
5542
|
var videoSchema = {
|
|
5542
|
-
...
|
|
5543
|
+
...Internals21.baseSchema,
|
|
5543
5544
|
volume: {
|
|
5544
5545
|
type: "number",
|
|
5545
5546
|
min: 0,
|
|
@@ -5559,7 +5560,7 @@ var videoSchema = {
|
|
|
5559
5560
|
keyframable: false
|
|
5560
5561
|
},
|
|
5561
5562
|
loop: { type: "boolean", default: false, description: "Loop" },
|
|
5562
|
-
...
|
|
5563
|
+
...Internals21.transformSchema
|
|
5563
5564
|
};
|
|
5564
5565
|
var InnerVideo = ({
|
|
5565
5566
|
src,
|
|
@@ -5711,12 +5712,12 @@ var VideoInner = ({
|
|
|
5711
5712
|
hidden,
|
|
5712
5713
|
...props
|
|
5713
5714
|
}) => {
|
|
5714
|
-
const fallbackLogLevel =
|
|
5715
|
-
const [mediaVolume] =
|
|
5716
|
-
const mediaStartsAt =
|
|
5715
|
+
const fallbackLogLevel = Internals21.useLogLevel();
|
|
5716
|
+
const [mediaVolume] = Internals21.useMediaVolumeState();
|
|
5717
|
+
const mediaStartsAt = Internals21.useMediaStartsAt();
|
|
5717
5718
|
const videoConfig = useVideoConfig5();
|
|
5718
5719
|
const sequenceDurationInFrames = Math.min(durationInFrames ?? Infinity, Math.max(0, videoConfig.durationInFrames - (from ?? 0)));
|
|
5719
|
-
const basicInfo =
|
|
5720
|
+
const basicInfo = Internals21.useBasicMediaInTimeline({
|
|
5720
5721
|
src,
|
|
5721
5722
|
volume,
|
|
5722
5723
|
playbackRate: playbackRate ?? 1,
|
|
@@ -5751,11 +5752,11 @@ var VideoInner = ({
|
|
|
5751
5752
|
type: "video",
|
|
5752
5753
|
data: basicInfo
|
|
5753
5754
|
}), [basicInfo]);
|
|
5754
|
-
const memoizedEffects =
|
|
5755
|
+
const memoizedEffects = Internals21.useMemoizedEffects({
|
|
5755
5756
|
effects: effects ?? [],
|
|
5756
5757
|
overrideId: controls?.overrideId ?? null
|
|
5757
5758
|
});
|
|
5758
|
-
const memoizedEffectDefinitions =
|
|
5759
|
+
const memoizedEffectDefinitions = Internals21.useMemoizedEffectDefinitions(effects ?? []);
|
|
5759
5760
|
const refForOutline = React6.useRef(null);
|
|
5760
5761
|
if (sequenceDurationInFrames === 0) {
|
|
5761
5762
|
return null;
|
|
@@ -5818,7 +5819,7 @@ var Video = Interactive2.withSchema({
|
|
|
5818
5819
|
schema: videoSchema,
|
|
5819
5820
|
supportsEffects: true
|
|
5820
5821
|
});
|
|
5821
|
-
|
|
5822
|
+
Internals21.addSequenceStackTraces(Video);
|
|
5822
5823
|
|
|
5823
5824
|
// src/index.ts
|
|
5824
5825
|
var experimental_Audio = Audio;
|
|
@@ -8,7 +8,7 @@ type AudioSinks = {
|
|
|
8
8
|
};
|
|
9
9
|
export type AudioSinkResult = AudioSinks | 'no-audio-track' | 'cannot-decode-audio' | 'unknown-container-format' | 'network-error';
|
|
10
10
|
export type VideoSinkResult = VideoSinks | 'no-video-track' | 'cannot-decode' | 'cannot-decode-alpha' | 'unknown-container-format' | 'network-error';
|
|
11
|
-
export declare const getSinks: (src: string, credentials: RequestCredentials | undefined, requestInit?: MediaRequestInit | undefined) => Promise<{
|
|
11
|
+
export declare const getSinks: (src: string, logLevel: "error" | "info" | "trace" | "verbose" | "warn", credentials: RequestCredentials | undefined, requestInit?: MediaRequestInit | undefined) => Promise<{
|
|
12
12
|
getVideo: () => Promise<VideoSinkResult>;
|
|
13
13
|
getAudio: (index: number | null) => Promise<AudioSinkResult>;
|
|
14
14
|
actualMatroskaTimestamps: {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remotion/media",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.482",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"module": "dist/esm/index.mjs",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
25
|
"mediabunny": "1.47.0",
|
|
26
|
-
"remotion": "4.0.
|
|
26
|
+
"remotion": "4.0.482",
|
|
27
27
|
"zod": "4.3.6"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"react-dom": ">=16.8.0"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
|
-
"@remotion/eslint-config-internal": "4.0.
|
|
34
|
+
"@remotion/eslint-config-internal": "4.0.482",
|
|
35
35
|
"@vitest/browser-webdriverio": "4.0.9",
|
|
36
36
|
"eslint": "9.19.0",
|
|
37
37
|
"react": "19.2.3",
|