remotion 4.0.507 → 4.0.508

package/dist/cjs/SequenceManager.d.ts

@@ -22,12 +22,18 @@ export type VisualModeDragOverrides = {
     getDragOverrides: GetDragOverrides;
     getEffectDragOverrides: GetEffectDragOverrides;
 };
+export type SequencePropsStatusRemapping = {
+    previousNodePath: SequencePropsSubscriptionKey;
+    nodePath: SequencePropsSubscriptionKey | null;
+    result: CanUpdateSequencePropsResponse | null;
+};
 export type VisualModeSetters = {
     setDragOverrides: (nodePath: SequencePropsSubscriptionKey, key: string, value: DragOverrideValue) => void;
     clearDragOverrides: (nodePath: SequencePropsSubscriptionKey) => void;
     setEffectDragOverrides: (nodePath: SequencePropsSubscriptionKey, effectIndex: number, key: string, value: DragOverrideValue) => void;
     clearEffectDragOverrides: (nodePath: SequencePropsSubscriptionKey, effectIndex: number) => void;
     setPropStatuses: (nodePath: SequencePropsSubscriptionKey, values: (prev: CanUpdateSequencePropsResponse) => CanUpdateSequencePropsResponse) => void;
+    remapPropStatuses: (remappings: readonly SequencePropsStatusRemapping[]) => void;
 };
 export type CanUpdateEffectPropsResponseTrue = {
     canUpdate: true;

package/dist/cjs/SequenceManager.js

@@ -82,6 +82,9 @@ exports.VisualModeSettersContext = react_1.default.createContext({
     setPropStatuses: () => {
         throw new Error('VisualModeSettersContext not initialized');
     },
+    remapPropStatuses: () => {
+        throw new Error('VisualModeSettersContext not initialized');
+    },
 });
 const effectDragOverridesKey = (nodePath, effectIndex) => `${(0, exports.makeSequencePropsSubscriptionKey)(nodePath)}.effects.${effectIndex}`;
 const SequenceManagerProvider = ({ children }) => {
@@ -149,6 +152,21 @@ const SequenceManagerProvider = ({ children }) => {
             return { ...prev, [key]: newKey };
         });
     }, []);
