remotion 4.0.537 → 4.0.539

package/dist/cjs/canvas-image/CanvasImage.js

@@ -47,6 +47,27 @@ exports.canvasImageSchema = {
     ...interactivity_schema_js_1.borderSchema,
     ...interactivity_schema_js_1.borderRadiusSchema,
 };
+const continueImageLoadDelay = (pendingLoadDelayRef, setIsLoadPending, continueRender, { markAsReady }) => {
+    const pending = pendingLoadDelayRef.current;
+    if (!pending || pending.continued) {
+        return;
+    }
+    pending.continued = true;
+    if (markAsReady) {
+        setIsLoadPending(false);
+    }
+    continueRender(pending.handle);
+    pendingLoadDelayRef.current = null;
+};
+const setCanvasRef = (setOutputCanvas, ref, canvas) => {
+    setOutputCanvas(canvas);
+    if (typeof ref === 'function') {
+        ref(canvas);
+    }
+    else if (ref) {
+        ref.current = canvas;
+    }
+};
 const makeAbortError = () => {
     if (typeof DOMException !== 'undefined') {
         return new DOMException('Image loading was aborted', 'AbortError');
@@ -96,7 +117,7 @@ const loadImage = ({ src, signal, crossOrigin, }) => {
             onAbort();
             return;
         }
-        image.crossOrigin = crossOrigin !== null && crossOrigin !== void 0 ? crossOrigin : 'anonymous';
+        image.crossOrigin = crossOrigin || 'anonymous';
         image.src = src;
     });
 };
