animejs 4.1.4 → 4.2.0

package/dist/modules/easings/index.cjs

@@ -0,0 +1,26 @@
+/**
+ * Anime.js - easings - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+var index = require('./cubic-bezier/index.cjs');
+var index$1 = require('./steps/index.cjs');
+var index$2 = require('./linear/index.cjs');
+var index$3 = require('./irregular/index.cjs');
+var index$4 = require('./spring/index.cjs');
+var parser = require('./eases/parser.cjs');
+
+
+
+exports.cubicBezier = index.cubicBezier;
+exports.steps = index$1.steps;
+exports.linear = index$2.linear;
+exports.irregular = index$3.irregular;
+exports.Spring = index$4.Spring;
+exports.createSpring = index$4.createSpring;
+exports.spring = index$4.spring;
+exports.eases = parser.eases;

package/dist/modules/easings/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./cubic-bezier/index.js";
+export * from "./steps/index.js";
+export * from "./linear/index.js";
+export * from "./irregular/index.js";
+export * from "./spring/index.js";
+export * from "./eases/index.js";

package/dist/modules/easings/index.js

@@ -0,0 +1,13 @@
+/**
+ * Anime.js - easings - ESM
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+export { cubicBezier } from './cubic-bezier/index.js';
+export { steps } from './steps/index.js';
+export { linear } from './linear/index.js';
+export { irregular } from './irregular/index.js';
+export { Spring, createSpring, spring } from './spring/index.js';
+export { eases } from './eases/parser.js';

package/dist/modules/easings/irregular/index.cjs

@@ -0,0 +1,41 @@
+/**
+ * Anime.js - easings - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+var helpers = require('../../core/helpers.cjs');
+var index = require('../linear/index.cjs');
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../../types/index.js'
+*/
+
+/**
+ * Generate random steps
+ * @param  {Number} [length] - The number of steps
+ * @param  {Number} [randomness] - How strong the randomness is
+ * @return {EasingFunction}
+ */
+const irregular = (length = 10, randomness = 1) => {
+  const values = [0];
+  const total = length - 1;
+  for (let i = 1; i < total; i++) {
+    const previousValue = values[i - 1];
+    const spacing = i / total;
+    const segmentEnd = (i + 1) / total;
+    const randomVariation = spacing + (segmentEnd - spacing) * Math.random();
+    // Mix the even spacing and random variation based on the randomness parameter
+    const randomValue = spacing * (1 - randomness) + randomVariation * randomness;
+    values.push(helpers.clamp(randomValue, previousValue, 1));
+  }
+  values.push(1);
+  return index.linear(...values);
+};
+
+exports.irregular = irregular;

package/dist/modules/easings/irregular/index.d.ts

@@ -0,0 +1,2 @@
+export function irregular(length?: number, randomness?: number): EasingFunction;
+import type { EasingFunction } from '../../types/index.js';

package/dist/modules/easings/irregular/index.js

@@ -0,0 +1,39 @@
+/**
+ * Anime.js - easings - ESM
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+import { clamp } from '../../core/helpers.js';
+import { linear } from '../linear/index.js';
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../../types/index.js'
+*/
+
+/**
+ * Generate random steps
+ * @param  {Number} [length] - The number of steps
+ * @param  {Number} [randomness] - How strong the randomness is
+ * @return {EasingFunction}
+ */
+const irregular = (length = 10, randomness = 1) => {
+  const values = [0];
+  const total = length - 1;
+  for (let i = 1; i < total; i++) {
+    const previousValue = values[i - 1];
+    const spacing = i / total;
+    const segmentEnd = (i + 1) / total;
+    const randomVariation = spacing + (segmentEnd - spacing) * Math.random();
+    // Mix the even spacing and random variation based on the randomness parameter
+    const randomValue = spacing * (1 - randomness) + randomVariation * randomness;
+    values.push(clamp(randomValue, previousValue, 1));
+  }
+  values.push(1);
+  return linear(...values);
+};
+
+export { irregular };

package/dist/modules/easings/linear/index.cjs

