@wix/motion 1.0.72 → 1.571.0

package/dist/esm/library/mouse/BlobMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getCssUnits","getMouseTransitionEasing","mapRange","CustomMouse","paramsMap","soft","scale","easing","medium","hard","BlobMouseAnimation","progress","_ref","x","progressX","y","progressY","distance","invert","options","translateX","value","translateY","scaleX","scaleY","units","type","target","style","transform","cancel","transition","create","transitionDuration","transitionEasing","power","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/BlobMouse.ts"],"sourcesContent":["import { getCssUnits, getMouseTransitionEasing, mapRange } from '../../utils';\nimport { CustomMouse } from './CustomMouse';\nimport {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  BlobMouse,\n  Progress,\n  EffectPower,\n  ScrubTransitionEasing,\n} from '../../types';\n\nconst paramsMap: Record<\n  EffectPower,\n  { scale: number; easing: ScrubTransitionEasing }\n> = {\n  soft: { scale: 1.2, easing: 'easeOut' },\n  medium: { scale: 1.6, easing: 'easeOut' },\n  hard: { scale: 2.4, easing: 'easeOut' },\n};\n\nclass BlobMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    const { distance, scale, invert } = this.options;\n    const translateX =\n      mapRange(0, 1, -distance.value, distance.value, progressX) * invert;\n    const translateY =\n      mapRange(0, 1, -distance.value, distance.value, progressY) * invert;\n\n    // if progressX === 0 || progressX === 1, scaleX === scale, if progressX === 0.5, scaleX === 1\n    const scaleX =\n      progressX < 0.5\n        ? mapRange(0, 0.5, scale, 1, progressX)\n        : mapRange(0.5, 1, 1, scale, progressX);\n\n    // if progressY === 0 || progressY === 1, scaleY === scale, if progressY === 0.5, scaleY === 1\n    const scaleY =\n      progressY < 0.5\n        ? mapRange(0, 0.5, scale, 1, progressY)\n        : mapRange(0.5, 1, 1, scale, progressY);\n\n    const units = getCssUnits(distance.type);\n\n    this.target.style.transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) scale(${scaleX}, ${scaleY}) rotate(var(--comp-rotate-z, 0deg))`;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    inverted = false,\n    distance = { value: 200, type: 'px' },\n    scale = 1.4,\n  } = options.namedEffect as BlobMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}`\n      : '',\n    invert,\n    distance,\n    scale: power ? paramsMap[power].scale : scale,\n  };\n\n  return (target: HTMLElement) =>\n    new BlobMouseAnimation(target, animationOptions);\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/library/mouse/BlurMouse.js

