@wix/motion 1.0.73 → 1.572.0

package/dist/cjs/library/ongoing/Flip.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","POWER_EASING_MAP","soft","medium","hard","DIRECTION_MAP","vertical","x","y","horizontal","web","options","_dom","style","asWeb","direction","power","namedEffect","duration","delay","offset","getTimingFactor","name","getNames","rotationAxes","easing","custom","rotateStart","toKeyframeValue","rotateEnd","keyframes","transform","getEasing","timingFactor"],"sources":["../../../../src/library/ongoing/Flip.ts"],"sourcesContent":["import type {\n  Flip,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getEasing, getTimingFactor, toKeyframeValue } from '../../utils';\n\nconst POWER_EASING_MAP = {\n  soft: 'linear',\n  medium: 'quintInOut',\n  hard: 'backOut',\n};\n\nconst DIRECTION_MAP = {\n  vertical: { x: '1', y: '0' },\n  horizontal: { x: '0', y: '1' },\n};\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const { direction = 'horizontal', power } = options.namedEffect as Flip;\n\n  const duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const offset = getTimingFactor(duration, delay) as number;\n  const [name] = getNames(options);\n\n  const rotationAxes = DIRECTION_MAP[direction];\n  const easing =\n    (power && POWER_EASING_MAP[power]) || options.easing || 'linear';\n\n  const custom = {\n    '--motion-rotate-x': rotationAxes.x,\n    '--motion-rotate-y': rotationAxes.y,\n  };\n\n  const rotateStart = `rotate3d(${toKeyframeValue(\n    custom,\n    '--motion-rotate-x',\n    asWeb,\n  )}, ${toKeyframeValue(custom, '--motion-rotate-y', asWeb)}, 0, 0deg)`;\n\n  const rotateEnd = `rotate3d(${toKeyframeValue(\n    custom,\n    '--motion-rotate-x',\n    asWeb,\n  )}, ${toKeyframeValue(custom, '--motion-rotate-y', asWeb)}, 0, 360deg)`;\n\n  return [\n    {\n      ...options,\n      name,\n      delay: 0,\n      easing: 'linear',\n      duration: duration + delay,\n      custom,\n      keyframes: [\n        {\n          offset: 0,\n          transform: `perspective(800px) rotateZ(var(--comp-rotate-z, 0deg)) ${rotateStart}`,\n          easing: getEasing(easing),\n        },\n        {\n          offset,\n          transform: `perspective(800px) rotateZ(var(--comp-rotate-z, 0deg)) ${rotateEnd}`,\n        },\n        {\n          offset: 1,\n          transform: `perspective(800px) rotateZ(var(--comp-rotate-z, 0deg)) ${rotateEnd}`,\n        },\n      ],\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const timingFactor = getTimingFactor(options.duration!, options.delay!, true);\n\n  return [`motion-flip-${timingFactor}`];\n}\n"],"mappings":";;;;;;AAMA,IAAAA,MAAA,GAAAC,OAAA;AAEA,MAAMC,gBAAgB,GAAG;EACvBC,IAAI,EAAE,QAAQ;EACdC,MAAM,EAAE,YAAY;EACpBC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,aAAa,GAAG;EACpBC,QAAQ,EAAE;IAAEC,CAAC,EAAE,GAAG;IAAEC,CAAC,EAAE;EAAI,CAAC;EAC5BC,UAAU,EAAE;IAAEF,CAAC,EAAE,GAAG;IAAEC,CAAC,EAAE;EAAI;AAC/B,CAAC;AAEM,SAASE,GAAGA,CACjBC,OAAqD,EACrDC,IAAa,EACb;EACA,OAAOC,KAAK,CAACF,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEO,SAASE,KAAKA,CACnBF,OAAqD,EACrDG,KAAK,GAAG,KAAK,EACb;EACA,MAAM;IAAEC,SAAS,GAAG,YAAY;IAAEC;EAAM,CAAC,GAAGL,OAAO,CAACM,WAAmB;EAEvE,MAAMC,QAAQ,GAAGP,OAAO,CAACO,QAAQ,IAAI,CAAC;EACtC,MAAMC,KAAK,GAAGR,OAAO,CAACQ,KAAK,IAAI,CAAC;EAChC,MAAMC,MAAM,GAAG,IAAAC,sBAAe,EAACH,QAAQ,EAAEC,KAAK,CAAW;EACzD,MAAM,CAACG,IAAI,CAAC,GAAGC,QAAQ,CAACZ,OAAO,CAAC;EAEhC,MAAMa,YAAY,GAAGnB,aAAa,CAACU,SAAS,CAAC;EAC7C,MAAMU,MAAM,GACTT,KAAK,IAAIf,gBAAgB,CAACe,KAAK,CAAC,IAAKL,OAAO,CAACc,MAAM,IAAI,QAAQ;EAElE,MAAMC,MAAM,GAAG;IACb,mBAAmB,EAAEF,YAAY,CAACjB,CAAC;IACnC,mBAAmB,EAAEiB,YAAY,CAAChB;EACpC,CAAC;EAED,MAAMmB,WAAW,GAAG,YAAY,IAAAC,sBAAe,EAC7CF,MAAM,EACN,mBAAmB,EACnBZ,KACF,CAAC,KAAK,IAAAc,sBAAe,EAACF,MAAM,EAAE,mBAAmB,EAAEZ,KAAK,CAAC,YAAY;EAErE,MAAMe,SAAS,GAAG,YAAY,IAAAD,sBAAe,EAC3CF,MAAM,EACN,mBAAmB,EACnBZ,KACF,CAAC,KAAK,IAAAc,sBAAe,EAACF,MAAM,EAAE,mBAAmB,EAAEZ,KAAK,CAAC,cAAc;EAEvE,OAAO,CACL;IACE,GAAGH,OAAO;IACVW,IAAI;IACJH,KAAK,EAAE,CAAC;IACRM,MAAM,EAAE,QAAQ;IAChBP,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BO,MAAM;IACNI,SAAS,EAAE,CACT;MACEV,MAAM,EAAE,CAAC;MACTW,SAAS,EAAE,0DAA0DJ,WAAW,EAAE;MAClFF,MAAM,EAAE,IAAAO,gBAAS,EAACP,MAAM;IAC1B,CAAC,EACD;MACEL,MAAM;MACNW,SAAS,EAAE,0DAA0DF,SAAS;IAChF,CAAC,EACD;MACET,MAAM,EAAE,CAAC;MACTW,SAAS,EAAE,0DAA0DF,SAAS;IAChF,CAAC;EAEL,CAAC,CACF;AACH;AAEO,SAASN,QAAQA,CACtBZ,OAAqD,EACrD;EACA,MAAMsB,YAAY,GAAG,IAAAZ,sBAAe,EAACV,OAAO,CAACO,QAAQ,EAAGP,OAAO,CAACQ,KAAK,EAAG,IAAI,CAAC;EAE7E,OAAO,CAAC,eAAec,YAAY,EAAE,CAAC;AACxC","ignoreList":[]}

package/dist/cjs/library/ongoing/Fold.js

@@ -0,0 +1,167 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+const POWER_TO_ROTATION_FACTOR_MAP = {
+  soft: 1,
+  medium: 2,
+  hard: 3
+};
+const DIRECTION_MAP = {
+  top: {
+    rotation: {
+      x: 1,
+      y: 0
+    },
+    origin: {
+      x: 0,
+      y: -50
+    }
+  },
+  right: {
+    rotation: {
+      x: 0,
+      y: 1
+    },
+    origin: {
+      x: 50,
+      y: 0
+    }
+  },
+  bottom: {
+    rotation: {
+      x: 1,
+      y: 0
+    },
+    origin: {
+      x: 0,
+      y: 50
+    }
+  },
+  left: {
+    rotation: {
+      x: 0,
+      y: 1
+    },
+    origin: {
+      x: -50,
+      y: 0
+    }
+  }
+};
+const MIN_ROTATE_ANGLE = 15;
+const KEYFRAME_FACTORS = [{
+  fold: 1,
+  frameFactor: 0.25
+}, {
+  fold: -0.7,
+  frameFactor: 0.5
+}, {
+  fold: 0.6,
+  frameFactor: 0.5
+}, {
+  fold: -0.3,
+  frameFactor: 0.45
+}, {
+  fold: 0.2,
+  frameFactor: 0.4
+}, {
+  fold: -0.05,
+  frameFactor: 0.5
+}, {
+  fold: 0,
+  frameFactor: 0.35
+}];
+function web(options, _dom) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    direction = 'top',
+    power,
+    angle = MIN_ROTATE_ANGLE
+  } = options.namedEffect;
+  const easing = options.easing || 'cubicInOut';
+  const duration = options.duration || 1;
+  const delay = +(options.delay || 0);
+  const [name] = getNames(options);
+  const isResponsive = typeof power === 'undefined';
+  const {
+    rotation,
+    origin
+  } = DIRECTION_MAP[direction];
+  const {
+    x,
+    y
+  } = origin;
+  const ease = (0, _utils.getEasingFamily)(isResponsive ? easing : 'cubicInOut');
+  const rotateTransform = isResponsive ? angle : MIN_ROTATE_ANGLE * POWER_TO_ROTATION_FACTOR_MAP[power];
+  const totalDurationWithDelay = 3.2 * duration + delay;
+  const timingFactor = (0, _utils.getTimingFactor)(duration, totalDurationWithDelay - duration);
+  let currentOffset = 0;
+
+  // Create CSS custom properties for the fold configuration
+  const custom = {
+    '--motion-origin-x': `${x}%`,
+    '--motion-origin-y': `${y}%`,
+    '--motion-rotate-angle': `${rotateTransform}deg`,
+    '--motion-rotate-x': `${rotation.x}`,
+    '--motion-rotate-y': `${rotation.y}`
+  };
+  const transformLeft = `rotateZ(var(--comp-rotate-z, 0deg)) translateX(${(0, _utils.toKeyframeValue)(custom, '--motion-origin-x', asWeb)}) translateY(${(0, _utils.toKeyframeValue)(custom, '--motion-origin-y', asWeb)}) perspective(800px)`;
+  const transformRight = `translateX(calc(-1 * ${(0, _utils.toKeyframeValue)(custom, '--motion-origin-x', asWeb)})) translateY(calc(-1 * ${(0, _utils.toKeyframeValue)(custom, '--motion-origin-y', asWeb)}))`;
+  const getTransform = value => `${transformLeft} rotateX(calc(${(0, _utils.toKeyframeValue)(custom, '--motion-rotate-x', asWeb)} * ${value} * ${rotateTransform}deg)) rotateY(calc(${(0, _utils.toKeyframeValue)(custom, '--motion-rotate-y', asWeb)} * ${value} * ${rotateTransform}deg)) ${transformRight}`;
+
+  // in case a delay is applied, animate a different sequence which decays to a stop
+  const keyframes = delay ? KEYFRAME_FACTORS.map(({
+    fold,
+    frameFactor
+  }) => {
+    const keyframeOffset = currentOffset + frameFactor * timingFactor;
+    currentOffset = keyframeOffset;
+    return {
+      offset: keyframeOffset,
+      easing: (0, _utils.getEasing)('sineInOut'),
+      transform: getTransform(fold)
+    };
+  }) : [{
+    offset: 0.25,
+    easing: (0, _utils.getEasing)(ease.inOut),
+    transform: getTransform(1)
+  }, {
+    offset: 0.75,
+    easing: (0, _utils.getEasing)(ease.in),
+    transform: getTransform(-1)
+  }];
+  const transform_0 = getTransform(0);
+  return [{
+    ...options,
+    name,
+    easing: 'linear',
+    delay: 0,
+    duration: delay ? totalDurationWithDelay : duration,
+    custom,
+    keyframes: [{
+      offset: 0,
+      easing: (0, _utils.getEasing)(ease.out),
+      transform: transform_0
+    }, ...keyframes, {
+      offset: 1,
+      transform: transform_0
+    }]
+  }];
+}
+function getNames(options) {
+  const duration = options.duration || 1;
+  const delay = +(options.delay || 0);
+  if (!delay) {
+    return ['motion-fold'];
+  }
+  const totalDurationWithDelay = 3.2 * duration + delay;
+  const timingFactor = (0, _utils.getTimingFactor)(duration, totalDurationWithDelay - duration, true);
+  return [`motion-fold-${timingFactor}`];
+}
+//# sourceMappingURL=Fold.js.map