@@ -129,33 +150,15 @@ const CanvasImageContent = (0, react_1.forwardRef)(({ src, crossOrigin, width, h
     const [isLoadPending, setIsLoadPending] = (0, react_1.useState)(false);
     const isPremounting = Boolean(sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.premounting);
     const isPostmounting = Boolean(sequenceContext === null || sequenceContext === void 0 ? void 0 : sequenceContext.postmounting);
-    const continuePendingLoadDelay = (0, react_1.useCallback)(({ markAsReady }) => {
-        const pending = pendingLoadDelayRef.current;
-        if (!pending || pending.continued) {
-            return;
-        }
-        pending.continued = true;
-        if (markAsReady) {
-            setIsLoadPending(false);
-        }
-        continueRender(pending.handle);
-        pendingLoadDelayRef.current = null;
-    }, [continueRender]);
+    // Bound callbacks keep only these inputs, including after minification.
+    const continuePendingLoadDelay = (0, react_1.useMemo)(() => continueImageLoadDelay.bind(null, pendingLoadDelayRef, setIsLoadPending, continueRender), [continueRender]);
     const sourceCanvas = (0, react_1.useMemo)(() => {
         if (typeof document === 'undefined') {
             return null;
         }
         return document.createElement('canvas');
     }, []);
-    const canvasRef = (0, react_1.useCallback)((canvas) => {
-        setOutputCanvas(canvas);
-        if (typeof ref === 'function') {
-            ref(canvas);
-        }
-        else if (ref) {
-            ref.current = canvas;
-        }
-    }, [ref]);
+    const canvasRef = (0, react_1.useMemo)(() => setCanvasRef.bind(null, setOutputCanvas, ref), [ref]);
     (0, react_1.useLayoutEffect)(() => {
         if (!pauseWhenLoading ||
             !isLoadPending ||
@@ -327,7 +330,7 @@ const CanvasImageContent = (0, react_1.forwardRef)(({ src, crossOrigin, width, h
         sourceCanvas,
         width,
     ]);
-    return (jsx_runtime_1.jsx("canvas", { ...canvasProps, ref: canvasRef, width: width, height: height, className: className, style: style, id: id }));
+    return ((0, jsx_runtime_1.jsx)("canvas", { ...canvasProps, ref: canvasRef, width: width, height: height, className: className, style: style, id: id }));
 });
 CanvasImageContent.displayName = 'CanvasImageContent';
 const CanvasImageInner = (0, react_1.forwardRef)(({ src, crossOrigin, width, height, fit, effects = [], effectsOutputSize, className, style, id, onError, pauseWhenLoading, maxRetries, delayRenderRetries, delayRenderTimeoutInMilliseconds, durationInFrames, from, trimBefore, loop, freeze, premountFor, postmountFor, styleWhilePremounted, styleWhilePostmounted, hidden, name, showInTimeline, cropLeft, cropRight, cropTop, cropBottom, controls, _remotionInternalDocumentationLink, _remotionInternalCropComponentName, ...canvasProps }, ref) => {
@@ -365,7 +368,7 @@ const CanvasImageInner = (0, react_1.forwardRef)(({ src, crossOrigin, width, hei
         style: premountingStyle,
         componentName: _remotionInternalCropComponentName !== null && _remotionInternalCropComponentName !== void 0 ? _remotionInternalCropComponentName : '<CanvasImage />',
     });
-    return (jsx_runtime_1.jsx(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: jsx_runtime_1.jsx(Sequence_js_1.Sequence, { layout: "none", from: from !== null && from !== void 0 ? from : 0, trimBefore: trimBefore, loop: loop, durationInFrames: durationInFrames, freeze: freeze, hidden: hidden, showInTimeline: showInTimeline !== null && showInTimeline !== void 0 ? showInTimeline : true, name: name !== null && name !== void 0 ? name : '<CanvasImage>', _remotionInternalDocumentationLink: _remotionInternalDocumentationLink !== null && _remotionInternalDocumentationLink !== void 0 ? _remotionInternalDocumentationLink : 'https://www.remotion.dev/docs/canvasimage', controls: controls, _remotionInternalEffects: memoizedEffectDefinitions, _remotionInternalIsMedia: isMedia, _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceContent, { children: jsx_runtime_1.jsx(CanvasImageContent, { ref: actualRef, src: src, crossOrigin: crossOrigin, width: width, height: height, fit: fit, effects: effects, effectsOutputSize: effectsOutputSize !== null && effectsOutputSize !== void 0 ? effectsOutputSize : null, controls: controls, className: className, style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined, id: id, onError: onError, pauseWhenLoading: pauseWhenLoading, maxRetries: maxRetries, delayRenderRetries: delayRenderRetries, delayRenderTimeoutInMilliseconds: delayRenderTimeoutInMilliseconds, ...canvasProps }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: (0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: from !== null && from !== void 0 ? from : 0, trimBefore: trimBefore, loop: loop, durationInFrames: durationInFrames, freeze: freeze, hidden: hidden, showInTimeline: showInTimeline !== null && showInTimeline !== void 0 ? showInTimeline : true, name: name !== null && name !== void 0 ? name : '<CanvasImage>', _remotionInternalDocumentationLink: _remotionInternalDocumentationLink !== null && _remotionInternalDocumentationLink !== void 0 ? _remotionInternalDocumentationLink : 'https://www.remotion.dev/docs/canvasimage', controls: controls, _remotionInternalEffects: memoizedEffectDefinitions, _remotionInternalIsMedia: isMedia, _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: (0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceContent, { children: (0, jsx_runtime_1.jsx)(CanvasImageContent, { ref: actualRef, src: src, crossOrigin: crossOrigin, width: width, height: height, fit: fit, effects: effects, effectsOutputSize: effectsOutputSize !== null && effectsOutputSize !== void 0 ? effectsOutputSize : null, controls: controls, className: className, style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined, id: id, onError: onError, pauseWhenLoading: pauseWhenLoading, maxRetries: maxRetries, delayRenderRetries: delayRenderRetries, delayRenderTimeoutInMilliseconds: delayRenderTimeoutInMilliseconds, ...canvasProps }) }) }) }));
 });
 /*
  * @description Renders a static image to a `<canvas>` and applies Remotion effects.

package/dist/cjs/canvas-image/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CanvasImage = void 0;
-const CanvasImage_js_1 = require("./CanvasImage.js");
+var CanvasImage_js_1 = require("./CanvasImage.js");
 Object.defineProperty(exports, "CanvasImage", { enumerable: true, get: function () { return CanvasImage_js_1.CanvasImage; } });

package/dist/cjs/codec.d.ts

@@ -1,4 +1,4 @@
-export declare const validCodecs: readonly ["h264", "h265", "vp8", "vp9", "av1", "mp3", "aac", "wav", "prores", "h264-mkv", "h264-ts", "gif"];
+export declare const validCodecs: readonly ['h264', 'h265', 'vp8', 'vp9', 'av1', 'mp3', 'aac', 'wav', 'prores', 'h264-mkv', 'h264-ts', 'gif'];
 export type Codec = (typeof validCodecs)[number];
 export type CodecOrUndefined = Codec | undefined;
 export declare const DEFAULT_CODEC: Codec;

package/dist/cjs/committed-metadata.d.ts

@@ -1,6 +1,7 @@
 import type { Provider, ProviderExoticComponent, ProviderProps, RefObject } from 'react';
 import type { AnyComposition, TSequence } from './CompositionManager.js';
 import type { TFolder } from './Folder.js';
+declare const COMMITTED_METADATA_PROP = "_remotionCommitMetadata";
 export declare const COMMIT_ORDER_EVENT = "remotion:commit-order";
 export declare const COMMIT_REGISTRATION_ERROR_EVENT = "remotion:commit-registration-error";
 export declare const isCommitRegistrationObserverInstalled: () => boolean;
@@ -54,15 +55,16 @@ export type CommittedMetadata = {
     readonly onCommit: ((snapshot: CommittedCompositionSnapshot) => void) | null;
 };
 export declare const withCommittedMetadata: <T>(provider: Provider<T>) => ProviderExoticComponent<ProviderProps<T> & {
-    readonly _remotionCommitMetadata: CommittedMetadata | null;
+    readonly [COMMITTED_METADATA_PROP]: CommittedMetadata | null;
 }>;
 export declare const CommittedMetadataProvider: ProviderExoticComponent<ProviderProps<null> & {
     readonly _remotionCommitMetadata: CommittedMetadata | null;
 }>;
 export declare const CommittedMetadataInternals: {
-    metadataProp: "_remotionCommitMetadata";
+    metadataProp: typeof COMMITTED_METADATA_PROP;
     eventName: string;
     installationMarker: symbol;
     failureMarker: symbol;
     registrationErrorEventName: string;
 };
+export {};

package/dist/cjs/composition-registry-fallback.d.ts

@@ -7,8 +7,10 @@ export type CommittedCompositionEntry = {
     readonly type: 'folder';
     readonly value: TFolder;
 };
-export declare const CompositionRegistryFallbackContext: import("react").Context<{
+type CompositionRegistryFallback = {
     readonly entries: Map<object, CommittedCompositionEntry>;
     readonly notifyCommit: () => void;
-} | null>;
+};
+export declare const CompositionRegistryFallbackContext: import("react").Context<CompositionRegistryFallback | null>;
 export declare const useCommittedCompositionEntry: (entry: CommittedCompositionEntry | null) => void;
+export {};

package/dist/cjs/composition-registry-fallback.js

@@ -4,6 +4,15 @@ exports.useCommittedCompositionEntry = exports.CompositionRegistryFallbackContex
 const react_1 = require("react");
 exports.CompositionRegistryFallbackContext = (0, react_1.createContext)(null);
 const useIsomorphicLayoutEffect = typeof window === 'undefined' ? react_1.useEffect : react_1.useLayoutEffect;
+const createEntryCleanup = (registry, identity) => {
+    if (registry === null) {
+        return;
+    }
+    return () => {
+        registry.entries.delete(identity);
+        registry.notifyCommit();
+    };
+};
 // The fallback stages descriptors during layout effects and publishes one
 // complete snapshot after the commit, including mount and unmount changes.
 const useCommittedCompositionEntry = (entry) => {
@@ -21,15 +30,8 @@ const useCommittedCompositionEntry = (entry) => {
         }
         registry.notifyCommit();
     }, [entry, registry]);
-    useIsomorphicLayoutEffect(() => {
-        if (registry === null) {
-            return;
-        }
-        const identity = key.current;
-        return () => {
-            registry.entries.delete(identity);
-            registry.notifyCommit();
-        };
-    }, [registry]);
+    // The cleanup outlives entry changes. Binding a separate factory prevents it
+    // from sharing a closure with the original entry, even after minification.
+    useIsomorphicLayoutEffect(createEntryCleanup.bind(null, registry, key.current), [registry]);
 };
 exports.useCommittedCompositionEntry = useCommittedCompositionEntry;

package/dist/cjs/create-element-source-proxy.js

@@ -7,6 +7,7 @@ const internalStackProp = enable_sequence_stack_traces_js_1.REMOTION_INTERNAL_ST
 const createElementSourceProxy = (api, sourceArgumentIndex, getSourceFileName) => {
     return new Proxy(api, {
         apply(target, thisArg, argArray) {
+            var _a;
             const component = argArray[0];
             if (componentsToAddStacksTo.includes(component)) {
                 const [first, props, ...rest] = argArray;
@@ -18,19 +19,58 @@ const createElementSourceProxy = (api, sourceArgumentIndex, getSourceFileName) =
                     (props === null || props === void 0 ? void 0 : props.controls)
                     ? (0, enable_sequence_stack_traces_js_1.getStackForControls)(props.controls)
                     : null;
-                const stack = existingStack ||
-                    (controlsStack !== null && controlsStack !== void 0 ? controlsStack : (source &&
+                let stack = existingStack || controlsStack;
+                if (!stack) {
+                    if (source &&
                         typeof source.fileName === 'string' &&
                         typeof source.lineNumber === 'number' &&
-                        typeof source.columnNumber === 'number'
-                        ? (0, enable_sequence_stack_traces_js_1.makeOriginalSourceStack)({
+                        typeof source.columnNumber === 'number') {
+                        stack = (0, enable_sequence_stack_traces_js_1.makeOriginalSourceStack)({
                             fileName: getSourceFileName(source.fileName),
                             lineNumber: source.lineNumber,
                             // JSX development locations are one-based, like stack traces.
                             // Resolved source locations and AST lookups use zero-based columns.
                             columnNumber: source.columnNumber - 1,
-                        })
-                        : new Error().stack));
+                        });
+                    }
+                    else {
+                        // Avoid collecting the full Studio error stack just to discard it.
+                        // Restore the limit before formatting, which can invoke user code.
+                        const { stackTraceLimit } = Error;
+                        const canLimitStack = typeof stackTraceLimit === 'number' &&
+                            stackTraceLimit > 2 &&
+                            ((_a = Object.getOwnPropertyDescriptor(Error, 'stackTraceLimit')) === null || _a === void 0 ? void 0 : _a.writable);
+                        let capturedError;
+                        try {
+                            if (canLimitStack) {
+                                Error.stackTraceLimit = 2;
+                            }
+                            capturedError = new Error();
+                        }
+                        finally {
+                            if (canLimitStack) {
+                                Error.stackTraceLimit = stackTraceLimit;
+                            }
+                        }
+                        const capturedStack = capturedError.stack;
+                        // Keep the proxy and JSX call site, including its generated URL for
+                        // Fast Refresh. Later React scheduler frames vary between renders.
+                        // V8 adds an Error header; Firefox and Safari start with a frame.
+                        if (capturedStack) {
+                            const firstFrameEnd = capturedStack.indexOf('\n', capturedStack.startsWith('Error\n') ? 6 : 0);
+                            const callerEnd = firstFrameEnd === -1
+                                ? -1
+                                : capturedStack.indexOf('\n', firstFrameEnd + 1);
+                            stack =
+                                callerEnd === -1
+                                    ? capturedStack
+                                    : capturedStack.slice(0, callerEnd);
+                        }
+                        else {
+                            stack = capturedStack;
+                        }
+                    }
+                }
                 const newProps = existingStack
                     ? { ...props }
                     : {

package/dist/cjs/default-css.d.ts

@@ -1,3 +1,3 @@
-export declare const injectCSS: (css: string) => () => void;
+export declare const injectCSS: (css: string) => (() => void);
 export declare const OBJECTFIT_CONTAIN_CLASS_NAME = "__remotion_objectfitcontain";
 export declare const makeDefaultPreviewCSS: (scope: string | null, backgroundColor: string) => string;

package/dist/cjs/delay-render.d.ts

@@ -14,6 +14,7 @@ export type DelayRenderScope = {
     remotion_attempt: number;
     remotion_delayRenderHandles: number[];
     remotion_cancelledError?: string;
+    remotion_cancelledErrorObject?: Error;
 };
 export type DelayRenderOptions = {
     timeoutInMilliseconds?: number;
@@ -31,7 +32,7 @@ type DelayRenderInternalOptions = {
     options: DelayRenderOptions;
 };
 export declare const delayRenderInternal: ({ scope, environment, label, options, }: DelayRenderInternalOptions) => number;
-export declare const delayRender: (label?: string | undefined, options?: DelayRenderOptions | undefined) => number;
+export declare const delayRender: (label?: string, options?: DelayRenderOptions) => number;
 /**
  * Internal function that accepts environment as parameter.
  * @private

package/dist/cjs/delay-render.js

@@ -6,7 +6,7 @@ const delay_render_constants_js_1 = require("./delay-render-constants.js");
 const get_remotion_environment_js_1 = require("./get-remotion-environment.js");
 const log_js_1 = require("./log.js");
 const truthy_js_1 = require("./truthy.js");
-const delay_render_constants_js_2 = require("./delay-render-constants.js");
+var delay_render_constants_js_2 = require("./delay-render-constants.js");
 Object.defineProperty(exports, "DELAY_RENDER_CALLSTACK_TOKEN", { enumerable: true, get: function () { return delay_render_constants_js_2.DELAY_RENDER_CALLSTACK_TOKEN; } });
 Object.defineProperty(exports, "DELAY_RENDER_CLEAR_TOKEN", { enumerable: true, get: function () { return delay_render_constants_js_2.DELAY_RENDER_CLEAR_TOKEN; } });
 Object.defineProperty(exports, "DELAY_RENDER_RETRIES_LEFT", { enumerable: true, get: function () { return delay_render_constants_js_2.DELAY_RENDER_RETRIES_LEFT; } });
@@ -49,7 +49,9 @@ const delayRenderInternal = ({ scope, environment, label, options, }) => {
                     .join(' ');
                 // in client-side rendering, don't throw (would be uncaught from setTimeout)
                 if (environment.isClientSideRendering) {
-                    scope.remotion_cancelledError = (0, cancel_render_js_1.getErrorStackWithMessage)(Error(message));
+                    const error = Error(message);
+                    scope.remotion_cancelledErrorObject = error;
+                    scope.remotion_cancelledError = (0, cancel_render_js_1.getErrorStackWithMessage)(error);
                 }
                 else {
                     (0, cancel_render_js_1.cancelRenderInternal)(scope, Error(message));

package/dist/cjs/easing.js

@@ -9,6 +9,7 @@ const index_js_1 = require("./spring/index.js");
 // there so we return endpoints instead of NaN or unintended extrapolation.
 const clampUnit = (t) => Math.min(1, Math.max(0, t));
 const springEasingDurationInFrames = 30;
+let easeBezier = null;
 /**
  * @description The Easing module implements common easing functions. You can use it with the interpolate() API.
  * @see [Documentation](https://www.remotion.dev/docs/easing)
@@ -24,7 +25,8 @@ class Easing {
         return t;
     }
     static ease(t) {
-        return Easing.bezier(0.42, 0, 1, 1)(t);
+        easeBezier !== null && easeBezier !== void 0 ? easeBezier : (easeBezier = Easing.bezier(0.42, 0, 1, 1));
+        return easeBezier(t);
     }
     static quad(t) {
         return t * t;

package/dist/cjs/effects/Solid.d.ts

@@ -16,52 +16,52 @@ type OptionalProps = {
 export type SolidProps = MandatoryProps & Partial<OptionalProps> & InteractiveCropProps;
 export declare const solidSchema: {
     readonly 'style.transformOrigin': {
-        readonly type: "transform-origin";
+        readonly type: 'transform-origin';
         readonly step: 1;
-        readonly default: "50% 50%";
-        readonly description: "Transform origin";
+        readonly default: '50% 50%';
+        readonly description: 'Transform origin';
     };
     readonly 'style.translate': {
-        readonly type: "translate";
+        readonly type: 'translate';
         readonly step: 1;
-        readonly default: "0px 0px";
-        readonly description: "Offset";
+        readonly default: '0px 0px';
+        readonly description: 'Offset';
     };
     readonly 'style.scale': {
-        readonly type: "scale";
+        readonly type: 'scale';
         readonly max: 100;
         readonly step: 0.01;
         readonly default: 1;
-        readonly description: "Scale";
-        readonly defaultKeyframeOutput: "perceptual-scale";
+        readonly description: 'Scale';
+        readonly defaultKeyframeOutput: 'perceptual-scale';
     };
     readonly 'style.rotate': {
-        readonly type: "rotation-css";
+        readonly type: 'rotation-css';
         readonly step: 1;
-        readonly default: "0deg";
-        readonly description: "Rotation";
+        readonly default: '0deg';
+        readonly description: 'Rotation';
     };
     readonly 'style.opacity': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly min: 0;
         readonly max: 1;
         readonly step: 0.01;
         readonly default: 1;
-        readonly description: "Opacity";
+        readonly description: 'Opacity';
         readonly hiddenFromList: false;
     };
     readonly 'style.borderWidth': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: undefined;
         readonly min: 0;
         readonly step: 1;
-        readonly description: "Border width";
+        readonly description: 'Border width';
         readonly hiddenFromList: false;
     };
     readonly 'style.borderStyle': {
-        readonly type: "enum";
-        readonly default: "none";
-        readonly description: "Border style";
+        readonly type: 'enum';
+        readonly default: 'none';
+        readonly description: 'Border style';
         readonly variants: {
             readonly none: {};
             readonly hidden: {};
@@ -76,67 +76,67 @@ export declare const solidSchema: {
         };
     };
     readonly 'style.borderColor': {
-        readonly type: "color";
+        readonly type: 'color';
         readonly default: undefined;
-        readonly description: "Border color";
+        readonly description: 'Border color';
     };
     readonly 'style.borderRadius': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
-        readonly description: "Border radius";
+        readonly description: 'Border radius';
         readonly hiddenFromList: false;
         readonly keyframable: true;
     };
     readonly 'style.borderTopLeftRadius': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
-        readonly description: "Top left radius";
+        readonly description: 'Top left radius';
         readonly hiddenFromList: false;
     };
     readonly 'style.borderTopRightRadius': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
-        readonly description: "Top right radius";
+        readonly description: 'Top right radius';
         readonly hiddenFromList: false;
     };
     readonly 'style.borderBottomRightRadius': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
-        readonly description: "Bottom right radius";
+        readonly description: 'Bottom right radius';
         readonly hiddenFromList: false;
     };
     readonly 'style.borderBottomLeftRadius': {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
-        readonly description: "Bottom left radius";
+        readonly description: 'Bottom left radius';
         readonly hiddenFromList: false;
     };
     readonly 'style.backgroundColor': {
-        readonly type: "color";
-        readonly default: "transparent";
-        readonly description: "Color";
+        readonly type: 'color';
+        readonly default: 'transparent';
+        readonly description: 'Color';
     };
     readonly premountFor: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: undefined;
-        readonly description: "Premount For";
+        readonly description: 'Premount For';
         readonly min: 0;
         readonly step: 1;
         readonly hiddenFromList: false;
         readonly keyframable: false;
     };
     readonly postmountFor: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
@@ -144,9 +144,9 @@ export declare const solidSchema: {
         readonly keyframable: false;
     };
     readonly cropLeft: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
-        readonly description: "Crop left";
+        readonly description: 'Crop left';
         readonly min: 0;
         readonly max: 1;
         readonly step: 0.01;
@@ -154,9 +154,9 @@ export declare const solidSchema: {
         readonly keyframable: true;
     };
     readonly cropRight: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
-        readonly description: "Crop right";
+        readonly description: 'Crop right';
         readonly min: 0;
         readonly max: 1;
         readonly step: 0.01;
@@ -164,9 +164,9 @@ export declare const solidSchema: {
         readonly keyframable: true;
     };
     readonly cropTop: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
-        readonly description: "Crop top";
+        readonly description: 'Crop top';
         readonly min: 0;
         readonly max: 1;
         readonly step: 0.01;
@@ -174,9 +174,9 @@ export declare const solidSchema: {
         readonly keyframable: true;
     };
     readonly cropBottom: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
-        readonly description: "Crop bottom";
+        readonly description: 'Crop bottom';
         readonly min: 0;
         readonly max: 1;
         readonly step: 0.01;
@@ -184,36 +184,36 @@ export declare const solidSchema: {
         readonly keyframable: true;
     };
     readonly durationInFrames: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: undefined;
         readonly min: 1;
         readonly step: 1;
         readonly hiddenFromList: true;
     };
     readonly from: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly step: 1;
         readonly hiddenFromList: true;
     };
     readonly trimBefore: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 0;
         readonly min: 0;
         readonly step: 1;
         readonly hiddenFromList: true;
     };
     readonly playbackRate: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: 1;
         readonly min: 0.01;
         readonly step: 0.1;
-        readonly description: "Playback rate";
+        readonly description: 'Playback rate';
         readonly hiddenFromList: false;
         readonly keyframable: false;
     };
     readonly freeze: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly default: null;
         readonly step: 1;
         readonly hiddenFromList: true;
@@ -222,33 +222,33 @@ export declare const solidSchema: {
     readonly name: import("../interactivity-schema.js").HiddenFieldSchema;
     readonly showInTimeline: import("../interactivity-schema.js").HiddenFieldSchema;
     readonly color: {
-        readonly type: "color";
-        readonly default: "transparent";
-        readonly description: "Color";
+        readonly type: 'color';
+        readonly default: 'transparent';
+        readonly description: 'Color';
     };
     readonly width: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly min: 1;
         readonly step: 1;
         readonly default: 1920;
-        readonly description: "Width";
+        readonly description: 'Width';
         readonly hiddenFromList: false;
     };
     readonly height: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly min: 1;
         readonly step: 1;
         readonly default: 1080;
-        readonly description: "Height";
+        readonly description: 'Height';
         readonly hiddenFromList: false;
     };
     readonly pixelDensity: {
-        readonly type: "number";
+        readonly type: 'number';
         readonly min: 1;
         readonly max: 3;
         readonly step: 0.1;
         readonly default: 1;
-        readonly description: "Pixel density";
+        readonly description: 'Pixel density';
         readonly hiddenFromList: false;
     };
 };

package/dist/cjs/effects/Solid.js

@@ -156,7 +156,7 @@ const SolidInner = ({ color, width, height, effects = [], effectsOutputSize = nu
             ...(style !== null && style !== void 0 ? style : {}),
         };
     }, [height, style, width]);
-    return (jsx_runtime_1.jsx("canvas", { ref: canvasRef, width: canvasWidth, height: canvasHeight, className: className, style: canvasStyle }));
+    return ((0, jsx_runtime_1.jsx)("canvas", { ref: canvasRef, width: canvasWidth, height: canvasHeight, className: className, style: canvasStyle }));
 };
 const SolidOuter = (0, react_1.forwardRef)(({ effects = [], effectsOutputSize = null, controls, color, height, width, className, durationInFrames, style, name, from, premountFor, postmountFor, styleWhilePremounted, styleWhilePostmounted, trimBefore, playbackRate, loop, freeze, hidden, showInTimeline, pixelDensity, cropLeft, cropRight, cropTop, cropBottom, ...props }, ref) => {
     var _a, _b;
@@ -188,7 +188,7 @@ const SolidOuter = (0, react_1.forwardRef)(({ effects = [], effectsOutputSize =
         style: premountingStyle,
         componentName: '<Solid />',
     });
-    return (jsx_runtime_1.jsx(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: jsx_runtime_1.jsx(Sequence_js_1.Sequence, { layout: "none", from: from, trimBefore: trimBefore, playbackRate: playbackRate, loop: loop, freeze: freeze, hidden: hidden, showInTimeline: showInTimeline, controls: controls, _remotionInternalEffects: memoizedEffectDefinitions, durationInFrames: durationInFrames, name: name !== null && name !== void 0 ? name : '<Solid>', _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/solid", ...props, _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: jsx_runtime_1.jsx(sequence_activity_context_js_1.SequenceContent, { children: jsx_runtime_1.jsx(SolidInner, { reference: actualRef, videoConfigValues: (_a = controls === null || controls === void 0 ? void 0 : controls.videoConfigValues) !== null && _a !== void 0 ? _a : null, overrideId: (_b = controls === null || controls === void 0 ? void 0 : controls.overrideId) !== null && _b !== void 0 ? _b : null, color: color, height: height, width: width, className: className, style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined, effects: effects, effectsOutputSize: effectsOutputSize, pixelDensity: pixelDensity }) }) }) }));
+    return ((0, jsx_runtime_1.jsx)(freeze_js_1.Freeze, { frame: freezeFrame, active: isPremountingOrPostmounting, _remotionInternalIsPremounting: premountingActive, children: (0, jsx_runtime_1.jsx)(Sequence_js_1.Sequence, { layout: "none", from: from, trimBefore: trimBefore, playbackRate: playbackRate, loop: loop, freeze: freeze, hidden: hidden, showInTimeline: showInTimeline, controls: controls, _remotionInternalEffects: memoizedEffectDefinitions, durationInFrames: durationInFrames, name: name !== null && name !== void 0 ? name : '<Solid>', _remotionInternalDocumentationLink: "https://www.remotion.dev/docs/solid", ...props, _remotionInternalPremountDisplay: effectivePremountFor || null, _remotionInternalPostmountDisplay: effectivePostmountFor || null, _remotionInternalIsPremounting: premountingActive, _remotionInternalIsPostmounting: postmountingActive, children: (0, jsx_runtime_1.jsx)(sequence_activity_context_js_1.SequenceContent, { children: (0, jsx_runtime_1.jsx)(SolidInner, { reference: actualRef, videoConfigValues: (_a = controls === null || controls === void 0 ? void 0 : controls.videoConfigValues) !== null && _a !== void 0 ? _a : null, overrideId: (_b = controls === null || controls === void 0 ? void 0 : controls.overrideId) !== null && _b !== void 0 ? _b : null, color: color, height: height, width: width, className: className, style: croppedStyle !== null && croppedStyle !== void 0 ? croppedStyle : undefined, effects: effects, effectsOutputSize: effectsOutputSize, pixelDensity: pixelDensity }) }) }) }));
 });
 exports.Solid = (0, with_interactivity_schema_js_1.withInteractivitySchema)({
     Component: SolidOuter,