@@ -0,0 +1,91 @@
+import { getCssUnits, getMouseTransitionEasing, distance2d, mapRange } from '../../utils';
+import { quadInOut } from '../../easings';
+import { CustomMouse } from './CustomMouse';
+const paramsMap = {
+  soft: {
+    angle: 0,
+    scale: 1,
+    easing: 'easeOut'
+  },
+  medium: {
+    angle: 25,
+    scale: 0.7,
+    easing: 'easeOut'
+  },
+  hard: {
+    angle: 65,
+    scale: 0.25,
+    easing: 'easeOut'
+  }
+};
+class BlurMouseAnimation extends CustomMouse {
+  progress(_ref) {
+    let {
+      x: progressX,
+      y: progressY
+    } = _ref;
+    const {
+      distance,
+      angle,
+      scale,
+      invert,
+      blur,
+      perspective
+    } = this.options;
+    const translateX = mapRange(0, 1, -distance.value, distance.value, progressX) * invert;
+    const translateY = mapRange(0, 1, -distance.value, distance.value, progressY) * invert;
+
+    // if progressX === 0 || progressX === 1, scaleX === scale, if progressX === 0.5, scaleX === 1
+    const scaleX = progressX < 0.5 ? mapRange(0, 0.5, scale, 1, progressX) : mapRange(0.5, 1, 1, scale, progressX);
+
+    // if progressY === 0 || progressY === 1, scaleY === scale, if progressY === 0.5, scaleY === 1
+    const scaleY = progressY < 0.5 ? mapRange(0, 0.5, scale, 1, progressY) : mapRange(0.5, 1, 1, scale, progressY);
+    const maxScale = Math.min(scaleX, scaleY);
+
+    // if progressX === 0, rotateX === -angle, if progressX === 0.5, rotateX === 0, if progressX === 1, rotateX === angle
+    const rotateX = mapRange(0, 1, -angle, angle, progressY) * invert;
+    const rotateY = mapRange(0, 1, angle, -angle, progressX) * invert;
+    const units = getCssUnits(distance.type);
+    const transform = `perspective(${perspective}px) translateX(${translateX}${units}) translateY(${translateY}${units}) scale(${maxScale}, ${maxScale}) rotateX(${rotateX}deg) rotateY(${rotateY}deg) rotate(var(--comp-rotate-z, 0deg))`;
+    const progressDistance = distance2d([0.5, 0.5], [progressX, progressY]);
+    const blurFilter = Math.round(mapRange(0, 1, 0, blur, quadInOut(progressDistance)));
+    const filter = `blur(${blurFilter}px)`;
+    this.target.style.transform = transform;
+    this.target.style.filter = filter;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.filter = '';
+    this.target.style.transition = '';
+  }
+}
+export default function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing
+  } = options;
+  const {
+    power,
+    inverted = false,
+    distance = {
+      value: 80,
+      type: 'px'
+    },
+    angle = 5,
+    scale = 0.3,
+    blur = 20,
+    perspective = 600
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(power ? paramsMap[power].easing : transitionEasing)}, filter ${transitionDuration}ms ${getMouseTransitionEasing(power ? paramsMap[power].easing : transitionEasing)}` : '',
+    distance,
+    angle: power ? paramsMap[power].angle : angle,
+    scale: power ? paramsMap[power].scale : scale,
+    blur,
+    perspective,
+    invert
+  };
+  return target => new BlurMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=BlurMouse.js.map

package/dist/esm/library/mouse/BlurMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getCssUnits","getMouseTransitionEasing","distance2d","mapRange","quadInOut","CustomMouse","paramsMap","soft","angle","scale","easing","medium","hard","BlurMouseAnimation","progress","_ref","x","progressX","y","progressY","distance","invert","blur","perspective","options","translateX","value","translateY","scaleX","scaleY","maxScale","Math","min","rotateX","rotateY","units","type","transform","progressDistance","blurFilter","round","filter","target","style","cancel","transition","create","transitionDuration","transitionEasing","power","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/BlurMouse.ts"],"sourcesContent":["import {\n  getCssUnits,\n  getMouseTransitionEasing,\n  distance2d,\n  mapRange,\n} from '../../utils';\nimport { quadInOut } from '../../easings';\nimport { CustomMouse } from './CustomMouse';\nimport {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  BlurMouse,\n  Progress,\n  EffectPower,\n  ScrubTransitionEasing,\n} from '../../types';\n\nconst paramsMap: Record<\n  EffectPower,\n  { angle: number; scale: number; easing: ScrubTransitionEasing }\n> = {\n  soft: { angle: 0, scale: 1, easing: 'easeOut' },\n  medium: { angle: 25, scale: 0.7, easing: 'easeOut' },\n  hard: { angle: 65, scale: 0.25, easing: 'easeOut' },\n};\nclass BlurMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    const { distance, angle, scale, invert, blur, perspective } = this.options;\n\n    const translateX =\n      mapRange(0, 1, -distance.value, distance.value, progressX) * invert;\n    const translateY =\n      mapRange(0, 1, -distance.value, distance.value, progressY) * invert;\n\n    // if progressX === 0 || progressX === 1, scaleX === scale, if progressX === 0.5, scaleX === 1\n    const scaleX =\n      progressX < 0.5\n        ? mapRange(0, 0.5, scale, 1, progressX)\n        : mapRange(0.5, 1, 1, scale, progressX);\n\n    // if progressY === 0 || progressY === 1, scaleY === scale, if progressY === 0.5, scaleY === 1\n    const scaleY =\n      progressY < 0.5\n        ? mapRange(0, 0.5, scale, 1, progressY)\n        : mapRange(0.5, 1, 1, scale, progressY);\n\n    const maxScale = Math.min(scaleX, scaleY);\n\n    // if progressX === 0, rotateX === -angle, if progressX === 0.5, rotateX === 0, if progressX === 1, rotateX === angle\n    const rotateX = mapRange(0, 1, -angle, angle, progressY) * invert;\n    const rotateY = mapRange(0, 1, angle, -angle, progressX) * invert;\n\n    const units = getCssUnits(distance.type);\n\n    const transform = `perspective(${perspective}px) translateX(${translateX}${units}) translateY(${translateY}${units}) scale(${maxScale}, ${maxScale}) rotateX(${rotateX}deg) rotateY(${rotateY}deg) rotate(var(--comp-rotate-z, 0deg))`;\n\n    const progressDistance = distance2d(\n      [0.5, 0.5],\n      [progressX, progressY],\n    );\n    const blurFilter = Math.round(\n      mapRange(0, 1, 0, blur, quadInOut(progressDistance)),\n    );\n\n    const filter = `blur(${blurFilter}px)`;\n\n    this.target.style.transform = transform;\n    this.target.style.filter = filter;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.filter = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    inverted = false,\n    distance = { value: 80, type: 'px' },\n    angle = 5,\n    scale = 0.3,\n    blur = 20,\n    perspective = 600,\n  } = options.namedEffect as BlurMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}, filter ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}`\n      : '',\n    distance,\n    angle: power ? paramsMap[power].angle : angle,\n    scale: power ? paramsMap[power].scale : scale,\n    blur,\n    perspective,\n    invert,\n  };\n\n  return (target: HTMLElement) =>\n    new BlurMouseAnimation(target, animationOptions);\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/library/mouse/BounceMouse.js

@@ -0,0 +1,21 @@
+import createTrack from './TrackMouse';
+export default function create(options) {
+  const {
+    distance = {
+      value: 80,
+      type: 'px'
+    }
+  } = options.namedEffect;
+  const {
+    transitionEasing = 'elastic'
+  } = options;
+  return createTrack({
+    ...options,
+    transitionEasing,
+    namedEffect: {
+      ...options.namedEffect,
+      distance
+    }
+  });
+}
+//# sourceMappingURL=BounceMouse.js.map

package/dist/esm/library/mouse/BounceMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createTrack","create","options","distance","value","type","namedEffect","transitionEasing"],"sources":["../../../../src/library/mouse/BounceMouse.ts"],"sourcesContent":["import {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  BounceMouse,\n  TrackMouse,\n} from '../../types';\nimport createTrack from './TrackMouse';\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { distance = { value: 80, type: 'px' } } =\n    options.namedEffect as BounceMouse;\n  const { transitionEasing = 'elastic' } = options;\n  return createTrack({\n    ...options,\n    transitionEasing,\n    namedEffect: { ...options.namedEffect, distance } as TrackMouse,\n  });\n}\n"],"mappings":"AAMA,OAAOA,WAAW,MAAM,cAAc;AAEtC,eAAe,SAASC,MAAMA,CAC5BC,OAAsD,EACtD;EACA,MAAM;IAAEC,QAAQ,GAAG;MAAEC,KAAK,EAAE,EAAE;MAAEC,IAAI,EAAE;IAAK;EAAE,CAAC,GAC5CH,OAAO,CAACI,WAA0B;EACpC,MAAM;IAAEC,gBAAgB,GAAG;EAAU,CAAC,GAAGL,OAAO;EAChD,OAAOF,WAAW,CAAC;IACjB,GAAGE,OAAO;IACVK,gBAAgB;IAChBD,WAAW,EAAE;MAAE,GAAGJ,OAAO,CAACI,WAAW;MAAEH;IAAS;EAClD,CAAC,CAAC;AACJ","ignoreList":[]}

package/dist/esm/library/mouse/CustomMouse.js