package/dist/cjs/library/ongoing/Fold.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","POWER_TO_ROTATION_FACTOR_MAP","soft","medium","hard","DIRECTION_MAP","top","rotation","x","y","origin","right","bottom","left","MIN_ROTATE_ANGLE","KEYFRAME_FACTORS","fold","frameFactor","web","options","_dom","style","asWeb","direction","power","angle","namedEffect","easing","duration","delay","name","getNames","isResponsive","ease","getEasingFamily","rotateTransform","totalDurationWithDelay","timingFactor","getTimingFactor","currentOffset","custom","transformLeft","toKeyframeValue","transformRight","getTransform","value","keyframes","map","keyframeOffset","offset","getEasing","transform","inOut","in","transform_0","out"],"sources":["../../../../src/library/ongoing/Fold.ts"],"sourcesContent":["import type {\n  Fold,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport {\n  getEasing,\n  getEasingFamily,\n  getTimingFactor,\n  toKeyframeValue,\n} from '../../utils';\n\nconst POWER_TO_ROTATION_FACTOR_MAP = {\n  soft: 1,\n  medium: 2,\n  hard: 3,\n};\n\nconst DIRECTION_MAP = {\n  top: {\n    rotation: { x: 1, y: 0 },\n    origin: { x: 0, y: -50 },\n  },\n  right: {\n    rotation: { x: 0, y: 1 },\n    origin: { x: 50, y: 0 },\n  },\n  bottom: {\n    rotation: { x: 1, y: 0 },\n    origin: { x: 0, y: 50 },\n  },\n  left: {\n    rotation: { x: 0, y: 1 },\n    origin: { x: -50, y: 0 },\n  },\n};\n\nconst MIN_ROTATE_ANGLE = 15;\n\nconst KEYFRAME_FACTORS = [\n  { fold: 1, frameFactor: 0.25 },\n  { fold: -0.7, frameFactor: 0.5 },\n  { fold: 0.6, frameFactor: 0.5 },\n  { fold: -0.3, frameFactor: 0.45 },\n  { fold: 0.2, frameFactor: 0.4 },\n  { fold: -0.05, frameFactor: 0.5 },\n  { fold: 0, frameFactor: 0.35 },\n];\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const {\n    direction = 'top',\n    power,\n    angle = MIN_ROTATE_ANGLE,\n  } = options.namedEffect as Fold;\n\n  const easing = options.easing || 'cubicInOut';\n  const duration = options.duration || 1;\n  const delay = +(options.delay || 0);\n  const [name] = getNames(options);\n\n  const isResponsive = typeof power === 'undefined';\n  const { rotation, origin } = DIRECTION_MAP[direction];\n  const { x, y } = origin;\n  const ease = getEasingFamily(isResponsive ? easing : 'cubicInOut');\n\n  const rotateTransform = isResponsive\n    ? angle\n    : MIN_ROTATE_ANGLE * POWER_TO_ROTATION_FACTOR_MAP[power];\n\n  const totalDurationWithDelay = 3.2 * duration + delay;\n  const timingFactor = getTimingFactor(\n    duration,\n    totalDurationWithDelay - duration,\n  ) as number;\n  let currentOffset = 0;\n\n  // Create CSS custom properties for the fold configuration\n  const custom: Record<string, string | number> = {\n    '--motion-origin-x': `${x}%`,\n    '--motion-origin-y': `${y}%`,\n    '--motion-rotate-angle': `${rotateTransform}deg`,\n    '--motion-rotate-x': `${rotation.x}`,\n    '--motion-rotate-y': `${rotation.y}`,\n  };\n\n  const transformLeft = `rotateZ(var(--comp-rotate-z, 0deg)) translateX(${toKeyframeValue(\n    custom,\n    '--motion-origin-x',\n    asWeb,\n  )}) translateY(${toKeyframeValue(\n    custom,\n    '--motion-origin-y',\n    asWeb,\n  )}) perspective(800px)`;\n  const transformRight = `translateX(calc(-1 * ${toKeyframeValue(\n    custom,\n    '--motion-origin-x',\n    asWeb,\n  )})) translateY(calc(-1 * ${toKeyframeValue(\n    custom,\n    '--motion-origin-y',\n    asWeb,\n  )}))`;\n\n  const getTransform = (value: number) =>\n    `${transformLeft} rotateX(calc(${toKeyframeValue(\n      custom,\n      '--motion-rotate-x',\n      asWeb,\n    )} * ${value} * ${rotateTransform}deg)) rotateY(calc(${toKeyframeValue(\n      custom,\n      '--motion-rotate-y',\n      asWeb,\n    )} * ${value} * ${rotateTransform}deg)) ${transformRight}`;\n\n  // in case a delay is applied, animate a different sequence which decays to a stop\n  const keyframes = delay\n    ? KEYFRAME_FACTORS.map(({ fold, frameFactor }) => {\n        const keyframeOffset = currentOffset + frameFactor * timingFactor;\n        currentOffset = keyframeOffset;\n        return {\n          offset: keyframeOffset,\n          easing: getEasing('sineInOut'),\n          transform: getTransform(fold),\n        };\n      })\n    : [\n        {\n          offset: 0.25,\n          easing: getEasing(ease.inOut),\n          transform: getTransform(1),\n        },\n        {\n          offset: 0.75,\n          easing: getEasing(ease.in),\n          transform: getTransform(-1),\n        },\n      ];\n\n  const transform_0 = getTransform(0);\n\n  return [\n    {\n      ...options,\n      name,\n      easing: 'linear',\n      delay: 0,\n      duration: delay ? totalDurationWithDelay : duration,\n      custom,\n      keyframes: [\n        {\n          offset: 0,\n          easing: getEasing(ease.out),\n          transform: transform_0,\n        },\n        ...keyframes,\n        {\n          offset: 1,\n          transform: transform_0,\n        },\n      ],\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const duration = options.duration || 1;\n  const delay = +(options.delay || 0);\n\n  if (!delay) {\n    return ['motion-fold'];\n  }\n\n  const totalDurationWithDelay = 3.2 * duration + delay;\n  const timingFactor = getTimingFactor(\n    duration,\n    totalDurationWithDelay - duration,\n    true,\n  ) as string;\n\n  return [`motion-fold-${timingFactor}`];\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/library/ongoing/Jello.js

@@ -0,0 +1,72 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+const POWER_TO_JELLO_FACTOR_MAP = {
+  soft: 1,
+  medium: 2,
+  hard: 4
+};
+const SKEW_Y_KEYFRAMES = [{
+  keyframe: 24,
+  skewY: 7
+}, {
+  keyframe: 38,
+  skewY: -2
+}, {
+  keyframe: 58,
+  skewY: 4
+}, {
+  keyframe: 80,
+  skewY: -2
+}, {
+  keyframe: 100,
+  skewY: 0
+}];
+function web(options, _dom) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    power,
+    intensity = 0.25
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const [name] = getNames(options);
+  const timingFactor = (0, _utils.getTimingFactor)(duration, delay);
+  const responsiveJelloFactor = (0, _utils.mapRange)(0, 1, POWER_TO_JELLO_FACTOR_MAP.soft, POWER_TO_JELLO_FACTOR_MAP.hard, intensity);
+  const jelloFactor = power && POWER_TO_JELLO_FACTOR_MAP[power] || responsiveJelloFactor;
+
+  // Create CSS custom properties for the jello configuration
+  const custom = {
+    '--motion-skew-y': jelloFactor
+  };
+  const keyframes = SKEW_Y_KEYFRAMES.map(({
+    keyframe,
+    skewY
+  }) => {
+    const offset = keyframe / 100 * timingFactor;
+    return {
+      offset,
+      transform: `rotateZ(var(--comp-rotate-z, 0deg)) skewY(calc(${(0, _utils.toKeyframeValue)(custom, '--motion-skew-y', asWeb)} * ${skewY}deg))`
+    };
+  });
+  return [{
+    ...options,
+    name,
+    delay: 0,
+    easing: 'linear',
+    duration: duration + delay,
+    custom,
+    keyframes
+  }];
+}
+function getNames(options) {
+  const timingFactor = (0, _utils.getTimingFactor)(options.duration, options.delay, true);
+  return [`motion-jello-${timingFactor}`];
+}
+//# sourceMappingURL=Jello.js.map

