remotion 4.0.489 → 4.0.490

package/dist/cjs/HtmlInCanvas.d.ts

@@ -83,6 +83,7 @@ export declare const htmlInCanvasSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";

package/dist/cjs/Img.d.ts

@@ -36,6 +36,7 @@ export declare const imgSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";

package/dist/cjs/Interactive.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import type { SequenceControls } from './CompositionManager.js';
 import { type InteractivitySchema } from './interactivity-schema.js';
 import type { AbsoluteFillLayout, SequenceProps } from './Sequence.js';
+import { type WithInteractivitySchemaOptions } from './with-interactivity-schema.js';
 type InteractiveHtmlTag = 'a' | 'article' | 'aside' | 'button' | 'code' | 'div' | 'em' | 'footer' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'header' | 'label' | 'li' | 'main' | 'nav' | 'ol' | 'p' | 'pre' | 'section' | 'small' | 'span' | 'strong' | 'ul';
 type InteractiveSvgTag = 'circle' | 'ellipse' | 'g' | 'line' | 'path' | 'rect' | 'svg' | 'text';
 type InteractiveTag = InteractiveHtmlTag | InteractiveSvgTag;
@@ -17,6 +17,7 @@ type InteractiveSequenceProps = InteractiveBaseProps & {
 };
 type InteractiveElementProps<Tag extends InteractiveTag> = Omit<React.ComponentPropsWithoutRef<Tag>, keyof InteractiveSequenceProps> & InteractiveSequenceProps;
 type InteractiveElementComponent<Tag extends InteractiveTag> = React.ComponentType<InteractiveElementProps<Tag> & React.RefAttributes<ElementForTag<Tag>>>;
+type RemotionComponentIdentityPackage = 'remotion' | `@remotion/${string}`;
 /**
  * @description HTML and SVG elements that are registered in the Remotion Studio timeline and can be visually edited.
  */
@@ -71,6 +72,7 @@ export declare const Interactive: {
             readonly step: 0.01;
             readonly default: 1;
             readonly description: "Scale";
+            readonly defaultKeyframeOutput: "perceptual-scale";
         };
         readonly 'style.rotate': {
             readonly type: "rotation-css";
@@ -242,6 +244,7 @@ export declare const Interactive: {
                         readonly step: 0.01;
                         readonly default: 1;
                         readonly description: "Scale";
+                        readonly defaultKeyframeOutput: "perceptual-scale";
                     };
                     readonly 'style.rotate': {
                         readonly type: "rotation-css";
@@ -284,15 +287,11 @@ export declare const Interactive: {
             };
         };
     };
-    withSchema: <S extends InteractivitySchema, Props extends object>({ Component, componentName, componentIdentity, schema, supportsEffects, }: {
-        Component: React.ComponentType<Props & {
-            readonly controls: SequenceControls | undefined;
-        }>;
-        componentName: string;
-        componentIdentity: string | null;
-        schema: S;
-        supportsEffects: boolean;
-    }) => React.ComponentType<Props>;
+    withSchema: <S extends InteractivitySchema, Props extends object>(options: WithInteractivitySchemaOptions<S, Props>) => React.ComponentType<Props>;
+    _internalMakeRemotionComponentIdentity: ({ packageName, componentName, }: {
+        readonly packageName: RemotionComponentIdentityPackage;
+        readonly componentName: string;
+    }) => string;
     A: InteractiveElementComponent<"a">;
     Article: InteractiveElementComponent<"article">;
     Aside: InteractiveElementComponent<"aside">;

package/dist/cjs/Interactive.js

@@ -40,6 +40,21 @@ const enable_sequence_stack_traces_js_1 = require("./enable-sequence-stack-trace
 const interactivity_schema_js_1 = require("./interactivity-schema.js");
 const Sequence_js_1 = require("./Sequence.js");
 const with_interactivity_schema_js_1 = require("./with-interactivity-schema.js");
+const sourcePathToIdentityPrefix = (packageName) => {
+    if (packageName === 'remotion') {
+        return 'dev.remotion.remotion';
+    }
+    if (packageName.startsWith('@remotion/')) {
+        const normalizedPackageName = packageName
+            .slice('@remotion/'.length)
+            .replace(/-([a-z])/g, (_, char) => char.toUpperCase());
+        return `dev.remotion.${normalizedPackageName}`;
+    }
+    throw new Error(`Unsupported Remotion package name: ${packageName}`);
+};
+const makeRemotionComponentIdentity = ({ packageName, componentName, }) => {
+    return `${sourcePathToIdentityPrefix(packageName)}.${componentName}`;
+};
 const interactiveElementSchema = {
     ...interactivity_schema_js_1.baseSchema,
     ...interactivity_schema_js_1.transformSchema,
@@ -54,6 +69,11 @@ const setRef = (ref, value) => {
         ref.current = value;
     }
 };
+const withSchema = (options) => {
+    const Wrapped = (0, with_interactivity_schema_js_1.withInteractivitySchema)(options);
+    (0, enable_sequence_stack_traces_js_1.addSequenceStackTraces)(Wrapped);
+    return Wrapped;
+};
 const makeInteractiveElement = (tag, displayName) => {
     const Inner = (0, react_1.forwardRef)((propsWithControls, ref) => {
         const { durationInFrames, from, trimBefore, freeze, hidden, name, showInTimeline, stack, controls, ...props } = propsWithControls;
@@ -68,15 +88,17 @@ const makeInteractiveElement = (tag, displayName) => {
             }) }));
     });
     Inner.displayName = displayName;
