@wix/motion 1.671.0 → 1.673.0

package/dist/cjs/AnimationGroup.js

@@ -94,6 +94,15 @@ class AnimationGroup {
       console.warn('animation was interrupted - aborting onFinish callback - ', _error);
     }
   }
+  async onAbort(callback) {
+    try {
+      await Promise.all(this.animations.map(animation => animation.finished));
+    } catch (error) {
+      if (error.name === 'AbortError') {
+        callback();
+      }
+    }
+  }
   get finished() {
     return Promise.all(this.animations.map(animation => animation.finished));
   }

package/dist/cjs/AnimationGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["AnimationGroup","constructor","animations","options","_defineProperty2","default","ready","measured","Promise","resolve","isCSS","CSSAnimation","getProgress","_this$animations$","effect","getComputedTiming","progress","play","callback","animation","all","map","pause","reverse","p","activeDuration","delay","getTiming","currentTime","cancel","setPlaybackRate","rate","playbackRate","onFinish","finished","a","_a$effect","target","endEvent","Event","dispatchEvent","_error","console","warn","playState","_this$animations$2","exports"],"sources":["../../src/AnimationGroup.ts"],"sourcesContent":["import { AnimationGroupOptions, RangeOffset } from './types';\n\n/**\n * @class AnimationGroup\n *\n * A wrapper object for simulating a GroupEffect and managing multiple animations.\n * See: https://www.w3.org/TR/web-animations-2/#grouping-and-synchronization\n */\nexport class AnimationGroup {\n  animations: (Animation & {\n    start?: RangeOffset;\n    end?: RangeOffset;\n  })[];\n  options?: AnimationGroupOptions;\n  ready: Promise<void>;\n  isCSS: boolean;\n\n  constructor(animations: Animation[], options?: AnimationGroupOptions) {\n    this.animations = animations;\n    this.options = options;\n    this.ready = options?.measured || Promise.resolve();\n    this.isCSS = animations[0] instanceof CSSAnimation;\n  }\n\n  getProgress() {\n    return this.animations[0]?.effect?.getComputedTiming().progress || 0;\n  }\n\n  async play(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.play();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  pause() {\n    for (const animation of this.animations) {\n      animation.pause();\n    }\n  }\n\n  async reverse(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.reverse();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  progress(p: number) {\n    for (const animation of this.animations) {\n      const { activeDuration } = animation.effect!.getComputedTiming();\n      const { delay } = animation.effect!.getTiming();\n      animation.currentTime =\n        ((delay || 0) + ((activeDuration as number) || 0)) * p;\n    }\n  }\n\n  cancel() {\n    for (const animation of this.animations) {\n      animation.cancel();\n    }\n  }\n\n  setPlaybackRate(rate: number) {\n    for (const animation of this.animations) {\n      animation.playbackRate = rate;\n    }\n  }\n\n  async onFinish(callback: () => void): Promise<void> {\n    try {\n      await Promise.all(this.animations.map((animation) => animation.finished));\n\n      const a = this.animations[0];\n\n      if (a && !this.isCSS) {\n        const target = (a.effect as KeyframeEffect)?.target;\n\n        if (target) {\n          const endEvent = new Event('animationend');\n          target.dispatchEvent(endEvent);\n        }\n      }\n\n      callback();\n    } catch (_error) {\n      console.warn(\n        'animation was interrupted - aborting onFinish callback - ',\n        _error,\n      );\n    }\n  }\n\n  get finished() {\n    return Promise.all(this.animations.map((animation) => animation.finished));\n  }\n\n  get playState() {\n    return this.animations[0]?.playState;\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["AnimationGroup","constructor","animations","options","_defineProperty2","default","ready","measured","Promise","resolve","isCSS","CSSAnimation","getProgress","_this$animations$","effect","getComputedTiming","progress","play","callback","animation","all","map","pause","reverse","p","activeDuration","delay","getTiming","currentTime","cancel","setPlaybackRate","rate","playbackRate","onFinish","finished","a","_a$effect","target","endEvent","Event","dispatchEvent","_error","console","warn","onAbort","error","name","playState","_this$animations$2","exports"],"sources":["../../src/AnimationGroup.ts"],"sourcesContent":["import { AnimationGroupOptions, RangeOffset } from './types';\n\n/**\n * @class AnimationGroup\n *\n * A wrapper object for simulating a GroupEffect and managing multiple animations.\n * See: https://www.w3.org/TR/web-animations-2/#grouping-and-synchronization\n */\nexport class AnimationGroup {\n  animations: (Animation & {\n    start?: RangeOffset;\n    end?: RangeOffset;\n  })[];\n  options?: AnimationGroupOptions;\n  ready: Promise<void>;\n  isCSS: boolean;\n\n  constructor(animations: Animation[], options?: AnimationGroupOptions) {\n    this.animations = animations;\n    this.options = options;\n    this.ready = options?.measured || Promise.resolve();\n    this.isCSS = animations[0] instanceof CSSAnimation;\n  }\n\n  getProgress() {\n    return this.animations[0]?.effect?.getComputedTiming().progress || 0;\n  }\n\n  async play(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.play();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  pause() {\n    for (const animation of this.animations) {\n      animation.pause();\n    }\n  }\n\n  async reverse(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.reverse();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  progress(p: number) {\n    for (const animation of this.animations) {\n      const { activeDuration } = animation.effect!.getComputedTiming();\n      const { delay } = animation.effect!.getTiming();\n      animation.currentTime =\n        ((delay || 0) + ((activeDuration as number) || 0)) * p;\n    }\n  }\n\n  cancel() {\n    for (const animation of this.animations) {\n      animation.cancel();\n    }\n  }\n\n  setPlaybackRate(rate: number) {\n    for (const animation of this.animations) {\n      animation.playbackRate = rate;\n    }\n  }\n\n  async onFinish(callback: () => void): Promise<void> {\n    try {\n      await Promise.all(this.animations.map((animation) => animation.finished));\n\n      const a = this.animations[0];\n\n      if (a && !this.isCSS) {\n        const target = (a.effect as KeyframeEffect)?.target;\n\n        if (target) {\n          const endEvent = new Event('animationend');\n          target.dispatchEvent(endEvent);\n        }\n      }\n\n      callback();\n    } catch (_error) {\n      console.warn(\n        'animation was interrupted - aborting onFinish callback - ',\n        _error,\n      );\n    }\n  }\n\n  async onAbort(callback: () => void): Promise<void> {\n    try {\n      await Promise.all(this.animations.map((animation) => animation.finished));\n    } catch (error: any) {\n      if (error.name === 'AbortError') {\n        callback();\n      }\n    }\n  }\n\n  get finished() {\n    return Promise.all(this.animations.map((animation) => animation.finished));\n  }\n\n  get playState() {\n    return this.animations[0]?.playState;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/AnimationGroup.js

@@ -89,6 +89,15 @@ export class AnimationGroup {
       console.warn('animation was interrupted - aborting onFinish callback - ', _error);
     }
   }
+  async onAbort(callback) {
+    try {
+      await Promise.all(this.animations.map(animation => animation.finished));
+    } catch (error) {
+      if (error.name === 'AbortError') {
+        callback();
+      }
+    }
+  }
   get finished() {
     return Promise.all(this.animations.map(animation => animation.finished));
   }

package/dist/esm/AnimationGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["AnimationGroup","constructor","animations","options","_defineProperty","ready","measured","Promise","resolve","isCSS","CSSAnimation","getProgress","_this$animations$","effect","getComputedTiming","progress","play","callback","animation","all","map","pause","reverse","p","activeDuration","delay","getTiming","currentTime","cancel","setPlaybackRate","rate","playbackRate","onFinish","finished","a","_a$effect","target","endEvent","Event","dispatchEvent","_error","console","warn","playState","_this$animations$2"],"sources":["../../src/AnimationGroup.ts"],"sourcesContent":["import { AnimationGroupOptions, RangeOffset } from './types';\n\n/**\n * @class AnimationGroup\n *\n * A wrapper object for simulating a GroupEffect and managing multiple animations.\n * See: https://www.w3.org/TR/web-animations-2/#grouping-and-synchronization\n */\nexport class AnimationGroup {\n  animations: (Animation & {\n    start?: RangeOffset;\n    end?: RangeOffset;\n  })[];\n  options?: AnimationGroupOptions;\n  ready: Promise<void>;\n  isCSS: boolean;\n\n  constructor(animations: Animation[], options?: AnimationGroupOptions) {\n    this.animations = animations;\n    this.options = options;\n    this.ready = options?.measured || Promise.resolve();\n    this.isCSS = animations[0] instanceof CSSAnimation;\n  }\n\n  getProgress() {\n    return this.animations[0]?.effect?.getComputedTiming().progress || 0;\n  }\n\n  async play(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.play();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  pause() {\n    for (const animation of this.animations) {\n      animation.pause();\n    }\n  }\n\n  async reverse(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.reverse();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  progress(p: number) {\n    for (const animation of this.animations) {\n      const { activeDuration } = animation.effect!.getComputedTiming();\n      const { delay } = animation.effect!.getTiming();\n      animation.currentTime =\n        ((delay || 0) + ((activeDuration as number) || 0)) * p;\n    }\n  }\n\n  cancel() {\n    for (const animation of this.animations) {\n      animation.cancel();\n    }\n  }\n\n  setPlaybackRate(rate: number) {\n    for (const animation of this.animations) {\n      animation.playbackRate = rate;\n    }\n  }\n\n  async onFinish(callback: () => void): Promise<void> {\n    try {\n      await Promise.all(this.animations.map((animation) => animation.finished));\n\n      const a = this.animations[0];\n\n      if (a && !this.isCSS) {\n        const target = (a.effect as KeyframeEffect)?.target;\n\n        if (target) {\n          const endEvent = new Event('animationend');\n          target.dispatchEvent(endEvent);\n        }\n      }\n\n      callback();\n    } catch (_error) {\n      console.warn(\n        'animation was interrupted - aborting onFinish callback - ',\n        _error,\n      );\n    }\n  }\n\n  get finished() {\n    return Promise.all(this.animations.map((animation) => animation.finished));\n  }\n\n  get playState() {\n    return this.animations[0]?.playState;\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["AnimationGroup","constructor","animations","options","_defineProperty","ready","measured","Promise","resolve","isCSS","CSSAnimation","getProgress","_this$animations$","effect","getComputedTiming","progress","play","callback","animation","all","map","pause","reverse","p","activeDuration","delay","getTiming","currentTime","cancel","setPlaybackRate","rate","playbackRate","onFinish","finished","a","_a$effect","target","endEvent","Event","dispatchEvent","_error","console","warn","onAbort","error","name","playState","_this$animations$2"],"sources":["../../src/AnimationGroup.ts"],"sourcesContent":["import { AnimationGroupOptions, RangeOffset } from './types';\n\n/**\n * @class AnimationGroup\n *\n * A wrapper object for simulating a GroupEffect and managing multiple animations.\n * See: https://www.w3.org/TR/web-animations-2/#grouping-and-synchronization\n */\nexport class AnimationGroup {\n  animations: (Animation & {\n    start?: RangeOffset;\n    end?: RangeOffset;\n  })[];\n  options?: AnimationGroupOptions;\n  ready: Promise<void>;\n  isCSS: boolean;\n\n  constructor(animations: Animation[], options?: AnimationGroupOptions) {\n    this.animations = animations;\n    this.options = options;\n    this.ready = options?.measured || Promise.resolve();\n    this.isCSS = animations[0] instanceof CSSAnimation;\n  }\n\n  getProgress() {\n    return this.animations[0]?.effect?.getComputedTiming().progress || 0;\n  }\n\n  async play(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.play();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  pause() {\n    for (const animation of this.animations) {\n      animation.pause();\n    }\n  }\n\n  async reverse(callback?: () => void): Promise<void> {\n    await this.ready;\n\n    for (const animation of this.animations) {\n      animation.reverse();\n    }\n\n    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully\n    // await Promise.allSettled(\n    await Promise.all(this.animations.map((animation) => animation.ready));\n\n    if (callback) {\n      callback();\n    }\n  }\n\n  progress(p: number) {\n    for (const animation of this.animations) {\n      const { activeDuration } = animation.effect!.getComputedTiming();\n      const { delay } = animation.effect!.getTiming();\n      animation.currentTime =\n        ((delay || 0) + ((activeDuration as number) || 0)) * p;\n    }\n  }\n\n  cancel() {\n    for (const animation of this.animations) {\n      animation.cancel();\n    }\n  }\n\n  setPlaybackRate(rate: number) {\n    for (const animation of this.animations) {\n      animation.playbackRate = rate;\n    }\n  }\n\n  async onFinish(callback: () => void): Promise<void> {\n    try {\n      await Promise.all(this.animations.map((animation) => animation.finished));\n\n      const a = this.animations[0];\n\n      if (a && !this.isCSS) {\n        const target = (a.effect as KeyframeEffect)?.target;\n\n        if (target) {\n          const endEvent = new Event('animationend');\n          target.dispatchEvent(endEvent);\n        }\n      }\n\n      callback();\n    } catch (_error) {\n      console.warn(\n        'animation was interrupted - aborting onFinish callback - ',\n        _error,\n      );\n    }\n  }\n\n  async onAbort(callback: () => void): Promise<void> {\n    try {\n      await Promise.all(this.animations.map((animation) => animation.finished));\n    } catch (error: any) {\n      if (error.name === 'AbortError') {\n        callback();\n      }\n    }\n  }\n\n  get finished() {\n    return Promise.all(this.animations.map((animation) => animation.finished));\n  }\n\n  get playState() {\n    return this.animations[0]?.playState;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/types/AnimationGroup.d.ts

@@ -22,6 +22,7 @@ export declare class AnimationGroup {
     cancel(): void;
     setPlaybackRate(rate: number): void;
     onFinish(callback: () => void): Promise<void>;
+    onAbort(callback: () => void): Promise<void>;
     get finished(): Promise<Animation[]>;
     get playState(): AnimationPlayState;
 }

package/dist/types/AnimationGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnimationGroup.d.ts","sourceRoot":"","sources":["../../src/AnimationGroup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE7D;;;;;GAKG;AACH,qBAAa,cAAc;IACzB,UAAU,EAAE,CAAC,SAAS,GAAG;QACvB,KAAK,CAAC,EAAE,WAAW,CAAC;QACpB,GAAG,CAAC,EAAE,WAAW,CAAC;KACnB,CAAC,EAAE,CAAC;IACL,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;IACrB,KAAK,EAAE,OAAO,CAAC;gBAEH,UAAU,EAAE,SAAS,EAAE,EAAE,OAAO,CAAC,EAAE,qBAAqB;IAOpE,WAAW;IAIL,IAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBhD,KAAK;IAMC,OAAO,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBnD,QAAQ,CAAC,CAAC,EAAE,MAAM;IASlB,MAAM;IAMN,eAAe,CAAC,IAAI,EAAE,MAAM;IAMtB,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAwBnD,IAAI,QAAQ,yBAEX;IAED,IAAI,SAAS,uBAEZ;CACF"}
+{"version":3,"file":"AnimationGroup.d.ts","sourceRoot":"","sources":["../../src/AnimationGroup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE7D;;;;;GAKG;AACH,qBAAa,cAAc;IACzB,UAAU,EAAE,CAAC,SAAS,GAAG;QACvB,KAAK,CAAC,EAAE,WAAW,CAAC;QACpB,GAAG,CAAC,EAAE,WAAW,CAAC;KACnB,CAAC,EAAE,CAAC;IACL,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;IACrB,KAAK,EAAE,OAAO,CAAC;gBAEH,UAAU,EAAE,SAAS,EAAE,EAAE,OAAO,CAAC,EAAE,qBAAqB;IAOpE,WAAW;IAIL,IAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBhD,KAAK;IAMC,OAAO,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAgBnD,QAAQ,CAAC,CAAC,EAAE,MAAM;IASlB,MAAM;IAMN,eAAe,CAAC,IAAI,EAAE,MAAM;IAMtB,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAwB7C,OAAO,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC;IAUlD,IAAI,QAAQ,yBAEX;IAED,IAAI,SAAS,uBAEZ;CACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/motion",
-  "version": "1.671.0",
+  "version": "1.673.0",
   "license": "UNLICENSED",
   "author": {
     "name": "wow!Team",
@@ -83,5 +83,5 @@
   "wallaby": {
     "autoDetect": true
   },
-  "falconPackageHash": "21ec612c97f6689165f3b221e0e16ac1bcf4cfa9584e7b328205631b"
+  "falconPackageHash": "210c0b14eafce568f53b54a8ce2811e06df870ab8f44d5d5a29de920"
 }