+    const remapPropStatuses = (0, react_1.useCallback)((remappings) => {
+        setPropStatusesMapState((prev) => {
+            const next = { ...prev };
+            for (const remapping of remappings) {
+                delete next[(0, exports.makeSequencePropsSubscriptionKey)(remapping.previousNodePath)];
+            }
+            for (const remapping of remappings) {
+                if (remapping.nodePath !== null && remapping.result !== null) {
+                    next[(0, exports.makeSequencePropsSubscriptionKey)(remapping.nodePath)] =
+                        remapping.result;
+                }
+            }
+            return next;
+        });
+    }, []);
     const registerSequence = (0, react_1.useCallback)((seq) => {
         setSequences((seqs) => {
             return [...seqs, seq];
@@ -190,6 +208,7 @@ const SequenceManagerProvider = ({ children }) => {
             setEffectDragOverrides,
             clearEffectDragOverrides,
             setPropStatuses,
+            remapPropStatuses,
         };
     }, [
         setDragOverrides,
@@ -197,6 +216,7 @@ const SequenceManagerProvider = ({ children }) => {
         setEffectDragOverrides,
         clearEffectDragOverrides,
         setPropStatuses,
+        remapPropStatuses,
     ]);
     return (jsx_runtime_1.jsx(exports.SequenceManagerRefContext.Provider, { value: sequencesRef, children: jsx_runtime_1.jsx(exports.SequenceManager.Provider, { value: sequenceContext, children: jsx_runtime_1.jsx(exports.VisualModePropStatusesRefContext.Provider, { value: propStatusesRef, children: jsx_runtime_1.jsx(exports.VisualModePropStatusesContext.Provider, { value: propStatusesContext, children: jsx_runtime_1.jsx(exports.VisualModeDragOverridesContext.Provider, { value: dragOverridesContext, children: jsx_runtime_1.jsx(exports.VisualModeSettersContext.Provider, { value: settersContext, children: children }) }) }) }) }) }));
 };

package/dist/cjs/internals.d.ts

@@ -14,7 +14,7 @@ import type { OverrideIdToNodePaths, OverrideToNodePathGetters, OverrideToNodeSe
 import { OverrideIdsToNodePathsGettersContext, OverrideIdsToNodePathsSettersContext } from './sequence-node-path.js';
 import type { ResolvedStackLocation } from './sequence-stack-traces.js';
 import type { CannotUpdateSequenceReason } from './SequenceManager.js';
-import { type CanUpdateEffectPropsResponse, type CanUpdateEffectPropsResponseFalse, type CanUpdateEffectPropsResponseTrue, type CanUpdateSequencePropsResponse, type CanUpdateSequencePropsResponseFalse, type CanUpdateSequencePropsResponseTrue, type SequenceNodePath, type SequencePropsSubscriptionKey, type VideoConfigValues } from './SequenceManager.js';
+import { type CanUpdateEffectPropsResponse, type CanUpdateEffectPropsResponseFalse, type CanUpdateEffectPropsResponseTrue, type CanUpdateSequencePropsResponse, type CanUpdateSequencePropsResponseFalse, type CanUpdateSequencePropsResponseTrue, type SequenceNodePath, type SequencePropsSubscriptionKey, type SequencePropsStatusRemapping, type VideoConfigValues } from './SequenceManager.js';
 import * as TimelinePosition from './timeline-position-state.js';
 import { type PlaybackRateContextValue, type SetTimelineContextValue, type TimelineImperativeContextValue, type TimelineContextValue } from './TimelineContext.js';
 import { truthy } from './truthy.js';
@@ -1273,4 +1273,4 @@ export declare const Internals: {
         readonly componentName: string;
     }) => import("react").CSSProperties | null;
 };
-export type { ArrayFieldSchema, AssetFieldSchema, ArrayItemFieldSchema, CannotUpdateSequenceReason, CanUpdateEffectPropsResponse, CanUpdateEffectPropsResponseFalse, CanUpdateEffectPropsResponseTrue, CanUpdateSequencePropsResponse, CanUpdateSequencePropsResponseFalse, CanUpdateSequencePropsResponseTrue, CanUpdateSequencePropStatus, CanUpdateSequencePropStatusEasing, CanUpdateSequencePropStatusFalse, CanUpdateSequencePropStatusKeyframed, CanUpdateSequencePropStatusStatic, VideoConfigNumericExpression, CompositionManagerContext, CompProps, DragOverrides, DragOverrideValue, EffectDragOverrides, GetDragOverrides, GetEffectDragOverrides, GetEffectPropStatuses, GetPropStatuses, JsxComponentIdentity, LoggingContextValue, MediaVolumeContextValue, NonceHistory, OverrideIdsToNodePathsGettersContext, OverrideIdsToNodePathsSettersContext, OverrideIdToNodePaths, OverrideToNodePathGetters, OverrideToNodeSetters, PlaybackRateContextValue, PropStatuses, RemotionAudioContextState, RemotionEnvironment, ResolvedStackLocation, ScheduleAudioNodeOptions, ScheduleAudioNodeResult, InteractivitySchemaField, SequenceNodePath, SequencePropsSubscriptionKey, VideoConfigValues, InteractivitySchema, SerializedJSONWithCustomFields, SetMediaVolumeContextValue, SetTimelineContextValue, TCompMetadata, TComposition, TimelineContextValue, TimelineImperativeContextValue, TRenderAsset, TSequence, VisibleFieldSchema, WatchRemotionStaticFilesPayload, };
+export type { ArrayFieldSchema, AssetFieldSchema, ArrayItemFieldSchema, CannotUpdateSequenceReason, CanUpdateEffectPropsResponse, CanUpdateEffectPropsResponseFalse, CanUpdateEffectPropsResponseTrue, CanUpdateSequencePropsResponse, CanUpdateSequencePropsResponseFalse, CanUpdateSequencePropsResponseTrue, CanUpdateSequencePropStatus, CanUpdateSequencePropStatusEasing, CanUpdateSequencePropStatusFalse, CanUpdateSequencePropStatusKeyframed, CanUpdateSequencePropStatusStatic, VideoConfigNumericExpression, CompositionManagerContext, CompProps, DragOverrides, DragOverrideValue, EffectDragOverrides, GetDragOverrides, GetEffectDragOverrides, GetEffectPropStatuses, GetPropStatuses, JsxComponentIdentity, LoggingContextValue, MediaVolumeContextValue, NonceHistory, OverrideIdsToNodePathsGettersContext, OverrideIdsToNodePathsSettersContext, OverrideIdToNodePaths, OverrideToNodePathGetters, OverrideToNodeSetters, PlaybackRateContextValue, PropStatuses, RemotionAudioContextState, RemotionEnvironment, ResolvedStackLocation, ScheduleAudioNodeOptions, ScheduleAudioNodeResult, InteractivitySchemaField, SequenceNodePath, SequencePropsSubscriptionKey, SequencePropsStatusRemapping, VideoConfigValues, InteractivitySchema, SerializedJSONWithCustomFields, SetMediaVolumeContextValue, SetTimelineContextValue, TCompMetadata, TComposition, TimelineContextValue, TimelineImperativeContextValue, TRenderAsset, TSequence, VisibleFieldSchema, WatchRemotionStaticFilesPayload, };

package/dist/cjs/interpolate.js

@@ -206,9 +206,49 @@ const parseTransformOriginValue = (output, parts) => {
         });
     return {
         kind: 'translate',
-        values: [x.value, y.value, z.value],
-        units: [x.unit, y.unit, z.unit],
+        values: [x.value, y.value, z.value, 0],
+        units: [x.unit, y.unit, z.unit, null],
         dimensions: parts[2] === undefined ? 2 : 3,
+        axisRotation: false,
+    };
+};
+const parseAxisRotationValue = (output) => {
+    const parts = output.trim().split(/\s+/);
+    const keywordAxis = parts.length === 2 ? parts[0].toLowerCase() : null;
+    if (keywordAxis === 'x' || keywordAxis === 'y' || keywordAxis === 'z') {
+        const keywordAngle = parseStringInterpolationComponent(parts[1], output);
+        if (keywordAngle.kind !== 'rotate') {
+            return null;
+        }
+        return {
+            kind: 'rotate',
+            values: keywordAxis === 'x'
+                ? [1, 0, 0, keywordAngle.value]
+                : keywordAxis === 'y'
+                    ? [0, 1, 0, keywordAngle.value]
+                    : [0, 0, 1, keywordAngle.value],
+            units: [null, null, null, keywordAngle.unit],
+            dimensions: 4,
+            axisRotation: true,
+        };
+    }
+    if (parts.length !== 4) {
+        return null;
+    }
+    const axis = parts.slice(0, 3).map(Number);
+    if (!axis.every(Number.isFinite)) {
+        return null;
+    }
+    const vectorAngle = parseStringInterpolationComponent(parts[3], output);
+    if (vectorAngle.kind !== 'rotate') {
+        return null;
+    }
+    return {
+        kind: 'rotate',
+        values: [axis[0], axis[1], axis[2], vectorAngle.value],
+        units: [null, null, null, vectorAngle.unit],
+        dimensions: 4,
+        axisRotation: true,
     };
 };
 const parseStringInterpolationValue = (output) => {
@@ -220,11 +260,16 @@ const parseStringInterpolationValue = (output) => {
         }
         return {
             kind: 'scale',
-            values: [output, output, 1],
-            units: [null, null, null],
+            values: [output, output, 1, 0],
+            units: [null, null, null, null],
             dimensions: 1,
+            axisRotation: false,
         };
     }