-    const Wrapped = (0, with_interactivity_schema_js_1.withInteractivitySchema)({
+    const Wrapped = withSchema({
         Component: Inner,
         componentName: displayName,
-        componentIdentity: `dev.remotion.remotion.${displayName.slice(1, -1)}`,
+        componentIdentity: makeRemotionComponentIdentity({
+            packageName: 'remotion',
+            componentName: displayName.slice(1, -1),
+        }),
         schema: interactiveElementSchema,
         supportsEffects: false,
     });
     Wrapped.displayName = displayName;
-    (0, enable_sequence_stack_traces_js_1.addSequenceStackTraces)(Wrapped);
     return Wrapped;
 };
 /**
@@ -88,7 +110,8 @@ exports.Interactive = {
     textSchema: interactivity_schema_js_1.textSchema,
     premountSchema: interactivity_schema_js_1.premountSchema,
     sequenceSchema: interactivity_schema_js_1.sequenceSchema,
-    withSchema: with_interactivity_schema_js_1.withInteractivitySchema,
+    withSchema,
+    _internalMakeRemotionComponentIdentity: makeRemotionComponentIdentity,
     A: makeInteractiveElement('a', '<Interactive.A>'),
     Article: makeInteractiveElement('article', '<Interactive.Article>'),
     Aside: makeInteractiveElement('aside', '<Interactive.Aside>'),

package/dist/cjs/canvas-image/CanvasImage.d.ts

@@ -20,6 +20,7 @@ export declare const canvasImageSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";

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

@@ -1,3 +1,4 @@
+import type { LogLevel } from './log.js';
 import type { RemotionEnvironment } from './remotion-environment-context.js';
 export type DelayRenderScope = {
     remotion_renderReady: boolean;
@@ -26,21 +27,24 @@ export type DelayRenderOptions = {
  * This allows useDelayRender to control its own environment source.
  * @private
  */
-export declare const delayRenderInternal: ({ scope, environment, label, options, }: {
+type DelayRenderInternalOptions = {
     scope: DelayRenderScope;
     environment: RemotionEnvironment;
     label: string | null;
     options: DelayRenderOptions;
-}) => number;
+};
+export declare const delayRenderInternal: ({ scope, environment, label, options, }: DelayRenderInternalOptions) => number;
 export declare const delayRender: (label?: string | undefined, options?: DelayRenderOptions | undefined) => number;
 /**
  * Internal function that accepts environment as parameter.
  * @private
  */
-export declare const continueRenderInternal: ({ scope, handle, environment, logLevel, }: {
+type ContinueRenderInternalOptions = {
     scope: DelayRenderScope;
     handle: number;
     environment: RemotionEnvironment;
-    logLevel: "error" | "info" | "trace" | "verbose" | "warn";
-}) => void;
+    logLevel: LogLevel;
+};
+export declare const continueRenderInternal: ({ scope, handle, environment, logLevel, }: ContinueRenderInternalOptions) => void;
 export declare const continueRender: (handle: number) => void;
+export {};

package/dist/cjs/delay-render.js

@@ -17,11 +17,6 @@ exports.DELAY_RENDER_RETRIES_LEFT = 'Retries left: ';
 exports.DELAY_RENDER_RETRY_TOKEN = '- Rendering the frame will be retried.';
 exports.DELAY_RENDER_CLEAR_TOKEN = 'handle was cleared after';
 const defaultTimeout = 30000;
-/**
- * Internal function that accepts environment as parameter.
- * This allows useDelayRender to control its own environment source.
- * @private
- */
 const delayRenderInternal = ({ scope, environment, label, options, }) => {
     var _a;
     var _b, _c, _d, _e;
@@ -80,10 +75,6 @@ const delayRender = (label, options) => {
     });
 };
 exports.delayRender = delayRender;