@@ -0,0 +1,56 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+export class CustomMouse {
+  constructor(target, options) {
+    _defineProperty(this, "target", void 0);
+    _defineProperty(this, "options", void 0);
+    _defineProperty(this, "currentProgress", void 0);
+    this.target = target;
+    this.options = options || {};
+    this.currentProgress = {
+      x: 0.5,
+      y: 0.5,
+      v: {
+        x: 0,
+        y: 0
+      },
+      active: true
+    };
+    this.play();
+  }
+  progress(_ref) {
+    let {
+      x,
+      y,
+      v,
+      active
+    } = _ref;
+    this.currentProgress = {
+      x,
+      y,
+      v,
+      active
+    };
+  }
+  cancel() {
+    this.currentProgress = {
+      x: 0.5,
+      y: 0.5,
+      v: {
+        x: 0,
+        y: 0
+      }
+    };
+  }
+  getProgress() {
+    return this.currentProgress;
+  }
+  play() {
+    if (this.options.transition && this.target) {
+      this.target.style.transition = this.options.transition;
+    }
+  }
+}
+export function create(options) {
+  return target => new CustomMouse(target, options);
+}
+//# sourceMappingURL=CustomMouse.js.map

package/dist/esm/library/mouse/CustomMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CustomMouse","constructor","target","options","_defineProperty","currentProgress","x","y","v","active","play","progress","_ref","cancel","getProgress","transition","style","create"],"sources":["../../../../src/library/mouse/CustomMouse.ts"],"sourcesContent":["import type {\n  AnimationExtraOptions,\n  Progress,\n  ScrubAnimationOptions,\n} from '../../types';\n\nexport class CustomMouse {\n  target: HTMLElement;\n  options: Record<string, any>;\n  currentProgress: Progress;\n\n  constructor(target: HTMLElement, options?: Record<string, any>) {\n    this.target = target;\n    this.options = options || {};\n    this.currentProgress = { x: 0.5, y: 0.5, v: { x: 0, y: 0 }, active: true };\n\n    this.play();\n  }\n\n  progress({ x, y, v, active }: Progress) {\n    this.currentProgress = { x, y, v, active };\n  }\n\n  cancel() {\n    this.currentProgress = { x: 0.5, y: 0.5, v: { x: 0, y: 0 } };\n  }\n\n  getProgress() {\n    return this.currentProgress;\n  }\n\n  play() {\n    if (this.options.transition && this.target) {\n      this.target.style.transition = this.options.transition;\n    }\n  }\n}\n\nexport function create(options: ScrubAnimationOptions & AnimationExtraOptions) {\n  return (target: HTMLElement) => new CustomMouse(target, options);\n}\n"],"mappings":";AAMA,OAAO,MAAMA,WAAW,CAAC;EAKvBC,WAAWA,CAACC,MAAmB,EAAEC,OAA6B,EAAE;IAAAC,eAAA;IAAAA,eAAA;IAAAA,eAAA;IAC9D,IAAI,CAACF,MAAM,GAAGA,MAAM;IACpB,IAAI,CAACC,OAAO,GAAGA,OAAO,IAAI,CAAC,CAAC;IAC5B,IAAI,CAACE,eAAe,GAAG;MAAEC,CAAC,EAAE,GAAG;MAAEC,CAAC,EAAE,GAAG;MAAEC,CAAC,EAAE;QAAEF,CAAC,EAAE,CAAC;QAAEC,CAAC,EAAE;MAAE,CAAC;MAAEE,MAAM,EAAE;IAAK,CAAC;IAE1E,IAAI,CAACC,IAAI,CAAC,CAAC;EACb;EAEAC,QAAQA,CAAAC,IAAA,EAAgC;IAAA,IAA/B;MAAEN,CAAC;MAAEC,CAAC;MAAEC,CAAC;MAAEC;IAAiB,CAAC,GAAAG,IAAA;IACpC,IAAI,CAACP,eAAe,GAAG;MAAEC,CAAC;MAAEC,CAAC;MAAEC,CAAC;MAAEC;IAAO,CAAC;EAC5C;EAEAI,MAAMA,CAAA,EAAG;IACP,IAAI,CAACR,eAAe,GAAG;MAAEC,CAAC,EAAE,GAAG;MAAEC,CAAC,EAAE,GAAG;MAAEC,CAAC,EAAE;QAAEF,CAAC,EAAE,CAAC;QAAEC,CAAC,EAAE;MAAE;IAAE,CAAC;EAC9D;EAEAO,WAAWA,CAAA,EAAG;IACZ,OAAO,IAAI,CAACT,eAAe;EAC7B;EAEAK,IAAIA,CAAA,EAAG;IACL,IAAI,IAAI,CAACP,OAAO,CAACY,UAAU,IAAI,IAAI,CAACb,MAAM,EAAE;MAC1C,IAAI,CAACA,MAAM,CAACc,KAAK,CAACD,UAAU,GAAG,IAAI,CAACZ,OAAO,CAACY,UAAU;IACxD;EACF;AACF;AAEA,OAAO,SAASE,MAAMA,CAACd,OAAsD,EAAE;EAC7E,OAAQD,MAAmB,IAAK,IAAIF,WAAW,CAACE,MAAM,EAAEC,OAAO,CAAC;AAClE","ignoreList":[]}

package/dist/esm/library/mouse/ScaleMouse.js