@@ -0,0 +1,59 @@
+/**
+ * Anime.js - easings - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+var helpers = require('../../core/helpers.cjs');
+var none = require('../none.cjs');
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../../types/index.js'
+*/
+
+/**
+ * Without parameters, the linear function creates a non-eased transition.
+ * Parameters, if used, creates a piecewise linear easing by interpolating linearly between the specified points.
+ *
+ * @param  {...(String|Number)} args - Points
+ * @return {EasingFunction}
+ */
+const linear = (...args) => {
+  const argsLength = args.length;
+  if (!argsLength) return none.none;
+  const totalPoints = argsLength - 1;
+  const firstArg = args[0];
+  const lastArg = args[totalPoints];
+  const xPoints = [0];
+  const yPoints = [helpers.parseNumber(firstArg)];
+  for (let i = 1; i < totalPoints; i++) {
+    const arg = args[i];
+    const splitValue = helpers.isStr(arg) ?
+    /** @type {String} */(arg).trim().split(' ') :
+    [arg];
+    const value = splitValue[0];
+    const percent = splitValue[1];
+    xPoints.push(!helpers.isUnd(percent) ? helpers.parseNumber(percent) / 100 : i / totalPoints);
+    yPoints.push(helpers.parseNumber(value));
+  }
+  yPoints.push(helpers.parseNumber(lastArg));
+  xPoints.push(1);
+  return function easeLinear(t) {
+    for (let i = 1, l = xPoints.length; i < l; i++) {
+      const currentX = xPoints[i];
+      if (t <= currentX) {
+        const prevX = xPoints[i - 1];
+        const prevY = yPoints[i - 1];
+        return prevY + (yPoints[i] - prevY) * (t - prevX) / (currentX - prevX);
+      }
+    }
+    return yPoints[yPoints.length - 1];
+  }
+};
+
+exports.linear = linear;

package/dist/modules/easings/linear/index.d.ts

@@ -0,0 +1,2 @@
+export function linear(...args: (string | number)[]): EasingFunction;
+import type { EasingFunction } from '../../types/index.js';

package/dist/modules/easings/linear/index.js

@@ -0,0 +1,57 @@
+/**
+ * Anime.js - easings - ESM
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+import { isStr, parseNumber, isUnd } from '../../core/helpers.js';
+import { none } from '../none.js';
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../../types/index.js'
+*/
+
+/**
+ * Without parameters, the linear function creates a non-eased transition.
+ * Parameters, if used, creates a piecewise linear easing by interpolating linearly between the specified points.
+ *
+ * @param  {...(String|Number)} args - Points
+ * @return {EasingFunction}
+ */
+const linear = (...args) => {
+  const argsLength = args.length;
+  if (!argsLength) return none;
+  const totalPoints = argsLength - 1;
+  const firstArg = args[0];
+  const lastArg = args[totalPoints];
+  const xPoints = [0];
+  const yPoints = [parseNumber(firstArg)];
+  for (let i = 1; i < totalPoints; i++) {
+    const arg = args[i];
+    const splitValue = isStr(arg) ?
+    /** @type {String} */(arg).trim().split(' ') :
+    [arg];
+    const value = splitValue[0];
+    const percent = splitValue[1];
+    xPoints.push(!isUnd(percent) ? parseNumber(percent) / 100 : i / totalPoints);
+    yPoints.push(parseNumber(value));
+  }
+  yPoints.push(parseNumber(lastArg));
+  xPoints.push(1);
+  return function easeLinear(t) {
+    for (let i = 1, l = xPoints.length; i < l; i++) {
+      const currentX = xPoints[i];
+      if (t <= currentX) {
+        const prevX = xPoints[i - 1];
+        const prevY = yPoints[i - 1];
+        return prevY + (yPoints[i] - prevY) * (t - prevX) / (currentX - prevX);
+      }
+    }
+    return yPoints[yPoints.length - 1];
+  }
+};
+
+export { linear };

package/dist/modules/easings/none.cjs

@@ -0,0 +1,19 @@
+/**
+ * Anime.js - easings - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../types/index.js'
+*/
+
+/** @type {EasingFunction} */
+const none = t => t;
+
+exports.none = none;

package/dist/modules/easings/none.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../types/index.js'
+*/
+/** @type {EasingFunction} */
+export const none: EasingFunction;
+import type { EasingFunction } from '../types/index.js';

