You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
5225 lines
160 KiB
5225 lines
160 KiB
(self["webpackChunk"] = self["webpackChunk"] || []).push([[78524],{
|
|
|
|
/***/ 46142:
|
|
/*!*********************************************************************************!*\
|
|
!*** ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/construct.js ***!
|
|
\*********************************************************************************/
|
|
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
|
|
|
var setPrototypeOf = __webpack_require__(/*! ./setPrototypeOf.js */ 35745);
|
|
var isNativeReflectConstruct = __webpack_require__(/*! ./isNativeReflectConstruct.js */ 74716);
|
|
function _construct(Parent, args, Class) {
|
|
if (isNativeReflectConstruct()) {
|
|
module.exports = _construct = Reflect.construct.bind(), module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
} else {
|
|
module.exports = _construct = function _construct(Parent, args, Class) {
|
|
var a = [null];
|
|
a.push.apply(a, args);
|
|
var Constructor = Function.bind.apply(Parent, a);
|
|
var instance = new Constructor();
|
|
if (Class) setPrototypeOf(instance, Class.prototype);
|
|
return instance;
|
|
}, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
}
|
|
return _construct.apply(null, arguments);
|
|
}
|
|
module.exports = _construct, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
/***/ }),
|
|
|
|
/***/ 4811:
|
|
/*!***************************************************************************!*\
|
|
!*** ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/get.js ***!
|
|
\***************************************************************************/
|
|
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
|
|
|
var superPropBase = __webpack_require__(/*! ./superPropBase.js */ 22652);
|
|
function _get() {
|
|
if (typeof Reflect !== "undefined" && Reflect.get) {
|
|
module.exports = _get = Reflect.get.bind(), module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
} else {
|
|
module.exports = _get = function _get(target, property, receiver) {
|
|
var base = superPropBase(target, property);
|
|
if (!base) return;
|
|
var desc = Object.getOwnPropertyDescriptor(base, property);
|
|
if (desc.get) {
|
|
return desc.get.call(arguments.length < 3 ? target : receiver);
|
|
}
|
|
return desc.value;
|
|
}, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
}
|
|
return _get.apply(this, arguments);
|
|
}
|
|
module.exports = _get, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
/***/ }),
|
|
|
|
/***/ 92866:
|
|
/*!****************************************************************************************!*\
|
|
!*** ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/isNativeFunction.js ***!
|
|
\****************************************************************************************/
|
|
/***/ (function(module) {
|
|
|
|
function _isNativeFunction(fn) {
|
|
try {
|
|
return Function.toString.call(fn).indexOf("[native code]") !== -1;
|
|
} catch (e) {
|
|
return typeof fn === "function";
|
|
}
|
|
}
|
|
module.exports = _isNativeFunction, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
/***/ }),
|
|
|
|
/***/ 22652:
|
|
/*!*************************************************************************************!*\
|
|
!*** ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/superPropBase.js ***!
|
|
\*************************************************************************************/
|
|
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
|
|
|
var getPrototypeOf = __webpack_require__(/*! ./getPrototypeOf.js */ 34577);
|
|
function _superPropBase(object, property) {
|
|
while (!Object.prototype.hasOwnProperty.call(object, property)) {
|
|
object = getPrototypeOf(object);
|
|
if (object === null) break;
|
|
}
|
|
return object;
|
|
}
|
|
module.exports = _superPropBase, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
/***/ }),
|
|
|
|
/***/ 9464:
|
|
/*!***************************************************************************************!*\
|
|
!*** ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/wrapNativeSuper.js ***!
|
|
\***************************************************************************************/
|
|
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
|
|
|
var getPrototypeOf = __webpack_require__(/*! ./getPrototypeOf.js */ 34577);
|
|
var setPrototypeOf = __webpack_require__(/*! ./setPrototypeOf.js */ 35745);
|
|
var isNativeFunction = __webpack_require__(/*! ./isNativeFunction.js */ 92866);
|
|
var construct = __webpack_require__(/*! ./construct.js */ 46142);
|
|
function _wrapNativeSuper(Class) {
|
|
var _cache = typeof Map === "function" ? new Map() : undefined;
|
|
module.exports = _wrapNativeSuper = function _wrapNativeSuper(Class) {
|
|
if (Class === null || !isNativeFunction(Class)) return Class;
|
|
if (typeof Class !== "function") {
|
|
throw new TypeError("Super expression must either be null or a function");
|
|
}
|
|
if (typeof _cache !== "undefined") {
|
|
if (_cache.has(Class)) return _cache.get(Class);
|
|
_cache.set(Class, Wrapper);
|
|
}
|
|
function Wrapper() {
|
|
return construct(Class, arguments, getPrototypeOf(this).constructor);
|
|
}
|
|
Wrapper.prototype = Object.create(Class.prototype, {
|
|
constructor: {
|
|
value: Wrapper,
|
|
enumerable: false,
|
|
writable: true,
|
|
configurable: true
|
|
}
|
|
});
|
|
return setPrototypeOf(Wrapper, Class);
|
|
}, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
return _wrapNativeSuper(Class);
|
|
}
|
|
module.exports = _wrapNativeSuper, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
/***/ }),
|
|
|
|
/***/ 78524:
|
|
/*!**************************************************************************************************************!*\
|
|
!*** ./node_modules/_@react-spring_web@9.7.5@@react-spring/web/dist/react-spring_web.modern.mjs + 4 modules ***!
|
|
\**************************************************************************************************************/
|
|
/***/ (function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
|
|
|
|
"use strict";
|
|
|
|
// EXPORTS
|
|
__webpack_require__.d(__webpack_exports__, {
|
|
q: function() { return /* binding */ animated; },
|
|
q_: function() { return /* reexport */ useSpring; },
|
|
Yz: function() { return /* reexport */ useTransition; }
|
|
});
|
|
|
|
// UNUSED EXPORTS: Any, BailSignal, Controller, FrameValue, Globals, Interpolation, Spring, SpringContext, SpringRef, SpringValue, Trail, Transition, a, config, createInterpolator, easings, inferTo, interpolate, to, update, useChain, useInView, useIsomorphicLayoutEffect, useReducedMotion, useResize, useScroll, useSpringRef, useSpringValue, useSprings, useTrail
|
|
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/slicedToArray.js
|
|
var slicedToArray = __webpack_require__(79800);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/createClass.js
|
|
var createClass = __webpack_require__(29186);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/classCallCheck.js
|
|
var classCallCheck = __webpack_require__(82100);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/inherits.js
|
|
var inherits = __webpack_require__(80619);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/createSuper.js
|
|
var createSuper = __webpack_require__(47074);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/objectWithoutProperties.js
|
|
var objectWithoutProperties = __webpack_require__(39647);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/assertThisInitialized.js
|
|
var assertThisInitialized = __webpack_require__(13720);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/toConsumableArray.js
|
|
var toConsumableArray = __webpack_require__(37205);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/objectDestructuringEmpty.js
|
|
var objectDestructuringEmpty = __webpack_require__(70236);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/get.js
|
|
var get = __webpack_require__(4811);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/getPrototypeOf.js
|
|
var getPrototypeOf = __webpack_require__(34577);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/wrapNativeSuper.js
|
|
var wrapNativeSuper = __webpack_require__(9464);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/regeneratorRuntime.js
|
|
var regeneratorRuntime = __webpack_require__(7557);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/asyncToGenerator.js
|
|
var asyncToGenerator = __webpack_require__(41498);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/objectSpread2.js
|
|
var objectSpread2 = __webpack_require__(82242);
|
|
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.6@@babel/runtime/helpers/createForOfIteratorHelper.js
|
|
var createForOfIteratorHelper = __webpack_require__(91232);
|
|
;// CONCATENATED MODULE: ./node_modules/_@react-spring_rafz@9.7.5@@react-spring/rafz/dist/react-spring_rafz.modern.mjs
|
|
|
|
// src/index.ts
|
|
var updateQueue = makeQueue();
|
|
var raf = function raf(fn) {
|
|
return schedule(fn, updateQueue);
|
|
};
|
|
var writeQueue = makeQueue();
|
|
raf.write = function (fn) {
|
|
return schedule(fn, writeQueue);
|
|
};
|
|
var onStartQueue = makeQueue();
|
|
raf.onStart = function (fn) {
|
|
return schedule(fn, onStartQueue);
|
|
};
|
|
var onFrameQueue = makeQueue();
|
|
raf.onFrame = function (fn) {
|
|
return schedule(fn, onFrameQueue);
|
|
};
|
|
var onFinishQueue = makeQueue();
|
|
raf.onFinish = function (fn) {
|
|
return schedule(fn, onFinishQueue);
|
|
};
|
|
var timeouts = [];
|
|
raf.setTimeout = function (handler, ms) {
|
|
var time = raf.now() + ms;
|
|
var cancel = function cancel() {
|
|
var i = timeouts.findIndex(function (t) {
|
|
return t.cancel == cancel;
|
|
});
|
|
if (~i) timeouts.splice(i, 1);
|
|
pendingCount -= ~i ? 1 : 0;
|
|
};
|
|
var timeout = {
|
|
time: time,
|
|
handler: handler,
|
|
cancel: cancel
|
|
};
|
|
timeouts.splice(findTimeout(time), 0, timeout);
|
|
pendingCount += 1;
|
|
start();
|
|
return timeout;
|
|
};
|
|
var findTimeout = function findTimeout(time) {
|
|
return ~(~timeouts.findIndex(function (t) {
|
|
return t.time > time;
|
|
}) || ~timeouts.length);
|
|
};
|
|
raf.cancel = function (fn) {
|
|
onStartQueue["delete"](fn);
|
|
onFrameQueue["delete"](fn);
|
|
onFinishQueue["delete"](fn);
|
|
updateQueue["delete"](fn);
|
|
writeQueue["delete"](fn);
|
|
};
|
|
raf.sync = function (fn) {
|
|
sync = true;
|
|
raf.batchedUpdates(fn);
|
|
sync = false;
|
|
};
|
|
raf.throttle = function (fn) {
|
|
var lastArgs;
|
|
function queuedFn() {
|
|
try {
|
|
fn.apply(void 0, toConsumableArray(lastArgs));
|
|
} finally {
|
|
lastArgs = null;
|
|
}
|
|
}
|
|
function throttled() {
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
lastArgs = args;
|
|
raf.onStart(queuedFn);
|
|
}
|
|
throttled.handler = fn;
|
|
throttled.cancel = function () {
|
|
onStartQueue["delete"](queuedFn);
|
|
lastArgs = null;
|
|
};
|
|
return throttled;
|
|
};
|
|
var nativeRaf = typeof window != "undefined" ? window.requestAnimationFrame :
|
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
function () {};
|
|
raf.use = function (impl) {
|
|
return nativeRaf = impl;
|
|
};
|
|
raf.now = typeof performance != "undefined" ? function () {
|
|
return performance.now();
|
|
} : Date.now;
|
|
raf.batchedUpdates = function (fn) {
|
|
return fn();
|
|
};
|
|
raf["catch"] = console.error;
|
|
raf.frameLoop = "always";
|
|
raf.advance = function () {
|
|
if (raf.frameLoop !== "demand") {
|
|
console.warn("Cannot call the manual advancement of rafz whilst frameLoop is not set as demand");
|
|
} else {
|
|
update();
|
|
}
|
|
};
|
|
var ts = -1;
|
|
var pendingCount = 0;
|
|
var sync = false;
|
|
function schedule(fn, queue) {
|
|
if (sync) {
|
|
queue["delete"](fn);
|
|
fn(0);
|
|
} else {
|
|
queue.add(fn);
|
|
start();
|
|
}
|
|
}
|
|
function start() {
|
|
if (ts < 0) {
|
|
ts = 0;
|
|
if (raf.frameLoop !== "demand") {
|
|
nativeRaf(loop);
|
|
}
|
|
}
|
|
}
|
|
function stop() {
|
|
ts = -1;
|
|
}
|
|
function loop() {
|
|
if (~ts) {
|
|
nativeRaf(loop);
|
|
raf.batchedUpdates(update);
|
|
}
|
|
}
|
|
function update() {
|
|
var prevTs = ts;
|
|
ts = raf.now();
|
|
var count = findTimeout(ts);
|
|
if (count) {
|
|
eachSafely(timeouts.splice(0, count), function (t) {
|
|
return t.handler();
|
|
});
|
|
pendingCount -= count;
|
|
}
|
|
if (!pendingCount) {
|
|
stop();
|
|
return;
|
|
}
|
|
onStartQueue.flush();
|
|
updateQueue.flush(prevTs ? Math.min(64, ts - prevTs) : 16.667);
|
|
onFrameQueue.flush();
|
|
writeQueue.flush();
|
|
onFinishQueue.flush();
|
|
}
|
|
function makeQueue() {
|
|
var next = /* @__PURE__ */new Set();
|
|
var current = next;
|
|
return {
|
|
add: function add(fn) {
|
|
pendingCount += current == next && !next.has(fn) ? 1 : 0;
|
|
next.add(fn);
|
|
},
|
|
"delete": function _delete(fn) {
|
|
pendingCount -= current == next && next.has(fn) ? 1 : 0;
|
|
return next["delete"](fn);
|
|
},
|
|
flush: function flush(arg) {
|
|
if (current.size) {
|
|
next = /* @__PURE__ */new Set();
|
|
pendingCount -= current.size;
|
|
eachSafely(current, function (fn) {
|
|
return fn(arg) && next.add(fn);
|
|
});
|
|
pendingCount += next.size;
|
|
current = next;
|
|
}
|
|
}
|
|
};
|
|
}
|
|
function eachSafely(values, each) {
|
|
values.forEach(function (value) {
|
|
try {
|
|
each(value);
|
|
} catch (e) {
|
|
raf["catch"](e);
|
|
}
|
|
});
|
|
}
|
|
var __raf = {
|
|
/** The number of pending tasks */count: function count() {
|
|
return pendingCount;
|
|
},
|
|
/** Whether there's a raf update loop running */isRunning: function isRunning() {
|
|
return ts >= 0;
|
|
},
|
|
/** Clear internal state. Never call from update loop! */clear: function clear() {
|
|
ts = -1;
|
|
timeouts = [];
|
|
onStartQueue = makeQueue();
|
|
updateQueue = makeQueue();
|
|
onFrameQueue = makeQueue();
|
|
writeQueue = makeQueue();
|
|
onFinishQueue = makeQueue();
|
|
pendingCount = 0;
|
|
}
|
|
};
|
|
|
|
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
|
var _react_17_0_2_react = __webpack_require__(59301);
|
|
;// CONCATENATED MODULE: ./node_modules/_@react-spring_shared@9.7.5@@react-spring/shared/dist/react-spring_shared.modern.mjs
|
|
|
|
|
|
|
|
|
|
var __defProp = Object.defineProperty;
|
|
var __export = function __export(target, all) {
|
|
for (var name in all) __defProp(target, name, {
|
|
get: all[name],
|
|
enumerable: true
|
|
});
|
|
};
|
|
|
|
// src/globals.ts
|
|
var globals_exports = {};
|
|
__export(globals_exports, {
|
|
assign: function assign() {
|
|
return _assign;
|
|
},
|
|
colors: function colors() {
|
|
return _colors;
|
|
},
|
|
createStringInterpolator: function createStringInterpolator() {
|
|
return _createStringInterpolator;
|
|
},
|
|
skipAnimation: function skipAnimation() {
|
|
return _skipAnimation;
|
|
},
|
|
to: function to() {
|
|
return _to;
|
|
},
|
|
willAdvance: function willAdvance() {
|
|
return _willAdvance;
|
|
}
|
|
});
|
|
|
|
|
|
// src/helpers.ts
|
|
function noop() {}
|
|
var defineHidden = function defineHidden(obj, key, value) {
|
|
return Object.defineProperty(obj, key, {
|
|
value: value,
|
|
writable: true,
|
|
configurable: true
|
|
});
|
|
};
|
|
var is = {
|
|
arr: Array.isArray,
|
|
obj: function obj(a) {
|
|
return !!a && a.constructor.name === "Object";
|
|
},
|
|
fun: function fun(a) {
|
|
return typeof a === "function";
|
|
},
|
|
str: function str(a) {
|
|
return typeof a === "string";
|
|
},
|
|
num: function num(a) {
|
|
return typeof a === "number";
|
|
},
|
|
und: function und(a) {
|
|
return a === void 0;
|
|
}
|
|
};
|
|
function isEqual(a, b) {
|
|
if (is.arr(a)) {
|
|
if (!is.arr(b) || a.length !== b.length) return false;
|
|
for (var i = 0; i < a.length; i++) {
|
|
if (a[i] !== b[i]) return false;
|
|
}
|
|
return true;
|
|
}
|
|
return a === b;
|
|
}
|
|
var react_spring_shared_modern_each = function each(obj, fn) {
|
|
return obj.forEach(fn);
|
|
};
|
|
function eachProp(obj, fn, ctx) {
|
|
if (is.arr(obj)) {
|
|
for (var i = 0; i < obj.length; i++) {
|
|
fn.call(ctx, obj[i], "".concat(i));
|
|
}
|
|
return;
|
|
}
|
|
for (var key in obj) {
|
|
if (obj.hasOwnProperty(key)) {
|
|
fn.call(ctx, obj[key], key);
|
|
}
|
|
}
|
|
}
|
|
var toArray = function toArray(a) {
|
|
return is.und(a) ? [] : is.arr(a) ? a : [a];
|
|
};
|
|
function flush(queue, iterator) {
|
|
if (queue.size) {
|
|
var items = Array.from(queue);
|
|
queue.clear();
|
|
react_spring_shared_modern_each(items, iterator);
|
|
}
|
|
}
|
|
var flushCalls = function flushCalls(queue) {
|
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
args[_key - 1] = arguments[_key];
|
|
}
|
|
return flush(queue, function (fn) {
|
|
return fn.apply(void 0, args);
|
|
});
|
|
};
|
|
var isSSR = function isSSR() {
|
|
return typeof window === "undefined" || !window.navigator || /ServerSideRendering|^Deno\//.test(window.navigator.userAgent);
|
|
};
|
|
|
|
// src/globals.ts
|
|
var _createStringInterpolator;
|
|
var _to;
|
|
var _colors = null;
|
|
var _skipAnimation = false;
|
|
var _willAdvance = noop;
|
|
var _assign = function _assign(globals) {
|
|
if (globals.to) _to = globals.to;
|
|
if (globals.now) raf.now = globals.now;
|
|
if (globals.colors !== void 0) _colors = globals.colors;
|
|
if (globals.skipAnimation != null) _skipAnimation = globals.skipAnimation;
|
|
if (globals.createStringInterpolator) _createStringInterpolator = globals.createStringInterpolator;
|
|
if (globals.requestAnimationFrame) raf.use(globals.requestAnimationFrame);
|
|
if (globals.batchedUpdates) raf.batchedUpdates = globals.batchedUpdates;
|
|
if (globals.willAdvance) _willAdvance = globals.willAdvance;
|
|
if (globals.frameLoop) raf.frameLoop = globals.frameLoop;
|
|
};
|
|
|
|
// src/FrameLoop.ts
|
|
|
|
var startQueue = /* @__PURE__ */new Set();
|
|
var currentFrame = [];
|
|
var prevFrame = [];
|
|
var priority = 0;
|
|
var frameLoop = {
|
|
get idle() {
|
|
return !startQueue.size && !currentFrame.length;
|
|
},
|
|
/** Advance the given animation on every frame until idle. */start: function start(animation) {
|
|
if (priority > animation.priority) {
|
|
startQueue.add(animation);
|
|
raf.onStart(flushStartQueue);
|
|
} else {
|
|
startSafely(animation);
|
|
raf(advance);
|
|
}
|
|
},
|
|
/** Advance all animations by the given time. */
|
|
advance: advance,
|
|
/** Call this when an animation's priority changes. */sort: function sort(animation) {
|
|
if (priority) {
|
|
raf.onFrame(function () {
|
|
return frameLoop.sort(animation);
|
|
});
|
|
} else {
|
|
var prevIndex = currentFrame.indexOf(animation);
|
|
if (~prevIndex) {
|
|
currentFrame.splice(prevIndex, 1);
|
|
startUnsafely(animation);
|
|
}
|
|
}
|
|
},
|
|
/**
|
|
* Clear all animations. For testing purposes.
|
|
*
|
|
* ☠️ Never call this from within the frameloop.
|
|
*/
|
|
clear: function clear() {
|
|
currentFrame = [];
|
|
startQueue.clear();
|
|
}
|
|
};
|
|
function flushStartQueue() {
|
|
startQueue.forEach(startSafely);
|
|
startQueue.clear();
|
|
raf(advance);
|
|
}
|
|
function startSafely(animation) {
|
|
if (!currentFrame.includes(animation)) startUnsafely(animation);
|
|
}
|
|
function startUnsafely(animation) {
|
|
currentFrame.splice(findIndex(currentFrame, function (other) {
|
|
return other.priority > animation.priority;
|
|
}), 0, animation);
|
|
}
|
|
function advance(dt) {
|
|
var nextFrame = prevFrame;
|
|
for (var i = 0; i < currentFrame.length; i++) {
|
|
var animation = currentFrame[i];
|
|
priority = animation.priority;
|
|
if (!animation.idle) {
|
|
_willAdvance(animation);
|
|
animation.advance(dt);
|
|
if (!animation.idle) {
|
|
nextFrame.push(animation);
|
|
}
|
|
}
|
|
}
|
|
priority = 0;
|
|
prevFrame = currentFrame;
|
|
prevFrame.length = 0;
|
|
currentFrame = nextFrame;
|
|
return currentFrame.length > 0;
|
|
}
|
|
function findIndex(arr, test) {
|
|
var index = arr.findIndex(test);
|
|
return index < 0 ? arr.length : index;
|
|
}
|
|
|
|
// src/clamp.ts
|
|
var clamp = function clamp(min, max, v) {
|
|
return Math.min(Math.max(v, min), max);
|
|
};
|
|
|
|
// src/colors.ts
|
|
var colors2 = {
|
|
transparent: 0,
|
|
aliceblue: 4042850303,
|
|
antiquewhite: 4209760255,
|
|
aqua: 16777215,
|
|
aquamarine: 2147472639,
|
|
azure: 4043309055,
|
|
beige: 4126530815,
|
|
bisque: 4293182719,
|
|
black: 255,
|
|
blanchedalmond: 4293643775,
|
|
blue: 65535,
|
|
blueviolet: 2318131967,
|
|
brown: 2771004159,
|
|
burlywood: 3736635391,
|
|
burntsienna: 3934150143,
|
|
cadetblue: 1604231423,
|
|
chartreuse: 2147418367,
|
|
chocolate: 3530104575,
|
|
coral: 4286533887,
|
|
cornflowerblue: 1687547391,
|
|
cornsilk: 4294499583,
|
|
crimson: 3692313855,
|
|
cyan: 16777215,
|
|
darkblue: 35839,
|
|
darkcyan: 9145343,
|
|
darkgoldenrod: 3095792639,
|
|
darkgray: 2846468607,
|
|
darkgreen: 6553855,
|
|
darkgrey: 2846468607,
|
|
darkkhaki: 3182914559,
|
|
darkmagenta: 2332068863,
|
|
darkolivegreen: 1433087999,
|
|
darkorange: 4287365375,
|
|
darkorchid: 2570243327,
|
|
darkred: 2332033279,
|
|
darksalmon: 3918953215,
|
|
darkseagreen: 2411499519,
|
|
darkslateblue: 1211993087,
|
|
darkslategray: 793726975,
|
|
darkslategrey: 793726975,
|
|
darkturquoise: 13554175,
|
|
darkviolet: 2483082239,
|
|
deeppink: 4279538687,
|
|
deepskyblue: 12582911,
|
|
dimgray: 1768516095,
|
|
dimgrey: 1768516095,
|
|
dodgerblue: 512819199,
|
|
firebrick: 2988581631,
|
|
floralwhite: 4294635775,
|
|
forestgreen: 579543807,
|
|
fuchsia: 4278255615,
|
|
gainsboro: 3705462015,
|
|
ghostwhite: 4177068031,
|
|
gold: 4292280575,
|
|
goldenrod: 3668254975,
|
|
gray: 2155905279,
|
|
green: 8388863,
|
|
greenyellow: 2919182335,
|
|
grey: 2155905279,
|
|
honeydew: 4043305215,
|
|
hotpink: 4285117695,
|
|
indianred: 3445382399,
|
|
indigo: 1258324735,
|
|
ivory: 4294963455,
|
|
khaki: 4041641215,
|
|
lavender: 3873897215,
|
|
lavenderblush: 4293981695,
|
|
lawngreen: 2096890111,
|
|
lemonchiffon: 4294626815,
|
|
lightblue: 2916673279,
|
|
lightcoral: 4034953471,
|
|
lightcyan: 3774873599,
|
|
lightgoldenrodyellow: 4210742015,
|
|
lightgray: 3553874943,
|
|
lightgreen: 2431553791,
|
|
lightgrey: 3553874943,
|
|
lightpink: 4290167295,
|
|
lightsalmon: 4288707327,
|
|
lightseagreen: 548580095,
|
|
lightskyblue: 2278488831,
|
|
lightslategray: 2005441023,
|
|
lightslategrey: 2005441023,
|
|
lightsteelblue: 2965692159,
|
|
lightyellow: 4294959359,
|
|
lime: 16711935,
|
|
limegreen: 852308735,
|
|
linen: 4210091775,
|
|
magenta: 4278255615,
|
|
maroon: 2147483903,
|
|
mediumaquamarine: 1724754687,
|
|
mediumblue: 52735,
|
|
mediumorchid: 3126187007,
|
|
mediumpurple: 2473647103,
|
|
mediumseagreen: 1018393087,
|
|
mediumslateblue: 2070474495,
|
|
mediumspringgreen: 16423679,
|
|
mediumturquoise: 1221709055,
|
|
mediumvioletred: 3340076543,
|
|
midnightblue: 421097727,
|
|
mintcream: 4127193855,
|
|
mistyrose: 4293190143,
|
|
moccasin: 4293178879,
|
|
navajowhite: 4292783615,
|
|
navy: 33023,
|
|
oldlace: 4260751103,
|
|
olive: 2155872511,
|
|
olivedrab: 1804477439,
|
|
orange: 4289003775,
|
|
orangered: 4282712319,
|
|
orchid: 3664828159,
|
|
palegoldenrod: 4008225535,
|
|
palegreen: 2566625535,
|
|
paleturquoise: 2951671551,
|
|
palevioletred: 3681588223,
|
|
papayawhip: 4293907967,
|
|
peachpuff: 4292524543,
|
|
peru: 3448061951,
|
|
pink: 4290825215,
|
|
plum: 3718307327,
|
|
powderblue: 2967529215,
|
|
purple: 2147516671,
|
|
rebeccapurple: 1714657791,
|
|
red: 4278190335,
|
|
rosybrown: 3163525119,
|
|
royalblue: 1097458175,
|
|
saddlebrown: 2336560127,
|
|
salmon: 4202722047,
|
|
sandybrown: 4104413439,
|
|
seagreen: 780883967,
|
|
seashell: 4294307583,
|
|
sienna: 2689740287,
|
|
silver: 3233857791,
|
|
skyblue: 2278484991,
|
|
slateblue: 1784335871,
|
|
slategray: 1887473919,
|
|
slategrey: 1887473919,
|
|
snow: 4294638335,
|
|
springgreen: 16744447,
|
|
steelblue: 1182971135,
|
|
tan: 3535047935,
|
|
teal: 8421631,
|
|
thistle: 3636451583,
|
|
tomato: 4284696575,
|
|
turquoise: 1088475391,
|
|
violet: 4001558271,
|
|
wheat: 4125012991,
|
|
white: 4294967295,
|
|
whitesmoke: 4126537215,
|
|
yellow: 4294902015,
|
|
yellowgreen: 2597139199
|
|
};
|
|
|
|
// src/colorMatchers.ts
|
|
var NUMBER = "[-+]?\\d*\\.?\\d+";
|
|
var PERCENTAGE = NUMBER + "%";
|
|
function call() {
|
|
for (var _len2 = arguments.length, parts = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
parts[_key2] = arguments[_key2];
|
|
}
|
|
return "\\(\\s*(" + parts.join(")\\s*,\\s*(") + ")\\s*\\)";
|
|
}
|
|
var rgb = new RegExp("rgb" + call(NUMBER, NUMBER, NUMBER));
|
|
var rgba = new RegExp("rgba" + call(NUMBER, NUMBER, NUMBER, NUMBER));
|
|
var hsl = new RegExp("hsl" + call(NUMBER, PERCENTAGE, PERCENTAGE));
|
|
var hsla = new RegExp("hsla" + call(NUMBER, PERCENTAGE, PERCENTAGE, NUMBER));
|
|
var hex3 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
|
|
var hex4 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
|
|
var hex6 = /^#([0-9a-fA-F]{6})$/;
|
|
var hex8 = /^#([0-9a-fA-F]{8})$/;
|
|
|
|
// src/normalizeColor.ts
|
|
function normalizeColor(color) {
|
|
var match;
|
|
if (typeof color === "number") {
|
|
return color >>> 0 === color && color >= 0 && color <= 4294967295 ? color : null;
|
|
}
|
|
if (match = hex6.exec(color)) return parseInt(match[1] + "ff", 16) >>> 0;
|
|
if (_colors && _colors[color] !== void 0) {
|
|
return _colors[color];
|
|
}
|
|
if (match = rgb.exec(color)) {
|
|
return (parse255(match[1]) << 24 |
|
|
// r
|
|
parse255(match[2]) << 16 |
|
|
// g
|
|
parse255(match[3]) << 8 |
|
|
// b
|
|
255) >>>
|
|
// a
|
|
0;
|
|
}
|
|
if (match = rgba.exec(color)) {
|
|
return (parse255(match[1]) << 24 |
|
|
// r
|
|
parse255(match[2]) << 16 |
|
|
// g
|
|
parse255(match[3]) << 8 |
|
|
// b
|
|
parse1(match[4])) >>>
|
|
// a
|
|
0;
|
|
}
|
|
if (match = hex3.exec(color)) {
|
|
return parseInt(match[1] + match[1] +
|
|
// r
|
|
match[2] + match[2] +
|
|
// g
|
|
match[3] + match[3] +
|
|
// b
|
|
"ff",
|
|
// a
|
|
16) >>> 0;
|
|
}
|
|
if (match = hex8.exec(color)) return parseInt(match[1], 16) >>> 0;
|
|
if (match = hex4.exec(color)) {
|
|
return parseInt(match[1] + match[1] +
|
|
// r
|
|
match[2] + match[2] +
|
|
// g
|
|
match[3] + match[3] +
|
|
// b
|
|
match[4] + match[4],
|
|
// a
|
|
16) >>> 0;
|
|
}
|
|
if (match = hsl.exec(color)) {
|
|
return (hslToRgb(parse360(match[1]),
|
|
// h
|
|
parsePercentage(match[2]),
|
|
// s
|
|
parsePercentage(match[3])
|
|
// l
|
|
) | 255) >>>
|
|
// a
|
|
0;
|
|
}
|
|
if (match = hsla.exec(color)) {
|
|
return (hslToRgb(parse360(match[1]),
|
|
// h
|
|
parsePercentage(match[2]),
|
|
// s
|
|
parsePercentage(match[3])
|
|
// l
|
|
) | parse1(match[4])) >>>
|
|
// a
|
|
0;
|
|
}
|
|
return null;
|
|
}
|
|
function hue2rgb(p, q, t) {
|
|
if (t < 0) t += 1;
|
|
if (t > 1) t -= 1;
|
|
if (t < 1 / 6) return p + (q - p) * 6 * t;
|
|
if (t < 1 / 2) return q;
|
|
if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
|
|
return p;
|
|
}
|
|
function hslToRgb(h, s, l) {
|
|
var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
var p = 2 * l - q;
|
|
var r = hue2rgb(p, q, h + 1 / 3);
|
|
var g = hue2rgb(p, q, h);
|
|
var b = hue2rgb(p, q, h - 1 / 3);
|
|
return Math.round(r * 255) << 24 | Math.round(g * 255) << 16 | Math.round(b * 255) << 8;
|
|
}
|
|
function parse255(str) {
|
|
var _int = parseInt(str, 10);
|
|
if (_int < 0) return 0;
|
|
if (_int > 255) return 255;
|
|
return _int;
|
|
}
|
|
function parse360(str) {
|
|
var _int2 = parseFloat(str);
|
|
return (_int2 % 360 + 360) % 360 / 360;
|
|
}
|
|
function parse1(str) {
|
|
var num = parseFloat(str);
|
|
if (num < 0) return 0;
|
|
if (num > 1) return 255;
|
|
return Math.round(num * 255);
|
|
}
|
|
function parsePercentage(str) {
|
|
var _int3 = parseFloat(str);
|
|
if (_int3 < 0) return 0;
|
|
if (_int3 > 100) return 1;
|
|
return _int3 / 100;
|
|
}
|
|
|
|
// src/colorToRgba.ts
|
|
function colorToRgba(input) {
|
|
var int32Color = normalizeColor(input);
|
|
if (int32Color === null) return input;
|
|
int32Color = int32Color || 0;
|
|
var r = (int32Color & 4278190080) >>> 24;
|
|
var g = (int32Color & 16711680) >>> 16;
|
|
var b = (int32Color & 65280) >>> 8;
|
|
var a = (int32Color & 255) / 255;
|
|
return "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(a, ")");
|
|
}
|
|
|
|
// src/createInterpolator.ts
|
|
var createInterpolator = function createInterpolator(range, output, extrapolate) {
|
|
if (is.fun(range)) {
|
|
return range;
|
|
}
|
|
if (is.arr(range)) {
|
|
return createInterpolator({
|
|
range: range,
|
|
output: output,
|
|
extrapolate: extrapolate
|
|
});
|
|
}
|
|
if (is.str(range.output[0])) {
|
|
return _createStringInterpolator(range);
|
|
}
|
|
var config = range;
|
|
var outputRange = config.output;
|
|
var inputRange = config.range || [0, 1];
|
|
var extrapolateLeft = config.extrapolateLeft || config.extrapolate || "extend";
|
|
var extrapolateRight = config.extrapolateRight || config.extrapolate || "extend";
|
|
var easing = config.easing || function (t) {
|
|
return t;
|
|
};
|
|
return function (input) {
|
|
var range2 = findRange(input, inputRange);
|
|
return interpolate(input, inputRange[range2], inputRange[range2 + 1], outputRange[range2], outputRange[range2 + 1], easing, extrapolateLeft, extrapolateRight, config.map);
|
|
};
|
|
};
|
|
function interpolate(input, inputMin, inputMax, outputMin, outputMax, easing, extrapolateLeft, extrapolateRight, map) {
|
|
var result = map ? map(input) : input;
|
|
if (result < inputMin) {
|
|
if (extrapolateLeft === "identity") return result;else if (extrapolateLeft === "clamp") result = inputMin;
|
|
}
|
|
if (result > inputMax) {
|
|
if (extrapolateRight === "identity") return result;else if (extrapolateRight === "clamp") result = inputMax;
|
|
}
|
|
if (outputMin === outputMax) return outputMin;
|
|
if (inputMin === inputMax) return input <= inputMin ? outputMin : outputMax;
|
|
if (inputMin === -Infinity) result = -result;else if (inputMax === Infinity) result = result - inputMin;else result = (result - inputMin) / (inputMax - inputMin);
|
|
result = easing(result);
|
|
if (outputMin === -Infinity) result = -result;else if (outputMax === Infinity) result = result + outputMin;else result = result * (outputMax - outputMin) + outputMin;
|
|
return result;
|
|
}
|
|
function findRange(input, inputRange) {
|
|
for (var i = 1; i < inputRange.length - 1; ++i) if (inputRange[i] >= input) break;
|
|
return i - 1;
|
|
}
|
|
|
|
// src/easings.ts
|
|
var steps = function steps(steps2) {
|
|
var direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "end";
|
|
return function (progress2) {
|
|
progress2 = direction === "end" ? Math.min(progress2, 0.999) : Math.max(progress2, 1e-3);
|
|
var expanded = progress2 * steps2;
|
|
var rounded = direction === "end" ? Math.floor(expanded) : Math.ceil(expanded);
|
|
return clamp(0, 1, rounded / steps2);
|
|
};
|
|
};
|
|
var c1 = 1.70158;
|
|
var c2 = c1 * 1.525;
|
|
var c3 = c1 + 1;
|
|
var c4 = 2 * Math.PI / 3;
|
|
var c5 = 2 * Math.PI / 4.5;
|
|
var bounceOut = function bounceOut(x) {
|
|
var n1 = 7.5625;
|
|
var d1 = 2.75;
|
|
if (x < 1 / d1) {
|
|
return n1 * x * x;
|
|
} else if (x < 2 / d1) {
|
|
return n1 * (x -= 1.5 / d1) * x + 0.75;
|
|
} else if (x < 2.5 / d1) {
|
|
return n1 * (x -= 2.25 / d1) * x + 0.9375;
|
|
} else {
|
|
return n1 * (x -= 2.625 / d1) * x + 0.984375;
|
|
}
|
|
};
|
|
var easings = {
|
|
linear: function linear(x) {
|
|
return x;
|
|
},
|
|
easeInQuad: function easeInQuad(x) {
|
|
return x * x;
|
|
},
|
|
easeOutQuad: function easeOutQuad(x) {
|
|
return 1 - (1 - x) * (1 - x);
|
|
},
|
|
easeInOutQuad: function easeInOutQuad(x) {
|
|
return x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2;
|
|
},
|
|
easeInCubic: function easeInCubic(x) {
|
|
return x * x * x;
|
|
},
|
|
easeOutCubic: function easeOutCubic(x) {
|
|
return 1 - Math.pow(1 - x, 3);
|
|
},
|
|
easeInOutCubic: function easeInOutCubic(x) {
|
|
return x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2;
|
|
},
|
|
easeInQuart: function easeInQuart(x) {
|
|
return x * x * x * x;
|
|
},
|
|
easeOutQuart: function easeOutQuart(x) {
|
|
return 1 - Math.pow(1 - x, 4);
|
|
},
|
|
easeInOutQuart: function easeInOutQuart(x) {
|
|
return x < 0.5 ? 8 * x * x * x * x : 1 - Math.pow(-2 * x + 2, 4) / 2;
|
|
},
|
|
easeInQuint: function easeInQuint(x) {
|
|
return x * x * x * x * x;
|
|
},
|
|
easeOutQuint: function easeOutQuint(x) {
|
|
return 1 - Math.pow(1 - x, 5);
|
|
},
|
|
easeInOutQuint: function easeInOutQuint(x) {
|
|
return x < 0.5 ? 16 * x * x * x * x * x : 1 - Math.pow(-2 * x + 2, 5) / 2;
|
|
},
|
|
easeInSine: function easeInSine(x) {
|
|
return 1 - Math.cos(x * Math.PI / 2);
|
|
},
|
|
easeOutSine: function easeOutSine(x) {
|
|
return Math.sin(x * Math.PI / 2);
|
|
},
|
|
easeInOutSine: function easeInOutSine(x) {
|
|
return -(Math.cos(Math.PI * x) - 1) / 2;
|
|
},
|
|
easeInExpo: function easeInExpo(x) {
|
|
return x === 0 ? 0 : Math.pow(2, 10 * x - 10);
|
|
},
|
|
easeOutExpo: function easeOutExpo(x) {
|
|
return x === 1 ? 1 : 1 - Math.pow(2, -10 * x);
|
|
},
|
|
easeInOutExpo: function easeInOutExpo(x) {
|
|
return x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? Math.pow(2, 20 * x - 10) / 2 : (2 - Math.pow(2, -20 * x + 10)) / 2;
|
|
},
|
|
easeInCirc: function easeInCirc(x) {
|
|
return 1 - Math.sqrt(1 - Math.pow(x, 2));
|
|
},
|
|
easeOutCirc: function easeOutCirc(x) {
|
|
return Math.sqrt(1 - Math.pow(x - 1, 2));
|
|
},
|
|
easeInOutCirc: function easeInOutCirc(x) {
|
|
return x < 0.5 ? (1 - Math.sqrt(1 - Math.pow(2 * x, 2))) / 2 : (Math.sqrt(1 - Math.pow(-2 * x + 2, 2)) + 1) / 2;
|
|
},
|
|
easeInBack: function easeInBack(x) {
|
|
return c3 * x * x * x - c1 * x * x;
|
|
},
|
|
easeOutBack: function easeOutBack(x) {
|
|
return 1 + c3 * Math.pow(x - 1, 3) + c1 * Math.pow(x - 1, 2);
|
|
},
|
|
easeInOutBack: function easeInOutBack(x) {
|
|
return x < 0.5 ? Math.pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2) / 2 : (Math.pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2;
|
|
},
|
|
easeInElastic: function easeInElastic(x) {
|
|
return x === 0 ? 0 : x === 1 ? 1 : -Math.pow(2, 10 * x - 10) * Math.sin((x * 10 - 10.75) * c4);
|
|
},
|
|
easeOutElastic: function easeOutElastic(x) {
|
|
return x === 0 ? 0 : x === 1 ? 1 : Math.pow(2, -10 * x) * Math.sin((x * 10 - 0.75) * c4) + 1;
|
|
},
|
|
easeInOutElastic: function easeInOutElastic(x) {
|
|
return x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? -(Math.pow(2, 20 * x - 10) * Math.sin((20 * x - 11.125) * c5)) / 2 : Math.pow(2, -20 * x + 10) * Math.sin((20 * x - 11.125) * c5) / 2 + 1;
|
|
},
|
|
easeInBounce: function easeInBounce(x) {
|
|
return 1 - bounceOut(1 - x);
|
|
},
|
|
easeOutBounce: bounceOut,
|
|
easeInOutBounce: function easeInOutBounce(x) {
|
|
return x < 0.5 ? (1 - bounceOut(1 - 2 * x)) / 2 : (1 + bounceOut(2 * x - 1)) / 2;
|
|
},
|
|
steps: steps
|
|
};
|
|
|
|
// src/fluids.ts
|
|
var $get = Symbol["for"]("FluidValue.get");
|
|
var $observers = Symbol["for"]("FluidValue.observers");
|
|
var hasFluidValue = function hasFluidValue(arg) {
|
|
return Boolean(arg && arg[$get]);
|
|
};
|
|
var getFluidValue = function getFluidValue(arg) {
|
|
return arg && arg[$get] ? arg[$get]() : arg;
|
|
};
|
|
var getFluidObservers = function getFluidObservers(target) {
|
|
return target[$observers] || null;
|
|
};
|
|
function callFluidObserver(observer2, event) {
|
|
if (observer2.eventObserved) {
|
|
observer2.eventObserved(event);
|
|
} else {
|
|
observer2(event);
|
|
}
|
|
}
|
|
function callFluidObservers(target, event) {
|
|
var observers = target[$observers];
|
|
if (observers) {
|
|
observers.forEach(function (observer2) {
|
|
callFluidObserver(observer2, event);
|
|
});
|
|
}
|
|
}
|
|
var FluidValue = /*#__PURE__*/createClass(function FluidValue(get) {
|
|
classCallCheck(this, FluidValue);
|
|
if (!get && !(get = this.get)) {
|
|
throw Error("Unknown getter");
|
|
}
|
|
setFluidGetter(this, get);
|
|
});
|
|
$get, $observers;
|
|
var setFluidGetter = function setFluidGetter(target, get) {
|
|
return setHidden(target, $get, get);
|
|
};
|
|
function addFluidObserver(target, observer2) {
|
|
if (target[$get]) {
|
|
var observers = target[$observers];
|
|
if (!observers) {
|
|
setHidden(target, $observers, observers = /* @__PURE__ */new Set());
|
|
}
|
|
if (!observers.has(observer2)) {
|
|
observers.add(observer2);
|
|
if (target.observerAdded) {
|
|
target.observerAdded(observers.size, observer2);
|
|
}
|
|
}
|
|
}
|
|
return observer2;
|
|
}
|
|
function removeFluidObserver(target, observer2) {
|
|
var observers = target[$observers];
|
|
if (observers && observers.has(observer2)) {
|
|
var count = observers.size - 1;
|
|
if (count) {
|
|
observers["delete"](observer2);
|
|
} else {
|
|
target[$observers] = null;
|
|
}
|
|
if (target.observerRemoved) {
|
|
target.observerRemoved(count, observer2);
|
|
}
|
|
}
|
|
}
|
|
var setHidden = function setHidden(target, key, value) {
|
|
return Object.defineProperty(target, key, {
|
|
value: value,
|
|
writable: true,
|
|
configurable: true
|
|
});
|
|
};
|
|
|
|
// src/regexs.ts
|
|
var numberRegex = /[+\-]?(?:0|[1-9]\d*)(?:\.\d*)?(?:[eE][+\-]?\d+)?/g;
|
|
var colorRegex = /(#(?:[0-9a-f]{2}){2,4}|(#[0-9a-f]{3})|(rgb|hsl)a?\((-?\d+%?[,\s]+){2,3}\s*[\d\.]+%?\))/gi;
|
|
var unitRegex = new RegExp("(".concat(numberRegex.source, ")(%|[a-z]+)"), "i");
|
|
var rgbaRegex = /rgba\(([0-9\.-]+), ([0-9\.-]+), ([0-9\.-]+), ([0-9\.-]+)\)/gi;
|
|
var cssVariableRegex = /var\((--[a-zA-Z0-9-_]+),? ?([a-zA-Z0-9 ()%#.,-]+)?\)/;
|
|
|
|
// src/variableToRgba.ts
|
|
var variableToRgba = function variableToRgba(input) {
|
|
var _parseCSSVariable = parseCSSVariable(input),
|
|
_parseCSSVariable2 = slicedToArray(_parseCSSVariable, 2),
|
|
token = _parseCSSVariable2[0],
|
|
fallback = _parseCSSVariable2[1];
|
|
if (!token || isSSR()) {
|
|
return input;
|
|
}
|
|
var value = window.getComputedStyle(document.documentElement).getPropertyValue(token);
|
|
if (value) {
|
|
return value.trim();
|
|
} else if (fallback && fallback.startsWith("--")) {
|
|
var value2 = window.getComputedStyle(document.documentElement).getPropertyValue(fallback);
|
|
if (value2) {
|
|
return value2;
|
|
} else {
|
|
return input;
|
|
}
|
|
} else if (fallback && cssVariableRegex.test(fallback)) {
|
|
return variableToRgba(fallback);
|
|
} else if (fallback) {
|
|
return fallback;
|
|
}
|
|
return input;
|
|
};
|
|
var parseCSSVariable = function parseCSSVariable(current) {
|
|
var match = cssVariableRegex.exec(current);
|
|
if (!match) return [,];
|
|
var _match = slicedToArray(match, 3),
|
|
token = _match[1],
|
|
fallback = _match[2];
|
|
return [token, fallback];
|
|
};
|
|
|
|
// src/stringInterpolation.ts
|
|
var namedColorRegex;
|
|
var rgbaRound = function rgbaRound(_, p1, p2, p3, p4) {
|
|
return "rgba(".concat(Math.round(p1), ", ").concat(Math.round(p2), ", ").concat(Math.round(p3), ", ").concat(p4, ")");
|
|
};
|
|
var createStringInterpolator2 = function createStringInterpolator2(config) {
|
|
if (!namedColorRegex) namedColorRegex = _colors ?
|
|
// match color names, ignore partial matches
|
|
new RegExp("(".concat(Object.keys(_colors).join("|"), ")(?!\\w)"), "g") :
|
|
// never match
|
|
/^\b$/;
|
|
var output = config.output.map(function (value) {
|
|
return getFluidValue(value).replace(cssVariableRegex, variableToRgba).replace(colorRegex, colorToRgba).replace(namedColorRegex, colorToRgba);
|
|
});
|
|
var keyframes = output.map(function (value) {
|
|
return value.match(numberRegex).map(Number);
|
|
});
|
|
var outputRanges = keyframes[0].map(function (_, i) {
|
|
return keyframes.map(function (values) {
|
|
if (!(i in values)) {
|
|
throw Error('The arity of each "output" value must be equal');
|
|
}
|
|
return values[i];
|
|
});
|
|
});
|
|
var interpolators = outputRanges.map(function (output2) {
|
|
return createInterpolator(objectSpread2(objectSpread2({}, config), {}, {
|
|
output: output2
|
|
}));
|
|
});
|
|
return function (input) {
|
|
var _output$find;
|
|
var missingUnit = !unitRegex.test(output[0]) && ((_output$find = output.find(function (value) {
|
|
return unitRegex.test(value);
|
|
})) === null || _output$find === void 0 ? void 0 : _output$find.replace(numberRegex, ""));
|
|
var i = 0;
|
|
return output[0].replace(numberRegex, function () {
|
|
return "".concat(interpolators[i++](input)).concat(missingUnit || "");
|
|
}).replace(rgbaRegex, rgbaRound);
|
|
};
|
|
};
|
|
|
|
// src/deprecations.ts
|
|
var prefix = "react-spring: ";
|
|
var once = function once(fn) {
|
|
var func = fn;
|
|
var called = false;
|
|
if (typeof func != "function") {
|
|
throw new TypeError("".concat(prefix, "once requires a function parameter"));
|
|
}
|
|
return function () {
|
|
if (!called) {
|
|
func.apply(void 0, arguments);
|
|
called = true;
|
|
}
|
|
};
|
|
};
|
|
var warnInterpolate = once(console.warn);
|
|
function deprecateInterpolate() {
|
|
warnInterpolate("".concat(prefix, "The \"interpolate\" function is deprecated in v9 (use \"to\" instead)"));
|
|
}
|
|
var warnDirectCall = once(console.warn);
|
|
function deprecateDirectCall() {
|
|
warnDirectCall("".concat(prefix, "Directly calling start instead of using the api object is deprecated in v9 (use \".start\" instead), this will be removed in later 0.X.0 versions"));
|
|
}
|
|
|
|
// src/isAnimatedString.ts
|
|
function isAnimatedString(value) {
|
|
return is.str(value) && (value[0] == "#" || /\d/.test(value) ||
|
|
// Do not identify a CSS variable as an AnimatedString if its SSR
|
|
!isSSR() && cssVariableRegex.test(value) || value in (_colors || {}));
|
|
}
|
|
|
|
// src/dom-events/scroll/index.ts
|
|
|
|
|
|
// src/dom-events/resize/resizeElement.ts
|
|
var observer;
|
|
var resizeHandlers = /* @__PURE__ */new WeakMap();
|
|
var handleObservation = function handleObservation(entries) {
|
|
return entries.forEach(function (_ref) {
|
|
var _resizeHandlers$get;
|
|
var target = _ref.target,
|
|
contentRect = _ref.contentRect;
|
|
return (_resizeHandlers$get = resizeHandlers.get(target)) === null || _resizeHandlers$get === void 0 ? void 0 : _resizeHandlers$get.forEach(function (handler) {
|
|
return handler(contentRect);
|
|
});
|
|
});
|
|
};
|
|
function resizeElement(handler, target) {
|
|
if (!observer) {
|
|
if (typeof ResizeObserver !== "undefined") {
|
|
observer = new ResizeObserver(handleObservation);
|
|
}
|
|
}
|
|
var elementHandlers = resizeHandlers.get(target);
|
|
if (!elementHandlers) {
|
|
elementHandlers = /* @__PURE__ */new Set();
|
|
resizeHandlers.set(target, elementHandlers);
|
|
}
|
|
elementHandlers.add(handler);
|
|
if (observer) {
|
|
observer.observe(target);
|
|
}
|
|
return function () {
|
|
var elementHandlers2 = resizeHandlers.get(target);
|
|
if (!elementHandlers2) return;
|
|
elementHandlers2["delete"](handler);
|
|
if (!elementHandlers2.size && observer) {
|
|
observer.unobserve(target);
|
|
}
|
|
};
|
|
}
|
|
|
|
// src/dom-events/resize/resizeWindow.ts
|
|
var listeners = /* @__PURE__ */new Set();
|
|
var cleanupWindowResizeHandler;
|
|
var createResizeHandler = function createResizeHandler() {
|
|
var handleResize = function handleResize() {
|
|
listeners.forEach(function (callback) {
|
|
return callback({
|
|
width: window.innerWidth,
|
|
height: window.innerHeight
|
|
});
|
|
});
|
|
};
|
|
window.addEventListener("resize", handleResize);
|
|
return function () {
|
|
window.removeEventListener("resize", handleResize);
|
|
};
|
|
};
|
|
var resizeWindow = function resizeWindow(callback) {
|
|
listeners.add(callback);
|
|
if (!cleanupWindowResizeHandler) {
|
|
cleanupWindowResizeHandler = createResizeHandler();
|
|
}
|
|
return function () {
|
|
listeners["delete"](callback);
|
|
if (!listeners.size && cleanupWindowResizeHandler) {
|
|
cleanupWindowResizeHandler();
|
|
cleanupWindowResizeHandler = void 0;
|
|
}
|
|
};
|
|
};
|
|
|
|
// src/dom-events/resize/index.ts
|
|
var react_spring_shared_modern_onResize = function onResize(callback) {
|
|
var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
_ref2$container = _ref2.container,
|
|
container = _ref2$container === void 0 ? document.documentElement : _ref2$container;
|
|
if (container === document.documentElement) {
|
|
return resizeWindow(callback);
|
|
} else {
|
|
return resizeElement(callback, container);
|
|
}
|
|
};
|
|
|
|
// src/progress.ts
|
|
var progress = function progress(min, max, value) {
|
|
return max - min === 0 ? 1 : (value - min) / (max - min);
|
|
};
|
|
|
|
// src/dom-events/scroll/ScrollHandler.ts
|
|
var SCROLL_KEYS = {
|
|
x: {
|
|
length: "Width",
|
|
position: "Left"
|
|
},
|
|
y: {
|
|
length: "Height",
|
|
position: "Top"
|
|
}
|
|
};
|
|
var ScrollHandler = /*#__PURE__*/(/* unused pure expression or super */ null && (_createClass(function ScrollHandler(callback, container) {
|
|
var _this = this;
|
|
_classCallCheck(this, ScrollHandler);
|
|
this.createAxis = function () {
|
|
return {
|
|
current: 0,
|
|
progress: 0,
|
|
scrollLength: 0
|
|
};
|
|
};
|
|
this.updateAxis = function (axisName) {
|
|
var axis = _this.info[axisName];
|
|
var _SCROLL_KEYS$axisName = SCROLL_KEYS[axisName],
|
|
length = _SCROLL_KEYS$axisName.length,
|
|
position = _SCROLL_KEYS$axisName.position;
|
|
axis.current = _this.container["scroll".concat(position)];
|
|
axis.scrollLength = _this.container["scroll".concat(length)] - _this.container["client".concat(length)];
|
|
axis.progress = progress(0, axis.scrollLength, axis.current);
|
|
};
|
|
this.update = function () {
|
|
_this.updateAxis("x");
|
|
_this.updateAxis("y");
|
|
};
|
|
this.sendEvent = function () {
|
|
_this.callback(_this.info);
|
|
};
|
|
this.advance = function () {
|
|
_this.update();
|
|
_this.sendEvent();
|
|
};
|
|
this.callback = callback;
|
|
this.container = container;
|
|
this.info = {
|
|
time: 0,
|
|
x: this.createAxis(),
|
|
y: this.createAxis()
|
|
};
|
|
})));
|
|
|
|
// src/dom-events/scroll/index.ts
|
|
var scrollListeners = /* @__PURE__ */new WeakMap();
|
|
var resizeListeners = /* @__PURE__ */new WeakMap();
|
|
var onScrollHandlers = /* @__PURE__ */new WeakMap();
|
|
var getTarget = function getTarget(container) {
|
|
return container === document.documentElement ? window : container;
|
|
};
|
|
var react_spring_shared_modern_onScroll = function onScroll(callback) {
|
|
var _ref3 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
_ref3$container = _ref3.container,
|
|
container = _ref3$container === void 0 ? document.documentElement : _ref3$container;
|
|
var containerHandlers = onScrollHandlers.get(container);
|
|
if (!containerHandlers) {
|
|
containerHandlers = /* @__PURE__ */new Set();
|
|
onScrollHandlers.set(container, containerHandlers);
|
|
}
|
|
var containerHandler = new ScrollHandler(callback, container);
|
|
containerHandlers.add(containerHandler);
|
|
if (!scrollListeners.has(container)) {
|
|
var listener = function listener() {
|
|
var _containerHandlers;
|
|
(_containerHandlers = containerHandlers) === null || _containerHandlers === void 0 || _containerHandlers.forEach(function (handler) {
|
|
return handler.advance();
|
|
});
|
|
return true;
|
|
};
|
|
scrollListeners.set(container, listener);
|
|
var target = getTarget(container);
|
|
window.addEventListener("resize", listener, {
|
|
passive: true
|
|
});
|
|
if (container !== document.documentElement) {
|
|
resizeListeners.set(container, react_spring_shared_modern_onResize(listener, {
|
|
container: container
|
|
}));
|
|
}
|
|
target.addEventListener("scroll", listener, {
|
|
passive: true
|
|
});
|
|
}
|
|
var animateScroll = scrollListeners.get(container);
|
|
raf3(animateScroll);
|
|
return function () {
|
|
raf3.cancel(animateScroll);
|
|
var containerHandlers2 = onScrollHandlers.get(container);
|
|
if (!containerHandlers2) return;
|
|
containerHandlers2["delete"](containerHandler);
|
|
if (containerHandlers2.size) return;
|
|
var listener = scrollListeners.get(container);
|
|
scrollListeners["delete"](container);
|
|
if (listener) {
|
|
var _resizeListeners$get;
|
|
getTarget(container).removeEventListener("scroll", listener);
|
|
window.removeEventListener("resize", listener);
|
|
(_resizeListeners$get = resizeListeners.get(container)) === null || _resizeListeners$get === void 0 || _resizeListeners$get();
|
|
}
|
|
};
|
|
};
|
|
|
|
// src/hooks/useConstant.ts
|
|
|
|
function react_spring_shared_modern_useConstant(init) {
|
|
var ref = useRef(null);
|
|
if (ref.current === null) {
|
|
ref.current = init();
|
|
}
|
|
return ref.current;
|
|
}
|
|
|
|
// src/hooks/useForceUpdate.ts
|
|
|
|
|
|
// src/hooks/useIsMounted.ts
|
|
|
|
|
|
// src/hooks/useIsomorphicLayoutEffect.ts
|
|
|
|
var react_spring_shared_modern_useIsomorphicLayoutEffect = isSSR() ? _react_17_0_2_react.useEffect : _react_17_0_2_react.useLayoutEffect;
|
|
|
|
// src/hooks/useIsMounted.ts
|
|
var useIsMounted = function useIsMounted() {
|
|
var isMounted = (0,_react_17_0_2_react.useRef)(false);
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
isMounted.current = true;
|
|
return function () {
|
|
isMounted.current = false;
|
|
};
|
|
}, []);
|
|
return isMounted;
|
|
};
|
|
|
|
// src/hooks/useForceUpdate.ts
|
|
function useForceUpdate() {
|
|
var update = (0,_react_17_0_2_react.useState)()[1];
|
|
var isMounted = useIsMounted();
|
|
return function () {
|
|
if (isMounted.current) {
|
|
update(Math.random());
|
|
}
|
|
};
|
|
}
|
|
|
|
// src/hooks/useMemoOne.ts
|
|
|
|
function useMemoOne(getResult, inputs) {
|
|
var _useState = (0,_react_17_0_2_react.useState)(function () {
|
|
return {
|
|
inputs: inputs,
|
|
result: getResult()
|
|
};
|
|
}),
|
|
_useState2 = slicedToArray(_useState, 1),
|
|
initial = _useState2[0];
|
|
var committed = (0,_react_17_0_2_react.useRef)();
|
|
var prevCache = committed.current;
|
|
var cache = prevCache;
|
|
if (cache) {
|
|
var useCache = Boolean(inputs && cache.inputs && areInputsEqual(inputs, cache.inputs));
|
|
if (!useCache) {
|
|
cache = {
|
|
inputs: inputs,
|
|
result: getResult()
|
|
};
|
|
}
|
|
} else {
|
|
cache = initial;
|
|
}
|
|
(0,_react_17_0_2_react.useEffect)(function () {
|
|
committed.current = cache;
|
|
if (prevCache == initial) {
|
|
initial.inputs = initial.result = void 0;
|
|
}
|
|
}, [cache]);
|
|
return cache.result;
|
|
}
|
|
function areInputsEqual(next, prev) {
|
|
if (next.length !== prev.length) {
|
|
return false;
|
|
}
|
|
for (var i = 0; i < next.length; i++) {
|
|
if (next[i] !== prev[i]) {
|
|
return false;
|
|
}
|
|
}
|
|
return true;
|
|
}
|
|
|
|
// src/hooks/useOnce.ts
|
|
|
|
var useOnce = function useOnce(effect) {
|
|
return (0,_react_17_0_2_react.useEffect)(effect, emptyDeps);
|
|
};
|
|
var emptyDeps = [];
|
|
|
|
// src/hooks/usePrev.ts
|
|
|
|
function usePrev(value) {
|
|
var prevRef = (0,_react_17_0_2_react.useRef)();
|
|
(0,_react_17_0_2_react.useEffect)(function () {
|
|
prevRef.current = value;
|
|
});
|
|
return prevRef.current;
|
|
}
|
|
|
|
// src/hooks/useReducedMotion.ts
|
|
|
|
var useReducedMotion = function useReducedMotion() {
|
|
var _useState3 = useState3(null),
|
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
reducedMotion = _useState4[0],
|
|
setReducedMotion = _useState4[1];
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
var mql = window.matchMedia("(prefers-reduced-motion)");
|
|
var handleMediaChange = function handleMediaChange(e) {
|
|
setReducedMotion(e.matches);
|
|
_assign({
|
|
skipAnimation: e.matches
|
|
});
|
|
};
|
|
handleMediaChange(mql);
|
|
if (mql.addEventListener) {
|
|
mql.addEventListener("change", handleMediaChange);
|
|
} else {
|
|
mql.addListener(handleMediaChange);
|
|
}
|
|
return function () {
|
|
if (mql.removeEventListener) {
|
|
mql.removeEventListener("change", handleMediaChange);
|
|
} else {
|
|
mql.removeListener(handleMediaChange);
|
|
}
|
|
};
|
|
}, []);
|
|
return reducedMotion;
|
|
};
|
|
|
|
// src/index.ts
|
|
|
|
|
|
;// CONCATENATED MODULE: ./node_modules/_@react-spring_animated@9.7.5@@react-spring/animated/dist/react-spring_animated.modern.mjs
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// src/Animated.ts
|
|
|
|
var $node = Symbol["for"]("Animated:node");
|
|
var isAnimated = function isAnimated(value) {
|
|
return !!value && value[$node] === value;
|
|
};
|
|
var getAnimated = function getAnimated(owner) {
|
|
return owner && owner[$node];
|
|
};
|
|
var setAnimated = function setAnimated(owner, node) {
|
|
return defineHidden(owner, $node, node);
|
|
};
|
|
var getPayload = function getPayload(owner) {
|
|
return owner && owner[$node] && owner[$node].getPayload();
|
|
};
|
|
var Animated = /*#__PURE__*/function () {
|
|
function Animated() {
|
|
classCallCheck(this, Animated);
|
|
setAnimated(this, this);
|
|
}
|
|
/** Get every `AnimatedValue` used by this node. */
|
|
createClass(Animated, [{
|
|
key: "getPayload",
|
|
value: function getPayload() {
|
|
return this.payload || [];
|
|
}
|
|
}]);
|
|
return Animated;
|
|
}();
|
|
|
|
// src/AnimatedValue.ts
|
|
|
|
var AnimatedValue = /*#__PURE__*/function (_Animated) {
|
|
inherits(AnimatedValue, _Animated);
|
|
var _super = createSuper(AnimatedValue);
|
|
function AnimatedValue(_value) {
|
|
var _this;
|
|
classCallCheck(this, AnimatedValue);
|
|
_this = _super.call(this);
|
|
_this._value = _value;
|
|
_this.done = true;
|
|
_this.durationProgress = 0;
|
|
if (is.num(_this._value)) {
|
|
_this.lastPosition = _this._value;
|
|
}
|
|
return _this;
|
|
}
|
|
/** @internal */
|
|
createClass(AnimatedValue, [{
|
|
key: "getPayload",
|
|
value: function getPayload() {
|
|
return [this];
|
|
}
|
|
}, {
|
|
key: "getValue",
|
|
value: function getValue() {
|
|
return this._value;
|
|
}
|
|
}, {
|
|
key: "setValue",
|
|
value: function setValue(value, step) {
|
|
if (is.num(value)) {
|
|
this.lastPosition = value;
|
|
if (step) {
|
|
value = Math.round(value / step) * step;
|
|
if (this.done) {
|
|
this.lastPosition = value;
|
|
}
|
|
}
|
|
}
|
|
if (this._value === value) {
|
|
return false;
|
|
}
|
|
this._value = value;
|
|
return true;
|
|
}
|
|
}, {
|
|
key: "reset",
|
|
value: function reset() {
|
|
var done = this.done;
|
|
this.done = false;
|
|
if (is.num(this._value)) {
|
|
this.elapsedTime = 0;
|
|
this.durationProgress = 0;
|
|
this.lastPosition = this._value;
|
|
if (done) this.lastVelocity = null;
|
|
this.v0 = null;
|
|
}
|
|
}
|
|
}], [{
|
|
key: "create",
|
|
value: function create(value) {
|
|
return new AnimatedValue(value);
|
|
}
|
|
}]);
|
|
return AnimatedValue;
|
|
}(Animated);
|
|
|
|
// src/AnimatedString.ts
|
|
|
|
var AnimatedString = /*#__PURE__*/function (_AnimatedValue) {
|
|
inherits(AnimatedString, _AnimatedValue);
|
|
var _super2 = createSuper(AnimatedString);
|
|
function AnimatedString(value) {
|
|
var _this2;
|
|
classCallCheck(this, AnimatedString);
|
|
_this2 = _super2.call(this, 0);
|
|
_this2._string = null;
|
|
_this2._toString = createInterpolator({
|
|
output: [value, value]
|
|
});
|
|
return _this2;
|
|
}
|
|
/** @internal */
|
|
createClass(AnimatedString, [{
|
|
key: "getValue",
|
|
value: function getValue() {
|
|
var value = this._string;
|
|
return value == null ? this._string = this._toString(this._value) : value;
|
|
}
|
|
}, {
|
|
key: "setValue",
|
|
value: function setValue(value) {
|
|
if (is.str(value)) {
|
|
if (value == this._string) {
|
|
return false;
|
|
}
|
|
this._string = value;
|
|
this._value = 1;
|
|
} else if (get(getPrototypeOf(AnimatedString.prototype), "setValue", this).call(this, value)) {
|
|
this._string = null;
|
|
} else {
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
}, {
|
|
key: "reset",
|
|
value: function reset(goal) {
|
|
if (goal) {
|
|
this._toString = createInterpolator({
|
|
output: [this.getValue(), goal]
|
|
});
|
|
}
|
|
this._value = 0;
|
|
get(getPrototypeOf(AnimatedString.prototype), "reset", this).call(this);
|
|
}
|
|
}], [{
|
|
key: "create",
|
|
value: function create(value) {
|
|
return new AnimatedString(value);
|
|
}
|
|
}]);
|
|
return AnimatedString;
|
|
}(AnimatedValue);
|
|
|
|
// src/AnimatedArray.ts
|
|
|
|
|
|
// src/AnimatedObject.ts
|
|
|
|
|
|
// src/context.ts
|
|
var TreeContext = {
|
|
dependencies: null
|
|
};
|
|
|
|
// src/AnimatedObject.ts
|
|
var AnimatedObject = /*#__PURE__*/function (_Animated2) {
|
|
inherits(AnimatedObject, _Animated2);
|
|
var _super3 = createSuper(AnimatedObject);
|
|
function AnimatedObject(source) {
|
|
var _this3;
|
|
classCallCheck(this, AnimatedObject);
|
|
_this3 = _super3.call(this);
|
|
_this3.source = source;
|
|
_this3.setValue(source);
|
|
return _this3;
|
|
}
|
|
createClass(AnimatedObject, [{
|
|
key: "getValue",
|
|
value: function getValue(animated) {
|
|
var values = {};
|
|
eachProp(this.source, function (source, key) {
|
|
if (isAnimated(source)) {
|
|
values[key] = source.getValue(animated);
|
|
} else if (hasFluidValue(source)) {
|
|
values[key] = getFluidValue(source);
|
|
} else if (!animated) {
|
|
values[key] = source;
|
|
}
|
|
});
|
|
return values;
|
|
}
|
|
/** Replace the raw object data */
|
|
}, {
|
|
key: "setValue",
|
|
value: function setValue(source) {
|
|
this.source = source;
|
|
this.payload = this._makePayload(source);
|
|
}
|
|
}, {
|
|
key: "reset",
|
|
value: function reset() {
|
|
if (this.payload) {
|
|
react_spring_shared_modern_each(this.payload, function (node) {
|
|
return node.reset();
|
|
});
|
|
}
|
|
}
|
|
/** Create a payload set. */
|
|
}, {
|
|
key: "_makePayload",
|
|
value: function _makePayload(source) {
|
|
if (source) {
|
|
var payload = /* @__PURE__ */new Set();
|
|
eachProp(source, this._addToPayload, payload);
|
|
return Array.from(payload);
|
|
}
|
|
}
|
|
/** Add to a payload set. */
|
|
}, {
|
|
key: "_addToPayload",
|
|
value: function _addToPayload(source) {
|
|
var _this4 = this;
|
|
if (TreeContext.dependencies && hasFluidValue(source)) {
|
|
TreeContext.dependencies.add(source);
|
|
}
|
|
var payload = getPayload(source);
|
|
if (payload) {
|
|
react_spring_shared_modern_each(payload, function (node) {
|
|
return _this4.add(node);
|
|
});
|
|
}
|
|
}
|
|
}]);
|
|
return AnimatedObject;
|
|
}(Animated);
|
|
|
|
// src/AnimatedArray.ts
|
|
var AnimatedArray = /*#__PURE__*/function (_AnimatedObject) {
|
|
inherits(AnimatedArray, _AnimatedObject);
|
|
var _super4 = createSuper(AnimatedArray);
|
|
function AnimatedArray(source) {
|
|
classCallCheck(this, AnimatedArray);
|
|
return _super4.call(this, source);
|
|
}
|
|
/** @internal */
|
|
createClass(AnimatedArray, [{
|
|
key: "getValue",
|
|
value: function getValue() {
|
|
return this.source.map(function (node) {
|
|
return node.getValue();
|
|
});
|
|
}
|
|
}, {
|
|
key: "setValue",
|
|
value: function setValue(source) {
|
|
var payload = this.getPayload();
|
|
if (source.length == payload.length) {
|
|
return payload.map(function (node, i) {
|
|
return node.setValue(source[i]);
|
|
}).some(Boolean);
|
|
}
|
|
get(getPrototypeOf(AnimatedArray.prototype), "setValue", this).call(this, source.map(makeAnimated));
|
|
return true;
|
|
}
|
|
}], [{
|
|
key: "create",
|
|
value: function create(source) {
|
|
return new AnimatedArray(source);
|
|
}
|
|
}]);
|
|
return AnimatedArray;
|
|
}(AnimatedObject);
|
|
function makeAnimated(value) {
|
|
var nodeType = isAnimatedString(value) ? AnimatedString : AnimatedValue;
|
|
return nodeType.create(value);
|
|
}
|
|
|
|
// src/getAnimatedType.ts
|
|
|
|
function getAnimatedType(value) {
|
|
var parentNode = getAnimated(value);
|
|
return parentNode ? parentNode.constructor : is.arr(value) ? AnimatedArray : isAnimatedString(value) ? AnimatedString : AnimatedValue;
|
|
}
|
|
|
|
// src/createHost.ts
|
|
|
|
|
|
// src/withAnimated.tsx
|
|
|
|
|
|
|
|
var withAnimated = function withAnimated(Component, host) {
|
|
var hasInstance =
|
|
// Function components must use "forwardRef" to avoid being
|
|
// re-rendered on every animation frame.
|
|
!is.fun(Component) || Component.prototype && Component.prototype.isReactComponent;
|
|
return /*#__PURE__*/(0,_react_17_0_2_react.forwardRef)(function (givenProps, givenRef) {
|
|
var instanceRef = (0,_react_17_0_2_react.useRef)(null);
|
|
var ref = hasInstance &&
|
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
(0,_react_17_0_2_react.useCallback)(function (value) {
|
|
instanceRef.current = updateRef(givenRef, value);
|
|
}, [givenRef]);
|
|
var _getAnimatedState = getAnimatedState(givenProps, host),
|
|
_getAnimatedState2 = slicedToArray(_getAnimatedState, 2),
|
|
props = _getAnimatedState2[0],
|
|
deps = _getAnimatedState2[1];
|
|
var forceUpdate = useForceUpdate();
|
|
var callback = function callback() {
|
|
var instance = instanceRef.current;
|
|
if (hasInstance && !instance) {
|
|
return;
|
|
}
|
|
var didUpdate = instance ? host.applyAnimatedValues(instance, props.getValue(true)) : false;
|
|
if (didUpdate === false) {
|
|
forceUpdate();
|
|
}
|
|
};
|
|
var observer = new PropsObserver(callback, deps);
|
|
var observerRef = (0,_react_17_0_2_react.useRef)();
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
observerRef.current = observer;
|
|
react_spring_shared_modern_each(deps, function (dep) {
|
|
return addFluidObserver(dep, observer);
|
|
});
|
|
return function () {
|
|
if (observerRef.current) {
|
|
react_spring_shared_modern_each(observerRef.current.deps, function (dep) {
|
|
return removeFluidObserver(dep, observerRef.current);
|
|
});
|
|
raf.cancel(observerRef.current.update);
|
|
}
|
|
};
|
|
});
|
|
(0,_react_17_0_2_react.useEffect)(callback, []);
|
|
useOnce(function () {
|
|
return function () {
|
|
var observer2 = observerRef.current;
|
|
react_spring_shared_modern_each(observer2.deps, function (dep) {
|
|
return removeFluidObserver(dep, observer2);
|
|
});
|
|
};
|
|
});
|
|
var usedProps = host.getComponentProps(props.getValue());
|
|
return /* @__PURE__ */_react_17_0_2_react.createElement(Component, objectSpread2(objectSpread2({}, usedProps), {}, {
|
|
ref: ref
|
|
}));
|
|
});
|
|
};
|
|
var PropsObserver = /*#__PURE__*/function () {
|
|
function PropsObserver(update, deps) {
|
|
classCallCheck(this, PropsObserver);
|
|
this.update = update;
|
|
this.deps = deps;
|
|
}
|
|
createClass(PropsObserver, [{
|
|
key: "eventObserved",
|
|
value: function eventObserved(event) {
|
|
if (event.type == "change") {
|
|
raf.write(this.update);
|
|
}
|
|
}
|
|
}]);
|
|
return PropsObserver;
|
|
}();
|
|
function getAnimatedState(props, host) {
|
|
var dependencies = /* @__PURE__ */new Set();
|
|
TreeContext.dependencies = dependencies;
|
|
if (props.style) props = objectSpread2(objectSpread2({}, props), {}, {
|
|
style: host.createAnimatedStyle(props.style)
|
|
});
|
|
props = new AnimatedObject(props);
|
|
TreeContext.dependencies = null;
|
|
return [props, dependencies];
|
|
}
|
|
function updateRef(ref, value) {
|
|
if (ref) {
|
|
if (is.fun(ref)) ref(value);else ref.current = value;
|
|
}
|
|
return value;
|
|
}
|
|
|
|
// src/createHost.ts
|
|
var cacheKey = Symbol["for"]("AnimatedComponent");
|
|
var createHost = function createHost(components) {
|
|
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
|
_ref$applyAnimatedVal = _ref.applyAnimatedValues,
|
|
applyAnimatedValues = _ref$applyAnimatedVal === void 0 ? function () {
|
|
return false;
|
|
} : _ref$applyAnimatedVal,
|
|
_ref$createAnimatedSt = _ref.createAnimatedStyle,
|
|
createAnimatedStyle = _ref$createAnimatedSt === void 0 ? function (style) {
|
|
return new AnimatedObject(style);
|
|
} : _ref$createAnimatedSt,
|
|
_ref$getComponentProp = _ref.getComponentProps,
|
|
getComponentProps = _ref$getComponentProp === void 0 ? function (props) {
|
|
return props;
|
|
} : _ref$getComponentProp;
|
|
var hostConfig = {
|
|
applyAnimatedValues: applyAnimatedValues,
|
|
createAnimatedStyle: createAnimatedStyle,
|
|
getComponentProps: getComponentProps
|
|
};
|
|
var animated = function animated(Component) {
|
|
var displayName = getDisplayName(Component) || "Anonymous";
|
|
if (is.str(Component)) {
|
|
Component = animated[Component] || (animated[Component] = withAnimated(Component, hostConfig));
|
|
} else {
|
|
Component = Component[cacheKey] || (Component[cacheKey] = withAnimated(Component, hostConfig));
|
|
}
|
|
Component.displayName = "Animated(".concat(displayName, ")");
|
|
return Component;
|
|
};
|
|
eachProp(components, function (Component, key) {
|
|
if (is.arr(components)) {
|
|
key = getDisplayName(Component);
|
|
}
|
|
animated[key] = animated(Component);
|
|
});
|
|
return {
|
|
animated: animated
|
|
};
|
|
};
|
|
var getDisplayName = function getDisplayName(arg) {
|
|
return is.str(arg) ? arg : arg && is.str(arg.displayName) ? arg.displayName : is.fun(arg) && arg.name || null;
|
|
};
|
|
|
|
;// CONCATENATED MODULE: ./node_modules/_@react-spring_core@9.7.5@@react-spring/core/dist/react-spring_core.modern.mjs
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var _excluded = ["children"],
|
|
_excluded2 = (/* unused pure expression or super */ null && (["container"])),
|
|
_excluded3 = (/* unused pure expression or super */ null && (["container"])),
|
|
_excluded4 = (/* unused pure expression or super */ null && (["to", "from"])),
|
|
_excluded5 = (/* unused pure expression or super */ null && (["root", "once", "amount"])),
|
|
_excluded6 = (/* unused pure expression or super */ null && (["children"])),
|
|
_excluded7 = (/* unused pure expression or super */ null && (["items", "children"])),
|
|
_excluded8 = (/* unused pure expression or super */ null && (["items", "children"]));
|
|
// src/hooks/useChain.ts
|
|
|
|
|
|
// src/helpers.ts
|
|
|
|
function callProp(value) {
|
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
args[_key - 1] = arguments[_key];
|
|
}
|
|
return is.fun(value) ? value.apply(void 0, args) : value;
|
|
}
|
|
var matchProp = function matchProp(value, key) {
|
|
return value === true || !!(key && value && (is.fun(value) ? value(key) : toArray(value).includes(key)));
|
|
};
|
|
var resolveProp = function resolveProp(prop, key) {
|
|
return is.obj(prop) ? key && prop[key] : prop;
|
|
};
|
|
var getDefaultProp = function getDefaultProp(props, key) {
|
|
return props["default"] === true ? props[key] : props["default"] ? props["default"][key] : void 0;
|
|
};
|
|
var noopTransform = function noopTransform(value) {
|
|
return value;
|
|
};
|
|
var getDefaultProps = function getDefaultProps(props) {
|
|
var transform = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : noopTransform;
|
|
var keys = DEFAULT_PROPS;
|
|
if (props["default"] && props["default"] !== true) {
|
|
props = props["default"];
|
|
keys = Object.keys(props);
|
|
}
|
|
var defaults2 = {};
|
|
var _iterator = createForOfIteratorHelper(keys),
|
|
_step;
|
|
try {
|
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
var key = _step.value;
|
|
var value = transform(props[key], key);
|
|
if (!is.und(value)) {
|
|
defaults2[key] = value;
|
|
}
|
|
}
|
|
} catch (err) {
|
|
_iterator.e(err);
|
|
} finally {
|
|
_iterator.f();
|
|
}
|
|
return defaults2;
|
|
};
|
|
var DEFAULT_PROPS = ["config", "onProps", "onStart", "onChange", "onPause", "onResume", "onRest"];
|
|
var RESERVED_PROPS = {
|
|
config: 1,
|
|
from: 1,
|
|
to: 1,
|
|
ref: 1,
|
|
loop: 1,
|
|
reset: 1,
|
|
pause: 1,
|
|
cancel: 1,
|
|
reverse: 1,
|
|
immediate: 1,
|
|
"default": 1,
|
|
delay: 1,
|
|
onProps: 1,
|
|
onStart: 1,
|
|
onChange: 1,
|
|
onPause: 1,
|
|
onResume: 1,
|
|
onRest: 1,
|
|
onResolve: 1,
|
|
// Transition props
|
|
items: 1,
|
|
trail: 1,
|
|
sort: 1,
|
|
expires: 1,
|
|
initial: 1,
|
|
enter: 1,
|
|
update: 1,
|
|
leave: 1,
|
|
children: 1,
|
|
onDestroyed: 1,
|
|
// Internal props
|
|
keys: 1,
|
|
callId: 1,
|
|
parentId: 1
|
|
};
|
|
function getForwardProps(props) {
|
|
var forward = {};
|
|
var count = 0;
|
|
eachProp(props, function (value, prop) {
|
|
if (!RESERVED_PROPS[prop]) {
|
|
forward[prop] = value;
|
|
count++;
|
|
}
|
|
});
|
|
if (count) {
|
|
return forward;
|
|
}
|
|
}
|
|
function inferTo(props) {
|
|
var to2 = getForwardProps(props);
|
|
if (to2) {
|
|
var out = {
|
|
to: to2
|
|
};
|
|
eachProp(props, function (val, key) {
|
|
return key in to2 || (out[key] = val);
|
|
});
|
|
return out;
|
|
}
|
|
return objectSpread2({}, props);
|
|
}
|
|
function computeGoal(value) {
|
|
value = getFluidValue(value);
|
|
return is.arr(value) ? value.map(computeGoal) : isAnimatedString(value) ? globals_exports.createStringInterpolator({
|
|
range: [0, 1],
|
|
output: [value, value]
|
|
})(1) : value;
|
|
}
|
|
function hasProps(props) {
|
|
for (var _ in props) return true;
|
|
return false;
|
|
}
|
|
function isAsyncTo(to2) {
|
|
return is.fun(to2) || is.arr(to2) && is.obj(to2[0]);
|
|
}
|
|
function detachRefs(ctrl, ref) {
|
|
var _ctrl$ref;
|
|
(_ctrl$ref = ctrl.ref) === null || _ctrl$ref === void 0 || _ctrl$ref["delete"](ctrl);
|
|
ref === null || ref === void 0 || ref["delete"](ctrl);
|
|
}
|
|
function replaceRef(ctrl, ref) {
|
|
if (ref && ctrl.ref !== ref) {
|
|
var _ctrl$ref2;
|
|
(_ctrl$ref2 = ctrl.ref) === null || _ctrl$ref2 === void 0 || _ctrl$ref2["delete"](ctrl);
|
|
ref.add(ctrl);
|
|
ctrl.ref = ref;
|
|
}
|
|
}
|
|
|
|
// src/hooks/useChain.ts
|
|
function useChain(refs, timeSteps) {
|
|
var timeFrame = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1e3;
|
|
useIsomorphicLayoutEffect(function () {
|
|
if (timeSteps) {
|
|
var prevDelay = 0;
|
|
each(refs, function (ref, i) {
|
|
var controllers = ref.current;
|
|
if (controllers.length) {
|
|
var delay = timeFrame * timeSteps[i];
|
|
if (isNaN(delay)) delay = prevDelay;else prevDelay = delay;
|
|
each(controllers, function (ctrl) {
|
|
each(ctrl.queue, function (props) {
|
|
var memoizedDelayProp = props.delay;
|
|
props.delay = function (key) {
|
|
return delay + callProp(memoizedDelayProp || 0, key);
|
|
};
|
|
});
|
|
});
|
|
ref.start();
|
|
}
|
|
});
|
|
} else {
|
|
var p = Promise.resolve();
|
|
each(refs, function (ref) {
|
|
var controllers = ref.current;
|
|
if (controllers.length) {
|
|
var queues = controllers.map(function (ctrl) {
|
|
var q = ctrl.queue;
|
|
ctrl.queue = [];
|
|
return q;
|
|
});
|
|
p = p.then(function () {
|
|
each(controllers, function (ctrl, i) {
|
|
return each(queues[i] || [], function (update2) {
|
|
return ctrl.queue.push(update2);
|
|
});
|
|
});
|
|
return Promise.all(ref.start());
|
|
});
|
|
}
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
// src/hooks/useSpring.ts
|
|
|
|
|
|
// src/hooks/useSprings.ts
|
|
|
|
|
|
|
|
// src/SpringValue.ts
|
|
|
|
|
|
|
|
// src/AnimationConfig.ts
|
|
|
|
|
|
// src/constants.ts
|
|
var config = {
|
|
"default": {
|
|
tension: 170,
|
|
friction: 26
|
|
},
|
|
gentle: {
|
|
tension: 120,
|
|
friction: 14
|
|
},
|
|
wobbly: {
|
|
tension: 180,
|
|
friction: 12
|
|
},
|
|
stiff: {
|
|
tension: 210,
|
|
friction: 20
|
|
},
|
|
slow: {
|
|
tension: 280,
|
|
friction: 60
|
|
},
|
|
molasses: {
|
|
tension: 280,
|
|
friction: 120
|
|
}
|
|
};
|
|
|
|
// src/AnimationConfig.ts
|
|
var defaults = objectSpread2(objectSpread2({}, config["default"]), {}, {
|
|
mass: 1,
|
|
damping: 1,
|
|
easing: easings.linear,
|
|
clamp: false
|
|
});
|
|
var AnimationConfig = /*#__PURE__*/createClass(function AnimationConfig() {
|
|
classCallCheck(this, AnimationConfig);
|
|
/**
|
|
* The initial velocity of one or more values.
|
|
*
|
|
* @default 0
|
|
*/
|
|
this.velocity = 0;
|
|
Object.assign(this, defaults);
|
|
});
|
|
function mergeConfig(config2, newConfig, defaultConfig) {
|
|
if (defaultConfig) {
|
|
defaultConfig = objectSpread2({}, defaultConfig);
|
|
sanitizeConfig(defaultConfig, newConfig);
|
|
newConfig = objectSpread2(objectSpread2({}, defaultConfig), newConfig);
|
|
}
|
|
sanitizeConfig(config2, newConfig);
|
|
Object.assign(config2, newConfig);
|
|
for (var key in defaults) {
|
|
if (config2[key] == null) {
|
|
config2[key] = defaults[key];
|
|
}
|
|
}
|
|
var frequency = config2.frequency,
|
|
damping = config2.damping;
|
|
var mass = config2.mass;
|
|
if (!is.und(frequency)) {
|
|
if (frequency < 0.01) frequency = 0.01;
|
|
if (damping < 0) damping = 0;
|
|
config2.tension = Math.pow(2 * Math.PI / frequency, 2) * mass;
|
|
config2.friction = 4 * Math.PI * damping * mass / frequency;
|
|
}
|
|
return config2;
|
|
}
|
|
function sanitizeConfig(config2, props) {
|
|
if (!is.und(props.decay)) {
|
|
config2.duration = void 0;
|
|
} else {
|
|
var isTensionConfig = !is.und(props.tension) || !is.und(props.friction);
|
|
if (isTensionConfig || !is.und(props.frequency) || !is.und(props.damping) || !is.und(props.mass)) {
|
|
config2.duration = void 0;
|
|
config2.decay = void 0;
|
|
}
|
|
if (isTensionConfig) {
|
|
config2.frequency = void 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
// src/Animation.ts
|
|
var emptyArray = [];
|
|
var Animation = /*#__PURE__*/createClass(function Animation() {
|
|
classCallCheck(this, Animation);
|
|
this.changed = false;
|
|
this.values = emptyArray;
|
|
this.toValues = null;
|
|
this.fromValues = emptyArray;
|
|
this.config = new AnimationConfig();
|
|
this.immediate = false;
|
|
});
|
|
|
|
// src/scheduleProps.ts
|
|
|
|
function scheduleProps(callId, _ref) {
|
|
var key = _ref.key,
|
|
props = _ref.props,
|
|
defaultProps = _ref.defaultProps,
|
|
state = _ref.state,
|
|
actions = _ref.actions;
|
|
return new Promise(function (resolve, reject) {
|
|
var _props$cancel;
|
|
var delay;
|
|
var timeout;
|
|
var cancel = matchProp((_props$cancel = props.cancel) !== null && _props$cancel !== void 0 ? _props$cancel : defaultProps === null || defaultProps === void 0 ? void 0 : defaultProps.cancel, key);
|
|
if (cancel) {
|
|
onStart();
|
|
} else {
|
|
if (!is.und(props.pause)) {
|
|
state.paused = matchProp(props.pause, key);
|
|
}
|
|
var pause = defaultProps === null || defaultProps === void 0 ? void 0 : defaultProps.pause;
|
|
if (pause !== true) {
|
|
pause = state.paused || matchProp(pause, key);
|
|
}
|
|
delay = callProp(props.delay || 0, key);
|
|
if (pause) {
|
|
state.resumeQueue.add(onResume);
|
|
actions.pause();
|
|
} else {
|
|
actions.resume();
|
|
onResume();
|
|
}
|
|
}
|
|
function onPause() {
|
|
state.resumeQueue.add(onResume);
|
|
state.timeouts["delete"](timeout);
|
|
timeout.cancel();
|
|
delay = timeout.time - raf.now();
|
|
}
|
|
function onResume() {
|
|
if (delay > 0 && !globals_exports.skipAnimation) {
|
|
state.delayed = true;
|
|
timeout = raf.setTimeout(onStart, delay);
|
|
state.pauseQueue.add(onPause);
|
|
state.timeouts.add(timeout);
|
|
} else {
|
|
onStart();
|
|
}
|
|
}
|
|
function onStart() {
|
|
if (state.delayed) {
|
|
state.delayed = false;
|
|
}
|
|
state.pauseQueue["delete"](onPause);
|
|
state.timeouts["delete"](timeout);
|
|
if (callId <= (state.cancelId || 0)) {
|
|
cancel = true;
|
|
}
|
|
try {
|
|
actions.start(objectSpread2(objectSpread2({}, props), {}, {
|
|
callId: callId,
|
|
cancel: cancel
|
|
}), resolve);
|
|
} catch (err) {
|
|
reject(err);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
// src/runAsync.ts
|
|
|
|
|
|
// src/AnimationResult.ts
|
|
var getCombinedResult = function getCombinedResult(target, results) {
|
|
return results.length == 1 ? results[0] : results.some(function (result) {
|
|
return result.cancelled;
|
|
}) ? getCancelledResult(target.get()) : results.every(function (result) {
|
|
return result.noop;
|
|
}) ? getNoopResult(target.get()) : getFinishedResult(target.get(), results.every(function (result) {
|
|
return result.finished;
|
|
}));
|
|
};
|
|
var getNoopResult = function getNoopResult(value) {
|
|
return {
|
|
value: value,
|
|
noop: true,
|
|
finished: true,
|
|
cancelled: false
|
|
};
|
|
};
|
|
var getFinishedResult = function getFinishedResult(value, finished) {
|
|
var cancelled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
return {
|
|
value: value,
|
|
finished: finished,
|
|
cancelled: cancelled
|
|
};
|
|
};
|
|
var getCancelledResult = function getCancelledResult(value) {
|
|
return {
|
|
value: value,
|
|
cancelled: true,
|
|
finished: false
|
|
};
|
|
};
|
|
|
|
// src/runAsync.ts
|
|
function runAsync(to2, props, state, target) {
|
|
var callId = props.callId,
|
|
parentId = props.parentId,
|
|
onRest = props.onRest;
|
|
var prevTo = state.asyncTo,
|
|
prevPromise = state.promise;
|
|
if (!parentId && to2 === prevTo && !props.reset) {
|
|
return prevPromise;
|
|
}
|
|
return state.promise = asyncToGenerator( /*#__PURE__*/regeneratorRuntime().mark(function _callee3() {
|
|
var defaultProps, preventBail, bail, bailPromise, bailIfEnded, animate, result, animating;
|
|
return regeneratorRuntime().wrap(function _callee3$(_context3) {
|
|
while (1) switch (_context3.prev = _context3.next) {
|
|
case 0:
|
|
state.asyncId = callId;
|
|
state.asyncTo = to2;
|
|
defaultProps = getDefaultProps(props, function (value, key) {
|
|
return (
|
|
// The `onRest` prop is only called when the `runAsync` promise is resolved.
|
|
key === "onRest" ? void 0 : value
|
|
);
|
|
});
|
|
bailPromise = new Promise(function (resolve, reject) {
|
|
return preventBail = resolve, bail = reject;
|
|
});
|
|
bailIfEnded = function bailIfEnded(bailSignal) {
|
|
var bailResult =
|
|
// The `cancel` prop or `stop` method was used.
|
|
callId <= (state.cancelId || 0) && getCancelledResult(target) ||
|
|
// The async `to` prop was replaced.
|
|
callId !== state.asyncId && getFinishedResult(target, false);
|
|
if (bailResult) {
|
|
bailSignal.result = bailResult;
|
|
bail(bailSignal);
|
|
throw bailSignal;
|
|
}
|
|
};
|
|
animate = function animate(arg1, arg2) {
|
|
var bailSignal = new BailSignal();
|
|
var skipAnimationSignal = new SkipAnimationSignal();
|
|
return asyncToGenerator( /*#__PURE__*/regeneratorRuntime().mark(function _callee() {
|
|
var props2, result2;
|
|
return regeneratorRuntime().wrap(function _callee$(_context) {
|
|
while (1) switch (_context.prev = _context.next) {
|
|
case 0:
|
|
if (!globals_exports.skipAnimation) {
|
|
_context.next = 5;
|
|
break;
|
|
}
|
|
stopAsync(state);
|
|
skipAnimationSignal.result = getFinishedResult(target, false);
|
|
bail(skipAnimationSignal);
|
|
throw skipAnimationSignal;
|
|
case 5:
|
|
bailIfEnded(bailSignal);
|
|
props2 = is.obj(arg1) ? objectSpread2({}, arg1) : objectSpread2(objectSpread2({}, arg2), {}, {
|
|
to: arg1
|
|
});
|
|
props2.parentId = callId;
|
|
eachProp(defaultProps, function (value, key) {
|
|
if (is.und(props2[key])) {
|
|
props2[key] = value;
|
|
}
|
|
});
|
|
_context.next = 11;
|
|
return target.start(props2);
|
|
case 11:
|
|
result2 = _context.sent;
|
|
bailIfEnded(bailSignal);
|
|
if (!state.paused) {
|
|
_context.next = 16;
|
|
break;
|
|
}
|
|
_context.next = 16;
|
|
return new Promise(function (resume) {
|
|
state.resumeQueue.add(resume);
|
|
});
|
|
case 16:
|
|
return _context.abrupt("return", result2);
|
|
case 17:
|
|
case "end":
|
|
return _context.stop();
|
|
}
|
|
}, _callee);
|
|
}))();
|
|
};
|
|
if (!globals_exports.skipAnimation) {
|
|
_context3.next = 9;
|
|
break;
|
|
}
|
|
stopAsync(state);
|
|
return _context3.abrupt("return", getFinishedResult(target, false));
|
|
case 9:
|
|
_context3.prev = 9;
|
|
if (is.arr(to2)) {
|
|
animating = function () {
|
|
var _ref4 = asyncToGenerator( /*#__PURE__*/regeneratorRuntime().mark(function _callee2(queue) {
|
|
var _iterator2, _step2, props2;
|
|
return regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
while (1) switch (_context2.prev = _context2.next) {
|
|
case 0:
|
|
_iterator2 = createForOfIteratorHelper(queue);
|
|
_context2.prev = 1;
|
|
_iterator2.s();
|
|
case 3:
|
|
if ((_step2 = _iterator2.n()).done) {
|
|
_context2.next = 9;
|
|
break;
|
|
}
|
|
props2 = _step2.value;
|
|
_context2.next = 7;
|
|
return animate(props2);
|
|
case 7:
|
|
_context2.next = 3;
|
|
break;
|
|
case 9:
|
|
_context2.next = 14;
|
|
break;
|
|
case 11:
|
|
_context2.prev = 11;
|
|
_context2.t0 = _context2["catch"](1);
|
|
_iterator2.e(_context2.t0);
|
|
case 14:
|
|
_context2.prev = 14;
|
|
_iterator2.f();
|
|
return _context2.finish(14);
|
|
case 17:
|
|
case "end":
|
|
return _context2.stop();
|
|
}
|
|
}, _callee2, null, [[1, 11, 14, 17]]);
|
|
}));
|
|
return function (_x) {
|
|
return _ref4.apply(this, arguments);
|
|
};
|
|
}()(to2);
|
|
} else {
|
|
animating = Promise.resolve(to2(animate, target.stop.bind(target)));
|
|
}
|
|
_context3.next = 13;
|
|
return Promise.all([animating.then(preventBail), bailPromise]);
|
|
case 13:
|
|
result = getFinishedResult(target.get(), true, false);
|
|
_context3.next = 27;
|
|
break;
|
|
case 16:
|
|
_context3.prev = 16;
|
|
_context3.t0 = _context3["catch"](9);
|
|
if (!(_context3.t0 instanceof BailSignal)) {
|
|
_context3.next = 22;
|
|
break;
|
|
}
|
|
result = _context3.t0.result;
|
|
_context3.next = 27;
|
|
break;
|
|
case 22:
|
|
if (!(_context3.t0 instanceof SkipAnimationSignal)) {
|
|
_context3.next = 26;
|
|
break;
|
|
}
|
|
result = _context3.t0.result;
|
|
_context3.next = 27;
|
|
break;
|
|
case 26:
|
|
throw _context3.t0;
|
|
case 27:
|
|
_context3.prev = 27;
|
|
if (callId == state.asyncId) {
|
|
state.asyncId = parentId;
|
|
state.asyncTo = parentId ? prevTo : void 0;
|
|
state.promise = parentId ? prevPromise : void 0;
|
|
}
|
|
return _context3.finish(27);
|
|
case 30:
|
|
if (is.fun(onRest)) {
|
|
raf.batchedUpdates(function () {
|
|
onRest(result, target, target.item);
|
|
});
|
|
}
|
|
return _context3.abrupt("return", result);
|
|
case 32:
|
|
case "end":
|
|
return _context3.stop();
|
|
}
|
|
}, _callee3, null, [[9, 16, 27, 30]]);
|
|
}))();
|
|
}
|
|
function stopAsync(state, cancelId) {
|
|
flush(state.timeouts, function (t) {
|
|
return t.cancel();
|
|
});
|
|
state.pauseQueue.clear();
|
|
state.resumeQueue.clear();
|
|
state.asyncId = state.asyncTo = state.promise = void 0;
|
|
if (cancelId) state.cancelId = cancelId;
|
|
}
|
|
var BailSignal = /*#__PURE__*/function (_Error) {
|
|
inherits(BailSignal, _Error);
|
|
var _super = createSuper(BailSignal);
|
|
function BailSignal() {
|
|
classCallCheck(this, BailSignal);
|
|
return _super.call(this, "An async animation has been interrupted. You see this error because you forgot to use `await` or `.catch(...)` on its returned promise.");
|
|
}
|
|
return createClass(BailSignal);
|
|
}( /*#__PURE__*/wrapNativeSuper(Error));
|
|
var SkipAnimationSignal = /*#__PURE__*/function (_Error2) {
|
|
inherits(SkipAnimationSignal, _Error2);
|
|
var _super2 = createSuper(SkipAnimationSignal);
|
|
function SkipAnimationSignal() {
|
|
classCallCheck(this, SkipAnimationSignal);
|
|
return _super2.call(this, "SkipAnimationSignal");
|
|
}
|
|
return createClass(SkipAnimationSignal);
|
|
}( /*#__PURE__*/wrapNativeSuper(Error));
|
|
|
|
// src/FrameValue.ts
|
|
|
|
|
|
var isFrameValue = function isFrameValue(value) {
|
|
return value instanceof FrameValue;
|
|
};
|
|
var nextId = 1;
|
|
var FrameValue = /*#__PURE__*/function (_FluidValue) {
|
|
inherits(FrameValue, _FluidValue);
|
|
var _super3 = createSuper(FrameValue);
|
|
function FrameValue() {
|
|
var _this;
|
|
classCallCheck(this, FrameValue);
|
|
_this = _super3.apply(this, arguments);
|
|
_this.id = nextId++;
|
|
_this._priority = 0;
|
|
return _this;
|
|
}
|
|
createClass(FrameValue, [{
|
|
key: "priority",
|
|
get: function get() {
|
|
return this._priority;
|
|
},
|
|
set: function set(priority) {
|
|
if (this._priority != priority) {
|
|
this._priority = priority;
|
|
this._onPriorityChange(priority);
|
|
}
|
|
}
|
|
/** Get the current value */
|
|
}, {
|
|
key: "get",
|
|
value: function get() {
|
|
var node = getAnimated(this);
|
|
return node && node.getValue();
|
|
}
|
|
/** Create a spring that maps our value to another value */
|
|
}, {
|
|
key: "to",
|
|
value: function to() {
|
|
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
args[_key2] = arguments[_key2];
|
|
}
|
|
return globals_exports.to(this, args);
|
|
}
|
|
/** @deprecated Use the `to` method instead. */
|
|
}, {
|
|
key: "interpolate",
|
|
value: function interpolate() {
|
|
deprecateInterpolate();
|
|
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
|
|
args[_key3] = arguments[_key3];
|
|
}
|
|
return globals_exports.to(this, args);
|
|
}
|
|
}, {
|
|
key: "toJSON",
|
|
value: function toJSON() {
|
|
return this.get();
|
|
}
|
|
}, {
|
|
key: "observerAdded",
|
|
value: function observerAdded(count) {
|
|
if (count == 1) this._attach();
|
|
}
|
|
}, {
|
|
key: "observerRemoved",
|
|
value: function observerRemoved(count) {
|
|
if (count == 0) this._detach();
|
|
}
|
|
/** Called when the first child is added. */
|
|
}, {
|
|
key: "_attach",
|
|
value: function _attach() {}
|
|
/** Called when the last child is removed. */
|
|
}, {
|
|
key: "_detach",
|
|
value: function _detach() {}
|
|
/** Tell our children about our new value */
|
|
}, {
|
|
key: "_onChange",
|
|
value: function _onChange(value) {
|
|
var idle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
callFluidObservers(this, {
|
|
type: "change",
|
|
parent: this,
|
|
value: value,
|
|
idle: idle
|
|
});
|
|
}
|
|
/** Tell our children about our new priority */
|
|
}, {
|
|
key: "_onPriorityChange",
|
|
value: function _onPriorityChange(priority) {
|
|
if (!this.idle) {
|
|
frameLoop.sort(this);
|
|
}
|
|
callFluidObservers(this, {
|
|
type: "priority",
|
|
parent: this,
|
|
priority: priority
|
|
});
|
|
}
|
|
}]);
|
|
return FrameValue;
|
|
}(FluidValue);
|
|
|
|
// src/SpringPhase.ts
|
|
var $P = Symbol["for"]("SpringPhase");
|
|
var HAS_ANIMATED = 1;
|
|
var IS_ANIMATING = 2;
|
|
var IS_PAUSED = 4;
|
|
var hasAnimated = function hasAnimated(target) {
|
|
return (target[$P] & HAS_ANIMATED) > 0;
|
|
};
|
|
var isAnimating = function isAnimating(target) {
|
|
return (target[$P] & IS_ANIMATING) > 0;
|
|
};
|
|
var isPaused = function isPaused(target) {
|
|
return (target[$P] & IS_PAUSED) > 0;
|
|
};
|
|
var setActiveBit = function setActiveBit(target, active) {
|
|
return active ? target[$P] |= IS_ANIMATING | HAS_ANIMATED : target[$P] &= ~IS_ANIMATING;
|
|
};
|
|
var setPausedBit = function setPausedBit(target, paused) {
|
|
return paused ? target[$P] |= IS_PAUSED : target[$P] &= ~IS_PAUSED;
|
|
};
|
|
|
|
// src/SpringValue.ts
|
|
var SpringValue = /*#__PURE__*/function (_FrameValue) {
|
|
inherits(SpringValue, _FrameValue);
|
|
var _super4 = createSuper(SpringValue);
|
|
function SpringValue(arg1, arg2) {
|
|
var _this2;
|
|
classCallCheck(this, SpringValue);
|
|
_this2 = _super4.call(this);
|
|
/** The animation state */
|
|
_this2.animation = new Animation();
|
|
/** Some props have customizable default values */
|
|
_this2.defaultProps = {};
|
|
/** The state for `runAsync` calls */
|
|
_this2._state = {
|
|
paused: false,
|
|
delayed: false,
|
|
pauseQueue: /* @__PURE__ */new Set(),
|
|
resumeQueue: /* @__PURE__ */new Set(),
|
|
timeouts: /* @__PURE__ */new Set()
|
|
};
|
|
/** The promise resolvers of pending `start` calls */
|
|
_this2._pendingCalls = /* @__PURE__ */new Set();
|
|
/** The counter for tracking `scheduleProps` calls */
|
|
_this2._lastCallId = 0;
|
|
/** The last `scheduleProps` call that changed the `to` prop */
|
|
_this2._lastToId = 0;
|
|
_this2._memoizedDuration = 0;
|
|
if (!is.und(arg1) || !is.und(arg2)) {
|
|
var props = is.obj(arg1) ? objectSpread2({}, arg1) : objectSpread2(objectSpread2({}, arg2), {}, {
|
|
from: arg1
|
|
});
|
|
if (is.und(props["default"])) {
|
|
props["default"] = true;
|
|
}
|
|
_this2.start(props);
|
|
}
|
|
return _this2;
|
|
}
|
|
/** Equals true when not advancing on each frame. */
|
|
createClass(SpringValue, [{
|
|
key: "idle",
|
|
get: function get() {
|
|
return !(isAnimating(this) || this._state.asyncTo) || isPaused(this);
|
|
}
|
|
}, {
|
|
key: "goal",
|
|
get: function get() {
|
|
return getFluidValue(this.animation.to);
|
|
}
|
|
}, {
|
|
key: "velocity",
|
|
get: function get() {
|
|
var node = getAnimated(this);
|
|
return node instanceof AnimatedValue ? node.lastVelocity || 0 : node.getPayload().map(function (node2) {
|
|
return node2.lastVelocity || 0;
|
|
});
|
|
}
|
|
/**
|
|
* When true, this value has been animated at least once.
|
|
*/
|
|
}, {
|
|
key: "hasAnimated",
|
|
get: function get() {
|
|
return hasAnimated(this);
|
|
}
|
|
/**
|
|
* When true, this value has an unfinished animation,
|
|
* which is either active or paused.
|
|
*/
|
|
}, {
|
|
key: "isAnimating",
|
|
get: function get() {
|
|
return isAnimating(this);
|
|
}
|
|
/**
|
|
* When true, all current and future animations are paused.
|
|
*/
|
|
}, {
|
|
key: "isPaused",
|
|
get: function get() {
|
|
return isPaused(this);
|
|
}
|
|
/**
|
|
*
|
|
*
|
|
*/
|
|
}, {
|
|
key: "isDelayed",
|
|
get: function get() {
|
|
return this._state.delayed;
|
|
}
|
|
/** Advance the current animation by a number of milliseconds */
|
|
}, {
|
|
key: "advance",
|
|
value: function advance(dt) {
|
|
var _this3 = this;
|
|
var idle = true;
|
|
var changed = false;
|
|
var anim = this.animation;
|
|
var toValues = anim.toValues;
|
|
var config2 = anim.config;
|
|
var payload = getPayload(anim.to);
|
|
if (!payload && hasFluidValue(anim.to)) {
|
|
toValues = toArray(getFluidValue(anim.to));
|
|
}
|
|
anim.values.forEach(function (node2, i) {
|
|
if (node2.done) return;
|
|
var to2 =
|
|
// Animated strings always go from 0 to 1.
|
|
node2.constructor == AnimatedString ? 1 : payload ? payload[i].lastPosition : toValues[i];
|
|
var finished = anim.immediate;
|
|
var position = to2;
|
|
if (!finished) {
|
|
position = node2.lastPosition;
|
|
if (config2.tension <= 0) {
|
|
node2.done = true;
|
|
return;
|
|
}
|
|
var elapsed = node2.elapsedTime += dt;
|
|
var from = anim.fromValues[i];
|
|
var v0 = node2.v0 != null ? node2.v0 : node2.v0 = is.arr(config2.velocity) ? config2.velocity[i] : config2.velocity;
|
|
var velocity;
|
|
var precision = config2.precision || (from == to2 ? 5e-3 : Math.min(1, Math.abs(to2 - from) * 1e-3));
|
|
if (!is.und(config2.duration)) {
|
|
var p = 1;
|
|
if (config2.duration > 0) {
|
|
if (_this3._memoizedDuration !== config2.duration) {
|
|
_this3._memoizedDuration = config2.duration;
|
|
if (node2.durationProgress > 0) {
|
|
node2.elapsedTime = config2.duration * node2.durationProgress;
|
|
elapsed = node2.elapsedTime += dt;
|
|
}
|
|
}
|
|
p = (config2.progress || 0) + elapsed / _this3._memoizedDuration;
|
|
p = p > 1 ? 1 : p < 0 ? 0 : p;
|
|
node2.durationProgress = p;
|
|
}
|
|
position = from + config2.easing(p) * (to2 - from);
|
|
velocity = (position - node2.lastPosition) / dt;
|
|
finished = p == 1;
|
|
} else if (config2.decay) {
|
|
var decay = config2.decay === true ? 0.998 : config2.decay;
|
|
var e = Math.exp(-(1 - decay) * elapsed);
|
|
position = from + v0 / (1 - decay) * (1 - e);
|
|
finished = Math.abs(node2.lastPosition - position) <= precision;
|
|
velocity = v0 * e;
|
|
} else {
|
|
velocity = node2.lastVelocity == null ? v0 : node2.lastVelocity;
|
|
var restVelocity = config2.restVelocity || precision / 10;
|
|
var bounceFactor = config2.clamp ? 0 : config2.bounce;
|
|
var canBounce = !is.und(bounceFactor);
|
|
var isGrowing = from == to2 ? node2.v0 > 0 : from < to2;
|
|
var isMoving;
|
|
var isBouncing = false;
|
|
var step = 1;
|
|
var numSteps = Math.ceil(dt / step);
|
|
for (var n = 0; n < numSteps; ++n) {
|
|
isMoving = Math.abs(velocity) > restVelocity;
|
|
if (!isMoving) {
|
|
finished = Math.abs(to2 - position) <= precision;
|
|
if (finished) {
|
|
break;
|
|
}
|
|
}
|
|
if (canBounce) {
|
|
isBouncing = position == to2 || position > to2 == isGrowing;
|
|
if (isBouncing) {
|
|
velocity = -velocity * bounceFactor;
|
|
position = to2;
|
|
}
|
|
}
|
|
var springForce = -config2.tension * 1e-6 * (position - to2);
|
|
var dampingForce = -config2.friction * 1e-3 * velocity;
|
|
var acceleration = (springForce + dampingForce) / config2.mass;
|
|
velocity = velocity + acceleration * step;
|
|
position = position + velocity * step;
|
|
}
|
|
}
|
|
node2.lastVelocity = velocity;
|
|
if (Number.isNaN(position)) {
|
|
console.warn("Got NaN while animating:", _this3);
|
|
finished = true;
|
|
}
|
|
}
|
|
if (payload && !payload[i].done) {
|
|
finished = false;
|
|
}
|
|
if (finished) {
|
|
node2.done = true;
|
|
} else {
|
|
idle = false;
|
|
}
|
|
if (node2.setValue(position, config2.round)) {
|
|
changed = true;
|
|
}
|
|
});
|
|
var node = getAnimated(this);
|
|
var currVal = node.getValue();
|
|
if (idle) {
|
|
var finalVal = getFluidValue(anim.to);
|
|
if ((currVal !== finalVal || changed) && !config2.decay) {
|
|
node.setValue(finalVal);
|
|
this._onChange(finalVal);
|
|
} else if (changed && config2.decay) {
|
|
this._onChange(currVal);
|
|
}
|
|
this._stop();
|
|
} else if (changed) {
|
|
this._onChange(currVal);
|
|
}
|
|
}
|
|
/** Set the current value, while stopping the current animation */
|
|
}, {
|
|
key: "set",
|
|
value: function set(value) {
|
|
var _this4 = this;
|
|
raf.batchedUpdates(function () {
|
|
_this4._stop();
|
|
_this4._focus(value);
|
|
_this4._set(value);
|
|
});
|
|
return this;
|
|
}
|
|
/**
|
|
* Freeze the active animation in time, as well as any updates merged
|
|
* before `resume` is called.
|
|
*/
|
|
}, {
|
|
key: "pause",
|
|
value: function pause() {
|
|
this._update({
|
|
pause: true
|
|
});
|
|
}
|
|
/** Resume the animation if paused. */
|
|
}, {
|
|
key: "resume",
|
|
value: function resume() {
|
|
this._update({
|
|
pause: false
|
|
});
|
|
}
|
|
/** Skip to the end of the current animation. */
|
|
}, {
|
|
key: "finish",
|
|
value: function finish() {
|
|
var _this5 = this;
|
|
if (isAnimating(this)) {
|
|
var _this$animation = this.animation,
|
|
to2 = _this$animation.to,
|
|
config2 = _this$animation.config;
|
|
raf.batchedUpdates(function () {
|
|
_this5._onStart();
|
|
if (!config2.decay) {
|
|
_this5._set(to2, false);
|
|
}
|
|
_this5._stop();
|
|
});
|
|
}
|
|
return this;
|
|
}
|
|
/** Push props into the pending queue. */
|
|
}, {
|
|
key: "update",
|
|
value: function update(props) {
|
|
var queue = this.queue || (this.queue = []);
|
|
queue.push(props);
|
|
return this;
|
|
}
|
|
}, {
|
|
key: "start",
|
|
value: function start(to2, arg2) {
|
|
var _this6 = this;
|
|
var queue;
|
|
if (!is.und(to2)) {
|
|
queue = [is.obj(to2) ? to2 : objectSpread2(objectSpread2({}, arg2), {}, {
|
|
to: to2
|
|
})];
|
|
} else {
|
|
queue = this.queue || [];
|
|
this.queue = [];
|
|
}
|
|
return Promise.all(queue.map(function (props) {
|
|
var up = _this6._update(props);
|
|
return up;
|
|
})).then(function (results) {
|
|
return getCombinedResult(_this6, results);
|
|
});
|
|
}
|
|
/**
|
|
* Stop the current animation, and cancel any delayed updates.
|
|
*
|
|
* Pass `true` to call `onRest` with `cancelled: true`.
|
|
*/
|
|
}, {
|
|
key: "stop",
|
|
value: function stop(cancel) {
|
|
var _this7 = this;
|
|
var to2 = this.animation.to;
|
|
this._focus(this.get());
|
|
stopAsync(this._state, cancel && this._lastCallId);
|
|
raf.batchedUpdates(function () {
|
|
return _this7._stop(to2, cancel);
|
|
});
|
|
return this;
|
|
}
|
|
/** Restart the animation. */
|
|
}, {
|
|
key: "reset",
|
|
value: function reset() {
|
|
this._update({
|
|
reset: true
|
|
});
|
|
}
|
|
/** @internal */
|
|
}, {
|
|
key: "eventObserved",
|
|
value: function eventObserved(event) {
|
|
if (event.type == "change") {
|
|
this._start();
|
|
} else if (event.type == "priority") {
|
|
this.priority = event.priority + 1;
|
|
}
|
|
}
|
|
/**
|
|
* Parse the `to` and `from` range from the given `props` object.
|
|
*
|
|
* This also ensures the initial value is available to animated components
|
|
* during the render phase.
|
|
*/
|
|
}, {
|
|
key: "_prepareNode",
|
|
value: function _prepareNode(props) {
|
|
var key = this.key || "";
|
|
var to2 = props.to,
|
|
from = props.from;
|
|
to2 = is.obj(to2) ? to2[key] : to2;
|
|
if (to2 == null || isAsyncTo(to2)) {
|
|
to2 = void 0;
|
|
}
|
|
from = is.obj(from) ? from[key] : from;
|
|
if (from == null) {
|
|
from = void 0;
|
|
}
|
|
var range = {
|
|
to: to2,
|
|
from: from
|
|
};
|
|
if (!hasAnimated(this)) {
|
|
if (props.reverse) {
|
|
var _ref5 = [from, to2];
|
|
to2 = _ref5[0];
|
|
from = _ref5[1];
|
|
}
|
|
from = getFluidValue(from);
|
|
if (!is.und(from)) {
|
|
this._set(from);
|
|
} else if (!getAnimated(this)) {
|
|
this._set(to2);
|
|
}
|
|
}
|
|
return range;
|
|
}
|
|
/** Every update is processed by this method before merging. */
|
|
}, {
|
|
key: "_update",
|
|
value: function _update(_ref6, isLoop) {
|
|
var _this8 = this;
|
|
var props = Object.assign({}, (objectDestructuringEmpty(_ref6), _ref6));
|
|
var key = this.key,
|
|
defaultProps = this.defaultProps;
|
|
if (props["default"]) Object.assign(defaultProps, getDefaultProps(props, function (value, prop) {
|
|
return /^on/.test(prop) ? resolveProp(value, key) : value;
|
|
}));
|
|
mergeActiveFn(this, props, "onProps");
|
|
sendEvent(this, "onProps", props, this);
|
|
var range = this._prepareNode(props);
|
|
if (Object.isFrozen(this)) {
|
|
throw Error("Cannot animate a `SpringValue` object that is frozen. Did you forget to pass your component to `animated(...)` before animating its props?");
|
|
}
|
|
var state = this._state;
|
|
return scheduleProps(++this._lastCallId, {
|
|
key: key,
|
|
props: props,
|
|
defaultProps: defaultProps,
|
|
state: state,
|
|
actions: {
|
|
pause: function pause() {
|
|
if (!isPaused(_this8)) {
|
|
setPausedBit(_this8, true);
|
|
flushCalls(state.pauseQueue);
|
|
sendEvent(_this8, "onPause", getFinishedResult(_this8, checkFinished(_this8, _this8.animation.to)), _this8);
|
|
}
|
|
},
|
|
resume: function resume() {
|
|
if (isPaused(_this8)) {
|
|
setPausedBit(_this8, false);
|
|
if (isAnimating(_this8)) {
|
|
_this8._resume();
|
|
}
|
|
flushCalls(state.resumeQueue);
|
|
sendEvent(_this8, "onResume", getFinishedResult(_this8, checkFinished(_this8, _this8.animation.to)), _this8);
|
|
}
|
|
},
|
|
start: this._merge.bind(this, range)
|
|
}
|
|
}).then(function (result) {
|
|
if (props.loop && result.finished && !(isLoop && result.noop)) {
|
|
var nextProps = createLoopUpdate(props);
|
|
if (nextProps) {
|
|
return _this8._update(nextProps, true);
|
|
}
|
|
}
|
|
return result;
|
|
});
|
|
}
|
|
/** Merge props into the current animation */
|
|
}, {
|
|
key: "_merge",
|
|
value: function _merge(range, props, resolve) {
|
|
var _this9 = this;
|
|
if (props.cancel) {
|
|
this.stop(true);
|
|
return resolve(getCancelledResult(this));
|
|
}
|
|
var hasToProp = !is.und(range.to);
|
|
var hasFromProp = !is.und(range.from);
|
|
if (hasToProp || hasFromProp) {
|
|
if (props.callId > this._lastToId) {
|
|
this._lastToId = props.callId;
|
|
} else {
|
|
return resolve(getCancelledResult(this));
|
|
}
|
|
}
|
|
var key = this.key,
|
|
defaultProps = this.defaultProps,
|
|
anim = this.animation;
|
|
var prevTo = anim.to,
|
|
prevFrom = anim.from;
|
|
var _range$to = range.to,
|
|
to2 = _range$to === void 0 ? prevTo : _range$to,
|
|
_range$from = range.from,
|
|
from = _range$from === void 0 ? prevFrom : _range$from;
|
|
if (hasFromProp && !hasToProp && (!props["default"] || is.und(to2))) {
|
|
to2 = from;
|
|
}
|
|
if (props.reverse) {
|
|
var _ref7 = [from, to2];
|
|
to2 = _ref7[0];
|
|
from = _ref7[1];
|
|
}
|
|
var hasFromChanged = !isEqual(from, prevFrom);
|
|
if (hasFromChanged) {
|
|
anim.from = from;
|
|
}
|
|
from = getFluidValue(from);
|
|
var hasToChanged = !isEqual(to2, prevTo);
|
|
if (hasToChanged) {
|
|
this._focus(to2);
|
|
}
|
|
var hasAsyncTo = isAsyncTo(props.to);
|
|
var config2 = anim.config;
|
|
var decay = config2.decay,
|
|
velocity = config2.velocity;
|
|
if (hasToProp || hasFromProp) {
|
|
config2.velocity = 0;
|
|
}
|
|
if (props.config && !hasAsyncTo) {
|
|
mergeConfig(config2, callProp(props.config, key),
|
|
// Avoid calling the same "config" prop twice.
|
|
props.config !== defaultProps.config ? callProp(defaultProps.config, key) : void 0);
|
|
}
|
|
var node = getAnimated(this);
|
|
if (!node || is.und(to2)) {
|
|
return resolve(getFinishedResult(this, true));
|
|
}
|
|
var reset =
|
|
// When `reset` is undefined, the `from` prop implies `reset: true`,
|
|
// except for declarative updates. When `reset` is defined, there
|
|
// must exist a value to animate from.
|
|
is.und(props.reset) ? hasFromProp && !props["default"] : !is.und(from) && matchProp(props.reset, key);
|
|
var value = reset ? from : this.get();
|
|
var goal = computeGoal(to2);
|
|
var isAnimatable = is.num(goal) || is.arr(goal) || isAnimatedString(goal);
|
|
var immediate = !hasAsyncTo && (!isAnimatable || matchProp(defaultProps.immediate || props.immediate, key));
|
|
if (hasToChanged) {
|
|
var nodeType = getAnimatedType(to2);
|
|
if (nodeType !== node.constructor) {
|
|
if (immediate) {
|
|
node = this._set(goal);
|
|
} else throw Error("Cannot animate between ".concat(node.constructor.name, " and ").concat(nodeType.name, ", as the \"to\" prop suggests"));
|
|
}
|
|
}
|
|
var goalType = node.constructor;
|
|
var started = hasFluidValue(to2);
|
|
var finished = false;
|
|
if (!started) {
|
|
var hasValueChanged = reset || !hasAnimated(this) && hasFromChanged;
|
|
if (hasToChanged || hasValueChanged) {
|
|
finished = isEqual(computeGoal(value), goal);
|
|
started = !finished;
|
|
}
|
|
if (!isEqual(anim.immediate, immediate) && !immediate || !isEqual(config2.decay, decay) || !isEqual(config2.velocity, velocity)) {
|
|
started = true;
|
|
}
|
|
}
|
|
if (finished && isAnimating(this)) {
|
|
if (anim.changed && !reset) {
|
|
started = true;
|
|
} else if (!started) {
|
|
this._stop(prevTo);
|
|
}
|
|
}
|
|
if (!hasAsyncTo) {
|
|
if (started || hasFluidValue(prevTo)) {
|
|
anim.values = node.getPayload();
|
|
anim.toValues = hasFluidValue(to2) ? null : goalType == AnimatedString ? [1] : toArray(goal);
|
|
}
|
|
if (anim.immediate != immediate) {
|
|
anim.immediate = immediate;
|
|
if (!immediate && !reset) {
|
|
this._set(prevTo);
|
|
}
|
|
}
|
|
if (started) {
|
|
var onRest = anim.onRest;
|
|
react_spring_shared_modern_each(ACTIVE_EVENTS, function (type) {
|
|
return mergeActiveFn(_this9, props, type);
|
|
});
|
|
var result = getFinishedResult(this, checkFinished(this, prevTo));
|
|
flushCalls(this._pendingCalls, result);
|
|
this._pendingCalls.add(resolve);
|
|
if (anim.changed) raf.batchedUpdates(function () {
|
|
anim.changed = !reset;
|
|
onRest === null || onRest === void 0 || onRest(result, _this9);
|
|
if (reset) {
|
|
callProp(defaultProps.onRest, result);
|
|
} else {
|
|
var _anim$onStart;
|
|
(_anim$onStart = anim.onStart) === null || _anim$onStart === void 0 || _anim$onStart.call(anim, result, _this9);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
if (reset) {
|
|
this._set(value);
|
|
}
|
|
if (hasAsyncTo) {
|
|
resolve(runAsync(props.to, props, this._state, this));
|
|
} else if (started) {
|
|
this._start();
|
|
} else if (isAnimating(this) && !hasToChanged) {
|
|
this._pendingCalls.add(resolve);
|
|
} else {
|
|
resolve(getNoopResult(value));
|
|
}
|
|
}
|
|
/** Update the `animation.to` value, which might be a `FluidValue` */
|
|
}, {
|
|
key: "_focus",
|
|
value: function _focus(value) {
|
|
var anim = this.animation;
|
|
if (value !== anim.to) {
|
|
if (getFluidObservers(this)) {
|
|
this._detach();
|
|
}
|
|
anim.to = value;
|
|
if (getFluidObservers(this)) {
|
|
this._attach();
|
|
}
|
|
}
|
|
}
|
|
}, {
|
|
key: "_attach",
|
|
value: function _attach() {
|
|
var priority = 0;
|
|
var to2 = this.animation.to;
|
|
if (hasFluidValue(to2)) {
|
|
addFluidObserver(to2, this);
|
|
if (isFrameValue(to2)) {
|
|
priority = to2.priority + 1;
|
|
}
|
|
}
|
|
this.priority = priority;
|
|
}
|
|
}, {
|
|
key: "_detach",
|
|
value: function _detach() {
|
|
var to2 = this.animation.to;
|
|
if (hasFluidValue(to2)) {
|
|
removeFluidObserver(to2, this);
|
|
}
|
|
}
|
|
/**
|
|
* Update the current value from outside the frameloop,
|
|
* and return the `Animated` node.
|
|
*/
|
|
}, {
|
|
key: "_set",
|
|
value: function _set(arg) {
|
|
var _this10 = this;
|
|
var idle = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
var value = getFluidValue(arg);
|
|
if (!is.und(value)) {
|
|
var oldNode = getAnimated(this);
|
|
if (!oldNode || !isEqual(value, oldNode.getValue())) {
|
|
var nodeType = getAnimatedType(value);
|
|
if (!oldNode || oldNode.constructor != nodeType) {
|
|
setAnimated(this, nodeType.create(value));
|
|
} else {
|
|
oldNode.setValue(value);
|
|
}
|
|
if (oldNode) {
|
|
raf.batchedUpdates(function () {
|
|
_this10._onChange(value, idle);
|
|
});
|
|
}
|
|
}
|
|
}
|
|
return getAnimated(this);
|
|
}
|
|
}, {
|
|
key: "_onStart",
|
|
value: function _onStart() {
|
|
var anim = this.animation;
|
|
if (!anim.changed) {
|
|
anim.changed = true;
|
|
sendEvent(this, "onStart", getFinishedResult(this, checkFinished(this, anim.to)), this);
|
|
}
|
|
}
|
|
}, {
|
|
key: "_onChange",
|
|
value: function _onChange(value, idle) {
|
|
if (!idle) {
|
|
this._onStart();
|
|
callProp(this.animation.onChange, value, this);
|
|
}
|
|
callProp(this.defaultProps.onChange, value, this);
|
|
get(getPrototypeOf(SpringValue.prototype), "_onChange", this).call(this, value, idle);
|
|
}
|
|
// This method resets the animation state (even if already animating) to
|
|
// ensure the latest from/to range is used, and it also ensures this spring
|
|
// is added to the frameloop.
|
|
}, {
|
|
key: "_start",
|
|
value: function _start() {
|
|
var anim = this.animation;
|
|
getAnimated(this).reset(getFluidValue(anim.to));
|
|
if (!anim.immediate) {
|
|
anim.fromValues = anim.values.map(function (node) {
|
|
return node.lastPosition;
|
|
});
|
|
}
|
|
if (!isAnimating(this)) {
|
|
setActiveBit(this, true);
|
|
if (!isPaused(this)) {
|
|
this._resume();
|
|
}
|
|
}
|
|
}
|
|
}, {
|
|
key: "_resume",
|
|
value: function _resume() {
|
|
if (globals_exports.skipAnimation) {
|
|
this.finish();
|
|
} else {
|
|
frameLoop.start(this);
|
|
}
|
|
}
|
|
/**
|
|
* Exit the frameloop and notify `onRest` listeners.
|
|
*
|
|
* Always wrap `_stop` calls with `batchedUpdates`.
|
|
*/
|
|
}, {
|
|
key: "_stop",
|
|
value: function _stop(goal, cancel) {
|
|
if (isAnimating(this)) {
|
|
setActiveBit(this, false);
|
|
var anim = this.animation;
|
|
react_spring_shared_modern_each(anim.values, function (node) {
|
|
node.done = true;
|
|
});
|
|
if (anim.toValues) {
|
|
anim.onChange = anim.onPause = anim.onResume = void 0;
|
|
}
|
|
callFluidObservers(this, {
|
|
type: "idle",
|
|
parent: this
|
|
});
|
|
var result = cancel ? getCancelledResult(this.get()) : getFinishedResult(this.get(), checkFinished(this, goal !== null && goal !== void 0 ? goal : anim.to));
|
|
flushCalls(this._pendingCalls, result);
|
|
if (anim.changed) {
|
|
anim.changed = false;
|
|
sendEvent(this, "onRest", result, this);
|
|
}
|
|
}
|
|
}
|
|
}]);
|
|
return SpringValue;
|
|
}(FrameValue);
|
|
function checkFinished(target, to2) {
|
|
var goal = computeGoal(to2);
|
|
var value = computeGoal(target.get());
|
|
return isEqual(value, goal);
|
|
}
|
|
function createLoopUpdate(props) {
|
|
var loop = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : props.loop;
|
|
var to2 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : props.to;
|
|
var loopRet = callProp(loop);
|
|
if (loopRet) {
|
|
var overrides = loopRet !== true && inferTo(loopRet);
|
|
var reverse = (overrides || props).reverse;
|
|
var reset = !overrides || overrides.reset;
|
|
return createUpdate(objectSpread2(objectSpread2({}, props), {}, {
|
|
loop: loop,
|
|
// Avoid updating default props when looping.
|
|
"default": false,
|
|
// Never loop the `pause` prop.
|
|
pause: void 0,
|
|
// For the "reverse" prop to loop as expected, the "to" prop
|
|
// must be undefined. The "reverse" prop is ignored when the
|
|
// "to" prop is an array or function.
|
|
to: !reverse || isAsyncTo(to2) ? to2 : void 0,
|
|
// Ignore the "from" prop except on reset.
|
|
from: reset ? props.from : void 0,
|
|
reset: reset
|
|
}, overrides));
|
|
}
|
|
}
|
|
function createUpdate(props) {
|
|
var _props = props = inferTo(props),
|
|
to2 = _props.to,
|
|
from = _props.from;
|
|
var keys = /* @__PURE__ */new Set();
|
|
if (is.obj(to2)) findDefined(to2, keys);
|
|
if (is.obj(from)) findDefined(from, keys);
|
|
props.keys = keys.size ? Array.from(keys) : null;
|
|
return props;
|
|
}
|
|
function declareUpdate(props) {
|
|
var update2 = createUpdate(props);
|
|
if (is.und(update2["default"])) {
|
|
update2["default"] = getDefaultProps(update2);
|
|
}
|
|
return update2;
|
|
}
|
|
function findDefined(values, keys) {
|
|
eachProp(values, function (value, key) {
|
|
return value != null && keys.add(key);
|
|
});
|
|
}
|
|
var ACTIVE_EVENTS = ["onStart", "onRest", "onChange", "onPause", "onResume"];
|
|
function mergeActiveFn(target, props, type) {
|
|
target.animation[type] = props[type] !== getDefaultProp(props, type) ? resolveProp(props[type], target.key) : void 0;
|
|
}
|
|
function sendEvent(target, type) {
|
|
var _target$animation$typ, _target$animation, _target$defaultProps$, _target$defaultProps;
|
|
for (var _len4 = arguments.length, args = new Array(_len4 > 2 ? _len4 - 2 : 0), _key4 = 2; _key4 < _len4; _key4++) {
|
|
args[_key4 - 2] = arguments[_key4];
|
|
}
|
|
(_target$animation$typ = (_target$animation = target.animation)[type]) === null || _target$animation$typ === void 0 || _target$animation$typ.call.apply(_target$animation$typ, [_target$animation].concat(args));
|
|
(_target$defaultProps$ = (_target$defaultProps = target.defaultProps)[type]) === null || _target$defaultProps$ === void 0 || _target$defaultProps$.call.apply(_target$defaultProps$, [_target$defaultProps].concat(args));
|
|
}
|
|
|
|
// src/Controller.ts
|
|
|
|
var BATCHED_EVENTS = ["onStart", "onChange", "onRest"];
|
|
var nextId2 = 1;
|
|
var Controller = /*#__PURE__*/function () {
|
|
function Controller(props, flush3) {
|
|
classCallCheck(this, Controller);
|
|
this.id = nextId2++;
|
|
/** The animated values */
|
|
this.springs = {};
|
|
/** The queue of props passed to the `update` method. */
|
|
this.queue = [];
|
|
/** The counter for tracking `scheduleProps` calls */
|
|
this._lastAsyncId = 0;
|
|
/** The values currently being animated */
|
|
this._active = /* @__PURE__ */new Set();
|
|
/** The values that changed recently */
|
|
this._changed = /* @__PURE__ */new Set();
|
|
/** Equals false when `onStart` listeners can be called */
|
|
this._started = false;
|
|
/** State used by the `runAsync` function */
|
|
this._state = {
|
|
paused: false,
|
|
pauseQueue: /* @__PURE__ */new Set(),
|
|
resumeQueue: /* @__PURE__ */new Set(),
|
|
timeouts: /* @__PURE__ */new Set()
|
|
};
|
|
/** The event queues that are flushed once per frame maximum */
|
|
this._events = {
|
|
onStart: /* @__PURE__ */new Map(),
|
|
onChange: /* @__PURE__ */new Map(),
|
|
onRest: /* @__PURE__ */new Map()
|
|
};
|
|
this._onFrame = this._onFrame.bind(this);
|
|
if (flush3) {
|
|
this._flush = flush3;
|
|
}
|
|
if (props) {
|
|
this.start(objectSpread2({
|
|
"default": true
|
|
}, props));
|
|
}
|
|
}
|
|
/**
|
|
* Equals `true` when no spring values are in the frameloop, and
|
|
* no async animation is currently active.
|
|
*/
|
|
createClass(Controller, [{
|
|
key: "idle",
|
|
get: function get() {
|
|
return !this._state.asyncTo && Object.values(this.springs).every(function (spring) {
|
|
return spring.idle && !spring.isDelayed && !spring.isPaused;
|
|
});
|
|
}
|
|
}, {
|
|
key: "item",
|
|
get: function get() {
|
|
return this._item;
|
|
},
|
|
set: function set(item) {
|
|
this._item = item;
|
|
}
|
|
/** Get the current values of our springs */
|
|
}, {
|
|
key: "get",
|
|
value: function get() {
|
|
var values = {};
|
|
this.each(function (spring, key) {
|
|
return values[key] = spring.get();
|
|
});
|
|
return values;
|
|
}
|
|
/** Set the current values without animating. */
|
|
}, {
|
|
key: "set",
|
|
value: function set(values) {
|
|
for (var key in values) {
|
|
var value = values[key];
|
|
if (!is.und(value)) {
|
|
this.springs[key].set(value);
|
|
}
|
|
}
|
|
}
|
|
/** Push an update onto the queue of each value. */
|
|
}, {
|
|
key: "update",
|
|
value: function update(props) {
|
|
if (props) {
|
|
this.queue.push(createUpdate(props));
|
|
}
|
|
return this;
|
|
}
|
|
/**
|
|
* Start the queued animations for every spring, and resolve the returned
|
|
* promise once all queued animations have finished or been cancelled.
|
|
*
|
|
* When you pass a queue (instead of nothing), that queue is used instead of
|
|
* the queued animations added with the `update` method, which are left alone.
|
|
*/
|
|
}, {
|
|
key: "start",
|
|
value: function start(props) {
|
|
var queue = this.queue;
|
|
if (props) {
|
|
queue = toArray(props).map(createUpdate);
|
|
} else {
|
|
this.queue = [];
|
|
}
|
|
if (this._flush) {
|
|
return this._flush(this, queue);
|
|
}
|
|
prepareKeys(this, queue);
|
|
return flushUpdateQueue(this, queue);
|
|
}
|
|
/** @internal */
|
|
}, {
|
|
key: "stop",
|
|
value: function stop(arg, keys) {
|
|
if (arg !== !!arg) {
|
|
keys = arg;
|
|
}
|
|
if (keys) {
|
|
var springs = this.springs;
|
|
react_spring_shared_modern_each(toArray(keys), function (key) {
|
|
return springs[key].stop(!!arg);
|
|
});
|
|
} else {
|
|
stopAsync(this._state, this._lastAsyncId);
|
|
this.each(function (spring) {
|
|
return spring.stop(!!arg);
|
|
});
|
|
}
|
|
return this;
|
|
}
|
|
/** Freeze the active animation in time */
|
|
}, {
|
|
key: "pause",
|
|
value: function pause(keys) {
|
|
if (is.und(keys)) {
|
|
this.start({
|
|
pause: true
|
|
});
|
|
} else {
|
|
var springs = this.springs;
|
|
react_spring_shared_modern_each(toArray(keys), function (key) {
|
|
return springs[key].pause();
|
|
});
|
|
}
|
|
return this;
|
|
}
|
|
/** Resume the animation if paused. */
|
|
}, {
|
|
key: "resume",
|
|
value: function resume(keys) {
|
|
if (is.und(keys)) {
|
|
this.start({
|
|
pause: false
|
|
});
|
|
} else {
|
|
var springs = this.springs;
|
|
react_spring_shared_modern_each(toArray(keys), function (key) {
|
|
return springs[key].resume();
|
|
});
|
|
}
|
|
return this;
|
|
}
|
|
/** Call a function once per spring value */
|
|
}, {
|
|
key: "each",
|
|
value: function each(iterator) {
|
|
eachProp(this.springs, iterator);
|
|
}
|
|
/** @internal Called at the end of every animation frame */
|
|
}, {
|
|
key: "_onFrame",
|
|
value: function _onFrame() {
|
|
var _this11 = this;
|
|
var _this$_events = this._events,
|
|
onStart = _this$_events.onStart,
|
|
onChange = _this$_events.onChange,
|
|
onRest = _this$_events.onRest;
|
|
var active = this._active.size > 0;
|
|
var changed = this._changed.size > 0;
|
|
if (active && !this._started || changed && !this._started) {
|
|
this._started = true;
|
|
flush(onStart, function (_ref8) {
|
|
var _ref9 = slicedToArray(_ref8, 2),
|
|
onStart2 = _ref9[0],
|
|
result = _ref9[1];
|
|
result.value = _this11.get();
|
|
onStart2(result, _this11, _this11._item);
|
|
});
|
|
}
|
|
var idle = !active && this._started;
|
|
var values = changed || idle && onRest.size ? this.get() : null;
|
|
if (changed && onChange.size) {
|
|
flush(onChange, function (_ref10) {
|
|
var _ref11 = slicedToArray(_ref10, 2),
|
|
onChange2 = _ref11[0],
|
|
result = _ref11[1];
|
|
result.value = values;
|
|
onChange2(result, _this11, _this11._item);
|
|
});
|
|
}
|
|
if (idle) {
|
|
this._started = false;
|
|
flush(onRest, function (_ref12) {
|
|
var _ref13 = slicedToArray(_ref12, 2),
|
|
onRest2 = _ref13[0],
|
|
result = _ref13[1];
|
|
result.value = values;
|
|
onRest2(result, _this11, _this11._item);
|
|
});
|
|
}
|
|
}
|
|
/** @internal */
|
|
}, {
|
|
key: "eventObserved",
|
|
value: function eventObserved(event) {
|
|
if (event.type == "change") {
|
|
this._changed.add(event.parent);
|
|
if (!event.idle) {
|
|
this._active.add(event.parent);
|
|
}
|
|
} else if (event.type == "idle") {
|
|
this._active["delete"](event.parent);
|
|
} else return;
|
|
raf.onFrame(this._onFrame);
|
|
}
|
|
}]);
|
|
return Controller;
|
|
}();
|
|
function flushUpdateQueue(ctrl, queue) {
|
|
return Promise.all(queue.map(function (props) {
|
|
return flushUpdate(ctrl, props);
|
|
})).then(function (results) {
|
|
return getCombinedResult(ctrl, results);
|
|
});
|
|
}
|
|
function flushUpdate(_x2, _x3, _x4) {
|
|
return _flushUpdate.apply(this, arguments);
|
|
}
|
|
function _flushUpdate() {
|
|
_flushUpdate = asyncToGenerator( /*#__PURE__*/regeneratorRuntime().mark(function _callee4(ctrl, props, isLoop) {
|
|
var keys, to2, from, loop, onRest, onResolve, defaults2, asyncTo, state, promises, cancel, result, nextProps;
|
|
return regeneratorRuntime().wrap(function _callee4$(_context4) {
|
|
while (1) switch (_context4.prev = _context4.next) {
|
|
case 0:
|
|
keys = props.keys, to2 = props.to, from = props.from, loop = props.loop, onRest = props.onRest, onResolve = props.onResolve;
|
|
defaults2 = is.obj(props["default"]) && props["default"];
|
|
if (loop) {
|
|
props.loop = false;
|
|
}
|
|
if (to2 === false) props.to = null;
|
|
if (from === false) props.from = null;
|
|
asyncTo = is.arr(to2) || is.fun(to2) ? to2 : void 0;
|
|
if (asyncTo) {
|
|
props.to = void 0;
|
|
props.onRest = void 0;
|
|
if (defaults2) {
|
|
defaults2.onRest = void 0;
|
|
}
|
|
} else {
|
|
react_spring_shared_modern_each(BATCHED_EVENTS, function (key) {
|
|
var handler = props[key];
|
|
if (is.fun(handler)) {
|
|
var queue = ctrl["_events"][key];
|
|
props[key] = function (_ref29) {
|
|
var finished = _ref29.finished,
|
|
cancelled = _ref29.cancelled;
|
|
var result2 = queue.get(handler);
|
|
if (result2) {
|
|
if (!finished) result2.finished = false;
|
|
if (cancelled) result2.cancelled = true;
|
|
} else {
|
|
queue.set(handler, {
|
|
value: null,
|
|
finished: finished || false,
|
|
cancelled: cancelled || false
|
|
});
|
|
}
|
|
};
|
|
if (defaults2) {
|
|
defaults2[key] = props[key];
|
|
}
|
|
}
|
|
});
|
|
}
|
|
state = ctrl["_state"];
|
|
if (props.pause === !state.paused) {
|
|
state.paused = props.pause;
|
|
flushCalls(props.pause ? state.pauseQueue : state.resumeQueue);
|
|
} else if (state.paused) {
|
|
props.pause = true;
|
|
}
|
|
promises = (keys || Object.keys(ctrl.springs)).map(function (key) {
|
|
return ctrl.springs[key].start(props);
|
|
});
|
|
cancel = props.cancel === true || getDefaultProp(props, "cancel") === true;
|
|
if (asyncTo || cancel && state.asyncId) {
|
|
promises.push(scheduleProps(++ctrl["_lastAsyncId"], {
|
|
props: props,
|
|
state: state,
|
|
actions: {
|
|
pause: noop,
|
|
resume: noop,
|
|
start: function start(props2, resolve) {
|
|
if (cancel) {
|
|
stopAsync(state, ctrl["_lastAsyncId"]);
|
|
resolve(getCancelledResult(ctrl));
|
|
} else {
|
|
props2.onRest = onRest;
|
|
resolve(runAsync(asyncTo, props2, state, ctrl));
|
|
}
|
|
}
|
|
}
|
|
}));
|
|
}
|
|
if (!state.paused) {
|
|
_context4.next = 15;
|
|
break;
|
|
}
|
|
_context4.next = 15;
|
|
return new Promise(function (resume) {
|
|
state.resumeQueue.add(resume);
|
|
});
|
|
case 15:
|
|
_context4.t0 = getCombinedResult;
|
|
_context4.t1 = ctrl;
|
|
_context4.next = 19;
|
|
return Promise.all(promises);
|
|
case 19:
|
|
_context4.t2 = _context4.sent;
|
|
result = (0, _context4.t0)(_context4.t1, _context4.t2);
|
|
if (!(loop && result.finished && !(isLoop && result.noop))) {
|
|
_context4.next = 26;
|
|
break;
|
|
}
|
|
nextProps = createLoopUpdate(props, loop, to2);
|
|
if (!nextProps) {
|
|
_context4.next = 26;
|
|
break;
|
|
}
|
|
prepareKeys(ctrl, [nextProps]);
|
|
return _context4.abrupt("return", flushUpdate(ctrl, nextProps, true));
|
|
case 26:
|
|
if (onResolve) {
|
|
raf.batchedUpdates(function () {
|
|
return onResolve(result, ctrl, ctrl.item);
|
|
});
|
|
}
|
|
return _context4.abrupt("return", result);
|
|
case 28:
|
|
case "end":
|
|
return _context4.stop();
|
|
}
|
|
}, _callee4);
|
|
}));
|
|
return _flushUpdate.apply(this, arguments);
|
|
}
|
|
function getSprings(ctrl, props) {
|
|
var springs = objectSpread2({}, ctrl.springs);
|
|
if (props) {
|
|
react_spring_shared_modern_each(toArray(props), function (props2) {
|
|
if (is.und(props2.keys)) {
|
|
props2 = createUpdate(props2);
|
|
}
|
|
if (!is.obj(props2.to)) {
|
|
props2 = objectSpread2(objectSpread2({}, props2), {}, {
|
|
to: void 0
|
|
});
|
|
}
|
|
prepareSprings(springs, props2, function (key) {
|
|
return createSpring(key);
|
|
});
|
|
});
|
|
}
|
|
setSprings(ctrl, springs);
|
|
return springs;
|
|
}
|
|
function setSprings(ctrl, springs) {
|
|
eachProp(springs, function (spring, key) {
|
|
if (!ctrl.springs[key]) {
|
|
ctrl.springs[key] = spring;
|
|
addFluidObserver(spring, ctrl);
|
|
}
|
|
});
|
|
}
|
|
function createSpring(key, observer) {
|
|
var spring = new SpringValue();
|
|
spring.key = key;
|
|
if (observer) {
|
|
addFluidObserver(spring, observer);
|
|
}
|
|
return spring;
|
|
}
|
|
function prepareSprings(springs, props, create) {
|
|
if (props.keys) {
|
|
react_spring_shared_modern_each(props.keys, function (key) {
|
|
var spring = springs[key] || (springs[key] = create(key));
|
|
spring["_prepareNode"](props);
|
|
});
|
|
}
|
|
}
|
|
function prepareKeys(ctrl, queue) {
|
|
react_spring_shared_modern_each(queue, function (props) {
|
|
prepareSprings(ctrl.springs, props, function (key) {
|
|
return createSpring(key, ctrl);
|
|
});
|
|
});
|
|
}
|
|
|
|
// src/SpringContext.tsx
|
|
|
|
|
|
|
|
var SpringContext = function SpringContext(_ref14) {
|
|
var children = _ref14.children,
|
|
props = objectWithoutProperties(_ref14, _excluded);
|
|
var inherited = (0,_react_17_0_2_react.useContext)(ctx);
|
|
var pause = props.pause || !!inherited.pause,
|
|
immediate = props.immediate || !!inherited.immediate;
|
|
props = useMemoOne(function () {
|
|
return {
|
|
pause: pause,
|
|
immediate: immediate
|
|
};
|
|
}, [pause, immediate]);
|
|
var Provider = ctx.Provider;
|
|
return /* @__PURE__ */_react_17_0_2_react.createElement(Provider, {
|
|
value: props
|
|
}, children);
|
|
};
|
|
var ctx = makeContext(SpringContext, {});
|
|
SpringContext.Provider = ctx.Provider;
|
|
SpringContext.Consumer = ctx.Consumer;
|
|
function makeContext(target, init) {
|
|
Object.assign(target, /*#__PURE__*/_react_17_0_2_react.createContext(init));
|
|
target.Provider._context = target;
|
|
target.Consumer._context = target;
|
|
return target;
|
|
}
|
|
|
|
// src/SpringRef.ts
|
|
|
|
var SpringRef = function SpringRef() {
|
|
var current = [];
|
|
var SpringRef2 = function SpringRef2(props) {
|
|
deprecateDirectCall();
|
|
var results = [];
|
|
react_spring_shared_modern_each(current, function (ctrl, i) {
|
|
if (is.und(props)) {
|
|
results.push(ctrl.start());
|
|
} else {
|
|
var update2 = _getProps(props, ctrl, i);
|
|
if (update2) {
|
|
results.push(ctrl.start(update2));
|
|
}
|
|
}
|
|
});
|
|
return results;
|
|
};
|
|
SpringRef2.current = current;
|
|
SpringRef2.add = function (ctrl) {
|
|
if (!current.includes(ctrl)) {
|
|
current.push(ctrl);
|
|
}
|
|
};
|
|
SpringRef2["delete"] = function (ctrl) {
|
|
var i = current.indexOf(ctrl);
|
|
if (~i) current.splice(i, 1);
|
|
};
|
|
SpringRef2.pause = function () {
|
|
var _arguments = arguments;
|
|
react_spring_shared_modern_each(current, function (ctrl) {
|
|
return ctrl.pause.apply(ctrl, toConsumableArray(_arguments));
|
|
});
|
|
return this;
|
|
};
|
|
SpringRef2.resume = function () {
|
|
var _arguments2 = arguments;
|
|
react_spring_shared_modern_each(current, function (ctrl) {
|
|
return ctrl.resume.apply(ctrl, toConsumableArray(_arguments2));
|
|
});
|
|
return this;
|
|
};
|
|
SpringRef2.set = function (values) {
|
|
react_spring_shared_modern_each(current, function (ctrl, i) {
|
|
var update2 = is.fun(values) ? values(i, ctrl) : values;
|
|
if (update2) {
|
|
ctrl.set(update2);
|
|
}
|
|
});
|
|
};
|
|
SpringRef2.start = function (props) {
|
|
var _this12 = this;
|
|
var results = [];
|
|
react_spring_shared_modern_each(current, function (ctrl, i) {
|
|
if (is.und(props)) {
|
|
results.push(ctrl.start());
|
|
} else {
|
|
var update2 = _this12._getProps(props, ctrl, i);
|
|
if (update2) {
|
|
results.push(ctrl.start(update2));
|
|
}
|
|
}
|
|
});
|
|
return results;
|
|
};
|
|
SpringRef2.stop = function () {
|
|
var _arguments3 = arguments;
|
|
react_spring_shared_modern_each(current, function (ctrl) {
|
|
return ctrl.stop.apply(ctrl, toConsumableArray(_arguments3));
|
|
});
|
|
return this;
|
|
};
|
|
SpringRef2.update = function (props) {
|
|
var _this13 = this;
|
|
react_spring_shared_modern_each(current, function (ctrl, i) {
|
|
return ctrl.update(_this13._getProps(props, ctrl, i));
|
|
});
|
|
return this;
|
|
};
|
|
var _getProps = function _getProps(arg, ctrl, index) {
|
|
return is.fun(arg) ? arg(index, ctrl) : arg;
|
|
};
|
|
SpringRef2._getProps = _getProps;
|
|
return SpringRef2;
|
|
};
|
|
|
|
// src/hooks/useSprings.ts
|
|
function useSprings(length, props, deps) {
|
|
var _arguments4 = arguments;
|
|
var propsFn = is.fun(props) && props;
|
|
if (propsFn && !deps) deps = [];
|
|
var ref = (0,_react_17_0_2_react.useMemo)(function () {
|
|
return propsFn || _arguments4.length == 3 ? SpringRef() : void 0;
|
|
}, []);
|
|
var layoutId = (0,_react_17_0_2_react.useRef)(0);
|
|
var forceUpdate = useForceUpdate();
|
|
var state = (0,_react_17_0_2_react.useMemo)(function () {
|
|
return {
|
|
ctrls: [],
|
|
queue: [],
|
|
flush: function flush(ctrl, updates2) {
|
|
var springs2 = getSprings(ctrl, updates2);
|
|
var canFlushSync = layoutId.current > 0 && !state.queue.length && !Object.keys(springs2).some(function (key) {
|
|
return !ctrl.springs[key];
|
|
});
|
|
return canFlushSync ? flushUpdateQueue(ctrl, updates2) : new Promise(function (resolve) {
|
|
setSprings(ctrl, springs2);
|
|
state.queue.push(function () {
|
|
resolve(flushUpdateQueue(ctrl, updates2));
|
|
});
|
|
forceUpdate();
|
|
});
|
|
}
|
|
};
|
|
}, []);
|
|
var ctrls = (0,_react_17_0_2_react.useRef)(toConsumableArray(state.ctrls));
|
|
var updates = [];
|
|
var prevLength = usePrev(length) || 0;
|
|
(0,_react_17_0_2_react.useMemo)(function () {
|
|
react_spring_shared_modern_each(ctrls.current.slice(length, prevLength), function (ctrl) {
|
|
detachRefs(ctrl, ref);
|
|
ctrl.stop(true);
|
|
});
|
|
ctrls.current.length = length;
|
|
declareUpdates(prevLength, length);
|
|
}, [length]);
|
|
(0,_react_17_0_2_react.useMemo)(function () {
|
|
declareUpdates(0, Math.min(prevLength, length));
|
|
}, deps);
|
|
function declareUpdates(startIndex, endIndex) {
|
|
for (var i = startIndex; i < endIndex; i++) {
|
|
var ctrl = ctrls.current[i] || (ctrls.current[i] = new Controller(null, state.flush));
|
|
var update2 = propsFn ? propsFn(i, ctrl) : props[i];
|
|
if (update2) {
|
|
updates[i] = declareUpdate(update2);
|
|
}
|
|
}
|
|
}
|
|
var springs = ctrls.current.map(function (ctrl, i) {
|
|
return getSprings(ctrl, updates[i]);
|
|
});
|
|
var context = (0,_react_17_0_2_react.useContext)(SpringContext);
|
|
var prevContext = usePrev(context);
|
|
var hasContext = context !== prevContext && hasProps(context);
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
layoutId.current++;
|
|
state.ctrls = ctrls.current;
|
|
var queue = state.queue;
|
|
if (queue.length) {
|
|
state.queue = [];
|
|
react_spring_shared_modern_each(queue, function (cb) {
|
|
return cb();
|
|
});
|
|
}
|
|
react_spring_shared_modern_each(ctrls.current, function (ctrl, i) {
|
|
ref === null || ref === void 0 || ref.add(ctrl);
|
|
if (hasContext) {
|
|
ctrl.start({
|
|
"default": context
|
|
});
|
|
}
|
|
var update2 = updates[i];
|
|
if (update2) {
|
|
replaceRef(ctrl, update2.ref);
|
|
if (ctrl.ref) {
|
|
ctrl.queue.push(update2);
|
|
} else {
|
|
ctrl.start(update2);
|
|
}
|
|
}
|
|
});
|
|
});
|
|
useOnce(function () {
|
|
return function () {
|
|
react_spring_shared_modern_each(state.ctrls, function (ctrl) {
|
|
return ctrl.stop(true);
|
|
});
|
|
};
|
|
});
|
|
var values = springs.map(function (x) {
|
|
return objectSpread2({}, x);
|
|
});
|
|
return ref ? [values, ref] : values;
|
|
}
|
|
|
|
// src/hooks/useSpring.ts
|
|
function useSpring(props, deps) {
|
|
var isFn = is.fun(props);
|
|
var _useSprings = useSprings(1, isFn ? props : [props], isFn ? deps || [] : deps),
|
|
_useSprings2 = slicedToArray(_useSprings, 2),
|
|
_useSprings2$ = slicedToArray(_useSprings2[0], 1),
|
|
values = _useSprings2$[0],
|
|
ref = _useSprings2[1];
|
|
return isFn || arguments.length == 2 ? [values, ref] : values;
|
|
}
|
|
|
|
// src/hooks/useSpringRef.ts
|
|
|
|
var initSpringRef = function initSpringRef() {
|
|
return SpringRef();
|
|
};
|
|
var useSpringRef = function useSpringRef() {
|
|
return useState(initSpringRef)[0];
|
|
};
|
|
|
|
// src/hooks/useSpringValue.ts
|
|
|
|
var useSpringValue = function useSpringValue(initial, props) {
|
|
var springValue = useConstant(function () {
|
|
return new SpringValue(initial, props);
|
|
});
|
|
useOnce2(function () {
|
|
return function () {
|
|
springValue.stop();
|
|
};
|
|
});
|
|
return springValue;
|
|
};
|
|
|
|
// src/hooks/useTrail.ts
|
|
|
|
function useTrail(length, propsArg, deps) {
|
|
var propsFn = is10.fun(propsArg) && propsArg;
|
|
if (propsFn && !deps) deps = [];
|
|
var reverse = true;
|
|
var passedRef = void 0;
|
|
var result = useSprings(length, function (i, ctrl) {
|
|
var props = propsFn ? propsFn(i, ctrl) : propsArg;
|
|
passedRef = props.ref;
|
|
reverse = reverse && props.reverse;
|
|
return props;
|
|
},
|
|
// Ensure the props function is called when no deps exist.
|
|
// This works around the 3 argument rule.
|
|
deps || [{}]);
|
|
useIsomorphicLayoutEffect3(function () {
|
|
each6(result[1].current, function (ctrl, i) {
|
|
var parent = result[1].current[i + (reverse ? 1 : -1)];
|
|
replaceRef(ctrl, passedRef);
|
|
if (ctrl.ref) {
|
|
if (parent) {
|
|
ctrl.update({
|
|
to: parent.springs
|
|
});
|
|
}
|
|
return;
|
|
}
|
|
if (parent) {
|
|
ctrl.start({
|
|
to: parent.springs
|
|
});
|
|
} else {
|
|
ctrl.start();
|
|
}
|
|
});
|
|
}, deps);
|
|
if (propsFn || arguments.length == 3) {
|
|
var _passedRef;
|
|
var ref = (_passedRef = passedRef) !== null && _passedRef !== void 0 ? _passedRef : result[1];
|
|
ref["_getProps"] = function (propsArg2, ctrl, i) {
|
|
var props = is10.fun(propsArg2) ? propsArg2(i, ctrl) : propsArg2;
|
|
if (props) {
|
|
var parent = ref.current[i + (props.reverse ? 1 : -1)];
|
|
if (parent) props.to = parent.springs;
|
|
return props;
|
|
}
|
|
};
|
|
return result;
|
|
}
|
|
return result[0];
|
|
}
|
|
|
|
// src/hooks/useTransition.tsx
|
|
|
|
|
|
|
|
function useTransition(data, props, deps) {
|
|
var _arguments5 = arguments;
|
|
var propsFn = is.fun(props) && props;
|
|
var _ref15 = propsFn ? propsFn() : props,
|
|
reset = _ref15.reset,
|
|
sort = _ref15.sort,
|
|
_ref15$trail = _ref15.trail,
|
|
trail = _ref15$trail === void 0 ? 0 : _ref15$trail,
|
|
_ref15$expires = _ref15.expires,
|
|
expires = _ref15$expires === void 0 ? true : _ref15$expires,
|
|
_ref15$exitBeforeEnte = _ref15.exitBeforeEnter,
|
|
exitBeforeEnter = _ref15$exitBeforeEnte === void 0 ? false : _ref15$exitBeforeEnte,
|
|
onDestroyed = _ref15.onDestroyed,
|
|
propsRef = _ref15.ref,
|
|
propsConfig = _ref15.config;
|
|
var ref = (0,_react_17_0_2_react.useMemo)(function () {
|
|
return propsFn || _arguments5.length == 3 ? SpringRef() : void 0;
|
|
}, []);
|
|
var items = toArray(data);
|
|
var transitions = [];
|
|
var usedTransitions = (0,_react_17_0_2_react.useRef)(null);
|
|
var prevTransitions = reset ? null : usedTransitions.current;
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
usedTransitions.current = transitions;
|
|
});
|
|
useOnce(function () {
|
|
react_spring_shared_modern_each(transitions, function (t) {
|
|
ref === null || ref === void 0 || ref.add(t.ctrl);
|
|
t.ctrl.ref = ref;
|
|
});
|
|
return function () {
|
|
react_spring_shared_modern_each(usedTransitions.current, function (t) {
|
|
if (t.expired) {
|
|
clearTimeout(t.expirationId);
|
|
}
|
|
detachRefs(t.ctrl, ref);
|
|
t.ctrl.stop(true);
|
|
});
|
|
};
|
|
});
|
|
var keys = getKeys(items, propsFn ? propsFn() : props, prevTransitions);
|
|
var expired = reset && usedTransitions.current || [];
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
return react_spring_shared_modern_each(expired, function (_ref16) {
|
|
var ctrl = _ref16.ctrl,
|
|
item = _ref16.item,
|
|
key = _ref16.key;
|
|
detachRefs(ctrl, ref);
|
|
callProp(onDestroyed, item, key);
|
|
});
|
|
});
|
|
var reused = [];
|
|
if (prevTransitions) react_spring_shared_modern_each(prevTransitions, function (t, i) {
|
|
if (t.expired) {
|
|
clearTimeout(t.expirationId);
|
|
expired.push(t);
|
|
} else {
|
|
i = reused[i] = keys.indexOf(t.key);
|
|
if (~i) transitions[i] = t;
|
|
}
|
|
});
|
|
react_spring_shared_modern_each(items, function (item, i) {
|
|
if (!transitions[i]) {
|
|
transitions[i] = {
|
|
key: keys[i],
|
|
item: item,
|
|
phase: "mount" /* MOUNT */,
|
|
ctrl: new Controller()
|
|
};
|
|
transitions[i].ctrl.item = item;
|
|
}
|
|
});
|
|
if (reused.length) {
|
|
var i = -1;
|
|
var _ref17 = propsFn ? propsFn() : props,
|
|
leave = _ref17.leave;
|
|
react_spring_shared_modern_each(reused, function (keyIndex, prevIndex) {
|
|
var t = prevTransitions[prevIndex];
|
|
if (~keyIndex) {
|
|
i = transitions.indexOf(t);
|
|
transitions[i] = objectSpread2(objectSpread2({}, t), {}, {
|
|
item: items[keyIndex]
|
|
});
|
|
} else if (leave) {
|
|
transitions.splice(++i, 0, t);
|
|
}
|
|
});
|
|
}
|
|
if (is.fun(sort)) {
|
|
transitions.sort(function (a, b) {
|
|
return sort(a.item, b.item);
|
|
});
|
|
}
|
|
var delay = -trail;
|
|
var forceUpdate = useForceUpdate();
|
|
var defaultProps = getDefaultProps(props);
|
|
var changes = /* @__PURE__ */new Map();
|
|
var exitingTransitions = (0,_react_17_0_2_react.useRef)( /* @__PURE__ */new Map());
|
|
var forceChange = (0,_react_17_0_2_react.useRef)(false);
|
|
react_spring_shared_modern_each(transitions, function (t, i) {
|
|
var key = t.key;
|
|
var prevPhase = t.phase;
|
|
var p = propsFn ? propsFn() : props;
|
|
var to2;
|
|
var phase;
|
|
var propsDelay = callProp(p.delay || 0, key);
|
|
if (prevPhase == "mount" /* MOUNT */) {
|
|
to2 = p.enter;
|
|
phase = "enter" /* ENTER */;
|
|
} else {
|
|
var isLeave = keys.indexOf(key) < 0;
|
|
if (prevPhase != "leave" /* LEAVE */) {
|
|
if (isLeave) {
|
|
to2 = p.leave;
|
|
phase = "leave" /* LEAVE */;
|
|
} else if (to2 = p.update) {
|
|
phase = "update" /* UPDATE */;
|
|
} else return;
|
|
} else if (!isLeave) {
|
|
to2 = p.enter;
|
|
phase = "enter" /* ENTER */;
|
|
} else return;
|
|
}
|
|
to2 = callProp(to2, t.item, i);
|
|
to2 = is.obj(to2) ? inferTo(to2) : {
|
|
to: to2
|
|
};
|
|
if (!to2.config) {
|
|
var config2 = propsConfig || defaultProps.config;
|
|
to2.config = callProp(config2, t.item, i, phase);
|
|
}
|
|
delay += trail;
|
|
var payload = objectSpread2(objectSpread2({}, defaultProps), {}, {
|
|
// we need to add our props.delay value you here.
|
|
delay: propsDelay + delay,
|
|
ref: propsRef,
|
|
immediate: p.immediate,
|
|
// This prevents implied resets.
|
|
reset: false
|
|
}, to2);
|
|
if (phase == "enter" /* ENTER */ && is.und(payload.from)) {
|
|
var p2 = propsFn ? propsFn() : props;
|
|
var from = is.und(p2.initial) || prevTransitions ? p2.from : p2.initial;
|
|
payload.from = callProp(from, t.item, i);
|
|
}
|
|
var onResolve = payload.onResolve;
|
|
payload.onResolve = function (result) {
|
|
callProp(onResolve, result);
|
|
var transitions2 = usedTransitions.current;
|
|
var t2 = transitions2.find(function (t3) {
|
|
return t3.key === key;
|
|
});
|
|
if (!t2) return;
|
|
if (result.cancelled && t2.phase != "update" /* UPDATE */) {
|
|
return;
|
|
}
|
|
if (t2.ctrl.idle) {
|
|
var idle = transitions2.every(function (t3) {
|
|
return t3.ctrl.idle;
|
|
});
|
|
if (t2.phase == "leave" /* LEAVE */) {
|
|
var expiry = callProp(expires, t2.item);
|
|
if (expiry !== false) {
|
|
var expiryMs = expiry === true ? 0 : expiry;
|
|
t2.expired = true;
|
|
if (!idle && expiryMs > 0) {
|
|
if (expiryMs <= 2147483647) t2.expirationId = setTimeout(forceUpdate, expiryMs);
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
if (idle && transitions2.some(function (t3) {
|
|
return t3.expired;
|
|
})) {
|
|
exitingTransitions.current["delete"](t2);
|
|
if (exitBeforeEnter) {
|
|
forceChange.current = true;
|
|
}
|
|
forceUpdate();
|
|
}
|
|
}
|
|
};
|
|
var springs = getSprings(t.ctrl, payload);
|
|
if (phase === "leave" /* LEAVE */ && exitBeforeEnter) {
|
|
exitingTransitions.current.set(t, {
|
|
phase: phase,
|
|
springs: springs,
|
|
payload: payload
|
|
});
|
|
} else {
|
|
changes.set(t, {
|
|
phase: phase,
|
|
springs: springs,
|
|
payload: payload
|
|
});
|
|
}
|
|
});
|
|
var context = (0,_react_17_0_2_react.useContext)(SpringContext);
|
|
var prevContext = usePrev(context);
|
|
var hasContext = context !== prevContext && hasProps(context);
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
if (hasContext) {
|
|
react_spring_shared_modern_each(transitions, function (t) {
|
|
t.ctrl.start({
|
|
"default": context
|
|
});
|
|
});
|
|
}
|
|
}, [context]);
|
|
react_spring_shared_modern_each(changes, function (_, t) {
|
|
if (exitingTransitions.current.size) {
|
|
var ind = transitions.findIndex(function (state) {
|
|
return state.key === t.key;
|
|
});
|
|
transitions.splice(ind, 1);
|
|
}
|
|
});
|
|
react_spring_shared_modern_useIsomorphicLayoutEffect(function () {
|
|
react_spring_shared_modern_each(exitingTransitions.current.size ? exitingTransitions.current : changes, function (_ref18, t) {
|
|
var phase = _ref18.phase,
|
|
payload = _ref18.payload;
|
|
var ctrl = t.ctrl;
|
|
t.phase = phase;
|
|
ref === null || ref === void 0 || ref.add(ctrl);
|
|
if (hasContext && phase == "enter" /* ENTER */) {
|
|
ctrl.start({
|
|
"default": context
|
|
});
|
|
}
|
|
if (payload) {
|
|
replaceRef(ctrl, payload.ref);
|
|
if ((ctrl.ref || ref) && !forceChange.current) {
|
|
ctrl.update(payload);
|
|
} else {
|
|
ctrl.start(payload);
|
|
if (forceChange.current) {
|
|
forceChange.current = false;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}, reset ? void 0 : deps);
|
|
var renderTransitions = function renderTransitions(render) {
|
|
return /* @__PURE__ */_react_17_0_2_react.createElement(_react_17_0_2_react.Fragment, null, transitions.map(function (t, i) {
|
|
var _ref19 = changes.get(t) || t.ctrl,
|
|
springs = _ref19.springs;
|
|
var elem = render(objectSpread2({}, springs), t.item, t, i);
|
|
return elem && elem.type ? /* @__PURE__ */_react_17_0_2_react.createElement(elem.type, objectSpread2(objectSpread2({}, elem.props), {}, {
|
|
key: is.str(t.key) || is.num(t.key) ? t.key : t.ctrl.id,
|
|
ref: elem.ref
|
|
})) : elem;
|
|
}));
|
|
};
|
|
return ref ? [renderTransitions, ref] : renderTransitions;
|
|
}
|
|
var nextKey = 1;
|
|
function getKeys(items, _ref20, prevTransitions) {
|
|
var key = _ref20.key,
|
|
_ref20$keys = _ref20.keys,
|
|
keys = _ref20$keys === void 0 ? key : _ref20$keys;
|
|
if (keys === null) {
|
|
var reused = /* @__PURE__ */new Set();
|
|
return items.map(function (item) {
|
|
var t = prevTransitions && prevTransitions.find(function (t2) {
|
|
return t2.item === item && t2.phase !== "leave" /* LEAVE */ && !reused.has(t2);
|
|
});
|
|
if (t) {
|
|
reused.add(t);
|
|
return t.key;
|
|
}
|
|
return nextKey++;
|
|
});
|
|
}
|
|
return is.und(keys) ? items : is.fun(keys) ? items.map(keys) : toArray(keys);
|
|
}
|
|
|
|
// src/hooks/useScroll.ts
|
|
|
|
var useScroll = function useScroll() {
|
|
var _ref21 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
container = _ref21.container,
|
|
springOptions = _objectWithoutProperties(_ref21, _excluded2);
|
|
var _useSpring = useSpring(function () {
|
|
return _objectSpread({
|
|
scrollX: 0,
|
|
scrollY: 0,
|
|
scrollXProgress: 0,
|
|
scrollYProgress: 0
|
|
}, springOptions);
|
|
}, []),
|
|
_useSpring2 = _slicedToArray(_useSpring, 2),
|
|
scrollValues = _useSpring2[0],
|
|
api = _useSpring2[1];
|
|
useIsomorphicLayoutEffect5(function () {
|
|
var cleanupScroll = onScroll(function (_ref22) {
|
|
var x = _ref22.x,
|
|
y = _ref22.y;
|
|
api.start({
|
|
scrollX: x.current,
|
|
scrollXProgress: x.progress,
|
|
scrollY: y.current,
|
|
scrollYProgress: y.progress
|
|
});
|
|
}, {
|
|
container: (container === null || container === void 0 ? void 0 : container.current) || void 0
|
|
});
|
|
return function () {
|
|
each8(Object.values(scrollValues), function (value) {
|
|
return value.stop();
|
|
});
|
|
cleanupScroll();
|
|
};
|
|
}, []);
|
|
return scrollValues;
|
|
};
|
|
|
|
// src/hooks/useResize.ts
|
|
|
|
var useResize = function useResize(_ref23) {
|
|
var container = _ref23.container,
|
|
springOptions = _objectWithoutProperties(_ref23, _excluded3);
|
|
var _useSpring3 = useSpring(function () {
|
|
return _objectSpread({
|
|
width: 0,
|
|
height: 0
|
|
}, springOptions);
|
|
}, []),
|
|
_useSpring4 = _slicedToArray(_useSpring3, 2),
|
|
sizeValues = _useSpring4[0],
|
|
api = _useSpring4[1];
|
|
useIsomorphicLayoutEffect6(function () {
|
|
var cleanupScroll = onResize(function (_ref24) {
|
|
var width = _ref24.width,
|
|
height = _ref24.height;
|
|
api.start({
|
|
width: width,
|
|
height: height,
|
|
immediate: sizeValues.width.get() === 0 || sizeValues.height.get() === 0
|
|
});
|
|
}, {
|
|
container: (container === null || container === void 0 ? void 0 : container.current) || void 0
|
|
});
|
|
return function () {
|
|
each9(Object.values(sizeValues), function (value) {
|
|
return value.stop();
|
|
});
|
|
cleanupScroll();
|
|
};
|
|
}, []);
|
|
return sizeValues;
|
|
};
|
|
|
|
// src/hooks/useInView.ts
|
|
|
|
|
|
var defaultThresholdOptions = {
|
|
any: 0,
|
|
all: 1
|
|
};
|
|
function useInView(props, args) {
|
|
var _useState = useState2(false),
|
|
_useState2 = _slicedToArray(_useState, 2),
|
|
isInView = _useState2[0],
|
|
setIsInView = _useState2[1];
|
|
var ref = useRef3();
|
|
var propsFn = is12.fun(props) && props;
|
|
var springsProps = propsFn ? propsFn() : {};
|
|
var _springsProps$to = springsProps.to,
|
|
to2 = _springsProps$to === void 0 ? {} : _springsProps$to,
|
|
_springsProps$from = springsProps.from,
|
|
from = _springsProps$from === void 0 ? {} : _springsProps$from,
|
|
restSpringProps = _objectWithoutProperties(springsProps, _excluded4);
|
|
var intersectionArguments = propsFn ? args : props;
|
|
var _useSpring5 = useSpring(function () {
|
|
return _objectSpread({
|
|
from: from
|
|
}, restSpringProps);
|
|
}, []),
|
|
_useSpring6 = _slicedToArray(_useSpring5, 2),
|
|
springs = _useSpring6[0],
|
|
api = _useSpring6[1];
|
|
useIsomorphicLayoutEffect7(function () {
|
|
var element = ref.current;
|
|
var _ref25 = intersectionArguments !== null && intersectionArguments !== void 0 ? intersectionArguments : {},
|
|
root = _ref25.root,
|
|
once = _ref25.once,
|
|
_ref25$amount = _ref25.amount,
|
|
amount = _ref25$amount === void 0 ? "any" : _ref25$amount,
|
|
restArgs = _objectWithoutProperties(_ref25, _excluded5);
|
|
if (!element || once && isInView || typeof IntersectionObserver === "undefined") return;
|
|
var activeIntersections = /* @__PURE__ */new WeakMap();
|
|
var onEnter = function onEnter() {
|
|
if (to2) {
|
|
api.start(to2);
|
|
}
|
|
setIsInView(true);
|
|
var cleanup = function cleanup() {
|
|
if (from) {
|
|
api.start(from);
|
|
}
|
|
setIsInView(false);
|
|
};
|
|
return once ? void 0 : cleanup;
|
|
};
|
|
var handleIntersection = function handleIntersection(entries) {
|
|
entries.forEach(function (entry) {
|
|
var onLeave = activeIntersections.get(entry.target);
|
|
if (entry.isIntersecting === Boolean(onLeave)) {
|
|
return;
|
|
}
|
|
if (entry.isIntersecting) {
|
|
var newOnLeave = onEnter();
|
|
if (is12.fun(newOnLeave)) {
|
|
activeIntersections.set(entry.target, newOnLeave);
|
|
} else {
|
|
observer.unobserve(entry.target);
|
|
}
|
|
} else if (onLeave) {
|
|
onLeave();
|
|
activeIntersections["delete"](entry.target);
|
|
}
|
|
});
|
|
};
|
|
var observer = new IntersectionObserver(handleIntersection, _objectSpread({
|
|
root: root && root.current || void 0,
|
|
threshold: typeof amount === "number" || Array.isArray(amount) ? amount : defaultThresholdOptions[amount]
|
|
}, restArgs));
|
|
observer.observe(element);
|
|
return function () {
|
|
return observer.unobserve(element);
|
|
};
|
|
}, [intersectionArguments]);
|
|
if (propsFn) {
|
|
return [ref, springs];
|
|
}
|
|
return [ref, isInView];
|
|
}
|
|
|
|
// src/components/Spring.tsx
|
|
function Spring(_ref26) {
|
|
var children = _ref26.children,
|
|
props = _objectWithoutProperties(_ref26, _excluded6);
|
|
return children(useSpring(props));
|
|
}
|
|
|
|
// src/components/Trail.tsx
|
|
|
|
function Trail(_ref27) {
|
|
var items = _ref27.items,
|
|
children = _ref27.children,
|
|
props = _objectWithoutProperties(_ref27, _excluded7);
|
|
var trails = useTrail(items.length, props);
|
|
return items.map(function (item, index) {
|
|
var result = children(item, index);
|
|
return is13.fun(result) ? result(trails[index]) : result;
|
|
});
|
|
}
|
|
|
|
// src/components/Transition.tsx
|
|
function Transition(_ref28) {
|
|
var items = _ref28.items,
|
|
children = _ref28.children,
|
|
props = _objectWithoutProperties(_ref28, _excluded8);
|
|
return useTransition(items, props)(children);
|
|
}
|
|
|
|
// src/interpolate.ts
|
|
|
|
|
|
// src/Interpolation.ts
|
|
|
|
|
|
var Interpolation = /*#__PURE__*/function (_FrameValue2) {
|
|
inherits(Interpolation, _FrameValue2);
|
|
var _super5 = createSuper(Interpolation);
|
|
function Interpolation(source, args) {
|
|
var _this14;
|
|
classCallCheck(this, Interpolation);
|
|
_this14 = _super5.call(this);
|
|
_this14.source = source;
|
|
/** Equals false when in the frameloop */
|
|
_this14.idle = true;
|
|
/** The inputs which are currently animating */
|
|
_this14._active = /* @__PURE__ */new Set();
|
|
_this14.calc = createInterpolator.apply(void 0, toConsumableArray(args));
|
|
var value = _this14._get();
|
|
var nodeType = getAnimatedType(value);
|
|
setAnimated(assertThisInitialized(_this14), nodeType.create(value));
|
|
return _this14;
|
|
}
|
|
createClass(Interpolation, [{
|
|
key: "advance",
|
|
value: function advance(_dt) {
|
|
var value = this._get();
|
|
var oldValue = this.get();
|
|
if (!isEqual(value, oldValue)) {
|
|
getAnimated(this).setValue(value);
|
|
this._onChange(value, this.idle);
|
|
}
|
|
if (!this.idle && checkIdle(this._active)) {
|
|
becomeIdle(this);
|
|
}
|
|
}
|
|
}, {
|
|
key: "_get",
|
|
value: function _get() {
|
|
var inputs = is.arr(this.source) ? this.source.map(getFluidValue) : toArray(getFluidValue(this.source));
|
|
return this.calc.apply(this, toConsumableArray(inputs));
|
|
}
|
|
}, {
|
|
key: "_start",
|
|
value: function _start() {
|
|
var _this15 = this;
|
|
if (this.idle && !checkIdle(this._active)) {
|
|
this.idle = false;
|
|
react_spring_shared_modern_each(getPayload(this), function (node) {
|
|
node.done = false;
|
|
});
|
|
if (globals_exports.skipAnimation) {
|
|
raf.batchedUpdates(function () {
|
|
return _this15.advance();
|
|
});
|
|
becomeIdle(this);
|
|
} else {
|
|
frameLoop.start(this);
|
|
}
|
|
}
|
|
}
|
|
// Observe our sources only when we're observed.
|
|
}, {
|
|
key: "_attach",
|
|
value: function _attach() {
|
|
var _this16 = this;
|
|
var priority = 1;
|
|
react_spring_shared_modern_each(toArray(this.source), function (source) {
|
|
if (hasFluidValue(source)) {
|
|
addFluidObserver(source, _this16);
|
|
}
|
|
if (isFrameValue(source)) {
|
|
if (!source.idle) {
|
|
_this16._active.add(source);
|
|
}
|
|
priority = Math.max(priority, source.priority + 1);
|
|
}
|
|
});
|
|
this.priority = priority;
|
|
this._start();
|
|
}
|
|
// Stop observing our sources once we have no observers.
|
|
}, {
|
|
key: "_detach",
|
|
value: function _detach() {
|
|
var _this17 = this;
|
|
react_spring_shared_modern_each(toArray(this.source), function (source) {
|
|
if (hasFluidValue(source)) {
|
|
removeFluidObserver(source, _this17);
|
|
}
|
|
});
|
|
this._active.clear();
|
|
becomeIdle(this);
|
|
}
|
|
/** @internal */
|
|
}, {
|
|
key: "eventObserved",
|
|
value: function eventObserved(event) {
|
|
if (event.type == "change") {
|
|
if (event.idle) {
|
|
this.advance();
|
|
} else {
|
|
this._active.add(event.parent);
|
|
this._start();
|
|
}
|
|
} else if (event.type == "idle") {
|
|
this._active["delete"](event.parent);
|
|
} else if (event.type == "priority") {
|
|
this.priority = toArray(this.source).reduce(function (highest, parent) {
|
|
return Math.max(highest, (isFrameValue(parent) ? parent.priority : 0) + 1);
|
|
}, 0);
|
|
}
|
|
}
|
|
}]);
|
|
return Interpolation;
|
|
}(FrameValue);
|
|
function isIdle(source) {
|
|
return source.idle !== false;
|
|
}
|
|
function checkIdle(active) {
|
|
return !active.size || Array.from(active).every(isIdle);
|
|
}
|
|
function becomeIdle(self) {
|
|
if (!self.idle) {
|
|
self.idle = true;
|
|
react_spring_shared_modern_each(getPayload(self), function (node) {
|
|
node.done = true;
|
|
});
|
|
callFluidObservers(self, {
|
|
type: "idle",
|
|
parent: self
|
|
});
|
|
}
|
|
}
|
|
|
|
// src/interpolate.ts
|
|
var to = function to(source) {
|
|
for (var _len5 = arguments.length, args = new Array(_len5 > 1 ? _len5 - 1 : 0), _key5 = 1; _key5 < _len5; _key5++) {
|
|
args[_key5 - 1] = arguments[_key5];
|
|
}
|
|
return new Interpolation(source, args);
|
|
};
|
|
var react_spring_core_modern_interpolate = function interpolate(source) {
|
|
for (var _len6 = arguments.length, args = new Array(_len6 > 1 ? _len6 - 1 : 0), _key6 = 1; _key6 < _len6; _key6++) {
|
|
args[_key6 - 1] = arguments[_key6];
|
|
}
|
|
return deprecateInterpolate2(), new Interpolation(source, args);
|
|
};
|
|
|
|
// src/globals.ts
|
|
|
|
globals_exports.assign({
|
|
createStringInterpolator: createStringInterpolator2,
|
|
to: function to(source, args) {
|
|
return new Interpolation(source, args);
|
|
}
|
|
});
|
|
var react_spring_core_modern_update = frameLoop.advance;
|
|
|
|
// src/index.ts
|
|
|
|
|
|
|
|
// EXTERNAL MODULE: ./node_modules/_react-dom@17.0.2@react-dom/index.js
|
|
var _react_dom_17_0_2_react_dom = __webpack_require__(4676);
|
|
;// CONCATENATED MODULE: ./node_modules/_@react-spring_web@9.7.5@@react-spring/web/dist/react-spring_web.modern.mjs
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var react_spring_web_modern_excluded = ["className", "style", "children", "scrollTop", "scrollLeft", "viewBox"],
|
|
react_spring_web_modern_excluded2 = ["x", "y", "z"],
|
|
react_spring_web_modern_excluded3 = ["scrollTop", "scrollLeft"];
|
|
// src/index.ts
|
|
|
|
|
|
|
|
|
|
|
|
// src/applyAnimatedValues.ts
|
|
var isCustomPropRE = /^--/;
|
|
function dangerousStyleValue(name, value) {
|
|
if (value == null || typeof value === "boolean" || value === "") return "";
|
|
if (typeof value === "number" && value !== 0 && !isCustomPropRE.test(name) && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name])) return value + "px";
|
|
return ("" + value).trim();
|
|
}
|
|
var attributeCache = {};
|
|
function applyAnimatedValues(instance, props) {
|
|
if (!instance.nodeType || !instance.setAttribute) {
|
|
return false;
|
|
}
|
|
var isFilterElement = instance.nodeName === "filter" || instance.parentNode && instance.parentNode.nodeName === "filter";
|
|
var className = props.className,
|
|
style = props.style,
|
|
children = props.children,
|
|
scrollTop = props.scrollTop,
|
|
scrollLeft = props.scrollLeft,
|
|
viewBox = props.viewBox,
|
|
attributes = objectWithoutProperties(props, react_spring_web_modern_excluded);
|
|
var values = Object.values(attributes);
|
|
var names = Object.keys(attributes).map(function (name) {
|
|
return isFilterElement || instance.hasAttribute(name) ? name : attributeCache[name] || (attributeCache[name] = name.replace(/([A-Z])/g,
|
|
// Attributes are written in dash case
|
|
function (n) {
|
|
return "-" + n.toLowerCase();
|
|
}));
|
|
});
|
|
if (children !== void 0) {
|
|
instance.textContent = children;
|
|
}
|
|
for (var name in style) {
|
|
if (style.hasOwnProperty(name)) {
|
|
var value = dangerousStyleValue(name, style[name]);
|
|
if (isCustomPropRE.test(name)) {
|
|
instance.style.setProperty(name, value);
|
|
} else {
|
|
instance.style[name] = value;
|
|
}
|
|
}
|
|
}
|
|
names.forEach(function (name, i) {
|
|
instance.setAttribute(name, values[i]);
|
|
});
|
|
if (className !== void 0) {
|
|
instance.className = className;
|
|
}
|
|
if (scrollTop !== void 0) {
|
|
instance.scrollTop = scrollTop;
|
|
}
|
|
if (scrollLeft !== void 0) {
|
|
instance.scrollLeft = scrollLeft;
|
|
}
|
|
if (viewBox !== void 0) {
|
|
instance.setAttribute("viewBox", viewBox);
|
|
}
|
|
}
|
|
var isUnitlessNumber = {
|
|
animationIterationCount: true,
|
|
borderImageOutset: true,
|
|
borderImageSlice: true,
|
|
borderImageWidth: true,
|
|
boxFlex: true,
|
|
boxFlexGroup: true,
|
|
boxOrdinalGroup: true,
|
|
columnCount: true,
|
|
columns: true,
|
|
flex: true,
|
|
flexGrow: true,
|
|
flexPositive: true,
|
|
flexShrink: true,
|
|
flexNegative: true,
|
|
flexOrder: true,
|
|
gridRow: true,
|
|
gridRowEnd: true,
|
|
gridRowSpan: true,
|
|
gridRowStart: true,
|
|
gridColumn: true,
|
|
gridColumnEnd: true,
|
|
gridColumnSpan: true,
|
|
gridColumnStart: true,
|
|
fontWeight: true,
|
|
lineClamp: true,
|
|
lineHeight: true,
|
|
opacity: true,
|
|
order: true,
|
|
orphans: true,
|
|
tabSize: true,
|
|
widows: true,
|
|
zIndex: true,
|
|
zoom: true,
|
|
// SVG-related properties
|
|
fillOpacity: true,
|
|
floodOpacity: true,
|
|
stopOpacity: true,
|
|
strokeDasharray: true,
|
|
strokeDashoffset: true,
|
|
strokeMiterlimit: true,
|
|
strokeOpacity: true,
|
|
strokeWidth: true
|
|
};
|
|
var prefixKey = function prefixKey(prefix, key) {
|
|
return prefix + key.charAt(0).toUpperCase() + key.substring(1);
|
|
};
|
|
var prefixes = ["Webkit", "Ms", "Moz", "O"];
|
|
isUnitlessNumber = Object.keys(isUnitlessNumber).reduce(function (acc, prop) {
|
|
prefixes.forEach(function (prefix) {
|
|
return acc[prefixKey(prefix, prop)] = acc[prop];
|
|
});
|
|
return acc;
|
|
}, isUnitlessNumber);
|
|
|
|
// src/AnimatedStyle.ts
|
|
|
|
|
|
var domTransforms = /^(matrix|translate|scale|rotate|skew)/;
|
|
var pxTransforms = /^(translate)/;
|
|
var degTransforms = /^(rotate|skew)/;
|
|
var addUnit = function addUnit(value, unit) {
|
|
return is.num(value) && value !== 0 ? value + unit : value;
|
|
};
|
|
var isValueIdentity = function isValueIdentity(value, id) {
|
|
return is.arr(value) ? value.every(function (v) {
|
|
return isValueIdentity(v, id);
|
|
}) : is.num(value) ? value === id : parseFloat(value) === id;
|
|
};
|
|
var AnimatedStyle = /*#__PURE__*/function (_AnimatedObject) {
|
|
inherits(AnimatedStyle, _AnimatedObject);
|
|
var _super = createSuper(AnimatedStyle);
|
|
function AnimatedStyle(_ref) {
|
|
var x = _ref.x,
|
|
y = _ref.y,
|
|
z = _ref.z,
|
|
style = objectWithoutProperties(_ref, react_spring_web_modern_excluded2);
|
|
classCallCheck(this, AnimatedStyle);
|
|
var inputs = [];
|
|
var transforms = [];
|
|
if (x || y || z) {
|
|
inputs.push([x || 0, y || 0, z || 0]);
|
|
transforms.push(function (xyz) {
|
|
return ["translate3d(".concat(xyz.map(function (v) {
|
|
return addUnit(v, "px");
|
|
}).join(","), ")"),
|
|
// prettier-ignore
|
|
isValueIdentity(xyz, 0)];
|
|
});
|
|
}
|
|
eachProp(style, function (value, key) {
|
|
if (key === "transform") {
|
|
inputs.push([value || ""]);
|
|
transforms.push(function (transform) {
|
|
return [transform, transform === ""];
|
|
});
|
|
} else if (domTransforms.test(key)) {
|
|
delete style[key];
|
|
if (is.und(value)) return;
|
|
var unit = pxTransforms.test(key) ? "px" : degTransforms.test(key) ? "deg" : "";
|
|
inputs.push(toArray(value));
|
|
transforms.push(key === "rotate3d" ? function (_ref2) {
|
|
var _ref3 = slicedToArray(_ref2, 4),
|
|
x2 = _ref3[0],
|
|
y2 = _ref3[1],
|
|
z2 = _ref3[2],
|
|
deg = _ref3[3];
|
|
return ["rotate3d(".concat(x2, ",").concat(y2, ",").concat(z2, ",").concat(addUnit(deg, unit), ")"), isValueIdentity(deg, 0)];
|
|
} : function (input) {
|
|
return ["".concat(key, "(").concat(input.map(function (v) {
|
|
return addUnit(v, unit);
|
|
}).join(","), ")"), isValueIdentity(input, key.startsWith("scale") ? 1 : 0)];
|
|
});
|
|
}
|
|
});
|
|
if (inputs.length) {
|
|
style.transform = new FluidTransform(inputs, transforms);
|
|
}
|
|
return _super.call(this, style);
|
|
}
|
|
return createClass(AnimatedStyle);
|
|
}(AnimatedObject);
|
|
var FluidTransform = /*#__PURE__*/function (_FluidValue) {
|
|
inherits(FluidTransform, _FluidValue);
|
|
var _super2 = createSuper(FluidTransform);
|
|
function FluidTransform(inputs, transforms) {
|
|
var _this;
|
|
classCallCheck(this, FluidTransform);
|
|
_this = _super2.call(this);
|
|
_this.inputs = inputs;
|
|
_this.transforms = transforms;
|
|
_this._value = null;
|
|
return _this;
|
|
}
|
|
createClass(FluidTransform, [{
|
|
key: "get",
|
|
value: function get() {
|
|
return this._value || (this._value = this._get());
|
|
}
|
|
}, {
|
|
key: "_get",
|
|
value: function _get() {
|
|
var _this2 = this;
|
|
var transform = "";
|
|
var identity = true;
|
|
react_spring_shared_modern_each(this.inputs, function (input, i) {
|
|
var arg1 = getFluidValue(input[0]);
|
|
var _this2$transforms$i = _this2.transforms[i](is.arr(arg1) ? arg1 : input.map(getFluidValue)),
|
|
_this2$transforms$i2 = slicedToArray(_this2$transforms$i, 2),
|
|
t = _this2$transforms$i2[0],
|
|
id = _this2$transforms$i2[1];
|
|
transform += " " + t;
|
|
identity = identity && id;
|
|
});
|
|
return identity ? "none" : transform;
|
|
}
|
|
// Start observing our inputs once we have an observer.
|
|
}, {
|
|
key: "observerAdded",
|
|
value: function observerAdded(count) {
|
|
var _this3 = this;
|
|
if (count == 1) react_spring_shared_modern_each(this.inputs, function (input) {
|
|
return react_spring_shared_modern_each(input, function (value) {
|
|
return hasFluidValue(value) && addFluidObserver(value, _this3);
|
|
});
|
|
});
|
|
}
|
|
// Stop observing our inputs once we have no observers.
|
|
}, {
|
|
key: "observerRemoved",
|
|
value: function observerRemoved(count) {
|
|
var _this4 = this;
|
|
if (count == 0) react_spring_shared_modern_each(this.inputs, function (input) {
|
|
return react_spring_shared_modern_each(input, function (value) {
|
|
return hasFluidValue(value) && removeFluidObserver(value, _this4);
|
|
});
|
|
});
|
|
}
|
|
}, {
|
|
key: "eventObserved",
|
|
value: function eventObserved(event) {
|
|
if (event.type == "change") {
|
|
this._value = null;
|
|
}
|
|
callFluidObservers(this, event);
|
|
}
|
|
}]);
|
|
return FluidTransform;
|
|
}(FluidValue);
|
|
|
|
// src/primitives.ts
|
|
var primitives = ["a", "abbr", "address", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "cite", "code", "col", "colgroup", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "head", "header", "hgroup", "hr", "html", "i", "iframe", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "menu", "menuitem", "meta", "meter", "nav", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "small", "source", "span", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "u", "ul", "var", "video", "wbr",
|
|
// SVG
|
|
"circle", "clipPath", "defs", "ellipse", "foreignObject", "g", "image", "line", "linearGradient", "mask", "path", "pattern", "polygon", "polyline", "radialGradient", "rect", "stop", "svg", "text", "tspan"];
|
|
|
|
// src/index.ts
|
|
|
|
globals_exports.assign({
|
|
batchedUpdates: _react_dom_17_0_2_react_dom.unstable_batchedUpdates,
|
|
createStringInterpolator: createStringInterpolator2,
|
|
colors: colors2
|
|
});
|
|
var host = createHost(primitives, {
|
|
applyAnimatedValues: applyAnimatedValues,
|
|
createAnimatedStyle: function createAnimatedStyle(style) {
|
|
return new AnimatedStyle(style);
|
|
},
|
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
getComponentProps: function getComponentProps(_ref4) {
|
|
var scrollTop = _ref4.scrollTop,
|
|
scrollLeft = _ref4.scrollLeft,
|
|
props = objectWithoutProperties(_ref4, react_spring_web_modern_excluded3);
|
|
return props;
|
|
}
|
|
});
|
|
var animated = host.animated;
|
|
|
|
|
|
/***/ })
|
|
|
|
}]); |