@@ -0,0 +1,95 @@
+import { getCssUnits, getMouseTransitionEasing, mapRange } from '../../utils';
+import { CustomMouse } from './CustomMouse';
+const paramsMap = {
+  down: {
+    soft: {
+      scale: 0.85,
+      easing: 'easeOut'
+    },
+    medium: {
+      scale: 0.5,
+      easing: 'easeOut'
+    },
+    hard: {
+      scale: 0,
+      easing: 'easeOut'
+    }
+  },
+  up: {
+    soft: {
+      scale: 1.2,
+      easing: 'easeOut'
+    },
+    medium: {
+      scale: 1.6,
+      easing: 'easeOut'
+    },
+    hard: {
+      scale: 2.4,
+      easing: 'easeOut'
+    }
+  }
+};
+class ScaleMouseAnimation extends CustomMouse {
+  progress(_ref) {
+    let {
+      x: progressX,
+      y: progressY
+    } = _ref;
+    const {
+      distance,
+      scale,
+      invert,
+      axis
+    } = this.options;
+    let translateX = 0;
+    let translateY = 0;
+    let scaleX = 1;
+    let scaleY = 1;
+    if (axis === 'both' || axis === 'horizontal') {
+      translateX = mapRange(0, 1, -distance.value, distance.value, progressX) * invert;
+      scaleX = progressX < 0.5 ? mapRange(0, 0.5, scale, 1, progressX) : mapRange(0.5, 1, 1, scale, progressX);
+    }
+    if (axis === 'both' || axis === 'vertical') {
+      translateY = mapRange(0, 1, -distance.value, distance.value, progressY) * invert;
+      scaleY = progressY < 0.5 ? mapRange(0, 0.5, scale, 1, progressY) : mapRange(0.5, 1, 1, scale, progressY);
+    }
+
+    // scale is uniform so we use the smaller scale value if scale < 1
+    // and the bigger scale value if scale > 1
+    const scaleBoth = scale < 1 ? Math.min(scaleX, scaleY) : Math.max(scaleX, scaleY);
+    const units = getCssUnits(distance.type);
+    this.target.style.transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) scale(${scaleBoth}) rotate(var(--comp-rotate-z, 0deg))`;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.transition = '';
+  }
+}
+export default function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing
+  } = options;
+  const {
+    power,
+    scaleDirection = 'down',
+    inverted = false,
+    distance = {
+      value: 80,
+      type: 'px'
+    },
+    axis = 'both',
+    scale = 1.4
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(power ? paramsMap[scaleDirection][power].easing : transitionEasing)}` : '',
+    invert,
+    distance,
+    axis,
+    scale: power ? paramsMap[scaleDirection][power].scale : scale
+  };
+  return target => new ScaleMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=ScaleMouse.js.map

package/dist/esm/library/mouse/ScaleMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getCssUnits","getMouseTransitionEasing","mapRange","CustomMouse","paramsMap","down","soft","scale","easing","medium","hard","up","ScaleMouseAnimation","progress","_ref","x","progressX","y","progressY","distance","invert","axis","options","translateX","translateY","scaleX","scaleY","value","scaleBoth","Math","min","max","units","type","target","style","transform","cancel","transition","create","transitionDuration","transitionEasing","power","scaleDirection","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/ScaleMouse.ts"],"sourcesContent":["import { getCssUnits, getMouseTransitionEasing, mapRange } from '../../utils';\nimport { CustomMouse } from './CustomMouse';\nimport {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  ScaleMouse,\n  Progress,\n  EffectPower,\n  ScrubTransitionEasing,\n} from '../../types';\n\nconst paramsMap: Record<\n  ScaleMouse['scaleDirection'],\n  Record<EffectPower, { scale: number; easing: ScrubTransitionEasing }>\n> = {\n  down: {\n    soft: { scale: 0.85, easing: 'easeOut' },\n    medium: { scale: 0.5, easing: 'easeOut' },\n    hard: { scale: 0, easing: 'easeOut' },\n  },\n  up: {\n    soft: { scale: 1.2, easing: 'easeOut' },\n    medium: { scale: 1.6, easing: 'easeOut' },\n    hard: { scale: 2.4, easing: 'easeOut' },\n  },\n};\n\nclass ScaleMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    const { distance, scale, invert, axis } = this.options;\n\n    let translateX = 0;\n    let translateY = 0;\n    let scaleX = 1;\n    let scaleY = 1;\n\n    if (axis === 'both' || axis === 'horizontal') {\n      translateX =\n        mapRange(0, 1, -distance.value, distance.value, progressX) * invert;\n      scaleX =\n        progressX < 0.5\n          ? mapRange(0, 0.5, scale, 1, progressX)\n          : mapRange(0.5, 1, 1, scale, progressX);\n    }\n\n    if (axis === 'both' || axis === 'vertical') {\n      translateY =\n        mapRange(0, 1, -distance.value, distance.value, progressY) * invert;\n      scaleY =\n        progressY < 0.5\n          ? mapRange(0, 0.5, scale, 1, progressY)\n          : mapRange(0.5, 1, 1, scale, progressY);\n    }\n\n    // scale is uniform so we use the smaller scale value if scale < 1\n    // and the bigger scale value if scale > 1\n    const scaleBoth =\n      scale < 1 ? Math.min(scaleX, scaleY) : Math.max(scaleX, scaleY);\n\n    const units = getCssUnits(distance.type);\n\n    this.target.style.transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) scale(${scaleBoth}) rotate(var(--comp-rotate-z, 0deg))`;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    scaleDirection = 'down',\n    inverted = false,\n    distance = { value: 80, type: 'px' },\n    axis = 'both',\n    scale = 1.4,\n  } = options.namedEffect as ScaleMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[scaleDirection][power].easing : transitionEasing,\n        )}`\n      : '',\n    invert,\n    distance,\n    axis,\n    scale: power ? paramsMap[scaleDirection][power].scale : scale,\n  };\n\n  return (target: HTMLElement) =>\n    new ScaleMouseAnimation(target, animationOptions);\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/library/mouse/SkewMouse.js

