@wix/motion 1.0.72 → 1.571.0

package/dist/esm/library/ongoing/Cross.js

@@ -0,0 +1,273 @@
+import { getElementOffset, getTimingFactor } from '../../utils';
+const FOUR_DIRECTIONS_TRANSLATIONS = {
+  // 100cqw - left
+  RIGHT: 'calc(var(--motion-parent-width, 100vw) - var(--motion-left, 0px))',
+  // left * -1 - width
+  LEFT: 'calc(var(--motion-left, 0px) * -1 - var(--motion-width, 100%))',
+  // top * -1 - height
+  TOP: 'calc(var(--motion-top, 0px) * -1 - var(--motion-height, 100%))',
+  // 100cqh - top
+  BOTTOM: 'calc(var(--motion-parent-height, 100vh) - var(--motion-top, 0px))'
+};
+const {
+  RIGHT,
+  LEFT,
+  TOP,
+  BOTTOM
+} = FOUR_DIRECTIONS_TRANSLATIONS;
+const FOUR_CORNERS_TRANSLATIONS = {
+  'top-left': {
+    // min(100cqw - left, 100cqh - top)
+    from: `min(${RIGHT}, ${BOTTOM})`,
+    // min(abs(left * -1 - width), abs(top * -1 - height))
+    to: `min(calc(${LEFT} * -1), calc(${TOP} * -1))`
+  },
+  'top-right': {
+    // min(abs(left * -1 - width), 100cqh - top)
+    from: `min(calc(${LEFT} * -1), ${BOTTOM})`,
+    // min(100cqw - left, abs(top * -1 - height))
+    to: `min(${RIGHT}, calc(${TOP} * -1))`
+  },
+  'bottom-left': {
+    // min(100cqw - left, abs(top * -1 - height))
+    from: `min(${RIGHT}, calc(${TOP} * -1))`,
+    // min(abs(left * -1 - width), 100cqh - top)
+    to: `min(calc(${LEFT} * -1), ${BOTTOM})`
+  },
+  'bottom-right': {
+    // min(abs(left * -1 - width), abs(top * -1 - height))
+    from: `min(calc(${LEFT} * -1), calc(${TOP} * -1))`,
+    // min(100cqw - left, 100cqh - top)
+    to: `min(${RIGHT}, ${BOTTOM})`
+  }
+};
+const TRANSLATE_BY_DIRECTION_MAP = {
+  left: {
+    from: `${RIGHT} 0`,
+    to: `${LEFT} 0`
+  },
+  right: {
+    from: `${LEFT} 0`,
+    to: `${RIGHT} 0`
+  },
+  top: {
+    from: `0 ${BOTTOM}`,
+    to: `0 ${TOP}`
+  },
+  bottom: {
+    from: `0 ${TOP}`,
+    to: `0 ${BOTTOM}`
+  }
+};
+const GET_OFFSET_BY_DIRECTION_MAP = {
+  // (width + left) / (100cqw + width)
+  left: _ref => {
+    let {
+      left,
+      width,
+      parentWidth
+    } = _ref;
+    return (width + left) / (parentWidth + width || 1);
+  },
+  // (100cqw - left) / (100cqw + width)
+  right: _ref2 => {
+    let {
+      left,
+      width,
+      parentWidth
+    } = _ref2;
+    return (parentWidth - left) / (parentWidth + width || 1);
+  },
+  // (100cqh - top) / (100cqh + height)
+  bottom: _ref3 => {
+    let {
+      top,
+      height,
+      parentHeight
+    } = _ref3;
+    return (parentHeight - top) / (parentHeight + height || 1);
+  },
+  // (height + top) / (100cqh + height)
+  top: _ref4 => {
+    let {
+      top,
+      height,
+      parentHeight
+    } = _ref4;
+    return (height + top) / (parentHeight + height || 1);
+  },
+  // min(<left>, <top>)
+  'bottom-right': _ref5 => {
+    let {
+      left,
+      top,
+      width,
+      height,
+      parentWidth,
+      parentHeight
+    } = _ref5;
+    const leftDistance = width + left;
+    const topDistance = parentHeight - top;
+    return leftDistance < topDistance ? leftDistance / (parentWidth + width || 1) : topDistance / (parentHeight + height || 1);
+  },
+  // min(<right>, <top>)
+  'bottom-left': _ref6 => {
+    let {
+      left,
+      top,
+      width,
+      height,
+      parentWidth,
+      parentHeight
+    } = _ref6;
+    const rightDistance = parentWidth - left;
+    const topDistance = parentHeight - top;
+    return rightDistance < topDistance ? rightDistance / (parentWidth + width || 1) : topDistance / (parentHeight + height || 1);
+  },
+  // min(<left>, <bottom>)
+  'top-right': _ref7 => {
+    let {
+      left,
+      top,
+      width,
+      height,
+      parentWidth,
+      parentHeight
+    } = _ref7;
+    const leftDistance = parentWidth - left;
+    const bottomDistance = height + top;
+    return leftDistance < bottomDistance ? leftDistance / (parentWidth + width || 1) : bottomDistance / (parentHeight + height || 1);
+  },
+  // min(<right>, <bottom>)
+  'top-left': _ref8 => {
+    let {
+      left,
+      top,
+      width,
+      height,
+      parentWidth,
+      parentHeight
+    } = _ref8;
+    const rightDistance = parentWidth - left;
+    const bottomDistance = height + top;
+    return rightDistance < bottomDistance ? rightDistance / (parentWidth + width || 1) : bottomDistance / (parentHeight + height || 1);
+  }
+};
+function generateTranslate(direction) {
+  const _from = FOUR_CORNERS_TRANSLATIONS[direction].from;
+  const _to = FOUR_CORNERS_TRANSLATIONS[direction].to;
+  const fromYFactor = direction.startsWith('top') ? 1 : -1;
+  const toYFactor = -fromYFactor;
+  const fromXFactor = direction.endsWith('left') ? 1 : -1;
+  const toXFactor = -fromXFactor;
+  return {
+    from: `calc(${_from} * ${fromXFactor}) calc(${_from} * ${fromYFactor})`,
+    to: `calc(${_to} * ${toXFactor}) calc(${_to} * ${toYFactor})`
+  };
+}
+export function web(options, dom) {
+  const {
+    direction = 'right'
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const timingFactor = getTimingFactor(duration, delay);
+  const [name] = getNames(options);
+
+  // Create CSS custom properties for the Cross configuration
+  const custom = {
+    '--motion-left': '0px',
+    '--motion-top': '0px',
+    '--motion-width': '100%',
+    '--motion-height': '100%',
+    '--motion-parent-width': '100vw',
+    '--motion-parent-height': '100vh'
+  };
+
+  /*
+   * Prepare function
+   */
+  let left = 0;
+  let top = 0;
+  let width = 0;
+  let height = 0;
+  let parentWidth = 0;
+  let parentHeight = 0;
+  if (dom) {
+    dom.measure(target => {
+      if (!target) {
+        return;
+      }
+      const {
+        width: targetWidth,
+        height: targetHeight
+      } = target.getBoundingClientRect();
+      const parent = target.offsetParent;
+      const parentRect = (parent == null ? void 0 : parent.getBoundingClientRect()) || {};
+      const offset = getElementOffset(target, parent);
+      left = offset.left;
+      top = offset.top;
+      width = targetWidth;
+      height = targetHeight;
+      parentWidth = parentRect.width;
+      parentHeight = parentRect.height;
+    });
+    dom.mutate(target => {
+      target == null || target.style.setProperty('--motion-left', `${left}px`);
+      target == null || target.style.setProperty('--motion-top', `${top}px`);
+      target == null || target.style.setProperty('--motion-width', `${width}px`);
+      target == null || target.style.setProperty('--motion-height', `${height}px`);
+      target == null || target.style.setProperty('--motion-parent-width', `${parentWidth}px`);
+      target == null || target.style.setProperty('--motion-parent-height', `${parentHeight}px`);
+    });
+  }
+  return [{
+    ...options,
+    name,
+    delay: 0,
+    easing: 'linear',
+    duration: duration + delay,
+    custom,
+    get keyframes() {
+      // Calculate the timing offset for keyframes
+      const toDurationOffset = GET_OFFSET_BY_DIRECTION_MAP[direction]({
+        left,
+        top,
+        width,
+        height,
+        parentWidth,
+        parentHeight
+      }) * timingFactor;
+      let from, to;
+      if (direction in TRANSLATE_BY_DIRECTION_MAP) {
+        from = TRANSLATE_BY_DIRECTION_MAP[direction].from;
+        to = TRANSLATE_BY_DIRECTION_MAP[direction].to;
+      } else {
+        const cornerFromTo = generateTranslate(direction);
+        from = cornerFromTo.from;
+        to = cornerFromTo.to;
+      }
+      return [{
+        offset: 0,
+        translate: '0 0'
+      }, {
+        offset: toDurationOffset,
+        translate: to,
+        easing: 'step-start'
+      }, {
+        offset: toDurationOffset,
+        translate: from
+      }, {
+        offset: timingFactor,
+        translate: '0 0'
+      }, {
+        offset: 1,
+        translate: '0 0'
+      }];
+    }
+  }];
+}
+export function getNames(_) {
+  return ['motion-cross'];
+}
+//# sourceMappingURL=Cross.js.map

package/dist/esm/library/ongoing/Cross.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getElementOffset","getTimingFactor","FOUR_DIRECTIONS_TRANSLATIONS","RIGHT","LEFT","TOP","BOTTOM","FOUR_CORNERS_TRANSLATIONS","from","to","TRANSLATE_BY_DIRECTION_MAP","left","right","top","bottom","GET_OFFSET_BY_DIRECTION_MAP","_ref","width","parentWidth","_ref2","_ref3","height","parentHeight","_ref4","_ref5","leftDistance","topDistance","_ref6","rightDistance","_ref7","bottomDistance","_ref8","generateTranslate","direction","_from","_to","fromYFactor","startsWith","toYFactor","fromXFactor","endsWith","toXFactor","web","options","dom","namedEffect","duration","delay","timingFactor","name","getNames","custom","measure","target","targetWidth","targetHeight","getBoundingClientRect","parent","offsetParent","parentRect","offset","mutate","style","setProperty","easing","keyframes","toDurationOffset","cornerFromTo","translate","_"],"sources":["../../../../src/library/ongoing/Cross.ts"],"sourcesContent":["import type {\n  Cross,\n  DomApi,\n  TimeAnimationOptions,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getElementOffset, getTimingFactor } from '../../utils';\n\nconst FOUR_DIRECTIONS_TRANSLATIONS = {\n  // 100cqw - left\n  RIGHT: 'calc(var(--motion-parent-width, 100vw) - var(--motion-left, 0px))',\n  // left * -1 - width\n  LEFT: 'calc(var(--motion-left, 0px) * -1 - var(--motion-width, 100%))',\n  // top * -1 - height\n  TOP: 'calc(var(--motion-top, 0px) * -1 - var(--motion-height, 100%))',\n  // 100cqh - top\n  BOTTOM: 'calc(var(--motion-parent-height, 100vh) - var(--motion-top, 0px))',\n};\nconst { RIGHT, LEFT, TOP, BOTTOM } = FOUR_DIRECTIONS_TRANSLATIONS;\n\nconst FOUR_CORNERS_TRANSLATIONS = {\n  'top-left': {\n    // min(100cqw - left, 100cqh - top)\n    from: `min(${RIGHT}, ${BOTTOM})`,\n    // min(abs(left * -1 - width), abs(top * -1 - height))\n    to: `min(calc(${LEFT} * -1), calc(${TOP} * -1))`,\n  },\n  'top-right': {\n    // min(abs(left * -1 - width), 100cqh - top)\n    from: `min(calc(${LEFT} * -1), ${BOTTOM})`,\n    // min(100cqw - left, abs(top * -1 - height))\n    to: `min(${RIGHT}, calc(${TOP} * -1))`,\n  },\n  'bottom-left': {\n    // min(100cqw - left, abs(top * -1 - height))\n    from: `min(${RIGHT}, calc(${TOP} * -1))`,\n    // min(abs(left * -1 - width), 100cqh - top)\n    to: `min(calc(${LEFT} * -1), ${BOTTOM})`,\n  },\n  'bottom-right': {\n    // min(abs(left * -1 - width), abs(top * -1 - height))\n    from: `min(calc(${LEFT} * -1), calc(${TOP} * -1))`,\n    // min(100cqw - left, 100cqh - top)\n    to: `min(${RIGHT}, ${BOTTOM})`,\n  },\n};\n\nconst TRANSLATE_BY_DIRECTION_MAP = {\n  left: {\n    from: `${RIGHT} 0`,\n    to: `${LEFT} 0`,\n  },\n  right: {\n    from: `${LEFT} 0`,\n    to: `${RIGHT} 0`,\n  },\n  top: {\n    from: `0 ${BOTTOM}`,\n    to: `0 ${TOP}`,\n  },\n  bottom: {\n    from: `0 ${TOP}`,\n    to: `0 ${BOTTOM}`,\n  },\n};\n\ntype HorizontalOffsetByDirectionParams = {\n  left: number;\n  width: number;\n  parentWidth: number;\n};\n\ntype VerticalOffsetByDirectionParams = {\n  top: number;\n  height: number;\n  parentHeight: number;\n};\n\ntype OffsetByDirectionParams = HorizontalOffsetByDirectionParams &\n  VerticalOffsetByDirectionParams;\n\nconst GET_OFFSET_BY_DIRECTION_MAP = {\n  // (width + left) / (100cqw + width)\n  left: ({ left, width, parentWidth }: HorizontalOffsetByDirectionParams) =>\n    (width + left) / (parentWidth + width || 1),\n  // (100cqw - left) / (100cqw + width)\n  right: ({ left, width, parentWidth }: HorizontalOffsetByDirectionParams) =>\n    (parentWidth - left) / (parentWidth + width || 1),\n  // (100cqh - top) / (100cqh + height)\n  bottom: ({ top, height, parentHeight }: VerticalOffsetByDirectionParams) =>\n    (parentHeight - top) / (parentHeight + height || 1),\n  // (height + top) / (100cqh + height)\n  top: ({ top, height, parentHeight }: VerticalOffsetByDirectionParams) =>\n    (height + top) / (parentHeight + height || 1),\n  // min(<left>, <top>)\n  'bottom-right': ({\n    left,\n    top,\n    width,\n    height,\n    parentWidth,\n    parentHeight,\n  }: OffsetByDirectionParams) => {\n    const leftDistance = width + left;\n    const topDistance = parentHeight - top;\n\n    return leftDistance < topDistance\n      ? leftDistance / (parentWidth + width || 1)\n      : topDistance / (parentHeight + height || 1);\n  },\n  // min(<right>, <top>)\n  'bottom-left': ({\n    left,\n    top,\n    width,\n    height,\n    parentWidth,\n    parentHeight,\n  }: OffsetByDirectionParams) => {\n    const rightDistance = parentWidth - left;\n    const topDistance = parentHeight - top;\n\n    return rightDistance < topDistance\n      ? rightDistance / (parentWidth + width || 1)\n      : topDistance / (parentHeight + height || 1);\n  },\n  // min(<left>, <bottom>)\n  'top-right': ({\n    left,\n    top,\n    width,\n    height,\n    parentWidth,\n    parentHeight,\n  }: OffsetByDirectionParams) => {\n    const leftDistance = parentWidth - left;\n    const bottomDistance = height + top;\n\n    return leftDistance < bottomDistance\n      ? leftDistance / (parentWidth + width || 1)\n      : bottomDistance / (parentHeight + height || 1);\n  },\n  // min(<right>, <bottom>)\n  'top-left': ({\n    left,\n    top,\n    width,\n    height,\n    parentWidth,\n    parentHeight,\n  }: OffsetByDirectionParams) => {\n    const rightDistance = parentWidth - left;\n    const bottomDistance = height + top;\n\n    return rightDistance < bottomDistance\n      ? rightDistance / (parentWidth + width || 1)\n      : bottomDistance / (parentHeight + height || 1);\n  },\n};\n\nfunction generateTranslate(direction: keyof typeof FOUR_CORNERS_TRANSLATIONS) {\n  const _from = FOUR_CORNERS_TRANSLATIONS[direction].from;\n  const _to = FOUR_CORNERS_TRANSLATIONS[direction].to;\n  const fromYFactor = direction.startsWith('top') ? 1 : -1;\n  const toYFactor = -fromYFactor;\n  const fromXFactor = direction.endsWith('left') ? 1 : -1;\n  const toXFactor = -fromXFactor;\n\n  return {\n    from: `calc(${_from} * ${fromXFactor}) calc(${_from} * ${fromYFactor})`,\n    to: `calc(${_to} * ${toXFactor}) calc(${_to} * ${toYFactor})`,\n  };\n}\n\nexport function web(\n  options: TimeAnimationOptions & AnimationExtraOptions,\n  dom?: DomApi,\n) {\n  const { direction = 'right' } = options.namedEffect as Cross;\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  // Create CSS custom properties for the Cross configuration\n  const custom: Record<string, string | number> = {\n    '--motion-left': '0px',\n    '--motion-top': '0px',\n    '--motion-width': '100%',\n    '--motion-height': '100%',\n    '--motion-parent-width': '100vw',\n    '--motion-parent-height': '100vh',\n  };\n\n  /*\n   * Prepare function\n   */\n  let left = 0;\n  let top = 0;\n  let width = 0;\n  let height = 0;\n  let parentWidth = 0;\n  let parentHeight = 0;\n\n  if (dom) {\n    dom.measure((target) => {\n      if (!target) {\n        return;\n      }\n\n      const { width: targetWidth, height: targetHeight } =\n        target.getBoundingClientRect();\n      const parent = target.offsetParent as HTMLElement;\n      const parentRect = parent?.getBoundingClientRect() || ({} as DOMRect);\n      const offset = getElementOffset(target, parent);\n\n      left = offset.left;\n      top = offset.top;\n      width = targetWidth;\n      height = targetHeight;\n      parentWidth = parentRect.width;\n      parentHeight = parentRect.height;\n    });\n\n    dom.mutate((target) => {\n      target?.style.setProperty('--motion-left', `${left}px`);\n      target?.style.setProperty('--motion-top', `${top}px`);\n      target?.style.setProperty('--motion-width', `${width}px`);\n      target?.style.setProperty('--motion-height', `${height}px`);\n      target?.style.setProperty('--motion-parent-width', `${parentWidth}px`);\n      target?.style.setProperty('--motion-parent-height', `${parentHeight}px`);\n    });\n  }\n\n  return [\n    {\n      ...options,\n      name,\n      delay: 0,\n      easing: 'linear',\n      duration: duration + delay,\n      custom,\n      get keyframes() {\n        // Calculate the timing offset for keyframes\n        const toDurationOffset =\n          GET_OFFSET_BY_DIRECTION_MAP[direction]({\n            left,\n            top,\n            width,\n            height,\n            parentWidth,\n            parentHeight,\n          }) * timingFactor;\n\n        let from, to;\n        if (direction in TRANSLATE_BY_DIRECTION_MAP) {\n          from =\n            TRANSLATE_BY_DIRECTION_MAP[\n              direction as keyof typeof TRANSLATE_BY_DIRECTION_MAP\n            ].from;\n          to =\n            TRANSLATE_BY_DIRECTION_MAP[\n              direction as keyof typeof TRANSLATE_BY_DIRECTION_MAP\n            ].to;\n        } else {\n          const cornerFromTo = generateTranslate(\n            direction as keyof typeof FOUR_CORNERS_TRANSLATIONS,\n          );\n          from = cornerFromTo.from;\n          to = cornerFromTo.to;\n        }\n\n        return [\n          {\n            offset: 0,\n            translate: '0 0',\n          },\n          {\n            offset: toDurationOffset,\n            translate: to,\n            easing: 'step-start',\n          },\n          {\n            offset: toDurationOffset,\n            translate: from,\n          },\n          {\n            offset: timingFactor,\n            translate: '0 0',\n          },\n          {\n            offset: 1,\n            translate: '0 0',\n          },\n        ];\n      },\n    },\n  ];\n}\n\nexport function getNames(_: TimeAnimationOptions & AnimationExtraOptions) {\n  return ['motion-cross'];\n}\n"],"mappings":"AAMA,SAASA,gBAAgB,EAAEC,eAAe,QAAQ,aAAa;AAE/D,MAAMC,4BAA4B,GAAG;EACnC;EACAC,KAAK,EAAE,mEAAmE;EAC1E;EACAC,IAAI,EAAE,gEAAgE;EACtE;EACAC,GAAG,EAAE,gEAAgE;EACrE;EACAC,MAAM,EAAE;AACV,CAAC;AACD,MAAM;EAAEH,KAAK;EAAEC,IAAI;EAAEC,GAAG;EAAEC;AAAO,CAAC,GAAGJ,4BAA4B;AAEjE,MAAMK,yBAAyB,GAAG;EAChC,UAAU,EAAE;IACV;IACAC,IAAI,EAAE,OAAOL,KAAK,KAAKG,MAAM,GAAG;IAChC;IACAG,EAAE,EAAE,YAAYL,IAAI,gBAAgBC,GAAG;EACzC,CAAC;EACD,WAAW,EAAE;IACX;IACAG,IAAI,EAAE,YAAYJ,IAAI,WAAWE,MAAM,GAAG;IAC1C;IACAG,EAAE,EAAE,OAAON,KAAK,UAAUE,GAAG;EAC/B,CAAC;EACD,aAAa,EAAE;IACb;IACAG,IAAI,EAAE,OAAOL,KAAK,UAAUE,GAAG,SAAS;IACxC;IACAI,EAAE,EAAE,YAAYL,IAAI,WAAWE,MAAM;EACvC,CAAC;EACD,cAAc,EAAE;IACd;IACAE,IAAI,EAAE,YAAYJ,IAAI,gBAAgBC,GAAG,SAAS;IAClD;IACAI,EAAE,EAAE,OAAON,KAAK,KAAKG,MAAM;EAC7B;AACF,CAAC;AAED,MAAMI,0BAA0B,GAAG;EACjCC,IAAI,EAAE;IACJH,IAAI,EAAE,GAAGL,KAAK,IAAI;IAClBM,EAAE,EAAE,GAAGL,IAAI;EACb,CAAC;EACDQ,KAAK,EAAE;IACLJ,IAAI,EAAE,GAAGJ,IAAI,IAAI;IACjBK,EAAE,EAAE,GAAGN,KAAK;EACd,CAAC;EACDU,GAAG,EAAE;IACHL,IAAI,EAAE,KAAKF,MAAM,EAAE;IACnBG,EAAE,EAAE,KAAKJ,GAAG;EACd,CAAC;EACDS,MAAM,EAAE;IACNN,IAAI,EAAE,KAAKH,GAAG,EAAE;IAChBI,EAAE,EAAE,KAAKH,MAAM;EACjB;AACF,CAAC;AAiBD,MAAMS,2BAA2B,GAAG;EAClC;EACAJ,IAAI,EAAEK,IAAA;IAAA,IAAC;MAAEL,IAAI;MAAEM,KAAK;MAAEC;IAA+C,CAAC,GAAAF,IAAA;IAAA,OACpE,CAACC,KAAK,GAAGN,IAAI,KAAKO,WAAW,GAAGD,KAAK,IAAI,CAAC,CAAC;EAAA;EAC7C;EACAL,KAAK,EAAEO,KAAA;IAAA,IAAC;MAAER,IAAI;MAAEM,KAAK;MAAEC;IAA+C,CAAC,GAAAC,KAAA;IAAA,OACrE,CAACD,WAAW,GAAGP,IAAI,KAAKO,WAAW,GAAGD,KAAK,IAAI,CAAC,CAAC;EAAA;EACnD;EACAH,MAAM,EAAEM,KAAA;IAAA,IAAC;MAAEP,GAAG;MAAEQ,MAAM;MAAEC;IAA8C,CAAC,GAAAF,KAAA;IAAA,OACrE,CAACE,YAAY,GAAGT,GAAG,KAAKS,YAAY,GAAGD,MAAM,IAAI,CAAC,CAAC;EAAA;EACrD;EACAR,GAAG,EAAEU,KAAA;IAAA,IAAC;MAAEV,GAAG;MAAEQ,MAAM;MAAEC;IAA8C,CAAC,GAAAC,KAAA;IAAA,OAClE,CAACF,MAAM,GAAGR,GAAG,KAAKS,YAAY,GAAGD,MAAM,IAAI,CAAC,CAAC;EAAA;EAC/C;EACA,cAAc,EAAEG,KAAA,IAOe;IAAA,IAPd;MACfb,IAAI;MACJE,GAAG;MACHI,KAAK;MACLI,MAAM;MACNH,WAAW;MACXI;IACuB,CAAC,GAAAE,KAAA;IACxB,MAAMC,YAAY,GAAGR,KAAK,GAAGN,IAAI;IACjC,MAAMe,WAAW,GAAGJ,YAAY,GAAGT,GAAG;IAEtC,OAAOY,YAAY,GAAGC,WAAW,GAC7BD,YAAY,IAAIP,WAAW,GAAGD,KAAK,IAAI,CAAC,CAAC,GACzCS,WAAW,IAAIJ,YAAY,GAAGD,MAAM,IAAI,CAAC,CAAC;EAChD,CAAC;EACD;EACA,aAAa,EAAEM,KAAA,IAOgB;IAAA,IAPf;MACdhB,IAAI;MACJE,GAAG;MACHI,KAAK;MACLI,MAAM;MACNH,WAAW;MACXI;IACuB,CAAC,GAAAK,KAAA;IACxB,MAAMC,aAAa,GAAGV,WAAW,GAAGP,IAAI;IACxC,MAAMe,WAAW,GAAGJ,YAAY,GAAGT,GAAG;IAEtC,OAAOe,aAAa,GAAGF,WAAW,GAC9BE,aAAa,IAAIV,WAAW,GAAGD,KAAK,IAAI,CAAC,CAAC,GAC1CS,WAAW,IAAIJ,YAAY,GAAGD,MAAM,IAAI,CAAC,CAAC;EAChD,CAAC;EACD;EACA,WAAW,EAAEQ,KAAA,IAOkB;IAAA,IAPjB;MACZlB,IAAI;MACJE,GAAG;MACHI,KAAK;MACLI,MAAM;MACNH,WAAW;MACXI;IACuB,CAAC,GAAAO,KAAA;IACxB,MAAMJ,YAAY,GAAGP,WAAW,GAAGP,IAAI;IACvC,MAAMmB,cAAc,GAAGT,MAAM,GAAGR,GAAG;IAEnC,OAAOY,YAAY,GAAGK,cAAc,GAChCL,YAAY,IAAIP,WAAW,GAAGD,KAAK,IAAI,CAAC,CAAC,GACzCa,cAAc,IAAIR,YAAY,GAAGD,MAAM,IAAI,CAAC,CAAC;EACnD,CAAC;EACD;EACA,UAAU,EAAEU,KAAA,IAOmB;IAAA,IAPlB;MACXpB,IAAI;MACJE,GAAG;MACHI,KAAK;MACLI,MAAM;MACNH,WAAW;MACXI;IACuB,CAAC,GAAAS,KAAA;IACxB,MAAMH,aAAa,GAAGV,WAAW,GAAGP,IAAI;IACxC,MAAMmB,cAAc,GAAGT,MAAM,GAAGR,GAAG;IAEnC,OAAOe,aAAa,GAAGE,cAAc,GACjCF,aAAa,IAAIV,WAAW,GAAGD,KAAK,IAAI,CAAC,CAAC,GAC1Ca,cAAc,IAAIR,YAAY,GAAGD,MAAM,IAAI,CAAC,CAAC;EACnD;AACF,CAAC;AAED,SAASW,iBAAiBA,CAACC,SAAiD,EAAE;EAC5E,MAAMC,KAAK,GAAG3B,yBAAyB,CAAC0B,SAAS,CAAC,CAACzB,IAAI;EACvD,MAAM2B,GAAG,GAAG5B,yBAAyB,CAAC0B,SAAS,CAAC,CAACxB,EAAE;EACnD,MAAM2B,WAAW,GAAGH,SAAS,CAACI,UAAU,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;EACxD,MAAMC,SAAS,GAAG,CAACF,WAAW;EAC9B,MAAMG,WAAW,GAAGN,SAAS,CAACO,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;EACvD,MAAMC,SAAS,GAAG,CAACF,WAAW;EAE9B,OAAO;IACL/B,IAAI,EAAE,QAAQ0B,KAAK,MAAMK,WAAW,UAAUL,KAAK,MAAME,WAAW,GAAG;IACvE3B,EAAE,EAAE,QAAQ0B,GAAG,MAAMM,SAAS,UAAUN,GAAG,MAAMG,SAAS;EAC5D,CAAC;AACH;AAEA,OAAO,SAASI,GAAGA,CACjBC,OAAqD,EACrDC,GAAY,EACZ;EACA,MAAM;IAAEX,SAAS,GAAG;EAAQ,CAAC,GAAGU,OAAO,CAACE,WAAoB;EAC5D,MAAMC,QAAQ,GAAGH,OAAO,CAACG,QAAQ,IAAI,CAAC;EACtC,MAAMC,KAAK,GAAGJ,OAAO,CAACI,KAAK,IAAI,CAAC;EAChC,MAAMC,YAAY,GAAG/C,eAAe,CAAC6C,QAAQ,EAAEC,KAAK,CAAW;EAC/D,MAAM,CAACE,IAAI,CAAC,GAAGC,QAAQ,CAACP,OAAO,CAAC;;EAEhC;EACA,MAAMQ,MAAuC,GAAG;IAC9C,eAAe,EAAE,KAAK;IACtB,cAAc,EAAE,KAAK;IACrB,gBAAgB,EAAE,MAAM;IACxB,iBAAiB,EAAE,MAAM;IACzB,uBAAuB,EAAE,OAAO;IAChC,wBAAwB,EAAE;EAC5B,CAAC;;EAED;AACF;AACA;EACE,IAAIxC,IAAI,GAAG,CAAC;EACZ,IAAIE,GAAG,GAAG,CAAC;EACX,IAAII,KAAK,GAAG,CAAC;EACb,IAAII,MAAM,GAAG,CAAC;EACd,IAAIH,WAAW,GAAG,CAAC;EACnB,IAAII,YAAY,GAAG,CAAC;EAEpB,IAAIsB,GAAG,EAAE;IACPA,GAAG,CAACQ,OAAO,CAAEC,MAAM,IAAK;MACtB,IAAI,CAACA,MAAM,EAAE;QACX;MACF;MAEA,MAAM;QAAEpC,KAAK,EAAEqC,WAAW;QAAEjC,MAAM,EAAEkC;MAAa,CAAC,GAChDF,MAAM,CAACG,qBAAqB,CAAC,CAAC;MAChC,MAAMC,MAAM,GAAGJ,MAAM,CAACK,YAA2B;MACjD,MAAMC,UAAU,GAAG,CAAAF,MAAM,oBAANA,MAAM,CAAED,qBAAqB,CAAC,CAAC,KAAK,CAAC,CAAa;MACrE,MAAMI,MAAM,GAAG5D,gBAAgB,CAACqD,MAAM,EAAEI,MAAM,CAAC;MAE/C9C,IAAI,GAAGiD,MAAM,CAACjD,IAAI;MAClBE,GAAG,GAAG+C,MAAM,CAAC/C,GAAG;MAChBI,KAAK,GAAGqC,WAAW;MACnBjC,MAAM,GAAGkC,YAAY;MACrBrC,WAAW,GAAGyC,UAAU,CAAC1C,KAAK;MAC9BK,YAAY,GAAGqC,UAAU,CAACtC,MAAM;IAClC,CAAC,CAAC;IAEFuB,GAAG,CAACiB,MAAM,CAAER,MAAM,IAAK;MACrBA,MAAM,YAANA,MAAM,CAAES,KAAK,CAACC,WAAW,CAAC,eAAe,EAAE,GAAGpD,IAAI,IAAI,CAAC;MACvD0C,MAAM,YAANA,MAAM,CAAES,KAAK,CAACC,WAAW,CAAC,cAAc,EAAE,GAAGlD,GAAG,IAAI,CAAC;MACrDwC,MAAM,YAANA,MAAM,CAAES,KAAK,CAACC,WAAW,CAAC,gBAAgB,EAAE,GAAG9C,KAAK,IAAI,CAAC;MACzDoC,MAAM,YAANA,MAAM,CAAES,KAAK,CAACC,WAAW,CAAC,iBAAiB,EAAE,GAAG1C,MAAM,IAAI,CAAC;MAC3DgC,MAAM,YAANA,MAAM,CAAES,KAAK,CAACC,WAAW,CAAC,uBAAuB,EAAE,GAAG7C,WAAW,IAAI,CAAC;MACtEmC,MAAM,YAANA,MAAM,CAAES,KAAK,CAACC,WAAW,CAAC,wBAAwB,EAAE,GAAGzC,YAAY,IAAI,CAAC;IAC1E,CAAC,CAAC;EACJ;EAEA,OAAO,CACL;IACE,GAAGqB,OAAO;IACVM,IAAI;IACJF,KAAK,EAAE,CAAC;IACRiB,MAAM,EAAE,QAAQ;IAChBlB,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BI,MAAM;IACN,IAAIc,SAASA,CAAA,EAAG;MACd;MACA,MAAMC,gBAAgB,GACpBnD,2BAA2B,CAACkB,SAAS,CAAC,CAAC;QACrCtB,IAAI;QACJE,GAAG;QACHI,KAAK;QACLI,MAAM;QACNH,WAAW;QACXI;MACF,CAAC,CAAC,GAAG0B,YAAY;MAEnB,IAAIxC,IAAI,EAAEC,EAAE;MACZ,IAAIwB,SAAS,IAAIvB,0BAA0B,EAAE;QAC3CF,IAAI,GACFE,0BAA0B,CACxBuB,SAAS,CACV,CAACzB,IAAI;QACRC,EAAE,GACAC,0BAA0B,CACxBuB,SAAS,CACV,CAACxB,EAAE;MACR,CAAC,MAAM;QACL,MAAM0D,YAAY,GAAGnC,iBAAiB,CACpCC,SACF,CAAC;QACDzB,IAAI,GAAG2D,YAAY,CAAC3D,IAAI;QACxBC,EAAE,GAAG0D,YAAY,CAAC1D,EAAE;MACtB;MAEA,OAAO,CACL;QACEmD,MAAM,EAAE,CAAC;QACTQ,SAAS,EAAE;MACb,CAAC,EACD;QACER,MAAM,EAAEM,gBAAgB;QACxBE,SAAS,EAAE3D,EAAE;QACbuD,MAAM,EAAE;MACV,CAAC,EACD;QACEJ,MAAM,EAAEM,gBAAgB;QACxBE,SAAS,EAAE5D;MACb,CAAC,EACD;QACEoD,MAAM,EAAEZ,YAAY;QACpBoB,SAAS,EAAE;MACb,CAAC,EACD;QACER,MAAM,EAAE,CAAC;QACTQ,SAAS,EAAE;MACb,CAAC,CACF;IACH;EACF,CAAC,CACF;AACH;AAEA,OAAO,SAASlB,QAAQA,CAACmB,CAA+C,EAAE;EACxE,OAAO,CAAC,cAAc,CAAC;AACzB","ignoreList":[]}

package/dist/esm/library/ongoing/DVD.js

@@ -0,0 +1,79 @@
+import { getElementOffset } from '../../utils';
+const RATIO_DAMPING_FACTOR = 0.5;
+export function web(options, dom) {
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const [dvdX, dvdY] = getNames(options);
+  let left = 0;
+  let top = 0;
+  let parentWidth = 0;
+  let parentHeight = 0;
+  let ratio = 16 / 9 * RATIO_DAMPING_FACTOR;
+  if (dom) {
+    dom.measure(target => {
+      if (!target) {
+        return;
+      }
+      const rect = target.getBoundingClientRect();
+      const {
+        width,
+        height
+      } = rect;
+      const parent = target.closest('[data-block-level-container]') || target.offsetParent;
+      const offset = getElementOffset(target, parent);
+      left = offset.left;
+      top = offset.top;
+      parentWidth = (parent == null ? void 0 : parent.offsetWidth) || 0;
+      parentHeight = (parent == null ? void 0 : parent.offsetHeight) || 0;
+      ratio = parentWidth / parentHeight * RATIO_DAMPING_FACTOR;
+      dom.mutate(() => {
+        target.style.setProperty('--motion-left', `${left}px`);
+        target.style.setProperty('--motion-top', `${top}px`);
+        target.style.setProperty('--motion-width', `${width}px`);
+        target.style.setProperty('--motion-height', `${height}px`);
+        target.style.setProperty('--motion-parent-width', `${parentWidth}px`);
+        target.style.setProperty('--motion-parent-height', `${parentHeight}px`);
+      });
+    });
+  }
+  return [{
+    ...options,
+    name: dvdX,
+    easing: 'linear',
+    delay,
+    duration: duration / ratio,
+    alternate: true,
+    keyframes: [{
+      translate: 'calc(-1 * var(--motion-left, 0px))'
+    }, {
+      translate: 'calc(var(--motion-parent-width, 100vw) - var(--motion-left, 0px) - var(--motion-width, 100%))'
+    }],
+    get timing() {
+      return {
+        iterationStart: left && parentWidth ? left / parentWidth : 0
+      };
+    }
+  }, {
+    ...options,
+    name: dvdY,
+    easing: 'linear',
+    delay,
+    duration: duration * ratio,
+    alternate: true,
+    composite: 'add',
+    keyframes: [{
+      translate: '0 calc(-1 * var(--motion-top, 0px))'
+    }, {
+      translate: '0 calc(var(--motion-parent-height, 100vh) - var(--motion-top, 0px) - var(--motion-height, 100%))'
+    }],
+    get timing() {
+      return {
+        iterationStart: top && parentHeight ? top / parentHeight : 0
+      };
+    }
+  }];
+}
+export function getNames(_) {
+  return ['motion-dvd-x', 'motion-dvd-y'];
+}
+//# sourceMappingURL=DVD.js.map

package/dist/esm/library/ongoing/DVD.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getElementOffset","RATIO_DAMPING_FACTOR","web","options","dom","duration","delay","dvdX","dvdY","getNames","left","top","parentWidth","parentHeight","ratio","measure","target","rect","getBoundingClientRect","width","height","parent","closest","offsetParent","offset","offsetWidth","offsetHeight","mutate","style","setProperty","name","easing","alternate","keyframes","translate","timing","iterationStart","composite","_"],"sources":["../../../../src/library/ongoing/DVD.ts"],"sourcesContent":["import type { TimeAnimationOptions, DomApi } from '../../types';\nimport { getElementOffset } from '../../utils';\n\nconst RATIO_DAMPING_FACTOR = 0.5;\n\nexport function web(options: TimeAnimationOptions, dom?: DomApi) {\n  const duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const [dvdX, dvdY] = getNames(options);\n\n  let left = 0;\n  let top = 0;\n  let parentWidth = 0;\n  let parentHeight = 0;\n  let ratio = (16 / 9) * RATIO_DAMPING_FACTOR;\n\n  if (dom) {\n    dom.measure((target) => {\n      if (!target) {\n        return;\n      }\n\n      const rect = target.getBoundingClientRect();\n      const { width, height } = rect;\n\n      const parent = (target.closest('[data-block-level-container]') ||\n        target.offsetParent) as HTMLElement;\n      const offset = getElementOffset(target, parent);\n      left = offset.left;\n      top = offset.top;\n\n      parentWidth = parent?.offsetWidth || 0;\n      parentHeight = parent?.offsetHeight || 0;\n\n      ratio = (parentWidth / parentHeight) * RATIO_DAMPING_FACTOR;\n\n      dom.mutate(() => {\n        target.style.setProperty('--motion-left', `${left}px`);\n        target.style.setProperty('--motion-top', `${top}px`);\n        target.style.setProperty('--motion-width', `${width}px`);\n        target.style.setProperty('--motion-height', `${height}px`);\n        target.style.setProperty('--motion-parent-width', `${parentWidth}px`);\n        target.style.setProperty('--motion-parent-height', `${parentHeight}px`);\n      });\n    });\n  }\n\n  return [\n    {\n      ...options,\n      name: dvdX,\n      easing: 'linear',\n      delay,\n      duration: duration / ratio,\n      alternate: true,\n      keyframes: [\n        {\n          translate: 'calc(-1 * var(--motion-left, 0px))',\n        },\n        {\n          translate:\n            'calc(var(--motion-parent-width, 100vw) - var(--motion-left, 0px) - var(--motion-width, 100%))',\n        },\n      ],\n      get timing() {\n        return {\n          iterationStart: left && parentWidth ? left / parentWidth : 0,\n        };\n      },\n    },\n    {\n      ...options,\n      name: dvdY,\n      easing: 'linear',\n      delay,\n      duration: duration * ratio,\n      alternate: true,\n      composite: 'add' as const,\n      keyframes: [\n        {\n          translate: '0 calc(-1 * var(--motion-top, 0px))',\n        },\n        {\n          translate:\n            '0 calc(var(--motion-parent-height, 100vh) - var(--motion-top, 0px) - var(--motion-height, 100%))',\n        },\n      ],\n      get timing() {\n        return {\n          iterationStart: top && parentHeight ? top / parentHeight : 0,\n        };\n      },\n    },\n  ];\n}\n\nexport function getNames(_: TimeAnimationOptions) {\n  return ['motion-dvd-x', 'motion-dvd-y'];\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/library/ongoing/Flash.js

@@ -0,0 +1,42 @@
+import { getEasing, getTimingFactor } from '../../utils';
+export function web(options, _dom) {
+  return style(options, true);
+}
+export function style(options, _asWeb) {
+  if (_asWeb === void 0) {
+    _asWeb = false;
+  }
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const easing = getEasing(options.easing || 'cubicInOut');
+  const timingFactor = getTimingFactor(duration, delay);
+  const [name] = getNames(options);
+  const keyframes = [{
+    offset: 0,
+    opacity: 1,
+    easing
+  }, {
+    offset: 0.5 * timingFactor,
+    opacity: 0,
+    easing
+  }, {
+    offset: timingFactor,
+    opacity: 1
+  }, {
+    offset: 1,
+    opacity: 1
+  }];
+  return [{
+    ...options,
+    name,
+    easing: 'linear',
+    delay: 0,
+    duration: duration + delay,
+    keyframes
+  }];
+}
+export function getNames(options) {
+  const timingFactor = getTimingFactor(options.duration, options.delay, true);
+  return [`motion-flash-${timingFactor}`];
+}
+//# sourceMappingURL=Flash.js.map

package/dist/esm/library/ongoing/Flash.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getEasing","getTimingFactor","web","options","_dom","style","_asWeb","duration","delay","easing","timingFactor","name","getNames","keyframes","offset","opacity"],"sources":["../../../../src/library/ongoing/Flash.ts"],"sourcesContent":["import type {\n  TimeAnimationOptions,\n  DomApi,\n  AnimationExtraOptions,\n} from '../../types';\nimport { getEasing, getTimingFactor } from '../../utils';\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 duration = options.duration || 1;\n  const delay = options.delay || 0;\n  const easing = getEasing(options.easing || 'cubicInOut');\n  const timingFactor = getTimingFactor(duration, delay) as number;\n  const [name] = getNames(options);\n\n  const keyframes = [\n    {\n      offset: 0,\n      opacity: 1,\n      easing,\n    },\n    {\n      offset: 0.5 * timingFactor,\n      opacity: 0,\n      easing,\n    },\n    {\n      offset: timingFactor,\n      opacity: 1,\n    },\n    {\n      offset: 1,\n      opacity: 1,\n    },\n  ];\n\n  return [\n    {\n      ...options,\n      name,\n      easing: 'linear',\n      delay: 0,\n      duration: duration + delay,\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-flash-${timingFactor}`];\n}\n"],"mappings":"AAKA,SAASA,SAAS,EAAEC,eAAe,QAAQ,aAAa;AAExD,OAAO,SAASC,GAAGA,CACjBC,OAAqD,EACrDC,IAAa,EACb;EACA,OAAOC,KAAK,CAACF,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEA,OAAO,SAASE,KAAKA,CACnBF,OAAqD,EACrDG,MAAM,EACN;EAAA,IADAA,MAAM;IAANA,MAAM,GAAG,KAAK;EAAA;EAEd,MAAMC,QAAQ,GAAGJ,OAAO,CAACI,QAAQ,IAAI,CAAC;EACtC,MAAMC,KAAK,GAAGL,OAAO,CAACK,KAAK,IAAI,CAAC;EAChC,MAAMC,MAAM,GAAGT,SAAS,CAACG,OAAO,CAACM,MAAM,IAAI,YAAY,CAAC;EACxD,MAAMC,YAAY,GAAGT,eAAe,CAACM,QAAQ,EAAEC,KAAK,CAAW;EAC/D,MAAM,CAACG,IAAI,CAAC,GAAGC,QAAQ,CAACT,OAAO,CAAC;EAEhC,MAAMU,SAAS,GAAG,CAChB;IACEC,MAAM,EAAE,CAAC;IACTC,OAAO,EAAE,CAAC;IACVN;EACF,CAAC,EACD;IACEK,MAAM,EAAE,GAAG,GAAGJ,YAAY;IAC1BK,OAAO,EAAE,CAAC;IACVN;EACF,CAAC,EACD;IACEK,MAAM,EAAEJ,YAAY;IACpBK,OAAO,EAAE;EACX,CAAC,EACD;IACED,MAAM,EAAE,CAAC;IACTC,OAAO,EAAE;EACX,CAAC,CACF;EAED,OAAO,CACL;IACE,GAAGZ,OAAO;IACVQ,IAAI;IACJF,MAAM,EAAE,QAAQ;IAChBD,KAAK,EAAE,CAAC;IACRD,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BK;EACF,CAAC,CACF;AACH;AAEA,OAAO,SAASD,QAAQA,CACtBT,OAAqD,EACrD;EACA,MAAMO,YAAY,GAAGT,eAAe,CAACE,OAAO,CAACI,QAAQ,EAAGJ,OAAO,CAACK,KAAK,EAAG,IAAI,CAAC;EAE7E,OAAO,CAAC,gBAAgBE,YAAY,EAAE,CAAC;AACzC","ignoreList":[]}

package/dist/esm/library/ongoing/Flip.js

@@ -0,0 +1,64 @@
+import { getEasing, getTimingFactor, toKeyframeValue } from '../../utils';
+const POWER_EASING_MAP = {
+  soft: 'linear',
+  medium: 'quintInOut',
+  hard: 'backOut'
+};
+const DIRECTION_MAP = {
+  vertical: {
+    x: '1',
+    y: '0'
+  },
+  horizontal: {
+    x: '0',
+    y: '1'
+  }
+};
+export function web(options, _dom) {
+  return style(options, true);
+}
+export function style(options, asWeb) {
+  if (asWeb === void 0) {
+    asWeb = false;
+  }
+  const {
+    direction = 'horizontal',
+    power
+  } = options.namedEffect;
+  const duration = options.duration || 1;
+  const delay = options.delay || 0;
+  const offset = getTimingFactor(duration, delay);
+  const [name] = getNames(options);
+  const rotationAxes = DIRECTION_MAP[direction];
+  const easing = power && POWER_EASING_MAP[power] || options.easing || 'linear';
+  const custom = {
+    '--motion-rotate-x': rotationAxes.x,
+    '--motion-rotate-y': rotationAxes.y
+  };
+  const rotateStart = `rotate3d(${toKeyframeValue(custom, '--motion-rotate-x', asWeb)}, ${toKeyframeValue(custom, '--motion-rotate-y', asWeb)}, 0, 0deg)`;
+  const rotateEnd = `rotate3d(${toKeyframeValue(custom, '--motion-rotate-x', asWeb)}, ${toKeyframeValue(custom, '--motion-rotate-y', asWeb)}, 0, 360deg)`;
+  return [{
+    ...options,
+    name,
+    delay: 0,
+    easing: 'linear',
+    duration: duration + delay,
+    custom,
+    keyframes: [{
+      offset: 0,
+      transform: `perspective(800px) rotateZ(var(--comp-rotate-z, 0deg)) ${rotateStart}`,
+      easing: getEasing(easing)
+    }, {
+      offset,
+      transform: `perspective(800px) rotateZ(var(--comp-rotate-z, 0deg)) ${rotateEnd}`
+    }, {
+      offset: 1,
+      transform: `perspective(800px) rotateZ(var(--comp-rotate-z, 0deg)) ${rotateEnd}`
+    }]
+  }];
+}
+export function getNames(options) {
+  const timingFactor = getTimingFactor(options.duration, options.delay, true);
+  return [`motion-flip-${timingFactor}`];
+}
+//# sourceMappingURL=Flip.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["getEasing","getTimingFactor","toKeyframeValue","POWER_EASING_MAP","soft","medium","hard","DIRECTION_MAP","vertical","x","y","horizontal","web","options","_dom","style","asWeb","direction","power","namedEffect","duration","delay","offset","name","getNames","rotationAxes","easing","custom","rotateStart","rotateEnd","keyframes","transform","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,SAASA,SAAS,EAAEC,eAAe,EAAEC,eAAe,QAAQ,aAAa;AAEzE,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;AAED,OAAO,SAASE,GAAGA,CACjBC,OAAqD,EACrDC,IAAa,EACb;EACA,OAAOC,KAAK,CAACF,OAAO,EAAE,IAAI,CAAC;AAC7B;AAEA,OAAO,SAASE,KAAKA,CACnBF,OAAqD,EACrDG,KAAK,EACL;EAAA,IADAA,KAAK;IAALA,KAAK,GAAG,KAAK;EAAA;EAEb,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,GAAGrB,eAAe,CAACmB,QAAQ,EAAEC,KAAK,CAAW;EACzD,MAAM,CAACE,IAAI,CAAC,GAAGC,QAAQ,CAACX,OAAO,CAAC;EAEhC,MAAMY,YAAY,GAAGlB,aAAa,CAACU,SAAS,CAAC;EAC7C,MAAMS,MAAM,GACTR,KAAK,IAAIf,gBAAgB,CAACe,KAAK,CAAC,IAAKL,OAAO,CAACa,MAAM,IAAI,QAAQ;EAElE,MAAMC,MAAM,GAAG;IACb,mBAAmB,EAAEF,YAAY,CAAChB,CAAC;IACnC,mBAAmB,EAAEgB,YAAY,CAACf;EACpC,CAAC;EAED,MAAMkB,WAAW,GAAG,YAAY1B,eAAe,CAC7CyB,MAAM,EACN,mBAAmB,EACnBX,KACF,CAAC,KAAKd,eAAe,CAACyB,MAAM,EAAE,mBAAmB,EAAEX,KAAK,CAAC,YAAY;EAErE,MAAMa,SAAS,GAAG,YAAY3B,eAAe,CAC3CyB,MAAM,EACN,mBAAmB,EACnBX,KACF,CAAC,KAAKd,eAAe,CAACyB,MAAM,EAAE,mBAAmB,EAAEX,KAAK,CAAC,cAAc;EAEvE,OAAO,CACL;IACE,GAAGH,OAAO;IACVU,IAAI;IACJF,KAAK,EAAE,CAAC;IACRK,MAAM,EAAE,QAAQ;IAChBN,QAAQ,EAAEA,QAAQ,GAAGC,KAAK;IAC1BM,MAAM;IACNG,SAAS,EAAE,CACT;MACER,MAAM,EAAE,CAAC;MACTS,SAAS,EAAE,0DAA0DH,WAAW,EAAE;MAClFF,MAAM,EAAE1B,SAAS,CAAC0B,MAAM;IAC1B,CAAC,EACD;MACEJ,MAAM;MACNS,SAAS,EAAE,0DAA0DF,SAAS;IAChF,CAAC,EACD;MACEP,MAAM,EAAE,CAAC;MACTS,SAAS,EAAE,0DAA0DF,SAAS;IAChF,CAAC;EAEL,CAAC,CACF;AACH;AAEA,OAAO,SAASL,QAAQA,CACtBX,OAAqD,EACrD;EACA,MAAMmB,YAAY,GAAG/B,eAAe,CAACY,OAAO,CAACO,QAAQ,EAAGP,OAAO,CAACQ,KAAK,EAAG,IAAI,CAAC;EAE7E,OAAO,CAAC,eAAeW,YAAY,EAAE,CAAC;AACxC","ignoreList":[]}