animejs 4.2.2 → 4.3.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (133) hide show
  1. package/README.md +82 -28
  2. package/dist/bundles/anime.esm.js +2705 -1303
  3. package/dist/bundles/anime.esm.min.js +2 -2
  4. package/dist/bundles/anime.umd.js +2710 -1306
  5. package/dist/bundles/anime.umd.min.js +2 -2
  6. package/dist/modules/animatable/animatable.cjs +1 -1
  7. package/dist/modules/animatable/animatable.js +1 -1
  8. package/dist/modules/animatable/index.cjs +1 -1
  9. package/dist/modules/animatable/index.js +1 -1
  10. package/dist/modules/animation/additive.cjs +1 -1
  11. package/dist/modules/animation/additive.js +1 -1
  12. package/dist/modules/animation/animation.cjs +18 -9
  13. package/dist/modules/animation/animation.js +19 -10
  14. package/dist/modules/animation/composition.cjs +1 -1
  15. package/dist/modules/animation/composition.js +1 -1
  16. package/dist/modules/animation/index.cjs +1 -1
  17. package/dist/modules/animation/index.js +1 -1
  18. package/dist/modules/core/clock.cjs +10 -10
  19. package/dist/modules/core/clock.d.ts +1 -1
  20. package/dist/modules/core/clock.js +10 -10
  21. package/dist/modules/core/colors.cjs +1 -1
  22. package/dist/modules/core/colors.js +1 -1
  23. package/dist/modules/core/consts.cjs +6 -4
  24. package/dist/modules/core/consts.d.ts +13 -5
  25. package/dist/modules/core/consts.js +6 -4
  26. package/dist/modules/core/globals.cjs +5 -2
  27. package/dist/modules/core/globals.d.ts +1 -0
  28. package/dist/modules/core/globals.js +5 -3
  29. package/dist/modules/core/helpers.cjs +1 -1
  30. package/dist/modules/core/helpers.js +1 -1
  31. package/dist/modules/core/render.cjs +1 -1
  32. package/dist/modules/core/render.js +1 -1
  33. package/dist/modules/core/styles.cjs +1 -1
  34. package/dist/modules/core/styles.js +1 -1
  35. package/dist/modules/core/targets.cjs +1 -1
  36. package/dist/modules/core/targets.js +1 -1
  37. package/dist/modules/core/transforms.cjs +1 -1
  38. package/dist/modules/core/transforms.js +1 -1
  39. package/dist/modules/core/units.cjs +1 -1
  40. package/dist/modules/core/units.js +1 -1
  41. package/dist/modules/core/values.cjs +1 -1
  42. package/dist/modules/core/values.js +1 -1
  43. package/dist/modules/draggable/draggable.cjs +1 -1
  44. package/dist/modules/draggable/draggable.js +1 -1
  45. package/dist/modules/draggable/index.cjs +1 -1
  46. package/dist/modules/draggable/index.js +1 -1
  47. package/dist/modules/easings/cubic-bezier/index.cjs +1 -1
  48. package/dist/modules/easings/cubic-bezier/index.js +1 -1
  49. package/dist/modules/easings/eases/index.cjs +1 -1
  50. package/dist/modules/easings/eases/index.js +1 -1
  51. package/dist/modules/easings/eases/parser.cjs +1 -1
  52. package/dist/modules/easings/eases/parser.js +1 -1
  53. package/dist/modules/easings/index.cjs +1 -1
  54. package/dist/modules/easings/index.js +1 -1
  55. package/dist/modules/easings/irregular/index.cjs +1 -1
  56. package/dist/modules/easings/irregular/index.js +1 -1
  57. package/dist/modules/easings/linear/index.cjs +1 -1
  58. package/dist/modules/easings/linear/index.js +1 -1
  59. package/dist/modules/easings/none.cjs +1 -1
  60. package/dist/modules/easings/none.js +1 -1
  61. package/dist/modules/easings/spring/index.cjs +1 -1
  62. package/dist/modules/easings/spring/index.js +1 -1
  63. package/dist/modules/easings/steps/index.cjs +1 -1
  64. package/dist/modules/easings/steps/index.js +1 -1
  65. package/dist/modules/engine/engine.cjs +2 -2
  66. package/dist/modules/engine/engine.js +2 -2
  67. package/dist/modules/engine/index.cjs +1 -1
  68. package/dist/modules/engine/index.js +1 -1
  69. package/dist/modules/events/index.cjs +1 -1
  70. package/dist/modules/events/index.js +1 -1
  71. package/dist/modules/events/scroll.cjs +1 -1
  72. package/dist/modules/events/scroll.js +1 -1
  73. package/dist/modules/index.cjs +4 -1
  74. package/dist/modules/index.d.ts +1 -0
  75. package/dist/modules/index.js +2 -1
  76. package/dist/modules/layout/index.cjs +15 -0
  77. package/dist/modules/layout/index.d.ts +1 -0
  78. package/dist/modules/layout/index.js +8 -0
  79. package/dist/modules/layout/layout.cjs +1384 -0
  80. package/dist/modules/layout/layout.d.ts +211 -0
  81. package/dist/modules/layout/layout.js +1381 -0
  82. package/dist/modules/scope/index.cjs +1 -1
  83. package/dist/modules/scope/index.js +1 -1
  84. package/dist/modules/scope/scope.cjs +1 -1
  85. package/dist/modules/scope/scope.js +1 -1
  86. package/dist/modules/svg/drawable.cjs +1 -1
  87. package/dist/modules/svg/drawable.js +1 -1
  88. package/dist/modules/svg/helpers.cjs +1 -1
  89. package/dist/modules/svg/helpers.js +1 -1
  90. package/dist/modules/svg/index.cjs +1 -1
  91. package/dist/modules/svg/index.js +1 -1
  92. package/dist/modules/svg/morphto.cjs +1 -1
  93. package/dist/modules/svg/morphto.js +1 -1
  94. package/dist/modules/svg/motionpath.cjs +1 -1
  95. package/dist/modules/svg/motionpath.js +1 -1
  96. package/dist/modules/text/index.cjs +1 -1
  97. package/dist/modules/text/index.js +1 -1
  98. package/dist/modules/text/split.cjs +23 -9
  99. package/dist/modules/text/split.js +23 -9
  100. package/dist/modules/timeline/index.cjs +1 -1
  101. package/dist/modules/timeline/index.js +1 -1
  102. package/dist/modules/timeline/position.cjs +1 -1
  103. package/dist/modules/timeline/position.js +1 -1
  104. package/dist/modules/timeline/timeline.cjs +14 -6
  105. package/dist/modules/timeline/timeline.d.ts +2 -0
  106. package/dist/modules/timeline/timeline.js +15 -7
  107. package/dist/modules/timer/index.cjs +1 -1
  108. package/dist/modules/timer/index.js +1 -1
  109. package/dist/modules/timer/timer.cjs +26 -13
  110. package/dist/modules/timer/timer.d.ts +1 -0
  111. package/dist/modules/timer/timer.js +27 -14
  112. package/dist/modules/types/index.d.ts +3 -1
  113. package/dist/modules/utils/chainable.cjs +1 -1
  114. package/dist/modules/utils/chainable.js +1 -1
  115. package/dist/modules/utils/index.cjs +1 -1
  116. package/dist/modules/utils/index.js +1 -1
  117. package/dist/modules/utils/number.cjs +1 -1
  118. package/dist/modules/utils/number.js +1 -1
  119. package/dist/modules/utils/random.cjs +1 -1
  120. package/dist/modules/utils/random.js +1 -1
  121. package/dist/modules/utils/stagger.cjs +1 -1
  122. package/dist/modules/utils/stagger.js +1 -1
  123. package/dist/modules/utils/target.cjs +1 -1
  124. package/dist/modules/utils/target.js +1 -1
  125. package/dist/modules/utils/time.cjs +1 -1
  126. package/dist/modules/utils/time.js +1 -1
  127. package/dist/modules/waapi/composition.cjs +1 -1
  128. package/dist/modules/waapi/composition.js +1 -1
  129. package/dist/modules/waapi/index.cjs +1 -1
  130. package/dist/modules/waapi/index.js +1 -1
  131. package/dist/modules/waapi/waapi.cjs +15 -7
  132. package/dist/modules/waapi/waapi.js +16 -8
  133. package/package.json +8 -2
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - animation - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -60,6 +60,7 @@ const fastSetValuesArray = [null, null];
60
60
  const keyObjectTarget = { to: null };
