remotion 3.3.52 → 3.3.53

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 (194) hide show
  1. package/dist/cjs/version.d.ts +1 -1
  2. package/dist/cjs/version.js +1 -1
  3. package/dist/esm/version.d.ts +1 -1
  4. package/dist/esm/version.js +1 -1
  5. package/dist/tsconfig-cjs.tsbuildinfo +1 -1
  6. package/package.json +2 -2
  7. package/dist/AbsoluteFill.d.ts +0 -6
  8. package/dist/AbsoluteFill.js +0 -28
  9. package/dist/CanUseRemotionHooks.d.ts +0 -5
  10. package/dist/CanUseRemotionHooks.js +0 -10
  11. package/dist/Clipper.d.ts +0 -7
  12. package/dist/Clipper.js +0 -24
  13. package/dist/Composition.d.ts +0 -23
  14. package/dist/Composition.js +0 -113
  15. package/dist/CompositionManager.d.ts +0 -82
  16. package/dist/CompositionManager.js +0 -164
  17. package/dist/Folder.d.ts +0 -15
  18. package/dist/Folder.js +0 -33
  19. package/dist/IFrame.d.ts +0 -2
  20. package/dist/IFrame.js +0 -24
  21. package/dist/Img.d.ts +0 -2
  22. package/dist/Img.js +0 -52
  23. package/dist/NativeLayers.d.ts +0 -13
  24. package/dist/NativeLayers.js +0 -29
  25. package/dist/Null.d.ts +0 -2
  26. package/dist/Null.js +0 -25
  27. package/dist/RemotionRoot.d.ts +0 -5
  28. package/dist/RemotionRoot.js +0 -73
  29. package/dist/Sequence.d.ts +0 -29
  30. package/dist/Sequence.js +0 -131
  31. package/dist/Still.d.ts +0 -2
  32. package/dist/Still.js +0 -9
  33. package/dist/absolute-src.d.ts +0 -1
  34. package/dist/absolute-src.js +0 -7
  35. package/dist/asset-types.d.ts +0 -50
  36. package/dist/asset-types.js +0 -1
  37. package/dist/audio/Audio.d.ts +0 -8
  38. package/dist/audio/Audio.js +0 -52
  39. package/dist/audio/AudioForDevelopment.d.ts +0 -11
  40. package/dist/audio/AudioForDevelopment.js +0 -94
  41. package/dist/audio/AudioForRendering.d.ts +0 -10
  42. package/dist/audio/AudioForRendering.js +0 -111
  43. package/dist/audio/index.d.ts +0 -2
  44. package/dist/audio/index.js +0 -18
  45. package/dist/audio/props.d.ts +0 -12
  46. package/dist/audio/props.js +0 -2
  47. package/dist/audio/shared-audio-tags.d.ts +0 -37
  48. package/dist/audio/shared-audio-tags.js +0 -222
  49. package/dist/audio/use-audio-frame.d.ts +0 -6
  50. package/dist/audio/use-audio-frame.js +0 -23
  51. package/dist/bezier.d.ts +0 -1
  52. package/dist/bezier.js +0 -114
  53. package/dist/cancel-render.d.ts +0 -1
  54. package/dist/cancel-render.js +0 -43
  55. package/dist/config/input-props.d.ts +0 -1
  56. package/dist/config/input-props.js +0 -31
  57. package/dist/config.d.ts +0 -285
  58. package/dist/config.js +0 -21
  59. package/dist/default-css.d.ts +0 -3
  60. package/dist/default-css.js +0 -49
  61. package/dist/delay-render.d.ts +0 -14
  62. package/dist/delay-render.js +0 -77
  63. package/dist/easing.d.ts +0 -19
  64. package/dist/easing.js +0 -77
  65. package/dist/freeze.d.ts +0 -7
  66. package/dist/freeze.js +0 -34
  67. package/dist/get-asset-file-name.d.ts +0 -1
  68. package/dist/get-asset-file-name.js +0 -14
  69. package/dist/get-environment.d.ts +0 -3
  70. package/dist/get-environment.js +0 -34
  71. package/dist/get-preview-dom-element.d.ts +0 -1
  72. package/dist/get-preview-dom-element.js +0 -7
  73. package/dist/get-static-files.d.ts +0 -17
  74. package/dist/get-static-files.js +0 -31
  75. package/dist/get-timeline-clip-name.d.ts +0 -1
  76. package/dist/get-timeline-clip-name.js +0 -25
  77. package/dist/index.d.ts +0 -92
  78. package/dist/index.js +0 -73
  79. package/dist/internals.d.ts +0 -97
  80. package/dist/internals.js +0 -99
  81. package/dist/interpolate-colors.d.ts +0 -5
  82. package/dist/interpolate-colors.js +0 -401
  83. package/dist/interpolate.d.ts +0 -18
  84. package/dist/interpolate.js +0 -123
  85. package/dist/is-approximately-the-same.d.ts +0 -1
  86. package/dist/is-approximately-the-same.js +0 -8
  87. package/dist/is-player.d.ts +0 -3
  88. package/dist/is-player.js +0 -14
  89. package/dist/loading-indicator.d.ts +0 -2
  90. package/dist/loading-indicator.js +0 -35
  91. package/dist/loop/index.d.ts +0 -9
  92. package/dist/loop/index.js +0 -29
  93. package/dist/multiple-versions-warning.d.ts +0 -1
  94. package/dist/multiple-versions-warning.js +0 -32
  95. package/dist/nonce.d.ts +0 -7
  96. package/dist/nonce.js +0 -17
  97. package/dist/play-and-handle-not-allowed-error.d.ts +0 -2
  98. package/dist/play-and-handle-not-allowed-error.js +0 -44
  99. package/dist/portal-node.d.ts +0 -1
  100. package/dist/portal-node.js +0 -23
  101. package/dist/prefetch-state.d.ts +0 -8
  102. package/dist/prefetch-state.js +0 -27
  103. package/dist/prefetch.d.ts +0 -9
  104. package/dist/prefetch.js +0 -108
  105. package/dist/random.d.ts +0 -7
  106. package/dist/random.js +0 -41
  107. package/dist/register-root.d.ts +0 -4
  108. package/dist/register-root.js +0 -33
  109. package/dist/series/flatten-children.d.ts +0 -2
  110. package/dist/series/flatten-children.js +0 -19
  111. package/dist/series/index.d.ts +0 -13
  112. package/dist/series/index.js +0 -60
  113. package/dist/setup-env-variables.d.ts +0 -2
  114. package/dist/setup-env-variables.js +0 -36
  115. package/dist/spring/index.d.ts +0 -27
  116. package/dist/spring/index.js +0 -51
  117. package/dist/spring/measure-spring.d.ts +0 -8
  118. package/dist/spring/measure-spring.js +0 -64
  119. package/dist/spring/spring-utils.d.ts +0 -21
  120. package/dist/spring/spring-utils.js +0 -103
  121. package/dist/static-file.d.ts +0 -5
  122. package/dist/static-file.js +0 -33
  123. package/dist/timeline-position-state.d.ts +0 -29
  124. package/dist/timeline-position-state.js +0 -41
  125. package/dist/truthy.d.ts +0 -3
  126. package/dist/truthy.js +0 -7
  127. package/dist/use-current-frame.d.ts +0 -6
  128. package/dist/use-current-frame.js +0 -28
  129. package/dist/use-lazy-component.d.ts +0 -7
  130. package/dist/use-lazy-component.js +0 -49
  131. package/dist/use-media-in-timeline.d.ts +0 -10
  132. package/dist/use-media-in-timeline.js +0 -129
  133. package/dist/use-media-playback.d.ts +0 -10
  134. package/dist/use-media-playback.js +0 -77
  135. package/dist/use-media-tag-volume.d.ts +0 -2
  136. package/dist/use-media-tag-volume.js +0 -31
  137. package/dist/use-sync-volume-with-media-tag.d.ts +0 -10
  138. package/dist/use-sync-volume-with-media-tag.js +0 -21
  139. package/dist/use-unsafe-video-config.d.ts +0 -2
  140. package/dist/use-unsafe-video-config.js +0 -27
  141. package/dist/use-video-config.d.ts +0 -7
  142. package/dist/use-video-config.js +0 -29
  143. package/dist/use-video.d.ts +0 -12
  144. package/dist/use-video.js +0 -28
  145. package/dist/validate-media-props.d.ts +0 -4
  146. package/dist/validate-media-props.js +0 -24
  147. package/dist/validate-start-from-props.d.ts +0 -1
  148. package/dist/validate-start-from-props.js +0 -31
  149. package/dist/validation/validate-composition-id.d.ts +0 -3
  150. package/dist/validation/validate-composition-id.js +0 -13
  151. package/dist/validation/validate-dimensions.d.ts +0 -1
  152. package/dist/validation/validate-dimensions.js +0 -21
  153. package/dist/validation/validate-duration-in-frames.d.ts +0 -1
  154. package/dist/validation/validate-duration-in-frames.js +0 -15
  155. package/dist/validation/validate-folder-name.d.ts +0 -3
  156. package/dist/validation/validate-folder-name.js +0 -19
  157. package/dist/validation/validate-fps.d.ts +0 -1
  158. package/dist/validation/validate-fps.js +0 -21
  159. package/dist/validation/validate-offthreadvideo-image-format.d.ts +0 -1
  160. package/dist/validation/validate-offthreadvideo-image-format.js +0 -15
  161. package/dist/validation/validation-spring-duration.d.ts +0 -1
  162. package/dist/validation/validation-spring-duration.js +0 -21
  163. package/dist/version.d.ts +0 -1
  164. package/dist/version.js +0 -5
  165. package/dist/video/OffthreadVideo.d.ts +0 -3
  166. package/dist/video/OffthreadVideo.js +0 -33
  167. package/dist/video/OffthreadVideoForRendering.d.ts +0 -3
  168. package/dist/video/OffthreadVideoForRendering.js +0 -104
  169. package/dist/video/Video.d.ts +0 -8
  170. package/dist/video/Video.js +0 -50
  171. package/dist/video/VideoForDevelopment.d.ts +0 -11
  172. package/dist/video/VideoForDevelopment.js +0 -113
  173. package/dist/video/VideoForRendering.d.ts +0 -10
  174. package/dist/video/VideoForRendering.js +0 -203
  175. package/dist/video/duration-state.d.ts +0 -17
  176. package/dist/video/duration-state.js +0 -34
  177. package/dist/video/get-current-time.d.ts +0 -13
  178. package/dist/video/get-current-time.js +0 -31
  179. package/dist/video/index.d.ts +0 -3
  180. package/dist/video/index.js +0 -7
  181. package/dist/video/props.d.ts +0 -25
  182. package/dist/video/props.js +0 -2
  183. package/dist/video/video-fragment.d.ts +0 -12
  184. package/dist/video/video-fragment.js +0 -60
  185. package/dist/video-config.d.ts +0 -8
  186. package/dist/video-config.js +0 -2
  187. package/dist/volume-position-state.d.ts +0 -19
  188. package/dist/volume-position-state.js +0 -32
  189. package/dist/volume-prop.d.ts +0 -7
  190. package/dist/volume-prop.js +0 -24
  191. package/dist/warn-about-non-seekable-media.d.ts +0 -1
  192. package/dist/warn-about-non-seekable-media.js +0 -34
  193. package/dist/wrap-remotion-context.d.ts +0 -18
  194. package/dist/wrap-remotion-context.js +0 -73