package/dist/cjs/library/ongoing/Jello.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","POWER_TO_JELLO_FACTOR_MAP","soft","medium","hard","SKEW_Y_KEYFRAMES","keyframe","skewY","web","options","_dom","style","asWeb","power","intensity","namedEffect","duration","delay","name","getNames","timingFactor","getTimingFactor","responsiveJelloFactor","mapRange","jelloFactor","custom","keyframes","map","offset","transform","toKeyframeValue","easing"],"sources":["../../../../src/library/ongoing/Jello.ts"],"sourcesContent":["import type {\n  Jello,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getTimingFactor, toKeyframeValue, mapRange } from '../../utils';\n\nconst POWER_TO_JELLO_FACTOR_MAP = {\n  soft: 1,\n  medium: 2,\n  hard: 4,\n};\n\nconst SKEW_Y_KEYFRAMES = [\n  { keyframe: 24, skewY: 7 },\n  { keyframe: 38, skewY: -2 },\n  { keyframe: 58, skewY: 4 },\n  { keyframe: 80, skewY: -2 },\n  { keyframe: 100, skewY: 0 },\n];\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const { power, intensity = 0.25 } = options.namedEffect as Jello;\n\n  const duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const [name] = getNames(options);\n  const timingFactor = getTimingFactor(duration, delay) as number;\n\n  const responsiveJelloFactor = mapRange(\n    0,\n    1,\n    POWER_TO_JELLO_FACTOR_MAP.soft,\n    POWER_TO_JELLO_FACTOR_MAP.hard,\n    intensity,\n  );\n  const jelloFactor =\n    (power && POWER_TO_JELLO_FACTOR_MAP[power]) || responsiveJelloFactor;\n\n  // Create CSS custom properties for the jello configuration\n  const custom: Record<string, string | number> = {\n    '--motion-skew-y': jelloFactor,\n  };\n\n  const keyframes = SKEW_Y_KEYFRAMES.map(({ keyframe, skewY }) => {\n    const offset = (keyframe / 100) * timingFactor;\n\n    return {\n      offset,\n      transform: `rotateZ(var(--comp-rotate-z, 0deg)) skewY(calc(${toKeyframeValue(\n        custom,\n        '--motion-skew-y',\n        asWeb,\n      )} * ${skewY}deg))`,\n    };\n  });\n\n  return [\n    {\n      ...options,\n      name,\n      delay: 0,\n      easing: 'linear',\n      duration: duration + delay,\n      custom,\n      keyframes,\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const timingFactor = getTimingFactor(options.duration!, options.delay!, true);\n\n  return [`motion-jello-${timingFactor}`];\n}\n"],"mappings":";;;;;;AAMA,IAAAA,MAAA,GAAAC,OAAA;AAEA,MAAMC,yBAAyB,GAAG;EAChCC,IAAI,EAAE,CAAC;EACPC,MAAM,EAAE,CAAC;EACTC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,gBAAgB,GAAG,CACvB;EAAEC,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE;AAAE,CAAC,EAC1B;EAAED,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE,CAAC;AAAE,CAAC,EAC3B;EAAED,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE;AAAE,CAAC,EAC1B;EAAED,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE,CAAC;AAAE,CAAC,EAC3B;EAAED,QAAQ,EAAE,GAAG;EAAEC,KAAK,EAAE;AAAE,CAAC,CAC5B;AAEM,SAASC,GAAGA,CACjBC,OAAqD,EACrDC,IAAa,EACb;EACA,OAAOC,KAAK,CAACF,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEO,SAASE,KAAKA,CACnBF,OAAqD,EACrDG,KAAK,GAAG,KAAK,EACb;EACA,MAAM;IAAEC,KAAK;IAAEC,SAAS,GAAG;EAAK,CAAC,GAAGL,OAAO,CAACM,WAAoB;EAEhE,MAAMC,QAAQ,GAAGP,OAAO,CAACO,QAAQ,IAAI,CAAC;EACtC,MAAMC,KAAK,GAAGR,OAAO,CAACQ,KAAK,IAAI,CAAC;EAChC,MAAM,CAACC,IAAI,CAAC,GAAGC,QAAQ,CAACV,OAAO,CAAC;EAChC,MAAMW,YAAY,GAAG,IAAAC,sBAAe,EAACL,QAAQ,EAAEC,KAAK,CAAW;EAE/D,MAAMK,qBAAqB,GAAG,IAAAC,eAAQ,EACpC,CAAC,EACD,CAAC,EACDtB,yBAAyB,CAACC,IAAI,EAC9BD,yBAAyB,CAACG,IAAI,EAC9BU,SACF,CAAC;EACD,MAAMU,WAAW,GACdX,KAAK,IAAIZ,yBAAyB,CAACY,KAAK,CAAC,IAAKS,qBAAqB;;EAEtE;EACA,MAAMG,MAAuC,GAAG;IAC9C,iBAAiB,EAAED;EACrB,CAAC;EAED,MAAME,SAAS,GAAGrB,gBAAgB,CAACsB,GAAG,CAAC,CAAC;IAAErB,QAAQ;IAAEC;EAAM,CAAC,KAAK;IAC9D,MAAMqB,MAAM,GAAItB,QAAQ,GAAG,GAAG,GAAIc,YAAY;IAE9C,OAAO;MACLQ,MAAM;MACNC,SAAS,EAAE,kDAAkD,IAAAC,sBAAe,EAC1EL,MAAM,EACN,iBAAiB,EACjBb,KACF,CAAC,MAAML,KAAK;IACd,CAAC;EACH,CAAC,CAAC;EAEF,OAAO,CACL;IACE,GAAGE,OAAO;IACVS,IAAI;IACJD,KAAK,EAAE,CAAC;IACRc,MAAM,EAAE,QAAQ;IAChBf,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BQ,MAAM;IACNC;EACF,CAAC,CACF;AACH;AAEO,SAASP,QAAQA,CACtBV,OAAqD,EACrD;EACA,MAAMW,YAAY,GAAG,IAAAC,sBAAe,EAACZ,OAAO,CAACO,QAAQ,EAAGP,OAAO,CAACQ,KAAK,EAAG,IAAI,CAAC;EAE7E,OAAO,CAAC,gBAAgBG,YAAY,EAAE,CAAC;AACzC","ignoreList":[]}

