@remotion/vercel 4.0.507 → 4.0.509

package/dist/esm/index.mjs

@@ -115,6 +115,498 @@ import { statSync } from "fs";
 import { RenderInternals } from "@remotion/renderer";
 
 // ../core/dist/esm/no-react.mjs
+var NEWTON_ITERATIONS = 4;
+var NEWTON_MIN_SLOPE = 0.001;
+var SUBDIVISION_PRECISION = 0.0000001;
+var SUBDIVISION_MAX_ITERATIONS = 10;
+var kSplineTableSize = 11;
+var kSampleStepSize = 1 / (kSplineTableSize - 1);
+var float32ArraySupported = typeof Float32Array === "function";
+function a(aA1, aA2) {
+  return 1 - 3 * aA2 + 3 * aA1;
+}
+function b(aA1, aA2) {
+  return 3 * aA2 - 6 * aA1;
+}
+function c(aA1) {
+  return 3 * aA1;
+}
+function calcBezier(aT, aA1, aA2) {
+  return ((a(aA1, aA2) * aT + b(aA1, aA2)) * aT + c(aA1)) * aT;
+}
+function getSlope(aT, aA1, aA2) {
+  return 3 * a(aA1, aA2) * aT * aT + 2 * b(aA1, aA2) * aT + c(aA1);
+}
+function binarySubdivide({
+  aX,
+  _aA,
+  _aB,
+  mX1,
+  mX2
+}) {
+  let currentX;
+  let currentT;
+  let i = 0;
+  let aA = _aA;
+  let aB = _aB;
+  do {
+    currentT = aA + (aB - aA) / 2;
+    currentX = calcBezier(currentT, mX1, mX2) - aX;
+    if (currentX > 0) {
+      aB = currentT;
+    } else {
+      aA = currentT;
+    }
+  } while (Math.abs(currentX) > SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS);
+  return currentT;
+}
+function newtonRaphsonIterate(aX, _aGuessT, mX1, mX2) {
+  let aGuessT = _aGuessT;
+  for (let i = 0;i < NEWTON_ITERATIONS; ++i) {
+    const currentSlope = getSlope(aGuessT, mX1, mX2);
+    if (currentSlope === 0) {
+      return aGuessT;
+    }
+    const currentX = calcBezier(aGuessT, mX1, mX2) - aX;
+    aGuessT -= currentX / currentSlope;
+  }
+  return aGuessT;
+}
+function bezier(mX1, mY1, mX2, mY2) {
+  if (!(mX1 >= 0 && mX1 <= 1 && mX2 >= 0 && mX2 <= 1)) {
+    throw new Error("bezier x values must be in [0, 1] range");
+  }
+  const sampleValues = float32ArraySupported ? new Float32Array(kSplineTableSize) : new Array(kSplineTableSize);
+  if (mX1 !== mY1 || mX2 !== mY2) {
+    for (let i = 0;i < kSplineTableSize; ++i) {
+      sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
+    }
+  }
+  function getTForX(aX) {
+    let intervalStart = 0;
+    let currentSample = 1;
+    const lastSample = kSplineTableSize - 1;
+    for (;currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
+      intervalStart += kSampleStepSize;
+    }
+    --currentSample;
+    const dist = (aX - sampleValues[currentSample]) / (sampleValues[currentSample + 1] - sampleValues[currentSample]);
+    const guessForT = intervalStart + dist * kSampleStepSize;
+    const initialSlope = getSlope(guessForT, mX1, mX2);
+    if (initialSlope >= NEWTON_MIN_SLOPE) {
+      return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
+    }
+    if (initialSlope === 0) {
+      return guessForT;
+    }
+    return binarySubdivide({
+      aX,
+      _aA: intervalStart,
+      _aB: intervalStart + kSampleStepSize,
+      mX1,
+      mX2
+    });
+  }
+  return function(x) {
+    const clampedX = Math.min(1, Math.max(0, x));
+    if (mX1 === mY1 && mX2 === mY2) {
+      return clampedX;
+    }
+    if (clampedX === 0) {
+      return 0;
+    }
+    if (clampedX === 1) {
+      return 1;
+    }
+    return calcBezier(getTForX(clampedX), mY1, mY2);
+  };
+}
+var validateFrame = ({
+  allowFloats,
+  durationInFrames,
+  frame
+}) => {
+  if (typeof frame === "undefined") {
+    throw new TypeError(\`Argument missing for parameter "frame"\`);
+  }
+  if (typeof frame !== "number") {
+    throw new TypeError(\`Argument passed for "frame" is not a number: \${frame}\`);
+  }
+  if (!Number.isFinite(frame)) {
+    throw new RangeError(\`Frame \${frame} is not finite\`);
+  }
+  if (frame % 1 !== 0 && !allowFloats) {
+    throw new RangeError(\`Argument for frame must be an integer, but got \${frame}\`);
+  }
+  if (frame < 0 && frame < -durationInFrames) {
+    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the lowest frame that can be rendered is \${-durationInFrames}\`);
+  }
+  if (frame > durationInFrames - 1) {
+    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the highest frame that can be rendered is \${durationInFrames - 1}\`);
+  }
+};
+function validateFps(fps, location, isGif) {
+  if (typeof fps !== "number") {
+    throw new Error(\`"fps" must be a number, but you passed a value of type \${typeof fps} \${location}\`);
+  }
+  if (!Number.isFinite(fps)) {
+    throw new Error(\`"fps" must be a finite, but you passed \${fps} \${location}\`);
+  }
+  if (isNaN(fps)) {
+    throw new Error(\`"fps" must not be NaN, but got \${fps} \${location}\`);
+  }
+  if (fps <= 0) {
+    throw new TypeError(\`"fps" must be positive, but got \${fps} \${location}\`);
+  }
+  if (isGif && fps > 50) {
+    throw new TypeError(\`The FPS for a GIF cannot be higher than 50. Use the --every-nth-frame option to lower the FPS: https://remotion.dev/docs/render-as-gif\`);
+  }
+}
+var validateSpringDuration = (dur) => {
+  if (typeof dur === "undefined") {
+    return;
+  }
+  if (typeof dur !== "number") {
+    throw new TypeError(\`A "duration" of a spring must be a "number" but is "\${typeof dur}"\`);
+  }
+  if (Number.isNaN(dur)) {
+    throw new TypeError('A "duration" of a spring is NaN, which it must not be');
+  }
+  if (!Number.isFinite(dur)) {
+    throw new TypeError('A "duration" of a spring must be finite, but is ' + dur);
+  }
+  if (dur <= 0) {
+    throw new TypeError('A "duration" of a spring must be positive, but is ' + dur);
+  }
+};
+var defaultSpringConfig = {
+  damping: 10,
+  mass: 1,
+  stiffness: 100,
+  overshootClamping: false
+};
+var advanceCache = {};
+function advance({
+  animation,
+  now,
+  config
+}) {
+  const { toValue, lastTimestamp, current, velocity } = animation;
+  const deltaTime = Math.min(now - lastTimestamp, 64);
+  if (config.damping <= 0) {
+    throw new Error("Spring damping must be greater than 0, otherwise the spring() animation will never end, causing an infinite loop.");
+  }
+  const c2 = config.damping;
+  const m = config.mass;
+  const k = config.stiffness;
+  const cacheKey = [
+    toValue,
+    lastTimestamp,
+    current,
+    velocity,
+    c2,
+    m,
+    k,
+    now
+  ].join("-");
+  if (advanceCache[cacheKey]) {
+    return advanceCache[cacheKey];
+  }
+  const v0 = -velocity;
+  const x0 = toValue - current;
+  const zeta = c2 / (2 * Math.sqrt(k * m));
+  const omega0 = Math.sqrt(k / m);
+  const omega1 = omega0 * Math.sqrt(1 - zeta ** 2);
+  const t = deltaTime / 1000;
+  const sin1 = Math.sin(omega1 * t);
+  const cos1 = Math.cos(omega1 * t);
+  const underDampedEnvelope = Math.exp(-zeta * omega0 * t);
+  const underDampedFrag1 = underDampedEnvelope * (sin1 * ((v0 + zeta * omega0 * x0) / omega1) + x0 * cos1);
+  const underDampedPosition = toValue - underDampedFrag1;
+  const underDampedVelocity = zeta * omega0 * underDampedFrag1 - underDampedEnvelope * (cos1 * (v0 + zeta * omega0 * x0) - omega1 * x0 * sin1);
+  const criticallyDampedEnvelope = Math.exp(-omega0 * t);
+  const criticallyDampedPosition = toValue - criticallyDampedEnvelope * (x0 + (v0 + omega0 * x0) * t);
+  const criticallyDampedVelocity = criticallyDampedEnvelope * (v0 * (t * omega0 - 1) + t * x0 * omega0 * omega0);
+  const animationNode = {
+    toValue,
+    prevPosition: current,
+    lastTimestamp: now,
+    current: zeta < 1 ? underDampedPosition : criticallyDampedPosition,
+    velocity: zeta < 1 ? underDampedVelocity : criticallyDampedVelocity
+  };
+  advanceCache[cacheKey] = animationNode;
+  return animationNode;
+}
+var calculationCache = {};
+function springCalculation({
+  frame,
+  fps,
+  config = {}
+}) {
+  const from = 0;
+  const to = 1;
+  const cacheKey = [
+    frame,
+    fps,
+    config.damping,
+    config.mass,
+    config.overshootClamping,
+    config.stiffness
+  ].join("-");
+  if (calculationCache[cacheKey]) {
+    return calculationCache[cacheKey];
+  }
+  let animation = {
+    lastTimestamp: 0,
+    current: from,
+    toValue: to,
+    velocity: 0,
+    prevPosition: 0
+  };
+  const frameClamped = Math.max(0, frame);
+  const unevenRest = frameClamped % 1;
+  for (let f = 0;f <= Math.floor(frameClamped); f++) {
+    if (f === Math.floor(frameClamped)) {
+      f += unevenRest;
+    }
+    const time = f / fps * 1000;
+    animation = advance({
+      animation,
+      now: time,
+      config: {
+        ...defaultSpringConfig,
+        ...config
+      }
+    });
+  }
+  calculationCache[cacheKey] = animation;
+  return animation;
+}
+var cache = new Map;
+function measureSpring({
+  fps,
+  config = {},
+  threshold = 0.005
+}) {
+  if (typeof threshold !== "number") {
+    throw new TypeError(\`threshold must be a number, got \${threshold} of type \${typeof threshold}\`);
+  }
+  if (threshold === 0) {
+    return Infinity;
+  }
+  if (threshold === 1) {
+    return 0;
+  }
+  if (isNaN(threshold)) {
+    throw new TypeError("Threshold is NaN");
+  }
+  if (!Number.isFinite(threshold)) {
+    throw new TypeError("Threshold is not finite");
+  }
+  if (threshold < 0) {
+    throw new TypeError("Threshold is below 0");
+  }
+  const cacheKey = [
+    fps,
+    config.damping,
+    config.mass,
+    config.overshootClamping,
+    config.stiffness,
+    threshold
+  ].join("-");
+  if (cache.has(cacheKey)) {
+    return cache.get(cacheKey);
+  }
+  validateFps(fps, "to the measureSpring() function", false);
+  let frame = 0;
+  let finishedFrame = 0;
+  const calc = () => {
+    return springCalculation({
+      fps,
+      frame,
+      config
+    });
+  };
+  let animation = calc();
+  const calcDifference = () => {
+    return Math.abs(animation.current - animation.toValue);
+  };
+  let difference = calcDifference();
+  while (difference >= threshold) {
+    frame++;
+    animation = calc();
+    difference = calcDifference();
+  }
+  finishedFrame = frame;
+  for (let i = 0;i < 20; i++) {
+    frame++;
+    animation = calc();
+    difference = calcDifference();
+    if (difference >= threshold) {
+      i = 0;
+      finishedFrame = frame + 1;
+    }
+  }
+  cache.set(cacheKey, finishedFrame);
+  return finishedFrame;
+}
+function spring({
+  frame: passedFrame,
+  fps,
+  config = {},
+  from = 0,
+  to = 1,
+  durationInFrames: passedDurationInFrames,
+  durationRestThreshold,
+  delay = 0,
+  reverse = false
+}) {
+  validateSpringDuration(passedDurationInFrames);
+  validateFrame({
+    frame: passedFrame,
+    durationInFrames: Infinity,
+    allowFloats: true
+  });
+  validateFps(fps, "to spring()", false);
+  const needsToCalculateNaturalDuration = reverse || typeof passedDurationInFrames !== "undefined";
+  const naturalDuration = needsToCalculateNaturalDuration ? measureSpring({
+    fps,
+    config,
+    threshold: durationRestThreshold
+  }) : undefined;
+  const naturalDurationGetter = needsToCalculateNaturalDuration ? {
+    get: () => naturalDuration
+  } : {
+    get: () => {
+      throw new Error("did not calculate natural duration, this is an error with Remotion. Please report");
+    }
+  };
+  const reverseProcessed = reverse ? (passedDurationInFrames ?? naturalDurationGetter.get()) - passedFrame : passedFrame;
+  const delayProcessed = reverseProcessed + (reverse ? delay : -delay);
+  const durationProcessed = passedDurationInFrames === undefined ? delayProcessed : delayProcessed / (passedDurationInFrames / naturalDurationGetter.get());
+  if (passedDurationInFrames && delayProcessed > passedDurationInFrames) {
+    return to;
+  }
+  const spr = springCalculation({
+    fps,
+    frame: durationProcessed,
+    config
+  });
+  const inner = config.overshootClamping ? to >= from ? Math.min(spr.current, to) : Math.max(spr.current, to) : spr.current;
+  const interpolated = from === 0 && to === 1 ? inner : interpolate(inner, [0, 1], [from, to]);
+  return interpolated;
+}
+var clampUnit = (t) => Math.min(1, Math.max(0, t));
+var springEasingDurationInFrames = 30;
+
+class Easing {
+  static step0(n) {
+    return n > 0 ? 1 : 0;
+  }
+  static step1(n) {
+    return n >= 1 ? 1 : 0;
+  }
+  static linear(t) {
+    return t;
+  }
+  static ease(t) {
+    return Easing.bezier(0.42, 0, 1, 1)(t);
+  }
+  static quad(t) {
+    return t * t;
+  }
+  static cubic(t) {
+    return t * t * t;
+  }
+  static poly(n) {
+    return (t) => t ** n;
+  }
+  static sin(t) {
+    return 1 - Math.cos(t * Math.PI / 2);
+  }
+  static circle(t) {
+    const u = clampUnit(t);
+    return 1 - Math.sqrt(1 - u * u);
+  }
+  static exp(t) {
+    return 2 ** (10 * (t - 1));
+  }
+  static elastic(bounciness = 1) {
+    const p = bounciness * Math.PI;
+    return (t) => 1 - Math.cos(t * Math.PI / 2) ** 3 * Math.cos(t * p);
+  }
+  static back(s = 1.70158) {
+    return (t) => t * t * ((s + 1) * t - s);
+  }
+  static spring({
+    allowTail = false,
+    durationRestThreshold,
+    ...config
+  } = {}) {
+    const easing = (t) => {
+      if (t <= 0) {
+        return 0;
+      }
+      if (!allowTail && t >= 1) {
+        return 1;
+      }
+      if (allowTail) {
+        return spring({
+          fps: springEasingDurationInFrames,
+          frame: t * measureSpring({
+            fps: springEasingDurationInFrames,
+            config,
+            threshold: durationRestThreshold
+          }),
+          config
+        });
+      }
+      return spring({
+        fps: springEasingDurationInFrames,
+        frame: t * springEasingDurationInFrames,
+        config,
+        durationInFrames: springEasingDurationInFrames,
+        durationRestThreshold
+      });
+    };
+    return Object.assign(easing, {
+      remotionShouldExtendRight: allowTail
+    });
+  }
+  static bounce(t) {
+    const u = clampUnit(t);
+    if (u < 1 / 2.75) {
+      return 7.5625 * u * u;
+    }
+    if (u < 2 / 2.75) {
+      const t2_ = u - 1.5 / 2.75;
+      return 7.5625 * t2_ * t2_ + 0.75;
+    }
+    if (u < 2.5 / 2.75) {
+      const t2_ = u - 2.25 / 2.75;
+      return 7.5625 * t2_ * t2_ + 0.9375;
+    }
+    const t2 = u - 2.625 / 2.75;
+    return 7.5625 * t2 * t2 + 0.984375;
+  }
+  static bezier(x1, y1, x2, y2) {
+    return bezier(x1, y1, x2, y2);
+  }
+  static in(easing) {
+    return easing;
+  }
+  static out(easing) {
+    return (t) => 1 - easing(1 - t);
+  }
+  static inOut(easing) {
+    return (t) => {
+      if (t < 0.5) {
+        return easing(t * 2) / 2;
+      }
+      return 1 - easing((1 - t) * 2) / 2;
+    };
+  }
+}
 var normalizeNumber = (value) => {
   return Math.round(value * 1e6) / 1e6;
 };
@@ -185,10 +677,13 @@ var transformOriginCenter = { value: 50, unit: "%" };
 var stringifyNumber = (value) => {
   return String(normalizeNumber(value));
 };
+
+class UnsupportedStringInterpolationValueError extends TypeError {
+}
 var parseStringInterpolationComponent = (component, value) => {
   const match = cssNumberRegex.exec(component);
   if (match === null) {
-    throw new TypeError(\`Cannot interpolate "\${value}" because "\${component}" is not a supported scale, translate, or rotate value\`);
+    throw new UnsupportedStringInterpolationValueError(\`Cannot interpolate "\${value}" because "\${component}" is not a supported scale, translate, or rotate value\`);
   }
   const unit = match[2] ?? null;
   const numberValue = Number(match[1]);
@@ -305,9 +800,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) => {
@@ -317,11 +848,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}"\`);
@@ -342,24 +878,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(" ");
   }
@@ -527,7 +1074,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");
@@ -539,12 +1105,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) {
@@ -563,7 +1133,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,
@@ -576,9 +1146,56 @@ var interpolateString = ({
     kind,
     values,
     units,
-    dimensions
+    dimensions,
+    axisRotation: hasAxisRotation
   });
 };
+var interpolateDiscreteString = ({
+  input,
+  inputRange,
+  outputRange,
+  options
+}) => {
+  if (inputRange.length === 1) {
+    return outputRange[0];
+  }
+  for (let segmentIndex = 0;segmentIndex < inputRange.length - 1; segmentIndex++) {
+    if (resolveEasingForSegment({
+      easing: options?.easing,
+      segmentIndex
+    }) !== Easing.step1) {
+      throw new TypeError("Non-numeric strings can only be interpolated using Easing.step1");
+    }
+  }
+  const posterizedInput = options?.posterize === undefined ? input : Math.floor(input / options.posterize) * options.posterize;
+  const inputMin = inputRange[0];
+  const inputMax = inputRange[inputRange.length - 1];
+  let resolvedInput = posterizedInput;
+  if (resolvedInput < inputMin) {
+    if (options?.extrapolateLeft === "identity") {
+      throw new TypeError('extrapolateLeft: "identity" is not supported for non-numeric strings');
+    }
+    if (options?.extrapolateLeft === "wrap") {
+      const wrapRange = inputMax - inputMin;
+      resolvedInput = ((resolvedInput - inputMin) % wrapRange + wrapRange) % wrapRange + inputMin;
+    } else {
+      return outputRange[0];
+    }
+  }
+  if (resolvedInput > inputMax) {
+    if (options?.extrapolateRight === "identity") {
+      throw new TypeError('extrapolateRight: "identity" is not supported for non-numeric strings');
+    }
+    if (options?.extrapolateRight === "wrap") {
+      const wrapRange = inputMax - inputMin;
+      resolvedInput = ((resolvedInput - inputMin) % wrapRange + wrapRange) % wrapRange + inputMin;
+    } else {
+      return outputRange[outputRange.length - 1];
+    }
+  }
+  const range = findRange(resolvedInput, inputRange);
+  return resolvedInput >= inputRange[range + 1] ? outputRange[range + 1] : outputRange[range];
+};
 var validateTupleOutputRange = (outputRange) => {
   const dimensions = outputRange[0]?.length;
   if (dimensions === undefined) {
@@ -693,7 +1310,30 @@ function interpolate(input, inputRange, outputRange, options) {
     if (!outputRange.every((output) => typeof output === "string" || typeof output === "number")) {
       throw new TypeError("outputRange must contain only numbers, or supported scale, translate, and rotate strings");
     }
-    return interpolateString({ input, inputRange, outputRange, options });
+    try {
+      return interpolateString({ input, inputRange, outputRange, options });
+    } catch (error) {
+      if (!outputRange.every((output) => typeof output === "string")) {
+        throw error;
+      }
+      const hasNonNumericString = outputRange.some((output) => {
+        try {
+          parseStringInterpolationValue(output);
+          return false;
+        } catch (parseError) {
+          return parseError instanceof UnsupportedStringInterpolationValueError;
+        }
+      });
+      if (!hasNonNumericString) {
+        throw error;
+      }
+      return interpolateDiscreteString({
+        input,
+        inputRange,
+        outputRange,
+        options
+      });
+    }
   }
   if (outputRange.every((output) => Array.isArray(output))) {
     return interpolateTuple({ input, inputRange, outputRange, options });
@@ -1162,8 +1802,8 @@ function hslToRgb(h, s, l) {
   const p = 2 * l - q;
   const r = hue2rgb(p, q, h + 1 / 3);
   const g = hue2rgb(p, q, h);
-  const b = hue2rgb(p, q, h - 1 / 3);
-  return Math.round(r * 255) << 24 | Math.round(g * 255) << 16 | Math.round(b * 255) << 8;
+  const b2 = hue2rgb(p, q, h - 1 / 3);
+  return Math.round(r * 255) << 24 | Math.round(g * 255) << 16 | Math.round(b2 * 255) << 8;
 }
 function parse255(str) {
   const int = Number.parseInt(str, 10);
@@ -1227,25 +1867,25 @@ function parseModernAlpha(str) {
   }
   return Math.max(0, Math.min(1, Number.parseFloat(str)));
 }
-function linearToSrgb(c) {
-  if (c <= 0.0031308)
-    return 12.92 * c;
-  return 1.055 * c ** (1 / 2.4) - 0.055;
+function linearToSrgb(c2) {
+  if (c2 <= 0.0031308)
+    return 12.92 * c2;
+  return 1.055 * c2 ** (1 / 2.4) - 0.055;
 }
 function clamp01(v) {
   return Math.max(0, Math.min(1, v));
 }
-function rgbFloatToInt(r, g, b, alpha) {
+function rgbFloatToInt(r, g, b2, alpha) {
   const ri = Math.round(clamp01(r) * 255);
   const gi = Math.round(clamp01(g) * 255);
-  const bi = Math.round(clamp01(b) * 255);
+  const bi = Math.round(clamp01(b2) * 255);
   const ai = Math.round(clamp01(alpha) * 255);
   return (ri << 24 | gi << 16 | bi << 8 | ai) >>> 0;
 }
-function oklabToSrgb(L, a, b) {
-  const l_ = L + 0.3963377774 * a + 0.2158037573 * b;
-  const m_ = L - 0.1055613458 * a - 0.0638541728 * b;
-  const s_ = L - 0.0894841775 * a - 1.291485548 * b;
+function oklabToSrgb(L, a2, b2) {
+  const l_ = L + 0.3963377774 * a2 + 0.2158037573 * b2;
+  const m_ = L - 0.1055613458 * a2 - 0.0638541728 * b2;
+  const s_ = L - 0.0894841775 * a2 - 1.291485548 * b2;
   const l = l_ * l_ * l_;
   const m = m_ * m_ * m_;
   const s = s_ * s_ * s_;
@@ -1254,15 +1894,15 @@ function oklabToSrgb(L, a, b) {
   const bLin = -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s;
   return [linearToSrgb(rLin), linearToSrgb(gLin), linearToSrgb(bLin)];
 }
-function labToSrgb(L, a, b) {
+function labToSrgb(L, a2, b2) {
   const epsilon = 216 / 24389;
   const kappa = 24389 / 27;
   const Xn = 0.95047;
   const Yn = 1;
   const Zn = 1.08883;
   const fy = (L + 16) / 116;
-  const fx = a / 500 + fy;
-  const fz = fy - b / 200;
+  const fx = a2 / 500 + fy;
+  const fz = fy - b2 / 200;
   const fx3 = fx * fx * fx;
   const fz3 = fz * fz * fz;
   const xr = fx3 > epsilon ? fx3 : (116 * fx - 16) / kappa;
@@ -1494,27 +2134,27 @@ function normalizeColor(color) {
       const H = parseHueAngle(match[3]);
       const alpha = parseModernAlpha(match[4]);
       const hRad = H * Math.PI / 180;
-      const [r, g, b] = oklabToSrgb(L, C * Math.cos(hRad), C * Math.sin(hRad));
-      return rgbFloatToInt(r, g, b, alpha);
+      const [r, g, b2] = oklabToSrgb(L, C * Math.cos(hRad), C * Math.sin(hRad));
+      return rgbFloatToInt(r, g, b2, alpha);
     }
   }
   if (matchers.oklab) {
     if (match = matchers.oklab.exec(color)) {
       const L = parseModernComponent(match[1], 1);
-      const a = parseModernComponent(match[2], 0.4);
-      const b = parseModernComponent(match[3], 0.4);
+      const a2 = parseModernComponent(match[2], 0.4);
+      const b2 = parseModernComponent(match[3], 0.4);
       const alpha = parseModernAlpha(match[4]);
-      const [r, g, bl] = oklabToSrgb(L, a, b);
+      const [r, g, bl] = oklabToSrgb(L, a2, b2);
       return rgbFloatToInt(r, g, bl, alpha);
     }
   }
   if (matchers.lab) {
     if (match = matchers.lab.exec(color)) {
       const L = parseModernComponent(match[1], 100);
-      const a = parseModernComponent(match[2], 125);
-      const b = parseModernComponent(match[3], 125);
+      const a2 = parseModernComponent(match[2], 125);
+      const b2 = parseModernComponent(match[3], 125);
       const alpha = parseModernAlpha(match[4]);
-      const [r, g, bl] = labToSrgb(L, a, b);
+      const [r, g, bl] = labToSrgb(L, a2, b2);
       return rgbFloatToInt(r, g, bl, alpha);
     }
   }
@@ -1593,30 +2233,6 @@ var serializeScaleValue = ([x, y, z]) => {
   return \`\${normalizedX} \${normalizedY} \${normalizedZ}\`;
 };
 var ENABLE_V5_BREAKING_CHANGES = false;
-var validateFrame = ({
-  allowFloats,
-  durationInFrames,
-  frame
-}) => {
-  if (typeof frame === "undefined") {
-    throw new TypeError(\`Argument missing for parameter "frame"\`);
-  }
-  if (typeof frame !== "number") {
-    throw new TypeError(\`Argument passed for "frame" is not a number: \${frame}\`);
-  }
-  if (!Number.isFinite(frame)) {
-    throw new RangeError(\`Frame \${frame} is not finite\`);
-  }
-  if (frame % 1 !== 0 && !allowFloats) {
-    throw new RangeError(\`Argument for frame must be an integer, but got \${frame}\`);
-  }
-  if (frame < 0 && frame < -durationInFrames) {
-    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the lowest frame that can be rendered is \${-durationInFrames}\`);
-  }
-  if (frame > durationInFrames - 1) {
-    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the highest frame that can be rendered is \${durationInFrames - 1}\`);
-  }
-};
 var validCodecs = [
   "h264",
   "h265",
@@ -1688,23 +2304,6 @@ function validateDurationInFrames(durationInFrames, options) {
     throw new TypeError(\`The "durationInFrames" prop \${component} must be finite, but got \${durationInFrames}.\`);
   }
 }
-function validateFps(fps, location, isGif) {
-  if (typeof fps !== "number") {
-    throw new Error(\`"fps" must be a number, but you passed a value of type \${typeof fps} \${location}\`);
-  }
-  if (!Number.isFinite(fps)) {
-    throw new Error(\`"fps" must be a finite, but you passed \${fps} \${location}\`);
-  }
-  if (isNaN(fps)) {
-    throw new Error(\`"fps" must not be NaN, but got \${fps} \${location}\`);
-  }
-  if (fps <= 0) {
-    throw new TypeError(\`"fps" must be positive, but got \${fps} \${location}\`);
-  }
-  if (isGif && fps > 50) {
-    throw new TypeError(\`The FPS for a GIF cannot be higher than 50. Use the --every-nth-frame option to lower the FPS: https://remotion.dev/docs/render-as-gif\`);
-  }
-}
 var getExpectedMediaFrameUncorrected = ({
   frame,
   playbackRate,
@@ -1874,6 +2473,498 @@ import { RenderInternals } from "@remotion/renderer";
 import { put } from "@vercel/blob";
 
 // ../core/dist/esm/no-react.mjs
+var NEWTON_ITERATIONS = 4;
+var NEWTON_MIN_SLOPE = 0.001;
+var SUBDIVISION_PRECISION = 0.0000001;
+var SUBDIVISION_MAX_ITERATIONS = 10;
+var kSplineTableSize = 11;
+var kSampleStepSize = 1 / (kSplineTableSize - 1);
+var float32ArraySupported = typeof Float32Array === "function";
+function a(aA1, aA2) {
+  return 1 - 3 * aA2 + 3 * aA1;
+}
+function b(aA1, aA2) {
+  return 3 * aA2 - 6 * aA1;
+}
+function c(aA1) {
+  return 3 * aA1;
+}
+function calcBezier(aT, aA1, aA2) {
+  return ((a(aA1, aA2) * aT + b(aA1, aA2)) * aT + c(aA1)) * aT;
+}
+function getSlope(aT, aA1, aA2) {
+  return 3 * a(aA1, aA2) * aT * aT + 2 * b(aA1, aA2) * aT + c(aA1);
+}
+function binarySubdivide({
+  aX,
+  _aA,
+  _aB,
+  mX1,
+  mX2
+}) {
+  let currentX;
+  let currentT;
+  let i = 0;
+  let aA = _aA;
+  let aB = _aB;
+  do {
+    currentT = aA + (aB - aA) / 2;
+    currentX = calcBezier(currentT, mX1, mX2) - aX;
+    if (currentX > 0) {
+      aB = currentT;
+    } else {
+      aA = currentT;
+    }
+  } while (Math.abs(currentX) > SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS);
+  return currentT;
+}
+function newtonRaphsonIterate(aX, _aGuessT, mX1, mX2) {
+  let aGuessT = _aGuessT;
+  for (let i = 0;i < NEWTON_ITERATIONS; ++i) {
+    const currentSlope = getSlope(aGuessT, mX1, mX2);
+    if (currentSlope === 0) {
+      return aGuessT;
+    }
+    const currentX = calcBezier(aGuessT, mX1, mX2) - aX;
+    aGuessT -= currentX / currentSlope;
+  }
+  return aGuessT;
+}
+function bezier(mX1, mY1, mX2, mY2) {
+  if (!(mX1 >= 0 && mX1 <= 1 && mX2 >= 0 && mX2 <= 1)) {
+    throw new Error("bezier x values must be in [0, 1] range");
+  }
+  const sampleValues = float32ArraySupported ? new Float32Array(kSplineTableSize) : new Array(kSplineTableSize);
+  if (mX1 !== mY1 || mX2 !== mY2) {
+    for (let i = 0;i < kSplineTableSize; ++i) {
+      sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
+    }
+  }
+  function getTForX(aX) {
+    let intervalStart = 0;
+    let currentSample = 1;
+    const lastSample = kSplineTableSize - 1;
+    for (;currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
+      intervalStart += kSampleStepSize;
+    }
+    --currentSample;
+    const dist = (aX - sampleValues[currentSample]) / (sampleValues[currentSample + 1] - sampleValues[currentSample]);
+    const guessForT = intervalStart + dist * kSampleStepSize;
+    const initialSlope = getSlope(guessForT, mX1, mX2);
+    if (initialSlope >= NEWTON_MIN_SLOPE) {
+      return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
+    }
+    if (initialSlope === 0) {
+      return guessForT;
+    }
+    return binarySubdivide({
+      aX,
+      _aA: intervalStart,
+      _aB: intervalStart + kSampleStepSize,
+      mX1,
+      mX2
+    });
+  }
+  return function(x) {
+    const clampedX = Math.min(1, Math.max(0, x));
+    if (mX1 === mY1 && mX2 === mY2) {
+      return clampedX;
+    }
+    if (clampedX === 0) {
+      return 0;
+    }
+    if (clampedX === 1) {
+      return 1;
+    }
+    return calcBezier(getTForX(clampedX), mY1, mY2);
+  };
+}
+var validateFrame = ({
+  allowFloats,
+  durationInFrames,
+  frame
+}) => {
+  if (typeof frame === "undefined") {
+    throw new TypeError(\`Argument missing for parameter "frame"\`);
+  }
+  if (typeof frame !== "number") {
+    throw new TypeError(\`Argument passed for "frame" is not a number: \${frame}\`);
+  }
+  if (!Number.isFinite(frame)) {
+    throw new RangeError(\`Frame \${frame} is not finite\`);
+  }
+  if (frame % 1 !== 0 && !allowFloats) {
+    throw new RangeError(\`Argument for frame must be an integer, but got \${frame}\`);
+  }
+  if (frame < 0 && frame < -durationInFrames) {
+    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the lowest frame that can be rendered is \${-durationInFrames}\`);
+  }
+  if (frame > durationInFrames - 1) {
+    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the highest frame that can be rendered is \${durationInFrames - 1}\`);
+  }
+};
+function validateFps(fps, location, isGif) {
+  if (typeof fps !== "number") {
+    throw new Error(\`"fps" must be a number, but you passed a value of type \${typeof fps} \${location}\`);
+  }
+  if (!Number.isFinite(fps)) {
+    throw new Error(\`"fps" must be a finite, but you passed \${fps} \${location}\`);
+  }
+  if (isNaN(fps)) {
+    throw new Error(\`"fps" must not be NaN, but got \${fps} \${location}\`);
+  }
+  if (fps <= 0) {
+    throw new TypeError(\`"fps" must be positive, but got \${fps} \${location}\`);
+  }
+  if (isGif && fps > 50) {
+    throw new TypeError(\`The FPS for a GIF cannot be higher than 50. Use the --every-nth-frame option to lower the FPS: https://remotion.dev/docs/render-as-gif\`);
+  }
+}
+var validateSpringDuration = (dur) => {
+  if (typeof dur === "undefined") {
+    return;
+  }
+  if (typeof dur !== "number") {
+    throw new TypeError(\`A "duration" of a spring must be a "number" but is "\${typeof dur}"\`);
+  }
+  if (Number.isNaN(dur)) {
+    throw new TypeError('A "duration" of a spring is NaN, which it must not be');
+  }
+  if (!Number.isFinite(dur)) {
+    throw new TypeError('A "duration" of a spring must be finite, but is ' + dur);
+  }
+  if (dur <= 0) {
+    throw new TypeError('A "duration" of a spring must be positive, but is ' + dur);
+  }
+};
+var defaultSpringConfig = {
+  damping: 10,
+  mass: 1,
+  stiffness: 100,
+  overshootClamping: false
+};
+var advanceCache = {};
+function advance({
+  animation,
+  now,
+  config
+}) {
+  const { toValue, lastTimestamp, current, velocity } = animation;
+  const deltaTime = Math.min(now - lastTimestamp, 64);
+  if (config.damping <= 0) {
+    throw new Error("Spring damping must be greater than 0, otherwise the spring() animation will never end, causing an infinite loop.");
+  }
+  const c2 = config.damping;
+  const m = config.mass;
+  const k = config.stiffness;
+  const cacheKey = [
+    toValue,
+    lastTimestamp,
+    current,
+    velocity,
+    c2,
+    m,
+    k,
+    now
+  ].join("-");
+  if (advanceCache[cacheKey]) {
+    return advanceCache[cacheKey];
+  }
+  const v0 = -velocity;
+  const x0 = toValue - current;
+  const zeta = c2 / (2 * Math.sqrt(k * m));
+  const omega0 = Math.sqrt(k / m);
+  const omega1 = omega0 * Math.sqrt(1 - zeta ** 2);
+  const t = deltaTime / 1000;
+  const sin1 = Math.sin(omega1 * t);
+  const cos1 = Math.cos(omega1 * t);
+  const underDampedEnvelope = Math.exp(-zeta * omega0 * t);
+  const underDampedFrag1 = underDampedEnvelope * (sin1 * ((v0 + zeta * omega0 * x0) / omega1) + x0 * cos1);
+  const underDampedPosition = toValue - underDampedFrag1;
+  const underDampedVelocity = zeta * omega0 * underDampedFrag1 - underDampedEnvelope * (cos1 * (v0 + zeta * omega0 * x0) - omega1 * x0 * sin1);
+  const criticallyDampedEnvelope = Math.exp(-omega0 * t);
+  const criticallyDampedPosition = toValue - criticallyDampedEnvelope * (x0 + (v0 + omega0 * x0) * t);
+  const criticallyDampedVelocity = criticallyDampedEnvelope * (v0 * (t * omega0 - 1) + t * x0 * omega0 * omega0);
+  const animationNode = {
+    toValue,
+    prevPosition: current,
+    lastTimestamp: now,
+    current: zeta < 1 ? underDampedPosition : criticallyDampedPosition,
+    velocity: zeta < 1 ? underDampedVelocity : criticallyDampedVelocity
+  };
+  advanceCache[cacheKey] = animationNode;
+  return animationNode;
+}
+var calculationCache = {};
+function springCalculation({
+  frame,
+  fps,
+  config = {}
+}) {
+  const from = 0;
+  const to = 1;
+  const cacheKey = [
+    frame,
+    fps,
+    config.damping,
+    config.mass,
+    config.overshootClamping,
+    config.stiffness
+  ].join("-");
+  if (calculationCache[cacheKey]) {
+    return calculationCache[cacheKey];
+  }
+  let animation = {
+    lastTimestamp: 0,
+    current: from,
+    toValue: to,
+    velocity: 0,
+    prevPosition: 0
+  };
+  const frameClamped = Math.max(0, frame);
+  const unevenRest = frameClamped % 1;
+  for (let f = 0;f <= Math.floor(frameClamped); f++) {
+    if (f === Math.floor(frameClamped)) {
+      f += unevenRest;
+    }
+    const time = f / fps * 1000;
+    animation = advance({
+      animation,
+      now: time,
+      config: {
+        ...defaultSpringConfig,
+        ...config
+      }
+    });
+  }
+  calculationCache[cacheKey] = animation;
+  return animation;
+}
+var cache = new Map;
+function measureSpring({
+  fps,
+  config = {},
+  threshold = 0.005
+}) {
+  if (typeof threshold !== "number") {
+    throw new TypeError(\`threshold must be a number, got \${threshold} of type \${typeof threshold}\`);
+  }
+  if (threshold === 0) {
+    return Infinity;
+  }
+  if (threshold === 1) {
+    return 0;
+  }
+  if (isNaN(threshold)) {
+    throw new TypeError("Threshold is NaN");
+  }
+  if (!Number.isFinite(threshold)) {
+    throw new TypeError("Threshold is not finite");
+  }
+  if (threshold < 0) {
+    throw new TypeError("Threshold is below 0");
+  }
+  const cacheKey = [
+    fps,
+    config.damping,
+    config.mass,
+    config.overshootClamping,
+    config.stiffness,
+    threshold
+  ].join("-");
+  if (cache.has(cacheKey)) {
+    return cache.get(cacheKey);
+  }
+  validateFps(fps, "to the measureSpring() function", false);
+  let frame = 0;
+  let finishedFrame = 0;
+  const calc = () => {
+    return springCalculation({
+      fps,
+      frame,
+      config
+    });
+  };
+  let animation = calc();
+  const calcDifference = () => {
+    return Math.abs(animation.current - animation.toValue);
+  };
+  let difference = calcDifference();
+  while (difference >= threshold) {
+    frame++;
+    animation = calc();
+    difference = calcDifference();
+  }
+  finishedFrame = frame;
+  for (let i = 0;i < 20; i++) {
+    frame++;
+    animation = calc();
+    difference = calcDifference();
+    if (difference >= threshold) {
+      i = 0;
+      finishedFrame = frame + 1;
+    }
+  }
+  cache.set(cacheKey, finishedFrame);
+  return finishedFrame;
+}
+function spring({
+  frame: passedFrame,
+  fps,
+  config = {},
+  from = 0,
+  to = 1,
+  durationInFrames: passedDurationInFrames,
+  durationRestThreshold,
+  delay = 0,
+  reverse = false
+}) {
+  validateSpringDuration(passedDurationInFrames);
+  validateFrame({
+    frame: passedFrame,
+    durationInFrames: Infinity,
+    allowFloats: true
+  });
+  validateFps(fps, "to spring()", false);
+  const needsToCalculateNaturalDuration = reverse || typeof passedDurationInFrames !== "undefined";
+  const naturalDuration = needsToCalculateNaturalDuration ? measureSpring({
+    fps,
+    config,
+    threshold: durationRestThreshold
+  }) : undefined;
+  const naturalDurationGetter = needsToCalculateNaturalDuration ? {
+    get: () => naturalDuration
+  } : {
+    get: () => {
+      throw new Error("did not calculate natural duration, this is an error with Remotion. Please report");
+    }
+  };
+  const reverseProcessed = reverse ? (passedDurationInFrames ?? naturalDurationGetter.get()) - passedFrame : passedFrame;
+  const delayProcessed = reverseProcessed + (reverse ? delay : -delay);
+  const durationProcessed = passedDurationInFrames === undefined ? delayProcessed : delayProcessed / (passedDurationInFrames / naturalDurationGetter.get());
+  if (passedDurationInFrames && delayProcessed > passedDurationInFrames) {
+    return to;
+  }
+  const spr = springCalculation({
+    fps,
+    frame: durationProcessed,
+    config
+  });
+  const inner = config.overshootClamping ? to >= from ? Math.min(spr.current, to) : Math.max(spr.current, to) : spr.current;
+  const interpolated = from === 0 && to === 1 ? inner : interpolate(inner, [0, 1], [from, to]);
+  return interpolated;
+}
+var clampUnit = (t) => Math.min(1, Math.max(0, t));
+var springEasingDurationInFrames = 30;
+
+class Easing {
+  static step0(n) {
+    return n > 0 ? 1 : 0;
+  }
+  static step1(n) {
+    return n >= 1 ? 1 : 0;
+  }
+  static linear(t) {
+    return t;
+  }
+  static ease(t) {
+    return Easing.bezier(0.42, 0, 1, 1)(t);
+  }
+  static quad(t) {
+    return t * t;
+  }
+  static cubic(t) {
+    return t * t * t;
+  }
+  static poly(n) {
+    return (t) => t ** n;
+  }
+  static sin(t) {
+    return 1 - Math.cos(t * Math.PI / 2);
+  }
+  static circle(t) {
+    const u = clampUnit(t);
+    return 1 - Math.sqrt(1 - u * u);
+  }
+  static exp(t) {
+    return 2 ** (10 * (t - 1));
+  }
+  static elastic(bounciness = 1) {
+    const p = bounciness * Math.PI;
+    return (t) => 1 - Math.cos(t * Math.PI / 2) ** 3 * Math.cos(t * p);
+  }
+  static back(s = 1.70158) {
+    return (t) => t * t * ((s + 1) * t - s);
+  }
+  static spring({
+    allowTail = false,
+    durationRestThreshold,
+    ...config
+  } = {}) {
+    const easing = (t) => {
+      if (t <= 0) {
+        return 0;
+      }
+      if (!allowTail && t >= 1) {
+        return 1;
+      }
+      if (allowTail) {
+        return spring({
+          fps: springEasingDurationInFrames,
+          frame: t * measureSpring({
+            fps: springEasingDurationInFrames,
+            config,
+            threshold: durationRestThreshold
+          }),
+          config
+        });
+      }
+      return spring({
+        fps: springEasingDurationInFrames,
+        frame: t * springEasingDurationInFrames,
+        config,
+        durationInFrames: springEasingDurationInFrames,
+        durationRestThreshold
+      });
+    };
+    return Object.assign(easing, {
+      remotionShouldExtendRight: allowTail
+    });
+  }
+  static bounce(t) {
+    const u = clampUnit(t);
+    if (u < 1 / 2.75) {
+      return 7.5625 * u * u;
+    }
+    if (u < 2 / 2.75) {
+      const t2_ = u - 1.5 / 2.75;
+      return 7.5625 * t2_ * t2_ + 0.75;
+    }
+    if (u < 2.5 / 2.75) {
+      const t2_ = u - 2.25 / 2.75;
+      return 7.5625 * t2_ * t2_ + 0.9375;
+    }
+    const t2 = u - 2.625 / 2.75;
+    return 7.5625 * t2 * t2 + 0.984375;
+  }
+  static bezier(x1, y1, x2, y2) {
+    return bezier(x1, y1, x2, y2);
+  }
+  static in(easing) {
+    return easing;
+  }
+  static out(easing) {
+    return (t) => 1 - easing(1 - t);
+  }
+  static inOut(easing) {
+    return (t) => {
+      if (t < 0.5) {
+        return easing(t * 2) / 2;
+      }
+      return 1 - easing((1 - t) * 2) / 2;
+    };
+  }
+}
 var normalizeNumber = (value) => {
   return Math.round(value * 1e6) / 1e6;
 };
@@ -1944,10 +3035,13 @@ var transformOriginCenter = { value: 50, unit: "%" };
 var stringifyNumber = (value) => {
   return String(normalizeNumber(value));
 };
+
+class UnsupportedStringInterpolationValueError extends TypeError {
+}
 var parseStringInterpolationComponent = (component, value) => {
   const match = cssNumberRegex.exec(component);
   if (match === null) {
-    throw new TypeError(\`Cannot interpolate "\${value}" because "\${component}" is not a supported scale, translate, or rotate value\`);
+    throw new UnsupportedStringInterpolationValueError(\`Cannot interpolate "\${value}" because "\${component}" is not a supported scale, translate, or rotate value\`);
   }
   const unit = match[2] ?? null;
   const numberValue = Number(match[1]);
@@ -2064,9 +3158,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) => {
@@ -2076,11 +3206,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}"\`);
@@ -2101,24 +3236,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(" ");
   }
@@ -2286,7 +3432,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");
@@ -2298,12 +3463,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) {
@@ -2322,7 +3491,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,
@@ -2335,9 +3504,56 @@ var interpolateString = ({
     kind,
     values,
     units,
-    dimensions
+    dimensions,
+    axisRotation: hasAxisRotation
   });
 };
+var interpolateDiscreteString = ({
+  input,
+  inputRange,
+  outputRange,
+  options
+}) => {
+  if (inputRange.length === 1) {
+    return outputRange[0];
+  }
+  for (let segmentIndex = 0;segmentIndex < inputRange.length - 1; segmentIndex++) {
+    if (resolveEasingForSegment({
+      easing: options?.easing,
+      segmentIndex
+    }) !== Easing.step1) {
+      throw new TypeError("Non-numeric strings can only be interpolated using Easing.step1");
+    }
+  }
+  const posterizedInput = options?.posterize === undefined ? input : Math.floor(input / options.posterize) * options.posterize;
+  const inputMin = inputRange[0];
+  const inputMax = inputRange[inputRange.length - 1];
+  let resolvedInput = posterizedInput;
+  if (resolvedInput < inputMin) {
+    if (options?.extrapolateLeft === "identity") {
+      throw new TypeError('extrapolateLeft: "identity" is not supported for non-numeric strings');
+    }
+    if (options?.extrapolateLeft === "wrap") {
+      const wrapRange = inputMax - inputMin;
+      resolvedInput = ((resolvedInput - inputMin) % wrapRange + wrapRange) % wrapRange + inputMin;
+    } else {
+      return outputRange[0];
+    }
+  }
+  if (resolvedInput > inputMax) {
+    if (options?.extrapolateRight === "identity") {
+      throw new TypeError('extrapolateRight: "identity" is not supported for non-numeric strings');
+    }
+    if (options?.extrapolateRight === "wrap") {
+      const wrapRange = inputMax - inputMin;
+      resolvedInput = ((resolvedInput - inputMin) % wrapRange + wrapRange) % wrapRange + inputMin;
+    } else {
+      return outputRange[outputRange.length - 1];
+    }
+  }
+  const range = findRange(resolvedInput, inputRange);
+  return resolvedInput >= inputRange[range + 1] ? outputRange[range + 1] : outputRange[range];
+};
 var validateTupleOutputRange = (outputRange) => {
   const dimensions = outputRange[0]?.length;
   if (dimensions === undefined) {
@@ -2452,7 +3668,30 @@ function interpolate(input, inputRange, outputRange, options) {
     if (!outputRange.every((output) => typeof output === "string" || typeof output === "number")) {
       throw new TypeError("outputRange must contain only numbers, or supported scale, translate, and rotate strings");
     }
-    return interpolateString({ input, inputRange, outputRange, options });
+    try {
+      return interpolateString({ input, inputRange, outputRange, options });
+    } catch (error) {
+      if (!outputRange.every((output) => typeof output === "string")) {
+        throw error;
+      }
+      const hasNonNumericString = outputRange.some((output) => {
+        try {
+          parseStringInterpolationValue(output);
+          return false;
+        } catch (parseError) {
+          return parseError instanceof UnsupportedStringInterpolationValueError;
+        }
+      });
+      if (!hasNonNumericString) {
+        throw error;
+      }
+      return interpolateDiscreteString({
+        input,
+        inputRange,
+        outputRange,
+        options
+      });
+    }
   }
   if (outputRange.every((output) => Array.isArray(output))) {
     return interpolateTuple({ input, inputRange, outputRange, options });
@@ -2921,8 +4160,8 @@ function hslToRgb(h, s, l) {
   const p = 2 * l - q;
   const r = hue2rgb(p, q, h + 1 / 3);
   const g = hue2rgb(p, q, h);
-  const b = hue2rgb(p, q, h - 1 / 3);
-  return Math.round(r * 255) << 24 | Math.round(g * 255) << 16 | Math.round(b * 255) << 8;
+  const b2 = hue2rgb(p, q, h - 1 / 3);
+  return Math.round(r * 255) << 24 | Math.round(g * 255) << 16 | Math.round(b2 * 255) << 8;
 }
 function parse255(str) {
   const int = Number.parseInt(str, 10);
@@ -2986,25 +4225,25 @@ function parseModernAlpha(str) {
   }
   return Math.max(0, Math.min(1, Number.parseFloat(str)));
 }
-function linearToSrgb(c) {
-  if (c <= 0.0031308)
-    return 12.92 * c;
-  return 1.055 * c ** (1 / 2.4) - 0.055;
+function linearToSrgb(c2) {
+  if (c2 <= 0.0031308)
+    return 12.92 * c2;
+  return 1.055 * c2 ** (1 / 2.4) - 0.055;
 }
 function clamp01(v) {
   return Math.max(0, Math.min(1, v));
 }
-function rgbFloatToInt(r, g, b, alpha) {
+function rgbFloatToInt(r, g, b2, alpha) {
   const ri = Math.round(clamp01(r) * 255);
   const gi = Math.round(clamp01(g) * 255);
-  const bi = Math.round(clamp01(b) * 255);
+  const bi = Math.round(clamp01(b2) * 255);
   const ai = Math.round(clamp01(alpha) * 255);
   return (ri << 24 | gi << 16 | bi << 8 | ai) >>> 0;
 }
-function oklabToSrgb(L, a, b) {
-  const l_ = L + 0.3963377774 * a + 0.2158037573 * b;
-  const m_ = L - 0.1055613458 * a - 0.0638541728 * b;
-  const s_ = L - 0.0894841775 * a - 1.291485548 * b;
+function oklabToSrgb(L, a2, b2) {
+  const l_ = L + 0.3963377774 * a2 + 0.2158037573 * b2;
+  const m_ = L - 0.1055613458 * a2 - 0.0638541728 * b2;
+  const s_ = L - 0.0894841775 * a2 - 1.291485548 * b2;
   const l = l_ * l_ * l_;
   const m = m_ * m_ * m_;
   const s = s_ * s_ * s_;
@@ -3013,15 +4252,15 @@ function oklabToSrgb(L, a, b) {
   const bLin = -0.0041960863 * l - 0.7034186147 * m + 1.707614701 * s;
   return [linearToSrgb(rLin), linearToSrgb(gLin), linearToSrgb(bLin)];
 }
-function labToSrgb(L, a, b) {
+function labToSrgb(L, a2, b2) {
   const epsilon = 216 / 24389;
   const kappa = 24389 / 27;
   const Xn = 0.95047;
   const Yn = 1;
   const Zn = 1.08883;
   const fy = (L + 16) / 116;
-  const fx = a / 500 + fy;
-  const fz = fy - b / 200;
+  const fx = a2 / 500 + fy;
+  const fz = fy - b2 / 200;
   const fx3 = fx * fx * fx;
   const fz3 = fz * fz * fz;
   const xr = fx3 > epsilon ? fx3 : (116 * fx - 16) / kappa;
@@ -3253,27 +4492,27 @@ function normalizeColor(color) {
       const H = parseHueAngle(match[3]);
       const alpha = parseModernAlpha(match[4]);
       const hRad = H * Math.PI / 180;
-      const [r, g, b] = oklabToSrgb(L, C * Math.cos(hRad), C * Math.sin(hRad));
-      return rgbFloatToInt(r, g, b, alpha);
+      const [r, g, b2] = oklabToSrgb(L, C * Math.cos(hRad), C * Math.sin(hRad));
+      return rgbFloatToInt(r, g, b2, alpha);
     }
   }
   if (matchers.oklab) {
     if (match = matchers.oklab.exec(color)) {
       const L = parseModernComponent(match[1], 1);
-      const a = parseModernComponent(match[2], 0.4);
-      const b = parseModernComponent(match[3], 0.4);
+      const a2 = parseModernComponent(match[2], 0.4);
+      const b2 = parseModernComponent(match[3], 0.4);
       const alpha = parseModernAlpha(match[4]);
-      const [r, g, bl] = oklabToSrgb(L, a, b);
+      const [r, g, bl] = oklabToSrgb(L, a2, b2);
       return rgbFloatToInt(r, g, bl, alpha);
     }
   }
   if (matchers.lab) {
     if (match = matchers.lab.exec(color)) {
       const L = parseModernComponent(match[1], 100);
-      const a = parseModernComponent(match[2], 125);
-      const b = parseModernComponent(match[3], 125);
+      const a2 = parseModernComponent(match[2], 125);
+      const b2 = parseModernComponent(match[3], 125);
       const alpha = parseModernAlpha(match[4]);
-      const [r, g, bl] = labToSrgb(L, a, b);
+      const [r, g, bl] = labToSrgb(L, a2, b2);
       return rgbFloatToInt(r, g, bl, alpha);
     }
   }
@@ -3352,30 +4591,6 @@ var serializeScaleValue = ([x, y, z]) => {
   return \`\${normalizedX} \${normalizedY} \${normalizedZ}\`;
 };
 var ENABLE_V5_BREAKING_CHANGES = false;
-var validateFrame = ({
-  allowFloats,
-  durationInFrames,
-  frame
-}) => {
-  if (typeof frame === "undefined") {
-    throw new TypeError(\`Argument missing for parameter "frame"\`);
-  }
-  if (typeof frame !== "number") {
-    throw new TypeError(\`Argument passed for "frame" is not a number: \${frame}\`);
-  }
-  if (!Number.isFinite(frame)) {
-    throw new RangeError(\`Frame \${frame} is not finite\`);
-  }
-  if (frame % 1 !== 0 && !allowFloats) {
-    throw new RangeError(\`Argument for frame must be an integer, but got \${frame}\`);
-  }
-  if (frame < 0 && frame < -durationInFrames) {
-    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the lowest frame that can be rendered is \${-durationInFrames}\`);
-  }
-  if (frame > durationInFrames - 1) {
-    throw new RangeError(\`Cannot use frame \${frame}: Duration of composition is \${durationInFrames}, therefore the highest frame that can be rendered is \${durationInFrames - 1}\`);
-  }
-};
 var validCodecs = [
   "h264",
   "h265",
@@ -3447,23 +4662,6 @@ function validateDurationInFrames(durationInFrames, options) {
     throw new TypeError(\`The "durationInFrames" prop \${component} must be finite, but got \${durationInFrames}.\`);
   }
 }
-function validateFps(fps, location, isGif) {
-  if (typeof fps !== "number") {
-    throw new Error(\`"fps" must be a number, but you passed a value of type \${typeof fps} \${location}\`);
-  }
-  if (!Number.isFinite(fps)) {
-    throw new Error(\`"fps" must be a finite, but you passed \${fps} \${location}\`);
-  }
-  if (isNaN(fps)) {
-    throw new Error(\`"fps" must not be NaN, but got \${fps} \${location}\`);
-  }
-  if (fps <= 0) {
-    throw new TypeError(\`"fps" must be positive, but got \${fps} \${location}\`);
-  }
-  if (isGif && fps > 50) {
-    throw new TypeError(\`The FPS for a GIF cannot be higher than 50. Use the --every-nth-frame option to lower the FPS: https://remotion.dev/docs/render-as-gif\`);
-  }
-}
 var getExpectedMediaFrameUncorrected = ({
   frame,
   playbackRate,