JEMBOT MAWOT Bypass Shell
/*!
*
* Mollie https://www.mollie.nl
* @author Mollie B.V. <info@mollie.nl>
* @copyright Mollie B.V.
* @link https://github.com/mollie/PrestaShop
* @license https://github.com/mollie/PrestaShop/blob/master/LICENSE.md
*
*/
(window["webpackJsonP_mollie"] = window["webpackJsonP_mollie"] || []).push([["vendors~methodconfig"],{
/***/ "./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js":
/*!*********************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js ***!
\*********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _arrayLikeToArray; });
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) {
arr2[i] = arr[i];
}
return arr2;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js":
/*!*******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js ***!
\*******************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _arrayWithHoles; });
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js":
/*!**********************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js ***!
\**********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _arrayWithoutHoles; });
/* harmony import */ var _babel_runtime_helpers_esm_arrayLikeToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/arrayLikeToArray */ "./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js");
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return Object(_babel_runtime_helpers_esm_arrayLikeToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(arr);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js":
/*!**************************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js ***!
\**************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _assertThisInitialized; });
function _assertThisInitialized(self) {
if (self === void 0) {
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
}
return self;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/classCallCheck.js":
/*!*******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/classCallCheck.js ***!
\*******************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _classCallCheck; });
function _classCallCheck(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/createClass.js":
/*!****************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/createClass.js ***!
\****************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _createClass; });
function _defineProperties(target, props) {
for (var i = 0; i < props.length; i++) {
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _createClass(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js":
/*!*******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/defineProperty.js ***!
\*******************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _defineProperty; });
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;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/extends.js":
/*!************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/extends.js ***!
\************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _extends; });
function _extends() {
_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;
};
return _extends.apply(this, arguments);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/getPrototypeOf.js":
/*!*******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/getPrototypeOf.js ***!
\*******************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _getPrototypeOf; });
function _getPrototypeOf(o) {
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
return o.__proto__ || Object.getPrototypeOf(o);
};
return _getPrototypeOf(o);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/inherits.js":
/*!*************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/inherits.js ***!
\*************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _inherits; });
/* harmony import */ var _babel_runtime_helpers_esm_setPrototypeOf__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/setPrototypeOf */ "./node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js");
function _inherits(subClass, superClass) {
if (typeof superClass !== "function" && superClass !== null) {
throw new TypeError("Super expression must either be null or a function");
}
subClass.prototype = Object.create(superClass && superClass.prototype, {
constructor: {
value: subClass,
writable: true,
configurable: true
}
});
if (superClass) Object(_babel_runtime_helpers_esm_setPrototypeOf__WEBPACK_IMPORTED_MODULE_0__["default"])(subClass, superClass);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/iterableToArray.js":
/*!********************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/iterableToArray.js ***!
\********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _iterableToArray; });
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js":
/*!*************************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js ***!
\*************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _iterableToArrayLimit; });
function _iterableToArrayLimit(arr, i) {
if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return;
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"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js":
/*!********************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js ***!
\********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _nonIterableRest; });
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js":
/*!**********************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js ***!
\**********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _nonIterableSpread; });
function _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/objectSpread.js":
/*!*****************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/objectSpread.js ***!
\*****************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _objectSpread; });
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
function _objectSpread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? Object(arguments[i]) : {};
var ownKeys = Object.keys(source);
if (typeof Object.getOwnPropertySymbols === 'function') {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function (key) {
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["default"])(target, key, source[key]);
});
}
return target;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js":
/*!******************************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js ***!
\******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _possibleConstructorReturn; });
/* harmony import */ var _babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/typeof */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
/* harmony import */ var _babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/assertThisInitialized */ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js");
function _possibleConstructorReturn(self, call) {
if (call && (Object(_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(call) === "object" || typeof call === "function")) {
return call;
}
return Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_1__["default"])(self);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js":
/*!*******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js ***!
\*******************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _setPrototypeOf; });
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js":
/*!******************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/slicedToArray.js ***!
\******************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _slicedToArray; });
/* harmony import */ var _babel_runtime_helpers_esm_arrayWithHoles__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/arrayWithHoles */ "./node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js");
/* harmony import */ var _babel_runtime_helpers_esm_iterableToArrayLimit__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/iterableToArrayLimit */ "./node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js");
/* harmony import */ var _babel_runtime_helpers_esm_unsupportedIterableToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/unsupportedIterableToArray */ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js");
/* harmony import */ var _babel_runtime_helpers_esm_nonIterableRest__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/nonIterableRest */ "./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js");
function _slicedToArray(arr, i) {
return Object(_babel_runtime_helpers_esm_arrayWithHoles__WEBPACK_IMPORTED_MODULE_0__["default"])(arr) || Object(_babel_runtime_helpers_esm_iterableToArrayLimit__WEBPACK_IMPORTED_MODULE_1__["default"])(arr, i) || Object(_babel_runtime_helpers_esm_unsupportedIterableToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(arr, i) || Object(_babel_runtime_helpers_esm_nonIterableRest__WEBPACK_IMPORTED_MODULE_3__["default"])();
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteralLoose.js":
/*!*******************************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteralLoose.js ***!
\*******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _taggedTemplateLiteralLoose; });
function _taggedTemplateLiteralLoose(strings, raw) {
if (!raw) {
raw = strings.slice(0);
}
strings.raw = raw;
return strings;
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js":
/*!**********************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js ***!
\**********************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _toConsumableArray; });
/* harmony import */ var _babel_runtime_helpers_esm_arrayWithoutHoles__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/arrayWithoutHoles */ "./node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js");
/* harmony import */ var _babel_runtime_helpers_esm_iterableToArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/iterableToArray */ "./node_modules/@babel/runtime/helpers/esm/iterableToArray.js");
/* harmony import */ var _babel_runtime_helpers_esm_unsupportedIterableToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/unsupportedIterableToArray */ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js");
/* harmony import */ var _babel_runtime_helpers_esm_nonIterableSpread__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/nonIterableSpread */ "./node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js");
function _toConsumableArray(arr) {
return Object(_babel_runtime_helpers_esm_arrayWithoutHoles__WEBPACK_IMPORTED_MODULE_0__["default"])(arr) || Object(_babel_runtime_helpers_esm_iterableToArray__WEBPACK_IMPORTED_MODULE_1__["default"])(arr) || Object(_babel_runtime_helpers_esm_unsupportedIterableToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(arr) || Object(_babel_runtime_helpers_esm_nonIterableSpread__WEBPACK_IMPORTED_MODULE_3__["default"])();
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/typeof.js":
/*!***********************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/typeof.js ***!
\***********************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _typeof; });
function _typeof(obj) {
"@babel/helpers - typeof";
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
_typeof = function _typeof(obj) {
return typeof obj;
};
} else {
_typeof = function _typeof(obj) {
return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
};
}
return _typeof(obj);
}
/***/ }),
/***/ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js":
/*!*******************************************************************************!*\
!*** ./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js ***!
\*******************************************************************************/
/*! exports provided: default */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return _unsupportedIterableToArray; });
/* harmony import */ var _babel_runtime_helpers_esm_arrayLikeToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/arrayLikeToArray */ "./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js");
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return Object(_babel_runtime_helpers_esm_arrayLikeToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return Object(_babel_runtime_helpers_esm_arrayLikeToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(o, minLen);
}
/***/ }),
/***/ "./node_modules/core-js/modules/_fails-is-regexp.js":
/*!**********************************************************!*\
!*** ./node_modules/core-js/modules/_fails-is-regexp.js ***!
\**********************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
var MATCH = __webpack_require__(/*! ./_wks */ "./node_modules/core-js/modules/_wks.js")('match');
module.exports = function (KEY) {
var re = /./;
try {
'/./'[KEY](re);
} catch (e) {
try {
re[MATCH] = false;
return !'/./'[KEY](re);
} catch (f) { /* empty */ }
} return true;
};
/***/ }),
/***/ "./node_modules/core-js/modules/_is-regexp.js":
/*!****************************************************!*\
!*** ./node_modules/core-js/modules/_is-regexp.js ***!
\****************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// 7.2.8 IsRegExp(argument)
var isObject = __webpack_require__(/*! ./_is-object */ "./node_modules/core-js/modules/_is-object.js");
var cof = __webpack_require__(/*! ./_cof */ "./node_modules/core-js/modules/_cof.js");
var MATCH = __webpack_require__(/*! ./_wks */ "./node_modules/core-js/modules/_wks.js")('match');
module.exports = function (it) {
var isRegExp;
return isObject(it) && ((isRegExp = it[MATCH]) !== undefined ? !!isRegExp : cof(it) == 'RegExp');
};
/***/ }),
/***/ "./node_modules/core-js/modules/_own-keys.js":
/*!***************************************************!*\
!*** ./node_modules/core-js/modules/_own-keys.js ***!
\***************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// all object keys, includes non-enumerable and symbols
var gOPN = __webpack_require__(/*! ./_object-gopn */ "./node_modules/core-js/modules/_object-gopn.js");
var gOPS = __webpack_require__(/*! ./_object-gops */ "./node_modules/core-js/modules/_object-gops.js");
var anObject = __webpack_require__(/*! ./_an-object */ "./node_modules/core-js/modules/_an-object.js");
var Reflect = __webpack_require__(/*! ./_global */ "./node_modules/core-js/modules/_global.js").Reflect;
module.exports = Reflect && Reflect.ownKeys || function ownKeys(it) {
var keys = gOPN.f(anObject(it));
var getSymbols = gOPS.f;
return getSymbols ? keys.concat(getSymbols(it)) : keys;
};
/***/ }),
/***/ "./node_modules/core-js/modules/_string-context.js":
/*!*********************************************************!*\
!*** ./node_modules/core-js/modules/_string-context.js ***!
\*********************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// helper for String#{startsWith, endsWith, includes}
var isRegExp = __webpack_require__(/*! ./_is-regexp */ "./node_modules/core-js/modules/_is-regexp.js");
var defined = __webpack_require__(/*! ./_defined */ "./node_modules/core-js/modules/_defined.js");
module.exports = function (that, searchString, NAME) {
if (isRegExp(searchString)) throw TypeError('String#' + NAME + " doesn't accept regex!");
return String(defined(that));
};
/***/ }),
/***/ "./node_modules/core-js/modules/es6.object.keys.js":
/*!*********************************************************!*\
!*** ./node_modules/core-js/modules/es6.object.keys.js ***!
\*********************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// 19.1.2.14 Object.keys(O)
var toObject = __webpack_require__(/*! ./_to-object */ "./node_modules/core-js/modules/_to-object.js");
var $keys = __webpack_require__(/*! ./_object-keys */ "./node_modules/core-js/modules/_object-keys.js");
__webpack_require__(/*! ./_object-sap */ "./node_modules/core-js/modules/_object-sap.js")('keys', function () {
return function keys(it) {
return $keys(toObject(it));
};
});
/***/ }),
/***/ "./node_modules/core-js/modules/es6.string.includes.js":
/*!*************************************************************!*\
!*** ./node_modules/core-js/modules/es6.string.includes.js ***!
\*************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// 21.1.3.7 String.prototype.includes(searchString, position = 0)
var $export = __webpack_require__(/*! ./_export */ "./node_modules/core-js/modules/_export.js");
var context = __webpack_require__(/*! ./_string-context */ "./node_modules/core-js/modules/_string-context.js");
var INCLUDES = 'includes';
$export($export.P + $export.F * __webpack_require__(/*! ./_fails-is-regexp */ "./node_modules/core-js/modules/_fails-is-regexp.js")(INCLUDES), 'String', {
includes: function includes(searchString /* , position = 0 */) {
return !!~context(this, searchString, INCLUDES)
.indexOf(searchString, arguments.length > 1 ? arguments[1] : undefined);
}
});
/***/ }),
/***/ "./node_modules/core-js/modules/es7.array.includes.js":
/*!************************************************************!*\
!*** ./node_modules/core-js/modules/es7.array.includes.js ***!
\************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
// https://github.com/tc39/Array.prototype.includes
var $export = __webpack_require__(/*! ./_export */ "./node_modules/core-js/modules/_export.js");
var $includes = __webpack_require__(/*! ./_array-includes */ "./node_modules/core-js/modules/_array-includes.js")(true);
$export($export.P, 'Array', {
includes: function includes(el /* , fromIndex = 0 */) {
return $includes(this, el, arguments.length > 1 ? arguments[1] : undefined);
}
});
__webpack_require__(/*! ./_add-to-unscopables */ "./node_modules/core-js/modules/_add-to-unscopables.js")('includes');
/***/ }),
/***/ "./node_modules/core-js/modules/es7.object.get-own-property-descriptors.js":
/*!*********************************************************************************!*\
!*** ./node_modules/core-js/modules/es7.object.get-own-property-descriptors.js ***!
\*********************************************************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
// https://github.com/tc39/proposal-object-getownpropertydescriptors
var $export = __webpack_require__(/*! ./_export */ "./node_modules/core-js/modules/_export.js");
var ownKeys = __webpack_require__(/*! ./_own-keys */ "./node_modules/core-js/modules/_own-keys.js");
var toIObject = __webpack_require__(/*! ./_to-iobject */ "./node_modules/core-js/modules/_to-iobject.js");
var gOPD = __webpack_require__(/*! ./_object-gopd */ "./node_modules/core-js/modules/_object-gopd.js");
var createProperty = __webpack_require__(/*! ./_create-property */ "./node_modules/core-js/modules/_create-property.js");
$export($export.S, 'Object', {
getOwnPropertyDescriptors: function getOwnPropertyDescriptors(object) {
var O = toIObject(object);
var getDesc = gOPD.f;
var keys = ownKeys(O);
var result = {};
var i = 0;
var key, desc;
while (keys.length > i) {
desc = getDesc(O, key = keys[i++]);
if (desc !== undefined) createProperty(result, key, desc);
}
return result;
}
});
/***/ }),
/***/ "./node_modules/invariant/browser.js":
/*!*******************************************!*\
!*** ./node_modules/invariant/browser.js ***!
\*******************************************/
/*! no static exports found */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
/**
* Copyright (c) 2013-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
/**
* Use invariant() to assert state which your program assumes to be true.
*
* Provide sprintf-style format (only %s is supported) and arguments
* to provide information about what broke and what you were
* expecting.
*
* The invariant message will be stripped in production, but the invariant
* will remain to ensure logic does not differ in production.
*/
var invariant = function(condition, format, a, b, c, d, e, f) {
if (true) {
if (format === undefined) {
throw new Error('invariant requires an error message argument');
}
}
if (!condition) {
var error;
if (format === undefined) {
error = new Error(
'Minified exception occurred; use the non-minified dev environment ' +
'for the full error message and additional helpful warnings.'
);
} else {
var args = [a, b, c, d, e, f];
var argIndex = 0;
error = new Error(
format.replace(/%s/g, function() { return args[argIndex++]; })
);
error.name = 'Invariant Violation';
}
error.framesToPop = 1; // we don't care about invariant's own frame
throw error;
}
};
module.exports = invariant;
/***/ }),
/***/ "./node_modules/polished/dist/polished.es.js":
/*!***************************************************!*\
!*** ./node_modules/polished/dist/polished.es.js ***!
\***************************************************/
/*! exports provided: adjustHue, animation, backgroundImages, backgrounds, between, border, borderColor, borderRadius, borderStyle, borderWidth, buttons, clearFix, complement, cover, darken, desaturate, directionalProperty, ellipsis, em, fluidRange, fontFace, getLuminance, getValueAndUnit, grayscale, invert, hideText, hideVisually, hiDPI, hsl, hsla, lighten, margin, mix, modularScale, normalize, opacify, padding, parseToHsl, parseToRgb, placeholder, position, radialGradient, readableColor, rem, retinaImage, rgb, rgba, saturate, selection, setHue, setLightness, setSaturation, shade, size, stripUnit, textInputs, timingFunctions, tint, toColorString, transitions, transparentize, triangle, wordWrap */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "adjustHue", function() { return curriedAdjustHue; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "animation", function() { return animation; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "backgroundImages", function() { return backgroundImages; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "backgrounds", function() { return backgrounds; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "between", function() { return between; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "border", function() { return border; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "borderColor", function() { return borderColor; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "borderRadius", function() { return borderRadius; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "borderStyle", function() { return borderStyle; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "borderWidth", function() { return borderWidth; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "buttons", function() { return buttons; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "clearFix", function() { return clearFix; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "complement", function() { return complement; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "cover", function() { return cover; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "darken", function() { return curriedDarken; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "desaturate", function() { return curriedDesaturate; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "directionalProperty", function() { return directionalProperty; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ellipsis", function() { return ellipsis; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "em", function() { return em; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fluidRange", function() { return fluidRange; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "fontFace", function() { return fontFace; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getLuminance", function() { return getLuminance; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getValueAndUnit", function() { return getValueAndUnit; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "grayscale", function() { return grayscale; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "invert", function() { return invert; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hideText", function() { return hideText; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hideVisually", function() { return hideVisually; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hiDPI", function() { return hiDPI; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hsl", function() { return hsl; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hsla", function() { return hsla; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "lighten", function() { return curriedLighten; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "margin", function() { return margin; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "mix", function() { return curriedMix; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "modularScale", function() { return modularScale; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "normalize", function() { return normalize; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "opacify", function() { return curriedOpacify; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "padding", function() { return padding; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "parseToHsl", function() { return parseToHsl; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "parseToRgb", function() { return parseToRgb; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "placeholder", function() { return placeholder; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "position", function() { return position; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "radialGradient", function() { return radialGradient; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "readableColor", function() { return readableColor; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "rem", function() { return rem; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "retinaImage", function() { return retinaImage; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "rgb", function() { return rgb; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "rgba", function() { return rgba; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "saturate", function() { return curriedSaturate; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "selection", function() { return selection; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "setHue", function() { return curriedSetHue; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "setLightness", function() { return curriedSetLightness; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "setSaturation", function() { return curriedSetSaturation; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "shade", function() { return curriedShade; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "size", function() { return size; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "stripUnit", function() { return stripUnit; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "textInputs", function() { return textInputs; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "timingFunctions", function() { return timingFunctions; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "tint", function() { return curriedTint; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "toColorString", function() { return toColorString; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transitions", function() { return transitions; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "transparentize", function() { return curriedTransparentize; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "triangle", function() { return triangle; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "wordWrap", function() { return wordWrap; });
/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _babel_runtime_helpers_esm_taggedTemplateLiteralLoose__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/taggedTemplateLiteralLoose */ "./node_modules/@babel/runtime/helpers/esm/taggedTemplateLiteralLoose.js");
// @private
function capitalizeString(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
}
var positionMap = ['Top', 'Right', 'Bottom', 'Left'];
function generateProperty(property, position) {
if (!property) return position.toLowerCase();
var splitProperty = property.split('-');
if (splitProperty.length > 1) {
splitProperty.splice(1, 0, position);
return splitProperty.reduce(function (acc, val) {
return "" + acc + capitalizeString(val);
});
}
var joinedProperty = property.replace(/([a-z])([A-Z])/g, "$1" + position + "$2");
return property === joinedProperty ? "" + property + position : joinedProperty;
}
function generateStyles(property, valuesWithDefaults) {
var styles = {};
for (var i = 0; i < valuesWithDefaults.length; i += 1) {
if (valuesWithDefaults[i] || valuesWithDefaults[i] === 0) {
styles[generateProperty(property, positionMap[i])] = valuesWithDefaults[i];
}
}
return styles;
}
/**
* Enables shorthand for direction-based properties. It accepts a property (hyphenated or camelCased) and up to four values that map to top, right, bottom, and left, respectively. You can optionally pass an empty string to get only the directional values as properties. You can also optionally pass a null argument for a directional value to ignore it.
* @example
* // Styles as object usage
* const styles = {
* ...directionalProperty('padding', '12px', '24px', '36px', '48px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${directionalProperty('padding', '12px', '24px', '36px', '48px')}
* `
*
* // CSS as JS Output
*
* div {
* 'paddingTop': '12px',
* 'paddingRight': '24px',
* 'paddingBottom': '36px',
* 'paddingLeft': '48px'
* }
*/
function directionalProperty(property) {
for (var _len = arguments.length, values = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
values[_key - 1] = arguments[_key];
}
// prettier-ignore
var firstValue = values[0],
_values$ = values[1],
secondValue = _values$ === void 0 ? firstValue : _values$,
_values$2 = values[2],
thirdValue = _values$2 === void 0 ? firstValue : _values$2,
_values$3 = values[3],
fourthValue = _values$3 === void 0 ? secondValue : _values$3;
var valuesWithDefaults = [firstValue, secondValue, thirdValue, fourthValue];
return generateStyles(property, valuesWithDefaults);
}
function endsWith (string, suffix) {
return string.substr(-suffix.length) === suffix;
}
/**
* Returns a given CSS value minus its unit (or the original value if an invalid string is passed).
*
* @example
* // Styles as object usage
* const styles = {
* '--dimension': stripUnit('100px')
* }
*
* // styled-components usage
* const div = styled.div`
* --dimension: ${stripUnit('100px')}
* `
*
* // CSS in JS Output
*
* element {
* '--dimension': 100
* }
*/
function stripUnit(value) {
var unitlessValue = parseFloat(value);
if (isNaN(unitlessValue)) return value;
return unitlessValue;
}
/**
* Factory function that creates pixel-to-x converters
* @private
*/
var pxtoFactory = function pxtoFactory(to) {
return function (pxval, base) {
if (base === void 0) {
base = '16px';
}
var newPxval = pxval;
var newBase = base;
if (typeof pxval === 'string') {
if (!endsWith(pxval, 'px')) {
throw new Error("Expected a string ending in \"px\" or a number passed as the first argument to " + to + "(), got \"" + pxval + "\" instead.");
}
newPxval = stripUnit(pxval);
}
if (typeof base === 'string') {
if (!endsWith(base, 'px')) {
throw new Error("Expected a string ending in \"px\" or a number passed as the second argument to " + to + "(), got \"" + base + "\" instead.");
}
newBase = stripUnit(base);
}
if (typeof newPxval === 'string') {
throw new Error("Passed invalid pixel value (\"" + pxval + "\") to " + to + "(), please pass a value like \"12px\" or 12.");
}
if (typeof newBase === 'string') {
throw new Error("Passed invalid base value (\"" + base + "\") to " + to + "(), please pass a value like \"12px\" or 12.");
}
return "" + newPxval / newBase + to;
};
};
/**
* Convert pixel value to ems. The default base value is 16px, but can be changed by passing a
* second argument to the function.
* @function
* @param {string|number} pxval
* @param {string|number} [base='16px']
* @example
* // Styles as object usage
* const styles = {
* 'height': em('16px')
* }
*
* // styled-components usage
* const div = styled.div`
* height: ${em('16px')}
* `
*
* // CSS in JS Output
*
* element {
* 'height': '1em'
* }
*/
var em =
/*#__PURE__*/
pxtoFactory('em');
var cssRegex = /^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/;
/**
* Returns a given CSS value and its unit as elements of an array.
*
* @example
* // Styles as object usage
* const styles = {
* '--dimension': getValueAndUnit('100px')[0]
* '--unit': getValueAndUnit('100px')[1]
* }
*
* // styled-components usage
* const div = styled.div`
* --dimension: ${getValueAndUnit('100px')[0]}
* --unit: ${getValueAndUnit('100px')[1]}
* `
*
* // CSS in JS Output
*
* element {
* '--dimension': 100
* '--unit': 'px'
* }
*/
function getValueAndUnit(value) {
if (typeof value !== 'string') return [value, ''];
var matchedValue = value.match(cssRegex);
if (matchedValue) return [parseFloat(value), matchedValue[2]];
return [value, undefined];
}
var ratioNames = {
minorSecond: 1.067,
majorSecond: 1.125,
minorThird: 1.2,
majorThird: 1.25,
perfectFourth: 1.333,
augFourth: 1.414,
perfectFifth: 1.5,
minorSixth: 1.6,
goldenSection: 1.618,
majorSixth: 1.667,
minorSeventh: 1.778,
majorSeventh: 1.875,
octave: 2,
majorTenth: 2.5,
majorEleventh: 2.667,
majorTwelfth: 3,
doubleOctave: 4
};
function getRatio(ratioName) {
return ratioNames[ratioName];
}
/**
* Establish consistent measurements and spacial relationships throughout your projects by incrementing up or down a defined scale. We provide a list of commonly used scales as pre-defined variables.
* @example
* // Styles as object usage
* const styles = {
* // Increment two steps up the default scale
* 'fontSize': modularScale(2)
* }
*
* // styled-components usage
* const div = styled.div`
* // Increment two steps up the default scale
* fontSize: ${modularScale(2)}
* `
*
* // CSS in JS Output
*
* element {
* 'fontSize': '1.77689em'
* }
*/
function modularScale(steps, base, ratio) {
if (base === void 0) {
base = '1em';
}
if (ratio === void 0) {
ratio = 'perfectFourth';
}
if (typeof steps !== 'number') {
throw new Error('Please provide a number of steps to the modularScale helper.');
}
if (typeof ratio === 'string' && !ratioNames[ratio]) {
throw new Error('Please pass a number or one of the predefined scales to the modularScale helper as the ratio.');
}
var realBase = typeof base === 'string' ? stripUnit(base) : base;
var realRatio = typeof ratio === 'string' ? getRatio(ratio) : ratio;
if (typeof realBase === 'string') {
throw new Error("Invalid value passed as base to modularScale, expected number or em string but got \"" + base + "\"");
}
return realBase * Math.pow(realRatio, steps) + "em";
}
/**
* Convert pixel value to rems. The default base value is 16px, but can be changed by passing a
* second argument to the function.
* @function
* @param {string|number} pxval
* @param {string|number} [base='16px']
* @example
* // Styles as object usage
* const styles = {
* 'height': rem('16px')
* }
*
* // styled-components usage
* const div = styled.div`
* height: ${rem('16px')}
* `
*
* // CSS in JS Output
*
* element {
* 'height': '1rem'
* }
*/
var rem =
/*#__PURE__*/
pxtoFactory('rem');
/**
* Returns a CSS calc formula for linear interpolation of a property between two values. Accepts optional minScreen (defaults to '320px') and maxScreen (defaults to '1200px').
*
* @example
* // Styles as object usage
* const styles = {
* fontSize: between('20px', '100px', '400px', '1000px'),
* fontSize: between('20px', '100px')
* }
*
* // styled-components usage
* const div = styled.div`
* fontSize: ${between('20px', '100px', '400px', '1000px')};
* fontSize: ${between('20px', '100px')}
* `
*
* // CSS as JS Output
*
* h1: {
* 'fontSize': 'calc(-33.33333333333334px + 13.333333333333334vw)',
* 'fontSize': 'calc(-9.090909090909093px + 9.090909090909092vw)'
* }
*/
function between(fromSize, toSize, minScreen, maxScreen) {
if (minScreen === void 0) {
minScreen = '320px';
}
if (maxScreen === void 0) {
maxScreen = '1200px';
}
var _getValueAndUnit = getValueAndUnit(fromSize),
unitlessFromSize = _getValueAndUnit[0],
fromSizeUnit = _getValueAndUnit[1];
var _getValueAndUnit2 = getValueAndUnit(toSize),
unitlessToSize = _getValueAndUnit2[0],
toSizeUnit = _getValueAndUnit2[1];
var _getValueAndUnit3 = getValueAndUnit(minScreen),
unitlessMinScreen = _getValueAndUnit3[0],
minScreenUnit = _getValueAndUnit3[1];
var _getValueAndUnit4 = getValueAndUnit(maxScreen),
unitlessMaxScreen = _getValueAndUnit4[0],
maxScreenUnit = _getValueAndUnit4[1];
if (typeof unitlessMinScreen !== 'number' || typeof unitlessMaxScreen !== 'number' || !minScreenUnit || !maxScreenUnit || minScreenUnit !== maxScreenUnit) {
throw new Error('minScreen and maxScreen must be provided as stringified numbers with the same units.');
}
if (typeof unitlessFromSize !== 'number' || typeof unitlessToSize !== 'number' || !fromSizeUnit || !toSizeUnit || fromSizeUnit !== toSizeUnit) {
throw new Error('fromSize and toSize must be provided as stringified numbers with the same units.');
}
var slope = (unitlessFromSize - unitlessToSize) / (unitlessMinScreen - unitlessMaxScreen);
var base = unitlessToSize - slope * unitlessMaxScreen;
return "calc(" + base.toFixed(2) + fromSizeUnit + " + " + (100 * slope).toFixed(2) + "vw)";
}
/**
* CSS to contain a float (credit to CSSMojo).
*
* @example
* // Styles as object usage
* const styles = {
* ...clearFix(),
* }
*
* // styled-components usage
* const div = styled.div`
* ${clearFix()}
* `
*
* // CSS as JS Output
*
* '&::after': {
* 'clear': 'both',
* 'content': '""',
* 'display': 'table'
* }
*/
function clearFix(parent) {
var _ref;
if (parent === void 0) {
parent = '&';
}
var pseudoSelector = parent + "::after";
return _ref = {}, _ref[pseudoSelector] = {
clear: 'both',
content: '""',
display: 'table'
}, _ref;
}
/**
* CSS to fully cover an area. Can optionally be passed an offset to act as a "padding".
*
* @example
* // Styles as object usage
* const styles = {
* ...cover()
* }
*
* // styled-components usage
* const div = styled.div`
* ${cover()}
* `
*
* // CSS as JS Output
*
* div: {
* 'position': 'absolute',
* 'top': '0',
* 'right: '0',
* 'bottom': '0',
* 'left: '0'
* }
*/
function cover(offset) {
if (offset === void 0) {
offset = 0;
}
return {
position: 'absolute',
top: offset,
right: offset,
bottom: offset,
left: offset
};
}
/**
* CSS to represent truncated text with an ellipsis.
*
* @example
* // Styles as object usage
* const styles = {
* ...ellipsis('250px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${ellipsis('250px')}
* `
*
* // CSS as JS Output
*
* div: {
* 'display': 'inline-block',
* 'maxWidth': '250px',
* 'overflow': 'hidden',
* 'textOverflow': 'ellipsis',
* 'whiteSpace': 'nowrap',
* 'wordWrap': 'normal'
* }
*/
function ellipsis(width) {
if (width === void 0) {
width = '100%';
}
return {
display: 'inline-block',
maxWidth: width,
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
wordWrap: 'normal'
};
}
/**
* Returns a set of media queries that resizes a property (or set of properties) between a provided fromSize and toSize. Accepts optional minScreen (defaults to '320px') and maxScreen (defaults to '1200px') to constrain the interpolation.
*
* @example
* // Styles as object usage
* const styles = {
* ...fluidRange(
* {
* prop: 'padding',
* fromSize: '20px',
* toSize: '100px',
* },
* '400px',
* '1000px',
* )
* }
*
* // styled-components usage
* const div = styled.div`
* ${fluidRange(
* {
* prop: 'padding',
* fromSize: '20px',
* toSize: '100px',
* },
* '400px',
* '1000px',
* )}
* `
*
* // CSS as JS Output
*
* div: {
* "@media (min-width: 1000px)": Object {
* "padding": "100px",
* },
* "@media (min-width: 400px)": Object {
* "padding": "calc(-33.33333333333334px + 13.333333333333334vw)",
* },
* "padding": "20px",
* }
*/
function fluidRange(cssProp, minScreen, maxScreen) {
if (minScreen === void 0) {
minScreen = '320px';
}
if (maxScreen === void 0) {
maxScreen = '1200px';
}
if (!Array.isArray(cssProp) && typeof cssProp !== 'object' || cssProp === null) {
throw new Error('expects either an array of objects or a single object with the properties prop, fromSize, and toSize.');
}
if (Array.isArray(cssProp)) {
var mediaQueries = {};
var fallbacks = {};
for (var _iterator = cssProp, _isArray = Array.isArray(_iterator), _i = 0, _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();;) {
var _extends2, _extends3;
var _ref;
if (_isArray) {
if (_i >= _iterator.length) break;
_ref = _iterator[_i++];
} else {
_i = _iterator.next();
if (_i.done) break;
_ref = _i.value;
}
var obj = _ref;
if (!obj.prop || !obj.fromSize || !obj.toSize) {
throw new Error('expects the objects in the first argument array to have the properties `prop`, `fromSize`, and `toSize`.');
}
fallbacks[obj.prop] = obj.fromSize;
mediaQueries["@media (min-width: " + minScreen + ")"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, mediaQueries["@media (min-width: " + minScreen + ")"], (_extends2 = {}, _extends2[obj.prop] = between(obj.fromSize, obj.toSize, minScreen, maxScreen), _extends2));
mediaQueries["@media (min-width: " + maxScreen + ")"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, mediaQueries["@media (min-width: " + maxScreen + ")"], (_extends3 = {}, _extends3[obj.prop] = obj.toSize, _extends3));
}
return Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, fallbacks, mediaQueries);
} else {
var _ref2, _ref3, _ref4;
if (!cssProp.prop || !cssProp.fromSize || !cssProp.toSize) {
throw new Error('expects the first argument object to have the properties `prop`, `fromSize`, and `toSize`.');
}
return _ref4 = {}, _ref4[cssProp.prop] = cssProp.fromSize, _ref4["@media (min-width: " + minScreen + ")"] = (_ref2 = {}, _ref2[cssProp.prop] = between(cssProp.fromSize, cssProp.toSize, minScreen, maxScreen), _ref2), _ref4["@media (min-width: " + maxScreen + ")"] = (_ref3 = {}, _ref3[cssProp.prop] = cssProp.toSize, _ref3), _ref4;
}
}
function generateFileReferences(fontFilePath, fileFormats) {
var fileFontReferences = fileFormats.map(function (format) {
return "url(\"" + fontFilePath + "." + format + "\")";
});
return fileFontReferences.join(', ');
}
function generateLocalReferences(localFonts) {
var localFontReferences = localFonts.map(function (font) {
return "local(\"" + font + "\")";
});
return localFontReferences.join(', ');
}
function generateSources(fontFilePath, localFonts, fileFormats) {
var fontReferences = [];
if (localFonts) fontReferences.push(generateLocalReferences(localFonts));
if (fontFilePath) {
fontReferences.push(generateFileReferences(fontFilePath, fileFormats));
}
return fontReferences.join(', ');
}
/**
* CSS for a @font-face declaration.
*
* @example
* // Styles as object basic usage
* const styles = {
* ...fontFace({
* 'fontFamily': 'Sans-Pro',
* 'fontFilePath': 'path/to/file'
* })
* }
*
* // styled-components basic usage
* const GlobalStyle = createGlobalStyle`${
* fontFace({
* 'fontFamily': 'Sans-Pro',
* 'fontFilePath': 'path/to/file'
* }
* )}`
*
* // CSS as JS Output
*
* '@font-face': {
* 'fontFamily': 'Sans-Pro',
* 'src': 'url("path/to/file.eot"), url("path/to/file.woff2"), url("path/to/file.woff"), url("path/to/file.ttf"), url("path/to/file.svg")',
* }
*/
function fontFace(_ref) {
var fontFamily = _ref.fontFamily,
fontFilePath = _ref.fontFilePath,
fontStretch = _ref.fontStretch,
fontStyle = _ref.fontStyle,
fontVariant = _ref.fontVariant,
fontWeight = _ref.fontWeight,
_ref$fileFormats = _ref.fileFormats,
fileFormats = _ref$fileFormats === void 0 ? ['eot', 'woff2', 'woff', 'ttf', 'svg'] : _ref$fileFormats,
localFonts = _ref.localFonts,
unicodeRange = _ref.unicodeRange,
fontDisplay = _ref.fontDisplay,
fontVariationSettings = _ref.fontVariationSettings,
fontFeatureSettings = _ref.fontFeatureSettings;
// Error Handling
if (!fontFamily) throw new Error('fontFace expects a name of a font-family.');
if (!fontFilePath && !localFonts) {
throw new Error('fontFace expects either the path to the font file(s) or a name of a local copy.');
}
if (localFonts && !Array.isArray(localFonts)) {
throw new Error('fontFace expects localFonts to be an array.');
}
if (!Array.isArray(fileFormats)) {
throw new Error('fontFace expects fileFormats to be an array.');
}
var fontFaceDeclaration = {
'@font-face': {
fontFamily: fontFamily,
src: generateSources(fontFilePath, localFonts, fileFormats),
unicodeRange: unicodeRange,
fontStretch: fontStretch,
fontStyle: fontStyle,
fontVariant: fontVariant,
fontWeight: fontWeight,
fontDisplay: fontDisplay,
fontVariationSettings: fontVariationSettings,
fontFeatureSettings: fontFeatureSettings
} // Removes undefined fields for cleaner css object.
};
return JSON.parse(JSON.stringify(fontFaceDeclaration));
}
/**
* CSS to hide text to show a background image in a SEO-friendly way.
*
* @example
* // Styles as object usage
* const styles = {
* 'backgroundImage': 'url(logo.png)',
* ...hideText(),
* }
*
* // styled-components usage
* const div = styled.div`
* backgroundImage: url(logo.png);
* ${hideText()};
* `
*
* // CSS as JS Output
*
* 'div': {
* 'backgroundImage': 'url(logo.png)',
* 'textIndent': '101%',
* 'overflow': 'hidden',
* 'whiteSpace': 'nowrap',
* }
*/
function hideText() {
return {
textIndent: '101%',
overflow: 'hidden',
whiteSpace: 'nowrap'
};
}
/**
* CSS to hide content visually but remain accessible to screen readers.
* from [HTML5 Boilerplate](https://github.com/h5bp/html5-boilerplate/blob/9a176f57af1cfe8ec70300da4621fb9b07e5fa31/src/css/main.css#L121)
*
* @example
* // Styles as object usage
* const styles = {
* ...hideVisually(),
* }
*
* // styled-components usage
* const div = styled.div`
* ${hideVisually()};
* `
*
* // CSS as JS Output
*
* 'div': {
* 'border': '0',
* 'clip': 'rect(0 0 0 0)',
* 'clipPath': 'inset(50%)',
* 'height': '1px',
* 'margin': '-1px',
* 'overflow': 'hidden',
* 'padding': '0',
* 'position': 'absolute',
* 'whiteSpace': 'nowrap',
* 'width': '1px',
* }
*/
function hideVisually() {
return {
border: '0',
clip: 'rect(0 0 0 0)',
clipPath: 'inset(50%)',
height: '1px',
margin: '-1px',
overflow: 'hidden',
padding: '0',
position: 'absolute',
whiteSpace: 'nowrap',
width: '1px'
};
}
/**
* Generates a media query to target HiDPI devices.
*
* @example
* // Styles as object usage
* const styles = {
* [hiDPI(1.5)]: {
* width: 200px;
* }
* }
*
* // styled-components usage
* const div = styled.div`
* ${hiDPI(1.5)} {
* width: 200px;
* }
* `
*
* // CSS as JS Output
*
* '@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
* only screen and (min--moz-device-pixel-ratio: 1.5),
* only screen and (-o-min-device-pixel-ratio: 1.5/1),
* only screen and (min-resolution: 144dpi),
* only screen and (min-resolution: 1.5dppx)': {
* 'width': '200px',
* }
*/
function hiDPI(ratio) {
if (ratio === void 0) {
ratio = 1.3;
}
return "\n @media only screen and (-webkit-min-device-pixel-ratio: " + ratio + "),\n only screen and (min--moz-device-pixel-ratio: " + ratio + "),\n only screen and (-o-min-device-pixel-ratio: " + ratio + "/1),\n only screen and (min-resolution: " + Math.round(ratio * 96) + "dpi),\n only screen and (min-resolution: " + ratio + "dppx)\n ";
}
/**
* CSS to normalize abnormalities across browsers (normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css)
*
* @example
* // Styles as object usage
* const styles = {
* ...normalize(),
* }
*
* // styled-components usage
* const GlobalStyle = createGlobalStyle`${normalize()}`
*
* // CSS as JS Output
*
* html {
* lineHeight: 1.15,
* textSizeAdjust: 100%,
* } ...
*/
function normalize() {
var _ref;
return [(_ref = {
html: {
lineHeight: '1.15',
textSizeAdjust: '100%'
},
body: {
margin: '0'
},
h1: {
fontSize: '2em',
margin: '0.67em 0'
},
hr: {
boxSizing: 'content-box',
height: '0',
overflow: 'visible'
},
pre: {
fontFamily: 'monospace, monospace',
fontSize: '1em'
},
a: {
backgroundColor: 'transparent'
},
'abbr[title]': {
borderBottom: 'none',
textDecoration: 'underline'
}
}, _ref["b,\n strong"] = {
fontWeight: 'bolder'
}, _ref["code,\n kbd,\n samp"] = {
fontFamily: 'monospace, monospace',
fontSize: '1em'
}, _ref.small = {
fontSize: '80%'
}, _ref["sub,\n sup"] = {
fontSize: '75%',
lineHeight: '0',
position: 'relative',
verticalAlign: 'baseline'
}, _ref.sub = {
bottom: '-0.25em'
}, _ref.sup = {
top: '-0.5em'
}, _ref.img = {
borderStyle: 'none'
}, _ref["button,\n input,\n optgroup,\n select,\n textarea"] = {
fontFamily: 'inherit',
fontSize: '100%',
lineHeight: '1.15',
margin: '0'
}, _ref["button,\n input"] = {
overflow: 'visible'
}, _ref["button,\n select"] = {
textTransform: 'none'
}, _ref["button,\n html [type=\"button\"],\n [type=\"reset\"],\n [type=\"submit\"]"] = {
WebkitAppearance: 'button'
}, _ref["button::-moz-focus-inner,\n [type=\"button\"]::-moz-focus-inner,\n [type=\"reset\"]::-moz-focus-inner,\n [type=\"submit\"]::-moz-focus-inner"] = {
borderStyle: 'none',
padding: '0'
}, _ref["button:-moz-focusring,\n [type=\"button\"]:-moz-focusring,\n [type=\"reset\"]:-moz-focusring,\n [type=\"submit\"]:-moz-focusring"] = {
outline: '1px dotted ButtonText'
}, _ref.fieldset = {
padding: '0.35em 0.625em 0.75em'
}, _ref.legend = {
boxSizing: 'border-box',
color: 'inherit',
display: 'table',
maxWidth: '100%',
padding: '0',
whiteSpace: 'normal'
}, _ref.progress = {
verticalAlign: 'baseline'
}, _ref.textarea = {
overflow: 'auto'
}, _ref["[type=\"checkbox\"],\n [type=\"radio\"]"] = {
boxSizing: 'border-box',
padding: '0'
}, _ref["[type=\"number\"]::-webkit-inner-spin-button,\n [type=\"number\"]::-webkit-outer-spin-button"] = {
height: 'auto'
}, _ref['[type="search"]'] = {
WebkitAppearance: 'textfield',
outlineOffset: '-2px'
}, _ref['[type="search"]::-webkit-search-decoration'] = {
WebkitAppearance: 'none'
}, _ref['::-webkit-file-upload-button'] = {
WebkitAppearance: 'button',
font: 'inherit'
}, _ref.details = {
display: 'block'
}, _ref.summary = {
display: 'list-item'
}, _ref.template = {
display: 'none'
}, _ref['[hidden]'] = {
display: 'none'
}, _ref), {
'abbr[title]': {
textDecoration: 'underline dotted'
}
}];
}
/**
* CSS to style the placeholder pseudo-element.
*
* @deprecated - placeholder has been marked for deprecation in polished 2.0 and will be fully deprecated in 3.0. It is no longer needed and can safely be replaced with the non-prefixed placeholder pseudo-element.
*
* @example
* // Styles as object usage
* const styles = {
* ...placeholder({'color': 'blue'})
* }
*
* // styled-components usage
* const div = styled.input`
* ${placeholder({'color': 'blue'})}
* `
*
* // CSS as JS Output
*
* 'input': {
* '&:-moz-placeholder': {
* 'color': 'blue',
* },
* '&:-ms-input-placeholder': {
* 'color': 'blue',
* },
* '&::-moz-placeholder': {
* 'color': 'blue',
* },
* '&::-webkit-input-placeholder': {
* 'color': 'blue',
* },
* },
*/
function placeholder(styles, parent) {
var _ref;
if (parent === void 0) {
parent = '&';
}
return _ref = {}, _ref[parent + "::-webkit-input-placeholder"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, styles), _ref[parent + ":-moz-placeholder"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, styles), _ref[parent + "::-moz-placeholder"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, styles), _ref[parent + ":-ms-input-placeholder"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, styles), _ref;
}
function _templateObject() {
var data = Object(_babel_runtime_helpers_esm_taggedTemplateLiteralLoose__WEBPACK_IMPORTED_MODULE_1__["default"])(["radial-gradient(", "", "", "", ")"]);
_templateObject = function _templateObject() {
return data;
};
return data;
}
function parseFallback(colorStops) {
return colorStops[0].split(' ')[0];
}
function constructGradientValue(literals) {
var template = '';
for (var i = 0; i < literals.length; i += 1) {
template += literals[i]; // Adds leading coma if properties preceed color-stops
if (i === 3 && (i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]) && ((arguments.length <= 1 ? undefined : arguments[1]) || (arguments.length <= 2 ? undefined : arguments[2]) || (arguments.length <= 3 ? undefined : arguments[3]))) {
template = template.slice(0, -1);
template += ", " + (i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]); // No trailing space if color-stops is the only param provided
} else if (i === 3 && (i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]) && !(arguments.length <= 1 ? undefined : arguments[1]) && !(arguments.length <= 2 ? undefined : arguments[2]) && !(arguments.length <= 3 ? undefined : arguments[3])) {
template += "" + (i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]); // Only adds substitution if it is defined
} else if (i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]) {
template += (i + 1 < 1 || arguments.length <= i + 1 ? undefined : arguments[i + 1]) + " ";
}
}
return template.trim();
}
/**
* CSS for declaring a radial gradient, including a fallback background-color. The fallback is either the first color-stop or an explicitly passed fallback color.
*
* @example
* // Styles as object usage
* const styles = {
* ...radialGradient({
* colorStops: ['#00FFFF 0%', 'rgba(0, 0, 255, 0) 50%', '#0000FF 95%'],
* extent: 'farthest-corner at 45px 45px',
* position: 'center',
* shape: 'ellipse',
* })
* }
*
* // styled-components usage
* const div = styled.div`
* ${radialGradient({
* colorStops: ['#00FFFF 0%', 'rgba(0, 0, 255, 0) 50%', '#0000FF 95%'],
* extent: 'farthest-corner at 45px 45px',
* position: 'center',
* shape: 'ellipse',
* })}
*`
*
* // CSS as JS Output
*
* div: {
* 'backgroundColor': '#00FFFF',
* 'backgroundImage': 'radial-gradient(center ellipse farthest-corner at 45px 45px, #00FFFF 0%, rgba(0, 0, 255, 0) 50%, #0000FF 95%)',
* }
*/
function radialGradient(_ref) {
var colorStops = _ref.colorStops,
extent = _ref.extent,
fallback = _ref.fallback,
position = _ref.position,
shape = _ref.shape;
if (!colorStops || colorStops.length < 2) {
throw new Error('radialGradient requries at least 2 color-stops to properly render.');
}
return {
backgroundColor: fallback || parseFallback(colorStops),
backgroundImage: constructGradientValue(_templateObject(), position, shape, extent, colorStops.join(', '))
};
}
/**
* A helper to generate a retina background image and non-retina
* background image. The retina background image will output to a HiDPI media query. The mixin uses
* a _2x.png filename suffix by default.
*
* @example
* // Styles as object usage
* const styles = {
* ...retinaImage('my-img')
* }
*
* // styled-components usage
* const div = styled.div`
* ${retinaImage('my-img')}
* `
*
* // CSS as JS Output
* div {
* backgroundImage: 'url(my-img.png)',
* '@media only screen and (-webkit-min-device-pixel-ratio: 1.3),
* only screen and (min--moz-device-pixel-ratio: 1.3),
* only screen and (-o-min-device-pixel-ratio: 1.3/1),
* only screen and (min-resolution: 144dpi),
* only screen and (min-resolution: 1.5dppx)': {
* backgroundImage: 'url(my-img_2x.png)',
* }
* }
*/
function retinaImage(filename, backgroundSize, extension, retinaFilename, retinaSuffix) {
var _ref;
if (extension === void 0) {
extension = 'png';
}
if (retinaSuffix === void 0) {
retinaSuffix = '_2x';
}
if (!filename) {
throw new Error('Please supply a filename to retinaImage() as the first argument.');
} // Replace the dot at the beginning of the passed extension if one exists
var ext = extension.replace(/^\./, '');
var rFilename = retinaFilename ? retinaFilename + "." + ext : "" + filename + retinaSuffix + "." + ext;
return _ref = {
backgroundImage: "url(" + filename + "." + ext + ")"
}, _ref[hiDPI()] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
backgroundImage: "url(" + rFilename + ")"
}, backgroundSize ? {
backgroundSize: backgroundSize
} : {}), _ref;
}
/**
* CSS to style the selection pseudo-element.
*
* @deprecated - selection has been marked for deprecation in polished 2.0 and will be fully deprecated in 3.0. It is no longer needed and can safely be replaced with the non-prefixed selection pseudo-element.
*
* @example
* // Styles as object usage
* const styles = {
* ...selection({
* 'backgroundColor': 'blue'
* }, 'section')
* }
*
* // styled-components usage
* const div = styled.div`
* ${selection({'backgroundColor': 'blue'}, 'section')}
* `
*
* // CSS as JS Output
*
* 'div': {
* 'section::-moz-selection': {
* 'backgroundColor':'blue',
* },
* 'section::selection': {
* 'backgroundColor': 'blue',
* }
* }
*/
function selection(styles, parent) {
var _ref;
if (parent === void 0) {
parent = '';
}
return _ref = {}, _ref[parent + "::-moz-selection"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, styles), _ref[parent + "::selection"] = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, styles), _ref;
}
/* eslint-disable key-spacing */
var functionsMap = {
easeInBack: 'cubic-bezier(0.600, -0.280, 0.735, 0.045)',
easeInCirc: 'cubic-bezier(0.600, 0.040, 0.980, 0.335)',
easeInCubic: 'cubic-bezier(0.550, 0.055, 0.675, 0.190)',
easeInExpo: 'cubic-bezier(0.950, 0.050, 0.795, 0.035)',
easeInQuad: 'cubic-bezier(0.550, 0.085, 0.680, 0.530)',
easeInQuart: 'cubic-bezier(0.895, 0.030, 0.685, 0.220)',
easeInQuint: 'cubic-bezier(0.755, 0.050, 0.855, 0.060)',
easeInSine: 'cubic-bezier(0.470, 0.000, 0.745, 0.715)',
easeOutBack: 'cubic-bezier(0.175, 0.885, 0.320, 1.275)',
easeOutCubic: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)',
easeOutCirc: 'cubic-bezier(0.075, 0.820, 0.165, 1.000)',
easeOutExpo: 'cubic-bezier(0.190, 1.000, 0.220, 1.000)',
easeOutQuad: 'cubic-bezier(0.250, 0.460, 0.450, 0.940)',
easeOutQuart: 'cubic-bezier(0.165, 0.840, 0.440, 1.000)',
easeOutQuint: 'cubic-bezier(0.230, 1.000, 0.320, 1.000)',
easeOutSine: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',
easeInOutBack: 'cubic-bezier(0.680, -0.550, 0.265, 1.550)',
easeInOutCirc: 'cubic-bezier(0.785, 0.135, 0.150, 0.860)',
easeInOutCubic: 'cubic-bezier(0.645, 0.045, 0.355, 1.000)',
easeInOutExpo: 'cubic-bezier(1.000, 0.000, 0.000, 1.000)',
easeInOutQuad: 'cubic-bezier(0.455, 0.030, 0.515, 0.955)',
easeInOutQuart: 'cubic-bezier(0.770, 0.000, 0.175, 1.000)',
easeInOutQuint: 'cubic-bezier(0.860, 0.000, 0.070, 1.000)',
easeInOutSine: 'cubic-bezier(0.445, 0.050, 0.550, 0.950)'
/* eslint-enable key-spacing */
};
function getTimingFunction(functionName) {
return functionsMap[functionName];
}
/**
* String to represent common easing functions as demonstrated here: (github.com/jaukia/easie).
*
* @example
* // Styles as object usage
* const styles = {
* 'transitionTimingFunction': timingFunctions('easeInQuad')
* }
*
* // styled-components usage
* const div = styled.div`
* transitionTimingFunction: ${timingFunctions('easeInQuad')};
* `
*
* // CSS as JS Output
*
* 'div': {
* 'transitionTimingFunction': 'cubic-bezier(0.550, 0.085, 0.680, 0.530)',
* }
*/
function timingFunctions(timingFunction) {
return getTimingFunction(timingFunction);
}
/**
* Shorthand that accepts up to four values, including null to skip a value, and maps them to their respective directions.
* @example
* // Styles as object usage
* const styles = {
* ...borderColor('red', 'green', 'blue', 'yellow')
* }
*
* // styled-components usage
* const div = styled.div`
* ${borderColor('red', 'green', 'blue', 'yellow')}
* `
*
* // CSS as JS Output
*
* div {
* 'borderTopColor': 'red',
* 'borderRightColor': 'green',
* 'borderBottomColor': 'blue',
* 'borderLeftColor': 'yellow'
* }
*/
function borderColor() {
for (var _len = arguments.length, values = new Array(_len), _key = 0; _key < _len; _key++) {
values[_key] = arguments[_key];
}
return directionalProperty.apply(void 0, ['borderColor'].concat(values));
}
var getBorderWidth = function getBorderWidth(pointingDirection, height, width) {
switch (pointingDirection) {
case 'top':
return "0 " + width[0] / 2 + width[1] + " " + height[0] + height[1] + " " + width[0] / 2 + width[1];
case 'left':
return "" + height[0] / 2 + height[1] + " " + width[0] + width[1] + " " + height[0] / 2 + height[1] + " 0";
case 'bottom':
return "" + height[0] + height[1] + " " + width[0] / 2 + width[1] + " 0 " + width[0] / 2 + width[1];
case 'right':
return "" + height[0] / 2 + height[1] + " 0 " + height[0] / 2 + height[1] + " " + width[0] + width[1];
default:
throw new Error("Passed invalid argument to triangle, please pass correct pointingDirection e.g. 'right'.");
}
}; // needed for border-color
var reverseDirection = ['bottom', 'left', 'top', 'right'];
var NUMBER_AND_FLOAT = /(\d*\.?\d*)/;
/**
* CSS to represent triangle with any pointing direction with an optional background color. Accepts number or px values for height and width.
*
* @example
* // Styles as object usage
*
* const styles = {
* ...triangle({ pointingDirection: 'right', width: '100px', height: '100px', foregroundColor: 'red' })
* }
*
*
* // styled-components usage
* const div = styled.div`
* ${triangle({ pointingDirection: 'right', width: '100px', height: '100px', foregroundColor: 'red' })}
*
*
* // CSS as JS Output
*
* div: {
* 'borderColor': 'transparent',
* 'borderLeftColor': 'red !important',
* 'borderStyle': 'solid',
* 'borderWidth': '50px 0 50px 100px',
* 'height': '0',
* 'width': '0',
* }
*/
function triangle(_ref) {
var pointingDirection = _ref.pointingDirection,
height = _ref.height,
width = _ref.width,
foregroundColor = _ref.foregroundColor,
_ref$backgroundColor = _ref.backgroundColor,
backgroundColor = _ref$backgroundColor === void 0 ? 'transparent' : _ref$backgroundColor;
var widthAndUnit = [parseFloat(width), String(width).replace(NUMBER_AND_FLOAT, '') || 'px'];
var heightAndUnit = [parseFloat(height), String(height).replace(NUMBER_AND_FLOAT, '') || 'px'];
if (isNaN(heightAndUnit[0]) || isNaN(widthAndUnit[0])) {
throw new Error('Passed an invalid value to `height` or `width`. Please provide a pixel based unit');
}
var reverseDirectionIndex = reverseDirection.indexOf(pointingDirection);
return Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
width: '0',
height: '0',
borderWidth: getBorderWidth(pointingDirection, heightAndUnit, widthAndUnit),
borderStyle: 'solid'
}, borderColor.apply(void 0, Array.from({
length: 4
}).map(function (_, index) {
return index === reverseDirectionIndex ? foregroundColor : backgroundColor;
})));
}
/**
* Provides an easy way to change the `wordWrap` property.
*
* @example
* // Styles as object usage
* const styles = {
* ...wordWrap('break-word')
* }
*
* // styled-components usage
* const div = styled.div`
* ${wordWrap('break-word')}
* `
*
* // CSS as JS Output
*
* const styles = {
* overflowWrap: 'break-word',
* wordWrap: 'break-word',
* wordBreak: 'break-all',
* }
*/
function wordWrap(wrap) {
if (wrap === void 0) {
wrap = 'break-word';
}
var wordBreak = wrap === 'break-word' ? 'break-all' : wrap;
return {
overflowWrap: wrap,
wordWrap: wrap,
wordBreak: wordBreak
};
}
function colorToInt(color) {
return Math.round(color * 255);
}
function convertToInt(red, green, blue) {
return colorToInt(red) + "," + colorToInt(green) + "," + colorToInt(blue);
}
function hslToRgb(hue, saturation, lightness, convert) {
if (convert === void 0) {
convert = convertToInt;
}
if (saturation === 0) {
// achromatic
return convert(lightness, lightness, lightness);
} // formular from https://en.wikipedia.org/wiki/HSL_and_HSV
var huePrime = hue % 360 / 60;
var chroma = (1 - Math.abs(2 * lightness - 1)) * saturation;
var secondComponent = chroma * (1 - Math.abs(huePrime % 2 - 1));
var red = 0;
var green = 0;
var blue = 0;
if (huePrime >= 0 && huePrime < 1) {
red = chroma;
green = secondComponent;
} else if (huePrime >= 1 && huePrime < 2) {
red = secondComponent;
green = chroma;
} else if (huePrime >= 2 && huePrime < 3) {
green = chroma;
blue = secondComponent;
} else if (huePrime >= 3 && huePrime < 4) {
green = secondComponent;
blue = chroma;
} else if (huePrime >= 4 && huePrime < 5) {
red = secondComponent;
blue = chroma;
} else if (huePrime >= 5 && huePrime < 6) {
red = chroma;
blue = secondComponent;
}
var lightnessModification = lightness - chroma / 2;
var finalRed = red + lightnessModification;
var finalGreen = green + lightnessModification;
var finalBlue = blue + lightnessModification;
return convert(finalRed, finalGreen, finalBlue);
}
var namedColorMap = {
aliceblue: 'f0f8ff',
antiquewhite: 'faebd7',
aqua: '00ffff',
aquamarine: '7fffd4',
azure: 'f0ffff',
beige: 'f5f5dc',
bisque: 'ffe4c4',
black: '000',
blanchedalmond: 'ffebcd',
blue: '0000ff',
blueviolet: '8a2be2',
brown: 'a52a2a',
burlywood: 'deb887',
cadetblue: '5f9ea0',
chartreuse: '7fff00',
chocolate: 'd2691e',
coral: 'ff7f50',
cornflowerblue: '6495ed',
cornsilk: 'fff8dc',
crimson: 'dc143c',
cyan: '00ffff',
darkblue: '00008b',
darkcyan: '008b8b',
darkgoldenrod: 'b8860b',
darkgray: 'a9a9a9',
darkgreen: '006400',
darkgrey: 'a9a9a9',
darkkhaki: 'bdb76b',
darkmagenta: '8b008b',
darkolivegreen: '556b2f',
darkorange: 'ff8c00',
darkorchid: '9932cc',
darkred: '8b0000',
darksalmon: 'e9967a',
darkseagreen: '8fbc8f',
darkslateblue: '483d8b',
darkslategray: '2f4f4f',
darkslategrey: '2f4f4f',
darkturquoise: '00ced1',
darkviolet: '9400d3',
deeppink: 'ff1493',
deepskyblue: '00bfff',
dimgray: '696969',
dimgrey: '696969',
dodgerblue: '1e90ff',
firebrick: 'b22222',
floralwhite: 'fffaf0',
forestgreen: '228b22',
fuchsia: 'ff00ff',
gainsboro: 'dcdcdc',
ghostwhite: 'f8f8ff',
gold: 'ffd700',
goldenrod: 'daa520',
gray: '808080',
green: '008000',
greenyellow: 'adff2f',
grey: '808080',
honeydew: 'f0fff0',
hotpink: 'ff69b4',
indianred: 'cd5c5c',
indigo: '4b0082',
ivory: 'fffff0',
khaki: 'f0e68c',
lavender: 'e6e6fa',
lavenderblush: 'fff0f5',
lawngreen: '7cfc00',
lemonchiffon: 'fffacd',
lightblue: 'add8e6',
lightcoral: 'f08080',
lightcyan: 'e0ffff',
lightgoldenrodyellow: 'fafad2',
lightgray: 'd3d3d3',
lightgreen: '90ee90',
lightgrey: 'd3d3d3',
lightpink: 'ffb6c1',
lightsalmon: 'ffa07a',
lightseagreen: '20b2aa',
lightskyblue: '87cefa',
lightslategray: '789',
lightslategrey: '789',
lightsteelblue: 'b0c4de',
lightyellow: 'ffffe0',
lime: '0f0',
limegreen: '32cd32',
linen: 'faf0e6',
magenta: 'f0f',
maroon: '800000',
mediumaquamarine: '66cdaa',
mediumblue: '0000cd',
mediumorchid: 'ba55d3',
mediumpurple: '9370db',
mediumseagreen: '3cb371',
mediumslateblue: '7b68ee',
mediumspringgreen: '00fa9a',
mediumturquoise: '48d1cc',
mediumvioletred: 'c71585',
midnightblue: '191970',
mintcream: 'f5fffa',
mistyrose: 'ffe4e1',
moccasin: 'ffe4b5',
navajowhite: 'ffdead',
navy: '000080',
oldlace: 'fdf5e6',
olive: '808000',
olivedrab: '6b8e23',
orange: 'ffa500',
orangered: 'ff4500',
orchid: 'da70d6',
palegoldenrod: 'eee8aa',
palegreen: '98fb98',
paleturquoise: 'afeeee',
palevioletred: 'db7093',
papayawhip: 'ffefd5',
peachpuff: 'ffdab9',
peru: 'cd853f',
pink: 'ffc0cb',
plum: 'dda0dd',
powderblue: 'b0e0e6',
purple: '800080',
rebeccapurple: '639',
red: 'f00',
rosybrown: 'bc8f8f',
royalblue: '4169e1',
saddlebrown: '8b4513',
salmon: 'fa8072',
sandybrown: 'f4a460',
seagreen: '2e8b57',
seashell: 'fff5ee',
sienna: 'a0522d',
silver: 'c0c0c0',
skyblue: '87ceeb',
slateblue: '6a5acd',
slategray: '708090',
slategrey: '708090',
snow: 'fffafa',
springgreen: '00ff7f',
steelblue: '4682b4',
tan: 'd2b48c',
teal: '008080',
thistle: 'd8bfd8',
tomato: 'ff6347',
turquoise: '40e0d0',
violet: 'ee82ee',
wheat: 'f5deb3',
white: 'fff',
whitesmoke: 'f5f5f5',
yellow: 'ff0',
yellowgreen: '9acd32'
/**
* Checks if a string is a CSS named color and returns its equivalent hex value, otherwise returns the original color.
* @private
*/
};
function nameToHex(color) {
if (typeof color !== 'string') return color;
var normalizedColorName = color.toLowerCase();
return namedColorMap[normalizedColorName] ? "#" + namedColorMap[normalizedColorName] : color;
}
var hexRegex = /^#[a-fA-F0-9]{6}$/;
var hexRgbaRegex = /^#[a-fA-F0-9]{8}$/;
var reducedHexRegex = /^#[a-fA-F0-9]{3}$/;
var reducedRgbaHexRegex = /^#[a-fA-F0-9]{4}$/;
var rgbRegex = /^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/;
var rgbaRegex = /^rgba\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/;
var hslRegex = /^hsl\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3})%\s*,\s*(\d{1,3})%\s*\)$/;
var hslaRegex = /^hsla\(\s*(\d{0,3}[.]?[0-9]+)\s*,\s*(\d{1,3})%\s*,\s*(\d{1,3})%\s*,\s*([-+]?[0-9]*[.]?[0-9]+)\s*\)$/;
/**
* Returns an RgbColor or RgbaColor object. This utility function is only useful
* if want to extract a color component. With the color util `toColorString` you
* can convert a RgbColor or RgbaColor object back to a string.
*
* @example
* // Assigns `{ red: 255, green: 0, blue: 0 }` to color1
* const color1 = parseToRgb('rgb(255, 0, 0)');
* // Assigns `{ red: 92, green: 102, blue: 112, alpha: 0.75 }` to color2
* const color2 = parseToRgb('hsla(210, 10%, 40%, 0.75)');
*/
function parseToRgb(color) {
if (typeof color !== 'string') {
throw new Error('Passed an incorrect argument to a color function, please pass a string representation of a color.');
}
var normalizedColor = nameToHex(color);
if (normalizedColor.match(hexRegex)) {
return {
red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16)
};
}
if (normalizedColor.match(hexRgbaRegex)) {
var alpha = parseFloat((parseInt("" + normalizedColor[7] + normalizedColor[8], 16) / 255).toFixed(2));
return {
red: parseInt("" + normalizedColor[1] + normalizedColor[2], 16),
green: parseInt("" + normalizedColor[3] + normalizedColor[4], 16),
blue: parseInt("" + normalizedColor[5] + normalizedColor[6], 16),
alpha: alpha
};
}
if (normalizedColor.match(reducedHexRegex)) {
return {
red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16)
};
}
if (normalizedColor.match(reducedRgbaHexRegex)) {
var _alpha = parseFloat((parseInt("" + normalizedColor[4] + normalizedColor[4], 16) / 255).toFixed(2));
return {
red: parseInt("" + normalizedColor[1] + normalizedColor[1], 16),
green: parseInt("" + normalizedColor[2] + normalizedColor[2], 16),
blue: parseInt("" + normalizedColor[3] + normalizedColor[3], 16),
alpha: _alpha
};
}
var rgbMatched = rgbRegex.exec(normalizedColor);
if (rgbMatched) {
return {
red: parseInt("" + rgbMatched[1], 10),
green: parseInt("" + rgbMatched[2], 10),
blue: parseInt("" + rgbMatched[3], 10)
};
}
var rgbaMatched = rgbaRegex.exec(normalizedColor);
if (rgbaMatched) {
return {
red: parseInt("" + rgbaMatched[1], 10),
green: parseInt("" + rgbaMatched[2], 10),
blue: parseInt("" + rgbaMatched[3], 10),
alpha: parseFloat("" + rgbaMatched[4])
};
}
var hslMatched = hslRegex.exec(normalizedColor);
if (hslMatched) {
var hue = parseInt("" + hslMatched[1], 10);
var saturation = parseInt("" + hslMatched[2], 10) / 100;
var lightness = parseInt("" + hslMatched[3], 10) / 100;
var rgbColorString = "rgb(" + hslToRgb(hue, saturation, lightness) + ")";
var hslRgbMatched = rgbRegex.exec(rgbColorString);
if (!hslRgbMatched) {
throw new Error("Couldn't generate valid rgb string from " + normalizedColor + ", it returned " + rgbColorString + ".");
}
return {
red: parseInt("" + hslRgbMatched[1], 10),
green: parseInt("" + hslRgbMatched[2], 10),
blue: parseInt("" + hslRgbMatched[3], 10)
};
}
var hslaMatched = hslaRegex.exec(normalizedColor);
if (hslaMatched) {
var _hue = parseInt("" + hslaMatched[1], 10);
var _saturation = parseInt("" + hslaMatched[2], 10) / 100;
var _lightness = parseInt("" + hslaMatched[3], 10) / 100;
var _rgbColorString = "rgb(" + hslToRgb(_hue, _saturation, _lightness) + ")";
var _hslRgbMatched = rgbRegex.exec(_rgbColorString);
if (!_hslRgbMatched) {
throw new Error("Couldn't generate valid rgb string from " + normalizedColor + ", it returned " + _rgbColorString + ".");
}
return {
red: parseInt("" + _hslRgbMatched[1], 10),
green: parseInt("" + _hslRgbMatched[2], 10),
blue: parseInt("" + _hslRgbMatched[3], 10),
alpha: parseFloat("" + hslaMatched[4])
};
}
throw new Error("Couldn't parse the color string. Please provide the color as a string in hex, rgb, rgba, hsl or hsla notation.");
}
function rgbToHsl(color) {
// make sure rgb are contained in a set of [0, 255]
var red = color.red / 255;
var green = color.green / 255;
var blue = color.blue / 255;
var max = Math.max(red, green, blue);
var min = Math.min(red, green, blue);
var lightness = (max + min) / 2;
if (max === min) {
// achromatic
if (color.alpha !== undefined) {
return {
hue: 0,
saturation: 0,
lightness: lightness,
alpha: color.alpha
};
} else {
return {
hue: 0,
saturation: 0,
lightness: lightness
};
}
}
var hue;
var delta = max - min;
var saturation = lightness > 0.5 ? delta / (2 - max - min) : delta / (max + min);
switch (max) {
case red:
hue = (green - blue) / delta + (green < blue ? 6 : 0);
break;
case green:
hue = (blue - red) / delta + 2;
break;
default:
// blue case
hue = (red - green) / delta + 4;
break;
}
hue *= 60;
if (color.alpha !== undefined) {
return {
hue: hue,
saturation: saturation,
lightness: lightness,
alpha: color.alpha
};
}
return {
hue: hue,
saturation: saturation,
lightness: lightness
};
}
/**
* Returns an HslColor or HslaColor object. This utility function is only useful
* if want to extract a color component. With the color util `toColorString` you
* can convert a HslColor or HslaColor object back to a string.
*
* @example
* // Assigns `{ hue: 0, saturation: 1, lightness: 0.5 }` to color1
* const color1 = parseToHsl('rgb(255, 0, 0)');
* // Assigns `{ hue: 128, saturation: 1, lightness: 0.5, alpha: 0.75 }` to color2
* const color2 = parseToHsl('hsla(128, 100%, 50%, 0.75)');
*/
function parseToHsl(color) {
// Note: At a later stage we can optimize this function as right now a hsl
// color would be parsed converted to rgb values and converted back to hsl.
return rgbToHsl(parseToRgb(color));
}
/**
* Reduces hex values if possible e.g. #ff8866 to #f86
* @private
*/
var reduceHexValue = function reduceHexValue(value) {
if (value.length === 7 && value[1] === value[2] && value[3] === value[4] && value[5] === value[6]) {
return "#" + value[1] + value[3] + value[5];
}
return value;
};
function numberToHex(value) {
var hex = value.toString(16);
return hex.length === 1 ? "0" + hex : hex;
}
function colorToHex(color) {
return numberToHex(Math.round(color * 255));
}
function convertToHex(red, green, blue) {
return reduceHexValue("#" + colorToHex(red) + colorToHex(green) + colorToHex(blue));
}
function hslToHex(hue, saturation, lightness) {
return hslToRgb(hue, saturation, lightness, convertToHex);
}
/**
* Returns a string value for the color. The returned result is the smallest possible hex notation.
*
* @example
* // Styles as object usage
* const styles = {
* background: hsl(359, 0.75, 0.4),
* background: hsl({ hue: 360, saturation: 0.75, lightness: 0.4 }),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${hsl(359, 0.75, 0.4)};
* background: ${hsl({ hue: 360, saturation: 0.75, lightness: 0.4 })};
* `
*
* // CSS in JS Output
*
* element {
* background: "#b3191c";
* background: "#b3191c";
* }
*/
function hsl(value, saturation, lightness) {
if (typeof value === 'number' && typeof saturation === 'number' && typeof lightness === 'number') {
return hslToHex(value, saturation, lightness);
} else if (typeof value === 'object' && saturation === undefined && lightness === undefined) {
return hslToHex(value.hue, value.saturation, value.lightness);
}
throw new Error('Passed invalid arguments to hsl, please pass multiple numbers e.g. hsl(360, 0.75, 0.4) or an object e.g. rgb({ hue: 255, saturation: 0.4, lightness: 0.75 }).');
}
/**
* Returns a string value for the color. The returned result is the smallest possible rgba or hex notation.
*
* @example
* // Styles as object usage
* const styles = {
* background: hsla(359, 0.75, 0.4, 0.7),
* background: hsla({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0,7 }),
* background: hsla(359, 0.75, 0.4, 1),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${hsla(359, 0.75, 0.4, 0.7)};
* background: ${hsla({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0,7 })};
* background: ${hsla(359, 0.75, 0.4, 1)};
* `
*
* // CSS in JS Output
*
* element {
* background: "rgba(179,25,28,0.7)";
* background: "rgba(179,25,28,0.7)";
* background: "#b3191c";
* }
*/
function hsla(value, saturation, lightness, alpha) {
if (typeof value === 'number' && typeof saturation === 'number' && typeof lightness === 'number' && typeof alpha === 'number') {
return alpha >= 1 ? hslToHex(value, saturation, lightness) : "rgba(" + hslToRgb(value, saturation, lightness) + "," + alpha + ")";
} else if (typeof value === 'object' && saturation === undefined && lightness === undefined && alpha === undefined) {
return value.alpha >= 1 ? hslToHex(value.hue, value.saturation, value.lightness) : "rgba(" + hslToRgb(value.hue, value.saturation, value.lightness) + "," + value.alpha + ")";
}
throw new Error('Passed invalid arguments to hsla, please pass multiple numbers e.g. hsl(360, 0.75, 0.4, 0.7) or an object e.g. rgb({ hue: 255, saturation: 0.4, lightness: 0.75, alpha: 0.7 }).');
}
/**
* Returns a string value for the color. The returned result is the smallest possible hex notation.
*
* @example
* // Styles as object usage
* const styles = {
* background: rgb(255, 205, 100),
* background: rgb({ red: 255, green: 205, blue: 100 }),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${rgb(255, 205, 100)};
* background: ${rgb({ red: 255, green: 205, blue: 100 })};
* `
*
* // CSS in JS Output
*
* element {
* background: "#ffcd64";
* background: "#ffcd64";
* }
*/
function rgb(value, green, blue) {
if (typeof value === 'number' && typeof green === 'number' && typeof blue === 'number') {
return reduceHexValue("#" + numberToHex(value) + numberToHex(green) + numberToHex(blue));
} else if (typeof value === 'object' && green === undefined && blue === undefined) {
return reduceHexValue("#" + numberToHex(value.red) + numberToHex(value.green) + numberToHex(value.blue));
}
throw new Error('Passed invalid arguments to rgb, please pass multiple numbers e.g. rgb(255, 205, 100) or an object e.g. rgb({ red: 255, green: 205, blue: 100 }).');
}
/**
* Returns a string value for the color. The returned result is the smallest possible rgba or hex notation.
*
* Can also be used to fade a color by passing a hex value or named CSS color along with an alpha value.
*
* @example
* // Styles as object usage
* const styles = {
* background: rgba(255, 205, 100, 0.7),
* background: rgba({ red: 255, green: 205, blue: 100, alpha: 0.7 }),
* background: rgba(255, 205, 100, 1),
* background: rgba('#ffffff', 0.4),
* background: rgba('black', 0.7),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${rgba(255, 205, 100, 0.7)};
* background: ${rgba({ red: 255, green: 205, blue: 100, alpha: 0.7 })};
* background: ${rgba(255, 205, 100, 1)};
* background: ${rgba('#ffffff', 0.4)};
* background: ${rgba('black', 0.7)};
* `
*
* // CSS in JS Output
*
* element {
* background: "rgba(255,205,100,0.7)";
* background: "rgba(255,205,100,0.7)";
* background: "#ffcd64";
* background: "rgba(255,255,255,0.4)";
* background: "rgba(0,0,0,0.7)";
* }
*/
function rgba(firstValue, secondValue, thirdValue, fourthValue) {
if (typeof firstValue === 'string' && typeof secondValue === 'number') {
var rgbValue = parseToRgb(firstValue);
return "rgba(" + rgbValue.red + "," + rgbValue.green + "," + rgbValue.blue + "," + secondValue + ")";
} else if (typeof firstValue === 'number' && typeof secondValue === 'number' && typeof thirdValue === 'number' && typeof fourthValue === 'number') {
return fourthValue >= 1 ? rgb(firstValue, secondValue, thirdValue) : "rgba(" + firstValue + "," + secondValue + "," + thirdValue + "," + fourthValue + ")";
} else if (typeof firstValue === 'object' && secondValue === undefined && thirdValue === undefined && fourthValue === undefined) {
return firstValue.alpha >= 1 ? rgb(firstValue.red, firstValue.green, firstValue.blue) : "rgba(" + firstValue.red + "," + firstValue.green + "," + firstValue.blue + "," + firstValue.alpha + ")";
}
throw new Error('Passed invalid arguments to rgba, please pass multiple numbers e.g. rgb(255, 205, 100, 0.75) or an object e.g. rgb({ red: 255, green: 205, blue: 100, alpha: 0.75 }).');
}
var isRgb = function isRgb(color) {
return typeof color.red === 'number' && typeof color.green === 'number' && typeof color.blue === 'number' && (typeof color.alpha !== 'number' || typeof color.alpha === 'undefined');
};
var isRgba = function isRgba(color) {
return typeof color.red === 'number' && typeof color.green === 'number' && typeof color.blue === 'number' && typeof color.alpha === 'number';
};
var isHsl = function isHsl(color) {
return typeof color.hue === 'number' && typeof color.saturation === 'number' && typeof color.lightness === 'number' && (typeof color.alpha !== 'number' || typeof color.alpha === 'undefined');
};
var isHsla = function isHsla(color) {
return typeof color.hue === 'number' && typeof color.saturation === 'number' && typeof color.lightness === 'number' && typeof color.alpha === 'number';
};
var errMsg = 'Passed invalid argument to toColorString, please pass a RgbColor, RgbaColor, HslColor or HslaColor object.';
/**
* Converts a RgbColor, RgbaColor, HslColor or HslaColor object to a color string.
* This util is useful in case you only know on runtime which color object is
* used. Otherwise we recommend to rely on `rgb`, `rgba`, `hsl` or `hsla`.
*
* @example
* // Styles as object usage
* const styles = {
* background: toColorString({ red: 255, green: 205, blue: 100 }),
* background: toColorString({ red: 255, green: 205, blue: 100, alpha: 0.72 }),
* background: toColorString({ hue: 240, saturation: 1, lightness: 0.5 }),
* background: toColorString({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0.72 }),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${toColorString({ red: 255, green: 205, blue: 100 })};
* background: ${toColorString({ red: 255, green: 205, blue: 100, alpha: 0.72 })};
* background: ${toColorString({ hue: 240, saturation: 1, lightness: 0.5 })};
* background: ${toColorString({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0.72 })};
* `
*
* // CSS in JS Output
* element {
* background: "#ffcd64";
* background: "rgba(255,205,100,0.72)";
* background: "#00f";
* background: "rgba(179,25,25,0.72)";
* }
*/
function toColorString(color) {
if (typeof color !== 'object') throw new Error(errMsg);
if (isRgba(color)) return rgba(color);
if (isRgb(color)) return rgb(color);
if (isHsla(color)) return hsla(color);
if (isHsl(color)) return hsl(color);
throw new Error(errMsg);
}
// Type definitions taken from https://github.com/gcanti/flow-static-land/blob/master/src/Fun.js
// eslint-disable-next-line no-unused-vars
// eslint-disable-next-line no-unused-vars
// eslint-disable-next-line no-redeclare
function curried(f, length, acc) {
return function fn() {
// eslint-disable-next-line prefer-rest-params
var combined = acc.concat(Array.prototype.slice.call(arguments));
return combined.length >= length ? f.apply(this, combined) : curried(f, length, combined);
};
} // eslint-disable-next-line no-redeclare
function curry(f) {
// eslint-disable-line no-redeclare
return curried(f, f.length, []);
}
/**
* Changes the hue of the color. Hue is a number between 0 to 360. The first
* argument for adjustHue is the amount of degrees the color is rotated along
* the color wheel.
*
* @example
* // Styles as object usage
* const styles = {
* background: adjustHue(180, '#448'),
* background: adjustHue('180', 'rgba(101,100,205,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${adjustHue(180, '#448')};
* background: ${adjustHue('180', 'rgba(101,100,205,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#888844";
* background: "rgba(136,136,68,0.7)";
* }
*/
function adjustHue(degree, color) {
var hslColor = parseToHsl(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, hslColor, {
hue: (hslColor.hue + parseFloat(degree)) % 360
}));
} // prettier-ignore
var curriedAdjustHue =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(adjustHue);
/**
* Returns the complement of the provided color. This is identical to adjustHue(180, <color>).
*
* @example
* // Styles as object usage
* const styles = {
* background: complement('#448'),
* background: complement('rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${complement('#448')};
* background: ${complement('rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#884";
* background: "rgba(153,153,153,0.7)";
* }
*/
function complement(color) {
var hslColor = parseToHsl(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, hslColor, {
hue: (hslColor.hue + 180) % 360
}));
}
function guard(lowerBoundary, upperBoundary, value) {
return Math.max(lowerBoundary, Math.min(upperBoundary, value));
}
/**
* Returns a string value for the darkened color.
*
* @example
* // Styles as object usage
* const styles = {
* background: darken(0.2, '#FFCD64'),
* background: darken('0.2', 'rgba(255,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${darken(0.2, '#FFCD64')};
* background: ${darken('0.2', 'rgba(255,205,100,0.7)')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#ffbd31";
* background: "rgba(255,189,49,0.7)";
* }
*/
function darken(amount, color) {
var hslColor = parseToHsl(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, hslColor, {
lightness: guard(0, 1, hslColor.lightness - parseFloat(amount))
}));
} // prettier-ignore
var curriedDarken =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(darken);
/**
* Decreases the intensity of a color. Its range is between 0 to 1. The first
* argument of the desaturate function is the amount by how much the color
* intensity should be decreased.
*
* @example
* // Styles as object usage
* const styles = {
* background: desaturate(0.2, '#CCCD64'),
* background: desaturate('0.2', 'rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${desaturate(0.2, '#CCCD64')};
* background: ${desaturate('0.2', 'rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#b8b979";
* background: "rgba(184,185,121,0.7)";
* }
*/
function desaturate(amount, color) {
var hslColor = parseToHsl(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, hslColor, {
saturation: guard(0, 1, hslColor.saturation - parseFloat(amount))
}));
} // prettier-ignore
var curriedDesaturate =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(desaturate);
/**
* Returns a number (float) representing the luminance of a color.
*
* @example
* // Styles as object usage
* const styles = {
* background: getLuminance('#CCCD64') >= getLuminance('#0000ff') ? '#CCCD64' : '#0000ff',
* background: getLuminance('rgba(58, 133, 255, 1)') >= getLuminance('rgba(255, 57, 149, 1)') ?
* 'rgba(58, 133, 255, 1)' :
* 'rgba(255, 57, 149, 1)',
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${getLuminance('#CCCD64') >= getLuminance('#0000ff') ? '#CCCD64' : '#0000ff'};
* background: ${getLuminance('rgba(58, 133, 255, 1)') >= getLuminance('rgba(255, 57, 149, 1)') ?
* 'rgba(58, 133, 255, 1)' :
* 'rgba(255, 57, 149, 1)'};
*
* // CSS in JS Output
*
* div {
* background: "#CCCD64";
* background: "rgba(58, 133, 255, 1)";
* }
*/
function getLuminance(color) {
var rgbColor = parseToRgb(color);
var _Object$keys$map = Object.keys(rgbColor).map(function (key) {
var channel = rgbColor[key] / 255;
return channel <= 0.03928 ? channel / 12.92 : Math.pow((channel + 0.055) / 1.055, 2.4);
}),
r = _Object$keys$map[0],
g = _Object$keys$map[1],
b = _Object$keys$map[2];
return parseFloat((0.2126 * r + 0.7152 * g + 0.0722 * b).toFixed(3));
}
/**
* Converts the color to a grayscale, by reducing its saturation to 0.
*
* @example
* // Styles as object usage
* const styles = {
* background: grayscale('#CCCD64'),
* background: grayscale('rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${grayscale('#CCCD64')};
* background: ${grayscale('rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#999";
* background: "rgba(153,153,153,0.7)";
* }
*/
function grayscale(color) {
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parseToHsl(color), {
saturation: 0
}));
}
/**
* Inverts the red, green and blue values of a color.
*
* @example
* // Styles as object usage
* const styles = {
* background: invert('#CCCD64'),
* background: invert('rgba(101,100,205,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${invert('#CCCD64')};
* background: ${invert('rgba(101,100,205,0.7)')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#33329b";
* background: "rgba(154,155,50,0.7)";
* }
*/
function invert(color) {
// parse color string to rgb
var value = parseToRgb(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, value, {
red: 255 - value.red,
green: 255 - value.green,
blue: 255 - value.blue
}));
}
/**
* Returns a string value for the lightened color.
*
* @example
* // Styles as object usage
* const styles = {
* background: lighten(0.2, '#CCCD64'),
* background: lighten('0.2', 'rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${lighten(0.2, '#FFCD64')};
* background: ${lighten('0.2', 'rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#e5e6b1";
* background: "rgba(229,230,177,0.7)";
* }
*/
function lighten(amount, color) {
var hslColor = parseToHsl(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, hslColor, {
lightness: guard(0, 1, hslColor.lightness + parseFloat(amount))
}));
} // prettier-ignore
var curriedLighten =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(lighten);
/**
* Mixes the two provided colors together by calculating the average of each of the RGB components weighted to the first color by the provided weight.
*
* @example
* // Styles as object usage
* const styles = {
* background: mix(0.5, '#f00', '#00f')
* background: mix(0.25, '#f00', '#00f')
* background: mix('0.5', 'rgba(255, 0, 0, 0.5)', '#00f')
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${mix(0.5, '#f00', '#00f')};
* background: ${mix(0.25, '#f00', '#00f')};
* background: ${mix('0.5', 'rgba(255, 0, 0, 0.5)', '#00f')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#7f007f";
* background: "#3f00bf";
* background: "rgba(63, 0, 191, 0.75)";
* }
*/
function mix(weight, color, otherColor) {
var parsedColor1 = parseToRgb(color);
var color1 = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parsedColor1, {
alpha: typeof parsedColor1.alpha === 'number' ? parsedColor1.alpha : 1
});
var parsedColor2 = parseToRgb(otherColor);
var color2 = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parsedColor2, {
alpha: typeof parsedColor2.alpha === 'number' ? parsedColor2.alpha : 1 // The formular is copied from the original Sass implementation:
// http://sass-lang.com/documentation/Sass/Script/Functions.html#mix-instance_method
});
var alphaDelta = color1.alpha - color2.alpha;
var x = parseFloat(weight) * 2 - 1;
var y = x * alphaDelta === -1 ? x : x + alphaDelta;
var z = 1 + x * alphaDelta;
var weight1 = (y / z + 1) / 2.0;
var weight2 = 1 - weight1;
var mixedColor = {
red: Math.floor(color1.red * weight1 + color2.red * weight2),
green: Math.floor(color1.green * weight1 + color2.green * weight2),
blue: Math.floor(color1.blue * weight1 + color2.blue * weight2),
alpha: color1.alpha + (color2.alpha - color1.alpha) * (parseFloat(weight) / 1.0)
};
return rgba(mixedColor);
} // prettier-ignore
var curriedMix =
/*#__PURE__*/
curry
/* ::<number | string, string, string, string> */
(mix);
/**
* Increases the opacity of a color. Its range for the amount is between 0 to 1.
*
*
* @example
* // Styles as object usage
* const styles = {
* background: opacify(0.1, 'rgba(255, 255, 255, 0.9)');
* background: opacify(0.2, 'hsla(0, 0%, 100%, 0.5)'),
* background: opacify('0.5', 'rgba(255, 0, 0, 0.2)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${opacify(0.1, 'rgba(255, 255, 255, 0.9)')};
* background: ${opacify(0.2, 'hsla(0, 0%, 100%, 0.5)')},
* background: ${opacify('0.5', 'rgba(255, 0, 0, 0.2)')},
* `
*
* // CSS in JS Output
*
* element {
* background: "#fff";
* background: "rgba(255,255,255,0.7)";
* background: "rgba(255,0,0,0.7)";
* }
*/
function opacify(amount, color) {
var parsedColor = parseToRgb(color);
var alpha = typeof parsedColor.alpha === 'number' ? parsedColor.alpha : 1;
var colorWithAlpha = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parsedColor, {
alpha: guard(0, 1, (alpha * 100 + parseFloat(amount) * 100) / 100)
});
return rgba(colorWithAlpha);
} // prettier-ignore
var curriedOpacify =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(opacify);
/**
* Returns black or white for best contrast depending on the luminosity of the given color.
* Follows W3C specs for readability at https://www.w3.org/TR/WCAG20-TECHS/G18.html
*
* @example
* // Styles as object usage
* const styles = {
* color: readableColor('#000'),
* color: readableColor('papayawhip'),
* color: readableColor('rgb(255,0,0)'),
* }
*
* // styled-components usage
* const div = styled.div`
* color: ${readableColor('#000')};
* color: ${readableColor('papayawhip')};
* color: ${readableColor('rgb(255,0,0)')};
* `
*
* // CSS in JS Output
*
* element {
* color: "#fff";
* color: "#fff";
* color: "#000";
* }
*/
function readableColor(color) {
return getLuminance(color) > 0.179 ? '#000' : '#fff';
}
/**
* Increases the intensity of a color. Its range is between 0 to 1. The first
* argument of the saturate function is the amount by how much the color
* intensity should be increased.
*
* @example
* // Styles as object usage
* const styles = {
* background: saturate(0.2, '#CCCD64'),
* background: saturate('0.2', 'rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${saturate(0.2, '#FFCD64')};
* background: ${saturate('0.2', 'rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#e0e250";
* background: "rgba(224,226,80,0.7)";
* }
*/
function saturate(amount, color) {
var hslColor = parseToHsl(color);
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, hslColor, {
saturation: guard(0, 1, hslColor.saturation + parseFloat(amount))
}));
} // prettier-ignore
var curriedSaturate =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(saturate);
/**
* Sets the hue of a color to the provided value. The hue range can be
* from 0 and 359.
*
* @example
* // Styles as object usage
* const styles = {
* background: setHue(42, '#CCCD64'),
* background: setHue('244', 'rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${setHue(42, '#CCCD64')};
* background: ${setHue('244', 'rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#cdae64";
* background: "rgba(107,100,205,0.7)";
* }
*/
function setHue(hue, color) {
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parseToHsl(color), {
hue: parseFloat(hue)
}));
} // prettier-ignore
var curriedSetHue =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(setHue);
/**
* Sets the lightness of a color to the provided value. The lightness range can be
* from 0 and 1.
*
* @example
* // Styles as object usage
* const styles = {
* background: setLightness(0.2, '#CCCD64'),
* background: setLightness('0.75', 'rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${setLightness(0.2, '#CCCD64')};
* background: ${setLightness('0.75', 'rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#4d4d19";
* background: "rgba(223,224,159,0.7)";
* }
*/
function setLightness(lightness, color) {
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parseToHsl(color), {
lightness: parseFloat(lightness)
}));
} // prettier-ignore
var curriedSetLightness =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(setLightness);
/**
* Sets the saturation of a color to the provided value. The lightness range can be
* from 0 and 1.
*
* @example
* // Styles as object usage
* const styles = {
* background: setSaturation(0.2, '#CCCD64'),
* background: setSaturation('0.75', 'rgba(204,205,100,0.7)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${setSaturation(0.2, '#CCCD64')};
* background: ${setSaturation('0.75', 'rgba(204,205,100,0.7)')};
* `
*
* // CSS in JS Output
* element {
* background: "#adad84";
* background: "rgba(228,229,76,0.7)";
* }
*/
function setSaturation(saturation, color) {
return toColorString(Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parseToHsl(color), {
saturation: parseFloat(saturation)
}));
} // prettier-ignore
var curriedSetSaturation =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(setSaturation);
/**
* Shades a color by mixing it with black. `shade` can produce
* hue shifts, where as `darken` manipulates the luminance channel and therefore
* doesn't produce hue shifts.
*
* @example
* // Styles as object usage
* const styles = {
* background: shade(0.25, '#00f')
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${shade(0.25, '#00f')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#00003f";
* }
*/
function shade(percentage, color) {
return curriedMix(parseFloat(percentage), 'rgb(0, 0, 0)', color);
} // prettier-ignore
var curriedShade =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(shade);
/**
* Tints a color by mixing it with white. `tint` can produce
* hue shifts, where as `lighten` manipulates the luminance channel and therefore
* doesn't produce hue shifts.
*
* @example
* // Styles as object usage
* const styles = {
* background: tint(0.25, '#00f')
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${tint(0.25, '#00f')};
* `
*
* // CSS in JS Output
*
* element {
* background: "#bfbfff";
* }
*/
function tint(percentage, color) {
return curriedMix(parseFloat(percentage), 'rgb(255, 255, 255)', color);
} // prettier-ignore
var curriedTint =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(tint);
/**
* Decreases the opacity of a color. Its range for the amount is between 0 to 1.
*
*
* @example
* // Styles as object usage
* const styles = {
* background: transparentize(0.1, '#fff');
* background: transparentize(0.2, 'hsl(0, 0%, 100%)'),
* background: transparentize('0.5', 'rgba(255, 0, 0, 0.8)'),
* }
*
* // styled-components usage
* const div = styled.div`
* background: ${transparentize(0.1, '#fff')};
* background: ${transparentize(0.2, 'hsl(0, 0%, 100%)')},
* background: ${transparentize('0.5', 'rgba(255, 0, 0, 0.8)')},
* `
*
* // CSS in JS Output
*
* element {
* background: "rgba(255,255,255,0.9)";
* background: "rgba(255,255,255,0.8)";
* background: "rgba(255,0,0,0.3)";
* }
*/
function transparentize(amount, color) {
var parsedColor = parseToRgb(color);
var alpha = typeof parsedColor.alpha === 'number' ? parsedColor.alpha : 1;
var colorWithAlpha = Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parsedColor, {
alpha: guard(0, 1, (alpha * 100 - parseFloat(amount) * 100) / 100)
});
return rgba(colorWithAlpha);
} // prettier-ignore
var curriedTransparentize =
/*#__PURE__*/
curry
/* ::<number | string, string, string> */
(transparentize);
/**
* Shorthand for easily setting the animation property. Allows either multiple arrays with animations
* or a single animation spread over the arguments.
* @example
* // Styles as object usage
* const styles = {
* ...animation(['rotate', '1s', 'ease-in-out'], ['colorchange', '2s'])
* }
*
* // styled-components usage
* const div = styled.div`
* ${animation(['rotate', '1s', 'ease-in-out'], ['colorchange', '2s'])}
* `
*
* // CSS as JS Output
*
* div {
* 'animation': 'rotate 1s ease-in-out, colorchange 2s'
* }
* @example
* // Styles as object usage
* const styles = {
* ...animation('rotate', '1s', 'ease-in-out')
* }
*
* // styled-components usage
* const div = styled.div`
* ${animation('rotate', '1s', 'ease-in-out')}
* `
*
* // CSS as JS Output
*
* div {
* 'animation': 'rotate 1s ease-in-out'
* }
*/
function animation() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
// Allow single or multiple animations passed
var multiMode = Array.isArray(args[0]);
if (!multiMode && args.length > 8) {
throw new Error('The animation shorthand only takes 8 arguments. See the specification for more information: http://mdn.io/animation');
}
var code = args.map(function (arg) {
if (multiMode && !Array.isArray(arg) || !multiMode && Array.isArray(arg)) {
throw new Error("To pass multiple animations please supply them in arrays, e.g. animation(['rotate', '2s'], ['move', '1s'])\nTo pass a single animation please supply them in simple values, e.g. animation('rotate', '2s')");
}
if (Array.isArray(arg) && arg.length > 8) {
throw new Error('The animation shorthand arrays can only have 8 elements. See the specification for more information: http://mdn.io/animation');
}
return Array.isArray(arg) ? arg.join(' ') : arg;
}).join(', ');
return {
animation: code
};
}
/**
* Shorthand that accepts any number of backgroundImage values as parameters for creating a single background statement.
* @example
* // Styles as object usage
* const styles = {
* ...backgroundImages('url("/image/background.jpg")', 'linear-gradient(red, green)')
* }
*
* // styled-components usage
* const div = styled.div`
* ${backgroundImages('url("/image/background.jpg")', 'linear-gradient(red, green)')}
* `
*
* // CSS as JS Output
*
* div {
* 'backgroundImage': 'url("/image/background.jpg"), linear-gradient(red, green)'
* }
*/
function backgroundImages() {
for (var _len = arguments.length, properties = new Array(_len), _key = 0; _key < _len; _key++) {
properties[_key] = arguments[_key];
}
return {
backgroundImage: properties.join(', ')
};
}
/**
* Shorthand that accepts any number of background values as parameters for creating a single background statement.
* @example
* // Styles as object usage
* const styles = {
* ...backgrounds('url("/image/background.jpg")', 'linear-gradient(red, green)', 'center no-repeat')
* }
*
* // styled-components usage
* const div = styled.div`
* ${backgrounds('url("/image/background.jpg")', 'linear-gradient(red, green)', 'center no-repeat')}
* `
*
* // CSS as JS Output
*
* div {
* 'background': 'url("/image/background.jpg"), linear-gradient(red, green), center no-repeat'
* }
*/
function backgrounds() {
for (var _len = arguments.length, properties = new Array(_len), _key = 0; _key < _len; _key++) {
properties[_key] = arguments[_key];
}
return {
background: properties.join(', ')
};
}
var sideMap = ['top', 'right', 'bottom', 'left'];
/**
* Shorthand for the border property that splits out individual properties for use with tools like Fela and Styletron. A side keyword can optionally be passed to target only one side's border properties.
*
* @example
* // Styles as object usage
* const styles = {
* ...border('1px', 'solid', 'red')
* }
*
* // styled-components usage
* const div = styled.div`
* ${border('1px', 'solid', 'red')}
* `
*
* // CSS as JS Output
*
* div {
* 'borderColor': 'red',
* 'borderStyle': 'solid',
* 'borderWidth': `1px`,
* }
*
* // Styles as object usage
* const styles = {
* ...border('top', '1px', 'solid', 'red')
* }
*
* // styled-components usage
* const div = styled.div`
* ${border('top', '1px', 'solid', 'red')}
* `
*
* // CSS as JS Output
*
* div {
* 'borderTopColor': 'red',
* 'borderTopStyle': 'solid',
* 'borderTopWidth': `1px`,
* }
*/
function border(sideKeyword) {
for (var _len = arguments.length, values = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
values[_key - 1] = arguments[_key];
}
if (typeof sideKeyword === 'string' && sideMap.indexOf(sideKeyword) >= 0) {
var _ref;
return _ref = {}, _ref["border" + capitalizeString(sideKeyword) + "Width"] = values[0], _ref["border" + capitalizeString(sideKeyword) + "Style"] = values[1], _ref["border" + capitalizeString(sideKeyword) + "Color"] = values[2], _ref;
} else {
values.unshift(sideKeyword);
return {
borderWidth: values[0],
borderStyle: values[1],
borderColor: values[2]
};
}
}
/**
* Shorthand that accepts a value for side and a value for radius and applies the radius value to both corners of the side.
* @example
* // Styles as object usage
* const styles = {
* ...borderRadius('top', '5px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${borderRadius('top', '5px')}
* `
*
* // CSS as JS Output
*
* div {
* 'borderTopRightRadius': '5px',
* 'borderTopLeftRadius': '5px',
* }
*/
function borderRadius(side, radius) {
var uppercaseSide = capitalizeString(side);
if (!radius && radius !== 0) {
throw new Error('borderRadius expects a radius value as a string or number as the second argument.');
}
if (uppercaseSide === 'Top' || uppercaseSide === 'Bottom') {
var _ref;
return _ref = {}, _ref["border" + uppercaseSide + "RightRadius"] = radius, _ref["border" + uppercaseSide + "LeftRadius"] = radius, _ref;
}
if (uppercaseSide === 'Left' || uppercaseSide === 'Right') {
var _ref2;
return _ref2 = {}, _ref2["borderTop" + uppercaseSide + "Radius"] = radius, _ref2["borderBottom" + uppercaseSide + "Radius"] = radius, _ref2;
}
throw new Error('borderRadius expects one of "top", "bottom", "left" or "right" as the first argument.');
}
/**
* Shorthand that accepts up to four values, including null to skip a value, and maps them to their respective directions.
* @example
* // Styles as object usage
* const styles = {
* ...borderStyle('solid', 'dashed', 'dotted', 'double')
* }
*
* // styled-components usage
* const div = styled.div`
* ${borderStyle('solid', 'dashed', 'dotted', 'double')}
* `
*
* // CSS as JS Output
*
* div {
* 'borderTopStyle': 'solid',
* 'borderRightStyle': 'dashed',
* 'borderBottomStyle': 'dotted',
* 'borderLeftStyle': 'double'
* }
*/
function borderStyle() {
for (var _len = arguments.length, values = new Array(_len), _key = 0; _key < _len; _key++) {
values[_key] = arguments[_key];
}
return directionalProperty.apply(void 0, ['borderStyle'].concat(values));
}
/**
* Shorthand that accepts up to four values, including null to skip a value, and maps them to their respective directions.
* @example
* // Styles as object usage
* const styles = {
* ...borderWidth('12px', '24px', '36px', '48px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${borderWidth('12px', '24px', '36px', '48px')}
* `
*
* // CSS as JS Output
*
* div {
* 'borderTopWidth': '12px',
* 'borderRightWidth': '24px',
* 'borderBottomWidth': '36px',
* 'borderLeftWidth': '48px'
* }
*/
function borderWidth() {
for (var _len = arguments.length, values = new Array(_len), _key = 0; _key < _len; _key++) {
values[_key] = arguments[_key];
}
return directionalProperty.apply(void 0, ['borderWidth'].concat(values));
}
function generateSelectors(template, state) {
var stateSuffix = state ? ":" + state : '';
return template(stateSuffix);
}
/**
* Function helper that adds an array of states to a template of selectors. Used in textInputs and buttons.
* @private
*/
function statefulSelectors(states, template, stateMap) {
if (!template) throw new Error('You must provide a template to this method.');
if (states.length === 0) return generateSelectors(template, null);
var selectors = [];
for (var i = 0; i < states.length; i += 1) {
if (stateMap && stateMap.indexOf(states[i]) < 0) {
throw new Error('You passed an unsupported selector state to this method.');
}
selectors.push(generateSelectors(template, states[i]));
}
selectors = selectors.join(',');
return selectors;
}
var stateMap = [undefined, null, 'active', 'focus', 'hover'];
function template(state) {
return "button" + state + ",\n input[type=\"button\"]" + state + ",\n input[type=\"reset\"]" + state + ",\n input[type=\"submit\"]" + state;
}
/**
* Populates selectors that target all buttons. You can pass optional states to append to the selectors.
* @example
* // Styles as object usage
* const styles = {
* [buttons('active')]: {
* 'border': 'none'
* }
* }
*
* // styled-components usage
* const div = styled.div`
* > ${buttons('active')} {
* border: none;
* }
* `
*
* // CSS in JS Output
*
* 'button:active,
* 'input[type="button"]:active,
* 'input[type=\"reset\"]:active,
* 'input[type=\"submit\"]:active: {
* 'border': 'none'
* }
*/
function buttons() {
for (var _len = arguments.length, states = new Array(_len), _key = 0; _key < _len; _key++) {
states[_key] = arguments[_key];
}
return statefulSelectors(states, template, stateMap);
}
/**
* Shorthand that accepts up to four values, including null to skip a value, and maps them to their respective directions.
* @example
* // Styles as object usage
* const styles = {
* ...margin('12px', '24px', '36px', '48px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${margin('12px', '24px', '36px', '48px')}
* `
*
* // CSS as JS Output
*
* div {
* 'marginTop': '12px',
* 'marginRight': '24px',
* 'marginBottom': '36px',
* 'marginLeft': '48px'
* }
*/
function margin() {
for (var _len = arguments.length, values = new Array(_len), _key = 0; _key < _len; _key++) {
values[_key] = arguments[_key];
}
return directionalProperty.apply(void 0, ['margin'].concat(values));
}
/**
* Shorthand that accepts up to four values, including null to skip a value, and maps them to their respective directions.
* @example
* // Styles as object usage
* const styles = {
* ...padding('12px', '24px', '36px', '48px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${padding('12px', '24px', '36px', '48px')}
* `
*
* // CSS as JS Output
*
* div {
* 'paddingTop': '12px',
* 'paddingRight': '24px',
* 'paddingBottom': '36px',
* 'paddingLeft': '48px'
* }
*/
function padding() {
for (var _len = arguments.length, values = new Array(_len), _key = 0; _key < _len; _key++) {
values[_key] = arguments[_key];
}
return directionalProperty.apply(void 0, ['padding'].concat(values));
}
var positionMap$1 = ['absolute', 'fixed', 'relative', 'static', 'sticky'];
/**
* Shorthand accepts up to five values, including null to skip a value, and maps them to their respective directions. The first value can optionally be a position keyword.
* @example
* // Styles as object usage
* const styles = {
* ...position('12px', '24px', '36px', '48px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${position('12px', '24px', '36px', '48px')}
* `
*
* // CSS as JS Output
*
* div {
* 'top': '12px',
* 'right': '24px',
* 'bottom': '36px',
* 'left': '48px'
* }
*
* // Styles as object usage
* const styles = {
* ...position('absolute', '12px', '24px', '36px', '48px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${position('absolute', '12px', '24px', '36px', '48px')}
* `
*
* // CSS as JS Output
*
* div {
* 'position': 'absolute',
* 'top': '12px',
* 'right': '24px',
* 'bottom': '36px',
* 'left': '48px'
* }
*/
function position(positionKeyword) {
for (var _len = arguments.length, values = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
values[_key - 1] = arguments[_key];
}
if (positionMap$1.indexOf(positionKeyword) >= 0) {
return Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
position: positionKeyword
}, directionalProperty.apply(void 0, [''].concat(values)));
} else {
var firstValue = positionKeyword; // in this case position is actually the first value
return directionalProperty.apply(void 0, ['', firstValue].concat(values));
}
}
/**
* Shorthand to set the height and width properties in a single statement.
* @example
* // Styles as object usage
* const styles = {
* ...size('300px', '250px')
* }
*
* // styled-components usage
* const div = styled.div`
* ${size('300px', '250px')}
* `
*
* // CSS as JS Output
*
* div {
* 'height': '300px',
* 'width': '250px',
* }
*/
function size(height, width) {
if (width === void 0) {
width = height;
}
return {
height: height,
width: width
};
}
var stateMap$1 = [undefined, null, 'active', 'focus', 'hover'];
function template$1(state) {
return "input[type=\"color\"]" + state + ",\n input[type=\"date\"]" + state + ",\n input[type=\"datetime\"]" + state + ",\n input[type=\"datetime-local\"]" + state + ",\n input[type=\"email\"]" + state + ",\n input[type=\"month\"]" + state + ",\n input[type=\"number\"]" + state + ",\n input[type=\"password\"]" + state + ",\n input[type=\"search\"]" + state + ",\n input[type=\"tel\"]" + state + ",\n input[type=\"text\"]" + state + ",\n input[type=\"time\"]" + state + ",\n input[type=\"url\"]" + state + ",\n input[type=\"week\"]" + state + ",\n input:not([type])" + state + ",\n textarea" + state;
}
/**
* Populates selectors that target all text inputs. You can pass optional states to append to the selectors.
* @example
* // Styles as object usage
* const styles = {
* [textInputs('active')]: {
* 'border': 'none'
* }
* }
*
* // styled-components usage
* const div = styled.div`
* > ${textInputs('active')} {
* border: none;
* }
* `
*
* // CSS in JS Output
*
* 'input[type="color"]:active,
* input[type="date"]:active,
* input[type="datetime"]:active,
* input[type="datetime-local"]:active,
* input[type="email"]:active,
* input[type="month"]:active,
* input[type="number"]:active,
* input[type="password"]:active,
* input[type="search"]:active,
* input[type="tel"]:active,
* input[type="text"]:active,
* input[type="time"]:active,
* input[type="url"]:active,
* input[type="week"]:active,
* input:not([type]):active,
* textarea:active': {
* 'border': 'none'
* }
*/
function textInputs() {
for (var _len = arguments.length, states = new Array(_len), _key = 0; _key < _len; _key++) {
states[_key] = arguments[_key];
}
return statefulSelectors(states, template$1, stateMap$1);
}
/**
* Accepts any number of transition values as parameters for creating a single transition statement. You may also pass an array of properties as the first parameter that you would like to apply the same tranisition values to (second parameter).
* @example
* // Styles as object usage
* const styles = {
* ...transitions('opacity 1.0s ease-in 0s', 'width 2.0s ease-in 2s'),
* ...transitions(['color', 'background-color'], '2.0s ease-in 2s')
* }
*
* // styled-components usage
* const div = styled.div`
* ${transitions('opacity 1.0s ease-in 0s', 'width 2.0s ease-in 2s')};
* ${transitions(['color', 'background-color'], '2.0s ease-in 2s'),};
* `
*
* // CSS as JS Output
*
* div {
* 'transition': 'opacity 1.0s ease-in 0s, width 2.0s ease-in 2s'
* 'transition': 'color 2.0s ease-in 2s, background-color 2.0s ease-in 2s',
* }
*/
function transitions() {
for (var _len = arguments.length, properties = new Array(_len), _key = 0; _key < _len; _key++) {
properties[_key] = arguments[_key];
}
if (Array.isArray(properties[0]) && properties.length === 2) {
var value = properties[1];
if (typeof value !== 'string') {
throw new Error('Property must be a string value.');
}
var transitionsString = properties[0].map(function (property) {
return property + " " + value;
}).join(', ');
return {
transition: transitionsString
};
} else {
return {
transition: properties.join(', ')
};
}
}
// Helpers
/***/ }),
/***/ "./node_modules/react-sortable-hoc/dist/react-sortable-hoc.esm.js":
/*!************************************************************************!*\
!*** ./node_modules/react-sortable-hoc/dist/react-sortable-hoc.esm.js ***!
\************************************************************************/
/*! exports provided: SortableContainer, sortableContainer, SortableElement, sortableElement, SortableHandle, sortableHandle, arrayMove */
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SortableContainer", function() { return sortableContainer; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sortableContainer", function() { return sortableContainer; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SortableElement", function() { return sortableElement; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sortableElement", function() { return sortableElement; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SortableHandle", function() { return sortableHandle; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "sortableHandle", function() { return sortableHandle; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "arrayMove", function() { return arrayMove; });
/* harmony import */ var _babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/extends */ "./node_modules/@babel/runtime/helpers/esm/extends.js");
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread */ "./node_modules/@babel/runtime/helpers/esm/objectSpread.js");
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/classCallCheck */ "./node_modules/@babel/runtime/helpers/esm/classCallCheck.js");
/* harmony import */ var _babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
/* harmony import */ var _babel_runtime_helpers_esm_possibleConstructorReturn__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @babel/runtime/helpers/esm/possibleConstructorReturn */ "./node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js");
/* harmony import */ var _babel_runtime_helpers_esm_getPrototypeOf__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @babel/runtime/helpers/esm/getPrototypeOf */ "./node_modules/@babel/runtime/helpers/esm/getPrototypeOf.js");
/* harmony import */ var _babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @babel/runtime/helpers/esm/inherits */ "./node_modules/@babel/runtime/helpers/esm/inherits.js");
/* harmony import */ var _babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @babel/runtime/helpers/esm/assertThisInitialized */ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js");
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_10__);
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! prop-types */ "./node_modules/prop-types/index.js");
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_11__);
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js");
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_12___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_12__);
/* harmony import */ var invariant__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! invariant */ "./node_modules/invariant/browser.js");
/* harmony import */ var invariant__WEBPACK_IMPORTED_MODULE_13___default = /*#__PURE__*/__webpack_require__.n(invariant__WEBPACK_IMPORTED_MODULE_13__);
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
var Manager = function () {
function Manager() {
Object(_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__["default"])(this, Manager);
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(this, "refs", {});
}
Object(_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(Manager, [{
key: "add",
value: function add(collection, ref) {
if (!this.refs[collection]) {
this.refs[collection] = [];
}
this.refs[collection].push(ref);
}
}, {
key: "remove",
value: function remove(collection, ref) {
var index = this.getIndex(collection, ref);
if (index !== -1) {
this.refs[collection].splice(index, 1);
}
}
}, {
key: "isActive",
value: function isActive() {
return this.active;
}
}, {
key: "getActive",
value: function getActive() {
var _this = this;
return this.refs[this.active.collection].find(function (_ref) {
var node = _ref.node;
return node.sortableInfo.index == _this.active.index;
});
}
}, {
key: "getIndex",
value: function getIndex(collection, ref) {
return this.refs[collection].indexOf(ref);
}
}, {
key: "getOrderedRefs",
value: function getOrderedRefs() {
var collection = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.active.collection;
return this.refs[collection].sort(sortByIndex);
}
}]);
return Manager;
}();
function sortByIndex(_ref2, _ref3) {
var index1 = _ref2.node.sortableInfo.index;
var index2 = _ref3.node.sortableInfo.index;
return index1 - index2;
}
function arrayMove(array, from, to) {
if (true) {
if (typeof console !== 'undefined') {
console.warn("Deprecation warning: arrayMove will no longer be exported by 'react-sortable-hoc' in the next major release. Please install the `array-move` package locally instead. https://www.npmjs.com/package/array-move");
}
}
array = array.slice();
array.splice(to < 0 ? array.length + to : to, 0, array.splice(from, 1)[0]);
return array;
}
function omit(obj, keysToOmit) {
return Object.keys(obj).reduce(function (acc, key) {
if (keysToOmit.indexOf(key) === -1) {
acc[key] = obj[key];
}
return acc;
}, {});
}
var events = {
end: ['touchend', 'touchcancel', 'mouseup'],
move: ['touchmove', 'mousemove'],
start: ['touchstart', 'mousedown']
};
var vendorPrefix = function () {
if (typeof window === 'undefined' || typeof document === 'undefined') {
return '';
}
var styles = window.getComputedStyle(document.documentElement, '') || ['-moz-hidden-iframe'];
var pre = (Array.prototype.slice.call(styles).join('').match(/-(moz|webkit|ms)-/) || styles.OLink === '' && ['', 'o'])[1];
switch (pre) {
case 'ms':
return 'ms';
default:
return pre && pre.length ? pre[0].toUpperCase() + pre.substr(1) : '';
}
}();
function setInlineStyles(node, styles) {
Object.keys(styles).forEach(function (key) {
node.style[key] = styles[key];
});
}
function setTranslate3d(node, translate) {
node.style["".concat(vendorPrefix, "Transform")] = translate == null ? '' : "translate3d(".concat(translate.x, "px,").concat(translate.y, "px,0)");
}
function setTransitionDuration(node, duration) {
node.style["".concat(vendorPrefix, "TransitionDuration")] = duration == null ? '' : "".concat(duration, "ms");
}
function closest(el, fn) {
while (el) {
if (fn(el)) {
return el;
}
el = el.parentNode;
}
return null;
}
function limit(min, max, value) {
return Math.max(min, Math.min(value, max));
}
function getPixelValue(stringValue) {
if (stringValue.substr(-2) === 'px') {
return parseFloat(stringValue);
}
return 0;
}
function getElementMargin(element) {
var style = window.getComputedStyle(element);
return {
bottom: getPixelValue(style.marginBottom),
left: getPixelValue(style.marginLeft),
right: getPixelValue(style.marginRight),
top: getPixelValue(style.marginTop)
};
}
function provideDisplayName(prefix, Component$$1) {
var componentName = Component$$1.displayName || Component$$1.name;
return componentName ? "".concat(prefix, "(").concat(componentName, ")") : prefix;
}
function getScrollAdjustedBoundingClientRect(node, scrollDelta) {
var boundingClientRect = node.getBoundingClientRect();
return {
top: boundingClientRect.top + scrollDelta.top,
left: boundingClientRect.left + scrollDelta.left
};
}
function getPosition(event) {
if (event.touches && event.touches.length) {
return {
x: event.touches[0].pageX,
y: event.touches[0].pageY
};
} else if (event.changedTouches && event.changedTouches.length) {
return {
x: event.changedTouches[0].pageX,
y: event.changedTouches[0].pageY
};
} else {
return {
x: event.pageX,
y: event.pageY
};
}
}
function isTouchEvent(event) {
return event.touches && event.touches.length || event.changedTouches && event.changedTouches.length;
}
function getEdgeOffset(node, parent) {
var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
left: 0,
top: 0
};
if (!node) {
return undefined;
}
var nodeOffset = {
left: offset.left + node.offsetLeft,
top: offset.top + node.offsetTop
};
if (node.parentNode === parent) {
return nodeOffset;
}
return getEdgeOffset(node.parentNode, parent, nodeOffset);
}
function getTargetIndex(newIndex, prevIndex, oldIndex) {
if (newIndex < oldIndex && newIndex > prevIndex) {
return newIndex - 1;
} else if (newIndex > oldIndex && newIndex < prevIndex) {
return newIndex + 1;
} else {
return newIndex;
}
}
function getLockPixelOffset(_ref) {
var lockOffset = _ref.lockOffset,
width = _ref.width,
height = _ref.height;
var offsetX = lockOffset;
var offsetY = lockOffset;
var unit = 'px';
if (typeof lockOffset === 'string') {
var match = /^[+-]?\d*(?:\.\d*)?(px|%)$/.exec(lockOffset);
invariant__WEBPACK_IMPORTED_MODULE_13___default()(match !== null, 'lockOffset value should be a number or a string of a ' + 'number followed by "px" or "%". Given %s', lockOffset);
offsetX = parseFloat(lockOffset);
offsetY = parseFloat(lockOffset);
unit = match[1];
}
invariant__WEBPACK_IMPORTED_MODULE_13___default()(isFinite(offsetX) && isFinite(offsetY), 'lockOffset value should be a finite. Given %s', lockOffset);
if (unit === '%') {
offsetX = offsetX * width / 100;
offsetY = offsetY * height / 100;
}
return {
x: offsetX,
y: offsetY
};
}
function getLockPixelOffsets(_ref2) {
var height = _ref2.height,
width = _ref2.width,
lockOffset = _ref2.lockOffset;
var offsets = Array.isArray(lockOffset) ? lockOffset : [lockOffset, lockOffset];
invariant__WEBPACK_IMPORTED_MODULE_13___default()(offsets.length === 2, 'lockOffset prop of SortableContainer should be a single ' + 'value or an array of exactly two values. Given %s', lockOffset);
var _offsets = Object(_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_1__["default"])(offsets, 2),
minLockOffset = _offsets[0],
maxLockOffset = _offsets[1];
return [getLockPixelOffset({
height: height,
lockOffset: minLockOffset,
width: width
}), getLockPixelOffset({
height: height,
lockOffset: maxLockOffset,
width: width
})];
}
function isScrollable(el) {
var computedStyle = window.getComputedStyle(el);
var overflowRegex = /(auto|scroll)/;
var properties = ['overflow', 'overflowX', 'overflowY'];
return properties.find(function (property) {
return overflowRegex.test(computedStyle[property]);
});
}
function getScrollingParent(el) {
if (!(el instanceof HTMLElement)) {
return null;
} else if (isScrollable(el)) {
return el;
} else {
return getScrollingParent(el.parentNode);
}
}
function getContainerGridGap(element) {
var style = window.getComputedStyle(element);
if (style.display === 'grid') {
return {
x: getPixelValue(style.gridColumnGap),
y: getPixelValue(style.gridRowGap)
};
}
return {
x: 0,
y: 0
};
}
var KEYCODE = {
TAB: 9,
ESC: 27,
SPACE: 32,
LEFT: 37,
UP: 38,
RIGHT: 39,
DOWN: 40
};
var NodeType = {
Anchor: 'A',
Button: 'BUTTON',
Canvas: 'CANVAS',
Input: 'INPUT',
Option: 'OPTION',
Textarea: 'TEXTAREA',
Select: 'SELECT'
};
function cloneNode(node) {
var selector = 'input, textarea, select, canvas, [contenteditable]';
var fields = node.querySelectorAll(selector);
var clonedNode = node.cloneNode(true);
var clonedFields = Object(_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_14__["default"])(clonedNode.querySelectorAll(selector));
clonedFields.forEach(function (field, i) {
if (field.type !== 'file') {
field.value = fields[i].value;
}
if (field.type === 'radio' && field.name) {
field.name = "__sortableClone__".concat(field.name);
}
if (field.tagName === NodeType.Canvas && fields[i].width > 0 && fields[i].height > 0) {
var destCtx = field.getContext('2d');
destCtx.drawImage(fields[i], 0, 0);
}
});
return clonedNode;
}
function sortableHandle(WrappedComponent) {
var _class, _temp;
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
withRef: false
};
return _temp = _class = function (_React$Component) {
Object(_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_7__["default"])(WithSortableHandle, _React$Component);
function WithSortableHandle() {
Object(_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__["default"])(this, WithSortableHandle);
return Object(_babel_runtime_helpers_esm_possibleConstructorReturn__WEBPACK_IMPORTED_MODULE_5__["default"])(this, Object(_babel_runtime_helpers_esm_getPrototypeOf__WEBPACK_IMPORTED_MODULE_6__["default"])(WithSortableHandle).apply(this, arguments));
}
Object(_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(WithSortableHandle, [{
key: "componentDidMount",
value: function componentDidMount() {
var node = Object(react_dom__WEBPACK_IMPORTED_MODULE_12__["findDOMNode"])(this);
node.sortableHandle = true;
}
}, {
key: "getWrappedInstance",
value: function getWrappedInstance() {
invariant__WEBPACK_IMPORTED_MODULE_13___default()(config.withRef, 'To access the wrapped instance, you need to pass in {withRef: true} as the second argument of the SortableHandle() call');
return this.refs.wrappedInstance;
}
}, {
key: "render",
value: function render() {
var ref = config.withRef ? 'wrappedInstance' : null;
return Object(react__WEBPACK_IMPORTED_MODULE_10__["createElement"])(WrappedComponent, Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
ref: ref
}, this.props));
}
}]);
return WithSortableHandle;
}(react__WEBPACK_IMPORTED_MODULE_10__["Component"]), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "displayName", provideDisplayName('sortableHandle', WrappedComponent)), _temp;
}
function isSortableHandle(node) {
return node.sortableHandle != null;
}
var AutoScroller = function () {
function AutoScroller(container, onScrollCallback) {
Object(_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__["default"])(this, AutoScroller);
this.container = container;
this.onScrollCallback = onScrollCallback;
}
Object(_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(AutoScroller, [{
key: "clear",
value: function clear() {
if (this.interval == null) {
return;
}
clearInterval(this.interval);
this.interval = null;
}
}, {
key: "update",
value: function update(_ref) {
var _this = this;
var translate = _ref.translate,
minTranslate = _ref.minTranslate,
maxTranslate = _ref.maxTranslate,
width = _ref.width,
height = _ref.height;
var direction = {
x: 0,
y: 0
};
var speed = {
x: 1,
y: 1
};
var acceleration = {
x: 10,
y: 10
};
var _this$container = this.container,
scrollTop = _this$container.scrollTop,
scrollLeft = _this$container.scrollLeft,
scrollHeight = _this$container.scrollHeight,
scrollWidth = _this$container.scrollWidth,
clientHeight = _this$container.clientHeight,
clientWidth = _this$container.clientWidth;
var isTop = scrollTop === 0;
var isBottom = scrollHeight - scrollTop - clientHeight === 0;
var isLeft = scrollLeft === 0;
var isRight = scrollWidth - scrollLeft - clientWidth === 0;
if (translate.y >= maxTranslate.y - height / 2 && !isBottom) {
direction.y = 1;
speed.y = acceleration.y * Math.abs((maxTranslate.y - height / 2 - translate.y) / height);
} else if (translate.x >= maxTranslate.x - width / 2 && !isRight) {
direction.x = 1;
speed.x = acceleration.x * Math.abs((maxTranslate.x - width / 2 - translate.x) / width);
} else if (translate.y <= minTranslate.y + height / 2 && !isTop) {
direction.y = -1;
speed.y = acceleration.y * Math.abs((translate.y - height / 2 - minTranslate.y) / height);
} else if (translate.x <= minTranslate.x + width / 2 && !isLeft) {
direction.x = -1;
speed.x = acceleration.x * Math.abs((translate.x - width / 2 - minTranslate.x) / width);
}
if (this.interval) {
this.clear();
this.isAutoScrolling = false;
}
if (direction.x !== 0 || direction.y !== 0) {
this.interval = setInterval(function () {
_this.isAutoScrolling = true;
var offset = {
left: speed.x * direction.x,
top: speed.y * direction.y
};
_this.container.scrollTop += offset.top;
_this.container.scrollLeft += offset.left;
_this.onScrollCallback(offset);
}, 5);
}
}
}]);
return AutoScroller;
}();
function defaultGetHelperDimensions(_ref) {
var node = _ref.node;
return {
height: node.offsetHeight,
width: node.offsetWidth
};
}
function defaultShouldCancelStart(event) {
var interactiveElements = [NodeType.Input, NodeType.Textarea, NodeType.Select, NodeType.Option, NodeType.Button];
if (interactiveElements.indexOf(event.target.tagName) !== -1) {
return true;
}
if (closest(event.target, function (el) {
return el.contentEditable === 'true';
})) {
return true;
}
return false;
}
var propTypes = {
axis: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.oneOf(['x', 'y', 'xy']),
contentWindow: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.any,
disableAutoscroll: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.bool,
distance: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number,
getContainer: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
getHelperDimensions: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
helperClass: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.string,
helperContainer: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func, typeof HTMLElement === 'undefined' ? prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.any : prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.instanceOf(HTMLElement)]),
hideSortableGhost: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.bool,
keyboardSortingTransitionDuration: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number,
lockAxis: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.string,
lockOffset: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number, prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.string, prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number, prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.string]))]),
lockToContainerEdges: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.bool,
onSortEnd: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
onSortMove: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
onSortOver: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
onSortStart: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
pressDelay: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number,
pressThreshold: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number,
keyCodes: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.shape({
lift: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number),
drop: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number),
cancel: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number),
up: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number),
down: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.arrayOf(prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number)
}),
shouldCancelStart: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
transitionDuration: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number,
updateBeforeSortStart: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.func,
useDragHandle: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.bool,
useWindowAsScrollContainer: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.bool
};
var defaultKeyCodes = {
lift: [KEYCODE.SPACE],
drop: [KEYCODE.SPACE],
cancel: [KEYCODE.ESC],
up: [KEYCODE.UP, KEYCODE.LEFT],
down: [KEYCODE.DOWN, KEYCODE.RIGHT]
};
var defaultProps = {
axis: 'y',
disableAutoscroll: false,
distance: 0,
getHelperDimensions: defaultGetHelperDimensions,
hideSortableGhost: true,
lockOffset: '50%',
lockToContainerEdges: false,
pressDelay: 0,
pressThreshold: 5,
keyCodes: defaultKeyCodes,
shouldCancelStart: defaultShouldCancelStart,
transitionDuration: 300,
useWindowAsScrollContainer: false
};
var omittedProps = Object.keys(propTypes);
function validateProps(props) {
invariant__WEBPACK_IMPORTED_MODULE_13___default()(!(props.distance && props.pressDelay), 'Attempted to set both `pressDelay` and `distance` on SortableContainer, you may only use one or the other, not both at the same time.');
}
function _finallyRethrows(body, finalizer) {
try {
var result = body();
} catch (e) {
return finalizer(true, e);
}
if (result && result.then) {
return result.then(finalizer.bind(null, false), finalizer.bind(null, true));
}
return finalizer(false, value);
}
function sortableContainer(WrappedComponent) {
var _class, _temp;
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
withRef: false
};
return _temp = _class = function (_React$Component) {
Object(_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_7__["default"])(WithSortableContainer, _React$Component);
function WithSortableContainer(props) {
var _this;
Object(_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__["default"])(this, WithSortableContainer);
_this = Object(_babel_runtime_helpers_esm_possibleConstructorReturn__WEBPACK_IMPORTED_MODULE_5__["default"])(this, Object(_babel_runtime_helpers_esm_getPrototypeOf__WEBPACK_IMPORTED_MODULE_6__["default"])(WithSortableContainer).call(this, props));
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "state", {});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleStart", function (event) {
var _this$props = _this.props,
distance = _this$props.distance,
shouldCancelStart = _this$props.shouldCancelStart;
if (event.button === 2 || shouldCancelStart(event)) {
return;
}
_this.touched = true;
_this.position = getPosition(event);
var node = closest(event.target, function (el) {
return el.sortableInfo != null;
});
if (node && node.sortableInfo && _this.nodeIsChild(node) && !_this.state.sorting) {
var useDragHandle = _this.props.useDragHandle;
var _node$sortableInfo = node.sortableInfo,
index = _node$sortableInfo.index,
collection = _node$sortableInfo.collection,
disabled = _node$sortableInfo.disabled;
if (disabled) {
return;
}
if (useDragHandle && !closest(event.target, isSortableHandle)) {
return;
}
_this.manager.active = {
collection: collection,
index: index
};
if (!isTouchEvent(event) && event.target.tagName === NodeType.Anchor) {
event.preventDefault();
}
if (!distance) {
if (_this.props.pressDelay === 0) {
_this.handlePress(event);
} else {
_this.pressTimer = setTimeout(function () {
return _this.handlePress(event);
}, _this.props.pressDelay);
}
}
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "nodeIsChild", function (node) {
return node.sortableInfo.manager === _this.manager;
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleMove", function (event) {
var _this$props2 = _this.props,
distance = _this$props2.distance,
pressThreshold = _this$props2.pressThreshold;
if (!_this.state.sorting && _this.touched && !_this._awaitingUpdateBeforeSortStart) {
var position = getPosition(event);
var delta = {
x: _this.position.x - position.x,
y: _this.position.y - position.y
};
var combinedDelta = Math.abs(delta.x) + Math.abs(delta.y);
_this.delta = delta;
if (!distance && (!pressThreshold || combinedDelta >= pressThreshold)) {
clearTimeout(_this.cancelTimer);
_this.cancelTimer = setTimeout(_this.cancel, 0);
} else if (distance && combinedDelta >= distance && _this.manager.isActive()) {
_this.handlePress(event);
}
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleEnd", function () {
_this.touched = false;
_this.cancel();
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "cancel", function () {
var distance = _this.props.distance;
var sorting = _this.state.sorting;
if (!sorting) {
if (!distance) {
clearTimeout(_this.pressTimer);
}
_this.manager.active = null;
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handlePress", function (event) {
try {
var active = _this.manager.getActive();
var _temp6 = function () {
if (active) {
var _temp7 = function _temp7() {
var index = _node.sortableInfo.index;
var margin = getElementMargin(_node);
var gridGap = getContainerGridGap(_this.container);
var containerBoundingRect = _this.scrollContainer.getBoundingClientRect();
var dimensions = _getHelperDimensions({
index: index,
node: _node,
collection: _collection
});
_this.node = _node;
_this.margin = margin;
_this.gridGap = gridGap;
_this.width = dimensions.width;
_this.height = dimensions.height;
_this.marginOffset = {
x: _this.margin.left + _this.margin.right + _this.gridGap.x,
y: Math.max(_this.margin.top, _this.margin.bottom, _this.gridGap.y)
};
_this.boundingClientRect = _node.getBoundingClientRect();
_this.containerBoundingRect = containerBoundingRect;
_this.index = index;
_this.newIndex = index;
_this.axis = {
x: _axis.indexOf('x') >= 0,
y: _axis.indexOf('y') >= 0
};
_this.offsetEdge = getEdgeOffset(_node, _this.container);
if (_isKeySorting) {
_this.initialOffset = getPosition(Object(_babel_runtime_helpers_esm_objectSpread__WEBPACK_IMPORTED_MODULE_2__["default"])({}, event, {
pageX: _this.boundingClientRect.left,
pageY: _this.boundingClientRect.top
}));
} else {
_this.initialOffset = getPosition(event);
}
_this.initialScroll = {
left: _this.scrollContainer.scrollLeft,
top: _this.scrollContainer.scrollTop
};
_this.initialWindowScroll = {
left: window.pageXOffset,
top: window.pageYOffset
};
_this.helper = _this.helperContainer.appendChild(cloneNode(_node));
setInlineStyles(_this.helper, {
boxSizing: 'border-box',
height: "".concat(_this.height, "px"),
left: "".concat(_this.boundingClientRect.left - margin.left, "px"),
pointerEvents: 'none',
position: 'fixed',
top: "".concat(_this.boundingClientRect.top - margin.top, "px"),
width: "".concat(_this.width, "px")
});
if (_isKeySorting) {
_this.helper.focus();
}
if (_hideSortableGhost) {
_this.sortableGhost = _node;
setInlineStyles(_node, {
opacity: 0,
visibility: 'hidden'
});
}
_this.minTranslate = {};
_this.maxTranslate = {};
if (_isKeySorting) {
var _ref = _useWindowAsScrollContainer ? {
top: 0,
left: 0,
width: _this.contentWindow.innerWidth,
height: _this.contentWindow.innerHeight
} : _this.containerBoundingRect,
containerTop = _ref.top,
containerLeft = _ref.left,
containerWidth = _ref.width,
containerHeight = _ref.height;
var containerBottom = containerTop + containerHeight;
var containerRight = containerLeft + containerWidth;
if (_this.axis.x) {
_this.minTranslate.x = containerLeft - _this.boundingClientRect.left;
_this.maxTranslate.x = containerRight - (_this.boundingClientRect.left + _this.width);
}
if (_this.axis.y) {
_this.minTranslate.y = containerTop - _this.boundingClientRect.top;
_this.maxTranslate.y = containerBottom - (_this.boundingClientRect.top + _this.height);
}
} else {
if (_this.axis.x) {
_this.minTranslate.x = (_useWindowAsScrollContainer ? 0 : containerBoundingRect.left) - _this.boundingClientRect.left - _this.width / 2;
_this.maxTranslate.x = (_useWindowAsScrollContainer ? _this.contentWindow.innerWidth : containerBoundingRect.left + containerBoundingRect.width) - _this.boundingClientRect.left - _this.width / 2;
}
if (_this.axis.y) {
_this.minTranslate.y = (_useWindowAsScrollContainer ? 0 : containerBoundingRect.top) - _this.boundingClientRect.top - _this.height / 2;
_this.maxTranslate.y = (_useWindowAsScrollContainer ? _this.contentWindow.innerHeight : containerBoundingRect.top + containerBoundingRect.height) - _this.boundingClientRect.top - _this.height / 2;
}
}
if (_helperClass) {
_helperClass.split(' ').forEach(function (className) {
return _this.helper.classList.add(className);
});
}
_this.listenerNode = event.touches ? _node : _this.contentWindow;
if (_isKeySorting) {
_this.listenerNode.addEventListener('wheel', _this.handleKeyEnd, true);
_this.listenerNode.addEventListener('mousedown', _this.handleKeyEnd, true);
_this.listenerNode.addEventListener('keydown', _this.handleKeyDown);
} else {
events.move.forEach(function (eventName) {
return _this.listenerNode.addEventListener(eventName, _this.handleSortMove, false);
});
events.end.forEach(function (eventName) {
return _this.listenerNode.addEventListener(eventName, _this.handleSortEnd, false);
});
}
_this.setState({
sorting: true,
sortingIndex: index
});
if (_onSortStart) {
_onSortStart({
node: _node,
index: index,
collection: _collection,
isKeySorting: _isKeySorting,
nodes: _this.manager.getOrderedRefs(),
helper: _this.helper
}, event);
}
if (_isKeySorting) {
_this.keyMove(0);
}
};
var _this$props3 = _this.props,
_axis = _this$props3.axis,
_getHelperDimensions = _this$props3.getHelperDimensions,
_helperClass = _this$props3.helperClass,
_hideSortableGhost = _this$props3.hideSortableGhost,
updateBeforeSortStart = _this$props3.updateBeforeSortStart,
_onSortStart = _this$props3.onSortStart,
_useWindowAsScrollContainer = _this$props3.useWindowAsScrollContainer;
var _node = active.node,
_collection = active.collection;
var _isKeySorting = _this.manager.isKeySorting;
var _temp8 = function () {
if (typeof updateBeforeSortStart === 'function') {
_this._awaitingUpdateBeforeSortStart = true;
var _temp9 = _finallyRethrows(function () {
var index = _node.sortableInfo.index;
return Promise.resolve(updateBeforeSortStart({
collection: _collection,
index: index,
node: _node,
isKeySorting: _isKeySorting
}, event)).then(function () {});
}, function (_wasThrown, _result) {
_this._awaitingUpdateBeforeSortStart = false;
if (_wasThrown) throw _result;
return _result;
});
if (_temp9 && _temp9.then) return _temp9.then(function () {});
}
}();
return _temp8 && _temp8.then ? _temp8.then(_temp7) : _temp7(_temp8);
}
}();
return Promise.resolve(_temp6 && _temp6.then ? _temp6.then(function () {}) : void 0);
} catch (e) {
return Promise.reject(e);
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleSortMove", function (event) {
var onSortMove = _this.props.onSortMove;
if (typeof event.preventDefault === 'function') {
event.preventDefault();
}
_this.updateHelperPosition(event);
_this.animateNodes();
_this.autoscroll();
if (onSortMove) {
onSortMove(event);
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleSortEnd", function (event) {
var _this$props4 = _this.props,
hideSortableGhost = _this$props4.hideSortableGhost,
onSortEnd = _this$props4.onSortEnd;
var _this$manager = _this.manager,
collection = _this$manager.active.collection,
isKeySorting = _this$manager.isKeySorting;
var nodes = _this.manager.getOrderedRefs();
if (_this.listenerNode) {
if (isKeySorting) {
_this.listenerNode.removeEventListener('wheel', _this.handleKeyEnd, true);
_this.listenerNode.removeEventListener('mousedown', _this.handleKeyEnd, true);
_this.listenerNode.removeEventListener('keydown', _this.handleKeyDown);
} else {
events.move.forEach(function (eventName) {
return _this.listenerNode.removeEventListener(eventName, _this.handleSortMove);
});
events.end.forEach(function (eventName) {
return _this.listenerNode.removeEventListener(eventName, _this.handleSortEnd);
});
}
}
_this.helper.parentNode.removeChild(_this.helper);
if (hideSortableGhost && _this.sortableGhost) {
setInlineStyles(_this.sortableGhost, {
opacity: '',
visibility: ''
});
}
for (var i = 0, len = nodes.length; i < len; i++) {
var _node2 = nodes[i];
var el = _node2.node;
_node2.edgeOffset = null;
_node2.boundingClientRect = null;
setTranslate3d(el, null);
setTransitionDuration(el, null);
_node2.translate = null;
}
_this.autoScroller.clear();
_this.manager.active = null;
_this.manager.isKeySorting = false;
_this.setState({
sorting: false,
sortingIndex: null
});
if (typeof onSortEnd === 'function') {
onSortEnd({
collection: collection,
newIndex: _this.newIndex,
oldIndex: _this.index,
isKeySorting: isKeySorting,
nodes: nodes
}, event);
}
_this.touched = false;
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "autoscroll", function () {
var disableAutoscroll = _this.props.disableAutoscroll;
var isKeySorting = _this.manager.isKeySorting;
if (disableAutoscroll) {
_this.autoScroller.clear();
return;
}
if (isKeySorting) {
var translate = Object(_babel_runtime_helpers_esm_objectSpread__WEBPACK_IMPORTED_MODULE_2__["default"])({}, _this.translate);
var scrollX = 0;
var scrollY = 0;
if (_this.axis.x) {
translate.x = Math.min(_this.maxTranslate.x, Math.max(_this.minTranslate.x, _this.translate.x));
scrollX = _this.translate.x - translate.x;
}
if (_this.axis.y) {
translate.y = Math.min(_this.maxTranslate.y, Math.max(_this.minTranslate.y, _this.translate.y));
scrollY = _this.translate.y - translate.y;
}
_this.translate = translate;
setTranslate3d(_this.helper, _this.translate);
_this.scrollContainer.scrollLeft += scrollX;
_this.scrollContainer.scrollTop += scrollY;
return;
}
_this.autoScroller.update({
height: _this.height,
maxTranslate: _this.maxTranslate,
minTranslate: _this.minTranslate,
translate: _this.translate,
width: _this.width
});
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "onAutoScroll", function (offset) {
_this.translate.x += offset.left;
_this.translate.y += offset.top;
_this.animateNodes();
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleKeyDown", function (event) {
var keyCode = event.keyCode;
var _this$props5 = _this.props,
shouldCancelStart = _this$props5.shouldCancelStart,
_this$props5$keyCodes = _this$props5.keyCodes,
customKeyCodes = _this$props5$keyCodes === void 0 ? {} : _this$props5$keyCodes;
var keyCodes = Object(_babel_runtime_helpers_esm_objectSpread__WEBPACK_IMPORTED_MODULE_2__["default"])({}, defaultKeyCodes, customKeyCodes);
if (_this.manager.active && !_this.manager.isKeySorting || !_this.manager.active && (!keyCodes.lift.includes(keyCode) || shouldCancelStart(event) || !_this.isValidSortingTarget(event))) {
return;
}
event.stopPropagation();
event.preventDefault();
if (keyCodes.lift.includes(keyCode) && !_this.manager.active) {
_this.keyLift(event);
} else if (keyCodes.drop.includes(keyCode) && _this.manager.active) {
_this.keyDrop(event);
} else if (keyCodes.cancel.includes(keyCode)) {
_this.newIndex = _this.manager.active.index;
_this.keyDrop(event);
} else if (keyCodes.up.includes(keyCode)) {
_this.keyMove(-1);
} else if (keyCodes.down.includes(keyCode)) {
_this.keyMove(1);
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "keyLift", function (event) {
var target = event.target;
var node = closest(target, function (el) {
return el.sortableInfo != null;
});
var _node$sortableInfo2 = node.sortableInfo,
index = _node$sortableInfo2.index,
collection = _node$sortableInfo2.collection;
_this.initialFocusedNode = target;
_this.manager.isKeySorting = true;
_this.manager.active = {
index: index,
collection: collection
};
_this.handlePress(event);
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "keyMove", function (shift) {
var nodes = _this.manager.getOrderedRefs();
var lastIndex = nodes[nodes.length - 1].node.sortableInfo.index;
var newIndex = _this.newIndex + shift;
var prevIndex = _this.newIndex;
if (newIndex < 0 || newIndex > lastIndex) {
return;
}
_this.prevIndex = prevIndex;
_this.newIndex = newIndex;
var targetIndex = getTargetIndex(_this.newIndex, _this.prevIndex, _this.index);
var target = nodes.find(function (_ref2) {
var node = _ref2.node;
return node.sortableInfo.index === targetIndex;
});
var targetNode = target.node;
var scrollDelta = _this.containerScrollDelta;
var targetBoundingClientRect = target.boundingClientRect || getScrollAdjustedBoundingClientRect(targetNode, scrollDelta);
var targetTranslate = target.translate || {
x: 0,
y: 0
};
var targetPosition = {
top: targetBoundingClientRect.top + targetTranslate.y - scrollDelta.top,
left: targetBoundingClientRect.left + targetTranslate.x - scrollDelta.left
};
var shouldAdjustForSize = prevIndex < newIndex;
var sizeAdjustment = {
x: shouldAdjustForSize && _this.axis.x ? targetNode.offsetWidth - _this.width : 0,
y: shouldAdjustForSize && _this.axis.y ? targetNode.offsetHeight - _this.height : 0
};
_this.handleSortMove({
pageX: targetPosition.left + sizeAdjustment.x,
pageY: targetPosition.top + sizeAdjustment.y,
ignoreTransition: shift === 0
});
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "keyDrop", function (event) {
_this.handleSortEnd(event);
if (_this.initialFocusedNode) {
_this.initialFocusedNode.focus();
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "handleKeyEnd", function (event) {
if (_this.manager.active) {
_this.keyDrop(event);
}
});
Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(Object(_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_8__["default"])(_this)), "isValidSortingTarget", function (event) {
var useDragHandle = _this.props.useDragHandle;
var target = event.target;
var node = closest(target, function (el) {
return el.sortableInfo != null;
});
return node && node.sortableInfo && !node.sortableInfo.disabled && (useDragHandle ? isSortableHandle(target) : target.sortableInfo);
});
validateProps(props);
_this.manager = new Manager();
_this.events = {
end: _this.handleEnd,
move: _this.handleMove,
start: _this.handleStart
};
return _this;
}
Object(_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(WithSortableContainer, [{
key: "getChildContext",
value: function getChildContext() {
return {
manager: this.manager
};
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
var useWindowAsScrollContainer = this.props.useWindowAsScrollContainer;
var container = this.getContainer();
Promise.resolve(container).then(function (containerNode) {
_this2.container = containerNode;
_this2.document = _this2.container.ownerDocument || document;
var contentWindow = _this2.props.contentWindow || _this2.document.defaultView || window;
_this2.contentWindow = typeof contentWindow === 'function' ? contentWindow() : contentWindow;
_this2.scrollContainer = useWindowAsScrollContainer ? _this2.document.scrollingElement || _this2.document.documentElement : getScrollingParent(_this2.container) || _this2.container;
_this2.autoScroller = new AutoScroller(_this2.scrollContainer, _this2.onAutoScroll);
Object.keys(_this2.events).forEach(function (key) {
return events[key].forEach(function (eventName) {
return _this2.container.addEventListener(eventName, _this2.events[key], false);
});
});
_this2.container.addEventListener('keydown', _this2.handleKeyDown);
});
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
var _this3 = this;
if (this.helper && this.helper.parentNode) {
this.helper.parentNode.removeChild(this.helper);
}
if (!this.container) {
return;
}
Object.keys(this.events).forEach(function (key) {
return events[key].forEach(function (eventName) {
return _this3.container.removeEventListener(eventName, _this3.events[key]);
});
});
this.container.removeEventListener('keydown', this.handleKeyDown);
}
}, {
key: "updateHelperPosition",
value: function updateHelperPosition(event) {
var _this$props6 = this.props,
lockAxis = _this$props6.lockAxis,
lockOffset = _this$props6.lockOffset,
lockToContainerEdges = _this$props6.lockToContainerEdges,
transitionDuration = _this$props6.transitionDuration,
_this$props6$keyboard = _this$props6.keyboardSortingTransitionDuration,
keyboardSortingTransitionDuration = _this$props6$keyboard === void 0 ? transitionDuration : _this$props6$keyboard;
var isKeySorting = this.manager.isKeySorting;
var ignoreTransition = event.ignoreTransition;
var offset = getPosition(event);
var translate = {
x: offset.x - this.initialOffset.x,
y: offset.y - this.initialOffset.y
};
translate.y -= window.pageYOffset - this.initialWindowScroll.top;
translate.x -= window.pageXOffset - this.initialWindowScroll.left;
this.translate = translate;
if (lockToContainerEdges) {
var _getLockPixelOffsets = getLockPixelOffsets({
height: this.height,
lockOffset: lockOffset,
width: this.width
}),
_getLockPixelOffsets2 = Object(_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_1__["default"])(_getLockPixelOffsets, 2),
minLockOffset = _getLockPixelOffsets2[0],
maxLockOffset = _getLockPixelOffsets2[1];
var minOffset = {
x: this.width / 2 - minLockOffset.x,
y: this.height / 2 - minLockOffset.y
};
var maxOffset = {
x: this.width / 2 - maxLockOffset.x,
y: this.height / 2 - maxLockOffset.y
};
translate.x = limit(this.minTranslate.x + minOffset.x, this.maxTranslate.x - maxOffset.x, translate.x);
translate.y = limit(this.minTranslate.y + minOffset.y, this.maxTranslate.y - maxOffset.y, translate.y);
}
if (lockAxis === 'x') {
translate.y = 0;
} else if (lockAxis === 'y') {
translate.x = 0;
}
if (isKeySorting && keyboardSortingTransitionDuration && !ignoreTransition) {
setTransitionDuration(this.helper, keyboardSortingTransitionDuration);
}
setTranslate3d(this.helper, translate);
}
}, {
key: "animateNodes",
value: function animateNodes() {
var _this$props7 = this.props,
transitionDuration = _this$props7.transitionDuration,
hideSortableGhost = _this$props7.hideSortableGhost,
onSortOver = _this$props7.onSortOver;
var containerScrollDelta = this.containerScrollDelta,
windowScrollDelta = this.windowScrollDelta;
var nodes = this.manager.getOrderedRefs();
var sortingOffset = {
left: this.offsetEdge.left + this.translate.x + containerScrollDelta.left,
top: this.offsetEdge.top + this.translate.y + containerScrollDelta.top
};
var isKeySorting = this.manager.isKeySorting;
var prevIndex = this.newIndex;
this.newIndex = null;
for (var i = 0, len = nodes.length; i < len; i++) {
var _node3 = nodes[i].node;
var index = _node3.sortableInfo.index;
var width = _node3.offsetWidth;
var height = _node3.offsetHeight;
var offset = {
height: this.height > height ? height / 2 : this.height / 2,
width: this.width > width ? width / 2 : this.width / 2
};
var mustShiftBackward = isKeySorting && index > this.index && index <= prevIndex;
var mustShiftForward = isKeySorting && index < this.index && index >= prevIndex;
var translate = {
x: 0,
y: 0
};
var edgeOffset = nodes[i].edgeOffset;
if (!edgeOffset) {
edgeOffset = getEdgeOffset(_node3, this.container);
nodes[i].edgeOffset = edgeOffset;
if (isKeySorting) {
nodes[i].boundingClientRect = getScrollAdjustedBoundingClientRect(_node3, containerScrollDelta);
}
}
var nextNode = i < nodes.length - 1 && nodes[i + 1];
var prevNode = i > 0 && nodes[i - 1];
if (nextNode && !nextNode.edgeOffset) {
nextNode.edgeOffset = getEdgeOffset(nextNode.node, this.container);
if (isKeySorting) {
nextNode.boundingClientRect = getScrollAdjustedBoundingClientRect(nextNode.node, containerScrollDelta);
}
}
if (index === this.index) {
if (hideSortableGhost) {
this.sortableGhost = _node3;
setInlineStyles(_node3, {
opacity: 0,
visibility: 'hidden'
});
}
continue;
}
if (transitionDuration) {
setTransitionDuration(_node3, transitionDuration);
}
if (this.axis.x) {
if (this.axis.y) {
if (mustShiftForward || index < this.index && (sortingOffset.left + windowScrollDelta.left - offset.width <= edgeOffset.left && sortingOffset.top + windowScrollDelta.top <= edgeOffset.top + offset.height || sortingOffset.top + windowScrollDelta.top + offset.height <= edgeOffset.top)) {
translate.x = this.width + this.marginOffset.x;
if (edgeOffset.left + translate.x > this.containerBoundingRect.width - offset.width) {
if (nextNode) {
translate.x = nextNode.edgeOffset.left - edgeOffset.left;
translate.y = nextNode.edgeOffset.top - edgeOffset.top;
}
}
if (this.newIndex === null) {
this.newIndex = index;
}
} else if (mustShiftBackward || index > this.index && (sortingOffset.left + windowScrollDelta.left + offset.width >= edgeOffset.left && sortingOffset.top + windowScrollDelta.top + offset.height >= edgeOffset.top || sortingOffset.top + windowScrollDelta.top + offset.height >= edgeOffset.top + height)) {
translate.x = -(this.width + this.marginOffset.x);
if (edgeOffset.left + translate.x < this.containerBoundingRect.left + offset.width) {
if (prevNode) {
translate.x = prevNode.edgeOffset.left - edgeOffset.left;
translate.y = prevNode.edgeOffset.top - edgeOffset.top;
}
}
this.newIndex = index;
}
} else {
if (mustShiftBackward || index > this.index && sortingOffset.left + windowScrollDelta.left + offset.width >= edgeOffset.left) {
translate.x = -(this.width + this.marginOffset.x);
this.newIndex = index;
} else if (mustShiftForward || index < this.index && sortingOffset.left + windowScrollDelta.left <= edgeOffset.left + offset.width) {
translate.x = this.width + this.marginOffset.x;
if (this.newIndex == null) {
this.newIndex = index;
}
}
}
} else if (this.axis.y) {
if (mustShiftBackward || index > this.index && sortingOffset.top + windowScrollDelta.top + offset.height >= edgeOffset.top) {
translate.y = -(this.height + this.marginOffset.y);
this.newIndex = index;
} else if (mustShiftForward || index < this.index && sortingOffset.top + windowScrollDelta.top <= edgeOffset.top + offset.height) {
translate.y = this.height + this.marginOffset.y;
if (this.newIndex == null) {
this.newIndex = index;
}
}
}
setTranslate3d(_node3, translate);
nodes[i].translate = translate;
}
if (this.newIndex == null) {
this.newIndex = this.index;
}
if (isKeySorting) {
this.newIndex = prevIndex;
}
var oldIndex = isKeySorting ? this.prevIndex : prevIndex;
if (onSortOver && this.newIndex !== oldIndex) {
onSortOver({
collection: this.manager.active.collection,
index: this.index,
newIndex: this.newIndex,
oldIndex: oldIndex,
isKeySorting: isKeySorting,
nodes: nodes,
helper: this.helper
});
}
}
}, {
key: "getWrappedInstance",
value: function getWrappedInstance() {
invariant__WEBPACK_IMPORTED_MODULE_13___default()(config.withRef, 'To access the wrapped instance, you need to pass in {withRef: true} as the second argument of the SortableContainer() call');
return this.refs.wrappedInstance;
}
}, {
key: "getContainer",
value: function getContainer() {
var getContainer = this.props.getContainer;
if (typeof getContainer !== 'function') {
return Object(react_dom__WEBPACK_IMPORTED_MODULE_12__["findDOMNode"])(this);
}
return getContainer(config.withRef ? this.getWrappedInstance() : undefined);
}
}, {
key: "render",
value: function render() {
var ref = config.withRef ? 'wrappedInstance' : null;
return Object(react__WEBPACK_IMPORTED_MODULE_10__["createElement"])(WrappedComponent, Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
ref: ref
}, omit(this.props, omittedProps)));
}
}, {
key: "helperContainer",
get: function get() {
var helperContainer = this.props.helperContainer;
if (typeof helperContainer === 'function') {
return helperContainer();
}
return this.props.helperContainer || this.document.body;
}
}, {
key: "containerScrollDelta",
get: function get() {
var useWindowAsScrollContainer = this.props.useWindowAsScrollContainer;
if (useWindowAsScrollContainer) {
return {
left: 0,
top: 0
};
}
return {
left: this.scrollContainer.scrollLeft - this.initialScroll.left,
top: this.scrollContainer.scrollTop - this.initialScroll.top
};
}
}, {
key: "windowScrollDelta",
get: function get() {
return {
left: this.contentWindow.pageXOffset - this.initialWindowScroll.left,
top: this.contentWindow.pageYOffset - this.initialWindowScroll.top
};
}
}]);
return WithSortableContainer;
}(react__WEBPACK_IMPORTED_MODULE_10__["Component"]), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "displayName", provideDisplayName('sortableList', WrappedComponent)), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "defaultProps", defaultProps), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "propTypes", propTypes), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "childContextTypes", {
manager: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.object.isRequired
}), _temp;
}
var propTypes$1 = {
index: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number.isRequired,
collection: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.oneOfType([prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.number, prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.string]),
disabled: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.bool
};
var omittedProps$1 = Object.keys(propTypes$1);
function sortableElement(WrappedComponent) {
var _class, _temp;
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
withRef: false
};
return _temp = _class = function (_React$Component) {
Object(_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_7__["default"])(WithSortableElement, _React$Component);
function WithSortableElement() {
Object(_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__["default"])(this, WithSortableElement);
return Object(_babel_runtime_helpers_esm_possibleConstructorReturn__WEBPACK_IMPORTED_MODULE_5__["default"])(this, Object(_babel_runtime_helpers_esm_getPrototypeOf__WEBPACK_IMPORTED_MODULE_6__["default"])(WithSortableElement).apply(this, arguments));
}
Object(_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(WithSortableElement, [{
key: "componentDidMount",
value: function componentDidMount() {
this.register();
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps) {
if (this.node) {
if (prevProps.index !== this.props.index) {
this.node.sortableInfo.index = this.props.index;
}
if (prevProps.disabled !== this.props.disabled) {
this.node.sortableInfo.disabled = this.props.disabled;
}
}
if (prevProps.collection !== this.props.collection) {
this.unregister(prevProps.collection);
this.register();
}
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.unregister();
}
}, {
key: "register",
value: function register() {
var _this$props = this.props,
collection = _this$props.collection,
disabled = _this$props.disabled,
index = _this$props.index;
var node = Object(react_dom__WEBPACK_IMPORTED_MODULE_12__["findDOMNode"])(this);
node.sortableInfo = {
collection: collection,
disabled: disabled,
index: index,
manager: this.context.manager
};
this.node = node;
this.ref = {
node: node
};
this.context.manager.add(collection, this.ref);
}
}, {
key: "unregister",
value: function unregister() {
var collection = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.props.collection;
this.context.manager.remove(collection, this.ref);
}
}, {
key: "getWrappedInstance",
value: function getWrappedInstance() {
invariant__WEBPACK_IMPORTED_MODULE_13___default()(config.withRef, 'To access the wrapped instance, you need to pass in {withRef: true} as the second argument of the SortableElement() call');
return this.refs.wrappedInstance;
}
}, {
key: "render",
value: function render() {
var ref = config.withRef ? 'wrappedInstance' : null;
return Object(react__WEBPACK_IMPORTED_MODULE_10__["createElement"])(WrappedComponent, Object(_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
ref: ref
}, omit(this.props, omittedProps$1)));
}
}]);
return WithSortableElement;
}(react__WEBPACK_IMPORTED_MODULE_10__["Component"]), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "displayName", provideDisplayName('sortableElement', WrappedComponent)), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "contextTypes", {
manager: prop_types__WEBPACK_IMPORTED_MODULE_11___default.a.object.isRequired
}), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "propTypes", propTypes$1), Object(_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_9__["default"])(_class, "defaultProps", {
collection: 0
}), _temp;
}
/***/ })
}]);
//# sourceMappingURL=vendors~methodconfig.min.js.map
xxxxx1.0, XXX xxxx