package/dist/cjs/library/ongoing/Poke.js

@@ -0,0 +1,102 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+const TRANSLATE_KEYFRAMES = [{
+  keyframe: 17,
+  translate: 7
+}, {
+  keyframe: 32,
+  translate: 25
+}, {
+  keyframe: 48,
+  translate: 8
+}, {
+  keyframe: 56,
+  translate: 11
+}, {
+  keyframe: 66,
+  translate: 25
+}, {
+  keyframe: 83,
+  translate: 4
+}, {
+  keyframe: 100,
+  translate: 0
+}];
+const POWER_TO_POKE_FACTOR_MAP = {
+  soft: 1,
+  medium: 2,
+  hard: 4
+};
+const DIRECTION_MAP = {
+  top: {
+    x: 0,
+    y: -1
+  },
+  bottom: {
+    x: 0,
+    y: 1
+  },
+  right: {
+    x: 1,
+    y: 0
+  },
+  left: {
+    x: -1,
+    y: 0
+  }
+};
+function web(options, _dom) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    power,
+    intensity = 0.5,
+    direction = 'right'
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = +(options.delay || 0);
+  const {
+    x,
+    y
+  } = DIRECTION_MAP[direction];
+  const timingFactor = (0, _utils.getTimingFactor)(duration, delay);
+  const [name] = getNames(options);
+  const responsivePokeFactor = (0, _utils.mapRange)(0, 1, POWER_TO_POKE_FACTOR_MAP.soft, POWER_TO_POKE_FACTOR_MAP.hard, intensity);
+  const pokeFactor = power ? POWER_TO_POKE_FACTOR_MAP[power] : responsivePokeFactor;
+
+  // Create CSS custom properties for the poke configuration
+  const custom = {
+    '--motion-translate-x': x * pokeFactor,
+    '--motion-translate-y': y * pokeFactor
+  };
+  const keyframes = TRANSLATE_KEYFRAMES.map(({
+    keyframe,
+    translate
+  }) => {
+    const translateValue = `calc(${(0, _utils.toKeyframeValue)(custom, '--motion-translate-x', asWeb)} * ${translate}px) calc(${(0, _utils.toKeyframeValue)(custom, '--motion-translate-y', asWeb)} * ${translate}px)`;
+    return {
+      offset: keyframe / 100 * timingFactor,
+      translate: translateValue
+    };
+  });
+  return [{
+    ...options,
+    name,
+    easing: 'linear',
+    delay: 0,
+    duration: duration + delay,
+    custom,
+    keyframes
+  }];
+}
+function getNames(options) {
+  const timingFactor = (0, _utils.getTimingFactor)(options.duration, options.delay, true);
+  return [`motion-poke-${timingFactor}`];
+}
+//# sourceMappingURL=Poke.js.map