package/dist/modules/easings/none.js

@@ -0,0 +1,17 @@
+/**
+ * Anime.js - easings - ESM
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../types/index.js'
+*/
+
+/** @type {EasingFunction} */
+const none = t => t;
+
+export { none };

package/dist/modules/easings/spring/index.cjs

@@ -0,0 +1,255 @@
+/**
+ * Anime.js - easings - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+var consts = require('../../core/consts.cjs');
+var globals = require('../../core/globals.cjs');
+var helpers = require('../../core/helpers.cjs');
+var values = require('../../core/values.cjs');
+
+/**
+ * @import {
+ *   JSAnimation,
+ * } from '../../animation/animation.js'
+ */
+
+/**
+ * @import {
+ *   EasingFunction,
+ *   SpringParams,
+ *   Callback,
+ * } from '../../types/index.js'
+*/
+
+/*
+ * Spring easing solver adapted from https://webkit.org/demos/spring/spring.js
+ * (c) 2016 Webkit - Apple Inc
+ */
+
+const maxSpringParamValue = consts.K * 10;
+
+class Spring {
+  /**
+   * @param {SpringParams} [parameters]
+   */
+  constructor(parameters = {}) {
+    const hasBounceOrDuration = !helpers.isUnd(parameters.bounce) || !helpers.isUnd(parameters.duration);
+    this.timeStep = .02; // Interval fed to the solver to calculate duration
+    this.restThreshold = .0005; // Values below this threshold are considered resting position
+    this.restDuration = 200; // Duration in ms used to check if the spring is resting after reaching restThreshold
+    this.maxDuration = 60000; // The maximum allowed spring duration in ms (default 1 min)
+    this.maxRestSteps = this.restDuration / this.timeStep / consts.K; // How many steps allowed after reaching restThreshold before stopping the duration calculation
+    this.maxIterations = this.maxDuration / this.timeStep / consts.K; // Calculate the maximum iterations allowed based on maxDuration
+    this.bn = helpers.clamp(values.setValue(parameters.bounce, .5), -1, 1); // The bounce percentage between -1 and 1.
+    this.pd = helpers.clamp(values.setValue(parameters.duration, 628), 10 * globals.globals.timeScale, maxSpringParamValue * globals.globals.timeScale); // The perceived duration
+    this.m = helpers.clamp(values.setValue(parameters.mass, 1), 1, maxSpringParamValue);
+    this.s = helpers.clamp(values.setValue(parameters.stiffness, 100), consts.minValue, maxSpringParamValue);
+    this.d = helpers.clamp(values.setValue(parameters.damping, 10), consts.minValue, maxSpringParamValue);
+    this.v = helpers.clamp(values.setValue(parameters.velocity, 0), -maxSpringParamValue, maxSpringParamValue);
+    this.w0 = 0;
+    this.zeta = 0;
+    this.wd = 0;
+    this.b = 0;
+    this.completed = false;
+    this.solverDuration = 0;
+    this.settlingDuration = 0;
+    /** @type {JSAnimation} */
+    this.parent = null;
+    /** @type {Callback<JSAnimation>} */
+    this.onComplete = parameters.onComplete || consts.noop;
+    if (hasBounceOrDuration) this.calculateSDFromBD();
+    this.compute();
+    /** @type {EasingFunction} */
+    this.ease = t => {
+      const currentTime = t * this.settlingDuration;
+      const completed = this.completed;
+      const perceivedTime = this.pd;
+      if (currentTime >= perceivedTime && !completed) {
+        this.completed = true;
+        this.onComplete(this.parent);
+      }
+      if (currentTime < perceivedTime && completed) {
+        this.completed = false;
+      }
+      return t === 0 || t === 1 ? t : this.solve(t * this.solverDuration);
+    };
+  }
+
+  /** @type {EasingFunction} */
+  solve(time) {
+    const { zeta, w0, wd, b } = this;
+    let t = time;
+    if (zeta < 1) {
+      // Underdamped
+      t = helpers.exp(-t * zeta * w0) * (1 * helpers.cos(wd * t) + b * helpers.sin(wd * t));
+    } else if (zeta === 1) {
+      // Critically damped
+      t = (1 + b * t) * helpers.exp(-t * w0);
+    } else {
+      // Overdamped
+      // Using exponential instead of cosh and sinh functions to prevent Infinity
+      // Original exp(-zeta * w0 * t) * (cosh(wd * t) + b * sinh(wd * t))
+      t = ((1 + b) * helpers.exp((-zeta * w0 + wd) * t) + (1 - b) * helpers.exp((-zeta * w0 - wd) * t)) / 2;
+    }
+    return 1 - t;
+  }
+
+  calculateSDFromBD() {
+    // Apple's SwiftUI perceived spring duration implementation https://developer.apple.com/videos/play/wwdc2023/10158/?time=1010
+    // Equations taken from Kevin Grajeda's article https://www.kvin.me/posts/effortless-ui-spring-animations
+    const pds = globals.globals.timeScale === 1 ? this.pd / consts.K : this.pd;
+    // Mass and velocity should be set to their default values
+    this.m = 1;
+    this.v = 0;
+    // Stiffness = (2π ÷ perceptualDuration)²
+    this.s = helpers.pow((2 * helpers.PI) / pds, 2);
+    if (this.bn >= 0) {
+      // For bounce ≥ 0 (critically damped to underdamped)
+      // damping = ((1 - bounce) × 4π) ÷ perceptualDuration
+      this.d = ((1 - this.bn) * 4 * helpers.PI) / pds;
+    } else {
+      // For bounce < 0 (overdamped)
+      // damping = 4π ÷ (perceptualDuration × (1 + bounce))
+      // Note: (1 + bounce) is positive since bounce is negative
+      this.d = (4 * helpers.PI) / (pds * (1 + this.bn));
+    }
+    this.s = helpers.round(helpers.clamp(this.s, consts.minValue, maxSpringParamValue), 3);
+    this.d = helpers.round(helpers.clamp(this.d, consts.minValue, 300), 3); // Clamping to 300 is needed to prevent insane values in the solver
+  }
+
+  calculateBDFromSD() {
+    // Calculate perceived duration and bounce from stiffness and damping
+    // Note: We assumes m = 1 and v = 0 for these calculations
+    const pds = (2 * helpers.PI) / helpers.sqrt(this.s);
+    this.pd = pds * (globals.globals.timeScale === 1 ? consts.K : 1);
+    const zeta = this.d / (2 * helpers.sqrt(this.s));
+    if (zeta <= 1) {
+      // Critically damped to underdamped
+      this.bn = 1 - (this.d * pds) / (4 * helpers.PI);
+    } else {
+      // Overdamped
+      this.bn = (4 * helpers.PI) / (this.d * pds) - 1;
+    }
+    this.bn = helpers.round(helpers.clamp(this.bn, -1, 1), 3);
+    this.pd = helpers.round(helpers.clamp(this.pd, 10 * globals.globals.timeScale, maxSpringParamValue * globals.globals.timeScale), 3);
+  }
+
+  compute() {
+    const { maxRestSteps, maxIterations, restThreshold, timeStep, m, d, s, v } = this;
+    const w0 = this.w0 = helpers.clamp(helpers.sqrt(s / m), consts.minValue, consts.K);
+    const bouncedZeta = this.zeta = d / (2 * helpers.sqrt(s * m));
+    // Calculate wd based on damping type
+    if (bouncedZeta < 1) {
+      // Underdamped
+      this.wd = w0 * helpers.sqrt(1 - bouncedZeta * bouncedZeta);
+      this.b = (bouncedZeta * w0 + -v) / this.wd;
+    } else if (bouncedZeta === 1) {
+      // Critically damped
+      this.wd = 0;
+      this.b = -v + w0;
+    } else {
+      // Overdamped
+      this.wd = w0 * helpers.sqrt(bouncedZeta * bouncedZeta - 1);
+      this.b = (bouncedZeta * w0 + -v) / this.wd;
+    }
+
+    let solverTime = 0;
+    let restSteps = 0;
+    let iterations = 0;
+    while (restSteps <= maxRestSteps && iterations <= maxIterations) {
+      if (helpers.abs(1 - this.solve(solverTime)) < restThreshold) {
+        restSteps++;
+      } else {
+        restSteps = 0;
+      }
+      this.solverDuration = solverTime;
+      solverTime += timeStep;
+      iterations++;
+    }
+    this.settlingDuration = helpers.round(this.solverDuration * consts.K, 0) * globals.globals.timeScale;
+  }
+
+  get bounce() {
+    return this.bn;
+  }
+
+  set bounce(v) {
+    this.bn = helpers.clamp(values.setValue(v, 1), -1, 1);
+    this.calculateSDFromBD();
+    this.compute();
+  }
+
+  get duration() {
+    return this.pd;
+  }
+
+  set duration(v) {
+    this.pd = helpers.clamp(values.setValue(v, 1), 10 * globals.globals.timeScale, maxSpringParamValue * globals.globals.timeScale);
+    this.calculateSDFromBD();
+    this.compute();
+  }
+
+  get stiffness() {
+    return this.s;
+  }
+
+  set stiffness(v) {
+    this.s = helpers.clamp(values.setValue(v, 100), consts.minValue, maxSpringParamValue);
+    this.calculateBDFromSD();
+    this.compute();
+  }
+
+  get damping() {
+    return this.d;
+  }
+
+  set damping(v) {
+    this.d = helpers.clamp(values.setValue(v, 10), consts.minValue, maxSpringParamValue);
+    this.calculateBDFromSD();
+    this.compute();
+  }
+
+  get mass() {
+    return this.m;
+  }
+
+  set mass(v) {
+    this.m = helpers.clamp(values.setValue(v, 1), 1, maxSpringParamValue);
+    this.compute();
+  }
+
+  get velocity() {
+    return this.v;
+  }
+
+  set velocity(v) {
+    this.v = helpers.clamp(values.setValue(v, 0), -maxSpringParamValue, maxSpringParamValue);
+    this.compute();
+  }
+}
+
+/**
+ * @param {SpringParams} [parameters]
+ * @returns {Spring}
+ */
+const spring = (parameters) => new Spring(parameters);
+
+/**
+ * @deprecated createSpring() is deprecated use spring() instead
+ *
+ * @param {SpringParams} [parameters]
+ * @returns {Spring}
+ */
+const createSpring = (parameters) => {
+  console.warn('createSpring() is deprecated use spring() instead');
+  return new Spring(parameters);
+};
+
+exports.Spring = Spring;
+exports.createSpring = createSpring;
+exports.spring = spring;

