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

applyOverlayStyle,
  diffRect,
  getTransformString,
  cloneElement,
  lerp,
  // constPowerEase
} from './utils';

const resetTranslate = {
  translateX: 0,
  translateY: 0,
  scaleX: 1,
  scaleY: 1,
};

const ease = cubicBezier(0.9, 0.9, 0.37, 0.98);
const easeRev = reversed(ease);
const easeInOut = cubicBezier(0.5, 0.5, 0, 1);

const delaysRatio = 0.1;
const halfClampEnd = clamp(1 - delaysRatio, 1);
const halfClampStart = clamp(0, delaysRatio);
const easeFast = x =>
  easeInOut(interpolate([1 - delaysRatio, 1], [0, 1])(halfClampEnd(x)));
const easeSlow = x =>
  easeInOut(interpolate([0, delaysRatio], [0, 1])(halfClampStart(x)));

export default function({
  from,
  to,
  rectFrom,
  rectTo,

getTransformString,
  cloneElement,
  lerp,
  // constPowerEase
} from './utils';

const resetTranslate = {
  translateX: 0,
  translateY: 0,
  scaleX: 1,
  scaleY: 1,
};

const ease = cubicBezier(0.9, 0.9, 0.37, 0.98);
const easeRev = reversed(ease);
const easeInOut = cubicBezier(0.5, 0.5, 0, 1);

const delaysRatio = 0.1;
const halfClampEnd = clamp(1 - delaysRatio, 1);
const halfClampStart = clamp(0, delaysRatio);
const easeFast = x =>
  easeInOut(interpolate([1 - delaysRatio, 1], [0, 1])(halfClampEnd(x)));
const easeSlow = x =>
  easeInOut(interpolate([0, delaysRatio], [0, 1])(halfClampStart(x)));

export default function({
  from,
  to,
  rectFrom,
  rectTo,
  fromValue = 0,
  initialVelocity,

};
    return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
var wobble_1 = require("wobble");
var popcorn_1 = require("@popmotion/popcorn");
var util_1 = require("./util");
var resetTranslate = {
    translateX: 0,
    translateY: 0,
    scaleX: 1,
    scaleY: 1,
};
var ease = popcorn_1.cubicBezier(0.9, 0.9, 0.37, 0.98);
var easeRev = popcorn_1.reversed(ease);
var easeInOut = popcorn_1.cubicBezier(0.5, 0.5, 0, 1);
var delaysRatio = 0.1;
var halfClampEnd = util_1.clamp(1 - delaysRatio, 1);
var halfClampStart = util_1.clamp(0, delaysRatio);
var easeFast = function (x) {
    return easeInOut(Number(popcorn_1.interpolate([1 - delaysRatio, 1], [0, 1])(halfClampEnd(x))));
};
var easeSlow = function (x) {
    return easeInOut(Number(popcorn_1.interpolate([0, delaysRatio], [0, 1])(halfClampStart(x))));
};
function morphTransition(_a) {
    var from = _a.from, to = _a.to, rectFrom = _a.rectFrom, rectTo = _a.rectTo, _b = _a.fromValue, fromValue = _b === void 0 ? 0 : _b, initialVelocity = _a.initialVelocity, _c = _a.onUpdate, onUpdate = _c === void 0 ? function () { } : _c, _d = _a.onStart, onStart = _d === void 0 ? function () { } : _d, _e = _a.onStop, onStop = _e === void 0 ? function () { } : _e, willBack = _a.willBack, options = _a.options;
    var spring = new wobble_1.Spring(__assign({ fromValue: fromValue,
        initialVelocity: initialVelocity, toValue: 1 }, options.spring));
    var fromDiffStyle = util_1.diffRect(rectFrom, rectTo);
    var toDiffStyle = util_1.diffRect(rectTo, rectFrom);
    var fromContainer = util_1.cloneElement(from, options);

cloneElement,
  lerp,
  clamp,
} from './util';
import { MorphOptions } from './types';

const resetTranslate = {
  translateX: 0,
  translateY: 0,
  scaleX: 1,
  scaleY: 1,
};

const ease = cubicBezier(0.9, 0.9, 0.37, 0.98);
const easeRev = reversed(ease);
const easeInOut = cubicBezier(0.5, 0.5, 0, 1);

const delaysRatio = 0.1;
const halfClampEnd = clamp(1 - delaysRatio, 1);
const halfClampStart = clamp(0, delaysRatio);
const easeFast = (x: number) =>
  easeInOut(
    Number(interpolate([1 - delaysRatio, 1], [0, 1])(halfClampEnd(x))),
  );
const easeSlow = (x: number) =>
  easeInOut(Number(interpolate([0, delaysRatio], [0, 1])(halfClampStart(x))));

type Options = {
  from: HTMLElement;
  to: HTMLElement;
  rectFrom: CSSStyleDeclaration;
  rectTo: CSSStyleDeclaration;

}
        return t;
    };
    return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
var wobble_1 = require("wobble");
var popcorn_1 = require("@popmotion/popcorn");
var util_1 = require("./util");
var resetTranslate = {
    translateX: 0,
    translateY: 0,
    scaleX: 1,
    scaleY: 1,
};
var ease = popcorn_1.cubicBezier(0.9, 0.9, 0.37, 0.98);
var easeRev = popcorn_1.reversed(ease);
var easeInOut = popcorn_1.cubicBezier(0.5, 0.5, 0, 1);
var delaysRatio = 0.1;
var halfClampEnd = util_1.clamp(1 - delaysRatio, 1);
var halfClampStart = util_1.clamp(0, delaysRatio);
var easeFast = function (x) {
    return easeInOut(Number(popcorn_1.interpolate([1 - delaysRatio, 1], [0, 1])(halfClampEnd(x))));
};
var easeSlow = function (x) {
    return easeInOut(Number(popcorn_1.interpolate([0, delaysRatio], [0, 1])(halfClampStart(x))));
};
function morphTransition(_a) {
    var from = _a.from, to = _a.to, rectFrom = _a.rectFrom, rectTo = _a.rectTo, _b = _a.fromValue, fromValue = _b === void 0 ? 0 : _b, initialVelocity = _a.initialVelocity, _c = _a.onUpdate, onUpdate = _c === void 0 ? function () { } : _c, _d = _a.onStart, onStart = _d === void 0 ? function () { } : _d, _e = _a.onStop, onStop = _e === void 0 ? function () { } : _e, willBack = _a.willBack, options = _a.options;
    var spring = new wobble_1.Spring(__assign({ fromValue: fromValue,
        initialVelocity: initialVelocity, toValue: 1 }, options.spring));
    var fromDiffStyle = util_1.diffRect(rectFrom, rectTo);

diffRect,
  getTransformString,
  cloneElement,
  lerp,
  clamp,
} from './util';
import { MorphOptions } from './types';

const resetTranslate = {
  translateX: 0,
  translateY: 0,
  scaleX: 1,
  scaleY: 1,
};

const ease = cubicBezier(0.9, 0.9, 0.37, 0.98);
const easeRev = reversed(ease);
const easeInOut = cubicBezier(0.5, 0.5, 0, 1);

const delaysRatio = 0.1;
const halfClampEnd = clamp(1 - delaysRatio, 1);
const halfClampStart = clamp(0, delaysRatio);
const easeFast = (x: number) =>
  easeInOut(
    Number(interpolate([1 - delaysRatio, 1], [0, 1])(halfClampEnd(x))),
  );
const easeSlow = (x: number) =>
  easeInOut(Number(interpolate([0, delaysRatio], [0, 1])(halfClampStart(x))));

type Options = {
  from: HTMLElement;
  to: HTMLElement;