animejs 4.2.0-beta.0 → 4.2.1

package/dist/modules/animation/animation.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - animation - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -14,7 +14,7 @@ var targets = require('../core/targets.cjs');
 var values = require('../core/values.cjs');
 var styles = require('../core/styles.cjs');
 var units = require('../core/units.cjs');
-var eases = require('../easings/eases.cjs');
+var parser = require('../easings/eases/parser.cjs');
 var timer = require('../timer/timer.cjs');
 var composition = require('./composition.cjs');
 var additive = require('./additive.cjs');
@@ -45,13 +45,14 @@ var additive = require('./additive.cjs');
  *
  * @import {
  *   Spring,
- * } from '../spring/spring.js'
+ * } from '../easings/spring/index.js'
  */
 
 // Defines decomposed values target objects only once and mutate their properties later to avoid GC
 // TODO: Maybe move the objects creation to values.js and use the decompose function to create the base object
 const fromTargetObject = values.createDecomposedValueTargetObject();
 const toTargetObject = values.createDecomposedValueTargetObject();
+const inlineStylesStore = {};
 const toFunctionStore = { func: null };
 const keyframesTargetArray = [null];
 const fastSetValuesArray = [null, null];
@@ -193,18 +194,18 @@ class JSAnimation extends timer.Timer {
 
     const animDefaults = parent ? parent.defaults : globals.globals.defaults;
     const animaPlaybackEase = values.setValue(playbackEase, animDefaults.playbackEase);
-    const animEase = animaPlaybackEase ? eases.parseEase(animaPlaybackEase) : null;
+    const animEase = animaPlaybackEase ? parser.parseEase(animaPlaybackEase) : null;
     const hasSpring = !helpers.isUnd(ease) && !helpers.isUnd(/** @type {Spring} */(ease).ease);
     const tEasing = hasSpring ? /** @type {Spring} */(ease).ease : values.setValue(ease, animEase ? 'linear' : animDefaults.ease);
-    const tDuration = hasSpring ? /** @type {Spring} */(ease).duration : values.setValue(duration, animDefaults.duration);
+    const tDuration = hasSpring ? /** @type {Spring} */(ease).settlingDuration : values.setValue(duration, animDefaults.duration);
     const tDelay = values.setValue(delay, animDefaults.delay);
     const tModifier = modifier || animDefaults.modifier;
     // If no composition is defined and the targets length is high (>= 1000) set the composition to 'none' (0) for faster tween creation
     const tComposition = helpers.isUnd(composition$1) && targetsLength >= consts.K ? consts.compositionTypes.none : !helpers.isUnd(composition$1) ? composition$1 : animDefaults.composition;
-    // TODO: Do not create an empty object until we know the animation will generate inline styles
-    const animInlineStyles = {};
     // const absoluteOffsetTime = this._offset;
     const absoluteOffsetTime = this._offset + (parent ? parent._offset : 0);
+    // This allows targeting the current animation in the spring onComplete callback
+    if (hasSpring) /** @type {Spring} */(ease).parent = this;
 
     let iterationDuration = NaN;
     let iterationDelay = NaN;
@@ -306,7 +307,7 @@ class JSAnimation extends timer.Timer {
             // Easing are treated differently and don't accept function based value to prevent having to pass a function wrapper that returns an other function all the time
             const tweenEasing = hasSpring ? /** @type {Spring} */(keyEasing).ease : keyEasing || tEasing;
             // Calculate default individual keyframe duration by dividing the tl of keyframes
-            const tweenDuration = hasSpring ? /** @type {Spring} */(keyEasing).duration : values.getFunctionValue(values.setValue(key.duration, (l > 1 ? values.getFunctionValue(tDuration, target, ti, tl) / l : tDuration)), target, ti, tl);
+            const tweenDuration = hasSpring ? /** @type {Spring} */(keyEasing).settlingDuration : values.getFunctionValue(values.setValue(key.duration, (l > 1 ? values.getFunctionValue(tDuration, target, ti, tl) / l : tDuration)), target, ti, tl);
             // Default delay value should only be applied to the first tween
             const tweenDelay = values.getFunctionValue(values.setValue(key.delay, (!tweenIndex ? tDelay : 0)), target, ti, tl);
             const computedComposition = values.getFunctionValue(values.setValue(key.composition, tComposition), target, ti, tl);
@@ -356,7 +357,7 @@ class JSAnimation extends timer.Timer {
                   }
                 } else {
                   values.decomposeRawValue(
-                    values.getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles),
+                    values.getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore),
                     values.decomposedOriginalValue
                   );
                   if (values.decomposedOriginalValue.t === consts.valueTypes.UNIT) {
@@ -374,7 +375,7 @@ class JSAnimation extends timer.Timer {
                 } else {
                   // No need to get and parse the original value if the tween is part of a timeline and has a previous sibling part of the same timeline
                   values.decomposeRawValue(parent && prevSibling && prevSibling.parent.parent === parent ? prevSibling._value :
-                  values.getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles), toTargetObject);
+                  values.getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore), toTargetObject);
                 }
               }
               if (hasFromvalue) {
@@ -385,7 +386,7 @@ class JSAnimation extends timer.Timer {
                 } else {
                   values.decomposeRawValue(parent && prevSibling && prevSibling.parent.parent === parent ? prevSibling._value :
                   // No need to get and parse the original value if the tween is part of a timeline and has a previous sibling part of the same timeline
-                  values.getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles), fromTargetObject);
+                  values.getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore), fromTargetObject);
                 }
               }
             }