package/dist/modules/easings/spring/index.d.ts

@@ -0,0 +1,53 @@
+export class Spring {
+    /**
+     * @param {SpringParams} [parameters]
+     */
+    constructor(parameters?: SpringParams);
+    timeStep: number;
+    restThreshold: number;
+    restDuration: number;
+    maxDuration: number;
+    maxRestSteps: number;
+    maxIterations: number;
+    bn: number;
+    pd: number;
+    m: number;
+    s: number;
+    d: number;
+    v: number;
+    w0: number;
+    zeta: number;
+    wd: number;
+    b: number;
+    completed: boolean;
+    solverDuration: number;
+    settlingDuration: number;
+    /** @type {JSAnimation} */
+    parent: JSAnimation;
+    /** @type {Callback<JSAnimation>} */
+    onComplete: Callback<JSAnimation>;
+    /** @type {EasingFunction} */
+    ease: EasingFunction;
+    solve(time: number): number;
+    calculateSDFromBD(): void;
+    calculateBDFromSD(): void;
+    compute(): void;
+    set bounce(v: number);
+    get bounce(): number;
+    set duration(v: number);
+    get duration(): number;
+    set stiffness(v: number);
+    get stiffness(): number;
+    set damping(v: number);
+    get damping(): number;
+    set mass(v: number);
+    get mass(): number;
+    set velocity(v: number);
+    get velocity(): number;
+}
+export function spring(parameters?: SpringParams): Spring;
+export function createSpring(parameters?: SpringParams): Spring;
+import type { JSAnimation } from '../../animation/animation.js';
+import type { Callback } from '../../types/index.js';
+import type { EasingFunction } from '../../types/index.js';
+import type { SpringParams } from '../../types/index.js';