@@ -1,64 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.measureSpring = void 0;
4
- const validate_fps_1 = require("../validation/validate-fps");
5
- const spring_utils_1 = require("./spring-utils");
6
- function measureSpring({ fps, config = {}, threshold = 0.005, from = 0, to = 1, }) {
7
- if (typeof threshold !== 'number') {
8
- throw new TypeError(`threshold must be a number, got ${threshold} of type ${typeof threshold}`);
9
- }
10
- if (threshold === 0) {
11
- return Infinity;
12
- }
13
- if (threshold === 1) {
14
- return 0;
15
- }
16
- if (isNaN(threshold)) {
17
- throw new TypeError('Threshold is NaN');
18
- }
19
- if (!Number.isFinite(threshold)) {
20
- throw new TypeError('Threshold is not finite');
21
- }
22
- if (threshold < 0) {
23
- throw new TypeError('Threshold is below 0');
24
- }
25
- (0, validate_fps_1.validateFps)(fps, 'to the measureSpring() function', false);
26
- const range = Math.abs(from - to);
27
- let frame = 0;
28
- let finishedFrame = 0;
29
- const calc = () => {
30
- return (0, spring_utils_1.springCalculation)({
31
- fps,
32
- frame,
33
- config,
34
- from,
35
- to,
36
- });
37
- };
38
- let animation = calc();
39
- const calcDifference = () => {
40
- return (Math.abs(animation.current - animation.toValue) /
41
- (range === 0 ? 1 : range));
42
- };
43
- let difference = calcDifference();
44
- while (difference >= threshold) {
45
- frame++;
46
- animation = calc();
47
- difference = calcDifference();
48
- }
49
- // Since spring is bouncy, just because it's under the threshold we
50
- // cannot be sure it's done. We need to animate further until it stays in the
51
- // threshold for, say, 20 frames.
52
- finishedFrame = frame;
53
- for (let i = 0; i < 20; i++) {
54
- frame++;
55
- animation = calc();
56
- difference = calcDifference();
57
- if (difference >= threshold) {
58
- i = 0;
59
- finishedFrame = frame + 1;
60
- }
61
- }
62
- return finishedFrame;
63
- }
64
- exports.measureSpring = measureSpring;
@@ -1,21 +0,0 @@
1
- declare type AnimationNode = {
2
- lastTimestamp: number;
3
- toValue: number;
4
- current: number;
5
- velocity: number;
6
- prevPosition?: number;
7
- };
8
- export declare type SpringConfig = {
9
- damping: number;
10
- mass: number;
11
- stiffness: number;
12
- overshootClamping: boolean;
13
- };
14
- export declare function springCalculation({ from, to, frame, fps, config, }: {
15
- from?: number;
16
- to?: number;
17
- frame: number;
18
- fps: number;
19
- config?: Partial<SpringConfig>;
20
- }): AnimationNode;
21
- export {};
@@ -1,103 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.springCalculation = void 0;
4
- const defaultSpringConfig = {
5
- damping: 10,
6
- mass: 1,
7
- stiffness: 100,
8
- overshootClamping: false,
9
- };
10
- const advanceCache = {};
11
- function advance({ animation, now, config, }) {
12
- const { toValue, lastTimestamp, current, velocity } = animation;
13
- const deltaTime = Math.min(now - lastTimestamp, 64);
14
- const c = config.damping;
15
- const m = config.mass;
16
- const k = config.stiffness;
17
- const cacheKey = [
18
- toValue,
19
- lastTimestamp,
20
- current,
21
- velocity,
22
- c,
23
- m,
24
- k,
25
- now,
26
- ].join('-');
27
- if (advanceCache[cacheKey]) {
28
- return advanceCache[cacheKey];
29
- }
30
- const v0 = -velocity;
31
- const x0 = toValue - current;
32
- const zeta = c / (2 * Math.sqrt(k * m)); // damping ratio
33
- const omega0 = Math.sqrt(k / m); // undamped angular frequency of the oscillator (rad/ms)
34
- const omega1 = omega0 * Math.sqrt(1 - zeta ** 2); // exponential decay
35
- const t = deltaTime / 1000;
36
- const sin1 = Math.sin(omega1 * t);
37
- const cos1 = Math.cos(omega1 * t);
38
- // under damped
39
- const underDampedEnvelope = Math.exp(-zeta * omega0 * t);
40
- const underDampedFrag1 = underDampedEnvelope *
41
- (sin1 * ((v0 + zeta * omega0 * x0) / omega1) + x0 * cos1);
42
- const underDampedPosition = toValue - underDampedFrag1;
43
- // This looks crazy -- it's actually just the derivative of the oscillation function
44
- const underDampedVelocity = zeta * omega0 * underDampedFrag1 -
45
- underDampedEnvelope *
46
- (cos1 * (v0 + zeta * omega0 * x0) - omega1 * x0 * sin1);
47
- // critically damped
48
- const criticallyDampedEnvelope = Math.exp(-omega0 * t);
49
- const criticallyDampedPosition = toValue - criticallyDampedEnvelope * (x0 + (v0 + omega0 * x0) * t);
50
- const criticallyDampedVelocity = criticallyDampedEnvelope *
51
- (v0 * (t * omega0 - 1) + t * x0 * omega0 * omega0);
52
- const animationNode = {
53
- toValue,
54
- prevPosition: current,
55
- lastTimestamp: now,
56
- current: zeta < 1 ? underDampedPosition : criticallyDampedPosition,
57
- velocity: zeta < 1 ? underDampedVelocity : criticallyDampedVelocity,
58
- };
59
- advanceCache[cacheKey] = animationNode;
60
- return animationNode;
61
- }
62
- const calculationCache = {};
63
- function springCalculation({ from = 0, to = 1, frame, fps, config = {}, }) {
64
- const cacheKey = [
65
- from,
66
- to,
67
- frame,
68
- fps,
69
- config.damping,
70
- config.mass,
71
- config.overshootClamping,
72
- config.stiffness,
73
- ].join('-');
74
- if (calculationCache[cacheKey]) {
75
- return calculationCache[cacheKey];
76
- }
77
- let animation = {
78
- lastTimestamp: 0,
79
- current: from,
80
- toValue: to,
81
- velocity: 0,
82
- prevPosition: 0,
83
- };
84
- const frameClamped = Math.max(0, frame);
85
- const unevenRest = frameClamped % 1;
86
- for (let f = 0; f <= Math.floor(frameClamped); f++) {
87
- if (f === Math.floor(frameClamped)) {
88
- f += unevenRest;
89
- }
90
- const time = (f / fps) * 1000;
91
- animation = advance({
92
- animation,
93
- now: time,
94
- config: {
95
- ...defaultSpringConfig,
96
- ...config,
97
- },
98
- });
99
- }
100
- calculationCache[cacheKey] = animation;
101
- return animation;
102
- }
103
- exports.springCalculation = springCalculation;
@@ -1,5 +0,0 @@
1
- /**
2
- * Reference a file from the public/ folder.
3
- * If the file does not appear in the autocomplete, type the path manually.
4
- */
5
- export declare const staticFile: (path: string) => string;
@@ -1,33 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.staticFile = void 0;
4
- const trimLeadingSlash = (path) => {
5
- if (path.startsWith('/')) {
6
- return trimLeadingSlash(path.substr(1));
7
- }
8
- return path;
9
- };
10
- const inner = (path) => {
11
- if (typeof window !== 'undefined' && window.remotion_staticBase) {
12
- return `${window.remotion_staticBase}/${trimLeadingSlash(path)}`;
13
- }
14
- return `/${trimLeadingSlash(path)}`;
15
- };
16
- /**
17
- * Reference a file from the public/ folder.
18
- * If the file does not appear in the autocomplete, type the path manually.
19
- */
20
- const staticFile = (path) => {
21
- if (path.startsWith('http://') || path.startsWith('https://')) {
22
- throw new TypeError(`staticFile() does not support remote URLs - got "${path}". Instead, pass the URL without wrapping it in staticFile(). See: https://remotion.dev/docs/staticfile-remote-urls`);
23
- }
24
- if (path.startsWith('..') || path.startsWith('./')) {
25
- throw new TypeError(`staticFile() does not support relative paths - got "${path}". Instead, pass the name of a file that is inside the public/ folder. See: https://remotion.dev/docs/staticfile-relative-paths`);
26
- }
27
- const preparsed = inner(path);
28
- if (!preparsed.startsWith('/')) {
29
- return `/${preparsed}`;
30
- }
31
- return preparsed;
32
- };
33
- exports.staticFile = staticFile;
@@ -1,29 +0,0 @@
1
- import type { MutableRefObject } from 'react';
2
- export declare type PlayableMediaTag = {
3
- play: () => void;
4
- id: string;
5
- };
6
- export declare type TimelineContextValue = {
7
- frame: number;
8
- playing: boolean;
9
- rootId: string;
10
- playbackRate: number;
11
- imperativePlaying: MutableRefObject<boolean>;
12
- setPlaybackRate: (u: React.SetStateAction<number>) => void;
13
- audioAndVideoTags: MutableRefObject<PlayableMediaTag[]>;
14
- };
15
- export declare type SetTimelineContextValue = {
16
- setFrame: (u: React.SetStateAction<number>) => void;
17
- setPlaying: (u: React.SetStateAction<boolean>) => void;
18
- };
19
- export declare const TimelineContext: import("react").Context<TimelineContextValue>;
20
- export declare const SetTimelineContext: import("react").Context<SetTimelineContextValue>;
21
- export declare const useTimelinePosition: () => number;
22
- export declare const useTimelineSetFrame: () => (u: React.SetStateAction<number>) => void;
23
- declare type PlayingReturnType = readonly [
24
- boolean,
25
- (u: React.SetStateAction<boolean>) => void,
26
- MutableRefObject<boolean>
27
- ];
28
- export declare const usePlayingState: () => PlayingReturnType;
29
- export {};
@@ -1,41 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.usePlayingState = exports.useTimelineSetFrame = exports.useTimelinePosition = exports.SetTimelineContext = exports.TimelineContext = void 0;
4
- const react_1 = require("react");
5
- exports.TimelineContext = (0, react_1.createContext)({
6
- frame: 0,
7
- playing: false,
8
- playbackRate: 1,
9
- rootId: '',
10
- imperativePlaying: {
11
- current: false,
12
- },
13
- setPlaybackRate: () => {
14
- throw new Error('default');
15
- },
16
- audioAndVideoTags: { current: [] },
17
- });
18
- exports.SetTimelineContext = (0, react_1.createContext)({
19
- setFrame: () => {
20
- throw new Error('default');
21
- },
22
- setPlaying: () => {
23
- throw new Error('default');
24
- },
25
- });
26
- const useTimelinePosition = () => {
27
- const state = (0, react_1.useContext)(exports.TimelineContext);
28
- return state.frame;
29
- };
30
- exports.useTimelinePosition = useTimelinePosition;
31
- const useTimelineSetFrame = () => {
32
- const { setFrame } = (0, react_1.useContext)(exports.SetTimelineContext);
33
- return setFrame;
34
- };
35
- exports.useTimelineSetFrame = useTimelineSetFrame;
36
- const usePlayingState = () => {
37
- const { playing, imperativePlaying } = (0, react_1.useContext)(exports.TimelineContext);
38
- const { setPlaying } = (0, react_1.useContext)(exports.SetTimelineContext);
39
- return (0, react_1.useMemo)(() => [playing, setPlaying, imperativePlaying], [imperativePlaying, playing, setPlaying]);
40
- };
41
- exports.usePlayingState = usePlayingState;
package/dist/truthy.d.ts DELETED
@@ -1,3 +0,0 @@
1
- declare type Truthy<T> = T extends false | '' | 0 | null | undefined ? never : T;
2
- export declare function truthy<T>(value: T): value is Truthy<T>;
3
- export {};
package/dist/truthy.js DELETED
@@ -1,7 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.truthy = void 0;
4
- function truthy(value) {
5
- return Boolean(value);
6
- }
7
- exports.truthy = truthy;
@@ -1,6 +0,0 @@
1
- /**
2
- * Get the current frame of the video.
3
- * Frames are 0-indexed, meaning the first frame is 0, the last frame is the duration of the composition in frames minus one.
4
- * @link https://www.remotion.dev/docs/use-current-frame
5
- */
6
- export declare const useCurrentFrame: () => number;
@@ -1,28 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useCurrentFrame = void 0;
4
- const react_1 = require("react");
5
- const CanUseRemotionHooks_1 = require("./CanUseRemotionHooks");
6
- const Sequence_1 = require("./Sequence");
7
- const timeline_position_state_1 = require("./timeline-position-state");
8
- /**
9
- * Get the current frame of the video.
10
- * Frames are 0-indexed, meaning the first frame is 0, the last frame is the duration of the composition in frames minus one.
11
- * @link https://www.remotion.dev/docs/use-current-frame
12
- */
13
- const useCurrentFrame = () => {
14
- const canUseRemotionHooks = (0, react_1.useContext)(CanUseRemotionHooks_1.CanUseRemotionHooks);
15
- if (!canUseRemotionHooks) {
16
- if (typeof window !== 'undefined' && window.remotion_isPlayer) {
17
- throw new Error(`useCurrentFrame can only be called inside a component that was passed to <Player>. See: https://www.remotion.dev/docs/player/examples`);
18
- }
19
- throw new Error(`useCurrentFrame() can only be called inside a component that was registered as a composition. See https://www.remotion.dev/docs/the-fundamentals#defining-compositions`);
20
- }
21
- const frame = (0, timeline_position_state_1.useTimelinePosition)();
22
- const context = (0, react_1.useContext)(Sequence_1.SequenceContext);
23
- const contextOffset = context
24
- ? context.cumulatedFrom + context.relativeFrom
25
- : 0;
26
- return frame - contextOffset;
27
- };
28
- exports.useCurrentFrame = useCurrentFrame;
@@ -1,7 +0,0 @@
1
- import type { ComponentPropsWithRef, ComponentType, ExoticComponent } from 'react';
2
- import type { CompProps } from './internals';
3
- declare type LazyExoticComponent<T extends ComponentType<any>> = ExoticComponent<ComponentPropsWithRef<T>> & {
4
- readonly _result: T;
5
- };
6
- export declare const useLazyComponent: <T>(compProps: CompProps<T>) => LazyExoticComponent<ComponentType<T>>;
7
- export {};
@@ -1,49 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.useLazyComponent = void 0;
27
- const react_1 = __importStar(require("react"));
28
- // Expected, it can be any component props
29
- const useLazyComponent = (compProps) => {
30
- const lazy = (0, react_1.useMemo)(() => {
31
- if ('lazyComponent' in compProps) {
32
- return react_1.default.lazy(compProps.lazyComponent);
33
- }
34
- if ('component' in compProps) {
35
- // In SSR, suspense is not yet supported, we cannot use React.lazy
36
- if (typeof document === 'undefined') {
37
- return compProps.component;
38
- }
39
- return react_1.default.lazy(() => Promise.resolve({ default: compProps.component }));
40
- }
41
- throw new Error("You must pass either 'component' or 'lazyComponent'");
42
- // Very important to leave the dependencies as they are, or instead
43
- // the player will remount on every frame.
44
- // @ts-expect-error
45
- // eslint-disable-next-line react-hooks/exhaustive-deps
46
- }, [compProps.component, compProps.lazyComponent]);
47
- return lazy;
48
- };
49
- exports.useLazyComponent = useLazyComponent;
@@ -1,10 +0,0 @@
1
- import type { RefObject } from 'react';
2
- import type { VolumeProp } from './volume-prop';
3
- export declare const useMediaInTimeline: ({ volume, mediaVolume, mediaRef, src, mediaType, playbackRate, }: {
4
- volume: VolumeProp | undefined;
5
- mediaVolume: number;
6
- mediaRef: RefObject<HTMLAudioElement | HTMLVideoElement>;
7
- src: string | undefined;
8
- mediaType: 'audio' | 'video';
9
- playbackRate: number;
10
- }) => void;
@@ -1,129 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useMediaInTimeline = void 0;
4
- const react_1 = require("react");
5
- const use_audio_frame_1 = require("./audio/use-audio-frame");
6
- const CompositionManager_1 = require("./CompositionManager");
7
- const get_asset_file_name_1 = require("./get-asset-file-name");
8
- const get_environment_1 = require("./get-environment");
9
- const nonce_1 = require("./nonce");
10
- const play_and_handle_not_allowed_error_1 = require("./play-and-handle-not-allowed-error");
11
- const Sequence_1 = require("./Sequence");
12
- const timeline_position_state_1 = require("./timeline-position-state");
13
- const use_video_config_1 = require("./use-video-config");
14
- const volume_prop_1 = require("./volume-prop");
15
- const didWarn = {};
16
- const warnOnce = (message) => {
17
- if (didWarn[message]) {
18
- return;
19
- }
20
- console.warn(message);
21
- didWarn[message] = true;
22
- };
23
- const useMediaInTimeline = ({ volume, mediaVolume, mediaRef, src, mediaType, playbackRate, }) => {
24
- const videoConfig = (0, use_video_config_1.useVideoConfig)();
25
- const { rootId, audioAndVideoTags } = (0, react_1.useContext)(timeline_position_state_1.TimelineContext);
26
- const parentSequence = (0, react_1.useContext)(Sequence_1.SequenceContext);
27
- const actualFrom = parentSequence
28
- ? parentSequence.relativeFrom + parentSequence.cumulatedFrom
29
- : 0;
30
- const [playing] = (0, timeline_position_state_1.usePlayingState)();
31
- const startsAt = (0, use_audio_frame_1.useMediaStartsAt)();
32
- const { registerSequence, unregisterSequence } = (0, react_1.useContext)(CompositionManager_1.CompositionManager);
33
- const [id] = (0, react_1.useState)(() => String(Math.random()));
34
- const [initialVolume] = (0, react_1.useState)(() => volume);
35
- const nonce = (0, nonce_1.useNonce)();
36
- const duration = parentSequence
37
- ? Math.min(parentSequence.durationInFrames, videoConfig.durationInFrames)
38
- : videoConfig.durationInFrames;
39
- const doesVolumeChange = typeof volume === 'function';
40
- const environment = (0, get_environment_1.useRemotionEnvironment)();
41
- const volumes = (0, react_1.useMemo)(() => {
42
- if (typeof volume === 'number') {
43
- return volume;
44
- }
45
- return new Array(Math.max(0, duration + startsAt))
46
- .fill(true)
47
- .map((_, i) => {
48
- return (0, volume_prop_1.evaluateVolume)({
49
- frame: i + startsAt,
50
- volume,
51
- mediaVolume,
52
- allowAmplificationDuringRender: false,
53
- });
54
- })
55
- .join(',');
56
- }, [duration, startsAt, volume, mediaVolume]);
57
- (0, react_1.useEffect)(() => {
58
- if (typeof volume === 'number' && volume !== initialVolume) {
59
- warnOnce(`Remotion: The ${mediaType} with src ${src} has changed it's volume. Prefer the callback syntax for setting volume to get better timeline display: https://www.remotion.dev/docs/using-audio/#controlling-volume`);
60
- }
61
- }, [initialVolume, mediaType, src, volume]);
62
- (0, react_1.useEffect)(() => {
63
- var _a;
64
- if (!mediaRef.current) {
65
- return;
66
- }
67
- if (!src) {
68
- throw new Error('No src passed');
69
- }
70
- if (environment !== 'preview' && process.env.NODE_ENV !== 'test') {
71
- return;
72
- }
73
- registerSequence({
74
- type: mediaType,
75
- src,
76
- id,
77
- duration,
78
- from: 0,
79
- parent: (_a = parentSequence === null || parentSequence === void 0 ? void 0 : parentSequence.id) !== null && _a !== void 0 ? _a : null,
80
- displayName: (0, get_asset_file_name_1.getAssetDisplayName)(src),
81
- rootId,
82
- volume: volumes,
83
- showInTimeline: true,
84
- nonce,
85
- startMediaFrom: 0 - startsAt,
86
- doesVolumeChange,
87
- showLoopTimesInTimeline: undefined,
88
- playbackRate,
89
- });
90
- return () => {
91
- unregisterSequence(id);
92
- };
93
- }, [
94
- actualFrom,
95
- duration,
96
- id,
97
- parentSequence,
98
- src,
99
- registerSequence,
100
- rootId,
101
- unregisterSequence,
102
- videoConfig,
103
- volumes,
104
- doesVolumeChange,
105
- nonce,
106
- mediaRef,
107
- mediaType,
108
- startsAt,
109
- playbackRate,
110
- environment,
111
- ]);
112
- (0, react_1.useEffect)(() => {
113
- const tag = {
114
- id,
115
- play: () => {
116
- if (!playing) {
117
- // Don't play if for example in a <Freeze> state.
118
- return;
119
- }
120
- return (0, play_and_handle_not_allowed_error_1.playAndHandleNotAllowedError)(mediaRef, mediaType);
121
- },
122
- };
123
- audioAndVideoTags.current.push(tag);
124
- return () => {
125
- audioAndVideoTags.current = audioAndVideoTags.current.filter((a) => a.id !== id);
126
- };
127
- }, [audioAndVideoTags, id, mediaRef, mediaType, playing]);
128
- };
129
- exports.useMediaInTimeline = useMediaInTimeline;
@@ -1,10 +0,0 @@
1
- import type { RefObject } from 'react';
2
- export declare const DEFAULT_ACCEPTABLE_TIMESHIFT = 0.45;
3
- export declare const useMediaPlayback: ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, onlyWarnForMediaSeekingError, acceptableTimeshift, }: {
4
- mediaRef: RefObject<HTMLVideoElement | HTMLAudioElement>;
5
- src: string | undefined;
6
- mediaType: 'audio' | 'video';
7
- playbackRate: number;
8
- onlyWarnForMediaSeekingError: boolean;
9
- acceptableTimeshift: number;
10
- }) => void;
@@ -1,77 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.useMediaPlayback = exports.DEFAULT_ACCEPTABLE_TIMESHIFT = void 0;
4
- const react_1 = require("react");
5
- const use_audio_frame_1 = require("./audio/use-audio-frame");
6
- const play_and_handle_not_allowed_error_1 = require("./play-and-handle-not-allowed-error");
7
- const timeline_position_state_1 = require("./timeline-position-state");
8
- const use_current_frame_1 = require("./use-current-frame");
9
- const use_video_config_1 = require("./use-video-config");
10
- const get_current_time_1 = require("./video/get-current-time");
11
- const warn_about_non_seekable_media_1 = require("./warn-about-non-seekable-media");
12
- exports.DEFAULT_ACCEPTABLE_TIMESHIFT = 0.45;
13
- const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, onlyWarnForMediaSeekingError, acceptableTimeshift, }) => {
14
- const { playbackRate: globalPlaybackRate } = (0, react_1.useContext)(timeline_position_state_1.TimelineContext);
15
- const frame = (0, use_current_frame_1.useCurrentFrame)();
16
- const absoluteFrame = (0, timeline_position_state_1.useTimelinePosition)();
17
- const [playing] = (0, timeline_position_state_1.usePlayingState)();
18
- const { fps } = (0, use_video_config_1.useVideoConfig)();
19
- const mediaStartsAt = (0, use_audio_frame_1.useMediaStartsAt)();
20
- const playbackRate = localPlaybackRate * globalPlaybackRate;
21
- (0, react_1.useEffect)(() => {
22
- var _a;
23
- if (!playing) {
24
- (_a = mediaRef.current) === null || _a === void 0 ? void 0 : _a.pause();
25
- }
26
- }, [mediaRef, mediaType, playing]);
27
- (0, react_1.useEffect)(() => {
28
- const tagName = mediaType === 'audio' ? '<Audio>' : '<Video>';
29
- if (!mediaRef.current) {
30
- throw new Error(`No ${mediaType} ref found`);
31
- }
32
- if (!src) {
33
- throw new Error(`No 'src' attribute was passed to the ${tagName} element.`);
34
- }
35
- mediaRef.current.playbackRate = Math.max(0, playbackRate);
36
- const shouldBeTime = (0, get_current_time_1.getMediaTime)({
37
- fps,
38
- frame,
39
- src,
40
- playbackRate: localPlaybackRate,
41
- startFrom: -mediaStartsAt,
42
- mediaType,
43
- });
44
- const isTime = mediaRef.current.currentTime;
45
- const timeShift = Math.abs(shouldBeTime - isTime);
46
- if (timeShift > acceptableTimeshift && !mediaRef.current.ended) {
47
- // If scrubbing around, adjust timing
48
- // or if time shift is bigger than 0.2sec
49
- mediaRef.current.currentTime = shouldBeTime;
50
- if (!onlyWarnForMediaSeekingError) {
51
- (0, warn_about_non_seekable_media_1.warnAboutNonSeekableMedia)(mediaRef.current, onlyWarnForMediaSeekingError ? 'console-warning' : 'console-error');
52
- }
53
- }
54
- if (!playing || absoluteFrame === 0) {
55
- mediaRef.current.currentTime = shouldBeTime;
56
- }
57
- if (mediaRef.current.paused && !mediaRef.current.ended && playing) {
58
- const { current } = mediaRef;
59
- current.currentTime = shouldBeTime;
60
- (0, play_and_handle_not_allowed_error_1.playAndHandleNotAllowedError)(mediaRef, mediaType);
61
- }
62
- }, [
63
- absoluteFrame,
64
- fps,
65
- playbackRate,
66
- frame,
67
- mediaRef,
68
- mediaType,
69
- playing,
70
- src,
71
- mediaStartsAt,
72
- localPlaybackRate,
73
- onlyWarnForMediaSeekingError,
74
- acceptableTimeshift,
75
- ]);
76
- };
77
- exports.useMediaPlayback = useMediaPlayback;
@@ -1,2 +0,0 @@
1
- import type { RefObject } from 'react';
2
- export declare const useMediaTagVolume: (mediaRef: RefObject<HTMLVideoElement | HTMLAudioElement>) => number;