+    const axisRotation = parseAxisRotationValue(output);
+    if (axisRotation !== null) {
+        return axisRotation;
+    }
     const parts = output.trim().split(/\s+/);
     if (parts.length < 1 || parts.length > 3 || parts[0] === '') {
         throw new TypeError(`String outputRange values must contain 1 to 3 components, but got "${output}"`);
@@ -245,19 +290,29 @@ const parseStringInterpolationValue = (output) => {
         const z = (_h = (_b = parsed[2]) === null || _b === void 0 ? void 0 : _b.value) !== null && _h !== void 0 ? _h : 1;
         return {
             kind,
-            values: [x, y, z],
-            units: [null, null, null],
+            values: [x, y, z, 0],
+            units: [null, null, null, null],
             dimensions: parsed.length,
+            axisRotation: false,
         };
     }
     return {
         kind,
-        values: [parsed[0].value, (_j = (_c = parsed[1]) === null || _c === void 0 ? void 0 : _c.value) !== null && _j !== void 0 ? _j : 0, (_k = (_d = parsed[2]) === null || _d === void 0 ? void 0 : _d.value) !== null && _k !== void 0 ? _k : 0],
-        units: [parsed[0].unit, (_l = (_e = parsed[1]) === null || _e === void 0 ? void 0 : _e.unit) !== null && _l !== void 0 ? _l : null, (_m = (_f = parsed[2]) === null || _f === void 0 ? void 0 : _f.unit) !== null && _m !== void 0 ? _m : null],
+        values: [parsed[0].value, (_j = (_c = parsed[1]) === null || _c === void 0 ? void 0 : _c.value) !== null && _j !== void 0 ? _j : 0, (_k = (_d = parsed[2]) === null || _d === void 0 ? void 0 : _d.value) !== null && _k !== void 0 ? _k : 0, 0],
+        units: [
+            parsed[0].unit,
+            (_l = (_e = parsed[1]) === null || _e === void 0 ? void 0 : _e.unit) !== null && _l !== void 0 ? _l : null,
+            (_m = (_f = parsed[2]) === null || _f === void 0 ? void 0 : _f.unit) !== null && _m !== void 0 ? _m : null,
+            null,
+        ],
         dimensions: parsed.length,
+        axisRotation: false,
     };
 };
