How to use the @popmotion/easing.cubicBezier function in @popmotion/easing

To help you get started, we’ve selected a few @popmotion/easing examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Popmotion / popmotion / packages / popmotion-pose / src / factories / pose.ts View on Github external
if (type === 'tween') {
    if (typeof definedEase !== 'function') {
      if (typeof definedEase === 'string') {
        invariant(
          easingLookup[definedEase] !== undefined,
          `Invalid easing type '${definedEase}'. popmotion.io/pose/api/config`
        );

        ease = easingLookup[definedEase];
      } else if (Array.isArray(definedEase) && isCubicBezierArgs(definedEase)) {
        invariant(
          definedEase.length === 4,
          `Cubic bezier arrays must contain four numerical values.`
        );
        const [x1, y1, x2, y2] = definedEase;
        ease = easing.cubicBezier(x1, y1, x2, y2);
      }
    }
  }

  ease = ease || (definedEase as typeof ease);

  const baseProps =
    type !== 'keyframes'
      ? {
        from,
        to,
        velocity,
        ease
      }
      : { ease };