package/dist/cjs/library/ongoing/Poke.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","TRANSLATE_KEYFRAMES","keyframe","translate","POWER_TO_POKE_FACTOR_MAP","soft","medium","hard","DIRECTION_MAP","top","x","y","bottom","right","left","web","options","_dom","style","asWeb","power","intensity","direction","namedEffect","duration","delay","timingFactor","getTimingFactor","name","getNames","responsivePokeFactor","mapRange","pokeFactor","custom","keyframes","map","translateValue","toKeyframeValue","offset","easing"],"sources":["../../../../src/library/ongoing/Poke.ts"],"sourcesContent":["import type {\n  Poke,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getTimingFactor, toKeyframeValue, mapRange } from '../../utils';\n\nconst TRANSLATE_KEYFRAMES = [\n  { keyframe: 17, translate: 7 },\n  { keyframe: 32, translate: 25 },\n  { keyframe: 48, translate: 8 },\n  { keyframe: 56, translate: 11 },\n  { keyframe: 66, translate: 25 },\n  { keyframe: 83, translate: 4 },\n  { keyframe: 100, translate: 0 },\n];\n\nconst POWER_TO_POKE_FACTOR_MAP = {\n  soft: 1,\n  medium: 2,\n  hard: 4,\n};\n\nconst DIRECTION_MAP = {\n  top: { x: 0, y: -1 },\n  bottom: { x: 0, y: 1 },\n  right: { x: 1, y: 0 },\n  left: { x: -1, y: 0 },\n};\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const {\n    power,\n    intensity = 0.5,\n    direction = 'right',\n  } = options.namedEffect as Poke;\n\n  const duration = options.duration || 1;\n  const delay = +(options.delay || 0);\n  const { x, y } = DIRECTION_MAP[direction];\n  const timingFactor = getTimingFactor(duration, delay) as number;\n  const [name] = getNames(options);\n\n  const responsivePokeFactor = mapRange(\n    0,\n    1,\n    POWER_TO_POKE_FACTOR_MAP.soft,\n    POWER_TO_POKE_FACTOR_MAP.hard,\n    intensity,\n  );\n\n  const pokeFactor = power\n    ? POWER_TO_POKE_FACTOR_MAP[power]\n    : responsivePokeFactor;\n\n  // Create CSS custom properties for the poke configuration\n  const custom: Record<string, string | number> = {\n    '--motion-translate-x': x * pokeFactor,\n    '--motion-translate-y': y * pokeFactor,\n  };\n\n  const keyframes = TRANSLATE_KEYFRAMES.map(({ keyframe, translate }) => {\n    const translateValue = `calc(${toKeyframeValue(\n      custom,\n      '--motion-translate-x',\n      asWeb,\n    )} * ${translate}px) calc(${toKeyframeValue(\n      custom,\n      '--motion-translate-y',\n      asWeb,\n    )} * ${translate}px)`;\n\n    return {\n      offset: (keyframe / 100) * timingFactor,\n      translate: translateValue,\n    };\n  });\n\n  return [\n    {\n      ...options,\n      name,\n      easing: 'linear',\n      delay: 0,\n      duration: duration + delay,\n      custom,\n      keyframes,\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const timingFactor = getTimingFactor(\n    options.duration!,\n    options.delay!,\n    true,\n  ) as string;\n\n  return [`motion-poke-${timingFactor}`];\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/library/ongoing/Pulse.js

@@ -0,0 +1,75 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+const POWER_TO_PULSE_OFFSET_MAP = {
+  soft: 0,
+  medium: 0.06,
+  hard: 0.12
+};
+const SCALE_KEYFRAMES = [{
+  keyframe: 27,
+  scale: 0.96
+}, {
+  keyframe: 45,
+  scale: 1
+}, {
+  keyframe: 72,
+  scale: 0.93
+}, {
+  keyframe: 100,
+  scale: 1
+}];
+function web(options, _dom) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    power,
+    intensity = 0
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const timingFactor = (0, _utils.getTimingFactor)(duration, delay);
+  const [name] = getNames(options);
+  const responsivePulseOffset = (0, _utils.mapRange)(0, 1, POWER_TO_PULSE_OFFSET_MAP.soft, POWER_TO_PULSE_OFFSET_MAP.hard, intensity);
+  const pulseOffset = typeof power !== 'undefined' ? POWER_TO_PULSE_OFFSET_MAP[power] : responsivePulseOffset;
+
+  // Create CSS custom properties for the pulse configuration
+  const custom = {
+    '--motion-pulse-offset': pulseOffset
+  };
+  const keyframes = SCALE_KEYFRAMES.map(({
+    keyframe,
+    scale
+  }) => {
+    const offset = keyframe / 100 * timingFactor;
+    return {
+      offset,
+      transform: `scale(${scale < 1 ? `calc(${scale} - ${(0, _utils.toKeyframeValue)(custom, '--motion-pulse-offset', asWeb)})` : '1'})`
+    };
+  });
+  if (timingFactor < 1) {
+    keyframes.push({
+      offset: 1,
+      transform: 'scale(1)'
+    });
+  }
+  return [{
+    ...options,
+    name,
+    easing: 'linear',
+    delay: 0,
+    duration: duration + delay,
+    custom,
+    keyframes
+  }];
+}
+function getNames(options) {
+  const timingFactor = (0, _utils.getTimingFactor)(options.duration, options.delay, true);
+  return [`motion-pulse-${timingFactor}`];
+}
+//# sourceMappingURL=Pulse.js.map