@@ -0,0 +1,89 @@
+import { getCssUnits, getMouseTransitionEasing, mapRange } from '../../utils';
+import { circInOut } from '../../easings';
+import { CustomMouse } from './CustomMouse';
+const paramsMap = {
+  soft: {
+    angle: 10,
+    easing: 'easeOut'
+  },
+  medium: {
+    angle: 20,
+    easing: 'easeOut'
+  },
+  hard: {
+    angle: 45,
+    easing: 'easeOut'
+  }
+};
+class SkewMouseAnimation extends CustomMouse {
+  progress(_ref) {
+    let {
+      x: progressX,
+      y: progressY
+    } = _ref;
+    let translateX = 0;
+    let translateY = 0;
+    let skewX = 0;
+    let skewY = 0;
+    const {
+      distance,
+      angle,
+      axis,
+      invert
+    } = this.options;
+
+    // distance
+    if (axis !== 'vertical') {
+      translateX = mapRange(0, 1, -distance.value, distance.value, progressX) * invert;
+      skewX = mapRange(0, 1, angle, -angle, progressX) * invert;
+    }
+    if (axis !== 'horizontal') {
+      translateY = mapRange(0, 1, -distance.value, distance.value, progressY) * invert;
+      skewY = mapRange(0, 1, angle, -angle, progressY) * invert;
+    }
+    if (axis === 'both') {
+      // We want to do `skewX *= progressY < 0.5 ? 1 : -1`
+      // but normalize it by y progress (so it will be 0 when y is 0.5)
+      // and apply a circInOut easing on the progress so it will feel more natural
+      skewX *= mapRange(0, 1, 1, -1, circInOut(progressY));
+
+      // we want to do `skewY *= progressX < 0.5 ? 1 : -1`
+      // but normalize it by x progress (so it will be 0 when x is 0.5)
+      // and apply a circInOut easing on the progress so it will feel more natural
+      skewY *= mapRange(0, 1, 1, -1, circInOut(progressX));
+    }
+    const units = getCssUnits(distance.type);
+    const transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) skew(${skewX}deg, ${skewY}deg) rotate(var(--comp-rotate-z, 0deg))`;
+    this.target.style.transform = transform;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.transition = '';
+  }
+}
+export default function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing
+  } = options;
+  const {
+    power,
+    inverted = false,
+    distance = {
+      value: 200,
+      type: 'px'
+    },
+    angle = 25,
+    axis = 'both'
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(power ? paramsMap[power].easing : transitionEasing)}` : '',
+    invert,
+    distance,
+    angle: power ? paramsMap[power].angle : angle,
+    axis
+  };
+  return target => new SkewMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=SkewMouse.js.map

package/dist/esm/library/mouse/SkewMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getCssUnits","getMouseTransitionEasing","mapRange","circInOut","CustomMouse","paramsMap","soft","angle","easing","medium","hard","SkewMouseAnimation","progress","_ref","x","progressX","y","progressY","translateX","translateY","skewX","skewY","distance","axis","invert","options","value","units","type","transform","target","style","cancel","transition","create","transitionDuration","transitionEasing","power","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/SkewMouse.ts"],"sourcesContent":["import {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  SkewMouse,\n  Progress,\n  ScrubTransitionEasing,\n  EffectPower,\n} from '../../types';\nimport { getCssUnits, getMouseTransitionEasing, mapRange } from '../../utils';\nimport { circInOut } from '../../easings';\nimport { CustomMouse } from './CustomMouse';\n\nconst paramsMap: Record<\n  EffectPower,\n  { angle: number; easing: ScrubTransitionEasing }\n> = {\n  soft: { angle: 10, easing: 'easeOut' },\n  medium: { angle: 20, easing: 'easeOut' },\n  hard: { angle: 45, easing: 'easeOut' },\n};\n\nclass SkewMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    let translateX = 0;\n    let translateY = 0;\n    let skewX = 0;\n    let skewY = 0;\n    const { distance, angle, axis, invert } = this.options;\n\n    // distance\n    if (axis !== 'vertical') {\n      translateX =\n        mapRange(0, 1, -distance.value, distance.value, progressX) * invert;\n      skewX = mapRange(0, 1, angle, -angle, progressX) * invert;\n    }\n    if (axis !== 'horizontal') {\n      translateY =\n        mapRange(0, 1, -distance.value, distance.value, progressY) * invert;\n      skewY = mapRange(0, 1, angle, -angle, progressY) * invert;\n    }\n    if (axis === 'both') {\n      // We want to do `skewX *= progressY < 0.5 ? 1 : -1`\n      // but normalize it by y progress (so it will be 0 when y is 0.5)\n      // and apply a circInOut easing on the progress so it will feel more natural\n      skewX *= mapRange(0, 1, 1, -1, circInOut(progressY));\n\n      // we want to do `skewY *= progressX < 0.5 ? 1 : -1`\n      // but normalize it by x progress (so it will be 0 when x is 0.5)\n      // and apply a circInOut easing on the progress so it will feel more natural\n      skewY *= mapRange(0, 1, 1, -1, circInOut(progressX));\n    }\n\n    const units = getCssUnits(distance.type);\n\n    const transform = `translateX(${translateX}${units}) translateY(${translateY}${units}) skew(${skewX}deg, ${skewY}deg) rotate(var(--comp-rotate-z, 0deg))`;\n\n    this.target.style.transform = transform;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    inverted = false,\n    distance = { value: 200, type: 'px' },\n    angle = 25,\n    axis = 'both',\n  } = options.namedEffect as SkewMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}`\n      : '',\n    invert,\n    distance,\n    angle: power ? paramsMap[power].angle : angle,\n    axis,\n  };\n\n  return (target: HTMLElement) =>\n    new SkewMouseAnimation(target, animationOptions);\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/library/mouse/SpinMouse.js

