@wix/motion 1.659.0 → 2.0.0-rc.2

package/package.json

@@ -1,87 +1,67 @@
 {
   "name": "@wix/motion",
-  "version": "1.659.0",
-  "license": "UNLICENSED",
-  "author": {
-    "name": "wow!Team",
-    "email": "wow-dev@wix.com"
-  },
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "sideEffects": false,
+  "version": "2.0.0-rc.2",
+  "description": "High-performance animation toolkit for the web, powering Wix motion presets and tooling.",
+  "license": "MIT",
+  "main": "dist/cjs/motion.js",
+  "module": "dist/es/motion.js",
   "types": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/es/motion.js",
+      "require": "./dist/cjs/motion.js"
+    },
+    "./package.json": "./package.json"
+  },
   "files": [
-    "dist/cjs",
-    "dist/esm",
-    "dist/types"
+    "dist"
   ],
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/",
-    "access": "public"
-  },
+  "sideEffects": false,
   "scripts": {
-    "build": "yoshi-library build && yarn build:storybook && janet-build",
-    "build:storybook": "yoshi-library storybook build",
-    "start": "yoshi-library storybook start",
-    "test": "yoshi-library test && yoshi-library lint",
-    "test:coverage": "yoshi-library test --coverage",
-    "lint": "yoshi-library lint",
-    "format": "yoshi-library lint --fix"
-  },
-  "lint-staged": {
-    "*.{js,ts}": "yarn lint"
+    "dev": "vite dev --open",
+    "build": "rimraf dist && npm run build:types && vite build",
+    "build:types": "tsc",
+    "lint": "tsc --noEmit",
+    "test": "vitest run",
+    "coverage": "vitest run --coverage"
   },