61
61
 
62
62
  let tweenId = 0;
63
+ let JSAnimationId = 0;
63
64
  let keyframes;
64
65
  /** @type {TweenParamsOptions & TweenValues} */
65
66
  let key;
@@ -174,6 +175,8 @@ class JSAnimation extends timer.Timer {
174
175
 
175
176
  super(/** @type {TimerParams & AnimationParams} */(parameters), parent, parentPosition);
176
177
 
178
+ ++JSAnimationId;
179
+
177
180
  const parsedTargets = targets.registerTargets(targets$1);
178
181
  const targetsLength = parsedTargets.length;
179
182
 
@@ -183,6 +186,7 @@ class JSAnimation extends timer.Timer {
183
186
  const params = /** @type {AnimationParams} */(kfParams ? helpers.mergeObjects(generateKeyframes(/** @type {DurationKeyframes} */(kfParams), parameters), parameters) : parameters);
184
187
 
185
188
  const {
189
+ id,
186
190
  delay,
187
191
  duration,
188
192
  ease,
@@ -193,11 +197,12 @@ class JSAnimation extends timer.Timer {
193
197
  } = params;
194
198
 
195
199
  const animDefaults = parent ? parent.defaults : globals.globals.defaults;
196
- const animaPlaybackEase = values.setValue(playbackEase, animDefaults.playbackEase);
197
- const animEase = animaPlaybackEase ? parser.parseEase(animaPlaybackEase) : null;
198
- const hasSpring = !helpers.isUnd(ease) && !helpers.isUnd(/** @type {Spring} */(ease).ease);
199
- const tEasing = hasSpring ? /** @type {Spring} */(ease).ease : values.setValue(ease, animEase ? 'linear' : animDefaults.ease);
200
- const tDuration = hasSpring ? /** @type {Spring} */(ease).settlingDuration : values.setValue(duration, animDefaults.duration);
200
+ const animEase = values.setValue(ease, animDefaults.ease);
201
+ const animPlaybackEase = values.setValue(playbackEase, animDefaults.playbackEase);
202
+ const parsedAnimPlaybackEase = animPlaybackEase ? parser.parseEase(animPlaybackEase) : null;
203
+ const hasSpring = !helpers.isUnd(/** @type {Spring} */(animEase).ease);
204
+ const tEasing = hasSpring ? /** @type {Spring} */(animEase).ease : values.setValue(ease, parsedAnimPlaybackEase ? 'linear' : animDefaults.ease);
205
+ const tDuration = hasSpring ? /** @type {Spring} */(animEase).settlingDuration : values.setValue(duration, animDefaults.duration);
201
206
  const tDelay = values.setValue(delay, animDefaults.delay);
202
207
  const tModifier = modifier || animDefaults.modifier;
203
208
  // If no composition is defined and the targets length is high (>= 1000) set the composition to 'none' (0) for faster tween creation
@@ -205,7 +210,7 @@ class JSAnimation extends timer.Timer {
205
210
  // const absoluteOffsetTime = this._offset;
206
211
  const absoluteOffsetTime = this._offset + (parent ? parent._offset : 0);
207
212
  // This allows targeting the current animation in the spring onComplete callback
208
- if (hasSpring) /** @type {Spring} */(ease).parent = this;
213
+ if (hasSpring) /** @type {Spring} */(animEase).parent = this;
209
214
 
210
215
  let iterationDuration = NaN;
211
216
  let iterationDelay = NaN;
@@ -349,6 +354,8 @@ class JSAnimation extends timer.Timer {
349
354
  if (isFromToValue) {
350
355
  values.decomposeRawValue(isFromToArray ? values.getFunctionValue(tweenToValue[0], target, ti, tl) : tweenFromValue, fromTargetObject);
351
356
  values.decomposeRawValue(isFromToArray ? values.getFunctionValue(tweenToValue[1], target, ti, tl, toFunctionStore) : tweenToValue, toTargetObject);
357
+ // Needed to force an inline style registration
358
+ const originalValue = values.getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore);
352
359
  if (fromTargetObject.t === consts.valueTypes.NUMBER) {
353
360
  if (prevSibling) {
354
361
  if (prevSibling._valueType === consts.valueTypes.UNIT) {
@@ -357,7 +364,7 @@ class JSAnimation extends timer.Timer {
357
364
  }
358
365
  } else {
359
366
  values.decomposeRawValue(
360
- values.getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore),
367
+ originalValue,
361
368
  values.decomposedOriginalValue
362
369
  );
363
370
  if (values.decomposedOriginalValue.t === consts.valueTypes.UNIT) {
@@ -576,12 +583,14 @@ class JSAnimation extends timer.Timer {
576
583
  }
577
584
  /** @type {TargetsArray} */
578
585
  this.targets = parsedTargets;
586
+ /** @type {String|Number} */
587
+ this.id = !helpers.isUnd(id) ? id : JSAnimationId;
579
588
  /** @type {Number} */
580
589
  this.duration = iterationDuration === consts.minValue ? consts.minValue : helpers.clampInfinity(((iterationDuration + this._loopDelay) * this.iterationCount) - this._loopDelay) || consts.minValue;
581
590
  /** @type {Callback<this>} */
582
591
  this.onRender = onRender || animDefaults.onRender;
583
592
  /** @type {EasingFunction} */
584
- this._ease = animEase;
593
+ this._ease = parsedAnimPlaybackEase;
585
594
  /** @type {Number} */
586
595
  this._delay = iterationDelay;
587
596
  // NOTE: I'm keeping delay values separated from offsets in timelines because delays can override previous tweens and it could be confusing to debug a timeline with overridden tweens and no associated visible delays.
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - animation - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -9,7 +9,7 @@ import { K, compositionTypes, valueTypes, minValue, tweenTypes } from '../core/c
9
9
  import { mergeObjects, isUnd, isKey, isObj, round, cloneArray, isNil, addChild, forEachChildren, clampInfinity, normalizeTime, isArr, isNum } from '../core/helpers.js';
10
10
  import { globals } from '../core/globals.js';
11
11
  import { registerTargets } from '../core/targets.js';
12
- import { setValue, getTweenType, getFunctionValue, decomposeRawValue, createDecomposedValueTargetObject, getOriginalAnimatableValue, decomposedOriginalValue, getRelativeValue, decomposeTweenValue } from '../core/values.js';
12
+ import { setValue, getTweenType, getFunctionValue, decomposeRawValue, getOriginalAnimatableValue, createDecomposedValueTargetObject, decomposedOriginalValue, getRelativeValue, decomposeTweenValue } from '../core/values.js';
13
13
  import { sanitizePropertyName, cleanInlineStyles } from '../core/styles.js';
14
14
  import { convertValueUnit } from '../core/units.js';
15
15
  import { parseEase } from '../easings/eases/parser.js';
@@ -58,6 +58,7 @@ const fastSetValuesArray = [null, null];
58
58
  const keyObjectTarget = { to: null };
59
59
 
60
60
  let tweenId = 0;
61
+ let JSAnimationId = 0;
61
62
  let keyframes;
62
63
  /** @type {TweenParamsOptions & TweenValues} */
63
64
  let key;
@@ -172,6 +173,8 @@ class JSAnimation extends Timer {
172
173
 
173
174
  super(/** @type {TimerParams & AnimationParams} */(parameters), parent, parentPosition);
174
175
 
176
+ ++JSAnimationId;
177
+
175
178
  const parsedTargets = registerTargets(targets);
176
179
  const targetsLength = parsedTargets.length;
177
180
 
@@ -181,6 +184,7 @@ class JSAnimation extends Timer {
181
184
  const params = /** @type {AnimationParams} */(kfParams ? mergeObjects(generateKeyframes(/** @type {DurationKeyframes} */(kfParams), parameters), parameters) : parameters);
182
185
 
183
186
  const {
187
+ id,
184
188
  delay,
185
189
  duration,
186
190
  ease,
@@ -191,11 +195,12 @@ class JSAnimation extends Timer {
191
195
  } = params;
192
196
 
193
197
  const animDefaults = parent ? parent.defaults : globals.defaults;
194
- const animaPlaybackEase = setValue(playbackEase, animDefaults.playbackEase);
195
- const animEase = animaPlaybackEase ? parseEase(animaPlaybackEase) : null;
196
- const hasSpring = !isUnd(ease) && !isUnd(/** @type {Spring} */(ease).ease);
197
- const tEasing = hasSpring ? /** @type {Spring} */(ease).ease : setValue(ease, animEase ? 'linear' : animDefaults.ease);
198
- const tDuration = hasSpring ? /** @type {Spring} */(ease).settlingDuration : setValue(duration, animDefaults.duration);
198
+ const animEase = setValue(ease, animDefaults.ease);
199
+ const animPlaybackEase = setValue(playbackEase, animDefaults.playbackEase);
200
+ const parsedAnimPlaybackEase = animPlaybackEase ? parseEase(animPlaybackEase) : null;
201
+ const hasSpring = !isUnd(/** @type {Spring} */(animEase).ease);
202
+ const tEasing = hasSpring ? /** @type {Spring} */(animEase).ease : setValue(ease, parsedAnimPlaybackEase ? 'linear' : animDefaults.ease);
203
+ const tDuration = hasSpring ? /** @type {Spring} */(animEase).settlingDuration : setValue(duration, animDefaults.duration);
199
204
  const tDelay = setValue(delay, animDefaults.delay);
200
205
  const tModifier = modifier || animDefaults.modifier;
201
206
  // If no composition is defined and the targets length is high (>= 1000) set the composition to 'none' (0) for faster tween creation
@@ -203,7 +208,7 @@ class JSAnimation extends Timer {
203
208
  // const absoluteOffsetTime = this._offset;
204
209
  const absoluteOffsetTime = this._offset + (parent ? parent._offset : 0);
205
210
  // This allows targeting the current animation in the spring onComplete callback
206
- if (hasSpring) /** @type {Spring} */(ease).parent = this;
211
+ if (hasSpring) /** @type {Spring} */(animEase).parent = this;
207
212
 
208
213
  let iterationDuration = NaN;
209
214
  let iterationDelay = NaN;
@@ -347,6 +352,8 @@ class JSAnimation extends Timer {
347
352
  if (isFromToValue) {
348
353
  decomposeRawValue(isFromToArray ? getFunctionValue(tweenToValue[0], target, ti, tl) : tweenFromValue, fromTargetObject);
349
354
  decomposeRawValue(isFromToArray ? getFunctionValue(tweenToValue[1], target, ti, tl, toFunctionStore) : tweenToValue, toTargetObject);
355
+ // Needed to force an inline style registration
356
+ const originalValue = getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore);
350
357
  if (fromTargetObject.t === valueTypes.NUMBER) {
351
358
  if (prevSibling) {
352
359
  if (prevSibling._valueType === valueTypes.UNIT) {
@@ -355,7 +362,7 @@ class JSAnimation extends Timer {
355
362
  }
356
363
  } else {
357
364
  decomposeRawValue(
358
- getOriginalAnimatableValue(target, propName, tweenType, inlineStylesStore),
365
+ originalValue,
359
366
  decomposedOriginalValue
360
367
  );
361
368
  if (decomposedOriginalValue.t === valueTypes.UNIT) {
@@ -574,12 +581,14 @@ class JSAnimation extends Timer {
574
581
  }
575
582
  /** @type {TargetsArray} */
576
583
  this.targets = parsedTargets;
584
+ /** @type {String|Number} */
585
+ this.id = !isUnd(id) ? id : JSAnimationId;
577
586
  /** @type {Number} */
578
587
  this.duration = iterationDuration === minValue ? minValue : clampInfinity(((iterationDuration + this._loopDelay) * this.iterationCount) - this._loopDelay) || minValue;
579
588
  /** @type {Callback<this>} */
580
589
  this.onRender = onRender || animDefaults.onRender;
581
590
  /** @type {EasingFunction} */
582
- this._ease = animEase;
591
+ this._ease = parsedAnimPlaybackEase;
583
592
  /** @type {Number} */
584
593
  this._delay = iterationDelay;
585
594
  // NOTE: I'm keeping delay values separated from offsets in timelines because delays can override previous tweens and it could be confusing to debug a timeline with overridden tweens and no associated visible delays.
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - animation - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - animation - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - animation - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - animation - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -8,7 +8,7 @@
8
8
  'use strict';
9
9
 
10
10
  var consts = require('./consts.cjs');
11
- var helpers = require('./helpers.cjs');
11
+ var globals = require('./globals.cjs');
12
12
 
13
13
  /**
14
14
  * @import {
@@ -30,7 +30,7 @@ class Clock {
30
30
  /** @type {Number} */
31
31
  this._currentTime = initTime;
32
32
  /** @type {Number} */
33
- this._elapsedTime = initTime;
33
+ this._lastTickTime = initTime;
34
34
  /** @type {Number} */
35
35
  this._startTime = initTime;
36
36
  /** @type {Number} */
@@ -38,7 +38,7 @@ class Clock {
38
38
  /** @type {Number} */
39
39
  this._scheduledTime = 0;
40
40
  /** @type {Number} */
41
- this._frameDuration = helpers.round(consts.K / consts.maxFps, 0);
41
+ this._frameDuration = consts.K / consts.maxFps;
42
42
  /** @type {Number} */
43
43
  this._fps = consts.maxFps;
44
44
  /** @type {Number} */
@@ -59,7 +59,8 @@ class Clock {
59
59
  const previousFrameDuration = this._frameDuration;
60
60
  const fr = +frameRate;
61
61
  const fps = fr < consts.minValue ? consts.minValue : fr;
62
- const frameDuration = helpers.round(consts.K / fps, 0);
62
+ const frameDuration = consts.K / fps;
63
+ if (fps > globals.defaults.frameRate) globals.defaults.frameRate = fps;
63
64
  this._fps = fps;
64
65
  this._frameDuration = frameDuration;
65
66
  this._scheduledTime += frameDuration - previousFrameDuration;
@@ -80,14 +81,13 @@ class Clock {
80
81
  */
81
82
  requestTick(time) {
82
83
  const scheduledTime = this._scheduledTime;
83
- const elapsedTime = this._elapsedTime;
84
- this._elapsedTime += (time - elapsedTime);
85
- // If the elapsed time is lower than the scheduled time
84
+ this._lastTickTime = time;
85
+ // If the current time is lower than the scheduled time
86
86
  // this means not enough time has passed to hit one frameDuration
87
87
  // so skip that frame
88
- if (elapsedTime < scheduledTime) return consts.tickModes.NONE;
88
+ if (time < scheduledTime) return consts.tickModes.NONE;
89
89
  const frameDuration = this._frameDuration;
90
- const frameDelta = elapsedTime - scheduledTime;
90
+ const frameDelta = time - scheduledTime;
91
91
  // Ensures that _scheduledTime progresses in steps of at least 1 frameDuration.
92
92
  // Skips ahead if the actual elapsed time is higher.
93
93
  this._scheduledTime += frameDelta < frameDuration ? frameDuration : frameDelta;
@@ -12,7 +12,7 @@ export class Clock {
12
12
  /** @type {Number} */
13
13
  _currentTime: number;
14
14
  /** @type {Number} */
15
- _elapsedTime: number;
15
+ _lastTickTime: number;
16
16
  /** @type {Number} */
17
17
  _startTime: number;
18
18
  /** @type {Number} */
@@ -1,12 +1,12 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
7
7
 
8
8
  import { K, maxFps, minValue, tickModes } from './consts.js';
9
- import { round } from './helpers.js';
9
+ import { defaults } from './globals.js';
10
10
 
11
11
  /**
12
12
  * @import {
@@ -28,7 +28,7 @@ class Clock {
28
28
  /** @type {Number} */
29
29
  this._currentTime = initTime;
30
30
  /** @type {Number} */
31
- this._elapsedTime = initTime;
31
+ this._lastTickTime = initTime;
32
32
  /** @type {Number} */
33
33
  this._startTime = initTime;
34
34
  /** @type {Number} */
@@ -36,7 +36,7 @@ class Clock {
36
36
  /** @type {Number} */
37
37
  this._scheduledTime = 0;
38
38
  /** @type {Number} */
39
- this._frameDuration = round(K / maxFps, 0);
39
+ this._frameDuration = K / maxFps;
40
40
  /** @type {Number} */
41
41
  this._fps = maxFps;
42
42
  /** @type {Number} */
@@ -57,7 +57,8 @@ class Clock {
57
57
  const previousFrameDuration = this._frameDuration;
58
58
  const fr = +frameRate;
59
59
  const fps = fr < minValue ? minValue : fr;
60
- const frameDuration = round(K / fps, 0);
60
+ const frameDuration = K / fps;
61
+ if (fps > defaults.frameRate) defaults.frameRate = fps;
61
62
  this._fps = fps;
62
63
  this._frameDuration = frameDuration;
63
64
  this._scheduledTime += frameDuration - previousFrameDuration;
@@ -78,14 +79,13 @@ class Clock {
78
79
  */
79
80
  requestTick(time) {
80
81
  const scheduledTime = this._scheduledTime;
81
- const elapsedTime = this._elapsedTime;
82
- this._elapsedTime += (time - elapsedTime);
83
- // If the elapsed time is lower than the scheduled time
82
+ this._lastTickTime = time;
83
+ // If the current time is lower than the scheduled time
84
84
  // this means not enough time has passed to hit one frameDuration
85
85
  // so skip that frame
86
- if (elapsedTime < scheduledTime) return tickModes.NONE;
86
+ if (time < scheduledTime) return tickModes.NONE;
87
87
  const frameDuration = this._frameDuration;
88
- const frameDelta = elapsedTime - scheduledTime;
88
+ const frameDelta = time - scheduledTime;
89
89
  // Ensures that _scheduledTime progresses in steps of at least 1 frameDuration.
90
90
  // Skips ahead if the actual elapsed time is higher.
91
91
  this._scheduledTime += frameDelta < frameDuration ? frameDuration : frameDelta;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -12,8 +12,10 @@
12
12
  // TODO: Do we need to check if we're running inside a worker ?
13
13
  const isBrowser = typeof window !== 'undefined';
14
14
 
15
- /** @type {Window & {AnimeJS: Array}|null} */
16
- const win = isBrowser ? /** @type {Window & {AnimeJS: Array}} */(/** @type {unknown} */(window)) : null;
15
+ /** @typedef {Window & {AnimeJS: Array} & {AnimeJSDevTools: any}|null} AnimeJSWindow
16
+
17
+ /** @type {AnimeJSWindow} */
18
+ const win = isBrowser ? /** @type {AnimeJSWindow} */(/** @type {unknown} */(window)) : null;
17
19
 
18
20
  /** @type {Document|null} */
19
21
  const doc = isBrowser ? document : null;
@@ -65,7 +67,7 @@ const proxyTargetSymbol = Symbol();
65
67
  const minValue = 1e-11;
66
68
  const maxValue = 1e12;
67
69
  const K = 1e3;
68
- const maxFps = 120;
70
+ const maxFps = 240;
69
71
 
70
72
  // Strings
71
73
 
@@ -1,8 +1,8 @@
1
1
  export const isBrowser: boolean;
2
- /** @type {Window & {AnimeJS: Array}|null} */
3
- export const win: (Window & {
4
- AnimeJS: any[];
5
- }) | null;
2
+ /** @typedef {Window & {AnimeJS: Array} & {AnimeJSDevTools: any}|null} AnimeJSWindow
3
+
4
+ /** @type {AnimeJSWindow} */
5
+ export const win: AnimeJSWindow;
6
6
  /** @type {Document|null} */
7
7
  export const doc: Document | null;
8
8
  export type tweenTypes = number;
@@ -41,7 +41,7 @@ export const proxyTargetSymbol: unique symbol;
41
41
  export const minValue: 1e-11;
42
42
  export const maxValue: 1000000000000;
43
43
  export const K: 1000;
44
- export const maxFps: 120;
44
+ export const maxFps: 240;
45
45
  export const emptyString: "";
46
46
  export const cssVarPrefix: "var(";
47
47
  export const shortTransforms: Map<any, any>;
@@ -59,3 +59,11 @@ export const lowerCaseRgx: RegExp;
59
59
  export const transformsExecRgx: RegExp;
60
60
  export const relativeValuesExecRgx: RegExp;
61
61
  export const cssVariableMatchRgx: RegExp;
62
+ /**
63
+ * /**
64
+ */
65
+ export type AnimeJSWindow = (Window & {
66
+ AnimeJS: any[];
67
+ } & {
68
+ AnimeJSDevTools: any;
69
+ }) | null;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -10,8 +10,10 @@
10
10
  // TODO: Do we need to check if we're running inside a worker ?
11
11
  const isBrowser = typeof window !== 'undefined';
12
12
 
13
- /** @type {Window & {AnimeJS: Array}|null} */
14
- const win = isBrowser ? /** @type {Window & {AnimeJS: Array}} */(/** @type {unknown} */(window)) : null;
13
+ /** @typedef {Window & {AnimeJS: Array} & {AnimeJSDevTools: any}|null} AnimeJSWindow
14
+
15
+ /** @type {AnimeJSWindow} */
16
+ const win = isBrowser ? /** @type {AnimeJSWindow} */(/** @type {unknown} */(window)) : null;
15
17
 
16
18
  /** @type {Document|null} */
17
19
  const doc = isBrowser ? document : null;
@@ -63,7 +65,7 @@ const proxyTargetSymbol = Symbol();
63
65
  const minValue = 1e-11;
64
66
  const maxValue = 1e12;
65
67
  const K = 1e3;
66
- const maxFps = 120;
68
+ const maxFps = 240;
67
69
 
68
70
  // Strings
69
71
 
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -65,7 +65,9 @@ const globals = {
65
65
  tickThreshold: 200,
66
66
  };
67
67
 
68
- const globalVersions = { version: '4.2.2', engine: null };
68
+ const devTools = consts.isBrowser && consts.win.AnimeJSDevTools;
69
+
70
+ const globalVersions = { version: '4.3.0-beta.0', engine: null };
69
71
 
70
72
  if (consts.isBrowser) {
71
73
  if (!consts.win.AnimeJS) consts.win.AnimeJS = [];
@@ -73,6 +75,7 @@ if (consts.isBrowser) {
73
75
  }
74
76
 
75
77
  exports.defaults = defaults;
78
+ exports.devTools = devTools;
76
79
  exports.globalVersions = globalVersions;
77
80
  exports.globals = globals;
78
81
  exports.scope = scope;
@@ -20,6 +20,7 @@ export namespace globals {
20
20
  export let timeScale: number;
21
21
  export let tickThreshold: number;
22
22
  }
23
+ export const devTools: any;
23
24
  export namespace globalVersions {
24
25
  let version: string;
25
26
  let engine: any;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -63,11 +63,13 @@ const globals = {
63
63
  tickThreshold: 200,
64
64
  };
65
65
 
66
- const globalVersions = { version: '4.2.2', engine: null };
66
+ const devTools = isBrowser && win.AnimeJSDevTools;
67
+
68
+ const globalVersions = { version: '4.3.0-beta.0', engine: null };
67
69
 
68
70
  if (isBrowser) {
69
71
  if (!win.AnimeJS) win.AnimeJS = [];
70
72
  win.AnimeJS.push(globalVersions);
71
73
  }
72
74
 
73
- export { defaults, globalVersions, globals, scope };
75
+ export { defaults, devTools, globalVersions, globals, scope };
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - ESM
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Anime.js - core - CJS
3
- * @version v4.2.2
3
+ * @version v4.3.0-beta.0
4
4
  * @license MIT
5
5
  * @copyright 2025 - Julian Garnier
6
6
  */