@wix/motion 1.659.0 → 2.0.0-rc.2

package/dist/esm/utils.js

@@ -1,332 +0,0 @@
-import { cssEasings, jsEasings } from './easings';
-/**
- * Map a value from one range 'a' to different range 'b'
- *
- * @param sourceMin - The minimum value of the source range
- * @param sourceMax - The maximum value of the source range
- * @param targetMin - The minimum value of the target range
- * @param targetMax - The maximum value of the target range
- * @param num - The number to map
- * @returns The mapped value
- */
-export function mapRange(sourceMin, sourceMax, targetMin, targetMax, num) {
-  return (num - sourceMin) * (targetMax - targetMin) / (sourceMax - sourceMin) + targetMin;
-}
-
-/**
- * Get the distance between 2 points
- *
- * @param p1 - The first point [x1, y1]
- * @param p2 - The second point [x2, y2]
- * @returns The distance between the two points
- */
-export function distance2d(_ref, _ref2) {
-  let [x1, y1] = _ref;
-  let [x2, y2] = _ref2;
-  return Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2);
-}
-
-/**
- * Get the angle between 2 points in degrees clamped between 0 and 360
- * Pass the third argument "offset" to rotate the angle source,
- * for example use 90 to move angle 0 to the top
- *
- * @param p1 - The first point [x1, y1]
- * @param p2 - The second point [x2, y2]
- * @param offset - The angle offset (default: 0)
- * @returns The angle between the two points in degrees
- */
-export function getAngleInDeg(p1, p2, offset) {
-  if (p1 === void 0) {
-    p1 = [0, 0];
-  }
-  if (p2 === void 0) {
-    p2 = [0, 0];
-  }
-  if (offset === void 0) {
-    offset = 0;
-  }
-  const angle = Math.atan2(p2[1] - p1[1], p2[0] - p1[0]) * 180 / Math.PI;
-  return (360 + offset + angle) % 360;
-}
-export const INITIAL_FRAME_OFFSET = 1e-6;
-const CLIP_POLYGON_TEMPLATES = {
-  initial: _ref3 => {
-    let {
-      top,
-      bottom,
-      left,
-      right
-    } = _ref3;
-    return `${left}% ${top}%, ${right}% ${top}%, ${right}% ${bottom}%, ${left}% ${bottom}%`;
-  },
-  top: _ref4 => {
-    let {
-      top,
-      left,
-      right,
-      minimum
-    } = _ref4;
-    return `${left}% ${top}%, ${right}% ${top}%, ${right}% ${top + minimum}%, ${left}% ${top + minimum}%`;
-  },
-  right: _ref5 => {
-    let {
-      top,
-      bottom,
-      right,
-      minimum
-    } = _ref5;
-    return `${right - minimum}% ${top}%, ${right}% ${top}%, ${right}% ${bottom}%, ${right - minimum}% ${bottom}%`;
-  },
-  center: _ref6 => {
-    let {
-      centerX,
-      centerY,
-      minimum
-    } = _ref6;
-    return `${centerX - minimum / 2}% ${centerY - minimum / 2}%, ${centerX + minimum / 2}% ${centerY - minimum / 2}%, ${centerX + minimum / 2}% ${centerY + minimum / 2}%, ${centerX - minimum / 2}% ${centerY + minimum / 2}%`;
-  },
-  bottom: _ref7 => {
-    let {
-      bottom,
-      left,
-      right,
-      minimum
-    } = _ref7;
-    return `${left}% ${bottom - minimum}%, ${right}% ${bottom - minimum}%, ${right}% ${bottom}%, ${left}% ${bottom}%`;
-  },
-  left: _ref8 => {
-    let {
-      top,
-      bottom,
-      left,
-      minimum
-    } = _ref8;
-    return `${left}% ${top}%, ${left + minimum}% ${top}%, ${left + minimum}% ${bottom}%, ${left}% ${bottom}%`;
-  },
-  vertical: _ref9 => {
-    let {
-      top,
-      bottom,
-      left,
-      right,
-      minimum
-    } = _ref9;
-    return `${left}% ${top + minimum / 2}%, ${right}% ${top + minimum / 2}%, ${right}% ${bottom - minimum / 2}%, ${left}% ${bottom - minimum / 2}%`;
-  },
-  horizontal: _ref10 => {
-    let {
-      top,
-      bottom,
-      left,
-      right,
-      minimum
-    } = _ref10;
-    return `${left + minimum / 2}% ${top}%, ${right - minimum / 2}% ${top}%, ${right - minimum / 2}% ${bottom}%, ${left + minimum / 2}% ${bottom}%`;
-  }
-};
-export function getClipPolygonParams(_ref11) {
-  let {
-    direction,
-    scaleX = 1,
-    scaleY = 1,
-    minimum = 0
-  } = _ref11;
-  const top = (1 - scaleY) / 2 * 100;
-  const left = (1 - scaleX) / 2 * 100;
-  const right = 100 + left - (1 - scaleX) * 100;
-  const bottom = 100 + top - (1 - scaleY) * 100;
-  const centerX = (right + left) / 2;
-  const centerY = (bottom + top) / 2;
-  return `polygon(${CLIP_POLYGON_TEMPLATES[direction]({
-    top,
-    bottom,
-    left,
-    right,
-    centerX,
-    centerY,
-    minimum
-  })})`;
-}
-
-/**
- * Adjust direction by angle from predefined list
- */
-export function getAdjustedDirection(availableDirections, direction, angleInDeg) {
-  const index = availableDirections.indexOf(direction);
-  const length = availableDirections.length;
-  const shiftBy = Math.round((angleInDeg || 0) / 360 * length);
-  const newIndex = (index + (length - 1) * shiftBy) % length; // eslint-disable-line no-mixed-operators
-  return availableDirections[newIndex];
-}
-export function transformPolarToXY(angle, distance) {
-  const radians = angle * Math.PI / 180;
-  const x = Math.cos(radians) * distance;
-  const y = Math.sin(radians) * distance;
-  return [x, y];
-}
-export function getCssUnits(type) {
-  return type === 'percentage' ? '%' : type || 'px';
-}
-export function getEasing(easing) {
-  return easing ? cssEasings[easing] || easing : cssEasings.linear;
-}
-export function getJsEasing(easing) {
-  return easing ? jsEasings[easing] : undefined;
-}
-export function getEasingFamily(easing) {
-  if (!cssEasings[easing]) {
-    return {
-      in: easing,
-      inOut: easing,
-      out: easing
-    };
-  }
-  const ease = easing.replace(/In|Out/g, '');
-  if (ease === 'linear') {
-    return {
-      in: `linear`,
-      inOut: `linear`,
-      out: `linear`
-    };
-  }
-  return {
-    in: `${ease}In`,
-    inOut: `${ease}InOut`,
-    out: `${ease}Out`
-  };
-}
-const MOUSE_TRANSITION_EASING_MAP = {
-  linear: 'linear',
-  easeOut: 'ease-out',
-  hardBackOut: 'cubic-bezier(0.58, 2.5, 0, 0.95)',
-  elastic: 'linear( 0, 0.2178 2.1%, 1.1144 8.49%, 1.2959 10.7%, 1.3463 11.81%, 1.3705 12.94%, 1.3726, 1.3643 14.48%, 1.3151 16.2%, 1.0317 21.81%, 0.941 24.01%, 0.8912 25.91%, 0.8694 27.84%, 0.8698 29.21%, 0.8824 30.71%, 1.0122 38.33%, 1.0357, 1.046 42.71%, 1.0416 45.7%, 0.9961 53.26%, 0.9839 57.54%, 0.9853 60.71%, 1.0012 68.14%, 1.0056 72.24%, 0.9981 86.66%, 1 )',
-  bounce: 'linear( 0, 0.0039, 0.0157, 0.0352, 0.0625 9.09%, 0.1407, 0.25, 0.3908, 0.5625, 0.7654, 1, 0.8907, 0.8125 45.45%, 0.7852, 0.7657, 0.7539, 0.75, 0.7539, 0.7657, 0.7852, 0.8125 63.64%, 0.8905, 1 72.73%, 0.9727, 0.9532, 0.9414, 0.9375, 0.9414, 0.9531, 0.9726, 1, 0.9883, 0.9844, 0.9883, 1 )'
-};
-export function getMouseTransitionEasing(value) {
-  return value && MOUSE_TRANSITION_EASING_MAP[value] || 'linear';
-}
-export function getOutOfScreenDistance(angle) {
-  const angleInRad = angle * Math.PI / 180;
-  const angleCos = Math.round(Math.cos(angleInRad) * 10) / 10;
-  const angleSin = Math.round(Math.sin(angleInRad) * 10) / 10;
-
-  // Calculate x and y direction based on angle
-  const xDirection = Math.sign(angleCos);
-  const yDirection = Math.sign(angleSin);
-  const left = `var(--motion-left, 0px)`;
-  const top = `var(--motion-top, 0px)`;
-
-  // Calculate x and y distances between component and stage
-  const xDistance = xDirection ? xDirection === -1 ? `(-1 * ${left} - 100%)` : `(100vw - ${left})` : 0;
-  const yDistance = yDirection ? yDirection === -1 ? `(-1 * ${top} - 100%)` : `(100vh - ${top})` : 0;
-
-  // Calculate hypotenuse
-  let hypotenuse;
-  const hypotX = `calc(${xDistance} / ${angleCos})`;
-  const hypotY = `calc(${yDistance} / ${angleSin})`;
-  if (!angleCos) {
-    hypotenuse = hypotY;
-  } else if (!angleSin) {
-    hypotenuse = hypotX;
-  } else {
-    hypotenuse = `min(${hypotY}, ${hypotX})`;
-  }
-  return {
-    // distance: Math.abs(hypotenuse),
-    x: `calc(${hypotenuse} * ${angleCos})`,
-    y: `calc(${hypotenuse} * ${angleSin})`
-  };
-}
-export function getElementOffset(element, parent) {
-  let left = element.offsetLeft;
-  let top = element.offsetTop;
-  let offsetParent = element.offsetParent;
-  while (offsetParent) {
-    if (parent && offsetParent === parent) {
-      break;
-    }
-    left += offsetParent.offsetLeft;
-    top += offsetParent.offsetTop;
-    offsetParent = offsetParent.offsetParent;
-  }
-  return {
-    left,
-    top
-  };
-}
-const generateShuttersClipPath = (direction, shutterCount, staggered) => {
-  const isTopOrLeft = direction === 'top' || direction === 'left';
-  const iterStart = isTopOrLeft ? shutterCount : 0;
-  const iterEnd = isTopOrLeft ? 0 : shutterCount;
-  const inc = isTopOrLeft ? -1 : 1;
-  const isVerticalPath = direction === 'top' || direction === 'bottom';
-  const clipPathStart = [];
-  const clipPathEnd = [];
-  for (let i = iterStart; i !== iterEnd; i += inc) {
-    const shutterEndPosInPercentage = 100 * ((i + inc) / shutterCount);
-    const clipStart = 100 * (i / shutterCount) | 0;
-    let clipEnd;
-    if (staggered) {
-      const staggerFactor = isTopOrLeft ? 1 + (shutterCount - i) / shutterCount : 1 + i / shutterCount;
-      // staggerFactor changes the speed in which the current shutter completes its animation.
-      // case = 1: shutter closes at normal rate (as if there is no stagger at all)
-      // case > 1: shutter closes faster (the bigger it is, the faster it closes)
-
-      clipEnd = isTopOrLeft ? 100 - (100 - shutterEndPosInPercentage) * staggerFactor : shutterEndPosInPercentage * staggerFactor;
-    } else {
-      clipEnd = shutterEndPosInPercentage;
-    }
-    clipEnd |= 0;
-    if (isVerticalPath) {
-      clipPathStart.push(`0% ${clipStart}%, 100% ${clipStart}%, 100% ${clipStart}%, 0% ${clipStart}%`);
-      clipPathEnd.push(`0% ${clipStart}%, 100% ${clipStart}%, 100% ${clipEnd}%, 0% ${clipEnd}%`);
-    } else {
-      clipPathStart.push(`${clipStart}% 0%, ${clipStart}% 100%, ${clipStart}% 100%, ${clipStart}% 0%`);
-      clipPathEnd.push(`${clipStart}% 0%, ${clipStart}% 100%, ${clipEnd}% 100%, ${clipEnd}% 0%`);
-    }
-  }
-  return {
-    start: clipPathStart,
-    end: clipPathEnd
-  };
-};
-export function getShuttersClipPaths(direction, shutterCount, staggered, reverse) {
-  const {
-    start,
-    end
-  } = generateShuttersClipPath(direction, shutterCount, staggered);
-  if (reverse) {
-    start.reverse();
-    end.reverse();
-  }
-  return {
-    clipStart: `polygon(${start.join(', ')})`,
-    clipEnd: `polygon(${end.join(', ')})`
-  };
-}
-export function roundNumber(num, precision) {
-  if (precision === void 0) {
-    precision = 2;
-  }
-  return parseFloat(num.toFixed(precision));
-}
-export function toKeyframeValue(custom, key, useValue, fallback) {
-  if (useValue === void 0) {
-    useValue = false;
-  }
-  if (fallback === void 0) {
-    fallback = '';
-  }
-  return useValue ? custom[key] : `var(${key}${fallback ? `,${fallback}` : ''})`;
-}
-export function getTimingFactor(duration, delay, asString) {
-  if (asString === void 0) {
-    asString = false;
-  }
-  const duration_ = duration || 1;
-  const delay_ = delay || 0;
-  const timingFactor = roundNumber(duration_ / (duration_ + delay_));
-  return asString ? timingFactor.toString().replace(/\./g, '') : timingFactor;
-}
-//# sourceMappingURL=utils.js.map