@@ -394,7 +395,7 @@ class JSAnimation extends timer.Timer {
             if (fromTargetObject.o) {
               fromTargetObject.n = values.getRelativeValue(
                 !prevSibling ? values.decomposeRawValue(
-                  values.getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles),
+                  values.getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore),
                   values.decomposedOriginalValue
                 ).n : prevSibling._toNumber,
                 fromTargetObject.n,
@@ -450,6 +451,10 @@ class JSAnimation extends timer.Timer {
             // Rounding is necessary here to minimize floating point errors when working in seconds
             const tweenUpdateDuration = helpers.round(+tweenDuration || consts.minValue, 12);
 
+            // Copy the value of the iniline style if it exist and imediatly nullify it to prevents false positive on other targets
+            let inlineValue = inlineStylesStore[propName];
+            if (!helpers.isNil(inlineValue)) inlineStylesStore[propName] = null;
+
             /** @type {Tween} */
             const tween = {
               parent: this,
@@ -458,7 +463,7 @@ class JSAnimation extends timer.Timer {
               target: target,
               _value: null,
               _func: toFunctionStore.func,
-              _ease: eases.parseEase(tweenEasing),
+              _ease: parser.parseEase(tweenEasing),
               _fromNumbers: helpers.cloneArray(fromTargetObject.d),
               _toNumbers: helpers.cloneArray(toTargetObject.d),
               _strings: helpers.cloneArray(toTargetObject.s),
@@ -481,6 +486,7 @@ class JSAnimation extends timer.Timer {
               _isOverlapped: 0,
               _isOverridden: 0,
               _renderTransforms: 0,
+              _inlineValue: inlineValue,
               _prevRep: null, // For replaced tween
               _nextRep: null, // For replaced tween
               _prevAdd: null, // For additive tween
@@ -583,8 +589,6 @@ class JSAnimation extends timer.Timer {
     // this._offset += parent ? iterationDelay : 0;
     /** @type {Number} */
     this.iterationDuration = iterationDuration;
-    /** @type {{}} */
-    this._inlineStyles = animInlineStyles;
 
     if (!this._autoplay && shouldTriggerRender) this.onRender(this);
   }
@@ -618,6 +622,7 @@ class JSAnimation extends timer.Timer {
       if (tweenFunc) {
         const ogValue = values.getOriginalAnimatableValue(tween.target, tween.property, tween._tweenType);
         values.decomposeRawValue(ogValue, values.decomposedOriginalValue);
+        // TODO: Check for from / to Array based values here,
         values.decomposeRawValue(tweenFunc(), toTargetObject);
         tween._fromNumbers = helpers.cloneArray(values.decomposedOriginalValue.d);
         tween._fromNumber = values.decomposedOriginalValue.n;
@@ -627,6 +632,8 @@ class JSAnimation extends timer.Timer {
         tween._toNumber = toTargetObject.o ? values.getRelativeValue(values.decomposedOriginalValue.n, toTargetObject.n, toTargetObject.o) : toTargetObject.n;
       }
     });
+    // This forces setter animations to render once
+    if (this.duration === consts.minValue) this.restart();
     return this;
   }
 
@@ -640,8 +647,12 @@ class JSAnimation extends timer.Timer {
   }
 
   /**
-   * @param  {Callback<this>} [callback]
-   * @return {Promise}
+   * @typedef {this & {then: null}} ResolvedJSAnimation
+   */
+
+  /**
+   * @param  {Callback<ResolvedJSAnimation>} [callback]
+   * @return Promise<this>
    */
   then(callback) {
     return super.then(callback);

package/dist/modules/animation/animation.d.ts

@@ -15,8 +15,6 @@ export class JSAnimation extends Timer {
     onRender: Callback<this>;
     /** @type {EasingFunction} */
     _ease: EasingFunction;
-    /** @type {{}} */
-    _inlineStyles: {};
     /**
      * @param  {Number} newDuration
      * @return {this}
@@ -32,10 +30,15 @@ export class JSAnimation extends Timer {
      */
     revert(): this;
     /**
-     * @param  {Callback<this>} [callback]
-     * @return {Promise}
+     * @typedef {this & {then: null}} ResolvedJSAnimation
      */
-    then(callback?: Callback<this>): Promise<any>;
+    /**
+     * @param  {Callback<ResolvedJSAnimation>} [callback]
+     * @return Promise<this>
+     */
+    then(callback?: Callback<this & {
+        then: null;
+    }>): Promise<any>;
 }
 export function animate(targets: TargetsParam, parameters: AnimationParams): JSAnimation;
 import { Timer } from '../timer/timer.js';

package/dist/modules/animation/animation.js

@@ -1,18 +1,18 @@
 /**
  * Anime.js - animation - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
 
 import { K, compositionTypes, valueTypes, minValue, tweenTypes } from '../core/consts.js';
-import { mergeObjects, isUnd, isKey, isObj, round, cloneArray, addChild, forEachChildren, clampInfinity, normalizeTime, isArr, isNum } from '../core/helpers.js';
+import { mergeObjects, isUnd, isKey, isObj, round, cloneArray, isNil, addChild, forEachChildren, clampInfinity, normalizeTime, isArr, isNum } from '../core/helpers.js';
 import { globals } from '../core/globals.js';
 import { registerTargets } from '../core/targets.js';
 import { setValue, getTweenType, getFunctionValue, decomposeRawValue, createDecomposedValueTargetObject, getOriginalAnimatableValue, decomposedOriginalValue, getRelativeValue, decomposeTweenValue } from '../core/values.js';
 import { sanitizePropertyName, cleanInlineStyles } from '../core/styles.js';
 import { convertValueUnit } from '../core/units.js';
-import { parseEase } from '../easings/eases.js';
+import { parseEase } from '../easings/eases/parser.js';
 import { Timer } from '../timer/timer.js';
 import { getTweenSiblings, overrideTween, composeTween } from './composition.js';
 import { additive } from './additive.js';
@@ -43,13 +43,14 @@ import { additive } from './additive.js';
  *
  * @import {
  *   Spring,
- * } from '../spring/spring.js'
+ * } from '../easings/spring/index.js'
  */
 
 // Defines decomposed values target objects only once and mutate their properties later to avoid GC
 // TODO: Maybe move the objects creation to values.js and use the decompose function to create the base object
 const fromTargetObject = createDecomposedValueTargetObject();
 const toTargetObject = createDecomposedValueTargetObject();
+const inlineStylesStore = {};
 const toFunctionStore = { func: null };
 const keyframesTargetArray = [null];
 const fastSetValuesArray = [null, null];
@@ -194,15 +195,15 @@ class JSAnimation extends Timer {
     const animEase = animaPlaybackEase ? parseEase(animaPlaybackEase) : null;
     const hasSpring = !isUnd(ease) && !isUnd(/** @type {Spring} */(ease).ease);
     const tEasing = hasSpring ? /** @type {Spring} */(ease).ease : setValue(ease, animEase ? 'linear' : animDefaults.ease);
-    const tDuration = hasSpring ? /** @type {Spring} */(ease).duration : setValue(duration, animDefaults.duration);
+    const tDuration = hasSpring ? /** @type {Spring} */(ease).settlingDuration : setValue(duration, animDefaults.duration);
     const tDelay = setValue(delay, animDefaults.delay);
     const tModifier = modifier || animDefaults.modifier;
     // If no composition is defined and the targets length is high (>= 1000) set the composition to 'none' (0) for faster tween creation
     const tComposition = isUnd(composition) && targetsLength >= K ? compositionTypes.none : !isUnd(composition) ? composition : animDefaults.composition;
-    // TODO: Do not create an empty object until we know the animation will generate inline styles
-    const animInlineStyles = {};
     // const absoluteOffsetTime = this._offset;
     const absoluteOffsetTime = this._offset + (parent ? parent._offset : 0);
+    // This allows targeting the current animation in the spring onComplete callback
+    if (hasSpring) /** @type {Spring} */(ease).parent = this;
 
     let iterationDuration = NaN;
     let iterationDelay = NaN;
@@ -304,7 +305,7 @@ class JSAnimation extends Timer {
             // Easing are treated differently and don't accept function based value to prevent having to pass a function wrapper that returns an other function all the time
             const tweenEasing = hasSpring ? /** @type {Spring} */(keyEasing).ease : keyEasing || tEasing;
             // Calculate default individual keyframe duration by dividing the tl of keyframes
-            const tweenDuration = hasSpring ? /** @type {Spring} */(keyEasing).duration : getFunctionValue(setValue(key.duration, (l > 1 ? getFunctionValue(tDuration, target, ti, tl) / l : tDuration)), target, ti, tl);
+            const tweenDuration = hasSpring ? /** @type {Spring} */(keyEasing).settlingDuration : getFunctionValue(setValue(key.duration, (l > 1 ? getFunctionValue(tDuration, target, ti, tl) / l : tDuration)), target, ti, tl);
             // Default delay value should only be applied to the first tween
             const tweenDelay = getFunctionValue(setValue(key.delay, (!tweenIndex ? tDelay : 0)), target, ti, tl);
             const computedComposition = getFunctionValue(setValue(key.composition, tComposition), target, ti, tl);
@@ -354,7 +355,7 @@ class JSAnimation extends Timer {
                   }
                 } else {
                   decomposeRawValue(
-                    getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles),
+                    getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore),
                     decomposedOriginalValue
                   );
                   if (decomposedOriginalValue.t === valueTypes.UNIT) {
@@ -372,7 +373,7 @@ class JSAnimation extends Timer {
                 } else {
                   // No need to get and parse the original value if the tween is part of a timeline and has a previous sibling part of the same timeline
                   decomposeRawValue(parent && prevSibling && prevSibling.parent.parent === parent ? prevSibling._value :
-                  getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles), toTargetObject);
+                  getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore), toTargetObject);
                 }
               }
               if (hasFromvalue) {
@@ -383,7 +384,7 @@ class JSAnimation extends Timer {
                 } else {
                   decomposeRawValue(parent && prevSibling && prevSibling.parent.parent === parent ? prevSibling._value :
                   // No need to get and parse the original value if the tween is part of a timeline and has a previous sibling part of the same timeline
-                  getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles), fromTargetObject);
+                  getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore), fromTargetObject);
                 }
               }
             }
