animejs 4.1.2 → 4.2.0-beta.0

package/dist/modules/easings/irregular.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.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.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.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.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/parser.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,
+ *   PowerEasing,
+ *   EasingFunctionWithParams,
+ * } from '../types/index.js'
+*/
+
+/** @type {PowerEasing} */
+const easeInPower = (p = 1.68) => t => helpers.pow(t, +p);
+
+/**
+ * @callback EaseType
+ * @param {EasingFunction} Ease
+ * @return {EasingFunction}
+ */
+
+/** @type {Record<String, EaseType>} */
+const easeTypes = {
+  in: easeIn => t => easeIn(t),
+  out: easeIn => t => 1 - easeIn(1 - t),
+  inOut: easeIn => t => t < .5 ? easeIn(t * 2) / 2 : 1 - easeIn(t * -2 + 2) / 2,
+  outIn: easeIn => t => t < .5 ? (1 - easeIn(1 - t * 2)) / 2 : (easeIn(t * 2 - 1) + 1) / 2,
+};
+
+/**
+ * @param  {String} string
+ * @param  {Record<String, EasingFunctionWithParams|EasingFunction>} easesFunctions
+ * @param  {Object} easesLookups
+ * @return {EasingFunction}
+ */
+const parseEaseString = (string, easesFunctions, easesLookups) => {
+  if (easesLookups[string]) return easesLookups[string];
+  if (string.indexOf('(') <= -1) {
+    const hasParams = easeTypes[string] || string.includes('Back') || string.includes('Elastic');
+    const parsedFn = /** @type {EasingFunction} */(hasParams ? /** @type {EasingFunctionWithParams} */(easesFunctions[string])() : easesFunctions[string]);
+    return parsedFn ? easesLookups[string] = parsedFn : none.none;
+  } else {
+    const split = string.slice(0, -1).split('(');
+    const parsedFn = /** @type {EasingFunctionWithParams} */(easesFunctions[split[0]]);
+    return parsedFn ? easesLookups[string] = parsedFn(...split[1].split(',')) : none.none;
+  }
+};
+
+exports.easeInPower = easeInPower;
+exports.easeTypes = easeTypes;
+exports.parseEaseString = parseEaseString;

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

@@ -0,0 +1,21 @@
+/**
+ * @import {
+ *   EasingFunction,
+ *   PowerEasing,
+ *   EasingFunctionWithParams,
+ * } from '../types/index.js'
+*/
+/** @type {PowerEasing} */
+export const easeInPower: PowerEasing;
+/**
+ * @callback EaseType
+ * @param {EasingFunction} Ease
+ * @return {EasingFunction}
+ */
+/** @type {Record<String, EaseType>} */
+export const easeTypes: Record<string, EaseType>;
+export function parseEaseString(string: string, easesFunctions: Record<string, EasingFunctionWithParams | EasingFunction>, easesLookups: any): EasingFunction;
+export type EaseType = (Ease: EasingFunction) => EasingFunction;
+import type { PowerEasing } from '../types/index.js';
+import type { EasingFunctionWithParams } from '../types/index.js';
+import type { EasingFunction } from '../types/index.js';

package/dist/modules/easings/parser.js

@@ -0,0 +1,55 @@
+/**
+ * Anime.js - easings - ESM
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+import { pow } from '../core/helpers.js';
+import { none } from './none.js';
+
+/**
+ * @import {
+ *   EasingFunction,
+ *   PowerEasing,
+ *   EasingFunctionWithParams,
+ * } from '../types/index.js'
+*/
+
+/** @type {PowerEasing} */
+const easeInPower = (p = 1.68) => t => pow(t, +p);
+
+/**
+ * @callback EaseType
+ * @param {EasingFunction} Ease
+ * @return {EasingFunction}
+ */
+
+/** @type {Record<String, EaseType>} */
+const easeTypes = {
+  in: easeIn => t => easeIn(t),
+  out: easeIn => t => 1 - easeIn(1 - t),
+  inOut: easeIn => t => t < .5 ? easeIn(t * 2) / 2 : 1 - easeIn(t * -2 + 2) / 2,
+  outIn: easeIn => t => t < .5 ? (1 - easeIn(1 - t * 2)) / 2 : (easeIn(t * 2 - 1) + 1) / 2,
+};
+
+/**
+ * @param  {String} string
+ * @param  {Record<String, EasingFunctionWithParams|EasingFunction>} easesFunctions
+ * @param  {Object} easesLookups
+ * @return {EasingFunction}
+ */
+const parseEaseString = (string, easesFunctions, easesLookups) => {
+  if (easesLookups[string]) return easesLookups[string];
+  if (string.indexOf('(') <= -1) {
+    const hasParams = easeTypes[string] || string.includes('Back') || string.includes('Elastic');
+    const parsedFn = /** @type {EasingFunction} */(hasParams ? /** @type {EasingFunctionWithParams} */(easesFunctions[string])() : easesFunctions[string]);
+    return parsedFn ? easesLookups[string] = parsedFn : none;
+  } else {
+    const split = string.slice(0, -1).split('(');
+    const parsedFn = /** @type {EasingFunctionWithParams} */(easesFunctions[split[0]]);
+    return parsedFn ? easesLookups[string] = parsedFn(...split[1].split(',')) : none;
+  }
+};
+
+export { easeInPower, easeTypes, parseEaseString };