-const serializeStringInterpolationValue = ({ kind, values, units, dimensions, }) => {
+const serializeStringInterpolationValue = ({ kind, values, units, dimensions, axisRotation, }) => {
+    if (axisRotation) {
+        return `${stringifyNumber(values[0])} ${stringifyNumber(values[1])} ${stringifyNumber(values[2])} ${stringifyNumber(values[3])}${units[3]}`;
+    }
     if (kind === 'scale') {
         return values
             .slice(0, dimensions)
@@ -430,7 +485,28 @@ const interpolateNumber = ({ input, inputRange, outputRange, options, }) => {
 };
 const interpolateString = ({ input, inputRange, outputRange, options, }) => {
     var _a;
-    const parsedOutputRange = outputRange.map(parseStringInterpolationValue);
+    const initiallyParsedOutputRange = outputRange.map(parseStringInterpolationValue);
+    const hasAxisRotation = initiallyParsedOutputRange.some((parsed) => parsed.axisRotation);
+    const parsedOutputRange = hasAxisRotation
+        ? initiallyParsedOutputRange.map((parsed) => {
+            if (parsed.kind !== 'rotate') {
+                return parsed;
+            }
+            if (parsed.axisRotation) {
+                return parsed;
+            }
+            if (parsed.dimensions !== 1) {
+                throw new TypeError('Cannot interpolate a multi-angle rotate value with an axis rotation');
+            }
+            return {
+                kind: 'rotate',
+                values: [0, 0, 1, parsed.values[0]],
+                units: [null, null, null, parsed.units[0]],
+                dimensions: 4,
+                axisRotation: true,
+            };
+        })
+        : initiallyParsedOutputRange;
     const kind = (_a = parsedOutputRange[0]) === null || _a === void 0 ? void 0 : _a.kind;
     if (kind === undefined) {
         throw new Error('outputRange must have at least 1 element');
@@ -445,9 +521,13 @@ const interpolateString = ({ input, inputRange, outputRange, options, }) => {
         null,
         null,
         null,
+        null,
     ];
     if (kind !== 'scale') {
         for (let axis = 0; axis < dimensions; axis++) {
+            if (hasAxisRotation && axis < 3) {
+                continue;
+            }
             for (const parsed of parsedOutputRange) {
                 const unit = parsed.units[axis];
                 if (unit === null) {
@@ -466,7 +546,7 @@ const interpolateString = ({ input, inputRange, outputRange, options, }) => {
             }
         }
     }
-    const values = [0, 0, 0];
+    const values = [0, 0, 0, 0];
     for (let axis = 0; axis < dimensions; axis++) {
         values[axis] = interpolateNumber({
             input,
@@ -480,6 +560,7 @@ const interpolateString = ({ input, inputRange, outputRange, options, }) => {
         values,
         units,
         dimensions,
+        axisRotation: hasAxisRotation,
     });
 };
 const validateTupleOutputRange = (outputRange) => {

package/dist/cjs/sequence-node-path.d.ts

@@ -4,7 +4,7 @@ export type OverrideToNodePathGetters = {
     overrideIdToNodePathMappings: OverrideIdToNodePaths;
 };
 export type OverrideToNodeSetters = {
-    setOverrideIdToNodePath: (overrideId: string, nodePath: SequencePropsSubscriptionKey) => void;
+    setOverrideIdToNodePath: (overrideId: string, nodePath: SequencePropsSubscriptionKey | null) => void;
 };
 export declare const OverrideIdsToNodePathsGettersContext: import("react").Context<OverrideToNodePathGetters>;
 export declare const OverrideIdsToNodePathsSettersContext: import("react").Context<OverrideToNodeSetters>;

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.507";
+export declare const VERSION = "4.0.508";

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.507';
+exports.VERSION = '4.0.508';

package/dist/esm/index.mjs

@@ -1340,7 +1340,7 @@ var getSingleChildComponent = (children) => {
 };
 
 // src/version.ts
-var VERSION = "4.0.507";
+var VERSION = "4.0.508";
 
 // src/multiple-versions-warning.ts
 var checkMultipleRemotionVersions = () => {
@@ -2243,6 +2243,9 @@ var VisualModeSettersContext = React12.createContext({
   },
   setPropStatuses: () => {
     throw new Error("VisualModeSettersContext not initialized");
+  },
+  remapPropStatuses: () => {
+    throw new Error("VisualModeSettersContext not initialized");
   }
 });
 var effectDragOverridesKey = (nodePath, effectIndex) => `${makeSequencePropsSubscriptionKey(nodePath)}.effects.${effectIndex}`;
@@ -2311,6 +2314,20 @@ var SequenceManagerProvider = ({ children }) => {
       return { ...prev, [key]: newKey };
     });
   }, []);
+  const remapPropStatuses = useCallback5((remappings) => {
+    setPropStatusesMapState((prev) => {
+      const next = { ...prev };
+      for (const remapping of remappings) {
+        delete next[makeSequencePropsSubscriptionKey(remapping.previousNodePath)];
+      }
+      for (const remapping of remappings) {
+        if (remapping.nodePath !== null && remapping.result !== null) {
+          next[makeSequencePropsSubscriptionKey(remapping.nodePath)] = remapping.result;
+        }
+      }
+      return next;
+    });
+  }, []);
   const registerSequence = useCallback5((seq) => {
     setSequences((seqs) => {
       return [...seqs, seq];
@@ -2349,14 +2366,16 @@ var SequenceManagerProvider = ({ children }) => {
       clearDragOverrides,
       setEffectDragOverrides,
       clearEffectDragOverrides,
-      setPropStatuses
+      setPropStatuses,
+      remapPropStatuses
     };
   }, [
     setDragOverrides,
     clearDragOverrides,
     setEffectDragOverrides,
     clearEffectDragOverrides,
-    setPropStatuses
+    setPropStatuses,
+    remapPropStatuses
   ]);
   return /* @__PURE__ */ jsx10(SequenceManagerRefContext.Provider, {
     value: sequencesRef,
@@ -2816,9 +2835,45 @@ var parseTransformOriginValue = (output, parts) => {
   });
   return {
     kind: "translate",
-    values: [x.value, y.value, z.value],
-    units: [x.unit, y.unit, z.unit],
-    dimensions: parts[2] === undefined ? 2 : 3
+    values: [x.value, y.value, z.value, 0],
+    units: [x.unit, y.unit, z.unit, null],
+    dimensions: parts[2] === undefined ? 2 : 3,
+    axisRotation: false
+  };
+};
+var parseAxisRotationValue = (output) => {
+  const parts = output.trim().split(/\s+/);
+  const keywordAxis = parts.length === 2 ? parts[0].toLowerCase() : null;
+  if (keywordAxis === "x" || keywordAxis === "y" || keywordAxis === "z") {
+    const keywordAngle = parseStringInterpolationComponent(parts[1], output);
+    if (keywordAngle.kind !== "rotate") {
+      return null;
+    }
+    return {
+      kind: "rotate",
+      values: keywordAxis === "x" ? [1, 0, 0, keywordAngle.value] : keywordAxis === "y" ? [0, 1, 0, keywordAngle.value] : [0, 0, 1, keywordAngle.value],
+      units: [null, null, null, keywordAngle.unit],
+      dimensions: 4,
+      axisRotation: true
+    };
+  }
+  if (parts.length !== 4) {
+    return null;
+  }
+  const axis = parts.slice(0, 3).map(Number);
+  if (!axis.every(Number.isFinite)) {
+    return null;
+  }
+  const vectorAngle = parseStringInterpolationComponent(parts[3], output);
+  if (vectorAngle.kind !== "rotate") {
+    return null;
+  }
+  return {
+    kind: "rotate",
+    values: [axis[0], axis[1], axis[2], vectorAngle.value],
+    units: [null, null, null, vectorAngle.unit],
+    dimensions: 4,
+    axisRotation: true
   };
 };
 var parseStringInterpolationValue = (output) => {
@@ -2828,11 +2883,16 @@ var parseStringInterpolationValue = (output) => {
     }
     return {
       kind: "scale",
-      values: [output, output, 1],
-      units: [null, null, null],
-      dimensions: 1
+      values: [output, output, 1, 0],
+      units: [null, null, null, null],
+      dimensions: 1,
+      axisRotation: false
     };
   }
+  const axisRotation = parseAxisRotationValue(output);
+  if (axisRotation !== null) {
+    return axisRotation;
+  }
   const parts = output.trim().split(/\s+/);
   if (parts.length < 1 || parts.length > 3 || parts[0] === "") {
     throw new TypeError(`String outputRange values must contain 1 to 3 components, but got "${output}"`);
@@ -2853,24 +2913,35 @@ var parseStringInterpolationValue = (output) => {
     const z = parsed[2]?.value ?? 1;
     return {
       kind,
-      values: [x, y, z],
-      units: [null, null, null],
-      dimensions: parsed.length
+      values: [x, y, z, 0],
+      units: [null, null, null, null],
+      dimensions: parsed.length,
+      axisRotation: false
     };
   }
   return {
     kind,
-    values: [parsed[0].value, parsed[1]?.value ?? 0, parsed[2]?.value ?? 0],
-    units: [parsed[0].unit, parsed[1]?.unit ?? null, parsed[2]?.unit ?? null],
-    dimensions: parsed.length
+    values: [parsed[0].value, parsed[1]?.value ?? 0, parsed[2]?.value ?? 0, 0],
+    units: [
+      parsed[0].unit,
+      parsed[1]?.unit ?? null,
+      parsed[2]?.unit ?? null,
+      null
+    ],
+    dimensions: parsed.length,
+    axisRotation: false
   };
 };
 var serializeStringInterpolationValue = ({
   kind,
   values,
   units,
-  dimensions
+  dimensions,
+  axisRotation
 }) => {
+  if (axisRotation) {
+    return `${stringifyNumber(values[0])} ${stringifyNumber(values[1])} ${stringifyNumber(values[2])} ${stringifyNumber(values[3])}${units[3]}`;
+  }
   if (kind === "scale") {
     return values.slice(0, dimensions).map((value) => stringifyNumber(value)).join(" ");
   }
@@ -3038,7 +3109,26 @@ var interpolateString = ({
   outputRange,
   options
 }) => {
-  const parsedOutputRange = outputRange.map(parseStringInterpolationValue);
+  const initiallyParsedOutputRange = outputRange.map(parseStringInterpolationValue);
+  const hasAxisRotation = initiallyParsedOutputRange.some((parsed) => parsed.axisRotation);
+  const parsedOutputRange = hasAxisRotation ? initiallyParsedOutputRange.map((parsed) => {
+    if (parsed.kind !== "rotate") {
+      return parsed;
+    }
+    if (parsed.axisRotation) {
+      return parsed;
+    }
+    if (parsed.dimensions !== 1) {
+      throw new TypeError("Cannot interpolate a multi-angle rotate value with an axis rotation");
+    }
+    return {
+      kind: "rotate",
+      values: [0, 0, 1, parsed.values[0]],
+      units: [null, null, null, parsed.units[0]],
+      dimensions: 4,
+      axisRotation: true
+    };
+  }) : initiallyParsedOutputRange;
   const kind = parsedOutputRange[0]?.kind;
   if (kind === undefined) {
     throw new Error("outputRange must have at least 1 element");
@@ -3050,12 +3140,16 @@ var interpolateString = ({
   }
   const dimensions = Math.max(...parsedOutputRange.map((parsed) => parsed.dimensions));
   const units = [
+    null,
     null,
     null,
     null
   ];
   if (kind !== "scale") {
     for (let axis = 0;axis < dimensions; axis++) {
+      if (hasAxisRotation && axis < 3) {
+        continue;
+      }
       for (const parsed of parsedOutputRange) {
         const unit = parsed.units[axis];
         if (unit === null) {
@@ -3074,7 +3168,7 @@ var interpolateString = ({
       }
     }
   }
-  const values = [0, 0, 0];
+  const values = [0, 0, 0, 0];
   for (let axis = 0;axis < dimensions; axis++) {
     values[axis] = interpolateNumber({
       input,
@@ -3087,7 +3181,8 @@ var interpolateString = ({
     kind,
     values,
     units,
-    dimensions
+    dimensions,
+    axisRotation: hasAxisRotation
   });
 };
 var validateTupleOutputRange = (outputRange) => {

package/dist/esm/no-react.mjs

@@ -191,9 +191,45 @@ var parseTransformOriginValue = (output, parts) => {
   });
   return {
     kind: "translate",
-    values: [x.value, y.value, z.value],
-    units: [x.unit, y.unit, z.unit],
-    dimensions: parts[2] === undefined ? 2 : 3
+    values: [x.value, y.value, z.value, 0],
+    units: [x.unit, y.unit, z.unit, null],
+    dimensions: parts[2] === undefined ? 2 : 3,
+    axisRotation: false
+  };
+};
+var parseAxisRotationValue = (output) => {
+  const parts = output.trim().split(/\s+/);
+  const keywordAxis = parts.length === 2 ? parts[0].toLowerCase() : null;
+  if (keywordAxis === "x" || keywordAxis === "y" || keywordAxis === "z") {
+    const keywordAngle = parseStringInterpolationComponent(parts[1], output);
+    if (keywordAngle.kind !== "rotate") {
+      return null;
+    }
+    return {
+      kind: "rotate",
+      values: keywordAxis === "x" ? [1, 0, 0, keywordAngle.value] : keywordAxis === "y" ? [0, 1, 0, keywordAngle.value] : [0, 0, 1, keywordAngle.value],
+      units: [null, null, null, keywordAngle.unit],
+      dimensions: 4,
+      axisRotation: true
+    };
+  }
+  if (parts.length !== 4) {
+    return null;
+  }
+  const axis = parts.slice(0, 3).map(Number);
+  if (!axis.every(Number.isFinite)) {
+    return null;
+  }
+  const vectorAngle = parseStringInterpolationComponent(parts[3], output);
+  if (vectorAngle.kind !== "rotate") {
+    return null;
+  }
+  return {
+    kind: "rotate",
+    values: [axis[0], axis[1], axis[2], vectorAngle.value],
+    units: [null, null, null, vectorAngle.unit],
+    dimensions: 4,
+    axisRotation: true
   };
 };
 var parseStringInterpolationValue = (output) => {
@@ -203,11 +239,16 @@ var parseStringInterpolationValue = (output) => {
     }
     return {
       kind: "scale",
-      values: [output, output, 1],
-      units: [null, null, null],
-      dimensions: 1
+      values: [output, output, 1, 0],
+      units: [null, null, null, null],
+      dimensions: 1,
+      axisRotation: false
     };
   }
+  const axisRotation = parseAxisRotationValue(output);
+  if (axisRotation !== null) {
+    return axisRotation;
+  }
   const parts = output.trim().split(/\s+/);
   if (parts.length < 1 || parts.length > 3 || parts[0] === "") {
     throw new TypeError(`String outputRange values must contain 1 to 3 components, but got "${output}"`);
@@ -228,24 +269,35 @@ var parseStringInterpolationValue = (output) => {
     const z = parsed[2]?.value ?? 1;
     return {
       kind,
-      values: [x, y, z],
-      units: [null, null, null],
-      dimensions: parsed.length
+      values: [x, y, z, 0],
+      units: [null, null, null, null],
+      dimensions: parsed.length,
+      axisRotation: false
     };
   }
   return {
     kind,
-    values: [parsed[0].value, parsed[1]?.value ?? 0, parsed[2]?.value ?? 0],
-    units: [parsed[0].unit, parsed[1]?.unit ?? null, parsed[2]?.unit ?? null],
-    dimensions: parsed.length
+    values: [parsed[0].value, parsed[1]?.value ?? 0, parsed[2]?.value ?? 0, 0],
+    units: [
+      parsed[0].unit,
+      parsed[1]?.unit ?? null,
+      parsed[2]?.unit ?? null,
+      null
+    ],
+    dimensions: parsed.length,
+    axisRotation: false
   };
 };
 var serializeStringInterpolationValue = ({
   kind,
   values,
   units,
-  dimensions
+  dimensions,
+  axisRotation
 }) => {
+  if (axisRotation) {
+    return `${stringifyNumber(values[0])} ${stringifyNumber(values[1])} ${stringifyNumber(values[2])} ${stringifyNumber(values[3])}${units[3]}`;
+  }
   if (kind === "scale") {
     return values.slice(0, dimensions).map((value) => stringifyNumber(value)).join(" ");
   }
@@ -413,7 +465,26 @@ var interpolateString = ({
   outputRange,
   options
 }) => {
-  const parsedOutputRange = outputRange.map(parseStringInterpolationValue);
+  const initiallyParsedOutputRange = outputRange.map(parseStringInterpolationValue);
+  const hasAxisRotation = initiallyParsedOutputRange.some((parsed) => parsed.axisRotation);
+  const parsedOutputRange = hasAxisRotation ? initiallyParsedOutputRange.map((parsed) => {
+    if (parsed.kind !== "rotate") {
+      return parsed;
+    }
+    if (parsed.axisRotation) {
+      return parsed;
+    }
+    if (parsed.dimensions !== 1) {
+      throw new TypeError("Cannot interpolate a multi-angle rotate value with an axis rotation");
+    }
+    return {
+      kind: "rotate",
+      values: [0, 0, 1, parsed.values[0]],
+      units: [null, null, null, parsed.units[0]],
+      dimensions: 4,
+      axisRotation: true
+    };
+  }) : initiallyParsedOutputRange;
   const kind = parsedOutputRange[0]?.kind;
   if (kind === undefined) {
     throw new Error("outputRange must have at least 1 element");
@@ -425,12 +496,16 @@ var interpolateString = ({
   }
   const dimensions = Math.max(...parsedOutputRange.map((parsed) => parsed.dimensions));
   const units = [
+    null,
     null,
     null,
     null
   ];
   if (kind !== "scale") {
     for (let axis = 0;axis < dimensions; axis++) {
+      if (hasAxisRotation && axis < 3) {
+        continue;
+      }
       for (const parsed of parsedOutputRange) {
         const unit = parsed.units[axis];
         if (unit === null) {
@@ -449,7 +524,7 @@ var interpolateString = ({
       }
     }
   }
-  const values = [0, 0, 0];
+  const values = [0, 0, 0, 0];
   for (let axis = 0;axis < dimensions; axis++) {
     values[axis] = interpolateNumber({
       input,
@@ -462,7 +537,8 @@ var interpolateString = ({
     kind,
     values,
     units,
-    dimensions
+    dimensions,
+    axisRotation: hasAxisRotation
   });
 };
 var validateTupleOutputRange = (outputRange) => {

package/dist/esm/version.mjs

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "4.0.507";
+var VERSION = "4.0.508";
 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.507",
+	"version": "4.0.508",
 	"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.4.3",
-		"@remotion/eslint-config-internal": "4.0.507",
+		"@remotion/eslint-config-internal": "4.0.508",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},