package/dist/esm/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["cssEasings","jsEasings","mapRange","sourceMin","sourceMax","targetMin","targetMax","num","distance2d","_ref","_ref2","x1","y1","x2","y2","Math","sqrt","getAngleInDeg","p1","p2","offset","angle","atan2","PI","INITIAL_FRAME_OFFSET","CLIP_POLYGON_TEMPLATES","initial","_ref3","top","bottom","left","right","_ref4","minimum","_ref5","center","_ref6","centerX","centerY","_ref7","_ref8","vertical","_ref9","horizontal","_ref10","getClipPolygonParams","_ref11","direction","scaleX","scaleY","getAdjustedDirection","availableDirections","angleInDeg","index","indexOf","length","shiftBy","round","newIndex","transformPolarToXY","distance","radians","x","cos","y","sin","getCssUnits","type","getEasing","easing","linear","getJsEasing","undefined","getEasingFamily","in","inOut","out","ease","replace","MOUSE_TRANSITION_EASING_MAP","easeOut","hardBackOut","elastic","bounce","getMouseTransitionEasing","value","getOutOfScreenDistance","angleInRad","angleCos","angleSin","xDirection","sign","yDirection","xDistance","yDistance","hypotenuse","hypotX","hypotY","getElementOffset","element","parent","offsetLeft","offsetTop","offsetParent","generateShuttersClipPath","shutterCount","staggered","isTopOrLeft","iterStart","iterEnd","inc","isVerticalPath","clipPathStart","clipPathEnd","i","shutterEndPosInPercentage","clipStart","clipEnd","staggerFactor","push","start","end","getShuttersClipPaths","reverse","join","roundNumber","precision","parseFloat","toFixed","toKeyframeValue","custom","key","useValue","fallback","getTimingFactor","duration","delay","asString","duration_","delay_","timingFactor","toString"],"sources":["../../src/utils.ts"],"sourcesContent":["import { cssEasings, jsEasings } from './easings';\nimport type {\n  ScrubTransitionEasing,\n  EffectFourDirections,\n  Point,\n} from './types';\n\n/**\n * Map a value from one range 'a' to different range 'b'\n *\n * @param sourceMin - The minimum value of the source range\n * @param sourceMax - The maximum value of the source range\n * @param targetMin - The minimum value of the target range\n * @param targetMax - The maximum value of the target range\n * @param num - The number to map\n * @returns The mapped value\n */\nexport function mapRange(\n  sourceMin: number,\n  sourceMax: number,\n  targetMin: number,\n  targetMax: number,\n  num: number,\n): number {\n  return (\n    ((num - sourceMin) * (targetMax - targetMin)) / (sourceMax - sourceMin) +\n    targetMin\n  );\n}\n\n/**\n * Get the distance between 2 points\n *\n * @param p1 - The first point [x1, y1]\n * @param p2 - The second point [x2, y2]\n * @returns The distance between the two points\n */\nexport function distance2d([x1, y1]: Point, [x2, y2]: Point): number {\n  return Math.sqrt((x2 - x1) ** 2 + (y2 - y1) ** 2);\n}\n\n/**\n * Get the angle between 2 points in degrees clamped between 0 and 360\n * Pass the third argument \"offset\" to rotate the angle source,\n * for example use 90 to move angle 0 to the top\n *\n * @param p1 - The first point [x1, y1]\n * @param p2 - The second point [x2, y2]\n * @param offset - The angle offset (default: 0)\n * @returns The angle between the two points in degrees\n */\nexport function getAngleInDeg(\n  p1: Point = [0, 0],\n  p2: Point = [0, 0],\n  offset: number = 0,\n): number {\n  const angle = (Math.atan2(p2[1] - p1[1], p2[0] - p1[0]) * 180) / Math.PI;\n  return (360 + offset + angle) % 360;\n}\n\nexport const INITIAL_FRAME_OFFSET = 1e-6;\n\nexport type Direction =\n  | 'initial'\n  | 'top'\n  | 'right'\n  | 'center'\n  | 'bottom'\n  | 'left'\n  | 'vertical'\n  | 'horizontal';\n\ntype ClipPolygonTemplateParams = {\n  top: number;\n  bottom: number;\n  left: number;\n  right: number;\n  centerX: number;\n  centerY: number;\n  minimum: number;\n};\n\nconst CLIP_POLYGON_TEMPLATES: Record<\n  Direction,\n  (params: ClipPolygonTemplateParams) => string\n> = {\n  initial: ({ top, bottom, left, right }) =>\n    `${left}% ${top}%, ${right}% ${top}%, ${right}% ${bottom}%, ${left}% ${bottom}%`,\n  top: ({ top, left, right, minimum }) =>\n    `${left}% ${top}%, ${right}% ${top}%, ${right}% ${\n      top + minimum\n    }%, ${left}% ${top + minimum}%`,\n  right: ({ top, bottom, right, minimum }) =>\n    `${right - minimum}% ${top}%, ${right}% ${top}%, ${right}% ${bottom}%, ${\n      right - minimum\n    }% ${bottom}%`,\n  center: ({ centerX, centerY, minimum }) =>\n    `${centerX - minimum / 2}% ${centerY - minimum / 2}%, ${\n      centerX + minimum / 2\n    }% ${centerY - minimum / 2}%, ${centerX + minimum / 2}% ${\n      centerY + minimum / 2\n    }%, ${centerX - minimum / 2}% ${centerY + minimum / 2}%`,\n  bottom: ({ bottom, left, right, minimum }) =>\n    `${left}% ${bottom - minimum}%, ${right}% ${\n      bottom - minimum\n    }%, ${right}% ${bottom}%, ${left}% ${bottom}%`,\n  left: ({ top, bottom, left, minimum }) =>\n    `${left}% ${top}%, ${left + minimum}% ${top}%, ${\n      left + minimum\n    }% ${bottom}%, ${left}% ${bottom}%`,\n  vertical: ({ top, bottom, left, right, minimum }) =>\n    `${left}% ${top + minimum / 2}%, ${right}% ${\n      top + minimum / 2\n    }%, ${right}% ${bottom - minimum / 2}%, ${left}% ${bottom - minimum / 2}%`,\n  horizontal: ({ top, bottom, left, right, minimum }) =>\n    `${left + minimum / 2}% ${top}%, ${right - minimum / 2}% ${top}%, ${\n      right - minimum / 2\n    }% ${bottom}%, ${left + minimum / 2}% ${bottom}%`,\n};\n\nexport function getClipPolygonParams({\n  direction,\n  scaleX = 1,\n  scaleY = 1,\n  minimum = 0,\n}: {\n  direction: Direction;\n  scaleX?: number;\n  scaleY?: number;\n  minimum?: number;\n}) {\n  const top = ((1 - scaleY) / 2) * 100;\n  const left = ((1 - scaleX) / 2) * 100;\n  const right = 100 + left - (1 - scaleX) * 100;\n  const bottom = 100 + top - (1 - scaleY) * 100;\n  const centerX = (right + left) / 2;\n  const centerY = (bottom + top) / 2;\n\n  return `polygon(${CLIP_POLYGON_TEMPLATES[direction]({\n    top,\n    bottom,\n    left,\n    right,\n    centerX,\n    centerY,\n    minimum,\n  })})`;\n}\n\n/**\n * Adjust direction by angle from predefined list\n */\nexport function getAdjustedDirection(\n  availableDirections: string[],\n  direction: string,\n  angleInDeg: number,\n) {\n  const index = availableDirections.indexOf(direction);\n  const length = availableDirections.length;\n  const shiftBy = Math.round(((angleInDeg || 0) / 360) * length);\n  const newIndex = (index + (length - 1) * shiftBy) % length; // eslint-disable-line no-mixed-operators\n  return availableDirections[newIndex];\n}\n\nexport function transformPolarToXY(angle: number, distance: number) {\n  const radians = (angle * Math.PI) / 180;\n  const x = Math.cos(radians) * distance;\n  const y = Math.sin(radians) * distance;\n  return [x, y];\n}\n\nexport function getCssUnits(type: 'percentage' | string) {\n  return type === 'percentage' ? '%' : type || 'px';\n}\n\nexport function getEasing(easing?: keyof typeof cssEasings | string): string {\n  return easing\n    ? cssEasings[easing as keyof typeof cssEasings] || easing\n    : cssEasings.linear;\n}\n\nexport function getJsEasing(\n  easing?: keyof typeof jsEasings | string,\n): ((t: number) => number) | undefined {\n  return easing ? jsEasings[easing as keyof typeof jsEasings] : undefined;\n}\n\nexport function getEasingFamily(easing: string) {\n  if (!cssEasings[easing as keyof typeof cssEasings]) {\n    return {\n      in: easing,\n      inOut: easing,\n      out: easing,\n    };\n  }\n\n  const ease = easing.replace(/In|Out/g, '');\n  if (ease === 'linear') {\n    return {\n      in: `linear`,\n      inOut: `linear`,\n      out: `linear`,\n    };\n  }\n\n  return {\n    in: `${ease}In`,\n    inOut: `${ease}InOut`,\n    out: `${ease}Out`,\n  };\n}\n\nconst MOUSE_TRANSITION_EASING_MAP: Record<ScrubTransitionEasing, string> = {\n  linear: 'linear',\n  easeOut: 'ease-out',\n  hardBackOut: 'cubic-bezier(0.58, 2.5, 0, 0.95)',\n  elastic:\n    'linear( 0, 0.2178 2.1%, 1.1144 8.49%, 1.2959 10.7%, 1.3463 11.81%, 1.3705 12.94%, 1.3726, 1.3643 14.48%, 1.3151 16.2%, 1.0317 21.81%, 0.941 24.01%, 0.8912 25.91%, 0.8694 27.84%, 0.8698 29.21%, 0.8824 30.71%, 1.0122 38.33%, 1.0357, 1.046 42.71%, 1.0416 45.7%, 0.9961 53.26%, 0.9839 57.54%, 0.9853 60.71%, 1.0012 68.14%, 1.0056 72.24%, 0.9981 86.66%, 1 )',\n  bounce:\n    'linear( 0, 0.0039, 0.0157, 0.0352, 0.0625 9.09%, 0.1407, 0.25, 0.3908, 0.5625, 0.7654, 1, 0.8907, 0.8125 45.45%, 0.7852, 0.7657, 0.7539, 0.75, 0.7539, 0.7657, 0.7852, 0.8125 63.64%, 0.8905, 1 72.73%, 0.9727, 0.9532, 0.9414, 0.9375, 0.9414, 0.9531, 0.9726, 1, 0.9883, 0.9844, 0.9883, 1 )',\n};\n\nexport function getMouseTransitionEasing(value?: ScrubTransitionEasing) {\n  return (value && MOUSE_TRANSITION_EASING_MAP[value]) || 'linear';\n}\n\nexport function getOutOfScreenDistance(angle: number) {\n  const angleInRad = (angle * Math.PI) / 180;\n  const angleCos = Math.round(Math.cos(angleInRad) * 10) / 10;\n  const angleSin = Math.round(Math.sin(angleInRad) * 10) / 10;\n\n  // Calculate x and y direction based on angle\n  const xDirection = Math.sign(angleCos);\n  const yDirection = Math.sign(angleSin);\n  const left = `var(--motion-left, 0px)`;\n  const top = `var(--motion-top, 0px)`;\n\n  // Calculate x and y distances between component and stage\n  const xDistance = xDirection\n    ? xDirection === -1\n      ? `(-1 * ${left} - 100%)`\n      : `(100vw - ${left})`\n    : 0;\n  const yDistance = yDirection\n    ? yDirection === -1\n      ? `(-1 * ${top} - 100%)`\n      : `(100vh - ${top})`\n    : 0;\n\n  // Calculate hypotenuse\n  let hypotenuse;\n  const hypotX = `calc(${xDistance} / ${angleCos})`;\n  const hypotY = `calc(${yDistance} / ${angleSin})`;\n\n  if (!angleCos) {\n    hypotenuse = hypotY;\n  } else if (!angleSin) {\n    hypotenuse = hypotX;\n  } else {\n    hypotenuse = `min(${hypotY}, ${hypotX})`;\n  }\n\n  return {\n    // distance: Math.abs(hypotenuse),\n    x: `calc(${hypotenuse} * ${angleCos})`,\n    y: `calc(${hypotenuse} * ${angleSin})`,\n  };\n}\n\nexport function getElementOffset(element: HTMLElement, parent?: HTMLElement) {\n  let left = element.offsetLeft;\n  let top = element.offsetTop;\n  let offsetParent = element.offsetParent as HTMLElement;\n\n  while (offsetParent) {\n    if (parent && offsetParent === parent) {\n      break;\n    }\n\n    left += offsetParent.offsetLeft;\n    top += offsetParent.offsetTop;\n    offsetParent = offsetParent.offsetParent as HTMLElement;\n  }\n\n  return { left, top };\n}\n\nconst generateShuttersClipPath = (\n  direction: EffectFourDirections,\n  shutterCount: number,\n  staggered: boolean,\n) => {\n  const isTopOrLeft = direction === 'top' || direction === 'left';\n  const iterStart = isTopOrLeft ? shutterCount : 0;\n  const iterEnd = isTopOrLeft ? 0 : shutterCount;\n  const inc = isTopOrLeft ? -1 : 1;\n\n  const isVerticalPath = direction === 'top' || direction === 'bottom';\n\n  const clipPathStart: string[] = [];\n  const clipPathEnd: string[] = [];\n\n  for (let i = iterStart; i !== iterEnd; i += inc) {\n    const shutterEndPosInPercentage = 100 * ((i + inc) / shutterCount);\n    const clipStart = (100 * (i / shutterCount)) | 0;\n    let clipEnd;\n\n    if (staggered) {\n      const staggerFactor = isTopOrLeft\n        ? 1 + (shutterCount - i) / shutterCount\n        : 1 + i / shutterCount;\n      // staggerFactor changes the speed in which the current shutter completes its animation.\n      // case = 1: shutter closes at normal rate (as if there is no stagger at all)\n      // case > 1: shutter closes faster (the bigger it is, the faster it closes)\n\n      clipEnd = isTopOrLeft\n        ? 100 - (100 - shutterEndPosInPercentage) * staggerFactor\n        : shutterEndPosInPercentage * staggerFactor;\n    } else {\n      clipEnd = shutterEndPosInPercentage;\n    }\n\n    clipEnd |= 0;\n\n    if (isVerticalPath) {\n      clipPathStart.push(\n        `0% ${clipStart}%, 100% ${clipStart}%, 100% ${clipStart}%, 0% ${clipStart}%`,\n      );\n      clipPathEnd.push(\n        `0% ${clipStart}%, 100% ${clipStart}%, 100% ${clipEnd}%, 0% ${clipEnd}%`,\n      );\n    } else {\n      clipPathStart.push(\n        `${clipStart}% 0%, ${clipStart}% 100%, ${clipStart}% 100%, ${clipStart}% 0%`,\n      );\n      clipPathEnd.push(\n        `${clipStart}% 0%, ${clipStart}% 100%, ${clipEnd}% 100%, ${clipEnd}% 0%`,\n      );\n    }\n  }\n\n  return { start: clipPathStart, end: clipPathEnd };\n};\n\nexport function getShuttersClipPaths(\n  direction: EffectFourDirections,\n  shutterCount: number,\n  staggered: boolean,\n  reverse?: boolean,\n) {\n  const { start, end } = generateShuttersClipPath(\n    direction,\n    shutterCount,\n    staggered,\n  );\n\n  if (reverse) {\n    start.reverse();\n    end.reverse();\n  }\n\n  return {\n    clipStart: `polygon(${start.join(', ')})`,\n    clipEnd: `polygon(${end.join(', ')})`,\n  };\n}\n\nexport function roundNumber(num: number, precision = 2) {\n  return parseFloat(num.toFixed(precision));\n}\n\nexport function toKeyframeValue(\n  custom: Record<string, string | number>,\n  key: string,\n  useValue = false,\n  fallback = '',\n) {\n  return useValue\n    ? custom[key]\n    : `var(${key}${fallback ? `,${fallback}` : ''})`;\n}\n\nexport function getTimingFactor(\n  duration: number,\n  delay: number,\n  asString = false,\n): number | string {\n  const duration_ = duration || 1;\n  const delay_ = delay || 0;\n  const timingFactor = roundNumber(duration_ / (duration_ + delay_));\n  return asString ? timingFactor.toString().replace(/\\./g, '') : timingFactor;\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/types/library/ongoing/Blink.d.ts

@@ -1,19 +0,0 @@
-import type { TimeAnimationOptions, DomApi } from '../../types';
-export declare function web(options: TimeAnimationOptions, _?: DomApi): {
-    name: string;
-    easing: string;
-    delay: number;
-    duration: number;
-    keyframes: Keyframe[];
-    id?: string | undefined;
-    keyframeEffect?: import("../../types").MotionKeyframeEffect | undefined;
-    namedEffect?: import("../../types").NamedEffect | undefined;
-    customEffect?: import("../../types").CustomEffect | undefined;
-    endDelay?: number | undefined;
-    iterations?: number | undefined;
-    alternate?: boolean | undefined;
-    fill?: import("../../types").AnimationFillMode | undefined;
-    reversed?: boolean | undefined;
-}[];
-export declare function getNames(_: TimeAnimationOptions): string[];
-//# sourceMappingURL=Blink.d.ts.map

package/dist/types/library/ongoing/Blink.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Blink.d.ts","sourceRoot":"","sources":["../../../../src/library/ongoing/Blink.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAS,oBAAoB,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AA+BvE,wBAAgB,GAAG,CAAC,OAAO,EAAE,oBAAoB,EAAE,CAAC,CAAC,EAAE,MAAM;;;;;;;;;;;;;;;IAmG5D;AAED,wBAAgB,QAAQ,CAAC,CAAC,EAAE,oBAAoB,YAE/C"}

package/dist/types/playground/animationMotionBgScroll.stories.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { Meta } from '@wix/yoshi-storybook-dependencies';
-declare const _default: Meta<import("@wix/yoshi-storybook-dependencies").Args>;
-export default _default;
-export declare const BackgroundScroll: React.FC<any>;
-//# sourceMappingURL=animationMotionBgScroll.stories.d.ts.map

package/dist/types/playground/animationMotionBgScroll.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animationMotionBgScroll.stories.d.ts","sourceRoot":"","sources":["../../../src/playground/animationMotionBgScroll.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AA4B7C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mCAAmC,CAAC;;AAG9D,wBAEU;AAiDV,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CA+W1C,CAAC"}

package/dist/types/playground/animationsMotion.stories.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { Meta } from '@wix/yoshi-storybook-dependencies';
-declare const _default: Meta<import("@wix/yoshi-storybook-dependencies").Args>;
-export default _default;
-export declare const Entrance: React.FC<any>;
-//# sourceMappingURL=animationsMotion.stories.d.ts.map

package/dist/types/playground/animationsMotion.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animationsMotion.stories.d.ts","sourceRoot":"","sources":["../../../src/playground/animationsMotion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mCAAmC,CAAC;;AAU9D,wBAEU;AAEV,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAuJlC,CAAC"}

package/dist/types/playground/animationsMotionMouse.stories.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { Meta } from '@wix/yoshi-storybook-dependencies';
-declare const _default: Meta<import("@wix/yoshi-storybook-dependencies").Args>;
-export default _default;
-export declare const MouseParallax: React.FC<any>;
-//# sourceMappingURL=animationsMotionMouse.stories.d.ts.map

package/dist/types/playground/animationsMotionMouse.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animationsMotionMouse.stories.d.ts","sourceRoot":"","sources":["../../../src/playground/animationsMotionMouse.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAqB1B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mCAAmC,CAAC;;AAU9D,wBAEU;AAEV,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAsOvC,CAAC"}

package/dist/types/playground/animationsMotionOngoing.stories.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { Meta } from '@wix/yoshi-storybook-dependencies';
-declare const _default: Meta<import("@wix/yoshi-storybook-dependencies").Args>;
-export default _default;
-export declare const Ongoing: React.FC<any>;
-//# sourceMappingURL=animationsMotionOngoing.stories.d.ts.map

package/dist/types/playground/animationsMotionOngoing.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animationsMotionOngoing.stories.d.ts","sourceRoot":"","sources":["../../../src/playground/animationsMotionOngoing.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mCAAmC,CAAC;;AAY9D,wBAEU;AAEV,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAwJjC,CAAC"}

package/dist/types/playground/animationsMotionScroll.stories.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { Meta } from '@wix/yoshi-storybook-dependencies';
-declare const _default: Meta<import("@wix/yoshi-storybook-dependencies").Args>;
-export default _default;
-export declare const Scroll: React.FC<any>;
-//# sourceMappingURL=animationsMotionScroll.stories.d.ts.map

package/dist/types/playground/animationsMotionScroll.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"animationsMotionScroll.stories.d.ts","sourceRoot":"","sources":["../../../src/playground/animationsMotionScroll.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAiB1B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mCAAmC,CAAC;;AAgB9D,wBAEU;AAEV,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAwRhC,CAAC"}

package/dist/types/playground/controls.d.ts

@@ -1,53 +0,0 @@
-import type { UnitLengthPercentage } from '../types';
-import React, { ChangeEvent } from 'react';
-export interface ControlProps {
-    default: string | number | boolean | UnitLengthPercentage;
-    type: 'number' | 'string' | 'boolean' | 'number-with-unit';
-    label?: string;
-    value?: string | number | boolean | UnitLengthPercentage;
-    min?: number;
-    max?: number;
-    step?: number;
-    enum?: readonly string[] | readonly number[];
-    units?: readonly string[];
-    onChange?: (event: ChangeEvent<HTMLInputElement | HTMLSelectElement>, value: string | number | boolean | UnitLengthPercentage) => void;
-    className?: string;
-    hidden?: boolean;
-}
-export declare const NumberInput: (props: {
-    label?: string | undefined;
-    value: number;
-    min: number;
-    max: number;
-    step: number;
-    onChange?: ((event: any) => void) | undefined;
-    className?: string | undefined;
-}) => React.JSX.Element;
-export declare const NumberWithUnitsInput: (props: {
-    label?: string | undefined;
-    value: number;
-    unit: string;
-    min: number;
-    max: number;
-    step: number;
-    units?: readonly string[] | undefined;
-    onChange?: ((event: any) => void) | undefined;
-    onUnitChange?: ((event: any) => void) | undefined;
-    className?: string | undefined;
-}) => React.JSX.Element;
-export declare const SelectInput: (props: {
-    label?: string | undefined;
-    value: string | number;
-    options: readonly string[] | readonly number[] | readonly [string, boolean][];
-    onChange?: ((event: any) => void) | undefined;
-    className?: string | undefined;
-    disabled?: boolean | undefined;
-}) => React.JSX.Element;
-export declare const BooleanInput: (props: {
-    label?: string | undefined;
-    value: boolean;
-    onChange?: ((event: any) => void) | undefined;
-    className?: string | undefined;
-}) => React.JSX.Element;
-export declare const Control: React.FC<ControlProps>;
-//# sourceMappingURL=controls.d.ts.map

package/dist/types/playground/controls.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"controls.d.ts","sourceRoot":"","sources":["../../../src/playground/controls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AACrD,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAG3C,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,oBAAoB,CAAC;IAC1D,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,kBAAkB,CAAC;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,oBAAoB,CAAC;IACzD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,MAAM,EAAE,CAAC;IAC7C,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,WAAW,CAAC,gBAAgB,GAAG,iBAAiB,CAAC,EACxD,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,oBAAoB,KACpD,IAAI,CAAC;IACV,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,WAAW;;WAEf,MAAM;SACR,MAAM;SACN,MAAM;UACL,MAAM;wBACO,GAAG,KAAK,IAAI;;uBAehC,CAAC;AAEF,eAAO,MAAM,oBAAoB;;WAExB,MAAM;UACP,MAAM;SACP,MAAM;SACN,MAAM;UACL,MAAM;;wBAEO,GAAG,KAAK,IAAI;4BACR,GAAG,KAAK,IAAI;;uBAsBpC,CAAC;AAEF,eAAO,MAAM,WAAW;;WAEf,MAAM,GAAG,MAAM;aACb,SAAS,MAAM,EAAE,GAAG,SAAS,MAAM,EAAE,GAAG,SAAS,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE;wBAC1D,GAAG,KAAK,IAAI;;;uBA0BhC,CAAC;AAEF,eAAO,MAAM,YAAY;;WAEhB,OAAO;wBACK,GAAG,KAAK,IAAI;;uBAWhC,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAoH1C,CAAC"}

package/dist/types/playground/mouseComponent.d.ts

@@ -1,10 +0,0 @@
-import React, { Ref } from 'react';
-export type MouseComponentType = 'image' | 'square' | 'SVG' | 'text';
-export interface MouseComponentProps {
-    type: MouseComponentType;
-    ref: Ref<HTMLElement>;
-    rotation: number;
-}
-export declare const COMPONENTS_TYPE: Record<Lowercase<MouseComponentType>, MouseComponentType>;
-export declare const MouseComponent: React.FC<MouseComponentProps>;
-//# sourceMappingURL=mouseComponent.d.ts.map

package/dist/types/playground/mouseComponent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"mouseComponent.d.ts","sourceRoot":"","sources":["../../../src/playground/mouseComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6B,GAAG,EAAE,MAAM,OAAO,CAAC;AAM9D,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;AAErE,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,kBAAkB,CAAC;IACzB,GAAG,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,eAAe,EAAE,MAAM,CAClC,SAAS,CAAC,kBAAkB,CAAC,EAC7B,kBAAkB,CAMnB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAqEvD,CAAC"}

package/dist/types/playground/playground-common.d.ts

@@ -1,34 +0,0 @@
-import { EffectConfig, OneOfEffects } from '@wix/effects-kit';
-import { Scroll } from 'fizban';
-import { AnimationProperties } from '../types';
-export type SchemaEditor = 'wix' | 'responsive' | 'mobile';
-export type SchemaValid = Exclude<SchemaEditor, 'mobile'>;
-export declare const schemaMapper: {
-    readonly wix: SchemaValid;
-    readonly desktop: SchemaValid;
-    readonly mobile: SchemaValid;
-    readonly responsive: SchemaValid;
-};
-export declare const rangeMapper: {
-    readonly in: "scrollIn";
-    readonly out: "scrollOut";
-    readonly continuous: "scrollContinuous";
-};
-export declare function mapSchemaToDefaultData(schema?: EffectConfig<OneOfEffects>['schema'], schemaEditor?: SchemaEditor): {
-    [k: string]: string | number | boolean | import("@wix/effects-kit").UnitLengthPercentage;
-};
-export declare function resetAnimation(element: HTMLElement & {
-    _gsap?: any;
-}, timeline?: any, // TODO
-scroll?: typeof Scroll): void;
-export declare function getAnimations(defs: {
-    [key: string]: Partial<AnimationProperties>;
-}, includeGroups?: string[], excludeGroups?: string[]): {
-    [k: string]: Partial<AnimationProperties>;
-};
-export declare function c(...args: (string | null | undefined)[]): string;
-export type AnimateFunction = () => any;
-export declare function mapLegacySchemaToDefaultData(schema: AnimationProperties['schema'], data?: AnimationProperties['schema']): {
-    [k: string]: any;
-};
-//# sourceMappingURL=playground-common.d.ts.map

package/dist/types/playground/playground-common.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"playground-common.d.ts","sourceRoot":"","sources":["../../../src/playground/playground-common.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;AAChC,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAE/C,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,YAAY,GAAG,QAAQ,CAAC;AAC3D,MAAM,MAAM,WAAW,GAAG,OAAO,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;AAE1D,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAEX,eAAO,MAAM,WAAW;;;;CAId,CAAC;AAEX,wBAAgB,sBAAsB,CACpC,MAAM,CAAC,EAAE,YAAY,CAAC,YAAY,CAAC,CAAC,QAAQ,CAAC,EAC7C,YAAY,CAAC,EAAE,YAAY;;EAuB5B;AAED,wBAAgB,cAAc,CAC5B,OAAO,EAAE,WAAW,GAAG;IAAE,KAAK,CAAC,EAAE,GAAG,CAAA;CAAE,EACtC,QAAQ,CAAC,EAAE,GAAG,EAAE,OAAO;AACvB,MAAM,CAAC,EAAE,OAAO,MAAM,QAgBvB;AAED,wBAAgB,aAAa,CAC3B,IAAI,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAA;CAAE,EACrD,aAAa,GAAE,MAAM,EAAO,EAC5B,aAAa,GAAE,MAAM,EAAO;;EAS7B;AAGD,wBAAgB,CAAC,CAAC,GAAG,IAAI,EAAE,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,EAAE,UAEvD;AAED,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,CAAC;AAExC,wBAAgB,4BAA4B,CAC1C,MAAM,EAAE,mBAAmB,CAAC,QAAQ,CAAC,EACrC,IAAI,GAAE,mBAAmB,CAAC,QAAQ,CAAM;;EAezC"}