package/dist/modules/easings/steps.cjs

@@ -0,0 +1,30 @@
+/**
+ * Anime.js - easings - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+var helpers = require('../core/helpers.cjs');
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../types/index.js'
+*/
+
+/**
+ * Steps ease implementation https://developer.mozilla.org/fr/docs/Web/CSS/transition-timing-function
+ * Only covers 'end' and 'start' jumpterms
+ * @param  {Number} steps
+ * @param  {Boolean} [fromStart]
+ * @return {EasingFunction}
+ */
+const steps = (steps = 10, fromStart) => {
+  const roundMethod = fromStart ? helpers.ceil : helpers.floor;
+  return t => roundMethod(helpers.clamp(t, 0, 1) * steps) * (1 / steps);
+};
+
+exports.steps = steps;

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

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

package/dist/modules/easings/steps.js

@@ -0,0 +1,28 @@
+/**
+ * Anime.js - easings - ESM
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+import { ceil, floor, clamp } from '../core/helpers.js';
+
+/**
+ * @import {
+ *   EasingFunction,
+ * } from '../types/index.js'
+*/
+
+/**
+ * Steps ease implementation https://developer.mozilla.org/fr/docs/Web/CSS/transition-timing-function
+ * Only covers 'end' and 'start' jumpterms
+ * @param  {Number} steps
+ * @param  {Boolean} [fromStart]
+ * @return {EasingFunction}
+ */
+const steps = (steps = 10, fromStart) => {
+  const roundMethod = fromStart ? ceil : floor;
+  return t => roundMethod(clamp(t, 0, 1) * steps) * (1 / steps);
+};
+
+export { steps };

package/dist/modules/engine/engine.cjs