package/dist/cjs/library/ongoing/Pulse.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","POWER_TO_PULSE_OFFSET_MAP","soft","medium","hard","SCALE_KEYFRAMES","keyframe","scale","web","options","_dom","style","asWeb","power","intensity","namedEffect","duration","delay","timingFactor","getTimingFactor","name","getNames","responsivePulseOffset","mapRange","pulseOffset","custom","keyframes","map","offset","transform","toKeyframeValue","push","easing"],"sources":["../../../../src/library/ongoing/Pulse.ts"],"sourcesContent":["import type {\n  Pulse,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getTimingFactor, toKeyframeValue, mapRange } from '../../utils';\n\nconst POWER_TO_PULSE_OFFSET_MAP = {\n  soft: 0,\n  medium: 0.06,\n  hard: 0.12,\n};\n\nconst SCALE_KEYFRAMES = [\n  { keyframe: 27, scale: 0.96 },\n  { keyframe: 45, scale: 1 },\n  { keyframe: 72, scale: 0.93 },\n  { keyframe: 100, scale: 1 },\n];\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const { power, intensity = 0 } = options.namedEffect as Pulse;\n\n  const duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const timingFactor = getTimingFactor(duration, delay) as number;\n  const [name] = getNames(options);\n\n  const responsivePulseOffset = mapRange(\n    0,\n    1,\n    POWER_TO_PULSE_OFFSET_MAP.soft,\n    POWER_TO_PULSE_OFFSET_MAP.hard,\n    intensity,\n  );\n\n  const pulseOffset =\n    typeof power !== 'undefined'\n      ? POWER_TO_PULSE_OFFSET_MAP[power]\n      : responsivePulseOffset;\n\n  // Create CSS custom properties for the pulse configuration\n  const custom: Record<string, string | number> = {\n    '--motion-pulse-offset': pulseOffset,\n  };\n\n  const keyframes = SCALE_KEYFRAMES.map(({ keyframe, scale }) => {\n    const offset = (keyframe / 100) * timingFactor;\n\n    return {\n      offset,\n      transform: `scale(${\n        scale < 1\n          ? `calc(${scale} - ${toKeyframeValue(\n              custom,\n              '--motion-pulse-offset',\n              asWeb,\n            )})`\n          : '1'\n      })`,\n    };\n  });\n\n  if (timingFactor < 1) {\n    keyframes.push({\n      offset: 1,\n      transform: 'scale(1)',\n    });\n  }\n\n  return [\n    {\n      ...options,\n      name,\n      easing: 'linear',\n      delay: 0,\n      duration: duration + delay,\n      custom,\n      keyframes,\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const timingFactor = getTimingFactor(options.duration!, options.delay!, true);\n\n  return [`motion-pulse-${timingFactor}`];\n}\n"],"mappings":";;;;;;AAMA,IAAAA,MAAA,GAAAC,OAAA;AAEA,MAAMC,yBAAyB,GAAG;EAChCC,IAAI,EAAE,CAAC;EACPC,MAAM,EAAE,IAAI;EACZC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,eAAe,GAAG,CACtB;EAAEC,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE;AAAK,CAAC,EAC7B;EAAED,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE;AAAE,CAAC,EAC1B;EAAED,QAAQ,EAAE,EAAE;EAAEC,KAAK,EAAE;AAAK,CAAC,EAC7B;EAAED,QAAQ,EAAE,GAAG;EAAEC,KAAK,EAAE;AAAE,CAAC,CAC5B;AAEM,SAASC,GAAGA,CACjBC,OAAqD,EACrDC,IAAa,EACb;EACA,OAAOC,KAAK,CAACF,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEO,SAASE,KAAKA,CACnBF,OAAqD,EACrDG,KAAK,GAAG,KAAK,EACb;EACA,MAAM;IAAEC,KAAK;IAAEC,SAAS,GAAG;EAAE,CAAC,GAAGL,OAAO,CAACM,WAAoB;EAE7D,MAAMC,QAAQ,GAAGP,OAAO,CAACO,QAAQ,IAAI,CAAC;EACtC,MAAMC,KAAK,GAAGR,OAAO,CAACQ,KAAK,IAAI,CAAC;EAChC,MAAMC,YAAY,GAAG,IAAAC,sBAAe,EAACH,QAAQ,EAAEC,KAAK,CAAW;EAC/D,MAAM,CAACG,IAAI,CAAC,GAAGC,QAAQ,CAACZ,OAAO,CAAC;EAEhC,MAAMa,qBAAqB,GAAG,IAAAC,eAAQ,EACpC,CAAC,EACD,CAAC,EACDtB,yBAAyB,CAACC,IAAI,EAC9BD,yBAAyB,CAACG,IAAI,EAC9BU,SACF,CAAC;EAED,MAAMU,WAAW,GACf,OAAOX,KAAK,KAAK,WAAW,GACxBZ,yBAAyB,CAACY,KAAK,CAAC,GAChCS,qBAAqB;;EAE3B;EACA,MAAMG,MAAuC,GAAG;IAC9C,uBAAuB,EAAED;EAC3B,CAAC;EAED,MAAME,SAAS,GAAGrB,eAAe,CAACsB,GAAG,CAAC,CAAC;IAAErB,QAAQ;IAAEC;EAAM,CAAC,KAAK;IAC7D,MAAMqB,MAAM,GAAItB,QAAQ,GAAG,GAAG,GAAIY,YAAY;IAE9C,OAAO;MACLU,MAAM;MACNC,SAAS,EAAE,SACTtB,KAAK,GAAG,CAAC,GACL,QAAQA,KAAK,MAAM,IAAAuB,sBAAe,EAChCL,MAAM,EACN,uBAAuB,EACvBb,KACF,CAAC,GAAG,GACJ,GAAG;IAEX,CAAC;EACH,CAAC,CAAC;EAEF,IAAIM,YAAY,GAAG,CAAC,EAAE;IACpBQ,SAAS,CAACK,IAAI,CAAC;MACbH,MAAM,EAAE,CAAC;MACTC,SAAS,EAAE;IACb,CAAC,CAAC;EACJ;EAEA,OAAO,CACL;IACE,GAAGpB,OAAO;IACVW,IAAI;IACJY,MAAM,EAAE,QAAQ;IAChBf,KAAK,EAAE,CAAC;IACRD,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BQ,MAAM;IACNC;EACF,CAAC,CACF;AACH;AAEO,SAASL,QAAQA,CACtBZ,OAAqD,EACrD;EACA,MAAMS,YAAY,GAAG,IAAAC,sBAAe,EAACV,OAAO,CAACO,QAAQ,EAAGP,OAAO,CAACQ,KAAK,EAAG,IAAI,CAAC;EAE7E,OAAO,CAAC,gBAAgBC,YAAY,EAAE,CAAC;AACzC","ignoreList":[]}

