New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details
Socket
Book a DemoSign in
Socket

css-spring

Package Overview
Dependencies
Maintainers
1
Versions
7
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

css-spring - npm Package Compare versions

Comparing version
3.0.0
to
4.0.0
.eslintignore

Sorry, the diff of this file is not supported yet

+39
{
"parser": "babel-eslint",
"env": {
"browser": true,
"es6": true,
"node": true,
"jest": true
},
"extends": [ "xo", "plugin:unicorn/recommended" ],
"plugins": [ "import", "unicorn" ],
"rules": {
// omit semicolons. there's only a few cases where automatic
// semicolon insertion is problematic - most of which can be
// mitigated by other linting rules such as func-call-spacing
// or no-unexpected-multiline
"semi": [ 2, "never" ],
// enforce 2-space indentation
"indent": [ 2, 2 ],
// enforce arrow parens, regardless of argument count
"arrow-parens": [ 2, "always" ],
// enforce dangling commas for multiline statements
"comma-dangle": [ 2, "always-multiline" ],
// enforce consistent spacing inside braces and brackets
"array-bracket-spacing": [ 2, "always", {
"arraysInArrays": false,
"objectsInArrays": false
}],
"object-curly-spacing": [ 2, "always", {
"arraysInObjects": false,
"objectsInObjects": false
}],
// enforce consistent linebreak style for operators, with an
// exception being made for multi-line-ternaries so those are
// easier to spot
"operator-linebreak": [ 2, "after", {
"overrides": { "?": "before", ":": "before" }
}]
}
}
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId])
/******/ return installedModules[moduleId].exports;
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/ // identity function for calling harmony imports with the correct context
/******/ __webpack_require__.i = function(value) { return value; };
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 43);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports, __webpack_require__) {
var defineProperty = __webpack_require__(24);
/**
* The base implementation of `assignValue` and `assignMergeValue` without
* value checks.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function baseAssignValue(object, key, value) {
if (key == '__proto__' && defineProperty) {
defineProperty(object, key, {
'configurable': true,
'enumerable': true,
'value': value,
'writable': true
});
} else {
object[key] = value;
}
}
module.exports = baseAssignValue;
/***/ }),
/* 1 */
/***/ (function(module, exports) {
/**
* This method returns the first argument it receives.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Util
* @param {*} value Any value.
* @returns {*} Returns `value`.
* @example
*
* var object = { 'a': 1 };
*
* console.log(_.identity(object) === object);
* // => true
*/
function identity(value) {
return value;
}
module.exports = identity;
/***/ }),
/* 2 */
/***/ (function(module, exports, __webpack_require__) {
var arrayMap = __webpack_require__(15),
baseIteratee = __webpack_require__(1),
basePickBy = __webpack_require__(21),
getAllKeysIn = __webpack_require__(25);
/**
* Creates an object composed of the `object` properties `predicate` returns
* truthy for. The predicate is invoked with two arguments: (value, key).
*
* @static
* @memberOf _
* @since 4.0.0
* @category Object
* @param {Object} object The source object.
* @param {Function} [predicate=_.identity] The function invoked per property.
* @returns {Object} Returns the new object.
* @example
*
* var object = { 'a': 1, 'b': '2', 'c': 3 };
*
* _.pickBy(object, _.isNumber);
* // => { 'a': 1, 'c': 3 }
*/
function pickBy(object, predicate) {
if (object == null) {
return {};
}
var props = arrayMap(getAllKeysIn(object), function(prop) {
return [prop];
});
predicate = baseIteratee(predicate);
return basePickBy(object, props, function(value, path) {
return predicate(value, path[0]);
});
}
module.exports = pickBy;
/***/ }),
/* 3 */
/***/ (function(module, exports, __webpack_require__) {
var baseFor = __webpack_require__(17),
keys = __webpack_require__(39);
/**
* The base implementation of `_.forOwn` without support for iteratee shorthands.
*
* @private
* @param {Object} object The object to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Object} Returns `object`.
*/
function baseForOwn(object, iteratee) {
return object && baseFor(object, iteratee, keys);
}
module.exports = baseForOwn;
/***/ }),
/* 4 */
/***/ (function(module, exports) {
/**
* This method returns the first argument it receives.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Util
* @param {*} value Any value.
* @returns {*} Returns `value`.
* @example
*
* var object = { 'a': 1 };
*
* console.log(_.identity(object) === object);
* // => true
*/
function identity(value) {
return value;
}
module.exports = identity;
/***/ }),
/* 5 */
/***/ (function(module, exports) {
/**
* Creates a unary function that invokes `func` with its argument transformed.
*
* @private
* @param {Function} func The function to wrap.
* @param {Function} transform The argument transform.
* @returns {Function} Returns the new function.
*/
function overArg(func, transform) {
return function(arg) {
return func(transform(arg));
};
}
module.exports = overArg;
/***/ }),
/* 6 */
/***/ (function(module, exports) {
/**
* Creates an array with all falsey values removed. The values `false`, `null`,
* `0`, `""`, `undefined`, and `NaN` are falsey.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Array
* @param {Array} array The array to compact.
* @returns {Array} Returns the new array of filtered values.
* @example
*
* _.compact([0, 1, false, 2, '', 3]);
* // => [1, 2, 3]
*/
function compact(array) {
var index = -1,
length = array == null ? 0 : array.length,
resIndex = 0,
result = [];
while (++index < length) {
var value = array[index];
if (value) {
result[resIndex++] = value;
}
}
return result;
}
module.exports = compact;
/***/ }),
/* 7 */
/***/ (function(module, exports) {
/**
* Checks if `value` is classified as an `Array` object.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an array, else `false`.
* @example
*
* _.isArray([1, 2, 3]);
* // => true
*
* _.isArray(document.body.children);
* // => false
*
* _.isArray('abc');
* // => false
*
* _.isArray(_.noop);
* // => false
*/
var isArray = Array.isArray;
module.exports = isArray;
/***/ }),
/* 8 */
/***/ (function(module, exports) {
/**
* Checks if `value` is the
* [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
* of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an object, else `false`.
* @example
*
* _.isObject({});
* // => true
*
* _.isObject([1, 2, 3]);
* // => true
*
* _.isObject(_.noop);
* // => true
*
* _.isObject(null);
* // => false
*/
function isObject(value) {
var type = typeof value;
return value != null && (type == 'object' || type == 'function');
}
module.exports = isObject;
/***/ }),
/* 9 */
/***/ (function(module, exports) {
/**
* A specialized version of `_.map` for arrays without support for iteratee
* shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns the new mapped array.
*/
function arrayMap(array, iteratee) {
var index = -1,
length = array == null ? 0 : array.length,
result = Array(length);
while (++index < length) {
result[index] = iteratee(array[index], index, array);
}
return result;
}
module.exports = arrayMap;
/***/ }),
/* 10 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.parseStyles = exports.parseValues = exports.parseHexColor = exports.parseNumber = exports.combine = exports.split = undefined;
var _map2 = __webpack_require__(9);
var _map3 = _interopRequireDefault(_map2);
var _isArray2 = __webpack_require__(7);
var _isArray3 = _interopRequireDefault(_isArray2);
var _compact2 = __webpack_require__(6);
var _compact3 = _interopRequireDefault(_compact2);
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
// css properties that can have values joined by spaces
var spaceCombinedProps = ['-moz-outline-radius', '-webkit-text-stroke', 'background', 'border', 'border-bottom', 'border-color', 'border-left', 'border-radius', 'border-right', 'border-spacing', 'border-top', 'border-width', 'margin', 'outline', 'padding'];
// splits a css property value into multiple values
var split = exports.split = function split(key, value) {
if (spaceCombinedProps.indexOf(key) >= 0) {
var arr = value.split(' ');
return arr.length === 1 ? arr[0] : arr;
}
return value;
};
// combines multiple values to a single css property value
var combine = exports.combine = function combine(key, value) {
return (0, _isArray3.default)(value) && spaceCombinedProps.indexOf(key) >= 0 ? value.join(' ') : value;
};
// this splits css numbers from units.
//
// according to the css spec, a number can either be an integer or it can be
// zero or more digits followed by a dot followed by one or more digits.
// assuming the unit can be any sequence of lowercase letters (including none)
//
// returns an object with `unit` and `value` properties.
var parseNumber = exports.parseNumber = function parseNumber(number) {
var regex = /^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/;
var _ref = ('' + number).match(regex) || [],
_ref2 = _slicedToArray(_ref, 3),
value = _ref2[1],
unit = _ref2[2];
return value ? { unit: unit, value: Number(value) } : undefined;
};
// check if a string is a hex color. returns an array of three integers
// between 0 and 255 for the three rgb components if it is.
var parseHexColor = exports.parseHexColor = function parseHexColor(color) {
var _ref3 = ('' + color).match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i) || [],
_ref4 = _slicedToArray(_ref3, 2),
hex = _ref4[1];
if (hex) {
hex = hex.length === 3 ? (0, _map3.default)(hex, function (v) {
return '' + v + v;
}).join('') : hex;
return (0, _map3.default)(hex.match(/.{1,2}/g), function (v) {
return parseInt(v, 16);
});
}
};
// parses css startValue and endValue.
//
// returns an object consisting of start and end values for interpolation
// and an additional unit if the start and end values are numeric. in cases
// of unchanged values, returns the fixed value
var parseValues = exports.parseValues = function parseValues(startValue, endValue) {
// when both values are equal, the value is fixed
if (startValue === endValue) {
return { fixed: startValue };
}
// check if both values are numeric with optional unit
var numericStart = parseNumber(startValue);
var numericEnd = parseNumber(endValue);
if (numericStart && numericEnd) {
var startUnit = numericStart.unit;
var endUnit = numericEnd.unit;
// when start unit is the same as end unit or one of them is unitless
if (startUnit === endUnit || !startUnit || !endUnit) {
return {
unit: startUnit || endUnit,
start: numericStart.value,
end: numericEnd.value
};
}
}
// check of both values are hex rgb colors
var colorStart = parseHexColor(startValue);
var colorEnd = parseHexColor(endValue);
if (colorStart && colorEnd) {
return { rgb: [colorStart, colorEnd] };
}
};
// returns an object that lists the property, unit, start and end values of
// the animatable properties based on the given arguments.
//
// to be animatable, a property has to be present on both `startStyles` and
// `endProps` with a numeric value and same unit for both or unitless for one
// of them which will then take the unit of the other.
var parseStyles = exports.parseStyles = function parseStyles(startStyles, endStyles) {
var result = [];
var _loop = function _loop(prop) {
// only animate props that exist in both start and end styles
if (!(prop in endStyles)) {
return 'break';
}
// in case of combined values, split them!
var startValues = [].concat(split(prop, startStyles[prop]));
var endValues = [].concat(split(prop, endStyles[prop]));
// only animate props that have the same number of values
if (startValues.length !== endValues.length) {
return 'break';
}
// parse start and end value combinations
var parsedValues = (0, _compact3.default)((0, _map3.default)(startValues, function (value, key) {
var parsed = parseValues(value, endValues[key]);
return parsed ? _extends({ prop: prop }, parsed) : null;
}));
// when parsing was successful for every combination, use the results
if (parsedValues.length === startValues.length) {
result = result.concat(parsedValues);
}
};
for (var prop in startStyles) {
var _ret = _loop(prop);
if (_ret === 'break') break;
}
return result;
};
/***/ }),
/* 11 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.rgbFloatToHex = exports.toString = exports.omitEmptyValues = exports.appendToKeys = exports.calculateObsoleteValues = exports.calculateObsoleteFrames = exports.addValueToProperty = exports.getInterpolator = undefined;
var _reduce2 = __webpack_require__(42);
var _reduce3 = _interopRequireDefault(_reduce2);
var _pickBy2 = __webpack_require__(2);
var _pickBy3 = _interopRequireDefault(_pickBy2);
var _negate2 = __webpack_require__(41);
var _negate3 = _interopRequireDefault(_negate2);
var _mapKeys2 = __webpack_require__(40);
var _mapKeys3 = _interopRequireDefault(_mapKeys2);
var _map2 = __webpack_require__(9);
var _map3 = _interopRequireDefault(_map2);
var _isEmpty2 = __webpack_require__(35);
var _isEmpty3 = _interopRequireDefault(_isEmpty2);
var _compact2 = __webpack_require__(6);
var _compact3 = _interopRequireDefault(_compact2);
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
var _interpolate3 = __webpack_require__(14);
var _interpolate4 = _interopRequireDefault(_interpolate3);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
// returns interpolation method based on stiffness and damping.
var getInterpolator = exports.getInterpolator = function getInterpolator(stiffness, damping) {
// interpolation method is invoked with start and end values and returns
// an array consisting of start, 99 interpolated values inbetween and end.
return function (value, end, velocity) {
var interpolated = [value].concat(_toConsumableArray(Array(99)), [end]);
return (0, _map3.default)(interpolated, function () {
var _interpolate = (0, _interpolate4.default)(0.01, value, velocity || 0, end, stiffness, damping);
var _interpolate2 = _slicedToArray(_interpolate, 2);
value = _interpolate2[0];
velocity = _interpolate2[1];
return value;
});
};
};
// adds a value to an objects property.
// when a property value exists, forms an array of values.
var addValueToProperty = exports.addValueToProperty = function addValueToProperty() {
var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var prop = arguments[1];
var value = arguments[2];
return Object.assign(obj, _defineProperty({}, prop, obj[prop] === undefined ? value : [].concat(obj[prop], value)));
};
// based on an array with interpolated values for a property, return
// an array with indices that are obsolete.
var calculateObsoleteFrames = exports.calculateObsoleteFrames = function calculateObsoleteFrames(arr, prop) {
return (0, _compact3.default)((0, _map3.default)(arr, function (value, i, arr) {
var current = JSON.stringify(value[prop]);
var previous = JSON.stringify((arr[i - 1] || {})[prop]);
var next = JSON.stringify((arr[i + 1] || {})[prop]);
// when the current value equals the previous and the next one
// mark the current value as obsolete
return current === next && current === previous ? i : null;
}));
};
// calculate obsolete values based on an array of properties and
var calculateObsoleteValues = exports.calculateObsoleteValues = function calculateObsoleteValues(keyframes) {
return (0, _reduce3.default)(Object.keys(keyframes[0]), function (accumulator, property) {
return Object.assign(accumulator, _defineProperty({}, property, calculateObsoleteFrames(Object.values(keyframes), property)));
}, {});
};
// append a string to every key of an object
var appendToKeys = exports.appendToKeys = function appendToKeys(obj, suffix) {
return (0, _mapKeys3.default)(obj, function (_, key) {
return '' + key + suffix;
});
};
// omit all properties with empty values from an object
var omitEmptyValues = exports.omitEmptyValues = function omitEmptyValues(obj) {
return (0, _pickBy3.default)(obj, function (value) {
return (0, _negate3.default)(_isEmpty3.default)(value);
});
};
// format keyframe styles to string
var defaultFormatter = function defaultFormatter(key, value) {
return key + ':' + value + ';';
};
var toString = exports.toString = function toString(keyframes) {
var formatter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultFormatter;
return Object.keys(keyframes).reduce(function (outer, perc) {
var value = Object.keys(keyframes[perc]).reduce(function (inner, prop) {
return '' + inner + formatter(prop, keyframes[perc][prop]);
}, '');
return '' + outer + perc + '{' + value + '}';
}, '');
};
// convert an interpolated rgb color value float to hex
var rgbFloatToHex = exports.rgbFloatToHex = function rgbFloatToHex(float) {
var limited = Math.min(255, Math.max(0, float));
return ('0' + Number(limited.toFixed(0)).toString(16)).substr(-2);
};
/***/ }),
/* 12 */
/***/ (function(module, exports) {
/**
* Checks if `value` is `null` or `undefined`.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is nullish, else `false`.
* @example
*
* _.isNil(null);
* // => true
*
* _.isNil(void 0);
* // => true
*
* _.isNil(NaN);
* // => false
*/
function isNil(value) {
return value == null;
}
module.exports = isNil;
/***/ }),
/* 13 */
/***/ (function(module, exports, __webpack_require__) {
var baseAssignValue = __webpack_require__(0),
baseForOwn = __webpack_require__(3),
baseIteratee = __webpack_require__(1);
/**
* Creates an object with the same keys as `object` and values generated
* by running each own enumerable string keyed property of `object` thru
* `iteratee`. The iteratee is invoked with three arguments:
* (value, key, object).
*
* @static
* @memberOf _
* @since 2.4.0
* @category Object
* @param {Object} object The object to iterate over.
* @param {Function} [iteratee=_.identity] The function invoked per iteration.
* @returns {Object} Returns the new mapped object.
* @see _.mapKeys
* @example
*
* var users = {
* 'fred': { 'user': 'fred', 'age': 40 },
* 'pebbles': { 'user': 'pebbles', 'age': 1 }
* };
*
* _.mapValues(users, function(o) { return o.age; });
* // => { 'fred': 40, 'pebbles': 1 } (iteration order is not guaranteed)
*
* // The `_.property` iteratee shorthand.
* _.mapValues(users, 'age');
* // => { 'fred': 40, 'pebbles': 1 } (iteration order is not guaranteed)
*/
function mapValues(object, iteratee) {
var result = {};
iteratee = baseIteratee(iteratee, 3);
baseForOwn(object, function(value, key, object) {
baseAssignValue(result, key, iteratee(value, key, object));
});
return result;
}
module.exports = mapValues;
/***/ }),
/* 14 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
// Taken from react-motion
// @see https://github.com/chenglou/react-motion/blob/master/src/stepper.js
var reusedTuple = [0, 0];
// eslint-disable-next-line max-params
var stepper = function stepper(secondPerFrame, x, v, destX, k, b) {
var precision = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : 0.01;
// Spring stiffness, in kg / s^2
// for animations, destX is really spring length (spring at rest). initial
// position is considered as the stretched/compressed position of a spring
var Fspring = -k * (x - destX);
// Damping, in kg / s
var Fdamper = -b * v;
// usually we put mass here, but for animation purposes, specifying mass is a
// bit redundant. you could simply adjust k and b accordingly
// let a = (Fspring + Fdamper) / mass;
var a = Fspring + Fdamper;
var newV = v + a * secondPerFrame;
var newX = x + newV * secondPerFrame;
stepper.count += 1;
if (Math.abs(newV) < precision && Math.abs(newX - destX) < precision) {
reusedTuple[0] = destX;
reusedTuple[1] = 0;
return reusedTuple;
}
reusedTuple[0] = newX;
reusedTuple[1] = newV;
return reusedTuple;
};
stepper.count = 0;
exports.default = stepper;
/***/ }),
/* 15 */
/***/ (function(module, exports) {
/**
* A specialized version of `_.map` for arrays without support for iteratee
* shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns the new mapped array.
*/
function arrayMap(array, iteratee) {
var index = -1,
length = array == null ? 0 : array.length,
result = Array(length);
while (++index < length) {
result[index] = iteratee(array[index], index, array);
}
return result;
}
module.exports = arrayMap;
/***/ }),
/* 16 */
/***/ (function(module, exports, __webpack_require__) {
var baseAssignValue = __webpack_require__(0),
eq = __webpack_require__(31);
/** Used for built-in method references. */
var objectProto = Object.prototype;
/** Used to check objects for own properties. */
var hasOwnProperty = objectProto.hasOwnProperty;
/**
* Assigns `value` to `key` of `object` if the existing value is not equivalent
* using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
* for equality comparisons.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function assignValue(object, key, value) {
var objValue = object[key];
if (!(hasOwnProperty.call(object, key) && eq(objValue, value)) ||
(value === undefined && !(key in object))) {
baseAssignValue(object, key, value);
}
}
module.exports = assignValue;
/***/ }),
/* 17 */
/***/ (function(module, exports, __webpack_require__) {
var createBaseFor = __webpack_require__(23);
/**
* The base implementation of `baseForOwn` which iterates over `object`
* properties returned by `keysFunc` and invokes `iteratee` for each property.
* Iteratee functions may exit iteration early by explicitly returning `false`.
*
* @private
* @param {Object} object The object to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @param {Function} keysFunc The function to get the keys of `object`.
* @returns {Object} Returns `object`.
*/
var baseFor = createBaseFor();
module.exports = baseFor;
/***/ }),
/* 18 */
/***/ (function(module, exports) {
/**
* Gets the value at `key` of `object`.
*
* @private
* @param {Object} [object] The object to query.
* @param {string} key The key of the property to get.
* @returns {*} Returns the property value.
*/
function getValue(object, key) {
return object == null ? undefined : object[key];
}
module.exports = getValue;
/***/ }),
/* 19 */
/***/ (function(module, exports) {
/** Used for built-in method references. */
var objectProto = Object.prototype;
/**
* Used to resolve the
* [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
* of values.
*/
var nativeObjectToString = objectProto.toString;
/**
* Converts `value` to a string using `Object.prototype.toString`.
*
* @private
* @param {*} value The value to convert.
* @returns {string} Returns the converted string.
*/
function objectToString(value) {
return nativeObjectToString.call(value);
}
module.exports = objectToString;
/***/ }),
/* 20 */
/***/ (function(module, exports, __webpack_require__) {
var overArg = __webpack_require__(5);
/* Built-in method references for those with the same name as other `lodash` methods. */
var nativeKeys = overArg(Object.keys, Object);
module.exports = nativeKeys;
/***/ }),
/* 21 */
/***/ (function(module, exports, __webpack_require__) {
var baseGet = __webpack_require__(18),
baseSet = __webpack_require__(22),
castPath = __webpack_require__(4);
/**
* The base implementation of `_.pickBy` without support for iteratee shorthands.
*
* @private
* @param {Object} object The source object.
* @param {string[]} paths The property paths to pick.
* @param {Function} predicate The function invoked per property.
* @returns {Object} Returns the new object.
*/
function basePickBy(object, paths, predicate) {
var index = -1,
length = paths.length,
result = {};
while (++index < length) {
var path = paths[index],
value = baseGet(object, path);
if (predicate(value, path)) {
baseSet(result, castPath(path, object), value);
}
}
return result;
}
module.exports = basePickBy;
/***/ }),
/* 22 */
/***/ (function(module, exports, __webpack_require__) {
var assignValue = __webpack_require__(16),
castPath = __webpack_require__(4),
isIndex = __webpack_require__(28),
isObject = __webpack_require__(8),
toKey = __webpack_require__(30);
/**
* The base implementation of `_.set`.
*
* @private
* @param {Object} object The object to modify.
* @param {Array|string} path The path of the property to set.
* @param {*} value The value to set.
* @param {Function} [customizer] The function to customize path creation.
* @returns {Object} Returns `object`.
*/
function baseSet(object, path, value, customizer) {
if (!isObject(object)) {
return object;
}
path = castPath(path, object);
var index = -1,
length = path.length,
lastIndex = length - 1,
nested = object;
while (nested != null && ++index < length) {
var key = toKey(path[index]),
newValue = value;
if (index != lastIndex) {
var objValue = nested[key];
newValue = customizer ? customizer(objValue, key, nested) : undefined;
if (newValue === undefined) {
newValue = isObject(objValue)
? objValue
: (isIndex(path[index + 1]) ? [] : {});
}
}
assignValue(nested, key, newValue);
nested = nested[key];
}
return object;
}
module.exports = baseSet;
/***/ }),
/* 23 */
/***/ (function(module, exports) {
/**
* Creates a base function for methods like `_.forIn` and `_.forOwn`.
*
* @private
* @param {boolean} [fromRight] Specify iterating from right to left.
* @returns {Function} Returns the new base function.
*/
function createBaseFor(fromRight) {
return function(object, iteratee, keysFunc) {
var index = -1,
iterable = Object(object),
props = keysFunc(object),
length = props.length;
while (length--) {
var key = props[fromRight ? length : ++index];
if (iteratee(iterable[key], key, iterable) === false) {
break;
}
}
return object;
};
}
module.exports = createBaseFor;
/***/ }),
/* 24 */
/***/ (function(module, exports, __webpack_require__) {
var getNative = __webpack_require__(26);
var defineProperty = (function() {
try {
var func = getNative(Object, 'defineProperty');
func({}, '', {});
return func;
} catch (e) {}
}());
module.exports = defineProperty;
/***/ }),
/* 25 */
/***/ (function(module, exports) {
/**
* This function is like
* [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)
* except that it includes inherited enumerable properties.
*
* @private
* @param {Object} object The object to query.
* @returns {Array} Returns the array of property names.
*/
function nativeKeysIn(object) {
var result = [];
if (object != null) {
for (var key in Object(object)) {
result.push(key);
}
}
return result;
}
module.exports = nativeKeysIn;
/***/ }),
/* 26 */
/***/ (function(module, exports) {
/**
* Gets the value at `key` of `object`.
*
* @private
* @param {Object} [object] The object to query.
* @param {string} key The key of the property to get.
* @returns {*} Returns the property value.
*/
function getValue(object, key) {
return object == null ? undefined : object[key];
}
module.exports = getValue;
/***/ }),
/* 27 */
/***/ (function(module, exports) {
/** Used for built-in method references. */
var objectProto = Object.prototype;
/**
* Used to resolve the
* [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
* of values.
*/
var nativeObjectToString = objectProto.toString;
/**
* Converts `value` to a string using `Object.prototype.toString`.
*
* @private
* @param {*} value The value to convert.
* @returns {string} Returns the converted string.
*/
function objectToString(value) {
return nativeObjectToString.call(value);
}
module.exports = objectToString;
/***/ }),
/* 28 */
/***/ (function(module, exports) {
/** Used as references for various `Number` constants. */
var MAX_SAFE_INTEGER = 9007199254740991;
/** Used to detect unsigned integer values. */
var reIsUint = /^(?:0|[1-9]\d*)$/;
/**
* Checks if `value` is a valid array-like index.
*
* @private
* @param {*} value The value to check.
* @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
* @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
*/
function isIndex(value, length) {
length = length == null ? MAX_SAFE_INTEGER : length;
return !!length &&
(typeof value == 'number' || reIsUint.test(value)) &&
(value > -1 && value % 1 == 0 && value < length);
}
module.exports = isIndex;
/***/ }),
/* 29 */
/***/ (function(module, exports) {
/**
* This method returns `false`.
*
* @static
* @memberOf _
* @since 4.13.0
* @category Util
* @returns {boolean} Returns `false`.
* @example
*
* _.times(2, _.stubFalse);
* // => [false, false]
*/
function stubFalse() {
return false;
}
module.exports = stubFalse;
/***/ }),
/* 30 */
/***/ (function(module, exports) {
/**
* This method returns the first argument it receives.
*
* @static
* @since 0.1.0
* @memberOf _
* @category Util
* @param {*} value Any value.
* @returns {*} Returns `value`.
* @example
*
* var object = { 'a': 1 };
*
* console.log(_.identity(object) === object);
* // => true
*/
function identity(value) {
return value;
}
module.exports = identity;
/***/ }),
/* 31 */
/***/ (function(module, exports) {
/**
* Performs a
* [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
* comparison between two values to determine if they are equivalent.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to compare.
* @param {*} other The other value to compare.
* @returns {boolean} Returns `true` if the values are equivalent, else `false`.
* @example
*
* var object = { 'a': 1 };
* var other = { 'a': 1 };
*
* _.eq(object, object);
* // => true
*
* _.eq(object, other);
* // => false
*
* _.eq('a', 'a');
* // => true
*
* _.eq('a', Object('a'));
* // => false
*
* _.eq(NaN, NaN);
* // => true
*/
function eq(value, other) {
return value === other || (value !== value && other !== other);
}
module.exports = eq;
/***/ }),
/* 32 */
/***/ (function(module, exports) {
/**
* This method returns `false`.
*
* @static
* @memberOf _
* @since 4.13.0
* @category Util
* @returns {boolean} Returns `false`.
* @example
*
* _.times(2, _.stubFalse);
* // => [false, false]
*/
function stubFalse() {
return false;
}
module.exports = stubFalse;
/***/ }),
/* 33 */
/***/ (function(module, exports, __webpack_require__) {
var isFunction = __webpack_require__(36),
isLength = __webpack_require__(37);
/**
* Checks if `value` is array-like. A value is considered array-like if it's
* not a function and has a `value.length` that's an integer greater than or
* equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is array-like, else `false`.
* @example
*
* _.isArrayLike([1, 2, 3]);
* // => true
*
* _.isArrayLike(document.body.children);
* // => true
*
* _.isArrayLike('abc');
* // => true
*
* _.isArrayLike(_.noop);
* // => false
*/
function isArrayLike(value) {
return value != null && isLength(value.length) && !isFunction(value);
}
module.exports = isArrayLike;
/***/ }),
/* 34 */
/***/ (function(module, exports) {
/**
* This method returns `false`.
*
* @static
* @memberOf _
* @since 4.13.0
* @category Util
* @returns {boolean} Returns `false`.
* @example
*
* _.times(2, _.stubFalse);
* // => [false, false]
*/
function stubFalse() {
return false;
}
module.exports = stubFalse;
/***/ }),
/* 35 */
/***/ (function(module, exports, __webpack_require__) {
var baseKeys = __webpack_require__(20),
getTag = __webpack_require__(27),
isArguments = __webpack_require__(32),
isArray = __webpack_require__(7),
isArrayLike = __webpack_require__(33),
isBuffer = __webpack_require__(34),
isPrototype = __webpack_require__(29),
isTypedArray = __webpack_require__(38);
/** `Object#toString` result references. */
var mapTag = '[object Map]',
setTag = '[object Set]';
/** Used for built-in method references. */
var objectProto = Object.prototype;
/** Used to check objects for own properties. */
var hasOwnProperty = objectProto.hasOwnProperty;
/**
* Checks if `value` is an empty object, collection, map, or set.
*
* Objects are considered empty if they have no own enumerable string keyed
* properties.
*
* Array-like values such as `arguments` objects, arrays, buffers, strings, or
* jQuery-like collections are considered empty if they have a `length` of `0`.
* Similarly, maps and sets are considered empty if they have a `size` of `0`.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is empty, else `false`.
* @example
*
* _.isEmpty(null);
* // => true
*
* _.isEmpty(true);
* // => true
*
* _.isEmpty(1);
* // => true
*
* _.isEmpty([1, 2, 3]);
* // => false
*
* _.isEmpty({ 'a': 1 });
* // => false
*/
function isEmpty(value) {
if (value == null) {
return true;
}
if (isArrayLike(value) &&
(isArray(value) || typeof value == 'string' || typeof value.splice == 'function' ||
isBuffer(value) || isTypedArray(value) || isArguments(value))) {
return !value.length;
}
var tag = getTag(value);
if (tag == mapTag || tag == setTag) {
return !value.size;
}
if (isPrototype(value)) {
return !baseKeys(value).length;
}
for (var key in value) {
if (hasOwnProperty.call(value, key)) {
return false;
}
}
return true;
}
module.exports = isEmpty;
/***/ }),
/* 36 */
/***/ (function(module, exports, __webpack_require__) {
var baseGetTag = __webpack_require__(19),
isObject = __webpack_require__(8);
/** `Object#toString` result references. */
var asyncTag = '[object AsyncFunction]',
funcTag = '[object Function]',
genTag = '[object GeneratorFunction]',
proxyTag = '[object Proxy]';
/**
* Checks if `value` is classified as a `Function` object.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a function, else `false`.
* @example
*
* _.isFunction(_);
* // => true
*
* _.isFunction(/abc/);
* // => false
*/
function isFunction(value) {
if (!isObject(value)) {
return false;
}
// The use of `Object#toString` avoids issues with the `typeof` operator
// in Safari 9 which returns 'object' for typed arrays and other constructors.
var tag = baseGetTag(value);
return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;
}
module.exports = isFunction;
/***/ }),
/* 37 */
/***/ (function(module, exports) {
/** Used as references for various `Number` constants. */
var MAX_SAFE_INTEGER = 9007199254740991;
/**
* Checks if `value` is a valid array-like length.
*
* **Note:** This method is loosely based on
* [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).
*
* @static
* @memberOf _
* @since 4.0.0
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
* @example
*
* _.isLength(3);
* // => true
*
* _.isLength(Number.MIN_VALUE);
* // => false
*
* _.isLength(Infinity);
* // => false
*
* _.isLength('3');
* // => false
*/
function isLength(value) {
return typeof value == 'number' &&
value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
}
module.exports = isLength;
/***/ }),
/* 38 */
/***/ (function(module, exports) {
/**
* This method returns `false`.
*
* @static
* @memberOf _
* @since 4.13.0
* @category Util
* @returns {boolean} Returns `false`.
* @example
*
* _.times(2, _.stubFalse);
* // => [false, false]
*/
function stubFalse() {
return false;
}
module.exports = stubFalse;
/***/ }),
/* 39 */
/***/ (function(module, exports, __webpack_require__) {
var overArg = __webpack_require__(5);
/* Built-in method references for those with the same name as other `lodash` methods. */
var nativeKeys = overArg(Object.keys, Object);
module.exports = nativeKeys;
/***/ }),
/* 40 */
/***/ (function(module, exports, __webpack_require__) {
var baseAssignValue = __webpack_require__(0),
baseForOwn = __webpack_require__(3),
baseIteratee = __webpack_require__(1);
/**
* The opposite of `_.mapValues`; this method creates an object with the
* same values as `object` and keys generated by running each own enumerable
* string keyed property of `object` thru `iteratee`. The iteratee is invoked
* with three arguments: (value, key, object).
*
* @static
* @memberOf _
* @since 3.8.0
* @category Object
* @param {Object} object The object to iterate over.
* @param {Function} [iteratee=_.identity] The function invoked per iteration.
* @returns {Object} Returns the new mapped object.
* @see _.mapValues
* @example
*
* _.mapKeys({ 'a': 1, 'b': 2 }, function(value, key) {
* return key + value;
* });
* // => { 'a1': 1, 'b2': 2 }
*/
function mapKeys(object, iteratee) {
var result = {};
iteratee = baseIteratee(iteratee, 3);
baseForOwn(object, function(value, key, object) {
baseAssignValue(result, iteratee(value, key, object), value);
});
return result;
}
module.exports = mapKeys;
/***/ }),
/* 41 */
/***/ (function(module, exports) {
/** Error message constants. */
var FUNC_ERROR_TEXT = 'Expected a function';
/**
* Creates a function that negates the result of the predicate `func`. The
* `func` predicate is invoked with the `this` binding and arguments of the
* created function.
*
* @static
* @memberOf _
* @since 3.0.0
* @category Function
* @param {Function} predicate The predicate to negate.
* @returns {Function} Returns the new negated function.
* @example
*
* function isEven(n) {
* return n % 2 == 0;
* }
*
* _.filter([1, 2, 3, 4, 5, 6], _.negate(isEven));
* // => [1, 3, 5]
*/
function negate(predicate) {
if (typeof predicate != 'function') {
throw new TypeError(FUNC_ERROR_TEXT);
}
return function() {
var args = arguments;
switch (args.length) {
case 0: return !predicate.call(this);
case 1: return !predicate.call(this, args[0]);
case 2: return !predicate.call(this, args[0], args[1]);
case 3: return !predicate.call(this, args[0], args[1], args[2]);
}
return !predicate.apply(this, args);
};
}
module.exports = negate;
/***/ }),
/* 42 */
/***/ (function(module, exports) {
/**
* A specialized version of `_.reduce` for arrays without support for
* iteratee shorthands.
*
* @private
* @param {Array} [array] The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @param {*} [accumulator] The initial value.
* @param {boolean} [initAccum] Specify using the first element of `array` as
* the initial value.
* @returns {*} Returns the accumulated value.
*/
function arrayReduce(array, iteratee, accumulator, initAccum) {
var index = -1,
length = array == null ? 0 : array.length;
if (initAccum && length) {
accumulator = array[++index];
}
while (++index < length) {
accumulator = iteratee(accumulator, array[index], index, array);
}
return accumulator;
}
module.exports = arrayReduce;
/***/ }),
/* 43 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.toString = exports.spring = undefined;
var _pickBy2 = __webpack_require__(2);
var _pickBy3 = _interopRequireDefault(_pickBy2);
var _mapValues2 = __webpack_require__(13);
var _mapValues3 = _interopRequireDefault(_mapValues2);
var _isNil2 = __webpack_require__(12);
var _isNil3 = _interopRequireDefault(_isNil2);
var _parse = __webpack_require__(10);
var _util = __webpack_require__(11);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
// spring presets. selected combinations of stiffness/damping.
var presets = {
noWobble: { stiffness: 170, damping: 26 },
gentle: { stiffness: 120, damping: 14 },
wobbly: { stiffness: 180, damping: 12 },
stiff: { stiffness: 210, damping: 20 }
};
// default spring options.
// damping and precision reflect the values of the `wobbly` preset,
// precision defaults to 2 which should be a good tradeoff between
// animation detail and resulting filesize.
var defaultOptions = {
stiffness: 180,
damping: 12,
precision: 2
};
// css-spring
// ----------
// invoke with startStyles, endStyles and options and gain a keyframe
// style object with interpolated values.
var spring = exports.spring = function spring(startStyles, endStyles) {
var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var result = {};
// define stiffness, damping and precision based on default options
// and options given in arguments.
var _Object$assign = Object.assign({}, defaultOptions, options, presets[options.preset] || {}),
stiffness = _Object$assign.stiffness,
damping = _Object$assign.damping,
precision = _Object$assign.precision;
// get an interpolation function and parse start- and end styles
var interpolate = (0, _util.getInterpolator)(stiffness, damping);
var parsed = (0, _parse.parseStyles)(startStyles, endStyles);
// build keyframe styles based on parsed properties
parsed.forEach(function (_ref) {
var prop = _ref.prop,
unit = _ref.unit,
start = _ref.start,
end = _ref.end,
rgb = _ref.rgb,
fixed = _ref.fixed;
// if start and end values differ, interpolate between them
if (!(0, _isNil3.default)(start) && !(0, _isNil3.default)(end)) {
interpolate(start, end).forEach(function (interpolated, i) {
// round to desired precision (except when interpolating pixels)
var value = Number(interpolated.toFixed(unit === 'px' ? 0 : precision));
// add unit when applicable
value = value === 0 || !unit ? value : '' + value + unit;
result[i] = (0, _util.addValueToProperty)(result[i], prop, value);
});
// if hex representations of rgb colors are found
} else if (!(0, _isNil3.default)(rgb)) {
(function () {
// interpolate each color component separately
var r = interpolate(rgb[0][0], rgb[1][0]);
var g = interpolate(rgb[0][1], rgb[1][1]);
var b = interpolate(rgb[0][2], rgb[1][2]);
r.forEach(function (interpolated, i) {
var toRgb = _util.rgbFloatToHex;
result[i] = (0, _util.addValueToProperty)(result[i], prop, '#' + toRgb(r[i]) + toRgb(g[i]) + toRgb(b[i]));
});
// otherwise the value is fixed and can directly be appended to the
// resulting keyframe styles
})();
} else if (!(0, _isNil3.default)(fixed)) {
for (var i = 0; i < 101; i += 1) {
result[i] = (0, _util.addValueToProperty)(result[i], prop, fixed);
}
}
});
// remove obsolete values, combine multiple values for the same property
// to single ones and append % to the object keys
var obsoleteValues = (0, _util.calculateObsoleteValues)(result);
result = (0, _mapValues3.default)(result, function (value, i) {
var result = (0, _mapValues3.default)(value, function (value, key) {
return (0, _parse.combine)(key, value);
});
return (0, _pickBy3.default)(result, function (_, property) {
return obsoleteValues[property].indexOf(Number(i)) < 0;
});
});
result = (0, _util.omitEmptyValues)(result);
result = (0, _util.appendToKeys)(result, '%');
// console.log(result)
return result;
};
// console.time('interpolate')
// spring({
// left: '10px',
// right: '20px',
// padding: '0 0 10px 10rem',
// opacity: 0,
// }, {
// left: '20px',
// right: 0,
// padding: '10em 10em 0 20rem',
// opacity: 1,
// }, {
// preset: 'noWobble',
// })
// console.timeEnd('interpolate')
// console.time('interpolate 2')
// spring(
// { 'margin-left': `250px`, border: '1px solid #f00' },
// { 'margin-left': 0, border: '10px solid #bada55' },
// { preset: 'gentle' },
// )
// console.timeEnd('interpolate 2')
exports.toString = _util.toString;
exports.default = spring;
/***/ })
/******/ ]);
!function(t){function r(e){if(n[e])return n[e].exports;var o=n[e]={i:e,l:!1,exports:{}};return t[e].call(o.exports,o,o.exports,r),o.l=!0,o.exports}var n={};return r.m=t,r.c=n,r.i=function(t){return t},r.d=function(t,n,e){r.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:e})},r.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return r.d(n,"a",n),n},r.o=function(t,r){return Object.prototype.hasOwnProperty.call(t,r)},r.p="",r(r.s=43)}([function(t,r,n){function e(t,r,n){"__proto__"==r&&o?o(t,r,{configurable:!0,enumerable:!0,value:n,writable:!0}):t[r]=n}var o=n(24);t.exports=e},function(t,r){function n(t){return t}t.exports=n},function(t,r,n){function e(t,r){if(null==t)return{};var n=o(a(t),function(t){return[t]});return r=u(r),i(t,n,function(t,n){return r(t,n[0])})}var o=n(15),u=n(1),i=n(21),a=n(25);t.exports=e},function(t,r,n){function e(t,r){return t&&o(t,r,u)}var o=n(17),u=n(39);t.exports=e},function(t,r){function n(t){return t}t.exports=n},function(t,r){function n(t,r){return function(n){return t(r(n))}}t.exports=n},function(t,r){function n(t){for(var r=-1,n=null==t?0:t.length,e=0,o=[];++r<n;){var u=t[r];u&&(o[e++]=u)}return o}t.exports=n},function(t,r){var n=Array.isArray;t.exports=n},function(t,r){function n(t){var r=typeof t;return null!=t&&("object"==r||"function"==r)}t.exports=n},function(t,r){function n(t,r){for(var n=-1,e=null==t?0:t.length,o=Array(e);++n<e;)o[n]=r(t[n],n,t);return o}t.exports=n},function(t,r,n){"use strict";function e(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(r,"__esModule",{value:!0}),r.parseStyles=r.parseValues=r.parseHexColor=r.parseNumber=r.combine=r.split=void 0;var o=n(9),u=e(o),i=n(7),a=e(i),f=n(6),c=e(f),l=Object.assign||function(t){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var e in n)Object.prototype.hasOwnProperty.call(n,e)&&(t[e]=n[e])}return t},s=function(){function t(t,r){var n=[],e=!0,o=!1,u=void 0;try{for(var i,a=t[Symbol.iterator]();!(e=(i=a.next()).done)&&(n.push(i.value),!r||n.length!==r);e=!0);}catch(t){o=!0,u=t}finally{try{!e&&a.return&&a.return()}finally{if(o)throw u}}return n}return function(r,n){if(Array.isArray(r))return r;if(Symbol.iterator in Object(r))return t(r,n);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),p=["-moz-outline-radius","-webkit-text-stroke","background","border","border-bottom","border-color","border-left","border-radius","border-right","border-spacing","border-top","border-width","margin","outline","padding"],v=r.split=function(t,r){if(p.indexOf(t)>=0){var n=r.split(" ");return 1===n.length?n[0]:n}return r},d=(r.combine=function(t,r){return(0,a.default)(r)&&p.indexOf(t)>=0?r.join(" "):r},r.parseNumber=function(t){var r=/^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/,n=(""+t).match(r)||[],e=s(n,3),o=e[1],u=e[2];return o?{unit:u,value:Number(o)}:void 0}),b=r.parseHexColor=function(t){var r=(""+t).match(/^#([0-9a-f]{3}|[0-9a-f]{6})$/i)||[],n=s(r,2),e=n[1];if(e)return e=3===e.length?(0,u.default)(e,function(t){return""+t+t}).join(""):e,(0,u.default)(e.match(/.{1,2}/g),function(t){return parseInt(t,16)})},y=r.parseValues=function(t,r){if(t===r)return{fixed:t};var n=d(t),e=d(r);if(n&&e){var o=n.unit,u=e.unit;if(o===u||!o||!u)return{unit:o||u,start:n.value,end:e.value}}var i=b(t),a=b(r);return i&&a?{rgb:[i,a]}:void 0};r.parseStyles=function(t,r){var n=[],e=function(e){if(!(e in r))return"break";var o=[].concat(v(e,t[e])),i=[].concat(v(e,r[e]));if(o.length!==i.length)return"break";var a=(0,c.default)((0,u.default)(o,function(t,r){var n=y(t,i[r]);return n?l({prop:e},n):null}));a.length===o.length&&(n=n.concat(a))};for(var o in t){var i=e(o);if("break"===i)break}return n}},function(t,r,n){"use strict";function e(t){return t&&t.__esModule?t:{default:t}}function o(t,r,n){return r in t?Object.defineProperty(t,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[r]=n,t}function u(t){if(Array.isArray(t)){for(var r=0,n=Array(t.length);r<t.length;r++)n[r]=t[r];return n}return Array.from(t)}Object.defineProperty(r,"__esModule",{value:!0}),r.rgbFloatToHex=r.toString=r.omitEmptyValues=r.appendToKeys=r.calculateObsoleteValues=r.calculateObsoleteFrames=r.addValueToProperty=r.getInterpolator=void 0;var i=n(42),a=e(i),f=n(2),c=e(f),l=n(41),s=e(l),p=n(40),v=e(p),d=n(9),b=e(d),y=n(35),g=e(y),x=n(6),h=e(x),m=function(){function t(t,r){var n=[],e=!0,o=!1,u=void 0;try{for(var i,a=t[Symbol.iterator]();!(e=(i=a.next()).done)&&(n.push(i.value),!r||n.length!==r);e=!0);}catch(t){o=!0,u=t}finally{try{!e&&a.return&&a.return()}finally{if(o)throw u}}return n}return function(r,n){if(Array.isArray(r))return r;if(Symbol.iterator in Object(r))return t(r,n);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}(),O=n(14),j=e(O),_=(r.getInterpolator=function(t,r){return function(n,e,o){var i=[n].concat(u(Array(99)),[e]);return(0,b.default)(i,function(){var u=(0,j.default)(.01,n,o||0,e,t,r),i=m(u,2);return n=i[0],o=i[1],n})}},r.addValueToProperty=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=arguments[1],n=arguments[2];return Object.assign(t,o({},r,void 0===t[r]?n:[].concat(t[r],n)))},r.calculateObsoleteFrames=function(t,r){return(0,h.default)((0,b.default)(t,function(t,n,e){var o=JSON.stringify(t[r]),u=JSON.stringify((e[n-1]||{})[r]),i=JSON.stringify((e[n+1]||{})[r]);return o===i&&o===u?n:null}))}),S=(r.calculateObsoleteValues=function(t){return(0,a.default)(Object.keys(t[0]),function(r,n){return Object.assign(r,o({},n,_(Object.values(t),n)))},{})},r.appendToKeys=function(t,r){return(0,v.default)(t,function(t,n){return""+n+r})},r.omitEmptyValues=function(t){return(0,c.default)(t,function(t){return(0,s.default)(g.default)(t)})},function(t,r){return t+":"+r+";"});r.toString=function(t){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:S;return Object.keys(t).reduce(function(n,e){var o=Object.keys(t[e]).reduce(function(n,o){return""+n+r(o,t[e][o])},"");return""+n+e+"{"+o+"}"},"")},r.rgbFloatToHex=function(t){var r=Math.min(255,Math.max(0,t));return("0"+Number(r.toFixed(0)).toString(16)).substr(-2)}},function(t,r){function n(t){return null==t}t.exports=n},function(t,r,n){function e(t,r){var n={};return r=i(r,3),u(t,function(t,e,u){o(n,e,r(t,e,u))}),n}var o=n(0),u=n(3),i=n(1);t.exports=e},function(t,r,n){"use strict";Object.defineProperty(r,"__esModule",{value:!0});var e=[0,0],o=function t(r,n,o,u,i,a){var f=arguments.length>6&&void 0!==arguments[6]?arguments[6]:.01,c=-i*(n-u),l=-a*o,s=c+l,p=o+s*r,v=n+p*r;return t.count+=1,Math.abs(p)<f&&Math.abs(v-u)<f?(e[0]=u,e[1]=0,e):(e[0]=v,e[1]=p,e)};o.count=0,r.default=o},function(t,r){function n(t,r){for(var n=-1,e=null==t?0:t.length,o=Array(e);++n<e;)o[n]=r(t[n],n,t);return o}t.exports=n},function(t,r,n){function e(t,r,n){var e=t[r];a.call(t,r)&&u(e,n)&&(void 0!==n||r in t)||o(t,r,n)}var o=n(0),u=n(31),i=Object.prototype,a=i.hasOwnProperty;t.exports=e},function(t,r,n){var e=n(23),o=e();t.exports=o},function(t,r){function n(t,r){return null==t?void 0:t[r]}t.exports=n},function(t,r){function n(t){return o.call(t)}var e=Object.prototype,o=e.toString;t.exports=n},function(t,r,n){var e=n(5),o=e(Object.keys,Object);t.exports=o},function(t,r,n){function e(t,r,n){for(var e=-1,a=r.length,f={};++e<a;){var c=r[e],l=o(t,c);n(l,c)&&u(f,i(c,t),l)}return f}var o=n(18),u=n(22),i=n(4);t.exports=e},function(t,r,n){function e(t,r,n,e){if(!a(t))return t;r=u(r,t);for(var c=-1,l=r.length,s=l-1,p=t;null!=p&&++c<l;){var v=f(r[c]),d=n;if(c!=s){var b=p[v];d=e?e(b,v,p):void 0,void 0===d&&(d=a(b)?b:i(r[c+1])?[]:{})}o(p,v,d),p=p[v]}return t}var o=n(16),u=n(4),i=n(28),a=n(8),f=n(30);t.exports=e},function(t,r){function n(t){return function(r,n,e){for(var o=-1,u=Object(r),i=e(r),a=i.length;a--;){var f=i[t?a:++o];if(n(u[f],f,u)===!1)break}return r}}t.exports=n},function(t,r,n){var e=n(26),o=function(){try{var t=e(Object,"defineProperty");return t({},"",{}),t}catch(t){}}();t.exports=o},function(t,r){function n(t){var r=[];if(null!=t)for(var n in Object(t))r.push(n);return r}t.exports=n},function(t,r){function n(t,r){return null==t?void 0:t[r]}t.exports=n},function(t,r){function n(t){return o.call(t)}var e=Object.prototype,o=e.toString;t.exports=n},function(t,r){function n(t,r){return r=null==r?e:r,!!r&&("number"==typeof t||o.test(t))&&t>-1&&t%1==0&&t<r}var e=9007199254740991,o=/^(?:0|[1-9]\d*)$/;t.exports=n},function(t,r){function n(){return!1}t.exports=n},function(t,r){function n(t){return t}t.exports=n},function(t,r){function n(t,r){return t===r||t!==t&&r!==r}t.exports=n},function(t,r){function n(){return!1}t.exports=n},function(t,r,n){function e(t){return null!=t&&u(t.length)&&!o(t)}var o=n(36),u=n(37);t.exports=e},function(t,r){function n(){return!1}t.exports=n},function(t,r,n){function e(t){if(null==t)return!0;if(f(t)&&(a(t)||"string"==typeof t||"function"==typeof t.splice||c(t)||s(t)||i(t)))return!t.length;var r=u(t);if(r==p||r==v)return!t.size;if(l(t))return!o(t).length;for(var n in t)if(b.call(t,n))return!1;return!0}var o=n(20),u=n(27),i=n(32),a=n(7),f=n(33),c=n(34),l=n(29),s=n(38),p="[object Map]",v="[object Set]",d=Object.prototype,b=d.hasOwnProperty;t.exports=e},function(t,r,n){function e(t){if(!u(t))return!1;var r=o(t);return r==a||r==f||r==i||r==c}var o=n(19),u=n(8),i="[object AsyncFunction]",a="[object Function]",f="[object GeneratorFunction]",c="[object Proxy]";t.exports=e},function(t,r){function n(t){return"number"==typeof t&&t>-1&&t%1==0&&t<=e}var e=9007199254740991;t.exports=n},function(t,r){function n(){return!1}t.exports=n},function(t,r,n){var e=n(5),o=e(Object.keys,Object);t.exports=o},function(t,r,n){function e(t,r){var n={};return r=i(r,3),u(t,function(t,e,u){o(n,r(t,e,u),t)}),n}var o=n(0),u=n(3),i=n(1);t.exports=e},function(t,r){function n(t){if("function"!=typeof t)throw new TypeError(e);return function(){var r=arguments;switch(r.length){case 0:return!t.call(this);case 1:return!t.call(this,r[0]);case 2:return!t.call(this,r[0],r[1]);case 3:return!t.call(this,r[0],r[1],r[2])}return!t.apply(this,r)}}var e="Expected a function";t.exports=n},function(t,r){function n(t,r,n,e){var o=-1,u=null==t?0:t.length;for(e&&u&&(n=t[++o]);++o<u;)n=r(n,t[o],o,t);return n}t.exports=n},function(t,r,n){"use strict";function e(t){return t&&t.__esModule?t:{default:t}}Object.defineProperty(r,"__esModule",{value:!0}),r.toString=r.spring=void 0;var o=n(2),u=e(o),i=n(13),a=e(i),f=n(12),c=e(f),l=n(10),s=n(11),p={noWobble:{stiffness:170,damping:26},gentle:{stiffness:120,damping:14},wobbly:{stiffness:180,damping:12},stiff:{stiffness:210,damping:20}},v={stiffness:180,damping:12,precision:2},d=r.spring=function(t,r){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},e={},o=Object.assign({},v,n,p[n.preset]||{}),i=o.stiffness,f=o.damping,d=o.precision,b=(0,s.getInterpolator)(i,f),y=(0,l.parseStyles)(t,r);y.forEach(function(t){var r=t.prop,n=t.unit,o=t.start,u=t.end,i=t.rgb,a=t.fixed;if((0,c.default)(o)||(0,c.default)(u))if((0,c.default)(i)){if(!(0,c.default)(a))for(var f=0;f<101;f+=1)e[f]=(0,s.addValueToProperty)(e[f],r,a)}else!function(){var t=b(i[0][0],i[1][0]),n=b(i[0][1],i[1][1]),o=b(i[0][2],i[1][2]);t.forEach(function(u,i){var a=s.rgbFloatToHex;e[i]=(0,s.addValueToProperty)(e[i],r,"#"+a(t[i])+a(n[i])+a(o[i]))})}();else b(o,u).forEach(function(t,o){var u=Number(t.toFixed("px"===n?0:d));u=0!==u&&n?""+u+n:u,e[o]=(0,s.addValueToProperty)(e[o],r,u)})});var g=(0,s.calculateObsoleteValues)(e);return e=(0,a.default)(e,function(t,r){var n=(0,a.default)(t,function(t,r){return(0,l.combine)(r,t)});return(0,u.default)(n,function(t,n){return g[n].indexOf(Number(r))<0})}),e=(0,s.omitEmptyValues)(e),e=(0,s.appendToKeys)(e,"%")};r.toString=s.toString,r.default=d}]);
var webpack = require('webpack')
var compact = require('lodash').compact
var LodashModuleReplacementPlugin = require('lodash-webpack-plugin')
var minify = process.env.MINIFY_BUILD
module.exports = {
entry: './src/index.js',
output: {
filename: `dist/css-spring${minify ? '.min' : ''}.js`,
},
module: {
rules: [
{
test: /.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: [
[ 'es2015', { modules: false }],
],
},
},
],
},
plugins: compact([
new LodashModuleReplacementPlugin(),
minify ? new webpack.optimize.UglifyJsPlugin() : null,
]),
}
+7
-2
{
"plugins": [ "transform-object-rest-spread" ],
"presets": [ "es2015" ]
"plugins": [
"lodash",
"transform-object-rest-spread"
],
"presets": [
"es2015"
]
}
{
"name": "css-spring",
"version": "3.0.0",
"version": "4.0.0",
"description": "Generate physics based css-keyframe animations",
"main": "build/index.js",
"main": "dist/css-spring.js",
"repository": {

@@ -20,12 +20,26 @@ "type": "git",

"scripts": {
"build": "babel src --out-dir build",
"test": "jest --coverage"
"build": "cross-env MINIFY_BUILD=1 webpack && cross-env webpack",
"lint": "cross-env eslint src",
"test": "cross-env jest --coverage",
"prepublish": "cross-env yarn run build"
},
"dependencies": {},
"dependencies": {
"lodash": "^4.17.4"
},
"devDependencies": {
"babel-cli": "^6.18.0",
"babel-eslint": "^7.1.1",
"babel-loader": "^6.2.10",
"babel-plugin-lodash": "^3.2.11",
"babel-plugin-transform-object-rest-spread": "^6.22.0",
"babel-preset-es2015": "^6.18.0",
"coveralls": "^2.11.15",
"jest": "^18.1.0"
"cross-env": "^3.1.4",
"eslint": "^3.14.1",
"eslint-config-xo": "^0.17.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-unicorn": "^1.0.0",
"jest": "^18.1.0",
"lodash-webpack-plugin": "^0.11.0",
"webpack": "^2.2.1"
},

@@ -32,0 +46,0 @@ "jest": {

+24
-21
# css-spring 🚀
[![NPM Version](https://img.shields.io/npm/v/css-spring.svg?style=flat&label=NPM%20Version)](http://npm.im/css-spring)
[![Build Status](https://img.shields.io/travis/codepunkt/css-spring.svg?style=flat&label=Build%20Status)](https://travis-ci.org/codepunkt/css-spring)
[![Code Coverage](https://img.shields.io/coveralls/codepunkt/css-spring.svg?style=flat&label=Code%20Coverage)](https://coveralls.io/github/codepunkt/css-spring?branch=master)
[![Build Status](https://img.shields.io/travis/codepunkt/css-spring/master.svg?style=flat&label=Build%20Status)](https://travis-ci.org/codepunkt/css-spring)
[![Code Coverage](https://img.shields.io/coveralls/codepunkt/css-spring/master.svg?style=flat&label=Code%20Coverage)](https://coveralls.io/github/codepunkt/css-spring?branch=master)
[![MIT License](https://img.shields.io/npm/l/css-spring.svg?style=flat&label=License)](http://opensource.org/licenses/MIT)
Generate physics based css-keyframe animations for the css-in-js solution of your choice or plain css.
#### Generate physics based css keyframe animation objects or strings for the css-in-js solution of your choice.
##### Works with simple numeric css properties (with units or without), combined properties such as padding and rgb hex colors. Eliminates duplicate values and unused keyframes to optimize animation size.
#### *~3kb gzipped.*
<table>

@@ -97,21 +100,18 @@ <tr>

The following properties in both the `startProp` and `endProp` objects are ignored when
calculating the animation:
- properties that do not exist in both arguments
- properties that have non-numeric values
- properties with units that differ between both arguments
#### Arguments
- `startProps` (_Object_): The start properties for the animation.<br>
```javascript
// `startProps` example
{ 'margin-left': '0px', opacity: 0 }
{ 'margin-left': '0px', opacity: 0, background: '#f00' }
```
- `endProps` (_Object_): The end properties for the animation.<br>
```javascript
// `endProps` example
{ 'margin-left': '250px', opacity: 1 }
{ 'margin-left': '250px', opacity: 1, background: '#bada55' }
```
- `options` (_Object_, optional): Animation options with these properties:

@@ -129,15 +129,17 @@ - `precision` (_Number_, optional, defaults to `3`) Specifies the number of decimals in the rounding of interpolated values.

An object with `0%` to `100%` keys and the interpolated physics-based values for each step of the animation, e.g.:
An object with keyframes between `0%` and `100%`, having the interpolated values for each step of the animation, e.g.:
```javascript
{
"0%": { "margin-left": "0px" },
"1%": { "margin-left": "3px" },
"2%": { "margin-left": "8.544px" },
// 3% … 98%
"99%": { "margin-left": "249.981px" }
"100%": { "margin-left": "250px" }
'0%': { 'margin-left': '5px', opacity: 0.02, background: '#fe0402' },
'1%': { 'margin-left': '13px', opacity: 0.05, background: '#fb0b04' },
'2%': { 'margin-left': '25px', opacity: 0.1, background: '#f81508' },
// meaningful frames between 2% and 88%
'88%': { 'margin-left': '250px' },
'100%': { 'margin-left': '250px', opacity: 1, background: '#bada55' }
}
```
Redundant values and empty keyframes are removed to optimize the size of the resulting css. There is simply no point in having a `margin-left` value of `'250px'` in every keyframe ranging from 88% to 100%.
### `toString(keyframes, formatter)`

@@ -151,2 +153,3 @@

- `formatter` (_Function_, optional): The formatter function that is invoked for every property/value combination.
```javascript

@@ -193,5 +196,5 @@ // default formatter

- allowing the interpolation of array values like margins, paddings or translates ([#1](/../../issues/1))
- color interpolation ([#3](/../../issues/3))
- adding a plugin system to use things such as autoprefixer or cssnano minification ([#8](/../../issues/8))
- a commandline to generate spring keyframe animations for usage in your css files ([#4](/../../issues/4))
Feel free to contribute with your own issues and ideas, your thoughts on the ones listed above, example documentation for usage with other css-in-js frameworks or pull requests for features/improvements you'd like to see.
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var getAnimatedProps = exports.getAnimatedProps = function getAnimatedProps(start, target) {
return Object.keys(start).reduce(function (acc, key) {
if (!isNaN(parseFloat(start[key])) && !isNaN(parseFloat(target[key]))) {
acc.push(key);
}
return acc;
}, []);
};
var initCache = exports.initCache = function initCache(start, target) {
return getAnimatedProps(start, target).reduce(function (acc, key) {
return Object.assign(acc, _defineProperty({}, key, {
cache: { value: parseFloat(start[key]), velocity: 0 },
start: parseFloat(start[key]),
target: parseFloat(target[key])
}));
}, {});
};
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var unitFormatter = function unitFormatter(unit) {
return function (key, value) {
return key + ':' + value + unit + ';';
};
};
var reduceProperties = exports.reduceProperties = function reduceProperties(props, formatter) {
return Object.keys(props).reduce(function (acc, prop) {
return '' + acc + formatter(prop, props[prop]);
}, '');
};
var format = function format(keyframes) {
var formatter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function (key, value) {
return key + ':' + value + ';';
};
return Object.keys(keyframes).reduce(function (outer, perc) {
var value = reduceProperties(keyframes[perc], formatter);
return '' + outer + perc + '{' + value + '}';
}, '');
};
['em', 'rem', 'px'].forEach(function (unit) {
format[unit.toUpperCase() + '_FORMATTER'] = unitFormatter(unit);
});
exports.default = format;
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.toString = exports.spring = undefined;
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
var _toString = require('./to-string');
Object.defineProperty(exports, 'toString', {
enumerable: true,
get: function get() {
return _interopRequireDefault(_toString).default;
}
});
var _stepper3 = require('./stepper');
var _stepper4 = _interopRequireDefault(_stepper3);
var _util = require('./util');
var _props = require('./props');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
var presets = {
noWobble: { stiffness: 170, damping: 26 },
gentle: { stiffness: 120, damping: 14 },
wobbly: { stiffness: 180, damping: 12 },
stiff: { stiffness: 210, damping: 20 }
};
// default spring options.
// damping and precision reflect the values of the `wobbly` preset,
// precision defaults to 3 which should be a good tradeoff between
// animation detail and resulting filesize.
var defaultOptions = {
stiffness: 180,
damping: 12,
precision: 3
};
var spring = exports.spring = function spring(startProps, endProps) {
var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
// define stiffness, damping and precision based on default options
// and options given in arguments.
var _Object$assign = Object.assign({}, defaultOptions, options, presets[options.preset] || {}),
stiffness = _Object$assign.stiffness,
damping = _Object$assign.damping,
precision = _Object$assign.precision;
var animatableProps = (0, _props.getAnimatableProps)(startProps, endProps);
var startValues = (0, _util.mapValues)(animatableProps, function (_ref) {
var start = _ref.start;
return start;
});
var endValues = (0, _util.mapValues)(animatableProps, function (_ref2) {
var end = _ref2.end;
return end;
});
var addUnits = function addUnits(object) {
return (0, _util.mapValues)(object, function (v, k) {
return '' + v + animatableProps[k].unit;
});
};
var keyframes = {
'0%': addUnits(startValues),
'100%': addUnits(endValues)
};
Object.keys(startValues).forEach(function (key) {
var velocity = 0;
var value = startValues[key];
var end = endValues[key];
for (var i = 1; i < 100; i += 1) {
var _stepper = (0, _stepper4.default)(0.01, value, velocity, end, stiffness, damping);
var _stepper2 = _slicedToArray(_stepper, 2);
value = _stepper2[0];
velocity = _stepper2[1];
var percent = i + '%';
keyframes[percent] = Object.assign(keyframes[percent] || {}, _defineProperty({}, key, '' + +value.toFixed(precision) + animatableProps[key].unit));
}
});
return keyframes;
};
// console.log(spring({
// left: '10px',
// right: '20em',
// foo: 'bar',
// opacity: 0,
// rotate: '5deg'
// }, {
// left: '20px',
// right: '30em',
// baz: true,
// opacity: 1,
// rotate: '10deg'
// }, {
// preset: 'noWobble'
// }))
exports.default = spring;
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
// this splits css numbers from units.
// according to the css spec, a number can either be an integer or it can be
// zero or more digits followed by a dot followed by one or more digits.
// assuming the unit can be any sequence of lowercase letters (including none)
var numberUnitSplit = /^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/;
// returns an object that lists the unit, start and end values of the
// animatable properties based on the given arguments.
// to be animatable, a property has to be present on both `startProps` and
// `endProps` with the same unit.
var getAnimatableProps = exports.getAnimatableProps = function getAnimatableProps(startProps, endProps) {
var result = {};
// @todo check if props are listed in animatable properties!
// @see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animated_properties
// @see https://github.com/gilmoreorless/css-animated-properties
for (var key in startProps) {
if (key in endProps) {
var startMatches = startProps[key].toString().match(numberUnitSplit);
var endMatches = endProps[key].toString().match(numberUnitSplit);
if (startMatches && endMatches && startMatches[2] === endMatches[2]) {
result[key] = {
unit: startMatches[2],
start: +startMatches[1],
end: +endMatches[1]
};
}
}
}
return result;
};
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
// Taken from react-motion
// @see https://github.com/chenglou/react-motion/blob/master/src/stepper.js
var reusedTuple = [0, 0];
exports.default = function (secondPerFrame, x, v, destX, k, b) {
var precision = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : 0.01;
// Spring stiffness, in kg / s^2
// for animations, destX is really spring length (spring at rest). initial
// position is considered as the stretched/compressed position of a spring
var Fspring = -k * (x - destX);
// Damping, in kg / s
var Fdamper = -b * v;
// usually we put mass here, but for animation purposes, specifying mass is a
// bit redundant. you could simply adjust k and b accordingly
// let a = (Fspring + Fdamper) / mass;
var a = Fspring + Fdamper;
var newV = v + a * secondPerFrame;
var newX = x + newV * secondPerFrame;
if (Math.abs(newV) < precision && Math.abs(newX - destX) < precision) {
reusedTuple[0] = destX;
reusedTuple[1] = 0;
return reusedTuple;
}
reusedTuple[0] = newX;
reusedTuple[1] = newV;
return reusedTuple;
};
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var defaultFormatter = function defaultFormatter(key, value) {
return key + ':' + value + ';';
};
var reduceProperties = exports.reduceProperties = function reduceProperties(props) {
var formatter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultFormatter;
return Object.keys(props).reduce(function (acc, prop) {
return '' + acc + formatter(prop, props[prop]);
}, '');
};
var toString = exports.toString = function toString(keyframes) {
var formatter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultFormatter;
return Object.keys(keyframes).reduce(function (outer, perc) {
var value = reduceProperties(keyframes[perc], formatter);
return '' + outer + perc + '{' + value + '}';
}, '');
};
exports.default = toString;
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var mapValues = exports.mapValues = function mapValues(object, iteratee) {
var result = {};
for (var key in object) {
result[key] = iteratee(object[key], key, object);
}
return result;
};

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is too big to display