@@ -0,0 +1,38 @@
+import { getMouseTransitionEasing, getAngleInDeg } from '../../utils';
+import { CustomMouse } from './CustomMouse';
+class SpinMouseAnimation extends CustomMouse {
+  progress(_ref) {
+    let {
+      x: progressX,
+      y: progressY
+    } = _ref;
+    const {
+      invert,
+      axis
+    } = this.options;
+    const rotation = getAngleInDeg([0.5, 0.5], [axis === 'vertical' ? 0 : progressX, axis === 'horizontal' ? 0 : progressY], 90) * invert;
+    this.target.style.transform = `rotate(calc(${rotation}deg + var(--comp-rotate-z, 0deg)))`;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.transition = '';
+  }
+}
+export default function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing = 'linear'
+  } = options;
+  const {
+    inverted = false,
+    axis = 'both'
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(transitionEasing)}` : '',
+    invert,
+    axis
+  };
+  return target => new SpinMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=SpinMouse.js.map

package/dist/esm/library/mouse/SpinMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getMouseTransitionEasing","getAngleInDeg","CustomMouse","SpinMouseAnimation","progress","_ref","x","progressX","y","progressY","invert","axis","options","rotation","target","style","transform","cancel","transition","create","transitionDuration","transitionEasing","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/SpinMouse.ts"],"sourcesContent":["import {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  SpinMouse,\n  Progress,\n} from '../../types';\nimport { getMouseTransitionEasing, getAngleInDeg } from '../../utils';\nimport { CustomMouse } from './CustomMouse';\n\nclass SpinMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    const { invert, axis } = this.options;\n\n    const rotation =\n      getAngleInDeg(\n        [0.5, 0.5],\n        [\n          axis === 'vertical' ? 0 : progressX,\n          axis === 'horizontal' ? 0 : progressY,\n        ],\n        90,\n      ) * invert;\n\n    this.target.style.transform = `rotate(calc(${rotation}deg + var(--comp-rotate-z, 0deg)))`;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing = 'linear' } = options;\n  const { inverted = false, axis = 'both' } = options.namedEffect as SpinMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          transitionEasing,\n        )}`\n      : '',\n    invert,\n    axis,\n  };\n\n  return (target: HTMLElement) =>\n    new SpinMouseAnimation(target, animationOptions);\n}\n"],"mappings":"AAMA,SAASA,wBAAwB,EAAEC,aAAa,QAAQ,aAAa;AACrE,SAASC,WAAW,QAAQ,eAAe;AAE3C,MAAMC,kBAAkB,SAASD,WAAW,CAAC;EAC3CE,QAAQA,CAAAC,IAAA,EAA2C;IAAA,IAA1C;MAAEC,CAAC,EAAEC,SAAS;MAAEC,CAAC,EAAEC;IAAoB,CAAC,GAAAJ,IAAA;IAC/C,MAAM;MAAEK,MAAM;MAAEC;IAAK,CAAC,GAAG,IAAI,CAACC,OAAO;IAErC,MAAMC,QAAQ,GACZZ,aAAa,CACX,CAAC,GAAG,EAAE,GAAG,CAAC,EACV,CACEU,IAAI,KAAK,UAAU,GAAG,CAAC,GAAGJ,SAAS,EACnCI,IAAI,KAAK,YAAY,GAAG,CAAC,GAAGF,SAAS,CACtC,EACD,EACF,CAAC,GAAGC,MAAM;IAEZ,IAAI,CAACI,MAAM,CAACC,KAAK,CAACC,SAAS,GAAG,eAAeH,QAAQ,oCAAoC;EAC3F;EAEAI,MAAMA,CAAA,EAAG;IACP,IAAI,CAACH,MAAM,CAACC,KAAK,CAACC,SAAS,GAAG,EAAE;IAChC,IAAI,CAACF,MAAM,CAACC,KAAK,CAACG,UAAU,GAAG,EAAE;EACnC;AACF;AAEA,eAAe,SAASC,MAAMA,CAC5BP,OAAsD,EACtD;EACA,MAAM;IAAEQ,kBAAkB;IAAEC,gBAAgB,GAAG;EAAS,CAAC,GAAGT,OAAO;EACnE,MAAM;IAAEU,QAAQ,GAAG,KAAK;IAAEX,IAAI,GAAG;EAAO,CAAC,GAAGC,OAAO,CAACW,WAAwB;EAC5E,MAAMb,MAAM,GAAGY,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;EAChC,MAAME,gBAAgB,GAAG;IACvBN,UAAU,EAAEE,kBAAkB,GAC1B,aAAaA,kBAAkB,MAAMpB,wBAAwB,CAC3DqB,gBACF,CAAC,EAAE,GACH,EAAE;IACNX,MAAM;IACNC;EACF,CAAC;EAED,OAAQG,MAAmB,IACzB,IAAIX,kBAAkB,CAACW,MAAM,EAAEU,gBAAgB,CAAC;AACpD","ignoreList":[]}

package/dist/esm/library/mouse/SwivelMouse.js

