remotion 3.0.19 → 3.0.22
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/.turbo/turbo-build.log +5 -5
- package/dist/AbsoluteFill.d.ts +4 -0
- package/dist/AbsoluteFill.js +4 -0
- package/dist/Composition.d.ts +1 -5
- package/dist/Composition.js +3 -29
- package/dist/CompositionManager.d.ts +1 -4
- package/dist/Folder.d.ts +15 -0
- package/dist/Folder.js +33 -0
- package/dist/Sequence.d.ts +19 -0
- package/dist/Sequence.js +123 -0
- package/dist/audio/Audio.d.ts +2 -2
- package/dist/audio/Audio.js +2 -2
- package/dist/audio/AudioForDevelopment.d.ts +2 -2
- package/dist/audio/AudioForRendering.d.ts +1 -1
- package/dist/audio/AudioForRendering.js +5 -5
- package/dist/audio/use-audio-frame.js +4 -4
- package/dist/config/override-webpack.d.ts +1 -7
- package/dist/default-css.d.ts +1 -0
- package/dist/default-css.js +8 -1
- package/dist/freeze.d.ts +2 -2
- package/dist/freeze.js +2 -2
- package/dist/index.d.ts +7 -4
- package/dist/index.js +7 -6
- package/dist/internals.d.ts +3 -1
- package/dist/internals.js +7 -4
- package/dist/interpolate-colors.d.ts +5 -0
- package/dist/interpolate-colors.js +401 -0
- package/dist/register-root.d.ts +1 -0
- package/dist/register-root.js +20 -5
- package/dist/series/index.d.ts +1 -1
- package/dist/series/index.js +2 -2
- package/dist/use-current-frame.d.ts +7 -0
- package/dist/use-current-frame.js +25 -0
- package/dist/use-media-in-timeline.js +2 -2
- package/dist/use-media-playback.js +3 -3
- package/dist/use-unsafe-video-config.js +2 -2
- package/dist/validation/validate-offthreadvideo-image-format.d.ts +1 -0
- package/dist/validation/validate-offthreadvideo-image-format.js +15 -0
- package/dist/video/OffthreadVideo.js +4 -2
- package/dist/video/OffthreadVideoForRendering.js +17 -9
- package/dist/video/Video.d.ts +2 -2
- package/dist/video/Video.js +2 -2
- package/dist/video/VideoForDevelopment.d.ts +1 -1
- package/dist/video/VideoForRendering.d.ts +1 -1
- package/dist/video/VideoForRendering.js +5 -5
- package/dist/video/index.d.ts +1 -1
- package/dist/video/props.d.ts +2 -0
- package/dist/wrap-remotion-context.d.ts +1 -1
- package/dist/wrap-remotion-context.js +3 -3
- package/package.json +2 -2
- package/.turbo/turbo-lint.log +0 -11
- package/.turbo/turbo-test.log +0 -63
package/dist/index.js
CHANGED
|
@@ -26,28 +26,29 @@ var input_props_1 = require("./config/input-props");
|
|
|
26
26
|
Object.defineProperty(exports, "getInputProps", { enumerable: true, get: function () { return input_props_1.getInputProps; } });
|
|
27
27
|
__exportStar(require("./delay-render"), exports);
|
|
28
28
|
__exportStar(require("./easing"), exports);
|
|
29
|
+
__exportStar(require("./Folder"), exports);
|
|
29
30
|
__exportStar(require("./freeze"), exports);
|
|
30
31
|
__exportStar(require("./IFrame"), exports);
|
|
31
32
|
__exportStar(require("./Img"), exports);
|
|
32
33
|
__exportStar(require("./internals"), exports);
|
|
33
34
|
__exportStar(require("./interpolate"), exports);
|
|
34
|
-
var
|
|
35
|
-
Object.defineProperty(exports, "interpolateColors", { enumerable: true, get: function () { return
|
|
35
|
+
var interpolate_colors_1 = require("./interpolate-colors");
|
|
36
|
+
Object.defineProperty(exports, "interpolateColors", { enumerable: true, get: function () { return interpolate_colors_1.interpolateColors; } });
|
|
36
37
|
var loop_1 = require("./loop");
|
|
37
38
|
Object.defineProperty(exports, "Loop", { enumerable: true, get: function () { return loop_1.Loop; } });
|
|
38
39
|
__exportStar(require("./random"), exports);
|
|
39
40
|
var register_root_1 = require("./register-root");
|
|
40
41
|
Object.defineProperty(exports, "registerRoot", { enumerable: true, get: function () { return register_root_1.registerRoot; } });
|
|
41
|
-
var
|
|
42
|
-
Object.defineProperty(exports, "Sequence", { enumerable: true, get: function () { return
|
|
42
|
+
var Sequence_1 = require("./Sequence");
|
|
43
|
+
Object.defineProperty(exports, "Sequence", { enumerable: true, get: function () { return Sequence_1.Sequence; } });
|
|
43
44
|
var series_1 = require("./series");
|
|
44
45
|
Object.defineProperty(exports, "Series", { enumerable: true, get: function () { return series_1.Series; } });
|
|
45
46
|
__exportStar(require("./spring"), exports);
|
|
46
47
|
var static_file_1 = require("./static-file");
|
|
47
48
|
Object.defineProperty(exports, "staticFile", { enumerable: true, get: function () { return static_file_1.staticFile; } });
|
|
48
49
|
__exportStar(require("./Still"), exports);
|
|
49
|
-
var
|
|
50
|
-
Object.defineProperty(exports, "useCurrentFrame", { enumerable: true, get: function () { return
|
|
50
|
+
var use_current_frame_1 = require("./use-current-frame");
|
|
51
|
+
Object.defineProperty(exports, "useCurrentFrame", { enumerable: true, get: function () { return use_current_frame_1.useCurrentFrame; } });
|
|
51
52
|
__exportStar(require("./use-video-config"), exports);
|
|
52
53
|
__exportStar(require("./video"), exports);
|
|
53
54
|
__exportStar(require("./video-config"), exports);
|
package/dist/internals.d.ts
CHANGED
|
@@ -88,7 +88,7 @@ export declare const Internals: {
|
|
|
88
88
|
truthy: typeof truthy;
|
|
89
89
|
isAudioCodec: (codec: "h264" | "h265" | "vp8" | "vp9" | "mp3" | "aac" | "wav" | "prores" | "h264-mkv" | undefined) => boolean;
|
|
90
90
|
Logging: typeof Logging;
|
|
91
|
-
SequenceContext: import("react").Context<import("./
|
|
91
|
+
SequenceContext: import("react").Context<import("./Sequence").SequenceContextType | null>;
|
|
92
92
|
useRemotionContexts: typeof useRemotionContexts;
|
|
93
93
|
RemotionContextProvider: (props: import("./wrap-remotion-context").RemotionContextProviderProps) => JSX.Element;
|
|
94
94
|
CSSUtils: typeof CSSUtils;
|
|
@@ -147,5 +147,7 @@ export declare const Internals: {
|
|
|
147
147
|
DELAY_RENDER_CALLSTACK_TOKEN: string;
|
|
148
148
|
useAbsoluteCurrentFrame: () => number;
|
|
149
149
|
portalNode: () => HTMLElement;
|
|
150
|
+
waitForRoot: (fn: (comp: import("react").FC<{}>) => void) => () => void;
|
|
151
|
+
validateOffthreadVideoImageFormat: (input: unknown) => void;
|
|
150
152
|
};
|
|
151
153
|
export type { TComposition, Timeline, TCompMetadata, TSequence, WebpackOverrideFn, TAsset, RenderAssetInfo, TimelineContextValue, SetTimelineContextValue, TimelineInOutContextValue, SetTimelineInOutContextValue, CompProps, CompositionManagerContext, MediaVolumeContextValue, SetMediaVolumeContextValue, RemotionEnvironment, ProResProfile, OpenGlRenderer, };
|
package/dist/internals.js
CHANGED
|
@@ -60,13 +60,13 @@ const perf = __importStar(require("./perf"));
|
|
|
60
60
|
const portal_node_1 = require("./portal-node");
|
|
61
61
|
const register_root_1 = require("./register-root");
|
|
62
62
|
const RemotionRoot_1 = require("./RemotionRoot");
|
|
63
|
-
const
|
|
63
|
+
const Sequence_1 = require("./Sequence");
|
|
64
64
|
const setup_env_variables_1 = require("./setup-env-variables");
|
|
65
65
|
const TimelineInOutPosition = __importStar(require("./timeline-inout-position-state"));
|
|
66
66
|
const TimelinePosition = __importStar(require("./timeline-position-state"));
|
|
67
67
|
const timeout_2 = require("./timeout");
|
|
68
68
|
const truthy_1 = require("./truthy");
|
|
69
|
-
const
|
|
69
|
+
const use_current_frame_1 = require("./use-current-frame");
|
|
70
70
|
const use_lazy_component_1 = require("./use-lazy-component");
|
|
71
71
|
const use_unsafe_video_config_1 = require("./use-unsafe-video-config");
|
|
72
72
|
const use_video_1 = require("./use-video");
|
|
@@ -76,6 +76,7 @@ const validate_duration_in_frames_1 = require("./validation/validate-duration-in
|
|
|
76
76
|
const validate_fps_1 = require("./validation/validate-fps");
|
|
77
77
|
const validate_frame_1 = require("./validation/validate-frame");
|
|
78
78
|
const validate_image_format_1 = require("./validation/validate-image-format");
|
|
79
|
+
const validate_offthreadvideo_image_format_1 = require("./validation/validate-offthreadvideo-image-format");
|
|
79
80
|
const validate_opengl_renderer_1 = require("./validation/validate-opengl-renderer");
|
|
80
81
|
const validate_quality_1 = require("./validation/validate-quality");
|
|
81
82
|
const volume_position_state_1 = require("./volume-position-state");
|
|
@@ -126,7 +127,7 @@ exports.Internals = {
|
|
|
126
127
|
truthy: truthy_1.truthy,
|
|
127
128
|
isAudioCodec: is_audio_codec_1.isAudioCodec,
|
|
128
129
|
Logging,
|
|
129
|
-
SequenceContext:
|
|
130
|
+
SequenceContext: Sequence_1.SequenceContext,
|
|
130
131
|
useRemotionContexts: wrap_remotion_context_1.useRemotionContexts,
|
|
131
132
|
RemotionContextProvider: wrap_remotion_context_1.RemotionContextProvider,
|
|
132
133
|
CSSUtils,
|
|
@@ -168,6 +169,8 @@ exports.Internals = {
|
|
|
168
169
|
getPreviewDomElement: get_preview_dom_element_1.getPreviewDomElement,
|
|
169
170
|
compositionsRef: CompositionManager_1.compositionsRef,
|
|
170
171
|
DELAY_RENDER_CALLSTACK_TOKEN: delay_render_1.DELAY_RENDER_CALLSTACK_TOKEN,
|
|
171
|
-
useAbsoluteCurrentFrame:
|
|
172
|
+
useAbsoluteCurrentFrame: use_current_frame_1.useAbsoluteCurrentFrame,
|
|
172
173
|
portalNode: portal_node_1.portalNode,
|
|
174
|
+
waitForRoot: register_root_1.waitForRoot,
|
|
175
|
+
validateOffthreadVideoImageFormat: validate_offthreadvideo_image_format_1.validateOffthreadVideoImageFormat,
|
|
173
176
|
};
|
|
@@ -0,0 +1,401 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
* Copied from:
|
|
4
|
+
* https://github.com/software-mansion/react-native-reanimated/blob/master/src/reanimated2/Colors.ts
|
|
5
|
+
*/
|
|
6
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
7
|
+
exports.interpolateColors = void 0;
|
|
8
|
+
/* eslint no-bitwise: 0 */
|
|
9
|
+
const interpolate_1 = require("./interpolate");
|
|
10
|
+
// var INTEGER = '[-+]?\\d+';
|
|
11
|
+
const NUMBER = '[-+]?\\d*\\.?\\d+';
|
|
12
|
+
const PERCENTAGE = NUMBER + '%';
|
|
13
|
+
function call(...args) {
|
|
14
|
+
return '\\(\\s*(' + args.join(')\\s*,\\s*(') + ')\\s*\\)';
|
|
15
|
+
}
|
|
16
|
+
function getMatchers() {
|
|
17
|
+
const cachedMatchers = {
|
|
18
|
+
rgb: undefined,
|
|
19
|
+
rgba: undefined,
|
|
20
|
+
hsl: undefined,
|
|
21
|
+
hsla: undefined,
|
|
22
|
+
hex3: undefined,
|
|
23
|
+
hex4: undefined,
|
|
24
|
+
hex5: undefined,
|
|
25
|
+
hex6: undefined,
|
|
26
|
+
hex8: undefined,
|
|
27
|
+
};
|
|
28
|
+
if (cachedMatchers.rgb === undefined) {
|
|
29
|
+
cachedMatchers.rgb = new RegExp('rgb' + call(NUMBER, NUMBER, NUMBER));
|
|
30
|
+
cachedMatchers.rgba = new RegExp('rgba' + call(NUMBER, NUMBER, NUMBER, NUMBER));
|
|
31
|
+
cachedMatchers.hsl = new RegExp('hsl' + call(NUMBER, PERCENTAGE, PERCENTAGE));
|
|
32
|
+
cachedMatchers.hsla = new RegExp('hsla' + call(NUMBER, PERCENTAGE, PERCENTAGE, NUMBER));
|
|
33
|
+
cachedMatchers.hex3 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
|
|
34
|
+
cachedMatchers.hex4 =
|
|
35
|
+
/^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
|
|
36
|
+
cachedMatchers.hex6 = /^#([0-9a-fA-F]{6})$/;
|
|
37
|
+
cachedMatchers.hex8 = /^#([0-9a-fA-F]{8})$/;
|
|
38
|
+
}
|
|
39
|
+
return cachedMatchers;
|
|
40
|
+
}
|
|
41
|
+
function hue2rgb(p, q, t) {
|
|
42
|
+
if (t < 0) {
|
|
43
|
+
t += 1;
|
|
44
|
+
}
|
|
45
|
+
if (t > 1) {
|
|
46
|
+
t -= 1;
|
|
47
|
+
}
|
|
48
|
+
if (t < 1 / 6) {
|
|
49
|
+
return p + (q - p) * 6 * t;
|
|
50
|
+
}
|
|
51
|
+
if (t < 1 / 2) {
|
|
52
|
+
return q;
|
|
53
|
+
}
|
|
54
|
+
if (t < 2 / 3) {
|
|
55
|
+
return p + (q - p) * (2 / 3 - t) * 6;
|
|
56
|
+
}
|
|
57
|
+
return p;
|
|
58
|
+
}
|
|
59
|
+
function hslToRgb(h, s, l) {
|
|
60
|
+
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
61
|
+
const p = 2 * l - q;
|
|
62
|
+
const r = hue2rgb(p, q, h + 1 / 3);
|
|
63
|
+
const g = hue2rgb(p, q, h);
|
|
64
|
+
const b = hue2rgb(p, q, h - 1 / 3);
|
|
65
|
+
return ((Math.round(r * 255) << 24) |
|
|
66
|
+
(Math.round(g * 255) << 16) |
|
|
67
|
+
(Math.round(b * 255) << 8));
|
|
68
|
+
}
|
|
69
|
+
function parse255(str) {
|
|
70
|
+
const int = Number.parseInt(str, 10);
|
|
71
|
+
if (int < 0) {
|
|
72
|
+
return 0;
|
|
73
|
+
}
|
|
74
|
+
if (int > 255) {
|
|
75
|
+
return 255;
|
|
76
|
+
}
|
|
77
|
+
return int;
|
|
78
|
+
}
|
|
79
|
+
function parse360(str) {
|
|
80
|
+
const int = Number.parseFloat(str);
|
|
81
|
+
return (((int % 360) + 360) % 360) / 360;
|
|
82
|
+
}
|
|
83
|
+
function parse1(str) {
|
|
84
|
+
const num = Number.parseFloat(str);
|
|
85
|
+
if (num < 0) {
|
|
86
|
+
return 0;
|
|
87
|
+
}
|
|
88
|
+
if (num > 1) {
|
|
89
|
+
return 255;
|
|
90
|
+
}
|
|
91
|
+
return Math.round(num * 255);
|
|
92
|
+
}
|
|
93
|
+
function parsePercentage(str) {
|
|
94
|
+
// parseFloat conveniently ignores the final %
|
|
95
|
+
const int = Number.parseFloat(str);
|
|
96
|
+
if (int < 0) {
|
|
97
|
+
return 0;
|
|
98
|
+
}
|
|
99
|
+
if (int > 100) {
|
|
100
|
+
return 1;
|
|
101
|
+
}
|
|
102
|
+
return int / 100;
|
|
103
|
+
}
|
|
104
|
+
const names = {
|
|
105
|
+
transparent: 0x00000000,
|
|
106
|
+
// http://www.w3.org/TR/css3-color/#svg-color
|
|
107
|
+
aliceblue: 0xf0f8ffff,
|
|
108
|
+
antiquewhite: 0xfaebd7ff,
|
|
109
|
+
aqua: 0x00ffffff,
|
|
110
|
+
aquamarine: 0x7fffd4ff,
|
|
111
|
+
azure: 0xf0ffffff,
|
|
112
|
+
beige: 0xf5f5dcff,
|
|
113
|
+
bisque: 0xffe4c4ff,
|
|
114
|
+
black: 0x000000ff,
|
|
115
|
+
blanchedalmond: 0xffebcdff,
|
|
116
|
+
blue: 0x0000ffff,
|
|
117
|
+
blueviolet: 0x8a2be2ff,
|
|
118
|
+
brown: 0xa52a2aff,
|
|
119
|
+
burlywood: 0xdeb887ff,
|
|
120
|
+
burntsienna: 0xea7e5dff,
|
|
121
|
+
cadetblue: 0x5f9ea0ff,
|
|
122
|
+
chartreuse: 0x7fff00ff,
|
|
123
|
+
chocolate: 0xd2691eff,
|
|
124
|
+
coral: 0xff7f50ff,
|
|
125
|
+
cornflowerblue: 0x6495edff,
|
|
126
|
+
cornsilk: 0xfff8dcff,
|
|
127
|
+
crimson: 0xdc143cff,
|
|
128
|
+
cyan: 0x00ffffff,
|
|
129
|
+
darkblue: 0x00008bff,
|
|
130
|
+
darkcyan: 0x008b8bff,
|
|
131
|
+
darkgoldenrod: 0xb8860bff,
|
|
132
|
+
darkgray: 0xa9a9a9ff,
|
|
133
|
+
darkgreen: 0x006400ff,
|
|
134
|
+
darkgrey: 0xa9a9a9ff,
|
|
135
|
+
darkkhaki: 0xbdb76bff,
|
|
136
|
+
darkmagenta: 0x8b008bff,
|
|
137
|
+
darkolivegreen: 0x556b2fff,
|
|
138
|
+
darkorange: 0xff8c00ff,
|
|
139
|
+
darkorchid: 0x9932ccff,
|
|
140
|
+
darkred: 0x8b0000ff,
|
|
141
|
+
darksalmon: 0xe9967aff,
|
|
142
|
+
darkseagreen: 0x8fbc8fff,
|
|
143
|
+
darkslateblue: 0x483d8bff,
|
|
144
|
+
darkslategray: 0x2f4f4fff,
|
|
145
|
+
darkslategrey: 0x2f4f4fff,
|
|
146
|
+
darkturquoise: 0x00ced1ff,
|
|
147
|
+
darkviolet: 0x9400d3ff,
|
|
148
|
+
deeppink: 0xff1493ff,
|
|
149
|
+
deepskyblue: 0x00bfffff,
|
|
150
|
+
dimgray: 0x696969ff,
|
|
151
|
+
dimgrey: 0x696969ff,
|
|
152
|
+
dodgerblue: 0x1e90ffff,
|
|
153
|
+
firebrick: 0xb22222ff,
|
|
154
|
+
floralwhite: 0xfffaf0ff,
|
|
155
|
+
forestgreen: 0x228b22ff,
|
|
156
|
+
fuchsia: 0xff00ffff,
|
|
157
|
+
gainsboro: 0xdcdcdcff,
|
|
158
|
+
ghostwhite: 0xf8f8ffff,
|
|
159
|
+
gold: 0xffd700ff,
|
|
160
|
+
goldenrod: 0xdaa520ff,
|
|
161
|
+
gray: 0x808080ff,
|
|
162
|
+
green: 0x008000ff,
|
|
163
|
+
greenyellow: 0xadff2fff,
|
|
164
|
+
grey: 0x808080ff,
|
|
165
|
+
honeydew: 0xf0fff0ff,
|
|
166
|
+
hotpink: 0xff69b4ff,
|
|
167
|
+
indianred: 0xcd5c5cff,
|
|
168
|
+
indigo: 0x4b0082ff,
|
|
169
|
+
ivory: 0xfffff0ff,
|
|
170
|
+
khaki: 0xf0e68cff,
|
|
171
|
+
lavender: 0xe6e6faff,
|
|
172
|
+
lavenderblush: 0xfff0f5ff,
|
|
173
|
+
lawngreen: 0x7cfc00ff,
|
|
174
|
+
lemonchiffon: 0xfffacdff,
|
|
175
|
+
lightblue: 0xadd8e6ff,
|
|
176
|
+
lightcoral: 0xf08080ff,
|
|
177
|
+
lightcyan: 0xe0ffffff,
|
|
178
|
+
lightgoldenrodyellow: 0xfafad2ff,
|
|
179
|
+
lightgray: 0xd3d3d3ff,
|
|
180
|
+
lightgreen: 0x90ee90ff,
|
|
181
|
+
lightgrey: 0xd3d3d3ff,
|
|
182
|
+
lightpink: 0xffb6c1ff,
|
|
183
|
+
lightsalmon: 0xffa07aff,
|
|
184
|
+
lightseagreen: 0x20b2aaff,
|
|
185
|
+
lightskyblue: 0x87cefaff,
|
|
186
|
+
lightslategray: 0x778899ff,
|
|
187
|
+
lightslategrey: 0x778899ff,
|
|
188
|
+
lightsteelblue: 0xb0c4deff,
|
|
189
|
+
lightyellow: 0xffffe0ff,
|
|
190
|
+
lime: 0x00ff00ff,
|
|
191
|
+
limegreen: 0x32cd32ff,
|
|
192
|
+
linen: 0xfaf0e6ff,
|
|
193
|
+
magenta: 0xff00ffff,
|
|
194
|
+
maroon: 0x800000ff,
|
|
195
|
+
mediumaquamarine: 0x66cdaaff,
|
|
196
|
+
mediumblue: 0x0000cdff,
|
|
197
|
+
mediumorchid: 0xba55d3ff,
|
|
198
|
+
mediumpurple: 0x9370dbff,
|
|
199
|
+
mediumseagreen: 0x3cb371ff,
|
|
200
|
+
mediumslateblue: 0x7b68eeff,
|
|
201
|
+
mediumspringgreen: 0x00fa9aff,
|
|
202
|
+
mediumturquoise: 0x48d1ccff,
|
|
203
|
+
mediumvioletred: 0xc71585ff,
|
|
204
|
+
midnightblue: 0x191970ff,
|
|
205
|
+
mintcream: 0xf5fffaff,
|
|
206
|
+
mistyrose: 0xffe4e1ff,
|
|
207
|
+
moccasin: 0xffe4b5ff,
|
|
208
|
+
navajowhite: 0xffdeadff,
|
|
209
|
+
navy: 0x000080ff,
|
|
210
|
+
oldlace: 0xfdf5e6ff,
|
|
211
|
+
olive: 0x808000ff,
|
|
212
|
+
olivedrab: 0x6b8e23ff,
|
|
213
|
+
orange: 0xffa500ff,
|
|
214
|
+
orangered: 0xff4500ff,
|
|
215
|
+
orchid: 0xda70d6ff,
|
|
216
|
+
palegoldenrod: 0xeee8aaff,
|
|
217
|
+
palegreen: 0x98fb98ff,
|
|
218
|
+
paleturquoise: 0xafeeeeff,
|
|
219
|
+
palevioletred: 0xdb7093ff,
|
|
220
|
+
papayawhip: 0xffefd5ff,
|
|
221
|
+
peachpuff: 0xffdab9ff,
|
|
222
|
+
peru: 0xcd853fff,
|
|
223
|
+
pink: 0xffc0cbff,
|
|
224
|
+
plum: 0xdda0ddff,
|
|
225
|
+
powderblue: 0xb0e0e6ff,
|
|
226
|
+
purple: 0x800080ff,
|
|
227
|
+
rebeccapurple: 0x663399ff,
|
|
228
|
+
red: 0xff0000ff,
|
|
229
|
+
rosybrown: 0xbc8f8fff,
|
|
230
|
+
royalblue: 0x4169e1ff,
|
|
231
|
+
saddlebrown: 0x8b4513ff,
|
|
232
|
+
salmon: 0xfa8072ff,
|
|
233
|
+
sandybrown: 0xf4a460ff,
|
|
234
|
+
seagreen: 0x2e8b57ff,
|
|
235
|
+
seashell: 0xfff5eeff,
|
|
236
|
+
sienna: 0xa0522dff,
|
|
237
|
+
silver: 0xc0c0c0ff,
|
|
238
|
+
skyblue: 0x87ceebff,
|
|
239
|
+
slateblue: 0x6a5acdff,
|
|
240
|
+
slategray: 0x708090ff,
|
|
241
|
+
slategrey: 0x708090ff,
|
|
242
|
+
snow: 0xfffafaff,
|
|
243
|
+
springgreen: 0x00ff7fff,
|
|
244
|
+
steelblue: 0x4682b4ff,
|
|
245
|
+
tan: 0xd2b48cff,
|
|
246
|
+
teal: 0x008080ff,
|
|
247
|
+
thistle: 0xd8bfd8ff,
|
|
248
|
+
tomato: 0xff6347ff,
|
|
249
|
+
turquoise: 0x40e0d0ff,
|
|
250
|
+
violet: 0xee82eeff,
|
|
251
|
+
wheat: 0xf5deb3ff,
|
|
252
|
+
white: 0xffffffff,
|
|
253
|
+
whitesmoke: 0xf5f5f5ff,
|
|
254
|
+
yellow: 0xffff00ff,
|
|
255
|
+
yellowgreen: 0x9acd32ff,
|
|
256
|
+
};
|
|
257
|
+
function normalizeColor(color) {
|
|
258
|
+
const matchers = getMatchers();
|
|
259
|
+
let match;
|
|
260
|
+
// Ordered based on occurrences on Facebook codebase
|
|
261
|
+
if (matchers.hex6) {
|
|
262
|
+
if ((match = matchers.hex6.exec(color))) {
|
|
263
|
+
return Number.parseInt(match[1] + 'ff', 16) >>> 0;
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
if (names[color] !== undefined) {
|
|
267
|
+
return names[color];
|
|
268
|
+
}
|
|
269
|
+
if (matchers.rgb) {
|
|
270
|
+
if ((match = matchers.rgb.exec(color))) {
|
|
271
|
+
return (
|
|
272
|
+
// b
|
|
273
|
+
((parse255(match[1]) << 24) | // r
|
|
274
|
+
(parse255(match[2]) << 16) | // g
|
|
275
|
+
(parse255(match[3]) << 8) |
|
|
276
|
+
0x000000ff) >>> // a
|
|
277
|
+
0);
|
|
278
|
+
}
|
|
279
|
+
}
|
|
280
|
+
if (matchers.rgba) {
|
|
281
|
+
if ((match = matchers.rgba.exec(color))) {
|
|
282
|
+
return (
|
|
283
|
+
// b
|
|
284
|
+
((parse255(match[1]) << 24) | // r
|
|
285
|
+
(parse255(match[2]) << 16) | // g
|
|
286
|
+
(parse255(match[3]) << 8) |
|
|
287
|
+
parse1(match[4])) >>> // a
|
|
288
|
+
0);
|
|
289
|
+
}
|
|
290
|
+
}
|
|
291
|
+
if (matchers.hex3) {
|
|
292
|
+
if ((match = matchers.hex3.exec(color))) {
|
|
293
|
+
return (Number.parseInt(match[1] +
|
|
294
|
+
match[1] + // r
|
|
295
|
+
match[2] +
|
|
296
|
+
match[2] + // g
|
|
297
|
+
match[3] +
|
|
298
|
+
match[3] + // b
|
|
299
|
+
'ff', // a
|
|
300
|
+
16) >>> 0);
|
|
301
|
+
}
|
|
302
|
+
}
|
|
303
|
+
// https://drafts.csswg.org/css-color-4/#hex-notation
|
|
304
|
+
if (matchers.hex8) {
|
|
305
|
+
if ((match = matchers.hex8.exec(color))) {
|
|
306
|
+
return Number.parseInt(match[1], 16) >>> 0;
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
if (matchers.hex4) {
|
|
310
|
+
if ((match = matchers.hex4.exec(color))) {
|
|
311
|
+
return (Number.parseInt(match[1] +
|
|
312
|
+
match[1] + // r
|
|
313
|
+
match[2] +
|
|
314
|
+
match[2] + // g
|
|
315
|
+
match[3] +
|
|
316
|
+
match[3] + // b
|
|
317
|
+
match[4] +
|
|
318
|
+
match[4], // a
|
|
319
|
+
16) >>> 0);
|
|
320
|
+
}
|
|
321
|
+
}
|
|
322
|
+
if (matchers.hsl) {
|
|
323
|
+
if ((match = matchers.hsl.exec(color))) {
|
|
324
|
+
return ((hslToRgb(parse360(match[1]), // h
|
|
325
|
+
parsePercentage(match[2]), // s
|
|
326
|
+
parsePercentage(match[3]) // l
|
|
327
|
+
) |
|
|
328
|
+
0x000000ff) >>> // a
|
|
329
|
+
0);
|
|
330
|
+
}
|
|
331
|
+
}
|
|
332
|
+
if (matchers.hsla) {
|
|
333
|
+
if ((match = matchers.hsla.exec(color))) {
|
|
334
|
+
return ((hslToRgb(parse360(match[1]), // h
|
|
335
|
+
parsePercentage(match[2]), // s
|
|
336
|
+
parsePercentage(match[3]) // l
|
|
337
|
+
) |
|
|
338
|
+
parse1(match[4])) >>> // a
|
|
339
|
+
0);
|
|
340
|
+
}
|
|
341
|
+
}
|
|
342
|
+
throw new Error(`invalid color string ${color} provided`);
|
|
343
|
+
}
|
|
344
|
+
const opacity = (c) => {
|
|
345
|
+
return ((c >> 24) & 255) / 255;
|
|
346
|
+
};
|
|
347
|
+
const red = (c) => {
|
|
348
|
+
return (c >> 16) & 255;
|
|
349
|
+
};
|
|
350
|
+
const green = (c) => {
|
|
351
|
+
return (c >> 8) & 255;
|
|
352
|
+
};
|
|
353
|
+
const blue = (c) => {
|
|
354
|
+
return c & 255;
|
|
355
|
+
};
|
|
356
|
+
const rgbaColor = (r, g, b, alpha) => {
|
|
357
|
+
return `rgba(${r}, ${g}, ${b}, ${alpha})`;
|
|
358
|
+
};
|
|
359
|
+
function processColorInitially(color) {
|
|
360
|
+
let normalizedColor = normalizeColor(color);
|
|
361
|
+
normalizedColor = ((normalizedColor << 24) | (normalizedColor >>> 8)) >>> 0; // argb
|
|
362
|
+
return normalizedColor;
|
|
363
|
+
}
|
|
364
|
+
function processColor(color) {
|
|
365
|
+
const normalizedColor = processColorInitially(color);
|
|
366
|
+
return normalizedColor;
|
|
367
|
+
}
|
|
368
|
+
const interpolateColorsRGB = (value, inputRange, colors) => {
|
|
369
|
+
const [r, g, b, a] = [red, green, blue, opacity].map((f) => {
|
|
370
|
+
const unrounded = (0, interpolate_1.interpolate)(value, inputRange, colors.map((c) => f(c)), {
|
|
371
|
+
extrapolateLeft: 'clamp',
|
|
372
|
+
extrapolateRight: 'clamp',
|
|
373
|
+
});
|
|
374
|
+
if (f === opacity) {
|
|
375
|
+
return Number(unrounded.toFixed(3));
|
|
376
|
+
}
|
|
377
|
+
return Math.round(unrounded);
|
|
378
|
+
});
|
|
379
|
+
return rgbaColor(r, g, b, a);
|
|
380
|
+
};
|
|
381
|
+
const interpolateColors = (input, inputRange, outputRange) => {
|
|
382
|
+
if (typeof input === 'undefined') {
|
|
383
|
+
throw new TypeError('input can not be undefined');
|
|
384
|
+
}
|
|
385
|
+
if (typeof inputRange === 'undefined') {
|
|
386
|
+
throw new TypeError('inputRange can not be undefined');
|
|
387
|
+
}
|
|
388
|
+
if (typeof outputRange === 'undefined') {
|
|
389
|
+
throw new TypeError('outputRange can not be undefined');
|
|
390
|
+
}
|
|
391
|
+
if (inputRange.length !== outputRange.length) {
|
|
392
|
+
throw new TypeError('inputRange (' +
|
|
393
|
+
inputRange.length +
|
|
394
|
+
' values provided) and outputRange (' +
|
|
395
|
+
outputRange.length +
|
|
396
|
+
' values provided) must have the same length');
|
|
397
|
+
}
|
|
398
|
+
const processedOutputRange = outputRange.map((c) => processColor(c));
|
|
399
|
+
return interpolateColorsRGB(input, inputRange, processedOutputRange);
|
|
400
|
+
};
|
|
401
|
+
exports.interpolateColors = interpolateColors;
|
package/dist/register-root.d.ts
CHANGED
package/dist/register-root.js
CHANGED
|
@@ -1,15 +1,30 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.getRoot = exports.registerRoot = void 0;
|
|
4
|
-
let
|
|
3
|
+
exports.waitForRoot = exports.getRoot = exports.registerRoot = void 0;
|
|
4
|
+
let Root = null;
|
|
5
|
+
let listeners = [];
|
|
5
6
|
const registerRoot = (comp) => {
|
|
6
|
-
if (
|
|
7
|
+
if (Root) {
|
|
7
8
|
throw new Error('registerRoot() was called more than once.');
|
|
8
9
|
}
|
|
9
|
-
|
|
10
|
+
Root = comp;
|
|
11
|
+
listeners.forEach((l) => {
|
|
12
|
+
l(comp);
|
|
13
|
+
});
|
|
10
14
|
};
|
|
11
15
|
exports.registerRoot = registerRoot;
|
|
12
16
|
const getRoot = () => {
|
|
13
|
-
return
|
|
17
|
+
return Root;
|
|
14
18
|
};
|
|
15
19
|
exports.getRoot = getRoot;
|
|
20
|
+
const waitForRoot = (fn) => {
|
|
21
|
+
if (Root) {
|
|
22
|
+
fn(Root);
|
|
23
|
+
return () => undefined;
|
|
24
|
+
}
|
|
25
|
+
listeners.push(fn);
|
|
26
|
+
return () => {
|
|
27
|
+
listeners = listeners.filter((l) => l !== fn);
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
exports.waitForRoot = waitForRoot;
|
package/dist/series/index.d.ts
CHANGED
package/dist/series/index.js
CHANGED
|
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.Series = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
|
-
const
|
|
6
|
+
const Sequence_1 = require("../Sequence");
|
|
7
7
|
const validate_duration_in_frames_1 = require("../validation/validate-duration-in-frames");
|
|
8
8
|
const flatten_children_1 = require("./flatten-children");
|
|
9
9
|
const SeriesSequence = ({ children }) => {
|
|
@@ -45,7 +45,7 @@ const Series = ({ children }) => {
|
|
|
45
45
|
}
|
|
46
46
|
const currentStartFrame = startFrame + offset;
|
|
47
47
|
startFrame += durationInFramesProp + offset;
|
|
48
|
-
return ((0, jsx_runtime_1.jsx)(
|
|
48
|
+
return ((0, jsx_runtime_1.jsx)(Sequence_1.Sequence, { from: currentStartFrame, durationInFrames: durationInFramesProp, ...passedProps, children: child }));
|
|
49
49
|
});
|
|
50
50
|
}, [children]);
|
|
51
51
|
/* eslint-disable react/jsx-no-useless-fragment */
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const useAbsoluteCurrentFrame: () => number;
|
|
2
|
+
/**
|
|
3
|
+
* Get the current frame of the video.
|
|
4
|
+
* Frames are 0-indexed, meaning the first frame is 0, the last frame is the duration of the composition in frames minus one.
|
|
5
|
+
* @link https://www.remotion.dev/docs/use-current-frame
|
|
6
|
+
*/
|
|
7
|
+
export declare const useCurrentFrame: () => number;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useCurrentFrame = exports.useAbsoluteCurrentFrame = void 0;
|
|
4
|
+
const react_1 = require("react");
|
|
5
|
+
const Sequence_1 = require("./Sequence");
|
|
6
|
+
const timeline_position_state_1 = require("./timeline-position-state");
|
|
7
|
+
const useAbsoluteCurrentFrame = () => {
|
|
8
|
+
const timelinePosition = (0, timeline_position_state_1.useTimelinePosition)();
|
|
9
|
+
return timelinePosition;
|
|
10
|
+
};
|
|
11
|
+
exports.useAbsoluteCurrentFrame = useAbsoluteCurrentFrame;
|
|
12
|
+
/**
|
|
13
|
+
* Get the current frame of the video.
|
|
14
|
+
* Frames are 0-indexed, meaning the first frame is 0, the last frame is the duration of the composition in frames minus one.
|
|
15
|
+
* @link https://www.remotion.dev/docs/use-current-frame
|
|
16
|
+
*/
|
|
17
|
+
const useCurrentFrame = () => {
|
|
18
|
+
const frame = (0, exports.useAbsoluteCurrentFrame)();
|
|
19
|
+
const context = (0, react_1.useContext)(Sequence_1.SequenceContext);
|
|
20
|
+
const contextOffset = context
|
|
21
|
+
? context.cumulatedFrom + context.relativeFrom
|
|
22
|
+
: 0;
|
|
23
|
+
return frame - contextOffset;
|
|
24
|
+
};
|
|
25
|
+
exports.useCurrentFrame = useCurrentFrame;
|
|
@@ -7,7 +7,7 @@ const CompositionManager_1 = require("./CompositionManager");
|
|
|
7
7
|
const get_asset_file_name_1 = require("./get-asset-file-name");
|
|
8
8
|
const nonce_1 = require("./nonce");
|
|
9
9
|
const play_and_handle_not_allowed_error_1 = require("./play-and-handle-not-allowed-error");
|
|
10
|
-
const
|
|
10
|
+
const Sequence_1 = require("./Sequence");
|
|
11
11
|
const timeline_position_state_1 = require("./timeline-position-state");
|
|
12
12
|
const use_video_config_1 = require("./use-video-config");
|
|
13
13
|
const volume_prop_1 = require("./volume-prop");
|
|
@@ -22,7 +22,7 @@ const warnOnce = (message) => {
|
|
|
22
22
|
const useMediaInTimeline = ({ volume, mediaVolume, mediaRef, src, mediaType, }) => {
|
|
23
23
|
const videoConfig = (0, use_video_config_1.useVideoConfig)();
|
|
24
24
|
const { rootId, audioAndVideoTags } = (0, react_1.useContext)(timeline_position_state_1.TimelineContext);
|
|
25
|
-
const parentSequence = (0, react_1.useContext)(
|
|
25
|
+
const parentSequence = (0, react_1.useContext)(Sequence_1.SequenceContext);
|
|
26
26
|
const actualFrom = parentSequence
|
|
27
27
|
? parentSequence.relativeFrom + parentSequence.cumulatedFrom
|
|
28
28
|
: 0;
|
|
@@ -5,14 +5,14 @@ const react_1 = require("react");
|
|
|
5
5
|
const use_audio_frame_1 = require("./audio/use-audio-frame");
|
|
6
6
|
const play_and_handle_not_allowed_error_1 = require("./play-and-handle-not-allowed-error");
|
|
7
7
|
const timeline_position_state_1 = require("./timeline-position-state");
|
|
8
|
-
const
|
|
8
|
+
const use_current_frame_1 = require("./use-current-frame");
|
|
9
9
|
const use_video_config_1 = require("./use-video-config");
|
|
10
10
|
const get_current_time_1 = require("./video/get-current-time");
|
|
11
11
|
const warn_about_non_seekable_media_1 = require("./warn-about-non-seekable-media");
|
|
12
12
|
const useMediaPlayback = ({ mediaRef, src, mediaType, playbackRate: localPlaybackRate, }) => {
|
|
13
13
|
const { playbackRate: globalPlaybackRate } = (0, react_1.useContext)(timeline_position_state_1.TimelineContext);
|
|
14
|
-
const frame = (0,
|
|
15
|
-
const absoluteFrame = (0,
|
|
14
|
+
const frame = (0, use_current_frame_1.useCurrentFrame)();
|
|
15
|
+
const absoluteFrame = (0, use_current_frame_1.useAbsoluteCurrentFrame)();
|
|
16
16
|
const [playing] = (0, timeline_position_state_1.usePlayingState)();
|
|
17
17
|
const { fps } = (0, use_video_config_1.useVideoConfig)();
|
|
18
18
|
const mediaStartsAt = (0, use_audio_frame_1.useMediaStartsAt)();
|
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useUnsafeVideoConfig = void 0;
|
|
4
4
|
const react_1 = require("react");
|
|
5
|
-
const
|
|
5
|
+
const Sequence_1 = require("./Sequence");
|
|
6
6
|
const use_video_1 = require("./use-video");
|
|
7
7
|
const useUnsafeVideoConfig = () => {
|
|
8
8
|
var _a;
|
|
9
|
-
const context = (0, react_1.useContext)(
|
|
9
|
+
const context = (0, react_1.useContext)(Sequence_1.SequenceContext);
|
|
10
10
|
const ctxDuration = (_a = context === null || context === void 0 ? void 0 : context.durationInFrames) !== null && _a !== void 0 ? _a : null;
|
|
11
11
|
const video = (0, use_video_1.useVideo)();
|
|
12
12
|
return (0, react_1.useMemo)(() => {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const validateOffthreadVideoImageFormat: (input: unknown) => void;
|