@@ -0,0 +1,168 @@
+/**
+ * Anime.js - engine - CJS
+ * @version v4.2.0
+ * @license MIT
+ * @copyright 2025 - Julian Garnier
+ */
+
+'use strict';
+
+var globals = require('../core/globals.cjs');
+var consts = require('../core/consts.cjs');
+var helpers = require('../core/helpers.cjs');
+var clock = require('../core/clock.cjs');
+var render = require('../core/render.cjs');
+var additive = require('../animation/additive.cjs');
+
+/**
+ * @import {
+ *   DefaultsParams,
+ * } from '../types/index.js'
+*/
+
+/**
+ * @import {
+ *   Tickable,
+ * } from '../types/index.js'
+*/
+
+const engineTickMethod = /*#__PURE__*/ (() => consts.isBrowser ? requestAnimationFrame : setImmediate)();
+const engineCancelMethod = /*#__PURE__*/ (() => consts.isBrowser ? cancelAnimationFrame : clearImmediate)();
+
+class Engine extends clock.Clock {
+
+  /** @param {Number} [initTime] */
+  constructor(initTime) {
+    super(initTime);
+    this.useDefaultMainLoop = true;
+    this.pauseOnDocumentHidden = true;
+    /** @type {DefaultsParams} */
+    this.defaults = globals.defaults;
+    // this.paused = isBrowser && doc.hidden ? true  : false;
+    this.paused = true;
+    /** @type {Number|NodeJS.Immediate} */
+    this.reqId = 0;
+  }
+
+  update() {
+    const time = this._currentTime = helpers.now();
+    if (this.requestTick(time)) {
+      this.computeDeltaTime(time);
+      const engineSpeed = this._speed;
+      const engineFps = this._fps;
+      let activeTickable = /** @type {Tickable} */(this._head);
+      while (activeTickable) {
+        const nextTickable = activeTickable._next;
+        if (!activeTickable.paused) {
+          render.tick(
+            activeTickable,
+            (time - activeTickable._startTime) * activeTickable._speed * engineSpeed,
+            0, // !muteCallbacks
+            0, // !internalRender
+            activeTickable._fps < engineFps ? activeTickable.requestTick(time) : consts.tickModes.AUTO
+          );
+        } else {
+          helpers.removeChild(this, activeTickable);
+          this._hasChildren = !!this._tail;
+          activeTickable._running = false;
+          if (activeTickable.completed && !activeTickable._cancelled) {
+            activeTickable.cancel();
+          }
+        }
+        activeTickable = nextTickable;
+      }
+      additive.additive.update();
+    }
+  }
+
+  wake() {
+    if (this.useDefaultMainLoop && !this.reqId) {
+      // Imediatly request a tick to update engine._elapsedTime and get accurate offsetPosition calculation in timer.js
+      this.requestTick(helpers.now());
+      this.reqId = engineTickMethod(tickEngine);
+    }
+    return this;
+  }
+
+  pause() {
+    if (!this.reqId) return;
+    this.paused = true;
+    return killEngine();
+  }
+
+  resume() {
+    if (!this.paused) return;
+    this.paused = false;
+    helpers.forEachChildren(this, (/** @type {Tickable} */child) => child.resetTime());
+    return this.wake();
+  }
+
+  // Getter and setter for speed
+  get speed() {
+    return this._speed * (globals.globals.timeScale === 1 ? 1 : consts.K);
+  }
+
+  set speed(playbackRate) {
+    this._speed = playbackRate * globals.globals.timeScale;
+    helpers.forEachChildren(this, (/** @type {Tickable} */child) => child.speed = child._speed);
+  }
+
+  // Getter and setter for timeUnit
+  get timeUnit() {
+    return globals.globals.timeScale === 1 ? 'ms' : 's';
+  }
+
+  set timeUnit(unit) {
+    const secondsScale = 0.001;
+    const isSecond = unit === 's';
+    const newScale = isSecond ? secondsScale : 1;
+    if (globals.globals.timeScale !== newScale) {
+      globals.globals.timeScale = newScale;
+      globals.globals.tickThreshold = 200 * newScale;
+      const scaleFactor = isSecond ? secondsScale : consts.K;
+      /** @type {Number} */
+      (this.defaults.duration) *= scaleFactor;
+      this._speed *= scaleFactor;
+    }
+  }
+
+  // Getter and setter for precision
+  get precision() {
+    return globals.globals.precision;
+  }
+
+  set precision(precision) {
+    globals.globals.precision = precision;
+  }
+
+}
+
+const engine = /*#__PURE__*/(() => {
+  const engine = new Engine(helpers.now());
+  if (consts.isBrowser) {
+    globals.globalVersions.engine = engine;
+    consts.doc.addEventListener('visibilitychange', () => {
+      if (!engine.pauseOnDocumentHidden) return;
+      consts.doc.hidden ? engine.pause() : engine.resume();
+    });
+  }
+  return engine;
+})();
+
+
+const tickEngine = () => {
+  if (engine._head) {
+    engine.reqId = engineTickMethod(tickEngine);
+    engine.update();
+  } else {
+    engine.reqId = 0;
+  }
+};
+
+const killEngine = () => {
+  engineCancelMethod(/** @type {NodeJS.Immediate & Number} */(engine.reqId));
+  engine.reqId = 0;
+  return engine;
+};
+
+exports.engine = engine;

package/dist/modules/engine/engine.d.ts

@@ -0,0 +1,21 @@
+export const engine: Engine;
+declare class Engine extends Clock {
+    useDefaultMainLoop: boolean;
+    pauseOnDocumentHidden: boolean;
+    /** @type {DefaultsParams} */
+    defaults: DefaultsParams;
+    paused: boolean;
+    /** @type {Number|NodeJS.Immediate} */
+    reqId: number | NodeJS.Immediate;
+    update(): void;
+    wake(): this;
+    pause(): Engine;
+    resume(): this;
+    set timeUnit(unit: "ms" | "s");
+    get timeUnit(): "ms" | "s";
+    set precision(precision: number);
+    get precision(): number;
+}
+import { Clock } from '../core/clock.js';
+import type { DefaultsParams } from '../types/index.js';
+export {};