@@ -0,0 +1,82 @@
+import { getMouseTransitionEasing, mapRange } from '../../utils';
+import { CustomMouse } from './CustomMouse';
+const paramsMap = {
+  soft: {
+    angle: 25,
+    perspective: 1000,
+    easing: 'easeOut'
+  },
+  medium: {
+    angle: 50,
+    perspective: 700,
+    easing: 'easeOut'
+  },
+  hard: {
+    angle: 85,
+    perspective: 300,
+    easing: 'easeOut'
+  }
+};
+const transformOrigins = {
+  top: [0, -50],
+  bottom: [0, 50],
+  right: [50, 0],
+  left: [-50, 0],
+  'center-horizontal': [0, 0],
+  'center-vertical': [0, 0]
+};
+class SwivelMouseAnimation extends CustomMouse {
+  progress(_ref) {
+    let {
+      x: progressX,
+      y: progressY
+    } = _ref;
+    let rotateAxis = 'rotateX';
+    let progress = progressY;
+    let invertVertical = -1;
+    const {
+      pivotAxis,
+      angle,
+      invert,
+      perspective
+    } = this.options;
+    if (pivotAxis === 'center-horizontal' || pivotAxis === 'right' || pivotAxis === 'left') {
+      rotateAxis = 'rotateY';
+      progress = progressX;
+      invertVertical = 1;
+    }
+
+    // if progress  === 0, rotate === angle, if progress === 0.5, rotate === 0, if progress === 1, rotate === angle
+    const rotate = mapRange(0, 1, -angle, angle, progress) * invertVertical * invert;
+    const [translateX, translateY] = transformOrigins[pivotAxis];
+    const transform = `perspective(${perspective}px) translateX(${translateX}%) translateY(${translateY}%) ${rotateAxis}(${rotate}deg) translateX(${-translateX}%) translateY(${-translateY}%) rotate(var(--comp-rotate-z, 0deg))`;
+    this.target.style.transform = transform;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.transition = '';
+  }
+}
+export default function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing
+  } = options;
+  const {
+    power,
+    inverted = false,
+    angle = 5,
+    perspective = 800,
+    pivotAxis = 'center-horizontal'
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(power ? paramsMap[power].easing : transitionEasing)}` : '',
+    invert,
+    angle: power ? paramsMap[power].angle : angle,
+    perspective: power ? paramsMap[power].perspective : perspective,
+    pivotAxis
+  };
+  return target => new SwivelMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=SwivelMouse.js.map

package/dist/esm/library/mouse/SwivelMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getMouseTransitionEasing","mapRange","CustomMouse","paramsMap","soft","angle","perspective","easing","medium","hard","transformOrigins","top","bottom","right","left","SwivelMouseAnimation","progress","_ref","x","progressX","y","progressY","rotateAxis","invertVertical","pivotAxis","invert","options","rotate","translateX","translateY","transform","target","style","cancel","transition","create","transitionDuration","transitionEasing","power","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/SwivelMouse.ts"],"sourcesContent":["import {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  SwivelMouse,\n  MousePivotAxis,\n  Progress,\n  EffectPower,\n  ScrubTransitionEasing,\n} from '../../types';\nimport { getMouseTransitionEasing, mapRange } from '../../utils';\nimport { CustomMouse } from './CustomMouse';\n\nconst paramsMap: Record<\n  EffectPower,\n  { angle: number; perspective: number; easing: ScrubTransitionEasing }\n> = {\n  soft: { angle: 25, perspective: 1000, easing: 'easeOut' },\n  medium: { angle: 50, perspective: 700, easing: 'easeOut' },\n  hard: { angle: 85, perspective: 300, easing: 'easeOut' },\n};\n\nconst transformOrigins: Record<MousePivotAxis, [number, number]> = {\n  top: [0, -50],\n  bottom: [0, 50],\n  right: [50, 0],\n  left: [-50, 0],\n  'center-horizontal': [0, 0],\n  'center-vertical': [0, 0],\n};\n\nclass SwivelMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    let rotateAxis = 'rotateX';\n    let progress = progressY;\n    let invertVertical = -1;\n\n    const { pivotAxis, angle, invert, perspective } = this.options;\n    if (\n      pivotAxis === 'center-horizontal' ||\n      pivotAxis === 'right' ||\n      pivotAxis === 'left'\n    ) {\n      rotateAxis = 'rotateY';\n      progress = progressX;\n      invertVertical = 1;\n    }\n\n    // if progress  === 0, rotate === angle, if progress === 0.5, rotate === 0, if progress === 1, rotate === angle\n    const rotate =\n      mapRange(0, 1, -angle, angle, progress) * invertVertical * invert;\n\n    const [translateX, translateY] =\n      transformOrigins[pivotAxis as MousePivotAxis];\n    const transform = `perspective(${perspective}px) translateX(${translateX}%) translateY(${translateY}%) ${rotateAxis}(${rotate}deg) translateX(${-translateX}%) translateY(${-translateY}%) rotate(var(--comp-rotate-z, 0deg))`;\n\n    this.target.style.transform = transform;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    inverted = false,\n    angle = 5,\n    perspective = 800,\n    pivotAxis = 'center-horizontal',\n  } = options.namedEffect as SwivelMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}`\n      : '',\n    invert,\n    angle: power ? paramsMap[power].angle : angle,\n    perspective: power ? paramsMap[power].perspective : perspective,\n    pivotAxis,\n  };\n\n  return (target: HTMLElement) =>\n    new SwivelMouseAnimation(target, animationOptions);\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/library/mouse/Tilt3DMouse.js