package/dist/cjs/library/ongoing/Rubber.js

@@ -0,0 +1,92 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+const POWER_TO_RUBBER_OFFSET_MAP = {
+  soft: 0,
+  medium: 0.05,
+  hard: 0.1
+};
+const SCALE_KEYFRAMES = [{
+  keyframe: 45,
+  scaleX: 1.03,
+  scaleY: 0.93
+}, {
+  keyframe: 56,
+  scaleX: 0.9,
+  scaleY: 1.03
+}, {
+  keyframe: 66,
+  scaleX: 1.02,
+  scaleY: 0.96
+}, {
+  keyframe: 78,
+  scaleX: 0.98,
+  scaleY: 1.02
+}, {
+  keyframe: 89,
+  scaleX: 1.005,
+  scaleY: 0.9995
+}, {
+  keyframe: 100,
+  scaleX: 1,
+  scaleY: 1
+}];
+function web(options, _dom) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    power,
+    intensity = 0.5
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const timingFactor = (0, _utils.getTimingFactor)(duration, delay);
+  const [name] = getNames(options);
+  const responsiveRubberOffset = (0, _utils.mapRange)(0, 1, POWER_TO_RUBBER_OFFSET_MAP.soft, POWER_TO_RUBBER_OFFSET_MAP.hard, intensity);
+  const rubberOffset = typeof power !== 'undefined' ? POWER_TO_RUBBER_OFFSET_MAP[power] : responsiveRubberOffset;
+
+  // Create CSS custom properties for the rubber configuration
+  const custom = {};
+  const keyframes = SCALE_KEYFRAMES.map(({
+    keyframe,
+    scaleX,
+    scaleY
+  }, index) => {
+    const isLastKeyframe = index === SCALE_KEYFRAMES.length - 1;
+    const isEvenKeyframe = index % 2 === 0;
+    const offset = rubberOffset * (isLastKeyframe ? 0 : isEvenKeyframe ? 1 : -0.5);
+    const adjustedScaleX = (0, _utils.roundNumber)(scaleX + offset, 4);
+    const adjustedScaleY = (0, _utils.roundNumber)(scaleY - offset, 4);
+
+    // Create custom property keys for this keyframe
+    const scaleXKey = `--motion-scale-x-${keyframe}`;
+    const scaleYKey = `--motion-scale-y-${keyframe}`;
+
+    // Add the scale values to custom properties
+    custom[scaleXKey] = adjustedScaleX;
+    custom[scaleYKey] = adjustedScaleY;
+    return {
+      offset: keyframe / 100 * timingFactor,
+      transform: `rotateZ(var(--comp-rotate-z, 0deg)) scale(${(0, _utils.toKeyframeValue)(custom, scaleXKey, asWeb)}, ${(0, _utils.toKeyframeValue)(custom, scaleYKey, asWeb)})`
+    };
+  });
+  return [{
+    ...options,
+    name,
+    easing: 'linear',
+    delay: 0,
+    duration: duration + delay,
+    custom,
+    keyframes
+  }];
+}
+function getNames(options) {
+  const timingFactor = (0, _utils.getTimingFactor)(options.duration, options.delay, true);
+  return [`motion-rubber-${timingFactor}`];
+}
+//# sourceMappingURL=Rubber.js.map

