remotion 3.3.88 → 3.3.89

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 (14) hide show
  1. package/dist/cjs/EditorProps.d.ts +15 -0
  2. package/dist/cjs/EditorProps.js +53 -0
  3. package/dist/cjs/audio/AudioForDevelopment.js +10 -3
  4. package/dist/cjs/props-if-has-props.d.ts +10 -0
  5. package/dist/cjs/props-if-has-props.js +2 -0
  6. package/dist/cjs/version.d.ts +1 -1
  7. package/dist/cjs/version.js +1 -1
  8. package/dist/cjs/video/VideoForDevelopment.js +6 -2
  9. package/dist/cjs/video/VideoForRendering.js +6 -1
  10. package/dist/cjs/z-color.d.ts +9 -0
  11. package/dist/cjs/z-color.js +28 -0
  12. package/dist/esm/index.mjs +23 -7
  13. package/dist/esm/version.mjs +1 -1
  14. package/package.json +1 -1
package/dist/cjs/EditorProps.d.ts ADDED
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ declare type Props = Record<string, object>;
3
+ export declare type EditorPropsContextType = {
4
+ props: Props;
5
+ updateProps: (options: {
6
+ id: string;
7
+ defaultProps: object;
8
+ newProps: object;
9
+ }) => void;
10
+ };
11
+ export declare const EditorPropsContext: React.Context<EditorPropsContextType>;
12
+ export declare const EditorPropsProvider: React.FC<{
13
+ children: React.ReactNode;
14
+ }>;
15
+ export {};
package/dist/cjs/EditorProps.js ADDED
@@ -0,0 +1,53 @@
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.EditorPropsProvider = exports.EditorPropsContext = void 0;
27
+ const jsx_runtime_1 = require("react/jsx-runtime");
28
+ const react_1 = __importStar(require("react"));
29
+ exports.EditorPropsContext = (0, react_1.createContext)({
30
+ props: {},
31
+ updateProps: () => {
32
+ throw new Error('Not implemented');
33
+ },
34
+ });
35
+ const EditorPropsProvider = ({ children }) => {
36
+ const [props, setProps] = react_1.default.useState({});
37
+ const updateProps = (0, react_1.useCallback)(({ defaultProps, id, newProps, }) => {
38
+ setProps((prev) => {
39
+ var _a;
40
+ return {
41
+ ...prev,
42
+ [id]: typeof newProps === 'function'
43
+ ? newProps((_a = prev[id]) !== null && _a !== void 0 ? _a : defaultProps)
44
+ : newProps,
45
+ };
46
+ });
47
+ }, []);
48
+ const ctx = (0, react_1.useMemo)(() => {
49
+ return { props, updateProps };
50
+ }, [props, updateProps]);
51
+ return ((0, jsx_runtime_1.jsx)(exports.EditorPropsContext.Provider, { value: ctx, children: children }));
52
+ };
53
+ exports.EditorPropsProvider = EditorPropsProvider;
package/dist/cjs/audio/AudioForDevelopment.js CHANGED
@@ -36,7 +36,14 @@ const AudioForDevelopmentForwardRefFunction = (props, ref) => {
36
36
  const sequenceContext = (0, react_1.useContext)(SequenceContext_js_1.SequenceContext);
37
37
  // Generate a string that's as unique as possible for this asset
38
38
  // but at the same time deterministic. We use it to combat strict mode issues.
39
- const id = (0, react_1.useMemo)(() => `audio-${(0, random_js_1.random)(src !== null && src !== void 0 ? src : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}-muted:${props.muted}`, [props.muted, src, sequenceContext]);
39
+ const id = (0, react_1.useMemo)(() => `audio-${(0, random_js_1.random)(src !== null && src !== void 0 ? src : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}-muted:${props.muted}-loop:${props.loop}`, [
40
+ src,
41
+ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,
42
+ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom,
43
+ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames,
44
+ props.muted,
45
+ props.loop,
46
+ ]);
40
47
  const audioRef = (0, shared_audio_tags_js_1.useSharedAudio)(propsToPass, id).el;
41
48
  const actualVolume = (0, use_media_tag_volume_js_1.useMediaTagVolume)(audioRef);
42
49
  (0, use_sync_volume_with_media_tag_js_1.useSyncVolumeWithMediaTag)({
@@ -74,12 +81,12 @@ const AudioForDevelopmentForwardRefFunction = (props, ref) => {
74
81
  return;
75
82
  }
76
83
  if (current.duration) {
77
- (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, src, current.duration);
84
+ (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, current.src, current.duration);
78
85
  return;
79
86
  }
80
87
  const onLoadedMetadata = () => {
81
88
  var _a;
82
- (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, src, current.duration);
89
+ (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, current.src, current.duration);
83
90
  };
84
91
  current.addEventListener('loadedmetadata', onLoadedMetadata);
85
92
  return () => {
package/dist/cjs/props-if-has-props.d.ts ADDED
@@ -0,0 +1,10 @@
1
+ import type { z } from 'zod';
2
+ export declare type PropsIfHasProps<Schema extends z.ZodTypeAny, Props> = z.ZodTypeAny extends Schema ? {} extends Props ? {
3
+ defaultProps?: Props;
4
+ } : {
5
+ defaultProps: Props;
6
+ } : {} extends Props ? {
7
+ defaultProps: z.infer<Schema>;
8
+ } : {
9
+ defaultProps: z.infer<Schema> & Props;
10
+ };
package/dist/cjs/props-if-has-props.js ADDED
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
package/dist/cjs/version.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const VERSION = "3.3.88";
1
+ export declare const VERSION = "3.3.89";
package/dist/cjs/version.js CHANGED
@@ -2,4 +2,4 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.VERSION = void 0;
4
4
  // Automatically generated on publish
5
- exports.VERSION = '3.3.88';
5
+ exports.VERSION = '3.3.89';
package/dist/cjs/video/VideoForDevelopment.js CHANGED
@@ -75,7 +75,11 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
75
75
  var _a;
76
76
  if (current === null || current === void 0 ? void 0 : current.error) {
77
77
  console.error('Error occurred in video', current === null || current === void 0 ? void 0 : current.error);
78
- throw new Error(`The browser threw an error while playing the video ${src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help`);
78
+ // If user is handling the error, we don't cause an unhandled exception
79
+ if (props.onError) {
80
+ return;
81
+ }
82
+ throw new Error(`The browser threw an error while playing the video ${src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help. Pass an onError() prop to handle the error.`);
79
83
  }
80
84
  else {
81
85
  throw new Error('The browser threw an error');
@@ -85,7 +89,7 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
85
89
  return () => {
86
90
  current.removeEventListener('error', errorHandler);
87
91
  };
88
- }, [src]);
92
+ }, [props.onError, src]);
89
93
  const currentOnDurationCallback = (0, react_1.useRef)();
90
94
  currentOnDurationCallback.current = onDuration;
91
95
  (0, react_1.useEffect)(() => {
package/dist/cjs/video/VideoForRendering.js CHANGED
@@ -146,7 +146,11 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
146
146
  var _a;
147
147
  if (current === null || current === void 0 ? void 0 : current.error) {
148
148
  console.error('Error occurred in video', current === null || current === void 0 ? void 0 : current.error);
149
- throw new Error(`The browser threw an error while playing the video ${props.src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help`);
149
+ // If user is handling the error, we don't cause an unhandled exception
150
+ if (onError) {
151
+ return;
152
+ }
153
+ throw new Error(`The browser threw an error while playing the video ${props.src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help. Pass an onError() prop to handle the error.`);
150
154
  }
151
155
  else {
152
156
  throw new Error('The browser threw an error');
@@ -167,6 +171,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
167
171
  videoConfig.fps,
168
172
  frame,
169
173
  mediaStartsAt,
174
+ onError,
170
175
  ]);
171
176
  const { src } = props;
172
177
  // If video source switches, make new handle
package/dist/cjs/z-color.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import { z } from 'zod';
2
+ export declare const REMOTION_COLOR_BRAND = "__remotion-color";
3
+ export declare const parseColor: (value: string) => {
4
+ a: number;
5
+ r: number;
6
+ g: number;
7
+ b: number;
8
+ };
9
+ export declare const zColor: () => z.ZodEffects<z.ZodString, string, string>;
package/dist/cjs/z-color.js ADDED
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.zColor = exports.parseColor = exports.REMOTION_COLOR_BRAND = void 0;
4
+ const zod_1 = require("zod");
5
+ const interpolate_colors_js_1 = require("./interpolate-colors.js");
6
+ exports.REMOTION_COLOR_BRAND = '__remotion-color';
7
+ const parseColor = (value) => {
8
+ const colored = (0, interpolate_colors_js_1.processColor)(value).toString(16).padStart(8, '0');
9
+ const opacity = parseInt(colored.slice(0, 2), 16);
10
+ const r = parseInt(colored.slice(2, 4), 16);
11
+ const g = parseInt(colored.slice(4, 6), 16);
12
+ const b = parseInt(colored.slice(6, 8), 16);
13
+ return { a: opacity, r, g, b };
14
+ };
15
+ exports.parseColor = parseColor;
16
+ const zColor = () => zod_1.z
17
+ .string()
18
+ .refine((value) => {
19
+ try {
20
+ (0, exports.parseColor)(value);
21
+ return true;
22
+ }
23
+ catch (err) {
24
+ return false;
25
+ }
26
+ }, { message: 'Invalid color' })
27
+ .describe(exports.REMOTION_COLOR_BRAND);
28
+ exports.zColor = zColor;
package/dist/esm/index.mjs CHANGED
@@ -58,7 +58,7 @@ function truthy(value) {
58
58
  }
59
59
 
60
60
  // Automatically generated on publish
61
- const VERSION = '3.3.88';
61
+ const VERSION = '3.3.89';
62
62
 
63
63
  const checkMultipleRemotionVersions = () => {
64
64
  if (typeof globalThis === 'undefined') {
@@ -1626,7 +1626,14 @@ const AudioForDevelopmentForwardRefFunction = (props, ref) => {
1626
1626
  const sequenceContext = useContext(SequenceContext);
1627
1627
  // Generate a string that's as unique as possible for this asset
1628
1628
  // but at the same time deterministic. We use it to combat strict mode issues.
1629
- const id = useMemo(() => `audio-${random(src !== null && src !== void 0 ? src : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}-muted:${props.muted}`, [props.muted, src, sequenceContext]);
1629
+ const id = useMemo(() => `audio-${random(src !== null && src !== void 0 ? src : '')}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom}-${sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames}-muted:${props.muted}-loop:${props.loop}`, [
1630
+ src,
1631
+ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.relativeFrom,
1632
+ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.cumulatedFrom,
1633
+ sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.durationInFrames,
1634
+ props.muted,
1635
+ props.loop,
1636
+ ]);
1630
1637
  const audioRef = useSharedAudio(propsToPass, id).el;
1631
1638
  const actualVolume = useMediaTagVolume(audioRef);
1632
1639
  useSyncVolumeWithMediaTag({
@@ -1664,12 +1671,12 @@ const AudioForDevelopmentForwardRefFunction = (props, ref) => {
1664
1671
  return;
1665
1672
  }
1666
1673
  if (current.duration) {
1667
- (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, src, current.duration);
1674
+ (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, current.src, current.duration);
1668
1675
  return;
1669
1676
  }
1670
1677
  const onLoadedMetadata = () => {
1671
1678
  var _a;
1672
- (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, src, current.duration);
1679
+ (_a = currentOnDurationCallback.current) === null || _a === void 0 ? void 0 : _a.call(currentOnDurationCallback, current.src, current.duration);
1673
1680
  };
1674
1681
  current.addEventListener('loadedmetadata', onLoadedMetadata);
1675
1682
  return () => {
@@ -3850,7 +3857,11 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
3850
3857
  var _a;
3851
3858
  if (current === null || current === void 0 ? void 0 : current.error) {
3852
3859
  console.error('Error occurred in video', current === null || current === void 0 ? void 0 : current.error);
3853
- throw new Error(`The browser threw an error while playing the video ${src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help`);
3860
+ // If user is handling the error, we don't cause an unhandled exception
3861
+ if (props.onError) {
3862
+ return;
3863
+ }
3864
+ throw new Error(`The browser threw an error while playing the video ${src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help. Pass an onError() prop to handle the error.`);
3854
3865
  }
3855
3866
  else {
3856
3867
  throw new Error('The browser threw an error');
@@ -3860,7 +3871,7 @@ const VideoForDevelopmentRefForwardingFunction = (props, ref) => {
3860
3871
  return () => {
3861
3872
  current.removeEventListener('error', errorHandler);
3862
3873
  };
3863
- }, [src]);
3874
+ }, [props.onError, src]);
3864
3875
  const currentOnDurationCallback = useRef();
3865
3876
  currentOnDurationCallback.current = onDuration;
3866
3877
  useEffect(() => {
@@ -4041,7 +4052,11 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
4041
4052
  var _a;
4042
4053
  if (current === null || current === void 0 ? void 0 : current.error) {
4043
4054
  console.error('Error occurred in video', current === null || current === void 0 ? void 0 : current.error);
4044
- throw new Error(`The browser threw an error while playing the video ${props.src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help`);
4055
+ // If user is handling the error, we don't cause an unhandled exception
4056
+ if (onError) {
4057
+ return;
4058
+ }
4059
+ throw new Error(`The browser threw an error while playing the video ${props.src}: Code ${current.error.code} - ${(_a = current === null || current === void 0 ? void 0 : current.error) === null || _a === void 0 ? void 0 : _a.message}. See https://remotion.dev/docs/media-playback-error for help. Pass an onError() prop to handle the error.`);
4045
4060
  }
4046
4061
  else {
4047
4062
  throw new Error('The browser threw an error');
@@ -4062,6 +4077,7 @@ const VideoForRenderingForwardFunction = ({ onError, volume: volumeProp, allowAm
4062
4077
  videoConfig.fps,
4063
4078
  frame,
4064
4079
  mediaStartsAt,
4080
+ onError,
4065
4081
  ]);
4066
4082
  const { src } = props;
4067
4083
  // If video source switches, make new handle
package/dist/esm/version.mjs CHANGED
@@ -1,4 +1,4 @@
1
1
  // Automatically generated on publish
2
- const VERSION = '3.3.88';
2
+ const VERSION = '3.3.89';
3
3
 
4
4
  export { VERSION };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "remotion",
3
- "version": "3.3.88",
3
+ "version": "3.3.89",
4
4
  "description": "Render videos in React",
5
5
  "main": "dist/cjs/index.js",
6
6
  "types": "dist/cjs/index.d.ts",