@@ -0,0 +1,62 @@
+import { getMouseTransitionEasing, mapRange } from '../../utils';
+import { CustomMouse } from './CustomMouse';
+const paramsMap = {
+  soft: {
+    angle: 25,
+    perspective: 1000,
+    easing: 'easeOut'
+  },
+  medium: {
+    angle: 50,
+    perspective: 500,
+    easing: 'easeOut'
+  },
+  hard: {
+    angle: 85,
+    perspective: 200,
+    easing: 'easeOut'
+  }
+};
+class Tilt3DMouseAnimation extends CustomMouse {
+  progress(_ref) {
+    let {
+      x: progressX,
+      y: progressY
+    } = _ref;
+    const {
+      invert,
+      angle,
+      perspective
+    } = this.options;
+
+    // if progressX === 0, rotateX === -angle, if progressX === 0.5, rotateX === 0, if progressX === 1, rotateX === angle
+    const rotateX = mapRange(0, 1, angle, -angle, progressY) * invert;
+    const rotateY = mapRange(0, 1, -angle, angle, progressX) * invert;
+    this.target.style.transform = `perspective(${perspective}px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) rotate(var(--comp-rotate-z, 0deg))`;
+  }
+  cancel() {
+    this.target.style.transform = '';
+    this.target.style.transition = '';
+  }
+}
+export default function create(options) {
+  const {
+    transitionDuration,
+    transitionEasing
+  } = options;
+  const {
+    power,
+    inverted = false,
+    angle = 5,
+    perspective = 800
+  } = options.namedEffect;
+  const invert = inverted ? -1 : 1;
+  const animationOptions = {
+    transition: transitionDuration ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(power ? paramsMap[power].easing : transitionEasing)}` : '',
+    invert,
+    angle: power ? paramsMap[power].angle : angle,
+    perspective: power ? paramsMap[power].perspective : perspective
+  };
+  return target => new Tilt3DMouseAnimation(target, animationOptions);
+}
+//# sourceMappingURL=Tilt3DMouse.js.map

package/dist/esm/library/mouse/Tilt3DMouse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getMouseTransitionEasing","mapRange","CustomMouse","paramsMap","soft","angle","perspective","easing","medium","hard","Tilt3DMouseAnimation","progress","_ref","x","progressX","y","progressY","invert","options","rotateX","rotateY","target","style","transform","cancel","transition","create","transitionDuration","transitionEasing","power","inverted","namedEffect","animationOptions"],"sources":["../../../../src/library/mouse/Tilt3DMouse.ts"],"sourcesContent":["import { getMouseTransitionEasing, mapRange } from '../../utils';\nimport { CustomMouse } from './CustomMouse';\nimport {\n  ScrubAnimationOptions,\n  AnimationExtraOptions,\n  Tilt3DMouse,\n  Progress,\n  EffectPower,\n  ScrubTransitionEasing,\n} from '../../types';\n\nconst paramsMap: Record<\n  EffectPower,\n  { angle: number; perspective: number; easing: ScrubTransitionEasing }\n> = {\n  soft: { angle: 25, perspective: 1000, easing: 'easeOut' },\n  medium: { angle: 50, perspective: 500, easing: 'easeOut' },\n  hard: { angle: 85, perspective: 200, easing: 'easeOut' },\n};\n\nclass Tilt3DMouseAnimation extends CustomMouse {\n  progress({ x: progressX, y: progressY }: Progress) {\n    const { invert, angle, perspective } = this.options;\n\n    // if progressX === 0, rotateX === -angle, if progressX === 0.5, rotateX === 0, if progressX === 1, rotateX === angle\n    const rotateX = mapRange(0, 1, angle, -angle, progressY) * invert;\n    const rotateY = mapRange(0, 1, -angle, angle, progressX) * invert;\n\n    this.target.style.transform = `perspective(${perspective}px) rotateX(${rotateX}deg) rotateY(${rotateY}deg) rotate(var(--comp-rotate-z, 0deg))`;\n  }\n\n  cancel() {\n    this.target.style.transform = '';\n    this.target.style.transition = '';\n  }\n}\n\nexport default function create(\n  options: ScrubAnimationOptions & AnimationExtraOptions,\n) {\n  const { transitionDuration, transitionEasing } = options;\n  const {\n    power,\n    inverted = false,\n    angle = 5,\n    perspective = 800,\n  } = options.namedEffect as Tilt3DMouse;\n  const invert = inverted ? -1 : 1;\n  const animationOptions = {\n    transition: transitionDuration\n      ? `transform ${transitionDuration}ms ${getMouseTransitionEasing(\n          power ? paramsMap[power].easing : transitionEasing,\n        )}`\n      : '',\n    invert,\n    angle: power ? paramsMap[power].angle : angle,\n    perspective: power ? paramsMap[power].perspective : perspective,\n  };\n\n  return (target: HTMLElement) =>\n    new Tilt3DMouseAnimation(target, animationOptions);\n}\n"],"mappings":"AAAA,SAASA,wBAAwB,EAAEC,QAAQ,QAAQ,aAAa;AAChE,SAASC,WAAW,QAAQ,eAAe;AAU3C,MAAMC,SAGL,GAAG;EACFC,IAAI,EAAE;IAAEC,KAAK,EAAE,EAAE;IAAEC,WAAW,EAAE,IAAI;IAAEC,MAAM,EAAE;EAAU,CAAC;EACzDC,MAAM,EAAE;IAAEH,KAAK,EAAE,EAAE;IAAEC,WAAW,EAAE,GAAG;IAAEC,MAAM,EAAE;EAAU,CAAC;EAC1DE,IAAI,EAAE;IAAEJ,KAAK,EAAE,EAAE;IAAEC,WAAW,EAAE,GAAG;IAAEC,MAAM,EAAE;EAAU;AACzD,CAAC;AAED,MAAMG,oBAAoB,SAASR,WAAW,CAAC;EAC7CS,QAAQA,CAAAC,IAAA,EAA2C;IAAA,IAA1C;MAAEC,CAAC,EAAEC,SAAS;MAAEC,CAAC,EAAEC;IAAoB,CAAC,GAAAJ,IAAA;IAC/C,MAAM;MAAEK,MAAM;MAAEZ,KAAK;MAAEC;IAAY,CAAC,GAAG,IAAI,CAACY,OAAO;;IAEnD;IACA,MAAMC,OAAO,GAAGlB,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAEI,KAAK,EAAE,CAACA,KAAK,EAAEW,SAAS,CAAC,GAAGC,MAAM;IACjE,MAAMG,OAAO,GAAGnB,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAACI,KAAK,EAAEA,KAAK,EAAES,SAAS,CAAC,GAAGG,MAAM;IAEjE,IAAI,CAACI,MAAM,CAACC,KAAK,CAACC,SAAS,GAAG,eAAejB,WAAW,eAAea,OAAO,gBAAgBC,OAAO,yCAAyC;EAChJ;EAEAI,MAAMA,CAAA,EAAG;IACP,IAAI,CAACH,MAAM,CAACC,KAAK,CAACC,SAAS,GAAG,EAAE;IAChC,IAAI,CAACF,MAAM,CAACC,KAAK,CAACG,UAAU,GAAG,EAAE;EACnC;AACF;AAEA,eAAe,SAASC,MAAMA,CAC5BR,OAAsD,EACtD;EACA,MAAM;IAAES,kBAAkB;IAAEC;EAAiB,CAAC,GAAGV,OAAO;EACxD,MAAM;IACJW,KAAK;IACLC,QAAQ,GAAG,KAAK;IAChBzB,KAAK,GAAG,CAAC;IACTC,WAAW,GAAG;EAChB,CAAC,GAAGY,OAAO,CAACa,WAA0B;EACtC,MAAMd,MAAM,GAAGa,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC;EAChC,MAAME,gBAAgB,GAAG;IACvBP,UAAU,EAAEE,kBAAkB,GAC1B,aAAaA,kBAAkB,MAAM3B,wBAAwB,CAC3D6B,KAAK,GAAG1B,SAAS,CAAC0B,KAAK,CAAC,CAACtB,MAAM,GAAGqB,gBACpC,CAAC,EAAE,GACH,EAAE;IACNX,MAAM;IACNZ,KAAK,EAAEwB,KAAK,GAAG1B,SAAS,CAAC0B,KAAK,CAAC,CAACxB,KAAK,GAAGA,KAAK;IAC7CC,WAAW,EAAEuB,KAAK,GAAG1B,SAAS,CAAC0B,KAAK,CAAC,CAACvB,WAAW,GAAGA;EACtD,CAAC;EAED,OAAQe,MAAmB,IACzB,IAAIX,oBAAoB,CAACW,MAAM,EAAEW,gBAAgB,CAAC;AACtD","ignoreList":[]}