package/dist/cjs/library/ongoing/Rubber.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","POWER_TO_RUBBER_OFFSET_MAP","soft","medium","hard","SCALE_KEYFRAMES","keyframe","scaleX","scaleY","web","options","_dom","style","asWeb","power","intensity","namedEffect","duration","delay","timingFactor","getTimingFactor","name","getNames","responsiveRubberOffset","mapRange","rubberOffset","custom","keyframes","map","index","isLastKeyframe","length","isEvenKeyframe","offset","adjustedScaleX","roundNumber","adjustedScaleY","scaleXKey","scaleYKey","transform","toKeyframeValue","easing"],"sources":["../../../../src/library/ongoing/Rubber.ts"],"sourcesContent":["import type {\n  Rubber,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport {\n  getTimingFactor,\n  roundNumber,\n  toKeyframeValue,\n  mapRange,\n} from '../../utils';\n\nconst POWER_TO_RUBBER_OFFSET_MAP = {\n  soft: 0,\n  medium: 0.05,\n  hard: 0.1,\n};\n\nconst SCALE_KEYFRAMES = [\n  { keyframe: 45, scaleX: 1.03, scaleY: 0.93 },\n  { keyframe: 56, scaleX: 0.9, scaleY: 1.03 },\n  { keyframe: 66, scaleX: 1.02, scaleY: 0.96 },\n  { keyframe: 78, scaleX: 0.98, scaleY: 1.02 },\n  { keyframe: 89, scaleX: 1.005, scaleY: 0.9995 },\n  { keyframe: 100, scaleX: 1, scaleY: 1 },\n];\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const { power, intensity = 0.5 } = options.namedEffect as Rubber;\n\n  const duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const timingFactor = getTimingFactor(duration, delay) as number;\n  const [name] = getNames(options);\n\n  const responsiveRubberOffset = mapRange(\n    0,\n    1,\n    POWER_TO_RUBBER_OFFSET_MAP.soft,\n    POWER_TO_RUBBER_OFFSET_MAP.hard,\n    intensity,\n  );\n  const rubberOffset =\n    typeof power !== 'undefined'\n      ? POWER_TO_RUBBER_OFFSET_MAP[power]\n      : responsiveRubberOffset;\n\n  // Create CSS custom properties for the rubber configuration\n  const custom: Record<string, string | number> = {};\n\n  const keyframes = SCALE_KEYFRAMES.map(\n    ({ keyframe, scaleX, scaleY }, index) => {\n      const isLastKeyframe = index === SCALE_KEYFRAMES.length - 1;\n      const isEvenKeyframe = index % 2 === 0;\n      const offset =\n        rubberOffset * (isLastKeyframe ? 0 : isEvenKeyframe ? 1 : -0.5);\n\n      const adjustedScaleX = roundNumber(scaleX + offset, 4);\n      const adjustedScaleY = roundNumber(scaleY - offset, 4);\n\n      // Create custom property keys for this keyframe\n      const scaleXKey = `--motion-scale-x-${keyframe}`;\n      const scaleYKey = `--motion-scale-y-${keyframe}`;\n\n      // Add the scale values to custom properties\n      custom[scaleXKey] = adjustedScaleX;\n      custom[scaleYKey] = adjustedScaleY;\n\n      return {\n        offset: (keyframe / 100) * timingFactor,\n        transform: `rotateZ(var(--comp-rotate-z, 0deg)) scale(${toKeyframeValue(\n          custom,\n          scaleXKey,\n          asWeb,\n        )}, ${toKeyframeValue(custom, scaleYKey, asWeb)})`,\n      };\n    },\n  );\n\n  return [\n    {\n      ...options,\n      name,\n      easing: 'linear',\n      delay: 0,\n      duration: duration + delay,\n      custom,\n      keyframes,\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const timingFactor = getTimingFactor(options.duration!, options.delay!, true);\n\n  return [`motion-rubber-${timingFactor}`];\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/library/ongoing/Spin.js

@@ -0,0 +1,55 @@
+"use strict";
+
+exports.__esModule = true;
+exports.getNames = getNames;
+exports.style = style;
+exports.web = web;
+var _utils = require("../../utils");
+const POWER_EASING_MAP = {
+  soft: 'linear',
+  medium: 'quintInOut',
+  hard: 'backOut'
+};
+const DIRECTION_MAP = {
+  clockwise: -1,
+  'counter-clockwise': 1
+};
+function web(options, _dom) {
+  return style(options, true);
+}
+function style(options, asWeb = false) {
+  const {
+    power,
+    direction = 'clockwise'
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const timingFactor = (0, _utils.getTimingFactor)(duration, delay);
+  const [name] = getNames(options);
+  const easing = power && POWER_EASING_MAP[power] || options.easing || 'linear';
+  const transformRotate = (DIRECTION_MAP[direction] > 0 ? 1 : -1) * 360;
+  const custom = {
+    '--motion-rotate-start': `calc(var(--comp-rotate-z, 0deg) + ${transformRotate}deg)`
+  };
+  return [{
+    ...options,
+    name,
+    easing: 'linear',
+    delay: 0,
+    duration: duration + delay,
+    custom,
+    keyframes: [{
+      offset: 0,
+      easing,
+      rotate: (0, _utils.toKeyframeValue)(custom, '--motion-rotate-start', asWeb)
+    }, {
+      offset: timingFactor,
+      rotate: `var(--comp-rotate-z, 0deg)`
+    }]
+  }];
+}
+function getNames(options) {
+  const timingFactor = (0, _utils.getTimingFactor)(options.duration, options.delay, true);
+  return [`motion-spin-${timingFactor}`];
+}
+//# sourceMappingURL=Spin.js.map

package/dist/cjs/library/ongoing/Spin.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","POWER_EASING_MAP","soft","medium","hard","DIRECTION_MAP","clockwise","web","options","_dom","style","asWeb","power","direction","namedEffect","duration","delay","timingFactor","getTimingFactor","name","getNames","easing","transformRotate","custom","keyframes","offset","rotate","toKeyframeValue"],"sources":["../../../../src/library/ongoing/Spin.ts"],"sourcesContent":["import type {\n  Spin,\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getTimingFactor, toKeyframeValue } from '../../utils';\n\nconst POWER_EASING_MAP = {\n  soft: 'linear',\n  medium: 'quintInOut',\n  hard: 'backOut',\n};\n\nconst DIRECTION_MAP = {\n  clockwise: -1,\n  'counter-clockwise': 1,\n};\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  _dom?: DomApi,\n) {\n  return style(options, true);\n}\n\nexport function style(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  asWeb = false,\n) {\n  const { power, direction = 'clockwise' } = options.namedEffect as Spin;\n\n  const duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const timingFactor = getTimingFactor(duration, delay) as number;\n  const [name] = getNames(options);\n\n  const easing =\n    (power && POWER_EASING_MAP[power]) || options.easing || 'linear';\n\n  const transformRotate = (DIRECTION_MAP[direction] > 0 ? 1 : -1) * 360;\n\n  const custom = {\n    '--motion-rotate-start': `calc(var(--comp-rotate-z, 0deg) + ${transformRotate}deg)`,\n  };\n\n  return [\n    {\n      ...options,\n      name,\n      easing: 'linear',\n      delay: 0,\n      duration: duration + delay,\n      custom,\n      keyframes: [\n        {\n          offset: 0,\n          easing,\n          rotate: toKeyframeValue(custom, '--motion-rotate-start', asWeb),\n        },\n        {\n          offset: timingFactor,\n          rotate: `var(--comp-rotate-z, 0deg)`,\n        },\n      ],\n    },\n  ];\n}\n\nexport function getNames(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n) {\n  const timingFactor = getTimingFactor(options.duration!, options.delay!, true);\n\n  return [`motion-spin-${timingFactor}`];\n}\n"],"mappings":";;;;;;AAMA,IAAAA,MAAA,GAAAC,OAAA;AAEA,MAAMC,gBAAgB,GAAG;EACvBC,IAAI,EAAE,QAAQ;EACdC,MAAM,EAAE,YAAY;EACpBC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,aAAa,GAAG;EACpBC,SAAS,EAAE,CAAC,CAAC;EACb,mBAAmB,EAAE;AACvB,CAAC;AAEM,SAASC,GAAGA,CACjBC,OAAqD,EACrDC,IAAa,EACb;EACA,OAAOC,KAAK,CAACF,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEO,SAASE,KAAKA,CACnBF,OAAqD,EACrDG,KAAK,GAAG,KAAK,EACb;EACA,MAAM;IAAEC,KAAK;IAAEC,SAAS,GAAG;EAAY,CAAC,GAAGL,OAAO,CAACM,WAAmB;EAEtE,MAAMC,QAAQ,GAAGP,OAAO,CAACO,QAAQ,IAAI,CAAC;EACtC,MAAMC,KAAK,GAAGR,OAAO,CAACQ,KAAK,IAAI,CAAC;EAChC,MAAMC,YAAY,GAAG,IAAAC,sBAAe,EAACH,QAAQ,EAAEC,KAAK,CAAW;EAC/D,MAAM,CAACG,IAAI,CAAC,GAAGC,QAAQ,CAACZ,OAAO,CAAC;EAEhC,MAAMa,MAAM,GACTT,KAAK,IAAIX,gBAAgB,CAACW,KAAK,CAAC,IAAKJ,OAAO,CAACa,MAAM,IAAI,QAAQ;EAElE,MAAMC,eAAe,GAAG,CAACjB,aAAa,CAACQ,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG;EAErE,MAAMU,MAAM,GAAG;IACb,uBAAuB,EAAE,qCAAqCD,eAAe;EAC/E,CAAC;EAED,OAAO,CACL;IACE,GAAGd,OAAO;IACVW,IAAI;IACJE,MAAM,EAAE,QAAQ;IAChBL,KAAK,EAAE,CAAC;IACRD,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BO,MAAM;IACNC,SAAS,EAAE,CACT;MACEC,MAAM,EAAE,CAAC;MACTJ,MAAM;MACNK,MAAM,EAAE,IAAAC,sBAAe,EAACJ,MAAM,EAAE,uBAAuB,EAAEZ,KAAK;IAChE,CAAC,EACD;MACEc,MAAM,EAAER,YAAY;MACpBS,MAAM,EAAE;IACV,CAAC;EAEL,CAAC,CACF;AACH;AAEO,SAASN,QAAQA,CACtBZ,OAAqD,EACrD;EACA,MAAMS,YAAY,GAAG,IAAAC,sBAAe,EAACV,OAAO,CAACO,QAAQ,EAAGP,OAAO,CAACQ,KAAK,EAAG,IAAI,CAAC;EAE7E,OAAO,CAAC,eAAeC,YAAY,EAAE,CAAC;AACxC","ignoreList":[]}