-/**
- * Internal function that accepts environment as parameter.
- * @private
- */
 const continueRenderInternal = ({ scope, handle, environment, logLevel, }) => {
     if (typeof handle === 'undefined') {
         throw new TypeError('The continueRender() method must be called with a parameter that is the return value of delayRender(). No value was passed.');
@@ -92,28 +83,22 @@ const continueRenderInternal = ({ scope, handle, environment, logLevel, }) => {
         throw new TypeError('The parameter passed into continueRender() must be the return value of delayRender() which is a number. Got: ' +
             JSON.stringify(handle));
     }
-    scope.remotion_delayRenderHandles = scope.remotion_delayRenderHandles.filter((h) => {
-        if (h === handle) {
-            if (environment.isRendering && scope !== undefined) {
-                if (!scope.remotion_delayRenderTimeouts[handle]) {
-                    return false;
-                }
-                const { label, startTime, timeout } = scope.remotion_delayRenderTimeouts[handle];
-                clearTimeout(timeout);
-                const message = [
-                    label ? `"${label}"` : 'A handle',
-                    exports.DELAY_RENDER_CLEAR_TOKEN,
-                    `${Date.now() - startTime}ms`,
-                ]
-                    .filter(truthy_js_1.truthy)
-                    .join(' ');
-                log_js_1.Log.verbose({ logLevel, tag: 'delayRender()' }, message);
-                delete scope.remotion_delayRenderTimeouts[handle];
-            }
-            return false;
-        }
-        return true;
-    });
+    const handleExists = scope.remotion_delayRenderHandles.includes(handle);
+    const timeoutEntry = scope.remotion_delayRenderTimeouts[handle];
+    if (handleExists && environment.isRendering && timeoutEntry) {
+        const { label, startTime, timeout } = timeoutEntry;
+        clearTimeout(timeout);
+        const message = [
+            label ? `"${label}"` : 'A handle',
+            exports.DELAY_RENDER_CLEAR_TOKEN,
+            `${Date.now() - startTime}ms`,
+        ]
+            .filter(truthy_js_1.truthy)
+            .join(' ');
+        log_js_1.Log.verbose({ logLevel, tag: 'delayRender()' }, message);
+        delete scope.remotion_delayRenderTimeouts[handle];
+    }
+    scope.remotion_delayRenderHandles = scope.remotion_delayRenderHandles.filter((h) => h !== handle);
     if (scope.remotion_delayRenderHandles.length === 0) {
         scope.remotion_renderReady = true;
     }

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

@@ -32,6 +32,7 @@ export declare const solidSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";

package/dist/cjs/flatten-schema.js

@@ -28,7 +28,7 @@ const getFlatSchemaWithAllKeys = (schema) => {
     const out = {};
     const addKey = (key, field) => {
         if (key in out) {
-            throw new Error(`Duplicate key "${key}" in schema: discriminated union variants must not share keys`);
+            return;
         }
         out[key] = field;
     };

package/dist/cjs/index.d.ts

@@ -132,7 +132,7 @@ export * from './internals.js';
 export { interpolateColors, type InterpolateColorsOptions, } from './interpolate-colors.js';
 export { LogLevel } from './log.js';
 export { Loop } from './loop/index.js';
-export { assertValidInterpolateEasingOption, assertValidInterpolatePosterizeOption, EasingFunction, ExtrapolateType, interpolate, InterpolateOptions, random, RandomSeed, } from './no-react';
+export { assertValidInterpolateEasingOption, assertValidInterpolatePosterizeOption, EasingFunction, ExtrapolateType, interpolate, InterpolateOutputOption, InterpolateOptions, random, RandomSeed, } from './no-react';
 export type { NonceHistory } from './nonce.js';
 export { prefetch, PrefetchOnProgress } from './prefetch.js';
 export { registerRoot } from './register-root.js';

package/dist/cjs/interactivity-schema.d.ts

@@ -1,3 +1,4 @@
+import type { InterpolateOutputOption } from './interpolate.js';
 export type HiddenFieldSchema = {
     type: 'hidden';
     keyframable?: boolean;
@@ -11,6 +12,7 @@ export type NumberFieldSchema = {
     description?: string;
     hiddenFromList: boolean;
     keyframable?: boolean;
+    defaultKeyframeOutput?: InterpolateOutputOption;
 };
 export type BooleanFieldSchema = {
     type: 'boolean';
@@ -56,6 +58,7 @@ export type ScaleFieldSchema = {
     default: number | string | undefined;
     description?: string;
     keyframable?: boolean;
+    defaultKeyframeOutput?: InterpolateOutputOption;
 };
 export type UvCoordinateFieldSchema = {
     type: 'uv-coordinate';
@@ -101,7 +104,7 @@ export type EnumFieldSchema = {
     variants: Record<string, InteractivitySchema>;
     keyframable?: boolean;
 };
-export type NumberArrayItemSchema = Omit<NumberFieldSchema, 'default' | 'description' | 'hiddenFromList' | 'keyframable'>;
+export type NumberArrayItemSchema = Omit<NumberFieldSchema, 'default' | 'description' | 'hiddenFromList' | 'keyframable' | 'defaultKeyframeOutput'>;
 export type BooleanArrayItemSchema = Omit<BooleanFieldSchema, 'default' | 'description' | 'keyframable'>;
 export type RotationCssArrayItemSchema = Omit<RotationCssFieldSchema, 'default' | 'description' | 'keyframable'>;
 export type RotationDegreesArrayItemSchema = Omit<RotationDegreesFieldSchema, 'default' | 'description' | 'keyframable'>;
@@ -148,6 +151,7 @@ export declare const transformSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";
@@ -184,6 +188,7 @@ export declare const sequenceVisualStyleSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";
@@ -351,6 +356,7 @@ export declare const sequenceStyleSchema: {
         readonly step: 0.01;
         readonly default: 1;
         readonly description: "Scale";
+        readonly defaultKeyframeOutput: "perceptual-scale";
     };
     readonly 'style.rotate': {
         readonly type: "rotation-css";
@@ -505,6 +511,7 @@ export declare const sequenceSchema: {
                     readonly step: 0.01;
                     readonly default: 1;
                     readonly description: "Scale";
+                    readonly defaultKeyframeOutput: "perceptual-scale";
                 };
                 readonly 'style.rotate': {
                     readonly type: "rotation-css";
@@ -620,6 +627,7 @@ export declare const sequenceSchemaWithoutFrom: {
                     readonly step: 0.01;
                     readonly default: 1;
                     readonly description: "Scale";
+                    readonly defaultKeyframeOutput: "perceptual-scale";
                 };
                 readonly 'style.rotate': {
                     readonly type: "rotation-css";

package/dist/cjs/interactivity-schema.js

@@ -20,6 +20,7 @@ exports.transformSchema = {
         step: 0.01,
         default: 1,
         description: 'Scale',
+        defaultKeyframeOutput: 'perceptual-scale',
     },
     'style.rotate': {
         type: 'rotation-css',

package/dist/cjs/internals.d.ts

@@ -162,6 +162,7 @@ export declare const Internals: {
                         readonly step: 0.01;
                         readonly default: 1;
                         readonly description: "Scale";
+                        readonly defaultKeyframeOutput: "perceptual-scale";
                     };
                     readonly 'style.rotate': {
                         readonly type: "rotation-css";
@@ -224,6 +225,7 @@ export declare const Internals: {
             readonly step: 0.01;
             readonly default: 1;
             readonly description: "Scale";
+            readonly defaultKeyframeOutput: "perceptual-scale";
         };
         readonly 'style.rotate': {
             readonly type: "rotation-css";
@@ -281,6 +283,7 @@ export declare const Internals: {
             readonly step: 0.01;
             readonly default: 1;
             readonly description: "Scale";
+            readonly defaultKeyframeOutput: "perceptual-scale";
         };
         readonly 'style.rotate': {
             readonly type: "rotation-css";
@@ -417,6 +420,7 @@ export declare const Internals: {
             readonly step: 0.01;
             readonly default: 1;
             readonly description: "Scale";
+            readonly defaultKeyframeOutput: "perceptual-scale";
         };
         readonly 'style.rotate': {
             readonly type: "rotation-css";

package/dist/cjs/interpolate-keyframed-status.js

@@ -58,6 +58,7 @@ const interpolateKeyframedStatus = ({ frame, forceSpringAllowTail, status, }) =>
             easing: easing.map((e) => easingToFn({ easing: e, forceSpringAllowTail })),
             extrapolateLeft: clamping.left,
             extrapolateRight: clamping.right,
+            output: status.output,
             posterize: status.posterize,
         });
     }

package/dist/cjs/interpolate.d.ts

@@ -1,4 +1,5 @@
 export type ExtrapolateType = 'extend' | 'identity' | 'clamp' | 'wrap';
+export type InterpolateOutputOption = 'linear' | 'perceptual-scale';
 /**
  * @description This function allows you to map a range of values to another with a concise syntax
  * @see [Documentation](https://www.remotion.dev/docs/interpolate)
@@ -10,6 +11,7 @@ export type InterpolateOptions = Partial<{
     easing: EasingFunction | readonly EasingFunction[];
     extrapolateLeft: ExtrapolateType;
     extrapolateRight: ExtrapolateType;
+    output: InterpolateOutputOption;
     posterize: number;
 }>;
 type NumericTuple = readonly [number, ...number[]];

package/dist/cjs/interpolate.js

@@ -269,8 +269,20 @@ const serializeStringInterpolationValue = ({ kind, values, units, dimensions, })
         .map((value, index) => `${stringifyNumber(value)}${units[index]}`)
         .join(' ');
 };
+const toSignedArea = (scale) => {
+    if (scale === 0) {
+        return 0;
+    }
+    return Math.sign(scale) * scale * scale;
+};
+const fromSignedArea = (area) => {
+    if (area === 0) {
+        return 0;
+    }
+    return Math.sign(area) * Math.sqrt(Math.abs(area));
+};
 function interpolateFunction(input, inputRange, outputRange, options) {
-    const { extrapolateLeft, extrapolateRight, easing } = options;
+    const { extrapolateLeft, extrapolateRight, easing, output } = options;
     let result = input;
     const [inputMin, inputMax] = inputRange;
     const [outputMin, outputMax] = outputRange;
@@ -312,7 +324,14 @@ function interpolateFunction(input, inputRange, outputRange, options) {
     // Easing
     result = easing(result);
     // Output Range
-    result = result * (outputMax - outputMin) + outputMin;
+    if (output === 'perceptual-scale') {
+        const signedAreaMin = toSignedArea(outputMin);
+        const signedAreaMax = toSignedArea(outputMax);
+        result = fromSignedArea(result * (signedAreaMax - signedAreaMin) + signedAreaMin);
+    }
+    else {
+        result = result * (outputMax - outputMin) + outputMin;
+    }
     return result;
 }
 function findRange(input, inputRange) {
@@ -325,6 +344,9 @@ function findRange(input, inputRange) {
     return i - 1;
 }
 const defaultEasing = (num) => num;
+const resolveOutputOption = (output) => {
+    return output !== null && output !== void 0 ? output : 'linear';
+};
 const shouldExtendRightForEasing = (easing) => {
     return easing.remotionShouldExtendRight === true;
 };
@@ -338,7 +360,7 @@ const resolveEasingForSegment = ({ easing, segmentIndex, }) => {
     // `segmentIndex` is in [0, inputRange.length - 2]; array length was validated above.
     return easing[segmentIndex];
 };
-const interpolateSegment = ({ input, inputRange, outputRange, easing, extrapolateLeft, extrapolateRight, }) => {
+const interpolateSegment = ({ input, inputRange, outputRange, easing, extrapolateLeft, extrapolateRight, output, }) => {
     return interpolateFunction(input, inputRange, outputRange, {
         easing,
         extrapolateLeft,
@@ -347,9 +369,11 @@ const interpolateSegment = ({ input, inputRange, outputRange, easing, extrapolat
             shouldExtendRightForEasing(easing)
             ? 'extend'
             : extrapolateRight,
+        output,
     });
 };
 const interpolateNumber = ({ input, inputRange, outputRange, options, }) => {
+    const output = resolveOutputOption(options === null || options === void 0 ? void 0 : options.output);
     if (inputRange.length === 1) {
         return outputRange[0];
     }
@@ -377,6 +401,7 @@ const interpolateNumber = ({ input, inputRange, outputRange, options, }) => {
         easing,
         extrapolateLeft,
         extrapolateRight,
+        output,
     });
     for (let segmentIndex = 0; segmentIndex < range; segmentIndex++) {
         const previousEasing = resolveEasingForSegment({
@@ -397,6 +422,7 @@ const interpolateNumber = ({ input, inputRange, outputRange, options, }) => {
             easing: previousEasing,
             extrapolateLeft,
             extrapolateRight: 'extend',
+            output,
         });
         result += continuedSegmentValue - outputRange[segmentIndex + 1];
     }
@@ -440,14 +466,18 @@ const interpolateString = ({ input, inputRange, outputRange, options, }) => {
             }
         }
     }
-    return serializeStringInterpolationValue({
-        kind,
-        values: [0, 0, 0].map((_, axis) => interpolateNumber({
+    const values = [0, 0, 0];
+    for (let axis = 0; axis < dimensions; axis++) {
+        values[axis] = interpolateNumber({
             input,
             inputRange,
             outputRange: parsedOutputRange.map((parsed) => parsed.values[axis]),
             options,
-        })),
+        });
+    }
+    return serializeStringInterpolationValue({
+        kind,
+        values,
         units,
         dimensions,
     });
@@ -529,6 +559,14 @@ function assertValidInterpolatePosterizeOption(posterize) {
         throw new Error(`posterize must be a positive finite number, but got ${posterize}`);
     }
 }
+function assertValidInterpolateOutputOption(output) {
+    if (output === undefined ||
+        output === 'linear' ||
+        output === 'perceptual-scale') {
+        return;
+    }
+    throw new Error(`output must be "linear" or "perceptual-scale", but got ${String(output)}`);
+}
 function interpolate(input, inputRange, outputRange, options) {
     if (typeof input === 'undefined') {
         throw new Error('input can not be undefined');
@@ -550,6 +588,7 @@ function interpolate(input, inputRange, outputRange, options) {
     checkValidInputRange(inputRange);
     assertValidInterpolateEasingOption(options === null || options === void 0 ? void 0 : options.easing, inputRange.length);
     assertValidInterpolatePosterizeOption(options === null || options === void 0 ? void 0 : options.posterize);
+    assertValidInterpolateOutputOption(options === null || options === void 0 ? void 0 : options.output);
     if (typeof input !== 'number') {
         throw new TypeError('Cannot interpolate an input which is not a number');
     }

package/dist/cjs/no-react.d.ts

@@ -1,7 +1,7 @@
 export type { ArtifactAsset, AudioOrVideoAsset, InlineAudioAsset, TRenderAsset, } from './CompositionManager';
 export type { DownloadBehavior } from './download-behavior';
 export { assertValidInterpolateEasingOption, assertValidInterpolatePosterizeOption, interpolate, } from './interpolate';
-export type { EasingFunction, ExtrapolateType, InterpolateOptions, } from './interpolate';
+export type { EasingFunction, ExtrapolateType, InterpolateOutputOption, InterpolateOptions, } from './interpolate';
 export { random } from './random.js';
 export type { RandomSeed } from './random.js';
 export type { VideoConfig } from './video-config';
@@ -115,6 +115,7 @@ export declare const NoReactInternals: {
                         readonly step: 0.01;
                         readonly default: 1;
                         readonly description: "Scale";
+                        readonly defaultKeyframeOutput: "perceptual-scale";
                     };
                     readonly 'style.rotate': {
                         readonly type: "rotation-css";

package/dist/cjs/use-schema.d.ts

@@ -1,5 +1,5 @@
 import type { InteractivitySchema } from './interactivity-schema.js';
-import type { ExtrapolateType } from './interpolate.js';
+import type { ExtrapolateType, InterpolateOutputOption } from './interpolate.js';
 import type { CanUpdateSequencePropsResponse, SequencePropsSubscriptionKey } from './SequenceManager.js';
 export type CanUpdateSequencePropStatusStatic = {
     status: 'static';
@@ -45,6 +45,7 @@ export type CanUpdateSequencePropStatusKeyframed = {
     easing: CanUpdateSequencePropStatusEasing[];
     clamping: CanUpdateSequencePropStatusClamping;
     posterize: number | undefined;
+    output: InterpolateOutputOption | undefined;
 };
 export type CanUpdateSequencePropStatusFalse = CanUpdateSequencePropStatusComputed;
 export type CanUpdateSequencePropStatus = CanUpdateSequencePropStatusStatic | CanUpdateSequencePropStatusKeyframed | CanUpdateSequencePropStatusFalse;

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-export declare const VERSION = "4.0.489";
+export declare const VERSION = "4.0.490";

package/dist/cjs/version.js

@@ -7,4 +7,4 @@ exports.VERSION = void 0;
  * @see [Documentation](https://remotion.dev/docs/version)
  * @returns {string} The current version of the remotion package
  */
-exports.VERSION = '4.0.489';
+exports.VERSION = '4.0.490';

package/dist/cjs/with-interactivity-schema.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { SequenceControls } from './CompositionManager.js';
+import type { JsxComponentIdentity, SequenceControls } from './CompositionManager.js';
 import { type InteractivitySchema } from './interactivity-schema.js';
 export declare const getNestedValue: (obj: Record<string, unknown>, key: string) => unknown;
 export declare const getRuntimeValueForSchemaKey: ({ flatSchema, key, props, }: {
@@ -16,12 +16,13 @@ export declare const mergeValues: ({ flatSchema, props, valuesDotNotation, schem
     schemaKeys: string[];
     propsToDelete: Set<string>;
 }) => Record<string, unknown>;
-export declare const withInteractivitySchema: <S extends InteractivitySchema, Props extends object>({ Component, componentName, componentIdentity, schema, supportsEffects, }: {
+export type WithInteractivitySchemaOptions<S extends InteractivitySchema, Props extends object> = {
     Component: React.ComponentType<Props & {
         readonly controls: SequenceControls | undefined;
     }>;
     componentName: string;
-    componentIdentity: string | null;
+    componentIdentity: JsxComponentIdentity | null;
     schema: S;
     supportsEffects: boolean;
-}) => React.ComponentType<Props>;
+};
+export declare const withInteractivitySchema: <S extends InteractivitySchema, Props extends object>({ Component, componentName, componentIdentity, schema, supportsEffects, }: WithInteractivitySchemaOptions<S, Props>) => React.ComponentType<Props>;

package/dist/cjs/wrap-in-schema.d.ts

@@ -1,16 +1,16 @@
 import React from 'react';
 import type { SequenceControls } from './CompositionManager.js';
-import { type SequenceSchema } from './sequence-field-schema.js';
+import { type InteractivitySchema } from './interactivity-schema.js';
 export declare const getNestedValue: (obj: Record<string, unknown>, key: string) => unknown;
 export declare const readValuesFromProps: (props: Record<string, unknown>, keys: string[]) => Record<string, unknown>;
-export declare const selectActiveKeys: (schema: SequenceSchema, values: Record<string, unknown>) => string[];
+export declare const selectActiveKeys: (schema: InteractivitySchema, values: Record<string, unknown>) => string[];
 export declare const mergeValues: ({ props, valuesDotNotation, schemaKeys, propsToDelete, }: {
     props: Record<string, unknown>;
     valuesDotNotation: Record<string, unknown>;
     schemaKeys: string[];
     propsToDelete: Set<string>;
 }) => Record<string, unknown>;
-export declare const wrapInSchema: <S extends SequenceSchema, Props extends object>({ Component, componentIdentity, schema, supportsEffects, }: {
+export declare const wrapInSchema: <S extends InteractivitySchema, Props extends object>({ Component, componentIdentity, schema, supportsEffects, }: {
     Component: React.ComponentType<Props & {
         readonly _experimentalControls: SequenceControls | undefined;
     }>;

package/dist/cjs/wrap-in-schema.js

@@ -38,7 +38,7 @@ const react_1 = __importStar(require("react"));
 const delete_nested_key_js_1 = require("./delete-nested-key.js");
 const use_memoized_effects_js_1 = require("./effects/use-memoized-effects.js");
 const flatten_schema_js_1 = require("./flatten-schema.js");
-const sequence_field_schema_js_1 = require("./sequence-field-schema.js");
+const interactivity_schema_js_1 = require("./interactivity-schema.js");
 const sequence_node_path_js_1 = require("./sequence-node-path.js");
 const SequenceManager_js_1 = require("./SequenceManager.js");
 const use_current_frame_js_1 = require("./use-current-frame.js");
@@ -100,7 +100,7 @@ exports.mergeValues = mergeValues;
 const stackToOverrideMap = {};
 const wrapInSchema = ({ Component, componentIdentity, schema, supportsEffects, }) => {
     // Schema is static for a component, so we move this outside
-    const schemaWithSequenceName = (0, sequence_field_schema_js_1.extendSchemaWithSequenceName)(schema);
+    const schemaWithSequenceName = (0, interactivity_schema_js_1.extendSchemaWithSequenceName)(schema);
     const flatSchema = (0, flatten_schema_js_1.getFlatSchemaWithAllKeys)(schemaWithSequenceName);
     const flatKeys = Object.keys(flatSchema);
     const Wrapped = (0, react_1.forwardRef)((props, ref) => {

package/dist/esm/index.mjs

@@ -965,26 +965,20 @@ var continueRenderInternal = ({
   if (typeof handle !== "number") {
     throw new TypeError("The parameter passed into continueRender() must be the return value of delayRender() which is a number. Got: " + JSON.stringify(handle));
   }
-  scope.remotion_delayRenderHandles = scope.remotion_delayRenderHandles.filter((h) => {
-    if (h === handle) {
-      if (environment.isRendering && scope !== undefined) {
-        if (!scope.remotion_delayRenderTimeouts[handle]) {
-          return false;
-        }
-        const { label: label2, startTime, timeout } = scope.remotion_delayRenderTimeouts[handle];
-        clearTimeout(timeout);
-        const message = [
-          label2 ? `"${label2}"` : "A handle",
-          DELAY_RENDER_CLEAR_TOKEN,
-          `${Date.now() - startTime}ms`
-        ].filter(truthy).join(" ");
-        Log.verbose({ logLevel, tag: "delayRender()" }, message);
-        delete scope.remotion_delayRenderTimeouts[handle];
-      }
-      return false;
-    }
-    return true;
-  });
+  const handleExists = scope.remotion_delayRenderHandles.includes(handle);
+  const timeoutEntry = scope.remotion_delayRenderTimeouts[handle];
+  if (handleExists && environment.isRendering && timeoutEntry) {
+    const { label: label2, startTime, timeout } = timeoutEntry;
+    clearTimeout(timeout);
+    const message = [
+      label2 ? `"${label2}"` : "A handle",
+      DELAY_RENDER_CLEAR_TOKEN,
+      `${Date.now() - startTime}ms`
+    ].filter(truthy).join(" ");
+    Log.verbose({ logLevel, tag: "delayRender()" }, message);
+    delete scope.remotion_delayRenderTimeouts[handle];
+  }
+  scope.remotion_delayRenderHandles = scope.remotion_delayRenderHandles.filter((h) => h !== handle);
   if (scope.remotion_delayRenderHandles.length === 0) {
     scope.remotion_renderReady = true;
   }
@@ -1291,7 +1285,7 @@ var addSequenceStackTraces = (component) => {
 };
 
 // src/version.ts
-var VERSION = "4.0.489";
+var VERSION = "4.0.490";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -1731,7 +1725,8 @@ var transformSchema = {
     max: 100,
     step: 0.01,
     default: 1,
-    description: "Scale"
+    description: "Scale",
+    defaultKeyframeOutput: "perceptual-scale"
   },
   "style.rotate": {
     type: "rotation-css",
@@ -2562,8 +2557,20 @@ var serializeStringInterpolationValue = ({
   }
   return values.slice(0, dimensions).map((value, index) => `${stringifyNumber(value)}${units[index]}`).join(" ");
 };
+var toSignedArea = (scale) => {
+  if (scale === 0) {
+    return 0;
+  }
+  return Math.sign(scale) * scale * scale;
+};
+var fromSignedArea = (area) => {
+  if (area === 0) {
+    return 0;
+  }
+  return Math.sign(area) * Math.sqrt(Math.abs(area));
+};
 function interpolateFunction(input, inputRange, outputRange, options) {
-  const { extrapolateLeft, extrapolateRight, easing } = options;
+  const { extrapolateLeft, extrapolateRight, easing, output } = options;
   let result = input;
   const [inputMin, inputMax] = inputRange;
   const [outputMin, outputMax] = outputRange;
@@ -2594,7 +2601,13 @@ function interpolateFunction(input, inputRange, outputRange, options) {
   }
   result = (result - inputMin) / (inputMax - inputMin);
   result = easing(result);
-  result = result * (outputMax - outputMin) + outputMin;
+  if (output === "perceptual-scale") {
+    const signedAreaMin = toSignedArea(outputMin);
+    const signedAreaMax = toSignedArea(outputMax);
+    result = fromSignedArea(result * (signedAreaMax - signedAreaMin) + signedAreaMin);
+  } else {
+    result = result * (outputMax - outputMin) + outputMin;
+  }
   return result;
 }
 function findRange(input, inputRange) {
@@ -2607,6 +2620,9 @@ function findRange(input, inputRange) {
   return i - 1;
 }
 var defaultEasing = (num) => num;
+var resolveOutputOption = (output) => {
+  return output ?? "linear";
+};
 var shouldExtendRightForEasing = (easing) => {
   return easing.remotionShouldExtendRight === true;
 };
@@ -2628,12 +2644,14 @@ var interpolateSegment = ({
   outputRange,
   easing,
   extrapolateLeft,
-  extrapolateRight
+  extrapolateRight,
+  output
 }) => {
   return interpolateFunction(input, inputRange, outputRange, {
     easing,
     extrapolateLeft,
-    extrapolateRight: input > inputRange[1] && extrapolateRight === "clamp" && shouldExtendRightForEasing(easing) ? "extend" : extrapolateRight
+    extrapolateRight: input > inputRange[1] && extrapolateRight === "clamp" && shouldExtendRightForEasing(easing) ? "extend" : extrapolateRight,
+    output
   });
 };
 var interpolateNumber = ({
@@ -2642,6 +2660,7 @@ var interpolateNumber = ({
   outputRange,
   options
 }) => {
+  const output = resolveOutputOption(options?.output);
   if (inputRange.length === 1) {
     return outputRange[0];
   }
@@ -2666,7 +2685,8 @@ var interpolateNumber = ({
     outputRange: [outputRange[range], outputRange[range + 1]],
     easing,
     extrapolateLeft,
-    extrapolateRight
+    extrapolateRight,
+    output
   });
   for (let segmentIndex = 0;segmentIndex < range; segmentIndex++) {
     const previousEasing = resolveEasingForSegment({
@@ -2686,7 +2706,8 @@ var interpolateNumber = ({
       outputRange: [outputRange[segmentIndex], outputRange[segmentIndex + 1]],
       easing: previousEasing,
       extrapolateLeft,
-      extrapolateRight: "extend"
+      extrapolateRight: "extend",
+      output
     });
     result += continuedSegmentValue - outputRange[segmentIndex + 1];
   }
@@ -2734,14 +2755,18 @@ var interpolateString = ({
       }
     }
   }
-  return serializeStringInterpolationValue({
-    kind,
-    values: [0, 0, 0].map((_, axis) => interpolateNumber({
+  const values = [0, 0, 0];
+  for (let axis = 0;axis < dimensions; axis++) {
+    values[axis] = interpolateNumber({
       input,
       inputRange,
       outputRange: parsedOutputRange.map((parsed) => parsed.values[axis]),
       options
-    })),
+    });
+  }
+  return serializeStringInterpolationValue({
+    kind,
+    values,
     units,
     dimensions
   });
@@ -2825,6 +2850,12 @@ function assertValidInterpolatePosterizeOption(posterize) {
     throw new Error(`posterize must be a positive finite number, but got ${posterize}`);
   }
 }
+function assertValidInterpolateOutputOption(output) {
+  if (output === undefined || output === "linear" || output === "perceptual-scale") {
+    return;
+  }
+  throw new Error(`output must be "linear" or "perceptual-scale", but got ${String(output)}`);
+}
 function interpolate(input, inputRange, outputRange, options) {
   if (typeof input === "undefined") {
     throw new Error("input can not be undefined");
@@ -2842,6 +2873,7 @@ function interpolate(input, inputRange, outputRange, options) {
   checkValidInputRange(inputRange);
   assertValidInterpolateEasingOption(options?.easing, inputRange.length);
   assertValidInterpolatePosterizeOption(options?.posterize);
+  assertValidInterpolateOutputOption(options?.output);
   if (typeof input !== "number") {
     throw new TypeError("Cannot interpolate an input which is not a number");
   }
@@ -3802,6 +3834,7 @@ var interpolateKeyframedStatus = ({
       easing: easing.map((e) => easingToFn({ easing: e, forceSpringAllowTail })),
       extrapolateLeft: clamping.left,
       extrapolateRight: clamping.right,
+      output: status.output,
       posterize: status.posterize
     });
   } catch {
@@ -4051,7 +4084,7 @@ var getFlatSchemaWithAllKeys = (schema) => {
   const out = {};
   const addKey = (key, field) => {
     if (key in out) {
-      throw new Error(`Duplicate key "${key}" in schema: discriminated union variants must not share keys`);
+      return;
     }
     out[key] = field;
   };
@@ -10249,6 +10282,22 @@ addSequenceStackTraces(Img);
 // src/Interactive.tsx
 import React29, { forwardRef as forwardRef12, useCallback as useCallback20, useRef as useRef25 } from "react";
 import { jsx as jsx29 } from "react/jsx-runtime";
+var sourcePathToIdentityPrefix = (packageName) => {
+  if (packageName === "remotion") {
+    return "dev.remotion.remotion";
+  }
+  if (packageName.startsWith("@remotion/")) {
+    const normalizedPackageName = packageName.slice("@remotion/".length).replace(/-([a-z])/g, (_, char) => char.toUpperCase());
+    return `dev.remotion.${normalizedPackageName}`;
+  }
+  throw new Error(`Unsupported Remotion package name: ${packageName}`);
+};
+var makeRemotionComponentIdentity = ({
+  packageName,
+  componentName
+}) => {
+  return `${sourcePathToIdentityPrefix(packageName)}.${componentName}`;
+};
 var interactiveElementSchema = {
   ...baseSchema,
   ...transformSchema,
@@ -10262,6 +10311,11 @@ var setRef = (ref, value) => {
     ref.current = value;
   }
 };
+var withSchema = (options) => {
+  const Wrapped = withInteractivitySchema(options);
+  addSequenceStackTraces(Wrapped);
+  return Wrapped;
+};
 var makeInteractiveElement = (tag, displayName) => {
   const Inner = forwardRef12((propsWithControls, ref) => {
     const {
@@ -10301,15 +10355,17 @@ var makeInteractiveElement = (tag, displayName) => {
     });
   });
   Inner.displayName = displayName;
-  const Wrapped = withInteractivitySchema({
+  const Wrapped = withSchema({
     Component: Inner,
     componentName: displayName,
-    componentIdentity: `dev.remotion.remotion.${displayName.slice(1, -1)}`,
+    componentIdentity: makeRemotionComponentIdentity({
+      packageName: "remotion",
+      componentName: displayName.slice(1, -1)
+    }),
     schema: interactiveElementSchema,
     supportsEffects: false
   });
   Wrapped.displayName = displayName;
-  addSequenceStackTraces(Wrapped);
   return Wrapped;
 };
 var Interactive = {
@@ -10318,7 +10374,8 @@ var Interactive = {
   textSchema,
   premountSchema,
   sequenceSchema,
-  withSchema: withInteractivitySchema,
+  withSchema,
+  _internalMakeRemotionComponentIdentity: makeRemotionComponentIdentity,
   A: makeInteractiveElement("a", "<Interactive.A>"),
   Article: makeInteractiveElement("article", "<Interactive.Article>"),
   Aside: makeInteractiveElement("aside", "<Interactive.Aside>"),

package/dist/esm/no-react.mjs

@@ -251,8 +251,20 @@ var serializeStringInterpolationValue = ({
   }
   return values.slice(0, dimensions).map((value, index) => `${stringifyNumber(value)}${units[index]}`).join(" ");
 };
+var toSignedArea = (scale) => {
+  if (scale === 0) {
+    return 0;
+  }
+  return Math.sign(scale) * scale * scale;
+};
+var fromSignedArea = (area) => {
+  if (area === 0) {
+    return 0;
+  }
+  return Math.sign(area) * Math.sqrt(Math.abs(area));
+};
 function interpolateFunction(input, inputRange, outputRange, options) {
-  const { extrapolateLeft, extrapolateRight, easing } = options;
+  const { extrapolateLeft, extrapolateRight, easing, output } = options;
   let result = input;
   const [inputMin, inputMax] = inputRange;
   const [outputMin, outputMax] = outputRange;
@@ -283,7 +295,13 @@ function interpolateFunction(input, inputRange, outputRange, options) {
   }
   result = (result - inputMin) / (inputMax - inputMin);
   result = easing(result);
-  result = result * (outputMax - outputMin) + outputMin;
+  if (output === "perceptual-scale") {
+    const signedAreaMin = toSignedArea(outputMin);
+    const signedAreaMax = toSignedArea(outputMax);
+    result = fromSignedArea(result * (signedAreaMax - signedAreaMin) + signedAreaMin);
+  } else {
+    result = result * (outputMax - outputMin) + outputMin;
+  }
   return result;
 }
 function findRange(input, inputRange) {
@@ -296,6 +314,9 @@ function findRange(input, inputRange) {
   return i - 1;
 }
 var defaultEasing = (num) => num;
+var resolveOutputOption = (output) => {
+  return output ?? "linear";
+};
 var shouldExtendRightForEasing = (easing) => {
   return easing.remotionShouldExtendRight === true;
 };
@@ -317,12 +338,14 @@ var interpolateSegment = ({
   outputRange,
   easing,
   extrapolateLeft,
-  extrapolateRight
+  extrapolateRight,
+  output
 }) => {
   return interpolateFunction(input, inputRange, outputRange, {
     easing,
     extrapolateLeft,
-    extrapolateRight: input > inputRange[1] && extrapolateRight === "clamp" && shouldExtendRightForEasing(easing) ? "extend" : extrapolateRight
+    extrapolateRight: input > inputRange[1] && extrapolateRight === "clamp" && shouldExtendRightForEasing(easing) ? "extend" : extrapolateRight,
+    output
   });
 };
 var interpolateNumber = ({
@@ -331,6 +354,7 @@ var interpolateNumber = ({
   outputRange,
   options
 }) => {
+  const output = resolveOutputOption(options?.output);
   if (inputRange.length === 1) {
     return outputRange[0];
   }
@@ -355,7 +379,8 @@ var interpolateNumber = ({
     outputRange: [outputRange[range], outputRange[range + 1]],
     easing,
     extrapolateLeft,
-    extrapolateRight
+    extrapolateRight,
+    output
   });
   for (let segmentIndex = 0;segmentIndex < range; segmentIndex++) {
     const previousEasing = resolveEasingForSegment({
@@ -375,7 +400,8 @@ var interpolateNumber = ({
       outputRange: [outputRange[segmentIndex], outputRange[segmentIndex + 1]],
       easing: previousEasing,
       extrapolateLeft,
-      extrapolateRight: "extend"
+      extrapolateRight: "extend",
+      output
     });
     result += continuedSegmentValue - outputRange[segmentIndex + 1];
   }
@@ -423,14 +449,18 @@ var interpolateString = ({
       }
     }
   }
-  return serializeStringInterpolationValue({
-    kind,
-    values: [0, 0, 0].map((_, axis) => interpolateNumber({
+  const values = [0, 0, 0];
+  for (let axis = 0;axis < dimensions; axis++) {
+    values[axis] = interpolateNumber({
       input,
       inputRange,
       outputRange: parsedOutputRange.map((parsed) => parsed.values[axis]),
       options
-    })),
+    });
+  }
+  return serializeStringInterpolationValue({
+    kind,
+    values,
     units,
     dimensions
   });
@@ -514,6 +544,12 @@ function assertValidInterpolatePosterizeOption(posterize) {
     throw new Error(`posterize must be a positive finite number, but got ${posterize}`);
   }
 }
+function assertValidInterpolateOutputOption(output) {
+  if (output === undefined || output === "linear" || output === "perceptual-scale") {
+    return;
+  }
+  throw new Error(`output must be "linear" or "perceptual-scale", but got ${String(output)}`);
+}
 function interpolate(input, inputRange, outputRange, options) {
   if (typeof input === "undefined") {
     throw new Error("input can not be undefined");
@@ -531,6 +567,7 @@ function interpolate(input, inputRange, outputRange, options) {
   checkValidInputRange(inputRange);
   assertValidInterpolateEasingOption(options?.easing, inputRange.length);
   assertValidInterpolatePosterizeOption(options?.posterize);
+  assertValidInterpolateOutputOption(options?.output);
   if (typeof input !== "number") {
     throw new TypeError("Cannot interpolate an input which is not a number");
   }
@@ -705,7 +742,8 @@ var transformSchema = {
     max: 100,
     step: 0.01,
     default: 1,
-    description: "Scale"
+    description: "Scale",
+    defaultKeyframeOutput: "perceptual-scale"
   },
   "style.rotate": {
     type: "rotation-css",

package/dist/esm/version.mjs

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "4.0.489";
+var VERSION = "4.0.490";
 export {
   VERSION
 };

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/core"
 	},
 	"name": "remotion",
-	"version": "4.0.489",
+	"version": "4.0.490",
 	"description": "Make videos programmatically",
 	"main": "dist/cjs/index.js",
 	"types": "dist/cjs/index.d.ts",
@@ -35,7 +35,7 @@
 		"react-dom": "19.2.3",
 		"webpack": "5.105.0",
 		"zod": "4.3.6",
-		"@remotion/eslint-config-internal": "4.0.489",
+		"@remotion/eslint-config-internal": "4.0.490",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},

package/dist/cjs/interpolate-translate.d.ts

@@ -1,8 +0,0 @@
-import { type InterpolateOptions } from './interpolate.js';
-export type InterpolateTranslateOptions = InterpolateOptions;
-export declare const interpolateTranslate: (input: number, inputRange: readonly number[], outputRange: readonly string[], options?: Partial<{
-    easing: import("./interpolate.js").EasingFunction | readonly import("./interpolate.js").EasingFunction[];
-    extrapolateLeft: import("./interpolate.js").ExtrapolateType;
-    extrapolateRight: import("./interpolate.js").ExtrapolateType;
-    posterize: number;
-}> | undefined) => string;

package/dist/cjs/interpolate-translate.js

@@ -1,70 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.interpolateTranslate = void 0;
-const interpolate_js_1 = require("./interpolate.js");
-const pixelValueRegex = /^([+-]?(?:\d+\.?\d*|\.\d+))px$/;
-const parseTranslate = (value) => {
-    if (typeof value !== 'string') {
-        throw new TypeError(`outputRange must contain only strings, but got ${typeof value}`);
-    }
-    const parts = value.trim().split(/\s+/);
-    if (parts.length < 1 || parts.length > 3 || parts[0] === '') {
-        throw new TypeError(`translate values must contain 1 to 3 pixel values, but got "${value}"`);
-    }
-    return parts.map((part) => {
-        const match = pixelValueRegex.exec(part);
-        if (match === null) {
-            throw new TypeError(`interpolateTranslate() only supports px values, but got "${part}" in "${value}"`);
-        }
-        return Number(match[1]);
-    });
-};
-/*
- * @description Allows you to map a range of values to CSS translate values using pixel units.
- * @see [Documentation](https://remotion.dev/docs/interpolate-translate)
- */
-const interpolateTranslate = (input, inputRange, outputRange, options) => {
-    var _a;
-    if (typeof input === 'undefined') {
-        throw new TypeError('input can not be undefined');
-    }
-    if (typeof inputRange === 'undefined') {
-        throw new TypeError('inputRange can not be undefined');
-    }
-    if (typeof outputRange === 'undefined') {
-        throw new TypeError('outputRange can not be undefined');
-    }
-    if (inputRange.length !== outputRange.length) {
-        throw new TypeError('inputRange (' +
-            inputRange.length +
-            ' values provided) and outputRange (' +
-            outputRange.length +
-            ' values provided) must have the same length');
-    }
-    const parsedOutputRange = outputRange.map((translateValue) => parseTranslate(translateValue));
-    const firstValueLength = (_a = parsedOutputRange[0]) === null || _a === void 0 ? void 0 : _a.length;
-    if (firstValueLength === undefined) {
-        throw new TypeError('outputRange must have at least 1 element');
-    }
-    for (const parsedTranslate of parsedOutputRange) {
-        if (parsedTranslate.length !== firstValueLength) {
-            throw new TypeError(`All translate values must have the same number of pixel values, but got ${firstValueLength} and ${parsedTranslate.length}`);
-        }
-    }
-    return new Array(firstValueLength)
-        .fill(true)
-        .map((_, index) => {
-        const outputValues = [];
-        for (const translateValue of parsedOutputRange) {
-            const value = translateValue[index];
-            if (value === undefined) {
-                throw new TypeError(`All translate values must have the same number of pixel values, but got ${firstValueLength} and ${translateValue.length}`);
-            }
-            outputValues.push(value);
-        }
-        const interpolatedValue = (0, interpolate_js_1.interpolate)(input, inputRange, outputValues, options);
-        return `${interpolatedValue}px`;
-    })
-        .join(' ');
-};
-exports.interpolateTranslate = interpolateTranslate;