@@ -392,7 +393,7 @@ class JSAnimation extends Timer {
             if (fromTargetObject.o) {
               fromTargetObject.n = getRelativeValue(
                 !prevSibling ? decomposeRawValue(
-                  getOriginalAnimatableValue(target, propName, tweenType, animInlineStyles),
+                  getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore),
                   decomposedOriginalValue
                 ).n : prevSibling._toNumber,
                 fromTargetObject.n,
@@ -448,6 +449,10 @@ class JSAnimation extends Timer {
             // Rounding is necessary here to minimize floating point errors when working in seconds
             const tweenUpdateDuration = round(+tweenDuration || minValue, 12);
 
+            // Copy the value of the iniline style if it exist and imediatly nullify it to prevents false positive on other targets
+            let inlineValue = inlineStylesStore[propName];
+            if (!isNil(inlineValue)) inlineStylesStore[propName] = null;
+
             /** @type {Tween} */
             const tween = {
               parent: this,
@@ -479,6 +484,7 @@ class JSAnimation extends Timer {
               _isOverlapped: 0,
               _isOverridden: 0,
               _renderTransforms: 0,
+              _inlineValue: inlineValue,
               _prevRep: null, // For replaced tween
               _nextRep: null, // For replaced tween
               _prevAdd: null, // For additive tween
@@ -581,8 +587,6 @@ class JSAnimation extends Timer {
     // this._offset += parent ? iterationDelay : 0;
     /** @type {Number} */
     this.iterationDuration = iterationDuration;
-    /** @type {{}} */
-    this._inlineStyles = animInlineStyles;
 
     if (!this._autoplay && shouldTriggerRender) this.onRender(this);
   }
@@ -616,6 +620,7 @@ class JSAnimation extends Timer {
       if (tweenFunc) {
         const ogValue = getOriginalAnimatableValue(tween.target, tween.property, tween._tweenType);
         decomposeRawValue(ogValue, decomposedOriginalValue);
+        // TODO: Check for from / to Array based values here,
         decomposeRawValue(tweenFunc(), toTargetObject);
         tween._fromNumbers = cloneArray(decomposedOriginalValue.d);
         tween._fromNumber = decomposedOriginalValue.n;
@@ -625,6 +630,8 @@ class JSAnimation extends Timer {
         tween._toNumber = toTargetObject.o ? getRelativeValue(decomposedOriginalValue.n, toTargetObject.n, toTargetObject.o) : toTargetObject.n;
       }
     });
+    // This forces setter animations to render once
+    if (this.duration === minValue) this.restart();
     return this;
   }
 
@@ -638,8 +645,12 @@ class JSAnimation extends Timer {
   }
 
   /**
-   * @param  {Callback<this>} [callback]
-   * @return {Promise}
+   * @typedef {this & {then: null}} ResolvedJSAnimation
+   */
+
+  /**
+   * @param  {Callback<ResolvedJSAnimation>} [callback]
+   * @return Promise<this>
    */
   then(callback) {
     return super.then(callback);

package/dist/modules/animation/composition.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - animation - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/animation/composition.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - animation - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/animation/index.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - animation - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/animation/index.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - animation - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/clock.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/clock.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/colors.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/colors.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/consts.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -70,6 +70,8 @@ const maxFps = 120;
 // Strings
 
 const emptyString = '';
+const cssVarPrefix = 'var(';
+
 const shortTransforms = /*#__PURE__*/ (() => {
   const map = new Map();
   map.set('x', 'translateX');
@@ -93,9 +95,9 @@ const validTransforms = [
   'skew',
   'skewX',
   'skewY',
-  'perspective',
   'matrix',
   'matrix3d',
+  'perspective',
 ];
 
 const transformsFragmentStrings = /*#__PURE__*/ validTransforms.reduce((a, v) => ({...a, [v]: v + '('}), {});
@@ -119,9 +121,12 @@ const unitsExecRgx = /^([-+]?\d*\.?\d+(?:e[-+]?\d+)?)([a-z]+|%)$/i;
 const lowerCaseRgx = /([a-z])([A-Z])/g;
 const transformsExecRgx = /(\w+)(\([^)]+\)+)/g; // Match inline transforms with cacl() values, returns the value wrapped in ()
 const relativeValuesExecRgx = /(\*=|\+=|-=)/;
+const cssVariableMatchRgx = /var\(\s*(--[\w-]+)(?:\s*,\s*([^)]+))?\s*\)/;
 
 exports.K = K;
 exports.compositionTypes = compositionTypes;
+exports.cssVarPrefix = cssVarPrefix;
+exports.cssVariableMatchRgx = cssVariableMatchRgx;
 exports.digitWithExponentRgx = digitWithExponentRgx;
 exports.doc = doc;
 exports.emptyString = emptyString;

package/dist/modules/core/consts.d.ts

@@ -43,6 +43,7 @@ export const maxValue: 1000000000000;
 export const K: 1000;
 export const maxFps: 120;
 export const emptyString: "";
+export const cssVarPrefix: "var(";
 export const shortTransforms: Map<any, any>;
 export const validTransforms: string[];
 export const transformsFragmentStrings: {};
@@ -57,3 +58,4 @@ export const unitsExecRgx: RegExp;
 export const lowerCaseRgx: RegExp;
 export const transformsExecRgx: RegExp;
 export const relativeValuesExecRgx: RegExp;
+export const cssVariableMatchRgx: RegExp;

package/dist/modules/core/consts.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -68,6 +68,8 @@ const maxFps = 120;
 // Strings
 
 const emptyString = '';
+const cssVarPrefix = 'var(';
+
 const shortTransforms = /*#__PURE__*/ (() => {
   const map = new Map();
   map.set('x', 'translateX');
@@ -91,9 +93,9 @@ const validTransforms = [
   'skew',
   'skewX',
   'skewY',
-  'perspective',
   'matrix',
   'matrix3d',
+  'perspective',
 ];
 
 const transformsFragmentStrings = /*#__PURE__*/ validTransforms.reduce((a, v) => ({...a, [v]: v + '('}), {});
@@ -117,5 +119,6 @@ const unitsExecRgx = /^([-+]?\d*\.?\d+(?:e[-+]?\d+)?)([a-z]+|%)$/i;
 const lowerCaseRgx = /([a-z])([A-Z])/g;
 const transformsExecRgx = /(\w+)(\([^)]+\)+)/g; // Match inline transforms with cacl() values, returns the value wrapped in ()
 const relativeValuesExecRgx = /(\*=|\+=|-=)/;
+const cssVariableMatchRgx = /var\(\s*(--[\w-]+)(?:\s*,\s*([^)]+))?\s*\)/;
 
-export { K, compositionTypes, digitWithExponentRgx, doc, emptyString, hexTestRgx, hslExecRgx, hslaExecRgx, isBrowser, isDomSymbol, isRegisteredTargetSymbol, isSvgSymbol, lowerCaseRgx, maxFps, maxValue, minValue, morphPointsSymbol, noop, proxyTargetSymbol, relativeValuesExecRgx, rgbExecRgx, rgbaExecRgx, shortTransforms, tickModes, transformsExecRgx, transformsFragmentStrings, transformsSymbol, tweenTypes, unitsExecRgx, validTransforms, valueTypes, win };
+export { K, compositionTypes, cssVarPrefix, cssVariableMatchRgx, digitWithExponentRgx, doc, emptyString, hexTestRgx, hslExecRgx, hslaExecRgx, isBrowser, isDomSymbol, isRegisteredTargetSymbol, isSvgSymbol, lowerCaseRgx, maxFps, maxValue, minValue, morphPointsSymbol, noop, proxyTargetSymbol, relativeValuesExecRgx, rgbExecRgx, rgbaExecRgx, shortTransforms, tickModes, transformsExecRgx, transformsFragmentStrings, transformsSymbol, tweenTypes, unitsExecRgx, validTransforms, valueTypes, win };

package/dist/modules/core/globals.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -31,6 +31,7 @@ const defaults = {
   reversed: false,
   alternate: false,
   autoplay: true,
+  persist: false,
   duration: consts.K,
   delay: 0,
   loopDelay: 0,
@@ -64,7 +65,7 @@ const globals = {
   tickThreshold: 200,
 };
 
-const globalVersions = { version: '4.2.0', engine: null };
+const globalVersions = { version: '4.2.1', engine: null };
 
 if (consts.isBrowser) {
   if (!consts.win.AnimeJS) consts.win.AnimeJS = [];

package/dist/modules/core/globals.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -29,6 +29,7 @@ const defaults = {
   reversed: false,
   alternate: false,
   autoplay: true,
+  persist: false,
   duration: K,
   delay: 0,
   loopDelay: 0,
@@ -62,7 +63,7 @@ const globals = {
   tickThreshold: 200,
 };
 
-const globalVersions = { version: '4.2.0', engine: null };
+const globalVersions = { version: '4.2.1', engine: null };
 
 if (isBrowser) {
   if (!win.AnimeJS) win.AnimeJS = [];

package/dist/modules/core/helpers.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/helpers.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */

package/dist/modules/core/render.cjs

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - CJS
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -283,7 +283,9 @@ const render = (tickable, time, muteCallbacks, internalRender, tickMode) => {
   // Handle setters on timeline differently and allow re-trigering the onComplete callback when seeking backwards
   if (parent && isSetter) {
     if (!muteCallbacks && (
-      (parent.began && !isRunningBackwards && tickableAbsoluteTime >= duration && !completed) ||
+      // (tickableAbsoluteTime > 0 instead) of (tickableAbsoluteTime >= duration) to prevent floating point precision issues
+      // see: https://github.com/juliangarnier/anime/issues/1088
+      (parent.began && !isRunningBackwards && tickableAbsoluteTime > 0 && !completed) ||
       (isRunningBackwards && tickableAbsoluteTime <= consts.minValue && completed)
     )) {
       tickable.onComplete(/** @type {CallbackArgument} */(tickable));

package/dist/modules/core/render.js

@@ -1,6 +1,6 @@
 /**
  * Anime.js - core - ESM
- * @version v4.2.0
+ * @version v4.2.1
  * @license MIT
  * @copyright 2025 - Julian Garnier
  */
@@ -281,7 +281,9 @@ const render = (tickable, time, muteCallbacks, internalRender, tickMode) => {
   // Handle setters on timeline differently and allow re-trigering the onComplete callback when seeking backwards
   if (parent && isSetter) {
     if (!muteCallbacks && (
-      (parent.began && !isRunningBackwards && tickableAbsoluteTime >= duration && !completed) ||
+      // (tickableAbsoluteTime > 0 instead) of (tickableAbsoluteTime >= duration) to prevent floating point precision issues
+      // see: https://github.com/juliangarnier/anime/issues/1088
+      (parent.began && !isRunningBackwards && tickableAbsoluteTime > 0 && !completed) ||
       (isRunningBackwards && tickableAbsoluteTime <= minValue && completed)
     )) {
       tickable.onComplete(/** @type {CallbackArgument} */(tickable));