-  "dependencies": {
-    "@babel/runtime": "^7.26.0",
-    "fastdom": "^1.0.12"
-  },
-  "devDependencies": {
-    "@storybook/addons": "^6.5.16",
-    "@storybook/theming": "^6.5.16",
-    "@types/jest": "^27.5.2",
-    "@types/node": "^16.18.123",
-    "@wix/effects-kit": "^1.0.0",
-    "@wix/eslint-config-yoshi": "^6.163.0",
-    "@wix/janet-build": "^1.0.8",
-    "@wix/janet-dev-server": "^1.16.20",
-    "@wix/jest-yoshi-preset": "^6.163.0",
-    "@wix/yoshi-flow-library": "^6.163.0",
-    "@wix/yoshi-storybook-dependencies": "^6.163.0",
-    "fizban": "^0.7.0",
-    "kuliso": "^0.4.13",
-    "react": "^16.14.0",
-    "react-dom": "^16.14.0",
-    "ts-jest": "^29.2.5",
-    "typescript": "~4.9.5"
+  "keywords": [
+    "animation",
+    "motion",
+    "web-animations",
+    "browser",
+    "effects",
+    "typescript"
+  ],
+  "author": {
+    "name": "wow!Team",
+    "email": "wow-dev@wix.com"
   },
-  "jest": {
-    "preset": "@wix/jest-yoshi-preset"
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/wix-incubator/interact"
   },
-  "yoshiFlowLibrary": {
-    "buildEsmWithBabel": true
+  "bugs": {
+    "url": "https://github.com/wix-incubator/interact/issues"
   },
-  "eslintConfig": {
-    "extends": "@wix/eslint-config-yoshi"
+  "homepage": "https://github.com/wix-incubator/interact#readme",
+  "engines": {
+    "node": ">=18"
   },
-  "wix": {
-    "artifact": {
-      "groupId": "com.wixpress.wow",
-      "artifactId": "motion",
-      "targets": {
-        "static": true
-      },
-      "previewUrls": [
-        "https://bo.wix.com/pages/motion/"
-      ]
-    },
-    "validations": {
-      "postDependenciesBuild": [
-        "lint"
-      ]
-    }
+  "dependencies": {
+    "fastdom": "^1.0.11"
   },
-  "wallaby": {
-    "autoDetect": true
+  "devDependencies": {
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@vitest/coverage-v8": "^4.0.14",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "rimraf": "^6.0.1",
+    "typescript": "^5.9.3",
+    "vite": "^7.2.2",
+    "vitest": "^4.0.14"
   },
-  "falconPackageHash": "9a4dfe84a53dcc74d3078bad3d67f4327488453b8e263a6098fb227f"
-}
+  "stableVersion": "2.0.0"
+}

package/dist/cjs/AnimationGroup.js

@@ -1,106 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.AnimationGroup = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-/**
- * @class AnimationGroup
- *
- * A wrapper object for simulating a GroupEffect and managing multiple animations.
- * See: https://www.w3.org/TR/web-animations-2/#grouping-and-synchronization
- */
-class AnimationGroup {
-  constructor(animations, options) {
-    (0, _defineProperty2.default)(this, "animations", void 0);
-    (0, _defineProperty2.default)(this, "options", void 0);
-    (0, _defineProperty2.default)(this, "ready", void 0);
-    (0, _defineProperty2.default)(this, "isCSS", void 0);
-    this.animations = animations;
-    this.options = options;
-    this.ready = (options == null ? void 0 : options.measured) || Promise.resolve();
-    this.isCSS = animations[0] instanceof CSSAnimation;
-  }
-  getProgress() {
-    var _this$animations$;
-    return ((_this$animations$ = this.animations[0]) == null || (_this$animations$ = _this$animations$.effect) == null ? void 0 : _this$animations$.getComputedTiming().progress) || 0;
-  }
-  async play(callback) {
-    await this.ready;
-    for (const animation of this.animations) {
-      animation.play();
-    }
-
-    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully
-    // await Promise.allSettled(
-    await Promise.all(this.animations.map(animation => animation.ready));
-    if (callback) {
-      callback();
-    }
-  }
-  pause() {
-    for (const animation of this.animations) {
-      animation.pause();
-    }
-  }
-  async reverse(callback) {
-    await this.ready;
-    for (const animation of this.animations) {
-      animation.reverse();
-    }
-
-    // TODO: Wait for all animations to be ready, using allSettled to handle rejections gracefully
-    // await Promise.allSettled(
-    await Promise.all(this.animations.map(animation => animation.ready));
-    if (callback) {
-      callback();
-    }
-  }
-  progress(p) {
-    for (const animation of this.animations) {
-      const {
-        activeDuration
-      } = animation.effect.getComputedTiming();
-      const {
-        delay
-      } = animation.effect.getTiming();
-      animation.currentTime = ((delay || 0) + (activeDuration || 0)) * p;
-    }
-  }
-  cancel() {
-    for (const animation of this.animations) {
-      animation.cancel();
-    }
-  }
-  setPlaybackRate(rate) {
-    for (const animation of this.animations) {
-      animation.playbackRate = rate;
-    }
-  }
-  async onFinish(callback) {
-    try {
-      await Promise.all(this.animations.map(animation => animation.finished));
-      const a = this.animations[0];
-      if (a && !this.isCSS) {
-        var _a$effect;
-        const target = (_a$effect = a.effect) == null ? void 0 : _a$effect.target;
-        if (target) {
-          const endEvent = new Event('animationend');
-          target.dispatchEvent(endEvent);
-        }
-      }
-      callback();
-    } catch (_error) {
-      console.warn('animation was interrupted - aborting onFinish callback - ', _error);
-    }
-  }
-  get finished() {
-    return Promise.all(this.animations.map(animation => animation.finished));
-  }
-  get playState() {
-    var _this$animations$2;
-    return (_this$animations$2 = this.animations[0]) == null ? void 0 : _this$animations$2.playState;
-  }
-}
-exports.AnimationGroup = AnimationGroup;
-//# sourceMappingURL=AnimationGroup.js.map

package/dist/cjs/AnimationGroup.js.map

@@ -1 +0,0 @@
-{"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":[]}

package/dist/cjs/CustomAnimation.js

@@ -1,190 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.CustomAnimation = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-/**
- * @class CustomAnimation
- *
- * A wrapper object for Animation that mimics the same interface but implements CustomEffect that runs JS code instead of KeyframeEffect.
- * The class is implemented by holding an inner Animation object instead of inheritance due to some browsers not allowing extension of built-in objects.
- */
-class CustomAnimation {
-  constructor(customEffect, target, effectOptions, timingOptions) {
-    (0, _defineProperty2.default)(this, "_animation", void 0);
-    (0, _defineProperty2.default)(this, "customEffect", void 0);
-    (0, _defineProperty2.default)(this, "progress", void 0);
-    (0, _defineProperty2.default)(this, "_tickCbId", void 0);
-    (0, _defineProperty2.default)(this, "_finishHandler", void 0);
-    // overriding composite so that animation is not replaced and removed
-    const effect = new KeyframeEffect(target, [], {
-      ...effectOptions,
-      composite: 'add'
-    });
-    const {
-      timeline
-    } = timingOptions;
-    this._animation = new Animation(effect, timeline);
-    this._tickCbId = null;
-    this.progress = null;
-    this.customEffect = progress => customEffect(effect.target, progress);
-
-    // stop loop if animation is removed from the DOM after finish (does not fire 'remove' event)
-    this._finishHandler = _ => {
-      var _target;
-      if (!((_target = this.effect.target) != null && _target.getAnimations().find(a => a === this._animation))) {
-        this.cancel();
-      }
-    };
-    this.addEventListener('finish', this._finishHandler);
-    this.addEventListener('remove', this._finishHandler);
-  }
-
-  // private tick method for customEffect loop implementation
-  _tick() {
-    try {
-      var _this$effect;
-      const progress = ((_this$effect = this.effect) == null ? void 0 : _this$effect.getComputedTiming().progress) ?? null;
-      if (progress !== this.progress) {
-        var _this$customEffect;
-        (_this$customEffect = this.customEffect) == null || _this$customEffect.call(this, progress);
-        this.progress = progress;
-      }
-      this._tickCbId = requestAnimationFrame(() => {
-        this._tick();
-      });
-    } catch (error) {
-      this._tickCbId = null;
-      console.error(`failed to run customEffect! effectId: ${this.id}, error: ${error instanceof Error ? error.message : error}`);
-    }
-  }
-
-  // Animation timing properties
-  get currentTime() {
-    return this._animation.currentTime;
-  }
-  set currentTime(time) {
-    this._animation.currentTime = time;
-  }
-  get startTime() {
-    return this._animation.startTime;
-  }
-  set startTime(time) {
-    this._animation.startTime = time;
-  }
-  get playbackRate() {
-    return this._animation.playbackRate;
-  }
-  set playbackRate(speed) {
-    this._animation.playbackRate = speed;
-  }
-
-  // Animation basic properties
-  get id() {
-    return this._animation.id;
-  }
-  set id(uid) {
-    this._animation.id = uid;
-  }
-  get effect() {
-    return this._animation.effect;
-  }
-  set effect(e) {
-    this._animation.effect = e;
-  }
-  get timeline() {
-    return this._animation.timeline;
-  }
-  set timeline(tl) {
-    this._animation.timeline = tl;
-  }
-
-  // Animation readonly state properties
-  get finished() {
-    return this._animation.finished;
-  }
-  get pending() {
-    return this._animation.pending;
-  }
-  get playState() {
-    return this._animation.playState;
-  }
-  get ready() {
-    return this._animation.ready;
-  }
-  get replaceState() {
-    return this._animation.replaceState;
-  }
-
-  // Animation event handlers
-  get oncancel() {
-    return this._animation.oncancel;
-  }
-  set oncancel(cb) {
-    this._animation.oncancel = cb;
-  }
-  get onfinish() {
-    return this._animation.onfinish;
-  }
-  set onfinish(cb) {
-    this._animation.onfinish = cb;
-  }
-  get onremove() {
-    return this._animation.onremove;
-  }
-  set onremove(cb) {
-    this._animation.onremove = cb;
-  }
-
-  // CustomAnimation overridden methods
-  play() {
-    this._animation.play();
-    cancelAnimationFrame(this._tickCbId);
-    this._tickCbId = requestAnimationFrame(() => this._tick());
-  }
-  pause() {
-    this._animation.pause();
-    cancelAnimationFrame(this._tickCbId);
-    this._tickCbId = null;
-  }
-  cancel() {
-    this.removeEventListener('finish', this._finishHandler);
-    this.removeEventListener('remove', this._finishHandler);
-    this._animation.cancel();
-    // signaling cancelation for customEffect to handle it as desired
-    this.customEffect(null);
-    cancelAnimationFrame(this._tickCbId);
-    this._tickCbId = null;
-  }
-  commitStyles() {
-    console.warn('CustomEffect animations do not support commitStyles method as they have no style to commit');
-  }
-
-  // Animation methods without override
-  finish() {
-    this._animation.finish();
-  }
-  persist() {
-    this._animation.persist();
-  }
-  reverse() {
-    this._animation.reverse();
-  }
-  updatePlaybackRate(playbackRate) {
-    this._animation.updatePlaybackRate(playbackRate);
-  }
-
-  // Animation events API
-  addEventListener(type, listener, options) {
-    this._animation.addEventListener(type, listener, options);
-  }
-  removeEventListener(type, listener, options) {
-    this._animation.removeEventListener(type, listener, options);
-  }
-  dispatchEvent(event) {
-    return this._animation.dispatchEvent(event);
-  }
-}
-exports.CustomAnimation = CustomAnimation;
-//# sourceMappingURL=CustomAnimation.js.map

package/dist/cjs/CustomAnimation.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["CustomAnimation","constructor","customEffect","target","effectOptions","timingOptions","_defineProperty2","default","effect","KeyframeEffect","composite","timeline","_animation","Animation","_tickCbId","progress","_finishHandler","_","_target","getAnimations","find","a","cancel","addEventListener","_tick","_this$effect","getComputedTiming","_this$customEffect","call","requestAnimationFrame","error","console","id","Error","message","currentTime","time","startTime","playbackRate","speed","uid","e","tl","finished","pending","playState","ready","replaceState","oncancel","cb","onfinish","onremove","play","cancelAnimationFrame","pause","removeEventListener","commitStyles","warn","finish","persist","reverse","updatePlaybackRate","type","listener","options","dispatchEvent","event","exports"],"sources":["../../src/CustomAnimation.ts"],"sourcesContent":["/**\n * @class CustomAnimation\n *\n * A wrapper object for Animation that mimics the same interface but implements CustomEffect that runs JS code instead of KeyframeEffect.\n * The class is implemented by holding an inner Animation object instead of inheritance due to some browsers not allowing extension of built-in objects.\n */\nexport class CustomAnimation {\n  _animation: Animation;\n  customEffect: (progress: number | null) => void;\n  progress: number | null;\n  _tickCbId: number | null;\n  _finishHandler: (_: any) => void;\n\n  constructor(\n    customEffect: (element: Element | null, progress: number | null) => void,\n    target: Element | null,\n    effectOptions: KeyframeEffectOptions,\n    timingOptions: { timeline?: AnimationTimeline | null },\n  ) {\n    // overriding composite so that animation is not replaced and removed\n    const effect = new KeyframeEffect(target, [], {\n      ...effectOptions,\n      composite: 'add',\n    });\n    const { timeline } = timingOptions;\n    this._animation = new Animation(effect, timeline);\n\n    this._tickCbId = null;\n    this.progress = null;\n    this.customEffect = (progress: number | null) =>\n      customEffect(effect.target, progress);\n\n    // stop loop if animation is removed from the DOM after finish (does not fire 'remove' event)\n    this._finishHandler = (_: any) => {\n      if (\n        !(this.effect as KeyframeEffect).target\n          ?.getAnimations()\n          .find((a) => a === this._animation)\n      ) {\n        this.cancel();\n      }\n    };\n    this.addEventListener('finish', this._finishHandler);\n    this.addEventListener('remove', this._finishHandler);\n  }\n\n  // private tick method for customEffect loop implementation\n  private _tick() {\n    try {\n      const progress = this.effect?.getComputedTiming().progress ?? null;\n      if (progress !== this.progress) {\n        this.customEffect?.(progress);\n        this.progress = progress;\n      }\n      this._tickCbId = requestAnimationFrame(() => {\n        this._tick();\n      });\n    } catch (error) {\n      this._tickCbId = null;\n      console.error(\n        `failed to run customEffect! effectId: ${this.id}, error: ${\n          error instanceof Error ? error.message : error\n        }`,\n      );\n    }\n  }\n\n  // Animation timing properties\n  get currentTime() {\n    return this._animation.currentTime;\n  }\n  set currentTime(time: CSSNumberish | null) {\n    this._animation.currentTime = time;\n  }\n  get startTime() {\n    return this._animation.startTime;\n  }\n  set startTime(time: CSSNumberish | null) {\n    this._animation.startTime = time;\n  }\n  get playbackRate() {\n    return this._animation.playbackRate;\n  }\n  set playbackRate(speed: number) {\n    this._animation.playbackRate = speed;\n  }\n\n  // Animation basic properties\n  get id() {\n    return this._animation.id;\n  }\n  set id(uid: string) {\n    this._animation.id = uid;\n  }\n  get effect() {\n    return this._animation.effect;\n  }\n  set effect(e: AnimationEffect | null) {\n    this._animation.effect = e;\n  }\n  get timeline() {\n    return this._animation.timeline;\n  }\n  set timeline(tl: AnimationTimeline | null) {\n    this._animation.timeline = tl;\n  }\n\n  // Animation readonly state properties\n  get finished() {\n    return this._animation.finished;\n  }\n  get pending() {\n    return this._animation.pending;\n  }\n  get playState() {\n    return this._animation.playState;\n  }\n  get ready() {\n    return this._animation.ready;\n  }\n  get replaceState() {\n    return this._animation.replaceState;\n  }\n\n  // Animation event handlers\n  get oncancel() {\n    return this._animation.oncancel;\n  }\n  set oncancel(\n    cb: ((this: Animation, ev: AnimationPlaybackEvent) => any) | null,\n  ) {\n    this._animation.oncancel = cb;\n  }\n  get onfinish() {\n    return this._animation.onfinish;\n  }\n  set onfinish(\n    cb: ((this: Animation, ev: AnimationPlaybackEvent) => any) | null,\n  ) {\n    this._animation.onfinish = cb;\n  }\n  get onremove() {\n    return this._animation.onremove;\n  }\n  set onremove(cb: ((this: Animation, ev: Event) => any) | null) {\n    this._animation.onremove = cb;\n  }\n\n  // CustomAnimation overridden methods\n  play() {\n    this._animation.play();\n    cancelAnimationFrame(this._tickCbId!);\n    this._tickCbId = requestAnimationFrame(() => this._tick());\n  }\n\n  pause() {\n    this._animation.pause();\n    cancelAnimationFrame(this._tickCbId!);\n    this._tickCbId = null;\n  }\n\n  cancel() {\n    this.removeEventListener('finish', this._finishHandler);\n    this.removeEventListener('remove', this._finishHandler);\n    this._animation.cancel();\n    // signaling cancelation for customEffect to handle it as desired\n    this.customEffect(null);\n    cancelAnimationFrame(this._tickCbId!);\n    this._tickCbId = null;\n  }\n\n  commitStyles() {\n    console.warn(\n      'CustomEffect animations do not support commitStyles method as they have no style to commit',\n    );\n  }\n\n  // Animation methods without override\n  finish() {\n    this._animation.finish();\n  }\n  persist() {\n    this._animation.persist();\n  }\n  reverse() {\n    this._animation.reverse();\n  }\n  updatePlaybackRate(playbackRate: number) {\n    this._animation.updatePlaybackRate(playbackRate);\n  }\n\n  // Animation events API\n  addEventListener(\n    type: string,\n    listener: EventListenerOrEventListenerObject,\n    options?: boolean | AddEventListenerOptions,\n  ) {\n    this._animation.addEventListener(type, listener, options);\n  }\n  removeEventListener(\n    type: string,\n    listener: EventListenerOrEventListenerObject,\n    options?: boolean | AddEventListenerOptions,\n  ) {\n    this._animation.removeEventListener(type, listener, options);\n  }\n  dispatchEvent(event: Event) {\n    return this._animation.dispatchEvent(event);\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/api/common.js

@@ -1,145 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-exports.__esModule = true;
-exports.getDirection = getDirection;
-exports.getEffectsData = getEffectsData;
-exports.getElement = getElement;
-exports.getElementMotionPart = getElementMotionPart;
-exports.getLength = getLength;
-exports.getNamedEffect = getNamedEffect;
-exports.getRanges = getRanges;
-exports.isNotAScrubTrigger = isNotAScrubTrigger;
-exports.measure = measure;
-exports.mutate = mutate;
-var _scroll = require("../library/scroll");
-var _entrance = require("../library/entrance");
-var _ongoing = require("../library/ongoing");
-var _mouse = require("../library/mouse");
-var _backgroundScroll = require("../library/backgroundScroll");
-var _utils = require("../utils");
-var _fastdom = _interopRequireDefault(require("fastdom"));
-function getElement(id, ownerDocument) {
-  return id ? (ownerDocument || document).getElementById(id) : null;
-}
-function getElementMotionPart(element, part) {
-  if (element != null && element.matches(`[data-motion-part~="${part}"]`)) {
-    return element;
-  }
-  return element == null ? void 0 : element.querySelector(`[data-motion-part~="${part}"]`);
-}
-function getDirection(effect) {
-  const alternate = effect.alternate ? 'alternate' : '';
-  return effect.reversed ? `${alternate ? `${alternate}-` : ''}reverse` : alternate || 'normal';
-}
-function getLength(length) {
-  return `${length.value}${(0, _utils.getCssUnits)(length.type)}`;
-}
-function getRange(range, add, isEnd) {
-  // according to the CSS spec if the end range is a <length> then it is calculated from the start of the named range
-  // our model assumes that <length> in end range is calculated from the end of the named range
-  return `${range.name || 'cover'} ${isEnd && range.offset.type !== 'percentage' ? `calc(100% + ${getLength(range.offset)}${add ? ` + ${add}` : ''})` : add ? `calc(${getLength(range.offset)} + ${add})` : getLength(range.offset)}`;
-}
-function getRanges(effect) {
-  return {
-    start: getRange(effect.startOffset, effect.startOffsetAdd),
-    end: getRange(effect.endOffset, effect.endOffsetAdd, true)
-  };
-}
-function measure(target) {
-  return fn => _fastdom.default.measure(() => fn(target));
-}
-function mutate(target) {
-  return fn => _fastdom.default.mutate(() => fn(target));
-}
-function getNamedEffect(animation) {
-  if (animation.namedEffect) {
-    const name = animation.namedEffect.type;
-
-    // check each preset library for the named effect
-    if (name in _scroll.scrollAnimations) {
-      return _scroll.scrollAnimations[name];
-    } else if (name in _entrance.entranceAnimations) {
-      return _entrance.entranceAnimations[name];
-    } else if (name in _ongoing.ongoingAnimations) {
-      return _ongoing.ongoingAnimations[name];
-    } else if (name in _mouse.mouseAnimations) {
-      return _mouse.mouseAnimations[name];
-    } else if (name in _backgroundScroll.backgroundScrollAnimations) {
-      return _backgroundScroll.backgroundScrollAnimations[name];
-    }
-  } else if (animation.keyframeEffect) {
-    const effect = animation_ => {
-      const {
-        name,
-        keyframes
-      } = animation_.keyframeEffect;
-      return [{
-        ...animation_,
-        name,
-        keyframes
-      }];
-    };
-    const getNames = animation_ => {
-      const {
-        effectId
-      } = animation_;
-      const {
-        name
-      } = animation_.keyframeEffect;
-      const uid = name || effectId;
-      return uid ? [uid] : [];
-    };
-    return {
-      web: effect,
-      style: effect,
-      getNames
-    };
-  } else if (animation.customEffect) {
-    return animation_ => [{
-      ...animation_,
-      keyframes: []
-    }];
-  }
-  return null;
-}
-function getEffectsData(animations, trigger, effectId) {
-  // process each AnimationData object into a KeyframeEffect object
-  return animations.map((effect, index) => {
-    // prepare the KeyframeEffectOptions object
-    const effectOptions = {
-      fill: effect.fill,
-      easing: (0, _utils.getEasing)(effect.easing),
-      iterations: effect.iterations === 0 ? Infinity : effect.iterations || 1,
-      composite: effect.composite,
-      direction: getDirection(effect)
-    };
-
-    // if this is a time-based animation then set the duration and delay as time values
-    if (isNotAScrubTrigger(trigger)) {
-      effectOptions.duration = effect.duration;
-      effectOptions.delay = effect.delay || 0;
-    } else {
-      // if ViewTimeline is supported
-      if (window.ViewTimeline) {
-        // set duration to 'auto'
-        effectOptions.duration = 'auto';
-      } else {
-        // if ViewTimeline not supported then put a 100ms value in duration get a progress we can easily relate to
-        // we split the duration to 99.99ms and delay of 0.01ms to get the fill-mode effect working
-        effectOptions.duration = 99.99;
-        effectOptions.delay = 0.01;
-      }
-    }
-    return {
-      effect,
-      options: effectOptions,
-      id: effectId && `${effectId}-${index + 1}`,
-      part: effect.part
-    };
-  });
-}
-function isNotAScrubTrigger(trigger) {
-  return !trigger || trigger.trigger !== 'pointer-move' && trigger.trigger !== 'view-progress';
-}
-//# sourceMappingURL=common.js.map

package/dist/cjs/api/common.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_scroll","require","_entrance","_ongoing","_mouse","_backgroundScroll","_utils","_fastdom","_interopRequireDefault","getElement","id","ownerDocument","document","getElementById","getElementMotionPart","element","part","matches","querySelector","getDirection","effect","alternate","reversed","getLength","length","value","getCssUnits","type","getRange","range","add","isEnd","name","offset","getRanges","start","startOffset","startOffsetAdd","end","endOffset","endOffsetAdd","measure","target","fn","fastdom","mutate","getNamedEffect","animation","namedEffect","scrollAnimations","entranceAnimations","ongoingAnimations","mouseAnimations","backgroundScrollAnimations","keyframeEffect","animation_","keyframes","getNames","effectId","uid","web","style","customEffect","getEffectsData","animations","trigger","map","index","effectOptions","fill","easing","getEasing","iterations","Infinity","composite","direction","isNotAScrubTrigger","duration","delay","window","ViewTimeline","options"],"sources":["../../../src/api/common.ts"],"sourcesContent":["import type {\n  AnimationData,\n  AnimationDataForScrub,\n  AnimationOptions,\n  BackgroundScrollAnimations,\n  EntranceAnimations,\n  MeasureCallback,\n  MouseAnimations,\n  OngoingAnimations,\n  RangeOffset,\n  ScrollAnimations,\n  TimeAnimationOptions,\n  TriggerVariant,\n  UnitLengthPercentage,\n} from '../types';\nimport { scrollAnimations } from '../library/scroll';\nimport { entranceAnimations } from '../library/entrance';\nimport { ongoingAnimations } from '../library/ongoing';\nimport { mouseAnimations } from '../library/mouse';\nimport { backgroundScrollAnimations } from '../library/backgroundScroll';\nimport { getCssUnits, getEasing } from '../utils';\nimport fastdom from 'fastdom';\n\nfunction getElement(\n  id: string | null,\n  ownerDocument?: Document,\n): HTMLElement | null {\n  return id ? (ownerDocument || document).getElementById(id) : null;\n}\n\nfunction getElementMotionPart(element: Element | null, part: string) {\n  if (element?.matches(`[data-motion-part~=\"${part}\"]`)) {\n    return element;\n  }\n  return element?.querySelector(`[data-motion-part~=\"${part}\"]`);\n}\n\nfunction getDirection(\n  effect: AnimationData,\n): KeyframeEffectOptions['direction'] {\n  const alternate = effect.alternate ? 'alternate' : '';\n  return effect.reversed\n    ? (`${alternate ? `${alternate}-` : ''}reverse` as\n        | 'reverse'\n        | 'alternate-reverse')\n    : alternate || 'normal';\n}\n\nfunction getLength(length: UnitLengthPercentage): string {\n  return `${length.value}${getCssUnits(length.type)}`;\n}\n\nfunction getRange(\n  range: RangeOffset,\n  add: string | undefined,\n  isEnd?: boolean,\n) {\n  // according to the CSS spec if the end range is a <length> then it is calculated from the start of the named range\n  // our model assumes that <length> in end range is calculated from the end of the named range\n  return `${range.name || 'cover'} ${\n    isEnd && range.offset!.type !== 'percentage'\n      ? `calc(100% + ${getLength(range.offset!)}${add ? ` + ${add}` : ''})`\n      : add\n      ? `calc(${getLength(range.offset!)} + ${add})`\n      : getLength(range.offset!)\n  }`;\n}\n\nfunction getRanges(effect: AnimationDataForScrub) {\n  return {\n    start: getRange(effect.startOffset!, effect.startOffsetAdd),\n    end: getRange(effect.endOffset!, effect.endOffsetAdd, true),\n  };\n}\n\nfunction measure(target: HTMLElement | null): MeasureCallback {\n  return (fn) => fastdom.measure(() => fn(target));\n}\n\nfunction mutate(target: HTMLElement | null): MeasureCallback {\n  return (fn) => fastdom.mutate(() => fn(target));\n}\n\nfunction getNamedEffect(animation: AnimationOptions) {\n  if (animation.namedEffect) {\n    const name = animation.namedEffect.type;\n\n    // check each preset library for the named effect\n    if (name in scrollAnimations) {\n      return scrollAnimations[name as keyof ScrollAnimations];\n    } else if (name in entranceAnimations) {\n      return entranceAnimations[name as keyof EntranceAnimations];\n    } else if (name in ongoingAnimations) {\n      return ongoingAnimations[name as keyof OngoingAnimations];\n    } else if (name in mouseAnimations) {\n      return mouseAnimations[name as keyof MouseAnimations];\n    } else if (name in backgroundScrollAnimations) {\n      return backgroundScrollAnimations[\n        name as keyof BackgroundScrollAnimations\n      ];\n    }\n  } else if (animation.keyframeEffect) {\n    const effect = (animation_: AnimationOptions) => {\n      const { name, keyframes } = animation_.keyframeEffect!;\n\n      return [{ ...animation_, name, keyframes }];\n    };\n    const getNames = (animation_: AnimationOptions) => {\n      const { effectId } = animation_;\n      const { name } = animation_.keyframeEffect!;\n      const uid = name || effectId;\n\n      return uid ? [uid] : [];\n    };\n    return { web: effect, style: effect, getNames };\n  } else if (animation.customEffect) {\n    return (animation_: AnimationOptions) => [{ ...animation_, keyframes: [] }];\n  }\n  return null;\n}\n\nfunction getEffectsData(\n  animations: AnimationData[],\n  trigger?: Partial<TriggerVariant>,\n  effectId?: string,\n) {\n  // process each AnimationData object into a KeyframeEffect object\n  return animations.map((effect, index) => {\n    // prepare the KeyframeEffectOptions object\n    const effectOptions = {\n      fill: effect.fill,\n      easing: getEasing(effect.easing),\n      iterations: effect.iterations === 0 ? Infinity : effect.iterations || 1,\n      composite: effect.composite,\n      direction: getDirection(effect),\n    } as KeyframeEffectOptions & { rangeStart: string; rangeEnd: string };\n\n    // if this is a time-based animation then set the duration and delay as time values\n    if (isNotAScrubTrigger(trigger)) {\n      effectOptions.duration = effect.duration as number;\n      effectOptions.delay = (effect as TimeAnimationOptions).delay || 0;\n    } else {\n      // if ViewTimeline is supported\n      if (window.ViewTimeline) {\n        // set duration to 'auto'\n        effectOptions.duration = 'auto';\n      } else {\n        // if ViewTimeline not supported then put a 100ms value in duration get a progress we can easily relate to\n        // we split the duration to 99.99ms and delay of 0.01ms to get the fill-mode effect working\n        effectOptions.duration = 99.99;\n        effectOptions.delay = 0.01;\n      }\n    }\n\n    return {\n      effect,\n      options: effectOptions,\n      id: effectId && `${effectId}-${index + 1}`,\n      part: effect.part,\n    };\n  });\n}\n\nfunction isNotAScrubTrigger(trigger?: Partial<TriggerVariant>) {\n  return (\n    !trigger ||\n    (trigger.trigger !== 'pointer-move' && trigger.trigger !== 'view-progress')\n  );\n}\n\nexport {\n  isNotAScrubTrigger,\n  getElement,\n  getElementMotionPart,\n  getNamedEffect,\n  getEffectsData,\n  measure,\n  mutate,\n  getDirection,\n  getLength,\n  getRanges,\n};\n"],"mappings":"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","ignoreList":[]}