|
|
/******/ (() => { // webpackBootstrap
|
|
|
/******/ var __webpack_modules__ = ({
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/colors/es/generate.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/colors/es/generate.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ generate)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/conversion.js");
|
|
|
/* harmony import */ var _ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/format-input.js");
|
|
|
|
|
|
var hueStep = 2; // 色相阶梯
|
|
|
|
|
|
var saturationStep = 0.16; // 饱和度阶梯,浅色部分
|
|
|
|
|
|
var saturationStep2 = 0.05; // 饱和度阶梯,深色部分
|
|
|
|
|
|
var brightnessStep1 = 0.05; // 亮度阶梯,浅色部分
|
|
|
|
|
|
var brightnessStep2 = 0.15; // 亮度阶梯,深色部分
|
|
|
|
|
|
var lightColorCount = 5; // 浅色数量,主色上
|
|
|
|
|
|
var darkColorCount = 4; // 深色数量,主色下
|
|
|
// 暗色主题颜色映射关系表
|
|
|
|
|
|
var darkColorMap = [{
|
|
|
index: 7,
|
|
|
opacity: 0.15
|
|
|
}, {
|
|
|
index: 6,
|
|
|
opacity: 0.25
|
|
|
}, {
|
|
|
index: 5,
|
|
|
opacity: 0.3
|
|
|
}, {
|
|
|
index: 5,
|
|
|
opacity: 0.45
|
|
|
}, {
|
|
|
index: 5,
|
|
|
opacity: 0.65
|
|
|
}, {
|
|
|
index: 5,
|
|
|
opacity: 0.85
|
|
|
}, {
|
|
|
index: 4,
|
|
|
opacity: 0.9
|
|
|
}, {
|
|
|
index: 3,
|
|
|
opacity: 0.95
|
|
|
}, {
|
|
|
index: 2,
|
|
|
opacity: 0.97
|
|
|
}, {
|
|
|
index: 1,
|
|
|
opacity: 0.98
|
|
|
}];
|
|
|
|
|
|
// Wrapper function ported from TinyColor.prototype.toHsv
|
|
|
// Keep it here because of `hsv.h * 360`
|
|
|
function toHsv(_ref) {
|
|
|
var r = _ref.r,
|
|
|
g = _ref.g,
|
|
|
b = _ref.b;
|
|
|
var hsv = (0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_0__.rgbToHsv)(r, g, b);
|
|
|
return {
|
|
|
h: hsv.h * 360,
|
|
|
s: hsv.s,
|
|
|
v: hsv.v
|
|
|
};
|
|
|
} // Wrapper function ported from TinyColor.prototype.toHexString
|
|
|
// Keep it here because of the prefix `#`
|
|
|
|
|
|
|
|
|
function toHex(_ref2) {
|
|
|
var r = _ref2.r,
|
|
|
g = _ref2.g,
|
|
|
b = _ref2.b;
|
|
|
return "#".concat((0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_0__.rgbToHex)(r, g, b, false));
|
|
|
} // Wrapper function ported from TinyColor.prototype.mix, not treeshakable.
|
|
|
// Amount in range [0, 1]
|
|
|
// Assume color1 & color2 has no alpha, since the following src code did so.
|
|
|
|
|
|
|
|
|
function mix(rgb1, rgb2, amount) {
|
|
|
var p = amount / 100;
|
|
|
var rgb = {
|
|
|
r: (rgb2.r - rgb1.r) * p + rgb1.r,
|
|
|
g: (rgb2.g - rgb1.g) * p + rgb1.g,
|
|
|
b: (rgb2.b - rgb1.b) * p + rgb1.b
|
|
|
};
|
|
|
return rgb;
|
|
|
}
|
|
|
|
|
|
function getHue(hsv, i, light) {
|
|
|
var hue; // 根据色相不同,色相转向不同
|
|
|
|
|
|
if (Math.round(hsv.h) >= 60 && Math.round(hsv.h) <= 240) {
|
|
|
hue = light ? Math.round(hsv.h) - hueStep * i : Math.round(hsv.h) + hueStep * i;
|
|
|
} else {
|
|
|
hue = light ? Math.round(hsv.h) + hueStep * i : Math.round(hsv.h) - hueStep * i;
|
|
|
}
|
|
|
|
|
|
if (hue < 0) {
|
|
|
hue += 360;
|
|
|
} else if (hue >= 360) {
|
|
|
hue -= 360;
|
|
|
}
|
|
|
|
|
|
return hue;
|
|
|
}
|
|
|
|
|
|
function getSaturation(hsv, i, light) {
|
|
|
// grey color don't change saturation
|
|
|
if (hsv.h === 0 && hsv.s === 0) {
|
|
|
return hsv.s;
|
|
|
}
|
|
|
|
|
|
var saturation;
|
|
|
|
|
|
if (light) {
|
|
|
saturation = hsv.s - saturationStep * i;
|
|
|
} else if (i === darkColorCount) {
|
|
|
saturation = hsv.s + saturationStep;
|
|
|
} else {
|
|
|
saturation = hsv.s + saturationStep2 * i;
|
|
|
} // 边界值修正
|
|
|
|
|
|
|
|
|
if (saturation > 1) {
|
|
|
saturation = 1;
|
|
|
} // 第一格的 s 限制在 0.06-0.1 之间
|
|
|
|
|
|
|
|
|
if (light && i === lightColorCount && saturation > 0.1) {
|
|
|
saturation = 0.1;
|
|
|
}
|
|
|
|
|
|
if (saturation < 0.06) {
|
|
|
saturation = 0.06;
|
|
|
}
|
|
|
|
|
|
return Number(saturation.toFixed(2));
|
|
|
}
|
|
|
|
|
|
function getValue(hsv, i, light) {
|
|
|
var value;
|
|
|
|
|
|
if (light) {
|
|
|
value = hsv.v + brightnessStep1 * i;
|
|
|
} else {
|
|
|
value = hsv.v - brightnessStep2 * i;
|
|
|
}
|
|
|
|
|
|
if (value > 1) {
|
|
|
value = 1;
|
|
|
}
|
|
|
|
|
|
return Number(value.toFixed(2));
|
|
|
}
|
|
|
|
|
|
function generate(color) {
|
|
|
var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var patterns = [];
|
|
|
var pColor = (0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_1__.inputToRGB)(color);
|
|
|
|
|
|
for (var i = lightColorCount; i > 0; i -= 1) {
|
|
|
var hsv = toHsv(pColor);
|
|
|
var colorString = toHex((0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_1__.inputToRGB)({
|
|
|
h: getHue(hsv, i, true),
|
|
|
s: getSaturation(hsv, i, true),
|
|
|
v: getValue(hsv, i, true)
|
|
|
}));
|
|
|
patterns.push(colorString);
|
|
|
}
|
|
|
|
|
|
patterns.push(toHex(pColor));
|
|
|
|
|
|
for (var _i = 1; _i <= darkColorCount; _i += 1) {
|
|
|
var _hsv = toHsv(pColor);
|
|
|
|
|
|
var _colorString = toHex((0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_1__.inputToRGB)({
|
|
|
h: getHue(_hsv, _i),
|
|
|
s: getSaturation(_hsv, _i),
|
|
|
v: getValue(_hsv, _i)
|
|
|
}));
|
|
|
|
|
|
patterns.push(_colorString);
|
|
|
} // dark theme patterns
|
|
|
|
|
|
|
|
|
if (opts.theme === 'dark') {
|
|
|
return darkColorMap.map(function (_ref3) {
|
|
|
var index = _ref3.index,
|
|
|
opacity = _ref3.opacity;
|
|
|
var darkColorString = toHex(mix((0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_1__.inputToRGB)(opts.backgroundColor || '#141414'), (0,_ctrl_tinycolor__WEBPACK_IMPORTED_MODULE_1__.inputToRGB)(patterns[index]), opacity * 100));
|
|
|
return darkColorString;
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return patterns;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/colors/es/index.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/colors/es/index.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "blue": () => (/* binding */ blue),
|
|
|
/* harmony export */ "cyan": () => (/* binding */ cyan),
|
|
|
/* harmony export */ "geekblue": () => (/* binding */ geekblue),
|
|
|
/* harmony export */ "generate": () => (/* reexport safe */ _generate__WEBPACK_IMPORTED_MODULE_0__["default"]),
|
|
|
/* harmony export */ "gold": () => (/* binding */ gold),
|
|
|
/* harmony export */ "gray": () => (/* binding */ gray),
|
|
|
/* harmony export */ "green": () => (/* binding */ green),
|
|
|
/* harmony export */ "grey": () => (/* binding */ grey),
|
|
|
/* harmony export */ "lime": () => (/* binding */ lime),
|
|
|
/* harmony export */ "magenta": () => (/* binding */ magenta),
|
|
|
/* harmony export */ "orange": () => (/* binding */ orange),
|
|
|
/* harmony export */ "presetDarkPalettes": () => (/* binding */ presetDarkPalettes),
|
|
|
/* harmony export */ "presetPalettes": () => (/* binding */ presetPalettes),
|
|
|
/* harmony export */ "presetPrimaryColors": () => (/* binding */ presetPrimaryColors),
|
|
|
/* harmony export */ "purple": () => (/* binding */ purple),
|
|
|
/* harmony export */ "red": () => (/* binding */ red),
|
|
|
/* harmony export */ "volcano": () => (/* binding */ volcano),
|
|
|
/* harmony export */ "yellow": () => (/* binding */ yellow)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _generate__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./generate */ "./node_modules/@ant-design/colors/es/generate.js");
|
|
|
|
|
|
var presetPrimaryColors = {
|
|
|
red: '#F5222D',
|
|
|
volcano: '#FA541C',
|
|
|
orange: '#FA8C16',
|
|
|
gold: '#FAAD14',
|
|
|
yellow: '#FADB14',
|
|
|
lime: '#A0D911',
|
|
|
green: '#52C41A',
|
|
|
cyan: '#13C2C2',
|
|
|
blue: '#1677FF',
|
|
|
geekblue: '#2F54EB',
|
|
|
purple: '#722ED1',
|
|
|
magenta: '#EB2F96',
|
|
|
grey: '#666666'
|
|
|
};
|
|
|
var presetPalettes = {};
|
|
|
var presetDarkPalettes = {};
|
|
|
Object.keys(presetPrimaryColors).forEach(function (key) {
|
|
|
presetPalettes[key] = (0,_generate__WEBPACK_IMPORTED_MODULE_0__["default"])(presetPrimaryColors[key]);
|
|
|
presetPalettes[key].primary = presetPalettes[key][5]; // dark presetPalettes
|
|
|
|
|
|
presetDarkPalettes[key] = (0,_generate__WEBPACK_IMPORTED_MODULE_0__["default"])(presetPrimaryColors[key], {
|
|
|
theme: 'dark',
|
|
|
backgroundColor: '#141414'
|
|
|
});
|
|
|
presetDarkPalettes[key].primary = presetDarkPalettes[key][5];
|
|
|
});
|
|
|
var red = presetPalettes.red;
|
|
|
var volcano = presetPalettes.volcano;
|
|
|
var gold = presetPalettes.gold;
|
|
|
var orange = presetPalettes.orange;
|
|
|
var yellow = presetPalettes.yellow;
|
|
|
var lime = presetPalettes.lime;
|
|
|
var green = presetPalettes.green;
|
|
|
var cyan = presetPalettes.cyan;
|
|
|
var blue = presetPalettes.blue;
|
|
|
var geekblue = presetPalettes.geekblue;
|
|
|
var purple = presetPalettes.purple;
|
|
|
var magenta = presetPalettes.magenta;
|
|
|
var grey = presetPalettes.grey;
|
|
|
var gray = presetPalettes.grey;
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/Cache.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/Cache.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__ = __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_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// [times, realValue]
|
|
|
var Entity = /*#__PURE__*/function () {
|
|
|
function Entity() {
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__["default"])(this, Entity);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])(this, "cache", new Map());
|
|
|
}
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_1__["default"])(Entity, [{
|
|
|
key: "get",
|
|
|
value: function get(keys) {
|
|
|
return this.cache.get(keys.join('%')) || null;
|
|
|
}
|
|
|
}, {
|
|
|
key: "update",
|
|
|
value: function update(keys, valueFn) {
|
|
|
var path = keys.join('%');
|
|
|
var prevValue = this.cache.get(path);
|
|
|
var nextValue = valueFn(prevValue);
|
|
|
|
|
|
if (nextValue === null) {
|
|
|
this.cache.delete(path);
|
|
|
} else {
|
|
|
this.cache.set(path, nextValue);
|
|
|
}
|
|
|
}
|
|
|
}]);
|
|
|
|
|
|
return Entity;
|
|
|
}();
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Entity);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/Keyframes.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/Keyframes.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__ = __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_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var Keyframe = /*#__PURE__*/function () {
|
|
|
function Keyframe(name, style) {
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__["default"])(this, Keyframe);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])(this, "name", void 0);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])(this, "style", void 0);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])(this, "_keyframe", true);
|
|
|
|
|
|
this.name = name;
|
|
|
this.style = style;
|
|
|
}
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_1__["default"])(Keyframe, [{
|
|
|
key: "getName",
|
|
|
value: function getName() {
|
|
|
var hashId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
|
|
|
return hashId ? "".concat(hashId, "-").concat(this.name) : this.name;
|
|
|
}
|
|
|
}]);
|
|
|
|
|
|
return Keyframe;
|
|
|
}();
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Keyframe);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/StyleContext.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/StyleContext.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "ATTR_DEV_CACHE_PATH": () => (/* binding */ ATTR_DEV_CACHE_PATH),
|
|
|
/* harmony export */ "ATTR_MARK": () => (/* binding */ ATTR_MARK),
|
|
|
/* harmony export */ "ATTR_TOKEN": () => (/* binding */ ATTR_TOKEN),
|
|
|
/* harmony export */ "CSS_IN_JS_INSTANCE": () => (/* binding */ CSS_IN_JS_INSTANCE),
|
|
|
/* harmony export */ "CSS_IN_JS_INSTANCE_ID": () => (/* binding */ CSS_IN_JS_INSTANCE_ID),
|
|
|
/* harmony export */ "StyleProvider": () => (/* binding */ StyleProvider),
|
|
|
/* harmony export */ "createCache": () => (/* binding */ createCache),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js");
|
|
|
/* harmony import */ var rc_util_es_hooks_useMemo__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! rc-util/es/hooks/useMemo */ "./node_modules/rc-util/es/hooks/useMemo.js");
|
|
|
/* harmony import */ var rc_util_es_isEqual__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/es/isEqual */ "./node_modules/rc-util/es/isEqual.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
/* harmony import */ var _Cache__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Cache */ "./node_modules/@ant-design/cssinjs/es/Cache.js");
|
|
|
|
|
|
|
|
|
var _excluded = ["children"];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var ATTR_TOKEN = 'data-token-hash';
|
|
|
var ATTR_MARK = 'data-css-hash';
|
|
|
var ATTR_DEV_CACHE_PATH = 'data-dev-cache-path'; // Mark css-in-js instance in style element
|
|
|
|
|
|
var CSS_IN_JS_INSTANCE = '__cssinjs_instance__';
|
|
|
var CSS_IN_JS_INSTANCE_ID = Math.random().toString(12).slice(2);
|
|
|
function createCache() {
|
|
|
if (typeof document !== 'undefined' && document.head && document.body) {
|
|
|
var styles = document.body.querySelectorAll("style[".concat(ATTR_MARK, "]")) || [];
|
|
|
var firstChild = document.head.firstChild;
|
|
|
Array.from(styles).forEach(function (style) {
|
|
|
style[CSS_IN_JS_INSTANCE] = style[CSS_IN_JS_INSTANCE] || CSS_IN_JS_INSTANCE_ID; // Not force move if no head
|
|
|
|
|
|
document.head.insertBefore(style, firstChild);
|
|
|
}); // Deduplicate of moved styles
|
|
|
|
|
|
var styleHash = {};
|
|
|
Array.from(document.querySelectorAll("style[".concat(ATTR_MARK, "]"))).forEach(function (style) {
|
|
|
var hash = style.getAttribute(ATTR_MARK);
|
|
|
|
|
|
if (styleHash[hash]) {
|
|
|
if (style[CSS_IN_JS_INSTANCE] === CSS_IN_JS_INSTANCE_ID) {
|
|
|
var _style$parentNode;
|
|
|
|
|
|
(_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 ? void 0 : _style$parentNode.removeChild(style);
|
|
|
}
|
|
|
} else {
|
|
|
styleHash[hash] = true;
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return new _Cache__WEBPACK_IMPORTED_MODULE_5__["default"]();
|
|
|
}
|
|
|
var StyleContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.createContext({
|
|
|
hashPriority: 'low',
|
|
|
cache: createCache(),
|
|
|
defaultCache: true
|
|
|
});
|
|
|
var StyleProvider = function StyleProvider(props) {
|
|
|
var children = props.children,
|
|
|
restProps = (0,_babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__["default"])(props, _excluded);
|
|
|
|
|
|
var parentContext = react__WEBPACK_IMPORTED_MODULE_4__.useContext(StyleContext);
|
|
|
var context = (0,rc_util_es_hooks_useMemo__WEBPACK_IMPORTED_MODULE_2__["default"])(function () {
|
|
|
var mergedContext = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, parentContext);
|
|
|
|
|
|
Object.keys(restProps).forEach(function (key) {
|
|
|
var value = restProps[key];
|
|
|
|
|
|
if (restProps[key] !== undefined) {
|
|
|
mergedContext[key] = value;
|
|
|
}
|
|
|
});
|
|
|
var cache = restProps.cache;
|
|
|
mergedContext.cache = mergedContext.cache || createCache();
|
|
|
mergedContext.defaultCache = !cache && parentContext.defaultCache;
|
|
|
return mergedContext;
|
|
|
}, [parentContext, restProps], function (prev, next) {
|
|
|
return !(0,rc_util_es_isEqual__WEBPACK_IMPORTED_MODULE_3__["default"])(prev[0], next[0], true) || !(0,rc_util_es_isEqual__WEBPACK_IMPORTED_MODULE_3__["default"])(prev[1], next[1], true);
|
|
|
});
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.createElement(StyleContext.Provider, {
|
|
|
value: context
|
|
|
}, children);
|
|
|
};
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (StyleContext);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/hooks/useCacheToken.js":
|
|
|
/*!********************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/hooks/useCacheToken.js ***!
|
|
|
\********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ useCacheToken)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
/* harmony import */ var _emotion_hash__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @emotion/hash */ "./node_modules/@emotion/hash/dist/hash.browser.esm.js");
|
|
|
/* harmony import */ var _StyleContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../StyleContext */ "./node_modules/@ant-design/cssinjs/es/StyleContext.js");
|
|
|
/* harmony import */ var _useGlobalCache__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./useGlobalCache */ "./node_modules/@ant-design/cssinjs/es/hooks/useGlobalCache.js");
|
|
|
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../util */ "./node_modules/@ant-design/cssinjs/es/util.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var EMPTY_OVERRIDE = {}; // Generate different prefix to make user selector break in production env.
|
|
|
// This helps developer not to do style override directly on the hash id.
|
|
|
|
|
|
var hashPrefix = true ? 'css-dev-only-do-not-override' : 0;
|
|
|
var tokenKeys = new Map();
|
|
|
|
|
|
function recordCleanToken(tokenKey) {
|
|
|
tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) + 1);
|
|
|
}
|
|
|
|
|
|
function removeStyleTags(key) {
|
|
|
if (typeof document !== 'undefined') {
|
|
|
var styles = document.querySelectorAll("style[".concat(_StyleContext__WEBPACK_IMPORTED_MODULE_4__.ATTR_TOKEN, "=\"").concat(key, "\"]"));
|
|
|
styles.forEach(function (style) {
|
|
|
if (style[_StyleContext__WEBPACK_IMPORTED_MODULE_4__.CSS_IN_JS_INSTANCE] === _StyleContext__WEBPACK_IMPORTED_MODULE_4__.CSS_IN_JS_INSTANCE_ID) {
|
|
|
var _style$parentNode;
|
|
|
|
|
|
(_style$parentNode = style.parentNode) === null || _style$parentNode === void 0 ? void 0 : _style$parentNode.removeChild(style);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
} // Remove will check current keys first
|
|
|
|
|
|
|
|
|
function cleanTokenStyle(tokenKey) {
|
|
|
tokenKeys.set(tokenKey, (tokenKeys.get(tokenKey) || 0) - 1);
|
|
|
var tokenKeyList = Array.from(tokenKeys.keys());
|
|
|
var cleanableKeyList = tokenKeyList.filter(function (key) {
|
|
|
var count = tokenKeys.get(key) || 0;
|
|
|
return count <= 0;
|
|
|
});
|
|
|
|
|
|
if (cleanableKeyList.length < tokenKeyList.length) {
|
|
|
cleanableKeyList.forEach(function (key) {
|
|
|
removeStyleTags(key);
|
|
|
tokenKeys.delete(key);
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Cache theme derivative token as global shared one
|
|
|
* @param theme Theme entity
|
|
|
* @param tokens List of tokens, used for cache. Please do not dynamic generate object directly
|
|
|
* @param option Additional config
|
|
|
* @returns Call Theme.getDerivativeToken(tokenObject) to get token
|
|
|
*/
|
|
|
|
|
|
|
|
|
function useCacheToken(theme, tokens) {
|
|
|
var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
|
var _option$salt = option.salt,
|
|
|
salt = _option$salt === void 0 ? '' : _option$salt,
|
|
|
_option$override = option.override,
|
|
|
override = _option$override === void 0 ? EMPTY_OVERRIDE : _option$override,
|
|
|
formatToken = option.formatToken; // Basic - We do basic cache here
|
|
|
|
|
|
var mergedToken = react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
return Object.assign.apply(Object, [{}].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(tokens)));
|
|
|
}, [tokens]);
|
|
|
var tokenStr = react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
return (0,_util__WEBPACK_IMPORTED_MODULE_6__.flattenToken)(mergedToken);
|
|
|
}, [mergedToken]);
|
|
|
var overrideTokenStr = react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
return (0,_util__WEBPACK_IMPORTED_MODULE_6__.flattenToken)(override);
|
|
|
}, [override]);
|
|
|
var cachedToken = (0,_useGlobalCache__WEBPACK_IMPORTED_MODULE_5__["default"])('token', [salt, theme.id, tokenStr, overrideTokenStr], function () {
|
|
|
var derivativeToken = theme.getDerivativeToken(mergedToken); // Merge with override
|
|
|
|
|
|
var mergedDerivativeToken = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, derivativeToken), override); // Format if needed
|
|
|
|
|
|
|
|
|
if (formatToken) {
|
|
|
mergedDerivativeToken = formatToken(mergedDerivativeToken);
|
|
|
} // Optimize for `useStyleRegister` performance
|
|
|
|
|
|
|
|
|
var tokenKey = (0,_util__WEBPACK_IMPORTED_MODULE_6__.token2key)(mergedDerivativeToken, salt);
|
|
|
mergedDerivativeToken._tokenKey = tokenKey;
|
|
|
recordCleanToken(tokenKey);
|
|
|
var hashId = "".concat(hashPrefix, "-").concat((0,_emotion_hash__WEBPACK_IMPORTED_MODULE_3__["default"])(tokenKey));
|
|
|
mergedDerivativeToken._hashId = hashId; // Not used
|
|
|
|
|
|
return [mergedDerivativeToken, hashId];
|
|
|
}, function (cache) {
|
|
|
// Remove token will remove all related style
|
|
|
cleanTokenStyle(cache[0]._tokenKey);
|
|
|
});
|
|
|
return cachedToken;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/hooks/useGlobalCache.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/hooks/useGlobalCache.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ useClientCache)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
/* harmony import */ var _StyleContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../StyleContext */ "./node_modules/@ant-design/cssinjs/es/StyleContext.js");
|
|
|
/* harmony import */ var _useHMR__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./useHMR */ "./node_modules/@ant-design/cssinjs/es/hooks/useHMR.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function useClientCache(prefix, keyPath, cacheFn, onCacheRemove) {
|
|
|
var _React$useContext = react__WEBPACK_IMPORTED_MODULE_2__.useContext(_StyleContext__WEBPACK_IMPORTED_MODULE_3__["default"]),
|
|
|
globalCache = _React$useContext.cache;
|
|
|
|
|
|
var fullPath = [prefix].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(keyPath));
|
|
|
var HMRUpdate = (0,_useHMR__WEBPACK_IMPORTED_MODULE_4__["default"])(); // Create cache
|
|
|
|
|
|
react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
globalCache.update(fullPath, function (prevCache) {
|
|
|
var _ref = prevCache || [],
|
|
|
_ref2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_ref, 2),
|
|
|
_ref2$ = _ref2[0],
|
|
|
times = _ref2$ === void 0 ? 0 : _ref2$,
|
|
|
cache = _ref2[1]; // HMR should always ignore cache since developer may change it
|
|
|
|
|
|
|
|
|
var tmpCache = cache;
|
|
|
|
|
|
if ( true && cache && HMRUpdate) {
|
|
|
onCacheRemove === null || onCacheRemove === void 0 ? void 0 : onCacheRemove(tmpCache, HMRUpdate);
|
|
|
tmpCache = null;
|
|
|
}
|
|
|
|
|
|
var mergedCache = tmpCache || cacheFn();
|
|
|
return [times + 1, mergedCache];
|
|
|
});
|
|
|
},
|
|
|
/* eslint-disable react-hooks/exhaustive-deps */
|
|
|
[fullPath.join('_')]
|
|
|
/* eslint-enable */
|
|
|
); // Remove if no need anymore
|
|
|
|
|
|
react__WEBPACK_IMPORTED_MODULE_2__.useEffect(function () {
|
|
|
return function () {
|
|
|
globalCache.update(fullPath, function (prevCache) {
|
|
|
var _ref3 = prevCache || [],
|
|
|
_ref4 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_ref3, 2),
|
|
|
_ref4$ = _ref4[0],
|
|
|
times = _ref4$ === void 0 ? 0 : _ref4$,
|
|
|
cache = _ref4[1];
|
|
|
|
|
|
var nextCount = times - 1;
|
|
|
|
|
|
if (nextCount === 0) {
|
|
|
onCacheRemove === null || onCacheRemove === void 0 ? void 0 : onCacheRemove(cache, false);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return [times - 1, cache];
|
|
|
});
|
|
|
};
|
|
|
}, fullPath);
|
|
|
return globalCache.get(fullPath)[1];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/hooks/useHMR.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/hooks/useHMR.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* module decorator */ module = __webpack_require__.hmd(module);
|
|
|
function useProdHMR() {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var webpackHMR = false;
|
|
|
|
|
|
function useDevHMR() {
|
|
|
return webpackHMR;
|
|
|
}
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ( false ? 0 : useDevHMR); // Webpack `module.hot.accept` do not support any deps update trigger
|
|
|
// We have to hack handler to force mark as HRM
|
|
|
|
|
|
if ( true && module && module.hot) { var originWebpackHotUpdate, win; }
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/hooks/useStyleRegister.js":
|
|
|
/*!***********************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/hooks/useStyleRegister.js ***!
|
|
|
\***********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "_cf": () => (/* binding */ _cf),
|
|
|
/* harmony export */ "default": () => (/* binding */ useStyleRegister),
|
|
|
/* harmony export */ "extractStyle": () => (/* binding */ extractStyle),
|
|
|
/* harmony export */ "normalizeStyle": () => (/* binding */ normalizeStyle),
|
|
|
/* harmony export */ "parseStyle": () => (/* binding */ parseStyle)
|
|
|
/* harmony export */ });
|
|
|
/* 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_defineProperty__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @babel/runtime/helpers/esm/typeof */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
/* harmony import */ var _emotion_hash__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @emotion/hash */ "./node_modules/@emotion/hash/dist/hash.browser.esm.js");
|
|
|
/* harmony import */ var rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! rc-util/es/Dom/canUseDom */ "./node_modules/rc-util/es/Dom/canUseDom.js");
|
|
|
/* harmony import */ var rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! rc-util/es/Dom/dynamicCSS */ "./node_modules/rc-util/es/Dom/dynamicCSS.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_9__);
|
|
|
/* harmony import */ var _emotion_unitless__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @emotion/unitless */ "./node_modules/@emotion/unitless/dist/unitless.browser.esm.js");
|
|
|
/* harmony import */ var stylis__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! stylis */ "./node_modules/stylis/src/Serializer.js");
|
|
|
/* harmony import */ var stylis__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! stylis */ "./node_modules/stylis/src/Parser.js");
|
|
|
/* harmony import */ var _linters__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../linters */ "./node_modules/@ant-design/cssinjs/es/linters/index.js");
|
|
|
/* harmony import */ var _StyleContext__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../StyleContext */ "./node_modules/@ant-design/cssinjs/es/StyleContext.js");
|
|
|
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../util */ "./node_modules/@ant-design/cssinjs/es/util.js");
|
|
|
/* harmony import */ var _useGlobalCache__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./useGlobalCache */ "./node_modules/@ant-design/cssinjs/es/hooks/useGlobalCache.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// @ts-ignore
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var isClientSide = (0,rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_7__["default"])();
|
|
|
var SKIP_CHECK = '_skip_check_';
|
|
|
// ============================================================================
|
|
|
// == Parser ==
|
|
|
// ============================================================================
|
|
|
// Preprocessor style content to browser support one
|
|
|
function normalizeStyle(styleStr) {
|
|
|
var serialized = (0,stylis__WEBPACK_IMPORTED_MODULE_15__.serialize)((0,stylis__WEBPACK_IMPORTED_MODULE_16__.compile)(styleStr), stylis__WEBPACK_IMPORTED_MODULE_15__.stringify);
|
|
|
return serialized.replace(/\{%%%\:[^;];}/g, ';');
|
|
|
}
|
|
|
|
|
|
function isCompoundCSSProperty(value) {
|
|
|
return (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_5__["default"])(value) === 'object' && value && SKIP_CHECK in value;
|
|
|
} // 注入 hash 值
|
|
|
|
|
|
|
|
|
function injectSelectorHash(key, hashId, hashPriority) {
|
|
|
if (!hashId) {
|
|
|
return key;
|
|
|
}
|
|
|
|
|
|
var hashClassName = ".".concat(hashId);
|
|
|
var hashSelector = hashPriority === 'low' ? ":where(".concat(hashClassName, ")") : hashClassName; // 注入 hashId
|
|
|
|
|
|
var keys = key.split(',').map(function (k) {
|
|
|
var _firstPath$match;
|
|
|
|
|
|
var fullPath = k.trim().split(/\s+/); // 如果 Selector 第一个是 HTML Element,那我们就插到它的后面。反之,就插到最前面。
|
|
|
|
|
|
var firstPath = fullPath[0] || '';
|
|
|
var htmlElement = ((_firstPath$match = firstPath.match(/^\w+/)) === null || _firstPath$match === void 0 ? void 0 : _firstPath$match[0]) || '';
|
|
|
firstPath = "".concat(htmlElement).concat(hashSelector).concat(firstPath.slice(htmlElement.length));
|
|
|
return [firstPath].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(fullPath.slice(1))).join(' ');
|
|
|
});
|
|
|
return keys.join(',');
|
|
|
}
|
|
|
|
|
|
// Global effect style will mount once and not removed
|
|
|
// The effect will not save in SSR cache (e.g. keyframes)
|
|
|
var globalEffectStyleKeys = new Set();
|
|
|
/**
|
|
|
* @private Test only. Clear the global effect style keys.
|
|
|
*/
|
|
|
|
|
|
var _cf = true ? function () {
|
|
|
return globalEffectStyleKeys.clear();
|
|
|
} : 0; // Parse CSSObject to style content
|
|
|
|
|
|
var parseStyle = function parseStyle(interpolation) {
|
|
|
var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
|
|
|
var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
|
|
|
root: true,
|
|
|
parentSelectors: []
|
|
|
},
|
|
|
root = _ref.root,
|
|
|
injectHash = _ref.injectHash,
|
|
|
parentSelectors = _ref.parentSelectors;
|
|
|
|
|
|
var hashId = config.hashId,
|
|
|
layer = config.layer,
|
|
|
path = config.path,
|
|
|
hashPriority = config.hashPriority,
|
|
|
_config$transformers = config.transformers,
|
|
|
transformers = _config$transformers === void 0 ? [] : _config$transformers,
|
|
|
_config$linters = config.linters,
|
|
|
linters = _config$linters === void 0 ? [] : _config$linters;
|
|
|
var styleStr = '';
|
|
|
var effectStyle = {};
|
|
|
|
|
|
function parseKeyframes(keyframes) {
|
|
|
var animationName = keyframes.getName(hashId);
|
|
|
|
|
|
if (!effectStyle[animationName]) {
|
|
|
var _parseStyle = parseStyle(keyframes.style, config, {
|
|
|
root: false,
|
|
|
parentSelectors: parentSelectors
|
|
|
}),
|
|
|
_parseStyle2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__["default"])(_parseStyle, 1),
|
|
|
_parsedStr = _parseStyle2[0];
|
|
|
|
|
|
effectStyle[animationName] = "@keyframes ".concat(keyframes.getName(hashId)).concat(_parsedStr);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function flattenList(list) {
|
|
|
var fullList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
|
list.forEach(function (item) {
|
|
|
if (Array.isArray(item)) {
|
|
|
flattenList(item, fullList);
|
|
|
} else if (item) {
|
|
|
fullList.push(item);
|
|
|
}
|
|
|
});
|
|
|
return fullList;
|
|
|
}
|
|
|
|
|
|
var flattenStyleList = flattenList(Array.isArray(interpolation) ? interpolation : [interpolation]);
|
|
|
flattenStyleList.forEach(function (originStyle) {
|
|
|
// Only root level can use raw string
|
|
|
var style = typeof originStyle === 'string' && !root ? {} : originStyle;
|
|
|
|
|
|
if (typeof style === 'string') {
|
|
|
styleStr += "".concat(style, "\n");
|
|
|
} else if (style._keyframe) {
|
|
|
// Keyframe
|
|
|
parseKeyframes(style);
|
|
|
} else {
|
|
|
var mergedStyle = transformers.reduce(function (prev, trans) {
|
|
|
var _trans$visit;
|
|
|
|
|
|
return (trans === null || trans === void 0 ? void 0 : (_trans$visit = trans.visit) === null || _trans$visit === void 0 ? void 0 : _trans$visit.call(trans, prev)) || prev;
|
|
|
}, style); // Normal CSSObject
|
|
|
|
|
|
Object.keys(mergedStyle).forEach(function (key) {
|
|
|
var value = mergedStyle[key];
|
|
|
|
|
|
if ((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_5__["default"])(value) === 'object' && value && (key !== 'animationName' || !value._keyframe) && !isCompoundCSSProperty(value)) {
|
|
|
var subInjectHash = false; // 当成嵌套对象来处理
|
|
|
|
|
|
var mergedKey = key.trim(); // Whether treat child as root. In most case it is false.
|
|
|
|
|
|
var nextRoot = false; // 拆分多个选择器
|
|
|
|
|
|
if ((root || injectHash) && hashId) {
|
|
|
if (mergedKey.startsWith('@')) {
|
|
|
// 略过媒体查询,交给子节点继续插入 hashId
|
|
|
subInjectHash = true;
|
|
|
} else {
|
|
|
// 注入 hashId
|
|
|
mergedKey = injectSelectorHash(key, hashId, hashPriority);
|
|
|
}
|
|
|
} else if (root && !hashId && (mergedKey === '&' || mergedKey === '')) {
|
|
|
// In case of `{ '&': { a: { color: 'red' } } }` or `{ '': { a: { color: 'red' } } }` without hashId,
|
|
|
// we will get `&{a:{color:red;}}` or `{a:{color:red;}}` string for stylis to compile.
|
|
|
// But it does not conform to stylis syntax,
|
|
|
// and finally we will get `{color:red;}` as css, which is wrong.
|
|
|
// So we need to remove key in root, and treat child `{ a: { color: 'red' } }` as root.
|
|
|
mergedKey = '';
|
|
|
nextRoot = true;
|
|
|
}
|
|
|
|
|
|
var _parseStyle3 = parseStyle(value, config, {
|
|
|
root: nextRoot,
|
|
|
injectHash: subInjectHash,
|
|
|
parentSelectors: [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(parentSelectors), [mergedKey])
|
|
|
}),
|
|
|
_parseStyle4 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__["default"])(_parseStyle3, 2),
|
|
|
_parsedStr2 = _parseStyle4[0],
|
|
|
childEffectStyle = _parseStyle4[1];
|
|
|
|
|
|
effectStyle = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_2__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_2__["default"])({}, effectStyle), childEffectStyle);
|
|
|
styleStr += "".concat(mergedKey).concat(_parsedStr2);
|
|
|
} else {
|
|
|
var _value;
|
|
|
|
|
|
var actualValue = (_value = value === null || value === void 0 ? void 0 : value.value) !== null && _value !== void 0 ? _value : value;
|
|
|
|
|
|
if ( true && ((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_5__["default"])(value) !== 'object' || !(value !== null && value !== void 0 && value[SKIP_CHECK]))) {
|
|
|
[_linters__WEBPACK_IMPORTED_MODULE_11__.contentQuotesLinter, _linters__WEBPACK_IMPORTED_MODULE_11__.hashedAnimationLinter].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(linters)).forEach(function (linter) {
|
|
|
return linter(key, actualValue, {
|
|
|
path: path,
|
|
|
hashId: hashId,
|
|
|
parentSelectors: parentSelectors
|
|
|
});
|
|
|
});
|
|
|
} // 如果是样式则直接插入
|
|
|
|
|
|
|
|
|
var styleName = key.replace(/[A-Z]/g, function (match) {
|
|
|
return "-".concat(match.toLowerCase());
|
|
|
}); // Auto suffix with px
|
|
|
|
|
|
var formatValue = actualValue;
|
|
|
|
|
|
if (!_emotion_unitless__WEBPACK_IMPORTED_MODULE_10__["default"][key] && typeof formatValue === 'number' && formatValue !== 0) {
|
|
|
formatValue = "".concat(formatValue, "px");
|
|
|
} // handle animationName & Keyframe value
|
|
|
|
|
|
|
|
|
if (key === 'animationName' && value !== null && value !== void 0 && value._keyframe) {
|
|
|
parseKeyframes(value);
|
|
|
formatValue = value.getName(hashId);
|
|
|
}
|
|
|
|
|
|
styleStr += "".concat(styleName, ":").concat(formatValue, ";");
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
|
|
|
if (!root) {
|
|
|
styleStr = "{".concat(styleStr, "}");
|
|
|
} else if (layer && (0,_util__WEBPACK_IMPORTED_MODULE_13__.supportLayer)()) {
|
|
|
var layerCells = layer.split(',');
|
|
|
var layerName = layerCells[layerCells.length - 1].trim();
|
|
|
styleStr = "@layer ".concat(layerName, " {").concat(styleStr, "}"); // Order of layer if needed
|
|
|
|
|
|
if (layerCells.length > 1) {
|
|
|
// zombieJ: stylis do not support layer order, so we need to handle it manually.
|
|
|
styleStr = "@layer ".concat(layer, "{%%%:%}").concat(styleStr);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return [styleStr, effectStyle];
|
|
|
}; // ============================================================================
|
|
|
// == Register ==
|
|
|
// ============================================================================
|
|
|
|
|
|
function uniqueHash(path, styleStr) {
|
|
|
return (0,_emotion_hash__WEBPACK_IMPORTED_MODULE_6__["default"])("".concat(path.join('%')).concat(styleStr));
|
|
|
}
|
|
|
|
|
|
function Empty() {
|
|
|
return null;
|
|
|
}
|
|
|
/**
|
|
|
* Register a style to the global style sheet.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function useStyleRegister(info, styleFn) {
|
|
|
var token = info.token,
|
|
|
path = info.path,
|
|
|
hashId = info.hashId,
|
|
|
layer = info.layer;
|
|
|
|
|
|
var _React$useContext = react__WEBPACK_IMPORTED_MODULE_9__.useContext(_StyleContext__WEBPACK_IMPORTED_MODULE_12__["default"]),
|
|
|
autoClear = _React$useContext.autoClear,
|
|
|
mock = _React$useContext.mock,
|
|
|
defaultCache = _React$useContext.defaultCache,
|
|
|
hashPriority = _React$useContext.hashPriority,
|
|
|
container = _React$useContext.container,
|
|
|
ssrInline = _React$useContext.ssrInline,
|
|
|
transformers = _React$useContext.transformers,
|
|
|
linters = _React$useContext.linters;
|
|
|
|
|
|
var tokenKey = token._tokenKey;
|
|
|
var fullPath = [tokenKey].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(path)); // Check if need insert style
|
|
|
|
|
|
var isMergedClientSide = isClientSide;
|
|
|
|
|
|
if ( true && mock !== undefined) {
|
|
|
isMergedClientSide = mock === 'client';
|
|
|
}
|
|
|
|
|
|
var _useGlobalCache = (0,_useGlobalCache__WEBPACK_IMPORTED_MODULE_14__["default"])('style', fullPath, // Create cache if needed
|
|
|
function () {
|
|
|
var styleObj = styleFn();
|
|
|
|
|
|
var _parseStyle5 = parseStyle(styleObj, {
|
|
|
hashId: hashId,
|
|
|
hashPriority: hashPriority,
|
|
|
layer: layer,
|
|
|
path: path.join('-'),
|
|
|
transformers: transformers,
|
|
|
linters: linters
|
|
|
}),
|
|
|
_parseStyle6 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__["default"])(_parseStyle5, 2),
|
|
|
parsedStyle = _parseStyle6[0],
|
|
|
effectStyle = _parseStyle6[1];
|
|
|
|
|
|
var styleStr = normalizeStyle(parsedStyle);
|
|
|
var styleId = uniqueHash(fullPath, styleStr);
|
|
|
|
|
|
if (isMergedClientSide) {
|
|
|
var style = (0,rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_8__.updateCSS)(styleStr, styleId, {
|
|
|
mark: _StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_MARK,
|
|
|
prepend: 'queue',
|
|
|
attachTo: container
|
|
|
});
|
|
|
style[_StyleContext__WEBPACK_IMPORTED_MODULE_12__.CSS_IN_JS_INSTANCE] = _StyleContext__WEBPACK_IMPORTED_MODULE_12__.CSS_IN_JS_INSTANCE_ID; // Used for `useCacheToken` to remove on batch when token removed
|
|
|
|
|
|
style.setAttribute(_StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_TOKEN, tokenKey); // Dev usage to find which cache path made this easily
|
|
|
|
|
|
if (true) {
|
|
|
style.setAttribute(_StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_DEV_CACHE_PATH, fullPath.join('|'));
|
|
|
} // Inject client side effect style
|
|
|
|
|
|
|
|
|
Object.keys(effectStyle).forEach(function (effectKey) {
|
|
|
if (!globalEffectStyleKeys.has(effectKey)) {
|
|
|
globalEffectStyleKeys.add(effectKey); // Inject
|
|
|
|
|
|
(0,rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_8__.updateCSS)(normalizeStyle(effectStyle[effectKey]), "_effect-".concat(effectKey), {
|
|
|
mark: _StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_MARK,
|
|
|
prepend: 'queue',
|
|
|
attachTo: container
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return [styleStr, tokenKey, styleId];
|
|
|
}, // Remove cache if no need
|
|
|
function (_ref2, fromHMR) {
|
|
|
var _ref3 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__["default"])(_ref2, 3),
|
|
|
styleId = _ref3[2];
|
|
|
|
|
|
if ((fromHMR || autoClear) && isClientSide) {
|
|
|
(0,rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_8__.removeCSS)(styleId, {
|
|
|
mark: _StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_MARK
|
|
|
});
|
|
|
}
|
|
|
}),
|
|
|
_useGlobalCache2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__["default"])(_useGlobalCache, 3),
|
|
|
cachedStyleStr = _useGlobalCache2[0],
|
|
|
cachedTokenKey = _useGlobalCache2[1],
|
|
|
cachedStyleId = _useGlobalCache2[2];
|
|
|
|
|
|
return function (node) {
|
|
|
var styleNode;
|
|
|
|
|
|
if (!ssrInline || isMergedClientSide || !defaultCache) {
|
|
|
styleNode = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_9__.createElement(Empty, null);
|
|
|
} else {
|
|
|
var _ref4;
|
|
|
|
|
|
styleNode = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_9__.createElement("style", (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, (_ref4 = {}, (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref4, _StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_TOKEN, cachedTokenKey), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref4, _StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_MARK, cachedStyleId), _ref4), {
|
|
|
dangerouslySetInnerHTML: {
|
|
|
__html: cachedStyleStr
|
|
|
}
|
|
|
}));
|
|
|
}
|
|
|
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_9__.createElement(react__WEBPACK_IMPORTED_MODULE_9__.Fragment, null, styleNode, node);
|
|
|
};
|
|
|
} // ============================================================================
|
|
|
// == SSR ==
|
|
|
// ============================================================================
|
|
|
|
|
|
function extractStyle(cache) {
|
|
|
// prefix with `style` is used for `useStyleRegister` to cache style context
|
|
|
var styleKeys = Array.from(cache.cache.keys()).filter(function (key) {
|
|
|
return key.startsWith('style%');
|
|
|
}); // const tokenStyles: Record<string, string[]> = {};
|
|
|
|
|
|
var styleText = '';
|
|
|
styleKeys.forEach(function (key) {
|
|
|
var _ = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_3__["default"])(cache.cache.get(key)[1], 3),
|
|
|
styleStr = _[0],
|
|
|
tokenKey = _[1],
|
|
|
styleId = _[2];
|
|
|
|
|
|
styleText += "<style ".concat(_StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_TOKEN, "=\"").concat(tokenKey, "\" ").concat(_StyleContext__WEBPACK_IMPORTED_MODULE_12__.ATTR_MARK, "=\"").concat(styleId, "\">").concat(styleStr, "</style>");
|
|
|
});
|
|
|
return styleText;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/index.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/index.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "Keyframes": () => (/* reexport safe */ _Keyframes__WEBPACK_IMPORTED_MODULE_2__["default"]),
|
|
|
/* harmony export */ "StyleProvider": () => (/* reexport safe */ _StyleContext__WEBPACK_IMPORTED_MODULE_4__.StyleProvider),
|
|
|
/* harmony export */ "Theme": () => (/* reexport safe */ _theme__WEBPACK_IMPORTED_MODULE_5__.Theme),
|
|
|
/* harmony export */ "createCache": () => (/* reexport safe */ _StyleContext__WEBPACK_IMPORTED_MODULE_4__.createCache),
|
|
|
/* harmony export */ "createTheme": () => (/* reexport safe */ _theme__WEBPACK_IMPORTED_MODULE_5__.createTheme),
|
|
|
/* harmony export */ "extractStyle": () => (/* reexport safe */ _hooks_useStyleRegister__WEBPACK_IMPORTED_MODULE_1__.extractStyle),
|
|
|
/* harmony export */ "legacyLogicalPropertiesTransformer": () => (/* reexport safe */ _transformers_legacyLogicalProperties__WEBPACK_IMPORTED_MODULE_6__["default"]),
|
|
|
/* harmony export */ "legacyNotSelectorLinter": () => (/* reexport safe */ _linters__WEBPACK_IMPORTED_MODULE_3__.legacyNotSelectorLinter),
|
|
|
/* harmony export */ "logicalPropertiesLinter": () => (/* reexport safe */ _linters__WEBPACK_IMPORTED_MODULE_3__.logicalPropertiesLinter),
|
|
|
/* harmony export */ "parentSelectorLinter": () => (/* reexport safe */ _linters__WEBPACK_IMPORTED_MODULE_3__.parentSelectorLinter),
|
|
|
/* harmony export */ "useCacheToken": () => (/* reexport safe */ _hooks_useCacheToken__WEBPACK_IMPORTED_MODULE_0__["default"]),
|
|
|
/* harmony export */ "useStyleRegister": () => (/* reexport safe */ _hooks_useStyleRegister__WEBPACK_IMPORTED_MODULE_1__["default"])
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _hooks_useCacheToken__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./hooks/useCacheToken */ "./node_modules/@ant-design/cssinjs/es/hooks/useCacheToken.js");
|
|
|
/* harmony import */ var _hooks_useStyleRegister__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./hooks/useStyleRegister */ "./node_modules/@ant-design/cssinjs/es/hooks/useStyleRegister.js");
|
|
|
/* harmony import */ var _Keyframes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Keyframes */ "./node_modules/@ant-design/cssinjs/es/Keyframes.js");
|
|
|
/* harmony import */ var _linters__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./linters */ "./node_modules/@ant-design/cssinjs/es/linters/index.js");
|
|
|
/* harmony import */ var _StyleContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./StyleContext */ "./node_modules/@ant-design/cssinjs/es/StyleContext.js");
|
|
|
/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./theme */ "./node_modules/@ant-design/cssinjs/es/theme/index.js");
|
|
|
/* harmony import */ var _transformers_legacyLogicalProperties__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./transformers/legacyLogicalProperties */ "./node_modules/@ant-design/cssinjs/es/transformers/legacyLogicalProperties.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/contentQuotesLinter.js":
|
|
|
/*!****************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/contentQuotesLinter.js ***!
|
|
|
\****************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./node_modules/@ant-design/cssinjs/es/linters/utils.js");
|
|
|
|
|
|
|
|
|
var linter = function linter(key, value, info) {
|
|
|
if (key === 'content') {
|
|
|
// From emotion: https://github.com/emotion-js/emotion/blob/main/packages/serialize/src/index.js#L63
|
|
|
var contentValuePattern = /(attr|counters?|url|(((repeating-)?(linear|radial))|conic)-gradient)\(|(no-)?(open|close)-quote/;
|
|
|
var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];
|
|
|
|
|
|
if (typeof value !== 'string' || contentValues.indexOf(value) === -1 && !contentValuePattern.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '"' && value.charAt(0) !== "'")) {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("You seem to be using a value for 'content' without quotes, try replacing it with `content: '\"".concat(value, "\"'`."), info);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (linter);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/hashedAnimationLinter.js":
|
|
|
/*!******************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/hashedAnimationLinter.js ***!
|
|
|
\******************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./node_modules/@ant-design/cssinjs/es/linters/utils.js");
|
|
|
|
|
|
|
|
|
var linter = function linter(key, value, info) {
|
|
|
if (key === 'animation') {
|
|
|
if (info.hashId && value !== 'none') {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("You seem to be using hashed animation '".concat(value, "', in which case 'animationName' with Keyframe as value is recommended."), info);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (linter);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/index.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/index.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "contentQuotesLinter": () => (/* reexport safe */ _contentQuotesLinter__WEBPACK_IMPORTED_MODULE_0__["default"]),
|
|
|
/* harmony export */ "hashedAnimationLinter": () => (/* reexport safe */ _hashedAnimationLinter__WEBPACK_IMPORTED_MODULE_1__["default"]),
|
|
|
/* harmony export */ "legacyNotSelectorLinter": () => (/* reexport safe */ _legacyNotSelectorLinter__WEBPACK_IMPORTED_MODULE_2__["default"]),
|
|
|
/* harmony export */ "logicalPropertiesLinter": () => (/* reexport safe */ _logicalPropertiesLinter__WEBPACK_IMPORTED_MODULE_3__["default"]),
|
|
|
/* harmony export */ "parentSelectorLinter": () => (/* reexport safe */ _parentSelectorLinter__WEBPACK_IMPORTED_MODULE_4__["default"])
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _contentQuotesLinter__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./contentQuotesLinter */ "./node_modules/@ant-design/cssinjs/es/linters/contentQuotesLinter.js");
|
|
|
/* harmony import */ var _hashedAnimationLinter__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./hashedAnimationLinter */ "./node_modules/@ant-design/cssinjs/es/linters/hashedAnimationLinter.js");
|
|
|
/* harmony import */ var _legacyNotSelectorLinter__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./legacyNotSelectorLinter */ "./node_modules/@ant-design/cssinjs/es/linters/legacyNotSelectorLinter.js");
|
|
|
/* harmony import */ var _logicalPropertiesLinter__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./logicalPropertiesLinter */ "./node_modules/@ant-design/cssinjs/es/linters/logicalPropertiesLinter.js");
|
|
|
/* harmony import */ var _parentSelectorLinter__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./parentSelectorLinter */ "./node_modules/@ant-design/cssinjs/es/linters/parentSelectorLinter.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/legacyNotSelectorLinter.js":
|
|
|
/*!********************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/legacyNotSelectorLinter.js ***!
|
|
|
\********************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./node_modules/@ant-design/cssinjs/es/linters/utils.js");
|
|
|
|
|
|
|
|
|
function isConcatSelector(selector) {
|
|
|
var _selector$match;
|
|
|
|
|
|
var notContent = ((_selector$match = selector.match(/:not\(([^)]*)\)/)) === null || _selector$match === void 0 ? void 0 : _selector$match[1]) || ''; // split selector. e.g.
|
|
|
// `h1#a.b` => ['h1', #a', '.b']
|
|
|
|
|
|
var splitCells = notContent.split(/(\[[^[]*])|(?=[.#])/).filter(function (str) {
|
|
|
return str;
|
|
|
});
|
|
|
return splitCells.length > 1;
|
|
|
}
|
|
|
|
|
|
function parsePath(info) {
|
|
|
return info.parentSelectors.reduce(function (prev, cur) {
|
|
|
if (!prev) {
|
|
|
return cur;
|
|
|
}
|
|
|
|
|
|
return cur.includes('&') ? cur.replace(/&/g, prev) : "".concat(prev, " ").concat(cur);
|
|
|
}, '');
|
|
|
}
|
|
|
|
|
|
var linter = function linter(key, value, info) {
|
|
|
var parentSelectorPath = parsePath(info);
|
|
|
var notList = parentSelectorPath.match(/:not\([^)]*\)/g) || [];
|
|
|
|
|
|
if (notList.length > 0 && notList.some(isConcatSelector)) {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("Concat ':not' selector not support in legacy browsers.", info);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (linter);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/logicalPropertiesLinter.js":
|
|
|
/*!********************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/logicalPropertiesLinter.js ***!
|
|
|
\********************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./node_modules/@ant-design/cssinjs/es/linters/utils.js");
|
|
|
|
|
|
|
|
|
var linter = function linter(key, value, info) {
|
|
|
switch (key) {
|
|
|
case 'marginLeft':
|
|
|
case 'marginRight':
|
|
|
case 'paddingLeft':
|
|
|
case 'paddingRight':
|
|
|
case 'left':
|
|
|
case 'right':
|
|
|
case 'borderLeft':
|
|
|
case 'borderLeftWidth':
|
|
|
case 'borderLeftStyle':
|
|
|
case 'borderLeftColor':
|
|
|
case 'borderRight':
|
|
|
case 'borderRightWidth':
|
|
|
case 'borderRightStyle':
|
|
|
case 'borderRightColor':
|
|
|
case 'borderTopLeftRadius':
|
|
|
case 'borderTopRightRadius':
|
|
|
case 'borderBottomLeftRadius':
|
|
|
case 'borderBottomRightRadius':
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("You seem to be using non-logical property '".concat(key, "' which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), info);
|
|
|
return;
|
|
|
|
|
|
case 'margin':
|
|
|
case 'padding':
|
|
|
case 'borderWidth':
|
|
|
case 'borderStyle':
|
|
|
// case 'borderColor':
|
|
|
if (typeof value === 'string') {
|
|
|
var valueArr = value.split(' ').map(function (item) {
|
|
|
return item.trim();
|
|
|
});
|
|
|
|
|
|
if (valueArr.length === 4 && valueArr[1] !== valueArr[3]) {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("You seem to be using '".concat(key, "' property with different left ").concat(key, " and right ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), info);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
|
|
|
case 'clear':
|
|
|
case 'textAlign':
|
|
|
if (value === 'left' || value === 'right') {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("You seem to be using non-logical value '".concat(value, "' of ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), info);
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
|
|
|
case 'borderRadius':
|
|
|
if (typeof value === 'string') {
|
|
|
var radiusGroups = value.split('/').map(function (item) {
|
|
|
return item.trim();
|
|
|
});
|
|
|
var invalid = radiusGroups.reduce(function (result, group) {
|
|
|
if (result) {
|
|
|
return result;
|
|
|
}
|
|
|
|
|
|
var radiusArr = group.split(' ').map(function (item) {
|
|
|
return item.trim();
|
|
|
}); // borderRadius: '2px 4px'
|
|
|
|
|
|
if (radiusArr.length >= 2 && radiusArr[0] !== radiusArr[1]) {
|
|
|
return true;
|
|
|
} // borderRadius: '4px 4px 2px'
|
|
|
|
|
|
|
|
|
if (radiusArr.length === 3 && radiusArr[1] !== radiusArr[2]) {
|
|
|
return true;
|
|
|
} // borderRadius: '4px 4px 2px 4px'
|
|
|
|
|
|
|
|
|
if (radiusArr.length === 4 && radiusArr[2] !== radiusArr[3]) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return result;
|
|
|
}, false);
|
|
|
|
|
|
if (invalid) {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)("You seem to be using non-logical value '".concat(value, "' of ").concat(key, ", which is not compatible with RTL mode. Please use logical properties and values instead. For more information: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Logical_Properties."), info);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
|
|
|
default:
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (linter);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/parentSelectorLinter.js":
|
|
|
/*!*****************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/parentSelectorLinter.js ***!
|
|
|
\*****************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./utils */ "./node_modules/@ant-design/cssinjs/es/linters/utils.js");
|
|
|
|
|
|
|
|
|
var linter = function linter(key, value, info) {
|
|
|
if (info.parentSelectors.some(function (selector) {
|
|
|
var selectors = selector.split(',');
|
|
|
return selectors.some(function (item) {
|
|
|
return item.split('&').length > 2;
|
|
|
});
|
|
|
})) {
|
|
|
(0,_utils__WEBPACK_IMPORTED_MODULE_0__.lintWarning)('Should not use more than one `&` in a selector.', info);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (linter);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/linters/utils.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/linters/utils.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "lintWarning": () => (/* binding */ lintWarning)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
|
|
|
function lintWarning(message, info) {
|
|
|
var path = info.path,
|
|
|
parentSelectors = info.parentSelectors;
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_0__["default"])(false, "[Ant Design CSS-in-JS] ".concat(path ? "Error in ".concat(path, ": ") : '').concat(message).concat(parentSelectors.length ? " Selector: ".concat(parentSelectors.join(' | ')) : ''));
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/theme/Theme.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/theme/Theme.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ Theme)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__ = __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_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var uuid = 0;
|
|
|
/**
|
|
|
* Theme with algorithms to derive tokens from design tokens.
|
|
|
* Use `createTheme` first which will help to manage the theme instance cache.
|
|
|
*/
|
|
|
|
|
|
var Theme = /*#__PURE__*/function () {
|
|
|
function Theme(derivatives) {
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__["default"])(this, Theme);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])(this, "derivatives", void 0);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])(this, "id", void 0);
|
|
|
|
|
|
this.derivatives = Array.isArray(derivatives) ? derivatives : [derivatives];
|
|
|
this.id = uuid;
|
|
|
|
|
|
if (derivatives.length === 0) {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_3__.warning)(derivatives.length > 0, '[Ant Design CSS-in-JS] Theme should have at least one derivative function.');
|
|
|
}
|
|
|
|
|
|
uuid += 1;
|
|
|
}
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_1__["default"])(Theme, [{
|
|
|
key: "getDerivativeToken",
|
|
|
value: function getDerivativeToken(token) {
|
|
|
return this.derivatives.reduce(function (result, derivative) {
|
|
|
return derivative(token, result);
|
|
|
}, undefined);
|
|
|
}
|
|
|
}]);
|
|
|
|
|
|
return Theme;
|
|
|
}();
|
|
|
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/theme/ThemeCache.js":
|
|
|
/*!*****************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/theme/ThemeCache.js ***!
|
|
|
\*****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ ThemeCache),
|
|
|
/* harmony export */ "sameDerivativeOption": () => (/* binding */ sameDerivativeOption)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_1__ = __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_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// ================================== Cache ==================================
|
|
|
function sameDerivativeOption(left, right) {
|
|
|
if (left.length !== right.length) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
for (var i = 0; i < left.length; i++) {
|
|
|
if (left[i] !== right[i]) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
var ThemeCache = /*#__PURE__*/function () {
|
|
|
function ThemeCache() {
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_1__["default"])(this, ThemeCache);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_3__["default"])(this, "cache", void 0);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_3__["default"])(this, "keys", void 0);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_3__["default"])(this, "cacheCallTimes", void 0);
|
|
|
|
|
|
this.cache = new Map();
|
|
|
this.keys = [];
|
|
|
this.cacheCallTimes = 0;
|
|
|
}
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_2__["default"])(ThemeCache, [{
|
|
|
key: "size",
|
|
|
value: function size() {
|
|
|
return this.keys.length;
|
|
|
}
|
|
|
}, {
|
|
|
key: "internalGet",
|
|
|
value: function internalGet(derivativeOption) {
|
|
|
var _cache2, _cache3;
|
|
|
|
|
|
var updateCallTimes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
|
var cache = {
|
|
|
map: this.cache
|
|
|
};
|
|
|
derivativeOption.forEach(function (derivative) {
|
|
|
if (!cache) {
|
|
|
cache = undefined;
|
|
|
} else {
|
|
|
var _cache, _cache$map;
|
|
|
|
|
|
cache = (_cache = cache) === null || _cache === void 0 ? void 0 : (_cache$map = _cache.map) === null || _cache$map === void 0 ? void 0 : _cache$map.get(derivative);
|
|
|
}
|
|
|
});
|
|
|
|
|
|
if ((_cache2 = cache) !== null && _cache2 !== void 0 && _cache2.value && updateCallTimes) {
|
|
|
cache.value[1] = this.cacheCallTimes++;
|
|
|
}
|
|
|
|
|
|
return (_cache3 = cache) === null || _cache3 === void 0 ? void 0 : _cache3.value;
|
|
|
}
|
|
|
}, {
|
|
|
key: "get",
|
|
|
value: function get(derivativeOption) {
|
|
|
var _this$internalGet;
|
|
|
|
|
|
return (_this$internalGet = this.internalGet(derivativeOption, true)) === null || _this$internalGet === void 0 ? void 0 : _this$internalGet[0];
|
|
|
}
|
|
|
}, {
|
|
|
key: "has",
|
|
|
value: function has(derivativeOption) {
|
|
|
return !!this.internalGet(derivativeOption);
|
|
|
}
|
|
|
}, {
|
|
|
key: "set",
|
|
|
value: function set(derivativeOption, value) {
|
|
|
var _this = this;
|
|
|
|
|
|
// New cache
|
|
|
if (!this.has(derivativeOption)) {
|
|
|
if (this.size() + 1 > ThemeCache.MAX_CACHE_SIZE + ThemeCache.MAX_CACHE_OFFSET) {
|
|
|
var _this$keys$reduce = this.keys.reduce(function (result, key) {
|
|
|
var _result = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(result, 2),
|
|
|
callTimes = _result[1];
|
|
|
|
|
|
if (_this.internalGet(key)[1] < callTimes) {
|
|
|
return [key, _this.internalGet(key)[1]];
|
|
|
}
|
|
|
|
|
|
return result;
|
|
|
}, [this.keys[0], this.cacheCallTimes]),
|
|
|
_this$keys$reduce2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_this$keys$reduce, 1),
|
|
|
targetKey = _this$keys$reduce2[0];
|
|
|
|
|
|
this.delete(targetKey);
|
|
|
}
|
|
|
|
|
|
this.keys.push(derivativeOption);
|
|
|
}
|
|
|
|
|
|
var cache = this.cache;
|
|
|
derivativeOption.forEach(function (derivative, index) {
|
|
|
if (index === derivativeOption.length - 1) {
|
|
|
cache.set(derivative, {
|
|
|
value: [value, _this.cacheCallTimes++]
|
|
|
});
|
|
|
} else {
|
|
|
var cacheValue = cache.get(derivative);
|
|
|
|
|
|
if (!cacheValue) {
|
|
|
cache.set(derivative, {
|
|
|
map: new Map()
|
|
|
});
|
|
|
} else if (!cacheValue.map) {
|
|
|
cacheValue.map = new Map();
|
|
|
}
|
|
|
|
|
|
cache = cache.get(derivative).map;
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
}, {
|
|
|
key: "deleteByPath",
|
|
|
value: function deleteByPath(currentCache, derivatives) {
|
|
|
var cache = currentCache.get(derivatives[0]);
|
|
|
|
|
|
if (derivatives.length === 1) {
|
|
|
var _cache$value;
|
|
|
|
|
|
if (!cache.map) {
|
|
|
currentCache.delete(derivatives[0]);
|
|
|
} else {
|
|
|
currentCache.set(derivatives[0], {
|
|
|
map: cache.map
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return (_cache$value = cache.value) === null || _cache$value === void 0 ? void 0 : _cache$value[0];
|
|
|
}
|
|
|
|
|
|
var result = this.deleteByPath(cache.map, derivatives.slice(1));
|
|
|
|
|
|
if ((!cache.map || cache.map.size === 0) && !cache.value) {
|
|
|
currentCache.delete(derivatives[0]);
|
|
|
}
|
|
|
|
|
|
return result;
|
|
|
}
|
|
|
}, {
|
|
|
key: "delete",
|
|
|
value: function _delete(derivativeOption) {
|
|
|
// If cache exists
|
|
|
if (this.has(derivativeOption)) {
|
|
|
this.keys = this.keys.filter(function (item) {
|
|
|
return !sameDerivativeOption(item, derivativeOption);
|
|
|
});
|
|
|
return this.deleteByPath(this.cache, derivativeOption);
|
|
|
}
|
|
|
|
|
|
return undefined;
|
|
|
}
|
|
|
}]);
|
|
|
|
|
|
return ThemeCache;
|
|
|
}();
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_3__["default"])(ThemeCache, "MAX_CACHE_SIZE", 20);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_3__["default"])(ThemeCache, "MAX_CACHE_OFFSET", 5);
|
|
|
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/theme/createTheme.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/theme/createTheme.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ createTheme)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _ThemeCache__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ThemeCache */ "./node_modules/@ant-design/cssinjs/es/theme/ThemeCache.js");
|
|
|
/* harmony import */ var _Theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Theme */ "./node_modules/@ant-design/cssinjs/es/theme/Theme.js");
|
|
|
|
|
|
|
|
|
var cacheThemes = new _ThemeCache__WEBPACK_IMPORTED_MODULE_0__["default"]();
|
|
|
/**
|
|
|
* Same as new Theme, but will always return same one if `derivative` not changed.
|
|
|
*/
|
|
|
|
|
|
function createTheme(derivatives) {
|
|
|
var derivativeArr = Array.isArray(derivatives) ? derivatives : [derivatives]; // Create new theme if not exist
|
|
|
|
|
|
if (!cacheThemes.has(derivativeArr)) {
|
|
|
cacheThemes.set(derivativeArr, new _Theme__WEBPACK_IMPORTED_MODULE_1__["default"](derivativeArr));
|
|
|
} // Get theme from cache and return
|
|
|
|
|
|
|
|
|
return cacheThemes.get(derivativeArr);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/theme/index.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/theme/index.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "Theme": () => (/* reexport safe */ _Theme__WEBPACK_IMPORTED_MODULE_1__["default"]),
|
|
|
/* harmony export */ "ThemeCache": () => (/* reexport safe */ _ThemeCache__WEBPACK_IMPORTED_MODULE_2__["default"]),
|
|
|
/* harmony export */ "createTheme": () => (/* reexport safe */ _createTheme__WEBPACK_IMPORTED_MODULE_0__["default"])
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _createTheme__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./createTheme */ "./node_modules/@ant-design/cssinjs/es/theme/createTheme.js");
|
|
|
/* harmony import */ var _Theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Theme */ "./node_modules/@ant-design/cssinjs/es/theme/Theme.js");
|
|
|
/* harmony import */ var _ThemeCache__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./ThemeCache */ "./node_modules/@ant-design/cssinjs/es/theme/ThemeCache.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/transformers/legacyLogicalProperties.js":
|
|
|
/*!*************************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/transformers/legacyLogicalProperties.js ***!
|
|
|
\*************************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
function splitValues(value) {
|
|
|
if (typeof value === 'number') {
|
|
|
return [value];
|
|
|
}
|
|
|
|
|
|
var splitStyle = String(value).split(/\s+/); // Combine styles split in brackets, like `calc(1px + 2px)`
|
|
|
|
|
|
var temp = '';
|
|
|
var brackets = 0;
|
|
|
return splitStyle.reduce(function (list, item) {
|
|
|
if (item.includes('(')) {
|
|
|
temp += item;
|
|
|
brackets += item.split('(').length - 1;
|
|
|
} else if (item.includes(')')) {
|
|
|
temp += item;
|
|
|
brackets -= item.split(')').length - 1;
|
|
|
|
|
|
if (brackets === 0) {
|
|
|
list.push(temp);
|
|
|
temp = '';
|
|
|
}
|
|
|
} else if (brackets > 0) {
|
|
|
temp += item;
|
|
|
} else {
|
|
|
list.push(item);
|
|
|
}
|
|
|
|
|
|
return list;
|
|
|
}, []);
|
|
|
}
|
|
|
|
|
|
function noSplit(list) {
|
|
|
list.notSplit = true;
|
|
|
return list;
|
|
|
}
|
|
|
|
|
|
var keyMap = {
|
|
|
// Inset
|
|
|
inset: ['top', 'right', 'bottom', 'left'],
|
|
|
insetBlock: ['top', 'bottom'],
|
|
|
insetBlockStart: ['top'],
|
|
|
insetBlockEnd: ['bottom'],
|
|
|
insetInline: ['left', 'right'],
|
|
|
insetInlineStart: ['left'],
|
|
|
insetInlineEnd: ['right'],
|
|
|
// Margin
|
|
|
marginBlock: ['marginTop', 'marginBottom'],
|
|
|
marginBlockStart: ['marginTop'],
|
|
|
marginBlockEnd: ['marginBottom'],
|
|
|
marginInline: ['marginLeft', 'marginRight'],
|
|
|
marginInlineStart: ['marginLeft'],
|
|
|
marginInlineEnd: ['marginRight'],
|
|
|
// Padding
|
|
|
paddingBlock: ['paddingTop', 'paddingBottom'],
|
|
|
paddingBlockStart: ['paddingTop'],
|
|
|
paddingBlockEnd: ['paddingBottom'],
|
|
|
paddingInline: ['paddingLeft', 'paddingRight'],
|
|
|
paddingInlineStart: ['paddingLeft'],
|
|
|
paddingInlineEnd: ['paddingRight'],
|
|
|
// Border
|
|
|
borderBlock: noSplit(['borderTop', 'borderBottom']),
|
|
|
borderBlockStart: noSplit(['borderTop']),
|
|
|
borderBlockEnd: noSplit(['borderBottom']),
|
|
|
borderInline: noSplit(['borderLeft', 'borderRight']),
|
|
|
borderInlineStart: noSplit(['borderLeft']),
|
|
|
borderInlineEnd: noSplit(['borderRight']),
|
|
|
// Border width
|
|
|
borderBlockWidth: ['borderTopWidth', 'borderBottomWidth'],
|
|
|
borderBlockStartWidth: ['borderTopWidth'],
|
|
|
borderBlockEndWidth: ['borderBottomWidth'],
|
|
|
borderInlineWidth: ['borderLeftWidth', 'borderRightWidth'],
|
|
|
borderInlineStartWidth: ['borderLeftWidth'],
|
|
|
borderInlineEndWidth: ['borderRightWidth'],
|
|
|
// Border style
|
|
|
borderBlockStyle: ['borderTopStyle', 'borderBottomStyle'],
|
|
|
borderBlockStartStyle: ['borderTopStyle'],
|
|
|
borderBlockEndStyle: ['borderBottomStyle'],
|
|
|
borderInlineStyle: ['borderLeftStyle', 'borderRightStyle'],
|
|
|
borderInlineStartStyle: ['borderLeftStyle'],
|
|
|
borderInlineEndStyle: ['borderRightStyle'],
|
|
|
// Border color
|
|
|
borderBlockColor: ['borderTopColor', 'borderBottomColor'],
|
|
|
borderBlockStartColor: ['borderTopColor'],
|
|
|
borderBlockEndColor: ['borderBottomColor'],
|
|
|
borderInlineColor: ['borderLeftColor', 'borderRightColor'],
|
|
|
borderInlineStartColor: ['borderLeftColor'],
|
|
|
borderInlineEndColor: ['borderRightColor'],
|
|
|
// Border radius
|
|
|
borderStartStartRadius: ['borderTopLeftRadius'],
|
|
|
borderStartEndRadius: ['borderTopRightRadius'],
|
|
|
borderEndStartRadius: ['borderBottomLeftRadius'],
|
|
|
borderEndEndRadius: ['borderBottomRightRadius']
|
|
|
};
|
|
|
|
|
|
function skipCheck(value) {
|
|
|
return {
|
|
|
_skip_check_: true,
|
|
|
value: value
|
|
|
};
|
|
|
}
|
|
|
/**
|
|
|
* Convert css logical properties to legacy properties.
|
|
|
* Such as: `margin-block-start` to `margin-top`.
|
|
|
* Transform list:
|
|
|
* - inset
|
|
|
* - margin
|
|
|
* - padding
|
|
|
* - border
|
|
|
*/
|
|
|
|
|
|
|
|
|
var transform = {
|
|
|
visit: function visit(cssObj) {
|
|
|
var clone = {};
|
|
|
Object.keys(cssObj).forEach(function (key) {
|
|
|
var value = cssObj[key];
|
|
|
var matchValue = keyMap[key];
|
|
|
|
|
|
if (matchValue && (typeof value === 'number' || typeof value === 'string')) {
|
|
|
var values = splitValues(value);
|
|
|
|
|
|
if (matchValue.length && matchValue.notSplit) {
|
|
|
// not split means always give same value like border
|
|
|
matchValue.forEach(function (matchKey) {
|
|
|
clone[matchKey] = skipCheck(value);
|
|
|
});
|
|
|
} else if (matchValue.length === 1) {
|
|
|
// Handle like `marginBlockStart` => `marginTop`
|
|
|
clone[matchValue[0]] = skipCheck(value);
|
|
|
} else if (matchValue.length === 2) {
|
|
|
// Handle like `marginBlock` => `marginTop` & `marginBottom`
|
|
|
matchValue.forEach(function (matchKey, index) {
|
|
|
var _values$index;
|
|
|
|
|
|
clone[matchKey] = skipCheck((_values$index = values[index]) !== null && _values$index !== void 0 ? _values$index : values[0]);
|
|
|
});
|
|
|
} else if (matchValue.length === 4) {
|
|
|
// Handle like `inset` => `top` & `right` & `bottom` & `left`
|
|
|
matchValue.forEach(function (matchKey, index) {
|
|
|
var _ref, _values$index2;
|
|
|
|
|
|
clone[matchKey] = skipCheck((_ref = (_values$index2 = values[index]) !== null && _values$index2 !== void 0 ? _values$index2 : values[index - 2]) !== null && _ref !== void 0 ? _ref : values[0]);
|
|
|
});
|
|
|
} else {
|
|
|
clone[key] = value;
|
|
|
}
|
|
|
} else {
|
|
|
clone[key] = value;
|
|
|
}
|
|
|
});
|
|
|
return clone;
|
|
|
}
|
|
|
};
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (transform);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/cssinjs/es/util.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/cssinjs/es/util.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "flattenToken": () => (/* binding */ flattenToken),
|
|
|
/* harmony export */ "supportLayer": () => (/* binding */ supportLayer),
|
|
|
/* harmony export */ "token2key": () => (/* binding */ token2key)
|
|
|
/* harmony export */ });
|
|
|
/* 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 _emotion_hash__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @emotion/hash */ "./node_modules/@emotion/hash/dist/hash.browser.esm.js");
|
|
|
/* harmony import */ var rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! rc-util/es/Dom/canUseDom */ "./node_modules/rc-util/es/Dom/canUseDom.js");
|
|
|
/* harmony import */ var rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/es/Dom/dynamicCSS */ "./node_modules/rc-util/es/Dom/dynamicCSS.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function flattenToken(token) {
|
|
|
var str = '';
|
|
|
Object.keys(token).forEach(function (key) {
|
|
|
var value = token[key];
|
|
|
str += key;
|
|
|
|
|
|
if (value && (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(value) === 'object') {
|
|
|
str += flattenToken(value);
|
|
|
} else {
|
|
|
str += value;
|
|
|
}
|
|
|
});
|
|
|
return str;
|
|
|
}
|
|
|
/**
|
|
|
* Convert derivative token to key string
|
|
|
*/
|
|
|
|
|
|
function token2key(token, salt) {
|
|
|
return (0,_emotion_hash__WEBPACK_IMPORTED_MODULE_1__["default"])("".concat(salt, "_").concat(flattenToken(token)));
|
|
|
}
|
|
|
var layerKey = "layer-".concat(Date.now(), "-").concat(Math.random()).replace(/\./g, '');
|
|
|
var layerWidth = '903px';
|
|
|
|
|
|
function supportSelector(styleStr, handleElement) {
|
|
|
if ((0,rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_2__["default"])()) {
|
|
|
var _ele$parentNode;
|
|
|
|
|
|
(0,rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_3__.updateCSS)(styleStr, layerKey);
|
|
|
|
|
|
var _ele = document.createElement('div');
|
|
|
|
|
|
_ele.style.position = 'fixed';
|
|
|
_ele.style.left = '0';
|
|
|
_ele.style.top = '0';
|
|
|
handleElement === null || handleElement === void 0 ? void 0 : handleElement(_ele);
|
|
|
document.body.appendChild(_ele);
|
|
|
|
|
|
if (true) {
|
|
|
_ele.innerHTML = 'Test';
|
|
|
_ele.style.zIndex = '9999999';
|
|
|
}
|
|
|
|
|
|
var support = getComputedStyle(_ele).width === layerWidth;
|
|
|
(_ele$parentNode = _ele.parentNode) === null || _ele$parentNode === void 0 ? void 0 : _ele$parentNode.removeChild(_ele);
|
|
|
(0,rc_util_es_Dom_dynamicCSS__WEBPACK_IMPORTED_MODULE_3__.removeCSS)(layerKey);
|
|
|
return support;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var canLayer = undefined;
|
|
|
function supportLayer() {
|
|
|
if (canLayer === undefined) {
|
|
|
canLayer = supportSelector("@layer ".concat(layerKey, " { .").concat(layerKey, " { width: ").concat(layerWidth, "!important; } }"), function (ele) {
|
|
|
ele.className = layerKey;
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return canLayer;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons-svg/lib/asn/LoadingOutlined.js":
|
|
|
/*!***********************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons-svg/lib/asn/LoadingOutlined.js ***!
|
|
|
\***********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
// This icon file is generated automatically.
|
|
|
Object.defineProperty(exports, "__esModule", ({ value: true }));
|
|
|
var LoadingOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "0 0 1024 1024", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z" } }] }, "name": "loading", "theme": "outlined" };
|
|
|
exports["default"] = LoadingOutlined;
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/LoadingOutlined.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/LoadingOutlined.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
|
|
|
var _LoadingOutlined = _interopRequireDefault(__webpack_require__(/*! ./lib/icons/LoadingOutlined */ "./node_modules/@ant-design/icons/lib/icons/LoadingOutlined.js"));
|
|
|
|
|
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
|
|
|
|
|
|
var _default = _LoadingOutlined;
|
|
|
exports["default"] = _default;
|
|
|
module.exports = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/lib/components/AntdIcon.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/lib/components/AntdIcon.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");
|
|
|
var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js");
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "./node_modules/@babel/runtime/helpers/slicedToArray.js"));
|
|
|
var _defineProperty2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/defineProperty */ "./node_modules/@babel/runtime/helpers/defineProperty.js"));
|
|
|
var _objectWithoutProperties2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/objectWithoutProperties.js"));
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"));
|
|
|
var _Context = _interopRequireDefault(__webpack_require__(/*! ./Context */ "./node_modules/@ant-design/icons/lib/components/Context.js"));
|
|
|
var _IconBase = _interopRequireDefault(__webpack_require__(/*! ./IconBase */ "./node_modules/@ant-design/icons/lib/components/IconBase.js"));
|
|
|
var _twoTonePrimaryColor = __webpack_require__(/*! ./twoTonePrimaryColor */ "./node_modules/@ant-design/icons/lib/components/twoTonePrimaryColor.js");
|
|
|
var _utils = __webpack_require__(/*! ../utils */ "./node_modules/@ant-design/icons/lib/utils.js");
|
|
|
var _excluded = ["className", "icon", "spin", "rotate", "tabIndex", "onClick", "twoToneColor"];
|
|
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
|
// Initial setting
|
|
|
// should move it to antd main repo?
|
|
|
(0, _twoTonePrimaryColor.setTwoToneColor)('#1890ff');
|
|
|
var Icon = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
var _classNames;
|
|
|
var className = props.className,
|
|
|
icon = props.icon,
|
|
|
spin = props.spin,
|
|
|
rotate = props.rotate,
|
|
|
tabIndex = props.tabIndex,
|
|
|
onClick = props.onClick,
|
|
|
twoToneColor = props.twoToneColor,
|
|
|
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
|
var _React$useContext = React.useContext(_Context.default),
|
|
|
_React$useContext$pre = _React$useContext.prefixCls,
|
|
|
prefixCls = _React$useContext$pre === void 0 ? 'anticon' : _React$useContext$pre,
|
|
|
rootClassName = _React$useContext.rootClassName;
|
|
|
var classString = (0, _classnames.default)(rootClassName, prefixCls, (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-").concat(icon.name), !!icon.name), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-spin"), !!spin || icon.name === 'loading'), _classNames), className);
|
|
|
var iconTabIndex = tabIndex;
|
|
|
if (iconTabIndex === undefined && onClick) {
|
|
|
iconTabIndex = -1;
|
|
|
}
|
|
|
var svgStyle = rotate ? {
|
|
|
msTransform: "rotate(".concat(rotate, "deg)"),
|
|
|
transform: "rotate(".concat(rotate, "deg)")
|
|
|
} : undefined;
|
|
|
var _normalizeTwoToneColo = (0, _utils.normalizeTwoToneColors)(twoToneColor),
|
|
|
_normalizeTwoToneColo2 = (0, _slicedToArray2.default)(_normalizeTwoToneColo, 2),
|
|
|
primaryColor = _normalizeTwoToneColo2[0],
|
|
|
secondaryColor = _normalizeTwoToneColo2[1];
|
|
|
return /*#__PURE__*/React.createElement("span", (0, _objectSpread2.default)((0, _objectSpread2.default)({
|
|
|
role: "img",
|
|
|
"aria-label": icon.name
|
|
|
}, restProps), {}, {
|
|
|
ref: ref,
|
|
|
tabIndex: iconTabIndex,
|
|
|
onClick: onClick,
|
|
|
className: classString
|
|
|
}), /*#__PURE__*/React.createElement(_IconBase.default, {
|
|
|
icon: icon,
|
|
|
primaryColor: primaryColor,
|
|
|
secondaryColor: secondaryColor,
|
|
|
style: svgStyle
|
|
|
}));
|
|
|
});
|
|
|
Icon.displayName = 'AntdIcon';
|
|
|
Icon.getTwoToneColor = _twoTonePrimaryColor.getTwoToneColor;
|
|
|
Icon.setTwoToneColor = _twoTonePrimaryColor.setTwoToneColor;
|
|
|
var _default = Icon;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/lib/components/Context.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/lib/components/Context.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _react = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
var IconContext = /*#__PURE__*/(0, _react.createContext)({});
|
|
|
var _default = IconContext;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/lib/components/IconBase.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/lib/components/IconBase.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _objectWithoutProperties2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/objectWithoutProperties.js"));
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var _utils = __webpack_require__(/*! ../utils */ "./node_modules/@ant-design/icons/lib/utils.js");
|
|
|
var _excluded = ["icon", "className", "onClick", "style", "primaryColor", "secondaryColor"];
|
|
|
var twoToneColorPalette = {
|
|
|
primaryColor: '#333',
|
|
|
secondaryColor: '#E6E6E6',
|
|
|
calculated: false
|
|
|
};
|
|
|
function setTwoToneColors(_ref) {
|
|
|
var primaryColor = _ref.primaryColor,
|
|
|
secondaryColor = _ref.secondaryColor;
|
|
|
twoToneColorPalette.primaryColor = primaryColor;
|
|
|
twoToneColorPalette.secondaryColor = secondaryColor || (0, _utils.getSecondaryColor)(primaryColor);
|
|
|
twoToneColorPalette.calculated = !!secondaryColor;
|
|
|
}
|
|
|
function getTwoToneColors() {
|
|
|
return (0, _objectSpread2.default)({}, twoToneColorPalette);
|
|
|
}
|
|
|
var IconBase = function IconBase(props) {
|
|
|
var icon = props.icon,
|
|
|
className = props.className,
|
|
|
onClick = props.onClick,
|
|
|
style = props.style,
|
|
|
primaryColor = props.primaryColor,
|
|
|
secondaryColor = props.secondaryColor,
|
|
|
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
|
|
|
var colors = twoToneColorPalette;
|
|
|
if (primaryColor) {
|
|
|
colors = {
|
|
|
primaryColor: primaryColor,
|
|
|
secondaryColor: secondaryColor || (0, _utils.getSecondaryColor)(primaryColor)
|
|
|
};
|
|
|
}
|
|
|
(0, _utils.useInsertStyles)();
|
|
|
(0, _utils.warning)((0, _utils.isIconDefinition)(icon), "icon should be icon definiton, but got ".concat(icon));
|
|
|
if (!(0, _utils.isIconDefinition)(icon)) {
|
|
|
return null;
|
|
|
}
|
|
|
var target = icon;
|
|
|
if (target && typeof target.icon === 'function') {
|
|
|
target = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, target), {}, {
|
|
|
icon: target.icon(colors.primaryColor, colors.secondaryColor)
|
|
|
});
|
|
|
}
|
|
|
return (0, _utils.generate)(target.icon, "svg-".concat(target.name), (0, _objectSpread2.default)({
|
|
|
className: className,
|
|
|
onClick: onClick,
|
|
|
style: style,
|
|
|
'data-icon': target.name,
|
|
|
width: '1em',
|
|
|
height: '1em',
|
|
|
fill: 'currentColor',
|
|
|
'aria-hidden': 'true'
|
|
|
}, restProps));
|
|
|
};
|
|
|
IconBase.displayName = 'IconReact';
|
|
|
IconBase.getTwoToneColors = getTwoToneColors;
|
|
|
IconBase.setTwoToneColors = setTwoToneColors;
|
|
|
var _default = IconBase;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/lib/components/twoTonePrimaryColor.js":
|
|
|
/*!******************************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/lib/components/twoTonePrimaryColor.js ***!
|
|
|
\******************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.getTwoToneColor = getTwoToneColor;
|
|
|
exports.setTwoToneColor = setTwoToneColor;
|
|
|
var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "./node_modules/@babel/runtime/helpers/slicedToArray.js"));
|
|
|
var _IconBase = _interopRequireDefault(__webpack_require__(/*! ./IconBase */ "./node_modules/@ant-design/icons/lib/components/IconBase.js"));
|
|
|
var _utils = __webpack_require__(/*! ../utils */ "./node_modules/@ant-design/icons/lib/utils.js");
|
|
|
function setTwoToneColor(twoToneColor) {
|
|
|
var _normalizeTwoToneColo = (0, _utils.normalizeTwoToneColors)(twoToneColor),
|
|
|
_normalizeTwoToneColo2 = (0, _slicedToArray2.default)(_normalizeTwoToneColo, 2),
|
|
|
primaryColor = _normalizeTwoToneColo2[0],
|
|
|
secondaryColor = _normalizeTwoToneColo2[1];
|
|
|
return _IconBase.default.setTwoToneColors({
|
|
|
primaryColor: primaryColor,
|
|
|
secondaryColor: secondaryColor
|
|
|
});
|
|
|
}
|
|
|
function getTwoToneColor() {
|
|
|
var colors = _IconBase.default.getTwoToneColors();
|
|
|
if (!colors.calculated) {
|
|
|
return colors.primaryColor;
|
|
|
}
|
|
|
return [colors.primaryColor, colors.secondaryColor];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/lib/icons/LoadingOutlined.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/lib/icons/LoadingOutlined.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");
|
|
|
var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js");
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _LoadingOutlined = _interopRequireDefault(__webpack_require__(/*! @ant-design/icons-svg/lib/asn/LoadingOutlined */ "./node_modules/@ant-design/icons-svg/lib/asn/LoadingOutlined.js"));
|
|
|
var _AntdIcon = _interopRequireDefault(__webpack_require__(/*! ../components/AntdIcon */ "./node_modules/@ant-design/icons/lib/components/AntdIcon.js"));
|
|
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
|
// GENERATE BY ./scripts/generate.ts
|
|
|
// DON NOT EDIT IT MANUALLY
|
|
|
|
|
|
var LoadingOutlined = function LoadingOutlined(props, ref) {
|
|
|
return /*#__PURE__*/React.createElement(_AntdIcon.default, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
|
|
|
ref: ref,
|
|
|
icon: _LoadingOutlined.default
|
|
|
}));
|
|
|
};
|
|
|
LoadingOutlined.displayName = 'LoadingOutlined';
|
|
|
var _default = /*#__PURE__*/React.forwardRef(LoadingOutlined);
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ant-design/icons/lib/utils.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/@ant-design/icons/lib/utils.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js");
|
|
|
var _typeof3 = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js");
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.generate = generate;
|
|
|
exports.getSecondaryColor = getSecondaryColor;
|
|
|
exports.iconStyles = void 0;
|
|
|
exports.isIconDefinition = isIconDefinition;
|
|
|
exports.normalizeAttrs = normalizeAttrs;
|
|
|
exports.normalizeTwoToneColors = normalizeTwoToneColors;
|
|
|
exports.useInsertStyles = exports.svgBaseProps = void 0;
|
|
|
exports.warning = warning;
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var _typeof2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js"));
|
|
|
var _colors = __webpack_require__(/*! @ant-design/colors */ "./node_modules/@ant-design/colors/es/index.js");
|
|
|
var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/warning */ "./node_modules/rc-util/lib/warning.js"));
|
|
|
var _dynamicCSS = __webpack_require__(/*! rc-util/lib/Dom/dynamicCSS */ "./node_modules/rc-util/lib/Dom/dynamicCSS.js");
|
|
|
var _Context = _interopRequireDefault(__webpack_require__(/*! ./components/Context */ "./node_modules/@ant-design/icons/lib/components/Context.js"));
|
|
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
|
function warning(valid, message) {
|
|
|
(0, _warning.default)(valid, "[@ant-design/icons] ".concat(message));
|
|
|
}
|
|
|
function isIconDefinition(target) {
|
|
|
return (0, _typeof2.default)(target) === 'object' && typeof target.name === 'string' && typeof target.theme === 'string' && ((0, _typeof2.default)(target.icon) === 'object' || typeof target.icon === 'function');
|
|
|
}
|
|
|
function normalizeAttrs() {
|
|
|
var attrs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
|
return Object.keys(attrs).reduce(function (acc, key) {
|
|
|
var val = attrs[key];
|
|
|
switch (key) {
|
|
|
case 'class':
|
|
|
acc.className = val;
|
|
|
delete acc.class;
|
|
|
break;
|
|
|
default:
|
|
|
acc[key] = val;
|
|
|
}
|
|
|
return acc;
|
|
|
}, {});
|
|
|
}
|
|
|
function generate(node, key, rootProps) {
|
|
|
if (!rootProps) {
|
|
|
return /*#__PURE__*/_react.default.createElement(node.tag, (0, _objectSpread2.default)({
|
|
|
key: key
|
|
|
}, normalizeAttrs(node.attrs)), (node.children || []).map(function (child, index) {
|
|
|
return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index));
|
|
|
}));
|
|
|
}
|
|
|
return /*#__PURE__*/_react.default.createElement(node.tag, (0, _objectSpread2.default)((0, _objectSpread2.default)({
|
|
|
key: key
|
|
|
}, normalizeAttrs(node.attrs)), rootProps), (node.children || []).map(function (child, index) {
|
|
|
return generate(child, "".concat(key, "-").concat(node.tag, "-").concat(index));
|
|
|
}));
|
|
|
}
|
|
|
function getSecondaryColor(primaryColor) {
|
|
|
// choose the second color
|
|
|
return (0, _colors.generate)(primaryColor)[0];
|
|
|
}
|
|
|
function normalizeTwoToneColors(twoToneColor) {
|
|
|
if (!twoToneColor) {
|
|
|
return [];
|
|
|
}
|
|
|
return Array.isArray(twoToneColor) ? twoToneColor : [twoToneColor];
|
|
|
}
|
|
|
// These props make sure that the SVG behaviours like general text.
|
|
|
// Reference: https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4
|
|
|
var svgBaseProps = {
|
|
|
width: '1em',
|
|
|
height: '1em',
|
|
|
fill: 'currentColor',
|
|
|
'aria-hidden': 'true',
|
|
|
focusable: 'false'
|
|
|
};
|
|
|
exports.svgBaseProps = svgBaseProps;
|
|
|
var iconStyles = "\n.anticon {\n display: inline-block;\n color: inherit;\n font-style: normal;\n line-height: 0;\n text-align: center;\n text-transform: none;\n vertical-align: -0.125em;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n.anticon > * {\n line-height: 1;\n}\n\n.anticon svg {\n display: inline-block;\n}\n\n.anticon::before {\n display: none;\n}\n\n.anticon .anticon-icon {\n display: block;\n}\n\n.anticon[tabindex] {\n cursor: pointer;\n}\n\n.anticon-spin::before,\n.anticon-spin {\n display: inline-block;\n -webkit-animation: loadingCircle 1s infinite linear;\n animation: loadingCircle 1s infinite linear;\n}\n\n@-webkit-keyframes loadingCircle {\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n}\n\n@keyframes loadingCircle {\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n}\n";
|
|
|
exports.iconStyles = iconStyles;
|
|
|
var useInsertStyles = function useInsertStyles() {
|
|
|
var styleStr = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : iconStyles;
|
|
|
var _useContext = (0, _react.useContext)(_Context.default),
|
|
|
csp = _useContext.csp,
|
|
|
prefixCls = _useContext.prefixCls;
|
|
|
var mergedStyleStr = styleStr;
|
|
|
if (prefixCls) {
|
|
|
mergedStyleStr = mergedStyleStr.replace(/anticon/g, prefixCls);
|
|
|
}
|
|
|
(0, _react.useEffect)(function () {
|
|
|
(0, _dynamicCSS.updateCSS)(mergedStyleStr, '@ant-design-icons', {
|
|
|
prepend: true,
|
|
|
csp: csp
|
|
|
});
|
|
|
}, []);
|
|
|
};
|
|
|
exports.useInsertStyles = useInsertStyles;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/conversion.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/conversion.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "convertDecimalToHex": () => (/* binding */ convertDecimalToHex),
|
|
|
/* harmony export */ "convertHexToDecimal": () => (/* binding */ convertHexToDecimal),
|
|
|
/* harmony export */ "hslToRgb": () => (/* binding */ hslToRgb),
|
|
|
/* harmony export */ "hsvToRgb": () => (/* binding */ hsvToRgb),
|
|
|
/* harmony export */ "numberInputToObject": () => (/* binding */ numberInputToObject),
|
|
|
/* harmony export */ "parseIntFromHex": () => (/* binding */ parseIntFromHex),
|
|
|
/* harmony export */ "rgbToHex": () => (/* binding */ rgbToHex),
|
|
|
/* harmony export */ "rgbToHsl": () => (/* binding */ rgbToHsl),
|
|
|
/* harmony export */ "rgbToHsv": () => (/* binding */ rgbToHsv),
|
|
|
/* harmony export */ "rgbToRgb": () => (/* binding */ rgbToRgb),
|
|
|
/* harmony export */ "rgbaToArgbHex": () => (/* binding */ rgbaToArgbHex),
|
|
|
/* harmony export */ "rgbaToHex": () => (/* binding */ rgbaToHex)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./util */ "./node_modules/@ctrl/tinycolor/dist/module/util.js");
|
|
|
|
|
|
// `rgbToHsl`, `rgbToHsv`, `hslToRgb`, `hsvToRgb` modified from:
|
|
|
// <http://mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript>
|
|
|
/**
|
|
|
* Handle bounds / percentage checking to conform to CSS color spec
|
|
|
* <http://www.w3.org/TR/css3-color/>
|
|
|
* *Assumes:* r, g, b in [0, 255] or [0, 1]
|
|
|
* *Returns:* { r, g, b } in [0, 255]
|
|
|
*/
|
|
|
function rgbToRgb(r, g, b) {
|
|
|
return {
|
|
|
r: (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(r, 255) * 255,
|
|
|
g: (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(g, 255) * 255,
|
|
|
b: (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(b, 255) * 255,
|
|
|
};
|
|
|
}
|
|
|
/**
|
|
|
* Converts an RGB color value to HSL.
|
|
|
* *Assumes:* r, g, and b are contained in [0, 255] or [0, 1]
|
|
|
* *Returns:* { h, s, l } in [0,1]
|
|
|
*/
|
|
|
function rgbToHsl(r, g, b) {
|
|
|
r = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(r, 255);
|
|
|
g = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(g, 255);
|
|
|
b = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(b, 255);
|
|
|
var max = Math.max(r, g, b);
|
|
|
var min = Math.min(r, g, b);
|
|
|
var h = 0;
|
|
|
var s = 0;
|
|
|
var l = (max + min) / 2;
|
|
|
if (max === min) {
|
|
|
s = 0;
|
|
|
h = 0; // achromatic
|
|
|
}
|
|
|
else {
|
|
|
var d = max - min;
|
|
|
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
|
|
switch (max) {
|
|
|
case r:
|
|
|
h = (g - b) / d + (g < b ? 6 : 0);
|
|
|
break;
|
|
|
case g:
|
|
|
h = (b - r) / d + 2;
|
|
|
break;
|
|
|
case b:
|
|
|
h = (r - g) / d + 4;
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
h /= 6;
|
|
|
}
|
|
|
return { h: h, s: s, l: l };
|
|
|
}
|
|
|
function hue2rgb(p, q, t) {
|
|
|
if (t < 0) {
|
|
|
t += 1;
|
|
|
}
|
|
|
if (t > 1) {
|
|
|
t -= 1;
|
|
|
}
|
|
|
if (t < 1 / 6) {
|
|
|
return p + (q - p) * (6 * t);
|
|
|
}
|
|
|
if (t < 1 / 2) {
|
|
|
return q;
|
|
|
}
|
|
|
if (t < 2 / 3) {
|
|
|
return p + (q - p) * (2 / 3 - t) * 6;
|
|
|
}
|
|
|
return p;
|
|
|
}
|
|
|
/**
|
|
|
* Converts an HSL color value to RGB.
|
|
|
*
|
|
|
* *Assumes:* h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100]
|
|
|
* *Returns:* { r, g, b } in the set [0, 255]
|
|
|
*/
|
|
|
function hslToRgb(h, s, l) {
|
|
|
var r;
|
|
|
var g;
|
|
|
var b;
|
|
|
h = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(h, 360);
|
|
|
s = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(s, 100);
|
|
|
l = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(l, 100);
|
|
|
if (s === 0) {
|
|
|
// achromatic
|
|
|
g = l;
|
|
|
b = l;
|
|
|
r = l;
|
|
|
}
|
|
|
else {
|
|
|
var q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
|
var p = 2 * l - q;
|
|
|
r = hue2rgb(p, q, h + 1 / 3);
|
|
|
g = hue2rgb(p, q, h);
|
|
|
b = hue2rgb(p, q, h - 1 / 3);
|
|
|
}
|
|
|
return { r: r * 255, g: g * 255, b: b * 255 };
|
|
|
}
|
|
|
/**
|
|
|
* Converts an RGB color value to HSV
|
|
|
*
|
|
|
* *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1]
|
|
|
* *Returns:* { h, s, v } in [0,1]
|
|
|
*/
|
|
|
function rgbToHsv(r, g, b) {
|
|
|
r = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(r, 255);
|
|
|
g = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(g, 255);
|
|
|
b = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(b, 255);
|
|
|
var max = Math.max(r, g, b);
|
|
|
var min = Math.min(r, g, b);
|
|
|
var h = 0;
|
|
|
var v = max;
|
|
|
var d = max - min;
|
|
|
var s = max === 0 ? 0 : d / max;
|
|
|
if (max === min) {
|
|
|
h = 0; // achromatic
|
|
|
}
|
|
|
else {
|
|
|
switch (max) {
|
|
|
case r:
|
|
|
h = (g - b) / d + (g < b ? 6 : 0);
|
|
|
break;
|
|
|
case g:
|
|
|
h = (b - r) / d + 2;
|
|
|
break;
|
|
|
case b:
|
|
|
h = (r - g) / d + 4;
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
h /= 6;
|
|
|
}
|
|
|
return { h: h, s: s, v: v };
|
|
|
}
|
|
|
/**
|
|
|
* Converts an HSV color value to RGB.
|
|
|
*
|
|
|
* *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100]
|
|
|
* *Returns:* { r, g, b } in the set [0, 255]
|
|
|
*/
|
|
|
function hsvToRgb(h, s, v) {
|
|
|
h = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(h, 360) * 6;
|
|
|
s = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(s, 100);
|
|
|
v = (0,_util__WEBPACK_IMPORTED_MODULE_0__.bound01)(v, 100);
|
|
|
var i = Math.floor(h);
|
|
|
var f = h - i;
|
|
|
var p = v * (1 - s);
|
|
|
var q = v * (1 - f * s);
|
|
|
var t = v * (1 - (1 - f) * s);
|
|
|
var mod = i % 6;
|
|
|
var r = [v, q, p, p, t, v][mod];
|
|
|
var g = [t, v, v, q, p, p][mod];
|
|
|
var b = [p, p, t, v, v, q][mod];
|
|
|
return { r: r * 255, g: g * 255, b: b * 255 };
|
|
|
}
|
|
|
/**
|
|
|
* Converts an RGB color to hex
|
|
|
*
|
|
|
* Assumes r, g, and b are contained in the set [0, 255]
|
|
|
* Returns a 3 or 6 character hex
|
|
|
*/
|
|
|
function rgbToHex(r, g, b, allow3Char) {
|
|
|
var hex = [
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(r).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(g).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(b).toString(16)),
|
|
|
];
|
|
|
// Return a 3 character hex if possible
|
|
|
if (allow3Char &&
|
|
|
hex[0].startsWith(hex[0].charAt(1)) &&
|
|
|
hex[1].startsWith(hex[1].charAt(1)) &&
|
|
|
hex[2].startsWith(hex[2].charAt(1))) {
|
|
|
return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0);
|
|
|
}
|
|
|
return hex.join('');
|
|
|
}
|
|
|
/**
|
|
|
* Converts an RGBA color plus alpha transparency to hex
|
|
|
*
|
|
|
* Assumes r, g, b are contained in the set [0, 255] and
|
|
|
* a in [0, 1]. Returns a 4 or 8 character rgba hex
|
|
|
*/
|
|
|
// eslint-disable-next-line max-params
|
|
|
function rgbaToHex(r, g, b, a, allow4Char) {
|
|
|
var hex = [
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(r).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(g).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(b).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(convertDecimalToHex(a)),
|
|
|
];
|
|
|
// Return a 4 character hex if possible
|
|
|
if (allow4Char &&
|
|
|
hex[0].startsWith(hex[0].charAt(1)) &&
|
|
|
hex[1].startsWith(hex[1].charAt(1)) &&
|
|
|
hex[2].startsWith(hex[2].charAt(1)) &&
|
|
|
hex[3].startsWith(hex[3].charAt(1))) {
|
|
|
return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0) + hex[3].charAt(0);
|
|
|
}
|
|
|
return hex.join('');
|
|
|
}
|
|
|
/**
|
|
|
* Converts an RGBA color to an ARGB Hex8 string
|
|
|
* Rarely used, but required for "toFilter()"
|
|
|
*/
|
|
|
function rgbaToArgbHex(r, g, b, a) {
|
|
|
var hex = [
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(convertDecimalToHex(a)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(r).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(g).toString(16)),
|
|
|
(0,_util__WEBPACK_IMPORTED_MODULE_0__.pad2)(Math.round(b).toString(16)),
|
|
|
];
|
|
|
return hex.join('');
|
|
|
}
|
|
|
/** Converts a decimal to a hex value */
|
|
|
function convertDecimalToHex(d) {
|
|
|
return Math.round(parseFloat(d) * 255).toString(16);
|
|
|
}
|
|
|
/** Converts a hex value to a decimal */
|
|
|
function convertHexToDecimal(h) {
|
|
|
return parseIntFromHex(h) / 255;
|
|
|
}
|
|
|
/** Parse a base-16 hex value into a base-10 integer */
|
|
|
function parseIntFromHex(val) {
|
|
|
return parseInt(val, 16);
|
|
|
}
|
|
|
function numberInputToObject(color) {
|
|
|
return {
|
|
|
r: color >> 16,
|
|
|
g: (color & 0xff00) >> 8,
|
|
|
b: color & 0xff,
|
|
|
};
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/css-color-names.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/css-color-names.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "names": () => (/* binding */ names)
|
|
|
/* harmony export */ });
|
|
|
// https://github.com/bahamas10/css-color-names/blob/master/css-color-names.json
|
|
|
/**
|
|
|
* @hidden
|
|
|
*/
|
|
|
var names = {
|
|
|
aliceblue: '#f0f8ff',
|
|
|
antiquewhite: '#faebd7',
|
|
|
aqua: '#00ffff',
|
|
|
aquamarine: '#7fffd4',
|
|
|
azure: '#f0ffff',
|
|
|
beige: '#f5f5dc',
|
|
|
bisque: '#ffe4c4',
|
|
|
black: '#000000',
|
|
|
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',
|
|
|
goldenrod: '#daa520',
|
|
|
gold: '#ffd700',
|
|
|
gray: '#808080',
|
|
|
green: '#008000',
|
|
|
greenyellow: '#adff2f',
|
|
|
grey: '#808080',
|
|
|
honeydew: '#f0fff0',
|
|
|
hotpink: '#ff69b4',
|
|
|
indianred: '#cd5c5c',
|
|
|
indigo: '#4b0082',
|
|
|
ivory: '#fffff0',
|
|
|
khaki: '#f0e68c',
|
|
|
lavenderblush: '#fff0f5',
|
|
|
lavender: '#e6e6fa',
|
|
|
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: '#778899',
|
|
|
lightslategrey: '#778899',
|
|
|
lightsteelblue: '#b0c4de',
|
|
|
lightyellow: '#ffffe0',
|
|
|
lime: '#00ff00',
|
|
|
limegreen: '#32cd32',
|
|
|
linen: '#faf0e6',
|
|
|
magenta: '#ff00ff',
|
|
|
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: '#663399',
|
|
|
red: '#ff0000',
|
|
|
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: '#ffffff',
|
|
|
whitesmoke: '#f5f5f5',
|
|
|
yellow: '#ffff00',
|
|
|
yellowgreen: '#9acd32',
|
|
|
};
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/format-input.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/format-input.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "inputToRGB": () => (/* binding */ inputToRGB),
|
|
|
/* harmony export */ "isValidCSSUnit": () => (/* binding */ isValidCSSUnit),
|
|
|
/* harmony export */ "stringInputToObject": () => (/* binding */ stringInputToObject)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _conversion__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./conversion */ "./node_modules/@ctrl/tinycolor/dist/module/conversion.js");
|
|
|
/* harmony import */ var _css_color_names__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./css-color-names */ "./node_modules/@ctrl/tinycolor/dist/module/css-color-names.js");
|
|
|
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./util */ "./node_modules/@ctrl/tinycolor/dist/module/util.js");
|
|
|
/* eslint-disable @typescript-eslint/no-redundant-type-constituents */
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
* Given a string or object, convert that input to RGB
|
|
|
*
|
|
|
* Possible string inputs:
|
|
|
* ```
|
|
|
* "red"
|
|
|
* "#f00" or "f00"
|
|
|
* "#ff0000" or "ff0000"
|
|
|
* "#ff000000" or "ff000000"
|
|
|
* "rgb 255 0 0" or "rgb (255, 0, 0)"
|
|
|
* "rgb 1.0 0 0" or "rgb (1, 0, 0)"
|
|
|
* "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
|
|
|
* "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1"
|
|
|
* "hsl(0, 100%, 50%)" or "hsl 0 100% 50%"
|
|
|
* "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1"
|
|
|
* "hsv(0, 100%, 100%)" or "hsv 0 100% 100%"
|
|
|
* ```
|
|
|
*/
|
|
|
function inputToRGB(color) {
|
|
|
var rgb = { r: 0, g: 0, b: 0 };
|
|
|
var a = 1;
|
|
|
var s = null;
|
|
|
var v = null;
|
|
|
var l = null;
|
|
|
var ok = false;
|
|
|
var format = false;
|
|
|
if (typeof color === 'string') {
|
|
|
color = stringInputToObject(color);
|
|
|
}
|
|
|
if (typeof color === 'object') {
|
|
|
if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) {
|
|
|
rgb = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToRgb)(color.r, color.g, color.b);
|
|
|
ok = true;
|
|
|
format = String(color.r).substr(-1) === '%' ? 'prgb' : 'rgb';
|
|
|
}
|
|
|
else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
|
|
|
s = (0,_util__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(color.s);
|
|
|
v = (0,_util__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(color.v);
|
|
|
rgb = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.hsvToRgb)(color.h, s, v);
|
|
|
ok = true;
|
|
|
format = 'hsv';
|
|
|
}
|
|
|
else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
|
|
|
s = (0,_util__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(color.s);
|
|
|
l = (0,_util__WEBPACK_IMPORTED_MODULE_1__.convertToPercentage)(color.l);
|
|
|
rgb = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.hslToRgb)(color.h, s, l);
|
|
|
ok = true;
|
|
|
format = 'hsl';
|
|
|
}
|
|
|
if (Object.prototype.hasOwnProperty.call(color, 'a')) {
|
|
|
a = color.a;
|
|
|
}
|
|
|
}
|
|
|
a = (0,_util__WEBPACK_IMPORTED_MODULE_1__.boundAlpha)(a);
|
|
|
return {
|
|
|
ok: ok,
|
|
|
format: color.format || format,
|
|
|
r: Math.min(255, Math.max(rgb.r, 0)),
|
|
|
g: Math.min(255, Math.max(rgb.g, 0)),
|
|
|
b: Math.min(255, Math.max(rgb.b, 0)),
|
|
|
a: a,
|
|
|
};
|
|
|
}
|
|
|
// <http://www.w3.org/TR/css3-values/#integers>
|
|
|
var CSS_INTEGER = '[-\\+]?\\d+%?';
|
|
|
// <http://www.w3.org/TR/css3-values/#number-value>
|
|
|
var CSS_NUMBER = '[-\\+]?\\d*\\.\\d+%?';
|
|
|
// Allow positive/negative integer/number. Don't capture the either/or, just the entire outcome.
|
|
|
var CSS_UNIT = "(?:".concat(CSS_NUMBER, ")|(?:").concat(CSS_INTEGER, ")");
|
|
|
// Actual matching.
|
|
|
// Parentheses and commas are optional, but not required.
|
|
|
// Whitespace can take the place of commas or opening paren
|
|
|
var PERMISSIVE_MATCH3 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
|
|
|
var PERMISSIVE_MATCH4 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
|
|
|
var matchers = {
|
|
|
CSS_UNIT: new RegExp(CSS_UNIT),
|
|
|
rgb: new RegExp('rgb' + PERMISSIVE_MATCH3),
|
|
|
rgba: new RegExp('rgba' + PERMISSIVE_MATCH4),
|
|
|
hsl: new RegExp('hsl' + PERMISSIVE_MATCH3),
|
|
|
hsla: new RegExp('hsla' + PERMISSIVE_MATCH4),
|
|
|
hsv: new RegExp('hsv' + PERMISSIVE_MATCH3),
|
|
|
hsva: new RegExp('hsva' + PERMISSIVE_MATCH4),
|
|
|
hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
|
|
|
hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
|
|
|
hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
|
|
|
hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
|
|
|
};
|
|
|
/**
|
|
|
* Permissive string parsing. Take in a number of formats, and output an object
|
|
|
* based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}`
|
|
|
*/
|
|
|
function stringInputToObject(color) {
|
|
|
color = color.trim().toLowerCase();
|
|
|
if (color.length === 0) {
|
|
|
return false;
|
|
|
}
|
|
|
var named = false;
|
|
|
if (_css_color_names__WEBPACK_IMPORTED_MODULE_2__.names[color]) {
|
|
|
color = _css_color_names__WEBPACK_IMPORTED_MODULE_2__.names[color];
|
|
|
named = true;
|
|
|
}
|
|
|
else if (color === 'transparent') {
|
|
|
return { r: 0, g: 0, b: 0, a: 0, format: 'name' };
|
|
|
}
|
|
|
// Try to match string input using regular expressions.
|
|
|
// Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360]
|
|
|
// Just return an object and let the conversion functions handle that.
|
|
|
// This way the result will be the same whether the tinycolor is initialized with string or object.
|
|
|
var match = matchers.rgb.exec(color);
|
|
|
if (match) {
|
|
|
return { r: match[1], g: match[2], b: match[3] };
|
|
|
}
|
|
|
match = matchers.rgba.exec(color);
|
|
|
if (match) {
|
|
|
return { r: match[1], g: match[2], b: match[3], a: match[4] };
|
|
|
}
|
|
|
match = matchers.hsl.exec(color);
|
|
|
if (match) {
|
|
|
return { h: match[1], s: match[2], l: match[3] };
|
|
|
}
|
|
|
match = matchers.hsla.exec(color);
|
|
|
if (match) {
|
|
|
return { h: match[1], s: match[2], l: match[3], a: match[4] };
|
|
|
}
|
|
|
match = matchers.hsv.exec(color);
|
|
|
if (match) {
|
|
|
return { h: match[1], s: match[2], v: match[3] };
|
|
|
}
|
|
|
match = matchers.hsva.exec(color);
|
|
|
if (match) {
|
|
|
return { h: match[1], s: match[2], v: match[3], a: match[4] };
|
|
|
}
|
|
|
match = matchers.hex8.exec(color);
|
|
|
if (match) {
|
|
|
return {
|
|
|
r: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1]),
|
|
|
g: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2]),
|
|
|
b: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3]),
|
|
|
a: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.convertHexToDecimal)(match[4]),
|
|
|
format: named ? 'name' : 'hex8',
|
|
|
};
|
|
|
}
|
|
|
match = matchers.hex6.exec(color);
|
|
|
if (match) {
|
|
|
return {
|
|
|
r: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1]),
|
|
|
g: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2]),
|
|
|
b: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3]),
|
|
|
format: named ? 'name' : 'hex',
|
|
|
};
|
|
|
}
|
|
|
match = matchers.hex4.exec(color);
|
|
|
if (match) {
|
|
|
return {
|
|
|
r: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1] + match[1]),
|
|
|
g: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2] + match[2]),
|
|
|
b: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3] + match[3]),
|
|
|
a: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.convertHexToDecimal)(match[4] + match[4]),
|
|
|
format: named ? 'name' : 'hex8',
|
|
|
};
|
|
|
}
|
|
|
match = matchers.hex3.exec(color);
|
|
|
if (match) {
|
|
|
return {
|
|
|
r: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[1] + match[1]),
|
|
|
g: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[2] + match[2]),
|
|
|
b: (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.parseIntFromHex)(match[3] + match[3]),
|
|
|
format: named ? 'name' : 'hex',
|
|
|
};
|
|
|
}
|
|
|
return false;
|
|
|
}
|
|
|
/**
|
|
|
* Check to see if it looks like a CSS unit
|
|
|
* (see `matchers` above for definition).
|
|
|
*/
|
|
|
function isValidCSSUnit(color) {
|
|
|
return Boolean(matchers.CSS_UNIT.exec(String(color)));
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/from-ratio.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/from-ratio.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "fromRatio": () => (/* binding */ fromRatio),
|
|
|
/* harmony export */ "legacyRandom": () => (/* binding */ legacyRandom)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./index */ "./node_modules/@ctrl/tinycolor/dist/module/index.js");
|
|
|
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./util */ "./node_modules/@ctrl/tinycolor/dist/module/util.js");
|
|
|
|
|
|
|
|
|
/**
|
|
|
* If input is an object, force 1 into "1.0" to handle ratios properly
|
|
|
* String input requires "1.0" as input, so 1 will be treated as 1
|
|
|
*/
|
|
|
function fromRatio(ratio, opts) {
|
|
|
var newColor = {
|
|
|
r: (0,_util__WEBPACK_IMPORTED_MODULE_0__.convertToPercentage)(ratio.r),
|
|
|
g: (0,_util__WEBPACK_IMPORTED_MODULE_0__.convertToPercentage)(ratio.g),
|
|
|
b: (0,_util__WEBPACK_IMPORTED_MODULE_0__.convertToPercentage)(ratio.b),
|
|
|
};
|
|
|
if (ratio.a !== undefined) {
|
|
|
newColor.a = Number(ratio.a);
|
|
|
}
|
|
|
return new _index__WEBPACK_IMPORTED_MODULE_1__.TinyColor(newColor, opts);
|
|
|
}
|
|
|
/** old random function */
|
|
|
function legacyRandom() {
|
|
|
return new _index__WEBPACK_IMPORTED_MODULE_1__.TinyColor({
|
|
|
r: Math.random(),
|
|
|
g: Math.random(),
|
|
|
b: Math.random(),
|
|
|
});
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/index.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/index.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "TinyColor": () => (/* binding */ TinyColor),
|
|
|
/* harmony export */ "tinycolor": () => (/* binding */ tinycolor)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _conversion__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./conversion */ "./node_modules/@ctrl/tinycolor/dist/module/conversion.js");
|
|
|
/* harmony import */ var _css_color_names__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./css-color-names */ "./node_modules/@ctrl/tinycolor/dist/module/css-color-names.js");
|
|
|
/* harmony import */ var _format_input__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./format-input */ "./node_modules/@ctrl/tinycolor/dist/module/format-input.js");
|
|
|
/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./util */ "./node_modules/@ctrl/tinycolor/dist/module/util.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var TinyColor = /** @class */ (function () {
|
|
|
function TinyColor(color, opts) {
|
|
|
if (color === void 0) { color = ''; }
|
|
|
if (opts === void 0) { opts = {}; }
|
|
|
var _a;
|
|
|
// If input is already a tinycolor, return itself
|
|
|
if (color instanceof TinyColor) {
|
|
|
// eslint-disable-next-line no-constructor-return
|
|
|
return color;
|
|
|
}
|
|
|
if (typeof color === 'number') {
|
|
|
color = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.numberInputToObject)(color);
|
|
|
}
|
|
|
this.originalInput = color;
|
|
|
var rgb = (0,_format_input__WEBPACK_IMPORTED_MODULE_1__.inputToRGB)(color);
|
|
|
this.originalInput = color;
|
|
|
this.r = rgb.r;
|
|
|
this.g = rgb.g;
|
|
|
this.b = rgb.b;
|
|
|
this.a = rgb.a;
|
|
|
this.roundA = Math.round(100 * this.a) / 100;
|
|
|
this.format = (_a = opts.format) !== null && _a !== void 0 ? _a : rgb.format;
|
|
|
this.gradientType = opts.gradientType;
|
|
|
// Don't let the range of [0,255] come back in [0,1].
|
|
|
// Potentially lose a little bit of precision here, but will fix issues where
|
|
|
// .5 gets interpreted as half of the total, instead of half of 1
|
|
|
// If it was supposed to be 128, this was already taken care of by `inputToRgb`
|
|
|
if (this.r < 1) {
|
|
|
this.r = Math.round(this.r);
|
|
|
}
|
|
|
if (this.g < 1) {
|
|
|
this.g = Math.round(this.g);
|
|
|
}
|
|
|
if (this.b < 1) {
|
|
|
this.b = Math.round(this.b);
|
|
|
}
|
|
|
this.isValid = rgb.ok;
|
|
|
}
|
|
|
TinyColor.prototype.isDark = function () {
|
|
|
return this.getBrightness() < 128;
|
|
|
};
|
|
|
TinyColor.prototype.isLight = function () {
|
|
|
return !this.isDark();
|
|
|
};
|
|
|
/**
|
|
|
* Returns the perceived brightness of the color, from 0-255.
|
|
|
*/
|
|
|
TinyColor.prototype.getBrightness = function () {
|
|
|
// http://www.w3.org/TR/AERT#color-contrast
|
|
|
var rgb = this.toRgb();
|
|
|
return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000;
|
|
|
};
|
|
|
/**
|
|
|
* Returns the perceived luminance of a color, from 0-1.
|
|
|
*/
|
|
|
TinyColor.prototype.getLuminance = function () {
|
|
|
// http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef
|
|
|
var rgb = this.toRgb();
|
|
|
var R;
|
|
|
var G;
|
|
|
var B;
|
|
|
var RsRGB = rgb.r / 255;
|
|
|
var GsRGB = rgb.g / 255;
|
|
|
var BsRGB = rgb.b / 255;
|
|
|
if (RsRGB <= 0.03928) {
|
|
|
R = RsRGB / 12.92;
|
|
|
}
|
|
|
else {
|
|
|
// eslint-disable-next-line prefer-exponentiation-operator
|
|
|
R = Math.pow((RsRGB + 0.055) / 1.055, 2.4);
|
|
|
}
|
|
|
if (GsRGB <= 0.03928) {
|
|
|
G = GsRGB / 12.92;
|
|
|
}
|
|
|
else {
|
|
|
// eslint-disable-next-line prefer-exponentiation-operator
|
|
|
G = Math.pow((GsRGB + 0.055) / 1.055, 2.4);
|
|
|
}
|
|
|
if (BsRGB <= 0.03928) {
|
|
|
B = BsRGB / 12.92;
|
|
|
}
|
|
|
else {
|
|
|
// eslint-disable-next-line prefer-exponentiation-operator
|
|
|
B = Math.pow((BsRGB + 0.055) / 1.055, 2.4);
|
|
|
}
|
|
|
return 0.2126 * R + 0.7152 * G + 0.0722 * B;
|
|
|
};
|
|
|
/**
|
|
|
* Returns the alpha value of a color, from 0-1.
|
|
|
*/
|
|
|
TinyColor.prototype.getAlpha = function () {
|
|
|
return this.a;
|
|
|
};
|
|
|
/**
|
|
|
* Sets the alpha value on the current color.
|
|
|
*
|
|
|
* @param alpha - The new alpha value. The accepted range is 0-1.
|
|
|
*/
|
|
|
TinyColor.prototype.setAlpha = function (alpha) {
|
|
|
this.a = (0,_util__WEBPACK_IMPORTED_MODULE_2__.boundAlpha)(alpha);
|
|
|
this.roundA = Math.round(100 * this.a) / 100;
|
|
|
return this;
|
|
|
};
|
|
|
/**
|
|
|
* Returns whether the color is monochrome.
|
|
|
*/
|
|
|
TinyColor.prototype.isMonochrome = function () {
|
|
|
var s = this.toHsl().s;
|
|
|
return s === 0;
|
|
|
};
|
|
|
/**
|
|
|
* Returns the object as a HSVA object.
|
|
|
*/
|
|
|
TinyColor.prototype.toHsv = function () {
|
|
|
var hsv = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToHsv)(this.r, this.g, this.b);
|
|
|
return { h: hsv.h * 360, s: hsv.s, v: hsv.v, a: this.a };
|
|
|
};
|
|
|
/**
|
|
|
* Returns the hsva values interpolated into a string with the following format:
|
|
|
* "hsva(xxx, xxx, xxx, xx)".
|
|
|
*/
|
|
|
TinyColor.prototype.toHsvString = function () {
|
|
|
var hsv = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToHsv)(this.r, this.g, this.b);
|
|
|
var h = Math.round(hsv.h * 360);
|
|
|
var s = Math.round(hsv.s * 100);
|
|
|
var v = Math.round(hsv.v * 100);
|
|
|
return this.a === 1 ? "hsv(".concat(h, ", ").concat(s, "%, ").concat(v, "%)") : "hsva(".concat(h, ", ").concat(s, "%, ").concat(v, "%, ").concat(this.roundA, ")");
|
|
|
};
|
|
|
/**
|
|
|
* Returns the object as a HSLA object.
|
|
|
*/
|
|
|
TinyColor.prototype.toHsl = function () {
|
|
|
var hsl = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToHsl)(this.r, this.g, this.b);
|
|
|
return { h: hsl.h * 360, s: hsl.s, l: hsl.l, a: this.a };
|
|
|
};
|
|
|
/**
|
|
|
* Returns the hsla values interpolated into a string with the following format:
|
|
|
* "hsla(xxx, xxx, xxx, xx)".
|
|
|
*/
|
|
|
TinyColor.prototype.toHslString = function () {
|
|
|
var hsl = (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToHsl)(this.r, this.g, this.b);
|
|
|
var h = Math.round(hsl.h * 360);
|
|
|
var s = Math.round(hsl.s * 100);
|
|
|
var l = Math.round(hsl.l * 100);
|
|
|
return this.a === 1 ? "hsl(".concat(h, ", ").concat(s, "%, ").concat(l, "%)") : "hsla(".concat(h, ", ").concat(s, "%, ").concat(l, "%, ").concat(this.roundA, ")");
|
|
|
};
|
|
|
/**
|
|
|
* Returns the hex value of the color.
|
|
|
* @param allow3Char will shorten hex value to 3 char if possible
|
|
|
*/
|
|
|
TinyColor.prototype.toHex = function (allow3Char) {
|
|
|
if (allow3Char === void 0) { allow3Char = false; }
|
|
|
return (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToHex)(this.r, this.g, this.b, allow3Char);
|
|
|
};
|
|
|
/**
|
|
|
* Returns the hex value of the color -with a # prefixed.
|
|
|
* @param allow3Char will shorten hex value to 3 char if possible
|
|
|
*/
|
|
|
TinyColor.prototype.toHexString = function (allow3Char) {
|
|
|
if (allow3Char === void 0) { allow3Char = false; }
|
|
|
return '#' + this.toHex(allow3Char);
|
|
|
};
|
|
|
/**
|
|
|
* Returns the hex 8 value of the color.
|
|
|
* @param allow4Char will shorten hex value to 4 char if possible
|
|
|
*/
|
|
|
TinyColor.prototype.toHex8 = function (allow4Char) {
|
|
|
if (allow4Char === void 0) { allow4Char = false; }
|
|
|
return (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbaToHex)(this.r, this.g, this.b, this.a, allow4Char);
|
|
|
};
|
|
|
/**
|
|
|
* Returns the hex 8 value of the color -with a # prefixed.
|
|
|
* @param allow4Char will shorten hex value to 4 char if possible
|
|
|
*/
|
|
|
TinyColor.prototype.toHex8String = function (allow4Char) {
|
|
|
if (allow4Char === void 0) { allow4Char = false; }
|
|
|
return '#' + this.toHex8(allow4Char);
|
|
|
};
|
|
|
/**
|
|
|
* Returns the shorter hex value of the color depends on its alpha -with a # prefixed.
|
|
|
* @param allowShortChar will shorten hex value to 3 or 4 char if possible
|
|
|
*/
|
|
|
TinyColor.prototype.toHexShortString = function (allowShortChar) {
|
|
|
if (allowShortChar === void 0) { allowShortChar = false; }
|
|
|
return this.a === 1 ? this.toHexString(allowShortChar) : this.toHex8String(allowShortChar);
|
|
|
};
|
|
|
/**
|
|
|
* Returns the object as a RGBA object.
|
|
|
*/
|
|
|
TinyColor.prototype.toRgb = function () {
|
|
|
return {
|
|
|
r: Math.round(this.r),
|
|
|
g: Math.round(this.g),
|
|
|
b: Math.round(this.b),
|
|
|
a: this.a,
|
|
|
};
|
|
|
};
|
|
|
/**
|
|
|
* Returns the RGBA values interpolated into a string with the following format:
|
|
|
* "RGBA(xxx, xxx, xxx, xx)".
|
|
|
*/
|
|
|
TinyColor.prototype.toRgbString = function () {
|
|
|
var r = Math.round(this.r);
|
|
|
var g = Math.round(this.g);
|
|
|
var b = Math.round(this.b);
|
|
|
return this.a === 1 ? "rgb(".concat(r, ", ").concat(g, ", ").concat(b, ")") : "rgba(".concat(r, ", ").concat(g, ", ").concat(b, ", ").concat(this.roundA, ")");
|
|
|
};
|
|
|
/**
|
|
|
* Returns the object as a RGBA object.
|
|
|
*/
|
|
|
TinyColor.prototype.toPercentageRgb = function () {
|
|
|
var fmt = function (x) { return "".concat(Math.round((0,_util__WEBPACK_IMPORTED_MODULE_2__.bound01)(x, 255) * 100), "%"); };
|
|
|
return {
|
|
|
r: fmt(this.r),
|
|
|
g: fmt(this.g),
|
|
|
b: fmt(this.b),
|
|
|
a: this.a,
|
|
|
};
|
|
|
};
|
|
|
/**
|
|
|
* Returns the RGBA relative values interpolated into a string
|
|
|
*/
|
|
|
TinyColor.prototype.toPercentageRgbString = function () {
|
|
|
var rnd = function (x) { return Math.round((0,_util__WEBPACK_IMPORTED_MODULE_2__.bound01)(x, 255) * 100); };
|
|
|
return this.a === 1
|
|
|
? "rgb(".concat(rnd(this.r), "%, ").concat(rnd(this.g), "%, ").concat(rnd(this.b), "%)")
|
|
|
: "rgba(".concat(rnd(this.r), "%, ").concat(rnd(this.g), "%, ").concat(rnd(this.b), "%, ").concat(this.roundA, ")");
|
|
|
};
|
|
|
/**
|
|
|
* The 'real' name of the color -if there is one.
|
|
|
*/
|
|
|
TinyColor.prototype.toName = function () {
|
|
|
if (this.a === 0) {
|
|
|
return 'transparent';
|
|
|
}
|
|
|
if (this.a < 1) {
|
|
|
return false;
|
|
|
}
|
|
|
var hex = '#' + (0,_conversion__WEBPACK_IMPORTED_MODULE_0__.rgbToHex)(this.r, this.g, this.b, false);
|
|
|
for (var _i = 0, _a = Object.entries(_css_color_names__WEBPACK_IMPORTED_MODULE_3__.names); _i < _a.length; _i++) {
|
|
|
var _b = _a[_i], key = _b[0], value = _b[1];
|
|
|
if (hex === value) {
|
|
|
return key;
|
|
|
}
|
|
|
}
|
|
|
return false;
|
|
|
};
|
|
|
TinyColor.prototype.toString = function (format) {
|
|
|
var formatSet = Boolean(format);
|
|
|
format = format !== null && format !== void 0 ? format : this.format;
|
|
|
var formattedString = false;
|
|
|
var hasAlpha = this.a < 1 && this.a >= 0;
|
|
|
var needsAlphaFormat = !formatSet && hasAlpha && (format.startsWith('hex') || format === 'name');
|
|
|
if (needsAlphaFormat) {
|
|
|
// Special case for "transparent", all other non-alpha formats
|
|
|
// will return rgba when there is transparency.
|
|
|
if (format === 'name' && this.a === 0) {
|
|
|
return this.toName();
|
|
|
}
|
|
|
return this.toRgbString();
|
|
|
}
|
|
|
if (format === 'rgb') {
|
|
|
formattedString = this.toRgbString();
|
|
|
}
|
|
|
if (format === 'prgb') {
|
|
|
formattedString = this.toPercentageRgbString();
|
|
|
}
|
|
|
if (format === 'hex' || format === 'hex6') {
|
|
|
formattedString = this.toHexString();
|
|
|
}
|
|
|
if (format === 'hex3') {
|
|
|
formattedString = this.toHexString(true);
|
|
|
}
|
|
|
if (format === 'hex4') {
|
|
|
formattedString = this.toHex8String(true);
|
|
|
}
|
|
|
if (format === 'hex8') {
|
|
|
formattedString = this.toHex8String();
|
|
|
}
|
|
|
if (format === 'name') {
|
|
|
formattedString = this.toName();
|
|
|
}
|
|
|
if (format === 'hsl') {
|
|
|
formattedString = this.toHslString();
|
|
|
}
|
|
|
if (format === 'hsv') {
|
|
|
formattedString = this.toHsvString();
|
|
|
}
|
|
|
return formattedString || this.toHexString();
|
|
|
};
|
|
|
TinyColor.prototype.toNumber = function () {
|
|
|
return (Math.round(this.r) << 16) + (Math.round(this.g) << 8) + Math.round(this.b);
|
|
|
};
|
|
|
TinyColor.prototype.clone = function () {
|
|
|
return new TinyColor(this.toString());
|
|
|
};
|
|
|
/**
|
|
|
* Lighten the color a given amount. Providing 100 will always return white.
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.lighten = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
var hsl = this.toHsl();
|
|
|
hsl.l += amount / 100;
|
|
|
hsl.l = (0,_util__WEBPACK_IMPORTED_MODULE_2__.clamp01)(hsl.l);
|
|
|
return new TinyColor(hsl);
|
|
|
};
|
|
|
/**
|
|
|
* Brighten the color a given amount, from 0 to 100.
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.brighten = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
var rgb = this.toRgb();
|
|
|
rgb.r = Math.max(0, Math.min(255, rgb.r - Math.round(255 * -(amount / 100))));
|
|
|
rgb.g = Math.max(0, Math.min(255, rgb.g - Math.round(255 * -(amount / 100))));
|
|
|
rgb.b = Math.max(0, Math.min(255, rgb.b - Math.round(255 * -(amount / 100))));
|
|
|
return new TinyColor(rgb);
|
|
|
};
|
|
|
/**
|
|
|
* Darken the color a given amount, from 0 to 100.
|
|
|
* Providing 100 will always return black.
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.darken = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
var hsl = this.toHsl();
|
|
|
hsl.l -= amount / 100;
|
|
|
hsl.l = (0,_util__WEBPACK_IMPORTED_MODULE_2__.clamp01)(hsl.l);
|
|
|
return new TinyColor(hsl);
|
|
|
};
|
|
|
/**
|
|
|
* Mix the color with pure white, from 0 to 100.
|
|
|
* Providing 0 will do nothing, providing 100 will always return white.
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.tint = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
return this.mix('white', amount);
|
|
|
};
|
|
|
/**
|
|
|
* Mix the color with pure black, from 0 to 100.
|
|
|
* Providing 0 will do nothing, providing 100 will always return black.
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.shade = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
return this.mix('black', amount);
|
|
|
};
|
|
|
/**
|
|
|
* Desaturate the color a given amount, from 0 to 100.
|
|
|
* Providing 100 will is the same as calling greyscale
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.desaturate = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
var hsl = this.toHsl();
|
|
|
hsl.s -= amount / 100;
|
|
|
hsl.s = (0,_util__WEBPACK_IMPORTED_MODULE_2__.clamp01)(hsl.s);
|
|
|
return new TinyColor(hsl);
|
|
|
};
|
|
|
/**
|
|
|
* Saturate the color a given amount, from 0 to 100.
|
|
|
* @param amount - valid between 1-100
|
|
|
*/
|
|
|
TinyColor.prototype.saturate = function (amount) {
|
|
|
if (amount === void 0) { amount = 10; }
|
|
|
var hsl = this.toHsl();
|
|
|
hsl.s += amount / 100;
|
|
|
hsl.s = (0,_util__WEBPACK_IMPORTED_MODULE_2__.clamp01)(hsl.s);
|
|
|
return new TinyColor(hsl);
|
|
|
};
|
|
|
/**
|
|
|
* Completely desaturates a color into greyscale.
|
|
|
* Same as calling `desaturate(100)`
|
|
|
*/
|
|
|
TinyColor.prototype.greyscale = function () {
|
|
|
return this.desaturate(100);
|
|
|
};
|
|
|
/**
|
|
|
* Spin takes a positive or negative amount within [-360, 360] indicating the change of hue.
|
|
|
* Values outside of this range will be wrapped into this range.
|
|
|
*/
|
|
|
TinyColor.prototype.spin = function (amount) {
|
|
|
var hsl = this.toHsl();
|
|
|
var hue = (hsl.h + amount) % 360;
|
|
|
hsl.h = hue < 0 ? 360 + hue : hue;
|
|
|
return new TinyColor(hsl);
|
|
|
};
|
|
|
/**
|
|
|
* Mix the current color a given amount with another color, from 0 to 100.
|
|
|
* 0 means no mixing (return current color).
|
|
|
*/
|
|
|
TinyColor.prototype.mix = function (color, amount) {
|
|
|
if (amount === void 0) { amount = 50; }
|
|
|
var rgb1 = this.toRgb();
|
|
|
var rgb2 = new TinyColor(color).toRgb();
|
|
|
var p = amount / 100;
|
|
|
var rgba = {
|
|
|
r: (rgb2.r - rgb1.r) * p + rgb1.r,
|
|
|
g: (rgb2.g - rgb1.g) * p + rgb1.g,
|
|
|
b: (rgb2.b - rgb1.b) * p + rgb1.b,
|
|
|
a: (rgb2.a - rgb1.a) * p + rgb1.a,
|
|
|
};
|
|
|
return new TinyColor(rgba);
|
|
|
};
|
|
|
TinyColor.prototype.analogous = function (results, slices) {
|
|
|
if (results === void 0) { results = 6; }
|
|
|
if (slices === void 0) { slices = 30; }
|
|
|
var hsl = this.toHsl();
|
|
|
var part = 360 / slices;
|
|
|
var ret = [this];
|
|
|
for (hsl.h = (hsl.h - ((part * results) >> 1) + 720) % 360; --results;) {
|
|
|
hsl.h = (hsl.h + part) % 360;
|
|
|
ret.push(new TinyColor(hsl));
|
|
|
}
|
|
|
return ret;
|
|
|
};
|
|
|
/**
|
|
|
* taken from https://github.com/infusion/jQuery-xcolor/blob/master/jquery.xcolor.js
|
|
|
*/
|
|
|
TinyColor.prototype.complement = function () {
|
|
|
var hsl = this.toHsl();
|
|
|
hsl.h = (hsl.h + 180) % 360;
|
|
|
return new TinyColor(hsl);
|
|
|
};
|
|
|
TinyColor.prototype.monochromatic = function (results) {
|
|
|
if (results === void 0) { results = 6; }
|
|
|
var hsv = this.toHsv();
|
|
|
var h = hsv.h;
|
|
|
var s = hsv.s;
|
|
|
var v = hsv.v;
|
|
|
var res = [];
|
|
|
var modification = 1 / results;
|
|
|
while (results--) {
|
|
|
res.push(new TinyColor({ h: h, s: s, v: v }));
|
|
|
v = (v + modification) % 1;
|
|
|
}
|
|
|
return res;
|
|
|
};
|
|
|
TinyColor.prototype.splitcomplement = function () {
|
|
|
var hsl = this.toHsl();
|
|
|
var h = hsl.h;
|
|
|
return [
|
|
|
this,
|
|
|
new TinyColor({ h: (h + 72) % 360, s: hsl.s, l: hsl.l }),
|
|
|
new TinyColor({ h: (h + 216) % 360, s: hsl.s, l: hsl.l }),
|
|
|
];
|
|
|
};
|
|
|
/**
|
|
|
* Compute how the color would appear on a background
|
|
|
*/
|
|
|
TinyColor.prototype.onBackground = function (background) {
|
|
|
var fg = this.toRgb();
|
|
|
var bg = new TinyColor(background).toRgb();
|
|
|
var alpha = fg.a + bg.a * (1 - fg.a);
|
|
|
return new TinyColor({
|
|
|
r: (fg.r * fg.a + bg.r * bg.a * (1 - fg.a)) / alpha,
|
|
|
g: (fg.g * fg.a + bg.g * bg.a * (1 - fg.a)) / alpha,
|
|
|
b: (fg.b * fg.a + bg.b * bg.a * (1 - fg.a)) / alpha,
|
|
|
a: alpha,
|
|
|
});
|
|
|
};
|
|
|
/**
|
|
|
* Alias for `polyad(3)`
|
|
|
*/
|
|
|
TinyColor.prototype.triad = function () {
|
|
|
return this.polyad(3);
|
|
|
};
|
|
|
/**
|
|
|
* Alias for `polyad(4)`
|
|
|
*/
|
|
|
TinyColor.prototype.tetrad = function () {
|
|
|
return this.polyad(4);
|
|
|
};
|
|
|
/**
|
|
|
* Get polyad colors, like (for 1, 2, 3, 4, 5, 6, 7, 8, etc...)
|
|
|
* monad, dyad, triad, tetrad, pentad, hexad, heptad, octad, etc...
|
|
|
*/
|
|
|
TinyColor.prototype.polyad = function (n) {
|
|
|
var hsl = this.toHsl();
|
|
|
var h = hsl.h;
|
|
|
var result = [this];
|
|
|
var increment = 360 / n;
|
|
|
for (var i = 1; i < n; i++) {
|
|
|
result.push(new TinyColor({ h: (h + i * increment) % 360, s: hsl.s, l: hsl.l }));
|
|
|
}
|
|
|
return result;
|
|
|
};
|
|
|
/**
|
|
|
* compare color vs current color
|
|
|
*/
|
|
|
TinyColor.prototype.equals = function (color) {
|
|
|
return this.toRgbString() === new TinyColor(color).toRgbString();
|
|
|
};
|
|
|
return TinyColor;
|
|
|
}());
|
|
|
|
|
|
// kept for backwards compatability with v1
|
|
|
function tinycolor(color, opts) {
|
|
|
if (color === void 0) { color = ''; }
|
|
|
if (opts === void 0) { opts = {}; }
|
|
|
return new TinyColor(color, opts);
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/public_api.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "TinyColor": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor),
|
|
|
/* harmony export */ "bounds": () => (/* reexport safe */ _random__WEBPACK_IMPORTED_MODULE_6__.bounds),
|
|
|
/* harmony export */ "convertDecimalToHex": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.convertDecimalToHex),
|
|
|
/* harmony export */ "convertHexToDecimal": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.convertHexToDecimal),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "fromRatio": () => (/* reexport safe */ _from_ratio__WEBPACK_IMPORTED_MODULE_4__.fromRatio),
|
|
|
/* harmony export */ "hslToRgb": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.hslToRgb),
|
|
|
/* harmony export */ "hsvToRgb": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.hsvToRgb),
|
|
|
/* harmony export */ "inputToRGB": () => (/* reexport safe */ _format_input__WEBPACK_IMPORTED_MODULE_5__.inputToRGB),
|
|
|
/* harmony export */ "isReadable": () => (/* reexport safe */ _readability__WEBPACK_IMPORTED_MODULE_2__.isReadable),
|
|
|
/* harmony export */ "isValidCSSUnit": () => (/* reexport safe */ _format_input__WEBPACK_IMPORTED_MODULE_5__.isValidCSSUnit),
|
|
|
/* harmony export */ "legacyRandom": () => (/* reexport safe */ _from_ratio__WEBPACK_IMPORTED_MODULE_4__.legacyRandom),
|
|
|
/* harmony export */ "mostReadable": () => (/* reexport safe */ _readability__WEBPACK_IMPORTED_MODULE_2__.mostReadable),
|
|
|
/* harmony export */ "names": () => (/* reexport safe */ _css_color_names__WEBPACK_IMPORTED_MODULE_1__.names),
|
|
|
/* harmony export */ "numberInputToObject": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.numberInputToObject),
|
|
|
/* harmony export */ "parseIntFromHex": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.parseIntFromHex),
|
|
|
/* harmony export */ "random": () => (/* reexport safe */ _random__WEBPACK_IMPORTED_MODULE_6__.random),
|
|
|
/* harmony export */ "readability": () => (/* reexport safe */ _readability__WEBPACK_IMPORTED_MODULE_2__.readability),
|
|
|
/* harmony export */ "rgbToHex": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.rgbToHex),
|
|
|
/* harmony export */ "rgbToHsl": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.rgbToHsl),
|
|
|
/* harmony export */ "rgbToHsv": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.rgbToHsv),
|
|
|
/* harmony export */ "rgbToRgb": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.rgbToRgb),
|
|
|
/* harmony export */ "rgbaToArgbHex": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.rgbaToArgbHex),
|
|
|
/* harmony export */ "rgbaToHex": () => (/* reexport safe */ _conversion__WEBPACK_IMPORTED_MODULE_7__.rgbaToHex),
|
|
|
/* harmony export */ "stringInputToObject": () => (/* reexport safe */ _format_input__WEBPACK_IMPORTED_MODULE_5__.stringInputToObject),
|
|
|
/* harmony export */ "tinycolor": () => (/* reexport safe */ _index__WEBPACK_IMPORTED_MODULE_0__.tinycolor),
|
|
|
/* harmony export */ "toMsFilter": () => (/* reexport safe */ _to_ms_filter__WEBPACK_IMPORTED_MODULE_3__.toMsFilter)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index */ "./node_modules/@ctrl/tinycolor/dist/module/index.js");
|
|
|
/* harmony import */ var _css_color_names__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./css-color-names */ "./node_modules/@ctrl/tinycolor/dist/module/css-color-names.js");
|
|
|
/* harmony import */ var _readability__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./readability */ "./node_modules/@ctrl/tinycolor/dist/module/readability.js");
|
|
|
/* harmony import */ var _to_ms_filter__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./to-ms-filter */ "./node_modules/@ctrl/tinycolor/dist/module/to-ms-filter.js");
|
|
|
/* harmony import */ var _from_ratio__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./from-ratio */ "./node_modules/@ctrl/tinycolor/dist/module/from-ratio.js");
|
|
|
/* harmony import */ var _format_input__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./format-input */ "./node_modules/@ctrl/tinycolor/dist/module/format-input.js");
|
|
|
/* harmony import */ var _random__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./random */ "./node_modules/@ctrl/tinycolor/dist/module/random.js");
|
|
|
/* harmony import */ var _conversion__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./conversion */ "./node_modules/@ctrl/tinycolor/dist/module/conversion.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// kept for backwards compatability with v1
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_index__WEBPACK_IMPORTED_MODULE_0__.tinycolor);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/random.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/random.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "bounds": () => (/* binding */ bounds),
|
|
|
/* harmony export */ "random": () => (/* binding */ random)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index */ "./node_modules/@ctrl/tinycolor/dist/module/index.js");
|
|
|
/* eslint-disable @typescript-eslint/no-redundant-type-constituents */
|
|
|
// randomColor by David Merfield under the CC0 license
|
|
|
// https://github.com/davidmerfield/randomColor/
|
|
|
|
|
|
function random(options) {
|
|
|
if (options === void 0) { options = {}; }
|
|
|
// Check if we need to generate multiple colors
|
|
|
if (options.count !== undefined &&
|
|
|
options.count !== null) {
|
|
|
var totalColors = options.count;
|
|
|
var colors = [];
|
|
|
options.count = undefined;
|
|
|
while (totalColors > colors.length) {
|
|
|
// Since we're generating multiple colors,
|
|
|
// incremement the seed. Otherwise we'd just
|
|
|
// generate the same color each time...
|
|
|
options.count = null;
|
|
|
if (options.seed) {
|
|
|
options.seed += 1;
|
|
|
}
|
|
|
colors.push(random(options));
|
|
|
}
|
|
|
options.count = totalColors;
|
|
|
return colors;
|
|
|
}
|
|
|
// First we pick a hue (H)
|
|
|
var h = pickHue(options.hue, options.seed);
|
|
|
// Then use H to determine saturation (S)
|
|
|
var s = pickSaturation(h, options);
|
|
|
// Then use S and H to determine brightness (B).
|
|
|
var v = pickBrightness(h, s, options);
|
|
|
var res = { h: h, s: s, v: v };
|
|
|
if (options.alpha !== undefined) {
|
|
|
res.a = options.alpha;
|
|
|
}
|
|
|
// Then we return the HSB color in the desired format
|
|
|
return new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(res);
|
|
|
}
|
|
|
function pickHue(hue, seed) {
|
|
|
var hueRange = getHueRange(hue);
|
|
|
var res = randomWithin(hueRange, seed);
|
|
|
// Instead of storing red as two seperate ranges,
|
|
|
// we group them, using negative numbers
|
|
|
if (res < 0) {
|
|
|
res = 360 + res;
|
|
|
}
|
|
|
return res;
|
|
|
}
|
|
|
function pickSaturation(hue, options) {
|
|
|
if (options.hue === 'monochrome') {
|
|
|
return 0;
|
|
|
}
|
|
|
if (options.luminosity === 'random') {
|
|
|
return randomWithin([0, 100], options.seed);
|
|
|
}
|
|
|
var saturationRange = getColorInfo(hue).saturationRange;
|
|
|
var sMin = saturationRange[0];
|
|
|
var sMax = saturationRange[1];
|
|
|
switch (options.luminosity) {
|
|
|
case 'bright':
|
|
|
sMin = 55;
|
|
|
break;
|
|
|
case 'dark':
|
|
|
sMin = sMax - 10;
|
|
|
break;
|
|
|
case 'light':
|
|
|
sMax = 55;
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
return randomWithin([sMin, sMax], options.seed);
|
|
|
}
|
|
|
function pickBrightness(H, S, options) {
|
|
|
var bMin = getMinimumBrightness(H, S);
|
|
|
var bMax = 100;
|
|
|
switch (options.luminosity) {
|
|
|
case 'dark':
|
|
|
bMax = bMin + 20;
|
|
|
break;
|
|
|
case 'light':
|
|
|
bMin = (bMax + bMin) / 2;
|
|
|
break;
|
|
|
case 'random':
|
|
|
bMin = 0;
|
|
|
bMax = 100;
|
|
|
break;
|
|
|
default:
|
|
|
break;
|
|
|
}
|
|
|
return randomWithin([bMin, bMax], options.seed);
|
|
|
}
|
|
|
function getMinimumBrightness(H, S) {
|
|
|
var lowerBounds = getColorInfo(H).lowerBounds;
|
|
|
for (var i = 0; i < lowerBounds.length - 1; i++) {
|
|
|
var s1 = lowerBounds[i][0];
|
|
|
var v1 = lowerBounds[i][1];
|
|
|
var s2 = lowerBounds[i + 1][0];
|
|
|
var v2 = lowerBounds[i + 1][1];
|
|
|
if (S >= s1 && S <= s2) {
|
|
|
var m = (v2 - v1) / (s2 - s1);
|
|
|
var b = v1 - m * s1;
|
|
|
return m * S + b;
|
|
|
}
|
|
|
}
|
|
|
return 0;
|
|
|
}
|
|
|
function getHueRange(colorInput) {
|
|
|
var num = parseInt(colorInput, 10);
|
|
|
if (!Number.isNaN(num) && num < 360 && num > 0) {
|
|
|
return [num, num];
|
|
|
}
|
|
|
if (typeof colorInput === 'string') {
|
|
|
var namedColor = bounds.find(function (n) { return n.name === colorInput; });
|
|
|
if (namedColor) {
|
|
|
var color = defineColor(namedColor);
|
|
|
if (color.hueRange) {
|
|
|
return color.hueRange;
|
|
|
}
|
|
|
}
|
|
|
var parsed = new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(colorInput);
|
|
|
if (parsed.isValid) {
|
|
|
var hue = parsed.toHsv().h;
|
|
|
return [hue, hue];
|
|
|
}
|
|
|
}
|
|
|
return [0, 360];
|
|
|
}
|
|
|
function getColorInfo(hue) {
|
|
|
// Maps red colors to make picking hue easier
|
|
|
if (hue >= 334 && hue <= 360) {
|
|
|
hue -= 360;
|
|
|
}
|
|
|
for (var _i = 0, bounds_1 = bounds; _i < bounds_1.length; _i++) {
|
|
|
var bound = bounds_1[_i];
|
|
|
var color = defineColor(bound);
|
|
|
if (color.hueRange && hue >= color.hueRange[0] && hue <= color.hueRange[1]) {
|
|
|
return color;
|
|
|
}
|
|
|
}
|
|
|
throw Error('Color not found');
|
|
|
}
|
|
|
function randomWithin(range, seed) {
|
|
|
if (seed === undefined) {
|
|
|
return Math.floor(range[0] + Math.random() * (range[1] + 1 - range[0]));
|
|
|
}
|
|
|
// Seeded random algorithm from http://indiegamr.com/generate-repeatable-random-numbers-in-js/
|
|
|
var max = range[1] || 1;
|
|
|
var min = range[0] || 0;
|
|
|
seed = (seed * 9301 + 49297) % 233280;
|
|
|
var rnd = seed / 233280.0;
|
|
|
return Math.floor(min + rnd * (max - min));
|
|
|
}
|
|
|
function defineColor(bound) {
|
|
|
var sMin = bound.lowerBounds[0][0];
|
|
|
var sMax = bound.lowerBounds[bound.lowerBounds.length - 1][0];
|
|
|
var bMin = bound.lowerBounds[bound.lowerBounds.length - 1][1];
|
|
|
var bMax = bound.lowerBounds[0][1];
|
|
|
return {
|
|
|
name: bound.name,
|
|
|
hueRange: bound.hueRange,
|
|
|
lowerBounds: bound.lowerBounds,
|
|
|
saturationRange: [sMin, sMax],
|
|
|
brightnessRange: [bMin, bMax],
|
|
|
};
|
|
|
}
|
|
|
/**
|
|
|
* @hidden
|
|
|
*/
|
|
|
var bounds = [
|
|
|
{
|
|
|
name: 'monochrome',
|
|
|
hueRange: null,
|
|
|
lowerBounds: [
|
|
|
[0, 0],
|
|
|
[100, 0],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'red',
|
|
|
hueRange: [-26, 18],
|
|
|
lowerBounds: [
|
|
|
[20, 100],
|
|
|
[30, 92],
|
|
|
[40, 89],
|
|
|
[50, 85],
|
|
|
[60, 78],
|
|
|
[70, 70],
|
|
|
[80, 60],
|
|
|
[90, 55],
|
|
|
[100, 50],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'orange',
|
|
|
hueRange: [19, 46],
|
|
|
lowerBounds: [
|
|
|
[20, 100],
|
|
|
[30, 93],
|
|
|
[40, 88],
|
|
|
[50, 86],
|
|
|
[60, 85],
|
|
|
[70, 70],
|
|
|
[100, 70],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'yellow',
|
|
|
hueRange: [47, 62],
|
|
|
lowerBounds: [
|
|
|
[25, 100],
|
|
|
[40, 94],
|
|
|
[50, 89],
|
|
|
[60, 86],
|
|
|
[70, 84],
|
|
|
[80, 82],
|
|
|
[90, 80],
|
|
|
[100, 75],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'green',
|
|
|
hueRange: [63, 178],
|
|
|
lowerBounds: [
|
|
|
[30, 100],
|
|
|
[40, 90],
|
|
|
[50, 85],
|
|
|
[60, 81],
|
|
|
[70, 74],
|
|
|
[80, 64],
|
|
|
[90, 50],
|
|
|
[100, 40],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'blue',
|
|
|
hueRange: [179, 257],
|
|
|
lowerBounds: [
|
|
|
[20, 100],
|
|
|
[30, 86],
|
|
|
[40, 80],
|
|
|
[50, 74],
|
|
|
[60, 60],
|
|
|
[70, 52],
|
|
|
[80, 44],
|
|
|
[90, 39],
|
|
|
[100, 35],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'purple',
|
|
|
hueRange: [258, 282],
|
|
|
lowerBounds: [
|
|
|
[20, 100],
|
|
|
[30, 87],
|
|
|
[40, 79],
|
|
|
[50, 70],
|
|
|
[60, 65],
|
|
|
[70, 59],
|
|
|
[80, 52],
|
|
|
[90, 45],
|
|
|
[100, 42],
|
|
|
],
|
|
|
},
|
|
|
{
|
|
|
name: 'pink',
|
|
|
hueRange: [283, 334],
|
|
|
lowerBounds: [
|
|
|
[20, 100],
|
|
|
[30, 90],
|
|
|
[40, 86],
|
|
|
[60, 84],
|
|
|
[80, 80],
|
|
|
[90, 75],
|
|
|
[100, 73],
|
|
|
],
|
|
|
},
|
|
|
];
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/readability.js":
|
|
|
/*!*****************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/readability.js ***!
|
|
|
\*****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "isReadable": () => (/* binding */ isReadable),
|
|
|
/* harmony export */ "mostReadable": () => (/* binding */ mostReadable),
|
|
|
/* harmony export */ "readability": () => (/* binding */ readability)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index */ "./node_modules/@ctrl/tinycolor/dist/module/index.js");
|
|
|
|
|
|
// Readability Functions
|
|
|
// ---------------------
|
|
|
// <http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef (WCAG Version 2)
|
|
|
/**
|
|
|
* AKA `contrast`
|
|
|
*
|
|
|
* Analyze the 2 colors and returns the color contrast defined by (WCAG Version 2)
|
|
|
*/
|
|
|
function readability(color1, color2) {
|
|
|
var c1 = new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(color1);
|
|
|
var c2 = new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(color2);
|
|
|
return ((Math.max(c1.getLuminance(), c2.getLuminance()) + 0.05) /
|
|
|
(Math.min(c1.getLuminance(), c2.getLuminance()) + 0.05));
|
|
|
}
|
|
|
/**
|
|
|
* Ensure that foreground and background color combinations meet WCAG2 guidelines.
|
|
|
* The third argument is an object.
|
|
|
* the 'level' property states 'AA' or 'AAA' - if missing or invalid, it defaults to 'AA';
|
|
|
* the 'size' property states 'large' or 'small' - if missing or invalid, it defaults to 'small'.
|
|
|
* If the entire object is absent, isReadable defaults to {level:"AA",size:"small"}.
|
|
|
*
|
|
|
* Example
|
|
|
* ```ts
|
|
|
* new TinyColor().isReadable('#000', '#111') => false
|
|
|
* new TinyColor().isReadable('#000', '#111', { level: 'AA', size: 'large' }) => false
|
|
|
* ```
|
|
|
*/
|
|
|
function isReadable(color1, color2, wcag2) {
|
|
|
var _a, _b;
|
|
|
if (wcag2 === void 0) { wcag2 = { level: 'AA', size: 'small' }; }
|
|
|
var readabilityLevel = readability(color1, color2);
|
|
|
switch (((_a = wcag2.level) !== null && _a !== void 0 ? _a : 'AA') + ((_b = wcag2.size) !== null && _b !== void 0 ? _b : 'small')) {
|
|
|
case 'AAsmall':
|
|
|
case 'AAAlarge':
|
|
|
return readabilityLevel >= 4.5;
|
|
|
case 'AAlarge':
|
|
|
return readabilityLevel >= 3;
|
|
|
case 'AAAsmall':
|
|
|
return readabilityLevel >= 7;
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Given a base color and a list of possible foreground or background
|
|
|
* colors for that base, returns the most readable color.
|
|
|
* Optionally returns Black or White if the most readable color is unreadable.
|
|
|
*
|
|
|
* @param baseColor - the base color.
|
|
|
* @param colorList - array of colors to pick the most readable one from.
|
|
|
* @param args - and object with extra arguments
|
|
|
*
|
|
|
* Example
|
|
|
* ```ts
|
|
|
* new TinyColor().mostReadable('#123', ['#124", "#125'], { includeFallbackColors: false }).toHexString(); // "#112255"
|
|
|
* new TinyColor().mostReadable('#123', ['#124", "#125'],{ includeFallbackColors: true }).toHexString(); // "#ffffff"
|
|
|
* new TinyColor().mostReadable('#a8015a', ["#faf3f3"], { includeFallbackColors:true, level: 'AAA', size: 'large' }).toHexString(); // "#faf3f3"
|
|
|
* new TinyColor().mostReadable('#a8015a', ["#faf3f3"], { includeFallbackColors:true, level: 'AAA', size: 'small' }).toHexString(); // "#ffffff"
|
|
|
* ```
|
|
|
*/
|
|
|
function mostReadable(baseColor, colorList, args) {
|
|
|
if (args === void 0) { args = { includeFallbackColors: false, level: 'AA', size: 'small' }; }
|
|
|
var bestColor = null;
|
|
|
var bestScore = 0;
|
|
|
var includeFallbackColors = args.includeFallbackColors, level = args.level, size = args.size;
|
|
|
for (var _i = 0, colorList_1 = colorList; _i < colorList_1.length; _i++) {
|
|
|
var color = colorList_1[_i];
|
|
|
var score = readability(baseColor, color);
|
|
|
if (score > bestScore) {
|
|
|
bestScore = score;
|
|
|
bestColor = new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(color);
|
|
|
}
|
|
|
}
|
|
|
if (isReadable(baseColor, bestColor, { level: level, size: size }) || !includeFallbackColors) {
|
|
|
return bestColor;
|
|
|
}
|
|
|
args.includeFallbackColors = false;
|
|
|
return mostReadable(baseColor, ['#fff', '#000'], args);
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/to-ms-filter.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/to-ms-filter.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "toMsFilter": () => (/* binding */ toMsFilter)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _conversion__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./conversion */ "./node_modules/@ctrl/tinycolor/dist/module/conversion.js");
|
|
|
/* harmony import */ var _index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./index */ "./node_modules/@ctrl/tinycolor/dist/module/index.js");
|
|
|
|
|
|
|
|
|
/**
|
|
|
* Returns the color represented as a Microsoft filter for use in old versions of IE.
|
|
|
*/
|
|
|
function toMsFilter(firstColor, secondColor) {
|
|
|
var color = new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(firstColor);
|
|
|
var hex8String = '#' + (0,_conversion__WEBPACK_IMPORTED_MODULE_1__.rgbaToArgbHex)(color.r, color.g, color.b, color.a);
|
|
|
var secondHex8String = hex8String;
|
|
|
var gradientType = color.gradientType ? 'GradientType = 1, ' : '';
|
|
|
if (secondColor) {
|
|
|
var s = new _index__WEBPACK_IMPORTED_MODULE_0__.TinyColor(secondColor);
|
|
|
secondHex8String = '#' + (0,_conversion__WEBPACK_IMPORTED_MODULE_1__.rgbaToArgbHex)(s.r, s.g, s.b, s.a);
|
|
|
}
|
|
|
return "progid:DXImageTransform.Microsoft.gradient(".concat(gradientType, "startColorstr=").concat(hex8String, ",endColorstr=").concat(secondHex8String, ")");
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@ctrl/tinycolor/dist/module/util.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/@ctrl/tinycolor/dist/module/util.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "bound01": () => (/* binding */ bound01),
|
|
|
/* harmony export */ "boundAlpha": () => (/* binding */ boundAlpha),
|
|
|
/* harmony export */ "clamp01": () => (/* binding */ clamp01),
|
|
|
/* harmony export */ "convertToPercentage": () => (/* binding */ convertToPercentage),
|
|
|
/* harmony export */ "isOnePointZero": () => (/* binding */ isOnePointZero),
|
|
|
/* harmony export */ "isPercentage": () => (/* binding */ isPercentage),
|
|
|
/* harmony export */ "pad2": () => (/* binding */ pad2)
|
|
|
/* harmony export */ });
|
|
|
/**
|
|
|
* Take input from [0, n] and return it as [0, 1]
|
|
|
* @hidden
|
|
|
*/
|
|
|
function bound01(n, max) {
|
|
|
if (isOnePointZero(n)) {
|
|
|
n = '100%';
|
|
|
}
|
|
|
var isPercent = isPercentage(n);
|
|
|
n = max === 360 ? n : Math.min(max, Math.max(0, parseFloat(n)));
|
|
|
// Automatically convert percentage into number
|
|
|
if (isPercent) {
|
|
|
n = parseInt(String(n * max), 10) / 100;
|
|
|
}
|
|
|
// Handle floating point rounding errors
|
|
|
if (Math.abs(n - max) < 0.000001) {
|
|
|
return 1;
|
|
|
}
|
|
|
// Convert into [0, 1] range if it isn't already
|
|
|
if (max === 360) {
|
|
|
// If n is a hue given in degrees,
|
|
|
// wrap around out-of-range values into [0, 360] range
|
|
|
// then convert into [0, 1].
|
|
|
n = (n < 0 ? (n % max) + max : n % max) / parseFloat(String(max));
|
|
|
}
|
|
|
else {
|
|
|
// If n not a hue given in degrees
|
|
|
// Convert into [0, 1] range if it isn't already.
|
|
|
n = (n % max) / parseFloat(String(max));
|
|
|
}
|
|
|
return n;
|
|
|
}
|
|
|
/**
|
|
|
* Force a number between 0 and 1
|
|
|
* @hidden
|
|
|
*/
|
|
|
function clamp01(val) {
|
|
|
return Math.min(1, Math.max(0, val));
|
|
|
}
|
|
|
/**
|
|
|
* Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1
|
|
|
* <http://stackoverflow.com/questions/7422072/javascript-how-to-detect-number-as-a-decimal-including-1-0>
|
|
|
* @hidden
|
|
|
*/
|
|
|
function isOnePointZero(n) {
|
|
|
return typeof n === 'string' && n.indexOf('.') !== -1 && parseFloat(n) === 1;
|
|
|
}
|
|
|
/**
|
|
|
* Check to see if string passed in is a percentage
|
|
|
* @hidden
|
|
|
*/
|
|
|
function isPercentage(n) {
|
|
|
return typeof n === 'string' && n.indexOf('%') !== -1;
|
|
|
}
|
|
|
/**
|
|
|
* Return a valid alpha value [0,1] with all invalid values being set to 1
|
|
|
* @hidden
|
|
|
*/
|
|
|
function boundAlpha(a) {
|
|
|
a = parseFloat(a);
|
|
|
if (isNaN(a) || a < 0 || a > 1) {
|
|
|
a = 1;
|
|
|
}
|
|
|
return a;
|
|
|
}
|
|
|
/**
|
|
|
* Replace a decimal with it's percentage value
|
|
|
* @hidden
|
|
|
*/
|
|
|
function convertToPercentage(n) {
|
|
|
if (n <= 1) {
|
|
|
return "".concat(Number(n) * 100, "%");
|
|
|
}
|
|
|
return n;
|
|
|
}
|
|
|
/**
|
|
|
* Force a hex value to have 2 characters
|
|
|
* @hidden
|
|
|
*/
|
|
|
function pad2(c) {
|
|
|
return c.length === 1 ? '0' + c : String(c);
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@emotion/hash/dist/hash.browser.esm.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/@emotion/hash/dist/hash.browser.esm.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* eslint-disable */
|
|
|
// Inspired by https://github.com/garycourt/murmurhash-js
|
|
|
// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86
|
|
|
function murmur2(str) {
|
|
|
// 'm' and 'r' are mixing constants generated offline.
|
|
|
// They're not really 'magic', they just happen to work well.
|
|
|
// const m = 0x5bd1e995;
|
|
|
// const r = 24;
|
|
|
// Initialize the hash
|
|
|
var h = 0; // Mix 4 bytes at a time into the hash
|
|
|
|
|
|
var k,
|
|
|
i = 0,
|
|
|
len = str.length;
|
|
|
|
|
|
for (; len >= 4; ++i, len -= 4) {
|
|
|
k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
|
|
|
k =
|
|
|
/* Math.imul(k, m): */
|
|
|
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);
|
|
|
k ^=
|
|
|
/* k >>> r: */
|
|
|
k >>> 24;
|
|
|
h =
|
|
|
/* Math.imul(k, m): */
|
|
|
(k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^
|
|
|
/* Math.imul(h, m): */
|
|
|
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
|
|
} // Handle the last few bytes of the input array
|
|
|
|
|
|
|
|
|
switch (len) {
|
|
|
case 3:
|
|
|
h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
|
|
|
|
|
|
case 2:
|
|
|
h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
|
|
|
|
|
|
case 1:
|
|
|
h ^= str.charCodeAt(i) & 0xff;
|
|
|
h =
|
|
|
/* Math.imul(h, m): */
|
|
|
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
|
|
} // Do a few final mixes of the hash to ensure the last few
|
|
|
// bytes are well-incorporated.
|
|
|
|
|
|
|
|
|
h ^= h >>> 13;
|
|
|
h =
|
|
|
/* Math.imul(h, m): */
|
|
|
(h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);
|
|
|
return ((h ^ h >>> 15) >>> 0).toString(36);
|
|
|
}
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (murmur2);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@emotion/unitless/dist/unitless.browser.esm.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@emotion/unitless/dist/unitless.browser.esm.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
var unitlessKeys = {
|
|
|
animationIterationCount: 1,
|
|
|
borderImageOutset: 1,
|
|
|
borderImageSlice: 1,
|
|
|
borderImageWidth: 1,
|
|
|
boxFlex: 1,
|
|
|
boxFlexGroup: 1,
|
|
|
boxOrdinalGroup: 1,
|
|
|
columnCount: 1,
|
|
|
columns: 1,
|
|
|
flex: 1,
|
|
|
flexGrow: 1,
|
|
|
flexPositive: 1,
|
|
|
flexShrink: 1,
|
|
|
flexNegative: 1,
|
|
|
flexOrder: 1,
|
|
|
gridRow: 1,
|
|
|
gridRowEnd: 1,
|
|
|
gridRowSpan: 1,
|
|
|
gridRowStart: 1,
|
|
|
gridColumn: 1,
|
|
|
gridColumnEnd: 1,
|
|
|
gridColumnSpan: 1,
|
|
|
gridColumnStart: 1,
|
|
|
msGridRow: 1,
|
|
|
msGridRowSpan: 1,
|
|
|
msGridColumn: 1,
|
|
|
msGridColumnSpan: 1,
|
|
|
fontWeight: 1,
|
|
|
lineHeight: 1,
|
|
|
opacity: 1,
|
|
|
order: 1,
|
|
|
orphans: 1,
|
|
|
tabSize: 1,
|
|
|
widows: 1,
|
|
|
zIndex: 1,
|
|
|
zoom: 1,
|
|
|
WebkitLineClamp: 1,
|
|
|
// SVG-related properties
|
|
|
fillOpacity: 1,
|
|
|
floodOpacity: 1,
|
|
|
stopOpacity: 1,
|
|
|
strokeDasharray: 1,
|
|
|
strokeDashoffset: 1,
|
|
|
strokeMiterlimit: 1,
|
|
|
strokeOpacity: 1,
|
|
|
strokeWidth: 1
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (unitlessKeys);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/reactNode.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/reactNode.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.cloneElement = cloneElement;
|
|
|
exports.isFragment = isFragment;
|
|
|
exports.isValidElement = void 0;
|
|
|
exports.replaceElement = replaceElement;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
const {
|
|
|
isValidElement
|
|
|
} = React;
|
|
|
exports.isValidElement = isValidElement;
|
|
|
function isFragment(child) {
|
|
|
return child && isValidElement(child) && child.type === React.Fragment;
|
|
|
}
|
|
|
function replaceElement(element, replacement, props) {
|
|
|
if (!isValidElement(element)) {
|
|
|
return replacement;
|
|
|
}
|
|
|
return /*#__PURE__*/React.cloneElement(element, typeof props === 'function' ? props(element.props || {}) : props);
|
|
|
}
|
|
|
function cloneElement(element, props) {
|
|
|
return replaceElement(element, element, props);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/warning.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/warning.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
exports.noop = noop;
|
|
|
Object.defineProperty(exports, "resetWarned", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _warning.resetWarned;
|
|
|
}
|
|
|
}));
|
|
|
var _warning = _interopRequireWildcard(__webpack_require__(/*! rc-util/lib/warning */ "./node_modules/rc-util/lib/warning.js"));
|
|
|
function noop() {}
|
|
|
// eslint-disable-next-line import/no-mutable-exports
|
|
|
let warning = noop;
|
|
|
if (true) {
|
|
|
warning = (valid, component, message) => {
|
|
|
(0, _warning.default)(valid, `[antd: ${component}] ${message}`);
|
|
|
// StrictMode will inject console which will not throw warning in React 17.
|
|
|
if (false) {}
|
|
|
};
|
|
|
}
|
|
|
var _default = warning;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/wave/WaveEffect.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/wave/WaveEffect.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = showWaveEffect;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _rcMotion = _interopRequireDefault(__webpack_require__(/*! rc-motion */ "./node_modules/rc-motion/es/index.js"));
|
|
|
var _raf = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/raf */ "./node_modules/rc-util/lib/raf.js"));
|
|
|
var _render = __webpack_require__(/*! rc-util/lib/React/render */ "./node_modules/rc-util/lib/React/render.js");
|
|
|
var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"));
|
|
|
var _util = __webpack_require__(/*! ./util */ "./node_modules/antd/lib/_util/wave/util.js");
|
|
|
function validateNum(value) {
|
|
|
return Number.isNaN(value) ? 0 : value;
|
|
|
}
|
|
|
const WaveEffect = props => {
|
|
|
const {
|
|
|
className,
|
|
|
target
|
|
|
} = props;
|
|
|
const divRef = React.useRef(null);
|
|
|
const [color, setWaveColor] = React.useState(null);
|
|
|
const [borderRadius, setBorderRadius] = React.useState([]);
|
|
|
const [left, setLeft] = React.useState(0);
|
|
|
const [top, setTop] = React.useState(0);
|
|
|
const [width, setWidth] = React.useState(0);
|
|
|
const [height, setHeight] = React.useState(0);
|
|
|
const [enabled, setEnabled] = React.useState(false);
|
|
|
const waveStyle = {
|
|
|
left,
|
|
|
top,
|
|
|
width,
|
|
|
height,
|
|
|
borderRadius: borderRadius.map(radius => `${radius}px`).join(' ')
|
|
|
};
|
|
|
if (color) {
|
|
|
waveStyle['--wave-color'] = color;
|
|
|
}
|
|
|
function syncPos() {
|
|
|
const nodeStyle = getComputedStyle(target);
|
|
|
// Get wave color from target
|
|
|
setWaveColor((0, _util.getTargetWaveColor)(target));
|
|
|
const isStatic = nodeStyle.position === 'static';
|
|
|
// Rect
|
|
|
const {
|
|
|
borderLeftWidth,
|
|
|
borderTopWidth
|
|
|
} = nodeStyle;
|
|
|
setLeft(isStatic ? target.offsetLeft : validateNum(-parseFloat(borderLeftWidth)));
|
|
|
setTop(isStatic ? target.offsetTop : validateNum(-parseFloat(borderTopWidth)));
|
|
|
setWidth(target.offsetWidth);
|
|
|
setHeight(target.offsetHeight);
|
|
|
// Get border radius
|
|
|
const {
|
|
|
borderTopLeftRadius,
|
|
|
borderTopRightRadius,
|
|
|
borderBottomLeftRadius,
|
|
|
borderBottomRightRadius
|
|
|
} = nodeStyle;
|
|
|
setBorderRadius([borderTopLeftRadius, borderTopRightRadius, borderBottomRightRadius, borderBottomLeftRadius].map(radius => validateNum(parseFloat(radius))));
|
|
|
}
|
|
|
React.useEffect(() => {
|
|
|
if (target) {
|
|
|
// We need delay to check position here
|
|
|
// since UI may change after click
|
|
|
const id = (0, _raf.default)(() => {
|
|
|
syncPos();
|
|
|
setEnabled(true);
|
|
|
});
|
|
|
// Add resize observer to follow size
|
|
|
let resizeObserver;
|
|
|
if (typeof ResizeObserver !== 'undefined') {
|
|
|
resizeObserver = new ResizeObserver(syncPos);
|
|
|
resizeObserver.observe(target);
|
|
|
}
|
|
|
return () => {
|
|
|
_raf.default.cancel(id);
|
|
|
resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.disconnect();
|
|
|
};
|
|
|
}
|
|
|
}, []);
|
|
|
if (!enabled) {
|
|
|
return null;
|
|
|
}
|
|
|
return /*#__PURE__*/React.createElement(_rcMotion.default, {
|
|
|
visible: true,
|
|
|
motionAppear: true,
|
|
|
motionName: "wave-motion",
|
|
|
motionDeadline: 5000,
|
|
|
onAppearEnd: (_, event) => {
|
|
|
var _a;
|
|
|
if (event.deadline || event.propertyName === 'opacity') {
|
|
|
const holder = (_a = divRef.current) === null || _a === void 0 ? void 0 : _a.parentElement;
|
|
|
(0, _render.unmount)(holder).then(() => {
|
|
|
var _a;
|
|
|
(_a = holder.parentElement) === null || _a === void 0 ? void 0 : _a.removeChild(holder);
|
|
|
});
|
|
|
}
|
|
|
return false;
|
|
|
}
|
|
|
}, _ref => {
|
|
|
let {
|
|
|
className: motionClassName
|
|
|
} = _ref;
|
|
|
return /*#__PURE__*/React.createElement("div", {
|
|
|
ref: divRef,
|
|
|
className: (0, _classnames.default)(className, motionClassName),
|
|
|
style: waveStyle
|
|
|
});
|
|
|
});
|
|
|
};
|
|
|
function showWaveEffect(node, className) {
|
|
|
// Create holder
|
|
|
const holder = document.createElement('div');
|
|
|
holder.style.position = 'absolute';
|
|
|
holder.style.left = `0px`;
|
|
|
holder.style.top = `0px`;
|
|
|
node === null || node === void 0 ? void 0 : node.insertBefore(holder, node === null || node === void 0 ? void 0 : node.firstChild);
|
|
|
(0, _render.render)( /*#__PURE__*/React.createElement(WaveEffect, {
|
|
|
target: node,
|
|
|
className: className
|
|
|
}), holder);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/wave/index.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/wave/index.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"));
|
|
|
var _ref = __webpack_require__(/*! rc-util/lib/ref */ "./node_modules/rc-util/lib/ref.js");
|
|
|
var _isVisible = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/Dom/isVisible */ "./node_modules/rc-util/lib/Dom/isVisible.js"));
|
|
|
var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _configProvider = __webpack_require__(/*! ../../config-provider */ "./node_modules/antd/lib/config-provider/index.js");
|
|
|
var _reactNode = __webpack_require__(/*! ../reactNode */ "./node_modules/antd/lib/_util/reactNode.js");
|
|
|
var _style = _interopRequireDefault(__webpack_require__(/*! ./style */ "./node_modules/antd/lib/_util/wave/style.js"));
|
|
|
var _useWave = _interopRequireDefault(__webpack_require__(/*! ./useWave */ "./node_modules/antd/lib/_util/wave/useWave.js"));
|
|
|
const Wave = props => {
|
|
|
const {
|
|
|
children,
|
|
|
disabled
|
|
|
} = props;
|
|
|
const {
|
|
|
getPrefixCls
|
|
|
} = (0, _react.useContext)(_configProvider.ConfigContext);
|
|
|
const containerRef = (0, _react.useRef)(null);
|
|
|
// ============================== Style ===============================
|
|
|
const prefixCls = getPrefixCls('wave');
|
|
|
const [, hashId] = (0, _style.default)(prefixCls);
|
|
|
// =============================== Wave ===============================
|
|
|
const showWave = (0, _useWave.default)(containerRef, (0, _classnames.default)(prefixCls, hashId));
|
|
|
// ============================== Effect ==============================
|
|
|
_react.default.useEffect(() => {
|
|
|
const node = containerRef.current;
|
|
|
if (!node || node.nodeType !== 1 || disabled) {
|
|
|
return;
|
|
|
}
|
|
|
// Click handler
|
|
|
const onClick = e => {
|
|
|
// Fix radio button click twice
|
|
|
if (e.target.tagName === 'INPUT' || !(0, _isVisible.default)(e.target) ||
|
|
|
// No need wave
|
|
|
!node.getAttribute || node.getAttribute('disabled') || node.disabled || node.className.includes('disabled') || node.className.includes('-leave')) {
|
|
|
return;
|
|
|
}
|
|
|
showWave();
|
|
|
};
|
|
|
// Bind events
|
|
|
node.addEventListener('click', onClick, true);
|
|
|
return () => {
|
|
|
node.removeEventListener('click', onClick, true);
|
|
|
};
|
|
|
}, [disabled]);
|
|
|
// ============================== Render ==============================
|
|
|
if (! /*#__PURE__*/_react.default.isValidElement(children)) {
|
|
|
return children !== null && children !== void 0 ? children : null;
|
|
|
}
|
|
|
const ref = (0, _ref.supportRef)(children) ? (0, _ref.composeRef)(children.ref, containerRef) : containerRef;
|
|
|
return (0, _reactNode.cloneElement)(children, {
|
|
|
ref
|
|
|
});
|
|
|
};
|
|
|
if (true) {
|
|
|
Wave.displayName = 'Wave';
|
|
|
}
|
|
|
var _default = Wave;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/wave/style.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/wave/style.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _internal = __webpack_require__(/*! ../../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
const genWaveStyle = token => {
|
|
|
const {
|
|
|
componentCls,
|
|
|
colorPrimary
|
|
|
} = token;
|
|
|
return {
|
|
|
[componentCls]: {
|
|
|
position: 'absolute',
|
|
|
background: 'transparent',
|
|
|
pointerEvents: 'none',
|
|
|
boxSizing: 'border-box',
|
|
|
color: `var(--wave-color, ${colorPrimary})`,
|
|
|
boxShadow: `0 0 0 0 currentcolor`,
|
|
|
opacity: 0.2,
|
|
|
// =================== Motion ===================
|
|
|
'&.wave-motion-appear': {
|
|
|
transition: [`box-shadow 0.4s ${token.motionEaseOutCirc}`, `opacity 2s ${token.motionEaseOutCirc}`].join(','),
|
|
|
'&-active': {
|
|
|
boxShadow: `0 0 0 6px currentcolor`,
|
|
|
opacity: 0
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
var _default = (0, _internal.genComponentStyleHook)('Wave', token => [genWaveStyle(token)]);
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/wave/useWave.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/wave/useWave.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = useWave;
|
|
|
var _WaveEffect = _interopRequireDefault(__webpack_require__(/*! ./WaveEffect */ "./node_modules/antd/lib/_util/wave/WaveEffect.js"));
|
|
|
function useWave(nodeRef, className) {
|
|
|
function showWave() {
|
|
|
const node = nodeRef.current;
|
|
|
(0, _WaveEffect.default)(node, className);
|
|
|
}
|
|
|
return showWave;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/_util/wave/util.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/_util/wave/util.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.getTargetWaveColor = getTargetWaveColor;
|
|
|
exports.isNotGrey = isNotGrey;
|
|
|
exports.isValidWaveColor = isValidWaveColor;
|
|
|
function isNotGrey(color) {
|
|
|
// eslint-disable-next-line no-useless-escape
|
|
|
const match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\d.]*)?\)/);
|
|
|
if (match && match[1] && match[2] && match[3]) {
|
|
|
return !(match[1] === match[2] && match[2] === match[3]);
|
|
|
}
|
|
|
return true;
|
|
|
}
|
|
|
function isValidWaveColor(color) {
|
|
|
return color && color !== '#fff' && color !== '#ffffff' && color !== 'rgb(255, 255, 255)' && color !== 'rgba(255, 255, 255, 1)' && isNotGrey(color) && !/rgba\((?:\d*, ){3}0\)/.test(color) &&
|
|
|
// any transparent rgba color
|
|
|
color !== 'transparent';
|
|
|
}
|
|
|
function getTargetWaveColor(node) {
|
|
|
const {
|
|
|
borderTopColor,
|
|
|
borderColor,
|
|
|
backgroundColor
|
|
|
} = getComputedStyle(node);
|
|
|
if (isValidWaveColor(borderTopColor)) {
|
|
|
return borderTopColor;
|
|
|
}
|
|
|
if (isValidWaveColor(borderColor)) {
|
|
|
return borderColor;
|
|
|
}
|
|
|
if (isValidWaveColor(backgroundColor)) {
|
|
|
return backgroundColor;
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/LoadingIcon.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/LoadingIcon.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _LoadingOutlined = _interopRequireDefault(__webpack_require__(/*! @ant-design/icons/LoadingOutlined */ "./node_modules/@ant-design/icons/LoadingOutlined.js"));
|
|
|
var _rcMotion = _interopRequireDefault(__webpack_require__(/*! rc-motion */ "./node_modules/rc-motion/es/index.js"));
|
|
|
var _react = _interopRequireDefault(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
const getCollapsedWidth = () => ({
|
|
|
width: 0,
|
|
|
opacity: 0,
|
|
|
transform: 'scale(0)'
|
|
|
});
|
|
|
const getRealWidth = node => ({
|
|
|
width: node.scrollWidth,
|
|
|
opacity: 1,
|
|
|
transform: 'scale(1)'
|
|
|
});
|
|
|
const LoadingIcon = _ref => {
|
|
|
let {
|
|
|
prefixCls,
|
|
|
loading,
|
|
|
existIcon
|
|
|
} = _ref;
|
|
|
const visible = !!loading;
|
|
|
if (existIcon) {
|
|
|
return /*#__PURE__*/_react.default.createElement("span", {
|
|
|
className: `${prefixCls}-loading-icon`
|
|
|
}, /*#__PURE__*/_react.default.createElement(_LoadingOutlined.default, null));
|
|
|
}
|
|
|
return /*#__PURE__*/_react.default.createElement(_rcMotion.default, {
|
|
|
visible: visible,
|
|
|
// We do not really use this motionName
|
|
|
motionName: `${prefixCls}-loading-icon-motion`,
|
|
|
removeOnLeave: true,
|
|
|
onAppearStart: getCollapsedWidth,
|
|
|
onAppearActive: getRealWidth,
|
|
|
onEnterStart: getCollapsedWidth,
|
|
|
onEnterActive: getRealWidth,
|
|
|
onLeaveStart: getRealWidth,
|
|
|
onLeaveActive: getCollapsedWidth
|
|
|
}, (_ref2, ref) => {
|
|
|
let {
|
|
|
className,
|
|
|
style
|
|
|
} = _ref2;
|
|
|
return /*#__PURE__*/_react.default.createElement("span", {
|
|
|
className: `${prefixCls}-loading-icon`,
|
|
|
style: style,
|
|
|
ref: ref
|
|
|
}, /*#__PURE__*/_react.default.createElement(_LoadingOutlined.default, {
|
|
|
className: className
|
|
|
}));
|
|
|
});
|
|
|
};
|
|
|
var _default = LoadingIcon;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/button-group.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/button-group.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = exports.GroupSizeContext = void 0;
|
|
|
var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"));
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _configProvider = __webpack_require__(/*! ../config-provider */ "./node_modules/antd/lib/config-provider/index.js");
|
|
|
var _internal = __webpack_require__(/*! ../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! ../_util/warning */ "./node_modules/antd/lib/_util/warning.js"));
|
|
|
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
|
var t = {};
|
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
|
}
|
|
|
return t;
|
|
|
};
|
|
|
const GroupSizeContext = /*#__PURE__*/React.createContext(undefined);
|
|
|
exports.GroupSizeContext = GroupSizeContext;
|
|
|
const ButtonGroup = props => {
|
|
|
const {
|
|
|
getPrefixCls,
|
|
|
direction
|
|
|
} = React.useContext(_configProvider.ConfigContext);
|
|
|
const {
|
|
|
prefixCls: customizePrefixCls,
|
|
|
size,
|
|
|
className
|
|
|
} = props,
|
|
|
others = __rest(props, ["prefixCls", "size", "className"]);
|
|
|
const prefixCls = getPrefixCls('btn-group', customizePrefixCls);
|
|
|
const [,, hashId] = (0, _internal.useToken)();
|
|
|
let sizeCls = '';
|
|
|
switch (size) {
|
|
|
case 'large':
|
|
|
sizeCls = 'lg';
|
|
|
break;
|
|
|
case 'small':
|
|
|
sizeCls = 'sm';
|
|
|
break;
|
|
|
case 'middle':
|
|
|
case undefined:
|
|
|
break;
|
|
|
default:
|
|
|
true ? (0, _warning.default)(!size, 'Button.Group', 'Invalid prop `size`.') : 0;
|
|
|
}
|
|
|
const classes = (0, _classnames.default)(prefixCls, {
|
|
|
[`${prefixCls}-${sizeCls}`]: sizeCls,
|
|
|
[`${prefixCls}-rtl`]: direction === 'rtl'
|
|
|
}, className, hashId);
|
|
|
return /*#__PURE__*/React.createElement(GroupSizeContext.Provider, {
|
|
|
value: size
|
|
|
}, /*#__PURE__*/React.createElement("div", Object.assign({}, others, {
|
|
|
className: classes
|
|
|
})));
|
|
|
};
|
|
|
var _default = ButtonGroup;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/button.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/button.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.convertLegacyProps = convertLegacyProps;
|
|
|
exports["default"] = void 0;
|
|
|
var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"));
|
|
|
var _omit = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/omit */ "./node_modules/rc-util/lib/omit.js"));
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _configProvider = __webpack_require__(/*! ../config-provider */ "./node_modules/antd/lib/config-provider/index.js");
|
|
|
var _DisabledContext = _interopRequireDefault(__webpack_require__(/*! ../config-provider/DisabledContext */ "./node_modules/antd/lib/config-provider/DisabledContext.js"));
|
|
|
var _SizeContext = _interopRequireDefault(__webpack_require__(/*! ../config-provider/SizeContext */ "./node_modules/antd/lib/config-provider/SizeContext.js"));
|
|
|
var _Compact = __webpack_require__(/*! ../space/Compact */ "./node_modules/antd/lib/space/Compact.js");
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! ../_util/warning */ "./node_modules/antd/lib/_util/warning.js"));
|
|
|
var _wave = _interopRequireDefault(__webpack_require__(/*! ../_util/wave */ "./node_modules/antd/lib/_util/wave/index.js"));
|
|
|
var _buttonGroup = _interopRequireWildcard(__webpack_require__(/*! ./button-group */ "./node_modules/antd/lib/button/button-group.js"));
|
|
|
var _buttonHelpers = __webpack_require__(/*! ./buttonHelpers */ "./node_modules/antd/lib/button/buttonHelpers.js");
|
|
|
var _LoadingIcon = _interopRequireDefault(__webpack_require__(/*! ./LoadingIcon */ "./node_modules/antd/lib/button/LoadingIcon.js"));
|
|
|
var _style = _interopRequireDefault(__webpack_require__(/*! ./style */ "./node_modules/antd/lib/button/style/index.js"));
|
|
|
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
|
var t = {};
|
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
|
}
|
|
|
return t;
|
|
|
};
|
|
|
/* eslint-disable react/button-has-type */
|
|
|
|
|
|
function convertLegacyProps(type) {
|
|
|
if (type === 'danger') {
|
|
|
return {
|
|
|
danger: true
|
|
|
};
|
|
|
}
|
|
|
return {
|
|
|
type
|
|
|
};
|
|
|
}
|
|
|
function getLoadingConfig(loading) {
|
|
|
if (typeof loading === 'object' && loading) {
|
|
|
const delay = loading === null || loading === void 0 ? void 0 : loading.delay;
|
|
|
const isDelay = !Number.isNaN(delay) && typeof delay === 'number';
|
|
|
return {
|
|
|
loading: false,
|
|
|
delay: isDelay ? delay : 0
|
|
|
};
|
|
|
}
|
|
|
return {
|
|
|
loading: !!loading,
|
|
|
delay: 0
|
|
|
};
|
|
|
}
|
|
|
const InternalButton = (props, ref) => {
|
|
|
const {
|
|
|
loading = false,
|
|
|
prefixCls: customizePrefixCls,
|
|
|
type = 'default',
|
|
|
danger,
|
|
|
shape = 'default',
|
|
|
size: customizeSize,
|
|
|
disabled: customDisabled,
|
|
|
className,
|
|
|
rootClassName,
|
|
|
children,
|
|
|
icon,
|
|
|
ghost = false,
|
|
|
block = false,
|
|
|
// React does not recognize the `htmlType` prop on a DOM element. Here we pick it out of `rest`.
|
|
|
htmlType = 'button'
|
|
|
} = props,
|
|
|
rest = __rest(props, ["loading", "prefixCls", "type", "danger", "shape", "size", "disabled", "className", "rootClassName", "children", "icon", "ghost", "block", "htmlType"]);
|
|
|
const {
|
|
|
getPrefixCls,
|
|
|
autoInsertSpaceInButton,
|
|
|
direction
|
|
|
} = React.useContext(_configProvider.ConfigContext);
|
|
|
const prefixCls = getPrefixCls('btn', customizePrefixCls);
|
|
|
const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
|
|
|
const size = React.useContext(_SizeContext.default);
|
|
|
const disabled = React.useContext(_DisabledContext.default);
|
|
|
const mergedDisabled = customDisabled !== null && customDisabled !== void 0 ? customDisabled : disabled;
|
|
|
const groupSize = React.useContext(_buttonGroup.GroupSizeContext);
|
|
|
const loadingOrDelay = React.useMemo(() => getLoadingConfig(loading), [loading]);
|
|
|
const [innerLoading, setLoading] = React.useState(loadingOrDelay.loading);
|
|
|
const [hasTwoCNChar, setHasTwoCNChar] = React.useState(false);
|
|
|
const buttonRef = ref || /*#__PURE__*/React.createRef();
|
|
|
const isNeedInserted = () => React.Children.count(children) === 1 && !icon && !(0, _buttonHelpers.isUnBorderedButtonType)(type);
|
|
|
const fixTwoCNChar = () => {
|
|
|
// FIXME: for HOC usage like <FormatMessage />
|
|
|
if (!buttonRef || !buttonRef.current || autoInsertSpaceInButton === false) {
|
|
|
return;
|
|
|
}
|
|
|
const buttonText = buttonRef.current.textContent;
|
|
|
if (isNeedInserted() && (0, _buttonHelpers.isTwoCNChar)(buttonText)) {
|
|
|
if (!hasTwoCNChar) {
|
|
|
setHasTwoCNChar(true);
|
|
|
}
|
|
|
} else if (hasTwoCNChar) {
|
|
|
setHasTwoCNChar(false);
|
|
|
}
|
|
|
};
|
|
|
React.useEffect(() => {
|
|
|
let delayTimer = null;
|
|
|
if (loadingOrDelay.delay > 0) {
|
|
|
delayTimer = window.setTimeout(() => {
|
|
|
delayTimer = null;
|
|
|
setLoading(true);
|
|
|
}, loadingOrDelay.delay);
|
|
|
} else {
|
|
|
setLoading(loadingOrDelay.loading);
|
|
|
}
|
|
|
function cleanupTimer() {
|
|
|
if (delayTimer) {
|
|
|
window.clearTimeout(delayTimer);
|
|
|
delayTimer = null;
|
|
|
}
|
|
|
}
|
|
|
return cleanupTimer;
|
|
|
}, [loadingOrDelay]);
|
|
|
React.useEffect(fixTwoCNChar, [buttonRef]);
|
|
|
const handleClick = e => {
|
|
|
const {
|
|
|
onClick
|
|
|
} = props;
|
|
|
// FIXME: https://github.com/ant-design/ant-design/issues/30207
|
|
|
if (innerLoading || mergedDisabled) {
|
|
|
e.preventDefault();
|
|
|
return;
|
|
|
}
|
|
|
onClick === null || onClick === void 0 ? void 0 : onClick(e);
|
|
|
};
|
|
|
true ? (0, _warning.default)(!(typeof icon === 'string' && icon.length > 2), 'Button', `\`icon\` is using ReactNode instead of string naming in v4. Please check \`${icon}\` at https://ant.design/components/icon`) : 0;
|
|
|
true ? (0, _warning.default)(!(ghost && (0, _buttonHelpers.isUnBorderedButtonType)(type)), 'Button', "`link` or `text` button can't be a `ghost` button.") : 0;
|
|
|
const autoInsertSpace = autoInsertSpaceInButton !== false;
|
|
|
const {
|
|
|
compactSize,
|
|
|
compactItemClassnames
|
|
|
} = (0, _Compact.useCompactItemContext)(prefixCls, direction);
|
|
|
const sizeClassNameMap = {
|
|
|
large: 'lg',
|
|
|
small: 'sm',
|
|
|
middle: undefined
|
|
|
};
|
|
|
const sizeFullname = compactSize || groupSize || customizeSize || size;
|
|
|
const sizeCls = sizeFullname ? sizeClassNameMap[sizeFullname] || '' : '';
|
|
|
const iconType = innerLoading ? 'loading' : icon;
|
|
|
const linkButtonRestProps = (0, _omit.default)(rest, ['navigate']);
|
|
|
const hrefAndDisabled = linkButtonRestProps.href !== undefined && mergedDisabled;
|
|
|
const classes = (0, _classnames.default)(prefixCls, hashId, {
|
|
|
[`${prefixCls}-${shape}`]: shape !== 'default' && shape,
|
|
|
[`${prefixCls}-${type}`]: type,
|
|
|
[`${prefixCls}-${sizeCls}`]: sizeCls,
|
|
|
[`${prefixCls}-icon-only`]: !children && children !== 0 && !!iconType,
|
|
|
[`${prefixCls}-background-ghost`]: ghost && !(0, _buttonHelpers.isUnBorderedButtonType)(type),
|
|
|
[`${prefixCls}-loading`]: innerLoading,
|
|
|
[`${prefixCls}-two-chinese-chars`]: hasTwoCNChar && autoInsertSpace && !innerLoading,
|
|
|
[`${prefixCls}-block`]: block,
|
|
|
[`${prefixCls}-dangerous`]: !!danger,
|
|
|
[`${prefixCls}-rtl`]: direction === 'rtl',
|
|
|
[`${prefixCls}-disabled`]: hrefAndDisabled
|
|
|
}, compactItemClassnames, className, rootClassName);
|
|
|
const iconNode = icon && !innerLoading ? icon : /*#__PURE__*/React.createElement(_LoadingIcon.default, {
|
|
|
existIcon: !!icon,
|
|
|
prefixCls: prefixCls,
|
|
|
loading: !!innerLoading
|
|
|
});
|
|
|
const kids = children || children === 0 ? (0, _buttonHelpers.spaceChildren)(children, isNeedInserted() && autoInsertSpace) : null;
|
|
|
if (linkButtonRestProps.href !== undefined) {
|
|
|
return wrapSSR( /*#__PURE__*/React.createElement("a", Object.assign({}, linkButtonRestProps, {
|
|
|
className: classes,
|
|
|
onClick: handleClick,
|
|
|
ref: buttonRef
|
|
|
}), iconNode, kids));
|
|
|
}
|
|
|
let buttonNode = /*#__PURE__*/React.createElement("button", Object.assign({}, rest, {
|
|
|
type: htmlType,
|
|
|
className: classes,
|
|
|
onClick: handleClick,
|
|
|
disabled: mergedDisabled,
|
|
|
ref: buttonRef
|
|
|
}), iconNode, kids);
|
|
|
if (!(0, _buttonHelpers.isUnBorderedButtonType)(type)) {
|
|
|
buttonNode = /*#__PURE__*/React.createElement(_wave.default, {
|
|
|
disabled: !!innerLoading
|
|
|
}, buttonNode);
|
|
|
}
|
|
|
return wrapSSR(buttonNode);
|
|
|
};
|
|
|
const Button = /*#__PURE__*/React.forwardRef(InternalButton);
|
|
|
if (true) {
|
|
|
Button.displayName = 'Button';
|
|
|
}
|
|
|
Button.Group = _buttonGroup.default;
|
|
|
Button.__ANT_BUTTON = true;
|
|
|
var _default = Button;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/buttonHelpers.js":
|
|
|
/*!*******************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/buttonHelpers.js ***!
|
|
|
\*******************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.isString = isString;
|
|
|
exports.isTwoCNChar = void 0;
|
|
|
exports.isUnBorderedButtonType = isUnBorderedButtonType;
|
|
|
exports.spaceChildren = spaceChildren;
|
|
|
var _react = _interopRequireDefault(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _reactNode = __webpack_require__(/*! ../_util/reactNode */ "./node_modules/antd/lib/_util/reactNode.js");
|
|
|
const rxTwoCNChar = /^[\u4e00-\u9fa5]{2}$/;
|
|
|
const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar);
|
|
|
exports.isTwoCNChar = isTwoCNChar;
|
|
|
function isString(str) {
|
|
|
return typeof str === 'string';
|
|
|
}
|
|
|
function isUnBorderedButtonType(type) {
|
|
|
return type === 'text' || type === 'link';
|
|
|
}
|
|
|
function splitCNCharsBySpace(child, needInserted) {
|
|
|
if (child === null || child === undefined) {
|
|
|
return;
|
|
|
}
|
|
|
const SPACE = needInserted ? ' ' : '';
|
|
|
if (typeof child !== 'string' && typeof child !== 'number' && isString(child.type) && isTwoCNChar(child.props.children)) {
|
|
|
return (0, _reactNode.cloneElement)(child, {
|
|
|
children: child.props.children.split('').join(SPACE)
|
|
|
});
|
|
|
}
|
|
|
if (typeof child === 'string') {
|
|
|
return isTwoCNChar(child) ? /*#__PURE__*/_react.default.createElement("span", null, child.split('').join(SPACE)) : /*#__PURE__*/_react.default.createElement("span", null, child);
|
|
|
}
|
|
|
if ((0, _reactNode.isFragment)(child)) {
|
|
|
return /*#__PURE__*/_react.default.createElement("span", null, child);
|
|
|
}
|
|
|
return child;
|
|
|
}
|
|
|
function spaceChildren(children, needInserted) {
|
|
|
let isPrevChildPure = false;
|
|
|
const childList = [];
|
|
|
_react.default.Children.forEach(children, child => {
|
|
|
const type = typeof child;
|
|
|
const isCurrentChildPure = type === 'string' || type === 'number';
|
|
|
if (isPrevChildPure && isCurrentChildPure) {
|
|
|
const lastIndex = childList.length - 1;
|
|
|
const lastChild = childList[lastIndex];
|
|
|
childList[lastIndex] = `${lastChild}${child}`;
|
|
|
} else {
|
|
|
childList.push(child);
|
|
|
}
|
|
|
isPrevChildPure = isCurrentChildPure;
|
|
|
});
|
|
|
return _react.default.Children.map(childList, child => splitCNCharsBySpace(child, needInserted));
|
|
|
}
|
|
|
const ButtonTypes = ['default', 'primary', 'ghost', 'dashed', 'link', 'text'];
|
|
|
const ButtonShapes = ['default', 'circle', 'round'];
|
|
|
const ButtonHTMLTypes = ['submit', 'button', 'reset'];
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/index.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/index.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
var _exportNames = {};
|
|
|
exports["default"] = void 0;
|
|
|
var _button = _interopRequireDefault(__webpack_require__(/*! ./button */ "./node_modules/antd/lib/button/button.js"));
|
|
|
var _buttonHelpers = __webpack_require__(/*! ./buttonHelpers */ "./node_modules/antd/lib/button/buttonHelpers.js");
|
|
|
Object.keys(_buttonHelpers).forEach(function (key) {
|
|
|
if (key === "default" || key === "__esModule") return;
|
|
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
|
if (key in exports && exports[key] === _buttonHelpers[key]) return;
|
|
|
Object.defineProperty(exports, key, {
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _buttonHelpers[key];
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
var _default = _button.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/style/group.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/style/group.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const genButtonBorderStyle = (buttonTypeCls, borderColor) => ({
|
|
|
// Border
|
|
|
[`> span, > ${buttonTypeCls}`]: {
|
|
|
'&:not(:last-child)': {
|
|
|
[`&, & > ${buttonTypeCls}`]: {
|
|
|
'&:not(:disabled)': {
|
|
|
borderInlineEndColor: borderColor
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
'&:not(:first-child)': {
|
|
|
[`&, & > ${buttonTypeCls}`]: {
|
|
|
'&:not(:disabled)': {
|
|
|
borderInlineStartColor: borderColor
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
const genGroupStyle = token => {
|
|
|
const {
|
|
|
componentCls,
|
|
|
fontSize,
|
|
|
lineWidth,
|
|
|
colorPrimaryHover,
|
|
|
colorErrorHover
|
|
|
} = token;
|
|
|
return {
|
|
|
[`${componentCls}-group`]: [{
|
|
|
position: 'relative',
|
|
|
display: 'inline-flex',
|
|
|
// Border
|
|
|
[`> span, > ${componentCls}`]: {
|
|
|
'&:not(:last-child)': {
|
|
|
[`&, & > ${componentCls}`]: {
|
|
|
borderStartEndRadius: 0,
|
|
|
borderEndEndRadius: 0
|
|
|
}
|
|
|
},
|
|
|
'&:not(:first-child)': {
|
|
|
marginInlineStart: -lineWidth,
|
|
|
[`&, & > ${componentCls}`]: {
|
|
|
borderStartStartRadius: 0,
|
|
|
borderEndStartRadius: 0
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
[componentCls]: {
|
|
|
position: 'relative',
|
|
|
zIndex: 1,
|
|
|
[`&:hover,
|
|
|
&:focus,
|
|
|
&:active`]: {
|
|
|
zIndex: 2
|
|
|
},
|
|
|
'&[disabled]': {
|
|
|
zIndex: 0
|
|
|
}
|
|
|
},
|
|
|
[`${componentCls}-icon-only`]: {
|
|
|
fontSize
|
|
|
}
|
|
|
},
|
|
|
// Border Color
|
|
|
genButtonBorderStyle(`${componentCls}-primary`, colorPrimaryHover), genButtonBorderStyle(`${componentCls}-danger`, colorErrorHover)]
|
|
|
};
|
|
|
};
|
|
|
var _default = genGroupStyle;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/button/style/index.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/button/style/index.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _internal = __webpack_require__(/*! ../../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
var _group = _interopRequireDefault(__webpack_require__(/*! ./group */ "./node_modules/antd/lib/button/style/group.js"));
|
|
|
var _style = __webpack_require__(/*! ../../style */ "./node_modules/antd/lib/style/index.js");
|
|
|
var _compactItem = __webpack_require__(/*! ../../style/compact-item */ "./node_modules/antd/lib/style/compact-item.js");
|
|
|
var _compactItemVertical = __webpack_require__(/*! ../../style/compact-item-vertical */ "./node_modules/antd/lib/style/compact-item-vertical.js");
|
|
|
// ============================== Shared ==============================
|
|
|
const genSharedButtonStyle = token => {
|
|
|
const {
|
|
|
componentCls,
|
|
|
iconCls
|
|
|
} = token;
|
|
|
return {
|
|
|
[componentCls]: {
|
|
|
outline: 'none',
|
|
|
position: 'relative',
|
|
|
display: 'inline-block',
|
|
|
fontWeight: 400,
|
|
|
whiteSpace: 'nowrap',
|
|
|
textAlign: 'center',
|
|
|
backgroundImage: 'none',
|
|
|
backgroundColor: 'transparent',
|
|
|
border: `${token.lineWidth}px ${token.lineType} transparent`,
|
|
|
cursor: 'pointer',
|
|
|
transition: `all ${token.motionDurationMid} ${token.motionEaseInOut}`,
|
|
|
userSelect: 'none',
|
|
|
touchAction: 'manipulation',
|
|
|
lineHeight: token.lineHeight,
|
|
|
color: token.colorText,
|
|
|
'> span': {
|
|
|
display: 'inline-block'
|
|
|
},
|
|
|
// Leave a space between icon and text.
|
|
|
[`> ${iconCls} + span, > span + ${iconCls}`]: {
|
|
|
marginInlineStart: token.marginXS
|
|
|
},
|
|
|
'> a': {
|
|
|
color: 'currentColor'
|
|
|
},
|
|
|
'&:not(:disabled)': Object.assign({}, (0, _style.genFocusStyle)(token)),
|
|
|
// make `btn-icon-only` not too narrow
|
|
|
[`&-icon-only${componentCls}-compact-item`]: {
|
|
|
flex: 'none'
|
|
|
},
|
|
|
// Special styles for Primary Button
|
|
|
[`&-compact-item${componentCls}-primary`]: {
|
|
|
[`&:not([disabled]) + ${componentCls}-compact-item${componentCls}-primary:not([disabled])`]: {
|
|
|
position: 'relative',
|
|
|
'&:before': {
|
|
|
position: 'absolute',
|
|
|
top: -token.lineWidth,
|
|
|
insetInlineStart: -token.lineWidth,
|
|
|
display: 'inline-block',
|
|
|
width: token.lineWidth,
|
|
|
height: `calc(100% + ${token.lineWidth * 2}px)`,
|
|
|
backgroundColor: token.colorPrimaryHover,
|
|
|
content: '""'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// Special styles for Primary Button
|
|
|
'&-compact-vertical-item': {
|
|
|
[`&${componentCls}-primary`]: {
|
|
|
[`&:not([disabled]) + ${componentCls}-compact-vertical-item${componentCls}-primary:not([disabled])`]: {
|
|
|
position: 'relative',
|
|
|
'&:before': {
|
|
|
position: 'absolute',
|
|
|
top: -token.lineWidth,
|
|
|
insetInlineStart: -token.lineWidth,
|
|
|
display: 'inline-block',
|
|
|
width: `calc(100% + ${token.lineWidth * 2}px)`,
|
|
|
height: token.lineWidth,
|
|
|
backgroundColor: token.colorPrimaryHover,
|
|
|
content: '""'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
const genHoverActiveButtonStyle = (hoverStyle, activeStyle) => ({
|
|
|
'&:not(:disabled)': {
|
|
|
'&:hover': hoverStyle,
|
|
|
'&:active': activeStyle
|
|
|
}
|
|
|
});
|
|
|
// ============================== Shape ===============================
|
|
|
const genCircleButtonStyle = token => ({
|
|
|
minWidth: token.controlHeight,
|
|
|
paddingInlineStart: 0,
|
|
|
paddingInlineEnd: 0,
|
|
|
borderRadius: '50%'
|
|
|
});
|
|
|
const genRoundButtonStyle = token => ({
|
|
|
borderRadius: token.controlHeight,
|
|
|
paddingInlineStart: token.controlHeight / 2,
|
|
|
paddingInlineEnd: token.controlHeight / 2
|
|
|
});
|
|
|
// =============================== Type ===============================
|
|
|
const genDisabledStyle = token => ({
|
|
|
cursor: 'not-allowed',
|
|
|
borderColor: token.colorBorder,
|
|
|
color: token.colorTextDisabled,
|
|
|
backgroundColor: token.colorBgContainerDisabled,
|
|
|
boxShadow: 'none'
|
|
|
});
|
|
|
const genGhostButtonStyle = (btnCls, textColor, borderColor, textColorDisabled, borderColorDisabled, hoverStyle, activeStyle) => ({
|
|
|
[`&${btnCls}-background-ghost`]: Object.assign(Object.assign({
|
|
|
color: textColor || undefined,
|
|
|
backgroundColor: 'transparent',
|
|
|
borderColor: borderColor || undefined,
|
|
|
boxShadow: 'none'
|
|
|
}, genHoverActiveButtonStyle(Object.assign({
|
|
|
backgroundColor: 'transparent'
|
|
|
}, hoverStyle), Object.assign({
|
|
|
backgroundColor: 'transparent'
|
|
|
}, activeStyle))), {
|
|
|
'&:disabled': {
|
|
|
cursor: 'not-allowed',
|
|
|
color: textColorDisabled || undefined,
|
|
|
borderColor: borderColorDisabled || undefined
|
|
|
}
|
|
|
})
|
|
|
});
|
|
|
const genSolidDisabledButtonStyle = token => ({
|
|
|
'&:disabled': Object.assign({}, genDisabledStyle(token))
|
|
|
});
|
|
|
const genSolidButtonStyle = token => Object.assign({}, genSolidDisabledButtonStyle(token));
|
|
|
const genPureDisabledButtonStyle = token => ({
|
|
|
'&:disabled': {
|
|
|
cursor: 'not-allowed',
|
|
|
color: token.colorTextDisabled
|
|
|
}
|
|
|
});
|
|
|
// Type: Default
|
|
|
const genDefaultButtonStyle = token => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, genSolidButtonStyle(token)), {
|
|
|
backgroundColor: token.colorBgContainer,
|
|
|
borderColor: token.colorBorder,
|
|
|
boxShadow: `0 ${token.controlOutlineWidth}px 0 ${token.controlTmpOutline}`
|
|
|
}), genHoverActiveButtonStyle({
|
|
|
color: token.colorPrimaryHover,
|
|
|
borderColor: token.colorPrimaryHover
|
|
|
}, {
|
|
|
color: token.colorPrimaryActive,
|
|
|
borderColor: token.colorPrimaryActive
|
|
|
})), genGhostButtonStyle(token.componentCls, token.colorBgContainer, token.colorBgContainer, token.colorTextDisabled, token.colorBorder)), {
|
|
|
[`&${token.componentCls}-dangerous`]: Object.assign(Object.assign(Object.assign({
|
|
|
color: token.colorError,
|
|
|
borderColor: token.colorError
|
|
|
}, genHoverActiveButtonStyle({
|
|
|
color: token.colorErrorHover,
|
|
|
borderColor: token.colorErrorBorderHover
|
|
|
}, {
|
|
|
color: token.colorErrorActive,
|
|
|
borderColor: token.colorErrorActive
|
|
|
})), genGhostButtonStyle(token.componentCls, token.colorError, token.colorError, token.colorTextDisabled, token.colorBorder)), genSolidDisabledButtonStyle(token))
|
|
|
});
|
|
|
// Type: Primary
|
|
|
const genPrimaryButtonStyle = token => Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, genSolidButtonStyle(token)), {
|
|
|
color: token.colorTextLightSolid,
|
|
|
backgroundColor: token.colorPrimary,
|
|
|
boxShadow: `0 ${token.controlOutlineWidth}px 0 ${token.controlOutline}`
|
|
|
}), genHoverActiveButtonStyle({
|
|
|
color: token.colorTextLightSolid,
|
|
|
backgroundColor: token.colorPrimaryHover
|
|
|
}, {
|
|
|
color: token.colorTextLightSolid,
|
|
|
backgroundColor: token.colorPrimaryActive
|
|
|
})), genGhostButtonStyle(token.componentCls, token.colorPrimary, token.colorPrimary, token.colorTextDisabled, token.colorBorder, {
|
|
|
color: token.colorPrimaryHover,
|
|
|
borderColor: token.colorPrimaryHover
|
|
|
}, {
|
|
|
color: token.colorPrimaryActive,
|
|
|
borderColor: token.colorPrimaryActive
|
|
|
})), {
|
|
|
[`&${token.componentCls}-dangerous`]: Object.assign(Object.assign(Object.assign({
|
|
|
backgroundColor: token.colorError,
|
|
|
boxShadow: `0 ${token.controlOutlineWidth}px 0 ${token.colorErrorOutline}`
|
|
|
}, genHoverActiveButtonStyle({
|
|
|
backgroundColor: token.colorErrorHover
|
|
|
}, {
|
|
|
backgroundColor: token.colorErrorActive
|
|
|
})), genGhostButtonStyle(token.componentCls, token.colorError, token.colorError, token.colorTextDisabled, token.colorBorder, {
|
|
|
color: token.colorErrorHover,
|
|
|
borderColor: token.colorErrorHover
|
|
|
}, {
|
|
|
color: token.colorErrorActive,
|
|
|
borderColor: token.colorErrorActive
|
|
|
})), genSolidDisabledButtonStyle(token))
|
|
|
});
|
|
|
// Type: Dashed
|
|
|
const genDashedButtonStyle = token => Object.assign(Object.assign({}, genDefaultButtonStyle(token)), {
|
|
|
borderStyle: 'dashed'
|
|
|
});
|
|
|
// Type: Link
|
|
|
const genLinkButtonStyle = token => Object.assign(Object.assign(Object.assign({
|
|
|
color: token.colorLink
|
|
|
}, genHoverActiveButtonStyle({
|
|
|
color: token.colorLinkHover
|
|
|
}, {
|
|
|
color: token.colorLinkActive
|
|
|
})), genPureDisabledButtonStyle(token)), {
|
|
|
[`&${token.componentCls}-dangerous`]: Object.assign(Object.assign({
|
|
|
color: token.colorError
|
|
|
}, genHoverActiveButtonStyle({
|
|
|
color: token.colorErrorHover
|
|
|
}, {
|
|
|
color: token.colorErrorActive
|
|
|
})), genPureDisabledButtonStyle(token))
|
|
|
});
|
|
|
// Type: Text
|
|
|
const genTextButtonStyle = token => Object.assign(Object.assign(Object.assign({}, genHoverActiveButtonStyle({
|
|
|
color: token.colorText,
|
|
|
backgroundColor: token.colorBgTextHover
|
|
|
}, {
|
|
|
color: token.colorText,
|
|
|
backgroundColor: token.colorBgTextActive
|
|
|
})), genPureDisabledButtonStyle(token)), {
|
|
|
[`&${token.componentCls}-dangerous`]: Object.assign(Object.assign({
|
|
|
color: token.colorError
|
|
|
}, genPureDisabledButtonStyle(token)), genHoverActiveButtonStyle({
|
|
|
color: token.colorErrorHover,
|
|
|
backgroundColor: token.colorErrorBg
|
|
|
}, {
|
|
|
color: token.colorErrorHover,
|
|
|
backgroundColor: token.colorErrorBg
|
|
|
}))
|
|
|
});
|
|
|
// Href and Disabled
|
|
|
const genDisabledButtonStyle = token => Object.assign(Object.assign({}, genDisabledStyle(token)), {
|
|
|
[`&${token.componentCls}:hover`]: Object.assign({}, genDisabledStyle(token))
|
|
|
});
|
|
|
const genTypeButtonStyle = token => {
|
|
|
const {
|
|
|
componentCls
|
|
|
} = token;
|
|
|
return {
|
|
|
[`${componentCls}-default`]: genDefaultButtonStyle(token),
|
|
|
[`${componentCls}-primary`]: genPrimaryButtonStyle(token),
|
|
|
[`${componentCls}-dashed`]: genDashedButtonStyle(token),
|
|
|
[`${componentCls}-link`]: genLinkButtonStyle(token),
|
|
|
[`${componentCls}-text`]: genTextButtonStyle(token),
|
|
|
[`${componentCls}-disabled`]: genDisabledButtonStyle(token)
|
|
|
};
|
|
|
};
|
|
|
// =============================== Size ===============================
|
|
|
const genSizeButtonStyle = function (token) {
|
|
|
let sizePrefixCls = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
|
const {
|
|
|
componentCls,
|
|
|
iconCls,
|
|
|
controlHeight,
|
|
|
fontSize,
|
|
|
lineHeight,
|
|
|
lineWidth,
|
|
|
borderRadius,
|
|
|
buttonPaddingHorizontal
|
|
|
} = token;
|
|
|
const paddingVertical = Math.max(0, (controlHeight - fontSize * lineHeight) / 2 - lineWidth);
|
|
|
const paddingHorizontal = buttonPaddingHorizontal - lineWidth;
|
|
|
const iconOnlyCls = `${componentCls}-icon-only`;
|
|
|
return [
|
|
|
// Size
|
|
|
{
|
|
|
[`${componentCls}${sizePrefixCls}`]: {
|
|
|
fontSize,
|
|
|
height: controlHeight,
|
|
|
padding: `${paddingVertical}px ${paddingHorizontal}px`,
|
|
|
borderRadius,
|
|
|
[`&${iconOnlyCls}`]: {
|
|
|
width: controlHeight,
|
|
|
paddingInlineStart: 0,
|
|
|
paddingInlineEnd: 0,
|
|
|
[`&${componentCls}-round`]: {
|
|
|
width: 'auto'
|
|
|
},
|
|
|
'> span': {
|
|
|
transform: 'scale(1.143)' // 14px -> 16px
|
|
|
}
|
|
|
},
|
|
|
|
|
|
// Loading
|
|
|
[`&${componentCls}-loading`]: {
|
|
|
opacity: token.opacityLoading,
|
|
|
cursor: 'default'
|
|
|
},
|
|
|
[`${componentCls}-loading-icon`]: {
|
|
|
transition: `width ${token.motionDurationSlow} ${token.motionEaseInOut}, opacity ${token.motionDurationSlow} ${token.motionEaseInOut}`
|
|
|
},
|
|
|
[`&:not(${iconOnlyCls}) ${componentCls}-loading-icon > ${iconCls}`]: {
|
|
|
marginInlineEnd: token.marginXS
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// Shape - patch prefixCls again to override solid border radius style
|
|
|
{
|
|
|
[`${componentCls}${componentCls}-circle${sizePrefixCls}`]: genCircleButtonStyle(token)
|
|
|
}, {
|
|
|
[`${componentCls}${componentCls}-round${sizePrefixCls}`]: genRoundButtonStyle(token)
|
|
|
}];
|
|
|
};
|
|
|
const genSizeBaseButtonStyle = token => genSizeButtonStyle(token);
|
|
|
const genSizeSmallButtonStyle = token => {
|
|
|
const smallToken = (0, _internal.mergeToken)(token, {
|
|
|
controlHeight: token.controlHeightSM,
|
|
|
padding: token.paddingXS,
|
|
|
buttonPaddingHorizontal: 8,
|
|
|
borderRadius: token.borderRadiusSM
|
|
|
});
|
|
|
return genSizeButtonStyle(smallToken, `${token.componentCls}-sm`);
|
|
|
};
|
|
|
const genSizeLargeButtonStyle = token => {
|
|
|
const largeToken = (0, _internal.mergeToken)(token, {
|
|
|
controlHeight: token.controlHeightLG,
|
|
|
fontSize: token.fontSizeLG,
|
|
|
borderRadius: token.borderRadiusLG
|
|
|
});
|
|
|
return genSizeButtonStyle(largeToken, `${token.componentCls}-lg`);
|
|
|
};
|
|
|
const genBlockButtonStyle = token => {
|
|
|
const {
|
|
|
componentCls
|
|
|
} = token;
|
|
|
return {
|
|
|
[componentCls]: {
|
|
|
[`&${componentCls}-block`]: {
|
|
|
width: '100%'
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
// ============================== Export ==============================
|
|
|
var _default = (0, _internal.genComponentStyleHook)('Button', token => {
|
|
|
const {
|
|
|
controlTmpOutline,
|
|
|
paddingContentHorizontal
|
|
|
} = token;
|
|
|
const buttonToken = (0, _internal.mergeToken)(token, {
|
|
|
colorOutlineDefault: controlTmpOutline,
|
|
|
buttonPaddingHorizontal: paddingContentHorizontal
|
|
|
});
|
|
|
return [
|
|
|
// Shared
|
|
|
genSharedButtonStyle(buttonToken),
|
|
|
// Size
|
|
|
genSizeSmallButtonStyle(buttonToken), genSizeBaseButtonStyle(buttonToken), genSizeLargeButtonStyle(buttonToken),
|
|
|
// Block
|
|
|
genBlockButtonStyle(buttonToken),
|
|
|
// Group (type, ghost, danger, disabled, loading)
|
|
|
genTypeButtonStyle(buttonToken),
|
|
|
// Button Group
|
|
|
(0, _group.default)(buttonToken),
|
|
|
// Space Compact
|
|
|
(0, _compactItem.genCompactItemStyle)(token), (0, _compactItemVertical.genCompactItemVerticalStyle)(token)];
|
|
|
});
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/calendar/locale/en_GB.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/calendar/locale/en_GB.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _en_GB = _interopRequireDefault(__webpack_require__(/*! ../../date-picker/locale/en_GB */ "./node_modules/antd/lib/date-picker/locale/en_GB.js"));
|
|
|
var _default = _en_GB.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/calendar/locale/en_US.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/calendar/locale/en_US.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _en_US = _interopRequireDefault(__webpack_require__(/*! ../../date-picker/locale/en_US */ "./node_modules/antd/lib/date-picker/locale/en_US.js"));
|
|
|
var _default = _en_US.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/calendar/locale/es_ES.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/calendar/locale/es_ES.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _es_ES = _interopRequireDefault(__webpack_require__(/*! ../../date-picker/locale/es_ES */ "./node_modules/antd/lib/date-picker/locale/es_ES.js"));
|
|
|
var _default = _es_ES.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/calendar/locale/pt_BR.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/calendar/locale/pt_BR.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _pt_BR = _interopRequireDefault(__webpack_require__(/*! ../../date-picker/locale/pt_BR */ "./node_modules/antd/lib/date-picker/locale/pt_BR.js"));
|
|
|
var _default = _pt_BR.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/calendar/locale/pt_PT.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/calendar/locale/pt_PT.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _pt_PT = _interopRequireDefault(__webpack_require__(/*! ../../date-picker/locale/pt_PT */ "./node_modules/antd/lib/date-picker/locale/pt_PT.js"));
|
|
|
var _default = _pt_PT.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/DisabledContext.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/DisabledContext.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = exports.DisabledContextProvider = void 0;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
const DisabledContext = /*#__PURE__*/React.createContext(false);
|
|
|
const DisabledContextProvider = _ref => {
|
|
|
let {
|
|
|
children,
|
|
|
disabled
|
|
|
} = _ref;
|
|
|
const originDisabled = React.useContext(DisabledContext);
|
|
|
return /*#__PURE__*/React.createElement(DisabledContext.Provider, {
|
|
|
value: disabled !== null && disabled !== void 0 ? disabled : originDisabled
|
|
|
}, children);
|
|
|
};
|
|
|
exports.DisabledContextProvider = DisabledContextProvider;
|
|
|
var _default = DisabledContext;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/SizeContext.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/SizeContext.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = exports.SizeContextProvider = void 0;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
const SizeContext = /*#__PURE__*/React.createContext(undefined);
|
|
|
const SizeContextProvider = _ref => {
|
|
|
let {
|
|
|
children,
|
|
|
size
|
|
|
} = _ref;
|
|
|
const originSize = React.useContext(SizeContext);
|
|
|
return /*#__PURE__*/React.createElement(SizeContext.Provider, {
|
|
|
value: size || originSize
|
|
|
}, children);
|
|
|
};
|
|
|
exports.SizeContextProvider = SizeContextProvider;
|
|
|
var _default = SizeContext;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/context.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/context.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.defaultIconPrefixCls = exports.ConfigContext = exports.ConfigConsumer = void 0;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
const defaultIconPrefixCls = 'anticon';
|
|
|
exports.defaultIconPrefixCls = defaultIconPrefixCls;
|
|
|
const defaultGetPrefixCls = (suffixCls, customizePrefixCls) => {
|
|
|
if (customizePrefixCls) return customizePrefixCls;
|
|
|
return suffixCls ? `ant-${suffixCls}` : 'ant';
|
|
|
};
|
|
|
// zombieJ: 🚨 Do not pass `defaultRenderEmpty` here since it will cause circular dependency.
|
|
|
const ConfigContext = /*#__PURE__*/React.createContext({
|
|
|
// We provide a default function for Context without provider
|
|
|
getPrefixCls: defaultGetPrefixCls,
|
|
|
iconPrefixCls: defaultIconPrefixCls
|
|
|
});
|
|
|
exports.ConfigContext = ConfigContext;
|
|
|
const {
|
|
|
Consumer: ConfigConsumer
|
|
|
} = ConfigContext;
|
|
|
exports.ConfigConsumer = ConfigConsumer;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/cssVariables.js":
|
|
|
/*!***************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/cssVariables.js ***!
|
|
|
\***************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.getStyle = getStyle;
|
|
|
exports.registerTheme = registerTheme;
|
|
|
var _colors = __webpack_require__(/*! @ant-design/colors */ "./node_modules/@ant-design/colors/es/index.js");
|
|
|
var _tinycolor = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js");
|
|
|
var _canUseDom = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/Dom/canUseDom */ "./node_modules/rc-util/lib/Dom/canUseDom.js"));
|
|
|
var _dynamicCSS = __webpack_require__(/*! rc-util/lib/Dom/dynamicCSS */ "./node_modules/rc-util/lib/Dom/dynamicCSS.js");
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! ../_util/warning */ "./node_modules/antd/lib/_util/warning.js"));
|
|
|
/* eslint-disable import/prefer-default-export, prefer-destructuring */
|
|
|
|
|
|
const dynamicStyleMark = `-ant-${Date.now()}-${Math.random()}`;
|
|
|
function getStyle(globalPrefixCls, theme) {
|
|
|
const variables = {};
|
|
|
const formatColor = (color, updater) => {
|
|
|
let clone = color.clone();
|
|
|
clone = (updater === null || updater === void 0 ? void 0 : updater(clone)) || clone;
|
|
|
return clone.toRgbString();
|
|
|
};
|
|
|
const fillColor = (colorVal, type) => {
|
|
|
const baseColor = new _tinycolor.TinyColor(colorVal);
|
|
|
const colorPalettes = (0, _colors.generate)(baseColor.toRgbString());
|
|
|
variables[`${type}-color`] = formatColor(baseColor);
|
|
|
variables[`${type}-color-disabled`] = colorPalettes[1];
|
|
|
variables[`${type}-color-hover`] = colorPalettes[4];
|
|
|
variables[`${type}-color-active`] = colorPalettes[6];
|
|
|
variables[`${type}-color-outline`] = baseColor.clone().setAlpha(0.2).toRgbString();
|
|
|
variables[`${type}-color-deprecated-bg`] = colorPalettes[0];
|
|
|
variables[`${type}-color-deprecated-border`] = colorPalettes[2];
|
|
|
};
|
|
|
// ================ Primary Color ================
|
|
|
if (theme.primaryColor) {
|
|
|
fillColor(theme.primaryColor, 'primary');
|
|
|
const primaryColor = new _tinycolor.TinyColor(theme.primaryColor);
|
|
|
const primaryColors = (0, _colors.generate)(primaryColor.toRgbString());
|
|
|
// Legacy - We should use semantic naming standard
|
|
|
primaryColors.forEach((color, index) => {
|
|
|
variables[`primary-${index + 1}`] = color;
|
|
|
});
|
|
|
// Deprecated
|
|
|
variables['primary-color-deprecated-l-35'] = formatColor(primaryColor, c => c.lighten(35));
|
|
|
variables['primary-color-deprecated-l-20'] = formatColor(primaryColor, c => c.lighten(20));
|
|
|
variables['primary-color-deprecated-t-20'] = formatColor(primaryColor, c => c.tint(20));
|
|
|
variables['primary-color-deprecated-t-50'] = formatColor(primaryColor, c => c.tint(50));
|
|
|
variables['primary-color-deprecated-f-12'] = formatColor(primaryColor, c => c.setAlpha(c.getAlpha() * 0.12));
|
|
|
const primaryActiveColor = new _tinycolor.TinyColor(primaryColors[0]);
|
|
|
variables['primary-color-active-deprecated-f-30'] = formatColor(primaryActiveColor, c => c.setAlpha(c.getAlpha() * 0.3));
|
|
|
variables['primary-color-active-deprecated-d-02'] = formatColor(primaryActiveColor, c => c.darken(2));
|
|
|
}
|
|
|
// ================ Success Color ================
|
|
|
if (theme.successColor) {
|
|
|
fillColor(theme.successColor, 'success');
|
|
|
}
|
|
|
// ================ Warning Color ================
|
|
|
if (theme.warningColor) {
|
|
|
fillColor(theme.warningColor, 'warning');
|
|
|
}
|
|
|
// ================= Error Color =================
|
|
|
if (theme.errorColor) {
|
|
|
fillColor(theme.errorColor, 'error');
|
|
|
}
|
|
|
// ================= Info Color ==================
|
|
|
if (theme.infoColor) {
|
|
|
fillColor(theme.infoColor, 'info');
|
|
|
}
|
|
|
// Convert to css variables
|
|
|
const cssList = Object.keys(variables).map(key => `--${globalPrefixCls}-${key}: ${variables[key]};`);
|
|
|
return `
|
|
|
:root {
|
|
|
${cssList.join('\n')}
|
|
|
}
|
|
|
`.trim();
|
|
|
}
|
|
|
function registerTheme(globalPrefixCls, theme) {
|
|
|
const style = getStyle(globalPrefixCls, theme);
|
|
|
if ((0, _canUseDom.default)()) {
|
|
|
(0, _dynamicCSS.updateCSS)(style, `${dynamicStyleMark}-dynamic-theme`);
|
|
|
} else {
|
|
|
true ? (0, _warning.default)(false, 'ConfigProvider', 'SSR do not support dynamic theme with css variables.') : 0;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/hooks/useConfig.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/hooks/useConfig.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _react = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
var _DisabledContext = _interopRequireDefault(__webpack_require__(/*! ../DisabledContext */ "./node_modules/antd/lib/config-provider/DisabledContext.js"));
|
|
|
var _SizeContext = _interopRequireDefault(__webpack_require__(/*! ../SizeContext */ "./node_modules/antd/lib/config-provider/SizeContext.js"));
|
|
|
function useConfig() {
|
|
|
const componentDisabled = (0, _react.useContext)(_DisabledContext.default);
|
|
|
const componentSize = (0, _react.useContext)(_SizeContext.default);
|
|
|
return {
|
|
|
componentDisabled,
|
|
|
componentSize
|
|
|
};
|
|
|
}
|
|
|
var _default = useConfig;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/hooks/useTheme.js":
|
|
|
/*!*****************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/hooks/useTheme.js ***!
|
|
|
\*****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = useTheme;
|
|
|
var _useMemo = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/hooks/useMemo */ "./node_modules/rc-util/lib/hooks/useMemo.js"));
|
|
|
var _isEqual = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/isEqual */ "./node_modules/rc-util/lib/isEqual.js"));
|
|
|
var _internal = __webpack_require__(/*! ../../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
function useTheme(theme, parentTheme) {
|
|
|
const themeConfig = theme || {};
|
|
|
const parentThemeConfig = themeConfig.inherit === false || !parentTheme ? _internal.defaultConfig : parentTheme;
|
|
|
const mergedTheme = (0, _useMemo.default)(() => {
|
|
|
if (!theme) {
|
|
|
return parentTheme;
|
|
|
}
|
|
|
// Override
|
|
|
const mergedComponents = Object.assign({}, parentThemeConfig.components);
|
|
|
Object.keys(theme.components || {}).forEach(componentName => {
|
|
|
mergedComponents[componentName] = Object.assign(Object.assign({}, mergedComponents[componentName]), theme.components[componentName]);
|
|
|
});
|
|
|
// Base token
|
|
|
return Object.assign(Object.assign(Object.assign({}, parentThemeConfig), themeConfig), {
|
|
|
token: Object.assign(Object.assign({}, parentThemeConfig.token), themeConfig.token),
|
|
|
components: mergedComponents
|
|
|
});
|
|
|
}, [themeConfig, parentThemeConfig], (prev, next) => prev.some((prevTheme, index) => {
|
|
|
const nextTheme = next[index];
|
|
|
return !(0, _isEqual.default)(prevTheme, nextTheme, true);
|
|
|
}));
|
|
|
return mergedTheme;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/index.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/index.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
Object.defineProperty(exports, "ConfigConsumer", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _context2.ConfigConsumer;
|
|
|
}
|
|
|
}));
|
|
|
Object.defineProperty(exports, "ConfigContext", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _context2.ConfigContext;
|
|
|
}
|
|
|
}));
|
|
|
exports["default"] = exports.configConsumerProps = void 0;
|
|
|
Object.defineProperty(exports, "defaultIconPrefixCls", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _context2.defaultIconPrefixCls;
|
|
|
}
|
|
|
}));
|
|
|
exports.warnContext = exports.globalConfig = exports.defaultPrefixCls = void 0;
|
|
|
var _cssinjs = __webpack_require__(/*! @ant-design/cssinjs */ "./node_modules/@ant-design/cssinjs/es/index.js");
|
|
|
var _Context = _interopRequireDefault(__webpack_require__(/*! @ant-design/icons/lib/components/Context */ "./node_modules/@ant-design/icons/lib/components/Context.js"));
|
|
|
var _rcFieldForm = __webpack_require__(/*! rc-field-form */ "./node_modules/rc-field-form/es/index.js");
|
|
|
var _valueUtil = __webpack_require__(/*! rc-field-form/lib/utils/valueUtil */ "./node_modules/rc-field-form/lib/utils/valueUtil.js");
|
|
|
var _useMemo = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/hooks/useMemo */ "./node_modules/rc-util/lib/hooks/useMemo.js"));
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _locale = _interopRequireWildcard(__webpack_require__(/*! ../locale */ "./node_modules/antd/lib/locale/index.js"));
|
|
|
var _context = _interopRequireDefault(__webpack_require__(/*! ../locale/context */ "./node_modules/antd/lib/locale/context.js"));
|
|
|
var _en_US = _interopRequireDefault(__webpack_require__(/*! ../locale/en_US */ "./node_modules/antd/lib/locale/en_US.js"));
|
|
|
var _internal = __webpack_require__(/*! ../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
var _seed = _interopRequireDefault(__webpack_require__(/*! ../theme/themes/seed */ "./node_modules/antd/lib/theme/themes/seed.js"));
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! ../_util/warning */ "./node_modules/antd/lib/_util/warning.js"));
|
|
|
var _context2 = __webpack_require__(/*! ./context */ "./node_modules/antd/lib/config-provider/context.js");
|
|
|
var _cssVariables = __webpack_require__(/*! ./cssVariables */ "./node_modules/antd/lib/config-provider/cssVariables.js");
|
|
|
var _DisabledContext = __webpack_require__(/*! ./DisabledContext */ "./node_modules/antd/lib/config-provider/DisabledContext.js");
|
|
|
var _useConfig = _interopRequireDefault(__webpack_require__(/*! ./hooks/useConfig */ "./node_modules/antd/lib/config-provider/hooks/useConfig.js"));
|
|
|
var _useTheme = _interopRequireDefault(__webpack_require__(/*! ./hooks/useTheme */ "./node_modules/antd/lib/config-provider/hooks/useTheme.js"));
|
|
|
var _SizeContext = _interopRequireWildcard(__webpack_require__(/*! ./SizeContext */ "./node_modules/antd/lib/config-provider/SizeContext.js"));
|
|
|
var _style = _interopRequireDefault(__webpack_require__(/*! ./style */ "./node_modules/antd/lib/config-provider/style/index.js"));
|
|
|
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
|
var t = {};
|
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
|
}
|
|
|
return t;
|
|
|
};
|
|
|
/**
|
|
|
* Since too many feedback using static method like `Modal.confirm` not getting theme,
|
|
|
* we record the theme register info here to help developer get warning info.
|
|
|
*/
|
|
|
let existThemeConfig = false;
|
|
|
const warnContext = true ? componentName => {
|
|
|
true ? (0, _warning.default)(!existThemeConfig, componentName, `Static function can not consume context like dynamic theme. Please use 'App' component instead.`) : 0;
|
|
|
} : /* istanbul ignore next */
|
|
|
0;
|
|
|
exports.warnContext = warnContext;
|
|
|
const configConsumerProps = ['getTargetContainer', 'getPopupContainer', 'rootPrefixCls', 'getPrefixCls', 'renderEmpty', 'csp', 'autoInsertSpaceInButton', 'locale', 'pageHeader'];
|
|
|
// These props is used by `useContext` directly in sub component
|
|
|
exports.configConsumerProps = configConsumerProps;
|
|
|
const PASSED_PROPS = ['getTargetContainer', 'getPopupContainer', 'renderEmpty', 'pageHeader', 'input', 'pagination', 'form', 'select'];
|
|
|
const defaultPrefixCls = 'ant';
|
|
|
exports.defaultPrefixCls = defaultPrefixCls;
|
|
|
let globalPrefixCls;
|
|
|
let globalIconPrefixCls;
|
|
|
function getGlobalPrefixCls() {
|
|
|
return globalPrefixCls || defaultPrefixCls;
|
|
|
}
|
|
|
function getGlobalIconPrefixCls() {
|
|
|
return globalIconPrefixCls || _context2.defaultIconPrefixCls;
|
|
|
}
|
|
|
const setGlobalConfig = _ref => {
|
|
|
let {
|
|
|
prefixCls,
|
|
|
iconPrefixCls,
|
|
|
theme
|
|
|
} = _ref;
|
|
|
if (prefixCls !== undefined) {
|
|
|
globalPrefixCls = prefixCls;
|
|
|
}
|
|
|
if (iconPrefixCls !== undefined) {
|
|
|
globalIconPrefixCls = iconPrefixCls;
|
|
|
}
|
|
|
if (theme) {
|
|
|
(0, _cssVariables.registerTheme)(getGlobalPrefixCls(), theme);
|
|
|
}
|
|
|
};
|
|
|
const globalConfig = () => ({
|
|
|
getPrefixCls: (suffixCls, customizePrefixCls) => {
|
|
|
if (customizePrefixCls) return customizePrefixCls;
|
|
|
return suffixCls ? `${getGlobalPrefixCls()}-${suffixCls}` : getGlobalPrefixCls();
|
|
|
},
|
|
|
getIconPrefixCls: getGlobalIconPrefixCls,
|
|
|
getRootPrefixCls: () => {
|
|
|
// If Global prefixCls provided, use this
|
|
|
if (globalPrefixCls) {
|
|
|
return globalPrefixCls;
|
|
|
}
|
|
|
// Fallback to default prefixCls
|
|
|
return getGlobalPrefixCls();
|
|
|
}
|
|
|
});
|
|
|
exports.globalConfig = globalConfig;
|
|
|
const ProviderChildren = props => {
|
|
|
const {
|
|
|
children,
|
|
|
csp: customCsp,
|
|
|
autoInsertSpaceInButton,
|
|
|
form,
|
|
|
locale,
|
|
|
componentSize,
|
|
|
direction,
|
|
|
space,
|
|
|
virtual,
|
|
|
dropdownMatchSelectWidth,
|
|
|
legacyLocale,
|
|
|
parentContext,
|
|
|
iconPrefixCls: customIconPrefixCls,
|
|
|
theme,
|
|
|
componentDisabled
|
|
|
} = props;
|
|
|
const getPrefixCls = React.useCallback((suffixCls, customizePrefixCls) => {
|
|
|
const {
|
|
|
prefixCls
|
|
|
} = props;
|
|
|
if (customizePrefixCls) return customizePrefixCls;
|
|
|
const mergedPrefixCls = prefixCls || parentContext.getPrefixCls('');
|
|
|
return suffixCls ? `${mergedPrefixCls}-${suffixCls}` : mergedPrefixCls;
|
|
|
}, [parentContext.getPrefixCls, props.prefixCls]);
|
|
|
const iconPrefixCls = customIconPrefixCls || parentContext.iconPrefixCls || _context2.defaultIconPrefixCls;
|
|
|
const shouldWrapSSR = iconPrefixCls !== parentContext.iconPrefixCls;
|
|
|
const csp = customCsp || parentContext.csp;
|
|
|
const wrapSSR = (0, _style.default)(iconPrefixCls);
|
|
|
const mergedTheme = (0, _useTheme.default)(theme, parentContext.theme);
|
|
|
if (true) {
|
|
|
existThemeConfig = existThemeConfig || !!mergedTheme;
|
|
|
}
|
|
|
const baseConfig = {
|
|
|
csp,
|
|
|
autoInsertSpaceInButton,
|
|
|
locale: locale || legacyLocale,
|
|
|
direction,
|
|
|
space,
|
|
|
virtual,
|
|
|
dropdownMatchSelectWidth,
|
|
|
getPrefixCls,
|
|
|
iconPrefixCls,
|
|
|
theme: mergedTheme
|
|
|
};
|
|
|
const config = Object.assign({}, parentContext);
|
|
|
Object.keys(baseConfig).forEach(key => {
|
|
|
if (baseConfig[key] !== undefined) {
|
|
|
config[key] = baseConfig[key];
|
|
|
}
|
|
|
});
|
|
|
// Pass the props used by `useContext` directly with child component.
|
|
|
// These props should merged into `config`.
|
|
|
PASSED_PROPS.forEach(propName => {
|
|
|
const propValue = props[propName];
|
|
|
if (propValue) {
|
|
|
config[propName] = propValue;
|
|
|
}
|
|
|
});
|
|
|
// https://github.com/ant-design/ant-design/issues/27617
|
|
|
const memoedConfig = (0, _useMemo.default)(() => config, config, (prevConfig, currentConfig) => {
|
|
|
const prevKeys = Object.keys(prevConfig);
|
|
|
const currentKeys = Object.keys(currentConfig);
|
|
|
return prevKeys.length !== currentKeys.length || prevKeys.some(key => prevConfig[key] !== currentConfig[key]);
|
|
|
});
|
|
|
const memoIconContextValue = React.useMemo(() => ({
|
|
|
prefixCls: iconPrefixCls,
|
|
|
csp
|
|
|
}), [iconPrefixCls, csp]);
|
|
|
let childNode = shouldWrapSSR ? wrapSSR(children) : children;
|
|
|
const validateMessages = React.useMemo(() => {
|
|
|
var _a, _b, _c;
|
|
|
return (0, _valueUtil.setValues)({}, ((_a = _en_US.default.Form) === null || _a === void 0 ? void 0 : _a.defaultValidateMessages) || {}, ((_c = (_b = memoedConfig.locale) === null || _b === void 0 ? void 0 : _b.Form) === null || _c === void 0 ? void 0 : _c.defaultValidateMessages) || {}, (form === null || form === void 0 ? void 0 : form.validateMessages) || {});
|
|
|
}, [memoedConfig, form === null || form === void 0 ? void 0 : form.validateMessages]);
|
|
|
if (Object.keys(validateMessages).length > 0) {
|
|
|
childNode = /*#__PURE__*/React.createElement(_rcFieldForm.FormProvider, {
|
|
|
validateMessages: validateMessages
|
|
|
}, children);
|
|
|
}
|
|
|
if (locale) {
|
|
|
childNode = /*#__PURE__*/React.createElement(_locale.default, {
|
|
|
locale: locale,
|
|
|
_ANT_MARK__: _locale.ANT_MARK
|
|
|
}, childNode);
|
|
|
}
|
|
|
if (iconPrefixCls || csp) {
|
|
|
childNode = /*#__PURE__*/React.createElement(_Context.default.Provider, {
|
|
|
value: memoIconContextValue
|
|
|
}, childNode);
|
|
|
}
|
|
|
if (componentSize) {
|
|
|
childNode = /*#__PURE__*/React.createElement(_SizeContext.SizeContextProvider, {
|
|
|
size: componentSize
|
|
|
}, childNode);
|
|
|
}
|
|
|
// ================================ Dynamic theme ================================
|
|
|
const memoTheme = React.useMemo(() => {
|
|
|
const _a = mergedTheme || {},
|
|
|
{
|
|
|
algorithm,
|
|
|
token
|
|
|
} = _a,
|
|
|
rest = __rest(_a, ["algorithm", "token"]);
|
|
|
const themeObj = algorithm && (!Array.isArray(algorithm) || algorithm.length > 0) ? (0, _cssinjs.createTheme)(algorithm) : undefined;
|
|
|
return Object.assign(Object.assign({}, rest), {
|
|
|
theme: themeObj,
|
|
|
token: Object.assign(Object.assign({}, _seed.default), token)
|
|
|
});
|
|
|
}, [mergedTheme]);
|
|
|
if (theme) {
|
|
|
childNode = /*#__PURE__*/React.createElement(_internal.DesignTokenContext.Provider, {
|
|
|
value: memoTheme
|
|
|
}, childNode);
|
|
|
}
|
|
|
// =================================== Render ===================================
|
|
|
if (componentDisabled !== undefined) {
|
|
|
childNode = /*#__PURE__*/React.createElement(_DisabledContext.DisabledContextProvider, {
|
|
|
disabled: componentDisabled
|
|
|
}, childNode);
|
|
|
}
|
|
|
return /*#__PURE__*/React.createElement(_context2.ConfigContext.Provider, {
|
|
|
value: memoedConfig
|
|
|
}, childNode);
|
|
|
};
|
|
|
const ConfigProvider = props => {
|
|
|
const context = React.useContext(_context2.ConfigContext);
|
|
|
const antLocale = React.useContext(_context.default);
|
|
|
return /*#__PURE__*/React.createElement(ProviderChildren, Object.assign({
|
|
|
parentContext: context,
|
|
|
legacyLocale: antLocale
|
|
|
}, props));
|
|
|
};
|
|
|
ConfigProvider.ConfigContext = _context2.ConfigContext;
|
|
|
ConfigProvider.SizeContext = _SizeContext.default;
|
|
|
ConfigProvider.config = setGlobalConfig;
|
|
|
ConfigProvider.useConfig = _useConfig.default;
|
|
|
Object.defineProperty(ConfigProvider, 'SizeContext', {
|
|
|
get: () => {
|
|
|
true ? (0, _warning.default)(false, 'ConfigProvider', 'ConfigProvider.SizeContext is deprecated. Please use `ConfigProvider.useConfig().componentSize` instead.') : 0;
|
|
|
return _SizeContext.default;
|
|
|
}
|
|
|
});
|
|
|
if (true) {
|
|
|
ConfigProvider.displayName = 'ConfigProvider';
|
|
|
}
|
|
|
var _default = ConfigProvider;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/config-provider/style/index.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/config-provider/style/index.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _cssinjs = __webpack_require__(/*! @ant-design/cssinjs */ "./node_modules/@ant-design/cssinjs/es/index.js");
|
|
|
var _style = __webpack_require__(/*! ../../style */ "./node_modules/antd/lib/style/index.js");
|
|
|
var _internal = __webpack_require__(/*! ../../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
const useStyle = iconPrefixCls => {
|
|
|
const [theme, token] = (0, _internal.useToken)();
|
|
|
// Generate style for icons
|
|
|
return (0, _cssinjs.useStyleRegister)({
|
|
|
theme,
|
|
|
token,
|
|
|
hashId: '',
|
|
|
path: ['ant-design-icons', iconPrefixCls]
|
|
|
}, () => [{
|
|
|
[`.${iconPrefixCls}`]: Object.assign(Object.assign({}, (0, _style.resetIcon)()), {
|
|
|
[`.${iconPrefixCls} .${iconPrefixCls}-icon`]: {
|
|
|
display: 'block'
|
|
|
}
|
|
|
})
|
|
|
}]);
|
|
|
};
|
|
|
var _default = useStyle;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/date-picker/locale/en_GB.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/date-picker/locale/en_GB.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _en_GB = _interopRequireDefault(__webpack_require__(/*! rc-picker/lib/locale/en_GB */ "./node_modules/rc-picker/lib/locale/en_GB.js"));
|
|
|
var _en_GB2 = _interopRequireDefault(__webpack_require__(/*! ../../time-picker/locale/en_GB */ "./node_modules/antd/lib/time-picker/locale/en_GB.js"));
|
|
|
// Merge into a locale object
|
|
|
const locale = {
|
|
|
lang: Object.assign({
|
|
|
placeholder: 'Select date',
|
|
|
yearPlaceholder: 'Select year',
|
|
|
quarterPlaceholder: 'Select quarter',
|
|
|
monthPlaceholder: 'Select month',
|
|
|
weekPlaceholder: 'Select week',
|
|
|
rangePlaceholder: ['Start date', 'End date'],
|
|
|
rangeYearPlaceholder: ['Start year', 'End year'],
|
|
|
rangeQuarterPlaceholder: ['Start quarter', 'End quarter'],
|
|
|
rangeMonthPlaceholder: ['Start month', 'End month'],
|
|
|
rangeWeekPlaceholder: ['Start week', 'End week']
|
|
|
}, _en_GB.default),
|
|
|
timePickerLocale: Object.assign({}, _en_GB2.default)
|
|
|
};
|
|
|
// All settings at:
|
|
|
// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/date-picker/locale/en_US.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/date-picker/locale/en_US.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _en_US = _interopRequireDefault(__webpack_require__(/*! rc-picker/lib/locale/en_US */ "./node_modules/rc-picker/lib/locale/en_US.js"));
|
|
|
var _en_US2 = _interopRequireDefault(__webpack_require__(/*! ../../time-picker/locale/en_US */ "./node_modules/antd/lib/time-picker/locale/en_US.js"));
|
|
|
// Merge into a locale object
|
|
|
const locale = {
|
|
|
lang: Object.assign({
|
|
|
placeholder: 'Select date',
|
|
|
yearPlaceholder: 'Select year',
|
|
|
quarterPlaceholder: 'Select quarter',
|
|
|
monthPlaceholder: 'Select month',
|
|
|
weekPlaceholder: 'Select week',
|
|
|
rangePlaceholder: ['Start date', 'End date'],
|
|
|
rangeYearPlaceholder: ['Start year', 'End year'],
|
|
|
rangeQuarterPlaceholder: ['Start quarter', 'End quarter'],
|
|
|
rangeMonthPlaceholder: ['Start month', 'End month'],
|
|
|
rangeWeekPlaceholder: ['Start week', 'End week']
|
|
|
}, _en_US.default),
|
|
|
timePickerLocale: Object.assign({}, _en_US2.default)
|
|
|
};
|
|
|
// All settings at:
|
|
|
// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/date-picker/locale/es_ES.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/date-picker/locale/es_ES.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _es_ES = _interopRequireDefault(__webpack_require__(/*! rc-picker/lib/locale/es_ES */ "./node_modules/rc-picker/lib/locale/es_ES.js"));
|
|
|
var _es_ES2 = _interopRequireDefault(__webpack_require__(/*! ../../time-picker/locale/es_ES */ "./node_modules/antd/lib/time-picker/locale/es_ES.js"));
|
|
|
// Merge into a locale object
|
|
|
const locale = {
|
|
|
lang: Object.assign({
|
|
|
placeholder: 'Seleccionar fecha',
|
|
|
rangePlaceholder: ['Fecha inicial', 'Fecha final']
|
|
|
}, _es_ES.default),
|
|
|
timePickerLocale: Object.assign({}, _es_ES2.default)
|
|
|
};
|
|
|
// All settings at:
|
|
|
// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/date-picker/locale/pt_BR.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/date-picker/locale/pt_BR.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _pt_BR = _interopRequireDefault(__webpack_require__(/*! rc-picker/lib/locale/pt_BR */ "./node_modules/rc-picker/lib/locale/pt_BR.js"));
|
|
|
var _pt_BR2 = _interopRequireDefault(__webpack_require__(/*! ../../time-picker/locale/pt_BR */ "./node_modules/antd/lib/time-picker/locale/pt_BR.js"));
|
|
|
// Merge into a locale object
|
|
|
const locale = {
|
|
|
lang: Object.assign({
|
|
|
placeholder: 'Selecionar data',
|
|
|
rangePlaceholder: ['Data inicial', 'Data final']
|
|
|
}, _pt_BR.default),
|
|
|
timePickerLocale: Object.assign({}, _pt_BR2.default)
|
|
|
};
|
|
|
// All settings at:
|
|
|
// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/date-picker/locale/pt_PT.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/date-picker/locale/pt_PT.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _pt_PT = _interopRequireDefault(__webpack_require__(/*! rc-picker/lib/locale/pt_PT */ "./node_modules/rc-picker/lib/locale/pt_PT.js"));
|
|
|
var _pt_PT2 = _interopRequireDefault(__webpack_require__(/*! ../../time-picker/locale/pt_PT */ "./node_modules/antd/lib/time-picker/locale/pt_PT.js"));
|
|
|
// Merge into a locale object
|
|
|
const locale = {
|
|
|
lang: Object.assign(Object.assign({}, _pt_PT.default), {
|
|
|
placeholder: 'Data',
|
|
|
rangePlaceholder: ['Data inicial', 'Data final'],
|
|
|
today: 'Hoje',
|
|
|
now: 'Agora',
|
|
|
backToToday: 'Hoje',
|
|
|
ok: 'OK',
|
|
|
clear: 'Limpar',
|
|
|
month: 'Mês',
|
|
|
year: 'Ano',
|
|
|
timeSelect: 'Hora',
|
|
|
dateSelect: 'Selecionar data',
|
|
|
monthSelect: 'Selecionar mês',
|
|
|
yearSelect: 'Selecionar ano',
|
|
|
decadeSelect: 'Selecionar década',
|
|
|
yearFormat: 'YYYY',
|
|
|
dateFormat: 'D/M/YYYY',
|
|
|
dayFormat: 'D',
|
|
|
dateTimeFormat: 'D/M/YYYY HH:mm:ss',
|
|
|
monthFormat: 'MMMM',
|
|
|
monthBeforeYear: false,
|
|
|
previousMonth: 'Mês anterior (PageUp)',
|
|
|
nextMonth: 'Mês seguinte (PageDown)',
|
|
|
previousYear: 'Ano anterior (Control + left)',
|
|
|
nextYear: 'Ano seguinte (Control + right)',
|
|
|
previousDecade: 'Última década',
|
|
|
nextDecade: 'Próxima década',
|
|
|
previousCentury: 'Último século',
|
|
|
nextCentury: 'Próximo século'
|
|
|
}),
|
|
|
timePickerLocale: Object.assign(Object.assign({}, _pt_PT2.default), {
|
|
|
placeholder: 'Hora'
|
|
|
})
|
|
|
};
|
|
|
// All settings at:
|
|
|
// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/context.js":
|
|
|
/*!*************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/context.js ***!
|
|
|
\*************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _react = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
const LocaleContext = /*#__PURE__*/(0, _react.createContext)(undefined);
|
|
|
var _default = LocaleContext;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/en_GB.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/en_GB.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _en_GB = _interopRequireDefault(__webpack_require__(/*! rc-pagination/lib/locale/en_GB */ "./node_modules/rc-pagination/lib/locale/en_GB.js"));
|
|
|
var _en_GB2 = _interopRequireDefault(__webpack_require__(/*! ../calendar/locale/en_GB */ "./node_modules/antd/lib/calendar/locale/en_GB.js"));
|
|
|
var _en_GB3 = _interopRequireDefault(__webpack_require__(/*! ../date-picker/locale/en_GB */ "./node_modules/antd/lib/date-picker/locale/en_GB.js"));
|
|
|
var _en_GB4 = _interopRequireDefault(__webpack_require__(/*! ../time-picker/locale/en_GB */ "./node_modules/antd/lib/time-picker/locale/en_GB.js"));
|
|
|
/* eslint-disable no-template-curly-in-string */
|
|
|
|
|
|
const typeTemplate = '${label} is not a valid ${type}';
|
|
|
const localeValues = {
|
|
|
locale: 'en-gb',
|
|
|
Pagination: _en_GB.default,
|
|
|
DatePicker: _en_GB3.default,
|
|
|
TimePicker: _en_GB4.default,
|
|
|
Calendar: _en_GB2.default,
|
|
|
global: {
|
|
|
placeholder: 'Please select'
|
|
|
},
|
|
|
Table: {
|
|
|
filterTitle: 'Filter menu',
|
|
|
filterConfirm: 'OK',
|
|
|
filterReset: 'Reset',
|
|
|
filterEmptyText: 'No filters',
|
|
|
filterCheckall: 'Select all items',
|
|
|
filterSearchPlaceholder: 'Search in filters',
|
|
|
emptyText: 'No data',
|
|
|
selectAll: 'Select current page',
|
|
|
selectInvert: 'Invert current page',
|
|
|
selectNone: 'Clear all data',
|
|
|
selectionAll: 'Select all data',
|
|
|
sortTitle: 'Sort',
|
|
|
expand: 'Expand row',
|
|
|
collapse: 'Collapse row',
|
|
|
triggerDesc: 'Click to sort descending',
|
|
|
triggerAsc: 'Click to sort ascending',
|
|
|
cancelSort: 'Click to cancel sorting'
|
|
|
},
|
|
|
Modal: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancel',
|
|
|
justOkText: 'OK'
|
|
|
},
|
|
|
Popconfirm: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancel'
|
|
|
},
|
|
|
Transfer: {
|
|
|
titles: ['', ''],
|
|
|
searchPlaceholder: 'Search here',
|
|
|
itemUnit: 'item',
|
|
|
itemsUnit: 'items',
|
|
|
remove: 'Remove',
|
|
|
selectCurrent: 'Select current page',
|
|
|
removeCurrent: 'Remove current page',
|
|
|
selectAll: 'Select all data',
|
|
|
removeAll: 'Remove all data',
|
|
|
selectInvert: 'Invert current page'
|
|
|
},
|
|
|
Upload: {
|
|
|
uploading: 'Uploading...',
|
|
|
removeFile: 'Remove file',
|
|
|
uploadError: 'Upload error',
|
|
|
previewFile: 'Preview file',
|
|
|
downloadFile: 'Download file'
|
|
|
},
|
|
|
Empty: {
|
|
|
description: 'No Data'
|
|
|
},
|
|
|
Icon: {
|
|
|
icon: 'icon'
|
|
|
},
|
|
|
Text: {
|
|
|
edit: 'Edit',
|
|
|
copy: 'Copy',
|
|
|
copied: 'Copied',
|
|
|
expand: 'Expand'
|
|
|
},
|
|
|
PageHeader: {
|
|
|
back: 'Back'
|
|
|
},
|
|
|
Form: {
|
|
|
optional: '(optional)',
|
|
|
defaultValidateMessages: {
|
|
|
default: 'Field validation error for ${label}',
|
|
|
required: 'Please enter ${label}',
|
|
|
enum: '${label} must be one of [${enum}]',
|
|
|
whitespace: '${label} cannot be a blank character',
|
|
|
date: {
|
|
|
format: '${label} date format is invalid',
|
|
|
parse: '${label} cannot be converted to a date',
|
|
|
invalid: '${label} is an invalid date'
|
|
|
},
|
|
|
types: {
|
|
|
string: typeTemplate,
|
|
|
method: typeTemplate,
|
|
|
array: typeTemplate,
|
|
|
object: typeTemplate,
|
|
|
number: typeTemplate,
|
|
|
date: typeTemplate,
|
|
|
boolean: typeTemplate,
|
|
|
integer: typeTemplate,
|
|
|
float: typeTemplate,
|
|
|
regexp: typeTemplate,
|
|
|
email: typeTemplate,
|
|
|
url: typeTemplate,
|
|
|
hex: typeTemplate
|
|
|
},
|
|
|
string: {
|
|
|
len: '${label} must be ${len} characters',
|
|
|
min: '${label} must be at least ${min} characters',
|
|
|
max: '${label} must be up to ${max} characters',
|
|
|
range: '${label} must be between ${min}-${max} characters'
|
|
|
},
|
|
|
number: {
|
|
|
len: '${label} must be equal to ${len}',
|
|
|
min: '${label} must be minimum ${min}',
|
|
|
max: '${label} must be maximum ${max}',
|
|
|
range: '${label} must be between ${min}-${max}'
|
|
|
},
|
|
|
array: {
|
|
|
len: 'Must be ${len} ${label}',
|
|
|
min: 'At least ${min} ${label}',
|
|
|
max: 'At most ${max} ${label}',
|
|
|
range: 'The amount of ${label} must be between ${min}-${max}'
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: '${label} does not match the pattern ${pattern}'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
Image: {
|
|
|
preview: 'Preview'
|
|
|
}
|
|
|
};
|
|
|
var _default = localeValues;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/en_US.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/en_US.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _en_US = _interopRequireDefault(__webpack_require__(/*! rc-pagination/lib/locale/en_US */ "./node_modules/rc-pagination/lib/locale/en_US.js"));
|
|
|
var _en_US2 = _interopRequireDefault(__webpack_require__(/*! ../calendar/locale/en_US */ "./node_modules/antd/lib/calendar/locale/en_US.js"));
|
|
|
var _en_US3 = _interopRequireDefault(__webpack_require__(/*! ../date-picker/locale/en_US */ "./node_modules/antd/lib/date-picker/locale/en_US.js"));
|
|
|
var _en_US4 = _interopRequireDefault(__webpack_require__(/*! ../time-picker/locale/en_US */ "./node_modules/antd/lib/time-picker/locale/en_US.js"));
|
|
|
/* eslint-disable no-template-curly-in-string */
|
|
|
|
|
|
const typeTemplate = '${label} is not a valid ${type}';
|
|
|
const localeValues = {
|
|
|
locale: 'en',
|
|
|
Pagination: _en_US.default,
|
|
|
DatePicker: _en_US3.default,
|
|
|
TimePicker: _en_US4.default,
|
|
|
Calendar: _en_US2.default,
|
|
|
global: {
|
|
|
placeholder: 'Please select'
|
|
|
},
|
|
|
Table: {
|
|
|
filterTitle: 'Filter menu',
|
|
|
filterConfirm: 'OK',
|
|
|
filterReset: 'Reset',
|
|
|
filterEmptyText: 'No filters',
|
|
|
filterCheckall: 'Select all items',
|
|
|
filterSearchPlaceholder: 'Search in filters',
|
|
|
emptyText: 'No data',
|
|
|
selectAll: 'Select current page',
|
|
|
selectInvert: 'Invert current page',
|
|
|
selectNone: 'Clear all data',
|
|
|
selectionAll: 'Select all data',
|
|
|
sortTitle: 'Sort',
|
|
|
expand: 'Expand row',
|
|
|
collapse: 'Collapse row',
|
|
|
triggerDesc: 'Click to sort descending',
|
|
|
triggerAsc: 'Click to sort ascending',
|
|
|
cancelSort: 'Click to cancel sorting'
|
|
|
},
|
|
|
Tour: {
|
|
|
Next: 'Next',
|
|
|
Previous: 'Previous',
|
|
|
Finish: 'Finish'
|
|
|
},
|
|
|
Modal: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancel',
|
|
|
justOkText: 'OK'
|
|
|
},
|
|
|
Popconfirm: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancel'
|
|
|
},
|
|
|
Transfer: {
|
|
|
titles: ['', ''],
|
|
|
searchPlaceholder: 'Search here',
|
|
|
itemUnit: 'item',
|
|
|
itemsUnit: 'items',
|
|
|
remove: 'Remove',
|
|
|
selectCurrent: 'Select current page',
|
|
|
removeCurrent: 'Remove current page',
|
|
|
selectAll: 'Select all data',
|
|
|
removeAll: 'Remove all data',
|
|
|
selectInvert: 'Invert current page'
|
|
|
},
|
|
|
Upload: {
|
|
|
uploading: 'Uploading...',
|
|
|
removeFile: 'Remove file',
|
|
|
uploadError: 'Upload error',
|
|
|
previewFile: 'Preview file',
|
|
|
downloadFile: 'Download file'
|
|
|
},
|
|
|
Empty: {
|
|
|
description: 'No data'
|
|
|
},
|
|
|
Icon: {
|
|
|
icon: 'icon'
|
|
|
},
|
|
|
Text: {
|
|
|
edit: 'Edit',
|
|
|
copy: 'Copy',
|
|
|
copied: 'Copied',
|
|
|
expand: 'Expand'
|
|
|
},
|
|
|
PageHeader: {
|
|
|
back: 'Back'
|
|
|
},
|
|
|
Form: {
|
|
|
optional: '(optional)',
|
|
|
defaultValidateMessages: {
|
|
|
default: 'Field validation error for ${label}',
|
|
|
required: 'Please enter ${label}',
|
|
|
enum: '${label} must be one of [${enum}]',
|
|
|
whitespace: '${label} cannot be a blank character',
|
|
|
date: {
|
|
|
format: '${label} date format is invalid',
|
|
|
parse: '${label} cannot be converted to a date',
|
|
|
invalid: '${label} is an invalid date'
|
|
|
},
|
|
|
types: {
|
|
|
string: typeTemplate,
|
|
|
method: typeTemplate,
|
|
|
array: typeTemplate,
|
|
|
object: typeTemplate,
|
|
|
number: typeTemplate,
|
|
|
date: typeTemplate,
|
|
|
boolean: typeTemplate,
|
|
|
integer: typeTemplate,
|
|
|
float: typeTemplate,
|
|
|
regexp: typeTemplate,
|
|
|
email: typeTemplate,
|
|
|
url: typeTemplate,
|
|
|
hex: typeTemplate
|
|
|
},
|
|
|
string: {
|
|
|
len: '${label} must be ${len} characters',
|
|
|
min: '${label} must be at least ${min} characters',
|
|
|
max: '${label} must be up to ${max} characters',
|
|
|
range: '${label} must be between ${min}-${max} characters'
|
|
|
},
|
|
|
number: {
|
|
|
len: '${label} must be equal to ${len}',
|
|
|
min: '${label} must be minimum ${min}',
|
|
|
max: '${label} must be maximum ${max}',
|
|
|
range: '${label} must be between ${min}-${max}'
|
|
|
},
|
|
|
array: {
|
|
|
len: 'Must be ${len} ${label}',
|
|
|
min: 'At least ${min} ${label}',
|
|
|
max: 'At most ${max} ${label}',
|
|
|
range: 'The amount of ${label} must be between ${min}-${max}'
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: '${label} does not match the pattern ${pattern}'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
Image: {
|
|
|
preview: 'Preview'
|
|
|
},
|
|
|
QRCode: {
|
|
|
expired: 'QR code expired',
|
|
|
refresh: 'Refresh'
|
|
|
}
|
|
|
};
|
|
|
var _default = localeValues;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/es_ES.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/es_ES.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _es_ES = _interopRequireDefault(__webpack_require__(/*! rc-pagination/lib/locale/es_ES */ "./node_modules/rc-pagination/lib/locale/es_ES.js"));
|
|
|
var _es_ES2 = _interopRequireDefault(__webpack_require__(/*! ../calendar/locale/es_ES */ "./node_modules/antd/lib/calendar/locale/es_ES.js"));
|
|
|
var _es_ES3 = _interopRequireDefault(__webpack_require__(/*! ../date-picker/locale/es_ES */ "./node_modules/antd/lib/date-picker/locale/es_ES.js"));
|
|
|
var _es_ES4 = _interopRequireDefault(__webpack_require__(/*! ../time-picker/locale/es_ES */ "./node_modules/antd/lib/time-picker/locale/es_ES.js"));
|
|
|
/* eslint-disable no-template-curly-in-string */
|
|
|
|
|
|
const typeTemplate = '${label} no es un ${type} válido';
|
|
|
const localeValues = {
|
|
|
locale: 'es',
|
|
|
Pagination: _es_ES.default,
|
|
|
DatePicker: _es_ES3.default,
|
|
|
TimePicker: _es_ES4.default,
|
|
|
Calendar: _es_ES2.default,
|
|
|
global: {
|
|
|
placeholder: 'Seleccione'
|
|
|
},
|
|
|
Table: {
|
|
|
filterTitle: 'Filtrar menú',
|
|
|
filterConfirm: 'Aceptar',
|
|
|
filterReset: 'Reiniciar',
|
|
|
filterEmptyText: 'Sin filtros',
|
|
|
filterCheckall: 'Seleccionar todo',
|
|
|
filterSearchPlaceholder: 'Buscar en filtros',
|
|
|
emptyText: 'Sin datos',
|
|
|
selectAll: 'Seleccionar todo',
|
|
|
selectInvert: 'Invertir selección',
|
|
|
selectNone: 'Vacíe todo',
|
|
|
selectionAll: 'Seleccionar todos los datos',
|
|
|
sortTitle: 'Ordenar',
|
|
|
expand: 'Expandir fila',
|
|
|
collapse: 'Colapsar fila',
|
|
|
triggerDesc: 'Click para ordenar en orden descendente',
|
|
|
triggerAsc: 'Click para ordenar en orden ascendente',
|
|
|
cancelSort: 'Click para cancelar ordenamiento'
|
|
|
},
|
|
|
Modal: {
|
|
|
okText: 'Aceptar',
|
|
|
cancelText: 'Cancelar',
|
|
|
justOkText: 'Aceptar'
|
|
|
},
|
|
|
Popconfirm: {
|
|
|
okText: 'Aceptar',
|
|
|
cancelText: 'Cancelar'
|
|
|
},
|
|
|
Transfer: {
|
|
|
titles: ['', ''],
|
|
|
searchPlaceholder: 'Buscar aquí',
|
|
|
itemUnit: 'elemento',
|
|
|
itemsUnit: 'elementos',
|
|
|
remove: 'Eliminar',
|
|
|
selectCurrent: 'Seleccionar página actual',
|
|
|
removeCurrent: 'Remover página actual',
|
|
|
selectAll: 'Seleccionar todos los datos',
|
|
|
removeAll: 'Eliminar todos los datos',
|
|
|
selectInvert: 'Invertir página actual'
|
|
|
},
|
|
|
Upload: {
|
|
|
uploading: 'Subiendo...',
|
|
|
removeFile: 'Eliminar archivo',
|
|
|
uploadError: 'Error al subir el archivo',
|
|
|
previewFile: 'Vista previa',
|
|
|
downloadFile: 'Descargar archivo'
|
|
|
},
|
|
|
Empty: {
|
|
|
description: 'No hay datos'
|
|
|
},
|
|
|
Icon: {
|
|
|
icon: 'ícono'
|
|
|
},
|
|
|
Text: {
|
|
|
edit: 'Editar',
|
|
|
copy: 'Copiar',
|
|
|
copied: 'Copiado',
|
|
|
expand: 'Expandir'
|
|
|
},
|
|
|
PageHeader: {
|
|
|
back: 'Volver'
|
|
|
},
|
|
|
Form: {
|
|
|
optional: '(opcional)',
|
|
|
defaultValidateMessages: {
|
|
|
default: 'Error de validación del campo ${label}',
|
|
|
required: 'Por favor ingresar ${label}',
|
|
|
enum: '${label} debe ser uno de [${enum}]',
|
|
|
whitespace: '${label} no puede ser un carácter en blanco',
|
|
|
date: {
|
|
|
format: 'El formato de fecha de ${label} es inválido',
|
|
|
parse: '${label} no se puede convertir a una fecha',
|
|
|
invalid: '${label} es una fecha inválida'
|
|
|
},
|
|
|
types: {
|
|
|
string: typeTemplate,
|
|
|
method: typeTemplate,
|
|
|
array: typeTemplate,
|
|
|
object: typeTemplate,
|
|
|
number: typeTemplate,
|
|
|
date: typeTemplate,
|
|
|
boolean: typeTemplate,
|
|
|
integer: typeTemplate,
|
|
|
float: typeTemplate,
|
|
|
regexp: typeTemplate,
|
|
|
email: typeTemplate,
|
|
|
url: typeTemplate,
|
|
|
hex: typeTemplate
|
|
|
},
|
|
|
string: {
|
|
|
len: '${label} debe tener ${len} caracteres',
|
|
|
min: '${label} debe tener al menos ${min} caracteres',
|
|
|
max: '${label} debe tener hasta ${max} caracteres',
|
|
|
range: '${label} debe tener entre ${min}-${max} caracteres'
|
|
|
},
|
|
|
number: {
|
|
|
len: '${label} debe ser igual a ${len}',
|
|
|
min: '${label} valor mínimo es ${min}',
|
|
|
max: '${label} valor máximo es ${max}',
|
|
|
range: '${label} debe estar entre ${min}-${max}'
|
|
|
},
|
|
|
array: {
|
|
|
len: 'Debe ser ${len} ${label}',
|
|
|
min: 'Al menos ${min} ${label}',
|
|
|
max: 'A lo mucho ${max} ${label}',
|
|
|
range: 'El monto de ${label} debe estar entre ${min}-${max}'
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: '${label} no coincide con el patrón ${pattern}'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
Image: {
|
|
|
preview: 'Previsualización'
|
|
|
}
|
|
|
};
|
|
|
var _default = localeValues;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/index.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/index.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = exports.ANT_MARK = void 0;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! ../_util/warning */ "./node_modules/antd/lib/_util/warning.js"));
|
|
|
var _locale = __webpack_require__(/*! ../modal/locale */ "./node_modules/antd/lib/modal/locale.js");
|
|
|
var _context = _interopRequireDefault(__webpack_require__(/*! ./context */ "./node_modules/antd/lib/locale/context.js"));
|
|
|
const ANT_MARK = 'internalMark';
|
|
|
exports.ANT_MARK = ANT_MARK;
|
|
|
const LocaleProvider = props => {
|
|
|
const {
|
|
|
locale = {},
|
|
|
children,
|
|
|
_ANT_MARK__
|
|
|
} = props;
|
|
|
if (true) {
|
|
|
true ? (0, _warning.default)(_ANT_MARK__ === ANT_MARK, 'LocaleProvider', '`LocaleProvider` is deprecated. Please use `locale` with `ConfigProvider` instead: http://u.ant.design/locale') : 0;
|
|
|
}
|
|
|
React.useEffect(() => {
|
|
|
(0, _locale.changeConfirmLocale)(locale && locale.Modal);
|
|
|
return () => {
|
|
|
(0, _locale.changeConfirmLocale)();
|
|
|
};
|
|
|
}, [locale]);
|
|
|
const getMemoizedContextValue = React.useMemo(() => Object.assign(Object.assign({}, locale), {
|
|
|
exist: true
|
|
|
}), [locale]);
|
|
|
return /*#__PURE__*/React.createElement(_context.default.Provider, {
|
|
|
value: getMemoizedContextValue
|
|
|
}, children);
|
|
|
};
|
|
|
if (true) {
|
|
|
LocaleProvider.displayName = 'LocaleProvider';
|
|
|
}
|
|
|
var _default = LocaleProvider;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/pt_BR.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/pt_BR.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _pt_BR = _interopRequireDefault(__webpack_require__(/*! rc-pagination/lib/locale/pt_BR */ "./node_modules/rc-pagination/lib/locale/pt_BR.js"));
|
|
|
var _pt_BR2 = _interopRequireDefault(__webpack_require__(/*! ../calendar/locale/pt_BR */ "./node_modules/antd/lib/calendar/locale/pt_BR.js"));
|
|
|
var _pt_BR3 = _interopRequireDefault(__webpack_require__(/*! ../date-picker/locale/pt_BR */ "./node_modules/antd/lib/date-picker/locale/pt_BR.js"));
|
|
|
var _pt_BR4 = _interopRequireDefault(__webpack_require__(/*! ../time-picker/locale/pt_BR */ "./node_modules/antd/lib/time-picker/locale/pt_BR.js"));
|
|
|
/* eslint-disable no-template-curly-in-string */
|
|
|
|
|
|
const typeTemplate = '${label} não é um ${type} válido';
|
|
|
const localeValues = {
|
|
|
locale: 'pt-br',
|
|
|
Pagination: _pt_BR.default,
|
|
|
DatePicker: _pt_BR3.default,
|
|
|
TimePicker: _pt_BR4.default,
|
|
|
Calendar: _pt_BR2.default,
|
|
|
global: {
|
|
|
placeholder: 'Por favor escolha'
|
|
|
},
|
|
|
Table: {
|
|
|
filterTitle: 'Menu de Filtro',
|
|
|
filterConfirm: 'OK',
|
|
|
filterReset: 'Resetar',
|
|
|
filterEmptyText: 'Sem filtros',
|
|
|
filterCheckall: 'Selecionar todos os itens',
|
|
|
filterSearchPlaceholder: 'Pesquisar nos filtros',
|
|
|
emptyText: 'Sem conteúdo',
|
|
|
selectAll: 'Selecionar página atual',
|
|
|
selectInvert: 'Inverter seleção',
|
|
|
selectNone: 'Apagar todo o conteúdo',
|
|
|
selectionAll: 'Selecionar todo o conteúdo',
|
|
|
sortTitle: 'Ordenar título',
|
|
|
expand: 'Expandir linha',
|
|
|
collapse: 'Colapsar linha',
|
|
|
triggerDesc: 'Clique organiza por descendente',
|
|
|
triggerAsc: 'Clique organiza por ascendente',
|
|
|
cancelSort: 'Clique para cancelar organização'
|
|
|
},
|
|
|
Tour: {
|
|
|
Next: 'Próximo',
|
|
|
Previous: 'Anterior',
|
|
|
Finish: 'Finalizar'
|
|
|
},
|
|
|
Modal: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancelar',
|
|
|
justOkText: 'OK'
|
|
|
},
|
|
|
Popconfirm: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancelar'
|
|
|
},
|
|
|
Transfer: {
|
|
|
titles: ['', ''],
|
|
|
searchPlaceholder: 'Procurar',
|
|
|
itemUnit: 'item',
|
|
|
itemsUnit: 'items',
|
|
|
remove: 'Remover',
|
|
|
selectCurrent: 'Selecionar página atual',
|
|
|
removeCurrent: 'Remover página atual',
|
|
|
selectAll: 'Selecionar todos',
|
|
|
removeAll: 'Remover todos',
|
|
|
selectInvert: 'Inverter seleção atual'
|
|
|
},
|
|
|
Upload: {
|
|
|
uploading: 'Enviando...',
|
|
|
removeFile: 'Remover arquivo',
|
|
|
uploadError: 'Erro no envio',
|
|
|
previewFile: 'Visualizar arquivo',
|
|
|
downloadFile: 'Baixar arquivo'
|
|
|
},
|
|
|
Empty: {
|
|
|
description: 'Não há dados'
|
|
|
},
|
|
|
Icon: {
|
|
|
icon: 'ícone'
|
|
|
},
|
|
|
Text: {
|
|
|
edit: 'editar',
|
|
|
copy: 'copiar',
|
|
|
copied: 'copiado',
|
|
|
expand: 'expandir'
|
|
|
},
|
|
|
PageHeader: {
|
|
|
back: 'Retornar'
|
|
|
},
|
|
|
Form: {
|
|
|
optional: '(opcional)',
|
|
|
defaultValidateMessages: {
|
|
|
default: 'Erro ${label} na validação de campo',
|
|
|
required: 'Por favor, insira ${label}',
|
|
|
enum: '${label} deve ser um dos seguinte: [${enum}]',
|
|
|
whitespace: '${label} não pode ser um carácter vazio',
|
|
|
date: {
|
|
|
format: ' O formato de data ${label} é inválido',
|
|
|
parse: '${label} não pode ser convertido para uma data',
|
|
|
invalid: '${label} é uma data inválida'
|
|
|
},
|
|
|
types: {
|
|
|
string: typeTemplate,
|
|
|
method: typeTemplate,
|
|
|
array: typeTemplate,
|
|
|
object: typeTemplate,
|
|
|
number: typeTemplate,
|
|
|
date: typeTemplate,
|
|
|
boolean: typeTemplate,
|
|
|
integer: typeTemplate,
|
|
|
float: typeTemplate,
|
|
|
regexp: typeTemplate,
|
|
|
email: typeTemplate,
|
|
|
url: typeTemplate,
|
|
|
hex: typeTemplate
|
|
|
},
|
|
|
string: {
|
|
|
len: '${label} deve possuir ${len} caracteres',
|
|
|
min: '${label} deve possuir ao menos ${min} caracteres',
|
|
|
max: '${label} deve possuir no máximo ${max} caracteres',
|
|
|
range: '${label} deve possuir entre ${min} e ${max} caracteres'
|
|
|
},
|
|
|
number: {
|
|
|
len: '${label} deve ser igual à ${len}',
|
|
|
min: 'O valor mínimo de ${label} é ${min}',
|
|
|
max: 'O valor máximo de ${label} é ${max}',
|
|
|
range: '${label} deve estar entre ${min} e ${max}'
|
|
|
},
|
|
|
array: {
|
|
|
len: 'Deve ser ${len} ${label}',
|
|
|
min: 'No mínimo ${min} ${label}',
|
|
|
max: 'No máximo ${max} ${label}',
|
|
|
range: 'A quantidade de ${label} deve estar entre ${min} e ${max}'
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: '${label} não se encaixa no padrão ${pattern}'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
Image: {
|
|
|
preview: 'Pré-visualização'
|
|
|
}
|
|
|
};
|
|
|
var _default = localeValues;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/locale/pt_PT.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/locale/pt_PT.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _pt_PT = _interopRequireDefault(__webpack_require__(/*! rc-pagination/lib/locale/pt_PT */ "./node_modules/rc-pagination/lib/locale/pt_PT.js"));
|
|
|
var _pt_PT2 = _interopRequireDefault(__webpack_require__(/*! ../calendar/locale/pt_PT */ "./node_modules/antd/lib/calendar/locale/pt_PT.js"));
|
|
|
var _pt_PT3 = _interopRequireDefault(__webpack_require__(/*! ../date-picker/locale/pt_PT */ "./node_modules/antd/lib/date-picker/locale/pt_PT.js"));
|
|
|
var _pt_PT4 = _interopRequireDefault(__webpack_require__(/*! ../time-picker/locale/pt_PT */ "./node_modules/antd/lib/time-picker/locale/pt_PT.js"));
|
|
|
/* eslint-disable no-template-curly-in-string */
|
|
|
|
|
|
const typeTemplate = '${label} não é um ${type} válido';
|
|
|
const localeValues = {
|
|
|
locale: 'pt',
|
|
|
Pagination: _pt_PT.default,
|
|
|
DatePicker: _pt_PT3.default,
|
|
|
TimePicker: _pt_PT4.default,
|
|
|
Calendar: _pt_PT2.default,
|
|
|
global: {
|
|
|
placeholder: 'Por favor escolha'
|
|
|
},
|
|
|
Table: {
|
|
|
filterTitle: 'Filtro',
|
|
|
filterConfirm: 'Aplicar',
|
|
|
filterReset: 'Reiniciar',
|
|
|
filterEmptyText: 'Sem filtros',
|
|
|
filterCheckall: 'Selecionar todos os itens',
|
|
|
filterSearchPlaceholder: 'Pesquisar nos filtros',
|
|
|
emptyText: 'Sem conteúdo',
|
|
|
selectAll: 'Selecionar página atual',
|
|
|
selectInvert: 'Inverter seleção',
|
|
|
sortTitle: 'Ordenação',
|
|
|
selectNone: 'Apagar todo o conteúdo',
|
|
|
selectionAll: 'Selecionar todo o conteúdo',
|
|
|
expand: 'Expandir linha',
|
|
|
collapse: 'Colapsar linha',
|
|
|
triggerDesc: 'Clique organiza por descendente',
|
|
|
triggerAsc: 'Clique organiza por ascendente',
|
|
|
cancelSort: 'Clique para cancelar organização'
|
|
|
},
|
|
|
Modal: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancelar',
|
|
|
justOkText: 'OK'
|
|
|
},
|
|
|
Popconfirm: {
|
|
|
okText: 'OK',
|
|
|
cancelText: 'Cancelar'
|
|
|
},
|
|
|
Transfer: {
|
|
|
titles: ['', ''],
|
|
|
searchPlaceholder: 'Procurar...',
|
|
|
itemUnit: 'item',
|
|
|
itemsUnit: 'itens',
|
|
|
remove: 'Remover',
|
|
|
selectCurrent: 'Selecionar página atual',
|
|
|
removeCurrent: 'Remover página atual',
|
|
|
selectAll: 'Selecionar tudo',
|
|
|
removeAll: 'Remover tudo',
|
|
|
selectInvert: 'Inverter a página actual'
|
|
|
},
|
|
|
Upload: {
|
|
|
uploading: 'A carregar...',
|
|
|
removeFile: 'Remover',
|
|
|
uploadError: 'Erro ao carregar',
|
|
|
previewFile: 'Pré-visualizar',
|
|
|
downloadFile: 'Baixar'
|
|
|
},
|
|
|
Empty: {
|
|
|
description: 'Sem resultados'
|
|
|
},
|
|
|
Icon: {
|
|
|
icon: 'ícone'
|
|
|
},
|
|
|
Text: {
|
|
|
edit: 'editar',
|
|
|
copy: 'copiar',
|
|
|
copied: 'copiado',
|
|
|
expand: 'expandir'
|
|
|
},
|
|
|
PageHeader: {
|
|
|
back: 'voltar'
|
|
|
},
|
|
|
Form: {
|
|
|
optional: '(opcional)',
|
|
|
defaultValidateMessages: {
|
|
|
default: 'Erro ${label} na validação de campo',
|
|
|
required: 'Por favor, insira ${label}',
|
|
|
enum: '${label} deve ser um dos seguinte: [${enum}]',
|
|
|
whitespace: '${label} não pode ser um carácter vazio',
|
|
|
date: {
|
|
|
format: ' O formato de data ${label} é inválido',
|
|
|
parse: '${label} não pode ser convertido para uma data',
|
|
|
invalid: '${label} é uma data inválida'
|
|
|
},
|
|
|
types: {
|
|
|
string: typeTemplate,
|
|
|
method: typeTemplate,
|
|
|
array: typeTemplate,
|
|
|
object: typeTemplate,
|
|
|
number: typeTemplate,
|
|
|
date: typeTemplate,
|
|
|
boolean: typeTemplate,
|
|
|
integer: typeTemplate,
|
|
|
float: typeTemplate,
|
|
|
regexp: typeTemplate,
|
|
|
email: typeTemplate,
|
|
|
url: typeTemplate,
|
|
|
hex: typeTemplate
|
|
|
},
|
|
|
string: {
|
|
|
len: '${label} deve possuir ${len} caracteres',
|
|
|
min: '${label} deve possuir ao menos ${min} caracteres',
|
|
|
max: '${label} deve possuir no máximo ${max} caracteres',
|
|
|
range: '${label} deve possuir entre ${min} e ${max} caracteres'
|
|
|
},
|
|
|
number: {
|
|
|
len: '${label} deve ser igual à ${len}',
|
|
|
min: 'O valor mínimo de ${label} é ${min}',
|
|
|
max: 'O valor máximo de ${label} é ${max}',
|
|
|
range: '${label} deve estar entre ${min} e ${max}'
|
|
|
},
|
|
|
array: {
|
|
|
len: 'Deve ser ${len} ${label}',
|
|
|
min: 'No mínimo ${min} ${label}',
|
|
|
max: 'No máximo ${max} ${label}',
|
|
|
range: 'A quantidade de ${label} deve estar entre ${min} e ${max}'
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: '${label} não se enquadra no padrão ${pattern}'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
Image: {
|
|
|
preview: 'Pré-visualização'
|
|
|
}
|
|
|
};
|
|
|
var _default = localeValues;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/modal/locale.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/modal/locale.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.changeConfirmLocale = changeConfirmLocale;
|
|
|
exports.getConfirmLocale = getConfirmLocale;
|
|
|
var _en_US = _interopRequireDefault(__webpack_require__(/*! ../locale/en_US */ "./node_modules/antd/lib/locale/en_US.js"));
|
|
|
let runtimeLocale = Object.assign({}, _en_US.default.Modal);
|
|
|
function changeConfirmLocale(newLocale) {
|
|
|
if (newLocale) {
|
|
|
runtimeLocale = Object.assign(Object.assign({}, runtimeLocale), newLocale);
|
|
|
} else {
|
|
|
runtimeLocale = Object.assign({}, _en_US.default.Modal);
|
|
|
}
|
|
|
}
|
|
|
function getConfirmLocale() {
|
|
|
return runtimeLocale;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/space/Compact.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/space/Compact.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.useCompactItemContext = exports["default"] = exports.SpaceCompactItemContext = exports.NoCompactStyle = void 0;
|
|
|
var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"));
|
|
|
var _toArray = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/Children/toArray */ "./node_modules/rc-util/lib/Children/toArray.js"));
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _configProvider = __webpack_require__(/*! ../config-provider */ "./node_modules/antd/lib/config-provider/index.js");
|
|
|
var _style = _interopRequireDefault(__webpack_require__(/*! ./style */ "./node_modules/antd/lib/space/style/index.js"));
|
|
|
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
|
var t = {};
|
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
|
}
|
|
|
return t;
|
|
|
};
|
|
|
const SpaceCompactItemContext = /*#__PURE__*/React.createContext(null);
|
|
|
exports.SpaceCompactItemContext = SpaceCompactItemContext;
|
|
|
const useCompactItemContext = (prefixCls, direction) => {
|
|
|
const compactItemContext = React.useContext(SpaceCompactItemContext);
|
|
|
const compactItemClassnames = React.useMemo(() => {
|
|
|
if (!compactItemContext) return '';
|
|
|
const {
|
|
|
compactDirection,
|
|
|
isFirstItem,
|
|
|
isLastItem
|
|
|
} = compactItemContext;
|
|
|
const separator = compactDirection === 'vertical' ? '-vertical-' : '-';
|
|
|
return (0, _classnames.default)({
|
|
|
[`${prefixCls}-compact${separator}item`]: true,
|
|
|
[`${prefixCls}-compact${separator}first-item`]: isFirstItem,
|
|
|
[`${prefixCls}-compact${separator}last-item`]: isLastItem,
|
|
|
[`${prefixCls}-compact${separator}item-rtl`]: direction === 'rtl'
|
|
|
});
|
|
|
}, [prefixCls, direction, compactItemContext]);
|
|
|
return {
|
|
|
compactSize: compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.compactSize,
|
|
|
compactDirection: compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.compactDirection,
|
|
|
compactItemClassnames
|
|
|
};
|
|
|
};
|
|
|
exports.useCompactItemContext = useCompactItemContext;
|
|
|
const NoCompactStyle = _ref => {
|
|
|
let {
|
|
|
children
|
|
|
} = _ref;
|
|
|
return /*#__PURE__*/React.createElement(SpaceCompactItemContext.Provider, {
|
|
|
value: null
|
|
|
}, children);
|
|
|
};
|
|
|
exports.NoCompactStyle = NoCompactStyle;
|
|
|
const CompactItem = _a => {
|
|
|
var {
|
|
|
children
|
|
|
} = _a,
|
|
|
otherProps = __rest(_a, ["children"]);
|
|
|
return /*#__PURE__*/React.createElement(SpaceCompactItemContext.Provider, {
|
|
|
value: otherProps
|
|
|
}, children);
|
|
|
};
|
|
|
const Compact = props => {
|
|
|
const {
|
|
|
getPrefixCls,
|
|
|
direction: directionConfig
|
|
|
} = React.useContext(_configProvider.ConfigContext);
|
|
|
const {
|
|
|
size = 'middle',
|
|
|
direction,
|
|
|
block,
|
|
|
prefixCls: customizePrefixCls,
|
|
|
className,
|
|
|
rootClassName,
|
|
|
children
|
|
|
} = props,
|
|
|
restProps = __rest(props, ["size", "direction", "block", "prefixCls", "className", "rootClassName", "children"]);
|
|
|
const prefixCls = getPrefixCls('space-compact', customizePrefixCls);
|
|
|
const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
|
|
|
const clx = (0, _classnames.default)(prefixCls, hashId, {
|
|
|
[`${prefixCls}-rtl`]: directionConfig === 'rtl',
|
|
|
[`${prefixCls}-block`]: block,
|
|
|
[`${prefixCls}-vertical`]: direction === 'vertical'
|
|
|
}, className, rootClassName);
|
|
|
const compactItemContext = React.useContext(SpaceCompactItemContext);
|
|
|
const childNodes = (0, _toArray.default)(children);
|
|
|
const nodes = React.useMemo(() => childNodes.map((child, i) => {
|
|
|
const key = child && child.key || `${prefixCls}-item-${i}`;
|
|
|
return /*#__PURE__*/React.createElement(CompactItem, {
|
|
|
key: key,
|
|
|
compactSize: size,
|
|
|
compactDirection: direction,
|
|
|
isFirstItem: i === 0 && (!compactItemContext || (compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.isFirstItem)),
|
|
|
isLastItem: i === childNodes.length - 1 && (!compactItemContext || (compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.isLastItem))
|
|
|
}, child);
|
|
|
}), [size, childNodes, compactItemContext]);
|
|
|
// =========================== Render ===========================
|
|
|
if (childNodes.length === 0) {
|
|
|
return null;
|
|
|
}
|
|
|
return wrapSSR( /*#__PURE__*/React.createElement("div", Object.assign({
|
|
|
className: clx
|
|
|
}, restProps), nodes));
|
|
|
};
|
|
|
var _default = Compact;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/space/style/compact.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/space/style/compact.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const genSpaceCompactStyle = token => {
|
|
|
const {
|
|
|
componentCls
|
|
|
} = token;
|
|
|
return {
|
|
|
[componentCls]: {
|
|
|
display: 'inline-flex',
|
|
|
'&-block': {
|
|
|
display: 'flex',
|
|
|
width: '100%'
|
|
|
},
|
|
|
'&-vertical': {
|
|
|
flexDirection: 'column'
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
// ============================== Export ==============================
|
|
|
var _default = genSpaceCompactStyle;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/space/style/index.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/space/style/index.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _internal = __webpack_require__(/*! ../../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
var _compact = _interopRequireDefault(__webpack_require__(/*! ./compact */ "./node_modules/antd/lib/space/style/compact.js"));
|
|
|
const genSpaceStyle = token => {
|
|
|
const {
|
|
|
componentCls
|
|
|
} = token;
|
|
|
return {
|
|
|
[componentCls]: {
|
|
|
display: 'inline-flex',
|
|
|
'&-rtl': {
|
|
|
direction: 'rtl'
|
|
|
},
|
|
|
'&-vertical': {
|
|
|
flexDirection: 'column'
|
|
|
},
|
|
|
'&-align': {
|
|
|
flexDirection: 'column',
|
|
|
'&-center': {
|
|
|
alignItems: 'center'
|
|
|
},
|
|
|
'&-start': {
|
|
|
alignItems: 'flex-start'
|
|
|
},
|
|
|
'&-end': {
|
|
|
alignItems: 'flex-end'
|
|
|
},
|
|
|
'&-baseline': {
|
|
|
alignItems: 'baseline'
|
|
|
}
|
|
|
},
|
|
|
[`${componentCls}-item`]: {
|
|
|
'&:empty': {
|
|
|
display: 'none'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
// ============================== Export ==============================
|
|
|
var _default = (0, _internal.genComponentStyleHook)('Space', token => [genSpaceStyle(token), (0, _compact.default)(token)]);
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/style/compact-item-vertical.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/style/compact-item-vertical.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.genCompactItemVerticalStyle = genCompactItemVerticalStyle;
|
|
|
function compactItemVerticalBorder(token, parentCls) {
|
|
|
return {
|
|
|
// border collapse
|
|
|
[`&-item:not(${parentCls}-last-item)`]: {
|
|
|
marginBottom: -token.lineWidth
|
|
|
},
|
|
|
'&-item': {
|
|
|
'&:hover,&:focus,&:active': {
|
|
|
zIndex: 2
|
|
|
},
|
|
|
'&[disabled]': {
|
|
|
zIndex: 0
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
function compactItemBorderVerticalRadius(prefixCls, parentCls) {
|
|
|
return {
|
|
|
[`&-item:not(${parentCls}-first-item):not(${parentCls}-last-item)`]: {
|
|
|
borderRadius: 0
|
|
|
},
|
|
|
[`&-item${parentCls}-first-item:not(${parentCls}-last-item)`]: {
|
|
|
[`&, &${prefixCls}-sm, &${prefixCls}-lg`]: {
|
|
|
borderEndEndRadius: 0,
|
|
|
borderEndStartRadius: 0
|
|
|
}
|
|
|
},
|
|
|
[`&-item${parentCls}-last-item:not(${parentCls}-first-item)`]: {
|
|
|
[`&, &${prefixCls}-sm, &${prefixCls}-lg`]: {
|
|
|
borderStartStartRadius: 0,
|
|
|
borderStartEndRadius: 0
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
function genCompactItemVerticalStyle(token) {
|
|
|
const compactCls = `${token.componentCls}-compact-vertical`;
|
|
|
return {
|
|
|
[compactCls]: Object.assign(Object.assign({}, compactItemVerticalBorder(token, compactCls)), compactItemBorderVerticalRadius(token.componentCls, compactCls))
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/style/compact-item.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/style/compact-item.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.genCompactItemStyle = genCompactItemStyle;
|
|
|
// handle border collapse
|
|
|
function compactItemBorder(token, parentCls, options) {
|
|
|
const {
|
|
|
focusElCls,
|
|
|
focus,
|
|
|
borderElCls
|
|
|
} = options;
|
|
|
const childCombinator = borderElCls ? '> *' : '';
|
|
|
const hoverEffects = ['hover', focus ? 'focus' : null, 'active'].filter(Boolean).map(n => `&:${n} ${childCombinator}`).join(',');
|
|
|
return {
|
|
|
[`&-item:not(${parentCls}-last-item)`]: {
|
|
|
marginInlineEnd: -token.lineWidth
|
|
|
},
|
|
|
'&-item': Object.assign(Object.assign({
|
|
|
[hoverEffects]: {
|
|
|
zIndex: 2
|
|
|
}
|
|
|
}, focusElCls ? {
|
|
|
[`&${focusElCls}`]: {
|
|
|
zIndex: 2
|
|
|
}
|
|
|
} : {}), {
|
|
|
[`&[disabled] ${childCombinator}`]: {
|
|
|
zIndex: 0
|
|
|
}
|
|
|
})
|
|
|
};
|
|
|
}
|
|
|
// handle border-radius
|
|
|
function compactItemBorderRadius(prefixCls, parentCls, options) {
|
|
|
const {
|
|
|
borderElCls
|
|
|
} = options;
|
|
|
const childCombinator = borderElCls ? `> ${borderElCls}` : '';
|
|
|
return {
|
|
|
[`&-item:not(${parentCls}-first-item):not(${parentCls}-last-item) ${childCombinator}`]: {
|
|
|
borderRadius: 0
|
|
|
},
|
|
|
[`&-item:not(${parentCls}-last-item)${parentCls}-first-item`]: {
|
|
|
[`& ${childCombinator}, &${prefixCls}-sm ${childCombinator}, &${prefixCls}-lg ${childCombinator}`]: {
|
|
|
borderStartEndRadius: 0,
|
|
|
borderEndEndRadius: 0
|
|
|
}
|
|
|
},
|
|
|
[`&-item:not(${parentCls}-first-item)${parentCls}-last-item`]: {
|
|
|
[`& ${childCombinator}, &${prefixCls}-sm ${childCombinator}, &${prefixCls}-lg ${childCombinator}`]: {
|
|
|
borderStartStartRadius: 0,
|
|
|
borderEndStartRadius: 0
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
function genCompactItemStyle(token) {
|
|
|
let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
|
|
focus: true
|
|
|
};
|
|
|
const {
|
|
|
componentCls
|
|
|
} = token;
|
|
|
const compactCls = `${componentCls}-compact`;
|
|
|
return {
|
|
|
[compactCls]: Object.assign(Object.assign({}, compactItemBorder(token, compactCls, options)), compactItemBorderRadius(componentCls, compactCls, options))
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/style/index.js":
|
|
|
/*!**********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/style/index.js ***!
|
|
|
\**********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.genLinkStyle = exports.genFocusStyle = exports.genFocusOutline = exports.genCommonStyle = exports.clearFix = void 0;
|
|
|
Object.defineProperty(exports, "genPresetColor", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _presetColor.genPresetColor;
|
|
|
}
|
|
|
}));
|
|
|
Object.defineProperty(exports, "operationUnit", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _operationUnit.operationUnit;
|
|
|
}
|
|
|
}));
|
|
|
exports.resetIcon = exports.resetComponent = void 0;
|
|
|
Object.defineProperty(exports, "roundedArrow", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _roundedArrow.roundedArrow;
|
|
|
}
|
|
|
}));
|
|
|
exports.textEllipsis = void 0;
|
|
|
var _operationUnit = __webpack_require__(/*! ./operationUnit */ "./node_modules/antd/lib/style/operationUnit.js");
|
|
|
var _presetColor = __webpack_require__(/*! ./presetColor */ "./node_modules/antd/lib/style/presetColor.js");
|
|
|
var _roundedArrow = __webpack_require__(/*! ./roundedArrow */ "./node_modules/antd/lib/style/roundedArrow.js");
|
|
|
const textEllipsis = {
|
|
|
overflow: 'hidden',
|
|
|
whiteSpace: 'nowrap',
|
|
|
textOverflow: 'ellipsis'
|
|
|
};
|
|
|
exports.textEllipsis = textEllipsis;
|
|
|
const resetComponent = token => ({
|
|
|
boxSizing: 'border-box',
|
|
|
margin: 0,
|
|
|
padding: 0,
|
|
|
color: token.colorText,
|
|
|
fontSize: token.fontSize,
|
|
|
// font-variant: @font-variant-base;
|
|
|
lineHeight: token.lineHeight,
|
|
|
listStyle: 'none',
|
|
|
// font-feature-settings: @font-feature-settings-base;
|
|
|
fontFamily: token.fontFamily
|
|
|
});
|
|
|
exports.resetComponent = resetComponent;
|
|
|
const resetIcon = () => ({
|
|
|
display: 'inline-flex',
|
|
|
alignItems: 'center',
|
|
|
color: 'inherit',
|
|
|
fontStyle: 'normal',
|
|
|
lineHeight: 0,
|
|
|
textAlign: 'center',
|
|
|
textTransform: 'none',
|
|
|
// for SVG icon, see https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4
|
|
|
verticalAlign: '-0.125em',
|
|
|
textRendering: 'optimizeLegibility',
|
|
|
'-webkit-font-smoothing': 'antialiased',
|
|
|
'-moz-osx-font-smoothing': 'grayscale',
|
|
|
'> *': {
|
|
|
lineHeight: 1
|
|
|
},
|
|
|
svg: {
|
|
|
display: 'inline-block'
|
|
|
}
|
|
|
});
|
|
|
exports.resetIcon = resetIcon;
|
|
|
const clearFix = () => ({
|
|
|
// https://github.com/ant-design/ant-design/issues/21301#issuecomment-583955229
|
|
|
'&::before': {
|
|
|
display: 'table',
|
|
|
content: '""'
|
|
|
},
|
|
|
'&::after': {
|
|
|
// https://github.com/ant-design/ant-design/issues/21864
|
|
|
display: 'table',
|
|
|
clear: 'both',
|
|
|
content: '""'
|
|
|
}
|
|
|
});
|
|
|
exports.clearFix = clearFix;
|
|
|
const genLinkStyle = token => ({
|
|
|
a: {
|
|
|
color: token.colorLink,
|
|
|
textDecoration: token.linkDecoration,
|
|
|
backgroundColor: 'transparent',
|
|
|
outline: 'none',
|
|
|
cursor: 'pointer',
|
|
|
transition: `color ${token.motionDurationSlow}`,
|
|
|
'-webkit-text-decoration-skip': 'objects',
|
|
|
'&:hover': {
|
|
|
color: token.colorLinkHover
|
|
|
},
|
|
|
'&:active': {
|
|
|
color: token.colorLinkActive
|
|
|
},
|
|
|
[`&:active,
|
|
|
&:hover`]: {
|
|
|
textDecoration: token.linkHoverDecoration,
|
|
|
outline: 0
|
|
|
},
|
|
|
// https://github.com/ant-design/ant-design/issues/22503
|
|
|
'&:focus': {
|
|
|
textDecoration: token.linkFocusDecoration,
|
|
|
outline: 0
|
|
|
},
|
|
|
'&[disabled]': {
|
|
|
color: token.colorTextDisabled,
|
|
|
cursor: 'not-allowed'
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
exports.genLinkStyle = genLinkStyle;
|
|
|
const genCommonStyle = (token, componentPrefixCls) => {
|
|
|
const {
|
|
|
fontFamily,
|
|
|
fontSize
|
|
|
} = token;
|
|
|
const rootPrefixSelector = `[class^="${componentPrefixCls}"], [class*=" ${componentPrefixCls}"]`;
|
|
|
return {
|
|
|
[rootPrefixSelector]: {
|
|
|
fontFamily,
|
|
|
fontSize,
|
|
|
boxSizing: 'border-box',
|
|
|
'&::before, &::after': {
|
|
|
boxSizing: 'border-box'
|
|
|
},
|
|
|
[rootPrefixSelector]: {
|
|
|
boxSizing: 'border-box',
|
|
|
'&::before, &::after': {
|
|
|
boxSizing: 'border-box'
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
exports.genCommonStyle = genCommonStyle;
|
|
|
const genFocusOutline = token => ({
|
|
|
outline: `${token.lineWidthFocus}px solid ${token.colorPrimaryBorder}`,
|
|
|
outlineOffset: 1,
|
|
|
transition: 'outline-offset 0s, outline 0s'
|
|
|
});
|
|
|
exports.genFocusOutline = genFocusOutline;
|
|
|
const genFocusStyle = token => ({
|
|
|
'&:focus-visible': Object.assign({}, genFocusOutline(token))
|
|
|
});
|
|
|
exports.genFocusStyle = genFocusStyle;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/style/operationUnit.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/style/operationUnit.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.operationUnit = void 0;
|
|
|
// eslint-disable-next-line import/prefer-default-export
|
|
|
const operationUnit = token => ({
|
|
|
// FIXME: This use link but is a operation unit. Seems should be a colorPrimary.
|
|
|
// And Typography use this to generate link style which should not do this.
|
|
|
color: token.colorLink,
|
|
|
textDecoration: 'none',
|
|
|
outline: 'none',
|
|
|
cursor: 'pointer',
|
|
|
transition: `color ${token.motionDurationSlow}`,
|
|
|
'&:focus, &:hover': {
|
|
|
color: token.colorLinkHover
|
|
|
},
|
|
|
'&:active': {
|
|
|
color: token.colorLinkActive
|
|
|
}
|
|
|
});
|
|
|
exports.operationUnit = operationUnit;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/style/presetColor.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/style/presetColor.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.genPresetColor = genPresetColor;
|
|
|
var _internal = __webpack_require__(/*! ../theme/internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
function genPresetColor(token, genCss) {
|
|
|
return _internal.PresetColors.reduce((prev, colorKey) => {
|
|
|
const lightColor = token[`${colorKey}1`];
|
|
|
const lightBorderColor = token[`${colorKey}3`];
|
|
|
const darkColor = token[`${colorKey}6`];
|
|
|
const textColor = token[`${colorKey}7`];
|
|
|
return Object.assign(Object.assign({}, prev), genCss(colorKey, {
|
|
|
lightColor,
|
|
|
lightBorderColor,
|
|
|
darkColor,
|
|
|
textColor
|
|
|
}));
|
|
|
}, {});
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/style/roundedArrow.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/style/roundedArrow.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.roundedArrow = void 0;
|
|
|
const roundedArrow = (width, innerRadius, outerRadius, bgColor, boxShadow) => {
|
|
|
const unitWidth = width / 2;
|
|
|
const ax = 0;
|
|
|
const ay = unitWidth;
|
|
|
const bx = outerRadius * 1 / Math.sqrt(2);
|
|
|
const by = unitWidth - outerRadius * (1 - 1 / Math.sqrt(2));
|
|
|
const cx = unitWidth - innerRadius * (1 / Math.sqrt(2));
|
|
|
const cy = outerRadius * (Math.sqrt(2) - 1) + innerRadius * (1 / Math.sqrt(2));
|
|
|
const dx = 2 * unitWidth - cx;
|
|
|
const dy = cy;
|
|
|
const ex = 2 * unitWidth - bx;
|
|
|
const ey = by;
|
|
|
const fx = 2 * unitWidth - ax;
|
|
|
const fy = ay;
|
|
|
const shadowWidth = unitWidth * Math.sqrt(2) + outerRadius * (Math.sqrt(2) - 2);
|
|
|
return {
|
|
|
pointerEvents: 'none',
|
|
|
width,
|
|
|
height: width,
|
|
|
overflow: 'hidden',
|
|
|
'&::before': {
|
|
|
position: 'absolute',
|
|
|
bottom: 0,
|
|
|
insetInlineStart: 0,
|
|
|
width,
|
|
|
height: width / 2,
|
|
|
background: bgColor,
|
|
|
clipPath: `path('M ${ax} ${ay} A ${outerRadius} ${outerRadius} 0 0 0 ${bx} ${by} L ${cx} ${cy} A ${innerRadius} ${innerRadius} 0 0 1 ${dx} ${dy} L ${ex} ${ey} A ${outerRadius} ${outerRadius} 0 0 0 ${fx} ${fy} Z')`,
|
|
|
content: '""'
|
|
|
},
|
|
|
'&::after': {
|
|
|
content: '""',
|
|
|
position: 'absolute',
|
|
|
width: shadowWidth,
|
|
|
height: shadowWidth,
|
|
|
bottom: 0,
|
|
|
insetInline: 0,
|
|
|
margin: 'auto',
|
|
|
borderRadius: {
|
|
|
_skip_check_: true,
|
|
|
value: `0 0 ${innerRadius}px 0`
|
|
|
},
|
|
|
transform: 'translateY(50%) rotate(-135deg)',
|
|
|
boxShadow,
|
|
|
zIndex: 0,
|
|
|
background: 'transparent'
|
|
|
}
|
|
|
};
|
|
|
};
|
|
|
exports.roundedArrow = roundedArrow;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/index.js":
|
|
|
/*!**********************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/index.js ***!
|
|
|
\**********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _internal = __webpack_require__(/*! ./internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
var _default2 = _interopRequireDefault(__webpack_require__(/*! ./themes/default */ "./node_modules/antd/lib/theme/themes/default/index.js"));
|
|
|
var _dark = _interopRequireDefault(__webpack_require__(/*! ./themes/dark */ "./node_modules/antd/lib/theme/themes/dark/index.js"));
|
|
|
var _compact = _interopRequireDefault(__webpack_require__(/*! ./themes/compact */ "./node_modules/antd/lib/theme/themes/compact/index.js"));
|
|
|
/* eslint-disable import/prefer-default-export */
|
|
|
|
|
|
// ZombieJ: We export as object to user but array in internal.
|
|
|
// This is used to minimize the bundle size for antd package but safe to refactor as object also.
|
|
|
// Please do not export internal `useToken` directly to avoid something export unexpected.
|
|
|
/** Get current context Design Token. Will be different if you are using nest theme config. */
|
|
|
function useToken() {
|
|
|
const [theme, token, hashId] = (0, _internal.useToken)();
|
|
|
return {
|
|
|
theme,
|
|
|
token,
|
|
|
hashId
|
|
|
};
|
|
|
}
|
|
|
var _default = {
|
|
|
/** @private Test Usage. Do not use in production. */
|
|
|
defaultConfig: _internal.defaultConfig,
|
|
|
/** Default seedToken */
|
|
|
defaultSeed: _internal.defaultConfig.token,
|
|
|
useToken,
|
|
|
defaultAlgorithm: _default2.default,
|
|
|
darkAlgorithm: _dark.default,
|
|
|
compactAlgorithm: _compact.default
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/interface/index.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/interface/index.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
Object.defineProperty(exports, "PresetColors", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _presetColors.PresetColors;
|
|
|
}
|
|
|
}));
|
|
|
var _presetColors = __webpack_require__(/*! ./presetColors */ "./node_modules/antd/lib/theme/interface/presetColors.js");
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/interface/presetColors.js":
|
|
|
/*!***************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/interface/presetColors.js ***!
|
|
|
\***************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.PresetColors = void 0;
|
|
|
const PresetColors = ['blue', 'purple', 'cyan', 'green', 'magenta', 'pink', 'red', 'orange', 'yellow', 'volcano', 'geekblue', 'lime', 'gold'];
|
|
|
exports.PresetColors = PresetColors;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/internal.js":
|
|
|
/*!*************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/internal.js ***!
|
|
|
\*************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.DesignTokenContext = void 0;
|
|
|
Object.defineProperty(exports, "PresetColors", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _interface.PresetColors;
|
|
|
}
|
|
|
}));
|
|
|
exports.defaultConfig = void 0;
|
|
|
Object.defineProperty(exports, "genComponentStyleHook", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _genComponentStyleHook.default;
|
|
|
}
|
|
|
}));
|
|
|
Object.defineProperty(exports, "mergeToken", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _statistic.merge;
|
|
|
}
|
|
|
}));
|
|
|
Object.defineProperty(exports, "statistic", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _statistic.statistic;
|
|
|
}
|
|
|
}));
|
|
|
Object.defineProperty(exports, "statisticToken", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _statistic.default;
|
|
|
}
|
|
|
}));
|
|
|
Object.defineProperty(exports, "useStyleRegister", ({
|
|
|
enumerable: true,
|
|
|
get: function () {
|
|
|
return _cssinjs.useStyleRegister;
|
|
|
}
|
|
|
}));
|
|
|
exports.useToken = useToken;
|
|
|
var _cssinjs = __webpack_require__(/*! @ant-design/cssinjs */ "./node_modules/@ant-design/cssinjs/es/index.js");
|
|
|
var _react = _interopRequireDefault(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _version = _interopRequireDefault(__webpack_require__(/*! ../version */ "./node_modules/antd/lib/version/index.js"));
|
|
|
var _interface = __webpack_require__(/*! ./interface */ "./node_modules/antd/lib/theme/interface/index.js");
|
|
|
var _default = _interopRequireDefault(__webpack_require__(/*! ./themes/default */ "./node_modules/antd/lib/theme/themes/default/index.js"));
|
|
|
var _seed = _interopRequireDefault(__webpack_require__(/*! ./themes/seed */ "./node_modules/antd/lib/theme/themes/seed.js"));
|
|
|
var _alias = _interopRequireDefault(__webpack_require__(/*! ./util/alias */ "./node_modules/antd/lib/theme/util/alias.js"));
|
|
|
var _genComponentStyleHook = _interopRequireDefault(__webpack_require__(/*! ./util/genComponentStyleHook */ "./node_modules/antd/lib/theme/util/genComponentStyleHook.js"));
|
|
|
var _statistic = _interopRequireWildcard(__webpack_require__(/*! ./util/statistic */ "./node_modules/antd/lib/theme/util/statistic.js"));
|
|
|
const defaultTheme = (0, _cssinjs.createTheme)(_default.default);
|
|
|
// ================================ Context =================================
|
|
|
// To ensure snapshot stable. We disable hashed in test env.
|
|
|
const defaultConfig = {
|
|
|
token: _seed.default,
|
|
|
hashed: true
|
|
|
};
|
|
|
exports.defaultConfig = defaultConfig;
|
|
|
const DesignTokenContext = /*#__PURE__*/_react.default.createContext(defaultConfig);
|
|
|
// ================================== Hook ==================================
|
|
|
exports.DesignTokenContext = DesignTokenContext;
|
|
|
function useToken() {
|
|
|
const {
|
|
|
token: rootDesignToken,
|
|
|
hashed,
|
|
|
theme,
|
|
|
components
|
|
|
} = _react.default.useContext(DesignTokenContext);
|
|
|
const salt = `${_version.default}-${hashed || ''}`;
|
|
|
const mergedTheme = theme || defaultTheme;
|
|
|
const [token, hashId] = (0, _cssinjs.useCacheToken)(mergedTheme, [_seed.default, rootDesignToken], {
|
|
|
salt,
|
|
|
override: Object.assign({
|
|
|
override: rootDesignToken
|
|
|
}, components),
|
|
|
formatToken: _alias.default
|
|
|
});
|
|
|
return [mergedTheme, token, hashed ? hashId : ''];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/compact/genCompactSizeMapToken.js":
|
|
|
/*!******************************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/compact/genCompactSizeMapToken.js ***!
|
|
|
\******************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = genSizeMapToken;
|
|
|
function genSizeMapToken(token) {
|
|
|
const {
|
|
|
sizeUnit,
|
|
|
sizeStep
|
|
|
} = token;
|
|
|
const compactSizeStep = sizeStep - 2;
|
|
|
return {
|
|
|
sizeXXL: sizeUnit * (compactSizeStep + 10),
|
|
|
sizeXL: sizeUnit * (compactSizeStep + 6),
|
|
|
sizeLG: sizeUnit * (compactSizeStep + 2),
|
|
|
sizeMD: sizeUnit * (compactSizeStep + 2),
|
|
|
sizeMS: sizeUnit * (compactSizeStep + 1),
|
|
|
size: sizeUnit * compactSizeStep,
|
|
|
sizeSM: sizeUnit * compactSizeStep,
|
|
|
sizeXS: sizeUnit * (compactSizeStep - 1),
|
|
|
sizeXXS: sizeUnit * (compactSizeStep - 1)
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/compact/index.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/compact/index.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _genControlHeight = _interopRequireDefault(__webpack_require__(/*! ../shared/genControlHeight */ "./node_modules/antd/lib/theme/themes/shared/genControlHeight.js"));
|
|
|
var _default2 = _interopRequireDefault(__webpack_require__(/*! ../default */ "./node_modules/antd/lib/theme/themes/default/index.js"));
|
|
|
var _genCompactSizeMapToken = _interopRequireDefault(__webpack_require__(/*! ./genCompactSizeMapToken */ "./node_modules/antd/lib/theme/themes/compact/genCompactSizeMapToken.js"));
|
|
|
var _genFontMapToken = _interopRequireDefault(__webpack_require__(/*! ../shared/genFontMapToken */ "./node_modules/antd/lib/theme/themes/shared/genFontMapToken.js"));
|
|
|
const derivative = (token, mapToken) => {
|
|
|
const mergedMapToken = mapToken !== null && mapToken !== void 0 ? mapToken : (0, _default2.default)(token);
|
|
|
const fontSize = mergedMapToken.fontSizeSM; // Smaller size font-size as base
|
|
|
const controlHeight = mergedMapToken.controlHeight - 4;
|
|
|
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, mergedMapToken), (0, _genCompactSizeMapToken.default)(mapToken !== null && mapToken !== void 0 ? mapToken : token)), (0, _genFontMapToken.default)(fontSize)), {
|
|
|
// controlHeight
|
|
|
controlHeight
|
|
|
}), (0, _genControlHeight.default)(Object.assign(Object.assign({}, mergedMapToken), {
|
|
|
controlHeight
|
|
|
})));
|
|
|
};
|
|
|
var _default = derivative;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/dark/colorAlgorithm.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/dark/colorAlgorithm.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.getSolidColor = exports.getAlphaColor = void 0;
|
|
|
var _tinycolor = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js");
|
|
|
const getAlphaColor = (baseColor, alpha) => new _tinycolor.TinyColor(baseColor).setAlpha(alpha).toRgbString();
|
|
|
exports.getAlphaColor = getAlphaColor;
|
|
|
const getSolidColor = (baseColor, brightness) => {
|
|
|
const instance = new _tinycolor.TinyColor(baseColor);
|
|
|
return instance.lighten(brightness).toHexString();
|
|
|
};
|
|
|
exports.getSolidColor = getSolidColor;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/dark/colors.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/dark/colors.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.generateNeutralColorPalettes = exports.generateColorPalettes = void 0;
|
|
|
var _colors = __webpack_require__(/*! @ant-design/colors */ "./node_modules/@ant-design/colors/es/index.js");
|
|
|
var _colorAlgorithm = __webpack_require__(/*! ./colorAlgorithm */ "./node_modules/antd/lib/theme/themes/dark/colorAlgorithm.js");
|
|
|
const generateColorPalettes = baseColor => {
|
|
|
const colors = (0, _colors.generate)(baseColor, {
|
|
|
theme: 'dark'
|
|
|
});
|
|
|
return {
|
|
|
1: colors[0],
|
|
|
2: colors[1],
|
|
|
3: colors[2],
|
|
|
4: colors[3],
|
|
|
5: colors[6],
|
|
|
6: colors[5],
|
|
|
7: colors[4],
|
|
|
8: colors[6],
|
|
|
9: colors[5],
|
|
|
10: colors[4]
|
|
|
// 8: colors[9],
|
|
|
// 9: colors[8],
|
|
|
// 10: colors[7],
|
|
|
};
|
|
|
};
|
|
|
exports.generateColorPalettes = generateColorPalettes;
|
|
|
const generateNeutralColorPalettes = (bgBaseColor, textBaseColor) => {
|
|
|
const colorBgBase = bgBaseColor || '#000';
|
|
|
const colorTextBase = textBaseColor || '#fff';
|
|
|
return {
|
|
|
colorBgBase,
|
|
|
colorTextBase,
|
|
|
colorText: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.85),
|
|
|
colorTextSecondary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.65),
|
|
|
colorTextTertiary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.45),
|
|
|
colorTextQuaternary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.25),
|
|
|
colorFill: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.18),
|
|
|
colorFillSecondary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.12),
|
|
|
colorFillTertiary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.08),
|
|
|
colorFillQuaternary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.04),
|
|
|
colorBgElevated: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 12),
|
|
|
colorBgContainer: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 8),
|
|
|
colorBgLayout: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 0),
|
|
|
colorBgSpotlight: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 26),
|
|
|
colorBorder: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 26),
|
|
|
colorBorderSecondary: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 19)
|
|
|
};
|
|
|
};
|
|
|
exports.generateNeutralColorPalettes = generateNeutralColorPalettes;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/dark/index.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/dark/index.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _colors = __webpack_require__(/*! @ant-design/colors */ "./node_modules/@ant-design/colors/es/index.js");
|
|
|
var _seed = __webpack_require__(/*! ../seed */ "./node_modules/antd/lib/theme/themes/seed.js");
|
|
|
var _genColorMapToken = _interopRequireDefault(__webpack_require__(/*! ../shared/genColorMapToken */ "./node_modules/antd/lib/theme/themes/shared/genColorMapToken.js"));
|
|
|
var _colors2 = __webpack_require__(/*! ./colors */ "./node_modules/antd/lib/theme/themes/dark/colors.js");
|
|
|
var _default2 = _interopRequireDefault(__webpack_require__(/*! ../default */ "./node_modules/antd/lib/theme/themes/default/index.js"));
|
|
|
const derivative = (token, mapToken) => {
|
|
|
const colorPalettes = Object.keys(_seed.defaultPresetColors).map(colorKey => {
|
|
|
const colors = (0, _colors.generate)(token[colorKey], {
|
|
|
theme: 'dark'
|
|
|
});
|
|
|
return new Array(10).fill(1).reduce((prev, _, i) => {
|
|
|
prev[`${colorKey}-${i + 1}`] = colors[i];
|
|
|
prev[`${colorKey}${i + 1}`] = colors[i];
|
|
|
return prev;
|
|
|
}, {});
|
|
|
}).reduce((prev, cur) => {
|
|
|
prev = Object.assign(Object.assign({}, prev), cur);
|
|
|
return prev;
|
|
|
}, {});
|
|
|
const mergedMapToken = mapToken !== null && mapToken !== void 0 ? mapToken : (0, _default2.default)(token);
|
|
|
return Object.assign(Object.assign(Object.assign({}, mergedMapToken), colorPalettes), (0, _genColorMapToken.default)(token, {
|
|
|
generateColorPalettes: _colors2.generateColorPalettes,
|
|
|
generateNeutralColorPalettes: _colors2.generateNeutralColorPalettes
|
|
|
}));
|
|
|
};
|
|
|
var _default = derivative;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/default/colorAlgorithm.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/default/colorAlgorithm.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.getSolidColor = exports.getAlphaColor = void 0;
|
|
|
var _tinycolor = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js");
|
|
|
const getAlphaColor = (baseColor, alpha) => new _tinycolor.TinyColor(baseColor).setAlpha(alpha).toRgbString();
|
|
|
exports.getAlphaColor = getAlphaColor;
|
|
|
const getSolidColor = (baseColor, brightness) => {
|
|
|
const instance = new _tinycolor.TinyColor(baseColor);
|
|
|
return instance.darken(brightness).toHexString();
|
|
|
};
|
|
|
exports.getSolidColor = getSolidColor;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/default/colors.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/default/colors.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.generateNeutralColorPalettes = exports.generateColorPalettes = void 0;
|
|
|
var _colors = __webpack_require__(/*! @ant-design/colors */ "./node_modules/@ant-design/colors/es/index.js");
|
|
|
var _colorAlgorithm = __webpack_require__(/*! ./colorAlgorithm */ "./node_modules/antd/lib/theme/themes/default/colorAlgorithm.js");
|
|
|
const generateColorPalettes = baseColor => {
|
|
|
const colors = (0, _colors.generate)(baseColor);
|
|
|
return {
|
|
|
1: colors[0],
|
|
|
2: colors[1],
|
|
|
3: colors[2],
|
|
|
4: colors[3],
|
|
|
5: colors[4],
|
|
|
6: colors[5],
|
|
|
7: colors[6],
|
|
|
8: colors[4],
|
|
|
9: colors[5],
|
|
|
10: colors[6]
|
|
|
// 8: colors[7],
|
|
|
// 9: colors[8],
|
|
|
// 10: colors[9],
|
|
|
};
|
|
|
};
|
|
|
exports.generateColorPalettes = generateColorPalettes;
|
|
|
const generateNeutralColorPalettes = (bgBaseColor, textBaseColor) => {
|
|
|
const colorBgBase = bgBaseColor || '#fff';
|
|
|
const colorTextBase = textBaseColor || '#000';
|
|
|
return {
|
|
|
colorBgBase,
|
|
|
colorTextBase,
|
|
|
colorText: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.88),
|
|
|
colorTextSecondary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.65),
|
|
|
colorTextTertiary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.45),
|
|
|
colorTextQuaternary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.25),
|
|
|
colorFill: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.15),
|
|
|
colorFillSecondary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.06),
|
|
|
colorFillTertiary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.04),
|
|
|
colorFillQuaternary: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.02),
|
|
|
colorBgLayout: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 4),
|
|
|
colorBgContainer: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 0),
|
|
|
colorBgElevated: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 0),
|
|
|
colorBgSpotlight: (0, _colorAlgorithm.getAlphaColor)(colorTextBase, 0.85),
|
|
|
colorBorder: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 15),
|
|
|
colorBorderSecondary: (0, _colorAlgorithm.getSolidColor)(colorBgBase, 6)
|
|
|
};
|
|
|
};
|
|
|
exports.generateNeutralColorPalettes = generateNeutralColorPalettes;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/default/index.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/default/index.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = derivative;
|
|
|
var _colors = __webpack_require__(/*! @ant-design/colors */ "./node_modules/@ant-design/colors/es/index.js");
|
|
|
var _genControlHeight = _interopRequireDefault(__webpack_require__(/*! ../shared/genControlHeight */ "./node_modules/antd/lib/theme/themes/shared/genControlHeight.js"));
|
|
|
var _genSizeMapToken = _interopRequireDefault(__webpack_require__(/*! ../shared/genSizeMapToken */ "./node_modules/antd/lib/theme/themes/shared/genSizeMapToken.js"));
|
|
|
var _seed = __webpack_require__(/*! ../seed */ "./node_modules/antd/lib/theme/themes/seed.js");
|
|
|
var _genColorMapToken = _interopRequireDefault(__webpack_require__(/*! ../shared/genColorMapToken */ "./node_modules/antd/lib/theme/themes/shared/genColorMapToken.js"));
|
|
|
var _genCommonMapToken = _interopRequireDefault(__webpack_require__(/*! ../shared/genCommonMapToken */ "./node_modules/antd/lib/theme/themes/shared/genCommonMapToken.js"));
|
|
|
var _colors2 = __webpack_require__(/*! ./colors */ "./node_modules/antd/lib/theme/themes/default/colors.js");
|
|
|
var _genFontMapToken = _interopRequireDefault(__webpack_require__(/*! ../shared/genFontMapToken */ "./node_modules/antd/lib/theme/themes/shared/genFontMapToken.js"));
|
|
|
function derivative(token) {
|
|
|
const colorPalettes = Object.keys(_seed.defaultPresetColors).map(colorKey => {
|
|
|
const colors = (0, _colors.generate)(token[colorKey]);
|
|
|
return new Array(10).fill(1).reduce((prev, _, i) => {
|
|
|
prev[`${colorKey}-${i + 1}`] = colors[i];
|
|
|
prev[`${colorKey}${i + 1}`] = colors[i];
|
|
|
return prev;
|
|
|
}, {});
|
|
|
}).reduce((prev, cur) => {
|
|
|
prev = Object.assign(Object.assign({}, prev), cur);
|
|
|
return prev;
|
|
|
}, {});
|
|
|
return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, token), colorPalettes), (0, _genColorMapToken.default)(token, {
|
|
|
generateColorPalettes: _colors2.generateColorPalettes,
|
|
|
generateNeutralColorPalettes: _colors2.generateNeutralColorPalettes
|
|
|
})), (0, _genFontMapToken.default)(token.fontSize)), (0, _genSizeMapToken.default)(token)), (0, _genControlHeight.default)(token)), (0, _genCommonMapToken.default)(token));
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/seed.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/seed.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.defaultPresetColors = exports["default"] = void 0;
|
|
|
const defaultPresetColors = {
|
|
|
blue: '#1677ff',
|
|
|
purple: '#722ED1',
|
|
|
cyan: '#13C2C2',
|
|
|
green: '#52C41A',
|
|
|
magenta: '#EB2F96',
|
|
|
pink: '#eb2f96',
|
|
|
red: '#F5222D',
|
|
|
orange: '#FA8C16',
|
|
|
yellow: '#FADB14',
|
|
|
volcano: '#FA541C',
|
|
|
geekblue: '#2F54EB',
|
|
|
gold: '#FAAD14',
|
|
|
lime: '#A0D911'
|
|
|
};
|
|
|
exports.defaultPresetColors = defaultPresetColors;
|
|
|
const seedToken = Object.assign(Object.assign({}, defaultPresetColors), {
|
|
|
// Color
|
|
|
colorPrimary: '#1677ff',
|
|
|
colorSuccess: '#52c41a',
|
|
|
colorWarning: '#faad14',
|
|
|
colorError: '#ff4d4f',
|
|
|
colorInfo: '#1677ff',
|
|
|
colorTextBase: '',
|
|
|
colorBgBase: '',
|
|
|
// Font
|
|
|
fontFamily: `-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
|
|
|
'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
|
|
|
'Noto Color Emoji'`,
|
|
|
fontFamilyCode: `'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace`,
|
|
|
fontSize: 14,
|
|
|
// Line
|
|
|
lineWidth: 1,
|
|
|
lineType: 'solid',
|
|
|
// Motion
|
|
|
motionUnit: 0.1,
|
|
|
motionBase: 0,
|
|
|
motionEaseOutCirc: 'cubic-bezier(0.08, 0.82, 0.17, 1)',
|
|
|
motionEaseInOutCirc: 'cubic-bezier(0.78, 0.14, 0.15, 0.86)',
|
|
|
motionEaseOut: 'cubic-bezier(0.215, 0.61, 0.355, 1)',
|
|
|
motionEaseInOut: 'cubic-bezier(0.645, 0.045, 0.355, 1)',
|
|
|
motionEaseOutBack: 'cubic-bezier(0.12, 0.4, 0.29, 1.46)',
|
|
|
motionEaseInBack: 'cubic-bezier(0.71, -0.46, 0.88, 0.6)',
|
|
|
motionEaseInQuint: 'cubic-bezier(0.755, 0.05, 0.855, 0.06)',
|
|
|
motionEaseOutQuint: 'cubic-bezier(0.23, 1, 0.32, 1)',
|
|
|
// Radius
|
|
|
borderRadius: 6,
|
|
|
// Size
|
|
|
sizeUnit: 4,
|
|
|
sizeStep: 4,
|
|
|
sizePopupArrow: 16,
|
|
|
// Control Base
|
|
|
controlHeight: 32,
|
|
|
// zIndex
|
|
|
zIndexBase: 0,
|
|
|
zIndexPopupBase: 1000,
|
|
|
// Image
|
|
|
opacityImage: 1,
|
|
|
// Wireframe
|
|
|
wireframe: false
|
|
|
});
|
|
|
var _default = seedToken;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genColorMapToken.js":
|
|
|
/*!***********************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genColorMapToken.js ***!
|
|
|
\***********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = genColorMapToken;
|
|
|
var _tinycolor = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js");
|
|
|
function genColorMapToken(seed, _ref) {
|
|
|
let {
|
|
|
generateColorPalettes,
|
|
|
generateNeutralColorPalettes
|
|
|
} = _ref;
|
|
|
const {
|
|
|
colorSuccess: colorSuccessBase,
|
|
|
colorWarning: colorWarningBase,
|
|
|
colorError: colorErrorBase,
|
|
|
colorInfo: colorInfoBase,
|
|
|
colorPrimary: colorPrimaryBase,
|
|
|
colorBgBase,
|
|
|
colorTextBase
|
|
|
} = seed;
|
|
|
const primaryColors = generateColorPalettes(colorPrimaryBase);
|
|
|
const successColors = generateColorPalettes(colorSuccessBase);
|
|
|
const warningColors = generateColorPalettes(colorWarningBase);
|
|
|
const errorColors = generateColorPalettes(colorErrorBase);
|
|
|
const infoColors = generateColorPalettes(colorInfoBase);
|
|
|
const neutralColors = generateNeutralColorPalettes(colorBgBase, colorTextBase);
|
|
|
return Object.assign(Object.assign({}, neutralColors), {
|
|
|
colorPrimaryBg: primaryColors[1],
|
|
|
colorPrimaryBgHover: primaryColors[2],
|
|
|
colorPrimaryBorder: primaryColors[3],
|
|
|
colorPrimaryBorderHover: primaryColors[4],
|
|
|
colorPrimaryHover: primaryColors[5],
|
|
|
colorPrimary: primaryColors[6],
|
|
|
colorPrimaryActive: primaryColors[7],
|
|
|
colorPrimaryTextHover: primaryColors[8],
|
|
|
colorPrimaryText: primaryColors[9],
|
|
|
colorPrimaryTextActive: primaryColors[10],
|
|
|
colorSuccessBg: successColors[1],
|
|
|
colorSuccessBgHover: successColors[2],
|
|
|
colorSuccessBorder: successColors[3],
|
|
|
colorSuccessBorderHover: successColors[4],
|
|
|
colorSuccessHover: successColors[4],
|
|
|
colorSuccess: successColors[6],
|
|
|
colorSuccessActive: successColors[7],
|
|
|
colorSuccessTextHover: successColors[8],
|
|
|
colorSuccessText: successColors[9],
|
|
|
colorSuccessTextActive: successColors[10],
|
|
|
colorErrorBg: errorColors[1],
|
|
|
colorErrorBgHover: errorColors[2],
|
|
|
colorErrorBorder: errorColors[3],
|
|
|
colorErrorBorderHover: errorColors[4],
|
|
|
colorErrorHover: errorColors[5],
|
|
|
colorError: errorColors[6],
|
|
|
colorErrorActive: errorColors[7],
|
|
|
colorErrorTextHover: errorColors[8],
|
|
|
colorErrorText: errorColors[9],
|
|
|
colorErrorTextActive: errorColors[10],
|
|
|
colorWarningBg: warningColors[1],
|
|
|
colorWarningBgHover: warningColors[2],
|
|
|
colorWarningBorder: warningColors[3],
|
|
|
colorWarningBorderHover: warningColors[4],
|
|
|
colorWarningHover: warningColors[4],
|
|
|
colorWarning: warningColors[6],
|
|
|
colorWarningActive: warningColors[7],
|
|
|
colorWarningTextHover: warningColors[8],
|
|
|
colorWarningText: warningColors[9],
|
|
|
colorWarningTextActive: warningColors[10],
|
|
|
colorInfoBg: infoColors[1],
|
|
|
colorInfoBgHover: infoColors[2],
|
|
|
colorInfoBorder: infoColors[3],
|
|
|
colorInfoBorderHover: infoColors[4],
|
|
|
colorInfoHover: infoColors[4],
|
|
|
colorInfo: infoColors[6],
|
|
|
colorInfoActive: infoColors[7],
|
|
|
colorInfoTextHover: infoColors[8],
|
|
|
colorInfoText: infoColors[9],
|
|
|
colorInfoTextActive: infoColors[10],
|
|
|
colorBgMask: new _tinycolor.TinyColor('#000').setAlpha(0.45).toRgbString(),
|
|
|
colorWhite: '#fff'
|
|
|
});
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genCommonMapToken.js":
|
|
|
/*!************************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genCommonMapToken.js ***!
|
|
|
\************************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = genCommonMapToken;
|
|
|
var _genRadius = _interopRequireDefault(__webpack_require__(/*! ./genRadius */ "./node_modules/antd/lib/theme/themes/shared/genRadius.js"));
|
|
|
function genCommonMapToken(token) {
|
|
|
const {
|
|
|
motionUnit,
|
|
|
motionBase,
|
|
|
borderRadius,
|
|
|
lineWidth
|
|
|
} = token;
|
|
|
return Object.assign({
|
|
|
// motion
|
|
|
motionDurationFast: `${(motionBase + motionUnit).toFixed(1)}s`,
|
|
|
motionDurationMid: `${(motionBase + motionUnit * 2).toFixed(1)}s`,
|
|
|
motionDurationSlow: `${(motionBase + motionUnit * 3).toFixed(1)}s`,
|
|
|
// line
|
|
|
lineWidthBold: lineWidth + 1
|
|
|
}, (0, _genRadius.default)(borderRadius));
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genControlHeight.js":
|
|
|
/*!***********************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genControlHeight.js ***!
|
|
|
\***********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const genControlHeight = token => {
|
|
|
const {
|
|
|
controlHeight
|
|
|
} = token;
|
|
|
return {
|
|
|
controlHeightSM: controlHeight * 0.75,
|
|
|
controlHeightXS: controlHeight * 0.5,
|
|
|
controlHeightLG: controlHeight * 1.25
|
|
|
};
|
|
|
};
|
|
|
var _default = genControlHeight;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genFontMapToken.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genFontMapToken.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _genFontSizes = _interopRequireDefault(__webpack_require__(/*! ./genFontSizes */ "./node_modules/antd/lib/theme/themes/shared/genFontSizes.js"));
|
|
|
const genFontMapToken = fontSize => {
|
|
|
const fontSizePairs = (0, _genFontSizes.default)(fontSize);
|
|
|
const fontSizes = fontSizePairs.map(pair => pair.size);
|
|
|
const lineHeights = fontSizePairs.map(pair => pair.lineHeight);
|
|
|
return {
|
|
|
fontSizeSM: fontSizes[0],
|
|
|
fontSize: fontSizes[1],
|
|
|
fontSizeLG: fontSizes[2],
|
|
|
fontSizeXL: fontSizes[3],
|
|
|
fontSizeHeading1: fontSizes[6],
|
|
|
fontSizeHeading2: fontSizes[5],
|
|
|
fontSizeHeading3: fontSizes[4],
|
|
|
fontSizeHeading4: fontSizes[3],
|
|
|
fontSizeHeading5: fontSizes[2],
|
|
|
lineHeight: lineHeights[1],
|
|
|
lineHeightLG: lineHeights[2],
|
|
|
lineHeightSM: lineHeights[0],
|
|
|
lineHeightHeading1: lineHeights[6],
|
|
|
lineHeightHeading2: lineHeights[5],
|
|
|
lineHeightHeading3: lineHeights[4],
|
|
|
lineHeightHeading4: lineHeights[3],
|
|
|
lineHeightHeading5: lineHeights[2]
|
|
|
};
|
|
|
};
|
|
|
var _default = genFontMapToken;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genFontSizes.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genFontSizes.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = getFontSizes;
|
|
|
// https://zhuanlan.zhihu.com/p/32746810
|
|
|
function getFontSizes(base) {
|
|
|
const fontSizes = new Array(10).fill(null).map((_, index) => {
|
|
|
const i = index - 1;
|
|
|
const baseSize = base * Math.pow(2.71828, i / 5);
|
|
|
const intSize = index > 1 ? Math.floor(baseSize) : Math.ceil(baseSize);
|
|
|
// Convert to even
|
|
|
return Math.floor(intSize / 2) * 2;
|
|
|
});
|
|
|
fontSizes[1] = base;
|
|
|
return fontSizes.map(size => {
|
|
|
const height = size + 8;
|
|
|
return {
|
|
|
size,
|
|
|
lineHeight: height / size
|
|
|
};
|
|
|
});
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genRadius.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genRadius.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const genRadius = radiusBase => {
|
|
|
let radiusLG = radiusBase;
|
|
|
let radiusSM = radiusBase;
|
|
|
let radiusXS = radiusBase;
|
|
|
let radiusOuter = radiusBase;
|
|
|
// radiusLG
|
|
|
if (radiusBase < 6 && radiusBase >= 5) {
|
|
|
radiusLG = radiusBase + 1;
|
|
|
} else if (radiusBase < 16 && radiusBase >= 6) {
|
|
|
radiusLG = radiusBase + 2;
|
|
|
} else if (radiusBase >= 16) {
|
|
|
radiusLG = 16;
|
|
|
}
|
|
|
// radiusSM
|
|
|
if (radiusBase < 7 && radiusBase >= 5) {
|
|
|
radiusSM = 4;
|
|
|
} else if (radiusBase < 8 && radiusBase >= 7) {
|
|
|
radiusSM = 5;
|
|
|
} else if (radiusBase < 14 && radiusBase >= 8) {
|
|
|
radiusSM = 6;
|
|
|
} else if (radiusBase < 16 && radiusBase >= 14) {
|
|
|
radiusSM = 7;
|
|
|
} else if (radiusBase >= 16) {
|
|
|
radiusSM = 8;
|
|
|
}
|
|
|
// radiusXS
|
|
|
if (radiusBase < 6 && radiusBase >= 2) {
|
|
|
radiusXS = 1;
|
|
|
} else if (radiusBase >= 6) {
|
|
|
radiusXS = 2;
|
|
|
}
|
|
|
// radiusOuter
|
|
|
if (radiusBase > 4 && radiusBase < 8) {
|
|
|
radiusOuter = 4;
|
|
|
} else if (radiusBase >= 8) {
|
|
|
radiusOuter = 6;
|
|
|
}
|
|
|
return {
|
|
|
borderRadius: radiusBase > 16 ? 16 : radiusBase,
|
|
|
borderRadiusXS: radiusXS,
|
|
|
borderRadiusSM: radiusSM,
|
|
|
borderRadiusLG: radiusLG,
|
|
|
borderRadiusOuter: radiusOuter
|
|
|
};
|
|
|
};
|
|
|
var _default = genRadius;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/themes/shared/genSizeMapToken.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/themes/shared/genSizeMapToken.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = genSizeMapToken;
|
|
|
function genSizeMapToken(token) {
|
|
|
const {
|
|
|
sizeUnit,
|
|
|
sizeStep
|
|
|
} = token;
|
|
|
return {
|
|
|
sizeXXL: sizeUnit * (sizeStep + 8),
|
|
|
sizeXL: sizeUnit * (sizeStep + 4),
|
|
|
sizeLG: sizeUnit * (sizeStep + 2),
|
|
|
sizeMD: sizeUnit * (sizeStep + 1),
|
|
|
sizeMS: sizeUnit * sizeStep,
|
|
|
size: sizeUnit * sizeStep,
|
|
|
sizeSM: sizeUnit * (sizeStep - 1),
|
|
|
sizeXS: sizeUnit * (sizeStep - 2),
|
|
|
sizeXXS: sizeUnit * (sizeStep - 3) // 4
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/util/alias.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/util/alias.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = formatToken;
|
|
|
var _tinycolor = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js");
|
|
|
var _getAlphaColor = _interopRequireDefault(__webpack_require__(/*! ./getAlphaColor */ "./node_modules/antd/lib/theme/util/getAlphaColor.js"));
|
|
|
var _seed = _interopRequireDefault(__webpack_require__(/*! ../themes/seed */ "./node_modules/antd/lib/theme/themes/seed.js"));
|
|
|
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
|
var t = {};
|
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
|
}
|
|
|
return t;
|
|
|
};
|
|
|
/**
|
|
|
* Seed (designer) > Derivative (designer) > Alias (developer).
|
|
|
*
|
|
|
* Merge seed & derivative & override token and generate alias token for developer.
|
|
|
*/
|
|
|
function formatToken(derivativeToken) {
|
|
|
const {
|
|
|
override
|
|
|
} = derivativeToken,
|
|
|
restToken = __rest(derivativeToken, ["override"]);
|
|
|
const overrideTokens = Object.assign({}, override);
|
|
|
Object.keys(_seed.default).forEach(token => {
|
|
|
delete overrideTokens[token];
|
|
|
});
|
|
|
const mergedToken = Object.assign(Object.assign({}, restToken), overrideTokens);
|
|
|
const screenXS = 480;
|
|
|
const screenSM = 576;
|
|
|
const screenMD = 768;
|
|
|
const screenLG = 992;
|
|
|
const screenXL = 1200;
|
|
|
const screenXXL = 1600;
|
|
|
// Generate alias token
|
|
|
const aliasToken = Object.assign(Object.assign(Object.assign({}, mergedToken), {
|
|
|
colorLink: mergedToken.colorInfoText,
|
|
|
colorLinkHover: mergedToken.colorInfoHover,
|
|
|
colorLinkActive: mergedToken.colorInfoActive,
|
|
|
// ============== Background ============== //
|
|
|
colorFillContent: mergedToken.colorFillSecondary,
|
|
|
colorFillContentHover: mergedToken.colorFill,
|
|
|
colorFillAlter: mergedToken.colorFillQuaternary,
|
|
|
colorBgContainerDisabled: mergedToken.colorFillTertiary,
|
|
|
// ============== Split ============== //
|
|
|
colorBorderBg: mergedToken.colorBgContainer,
|
|
|
colorSplit: (0, _getAlphaColor.default)(mergedToken.colorBorderSecondary, mergedToken.colorBgContainer),
|
|
|
// ============== Text ============== //
|
|
|
colorTextPlaceholder: mergedToken.colorTextQuaternary,
|
|
|
colorTextDisabled: mergedToken.colorTextQuaternary,
|
|
|
colorTextHeading: mergedToken.colorText,
|
|
|
colorTextLabel: mergedToken.colorTextSecondary,
|
|
|
colorTextDescription: mergedToken.colorTextTertiary,
|
|
|
colorTextLightSolid: mergedToken.colorWhite,
|
|
|
colorHighlight: mergedToken.colorError,
|
|
|
colorBgTextHover: mergedToken.colorFillSecondary,
|
|
|
colorBgTextActive: mergedToken.colorFill,
|
|
|
colorIcon: mergedToken.colorTextTertiary,
|
|
|
colorIconHover: mergedToken.colorText,
|
|
|
colorErrorOutline: (0, _getAlphaColor.default)(mergedToken.colorErrorBg, mergedToken.colorBgContainer),
|
|
|
colorWarningOutline: (0, _getAlphaColor.default)(mergedToken.colorWarningBg, mergedToken.colorBgContainer),
|
|
|
// Font
|
|
|
fontSizeIcon: mergedToken.fontSizeSM,
|
|
|
// Line
|
|
|
lineWidthFocus: mergedToken.lineWidth * 4,
|
|
|
// Control
|
|
|
lineWidth: mergedToken.lineWidth,
|
|
|
controlOutlineWidth: mergedToken.lineWidth * 2,
|
|
|
// Checkbox size and expand icon size
|
|
|
controlInteractiveSize: mergedToken.controlHeight / 2,
|
|
|
controlItemBgHover: mergedToken.colorFillTertiary,
|
|
|
controlItemBgActive: mergedToken.colorPrimaryBg,
|
|
|
controlItemBgActiveHover: mergedToken.colorPrimaryBgHover,
|
|
|
controlItemBgActiveDisabled: mergedToken.colorFill,
|
|
|
controlTmpOutline: mergedToken.colorFillQuaternary,
|
|
|
controlOutline: (0, _getAlphaColor.default)(mergedToken.colorPrimaryBg, mergedToken.colorBgContainer),
|
|
|
lineType: mergedToken.lineType,
|
|
|
borderRadius: mergedToken.borderRadius,
|
|
|
borderRadiusXS: mergedToken.borderRadiusXS,
|
|
|
borderRadiusSM: mergedToken.borderRadiusSM,
|
|
|
borderRadiusLG: mergedToken.borderRadiusLG,
|
|
|
fontWeightStrong: 600,
|
|
|
opacityLoading: 0.65,
|
|
|
linkDecoration: 'none',
|
|
|
linkHoverDecoration: 'none',
|
|
|
linkFocusDecoration: 'none',
|
|
|
controlPaddingHorizontal: 12,
|
|
|
controlPaddingHorizontalSM: 8,
|
|
|
paddingXXS: mergedToken.sizeXXS,
|
|
|
paddingXS: mergedToken.sizeXS,
|
|
|
paddingSM: mergedToken.sizeSM,
|
|
|
padding: mergedToken.size,
|
|
|
paddingMD: mergedToken.sizeMD,
|
|
|
paddingLG: mergedToken.sizeLG,
|
|
|
paddingXL: mergedToken.sizeXL,
|
|
|
paddingContentHorizontalLG: mergedToken.sizeLG,
|
|
|
paddingContentVerticalLG: mergedToken.sizeMS,
|
|
|
paddingContentHorizontal: mergedToken.sizeMS,
|
|
|
paddingContentVertical: mergedToken.sizeSM,
|
|
|
paddingContentHorizontalSM: mergedToken.size,
|
|
|
paddingContentVerticalSM: mergedToken.sizeXS,
|
|
|
marginXXS: mergedToken.sizeXXS,
|
|
|
marginXS: mergedToken.sizeXS,
|
|
|
marginSM: mergedToken.sizeSM,
|
|
|
margin: mergedToken.size,
|
|
|
marginMD: mergedToken.sizeMD,
|
|
|
marginLG: mergedToken.sizeLG,
|
|
|
marginXL: mergedToken.sizeXL,
|
|
|
marginXXL: mergedToken.sizeXXL,
|
|
|
boxShadow: `
|
|
|
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
|
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
|
0 9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
|
`,
|
|
|
boxShadowSecondary: `
|
|
|
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
|
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
|
0 9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
|
`,
|
|
|
boxShadowTertiary: `
|
|
|
0 1px 2px 0 rgba(0, 0, 0, 0.03),
|
|
|
0 1px 6px -1px rgba(0, 0, 0, 0.02),
|
|
|
0 2px 4px 0 rgba(0, 0, 0, 0.02)
|
|
|
`,
|
|
|
screenXS,
|
|
|
screenXSMin: screenXS,
|
|
|
screenXSMax: screenSM - 1,
|
|
|
screenSM,
|
|
|
screenSMMin: screenSM,
|
|
|
screenSMMax: screenMD - 1,
|
|
|
screenMD,
|
|
|
screenMDMin: screenMD,
|
|
|
screenMDMax: screenLG - 1,
|
|
|
screenLG,
|
|
|
screenLGMin: screenLG,
|
|
|
screenLGMax: screenXL - 1,
|
|
|
screenXL,
|
|
|
screenXLMin: screenXL,
|
|
|
screenXLMax: screenXXL - 1,
|
|
|
screenXXL,
|
|
|
screenXXLMin: screenXXL,
|
|
|
boxShadowPopoverArrow: '2px 2px 5px rgba(0, 0, 0, 0.05)',
|
|
|
boxShadowCard: `
|
|
|
0 1px 2px -2px ${new _tinycolor.TinyColor('rgba(0, 0, 0, 0.16)').toRgbString()},
|
|
|
0 3px 6px 0 ${new _tinycolor.TinyColor('rgba(0, 0, 0, 0.12)').toRgbString()},
|
|
|
0 5px 12px 4px ${new _tinycolor.TinyColor('rgba(0, 0, 0, 0.09)').toRgbString()}
|
|
|
`,
|
|
|
boxShadowDrawerRight: `
|
|
|
-6px 0 16px 0 rgba(0, 0, 0, 0.08),
|
|
|
-3px 0 6px -4px rgba(0, 0, 0, 0.12),
|
|
|
-9px 0 28px 8px rgba(0, 0, 0, 0.05)
|
|
|
`,
|
|
|
boxShadowDrawerLeft: `
|
|
|
6px 0 16px 0 rgba(0, 0, 0, 0.08),
|
|
|
3px 0 6px -4px rgba(0, 0, 0, 0.12),
|
|
|
9px 0 28px 8px rgba(0, 0, 0, 0.05)
|
|
|
`,
|
|
|
boxShadowDrawerUp: `
|
|
|
0 6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
|
0 3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
|
0 9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
|
`,
|
|
|
boxShadowDrawerDown: `
|
|
|
0 -6px 16px 0 rgba(0, 0, 0, 0.08),
|
|
|
0 -3px 6px -4px rgba(0, 0, 0, 0.12),
|
|
|
0 -9px 28px 8px rgba(0, 0, 0, 0.05)
|
|
|
`,
|
|
|
boxShadowTabsOverflowLeft: 'inset 10px 0 8px -8px rgba(0, 0, 0, 0.08)',
|
|
|
boxShadowTabsOverflowRight: 'inset -10px 0 8px -8px rgba(0, 0, 0, 0.08)',
|
|
|
boxShadowTabsOverflowTop: 'inset 0 10px 8px -8px rgba(0, 0, 0, 0.08)',
|
|
|
boxShadowTabsOverflowBottom: 'inset 0 -10px 8px -8px rgba(0, 0, 0, 0.08)'
|
|
|
}), overrideTokens);
|
|
|
return aliasToken;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/util/genComponentStyleHook.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/util/genComponentStyleHook.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = genComponentStyleHook;
|
|
|
var _cssinjs = __webpack_require__(/*! @ant-design/cssinjs */ "./node_modules/@ant-design/cssinjs/es/index.js");
|
|
|
var _react = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
var _style = __webpack_require__(/*! ../../style */ "./node_modules/antd/lib/style/index.js");
|
|
|
var _context = __webpack_require__(/*! ../../config-provider/context */ "./node_modules/antd/lib/config-provider/context.js");
|
|
|
var _internal = __webpack_require__(/*! ../internal */ "./node_modules/antd/lib/theme/internal.js");
|
|
|
function genComponentStyleHook(component, styleFn, getDefaultToken) {
|
|
|
return prefixCls => {
|
|
|
const [theme, token, hashId] = (0, _internal.useToken)();
|
|
|
const {
|
|
|
getPrefixCls,
|
|
|
iconPrefixCls
|
|
|
} = (0, _react.useContext)(_context.ConfigContext);
|
|
|
const rootPrefixCls = getPrefixCls();
|
|
|
// Generate style for all a tags in antd component.
|
|
|
(0, _cssinjs.useStyleRegister)({
|
|
|
theme,
|
|
|
token,
|
|
|
hashId,
|
|
|
path: ['Shared', rootPrefixCls]
|
|
|
}, () => [{
|
|
|
// Link
|
|
|
'&': (0, _style.genLinkStyle)(token)
|
|
|
}]);
|
|
|
return [(0, _cssinjs.useStyleRegister)({
|
|
|
theme,
|
|
|
token,
|
|
|
hashId,
|
|
|
path: [component, prefixCls, iconPrefixCls]
|
|
|
}, () => {
|
|
|
const {
|
|
|
token: proxyToken,
|
|
|
flush
|
|
|
} = (0, _internal.statisticToken)(token);
|
|
|
const defaultComponentToken = typeof getDefaultToken === 'function' ? getDefaultToken(proxyToken) : getDefaultToken;
|
|
|
const mergedComponentToken = Object.assign(Object.assign({}, defaultComponentToken), token[component]);
|
|
|
const componentCls = `.${prefixCls}`;
|
|
|
const mergedToken = (0, _internal.mergeToken)(proxyToken, {
|
|
|
componentCls,
|
|
|
prefixCls,
|
|
|
iconCls: `.${iconPrefixCls}`,
|
|
|
antCls: `.${rootPrefixCls}`
|
|
|
}, mergedComponentToken);
|
|
|
const styleInterpolation = styleFn(mergedToken, {
|
|
|
hashId,
|
|
|
prefixCls,
|
|
|
rootPrefixCls,
|
|
|
iconPrefixCls,
|
|
|
overrideComponentToken: token[component]
|
|
|
});
|
|
|
flush(component, mergedComponentToken);
|
|
|
return [(0, _style.genCommonStyle)(token, prefixCls), styleInterpolation];
|
|
|
}), hashId];
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/util/getAlphaColor.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/util/getAlphaColor.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _tinycolor = __webpack_require__(/*! @ctrl/tinycolor */ "./node_modules/@ctrl/tinycolor/dist/module/public_api.js");
|
|
|
function isStableColor(color) {
|
|
|
return color >= 0 && color <= 255;
|
|
|
}
|
|
|
function getAlphaColor(frontColor, backgroundColor) {
|
|
|
const {
|
|
|
r: fR,
|
|
|
g: fG,
|
|
|
b: fB,
|
|
|
a: originAlpha
|
|
|
} = new _tinycolor.TinyColor(frontColor).toRgb();
|
|
|
if (originAlpha < 1) {
|
|
|
return frontColor;
|
|
|
}
|
|
|
const {
|
|
|
r: bR,
|
|
|
g: bG,
|
|
|
b: bB
|
|
|
} = new _tinycolor.TinyColor(backgroundColor).toRgb();
|
|
|
for (let fA = 0.01; fA <= 1; fA += 0.01) {
|
|
|
const r = Math.round((fR - bR * (1 - fA)) / fA);
|
|
|
const g = Math.round((fG - bG * (1 - fA)) / fA);
|
|
|
const b = Math.round((fB - bB * (1 - fA)) / fA);
|
|
|
if (isStableColor(r) && isStableColor(g) && isStableColor(b)) {
|
|
|
return new _tinycolor.TinyColor({
|
|
|
r,
|
|
|
g,
|
|
|
b,
|
|
|
a: Math.round(fA * 100) / 100
|
|
|
}).toRgbString();
|
|
|
}
|
|
|
}
|
|
|
// fallback
|
|
|
/* istanbul ignore next */
|
|
|
return new _tinycolor.TinyColor({
|
|
|
r: fR,
|
|
|
g: fG,
|
|
|
b: fB,
|
|
|
a: 1
|
|
|
}).toRgbString();
|
|
|
}
|
|
|
var _default = getAlphaColor;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/theme/util/statistic.js":
|
|
|
/*!*******************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/theme/util/statistic.js ***!
|
|
|
\*******************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports._statistic_build_ = void 0;
|
|
|
exports["default"] = statisticToken;
|
|
|
exports.merge = merge;
|
|
|
exports.statistic = void 0;
|
|
|
const enableStatistic = true || 0;
|
|
|
let recording = true;
|
|
|
/**
|
|
|
* This function will do as `Object.assign` in production. But will use Object.defineProperty:get to
|
|
|
* pass all value access in development. To support statistic field usage with alias token.
|
|
|
*/
|
|
|
function merge() {
|
|
|
for (var _len = arguments.length, objs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
objs[_key] = arguments[_key];
|
|
|
}
|
|
|
/* istanbul ignore next */
|
|
|
if (!enableStatistic) {
|
|
|
return Object.assign.apply(Object, [{}].concat(objs));
|
|
|
}
|
|
|
recording = false;
|
|
|
const ret = {};
|
|
|
objs.forEach(obj => {
|
|
|
const keys = Object.keys(obj);
|
|
|
keys.forEach(key => {
|
|
|
Object.defineProperty(ret, key, {
|
|
|
configurable: true,
|
|
|
enumerable: true,
|
|
|
get: () => obj[key]
|
|
|
});
|
|
|
});
|
|
|
});
|
|
|
recording = true;
|
|
|
return ret;
|
|
|
}
|
|
|
/** @private Internal Usage. Not use in your production. */
|
|
|
const statistic = {};
|
|
|
/** @private Internal Usage. Not use in your production. */
|
|
|
// eslint-disable-next-line camelcase
|
|
|
exports.statistic = statistic;
|
|
|
const _statistic_build_ = {};
|
|
|
/* istanbul ignore next */
|
|
|
exports._statistic_build_ = _statistic_build_;
|
|
|
function noop() {}
|
|
|
/** Statistic token usage case. Should use `merge` function if you do not want spread record. */
|
|
|
function statisticToken(token) {
|
|
|
let tokenKeys;
|
|
|
let proxy = token;
|
|
|
let flush = noop;
|
|
|
if (enableStatistic) {
|
|
|
tokenKeys = new Set();
|
|
|
proxy = new Proxy(token, {
|
|
|
get(obj, prop) {
|
|
|
if (recording) {
|
|
|
tokenKeys.add(prop);
|
|
|
}
|
|
|
return obj[prop];
|
|
|
}
|
|
|
});
|
|
|
flush = (componentName, componentToken) => {
|
|
|
statistic[componentName] = {
|
|
|
global: Array.from(tokenKeys),
|
|
|
component: componentToken
|
|
|
};
|
|
|
};
|
|
|
}
|
|
|
return {
|
|
|
token: proxy,
|
|
|
keys: tokenKeys,
|
|
|
flush
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/time-picker/locale/en_GB.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/time-picker/locale/en_GB.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const locale = {
|
|
|
placeholder: 'Select time'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/time-picker/locale/en_US.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/time-picker/locale/en_US.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const locale = {
|
|
|
placeholder: 'Select time',
|
|
|
rangePlaceholder: ['Start time', 'End time']
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/time-picker/locale/es_ES.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/time-picker/locale/es_ES.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const locale = {
|
|
|
placeholder: 'Seleccionar hora'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/time-picker/locale/pt_BR.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/time-picker/locale/pt_BR.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const locale = {
|
|
|
placeholder: 'Hora'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/time-picker/locale/pt_PT.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/time-picker/locale/pt_PT.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
const locale = {
|
|
|
placeholder: 'Hora'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/version/index.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/version/index.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _version = _interopRequireDefault(__webpack_require__(/*! ./version */ "./node_modules/antd/lib/version/version.js"));
|
|
|
/* eslint import/no-unresolved: 0 */
|
|
|
// @ts-ignore
|
|
|
var _default = _version.default;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/antd/lib/version/version.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/antd/lib/version/version.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = '5.3.2';
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/async-validator/dist-web/index.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/async-validator/dist-web/index.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ Schema)
|
|
|
/* harmony export */ });
|
|
|
function _extends() {
|
|
|
_extends = Object.assign ? Object.assign.bind() : 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);
|
|
|
}
|
|
|
|
|
|
function _inheritsLoose(subClass, superClass) {
|
|
|
subClass.prototype = Object.create(superClass.prototype);
|
|
|
subClass.prototype.constructor = subClass;
|
|
|
|
|
|
_setPrototypeOf(subClass, superClass);
|
|
|
}
|
|
|
|
|
|
function _getPrototypeOf(o) {
|
|
|
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {
|
|
|
return o.__proto__ || Object.getPrototypeOf(o);
|
|
|
};
|
|
|
return _getPrototypeOf(o);
|
|
|
}
|
|
|
|
|
|
function _setPrototypeOf(o, p) {
|
|
|
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
|
|
|
o.__proto__ = p;
|
|
|
return o;
|
|
|
};
|
|
|
return _setPrototypeOf(o, p);
|
|
|
}
|
|
|
|
|
|
function _isNativeReflectConstruct() {
|
|
|
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
|
if (Reflect.construct.sham) return false;
|
|
|
if (typeof Proxy === "function") return true;
|
|
|
|
|
|
try {
|
|
|
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
|
|
return true;
|
|
|
} catch (e) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function _construct(Parent, args, Class) {
|
|
|
if (_isNativeReflectConstruct()) {
|
|
|
_construct = Reflect.construct.bind();
|
|
|
} else {
|
|
|
_construct = function _construct(Parent, args, Class) {
|
|
|
var a = [null];
|
|
|
a.push.apply(a, args);
|
|
|
var Constructor = Function.bind.apply(Parent, a);
|
|
|
var instance = new Constructor();
|
|
|
if (Class) _setPrototypeOf(instance, Class.prototype);
|
|
|
return instance;
|
|
|
};
|
|
|
}
|
|
|
|
|
|
return _construct.apply(null, arguments);
|
|
|
}
|
|
|
|
|
|
function _isNativeFunction(fn) {
|
|
|
return Function.toString.call(fn).indexOf("[native code]") !== -1;
|
|
|
}
|
|
|
|
|
|
function _wrapNativeSuper(Class) {
|
|
|
var _cache = typeof Map === "function" ? new Map() : undefined;
|
|
|
|
|
|
_wrapNativeSuper = function _wrapNativeSuper(Class) {
|
|
|
if (Class === null || !_isNativeFunction(Class)) return Class;
|
|
|
|
|
|
if (typeof Class !== "function") {
|
|
|
throw new TypeError("Super expression must either be null or a function");
|
|
|
}
|
|
|
|
|
|
if (typeof _cache !== "undefined") {
|
|
|
if (_cache.has(Class)) return _cache.get(Class);
|
|
|
|
|
|
_cache.set(Class, Wrapper);
|
|
|
}
|
|
|
|
|
|
function Wrapper() {
|
|
|
return _construct(Class, arguments, _getPrototypeOf(this).constructor);
|
|
|
}
|
|
|
|
|
|
Wrapper.prototype = Object.create(Class.prototype, {
|
|
|
constructor: {
|
|
|
value: Wrapper,
|
|
|
enumerable: false,
|
|
|
writable: true,
|
|
|
configurable: true
|
|
|
}
|
|
|
});
|
|
|
return _setPrototypeOf(Wrapper, Class);
|
|
|
};
|
|
|
|
|
|
return _wrapNativeSuper(Class);
|
|
|
}
|
|
|
|
|
|
/* eslint no-console:0 */
|
|
|
var formatRegExp = /%[sdj%]/g;
|
|
|
var warning = function warning() {}; // don't print warning message when in production env or node runtime
|
|
|
|
|
|
if (typeof process !== 'undefined' && process.env && "development" !== 'production' && typeof window !== 'undefined' && typeof document !== 'undefined') {
|
|
|
warning = function warning(type, errors) {
|
|
|
if (typeof console !== 'undefined' && console.warn && typeof ASYNC_VALIDATOR_NO_WARNING === 'undefined') {
|
|
|
if (errors.every(function (e) {
|
|
|
return typeof e === 'string';
|
|
|
})) {
|
|
|
console.warn(type, errors);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function convertFieldsError(errors) {
|
|
|
if (!errors || !errors.length) return null;
|
|
|
var fields = {};
|
|
|
errors.forEach(function (error) {
|
|
|
var field = error.field;
|
|
|
fields[field] = fields[field] || [];
|
|
|
fields[field].push(error);
|
|
|
});
|
|
|
return fields;
|
|
|
}
|
|
|
function format(template) {
|
|
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
|
args[_key - 1] = arguments[_key];
|
|
|
}
|
|
|
|
|
|
var i = 0;
|
|
|
var len = args.length;
|
|
|
|
|
|
if (typeof template === 'function') {
|
|
|
return template.apply(null, args);
|
|
|
}
|
|
|
|
|
|
if (typeof template === 'string') {
|
|
|
var str = template.replace(formatRegExp, function (x) {
|
|
|
if (x === '%%') {
|
|
|
return '%';
|
|
|
}
|
|
|
|
|
|
if (i >= len) {
|
|
|
return x;
|
|
|
}
|
|
|
|
|
|
switch (x) {
|
|
|
case '%s':
|
|
|
return String(args[i++]);
|
|
|
|
|
|
case '%d':
|
|
|
return Number(args[i++]);
|
|
|
|
|
|
case '%j':
|
|
|
try {
|
|
|
return JSON.stringify(args[i++]);
|
|
|
} catch (_) {
|
|
|
return '[Circular]';
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
return x;
|
|
|
}
|
|
|
});
|
|
|
return str;
|
|
|
}
|
|
|
|
|
|
return template;
|
|
|
}
|
|
|
|
|
|
function isNativeStringType(type) {
|
|
|
return type === 'string' || type === 'url' || type === 'hex' || type === 'email' || type === 'date' || type === 'pattern';
|
|
|
}
|
|
|
|
|
|
function isEmptyValue(value, type) {
|
|
|
if (value === undefined || value === null) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (type === 'array' && Array.isArray(value) && !value.length) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (isNativeStringType(type) && typeof value === 'string' && !value) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
function asyncParallelArray(arr, func, callback) {
|
|
|
var results = [];
|
|
|
var total = 0;
|
|
|
var arrLength = arr.length;
|
|
|
|
|
|
function count(errors) {
|
|
|
results.push.apply(results, errors || []);
|
|
|
total++;
|
|
|
|
|
|
if (total === arrLength) {
|
|
|
callback(results);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
arr.forEach(function (a) {
|
|
|
func(a, count);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function asyncSerialArray(arr, func, callback) {
|
|
|
var index = 0;
|
|
|
var arrLength = arr.length;
|
|
|
|
|
|
function next(errors) {
|
|
|
if (errors && errors.length) {
|
|
|
callback(errors);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var original = index;
|
|
|
index = index + 1;
|
|
|
|
|
|
if (original < arrLength) {
|
|
|
func(arr[original], next);
|
|
|
} else {
|
|
|
callback([]);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
next([]);
|
|
|
}
|
|
|
|
|
|
function flattenObjArr(objArr) {
|
|
|
var ret = [];
|
|
|
Object.keys(objArr).forEach(function (k) {
|
|
|
ret.push.apply(ret, objArr[k] || []);
|
|
|
});
|
|
|
return ret;
|
|
|
}
|
|
|
|
|
|
var AsyncValidationError = /*#__PURE__*/function (_Error) {
|
|
|
_inheritsLoose(AsyncValidationError, _Error);
|
|
|
|
|
|
function AsyncValidationError(errors, fields) {
|
|
|
var _this;
|
|
|
|
|
|
_this = _Error.call(this, 'Async Validation Error') || this;
|
|
|
_this.errors = errors;
|
|
|
_this.fields = fields;
|
|
|
return _this;
|
|
|
}
|
|
|
|
|
|
return AsyncValidationError;
|
|
|
}( /*#__PURE__*/_wrapNativeSuper(Error));
|
|
|
function asyncMap(objArr, option, func, callback, source) {
|
|
|
if (option.first) {
|
|
|
var _pending = new Promise(function (resolve, reject) {
|
|
|
var next = function next(errors) {
|
|
|
callback(errors);
|
|
|
return errors.length ? reject(new AsyncValidationError(errors, convertFieldsError(errors))) : resolve(source);
|
|
|
};
|
|
|
|
|
|
var flattenArr = flattenObjArr(objArr);
|
|
|
asyncSerialArray(flattenArr, func, next);
|
|
|
});
|
|
|
|
|
|
_pending["catch"](function (e) {
|
|
|
return e;
|
|
|
});
|
|
|
|
|
|
return _pending;
|
|
|
}
|
|
|
|
|
|
var firstFields = option.firstFields === true ? Object.keys(objArr) : option.firstFields || [];
|
|
|
var objArrKeys = Object.keys(objArr);
|
|
|
var objArrLength = objArrKeys.length;
|
|
|
var total = 0;
|
|
|
var results = [];
|
|
|
var pending = new Promise(function (resolve, reject) {
|
|
|
var next = function next(errors) {
|
|
|
results.push.apply(results, errors);
|
|
|
total++;
|
|
|
|
|
|
if (total === objArrLength) {
|
|
|
callback(results);
|
|
|
return results.length ? reject(new AsyncValidationError(results, convertFieldsError(results))) : resolve(source);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
if (!objArrKeys.length) {
|
|
|
callback(results);
|
|
|
resolve(source);
|
|
|
}
|
|
|
|
|
|
objArrKeys.forEach(function (key) {
|
|
|
var arr = objArr[key];
|
|
|
|
|
|
if (firstFields.indexOf(key) !== -1) {
|
|
|
asyncSerialArray(arr, func, next);
|
|
|
} else {
|
|
|
asyncParallelArray(arr, func, next);
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
pending["catch"](function (e) {
|
|
|
return e;
|
|
|
});
|
|
|
return pending;
|
|
|
}
|
|
|
|
|
|
function isErrorObj(obj) {
|
|
|
return !!(obj && obj.message !== undefined);
|
|
|
}
|
|
|
|
|
|
function getValue(value, path) {
|
|
|
var v = value;
|
|
|
|
|
|
for (var i = 0; i < path.length; i++) {
|
|
|
if (v == undefined) {
|
|
|
return v;
|
|
|
}
|
|
|
|
|
|
v = v[path[i]];
|
|
|
}
|
|
|
|
|
|
return v;
|
|
|
}
|
|
|
|
|
|
function complementError(rule, source) {
|
|
|
return function (oe) {
|
|
|
var fieldValue;
|
|
|
|
|
|
if (rule.fullFields) {
|
|
|
fieldValue = getValue(source, rule.fullFields);
|
|
|
} else {
|
|
|
fieldValue = source[oe.field || rule.fullField];
|
|
|
}
|
|
|
|
|
|
if (isErrorObj(oe)) {
|
|
|
oe.field = oe.field || rule.fullField;
|
|
|
oe.fieldValue = fieldValue;
|
|
|
return oe;
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
message: typeof oe === 'function' ? oe() : oe,
|
|
|
fieldValue: fieldValue,
|
|
|
field: oe.field || rule.fullField
|
|
|
};
|
|
|
};
|
|
|
}
|
|
|
function deepMerge(target, source) {
|
|
|
if (source) {
|
|
|
for (var s in source) {
|
|
|
if (source.hasOwnProperty(s)) {
|
|
|
var value = source[s];
|
|
|
|
|
|
if (typeof value === 'object' && typeof target[s] === 'object') {
|
|
|
target[s] = _extends({}, target[s], value);
|
|
|
} else {
|
|
|
target[s] = value;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return target;
|
|
|
}
|
|
|
|
|
|
var required$1 = function required(rule, value, source, errors, options, type) {
|
|
|
if (rule.required && (!source.hasOwnProperty(rule.field) || isEmptyValue(value, type || rule.type))) {
|
|
|
errors.push(format(options.messages.required, rule.fullField));
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/**
|
|
|
* Rule for validating whitespace.
|
|
|
*
|
|
|
* @param rule The validation rule.
|
|
|
* @param value The value of the field on the source object.
|
|
|
* @param source The source object being validated.
|
|
|
* @param errors An array of errors that this rule may add
|
|
|
* validation errors to.
|
|
|
* @param options The validation options.
|
|
|
* @param options.messages The validation messages.
|
|
|
*/
|
|
|
|
|
|
var whitespace = function whitespace(rule, value, source, errors, options) {
|
|
|
if (/^\s+$/.test(value) || value === '') {
|
|
|
errors.push(format(options.messages.whitespace, rule.fullField));
|
|
|
}
|
|
|
};
|
|
|
|
|
|
// https://github.com/kevva/url-regex/blob/master/index.js
|
|
|
var urlReg;
|
|
|
var getUrlRegex = (function () {
|
|
|
if (urlReg) {
|
|
|
return urlReg;
|
|
|
}
|
|
|
|
|
|
var word = '[a-fA-F\\d:]';
|
|
|
|
|
|
var b = function b(options) {
|
|
|
return options && options.includeBoundaries ? "(?:(?<=\\s|^)(?=" + word + ")|(?<=" + word + ")(?=\\s|$))" : '';
|
|
|
};
|
|
|
|
|
|
var v4 = '(?:25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]\\d|\\d)(?:\\.(?:25[0-5]|2[0-4]\\d|1\\d\\d|[1-9]\\d|\\d)){3}';
|
|
|
var v6seg = '[a-fA-F\\d]{1,4}';
|
|
|
var v6 = ("\n(?:\n(?:" + v6seg + ":){7}(?:" + v6seg + "|:)| // 1:2:3:4:5:6:7:: 1:2:3:4:5:6:7:8\n(?:" + v6seg + ":){6}(?:" + v4 + "|:" + v6seg + "|:)| // 1:2:3:4:5:6:: 1:2:3:4:5:6::8 1:2:3:4:5:6::8 1:2:3:4:5:6::1.2.3.4\n(?:" + v6seg + ":){5}(?::" + v4 + "|(?::" + v6seg + "){1,2}|:)| // 1:2:3:4:5:: 1:2:3:4:5::7:8 1:2:3:4:5::8 1:2:3:4:5::7:1.2.3.4\n(?:" + v6seg + ":){4}(?:(?::" + v6seg + "){0,1}:" + v4 + "|(?::" + v6seg + "){1,3}|:)| // 1:2:3:4:: 1:2:3:4::6:7:8 1:2:3:4::8 1:2:3:4::6:7:1.2.3.4\n(?:" + v6seg + ":){3}(?:(?::" + v6seg + "){0,2}:" + v4 + "|(?::" + v6seg + "){1,4}|:)| // 1:2:3:: 1:2:3::5:6:7:8 1:2:3::8 1:2:3::5:6:7:1.2.3.4\n(?:" + v6seg + ":){2}(?:(?::" + v6seg + "){0,3}:" + v4 + "|(?::" + v6seg + "){1,5}|:)| // 1:2:: 1:2::4:5:6:7:8 1:2::8 1:2::4:5:6:7:1.2.3.4\n(?:" + v6seg + ":){1}(?:(?::" + v6seg + "){0,4}:" + v4 + "|(?::" + v6seg + "){1,6}|:)| // 1:: 1::3:4:5:6:7:8 1::8 1::3:4:5:6:7:1.2.3.4\n(?::(?:(?::" + v6seg + "){0,5}:" + v4 + "|(?::" + v6seg + "){1,7}|:)) // ::2:3:4:5:6:7:8 ::2:3:4:5:6:7:8 ::8 ::1.2.3.4\n)(?:%[0-9a-zA-Z]{1,})? // %eth0 %1\n").replace(/\s*\/\/.*$/gm, '').replace(/\n/g, '').trim(); // Pre-compile only the exact regexes because adding a global flag make regexes stateful
|
|
|
|
|
|
var v46Exact = new RegExp("(?:^" + v4 + "$)|(?:^" + v6 + "$)");
|
|
|
var v4exact = new RegExp("^" + v4 + "$");
|
|
|
var v6exact = new RegExp("^" + v6 + "$");
|
|
|
|
|
|
var ip = function ip(options) {
|
|
|
return options && options.exact ? v46Exact : new RegExp("(?:" + b(options) + v4 + b(options) + ")|(?:" + b(options) + v6 + b(options) + ")", 'g');
|
|
|
};
|
|
|
|
|
|
ip.v4 = function (options) {
|
|
|
return options && options.exact ? v4exact : new RegExp("" + b(options) + v4 + b(options), 'g');
|
|
|
};
|
|
|
|
|
|
ip.v6 = function (options) {
|
|
|
return options && options.exact ? v6exact : new RegExp("" + b(options) + v6 + b(options), 'g');
|
|
|
};
|
|
|
|
|
|
var protocol = "(?:(?:[a-z]+:)?//)";
|
|
|
var auth = '(?:\\S+(?::\\S*)?@)?';
|
|
|
var ipv4 = ip.v4().source;
|
|
|
var ipv6 = ip.v6().source;
|
|
|
var host = "(?:(?:[a-z\\u00a1-\\uffff0-9][-_]*)*[a-z\\u00a1-\\uffff0-9]+)";
|
|
|
var domain = "(?:\\.(?:[a-z\\u00a1-\\uffff0-9]-*)*[a-z\\u00a1-\\uffff0-9]+)*";
|
|
|
var tld = "(?:\\.(?:[a-z\\u00a1-\\uffff]{2,}))";
|
|
|
var port = '(?::\\d{2,5})?';
|
|
|
var path = '(?:[/?#][^\\s"]*)?';
|
|
|
var regex = "(?:" + protocol + "|www\\.)" + auth + "(?:localhost|" + ipv4 + "|" + ipv6 + "|" + host + domain + tld + ")" + port + path;
|
|
|
urlReg = new RegExp("(?:^" + regex + "$)", 'i');
|
|
|
return urlReg;
|
|
|
});
|
|
|
|
|
|
/* eslint max-len:0 */
|
|
|
|
|
|
var pattern$2 = {
|
|
|
// http://emailregex.com/
|
|
|
email: /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+\.)+[a-zA-Z\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]{2,}))$/,
|
|
|
// url: new RegExp(
|
|
|
// '^(?!mailto:)(?:(?:http|https|ftp)://|//)(?:\\S+(?::\\S*)?@)?(?:(?:(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}(?:\\.(?:[0-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))|(?:(?:[a-z\\u00a1-\\uffff0-9]+-*)*[a-z\\u00a1-\\uffff0-9]+)(?:\\.(?:[a-z\\u00a1-\\uffff0-9]+-*)*[a-z\\u00a1-\\uffff0-9]+)*(?:\\.(?:[a-z\\u00a1-\\uffff]{2,})))|localhost)(?::\\d{2,5})?(?:(/|\\?|#)[^\\s]*)?$',
|
|
|
// 'i',
|
|
|
// ),
|
|
|
hex: /^#?([a-f0-9]{6}|[a-f0-9]{3})$/i
|
|
|
};
|
|
|
var types = {
|
|
|
integer: function integer(value) {
|
|
|
return types.number(value) && parseInt(value, 10) === value;
|
|
|
},
|
|
|
"float": function float(value) {
|
|
|
return types.number(value) && !types.integer(value);
|
|
|
},
|
|
|
array: function array(value) {
|
|
|
return Array.isArray(value);
|
|
|
},
|
|
|
regexp: function regexp(value) {
|
|
|
if (value instanceof RegExp) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
return !!new RegExp(value);
|
|
|
} catch (e) {
|
|
|
return false;
|
|
|
}
|
|
|
},
|
|
|
date: function date(value) {
|
|
|
return typeof value.getTime === 'function' && typeof value.getMonth === 'function' && typeof value.getYear === 'function' && !isNaN(value.getTime());
|
|
|
},
|
|
|
number: function number(value) {
|
|
|
if (isNaN(value)) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
return typeof value === 'number';
|
|
|
},
|
|
|
object: function object(value) {
|
|
|
return typeof value === 'object' && !types.array(value);
|
|
|
},
|
|
|
method: function method(value) {
|
|
|
return typeof value === 'function';
|
|
|
},
|
|
|
email: function email(value) {
|
|
|
return typeof value === 'string' && value.length <= 320 && !!value.match(pattern$2.email);
|
|
|
},
|
|
|
url: function url(value) {
|
|
|
return typeof value === 'string' && value.length <= 2048 && !!value.match(getUrlRegex());
|
|
|
},
|
|
|
hex: function hex(value) {
|
|
|
return typeof value === 'string' && !!value.match(pattern$2.hex);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var type$1 = function type(rule, value, source, errors, options) {
|
|
|
if (rule.required && value === undefined) {
|
|
|
required$1(rule, value, source, errors, options);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var custom = ['integer', 'float', 'array', 'regexp', 'object', 'method', 'email', 'number', 'date', 'url', 'hex'];
|
|
|
var ruleType = rule.type;
|
|
|
|
|
|
if (custom.indexOf(ruleType) > -1) {
|
|
|
if (!types[ruleType](value)) {
|
|
|
errors.push(format(options.messages.types[ruleType], rule.fullField, rule.type));
|
|
|
} // straight typeof check
|
|
|
|
|
|
} else if (ruleType && typeof value !== rule.type) {
|
|
|
errors.push(format(options.messages.types[ruleType], rule.fullField, rule.type));
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var range = function range(rule, value, source, errors, options) {
|
|
|
var len = typeof rule.len === 'number';
|
|
|
var min = typeof rule.min === 'number';
|
|
|
var max = typeof rule.max === 'number'; // 正则匹配码点范围从U+010000一直到U+10FFFF的文字(补充平面Supplementary Plane)
|
|
|
|
|
|
var spRegexp = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
|
|
|
var val = value;
|
|
|
var key = null;
|
|
|
var num = typeof value === 'number';
|
|
|
var str = typeof value === 'string';
|
|
|
var arr = Array.isArray(value);
|
|
|
|
|
|
if (num) {
|
|
|
key = 'number';
|
|
|
} else if (str) {
|
|
|
key = 'string';
|
|
|
} else if (arr) {
|
|
|
key = 'array';
|
|
|
} // if the value is not of a supported type for range validation
|
|
|
// the validation rule rule should use the
|
|
|
// type property to also test for a particular type
|
|
|
|
|
|
|
|
|
if (!key) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (arr) {
|
|
|
val = value.length;
|
|
|
}
|
|
|
|
|
|
if (str) {
|
|
|
// 处理码点大于U+010000的文字length属性不准确的bug,如"𠮷𠮷𠮷".lenght !== 3
|
|
|
val = value.replace(spRegexp, '_').length;
|
|
|
}
|
|
|
|
|
|
if (len) {
|
|
|
if (val !== rule.len) {
|
|
|
errors.push(format(options.messages[key].len, rule.fullField, rule.len));
|
|
|
}
|
|
|
} else if (min && !max && val < rule.min) {
|
|
|
errors.push(format(options.messages[key].min, rule.fullField, rule.min));
|
|
|
} else if (max && !min && val > rule.max) {
|
|
|
errors.push(format(options.messages[key].max, rule.fullField, rule.max));
|
|
|
} else if (min && max && (val < rule.min || val > rule.max)) {
|
|
|
errors.push(format(options.messages[key].range, rule.fullField, rule.min, rule.max));
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var ENUM$1 = 'enum';
|
|
|
|
|
|
var enumerable$1 = function enumerable(rule, value, source, errors, options) {
|
|
|
rule[ENUM$1] = Array.isArray(rule[ENUM$1]) ? rule[ENUM$1] : [];
|
|
|
|
|
|
if (rule[ENUM$1].indexOf(value) === -1) {
|
|
|
errors.push(format(options.messages[ENUM$1], rule.fullField, rule[ENUM$1].join(', ')));
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var pattern$1 = function pattern(rule, value, source, errors, options) {
|
|
|
if (rule.pattern) {
|
|
|
if (rule.pattern instanceof RegExp) {
|
|
|
// if a RegExp instance is passed, reset `lastIndex` in case its `global`
|
|
|
// flag is accidentally set to `true`, which in a validation scenario
|
|
|
// is not necessary and the result might be misleading
|
|
|
rule.pattern.lastIndex = 0;
|
|
|
|
|
|
if (!rule.pattern.test(value)) {
|
|
|
errors.push(format(options.messages.pattern.mismatch, rule.fullField, value, rule.pattern));
|
|
|
}
|
|
|
} else if (typeof rule.pattern === 'string') {
|
|
|
var _pattern = new RegExp(rule.pattern);
|
|
|
|
|
|
if (!_pattern.test(value)) {
|
|
|
errors.push(format(options.messages.pattern.mismatch, rule.fullField, value, rule.pattern));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var rules = {
|
|
|
required: required$1,
|
|
|
whitespace: whitespace,
|
|
|
type: type$1,
|
|
|
range: range,
|
|
|
"enum": enumerable$1,
|
|
|
pattern: pattern$1
|
|
|
};
|
|
|
|
|
|
var string = function string(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value, 'string') && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options, 'string');
|
|
|
|
|
|
if (!isEmptyValue(value, 'string')) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
rules.range(rule, value, source, errors, options);
|
|
|
rules.pattern(rule, value, source, errors, options);
|
|
|
|
|
|
if (rule.whitespace === true) {
|
|
|
rules.whitespace(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var method = function method(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var number = function number(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (value === '') {
|
|
|
value = undefined;
|
|
|
}
|
|
|
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
rules.range(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var _boolean = function _boolean(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var regexp = function regexp(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (!isEmptyValue(value)) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var integer = function integer(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
rules.range(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var floatFn = function floatFn(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
rules.range(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var array = function array(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if ((value === undefined || value === null) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options, 'array');
|
|
|
|
|
|
if (value !== undefined && value !== null) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
rules.range(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var object = function object(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var ENUM = 'enum';
|
|
|
|
|
|
var enumerable = function enumerable(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (value !== undefined) {
|
|
|
rules[ENUM](rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var pattern = function pattern(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value, 'string') && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (!isEmptyValue(value, 'string')) {
|
|
|
rules.pattern(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var date = function date(rule, value, callback, source, options) {
|
|
|
// console.log('integer rule called %j', rule);
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field); // console.log('validate on %s value', value);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value, 'date') && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
|
|
|
if (!isEmptyValue(value, 'date')) {
|
|
|
var dateObject;
|
|
|
|
|
|
if (value instanceof Date) {
|
|
|
dateObject = value;
|
|
|
} else {
|
|
|
dateObject = new Date(value);
|
|
|
}
|
|
|
|
|
|
rules.type(rule, dateObject, source, errors, options);
|
|
|
|
|
|
if (dateObject) {
|
|
|
rules.range(rule, dateObject.getTime(), source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var required = function required(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var type = Array.isArray(value) ? 'array' : typeof value;
|
|
|
rules.required(rule, value, source, errors, options, type);
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var type = function type(rule, value, callback, source, options) {
|
|
|
var ruleType = rule.type;
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value, ruleType) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options, ruleType);
|
|
|
|
|
|
if (!isEmptyValue(value, ruleType)) {
|
|
|
rules.type(rule, value, source, errors, options);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var any = function any(rule, value, callback, source, options) {
|
|
|
var errors = [];
|
|
|
var validate = rule.required || !rule.required && source.hasOwnProperty(rule.field);
|
|
|
|
|
|
if (validate) {
|
|
|
if (isEmptyValue(value) && !rule.required) {
|
|
|
return callback();
|
|
|
}
|
|
|
|
|
|
rules.required(rule, value, source, errors, options);
|
|
|
}
|
|
|
|
|
|
callback(errors);
|
|
|
};
|
|
|
|
|
|
var validators = {
|
|
|
string: string,
|
|
|
method: method,
|
|
|
number: number,
|
|
|
"boolean": _boolean,
|
|
|
regexp: regexp,
|
|
|
integer: integer,
|
|
|
"float": floatFn,
|
|
|
array: array,
|
|
|
object: object,
|
|
|
"enum": enumerable,
|
|
|
pattern: pattern,
|
|
|
date: date,
|
|
|
url: type,
|
|
|
hex: type,
|
|
|
email: type,
|
|
|
required: required,
|
|
|
any: any
|
|
|
};
|
|
|
|
|
|
function newMessages() {
|
|
|
return {
|
|
|
"default": 'Validation error on field %s',
|
|
|
required: '%s is required',
|
|
|
"enum": '%s must be one of %s',
|
|
|
whitespace: '%s cannot be empty',
|
|
|
date: {
|
|
|
format: '%s date %s is invalid for format %s',
|
|
|
parse: '%s date could not be parsed, %s is invalid ',
|
|
|
invalid: '%s date %s is invalid'
|
|
|
},
|
|
|
types: {
|
|
|
string: '%s is not a %s',
|
|
|
method: '%s is not a %s (function)',
|
|
|
array: '%s is not an %s',
|
|
|
object: '%s is not an %s',
|
|
|
number: '%s is not a %s',
|
|
|
date: '%s is not a %s',
|
|
|
"boolean": '%s is not a %s',
|
|
|
integer: '%s is not an %s',
|
|
|
"float": '%s is not a %s',
|
|
|
regexp: '%s is not a valid %s',
|
|
|
email: '%s is not a valid %s',
|
|
|
url: '%s is not a valid %s',
|
|
|
hex: '%s is not a valid %s'
|
|
|
},
|
|
|
string: {
|
|
|
len: '%s must be exactly %s characters',
|
|
|
min: '%s must be at least %s characters',
|
|
|
max: '%s cannot be longer than %s characters',
|
|
|
range: '%s must be between %s and %s characters'
|
|
|
},
|
|
|
number: {
|
|
|
len: '%s must equal %s',
|
|
|
min: '%s cannot be less than %s',
|
|
|
max: '%s cannot be greater than %s',
|
|
|
range: '%s must be between %s and %s'
|
|
|
},
|
|
|
array: {
|
|
|
len: '%s must be exactly %s in length',
|
|
|
min: '%s cannot be less than %s in length',
|
|
|
max: '%s cannot be greater than %s in length',
|
|
|
range: '%s must be between %s and %s in length'
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: '%s value %s does not match pattern %s'
|
|
|
},
|
|
|
clone: function clone() {
|
|
|
var cloned = JSON.parse(JSON.stringify(this));
|
|
|
cloned.clone = this.clone;
|
|
|
return cloned;
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
var messages = newMessages();
|
|
|
|
|
|
/**
|
|
|
* Encapsulates a validation schema.
|
|
|
*
|
|
|
* @param descriptor An object declaring validation rules
|
|
|
* for this schema.
|
|
|
*/
|
|
|
|
|
|
var Schema = /*#__PURE__*/function () {
|
|
|
// ========================= Static =========================
|
|
|
// ======================== Instance ========================
|
|
|
function Schema(descriptor) {
|
|
|
this.rules = null;
|
|
|
this._messages = messages;
|
|
|
this.define(descriptor);
|
|
|
}
|
|
|
|
|
|
var _proto = Schema.prototype;
|
|
|
|
|
|
_proto.define = function define(rules) {
|
|
|
var _this = this;
|
|
|
|
|
|
if (!rules) {
|
|
|
throw new Error('Cannot configure a schema with no rules');
|
|
|
}
|
|
|
|
|
|
if (typeof rules !== 'object' || Array.isArray(rules)) {
|
|
|
throw new Error('Rules must be an object');
|
|
|
}
|
|
|
|
|
|
this.rules = {};
|
|
|
Object.keys(rules).forEach(function (name) {
|
|
|
var item = rules[name];
|
|
|
_this.rules[name] = Array.isArray(item) ? item : [item];
|
|
|
});
|
|
|
};
|
|
|
|
|
|
_proto.messages = function messages(_messages) {
|
|
|
if (_messages) {
|
|
|
this._messages = deepMerge(newMessages(), _messages);
|
|
|
}
|
|
|
|
|
|
return this._messages;
|
|
|
};
|
|
|
|
|
|
_proto.validate = function validate(source_, o, oc) {
|
|
|
var _this2 = this;
|
|
|
|
|
|
if (o === void 0) {
|
|
|
o = {};
|
|
|
}
|
|
|
|
|
|
if (oc === void 0) {
|
|
|
oc = function oc() {};
|
|
|
}
|
|
|
|
|
|
var source = source_;
|
|
|
var options = o;
|
|
|
var callback = oc;
|
|
|
|
|
|
if (typeof options === 'function') {
|
|
|
callback = options;
|
|
|
options = {};
|
|
|
}
|
|
|
|
|
|
if (!this.rules || Object.keys(this.rules).length === 0) {
|
|
|
if (callback) {
|
|
|
callback(null, source);
|
|
|
}
|
|
|
|
|
|
return Promise.resolve(source);
|
|
|
}
|
|
|
|
|
|
function complete(results) {
|
|
|
var errors = [];
|
|
|
var fields = {};
|
|
|
|
|
|
function add(e) {
|
|
|
if (Array.isArray(e)) {
|
|
|
var _errors;
|
|
|
|
|
|
errors = (_errors = errors).concat.apply(_errors, e);
|
|
|
} else {
|
|
|
errors.push(e);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
for (var i = 0; i < results.length; i++) {
|
|
|
add(results[i]);
|
|
|
}
|
|
|
|
|
|
if (!errors.length) {
|
|
|
callback(null, source);
|
|
|
} else {
|
|
|
fields = convertFieldsError(errors);
|
|
|
callback(errors, fields);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (options.messages) {
|
|
|
var messages$1 = this.messages();
|
|
|
|
|
|
if (messages$1 === messages) {
|
|
|
messages$1 = newMessages();
|
|
|
}
|
|
|
|
|
|
deepMerge(messages$1, options.messages);
|
|
|
options.messages = messages$1;
|
|
|
} else {
|
|
|
options.messages = this.messages();
|
|
|
}
|
|
|
|
|
|
var series = {};
|
|
|
var keys = options.keys || Object.keys(this.rules);
|
|
|
keys.forEach(function (z) {
|
|
|
var arr = _this2.rules[z];
|
|
|
var value = source[z];
|
|
|
arr.forEach(function (r) {
|
|
|
var rule = r;
|
|
|
|
|
|
if (typeof rule.transform === 'function') {
|
|
|
if (source === source_) {
|
|
|
source = _extends({}, source);
|
|
|
}
|
|
|
|
|
|
value = source[z] = rule.transform(value);
|
|
|
}
|
|
|
|
|
|
if (typeof rule === 'function') {
|
|
|
rule = {
|
|
|
validator: rule
|
|
|
};
|
|
|
} else {
|
|
|
rule = _extends({}, rule);
|
|
|
} // Fill validator. Skip if nothing need to validate
|
|
|
|
|
|
|
|
|
rule.validator = _this2.getValidationMethod(rule);
|
|
|
|
|
|
if (!rule.validator) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
rule.field = z;
|
|
|
rule.fullField = rule.fullField || z;
|
|
|
rule.type = _this2.getType(rule);
|
|
|
series[z] = series[z] || [];
|
|
|
series[z].push({
|
|
|
rule: rule,
|
|
|
value: value,
|
|
|
source: source,
|
|
|
field: z
|
|
|
});
|
|
|
});
|
|
|
});
|
|
|
var errorFields = {};
|
|
|
return asyncMap(series, options, function (data, doIt) {
|
|
|
var rule = data.rule;
|
|
|
var deep = (rule.type === 'object' || rule.type === 'array') && (typeof rule.fields === 'object' || typeof rule.defaultField === 'object');
|
|
|
deep = deep && (rule.required || !rule.required && data.value);
|
|
|
rule.field = data.field;
|
|
|
|
|
|
function addFullField(key, schema) {
|
|
|
return _extends({}, schema, {
|
|
|
fullField: rule.fullField + "." + key,
|
|
|
fullFields: rule.fullFields ? [].concat(rule.fullFields, [key]) : [key]
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function cb(e) {
|
|
|
if (e === void 0) {
|
|
|
e = [];
|
|
|
}
|
|
|
|
|
|
var errorList = Array.isArray(e) ? e : [e];
|
|
|
|
|
|
if (!options.suppressWarning && errorList.length) {
|
|
|
Schema.warning('async-validator:', errorList);
|
|
|
}
|
|
|
|
|
|
if (errorList.length && rule.message !== undefined) {
|
|
|
errorList = [].concat(rule.message);
|
|
|
} // Fill error info
|
|
|
|
|
|
|
|
|
var filledErrors = errorList.map(complementError(rule, source));
|
|
|
|
|
|
if (options.first && filledErrors.length) {
|
|
|
errorFields[rule.field] = 1;
|
|
|
return doIt(filledErrors);
|
|
|
}
|
|
|
|
|
|
if (!deep) {
|
|
|
doIt(filledErrors);
|
|
|
} else {
|
|
|
// if rule is required but the target object
|
|
|
// does not exist fail at the rule level and don't
|
|
|
// go deeper
|
|
|
if (rule.required && !data.value) {
|
|
|
if (rule.message !== undefined) {
|
|
|
filledErrors = [].concat(rule.message).map(complementError(rule, source));
|
|
|
} else if (options.error) {
|
|
|
filledErrors = [options.error(rule, format(options.messages.required, rule.field))];
|
|
|
}
|
|
|
|
|
|
return doIt(filledErrors);
|
|
|
}
|
|
|
|
|
|
var fieldsSchema = {};
|
|
|
|
|
|
if (rule.defaultField) {
|
|
|
Object.keys(data.value).map(function (key) {
|
|
|
fieldsSchema[key] = rule.defaultField;
|
|
|
});
|
|
|
}
|
|
|
|
|
|
fieldsSchema = _extends({}, fieldsSchema, data.rule.fields);
|
|
|
var paredFieldsSchema = {};
|
|
|
Object.keys(fieldsSchema).forEach(function (field) {
|
|
|
var fieldSchema = fieldsSchema[field];
|
|
|
var fieldSchemaList = Array.isArray(fieldSchema) ? fieldSchema : [fieldSchema];
|
|
|
paredFieldsSchema[field] = fieldSchemaList.map(addFullField.bind(null, field));
|
|
|
});
|
|
|
var schema = new Schema(paredFieldsSchema);
|
|
|
schema.messages(options.messages);
|
|
|
|
|
|
if (data.rule.options) {
|
|
|
data.rule.options.messages = options.messages;
|
|
|
data.rule.options.error = options.error;
|
|
|
}
|
|
|
|
|
|
schema.validate(data.value, data.rule.options || options, function (errs) {
|
|
|
var finalErrors = [];
|
|
|
|
|
|
if (filledErrors && filledErrors.length) {
|
|
|
finalErrors.push.apply(finalErrors, filledErrors);
|
|
|
}
|
|
|
|
|
|
if (errs && errs.length) {
|
|
|
finalErrors.push.apply(finalErrors, errs);
|
|
|
}
|
|
|
|
|
|
doIt(finalErrors.length ? finalErrors : null);
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var res;
|
|
|
|
|
|
if (rule.asyncValidator) {
|
|
|
res = rule.asyncValidator(rule, data.value, cb, data.source, options);
|
|
|
} else if (rule.validator) {
|
|
|
try {
|
|
|
res = rule.validator(rule, data.value, cb, data.source, options);
|
|
|
} catch (error) {
|
|
|
console.error == null ? void 0 : console.error(error); // rethrow to report error
|
|
|
|
|
|
if (!options.suppressValidatorError) {
|
|
|
setTimeout(function () {
|
|
|
throw error;
|
|
|
}, 0);
|
|
|
}
|
|
|
|
|
|
cb(error.message);
|
|
|
}
|
|
|
|
|
|
if (res === true) {
|
|
|
cb();
|
|
|
} else if (res === false) {
|
|
|
cb(typeof rule.message === 'function' ? rule.message(rule.fullField || rule.field) : rule.message || (rule.fullField || rule.field) + " fails");
|
|
|
} else if (res instanceof Array) {
|
|
|
cb(res);
|
|
|
} else if (res instanceof Error) {
|
|
|
cb(res.message);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (res && res.then) {
|
|
|
res.then(function () {
|
|
|
return cb();
|
|
|
}, function (e) {
|
|
|
return cb(e);
|
|
|
});
|
|
|
}
|
|
|
}, function (results) {
|
|
|
complete(results);
|
|
|
}, source);
|
|
|
};
|
|
|
|
|
|
_proto.getType = function getType(rule) {
|
|
|
if (rule.type === undefined && rule.pattern instanceof RegExp) {
|
|
|
rule.type = 'pattern';
|
|
|
}
|
|
|
|
|
|
if (typeof rule.validator !== 'function' && rule.type && !validators.hasOwnProperty(rule.type)) {
|
|
|
throw new Error(format('Unknown rule type %s', rule.type));
|
|
|
}
|
|
|
|
|
|
return rule.type || 'string';
|
|
|
};
|
|
|
|
|
|
_proto.getValidationMethod = function getValidationMethod(rule) {
|
|
|
if (typeof rule.validator === 'function') {
|
|
|
return rule.validator;
|
|
|
}
|
|
|
|
|
|
var keys = Object.keys(rule);
|
|
|
var messageIndex = keys.indexOf('message');
|
|
|
|
|
|
if (messageIndex !== -1) {
|
|
|
keys.splice(messageIndex, 1);
|
|
|
}
|
|
|
|
|
|
if (keys.length === 1 && keys[0] === 'required') {
|
|
|
return validators.required;
|
|
|
}
|
|
|
|
|
|
return validators[this.getType(rule)] || undefined;
|
|
|
};
|
|
|
|
|
|
return Schema;
|
|
|
}();
|
|
|
|
|
|
Schema.register = function register(type, validator) {
|
|
|
if (typeof validator !== 'function') {
|
|
|
throw new Error('Cannot register a validator by type, validator is not a function');
|
|
|
}
|
|
|
|
|
|
validators[type] = validator;
|
|
|
};
|
|
|
|
|
|
Schema.warning = warning;
|
|
|
Schema.messages = messages;
|
|
|
Schema.validators = validators;
|
|
|
|
|
|
|
|
|
//# sourceMappingURL=index.js.map
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./src/components/MyButton/index.js":
|
|
|
/*!******************************************!*\
|
|
|
!*** ./src/components/MyButton/index.js ***!
|
|
|
\******************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var antd_lib_button__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! antd/lib/button */ "./node_modules/antd/lib/button/index.js");
|
|
|
/* harmony import */ var antd_lib_button__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(antd_lib_button__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! prop-types */ "./node_modules/prop-types/index.js");
|
|
|
/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
|
|
|
|
|
|
|
|
|
function MyButton(_ref) {
|
|
|
var text = _ref.text,
|
|
|
onClick = _ref.onClick;
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((antd_lib_button__WEBPACK_IMPORTED_MODULE_1___default()), {
|
|
|
type: "primary",
|
|
|
onClick: onClick
|
|
|
}, text));
|
|
|
}
|
|
|
;
|
|
|
MyButton.propTypes = {
|
|
|
text: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().string.isRequired),
|
|
|
onClick: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().func.isRequired)
|
|
|
};
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MyButton);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./src/containers/DashboardContainer/index.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./src/containers/DashboardContainer/index.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var antd_lib_config_provider__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! antd/lib/config-provider */ "./node_modules/antd/lib/config-provider/index.js");
|
|
|
/* harmony import */ var antd_lib_theme__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! antd/lib/theme */ "./node_modules/antd/lib/theme/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var antd_lib_locale_en_GB__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! antd/lib/locale/en_GB */ "./node_modules/antd/lib/locale/en_GB.js");
|
|
|
/* harmony import */ var antd_lib_locale_en_US__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! antd/lib/locale/en_US */ "./node_modules/antd/lib/locale/en_US.js");
|
|
|
/* harmony import */ var antd_lib_locale_es_ES__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! antd/lib/locale/es_ES */ "./node_modules/antd/lib/locale/es_ES.js");
|
|
|
/* harmony import */ var antd_lib_locale_pt_BR__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! antd/lib/locale/pt_BR */ "./node_modules/antd/lib/locale/pt_BR.js");
|
|
|
/* harmony import */ var antd_lib_locale_pt_PT__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! antd/lib/locale/pt_PT */ "./node_modules/antd/lib/locale/pt_PT.js");
|
|
|
/* harmony import */ var _components_MyButton__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../components/MyButton */ "./src/components/MyButton/index.js");
|
|
|
/* harmony import */ var _index_less__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./index.less */ "./src/containers/DashboardContainer/index.less");
|
|
|
|
|
|
|
|
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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."); }
|
|
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(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 _arrayLikeToArray(o, minLen); }
|
|
|
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; }
|
|
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var antdVariables = {
|
|
|
colorPrimary: '#5b5ce1',
|
|
|
colorLink: '#5b5ce1',
|
|
|
borderRadius: 5
|
|
|
};
|
|
|
function DashboardContainer() {
|
|
|
var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(0),
|
|
|
_useState2 = _slicedToArray(_useState, 2),
|
|
|
counter = _useState2[0],
|
|
|
setCounter = _useState2[1];
|
|
|
var refButton = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)();
|
|
|
(0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
|
|
|
$(refButton.current).fadeOut(250).fadeIn(250);
|
|
|
}, [counter]);
|
|
|
var onClick = function onClick() {
|
|
|
setCounter(counter + 1);
|
|
|
};
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(antd_lib_config_provider__WEBPACK_IMPORTED_MODULE_3__["default"], {
|
|
|
theme: {
|
|
|
token: antdVariables,
|
|
|
algorithm: antd_lib_theme__WEBPACK_IMPORTED_MODULE_4__["default"].darkAlgorithm
|
|
|
},
|
|
|
locale: {
|
|
|
'en_us': antd_lib_locale_en_US__WEBPACK_IMPORTED_MODULE_5__["default"],
|
|
|
'en_gb': antd_lib_locale_en_GB__WEBPACK_IMPORTED_MODULE_6__["default"],
|
|
|
'es_es': antd_lib_locale_es_ES__WEBPACK_IMPORTED_MODULE_7__["default"],
|
|
|
'pt_br': antd_lib_locale_pt_BR__WEBPACK_IMPORTED_MODULE_8__["default"],
|
|
|
'pt_pt': antd_lib_locale_pt_PT__WEBPACK_IMPORTED_MODULE_9__["default"]
|
|
|
}[netuno.config.langCode]
|
|
|
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
|
|
|
className: "my-dashboard"
|
|
|
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
|
|
|
ref: refButton,
|
|
|
className: "my-dashboard__button"
|
|
|
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_MyButton__WEBPACK_IMPORTED_MODULE_1__["default"], {
|
|
|
text: "ReactJS \u26A1 Ant.Design \uD83D\uDC49 Click me! ".concat(counter),
|
|
|
onClick: onClick
|
|
|
}))));
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DashboardContainer);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/classnames/index.js":
|
|
|
/*!******************************************!*\
|
|
|
!*** ./node_modules/classnames/index.js ***!
|
|
|
\******************************************/
|
|
|
/***/ ((module, exports) => {
|
|
|
|
|
|
var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*!
|
|
|
Copyright (c) 2018 Jed Watson.
|
|
|
Licensed under the MIT License (MIT), see
|
|
|
http://jedwatson.github.io/classnames
|
|
|
*/
|
|
|
/* global define */
|
|
|
|
|
|
(function () {
|
|
|
'use strict';
|
|
|
|
|
|
var hasOwn = {}.hasOwnProperty;
|
|
|
var nativeCodeString = '[native code]';
|
|
|
|
|
|
function classNames() {
|
|
|
var classes = [];
|
|
|
|
|
|
for (var i = 0; i < arguments.length; i++) {
|
|
|
var arg = arguments[i];
|
|
|
if (!arg) continue;
|
|
|
|
|
|
var argType = typeof arg;
|
|
|
|
|
|
if (argType === 'string' || argType === 'number') {
|
|
|
classes.push(arg);
|
|
|
} else if (Array.isArray(arg)) {
|
|
|
if (arg.length) {
|
|
|
var inner = classNames.apply(null, arg);
|
|
|
if (inner) {
|
|
|
classes.push(inner);
|
|
|
}
|
|
|
}
|
|
|
} else if (argType === 'object') {
|
|
|
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
|
|
|
classes.push(arg.toString());
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
for (var key in arg) {
|
|
|
if (hasOwn.call(arg, key) && arg[key]) {
|
|
|
classes.push(key);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return classes.join(' ');
|
|
|
}
|
|
|
|
|
|
if ( true && module.exports) {
|
|
|
classNames.default = classNames;
|
|
|
module.exports = classNames;
|
|
|
} else if (true) {
|
|
|
// register as 'classnames', consistent with npm package name
|
|
|
!(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = (function () {
|
|
|
return classNames;
|
|
|
}).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__),
|
|
|
__WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__));
|
|
|
} else {}
|
|
|
}());
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/containers/DashboardContainer/index.less":
|
|
|
/*!*******************************************************************************************************************************************************************************************!*\
|
|
|
!*** ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/containers/DashboardContainer/index.less ***!
|
|
|
\*******************************************************************************************************************************************************************************************/
|
|
|
/***/ ((module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/sourceMaps.js */ "./node_modules/css-loader/dist/runtime/sourceMaps.js");
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js");
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
// Imports
|
|
|
|
|
|
|
|
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
|
// Module
|
|
|
___CSS_LOADER_EXPORT___.push([module.id, ".my-dashboard {\n width: 100%;\n}\n.my-dashboard__button {\n padding: 80px;\n text-align: center;\n}\n", "",{"version":3,"sources":["webpack://./src/containers/DashboardContainer/index.less"],"names":[],"mappings":"AACA;EACE,WAAA;AAAF;AACE;EACE,aAAA;EACA,kBAAA;AACJ","sourcesContent":["\n.my-dashboard {\n width: 100%;\n &__button {\n padding: 80px;\n text-align: center;\n }\n}\n\n@primary-color: #5b5ce1;@link-color: #5b5ce1;@border-radius-base: 5px;"],"sourceRoot":""}]);
|
|
|
// Exports
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/styles/main.less":
|
|
|
/*!*******************************************************************************************************************************************************************!*\
|
|
|
!*** ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/styles/main.less ***!
|
|
|
\*******************************************************************************************************************************************************************/
|
|
|
/***/ ((module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/sourceMaps.js */ "./node_modules/css-loader/dist/runtime/sourceMaps.js");
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../node_modules/css-loader/dist/runtime/api.js */ "./node_modules/css-loader/dist/runtime/api.js");
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
// Imports
|
|
|
|
|
|
|
|
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
|
// Module
|
|
|
___CSS_LOADER_EXPORT___.push([module.id, "/*** GLOBAL CSS ***/\n", "",{"version":3,"sources":["webpack://./src/styles/main.less"],"names":[],"mappings":"AAAA,mBAAmB","sourceRoot":""}]);
|
|
|
// Exports
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/css-loader/dist/runtime/api.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/css-loader/dist/runtime/api.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
/*
|
|
|
MIT License http://www.opensource.org/licenses/mit-license.php
|
|
|
Author Tobias Koppers @sokra
|
|
|
*/
|
|
|
module.exports = function (cssWithMappingToString) {
|
|
|
var list = [];
|
|
|
|
|
|
// return the list of modules as css string
|
|
|
list.toString = function toString() {
|
|
|
return this.map(function (item) {
|
|
|
var content = "";
|
|
|
var needLayer = typeof item[5] !== "undefined";
|
|
|
if (item[4]) {
|
|
|
content += "@supports (".concat(item[4], ") {");
|
|
|
}
|
|
|
if (item[2]) {
|
|
|
content += "@media ".concat(item[2], " {");
|
|
|
}
|
|
|
if (needLayer) {
|
|
|
content += "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {");
|
|
|
}
|
|
|
content += cssWithMappingToString(item);
|
|
|
if (needLayer) {
|
|
|
content += "}";
|
|
|
}
|
|
|
if (item[2]) {
|
|
|
content += "}";
|
|
|
}
|
|
|
if (item[4]) {
|
|
|
content += "}";
|
|
|
}
|
|
|
return content;
|
|
|
}).join("");
|
|
|
};
|
|
|
|
|
|
// import a list of modules into the list
|
|
|
list.i = function i(modules, media, dedupe, supports, layer) {
|
|
|
if (typeof modules === "string") {
|
|
|
modules = [[null, modules, undefined]];
|
|
|
}
|
|
|
var alreadyImportedModules = {};
|
|
|
if (dedupe) {
|
|
|
for (var k = 0; k < this.length; k++) {
|
|
|
var id = this[k][0];
|
|
|
if (id != null) {
|
|
|
alreadyImportedModules[id] = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
for (var _k = 0; _k < modules.length; _k++) {
|
|
|
var item = [].concat(modules[_k]);
|
|
|
if (dedupe && alreadyImportedModules[item[0]]) {
|
|
|
continue;
|
|
|
}
|
|
|
if (typeof layer !== "undefined") {
|
|
|
if (typeof item[5] === "undefined") {
|
|
|
item[5] = layer;
|
|
|
} else {
|
|
|
item[1] = "@layer".concat(item[5].length > 0 ? " ".concat(item[5]) : "", " {").concat(item[1], "}");
|
|
|
item[5] = layer;
|
|
|
}
|
|
|
}
|
|
|
if (media) {
|
|
|
if (!item[2]) {
|
|
|
item[2] = media;
|
|
|
} else {
|
|
|
item[1] = "@media ".concat(item[2], " {").concat(item[1], "}");
|
|
|
item[2] = media;
|
|
|
}
|
|
|
}
|
|
|
if (supports) {
|
|
|
if (!item[4]) {
|
|
|
item[4] = "".concat(supports);
|
|
|
} else {
|
|
|
item[1] = "@supports (".concat(item[4], ") {").concat(item[1], "}");
|
|
|
item[4] = supports;
|
|
|
}
|
|
|
}
|
|
|
list.push(item);
|
|
|
}
|
|
|
};
|
|
|
return list;
|
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/css-loader/dist/runtime/sourceMaps.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/css-loader/dist/runtime/sourceMaps.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
module.exports = function (item) {
|
|
|
var content = item[1];
|
|
|
var cssMapping = item[3];
|
|
|
if (!cssMapping) {
|
|
|
return content;
|
|
|
}
|
|
|
if (typeof btoa === "function") {
|
|
|
var base64 = btoa(unescape(encodeURIComponent(JSON.stringify(cssMapping))));
|
|
|
var data = "sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(base64);
|
|
|
var sourceMapping = "/*# ".concat(data, " */");
|
|
|
return [content].concat([sourceMapping]).join("\n");
|
|
|
}
|
|
|
return [content].join("\n");
|
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/object-assign/index.js":
|
|
|
/*!*********************************************!*\
|
|
|
!*** ./node_modules/object-assign/index.js ***!
|
|
|
\*********************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
/*
|
|
|
object-assign
|
|
|
(c) Sindre Sorhus
|
|
|
@license MIT
|
|
|
*/
|
|
|
|
|
|
|
|
|
/* eslint-disable no-unused-vars */
|
|
|
var getOwnPropertySymbols = Object.getOwnPropertySymbols;
|
|
|
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
|
var propIsEnumerable = Object.prototype.propertyIsEnumerable;
|
|
|
|
|
|
function toObject(val) {
|
|
|
if (val === null || val === undefined) {
|
|
|
throw new TypeError('Object.assign cannot be called with null or undefined');
|
|
|
}
|
|
|
|
|
|
return Object(val);
|
|
|
}
|
|
|
|
|
|
function shouldUseNative() {
|
|
|
try {
|
|
|
if (!Object.assign) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// Detect buggy property enumeration order in older V8 versions.
|
|
|
|
|
|
// https://bugs.chromium.org/p/v8/issues/detail?id=4118
|
|
|
var test1 = new String('abc'); // eslint-disable-line no-new-wrappers
|
|
|
test1[5] = 'de';
|
|
|
if (Object.getOwnPropertyNames(test1)[0] === '5') {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// https://bugs.chromium.org/p/v8/issues/detail?id=3056
|
|
|
var test2 = {};
|
|
|
for (var i = 0; i < 10; i++) {
|
|
|
test2['_' + String.fromCharCode(i)] = i;
|
|
|
}
|
|
|
var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
|
|
|
return test2[n];
|
|
|
});
|
|
|
if (order2.join('') !== '0123456789') {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// https://bugs.chromium.org/p/v8/issues/detail?id=3056
|
|
|
var test3 = {};
|
|
|
'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
|
|
|
test3[letter] = letter;
|
|
|
});
|
|
|
if (Object.keys(Object.assign({}, test3)).join('') !==
|
|
|
'abcdefghijklmnopqrst') {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
} catch (err) {
|
|
|
// We don't expect any of the above to throw, but better to be safe.
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
module.exports = shouldUseNative() ? Object.assign : function (target, source) {
|
|
|
var from;
|
|
|
var to = toObject(target);
|
|
|
var symbols;
|
|
|
|
|
|
for (var s = 1; s < arguments.length; s++) {
|
|
|
from = Object(arguments[s]);
|
|
|
|
|
|
for (var key in from) {
|
|
|
if (hasOwnProperty.call(from, key)) {
|
|
|
to[key] = from[key];
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (getOwnPropertySymbols) {
|
|
|
symbols = getOwnPropertySymbols(from);
|
|
|
for (var i = 0; i < symbols.length; i++) {
|
|
|
if (propIsEnumerable.call(from, symbols[i])) {
|
|
|
to[symbols[i]] = from[symbols[i]];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return to;
|
|
|
};
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/prop-types/checkPropTypes.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/prop-types/checkPropTypes.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((module, __unused_webpack_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.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
var printWarning = function() {};
|
|
|
|
|
|
if (true) {
|
|
|
var ReactPropTypesSecret = __webpack_require__(/*! ./lib/ReactPropTypesSecret */ "./node_modules/prop-types/lib/ReactPropTypesSecret.js");
|
|
|
var loggedTypeFailures = {};
|
|
|
var has = __webpack_require__(/*! ./lib/has */ "./node_modules/prop-types/lib/has.js");
|
|
|
|
|
|
printWarning = function(text) {
|
|
|
var message = 'Warning: ' + text;
|
|
|
if (typeof console !== 'undefined') {
|
|
|
console.error(message);
|
|
|
}
|
|
|
try {
|
|
|
// --- Welcome to debugging React ---
|
|
|
// This error was thrown as a convenience so that you can use this stack
|
|
|
// to find the callsite that caused this warning to fire.
|
|
|
throw new Error(message);
|
|
|
} catch (x) { /**/ }
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Assert that the values match with the type specs.
|
|
|
* Error messages are memorized and will only be shown once.
|
|
|
*
|
|
|
* @param {object} typeSpecs Map of name to a ReactPropType
|
|
|
* @param {object} values Runtime values that need to be type-checked
|
|
|
* @param {string} location e.g. "prop", "context", "child context"
|
|
|
* @param {string} componentName Name of the component for error messages.
|
|
|
* @param {?Function} getStack Returns the component stack.
|
|
|
* @private
|
|
|
*/
|
|
|
function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
|
|
|
if (true) {
|
|
|
for (var typeSpecName in typeSpecs) {
|
|
|
if (has(typeSpecs, typeSpecName)) {
|
|
|
var error;
|
|
|
// Prop type validation may throw. In case they do, we don't want to
|
|
|
// fail the render phase where it didn't fail before. So we log it.
|
|
|
// After these have been cleaned up, we'll let them throw.
|
|
|
try {
|
|
|
// This is intentionally an invariant that gets caught. It's the same
|
|
|
// behavior as without this statement except with a better message.
|
|
|
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
|
|
var err = Error(
|
|
|
(componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' +
|
|
|
'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' +
|
|
|
'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.'
|
|
|
);
|
|
|
err.name = 'Invariant Violation';
|
|
|
throw err;
|
|
|
}
|
|
|
error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);
|
|
|
} catch (ex) {
|
|
|
error = ex;
|
|
|
}
|
|
|
if (error && !(error instanceof Error)) {
|
|
|
printWarning(
|
|
|
(componentName || 'React class') + ': type specification of ' +
|
|
|
location + ' `' + typeSpecName + '` is invalid; the type checker ' +
|
|
|
'function must return `null` or an `Error` but returned a ' + typeof error + '. ' +
|
|
|
'You may have forgotten to pass an argument to the type checker ' +
|
|
|
'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' +
|
|
|
'shape all require an argument).'
|
|
|
);
|
|
|
}
|
|
|
if (error instanceof Error && !(error.message in loggedTypeFailures)) {
|
|
|
// Only monitor this failure once because there tends to be a lot of the
|
|
|
// same error.
|
|
|
loggedTypeFailures[error.message] = true;
|
|
|
|
|
|
var stack = getStack ? getStack() : '';
|
|
|
|
|
|
printWarning(
|
|
|
'Failed ' + location + ' type: ' + error.message + (stack != null ? stack : '')
|
|
|
);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Resets warning cache when testing.
|
|
|
*
|
|
|
* @private
|
|
|
*/
|
|
|
checkPropTypes.resetWarningCache = function() {
|
|
|
if (true) {
|
|
|
loggedTypeFailures = {};
|
|
|
}
|
|
|
}
|
|
|
|
|
|
module.exports = checkPropTypes;
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/prop-types/factoryWithTypeCheckers.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/prop-types/factoryWithTypeCheckers.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((module, __unused_webpack_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.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
var ReactIs = __webpack_require__(/*! react-is */ "./node_modules/react-is/index.js");
|
|
|
var assign = __webpack_require__(/*! object-assign */ "./node_modules/object-assign/index.js");
|
|
|
|
|
|
var ReactPropTypesSecret = __webpack_require__(/*! ./lib/ReactPropTypesSecret */ "./node_modules/prop-types/lib/ReactPropTypesSecret.js");
|
|
|
var has = __webpack_require__(/*! ./lib/has */ "./node_modules/prop-types/lib/has.js");
|
|
|
var checkPropTypes = __webpack_require__(/*! ./checkPropTypes */ "./node_modules/prop-types/checkPropTypes.js");
|
|
|
|
|
|
var printWarning = function() {};
|
|
|
|
|
|
if (true) {
|
|
|
printWarning = function(text) {
|
|
|
var message = 'Warning: ' + text;
|
|
|
if (typeof console !== 'undefined') {
|
|
|
console.error(message);
|
|
|
}
|
|
|
try {
|
|
|
// --- Welcome to debugging React ---
|
|
|
// This error was thrown as a convenience so that you can use this stack
|
|
|
// to find the callsite that caused this warning to fire.
|
|
|
throw new Error(message);
|
|
|
} catch (x) {}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function emptyFunctionThatReturnsNull() {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
module.exports = function(isValidElement, throwOnDirectAccess) {
|
|
|
/* global Symbol */
|
|
|
var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
|
|
|
var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
|
|
|
|
|
|
/**
|
|
|
* Returns the iterator method function contained on the iterable object.
|
|
|
*
|
|
|
* Be sure to invoke the function with the iterable as context:
|
|
|
*
|
|
|
* var iteratorFn = getIteratorFn(myIterable);
|
|
|
* if (iteratorFn) {
|
|
|
* var iterator = iteratorFn.call(myIterable);
|
|
|
* ...
|
|
|
* }
|
|
|
*
|
|
|
* @param {?object} maybeIterable
|
|
|
* @return {?function}
|
|
|
*/
|
|
|
function getIteratorFn(maybeIterable) {
|
|
|
var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
|
|
|
if (typeof iteratorFn === 'function') {
|
|
|
return iteratorFn;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Collection of methods that allow declaration and validation of props that are
|
|
|
* supplied to React components. Example usage:
|
|
|
*
|
|
|
* var Props = require('ReactPropTypes');
|
|
|
* var MyArticle = React.createClass({
|
|
|
* propTypes: {
|
|
|
* // An optional string prop named "description".
|
|
|
* description: Props.string,
|
|
|
*
|
|
|
* // A required enum prop named "category".
|
|
|
* category: Props.oneOf(['News','Photos']).isRequired,
|
|
|
*
|
|
|
* // A prop named "dialog" that requires an instance of Dialog.
|
|
|
* dialog: Props.instanceOf(Dialog).isRequired
|
|
|
* },
|
|
|
* render: function() { ... }
|
|
|
* });
|
|
|
*
|
|
|
* A more formal specification of how these methods are used:
|
|
|
*
|
|
|
* type := array|bool|func|object|number|string|oneOf([...])|instanceOf(...)
|
|
|
* decl := ReactPropTypes.{type}(.isRequired)?
|
|
|
*
|
|
|
* Each and every declaration produces a function with the same signature. This
|
|
|
* allows the creation of custom validation functions. For example:
|
|
|
*
|
|
|
* var MyLink = React.createClass({
|
|
|
* propTypes: {
|
|
|
* // An optional string or URI prop named "href".
|
|
|
* href: function(props, propName, componentName) {
|
|
|
* var propValue = props[propName];
|
|
|
* if (propValue != null && typeof propValue !== 'string' &&
|
|
|
* !(propValue instanceof URI)) {
|
|
|
* return new Error(
|
|
|
* 'Expected a string or an URI for ' + propName + ' in ' +
|
|
|
* componentName
|
|
|
* );
|
|
|
* }
|
|
|
* }
|
|
|
* },
|
|
|
* render: function() {...}
|
|
|
* });
|
|
|
*
|
|
|
* @internal
|
|
|
*/
|
|
|
|
|
|
var ANONYMOUS = '<<anonymous>>';
|
|
|
|
|
|
// Important!
|
|
|
// Keep this list in sync with production version in `./factoryWithThrowingShims.js`.
|
|
|
var ReactPropTypes = {
|
|
|
array: createPrimitiveTypeChecker('array'),
|
|
|
bigint: createPrimitiveTypeChecker('bigint'),
|
|
|
bool: createPrimitiveTypeChecker('boolean'),
|
|
|
func: createPrimitiveTypeChecker('function'),
|
|
|
number: createPrimitiveTypeChecker('number'),
|
|
|
object: createPrimitiveTypeChecker('object'),
|
|
|
string: createPrimitiveTypeChecker('string'),
|
|
|
symbol: createPrimitiveTypeChecker('symbol'),
|
|
|
|
|
|
any: createAnyTypeChecker(),
|
|
|
arrayOf: createArrayOfTypeChecker,
|
|
|
element: createElementTypeChecker(),
|
|
|
elementType: createElementTypeTypeChecker(),
|
|
|
instanceOf: createInstanceTypeChecker,
|
|
|
node: createNodeChecker(),
|
|
|
objectOf: createObjectOfTypeChecker,
|
|
|
oneOf: createEnumTypeChecker,
|
|
|
oneOfType: createUnionTypeChecker,
|
|
|
shape: createShapeTypeChecker,
|
|
|
exact: createStrictShapeTypeChecker,
|
|
|
};
|
|
|
|
|
|
/**
|
|
|
* inlined Object.is polyfill to avoid requiring consumers ship their own
|
|
|
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
|
|
|
*/
|
|
|
/*eslint-disable no-self-compare*/
|
|
|
function is(x, y) {
|
|
|
// SameValue algorithm
|
|
|
if (x === y) {
|
|
|
// Steps 1-5, 7-10
|
|
|
// Steps 6.b-6.e: +0 != -0
|
|
|
return x !== 0 || 1 / x === 1 / y;
|
|
|
} else {
|
|
|
// Step 6.a: NaN == NaN
|
|
|
return x !== x && y !== y;
|
|
|
}
|
|
|
}
|
|
|
/*eslint-enable no-self-compare*/
|
|
|
|
|
|
/**
|
|
|
* We use an Error-like object for backward compatibility as people may call
|
|
|
* PropTypes directly and inspect their output. However, we don't use real
|
|
|
* Errors anymore. We don't inspect their stack anyway, and creating them
|
|
|
* is prohibitively expensive if they are created too often, such as what
|
|
|
* happens in oneOfType() for any type before the one that matched.
|
|
|
*/
|
|
|
function PropTypeError(message, data) {
|
|
|
this.message = message;
|
|
|
this.data = data && typeof data === 'object' ? data: {};
|
|
|
this.stack = '';
|
|
|
}
|
|
|
// Make `instanceof Error` still work for returned errors.
|
|
|
PropTypeError.prototype = Error.prototype;
|
|
|
|
|
|
function createChainableTypeChecker(validate) {
|
|
|
if (true) {
|
|
|
var manualPropTypeCallCache = {};
|
|
|
var manualPropTypeWarningCount = 0;
|
|
|
}
|
|
|
function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
|
|
|
componentName = componentName || ANONYMOUS;
|
|
|
propFullName = propFullName || propName;
|
|
|
|
|
|
if (secret !== ReactPropTypesSecret) {
|
|
|
if (throwOnDirectAccess) {
|
|
|
// New behavior only for users of `prop-types` package
|
|
|
var err = new Error(
|
|
|
'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
|
|
|
'Use `PropTypes.checkPropTypes()` to call them. ' +
|
|
|
'Read more at http://fb.me/use-check-prop-types'
|
|
|
);
|
|
|
err.name = 'Invariant Violation';
|
|
|
throw err;
|
|
|
} else if ( true && typeof console !== 'undefined') {
|
|
|
// Old behavior for people using React.PropTypes
|
|
|
var cacheKey = componentName + ':' + propName;
|
|
|
if (
|
|
|
!manualPropTypeCallCache[cacheKey] &&
|
|
|
// Avoid spamming the console because they are often not actionable except for lib authors
|
|
|
manualPropTypeWarningCount < 3
|
|
|
) {
|
|
|
printWarning(
|
|
|
'You are manually calling a React.PropTypes validation ' +
|
|
|
'function for the `' + propFullName + '` prop on `' + componentName + '`. This is deprecated ' +
|
|
|
'and will throw in the standalone `prop-types` package. ' +
|
|
|
'You may be seeing this warning due to a third-party PropTypes ' +
|
|
|
'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.'
|
|
|
);
|
|
|
manualPropTypeCallCache[cacheKey] = true;
|
|
|
manualPropTypeWarningCount++;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
if (props[propName] == null) {
|
|
|
if (isRequired) {
|
|
|
if (props[propName] === null) {
|
|
|
return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));
|
|
|
}
|
|
|
return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));
|
|
|
}
|
|
|
return null;
|
|
|
} else {
|
|
|
return validate(props, propName, componentName, location, propFullName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var chainedCheckType = checkType.bind(null, false);
|
|
|
chainedCheckType.isRequired = checkType.bind(null, true);
|
|
|
|
|
|
return chainedCheckType;
|
|
|
}
|
|
|
|
|
|
function createPrimitiveTypeChecker(expectedType) {
|
|
|
function validate(props, propName, componentName, location, propFullName, secret) {
|
|
|
var propValue = props[propName];
|
|
|
var propType = getPropType(propValue);
|
|
|
if (propType !== expectedType) {
|
|
|
// `propValue` being instance of, say, date/regexp, pass the 'object'
|
|
|
// check, but we can offer a more precise error message here rather than
|
|
|
// 'of type `object`'.
|
|
|
var preciseType = getPreciseType(propValue);
|
|
|
|
|
|
return new PropTypeError(
|
|
|
'Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'),
|
|
|
{expectedType: expectedType}
|
|
|
);
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createAnyTypeChecker() {
|
|
|
return createChainableTypeChecker(emptyFunctionThatReturnsNull);
|
|
|
}
|
|
|
|
|
|
function createArrayOfTypeChecker(typeChecker) {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
if (typeof typeChecker !== 'function') {
|
|
|
return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');
|
|
|
}
|
|
|
var propValue = props[propName];
|
|
|
if (!Array.isArray(propValue)) {
|
|
|
var propType = getPropType(propValue);
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
|
|
|
}
|
|
|
for (var i = 0; i < propValue.length; i++) {
|
|
|
var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret);
|
|
|
if (error instanceof Error) {
|
|
|
return error;
|
|
|
}
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createElementTypeChecker() {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
var propValue = props[propName];
|
|
|
if (!isValidElement(propValue)) {
|
|
|
var propType = getPropType(propValue);
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createElementTypeTypeChecker() {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
var propValue = props[propName];
|
|
|
if (!ReactIs.isValidElementType(propValue)) {
|
|
|
var propType = getPropType(propValue);
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement type.'));
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createInstanceTypeChecker(expectedClass) {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
if (!(props[propName] instanceof expectedClass)) {
|
|
|
var expectedClassName = expectedClass.name || ANONYMOUS;
|
|
|
var actualClassName = getClassName(props[propName]);
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createEnumTypeChecker(expectedValues) {
|
|
|
if (!Array.isArray(expectedValues)) {
|
|
|
if (true) {
|
|
|
if (arguments.length > 1) {
|
|
|
printWarning(
|
|
|
'Invalid arguments supplied to oneOf, expected an array, got ' + arguments.length + ' arguments. ' +
|
|
|
'A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z]).'
|
|
|
);
|
|
|
} else {
|
|
|
printWarning('Invalid argument supplied to oneOf, expected an array.');
|
|
|
}
|
|
|
}
|
|
|
return emptyFunctionThatReturnsNull;
|
|
|
}
|
|
|
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
var propValue = props[propName];
|
|
|
for (var i = 0; i < expectedValues.length; i++) {
|
|
|
if (is(propValue, expectedValues[i])) {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var valuesString = JSON.stringify(expectedValues, function replacer(key, value) {
|
|
|
var type = getPreciseType(value);
|
|
|
if (type === 'symbol') {
|
|
|
return String(value);
|
|
|
}
|
|
|
return value;
|
|
|
});
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + String(propValue) + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createObjectOfTypeChecker(typeChecker) {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
if (typeof typeChecker !== 'function') {
|
|
|
return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');
|
|
|
}
|
|
|
var propValue = props[propName];
|
|
|
var propType = getPropType(propValue);
|
|
|
if (propType !== 'object') {
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
|
|
|
}
|
|
|
for (var key in propValue) {
|
|
|
if (has(propValue, key)) {
|
|
|
var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret);
|
|
|
if (error instanceof Error) {
|
|
|
return error;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createUnionTypeChecker(arrayOfTypeCheckers) {
|
|
|
if (!Array.isArray(arrayOfTypeCheckers)) {
|
|
|
true ? printWarning('Invalid argument supplied to oneOfType, expected an instance of array.') : 0;
|
|
|
return emptyFunctionThatReturnsNull;
|
|
|
}
|
|
|
|
|
|
for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
|
|
|
var checker = arrayOfTypeCheckers[i];
|
|
|
if (typeof checker !== 'function') {
|
|
|
printWarning(
|
|
|
'Invalid argument supplied to oneOfType. Expected an array of check functions, but ' +
|
|
|
'received ' + getPostfixForTypeWarning(checker) + ' at index ' + i + '.'
|
|
|
);
|
|
|
return emptyFunctionThatReturnsNull;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
var expectedTypes = [];
|
|
|
for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
|
|
|
var checker = arrayOfTypeCheckers[i];
|
|
|
var checkerResult = checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret);
|
|
|
if (checkerResult == null) {
|
|
|
return null;
|
|
|
}
|
|
|
if (checkerResult.data && has(checkerResult.data, 'expectedType')) {
|
|
|
expectedTypes.push(checkerResult.data.expectedType);
|
|
|
}
|
|
|
}
|
|
|
var expectedTypesMessage = (expectedTypes.length > 0) ? ', expected one of type [' + expectedTypes.join(', ') + ']': '';
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`' + expectedTypesMessage + '.'));
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createNodeChecker() {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
if (!isNode(props[propName])) {
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function invalidValidatorError(componentName, location, propFullName, key, type) {
|
|
|
return new PropTypeError(
|
|
|
(componentName || 'React class') + ': ' + location + ' type `' + propFullName + '.' + key + '` is invalid; ' +
|
|
|
'it must be a function, usually from the `prop-types` package, but received `' + type + '`.'
|
|
|
);
|
|
|
}
|
|
|
|
|
|
function createShapeTypeChecker(shapeTypes) {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
var propValue = props[propName];
|
|
|
var propType = getPropType(propValue);
|
|
|
if (propType !== 'object') {
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
|
|
|
}
|
|
|
for (var key in shapeTypes) {
|
|
|
var checker = shapeTypes[key];
|
|
|
if (typeof checker !== 'function') {
|
|
|
return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
|
|
|
}
|
|
|
var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret);
|
|
|
if (error) {
|
|
|
return error;
|
|
|
}
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function createStrictShapeTypeChecker(shapeTypes) {
|
|
|
function validate(props, propName, componentName, location, propFullName) {
|
|
|
var propValue = props[propName];
|
|
|
var propType = getPropType(propValue);
|
|
|
if (propType !== 'object') {
|
|
|
return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
|
|
|
}
|
|
|
// We need to check all keys in case some are required but missing from props.
|
|
|
var allKeys = assign({}, props[propName], shapeTypes);
|
|
|
for (var key in allKeys) {
|
|
|
var checker = shapeTypes[key];
|
|
|
if (has(shapeTypes, key) && typeof checker !== 'function') {
|
|
|
return invalidValidatorError(componentName, location, propFullName, key, getPreciseType(checker));
|
|
|
}
|
|
|
if (!checker) {
|
|
|
return new PropTypeError(
|
|
|
'Invalid ' + location + ' `' + propFullName + '` key `' + key + '` supplied to `' + componentName + '`.' +
|
|
|
'\nBad object: ' + JSON.stringify(props[propName], null, ' ') +
|
|
|
'\nValid keys: ' + JSON.stringify(Object.keys(shapeTypes), null, ' ')
|
|
|
);
|
|
|
}
|
|
|
var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret);
|
|
|
if (error) {
|
|
|
return error;
|
|
|
}
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return createChainableTypeChecker(validate);
|
|
|
}
|
|
|
|
|
|
function isNode(propValue) {
|
|
|
switch (typeof propValue) {
|
|
|
case 'number':
|
|
|
case 'string':
|
|
|
case 'undefined':
|
|
|
return true;
|
|
|
case 'boolean':
|
|
|
return !propValue;
|
|
|
case 'object':
|
|
|
if (Array.isArray(propValue)) {
|
|
|
return propValue.every(isNode);
|
|
|
}
|
|
|
if (propValue === null || isValidElement(propValue)) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
var iteratorFn = getIteratorFn(propValue);
|
|
|
if (iteratorFn) {
|
|
|
var iterator = iteratorFn.call(propValue);
|
|
|
var step;
|
|
|
if (iteratorFn !== propValue.entries) {
|
|
|
while (!(step = iterator.next()).done) {
|
|
|
if (!isNode(step.value)) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
// Iterator will provide entry [k,v] tuples rather than values.
|
|
|
while (!(step = iterator.next()).done) {
|
|
|
var entry = step.value;
|
|
|
if (entry) {
|
|
|
if (!isNode(entry[1])) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isSymbol(propType, propValue) {
|
|
|
// Native Symbol.
|
|
|
if (propType === 'symbol') {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
// falsy value can't be a Symbol
|
|
|
if (!propValue) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
|
|
|
if (propValue['@@toStringTag'] === 'Symbol') {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
// Fallback for non-spec compliant Symbols which are polyfilled.
|
|
|
if (typeof Symbol === 'function' && propValue instanceof Symbol) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// Equivalent of `typeof` but with special handling for array and regexp.
|
|
|
function getPropType(propValue) {
|
|
|
var propType = typeof propValue;
|
|
|
if (Array.isArray(propValue)) {
|
|
|
return 'array';
|
|
|
}
|
|
|
if (propValue instanceof RegExp) {
|
|
|
// Old webkits (at least until Android 4.0) return 'function' rather than
|
|
|
// 'object' for typeof a RegExp. We'll normalize this here so that /bla/
|
|
|
// passes PropTypes.object.
|
|
|
return 'object';
|
|
|
}
|
|
|
if (isSymbol(propType, propValue)) {
|
|
|
return 'symbol';
|
|
|
}
|
|
|
return propType;
|
|
|
}
|
|
|
|
|
|
// This handles more types than `getPropType`. Only used for error messages.
|
|
|
// See `createPrimitiveTypeChecker`.
|
|
|
function getPreciseType(propValue) {
|
|
|
if (typeof propValue === 'undefined' || propValue === null) {
|
|
|
return '' + propValue;
|
|
|
}
|
|
|
var propType = getPropType(propValue);
|
|
|
if (propType === 'object') {
|
|
|
if (propValue instanceof Date) {
|
|
|
return 'date';
|
|
|
} else if (propValue instanceof RegExp) {
|
|
|
return 'regexp';
|
|
|
}
|
|
|
}
|
|
|
return propType;
|
|
|
}
|
|
|
|
|
|
// Returns a string that is postfixed to a warning about an invalid type.
|
|
|
// For example, "undefined" or "of type array"
|
|
|
function getPostfixForTypeWarning(value) {
|
|
|
var type = getPreciseType(value);
|
|
|
switch (type) {
|
|
|
case 'array':
|
|
|
case 'object':
|
|
|
return 'an ' + type;
|
|
|
case 'boolean':
|
|
|
case 'date':
|
|
|
case 'regexp':
|
|
|
return 'a ' + type;
|
|
|
default:
|
|
|
return type;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// Returns class name of the object, if any.
|
|
|
function getClassName(propValue) {
|
|
|
if (!propValue.constructor || !propValue.constructor.name) {
|
|
|
return ANONYMOUS;
|
|
|
}
|
|
|
return propValue.constructor.name;
|
|
|
}
|
|
|
|
|
|
ReactPropTypes.checkPropTypes = checkPropTypes;
|
|
|
ReactPropTypes.resetWarningCache = checkPropTypes.resetWarningCache;
|
|
|
ReactPropTypes.PropTypes = ReactPropTypes;
|
|
|
|
|
|
return ReactPropTypes;
|
|
|
};
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/prop-types/index.js":
|
|
|
/*!******************************************!*\
|
|
|
!*** ./node_modules/prop-types/index.js ***!
|
|
|
\******************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
/**
|
|
|
* 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.
|
|
|
*/
|
|
|
|
|
|
if (true) {
|
|
|
var ReactIs = __webpack_require__(/*! react-is */ "./node_modules/react-is/index.js");
|
|
|
|
|
|
// By explicitly using `prop-types` you are opting into new development behavior.
|
|
|
// http://fb.me/prop-types-in-prod
|
|
|
var throwOnDirectAccess = true;
|
|
|
module.exports = __webpack_require__(/*! ./factoryWithTypeCheckers */ "./node_modules/prop-types/factoryWithTypeCheckers.js")(ReactIs.isElement, throwOnDirectAccess);
|
|
|
} else {}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/prop-types/lib/ReactPropTypesSecret.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/prop-types/lib/ReactPropTypesSecret.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"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.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
|
|
|
|
|
|
module.exports = ReactPropTypesSecret;
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/prop-types/lib/has.js":
|
|
|
/*!********************************************!*\
|
|
|
!*** ./node_modules/prop-types/lib/has.js ***!
|
|
|
\********************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
module.exports = Function.call.bind(Object.prototype.hasOwnProperty);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/Field.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/Field.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* 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_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_5__ = __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_6__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @babel/runtime/helpers/esm/assertThisInitialized */ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @babel/runtime/helpers/esm/inherits */ "./node_modules/@babel/runtime/helpers/esm/inherits.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createSuper */ "./node_modules/@babel/runtime/helpers/esm/createSuper.js");
|
|
|
/* harmony import */ var rc_util_es_Children_toArray__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! rc-util/es/Children/toArray */ "./node_modules/rc-util/es/Children/toArray.js");
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_12___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_12__);
|
|
|
/* harmony import */ var _FieldContext__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./FieldContext */ "./node_modules/rc-field-form/es/FieldContext.js");
|
|
|
/* harmony import */ var _utils_typeUtil__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./utils/typeUtil */ "./node_modules/rc-field-form/es/utils/typeUtil.js");
|
|
|
/* harmony import */ var _utils_validateUtil__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./utils/validateUtil */ "./node_modules/rc-field-form/es/utils/validateUtil.js");
|
|
|
/* harmony import */ var _utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./utils/valueUtil */ "./node_modules/rc-field-form/es/utils/valueUtil.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var _excluded = ["name"];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var EMPTY_ERRORS = [];
|
|
|
function requireUpdate(shouldUpdate, prev, next, prevValue, nextValue, info) {
|
|
|
if (typeof shouldUpdate === 'function') {
|
|
|
return shouldUpdate(prev, next, 'source' in info ? {
|
|
|
source: info.source
|
|
|
} : {});
|
|
|
}
|
|
|
return prevValue !== nextValue;
|
|
|
}
|
|
|
// We use Class instead of Hooks here since it will cost much code by using Hooks.
|
|
|
var Field = /*#__PURE__*/function (_React$Component) {
|
|
|
(0,_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_8__["default"])(Field, _React$Component);
|
|
|
var _super = (0,_babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_9__["default"])(Field);
|
|
|
/**
|
|
|
* Follow state should not management in State since it will async update by React.
|
|
|
* This makes first render of form can not get correct state value.
|
|
|
*/
|
|
|
|
|
|
/**
|
|
|
* Mark when touched & validated. Currently only used for `dependencies`.
|
|
|
* Note that we do not think field with `initialValue` is dirty
|
|
|
* but this will be by `isFieldDirty` func.
|
|
|
*/
|
|
|
|
|
|
// ============================== Subscriptions ==============================
|
|
|
function Field(props) {
|
|
|
var _this;
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_5__["default"])(this, Field);
|
|
|
_this = _super.call(this, props);
|
|
|
// Register on init
|
|
|
_this.state = {
|
|
|
resetCount: 0
|
|
|
};
|
|
|
_this.cancelRegisterFunc = null;
|
|
|
_this.mounted = false;
|
|
|
_this.touched = false;
|
|
|
_this.dirty = false;
|
|
|
_this.validatePromise = void 0;
|
|
|
_this.prevValidating = void 0;
|
|
|
_this.errors = EMPTY_ERRORS;
|
|
|
_this.warnings = EMPTY_ERRORS;
|
|
|
_this.cancelRegister = function () {
|
|
|
var _this$props = _this.props,
|
|
|
preserve = _this$props.preserve,
|
|
|
isListField = _this$props.isListField,
|
|
|
name = _this$props.name;
|
|
|
if (_this.cancelRegisterFunc) {
|
|
|
_this.cancelRegisterFunc(isListField, preserve, (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.getNamePath)(name));
|
|
|
}
|
|
|
_this.cancelRegisterFunc = null;
|
|
|
};
|
|
|
_this.getNamePath = function () {
|
|
|
var _this$props2 = _this.props,
|
|
|
name = _this$props2.name,
|
|
|
fieldContext = _this$props2.fieldContext;
|
|
|
var _fieldContext$prefixN = fieldContext.prefixName,
|
|
|
prefixName = _fieldContext$prefixN === void 0 ? [] : _fieldContext$prefixN;
|
|
|
return name !== undefined ? [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(prefixName), (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(name)) : [];
|
|
|
};
|
|
|
_this.getRules = function () {
|
|
|
var _this$props3 = _this.props,
|
|
|
_this$props3$rules = _this$props3.rules,
|
|
|
rules = _this$props3$rules === void 0 ? [] : _this$props3$rules,
|
|
|
fieldContext = _this$props3.fieldContext;
|
|
|
return rules.map(function (rule) {
|
|
|
if (typeof rule === 'function') {
|
|
|
return rule(fieldContext);
|
|
|
}
|
|
|
return rule;
|
|
|
});
|
|
|
};
|
|
|
_this.refresh = function () {
|
|
|
if (!_this.mounted) return;
|
|
|
/**
|
|
|
* Clean up current node.
|
|
|
*/
|
|
|
_this.setState(function (_ref) {
|
|
|
var resetCount = _ref.resetCount;
|
|
|
return {
|
|
|
resetCount: resetCount + 1
|
|
|
};
|
|
|
});
|
|
|
};
|
|
|
_this.triggerMetaEvent = function (destroy) {
|
|
|
var onMetaChange = _this.props.onMetaChange;
|
|
|
onMetaChange === null || onMetaChange === void 0 ? void 0 : onMetaChange((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, _this.getMeta()), {}, {
|
|
|
destroy: destroy
|
|
|
}));
|
|
|
};
|
|
|
_this.onStoreChange = function (prevStore, namePathList, info) {
|
|
|
var _this$props4 = _this.props,
|
|
|
shouldUpdate = _this$props4.shouldUpdate,
|
|
|
_this$props4$dependen = _this$props4.dependencies,
|
|
|
dependencies = _this$props4$dependen === void 0 ? [] : _this$props4$dependen,
|
|
|
onReset = _this$props4.onReset;
|
|
|
var store = info.store;
|
|
|
var namePath = _this.getNamePath();
|
|
|
var prevValue = _this.getValue(prevStore);
|
|
|
var curValue = _this.getValue(store);
|
|
|
var namePathMatch = namePathList && (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.containsNamePath)(namePathList, namePath);
|
|
|
// `setFieldsValue` is a quick access to update related status
|
|
|
if (info.type === 'valueUpdate' && info.source === 'external' && prevValue !== curValue) {
|
|
|
_this.touched = true;
|
|
|
_this.dirty = true;
|
|
|
_this.validatePromise = null;
|
|
|
_this.errors = EMPTY_ERRORS;
|
|
|
_this.warnings = EMPTY_ERRORS;
|
|
|
_this.triggerMetaEvent();
|
|
|
}
|
|
|
switch (info.type) {
|
|
|
case 'reset':
|
|
|
if (!namePathList || namePathMatch) {
|
|
|
// Clean up state
|
|
|
_this.touched = false;
|
|
|
_this.dirty = false;
|
|
|
_this.validatePromise = null;
|
|
|
_this.errors = EMPTY_ERRORS;
|
|
|
_this.warnings = EMPTY_ERRORS;
|
|
|
_this.triggerMetaEvent();
|
|
|
onReset === null || onReset === void 0 ? void 0 : onReset();
|
|
|
_this.refresh();
|
|
|
return;
|
|
|
}
|
|
|
break;
|
|
|
/**
|
|
|
* In case field with `preserve = false` nest deps like:
|
|
|
* - A = 1 => show B
|
|
|
* - B = 1 => show C
|
|
|
* - Reset A, need clean B, C
|
|
|
*/
|
|
|
case 'remove':
|
|
|
{
|
|
|
if (shouldUpdate) {
|
|
|
_this.reRender();
|
|
|
return;
|
|
|
}
|
|
|
break;
|
|
|
}
|
|
|
case 'setField':
|
|
|
{
|
|
|
if (namePathMatch) {
|
|
|
var data = info.data;
|
|
|
if ('touched' in data) {
|
|
|
_this.touched = data.touched;
|
|
|
}
|
|
|
if ('validating' in data && !('originRCField' in data)) {
|
|
|
_this.validatePromise = data.validating ? Promise.resolve([]) : null;
|
|
|
}
|
|
|
if ('errors' in data) {
|
|
|
_this.errors = data.errors || EMPTY_ERRORS;
|
|
|
}
|
|
|
if ('warnings' in data) {
|
|
|
_this.warnings = data.warnings || EMPTY_ERRORS;
|
|
|
}
|
|
|
_this.dirty = true;
|
|
|
_this.triggerMetaEvent();
|
|
|
_this.reRender();
|
|
|
return;
|
|
|
}
|
|
|
// Handle update by `setField` with `shouldUpdate`
|
|
|
if (shouldUpdate && !namePath.length && requireUpdate(shouldUpdate, prevStore, store, prevValue, curValue, info)) {
|
|
|
_this.reRender();
|
|
|
return;
|
|
|
}
|
|
|
break;
|
|
|
}
|
|
|
case 'dependenciesUpdate':
|
|
|
{
|
|
|
/**
|
|
|
* Trigger when marked `dependencies` updated. Related fields will all update
|
|
|
*/
|
|
|
var dependencyList = dependencies.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.getNamePath);
|
|
|
// No need for `namePathMath` check and `shouldUpdate` check, since `valueUpdate` will be
|
|
|
// emitted earlier and they will work there
|
|
|
// If set it may cause unnecessary twice rerendering
|
|
|
if (dependencyList.some(function (dependency) {
|
|
|
return (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.containsNamePath)(info.relatedFields, dependency);
|
|
|
})) {
|
|
|
_this.reRender();
|
|
|
return;
|
|
|
}
|
|
|
break;
|
|
|
}
|
|
|
default:
|
|
|
// 1. If `namePath` exists in `namePathList`, means it's related value and should update
|
|
|
// For example <List name="list"><Field name={['list', 0]}></List>
|
|
|
// If `namePathList` is [['list']] (List value update), Field should be updated
|
|
|
// If `namePathList` is [['list', 0]] (Field value update), List shouldn't be updated
|
|
|
// 2.
|
|
|
// 2.1 If `dependencies` is set, `name` is not set and `shouldUpdate` is not set,
|
|
|
// don't use `shouldUpdate`. `dependencies` is view as a shortcut if `shouldUpdate`
|
|
|
// is not provided
|
|
|
// 2.2 If `shouldUpdate` provided, use customize logic to update the field
|
|
|
// else to check if value changed
|
|
|
if (namePathMatch || (!dependencies.length || namePath.length || shouldUpdate) && requireUpdate(shouldUpdate, prevStore, store, prevValue, curValue, info)) {
|
|
|
_this.reRender();
|
|
|
return;
|
|
|
}
|
|
|
break;
|
|
|
}
|
|
|
if (shouldUpdate === true) {
|
|
|
_this.reRender();
|
|
|
}
|
|
|
};
|
|
|
_this.validateRules = function (options) {
|
|
|
// We should fixed namePath & value to avoid developer change then by form function
|
|
|
var namePath = _this.getNamePath();
|
|
|
var currentValue = _this.getValue();
|
|
|
// Force change to async to avoid rule OOD under renderProps field
|
|
|
var rootPromise = Promise.resolve().then(function () {
|
|
|
if (!_this.mounted) {
|
|
|
return [];
|
|
|
}
|
|
|
var _this$props5 = _this.props,
|
|
|
_this$props5$validate = _this$props5.validateFirst,
|
|
|
validateFirst = _this$props5$validate === void 0 ? false : _this$props5$validate,
|
|
|
messageVariables = _this$props5.messageVariables;
|
|
|
var _ref2 = options || {},
|
|
|
triggerName = _ref2.triggerName;
|
|
|
var filteredRules = _this.getRules();
|
|
|
if (triggerName) {
|
|
|
filteredRules = filteredRules.filter(function (rule) {
|
|
|
return rule;
|
|
|
}).filter(function (rule) {
|
|
|
var validateTrigger = rule.validateTrigger;
|
|
|
if (!validateTrigger) {
|
|
|
return true;
|
|
|
}
|
|
|
var triggerList = (0,_utils_typeUtil__WEBPACK_IMPORTED_MODULE_14__.toArray)(validateTrigger);
|
|
|
return triggerList.includes(triggerName);
|
|
|
});
|
|
|
}
|
|
|
var promise = (0,_utils_validateUtil__WEBPACK_IMPORTED_MODULE_15__.validateRules)(namePath, currentValue, filteredRules, options, validateFirst, messageVariables);
|
|
|
promise.catch(function (e) {
|
|
|
return e;
|
|
|
}).then(function () {
|
|
|
var ruleErrors = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : EMPTY_ERRORS;
|
|
|
if (_this.validatePromise === rootPromise) {
|
|
|
var _ruleErrors$forEach;
|
|
|
_this.validatePromise = null;
|
|
|
// Get errors & warnings
|
|
|
var nextErrors = [];
|
|
|
var nextWarnings = [];
|
|
|
(_ruleErrors$forEach = ruleErrors.forEach) === null || _ruleErrors$forEach === void 0 ? void 0 : _ruleErrors$forEach.call(ruleErrors, function (_ref3) {
|
|
|
var warningOnly = _ref3.rule.warningOnly,
|
|
|
_ref3$errors = _ref3.errors,
|
|
|
errors = _ref3$errors === void 0 ? EMPTY_ERRORS : _ref3$errors;
|
|
|
if (warningOnly) {
|
|
|
nextWarnings.push.apply(nextWarnings, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(errors));
|
|
|
} else {
|
|
|
nextErrors.push.apply(nextErrors, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_4__["default"])(errors));
|
|
|
}
|
|
|
});
|
|
|
_this.errors = nextErrors;
|
|
|
_this.warnings = nextWarnings;
|
|
|
_this.triggerMetaEvent();
|
|
|
_this.reRender();
|
|
|
}
|
|
|
});
|
|
|
return promise;
|
|
|
});
|
|
|
_this.validatePromise = rootPromise;
|
|
|
_this.dirty = true;
|
|
|
_this.errors = EMPTY_ERRORS;
|
|
|
_this.warnings = EMPTY_ERRORS;
|
|
|
_this.triggerMetaEvent();
|
|
|
// Force trigger re-render since we need sync renderProps with new meta
|
|
|
_this.reRender();
|
|
|
return rootPromise;
|
|
|
};
|
|
|
_this.isFieldValidating = function () {
|
|
|
return !!_this.validatePromise;
|
|
|
};
|
|
|
_this.isFieldTouched = function () {
|
|
|
return _this.touched;
|
|
|
};
|
|
|
_this.isFieldDirty = function () {
|
|
|
// Touched or validate or has initialValue
|
|
|
if (_this.dirty || _this.props.initialValue !== undefined) {
|
|
|
return true;
|
|
|
}
|
|
|
// Form set initialValue
|
|
|
var fieldContext = _this.props.fieldContext;
|
|
|
var _fieldContext$getInte = fieldContext.getInternalHooks(_FieldContext__WEBPACK_IMPORTED_MODULE_13__.HOOK_MARK),
|
|
|
getInitialValue = _fieldContext$getInte.getInitialValue;
|
|
|
if (getInitialValue(_this.getNamePath()) !== undefined) {
|
|
|
return true;
|
|
|
}
|
|
|
return false;
|
|
|
};
|
|
|
_this.getErrors = function () {
|
|
|
return _this.errors;
|
|
|
};
|
|
|
_this.getWarnings = function () {
|
|
|
return _this.warnings;
|
|
|
};
|
|
|
_this.isListField = function () {
|
|
|
return _this.props.isListField;
|
|
|
};
|
|
|
_this.isList = function () {
|
|
|
return _this.props.isList;
|
|
|
};
|
|
|
_this.isPreserve = function () {
|
|
|
return _this.props.preserve;
|
|
|
};
|
|
|
_this.getMeta = function () {
|
|
|
// Make error & validating in cache to save perf
|
|
|
_this.prevValidating = _this.isFieldValidating();
|
|
|
var meta = {
|
|
|
touched: _this.isFieldTouched(),
|
|
|
validating: _this.prevValidating,
|
|
|
errors: _this.errors,
|
|
|
warnings: _this.warnings,
|
|
|
name: _this.getNamePath(),
|
|
|
validated: _this.validatePromise === null
|
|
|
};
|
|
|
return meta;
|
|
|
};
|
|
|
_this.getOnlyChild = function (children) {
|
|
|
// Support render props
|
|
|
if (typeof children === 'function') {
|
|
|
var meta = _this.getMeta();
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, _this.getOnlyChild(children(_this.getControlled(), meta, _this.props.fieldContext))), {}, {
|
|
|
isFunction: true
|
|
|
});
|
|
|
}
|
|
|
// Filed element only
|
|
|
var childList = (0,rc_util_es_Children_toArray__WEBPACK_IMPORTED_MODULE_10__["default"])(children);
|
|
|
if (childList.length !== 1 || ! /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_12__.isValidElement(childList[0])) {
|
|
|
return {
|
|
|
child: childList,
|
|
|
isFunction: false
|
|
|
};
|
|
|
}
|
|
|
return {
|
|
|
child: childList[0],
|
|
|
isFunction: false
|
|
|
};
|
|
|
};
|
|
|
_this.getValue = function (store) {
|
|
|
var getFieldsValue = _this.props.fieldContext.getFieldsValue;
|
|
|
var namePath = _this.getNamePath();
|
|
|
return (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.getValue)(store || getFieldsValue(true), namePath);
|
|
|
};
|
|
|
_this.getControlled = function () {
|
|
|
var childProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
|
var _this$props6 = _this.props,
|
|
|
trigger = _this$props6.trigger,
|
|
|
validateTrigger = _this$props6.validateTrigger,
|
|
|
getValueFromEvent = _this$props6.getValueFromEvent,
|
|
|
normalize = _this$props6.normalize,
|
|
|
valuePropName = _this$props6.valuePropName,
|
|
|
getValueProps = _this$props6.getValueProps,
|
|
|
fieldContext = _this$props6.fieldContext;
|
|
|
var mergedValidateTrigger = validateTrigger !== undefined ? validateTrigger : fieldContext.validateTrigger;
|
|
|
var namePath = _this.getNamePath();
|
|
|
var getInternalHooks = fieldContext.getInternalHooks,
|
|
|
getFieldsValue = fieldContext.getFieldsValue;
|
|
|
var _getInternalHooks = getInternalHooks(_FieldContext__WEBPACK_IMPORTED_MODULE_13__.HOOK_MARK),
|
|
|
dispatch = _getInternalHooks.dispatch;
|
|
|
var value = _this.getValue();
|
|
|
var mergedGetValueProps = getValueProps || function (val) {
|
|
|
return (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_2__["default"])({}, valuePropName, val);
|
|
|
};
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
|
var originTriggerFunc = childProps[trigger];
|
|
|
var control = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, childProps), mergedGetValueProps(value));
|
|
|
// Add trigger
|
|
|
control[trigger] = function () {
|
|
|
// Mark as touched
|
|
|
_this.touched = true;
|
|
|
_this.dirty = true;
|
|
|
_this.triggerMetaEvent();
|
|
|
var newValue;
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
args[_key] = arguments[_key];
|
|
|
}
|
|
|
if (getValueFromEvent) {
|
|
|
newValue = getValueFromEvent.apply(void 0, args);
|
|
|
} else {
|
|
|
newValue = _utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.defaultGetValueFromEvent.apply(void 0, [valuePropName].concat(args));
|
|
|
}
|
|
|
if (normalize) {
|
|
|
newValue = normalize(newValue, value, getFieldsValue(true));
|
|
|
}
|
|
|
dispatch({
|
|
|
type: 'updateValue',
|
|
|
namePath: namePath,
|
|
|
value: newValue
|
|
|
});
|
|
|
if (originTriggerFunc) {
|
|
|
originTriggerFunc.apply(void 0, args);
|
|
|
}
|
|
|
};
|
|
|
// Add validateTrigger
|
|
|
var validateTriggerList = (0,_utils_typeUtil__WEBPACK_IMPORTED_MODULE_14__.toArray)(mergedValidateTrigger || []);
|
|
|
validateTriggerList.forEach(function (triggerName) {
|
|
|
// Wrap additional function of component, so that we can get latest value from store
|
|
|
var originTrigger = control[triggerName];
|
|
|
control[triggerName] = function () {
|
|
|
if (originTrigger) {
|
|
|
originTrigger.apply(void 0, arguments);
|
|
|
}
|
|
|
// Always use latest rules
|
|
|
var rules = _this.props.rules;
|
|
|
if (rules && rules.length) {
|
|
|
// We dispatch validate to root,
|
|
|
// since it will update related data with other field with same name
|
|
|
dispatch({
|
|
|
type: 'validateField',
|
|
|
namePath: namePath,
|
|
|
triggerName: triggerName
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
});
|
|
|
return control;
|
|
|
};
|
|
|
if (props.fieldContext) {
|
|
|
var getInternalHooks = props.fieldContext.getInternalHooks;
|
|
|
var _getInternalHooks2 = getInternalHooks(_FieldContext__WEBPACK_IMPORTED_MODULE_13__.HOOK_MARK),
|
|
|
initEntityValue = _getInternalHooks2.initEntityValue;
|
|
|
initEntityValue((0,_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_7__["default"])(_this));
|
|
|
}
|
|
|
return _this;
|
|
|
}
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_6__["default"])(Field, [{
|
|
|
key: "componentDidMount",
|
|
|
value: function componentDidMount() {
|
|
|
var _this$props7 = this.props,
|
|
|
shouldUpdate = _this$props7.shouldUpdate,
|
|
|
fieldContext = _this$props7.fieldContext;
|
|
|
this.mounted = true;
|
|
|
// Register on init
|
|
|
if (fieldContext) {
|
|
|
var getInternalHooks = fieldContext.getInternalHooks;
|
|
|
var _getInternalHooks3 = getInternalHooks(_FieldContext__WEBPACK_IMPORTED_MODULE_13__.HOOK_MARK),
|
|
|
registerField = _getInternalHooks3.registerField;
|
|
|
this.cancelRegisterFunc = registerField(this);
|
|
|
}
|
|
|
// One more render for component in case fields not ready
|
|
|
if (shouldUpdate === true) {
|
|
|
this.reRender();
|
|
|
}
|
|
|
}
|
|
|
}, {
|
|
|
key: "componentWillUnmount",
|
|
|
value: function componentWillUnmount() {
|
|
|
this.cancelRegister();
|
|
|
this.triggerMetaEvent(true);
|
|
|
this.mounted = false;
|
|
|
}
|
|
|
}, {
|
|
|
key: "reRender",
|
|
|
value: function reRender() {
|
|
|
if (!this.mounted) return;
|
|
|
this.forceUpdate();
|
|
|
}
|
|
|
}, {
|
|
|
key: "render",
|
|
|
value: function render() {
|
|
|
var resetCount = this.state.resetCount;
|
|
|
var children = this.props.children;
|
|
|
var _this$getOnlyChild = this.getOnlyChild(children),
|
|
|
child = _this$getOnlyChild.child,
|
|
|
isFunction = _this$getOnlyChild.isFunction;
|
|
|
// Not need to `cloneElement` since user can handle this in render function self
|
|
|
var returnChildNode;
|
|
|
if (isFunction) {
|
|
|
returnChildNode = child;
|
|
|
} else if ( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_12__.isValidElement(child)) {
|
|
|
returnChildNode = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_12__.cloneElement(child, this.getControlled(child.props));
|
|
|
} else {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_11__["default"])(!child, '`children` of Field is not validate ReactElement.');
|
|
|
returnChildNode = child;
|
|
|
}
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_12__.createElement(react__WEBPACK_IMPORTED_MODULE_12__.Fragment, {
|
|
|
key: resetCount
|
|
|
}, returnChildNode);
|
|
|
}
|
|
|
}]);
|
|
|
return Field;
|
|
|
}(react__WEBPACK_IMPORTED_MODULE_12__.Component);
|
|
|
Field.contextType = _FieldContext__WEBPACK_IMPORTED_MODULE_13__["default"];
|
|
|
Field.defaultProps = {
|
|
|
trigger: 'onChange',
|
|
|
valuePropName: 'value'
|
|
|
};
|
|
|
function WrapperField(_ref5) {
|
|
|
var name = _ref5.name,
|
|
|
restProps = (0,_babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref5, _excluded);
|
|
|
var fieldContext = react__WEBPACK_IMPORTED_MODULE_12__.useContext(_FieldContext__WEBPACK_IMPORTED_MODULE_13__["default"]);
|
|
|
var namePath = name !== undefined ? (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_16__.getNamePath)(name) : undefined;
|
|
|
var key = 'keep';
|
|
|
if (!restProps.isListField) {
|
|
|
key = "_".concat((namePath || []).join('_'));
|
|
|
}
|
|
|
// Warning if it's a directly list field.
|
|
|
// We can still support multiple level field preserve.
|
|
|
if ( true && restProps.preserve === false && restProps.isListField && namePath.length <= 1) {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_11__["default"])(false, '`preserve` should not apply on Form.List fields.');
|
|
|
}
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_12__.createElement(Field, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({
|
|
|
key: key,
|
|
|
name: namePath
|
|
|
}, restProps, {
|
|
|
fieldContext: fieldContext
|
|
|
}));
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (WrapperField);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/FieldContext.js":
|
|
|
/*!*******************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/FieldContext.js ***!
|
|
|
\*******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "HOOK_MARK": () => (/* binding */ HOOK_MARK),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
|
|
|
|
|
|
var HOOK_MARK = 'RC_FORM_INTERNAL_HOOKS';
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
|
var warningFunc = function warningFunc() {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_0__["default"])(false, 'Can not find FormContext. Please make sure you wrap Field under Form.');
|
|
|
};
|
|
|
var Context = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createContext({
|
|
|
getFieldValue: warningFunc,
|
|
|
getFieldsValue: warningFunc,
|
|
|
getFieldError: warningFunc,
|
|
|
getFieldWarning: warningFunc,
|
|
|
getFieldsError: warningFunc,
|
|
|
isFieldsTouched: warningFunc,
|
|
|
isFieldTouched: warningFunc,
|
|
|
isFieldValidating: warningFunc,
|
|
|
isFieldsValidating: warningFunc,
|
|
|
resetFields: warningFunc,
|
|
|
setFields: warningFunc,
|
|
|
setFieldValue: warningFunc,
|
|
|
setFieldsValue: warningFunc,
|
|
|
validateFields: warningFunc,
|
|
|
submit: warningFunc,
|
|
|
getInternalHooks: function getInternalHooks() {
|
|
|
warningFunc();
|
|
|
return {
|
|
|
dispatch: warningFunc,
|
|
|
initEntityValue: warningFunc,
|
|
|
registerField: warningFunc,
|
|
|
useSubscribe: warningFunc,
|
|
|
setInitialValues: warningFunc,
|
|
|
destroyForm: warningFunc,
|
|
|
setCallbacks: warningFunc,
|
|
|
registerWatch: warningFunc,
|
|
|
getFields: warningFunc,
|
|
|
setValidateMessages: warningFunc,
|
|
|
setPreserve: warningFunc,
|
|
|
getInitialValue: warningFunc
|
|
|
};
|
|
|
}
|
|
|
});
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Context);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/Form.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/Form.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* 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_objectSpread2__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
/* harmony import */ var _useForm__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./useForm */ "./node_modules/rc-field-form/es/useForm.js");
|
|
|
/* harmony import */ var _FieldContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./FieldContext */ "./node_modules/rc-field-form/es/FieldContext.js");
|
|
|
/* harmony import */ var _FormContext__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./FormContext */ "./node_modules/rc-field-form/es/FormContext.js");
|
|
|
/* harmony import */ var _utils_valueUtil__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./utils/valueUtil */ "./node_modules/rc-field-form/es/utils/valueUtil.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var _excluded = ["name", "initialValues", "fields", "form", "preserve", "children", "component", "validateMessages", "validateTrigger", "onValuesChange", "onFieldsChange", "onFinish", "onFinishFailed"];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var Form = function Form(_ref, ref) {
|
|
|
var name = _ref.name,
|
|
|
initialValues = _ref.initialValues,
|
|
|
fields = _ref.fields,
|
|
|
form = _ref.form,
|
|
|
preserve = _ref.preserve,
|
|
|
children = _ref.children,
|
|
|
_ref$component = _ref.component,
|
|
|
Component = _ref$component === void 0 ? 'form' : _ref$component,
|
|
|
validateMessages = _ref.validateMessages,
|
|
|
_ref$validateTrigger = _ref.validateTrigger,
|
|
|
validateTrigger = _ref$validateTrigger === void 0 ? 'onChange' : _ref$validateTrigger,
|
|
|
onValuesChange = _ref.onValuesChange,
|
|
|
_onFieldsChange = _ref.onFieldsChange,
|
|
|
_onFinish = _ref.onFinish,
|
|
|
onFinishFailed = _ref.onFinishFailed,
|
|
|
restProps = (0,_babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_3__["default"])(_ref, _excluded);
|
|
|
var formContext = react__WEBPACK_IMPORTED_MODULE_4__.useContext(_FormContext__WEBPACK_IMPORTED_MODULE_7__["default"]);
|
|
|
// We customize handle event since Context will makes all the consumer re-render:
|
|
|
// https://reactjs.org/docs/context.html#contextprovider
|
|
|
var _useForm = (0,_useForm__WEBPACK_IMPORTED_MODULE_5__["default"])(form),
|
|
|
_useForm2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useForm, 1),
|
|
|
formInstance = _useForm2[0];
|
|
|
var _formInstance$getInte = formInstance.getInternalHooks(_FieldContext__WEBPACK_IMPORTED_MODULE_6__.HOOK_MARK),
|
|
|
useSubscribe = _formInstance$getInte.useSubscribe,
|
|
|
setInitialValues = _formInstance$getInte.setInitialValues,
|
|
|
setCallbacks = _formInstance$getInte.setCallbacks,
|
|
|
setValidateMessages = _formInstance$getInte.setValidateMessages,
|
|
|
setPreserve = _formInstance$getInte.setPreserve,
|
|
|
destroyForm = _formInstance$getInte.destroyForm;
|
|
|
// Pass ref with form instance
|
|
|
react__WEBPACK_IMPORTED_MODULE_4__.useImperativeHandle(ref, function () {
|
|
|
return formInstance;
|
|
|
});
|
|
|
// Register form into Context
|
|
|
react__WEBPACK_IMPORTED_MODULE_4__.useEffect(function () {
|
|
|
formContext.registerForm(name, formInstance);
|
|
|
return function () {
|
|
|
formContext.unregisterForm(name);
|
|
|
};
|
|
|
}, [formContext, formInstance, name]);
|
|
|
// Pass props to store
|
|
|
setValidateMessages((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, formContext.validateMessages), validateMessages));
|
|
|
setCallbacks({
|
|
|
onValuesChange: onValuesChange,
|
|
|
onFieldsChange: function onFieldsChange(changedFields) {
|
|
|
formContext.triggerFormChange(name, changedFields);
|
|
|
if (_onFieldsChange) {
|
|
|
for (var _len = arguments.length, rest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
|
rest[_key - 1] = arguments[_key];
|
|
|
}
|
|
|
_onFieldsChange.apply(void 0, [changedFields].concat(rest));
|
|
|
}
|
|
|
},
|
|
|
onFinish: function onFinish(values) {
|
|
|
formContext.triggerFormFinish(name, values);
|
|
|
if (_onFinish) {
|
|
|
_onFinish(values);
|
|
|
}
|
|
|
},
|
|
|
onFinishFailed: onFinishFailed
|
|
|
});
|
|
|
setPreserve(preserve);
|
|
|
// Set initial value, init store value when first mount
|
|
|
var mountRef = react__WEBPACK_IMPORTED_MODULE_4__.useRef(null);
|
|
|
setInitialValues(initialValues, !mountRef.current);
|
|
|
if (!mountRef.current) {
|
|
|
mountRef.current = true;
|
|
|
}
|
|
|
react__WEBPACK_IMPORTED_MODULE_4__.useEffect(function () {
|
|
|
return destroyForm;
|
|
|
},
|
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
|
[]);
|
|
|
// Prepare children by `children` type
|
|
|
var childrenNode;
|
|
|
var childrenRenderProps = typeof children === 'function';
|
|
|
if (childrenRenderProps) {
|
|
|
var values = formInstance.getFieldsValue(true);
|
|
|
childrenNode = children(values, formInstance);
|
|
|
} else {
|
|
|
childrenNode = children;
|
|
|
}
|
|
|
// Not use subscribe when using render props
|
|
|
useSubscribe(!childrenRenderProps);
|
|
|
// Listen if fields provided. We use ref to save prev data here to avoid additional render
|
|
|
var prevFieldsRef = react__WEBPACK_IMPORTED_MODULE_4__.useRef();
|
|
|
react__WEBPACK_IMPORTED_MODULE_4__.useEffect(function () {
|
|
|
if (!(0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_8__.isSimilar)(prevFieldsRef.current || [], fields || [])) {
|
|
|
formInstance.setFields(fields || []);
|
|
|
}
|
|
|
prevFieldsRef.current = fields;
|
|
|
}, [fields, formInstance]);
|
|
|
var formContextValue = react__WEBPACK_IMPORTED_MODULE_4__.useMemo(function () {
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, formInstance), {}, {
|
|
|
validateTrigger: validateTrigger
|
|
|
});
|
|
|
}, [formInstance, validateTrigger]);
|
|
|
var wrapperNode = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.createElement(_FieldContext__WEBPACK_IMPORTED_MODULE_6__["default"].Provider, {
|
|
|
value: formContextValue
|
|
|
}, childrenNode);
|
|
|
if (Component === false) {
|
|
|
return wrapperNode;
|
|
|
}
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.createElement(Component, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, restProps, {
|
|
|
onSubmit: function onSubmit(event) {
|
|
|
event.preventDefault();
|
|
|
event.stopPropagation();
|
|
|
formInstance.submit();
|
|
|
},
|
|
|
onReset: function onReset(event) {
|
|
|
var _restProps$onReset;
|
|
|
event.preventDefault();
|
|
|
formInstance.resetFields();
|
|
|
(_restProps$onReset = restProps.onReset) === null || _restProps$onReset === void 0 ? void 0 : _restProps$onReset.call(restProps, event);
|
|
|
}
|
|
|
}), wrapperNode);
|
|
|
};
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Form);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/FormContext.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/FormContext.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "FormProvider": () => (/* binding */ FormProvider),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* 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");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
|
|
|
|
|
|
|
|
|
var FormContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createContext({
|
|
|
triggerFormChange: function triggerFormChange() {},
|
|
|
triggerFormFinish: function triggerFormFinish() {},
|
|
|
registerForm: function registerForm() {},
|
|
|
unregisterForm: function unregisterForm() {}
|
|
|
});
|
|
|
var FormProvider = function FormProvider(_ref) {
|
|
|
var validateMessages = _ref.validateMessages,
|
|
|
onFormChange = _ref.onFormChange,
|
|
|
onFormFinish = _ref.onFormFinish,
|
|
|
children = _ref.children;
|
|
|
var formContext = react__WEBPACK_IMPORTED_MODULE_2__.useContext(FormContext);
|
|
|
var formsRef = react__WEBPACK_IMPORTED_MODULE_2__.useRef({});
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(FormContext.Provider, {
|
|
|
value: (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, formContext), {}, {
|
|
|
validateMessages: (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, formContext.validateMessages), validateMessages),
|
|
|
// =========================================================
|
|
|
// = Global Form Control =
|
|
|
// =========================================================
|
|
|
triggerFormChange: function triggerFormChange(name, changedFields) {
|
|
|
if (onFormChange) {
|
|
|
onFormChange(name, {
|
|
|
changedFields: changedFields,
|
|
|
forms: formsRef.current
|
|
|
});
|
|
|
}
|
|
|
formContext.triggerFormChange(name, changedFields);
|
|
|
},
|
|
|
triggerFormFinish: function triggerFormFinish(name, values) {
|
|
|
if (onFormFinish) {
|
|
|
onFormFinish(name, {
|
|
|
values: values,
|
|
|
forms: formsRef.current
|
|
|
});
|
|
|
}
|
|
|
formContext.triggerFormFinish(name, values);
|
|
|
},
|
|
|
registerForm: function registerForm(name, form) {
|
|
|
if (name) {
|
|
|
formsRef.current = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, formsRef.current), {}, (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["default"])({}, name, form));
|
|
|
}
|
|
|
formContext.registerForm(name, form);
|
|
|
},
|
|
|
unregisterForm: function unregisterForm(name) {
|
|
|
var newForms = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, formsRef.current);
|
|
|
delete newForms[name];
|
|
|
formsRef.current = newForms;
|
|
|
formContext.unregisterForm(name);
|
|
|
}
|
|
|
})
|
|
|
}, children);
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (FormContext);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/List.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/List.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
/* harmony import */ var _FieldContext__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./FieldContext */ "./node_modules/rc-field-form/es/FieldContext.js");
|
|
|
/* harmony import */ var _Field__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./Field */ "./node_modules/rc-field-form/es/Field.js");
|
|
|
/* harmony import */ var _utils_valueUtil__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils/valueUtil */ "./node_modules/rc-field-form/es/utils/valueUtil.js");
|
|
|
/* harmony import */ var _ListContext__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ListContext */ "./node_modules/rc-field-form/es/ListContext.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var List = function List(_ref) {
|
|
|
var name = _ref.name,
|
|
|
initialValue = _ref.initialValue,
|
|
|
children = _ref.children,
|
|
|
rules = _ref.rules,
|
|
|
validateTrigger = _ref.validateTrigger;
|
|
|
var context = react__WEBPACK_IMPORTED_MODULE_2__.useContext(_FieldContext__WEBPACK_IMPORTED_MODULE_4__["default"]);
|
|
|
var keyRef = react__WEBPACK_IMPORTED_MODULE_2__.useRef({
|
|
|
keys: [],
|
|
|
id: 0
|
|
|
});
|
|
|
var keyManager = keyRef.current;
|
|
|
var prefixName = react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
var parentPrefixName = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_6__.getNamePath)(context.prefixName) || [];
|
|
|
return [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(parentPrefixName), (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_6__.getNamePath)(name)));
|
|
|
}, [context.prefixName, name]);
|
|
|
var fieldContext = react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, context), {}, {
|
|
|
prefixName: prefixName
|
|
|
});
|
|
|
}, [context, prefixName]);
|
|
|
// List context
|
|
|
var listContext = react__WEBPACK_IMPORTED_MODULE_2__.useMemo(function () {
|
|
|
return {
|
|
|
getKey: function getKey(namePath) {
|
|
|
var len = prefixName.length;
|
|
|
var pathName = namePath[len];
|
|
|
return [keyManager.keys[pathName], namePath.slice(len + 1)];
|
|
|
}
|
|
|
};
|
|
|
}, [prefixName]);
|
|
|
// User should not pass `children` as other type.
|
|
|
if (typeof children !== 'function') {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_3__["default"])(false, 'Form.List only accepts function as children.');
|
|
|
return null;
|
|
|
}
|
|
|
var shouldUpdate = function shouldUpdate(prevValue, nextValue, _ref2) {
|
|
|
var source = _ref2.source;
|
|
|
if (source === 'internal') {
|
|
|
return false;
|
|
|
}
|
|
|
return prevValue !== nextValue;
|
|
|
};
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(_ListContext__WEBPACK_IMPORTED_MODULE_7__["default"].Provider, {
|
|
|
value: listContext
|
|
|
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(_FieldContext__WEBPACK_IMPORTED_MODULE_4__["default"].Provider, {
|
|
|
value: fieldContext
|
|
|
}, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_2__.createElement(_Field__WEBPACK_IMPORTED_MODULE_5__["default"], {
|
|
|
name: [],
|
|
|
shouldUpdate: shouldUpdate,
|
|
|
rules: rules,
|
|
|
validateTrigger: validateTrigger,
|
|
|
initialValue: initialValue,
|
|
|
isList: true
|
|
|
}, function (_ref3, meta) {
|
|
|
var _ref3$value = _ref3.value,
|
|
|
value = _ref3$value === void 0 ? [] : _ref3$value,
|
|
|
onChange = _ref3.onChange;
|
|
|
var getFieldValue = context.getFieldValue;
|
|
|
var getNewValue = function getNewValue() {
|
|
|
var values = getFieldValue(prefixName || []);
|
|
|
return values || [];
|
|
|
};
|
|
|
/**
|
|
|
* Always get latest value in case user update fields by `form` api.
|
|
|
*/
|
|
|
var operations = {
|
|
|
add: function add(defaultValue, index) {
|
|
|
// Mapping keys
|
|
|
var newValue = getNewValue();
|
|
|
if (index >= 0 && index <= newValue.length) {
|
|
|
keyManager.keys = [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(keyManager.keys.slice(0, index)), [keyManager.id], (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(keyManager.keys.slice(index)));
|
|
|
onChange([].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(newValue.slice(0, index)), [defaultValue], (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(newValue.slice(index))));
|
|
|
} else {
|
|
|
if ( true && (index < 0 || index > newValue.length)) {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_3__["default"])(false, 'The second parameter of the add function should be a valid positive number.');
|
|
|
}
|
|
|
keyManager.keys = [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(keyManager.keys), [keyManager.id]);
|
|
|
onChange([].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(newValue), [defaultValue]));
|
|
|
}
|
|
|
keyManager.id += 1;
|
|
|
},
|
|
|
remove: function remove(index) {
|
|
|
var newValue = getNewValue();
|
|
|
var indexSet = new Set(Array.isArray(index) ? index : [index]);
|
|
|
if (indexSet.size <= 0) {
|
|
|
return;
|
|
|
}
|
|
|
keyManager.keys = keyManager.keys.filter(function (_, keysIndex) {
|
|
|
return !indexSet.has(keysIndex);
|
|
|
});
|
|
|
// Trigger store change
|
|
|
onChange(newValue.filter(function (_, valueIndex) {
|
|
|
return !indexSet.has(valueIndex);
|
|
|
}));
|
|
|
},
|
|
|
move: function move(from, to) {
|
|
|
if (from === to) {
|
|
|
return;
|
|
|
}
|
|
|
var newValue = getNewValue();
|
|
|
// Do not handle out of range
|
|
|
if (from < 0 || from >= newValue.length || to < 0 || to >= newValue.length) {
|
|
|
return;
|
|
|
}
|
|
|
keyManager.keys = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_6__.move)(keyManager.keys, from, to);
|
|
|
// Trigger store change
|
|
|
onChange((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_6__.move)(newValue, from, to));
|
|
|
}
|
|
|
};
|
|
|
var listValue = value || [];
|
|
|
if (!Array.isArray(listValue)) {
|
|
|
listValue = [];
|
|
|
if (true) {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_3__["default"])(false, "Current value of '".concat(prefixName.join(' > '), "' is not an array type."));
|
|
|
}
|
|
|
}
|
|
|
return children(listValue.map(function (__, index) {
|
|
|
var key = keyManager.keys[index];
|
|
|
if (key === undefined) {
|
|
|
keyManager.keys[index] = keyManager.id;
|
|
|
key = keyManager.keys[index];
|
|
|
keyManager.id += 1;
|
|
|
}
|
|
|
return {
|
|
|
name: index,
|
|
|
key: key,
|
|
|
isListField: true
|
|
|
};
|
|
|
}), operations, meta);
|
|
|
})));
|
|
|
};
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (List);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/ListContext.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/ListContext.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
|
|
|
var ListContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null);
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (ListContext);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/index.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/index.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "Field": () => (/* reexport safe */ _Field__WEBPACK_IMPORTED_MODULE_1__["default"]),
|
|
|
/* harmony export */ "FieldContext": () => (/* reexport safe */ _FieldContext__WEBPACK_IMPORTED_MODULE_6__["default"]),
|
|
|
/* harmony export */ "FormProvider": () => (/* reexport safe */ _FormContext__WEBPACK_IMPORTED_MODULE_5__.FormProvider),
|
|
|
/* harmony export */ "List": () => (/* reexport safe */ _List__WEBPACK_IMPORTED_MODULE_2__["default"]),
|
|
|
/* harmony export */ "ListContext": () => (/* reexport safe */ _ListContext__WEBPACK_IMPORTED_MODULE_7__["default"]),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "useForm": () => (/* reexport safe */ _useForm__WEBPACK_IMPORTED_MODULE_3__["default"]),
|
|
|
/* harmony export */ "useWatch": () => (/* reexport safe */ _useWatch__WEBPACK_IMPORTED_MODULE_8__["default"])
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var _Field__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Field */ "./node_modules/rc-field-form/es/Field.js");
|
|
|
/* harmony import */ var _List__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./List */ "./node_modules/rc-field-form/es/List.js");
|
|
|
/* harmony import */ var _useForm__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./useForm */ "./node_modules/rc-field-form/es/useForm.js");
|
|
|
/* harmony import */ var _Form__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Form */ "./node_modules/rc-field-form/es/Form.js");
|
|
|
/* harmony import */ var _FormContext__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./FormContext */ "./node_modules/rc-field-form/es/FormContext.js");
|
|
|
/* harmony import */ var _FieldContext__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./FieldContext */ "./node_modules/rc-field-form/es/FieldContext.js");
|
|
|
/* harmony import */ var _ListContext__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ListContext */ "./node_modules/rc-field-form/es/ListContext.js");
|
|
|
/* harmony import */ var _useWatch__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./useWatch */ "./node_modules/rc-field-form/es/useWatch.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var InternalForm = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.forwardRef(_Form__WEBPACK_IMPORTED_MODULE_4__["default"]);
|
|
|
var RefForm = InternalForm;
|
|
|
RefForm.FormProvider = _FormContext__WEBPACK_IMPORTED_MODULE_5__.FormProvider;
|
|
|
RefForm.Field = _Field__WEBPACK_IMPORTED_MODULE_1__["default"];
|
|
|
RefForm.List = _List__WEBPACK_IMPORTED_MODULE_2__["default"];
|
|
|
RefForm.useForm = _useForm__WEBPACK_IMPORTED_MODULE_3__["default"];
|
|
|
RefForm.useWatch = _useWatch__WEBPACK_IMPORTED_MODULE_8__["default"];
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (RefForm);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/useForm.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/useForm.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "FormStore": () => (/* binding */ FormStore),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.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_classCallCheck__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @babel/runtime/helpers/esm/classCallCheck */ "./node_modules/@babel/runtime/helpers/esm/classCallCheck.js");
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_7__);
|
|
|
/* harmony import */ var _FieldContext__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./FieldContext */ "./node_modules/rc-field-form/es/FieldContext.js");
|
|
|
/* harmony import */ var _utils_asyncUtil__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./utils/asyncUtil */ "./node_modules/rc-field-form/es/utils/asyncUtil.js");
|
|
|
/* harmony import */ var _utils_cloneDeep__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./utils/cloneDeep */ "./node_modules/rc-field-form/es/utils/cloneDeep.js");
|
|
|
/* harmony import */ var _utils_messages__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./utils/messages */ "./node_modules/rc-field-form/es/utils/messages.js");
|
|
|
/* harmony import */ var _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./utils/NameMap */ "./node_modules/rc-field-form/es/utils/NameMap.js");
|
|
|
/* harmony import */ var _utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./utils/valueUtil */ "./node_modules/rc-field-form/es/utils/valueUtil.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var _excluded = ["name", "errors"];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var FormStore = /*#__PURE__*/(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(function FormStore(forceRootUpdate) {
|
|
|
var _this = this;
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_5__["default"])(this, FormStore);
|
|
|
this.formHooked = false;
|
|
|
this.forceRootUpdate = void 0;
|
|
|
this.subscribable = true;
|
|
|
this.store = {};
|
|
|
this.fieldEntities = [];
|
|
|
this.initialValues = {};
|
|
|
this.callbacks = {};
|
|
|
this.validateMessages = null;
|
|
|
this.preserve = null;
|
|
|
this.lastValidatePromise = null;
|
|
|
this.getForm = function () {
|
|
|
return {
|
|
|
getFieldValue: _this.getFieldValue,
|
|
|
getFieldsValue: _this.getFieldsValue,
|
|
|
getFieldError: _this.getFieldError,
|
|
|
getFieldWarning: _this.getFieldWarning,
|
|
|
getFieldsError: _this.getFieldsError,
|
|
|
isFieldsTouched: _this.isFieldsTouched,
|
|
|
isFieldTouched: _this.isFieldTouched,
|
|
|
isFieldValidating: _this.isFieldValidating,
|
|
|
isFieldsValidating: _this.isFieldsValidating,
|
|
|
resetFields: _this.resetFields,
|
|
|
setFields: _this.setFields,
|
|
|
setFieldValue: _this.setFieldValue,
|
|
|
setFieldsValue: _this.setFieldsValue,
|
|
|
validateFields: _this.validateFields,
|
|
|
submit: _this.submit,
|
|
|
_init: true,
|
|
|
getInternalHooks: _this.getInternalHooks
|
|
|
};
|
|
|
};
|
|
|
this.getInternalHooks = function (key) {
|
|
|
if (key === _FieldContext__WEBPACK_IMPORTED_MODULE_8__.HOOK_MARK) {
|
|
|
_this.formHooked = true;
|
|
|
return {
|
|
|
dispatch: _this.dispatch,
|
|
|
initEntityValue: _this.initEntityValue,
|
|
|
registerField: _this.registerField,
|
|
|
useSubscribe: _this.useSubscribe,
|
|
|
setInitialValues: _this.setInitialValues,
|
|
|
destroyForm: _this.destroyForm,
|
|
|
setCallbacks: _this.setCallbacks,
|
|
|
setValidateMessages: _this.setValidateMessages,
|
|
|
getFields: _this.getFields,
|
|
|
setPreserve: _this.setPreserve,
|
|
|
getInitialValue: _this.getInitialValue,
|
|
|
registerWatch: _this.registerWatch
|
|
|
};
|
|
|
}
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__["default"])(false, '`getInternalHooks` is internal usage. Should not call directly.');
|
|
|
return null;
|
|
|
};
|
|
|
this.useSubscribe = function (subscribable) {
|
|
|
_this.subscribable = subscribable;
|
|
|
};
|
|
|
this.prevWithoutPreserves = null;
|
|
|
this.setInitialValues = function (initialValues, init) {
|
|
|
_this.initialValues = initialValues || {};
|
|
|
if (init) {
|
|
|
var _this$prevWithoutPres;
|
|
|
var nextStore = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValues)({}, initialValues, _this.store);
|
|
|
// We will take consider prev form unmount fields.
|
|
|
// When the field is not `preserve`, we need fill this with initialValues instead of store.
|
|
|
// eslint-disable-next-line array-callback-return
|
|
|
(_this$prevWithoutPres = _this.prevWithoutPreserves) === null || _this$prevWithoutPres === void 0 ? void 0 : _this$prevWithoutPres.map(function (_ref) {
|
|
|
var namePath = _ref.key;
|
|
|
nextStore = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(nextStore, namePath, (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getValue)(initialValues, namePath));
|
|
|
});
|
|
|
_this.prevWithoutPreserves = null;
|
|
|
_this.updateStore(nextStore);
|
|
|
}
|
|
|
};
|
|
|
this.destroyForm = function () {
|
|
|
var prevWithoutPreserves = new _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__["default"]();
|
|
|
_this.getFieldEntities(true).forEach(function (entity) {
|
|
|
if (!_this.isMergedPreserve(entity.isPreserve())) {
|
|
|
prevWithoutPreserves.set(entity.getNamePath(), true);
|
|
|
}
|
|
|
});
|
|
|
_this.prevWithoutPreserves = prevWithoutPreserves;
|
|
|
};
|
|
|
this.getInitialValue = function (namePath) {
|
|
|
var initValue = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getValue)(_this.initialValues, namePath);
|
|
|
// Not cloneDeep when without `namePath`
|
|
|
return namePath.length ? (0,_utils_cloneDeep__WEBPACK_IMPORTED_MODULE_10__["default"])(initValue) : initValue;
|
|
|
};
|
|
|
this.setCallbacks = function (callbacks) {
|
|
|
_this.callbacks = callbacks;
|
|
|
};
|
|
|
this.setValidateMessages = function (validateMessages) {
|
|
|
_this.validateMessages = validateMessages;
|
|
|
};
|
|
|
this.setPreserve = function (preserve) {
|
|
|
_this.preserve = preserve;
|
|
|
};
|
|
|
this.watchList = [];
|
|
|
this.registerWatch = function (callback) {
|
|
|
_this.watchList.push(callback);
|
|
|
return function () {
|
|
|
_this.watchList = _this.watchList.filter(function (fn) {
|
|
|
return fn !== callback;
|
|
|
});
|
|
|
};
|
|
|
};
|
|
|
this.notifyWatch = function () {
|
|
|
var namePath = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
|
// No need to cost perf when nothing need to watch
|
|
|
if (_this.watchList.length) {
|
|
|
var values = _this.getFieldsValue();
|
|
|
_this.watchList.forEach(function (callback) {
|
|
|
callback(values, namePath);
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
this.timeoutId = null;
|
|
|
this.warningUnhooked = function () {
|
|
|
if ( true && !_this.timeoutId && typeof window !== 'undefined') {
|
|
|
_this.timeoutId = setTimeout(function () {
|
|
|
_this.timeoutId = null;
|
|
|
if (!_this.formHooked) {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__["default"])(false, 'Instance created by `useForm` is not connected to any Form element. Forget to pass `form` prop?');
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
this.updateStore = function (nextStore) {
|
|
|
_this.store = nextStore;
|
|
|
};
|
|
|
this.getFieldEntities = function () {
|
|
|
var pure = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
|
if (!pure) {
|
|
|
return _this.fieldEntities;
|
|
|
}
|
|
|
return _this.fieldEntities.filter(function (field) {
|
|
|
return field.getNamePath().length;
|
|
|
});
|
|
|
};
|
|
|
this.getFieldsMap = function () {
|
|
|
var pure = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
|
var cache = new _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__["default"]();
|
|
|
_this.getFieldEntities(pure).forEach(function (field) {
|
|
|
var namePath = field.getNamePath();
|
|
|
cache.set(namePath, field);
|
|
|
});
|
|
|
return cache;
|
|
|
};
|
|
|
this.getFieldEntitiesForNamePathList = function (nameList) {
|
|
|
if (!nameList) {
|
|
|
return _this.getFieldEntities(true);
|
|
|
}
|
|
|
var cache = _this.getFieldsMap(true);
|
|
|
return nameList.map(function (name) {
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name);
|
|
|
return cache.get(namePath) || {
|
|
|
INVALIDATE_NAME_PATH: (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name)
|
|
|
};
|
|
|
});
|
|
|
};
|
|
|
this.getFieldsValue = function (nameList, filterFunc) {
|
|
|
_this.warningUnhooked();
|
|
|
if (nameList === true && !filterFunc) {
|
|
|
return _this.store;
|
|
|
}
|
|
|
var fieldEntities = _this.getFieldEntitiesForNamePathList(Array.isArray(nameList) ? nameList : null);
|
|
|
var filteredNameList = [];
|
|
|
fieldEntities.forEach(function (entity) {
|
|
|
var _entity$isListField;
|
|
|
var namePath = 'INVALIDATE_NAME_PATH' in entity ? entity.INVALIDATE_NAME_PATH : entity.getNamePath();
|
|
|
// Ignore when it's a list item and not specific the namePath,
|
|
|
// since parent field is already take in count
|
|
|
if (!nameList && ((_entity$isListField = entity.isListField) === null || _entity$isListField === void 0 ? void 0 : _entity$isListField.call(entity))) {
|
|
|
return;
|
|
|
}
|
|
|
if (!filterFunc) {
|
|
|
filteredNameList.push(namePath);
|
|
|
} else {
|
|
|
var meta = 'getMeta' in entity ? entity.getMeta() : null;
|
|
|
if (filterFunc(meta)) {
|
|
|
filteredNameList.push(namePath);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
return (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.cloneByNamePathList)(_this.store, filteredNameList.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath));
|
|
|
};
|
|
|
this.getFieldValue = function (name) {
|
|
|
_this.warningUnhooked();
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name);
|
|
|
return (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getValue)(_this.store, namePath);
|
|
|
};
|
|
|
this.getFieldsError = function (nameList) {
|
|
|
_this.warningUnhooked();
|
|
|
var fieldEntities = _this.getFieldEntitiesForNamePathList(nameList);
|
|
|
return fieldEntities.map(function (entity, index) {
|
|
|
if (entity && !('INVALIDATE_NAME_PATH' in entity)) {
|
|
|
return {
|
|
|
name: entity.getNamePath(),
|
|
|
errors: entity.getErrors(),
|
|
|
warnings: entity.getWarnings()
|
|
|
};
|
|
|
}
|
|
|
return {
|
|
|
name: (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(nameList[index]),
|
|
|
errors: [],
|
|
|
warnings: []
|
|
|
};
|
|
|
});
|
|
|
};
|
|
|
this.getFieldError = function (name) {
|
|
|
_this.warningUnhooked();
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name);
|
|
|
var fieldError = _this.getFieldsError([namePath])[0];
|
|
|
return fieldError.errors;
|
|
|
};
|
|
|
this.getFieldWarning = function (name) {
|
|
|
_this.warningUnhooked();
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name);
|
|
|
var fieldError = _this.getFieldsError([namePath])[0];
|
|
|
return fieldError.warnings;
|
|
|
};
|
|
|
this.isFieldsTouched = function () {
|
|
|
_this.warningUnhooked();
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
args[_key] = arguments[_key];
|
|
|
}
|
|
|
var arg0 = args[0],
|
|
|
arg1 = args[1];
|
|
|
var namePathList;
|
|
|
var isAllFieldsTouched = false;
|
|
|
if (args.length === 0) {
|
|
|
namePathList = null;
|
|
|
} else if (args.length === 1) {
|
|
|
if (Array.isArray(arg0)) {
|
|
|
namePathList = arg0.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath);
|
|
|
isAllFieldsTouched = false;
|
|
|
} else {
|
|
|
namePathList = null;
|
|
|
isAllFieldsTouched = arg0;
|
|
|
}
|
|
|
} else {
|
|
|
namePathList = arg0.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath);
|
|
|
isAllFieldsTouched = arg1;
|
|
|
}
|
|
|
var fieldEntities = _this.getFieldEntities(true);
|
|
|
var isFieldTouched = function isFieldTouched(field) {
|
|
|
return field.isFieldTouched();
|
|
|
};
|
|
|
// ===== Will get fully compare when not config namePathList =====
|
|
|
if (!namePathList) {
|
|
|
return isAllFieldsTouched ? fieldEntities.every(isFieldTouched) : fieldEntities.some(isFieldTouched);
|
|
|
}
|
|
|
// Generate a nest tree for validate
|
|
|
var map = new _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__["default"]();
|
|
|
namePathList.forEach(function (shortNamePath) {
|
|
|
map.set(shortNamePath, []);
|
|
|
});
|
|
|
fieldEntities.forEach(function (field) {
|
|
|
var fieldNamePath = field.getNamePath();
|
|
|
// Find matched entity and put into list
|
|
|
namePathList.forEach(function (shortNamePath) {
|
|
|
if (shortNamePath.every(function (nameUnit, i) {
|
|
|
return fieldNamePath[i] === nameUnit;
|
|
|
})) {
|
|
|
map.update(shortNamePath, function (list) {
|
|
|
return [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(list), [field]);
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
// Check if NameMap value is touched
|
|
|
var isNamePathListTouched = function isNamePathListTouched(entities) {
|
|
|
return entities.some(isFieldTouched);
|
|
|
};
|
|
|
var namePathListEntities = map.map(function (_ref2) {
|
|
|
var value = _ref2.value;
|
|
|
return value;
|
|
|
});
|
|
|
return isAllFieldsTouched ? namePathListEntities.every(isNamePathListTouched) : namePathListEntities.some(isNamePathListTouched);
|
|
|
};
|
|
|
this.isFieldTouched = function (name) {
|
|
|
_this.warningUnhooked();
|
|
|
return _this.isFieldsTouched([name]);
|
|
|
};
|
|
|
this.isFieldsValidating = function (nameList) {
|
|
|
_this.warningUnhooked();
|
|
|
var fieldEntities = _this.getFieldEntities();
|
|
|
if (!nameList) {
|
|
|
return fieldEntities.some(function (testField) {
|
|
|
return testField.isFieldValidating();
|
|
|
});
|
|
|
}
|
|
|
var namePathList = nameList.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath);
|
|
|
return fieldEntities.some(function (testField) {
|
|
|
var fieldNamePath = testField.getNamePath();
|
|
|
return (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.containsNamePath)(namePathList, fieldNamePath) && testField.isFieldValidating();
|
|
|
});
|
|
|
};
|
|
|
this.isFieldValidating = function (name) {
|
|
|
_this.warningUnhooked();
|
|
|
return _this.isFieldsValidating([name]);
|
|
|
};
|
|
|
this.resetWithFieldInitialValue = function () {
|
|
|
var info = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
|
// Create cache
|
|
|
var cache = new _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__["default"]();
|
|
|
var fieldEntities = _this.getFieldEntities(true);
|
|
|
fieldEntities.forEach(function (field) {
|
|
|
var initialValue = field.props.initialValue;
|
|
|
var namePath = field.getNamePath();
|
|
|
// Record only if has `initialValue`
|
|
|
if (initialValue !== undefined) {
|
|
|
var records = cache.get(namePath) || new Set();
|
|
|
records.add({
|
|
|
entity: field,
|
|
|
value: initialValue
|
|
|
});
|
|
|
cache.set(namePath, records);
|
|
|
}
|
|
|
});
|
|
|
// Reset
|
|
|
var resetWithFields = function resetWithFields(entities) {
|
|
|
entities.forEach(function (field) {
|
|
|
var initialValue = field.props.initialValue;
|
|
|
if (initialValue !== undefined) {
|
|
|
var namePath = field.getNamePath();
|
|
|
var formInitialValue = _this.getInitialValue(namePath);
|
|
|
if (formInitialValue !== undefined) {
|
|
|
// Warning if conflict with form initialValues and do not modify value
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__["default"])(false, "Form already set 'initialValues' with path '".concat(namePath.join('.'), "'. Field can not overwrite it."));
|
|
|
} else {
|
|
|
var records = cache.get(namePath);
|
|
|
if (records && records.size > 1) {
|
|
|
// Warning if multiple field set `initialValue`and do not modify value
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__["default"])(false, "Multiple Field with path '".concat(namePath.join('.'), "' set 'initialValue'. Can not decide which one to pick."));
|
|
|
} else if (records) {
|
|
|
var originValue = _this.getFieldValue(namePath);
|
|
|
// Set `initialValue`
|
|
|
if (!info.skipExist || originValue === undefined) {
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(_this.store, namePath, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(records)[0].value));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
var requiredFieldEntities;
|
|
|
if (info.entities) {
|
|
|
requiredFieldEntities = info.entities;
|
|
|
} else if (info.namePathList) {
|
|
|
requiredFieldEntities = [];
|
|
|
info.namePathList.forEach(function (namePath) {
|
|
|
var records = cache.get(namePath);
|
|
|
if (records) {
|
|
|
var _requiredFieldEntitie;
|
|
|
(_requiredFieldEntitie = requiredFieldEntities).push.apply(_requiredFieldEntitie, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(records).map(function (r) {
|
|
|
return r.entity;
|
|
|
})));
|
|
|
}
|
|
|
});
|
|
|
} else {
|
|
|
requiredFieldEntities = fieldEntities;
|
|
|
}
|
|
|
resetWithFields(requiredFieldEntities);
|
|
|
};
|
|
|
this.resetFields = function (nameList) {
|
|
|
_this.warningUnhooked();
|
|
|
var prevStore = _this.store;
|
|
|
if (!nameList) {
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValues)({}, _this.initialValues));
|
|
|
_this.resetWithFieldInitialValue();
|
|
|
_this.notifyObservers(prevStore, null, {
|
|
|
type: 'reset'
|
|
|
});
|
|
|
_this.notifyWatch();
|
|
|
return;
|
|
|
}
|
|
|
// Reset by `nameList`
|
|
|
var namePathList = nameList.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath);
|
|
|
namePathList.forEach(function (namePath) {
|
|
|
var initialValue = _this.getInitialValue(namePath);
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(_this.store, namePath, initialValue));
|
|
|
});
|
|
|
_this.resetWithFieldInitialValue({
|
|
|
namePathList: namePathList
|
|
|
});
|
|
|
_this.notifyObservers(prevStore, namePathList, {
|
|
|
type: 'reset'
|
|
|
});
|
|
|
_this.notifyWatch(namePathList);
|
|
|
};
|
|
|
this.setFields = function (fields) {
|
|
|
_this.warningUnhooked();
|
|
|
var prevStore = _this.store;
|
|
|
var namePathList = [];
|
|
|
fields.forEach(function (fieldData) {
|
|
|
var name = fieldData.name,
|
|
|
errors = fieldData.errors,
|
|
|
data = (0,_babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_2__["default"])(fieldData, _excluded);
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name);
|
|
|
namePathList.push(namePath);
|
|
|
// Value
|
|
|
if ('value' in data) {
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(_this.store, namePath, data.value));
|
|
|
}
|
|
|
_this.notifyObservers(prevStore, [namePath], {
|
|
|
type: 'setField',
|
|
|
data: fieldData
|
|
|
});
|
|
|
});
|
|
|
_this.notifyWatch(namePathList);
|
|
|
};
|
|
|
this.getFields = function () {
|
|
|
var entities = _this.getFieldEntities(true);
|
|
|
var fields = entities.map(function (field) {
|
|
|
var namePath = field.getNamePath();
|
|
|
var meta = field.getMeta();
|
|
|
var fieldData = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, meta), {}, {
|
|
|
name: namePath,
|
|
|
value: _this.getFieldValue(namePath)
|
|
|
});
|
|
|
Object.defineProperty(fieldData, 'originRCField', {
|
|
|
value: true
|
|
|
});
|
|
|
return fieldData;
|
|
|
});
|
|
|
return fields;
|
|
|
};
|
|
|
this.initEntityValue = function (entity) {
|
|
|
var initialValue = entity.props.initialValue;
|
|
|
if (initialValue !== undefined) {
|
|
|
var namePath = entity.getNamePath();
|
|
|
var prevValue = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getValue)(_this.store, namePath);
|
|
|
if (prevValue === undefined) {
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(_this.store, namePath, initialValue));
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
this.isMergedPreserve = function (fieldPreserve) {
|
|
|
var mergedPreserve = fieldPreserve !== undefined ? fieldPreserve : _this.preserve;
|
|
|
return mergedPreserve !== null && mergedPreserve !== void 0 ? mergedPreserve : true;
|
|
|
};
|
|
|
this.registerField = function (entity) {
|
|
|
_this.fieldEntities.push(entity);
|
|
|
var namePath = entity.getNamePath();
|
|
|
_this.notifyWatch([namePath]);
|
|
|
// Set initial values
|
|
|
if (entity.props.initialValue !== undefined) {
|
|
|
var prevStore = _this.store;
|
|
|
_this.resetWithFieldInitialValue({
|
|
|
entities: [entity],
|
|
|
skipExist: true
|
|
|
});
|
|
|
_this.notifyObservers(prevStore, [entity.getNamePath()], {
|
|
|
type: 'valueUpdate',
|
|
|
source: 'internal'
|
|
|
});
|
|
|
}
|
|
|
// un-register field callback
|
|
|
return function (isListField, preserve) {
|
|
|
var subNamePath = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
|
|
|
_this.fieldEntities = _this.fieldEntities.filter(function (item) {
|
|
|
return item !== entity;
|
|
|
});
|
|
|
// Clean up store value if not preserve
|
|
|
if (!_this.isMergedPreserve(preserve) && (!isListField || subNamePath.length > 1)) {
|
|
|
var defaultValue = isListField ? undefined : _this.getInitialValue(namePath);
|
|
|
if (namePath.length && _this.getFieldValue(namePath) !== defaultValue && _this.fieldEntities.every(function (field) {
|
|
|
return (
|
|
|
// Only reset when no namePath exist
|
|
|
!(0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.matchNamePath)(field.getNamePath(), namePath)
|
|
|
);
|
|
|
})) {
|
|
|
var _prevStore = _this.store;
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(_prevStore, namePath, defaultValue, true));
|
|
|
// Notify that field is unmount
|
|
|
_this.notifyObservers(_prevStore, [namePath], {
|
|
|
type: 'remove'
|
|
|
});
|
|
|
// Dependencies update
|
|
|
_this.triggerDependenciesUpdate(_prevStore, namePath);
|
|
|
}
|
|
|
}
|
|
|
_this.notifyWatch([namePath]);
|
|
|
};
|
|
|
};
|
|
|
this.dispatch = function (action) {
|
|
|
switch (action.type) {
|
|
|
case 'updateValue':
|
|
|
{
|
|
|
var namePath = action.namePath,
|
|
|
value = action.value;
|
|
|
_this.updateValue(namePath, value);
|
|
|
break;
|
|
|
}
|
|
|
case 'validateField':
|
|
|
{
|
|
|
var _namePath = action.namePath,
|
|
|
triggerName = action.triggerName;
|
|
|
_this.validateFields([_namePath], {
|
|
|
triggerName: triggerName
|
|
|
});
|
|
|
break;
|
|
|
}
|
|
|
default:
|
|
|
// Currently we don't have other action. Do nothing.
|
|
|
}
|
|
|
};
|
|
|
this.notifyObservers = function (prevStore, namePathList, info) {
|
|
|
if (_this.subscribable) {
|
|
|
var mergedInfo = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, info), {}, {
|
|
|
store: _this.getFieldsValue(true)
|
|
|
});
|
|
|
_this.getFieldEntities().forEach(function (_ref3) {
|
|
|
var onStoreChange = _ref3.onStoreChange;
|
|
|
onStoreChange(prevStore, namePathList, mergedInfo);
|
|
|
});
|
|
|
} else {
|
|
|
_this.forceRootUpdate();
|
|
|
}
|
|
|
};
|
|
|
this.triggerDependenciesUpdate = function (prevStore, namePath) {
|
|
|
var childrenFields = _this.getDependencyChildrenFields(namePath);
|
|
|
if (childrenFields.length) {
|
|
|
_this.validateFields(childrenFields);
|
|
|
}
|
|
|
_this.notifyObservers(prevStore, childrenFields, {
|
|
|
type: 'dependenciesUpdate',
|
|
|
relatedFields: [namePath].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(childrenFields))
|
|
|
});
|
|
|
return childrenFields;
|
|
|
};
|
|
|
this.updateValue = function (name, value) {
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(name);
|
|
|
var prevStore = _this.store;
|
|
|
_this.updateStore((0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValue)(_this.store, namePath, value));
|
|
|
_this.notifyObservers(prevStore, [namePath], {
|
|
|
type: 'valueUpdate',
|
|
|
source: 'internal'
|
|
|
});
|
|
|
_this.notifyWatch([namePath]);
|
|
|
// Dependencies update
|
|
|
var childrenFields = _this.triggerDependenciesUpdate(prevStore, namePath);
|
|
|
// trigger callback function
|
|
|
var onValuesChange = _this.callbacks.onValuesChange;
|
|
|
if (onValuesChange) {
|
|
|
var changedValues = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.cloneByNamePathList)(_this.store, [namePath]);
|
|
|
onValuesChange(changedValues, _this.getFieldsValue());
|
|
|
}
|
|
|
_this.triggerOnFieldsChange([namePath].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(childrenFields)));
|
|
|
};
|
|
|
this.setFieldsValue = function (store) {
|
|
|
_this.warningUnhooked();
|
|
|
var prevStore = _this.store;
|
|
|
if (store) {
|
|
|
var nextStore = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.setValues)(_this.store, store);
|
|
|
_this.updateStore(nextStore);
|
|
|
}
|
|
|
_this.notifyObservers(prevStore, null, {
|
|
|
type: 'valueUpdate',
|
|
|
source: 'external'
|
|
|
});
|
|
|
_this.notifyWatch();
|
|
|
};
|
|
|
this.setFieldValue = function (name, value) {
|
|
|
_this.setFields([{
|
|
|
name: name,
|
|
|
value: value
|
|
|
}]);
|
|
|
};
|
|
|
this.getDependencyChildrenFields = function (rootNamePath) {
|
|
|
var children = new Set();
|
|
|
var childrenFields = [];
|
|
|
var dependencies2fields = new _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__["default"]();
|
|
|
/**
|
|
|
* Generate maps
|
|
|
* Can use cache to save perf if user report performance issue with this
|
|
|
*/
|
|
|
_this.getFieldEntities().forEach(function (field) {
|
|
|
var dependencies = field.props.dependencies;
|
|
|
(dependencies || []).forEach(function (dependency) {
|
|
|
var dependencyNamePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath)(dependency);
|
|
|
dependencies2fields.update(dependencyNamePath, function () {
|
|
|
var fields = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : new Set();
|
|
|
fields.add(field);
|
|
|
return fields;
|
|
|
});
|
|
|
});
|
|
|
});
|
|
|
var fillChildren = function fillChildren(namePath) {
|
|
|
var fields = dependencies2fields.get(namePath) || new Set();
|
|
|
fields.forEach(function (field) {
|
|
|
if (!children.has(field)) {
|
|
|
children.add(field);
|
|
|
var fieldNamePath = field.getNamePath();
|
|
|
if (field.isFieldDirty() && fieldNamePath.length) {
|
|
|
childrenFields.push(fieldNamePath);
|
|
|
fillChildren(fieldNamePath);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
fillChildren(rootNamePath);
|
|
|
return childrenFields;
|
|
|
};
|
|
|
this.triggerOnFieldsChange = function (namePathList, filedErrors) {
|
|
|
var onFieldsChange = _this.callbacks.onFieldsChange;
|
|
|
if (onFieldsChange) {
|
|
|
var fields = _this.getFields();
|
|
|
/**
|
|
|
* Fill errors since `fields` may be replaced by controlled fields
|
|
|
*/
|
|
|
if (filedErrors) {
|
|
|
var cache = new _utils_NameMap__WEBPACK_IMPORTED_MODULE_12__["default"]();
|
|
|
filedErrors.forEach(function (_ref4) {
|
|
|
var name = _ref4.name,
|
|
|
errors = _ref4.errors;
|
|
|
cache.set(name, errors);
|
|
|
});
|
|
|
fields.forEach(function (field) {
|
|
|
// eslint-disable-next-line no-param-reassign
|
|
|
field.errors = cache.get(field.name) || field.errors;
|
|
|
});
|
|
|
}
|
|
|
var changedFields = fields.filter(function (_ref5) {
|
|
|
var fieldName = _ref5.name;
|
|
|
return (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.containsNamePath)(namePathList, fieldName);
|
|
|
});
|
|
|
onFieldsChange(changedFields, fields);
|
|
|
}
|
|
|
};
|
|
|
this.validateFields = function (nameList, options) {
|
|
|
_this.warningUnhooked();
|
|
|
var provideNameList = !!nameList;
|
|
|
var namePathList = provideNameList ? nameList.map(_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.getNamePath) : [];
|
|
|
// Collect result in promise list
|
|
|
var promiseList = [];
|
|
|
_this.getFieldEntities(true).forEach(function (field) {
|
|
|
// Add field if not provide `nameList`
|
|
|
if (!provideNameList) {
|
|
|
namePathList.push(field.getNamePath());
|
|
|
}
|
|
|
/**
|
|
|
* Recursive validate if configured.
|
|
|
* TODO: perf improvement @zombieJ
|
|
|
*/
|
|
|
if ((options === null || options === void 0 ? void 0 : options.recursive) && provideNameList) {
|
|
|
var namePath = field.getNamePath();
|
|
|
if (
|
|
|
// nameList[i] === undefined 说明是以 nameList 开头的
|
|
|
// ['name'] -> ['name','list']
|
|
|
namePath.every(function (nameUnit, i) {
|
|
|
return nameList[i] === nameUnit || nameList[i] === undefined;
|
|
|
})) {
|
|
|
namePathList.push(namePath);
|
|
|
}
|
|
|
}
|
|
|
// Skip if without rule
|
|
|
if (!field.props.rules || !field.props.rules.length) {
|
|
|
return;
|
|
|
}
|
|
|
var fieldNamePath = field.getNamePath();
|
|
|
// Add field validate rule in to promise list
|
|
|
if (!provideNameList || (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_13__.containsNamePath)(namePathList, fieldNamePath)) {
|
|
|
var promise = field.validateRules((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({
|
|
|
validateMessages: (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, _utils_messages__WEBPACK_IMPORTED_MODULE_11__.defaultValidateMessages), _this.validateMessages)
|
|
|
}, options));
|
|
|
// Wrap promise with field
|
|
|
promiseList.push(promise.then(function () {
|
|
|
return {
|
|
|
name: fieldNamePath,
|
|
|
errors: [],
|
|
|
warnings: []
|
|
|
};
|
|
|
}).catch(function (ruleErrors) {
|
|
|
var _ruleErrors$forEach;
|
|
|
var mergedErrors = [];
|
|
|
var mergedWarnings = [];
|
|
|
(_ruleErrors$forEach = ruleErrors.forEach) === null || _ruleErrors$forEach === void 0 ? void 0 : _ruleErrors$forEach.call(ruleErrors, function (_ref6) {
|
|
|
var warningOnly = _ref6.rule.warningOnly,
|
|
|
errors = _ref6.errors;
|
|
|
if (warningOnly) {
|
|
|
mergedWarnings.push.apply(mergedWarnings, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(errors));
|
|
|
} else {
|
|
|
mergedErrors.push.apply(mergedErrors, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_3__["default"])(errors));
|
|
|
}
|
|
|
});
|
|
|
if (mergedErrors.length) {
|
|
|
return Promise.reject({
|
|
|
name: fieldNamePath,
|
|
|
errors: mergedErrors,
|
|
|
warnings: mergedWarnings
|
|
|
});
|
|
|
}
|
|
|
return {
|
|
|
name: fieldNamePath,
|
|
|
errors: mergedErrors,
|
|
|
warnings: mergedWarnings
|
|
|
};
|
|
|
}));
|
|
|
}
|
|
|
});
|
|
|
var summaryPromise = (0,_utils_asyncUtil__WEBPACK_IMPORTED_MODULE_9__.allPromiseFinish)(promiseList);
|
|
|
_this.lastValidatePromise = summaryPromise;
|
|
|
// Notify fields with rule that validate has finished and need update
|
|
|
summaryPromise.catch(function (results) {
|
|
|
return results;
|
|
|
}).then(function (results) {
|
|
|
var resultNamePathList = results.map(function (_ref7) {
|
|
|
var name = _ref7.name;
|
|
|
return name;
|
|
|
});
|
|
|
_this.notifyObservers(_this.store, resultNamePathList, {
|
|
|
type: 'validateFinish'
|
|
|
});
|
|
|
_this.triggerOnFieldsChange(resultNamePathList, results);
|
|
|
});
|
|
|
var returnPromise = summaryPromise.then(function () {
|
|
|
if (_this.lastValidatePromise === summaryPromise) {
|
|
|
return Promise.resolve(_this.getFieldsValue(namePathList));
|
|
|
}
|
|
|
return Promise.reject([]);
|
|
|
}).catch(function (results) {
|
|
|
var errorList = results.filter(function (result) {
|
|
|
return result && result.errors.length;
|
|
|
});
|
|
|
return Promise.reject({
|
|
|
values: _this.getFieldsValue(namePathList),
|
|
|
errorFields: errorList,
|
|
|
outOfDate: _this.lastValidatePromise !== summaryPromise
|
|
|
});
|
|
|
});
|
|
|
// Do not throw in console
|
|
|
returnPromise.catch(function (e) {
|
|
|
return e;
|
|
|
});
|
|
|
return returnPromise;
|
|
|
};
|
|
|
this.submit = function () {
|
|
|
_this.warningUnhooked();
|
|
|
_this.validateFields().then(function (values) {
|
|
|
var onFinish = _this.callbacks.onFinish;
|
|
|
if (onFinish) {
|
|
|
try {
|
|
|
onFinish(values);
|
|
|
} catch (err) {
|
|
|
// Should print error if user `onFinish` callback failed
|
|
|
console.error(err);
|
|
|
}
|
|
|
}
|
|
|
}).catch(function (e) {
|
|
|
var onFinishFailed = _this.callbacks.onFinishFailed;
|
|
|
if (onFinishFailed) {
|
|
|
onFinishFailed(e);
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
this.forceRootUpdate = forceRootUpdate;
|
|
|
});
|
|
|
function useForm(form) {
|
|
|
var formRef = react__WEBPACK_IMPORTED_MODULE_7__.useRef();
|
|
|
var _React$useState = react__WEBPACK_IMPORTED_MODULE_7__.useState({}),
|
|
|
_React$useState2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_React$useState, 2),
|
|
|
forceUpdate = _React$useState2[1];
|
|
|
if (!formRef.current) {
|
|
|
if (form) {
|
|
|
formRef.current = form;
|
|
|
} else {
|
|
|
// Create a new FormStore if not provided
|
|
|
var forceReRender = function forceReRender() {
|
|
|
forceUpdate({});
|
|
|
};
|
|
|
var formStore = new FormStore(forceReRender);
|
|
|
formRef.current = formStore.getForm();
|
|
|
}
|
|
|
}
|
|
|
return [formRef.current];
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useForm);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/useWatch.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/useWatch.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "stringify": () => (/* binding */ stringify)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! . */ "./node_modules/rc-field-form/es/index.js");
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
/* harmony import */ var _FieldContext__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./FieldContext */ "./node_modules/rc-field-form/es/FieldContext.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
/* harmony import */ var _utils_valueUtil__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/valueUtil */ "./node_modules/rc-field-form/es/utils/valueUtil.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function stringify(value) {
|
|
|
try {
|
|
|
return JSON.stringify(value);
|
|
|
} catch (err) {
|
|
|
return Math.random();
|
|
|
}
|
|
|
}
|
|
|
var useWatchWarning = true ? function (namePath) {
|
|
|
var fullyStr = namePath.join('__RC_FIELD_FORM_SPLIT__');
|
|
|
var nameStrRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)(fullyStr);
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_2__["default"])(nameStrRef.current === fullyStr, '`useWatch` is not support dynamic `namePath`. Please provide static instead.');
|
|
|
} : 0;
|
|
|
function useWatch() {
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
args[_key] = arguments[_key];
|
|
|
}
|
|
|
var _args$ = args[0],
|
|
|
dependencies = _args$ === void 0 ? [] : _args$,
|
|
|
form = args[1];
|
|
|
var _useState = (0,react__WEBPACK_IMPORTED_MODULE_4__.useState)(),
|
|
|
_useState2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_useState, 2),
|
|
|
value = _useState2[0],
|
|
|
setValue = _useState2[1];
|
|
|
var valueStr = (0,react__WEBPACK_IMPORTED_MODULE_4__.useMemo)(function () {
|
|
|
return stringify(value);
|
|
|
}, [value]);
|
|
|
var valueStrRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)(valueStr);
|
|
|
valueStrRef.current = valueStr;
|
|
|
var fieldContext = (0,react__WEBPACK_IMPORTED_MODULE_4__.useContext)(___WEBPACK_IMPORTED_MODULE_1__.FieldContext);
|
|
|
var formInstance = form || fieldContext;
|
|
|
var isValidForm = formInstance && formInstance._init;
|
|
|
// Warning if not exist form instance
|
|
|
if (true) {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_2__["default"])(args.length === 2 ? form ? isValidForm : true : isValidForm, 'useWatch requires a form instance since it can not auto detect from context.');
|
|
|
}
|
|
|
var namePath = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_5__.getNamePath)(dependencies);
|
|
|
var namePathRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)(namePath);
|
|
|
namePathRef.current = namePath;
|
|
|
useWatchWarning(namePath);
|
|
|
(0,react__WEBPACK_IMPORTED_MODULE_4__.useEffect)(function () {
|
|
|
// Skip if not exist form instance
|
|
|
if (!isValidForm) {
|
|
|
return;
|
|
|
}
|
|
|
var getFieldsValue = formInstance.getFieldsValue,
|
|
|
getInternalHooks = formInstance.getInternalHooks;
|
|
|
var _getInternalHooks = getInternalHooks(_FieldContext__WEBPACK_IMPORTED_MODULE_3__.HOOK_MARK),
|
|
|
registerWatch = _getInternalHooks.registerWatch;
|
|
|
var cancelRegister = registerWatch(function (store) {
|
|
|
var newValue = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_5__.getValue)(store, namePathRef.current);
|
|
|
var nextValueStr = stringify(newValue);
|
|
|
// Compare stringify in case it's nest object
|
|
|
if (valueStrRef.current !== nextValueStr) {
|
|
|
valueStrRef.current = nextValueStr;
|
|
|
setValue(newValue);
|
|
|
}
|
|
|
});
|
|
|
// TODO: We can improve this perf in future
|
|
|
var initialValue = (0,_utils_valueUtil__WEBPACK_IMPORTED_MODULE_5__.getValue)(getFieldsValue(), namePathRef.current);
|
|
|
setValue(initialValue);
|
|
|
return cancelRegister;
|
|
|
},
|
|
|
// We do not need re-register since namePath content is the same
|
|
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
|
[isValidForm]);
|
|
|
return value;
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useWatch);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/NameMap.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/NameMap.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_2__ = __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_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @babel/runtime/helpers/esm/typeof */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var SPLIT = '__@field_split__';
|
|
|
/**
|
|
|
* Convert name path into string to fast the fetch speed of Map.
|
|
|
*/
|
|
|
function normalize(namePath) {
|
|
|
return namePath.map(function (cell) {
|
|
|
return "".concat((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_4__["default"])(cell), ":").concat(cell);
|
|
|
})
|
|
|
// Magic split
|
|
|
.join(SPLIT);
|
|
|
}
|
|
|
/**
|
|
|
* NameMap like a `Map` but accepts `string[]` as key.
|
|
|
*/
|
|
|
var NameMap = /*#__PURE__*/function () {
|
|
|
function NameMap() {
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_2__["default"])(this, NameMap);
|
|
|
this.kvs = new Map();
|
|
|
}
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_3__["default"])(NameMap, [{
|
|
|
key: "set",
|
|
|
value: function set(key, value) {
|
|
|
this.kvs.set(normalize(key), value);
|
|
|
}
|
|
|
}, {
|
|
|
key: "get",
|
|
|
value: function get(key) {
|
|
|
return this.kvs.get(normalize(key));
|
|
|
}
|
|
|
}, {
|
|
|
key: "update",
|
|
|
value: function update(key, updater) {
|
|
|
var origin = this.get(key);
|
|
|
var next = updater(origin);
|
|
|
if (!next) {
|
|
|
this.delete(key);
|
|
|
} else {
|
|
|
this.set(key, next);
|
|
|
}
|
|
|
}
|
|
|
}, {
|
|
|
key: "delete",
|
|
|
value: function _delete(key) {
|
|
|
this.kvs.delete(normalize(key));
|
|
|
}
|
|
|
// Since we only use this in test, let simply realize this
|
|
|
}, {
|
|
|
key: "map",
|
|
|
value: function map(callback) {
|
|
|
return (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(this.kvs.entries()).map(function (_ref) {
|
|
|
var _ref2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_ref, 2),
|
|
|
key = _ref2[0],
|
|
|
value = _ref2[1];
|
|
|
var cells = key.split(SPLIT);
|
|
|
return callback({
|
|
|
key: cells.map(function (cell) {
|
|
|
var _cell$match = cell.match(/^([^:]*):(.*)$/),
|
|
|
_cell$match2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_cell$match, 3),
|
|
|
type = _cell$match2[1],
|
|
|
unit = _cell$match2[2];
|
|
|
return type === 'number' ? Number(unit) : unit;
|
|
|
}),
|
|
|
value: value
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
}, {
|
|
|
key: "toJSON",
|
|
|
value: function toJSON() {
|
|
|
var json = {};
|
|
|
this.map(function (_ref3) {
|
|
|
var key = _ref3.key,
|
|
|
value = _ref3.value;
|
|
|
json[key.join('.')] = value;
|
|
|
return null;
|
|
|
});
|
|
|
return json;
|
|
|
}
|
|
|
}]);
|
|
|
return NameMap;
|
|
|
}();
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (NameMap);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/asyncUtil.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/asyncUtil.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "allPromiseFinish": () => (/* binding */ allPromiseFinish)
|
|
|
/* harmony export */ });
|
|
|
function allPromiseFinish(promiseList) {
|
|
|
var hasError = false;
|
|
|
var count = promiseList.length;
|
|
|
var results = [];
|
|
|
if (!promiseList.length) {
|
|
|
return Promise.resolve([]);
|
|
|
}
|
|
|
return new Promise(function (resolve, reject) {
|
|
|
promiseList.forEach(function (promise, index) {
|
|
|
promise.catch(function (e) {
|
|
|
hasError = true;
|
|
|
return e;
|
|
|
}).then(function (result) {
|
|
|
count -= 1;
|
|
|
results[index] = result;
|
|
|
if (count > 0) {
|
|
|
return;
|
|
|
}
|
|
|
if (hasError) {
|
|
|
reject(results);
|
|
|
}
|
|
|
resolve(results);
|
|
|
});
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/cloneDeep.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/cloneDeep.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* 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");
|
|
|
|
|
|
function cloneDeep(val) {
|
|
|
if (Array.isArray(val)) {
|
|
|
return cloneArrayDeep(val);
|
|
|
} else if ((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(val) === 'object' && val !== null) {
|
|
|
return cloneObjectDeep(val);
|
|
|
}
|
|
|
return val;
|
|
|
}
|
|
|
function cloneObjectDeep(val) {
|
|
|
if (Object.getPrototypeOf(val) === Object.prototype) {
|
|
|
var res = {};
|
|
|
for (var key in val) {
|
|
|
res[key] = cloneDeep(val[key]);
|
|
|
}
|
|
|
return res;
|
|
|
}
|
|
|
return val;
|
|
|
}
|
|
|
function cloneArrayDeep(val) {
|
|
|
return val.map(function (item) {
|
|
|
return cloneDeep(item);
|
|
|
});
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (cloneDeep);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/messages.js":
|
|
|
/*!*********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/messages.js ***!
|
|
|
\*********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "defaultValidateMessages": () => (/* binding */ defaultValidateMessages)
|
|
|
/* harmony export */ });
|
|
|
var typeTemplate = "'${name}' is not a valid ${type}";
|
|
|
var defaultValidateMessages = {
|
|
|
default: "Validation error on field '${name}'",
|
|
|
required: "'${name}' is required",
|
|
|
enum: "'${name}' must be one of [${enum}]",
|
|
|
whitespace: "'${name}' cannot be empty",
|
|
|
date: {
|
|
|
format: "'${name}' is invalid for format date",
|
|
|
parse: "'${name}' could not be parsed as date",
|
|
|
invalid: "'${name}' is invalid date"
|
|
|
},
|
|
|
types: {
|
|
|
string: typeTemplate,
|
|
|
method: typeTemplate,
|
|
|
array: typeTemplate,
|
|
|
object: typeTemplate,
|
|
|
number: typeTemplate,
|
|
|
date: typeTemplate,
|
|
|
boolean: typeTemplate,
|
|
|
integer: typeTemplate,
|
|
|
float: typeTemplate,
|
|
|
regexp: typeTemplate,
|
|
|
email: typeTemplate,
|
|
|
url: typeTemplate,
|
|
|
hex: typeTemplate
|
|
|
},
|
|
|
string: {
|
|
|
len: "'${name}' must be exactly ${len} characters",
|
|
|
min: "'${name}' must be at least ${min} characters",
|
|
|
max: "'${name}' cannot be longer than ${max} characters",
|
|
|
range: "'${name}' must be between ${min} and ${max} characters"
|
|
|
},
|
|
|
number: {
|
|
|
len: "'${name}' must equal ${len}",
|
|
|
min: "'${name}' cannot be less than ${min}",
|
|
|
max: "'${name}' cannot be greater than ${max}",
|
|
|
range: "'${name}' must be between ${min} and ${max}"
|
|
|
},
|
|
|
array: {
|
|
|
len: "'${name}' must be exactly ${len} in length",
|
|
|
min: "'${name}' cannot be less than ${min} in length",
|
|
|
max: "'${name}' cannot be greater than ${max} in length",
|
|
|
range: "'${name}' must be between ${min} and ${max} in length"
|
|
|
},
|
|
|
pattern: {
|
|
|
mismatch: "'${name}' does not match pattern ${pattern}"
|
|
|
}
|
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/typeUtil.js":
|
|
|
/*!*********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/typeUtil.js ***!
|
|
|
\*********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "toArray": () => (/* binding */ toArray)
|
|
|
/* harmony export */ });
|
|
|
function toArray(value) {
|
|
|
if (value === undefined || value === null) {
|
|
|
return [];
|
|
|
}
|
|
|
return Array.isArray(value) ? value : [value];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/validateUtil.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/validateUtil.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "validateRules": () => (/* binding */ validateRules)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/regeneratorRuntime */ "./node_modules/@babel/runtime/helpers/esm/regeneratorRuntime.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @babel/runtime/helpers/esm/asyncToGenerator */ "./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js");
|
|
|
/* harmony import */ var async_validator__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! async-validator */ "./node_modules/async-validator/dist-web/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_5__);
|
|
|
/* harmony import */ var rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! rc-util/es/warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
/* harmony import */ var _messages__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./messages */ "./node_modules/rc-field-form/es/utils/messages.js");
|
|
|
/* harmony import */ var _valueUtil__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./valueUtil */ "./node_modules/rc-field-form/es/utils/valueUtil.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Remove incorrect original ts define
|
|
|
var AsyncValidator = async_validator__WEBPACK_IMPORTED_MODULE_9__["default"];
|
|
|
/**
|
|
|
* Replace with template.
|
|
|
* `I'm ${name}` + { name: 'bamboo' } = I'm bamboo
|
|
|
*/
|
|
|
function replaceMessage(template, kv) {
|
|
|
return template.replace(/\$\{\w+\}/g, function (str) {
|
|
|
var key = str.slice(2, -1);
|
|
|
return kv[key];
|
|
|
});
|
|
|
}
|
|
|
var CODE_LOGIC_ERROR = 'CODE_LOGIC_ERROR';
|
|
|
function validateRule(_x, _x2, _x3, _x4, _x5) {
|
|
|
return _validateRule.apply(this, arguments);
|
|
|
}
|
|
|
/**
|
|
|
* We use `async-validator` to validate the value.
|
|
|
* But only check one value in a time to avoid namePath validate issue.
|
|
|
*/
|
|
|
function _validateRule() {
|
|
|
_validateRule = (0,_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_4__["default"])( /*#__PURE__*/(0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().mark(function _callee2(name, value, rule, options, messageVariables) {
|
|
|
var cloneRule, originValidator, subRuleField, validator, messages, result, subResults, kv, fillVariableResult;
|
|
|
return (0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().wrap(function _callee2$(_context2) {
|
|
|
while (1) switch (_context2.prev = _context2.next) {
|
|
|
case 0:
|
|
|
cloneRule = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, rule); // Bug of `async-validator`
|
|
|
// https://github.com/react-component/field-form/issues/316
|
|
|
// https://github.com/react-component/field-form/issues/313
|
|
|
delete cloneRule.ruleIndex;
|
|
|
if (cloneRule.validator) {
|
|
|
originValidator = cloneRule.validator;
|
|
|
cloneRule.validator = function () {
|
|
|
try {
|
|
|
return originValidator.apply(void 0, arguments);
|
|
|
} catch (error) {
|
|
|
console.error(error);
|
|
|
return Promise.reject(CODE_LOGIC_ERROR);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
// We should special handle array validate
|
|
|
subRuleField = null;
|
|
|
if (cloneRule && cloneRule.type === 'array' && cloneRule.defaultField) {
|
|
|
subRuleField = cloneRule.defaultField;
|
|
|
delete cloneRule.defaultField;
|
|
|
}
|
|
|
validator = new AsyncValidator((0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])({}, name, [cloneRule]));
|
|
|
messages = (0,_valueUtil__WEBPACK_IMPORTED_MODULE_8__.setValues)({}, _messages__WEBPACK_IMPORTED_MODULE_7__.defaultValidateMessages, options.validateMessages);
|
|
|
validator.messages(messages);
|
|
|
result = [];
|
|
|
_context2.prev = 9;
|
|
|
_context2.next = 12;
|
|
|
return Promise.resolve(validator.validate((0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])({}, name, value), (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, options)));
|
|
|
case 12:
|
|
|
_context2.next = 17;
|
|
|
break;
|
|
|
case 14:
|
|
|
_context2.prev = 14;
|
|
|
_context2.t0 = _context2["catch"](9);
|
|
|
if (_context2.t0.errors) {
|
|
|
result = _context2.t0.errors.map(function (_ref4, index) {
|
|
|
var message = _ref4.message;
|
|
|
var mergedMessage = message === CODE_LOGIC_ERROR ? messages.default : message;
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_5__.isValidElement(mergedMessage) ?
|
|
|
/*#__PURE__*/
|
|
|
// Wrap ReactNode with `key`
|
|
|
react__WEBPACK_IMPORTED_MODULE_5__.cloneElement(mergedMessage, {
|
|
|
key: "error_".concat(index)
|
|
|
}) : mergedMessage;
|
|
|
});
|
|
|
}
|
|
|
case 17:
|
|
|
if (!(!result.length && subRuleField)) {
|
|
|
_context2.next = 22;
|
|
|
break;
|
|
|
}
|
|
|
_context2.next = 20;
|
|
|
return Promise.all(value.map(function (subValue, i) {
|
|
|
return validateRule("".concat(name, ".").concat(i), subValue, subRuleField, options, messageVariables);
|
|
|
}));
|
|
|
case 20:
|
|
|
subResults = _context2.sent;
|
|
|
return _context2.abrupt("return", subResults.reduce(function (prev, errors) {
|
|
|
return [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__["default"])(prev), (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__["default"])(errors));
|
|
|
}, []));
|
|
|
case 22:
|
|
|
// Replace message with variables
|
|
|
kv = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, rule), {}, {
|
|
|
name: name,
|
|
|
enum: (rule.enum || []).join(', ')
|
|
|
}, messageVariables);
|
|
|
fillVariableResult = result.map(function (error) {
|
|
|
if (typeof error === 'string') {
|
|
|
return replaceMessage(error, kv);
|
|
|
}
|
|
|
return error;
|
|
|
});
|
|
|
return _context2.abrupt("return", fillVariableResult);
|
|
|
case 25:
|
|
|
case "end":
|
|
|
return _context2.stop();
|
|
|
}
|
|
|
}, _callee2, null, [[9, 14]]);
|
|
|
}));
|
|
|
return _validateRule.apply(this, arguments);
|
|
|
}
|
|
|
function validateRules(namePath, value, rules, options, validateFirst, messageVariables) {
|
|
|
var name = namePath.join('.');
|
|
|
// Fill rule with context
|
|
|
var filledRules = rules.map(function (currentRule, ruleIndex) {
|
|
|
var originValidatorFunc = currentRule.validator;
|
|
|
var cloneRule = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_3__["default"])({}, currentRule), {}, {
|
|
|
ruleIndex: ruleIndex
|
|
|
});
|
|
|
// Replace validator if needed
|
|
|
if (originValidatorFunc) {
|
|
|
cloneRule.validator = function (rule, val, callback) {
|
|
|
var hasPromise = false;
|
|
|
// Wrap callback only accept when promise not provided
|
|
|
var wrappedCallback = function wrappedCallback() {
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
args[_key] = arguments[_key];
|
|
|
}
|
|
|
// Wait a tick to make sure return type is a promise
|
|
|
Promise.resolve().then(function () {
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__["default"])(!hasPromise, 'Your validator function has already return a promise. `callback` will be ignored.');
|
|
|
if (!hasPromise) {
|
|
|
callback.apply(void 0, args);
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
// Get promise
|
|
|
var promise = originValidatorFunc(rule, val, wrappedCallback);
|
|
|
hasPromise = promise && typeof promise.then === 'function' && typeof promise.catch === 'function';
|
|
|
/**
|
|
|
* 1. Use promise as the first priority.
|
|
|
* 2. If promise not exist, use callback with warning instead
|
|
|
*/
|
|
|
(0,rc_util_es_warning__WEBPACK_IMPORTED_MODULE_6__["default"])(hasPromise, '`callback` is deprecated. Please return a promise instead.');
|
|
|
if (hasPromise) {
|
|
|
promise.then(function () {
|
|
|
callback();
|
|
|
}).catch(function (err) {
|
|
|
callback(err || ' ');
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
return cloneRule;
|
|
|
}).sort(function (_ref, _ref2) {
|
|
|
var w1 = _ref.warningOnly,
|
|
|
i1 = _ref.ruleIndex;
|
|
|
var w2 = _ref2.warningOnly,
|
|
|
i2 = _ref2.ruleIndex;
|
|
|
if (!!w1 === !!w2) {
|
|
|
// Let keep origin order
|
|
|
return i1 - i2;
|
|
|
}
|
|
|
if (w1) {
|
|
|
return 1;
|
|
|
}
|
|
|
return -1;
|
|
|
});
|
|
|
// Do validate rules
|
|
|
var summaryPromise;
|
|
|
if (validateFirst === true) {
|
|
|
// >>>>> Validate by serialization
|
|
|
summaryPromise = new Promise( /*#__PURE__*/function () {
|
|
|
var _ref3 = (0,_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_4__["default"])( /*#__PURE__*/(0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().mark(function _callee(resolve, reject) {
|
|
|
var i, rule, errors;
|
|
|
return (0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().wrap(function _callee$(_context) {
|
|
|
while (1) switch (_context.prev = _context.next) {
|
|
|
case 0:
|
|
|
i = 0;
|
|
|
case 1:
|
|
|
if (!(i < filledRules.length)) {
|
|
|
_context.next = 12;
|
|
|
break;
|
|
|
}
|
|
|
rule = filledRules[i];
|
|
|
_context.next = 5;
|
|
|
return validateRule(name, value, rule, options, messageVariables);
|
|
|
case 5:
|
|
|
errors = _context.sent;
|
|
|
if (!errors.length) {
|
|
|
_context.next = 9;
|
|
|
break;
|
|
|
}
|
|
|
reject([{
|
|
|
errors: errors,
|
|
|
rule: rule
|
|
|
}]);
|
|
|
return _context.abrupt("return");
|
|
|
case 9:
|
|
|
i += 1;
|
|
|
_context.next = 1;
|
|
|
break;
|
|
|
case 12:
|
|
|
/* eslint-enable */
|
|
|
resolve([]);
|
|
|
case 13:
|
|
|
case "end":
|
|
|
return _context.stop();
|
|
|
}
|
|
|
}, _callee);
|
|
|
}));
|
|
|
return function (_x6, _x7) {
|
|
|
return _ref3.apply(this, arguments);
|
|
|
};
|
|
|
}());
|
|
|
} else {
|
|
|
// >>>>> Validate by parallel
|
|
|
var rulePromises = filledRules.map(function (rule) {
|
|
|
return validateRule(name, value, rule, options, messageVariables).then(function (errors) {
|
|
|
return {
|
|
|
errors: errors,
|
|
|
rule: rule
|
|
|
};
|
|
|
});
|
|
|
});
|
|
|
summaryPromise = (validateFirst ? finishOnFirstFailed(rulePromises) : finishOnAllFailed(rulePromises)).then(function (errors) {
|
|
|
// Always change to rejection for Field to catch
|
|
|
return Promise.reject(errors);
|
|
|
});
|
|
|
}
|
|
|
// Internal catch error to avoid console error log.
|
|
|
summaryPromise.catch(function (e) {
|
|
|
return e;
|
|
|
});
|
|
|
return summaryPromise;
|
|
|
}
|
|
|
function finishOnAllFailed(_x8) {
|
|
|
return _finishOnAllFailed.apply(this, arguments);
|
|
|
}
|
|
|
function _finishOnAllFailed() {
|
|
|
_finishOnAllFailed = (0,_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_4__["default"])( /*#__PURE__*/(0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().mark(function _callee3(rulePromises) {
|
|
|
return (0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().wrap(function _callee3$(_context3) {
|
|
|
while (1) switch (_context3.prev = _context3.next) {
|
|
|
case 0:
|
|
|
return _context3.abrupt("return", Promise.all(rulePromises).then(function (errorsList) {
|
|
|
var _ref5;
|
|
|
var errors = (_ref5 = []).concat.apply(_ref5, (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_0__["default"])(errorsList));
|
|
|
return errors;
|
|
|
}));
|
|
|
case 1:
|
|
|
case "end":
|
|
|
return _context3.stop();
|
|
|
}
|
|
|
}, _callee3);
|
|
|
}));
|
|
|
return _finishOnAllFailed.apply(this, arguments);
|
|
|
}
|
|
|
function finishOnFirstFailed(_x9) {
|
|
|
return _finishOnFirstFailed.apply(this, arguments);
|
|
|
}
|
|
|
function _finishOnFirstFailed() {
|
|
|
_finishOnFirstFailed = (0,_babel_runtime_helpers_esm_asyncToGenerator__WEBPACK_IMPORTED_MODULE_4__["default"])( /*#__PURE__*/(0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().mark(function _callee4(rulePromises) {
|
|
|
var count;
|
|
|
return (0,_babel_runtime_helpers_esm_regeneratorRuntime__WEBPACK_IMPORTED_MODULE_2__["default"])().wrap(function _callee4$(_context4) {
|
|
|
while (1) switch (_context4.prev = _context4.next) {
|
|
|
case 0:
|
|
|
count = 0;
|
|
|
return _context4.abrupt("return", new Promise(function (resolve) {
|
|
|
rulePromises.forEach(function (promise) {
|
|
|
promise.then(function (ruleError) {
|
|
|
if (ruleError.errors.length) {
|
|
|
resolve([ruleError]);
|
|
|
}
|
|
|
count += 1;
|
|
|
if (count === rulePromises.length) {
|
|
|
resolve([]);
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
}));
|
|
|
case 2:
|
|
|
case "end":
|
|
|
return _context4.stop();
|
|
|
}
|
|
|
}, _callee4);
|
|
|
}));
|
|
|
return _finishOnFirstFailed.apply(this, arguments);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/es/utils/valueUtil.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/es/utils/valueUtil.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "cloneByNamePathList": () => (/* binding */ cloneByNamePathList),
|
|
|
/* harmony export */ "containsNamePath": () => (/* binding */ containsNamePath),
|
|
|
/* harmony export */ "defaultGetValueFromEvent": () => (/* binding */ defaultGetValueFromEvent),
|
|
|
/* harmony export */ "getNamePath": () => (/* binding */ getNamePath),
|
|
|
/* harmony export */ "getValue": () => (/* binding */ getValue),
|
|
|
/* harmony export */ "isSimilar": () => (/* binding */ isSimilar),
|
|
|
/* harmony export */ "matchNamePath": () => (/* binding */ matchNamePath),
|
|
|
/* harmony export */ "move": () => (/* binding */ move),
|
|
|
/* harmony export */ "setValue": () => (/* binding */ setValue),
|
|
|
/* harmony export */ "setValues": () => (/* binding */ setValues)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/typeof */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
/* harmony import */ var rc_util_es_utils_get__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/es/utils/get */ "./node_modules/rc-util/es/utils/get.js");
|
|
|
/* harmony import */ var rc_util_es_utils_set__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! rc-util/es/utils/set */ "./node_modules/rc-util/es/utils/set.js");
|
|
|
/* harmony import */ var _typeUtil__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./typeUtil */ "./node_modules/rc-field-form/es/utils/typeUtil.js");
|
|
|
/* harmony import */ var _utils_cloneDeep__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils/cloneDeep */ "./node_modules/rc-field-form/es/utils/cloneDeep.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
* Convert name to internal supported format.
|
|
|
* This function should keep since we still thinking if need support like `a.b.c` format.
|
|
|
* 'a' => ['a']
|
|
|
* 123 => [123]
|
|
|
* ['a', 123] => ['a', 123]
|
|
|
*/
|
|
|
function getNamePath(path) {
|
|
|
return (0,_typeUtil__WEBPACK_IMPORTED_MODULE_5__.toArray)(path);
|
|
|
}
|
|
|
function getValue(store, namePath) {
|
|
|
var value = (0,rc_util_es_utils_get__WEBPACK_IMPORTED_MODULE_3__["default"])(store, namePath);
|
|
|
return value;
|
|
|
}
|
|
|
function setValue(store, namePath, value) {
|
|
|
var removeIfUndefined = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
|
var newStore = (0,rc_util_es_utils_set__WEBPACK_IMPORTED_MODULE_4__["default"])(store, namePath, value, removeIfUndefined);
|
|
|
return newStore;
|
|
|
}
|
|
|
function cloneByNamePathList(store, namePathList) {
|
|
|
var newStore = {};
|
|
|
namePathList.forEach(function (namePath) {
|
|
|
var value = getValue(store, namePath);
|
|
|
newStore = setValue(newStore, namePath, value);
|
|
|
});
|
|
|
return newStore;
|
|
|
}
|
|
|
function containsNamePath(namePathList, namePath) {
|
|
|
return namePathList && namePathList.some(function (path) {
|
|
|
return matchNamePath(path, namePath);
|
|
|
});
|
|
|
}
|
|
|
function isObject(obj) {
|
|
|
return (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_2__["default"])(obj) === 'object' && obj !== null && Object.getPrototypeOf(obj) === Object.prototype;
|
|
|
}
|
|
|
/**
|
|
|
* Copy values into store and return a new values object
|
|
|
* ({ a: 1, b: { c: 2 } }, { a: 4, b: { d: 5 } }) => { a: 4, b: { c: 2, d: 5 } }
|
|
|
*/
|
|
|
function internalSetValues(store, values) {
|
|
|
var newStore = Array.isArray(store) ? (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(store) : (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, store);
|
|
|
if (!values) {
|
|
|
return newStore;
|
|
|
}
|
|
|
Object.keys(values).forEach(function (key) {
|
|
|
var prevValue = newStore[key];
|
|
|
var value = values[key];
|
|
|
// If both are object (but target is not array), we use recursion to set deep value
|
|
|
var recursive = isObject(prevValue) && isObject(value);
|
|
|
newStore[key] = recursive ? internalSetValues(prevValue, value || {}) : (0,_utils_cloneDeep__WEBPACK_IMPORTED_MODULE_6__["default"])(value); // Clone deep for arrays
|
|
|
});
|
|
|
|
|
|
return newStore;
|
|
|
}
|
|
|
function setValues(store) {
|
|
|
for (var _len = arguments.length, restValues = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
|
restValues[_key - 1] = arguments[_key];
|
|
|
}
|
|
|
return restValues.reduce(function (current, newStore) {
|
|
|
return internalSetValues(current, newStore);
|
|
|
}, store);
|
|
|
}
|
|
|
function matchNamePath(namePath, changedNamePath) {
|
|
|
if (!namePath || !changedNamePath || namePath.length !== changedNamePath.length) {
|
|
|
return false;
|
|
|
}
|
|
|
return namePath.every(function (nameUnit, i) {
|
|
|
return changedNamePath[i] === nameUnit;
|
|
|
});
|
|
|
}
|
|
|
function isSimilar(source, target) {
|
|
|
if (source === target) {
|
|
|
return true;
|
|
|
}
|
|
|
if (!source && target || source && !target) {
|
|
|
return false;
|
|
|
}
|
|
|
if (!source || !target || (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_2__["default"])(source) !== 'object' || (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_2__["default"])(target) !== 'object') {
|
|
|
return false;
|
|
|
}
|
|
|
var sourceKeys = Object.keys(source);
|
|
|
var targetKeys = Object.keys(target);
|
|
|
var keys = new Set([].concat(sourceKeys, targetKeys));
|
|
|
return (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(keys).every(function (key) {
|
|
|
var sourceValue = source[key];
|
|
|
var targetValue = target[key];
|
|
|
if (typeof sourceValue === 'function' && typeof targetValue === 'function') {
|
|
|
return true;
|
|
|
}
|
|
|
return sourceValue === targetValue;
|
|
|
});
|
|
|
}
|
|
|
function defaultGetValueFromEvent(valuePropName) {
|
|
|
var event = arguments.length <= 1 ? undefined : arguments[1];
|
|
|
if (event && event.target && (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_2__["default"])(event.target) === 'object' && valuePropName in event.target) {
|
|
|
return event.target[valuePropName];
|
|
|
}
|
|
|
return event;
|
|
|
}
|
|
|
/**
|
|
|
* Moves an array item from one position in an array to another.
|
|
|
*
|
|
|
* Note: This is a pure function so a new array will be returned, instead
|
|
|
* of altering the array argument.
|
|
|
*
|
|
|
* @param array Array in which to move an item. (required)
|
|
|
* @param moveIndex The index of the item to move. (required)
|
|
|
* @param toIndex The index to move item at moveIndex to. (required)
|
|
|
*/
|
|
|
function move(array, moveIndex, toIndex) {
|
|
|
var length = array.length;
|
|
|
if (moveIndex < 0 || moveIndex >= length || toIndex < 0 || toIndex >= length) {
|
|
|
return array;
|
|
|
}
|
|
|
var item = array[moveIndex];
|
|
|
var diff = moveIndex - toIndex;
|
|
|
if (diff > 0) {
|
|
|
// move left
|
|
|
return [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(array.slice(0, toIndex)), [item], (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(array.slice(toIndex, moveIndex)), (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(array.slice(moveIndex + 1, length)));
|
|
|
}
|
|
|
if (diff < 0) {
|
|
|
// move right
|
|
|
return [].concat((0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(array.slice(0, moveIndex)), (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(array.slice(moveIndex + 1, toIndex + 1)), [item], (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(array.slice(toIndex + 1, length)));
|
|
|
}
|
|
|
return array;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/lib/utils/cloneDeep.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/lib/utils/cloneDeep.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _typeof2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js"));
|
|
|
function cloneDeep(val) {
|
|
|
if (Array.isArray(val)) {
|
|
|
return cloneArrayDeep(val);
|
|
|
} else if ((0, _typeof2.default)(val) === 'object' && val !== null) {
|
|
|
return cloneObjectDeep(val);
|
|
|
}
|
|
|
return val;
|
|
|
}
|
|
|
function cloneObjectDeep(val) {
|
|
|
if (Object.getPrototypeOf(val) === Object.prototype) {
|
|
|
var res = {};
|
|
|
for (var key in val) {
|
|
|
res[key] = cloneDeep(val[key]);
|
|
|
}
|
|
|
return res;
|
|
|
}
|
|
|
return val;
|
|
|
}
|
|
|
function cloneArrayDeep(val) {
|
|
|
return val.map(function (item) {
|
|
|
return cloneDeep(item);
|
|
|
});
|
|
|
}
|
|
|
var _default = cloneDeep;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/lib/utils/typeUtil.js":
|
|
|
/*!**********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/lib/utils/typeUtil.js ***!
|
|
|
\**********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.toArray = toArray;
|
|
|
function toArray(value) {
|
|
|
if (value === undefined || value === null) {
|
|
|
return [];
|
|
|
}
|
|
|
return Array.isArray(value) ? value : [value];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-field-form/lib/utils/valueUtil.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/rc-field-form/lib/utils/valueUtil.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.cloneByNamePathList = cloneByNamePathList;
|
|
|
exports.containsNamePath = containsNamePath;
|
|
|
exports.defaultGetValueFromEvent = defaultGetValueFromEvent;
|
|
|
exports.getNamePath = getNamePath;
|
|
|
exports.getValue = getValue;
|
|
|
exports.isSimilar = isSimilar;
|
|
|
exports.matchNamePath = matchNamePath;
|
|
|
exports.move = move;
|
|
|
exports.setValue = setValue;
|
|
|
exports.setValues = setValues;
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var _toConsumableArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ "./node_modules/@babel/runtime/helpers/toConsumableArray.js"));
|
|
|
var _typeof2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js"));
|
|
|
var _get = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/utils/get */ "./node_modules/rc-util/lib/utils/get.js"));
|
|
|
var _set = _interopRequireDefault(__webpack_require__(/*! rc-util/lib/utils/set */ "./node_modules/rc-util/lib/utils/set.js"));
|
|
|
var _typeUtil = __webpack_require__(/*! ./typeUtil */ "./node_modules/rc-field-form/lib/utils/typeUtil.js");
|
|
|
var _cloneDeep = _interopRequireDefault(__webpack_require__(/*! ../utils/cloneDeep */ "./node_modules/rc-field-form/lib/utils/cloneDeep.js"));
|
|
|
/**
|
|
|
* Convert name to internal supported format.
|
|
|
* This function should keep since we still thinking if need support like `a.b.c` format.
|
|
|
* 'a' => ['a']
|
|
|
* 123 => [123]
|
|
|
* ['a', 123] => ['a', 123]
|
|
|
*/
|
|
|
function getNamePath(path) {
|
|
|
return (0, _typeUtil.toArray)(path);
|
|
|
}
|
|
|
function getValue(store, namePath) {
|
|
|
var value = (0, _get.default)(store, namePath);
|
|
|
return value;
|
|
|
}
|
|
|
function setValue(store, namePath, value) {
|
|
|
var removeIfUndefined = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
|
var newStore = (0, _set.default)(store, namePath, value, removeIfUndefined);
|
|
|
return newStore;
|
|
|
}
|
|
|
function cloneByNamePathList(store, namePathList) {
|
|
|
var newStore = {};
|
|
|
namePathList.forEach(function (namePath) {
|
|
|
var value = getValue(store, namePath);
|
|
|
newStore = setValue(newStore, namePath, value);
|
|
|
});
|
|
|
return newStore;
|
|
|
}
|
|
|
function containsNamePath(namePathList, namePath) {
|
|
|
return namePathList && namePathList.some(function (path) {
|
|
|
return matchNamePath(path, namePath);
|
|
|
});
|
|
|
}
|
|
|
function isObject(obj) {
|
|
|
return (0, _typeof2.default)(obj) === 'object' && obj !== null && Object.getPrototypeOf(obj) === Object.prototype;
|
|
|
}
|
|
|
/**
|
|
|
* Copy values into store and return a new values object
|
|
|
* ({ a: 1, b: { c: 2 } }, { a: 4, b: { d: 5 } }) => { a: 4, b: { c: 2, d: 5 } }
|
|
|
*/
|
|
|
function internalSetValues(store, values) {
|
|
|
var newStore = Array.isArray(store) ? (0, _toConsumableArray2.default)(store) : (0, _objectSpread2.default)({}, store);
|
|
|
if (!values) {
|
|
|
return newStore;
|
|
|
}
|
|
|
Object.keys(values).forEach(function (key) {
|
|
|
var prevValue = newStore[key];
|
|
|
var value = values[key];
|
|
|
// If both are object (but target is not array), we use recursion to set deep value
|
|
|
var recursive = isObject(prevValue) && isObject(value);
|
|
|
newStore[key] = recursive ? internalSetValues(prevValue, value || {}) : (0, _cloneDeep.default)(value); // Clone deep for arrays
|
|
|
});
|
|
|
|
|
|
return newStore;
|
|
|
}
|
|
|
function setValues(store) {
|
|
|
for (var _len = arguments.length, restValues = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
|
restValues[_key - 1] = arguments[_key];
|
|
|
}
|
|
|
return restValues.reduce(function (current, newStore) {
|
|
|
return internalSetValues(current, newStore);
|
|
|
}, store);
|
|
|
}
|
|
|
function matchNamePath(namePath, changedNamePath) {
|
|
|
if (!namePath || !changedNamePath || namePath.length !== changedNamePath.length) {
|
|
|
return false;
|
|
|
}
|
|
|
return namePath.every(function (nameUnit, i) {
|
|
|
return changedNamePath[i] === nameUnit;
|
|
|
});
|
|
|
}
|
|
|
function isSimilar(source, target) {
|
|
|
if (source === target) {
|
|
|
return true;
|
|
|
}
|
|
|
if (!source && target || source && !target) {
|
|
|
return false;
|
|
|
}
|
|
|
if (!source || !target || (0, _typeof2.default)(source) !== 'object' || (0, _typeof2.default)(target) !== 'object') {
|
|
|
return false;
|
|
|
}
|
|
|
var sourceKeys = Object.keys(source);
|
|
|
var targetKeys = Object.keys(target);
|
|
|
var keys = new Set([].concat(sourceKeys, targetKeys));
|
|
|
return (0, _toConsumableArray2.default)(keys).every(function (key) {
|
|
|
var sourceValue = source[key];
|
|
|
var targetValue = target[key];
|
|
|
if (typeof sourceValue === 'function' && typeof targetValue === 'function') {
|
|
|
return true;
|
|
|
}
|
|
|
return sourceValue === targetValue;
|
|
|
});
|
|
|
}
|
|
|
function defaultGetValueFromEvent(valuePropName) {
|
|
|
var event = arguments.length <= 1 ? undefined : arguments[1];
|
|
|
if (event && event.target && (0, _typeof2.default)(event.target) === 'object' && valuePropName in event.target) {
|
|
|
return event.target[valuePropName];
|
|
|
}
|
|
|
return event;
|
|
|
}
|
|
|
/**
|
|
|
* Moves an array item from one position in an array to another.
|
|
|
*
|
|
|
* Note: This is a pure function so a new array will be returned, instead
|
|
|
* of altering the array argument.
|
|
|
*
|
|
|
* @param array Array in which to move an item. (required)
|
|
|
* @param moveIndex The index of the item to move. (required)
|
|
|
* @param toIndex The index to move item at moveIndex to. (required)
|
|
|
*/
|
|
|
function move(array, moveIndex, toIndex) {
|
|
|
var length = array.length;
|
|
|
if (moveIndex < 0 || moveIndex >= length || toIndex < 0 || toIndex >= length) {
|
|
|
return array;
|
|
|
}
|
|
|
var item = array[moveIndex];
|
|
|
var diff = moveIndex - toIndex;
|
|
|
if (diff > 0) {
|
|
|
// move left
|
|
|
return [].concat((0, _toConsumableArray2.default)(array.slice(0, toIndex)), [item], (0, _toConsumableArray2.default)(array.slice(toIndex, moveIndex)), (0, _toConsumableArray2.default)(array.slice(moveIndex + 1, length)));
|
|
|
}
|
|
|
if (diff < 0) {
|
|
|
// move right
|
|
|
return [].concat((0, _toConsumableArray2.default)(array.slice(0, moveIndex)), (0, _toConsumableArray2.default)(array.slice(moveIndex + 1, toIndex + 1)), [item], (0, _toConsumableArray2.default)(array.slice(toIndex + 1, length)));
|
|
|
}
|
|
|
return array;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/CSSMotion.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/CSSMotion.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "genCSSMotion": () => (/* binding */ genCSSMotion)
|
|
|
/* harmony export */ });
|
|
|
/* 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");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/typeof */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
/* harmony import */ var rc_util_es_Dom_findDOMNode__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! rc-util/es/Dom/findDOMNode */ "./node_modules/rc-util/es/Dom/findDOMNode.js");
|
|
|
/* harmony import */ var rc_util_es_ref__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! rc-util/es/ref */ "./node_modules/rc-util/es/ref.js");
|
|
|
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js");
|
|
|
/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_7__);
|
|
|
/* harmony import */ var _util_motion__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./util/motion */ "./node_modules/rc-motion/es/util/motion.js");
|
|
|
/* harmony import */ var _interface__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./interface */ "./node_modules/rc-motion/es/interface.js");
|
|
|
/* harmony import */ var _hooks_useStatus__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./hooks/useStatus */ "./node_modules/rc-motion/es/hooks/useStatus.js");
|
|
|
/* harmony import */ var _DomWrapper__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./DomWrapper */ "./node_modules/rc-motion/es/DomWrapper.js");
|
|
|
/* harmony import */ var _hooks_useStepQueue__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./hooks/useStepQueue */ "./node_modules/rc-motion/es/hooks/useStepQueue.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* eslint-disable react/default-props-match-prop-types, react/no-multi-comp, react/prop-types */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
* `transitionSupport` is used for none transition test case.
|
|
|
* Default we use browser transition event support check.
|
|
|
*/
|
|
|
function genCSSMotion(config) {
|
|
|
var transitionSupport = config;
|
|
|
|
|
|
if ((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_3__["default"])(config) === 'object') {
|
|
|
transitionSupport = config.transitionSupport;
|
|
|
}
|
|
|
|
|
|
function isSupportTransition(props) {
|
|
|
return !!(props.motionName && transitionSupport);
|
|
|
}
|
|
|
|
|
|
var CSSMotion = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.forwardRef(function (props, ref) {
|
|
|
var _props$visible = props.visible,
|
|
|
visible = _props$visible === void 0 ? true : _props$visible,
|
|
|
_props$removeOnLeave = props.removeOnLeave,
|
|
|
removeOnLeave = _props$removeOnLeave === void 0 ? true : _props$removeOnLeave,
|
|
|
forceRender = props.forceRender,
|
|
|
children = props.children,
|
|
|
motionName = props.motionName,
|
|
|
leavedClassName = props.leavedClassName,
|
|
|
eventProps = props.eventProps;
|
|
|
var supportMotion = isSupportTransition(props); // Ref to the react node, it may be a HTMLElement
|
|
|
|
|
|
var nodeRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)(); // Ref to the dom wrapper in case ref can not pass to HTMLElement
|
|
|
|
|
|
var wrapperNodeRef = (0,react__WEBPACK_IMPORTED_MODULE_4__.useRef)();
|
|
|
|
|
|
function getDomElement() {
|
|
|
try {
|
|
|
// Here we're avoiding call for findDOMNode since it's deprecated
|
|
|
// in strict mode. We're calling it only when node ref is not
|
|
|
// an instance of DOM HTMLElement. Otherwise use
|
|
|
// findDOMNode as a final resort
|
|
|
return nodeRef.current instanceof HTMLElement ? nodeRef.current : (0,rc_util_es_Dom_findDOMNode__WEBPACK_IMPORTED_MODULE_5__["default"])(wrapperNodeRef.current);
|
|
|
} catch (e) {
|
|
|
// Only happen when `motionDeadline` trigger but element removed.
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var _useStatus = (0,_hooks_useStatus__WEBPACK_IMPORTED_MODULE_10__["default"])(supportMotion, visible, getDomElement, props),
|
|
|
_useStatus2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useStatus, 4),
|
|
|
status = _useStatus2[0],
|
|
|
statusStep = _useStatus2[1],
|
|
|
statusStyle = _useStatus2[2],
|
|
|
mergedVisible = _useStatus2[3]; // Record whether content has rendered
|
|
|
// Will return null for un-rendered even when `removeOnLeave={false}`
|
|
|
|
|
|
|
|
|
var renderedRef = react__WEBPACK_IMPORTED_MODULE_4__.useRef(mergedVisible);
|
|
|
|
|
|
if (mergedVisible) {
|
|
|
renderedRef.current = true;
|
|
|
} // ====================== Refs ======================
|
|
|
|
|
|
|
|
|
var setNodeRef = react__WEBPACK_IMPORTED_MODULE_4__.useCallback(function (node) {
|
|
|
nodeRef.current = node;
|
|
|
(0,rc_util_es_ref__WEBPACK_IMPORTED_MODULE_6__.fillRef)(ref, node);
|
|
|
}, [ref]); // ===================== Render =====================
|
|
|
|
|
|
var motionChildren;
|
|
|
|
|
|
var mergedProps = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, eventProps), {}, {
|
|
|
visible: visible
|
|
|
});
|
|
|
|
|
|
if (!children) {
|
|
|
// No children
|
|
|
motionChildren = null;
|
|
|
} else if (status === _interface__WEBPACK_IMPORTED_MODULE_9__.STATUS_NONE || !isSupportTransition(props)) {
|
|
|
// Stable children
|
|
|
if (mergedVisible) {
|
|
|
motionChildren = children((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, mergedProps), setNodeRef);
|
|
|
} else if (!removeOnLeave && renderedRef.current && leavedClassName) {
|
|
|
motionChildren = children((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, mergedProps), {}, {
|
|
|
className: leavedClassName
|
|
|
}), setNodeRef);
|
|
|
} else if (forceRender || !removeOnLeave && !leavedClassName) {
|
|
|
motionChildren = children((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, mergedProps), {}, {
|
|
|
style: {
|
|
|
display: 'none'
|
|
|
}
|
|
|
}), setNodeRef);
|
|
|
} else {
|
|
|
motionChildren = null;
|
|
|
}
|
|
|
} else {
|
|
|
var _classNames;
|
|
|
|
|
|
// In motion
|
|
|
var statusSuffix;
|
|
|
|
|
|
if (statusStep === _interface__WEBPACK_IMPORTED_MODULE_9__.STEP_PREPARE) {
|
|
|
statusSuffix = 'prepare';
|
|
|
} else if ((0,_hooks_useStepQueue__WEBPACK_IMPORTED_MODULE_12__.isActive)(statusStep)) {
|
|
|
statusSuffix = 'active';
|
|
|
} else if (statusStep === _interface__WEBPACK_IMPORTED_MODULE_9__.STEP_START) {
|
|
|
statusSuffix = 'start';
|
|
|
}
|
|
|
|
|
|
motionChildren = children((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_1__["default"])({}, mergedProps), {}, {
|
|
|
className: classnames__WEBPACK_IMPORTED_MODULE_7___default()((0,_util_motion__WEBPACK_IMPORTED_MODULE_8__.getTransitionName)(motionName, status), (_classNames = {}, (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["default"])(_classNames, (0,_util_motion__WEBPACK_IMPORTED_MODULE_8__.getTransitionName)(motionName, "".concat(status, "-").concat(statusSuffix)), statusSuffix), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_0__["default"])(_classNames, motionName, typeof motionName === 'string'), _classNames)),
|
|
|
style: statusStyle
|
|
|
}), setNodeRef);
|
|
|
} // Auto inject ref if child node not have `ref` props
|
|
|
|
|
|
|
|
|
if ( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.isValidElement(motionChildren) && (0,rc_util_es_ref__WEBPACK_IMPORTED_MODULE_6__.supportRef)(motionChildren)) {
|
|
|
var _ref = motionChildren,
|
|
|
originNodeRef = _ref.ref;
|
|
|
|
|
|
if (!originNodeRef) {
|
|
|
motionChildren = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.cloneElement(motionChildren, {
|
|
|
ref: setNodeRef
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_4__.createElement(_DomWrapper__WEBPACK_IMPORTED_MODULE_11__["default"], {
|
|
|
ref: wrapperNodeRef
|
|
|
}, motionChildren);
|
|
|
});
|
|
|
CSSMotion.displayName = 'CSSMotion';
|
|
|
return CSSMotion;
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (genCSSMotion(_util_motion__WEBPACK_IMPORTED_MODULE_8__.supportTransition));
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/CSSMotionList.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/CSSMotionList.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "genCSSMotionList": () => (/* binding */ genCSSMotionList)
|
|
|
/* harmony export */ });
|
|
|
/* 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_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectWithoutProperties */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.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_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @babel/runtime/helpers/esm/assertThisInitialized */ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @babel/runtime/helpers/esm/inherits */ "./node_modules/@babel/runtime/helpers/esm/inherits.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createSuper */ "./node_modules/@babel/runtime/helpers/esm/createSuper.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_9___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_9__);
|
|
|
/* harmony import */ var _CSSMotion__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./CSSMotion */ "./node_modules/rc-motion/es/CSSMotion.js");
|
|
|
/* harmony import */ var _util_motion__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./util/motion */ "./node_modules/rc-motion/es/util/motion.js");
|
|
|
/* harmony import */ var _util_diff__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./util/diff */ "./node_modules/rc-motion/es/util/diff.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var _excluded = ["component", "children", "onVisibleChanged", "onAllRemoved"],
|
|
|
_excluded2 = ["status"];
|
|
|
|
|
|
/* eslint react/prop-types: 0 */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var MOTION_PROP_NAMES = ['eventProps', 'visible', 'children', 'motionName', 'motionAppear', 'motionEnter', 'motionLeave', 'motionLeaveImmediately', 'motionDeadline', 'removeOnLeave', 'leavedClassName', 'onAppearStart', 'onAppearActive', 'onAppearEnd', 'onEnterStart', 'onEnterActive', 'onEnterEnd', 'onLeaveStart', 'onLeaveActive', 'onLeaveEnd'];
|
|
|
|
|
|
/**
|
|
|
* Generate a CSSMotionList component with config
|
|
|
* @param transitionSupport No need since CSSMotionList no longer depends on transition support
|
|
|
* @param CSSMotion CSSMotion component
|
|
|
*/
|
|
|
function genCSSMotionList(transitionSupport) {
|
|
|
var CSSMotion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _CSSMotion__WEBPACK_IMPORTED_MODULE_10__["default"];
|
|
|
|
|
|
var CSSMotionList = /*#__PURE__*/function (_React$Component) {
|
|
|
(0,_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_6__["default"])(CSSMotionList, _React$Component);
|
|
|
|
|
|
var _super = (0,_babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_7__["default"])(CSSMotionList);
|
|
|
|
|
|
function CSSMotionList() {
|
|
|
var _this;
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_3__["default"])(this, CSSMotionList);
|
|
|
|
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
args[_key] = arguments[_key];
|
|
|
}
|
|
|
|
|
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_8__["default"])((0,_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5__["default"])(_this), "state", {
|
|
|
keyEntities: []
|
|
|
});
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_8__["default"])((0,_babel_runtime_helpers_esm_assertThisInitialized__WEBPACK_IMPORTED_MODULE_5__["default"])(_this), "removeKey", function (removeKey) {
|
|
|
var keyEntities = _this.state.keyEntities;
|
|
|
var nextKeyEntities = keyEntities.map(function (entity) {
|
|
|
if (entity.key !== removeKey) return entity;
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_2__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_2__["default"])({}, entity), {}, {
|
|
|
status: _util_diff__WEBPACK_IMPORTED_MODULE_12__.STATUS_REMOVED
|
|
|
});
|
|
|
});
|
|
|
|
|
|
_this.setState({
|
|
|
keyEntities: nextKeyEntities
|
|
|
});
|
|
|
|
|
|
return nextKeyEntities.filter(function (_ref) {
|
|
|
var status = _ref.status;
|
|
|
return status !== _util_diff__WEBPACK_IMPORTED_MODULE_12__.STATUS_REMOVED;
|
|
|
}).length;
|
|
|
});
|
|
|
|
|
|
return _this;
|
|
|
}
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_4__["default"])(CSSMotionList, [{
|
|
|
key: "render",
|
|
|
value: function render() {
|
|
|
var _this2 = this;
|
|
|
|
|
|
var keyEntities = this.state.keyEntities;
|
|
|
|
|
|
var _this$props = this.props,
|
|
|
component = _this$props.component,
|
|
|
children = _this$props.children,
|
|
|
_onVisibleChanged = _this$props.onVisibleChanged,
|
|
|
onAllRemoved = _this$props.onAllRemoved,
|
|
|
restProps = (0,_babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__["default"])(_this$props, _excluded);
|
|
|
|
|
|
var Component = component || react__WEBPACK_IMPORTED_MODULE_9__.Fragment;
|
|
|
var motionProps = {};
|
|
|
MOTION_PROP_NAMES.forEach(function (prop) {
|
|
|
motionProps[prop] = restProps[prop];
|
|
|
delete restProps[prop];
|
|
|
});
|
|
|
delete restProps.keys;
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_9__.createElement(Component, restProps, keyEntities.map(function (_ref2) {
|
|
|
var status = _ref2.status,
|
|
|
eventProps = (0,_babel_runtime_helpers_esm_objectWithoutProperties__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref2, _excluded2);
|
|
|
|
|
|
var visible = status === _util_diff__WEBPACK_IMPORTED_MODULE_12__.STATUS_ADD || status === _util_diff__WEBPACK_IMPORTED_MODULE_12__.STATUS_KEEP;
|
|
|
return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_9__.createElement(CSSMotion, (0,_babel_runtime_helpers_esm_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, motionProps, {
|
|
|
key: eventProps.key,
|
|
|
visible: visible,
|
|
|
eventProps: eventProps,
|
|
|
onVisibleChanged: function onVisibleChanged(changedVisible) {
|
|
|
_onVisibleChanged === null || _onVisibleChanged === void 0 ? void 0 : _onVisibleChanged(changedVisible, {
|
|
|
key: eventProps.key
|
|
|
});
|
|
|
|
|
|
if (!changedVisible) {
|
|
|
var restKeysCount = _this2.removeKey(eventProps.key);
|
|
|
|
|
|
if (restKeysCount === 0 && onAllRemoved) {
|
|
|
onAllRemoved();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}), children);
|
|
|
}));
|
|
|
}
|
|
|
}], [{
|
|
|
key: "getDerivedStateFromProps",
|
|
|
value: function getDerivedStateFromProps(_ref3, _ref4) {
|
|
|
var keys = _ref3.keys;
|
|
|
var keyEntities = _ref4.keyEntities;
|
|
|
var parsedKeyObjects = (0,_util_diff__WEBPACK_IMPORTED_MODULE_12__.parseKeys)(keys);
|
|
|
var mixedKeyEntities = (0,_util_diff__WEBPACK_IMPORTED_MODULE_12__.diffKeys)(keyEntities, parsedKeyObjects);
|
|
|
return {
|
|
|
keyEntities: mixedKeyEntities.filter(function (entity) {
|
|
|
var prevEntity = keyEntities.find(function (_ref5) {
|
|
|
var key = _ref5.key;
|
|
|
return entity.key === key;
|
|
|
}); // Remove if already mark as removed
|
|
|
|
|
|
if (prevEntity && prevEntity.status === _util_diff__WEBPACK_IMPORTED_MODULE_12__.STATUS_REMOVED && entity.status === _util_diff__WEBPACK_IMPORTED_MODULE_12__.STATUS_REMOVE) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
})
|
|
|
};
|
|
|
} // ZombieJ: Return the count of rest keys. It's safe to refactor if need more info.
|
|
|
|
|
|
}]);
|
|
|
|
|
|
return CSSMotionList;
|
|
|
}(react__WEBPACK_IMPORTED_MODULE_9__.Component);
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_8__["default"])(CSSMotionList, "defaultProps", {
|
|
|
component: 'div'
|
|
|
});
|
|
|
|
|
|
return CSSMotionList;
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (genCSSMotionList(_util_motion__WEBPACK_IMPORTED_MODULE_11__.supportTransition));
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/DomWrapper.js":
|
|
|
/*!*************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/DomWrapper.js ***!
|
|
|
\*************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__ = __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_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createClass */ "./node_modules/@babel/runtime/helpers/esm/createClass.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/inherits */ "./node_modules/@babel/runtime/helpers/esm/inherits.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @babel/runtime/helpers/esm/createSuper */ "./node_modules/@babel/runtime/helpers/esm/createSuper.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var DomWrapper = /*#__PURE__*/function (_React$Component) {
|
|
|
(0,_babel_runtime_helpers_esm_inherits__WEBPACK_IMPORTED_MODULE_2__["default"])(DomWrapper, _React$Component);
|
|
|
|
|
|
var _super = (0,_babel_runtime_helpers_esm_createSuper__WEBPACK_IMPORTED_MODULE_3__["default"])(DomWrapper);
|
|
|
|
|
|
function DomWrapper() {
|
|
|
(0,_babel_runtime_helpers_esm_classCallCheck__WEBPACK_IMPORTED_MODULE_0__["default"])(this, DomWrapper);
|
|
|
|
|
|
return _super.apply(this, arguments);
|
|
|
}
|
|
|
|
|
|
(0,_babel_runtime_helpers_esm_createClass__WEBPACK_IMPORTED_MODULE_1__["default"])(DomWrapper, [{
|
|
|
key: "render",
|
|
|
value: function render() {
|
|
|
return this.props.children;
|
|
|
}
|
|
|
}]);
|
|
|
|
|
|
return DomWrapper;
|
|
|
}(react__WEBPACK_IMPORTED_MODULE_4__.Component);
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DomWrapper);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/hooks/useDomMotionEvents.js":
|
|
|
/*!***************************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/hooks/useDomMotionEvents.js ***!
|
|
|
\***************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var _util_motion__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../util/motion */ "./node_modules/rc-motion/es/util/motion.js");
|
|
|
|
|
|
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (function (callback) {
|
|
|
var cacheElementRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(); // Cache callback
|
|
|
|
|
|
var callbackRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(callback);
|
|
|
callbackRef.current = callback; // Internal motion event handler
|
|
|
|
|
|
var onInternalMotionEnd = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function (event) {
|
|
|
callbackRef.current(event);
|
|
|
}, []); // Remove events
|
|
|
|
|
|
function removeMotionEvents(element) {
|
|
|
if (element) {
|
|
|
element.removeEventListener(_util_motion__WEBPACK_IMPORTED_MODULE_1__.transitionEndName, onInternalMotionEnd);
|
|
|
element.removeEventListener(_util_motion__WEBPACK_IMPORTED_MODULE_1__.animationEndName, onInternalMotionEnd);
|
|
|
}
|
|
|
} // Patch events
|
|
|
|
|
|
|
|
|
function patchMotionEvents(element) {
|
|
|
if (cacheElementRef.current && cacheElementRef.current !== element) {
|
|
|
removeMotionEvents(cacheElementRef.current);
|
|
|
}
|
|
|
|
|
|
if (element && element !== cacheElementRef.current) {
|
|
|
element.addEventListener(_util_motion__WEBPACK_IMPORTED_MODULE_1__.transitionEndName, onInternalMotionEnd);
|
|
|
element.addEventListener(_util_motion__WEBPACK_IMPORTED_MODULE_1__.animationEndName, onInternalMotionEnd); // Save as cache in case dom removed trigger by `motionDeadline`
|
|
|
|
|
|
cacheElementRef.current = element;
|
|
|
}
|
|
|
} // Clean up when removed
|
|
|
|
|
|
|
|
|
react__WEBPACK_IMPORTED_MODULE_0__.useEffect(function () {
|
|
|
return function () {
|
|
|
removeMotionEvents(cacheElementRef.current);
|
|
|
};
|
|
|
}, []);
|
|
|
return [patchMotionEvents, removeMotionEvents];
|
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/hooks/useIsomorphicLayoutEffect.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/hooks/useIsomorphicLayoutEffect.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! rc-util/es/Dom/canUseDom */ "./node_modules/rc-util/es/Dom/canUseDom.js");
|
|
|
|
|
|
// It's safe to use `useLayoutEffect` but the warning is annoying
|
|
|
|
|
|
var useIsomorphicLayoutEffect = (0,rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_1__["default"])() ? react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect : react__WEBPACK_IMPORTED_MODULE_0__.useEffect;
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useIsomorphicLayoutEffect);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/hooks/useNextFrame.js":
|
|
|
/*!*********************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/hooks/useNextFrame.js ***!
|
|
|
\*********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var rc_util_es_raf__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! rc-util/es/raf */ "./node_modules/rc-util/es/raf.js");
|
|
|
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (function () {
|
|
|
var nextFrameRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(null);
|
|
|
|
|
|
function cancelNextFrame() {
|
|
|
rc_util_es_raf__WEBPACK_IMPORTED_MODULE_1__["default"].cancel(nextFrameRef.current);
|
|
|
}
|
|
|
|
|
|
function nextFrame(callback) {
|
|
|
var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
|
|
|
cancelNextFrame();
|
|
|
var nextFrameId = (0,rc_util_es_raf__WEBPACK_IMPORTED_MODULE_1__["default"])(function () {
|
|
|
if (delay <= 1) {
|
|
|
callback({
|
|
|
isCanceled: function isCanceled() {
|
|
|
return nextFrameId !== nextFrameRef.current;
|
|
|
}
|
|
|
});
|
|
|
} else {
|
|
|
nextFrame(callback, delay - 1);
|
|
|
}
|
|
|
});
|
|
|
nextFrameRef.current = nextFrameId;
|
|
|
}
|
|
|
|
|
|
react__WEBPACK_IMPORTED_MODULE_0__.useEffect(function () {
|
|
|
return function () {
|
|
|
cancelNextFrame();
|
|
|
};
|
|
|
}, []);
|
|
|
return [nextFrame, cancelNextFrame];
|
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/hooks/useStatus.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/hooks/useStatus.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ useStatus)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/defineProperty */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_3__);
|
|
|
/* harmony import */ var rc_util_es_hooks_useState__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! rc-util/es/hooks/useState */ "./node_modules/rc-util/es/hooks/useState.js");
|
|
|
/* harmony import */ var _interface__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../interface */ "./node_modules/rc-motion/es/interface.js");
|
|
|
/* harmony import */ var _useStepQueue__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./useStepQueue */ "./node_modules/rc-motion/es/hooks/useStepQueue.js");
|
|
|
/* harmony import */ var _useDomMotionEvents__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./useDomMotionEvents */ "./node_modules/rc-motion/es/hooks/useDomMotionEvents.js");
|
|
|
/* harmony import */ var _useIsomorphicLayoutEffect__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./useIsomorphicLayoutEffect */ "./node_modules/rc-motion/es/hooks/useIsomorphicLayoutEffect.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function useStatus(supportMotion, visible, getElement, _ref) {
|
|
|
var _ref$motionEnter = _ref.motionEnter,
|
|
|
motionEnter = _ref$motionEnter === void 0 ? true : _ref$motionEnter,
|
|
|
_ref$motionAppear = _ref.motionAppear,
|
|
|
motionAppear = _ref$motionAppear === void 0 ? true : _ref$motionAppear,
|
|
|
_ref$motionLeave = _ref.motionLeave,
|
|
|
motionLeave = _ref$motionLeave === void 0 ? true : _ref$motionLeave,
|
|
|
motionDeadline = _ref.motionDeadline,
|
|
|
motionLeaveImmediately = _ref.motionLeaveImmediately,
|
|
|
onAppearPrepare = _ref.onAppearPrepare,
|
|
|
onEnterPrepare = _ref.onEnterPrepare,
|
|
|
onLeavePrepare = _ref.onLeavePrepare,
|
|
|
onAppearStart = _ref.onAppearStart,
|
|
|
onEnterStart = _ref.onEnterStart,
|
|
|
onLeaveStart = _ref.onLeaveStart,
|
|
|
onAppearActive = _ref.onAppearActive,
|
|
|
onEnterActive = _ref.onEnterActive,
|
|
|
onLeaveActive = _ref.onLeaveActive,
|
|
|
onAppearEnd = _ref.onAppearEnd,
|
|
|
onEnterEnd = _ref.onEnterEnd,
|
|
|
onLeaveEnd = _ref.onLeaveEnd,
|
|
|
onVisibleChanged = _ref.onVisibleChanged;
|
|
|
|
|
|
// Used for outer render usage to avoid `visible: false & status: none` to render nothing
|
|
|
var _useState = (0,rc_util_es_hooks_useState__WEBPACK_IMPORTED_MODULE_4__["default"])(),
|
|
|
_useState2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useState, 2),
|
|
|
asyncVisible = _useState2[0],
|
|
|
setAsyncVisible = _useState2[1];
|
|
|
|
|
|
var _useState3 = (0,rc_util_es_hooks_useState__WEBPACK_IMPORTED_MODULE_4__["default"])(_interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_NONE),
|
|
|
_useState4 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useState3, 2),
|
|
|
status = _useState4[0],
|
|
|
setStatus = _useState4[1];
|
|
|
|
|
|
var _useState5 = (0,rc_util_es_hooks_useState__WEBPACK_IMPORTED_MODULE_4__["default"])(null),
|
|
|
_useState6 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useState5, 2),
|
|
|
style = _useState6[0],
|
|
|
setStyle = _useState6[1];
|
|
|
|
|
|
var mountedRef = (0,react__WEBPACK_IMPORTED_MODULE_3__.useRef)(false);
|
|
|
var deadlineRef = (0,react__WEBPACK_IMPORTED_MODULE_3__.useRef)(null); // =========================== Dom Node ===========================
|
|
|
|
|
|
function getDomElement() {
|
|
|
return getElement();
|
|
|
} // ========================== Motion End ==========================
|
|
|
|
|
|
|
|
|
var activeRef = (0,react__WEBPACK_IMPORTED_MODULE_3__.useRef)(false);
|
|
|
|
|
|
function onInternalMotionEnd(event) {
|
|
|
var element = getDomElement();
|
|
|
|
|
|
if (event && !event.deadline && event.target !== element) {
|
|
|
// event exists
|
|
|
// not initiated by deadline
|
|
|
// transitionEnd not fired by inner elements
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var currentActive = activeRef.current;
|
|
|
var canEnd;
|
|
|
|
|
|
if (status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_APPEAR && currentActive) {
|
|
|
canEnd = onAppearEnd === null || onAppearEnd === void 0 ? void 0 : onAppearEnd(element, event);
|
|
|
} else if (status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_ENTER && currentActive) {
|
|
|
canEnd = onEnterEnd === null || onEnterEnd === void 0 ? void 0 : onEnterEnd(element, event);
|
|
|
} else if (status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_LEAVE && currentActive) {
|
|
|
canEnd = onLeaveEnd === null || onLeaveEnd === void 0 ? void 0 : onLeaveEnd(element, event);
|
|
|
} // Only update status when `canEnd` and not destroyed
|
|
|
|
|
|
|
|
|
if (status !== _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_NONE && currentActive && canEnd !== false) {
|
|
|
setStatus(_interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_NONE, true);
|
|
|
setStyle(null, true);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var _useDomMotionEvents = (0,_useDomMotionEvents__WEBPACK_IMPORTED_MODULE_7__["default"])(onInternalMotionEnd),
|
|
|
_useDomMotionEvents2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useDomMotionEvents, 1),
|
|
|
patchMotionEvents = _useDomMotionEvents2[0]; // ============================= Step =============================
|
|
|
|
|
|
|
|
|
var eventHandlers = react__WEBPACK_IMPORTED_MODULE_3__.useMemo(function () {
|
|
|
var _ref2, _ref3, _ref4;
|
|
|
|
|
|
switch (status) {
|
|
|
case _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_APPEAR:
|
|
|
return _ref2 = {}, (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref2, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_PREPARE, onAppearPrepare), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref2, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_START, onAppearStart), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref2, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_ACTIVE, onAppearActive), _ref2;
|
|
|
|
|
|
case _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_ENTER:
|
|
|
return _ref3 = {}, (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref3, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_PREPARE, onEnterPrepare), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref3, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_START, onEnterStart), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref3, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_ACTIVE, onEnterActive), _ref3;
|
|
|
|
|
|
case _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_LEAVE:
|
|
|
return _ref4 = {}, (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref4, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_PREPARE, onLeavePrepare), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref4, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_START, onLeaveStart), (0,_babel_runtime_helpers_esm_defineProperty__WEBPACK_IMPORTED_MODULE_1__["default"])(_ref4, _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_ACTIVE, onLeaveActive), _ref4;
|
|
|
|
|
|
default:
|
|
|
return {};
|
|
|
}
|
|
|
}, [status]);
|
|
|
|
|
|
var _useStepQueue = (0,_useStepQueue__WEBPACK_IMPORTED_MODULE_6__["default"])(status, function (newStep) {
|
|
|
// Only prepare step can be skip
|
|
|
if (newStep === _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_PREPARE) {
|
|
|
var onPrepare = eventHandlers[_interface__WEBPACK_IMPORTED_MODULE_5__.STEP_PREPARE];
|
|
|
|
|
|
if (!onPrepare) {
|
|
|
return _useStepQueue__WEBPACK_IMPORTED_MODULE_6__.SkipStep;
|
|
|
}
|
|
|
|
|
|
return onPrepare(getDomElement());
|
|
|
} // Rest step is sync update
|
|
|
|
|
|
|
|
|
if (step in eventHandlers) {
|
|
|
var _eventHandlers$step;
|
|
|
|
|
|
setStyle(((_eventHandlers$step = eventHandlers[step]) === null || _eventHandlers$step === void 0 ? void 0 : _eventHandlers$step.call(eventHandlers, getDomElement(), null)) || null);
|
|
|
}
|
|
|
|
|
|
if (step === _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_ACTIVE) {
|
|
|
// Patch events when motion needed
|
|
|
patchMotionEvents(getDomElement());
|
|
|
|
|
|
if (motionDeadline > 0) {
|
|
|
clearTimeout(deadlineRef.current);
|
|
|
deadlineRef.current = setTimeout(function () {
|
|
|
onInternalMotionEnd({
|
|
|
deadline: true
|
|
|
});
|
|
|
}, motionDeadline);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return _useStepQueue__WEBPACK_IMPORTED_MODULE_6__.DoStep;
|
|
|
}),
|
|
|
_useStepQueue2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_2__["default"])(_useStepQueue, 2),
|
|
|
startStep = _useStepQueue2[0],
|
|
|
step = _useStepQueue2[1];
|
|
|
|
|
|
var active = (0,_useStepQueue__WEBPACK_IMPORTED_MODULE_6__.isActive)(step);
|
|
|
activeRef.current = active; // ============================ Status ============================
|
|
|
// Update with new status
|
|
|
|
|
|
(0,_useIsomorphicLayoutEffect__WEBPACK_IMPORTED_MODULE_8__["default"])(function () {
|
|
|
setAsyncVisible(visible);
|
|
|
var isMounted = mountedRef.current;
|
|
|
mountedRef.current = true;
|
|
|
|
|
|
if (!supportMotion) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var nextStatus; // Appear
|
|
|
|
|
|
if (!isMounted && visible && motionAppear) {
|
|
|
nextStatus = _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_APPEAR;
|
|
|
} // Enter
|
|
|
|
|
|
|
|
|
if (isMounted && visible && motionEnter) {
|
|
|
nextStatus = _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_ENTER;
|
|
|
} // Leave
|
|
|
|
|
|
|
|
|
if (isMounted && !visible && motionLeave || !isMounted && motionLeaveImmediately && !visible && motionLeave) {
|
|
|
nextStatus = _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_LEAVE;
|
|
|
} // Update to next status
|
|
|
|
|
|
|
|
|
if (nextStatus) {
|
|
|
setStatus(nextStatus);
|
|
|
startStep();
|
|
|
}
|
|
|
}, [visible]); // ============================ Effect ============================
|
|
|
// Reset when motion changed
|
|
|
|
|
|
(0,react__WEBPACK_IMPORTED_MODULE_3__.useEffect)(function () {
|
|
|
if ( // Cancel appear
|
|
|
status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_APPEAR && !motionAppear || // Cancel enter
|
|
|
status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_ENTER && !motionEnter || // Cancel leave
|
|
|
status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_LEAVE && !motionLeave) {
|
|
|
setStatus(_interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_NONE);
|
|
|
}
|
|
|
}, [motionAppear, motionEnter, motionLeave]);
|
|
|
(0,react__WEBPACK_IMPORTED_MODULE_3__.useEffect)(function () {
|
|
|
return function () {
|
|
|
mountedRef.current = false;
|
|
|
clearTimeout(deadlineRef.current);
|
|
|
};
|
|
|
}, []); // Trigger `onVisibleChanged`
|
|
|
|
|
|
var firstMountChangeRef = react__WEBPACK_IMPORTED_MODULE_3__.useRef(false);
|
|
|
(0,react__WEBPACK_IMPORTED_MODULE_3__.useEffect)(function () {
|
|
|
// [visible & motion not end] => [!visible & motion end] still need trigger onVisibleChanged
|
|
|
if (asyncVisible) {
|
|
|
firstMountChangeRef.current = true;
|
|
|
}
|
|
|
|
|
|
if (asyncVisible !== undefined && status === _interface__WEBPACK_IMPORTED_MODULE_5__.STATUS_NONE) {
|
|
|
// Skip first render is invisible since it's nothing changed
|
|
|
if (firstMountChangeRef.current || asyncVisible) {
|
|
|
onVisibleChanged === null || onVisibleChanged === void 0 ? void 0 : onVisibleChanged(asyncVisible);
|
|
|
}
|
|
|
|
|
|
firstMountChangeRef.current = true;
|
|
|
}
|
|
|
}, [asyncVisible, status]); // ============================ Styles ============================
|
|
|
|
|
|
var mergedStyle = style;
|
|
|
|
|
|
if (eventHandlers[_interface__WEBPACK_IMPORTED_MODULE_5__.STEP_PREPARE] && step === _interface__WEBPACK_IMPORTED_MODULE_5__.STEP_START) {
|
|
|
mergedStyle = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({
|
|
|
transition: 'none'
|
|
|
}, mergedStyle);
|
|
|
}
|
|
|
|
|
|
return [status, step, mergedStyle, asyncVisible !== null && asyncVisible !== void 0 ? asyncVisible : visible];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/hooks/useStepQueue.js":
|
|
|
/*!*********************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/hooks/useStepQueue.js ***!
|
|
|
\*********************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "DoStep": () => (/* binding */ DoStep),
|
|
|
/* harmony export */ "SkipStep": () => (/* binding */ SkipStep),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "isActive": () => (/* binding */ isActive)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
/* harmony import */ var rc_util_es_hooks_useState__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! rc-util/es/hooks/useState */ "./node_modules/rc-util/es/hooks/useState.js");
|
|
|
/* harmony import */ var _interface__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../interface */ "./node_modules/rc-motion/es/interface.js");
|
|
|
/* harmony import */ var _useNextFrame__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./useNextFrame */ "./node_modules/rc-motion/es/hooks/useNextFrame.js");
|
|
|
/* harmony import */ var _useIsomorphicLayoutEffect__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./useIsomorphicLayoutEffect */ "./node_modules/rc-motion/es/hooks/useIsomorphicLayoutEffect.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var STEP_QUEUE = [_interface__WEBPACK_IMPORTED_MODULE_3__.STEP_PREPARE, _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_START, _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_ACTIVE, _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_ACTIVATED];
|
|
|
/** Skip current step */
|
|
|
|
|
|
var SkipStep = false;
|
|
|
/** Current step should be update in */
|
|
|
|
|
|
var DoStep = true;
|
|
|
function isActive(step) {
|
|
|
return step === _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_ACTIVE || step === _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_ACTIVATED;
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (function (status, callback) {
|
|
|
var _useState = (0,rc_util_es_hooks_useState__WEBPACK_IMPORTED_MODULE_2__["default"])(_interface__WEBPACK_IMPORTED_MODULE_3__.STEP_NONE),
|
|
|
_useState2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_useState, 2),
|
|
|
step = _useState2[0],
|
|
|
setStep = _useState2[1];
|
|
|
|
|
|
var _useNextFrame = (0,_useNextFrame__WEBPACK_IMPORTED_MODULE_4__["default"])(),
|
|
|
_useNextFrame2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_useNextFrame, 2),
|
|
|
nextFrame = _useNextFrame2[0],
|
|
|
cancelNextFrame = _useNextFrame2[1];
|
|
|
|
|
|
function startQueue() {
|
|
|
setStep(_interface__WEBPACK_IMPORTED_MODULE_3__.STEP_PREPARE, true);
|
|
|
}
|
|
|
|
|
|
(0,_useIsomorphicLayoutEffect__WEBPACK_IMPORTED_MODULE_5__["default"])(function () {
|
|
|
if (step !== _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_NONE && step !== _interface__WEBPACK_IMPORTED_MODULE_3__.STEP_ACTIVATED) {
|
|
|
var index = STEP_QUEUE.indexOf(step);
|
|
|
var nextStep = STEP_QUEUE[index + 1];
|
|
|
var result = callback(step);
|
|
|
|
|
|
if (result === SkipStep) {
|
|
|
// Skip when no needed
|
|
|
setStep(nextStep, true);
|
|
|
} else {
|
|
|
// Do as frame for step update
|
|
|
nextFrame(function (info) {
|
|
|
function doNext() {
|
|
|
// Skip since current queue is ood
|
|
|
if (info.isCanceled()) return;
|
|
|
setStep(nextStep, true);
|
|
|
}
|
|
|
|
|
|
if (result === true) {
|
|
|
doNext();
|
|
|
} else {
|
|
|
// Only promise should be async
|
|
|
Promise.resolve(result).then(doNext);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
}, [status, step]);
|
|
|
react__WEBPACK_IMPORTED_MODULE_1__.useEffect(function () {
|
|
|
return function () {
|
|
|
cancelNextFrame();
|
|
|
};
|
|
|
}, []);
|
|
|
return [startQueue, step];
|
|
|
});
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/index.js":
|
|
|
/*!********************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/index.js ***!
|
|
|
\********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "CSSMotionList": () => (/* reexport safe */ _CSSMotionList__WEBPACK_IMPORTED_MODULE_1__["default"]),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _CSSMotion__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./CSSMotion */ "./node_modules/rc-motion/es/CSSMotion.js");
|
|
|
/* harmony import */ var _CSSMotionList__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CSSMotionList */ "./node_modules/rc-motion/es/CSSMotionList.js");
|
|
|
|
|
|
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_CSSMotion__WEBPACK_IMPORTED_MODULE_0__["default"]);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/interface.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/interface.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "STATUS_APPEAR": () => (/* binding */ STATUS_APPEAR),
|
|
|
/* harmony export */ "STATUS_ENTER": () => (/* binding */ STATUS_ENTER),
|
|
|
/* harmony export */ "STATUS_LEAVE": () => (/* binding */ STATUS_LEAVE),
|
|
|
/* harmony export */ "STATUS_NONE": () => (/* binding */ STATUS_NONE),
|
|
|
/* harmony export */ "STEP_ACTIVATED": () => (/* binding */ STEP_ACTIVATED),
|
|
|
/* harmony export */ "STEP_ACTIVE": () => (/* binding */ STEP_ACTIVE),
|
|
|
/* harmony export */ "STEP_NONE": () => (/* binding */ STEP_NONE),
|
|
|
/* harmony export */ "STEP_PREPARE": () => (/* binding */ STEP_PREPARE),
|
|
|
/* harmony export */ "STEP_START": () => (/* binding */ STEP_START)
|
|
|
/* harmony export */ });
|
|
|
var STATUS_NONE = 'none';
|
|
|
var STATUS_APPEAR = 'appear';
|
|
|
var STATUS_ENTER = 'enter';
|
|
|
var STATUS_LEAVE = 'leave';
|
|
|
var STEP_NONE = 'none';
|
|
|
var STEP_PREPARE = 'prepare';
|
|
|
var STEP_START = 'start';
|
|
|
var STEP_ACTIVE = 'active';
|
|
|
var STEP_ACTIVATED = 'end';
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/util/diff.js":
|
|
|
/*!************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/util/diff.js ***!
|
|
|
\************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "STATUS_ADD": () => (/* binding */ STATUS_ADD),
|
|
|
/* harmony export */ "STATUS_KEEP": () => (/* binding */ STATUS_KEEP),
|
|
|
/* harmony export */ "STATUS_REMOVE": () => (/* binding */ STATUS_REMOVE),
|
|
|
/* harmony export */ "STATUS_REMOVED": () => (/* binding */ STATUS_REMOVED),
|
|
|
/* harmony export */ "diffKeys": () => (/* binding */ diffKeys),
|
|
|
/* harmony export */ "parseKeys": () => (/* binding */ parseKeys),
|
|
|
/* harmony export */ "wrapKeyToObject": () => (/* binding */ wrapKeyToObject)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/typeof */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
|
|
|
|
|
|
var STATUS_ADD = 'add';
|
|
|
var STATUS_KEEP = 'keep';
|
|
|
var STATUS_REMOVE = 'remove';
|
|
|
var STATUS_REMOVED = 'removed';
|
|
|
function wrapKeyToObject(key) {
|
|
|
var keyObj;
|
|
|
|
|
|
if (key && (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_1__["default"])(key) === 'object' && 'key' in key) {
|
|
|
keyObj = key;
|
|
|
} else {
|
|
|
keyObj = {
|
|
|
key: key
|
|
|
};
|
|
|
}
|
|
|
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, keyObj), {}, {
|
|
|
key: String(keyObj.key)
|
|
|
});
|
|
|
}
|
|
|
function parseKeys() {
|
|
|
var keys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
|
return keys.map(wrapKeyToObject);
|
|
|
}
|
|
|
function diffKeys() {
|
|
|
var prevKeys = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
|
var currentKeys = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
|
var list = [];
|
|
|
var currentIndex = 0;
|
|
|
var currentLen = currentKeys.length;
|
|
|
var prevKeyObjects = parseKeys(prevKeys);
|
|
|
var currentKeyObjects = parseKeys(currentKeys); // Check prev keys to insert or keep
|
|
|
|
|
|
prevKeyObjects.forEach(function (keyObj) {
|
|
|
var hit = false;
|
|
|
|
|
|
for (var i = currentIndex; i < currentLen; i += 1) {
|
|
|
var currentKeyObj = currentKeyObjects[i];
|
|
|
|
|
|
if (currentKeyObj.key === keyObj.key) {
|
|
|
// New added keys should add before current key
|
|
|
if (currentIndex < i) {
|
|
|
list = list.concat(currentKeyObjects.slice(currentIndex, i).map(function (obj) {
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, obj), {}, {
|
|
|
status: STATUS_ADD
|
|
|
});
|
|
|
}));
|
|
|
currentIndex = i;
|
|
|
}
|
|
|
|
|
|
list.push((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, currentKeyObj), {}, {
|
|
|
status: STATUS_KEEP
|
|
|
}));
|
|
|
currentIndex += 1;
|
|
|
hit = true;
|
|
|
break;
|
|
|
}
|
|
|
} // If not hit, it means key is removed
|
|
|
|
|
|
|
|
|
if (!hit) {
|
|
|
list.push((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, keyObj), {}, {
|
|
|
status: STATUS_REMOVE
|
|
|
}));
|
|
|
}
|
|
|
}); // Add rest to the list
|
|
|
|
|
|
if (currentIndex < currentLen) {
|
|
|
list = list.concat(currentKeyObjects.slice(currentIndex).map(function (obj) {
|
|
|
return (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])((0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, obj), {}, {
|
|
|
status: STATUS_ADD
|
|
|
});
|
|
|
}));
|
|
|
}
|
|
|
/**
|
|
|
* Merge same key when it remove and add again:
|
|
|
* [1 - add, 2 - keep, 1 - remove] -> [1 - keep, 2 - keep]
|
|
|
*/
|
|
|
|
|
|
|
|
|
var keys = {};
|
|
|
list.forEach(function (_ref) {
|
|
|
var key = _ref.key;
|
|
|
keys[key] = (keys[key] || 0) + 1;
|
|
|
});
|
|
|
var duplicatedKeys = Object.keys(keys).filter(function (key) {
|
|
|
return keys[key] > 1;
|
|
|
});
|
|
|
duplicatedKeys.forEach(function (matchKey) {
|
|
|
// Remove `STATUS_REMOVE` node.
|
|
|
list = list.filter(function (_ref2) {
|
|
|
var key = _ref2.key,
|
|
|
status = _ref2.status;
|
|
|
return key !== matchKey || status !== STATUS_REMOVE;
|
|
|
}); // Update `STATUS_ADD` to `STATUS_KEEP`
|
|
|
|
|
|
list.forEach(function (node) {
|
|
|
if (node.key === matchKey) {
|
|
|
// eslint-disable-next-line no-param-reassign
|
|
|
node.status = STATUS_KEEP;
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
return list;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-motion/es/util/motion.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/rc-motion/es/util/motion.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "animationEndName": () => (/* binding */ animationEndName),
|
|
|
/* harmony export */ "getTransitionName": () => (/* binding */ getTransitionName),
|
|
|
/* harmony export */ "getVendorPrefixedEventName": () => (/* binding */ getVendorPrefixedEventName),
|
|
|
/* harmony export */ "getVendorPrefixes": () => (/* binding */ getVendorPrefixes),
|
|
|
/* harmony export */ "supportTransition": () => (/* binding */ supportTransition),
|
|
|
/* harmony export */ "transitionEndName": () => (/* binding */ transitionEndName)
|
|
|
/* harmony export */ });
|
|
|
/* 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 rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! rc-util/es/Dom/canUseDom */ "./node_modules/rc-util/es/Dom/canUseDom.js");
|
|
|
|
|
|
|
|
|
|
|
|
// ================= Transition =================
|
|
|
// Event wrapper. Copy from react source code
|
|
|
function makePrefixMap(styleProp, eventName) {
|
|
|
var prefixes = {};
|
|
|
prefixes[styleProp.toLowerCase()] = eventName.toLowerCase();
|
|
|
prefixes["Webkit".concat(styleProp)] = "webkit".concat(eventName);
|
|
|
prefixes["Moz".concat(styleProp)] = "moz".concat(eventName);
|
|
|
prefixes["ms".concat(styleProp)] = "MS".concat(eventName);
|
|
|
prefixes["O".concat(styleProp)] = "o".concat(eventName.toLowerCase());
|
|
|
return prefixes;
|
|
|
}
|
|
|
|
|
|
function getVendorPrefixes(domSupport, win) {
|
|
|
var prefixes = {
|
|
|
animationend: makePrefixMap('Animation', 'AnimationEnd'),
|
|
|
transitionend: makePrefixMap('Transition', 'TransitionEnd')
|
|
|
};
|
|
|
|
|
|
if (domSupport) {
|
|
|
if (!('AnimationEvent' in win)) {
|
|
|
delete prefixes.animationend.animation;
|
|
|
}
|
|
|
|
|
|
if (!('TransitionEvent' in win)) {
|
|
|
delete prefixes.transitionend.transition;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return prefixes;
|
|
|
}
|
|
|
var vendorPrefixes = getVendorPrefixes((0,rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_1__["default"])(), typeof window !== 'undefined' ? window : {});
|
|
|
var style = {};
|
|
|
|
|
|
if ((0,rc_util_es_Dom_canUseDom__WEBPACK_IMPORTED_MODULE_1__["default"])()) {
|
|
|
var _document$createEleme = document.createElement('div');
|
|
|
|
|
|
style = _document$createEleme.style;
|
|
|
}
|
|
|
|
|
|
var prefixedEventNames = {};
|
|
|
function getVendorPrefixedEventName(eventName) {
|
|
|
if (prefixedEventNames[eventName]) {
|
|
|
return prefixedEventNames[eventName];
|
|
|
}
|
|
|
|
|
|
var prefixMap = vendorPrefixes[eventName];
|
|
|
|
|
|
if (prefixMap) {
|
|
|
var stylePropList = Object.keys(prefixMap);
|
|
|
var len = stylePropList.length;
|
|
|
|
|
|
for (var i = 0; i < len; i += 1) {
|
|
|
var styleProp = stylePropList[i];
|
|
|
|
|
|
if (Object.prototype.hasOwnProperty.call(prefixMap, styleProp) && styleProp in style) {
|
|
|
prefixedEventNames[eventName] = prefixMap[styleProp];
|
|
|
return prefixedEventNames[eventName];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
var internalAnimationEndName = getVendorPrefixedEventName('animationend');
|
|
|
var internalTransitionEndName = getVendorPrefixedEventName('transitionend');
|
|
|
var supportTransition = !!(internalAnimationEndName && internalTransitionEndName);
|
|
|
var animationEndName = internalAnimationEndName || 'animationend';
|
|
|
var transitionEndName = internalTransitionEndName || 'transitionend';
|
|
|
function getTransitionName(transitionName, transitionType) {
|
|
|
if (!transitionName) return null;
|
|
|
|
|
|
if ((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(transitionName) === 'object') {
|
|
|
var type = transitionType.replace(/-\w/g, function (match) {
|
|
|
return match[1].toUpperCase();
|
|
|
});
|
|
|
return transitionName[type];
|
|
|
}
|
|
|
|
|
|
return "".concat(transitionName, "-").concat(transitionType);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-pagination/lib/locale/en_GB.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/rc-pagination/lib/locale/en_GB.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = {
|
|
|
// Options.jsx
|
|
|
items_per_page: '/ page',
|
|
|
jump_to: 'Go to',
|
|
|
jump_to_confirm: 'confirm',
|
|
|
page: 'Page',
|
|
|
// Pagination.jsx
|
|
|
prev_page: 'Previous Page',
|
|
|
next_page: 'Next Page',
|
|
|
prev_5: 'Previous 5 Pages',
|
|
|
next_5: 'Next 5 Pages',
|
|
|
prev_3: 'Previous 3 Pages',
|
|
|
next_3: 'Next 3 Pages',
|
|
|
page_size: 'Page Size'
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-pagination/lib/locale/en_US.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/rc-pagination/lib/locale/en_US.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = {
|
|
|
// Options.jsx
|
|
|
items_per_page: '/ page',
|
|
|
jump_to: 'Go to',
|
|
|
jump_to_confirm: 'confirm',
|
|
|
page: 'Page',
|
|
|
// Pagination.jsx
|
|
|
prev_page: 'Previous Page',
|
|
|
next_page: 'Next Page',
|
|
|
prev_5: 'Previous 5 Pages',
|
|
|
next_5: 'Next 5 Pages',
|
|
|
prev_3: 'Previous 3 Pages',
|
|
|
next_3: 'Next 3 Pages',
|
|
|
page_size: 'Page Size'
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-pagination/lib/locale/es_ES.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/rc-pagination/lib/locale/es_ES.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = {
|
|
|
// Options.jsx
|
|
|
items_per_page: '/ página',
|
|
|
jump_to: 'Ir a',
|
|
|
jump_to_confirm: 'confirmar',
|
|
|
page: 'Página',
|
|
|
// Pagination.jsx
|
|
|
prev_page: 'Página anterior',
|
|
|
next_page: 'Página siguiente',
|
|
|
prev_5: '5 páginas previas',
|
|
|
next_5: '5 páginas siguientes',
|
|
|
prev_3: '3 páginas previas',
|
|
|
next_3: '3 páginas siguientes',
|
|
|
page_size: 'tamaño de página'
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-pagination/lib/locale/pt_BR.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/rc-pagination/lib/locale/pt_BR.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = {
|
|
|
// Options.jsx
|
|
|
items_per_page: '/ página',
|
|
|
jump_to: 'Vá até',
|
|
|
jump_to_confirm: 'confirme',
|
|
|
page: 'Página',
|
|
|
// Pagination.jsx
|
|
|
prev_page: 'Página anterior',
|
|
|
next_page: 'Próxima página',
|
|
|
prev_5: '5 páginas anteriores',
|
|
|
next_5: '5 próximas páginas',
|
|
|
prev_3: '3 páginas anteriores',
|
|
|
next_3: '3 próximas páginas',
|
|
|
page_size: 'tamanho da página'
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-pagination/lib/locale/pt_PT.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/rc-pagination/lib/locale/pt_PT.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = {
|
|
|
// Options.jsx
|
|
|
items_per_page: '/ página',
|
|
|
jump_to: 'Saltar',
|
|
|
jump_to_confirm: 'confirmar',
|
|
|
page: 'Página',
|
|
|
// Pagination.jsx
|
|
|
prev_page: 'Página Anterior',
|
|
|
next_page: 'Página Seguinte',
|
|
|
prev_5: 'Recuar 5 Páginas',
|
|
|
next_5: 'Avançar 5 Páginas',
|
|
|
prev_3: 'Recuar 3 Páginas',
|
|
|
next_3: 'Avançar 3 Páginas',
|
|
|
page_size: 'mărimea paginii'
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-picker/lib/locale/en_GB.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-picker/lib/locale/en_GB.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var locale = {
|
|
|
locale: 'en_GB',
|
|
|
today: 'Today',
|
|
|
now: 'Now',
|
|
|
backToToday: 'Back to today',
|
|
|
ok: 'OK',
|
|
|
clear: 'Clear',
|
|
|
month: 'Month',
|
|
|
year: 'Year',
|
|
|
timeSelect: 'Select time',
|
|
|
dateSelect: 'Select date',
|
|
|
monthSelect: 'Choose a month',
|
|
|
yearSelect: 'Choose a year',
|
|
|
decadeSelect: 'Choose a decade',
|
|
|
yearFormat: 'YYYY',
|
|
|
dateFormat: 'D/M/YYYY',
|
|
|
dayFormat: 'D',
|
|
|
dateTimeFormat: 'D/M/YYYY HH:mm:ss',
|
|
|
monthBeforeYear: true,
|
|
|
previousMonth: 'Previous month (PageUp)',
|
|
|
nextMonth: 'Next month (PageDown)',
|
|
|
previousYear: 'Last year (Control + left)',
|
|
|
nextYear: 'Next year (Control + right)',
|
|
|
previousDecade: 'Last decade',
|
|
|
nextDecade: 'Next decade',
|
|
|
previousCentury: 'Last century',
|
|
|
nextCentury: 'Next century'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-picker/lib/locale/en_US.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-picker/lib/locale/en_US.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var locale = {
|
|
|
locale: 'en_US',
|
|
|
today: 'Today',
|
|
|
now: 'Now',
|
|
|
backToToday: 'Back to today',
|
|
|
ok: 'OK',
|
|
|
clear: 'Clear',
|
|
|
month: 'Month',
|
|
|
year: 'Year',
|
|
|
timeSelect: 'select time',
|
|
|
dateSelect: 'select date',
|
|
|
weekSelect: 'Choose a week',
|
|
|
monthSelect: 'Choose a month',
|
|
|
yearSelect: 'Choose a year',
|
|
|
decadeSelect: 'Choose a decade',
|
|
|
yearFormat: 'YYYY',
|
|
|
dateFormat: 'M/D/YYYY',
|
|
|
dayFormat: 'D',
|
|
|
dateTimeFormat: 'M/D/YYYY HH:mm:ss',
|
|
|
monthBeforeYear: true,
|
|
|
previousMonth: 'Previous month (PageUp)',
|
|
|
nextMonth: 'Next month (PageDown)',
|
|
|
previousYear: 'Last year (Control + left)',
|
|
|
nextYear: 'Next year (Control + right)',
|
|
|
previousDecade: 'Last decade',
|
|
|
nextDecade: 'Next decade',
|
|
|
previousCentury: 'Last century',
|
|
|
nextCentury: 'Next century'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-picker/lib/locale/es_ES.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-picker/lib/locale/es_ES.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var locale = {
|
|
|
locale: 'es_ES',
|
|
|
today: 'Hoy',
|
|
|
now: 'Ahora',
|
|
|
backToToday: 'Volver a hoy',
|
|
|
ok: 'Aceptar',
|
|
|
clear: 'Limpiar',
|
|
|
month: 'Mes',
|
|
|
year: 'Año',
|
|
|
timeSelect: 'Seleccionar hora',
|
|
|
dateSelect: 'Seleccionar fecha',
|
|
|
monthSelect: 'Elegir un mes',
|
|
|
yearSelect: 'Elegir un año',
|
|
|
decadeSelect: 'Elegir una década',
|
|
|
yearFormat: 'YYYY',
|
|
|
dateFormat: 'D/M/YYYY',
|
|
|
dayFormat: 'D',
|
|
|
dateTimeFormat: 'D/M/YYYY HH:mm:ss',
|
|
|
monthBeforeYear: true,
|
|
|
previousMonth: 'Mes anterior (PageUp)',
|
|
|
nextMonth: 'Mes siguiente (PageDown)',
|
|
|
previousYear: 'Año anterior (Control + left)',
|
|
|
nextYear: 'Año siguiente (Control + right)',
|
|
|
previousDecade: 'Década anterior',
|
|
|
nextDecade: 'Década siguiente',
|
|
|
previousCentury: 'Siglo anterior',
|
|
|
nextCentury: 'Siglo siguiente'
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-picker/lib/locale/pt_BR.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-picker/lib/locale/pt_BR.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var locale = {
|
|
|
locale: 'pt_BR',
|
|
|
today: 'Hoje',
|
|
|
now: 'Agora',
|
|
|
backToToday: 'Voltar para hoje',
|
|
|
ok: 'OK',
|
|
|
clear: 'Limpar',
|
|
|
month: 'Mês',
|
|
|
year: 'Ano',
|
|
|
timeSelect: 'Selecionar hora',
|
|
|
dateSelect: 'Selecionar data',
|
|
|
monthSelect: 'Escolher mês',
|
|
|
yearSelect: 'Escolher ano',
|
|
|
decadeSelect: 'Escolher década',
|
|
|
yearFormat: 'YYYY',
|
|
|
dateFormat: 'D/M/YYYY',
|
|
|
dayFormat: 'D',
|
|
|
dateTimeFormat: 'D/M/YYYY HH:mm:ss',
|
|
|
monthBeforeYear: false,
|
|
|
previousMonth: 'Mês anterior (PageUp)',
|
|
|
nextMonth: 'Próximo mês (PageDown)',
|
|
|
previousYear: 'Ano anterior (Control + esquerda)',
|
|
|
nextYear: 'Próximo ano (Control + direita)',
|
|
|
previousDecade: 'Década anterior',
|
|
|
nextDecade: 'Próxima década',
|
|
|
previousCentury: 'Século anterior',
|
|
|
nextCentury: 'Próximo século',
|
|
|
shortWeekDays: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'Sáb'],
|
|
|
shortMonths: ['Jan', 'Fev', 'Mar', 'Abr', 'Mai', 'Jun', 'Jul', 'Ago', 'Set', 'Out', 'Nov', 'Dez']
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-picker/lib/locale/pt_PT.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-picker/lib/locale/pt_PT.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var locale = {
|
|
|
locale: 'pt_PT',
|
|
|
today: 'Hoje',
|
|
|
now: 'Agora',
|
|
|
backToToday: 'Hoje',
|
|
|
ok: 'OK',
|
|
|
clear: 'Limpar',
|
|
|
month: 'Mês',
|
|
|
year: 'Ano',
|
|
|
timeSelect: 'Selecionar hora',
|
|
|
dateSelect: 'Selecionar data',
|
|
|
monthSelect: 'Selecionar mês',
|
|
|
yearSelect: 'Selecionar ano',
|
|
|
decadeSelect: 'Selecionar década',
|
|
|
yearFormat: 'YYYY',
|
|
|
dateFormat: 'D/M/YYYY',
|
|
|
dayFormat: 'D',
|
|
|
dateTimeFormat: 'D/M/YYYY HH:mm:ss',
|
|
|
monthBeforeYear: true,
|
|
|
previousMonth: 'Mês anterior (PageUp)',
|
|
|
nextMonth: 'Mês seguinte (PageDown)',
|
|
|
previousYear: 'Ano anterior (Control + left)',
|
|
|
nextYear: 'Ano seguinte (Control + right)',
|
|
|
previousDecade: 'Década anterior',
|
|
|
nextDecade: 'Década seguinte',
|
|
|
previousCentury: 'Século anterior',
|
|
|
nextCentury: 'Século seguinte',
|
|
|
shortWeekDays: ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sáb"],
|
|
|
shortMonths: ["Jan", "Fev", "Mar", "Abr", "Mai", "Jun", "Jul", "Ago", "Set", "Out", "Nov", "Dez"]
|
|
|
};
|
|
|
var _default = locale;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/Children/toArray.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/Children/toArray.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ toArray)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var react_is__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-is */ "./node_modules/react-is/index.js");
|
|
|
|
|
|
|
|
|
function toArray(children) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var ret = [];
|
|
|
react__WEBPACK_IMPORTED_MODULE_0___default().Children.forEach(children, function (child) {
|
|
|
if ((child === undefined || child === null) && !option.keepEmpty) {
|
|
|
return;
|
|
|
}
|
|
|
if (Array.isArray(child)) {
|
|
|
ret = ret.concat(toArray(child));
|
|
|
} else if ((0,react_is__WEBPACK_IMPORTED_MODULE_1__.isFragment)(child) && child.props) {
|
|
|
ret = ret.concat(toArray(child.props.children, option));
|
|
|
} else {
|
|
|
ret.push(child);
|
|
|
}
|
|
|
});
|
|
|
return ret;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/Dom/canUseDom.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/Dom/canUseDom.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ canUseDom)
|
|
|
/* harmony export */ });
|
|
|
function canUseDom() {
|
|
|
return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/Dom/contains.js":
|
|
|
/*!*************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/Dom/contains.js ***!
|
|
|
\*************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ contains)
|
|
|
/* harmony export */ });
|
|
|
function contains(root, n) {
|
|
|
if (!root) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// Use native if support
|
|
|
if (root.contains) {
|
|
|
return root.contains(n);
|
|
|
}
|
|
|
|
|
|
// `document.contains` not support with IE11
|
|
|
var node = n;
|
|
|
while (node) {
|
|
|
if (node === root) {
|
|
|
return true;
|
|
|
}
|
|
|
node = node.parentNode;
|
|
|
}
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/Dom/dynamicCSS.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/Dom/dynamicCSS.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "clearContainerCache": () => (/* binding */ clearContainerCache),
|
|
|
/* harmony export */ "injectCSS": () => (/* binding */ injectCSS),
|
|
|
/* harmony export */ "removeCSS": () => (/* binding */ removeCSS),
|
|
|
/* harmony export */ "updateCSS": () => (/* binding */ updateCSS)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _canUseDom__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./canUseDom */ "./node_modules/rc-util/es/Dom/canUseDom.js");
|
|
|
/* harmony import */ var _contains__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./contains */ "./node_modules/rc-util/es/Dom/contains.js");
|
|
|
|
|
|
|
|
|
var APPEND_ORDER = 'data-rc-order';
|
|
|
var MARK_KEY = "rc-util-key";
|
|
|
var containerCache = new Map();
|
|
|
function getMark() {
|
|
|
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
|
mark = _ref.mark;
|
|
|
if (mark) {
|
|
|
return mark.startsWith('data-') ? mark : "data-".concat(mark);
|
|
|
}
|
|
|
return MARK_KEY;
|
|
|
}
|
|
|
function getContainer(option) {
|
|
|
if (option.attachTo) {
|
|
|
return option.attachTo;
|
|
|
}
|
|
|
var head = document.querySelector('head');
|
|
|
return head || document.body;
|
|
|
}
|
|
|
function getOrder(prepend) {
|
|
|
if (prepend === 'queue') {
|
|
|
return 'prependQueue';
|
|
|
}
|
|
|
return prepend ? 'prepend' : 'append';
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Find style which inject by rc-util
|
|
|
*/
|
|
|
function findStyles(container) {
|
|
|
return Array.from((containerCache.get(container) || container).children).filter(function (node) {
|
|
|
return node.tagName === 'STYLE';
|
|
|
});
|
|
|
}
|
|
|
function injectCSS(css) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
if (!(0,_canUseDom__WEBPACK_IMPORTED_MODULE_0__["default"])()) {
|
|
|
return null;
|
|
|
}
|
|
|
var csp = option.csp,
|
|
|
prepend = option.prepend;
|
|
|
var styleNode = document.createElement('style');
|
|
|
styleNode.setAttribute(APPEND_ORDER, getOrder(prepend));
|
|
|
if (csp !== null && csp !== void 0 && csp.nonce) {
|
|
|
styleNode.nonce = csp === null || csp === void 0 ? void 0 : csp.nonce;
|
|
|
}
|
|
|
styleNode.innerHTML = css;
|
|
|
var container = getContainer(option);
|
|
|
var firstChild = container.firstChild;
|
|
|
if (prepend) {
|
|
|
// If is queue `prepend`, it will prepend first style and then append rest style
|
|
|
if (prepend === 'queue') {
|
|
|
var existStyle = findStyles(container).filter(function (node) {
|
|
|
return ['prepend', 'prependQueue'].includes(node.getAttribute(APPEND_ORDER));
|
|
|
});
|
|
|
if (existStyle.length) {
|
|
|
container.insertBefore(styleNode, existStyle[existStyle.length - 1].nextSibling);
|
|
|
return styleNode;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// Use `insertBefore` as `prepend`
|
|
|
container.insertBefore(styleNode, firstChild);
|
|
|
} else {
|
|
|
container.appendChild(styleNode);
|
|
|
}
|
|
|
return styleNode;
|
|
|
}
|
|
|
function findExistNode(key) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var container = getContainer(option);
|
|
|
return findStyles(container).find(function (node) {
|
|
|
return node.getAttribute(getMark(option)) === key;
|
|
|
});
|
|
|
}
|
|
|
function removeCSS(key) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var existNode = findExistNode(key, option);
|
|
|
if (existNode) {
|
|
|
var container = getContainer(option);
|
|
|
container.removeChild(existNode);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* qiankun will inject `appendChild` to insert into other
|
|
|
*/
|
|
|
function syncRealContainer(container, option) {
|
|
|
var cachedRealContainer = containerCache.get(container);
|
|
|
|
|
|
// Find real container when not cached or cached container removed
|
|
|
if (!cachedRealContainer || !(0,_contains__WEBPACK_IMPORTED_MODULE_1__["default"])(document, cachedRealContainer)) {
|
|
|
var placeholderStyle = injectCSS('', option);
|
|
|
var parentNode = placeholderStyle.parentNode;
|
|
|
containerCache.set(container, parentNode);
|
|
|
container.removeChild(placeholderStyle);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* manually clear container cache to avoid global cache in unit testes
|
|
|
*/
|
|
|
function clearContainerCache() {
|
|
|
containerCache.clear();
|
|
|
}
|
|
|
function updateCSS(css, key) {
|
|
|
var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
|
var container = getContainer(option);
|
|
|
|
|
|
// Sync real parent
|
|
|
syncRealContainer(container, option);
|
|
|
var existNode = findExistNode(key, option);
|
|
|
if (existNode) {
|
|
|
var _option$csp, _option$csp2;
|
|
|
if ((_option$csp = option.csp) !== null && _option$csp !== void 0 && _option$csp.nonce && existNode.nonce !== ((_option$csp2 = option.csp) === null || _option$csp2 === void 0 ? void 0 : _option$csp2.nonce)) {
|
|
|
var _option$csp3;
|
|
|
existNode.nonce = (_option$csp3 = option.csp) === null || _option$csp3 === void 0 ? void 0 : _option$csp3.nonce;
|
|
|
}
|
|
|
if (existNode.innerHTML !== css) {
|
|
|
existNode.innerHTML = css;
|
|
|
}
|
|
|
return existNode;
|
|
|
}
|
|
|
var newNode = injectCSS(css, option);
|
|
|
newNode.setAttribute(getMark(option), key);
|
|
|
return newNode;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/Dom/findDOMNode.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/Dom/findDOMNode.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ findDOMNode),
|
|
|
/* harmony export */ "isDOM": () => (/* binding */ isDOM)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js");
|
|
|
|
|
|
|
|
|
function isDOM(node) {
|
|
|
// https://developer.mozilla.org/en-US/docs/Web/API/Element
|
|
|
// Since XULElement is also subclass of Element, we only need HTMLElement and SVGElement
|
|
|
return node instanceof HTMLElement || node instanceof SVGElement;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Return if a node is a DOM node. Else will return by `findDOMNode`
|
|
|
*/
|
|
|
function findDOMNode(node) {
|
|
|
if (isDOM(node)) {
|
|
|
return node;
|
|
|
}
|
|
|
if (node instanceof (react__WEBPACK_IMPORTED_MODULE_0___default().Component)) {
|
|
|
return react_dom__WEBPACK_IMPORTED_MODULE_1__.findDOMNode(node);
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/hooks/useMemo.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/hooks/useMemo.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ useMemo)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
|
|
|
function useMemo(getValue, condition, shouldUpdate) {
|
|
|
var cacheRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef({});
|
|
|
if (!('value' in cacheRef.current) || shouldUpdate(cacheRef.current.condition, condition)) {
|
|
|
cacheRef.current.value = getValue();
|
|
|
cacheRef.current.condition = condition;
|
|
|
}
|
|
|
return cacheRef.current.value;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/hooks/useState.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/hooks/useState.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ useSafeState)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/slicedToArray */ "./node_modules/@babel/runtime/helpers/esm/slicedToArray.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
|
|
|
|
|
|
/**
|
|
|
* Same as React.useState but `setState` accept `ignoreDestroy` param to not to setState after destroyed.
|
|
|
* We do not make this auto is to avoid real memory leak.
|
|
|
* Developer should confirm it's safe to ignore themselves.
|
|
|
*/
|
|
|
function useSafeState(defaultValue) {
|
|
|
var destroyRef = react__WEBPACK_IMPORTED_MODULE_1__.useRef(false);
|
|
|
var _React$useState = react__WEBPACK_IMPORTED_MODULE_1__.useState(defaultValue),
|
|
|
_React$useState2 = (0,_babel_runtime_helpers_esm_slicedToArray__WEBPACK_IMPORTED_MODULE_0__["default"])(_React$useState, 2),
|
|
|
value = _React$useState2[0],
|
|
|
setValue = _React$useState2[1];
|
|
|
react__WEBPACK_IMPORTED_MODULE_1__.useEffect(function () {
|
|
|
destroyRef.current = false;
|
|
|
return function () {
|
|
|
destroyRef.current = true;
|
|
|
};
|
|
|
}, []);
|
|
|
function safeSetState(updater, ignoreDestroy) {
|
|
|
if (ignoreDestroy && destroyRef.current) {
|
|
|
return;
|
|
|
}
|
|
|
setValue(updater);
|
|
|
}
|
|
|
return [value, safeSetState];
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/isEqual.js":
|
|
|
/*!********************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/isEqual.js ***!
|
|
|
\********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* 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 _warning__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./warning */ "./node_modules/rc-util/es/warning.js");
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
* Deeply compares two object literals.
|
|
|
* @param obj1 object 1
|
|
|
* @param obj2 object 2
|
|
|
* @param shallow shallow compare
|
|
|
* @returns
|
|
|
*/
|
|
|
function isEqual(obj1, obj2) {
|
|
|
var shallow = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
|
// https://github.com/mapbox/mapbox-gl-js/pull/5979/files#diff-fde7145050c47cc3a306856efd5f9c3016e86e859de9afbd02c879be5067e58f
|
|
|
var refSet = new Set();
|
|
|
function deepEqual(a, b) {
|
|
|
var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
|
|
|
var circular = refSet.has(a);
|
|
|
(0,_warning__WEBPACK_IMPORTED_MODULE_1__["default"])(!circular, 'Warning: There may be circular references');
|
|
|
if (circular) {
|
|
|
return false;
|
|
|
}
|
|
|
if (a === b) {
|
|
|
return true;
|
|
|
}
|
|
|
if (shallow && level > 1) {
|
|
|
return false;
|
|
|
}
|
|
|
refSet.add(a);
|
|
|
var newLevel = level + 1;
|
|
|
if (Array.isArray(a)) {
|
|
|
if (!Array.isArray(b) || a.length !== b.length) {
|
|
|
return false;
|
|
|
}
|
|
|
for (var i = 0; i < a.length; i++) {
|
|
|
if (!deepEqual(a[i], b[i], newLevel)) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
return true;
|
|
|
}
|
|
|
if (a && b && (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(a) === 'object' && (0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(b) === 'object') {
|
|
|
var keys = Object.keys(a);
|
|
|
if (keys.length !== Object.keys(b).length) {
|
|
|
return false;
|
|
|
}
|
|
|
return keys.every(function (key) {
|
|
|
return deepEqual(a[key], b[key], newLevel);
|
|
|
});
|
|
|
}
|
|
|
// other
|
|
|
return false;
|
|
|
}
|
|
|
return deepEqual(obj1, obj2);
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (isEqual);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/raf.js":
|
|
|
/*!****************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/raf.js ***!
|
|
|
\****************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
var raf = function raf(callback) {
|
|
|
return +setTimeout(callback, 16);
|
|
|
};
|
|
|
var caf = function caf(num) {
|
|
|
return clearTimeout(num);
|
|
|
};
|
|
|
if (typeof window !== 'undefined' && 'requestAnimationFrame' in window) {
|
|
|
raf = function raf(callback) {
|
|
|
return window.requestAnimationFrame(callback);
|
|
|
};
|
|
|
caf = function caf(handle) {
|
|
|
return window.cancelAnimationFrame(handle);
|
|
|
};
|
|
|
}
|
|
|
var rafUUID = 0;
|
|
|
var rafIds = new Map();
|
|
|
function cleanup(id) {
|
|
|
rafIds.delete(id);
|
|
|
}
|
|
|
var wrapperRaf = function wrapperRaf(callback) {
|
|
|
var times = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
|
|
|
rafUUID += 1;
|
|
|
var id = rafUUID;
|
|
|
function callRef(leftTimes) {
|
|
|
if (leftTimes === 0) {
|
|
|
// Clean up
|
|
|
cleanup(id);
|
|
|
|
|
|
// Trigger
|
|
|
callback();
|
|
|
} else {
|
|
|
// Next raf
|
|
|
var realId = raf(function () {
|
|
|
callRef(leftTimes - 1);
|
|
|
});
|
|
|
|
|
|
// Bind real raf id
|
|
|
rafIds.set(id, realId);
|
|
|
}
|
|
|
}
|
|
|
callRef(times);
|
|
|
return id;
|
|
|
};
|
|
|
wrapperRaf.cancel = function (id) {
|
|
|
var realId = rafIds.get(id);
|
|
|
cleanup(realId);
|
|
|
return caf(realId);
|
|
|
};
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (wrapperRaf);
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/ref.js":
|
|
|
/*!****************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/ref.js ***!
|
|
|
\****************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "composeRef": () => (/* binding */ composeRef),
|
|
|
/* harmony export */ "fillRef": () => (/* binding */ fillRef),
|
|
|
/* harmony export */ "supportRef": () => (/* binding */ supportRef),
|
|
|
/* harmony export */ "useComposeRef": () => (/* binding */ useComposeRef)
|
|
|
/* harmony export */ });
|
|
|
/* 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 react_is__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-is */ "./node_modules/react-is/index.js");
|
|
|
/* harmony import */ var _hooks_useMemo__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./hooks/useMemo */ "./node_modules/rc-util/es/hooks/useMemo.js");
|
|
|
|
|
|
/* eslint-disable no-param-reassign */
|
|
|
|
|
|
|
|
|
|
|
|
function fillRef(ref, node) {
|
|
|
if (typeof ref === 'function') {
|
|
|
ref(node);
|
|
|
} else if ((0,_babel_runtime_helpers_esm_typeof__WEBPACK_IMPORTED_MODULE_0__["default"])(ref) === 'object' && ref && 'current' in ref) {
|
|
|
ref.current = node;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Merge refs into one ref function to support ref passing.
|
|
|
*/
|
|
|
function composeRef() {
|
|
|
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
refs[_key] = arguments[_key];
|
|
|
}
|
|
|
var refList = refs.filter(function (ref) {
|
|
|
return ref;
|
|
|
});
|
|
|
if (refList.length <= 1) {
|
|
|
return refList[0];
|
|
|
}
|
|
|
return function (node) {
|
|
|
refs.forEach(function (ref) {
|
|
|
fillRef(ref, node);
|
|
|
});
|
|
|
};
|
|
|
}
|
|
|
function useComposeRef() {
|
|
|
for (var _len2 = arguments.length, refs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
|
refs[_key2] = arguments[_key2];
|
|
|
}
|
|
|
return (0,_hooks_useMemo__WEBPACK_IMPORTED_MODULE_2__["default"])(function () {
|
|
|
return composeRef.apply(void 0, refs);
|
|
|
}, refs, function (prev, next) {
|
|
|
return prev.length === next.length && prev.every(function (ref, i) {
|
|
|
return ref === next[i];
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
function supportRef(nodeOrComponent) {
|
|
|
var _type$prototype, _nodeOrComponent$prot;
|
|
|
var type = (0,react_is__WEBPACK_IMPORTED_MODULE_1__.isMemo)(nodeOrComponent) ? nodeOrComponent.type.type : nodeOrComponent.type;
|
|
|
|
|
|
// Function component node
|
|
|
if (typeof type === 'function' && !((_type$prototype = type.prototype) !== null && _type$prototype !== void 0 && _type$prototype.render)) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// Class component
|
|
|
if (typeof nodeOrComponent === 'function' && !((_nodeOrComponent$prot = nodeOrComponent.prototype) !== null && _nodeOrComponent$prot !== void 0 && _nodeOrComponent$prot.render)) {
|
|
|
return false;
|
|
|
}
|
|
|
return true;
|
|
|
}
|
|
|
/* eslint-enable */
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/utils/get.js":
|
|
|
/*!**********************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/utils/get.js ***!
|
|
|
\**********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ get)
|
|
|
/* harmony export */ });
|
|
|
function get(entity, path) {
|
|
|
var current = entity;
|
|
|
for (var i = 0; i < path.length; i += 1) {
|
|
|
if (current === null || current === undefined) {
|
|
|
return undefined;
|
|
|
}
|
|
|
current = current[path[i]];
|
|
|
}
|
|
|
return current;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/utils/set.js":
|
|
|
/*!**********************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/utils/set.js ***!
|
|
|
\**********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ set)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/esm/objectSpread2 */ "./node_modules/@babel/runtime/helpers/esm/objectSpread2.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toConsumableArray */ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js");
|
|
|
/* harmony import */ var _babel_runtime_helpers_esm_toArray__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babel/runtime/helpers/esm/toArray */ "./node_modules/@babel/runtime/helpers/esm/toArray.js");
|
|
|
/* harmony import */ var _get__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./get */ "./node_modules/rc-util/es/utils/get.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function internalSet(entity, paths, value, removeIfUndefined) {
|
|
|
if (!paths.length) {
|
|
|
return value;
|
|
|
}
|
|
|
var _paths = (0,_babel_runtime_helpers_esm_toArray__WEBPACK_IMPORTED_MODULE_2__["default"])(paths),
|
|
|
path = _paths[0],
|
|
|
restPath = _paths.slice(1);
|
|
|
var clone;
|
|
|
if (!entity && typeof path === 'number') {
|
|
|
clone = [];
|
|
|
} else if (Array.isArray(entity)) {
|
|
|
clone = (0,_babel_runtime_helpers_esm_toConsumableArray__WEBPACK_IMPORTED_MODULE_1__["default"])(entity);
|
|
|
} else {
|
|
|
clone = (0,_babel_runtime_helpers_esm_objectSpread2__WEBPACK_IMPORTED_MODULE_0__["default"])({}, entity);
|
|
|
}
|
|
|
|
|
|
// Delete prop if `removeIfUndefined` and value is undefined
|
|
|
if (removeIfUndefined && value === undefined && restPath.length === 1) {
|
|
|
delete clone[path][restPath[0]];
|
|
|
} else {
|
|
|
clone[path] = internalSet(clone[path], restPath, value, removeIfUndefined);
|
|
|
}
|
|
|
return clone;
|
|
|
}
|
|
|
function set(entity, paths, value) {
|
|
|
var removeIfUndefined = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
|
// Do nothing if `removeIfUndefined` and parent object not exist
|
|
|
if (paths.length && removeIfUndefined && value === undefined && !(0,_get__WEBPACK_IMPORTED_MODULE_3__["default"])(entity, paths.slice(0, -1))) {
|
|
|
return entity;
|
|
|
}
|
|
|
return internalSet(entity, paths, value, removeIfUndefined);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/es/warning.js":
|
|
|
/*!********************************************!*\
|
|
|
!*** ./node_modules/rc-util/es/warning.js ***!
|
|
|
\********************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "call": () => (/* binding */ call),
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__),
|
|
|
/* harmony export */ "note": () => (/* binding */ note),
|
|
|
/* harmony export */ "noteOnce": () => (/* binding */ noteOnce),
|
|
|
/* harmony export */ "resetWarned": () => (/* binding */ resetWarned),
|
|
|
/* harmony export */ "warning": () => (/* binding */ warning),
|
|
|
/* harmony export */ "warningOnce": () => (/* binding */ warningOnce)
|
|
|
/* harmony export */ });
|
|
|
/* eslint-disable no-console */
|
|
|
var warned = {};
|
|
|
function warning(valid, message) {
|
|
|
// Support uglify
|
|
|
if ( true && !valid && console !== undefined) {
|
|
|
console.error("Warning: ".concat(message));
|
|
|
}
|
|
|
}
|
|
|
function note(valid, message) {
|
|
|
// Support uglify
|
|
|
if ( true && !valid && console !== undefined) {
|
|
|
console.warn("Note: ".concat(message));
|
|
|
}
|
|
|
}
|
|
|
function resetWarned() {
|
|
|
warned = {};
|
|
|
}
|
|
|
function call(method, valid, message) {
|
|
|
if (!valid && !warned[message]) {
|
|
|
method(false, message);
|
|
|
warned[message] = true;
|
|
|
}
|
|
|
}
|
|
|
function warningOnce(valid, message) {
|
|
|
call(warning, valid, message);
|
|
|
}
|
|
|
function noteOnce(valid, message) {
|
|
|
call(note, valid, message);
|
|
|
}
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (warningOnce);
|
|
|
/* eslint-enable */
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/Children/toArray.js":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/Children/toArray.js ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = toArray;
|
|
|
var _react = _interopRequireDefault(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
var _reactIs = __webpack_require__(/*! react-is */ "./node_modules/react-is/index.js");
|
|
|
function toArray(children) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var ret = [];
|
|
|
_react.default.Children.forEach(children, function (child) {
|
|
|
if ((child === undefined || child === null) && !option.keepEmpty) {
|
|
|
return;
|
|
|
}
|
|
|
if (Array.isArray(child)) {
|
|
|
ret = ret.concat(toArray(child));
|
|
|
} else if ((0, _reactIs.isFragment)(child) && child.props) {
|
|
|
ret = ret.concat(toArray(child.props.children, option));
|
|
|
} else {
|
|
|
ret.push(child);
|
|
|
}
|
|
|
});
|
|
|
return ret;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/Dom/canUseDom.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/Dom/canUseDom.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = canUseDom;
|
|
|
function canUseDom() {
|
|
|
return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/Dom/contains.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/Dom/contains.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = contains;
|
|
|
function contains(root, n) {
|
|
|
if (!root) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// Use native if support
|
|
|
if (root.contains) {
|
|
|
return root.contains(n);
|
|
|
}
|
|
|
|
|
|
// `document.contains` not support with IE11
|
|
|
var node = n;
|
|
|
while (node) {
|
|
|
if (node === root) {
|
|
|
return true;
|
|
|
}
|
|
|
node = node.parentNode;
|
|
|
}
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/Dom/dynamicCSS.js":
|
|
|
/*!****************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/Dom/dynamicCSS.js ***!
|
|
|
\****************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.clearContainerCache = clearContainerCache;
|
|
|
exports.injectCSS = injectCSS;
|
|
|
exports.removeCSS = removeCSS;
|
|
|
exports.updateCSS = updateCSS;
|
|
|
var _canUseDom = _interopRequireDefault(__webpack_require__(/*! ./canUseDom */ "./node_modules/rc-util/lib/Dom/canUseDom.js"));
|
|
|
var _contains = _interopRequireDefault(__webpack_require__(/*! ./contains */ "./node_modules/rc-util/lib/Dom/contains.js"));
|
|
|
var APPEND_ORDER = 'data-rc-order';
|
|
|
var MARK_KEY = "rc-util-key";
|
|
|
var containerCache = new Map();
|
|
|
function getMark() {
|
|
|
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
|
mark = _ref.mark;
|
|
|
if (mark) {
|
|
|
return mark.startsWith('data-') ? mark : "data-".concat(mark);
|
|
|
}
|
|
|
return MARK_KEY;
|
|
|
}
|
|
|
function getContainer(option) {
|
|
|
if (option.attachTo) {
|
|
|
return option.attachTo;
|
|
|
}
|
|
|
var head = document.querySelector('head');
|
|
|
return head || document.body;
|
|
|
}
|
|
|
function getOrder(prepend) {
|
|
|
if (prepend === 'queue') {
|
|
|
return 'prependQueue';
|
|
|
}
|
|
|
return prepend ? 'prepend' : 'append';
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Find style which inject by rc-util
|
|
|
*/
|
|
|
function findStyles(container) {
|
|
|
return Array.from((containerCache.get(container) || container).children).filter(function (node) {
|
|
|
return node.tagName === 'STYLE';
|
|
|
});
|
|
|
}
|
|
|
function injectCSS(css) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
if (!(0, _canUseDom.default)()) {
|
|
|
return null;
|
|
|
}
|
|
|
var csp = option.csp,
|
|
|
prepend = option.prepend;
|
|
|
var styleNode = document.createElement('style');
|
|
|
styleNode.setAttribute(APPEND_ORDER, getOrder(prepend));
|
|
|
if (csp !== null && csp !== void 0 && csp.nonce) {
|
|
|
styleNode.nonce = csp === null || csp === void 0 ? void 0 : csp.nonce;
|
|
|
}
|
|
|
styleNode.innerHTML = css;
|
|
|
var container = getContainer(option);
|
|
|
var firstChild = container.firstChild;
|
|
|
if (prepend) {
|
|
|
// If is queue `prepend`, it will prepend first style and then append rest style
|
|
|
if (prepend === 'queue') {
|
|
|
var existStyle = findStyles(container).filter(function (node) {
|
|
|
return ['prepend', 'prependQueue'].includes(node.getAttribute(APPEND_ORDER));
|
|
|
});
|
|
|
if (existStyle.length) {
|
|
|
container.insertBefore(styleNode, existStyle[existStyle.length - 1].nextSibling);
|
|
|
return styleNode;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// Use `insertBefore` as `prepend`
|
|
|
container.insertBefore(styleNode, firstChild);
|
|
|
} else {
|
|
|
container.appendChild(styleNode);
|
|
|
}
|
|
|
return styleNode;
|
|
|
}
|
|
|
function findExistNode(key) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var container = getContainer(option);
|
|
|
return findStyles(container).find(function (node) {
|
|
|
return node.getAttribute(getMark(option)) === key;
|
|
|
});
|
|
|
}
|
|
|
function removeCSS(key) {
|
|
|
var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
|
var existNode = findExistNode(key, option);
|
|
|
if (existNode) {
|
|
|
var container = getContainer(option);
|
|
|
container.removeChild(existNode);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* qiankun will inject `appendChild` to insert into other
|
|
|
*/
|
|
|
function syncRealContainer(container, option) {
|
|
|
var cachedRealContainer = containerCache.get(container);
|
|
|
|
|
|
// Find real container when not cached or cached container removed
|
|
|
if (!cachedRealContainer || !(0, _contains.default)(document, cachedRealContainer)) {
|
|
|
var placeholderStyle = injectCSS('', option);
|
|
|
var parentNode = placeholderStyle.parentNode;
|
|
|
containerCache.set(container, parentNode);
|
|
|
container.removeChild(placeholderStyle);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* manually clear container cache to avoid global cache in unit testes
|
|
|
*/
|
|
|
function clearContainerCache() {
|
|
|
containerCache.clear();
|
|
|
}
|
|
|
function updateCSS(css, key) {
|
|
|
var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
|
|
|
var container = getContainer(option);
|
|
|
|
|
|
// Sync real parent
|
|
|
syncRealContainer(container, option);
|
|
|
var existNode = findExistNode(key, option);
|
|
|
if (existNode) {
|
|
|
var _option$csp, _option$csp2;
|
|
|
if ((_option$csp = option.csp) !== null && _option$csp !== void 0 && _option$csp.nonce && existNode.nonce !== ((_option$csp2 = option.csp) === null || _option$csp2 === void 0 ? void 0 : _option$csp2.nonce)) {
|
|
|
var _option$csp3;
|
|
|
existNode.nonce = (_option$csp3 = option.csp) === null || _option$csp3 === void 0 ? void 0 : _option$csp3.nonce;
|
|
|
}
|
|
|
if (existNode.innerHTML !== css) {
|
|
|
existNode.innerHTML = css;
|
|
|
}
|
|
|
return existNode;
|
|
|
}
|
|
|
var newNode = injectCSS(css, option);
|
|
|
newNode.setAttribute(getMark(option), key);
|
|
|
return newNode;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/Dom/isVisible.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/Dom/isVisible.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _default = function _default(element) {
|
|
|
if (!element) {
|
|
|
return false;
|
|
|
}
|
|
|
if (element instanceof Element) {
|
|
|
if (element.offsetParent) {
|
|
|
return true;
|
|
|
}
|
|
|
if (element.getBBox) {
|
|
|
var _getBBox = element.getBBox(),
|
|
|
width = _getBBox.width,
|
|
|
height = _getBBox.height;
|
|
|
if (width || height) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
if (element.getBoundingClientRect) {
|
|
|
var _element$getBoundingC = element.getBoundingClientRect(),
|
|
|
_width = _element$getBoundingC.width,
|
|
|
_height = _element$getBoundingC.height;
|
|
|
if (_width || _height) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return false;
|
|
|
};
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/React/render.js":
|
|
|
/*!**************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/React/render.js ***!
|
|
|
\**************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports._r = _r;
|
|
|
exports._u = _u;
|
|
|
exports.render = render;
|
|
|
exports.unmount = unmount;
|
|
|
var _regeneratorRuntime2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/regeneratorRuntime */ "./node_modules/@babel/runtime/helpers/regeneratorRuntime.js"));
|
|
|
var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ "./node_modules/@babel/runtime/helpers/asyncToGenerator.js"));
|
|
|
var _typeof2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js"));
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var ReactDOM = _interopRequireWildcard(__webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js"));
|
|
|
// Let compiler not to search module usage
|
|
|
var fullClone = (0, _objectSpread2.default)({}, ReactDOM);
|
|
|
var version = fullClone.version,
|
|
|
reactRender = fullClone.render,
|
|
|
unmountComponentAtNode = fullClone.unmountComponentAtNode;
|
|
|
var createRoot;
|
|
|
try {
|
|
|
var mainVersion = Number((version || '').split('.')[0]);
|
|
|
if (mainVersion >= 18) {
|
|
|
createRoot = fullClone.createRoot;
|
|
|
}
|
|
|
} catch (e) {
|
|
|
// Do nothing;
|
|
|
}
|
|
|
function toggleWarning(skip) {
|
|
|
var __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = fullClone.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
|
if (__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED && (0, _typeof2.default)(__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED) === 'object') {
|
|
|
__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.usingClientEntryPoint = skip;
|
|
|
}
|
|
|
}
|
|
|
var MARK = '__rc_react_root__';
|
|
|
|
|
|
// ========================== Render ==========================
|
|
|
|
|
|
function modernRender(node, container) {
|
|
|
toggleWarning(true);
|
|
|
var root = container[MARK] || createRoot(container);
|
|
|
toggleWarning(false);
|
|
|
root.render(node);
|
|
|
container[MARK] = root;
|
|
|
}
|
|
|
function legacyRender(node, container) {
|
|
|
reactRender(node, container);
|
|
|
}
|
|
|
|
|
|
/** @private Test usage. Not work in prod */
|
|
|
function _r(node, container) {
|
|
|
if (true) {
|
|
|
return legacyRender(node, container);
|
|
|
}
|
|
|
}
|
|
|
function render(node, container) {
|
|
|
if (createRoot) {
|
|
|
modernRender(node, container);
|
|
|
return;
|
|
|
}
|
|
|
legacyRender(node, container);
|
|
|
}
|
|
|
|
|
|
// ========================= Unmount ==========================
|
|
|
function modernUnmount(_x) {
|
|
|
return _modernUnmount.apply(this, arguments);
|
|
|
}
|
|
|
function _modernUnmount() {
|
|
|
_modernUnmount = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee(container) {
|
|
|
return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
|
|
|
while (1) switch (_context.prev = _context.next) {
|
|
|
case 0:
|
|
|
return _context.abrupt("return", Promise.resolve().then(function () {
|
|
|
var _container$MARK;
|
|
|
(_container$MARK = container[MARK]) === null || _container$MARK === void 0 ? void 0 : _container$MARK.unmount();
|
|
|
delete container[MARK];
|
|
|
}));
|
|
|
case 1:
|
|
|
case "end":
|
|
|
return _context.stop();
|
|
|
}
|
|
|
}, _callee);
|
|
|
}));
|
|
|
return _modernUnmount.apply(this, arguments);
|
|
|
}
|
|
|
function legacyUnmount(container) {
|
|
|
unmountComponentAtNode(container);
|
|
|
}
|
|
|
|
|
|
/** @private Test usage. Not work in prod */
|
|
|
function _u(container) {
|
|
|
if (true) {
|
|
|
return legacyUnmount(container);
|
|
|
}
|
|
|
}
|
|
|
function unmount(_x2) {
|
|
|
return _unmount.apply(this, arguments);
|
|
|
}
|
|
|
function _unmount() {
|
|
|
_unmount = (0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2(container) {
|
|
|
return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
|
|
|
while (1) switch (_context2.prev = _context2.next) {
|
|
|
case 0:
|
|
|
if (!(createRoot !== undefined)) {
|
|
|
_context2.next = 2;
|
|
|
break;
|
|
|
}
|
|
|
return _context2.abrupt("return", modernUnmount(container));
|
|
|
case 2:
|
|
|
legacyUnmount(container);
|
|
|
case 3:
|
|
|
case "end":
|
|
|
return _context2.stop();
|
|
|
}
|
|
|
}, _callee2);
|
|
|
}));
|
|
|
return _unmount.apply(this, arguments);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/hooks/useMemo.js":
|
|
|
/*!***************************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/hooks/useMemo.js ***!
|
|
|
\***************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireWildcard = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireWildcard */ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = useMemo;
|
|
|
var React = _interopRequireWildcard(__webpack_require__(/*! react */ "./node_modules/react/index.js"));
|
|
|
function useMemo(getValue, condition, shouldUpdate) {
|
|
|
var cacheRef = React.useRef({});
|
|
|
if (!('value' in cacheRef.current) || shouldUpdate(cacheRef.current.condition, condition)) {
|
|
|
cacheRef.current.value = getValue();
|
|
|
cacheRef.current.condition = condition;
|
|
|
}
|
|
|
return cacheRef.current.value;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/isEqual.js":
|
|
|
/*!*********************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/isEqual.js ***!
|
|
|
\*********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var _typeof2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js"));
|
|
|
var _warning = _interopRequireDefault(__webpack_require__(/*! ./warning */ "./node_modules/rc-util/lib/warning.js"));
|
|
|
/**
|
|
|
* Deeply compares two object literals.
|
|
|
* @param obj1 object 1
|
|
|
* @param obj2 object 2
|
|
|
* @param shallow shallow compare
|
|
|
* @returns
|
|
|
*/
|
|
|
function isEqual(obj1, obj2) {
|
|
|
var shallow = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
|
// https://github.com/mapbox/mapbox-gl-js/pull/5979/files#diff-fde7145050c47cc3a306856efd5f9c3016e86e859de9afbd02c879be5067e58f
|
|
|
var refSet = new Set();
|
|
|
function deepEqual(a, b) {
|
|
|
var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
|
|
|
var circular = refSet.has(a);
|
|
|
(0, _warning.default)(!circular, 'Warning: There may be circular references');
|
|
|
if (circular) {
|
|
|
return false;
|
|
|
}
|
|
|
if (a === b) {
|
|
|
return true;
|
|
|
}
|
|
|
if (shallow && level > 1) {
|
|
|
return false;
|
|
|
}
|
|
|
refSet.add(a);
|
|
|
var newLevel = level + 1;
|
|
|
if (Array.isArray(a)) {
|
|
|
if (!Array.isArray(b) || a.length !== b.length) {
|
|
|
return false;
|
|
|
}
|
|
|
for (var i = 0; i < a.length; i++) {
|
|
|
if (!deepEqual(a[i], b[i], newLevel)) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
return true;
|
|
|
}
|
|
|
if (a && b && (0, _typeof2.default)(a) === 'object' && (0, _typeof2.default)(b) === 'object') {
|
|
|
var keys = Object.keys(a);
|
|
|
if (keys.length !== Object.keys(b).length) {
|
|
|
return false;
|
|
|
}
|
|
|
return keys.every(function (key) {
|
|
|
return deepEqual(a[key], b[key], newLevel);
|
|
|
});
|
|
|
}
|
|
|
// other
|
|
|
return false;
|
|
|
}
|
|
|
return deepEqual(obj1, obj2);
|
|
|
}
|
|
|
var _default = isEqual;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/omit.js":
|
|
|
/*!******************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/omit.js ***!
|
|
|
\******************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = omit;
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
function omit(obj, fields) {
|
|
|
var clone = (0, _objectSpread2.default)({}, obj);
|
|
|
if (Array.isArray(fields)) {
|
|
|
fields.forEach(function (key) {
|
|
|
delete clone[key];
|
|
|
});
|
|
|
}
|
|
|
return clone;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/raf.js":
|
|
|
/*!*****************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/raf.js ***!
|
|
|
\*****************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = void 0;
|
|
|
var raf = function raf(callback) {
|
|
|
return +setTimeout(callback, 16);
|
|
|
};
|
|
|
var caf = function caf(num) {
|
|
|
return clearTimeout(num);
|
|
|
};
|
|
|
if (typeof window !== 'undefined' && 'requestAnimationFrame' in window) {
|
|
|
raf = function raf(callback) {
|
|
|
return window.requestAnimationFrame(callback);
|
|
|
};
|
|
|
caf = function caf(handle) {
|
|
|
return window.cancelAnimationFrame(handle);
|
|
|
};
|
|
|
}
|
|
|
var rafUUID = 0;
|
|
|
var rafIds = new Map();
|
|
|
function cleanup(id) {
|
|
|
rafIds.delete(id);
|
|
|
}
|
|
|
var wrapperRaf = function wrapperRaf(callback) {
|
|
|
var times = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
|
|
|
rafUUID += 1;
|
|
|
var id = rafUUID;
|
|
|
function callRef(leftTimes) {
|
|
|
if (leftTimes === 0) {
|
|
|
// Clean up
|
|
|
cleanup(id);
|
|
|
|
|
|
// Trigger
|
|
|
callback();
|
|
|
} else {
|
|
|
// Next raf
|
|
|
var realId = raf(function () {
|
|
|
callRef(leftTimes - 1);
|
|
|
});
|
|
|
|
|
|
// Bind real raf id
|
|
|
rafIds.set(id, realId);
|
|
|
}
|
|
|
}
|
|
|
callRef(times);
|
|
|
return id;
|
|
|
};
|
|
|
wrapperRaf.cancel = function (id) {
|
|
|
var realId = rafIds.get(id);
|
|
|
cleanup(realId);
|
|
|
return caf(realId);
|
|
|
};
|
|
|
var _default = wrapperRaf;
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/ref.js":
|
|
|
/*!*****************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/ref.js ***!
|
|
|
\*****************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.composeRef = composeRef;
|
|
|
exports.fillRef = fillRef;
|
|
|
exports.supportRef = supportRef;
|
|
|
exports.useComposeRef = useComposeRef;
|
|
|
var _typeof2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/@babel/runtime/helpers/typeof.js"));
|
|
|
var _reactIs = __webpack_require__(/*! react-is */ "./node_modules/react-is/index.js");
|
|
|
var _useMemo = _interopRequireDefault(__webpack_require__(/*! ./hooks/useMemo */ "./node_modules/rc-util/lib/hooks/useMemo.js"));
|
|
|
/* eslint-disable no-param-reassign */
|
|
|
|
|
|
function fillRef(ref, node) {
|
|
|
if (typeof ref === 'function') {
|
|
|
ref(node);
|
|
|
} else if ((0, _typeof2.default)(ref) === 'object' && ref && 'current' in ref) {
|
|
|
ref.current = node;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Merge refs into one ref function to support ref passing.
|
|
|
*/
|
|
|
function composeRef() {
|
|
|
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
|
refs[_key] = arguments[_key];
|
|
|
}
|
|
|
var refList = refs.filter(function (ref) {
|
|
|
return ref;
|
|
|
});
|
|
|
if (refList.length <= 1) {
|
|
|
return refList[0];
|
|
|
}
|
|
|
return function (node) {
|
|
|
refs.forEach(function (ref) {
|
|
|
fillRef(ref, node);
|
|
|
});
|
|
|
};
|
|
|
}
|
|
|
function useComposeRef() {
|
|
|
for (var _len2 = arguments.length, refs = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
|
|
refs[_key2] = arguments[_key2];
|
|
|
}
|
|
|
return (0, _useMemo.default)(function () {
|
|
|
return composeRef.apply(void 0, refs);
|
|
|
}, refs, function (prev, next) {
|
|
|
return prev.length === next.length && prev.every(function (ref, i) {
|
|
|
return ref === next[i];
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
function supportRef(nodeOrComponent) {
|
|
|
var _type$prototype, _nodeOrComponent$prot;
|
|
|
var type = (0, _reactIs.isMemo)(nodeOrComponent) ? nodeOrComponent.type.type : nodeOrComponent.type;
|
|
|
|
|
|
// Function component node
|
|
|
if (typeof type === 'function' && !((_type$prototype = type.prototype) !== null && _type$prototype !== void 0 && _type$prototype.render)) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
// Class component
|
|
|
if (typeof nodeOrComponent === 'function' && !((_nodeOrComponent$prot = nodeOrComponent.prototype) !== null && _nodeOrComponent$prot !== void 0 && _nodeOrComponent$prot.render)) {
|
|
|
return false;
|
|
|
}
|
|
|
return true;
|
|
|
}
|
|
|
/* eslint-enable */
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/utils/get.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/utils/get.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = get;
|
|
|
function get(entity, path) {
|
|
|
var current = entity;
|
|
|
for (var i = 0; i < path.length; i += 1) {
|
|
|
if (current === null || current === undefined) {
|
|
|
return undefined;
|
|
|
}
|
|
|
current = current[path[i]];
|
|
|
}
|
|
|
return current;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/utils/set.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/utils/set.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var _interopRequireDefault = (__webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js")["default"]);
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports["default"] = set;
|
|
|
var _objectSpread2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/objectSpread2 */ "./node_modules/@babel/runtime/helpers/objectSpread2.js"));
|
|
|
var _toConsumableArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toConsumableArray */ "./node_modules/@babel/runtime/helpers/toConsumableArray.js"));
|
|
|
var _toArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/toArray */ "./node_modules/@babel/runtime/helpers/toArray.js"));
|
|
|
var _get = _interopRequireDefault(__webpack_require__(/*! ./get */ "./node_modules/rc-util/lib/utils/get.js"));
|
|
|
function internalSet(entity, paths, value, removeIfUndefined) {
|
|
|
if (!paths.length) {
|
|
|
return value;
|
|
|
}
|
|
|
var _paths = (0, _toArray2.default)(paths),
|
|
|
path = _paths[0],
|
|
|
restPath = _paths.slice(1);
|
|
|
var clone;
|
|
|
if (!entity && typeof path === 'number') {
|
|
|
clone = [];
|
|
|
} else if (Array.isArray(entity)) {
|
|
|
clone = (0, _toConsumableArray2.default)(entity);
|
|
|
} else {
|
|
|
clone = (0, _objectSpread2.default)({}, entity);
|
|
|
}
|
|
|
|
|
|
// Delete prop if `removeIfUndefined` and value is undefined
|
|
|
if (removeIfUndefined && value === undefined && restPath.length === 1) {
|
|
|
delete clone[path][restPath[0]];
|
|
|
} else {
|
|
|
clone[path] = internalSet(clone[path], restPath, value, removeIfUndefined);
|
|
|
}
|
|
|
return clone;
|
|
|
}
|
|
|
function set(entity, paths, value) {
|
|
|
var removeIfUndefined = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
|
// Do nothing if `removeIfUndefined` and parent object not exist
|
|
|
if (paths.length && removeIfUndefined && value === undefined && !(0, _get.default)(entity, paths.slice(0, -1))) {
|
|
|
return entity;
|
|
|
}
|
|
|
return internalSet(entity, paths, value, removeIfUndefined);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/rc-util/lib/warning.js":
|
|
|
/*!*********************************************!*\
|
|
|
!*** ./node_modules/rc-util/lib/warning.js ***!
|
|
|
\*********************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
Object.defineProperty(exports, "__esModule", ({
|
|
|
value: true
|
|
|
}));
|
|
|
exports.call = call;
|
|
|
exports["default"] = void 0;
|
|
|
exports.note = note;
|
|
|
exports.noteOnce = noteOnce;
|
|
|
exports.resetWarned = resetWarned;
|
|
|
exports.warning = warning;
|
|
|
exports.warningOnce = warningOnce;
|
|
|
/* eslint-disable no-console */
|
|
|
var warned = {};
|
|
|
function warning(valid, message) {
|
|
|
// Support uglify
|
|
|
if ( true && !valid && console !== undefined) {
|
|
|
console.error("Warning: ".concat(message));
|
|
|
}
|
|
|
}
|
|
|
function note(valid, message) {
|
|
|
// Support uglify
|
|
|
if ( true && !valid && console !== undefined) {
|
|
|
console.warn("Note: ".concat(message));
|
|
|
}
|
|
|
}
|
|
|
function resetWarned() {
|
|
|
warned = {};
|
|
|
}
|
|
|
function call(method, valid, message) {
|
|
|
if (!valid && !warned[message]) {
|
|
|
method(false, message);
|
|
|
warned[message] = true;
|
|
|
}
|
|
|
}
|
|
|
function warningOnce(valid, message) {
|
|
|
call(warning, valid, message);
|
|
|
}
|
|
|
function noteOnce(valid, message) {
|
|
|
call(note, valid, message);
|
|
|
}
|
|
|
var _default = warningOnce;
|
|
|
/* eslint-enable */
|
|
|
exports["default"] = _default;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react-dom/cjs/react-dom.development.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/react-dom/cjs/react-dom.development.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
/**
|
|
|
* @license React
|
|
|
* react-dom.development.js
|
|
|
*
|
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
|
*
|
|
|
* This source code is licensed under the MIT license found in the
|
|
|
* LICENSE file in the root directory of this source tree.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
if (true) {
|
|
|
(function() {
|
|
|
|
|
|
'use strict';
|
|
|
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart ===
|
|
|
'function'
|
|
|
) {
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
|
|
|
}
|
|
|
var React = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
var Scheduler = __webpack_require__(/*! scheduler */ "./node_modules/scheduler/index.js");
|
|
|
|
|
|
var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
|
|
|
|
var suppressWarning = false;
|
|
|
function setSuppressWarning(newSuppressWarning) {
|
|
|
{
|
|
|
suppressWarning = newSuppressWarning;
|
|
|
}
|
|
|
} // In DEV, calls to console.warn and console.error get replaced
|
|
|
// by calls to these methods by a Babel plugin.
|
|
|
//
|
|
|
// In PROD (or in packages without access to React internals),
|
|
|
// they are left as they are instead.
|
|
|
|
|
|
function warn(format) {
|
|
|
{
|
|
|
if (!suppressWarning) {
|
|
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
|
args[_key - 1] = arguments[_key];
|
|
|
}
|
|
|
|
|
|
printWarning('warn', format, args);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function error(format) {
|
|
|
{
|
|
|
if (!suppressWarning) {
|
|
|
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
|
|
args[_key2 - 1] = arguments[_key2];
|
|
|
}
|
|
|
|
|
|
printWarning('error', format, args);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function printWarning(level, format, args) {
|
|
|
// When changing this logic, you might want to also
|
|
|
// update consoleWithStackDev.www.js as well.
|
|
|
{
|
|
|
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
|
var stack = ReactDebugCurrentFrame.getStackAddendum();
|
|
|
|
|
|
if (stack !== '') {
|
|
|
format += '%s';
|
|
|
args = args.concat([stack]);
|
|
|
} // eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
|
|
|
|
|
|
var argsWithFormat = args.map(function (item) {
|
|
|
return String(item);
|
|
|
}); // Careful: RN currently depends on this prefix
|
|
|
|
|
|
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
|
|
// breaks IE9: https://github.com/facebook/react/issues/13610
|
|
|
// eslint-disable-next-line react-internal/no-production-logging
|
|
|
|
|
|
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var FunctionComponent = 0;
|
|
|
var ClassComponent = 1;
|
|
|
var IndeterminateComponent = 2; // Before we know whether it is function or class
|
|
|
|
|
|
var HostRoot = 3; // Root of a host tree. Could be nested inside another node.
|
|
|
|
|
|
var HostPortal = 4; // A subtree. Could be an entry point to a different renderer.
|
|
|
|
|
|
var HostComponent = 5;
|
|
|
var HostText = 6;
|
|
|
var Fragment = 7;
|
|
|
var Mode = 8;
|
|
|
var ContextConsumer = 9;
|
|
|
var ContextProvider = 10;
|
|
|
var ForwardRef = 11;
|
|
|
var Profiler = 12;
|
|
|
var SuspenseComponent = 13;
|
|
|
var MemoComponent = 14;
|
|
|
var SimpleMemoComponent = 15;
|
|
|
var LazyComponent = 16;
|
|
|
var IncompleteClassComponent = 17;
|
|
|
var DehydratedFragment = 18;
|
|
|
var SuspenseListComponent = 19;
|
|
|
var ScopeComponent = 21;
|
|
|
var OffscreenComponent = 22;
|
|
|
var LegacyHiddenComponent = 23;
|
|
|
var CacheComponent = 24;
|
|
|
var TracingMarkerComponent = 25;
|
|
|
|
|
|
// -----------------------------------------------------------------------------
|
|
|
|
|
|
var enableClientRenderFallbackOnTextMismatch = true; // TODO: Need to review this code one more time before landing
|
|
|
// the react-reconciler package.
|
|
|
|
|
|
var enableNewReconciler = false; // Support legacy Primer support on internal FB www
|
|
|
|
|
|
var enableLazyContextPropagation = false; // FB-only usage. The new API has different semantics.
|
|
|
|
|
|
var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber
|
|
|
|
|
|
var enableSuspenseAvoidThisFallback = false; // Enables unstable_avoidThisFallback feature in Fizz
|
|
|
// React DOM Chopping Block
|
|
|
//
|
|
|
// Similar to main Chopping Block but only flags related to React DOM. These are
|
|
|
// grouped because we will likely batch all of them into a single major release.
|
|
|
// -----------------------------------------------------------------------------
|
|
|
// Disable support for comment nodes as React DOM containers. Already disabled
|
|
|
// in open source, but www codebase still relies on it. Need to remove.
|
|
|
|
|
|
var disableCommentsAsDOMContainers = true; // Disable javascript: URL strings in href for XSS protection.
|
|
|
// and client rendering, mostly to allow JSX attributes to apply to the custom
|
|
|
// element's object properties instead of only HTML attributes.
|
|
|
// https://github.com/facebook/react/issues/11347
|
|
|
|
|
|
var enableCustomElementPropertySupport = false; // Disables children for <textarea> elements
|
|
|
var warnAboutStringRefs = false; // -----------------------------------------------------------------------------
|
|
|
// Debugging and DevTools
|
|
|
// -----------------------------------------------------------------------------
|
|
|
// Adds user timing marks for e.g. state updates, suspense, and work loop stuff,
|
|
|
// for an experimental timeline tool.
|
|
|
|
|
|
var enableSchedulingProfiler = true; // Helps identify side effects in render-phase lifecycle hooks and setState
|
|
|
|
|
|
var enableProfilerTimer = true; // Record durations for commit and passive effects phases.
|
|
|
|
|
|
var enableProfilerCommitHooks = true; // Phase param passed to onRender callback differentiates between an "update" and a "cascading-update".
|
|
|
|
|
|
var allNativeEvents = new Set();
|
|
|
/**
|
|
|
* Mapping from registration name to event name
|
|
|
*/
|
|
|
|
|
|
|
|
|
var registrationNameDependencies = {};
|
|
|
/**
|
|
|
* Mapping from lowercase registration names to the properly cased version,
|
|
|
* used to warn in the case of missing event handlers. Available
|
|
|
* only in true.
|
|
|
* @type {Object}
|
|
|
*/
|
|
|
|
|
|
var possibleRegistrationNames = {} ; // Trust the developer to only use possibleRegistrationNames in true
|
|
|
|
|
|
function registerTwoPhaseEvent(registrationName, dependencies) {
|
|
|
registerDirectEvent(registrationName, dependencies);
|
|
|
registerDirectEvent(registrationName + 'Capture', dependencies);
|
|
|
}
|
|
|
function registerDirectEvent(registrationName, dependencies) {
|
|
|
{
|
|
|
if (registrationNameDependencies[registrationName]) {
|
|
|
error('EventRegistry: More than one plugin attempted to publish the same ' + 'registration name, `%s`.', registrationName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
registrationNameDependencies[registrationName] = dependencies;
|
|
|
|
|
|
{
|
|
|
var lowerCasedName = registrationName.toLowerCase();
|
|
|
possibleRegistrationNames[lowerCasedName] = registrationName;
|
|
|
|
|
|
if (registrationName === 'onDoubleClick') {
|
|
|
possibleRegistrationNames.ondblclick = registrationName;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
for (var i = 0; i < dependencies.length; i++) {
|
|
|
allNativeEvents.add(dependencies[i]);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var canUseDOM = !!(typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined');
|
|
|
|
|
|
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
|
|
|
|
/*
|
|
|
* The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol
|
|
|
* and Temporal.* types. See https://github.com/facebook/react/pull/22064.
|
|
|
*
|
|
|
* The functions in this module will throw an easier-to-understand,
|
|
|
* easier-to-debug exception with a clear errors message message explaining the
|
|
|
* problem. (Instead of a confusing exception thrown inside the implementation
|
|
|
* of the `value` object).
|
|
|
*/
|
|
|
// $FlowFixMe only called in DEV, so void return is not possible.
|
|
|
function typeName(value) {
|
|
|
{
|
|
|
// toStringTag is needed for namespaced types like Temporal.Instant
|
|
|
var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag;
|
|
|
var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object';
|
|
|
return type;
|
|
|
}
|
|
|
} // $FlowFixMe only called in DEV, so void return is not possible.
|
|
|
|
|
|
|
|
|
function willCoercionThrow(value) {
|
|
|
{
|
|
|
try {
|
|
|
testStringCoercion(value);
|
|
|
return false;
|
|
|
} catch (e) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function testStringCoercion(value) {
|
|
|
// If you ended up here by following an exception call stack, here's what's
|
|
|
// happened: you supplied an object or symbol value to React (as a prop, key,
|
|
|
// DOM attribute, CSS property, string ref, etc.) and when React tried to
|
|
|
// coerce it to a string using `'' + value`, an exception was thrown.
|
|
|
//
|
|
|
// The most common types that will cause this exception are `Symbol` instances
|
|
|
// and Temporal objects like `Temporal.Instant`. But any object that has a
|
|
|
// `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this
|
|
|
// exception. (Library authors do this to prevent users from using built-in
|
|
|
// numeric operators like `+` or comparison operators like `>=` because custom
|
|
|
// methods are needed to perform accurate arithmetic or comparison.)
|
|
|
//
|
|
|
// To fix the problem, coerce this object or symbol value to a string before
|
|
|
// passing it to React. The most reliable way is usually `String(value)`.
|
|
|
//
|
|
|
// To find which value is throwing, check the browser or debugger console.
|
|
|
// Before this exception was thrown, there should be `console.error` output
|
|
|
// that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the
|
|
|
// problem and how that type was used: key, atrribute, input value prop, etc.
|
|
|
// In most cases, this console output also shows the component and its
|
|
|
// ancestor components where the exception happened.
|
|
|
//
|
|
|
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
return '' + value;
|
|
|
}
|
|
|
|
|
|
function checkAttributeStringCoercion(value, attributeName) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('The provided `%s` attribute is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', attributeName, typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function checkKeyStringCoercion(value) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function checkPropStringCoercion(value, propName) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('The provided `%s` prop is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', propName, typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function checkCSSPropertyStringCoercion(value, propName) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('The provided `%s` CSS property is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', propName, typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function checkHtmlStringCoercion(value) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('The provided HTML markup uses a value of unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function checkFormFieldValueStringCoercion(value) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('Form field values (value, checked, defaultValue, or defaultChecked props)' + ' must be strings, not %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// A reserved attribute.
|
|
|
// It is handled by React separately and shouldn't be written to the DOM.
|
|
|
var RESERVED = 0; // A simple string attribute.
|
|
|
// Attributes that aren't in the filter are presumed to have this type.
|
|
|
|
|
|
var STRING = 1; // A string attribute that accepts booleans in React. In HTML, these are called
|
|
|
// "enumerated" attributes with "true" and "false" as possible values.
|
|
|
// When true, it should be set to a "true" string.
|
|
|
// When false, it should be set to a "false" string.
|
|
|
|
|
|
var BOOLEANISH_STRING = 2; // A real boolean attribute.
|
|
|
// When true, it should be present (set either to an empty string or its name).
|
|
|
// When false, it should be omitted.
|
|
|
|
|
|
var BOOLEAN = 3; // An attribute that can be used as a flag as well as with a value.
|
|
|
// When true, it should be present (set either to an empty string or its name).
|
|
|
// When false, it should be omitted.
|
|
|
// For any other value, should be present with that value.
|
|
|
|
|
|
var OVERLOADED_BOOLEAN = 4; // An attribute that must be numeric or parse as a numeric.
|
|
|
// When falsy, it should be removed.
|
|
|
|
|
|
var NUMERIC = 5; // An attribute that must be positive numeric or parse as a positive numeric.
|
|
|
// When falsy, it should be removed.
|
|
|
|
|
|
var POSITIVE_NUMERIC = 6;
|
|
|
|
|
|
/* eslint-disable max-len */
|
|
|
var ATTRIBUTE_NAME_START_CHAR = ":A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD";
|
|
|
/* eslint-enable max-len */
|
|
|
|
|
|
var ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_START_CHAR + "\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040";
|
|
|
var VALID_ATTRIBUTE_NAME_REGEX = new RegExp('^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$');
|
|
|
var illegalAttributeNameCache = {};
|
|
|
var validatedAttributeNameCache = {};
|
|
|
function isAttributeNameSafe(attributeName) {
|
|
|
if (hasOwnProperty.call(validatedAttributeNameCache, attributeName)) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (hasOwnProperty.call(illegalAttributeNameCache, attributeName)) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)) {
|
|
|
validatedAttributeNameCache[attributeName] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
illegalAttributeNameCache[attributeName] = true;
|
|
|
|
|
|
{
|
|
|
error('Invalid attribute name: `%s`', attributeName);
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
function shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag) {
|
|
|
if (propertyInfo !== null) {
|
|
|
return propertyInfo.type === RESERVED;
|
|
|
}
|
|
|
|
|
|
if (isCustomComponentTag) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (name.length > 2 && (name[0] === 'o' || name[0] === 'O') && (name[1] === 'n' || name[1] === 'N')) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
function shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag) {
|
|
|
if (propertyInfo !== null && propertyInfo.type === RESERVED) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
switch (typeof value) {
|
|
|
case 'function': // $FlowIssue symbol is perfectly valid here
|
|
|
|
|
|
case 'symbol':
|
|
|
// eslint-disable-line
|
|
|
return true;
|
|
|
|
|
|
case 'boolean':
|
|
|
{
|
|
|
if (isCustomComponentTag) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (propertyInfo !== null) {
|
|
|
return !propertyInfo.acceptsBooleans;
|
|
|
} else {
|
|
|
var prefix = name.toLowerCase().slice(0, 5);
|
|
|
return prefix !== 'data-' && prefix !== 'aria-';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
function shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag) {
|
|
|
if (value === null || typeof value === 'undefined') {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag)) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (isCustomComponentTag) {
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (propertyInfo !== null) {
|
|
|
|
|
|
switch (propertyInfo.type) {
|
|
|
case BOOLEAN:
|
|
|
return !value;
|
|
|
|
|
|
case OVERLOADED_BOOLEAN:
|
|
|
return value === false;
|
|
|
|
|
|
case NUMERIC:
|
|
|
return isNaN(value);
|
|
|
|
|
|
case POSITIVE_NUMERIC:
|
|
|
return isNaN(value) || value < 1;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
function getPropertyInfo(name) {
|
|
|
return properties.hasOwnProperty(name) ? properties[name] : null;
|
|
|
}
|
|
|
|
|
|
function PropertyInfoRecord(name, type, mustUseProperty, attributeName, attributeNamespace, sanitizeURL, removeEmptyString) {
|
|
|
this.acceptsBooleans = type === BOOLEANISH_STRING || type === BOOLEAN || type === OVERLOADED_BOOLEAN;
|
|
|
this.attributeName = attributeName;
|
|
|
this.attributeNamespace = attributeNamespace;
|
|
|
this.mustUseProperty = mustUseProperty;
|
|
|
this.propertyName = name;
|
|
|
this.type = type;
|
|
|
this.sanitizeURL = sanitizeURL;
|
|
|
this.removeEmptyString = removeEmptyString;
|
|
|
} // When adding attributes to this list, be sure to also add them to
|
|
|
// the `possibleStandardNames` module to ensure casing and incorrect
|
|
|
// name warnings.
|
|
|
|
|
|
|
|
|
var properties = {}; // These props are reserved by React. They shouldn't be written to the DOM.
|
|
|
|
|
|
var reservedProps = ['children', 'dangerouslySetInnerHTML', // TODO: This prevents the assignment of defaultValue to regular
|
|
|
// elements (not just inputs). Now that ReactDOMInput assigns to the
|
|
|
// defaultValue property -- do we need this?
|
|
|
'defaultValue', 'defaultChecked', 'innerHTML', 'suppressContentEditableWarning', 'suppressHydrationWarning', 'style'];
|
|
|
|
|
|
reservedProps.forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, RESERVED, false, // mustUseProperty
|
|
|
name, // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // A few React string attributes have a different name.
|
|
|
// This is a mapping from React prop names to the attribute names.
|
|
|
|
|
|
[['acceptCharset', 'accept-charset'], ['className', 'class'], ['htmlFor', 'for'], ['httpEquiv', 'http-equiv']].forEach(function (_ref) {
|
|
|
var name = _ref[0],
|
|
|
attributeName = _ref[1];
|
|
|
properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
|
|
|
attributeName, // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are "enumerated" HTML attributes that accept "true" and "false".
|
|
|
// In React, we let users pass `true` and `false` even though technically
|
|
|
// these aren't boolean attributes (they are coerced to strings).
|
|
|
|
|
|
['contentEditable', 'draggable', 'spellCheck', 'value'].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty
|
|
|
name.toLowerCase(), // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are "enumerated" SVG attributes that accept "true" and "false".
|
|
|
// In React, we let users pass `true` and `false` even though technically
|
|
|
// these aren't boolean attributes (they are coerced to strings).
|
|
|
// Since these are SVG attributes, their attribute names are case-sensitive.
|
|
|
|
|
|
['autoReverse', 'externalResourcesRequired', 'focusable', 'preserveAlpha'].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty
|
|
|
name, // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are HTML boolean attributes.
|
|
|
|
|
|
['allowFullScreen', 'async', // Note: there is a special case that prevents it from being written to the DOM
|
|
|
// on the client side because the browsers are inconsistent. Instead we call focus().
|
|
|
'autoFocus', 'autoPlay', 'controls', 'default', 'defer', 'disabled', 'disablePictureInPicture', 'disableRemotePlayback', 'formNoValidate', 'hidden', 'loop', 'noModule', 'noValidate', 'open', 'playsInline', 'readOnly', 'required', 'reversed', 'scoped', 'seamless', // Microdata
|
|
|
'itemScope'].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, BOOLEAN, false, // mustUseProperty
|
|
|
name.toLowerCase(), // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are the few React props that we set as DOM properties
|
|
|
// rather than attributes. These are all booleans.
|
|
|
|
|
|
['checked', // Note: `option.selected` is not updated if `select.multiple` is
|
|
|
// disabled with `removeAttribute`. We have special logic for handling this.
|
|
|
'multiple', 'muted', 'selected' // NOTE: if you add a camelCased prop to this list,
|
|
|
// you'll need to set attributeName to name.toLowerCase()
|
|
|
// instead in the assignment below.
|
|
|
].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, BOOLEAN, true, // mustUseProperty
|
|
|
name, // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are HTML attributes that are "overloaded booleans": they behave like
|
|
|
// booleans, but can also accept a string value.
|
|
|
|
|
|
['capture', 'download' // NOTE: if you add a camelCased prop to this list,
|
|
|
// you'll need to set attributeName to name.toLowerCase()
|
|
|
// instead in the assignment below.
|
|
|
].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, OVERLOADED_BOOLEAN, false, // mustUseProperty
|
|
|
name, // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are HTML attributes that must be positive numbers.
|
|
|
|
|
|
['cols', 'rows', 'size', 'span' // NOTE: if you add a camelCased prop to this list,
|
|
|
// you'll need to set attributeName to name.toLowerCase()
|
|
|
// instead in the assignment below.
|
|
|
].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, POSITIVE_NUMERIC, false, // mustUseProperty
|
|
|
name, // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These are HTML attributes that must be numbers.
|
|
|
|
|
|
['rowSpan', 'start'].forEach(function (name) {
|
|
|
properties[name] = new PropertyInfoRecord(name, NUMERIC, false, // mustUseProperty
|
|
|
name.toLowerCase(), // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
});
|
|
|
var CAMELIZE = /[\-\:]([a-z])/g;
|
|
|
|
|
|
var capitalize = function (token) {
|
|
|
return token[1].toUpperCase();
|
|
|
}; // This is a list of all SVG attributes that need special casing, namespacing,
|
|
|
// or boolean value assignment. Regular attributes that just accept strings
|
|
|
// and have the same names are omitted, just like in the HTML attribute filter.
|
|
|
// Some of these attributes can be hard to find. This list was created by
|
|
|
// scraping the MDN documentation.
|
|
|
|
|
|
|
|
|
['accent-height', 'alignment-baseline', 'arabic-form', 'baseline-shift', 'cap-height', 'clip-path', 'clip-rule', 'color-interpolation', 'color-interpolation-filters', 'color-profile', 'color-rendering', 'dominant-baseline', 'enable-background', 'fill-opacity', 'fill-rule', 'flood-color', 'flood-opacity', 'font-family', 'font-size', 'font-size-adjust', 'font-stretch', 'font-style', 'font-variant', 'font-weight', 'glyph-name', 'glyph-orientation-horizontal', 'glyph-orientation-vertical', 'horiz-adv-x', 'horiz-origin-x', 'image-rendering', 'letter-spacing', 'lighting-color', 'marker-end', 'marker-mid', 'marker-start', 'overline-position', 'overline-thickness', 'paint-order', 'panose-1', 'pointer-events', 'rendering-intent', 'shape-rendering', 'stop-color', 'stop-opacity', 'strikethrough-position', 'strikethrough-thickness', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'text-anchor', 'text-decoration', 'text-rendering', 'underline-position', 'underline-thickness', 'unicode-bidi', 'unicode-range', 'units-per-em', 'v-alphabetic', 'v-hanging', 'v-ideographic', 'v-mathematical', 'vector-effect', 'vert-adv-y', 'vert-origin-x', 'vert-origin-y', 'word-spacing', 'writing-mode', 'xmlns:xlink', 'x-height' // NOTE: if you add a camelCased prop to this list,
|
|
|
// you'll need to set attributeName to name.toLowerCase()
|
|
|
// instead in the assignment below.
|
|
|
].forEach(function (attributeName) {
|
|
|
var name = attributeName.replace(CAMELIZE, capitalize);
|
|
|
properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
|
|
|
attributeName, null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // String SVG attributes with the xlink namespace.
|
|
|
|
|
|
['xlink:actuate', 'xlink:arcrole', 'xlink:role', 'xlink:show', 'xlink:title', 'xlink:type' // NOTE: if you add a camelCased prop to this list,
|
|
|
// you'll need to set attributeName to name.toLowerCase()
|
|
|
// instead in the assignment below.
|
|
|
].forEach(function (attributeName) {
|
|
|
var name = attributeName.replace(CAMELIZE, capitalize);
|
|
|
properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
|
|
|
attributeName, 'http://www.w3.org/1999/xlink', false, // sanitizeURL
|
|
|
false);
|
|
|
}); // String SVG attributes with the xml namespace.
|
|
|
|
|
|
['xml:base', 'xml:lang', 'xml:space' // NOTE: if you add a camelCased prop to this list,
|
|
|
// you'll need to set attributeName to name.toLowerCase()
|
|
|
// instead in the assignment below.
|
|
|
].forEach(function (attributeName) {
|
|
|
var name = attributeName.replace(CAMELIZE, capitalize);
|
|
|
properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty
|
|
|
attributeName, 'http://www.w3.org/XML/1998/namespace', false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These attribute exists both in HTML and SVG.
|
|
|
// The attribute name is case-sensitive in SVG so we can't just use
|
|
|
// the React name like we do for attributes that exist only in HTML.
|
|
|
|
|
|
['tabIndex', 'crossOrigin'].forEach(function (attributeName) {
|
|
|
properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty
|
|
|
attributeName.toLowerCase(), // attributeName
|
|
|
null, // attributeNamespace
|
|
|
false, // sanitizeURL
|
|
|
false);
|
|
|
}); // These attributes accept URLs. These must not allow javascript: URLS.
|
|
|
// These will also need to accept Trusted Types object in the future.
|
|
|
|
|
|
var xlinkHref = 'xlinkHref';
|
|
|
properties[xlinkHref] = new PropertyInfoRecord('xlinkHref', STRING, false, // mustUseProperty
|
|
|
'xlink:href', 'http://www.w3.org/1999/xlink', true, // sanitizeURL
|
|
|
false);
|
|
|
['src', 'href', 'action', 'formAction'].forEach(function (attributeName) {
|
|
|
properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty
|
|
|
attributeName.toLowerCase(), // attributeName
|
|
|
null, // attributeNamespace
|
|
|
true, // sanitizeURL
|
|
|
true);
|
|
|
});
|
|
|
|
|
|
// and any newline or tab are filtered out as if they're not part of the URL.
|
|
|
// https://url.spec.whatwg.org/#url-parsing
|
|
|
// Tab or newline are defined as \r\n\t:
|
|
|
// https://infra.spec.whatwg.org/#ascii-tab-or-newline
|
|
|
// A C0 control is a code point in the range \u0000 NULL to \u001F
|
|
|
// INFORMATION SEPARATOR ONE, inclusive:
|
|
|
// https://infra.spec.whatwg.org/#c0-control-or-space
|
|
|
|
|
|
/* eslint-disable max-len */
|
|
|
|
|
|
var isJavaScriptProtocol = /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*\:/i;
|
|
|
var didWarn = false;
|
|
|
|
|
|
function sanitizeURL(url) {
|
|
|
{
|
|
|
if (!didWarn && isJavaScriptProtocol.test(url)) {
|
|
|
didWarn = true;
|
|
|
|
|
|
error('A future version of React will block javascript: URLs as a security precaution. ' + 'Use event handlers instead if you can. If you need to generate unsafe HTML try ' + 'using dangerouslySetInnerHTML instead. React was passed %s.', JSON.stringify(url));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Get the value for a property on a node. Only used in DEV for SSR validation.
|
|
|
* The "expected" argument is used as a hint of what the expected value is.
|
|
|
* Some properties have multiple equivalent values.
|
|
|
*/
|
|
|
function getValueForProperty(node, name, expected, propertyInfo) {
|
|
|
{
|
|
|
if (propertyInfo.mustUseProperty) {
|
|
|
var propertyName = propertyInfo.propertyName;
|
|
|
return node[propertyName];
|
|
|
} else {
|
|
|
// This check protects multiple uses of `expected`, which is why the
|
|
|
// react-internal/safe-string-coercion rule is disabled in several spots
|
|
|
// below.
|
|
|
{
|
|
|
checkAttributeStringCoercion(expected, name);
|
|
|
}
|
|
|
|
|
|
if ( propertyInfo.sanitizeURL) {
|
|
|
// If we haven't fully disabled javascript: URLs, and if
|
|
|
// the hydration is successful of a javascript: URL, we
|
|
|
// still want to warn on the client.
|
|
|
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
sanitizeURL('' + expected);
|
|
|
}
|
|
|
|
|
|
var attributeName = propertyInfo.attributeName;
|
|
|
var stringValue = null;
|
|
|
|
|
|
if (propertyInfo.type === OVERLOADED_BOOLEAN) {
|
|
|
if (node.hasAttribute(attributeName)) {
|
|
|
var value = node.getAttribute(attributeName);
|
|
|
|
|
|
if (value === '') {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
|
|
|
return value;
|
|
|
} // eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
|
|
|
|
|
|
if (value === '' + expected) {
|
|
|
return expected;
|
|
|
}
|
|
|
|
|
|
return value;
|
|
|
}
|
|
|
} else if (node.hasAttribute(attributeName)) {
|
|
|
if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
|
|
|
// We had an attribute but shouldn't have had one, so read it
|
|
|
// for the error message.
|
|
|
return node.getAttribute(attributeName);
|
|
|
}
|
|
|
|
|
|
if (propertyInfo.type === BOOLEAN) {
|
|
|
// If this was a boolean, it doesn't matter what the value is
|
|
|
// the fact that we have it is the same as the expected.
|
|
|
return expected;
|
|
|
} // Even if this property uses a namespace we use getAttribute
|
|
|
// because we assume its namespaced name is the same as our config.
|
|
|
// To use getAttributeNS we need the local name which we don't have
|
|
|
// in our config atm.
|
|
|
|
|
|
|
|
|
stringValue = node.getAttribute(attributeName);
|
|
|
}
|
|
|
|
|
|
if (shouldRemoveAttribute(name, expected, propertyInfo, false)) {
|
|
|
return stringValue === null ? expected : stringValue; // eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
} else if (stringValue === '' + expected) {
|
|
|
return expected;
|
|
|
} else {
|
|
|
return stringValue;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Get the value for a attribute on a node. Only used in DEV for SSR validation.
|
|
|
* The third argument is used as a hint of what the expected value is. Some
|
|
|
* attributes have multiple equivalent values.
|
|
|
*/
|
|
|
|
|
|
function getValueForAttribute(node, name, expected, isCustomComponentTag) {
|
|
|
{
|
|
|
if (!isAttributeNameSafe(name)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (!node.hasAttribute(name)) {
|
|
|
return expected === undefined ? undefined : null;
|
|
|
}
|
|
|
|
|
|
var value = node.getAttribute(name);
|
|
|
|
|
|
{
|
|
|
checkAttributeStringCoercion(expected, name);
|
|
|
}
|
|
|
|
|
|
if (value === '' + expected) {
|
|
|
return expected;
|
|
|
}
|
|
|
|
|
|
return value;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Sets the value for a property on a node.
|
|
|
*
|
|
|
* @param {DOMElement} node
|
|
|
* @param {string} name
|
|
|
* @param {*} value
|
|
|
*/
|
|
|
|
|
|
function setValueForProperty(node, name, value, isCustomComponentTag) {
|
|
|
var propertyInfo = getPropertyInfo(name);
|
|
|
|
|
|
if (shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag)) {
|
|
|
value = null;
|
|
|
}
|
|
|
|
|
|
|
|
|
if (isCustomComponentTag || propertyInfo === null) {
|
|
|
if (isAttributeNameSafe(name)) {
|
|
|
var _attributeName = name;
|
|
|
|
|
|
if (value === null) {
|
|
|
node.removeAttribute(_attributeName);
|
|
|
} else {
|
|
|
{
|
|
|
checkAttributeStringCoercion(value, name);
|
|
|
}
|
|
|
|
|
|
node.setAttribute(_attributeName, '' + value);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var mustUseProperty = propertyInfo.mustUseProperty;
|
|
|
|
|
|
if (mustUseProperty) {
|
|
|
var propertyName = propertyInfo.propertyName;
|
|
|
|
|
|
if (value === null) {
|
|
|
var type = propertyInfo.type;
|
|
|
node[propertyName] = type === BOOLEAN ? false : '';
|
|
|
} else {
|
|
|
// Contrary to `setAttribute`, object properties are properly
|
|
|
// `toString`ed by IE8/9.
|
|
|
node[propertyName] = value;
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
} // The rest are treated as attributes with special cases.
|
|
|
|
|
|
|
|
|
var attributeName = propertyInfo.attributeName,
|
|
|
attributeNamespace = propertyInfo.attributeNamespace;
|
|
|
|
|
|
if (value === null) {
|
|
|
node.removeAttribute(attributeName);
|
|
|
} else {
|
|
|
var _type = propertyInfo.type;
|
|
|
var attributeValue;
|
|
|
|
|
|
if (_type === BOOLEAN || _type === OVERLOADED_BOOLEAN && value === true) {
|
|
|
// If attribute type is boolean, we know for sure it won't be an execution sink
|
|
|
// and we won't require Trusted Type here.
|
|
|
attributeValue = '';
|
|
|
} else {
|
|
|
// `setAttribute` with objects becomes only `[object]` in IE8/9,
|
|
|
// ('' + value) makes it output the correct toString()-value.
|
|
|
{
|
|
|
{
|
|
|
checkAttributeStringCoercion(value, attributeName);
|
|
|
}
|
|
|
|
|
|
attributeValue = '' + value;
|
|
|
}
|
|
|
|
|
|
if (propertyInfo.sanitizeURL) {
|
|
|
sanitizeURL(attributeValue.toString());
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (attributeNamespace) {
|
|
|
node.setAttributeNS(attributeNamespace, attributeName, attributeValue);
|
|
|
} else {
|
|
|
node.setAttribute(attributeName, attributeValue);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// ATTENTION
|
|
|
// When adding new symbols to this file,
|
|
|
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
|
|
// The Symbol used to tag the ReactElement-like types.
|
|
|
var REACT_ELEMENT_TYPE = Symbol.for('react.element');
|
|
|
var REACT_PORTAL_TYPE = Symbol.for('react.portal');
|
|
|
var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
|
|
|
var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
|
|
|
var REACT_PROFILER_TYPE = Symbol.for('react.profiler');
|
|
|
var REACT_PROVIDER_TYPE = Symbol.for('react.provider');
|
|
|
var REACT_CONTEXT_TYPE = Symbol.for('react.context');
|
|
|
var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
|
|
|
var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense');
|
|
|
var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list');
|
|
|
var REACT_MEMO_TYPE = Symbol.for('react.memo');
|
|
|
var REACT_LAZY_TYPE = Symbol.for('react.lazy');
|
|
|
var REACT_SCOPE_TYPE = Symbol.for('react.scope');
|
|
|
var REACT_DEBUG_TRACING_MODE_TYPE = Symbol.for('react.debug_trace_mode');
|
|
|
var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen');
|
|
|
var REACT_LEGACY_HIDDEN_TYPE = Symbol.for('react.legacy_hidden');
|
|
|
var REACT_CACHE_TYPE = Symbol.for('react.cache');
|
|
|
var REACT_TRACING_MARKER_TYPE = Symbol.for('react.tracing_marker');
|
|
|
var MAYBE_ITERATOR_SYMBOL = Symbol.iterator;
|
|
|
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
|
|
function getIteratorFn(maybeIterable) {
|
|
|
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
|
|
|
|
|
if (typeof maybeIterator === 'function') {
|
|
|
return maybeIterator;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var assign = Object.assign;
|
|
|
|
|
|
// Helpers to patch console.logs to avoid logging during side-effect free
|
|
|
// replaying on render function. This currently only patches the object
|
|
|
// lazily which won't cover if the log function was extracted eagerly.
|
|
|
// We could also eagerly patch the method.
|
|
|
var disabledDepth = 0;
|
|
|
var prevLog;
|
|
|
var prevInfo;
|
|
|
var prevWarn;
|
|
|
var prevError;
|
|
|
var prevGroup;
|
|
|
var prevGroupCollapsed;
|
|
|
var prevGroupEnd;
|
|
|
|
|
|
function disabledLog() {}
|
|
|
|
|
|
disabledLog.__reactDisabledLog = true;
|
|
|
function disableLogs() {
|
|
|
{
|
|
|
if (disabledDepth === 0) {
|
|
|
/* eslint-disable react-internal/no-production-logging */
|
|
|
prevLog = console.log;
|
|
|
prevInfo = console.info;
|
|
|
prevWarn = console.warn;
|
|
|
prevError = console.error;
|
|
|
prevGroup = console.group;
|
|
|
prevGroupCollapsed = console.groupCollapsed;
|
|
|
prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099
|
|
|
|
|
|
var props = {
|
|
|
configurable: true,
|
|
|
enumerable: true,
|
|
|
value: disabledLog,
|
|
|
writable: true
|
|
|
}; // $FlowFixMe Flow thinks console is immutable.
|
|
|
|
|
|
Object.defineProperties(console, {
|
|
|
info: props,
|
|
|
log: props,
|
|
|
warn: props,
|
|
|
error: props,
|
|
|
group: props,
|
|
|
groupCollapsed: props,
|
|
|
groupEnd: props
|
|
|
});
|
|
|
/* eslint-enable react-internal/no-production-logging */
|
|
|
}
|
|
|
|
|
|
disabledDepth++;
|
|
|
}
|
|
|
}
|
|
|
function reenableLogs() {
|
|
|
{
|
|
|
disabledDepth--;
|
|
|
|
|
|
if (disabledDepth === 0) {
|
|
|
/* eslint-disable react-internal/no-production-logging */
|
|
|
var props = {
|
|
|
configurable: true,
|
|
|
enumerable: true,
|
|
|
writable: true
|
|
|
}; // $FlowFixMe Flow thinks console is immutable.
|
|
|
|
|
|
Object.defineProperties(console, {
|
|
|
log: assign({}, props, {
|
|
|
value: prevLog
|
|
|
}),
|
|
|
info: assign({}, props, {
|
|
|
value: prevInfo
|
|
|
}),
|
|
|
warn: assign({}, props, {
|
|
|
value: prevWarn
|
|
|
}),
|
|
|
error: assign({}, props, {
|
|
|
value: prevError
|
|
|
}),
|
|
|
group: assign({}, props, {
|
|
|
value: prevGroup
|
|
|
}),
|
|
|
groupCollapsed: assign({}, props, {
|
|
|
value: prevGroupCollapsed
|
|
|
}),
|
|
|
groupEnd: assign({}, props, {
|
|
|
value: prevGroupEnd
|
|
|
})
|
|
|
});
|
|
|
/* eslint-enable react-internal/no-production-logging */
|
|
|
}
|
|
|
|
|
|
if (disabledDepth < 0) {
|
|
|
error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
|
|
|
var prefix;
|
|
|
function describeBuiltInComponentFrame(name, source, ownerFn) {
|
|
|
{
|
|
|
if (prefix === undefined) {
|
|
|
// Extract the VM specific prefix used by each line.
|
|
|
try {
|
|
|
throw Error();
|
|
|
} catch (x) {
|
|
|
var match = x.stack.trim().match(/\n( *(at )?)/);
|
|
|
prefix = match && match[1] || '';
|
|
|
}
|
|
|
} // We use the prefix to ensure our stacks line up with native stack frames.
|
|
|
|
|
|
|
|
|
return '\n' + prefix + name;
|
|
|
}
|
|
|
}
|
|
|
var reentry = false;
|
|
|
var componentFrameCache;
|
|
|
|
|
|
{
|
|
|
var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map;
|
|
|
componentFrameCache = new PossiblyWeakMap();
|
|
|
}
|
|
|
|
|
|
function describeNativeComponentFrame(fn, construct) {
|
|
|
// If something asked for a stack inside a fake render, it should get ignored.
|
|
|
if ( !fn || reentry) {
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var frame = componentFrameCache.get(fn);
|
|
|
|
|
|
if (frame !== undefined) {
|
|
|
return frame;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var control;
|
|
|
reentry = true;
|
|
|
var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined.
|
|
|
|
|
|
Error.prepareStackTrace = undefined;
|
|
|
var previousDispatcher;
|
|
|
|
|
|
{
|
|
|
previousDispatcher = ReactCurrentDispatcher.current; // Set the dispatcher in DEV because this might be call in the render function
|
|
|
// for warnings.
|
|
|
|
|
|
ReactCurrentDispatcher.current = null;
|
|
|
disableLogs();
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
// This should throw.
|
|
|
if (construct) {
|
|
|
// Something should be setting the props in the constructor.
|
|
|
var Fake = function () {
|
|
|
throw Error();
|
|
|
}; // $FlowFixMe
|
|
|
|
|
|
|
|
|
Object.defineProperty(Fake.prototype, 'props', {
|
|
|
set: function () {
|
|
|
// We use a throwing setter instead of frozen or non-writable props
|
|
|
// because that won't throw in a non-strict mode function.
|
|
|
throw Error();
|
|
|
}
|
|
|
});
|
|
|
|
|
|
if (typeof Reflect === 'object' && Reflect.construct) {
|
|
|
// We construct a different control for this case to include any extra
|
|
|
// frames added by the construct call.
|
|
|
try {
|
|
|
Reflect.construct(Fake, []);
|
|
|
} catch (x) {
|
|
|
control = x;
|
|
|
}
|
|
|
|
|
|
Reflect.construct(fn, [], Fake);
|
|
|
} else {
|
|
|
try {
|
|
|
Fake.call();
|
|
|
} catch (x) {
|
|
|
control = x;
|
|
|
}
|
|
|
|
|
|
fn.call(Fake.prototype);
|
|
|
}
|
|
|
} else {
|
|
|
try {
|
|
|
throw Error();
|
|
|
} catch (x) {
|
|
|
control = x;
|
|
|
}
|
|
|
|
|
|
fn();
|
|
|
}
|
|
|
} catch (sample) {
|
|
|
// This is inlined manually because closure doesn't do it for us.
|
|
|
if (sample && control && typeof sample.stack === 'string') {
|
|
|
// This extracts the first frame from the sample that isn't also in the control.
|
|
|
// Skipping one frame that we assume is the frame that calls the two.
|
|
|
var sampleLines = sample.stack.split('\n');
|
|
|
var controlLines = control.stack.split('\n');
|
|
|
var s = sampleLines.length - 1;
|
|
|
var c = controlLines.length - 1;
|
|
|
|
|
|
while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) {
|
|
|
// We expect at least one stack frame to be shared.
|
|
|
// Typically this will be the root most one. However, stack frames may be
|
|
|
// cut off due to maximum stack limits. In this case, one maybe cut off
|
|
|
// earlier than the other. We assume that the sample is longer or the same
|
|
|
// and there for cut off earlier. So we should find the root most frame in
|
|
|
// the sample somewhere in the control.
|
|
|
c--;
|
|
|
}
|
|
|
|
|
|
for (; s >= 1 && c >= 0; s--, c--) {
|
|
|
// Next we find the first one that isn't the same which should be the
|
|
|
// frame that called our sample function and the control.
|
|
|
if (sampleLines[s] !== controlLines[c]) {
|
|
|
// In V8, the first line is describing the message but other VMs don't.
|
|
|
// If we're about to return the first line, and the control is also on the same
|
|
|
// line, that's a pretty good indicator that our sample threw at same line as
|
|
|
// the control. I.e. before we entered the sample frame. So we ignore this result.
|
|
|
// This can happen if you passed a class to function component, or non-function.
|
|
|
if (s !== 1 || c !== 1) {
|
|
|
do {
|
|
|
s--;
|
|
|
c--; // We may still have similar intermediate frames from the construct call.
|
|
|
// The next one that isn't the same should be our match though.
|
|
|
|
|
|
if (c < 0 || sampleLines[s] !== controlLines[c]) {
|
|
|
// V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
|
|
|
var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>"
|
|
|
// but we have a user-provided "displayName"
|
|
|
// splice it in to make the stack more readable.
|
|
|
|
|
|
|
|
|
if (fn.displayName && _frame.includes('<anonymous>')) {
|
|
|
_frame = _frame.replace('<anonymous>', fn.displayName);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof fn === 'function') {
|
|
|
componentFrameCache.set(fn, _frame);
|
|
|
}
|
|
|
} // Return the line we found.
|
|
|
|
|
|
|
|
|
return _frame;
|
|
|
}
|
|
|
} while (s >= 1 && c >= 0);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} finally {
|
|
|
reentry = false;
|
|
|
|
|
|
{
|
|
|
ReactCurrentDispatcher.current = previousDispatcher;
|
|
|
reenableLogs();
|
|
|
}
|
|
|
|
|
|
Error.prepareStackTrace = previousPrepareStackTrace;
|
|
|
} // Fallback to just using the name if we couldn't make it throw.
|
|
|
|
|
|
|
|
|
var name = fn ? fn.displayName || fn.name : '';
|
|
|
var syntheticFrame = name ? describeBuiltInComponentFrame(name) : '';
|
|
|
|
|
|
{
|
|
|
if (typeof fn === 'function') {
|
|
|
componentFrameCache.set(fn, syntheticFrame);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return syntheticFrame;
|
|
|
}
|
|
|
|
|
|
function describeClassComponentFrame(ctor, source, ownerFn) {
|
|
|
{
|
|
|
return describeNativeComponentFrame(ctor, true);
|
|
|
}
|
|
|
}
|
|
|
function describeFunctionComponentFrame(fn, source, ownerFn) {
|
|
|
{
|
|
|
return describeNativeComponentFrame(fn, false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function shouldConstruct(Component) {
|
|
|
var prototype = Component.prototype;
|
|
|
return !!(prototype && prototype.isReactComponent);
|
|
|
}
|
|
|
|
|
|
function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
|
|
|
|
|
|
if (type == null) {
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'function') {
|
|
|
{
|
|
|
return describeNativeComponentFrame(type, shouldConstruct(type));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'string') {
|
|
|
return describeBuiltInComponentFrame(type);
|
|
|
}
|
|
|
|
|
|
switch (type) {
|
|
|
case REACT_SUSPENSE_TYPE:
|
|
|
return describeBuiltInComponentFrame('Suspense');
|
|
|
|
|
|
case REACT_SUSPENSE_LIST_TYPE:
|
|
|
return describeBuiltInComponentFrame('SuspenseList');
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'object') {
|
|
|
switch (type.$$typeof) {
|
|
|
case REACT_FORWARD_REF_TYPE:
|
|
|
return describeFunctionComponentFrame(type.render);
|
|
|
|
|
|
case REACT_MEMO_TYPE:
|
|
|
// Memo may contain any component type so we recursively resolve it.
|
|
|
return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
{
|
|
|
var lazyComponent = type;
|
|
|
var payload = lazyComponent._payload;
|
|
|
var init = lazyComponent._init;
|
|
|
|
|
|
try {
|
|
|
// Lazy may contain any component type so we recursively resolve it.
|
|
|
return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
|
|
|
} catch (x) {}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
function describeFiber(fiber) {
|
|
|
var owner = fiber._debugOwner ? fiber._debugOwner.type : null ;
|
|
|
var source = fiber._debugSource ;
|
|
|
|
|
|
switch (fiber.tag) {
|
|
|
case HostComponent:
|
|
|
return describeBuiltInComponentFrame(fiber.type);
|
|
|
|
|
|
case LazyComponent:
|
|
|
return describeBuiltInComponentFrame('Lazy');
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
return describeBuiltInComponentFrame('Suspense');
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
return describeBuiltInComponentFrame('SuspenseList');
|
|
|
|
|
|
case FunctionComponent:
|
|
|
case IndeterminateComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
return describeFunctionComponentFrame(fiber.type);
|
|
|
|
|
|
case ForwardRef:
|
|
|
return describeFunctionComponentFrame(fiber.type.render);
|
|
|
|
|
|
case ClassComponent:
|
|
|
return describeClassComponentFrame(fiber.type);
|
|
|
|
|
|
default:
|
|
|
return '';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getStackByFiberInDevAndProd(workInProgress) {
|
|
|
try {
|
|
|
var info = '';
|
|
|
var node = workInProgress;
|
|
|
|
|
|
do {
|
|
|
info += describeFiber(node);
|
|
|
node = node.return;
|
|
|
} while (node);
|
|
|
|
|
|
return info;
|
|
|
} catch (x) {
|
|
|
return '\nError generating stack: ' + x.message + '\n' + x.stack;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getWrappedName(outerType, innerType, wrapperName) {
|
|
|
var displayName = outerType.displayName;
|
|
|
|
|
|
if (displayName) {
|
|
|
return displayName;
|
|
|
}
|
|
|
|
|
|
var functionName = innerType.displayName || innerType.name || '';
|
|
|
return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName;
|
|
|
} // Keep in sync with react-reconciler/getComponentNameFromFiber
|
|
|
|
|
|
|
|
|
function getContextName(type) {
|
|
|
return type.displayName || 'Context';
|
|
|
} // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead.
|
|
|
|
|
|
|
|
|
function getComponentNameFromType(type) {
|
|
|
if (type == null) {
|
|
|
// Host root, text node or just invalid type.
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof type.tag === 'number') {
|
|
|
error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'function') {
|
|
|
return type.displayName || type.name || null;
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'string') {
|
|
|
return type;
|
|
|
}
|
|
|
|
|
|
switch (type) {
|
|
|
case REACT_FRAGMENT_TYPE:
|
|
|
return 'Fragment';
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
return 'Portal';
|
|
|
|
|
|
case REACT_PROFILER_TYPE:
|
|
|
return 'Profiler';
|
|
|
|
|
|
case REACT_STRICT_MODE_TYPE:
|
|
|
return 'StrictMode';
|
|
|
|
|
|
case REACT_SUSPENSE_TYPE:
|
|
|
return 'Suspense';
|
|
|
|
|
|
case REACT_SUSPENSE_LIST_TYPE:
|
|
|
return 'SuspenseList';
|
|
|
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'object') {
|
|
|
switch (type.$$typeof) {
|
|
|
case REACT_CONTEXT_TYPE:
|
|
|
var context = type;
|
|
|
return getContextName(context) + '.Consumer';
|
|
|
|
|
|
case REACT_PROVIDER_TYPE:
|
|
|
var provider = type;
|
|
|
return getContextName(provider._context) + '.Provider';
|
|
|
|
|
|
case REACT_FORWARD_REF_TYPE:
|
|
|
return getWrappedName(type, type.render, 'ForwardRef');
|
|
|
|
|
|
case REACT_MEMO_TYPE:
|
|
|
var outerName = type.displayName || null;
|
|
|
|
|
|
if (outerName !== null) {
|
|
|
return outerName;
|
|
|
}
|
|
|
|
|
|
return getComponentNameFromType(type.type) || 'Memo';
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
{
|
|
|
var lazyComponent = type;
|
|
|
var payload = lazyComponent._payload;
|
|
|
var init = lazyComponent._init;
|
|
|
|
|
|
try {
|
|
|
return getComponentNameFromType(init(payload));
|
|
|
} catch (x) {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function getWrappedName$1(outerType, innerType, wrapperName) {
|
|
|
var functionName = innerType.displayName || innerType.name || '';
|
|
|
return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName);
|
|
|
} // Keep in sync with shared/getComponentNameFromType
|
|
|
|
|
|
|
|
|
function getContextName$1(type) {
|
|
|
return type.displayName || 'Context';
|
|
|
}
|
|
|
|
|
|
function getComponentNameFromFiber(fiber) {
|
|
|
var tag = fiber.tag,
|
|
|
type = fiber.type;
|
|
|
|
|
|
switch (tag) {
|
|
|
case CacheComponent:
|
|
|
return 'Cache';
|
|
|
|
|
|
case ContextConsumer:
|
|
|
var context = type;
|
|
|
return getContextName$1(context) + '.Consumer';
|
|
|
|
|
|
case ContextProvider:
|
|
|
var provider = type;
|
|
|
return getContextName$1(provider._context) + '.Provider';
|
|
|
|
|
|
case DehydratedFragment:
|
|
|
return 'DehydratedFragment';
|
|
|
|
|
|
case ForwardRef:
|
|
|
return getWrappedName$1(type, type.render, 'ForwardRef');
|
|
|
|
|
|
case Fragment:
|
|
|
return 'Fragment';
|
|
|
|
|
|
case HostComponent:
|
|
|
// Host component type is the display name (e.g. "div", "View")
|
|
|
return type;
|
|
|
|
|
|
case HostPortal:
|
|
|
return 'Portal';
|
|
|
|
|
|
case HostRoot:
|
|
|
return 'Root';
|
|
|
|
|
|
case HostText:
|
|
|
return 'Text';
|
|
|
|
|
|
case LazyComponent:
|
|
|
// Name comes from the type in this case; we don't have a tag.
|
|
|
return getComponentNameFromType(type);
|
|
|
|
|
|
case Mode:
|
|
|
if (type === REACT_STRICT_MODE_TYPE) {
|
|
|
// Don't be less specific than shared/getComponentNameFromType
|
|
|
return 'StrictMode';
|
|
|
}
|
|
|
|
|
|
return 'Mode';
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
return 'Offscreen';
|
|
|
|
|
|
case Profiler:
|
|
|
return 'Profiler';
|
|
|
|
|
|
case ScopeComponent:
|
|
|
return 'Scope';
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
return 'Suspense';
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
return 'SuspenseList';
|
|
|
|
|
|
case TracingMarkerComponent:
|
|
|
return 'TracingMarker';
|
|
|
// The display name for this tags come from the user-provided type:
|
|
|
|
|
|
case ClassComponent:
|
|
|
case FunctionComponent:
|
|
|
case IncompleteClassComponent:
|
|
|
case IndeterminateComponent:
|
|
|
case MemoComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
if (typeof type === 'function') {
|
|
|
return type.displayName || type.name || null;
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'string') {
|
|
|
return type;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
|
var current = null;
|
|
|
var isRendering = false;
|
|
|
function getCurrentFiberOwnerNameInDevOrNull() {
|
|
|
{
|
|
|
if (current === null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var owner = current._debugOwner;
|
|
|
|
|
|
if (owner !== null && typeof owner !== 'undefined') {
|
|
|
return getComponentNameFromFiber(owner);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function getCurrentFiberStackInDev() {
|
|
|
{
|
|
|
if (current === null) {
|
|
|
return '';
|
|
|
} // Safe because if current fiber exists, we are reconciling,
|
|
|
// and it is guaranteed to be the work-in-progress version.
|
|
|
|
|
|
|
|
|
return getStackByFiberInDevAndProd(current);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function resetCurrentFiber() {
|
|
|
{
|
|
|
ReactDebugCurrentFrame.getCurrentStack = null;
|
|
|
current = null;
|
|
|
isRendering = false;
|
|
|
}
|
|
|
}
|
|
|
function setCurrentFiber(fiber) {
|
|
|
{
|
|
|
ReactDebugCurrentFrame.getCurrentStack = fiber === null ? null : getCurrentFiberStackInDev;
|
|
|
current = fiber;
|
|
|
isRendering = false;
|
|
|
}
|
|
|
}
|
|
|
function getCurrentFiber() {
|
|
|
{
|
|
|
return current;
|
|
|
}
|
|
|
}
|
|
|
function setIsRendering(rendering) {
|
|
|
{
|
|
|
isRendering = rendering;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// Flow does not allow string concatenation of most non-string types. To work
|
|
|
// around this limitation, we use an opaque type that can only be obtained by
|
|
|
// passing the value through getToStringValue first.
|
|
|
function toString(value) {
|
|
|
// The coercion safety check is performed in getToStringValue().
|
|
|
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
return '' + value;
|
|
|
}
|
|
|
function getToStringValue(value) {
|
|
|
switch (typeof value) {
|
|
|
case 'boolean':
|
|
|
case 'number':
|
|
|
case 'string':
|
|
|
case 'undefined':
|
|
|
return value;
|
|
|
|
|
|
case 'object':
|
|
|
{
|
|
|
checkFormFieldValueStringCoercion(value);
|
|
|
}
|
|
|
|
|
|
return value;
|
|
|
|
|
|
default:
|
|
|
// function, symbol are assigned as empty strings
|
|
|
return '';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var hasReadOnlyValue = {
|
|
|
button: true,
|
|
|
checkbox: true,
|
|
|
image: true,
|
|
|
hidden: true,
|
|
|
radio: true,
|
|
|
reset: true,
|
|
|
submit: true
|
|
|
};
|
|
|
function checkControlledValueProps(tagName, props) {
|
|
|
{
|
|
|
if (!(hasReadOnlyValue[props.type] || props.onChange || props.onInput || props.readOnly || props.disabled || props.value == null)) {
|
|
|
error('You provided a `value` prop to a form field without an ' + '`onChange` handler. This will render a read-only field. If ' + 'the field should be mutable use `defaultValue`. Otherwise, ' + 'set either `onChange` or `readOnly`.');
|
|
|
}
|
|
|
|
|
|
if (!(props.onChange || props.readOnly || props.disabled || props.checked == null)) {
|
|
|
error('You provided a `checked` prop to a form field without an ' + '`onChange` handler. This will render a read-only field. If ' + 'the field should be mutable use `defaultChecked`. Otherwise, ' + 'set either `onChange` or `readOnly`.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isCheckable(elem) {
|
|
|
var type = elem.type;
|
|
|
var nodeName = elem.nodeName;
|
|
|
return nodeName && nodeName.toLowerCase() === 'input' && (type === 'checkbox' || type === 'radio');
|
|
|
}
|
|
|
|
|
|
function getTracker(node) {
|
|
|
return node._valueTracker;
|
|
|
}
|
|
|
|
|
|
function detachTracker(node) {
|
|
|
node._valueTracker = null;
|
|
|
}
|
|
|
|
|
|
function getValueFromNode(node) {
|
|
|
var value = '';
|
|
|
|
|
|
if (!node) {
|
|
|
return value;
|
|
|
}
|
|
|
|
|
|
if (isCheckable(node)) {
|
|
|
value = node.checked ? 'true' : 'false';
|
|
|
} else {
|
|
|
value = node.value;
|
|
|
}
|
|
|
|
|
|
return value;
|
|
|
}
|
|
|
|
|
|
function trackValueOnNode(node) {
|
|
|
var valueField = isCheckable(node) ? 'checked' : 'value';
|
|
|
var descriptor = Object.getOwnPropertyDescriptor(node.constructor.prototype, valueField);
|
|
|
|
|
|
{
|
|
|
checkFormFieldValueStringCoercion(node[valueField]);
|
|
|
}
|
|
|
|
|
|
var currentValue = '' + node[valueField]; // if someone has already defined a value or Safari, then bail
|
|
|
// and don't track value will cause over reporting of changes,
|
|
|
// but it's better then a hard failure
|
|
|
// (needed for certain tests that spyOn input values and Safari)
|
|
|
|
|
|
if (node.hasOwnProperty(valueField) || typeof descriptor === 'undefined' || typeof descriptor.get !== 'function' || typeof descriptor.set !== 'function') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var get = descriptor.get,
|
|
|
set = descriptor.set;
|
|
|
Object.defineProperty(node, valueField, {
|
|
|
configurable: true,
|
|
|
get: function () {
|
|
|
return get.call(this);
|
|
|
},
|
|
|
set: function (value) {
|
|
|
{
|
|
|
checkFormFieldValueStringCoercion(value);
|
|
|
}
|
|
|
|
|
|
currentValue = '' + value;
|
|
|
set.call(this, value);
|
|
|
}
|
|
|
}); // We could've passed this the first time
|
|
|
// but it triggers a bug in IE11 and Edge 14/15.
|
|
|
// Calling defineProperty() again should be equivalent.
|
|
|
// https://github.com/facebook/react/issues/11768
|
|
|
|
|
|
Object.defineProperty(node, valueField, {
|
|
|
enumerable: descriptor.enumerable
|
|
|
});
|
|
|
var tracker = {
|
|
|
getValue: function () {
|
|
|
return currentValue;
|
|
|
},
|
|
|
setValue: function (value) {
|
|
|
{
|
|
|
checkFormFieldValueStringCoercion(value);
|
|
|
}
|
|
|
|
|
|
currentValue = '' + value;
|
|
|
},
|
|
|
stopTracking: function () {
|
|
|
detachTracker(node);
|
|
|
delete node[valueField];
|
|
|
}
|
|
|
};
|
|
|
return tracker;
|
|
|
}
|
|
|
|
|
|
function track(node) {
|
|
|
if (getTracker(node)) {
|
|
|
return;
|
|
|
} // TODO: Once it's just Fiber we can move this to node._wrapperState
|
|
|
|
|
|
|
|
|
node._valueTracker = trackValueOnNode(node);
|
|
|
}
|
|
|
function updateValueIfChanged(node) {
|
|
|
if (!node) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var tracker = getTracker(node); // if there is no tracker at this point it's unlikely
|
|
|
// that trying again will succeed
|
|
|
|
|
|
if (!tracker) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
var lastValue = tracker.getValue();
|
|
|
var nextValue = getValueFromNode(node);
|
|
|
|
|
|
if (nextValue !== lastValue) {
|
|
|
tracker.setValue(nextValue);
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
function getActiveElement(doc) {
|
|
|
doc = doc || (typeof document !== 'undefined' ? document : undefined);
|
|
|
|
|
|
if (typeof doc === 'undefined') {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
return doc.activeElement || doc.body;
|
|
|
} catch (e) {
|
|
|
return doc.body;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnValueDefaultValue = false;
|
|
|
var didWarnCheckedDefaultChecked = false;
|
|
|
var didWarnControlledToUncontrolled = false;
|
|
|
var didWarnUncontrolledToControlled = false;
|
|
|
|
|
|
function isControlled(props) {
|
|
|
var usesChecked = props.type === 'checkbox' || props.type === 'radio';
|
|
|
return usesChecked ? props.checked != null : props.value != null;
|
|
|
}
|
|
|
/**
|
|
|
* Implements an <input> host component that allows setting these optional
|
|
|
* props: `checked`, `value`, `defaultChecked`, and `defaultValue`.
|
|
|
*
|
|
|
* If `checked` or `value` are not supplied (or null/undefined), user actions
|
|
|
* that affect the checked state or value will trigger updates to the element.
|
|
|
*
|
|
|
* If they are supplied (and not null/undefined), the rendered element will not
|
|
|
* trigger updates to the element. Instead, the props must change in order for
|
|
|
* the rendered element to be updated.
|
|
|
*
|
|
|
* The rendered element will be initialized as unchecked (or `defaultChecked`)
|
|
|
* with an empty value (or `defaultValue`).
|
|
|
*
|
|
|
* See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getHostProps(element, props) {
|
|
|
var node = element;
|
|
|
var checked = props.checked;
|
|
|
var hostProps = assign({}, props, {
|
|
|
defaultChecked: undefined,
|
|
|
defaultValue: undefined,
|
|
|
value: undefined,
|
|
|
checked: checked != null ? checked : node._wrapperState.initialChecked
|
|
|
});
|
|
|
return hostProps;
|
|
|
}
|
|
|
function initWrapperState(element, props) {
|
|
|
{
|
|
|
checkControlledValueProps('input', props);
|
|
|
|
|
|
if (props.checked !== undefined && props.defaultChecked !== undefined && !didWarnCheckedDefaultChecked) {
|
|
|
error('%s contains an input of type %s with both checked and defaultChecked props. ' + 'Input elements must be either controlled or uncontrolled ' + '(specify either the checked prop, or the defaultChecked prop, but not ' + 'both). Decide between using a controlled or uncontrolled input ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component', props.type);
|
|
|
|
|
|
didWarnCheckedDefaultChecked = true;
|
|
|
}
|
|
|
|
|
|
if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue) {
|
|
|
error('%s contains an input of type %s with both value and defaultValue props. ' + 'Input elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled input ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component', props.type);
|
|
|
|
|
|
didWarnValueDefaultValue = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var node = element;
|
|
|
var defaultValue = props.defaultValue == null ? '' : props.defaultValue;
|
|
|
node._wrapperState = {
|
|
|
initialChecked: props.checked != null ? props.checked : props.defaultChecked,
|
|
|
initialValue: getToStringValue(props.value != null ? props.value : defaultValue),
|
|
|
controlled: isControlled(props)
|
|
|
};
|
|
|
}
|
|
|
function updateChecked(element, props) {
|
|
|
var node = element;
|
|
|
var checked = props.checked;
|
|
|
|
|
|
if (checked != null) {
|
|
|
setValueForProperty(node, 'checked', checked, false);
|
|
|
}
|
|
|
}
|
|
|
function updateWrapper(element, props) {
|
|
|
var node = element;
|
|
|
|
|
|
{
|
|
|
var controlled = isControlled(props);
|
|
|
|
|
|
if (!node._wrapperState.controlled && controlled && !didWarnUncontrolledToControlled) {
|
|
|
error('A component is changing an uncontrolled input to be controlled. ' + 'This is likely caused by the value changing from undefined to ' + 'a defined value, which should not happen. ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components');
|
|
|
|
|
|
didWarnUncontrolledToControlled = true;
|
|
|
}
|
|
|
|
|
|
if (node._wrapperState.controlled && !controlled && !didWarnControlledToUncontrolled) {
|
|
|
error('A component is changing a controlled input to be uncontrolled. ' + 'This is likely caused by the value changing from a defined to ' + 'undefined, which should not happen. ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components');
|
|
|
|
|
|
didWarnControlledToUncontrolled = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
updateChecked(element, props);
|
|
|
var value = getToStringValue(props.value);
|
|
|
var type = props.type;
|
|
|
|
|
|
if (value != null) {
|
|
|
if (type === 'number') {
|
|
|
if (value === 0 && node.value === '' || // We explicitly want to coerce to number here if possible.
|
|
|
// eslint-disable-next-line
|
|
|
node.value != value) {
|
|
|
node.value = toString(value);
|
|
|
}
|
|
|
} else if (node.value !== toString(value)) {
|
|
|
node.value = toString(value);
|
|
|
}
|
|
|
} else if (type === 'submit' || type === 'reset') {
|
|
|
// Submit/reset inputs need the attribute removed completely to avoid
|
|
|
// blank-text buttons.
|
|
|
node.removeAttribute('value');
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// When syncing the value attribute, the value comes from a cascade of
|
|
|
// properties:
|
|
|
// 1. The value React property
|
|
|
// 2. The defaultValue React property
|
|
|
// 3. Otherwise there should be no change
|
|
|
if (props.hasOwnProperty('value')) {
|
|
|
setDefaultValue(node, props.type, value);
|
|
|
} else if (props.hasOwnProperty('defaultValue')) {
|
|
|
setDefaultValue(node, props.type, getToStringValue(props.defaultValue));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// When syncing the checked attribute, it only changes when it needs
|
|
|
// to be removed, such as transitioning from a checkbox into a text input
|
|
|
if (props.checked == null && props.defaultChecked != null) {
|
|
|
node.defaultChecked = !!props.defaultChecked;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function postMountWrapper(element, props, isHydrating) {
|
|
|
var node = element; // Do not assign value if it is already set. This prevents user text input
|
|
|
// from being lost during SSR hydration.
|
|
|
|
|
|
if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) {
|
|
|
var type = props.type;
|
|
|
var isButton = type === 'submit' || type === 'reset'; // Avoid setting value attribute on submit/reset inputs as it overrides the
|
|
|
// default value provided by the browser. See: #12872
|
|
|
|
|
|
if (isButton && (props.value === undefined || props.value === null)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var initialValue = toString(node._wrapperState.initialValue); // Do not assign value if it is already set. This prevents user text input
|
|
|
// from being lost during SSR hydration.
|
|
|
|
|
|
if (!isHydrating) {
|
|
|
{
|
|
|
// When syncing the value attribute, the value property should use
|
|
|
// the wrapperState._initialValue property. This uses:
|
|
|
//
|
|
|
// 1. The value React property when present
|
|
|
// 2. The defaultValue React property when present
|
|
|
// 3. An empty string
|
|
|
if (initialValue !== node.value) {
|
|
|
node.value = initialValue;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// Otherwise, the value attribute is synchronized to the property,
|
|
|
// so we assign defaultValue to the same thing as the value property
|
|
|
// assignment step above.
|
|
|
node.defaultValue = initialValue;
|
|
|
}
|
|
|
} // Normally, we'd just do `node.checked = node.checked` upon initial mount, less this bug
|
|
|
// this is needed to work around a chrome bug where setting defaultChecked
|
|
|
// will sometimes influence the value of checked (even after detachment).
|
|
|
// Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416
|
|
|
// We need to temporarily unset name to avoid disrupting radio button groups.
|
|
|
|
|
|
|
|
|
var name = node.name;
|
|
|
|
|
|
if (name !== '') {
|
|
|
node.name = '';
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// When syncing the checked attribute, both the checked property and
|
|
|
// attribute are assigned at the same time using defaultChecked. This uses:
|
|
|
//
|
|
|
// 1. The checked React property when present
|
|
|
// 2. The defaultChecked React property when present
|
|
|
// 3. Otherwise, false
|
|
|
node.defaultChecked = !node.defaultChecked;
|
|
|
node.defaultChecked = !!node._wrapperState.initialChecked;
|
|
|
}
|
|
|
|
|
|
if (name !== '') {
|
|
|
node.name = name;
|
|
|
}
|
|
|
}
|
|
|
function restoreControlledState(element, props) {
|
|
|
var node = element;
|
|
|
updateWrapper(node, props);
|
|
|
updateNamedCousins(node, props);
|
|
|
}
|
|
|
|
|
|
function updateNamedCousins(rootNode, props) {
|
|
|
var name = props.name;
|
|
|
|
|
|
if (props.type === 'radio' && name != null) {
|
|
|
var queryRoot = rootNode;
|
|
|
|
|
|
while (queryRoot.parentNode) {
|
|
|
queryRoot = queryRoot.parentNode;
|
|
|
} // If `rootNode.form` was non-null, then we could try `form.elements`,
|
|
|
// but that sometimes behaves strangely in IE8. We could also try using
|
|
|
// `form.getElementsByName`, but that will only return direct children
|
|
|
// and won't include inputs that use the HTML5 `form=` attribute. Since
|
|
|
// the input might not even be in a form. It might not even be in the
|
|
|
// document. Let's just use the local `querySelectorAll` to ensure we don't
|
|
|
// miss anything.
|
|
|
|
|
|
|
|
|
{
|
|
|
checkAttributeStringCoercion(name, 'name');
|
|
|
}
|
|
|
|
|
|
var group = queryRoot.querySelectorAll('input[name=' + JSON.stringify('' + name) + '][type="radio"]');
|
|
|
|
|
|
for (var i = 0; i < group.length; i++) {
|
|
|
var otherNode = group[i];
|
|
|
|
|
|
if (otherNode === rootNode || otherNode.form !== rootNode.form) {
|
|
|
continue;
|
|
|
} // This will throw if radio buttons rendered by different copies of React
|
|
|
// and the same name are rendered into the same form (same as #1939).
|
|
|
// That's probably okay; we don't support it just as we don't support
|
|
|
// mixing React radio buttons with non-React ones.
|
|
|
|
|
|
|
|
|
var otherProps = getFiberCurrentPropsFromNode(otherNode);
|
|
|
|
|
|
if (!otherProps) {
|
|
|
throw new Error('ReactDOMInput: Mixing React and non-React radio inputs with the ' + 'same `name` is not supported.');
|
|
|
} // We need update the tracked value on the named cousin since the value
|
|
|
// was changed but the input saw no event or value set
|
|
|
|
|
|
|
|
|
updateValueIfChanged(otherNode); // If this is a controlled radio button group, forcing the input that
|
|
|
// was previously checked to update will cause it to be come re-checked
|
|
|
// as appropriate.
|
|
|
|
|
|
updateWrapper(otherNode, otherProps);
|
|
|
}
|
|
|
}
|
|
|
} // In Chrome, assigning defaultValue to certain input types triggers input validation.
|
|
|
// For number inputs, the display value loses trailing decimal points. For email inputs,
|
|
|
// Chrome raises "The specified value <x> is not a valid email address".
|
|
|
//
|
|
|
// Here we check to see if the defaultValue has actually changed, avoiding these problems
|
|
|
// when the user is inputting text
|
|
|
//
|
|
|
// https://github.com/facebook/react/issues/7253
|
|
|
|
|
|
|
|
|
function setDefaultValue(node, type, value) {
|
|
|
if ( // Focused number inputs synchronize on blur. See ChangeEventPlugin.js
|
|
|
type !== 'number' || getActiveElement(node.ownerDocument) !== node) {
|
|
|
if (value == null) {
|
|
|
node.defaultValue = toString(node._wrapperState.initialValue);
|
|
|
} else if (node.defaultValue !== toString(value)) {
|
|
|
node.defaultValue = toString(value);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnSelectedSetOnOption = false;
|
|
|
var didWarnInvalidChild = false;
|
|
|
var didWarnInvalidInnerHTML = false;
|
|
|
/**
|
|
|
* Implements an <option> host component that warns when `selected` is set.
|
|
|
*/
|
|
|
|
|
|
function validateProps(element, props) {
|
|
|
{
|
|
|
// If a value is not provided, then the children must be simple.
|
|
|
if (props.value == null) {
|
|
|
if (typeof props.children === 'object' && props.children !== null) {
|
|
|
React.Children.forEach(props.children, function (child) {
|
|
|
if (child == null) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (typeof child === 'string' || typeof child === 'number') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (!didWarnInvalidChild) {
|
|
|
didWarnInvalidChild = true;
|
|
|
|
|
|
error('Cannot infer the option value of complex children. ' + 'Pass a `value` prop or use a plain string as children to <option>.');
|
|
|
}
|
|
|
});
|
|
|
} else if (props.dangerouslySetInnerHTML != null) {
|
|
|
if (!didWarnInvalidInnerHTML) {
|
|
|
didWarnInvalidInnerHTML = true;
|
|
|
|
|
|
error('Pass a `value` prop if you set dangerouslyInnerHTML so React knows ' + 'which value should be selected.');
|
|
|
}
|
|
|
}
|
|
|
} // TODO: Remove support for `selected` in <option>.
|
|
|
|
|
|
|
|
|
if (props.selected != null && !didWarnSelectedSetOnOption) {
|
|
|
error('Use the `defaultValue` or `value` props on <select> instead of ' + 'setting `selected` on <option>.');
|
|
|
|
|
|
didWarnSelectedSetOnOption = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function postMountWrapper$1(element, props) {
|
|
|
// value="" should make a value attribute (#6219)
|
|
|
if (props.value != null) {
|
|
|
element.setAttribute('value', toString(getToStringValue(props.value)));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
|
|
|
|
|
|
function isArray(a) {
|
|
|
return isArrayImpl(a);
|
|
|
}
|
|
|
|
|
|
var didWarnValueDefaultValue$1;
|
|
|
|
|
|
{
|
|
|
didWarnValueDefaultValue$1 = false;
|
|
|
}
|
|
|
|
|
|
function getDeclarationErrorAddendum() {
|
|
|
var ownerName = getCurrentFiberOwnerNameInDevOrNull();
|
|
|
|
|
|
if (ownerName) {
|
|
|
return '\n\nCheck the render method of `' + ownerName + '`.';
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
var valuePropNames = ['value', 'defaultValue'];
|
|
|
/**
|
|
|
* Validation function for `value` and `defaultValue`.
|
|
|
*/
|
|
|
|
|
|
function checkSelectPropTypes(props) {
|
|
|
{
|
|
|
checkControlledValueProps('select', props);
|
|
|
|
|
|
for (var i = 0; i < valuePropNames.length; i++) {
|
|
|
var propName = valuePropNames[i];
|
|
|
|
|
|
if (props[propName] == null) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var propNameIsArray = isArray(props[propName]);
|
|
|
|
|
|
if (props.multiple && !propNameIsArray) {
|
|
|
error('The `%s` prop supplied to <select> must be an array if ' + '`multiple` is true.%s', propName, getDeclarationErrorAddendum());
|
|
|
} else if (!props.multiple && propNameIsArray) {
|
|
|
error('The `%s` prop supplied to <select> must be a scalar ' + 'value if `multiple` is false.%s', propName, getDeclarationErrorAddendum());
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateOptions(node, multiple, propValue, setDefaultSelected) {
|
|
|
var options = node.options;
|
|
|
|
|
|
if (multiple) {
|
|
|
var selectedValues = propValue;
|
|
|
var selectedValue = {};
|
|
|
|
|
|
for (var i = 0; i < selectedValues.length; i++) {
|
|
|
// Prefix to avoid chaos with special keys.
|
|
|
selectedValue['$' + selectedValues[i]] = true;
|
|
|
}
|
|
|
|
|
|
for (var _i = 0; _i < options.length; _i++) {
|
|
|
var selected = selectedValue.hasOwnProperty('$' + options[_i].value);
|
|
|
|
|
|
if (options[_i].selected !== selected) {
|
|
|
options[_i].selected = selected;
|
|
|
}
|
|
|
|
|
|
if (selected && setDefaultSelected) {
|
|
|
options[_i].defaultSelected = true;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
// Do not set `select.value` as exact behavior isn't consistent across all
|
|
|
// browsers for all cases.
|
|
|
var _selectedValue = toString(getToStringValue(propValue));
|
|
|
|
|
|
var defaultSelected = null;
|
|
|
|
|
|
for (var _i2 = 0; _i2 < options.length; _i2++) {
|
|
|
if (options[_i2].value === _selectedValue) {
|
|
|
options[_i2].selected = true;
|
|
|
|
|
|
if (setDefaultSelected) {
|
|
|
options[_i2].defaultSelected = true;
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (defaultSelected === null && !options[_i2].disabled) {
|
|
|
defaultSelected = options[_i2];
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (defaultSelected !== null) {
|
|
|
defaultSelected.selected = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Implements a <select> host component that allows optionally setting the
|
|
|
* props `value` and `defaultValue`. If `multiple` is false, the prop must be a
|
|
|
* stringable. If `multiple` is true, the prop must be an array of stringables.
|
|
|
*
|
|
|
* If `value` is not supplied (or null/undefined), user actions that change the
|
|
|
* selected option will trigger updates to the rendered options.
|
|
|
*
|
|
|
* If it is supplied (and not null/undefined), the rendered options will not
|
|
|
* update in response to user actions. Instead, the `value` prop must change in
|
|
|
* order for the rendered options to update.
|
|
|
*
|
|
|
* If `defaultValue` is provided, any options with the supplied values will be
|
|
|
* selected.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getHostProps$1(element, props) {
|
|
|
return assign({}, props, {
|
|
|
value: undefined
|
|
|
});
|
|
|
}
|
|
|
function initWrapperState$1(element, props) {
|
|
|
var node = element;
|
|
|
|
|
|
{
|
|
|
checkSelectPropTypes(props);
|
|
|
}
|
|
|
|
|
|
node._wrapperState = {
|
|
|
wasMultiple: !!props.multiple
|
|
|
};
|
|
|
|
|
|
{
|
|
|
if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue$1) {
|
|
|
error('Select elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled select ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components');
|
|
|
|
|
|
didWarnValueDefaultValue$1 = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function postMountWrapper$2(element, props) {
|
|
|
var node = element;
|
|
|
node.multiple = !!props.multiple;
|
|
|
var value = props.value;
|
|
|
|
|
|
if (value != null) {
|
|
|
updateOptions(node, !!props.multiple, value, false);
|
|
|
} else if (props.defaultValue != null) {
|
|
|
updateOptions(node, !!props.multiple, props.defaultValue, true);
|
|
|
}
|
|
|
}
|
|
|
function postUpdateWrapper(element, props) {
|
|
|
var node = element;
|
|
|
var wasMultiple = node._wrapperState.wasMultiple;
|
|
|
node._wrapperState.wasMultiple = !!props.multiple;
|
|
|
var value = props.value;
|
|
|
|
|
|
if (value != null) {
|
|
|
updateOptions(node, !!props.multiple, value, false);
|
|
|
} else if (wasMultiple !== !!props.multiple) {
|
|
|
// For simplicity, reapply `defaultValue` if `multiple` is toggled.
|
|
|
if (props.defaultValue != null) {
|
|
|
updateOptions(node, !!props.multiple, props.defaultValue, true);
|
|
|
} else {
|
|
|
// Revert the select back to its default unselected state.
|
|
|
updateOptions(node, !!props.multiple, props.multiple ? [] : '', false);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function restoreControlledState$1(element, props) {
|
|
|
var node = element;
|
|
|
var value = props.value;
|
|
|
|
|
|
if (value != null) {
|
|
|
updateOptions(node, !!props.multiple, value, false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnValDefaultVal = false;
|
|
|
|
|
|
/**
|
|
|
* Implements a <textarea> host component that allows setting `value`, and
|
|
|
* `defaultValue`. This differs from the traditional DOM API because value is
|
|
|
* usually set as PCDATA children.
|
|
|
*
|
|
|
* If `value` is not supplied (or null/undefined), user actions that affect the
|
|
|
* value will trigger updates to the element.
|
|
|
*
|
|
|
* If `value` is supplied (and not null/undefined), the rendered element will
|
|
|
* not trigger updates to the element. Instead, the `value` prop must change in
|
|
|
* order for the rendered element to be updated.
|
|
|
*
|
|
|
* The rendered element will be initialized with an empty value, the prop
|
|
|
* `defaultValue` if specified, or the children content (deprecated).
|
|
|
*/
|
|
|
function getHostProps$2(element, props) {
|
|
|
var node = element;
|
|
|
|
|
|
if (props.dangerouslySetInnerHTML != null) {
|
|
|
throw new Error('`dangerouslySetInnerHTML` does not make sense on <textarea>.');
|
|
|
} // Always set children to the same thing. In IE9, the selection range will
|
|
|
// get reset if `textContent` is mutated. We could add a check in setTextContent
|
|
|
// to only set the value if/when the value differs from the node value (which would
|
|
|
// completely solve this IE9 bug), but Sebastian+Sophie seemed to like this
|
|
|
// solution. The value can be a boolean or object so that's why it's forced
|
|
|
// to be a string.
|
|
|
|
|
|
|
|
|
var hostProps = assign({}, props, {
|
|
|
value: undefined,
|
|
|
defaultValue: undefined,
|
|
|
children: toString(node._wrapperState.initialValue)
|
|
|
});
|
|
|
|
|
|
return hostProps;
|
|
|
}
|
|
|
function initWrapperState$2(element, props) {
|
|
|
var node = element;
|
|
|
|
|
|
{
|
|
|
checkControlledValueProps('textarea', props);
|
|
|
|
|
|
if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValDefaultVal) {
|
|
|
error('%s contains a textarea with both value and defaultValue props. ' + 'Textarea elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled textarea ' + 'and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component');
|
|
|
|
|
|
didWarnValDefaultVal = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var initialValue = props.value; // Only bother fetching default value if we're going to use it
|
|
|
|
|
|
if (initialValue == null) {
|
|
|
var children = props.children,
|
|
|
defaultValue = props.defaultValue;
|
|
|
|
|
|
if (children != null) {
|
|
|
{
|
|
|
error('Use the `defaultValue` or `value` props instead of setting ' + 'children on <textarea>.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (defaultValue != null) {
|
|
|
throw new Error('If you supply `defaultValue` on a <textarea>, do not pass children.');
|
|
|
}
|
|
|
|
|
|
if (isArray(children)) {
|
|
|
if (children.length > 1) {
|
|
|
throw new Error('<textarea> can only have at most one child.');
|
|
|
}
|
|
|
|
|
|
children = children[0];
|
|
|
}
|
|
|
|
|
|
defaultValue = children;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (defaultValue == null) {
|
|
|
defaultValue = '';
|
|
|
}
|
|
|
|
|
|
initialValue = defaultValue;
|
|
|
}
|
|
|
|
|
|
node._wrapperState = {
|
|
|
initialValue: getToStringValue(initialValue)
|
|
|
};
|
|
|
}
|
|
|
function updateWrapper$1(element, props) {
|
|
|
var node = element;
|
|
|
var value = getToStringValue(props.value);
|
|
|
var defaultValue = getToStringValue(props.defaultValue);
|
|
|
|
|
|
if (value != null) {
|
|
|
// Cast `value` to a string to ensure the value is set correctly. While
|
|
|
// browsers typically do this as necessary, jsdom doesn't.
|
|
|
var newValue = toString(value); // To avoid side effects (such as losing text selection), only set value if changed
|
|
|
|
|
|
if (newValue !== node.value) {
|
|
|
node.value = newValue;
|
|
|
}
|
|
|
|
|
|
if (props.defaultValue == null && node.defaultValue !== newValue) {
|
|
|
node.defaultValue = newValue;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (defaultValue != null) {
|
|
|
node.defaultValue = toString(defaultValue);
|
|
|
}
|
|
|
}
|
|
|
function postMountWrapper$3(element, props) {
|
|
|
var node = element; // This is in postMount because we need access to the DOM node, which is not
|
|
|
// available until after the component has mounted.
|
|
|
|
|
|
var textContent = node.textContent; // Only set node.value if textContent is equal to the expected
|
|
|
// initial value. In IE10/IE11 there is a bug where the placeholder attribute
|
|
|
// will populate textContent as well.
|
|
|
// https://developer.microsoft.com/microsoft-edge/platform/issues/101525/
|
|
|
|
|
|
if (textContent === node._wrapperState.initialValue) {
|
|
|
if (textContent !== '' && textContent !== null) {
|
|
|
node.value = textContent;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function restoreControlledState$2(element, props) {
|
|
|
// DOM component is still mounted; update
|
|
|
updateWrapper$1(element, props);
|
|
|
}
|
|
|
|
|
|
var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
|
|
|
var MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML';
|
|
|
var SVG_NAMESPACE = 'http://www.w3.org/2000/svg'; // Assumes there is no parent namespace.
|
|
|
|
|
|
function getIntrinsicNamespace(type) {
|
|
|
switch (type) {
|
|
|
case 'svg':
|
|
|
return SVG_NAMESPACE;
|
|
|
|
|
|
case 'math':
|
|
|
return MATH_NAMESPACE;
|
|
|
|
|
|
default:
|
|
|
return HTML_NAMESPACE;
|
|
|
}
|
|
|
}
|
|
|
function getChildNamespace(parentNamespace, type) {
|
|
|
if (parentNamespace == null || parentNamespace === HTML_NAMESPACE) {
|
|
|
// No (or default) parent namespace: potential entry point.
|
|
|
return getIntrinsicNamespace(type);
|
|
|
}
|
|
|
|
|
|
if (parentNamespace === SVG_NAMESPACE && type === 'foreignObject') {
|
|
|
// We're leaving SVG.
|
|
|
return HTML_NAMESPACE;
|
|
|
} // By default, pass namespace below.
|
|
|
|
|
|
|
|
|
return parentNamespace;
|
|
|
}
|
|
|
|
|
|
/* globals MSApp */
|
|
|
|
|
|
/**
|
|
|
* Create a function which has 'unsafe' privileges (required by windows8 apps)
|
|
|
*/
|
|
|
var createMicrosoftUnsafeLocalFunction = function (func) {
|
|
|
if (typeof MSApp !== 'undefined' && MSApp.execUnsafeLocalFunction) {
|
|
|
return function (arg0, arg1, arg2, arg3) {
|
|
|
MSApp.execUnsafeLocalFunction(function () {
|
|
|
return func(arg0, arg1, arg2, arg3);
|
|
|
});
|
|
|
};
|
|
|
} else {
|
|
|
return func;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var reusableSVGContainer;
|
|
|
/**
|
|
|
* Set the innerHTML property of a node
|
|
|
*
|
|
|
* @param {DOMElement} node
|
|
|
* @param {string} html
|
|
|
* @internal
|
|
|
*/
|
|
|
|
|
|
var setInnerHTML = createMicrosoftUnsafeLocalFunction(function (node, html) {
|
|
|
if (node.namespaceURI === SVG_NAMESPACE) {
|
|
|
|
|
|
if (!('innerHTML' in node)) {
|
|
|
// IE does not have innerHTML for SVG nodes, so instead we inject the
|
|
|
// new markup in a temp node and then move the child nodes across into
|
|
|
// the target node
|
|
|
reusableSVGContainer = reusableSVGContainer || document.createElement('div');
|
|
|
reusableSVGContainer.innerHTML = '<svg>' + html.valueOf().toString() + '</svg>';
|
|
|
var svgNode = reusableSVGContainer.firstChild;
|
|
|
|
|
|
while (node.firstChild) {
|
|
|
node.removeChild(node.firstChild);
|
|
|
}
|
|
|
|
|
|
while (svgNode.firstChild) {
|
|
|
node.appendChild(svgNode.firstChild);
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node.innerHTML = html;
|
|
|
});
|
|
|
|
|
|
/**
|
|
|
* HTML nodeType values that represent the type of the node
|
|
|
*/
|
|
|
var ELEMENT_NODE = 1;
|
|
|
var TEXT_NODE = 3;
|
|
|
var COMMENT_NODE = 8;
|
|
|
var DOCUMENT_NODE = 9;
|
|
|
var DOCUMENT_FRAGMENT_NODE = 11;
|
|
|
|
|
|
/**
|
|
|
* Set the textContent property of a node. For text updates, it's faster
|
|
|
* to set the `nodeValue` of the Text node directly instead of using
|
|
|
* `.textContent` which will remove the existing node and create a new one.
|
|
|
*
|
|
|
* @param {DOMElement} node
|
|
|
* @param {string} text
|
|
|
* @internal
|
|
|
*/
|
|
|
|
|
|
var setTextContent = function (node, text) {
|
|
|
if (text) {
|
|
|
var firstChild = node.firstChild;
|
|
|
|
|
|
if (firstChild && firstChild === node.lastChild && firstChild.nodeType === TEXT_NODE) {
|
|
|
firstChild.nodeValue = text;
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node.textContent = text;
|
|
|
};
|
|
|
|
|
|
// List derived from Gecko source code:
|
|
|
// https://github.com/mozilla/gecko-dev/blob/4e638efc71/layout/style/test/property_database.js
|
|
|
var shorthandToLonghand = {
|
|
|
animation: ['animationDelay', 'animationDirection', 'animationDuration', 'animationFillMode', 'animationIterationCount', 'animationName', 'animationPlayState', 'animationTimingFunction'],
|
|
|
background: ['backgroundAttachment', 'backgroundClip', 'backgroundColor', 'backgroundImage', 'backgroundOrigin', 'backgroundPositionX', 'backgroundPositionY', 'backgroundRepeat', 'backgroundSize'],
|
|
|
backgroundPosition: ['backgroundPositionX', 'backgroundPositionY'],
|
|
|
border: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth', 'borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth', 'borderLeftColor', 'borderLeftStyle', 'borderLeftWidth', 'borderRightColor', 'borderRightStyle', 'borderRightWidth', 'borderTopColor', 'borderTopStyle', 'borderTopWidth'],
|
|
|
borderBlockEnd: ['borderBlockEndColor', 'borderBlockEndStyle', 'borderBlockEndWidth'],
|
|
|
borderBlockStart: ['borderBlockStartColor', 'borderBlockStartStyle', 'borderBlockStartWidth'],
|
|
|
borderBottom: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth'],
|
|
|
borderColor: ['borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor'],
|
|
|
borderImage: ['borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth'],
|
|
|
borderInlineEnd: ['borderInlineEndColor', 'borderInlineEndStyle', 'borderInlineEndWidth'],
|
|
|
borderInlineStart: ['borderInlineStartColor', 'borderInlineStartStyle', 'borderInlineStartWidth'],
|
|
|
borderLeft: ['borderLeftColor', 'borderLeftStyle', 'borderLeftWidth'],
|
|
|
borderRadius: ['borderBottomLeftRadius', 'borderBottomRightRadius', 'borderTopLeftRadius', 'borderTopRightRadius'],
|
|
|
borderRight: ['borderRightColor', 'borderRightStyle', 'borderRightWidth'],
|
|
|
borderStyle: ['borderBottomStyle', 'borderLeftStyle', 'borderRightStyle', 'borderTopStyle'],
|
|
|
borderTop: ['borderTopColor', 'borderTopStyle', 'borderTopWidth'],
|
|
|
borderWidth: ['borderBottomWidth', 'borderLeftWidth', 'borderRightWidth', 'borderTopWidth'],
|
|
|
columnRule: ['columnRuleColor', 'columnRuleStyle', 'columnRuleWidth'],
|
|
|
columns: ['columnCount', 'columnWidth'],
|
|
|
flex: ['flexBasis', 'flexGrow', 'flexShrink'],
|
|
|
flexFlow: ['flexDirection', 'flexWrap'],
|
|
|
font: ['fontFamily', 'fontFeatureSettings', 'fontKerning', 'fontLanguageOverride', 'fontSize', 'fontSizeAdjust', 'fontStretch', 'fontStyle', 'fontVariant', 'fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition', 'fontWeight', 'lineHeight'],
|
|
|
fontVariant: ['fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition'],
|
|
|
gap: ['columnGap', 'rowGap'],
|
|
|
grid: ['gridAutoColumns', 'gridAutoFlow', 'gridAutoRows', 'gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'],
|
|
|
gridArea: ['gridColumnEnd', 'gridColumnStart', 'gridRowEnd', 'gridRowStart'],
|
|
|
gridColumn: ['gridColumnEnd', 'gridColumnStart'],
|
|
|
gridColumnGap: ['columnGap'],
|
|
|
gridGap: ['columnGap', 'rowGap'],
|
|
|
gridRow: ['gridRowEnd', 'gridRowStart'],
|
|
|
gridRowGap: ['rowGap'],
|
|
|
gridTemplate: ['gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'],
|
|
|
listStyle: ['listStyleImage', 'listStylePosition', 'listStyleType'],
|
|
|
margin: ['marginBottom', 'marginLeft', 'marginRight', 'marginTop'],
|
|
|
marker: ['markerEnd', 'markerMid', 'markerStart'],
|
|
|
mask: ['maskClip', 'maskComposite', 'maskImage', 'maskMode', 'maskOrigin', 'maskPositionX', 'maskPositionY', 'maskRepeat', 'maskSize'],
|
|
|
maskPosition: ['maskPositionX', 'maskPositionY'],
|
|
|
outline: ['outlineColor', 'outlineStyle', 'outlineWidth'],
|
|
|
overflow: ['overflowX', 'overflowY'],
|
|
|
padding: ['paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop'],
|
|
|
placeContent: ['alignContent', 'justifyContent'],
|
|
|
placeItems: ['alignItems', 'justifyItems'],
|
|
|
placeSelf: ['alignSelf', 'justifySelf'],
|
|
|
textDecoration: ['textDecorationColor', 'textDecorationLine', 'textDecorationStyle'],
|
|
|
textEmphasis: ['textEmphasisColor', 'textEmphasisStyle'],
|
|
|
transition: ['transitionDelay', 'transitionDuration', 'transitionProperty', 'transitionTimingFunction'],
|
|
|
wordWrap: ['overflowWrap']
|
|
|
};
|
|
|
|
|
|
/**
|
|
|
* CSS properties which accept numbers but are not in units of "px".
|
|
|
*/
|
|
|
var isUnitlessNumber = {
|
|
|
animationIterationCount: true,
|
|
|
aspectRatio: true,
|
|
|
borderImageOutset: true,
|
|
|
borderImageSlice: true,
|
|
|
borderImageWidth: true,
|
|
|
boxFlex: true,
|
|
|
boxFlexGroup: true,
|
|
|
boxOrdinalGroup: true,
|
|
|
columnCount: true,
|
|
|
columns: true,
|
|
|
flex: true,
|
|
|
flexGrow: true,
|
|
|
flexPositive: true,
|
|
|
flexShrink: true,
|
|
|
flexNegative: true,
|
|
|
flexOrder: true,
|
|
|
gridArea: true,
|
|
|
gridRow: true,
|
|
|
gridRowEnd: true,
|
|
|
gridRowSpan: true,
|
|
|
gridRowStart: true,
|
|
|
gridColumn: true,
|
|
|
gridColumnEnd: true,
|
|
|
gridColumnSpan: true,
|
|
|
gridColumnStart: true,
|
|
|
fontWeight: true,
|
|
|
lineClamp: true,
|
|
|
lineHeight: true,
|
|
|
opacity: true,
|
|
|
order: true,
|
|
|
orphans: true,
|
|
|
tabSize: true,
|
|
|
widows: true,
|
|
|
zIndex: true,
|
|
|
zoom: true,
|
|
|
// SVG-related properties
|
|
|
fillOpacity: true,
|
|
|
floodOpacity: true,
|
|
|
stopOpacity: true,
|
|
|
strokeDasharray: true,
|
|
|
strokeDashoffset: true,
|
|
|
strokeMiterlimit: true,
|
|
|
strokeOpacity: true,
|
|
|
strokeWidth: true
|
|
|
};
|
|
|
/**
|
|
|
* @param {string} prefix vendor-specific prefix, eg: Webkit
|
|
|
* @param {string} key style name, eg: transitionDuration
|
|
|
* @return {string} style name prefixed with `prefix`, properly camelCased, eg:
|
|
|
* WebkitTransitionDuration
|
|
|
*/
|
|
|
|
|
|
function prefixKey(prefix, key) {
|
|
|
return prefix + key.charAt(0).toUpperCase() + key.substring(1);
|
|
|
}
|
|
|
/**
|
|
|
* Support style names that may come passed in prefixed by adding permutations
|
|
|
* of vendor prefixes.
|
|
|
*/
|
|
|
|
|
|
|
|
|
var prefixes = ['Webkit', 'ms', 'Moz', 'O']; // Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an
|
|
|
// infinite loop, because it iterates over the newly added props too.
|
|
|
|
|
|
Object.keys(isUnitlessNumber).forEach(function (prop) {
|
|
|
prefixes.forEach(function (prefix) {
|
|
|
isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop];
|
|
|
});
|
|
|
});
|
|
|
|
|
|
/**
|
|
|
* Convert a value into the proper css writable value. The style name `name`
|
|
|
* should be logical (no hyphens), as specified
|
|
|
* in `CSSProperty.isUnitlessNumber`.
|
|
|
*
|
|
|
* @param {string} name CSS property name such as `topMargin`.
|
|
|
* @param {*} value CSS property value such as `10px`.
|
|
|
* @return {string} Normalized style value with dimensions applied.
|
|
|
*/
|
|
|
|
|
|
function dangerousStyleValue(name, value, isCustomProperty) {
|
|
|
// Note that we've removed escapeTextForBrowser() calls here since the
|
|
|
// whole string will be escaped when the attribute is injected into
|
|
|
// the markup. If you provide unsafe user data here they can inject
|
|
|
// arbitrary CSS which may be problematic (I couldn't repro this):
|
|
|
// https://www.owasp.org/index.php/XSS_Filter_Evasion_Cheat_Sheet
|
|
|
// http://www.thespanner.co.uk/2007/11/26/ultimate-xss-css-injection/
|
|
|
// This is not an XSS hole but instead a potential CSS injection issue
|
|
|
// which has lead to a greater discussion about how we're going to
|
|
|
// trust URLs moving forward. See #2115901
|
|
|
var isEmpty = value == null || typeof value === 'boolean' || value === '';
|
|
|
|
|
|
if (isEmpty) {
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
if (!isCustomProperty && typeof value === 'number' && value !== 0 && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name])) {
|
|
|
return value + 'px'; // Presumes implicit 'px' suffix for unitless numbers
|
|
|
}
|
|
|
|
|
|
{
|
|
|
checkCSSPropertyStringCoercion(value, name);
|
|
|
}
|
|
|
|
|
|
return ('' + value).trim();
|
|
|
}
|
|
|
|
|
|
var uppercasePattern = /([A-Z])/g;
|
|
|
var msPattern = /^ms-/;
|
|
|
/**
|
|
|
* Hyphenates a camelcased CSS property name, for example:
|
|
|
*
|
|
|
* > hyphenateStyleName('backgroundColor')
|
|
|
* < "background-color"
|
|
|
* > hyphenateStyleName('MozTransition')
|
|
|
* < "-moz-transition"
|
|
|
* > hyphenateStyleName('msTransition')
|
|
|
* < "-ms-transition"
|
|
|
*
|
|
|
* As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix
|
|
|
* is converted to `-ms-`.
|
|
|
*/
|
|
|
|
|
|
function hyphenateStyleName(name) {
|
|
|
return name.replace(uppercasePattern, '-$1').toLowerCase().replace(msPattern, '-ms-');
|
|
|
}
|
|
|
|
|
|
var warnValidStyle = function () {};
|
|
|
|
|
|
{
|
|
|
// 'msTransform' is correct, but the other prefixes should be capitalized
|
|
|
var badVendoredStyleNamePattern = /^(?:webkit|moz|o)[A-Z]/;
|
|
|
var msPattern$1 = /^-ms-/;
|
|
|
var hyphenPattern = /-(.)/g; // style values shouldn't contain a semicolon
|
|
|
|
|
|
var badStyleValueWithSemicolonPattern = /;\s*$/;
|
|
|
var warnedStyleNames = {};
|
|
|
var warnedStyleValues = {};
|
|
|
var warnedForNaNValue = false;
|
|
|
var warnedForInfinityValue = false;
|
|
|
|
|
|
var camelize = function (string) {
|
|
|
return string.replace(hyphenPattern, function (_, character) {
|
|
|
return character.toUpperCase();
|
|
|
});
|
|
|
};
|
|
|
|
|
|
var warnHyphenatedStyleName = function (name) {
|
|
|
if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnedStyleNames[name] = true;
|
|
|
|
|
|
error('Unsupported style property %s. Did you mean %s?', name, // As Andi Smith suggests
|
|
|
// (http://www.andismith.com/blog/2012/02/modernizr-prefixed/), an `-ms` prefix
|
|
|
// is converted to lowercase `ms`.
|
|
|
camelize(name.replace(msPattern$1, 'ms-')));
|
|
|
};
|
|
|
|
|
|
var warnBadVendoredStyleName = function (name) {
|
|
|
if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnedStyleNames[name] = true;
|
|
|
|
|
|
error('Unsupported vendor-prefixed style property %s. Did you mean %s?', name, name.charAt(0).toUpperCase() + name.slice(1));
|
|
|
};
|
|
|
|
|
|
var warnStyleValueWithSemicolon = function (name, value) {
|
|
|
if (warnedStyleValues.hasOwnProperty(value) && warnedStyleValues[value]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnedStyleValues[value] = true;
|
|
|
|
|
|
error("Style property values shouldn't contain a semicolon. " + 'Try "%s: %s" instead.', name, value.replace(badStyleValueWithSemicolonPattern, ''));
|
|
|
};
|
|
|
|
|
|
var warnStyleValueIsNaN = function (name, value) {
|
|
|
if (warnedForNaNValue) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnedForNaNValue = true;
|
|
|
|
|
|
error('`NaN` is an invalid value for the `%s` css style property.', name);
|
|
|
};
|
|
|
|
|
|
var warnStyleValueIsInfinity = function (name, value) {
|
|
|
if (warnedForInfinityValue) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnedForInfinityValue = true;
|
|
|
|
|
|
error('`Infinity` is an invalid value for the `%s` css style property.', name);
|
|
|
};
|
|
|
|
|
|
warnValidStyle = function (name, value) {
|
|
|
if (name.indexOf('-') > -1) {
|
|
|
warnHyphenatedStyleName(name);
|
|
|
} else if (badVendoredStyleNamePattern.test(name)) {
|
|
|
warnBadVendoredStyleName(name);
|
|
|
} else if (badStyleValueWithSemicolonPattern.test(value)) {
|
|
|
warnStyleValueWithSemicolon(name, value);
|
|
|
}
|
|
|
|
|
|
if (typeof value === 'number') {
|
|
|
if (isNaN(value)) {
|
|
|
warnStyleValueIsNaN(name, value);
|
|
|
} else if (!isFinite(value)) {
|
|
|
warnStyleValueIsInfinity(name, value);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var warnValidStyle$1 = warnValidStyle;
|
|
|
|
|
|
/**
|
|
|
* Operations for dealing with CSS properties.
|
|
|
*/
|
|
|
|
|
|
/**
|
|
|
* This creates a string that is expected to be equivalent to the style
|
|
|
* attribute generated by server-side rendering. It by-passes warnings and
|
|
|
* security checks so it's not safe to use this value for anything other than
|
|
|
* comparison. It is only used in DEV for SSR validation.
|
|
|
*/
|
|
|
|
|
|
function createDangerousStringForStyles(styles) {
|
|
|
{
|
|
|
var serialized = '';
|
|
|
var delimiter = '';
|
|
|
|
|
|
for (var styleName in styles) {
|
|
|
if (!styles.hasOwnProperty(styleName)) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var styleValue = styles[styleName];
|
|
|
|
|
|
if (styleValue != null) {
|
|
|
var isCustomProperty = styleName.indexOf('--') === 0;
|
|
|
serialized += delimiter + (isCustomProperty ? styleName : hyphenateStyleName(styleName)) + ':';
|
|
|
serialized += dangerousStyleValue(styleName, styleValue, isCustomProperty);
|
|
|
delimiter = ';';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return serialized || null;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Sets the value for multiple styles on a node. If a value is specified as
|
|
|
* '' (empty string), the corresponding style property will be unset.
|
|
|
*
|
|
|
* @param {DOMElement} node
|
|
|
* @param {object} styles
|
|
|
*/
|
|
|
|
|
|
function setValueForStyles(node, styles) {
|
|
|
var style = node.style;
|
|
|
|
|
|
for (var styleName in styles) {
|
|
|
if (!styles.hasOwnProperty(styleName)) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var isCustomProperty = styleName.indexOf('--') === 0;
|
|
|
|
|
|
{
|
|
|
if (!isCustomProperty) {
|
|
|
warnValidStyle$1(styleName, styles[styleName]);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var styleValue = dangerousStyleValue(styleName, styles[styleName], isCustomProperty);
|
|
|
|
|
|
if (styleName === 'float') {
|
|
|
styleName = 'cssFloat';
|
|
|
}
|
|
|
|
|
|
if (isCustomProperty) {
|
|
|
style.setProperty(styleName, styleValue);
|
|
|
} else {
|
|
|
style[styleName] = styleValue;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isValueEmpty(value) {
|
|
|
return value == null || typeof value === 'boolean' || value === '';
|
|
|
}
|
|
|
/**
|
|
|
* Given {color: 'red', overflow: 'hidden'} returns {
|
|
|
* color: 'color',
|
|
|
* overflowX: 'overflow',
|
|
|
* overflowY: 'overflow',
|
|
|
* }. This can be read as "the overflowY property was set by the overflow
|
|
|
* shorthand". That is, the values are the property that each was derived from.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function expandShorthandMap(styles) {
|
|
|
var expanded = {};
|
|
|
|
|
|
for (var key in styles) {
|
|
|
var longhands = shorthandToLonghand[key] || [key];
|
|
|
|
|
|
for (var i = 0; i < longhands.length; i++) {
|
|
|
expanded[longhands[i]] = key;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return expanded;
|
|
|
}
|
|
|
/**
|
|
|
* When mixing shorthand and longhand property names, we warn during updates if
|
|
|
* we expect an incorrect result to occur. In particular, we warn for:
|
|
|
*
|
|
|
* Updating a shorthand property (longhand gets overwritten):
|
|
|
* {font: 'foo', fontVariant: 'bar'} -> {font: 'baz', fontVariant: 'bar'}
|
|
|
* becomes .style.font = 'baz'
|
|
|
* Removing a shorthand property (longhand gets lost too):
|
|
|
* {font: 'foo', fontVariant: 'bar'} -> {fontVariant: 'bar'}
|
|
|
* becomes .style.font = ''
|
|
|
* Removing a longhand property (should revert to shorthand; doesn't):
|
|
|
* {font: 'foo', fontVariant: 'bar'} -> {font: 'foo'}
|
|
|
* becomes .style.fontVariant = ''
|
|
|
*/
|
|
|
|
|
|
|
|
|
function validateShorthandPropertyCollisionInDev(styleUpdates, nextStyles) {
|
|
|
{
|
|
|
if (!nextStyles) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var expandedUpdates = expandShorthandMap(styleUpdates);
|
|
|
var expandedStyles = expandShorthandMap(nextStyles);
|
|
|
var warnedAbout = {};
|
|
|
|
|
|
for (var key in expandedUpdates) {
|
|
|
var originalKey = expandedUpdates[key];
|
|
|
var correctOriginalKey = expandedStyles[key];
|
|
|
|
|
|
if (correctOriginalKey && originalKey !== correctOriginalKey) {
|
|
|
var warningKey = originalKey + ',' + correctOriginalKey;
|
|
|
|
|
|
if (warnedAbout[warningKey]) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
warnedAbout[warningKey] = true;
|
|
|
|
|
|
error('%s a style property during rerender (%s) when a ' + 'conflicting property is set (%s) can lead to styling bugs. To ' + "avoid this, don't mix shorthand and non-shorthand properties " + 'for the same value; instead, replace the shorthand with ' + 'separate values.', isValueEmpty(styleUpdates[originalKey]) ? 'Removing' : 'Updating', originalKey, correctOriginalKey);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// For HTML, certain tags should omit their close tag. We keep a list for
|
|
|
// those special-case tags.
|
|
|
var omittedCloseTags = {
|
|
|
area: true,
|
|
|
base: true,
|
|
|
br: true,
|
|
|
col: true,
|
|
|
embed: true,
|
|
|
hr: true,
|
|
|
img: true,
|
|
|
input: true,
|
|
|
keygen: true,
|
|
|
link: true,
|
|
|
meta: true,
|
|
|
param: true,
|
|
|
source: true,
|
|
|
track: true,
|
|
|
wbr: true // NOTE: menuitem's close tag should be omitted, but that causes problems.
|
|
|
|
|
|
};
|
|
|
|
|
|
// `omittedCloseTags` except that `menuitem` should still have its closing tag.
|
|
|
|
|
|
var voidElementTags = assign({
|
|
|
menuitem: true
|
|
|
}, omittedCloseTags);
|
|
|
|
|
|
var HTML = '__html';
|
|
|
|
|
|
function assertValidProps(tag, props) {
|
|
|
if (!props) {
|
|
|
return;
|
|
|
} // Note the use of `==` which checks for null or undefined.
|
|
|
|
|
|
|
|
|
if (voidElementTags[tag]) {
|
|
|
if (props.children != null || props.dangerouslySetInnerHTML != null) {
|
|
|
throw new Error(tag + " is a void element tag and must neither have `children` nor " + 'use `dangerouslySetInnerHTML`.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (props.dangerouslySetInnerHTML != null) {
|
|
|
if (props.children != null) {
|
|
|
throw new Error('Can only set one of `children` or `props.dangerouslySetInnerHTML`.');
|
|
|
}
|
|
|
|
|
|
if (typeof props.dangerouslySetInnerHTML !== 'object' || !(HTML in props.dangerouslySetInnerHTML)) {
|
|
|
throw new Error('`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. ' + 'Please visit https://reactjs.org/link/dangerously-set-inner-html ' + 'for more information.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (!props.suppressContentEditableWarning && props.contentEditable && props.children != null) {
|
|
|
error('A component is `contentEditable` and contains `children` managed by ' + 'React. It is now your responsibility to guarantee that none of ' + 'those nodes are unexpectedly modified or duplicated. This is ' + 'probably not intentional.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (props.style != null && typeof props.style !== 'object') {
|
|
|
throw new Error('The `style` prop expects a mapping from style properties to values, ' + "not a string. For example, style={{marginRight: spacing + 'em'}} when " + 'using JSX.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isCustomComponent(tagName, props) {
|
|
|
if (tagName.indexOf('-') === -1) {
|
|
|
return typeof props.is === 'string';
|
|
|
}
|
|
|
|
|
|
switch (tagName) {
|
|
|
// These are reserved SVG and MathML elements.
|
|
|
// We don't mind this list too much because we expect it to never grow.
|
|
|
// The alternative is to track the namespace in a few places which is convoluted.
|
|
|
// https://w3c.github.io/webcomponents/spec/custom/#custom-elements-core-concepts
|
|
|
case 'annotation-xml':
|
|
|
case 'color-profile':
|
|
|
case 'font-face':
|
|
|
case 'font-face-src':
|
|
|
case 'font-face-uri':
|
|
|
case 'font-face-format':
|
|
|
case 'font-face-name':
|
|
|
case 'missing-glyph':
|
|
|
return false;
|
|
|
|
|
|
default:
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// When adding attributes to the HTML or SVG allowed attribute list, be sure to
|
|
|
// also add them to this module to ensure casing and incorrect name
|
|
|
// warnings.
|
|
|
var possibleStandardNames = {
|
|
|
// HTML
|
|
|
accept: 'accept',
|
|
|
acceptcharset: 'acceptCharset',
|
|
|
'accept-charset': 'acceptCharset',
|
|
|
accesskey: 'accessKey',
|
|
|
action: 'action',
|
|
|
allowfullscreen: 'allowFullScreen',
|
|
|
alt: 'alt',
|
|
|
as: 'as',
|
|
|
async: 'async',
|
|
|
autocapitalize: 'autoCapitalize',
|
|
|
autocomplete: 'autoComplete',
|
|
|
autocorrect: 'autoCorrect',
|
|
|
autofocus: 'autoFocus',
|
|
|
autoplay: 'autoPlay',
|
|
|
autosave: 'autoSave',
|
|
|
capture: 'capture',
|
|
|
cellpadding: 'cellPadding',
|
|
|
cellspacing: 'cellSpacing',
|
|
|
challenge: 'challenge',
|
|
|
charset: 'charSet',
|
|
|
checked: 'checked',
|
|
|
children: 'children',
|
|
|
cite: 'cite',
|
|
|
class: 'className',
|
|
|
classid: 'classID',
|
|
|
classname: 'className',
|
|
|
cols: 'cols',
|
|
|
colspan: 'colSpan',
|
|
|
content: 'content',
|
|
|
contenteditable: 'contentEditable',
|
|
|
contextmenu: 'contextMenu',
|
|
|
controls: 'controls',
|
|
|
controlslist: 'controlsList',
|
|
|
coords: 'coords',
|
|
|
crossorigin: 'crossOrigin',
|
|
|
dangerouslysetinnerhtml: 'dangerouslySetInnerHTML',
|
|
|
data: 'data',
|
|
|
datetime: 'dateTime',
|
|
|
default: 'default',
|
|
|
defaultchecked: 'defaultChecked',
|
|
|
defaultvalue: 'defaultValue',
|
|
|
defer: 'defer',
|
|
|
dir: 'dir',
|
|
|
disabled: 'disabled',
|
|
|
disablepictureinpicture: 'disablePictureInPicture',
|
|
|
disableremoteplayback: 'disableRemotePlayback',
|
|
|
download: 'download',
|
|
|
draggable: 'draggable',
|
|
|
enctype: 'encType',
|
|
|
enterkeyhint: 'enterKeyHint',
|
|
|
for: 'htmlFor',
|
|
|
form: 'form',
|
|
|
formmethod: 'formMethod',
|
|
|
formaction: 'formAction',
|
|
|
formenctype: 'formEncType',
|
|
|
formnovalidate: 'formNoValidate',
|
|
|
formtarget: 'formTarget',
|
|
|
frameborder: 'frameBorder',
|
|
|
headers: 'headers',
|
|
|
height: 'height',
|
|
|
hidden: 'hidden',
|
|
|
high: 'high',
|
|
|
href: 'href',
|
|
|
hreflang: 'hrefLang',
|
|
|
htmlfor: 'htmlFor',
|
|
|
httpequiv: 'httpEquiv',
|
|
|
'http-equiv': 'httpEquiv',
|
|
|
icon: 'icon',
|
|
|
id: 'id',
|
|
|
imagesizes: 'imageSizes',
|
|
|
imagesrcset: 'imageSrcSet',
|
|
|
innerhtml: 'innerHTML',
|
|
|
inputmode: 'inputMode',
|
|
|
integrity: 'integrity',
|
|
|
is: 'is',
|
|
|
itemid: 'itemID',
|
|
|
itemprop: 'itemProp',
|
|
|
itemref: 'itemRef',
|
|
|
itemscope: 'itemScope',
|
|
|
itemtype: 'itemType',
|
|
|
keyparams: 'keyParams',
|
|
|
keytype: 'keyType',
|
|
|
kind: 'kind',
|
|
|
label: 'label',
|
|
|
lang: 'lang',
|
|
|
list: 'list',
|
|
|
loop: 'loop',
|
|
|
low: 'low',
|
|
|
manifest: 'manifest',
|
|
|
marginwidth: 'marginWidth',
|
|
|
marginheight: 'marginHeight',
|
|
|
max: 'max',
|
|
|
maxlength: 'maxLength',
|
|
|
media: 'media',
|
|
|
mediagroup: 'mediaGroup',
|
|
|
method: 'method',
|
|
|
min: 'min',
|
|
|
minlength: 'minLength',
|
|
|
multiple: 'multiple',
|
|
|
muted: 'muted',
|
|
|
name: 'name',
|
|
|
nomodule: 'noModule',
|
|
|
nonce: 'nonce',
|
|
|
novalidate: 'noValidate',
|
|
|
open: 'open',
|
|
|
optimum: 'optimum',
|
|
|
pattern: 'pattern',
|
|
|
placeholder: 'placeholder',
|
|
|
playsinline: 'playsInline',
|
|
|
poster: 'poster',
|
|
|
preload: 'preload',
|
|
|
profile: 'profile',
|
|
|
radiogroup: 'radioGroup',
|
|
|
readonly: 'readOnly',
|
|
|
referrerpolicy: 'referrerPolicy',
|
|
|
rel: 'rel',
|
|
|
required: 'required',
|
|
|
reversed: 'reversed',
|
|
|
role: 'role',
|
|
|
rows: 'rows',
|
|
|
rowspan: 'rowSpan',
|
|
|
sandbox: 'sandbox',
|
|
|
scope: 'scope',
|
|
|
scoped: 'scoped',
|
|
|
scrolling: 'scrolling',
|
|
|
seamless: 'seamless',
|
|
|
selected: 'selected',
|
|
|
shape: 'shape',
|
|
|
size: 'size',
|
|
|
sizes: 'sizes',
|
|
|
span: 'span',
|
|
|
spellcheck: 'spellCheck',
|
|
|
src: 'src',
|
|
|
srcdoc: 'srcDoc',
|
|
|
srclang: 'srcLang',
|
|
|
srcset: 'srcSet',
|
|
|
start: 'start',
|
|
|
step: 'step',
|
|
|
style: 'style',
|
|
|
summary: 'summary',
|
|
|
tabindex: 'tabIndex',
|
|
|
target: 'target',
|
|
|
title: 'title',
|
|
|
type: 'type',
|
|
|
usemap: 'useMap',
|
|
|
value: 'value',
|
|
|
width: 'width',
|
|
|
wmode: 'wmode',
|
|
|
wrap: 'wrap',
|
|
|
// SVG
|
|
|
about: 'about',
|
|
|
accentheight: 'accentHeight',
|
|
|
'accent-height': 'accentHeight',
|
|
|
accumulate: 'accumulate',
|
|
|
additive: 'additive',
|
|
|
alignmentbaseline: 'alignmentBaseline',
|
|
|
'alignment-baseline': 'alignmentBaseline',
|
|
|
allowreorder: 'allowReorder',
|
|
|
alphabetic: 'alphabetic',
|
|
|
amplitude: 'amplitude',
|
|
|
arabicform: 'arabicForm',
|
|
|
'arabic-form': 'arabicForm',
|
|
|
ascent: 'ascent',
|
|
|
attributename: 'attributeName',
|
|
|
attributetype: 'attributeType',
|
|
|
autoreverse: 'autoReverse',
|
|
|
azimuth: 'azimuth',
|
|
|
basefrequency: 'baseFrequency',
|
|
|
baselineshift: 'baselineShift',
|
|
|
'baseline-shift': 'baselineShift',
|
|
|
baseprofile: 'baseProfile',
|
|
|
bbox: 'bbox',
|
|
|
begin: 'begin',
|
|
|
bias: 'bias',
|
|
|
by: 'by',
|
|
|
calcmode: 'calcMode',
|
|
|
capheight: 'capHeight',
|
|
|
'cap-height': 'capHeight',
|
|
|
clip: 'clip',
|
|
|
clippath: 'clipPath',
|
|
|
'clip-path': 'clipPath',
|
|
|
clippathunits: 'clipPathUnits',
|
|
|
cliprule: 'clipRule',
|
|
|
'clip-rule': 'clipRule',
|
|
|
color: 'color',
|
|
|
colorinterpolation: 'colorInterpolation',
|
|
|
'color-interpolation': 'colorInterpolation',
|
|
|
colorinterpolationfilters: 'colorInterpolationFilters',
|
|
|
'color-interpolation-filters': 'colorInterpolationFilters',
|
|
|
colorprofile: 'colorProfile',
|
|
|
'color-profile': 'colorProfile',
|
|
|
colorrendering: 'colorRendering',
|
|
|
'color-rendering': 'colorRendering',
|
|
|
contentscripttype: 'contentScriptType',
|
|
|
contentstyletype: 'contentStyleType',
|
|
|
cursor: 'cursor',
|
|
|
cx: 'cx',
|
|
|
cy: 'cy',
|
|
|
d: 'd',
|
|
|
datatype: 'datatype',
|
|
|
decelerate: 'decelerate',
|
|
|
descent: 'descent',
|
|
|
diffuseconstant: 'diffuseConstant',
|
|
|
direction: 'direction',
|
|
|
display: 'display',
|
|
|
divisor: 'divisor',
|
|
|
dominantbaseline: 'dominantBaseline',
|
|
|
'dominant-baseline': 'dominantBaseline',
|
|
|
dur: 'dur',
|
|
|
dx: 'dx',
|
|
|
dy: 'dy',
|
|
|
edgemode: 'edgeMode',
|
|
|
elevation: 'elevation',
|
|
|
enablebackground: 'enableBackground',
|
|
|
'enable-background': 'enableBackground',
|
|
|
end: 'end',
|
|
|
exponent: 'exponent',
|
|
|
externalresourcesrequired: 'externalResourcesRequired',
|
|
|
fill: 'fill',
|
|
|
fillopacity: 'fillOpacity',
|
|
|
'fill-opacity': 'fillOpacity',
|
|
|
fillrule: 'fillRule',
|
|
|
'fill-rule': 'fillRule',
|
|
|
filter: 'filter',
|
|
|
filterres: 'filterRes',
|
|
|
filterunits: 'filterUnits',
|
|
|
floodopacity: 'floodOpacity',
|
|
|
'flood-opacity': 'floodOpacity',
|
|
|
floodcolor: 'floodColor',
|
|
|
'flood-color': 'floodColor',
|
|
|
focusable: 'focusable',
|
|
|
fontfamily: 'fontFamily',
|
|
|
'font-family': 'fontFamily',
|
|
|
fontsize: 'fontSize',
|
|
|
'font-size': 'fontSize',
|
|
|
fontsizeadjust: 'fontSizeAdjust',
|
|
|
'font-size-adjust': 'fontSizeAdjust',
|
|
|
fontstretch: 'fontStretch',
|
|
|
'font-stretch': 'fontStretch',
|
|
|
fontstyle: 'fontStyle',
|
|
|
'font-style': 'fontStyle',
|
|
|
fontvariant: 'fontVariant',
|
|
|
'font-variant': 'fontVariant',
|
|
|
fontweight: 'fontWeight',
|
|
|
'font-weight': 'fontWeight',
|
|
|
format: 'format',
|
|
|
from: 'from',
|
|
|
fx: 'fx',
|
|
|
fy: 'fy',
|
|
|
g1: 'g1',
|
|
|
g2: 'g2',
|
|
|
glyphname: 'glyphName',
|
|
|
'glyph-name': 'glyphName',
|
|
|
glyphorientationhorizontal: 'glyphOrientationHorizontal',
|
|
|
'glyph-orientation-horizontal': 'glyphOrientationHorizontal',
|
|
|
glyphorientationvertical: 'glyphOrientationVertical',
|
|
|
'glyph-orientation-vertical': 'glyphOrientationVertical',
|
|
|
glyphref: 'glyphRef',
|
|
|
gradienttransform: 'gradientTransform',
|
|
|
gradientunits: 'gradientUnits',
|
|
|
hanging: 'hanging',
|
|
|
horizadvx: 'horizAdvX',
|
|
|
'horiz-adv-x': 'horizAdvX',
|
|
|
horizoriginx: 'horizOriginX',
|
|
|
'horiz-origin-x': 'horizOriginX',
|
|
|
ideographic: 'ideographic',
|
|
|
imagerendering: 'imageRendering',
|
|
|
'image-rendering': 'imageRendering',
|
|
|
in2: 'in2',
|
|
|
in: 'in',
|
|
|
inlist: 'inlist',
|
|
|
intercept: 'intercept',
|
|
|
k1: 'k1',
|
|
|
k2: 'k2',
|
|
|
k3: 'k3',
|
|
|
k4: 'k4',
|
|
|
k: 'k',
|
|
|
kernelmatrix: 'kernelMatrix',
|
|
|
kernelunitlength: 'kernelUnitLength',
|
|
|
kerning: 'kerning',
|
|
|
keypoints: 'keyPoints',
|
|
|
keysplines: 'keySplines',
|
|
|
keytimes: 'keyTimes',
|
|
|
lengthadjust: 'lengthAdjust',
|
|
|
letterspacing: 'letterSpacing',
|
|
|
'letter-spacing': 'letterSpacing',
|
|
|
lightingcolor: 'lightingColor',
|
|
|
'lighting-color': 'lightingColor',
|
|
|
limitingconeangle: 'limitingConeAngle',
|
|
|
local: 'local',
|
|
|
markerend: 'markerEnd',
|
|
|
'marker-end': 'markerEnd',
|
|
|
markerheight: 'markerHeight',
|
|
|
markermid: 'markerMid',
|
|
|
'marker-mid': 'markerMid',
|
|
|
markerstart: 'markerStart',
|
|
|
'marker-start': 'markerStart',
|
|
|
markerunits: 'markerUnits',
|
|
|
markerwidth: 'markerWidth',
|
|
|
mask: 'mask',
|
|
|
maskcontentunits: 'maskContentUnits',
|
|
|
maskunits: 'maskUnits',
|
|
|
mathematical: 'mathematical',
|
|
|
mode: 'mode',
|
|
|
numoctaves: 'numOctaves',
|
|
|
offset: 'offset',
|
|
|
opacity: 'opacity',
|
|
|
operator: 'operator',
|
|
|
order: 'order',
|
|
|
orient: 'orient',
|
|
|
orientation: 'orientation',
|
|
|
origin: 'origin',
|
|
|
overflow: 'overflow',
|
|
|
overlineposition: 'overlinePosition',
|
|
|
'overline-position': 'overlinePosition',
|
|
|
overlinethickness: 'overlineThickness',
|
|
|
'overline-thickness': 'overlineThickness',
|
|
|
paintorder: 'paintOrder',
|
|
|
'paint-order': 'paintOrder',
|
|
|
panose1: 'panose1',
|
|
|
'panose-1': 'panose1',
|
|
|
pathlength: 'pathLength',
|
|
|
patterncontentunits: 'patternContentUnits',
|
|
|
patterntransform: 'patternTransform',
|
|
|
patternunits: 'patternUnits',
|
|
|
pointerevents: 'pointerEvents',
|
|
|
'pointer-events': 'pointerEvents',
|
|
|
points: 'points',
|
|
|
pointsatx: 'pointsAtX',
|
|
|
pointsaty: 'pointsAtY',
|
|
|
pointsatz: 'pointsAtZ',
|
|
|
prefix: 'prefix',
|
|
|
preservealpha: 'preserveAlpha',
|
|
|
preserveaspectratio: 'preserveAspectRatio',
|
|
|
primitiveunits: 'primitiveUnits',
|
|
|
property: 'property',
|
|
|
r: 'r',
|
|
|
radius: 'radius',
|
|
|
refx: 'refX',
|
|
|
refy: 'refY',
|
|
|
renderingintent: 'renderingIntent',
|
|
|
'rendering-intent': 'renderingIntent',
|
|
|
repeatcount: 'repeatCount',
|
|
|
repeatdur: 'repeatDur',
|
|
|
requiredextensions: 'requiredExtensions',
|
|
|
requiredfeatures: 'requiredFeatures',
|
|
|
resource: 'resource',
|
|
|
restart: 'restart',
|
|
|
result: 'result',
|
|
|
results: 'results',
|
|
|
rotate: 'rotate',
|
|
|
rx: 'rx',
|
|
|
ry: 'ry',
|
|
|
scale: 'scale',
|
|
|
security: 'security',
|
|
|
seed: 'seed',
|
|
|
shaperendering: 'shapeRendering',
|
|
|
'shape-rendering': 'shapeRendering',
|
|
|
slope: 'slope',
|
|
|
spacing: 'spacing',
|
|
|
specularconstant: 'specularConstant',
|
|
|
specularexponent: 'specularExponent',
|
|
|
speed: 'speed',
|
|
|
spreadmethod: 'spreadMethod',
|
|
|
startoffset: 'startOffset',
|
|
|
stddeviation: 'stdDeviation',
|
|
|
stemh: 'stemh',
|
|
|
stemv: 'stemv',
|
|
|
stitchtiles: 'stitchTiles',
|
|
|
stopcolor: 'stopColor',
|
|
|
'stop-color': 'stopColor',
|
|
|
stopopacity: 'stopOpacity',
|
|
|
'stop-opacity': 'stopOpacity',
|
|
|
strikethroughposition: 'strikethroughPosition',
|
|
|
'strikethrough-position': 'strikethroughPosition',
|
|
|
strikethroughthickness: 'strikethroughThickness',
|
|
|
'strikethrough-thickness': 'strikethroughThickness',
|
|
|
string: 'string',
|
|
|
stroke: 'stroke',
|
|
|
strokedasharray: 'strokeDasharray',
|
|
|
'stroke-dasharray': 'strokeDasharray',
|
|
|
strokedashoffset: 'strokeDashoffset',
|
|
|
'stroke-dashoffset': 'strokeDashoffset',
|
|
|
strokelinecap: 'strokeLinecap',
|
|
|
'stroke-linecap': 'strokeLinecap',
|
|
|
strokelinejoin: 'strokeLinejoin',
|
|
|
'stroke-linejoin': 'strokeLinejoin',
|
|
|
strokemiterlimit: 'strokeMiterlimit',
|
|
|
'stroke-miterlimit': 'strokeMiterlimit',
|
|
|
strokewidth: 'strokeWidth',
|
|
|
'stroke-width': 'strokeWidth',
|
|
|
strokeopacity: 'strokeOpacity',
|
|
|
'stroke-opacity': 'strokeOpacity',
|
|
|
suppresscontenteditablewarning: 'suppressContentEditableWarning',
|
|
|
suppresshydrationwarning: 'suppressHydrationWarning',
|
|
|
surfacescale: 'surfaceScale',
|
|
|
systemlanguage: 'systemLanguage',
|
|
|
tablevalues: 'tableValues',
|
|
|
targetx: 'targetX',
|
|
|
targety: 'targetY',
|
|
|
textanchor: 'textAnchor',
|
|
|
'text-anchor': 'textAnchor',
|
|
|
textdecoration: 'textDecoration',
|
|
|
'text-decoration': 'textDecoration',
|
|
|
textlength: 'textLength',
|
|
|
textrendering: 'textRendering',
|
|
|
'text-rendering': 'textRendering',
|
|
|
to: 'to',
|
|
|
transform: 'transform',
|
|
|
typeof: 'typeof',
|
|
|
u1: 'u1',
|
|
|
u2: 'u2',
|
|
|
underlineposition: 'underlinePosition',
|
|
|
'underline-position': 'underlinePosition',
|
|
|
underlinethickness: 'underlineThickness',
|
|
|
'underline-thickness': 'underlineThickness',
|
|
|
unicode: 'unicode',
|
|
|
unicodebidi: 'unicodeBidi',
|
|
|
'unicode-bidi': 'unicodeBidi',
|
|
|
unicoderange: 'unicodeRange',
|
|
|
'unicode-range': 'unicodeRange',
|
|
|
unitsperem: 'unitsPerEm',
|
|
|
'units-per-em': 'unitsPerEm',
|
|
|
unselectable: 'unselectable',
|
|
|
valphabetic: 'vAlphabetic',
|
|
|
'v-alphabetic': 'vAlphabetic',
|
|
|
values: 'values',
|
|
|
vectoreffect: 'vectorEffect',
|
|
|
'vector-effect': 'vectorEffect',
|
|
|
version: 'version',
|
|
|
vertadvy: 'vertAdvY',
|
|
|
'vert-adv-y': 'vertAdvY',
|
|
|
vertoriginx: 'vertOriginX',
|
|
|
'vert-origin-x': 'vertOriginX',
|
|
|
vertoriginy: 'vertOriginY',
|
|
|
'vert-origin-y': 'vertOriginY',
|
|
|
vhanging: 'vHanging',
|
|
|
'v-hanging': 'vHanging',
|
|
|
videographic: 'vIdeographic',
|
|
|
'v-ideographic': 'vIdeographic',
|
|
|
viewbox: 'viewBox',
|
|
|
viewtarget: 'viewTarget',
|
|
|
visibility: 'visibility',
|
|
|
vmathematical: 'vMathematical',
|
|
|
'v-mathematical': 'vMathematical',
|
|
|
vocab: 'vocab',
|
|
|
widths: 'widths',
|
|
|
wordspacing: 'wordSpacing',
|
|
|
'word-spacing': 'wordSpacing',
|
|
|
writingmode: 'writingMode',
|
|
|
'writing-mode': 'writingMode',
|
|
|
x1: 'x1',
|
|
|
x2: 'x2',
|
|
|
x: 'x',
|
|
|
xchannelselector: 'xChannelSelector',
|
|
|
xheight: 'xHeight',
|
|
|
'x-height': 'xHeight',
|
|
|
xlinkactuate: 'xlinkActuate',
|
|
|
'xlink:actuate': 'xlinkActuate',
|
|
|
xlinkarcrole: 'xlinkArcrole',
|
|
|
'xlink:arcrole': 'xlinkArcrole',
|
|
|
xlinkhref: 'xlinkHref',
|
|
|
'xlink:href': 'xlinkHref',
|
|
|
xlinkrole: 'xlinkRole',
|
|
|
'xlink:role': 'xlinkRole',
|
|
|
xlinkshow: 'xlinkShow',
|
|
|
'xlink:show': 'xlinkShow',
|
|
|
xlinktitle: 'xlinkTitle',
|
|
|
'xlink:title': 'xlinkTitle',
|
|
|
xlinktype: 'xlinkType',
|
|
|
'xlink:type': 'xlinkType',
|
|
|
xmlbase: 'xmlBase',
|
|
|
'xml:base': 'xmlBase',
|
|
|
xmllang: 'xmlLang',
|
|
|
'xml:lang': 'xmlLang',
|
|
|
xmlns: 'xmlns',
|
|
|
'xml:space': 'xmlSpace',
|
|
|
xmlnsxlink: 'xmlnsXlink',
|
|
|
'xmlns:xlink': 'xmlnsXlink',
|
|
|
xmlspace: 'xmlSpace',
|
|
|
y1: 'y1',
|
|
|
y2: 'y2',
|
|
|
y: 'y',
|
|
|
ychannelselector: 'yChannelSelector',
|
|
|
z: 'z',
|
|
|
zoomandpan: 'zoomAndPan'
|
|
|
};
|
|
|
|
|
|
var ariaProperties = {
|
|
|
'aria-current': 0,
|
|
|
// state
|
|
|
'aria-description': 0,
|
|
|
'aria-details': 0,
|
|
|
'aria-disabled': 0,
|
|
|
// state
|
|
|
'aria-hidden': 0,
|
|
|
// state
|
|
|
'aria-invalid': 0,
|
|
|
// state
|
|
|
'aria-keyshortcuts': 0,
|
|
|
'aria-label': 0,
|
|
|
'aria-roledescription': 0,
|
|
|
// Widget Attributes
|
|
|
'aria-autocomplete': 0,
|
|
|
'aria-checked': 0,
|
|
|
'aria-expanded': 0,
|
|
|
'aria-haspopup': 0,
|
|
|
'aria-level': 0,
|
|
|
'aria-modal': 0,
|
|
|
'aria-multiline': 0,
|
|
|
'aria-multiselectable': 0,
|
|
|
'aria-orientation': 0,
|
|
|
'aria-placeholder': 0,
|
|
|
'aria-pressed': 0,
|
|
|
'aria-readonly': 0,
|
|
|
'aria-required': 0,
|
|
|
'aria-selected': 0,
|
|
|
'aria-sort': 0,
|
|
|
'aria-valuemax': 0,
|
|
|
'aria-valuemin': 0,
|
|
|
'aria-valuenow': 0,
|
|
|
'aria-valuetext': 0,
|
|
|
// Live Region Attributes
|
|
|
'aria-atomic': 0,
|
|
|
'aria-busy': 0,
|
|
|
'aria-live': 0,
|
|
|
'aria-relevant': 0,
|
|
|
// Drag-and-Drop Attributes
|
|
|
'aria-dropeffect': 0,
|
|
|
'aria-grabbed': 0,
|
|
|
// Relationship Attributes
|
|
|
'aria-activedescendant': 0,
|
|
|
'aria-colcount': 0,
|
|
|
'aria-colindex': 0,
|
|
|
'aria-colspan': 0,
|
|
|
'aria-controls': 0,
|
|
|
'aria-describedby': 0,
|
|
|
'aria-errormessage': 0,
|
|
|
'aria-flowto': 0,
|
|
|
'aria-labelledby': 0,
|
|
|
'aria-owns': 0,
|
|
|
'aria-posinset': 0,
|
|
|
'aria-rowcount': 0,
|
|
|
'aria-rowindex': 0,
|
|
|
'aria-rowspan': 0,
|
|
|
'aria-setsize': 0
|
|
|
};
|
|
|
|
|
|
var warnedProperties = {};
|
|
|
var rARIA = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$');
|
|
|
var rARIACamel = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$');
|
|
|
|
|
|
function validateProperty(tagName, name) {
|
|
|
{
|
|
|
if (hasOwnProperty.call(warnedProperties, name) && warnedProperties[name]) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (rARIACamel.test(name)) {
|
|
|
var ariaName = 'aria-' + name.slice(4).toLowerCase();
|
|
|
var correctName = ariaProperties.hasOwnProperty(ariaName) ? ariaName : null; // If this is an aria-* attribute, but is not listed in the known DOM
|
|
|
// DOM properties, then it is an invalid aria-* attribute.
|
|
|
|
|
|
if (correctName == null) {
|
|
|
error('Invalid ARIA attribute `%s`. ARIA attributes follow the pattern aria-* and must be lowercase.', name);
|
|
|
|
|
|
warnedProperties[name] = true;
|
|
|
return true;
|
|
|
} // aria-* attributes should be lowercase; suggest the lowercase version.
|
|
|
|
|
|
|
|
|
if (name !== correctName) {
|
|
|
error('Invalid ARIA attribute `%s`. Did you mean `%s`?', name, correctName);
|
|
|
|
|
|
warnedProperties[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (rARIA.test(name)) {
|
|
|
var lowerCasedName = name.toLowerCase();
|
|
|
var standardName = ariaProperties.hasOwnProperty(lowerCasedName) ? lowerCasedName : null; // If this is an aria-* attribute, but is not listed in the known DOM
|
|
|
// DOM properties, then it is an invalid aria-* attribute.
|
|
|
|
|
|
if (standardName == null) {
|
|
|
warnedProperties[name] = true;
|
|
|
return false;
|
|
|
} // aria-* attributes should be lowercase; suggest the lowercase version.
|
|
|
|
|
|
|
|
|
if (name !== standardName) {
|
|
|
error('Unknown ARIA attribute `%s`. Did you mean `%s`?', name, standardName);
|
|
|
|
|
|
warnedProperties[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function warnInvalidARIAProps(type, props) {
|
|
|
{
|
|
|
var invalidProps = [];
|
|
|
|
|
|
for (var key in props) {
|
|
|
var isValid = validateProperty(type, key);
|
|
|
|
|
|
if (!isValid) {
|
|
|
invalidProps.push(key);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var unknownPropString = invalidProps.map(function (prop) {
|
|
|
return '`' + prop + '`';
|
|
|
}).join(', ');
|
|
|
|
|
|
if (invalidProps.length === 1) {
|
|
|
error('Invalid aria prop %s on <%s> tag. ' + 'For details, see https://reactjs.org/link/invalid-aria-props', unknownPropString, type);
|
|
|
} else if (invalidProps.length > 1) {
|
|
|
error('Invalid aria props %s on <%s> tag. ' + 'For details, see https://reactjs.org/link/invalid-aria-props', unknownPropString, type);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function validateProperties(type, props) {
|
|
|
if (isCustomComponent(type, props)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnInvalidARIAProps(type, props);
|
|
|
}
|
|
|
|
|
|
var didWarnValueNull = false;
|
|
|
function validateProperties$1(type, props) {
|
|
|
{
|
|
|
if (type !== 'input' && type !== 'textarea' && type !== 'select') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (props != null && props.value === null && !didWarnValueNull) {
|
|
|
didWarnValueNull = true;
|
|
|
|
|
|
if (type === 'select' && props.multiple) {
|
|
|
error('`value` prop on `%s` should not be null. ' + 'Consider using an empty array when `multiple` is set to `true` ' + 'to clear the component or `undefined` for uncontrolled components.', type);
|
|
|
} else {
|
|
|
error('`value` prop on `%s` should not be null. ' + 'Consider using an empty string to clear the component or `undefined` ' + 'for uncontrolled components.', type);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var validateProperty$1 = function () {};
|
|
|
|
|
|
{
|
|
|
var warnedProperties$1 = {};
|
|
|
var EVENT_NAME_REGEX = /^on./;
|
|
|
var INVALID_EVENT_NAME_REGEX = /^on[^A-Z]/;
|
|
|
var rARIA$1 = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$');
|
|
|
var rARIACamel$1 = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$');
|
|
|
|
|
|
validateProperty$1 = function (tagName, name, value, eventRegistry) {
|
|
|
if (hasOwnProperty.call(warnedProperties$1, name) && warnedProperties$1[name]) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
var lowerCasedName = name.toLowerCase();
|
|
|
|
|
|
if (lowerCasedName === 'onfocusin' || lowerCasedName === 'onfocusout') {
|
|
|
error('React uses onFocus and onBlur instead of onFocusIn and onFocusOut. ' + 'All React events are normalized to bubble, so onFocusIn and onFocusOut ' + 'are not needed/supported by React.');
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
} // We can't rely on the event system being injected on the server.
|
|
|
|
|
|
|
|
|
if (eventRegistry != null) {
|
|
|
var registrationNameDependencies = eventRegistry.registrationNameDependencies,
|
|
|
possibleRegistrationNames = eventRegistry.possibleRegistrationNames;
|
|
|
|
|
|
if (registrationNameDependencies.hasOwnProperty(name)) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
var registrationName = possibleRegistrationNames.hasOwnProperty(lowerCasedName) ? possibleRegistrationNames[lowerCasedName] : null;
|
|
|
|
|
|
if (registrationName != null) {
|
|
|
error('Invalid event handler property `%s`. Did you mean `%s`?', name, registrationName);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (EVENT_NAME_REGEX.test(name)) {
|
|
|
error('Unknown event handler property `%s`. It will be ignored.', name);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
} else if (EVENT_NAME_REGEX.test(name)) {
|
|
|
// If no event plugins have been injected, we are in a server environment.
|
|
|
// So we can't tell if the event name is correct for sure, but we can filter
|
|
|
// out known bad ones like `onclick`. We can't suggest a specific replacement though.
|
|
|
if (INVALID_EVENT_NAME_REGEX.test(name)) {
|
|
|
error('Invalid event handler property `%s`. ' + 'React events use the camelCase naming convention, for example `onClick`.', name);
|
|
|
}
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
} // Let the ARIA attribute hook validate ARIA attributes
|
|
|
|
|
|
|
|
|
if (rARIA$1.test(name) || rARIACamel$1.test(name)) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (lowerCasedName === 'innerhtml') {
|
|
|
error('Directly setting property `innerHTML` is not permitted. ' + 'For more information, lookup documentation on `dangerouslySetInnerHTML`.');
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (lowerCasedName === 'aria') {
|
|
|
error('The `aria` attribute is reserved for future use in React. ' + 'Pass individual `aria-` attributes instead.');
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (lowerCasedName === 'is' && value !== null && value !== undefined && typeof value !== 'string') {
|
|
|
error('Received a `%s` for a string attribute `is`. If this is expected, cast ' + 'the value to a string.', typeof value);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (typeof value === 'number' && isNaN(value)) {
|
|
|
error('Received NaN for the `%s` attribute. If this is expected, cast ' + 'the value to a string.', name);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
var propertyInfo = getPropertyInfo(name);
|
|
|
var isReserved = propertyInfo !== null && propertyInfo.type === RESERVED; // Known attributes should match the casing specified in the property config.
|
|
|
|
|
|
if (possibleStandardNames.hasOwnProperty(lowerCasedName)) {
|
|
|
var standardName = possibleStandardNames[lowerCasedName];
|
|
|
|
|
|
if (standardName !== name) {
|
|
|
error('Invalid DOM property `%s`. Did you mean `%s`?', name, standardName);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
} else if (!isReserved && name !== lowerCasedName) {
|
|
|
// Unknown attributes should have lowercase casing since that's how they
|
|
|
// will be cased anyway with server rendering.
|
|
|
error('React does not recognize the `%s` prop on a DOM element. If you ' + 'intentionally want it to appear in the DOM as a custom ' + 'attribute, spell it as lowercase `%s` instead. ' + 'If you accidentally passed it from a parent component, remove ' + 'it from the DOM element.', name, lowerCasedName);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (typeof value === 'boolean' && shouldRemoveAttributeWithWarning(name, value, propertyInfo, false)) {
|
|
|
if (value) {
|
|
|
error('Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.', value, name, name, value, name);
|
|
|
} else {
|
|
|
error('Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.', value, name, name, value, name, name, name);
|
|
|
}
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
} // Now that we've validated casing, do not validate
|
|
|
// data types for reserved props
|
|
|
|
|
|
|
|
|
if (isReserved) {
|
|
|
return true;
|
|
|
} // Warn when a known attribute is a bad type
|
|
|
|
|
|
|
|
|
if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, false)) {
|
|
|
warnedProperties$1[name] = true;
|
|
|
return false;
|
|
|
} // Warn when passing the strings 'false' or 'true' into a boolean prop
|
|
|
|
|
|
|
|
|
if ((value === 'false' || value === 'true') && propertyInfo !== null && propertyInfo.type === BOOLEAN) {
|
|
|
error('Received the string `%s` for the boolean attribute `%s`. ' + '%s ' + 'Did you mean %s={%s}?', value, name, value === 'false' ? 'The browser will interpret it as a truthy value.' : 'Although this works, it will not work as expected if you pass the string "false".', name, value);
|
|
|
|
|
|
warnedProperties$1[name] = true;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var warnUnknownProperties = function (type, props, eventRegistry) {
|
|
|
{
|
|
|
var unknownProps = [];
|
|
|
|
|
|
for (var key in props) {
|
|
|
var isValid = validateProperty$1(type, key, props[key], eventRegistry);
|
|
|
|
|
|
if (!isValid) {
|
|
|
unknownProps.push(key);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var unknownPropString = unknownProps.map(function (prop) {
|
|
|
return '`' + prop + '`';
|
|
|
}).join(', ');
|
|
|
|
|
|
if (unknownProps.length === 1) {
|
|
|
error('Invalid value for prop %s on <%s> tag. Either remove it from the element, ' + 'or pass a string or number value to keep it in the DOM. ' + 'For details, see https://reactjs.org/link/attribute-behavior ', unknownPropString, type);
|
|
|
} else if (unknownProps.length > 1) {
|
|
|
error('Invalid values for props %s on <%s> tag. Either remove them from the element, ' + 'or pass a string or number value to keep them in the DOM. ' + 'For details, see https://reactjs.org/link/attribute-behavior ', unknownPropString, type);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
function validateProperties$2(type, props, eventRegistry) {
|
|
|
if (isCustomComponent(type, props)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
warnUnknownProperties(type, props, eventRegistry);
|
|
|
}
|
|
|
|
|
|
var IS_EVENT_HANDLE_NON_MANAGED_NODE = 1;
|
|
|
var IS_NON_DELEGATED = 1 << 1;
|
|
|
var IS_CAPTURE_PHASE = 1 << 2;
|
|
|
// set to LEGACY_FB_SUPPORT. LEGACY_FB_SUPPORT only gets set when
|
|
|
// we call willDeferLaterForLegacyFBSupport, thus not bailing out
|
|
|
// will result in endless cycles like an infinite loop.
|
|
|
// We also don't want to defer during event replaying.
|
|
|
|
|
|
var SHOULD_NOT_PROCESS_POLYFILL_EVENT_PLUGINS = IS_EVENT_HANDLE_NON_MANAGED_NODE | IS_NON_DELEGATED | IS_CAPTURE_PHASE;
|
|
|
|
|
|
// This exists to avoid circular dependency between ReactDOMEventReplaying
|
|
|
// and DOMPluginEventSystem.
|
|
|
var currentReplayingEvent = null;
|
|
|
function setReplayingEvent(event) {
|
|
|
{
|
|
|
if (currentReplayingEvent !== null) {
|
|
|
error('Expected currently replaying event to be null. This error ' + 'is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
currentReplayingEvent = event;
|
|
|
}
|
|
|
function resetReplayingEvent() {
|
|
|
{
|
|
|
if (currentReplayingEvent === null) {
|
|
|
error('Expected currently replaying event to not be null. This error ' + 'is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
currentReplayingEvent = null;
|
|
|
}
|
|
|
function isReplayingEvent(event) {
|
|
|
return event === currentReplayingEvent;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Gets the target node from a native browser event by accounting for
|
|
|
* inconsistencies in browser DOM APIs.
|
|
|
*
|
|
|
* @param {object} nativeEvent Native browser event.
|
|
|
* @return {DOMEventTarget} Target node.
|
|
|
*/
|
|
|
|
|
|
function getEventTarget(nativeEvent) {
|
|
|
// Fallback to nativeEvent.srcElement for IE9
|
|
|
// https://github.com/facebook/react/issues/12506
|
|
|
var target = nativeEvent.target || nativeEvent.srcElement || window; // Normalize SVG <use> element events #4963
|
|
|
|
|
|
if (target.correspondingUseElement) {
|
|
|
target = target.correspondingUseElement;
|
|
|
} // Safari may fire events on text nodes (Node.TEXT_NODE is 3).
|
|
|
// @see http://www.quirksmode.org/js/events_properties.html
|
|
|
|
|
|
|
|
|
return target.nodeType === TEXT_NODE ? target.parentNode : target;
|
|
|
}
|
|
|
|
|
|
var restoreImpl = null;
|
|
|
var restoreTarget = null;
|
|
|
var restoreQueue = null;
|
|
|
|
|
|
function restoreStateOfTarget(target) {
|
|
|
// We perform this translation at the end of the event loop so that we
|
|
|
// always receive the correct fiber here
|
|
|
var internalInstance = getInstanceFromNode(target);
|
|
|
|
|
|
if (!internalInstance) {
|
|
|
// Unmounted
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (typeof restoreImpl !== 'function') {
|
|
|
throw new Error('setRestoreImplementation() needs to be called to handle a target for controlled ' + 'events. This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
var stateNode = internalInstance.stateNode; // Guard against Fiber being unmounted.
|
|
|
|
|
|
if (stateNode) {
|
|
|
var _props = getFiberCurrentPropsFromNode(stateNode);
|
|
|
|
|
|
restoreImpl(internalInstance.stateNode, internalInstance.type, _props);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function setRestoreImplementation(impl) {
|
|
|
restoreImpl = impl;
|
|
|
}
|
|
|
function enqueueStateRestore(target) {
|
|
|
if (restoreTarget) {
|
|
|
if (restoreQueue) {
|
|
|
restoreQueue.push(target);
|
|
|
} else {
|
|
|
restoreQueue = [target];
|
|
|
}
|
|
|
} else {
|
|
|
restoreTarget = target;
|
|
|
}
|
|
|
}
|
|
|
function needsStateRestore() {
|
|
|
return restoreTarget !== null || restoreQueue !== null;
|
|
|
}
|
|
|
function restoreStateIfNeeded() {
|
|
|
if (!restoreTarget) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var target = restoreTarget;
|
|
|
var queuedTargets = restoreQueue;
|
|
|
restoreTarget = null;
|
|
|
restoreQueue = null;
|
|
|
restoreStateOfTarget(target);
|
|
|
|
|
|
if (queuedTargets) {
|
|
|
for (var i = 0; i < queuedTargets.length; i++) {
|
|
|
restoreStateOfTarget(queuedTargets[i]);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// the renderer. Such as when we're dispatching events or if third party
|
|
|
// libraries need to call batchedUpdates. Eventually, this API will go away when
|
|
|
// everything is batched by default. We'll then have a similar API to opt-out of
|
|
|
// scheduled work and instead do synchronous work.
|
|
|
// Defaults
|
|
|
|
|
|
var batchedUpdatesImpl = function (fn, bookkeeping) {
|
|
|
return fn(bookkeeping);
|
|
|
};
|
|
|
|
|
|
var flushSyncImpl = function () {};
|
|
|
|
|
|
var isInsideEventHandler = false;
|
|
|
|
|
|
function finishEventHandler() {
|
|
|
// Here we wait until all updates have propagated, which is important
|
|
|
// when using controlled components within layers:
|
|
|
// https://github.com/facebook/react/issues/1698
|
|
|
// Then we restore state of any controlled component.
|
|
|
var controlledComponentsHavePendingUpdates = needsStateRestore();
|
|
|
|
|
|
if (controlledComponentsHavePendingUpdates) {
|
|
|
// If a controlled event was fired, we may need to restore the state of
|
|
|
// the DOM node back to the controlled value. This is necessary when React
|
|
|
// bails out of the update without touching the DOM.
|
|
|
// TODO: Restore state in the microtask, after the discrete updates flush,
|
|
|
// instead of early flushing them here.
|
|
|
flushSyncImpl();
|
|
|
restoreStateIfNeeded();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function batchedUpdates(fn, a, b) {
|
|
|
if (isInsideEventHandler) {
|
|
|
// If we are currently inside another batch, we need to wait until it
|
|
|
// fully completes before restoring state.
|
|
|
return fn(a, b);
|
|
|
}
|
|
|
|
|
|
isInsideEventHandler = true;
|
|
|
|
|
|
try {
|
|
|
return batchedUpdatesImpl(fn, a, b);
|
|
|
} finally {
|
|
|
isInsideEventHandler = false;
|
|
|
finishEventHandler();
|
|
|
}
|
|
|
} // TODO: Replace with flushSync
|
|
|
function setBatchingImplementation(_batchedUpdatesImpl, _discreteUpdatesImpl, _flushSyncImpl) {
|
|
|
batchedUpdatesImpl = _batchedUpdatesImpl;
|
|
|
flushSyncImpl = _flushSyncImpl;
|
|
|
}
|
|
|
|
|
|
function isInteractive(tag) {
|
|
|
return tag === 'button' || tag === 'input' || tag === 'select' || tag === 'textarea';
|
|
|
}
|
|
|
|
|
|
function shouldPreventMouseEvent(name, type, props) {
|
|
|
switch (name) {
|
|
|
case 'onClick':
|
|
|
case 'onClickCapture':
|
|
|
case 'onDoubleClick':
|
|
|
case 'onDoubleClickCapture':
|
|
|
case 'onMouseDown':
|
|
|
case 'onMouseDownCapture':
|
|
|
case 'onMouseMove':
|
|
|
case 'onMouseMoveCapture':
|
|
|
case 'onMouseUp':
|
|
|
case 'onMouseUpCapture':
|
|
|
case 'onMouseEnter':
|
|
|
return !!(props.disabled && isInteractive(type));
|
|
|
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* @param {object} inst The instance, which is the source of events.
|
|
|
* @param {string} registrationName Name of listener (e.g. `onClick`).
|
|
|
* @return {?function} The stored callback.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getListener(inst, registrationName) {
|
|
|
var stateNode = inst.stateNode;
|
|
|
|
|
|
if (stateNode === null) {
|
|
|
// Work in progress (ex: onload events in incremental mode).
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var props = getFiberCurrentPropsFromNode(stateNode);
|
|
|
|
|
|
if (props === null) {
|
|
|
// Work in progress.
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var listener = props[registrationName];
|
|
|
|
|
|
if (shouldPreventMouseEvent(registrationName, inst.type, props)) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
if (listener && typeof listener !== 'function') {
|
|
|
throw new Error("Expected `" + registrationName + "` listener to be a function, instead got a value of `" + typeof listener + "` type.");
|
|
|
}
|
|
|
|
|
|
return listener;
|
|
|
}
|
|
|
|
|
|
var passiveBrowserEventsSupported = false; // Check if browser support events with passive listeners
|
|
|
// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support
|
|
|
|
|
|
if (canUseDOM) {
|
|
|
try {
|
|
|
var options = {}; // $FlowFixMe: Ignore Flow complaining about needing a value
|
|
|
|
|
|
Object.defineProperty(options, 'passive', {
|
|
|
get: function () {
|
|
|
passiveBrowserEventsSupported = true;
|
|
|
}
|
|
|
});
|
|
|
window.addEventListener('test', options, options);
|
|
|
window.removeEventListener('test', options, options);
|
|
|
} catch (e) {
|
|
|
passiveBrowserEventsSupported = false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function invokeGuardedCallbackProd(name, func, context, a, b, c, d, e, f) {
|
|
|
var funcArgs = Array.prototype.slice.call(arguments, 3);
|
|
|
|
|
|
try {
|
|
|
func.apply(context, funcArgs);
|
|
|
} catch (error) {
|
|
|
this.onError(error);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var invokeGuardedCallbackImpl = invokeGuardedCallbackProd;
|
|
|
|
|
|
{
|
|
|
// In DEV mode, we swap out invokeGuardedCallback for a special version
|
|
|
// that plays more nicely with the browser's DevTools. The idea is to preserve
|
|
|
// "Pause on exceptions" behavior. Because React wraps all user-provided
|
|
|
// functions in invokeGuardedCallback, and the production version of
|
|
|
// invokeGuardedCallback uses a try-catch, all user exceptions are treated
|
|
|
// like caught exceptions, and the DevTools won't pause unless the developer
|
|
|
// takes the extra step of enabling pause on caught exceptions. This is
|
|
|
// unintuitive, though, because even though React has caught the error, from
|
|
|
// the developer's perspective, the error is uncaught.
|
|
|
//
|
|
|
// To preserve the expected "Pause on exceptions" behavior, we don't use a
|
|
|
// try-catch in DEV. Instead, we synchronously dispatch a fake event to a fake
|
|
|
// DOM node, and call the user-provided callback from inside an event handler
|
|
|
// for that fake event. If the callback throws, the error is "captured" using
|
|
|
// a global event handler. But because the error happens in a different
|
|
|
// event loop context, it does not interrupt the normal program flow.
|
|
|
// Effectively, this gives us try-catch behavior without actually using
|
|
|
// try-catch. Neat!
|
|
|
// Check that the browser supports the APIs we need to implement our special
|
|
|
// DEV version of invokeGuardedCallback
|
|
|
if (typeof window !== 'undefined' && typeof window.dispatchEvent === 'function' && typeof document !== 'undefined' && typeof document.createEvent === 'function') {
|
|
|
var fakeNode = document.createElement('react');
|
|
|
|
|
|
invokeGuardedCallbackImpl = function invokeGuardedCallbackDev(name, func, context, a, b, c, d, e, f) {
|
|
|
// If document doesn't exist we know for sure we will crash in this method
|
|
|
// when we call document.createEvent(). However this can cause confusing
|
|
|
// errors: https://github.com/facebook/create-react-app/issues/3482
|
|
|
// So we preemptively throw with a better message instead.
|
|
|
if (typeof document === 'undefined' || document === null) {
|
|
|
throw new Error('The `document` global was defined when React was initialized, but is not ' + 'defined anymore. This can happen in a test environment if a component ' + 'schedules an update from an asynchronous callback, but the test has already ' + 'finished running. To solve this, you can either unmount the component at ' + 'the end of your test (and ensure that any asynchronous operations get ' + 'canceled in `componentWillUnmount`), or you can change the test itself ' + 'to be asynchronous.');
|
|
|
}
|
|
|
|
|
|
var evt = document.createEvent('Event');
|
|
|
var didCall = false; // Keeps track of whether the user-provided callback threw an error. We
|
|
|
// set this to true at the beginning, then set it to false right after
|
|
|
// calling the function. If the function errors, `didError` will never be
|
|
|
// set to false. This strategy works even if the browser is flaky and
|
|
|
// fails to call our global error handler, because it doesn't rely on
|
|
|
// the error event at all.
|
|
|
|
|
|
var didError = true; // Keeps track of the value of window.event so that we can reset it
|
|
|
// during the callback to let user code access window.event in the
|
|
|
// browsers that support it.
|
|
|
|
|
|
var windowEvent = window.event; // Keeps track of the descriptor of window.event to restore it after event
|
|
|
// dispatching: https://github.com/facebook/react/issues/13688
|
|
|
|
|
|
var windowEventDescriptor = Object.getOwnPropertyDescriptor(window, 'event');
|
|
|
|
|
|
function restoreAfterDispatch() {
|
|
|
// We immediately remove the callback from event listeners so that
|
|
|
// nested `invokeGuardedCallback` calls do not clash. Otherwise, a
|
|
|
// nested call would trigger the fake event handlers of any call higher
|
|
|
// in the stack.
|
|
|
fakeNode.removeEventListener(evtType, callCallback, false); // We check for window.hasOwnProperty('event') to prevent the
|
|
|
// window.event assignment in both IE <= 10 as they throw an error
|
|
|
// "Member not found" in strict mode, and in Firefox which does not
|
|
|
// support window.event.
|
|
|
|
|
|
if (typeof window.event !== 'undefined' && window.hasOwnProperty('event')) {
|
|
|
window.event = windowEvent;
|
|
|
}
|
|
|
} // Create an event handler for our fake event. We will synchronously
|
|
|
// dispatch our fake event using `dispatchEvent`. Inside the handler, we
|
|
|
// call the user-provided callback.
|
|
|
|
|
|
|
|
|
var funcArgs = Array.prototype.slice.call(arguments, 3);
|
|
|
|
|
|
function callCallback() {
|
|
|
didCall = true;
|
|
|
restoreAfterDispatch();
|
|
|
func.apply(context, funcArgs);
|
|
|
didError = false;
|
|
|
} // Create a global error event handler. We use this to capture the value
|
|
|
// that was thrown. It's possible that this error handler will fire more
|
|
|
// than once; for example, if non-React code also calls `dispatchEvent`
|
|
|
// and a handler for that event throws. We should be resilient to most of
|
|
|
// those cases. Even if our error event handler fires more than once, the
|
|
|
// last error event is always used. If the callback actually does error,
|
|
|
// we know that the last error event is the correct one, because it's not
|
|
|
// possible for anything else to have happened in between our callback
|
|
|
// erroring and the code that follows the `dispatchEvent` call below. If
|
|
|
// the callback doesn't error, but the error event was fired, we know to
|
|
|
// ignore it because `didError` will be false, as described above.
|
|
|
|
|
|
|
|
|
var error; // Use this to track whether the error event is ever called.
|
|
|
|
|
|
var didSetError = false;
|
|
|
var isCrossOriginError = false;
|
|
|
|
|
|
function handleWindowError(event) {
|
|
|
error = event.error;
|
|
|
didSetError = true;
|
|
|
|
|
|
if (error === null && event.colno === 0 && event.lineno === 0) {
|
|
|
isCrossOriginError = true;
|
|
|
}
|
|
|
|
|
|
if (event.defaultPrevented) {
|
|
|
// Some other error handler has prevented default.
|
|
|
// Browsers silence the error report if this happens.
|
|
|
// We'll remember this to later decide whether to log it or not.
|
|
|
if (error != null && typeof error === 'object') {
|
|
|
try {
|
|
|
error._suppressLogging = true;
|
|
|
} catch (inner) {// Ignore.
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} // Create a fake event type.
|
|
|
|
|
|
|
|
|
var evtType = "react-" + (name ? name : 'invokeguardedcallback'); // Attach our event handlers
|
|
|
|
|
|
window.addEventListener('error', handleWindowError);
|
|
|
fakeNode.addEventListener(evtType, callCallback, false); // Synchronously dispatch our fake event. If the user-provided function
|
|
|
// errors, it will trigger our global error handler.
|
|
|
|
|
|
evt.initEvent(evtType, false, false);
|
|
|
fakeNode.dispatchEvent(evt);
|
|
|
|
|
|
if (windowEventDescriptor) {
|
|
|
Object.defineProperty(window, 'event', windowEventDescriptor);
|
|
|
}
|
|
|
|
|
|
if (didCall && didError) {
|
|
|
if (!didSetError) {
|
|
|
// The callback errored, but the error event never fired.
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
error = new Error('An error was thrown inside one of your components, but React ' + "doesn't know what it was. This is likely due to browser " + 'flakiness. React does its best to preserve the "Pause on ' + 'exceptions" behavior of the DevTools, which requires some ' + "DEV-mode only tricks. It's possible that these don't work in " + 'your browser. Try triggering the error in production mode, ' + 'or switching to a modern browser. If you suspect that this is ' + 'actually an issue with React, please file an issue.');
|
|
|
} else if (isCrossOriginError) {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
error = new Error("A cross-origin error was thrown. React doesn't have access to " + 'the actual error object in development. ' + 'See https://reactjs.org/link/crossorigin-error for more information.');
|
|
|
}
|
|
|
|
|
|
this.onError(error);
|
|
|
} // Remove our event listeners
|
|
|
|
|
|
|
|
|
window.removeEventListener('error', handleWindowError);
|
|
|
|
|
|
if (!didCall) {
|
|
|
// Something went really wrong, and our event was not dispatched.
|
|
|
// https://github.com/facebook/react/issues/16734
|
|
|
// https://github.com/facebook/react/issues/16585
|
|
|
// Fall back to the production implementation.
|
|
|
restoreAfterDispatch();
|
|
|
return invokeGuardedCallbackProd.apply(this, arguments);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var invokeGuardedCallbackImpl$1 = invokeGuardedCallbackImpl;
|
|
|
|
|
|
var hasError = false;
|
|
|
var caughtError = null; // Used by event system to capture/rethrow the first error.
|
|
|
|
|
|
var hasRethrowError = false;
|
|
|
var rethrowError = null;
|
|
|
var reporter = {
|
|
|
onError: function (error) {
|
|
|
hasError = true;
|
|
|
caughtError = error;
|
|
|
}
|
|
|
};
|
|
|
/**
|
|
|
* Call a function while guarding against errors that happens within it.
|
|
|
* Returns an error if it throws, otherwise null.
|
|
|
*
|
|
|
* In production, this is implemented using a try-catch. The reason we don't
|
|
|
* use a try-catch directly is so that we can swap out a different
|
|
|
* implementation in DEV mode.
|
|
|
*
|
|
|
* @param {String} name of the guard to use for logging or debugging
|
|
|
* @param {Function} func The function to invoke
|
|
|
* @param {*} context The context to use when calling the function
|
|
|
* @param {...*} args Arguments for function
|
|
|
*/
|
|
|
|
|
|
function invokeGuardedCallback(name, func, context, a, b, c, d, e, f) {
|
|
|
hasError = false;
|
|
|
caughtError = null;
|
|
|
invokeGuardedCallbackImpl$1.apply(reporter, arguments);
|
|
|
}
|
|
|
/**
|
|
|
* Same as invokeGuardedCallback, but instead of returning an error, it stores
|
|
|
* it in a global so it can be rethrown by `rethrowCaughtError` later.
|
|
|
* TODO: See if caughtError and rethrowError can be unified.
|
|
|
*
|
|
|
* @param {String} name of the guard to use for logging or debugging
|
|
|
* @param {Function} func The function to invoke
|
|
|
* @param {*} context The context to use when calling the function
|
|
|
* @param {...*} args Arguments for function
|
|
|
*/
|
|
|
|
|
|
function invokeGuardedCallbackAndCatchFirstError(name, func, context, a, b, c, d, e, f) {
|
|
|
invokeGuardedCallback.apply(this, arguments);
|
|
|
|
|
|
if (hasError) {
|
|
|
var error = clearCaughtError();
|
|
|
|
|
|
if (!hasRethrowError) {
|
|
|
hasRethrowError = true;
|
|
|
rethrowError = error;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* During execution of guarded functions we will capture the first error which
|
|
|
* we will rethrow to be handled by the top level error handler.
|
|
|
*/
|
|
|
|
|
|
function rethrowCaughtError() {
|
|
|
if (hasRethrowError) {
|
|
|
var error = rethrowError;
|
|
|
hasRethrowError = false;
|
|
|
rethrowError = null;
|
|
|
throw error;
|
|
|
}
|
|
|
}
|
|
|
function hasCaughtError() {
|
|
|
return hasError;
|
|
|
}
|
|
|
function clearCaughtError() {
|
|
|
if (hasError) {
|
|
|
var error = caughtError;
|
|
|
hasError = false;
|
|
|
caughtError = null;
|
|
|
return error;
|
|
|
} else {
|
|
|
throw new Error('clearCaughtError was called but no error was captured. This error ' + 'is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* `ReactInstanceMap` maintains a mapping from a public facing stateful
|
|
|
* instance (key) and the internal representation (value). This allows public
|
|
|
* methods to accept the user facing instance as an argument and map them back
|
|
|
* to internal methods.
|
|
|
*
|
|
|
* Note that this module is currently shared and assumed to be stateless.
|
|
|
* If this becomes an actual Map, that will break.
|
|
|
*/
|
|
|
function get(key) {
|
|
|
return key._reactInternals;
|
|
|
}
|
|
|
function has(key) {
|
|
|
return key._reactInternals !== undefined;
|
|
|
}
|
|
|
function set(key, value) {
|
|
|
key._reactInternals = value;
|
|
|
}
|
|
|
|
|
|
// Don't change these two values. They're used by React Dev Tools.
|
|
|
var NoFlags =
|
|
|
/* */
|
|
|
0;
|
|
|
var PerformedWork =
|
|
|
/* */
|
|
|
1; // You can change the rest (and add more).
|
|
|
|
|
|
var Placement =
|
|
|
/* */
|
|
|
2;
|
|
|
var Update =
|
|
|
/* */
|
|
|
4;
|
|
|
var ChildDeletion =
|
|
|
/* */
|
|
|
16;
|
|
|
var ContentReset =
|
|
|
/* */
|
|
|
32;
|
|
|
var Callback =
|
|
|
/* */
|
|
|
64;
|
|
|
var DidCapture =
|
|
|
/* */
|
|
|
128;
|
|
|
var ForceClientRender =
|
|
|
/* */
|
|
|
256;
|
|
|
var Ref =
|
|
|
/* */
|
|
|
512;
|
|
|
var Snapshot =
|
|
|
/* */
|
|
|
1024;
|
|
|
var Passive =
|
|
|
/* */
|
|
|
2048;
|
|
|
var Hydrating =
|
|
|
/* */
|
|
|
4096;
|
|
|
var Visibility =
|
|
|
/* */
|
|
|
8192;
|
|
|
var StoreConsistency =
|
|
|
/* */
|
|
|
16384;
|
|
|
var LifecycleEffectMask = Passive | Update | Callback | Ref | Snapshot | StoreConsistency; // Union of all commit flags (flags with the lifetime of a particular commit)
|
|
|
|
|
|
var HostEffectMask =
|
|
|
/* */
|
|
|
32767; // These are not really side effects, but we still reuse this field.
|
|
|
|
|
|
var Incomplete =
|
|
|
/* */
|
|
|
32768;
|
|
|
var ShouldCapture =
|
|
|
/* */
|
|
|
65536;
|
|
|
var ForceUpdateForLegacySuspense =
|
|
|
/* */
|
|
|
131072;
|
|
|
var Forked =
|
|
|
/* */
|
|
|
1048576; // Static tags describe aspects of a fiber that are not specific to a render,
|
|
|
// e.g. a fiber uses a passive effect (even if there are no updates on this particular render).
|
|
|
// This enables us to defer more work in the unmount case,
|
|
|
// since we can defer traversing the tree during layout to look for Passive effects,
|
|
|
// and instead rely on the static flag as a signal that there may be cleanup work.
|
|
|
|
|
|
var RefStatic =
|
|
|
/* */
|
|
|
2097152;
|
|
|
var LayoutStatic =
|
|
|
/* */
|
|
|
4194304;
|
|
|
var PassiveStatic =
|
|
|
/* */
|
|
|
8388608; // These flags allow us to traverse to fibers that have effects on mount
|
|
|
// without traversing the entire tree after every commit for
|
|
|
// double invoking
|
|
|
|
|
|
var MountLayoutDev =
|
|
|
/* */
|
|
|
16777216;
|
|
|
var MountPassiveDev =
|
|
|
/* */
|
|
|
33554432; // Groups of flags that are used in the commit phase to skip over trees that
|
|
|
// don't contain effects, by checking subtreeFlags.
|
|
|
|
|
|
var BeforeMutationMask = // TODO: Remove Update flag from before mutation phase by re-landing Visibility
|
|
|
// flag logic (see #20043)
|
|
|
Update | Snapshot | ( 0);
|
|
|
var MutationMask = Placement | Update | ChildDeletion | ContentReset | Ref | Hydrating | Visibility;
|
|
|
var LayoutMask = Update | Callback | Ref | Visibility; // TODO: Split into PassiveMountMask and PassiveUnmountMask
|
|
|
|
|
|
var PassiveMask = Passive | ChildDeletion; // Union of tags that don't get reset on clones.
|
|
|
// This allows certain concepts to persist without recalculating them,
|
|
|
// e.g. whether a subtree contains passive effects or portals.
|
|
|
|
|
|
var StaticMask = LayoutStatic | PassiveStatic | RefStatic;
|
|
|
|
|
|
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
|
|
function getNearestMountedFiber(fiber) {
|
|
|
var node = fiber;
|
|
|
var nearestMounted = fiber;
|
|
|
|
|
|
if (!fiber.alternate) {
|
|
|
// If there is no alternate, this might be a new tree that isn't inserted
|
|
|
// yet. If it is, then it will have a pending insertion effect on it.
|
|
|
var nextNode = node;
|
|
|
|
|
|
do {
|
|
|
node = nextNode;
|
|
|
|
|
|
if ((node.flags & (Placement | Hydrating)) !== NoFlags) {
|
|
|
// This is an insertion or in-progress hydration. The nearest possible
|
|
|
// mounted fiber is the parent but we need to continue to figure out
|
|
|
// if that one is still mounted.
|
|
|
nearestMounted = node.return;
|
|
|
}
|
|
|
|
|
|
nextNode = node.return;
|
|
|
} while (nextNode);
|
|
|
} else {
|
|
|
while (node.return) {
|
|
|
node = node.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (node.tag === HostRoot) {
|
|
|
// TODO: Check if this was a nested HostRoot when used with
|
|
|
// renderContainerIntoSubtree.
|
|
|
return nearestMounted;
|
|
|
} // If we didn't hit the root, that means that we're in an disconnected tree
|
|
|
// that has been unmounted.
|
|
|
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
function getSuspenseInstanceFromFiber(fiber) {
|
|
|
if (fiber.tag === SuspenseComponent) {
|
|
|
var suspenseState = fiber.memoizedState;
|
|
|
|
|
|
if (suspenseState === null) {
|
|
|
var current = fiber.alternate;
|
|
|
|
|
|
if (current !== null) {
|
|
|
suspenseState = current.memoizedState;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (suspenseState !== null) {
|
|
|
return suspenseState.dehydrated;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
function getContainerFromFiber(fiber) {
|
|
|
return fiber.tag === HostRoot ? fiber.stateNode.containerInfo : null;
|
|
|
}
|
|
|
function isFiberMounted(fiber) {
|
|
|
return getNearestMountedFiber(fiber) === fiber;
|
|
|
}
|
|
|
function isMounted(component) {
|
|
|
{
|
|
|
var owner = ReactCurrentOwner.current;
|
|
|
|
|
|
if (owner !== null && owner.tag === ClassComponent) {
|
|
|
var ownerFiber = owner;
|
|
|
var instance = ownerFiber.stateNode;
|
|
|
|
|
|
if (!instance._warnedAboutRefsInRender) {
|
|
|
error('%s is accessing isMounted inside its render() function. ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentNameFromFiber(ownerFiber) || 'A component');
|
|
|
}
|
|
|
|
|
|
instance._warnedAboutRefsInRender = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var fiber = get(component);
|
|
|
|
|
|
if (!fiber) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
return getNearestMountedFiber(fiber) === fiber;
|
|
|
}
|
|
|
|
|
|
function assertIsMounted(fiber) {
|
|
|
if (getNearestMountedFiber(fiber) !== fiber) {
|
|
|
throw new Error('Unable to find node on an unmounted component.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function findCurrentFiberUsingSlowPath(fiber) {
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (!alternate) {
|
|
|
// If there is no alternate, then we only need to check if it is mounted.
|
|
|
var nearestMounted = getNearestMountedFiber(fiber);
|
|
|
|
|
|
if (nearestMounted === null) {
|
|
|
throw new Error('Unable to find node on an unmounted component.');
|
|
|
}
|
|
|
|
|
|
if (nearestMounted !== fiber) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return fiber;
|
|
|
} // If we have two possible branches, we'll walk backwards up to the root
|
|
|
// to see what path the root points to. On the way we may hit one of the
|
|
|
// special cases and we'll deal with them.
|
|
|
|
|
|
|
|
|
var a = fiber;
|
|
|
var b = alternate;
|
|
|
|
|
|
while (true) {
|
|
|
var parentA = a.return;
|
|
|
|
|
|
if (parentA === null) {
|
|
|
// We're at the root.
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var parentB = parentA.alternate;
|
|
|
|
|
|
if (parentB === null) {
|
|
|
// There is no alternate. This is an unusual case. Currently, it only
|
|
|
// happens when a Suspense component is hidden. An extra fragment fiber
|
|
|
// is inserted in between the Suspense fiber and its children. Skip
|
|
|
// over this extra fragment fiber and proceed to the next parent.
|
|
|
var nextParent = parentA.return;
|
|
|
|
|
|
if (nextParent !== null) {
|
|
|
a = b = nextParent;
|
|
|
continue;
|
|
|
} // If there's no parent, we're at the root.
|
|
|
|
|
|
|
|
|
break;
|
|
|
} // If both copies of the parent fiber point to the same child, we can
|
|
|
// assume that the child is current. This happens when we bailout on low
|
|
|
// priority: the bailed out fiber's child reuses the current child.
|
|
|
|
|
|
|
|
|
if (parentA.child === parentB.child) {
|
|
|
var child = parentA.child;
|
|
|
|
|
|
while (child) {
|
|
|
if (child === a) {
|
|
|
// We've determined that A is the current branch.
|
|
|
assertIsMounted(parentA);
|
|
|
return fiber;
|
|
|
}
|
|
|
|
|
|
if (child === b) {
|
|
|
// We've determined that B is the current branch.
|
|
|
assertIsMounted(parentA);
|
|
|
return alternate;
|
|
|
}
|
|
|
|
|
|
child = child.sibling;
|
|
|
} // We should never have an alternate for any mounting node. So the only
|
|
|
// way this could possibly happen is if this was unmounted, if at all.
|
|
|
|
|
|
|
|
|
throw new Error('Unable to find node on an unmounted component.');
|
|
|
}
|
|
|
|
|
|
if (a.return !== b.return) {
|
|
|
// The return pointer of A and the return pointer of B point to different
|
|
|
// fibers. We assume that return pointers never criss-cross, so A must
|
|
|
// belong to the child set of A.return, and B must belong to the child
|
|
|
// set of B.return.
|
|
|
a = parentA;
|
|
|
b = parentB;
|
|
|
} else {
|
|
|
// The return pointers point to the same fiber. We'll have to use the
|
|
|
// default, slow path: scan the child sets of each parent alternate to see
|
|
|
// which child belongs to which set.
|
|
|
//
|
|
|
// Search parent A's child set
|
|
|
var didFindChild = false;
|
|
|
var _child = parentA.child;
|
|
|
|
|
|
while (_child) {
|
|
|
if (_child === a) {
|
|
|
didFindChild = true;
|
|
|
a = parentA;
|
|
|
b = parentB;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (_child === b) {
|
|
|
didFindChild = true;
|
|
|
b = parentA;
|
|
|
a = parentB;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
_child = _child.sibling;
|
|
|
}
|
|
|
|
|
|
if (!didFindChild) {
|
|
|
// Search parent B's child set
|
|
|
_child = parentB.child;
|
|
|
|
|
|
while (_child) {
|
|
|
if (_child === a) {
|
|
|
didFindChild = true;
|
|
|
a = parentB;
|
|
|
b = parentA;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (_child === b) {
|
|
|
didFindChild = true;
|
|
|
b = parentB;
|
|
|
a = parentA;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
_child = _child.sibling;
|
|
|
}
|
|
|
|
|
|
if (!didFindChild) {
|
|
|
throw new Error('Child was not found in either parent set. This indicates a bug ' + 'in React related to the return pointer. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (a.alternate !== b) {
|
|
|
throw new Error("Return fibers should always be each others' alternates. " + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
} // If the root is not a host container, we're in a disconnected tree. I.e.
|
|
|
// unmounted.
|
|
|
|
|
|
|
|
|
if (a.tag !== HostRoot) {
|
|
|
throw new Error('Unable to find node on an unmounted component.');
|
|
|
}
|
|
|
|
|
|
if (a.stateNode.current === a) {
|
|
|
// We've determined that A is the current branch.
|
|
|
return fiber;
|
|
|
} // Otherwise B has to be current branch.
|
|
|
|
|
|
|
|
|
return alternate;
|
|
|
}
|
|
|
function findCurrentHostFiber(parent) {
|
|
|
var currentParent = findCurrentFiberUsingSlowPath(parent);
|
|
|
return currentParent !== null ? findCurrentHostFiberImpl(currentParent) : null;
|
|
|
}
|
|
|
|
|
|
function findCurrentHostFiberImpl(node) {
|
|
|
// Next we'll drill down this component to find the first HostComponent/Text.
|
|
|
if (node.tag === HostComponent || node.tag === HostText) {
|
|
|
return node;
|
|
|
}
|
|
|
|
|
|
var child = node.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
var match = findCurrentHostFiberImpl(child);
|
|
|
|
|
|
if (match !== null) {
|
|
|
return match;
|
|
|
}
|
|
|
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function findCurrentHostFiberWithNoPortals(parent) {
|
|
|
var currentParent = findCurrentFiberUsingSlowPath(parent);
|
|
|
return currentParent !== null ? findCurrentHostFiberWithNoPortalsImpl(currentParent) : null;
|
|
|
}
|
|
|
|
|
|
function findCurrentHostFiberWithNoPortalsImpl(node) {
|
|
|
// Next we'll drill down this component to find the first HostComponent/Text.
|
|
|
if (node.tag === HostComponent || node.tag === HostText) {
|
|
|
return node;
|
|
|
}
|
|
|
|
|
|
var child = node.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
if (child.tag !== HostPortal) {
|
|
|
var match = findCurrentHostFiberWithNoPortalsImpl(child);
|
|
|
|
|
|
if (match !== null) {
|
|
|
return match;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
// This module only exists as an ESM wrapper around the external CommonJS
|
|
|
var scheduleCallback = Scheduler.unstable_scheduleCallback;
|
|
|
var cancelCallback = Scheduler.unstable_cancelCallback;
|
|
|
var shouldYield = Scheduler.unstable_shouldYield;
|
|
|
var requestPaint = Scheduler.unstable_requestPaint;
|
|
|
var now = Scheduler.unstable_now;
|
|
|
var getCurrentPriorityLevel = Scheduler.unstable_getCurrentPriorityLevel;
|
|
|
var ImmediatePriority = Scheduler.unstable_ImmediatePriority;
|
|
|
var UserBlockingPriority = Scheduler.unstable_UserBlockingPriority;
|
|
|
var NormalPriority = Scheduler.unstable_NormalPriority;
|
|
|
var LowPriority = Scheduler.unstable_LowPriority;
|
|
|
var IdlePriority = Scheduler.unstable_IdlePriority;
|
|
|
// this doesn't actually exist on the scheduler, but it *does*
|
|
|
// on scheduler/unstable_mock, which we'll need for internal testing
|
|
|
var unstable_yieldValue = Scheduler.unstable_yieldValue;
|
|
|
var unstable_setDisableYieldValue = Scheduler.unstable_setDisableYieldValue;
|
|
|
|
|
|
var rendererID = null;
|
|
|
var injectedHook = null;
|
|
|
var injectedProfilingHooks = null;
|
|
|
var hasLoggedError = false;
|
|
|
var isDevToolsPresent = typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined';
|
|
|
function injectInternals(internals) {
|
|
|
if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') {
|
|
|
// No DevTools
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var hook = __REACT_DEVTOOLS_GLOBAL_HOOK__;
|
|
|
|
|
|
if (hook.isDisabled) {
|
|
|
// This isn't a real property on the hook, but it can be set to opt out
|
|
|
// of DevTools integration and associated warnings and logs.
|
|
|
// https://github.com/facebook/react/issues/3877
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (!hook.supportsFiber) {
|
|
|
{
|
|
|
error('The installed version of React DevTools is too old and will not work ' + 'with the current version of React. Please update React DevTools. ' + 'https://reactjs.org/link/react-devtools');
|
|
|
} // DevTools exists, even though it doesn't support Fiber.
|
|
|
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
if (enableSchedulingProfiler) {
|
|
|
// Conditionally inject these hooks only if Timeline profiler is supported by this build.
|
|
|
// This gives DevTools a way to feature detect that isn't tied to version number
|
|
|
// (since profiling and timeline are controlled by different feature flags).
|
|
|
internals = assign({}, internals, {
|
|
|
getLaneLabelMap: getLaneLabelMap,
|
|
|
injectProfilingHooks: injectProfilingHooks
|
|
|
});
|
|
|
}
|
|
|
|
|
|
rendererID = hook.inject(internals); // We have successfully injected, so now it is safe to set up hooks.
|
|
|
|
|
|
injectedHook = hook;
|
|
|
} catch (err) {
|
|
|
// Catch all errors because it is unsafe to throw during initialization.
|
|
|
{
|
|
|
error('React instrumentation encountered an error: %s.', err);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (hook.checkDCE) {
|
|
|
// This is the real DevTools.
|
|
|
return true;
|
|
|
} else {
|
|
|
// This is likely a hook installed by Fast Refresh runtime.
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
function onScheduleRoot(root, children) {
|
|
|
{
|
|
|
if (injectedHook && typeof injectedHook.onScheduleFiberRoot === 'function') {
|
|
|
try {
|
|
|
injectedHook.onScheduleFiberRoot(rendererID, root, children);
|
|
|
} catch (err) {
|
|
|
if ( !hasLoggedError) {
|
|
|
hasLoggedError = true;
|
|
|
|
|
|
error('React instrumentation encountered an error: %s', err);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function onCommitRoot(root, eventPriority) {
|
|
|
if (injectedHook && typeof injectedHook.onCommitFiberRoot === 'function') {
|
|
|
try {
|
|
|
var didError = (root.current.flags & DidCapture) === DidCapture;
|
|
|
|
|
|
if (enableProfilerTimer) {
|
|
|
var schedulerPriority;
|
|
|
|
|
|
switch (eventPriority) {
|
|
|
case DiscreteEventPriority:
|
|
|
schedulerPriority = ImmediatePriority;
|
|
|
break;
|
|
|
|
|
|
case ContinuousEventPriority:
|
|
|
schedulerPriority = UserBlockingPriority;
|
|
|
break;
|
|
|
|
|
|
case DefaultEventPriority:
|
|
|
schedulerPriority = NormalPriority;
|
|
|
break;
|
|
|
|
|
|
case IdleEventPriority:
|
|
|
schedulerPriority = IdlePriority;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
schedulerPriority = NormalPriority;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
injectedHook.onCommitFiberRoot(rendererID, root, schedulerPriority, didError);
|
|
|
} else {
|
|
|
injectedHook.onCommitFiberRoot(rendererID, root, undefined, didError);
|
|
|
}
|
|
|
} catch (err) {
|
|
|
{
|
|
|
if (!hasLoggedError) {
|
|
|
hasLoggedError = true;
|
|
|
|
|
|
error('React instrumentation encountered an error: %s', err);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function onPostCommitRoot(root) {
|
|
|
if (injectedHook && typeof injectedHook.onPostCommitFiberRoot === 'function') {
|
|
|
try {
|
|
|
injectedHook.onPostCommitFiberRoot(rendererID, root);
|
|
|
} catch (err) {
|
|
|
{
|
|
|
if (!hasLoggedError) {
|
|
|
hasLoggedError = true;
|
|
|
|
|
|
error('React instrumentation encountered an error: %s', err);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function onCommitUnmount(fiber) {
|
|
|
if (injectedHook && typeof injectedHook.onCommitFiberUnmount === 'function') {
|
|
|
try {
|
|
|
injectedHook.onCommitFiberUnmount(rendererID, fiber);
|
|
|
} catch (err) {
|
|
|
{
|
|
|
if (!hasLoggedError) {
|
|
|
hasLoggedError = true;
|
|
|
|
|
|
error('React instrumentation encountered an error: %s', err);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function setIsStrictModeForDevtools(newIsStrictMode) {
|
|
|
{
|
|
|
if (typeof unstable_yieldValue === 'function') {
|
|
|
// We're in a test because Scheduler.unstable_yieldValue only exists
|
|
|
// in SchedulerMock. To reduce the noise in strict mode tests,
|
|
|
// suppress warnings and disable scheduler yielding during the double render
|
|
|
unstable_setDisableYieldValue(newIsStrictMode);
|
|
|
setSuppressWarning(newIsStrictMode);
|
|
|
}
|
|
|
|
|
|
if (injectedHook && typeof injectedHook.setStrictMode === 'function') {
|
|
|
try {
|
|
|
injectedHook.setStrictMode(rendererID, newIsStrictMode);
|
|
|
} catch (err) {
|
|
|
{
|
|
|
if (!hasLoggedError) {
|
|
|
hasLoggedError = true;
|
|
|
|
|
|
error('React instrumentation encountered an error: %s', err);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} // Profiler API hooks
|
|
|
|
|
|
function injectProfilingHooks(profilingHooks) {
|
|
|
injectedProfilingHooks = profilingHooks;
|
|
|
}
|
|
|
|
|
|
function getLaneLabelMap() {
|
|
|
{
|
|
|
var map = new Map();
|
|
|
var lane = 1;
|
|
|
|
|
|
for (var index = 0; index < TotalLanes; index++) {
|
|
|
var label = getLabelForLane(lane);
|
|
|
map.set(lane, label);
|
|
|
lane *= 2;
|
|
|
}
|
|
|
|
|
|
return map;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function markCommitStarted(lanes) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markCommitStarted === 'function') {
|
|
|
injectedProfilingHooks.markCommitStarted(lanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markCommitStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markCommitStopped === 'function') {
|
|
|
injectedProfilingHooks.markCommitStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentRenderStarted(fiber) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentRenderStarted === 'function') {
|
|
|
injectedProfilingHooks.markComponentRenderStarted(fiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentRenderStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentRenderStopped === 'function') {
|
|
|
injectedProfilingHooks.markComponentRenderStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentPassiveEffectMountStarted(fiber) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectMountStarted === 'function') {
|
|
|
injectedProfilingHooks.markComponentPassiveEffectMountStarted(fiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentPassiveEffectMountStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectMountStopped === 'function') {
|
|
|
injectedProfilingHooks.markComponentPassiveEffectMountStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentPassiveEffectUnmountStarted(fiber) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectUnmountStarted === 'function') {
|
|
|
injectedProfilingHooks.markComponentPassiveEffectUnmountStarted(fiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentPassiveEffectUnmountStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectUnmountStopped === 'function') {
|
|
|
injectedProfilingHooks.markComponentPassiveEffectUnmountStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentLayoutEffectMountStarted(fiber) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectMountStarted === 'function') {
|
|
|
injectedProfilingHooks.markComponentLayoutEffectMountStarted(fiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentLayoutEffectMountStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectMountStopped === 'function') {
|
|
|
injectedProfilingHooks.markComponentLayoutEffectMountStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentLayoutEffectUnmountStarted(fiber) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectUnmountStarted === 'function') {
|
|
|
injectedProfilingHooks.markComponentLayoutEffectUnmountStarted(fiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentLayoutEffectUnmountStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectUnmountStopped === 'function') {
|
|
|
injectedProfilingHooks.markComponentLayoutEffectUnmountStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentErrored(fiber, thrownValue, lanes) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentErrored === 'function') {
|
|
|
injectedProfilingHooks.markComponentErrored(fiber, thrownValue, lanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markComponentSuspended(fiber, wakeable, lanes) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentSuspended === 'function') {
|
|
|
injectedProfilingHooks.markComponentSuspended(fiber, wakeable, lanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markLayoutEffectsStarted(lanes) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markLayoutEffectsStarted === 'function') {
|
|
|
injectedProfilingHooks.markLayoutEffectsStarted(lanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markLayoutEffectsStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markLayoutEffectsStopped === 'function') {
|
|
|
injectedProfilingHooks.markLayoutEffectsStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markPassiveEffectsStarted(lanes) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markPassiveEffectsStarted === 'function') {
|
|
|
injectedProfilingHooks.markPassiveEffectsStarted(lanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markPassiveEffectsStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markPassiveEffectsStopped === 'function') {
|
|
|
injectedProfilingHooks.markPassiveEffectsStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markRenderStarted(lanes) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderStarted === 'function') {
|
|
|
injectedProfilingHooks.markRenderStarted(lanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markRenderYielded() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderYielded === 'function') {
|
|
|
injectedProfilingHooks.markRenderYielded();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markRenderStopped() {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderStopped === 'function') {
|
|
|
injectedProfilingHooks.markRenderStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markRenderScheduled(lane) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderScheduled === 'function') {
|
|
|
injectedProfilingHooks.markRenderScheduled(lane);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markForceUpdateScheduled(fiber, lane) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markForceUpdateScheduled === 'function') {
|
|
|
injectedProfilingHooks.markForceUpdateScheduled(fiber, lane);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function markStateUpdateScheduled(fiber, lane) {
|
|
|
{
|
|
|
if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markStateUpdateScheduled === 'function') {
|
|
|
injectedProfilingHooks.markStateUpdateScheduled(fiber, lane);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var NoMode =
|
|
|
/* */
|
|
|
0; // TODO: Remove ConcurrentMode by reading from the root tag instead
|
|
|
|
|
|
var ConcurrentMode =
|
|
|
/* */
|
|
|
1;
|
|
|
var ProfileMode =
|
|
|
/* */
|
|
|
2;
|
|
|
var StrictLegacyMode =
|
|
|
/* */
|
|
|
8;
|
|
|
var StrictEffectsMode =
|
|
|
/* */
|
|
|
16;
|
|
|
|
|
|
// TODO: This is pretty well supported by browsers. Maybe we can drop it.
|
|
|
var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros.
|
|
|
// Based on:
|
|
|
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/clz32
|
|
|
|
|
|
var log = Math.log;
|
|
|
var LN2 = Math.LN2;
|
|
|
|
|
|
function clz32Fallback(x) {
|
|
|
var asUint = x >>> 0;
|
|
|
|
|
|
if (asUint === 0) {
|
|
|
return 32;
|
|
|
}
|
|
|
|
|
|
return 31 - (log(asUint) / LN2 | 0) | 0;
|
|
|
}
|
|
|
|
|
|
// If those values are changed that package should be rebuilt and redeployed.
|
|
|
|
|
|
var TotalLanes = 31;
|
|
|
var NoLanes =
|
|
|
/* */
|
|
|
0;
|
|
|
var NoLane =
|
|
|
/* */
|
|
|
0;
|
|
|
var SyncLane =
|
|
|
/* */
|
|
|
1;
|
|
|
var InputContinuousHydrationLane =
|
|
|
/* */
|
|
|
2;
|
|
|
var InputContinuousLane =
|
|
|
/* */
|
|
|
4;
|
|
|
var DefaultHydrationLane =
|
|
|
/* */
|
|
|
8;
|
|
|
var DefaultLane =
|
|
|
/* */
|
|
|
16;
|
|
|
var TransitionHydrationLane =
|
|
|
/* */
|
|
|
32;
|
|
|
var TransitionLanes =
|
|
|
/* */
|
|
|
4194240;
|
|
|
var TransitionLane1 =
|
|
|
/* */
|
|
|
64;
|
|
|
var TransitionLane2 =
|
|
|
/* */
|
|
|
128;
|
|
|
var TransitionLane3 =
|
|
|
/* */
|
|
|
256;
|
|
|
var TransitionLane4 =
|
|
|
/* */
|
|
|
512;
|
|
|
var TransitionLane5 =
|
|
|
/* */
|
|
|
1024;
|
|
|
var TransitionLane6 =
|
|
|
/* */
|
|
|
2048;
|
|
|
var TransitionLane7 =
|
|
|
/* */
|
|
|
4096;
|
|
|
var TransitionLane8 =
|
|
|
/* */
|
|
|
8192;
|
|
|
var TransitionLane9 =
|
|
|
/* */
|
|
|
16384;
|
|
|
var TransitionLane10 =
|
|
|
/* */
|
|
|
32768;
|
|
|
var TransitionLane11 =
|
|
|
/* */
|
|
|
65536;
|
|
|
var TransitionLane12 =
|
|
|
/* */
|
|
|
131072;
|
|
|
var TransitionLane13 =
|
|
|
/* */
|
|
|
262144;
|
|
|
var TransitionLane14 =
|
|
|
/* */
|
|
|
524288;
|
|
|
var TransitionLane15 =
|
|
|
/* */
|
|
|
1048576;
|
|
|
var TransitionLane16 =
|
|
|
/* */
|
|
|
2097152;
|
|
|
var RetryLanes =
|
|
|
/* */
|
|
|
130023424;
|
|
|
var RetryLane1 =
|
|
|
/* */
|
|
|
4194304;
|
|
|
var RetryLane2 =
|
|
|
/* */
|
|
|
8388608;
|
|
|
var RetryLane3 =
|
|
|
/* */
|
|
|
16777216;
|
|
|
var RetryLane4 =
|
|
|
/* */
|
|
|
33554432;
|
|
|
var RetryLane5 =
|
|
|
/* */
|
|
|
67108864;
|
|
|
var SomeRetryLane = RetryLane1;
|
|
|
var SelectiveHydrationLane =
|
|
|
/* */
|
|
|
134217728;
|
|
|
var NonIdleLanes =
|
|
|
/* */
|
|
|
268435455;
|
|
|
var IdleHydrationLane =
|
|
|
/* */
|
|
|
268435456;
|
|
|
var IdleLane =
|
|
|
/* */
|
|
|
536870912;
|
|
|
var OffscreenLane =
|
|
|
/* */
|
|
|
1073741824; // This function is used for the experimental timeline (react-devtools-timeline)
|
|
|
// It should be kept in sync with the Lanes values above.
|
|
|
|
|
|
function getLabelForLane(lane) {
|
|
|
{
|
|
|
if (lane & SyncLane) {
|
|
|
return 'Sync';
|
|
|
}
|
|
|
|
|
|
if (lane & InputContinuousHydrationLane) {
|
|
|
return 'InputContinuousHydration';
|
|
|
}
|
|
|
|
|
|
if (lane & InputContinuousLane) {
|
|
|
return 'InputContinuous';
|
|
|
}
|
|
|
|
|
|
if (lane & DefaultHydrationLane) {
|
|
|
return 'DefaultHydration';
|
|
|
}
|
|
|
|
|
|
if (lane & DefaultLane) {
|
|
|
return 'Default';
|
|
|
}
|
|
|
|
|
|
if (lane & TransitionHydrationLane) {
|
|
|
return 'TransitionHydration';
|
|
|
}
|
|
|
|
|
|
if (lane & TransitionLanes) {
|
|
|
return 'Transition';
|
|
|
}
|
|
|
|
|
|
if (lane & RetryLanes) {
|
|
|
return 'Retry';
|
|
|
}
|
|
|
|
|
|
if (lane & SelectiveHydrationLane) {
|
|
|
return 'SelectiveHydration';
|
|
|
}
|
|
|
|
|
|
if (lane & IdleHydrationLane) {
|
|
|
return 'IdleHydration';
|
|
|
}
|
|
|
|
|
|
if (lane & IdleLane) {
|
|
|
return 'Idle';
|
|
|
}
|
|
|
|
|
|
if (lane & OffscreenLane) {
|
|
|
return 'Offscreen';
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
var NoTimestamp = -1;
|
|
|
var nextTransitionLane = TransitionLane1;
|
|
|
var nextRetryLane = RetryLane1;
|
|
|
|
|
|
function getHighestPriorityLanes(lanes) {
|
|
|
switch (getHighestPriorityLane(lanes)) {
|
|
|
case SyncLane:
|
|
|
return SyncLane;
|
|
|
|
|
|
case InputContinuousHydrationLane:
|
|
|
return InputContinuousHydrationLane;
|
|
|
|
|
|
case InputContinuousLane:
|
|
|
return InputContinuousLane;
|
|
|
|
|
|
case DefaultHydrationLane:
|
|
|
return DefaultHydrationLane;
|
|
|
|
|
|
case DefaultLane:
|
|
|
return DefaultLane;
|
|
|
|
|
|
case TransitionHydrationLane:
|
|
|
return TransitionHydrationLane;
|
|
|
|
|
|
case TransitionLane1:
|
|
|
case TransitionLane2:
|
|
|
case TransitionLane3:
|
|
|
case TransitionLane4:
|
|
|
case TransitionLane5:
|
|
|
case TransitionLane6:
|
|
|
case TransitionLane7:
|
|
|
case TransitionLane8:
|
|
|
case TransitionLane9:
|
|
|
case TransitionLane10:
|
|
|
case TransitionLane11:
|
|
|
case TransitionLane12:
|
|
|
case TransitionLane13:
|
|
|
case TransitionLane14:
|
|
|
case TransitionLane15:
|
|
|
case TransitionLane16:
|
|
|
return lanes & TransitionLanes;
|
|
|
|
|
|
case RetryLane1:
|
|
|
case RetryLane2:
|
|
|
case RetryLane3:
|
|
|
case RetryLane4:
|
|
|
case RetryLane5:
|
|
|
return lanes & RetryLanes;
|
|
|
|
|
|
case SelectiveHydrationLane:
|
|
|
return SelectiveHydrationLane;
|
|
|
|
|
|
case IdleHydrationLane:
|
|
|
return IdleHydrationLane;
|
|
|
|
|
|
case IdleLane:
|
|
|
return IdleLane;
|
|
|
|
|
|
case OffscreenLane:
|
|
|
return OffscreenLane;
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
error('Should have found matching lanes. This is a bug in React.');
|
|
|
} // This shouldn't be reachable, but as a fallback, return the entire bitmask.
|
|
|
|
|
|
|
|
|
return lanes;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getNextLanes(root, wipLanes) {
|
|
|
// Early bailout if there's no pending work left.
|
|
|
var pendingLanes = root.pendingLanes;
|
|
|
|
|
|
if (pendingLanes === NoLanes) {
|
|
|
return NoLanes;
|
|
|
}
|
|
|
|
|
|
var nextLanes = NoLanes;
|
|
|
var suspendedLanes = root.suspendedLanes;
|
|
|
var pingedLanes = root.pingedLanes; // Do not work on any idle work until all the non-idle work has finished,
|
|
|
// even if the work is suspended.
|
|
|
|
|
|
var nonIdlePendingLanes = pendingLanes & NonIdleLanes;
|
|
|
|
|
|
if (nonIdlePendingLanes !== NoLanes) {
|
|
|
var nonIdleUnblockedLanes = nonIdlePendingLanes & ~suspendedLanes;
|
|
|
|
|
|
if (nonIdleUnblockedLanes !== NoLanes) {
|
|
|
nextLanes = getHighestPriorityLanes(nonIdleUnblockedLanes);
|
|
|
} else {
|
|
|
var nonIdlePingedLanes = nonIdlePendingLanes & pingedLanes;
|
|
|
|
|
|
if (nonIdlePingedLanes !== NoLanes) {
|
|
|
nextLanes = getHighestPriorityLanes(nonIdlePingedLanes);
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
// The only remaining work is Idle.
|
|
|
var unblockedLanes = pendingLanes & ~suspendedLanes;
|
|
|
|
|
|
if (unblockedLanes !== NoLanes) {
|
|
|
nextLanes = getHighestPriorityLanes(unblockedLanes);
|
|
|
} else {
|
|
|
if (pingedLanes !== NoLanes) {
|
|
|
nextLanes = getHighestPriorityLanes(pingedLanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (nextLanes === NoLanes) {
|
|
|
// This should only be reachable if we're suspended
|
|
|
// TODO: Consider warning in this path if a fallback timer is not scheduled.
|
|
|
return NoLanes;
|
|
|
} // If we're already in the middle of a render, switching lanes will interrupt
|
|
|
// it and we'll lose our progress. We should only do this if the new lanes are
|
|
|
// higher priority.
|
|
|
|
|
|
|
|
|
if (wipLanes !== NoLanes && wipLanes !== nextLanes && // If we already suspended with a delay, then interrupting is fine. Don't
|
|
|
// bother waiting until the root is complete.
|
|
|
(wipLanes & suspendedLanes) === NoLanes) {
|
|
|
var nextLane = getHighestPriorityLane(nextLanes);
|
|
|
var wipLane = getHighestPriorityLane(wipLanes);
|
|
|
|
|
|
if ( // Tests whether the next lane is equal or lower priority than the wip
|
|
|
// one. This works because the bits decrease in priority as you go left.
|
|
|
nextLane >= wipLane || // Default priority updates should not interrupt transition updates. The
|
|
|
// only difference between default updates and transition updates is that
|
|
|
// default updates do not support refresh transitions.
|
|
|
nextLane === DefaultLane && (wipLane & TransitionLanes) !== NoLanes) {
|
|
|
// Keep working on the existing in-progress tree. Do not interrupt.
|
|
|
return wipLanes;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ((nextLanes & InputContinuousLane) !== NoLanes) {
|
|
|
// When updates are sync by default, we entangle continuous priority updates
|
|
|
// and default updates, so they render in the same batch. The only reason
|
|
|
// they use separate lanes is because continuous updates should interrupt
|
|
|
// transitions, but default updates should not.
|
|
|
nextLanes |= pendingLanes & DefaultLane;
|
|
|
} // Check for entangled lanes and add them to the batch.
|
|
|
//
|
|
|
// A lane is said to be entangled with another when it's not allowed to render
|
|
|
// in a batch that does not also include the other lane. Typically we do this
|
|
|
// when multiple updates have the same source, and we only want to respond to
|
|
|
// the most recent event from that source.
|
|
|
//
|
|
|
// Note that we apply entanglements *after* checking for partial work above.
|
|
|
// This means that if a lane is entangled during an interleaved event while
|
|
|
// it's already rendering, we won't interrupt it. This is intentional, since
|
|
|
// entanglement is usually "best effort": we'll try our best to render the
|
|
|
// lanes in the same batch, but it's not worth throwing out partially
|
|
|
// completed work in order to do it.
|
|
|
// TODO: Reconsider this. The counter-argument is that the partial work
|
|
|
// represents an intermediate state, which we don't want to show to the user.
|
|
|
// And by spending extra time finishing it, we're increasing the amount of
|
|
|
// time it takes to show the final state, which is what they are actually
|
|
|
// waiting for.
|
|
|
//
|
|
|
// For those exceptions where entanglement is semantically important, like
|
|
|
// useMutableSource, we should ensure that there is no partial work at the
|
|
|
// time we apply the entanglement.
|
|
|
|
|
|
|
|
|
var entangledLanes = root.entangledLanes;
|
|
|
|
|
|
if (entangledLanes !== NoLanes) {
|
|
|
var entanglements = root.entanglements;
|
|
|
var lanes = nextLanes & entangledLanes;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = pickArbitraryLaneIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
nextLanes |= entanglements[index];
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return nextLanes;
|
|
|
}
|
|
|
function getMostRecentEventTime(root, lanes) {
|
|
|
var eventTimes = root.eventTimes;
|
|
|
var mostRecentEventTime = NoTimestamp;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = pickArbitraryLaneIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
var eventTime = eventTimes[index];
|
|
|
|
|
|
if (eventTime > mostRecentEventTime) {
|
|
|
mostRecentEventTime = eventTime;
|
|
|
}
|
|
|
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
|
|
|
return mostRecentEventTime;
|
|
|
}
|
|
|
|
|
|
function computeExpirationTime(lane, currentTime) {
|
|
|
switch (lane) {
|
|
|
case SyncLane:
|
|
|
case InputContinuousHydrationLane:
|
|
|
case InputContinuousLane:
|
|
|
// User interactions should expire slightly more quickly.
|
|
|
//
|
|
|
// NOTE: This is set to the corresponding constant as in Scheduler.js.
|
|
|
// When we made it larger, a product metric in www regressed, suggesting
|
|
|
// there's a user interaction that's being starved by a series of
|
|
|
// synchronous updates. If that theory is correct, the proper solution is
|
|
|
// to fix the starvation. However, this scenario supports the idea that
|
|
|
// expiration times are an important safeguard when starvation
|
|
|
// does happen.
|
|
|
return currentTime + 250;
|
|
|
|
|
|
case DefaultHydrationLane:
|
|
|
case DefaultLane:
|
|
|
case TransitionHydrationLane:
|
|
|
case TransitionLane1:
|
|
|
case TransitionLane2:
|
|
|
case TransitionLane3:
|
|
|
case TransitionLane4:
|
|
|
case TransitionLane5:
|
|
|
case TransitionLane6:
|
|
|
case TransitionLane7:
|
|
|
case TransitionLane8:
|
|
|
case TransitionLane9:
|
|
|
case TransitionLane10:
|
|
|
case TransitionLane11:
|
|
|
case TransitionLane12:
|
|
|
case TransitionLane13:
|
|
|
case TransitionLane14:
|
|
|
case TransitionLane15:
|
|
|
case TransitionLane16:
|
|
|
return currentTime + 5000;
|
|
|
|
|
|
case RetryLane1:
|
|
|
case RetryLane2:
|
|
|
case RetryLane3:
|
|
|
case RetryLane4:
|
|
|
case RetryLane5:
|
|
|
// TODO: Retries should be allowed to expire if they are CPU bound for
|
|
|
// too long, but when I made this change it caused a spike in browser
|
|
|
// crashes. There must be some other underlying bug; not super urgent but
|
|
|
// ideally should figure out why and fix it. Unfortunately we don't have
|
|
|
// a repro for the crashes, only detected via production metrics.
|
|
|
return NoTimestamp;
|
|
|
|
|
|
case SelectiveHydrationLane:
|
|
|
case IdleHydrationLane:
|
|
|
case IdleLane:
|
|
|
case OffscreenLane:
|
|
|
// Anything idle priority or lower should never expire.
|
|
|
return NoTimestamp;
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
error('Should have found matching lanes. This is a bug in React.');
|
|
|
}
|
|
|
|
|
|
return NoTimestamp;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function markStarvedLanesAsExpired(root, currentTime) {
|
|
|
// TODO: This gets called every time we yield. We can optimize by storing
|
|
|
// the earliest expiration time on the root. Then use that to quickly bail out
|
|
|
// of this function.
|
|
|
var pendingLanes = root.pendingLanes;
|
|
|
var suspendedLanes = root.suspendedLanes;
|
|
|
var pingedLanes = root.pingedLanes;
|
|
|
var expirationTimes = root.expirationTimes; // Iterate through the pending lanes and check if we've reached their
|
|
|
// expiration time. If so, we'll assume the update is being starved and mark
|
|
|
// it as expired to force it to finish.
|
|
|
|
|
|
var lanes = pendingLanes;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = pickArbitraryLaneIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
var expirationTime = expirationTimes[index];
|
|
|
|
|
|
if (expirationTime === NoTimestamp) {
|
|
|
// Found a pending lane with no expiration time. If it's not suspended, or
|
|
|
// if it's pinged, assume it's CPU-bound. Compute a new expiration time
|
|
|
// using the current time.
|
|
|
if ((lane & suspendedLanes) === NoLanes || (lane & pingedLanes) !== NoLanes) {
|
|
|
// Assumes timestamps are monotonically increasing.
|
|
|
expirationTimes[index] = computeExpirationTime(lane, currentTime);
|
|
|
}
|
|
|
} else if (expirationTime <= currentTime) {
|
|
|
// This lane expired
|
|
|
root.expiredLanes |= lane;
|
|
|
}
|
|
|
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
} // This returns the highest priority pending lanes regardless of whether they
|
|
|
// are suspended.
|
|
|
|
|
|
function getHighestPriorityPendingLanes(root) {
|
|
|
return getHighestPriorityLanes(root.pendingLanes);
|
|
|
}
|
|
|
function getLanesToRetrySynchronouslyOnError(root) {
|
|
|
var everythingButOffscreen = root.pendingLanes & ~OffscreenLane;
|
|
|
|
|
|
if (everythingButOffscreen !== NoLanes) {
|
|
|
return everythingButOffscreen;
|
|
|
}
|
|
|
|
|
|
if (everythingButOffscreen & OffscreenLane) {
|
|
|
return OffscreenLane;
|
|
|
}
|
|
|
|
|
|
return NoLanes;
|
|
|
}
|
|
|
function includesSyncLane(lanes) {
|
|
|
return (lanes & SyncLane) !== NoLanes;
|
|
|
}
|
|
|
function includesNonIdleWork(lanes) {
|
|
|
return (lanes & NonIdleLanes) !== NoLanes;
|
|
|
}
|
|
|
function includesOnlyRetries(lanes) {
|
|
|
return (lanes & RetryLanes) === lanes;
|
|
|
}
|
|
|
function includesOnlyNonUrgentLanes(lanes) {
|
|
|
var UrgentLanes = SyncLane | InputContinuousLane | DefaultLane;
|
|
|
return (lanes & UrgentLanes) === NoLanes;
|
|
|
}
|
|
|
function includesOnlyTransitions(lanes) {
|
|
|
return (lanes & TransitionLanes) === lanes;
|
|
|
}
|
|
|
function includesBlockingLane(root, lanes) {
|
|
|
|
|
|
var SyncDefaultLanes = InputContinuousHydrationLane | InputContinuousLane | DefaultHydrationLane | DefaultLane;
|
|
|
return (lanes & SyncDefaultLanes) !== NoLanes;
|
|
|
}
|
|
|
function includesExpiredLane(root, lanes) {
|
|
|
// This is a separate check from includesBlockingLane because a lane can
|
|
|
// expire after a render has already started.
|
|
|
return (lanes & root.expiredLanes) !== NoLanes;
|
|
|
}
|
|
|
function isTransitionLane(lane) {
|
|
|
return (lane & TransitionLanes) !== NoLanes;
|
|
|
}
|
|
|
function claimNextTransitionLane() {
|
|
|
// Cycle through the lanes, assigning each new transition to the next lane.
|
|
|
// In most cases, this means every transition gets its own lane, until we
|
|
|
// run out of lanes and cycle back to the beginning.
|
|
|
var lane = nextTransitionLane;
|
|
|
nextTransitionLane <<= 1;
|
|
|
|
|
|
if ((nextTransitionLane & TransitionLanes) === NoLanes) {
|
|
|
nextTransitionLane = TransitionLane1;
|
|
|
}
|
|
|
|
|
|
return lane;
|
|
|
}
|
|
|
function claimNextRetryLane() {
|
|
|
var lane = nextRetryLane;
|
|
|
nextRetryLane <<= 1;
|
|
|
|
|
|
if ((nextRetryLane & RetryLanes) === NoLanes) {
|
|
|
nextRetryLane = RetryLane1;
|
|
|
}
|
|
|
|
|
|
return lane;
|
|
|
}
|
|
|
function getHighestPriorityLane(lanes) {
|
|
|
return lanes & -lanes;
|
|
|
}
|
|
|
function pickArbitraryLane(lanes) {
|
|
|
// This wrapper function gets inlined. Only exists so to communicate that it
|
|
|
// doesn't matter which bit is selected; you can pick any bit without
|
|
|
// affecting the algorithms where its used. Here I'm using
|
|
|
// getHighestPriorityLane because it requires the fewest operations.
|
|
|
return getHighestPriorityLane(lanes);
|
|
|
}
|
|
|
|
|
|
function pickArbitraryLaneIndex(lanes) {
|
|
|
return 31 - clz32(lanes);
|
|
|
}
|
|
|
|
|
|
function laneToIndex(lane) {
|
|
|
return pickArbitraryLaneIndex(lane);
|
|
|
}
|
|
|
|
|
|
function includesSomeLane(a, b) {
|
|
|
return (a & b) !== NoLanes;
|
|
|
}
|
|
|
function isSubsetOfLanes(set, subset) {
|
|
|
return (set & subset) === subset;
|
|
|
}
|
|
|
function mergeLanes(a, b) {
|
|
|
return a | b;
|
|
|
}
|
|
|
function removeLanes(set, subset) {
|
|
|
return set & ~subset;
|
|
|
}
|
|
|
function intersectLanes(a, b) {
|
|
|
return a & b;
|
|
|
} // Seems redundant, but it changes the type from a single lane (used for
|
|
|
// updates) to a group of lanes (used for flushing work).
|
|
|
|
|
|
function laneToLanes(lane) {
|
|
|
return lane;
|
|
|
}
|
|
|
function higherPriorityLane(a, b) {
|
|
|
// This works because the bit ranges decrease in priority as you go left.
|
|
|
return a !== NoLane && a < b ? a : b;
|
|
|
}
|
|
|
function createLaneMap(initial) {
|
|
|
// Intentionally pushing one by one.
|
|
|
// https://v8.dev/blog/elements-kinds#avoid-creating-holes
|
|
|
var laneMap = [];
|
|
|
|
|
|
for (var i = 0; i < TotalLanes; i++) {
|
|
|
laneMap.push(initial);
|
|
|
}
|
|
|
|
|
|
return laneMap;
|
|
|
}
|
|
|
function markRootUpdated(root, updateLane, eventTime) {
|
|
|
root.pendingLanes |= updateLane; // If there are any suspended transitions, it's possible this new update
|
|
|
// could unblock them. Clear the suspended lanes so that we can try rendering
|
|
|
// them again.
|
|
|
//
|
|
|
// TODO: We really only need to unsuspend only lanes that are in the
|
|
|
// `subtreeLanes` of the updated fiber, or the update lanes of the return
|
|
|
// path. This would exclude suspended updates in an unrelated sibling tree,
|
|
|
// since there's no way for this update to unblock it.
|
|
|
//
|
|
|
// We don't do this if the incoming update is idle, because we never process
|
|
|
// idle updates until after all the regular updates have finished; there's no
|
|
|
// way it could unblock a transition.
|
|
|
|
|
|
if (updateLane !== IdleLane) {
|
|
|
root.suspendedLanes = NoLanes;
|
|
|
root.pingedLanes = NoLanes;
|
|
|
}
|
|
|
|
|
|
var eventTimes = root.eventTimes;
|
|
|
var index = laneToIndex(updateLane); // We can always overwrite an existing timestamp because we prefer the most
|
|
|
// recent event, and we assume time is monotonically increasing.
|
|
|
|
|
|
eventTimes[index] = eventTime;
|
|
|
}
|
|
|
function markRootSuspended(root, suspendedLanes) {
|
|
|
root.suspendedLanes |= suspendedLanes;
|
|
|
root.pingedLanes &= ~suspendedLanes; // The suspended lanes are no longer CPU-bound. Clear their expiration times.
|
|
|
|
|
|
var expirationTimes = root.expirationTimes;
|
|
|
var lanes = suspendedLanes;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = pickArbitraryLaneIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
expirationTimes[index] = NoTimestamp;
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
}
|
|
|
function markRootPinged(root, pingedLanes, eventTime) {
|
|
|
root.pingedLanes |= root.suspendedLanes & pingedLanes;
|
|
|
}
|
|
|
function markRootFinished(root, remainingLanes) {
|
|
|
var noLongerPendingLanes = root.pendingLanes & ~remainingLanes;
|
|
|
root.pendingLanes = remainingLanes; // Let's try everything again
|
|
|
|
|
|
root.suspendedLanes = NoLanes;
|
|
|
root.pingedLanes = NoLanes;
|
|
|
root.expiredLanes &= remainingLanes;
|
|
|
root.mutableReadLanes &= remainingLanes;
|
|
|
root.entangledLanes &= remainingLanes;
|
|
|
var entanglements = root.entanglements;
|
|
|
var eventTimes = root.eventTimes;
|
|
|
var expirationTimes = root.expirationTimes; // Clear the lanes that no longer have pending work
|
|
|
|
|
|
var lanes = noLongerPendingLanes;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = pickArbitraryLaneIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
entanglements[index] = NoLanes;
|
|
|
eventTimes[index] = NoTimestamp;
|
|
|
expirationTimes[index] = NoTimestamp;
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
}
|
|
|
function markRootEntangled(root, entangledLanes) {
|
|
|
// In addition to entangling each of the given lanes with each other, we also
|
|
|
// have to consider _transitive_ entanglements. For each lane that is already
|
|
|
// entangled with *any* of the given lanes, that lane is now transitively
|
|
|
// entangled with *all* the given lanes.
|
|
|
//
|
|
|
// Translated: If C is entangled with A, then entangling A with B also
|
|
|
// entangles C with B.
|
|
|
//
|
|
|
// If this is hard to grasp, it might help to intentionally break this
|
|
|
// function and look at the tests that fail in ReactTransition-test.js. Try
|
|
|
// commenting out one of the conditions below.
|
|
|
var rootEntangledLanes = root.entangledLanes |= entangledLanes;
|
|
|
var entanglements = root.entanglements;
|
|
|
var lanes = rootEntangledLanes;
|
|
|
|
|
|
while (lanes) {
|
|
|
var index = pickArbitraryLaneIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
|
|
|
if ( // Is this one of the newly entangled lanes?
|
|
|
lane & entangledLanes | // Is this lane transitively entangled with the newly entangled lanes?
|
|
|
entanglements[index] & entangledLanes) {
|
|
|
entanglements[index] |= entangledLanes;
|
|
|
}
|
|
|
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
}
|
|
|
function getBumpedLaneForHydration(root, renderLanes) {
|
|
|
var renderLane = getHighestPriorityLane(renderLanes);
|
|
|
var lane;
|
|
|
|
|
|
switch (renderLane) {
|
|
|
case InputContinuousLane:
|
|
|
lane = InputContinuousHydrationLane;
|
|
|
break;
|
|
|
|
|
|
case DefaultLane:
|
|
|
lane = DefaultHydrationLane;
|
|
|
break;
|
|
|
|
|
|
case TransitionLane1:
|
|
|
case TransitionLane2:
|
|
|
case TransitionLane3:
|
|
|
case TransitionLane4:
|
|
|
case TransitionLane5:
|
|
|
case TransitionLane6:
|
|
|
case TransitionLane7:
|
|
|
case TransitionLane8:
|
|
|
case TransitionLane9:
|
|
|
case TransitionLane10:
|
|
|
case TransitionLane11:
|
|
|
case TransitionLane12:
|
|
|
case TransitionLane13:
|
|
|
case TransitionLane14:
|
|
|
case TransitionLane15:
|
|
|
case TransitionLane16:
|
|
|
case RetryLane1:
|
|
|
case RetryLane2:
|
|
|
case RetryLane3:
|
|
|
case RetryLane4:
|
|
|
case RetryLane5:
|
|
|
lane = TransitionHydrationLane;
|
|
|
break;
|
|
|
|
|
|
case IdleLane:
|
|
|
lane = IdleHydrationLane;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
// Everything else is already either a hydration lane, or shouldn't
|
|
|
// be retried at a hydration lane.
|
|
|
lane = NoLane;
|
|
|
break;
|
|
|
} // Check if the lane we chose is suspended. If so, that indicates that we
|
|
|
// already attempted and failed to hydrate at that level. Also check if we're
|
|
|
// already rendering that lane, which is rare but could happen.
|
|
|
|
|
|
|
|
|
if ((lane & (root.suspendedLanes | renderLanes)) !== NoLane) {
|
|
|
// Give up trying to hydrate and fall back to client render.
|
|
|
return NoLane;
|
|
|
}
|
|
|
|
|
|
return lane;
|
|
|
}
|
|
|
function addFiberToLanesMap(root, fiber, lanes) {
|
|
|
|
|
|
if (!isDevToolsPresent) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var pendingUpdatersLaneMap = root.pendingUpdatersLaneMap;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = laneToIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
var updaters = pendingUpdatersLaneMap[index];
|
|
|
updaters.add(fiber);
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
}
|
|
|
function movePendingFibersToMemoized(root, lanes) {
|
|
|
|
|
|
if (!isDevToolsPresent) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var pendingUpdatersLaneMap = root.pendingUpdatersLaneMap;
|
|
|
var memoizedUpdaters = root.memoizedUpdaters;
|
|
|
|
|
|
while (lanes > 0) {
|
|
|
var index = laneToIndex(lanes);
|
|
|
var lane = 1 << index;
|
|
|
var updaters = pendingUpdatersLaneMap[index];
|
|
|
|
|
|
if (updaters.size > 0) {
|
|
|
updaters.forEach(function (fiber) {
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (alternate === null || !memoizedUpdaters.has(alternate)) {
|
|
|
memoizedUpdaters.add(fiber);
|
|
|
}
|
|
|
});
|
|
|
updaters.clear();
|
|
|
}
|
|
|
|
|
|
lanes &= ~lane;
|
|
|
}
|
|
|
}
|
|
|
function getTransitionsForLanes(root, lanes) {
|
|
|
{
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var DiscreteEventPriority = SyncLane;
|
|
|
var ContinuousEventPriority = InputContinuousLane;
|
|
|
var DefaultEventPriority = DefaultLane;
|
|
|
var IdleEventPriority = IdleLane;
|
|
|
var currentUpdatePriority = NoLane;
|
|
|
function getCurrentUpdatePriority() {
|
|
|
return currentUpdatePriority;
|
|
|
}
|
|
|
function setCurrentUpdatePriority(newPriority) {
|
|
|
currentUpdatePriority = newPriority;
|
|
|
}
|
|
|
function runWithPriority(priority, fn) {
|
|
|
var previousPriority = currentUpdatePriority;
|
|
|
|
|
|
try {
|
|
|
currentUpdatePriority = priority;
|
|
|
return fn();
|
|
|
} finally {
|
|
|
currentUpdatePriority = previousPriority;
|
|
|
}
|
|
|
}
|
|
|
function higherEventPriority(a, b) {
|
|
|
return a !== 0 && a < b ? a : b;
|
|
|
}
|
|
|
function lowerEventPriority(a, b) {
|
|
|
return a === 0 || a > b ? a : b;
|
|
|
}
|
|
|
function isHigherEventPriority(a, b) {
|
|
|
return a !== 0 && a < b;
|
|
|
}
|
|
|
function lanesToEventPriority(lanes) {
|
|
|
var lane = getHighestPriorityLane(lanes);
|
|
|
|
|
|
if (!isHigherEventPriority(DiscreteEventPriority, lane)) {
|
|
|
return DiscreteEventPriority;
|
|
|
}
|
|
|
|
|
|
if (!isHigherEventPriority(ContinuousEventPriority, lane)) {
|
|
|
return ContinuousEventPriority;
|
|
|
}
|
|
|
|
|
|
if (includesNonIdleWork(lane)) {
|
|
|
return DefaultEventPriority;
|
|
|
}
|
|
|
|
|
|
return IdleEventPriority;
|
|
|
}
|
|
|
|
|
|
// This is imported by the event replaying implementation in React DOM. It's
|
|
|
// in a separate file to break a circular dependency between the renderer and
|
|
|
// the reconciler.
|
|
|
function isRootDehydrated(root) {
|
|
|
var currentState = root.current.memoizedState;
|
|
|
return currentState.isDehydrated;
|
|
|
}
|
|
|
|
|
|
var _attemptSynchronousHydration;
|
|
|
|
|
|
function setAttemptSynchronousHydration(fn) {
|
|
|
_attemptSynchronousHydration = fn;
|
|
|
}
|
|
|
function attemptSynchronousHydration(fiber) {
|
|
|
_attemptSynchronousHydration(fiber);
|
|
|
}
|
|
|
var attemptContinuousHydration;
|
|
|
function setAttemptContinuousHydration(fn) {
|
|
|
attemptContinuousHydration = fn;
|
|
|
}
|
|
|
var attemptHydrationAtCurrentPriority;
|
|
|
function setAttemptHydrationAtCurrentPriority(fn) {
|
|
|
attemptHydrationAtCurrentPriority = fn;
|
|
|
}
|
|
|
var getCurrentUpdatePriority$1;
|
|
|
function setGetCurrentUpdatePriority(fn) {
|
|
|
getCurrentUpdatePriority$1 = fn;
|
|
|
}
|
|
|
var attemptHydrationAtPriority;
|
|
|
function setAttemptHydrationAtPriority(fn) {
|
|
|
attemptHydrationAtPriority = fn;
|
|
|
} // TODO: Upgrade this definition once we're on a newer version of Flow that
|
|
|
// has this definition built-in.
|
|
|
|
|
|
var hasScheduledReplayAttempt = false; // The queue of discrete events to be replayed.
|
|
|
|
|
|
var queuedDiscreteEvents = []; // Indicates if any continuous event targets are non-null for early bailout.
|
|
|
// if the last target was dehydrated.
|
|
|
|
|
|
var queuedFocus = null;
|
|
|
var queuedDrag = null;
|
|
|
var queuedMouse = null; // For pointer events there can be one latest event per pointerId.
|
|
|
|
|
|
var queuedPointers = new Map();
|
|
|
var queuedPointerCaptures = new Map(); // We could consider replaying selectionchange and touchmoves too.
|
|
|
|
|
|
var queuedExplicitHydrationTargets = [];
|
|
|
var discreteReplayableEvents = ['mousedown', 'mouseup', 'touchcancel', 'touchend', 'touchstart', 'auxclick', 'dblclick', 'pointercancel', 'pointerdown', 'pointerup', 'dragend', 'dragstart', 'drop', 'compositionend', 'compositionstart', 'keydown', 'keypress', 'keyup', 'input', 'textInput', // Intentionally camelCase
|
|
|
'copy', 'cut', 'paste', 'click', 'change', 'contextmenu', 'reset', 'submit'];
|
|
|
function isDiscreteEventThatRequiresHydration(eventType) {
|
|
|
return discreteReplayableEvents.indexOf(eventType) > -1;
|
|
|
}
|
|
|
|
|
|
function createQueuedReplayableEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) {
|
|
|
return {
|
|
|
blockedOn: blockedOn,
|
|
|
domEventName: domEventName,
|
|
|
eventSystemFlags: eventSystemFlags,
|
|
|
nativeEvent: nativeEvent,
|
|
|
targetContainers: [targetContainer]
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function clearIfContinuousEvent(domEventName, nativeEvent) {
|
|
|
switch (domEventName) {
|
|
|
case 'focusin':
|
|
|
case 'focusout':
|
|
|
queuedFocus = null;
|
|
|
break;
|
|
|
|
|
|
case 'dragenter':
|
|
|
case 'dragleave':
|
|
|
queuedDrag = null;
|
|
|
break;
|
|
|
|
|
|
case 'mouseover':
|
|
|
case 'mouseout':
|
|
|
queuedMouse = null;
|
|
|
break;
|
|
|
|
|
|
case 'pointerover':
|
|
|
case 'pointerout':
|
|
|
{
|
|
|
var pointerId = nativeEvent.pointerId;
|
|
|
queuedPointers.delete(pointerId);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case 'gotpointercapture':
|
|
|
case 'lostpointercapture':
|
|
|
{
|
|
|
var _pointerId = nativeEvent.pointerId;
|
|
|
queuedPointerCaptures.delete(_pointerId);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function accumulateOrCreateContinuousQueuedReplayableEvent(existingQueuedEvent, blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) {
|
|
|
if (existingQueuedEvent === null || existingQueuedEvent.nativeEvent !== nativeEvent) {
|
|
|
var queuedEvent = createQueuedReplayableEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent);
|
|
|
|
|
|
if (blockedOn !== null) {
|
|
|
var _fiber2 = getInstanceFromNode(blockedOn);
|
|
|
|
|
|
if (_fiber2 !== null) {
|
|
|
// Attempt to increase the priority of this target.
|
|
|
attemptContinuousHydration(_fiber2);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return queuedEvent;
|
|
|
} // If we have already queued this exact event, then it's because
|
|
|
// the different event systems have different DOM event listeners.
|
|
|
// We can accumulate the flags, and the targetContainers, and
|
|
|
// store a single event to be replayed.
|
|
|
|
|
|
|
|
|
existingQueuedEvent.eventSystemFlags |= eventSystemFlags;
|
|
|
var targetContainers = existingQueuedEvent.targetContainers;
|
|
|
|
|
|
if (targetContainer !== null && targetContainers.indexOf(targetContainer) === -1) {
|
|
|
targetContainers.push(targetContainer);
|
|
|
}
|
|
|
|
|
|
return existingQueuedEvent;
|
|
|
}
|
|
|
|
|
|
function queueIfContinuousEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) {
|
|
|
// These set relatedTarget to null because the replayed event will be treated as if we
|
|
|
// moved from outside the window (no target) onto the target once it hydrates.
|
|
|
// Instead of mutating we could clone the event.
|
|
|
switch (domEventName) {
|
|
|
case 'focusin':
|
|
|
{
|
|
|
var focusEvent = nativeEvent;
|
|
|
queuedFocus = accumulateOrCreateContinuousQueuedReplayableEvent(queuedFocus, blockedOn, domEventName, eventSystemFlags, targetContainer, focusEvent);
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
case 'dragenter':
|
|
|
{
|
|
|
var dragEvent = nativeEvent;
|
|
|
queuedDrag = accumulateOrCreateContinuousQueuedReplayableEvent(queuedDrag, blockedOn, domEventName, eventSystemFlags, targetContainer, dragEvent);
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
case 'mouseover':
|
|
|
{
|
|
|
var mouseEvent = nativeEvent;
|
|
|
queuedMouse = accumulateOrCreateContinuousQueuedReplayableEvent(queuedMouse, blockedOn, domEventName, eventSystemFlags, targetContainer, mouseEvent);
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
case 'pointerover':
|
|
|
{
|
|
|
var pointerEvent = nativeEvent;
|
|
|
var pointerId = pointerEvent.pointerId;
|
|
|
queuedPointers.set(pointerId, accumulateOrCreateContinuousQueuedReplayableEvent(queuedPointers.get(pointerId) || null, blockedOn, domEventName, eventSystemFlags, targetContainer, pointerEvent));
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
case 'gotpointercapture':
|
|
|
{
|
|
|
var _pointerEvent = nativeEvent;
|
|
|
var _pointerId2 = _pointerEvent.pointerId;
|
|
|
queuedPointerCaptures.set(_pointerId2, accumulateOrCreateContinuousQueuedReplayableEvent(queuedPointerCaptures.get(_pointerId2) || null, blockedOn, domEventName, eventSystemFlags, targetContainer, _pointerEvent));
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
} // Check if this target is unblocked. Returns true if it's unblocked.
|
|
|
|
|
|
function attemptExplicitHydrationTarget(queuedTarget) {
|
|
|
// TODO: This function shares a lot of logic with findInstanceBlockingEvent.
|
|
|
// Try to unify them. It's a bit tricky since it would require two return
|
|
|
// values.
|
|
|
var targetInst = getClosestInstanceFromNode(queuedTarget.target);
|
|
|
|
|
|
if (targetInst !== null) {
|
|
|
var nearestMounted = getNearestMountedFiber(targetInst);
|
|
|
|
|
|
if (nearestMounted !== null) {
|
|
|
var tag = nearestMounted.tag;
|
|
|
|
|
|
if (tag === SuspenseComponent) {
|
|
|
var instance = getSuspenseInstanceFromFiber(nearestMounted);
|
|
|
|
|
|
if (instance !== null) {
|
|
|
// We're blocked on hydrating this boundary.
|
|
|
// Increase its priority.
|
|
|
queuedTarget.blockedOn = instance;
|
|
|
attemptHydrationAtPriority(queuedTarget.priority, function () {
|
|
|
attemptHydrationAtCurrentPriority(nearestMounted);
|
|
|
});
|
|
|
return;
|
|
|
}
|
|
|
} else if (tag === HostRoot) {
|
|
|
var root = nearestMounted.stateNode;
|
|
|
|
|
|
if (isRootDehydrated(root)) {
|
|
|
queuedTarget.blockedOn = getContainerFromFiber(nearestMounted); // We don't currently have a way to increase the priority of
|
|
|
// a root other than sync.
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
queuedTarget.blockedOn = null;
|
|
|
}
|
|
|
|
|
|
function queueExplicitHydrationTarget(target) {
|
|
|
// TODO: This will read the priority if it's dispatched by the React
|
|
|
// event system but not native events. Should read window.event.type, like
|
|
|
// we do for updates (getCurrentEventPriority).
|
|
|
var updatePriority = getCurrentUpdatePriority$1();
|
|
|
var queuedTarget = {
|
|
|
blockedOn: null,
|
|
|
target: target,
|
|
|
priority: updatePriority
|
|
|
};
|
|
|
var i = 0;
|
|
|
|
|
|
for (; i < queuedExplicitHydrationTargets.length; i++) {
|
|
|
// Stop once we hit the first target with lower priority than
|
|
|
if (!isHigherEventPriority(updatePriority, queuedExplicitHydrationTargets[i].priority)) {
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
queuedExplicitHydrationTargets.splice(i, 0, queuedTarget);
|
|
|
|
|
|
if (i === 0) {
|
|
|
attemptExplicitHydrationTarget(queuedTarget);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function attemptReplayContinuousQueuedEvent(queuedEvent) {
|
|
|
if (queuedEvent.blockedOn !== null) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var targetContainers = queuedEvent.targetContainers;
|
|
|
|
|
|
while (targetContainers.length > 0) {
|
|
|
var targetContainer = targetContainers[0];
|
|
|
var nextBlockedOn = findInstanceBlockingEvent(queuedEvent.domEventName, queuedEvent.eventSystemFlags, targetContainer, queuedEvent.nativeEvent);
|
|
|
|
|
|
if (nextBlockedOn === null) {
|
|
|
{
|
|
|
var nativeEvent = queuedEvent.nativeEvent;
|
|
|
var nativeEventClone = new nativeEvent.constructor(nativeEvent.type, nativeEvent);
|
|
|
setReplayingEvent(nativeEventClone);
|
|
|
nativeEvent.target.dispatchEvent(nativeEventClone);
|
|
|
resetReplayingEvent();
|
|
|
}
|
|
|
} else {
|
|
|
// We're still blocked. Try again later.
|
|
|
var _fiber3 = getInstanceFromNode(nextBlockedOn);
|
|
|
|
|
|
if (_fiber3 !== null) {
|
|
|
attemptContinuousHydration(_fiber3);
|
|
|
}
|
|
|
|
|
|
queuedEvent.blockedOn = nextBlockedOn;
|
|
|
return false;
|
|
|
} // This target container was successfully dispatched. Try the next.
|
|
|
|
|
|
|
|
|
targetContainers.shift();
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function attemptReplayContinuousQueuedEventInMap(queuedEvent, key, map) {
|
|
|
if (attemptReplayContinuousQueuedEvent(queuedEvent)) {
|
|
|
map.delete(key);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function replayUnblockedEvents() {
|
|
|
hasScheduledReplayAttempt = false;
|
|
|
|
|
|
|
|
|
if (queuedFocus !== null && attemptReplayContinuousQueuedEvent(queuedFocus)) {
|
|
|
queuedFocus = null;
|
|
|
}
|
|
|
|
|
|
if (queuedDrag !== null && attemptReplayContinuousQueuedEvent(queuedDrag)) {
|
|
|
queuedDrag = null;
|
|
|
}
|
|
|
|
|
|
if (queuedMouse !== null && attemptReplayContinuousQueuedEvent(queuedMouse)) {
|
|
|
queuedMouse = null;
|
|
|
}
|
|
|
|
|
|
queuedPointers.forEach(attemptReplayContinuousQueuedEventInMap);
|
|
|
queuedPointerCaptures.forEach(attemptReplayContinuousQueuedEventInMap);
|
|
|
}
|
|
|
|
|
|
function scheduleCallbackIfUnblocked(queuedEvent, unblocked) {
|
|
|
if (queuedEvent.blockedOn === unblocked) {
|
|
|
queuedEvent.blockedOn = null;
|
|
|
|
|
|
if (!hasScheduledReplayAttempt) {
|
|
|
hasScheduledReplayAttempt = true; // Schedule a callback to attempt replaying as many events as are
|
|
|
// now unblocked. This first might not actually be unblocked yet.
|
|
|
// We could check it early to avoid scheduling an unnecessary callback.
|
|
|
|
|
|
Scheduler.unstable_scheduleCallback(Scheduler.unstable_NormalPriority, replayUnblockedEvents);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function retryIfBlockedOn(unblocked) {
|
|
|
// Mark anything that was blocked on this as no longer blocked
|
|
|
// and eligible for a replay.
|
|
|
if (queuedDiscreteEvents.length > 0) {
|
|
|
scheduleCallbackIfUnblocked(queuedDiscreteEvents[0], unblocked); // This is a exponential search for each boundary that commits. I think it's
|
|
|
// worth it because we expect very few discrete events to queue up and once
|
|
|
// we are actually fully unblocked it will be fast to replay them.
|
|
|
|
|
|
for (var i = 1; i < queuedDiscreteEvents.length; i++) {
|
|
|
var queuedEvent = queuedDiscreteEvents[i];
|
|
|
|
|
|
if (queuedEvent.blockedOn === unblocked) {
|
|
|
queuedEvent.blockedOn = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (queuedFocus !== null) {
|
|
|
scheduleCallbackIfUnblocked(queuedFocus, unblocked);
|
|
|
}
|
|
|
|
|
|
if (queuedDrag !== null) {
|
|
|
scheduleCallbackIfUnblocked(queuedDrag, unblocked);
|
|
|
}
|
|
|
|
|
|
if (queuedMouse !== null) {
|
|
|
scheduleCallbackIfUnblocked(queuedMouse, unblocked);
|
|
|
}
|
|
|
|
|
|
var unblock = function (queuedEvent) {
|
|
|
return scheduleCallbackIfUnblocked(queuedEvent, unblocked);
|
|
|
};
|
|
|
|
|
|
queuedPointers.forEach(unblock);
|
|
|
queuedPointerCaptures.forEach(unblock);
|
|
|
|
|
|
for (var _i = 0; _i < queuedExplicitHydrationTargets.length; _i++) {
|
|
|
var queuedTarget = queuedExplicitHydrationTargets[_i];
|
|
|
|
|
|
if (queuedTarget.blockedOn === unblocked) {
|
|
|
queuedTarget.blockedOn = null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
while (queuedExplicitHydrationTargets.length > 0) {
|
|
|
var nextExplicitTarget = queuedExplicitHydrationTargets[0];
|
|
|
|
|
|
if (nextExplicitTarget.blockedOn !== null) {
|
|
|
// We're still blocked.
|
|
|
break;
|
|
|
} else {
|
|
|
attemptExplicitHydrationTarget(nextExplicitTarget);
|
|
|
|
|
|
if (nextExplicitTarget.blockedOn === null) {
|
|
|
// We're unblocked.
|
|
|
queuedExplicitHydrationTargets.shift();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentBatchConfig = ReactSharedInternals.ReactCurrentBatchConfig; // TODO: can we stop exporting these?
|
|
|
|
|
|
var _enabled = true; // This is exported in FB builds for use by legacy FB layer infra.
|
|
|
// We'd like to remove this but it's not clear if this is safe.
|
|
|
|
|
|
function setEnabled(enabled) {
|
|
|
_enabled = !!enabled;
|
|
|
}
|
|
|
function isEnabled() {
|
|
|
return _enabled;
|
|
|
}
|
|
|
function createEventListenerWrapperWithPriority(targetContainer, domEventName, eventSystemFlags) {
|
|
|
var eventPriority = getEventPriority(domEventName);
|
|
|
var listenerWrapper;
|
|
|
|
|
|
switch (eventPriority) {
|
|
|
case DiscreteEventPriority:
|
|
|
listenerWrapper = dispatchDiscreteEvent;
|
|
|
break;
|
|
|
|
|
|
case ContinuousEventPriority:
|
|
|
listenerWrapper = dispatchContinuousEvent;
|
|
|
break;
|
|
|
|
|
|
case DefaultEventPriority:
|
|
|
default:
|
|
|
listenerWrapper = dispatchEvent;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
return listenerWrapper.bind(null, domEventName, eventSystemFlags, targetContainer);
|
|
|
}
|
|
|
|
|
|
function dispatchDiscreteEvent(domEventName, eventSystemFlags, container, nativeEvent) {
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
var prevTransition = ReactCurrentBatchConfig.transition;
|
|
|
ReactCurrentBatchConfig.transition = null;
|
|
|
|
|
|
try {
|
|
|
setCurrentUpdatePriority(DiscreteEventPriority);
|
|
|
dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent);
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig.transition = prevTransition;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function dispatchContinuousEvent(domEventName, eventSystemFlags, container, nativeEvent) {
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
var prevTransition = ReactCurrentBatchConfig.transition;
|
|
|
ReactCurrentBatchConfig.transition = null;
|
|
|
|
|
|
try {
|
|
|
setCurrentUpdatePriority(ContinuousEventPriority);
|
|
|
dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent);
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig.transition = prevTransition;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function dispatchEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent) {
|
|
|
if (!_enabled) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay(domEventName, eventSystemFlags, targetContainer, nativeEvent);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay(domEventName, eventSystemFlags, targetContainer, nativeEvent) {
|
|
|
var blockedOn = findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent);
|
|
|
|
|
|
if (blockedOn === null) {
|
|
|
dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, return_targetInst, targetContainer);
|
|
|
clearIfContinuousEvent(domEventName, nativeEvent);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (queueIfContinuousEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent)) {
|
|
|
nativeEvent.stopPropagation();
|
|
|
return;
|
|
|
} // We need to clear only if we didn't queue because
|
|
|
// queueing is accumulative.
|
|
|
|
|
|
|
|
|
clearIfContinuousEvent(domEventName, nativeEvent);
|
|
|
|
|
|
if (eventSystemFlags & IS_CAPTURE_PHASE && isDiscreteEventThatRequiresHydration(domEventName)) {
|
|
|
while (blockedOn !== null) {
|
|
|
var fiber = getInstanceFromNode(blockedOn);
|
|
|
|
|
|
if (fiber !== null) {
|
|
|
attemptSynchronousHydration(fiber);
|
|
|
}
|
|
|
|
|
|
var nextBlockedOn = findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent);
|
|
|
|
|
|
if (nextBlockedOn === null) {
|
|
|
dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, return_targetInst, targetContainer);
|
|
|
}
|
|
|
|
|
|
if (nextBlockedOn === blockedOn) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
blockedOn = nextBlockedOn;
|
|
|
}
|
|
|
|
|
|
if (blockedOn !== null) {
|
|
|
nativeEvent.stopPropagation();
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
} // This is not replayable so we'll invoke it but without a target,
|
|
|
// in case the event system needs to trace it.
|
|
|
|
|
|
|
|
|
dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, null, targetContainer);
|
|
|
}
|
|
|
|
|
|
var return_targetInst = null; // Returns a SuspenseInstance or Container if it's blocked.
|
|
|
// The return_targetInst field above is conceptually part of the return value.
|
|
|
|
|
|
function findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent) {
|
|
|
// TODO: Warn if _enabled is false.
|
|
|
return_targetInst = null;
|
|
|
var nativeEventTarget = getEventTarget(nativeEvent);
|
|
|
var targetInst = getClosestInstanceFromNode(nativeEventTarget);
|
|
|
|
|
|
if (targetInst !== null) {
|
|
|
var nearestMounted = getNearestMountedFiber(targetInst);
|
|
|
|
|
|
if (nearestMounted === null) {
|
|
|
// This tree has been unmounted already. Dispatch without a target.
|
|
|
targetInst = null;
|
|
|
} else {
|
|
|
var tag = nearestMounted.tag;
|
|
|
|
|
|
if (tag === SuspenseComponent) {
|
|
|
var instance = getSuspenseInstanceFromFiber(nearestMounted);
|
|
|
|
|
|
if (instance !== null) {
|
|
|
// Queue the event to be replayed later. Abort dispatching since we
|
|
|
// don't want this event dispatched twice through the event system.
|
|
|
// TODO: If this is the first discrete event in the queue. Schedule an increased
|
|
|
// priority for this boundary.
|
|
|
return instance;
|
|
|
} // This shouldn't happen, something went wrong but to avoid blocking
|
|
|
// the whole system, dispatch the event without a target.
|
|
|
// TODO: Warn.
|
|
|
|
|
|
|
|
|
targetInst = null;
|
|
|
} else if (tag === HostRoot) {
|
|
|
var root = nearestMounted.stateNode;
|
|
|
|
|
|
if (isRootDehydrated(root)) {
|
|
|
// If this happens during a replay something went wrong and it might block
|
|
|
// the whole system.
|
|
|
return getContainerFromFiber(nearestMounted);
|
|
|
}
|
|
|
|
|
|
targetInst = null;
|
|
|
} else if (nearestMounted !== targetInst) {
|
|
|
// If we get an event (ex: img onload) before committing that
|
|
|
// component's mount, ignore it for now (that is, treat it as if it was an
|
|
|
// event on a non-React tree). We might also consider queueing events and
|
|
|
// dispatching them after the mount.
|
|
|
targetInst = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return_targetInst = targetInst; // We're not blocked on anything.
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
function getEventPriority(domEventName) {
|
|
|
switch (domEventName) {
|
|
|
// Used by SimpleEventPlugin:
|
|
|
case 'cancel':
|
|
|
case 'click':
|
|
|
case 'close':
|
|
|
case 'contextmenu':
|
|
|
case 'copy':
|
|
|
case 'cut':
|
|
|
case 'auxclick':
|
|
|
case 'dblclick':
|
|
|
case 'dragend':
|
|
|
case 'dragstart':
|
|
|
case 'drop':
|
|
|
case 'focusin':
|
|
|
case 'focusout':
|
|
|
case 'input':
|
|
|
case 'invalid':
|
|
|
case 'keydown':
|
|
|
case 'keypress':
|
|
|
case 'keyup':
|
|
|
case 'mousedown':
|
|
|
case 'mouseup':
|
|
|
case 'paste':
|
|
|
case 'pause':
|
|
|
case 'play':
|
|
|
case 'pointercancel':
|
|
|
case 'pointerdown':
|
|
|
case 'pointerup':
|
|
|
case 'ratechange':
|
|
|
case 'reset':
|
|
|
case 'resize':
|
|
|
case 'seeked':
|
|
|
case 'submit':
|
|
|
case 'touchcancel':
|
|
|
case 'touchend':
|
|
|
case 'touchstart':
|
|
|
case 'volumechange': // Used by polyfills:
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case 'change':
|
|
|
case 'selectionchange':
|
|
|
case 'textInput':
|
|
|
case 'compositionstart':
|
|
|
case 'compositionend':
|
|
|
case 'compositionupdate': // Only enableCreateEventHandleAPI:
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case 'beforeblur':
|
|
|
case 'afterblur': // Not used by React but could be by user code:
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case 'beforeinput':
|
|
|
case 'blur':
|
|
|
case 'fullscreenchange':
|
|
|
case 'focus':
|
|
|
case 'hashchange':
|
|
|
case 'popstate':
|
|
|
case 'select':
|
|
|
case 'selectstart':
|
|
|
return DiscreteEventPriority;
|
|
|
|
|
|
case 'drag':
|
|
|
case 'dragenter':
|
|
|
case 'dragexit':
|
|
|
case 'dragleave':
|
|
|
case 'dragover':
|
|
|
case 'mousemove':
|
|
|
case 'mouseout':
|
|
|
case 'mouseover':
|
|
|
case 'pointermove':
|
|
|
case 'pointerout':
|
|
|
case 'pointerover':
|
|
|
case 'scroll':
|
|
|
case 'toggle':
|
|
|
case 'touchmove':
|
|
|
case 'wheel': // Not used by React but could be by user code:
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case 'mouseenter':
|
|
|
case 'mouseleave':
|
|
|
case 'pointerenter':
|
|
|
case 'pointerleave':
|
|
|
return ContinuousEventPriority;
|
|
|
|
|
|
case 'message':
|
|
|
{
|
|
|
// We might be in the Scheduler callback.
|
|
|
// Eventually this mechanism will be replaced by a check
|
|
|
// of the current priority on the native scheduler.
|
|
|
var schedulerPriority = getCurrentPriorityLevel();
|
|
|
|
|
|
switch (schedulerPriority) {
|
|
|
case ImmediatePriority:
|
|
|
return DiscreteEventPriority;
|
|
|
|
|
|
case UserBlockingPriority:
|
|
|
return ContinuousEventPriority;
|
|
|
|
|
|
case NormalPriority:
|
|
|
case LowPriority:
|
|
|
// TODO: Handle LowSchedulerPriority, somehow. Maybe the same lane as hydration.
|
|
|
return DefaultEventPriority;
|
|
|
|
|
|
case IdlePriority:
|
|
|
return IdleEventPriority;
|
|
|
|
|
|
default:
|
|
|
return DefaultEventPriority;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
return DefaultEventPriority;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function addEventBubbleListener(target, eventType, listener) {
|
|
|
target.addEventListener(eventType, listener, false);
|
|
|
return listener;
|
|
|
}
|
|
|
function addEventCaptureListener(target, eventType, listener) {
|
|
|
target.addEventListener(eventType, listener, true);
|
|
|
return listener;
|
|
|
}
|
|
|
function addEventCaptureListenerWithPassiveFlag(target, eventType, listener, passive) {
|
|
|
target.addEventListener(eventType, listener, {
|
|
|
capture: true,
|
|
|
passive: passive
|
|
|
});
|
|
|
return listener;
|
|
|
}
|
|
|
function addEventBubbleListenerWithPassiveFlag(target, eventType, listener, passive) {
|
|
|
target.addEventListener(eventType, listener, {
|
|
|
passive: passive
|
|
|
});
|
|
|
return listener;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* These variables store information about text content of a target node,
|
|
|
* allowing comparison of content before and after a given event.
|
|
|
*
|
|
|
* Identify the node where selection currently begins, then observe
|
|
|
* both its text content and its current position in the DOM. Since the
|
|
|
* browser may natively replace the target node during composition, we can
|
|
|
* use its position to find its replacement.
|
|
|
*
|
|
|
*
|
|
|
*/
|
|
|
var root = null;
|
|
|
var startText = null;
|
|
|
var fallbackText = null;
|
|
|
function initialize(nativeEventTarget) {
|
|
|
root = nativeEventTarget;
|
|
|
startText = getText();
|
|
|
return true;
|
|
|
}
|
|
|
function reset() {
|
|
|
root = null;
|
|
|
startText = null;
|
|
|
fallbackText = null;
|
|
|
}
|
|
|
function getData() {
|
|
|
if (fallbackText) {
|
|
|
return fallbackText;
|
|
|
}
|
|
|
|
|
|
var start;
|
|
|
var startValue = startText;
|
|
|
var startLength = startValue.length;
|
|
|
var end;
|
|
|
var endValue = getText();
|
|
|
var endLength = endValue.length;
|
|
|
|
|
|
for (start = 0; start < startLength; start++) {
|
|
|
if (startValue[start] !== endValue[start]) {
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var minEnd = startLength - start;
|
|
|
|
|
|
for (end = 1; end <= minEnd; end++) {
|
|
|
if (startValue[startLength - end] !== endValue[endLength - end]) {
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var sliceTail = end > 1 ? 1 - end : undefined;
|
|
|
fallbackText = endValue.slice(start, sliceTail);
|
|
|
return fallbackText;
|
|
|
}
|
|
|
function getText() {
|
|
|
if ('value' in root) {
|
|
|
return root.value;
|
|
|
}
|
|
|
|
|
|
return root.textContent;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* `charCode` represents the actual "character code" and is safe to use with
|
|
|
* `String.fromCharCode`. As such, only keys that correspond to printable
|
|
|
* characters produce a valid `charCode`, the only exception to this is Enter.
|
|
|
* The Tab-key is considered non-printable and does not have a `charCode`,
|
|
|
* presumably because it does not produce a tab-character in browsers.
|
|
|
*
|
|
|
* @param {object} nativeEvent Native browser event.
|
|
|
* @return {number} Normalized `charCode` property.
|
|
|
*/
|
|
|
function getEventCharCode(nativeEvent) {
|
|
|
var charCode;
|
|
|
var keyCode = nativeEvent.keyCode;
|
|
|
|
|
|
if ('charCode' in nativeEvent) {
|
|
|
charCode = nativeEvent.charCode; // FF does not set `charCode` for the Enter-key, check against `keyCode`.
|
|
|
|
|
|
if (charCode === 0 && keyCode === 13) {
|
|
|
charCode = 13;
|
|
|
}
|
|
|
} else {
|
|
|
// IE8 does not implement `charCode`, but `keyCode` has the correct value.
|
|
|
charCode = keyCode;
|
|
|
} // IE and Edge (on Windows) and Chrome / Safari (on Windows and Linux)
|
|
|
// report Enter as charCode 10 when ctrl is pressed.
|
|
|
|
|
|
|
|
|
if (charCode === 10) {
|
|
|
charCode = 13;
|
|
|
} // Some non-printable keys are reported in `charCode`/`keyCode`, discard them.
|
|
|
// Must not discard the (non-)printable Enter-key.
|
|
|
|
|
|
|
|
|
if (charCode >= 32 || charCode === 13) {
|
|
|
return charCode;
|
|
|
}
|
|
|
|
|
|
return 0;
|
|
|
}
|
|
|
|
|
|
function functionThatReturnsTrue() {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function functionThatReturnsFalse() {
|
|
|
return false;
|
|
|
} // This is intentionally a factory so that we have different returned constructors.
|
|
|
// If we had a single constructor, it would be megamorphic and engines would deopt.
|
|
|
|
|
|
|
|
|
function createSyntheticEvent(Interface) {
|
|
|
/**
|
|
|
* Synthetic events are dispatched by event plugins, typically in response to a
|
|
|
* top-level event delegation handler.
|
|
|
*
|
|
|
* These systems should generally use pooling to reduce the frequency of garbage
|
|
|
* collection. The system should check `isPersistent` to determine whether the
|
|
|
* event should be released into the pool after being dispatched. Users that
|
|
|
* need a persisted event should invoke `persist`.
|
|
|
*
|
|
|
* Synthetic events (and subclasses) implement the DOM Level 3 Events API by
|
|
|
* normalizing browser quirks. Subclasses do not necessarily have to implement a
|
|
|
* DOM interface; custom application-specific events can also subclass this.
|
|
|
*/
|
|
|
function SyntheticBaseEvent(reactName, reactEventType, targetInst, nativeEvent, nativeEventTarget) {
|
|
|
this._reactName = reactName;
|
|
|
this._targetInst = targetInst;
|
|
|
this.type = reactEventType;
|
|
|
this.nativeEvent = nativeEvent;
|
|
|
this.target = nativeEventTarget;
|
|
|
this.currentTarget = null;
|
|
|
|
|
|
for (var _propName in Interface) {
|
|
|
if (!Interface.hasOwnProperty(_propName)) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var normalize = Interface[_propName];
|
|
|
|
|
|
if (normalize) {
|
|
|
this[_propName] = normalize(nativeEvent);
|
|
|
} else {
|
|
|
this[_propName] = nativeEvent[_propName];
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var defaultPrevented = nativeEvent.defaultPrevented != null ? nativeEvent.defaultPrevented : nativeEvent.returnValue === false;
|
|
|
|
|
|
if (defaultPrevented) {
|
|
|
this.isDefaultPrevented = functionThatReturnsTrue;
|
|
|
} else {
|
|
|
this.isDefaultPrevented = functionThatReturnsFalse;
|
|
|
}
|
|
|
|
|
|
this.isPropagationStopped = functionThatReturnsFalse;
|
|
|
return this;
|
|
|
}
|
|
|
|
|
|
assign(SyntheticBaseEvent.prototype, {
|
|
|
preventDefault: function () {
|
|
|
this.defaultPrevented = true;
|
|
|
var event = this.nativeEvent;
|
|
|
|
|
|
if (!event) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (event.preventDefault) {
|
|
|
event.preventDefault(); // $FlowFixMe - flow is not aware of `unknown` in IE
|
|
|
} else if (typeof event.returnValue !== 'unknown') {
|
|
|
event.returnValue = false;
|
|
|
}
|
|
|
|
|
|
this.isDefaultPrevented = functionThatReturnsTrue;
|
|
|
},
|
|
|
stopPropagation: function () {
|
|
|
var event = this.nativeEvent;
|
|
|
|
|
|
if (!event) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (event.stopPropagation) {
|
|
|
event.stopPropagation(); // $FlowFixMe - flow is not aware of `unknown` in IE
|
|
|
} else if (typeof event.cancelBubble !== 'unknown') {
|
|
|
// The ChangeEventPlugin registers a "propertychange" event for
|
|
|
// IE. This event does not support bubbling or cancelling, and
|
|
|
// any references to cancelBubble throw "Member not found". A
|
|
|
// typeof check of "unknown" circumvents this issue (and is also
|
|
|
// IE specific).
|
|
|
event.cancelBubble = true;
|
|
|
}
|
|
|
|
|
|
this.isPropagationStopped = functionThatReturnsTrue;
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* We release all dispatched `SyntheticEvent`s after each event loop, adding
|
|
|
* them back into the pool. This allows a way to hold onto a reference that
|
|
|
* won't be added back into the pool.
|
|
|
*/
|
|
|
persist: function () {// Modern event system doesn't use pooling.
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* Checks if this event should be released back into the pool.
|
|
|
*
|
|
|
* @return {boolean} True if this should not be released, false otherwise.
|
|
|
*/
|
|
|
isPersistent: functionThatReturnsTrue
|
|
|
});
|
|
|
return SyntheticBaseEvent;
|
|
|
}
|
|
|
/**
|
|
|
* @interface Event
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/
|
|
|
*/
|
|
|
|
|
|
|
|
|
var EventInterface = {
|
|
|
eventPhase: 0,
|
|
|
bubbles: 0,
|
|
|
cancelable: 0,
|
|
|
timeStamp: function (event) {
|
|
|
return event.timeStamp || Date.now();
|
|
|
},
|
|
|
defaultPrevented: 0,
|
|
|
isTrusted: 0
|
|
|
};
|
|
|
var SyntheticEvent = createSyntheticEvent(EventInterface);
|
|
|
|
|
|
var UIEventInterface = assign({}, EventInterface, {
|
|
|
view: 0,
|
|
|
detail: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticUIEvent = createSyntheticEvent(UIEventInterface);
|
|
|
var lastMovementX;
|
|
|
var lastMovementY;
|
|
|
var lastMouseEvent;
|
|
|
|
|
|
function updateMouseMovementPolyfillState(event) {
|
|
|
if (event !== lastMouseEvent) {
|
|
|
if (lastMouseEvent && event.type === 'mousemove') {
|
|
|
lastMovementX = event.screenX - lastMouseEvent.screenX;
|
|
|
lastMovementY = event.screenY - lastMouseEvent.screenY;
|
|
|
} else {
|
|
|
lastMovementX = 0;
|
|
|
lastMovementY = 0;
|
|
|
}
|
|
|
|
|
|
lastMouseEvent = event;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* @interface MouseEvent
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/
|
|
|
*/
|
|
|
|
|
|
|
|
|
var MouseEventInterface = assign({}, UIEventInterface, {
|
|
|
screenX: 0,
|
|
|
screenY: 0,
|
|
|
clientX: 0,
|
|
|
clientY: 0,
|
|
|
pageX: 0,
|
|
|
pageY: 0,
|
|
|
ctrlKey: 0,
|
|
|
shiftKey: 0,
|
|
|
altKey: 0,
|
|
|
metaKey: 0,
|
|
|
getModifierState: getEventModifierState,
|
|
|
button: 0,
|
|
|
buttons: 0,
|
|
|
relatedTarget: function (event) {
|
|
|
if (event.relatedTarget === undefined) return event.fromElement === event.srcElement ? event.toElement : event.fromElement;
|
|
|
return event.relatedTarget;
|
|
|
},
|
|
|
movementX: function (event) {
|
|
|
if ('movementX' in event) {
|
|
|
return event.movementX;
|
|
|
}
|
|
|
|
|
|
updateMouseMovementPolyfillState(event);
|
|
|
return lastMovementX;
|
|
|
},
|
|
|
movementY: function (event) {
|
|
|
if ('movementY' in event) {
|
|
|
return event.movementY;
|
|
|
} // Don't need to call updateMouseMovementPolyfillState() here
|
|
|
// because it's guaranteed to have already run when movementX
|
|
|
// was copied.
|
|
|
|
|
|
|
|
|
return lastMovementY;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
var SyntheticMouseEvent = createSyntheticEvent(MouseEventInterface);
|
|
|
/**
|
|
|
* @interface DragEvent
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/
|
|
|
*/
|
|
|
|
|
|
var DragEventInterface = assign({}, MouseEventInterface, {
|
|
|
dataTransfer: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticDragEvent = createSyntheticEvent(DragEventInterface);
|
|
|
/**
|
|
|
* @interface FocusEvent
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/
|
|
|
*/
|
|
|
|
|
|
var FocusEventInterface = assign({}, UIEventInterface, {
|
|
|
relatedTarget: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticFocusEvent = createSyntheticEvent(FocusEventInterface);
|
|
|
/**
|
|
|
* @interface Event
|
|
|
* @see http://www.w3.org/TR/css3-animations/#AnimationEvent-interface
|
|
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent
|
|
|
*/
|
|
|
|
|
|
var AnimationEventInterface = assign({}, EventInterface, {
|
|
|
animationName: 0,
|
|
|
elapsedTime: 0,
|
|
|
pseudoElement: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticAnimationEvent = createSyntheticEvent(AnimationEventInterface);
|
|
|
/**
|
|
|
* @interface Event
|
|
|
* @see http://www.w3.org/TR/clipboard-apis/
|
|
|
*/
|
|
|
|
|
|
var ClipboardEventInterface = assign({}, EventInterface, {
|
|
|
clipboardData: function (event) {
|
|
|
return 'clipboardData' in event ? event.clipboardData : window.clipboardData;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
var SyntheticClipboardEvent = createSyntheticEvent(ClipboardEventInterface);
|
|
|
/**
|
|
|
* @interface Event
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/#events-compositionevents
|
|
|
*/
|
|
|
|
|
|
var CompositionEventInterface = assign({}, EventInterface, {
|
|
|
data: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticCompositionEvent = createSyntheticEvent(CompositionEventInterface);
|
|
|
/**
|
|
|
* @interface Event
|
|
|
* @see http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105
|
|
|
* /#events-inputevents
|
|
|
*/
|
|
|
// Happens to share the same list for now.
|
|
|
|
|
|
var SyntheticInputEvent = SyntheticCompositionEvent;
|
|
|
/**
|
|
|
* Normalization of deprecated HTML5 `key` values
|
|
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names
|
|
|
*/
|
|
|
|
|
|
var normalizeKey = {
|
|
|
Esc: 'Escape',
|
|
|
Spacebar: ' ',
|
|
|
Left: 'ArrowLeft',
|
|
|
Up: 'ArrowUp',
|
|
|
Right: 'ArrowRight',
|
|
|
Down: 'ArrowDown',
|
|
|
Del: 'Delete',
|
|
|
Win: 'OS',
|
|
|
Menu: 'ContextMenu',
|
|
|
Apps: 'ContextMenu',
|
|
|
Scroll: 'ScrollLock',
|
|
|
MozPrintableKey: 'Unidentified'
|
|
|
};
|
|
|
/**
|
|
|
* Translation from legacy `keyCode` to HTML5 `key`
|
|
|
* Only special keys supported, all others depend on keyboard layout or browser
|
|
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names
|
|
|
*/
|
|
|
|
|
|
var translateToKey = {
|
|
|
'8': 'Backspace',
|
|
|
'9': 'Tab',
|
|
|
'12': 'Clear',
|
|
|
'13': 'Enter',
|
|
|
'16': 'Shift',
|
|
|
'17': 'Control',
|
|
|
'18': 'Alt',
|
|
|
'19': 'Pause',
|
|
|
'20': 'CapsLock',
|
|
|
'27': 'Escape',
|
|
|
'32': ' ',
|
|
|
'33': 'PageUp',
|
|
|
'34': 'PageDown',
|
|
|
'35': 'End',
|
|
|
'36': 'Home',
|
|
|
'37': 'ArrowLeft',
|
|
|
'38': 'ArrowUp',
|
|
|
'39': 'ArrowRight',
|
|
|
'40': 'ArrowDown',
|
|
|
'45': 'Insert',
|
|
|
'46': 'Delete',
|
|
|
'112': 'F1',
|
|
|
'113': 'F2',
|
|
|
'114': 'F3',
|
|
|
'115': 'F4',
|
|
|
'116': 'F5',
|
|
|
'117': 'F6',
|
|
|
'118': 'F7',
|
|
|
'119': 'F8',
|
|
|
'120': 'F9',
|
|
|
'121': 'F10',
|
|
|
'122': 'F11',
|
|
|
'123': 'F12',
|
|
|
'144': 'NumLock',
|
|
|
'145': 'ScrollLock',
|
|
|
'224': 'Meta'
|
|
|
};
|
|
|
/**
|
|
|
* @param {object} nativeEvent Native browser event.
|
|
|
* @return {string} Normalized `key` property.
|
|
|
*/
|
|
|
|
|
|
function getEventKey(nativeEvent) {
|
|
|
if (nativeEvent.key) {
|
|
|
// Normalize inconsistent values reported by browsers due to
|
|
|
// implementations of a working draft specification.
|
|
|
// FireFox implements `key` but returns `MozPrintableKey` for all
|
|
|
// printable characters (normalized to `Unidentified`), ignore it.
|
|
|
var key = normalizeKey[nativeEvent.key] || nativeEvent.key;
|
|
|
|
|
|
if (key !== 'Unidentified') {
|
|
|
return key;
|
|
|
}
|
|
|
} // Browser does not implement `key`, polyfill as much of it as we can.
|
|
|
|
|
|
|
|
|
if (nativeEvent.type === 'keypress') {
|
|
|
var charCode = getEventCharCode(nativeEvent); // The enter-key is technically both printable and non-printable and can
|
|
|
// thus be captured by `keypress`, no other non-printable key should.
|
|
|
|
|
|
return charCode === 13 ? 'Enter' : String.fromCharCode(charCode);
|
|
|
}
|
|
|
|
|
|
if (nativeEvent.type === 'keydown' || nativeEvent.type === 'keyup') {
|
|
|
// While user keyboard layout determines the actual meaning of each
|
|
|
// `keyCode` value, almost all function keys have a universal value.
|
|
|
return translateToKey[nativeEvent.keyCode] || 'Unidentified';
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
/**
|
|
|
* Translation from modifier key to the associated property in the event.
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/#keys-Modifiers
|
|
|
*/
|
|
|
|
|
|
|
|
|
var modifierKeyToProp = {
|
|
|
Alt: 'altKey',
|
|
|
Control: 'ctrlKey',
|
|
|
Meta: 'metaKey',
|
|
|
Shift: 'shiftKey'
|
|
|
}; // Older browsers (Safari <= 10, iOS Safari <= 10.2) do not support
|
|
|
// getModifierState. If getModifierState is not supported, we map it to a set of
|
|
|
// modifier keys exposed by the event. In this case, Lock-keys are not supported.
|
|
|
|
|
|
function modifierStateGetter(keyArg) {
|
|
|
var syntheticEvent = this;
|
|
|
var nativeEvent = syntheticEvent.nativeEvent;
|
|
|
|
|
|
if (nativeEvent.getModifierState) {
|
|
|
return nativeEvent.getModifierState(keyArg);
|
|
|
}
|
|
|
|
|
|
var keyProp = modifierKeyToProp[keyArg];
|
|
|
return keyProp ? !!nativeEvent[keyProp] : false;
|
|
|
}
|
|
|
|
|
|
function getEventModifierState(nativeEvent) {
|
|
|
return modifierStateGetter;
|
|
|
}
|
|
|
/**
|
|
|
* @interface KeyboardEvent
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/
|
|
|
*/
|
|
|
|
|
|
|
|
|
var KeyboardEventInterface = assign({}, UIEventInterface, {
|
|
|
key: getEventKey,
|
|
|
code: 0,
|
|
|
location: 0,
|
|
|
ctrlKey: 0,
|
|
|
shiftKey: 0,
|
|
|
altKey: 0,
|
|
|
metaKey: 0,
|
|
|
repeat: 0,
|
|
|
locale: 0,
|
|
|
getModifierState: getEventModifierState,
|
|
|
// Legacy Interface
|
|
|
charCode: function (event) {
|
|
|
// `charCode` is the result of a KeyPress event and represents the value of
|
|
|
// the actual printable character.
|
|
|
// KeyPress is deprecated, but its replacement is not yet final and not
|
|
|
// implemented in any major browser. Only KeyPress has charCode.
|
|
|
if (event.type === 'keypress') {
|
|
|
return getEventCharCode(event);
|
|
|
}
|
|
|
|
|
|
return 0;
|
|
|
},
|
|
|
keyCode: function (event) {
|
|
|
// `keyCode` is the result of a KeyDown/Up event and represents the value of
|
|
|
// physical keyboard key.
|
|
|
// The actual meaning of the value depends on the users' keyboard layout
|
|
|
// which cannot be detected. Assuming that it is a US keyboard layout
|
|
|
// provides a surprisingly accurate mapping for US and European users.
|
|
|
// Due to this, it is left to the user to implement at this time.
|
|
|
if (event.type === 'keydown' || event.type === 'keyup') {
|
|
|
return event.keyCode;
|
|
|
}
|
|
|
|
|
|
return 0;
|
|
|
},
|
|
|
which: function (event) {
|
|
|
// `which` is an alias for either `keyCode` or `charCode` depending on the
|
|
|
// type of the event.
|
|
|
if (event.type === 'keypress') {
|
|
|
return getEventCharCode(event);
|
|
|
}
|
|
|
|
|
|
if (event.type === 'keydown' || event.type === 'keyup') {
|
|
|
return event.keyCode;
|
|
|
}
|
|
|
|
|
|
return 0;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
var SyntheticKeyboardEvent = createSyntheticEvent(KeyboardEventInterface);
|
|
|
/**
|
|
|
* @interface PointerEvent
|
|
|
* @see http://www.w3.org/TR/pointerevents/
|
|
|
*/
|
|
|
|
|
|
var PointerEventInterface = assign({}, MouseEventInterface, {
|
|
|
pointerId: 0,
|
|
|
width: 0,
|
|
|
height: 0,
|
|
|
pressure: 0,
|
|
|
tangentialPressure: 0,
|
|
|
tiltX: 0,
|
|
|
tiltY: 0,
|
|
|
twist: 0,
|
|
|
pointerType: 0,
|
|
|
isPrimary: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticPointerEvent = createSyntheticEvent(PointerEventInterface);
|
|
|
/**
|
|
|
* @interface TouchEvent
|
|
|
* @see http://www.w3.org/TR/touch-events/
|
|
|
*/
|
|
|
|
|
|
var TouchEventInterface = assign({}, UIEventInterface, {
|
|
|
touches: 0,
|
|
|
targetTouches: 0,
|
|
|
changedTouches: 0,
|
|
|
altKey: 0,
|
|
|
metaKey: 0,
|
|
|
ctrlKey: 0,
|
|
|
shiftKey: 0,
|
|
|
getModifierState: getEventModifierState
|
|
|
});
|
|
|
|
|
|
var SyntheticTouchEvent = createSyntheticEvent(TouchEventInterface);
|
|
|
/**
|
|
|
* @interface Event
|
|
|
* @see http://www.w3.org/TR/2009/WD-css3-transitions-20090320/#transition-events-
|
|
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/TransitionEvent
|
|
|
*/
|
|
|
|
|
|
var TransitionEventInterface = assign({}, EventInterface, {
|
|
|
propertyName: 0,
|
|
|
elapsedTime: 0,
|
|
|
pseudoElement: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticTransitionEvent = createSyntheticEvent(TransitionEventInterface);
|
|
|
/**
|
|
|
* @interface WheelEvent
|
|
|
* @see http://www.w3.org/TR/DOM-Level-3-Events/
|
|
|
*/
|
|
|
|
|
|
var WheelEventInterface = assign({}, MouseEventInterface, {
|
|
|
deltaX: function (event) {
|
|
|
return 'deltaX' in event ? event.deltaX : // Fallback to `wheelDeltaX` for Webkit and normalize (right is positive).
|
|
|
'wheelDeltaX' in event ? -event.wheelDeltaX : 0;
|
|
|
},
|
|
|
deltaY: function (event) {
|
|
|
return 'deltaY' in event ? event.deltaY : // Fallback to `wheelDeltaY` for Webkit and normalize (down is positive).
|
|
|
'wheelDeltaY' in event ? -event.wheelDeltaY : // Fallback to `wheelDelta` for IE<9 and normalize (down is positive).
|
|
|
'wheelDelta' in event ? -event.wheelDelta : 0;
|
|
|
},
|
|
|
deltaZ: 0,
|
|
|
// Browsers without "deltaMode" is reporting in raw wheel delta where one
|
|
|
// notch on the scroll is always +/- 120, roughly equivalent to pixels.
|
|
|
// A good approximation of DOM_DELTA_LINE (1) is 5% of viewport size or
|
|
|
// ~40 pixels, for DOM_DELTA_SCREEN (2) it is 87.5% of viewport size.
|
|
|
deltaMode: 0
|
|
|
});
|
|
|
|
|
|
var SyntheticWheelEvent = createSyntheticEvent(WheelEventInterface);
|
|
|
|
|
|
var END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space
|
|
|
|
|
|
var START_KEYCODE = 229;
|
|
|
var canUseCompositionEvent = canUseDOM && 'CompositionEvent' in window;
|
|
|
var documentMode = null;
|
|
|
|
|
|
if (canUseDOM && 'documentMode' in document) {
|
|
|
documentMode = document.documentMode;
|
|
|
} // Webkit offers a very useful `textInput` event that can be used to
|
|
|
// directly represent `beforeInput`. The IE `textinput` event is not as
|
|
|
// useful, so we don't use it.
|
|
|
|
|
|
|
|
|
var canUseTextInputEvent = canUseDOM && 'TextEvent' in window && !documentMode; // In IE9+, we have access to composition events, but the data supplied
|
|
|
// by the native compositionend event may be incorrect. Japanese ideographic
|
|
|
// spaces, for instance (\u3000) are not recorded correctly.
|
|
|
|
|
|
var useFallbackCompositionData = canUseDOM && (!canUseCompositionEvent || documentMode && documentMode > 8 && documentMode <= 11);
|
|
|
var SPACEBAR_CODE = 32;
|
|
|
var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE);
|
|
|
|
|
|
function registerEvents() {
|
|
|
registerTwoPhaseEvent('onBeforeInput', ['compositionend', 'keypress', 'textInput', 'paste']);
|
|
|
registerTwoPhaseEvent('onCompositionEnd', ['compositionend', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']);
|
|
|
registerTwoPhaseEvent('onCompositionStart', ['compositionstart', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']);
|
|
|
registerTwoPhaseEvent('onCompositionUpdate', ['compositionupdate', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']);
|
|
|
} // Track whether we've ever handled a keypress on the space key.
|
|
|
|
|
|
|
|
|
var hasSpaceKeypress = false;
|
|
|
/**
|
|
|
* Return whether a native keypress event is assumed to be a command.
|
|
|
* This is required because Firefox fires `keypress` events for key commands
|
|
|
* (cut, copy, select-all, etc.) even though no character is inserted.
|
|
|
*/
|
|
|
|
|
|
function isKeypressCommand(nativeEvent) {
|
|
|
return (nativeEvent.ctrlKey || nativeEvent.altKey || nativeEvent.metaKey) && // ctrlKey && altKey is equivalent to AltGr, and is not a command.
|
|
|
!(nativeEvent.ctrlKey && nativeEvent.altKey);
|
|
|
}
|
|
|
/**
|
|
|
* Translate native top level events into event types.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getCompositionEventType(domEventName) {
|
|
|
switch (domEventName) {
|
|
|
case 'compositionstart':
|
|
|
return 'onCompositionStart';
|
|
|
|
|
|
case 'compositionend':
|
|
|
return 'onCompositionEnd';
|
|
|
|
|
|
case 'compositionupdate':
|
|
|
return 'onCompositionUpdate';
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Does our fallback best-guess model think this event signifies that
|
|
|
* composition has begun?
|
|
|
*/
|
|
|
|
|
|
|
|
|
function isFallbackCompositionStart(domEventName, nativeEvent) {
|
|
|
return domEventName === 'keydown' && nativeEvent.keyCode === START_KEYCODE;
|
|
|
}
|
|
|
/**
|
|
|
* Does our fallback mode think that this event is the end of composition?
|
|
|
*/
|
|
|
|
|
|
|
|
|
function isFallbackCompositionEnd(domEventName, nativeEvent) {
|
|
|
switch (domEventName) {
|
|
|
case 'keyup':
|
|
|
// Command keys insert or clear IME input.
|
|
|
return END_KEYCODES.indexOf(nativeEvent.keyCode) !== -1;
|
|
|
|
|
|
case 'keydown':
|
|
|
// Expect IME keyCode on each keydown. If we get any other
|
|
|
// code we must have exited earlier.
|
|
|
return nativeEvent.keyCode !== START_KEYCODE;
|
|
|
|
|
|
case 'keypress':
|
|
|
case 'mousedown':
|
|
|
case 'focusout':
|
|
|
// Events are not possible without cancelling IME.
|
|
|
return true;
|
|
|
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Google Input Tools provides composition data via a CustomEvent,
|
|
|
* with the `data` property populated in the `detail` object. If this
|
|
|
* is available on the event object, use it. If not, this is a plain
|
|
|
* composition event and we have nothing special to extract.
|
|
|
*
|
|
|
* @param {object} nativeEvent
|
|
|
* @return {?string}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getDataFromCustomEvent(nativeEvent) {
|
|
|
var detail = nativeEvent.detail;
|
|
|
|
|
|
if (typeof detail === 'object' && 'data' in detail) {
|
|
|
return detail.data;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
/**
|
|
|
* Check if a composition event was triggered by Korean IME.
|
|
|
* Our fallback mode does not work well with IE's Korean IME,
|
|
|
* so just use native composition events when Korean IME is used.
|
|
|
* Although CompositionEvent.locale property is deprecated,
|
|
|
* it is available in IE, where our fallback mode is enabled.
|
|
|
*
|
|
|
* @param {object} nativeEvent
|
|
|
* @return {boolean}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function isUsingKoreanIME(nativeEvent) {
|
|
|
return nativeEvent.locale === 'ko';
|
|
|
} // Track the current IME composition status, if any.
|
|
|
|
|
|
|
|
|
var isComposing = false;
|
|
|
/**
|
|
|
* @return {?object} A SyntheticCompositionEvent.
|
|
|
*/
|
|
|
|
|
|
function extractCompositionEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget) {
|
|
|
var eventType;
|
|
|
var fallbackData;
|
|
|
|
|
|
if (canUseCompositionEvent) {
|
|
|
eventType = getCompositionEventType(domEventName);
|
|
|
} else if (!isComposing) {
|
|
|
if (isFallbackCompositionStart(domEventName, nativeEvent)) {
|
|
|
eventType = 'onCompositionStart';
|
|
|
}
|
|
|
} else if (isFallbackCompositionEnd(domEventName, nativeEvent)) {
|
|
|
eventType = 'onCompositionEnd';
|
|
|
}
|
|
|
|
|
|
if (!eventType) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
if (useFallbackCompositionData && !isUsingKoreanIME(nativeEvent)) {
|
|
|
// The current composition is stored statically and must not be
|
|
|
// overwritten while composition continues.
|
|
|
if (!isComposing && eventType === 'onCompositionStart') {
|
|
|
isComposing = initialize(nativeEventTarget);
|
|
|
} else if (eventType === 'onCompositionEnd') {
|
|
|
if (isComposing) {
|
|
|
fallbackData = getData();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var listeners = accumulateTwoPhaseListeners(targetInst, eventType);
|
|
|
|
|
|
if (listeners.length > 0) {
|
|
|
var event = new SyntheticCompositionEvent(eventType, domEventName, null, nativeEvent, nativeEventTarget);
|
|
|
dispatchQueue.push({
|
|
|
event: event,
|
|
|
listeners: listeners
|
|
|
});
|
|
|
|
|
|
if (fallbackData) {
|
|
|
// Inject data generated from fallback path into the synthetic event.
|
|
|
// This matches the property of native CompositionEventInterface.
|
|
|
event.data = fallbackData;
|
|
|
} else {
|
|
|
var customData = getDataFromCustomEvent(nativeEvent);
|
|
|
|
|
|
if (customData !== null) {
|
|
|
event.data = customData;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getNativeBeforeInputChars(domEventName, nativeEvent) {
|
|
|
switch (domEventName) {
|
|
|
case 'compositionend':
|
|
|
return getDataFromCustomEvent(nativeEvent);
|
|
|
|
|
|
case 'keypress':
|
|
|
/**
|
|
|
* If native `textInput` events are available, our goal is to make
|
|
|
* use of them. However, there is a special case: the spacebar key.
|
|
|
* In Webkit, preventing default on a spacebar `textInput` event
|
|
|
* cancels character insertion, but it *also* causes the browser
|
|
|
* to fall back to its default spacebar behavior of scrolling the
|
|
|
* page.
|
|
|
*
|
|
|
* Tracking at:
|
|
|
* https://code.google.com/p/chromium/issues/detail?id=355103
|
|
|
*
|
|
|
* To avoid this issue, use the keypress event as if no `textInput`
|
|
|
* event is available.
|
|
|
*/
|
|
|
var which = nativeEvent.which;
|
|
|
|
|
|
if (which !== SPACEBAR_CODE) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
hasSpaceKeypress = true;
|
|
|
return SPACEBAR_CHAR;
|
|
|
|
|
|
case 'textInput':
|
|
|
// Record the characters to be added to the DOM.
|
|
|
var chars = nativeEvent.data; // If it's a spacebar character, assume that we have already handled
|
|
|
// it at the keypress level and bail immediately. Android Chrome
|
|
|
// doesn't give us keycodes, so we need to ignore it.
|
|
|
|
|
|
if (chars === SPACEBAR_CHAR && hasSpaceKeypress) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return chars;
|
|
|
|
|
|
default:
|
|
|
// For other native event types, do nothing.
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* For browsers that do not provide the `textInput` event, extract the
|
|
|
* appropriate string to use for SyntheticInputEvent.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getFallbackBeforeInputChars(domEventName, nativeEvent) {
|
|
|
// If we are currently composing (IME) and using a fallback to do so,
|
|
|
// try to extract the composed characters from the fallback object.
|
|
|
// If composition event is available, we extract a string only at
|
|
|
// compositionevent, otherwise extract it at fallback events.
|
|
|
if (isComposing) {
|
|
|
if (domEventName === 'compositionend' || !canUseCompositionEvent && isFallbackCompositionEnd(domEventName, nativeEvent)) {
|
|
|
var chars = getData();
|
|
|
reset();
|
|
|
isComposing = false;
|
|
|
return chars;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
switch (domEventName) {
|
|
|
case 'paste':
|
|
|
// If a paste event occurs after a keypress, throw out the input
|
|
|
// chars. Paste events should not lead to BeforeInput events.
|
|
|
return null;
|
|
|
|
|
|
case 'keypress':
|
|
|
/**
|
|
|
* As of v27, Firefox may fire keypress events even when no character
|
|
|
* will be inserted. A few possibilities:
|
|
|
*
|
|
|
* - `which` is `0`. Arrow keys, Esc key, etc.
|
|
|
*
|
|
|
* - `which` is the pressed key code, but no char is available.
|
|
|
* Ex: 'AltGr + d` in Polish. There is no modified character for
|
|
|
* this key combination and no character is inserted into the
|
|
|
* document, but FF fires the keypress for char code `100` anyway.
|
|
|
* No `input` event will occur.
|
|
|
*
|
|
|
* - `which` is the pressed key code, but a command combination is
|
|
|
* being used. Ex: `Cmd+C`. No character is inserted, and no
|
|
|
* `input` event will occur.
|
|
|
*/
|
|
|
if (!isKeypressCommand(nativeEvent)) {
|
|
|
// IE fires the `keypress` event when a user types an emoji via
|
|
|
// Touch keyboard of Windows. In such a case, the `char` property
|
|
|
// holds an emoji character like `\uD83D\uDE0A`. Because its length
|
|
|
// is 2, the property `which` does not represent an emoji correctly.
|
|
|
// In such a case, we directly return the `char` property instead of
|
|
|
// using `which`.
|
|
|
if (nativeEvent.char && nativeEvent.char.length > 1) {
|
|
|
return nativeEvent.char;
|
|
|
} else if (nativeEvent.which) {
|
|
|
return String.fromCharCode(nativeEvent.which);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
|
|
|
case 'compositionend':
|
|
|
return useFallbackCompositionData && !isUsingKoreanIME(nativeEvent) ? null : nativeEvent.data;
|
|
|
|
|
|
default:
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Extract a SyntheticInputEvent for `beforeInput`, based on either native
|
|
|
* `textInput` or fallback behavior.
|
|
|
*
|
|
|
* @return {?object} A SyntheticInputEvent.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function extractBeforeInputEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget) {
|
|
|
var chars;
|
|
|
|
|
|
if (canUseTextInputEvent) {
|
|
|
chars = getNativeBeforeInputChars(domEventName, nativeEvent);
|
|
|
} else {
|
|
|
chars = getFallbackBeforeInputChars(domEventName, nativeEvent);
|
|
|
} // If no characters are being inserted, no BeforeInput event should
|
|
|
// be fired.
|
|
|
|
|
|
|
|
|
if (!chars) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var listeners = accumulateTwoPhaseListeners(targetInst, 'onBeforeInput');
|
|
|
|
|
|
if (listeners.length > 0) {
|
|
|
var event = new SyntheticInputEvent('onBeforeInput', 'beforeinput', null, nativeEvent, nativeEventTarget);
|
|
|
dispatchQueue.push({
|
|
|
event: event,
|
|
|
listeners: listeners
|
|
|
});
|
|
|
event.data = chars;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Create an `onBeforeInput` event to match
|
|
|
* http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105/#events-inputevents.
|
|
|
*
|
|
|
* This event plugin is based on the native `textInput` event
|
|
|
* available in Chrome, Safari, Opera, and IE. This event fires after
|
|
|
* `onKeyPress` and `onCompositionEnd`, but before `onInput`.
|
|
|
*
|
|
|
* `beforeInput` is spec'd but not implemented in any browsers, and
|
|
|
* the `input` event does not provide any useful information about what has
|
|
|
* actually been added, contrary to the spec. Thus, `textInput` is the best
|
|
|
* available event to identify the characters that have actually been inserted
|
|
|
* into the target node.
|
|
|
*
|
|
|
* This plugin is also responsible for emitting `composition` events, thus
|
|
|
* allowing us to share composition fallback code for both `beforeInput` and
|
|
|
* `composition` event types.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function extractEvents(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
|
|
|
extractCompositionEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
|
|
|
extractBeforeInputEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @see http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type-attr-summary
|
|
|
*/
|
|
|
var supportedInputTypes = {
|
|
|
color: true,
|
|
|
date: true,
|
|
|
datetime: true,
|
|
|
'datetime-local': true,
|
|
|
email: true,
|
|
|
month: true,
|
|
|
number: true,
|
|
|
password: true,
|
|
|
range: true,
|
|
|
search: true,
|
|
|
tel: true,
|
|
|
text: true,
|
|
|
time: true,
|
|
|
url: true,
|
|
|
week: true
|
|
|
};
|
|
|
|
|
|
function isTextInputElement(elem) {
|
|
|
var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase();
|
|
|
|
|
|
if (nodeName === 'input') {
|
|
|
return !!supportedInputTypes[elem.type];
|
|
|
}
|
|
|
|
|
|
if (nodeName === 'textarea') {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Checks if an event is supported in the current execution environment.
|
|
|
*
|
|
|
* NOTE: This will not work correctly for non-generic events such as `change`,
|
|
|
* `reset`, `load`, `error`, and `select`.
|
|
|
*
|
|
|
* Borrows from Modernizr.
|
|
|
*
|
|
|
* @param {string} eventNameSuffix Event name, e.g. "click".
|
|
|
* @return {boolean} True if the event is supported.
|
|
|
* @internal
|
|
|
* @license Modernizr 3.0.0pre (Custom Build) | MIT
|
|
|
*/
|
|
|
|
|
|
function isEventSupported(eventNameSuffix) {
|
|
|
if (!canUseDOM) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var eventName = 'on' + eventNameSuffix;
|
|
|
var isSupported = (eventName in document);
|
|
|
|
|
|
if (!isSupported) {
|
|
|
var element = document.createElement('div');
|
|
|
element.setAttribute(eventName, 'return;');
|
|
|
isSupported = typeof element[eventName] === 'function';
|
|
|
}
|
|
|
|
|
|
return isSupported;
|
|
|
}
|
|
|
|
|
|
function registerEvents$1() {
|
|
|
registerTwoPhaseEvent('onChange', ['change', 'click', 'focusin', 'focusout', 'input', 'keydown', 'keyup', 'selectionchange']);
|
|
|
}
|
|
|
|
|
|
function createAndAccumulateChangeEvent(dispatchQueue, inst, nativeEvent, target) {
|
|
|
// Flag this event loop as needing state restore.
|
|
|
enqueueStateRestore(target);
|
|
|
var listeners = accumulateTwoPhaseListeners(inst, 'onChange');
|
|
|
|
|
|
if (listeners.length > 0) {
|
|
|
var event = new SyntheticEvent('onChange', 'change', null, nativeEvent, target);
|
|
|
dispatchQueue.push({
|
|
|
event: event,
|
|
|
listeners: listeners
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* For IE shims
|
|
|
*/
|
|
|
|
|
|
|
|
|
var activeElement = null;
|
|
|
var activeElementInst = null;
|
|
|
/**
|
|
|
* SECTION: handle `change` event
|
|
|
*/
|
|
|
|
|
|
function shouldUseChangeEvent(elem) {
|
|
|
var nodeName = elem.nodeName && elem.nodeName.toLowerCase();
|
|
|
return nodeName === 'select' || nodeName === 'input' && elem.type === 'file';
|
|
|
}
|
|
|
|
|
|
function manualDispatchChangeEvent(nativeEvent) {
|
|
|
var dispatchQueue = [];
|
|
|
createAndAccumulateChangeEvent(dispatchQueue, activeElementInst, nativeEvent, getEventTarget(nativeEvent)); // If change and propertychange bubbled, we'd just bind to it like all the
|
|
|
// other events and have it go through ReactBrowserEventEmitter. Since it
|
|
|
// doesn't, we manually listen for the events and so we have to enqueue and
|
|
|
// process the abstract event manually.
|
|
|
//
|
|
|
// Batching is necessary here in order to ensure that all event handlers run
|
|
|
// before the next rerender (including event handlers attached to ancestor
|
|
|
// elements instead of directly on the input). Without this, controlled
|
|
|
// components don't work properly in conjunction with event bubbling because
|
|
|
// the component is rerendered and the value reverted before all the event
|
|
|
// handlers can run. See https://github.com/facebook/react/issues/708.
|
|
|
|
|
|
batchedUpdates(runEventInBatch, dispatchQueue);
|
|
|
}
|
|
|
|
|
|
function runEventInBatch(dispatchQueue) {
|
|
|
processDispatchQueue(dispatchQueue, 0);
|
|
|
}
|
|
|
|
|
|
function getInstIfValueChanged(targetInst) {
|
|
|
var targetNode = getNodeFromInstance(targetInst);
|
|
|
|
|
|
if (updateValueIfChanged(targetNode)) {
|
|
|
return targetInst;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getTargetInstForChangeEvent(domEventName, targetInst) {
|
|
|
if (domEventName === 'change') {
|
|
|
return targetInst;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* SECTION: handle `input` event
|
|
|
*/
|
|
|
|
|
|
|
|
|
var isInputEventSupported = false;
|
|
|
|
|
|
if (canUseDOM) {
|
|
|
// IE9 claims to support the input event but fails to trigger it when
|
|
|
// deleting text, so we ignore its input events.
|
|
|
isInputEventSupported = isEventSupported('input') && (!document.documentMode || document.documentMode > 9);
|
|
|
}
|
|
|
/**
|
|
|
* (For IE <=9) Starts tracking propertychange events on the passed-in element
|
|
|
* and override the value property so that we can distinguish user events from
|
|
|
* value changes in JS.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function startWatchingForValueChange(target, targetInst) {
|
|
|
activeElement = target;
|
|
|
activeElementInst = targetInst;
|
|
|
activeElement.attachEvent('onpropertychange', handlePropertyChange);
|
|
|
}
|
|
|
/**
|
|
|
* (For IE <=9) Removes the event listeners from the currently-tracked element,
|
|
|
* if any exists.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function stopWatchingForValueChange() {
|
|
|
if (!activeElement) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
activeElement.detachEvent('onpropertychange', handlePropertyChange);
|
|
|
activeElement = null;
|
|
|
activeElementInst = null;
|
|
|
}
|
|
|
/**
|
|
|
* (For IE <=9) Handles a propertychange event, sending a `change` event if
|
|
|
* the value of the active element has changed.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function handlePropertyChange(nativeEvent) {
|
|
|
if (nativeEvent.propertyName !== 'value') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (getInstIfValueChanged(activeElementInst)) {
|
|
|
manualDispatchChangeEvent(nativeEvent);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function handleEventsForInputEventPolyfill(domEventName, target, targetInst) {
|
|
|
if (domEventName === 'focusin') {
|
|
|
// In IE9, propertychange fires for most input events but is buggy and
|
|
|
// doesn't fire when text is deleted, but conveniently, selectionchange
|
|
|
// appears to fire in all of the remaining cases so we catch those and
|
|
|
// forward the event if the value has changed
|
|
|
// In either case, we don't want to call the event handler if the value
|
|
|
// is changed from JS so we redefine a setter for `.value` that updates
|
|
|
// our activeElementValue variable, allowing us to ignore those changes
|
|
|
//
|
|
|
// stopWatching() should be a noop here but we call it just in case we
|
|
|
// missed a blur event somehow.
|
|
|
stopWatchingForValueChange();
|
|
|
startWatchingForValueChange(target, targetInst);
|
|
|
} else if (domEventName === 'focusout') {
|
|
|
stopWatchingForValueChange();
|
|
|
}
|
|
|
} // For IE8 and IE9.
|
|
|
|
|
|
|
|
|
function getTargetInstForInputEventPolyfill(domEventName, targetInst) {
|
|
|
if (domEventName === 'selectionchange' || domEventName === 'keyup' || domEventName === 'keydown') {
|
|
|
// On the selectionchange event, the target is just document which isn't
|
|
|
// helpful for us so just check activeElement instead.
|
|
|
//
|
|
|
// 99% of the time, keydown and keyup aren't necessary. IE8 fails to fire
|
|
|
// propertychange on the first input event after setting `value` from a
|
|
|
// script and fires only keydown, keypress, keyup. Catching keyup usually
|
|
|
// gets it and catching keydown lets us fire an event for the first
|
|
|
// keystroke if user does a key repeat (it'll be a little delayed: right
|
|
|
// before the second keystroke). Other input methods (e.g., paste) seem to
|
|
|
// fire selectionchange normally.
|
|
|
return getInstIfValueChanged(activeElementInst);
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* SECTION: handle `click` event
|
|
|
*/
|
|
|
|
|
|
|
|
|
function shouldUseClickEvent(elem) {
|
|
|
// Use the `click` event to detect changes to checkbox and radio inputs.
|
|
|
// This approach works across all browsers, whereas `change` does not fire
|
|
|
// until `blur` in IE8.
|
|
|
var nodeName = elem.nodeName;
|
|
|
return nodeName && nodeName.toLowerCase() === 'input' && (elem.type === 'checkbox' || elem.type === 'radio');
|
|
|
}
|
|
|
|
|
|
function getTargetInstForClickEvent(domEventName, targetInst) {
|
|
|
if (domEventName === 'click') {
|
|
|
return getInstIfValueChanged(targetInst);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getTargetInstForInputOrChangeEvent(domEventName, targetInst) {
|
|
|
if (domEventName === 'input' || domEventName === 'change') {
|
|
|
return getInstIfValueChanged(targetInst);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function handleControlledInputBlur(node) {
|
|
|
var state = node._wrapperState;
|
|
|
|
|
|
if (!state || !state.controlled || node.type !== 'number') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// If controlled, assign the value attribute to the current value on blur
|
|
|
setDefaultValue(node, 'number', node.value);
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* This plugin creates an `onChange` event that normalizes change events
|
|
|
* across form elements. This event fires at a time when it's possible to
|
|
|
* change the element's value without seeing a flicker.
|
|
|
*
|
|
|
* Supported elements are:
|
|
|
* - input (see `isTextInputElement`)
|
|
|
* - textarea
|
|
|
* - select
|
|
|
*/
|
|
|
|
|
|
|
|
|
function extractEvents$1(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
|
|
|
var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
|
|
|
var getTargetInstFunc, handleEventFunc;
|
|
|
|
|
|
if (shouldUseChangeEvent(targetNode)) {
|
|
|
getTargetInstFunc = getTargetInstForChangeEvent;
|
|
|
} else if (isTextInputElement(targetNode)) {
|
|
|
if (isInputEventSupported) {
|
|
|
getTargetInstFunc = getTargetInstForInputOrChangeEvent;
|
|
|
} else {
|
|
|
getTargetInstFunc = getTargetInstForInputEventPolyfill;
|
|
|
handleEventFunc = handleEventsForInputEventPolyfill;
|
|
|
}
|
|
|
} else if (shouldUseClickEvent(targetNode)) {
|
|
|
getTargetInstFunc = getTargetInstForClickEvent;
|
|
|
}
|
|
|
|
|
|
if (getTargetInstFunc) {
|
|
|
var inst = getTargetInstFunc(domEventName, targetInst);
|
|
|
|
|
|
if (inst) {
|
|
|
createAndAccumulateChangeEvent(dispatchQueue, inst, nativeEvent, nativeEventTarget);
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (handleEventFunc) {
|
|
|
handleEventFunc(domEventName, targetNode, targetInst);
|
|
|
} // When blurring, set the value attribute for number inputs
|
|
|
|
|
|
|
|
|
if (domEventName === 'focusout') {
|
|
|
handleControlledInputBlur(targetNode);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function registerEvents$2() {
|
|
|
registerDirectEvent('onMouseEnter', ['mouseout', 'mouseover']);
|
|
|
registerDirectEvent('onMouseLeave', ['mouseout', 'mouseover']);
|
|
|
registerDirectEvent('onPointerEnter', ['pointerout', 'pointerover']);
|
|
|
registerDirectEvent('onPointerLeave', ['pointerout', 'pointerover']);
|
|
|
}
|
|
|
/**
|
|
|
* For almost every interaction we care about, there will be both a top-level
|
|
|
* `mouseover` and `mouseout` event that occurs. Only use `mouseout` so that
|
|
|
* we do not extract duplicate events. However, moving the mouse into the
|
|
|
* browser from outside will not fire a `mouseout` event. In this case, we use
|
|
|
* the `mouseover` top-level event.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function extractEvents$2(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
|
|
|
var isOverEvent = domEventName === 'mouseover' || domEventName === 'pointerover';
|
|
|
var isOutEvent = domEventName === 'mouseout' || domEventName === 'pointerout';
|
|
|
|
|
|
if (isOverEvent && !isReplayingEvent(nativeEvent)) {
|
|
|
// If this is an over event with a target, we might have already dispatched
|
|
|
// the event in the out event of the other target. If this is replayed,
|
|
|
// then it's because we couldn't dispatch against this target previously
|
|
|
// so we have to do it now instead.
|
|
|
var related = nativeEvent.relatedTarget || nativeEvent.fromElement;
|
|
|
|
|
|
if (related) {
|
|
|
// If the related node is managed by React, we can assume that we have
|
|
|
// already dispatched the corresponding events during its mouseout.
|
|
|
if (getClosestInstanceFromNode(related) || isContainerMarkedAsRoot(related)) {
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (!isOutEvent && !isOverEvent) {
|
|
|
// Must not be a mouse or pointer in or out - ignoring.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var win; // TODO: why is this nullable in the types but we read from it?
|
|
|
|
|
|
if (nativeEventTarget.window === nativeEventTarget) {
|
|
|
// `nativeEventTarget` is probably a window object.
|
|
|
win = nativeEventTarget;
|
|
|
} else {
|
|
|
// TODO: Figure out why `ownerDocument` is sometimes undefined in IE8.
|
|
|
var doc = nativeEventTarget.ownerDocument;
|
|
|
|
|
|
if (doc) {
|
|
|
win = doc.defaultView || doc.parentWindow;
|
|
|
} else {
|
|
|
win = window;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var from;
|
|
|
var to;
|
|
|
|
|
|
if (isOutEvent) {
|
|
|
var _related = nativeEvent.relatedTarget || nativeEvent.toElement;
|
|
|
|
|
|
from = targetInst;
|
|
|
to = _related ? getClosestInstanceFromNode(_related) : null;
|
|
|
|
|
|
if (to !== null) {
|
|
|
var nearestMounted = getNearestMountedFiber(to);
|
|
|
|
|
|
if (to !== nearestMounted || to.tag !== HostComponent && to.tag !== HostText) {
|
|
|
to = null;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
// Moving to a node from outside the window.
|
|
|
from = null;
|
|
|
to = targetInst;
|
|
|
}
|
|
|
|
|
|
if (from === to) {
|
|
|
// Nothing pertains to our managed components.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var SyntheticEventCtor = SyntheticMouseEvent;
|
|
|
var leaveEventType = 'onMouseLeave';
|
|
|
var enterEventType = 'onMouseEnter';
|
|
|
var eventTypePrefix = 'mouse';
|
|
|
|
|
|
if (domEventName === 'pointerout' || domEventName === 'pointerover') {
|
|
|
SyntheticEventCtor = SyntheticPointerEvent;
|
|
|
leaveEventType = 'onPointerLeave';
|
|
|
enterEventType = 'onPointerEnter';
|
|
|
eventTypePrefix = 'pointer';
|
|
|
}
|
|
|
|
|
|
var fromNode = from == null ? win : getNodeFromInstance(from);
|
|
|
var toNode = to == null ? win : getNodeFromInstance(to);
|
|
|
var leave = new SyntheticEventCtor(leaveEventType, eventTypePrefix + 'leave', from, nativeEvent, nativeEventTarget);
|
|
|
leave.target = fromNode;
|
|
|
leave.relatedTarget = toNode;
|
|
|
var enter = null; // We should only process this nativeEvent if we are processing
|
|
|
// the first ancestor. Next time, we will ignore the event.
|
|
|
|
|
|
var nativeTargetInst = getClosestInstanceFromNode(nativeEventTarget);
|
|
|
|
|
|
if (nativeTargetInst === targetInst) {
|
|
|
var enterEvent = new SyntheticEventCtor(enterEventType, eventTypePrefix + 'enter', to, nativeEvent, nativeEventTarget);
|
|
|
enterEvent.target = toNode;
|
|
|
enterEvent.relatedTarget = fromNode;
|
|
|
enter = enterEvent;
|
|
|
}
|
|
|
|
|
|
accumulateEnterLeaveTwoPhaseListeners(dispatchQueue, leave, enter, from, to);
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* inlined Object.is polyfill to avoid requiring consumers ship their own
|
|
|
* https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
|
|
|
*/
|
|
|
function is(x, y) {
|
|
|
return x === y && (x !== 0 || 1 / x === 1 / y) || x !== x && y !== y // eslint-disable-line no-self-compare
|
|
|
;
|
|
|
}
|
|
|
|
|
|
var objectIs = typeof Object.is === 'function' ? Object.is : is;
|
|
|
|
|
|
/**
|
|
|
* Performs equality by iterating through keys on an object and returning false
|
|
|
* when any key has values which are not strictly equal between the arguments.
|
|
|
* Returns true when the values of all keys are strictly equal.
|
|
|
*/
|
|
|
|
|
|
function shallowEqual(objA, objB) {
|
|
|
if (objectIs(objA, objB)) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var keysA = Object.keys(objA);
|
|
|
var keysB = Object.keys(objB);
|
|
|
|
|
|
if (keysA.length !== keysB.length) {
|
|
|
return false;
|
|
|
} // Test for A's keys different from B.
|
|
|
|
|
|
|
|
|
for (var i = 0; i < keysA.length; i++) {
|
|
|
var currentKey = keysA[i];
|
|
|
|
|
|
if (!hasOwnProperty.call(objB, currentKey) || !objectIs(objA[currentKey], objB[currentKey])) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Given any node return the first leaf node without children.
|
|
|
*
|
|
|
* @param {DOMElement|DOMTextNode} node
|
|
|
* @return {DOMElement|DOMTextNode}
|
|
|
*/
|
|
|
|
|
|
function getLeafNode(node) {
|
|
|
while (node && node.firstChild) {
|
|
|
node = node.firstChild;
|
|
|
}
|
|
|
|
|
|
return node;
|
|
|
}
|
|
|
/**
|
|
|
* Get the next sibling within a container. This will walk up the
|
|
|
* DOM if a node's siblings have been exhausted.
|
|
|
*
|
|
|
* @param {DOMElement|DOMTextNode} node
|
|
|
* @return {?DOMElement|DOMTextNode}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getSiblingNode(node) {
|
|
|
while (node) {
|
|
|
if (node.nextSibling) {
|
|
|
return node.nextSibling;
|
|
|
}
|
|
|
|
|
|
node = node.parentNode;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Get object describing the nodes which contain characters at offset.
|
|
|
*
|
|
|
* @param {DOMElement|DOMTextNode} root
|
|
|
* @param {number} offset
|
|
|
* @return {?object}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getNodeForCharacterOffset(root, offset) {
|
|
|
var node = getLeafNode(root);
|
|
|
var nodeStart = 0;
|
|
|
var nodeEnd = 0;
|
|
|
|
|
|
while (node) {
|
|
|
if (node.nodeType === TEXT_NODE) {
|
|
|
nodeEnd = nodeStart + node.textContent.length;
|
|
|
|
|
|
if (nodeStart <= offset && nodeEnd >= offset) {
|
|
|
return {
|
|
|
node: node,
|
|
|
offset: offset - nodeStart
|
|
|
};
|
|
|
}
|
|
|
|
|
|
nodeStart = nodeEnd;
|
|
|
}
|
|
|
|
|
|
node = getLeafNode(getSiblingNode(node));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {DOMElement} outerNode
|
|
|
* @return {?object}
|
|
|
*/
|
|
|
|
|
|
function getOffsets(outerNode) {
|
|
|
var ownerDocument = outerNode.ownerDocument;
|
|
|
var win = ownerDocument && ownerDocument.defaultView || window;
|
|
|
var selection = win.getSelection && win.getSelection();
|
|
|
|
|
|
if (!selection || selection.rangeCount === 0) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var anchorNode = selection.anchorNode,
|
|
|
anchorOffset = selection.anchorOffset,
|
|
|
focusNode = selection.focusNode,
|
|
|
focusOffset = selection.focusOffset; // In Firefox, anchorNode and focusNode can be "anonymous divs", e.g. the
|
|
|
// up/down buttons on an <input type="number">. Anonymous divs do not seem to
|
|
|
// expose properties, triggering a "Permission denied error" if any of its
|
|
|
// properties are accessed. The only seemingly possible way to avoid erroring
|
|
|
// is to access a property that typically works for non-anonymous divs and
|
|
|
// catch any error that may otherwise arise. See
|
|
|
// https://bugzilla.mozilla.org/show_bug.cgi?id=208427
|
|
|
|
|
|
try {
|
|
|
/* eslint-disable no-unused-expressions */
|
|
|
anchorNode.nodeType;
|
|
|
focusNode.nodeType;
|
|
|
/* eslint-enable no-unused-expressions */
|
|
|
} catch (e) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode, focusOffset);
|
|
|
}
|
|
|
/**
|
|
|
* Returns {start, end} where `start` is the character/codepoint index of
|
|
|
* (anchorNode, anchorOffset) within the textContent of `outerNode`, and
|
|
|
* `end` is the index of (focusNode, focusOffset).
|
|
|
*
|
|
|
* Returns null if you pass in garbage input but we should probably just crash.
|
|
|
*
|
|
|
* Exported only for testing.
|
|
|
*/
|
|
|
|
|
|
function getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode, focusOffset) {
|
|
|
var length = 0;
|
|
|
var start = -1;
|
|
|
var end = -1;
|
|
|
var indexWithinAnchor = 0;
|
|
|
var indexWithinFocus = 0;
|
|
|
var node = outerNode;
|
|
|
var parentNode = null;
|
|
|
|
|
|
outer: while (true) {
|
|
|
var next = null;
|
|
|
|
|
|
while (true) {
|
|
|
if (node === anchorNode && (anchorOffset === 0 || node.nodeType === TEXT_NODE)) {
|
|
|
start = length + anchorOffset;
|
|
|
}
|
|
|
|
|
|
if (node === focusNode && (focusOffset === 0 || node.nodeType === TEXT_NODE)) {
|
|
|
end = length + focusOffset;
|
|
|
}
|
|
|
|
|
|
if (node.nodeType === TEXT_NODE) {
|
|
|
length += node.nodeValue.length;
|
|
|
}
|
|
|
|
|
|
if ((next = node.firstChild) === null) {
|
|
|
break;
|
|
|
} // Moving from `node` to its first child `next`.
|
|
|
|
|
|
|
|
|
parentNode = node;
|
|
|
node = next;
|
|
|
}
|
|
|
|
|
|
while (true) {
|
|
|
if (node === outerNode) {
|
|
|
// If `outerNode` has children, this is always the second time visiting
|
|
|
// it. If it has no children, this is still the first loop, and the only
|
|
|
// valid selection is anchorNode and focusNode both equal to this node
|
|
|
// and both offsets 0, in which case we will have handled above.
|
|
|
break outer;
|
|
|
}
|
|
|
|
|
|
if (parentNode === anchorNode && ++indexWithinAnchor === anchorOffset) {
|
|
|
start = length;
|
|
|
}
|
|
|
|
|
|
if (parentNode === focusNode && ++indexWithinFocus === focusOffset) {
|
|
|
end = length;
|
|
|
}
|
|
|
|
|
|
if ((next = node.nextSibling) !== null) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
node = parentNode;
|
|
|
parentNode = node.parentNode;
|
|
|
} // Moving from `node` to its next sibling `next`.
|
|
|
|
|
|
|
|
|
node = next;
|
|
|
}
|
|
|
|
|
|
if (start === -1 || end === -1) {
|
|
|
// This should never happen. (Would happen if the anchor/focus nodes aren't
|
|
|
// actually inside the passed-in node.)
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
start: start,
|
|
|
end: end
|
|
|
};
|
|
|
}
|
|
|
/**
|
|
|
* In modern non-IE browsers, we can support both forward and backward
|
|
|
* selections.
|
|
|
*
|
|
|
* Note: IE10+ supports the Selection object, but it does not support
|
|
|
* the `extend` method, which means that even in modern IE, it's not possible
|
|
|
* to programmatically create a backward selection. Thus, for all IE
|
|
|
* versions, we use the old IE API to create our selections.
|
|
|
*
|
|
|
* @param {DOMElement|DOMTextNode} node
|
|
|
* @param {object} offsets
|
|
|
*/
|
|
|
|
|
|
function setOffsets(node, offsets) {
|
|
|
var doc = node.ownerDocument || document;
|
|
|
var win = doc && doc.defaultView || window; // Edge fails with "Object expected" in some scenarios.
|
|
|
// (For instance: TinyMCE editor used in a list component that supports pasting to add more,
|
|
|
// fails when pasting 100+ items)
|
|
|
|
|
|
if (!win.getSelection) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var selection = win.getSelection();
|
|
|
var length = node.textContent.length;
|
|
|
var start = Math.min(offsets.start, length);
|
|
|
var end = offsets.end === undefined ? start : Math.min(offsets.end, length); // IE 11 uses modern selection, but doesn't support the extend method.
|
|
|
// Flip backward selections, so we can set with a single range.
|
|
|
|
|
|
if (!selection.extend && start > end) {
|
|
|
var temp = end;
|
|
|
end = start;
|
|
|
start = temp;
|
|
|
}
|
|
|
|
|
|
var startMarker = getNodeForCharacterOffset(node, start);
|
|
|
var endMarker = getNodeForCharacterOffset(node, end);
|
|
|
|
|
|
if (startMarker && endMarker) {
|
|
|
if (selection.rangeCount === 1 && selection.anchorNode === startMarker.node && selection.anchorOffset === startMarker.offset && selection.focusNode === endMarker.node && selection.focusOffset === endMarker.offset) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var range = doc.createRange();
|
|
|
range.setStart(startMarker.node, startMarker.offset);
|
|
|
selection.removeAllRanges();
|
|
|
|
|
|
if (start > end) {
|
|
|
selection.addRange(range);
|
|
|
selection.extend(endMarker.node, endMarker.offset);
|
|
|
} else {
|
|
|
range.setEnd(endMarker.node, endMarker.offset);
|
|
|
selection.addRange(range);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isTextNode(node) {
|
|
|
return node && node.nodeType === TEXT_NODE;
|
|
|
}
|
|
|
|
|
|
function containsNode(outerNode, innerNode) {
|
|
|
if (!outerNode || !innerNode) {
|
|
|
return false;
|
|
|
} else if (outerNode === innerNode) {
|
|
|
return true;
|
|
|
} else if (isTextNode(outerNode)) {
|
|
|
return false;
|
|
|
} else if (isTextNode(innerNode)) {
|
|
|
return containsNode(outerNode, innerNode.parentNode);
|
|
|
} else if ('contains' in outerNode) {
|
|
|
return outerNode.contains(innerNode);
|
|
|
} else if (outerNode.compareDocumentPosition) {
|
|
|
return !!(outerNode.compareDocumentPosition(innerNode) & 16);
|
|
|
} else {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isInDocument(node) {
|
|
|
return node && node.ownerDocument && containsNode(node.ownerDocument.documentElement, node);
|
|
|
}
|
|
|
|
|
|
function isSameOriginFrame(iframe) {
|
|
|
try {
|
|
|
// Accessing the contentDocument of a HTMLIframeElement can cause the browser
|
|
|
// to throw, e.g. if it has a cross-origin src attribute.
|
|
|
// Safari will show an error in the console when the access results in "Blocked a frame with origin". e.g:
|
|
|
// iframe.contentDocument.defaultView;
|
|
|
// A safety way is to access one of the cross origin properties: Window or Location
|
|
|
// Which might result in "SecurityError" DOM Exception and it is compatible to Safari.
|
|
|
// https://html.spec.whatwg.org/multipage/browsers.html#integration-with-idl
|
|
|
return typeof iframe.contentWindow.location.href === 'string';
|
|
|
} catch (err) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getActiveElementDeep() {
|
|
|
var win = window;
|
|
|
var element = getActiveElement();
|
|
|
|
|
|
while (element instanceof win.HTMLIFrameElement) {
|
|
|
if (isSameOriginFrame(element)) {
|
|
|
win = element.contentWindow;
|
|
|
} else {
|
|
|
return element;
|
|
|
}
|
|
|
|
|
|
element = getActiveElement(win.document);
|
|
|
}
|
|
|
|
|
|
return element;
|
|
|
}
|
|
|
/**
|
|
|
* @ReactInputSelection: React input selection module. Based on Selection.js,
|
|
|
* but modified to be suitable for react and has a couple of bug fixes (doesn't
|
|
|
* assume buttons have range selections allowed).
|
|
|
* Input selection module for React.
|
|
|
*/
|
|
|
|
|
|
/**
|
|
|
* @hasSelectionCapabilities: we get the element types that support selection
|
|
|
* from https://html.spec.whatwg.org/#do-not-apply, looking at `selectionStart`
|
|
|
* and `selectionEnd` rows.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function hasSelectionCapabilities(elem) {
|
|
|
var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase();
|
|
|
return nodeName && (nodeName === 'input' && (elem.type === 'text' || elem.type === 'search' || elem.type === 'tel' || elem.type === 'url' || elem.type === 'password') || nodeName === 'textarea' || elem.contentEditable === 'true');
|
|
|
}
|
|
|
function getSelectionInformation() {
|
|
|
var focusedElem = getActiveElementDeep();
|
|
|
return {
|
|
|
focusedElem: focusedElem,
|
|
|
selectionRange: hasSelectionCapabilities(focusedElem) ? getSelection(focusedElem) : null
|
|
|
};
|
|
|
}
|
|
|
/**
|
|
|
* @restoreSelection: If any selection information was potentially lost,
|
|
|
* restore it. This is useful when performing operations that could remove dom
|
|
|
* nodes and place them back in, resulting in focus being lost.
|
|
|
*/
|
|
|
|
|
|
function restoreSelection(priorSelectionInformation) {
|
|
|
var curFocusedElem = getActiveElementDeep();
|
|
|
var priorFocusedElem = priorSelectionInformation.focusedElem;
|
|
|
var priorSelectionRange = priorSelectionInformation.selectionRange;
|
|
|
|
|
|
if (curFocusedElem !== priorFocusedElem && isInDocument(priorFocusedElem)) {
|
|
|
if (priorSelectionRange !== null && hasSelectionCapabilities(priorFocusedElem)) {
|
|
|
setSelection(priorFocusedElem, priorSelectionRange);
|
|
|
} // Focusing a node can change the scroll position, which is undesirable
|
|
|
|
|
|
|
|
|
var ancestors = [];
|
|
|
var ancestor = priorFocusedElem;
|
|
|
|
|
|
while (ancestor = ancestor.parentNode) {
|
|
|
if (ancestor.nodeType === ELEMENT_NODE) {
|
|
|
ancestors.push({
|
|
|
element: ancestor,
|
|
|
left: ancestor.scrollLeft,
|
|
|
top: ancestor.scrollTop
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof priorFocusedElem.focus === 'function') {
|
|
|
priorFocusedElem.focus();
|
|
|
}
|
|
|
|
|
|
for (var i = 0; i < ancestors.length; i++) {
|
|
|
var info = ancestors[i];
|
|
|
info.element.scrollLeft = info.left;
|
|
|
info.element.scrollTop = info.top;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* @getSelection: Gets the selection bounds of a focused textarea, input or
|
|
|
* contentEditable node.
|
|
|
* -@input: Look up selection bounds of this input
|
|
|
* -@return {start: selectionStart, end: selectionEnd}
|
|
|
*/
|
|
|
|
|
|
function getSelection(input) {
|
|
|
var selection;
|
|
|
|
|
|
if ('selectionStart' in input) {
|
|
|
// Modern browser with input or textarea.
|
|
|
selection = {
|
|
|
start: input.selectionStart,
|
|
|
end: input.selectionEnd
|
|
|
};
|
|
|
} else {
|
|
|
// Content editable or old IE textarea.
|
|
|
selection = getOffsets(input);
|
|
|
}
|
|
|
|
|
|
return selection || {
|
|
|
start: 0,
|
|
|
end: 0
|
|
|
};
|
|
|
}
|
|
|
/**
|
|
|
* @setSelection: Sets the selection bounds of a textarea or input and focuses
|
|
|
* the input.
|
|
|
* -@input Set selection bounds of this input or textarea
|
|
|
* -@offsets Object of same form that is returned from get*
|
|
|
*/
|
|
|
|
|
|
function setSelection(input, offsets) {
|
|
|
var start = offsets.start;
|
|
|
var end = offsets.end;
|
|
|
|
|
|
if (end === undefined) {
|
|
|
end = start;
|
|
|
}
|
|
|
|
|
|
if ('selectionStart' in input) {
|
|
|
input.selectionStart = start;
|
|
|
input.selectionEnd = Math.min(end, input.value.length);
|
|
|
} else {
|
|
|
setOffsets(input, offsets);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var skipSelectionChangeEvent = canUseDOM && 'documentMode' in document && document.documentMode <= 11;
|
|
|
|
|
|
function registerEvents$3() {
|
|
|
registerTwoPhaseEvent('onSelect', ['focusout', 'contextmenu', 'dragend', 'focusin', 'keydown', 'keyup', 'mousedown', 'mouseup', 'selectionchange']);
|
|
|
}
|
|
|
|
|
|
var activeElement$1 = null;
|
|
|
var activeElementInst$1 = null;
|
|
|
var lastSelection = null;
|
|
|
var mouseDown = false;
|
|
|
/**
|
|
|
* Get an object which is a unique representation of the current selection.
|
|
|
*
|
|
|
* The return value will not be consistent across nodes or browsers, but
|
|
|
* two identical selections on the same node will return identical objects.
|
|
|
*/
|
|
|
|
|
|
function getSelection$1(node) {
|
|
|
if ('selectionStart' in node && hasSelectionCapabilities(node)) {
|
|
|
return {
|
|
|
start: node.selectionStart,
|
|
|
end: node.selectionEnd
|
|
|
};
|
|
|
} else {
|
|
|
var win = node.ownerDocument && node.ownerDocument.defaultView || window;
|
|
|
var selection = win.getSelection();
|
|
|
return {
|
|
|
anchorNode: selection.anchorNode,
|
|
|
anchorOffset: selection.anchorOffset,
|
|
|
focusNode: selection.focusNode,
|
|
|
focusOffset: selection.focusOffset
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Get document associated with the event target.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getEventTargetDocument(eventTarget) {
|
|
|
return eventTarget.window === eventTarget ? eventTarget.document : eventTarget.nodeType === DOCUMENT_NODE ? eventTarget : eventTarget.ownerDocument;
|
|
|
}
|
|
|
/**
|
|
|
* Poll selection to see whether it's changed.
|
|
|
*
|
|
|
* @param {object} nativeEvent
|
|
|
* @param {object} nativeEventTarget
|
|
|
* @return {?SyntheticEvent}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget) {
|
|
|
// Ensure we have the right element, and that the user is not dragging a
|
|
|
// selection (this matches native `select` event behavior). In HTML5, select
|
|
|
// fires only on input and textarea thus if there's no focused element we
|
|
|
// won't dispatch.
|
|
|
var doc = getEventTargetDocument(nativeEventTarget);
|
|
|
|
|
|
if (mouseDown || activeElement$1 == null || activeElement$1 !== getActiveElement(doc)) {
|
|
|
return;
|
|
|
} // Only fire when selection has actually changed.
|
|
|
|
|
|
|
|
|
var currentSelection = getSelection$1(activeElement$1);
|
|
|
|
|
|
if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) {
|
|
|
lastSelection = currentSelection;
|
|
|
var listeners = accumulateTwoPhaseListeners(activeElementInst$1, 'onSelect');
|
|
|
|
|
|
if (listeners.length > 0) {
|
|
|
var event = new SyntheticEvent('onSelect', 'select', null, nativeEvent, nativeEventTarget);
|
|
|
dispatchQueue.push({
|
|
|
event: event,
|
|
|
listeners: listeners
|
|
|
});
|
|
|
event.target = activeElement$1;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* This plugin creates an `onSelect` event that normalizes select events
|
|
|
* across form elements.
|
|
|
*
|
|
|
* Supported elements are:
|
|
|
* - input (see `isTextInputElement`)
|
|
|
* - textarea
|
|
|
* - contentEditable
|
|
|
*
|
|
|
* This differs from native browser implementations in the following ways:
|
|
|
* - Fires on contentEditable fields as well as inputs.
|
|
|
* - Fires for collapsed selection.
|
|
|
* - Fires after user input.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function extractEvents$3(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
|
|
|
var targetNode = targetInst ? getNodeFromInstance(targetInst) : window;
|
|
|
|
|
|
switch (domEventName) {
|
|
|
// Track the input node that has focus.
|
|
|
case 'focusin':
|
|
|
if (isTextInputElement(targetNode) || targetNode.contentEditable === 'true') {
|
|
|
activeElement$1 = targetNode;
|
|
|
activeElementInst$1 = targetInst;
|
|
|
lastSelection = null;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'focusout':
|
|
|
activeElement$1 = null;
|
|
|
activeElementInst$1 = null;
|
|
|
lastSelection = null;
|
|
|
break;
|
|
|
// Don't fire the event while the user is dragging. This matches the
|
|
|
// semantics of the native select event.
|
|
|
|
|
|
case 'mousedown':
|
|
|
mouseDown = true;
|
|
|
break;
|
|
|
|
|
|
case 'contextmenu':
|
|
|
case 'mouseup':
|
|
|
case 'dragend':
|
|
|
mouseDown = false;
|
|
|
constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget);
|
|
|
break;
|
|
|
// Chrome and IE fire non-standard event when selection is changed (and
|
|
|
// sometimes when it hasn't). IE's event fires out of order with respect
|
|
|
// to key and input events on deletion, so we discard it.
|
|
|
//
|
|
|
// Firefox doesn't support selectionchange, so check selection status
|
|
|
// after each key entry. The selection changes after keydown and before
|
|
|
// keyup, but we check on keydown as well in the case of holding down a
|
|
|
// key, when multiple keydown events are fired but only one keyup is.
|
|
|
// This is also our approach for IE handling, for the reason above.
|
|
|
|
|
|
case 'selectionchange':
|
|
|
if (skipSelectionChangeEvent) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
// falls through
|
|
|
|
|
|
case 'keydown':
|
|
|
case 'keyup':
|
|
|
constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Generate a mapping of standard vendor prefixes using the defined style property and event name.
|
|
|
*
|
|
|
* @param {string} styleProp
|
|
|
* @param {string} eventName
|
|
|
* @returns {object}
|
|
|
*/
|
|
|
|
|
|
function makePrefixMap(styleProp, eventName) {
|
|
|
var prefixes = {};
|
|
|
prefixes[styleProp.toLowerCase()] = eventName.toLowerCase();
|
|
|
prefixes['Webkit' + styleProp] = 'webkit' + eventName;
|
|
|
prefixes['Moz' + styleProp] = 'moz' + eventName;
|
|
|
return prefixes;
|
|
|
}
|
|
|
/**
|
|
|
* A list of event names to a configurable list of vendor prefixes.
|
|
|
*/
|
|
|
|
|
|
|
|
|
var vendorPrefixes = {
|
|
|
animationend: makePrefixMap('Animation', 'AnimationEnd'),
|
|
|
animationiteration: makePrefixMap('Animation', 'AnimationIteration'),
|
|
|
animationstart: makePrefixMap('Animation', 'AnimationStart'),
|
|
|
transitionend: makePrefixMap('Transition', 'TransitionEnd')
|
|
|
};
|
|
|
/**
|
|
|
* Event names that have already been detected and prefixed (if applicable).
|
|
|
*/
|
|
|
|
|
|
var prefixedEventNames = {};
|
|
|
/**
|
|
|
* Element to check for prefixes on.
|
|
|
*/
|
|
|
|
|
|
var style = {};
|
|
|
/**
|
|
|
* Bootstrap if a DOM exists.
|
|
|
*/
|
|
|
|
|
|
if (canUseDOM) {
|
|
|
style = document.createElement('div').style; // On some platforms, in particular some releases of Android 4.x,
|
|
|
// the un-prefixed "animation" and "transition" properties are defined on the
|
|
|
// style object but the events that fire will still be prefixed, so we need
|
|
|
// to check if the un-prefixed events are usable, and if not remove them from the map.
|
|
|
|
|
|
if (!('AnimationEvent' in window)) {
|
|
|
delete vendorPrefixes.animationend.animation;
|
|
|
delete vendorPrefixes.animationiteration.animation;
|
|
|
delete vendorPrefixes.animationstart.animation;
|
|
|
} // Same as above
|
|
|
|
|
|
|
|
|
if (!('TransitionEvent' in window)) {
|
|
|
delete vendorPrefixes.transitionend.transition;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Attempts to determine the correct vendor prefixed event name.
|
|
|
*
|
|
|
* @param {string} eventName
|
|
|
* @returns {string}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getVendorPrefixedEventName(eventName) {
|
|
|
if (prefixedEventNames[eventName]) {
|
|
|
return prefixedEventNames[eventName];
|
|
|
} else if (!vendorPrefixes[eventName]) {
|
|
|
return eventName;
|
|
|
}
|
|
|
|
|
|
var prefixMap = vendorPrefixes[eventName];
|
|
|
|
|
|
for (var styleProp in prefixMap) {
|
|
|
if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) {
|
|
|
return prefixedEventNames[eventName] = prefixMap[styleProp];
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return eventName;
|
|
|
}
|
|
|
|
|
|
var ANIMATION_END = getVendorPrefixedEventName('animationend');
|
|
|
var ANIMATION_ITERATION = getVendorPrefixedEventName('animationiteration');
|
|
|
var ANIMATION_START = getVendorPrefixedEventName('animationstart');
|
|
|
var TRANSITION_END = getVendorPrefixedEventName('transitionend');
|
|
|
|
|
|
var topLevelEventsToReactNames = new Map(); // NOTE: Capitalization is important in this list!
|
|
|
//
|
|
|
// E.g. it needs "pointerDown", not "pointerdown".
|
|
|
// This is because we derive both React name ("onPointerDown")
|
|
|
// and DOM name ("pointerdown") from the same list.
|
|
|
//
|
|
|
// Exceptions that don't match this convention are listed separately.
|
|
|
//
|
|
|
// prettier-ignore
|
|
|
|
|
|
var simpleEventPluginEvents = ['abort', 'auxClick', 'cancel', 'canPlay', 'canPlayThrough', 'click', 'close', 'contextMenu', 'copy', 'cut', 'drag', 'dragEnd', 'dragEnter', 'dragExit', 'dragLeave', 'dragOver', 'dragStart', 'drop', 'durationChange', 'emptied', 'encrypted', 'ended', 'error', 'gotPointerCapture', 'input', 'invalid', 'keyDown', 'keyPress', 'keyUp', 'load', 'loadedData', 'loadedMetadata', 'loadStart', 'lostPointerCapture', 'mouseDown', 'mouseMove', 'mouseOut', 'mouseOver', 'mouseUp', 'paste', 'pause', 'play', 'playing', 'pointerCancel', 'pointerDown', 'pointerMove', 'pointerOut', 'pointerOver', 'pointerUp', 'progress', 'rateChange', 'reset', 'resize', 'seeked', 'seeking', 'stalled', 'submit', 'suspend', 'timeUpdate', 'touchCancel', 'touchEnd', 'touchStart', 'volumeChange', 'scroll', 'toggle', 'touchMove', 'waiting', 'wheel'];
|
|
|
|
|
|
function registerSimpleEvent(domEventName, reactName) {
|
|
|
topLevelEventsToReactNames.set(domEventName, reactName);
|
|
|
registerTwoPhaseEvent(reactName, [domEventName]);
|
|
|
}
|
|
|
|
|
|
function registerSimpleEvents() {
|
|
|
for (var i = 0; i < simpleEventPluginEvents.length; i++) {
|
|
|
var eventName = simpleEventPluginEvents[i];
|
|
|
var domEventName = eventName.toLowerCase();
|
|
|
var capitalizedEvent = eventName[0].toUpperCase() + eventName.slice(1);
|
|
|
registerSimpleEvent(domEventName, 'on' + capitalizedEvent);
|
|
|
} // Special cases where event names don't match.
|
|
|
|
|
|
|
|
|
registerSimpleEvent(ANIMATION_END, 'onAnimationEnd');
|
|
|
registerSimpleEvent(ANIMATION_ITERATION, 'onAnimationIteration');
|
|
|
registerSimpleEvent(ANIMATION_START, 'onAnimationStart');
|
|
|
registerSimpleEvent('dblclick', 'onDoubleClick');
|
|
|
registerSimpleEvent('focusin', 'onFocus');
|
|
|
registerSimpleEvent('focusout', 'onBlur');
|
|
|
registerSimpleEvent(TRANSITION_END, 'onTransitionEnd');
|
|
|
}
|
|
|
|
|
|
function extractEvents$4(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
|
|
|
var reactName = topLevelEventsToReactNames.get(domEventName);
|
|
|
|
|
|
if (reactName === undefined) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var SyntheticEventCtor = SyntheticEvent;
|
|
|
var reactEventType = domEventName;
|
|
|
|
|
|
switch (domEventName) {
|
|
|
case 'keypress':
|
|
|
// Firefox creates a keypress event for function keys too. This removes
|
|
|
// the unwanted keypress events. Enter is however both printable and
|
|
|
// non-printable. One would expect Tab to be as well (but it isn't).
|
|
|
if (getEventCharCode(nativeEvent) === 0) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
/* falls through */
|
|
|
|
|
|
case 'keydown':
|
|
|
case 'keyup':
|
|
|
SyntheticEventCtor = SyntheticKeyboardEvent;
|
|
|
break;
|
|
|
|
|
|
case 'focusin':
|
|
|
reactEventType = 'focus';
|
|
|
SyntheticEventCtor = SyntheticFocusEvent;
|
|
|
break;
|
|
|
|
|
|
case 'focusout':
|
|
|
reactEventType = 'blur';
|
|
|
SyntheticEventCtor = SyntheticFocusEvent;
|
|
|
break;
|
|
|
|
|
|
case 'beforeblur':
|
|
|
case 'afterblur':
|
|
|
SyntheticEventCtor = SyntheticFocusEvent;
|
|
|
break;
|
|
|
|
|
|
case 'click':
|
|
|
// Firefox creates a click event on right mouse clicks. This removes the
|
|
|
// unwanted click events.
|
|
|
if (nativeEvent.button === 2) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
/* falls through */
|
|
|
|
|
|
case 'auxclick':
|
|
|
case 'dblclick':
|
|
|
case 'mousedown':
|
|
|
case 'mousemove':
|
|
|
case 'mouseup': // TODO: Disabled elements should not respond to mouse events
|
|
|
|
|
|
/* falls through */
|
|
|
|
|
|
case 'mouseout':
|
|
|
case 'mouseover':
|
|
|
case 'contextmenu':
|
|
|
SyntheticEventCtor = SyntheticMouseEvent;
|
|
|
break;
|
|
|
|
|
|
case 'drag':
|
|
|
case 'dragend':
|
|
|
case 'dragenter':
|
|
|
case 'dragexit':
|
|
|
case 'dragleave':
|
|
|
case 'dragover':
|
|
|
case 'dragstart':
|
|
|
case 'drop':
|
|
|
SyntheticEventCtor = SyntheticDragEvent;
|
|
|
break;
|
|
|
|
|
|
case 'touchcancel':
|
|
|
case 'touchend':
|
|
|
case 'touchmove':
|
|
|
case 'touchstart':
|
|
|
SyntheticEventCtor = SyntheticTouchEvent;
|
|
|
break;
|
|
|
|
|
|
case ANIMATION_END:
|
|
|
case ANIMATION_ITERATION:
|
|
|
case ANIMATION_START:
|
|
|
SyntheticEventCtor = SyntheticAnimationEvent;
|
|
|
break;
|
|
|
|
|
|
case TRANSITION_END:
|
|
|
SyntheticEventCtor = SyntheticTransitionEvent;
|
|
|
break;
|
|
|
|
|
|
case 'scroll':
|
|
|
SyntheticEventCtor = SyntheticUIEvent;
|
|
|
break;
|
|
|
|
|
|
case 'wheel':
|
|
|
SyntheticEventCtor = SyntheticWheelEvent;
|
|
|
break;
|
|
|
|
|
|
case 'copy':
|
|
|
case 'cut':
|
|
|
case 'paste':
|
|
|
SyntheticEventCtor = SyntheticClipboardEvent;
|
|
|
break;
|
|
|
|
|
|
case 'gotpointercapture':
|
|
|
case 'lostpointercapture':
|
|
|
case 'pointercancel':
|
|
|
case 'pointerdown':
|
|
|
case 'pointermove':
|
|
|
case 'pointerout':
|
|
|
case 'pointerover':
|
|
|
case 'pointerup':
|
|
|
SyntheticEventCtor = SyntheticPointerEvent;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var inCapturePhase = (eventSystemFlags & IS_CAPTURE_PHASE) !== 0;
|
|
|
|
|
|
{
|
|
|
// Some events don't bubble in the browser.
|
|
|
// In the past, React has always bubbled them, but this can be surprising.
|
|
|
// We're going to try aligning closer to the browser behavior by not bubbling
|
|
|
// them in React either. We'll start by not bubbling onScroll, and then expand.
|
|
|
var accumulateTargetOnly = !inCapturePhase && // TODO: ideally, we'd eventually add all events from
|
|
|
// nonDelegatedEvents list in DOMPluginEventSystem.
|
|
|
// Then we can remove this special list.
|
|
|
// This is a breaking change that can wait until React 18.
|
|
|
domEventName === 'scroll';
|
|
|
|
|
|
var _listeners = accumulateSinglePhaseListeners(targetInst, reactName, nativeEvent.type, inCapturePhase, accumulateTargetOnly);
|
|
|
|
|
|
if (_listeners.length > 0) {
|
|
|
// Intentionally create event lazily.
|
|
|
var _event = new SyntheticEventCtor(reactName, reactEventType, null, nativeEvent, nativeEventTarget);
|
|
|
|
|
|
dispatchQueue.push({
|
|
|
event: _event,
|
|
|
listeners: _listeners
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// TODO: remove top-level side effect.
|
|
|
registerSimpleEvents();
|
|
|
registerEvents$2();
|
|
|
registerEvents$1();
|
|
|
registerEvents$3();
|
|
|
registerEvents();
|
|
|
|
|
|
function extractEvents$5(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) {
|
|
|
// TODO: we should remove the concept of a "SimpleEventPlugin".
|
|
|
// This is the basic functionality of the event system. All
|
|
|
// the other plugins are essentially polyfills. So the plugin
|
|
|
// should probably be inlined somewhere and have its logic
|
|
|
// be core the to event system. This would potentially allow
|
|
|
// us to ship builds of React without the polyfilled plugins below.
|
|
|
extractEvents$4(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags);
|
|
|
var shouldProcessPolyfillPlugins = (eventSystemFlags & SHOULD_NOT_PROCESS_POLYFILL_EVENT_PLUGINS) === 0; // We don't process these events unless we are in the
|
|
|
// event's native "bubble" phase, which means that we're
|
|
|
// not in the capture phase. That's because we emulate
|
|
|
// the capture phase here still. This is a trade-off,
|
|
|
// because in an ideal world we would not emulate and use
|
|
|
// the phases properly, like we do with the SimpleEvent
|
|
|
// plugin. However, the plugins below either expect
|
|
|
// emulation (EnterLeave) or use state localized to that
|
|
|
// plugin (BeforeInput, Change, Select). The state in
|
|
|
// these modules complicates things, as you'll essentially
|
|
|
// get the case where the capture phase event might change
|
|
|
// state, only for the following bubble event to come in
|
|
|
// later and not trigger anything as the state now
|
|
|
// invalidates the heuristics of the event plugin. We
|
|
|
// could alter all these plugins to work in such ways, but
|
|
|
// that might cause other unknown side-effects that we
|
|
|
// can't foresee right now.
|
|
|
|
|
|
if (shouldProcessPolyfillPlugins) {
|
|
|
extractEvents$2(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
|
|
|
extractEvents$1(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
|
|
|
extractEvents$3(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
|
|
|
extractEvents(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget);
|
|
|
}
|
|
|
} // List of events that need to be individually attached to media elements.
|
|
|
|
|
|
|
|
|
var mediaEventTypes = ['abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'encrypted', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'resize', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting']; // We should not delegate these events to the container, but rather
|
|
|
// set them on the actual target element itself. This is primarily
|
|
|
// because these events do not consistently bubble in the DOM.
|
|
|
|
|
|
var nonDelegatedEvents = new Set(['cancel', 'close', 'invalid', 'load', 'scroll', 'toggle'].concat(mediaEventTypes));
|
|
|
|
|
|
function executeDispatch(event, listener, currentTarget) {
|
|
|
var type = event.type || 'unknown-event';
|
|
|
event.currentTarget = currentTarget;
|
|
|
invokeGuardedCallbackAndCatchFirstError(type, listener, undefined, event);
|
|
|
event.currentTarget = null;
|
|
|
}
|
|
|
|
|
|
function processDispatchQueueItemsInOrder(event, dispatchListeners, inCapturePhase) {
|
|
|
var previousInstance;
|
|
|
|
|
|
if (inCapturePhase) {
|
|
|
for (var i = dispatchListeners.length - 1; i >= 0; i--) {
|
|
|
var _dispatchListeners$i = dispatchListeners[i],
|
|
|
instance = _dispatchListeners$i.instance,
|
|
|
currentTarget = _dispatchListeners$i.currentTarget,
|
|
|
listener = _dispatchListeners$i.listener;
|
|
|
|
|
|
if (instance !== previousInstance && event.isPropagationStopped()) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
executeDispatch(event, listener, currentTarget);
|
|
|
previousInstance = instance;
|
|
|
}
|
|
|
} else {
|
|
|
for (var _i = 0; _i < dispatchListeners.length; _i++) {
|
|
|
var _dispatchListeners$_i = dispatchListeners[_i],
|
|
|
_instance = _dispatchListeners$_i.instance,
|
|
|
_currentTarget = _dispatchListeners$_i.currentTarget,
|
|
|
_listener = _dispatchListeners$_i.listener;
|
|
|
|
|
|
if (_instance !== previousInstance && event.isPropagationStopped()) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
executeDispatch(event, _listener, _currentTarget);
|
|
|
previousInstance = _instance;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function processDispatchQueue(dispatchQueue, eventSystemFlags) {
|
|
|
var inCapturePhase = (eventSystemFlags & IS_CAPTURE_PHASE) !== 0;
|
|
|
|
|
|
for (var i = 0; i < dispatchQueue.length; i++) {
|
|
|
var _dispatchQueue$i = dispatchQueue[i],
|
|
|
event = _dispatchQueue$i.event,
|
|
|
listeners = _dispatchQueue$i.listeners;
|
|
|
processDispatchQueueItemsInOrder(event, listeners, inCapturePhase); // event system doesn't use pooling.
|
|
|
} // This would be a good time to rethrow if any of the event handlers threw.
|
|
|
|
|
|
|
|
|
rethrowCaughtError();
|
|
|
}
|
|
|
|
|
|
function dispatchEventsForPlugins(domEventName, eventSystemFlags, nativeEvent, targetInst, targetContainer) {
|
|
|
var nativeEventTarget = getEventTarget(nativeEvent);
|
|
|
var dispatchQueue = [];
|
|
|
extractEvents$5(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags);
|
|
|
processDispatchQueue(dispatchQueue, eventSystemFlags);
|
|
|
}
|
|
|
|
|
|
function listenToNonDelegatedEvent(domEventName, targetElement) {
|
|
|
{
|
|
|
if (!nonDelegatedEvents.has(domEventName)) {
|
|
|
error('Did not expect a listenToNonDelegatedEvent() call for "%s". ' + 'This is a bug in React. Please file an issue.', domEventName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var isCapturePhaseListener = false;
|
|
|
var listenerSet = getEventListenerSet(targetElement);
|
|
|
var listenerSetKey = getListenerSetKey(domEventName, isCapturePhaseListener);
|
|
|
|
|
|
if (!listenerSet.has(listenerSetKey)) {
|
|
|
addTrappedEventListener(targetElement, domEventName, IS_NON_DELEGATED, isCapturePhaseListener);
|
|
|
listenerSet.add(listenerSetKey);
|
|
|
}
|
|
|
}
|
|
|
function listenToNativeEvent(domEventName, isCapturePhaseListener, target) {
|
|
|
{
|
|
|
if (nonDelegatedEvents.has(domEventName) && !isCapturePhaseListener) {
|
|
|
error('Did not expect a listenToNativeEvent() call for "%s" in the bubble phase. ' + 'This is a bug in React. Please file an issue.', domEventName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var eventSystemFlags = 0;
|
|
|
|
|
|
if (isCapturePhaseListener) {
|
|
|
eventSystemFlags |= IS_CAPTURE_PHASE;
|
|
|
}
|
|
|
|
|
|
addTrappedEventListener(target, domEventName, eventSystemFlags, isCapturePhaseListener);
|
|
|
} // This is only used by createEventHandle when the
|
|
|
var listeningMarker = '_reactListening' + Math.random().toString(36).slice(2);
|
|
|
function listenToAllSupportedEvents(rootContainerElement) {
|
|
|
if (!rootContainerElement[listeningMarker]) {
|
|
|
rootContainerElement[listeningMarker] = true;
|
|
|
allNativeEvents.forEach(function (domEventName) {
|
|
|
// We handle selectionchange separately because it
|
|
|
// doesn't bubble and needs to be on the document.
|
|
|
if (domEventName !== 'selectionchange') {
|
|
|
if (!nonDelegatedEvents.has(domEventName)) {
|
|
|
listenToNativeEvent(domEventName, false, rootContainerElement);
|
|
|
}
|
|
|
|
|
|
listenToNativeEvent(domEventName, true, rootContainerElement);
|
|
|
}
|
|
|
});
|
|
|
var ownerDocument = rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument;
|
|
|
|
|
|
if (ownerDocument !== null) {
|
|
|
// The selectionchange event also needs deduplication
|
|
|
// but it is attached to the document.
|
|
|
if (!ownerDocument[listeningMarker]) {
|
|
|
ownerDocument[listeningMarker] = true;
|
|
|
listenToNativeEvent('selectionchange', false, ownerDocument);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function addTrappedEventListener(targetContainer, domEventName, eventSystemFlags, isCapturePhaseListener, isDeferredListenerForLegacyFBSupport) {
|
|
|
var listener = createEventListenerWrapperWithPriority(targetContainer, domEventName, eventSystemFlags); // If passive option is not supported, then the event will be
|
|
|
// active and not passive.
|
|
|
|
|
|
var isPassiveListener = undefined;
|
|
|
|
|
|
if (passiveBrowserEventsSupported) {
|
|
|
// Browsers introduced an intervention, making these events
|
|
|
// passive by default on document. React doesn't bind them
|
|
|
// to document anymore, but changing this now would undo
|
|
|
// the performance wins from the change. So we emulate
|
|
|
// the existing behavior manually on the roots now.
|
|
|
// https://github.com/facebook/react/issues/19651
|
|
|
if (domEventName === 'touchstart' || domEventName === 'touchmove' || domEventName === 'wheel') {
|
|
|
isPassiveListener = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
targetContainer = targetContainer;
|
|
|
var unsubscribeListener; // When legacyFBSupport is enabled, it's for when we
|
|
|
|
|
|
|
|
|
if (isCapturePhaseListener) {
|
|
|
if (isPassiveListener !== undefined) {
|
|
|
unsubscribeListener = addEventCaptureListenerWithPassiveFlag(targetContainer, domEventName, listener, isPassiveListener);
|
|
|
} else {
|
|
|
unsubscribeListener = addEventCaptureListener(targetContainer, domEventName, listener);
|
|
|
}
|
|
|
} else {
|
|
|
if (isPassiveListener !== undefined) {
|
|
|
unsubscribeListener = addEventBubbleListenerWithPassiveFlag(targetContainer, domEventName, listener, isPassiveListener);
|
|
|
} else {
|
|
|
unsubscribeListener = addEventBubbleListener(targetContainer, domEventName, listener);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isMatchingRootContainer(grandContainer, targetContainer) {
|
|
|
return grandContainer === targetContainer || grandContainer.nodeType === COMMENT_NODE && grandContainer.parentNode === targetContainer;
|
|
|
}
|
|
|
|
|
|
function dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, targetInst, targetContainer) {
|
|
|
var ancestorInst = targetInst;
|
|
|
|
|
|
if ((eventSystemFlags & IS_EVENT_HANDLE_NON_MANAGED_NODE) === 0 && (eventSystemFlags & IS_NON_DELEGATED) === 0) {
|
|
|
var targetContainerNode = targetContainer; // If we are using the legacy FB support flag, we
|
|
|
|
|
|
if (targetInst !== null) {
|
|
|
// The below logic attempts to work out if we need to change
|
|
|
// the target fiber to a different ancestor. We had similar logic
|
|
|
// in the legacy event system, except the big difference between
|
|
|
// systems is that the modern event system now has an event listener
|
|
|
// attached to each React Root and React Portal Root. Together,
|
|
|
// the DOM nodes representing these roots are the "rootContainer".
|
|
|
// To figure out which ancestor instance we should use, we traverse
|
|
|
// up the fiber tree from the target instance and attempt to find
|
|
|
// root boundaries that match that of our current "rootContainer".
|
|
|
// If we find that "rootContainer", we find the parent fiber
|
|
|
// sub-tree for that root and make that our ancestor instance.
|
|
|
var node = targetInst;
|
|
|
|
|
|
mainLoop: while (true) {
|
|
|
if (node === null) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var nodeTag = node.tag;
|
|
|
|
|
|
if (nodeTag === HostRoot || nodeTag === HostPortal) {
|
|
|
var container = node.stateNode.containerInfo;
|
|
|
|
|
|
if (isMatchingRootContainer(container, targetContainerNode)) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (nodeTag === HostPortal) {
|
|
|
// The target is a portal, but it's not the rootContainer we're looking for.
|
|
|
// Normally portals handle their own events all the way down to the root.
|
|
|
// So we should be able to stop now. However, we don't know if this portal
|
|
|
// was part of *our* root.
|
|
|
var grandNode = node.return;
|
|
|
|
|
|
while (grandNode !== null) {
|
|
|
var grandTag = grandNode.tag;
|
|
|
|
|
|
if (grandTag === HostRoot || grandTag === HostPortal) {
|
|
|
var grandContainer = grandNode.stateNode.containerInfo;
|
|
|
|
|
|
if (isMatchingRootContainer(grandContainer, targetContainerNode)) {
|
|
|
// This is the rootContainer we're looking for and we found it as
|
|
|
// a parent of the Portal. That means we can ignore it because the
|
|
|
// Portal will bubble through to us.
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
grandNode = grandNode.return;
|
|
|
}
|
|
|
} // Now we need to find it's corresponding host fiber in the other
|
|
|
// tree. To do this we can use getClosestInstanceFromNode, but we
|
|
|
// need to validate that the fiber is a host instance, otherwise
|
|
|
// we need to traverse up through the DOM till we find the correct
|
|
|
// node that is from the other tree.
|
|
|
|
|
|
|
|
|
while (container !== null) {
|
|
|
var parentNode = getClosestInstanceFromNode(container);
|
|
|
|
|
|
if (parentNode === null) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var parentTag = parentNode.tag;
|
|
|
|
|
|
if (parentTag === HostComponent || parentTag === HostText) {
|
|
|
node = ancestorInst = parentNode;
|
|
|
continue mainLoop;
|
|
|
}
|
|
|
|
|
|
container = container.parentNode;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
batchedUpdates(function () {
|
|
|
return dispatchEventsForPlugins(domEventName, eventSystemFlags, nativeEvent, ancestorInst);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function createDispatchListener(instance, listener, currentTarget) {
|
|
|
return {
|
|
|
instance: instance,
|
|
|
listener: listener,
|
|
|
currentTarget: currentTarget
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function accumulateSinglePhaseListeners(targetFiber, reactName, nativeEventType, inCapturePhase, accumulateTargetOnly, nativeEvent) {
|
|
|
var captureName = reactName !== null ? reactName + 'Capture' : null;
|
|
|
var reactEventName = inCapturePhase ? captureName : reactName;
|
|
|
var listeners = [];
|
|
|
var instance = targetFiber;
|
|
|
var lastHostComponent = null; // Accumulate all instances and listeners via the target -> root path.
|
|
|
|
|
|
while (instance !== null) {
|
|
|
var _instance2 = instance,
|
|
|
stateNode = _instance2.stateNode,
|
|
|
tag = _instance2.tag; // Handle listeners that are on HostComponents (i.e. <div>)
|
|
|
|
|
|
if (tag === HostComponent && stateNode !== null) {
|
|
|
lastHostComponent = stateNode; // createEventHandle listeners
|
|
|
|
|
|
|
|
|
if (reactEventName !== null) {
|
|
|
var listener = getListener(instance, reactEventName);
|
|
|
|
|
|
if (listener != null) {
|
|
|
listeners.push(createDispatchListener(instance, listener, lastHostComponent));
|
|
|
}
|
|
|
}
|
|
|
} // If we are only accumulating events for the target, then we don't
|
|
|
// continue to propagate through the React fiber tree to find other
|
|
|
// listeners.
|
|
|
|
|
|
|
|
|
if (accumulateTargetOnly) {
|
|
|
break;
|
|
|
} // If we are processing the onBeforeBlur event, then we need to take
|
|
|
|
|
|
instance = instance.return;
|
|
|
}
|
|
|
|
|
|
return listeners;
|
|
|
} // We should only use this function for:
|
|
|
// - BeforeInputEventPlugin
|
|
|
// - ChangeEventPlugin
|
|
|
// - SelectEventPlugin
|
|
|
// This is because we only process these plugins
|
|
|
// in the bubble phase, so we need to accumulate two
|
|
|
// phase event listeners (via emulation).
|
|
|
|
|
|
function accumulateTwoPhaseListeners(targetFiber, reactName) {
|
|
|
var captureName = reactName + 'Capture';
|
|
|
var listeners = [];
|
|
|
var instance = targetFiber; // Accumulate all instances and listeners via the target -> root path.
|
|
|
|
|
|
while (instance !== null) {
|
|
|
var _instance3 = instance,
|
|
|
stateNode = _instance3.stateNode,
|
|
|
tag = _instance3.tag; // Handle listeners that are on HostComponents (i.e. <div>)
|
|
|
|
|
|
if (tag === HostComponent && stateNode !== null) {
|
|
|
var currentTarget = stateNode;
|
|
|
var captureListener = getListener(instance, captureName);
|
|
|
|
|
|
if (captureListener != null) {
|
|
|
listeners.unshift(createDispatchListener(instance, captureListener, currentTarget));
|
|
|
}
|
|
|
|
|
|
var bubbleListener = getListener(instance, reactName);
|
|
|
|
|
|
if (bubbleListener != null) {
|
|
|
listeners.push(createDispatchListener(instance, bubbleListener, currentTarget));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
instance = instance.return;
|
|
|
}
|
|
|
|
|
|
return listeners;
|
|
|
}
|
|
|
|
|
|
function getParent(inst) {
|
|
|
if (inst === null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
do {
|
|
|
inst = inst.return; // TODO: If this is a HostRoot we might want to bail out.
|
|
|
// That is depending on if we want nested subtrees (layers) to bubble
|
|
|
// events to their parent. We could also go through parentNode on the
|
|
|
// host node but that wouldn't work for React Native and doesn't let us
|
|
|
// do the portal feature.
|
|
|
} while (inst && inst.tag !== HostComponent);
|
|
|
|
|
|
if (inst) {
|
|
|
return inst;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
/**
|
|
|
* Return the lowest common ancestor of A and B, or null if they are in
|
|
|
* different trees.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getLowestCommonAncestor(instA, instB) {
|
|
|
var nodeA = instA;
|
|
|
var nodeB = instB;
|
|
|
var depthA = 0;
|
|
|
|
|
|
for (var tempA = nodeA; tempA; tempA = getParent(tempA)) {
|
|
|
depthA++;
|
|
|
}
|
|
|
|
|
|
var depthB = 0;
|
|
|
|
|
|
for (var tempB = nodeB; tempB; tempB = getParent(tempB)) {
|
|
|
depthB++;
|
|
|
} // If A is deeper, crawl up.
|
|
|
|
|
|
|
|
|
while (depthA - depthB > 0) {
|
|
|
nodeA = getParent(nodeA);
|
|
|
depthA--;
|
|
|
} // If B is deeper, crawl up.
|
|
|
|
|
|
|
|
|
while (depthB - depthA > 0) {
|
|
|
nodeB = getParent(nodeB);
|
|
|
depthB--;
|
|
|
} // Walk in lockstep until we find a match.
|
|
|
|
|
|
|
|
|
var depth = depthA;
|
|
|
|
|
|
while (depth--) {
|
|
|
if (nodeA === nodeB || nodeB !== null && nodeA === nodeB.alternate) {
|
|
|
return nodeA;
|
|
|
}
|
|
|
|
|
|
nodeA = getParent(nodeA);
|
|
|
nodeB = getParent(nodeB);
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function accumulateEnterLeaveListenersForEvent(dispatchQueue, event, target, common, inCapturePhase) {
|
|
|
var registrationName = event._reactName;
|
|
|
var listeners = [];
|
|
|
var instance = target;
|
|
|
|
|
|
while (instance !== null) {
|
|
|
if (instance === common) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var _instance4 = instance,
|
|
|
alternate = _instance4.alternate,
|
|
|
stateNode = _instance4.stateNode,
|
|
|
tag = _instance4.tag;
|
|
|
|
|
|
if (alternate !== null && alternate === common) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (tag === HostComponent && stateNode !== null) {
|
|
|
var currentTarget = stateNode;
|
|
|
|
|
|
if (inCapturePhase) {
|
|
|
var captureListener = getListener(instance, registrationName);
|
|
|
|
|
|
if (captureListener != null) {
|
|
|
listeners.unshift(createDispatchListener(instance, captureListener, currentTarget));
|
|
|
}
|
|
|
} else if (!inCapturePhase) {
|
|
|
var bubbleListener = getListener(instance, registrationName);
|
|
|
|
|
|
if (bubbleListener != null) {
|
|
|
listeners.push(createDispatchListener(instance, bubbleListener, currentTarget));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
instance = instance.return;
|
|
|
}
|
|
|
|
|
|
if (listeners.length !== 0) {
|
|
|
dispatchQueue.push({
|
|
|
event: event,
|
|
|
listeners: listeners
|
|
|
});
|
|
|
}
|
|
|
} // We should only use this function for:
|
|
|
// - EnterLeaveEventPlugin
|
|
|
// This is because we only process this plugin
|
|
|
// in the bubble phase, so we need to accumulate two
|
|
|
// phase event listeners.
|
|
|
|
|
|
|
|
|
function accumulateEnterLeaveTwoPhaseListeners(dispatchQueue, leaveEvent, enterEvent, from, to) {
|
|
|
var common = from && to ? getLowestCommonAncestor(from, to) : null;
|
|
|
|
|
|
if (from !== null) {
|
|
|
accumulateEnterLeaveListenersForEvent(dispatchQueue, leaveEvent, from, common, false);
|
|
|
}
|
|
|
|
|
|
if (to !== null && enterEvent !== null) {
|
|
|
accumulateEnterLeaveListenersForEvent(dispatchQueue, enterEvent, to, common, true);
|
|
|
}
|
|
|
}
|
|
|
function getListenerSetKey(domEventName, capture) {
|
|
|
return domEventName + "__" + (capture ? 'capture' : 'bubble');
|
|
|
}
|
|
|
|
|
|
var didWarnInvalidHydration = false;
|
|
|
var DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML';
|
|
|
var SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning';
|
|
|
var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning';
|
|
|
var AUTOFOCUS = 'autoFocus';
|
|
|
var CHILDREN = 'children';
|
|
|
var STYLE = 'style';
|
|
|
var HTML$1 = '__html';
|
|
|
var warnedUnknownTags;
|
|
|
var validatePropertiesInDevelopment;
|
|
|
var warnForPropDifference;
|
|
|
var warnForExtraAttributes;
|
|
|
var warnForInvalidEventListener;
|
|
|
var canDiffStyleForHydrationWarning;
|
|
|
var normalizeHTML;
|
|
|
|
|
|
{
|
|
|
warnedUnknownTags = {
|
|
|
// There are working polyfills for <dialog>. Let people use it.
|
|
|
dialog: true,
|
|
|
// Electron ships a custom <webview> tag to display external web content in
|
|
|
// an isolated frame and process.
|
|
|
// This tag is not present in non Electron environments such as JSDom which
|
|
|
// is often used for testing purposes.
|
|
|
// @see https://electronjs.org/docs/api/webview-tag
|
|
|
webview: true
|
|
|
};
|
|
|
|
|
|
validatePropertiesInDevelopment = function (type, props) {
|
|
|
validateProperties(type, props);
|
|
|
validateProperties$1(type, props);
|
|
|
validateProperties$2(type, props, {
|
|
|
registrationNameDependencies: registrationNameDependencies,
|
|
|
possibleRegistrationNames: possibleRegistrationNames
|
|
|
});
|
|
|
}; // IE 11 parses & normalizes the style attribute as opposed to other
|
|
|
// browsers. It adds spaces and sorts the properties in some
|
|
|
// non-alphabetical order. Handling that would require sorting CSS
|
|
|
// properties in the client & server versions or applying
|
|
|
// `expectedStyle` to a temporary DOM node to read its `style` attribute
|
|
|
// normalized. Since it only affects IE, we're skipping style warnings
|
|
|
// in that browser completely in favor of doing all that work.
|
|
|
// See https://github.com/facebook/react/issues/11807
|
|
|
|
|
|
|
|
|
canDiffStyleForHydrationWarning = canUseDOM && !document.documentMode;
|
|
|
|
|
|
warnForPropDifference = function (propName, serverValue, clientValue) {
|
|
|
if (didWarnInvalidHydration) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var normalizedClientValue = normalizeMarkupForTextOrAttribute(clientValue);
|
|
|
var normalizedServerValue = normalizeMarkupForTextOrAttribute(serverValue);
|
|
|
|
|
|
if (normalizedServerValue === normalizedClientValue) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnInvalidHydration = true;
|
|
|
|
|
|
error('Prop `%s` did not match. Server: %s Client: %s', propName, JSON.stringify(normalizedServerValue), JSON.stringify(normalizedClientValue));
|
|
|
};
|
|
|
|
|
|
warnForExtraAttributes = function (attributeNames) {
|
|
|
if (didWarnInvalidHydration) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnInvalidHydration = true;
|
|
|
var names = [];
|
|
|
attributeNames.forEach(function (name) {
|
|
|
names.push(name);
|
|
|
});
|
|
|
|
|
|
error('Extra attributes from the server: %s', names);
|
|
|
};
|
|
|
|
|
|
warnForInvalidEventListener = function (registrationName, listener) {
|
|
|
if (listener === false) {
|
|
|
error('Expected `%s` listener to be a function, instead got `false`.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.', registrationName, registrationName, registrationName);
|
|
|
} else {
|
|
|
error('Expected `%s` listener to be a function, instead got a value of `%s` type.', registrationName, typeof listener);
|
|
|
}
|
|
|
}; // Parse the HTML and read it back to normalize the HTML string so that it
|
|
|
// can be used for comparison.
|
|
|
|
|
|
|
|
|
normalizeHTML = function (parent, html) {
|
|
|
// We could have created a separate document here to avoid
|
|
|
// re-initializing custom elements if they exist. But this breaks
|
|
|
// how <noscript> is being handled. So we use the same document.
|
|
|
// See the discussion in https://github.com/facebook/react/pull/11157.
|
|
|
var testElement = parent.namespaceURI === HTML_NAMESPACE ? parent.ownerDocument.createElement(parent.tagName) : parent.ownerDocument.createElementNS(parent.namespaceURI, parent.tagName);
|
|
|
testElement.innerHTML = html;
|
|
|
return testElement.innerHTML;
|
|
|
};
|
|
|
} // HTML parsing normalizes CR and CRLF to LF.
|
|
|
// It also can turn \u0000 into \uFFFD inside attributes.
|
|
|
// https://www.w3.org/TR/html5/single-page.html#preprocessing-the-input-stream
|
|
|
// If we have a mismatch, it might be caused by that.
|
|
|
// We will still patch up in this case but not fire the warning.
|
|
|
|
|
|
|
|
|
var NORMALIZE_NEWLINES_REGEX = /\r\n?/g;
|
|
|
var NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g;
|
|
|
|
|
|
function normalizeMarkupForTextOrAttribute(markup) {
|
|
|
{
|
|
|
checkHtmlStringCoercion(markup);
|
|
|
}
|
|
|
|
|
|
var markupString = typeof markup === 'string' ? markup : '' + markup;
|
|
|
return markupString.replace(NORMALIZE_NEWLINES_REGEX, '\n').replace(NORMALIZE_NULL_AND_REPLACEMENT_REGEX, '');
|
|
|
}
|
|
|
|
|
|
function checkForUnmatchedText(serverText, clientText, isConcurrentMode, shouldWarnDev) {
|
|
|
var normalizedClientText = normalizeMarkupForTextOrAttribute(clientText);
|
|
|
var normalizedServerText = normalizeMarkupForTextOrAttribute(serverText);
|
|
|
|
|
|
if (normalizedServerText === normalizedClientText) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (shouldWarnDev) {
|
|
|
{
|
|
|
if (!didWarnInvalidHydration) {
|
|
|
didWarnInvalidHydration = true;
|
|
|
|
|
|
error('Text content did not match. Server: "%s" Client: "%s"', normalizedServerText, normalizedClientText);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (isConcurrentMode && enableClientRenderFallbackOnTextMismatch) {
|
|
|
// In concurrent roots, we throw when there's a text mismatch and revert to
|
|
|
// client rendering, up to the nearest Suspense boundary.
|
|
|
throw new Error('Text content does not match server-rendered HTML.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getOwnerDocumentFromRootContainer(rootContainerElement) {
|
|
|
return rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument;
|
|
|
}
|
|
|
|
|
|
function noop() {}
|
|
|
|
|
|
function trapClickOnNonInteractiveElement(node) {
|
|
|
// Mobile Safari does not fire properly bubble click events on
|
|
|
// non-interactive elements, which means delegated click listeners do not
|
|
|
// fire. The workaround for this bug involves attaching an empty click
|
|
|
// listener on the target node.
|
|
|
// https://www.quirksmode.org/blog/archives/2010/09/click_event_del.html
|
|
|
// Just set it using the onclick property so that we don't have to manage any
|
|
|
// bookkeeping for it. Not sure if we need to clear it when the listener is
|
|
|
// removed.
|
|
|
// TODO: Only do this for the relevant Safaris maybe?
|
|
|
node.onclick = noop;
|
|
|
}
|
|
|
|
|
|
function setInitialDOMProperties(tag, domElement, rootContainerElement, nextProps, isCustomComponentTag) {
|
|
|
for (var propKey in nextProps) {
|
|
|
if (!nextProps.hasOwnProperty(propKey)) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var nextProp = nextProps[propKey];
|
|
|
|
|
|
if (propKey === STYLE) {
|
|
|
{
|
|
|
if (nextProp) {
|
|
|
// Freeze the next style object so that we can assume it won't be
|
|
|
// mutated. We have already warned for this in the past.
|
|
|
Object.freeze(nextProp);
|
|
|
}
|
|
|
} // Relies on `updateStylesByID` not mutating `styleUpdates`.
|
|
|
|
|
|
|
|
|
setValueForStyles(domElement, nextProp);
|
|
|
} else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
|
|
|
var nextHtml = nextProp ? nextProp[HTML$1] : undefined;
|
|
|
|
|
|
if (nextHtml != null) {
|
|
|
setInnerHTML(domElement, nextHtml);
|
|
|
}
|
|
|
} else if (propKey === CHILDREN) {
|
|
|
if (typeof nextProp === 'string') {
|
|
|
// Avoid setting initial textContent when the text is empty. In IE11 setting
|
|
|
// textContent on a <textarea> will cause the placeholder to not
|
|
|
// show within the <textarea> until it has been focused and blurred again.
|
|
|
// https://github.com/facebook/react/issues/6731#issuecomment-254874553
|
|
|
var canSetTextContent = tag !== 'textarea' || nextProp !== '';
|
|
|
|
|
|
if (canSetTextContent) {
|
|
|
setTextContent(domElement, nextProp);
|
|
|
}
|
|
|
} else if (typeof nextProp === 'number') {
|
|
|
setTextContent(domElement, '' + nextProp);
|
|
|
}
|
|
|
} else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (propKey === AUTOFOCUS) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) {
|
|
|
if (nextProp != null) {
|
|
|
if ( typeof nextProp !== 'function') {
|
|
|
warnForInvalidEventListener(propKey, nextProp);
|
|
|
}
|
|
|
|
|
|
if (propKey === 'onScroll') {
|
|
|
listenToNonDelegatedEvent('scroll', domElement);
|
|
|
}
|
|
|
}
|
|
|
} else if (nextProp != null) {
|
|
|
setValueForProperty(domElement, propKey, nextProp, isCustomComponentTag);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag) {
|
|
|
// TODO: Handle wasCustomComponentTag
|
|
|
for (var i = 0; i < updatePayload.length; i += 2) {
|
|
|
var propKey = updatePayload[i];
|
|
|
var propValue = updatePayload[i + 1];
|
|
|
|
|
|
if (propKey === STYLE) {
|
|
|
setValueForStyles(domElement, propValue);
|
|
|
} else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
|
|
|
setInnerHTML(domElement, propValue);
|
|
|
} else if (propKey === CHILDREN) {
|
|
|
setTextContent(domElement, propValue);
|
|
|
} else {
|
|
|
setValueForProperty(domElement, propKey, propValue, isCustomComponentTag);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function createElement(type, props, rootContainerElement, parentNamespace) {
|
|
|
var isCustomComponentTag; // We create tags in the namespace of their parent container, except HTML
|
|
|
// tags get no namespace.
|
|
|
|
|
|
var ownerDocument = getOwnerDocumentFromRootContainer(rootContainerElement);
|
|
|
var domElement;
|
|
|
var namespaceURI = parentNamespace;
|
|
|
|
|
|
if (namespaceURI === HTML_NAMESPACE) {
|
|
|
namespaceURI = getIntrinsicNamespace(type);
|
|
|
}
|
|
|
|
|
|
if (namespaceURI === HTML_NAMESPACE) {
|
|
|
{
|
|
|
isCustomComponentTag = isCustomComponent(type, props); // Should this check be gated by parent namespace? Not sure we want to
|
|
|
// allow <SVG> or <mATH>.
|
|
|
|
|
|
if (!isCustomComponentTag && type !== type.toLowerCase()) {
|
|
|
error('<%s /> is using incorrect casing. ' + 'Use PascalCase for React components, ' + 'or lowercase for HTML elements.', type);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (type === 'script') {
|
|
|
// Create the script via .innerHTML so its "parser-inserted" flag is
|
|
|
// set to true and it does not execute
|
|
|
var div = ownerDocument.createElement('div');
|
|
|
|
|
|
div.innerHTML = '<script><' + '/script>'; // eslint-disable-line
|
|
|
// This is guaranteed to yield a script element.
|
|
|
|
|
|
var firstChild = div.firstChild;
|
|
|
domElement = div.removeChild(firstChild);
|
|
|
} else if (typeof props.is === 'string') {
|
|
|
// $FlowIssue `createElement` should be updated for Web Components
|
|
|
domElement = ownerDocument.createElement(type, {
|
|
|
is: props.is
|
|
|
});
|
|
|
} else {
|
|
|
// Separate else branch instead of using `props.is || undefined` above because of a Firefox bug.
|
|
|
// See discussion in https://github.com/facebook/react/pull/6896
|
|
|
// and discussion in https://bugzilla.mozilla.org/show_bug.cgi?id=1276240
|
|
|
domElement = ownerDocument.createElement(type); // Normally attributes are assigned in `setInitialDOMProperties`, however the `multiple` and `size`
|
|
|
// attributes on `select`s needs to be added before `option`s are inserted.
|
|
|
// This prevents:
|
|
|
// - a bug where the `select` does not scroll to the correct option because singular
|
|
|
// `select` elements automatically pick the first item #13222
|
|
|
// - a bug where the `select` set the first item as selected despite the `size` attribute #14239
|
|
|
// See https://github.com/facebook/react/issues/13222
|
|
|
// and https://github.com/facebook/react/issues/14239
|
|
|
|
|
|
if (type === 'select') {
|
|
|
var node = domElement;
|
|
|
|
|
|
if (props.multiple) {
|
|
|
node.multiple = true;
|
|
|
} else if (props.size) {
|
|
|
// Setting a size greater than 1 causes a select to behave like `multiple=true`, where
|
|
|
// it is possible that no option is selected.
|
|
|
//
|
|
|
// This is only necessary when a select in "single selection mode".
|
|
|
node.size = props.size;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
domElement = ownerDocument.createElementNS(namespaceURI, type);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (namespaceURI === HTML_NAMESPACE) {
|
|
|
if (!isCustomComponentTag && Object.prototype.toString.call(domElement) === '[object HTMLUnknownElement]' && !hasOwnProperty.call(warnedUnknownTags, type)) {
|
|
|
warnedUnknownTags[type] = true;
|
|
|
|
|
|
error('The tag <%s> is unrecognized in this browser. ' + 'If you meant to render a React component, start its name with ' + 'an uppercase letter.', type);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return domElement;
|
|
|
}
|
|
|
function createTextNode(text, rootContainerElement) {
|
|
|
return getOwnerDocumentFromRootContainer(rootContainerElement).createTextNode(text);
|
|
|
}
|
|
|
function setInitialProperties(domElement, tag, rawProps, rootContainerElement) {
|
|
|
var isCustomComponentTag = isCustomComponent(tag, rawProps);
|
|
|
|
|
|
{
|
|
|
validatePropertiesInDevelopment(tag, rawProps);
|
|
|
} // TODO: Make sure that we check isMounted before firing any of these events.
|
|
|
|
|
|
|
|
|
var props;
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'dialog':
|
|
|
listenToNonDelegatedEvent('cancel', domElement);
|
|
|
listenToNonDelegatedEvent('close', domElement);
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'iframe':
|
|
|
case 'object':
|
|
|
case 'embed':
|
|
|
// We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the load event.
|
|
|
listenToNonDelegatedEvent('load', domElement);
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'video':
|
|
|
case 'audio':
|
|
|
// We listen to these events in case to ensure emulated bubble
|
|
|
// listeners still fire for all the media events.
|
|
|
for (var i = 0; i < mediaEventTypes.length; i++) {
|
|
|
listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
|
|
|
}
|
|
|
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'source':
|
|
|
// We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the error event.
|
|
|
listenToNonDelegatedEvent('error', domElement);
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'img':
|
|
|
case 'image':
|
|
|
case 'link':
|
|
|
// We listen to these events in case to ensure emulated bubble
|
|
|
// listeners still fire for error and load events.
|
|
|
listenToNonDelegatedEvent('error', domElement);
|
|
|
listenToNonDelegatedEvent('load', domElement);
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'details':
|
|
|
// We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the toggle event.
|
|
|
listenToNonDelegatedEvent('toggle', domElement);
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'input':
|
|
|
initWrapperState(domElement, rawProps);
|
|
|
props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the invalid event.
|
|
|
|
|
|
listenToNonDelegatedEvent('invalid', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'option':
|
|
|
validateProps(domElement, rawProps);
|
|
|
props = rawProps;
|
|
|
break;
|
|
|
|
|
|
case 'select':
|
|
|
initWrapperState$1(domElement, rawProps);
|
|
|
props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the invalid event.
|
|
|
|
|
|
listenToNonDelegatedEvent('invalid', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'textarea':
|
|
|
initWrapperState$2(domElement, rawProps);
|
|
|
props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the invalid event.
|
|
|
|
|
|
listenToNonDelegatedEvent('invalid', domElement);
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
props = rawProps;
|
|
|
}
|
|
|
|
|
|
assertValidProps(tag, props);
|
|
|
setInitialDOMProperties(tag, domElement, rootContainerElement, props, isCustomComponentTag);
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'input':
|
|
|
// TODO: Make sure we check if this is still unmounted or do any clean
|
|
|
// up necessary since we never stop tracking anymore.
|
|
|
track(domElement);
|
|
|
postMountWrapper(domElement, rawProps, false);
|
|
|
break;
|
|
|
|
|
|
case 'textarea':
|
|
|
// TODO: Make sure we check if this is still unmounted or do any clean
|
|
|
// up necessary since we never stop tracking anymore.
|
|
|
track(domElement);
|
|
|
postMountWrapper$3(domElement);
|
|
|
break;
|
|
|
|
|
|
case 'option':
|
|
|
postMountWrapper$1(domElement, rawProps);
|
|
|
break;
|
|
|
|
|
|
case 'select':
|
|
|
postMountWrapper$2(domElement, rawProps);
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
if (typeof props.onClick === 'function') {
|
|
|
// TODO: This cast may not be sound for SVG, MathML or custom elements.
|
|
|
trapClickOnNonInteractiveElement(domElement);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
} // Calculate the diff between the two objects.
|
|
|
|
|
|
function diffProperties(domElement, tag, lastRawProps, nextRawProps, rootContainerElement) {
|
|
|
{
|
|
|
validatePropertiesInDevelopment(tag, nextRawProps);
|
|
|
}
|
|
|
|
|
|
var updatePayload = null;
|
|
|
var lastProps;
|
|
|
var nextProps;
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'input':
|
|
|
lastProps = getHostProps(domElement, lastRawProps);
|
|
|
nextProps = getHostProps(domElement, nextRawProps);
|
|
|
updatePayload = [];
|
|
|
break;
|
|
|
|
|
|
case 'select':
|
|
|
lastProps = getHostProps$1(domElement, lastRawProps);
|
|
|
nextProps = getHostProps$1(domElement, nextRawProps);
|
|
|
updatePayload = [];
|
|
|
break;
|
|
|
|
|
|
case 'textarea':
|
|
|
lastProps = getHostProps$2(domElement, lastRawProps);
|
|
|
nextProps = getHostProps$2(domElement, nextRawProps);
|
|
|
updatePayload = [];
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
lastProps = lastRawProps;
|
|
|
nextProps = nextRawProps;
|
|
|
|
|
|
if (typeof lastProps.onClick !== 'function' && typeof nextProps.onClick === 'function') {
|
|
|
// TODO: This cast may not be sound for SVG, MathML or custom elements.
|
|
|
trapClickOnNonInteractiveElement(domElement);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
assertValidProps(tag, nextProps);
|
|
|
var propKey;
|
|
|
var styleName;
|
|
|
var styleUpdates = null;
|
|
|
|
|
|
for (propKey in lastProps) {
|
|
|
if (nextProps.hasOwnProperty(propKey) || !lastProps.hasOwnProperty(propKey) || lastProps[propKey] == null) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (propKey === STYLE) {
|
|
|
var lastStyle = lastProps[propKey];
|
|
|
|
|
|
for (styleName in lastStyle) {
|
|
|
if (lastStyle.hasOwnProperty(styleName)) {
|
|
|
if (!styleUpdates) {
|
|
|
styleUpdates = {};
|
|
|
}
|
|
|
|
|
|
styleUpdates[styleName] = '';
|
|
|
}
|
|
|
}
|
|
|
} else if (propKey === DANGEROUSLY_SET_INNER_HTML || propKey === CHILDREN) ; else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (propKey === AUTOFOCUS) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) {
|
|
|
// This is a special case. If any listener updates we need to ensure
|
|
|
// that the "current" fiber pointer gets updated so we need a commit
|
|
|
// to update this element.
|
|
|
if (!updatePayload) {
|
|
|
updatePayload = [];
|
|
|
}
|
|
|
} else {
|
|
|
// For all other deleted properties we add it to the queue. We use
|
|
|
// the allowed property list in the commit phase instead.
|
|
|
(updatePayload = updatePayload || []).push(propKey, null);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
for (propKey in nextProps) {
|
|
|
var nextProp = nextProps[propKey];
|
|
|
var lastProp = lastProps != null ? lastProps[propKey] : undefined;
|
|
|
|
|
|
if (!nextProps.hasOwnProperty(propKey) || nextProp === lastProp || nextProp == null && lastProp == null) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (propKey === STYLE) {
|
|
|
{
|
|
|
if (nextProp) {
|
|
|
// Freeze the next style object so that we can assume it won't be
|
|
|
// mutated. We have already warned for this in the past.
|
|
|
Object.freeze(nextProp);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (lastProp) {
|
|
|
// Unset styles on `lastProp` but not on `nextProp`.
|
|
|
for (styleName in lastProp) {
|
|
|
if (lastProp.hasOwnProperty(styleName) && (!nextProp || !nextProp.hasOwnProperty(styleName))) {
|
|
|
if (!styleUpdates) {
|
|
|
styleUpdates = {};
|
|
|
}
|
|
|
|
|
|
styleUpdates[styleName] = '';
|
|
|
}
|
|
|
} // Update styles that changed since `lastProp`.
|
|
|
|
|
|
|
|
|
for (styleName in nextProp) {
|
|
|
if (nextProp.hasOwnProperty(styleName) && lastProp[styleName] !== nextProp[styleName]) {
|
|
|
if (!styleUpdates) {
|
|
|
styleUpdates = {};
|
|
|
}
|
|
|
|
|
|
styleUpdates[styleName] = nextProp[styleName];
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
// Relies on `updateStylesByID` not mutating `styleUpdates`.
|
|
|
if (!styleUpdates) {
|
|
|
if (!updatePayload) {
|
|
|
updatePayload = [];
|
|
|
}
|
|
|
|
|
|
updatePayload.push(propKey, styleUpdates);
|
|
|
}
|
|
|
|
|
|
styleUpdates = nextProp;
|
|
|
}
|
|
|
} else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
|
|
|
var nextHtml = nextProp ? nextProp[HTML$1] : undefined;
|
|
|
var lastHtml = lastProp ? lastProp[HTML$1] : undefined;
|
|
|
|
|
|
if (nextHtml != null) {
|
|
|
if (lastHtml !== nextHtml) {
|
|
|
(updatePayload = updatePayload || []).push(propKey, nextHtml);
|
|
|
}
|
|
|
}
|
|
|
} else if (propKey === CHILDREN) {
|
|
|
if (typeof nextProp === 'string' || typeof nextProp === 'number') {
|
|
|
(updatePayload = updatePayload || []).push(propKey, '' + nextProp);
|
|
|
}
|
|
|
} else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) {
|
|
|
if (nextProp != null) {
|
|
|
// We eagerly listen to this even though we haven't committed yet.
|
|
|
if ( typeof nextProp !== 'function') {
|
|
|
warnForInvalidEventListener(propKey, nextProp);
|
|
|
}
|
|
|
|
|
|
if (propKey === 'onScroll') {
|
|
|
listenToNonDelegatedEvent('scroll', domElement);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (!updatePayload && lastProp !== nextProp) {
|
|
|
// This is a special case. If any listener updates we need to ensure
|
|
|
// that the "current" props pointer gets updated so we need a commit
|
|
|
// to update this element.
|
|
|
updatePayload = [];
|
|
|
}
|
|
|
} else {
|
|
|
// For any other property we always add it to the queue and then we
|
|
|
// filter it out using the allowed property list during the commit.
|
|
|
(updatePayload = updatePayload || []).push(propKey, nextProp);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (styleUpdates) {
|
|
|
{
|
|
|
validateShorthandPropertyCollisionInDev(styleUpdates, nextProps[STYLE]);
|
|
|
}
|
|
|
|
|
|
(updatePayload = updatePayload || []).push(STYLE, styleUpdates);
|
|
|
}
|
|
|
|
|
|
return updatePayload;
|
|
|
} // Apply the diff.
|
|
|
|
|
|
function updateProperties(domElement, updatePayload, tag, lastRawProps, nextRawProps) {
|
|
|
// Update checked *before* name.
|
|
|
// In the middle of an update, it is possible to have multiple checked.
|
|
|
// When a checked radio tries to change name, browser makes another radio's checked false.
|
|
|
if (tag === 'input' && nextRawProps.type === 'radio' && nextRawProps.name != null) {
|
|
|
updateChecked(domElement, nextRawProps);
|
|
|
}
|
|
|
|
|
|
var wasCustomComponentTag = isCustomComponent(tag, lastRawProps);
|
|
|
var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff.
|
|
|
|
|
|
updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag); // TODO: Ensure that an update gets scheduled if any of the special props
|
|
|
// changed.
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'input':
|
|
|
// Update the wrapper around inputs *after* updating props. This has to
|
|
|
// happen after `updateDOMProperties`. Otherwise HTML5 input validations
|
|
|
// raise warnings and prevent the new value from being assigned.
|
|
|
updateWrapper(domElement, nextRawProps);
|
|
|
break;
|
|
|
|
|
|
case 'textarea':
|
|
|
updateWrapper$1(domElement, nextRawProps);
|
|
|
break;
|
|
|
|
|
|
case 'select':
|
|
|
// <select> value update needs to occur after <option> children
|
|
|
// reconciliation
|
|
|
postUpdateWrapper(domElement, nextRawProps);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getPossibleStandardName(propName) {
|
|
|
{
|
|
|
var lowerCasedName = propName.toLowerCase();
|
|
|
|
|
|
if (!possibleStandardNames.hasOwnProperty(lowerCasedName)) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return possibleStandardNames[lowerCasedName] || null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function diffHydratedProperties(domElement, tag, rawProps, parentNamespace, rootContainerElement, isConcurrentMode, shouldWarnDev) {
|
|
|
var isCustomComponentTag;
|
|
|
var extraAttributeNames;
|
|
|
|
|
|
{
|
|
|
isCustomComponentTag = isCustomComponent(tag, rawProps);
|
|
|
validatePropertiesInDevelopment(tag, rawProps);
|
|
|
} // TODO: Make sure that we check isMounted before firing any of these events.
|
|
|
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'dialog':
|
|
|
listenToNonDelegatedEvent('cancel', domElement);
|
|
|
listenToNonDelegatedEvent('close', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'iframe':
|
|
|
case 'object':
|
|
|
case 'embed':
|
|
|
// We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the load event.
|
|
|
listenToNonDelegatedEvent('load', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'video':
|
|
|
case 'audio':
|
|
|
// We listen to these events in case to ensure emulated bubble
|
|
|
// listeners still fire for all the media events.
|
|
|
for (var i = 0; i < mediaEventTypes.length; i++) {
|
|
|
listenToNonDelegatedEvent(mediaEventTypes[i], domElement);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
case 'source':
|
|
|
// We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the error event.
|
|
|
listenToNonDelegatedEvent('error', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'img':
|
|
|
case 'image':
|
|
|
case 'link':
|
|
|
// We listen to these events in case to ensure emulated bubble
|
|
|
// listeners still fire for error and load events.
|
|
|
listenToNonDelegatedEvent('error', domElement);
|
|
|
listenToNonDelegatedEvent('load', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'details':
|
|
|
// We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the toggle event.
|
|
|
listenToNonDelegatedEvent('toggle', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'input':
|
|
|
initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the invalid event.
|
|
|
|
|
|
listenToNonDelegatedEvent('invalid', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'option':
|
|
|
validateProps(domElement, rawProps);
|
|
|
break;
|
|
|
|
|
|
case 'select':
|
|
|
initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the invalid event.
|
|
|
|
|
|
listenToNonDelegatedEvent('invalid', domElement);
|
|
|
break;
|
|
|
|
|
|
case 'textarea':
|
|
|
initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble
|
|
|
// listeners still fire for the invalid event.
|
|
|
|
|
|
listenToNonDelegatedEvent('invalid', domElement);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
assertValidProps(tag, rawProps);
|
|
|
|
|
|
{
|
|
|
extraAttributeNames = new Set();
|
|
|
var attributes = domElement.attributes;
|
|
|
|
|
|
for (var _i = 0; _i < attributes.length; _i++) {
|
|
|
var name = attributes[_i].name.toLowerCase();
|
|
|
|
|
|
switch (name) {
|
|
|
// Controlled attributes are not validated
|
|
|
// TODO: Only ignore them on controlled tags.
|
|
|
case 'value':
|
|
|
break;
|
|
|
|
|
|
case 'checked':
|
|
|
break;
|
|
|
|
|
|
case 'selected':
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
// Intentionally use the original name.
|
|
|
// See discussion in https://github.com/facebook/react/pull/10676.
|
|
|
extraAttributeNames.add(attributes[_i].name);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var updatePayload = null;
|
|
|
|
|
|
for (var propKey in rawProps) {
|
|
|
if (!rawProps.hasOwnProperty(propKey)) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
var nextProp = rawProps[propKey];
|
|
|
|
|
|
if (propKey === CHILDREN) {
|
|
|
// For text content children we compare against textContent. This
|
|
|
// might match additional HTML that is hidden when we read it using
|
|
|
// textContent. E.g. "foo" will match "f<span>oo</span>" but that still
|
|
|
// satisfies our requirement. Our requirement is not to produce perfect
|
|
|
// HTML and attributes. Ideally we should preserve structure but it's
|
|
|
// ok not to if the visible content is still enough to indicate what
|
|
|
// even listeners these nodes might be wired up to.
|
|
|
// TODO: Warn if there is more than a single textNode as a child.
|
|
|
// TODO: Should we use domElement.firstChild.nodeValue to compare?
|
|
|
if (typeof nextProp === 'string') {
|
|
|
if (domElement.textContent !== nextProp) {
|
|
|
if (rawProps[SUPPRESS_HYDRATION_WARNING] !== true) {
|
|
|
checkForUnmatchedText(domElement.textContent, nextProp, isConcurrentMode, shouldWarnDev);
|
|
|
}
|
|
|
|
|
|
updatePayload = [CHILDREN, nextProp];
|
|
|
}
|
|
|
} else if (typeof nextProp === 'number') {
|
|
|
if (domElement.textContent !== '' + nextProp) {
|
|
|
if (rawProps[SUPPRESS_HYDRATION_WARNING] !== true) {
|
|
|
checkForUnmatchedText(domElement.textContent, nextProp, isConcurrentMode, shouldWarnDev);
|
|
|
}
|
|
|
|
|
|
updatePayload = [CHILDREN, '' + nextProp];
|
|
|
}
|
|
|
}
|
|
|
} else if (registrationNameDependencies.hasOwnProperty(propKey)) {
|
|
|
if (nextProp != null) {
|
|
|
if ( typeof nextProp !== 'function') {
|
|
|
warnForInvalidEventListener(propKey, nextProp);
|
|
|
}
|
|
|
|
|
|
if (propKey === 'onScroll') {
|
|
|
listenToNonDelegatedEvent('scroll', domElement);
|
|
|
}
|
|
|
}
|
|
|
} else if (shouldWarnDev && true && // Convince Flow we've calculated it (it's DEV-only in this method.)
|
|
|
typeof isCustomComponentTag === 'boolean') {
|
|
|
// Validate that the properties correspond to their expected values.
|
|
|
var serverValue = void 0;
|
|
|
var propertyInfo = isCustomComponentTag && enableCustomElementPropertySupport ? null : getPropertyInfo(propKey);
|
|
|
|
|
|
if (rawProps[SUPPRESS_HYDRATION_WARNING] === true) ; else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING || // Controlled attributes are not validated
|
|
|
// TODO: Only ignore them on controlled tags.
|
|
|
propKey === 'value' || propKey === 'checked' || propKey === 'selected') ; else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
|
|
|
var serverHTML = domElement.innerHTML;
|
|
|
var nextHtml = nextProp ? nextProp[HTML$1] : undefined;
|
|
|
|
|
|
if (nextHtml != null) {
|
|
|
var expectedHTML = normalizeHTML(domElement, nextHtml);
|
|
|
|
|
|
if (expectedHTML !== serverHTML) {
|
|
|
warnForPropDifference(propKey, serverHTML, expectedHTML);
|
|
|
}
|
|
|
}
|
|
|
} else if (propKey === STYLE) {
|
|
|
// $FlowFixMe - Should be inferred as not undefined.
|
|
|
extraAttributeNames.delete(propKey);
|
|
|
|
|
|
if (canDiffStyleForHydrationWarning) {
|
|
|
var expectedStyle = createDangerousStringForStyles(nextProp);
|
|
|
serverValue = domElement.getAttribute('style');
|
|
|
|
|
|
if (expectedStyle !== serverValue) {
|
|
|
warnForPropDifference(propKey, serverValue, expectedStyle);
|
|
|
}
|
|
|
}
|
|
|
} else if (isCustomComponentTag && !enableCustomElementPropertySupport) {
|
|
|
// $FlowFixMe - Should be inferred as not undefined.
|
|
|
extraAttributeNames.delete(propKey.toLowerCase());
|
|
|
serverValue = getValueForAttribute(domElement, propKey, nextProp);
|
|
|
|
|
|
if (nextProp !== serverValue) {
|
|
|
warnForPropDifference(propKey, serverValue, nextProp);
|
|
|
}
|
|
|
} else if (!shouldIgnoreAttribute(propKey, propertyInfo, isCustomComponentTag) && !shouldRemoveAttribute(propKey, nextProp, propertyInfo, isCustomComponentTag)) {
|
|
|
var isMismatchDueToBadCasing = false;
|
|
|
|
|
|
if (propertyInfo !== null) {
|
|
|
// $FlowFixMe - Should be inferred as not undefined.
|
|
|
extraAttributeNames.delete(propertyInfo.attributeName);
|
|
|
serverValue = getValueForProperty(domElement, propKey, nextProp, propertyInfo);
|
|
|
} else {
|
|
|
var ownNamespace = parentNamespace;
|
|
|
|
|
|
if (ownNamespace === HTML_NAMESPACE) {
|
|
|
ownNamespace = getIntrinsicNamespace(tag);
|
|
|
}
|
|
|
|
|
|
if (ownNamespace === HTML_NAMESPACE) {
|
|
|
// $FlowFixMe - Should be inferred as not undefined.
|
|
|
extraAttributeNames.delete(propKey.toLowerCase());
|
|
|
} else {
|
|
|
var standardName = getPossibleStandardName(propKey);
|
|
|
|
|
|
if (standardName !== null && standardName !== propKey) {
|
|
|
// If an SVG prop is supplied with bad casing, it will
|
|
|
// be successfully parsed from HTML, but will produce a mismatch
|
|
|
// (and would be incorrectly rendered on the client).
|
|
|
// However, we already warn about bad casing elsewhere.
|
|
|
// So we'll skip the misleading extra mismatch warning in this case.
|
|
|
isMismatchDueToBadCasing = true; // $FlowFixMe - Should be inferred as not undefined.
|
|
|
|
|
|
extraAttributeNames.delete(standardName);
|
|
|
} // $FlowFixMe - Should be inferred as not undefined.
|
|
|
|
|
|
|
|
|
extraAttributeNames.delete(propKey);
|
|
|
}
|
|
|
|
|
|
serverValue = getValueForAttribute(domElement, propKey, nextProp);
|
|
|
}
|
|
|
|
|
|
var dontWarnCustomElement = enableCustomElementPropertySupport ;
|
|
|
|
|
|
if (!dontWarnCustomElement && nextProp !== serverValue && !isMismatchDueToBadCasing) {
|
|
|
warnForPropDifference(propKey, serverValue, nextProp);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (shouldWarnDev) {
|
|
|
if ( // $FlowFixMe - Should be inferred as not undefined.
|
|
|
extraAttributeNames.size > 0 && rawProps[SUPPRESS_HYDRATION_WARNING] !== true) {
|
|
|
// $FlowFixMe - Should be inferred as not undefined.
|
|
|
warnForExtraAttributes(extraAttributeNames);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'input':
|
|
|
// TODO: Make sure we check if this is still unmounted or do any clean
|
|
|
// up necessary since we never stop tracking anymore.
|
|
|
track(domElement);
|
|
|
postMountWrapper(domElement, rawProps, true);
|
|
|
break;
|
|
|
|
|
|
case 'textarea':
|
|
|
// TODO: Make sure we check if this is still unmounted or do any clean
|
|
|
// up necessary since we never stop tracking anymore.
|
|
|
track(domElement);
|
|
|
postMountWrapper$3(domElement);
|
|
|
break;
|
|
|
|
|
|
case 'select':
|
|
|
case 'option':
|
|
|
// For input and textarea we current always set the value property at
|
|
|
// post mount to force it to diverge from attributes. However, for
|
|
|
// option and select we don't quite do the same thing and select
|
|
|
// is not resilient to the DOM state changing so we don't do that here.
|
|
|
// TODO: Consider not doing this for input and textarea.
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
if (typeof rawProps.onClick === 'function') {
|
|
|
// TODO: This cast may not be sound for SVG, MathML or custom elements.
|
|
|
trapClickOnNonInteractiveElement(domElement);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
return updatePayload;
|
|
|
}
|
|
|
function diffHydratedText(textNode, text, isConcurrentMode) {
|
|
|
var isDifferent = textNode.nodeValue !== text;
|
|
|
return isDifferent;
|
|
|
}
|
|
|
function warnForDeletedHydratableElement(parentNode, child) {
|
|
|
{
|
|
|
if (didWarnInvalidHydration) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnInvalidHydration = true;
|
|
|
|
|
|
error('Did not expect server HTML to contain a <%s> in <%s>.', child.nodeName.toLowerCase(), parentNode.nodeName.toLowerCase());
|
|
|
}
|
|
|
}
|
|
|
function warnForDeletedHydratableText(parentNode, child) {
|
|
|
{
|
|
|
if (didWarnInvalidHydration) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnInvalidHydration = true;
|
|
|
|
|
|
error('Did not expect server HTML to contain the text node "%s" in <%s>.', child.nodeValue, parentNode.nodeName.toLowerCase());
|
|
|
}
|
|
|
}
|
|
|
function warnForInsertedHydratedElement(parentNode, tag, props) {
|
|
|
{
|
|
|
if (didWarnInvalidHydration) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnInvalidHydration = true;
|
|
|
|
|
|
error('Expected server HTML to contain a matching <%s> in <%s>.', tag, parentNode.nodeName.toLowerCase());
|
|
|
}
|
|
|
}
|
|
|
function warnForInsertedHydratedText(parentNode, text) {
|
|
|
{
|
|
|
if (text === '') {
|
|
|
// We expect to insert empty text nodes since they're not represented in
|
|
|
// the HTML.
|
|
|
// TODO: Remove this special case if we can just avoid inserting empty
|
|
|
// text nodes.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (didWarnInvalidHydration) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnInvalidHydration = true;
|
|
|
|
|
|
error('Expected server HTML to contain a matching text node for "%s" in <%s>.', text, parentNode.nodeName.toLowerCase());
|
|
|
}
|
|
|
}
|
|
|
function restoreControlledState$3(domElement, tag, props) {
|
|
|
switch (tag) {
|
|
|
case 'input':
|
|
|
restoreControlledState(domElement, props);
|
|
|
return;
|
|
|
|
|
|
case 'textarea':
|
|
|
restoreControlledState$2(domElement, props);
|
|
|
return;
|
|
|
|
|
|
case 'select':
|
|
|
restoreControlledState$1(domElement, props);
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var validateDOMNesting = function () {};
|
|
|
|
|
|
var updatedAncestorInfo = function () {};
|
|
|
|
|
|
{
|
|
|
// This validation code was written based on the HTML5 parsing spec:
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope
|
|
|
//
|
|
|
// Note: this does not catch all invalid nesting, nor does it try to (as it's
|
|
|
// not clear what practical benefit doing so provides); instead, we warn only
|
|
|
// for cases where the parser will give a parse tree differing from what React
|
|
|
// intended. For example, <b><div></div></b> is invalid but we don't warn
|
|
|
// because it still parses correctly; we do warn for other cases like nested
|
|
|
// <p> tags where the beginning of the second element implicitly closes the
|
|
|
// first, causing a confusing mess.
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#special
|
|
|
var specialTags = ['address', 'applet', 'area', 'article', 'aside', 'base', 'basefont', 'bgsound', 'blockquote', 'body', 'br', 'button', 'caption', 'center', 'col', 'colgroup', 'dd', 'details', 'dir', 'div', 'dl', 'dt', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'frame', 'frameset', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'iframe', 'img', 'input', 'isindex', 'li', 'link', 'listing', 'main', 'marquee', 'menu', 'menuitem', 'meta', 'nav', 'noembed', 'noframes', 'noscript', 'object', 'ol', 'p', 'param', 'plaintext', 'pre', 'script', 'section', 'select', 'source', 'style', 'summary', 'table', 'tbody', 'td', 'template', 'textarea', 'tfoot', 'th', 'thead', 'title', 'tr', 'track', 'ul', 'wbr', 'xmp']; // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope
|
|
|
|
|
|
var inScopeTags = ['applet', 'caption', 'html', 'table', 'td', 'th', 'marquee', 'object', 'template', // https://html.spec.whatwg.org/multipage/syntax.html#html-integration-point
|
|
|
// TODO: Distinguish by namespace here -- for <title>, including it here
|
|
|
// errs on the side of fewer warnings
|
|
|
'foreignObject', 'desc', 'title']; // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-button-scope
|
|
|
|
|
|
var buttonScopeTags = inScopeTags.concat(['button']); // https://html.spec.whatwg.org/multipage/syntax.html#generate-implied-end-tags
|
|
|
|
|
|
var impliedEndTags = ['dd', 'dt', 'li', 'option', 'optgroup', 'p', 'rp', 'rt'];
|
|
|
var emptyAncestorInfo = {
|
|
|
current: null,
|
|
|
formTag: null,
|
|
|
aTagInScope: null,
|
|
|
buttonTagInScope: null,
|
|
|
nobrTagInScope: null,
|
|
|
pTagInButtonScope: null,
|
|
|
listItemTagAutoclosing: null,
|
|
|
dlItemTagAutoclosing: null
|
|
|
};
|
|
|
|
|
|
updatedAncestorInfo = function (oldInfo, tag) {
|
|
|
var ancestorInfo = assign({}, oldInfo || emptyAncestorInfo);
|
|
|
|
|
|
var info = {
|
|
|
tag: tag
|
|
|
};
|
|
|
|
|
|
if (inScopeTags.indexOf(tag) !== -1) {
|
|
|
ancestorInfo.aTagInScope = null;
|
|
|
ancestorInfo.buttonTagInScope = null;
|
|
|
ancestorInfo.nobrTagInScope = null;
|
|
|
}
|
|
|
|
|
|
if (buttonScopeTags.indexOf(tag) !== -1) {
|
|
|
ancestorInfo.pTagInButtonScope = null;
|
|
|
} // See rules for 'li', 'dd', 'dt' start tags in
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody
|
|
|
|
|
|
|
|
|
if (specialTags.indexOf(tag) !== -1 && tag !== 'address' && tag !== 'div' && tag !== 'p') {
|
|
|
ancestorInfo.listItemTagAutoclosing = null;
|
|
|
ancestorInfo.dlItemTagAutoclosing = null;
|
|
|
}
|
|
|
|
|
|
ancestorInfo.current = info;
|
|
|
|
|
|
if (tag === 'form') {
|
|
|
ancestorInfo.formTag = info;
|
|
|
}
|
|
|
|
|
|
if (tag === 'a') {
|
|
|
ancestorInfo.aTagInScope = info;
|
|
|
}
|
|
|
|
|
|
if (tag === 'button') {
|
|
|
ancestorInfo.buttonTagInScope = info;
|
|
|
}
|
|
|
|
|
|
if (tag === 'nobr') {
|
|
|
ancestorInfo.nobrTagInScope = info;
|
|
|
}
|
|
|
|
|
|
if (tag === 'p') {
|
|
|
ancestorInfo.pTagInButtonScope = info;
|
|
|
}
|
|
|
|
|
|
if (tag === 'li') {
|
|
|
ancestorInfo.listItemTagAutoclosing = info;
|
|
|
}
|
|
|
|
|
|
if (tag === 'dd' || tag === 'dt') {
|
|
|
ancestorInfo.dlItemTagAutoclosing = info;
|
|
|
}
|
|
|
|
|
|
return ancestorInfo;
|
|
|
};
|
|
|
/**
|
|
|
* Returns whether
|
|
|
*/
|
|
|
|
|
|
|
|
|
var isTagValidWithParent = function (tag, parentTag) {
|
|
|
// First, let's check if we're in an unusual parsing mode...
|
|
|
switch (parentTag) {
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inselect
|
|
|
case 'select':
|
|
|
return tag === 'option' || tag === 'optgroup' || tag === '#text';
|
|
|
|
|
|
case 'optgroup':
|
|
|
return tag === 'option' || tag === '#text';
|
|
|
// Strictly speaking, seeing an <option> doesn't mean we're in a <select>
|
|
|
// but
|
|
|
|
|
|
case 'option':
|
|
|
return tag === '#text';
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intd
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incaption
|
|
|
// No special behavior since these rules fall back to "in body" mode for
|
|
|
// all except special table nodes which cause bad parsing behavior anyway.
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intr
|
|
|
|
|
|
case 'tr':
|
|
|
return tag === 'th' || tag === 'td' || tag === 'style' || tag === 'script' || tag === 'template';
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intbody
|
|
|
|
|
|
case 'tbody':
|
|
|
case 'thead':
|
|
|
case 'tfoot':
|
|
|
return tag === 'tr' || tag === 'style' || tag === 'script' || tag === 'template';
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incolgroup
|
|
|
|
|
|
case 'colgroup':
|
|
|
return tag === 'col' || tag === 'template';
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intable
|
|
|
|
|
|
case 'table':
|
|
|
return tag === 'caption' || tag === 'colgroup' || tag === 'tbody' || tag === 'tfoot' || tag === 'thead' || tag === 'style' || tag === 'script' || tag === 'template';
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inhead
|
|
|
|
|
|
case 'head':
|
|
|
return tag === 'base' || tag === 'basefont' || tag === 'bgsound' || tag === 'link' || tag === 'meta' || tag === 'title' || tag === 'noscript' || tag === 'noframes' || tag === 'style' || tag === 'script' || tag === 'template';
|
|
|
// https://html.spec.whatwg.org/multipage/semantics.html#the-html-element
|
|
|
|
|
|
case 'html':
|
|
|
return tag === 'head' || tag === 'body' || tag === 'frameset';
|
|
|
|
|
|
case 'frameset':
|
|
|
return tag === 'frame';
|
|
|
|
|
|
case '#document':
|
|
|
return tag === 'html';
|
|
|
} // Probably in the "in body" parsing mode, so we outlaw only tag combos
|
|
|
// where the parsing rules cause implicit opens or closes to be added.
|
|
|
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody
|
|
|
|
|
|
|
|
|
switch (tag) {
|
|
|
case 'h1':
|
|
|
case 'h2':
|
|
|
case 'h3':
|
|
|
case 'h4':
|
|
|
case 'h5':
|
|
|
case 'h6':
|
|
|
return parentTag !== 'h1' && parentTag !== 'h2' && parentTag !== 'h3' && parentTag !== 'h4' && parentTag !== 'h5' && parentTag !== 'h6';
|
|
|
|
|
|
case 'rp':
|
|
|
case 'rt':
|
|
|
return impliedEndTags.indexOf(parentTag) === -1;
|
|
|
|
|
|
case 'body':
|
|
|
case 'caption':
|
|
|
case 'col':
|
|
|
case 'colgroup':
|
|
|
case 'frameset':
|
|
|
case 'frame':
|
|
|
case 'head':
|
|
|
case 'html':
|
|
|
case 'tbody':
|
|
|
case 'td':
|
|
|
case 'tfoot':
|
|
|
case 'th':
|
|
|
case 'thead':
|
|
|
case 'tr':
|
|
|
// These tags are only valid with a few parents that have special child
|
|
|
// parsing rules -- if we're down here, then none of those matched and
|
|
|
// so we allow it only if we don't know what the parent is, as all other
|
|
|
// cases are invalid.
|
|
|
return parentTag == null;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
};
|
|
|
/**
|
|
|
* Returns whether
|
|
|
*/
|
|
|
|
|
|
|
|
|
var findInvalidAncestorForTag = function (tag, ancestorInfo) {
|
|
|
switch (tag) {
|
|
|
case 'address':
|
|
|
case 'article':
|
|
|
case 'aside':
|
|
|
case 'blockquote':
|
|
|
case 'center':
|
|
|
case 'details':
|
|
|
case 'dialog':
|
|
|
case 'dir':
|
|
|
case 'div':
|
|
|
case 'dl':
|
|
|
case 'fieldset':
|
|
|
case 'figcaption':
|
|
|
case 'figure':
|
|
|
case 'footer':
|
|
|
case 'header':
|
|
|
case 'hgroup':
|
|
|
case 'main':
|
|
|
case 'menu':
|
|
|
case 'nav':
|
|
|
case 'ol':
|
|
|
case 'p':
|
|
|
case 'section':
|
|
|
case 'summary':
|
|
|
case 'ul':
|
|
|
case 'pre':
|
|
|
case 'listing':
|
|
|
case 'table':
|
|
|
case 'hr':
|
|
|
case 'xmp':
|
|
|
case 'h1':
|
|
|
case 'h2':
|
|
|
case 'h3':
|
|
|
case 'h4':
|
|
|
case 'h5':
|
|
|
case 'h6':
|
|
|
return ancestorInfo.pTagInButtonScope;
|
|
|
|
|
|
case 'form':
|
|
|
return ancestorInfo.formTag || ancestorInfo.pTagInButtonScope;
|
|
|
|
|
|
case 'li':
|
|
|
return ancestorInfo.listItemTagAutoclosing;
|
|
|
|
|
|
case 'dd':
|
|
|
case 'dt':
|
|
|
return ancestorInfo.dlItemTagAutoclosing;
|
|
|
|
|
|
case 'button':
|
|
|
return ancestorInfo.buttonTagInScope;
|
|
|
|
|
|
case 'a':
|
|
|
// Spec says something about storing a list of markers, but it sounds
|
|
|
// equivalent to this check.
|
|
|
return ancestorInfo.aTagInScope;
|
|
|
|
|
|
case 'nobr':
|
|
|
return ancestorInfo.nobrTagInScope;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
};
|
|
|
|
|
|
var didWarn$1 = {};
|
|
|
|
|
|
validateDOMNesting = function (childTag, childText, ancestorInfo) {
|
|
|
ancestorInfo = ancestorInfo || emptyAncestorInfo;
|
|
|
var parentInfo = ancestorInfo.current;
|
|
|
var parentTag = parentInfo && parentInfo.tag;
|
|
|
|
|
|
if (childText != null) {
|
|
|
if (childTag != null) {
|
|
|
error('validateDOMNesting: when childText is passed, childTag should be null');
|
|
|
}
|
|
|
|
|
|
childTag = '#text';
|
|
|
}
|
|
|
|
|
|
var invalidParent = isTagValidWithParent(childTag, parentTag) ? null : parentInfo;
|
|
|
var invalidAncestor = invalidParent ? null : findInvalidAncestorForTag(childTag, ancestorInfo);
|
|
|
var invalidParentOrAncestor = invalidParent || invalidAncestor;
|
|
|
|
|
|
if (!invalidParentOrAncestor) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var ancestorTag = invalidParentOrAncestor.tag;
|
|
|
var warnKey = !!invalidParent + '|' + childTag + '|' + ancestorTag;
|
|
|
|
|
|
if (didWarn$1[warnKey]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarn$1[warnKey] = true;
|
|
|
var tagDisplayName = childTag;
|
|
|
var whitespaceInfo = '';
|
|
|
|
|
|
if (childTag === '#text') {
|
|
|
if (/\S/.test(childText)) {
|
|
|
tagDisplayName = 'Text nodes';
|
|
|
} else {
|
|
|
tagDisplayName = 'Whitespace text nodes';
|
|
|
whitespaceInfo = " Make sure you don't have any extra whitespace between tags on " + 'each line of your source code.';
|
|
|
}
|
|
|
} else {
|
|
|
tagDisplayName = '<' + childTag + '>';
|
|
|
}
|
|
|
|
|
|
if (invalidParent) {
|
|
|
var info = '';
|
|
|
|
|
|
if (ancestorTag === 'table' && childTag === 'tr') {
|
|
|
info += ' Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated by ' + 'the browser.';
|
|
|
}
|
|
|
|
|
|
error('validateDOMNesting(...): %s cannot appear as a child of <%s>.%s%s', tagDisplayName, ancestorTag, whitespaceInfo, info);
|
|
|
} else {
|
|
|
error('validateDOMNesting(...): %s cannot appear as a descendant of ' + '<%s>.', tagDisplayName, ancestorTag);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var SUPPRESS_HYDRATION_WARNING$1 = 'suppressHydrationWarning';
|
|
|
var SUSPENSE_START_DATA = '$';
|
|
|
var SUSPENSE_END_DATA = '/$';
|
|
|
var SUSPENSE_PENDING_START_DATA = '$?';
|
|
|
var SUSPENSE_FALLBACK_START_DATA = '$!';
|
|
|
var STYLE$1 = 'style';
|
|
|
var eventsEnabled = null;
|
|
|
var selectionInformation = null;
|
|
|
function getRootHostContext(rootContainerInstance) {
|
|
|
var type;
|
|
|
var namespace;
|
|
|
var nodeType = rootContainerInstance.nodeType;
|
|
|
|
|
|
switch (nodeType) {
|
|
|
case DOCUMENT_NODE:
|
|
|
case DOCUMENT_FRAGMENT_NODE:
|
|
|
{
|
|
|
type = nodeType === DOCUMENT_NODE ? '#document' : '#fragment';
|
|
|
var root = rootContainerInstance.documentElement;
|
|
|
namespace = root ? root.namespaceURI : getChildNamespace(null, '');
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
var container = nodeType === COMMENT_NODE ? rootContainerInstance.parentNode : rootContainerInstance;
|
|
|
var ownNamespace = container.namespaceURI || null;
|
|
|
type = container.tagName;
|
|
|
namespace = getChildNamespace(ownNamespace, type);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var validatedTag = type.toLowerCase();
|
|
|
var ancestorInfo = updatedAncestorInfo(null, validatedTag);
|
|
|
return {
|
|
|
namespace: namespace,
|
|
|
ancestorInfo: ancestorInfo
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
function getChildHostContext(parentHostContext, type, rootContainerInstance) {
|
|
|
{
|
|
|
var parentHostContextDev = parentHostContext;
|
|
|
var namespace = getChildNamespace(parentHostContextDev.namespace, type);
|
|
|
var ancestorInfo = updatedAncestorInfo(parentHostContextDev.ancestorInfo, type);
|
|
|
return {
|
|
|
namespace: namespace,
|
|
|
ancestorInfo: ancestorInfo
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
function getPublicInstance(instance) {
|
|
|
return instance;
|
|
|
}
|
|
|
function prepareForCommit(containerInfo) {
|
|
|
eventsEnabled = isEnabled();
|
|
|
selectionInformation = getSelectionInformation();
|
|
|
var activeInstance = null;
|
|
|
|
|
|
setEnabled(false);
|
|
|
return activeInstance;
|
|
|
}
|
|
|
function resetAfterCommit(containerInfo) {
|
|
|
restoreSelection(selectionInformation);
|
|
|
setEnabled(eventsEnabled);
|
|
|
eventsEnabled = null;
|
|
|
selectionInformation = null;
|
|
|
}
|
|
|
function createInstance(type, props, rootContainerInstance, hostContext, internalInstanceHandle) {
|
|
|
var parentNamespace;
|
|
|
|
|
|
{
|
|
|
// TODO: take namespace into account when validating.
|
|
|
var hostContextDev = hostContext;
|
|
|
validateDOMNesting(type, null, hostContextDev.ancestorInfo);
|
|
|
|
|
|
if (typeof props.children === 'string' || typeof props.children === 'number') {
|
|
|
var string = '' + props.children;
|
|
|
var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type);
|
|
|
validateDOMNesting(null, string, ownAncestorInfo);
|
|
|
}
|
|
|
|
|
|
parentNamespace = hostContextDev.namespace;
|
|
|
}
|
|
|
|
|
|
var domElement = createElement(type, props, rootContainerInstance, parentNamespace);
|
|
|
precacheFiberNode(internalInstanceHandle, domElement);
|
|
|
updateFiberProps(domElement, props);
|
|
|
return domElement;
|
|
|
}
|
|
|
function appendInitialChild(parentInstance, child) {
|
|
|
parentInstance.appendChild(child);
|
|
|
}
|
|
|
function finalizeInitialChildren(domElement, type, props, rootContainerInstance, hostContext) {
|
|
|
setInitialProperties(domElement, type, props, rootContainerInstance);
|
|
|
|
|
|
switch (type) {
|
|
|
case 'button':
|
|
|
case 'input':
|
|
|
case 'select':
|
|
|
case 'textarea':
|
|
|
return !!props.autoFocus;
|
|
|
|
|
|
case 'img':
|
|
|
return true;
|
|
|
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
function prepareUpdate(domElement, type, oldProps, newProps, rootContainerInstance, hostContext) {
|
|
|
{
|
|
|
var hostContextDev = hostContext;
|
|
|
|
|
|
if (typeof newProps.children !== typeof oldProps.children && (typeof newProps.children === 'string' || typeof newProps.children === 'number')) {
|
|
|
var string = '' + newProps.children;
|
|
|
var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type);
|
|
|
validateDOMNesting(null, string, ownAncestorInfo);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return diffProperties(domElement, type, oldProps, newProps);
|
|
|
}
|
|
|
function shouldSetTextContent(type, props) {
|
|
|
return type === 'textarea' || type === 'noscript' || typeof props.children === 'string' || typeof props.children === 'number' || typeof props.dangerouslySetInnerHTML === 'object' && props.dangerouslySetInnerHTML !== null && props.dangerouslySetInnerHTML.__html != null;
|
|
|
}
|
|
|
function createTextInstance(text, rootContainerInstance, hostContext, internalInstanceHandle) {
|
|
|
{
|
|
|
var hostContextDev = hostContext;
|
|
|
validateDOMNesting(null, text, hostContextDev.ancestorInfo);
|
|
|
}
|
|
|
|
|
|
var textNode = createTextNode(text, rootContainerInstance);
|
|
|
precacheFiberNode(internalInstanceHandle, textNode);
|
|
|
return textNode;
|
|
|
}
|
|
|
function getCurrentEventPriority() {
|
|
|
var currentEvent = window.event;
|
|
|
|
|
|
if (currentEvent === undefined) {
|
|
|
return DefaultEventPriority;
|
|
|
}
|
|
|
|
|
|
return getEventPriority(currentEvent.type);
|
|
|
}
|
|
|
// if a component just imports ReactDOM (e.g. for findDOMNode).
|
|
|
// Some environments might not have setTimeout or clearTimeout.
|
|
|
|
|
|
var scheduleTimeout = typeof setTimeout === 'function' ? setTimeout : undefined;
|
|
|
var cancelTimeout = typeof clearTimeout === 'function' ? clearTimeout : undefined;
|
|
|
var noTimeout = -1;
|
|
|
var localPromise = typeof Promise === 'function' ? Promise : undefined; // -------------------
|
|
|
var scheduleMicrotask = typeof queueMicrotask === 'function' ? queueMicrotask : typeof localPromise !== 'undefined' ? function (callback) {
|
|
|
return localPromise.resolve(null).then(callback).catch(handleErrorInNextTick);
|
|
|
} : scheduleTimeout; // TODO: Determine the best fallback here.
|
|
|
|
|
|
function handleErrorInNextTick(error) {
|
|
|
setTimeout(function () {
|
|
|
throw error;
|
|
|
});
|
|
|
} // -------------------
|
|
|
function commitMount(domElement, type, newProps, internalInstanceHandle) {
|
|
|
// Despite the naming that might imply otherwise, this method only
|
|
|
// fires if there is an `Update` effect scheduled during mounting.
|
|
|
// This happens if `finalizeInitialChildren` returns `true` (which it
|
|
|
// does to implement the `autoFocus` attribute on the client). But
|
|
|
// there are also other cases when this might happen (such as patching
|
|
|
// up text content during hydration mismatch). So we'll check this again.
|
|
|
switch (type) {
|
|
|
case 'button':
|
|
|
case 'input':
|
|
|
case 'select':
|
|
|
case 'textarea':
|
|
|
if (newProps.autoFocus) {
|
|
|
domElement.focus();
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
|
|
|
case 'img':
|
|
|
{
|
|
|
if (newProps.src) {
|
|
|
domElement.src = newProps.src;
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function commitUpdate(domElement, updatePayload, type, oldProps, newProps, internalInstanceHandle) {
|
|
|
// Apply the diff to the DOM node.
|
|
|
updateProperties(domElement, updatePayload, type, oldProps, newProps); // Update the props handle so that we know which props are the ones with
|
|
|
// with current event handlers.
|
|
|
|
|
|
updateFiberProps(domElement, newProps);
|
|
|
}
|
|
|
function resetTextContent(domElement) {
|
|
|
setTextContent(domElement, '');
|
|
|
}
|
|
|
function commitTextUpdate(textInstance, oldText, newText) {
|
|
|
textInstance.nodeValue = newText;
|
|
|
}
|
|
|
function appendChild(parentInstance, child) {
|
|
|
parentInstance.appendChild(child);
|
|
|
}
|
|
|
function appendChildToContainer(container, child) {
|
|
|
var parentNode;
|
|
|
|
|
|
if (container.nodeType === COMMENT_NODE) {
|
|
|
parentNode = container.parentNode;
|
|
|
parentNode.insertBefore(child, container);
|
|
|
} else {
|
|
|
parentNode = container;
|
|
|
parentNode.appendChild(child);
|
|
|
} // This container might be used for a portal.
|
|
|
// If something inside a portal is clicked, that click should bubble
|
|
|
// through the React tree. However, on Mobile Safari the click would
|
|
|
// never bubble through the *DOM* tree unless an ancestor with onclick
|
|
|
// event exists. So we wouldn't see it and dispatch it.
|
|
|
// This is why we ensure that non React root containers have inline onclick
|
|
|
// defined.
|
|
|
// https://github.com/facebook/react/issues/11918
|
|
|
|
|
|
|
|
|
var reactRootContainer = container._reactRootContainer;
|
|
|
|
|
|
if ((reactRootContainer === null || reactRootContainer === undefined) && parentNode.onclick === null) {
|
|
|
// TODO: This cast may not be sound for SVG, MathML or custom elements.
|
|
|
trapClickOnNonInteractiveElement(parentNode);
|
|
|
}
|
|
|
}
|
|
|
function insertBefore(parentInstance, child, beforeChild) {
|
|
|
parentInstance.insertBefore(child, beforeChild);
|
|
|
}
|
|
|
function insertInContainerBefore(container, child, beforeChild) {
|
|
|
if (container.nodeType === COMMENT_NODE) {
|
|
|
container.parentNode.insertBefore(child, beforeChild);
|
|
|
} else {
|
|
|
container.insertBefore(child, beforeChild);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function removeChild(parentInstance, child) {
|
|
|
parentInstance.removeChild(child);
|
|
|
}
|
|
|
function removeChildFromContainer(container, child) {
|
|
|
if (container.nodeType === COMMENT_NODE) {
|
|
|
container.parentNode.removeChild(child);
|
|
|
} else {
|
|
|
container.removeChild(child);
|
|
|
}
|
|
|
}
|
|
|
function clearSuspenseBoundary(parentInstance, suspenseInstance) {
|
|
|
var node = suspenseInstance; // Delete all nodes within this suspense boundary.
|
|
|
// There might be nested nodes so we need to keep track of how
|
|
|
// deep we are and only break out when we're back on top.
|
|
|
|
|
|
var depth = 0;
|
|
|
|
|
|
do {
|
|
|
var nextNode = node.nextSibling;
|
|
|
parentInstance.removeChild(node);
|
|
|
|
|
|
if (nextNode && nextNode.nodeType === COMMENT_NODE) {
|
|
|
var data = nextNode.data;
|
|
|
|
|
|
if (data === SUSPENSE_END_DATA) {
|
|
|
if (depth === 0) {
|
|
|
parentInstance.removeChild(nextNode); // Retry if any event replaying was blocked on this.
|
|
|
|
|
|
retryIfBlockedOn(suspenseInstance);
|
|
|
return;
|
|
|
} else {
|
|
|
depth--;
|
|
|
}
|
|
|
} else if (data === SUSPENSE_START_DATA || data === SUSPENSE_PENDING_START_DATA || data === SUSPENSE_FALLBACK_START_DATA) {
|
|
|
depth++;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node = nextNode;
|
|
|
} while (node); // TODO: Warn, we didn't find the end comment boundary.
|
|
|
// Retry if any event replaying was blocked on this.
|
|
|
|
|
|
|
|
|
retryIfBlockedOn(suspenseInstance);
|
|
|
}
|
|
|
function clearSuspenseBoundaryFromContainer(container, suspenseInstance) {
|
|
|
if (container.nodeType === COMMENT_NODE) {
|
|
|
clearSuspenseBoundary(container.parentNode, suspenseInstance);
|
|
|
} else if (container.nodeType === ELEMENT_NODE) {
|
|
|
clearSuspenseBoundary(container, suspenseInstance);
|
|
|
} // Retry if any event replaying was blocked on this.
|
|
|
|
|
|
|
|
|
retryIfBlockedOn(container);
|
|
|
}
|
|
|
function hideInstance(instance) {
|
|
|
// TODO: Does this work for all element types? What about MathML? Should we
|
|
|
// pass host context to this method?
|
|
|
instance = instance;
|
|
|
var style = instance.style;
|
|
|
|
|
|
if (typeof style.setProperty === 'function') {
|
|
|
style.setProperty('display', 'none', 'important');
|
|
|
} else {
|
|
|
style.display = 'none';
|
|
|
}
|
|
|
}
|
|
|
function hideTextInstance(textInstance) {
|
|
|
textInstance.nodeValue = '';
|
|
|
}
|
|
|
function unhideInstance(instance, props) {
|
|
|
instance = instance;
|
|
|
var styleProp = props[STYLE$1];
|
|
|
var display = styleProp !== undefined && styleProp !== null && styleProp.hasOwnProperty('display') ? styleProp.display : null;
|
|
|
instance.style.display = dangerousStyleValue('display', display);
|
|
|
}
|
|
|
function unhideTextInstance(textInstance, text) {
|
|
|
textInstance.nodeValue = text;
|
|
|
}
|
|
|
function clearContainer(container) {
|
|
|
if (container.nodeType === ELEMENT_NODE) {
|
|
|
container.textContent = '';
|
|
|
} else if (container.nodeType === DOCUMENT_NODE) {
|
|
|
if (container.documentElement) {
|
|
|
container.removeChild(container.documentElement);
|
|
|
}
|
|
|
}
|
|
|
} // -------------------
|
|
|
function canHydrateInstance(instance, type, props) {
|
|
|
if (instance.nodeType !== ELEMENT_NODE || type.toLowerCase() !== instance.nodeName.toLowerCase()) {
|
|
|
return null;
|
|
|
} // This has now been refined to an element node.
|
|
|
|
|
|
|
|
|
return instance;
|
|
|
}
|
|
|
function canHydrateTextInstance(instance, text) {
|
|
|
if (text === '' || instance.nodeType !== TEXT_NODE) {
|
|
|
// Empty strings are not parsed by HTML so there won't be a correct match here.
|
|
|
return null;
|
|
|
} // This has now been refined to a text node.
|
|
|
|
|
|
|
|
|
return instance;
|
|
|
}
|
|
|
function canHydrateSuspenseInstance(instance) {
|
|
|
if (instance.nodeType !== COMMENT_NODE) {
|
|
|
// Empty strings are not parsed by HTML so there won't be a correct match here.
|
|
|
return null;
|
|
|
} // This has now been refined to a suspense node.
|
|
|
|
|
|
|
|
|
return instance;
|
|
|
}
|
|
|
function isSuspenseInstancePending(instance) {
|
|
|
return instance.data === SUSPENSE_PENDING_START_DATA;
|
|
|
}
|
|
|
function isSuspenseInstanceFallback(instance) {
|
|
|
return instance.data === SUSPENSE_FALLBACK_START_DATA;
|
|
|
}
|
|
|
function getSuspenseInstanceFallbackErrorDetails(instance) {
|
|
|
var dataset = instance.nextSibling && instance.nextSibling.dataset;
|
|
|
var digest, message, stack;
|
|
|
|
|
|
if (dataset) {
|
|
|
digest = dataset.dgst;
|
|
|
|
|
|
{
|
|
|
message = dataset.msg;
|
|
|
stack = dataset.stck;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
return {
|
|
|
message: message,
|
|
|
digest: digest,
|
|
|
stack: stack
|
|
|
};
|
|
|
} // let value = {message: undefined, hash: undefined};
|
|
|
// const nextSibling = instance.nextSibling;
|
|
|
// if (nextSibling) {
|
|
|
// const dataset = ((nextSibling: any): HTMLTemplateElement).dataset;
|
|
|
// value.message = dataset.msg;
|
|
|
// value.hash = dataset.hash;
|
|
|
// if (true) {
|
|
|
// value.stack = dataset.stack;
|
|
|
// }
|
|
|
// }
|
|
|
// return value;
|
|
|
|
|
|
}
|
|
|
function registerSuspenseInstanceRetry(instance, callback) {
|
|
|
instance._reactRetry = callback;
|
|
|
}
|
|
|
|
|
|
function getNextHydratable(node) {
|
|
|
// Skip non-hydratable nodes.
|
|
|
for (; node != null; node = node.nextSibling) {
|
|
|
var nodeType = node.nodeType;
|
|
|
|
|
|
if (nodeType === ELEMENT_NODE || nodeType === TEXT_NODE) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (nodeType === COMMENT_NODE) {
|
|
|
var nodeData = node.data;
|
|
|
|
|
|
if (nodeData === SUSPENSE_START_DATA || nodeData === SUSPENSE_FALLBACK_START_DATA || nodeData === SUSPENSE_PENDING_START_DATA) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (nodeData === SUSPENSE_END_DATA) {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return node;
|
|
|
}
|
|
|
|
|
|
function getNextHydratableSibling(instance) {
|
|
|
return getNextHydratable(instance.nextSibling);
|
|
|
}
|
|
|
function getFirstHydratableChild(parentInstance) {
|
|
|
return getNextHydratable(parentInstance.firstChild);
|
|
|
}
|
|
|
function getFirstHydratableChildWithinContainer(parentContainer) {
|
|
|
return getNextHydratable(parentContainer.firstChild);
|
|
|
}
|
|
|
function getFirstHydratableChildWithinSuspenseInstance(parentInstance) {
|
|
|
return getNextHydratable(parentInstance.nextSibling);
|
|
|
}
|
|
|
function hydrateInstance(instance, type, props, rootContainerInstance, hostContext, internalInstanceHandle, shouldWarnDev) {
|
|
|
precacheFiberNode(internalInstanceHandle, instance); // TODO: Possibly defer this until the commit phase where all the events
|
|
|
// get attached.
|
|
|
|
|
|
updateFiberProps(instance, props);
|
|
|
var parentNamespace;
|
|
|
|
|
|
{
|
|
|
var hostContextDev = hostContext;
|
|
|
parentNamespace = hostContextDev.namespace;
|
|
|
} // TODO: Temporary hack to check if we're in a concurrent root. We can delete
|
|
|
// when the legacy root API is removed.
|
|
|
|
|
|
|
|
|
var isConcurrentMode = (internalInstanceHandle.mode & ConcurrentMode) !== NoMode;
|
|
|
return diffHydratedProperties(instance, type, props, parentNamespace, rootContainerInstance, isConcurrentMode, shouldWarnDev);
|
|
|
}
|
|
|
function hydrateTextInstance(textInstance, text, internalInstanceHandle, shouldWarnDev) {
|
|
|
precacheFiberNode(internalInstanceHandle, textInstance); // TODO: Temporary hack to check if we're in a concurrent root. We can delete
|
|
|
// when the legacy root API is removed.
|
|
|
|
|
|
var isConcurrentMode = (internalInstanceHandle.mode & ConcurrentMode) !== NoMode;
|
|
|
return diffHydratedText(textInstance, text);
|
|
|
}
|
|
|
function hydrateSuspenseInstance(suspenseInstance, internalInstanceHandle) {
|
|
|
precacheFiberNode(internalInstanceHandle, suspenseInstance);
|
|
|
}
|
|
|
function getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance) {
|
|
|
var node = suspenseInstance.nextSibling; // Skip past all nodes within this suspense boundary.
|
|
|
// There might be nested nodes so we need to keep track of how
|
|
|
// deep we are and only break out when we're back on top.
|
|
|
|
|
|
var depth = 0;
|
|
|
|
|
|
while (node) {
|
|
|
if (node.nodeType === COMMENT_NODE) {
|
|
|
var data = node.data;
|
|
|
|
|
|
if (data === SUSPENSE_END_DATA) {
|
|
|
if (depth === 0) {
|
|
|
return getNextHydratableSibling(node);
|
|
|
} else {
|
|
|
depth--;
|
|
|
}
|
|
|
} else if (data === SUSPENSE_START_DATA || data === SUSPENSE_FALLBACK_START_DATA || data === SUSPENSE_PENDING_START_DATA) {
|
|
|
depth++;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node = node.nextSibling;
|
|
|
} // TODO: Warn, we didn't find the end comment boundary.
|
|
|
|
|
|
|
|
|
return null;
|
|
|
} // Returns the SuspenseInstance if this node is a direct child of a
|
|
|
// SuspenseInstance. I.e. if its previous sibling is a Comment with
|
|
|
// SUSPENSE_x_START_DATA. Otherwise, null.
|
|
|
|
|
|
function getParentSuspenseInstance(targetInstance) {
|
|
|
var node = targetInstance.previousSibling; // Skip past all nodes within this suspense boundary.
|
|
|
// There might be nested nodes so we need to keep track of how
|
|
|
// deep we are and only break out when we're back on top.
|
|
|
|
|
|
var depth = 0;
|
|
|
|
|
|
while (node) {
|
|
|
if (node.nodeType === COMMENT_NODE) {
|
|
|
var data = node.data;
|
|
|
|
|
|
if (data === SUSPENSE_START_DATA || data === SUSPENSE_FALLBACK_START_DATA || data === SUSPENSE_PENDING_START_DATA) {
|
|
|
if (depth === 0) {
|
|
|
return node;
|
|
|
} else {
|
|
|
depth--;
|
|
|
}
|
|
|
} else if (data === SUSPENSE_END_DATA) {
|
|
|
depth++;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node = node.previousSibling;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
function commitHydratedContainer(container) {
|
|
|
// Retry if any event replaying was blocked on this.
|
|
|
retryIfBlockedOn(container);
|
|
|
}
|
|
|
function commitHydratedSuspenseInstance(suspenseInstance) {
|
|
|
// Retry if any event replaying was blocked on this.
|
|
|
retryIfBlockedOn(suspenseInstance);
|
|
|
}
|
|
|
function shouldDeleteUnhydratedTailInstances(parentType) {
|
|
|
return parentType !== 'head' && parentType !== 'body';
|
|
|
}
|
|
|
function didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, text, isConcurrentMode) {
|
|
|
var shouldWarnDev = true;
|
|
|
checkForUnmatchedText(textInstance.nodeValue, text, isConcurrentMode, shouldWarnDev);
|
|
|
}
|
|
|
function didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, text, isConcurrentMode) {
|
|
|
if (parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
|
|
|
var shouldWarnDev = true;
|
|
|
checkForUnmatchedText(textInstance.nodeValue, text, isConcurrentMode, shouldWarnDev);
|
|
|
}
|
|
|
}
|
|
|
function didNotHydrateInstanceWithinContainer(parentContainer, instance) {
|
|
|
{
|
|
|
if (instance.nodeType === ELEMENT_NODE) {
|
|
|
warnForDeletedHydratableElement(parentContainer, instance);
|
|
|
} else if (instance.nodeType === COMMENT_NODE) ; else {
|
|
|
warnForDeletedHydratableText(parentContainer, instance);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function didNotHydrateInstanceWithinSuspenseInstance(parentInstance, instance) {
|
|
|
{
|
|
|
// $FlowFixMe: Only Element or Document can be parent nodes.
|
|
|
var parentNode = parentInstance.parentNode;
|
|
|
|
|
|
if (parentNode !== null) {
|
|
|
if (instance.nodeType === ELEMENT_NODE) {
|
|
|
warnForDeletedHydratableElement(parentNode, instance);
|
|
|
} else if (instance.nodeType === COMMENT_NODE) ; else {
|
|
|
warnForDeletedHydratableText(parentNode, instance);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function didNotHydrateInstance(parentType, parentProps, parentInstance, instance, isConcurrentMode) {
|
|
|
{
|
|
|
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
|
|
|
if (instance.nodeType === ELEMENT_NODE) {
|
|
|
warnForDeletedHydratableElement(parentInstance, instance);
|
|
|
} else if (instance.nodeType === COMMENT_NODE) ; else {
|
|
|
warnForDeletedHydratableText(parentInstance, instance);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function didNotFindHydratableInstanceWithinContainer(parentContainer, type, props) {
|
|
|
{
|
|
|
warnForInsertedHydratedElement(parentContainer, type);
|
|
|
}
|
|
|
}
|
|
|
function didNotFindHydratableTextInstanceWithinContainer(parentContainer, text) {
|
|
|
{
|
|
|
warnForInsertedHydratedText(parentContainer, text);
|
|
|
}
|
|
|
}
|
|
|
function didNotFindHydratableInstanceWithinSuspenseInstance(parentInstance, type, props) {
|
|
|
{
|
|
|
// $FlowFixMe: Only Element or Document can be parent nodes.
|
|
|
var parentNode = parentInstance.parentNode;
|
|
|
if (parentNode !== null) warnForInsertedHydratedElement(parentNode, type);
|
|
|
}
|
|
|
}
|
|
|
function didNotFindHydratableTextInstanceWithinSuspenseInstance(parentInstance, text) {
|
|
|
{
|
|
|
// $FlowFixMe: Only Element or Document can be parent nodes.
|
|
|
var parentNode = parentInstance.parentNode;
|
|
|
if (parentNode !== null) warnForInsertedHydratedText(parentNode, text);
|
|
|
}
|
|
|
}
|
|
|
function didNotFindHydratableInstance(parentType, parentProps, parentInstance, type, props, isConcurrentMode) {
|
|
|
{
|
|
|
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
|
|
|
warnForInsertedHydratedElement(parentInstance, type);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, text, isConcurrentMode) {
|
|
|
{
|
|
|
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) {
|
|
|
warnForInsertedHydratedText(parentInstance, text);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function errorHydratingContainer(parentContainer) {
|
|
|
{
|
|
|
// TODO: This gets logged by onRecoverableError, too, so we should be
|
|
|
// able to remove it.
|
|
|
error('An error occurred during hydration. The server HTML was replaced with client content in <%s>.', parentContainer.nodeName.toLowerCase());
|
|
|
}
|
|
|
}
|
|
|
function preparePortalMount(portalInstance) {
|
|
|
listenToAllSupportedEvents(portalInstance);
|
|
|
}
|
|
|
|
|
|
var randomKey = Math.random().toString(36).slice(2);
|
|
|
var internalInstanceKey = '__reactFiber$' + randomKey;
|
|
|
var internalPropsKey = '__reactProps$' + randomKey;
|
|
|
var internalContainerInstanceKey = '__reactContainer$' + randomKey;
|
|
|
var internalEventHandlersKey = '__reactEvents$' + randomKey;
|
|
|
var internalEventHandlerListenersKey = '__reactListeners$' + randomKey;
|
|
|
var internalEventHandlesSetKey = '__reactHandles$' + randomKey;
|
|
|
function detachDeletedInstance(node) {
|
|
|
// TODO: This function is only called on host components. I don't think all of
|
|
|
// these fields are relevant.
|
|
|
delete node[internalInstanceKey];
|
|
|
delete node[internalPropsKey];
|
|
|
delete node[internalEventHandlersKey];
|
|
|
delete node[internalEventHandlerListenersKey];
|
|
|
delete node[internalEventHandlesSetKey];
|
|
|
}
|
|
|
function precacheFiberNode(hostInst, node) {
|
|
|
node[internalInstanceKey] = hostInst;
|
|
|
}
|
|
|
function markContainerAsRoot(hostRoot, node) {
|
|
|
node[internalContainerInstanceKey] = hostRoot;
|
|
|
}
|
|
|
function unmarkContainerAsRoot(node) {
|
|
|
node[internalContainerInstanceKey] = null;
|
|
|
}
|
|
|
function isContainerMarkedAsRoot(node) {
|
|
|
return !!node[internalContainerInstanceKey];
|
|
|
} // Given a DOM node, return the closest HostComponent or HostText fiber ancestor.
|
|
|
// If the target node is part of a hydrated or not yet rendered subtree, then
|
|
|
// this may also return a SuspenseComponent or HostRoot to indicate that.
|
|
|
// Conceptually the HostRoot fiber is a child of the Container node. So if you
|
|
|
// pass the Container node as the targetNode, you will not actually get the
|
|
|
// HostRoot back. To get to the HostRoot, you need to pass a child of it.
|
|
|
// The same thing applies to Suspense boundaries.
|
|
|
|
|
|
function getClosestInstanceFromNode(targetNode) {
|
|
|
var targetInst = targetNode[internalInstanceKey];
|
|
|
|
|
|
if (targetInst) {
|
|
|
// Don't return HostRoot or SuspenseComponent here.
|
|
|
return targetInst;
|
|
|
} // If the direct event target isn't a React owned DOM node, we need to look
|
|
|
// to see if one of its parents is a React owned DOM node.
|
|
|
|
|
|
|
|
|
var parentNode = targetNode.parentNode;
|
|
|
|
|
|
while (parentNode) {
|
|
|
// We'll check if this is a container root that could include
|
|
|
// React nodes in the future. We need to check this first because
|
|
|
// if we're a child of a dehydrated container, we need to first
|
|
|
// find that inner container before moving on to finding the parent
|
|
|
// instance. Note that we don't check this field on the targetNode
|
|
|
// itself because the fibers are conceptually between the container
|
|
|
// node and the first child. It isn't surrounding the container node.
|
|
|
// If it's not a container, we check if it's an instance.
|
|
|
targetInst = parentNode[internalContainerInstanceKey] || parentNode[internalInstanceKey];
|
|
|
|
|
|
if (targetInst) {
|
|
|
// Since this wasn't the direct target of the event, we might have
|
|
|
// stepped past dehydrated DOM nodes to get here. However they could
|
|
|
// also have been non-React nodes. We need to answer which one.
|
|
|
// If we the instance doesn't have any children, then there can't be
|
|
|
// a nested suspense boundary within it. So we can use this as a fast
|
|
|
// bailout. Most of the time, when people add non-React children to
|
|
|
// the tree, it is using a ref to a child-less DOM node.
|
|
|
// Normally we'd only need to check one of the fibers because if it
|
|
|
// has ever gone from having children to deleting them or vice versa
|
|
|
// it would have deleted the dehydrated boundary nested inside already.
|
|
|
// However, since the HostRoot starts out with an alternate it might
|
|
|
// have one on the alternate so we need to check in case this was a
|
|
|
// root.
|
|
|
var alternate = targetInst.alternate;
|
|
|
|
|
|
if (targetInst.child !== null || alternate !== null && alternate.child !== null) {
|
|
|
// Next we need to figure out if the node that skipped past is
|
|
|
// nested within a dehydrated boundary and if so, which one.
|
|
|
var suspenseInstance = getParentSuspenseInstance(targetNode);
|
|
|
|
|
|
while (suspenseInstance !== null) {
|
|
|
// We found a suspense instance. That means that we haven't
|
|
|
// hydrated it yet. Even though we leave the comments in the
|
|
|
// DOM after hydrating, and there are boundaries in the DOM
|
|
|
// that could already be hydrated, we wouldn't have found them
|
|
|
// through this pass since if the target is hydrated it would
|
|
|
// have had an internalInstanceKey on it.
|
|
|
// Let's get the fiber associated with the SuspenseComponent
|
|
|
// as the deepest instance.
|
|
|
var targetSuspenseInst = suspenseInstance[internalInstanceKey];
|
|
|
|
|
|
if (targetSuspenseInst) {
|
|
|
return targetSuspenseInst;
|
|
|
} // If we don't find a Fiber on the comment, it might be because
|
|
|
// we haven't gotten to hydrate it yet. There might still be a
|
|
|
// parent boundary that hasn't above this one so we need to find
|
|
|
// the outer most that is known.
|
|
|
|
|
|
|
|
|
suspenseInstance = getParentSuspenseInstance(suspenseInstance); // If we don't find one, then that should mean that the parent
|
|
|
// host component also hasn't hydrated yet. We can return it
|
|
|
// below since it will bail out on the isMounted check later.
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return targetInst;
|
|
|
}
|
|
|
|
|
|
targetNode = parentNode;
|
|
|
parentNode = targetNode.parentNode;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
/**
|
|
|
* Given a DOM node, return the ReactDOMComponent or ReactDOMTextComponent
|
|
|
* instance, or null if the node was not rendered by this React.
|
|
|
*/
|
|
|
|
|
|
function getInstanceFromNode(node) {
|
|
|
var inst = node[internalInstanceKey] || node[internalContainerInstanceKey];
|
|
|
|
|
|
if (inst) {
|
|
|
if (inst.tag === HostComponent || inst.tag === HostText || inst.tag === SuspenseComponent || inst.tag === HostRoot) {
|
|
|
return inst;
|
|
|
} else {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
/**
|
|
|
* Given a ReactDOMComponent or ReactDOMTextComponent, return the corresponding
|
|
|
* DOM node.
|
|
|
*/
|
|
|
|
|
|
function getNodeFromInstance(inst) {
|
|
|
if (inst.tag === HostComponent || inst.tag === HostText) {
|
|
|
// In Fiber this, is just the state node right now. We assume it will be
|
|
|
// a host component or host text.
|
|
|
return inst.stateNode;
|
|
|
} // Without this first invariant, passing a non-DOM-component triggers the next
|
|
|
// invariant for a missing parent, which is super confusing.
|
|
|
|
|
|
|
|
|
throw new Error('getNodeFromInstance: Invalid argument.');
|
|
|
}
|
|
|
function getFiberCurrentPropsFromNode(node) {
|
|
|
return node[internalPropsKey] || null;
|
|
|
}
|
|
|
function updateFiberProps(node, props) {
|
|
|
node[internalPropsKey] = props;
|
|
|
}
|
|
|
function getEventListenerSet(node) {
|
|
|
var elementListenerSet = node[internalEventHandlersKey];
|
|
|
|
|
|
if (elementListenerSet === undefined) {
|
|
|
elementListenerSet = node[internalEventHandlersKey] = new Set();
|
|
|
}
|
|
|
|
|
|
return elementListenerSet;
|
|
|
}
|
|
|
|
|
|
var loggedTypeFailures = {};
|
|
|
var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
|
|
|
|
function setCurrentlyValidatingElement(element) {
|
|
|
{
|
|
|
if (element) {
|
|
|
var owner = element._owner;
|
|
|
var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
|
|
|
ReactDebugCurrentFrame$1.setExtraStackFrame(stack);
|
|
|
} else {
|
|
|
ReactDebugCurrentFrame$1.setExtraStackFrame(null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
|
|
{
|
|
|
// $FlowFixMe This is okay but Flow doesn't know it.
|
|
|
var has = Function.call.bind(hasOwnProperty);
|
|
|
|
|
|
for (var typeSpecName in typeSpecs) {
|
|
|
if (has(typeSpecs, typeSpecName)) {
|
|
|
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
|
|
// fail the render phase where it didn't fail before. So we log it.
|
|
|
// After these have been cleaned up, we'll let them throw.
|
|
|
|
|
|
try {
|
|
|
// This is intentionally an invariant that gets caught. It's the same
|
|
|
// behavior as without this statement except with a better message.
|
|
|
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
|
|
err.name = 'Invariant Violation';
|
|
|
throw err;
|
|
|
}
|
|
|
|
|
|
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
|
|
} catch (ex) {
|
|
|
error$1 = ex;
|
|
|
}
|
|
|
|
|
|
if (error$1 && !(error$1 instanceof Error)) {
|
|
|
setCurrentlyValidatingElement(element);
|
|
|
|
|
|
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
|
|
|
|
|
setCurrentlyValidatingElement(null);
|
|
|
}
|
|
|
|
|
|
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
|
|
// Only monitor this failure once because there tends to be a lot of the
|
|
|
// same error.
|
|
|
loggedTypeFailures[error$1.message] = true;
|
|
|
setCurrentlyValidatingElement(element);
|
|
|
|
|
|
error('Failed %s type: %s', location, error$1.message);
|
|
|
|
|
|
setCurrentlyValidatingElement(null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var valueStack = [];
|
|
|
var fiberStack;
|
|
|
|
|
|
{
|
|
|
fiberStack = [];
|
|
|
}
|
|
|
|
|
|
var index = -1;
|
|
|
|
|
|
function createCursor(defaultValue) {
|
|
|
return {
|
|
|
current: defaultValue
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function pop(cursor, fiber) {
|
|
|
if (index < 0) {
|
|
|
{
|
|
|
error('Unexpected pop.');
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (fiber !== fiberStack[index]) {
|
|
|
error('Unexpected Fiber popped.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
cursor.current = valueStack[index];
|
|
|
valueStack[index] = null;
|
|
|
|
|
|
{
|
|
|
fiberStack[index] = null;
|
|
|
}
|
|
|
|
|
|
index--;
|
|
|
}
|
|
|
|
|
|
function push(cursor, value, fiber) {
|
|
|
index++;
|
|
|
valueStack[index] = cursor.current;
|
|
|
|
|
|
{
|
|
|
fiberStack[index] = fiber;
|
|
|
}
|
|
|
|
|
|
cursor.current = value;
|
|
|
}
|
|
|
|
|
|
var warnedAboutMissingGetChildContext;
|
|
|
|
|
|
{
|
|
|
warnedAboutMissingGetChildContext = {};
|
|
|
}
|
|
|
|
|
|
var emptyContextObject = {};
|
|
|
|
|
|
{
|
|
|
Object.freeze(emptyContextObject);
|
|
|
} // A cursor to the current merged context object on the stack.
|
|
|
|
|
|
|
|
|
var contextStackCursor = createCursor(emptyContextObject); // A cursor to a boolean indicating whether the context has changed.
|
|
|
|
|
|
var didPerformWorkStackCursor = createCursor(false); // Keep track of the previous context object that was on the stack.
|
|
|
// We use this to get access to the parent context after we have already
|
|
|
// pushed the next context provider, and now need to merge their contexts.
|
|
|
|
|
|
var previousContext = emptyContextObject;
|
|
|
|
|
|
function getUnmaskedContext(workInProgress, Component, didPushOwnContextIfProvider) {
|
|
|
{
|
|
|
if (didPushOwnContextIfProvider && isContextProvider(Component)) {
|
|
|
// If the fiber is a context provider itself, when we read its context
|
|
|
// we may have already pushed its own child context on the stack. A context
|
|
|
// provider should not "see" its own child context. Therefore we read the
|
|
|
// previous (parent) context instead for a context provider.
|
|
|
return previousContext;
|
|
|
}
|
|
|
|
|
|
return contextStackCursor.current;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function cacheContext(workInProgress, unmaskedContext, maskedContext) {
|
|
|
{
|
|
|
var instance = workInProgress.stateNode;
|
|
|
instance.__reactInternalMemoizedUnmaskedChildContext = unmaskedContext;
|
|
|
instance.__reactInternalMemoizedMaskedChildContext = maskedContext;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getMaskedContext(workInProgress, unmaskedContext) {
|
|
|
{
|
|
|
var type = workInProgress.type;
|
|
|
var contextTypes = type.contextTypes;
|
|
|
|
|
|
if (!contextTypes) {
|
|
|
return emptyContextObject;
|
|
|
} // Avoid recreating masked context unless unmasked context has changed.
|
|
|
// Failing to do this will result in unnecessary calls to componentWillReceiveProps.
|
|
|
// This may trigger infinite loops if componentWillReceiveProps calls setState.
|
|
|
|
|
|
|
|
|
var instance = workInProgress.stateNode;
|
|
|
|
|
|
if (instance && instance.__reactInternalMemoizedUnmaskedChildContext === unmaskedContext) {
|
|
|
return instance.__reactInternalMemoizedMaskedChildContext;
|
|
|
}
|
|
|
|
|
|
var context = {};
|
|
|
|
|
|
for (var key in contextTypes) {
|
|
|
context[key] = unmaskedContext[key];
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var name = getComponentNameFromFiber(workInProgress) || 'Unknown';
|
|
|
checkPropTypes(contextTypes, context, 'context', name);
|
|
|
} // Cache unmasked context so we can avoid recreating masked context unless necessary.
|
|
|
// Context is created before the class component is instantiated so check for instance.
|
|
|
|
|
|
|
|
|
if (instance) {
|
|
|
cacheContext(workInProgress, unmaskedContext, context);
|
|
|
}
|
|
|
|
|
|
return context;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function hasContextChanged() {
|
|
|
{
|
|
|
return didPerformWorkStackCursor.current;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isContextProvider(type) {
|
|
|
{
|
|
|
var childContextTypes = type.childContextTypes;
|
|
|
return childContextTypes !== null && childContextTypes !== undefined;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function popContext(fiber) {
|
|
|
{
|
|
|
pop(didPerformWorkStackCursor, fiber);
|
|
|
pop(contextStackCursor, fiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function popTopLevelContextObject(fiber) {
|
|
|
{
|
|
|
pop(didPerformWorkStackCursor, fiber);
|
|
|
pop(contextStackCursor, fiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function pushTopLevelContextObject(fiber, context, didChange) {
|
|
|
{
|
|
|
if (contextStackCursor.current !== emptyContextObject) {
|
|
|
throw new Error('Unexpected context found on stack. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
push(contextStackCursor, context, fiber);
|
|
|
push(didPerformWorkStackCursor, didChange, fiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function processChildContext(fiber, type, parentContext) {
|
|
|
{
|
|
|
var instance = fiber.stateNode;
|
|
|
var childContextTypes = type.childContextTypes; // TODO (bvaughn) Replace this behavior with an invariant() in the future.
|
|
|
// It has only been added in Fiber to match the (unintentional) behavior in Stack.
|
|
|
|
|
|
if (typeof instance.getChildContext !== 'function') {
|
|
|
{
|
|
|
var componentName = getComponentNameFromFiber(fiber) || 'Unknown';
|
|
|
|
|
|
if (!warnedAboutMissingGetChildContext[componentName]) {
|
|
|
warnedAboutMissingGetChildContext[componentName] = true;
|
|
|
|
|
|
error('%s.childContextTypes is specified but there is no getChildContext() method ' + 'on the instance. You can either define getChildContext() on %s or remove ' + 'childContextTypes from it.', componentName, componentName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return parentContext;
|
|
|
}
|
|
|
|
|
|
var childContext = instance.getChildContext();
|
|
|
|
|
|
for (var contextKey in childContext) {
|
|
|
if (!(contextKey in childContextTypes)) {
|
|
|
throw new Error((getComponentNameFromFiber(fiber) || 'Unknown') + ".getChildContext(): key \"" + contextKey + "\" is not defined in childContextTypes.");
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var name = getComponentNameFromFiber(fiber) || 'Unknown';
|
|
|
checkPropTypes(childContextTypes, childContext, 'child context', name);
|
|
|
}
|
|
|
|
|
|
return assign({}, parentContext, childContext);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function pushContextProvider(workInProgress) {
|
|
|
{
|
|
|
var instance = workInProgress.stateNode; // We push the context as early as possible to ensure stack integrity.
|
|
|
// If the instance does not exist yet, we will push null at first,
|
|
|
// and replace it on the stack later when invalidating the context.
|
|
|
|
|
|
var memoizedMergedChildContext = instance && instance.__reactInternalMemoizedMergedChildContext || emptyContextObject; // Remember the parent context so we can merge with it later.
|
|
|
// Inherit the parent's did-perform-work value to avoid inadvertently blocking updates.
|
|
|
|
|
|
previousContext = contextStackCursor.current;
|
|
|
push(contextStackCursor, memoizedMergedChildContext, workInProgress);
|
|
|
push(didPerformWorkStackCursor, didPerformWorkStackCursor.current, workInProgress);
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function invalidateContextProvider(workInProgress, type, didChange) {
|
|
|
{
|
|
|
var instance = workInProgress.stateNode;
|
|
|
|
|
|
if (!instance) {
|
|
|
throw new Error('Expected to have an instance by this point. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
if (didChange) {
|
|
|
// Merge parent and own context.
|
|
|
// Skip this if we're not updating due to sCU.
|
|
|
// This avoids unnecessarily recomputing memoized values.
|
|
|
var mergedContext = processChildContext(workInProgress, type, previousContext);
|
|
|
instance.__reactInternalMemoizedMergedChildContext = mergedContext; // Replace the old (or empty) context with the new one.
|
|
|
// It is important to unwind the context in the reverse order.
|
|
|
|
|
|
pop(didPerformWorkStackCursor, workInProgress);
|
|
|
pop(contextStackCursor, workInProgress); // Now push the new context and mark that it has changed.
|
|
|
|
|
|
push(contextStackCursor, mergedContext, workInProgress);
|
|
|
push(didPerformWorkStackCursor, didChange, workInProgress);
|
|
|
} else {
|
|
|
pop(didPerformWorkStackCursor, workInProgress);
|
|
|
push(didPerformWorkStackCursor, didChange, workInProgress);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function findCurrentUnmaskedContext(fiber) {
|
|
|
{
|
|
|
// Currently this is only used with renderSubtreeIntoContainer; not sure if it
|
|
|
// makes sense elsewhere
|
|
|
if (!isFiberMounted(fiber) || fiber.tag !== ClassComponent) {
|
|
|
throw new Error('Expected subtree parent to be a mounted class component. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
var node = fiber;
|
|
|
|
|
|
do {
|
|
|
switch (node.tag) {
|
|
|
case HostRoot:
|
|
|
return node.stateNode.context;
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var Component = node.type;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
return node.stateNode.__reactInternalMemoizedMergedChildContext;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
} while (node !== null);
|
|
|
|
|
|
throw new Error('Found unexpected detached subtree parent. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var LegacyRoot = 0;
|
|
|
var ConcurrentRoot = 1;
|
|
|
|
|
|
var syncQueue = null;
|
|
|
var includesLegacySyncCallbacks = false;
|
|
|
var isFlushingSyncQueue = false;
|
|
|
function scheduleSyncCallback(callback) {
|
|
|
// Push this callback into an internal queue. We'll flush these either in
|
|
|
// the next tick, or earlier if something calls `flushSyncCallbackQueue`.
|
|
|
if (syncQueue === null) {
|
|
|
syncQueue = [callback];
|
|
|
} else {
|
|
|
// Push onto existing queue. Don't need to schedule a callback because
|
|
|
// we already scheduled one when we created the queue.
|
|
|
syncQueue.push(callback);
|
|
|
}
|
|
|
}
|
|
|
function scheduleLegacySyncCallback(callback) {
|
|
|
includesLegacySyncCallbacks = true;
|
|
|
scheduleSyncCallback(callback);
|
|
|
}
|
|
|
function flushSyncCallbacksOnlyInLegacyMode() {
|
|
|
// Only flushes the queue if there's a legacy sync callback scheduled.
|
|
|
// TODO: There's only a single type of callback: performSyncOnWorkOnRoot. So
|
|
|
// it might make more sense for the queue to be a list of roots instead of a
|
|
|
// list of generic callbacks. Then we can have two: one for legacy roots, one
|
|
|
// for concurrent roots. And this method would only flush the legacy ones.
|
|
|
if (includesLegacySyncCallbacks) {
|
|
|
flushSyncCallbacks();
|
|
|
}
|
|
|
}
|
|
|
function flushSyncCallbacks() {
|
|
|
if (!isFlushingSyncQueue && syncQueue !== null) {
|
|
|
// Prevent re-entrance.
|
|
|
isFlushingSyncQueue = true;
|
|
|
var i = 0;
|
|
|
var previousUpdatePriority = getCurrentUpdatePriority();
|
|
|
|
|
|
try {
|
|
|
var isSync = true;
|
|
|
var queue = syncQueue; // TODO: Is this necessary anymore? The only user code that runs in this
|
|
|
// queue is in the render or commit phases.
|
|
|
|
|
|
setCurrentUpdatePriority(DiscreteEventPriority);
|
|
|
|
|
|
for (; i < queue.length; i++) {
|
|
|
var callback = queue[i];
|
|
|
|
|
|
do {
|
|
|
callback = callback(isSync);
|
|
|
} while (callback !== null);
|
|
|
}
|
|
|
|
|
|
syncQueue = null;
|
|
|
includesLegacySyncCallbacks = false;
|
|
|
} catch (error) {
|
|
|
// If something throws, leave the remaining callbacks on the queue.
|
|
|
if (syncQueue !== null) {
|
|
|
syncQueue = syncQueue.slice(i + 1);
|
|
|
} // Resume flushing in the next tick
|
|
|
|
|
|
|
|
|
scheduleCallback(ImmediatePriority, flushSyncCallbacks);
|
|
|
throw error;
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousUpdatePriority);
|
|
|
isFlushingSyncQueue = false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
// TODO: Use the unified fiber stack module instead of this local one?
|
|
|
// Intentionally not using it yet to derisk the initial implementation, because
|
|
|
// the way we push/pop these values is a bit unusual. If there's a mistake, I'd
|
|
|
// rather the ids be wrong than crash the whole reconciler.
|
|
|
var forkStack = [];
|
|
|
var forkStackIndex = 0;
|
|
|
var treeForkProvider = null;
|
|
|
var treeForkCount = 0;
|
|
|
var idStack = [];
|
|
|
var idStackIndex = 0;
|
|
|
var treeContextProvider = null;
|
|
|
var treeContextId = 1;
|
|
|
var treeContextOverflow = '';
|
|
|
function isForkedChild(workInProgress) {
|
|
|
warnIfNotHydrating();
|
|
|
return (workInProgress.flags & Forked) !== NoFlags;
|
|
|
}
|
|
|
function getForksAtLevel(workInProgress) {
|
|
|
warnIfNotHydrating();
|
|
|
return treeForkCount;
|
|
|
}
|
|
|
function getTreeId() {
|
|
|
var overflow = treeContextOverflow;
|
|
|
var idWithLeadingBit = treeContextId;
|
|
|
var id = idWithLeadingBit & ~getLeadingBit(idWithLeadingBit);
|
|
|
return id.toString(32) + overflow;
|
|
|
}
|
|
|
function pushTreeFork(workInProgress, totalChildren) {
|
|
|
// This is called right after we reconcile an array (or iterator) of child
|
|
|
// fibers, because that's the only place where we know how many children in
|
|
|
// the whole set without doing extra work later, or storing addtional
|
|
|
// information on the fiber.
|
|
|
//
|
|
|
// That's why this function is separate from pushTreeId — it's called during
|
|
|
// the render phase of the fork parent, not the child, which is where we push
|
|
|
// the other context values.
|
|
|
//
|
|
|
// In the Fizz implementation this is much simpler because the child is
|
|
|
// rendered in the same callstack as the parent.
|
|
|
//
|
|
|
// It might be better to just add a `forks` field to the Fiber type. It would
|
|
|
// make this module simpler.
|
|
|
warnIfNotHydrating();
|
|
|
forkStack[forkStackIndex++] = treeForkCount;
|
|
|
forkStack[forkStackIndex++] = treeForkProvider;
|
|
|
treeForkProvider = workInProgress;
|
|
|
treeForkCount = totalChildren;
|
|
|
}
|
|
|
function pushTreeId(workInProgress, totalChildren, index) {
|
|
|
warnIfNotHydrating();
|
|
|
idStack[idStackIndex++] = treeContextId;
|
|
|
idStack[idStackIndex++] = treeContextOverflow;
|
|
|
idStack[idStackIndex++] = treeContextProvider;
|
|
|
treeContextProvider = workInProgress;
|
|
|
var baseIdWithLeadingBit = treeContextId;
|
|
|
var baseOverflow = treeContextOverflow; // The leftmost 1 marks the end of the sequence, non-inclusive. It's not part
|
|
|
// of the id; we use it to account for leading 0s.
|
|
|
|
|
|
var baseLength = getBitLength(baseIdWithLeadingBit) - 1;
|
|
|
var baseId = baseIdWithLeadingBit & ~(1 << baseLength);
|
|
|
var slot = index + 1;
|
|
|
var length = getBitLength(totalChildren) + baseLength; // 30 is the max length we can store without overflowing, taking into
|
|
|
// consideration the leading 1 we use to mark the end of the sequence.
|
|
|
|
|
|
if (length > 30) {
|
|
|
// We overflowed the bitwise-safe range. Fall back to slower algorithm.
|
|
|
// This branch assumes the length of the base id is greater than 5; it won't
|
|
|
// work for smaller ids, because you need 5 bits per character.
|
|
|
//
|
|
|
// We encode the id in multiple steps: first the base id, then the
|
|
|
// remaining digits.
|
|
|
//
|
|
|
// Each 5 bit sequence corresponds to a single base 32 character. So for
|
|
|
// example, if the current id is 23 bits long, we can convert 20 of those
|
|
|
// bits into a string of 4 characters, with 3 bits left over.
|
|
|
//
|
|
|
// First calculate how many bits in the base id represent a complete
|
|
|
// sequence of characters.
|
|
|
var numberOfOverflowBits = baseLength - baseLength % 5; // Then create a bitmask that selects only those bits.
|
|
|
|
|
|
var newOverflowBits = (1 << numberOfOverflowBits) - 1; // Select the bits, and convert them to a base 32 string.
|
|
|
|
|
|
var newOverflow = (baseId & newOverflowBits).toString(32); // Now we can remove those bits from the base id.
|
|
|
|
|
|
var restOfBaseId = baseId >> numberOfOverflowBits;
|
|
|
var restOfBaseLength = baseLength - numberOfOverflowBits; // Finally, encode the rest of the bits using the normal algorithm. Because
|
|
|
// we made more room, this time it won't overflow.
|
|
|
|
|
|
var restOfLength = getBitLength(totalChildren) + restOfBaseLength;
|
|
|
var restOfNewBits = slot << restOfBaseLength;
|
|
|
var id = restOfNewBits | restOfBaseId;
|
|
|
var overflow = newOverflow + baseOverflow;
|
|
|
treeContextId = 1 << restOfLength | id;
|
|
|
treeContextOverflow = overflow;
|
|
|
} else {
|
|
|
// Normal path
|
|
|
var newBits = slot << baseLength;
|
|
|
|
|
|
var _id = newBits | baseId;
|
|
|
|
|
|
var _overflow = baseOverflow;
|
|
|
treeContextId = 1 << length | _id;
|
|
|
treeContextOverflow = _overflow;
|
|
|
}
|
|
|
}
|
|
|
function pushMaterializedTreeId(workInProgress) {
|
|
|
warnIfNotHydrating(); // This component materialized an id. This will affect any ids that appear
|
|
|
// in its children.
|
|
|
|
|
|
var returnFiber = workInProgress.return;
|
|
|
|
|
|
if (returnFiber !== null) {
|
|
|
var numberOfForks = 1;
|
|
|
var slotIndex = 0;
|
|
|
pushTreeFork(workInProgress, numberOfForks);
|
|
|
pushTreeId(workInProgress, numberOfForks, slotIndex);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getBitLength(number) {
|
|
|
return 32 - clz32(number);
|
|
|
}
|
|
|
|
|
|
function getLeadingBit(id) {
|
|
|
return 1 << getBitLength(id) - 1;
|
|
|
}
|
|
|
|
|
|
function popTreeContext(workInProgress) {
|
|
|
// Restore the previous values.
|
|
|
// This is a bit more complicated than other context-like modules in Fiber
|
|
|
// because the same Fiber may appear on the stack multiple times and for
|
|
|
// different reasons. We have to keep popping until the work-in-progress is
|
|
|
// no longer at the top of the stack.
|
|
|
while (workInProgress === treeForkProvider) {
|
|
|
treeForkProvider = forkStack[--forkStackIndex];
|
|
|
forkStack[forkStackIndex] = null;
|
|
|
treeForkCount = forkStack[--forkStackIndex];
|
|
|
forkStack[forkStackIndex] = null;
|
|
|
}
|
|
|
|
|
|
while (workInProgress === treeContextProvider) {
|
|
|
treeContextProvider = idStack[--idStackIndex];
|
|
|
idStack[idStackIndex] = null;
|
|
|
treeContextOverflow = idStack[--idStackIndex];
|
|
|
idStack[idStackIndex] = null;
|
|
|
treeContextId = idStack[--idStackIndex];
|
|
|
idStack[idStackIndex] = null;
|
|
|
}
|
|
|
}
|
|
|
function getSuspendedTreeContext() {
|
|
|
warnIfNotHydrating();
|
|
|
|
|
|
if (treeContextProvider !== null) {
|
|
|
return {
|
|
|
id: treeContextId,
|
|
|
overflow: treeContextOverflow
|
|
|
};
|
|
|
} else {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
function restoreSuspendedTreeContext(workInProgress, suspendedContext) {
|
|
|
warnIfNotHydrating();
|
|
|
idStack[idStackIndex++] = treeContextId;
|
|
|
idStack[idStackIndex++] = treeContextOverflow;
|
|
|
idStack[idStackIndex++] = treeContextProvider;
|
|
|
treeContextId = suspendedContext.id;
|
|
|
treeContextOverflow = suspendedContext.overflow;
|
|
|
treeContextProvider = workInProgress;
|
|
|
}
|
|
|
|
|
|
function warnIfNotHydrating() {
|
|
|
{
|
|
|
if (!getIsHydrating()) {
|
|
|
error('Expected to be hydrating. This is a bug in React. Please file ' + 'an issue.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// This may have been an insertion or a hydration.
|
|
|
|
|
|
var hydrationParentFiber = null;
|
|
|
var nextHydratableInstance = null;
|
|
|
var isHydrating = false; // This flag allows for warning supression when we expect there to be mismatches
|
|
|
// due to earlier mismatches or a suspended fiber.
|
|
|
|
|
|
var didSuspendOrErrorDEV = false; // Hydration errors that were thrown inside this boundary
|
|
|
|
|
|
var hydrationErrors = null;
|
|
|
|
|
|
function warnIfHydrating() {
|
|
|
{
|
|
|
if (isHydrating) {
|
|
|
error('We should not be hydrating here. This is a bug in React. Please file a bug.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function markDidThrowWhileHydratingDEV() {
|
|
|
{
|
|
|
didSuspendOrErrorDEV = true;
|
|
|
}
|
|
|
}
|
|
|
function didSuspendOrErrorWhileHydratingDEV() {
|
|
|
{
|
|
|
return didSuspendOrErrorDEV;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function enterHydrationState(fiber) {
|
|
|
|
|
|
var parentInstance = fiber.stateNode.containerInfo;
|
|
|
nextHydratableInstance = getFirstHydratableChildWithinContainer(parentInstance);
|
|
|
hydrationParentFiber = fiber;
|
|
|
isHydrating = true;
|
|
|
hydrationErrors = null;
|
|
|
didSuspendOrErrorDEV = false;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function reenterHydrationStateFromDehydratedSuspenseInstance(fiber, suspenseInstance, treeContext) {
|
|
|
|
|
|
nextHydratableInstance = getFirstHydratableChildWithinSuspenseInstance(suspenseInstance);
|
|
|
hydrationParentFiber = fiber;
|
|
|
isHydrating = true;
|
|
|
hydrationErrors = null;
|
|
|
didSuspendOrErrorDEV = false;
|
|
|
|
|
|
if (treeContext !== null) {
|
|
|
restoreSuspendedTreeContext(fiber, treeContext);
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function warnUnhydratedInstance(returnFiber, instance) {
|
|
|
{
|
|
|
switch (returnFiber.tag) {
|
|
|
case HostRoot:
|
|
|
{
|
|
|
didNotHydrateInstanceWithinContainer(returnFiber.stateNode.containerInfo, instance);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
|
|
|
didNotHydrateInstance(returnFiber.type, returnFiber.memoizedProps, returnFiber.stateNode, instance, // TODO: Delete this argument when we remove the legacy root API.
|
|
|
isConcurrentMode);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
var suspenseState = returnFiber.memoizedState;
|
|
|
if (suspenseState.dehydrated !== null) didNotHydrateInstanceWithinSuspenseInstance(suspenseState.dehydrated, instance);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function deleteHydratableInstance(returnFiber, instance) {
|
|
|
warnUnhydratedInstance(returnFiber, instance);
|
|
|
var childToDelete = createFiberFromHostInstanceForDeletion();
|
|
|
childToDelete.stateNode = instance;
|
|
|
childToDelete.return = returnFiber;
|
|
|
var deletions = returnFiber.deletions;
|
|
|
|
|
|
if (deletions === null) {
|
|
|
returnFiber.deletions = [childToDelete];
|
|
|
returnFiber.flags |= ChildDeletion;
|
|
|
} else {
|
|
|
deletions.push(childToDelete);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function warnNonhydratedInstance(returnFiber, fiber) {
|
|
|
{
|
|
|
if (didSuspendOrErrorDEV) {
|
|
|
// Inside a boundary that already suspended. We're currently rendering the
|
|
|
// siblings of a suspended node. The mismatch may be due to the missing
|
|
|
// data, so it's probably a false positive.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
switch (returnFiber.tag) {
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var parentContainer = returnFiber.stateNode.containerInfo;
|
|
|
|
|
|
switch (fiber.tag) {
|
|
|
case HostComponent:
|
|
|
var type = fiber.type;
|
|
|
var props = fiber.pendingProps;
|
|
|
didNotFindHydratableInstanceWithinContainer(parentContainer, type);
|
|
|
break;
|
|
|
|
|
|
case HostText:
|
|
|
var text = fiber.pendingProps;
|
|
|
didNotFindHydratableTextInstanceWithinContainer(parentContainer, text);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var parentType = returnFiber.type;
|
|
|
var parentProps = returnFiber.memoizedProps;
|
|
|
var parentInstance = returnFiber.stateNode;
|
|
|
|
|
|
switch (fiber.tag) {
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var _type = fiber.type;
|
|
|
var _props = fiber.pendingProps;
|
|
|
var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
|
|
|
didNotFindHydratableInstance(parentType, parentProps, parentInstance, _type, _props, // TODO: Delete this argument when we remove the legacy root API.
|
|
|
isConcurrentMode);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostText:
|
|
|
{
|
|
|
var _text = fiber.pendingProps;
|
|
|
|
|
|
var _isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
|
|
|
|
|
|
didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, _text, // TODO: Delete this argument when we remove the legacy root API.
|
|
|
_isConcurrentMode);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
var suspenseState = returnFiber.memoizedState;
|
|
|
var _parentInstance = suspenseState.dehydrated;
|
|
|
if (_parentInstance !== null) switch (fiber.tag) {
|
|
|
case HostComponent:
|
|
|
var _type2 = fiber.type;
|
|
|
var _props2 = fiber.pendingProps;
|
|
|
didNotFindHydratableInstanceWithinSuspenseInstance(_parentInstance, _type2);
|
|
|
break;
|
|
|
|
|
|
case HostText:
|
|
|
var _text2 = fiber.pendingProps;
|
|
|
didNotFindHydratableTextInstanceWithinSuspenseInstance(_parentInstance, _text2);
|
|
|
break;
|
|
|
}
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function insertNonHydratedInstance(returnFiber, fiber) {
|
|
|
fiber.flags = fiber.flags & ~Hydrating | Placement;
|
|
|
warnNonhydratedInstance(returnFiber, fiber);
|
|
|
}
|
|
|
|
|
|
function tryHydrate(fiber, nextInstance) {
|
|
|
switch (fiber.tag) {
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var type = fiber.type;
|
|
|
var props = fiber.pendingProps;
|
|
|
var instance = canHydrateInstance(nextInstance, type);
|
|
|
|
|
|
if (instance !== null) {
|
|
|
fiber.stateNode = instance;
|
|
|
hydrationParentFiber = fiber;
|
|
|
nextHydratableInstance = getFirstHydratableChild(instance);
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
case HostText:
|
|
|
{
|
|
|
var text = fiber.pendingProps;
|
|
|
var textInstance = canHydrateTextInstance(nextInstance, text);
|
|
|
|
|
|
if (textInstance !== null) {
|
|
|
fiber.stateNode = textInstance;
|
|
|
hydrationParentFiber = fiber; // Text Instances don't have children so there's nothing to hydrate.
|
|
|
|
|
|
nextHydratableInstance = null;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
var suspenseInstance = canHydrateSuspenseInstance(nextInstance);
|
|
|
|
|
|
if (suspenseInstance !== null) {
|
|
|
var suspenseState = {
|
|
|
dehydrated: suspenseInstance,
|
|
|
treeContext: getSuspendedTreeContext(),
|
|
|
retryLane: OffscreenLane
|
|
|
};
|
|
|
fiber.memoizedState = suspenseState; // Store the dehydrated fragment as a child fiber.
|
|
|
// This simplifies the code for getHostSibling and deleting nodes,
|
|
|
// since it doesn't have to consider all Suspense boundaries and
|
|
|
// check if they're dehydrated ones or not.
|
|
|
|
|
|
var dehydratedFragment = createFiberFromDehydratedFragment(suspenseInstance);
|
|
|
dehydratedFragment.return = fiber;
|
|
|
fiber.child = dehydratedFragment;
|
|
|
hydrationParentFiber = fiber; // While a Suspense Instance does have children, we won't step into
|
|
|
// it during the first pass. Instead, we'll reenter it later.
|
|
|
|
|
|
nextHydratableInstance = null;
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function shouldClientRenderOnMismatch(fiber) {
|
|
|
return (fiber.mode & ConcurrentMode) !== NoMode && (fiber.flags & DidCapture) === NoFlags;
|
|
|
}
|
|
|
|
|
|
function throwOnHydrationMismatch(fiber) {
|
|
|
throw new Error('Hydration failed because the initial UI does not match what was ' + 'rendered on the server.');
|
|
|
}
|
|
|
|
|
|
function tryToClaimNextHydratableInstance(fiber) {
|
|
|
if (!isHydrating) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var nextInstance = nextHydratableInstance;
|
|
|
|
|
|
if (!nextInstance) {
|
|
|
if (shouldClientRenderOnMismatch(fiber)) {
|
|
|
warnNonhydratedInstance(hydrationParentFiber, fiber);
|
|
|
throwOnHydrationMismatch();
|
|
|
} // Nothing to hydrate. Make it an insertion.
|
|
|
|
|
|
|
|
|
insertNonHydratedInstance(hydrationParentFiber, fiber);
|
|
|
isHydrating = false;
|
|
|
hydrationParentFiber = fiber;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var firstAttemptedInstance = nextInstance;
|
|
|
|
|
|
if (!tryHydrate(fiber, nextInstance)) {
|
|
|
if (shouldClientRenderOnMismatch(fiber)) {
|
|
|
warnNonhydratedInstance(hydrationParentFiber, fiber);
|
|
|
throwOnHydrationMismatch();
|
|
|
} // If we can't hydrate this instance let's try the next one.
|
|
|
// We use this as a heuristic. It's based on intuition and not data so it
|
|
|
// might be flawed or unnecessary.
|
|
|
|
|
|
|
|
|
nextInstance = getNextHydratableSibling(firstAttemptedInstance);
|
|
|
var prevHydrationParentFiber = hydrationParentFiber;
|
|
|
|
|
|
if (!nextInstance || !tryHydrate(fiber, nextInstance)) {
|
|
|
// Nothing to hydrate. Make it an insertion.
|
|
|
insertNonHydratedInstance(hydrationParentFiber, fiber);
|
|
|
isHydrating = false;
|
|
|
hydrationParentFiber = fiber;
|
|
|
return;
|
|
|
} // We matched the next one, we'll now assume that the first one was
|
|
|
// superfluous and we'll delete it. Since we can't eagerly delete it
|
|
|
// we'll have to schedule a deletion. To do that, this node needs a dummy
|
|
|
// fiber associated with it.
|
|
|
|
|
|
|
|
|
deleteHydratableInstance(prevHydrationParentFiber, firstAttemptedInstance);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function prepareToHydrateHostInstance(fiber, rootContainerInstance, hostContext) {
|
|
|
|
|
|
var instance = fiber.stateNode;
|
|
|
var shouldWarnIfMismatchDev = !didSuspendOrErrorDEV;
|
|
|
var updatePayload = hydrateInstance(instance, fiber.type, fiber.memoizedProps, rootContainerInstance, hostContext, fiber, shouldWarnIfMismatchDev); // TODO: Type this specific to this type of component.
|
|
|
|
|
|
fiber.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there
|
|
|
// is a new ref we mark this as an update.
|
|
|
|
|
|
if (updatePayload !== null) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
function prepareToHydrateHostTextInstance(fiber) {
|
|
|
|
|
|
var textInstance = fiber.stateNode;
|
|
|
var textContent = fiber.memoizedProps;
|
|
|
var shouldUpdate = hydrateTextInstance(textInstance, textContent, fiber);
|
|
|
|
|
|
if (shouldUpdate) {
|
|
|
// We assume that prepareToHydrateHostTextInstance is called in a context where the
|
|
|
// hydration parent is the parent host component of this host text.
|
|
|
var returnFiber = hydrationParentFiber;
|
|
|
|
|
|
if (returnFiber !== null) {
|
|
|
switch (returnFiber.tag) {
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var parentContainer = returnFiber.stateNode.containerInfo;
|
|
|
var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode;
|
|
|
didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, textContent, // TODO: Delete this argument when we remove the legacy root API.
|
|
|
isConcurrentMode);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var parentType = returnFiber.type;
|
|
|
var parentProps = returnFiber.memoizedProps;
|
|
|
var parentInstance = returnFiber.stateNode;
|
|
|
|
|
|
var _isConcurrentMode2 = (returnFiber.mode & ConcurrentMode) !== NoMode;
|
|
|
|
|
|
didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, textContent, // TODO: Delete this argument when we remove the legacy root API.
|
|
|
_isConcurrentMode2);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return shouldUpdate;
|
|
|
}
|
|
|
|
|
|
function prepareToHydrateHostSuspenseInstance(fiber) {
|
|
|
|
|
|
var suspenseState = fiber.memoizedState;
|
|
|
var suspenseInstance = suspenseState !== null ? suspenseState.dehydrated : null;
|
|
|
|
|
|
if (!suspenseInstance) {
|
|
|
throw new Error('Expected to have a hydrated suspense instance. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
hydrateSuspenseInstance(suspenseInstance, fiber);
|
|
|
}
|
|
|
|
|
|
function skipPastDehydratedSuspenseInstance(fiber) {
|
|
|
|
|
|
var suspenseState = fiber.memoizedState;
|
|
|
var suspenseInstance = suspenseState !== null ? suspenseState.dehydrated : null;
|
|
|
|
|
|
if (!suspenseInstance) {
|
|
|
throw new Error('Expected to have a hydrated suspense instance. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
return getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance);
|
|
|
}
|
|
|
|
|
|
function popToNextHostParent(fiber) {
|
|
|
var parent = fiber.return;
|
|
|
|
|
|
while (parent !== null && parent.tag !== HostComponent && parent.tag !== HostRoot && parent.tag !== SuspenseComponent) {
|
|
|
parent = parent.return;
|
|
|
}
|
|
|
|
|
|
hydrationParentFiber = parent;
|
|
|
}
|
|
|
|
|
|
function popHydrationState(fiber) {
|
|
|
|
|
|
if (fiber !== hydrationParentFiber) {
|
|
|
// We're deeper than the current hydration context, inside an inserted
|
|
|
// tree.
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (!isHydrating) {
|
|
|
// If we're not currently hydrating but we're in a hydration context, then
|
|
|
// we were an insertion and now need to pop up reenter hydration of our
|
|
|
// siblings.
|
|
|
popToNextHostParent(fiber);
|
|
|
isHydrating = true;
|
|
|
return false;
|
|
|
} // If we have any remaining hydratable nodes, we need to delete them now.
|
|
|
// We only do this deeper than head and body since they tend to have random
|
|
|
// other nodes in them. We also ignore components with pure text content in
|
|
|
// side of them. We also don't delete anything inside the root container.
|
|
|
|
|
|
|
|
|
if (fiber.tag !== HostRoot && (fiber.tag !== HostComponent || shouldDeleteUnhydratedTailInstances(fiber.type) && !shouldSetTextContent(fiber.type, fiber.memoizedProps))) {
|
|
|
var nextInstance = nextHydratableInstance;
|
|
|
|
|
|
if (nextInstance) {
|
|
|
if (shouldClientRenderOnMismatch(fiber)) {
|
|
|
warnIfUnhydratedTailNodes(fiber);
|
|
|
throwOnHydrationMismatch();
|
|
|
} else {
|
|
|
while (nextInstance) {
|
|
|
deleteHydratableInstance(fiber, nextInstance);
|
|
|
nextInstance = getNextHydratableSibling(nextInstance);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
popToNextHostParent(fiber);
|
|
|
|
|
|
if (fiber.tag === SuspenseComponent) {
|
|
|
nextHydratableInstance = skipPastDehydratedSuspenseInstance(fiber);
|
|
|
} else {
|
|
|
nextHydratableInstance = hydrationParentFiber ? getNextHydratableSibling(fiber.stateNode) : null;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function hasUnhydratedTailNodes() {
|
|
|
return isHydrating && nextHydratableInstance !== null;
|
|
|
}
|
|
|
|
|
|
function warnIfUnhydratedTailNodes(fiber) {
|
|
|
var nextInstance = nextHydratableInstance;
|
|
|
|
|
|
while (nextInstance) {
|
|
|
warnUnhydratedInstance(fiber, nextInstance);
|
|
|
nextInstance = getNextHydratableSibling(nextInstance);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function resetHydrationState() {
|
|
|
|
|
|
hydrationParentFiber = null;
|
|
|
nextHydratableInstance = null;
|
|
|
isHydrating = false;
|
|
|
didSuspendOrErrorDEV = false;
|
|
|
}
|
|
|
|
|
|
function upgradeHydrationErrorsToRecoverable() {
|
|
|
if (hydrationErrors !== null) {
|
|
|
// Successfully completed a forced client render. The errors that occurred
|
|
|
// during the hydration attempt are now recovered. We will log them in
|
|
|
// commit phase, once the entire tree has finished.
|
|
|
queueRecoverableErrors(hydrationErrors);
|
|
|
hydrationErrors = null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getIsHydrating() {
|
|
|
return isHydrating;
|
|
|
}
|
|
|
|
|
|
function queueHydrationError(error) {
|
|
|
if (hydrationErrors === null) {
|
|
|
hydrationErrors = [error];
|
|
|
} else {
|
|
|
hydrationErrors.push(error);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentBatchConfig$1 = ReactSharedInternals.ReactCurrentBatchConfig;
|
|
|
var NoTransition = null;
|
|
|
function requestCurrentTransition() {
|
|
|
return ReactCurrentBatchConfig$1.transition;
|
|
|
}
|
|
|
|
|
|
var ReactStrictModeWarnings = {
|
|
|
recordUnsafeLifecycleWarnings: function (fiber, instance) {},
|
|
|
flushPendingUnsafeLifecycleWarnings: function () {},
|
|
|
recordLegacyContextWarning: function (fiber, instance) {},
|
|
|
flushLegacyContextWarning: function () {},
|
|
|
discardPendingWarnings: function () {}
|
|
|
};
|
|
|
|
|
|
{
|
|
|
var findStrictRoot = function (fiber) {
|
|
|
var maybeStrictRoot = null;
|
|
|
var node = fiber;
|
|
|
|
|
|
while (node !== null) {
|
|
|
if (node.mode & StrictLegacyMode) {
|
|
|
maybeStrictRoot = node;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
return maybeStrictRoot;
|
|
|
};
|
|
|
|
|
|
var setToSortedString = function (set) {
|
|
|
var array = [];
|
|
|
set.forEach(function (value) {
|
|
|
array.push(value);
|
|
|
});
|
|
|
return array.sort().join(', ');
|
|
|
};
|
|
|
|
|
|
var pendingComponentWillMountWarnings = [];
|
|
|
var pendingUNSAFE_ComponentWillMountWarnings = [];
|
|
|
var pendingComponentWillReceivePropsWarnings = [];
|
|
|
var pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
|
|
|
var pendingComponentWillUpdateWarnings = [];
|
|
|
var pendingUNSAFE_ComponentWillUpdateWarnings = []; // Tracks components we have already warned about.
|
|
|
|
|
|
var didWarnAboutUnsafeLifecycles = new Set();
|
|
|
|
|
|
ReactStrictModeWarnings.recordUnsafeLifecycleWarnings = function (fiber, instance) {
|
|
|
// Dedupe strategy: Warn once per component.
|
|
|
if (didWarnAboutUnsafeLifecycles.has(fiber.type)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentWillMount === 'function' && // Don't warn about react-lifecycles-compat polyfilled components.
|
|
|
instance.componentWillMount.__suppressDeprecationWarning !== true) {
|
|
|
pendingComponentWillMountWarnings.push(fiber);
|
|
|
}
|
|
|
|
|
|
if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillMount === 'function') {
|
|
|
pendingUNSAFE_ComponentWillMountWarnings.push(fiber);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) {
|
|
|
pendingComponentWillReceivePropsWarnings.push(fiber);
|
|
|
}
|
|
|
|
|
|
if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
|
|
|
pendingUNSAFE_ComponentWillReceivePropsWarnings.push(fiber);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) {
|
|
|
pendingComponentWillUpdateWarnings.push(fiber);
|
|
|
}
|
|
|
|
|
|
if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillUpdate === 'function') {
|
|
|
pendingUNSAFE_ComponentWillUpdateWarnings.push(fiber);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings = function () {
|
|
|
// We do an initial pass to gather component names
|
|
|
var componentWillMountUniqueNames = new Set();
|
|
|
|
|
|
if (pendingComponentWillMountWarnings.length > 0) {
|
|
|
pendingComponentWillMountWarnings.forEach(function (fiber) {
|
|
|
componentWillMountUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutUnsafeLifecycles.add(fiber.type);
|
|
|
});
|
|
|
pendingComponentWillMountWarnings = [];
|
|
|
}
|
|
|
|
|
|
var UNSAFE_componentWillMountUniqueNames = new Set();
|
|
|
|
|
|
if (pendingUNSAFE_ComponentWillMountWarnings.length > 0) {
|
|
|
pendingUNSAFE_ComponentWillMountWarnings.forEach(function (fiber) {
|
|
|
UNSAFE_componentWillMountUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutUnsafeLifecycles.add(fiber.type);
|
|
|
});
|
|
|
pendingUNSAFE_ComponentWillMountWarnings = [];
|
|
|
}
|
|
|
|
|
|
var componentWillReceivePropsUniqueNames = new Set();
|
|
|
|
|
|
if (pendingComponentWillReceivePropsWarnings.length > 0) {
|
|
|
pendingComponentWillReceivePropsWarnings.forEach(function (fiber) {
|
|
|
componentWillReceivePropsUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutUnsafeLifecycles.add(fiber.type);
|
|
|
});
|
|
|
pendingComponentWillReceivePropsWarnings = [];
|
|
|
}
|
|
|
|
|
|
var UNSAFE_componentWillReceivePropsUniqueNames = new Set();
|
|
|
|
|
|
if (pendingUNSAFE_ComponentWillReceivePropsWarnings.length > 0) {
|
|
|
pendingUNSAFE_ComponentWillReceivePropsWarnings.forEach(function (fiber) {
|
|
|
UNSAFE_componentWillReceivePropsUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutUnsafeLifecycles.add(fiber.type);
|
|
|
});
|
|
|
pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
|
|
|
}
|
|
|
|
|
|
var componentWillUpdateUniqueNames = new Set();
|
|
|
|
|
|
if (pendingComponentWillUpdateWarnings.length > 0) {
|
|
|
pendingComponentWillUpdateWarnings.forEach(function (fiber) {
|
|
|
componentWillUpdateUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutUnsafeLifecycles.add(fiber.type);
|
|
|
});
|
|
|
pendingComponentWillUpdateWarnings = [];
|
|
|
}
|
|
|
|
|
|
var UNSAFE_componentWillUpdateUniqueNames = new Set();
|
|
|
|
|
|
if (pendingUNSAFE_ComponentWillUpdateWarnings.length > 0) {
|
|
|
pendingUNSAFE_ComponentWillUpdateWarnings.forEach(function (fiber) {
|
|
|
UNSAFE_componentWillUpdateUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutUnsafeLifecycles.add(fiber.type);
|
|
|
});
|
|
|
pendingUNSAFE_ComponentWillUpdateWarnings = [];
|
|
|
} // Finally, we flush all the warnings
|
|
|
// UNSAFE_ ones before the deprecated ones, since they'll be 'louder'
|
|
|
|
|
|
|
|
|
if (UNSAFE_componentWillMountUniqueNames.size > 0) {
|
|
|
var sortedNames = setToSortedString(UNSAFE_componentWillMountUniqueNames);
|
|
|
|
|
|
error('Using UNSAFE_componentWillMount in strict mode is not recommended and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '\nPlease update the following components: %s', sortedNames);
|
|
|
}
|
|
|
|
|
|
if (UNSAFE_componentWillReceivePropsUniqueNames.size > 0) {
|
|
|
var _sortedNames = setToSortedString(UNSAFE_componentWillReceivePropsUniqueNames);
|
|
|
|
|
|
error('Using UNSAFE_componentWillReceiveProps in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, " + 'refactor your code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '\nPlease update the following components: %s', _sortedNames);
|
|
|
}
|
|
|
|
|
|
if (UNSAFE_componentWillUpdateUniqueNames.size > 0) {
|
|
|
var _sortedNames2 = setToSortedString(UNSAFE_componentWillUpdateUniqueNames);
|
|
|
|
|
|
error('Using UNSAFE_componentWillUpdate in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '\nPlease update the following components: %s', _sortedNames2);
|
|
|
}
|
|
|
|
|
|
if (componentWillMountUniqueNames.size > 0) {
|
|
|
var _sortedNames3 = setToSortedString(componentWillMountUniqueNames);
|
|
|
|
|
|
warn('componentWillMount has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '* Rename componentWillMount to UNSAFE_componentWillMount to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames3);
|
|
|
}
|
|
|
|
|
|
if (componentWillReceivePropsUniqueNames.size > 0) {
|
|
|
var _sortedNames4 = setToSortedString(componentWillReceivePropsUniqueNames);
|
|
|
|
|
|
warn('componentWillReceiveProps has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, refactor your " + 'code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames4);
|
|
|
}
|
|
|
|
|
|
if (componentWillUpdateUniqueNames.size > 0) {
|
|
|
var _sortedNames5 = setToSortedString(componentWillUpdateUniqueNames);
|
|
|
|
|
|
warn('componentWillUpdate has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '* Rename componentWillUpdate to UNSAFE_componentWillUpdate to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames5);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var pendingLegacyContextWarning = new Map(); // Tracks components we have already warned about.
|
|
|
|
|
|
var didWarnAboutLegacyContext = new Set();
|
|
|
|
|
|
ReactStrictModeWarnings.recordLegacyContextWarning = function (fiber, instance) {
|
|
|
var strictRoot = findStrictRoot(fiber);
|
|
|
|
|
|
if (strictRoot === null) {
|
|
|
error('Expected to find a StrictMode component in a strict mode tree. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
|
|
|
return;
|
|
|
} // Dedup strategy: Warn once per component.
|
|
|
|
|
|
|
|
|
if (didWarnAboutLegacyContext.has(fiber.type)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var warningsForRoot = pendingLegacyContextWarning.get(strictRoot);
|
|
|
|
|
|
if (fiber.type.contextTypes != null || fiber.type.childContextTypes != null || instance !== null && typeof instance.getChildContext === 'function') {
|
|
|
if (warningsForRoot === undefined) {
|
|
|
warningsForRoot = [];
|
|
|
pendingLegacyContextWarning.set(strictRoot, warningsForRoot);
|
|
|
}
|
|
|
|
|
|
warningsForRoot.push(fiber);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
ReactStrictModeWarnings.flushLegacyContextWarning = function () {
|
|
|
pendingLegacyContextWarning.forEach(function (fiberArray, strictRoot) {
|
|
|
if (fiberArray.length === 0) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var firstFiber = fiberArray[0];
|
|
|
var uniqueNames = new Set();
|
|
|
fiberArray.forEach(function (fiber) {
|
|
|
uniqueNames.add(getComponentNameFromFiber(fiber) || 'Component');
|
|
|
didWarnAboutLegacyContext.add(fiber.type);
|
|
|
});
|
|
|
var sortedNames = setToSortedString(uniqueNames);
|
|
|
|
|
|
try {
|
|
|
setCurrentFiber(firstFiber);
|
|
|
|
|
|
error('Legacy context API has been detected within a strict-mode tree.' + '\n\nThe old API will be supported in all 16.x releases, but applications ' + 'using it should migrate to the new version.' + '\n\nPlease update the following components: %s' + '\n\nLearn more about this warning here: https://reactjs.org/link/legacy-context', sortedNames);
|
|
|
} finally {
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
|
|
|
ReactStrictModeWarnings.discardPendingWarnings = function () {
|
|
|
pendingComponentWillMountWarnings = [];
|
|
|
pendingUNSAFE_ComponentWillMountWarnings = [];
|
|
|
pendingComponentWillReceivePropsWarnings = [];
|
|
|
pendingUNSAFE_ComponentWillReceivePropsWarnings = [];
|
|
|
pendingComponentWillUpdateWarnings = [];
|
|
|
pendingUNSAFE_ComponentWillUpdateWarnings = [];
|
|
|
pendingLegacyContextWarning = new Map();
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function resolveDefaultProps(Component, baseProps) {
|
|
|
if (Component && Component.defaultProps) {
|
|
|
// Resolve default props. Taken from ReactElement
|
|
|
var props = assign({}, baseProps);
|
|
|
var defaultProps = Component.defaultProps;
|
|
|
|
|
|
for (var propName in defaultProps) {
|
|
|
if (props[propName] === undefined) {
|
|
|
props[propName] = defaultProps[propName];
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return props;
|
|
|
}
|
|
|
|
|
|
return baseProps;
|
|
|
}
|
|
|
|
|
|
var valueCursor = createCursor(null);
|
|
|
var rendererSigil;
|
|
|
|
|
|
{
|
|
|
// Use this to detect multiple renderers using the same context
|
|
|
rendererSigil = {};
|
|
|
}
|
|
|
|
|
|
var currentlyRenderingFiber = null;
|
|
|
var lastContextDependency = null;
|
|
|
var lastFullyObservedContext = null;
|
|
|
var isDisallowedContextReadInDEV = false;
|
|
|
function resetContextDependencies() {
|
|
|
// This is called right before React yields execution, to ensure `readContext`
|
|
|
// cannot be called outside the render phase.
|
|
|
currentlyRenderingFiber = null;
|
|
|
lastContextDependency = null;
|
|
|
lastFullyObservedContext = null;
|
|
|
|
|
|
{
|
|
|
isDisallowedContextReadInDEV = false;
|
|
|
}
|
|
|
}
|
|
|
function enterDisallowedContextReadInDEV() {
|
|
|
{
|
|
|
isDisallowedContextReadInDEV = true;
|
|
|
}
|
|
|
}
|
|
|
function exitDisallowedContextReadInDEV() {
|
|
|
{
|
|
|
isDisallowedContextReadInDEV = false;
|
|
|
}
|
|
|
}
|
|
|
function pushProvider(providerFiber, context, nextValue) {
|
|
|
{
|
|
|
push(valueCursor, context._currentValue, providerFiber);
|
|
|
context._currentValue = nextValue;
|
|
|
|
|
|
{
|
|
|
if (context._currentRenderer !== undefined && context._currentRenderer !== null && context._currentRenderer !== rendererSigil) {
|
|
|
error('Detected multiple renderers concurrently rendering the ' + 'same context provider. This is currently unsupported.');
|
|
|
}
|
|
|
|
|
|
context._currentRenderer = rendererSigil;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function popProvider(context, providerFiber) {
|
|
|
var currentValue = valueCursor.current;
|
|
|
pop(valueCursor, providerFiber);
|
|
|
|
|
|
{
|
|
|
{
|
|
|
context._currentValue = currentValue;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function scheduleContextWorkOnParentPath(parent, renderLanes, propagationRoot) {
|
|
|
// Update the child lanes of all the ancestors, including the alternates.
|
|
|
var node = parent;
|
|
|
|
|
|
while (node !== null) {
|
|
|
var alternate = node.alternate;
|
|
|
|
|
|
if (!isSubsetOfLanes(node.childLanes, renderLanes)) {
|
|
|
node.childLanes = mergeLanes(node.childLanes, renderLanes);
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes);
|
|
|
}
|
|
|
} else if (alternate !== null && !isSubsetOfLanes(alternate.childLanes, renderLanes)) {
|
|
|
alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes);
|
|
|
}
|
|
|
|
|
|
if (node === propagationRoot) {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (node !== propagationRoot) {
|
|
|
error('Expected to find the propagation root when scheduling context work. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function propagateContextChange(workInProgress, context, renderLanes) {
|
|
|
{
|
|
|
propagateContextChange_eager(workInProgress, context, renderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function propagateContextChange_eager(workInProgress, context, renderLanes) {
|
|
|
|
|
|
var fiber = workInProgress.child;
|
|
|
|
|
|
if (fiber !== null) {
|
|
|
// Set the return pointer of the child to the work-in-progress fiber.
|
|
|
fiber.return = workInProgress;
|
|
|
}
|
|
|
|
|
|
while (fiber !== null) {
|
|
|
var nextFiber = void 0; // Visit this fiber.
|
|
|
|
|
|
var list = fiber.dependencies;
|
|
|
|
|
|
if (list !== null) {
|
|
|
nextFiber = fiber.child;
|
|
|
var dependency = list.firstContext;
|
|
|
|
|
|
while (dependency !== null) {
|
|
|
// Check if the context matches.
|
|
|
if (dependency.context === context) {
|
|
|
// Match! Schedule an update on this fiber.
|
|
|
if (fiber.tag === ClassComponent) {
|
|
|
// Schedule a force update on the work-in-progress.
|
|
|
var lane = pickArbitraryLane(renderLanes);
|
|
|
var update = createUpdate(NoTimestamp, lane);
|
|
|
update.tag = ForceUpdate; // TODO: Because we don't have a work-in-progress, this will add the
|
|
|
// update to the current fiber, too, which means it will persist even if
|
|
|
// this render is thrown away. Since it's a race condition, not sure it's
|
|
|
// worth fixing.
|
|
|
// Inlined `enqueueUpdate` to remove interleaved update check
|
|
|
|
|
|
var updateQueue = fiber.updateQueue;
|
|
|
|
|
|
if (updateQueue === null) ; else {
|
|
|
var sharedQueue = updateQueue.shared;
|
|
|
var pending = sharedQueue.pending;
|
|
|
|
|
|
if (pending === null) {
|
|
|
// This is the first update. Create a circular list.
|
|
|
update.next = update;
|
|
|
} else {
|
|
|
update.next = pending.next;
|
|
|
pending.next = update;
|
|
|
}
|
|
|
|
|
|
sharedQueue.pending = update;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
fiber.lanes = mergeLanes(fiber.lanes, renderLanes);
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
alternate.lanes = mergeLanes(alternate.lanes, renderLanes);
|
|
|
}
|
|
|
|
|
|
scheduleContextWorkOnParentPath(fiber.return, renderLanes, workInProgress); // Mark the updated lanes on the list, too.
|
|
|
|
|
|
list.lanes = mergeLanes(list.lanes, renderLanes); // Since we already found a match, we can stop traversing the
|
|
|
// dependency list.
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
dependency = dependency.next;
|
|
|
}
|
|
|
} else if (fiber.tag === ContextProvider) {
|
|
|
// Don't scan deeper if this is a matching provider
|
|
|
nextFiber = fiber.type === workInProgress.type ? null : fiber.child;
|
|
|
} else if (fiber.tag === DehydratedFragment) {
|
|
|
// If a dehydrated suspense boundary is in this subtree, we don't know
|
|
|
// if it will have any context consumers in it. The best we can do is
|
|
|
// mark it as having updates.
|
|
|
var parentSuspense = fiber.return;
|
|
|
|
|
|
if (parentSuspense === null) {
|
|
|
throw new Error('We just came from a parent so we must have had a parent. This is a bug in React.');
|
|
|
}
|
|
|
|
|
|
parentSuspense.lanes = mergeLanes(parentSuspense.lanes, renderLanes);
|
|
|
var _alternate = parentSuspense.alternate;
|
|
|
|
|
|
if (_alternate !== null) {
|
|
|
_alternate.lanes = mergeLanes(_alternate.lanes, renderLanes);
|
|
|
} // This is intentionally passing this fiber as the parent
|
|
|
// because we want to schedule this fiber as having work
|
|
|
// on its children. We'll use the childLanes on
|
|
|
// this fiber to indicate that a context has changed.
|
|
|
|
|
|
|
|
|
scheduleContextWorkOnParentPath(parentSuspense, renderLanes, workInProgress);
|
|
|
nextFiber = fiber.sibling;
|
|
|
} else {
|
|
|
// Traverse down.
|
|
|
nextFiber = fiber.child;
|
|
|
}
|
|
|
|
|
|
if (nextFiber !== null) {
|
|
|
// Set the return pointer of the child to the work-in-progress fiber.
|
|
|
nextFiber.return = fiber;
|
|
|
} else {
|
|
|
// No child. Traverse to next sibling.
|
|
|
nextFiber = fiber;
|
|
|
|
|
|
while (nextFiber !== null) {
|
|
|
if (nextFiber === workInProgress) {
|
|
|
// We're back to the root of this subtree. Exit.
|
|
|
nextFiber = null;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var sibling = nextFiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
// Set the return pointer of the sibling to the work-in-progress fiber.
|
|
|
sibling.return = nextFiber.return;
|
|
|
nextFiber = sibling;
|
|
|
break;
|
|
|
} // No more siblings. Traverse up.
|
|
|
|
|
|
|
|
|
nextFiber = nextFiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
fiber = nextFiber;
|
|
|
}
|
|
|
}
|
|
|
function prepareToReadContext(workInProgress, renderLanes) {
|
|
|
currentlyRenderingFiber = workInProgress;
|
|
|
lastContextDependency = null;
|
|
|
lastFullyObservedContext = null;
|
|
|
var dependencies = workInProgress.dependencies;
|
|
|
|
|
|
if (dependencies !== null) {
|
|
|
{
|
|
|
var firstContext = dependencies.firstContext;
|
|
|
|
|
|
if (firstContext !== null) {
|
|
|
if (includesSomeLane(dependencies.lanes, renderLanes)) {
|
|
|
// Context list has a pending update. Mark that this fiber performed work.
|
|
|
markWorkInProgressReceivedUpdate();
|
|
|
} // Reset the work-in-progress list
|
|
|
|
|
|
|
|
|
dependencies.firstContext = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function readContext(context) {
|
|
|
{
|
|
|
// This warning would fire if you read context inside a Hook like useMemo.
|
|
|
// Unlike the class check below, it's not enforced in production for perf.
|
|
|
if (isDisallowedContextReadInDEV) {
|
|
|
error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var value = context._currentValue ;
|
|
|
|
|
|
if (lastFullyObservedContext === context) ; else {
|
|
|
var contextItem = {
|
|
|
context: context,
|
|
|
memoizedValue: value,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (lastContextDependency === null) {
|
|
|
if (currentlyRenderingFiber === null) {
|
|
|
throw new Error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
|
|
|
} // This is the first dependency for this component. Create a new list.
|
|
|
|
|
|
|
|
|
lastContextDependency = contextItem;
|
|
|
currentlyRenderingFiber.dependencies = {
|
|
|
lanes: NoLanes,
|
|
|
firstContext: contextItem
|
|
|
};
|
|
|
} else {
|
|
|
// Append a new context item.
|
|
|
lastContextDependency = lastContextDependency.next = contextItem;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return value;
|
|
|
}
|
|
|
|
|
|
// render. When this render exits, either because it finishes or because it is
|
|
|
// interrupted, the interleaved updates will be transferred onto the main part
|
|
|
// of the queue.
|
|
|
|
|
|
var concurrentQueues = null;
|
|
|
function pushConcurrentUpdateQueue(queue) {
|
|
|
if (concurrentQueues === null) {
|
|
|
concurrentQueues = [queue];
|
|
|
} else {
|
|
|
concurrentQueues.push(queue);
|
|
|
}
|
|
|
}
|
|
|
function finishQueueingConcurrentUpdates() {
|
|
|
// Transfer the interleaved updates onto the main queue. Each queue has a
|
|
|
// `pending` field and an `interleaved` field. When they are not null, they
|
|
|
// point to the last node in a circular linked list. We need to append the
|
|
|
// interleaved list to the end of the pending list by joining them into a
|
|
|
// single, circular list.
|
|
|
if (concurrentQueues !== null) {
|
|
|
for (var i = 0; i < concurrentQueues.length; i++) {
|
|
|
var queue = concurrentQueues[i];
|
|
|
var lastInterleavedUpdate = queue.interleaved;
|
|
|
|
|
|
if (lastInterleavedUpdate !== null) {
|
|
|
queue.interleaved = null;
|
|
|
var firstInterleavedUpdate = lastInterleavedUpdate.next;
|
|
|
var lastPendingUpdate = queue.pending;
|
|
|
|
|
|
if (lastPendingUpdate !== null) {
|
|
|
var firstPendingUpdate = lastPendingUpdate.next;
|
|
|
lastPendingUpdate.next = firstInterleavedUpdate;
|
|
|
lastInterleavedUpdate.next = firstPendingUpdate;
|
|
|
}
|
|
|
|
|
|
queue.pending = lastInterleavedUpdate;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
concurrentQueues = null;
|
|
|
}
|
|
|
}
|
|
|
function enqueueConcurrentHookUpdate(fiber, queue, update, lane) {
|
|
|
var interleaved = queue.interleaved;
|
|
|
|
|
|
if (interleaved === null) {
|
|
|
// This is the first update. Create a circular list.
|
|
|
update.next = update; // At the end of the current render, this queue's interleaved updates will
|
|
|
// be transferred to the pending queue.
|
|
|
|
|
|
pushConcurrentUpdateQueue(queue);
|
|
|
} else {
|
|
|
update.next = interleaved.next;
|
|
|
interleaved.next = update;
|
|
|
}
|
|
|
|
|
|
queue.interleaved = update;
|
|
|
return markUpdateLaneFromFiberToRoot(fiber, lane);
|
|
|
}
|
|
|
function enqueueConcurrentHookUpdateAndEagerlyBailout(fiber, queue, update, lane) {
|
|
|
var interleaved = queue.interleaved;
|
|
|
|
|
|
if (interleaved === null) {
|
|
|
// This is the first update. Create a circular list.
|
|
|
update.next = update; // At the end of the current render, this queue's interleaved updates will
|
|
|
// be transferred to the pending queue.
|
|
|
|
|
|
pushConcurrentUpdateQueue(queue);
|
|
|
} else {
|
|
|
update.next = interleaved.next;
|
|
|
interleaved.next = update;
|
|
|
}
|
|
|
|
|
|
queue.interleaved = update;
|
|
|
}
|
|
|
function enqueueConcurrentClassUpdate(fiber, queue, update, lane) {
|
|
|
var interleaved = queue.interleaved;
|
|
|
|
|
|
if (interleaved === null) {
|
|
|
// This is the first update. Create a circular list.
|
|
|
update.next = update; // At the end of the current render, this queue's interleaved updates will
|
|
|
// be transferred to the pending queue.
|
|
|
|
|
|
pushConcurrentUpdateQueue(queue);
|
|
|
} else {
|
|
|
update.next = interleaved.next;
|
|
|
interleaved.next = update;
|
|
|
}
|
|
|
|
|
|
queue.interleaved = update;
|
|
|
return markUpdateLaneFromFiberToRoot(fiber, lane);
|
|
|
}
|
|
|
function enqueueConcurrentRenderForLane(fiber, lane) {
|
|
|
return markUpdateLaneFromFiberToRoot(fiber, lane);
|
|
|
} // Calling this function outside this module should only be done for backwards
|
|
|
// compatibility and should always be accompanied by a warning.
|
|
|
|
|
|
var unsafe_markUpdateLaneFromFiberToRoot = markUpdateLaneFromFiberToRoot;
|
|
|
|
|
|
function markUpdateLaneFromFiberToRoot(sourceFiber, lane) {
|
|
|
// Update the source fiber's lanes
|
|
|
sourceFiber.lanes = mergeLanes(sourceFiber.lanes, lane);
|
|
|
var alternate = sourceFiber.alternate;
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
alternate.lanes = mergeLanes(alternate.lanes, lane);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (alternate === null && (sourceFiber.flags & (Placement | Hydrating)) !== NoFlags) {
|
|
|
warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber);
|
|
|
}
|
|
|
} // Walk the parent path to the root and update the child lanes.
|
|
|
|
|
|
|
|
|
var node = sourceFiber;
|
|
|
var parent = sourceFiber.return;
|
|
|
|
|
|
while (parent !== null) {
|
|
|
parent.childLanes = mergeLanes(parent.childLanes, lane);
|
|
|
alternate = parent.alternate;
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
alternate.childLanes = mergeLanes(alternate.childLanes, lane);
|
|
|
} else {
|
|
|
{
|
|
|
if ((parent.flags & (Placement | Hydrating)) !== NoFlags) {
|
|
|
warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
node = parent;
|
|
|
parent = parent.return;
|
|
|
}
|
|
|
|
|
|
if (node.tag === HostRoot) {
|
|
|
var root = node.stateNode;
|
|
|
return root;
|
|
|
} else {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var UpdateState = 0;
|
|
|
var ReplaceState = 1;
|
|
|
var ForceUpdate = 2;
|
|
|
var CaptureUpdate = 3; // Global state that is reset at the beginning of calling `processUpdateQueue`.
|
|
|
// It should only be read right after calling `processUpdateQueue`, via
|
|
|
// `checkHasForceUpdateAfterProcessing`.
|
|
|
|
|
|
var hasForceUpdate = false;
|
|
|
var didWarnUpdateInsideUpdate;
|
|
|
var currentlyProcessingQueue;
|
|
|
|
|
|
{
|
|
|
didWarnUpdateInsideUpdate = false;
|
|
|
currentlyProcessingQueue = null;
|
|
|
}
|
|
|
|
|
|
function initializeUpdateQueue(fiber) {
|
|
|
var queue = {
|
|
|
baseState: fiber.memoizedState,
|
|
|
firstBaseUpdate: null,
|
|
|
lastBaseUpdate: null,
|
|
|
shared: {
|
|
|
pending: null,
|
|
|
interleaved: null,
|
|
|
lanes: NoLanes
|
|
|
},
|
|
|
effects: null
|
|
|
};
|
|
|
fiber.updateQueue = queue;
|
|
|
}
|
|
|
function cloneUpdateQueue(current, workInProgress) {
|
|
|
// Clone the update queue from current. Unless it's already a clone.
|
|
|
var queue = workInProgress.updateQueue;
|
|
|
var currentQueue = current.updateQueue;
|
|
|
|
|
|
if (queue === currentQueue) {
|
|
|
var clone = {
|
|
|
baseState: currentQueue.baseState,
|
|
|
firstBaseUpdate: currentQueue.firstBaseUpdate,
|
|
|
lastBaseUpdate: currentQueue.lastBaseUpdate,
|
|
|
shared: currentQueue.shared,
|
|
|
effects: currentQueue.effects
|
|
|
};
|
|
|
workInProgress.updateQueue = clone;
|
|
|
}
|
|
|
}
|
|
|
function createUpdate(eventTime, lane) {
|
|
|
var update = {
|
|
|
eventTime: eventTime,
|
|
|
lane: lane,
|
|
|
tag: UpdateState,
|
|
|
payload: null,
|
|
|
callback: null,
|
|
|
next: null
|
|
|
};
|
|
|
return update;
|
|
|
}
|
|
|
function enqueueUpdate(fiber, update, lane) {
|
|
|
var updateQueue = fiber.updateQueue;
|
|
|
|
|
|
if (updateQueue === null) {
|
|
|
// Only occurs if the fiber has been unmounted.
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var sharedQueue = updateQueue.shared;
|
|
|
|
|
|
{
|
|
|
if (currentlyProcessingQueue === sharedQueue && !didWarnUpdateInsideUpdate) {
|
|
|
error('An update (setState, replaceState, or forceUpdate) was scheduled ' + 'from inside an update function. Update functions should be pure, ' + 'with zero side-effects. Consider using componentDidUpdate or a ' + 'callback.');
|
|
|
|
|
|
didWarnUpdateInsideUpdate = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (isUnsafeClassRenderPhaseUpdate()) {
|
|
|
// This is an unsafe render phase update. Add directly to the update
|
|
|
// queue so we can process it immediately during the current render.
|
|
|
var pending = sharedQueue.pending;
|
|
|
|
|
|
if (pending === null) {
|
|
|
// This is the first update. Create a circular list.
|
|
|
update.next = update;
|
|
|
} else {
|
|
|
update.next = pending.next;
|
|
|
pending.next = update;
|
|
|
}
|
|
|
|
|
|
sharedQueue.pending = update; // Update the childLanes even though we're most likely already rendering
|
|
|
// this fiber. This is for backwards compatibility in the case where you
|
|
|
// update a different component during render phase than the one that is
|
|
|
// currently renderings (a pattern that is accompanied by a warning).
|
|
|
|
|
|
return unsafe_markUpdateLaneFromFiberToRoot(fiber, lane);
|
|
|
} else {
|
|
|
return enqueueConcurrentClassUpdate(fiber, sharedQueue, update, lane);
|
|
|
}
|
|
|
}
|
|
|
function entangleTransitions(root, fiber, lane) {
|
|
|
var updateQueue = fiber.updateQueue;
|
|
|
|
|
|
if (updateQueue === null) {
|
|
|
// Only occurs if the fiber has been unmounted.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var sharedQueue = updateQueue.shared;
|
|
|
|
|
|
if (isTransitionLane(lane)) {
|
|
|
var queueLanes = sharedQueue.lanes; // If any entangled lanes are no longer pending on the root, then they must
|
|
|
// have finished. We can remove them from the shared queue, which represents
|
|
|
// a superset of the actually pending lanes. In some cases we may entangle
|
|
|
// more than we need to, but that's OK. In fact it's worse if we *don't*
|
|
|
// entangle when we should.
|
|
|
|
|
|
queueLanes = intersectLanes(queueLanes, root.pendingLanes); // Entangle the new transition lane with the other transition lanes.
|
|
|
|
|
|
var newQueueLanes = mergeLanes(queueLanes, lane);
|
|
|
sharedQueue.lanes = newQueueLanes; // Even if queue.lanes already include lane, we don't know for certain if
|
|
|
// the lane finished since the last time we entangled it. So we need to
|
|
|
// entangle it again, just to be sure.
|
|
|
|
|
|
markRootEntangled(root, newQueueLanes);
|
|
|
}
|
|
|
}
|
|
|
function enqueueCapturedUpdate(workInProgress, capturedUpdate) {
|
|
|
// Captured updates are updates that are thrown by a child during the render
|
|
|
// phase. They should be discarded if the render is aborted. Therefore,
|
|
|
// we should only put them on the work-in-progress queue, not the current one.
|
|
|
var queue = workInProgress.updateQueue; // Check if the work-in-progress queue is a clone.
|
|
|
|
|
|
var current = workInProgress.alternate;
|
|
|
|
|
|
if (current !== null) {
|
|
|
var currentQueue = current.updateQueue;
|
|
|
|
|
|
if (queue === currentQueue) {
|
|
|
// The work-in-progress queue is the same as current. This happens when
|
|
|
// we bail out on a parent fiber that then captures an error thrown by
|
|
|
// a child. Since we want to append the update only to the work-in
|
|
|
// -progress queue, we need to clone the updates. We usually clone during
|
|
|
// processUpdateQueue, but that didn't happen in this case because we
|
|
|
// skipped over the parent when we bailed out.
|
|
|
var newFirst = null;
|
|
|
var newLast = null;
|
|
|
var firstBaseUpdate = queue.firstBaseUpdate;
|
|
|
|
|
|
if (firstBaseUpdate !== null) {
|
|
|
// Loop through the updates and clone them.
|
|
|
var update = firstBaseUpdate;
|
|
|
|
|
|
do {
|
|
|
var clone = {
|
|
|
eventTime: update.eventTime,
|
|
|
lane: update.lane,
|
|
|
tag: update.tag,
|
|
|
payload: update.payload,
|
|
|
callback: update.callback,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (newLast === null) {
|
|
|
newFirst = newLast = clone;
|
|
|
} else {
|
|
|
newLast.next = clone;
|
|
|
newLast = clone;
|
|
|
}
|
|
|
|
|
|
update = update.next;
|
|
|
} while (update !== null); // Append the captured update the end of the cloned list.
|
|
|
|
|
|
|
|
|
if (newLast === null) {
|
|
|
newFirst = newLast = capturedUpdate;
|
|
|
} else {
|
|
|
newLast.next = capturedUpdate;
|
|
|
newLast = capturedUpdate;
|
|
|
}
|
|
|
} else {
|
|
|
// There are no base updates.
|
|
|
newFirst = newLast = capturedUpdate;
|
|
|
}
|
|
|
|
|
|
queue = {
|
|
|
baseState: currentQueue.baseState,
|
|
|
firstBaseUpdate: newFirst,
|
|
|
lastBaseUpdate: newLast,
|
|
|
shared: currentQueue.shared,
|
|
|
effects: currentQueue.effects
|
|
|
};
|
|
|
workInProgress.updateQueue = queue;
|
|
|
return;
|
|
|
}
|
|
|
} // Append the update to the end of the list.
|
|
|
|
|
|
|
|
|
var lastBaseUpdate = queue.lastBaseUpdate;
|
|
|
|
|
|
if (lastBaseUpdate === null) {
|
|
|
queue.firstBaseUpdate = capturedUpdate;
|
|
|
} else {
|
|
|
lastBaseUpdate.next = capturedUpdate;
|
|
|
}
|
|
|
|
|
|
queue.lastBaseUpdate = capturedUpdate;
|
|
|
}
|
|
|
|
|
|
function getStateFromUpdate(workInProgress, queue, update, prevState, nextProps, instance) {
|
|
|
switch (update.tag) {
|
|
|
case ReplaceState:
|
|
|
{
|
|
|
var payload = update.payload;
|
|
|
|
|
|
if (typeof payload === 'function') {
|
|
|
// Updater function
|
|
|
{
|
|
|
enterDisallowedContextReadInDEV();
|
|
|
}
|
|
|
|
|
|
var nextState = payload.call(instance, prevState, nextProps);
|
|
|
|
|
|
{
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
payload.call(instance, prevState, nextProps);
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
exitDisallowedContextReadInDEV();
|
|
|
}
|
|
|
|
|
|
return nextState;
|
|
|
} // State object
|
|
|
|
|
|
|
|
|
return payload;
|
|
|
}
|
|
|
|
|
|
case CaptureUpdate:
|
|
|
{
|
|
|
workInProgress.flags = workInProgress.flags & ~ShouldCapture | DidCapture;
|
|
|
}
|
|
|
// Intentional fallthrough
|
|
|
|
|
|
case UpdateState:
|
|
|
{
|
|
|
var _payload = update.payload;
|
|
|
var partialState;
|
|
|
|
|
|
if (typeof _payload === 'function') {
|
|
|
// Updater function
|
|
|
{
|
|
|
enterDisallowedContextReadInDEV();
|
|
|
}
|
|
|
|
|
|
partialState = _payload.call(instance, prevState, nextProps);
|
|
|
|
|
|
{
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
_payload.call(instance, prevState, nextProps);
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
exitDisallowedContextReadInDEV();
|
|
|
}
|
|
|
} else {
|
|
|
// Partial state object
|
|
|
partialState = _payload;
|
|
|
}
|
|
|
|
|
|
if (partialState === null || partialState === undefined) {
|
|
|
// Null and undefined are treated as no-ops.
|
|
|
return prevState;
|
|
|
} // Merge the partial state and the previous state.
|
|
|
|
|
|
|
|
|
return assign({}, prevState, partialState);
|
|
|
}
|
|
|
|
|
|
case ForceUpdate:
|
|
|
{
|
|
|
hasForceUpdate = true;
|
|
|
return prevState;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return prevState;
|
|
|
}
|
|
|
|
|
|
function processUpdateQueue(workInProgress, props, instance, renderLanes) {
|
|
|
// This is always non-null on a ClassComponent or HostRoot
|
|
|
var queue = workInProgress.updateQueue;
|
|
|
hasForceUpdate = false;
|
|
|
|
|
|
{
|
|
|
currentlyProcessingQueue = queue.shared;
|
|
|
}
|
|
|
|
|
|
var firstBaseUpdate = queue.firstBaseUpdate;
|
|
|
var lastBaseUpdate = queue.lastBaseUpdate; // Check if there are pending updates. If so, transfer them to the base queue.
|
|
|
|
|
|
var pendingQueue = queue.shared.pending;
|
|
|
|
|
|
if (pendingQueue !== null) {
|
|
|
queue.shared.pending = null; // The pending queue is circular. Disconnect the pointer between first
|
|
|
// and last so that it's non-circular.
|
|
|
|
|
|
var lastPendingUpdate = pendingQueue;
|
|
|
var firstPendingUpdate = lastPendingUpdate.next;
|
|
|
lastPendingUpdate.next = null; // Append pending updates to base queue
|
|
|
|
|
|
if (lastBaseUpdate === null) {
|
|
|
firstBaseUpdate = firstPendingUpdate;
|
|
|
} else {
|
|
|
lastBaseUpdate.next = firstPendingUpdate;
|
|
|
}
|
|
|
|
|
|
lastBaseUpdate = lastPendingUpdate; // If there's a current queue, and it's different from the base queue, then
|
|
|
// we need to transfer the updates to that queue, too. Because the base
|
|
|
// queue is a singly-linked list with no cycles, we can append to both
|
|
|
// lists and take advantage of structural sharing.
|
|
|
// TODO: Pass `current` as argument
|
|
|
|
|
|
var current = workInProgress.alternate;
|
|
|
|
|
|
if (current !== null) {
|
|
|
// This is always non-null on a ClassComponent or HostRoot
|
|
|
var currentQueue = current.updateQueue;
|
|
|
var currentLastBaseUpdate = currentQueue.lastBaseUpdate;
|
|
|
|
|
|
if (currentLastBaseUpdate !== lastBaseUpdate) {
|
|
|
if (currentLastBaseUpdate === null) {
|
|
|
currentQueue.firstBaseUpdate = firstPendingUpdate;
|
|
|
} else {
|
|
|
currentLastBaseUpdate.next = firstPendingUpdate;
|
|
|
}
|
|
|
|
|
|
currentQueue.lastBaseUpdate = lastPendingUpdate;
|
|
|
}
|
|
|
}
|
|
|
} // These values may change as we process the queue.
|
|
|
|
|
|
|
|
|
if (firstBaseUpdate !== null) {
|
|
|
// Iterate through the list of updates to compute the result.
|
|
|
var newState = queue.baseState; // TODO: Don't need to accumulate this. Instead, we can remove renderLanes
|
|
|
// from the original lanes.
|
|
|
|
|
|
var newLanes = NoLanes;
|
|
|
var newBaseState = null;
|
|
|
var newFirstBaseUpdate = null;
|
|
|
var newLastBaseUpdate = null;
|
|
|
var update = firstBaseUpdate;
|
|
|
|
|
|
do {
|
|
|
var updateLane = update.lane;
|
|
|
var updateEventTime = update.eventTime;
|
|
|
|
|
|
if (!isSubsetOfLanes(renderLanes, updateLane)) {
|
|
|
// Priority is insufficient. Skip this update. If this is the first
|
|
|
// skipped update, the previous update/state is the new base
|
|
|
// update/state.
|
|
|
var clone = {
|
|
|
eventTime: updateEventTime,
|
|
|
lane: updateLane,
|
|
|
tag: update.tag,
|
|
|
payload: update.payload,
|
|
|
callback: update.callback,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (newLastBaseUpdate === null) {
|
|
|
newFirstBaseUpdate = newLastBaseUpdate = clone;
|
|
|
newBaseState = newState;
|
|
|
} else {
|
|
|
newLastBaseUpdate = newLastBaseUpdate.next = clone;
|
|
|
} // Update the remaining priority in the queue.
|
|
|
|
|
|
|
|
|
newLanes = mergeLanes(newLanes, updateLane);
|
|
|
} else {
|
|
|
// This update does have sufficient priority.
|
|
|
if (newLastBaseUpdate !== null) {
|
|
|
var _clone = {
|
|
|
eventTime: updateEventTime,
|
|
|
// This update is going to be committed so we never want uncommit
|
|
|
// it. Using NoLane works because 0 is a subset of all bitmasks, so
|
|
|
// this will never be skipped by the check above.
|
|
|
lane: NoLane,
|
|
|
tag: update.tag,
|
|
|
payload: update.payload,
|
|
|
callback: update.callback,
|
|
|
next: null
|
|
|
};
|
|
|
newLastBaseUpdate = newLastBaseUpdate.next = _clone;
|
|
|
} // Process this update.
|
|
|
|
|
|
|
|
|
newState = getStateFromUpdate(workInProgress, queue, update, newState, props, instance);
|
|
|
var callback = update.callback;
|
|
|
|
|
|
if (callback !== null && // If the update was already committed, we should not queue its
|
|
|
// callback again.
|
|
|
update.lane !== NoLane) {
|
|
|
workInProgress.flags |= Callback;
|
|
|
var effects = queue.effects;
|
|
|
|
|
|
if (effects === null) {
|
|
|
queue.effects = [update];
|
|
|
} else {
|
|
|
effects.push(update);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
update = update.next;
|
|
|
|
|
|
if (update === null) {
|
|
|
pendingQueue = queue.shared.pending;
|
|
|
|
|
|
if (pendingQueue === null) {
|
|
|
break;
|
|
|
} else {
|
|
|
// An update was scheduled from inside a reducer. Add the new
|
|
|
// pending updates to the end of the list and keep processing.
|
|
|
var _lastPendingUpdate = pendingQueue; // Intentionally unsound. Pending updates form a circular list, but we
|
|
|
// unravel them when transferring them to the base queue.
|
|
|
|
|
|
var _firstPendingUpdate = _lastPendingUpdate.next;
|
|
|
_lastPendingUpdate.next = null;
|
|
|
update = _firstPendingUpdate;
|
|
|
queue.lastBaseUpdate = _lastPendingUpdate;
|
|
|
queue.shared.pending = null;
|
|
|
}
|
|
|
}
|
|
|
} while (true);
|
|
|
|
|
|
if (newLastBaseUpdate === null) {
|
|
|
newBaseState = newState;
|
|
|
}
|
|
|
|
|
|
queue.baseState = newBaseState;
|
|
|
queue.firstBaseUpdate = newFirstBaseUpdate;
|
|
|
queue.lastBaseUpdate = newLastBaseUpdate; // Interleaved updates are stored on a separate queue. We aren't going to
|
|
|
// process them during this render, but we do need to track which lanes
|
|
|
// are remaining.
|
|
|
|
|
|
var lastInterleaved = queue.shared.interleaved;
|
|
|
|
|
|
if (lastInterleaved !== null) {
|
|
|
var interleaved = lastInterleaved;
|
|
|
|
|
|
do {
|
|
|
newLanes = mergeLanes(newLanes, interleaved.lane);
|
|
|
interleaved = interleaved.next;
|
|
|
} while (interleaved !== lastInterleaved);
|
|
|
} else if (firstBaseUpdate === null) {
|
|
|
// `queue.lanes` is used for entangling transitions. We can set it back to
|
|
|
// zero once the queue is empty.
|
|
|
queue.shared.lanes = NoLanes;
|
|
|
} // Set the remaining expiration time to be whatever is remaining in the queue.
|
|
|
// This should be fine because the only two other things that contribute to
|
|
|
// expiration time are props and context. We're already in the middle of the
|
|
|
// begin phase by the time we start processing the queue, so we've already
|
|
|
// dealt with the props. Context in components that specify
|
|
|
// shouldComponentUpdate is tricky; but we'll have to account for
|
|
|
// that regardless.
|
|
|
|
|
|
|
|
|
markSkippedUpdateLanes(newLanes);
|
|
|
workInProgress.lanes = newLanes;
|
|
|
workInProgress.memoizedState = newState;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
currentlyProcessingQueue = null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function callCallback(callback, context) {
|
|
|
if (typeof callback !== 'function') {
|
|
|
throw new Error('Invalid argument passed as callback. Expected a function. Instead ' + ("received: " + callback));
|
|
|
}
|
|
|
|
|
|
callback.call(context);
|
|
|
}
|
|
|
|
|
|
function resetHasForceUpdateBeforeProcessing() {
|
|
|
hasForceUpdate = false;
|
|
|
}
|
|
|
function checkHasForceUpdateAfterProcessing() {
|
|
|
return hasForceUpdate;
|
|
|
}
|
|
|
function commitUpdateQueue(finishedWork, finishedQueue, instance) {
|
|
|
// Commit the effects
|
|
|
var effects = finishedQueue.effects;
|
|
|
finishedQueue.effects = null;
|
|
|
|
|
|
if (effects !== null) {
|
|
|
for (var i = 0; i < effects.length; i++) {
|
|
|
var effect = effects[i];
|
|
|
var callback = effect.callback;
|
|
|
|
|
|
if (callback !== null) {
|
|
|
effect.callback = null;
|
|
|
callCallback(callback, instance);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var fakeInternalInstance = {}; // React.Component uses a shared frozen object by default.
|
|
|
// We'll use it to determine whether we need to initialize legacy refs.
|
|
|
|
|
|
var emptyRefsObject = new React.Component().refs;
|
|
|
var didWarnAboutStateAssignmentForComponent;
|
|
|
var didWarnAboutUninitializedState;
|
|
|
var didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate;
|
|
|
var didWarnAboutLegacyLifecyclesAndDerivedState;
|
|
|
var didWarnAboutUndefinedDerivedState;
|
|
|
var warnOnUndefinedDerivedState;
|
|
|
var warnOnInvalidCallback;
|
|
|
var didWarnAboutDirectlyAssigningPropsToState;
|
|
|
var didWarnAboutContextTypeAndContextTypes;
|
|
|
var didWarnAboutInvalidateContextType;
|
|
|
|
|
|
{
|
|
|
didWarnAboutStateAssignmentForComponent = new Set();
|
|
|
didWarnAboutUninitializedState = new Set();
|
|
|
didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate = new Set();
|
|
|
didWarnAboutLegacyLifecyclesAndDerivedState = new Set();
|
|
|
didWarnAboutDirectlyAssigningPropsToState = new Set();
|
|
|
didWarnAboutUndefinedDerivedState = new Set();
|
|
|
didWarnAboutContextTypeAndContextTypes = new Set();
|
|
|
didWarnAboutInvalidateContextType = new Set();
|
|
|
var didWarnOnInvalidCallback = new Set();
|
|
|
|
|
|
warnOnInvalidCallback = function (callback, callerName) {
|
|
|
if (callback === null || typeof callback === 'function') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var key = callerName + '_' + callback;
|
|
|
|
|
|
if (!didWarnOnInvalidCallback.has(key)) {
|
|
|
didWarnOnInvalidCallback.add(key);
|
|
|
|
|
|
error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
warnOnUndefinedDerivedState = function (type, partialState) {
|
|
|
if (partialState === undefined) {
|
|
|
var componentName = getComponentNameFromType(type) || 'Component';
|
|
|
|
|
|
if (!didWarnAboutUndefinedDerivedState.has(componentName)) {
|
|
|
didWarnAboutUndefinedDerivedState.add(componentName);
|
|
|
|
|
|
error('%s.getDerivedStateFromProps(): A valid state object (or null) must be returned. ' + 'You have returned undefined.', componentName);
|
|
|
}
|
|
|
}
|
|
|
}; // This is so gross but it's at least non-critical and can be removed if
|
|
|
// it causes problems. This is meant to give a nicer error message for
|
|
|
// ReactDOM15.unstable_renderSubtreeIntoContainer(reactDOM16Component,
|
|
|
// ...)) which otherwise throws a "_processChildContext is not a function"
|
|
|
// exception.
|
|
|
|
|
|
|
|
|
Object.defineProperty(fakeInternalInstance, '_processChildContext', {
|
|
|
enumerable: false,
|
|
|
value: function () {
|
|
|
throw new Error('_processChildContext is not available in React 16+. This likely ' + 'means you have multiple copies of React and are attempting to nest ' + 'a React 15 tree inside a React 16 tree using ' + "unstable_renderSubtreeIntoContainer, which isn't supported. Try " + 'to make sure you have only one copy of React (and ideally, switch ' + 'to ReactDOM.createPortal).');
|
|
|
}
|
|
|
});
|
|
|
Object.freeze(fakeInternalInstance);
|
|
|
}
|
|
|
|
|
|
function applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, nextProps) {
|
|
|
var prevState = workInProgress.memoizedState;
|
|
|
var partialState = getDerivedStateFromProps(nextProps, prevState);
|
|
|
|
|
|
{
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
// Invoke the function an extra time to help detect side-effects.
|
|
|
partialState = getDerivedStateFromProps(nextProps, prevState);
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
warnOnUndefinedDerivedState(ctor, partialState);
|
|
|
} // Merge the partial state and the previous state.
|
|
|
|
|
|
|
|
|
var memoizedState = partialState === null || partialState === undefined ? prevState : assign({}, prevState, partialState);
|
|
|
workInProgress.memoizedState = memoizedState; // Once the update queue is empty, persist the derived state onto the
|
|
|
// base state.
|
|
|
|
|
|
if (workInProgress.lanes === NoLanes) {
|
|
|
// Queue is always non-null for classes
|
|
|
var updateQueue = workInProgress.updateQueue;
|
|
|
updateQueue.baseState = memoizedState;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var classComponentUpdater = {
|
|
|
isMounted: isMounted,
|
|
|
enqueueSetState: function (inst, payload, callback) {
|
|
|
var fiber = get(inst);
|
|
|
var eventTime = requestEventTime();
|
|
|
var lane = requestUpdateLane(fiber);
|
|
|
var update = createUpdate(eventTime, lane);
|
|
|
update.payload = payload;
|
|
|
|
|
|
if (callback !== undefined && callback !== null) {
|
|
|
{
|
|
|
warnOnInvalidCallback(callback, 'setState');
|
|
|
}
|
|
|
|
|
|
update.callback = callback;
|
|
|
}
|
|
|
|
|
|
var root = enqueueUpdate(fiber, update, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
entangleTransitions(root, fiber, lane);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markStateUpdateScheduled(fiber, lane);
|
|
|
}
|
|
|
},
|
|
|
enqueueReplaceState: function (inst, payload, callback) {
|
|
|
var fiber = get(inst);
|
|
|
var eventTime = requestEventTime();
|
|
|
var lane = requestUpdateLane(fiber);
|
|
|
var update = createUpdate(eventTime, lane);
|
|
|
update.tag = ReplaceState;
|
|
|
update.payload = payload;
|
|
|
|
|
|
if (callback !== undefined && callback !== null) {
|
|
|
{
|
|
|
warnOnInvalidCallback(callback, 'replaceState');
|
|
|
}
|
|
|
|
|
|
update.callback = callback;
|
|
|
}
|
|
|
|
|
|
var root = enqueueUpdate(fiber, update, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
entangleTransitions(root, fiber, lane);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markStateUpdateScheduled(fiber, lane);
|
|
|
}
|
|
|
},
|
|
|
enqueueForceUpdate: function (inst, callback) {
|
|
|
var fiber = get(inst);
|
|
|
var eventTime = requestEventTime();
|
|
|
var lane = requestUpdateLane(fiber);
|
|
|
var update = createUpdate(eventTime, lane);
|
|
|
update.tag = ForceUpdate;
|
|
|
|
|
|
if (callback !== undefined && callback !== null) {
|
|
|
{
|
|
|
warnOnInvalidCallback(callback, 'forceUpdate');
|
|
|
}
|
|
|
|
|
|
update.callback = callback;
|
|
|
}
|
|
|
|
|
|
var root = enqueueUpdate(fiber, update, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
entangleTransitions(root, fiber, lane);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markForceUpdateScheduled(fiber, lane);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
function checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) {
|
|
|
var instance = workInProgress.stateNode;
|
|
|
|
|
|
if (typeof instance.shouldComponentUpdate === 'function') {
|
|
|
var shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext);
|
|
|
|
|
|
{
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
// Invoke the function an extra time to help detect side-effects.
|
|
|
shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext);
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (shouldUpdate === undefined) {
|
|
|
error('%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', getComponentNameFromType(ctor) || 'Component');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return shouldUpdate;
|
|
|
}
|
|
|
|
|
|
if (ctor.prototype && ctor.prototype.isPureReactComponent) {
|
|
|
return !shallowEqual(oldProps, newProps) || !shallowEqual(oldState, newState);
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function checkClassInstance(workInProgress, ctor, newProps) {
|
|
|
var instance = workInProgress.stateNode;
|
|
|
|
|
|
{
|
|
|
var name = getComponentNameFromType(ctor) || 'Component';
|
|
|
var renderPresent = instance.render;
|
|
|
|
|
|
if (!renderPresent) {
|
|
|
if (ctor.prototype && typeof ctor.prototype.render === 'function') {
|
|
|
error('%s(...): No `render` method found on the returned component ' + 'instance: did you accidentally return an object from the constructor?', name);
|
|
|
} else {
|
|
|
error('%s(...): No `render` method found on the returned component ' + 'instance: you may have forgotten to define `render`.', name);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (instance.getInitialState && !instance.getInitialState.isReactClassApproved && !instance.state) {
|
|
|
error('getInitialState was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Did you mean to define a state property instead?', name);
|
|
|
}
|
|
|
|
|
|
if (instance.getDefaultProps && !instance.getDefaultProps.isReactClassApproved) {
|
|
|
error('getDefaultProps was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Use a static property to define defaultProps instead.', name);
|
|
|
}
|
|
|
|
|
|
if (instance.propTypes) {
|
|
|
error('propTypes was defined as an instance property on %s. Use a static ' + 'property to define propTypes instead.', name);
|
|
|
}
|
|
|
|
|
|
if (instance.contextType) {
|
|
|
error('contextType was defined as an instance property on %s. Use a static ' + 'property to define contextType instead.', name);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (instance.contextTypes) {
|
|
|
error('contextTypes was defined as an instance property on %s. Use a static ' + 'property to define contextTypes instead.', name);
|
|
|
}
|
|
|
|
|
|
if (ctor.contextType && ctor.contextTypes && !didWarnAboutContextTypeAndContextTypes.has(ctor)) {
|
|
|
didWarnAboutContextTypeAndContextTypes.add(ctor);
|
|
|
|
|
|
error('%s declares both contextTypes and contextType static properties. ' + 'The legacy contextTypes property will be ignored.', name);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentShouldUpdate === 'function') {
|
|
|
error('%s has a method called ' + 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 'The name is phrased as a question because the function is ' + 'expected to return a value.', name);
|
|
|
}
|
|
|
|
|
|
if (ctor.prototype && ctor.prototype.isPureReactComponent && typeof instance.shouldComponentUpdate !== 'undefined') {
|
|
|
error('%s has a method called shouldComponentUpdate(). ' + 'shouldComponentUpdate should not be used when extending React.PureComponent. ' + 'Please extend React.Component if shouldComponentUpdate is used.', getComponentNameFromType(ctor) || 'A pure component');
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentDidUnmount === 'function') {
|
|
|
error('%s has a method called ' + 'componentDidUnmount(). But there is no such lifecycle method. ' + 'Did you mean componentWillUnmount()?', name);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentDidReceiveProps === 'function') {
|
|
|
error('%s has a method called ' + 'componentDidReceiveProps(). But there is no such lifecycle method. ' + 'If you meant to update the state in response to changing props, ' + 'use componentWillReceiveProps(). If you meant to fetch data or ' + 'run side-effects or mutations after React has updated the UI, use componentDidUpdate().', name);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentWillRecieveProps === 'function') {
|
|
|
error('%s has a method called ' + 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', name);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.UNSAFE_componentWillRecieveProps === 'function') {
|
|
|
error('%s has a method called ' + 'UNSAFE_componentWillRecieveProps(). Did you mean UNSAFE_componentWillReceiveProps()?', name);
|
|
|
}
|
|
|
|
|
|
var hasMutatedProps = instance.props !== newProps;
|
|
|
|
|
|
if (instance.props !== undefined && hasMutatedProps) {
|
|
|
error('%s(...): When calling super() in `%s`, make sure to pass ' + "up the same props that your component's constructor was passed.", name, name);
|
|
|
}
|
|
|
|
|
|
if (instance.defaultProps) {
|
|
|
error('Setting defaultProps as an instance property on %s is not supported and will be ignored.' + ' Instead, define defaultProps as a static property on %s.', name, name);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getSnapshotBeforeUpdate === 'function' && typeof instance.componentDidUpdate !== 'function' && !didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.has(ctor)) {
|
|
|
didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.add(ctor);
|
|
|
|
|
|
error('%s: getSnapshotBeforeUpdate() should be used with componentDidUpdate(). ' + 'This component defines getSnapshotBeforeUpdate() only.', getComponentNameFromType(ctor));
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getDerivedStateFromProps === 'function') {
|
|
|
error('%s: getDerivedStateFromProps() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getDerivedStateFromError === 'function') {
|
|
|
error('%s: getDerivedStateFromError() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name);
|
|
|
}
|
|
|
|
|
|
if (typeof ctor.getSnapshotBeforeUpdate === 'function') {
|
|
|
error('%s: getSnapshotBeforeUpdate() is defined as a static method ' + 'and will be ignored. Instead, declare it as an instance method.', name);
|
|
|
}
|
|
|
|
|
|
var _state = instance.state;
|
|
|
|
|
|
if (_state && (typeof _state !== 'object' || isArray(_state))) {
|
|
|
error('%s.state: must be set to an object or null', name);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getChildContext === 'function' && typeof ctor.childContextTypes !== 'object') {
|
|
|
error('%s.getChildContext(): childContextTypes must be defined in order to ' + 'use getChildContext().', name);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function adoptClassInstance(workInProgress, instance) {
|
|
|
instance.updater = classComponentUpdater;
|
|
|
workInProgress.stateNode = instance; // The instance needs access to the fiber so that it can schedule updates
|
|
|
|
|
|
set(instance, workInProgress);
|
|
|
|
|
|
{
|
|
|
instance._reactInternalInstance = fakeInternalInstance;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function constructClassInstance(workInProgress, ctor, props) {
|
|
|
var isLegacyContextConsumer = false;
|
|
|
var unmaskedContext = emptyContextObject;
|
|
|
var context = emptyContextObject;
|
|
|
var contextType = ctor.contextType;
|
|
|
|
|
|
{
|
|
|
if ('contextType' in ctor) {
|
|
|
var isValid = // Allow null for conditional declaration
|
|
|
contextType === null || contextType !== undefined && contextType.$$typeof === REACT_CONTEXT_TYPE && contextType._context === undefined; // Not a <Context.Consumer>
|
|
|
|
|
|
if (!isValid && !didWarnAboutInvalidateContextType.has(ctor)) {
|
|
|
didWarnAboutInvalidateContextType.add(ctor);
|
|
|
var addendum = '';
|
|
|
|
|
|
if (contextType === undefined) {
|
|
|
addendum = ' However, it is set to undefined. ' + 'This can be caused by a typo or by mixing up named and default imports. ' + 'This can also happen due to a circular dependency, so ' + 'try moving the createContext() call to a separate file.';
|
|
|
} else if (typeof contextType !== 'object') {
|
|
|
addendum = ' However, it is set to a ' + typeof contextType + '.';
|
|
|
} else if (contextType.$$typeof === REACT_PROVIDER_TYPE) {
|
|
|
addendum = ' Did you accidentally pass the Context.Provider instead?';
|
|
|
} else if (contextType._context !== undefined) {
|
|
|
// <Context.Consumer>
|
|
|
addendum = ' Did you accidentally pass the Context.Consumer instead?';
|
|
|
} else {
|
|
|
addendum = ' However, it is set to an object with keys {' + Object.keys(contextType).join(', ') + '}.';
|
|
|
}
|
|
|
|
|
|
error('%s defines an invalid contextType. ' + 'contextType should point to the Context object returned by React.createContext().%s', getComponentNameFromType(ctor) || 'Component', addendum);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof contextType === 'object' && contextType !== null) {
|
|
|
context = readContext(contextType);
|
|
|
} else {
|
|
|
unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
|
|
|
var contextTypes = ctor.contextTypes;
|
|
|
isLegacyContextConsumer = contextTypes !== null && contextTypes !== undefined;
|
|
|
context = isLegacyContextConsumer ? getMaskedContext(workInProgress, unmaskedContext) : emptyContextObject;
|
|
|
}
|
|
|
|
|
|
var instance = new ctor(props, context); // Instantiate twice to help detect side-effects.
|
|
|
|
|
|
{
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
instance = new ctor(props, context); // eslint-disable-line no-new
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var state = workInProgress.memoizedState = instance.state !== null && instance.state !== undefined ? instance.state : null;
|
|
|
adoptClassInstance(workInProgress, instance);
|
|
|
|
|
|
{
|
|
|
if (typeof ctor.getDerivedStateFromProps === 'function' && state === null) {
|
|
|
var componentName = getComponentNameFromType(ctor) || 'Component';
|
|
|
|
|
|
if (!didWarnAboutUninitializedState.has(componentName)) {
|
|
|
didWarnAboutUninitializedState.add(componentName);
|
|
|
|
|
|
error('`%s` uses `getDerivedStateFromProps` but its initial state is ' + '%s. This is not recommended. Instead, define the initial state by ' + 'assigning an object to `this.state` in the constructor of `%s`. ' + 'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.', componentName, instance.state === null ? 'null' : 'undefined', componentName);
|
|
|
}
|
|
|
} // If new component APIs are defined, "unsafe" lifecycles won't be called.
|
|
|
// Warn about these lifecycles if they are present.
|
|
|
// Don't warn about react-lifecycles-compat polyfilled methods though.
|
|
|
|
|
|
|
|
|
if (typeof ctor.getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function') {
|
|
|
var foundWillMountName = null;
|
|
|
var foundWillReceivePropsName = null;
|
|
|
var foundWillUpdateName = null;
|
|
|
|
|
|
if (typeof instance.componentWillMount === 'function' && instance.componentWillMount.__suppressDeprecationWarning !== true) {
|
|
|
foundWillMountName = 'componentWillMount';
|
|
|
} else if (typeof instance.UNSAFE_componentWillMount === 'function') {
|
|
|
foundWillMountName = 'UNSAFE_componentWillMount';
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) {
|
|
|
foundWillReceivePropsName = 'componentWillReceiveProps';
|
|
|
} else if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
|
|
|
foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) {
|
|
|
foundWillUpdateName = 'componentWillUpdate';
|
|
|
} else if (typeof instance.UNSAFE_componentWillUpdate === 'function') {
|
|
|
foundWillUpdateName = 'UNSAFE_componentWillUpdate';
|
|
|
}
|
|
|
|
|
|
if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) {
|
|
|
var _componentName = getComponentNameFromType(ctor) || 'Component';
|
|
|
|
|
|
var newApiName = typeof ctor.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()';
|
|
|
|
|
|
if (!didWarnAboutLegacyLifecyclesAndDerivedState.has(_componentName)) {
|
|
|
didWarnAboutLegacyLifecyclesAndDerivedState.add(_componentName);
|
|
|
|
|
|
error('Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' + '%s uses %s but also contains the following legacy lifecycles:%s%s%s\n\n' + 'The above lifecycles should be removed. Learn more about this warning here:\n' + 'https://reactjs.org/link/unsafe-component-lifecycles', _componentName, newApiName, foundWillMountName !== null ? "\n " + foundWillMountName : '', foundWillReceivePropsName !== null ? "\n " + foundWillReceivePropsName : '', foundWillUpdateName !== null ? "\n " + foundWillUpdateName : '');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} // Cache unmasked context so we can avoid recreating masked context unless necessary.
|
|
|
// ReactFiberContext usually updates this cache but can't for newly-created instances.
|
|
|
|
|
|
|
|
|
if (isLegacyContextConsumer) {
|
|
|
cacheContext(workInProgress, unmaskedContext, context);
|
|
|
}
|
|
|
|
|
|
return instance;
|
|
|
}
|
|
|
|
|
|
function callComponentWillMount(workInProgress, instance) {
|
|
|
var oldState = instance.state;
|
|
|
|
|
|
if (typeof instance.componentWillMount === 'function') {
|
|
|
instance.componentWillMount();
|
|
|
}
|
|
|
|
|
|
if (typeof instance.UNSAFE_componentWillMount === 'function') {
|
|
|
instance.UNSAFE_componentWillMount();
|
|
|
}
|
|
|
|
|
|
if (oldState !== instance.state) {
|
|
|
{
|
|
|
error('%s.componentWillMount(): Assigning directly to this.state is ' + "deprecated (except inside a component's " + 'constructor). Use setState instead.', getComponentNameFromFiber(workInProgress) || 'Component');
|
|
|
}
|
|
|
|
|
|
classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext) {
|
|
|
var oldState = instance.state;
|
|
|
|
|
|
if (typeof instance.componentWillReceiveProps === 'function') {
|
|
|
instance.componentWillReceiveProps(newProps, nextContext);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') {
|
|
|
instance.UNSAFE_componentWillReceiveProps(newProps, nextContext);
|
|
|
}
|
|
|
|
|
|
if (instance.state !== oldState) {
|
|
|
{
|
|
|
var componentName = getComponentNameFromFiber(workInProgress) || 'Component';
|
|
|
|
|
|
if (!didWarnAboutStateAssignmentForComponent.has(componentName)) {
|
|
|
didWarnAboutStateAssignmentForComponent.add(componentName);
|
|
|
|
|
|
error('%s.componentWillReceiveProps(): Assigning directly to ' + "this.state is deprecated (except inside a component's " + 'constructor). Use setState instead.', componentName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
classComponentUpdater.enqueueReplaceState(instance, instance.state, null);
|
|
|
}
|
|
|
} // Invokes the mount life-cycles on a previously never rendered instance.
|
|
|
|
|
|
|
|
|
function mountClassInstance(workInProgress, ctor, newProps, renderLanes) {
|
|
|
{
|
|
|
checkClassInstance(workInProgress, ctor, newProps);
|
|
|
}
|
|
|
|
|
|
var instance = workInProgress.stateNode;
|
|
|
instance.props = newProps;
|
|
|
instance.state = workInProgress.memoizedState;
|
|
|
instance.refs = emptyRefsObject;
|
|
|
initializeUpdateQueue(workInProgress);
|
|
|
var contextType = ctor.contextType;
|
|
|
|
|
|
if (typeof contextType === 'object' && contextType !== null) {
|
|
|
instance.context = readContext(contextType);
|
|
|
} else {
|
|
|
var unmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
|
|
|
instance.context = getMaskedContext(workInProgress, unmaskedContext);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (instance.state === newProps) {
|
|
|
var componentName = getComponentNameFromType(ctor) || 'Component';
|
|
|
|
|
|
if (!didWarnAboutDirectlyAssigningPropsToState.has(componentName)) {
|
|
|
didWarnAboutDirectlyAssigningPropsToState.add(componentName);
|
|
|
|
|
|
error('%s: It is not recommended to assign props directly to state ' + "because updates to props won't be reflected in state. " + 'In most cases, it is better to use props directly.', componentName);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (workInProgress.mode & StrictLegacyMode) {
|
|
|
ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, instance);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
ReactStrictModeWarnings.recordUnsafeLifecycleWarnings(workInProgress, instance);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
instance.state = workInProgress.memoizedState;
|
|
|
var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
|
|
|
|
|
|
if (typeof getDerivedStateFromProps === 'function') {
|
|
|
applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
|
|
|
instance.state = workInProgress.memoizedState;
|
|
|
} // In order to support react-lifecycles-compat polyfilled components,
|
|
|
// Unsafe lifecycles should not be invoked for components using the new APIs.
|
|
|
|
|
|
|
|
|
if (typeof ctor.getDerivedStateFromProps !== 'function' && typeof instance.getSnapshotBeforeUpdate !== 'function' && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) {
|
|
|
callComponentWillMount(workInProgress, instance); // If we had additional state updates during this life-cycle, let's
|
|
|
// process them now.
|
|
|
|
|
|
processUpdateQueue(workInProgress, newProps, instance, renderLanes);
|
|
|
instance.state = workInProgress.memoizedState;
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentDidMount === 'function') {
|
|
|
var fiberFlags = Update;
|
|
|
|
|
|
{
|
|
|
fiberFlags |= LayoutStatic;
|
|
|
}
|
|
|
|
|
|
if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
|
|
|
fiberFlags |= MountLayoutDev;
|
|
|
}
|
|
|
|
|
|
workInProgress.flags |= fiberFlags;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function resumeMountClassInstance(workInProgress, ctor, newProps, renderLanes) {
|
|
|
var instance = workInProgress.stateNode;
|
|
|
var oldProps = workInProgress.memoizedProps;
|
|
|
instance.props = oldProps;
|
|
|
var oldContext = instance.context;
|
|
|
var contextType = ctor.contextType;
|
|
|
var nextContext = emptyContextObject;
|
|
|
|
|
|
if (typeof contextType === 'object' && contextType !== null) {
|
|
|
nextContext = readContext(contextType);
|
|
|
} else {
|
|
|
var nextLegacyUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
|
|
|
nextContext = getMaskedContext(workInProgress, nextLegacyUnmaskedContext);
|
|
|
}
|
|
|
|
|
|
var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
|
|
|
var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what
|
|
|
// ever the previously attempted to render - not the "current". However,
|
|
|
// during componentDidUpdate we pass the "current" props.
|
|
|
// In order to support react-lifecycles-compat polyfilled components,
|
|
|
// Unsafe lifecycles should not be invoked for components using the new APIs.
|
|
|
|
|
|
if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) {
|
|
|
if (oldProps !== newProps || oldContext !== nextContext) {
|
|
|
callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
resetHasForceUpdateBeforeProcessing();
|
|
|
var oldState = workInProgress.memoizedState;
|
|
|
var newState = instance.state = oldState;
|
|
|
processUpdateQueue(workInProgress, newProps, instance, renderLanes);
|
|
|
newState = workInProgress.memoizedState;
|
|
|
|
|
|
if (oldProps === newProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing()) {
|
|
|
// If an update was already in progress, we should schedule an Update
|
|
|
// effect even though we're bailing out, so that cWU/cDU are called.
|
|
|
if (typeof instance.componentDidMount === 'function') {
|
|
|
var fiberFlags = Update;
|
|
|
|
|
|
{
|
|
|
fiberFlags |= LayoutStatic;
|
|
|
}
|
|
|
|
|
|
if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
|
|
|
fiberFlags |= MountLayoutDev;
|
|
|
}
|
|
|
|
|
|
workInProgress.flags |= fiberFlags;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (typeof getDerivedStateFromProps === 'function') {
|
|
|
applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
|
|
|
newState = workInProgress.memoizedState;
|
|
|
}
|
|
|
|
|
|
var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext);
|
|
|
|
|
|
if (shouldUpdate) {
|
|
|
// In order to support react-lifecycles-compat polyfilled components,
|
|
|
// Unsafe lifecycles should not be invoked for components using the new APIs.
|
|
|
if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) {
|
|
|
if (typeof instance.componentWillMount === 'function') {
|
|
|
instance.componentWillMount();
|
|
|
}
|
|
|
|
|
|
if (typeof instance.UNSAFE_componentWillMount === 'function') {
|
|
|
instance.UNSAFE_componentWillMount();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentDidMount === 'function') {
|
|
|
var _fiberFlags = Update;
|
|
|
|
|
|
{
|
|
|
_fiberFlags |= LayoutStatic;
|
|
|
}
|
|
|
|
|
|
if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
|
|
|
_fiberFlags |= MountLayoutDev;
|
|
|
}
|
|
|
|
|
|
workInProgress.flags |= _fiberFlags;
|
|
|
}
|
|
|
} else {
|
|
|
// If an update was already in progress, we should schedule an Update
|
|
|
// effect even though we're bailing out, so that cWU/cDU are called.
|
|
|
if (typeof instance.componentDidMount === 'function') {
|
|
|
var _fiberFlags2 = Update;
|
|
|
|
|
|
{
|
|
|
_fiberFlags2 |= LayoutStatic;
|
|
|
}
|
|
|
|
|
|
if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
|
|
|
_fiberFlags2 |= MountLayoutDev;
|
|
|
}
|
|
|
|
|
|
workInProgress.flags |= _fiberFlags2;
|
|
|
} // If shouldComponentUpdate returned false, we should still update the
|
|
|
// memoized state to indicate that this work can be reused.
|
|
|
|
|
|
|
|
|
workInProgress.memoizedProps = newProps;
|
|
|
workInProgress.memoizedState = newState;
|
|
|
} // Update the existing instance's state, props, and context pointers even
|
|
|
// if shouldComponentUpdate returns false.
|
|
|
|
|
|
|
|
|
instance.props = newProps;
|
|
|
instance.state = newState;
|
|
|
instance.context = nextContext;
|
|
|
return shouldUpdate;
|
|
|
} // Invokes the update life-cycles and returns false if it shouldn't rerender.
|
|
|
|
|
|
|
|
|
function updateClassInstance(current, workInProgress, ctor, newProps, renderLanes) {
|
|
|
var instance = workInProgress.stateNode;
|
|
|
cloneUpdateQueue(current, workInProgress);
|
|
|
var unresolvedOldProps = workInProgress.memoizedProps;
|
|
|
var oldProps = workInProgress.type === workInProgress.elementType ? unresolvedOldProps : resolveDefaultProps(workInProgress.type, unresolvedOldProps);
|
|
|
instance.props = oldProps;
|
|
|
var unresolvedNewProps = workInProgress.pendingProps;
|
|
|
var oldContext = instance.context;
|
|
|
var contextType = ctor.contextType;
|
|
|
var nextContext = emptyContextObject;
|
|
|
|
|
|
if (typeof contextType === 'object' && contextType !== null) {
|
|
|
nextContext = readContext(contextType);
|
|
|
} else {
|
|
|
var nextUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true);
|
|
|
nextContext = getMaskedContext(workInProgress, nextUnmaskedContext);
|
|
|
}
|
|
|
|
|
|
var getDerivedStateFromProps = ctor.getDerivedStateFromProps;
|
|
|
var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what
|
|
|
// ever the previously attempted to render - not the "current". However,
|
|
|
// during componentDidUpdate we pass the "current" props.
|
|
|
// In order to support react-lifecycles-compat polyfilled components,
|
|
|
// Unsafe lifecycles should not be invoked for components using the new APIs.
|
|
|
|
|
|
if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) {
|
|
|
if (unresolvedOldProps !== unresolvedNewProps || oldContext !== nextContext) {
|
|
|
callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
resetHasForceUpdateBeforeProcessing();
|
|
|
var oldState = workInProgress.memoizedState;
|
|
|
var newState = instance.state = oldState;
|
|
|
processUpdateQueue(workInProgress, newProps, instance, renderLanes);
|
|
|
newState = workInProgress.memoizedState;
|
|
|
|
|
|
if (unresolvedOldProps === unresolvedNewProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing() && !(enableLazyContextPropagation )) {
|
|
|
// If an update was already in progress, we should schedule an Update
|
|
|
// effect even though we're bailing out, so that cWU/cDU are called.
|
|
|
if (typeof instance.componentDidUpdate === 'function') {
|
|
|
if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getSnapshotBeforeUpdate === 'function') {
|
|
|
if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
|
|
|
workInProgress.flags |= Snapshot;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
if (typeof getDerivedStateFromProps === 'function') {
|
|
|
applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps);
|
|
|
newState = workInProgress.memoizedState;
|
|
|
}
|
|
|
|
|
|
var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) || // TODO: In some cases, we'll end up checking if context has changed twice,
|
|
|
// both before and after `shouldComponentUpdate` has been called. Not ideal,
|
|
|
// but I'm loath to refactor this function. This only happens for memoized
|
|
|
// components so it's not that common.
|
|
|
enableLazyContextPropagation ;
|
|
|
|
|
|
if (shouldUpdate) {
|
|
|
// In order to support react-lifecycles-compat polyfilled components,
|
|
|
// Unsafe lifecycles should not be invoked for components using the new APIs.
|
|
|
if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillUpdate === 'function' || typeof instance.componentWillUpdate === 'function')) {
|
|
|
if (typeof instance.componentWillUpdate === 'function') {
|
|
|
instance.componentWillUpdate(newProps, newState, nextContext);
|
|
|
}
|
|
|
|
|
|
if (typeof instance.UNSAFE_componentWillUpdate === 'function') {
|
|
|
instance.UNSAFE_componentWillUpdate(newProps, newState, nextContext);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof instance.componentDidUpdate === 'function') {
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getSnapshotBeforeUpdate === 'function') {
|
|
|
workInProgress.flags |= Snapshot;
|
|
|
}
|
|
|
} else {
|
|
|
// If an update was already in progress, we should schedule an Update
|
|
|
// effect even though we're bailing out, so that cWU/cDU are called.
|
|
|
if (typeof instance.componentDidUpdate === 'function') {
|
|
|
if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof instance.getSnapshotBeforeUpdate === 'function') {
|
|
|
if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) {
|
|
|
workInProgress.flags |= Snapshot;
|
|
|
}
|
|
|
} // If shouldComponentUpdate returned false, we should still update the
|
|
|
// memoized props/state to indicate that this work can be reused.
|
|
|
|
|
|
|
|
|
workInProgress.memoizedProps = newProps;
|
|
|
workInProgress.memoizedState = newState;
|
|
|
} // Update the existing instance's state, props, and context pointers even
|
|
|
// if shouldComponentUpdate returns false.
|
|
|
|
|
|
|
|
|
instance.props = newProps;
|
|
|
instance.state = newState;
|
|
|
instance.context = nextContext;
|
|
|
return shouldUpdate;
|
|
|
}
|
|
|
|
|
|
var didWarnAboutMaps;
|
|
|
var didWarnAboutGenerators;
|
|
|
var didWarnAboutStringRefs;
|
|
|
var ownerHasKeyUseWarning;
|
|
|
var ownerHasFunctionTypeWarning;
|
|
|
|
|
|
var warnForMissingKey = function (child, returnFiber) {};
|
|
|
|
|
|
{
|
|
|
didWarnAboutMaps = false;
|
|
|
didWarnAboutGenerators = false;
|
|
|
didWarnAboutStringRefs = {};
|
|
|
/**
|
|
|
* Warn if there's no key explicitly set on dynamic arrays of children or
|
|
|
* object keys are not valid. This allows us to keep track of children between
|
|
|
* updates.
|
|
|
*/
|
|
|
|
|
|
ownerHasKeyUseWarning = {};
|
|
|
ownerHasFunctionTypeWarning = {};
|
|
|
|
|
|
warnForMissingKey = function (child, returnFiber) {
|
|
|
if (child === null || typeof child !== 'object') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (!child._store || child._store.validated || child.key != null) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (typeof child._store !== 'object') {
|
|
|
throw new Error('React Component in warnForMissingKey should have a _store. ' + 'This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
child._store.validated = true;
|
|
|
var componentName = getComponentNameFromFiber(returnFiber) || 'Component';
|
|
|
|
|
|
if (ownerHasKeyUseWarning[componentName]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
ownerHasKeyUseWarning[componentName] = true;
|
|
|
|
|
|
error('Each child in a list should have a unique ' + '"key" prop. See https://reactjs.org/link/warning-keys for ' + 'more information.');
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function coerceRef(returnFiber, current, element) {
|
|
|
var mixedRef = element.ref;
|
|
|
|
|
|
if (mixedRef !== null && typeof mixedRef !== 'function' && typeof mixedRef !== 'object') {
|
|
|
{
|
|
|
// TODO: Clean this up once we turn on the string ref warning for
|
|
|
// everyone, because the strict mode case will no longer be relevant
|
|
|
if ((returnFiber.mode & StrictLegacyMode || warnAboutStringRefs) && // We warn in ReactElement.js if owner and self are equal for string refs
|
|
|
// because these cannot be automatically converted to an arrow function
|
|
|
// using a codemod. Therefore, we don't have to warn about string refs again.
|
|
|
!(element._owner && element._self && element._owner.stateNode !== element._self)) {
|
|
|
var componentName = getComponentNameFromFiber(returnFiber) || 'Component';
|
|
|
|
|
|
if (!didWarnAboutStringRefs[componentName]) {
|
|
|
{
|
|
|
error('A string ref, "%s", has been found within a strict mode tree. ' + 'String refs are a source of potential bugs and should be avoided. ' + 'We recommend using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', mixedRef);
|
|
|
}
|
|
|
|
|
|
didWarnAboutStringRefs[componentName] = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (element._owner) {
|
|
|
var owner = element._owner;
|
|
|
var inst;
|
|
|
|
|
|
if (owner) {
|
|
|
var ownerFiber = owner;
|
|
|
|
|
|
if (ownerFiber.tag !== ClassComponent) {
|
|
|
throw new Error('Function components cannot have string refs. ' + 'We recommend using useRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref');
|
|
|
}
|
|
|
|
|
|
inst = ownerFiber.stateNode;
|
|
|
}
|
|
|
|
|
|
if (!inst) {
|
|
|
throw new Error("Missing owner for string ref " + mixedRef + ". This error is likely caused by a " + 'bug in React. Please file an issue.');
|
|
|
} // Assigning this to a const so Flow knows it won't change in the closure
|
|
|
|
|
|
|
|
|
var resolvedInst = inst;
|
|
|
|
|
|
{
|
|
|
checkPropStringCoercion(mixedRef, 'ref');
|
|
|
}
|
|
|
|
|
|
var stringRef = '' + mixedRef; // Check if previous string ref matches new string ref
|
|
|
|
|
|
if (current !== null && current.ref !== null && typeof current.ref === 'function' && current.ref._stringRef === stringRef) {
|
|
|
return current.ref;
|
|
|
}
|
|
|
|
|
|
var ref = function (value) {
|
|
|
var refs = resolvedInst.refs;
|
|
|
|
|
|
if (refs === emptyRefsObject) {
|
|
|
// This is a lazy pooled frozen object, so we need to initialize.
|
|
|
refs = resolvedInst.refs = {};
|
|
|
}
|
|
|
|
|
|
if (value === null) {
|
|
|
delete refs[stringRef];
|
|
|
} else {
|
|
|
refs[stringRef] = value;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
ref._stringRef = stringRef;
|
|
|
return ref;
|
|
|
} else {
|
|
|
if (typeof mixedRef !== 'string') {
|
|
|
throw new Error('Expected ref to be a function, a string, an object returned by React.createRef(), or null.');
|
|
|
}
|
|
|
|
|
|
if (!element._owner) {
|
|
|
throw new Error("Element ref was specified as a string (" + mixedRef + ") but no owner was set. This could happen for one of" + ' the following reasons:\n' + '1. You may be adding a ref to a function component\n' + "2. You may be adding a ref to a component that was not created inside a component's render method\n" + '3. You have multiple copies of React loaded\n' + 'See https://reactjs.org/link/refs-must-have-owner for more information.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return mixedRef;
|
|
|
}
|
|
|
|
|
|
function throwOnInvalidObjectType(returnFiber, newChild) {
|
|
|
var childString = Object.prototype.toString.call(newChild);
|
|
|
throw new Error("Objects are not valid as a React child (found: " + (childString === '[object Object]' ? 'object with keys {' + Object.keys(newChild).join(', ') + '}' : childString) + "). " + 'If you meant to render a collection of children, use an array ' + 'instead.');
|
|
|
}
|
|
|
|
|
|
function warnOnFunctionType(returnFiber) {
|
|
|
{
|
|
|
var componentName = getComponentNameFromFiber(returnFiber) || 'Component';
|
|
|
|
|
|
if (ownerHasFunctionTypeWarning[componentName]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
ownerHasFunctionTypeWarning[componentName] = true;
|
|
|
|
|
|
error('Functions are not valid as a React child. This may happen if ' + 'you return a Component instead of <Component /> from render. ' + 'Or maybe you meant to call this function rather than return it.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function resolveLazy(lazyType) {
|
|
|
var payload = lazyType._payload;
|
|
|
var init = lazyType._init;
|
|
|
return init(payload);
|
|
|
} // This wrapper function exists because I expect to clone the code in each path
|
|
|
// to be able to optimize each path individually by branching early. This needs
|
|
|
// a compiler or we can do it manually. Helpers that don't need this branching
|
|
|
// live outside of this function.
|
|
|
|
|
|
|
|
|
function ChildReconciler(shouldTrackSideEffects) {
|
|
|
function deleteChild(returnFiber, childToDelete) {
|
|
|
if (!shouldTrackSideEffects) {
|
|
|
// Noop.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var deletions = returnFiber.deletions;
|
|
|
|
|
|
if (deletions === null) {
|
|
|
returnFiber.deletions = [childToDelete];
|
|
|
returnFiber.flags |= ChildDeletion;
|
|
|
} else {
|
|
|
deletions.push(childToDelete);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function deleteRemainingChildren(returnFiber, currentFirstChild) {
|
|
|
if (!shouldTrackSideEffects) {
|
|
|
// Noop.
|
|
|
return null;
|
|
|
} // TODO: For the shouldClone case, this could be micro-optimized a bit by
|
|
|
// assuming that after the first child we've already added everything.
|
|
|
|
|
|
|
|
|
var childToDelete = currentFirstChild;
|
|
|
|
|
|
while (childToDelete !== null) {
|
|
|
deleteChild(returnFiber, childToDelete);
|
|
|
childToDelete = childToDelete.sibling;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function mapRemainingChildren(returnFiber, currentFirstChild) {
|
|
|
// Add the remaining children to a temporary map so that we can find them by
|
|
|
// keys quickly. Implicit (null) keys get added to this set with their index
|
|
|
// instead.
|
|
|
var existingChildren = new Map();
|
|
|
var existingChild = currentFirstChild;
|
|
|
|
|
|
while (existingChild !== null) {
|
|
|
if (existingChild.key !== null) {
|
|
|
existingChildren.set(existingChild.key, existingChild);
|
|
|
} else {
|
|
|
existingChildren.set(existingChild.index, existingChild);
|
|
|
}
|
|
|
|
|
|
existingChild = existingChild.sibling;
|
|
|
}
|
|
|
|
|
|
return existingChildren;
|
|
|
}
|
|
|
|
|
|
function useFiber(fiber, pendingProps) {
|
|
|
// We currently set sibling to null and index to 0 here because it is easy
|
|
|
// to forget to do before returning it. E.g. for the single child case.
|
|
|
var clone = createWorkInProgress(fiber, pendingProps);
|
|
|
clone.index = 0;
|
|
|
clone.sibling = null;
|
|
|
return clone;
|
|
|
}
|
|
|
|
|
|
function placeChild(newFiber, lastPlacedIndex, newIndex) {
|
|
|
newFiber.index = newIndex;
|
|
|
|
|
|
if (!shouldTrackSideEffects) {
|
|
|
// During hydration, the useId algorithm needs to know which fibers are
|
|
|
// part of a list of children (arrays, iterators).
|
|
|
newFiber.flags |= Forked;
|
|
|
return lastPlacedIndex;
|
|
|
}
|
|
|
|
|
|
var current = newFiber.alternate;
|
|
|
|
|
|
if (current !== null) {
|
|
|
var oldIndex = current.index;
|
|
|
|
|
|
if (oldIndex < lastPlacedIndex) {
|
|
|
// This is a move.
|
|
|
newFiber.flags |= Placement;
|
|
|
return lastPlacedIndex;
|
|
|
} else {
|
|
|
// This item can stay in place.
|
|
|
return oldIndex;
|
|
|
}
|
|
|
} else {
|
|
|
// This is an insertion.
|
|
|
newFiber.flags |= Placement;
|
|
|
return lastPlacedIndex;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function placeSingleChild(newFiber) {
|
|
|
// This is simpler for the single child case. We only need to do a
|
|
|
// placement for inserting new children.
|
|
|
if (shouldTrackSideEffects && newFiber.alternate === null) {
|
|
|
newFiber.flags |= Placement;
|
|
|
}
|
|
|
|
|
|
return newFiber;
|
|
|
}
|
|
|
|
|
|
function updateTextNode(returnFiber, current, textContent, lanes) {
|
|
|
if (current === null || current.tag !== HostText) {
|
|
|
// Insert
|
|
|
var created = createFiberFromText(textContent, returnFiber.mode, lanes);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
} else {
|
|
|
// Update
|
|
|
var existing = useFiber(current, textContent);
|
|
|
existing.return = returnFiber;
|
|
|
return existing;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateElement(returnFiber, current, element, lanes) {
|
|
|
var elementType = element.type;
|
|
|
|
|
|
if (elementType === REACT_FRAGMENT_TYPE) {
|
|
|
return updateFragment(returnFiber, current, element.props.children, lanes, element.key);
|
|
|
}
|
|
|
|
|
|
if (current !== null) {
|
|
|
if (current.elementType === elementType || ( // Keep this check inline so it only runs on the false path:
|
|
|
isCompatibleFamilyForHotReloading(current, element) ) || // Lazy types should reconcile their resolved type.
|
|
|
// We need to do this after the Hot Reloading check above,
|
|
|
// because hot reloading has different semantics than prod because
|
|
|
// it doesn't resuspend. So we can't let the call below suspend.
|
|
|
typeof elementType === 'object' && elementType !== null && elementType.$$typeof === REACT_LAZY_TYPE && resolveLazy(elementType) === current.type) {
|
|
|
// Move based on index
|
|
|
var existing = useFiber(current, element.props);
|
|
|
existing.ref = coerceRef(returnFiber, current, element);
|
|
|
existing.return = returnFiber;
|
|
|
|
|
|
{
|
|
|
existing._debugSource = element._source;
|
|
|
existing._debugOwner = element._owner;
|
|
|
}
|
|
|
|
|
|
return existing;
|
|
|
}
|
|
|
} // Insert
|
|
|
|
|
|
|
|
|
var created = createFiberFromElement(element, returnFiber.mode, lanes);
|
|
|
created.ref = coerceRef(returnFiber, current, element);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
}
|
|
|
|
|
|
function updatePortal(returnFiber, current, portal, lanes) {
|
|
|
if (current === null || current.tag !== HostPortal || current.stateNode.containerInfo !== portal.containerInfo || current.stateNode.implementation !== portal.implementation) {
|
|
|
// Insert
|
|
|
var created = createFiberFromPortal(portal, returnFiber.mode, lanes);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
} else {
|
|
|
// Update
|
|
|
var existing = useFiber(current, portal.children || []);
|
|
|
existing.return = returnFiber;
|
|
|
return existing;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateFragment(returnFiber, current, fragment, lanes, key) {
|
|
|
if (current === null || current.tag !== Fragment) {
|
|
|
// Insert
|
|
|
var created = createFiberFromFragment(fragment, returnFiber.mode, lanes, key);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
} else {
|
|
|
// Update
|
|
|
var existing = useFiber(current, fragment);
|
|
|
existing.return = returnFiber;
|
|
|
return existing;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function createChild(returnFiber, newChild, lanes) {
|
|
|
if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
|
|
|
// Text nodes don't have keys. If the previous node is implicitly keyed
|
|
|
// we can continue to replace it without aborting even if it is not a text
|
|
|
// node.
|
|
|
var created = createFiberFromText('' + newChild, returnFiber.mode, lanes);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
}
|
|
|
|
|
|
if (typeof newChild === 'object' && newChild !== null) {
|
|
|
switch (newChild.$$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
{
|
|
|
var _created = createFiberFromElement(newChild, returnFiber.mode, lanes);
|
|
|
|
|
|
_created.ref = coerceRef(returnFiber, null, newChild);
|
|
|
_created.return = returnFiber;
|
|
|
return _created;
|
|
|
}
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
{
|
|
|
var _created2 = createFiberFromPortal(newChild, returnFiber.mode, lanes);
|
|
|
|
|
|
_created2.return = returnFiber;
|
|
|
return _created2;
|
|
|
}
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
{
|
|
|
var payload = newChild._payload;
|
|
|
var init = newChild._init;
|
|
|
return createChild(returnFiber, init(payload), lanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (isArray(newChild) || getIteratorFn(newChild)) {
|
|
|
var _created3 = createFiberFromFragment(newChild, returnFiber.mode, lanes, null);
|
|
|
|
|
|
_created3.return = returnFiber;
|
|
|
return _created3;
|
|
|
}
|
|
|
|
|
|
throwOnInvalidObjectType(returnFiber, newChild);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof newChild === 'function') {
|
|
|
warnOnFunctionType(returnFiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function updateSlot(returnFiber, oldFiber, newChild, lanes) {
|
|
|
// Update the fiber if the keys match, otherwise return null.
|
|
|
var key = oldFiber !== null ? oldFiber.key : null;
|
|
|
|
|
|
if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
|
|
|
// Text nodes don't have keys. If the previous node is implicitly keyed
|
|
|
// we can continue to replace it without aborting even if it is not a text
|
|
|
// node.
|
|
|
if (key !== null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return updateTextNode(returnFiber, oldFiber, '' + newChild, lanes);
|
|
|
}
|
|
|
|
|
|
if (typeof newChild === 'object' && newChild !== null) {
|
|
|
switch (newChild.$$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
{
|
|
|
if (newChild.key === key) {
|
|
|
return updateElement(returnFiber, oldFiber, newChild, lanes);
|
|
|
} else {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
{
|
|
|
if (newChild.key === key) {
|
|
|
return updatePortal(returnFiber, oldFiber, newChild, lanes);
|
|
|
} else {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
{
|
|
|
var payload = newChild._payload;
|
|
|
var init = newChild._init;
|
|
|
return updateSlot(returnFiber, oldFiber, init(payload), lanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (isArray(newChild) || getIteratorFn(newChild)) {
|
|
|
if (key !== null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return updateFragment(returnFiber, oldFiber, newChild, lanes, null);
|
|
|
}
|
|
|
|
|
|
throwOnInvalidObjectType(returnFiber, newChild);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof newChild === 'function') {
|
|
|
warnOnFunctionType(returnFiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function updateFromMap(existingChildren, returnFiber, newIdx, newChild, lanes) {
|
|
|
if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
|
|
|
// Text nodes don't have keys, so we neither have to check the old nor
|
|
|
// new node for the key. If both are text nodes, they match.
|
|
|
var matchedFiber = existingChildren.get(newIdx) || null;
|
|
|
return updateTextNode(returnFiber, matchedFiber, '' + newChild, lanes);
|
|
|
}
|
|
|
|
|
|
if (typeof newChild === 'object' && newChild !== null) {
|
|
|
switch (newChild.$$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
{
|
|
|
var _matchedFiber = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null;
|
|
|
|
|
|
return updateElement(returnFiber, _matchedFiber, newChild, lanes);
|
|
|
}
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
{
|
|
|
var _matchedFiber2 = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null;
|
|
|
|
|
|
return updatePortal(returnFiber, _matchedFiber2, newChild, lanes);
|
|
|
}
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
var payload = newChild._payload;
|
|
|
var init = newChild._init;
|
|
|
return updateFromMap(existingChildren, returnFiber, newIdx, init(payload), lanes);
|
|
|
}
|
|
|
|
|
|
if (isArray(newChild) || getIteratorFn(newChild)) {
|
|
|
var _matchedFiber3 = existingChildren.get(newIdx) || null;
|
|
|
|
|
|
return updateFragment(returnFiber, _matchedFiber3, newChild, lanes, null);
|
|
|
}
|
|
|
|
|
|
throwOnInvalidObjectType(returnFiber, newChild);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof newChild === 'function') {
|
|
|
warnOnFunctionType(returnFiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
/**
|
|
|
* Warns if there is a duplicate or missing key
|
|
|
*/
|
|
|
|
|
|
|
|
|
function warnOnInvalidKey(child, knownKeys, returnFiber) {
|
|
|
{
|
|
|
if (typeof child !== 'object' || child === null) {
|
|
|
return knownKeys;
|
|
|
}
|
|
|
|
|
|
switch (child.$$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
warnForMissingKey(child, returnFiber);
|
|
|
var key = child.key;
|
|
|
|
|
|
if (typeof key !== 'string') {
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (knownKeys === null) {
|
|
|
knownKeys = new Set();
|
|
|
knownKeys.add(key);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (!knownKeys.has(key)) {
|
|
|
knownKeys.add(key);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
error('Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.', key);
|
|
|
|
|
|
break;
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
var payload = child._payload;
|
|
|
var init = child._init;
|
|
|
warnOnInvalidKey(init(payload), knownKeys, returnFiber);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return knownKeys;
|
|
|
}
|
|
|
|
|
|
function reconcileChildrenArray(returnFiber, currentFirstChild, newChildren, lanes) {
|
|
|
// This algorithm can't optimize by searching from both ends since we
|
|
|
// don't have backpointers on fibers. I'm trying to see how far we can get
|
|
|
// with that model. If it ends up not being worth the tradeoffs, we can
|
|
|
// add it later.
|
|
|
// Even with a two ended optimization, we'd want to optimize for the case
|
|
|
// where there are few changes and brute force the comparison instead of
|
|
|
// going for the Map. It'd like to explore hitting that path first in
|
|
|
// forward-only mode and only go for the Map once we notice that we need
|
|
|
// lots of look ahead. This doesn't handle reversal as well as two ended
|
|
|
// search but that's unusual. Besides, for the two ended optimization to
|
|
|
// work on Iterables, we'd need to copy the whole set.
|
|
|
// In this first iteration, we'll just live with hitting the bad case
|
|
|
// (adding everything to a Map) in for every insert/move.
|
|
|
// If you change this code, also update reconcileChildrenIterator() which
|
|
|
// uses the same algorithm.
|
|
|
{
|
|
|
// First, validate keys.
|
|
|
var knownKeys = null;
|
|
|
|
|
|
for (var i = 0; i < newChildren.length; i++) {
|
|
|
var child = newChildren[i];
|
|
|
knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var resultingFirstChild = null;
|
|
|
var previousNewFiber = null;
|
|
|
var oldFiber = currentFirstChild;
|
|
|
var lastPlacedIndex = 0;
|
|
|
var newIdx = 0;
|
|
|
var nextOldFiber = null;
|
|
|
|
|
|
for (; oldFiber !== null && newIdx < newChildren.length; newIdx++) {
|
|
|
if (oldFiber.index > newIdx) {
|
|
|
nextOldFiber = oldFiber;
|
|
|
oldFiber = null;
|
|
|
} else {
|
|
|
nextOldFiber = oldFiber.sibling;
|
|
|
}
|
|
|
|
|
|
var newFiber = updateSlot(returnFiber, oldFiber, newChildren[newIdx], lanes);
|
|
|
|
|
|
if (newFiber === null) {
|
|
|
// TODO: This breaks on empty slots like null children. That's
|
|
|
// unfortunate because it triggers the slow path all the time. We need
|
|
|
// a better way to communicate whether this was a miss or null,
|
|
|
// boolean, undefined, etc.
|
|
|
if (oldFiber === null) {
|
|
|
oldFiber = nextOldFiber;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (shouldTrackSideEffects) {
|
|
|
if (oldFiber && newFiber.alternate === null) {
|
|
|
// We matched the slot, but we didn't reuse the existing fiber, so we
|
|
|
// need to delete the existing child.
|
|
|
deleteChild(returnFiber, oldFiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx);
|
|
|
|
|
|
if (previousNewFiber === null) {
|
|
|
// TODO: Move out of the loop. This only happens for the first run.
|
|
|
resultingFirstChild = newFiber;
|
|
|
} else {
|
|
|
// TODO: Defer siblings if we're not at the right index for this slot.
|
|
|
// I.e. if we had null values before, then we want to defer this
|
|
|
// for each null value. However, we also don't want to call updateSlot
|
|
|
// with the previous one.
|
|
|
previousNewFiber.sibling = newFiber;
|
|
|
}
|
|
|
|
|
|
previousNewFiber = newFiber;
|
|
|
oldFiber = nextOldFiber;
|
|
|
}
|
|
|
|
|
|
if (newIdx === newChildren.length) {
|
|
|
// We've reached the end of the new children. We can delete the rest.
|
|
|
deleteRemainingChildren(returnFiber, oldFiber);
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var numberOfForks = newIdx;
|
|
|
pushTreeFork(returnFiber, numberOfForks);
|
|
|
}
|
|
|
|
|
|
return resultingFirstChild;
|
|
|
}
|
|
|
|
|
|
if (oldFiber === null) {
|
|
|
// If we don't have any more existing children we can choose a fast path
|
|
|
// since the rest will all be insertions.
|
|
|
for (; newIdx < newChildren.length; newIdx++) {
|
|
|
var _newFiber = createChild(returnFiber, newChildren[newIdx], lanes);
|
|
|
|
|
|
if (_newFiber === null) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
lastPlacedIndex = placeChild(_newFiber, lastPlacedIndex, newIdx);
|
|
|
|
|
|
if (previousNewFiber === null) {
|
|
|
// TODO: Move out of the loop. This only happens for the first run.
|
|
|
resultingFirstChild = _newFiber;
|
|
|
} else {
|
|
|
previousNewFiber.sibling = _newFiber;
|
|
|
}
|
|
|
|
|
|
previousNewFiber = _newFiber;
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var _numberOfForks = newIdx;
|
|
|
pushTreeFork(returnFiber, _numberOfForks);
|
|
|
}
|
|
|
|
|
|
return resultingFirstChild;
|
|
|
} // Add all children to a key map for quick lookups.
|
|
|
|
|
|
|
|
|
var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves.
|
|
|
|
|
|
for (; newIdx < newChildren.length; newIdx++) {
|
|
|
var _newFiber2 = updateFromMap(existingChildren, returnFiber, newIdx, newChildren[newIdx], lanes);
|
|
|
|
|
|
if (_newFiber2 !== null) {
|
|
|
if (shouldTrackSideEffects) {
|
|
|
if (_newFiber2.alternate !== null) {
|
|
|
// The new fiber is a work in progress, but if there exists a
|
|
|
// current, that means that we reused the fiber. We need to delete
|
|
|
// it from the child list so that we don't add it to the deletion
|
|
|
// list.
|
|
|
existingChildren.delete(_newFiber2.key === null ? newIdx : _newFiber2.key);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
lastPlacedIndex = placeChild(_newFiber2, lastPlacedIndex, newIdx);
|
|
|
|
|
|
if (previousNewFiber === null) {
|
|
|
resultingFirstChild = _newFiber2;
|
|
|
} else {
|
|
|
previousNewFiber.sibling = _newFiber2;
|
|
|
}
|
|
|
|
|
|
previousNewFiber = _newFiber2;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (shouldTrackSideEffects) {
|
|
|
// Any existing children that weren't consumed above were deleted. We need
|
|
|
// to add them to the deletion list.
|
|
|
existingChildren.forEach(function (child) {
|
|
|
return deleteChild(returnFiber, child);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var _numberOfForks2 = newIdx;
|
|
|
pushTreeFork(returnFiber, _numberOfForks2);
|
|
|
}
|
|
|
|
|
|
return resultingFirstChild;
|
|
|
}
|
|
|
|
|
|
function reconcileChildrenIterator(returnFiber, currentFirstChild, newChildrenIterable, lanes) {
|
|
|
// This is the same implementation as reconcileChildrenArray(),
|
|
|
// but using the iterator instead.
|
|
|
var iteratorFn = getIteratorFn(newChildrenIterable);
|
|
|
|
|
|
if (typeof iteratorFn !== 'function') {
|
|
|
throw new Error('An object is not an iterable. This error is likely caused by a bug in ' + 'React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// We don't support rendering Generators because it's a mutation.
|
|
|
// See https://github.com/facebook/react/issues/12995
|
|
|
if (typeof Symbol === 'function' && // $FlowFixMe Flow doesn't know about toStringTag
|
|
|
newChildrenIterable[Symbol.toStringTag] === 'Generator') {
|
|
|
if (!didWarnAboutGenerators) {
|
|
|
error('Using Generators as children is unsupported and will likely yield ' + 'unexpected results because enumerating a generator mutates it. ' + 'You may convert it to an array with `Array.from()` or the ' + '`[...spread]` operator before rendering. Keep in mind ' + 'you might need to polyfill these features for older browsers.');
|
|
|
}
|
|
|
|
|
|
didWarnAboutGenerators = true;
|
|
|
} // Warn about using Maps as children
|
|
|
|
|
|
|
|
|
if (newChildrenIterable.entries === iteratorFn) {
|
|
|
if (!didWarnAboutMaps) {
|
|
|
error('Using Maps as children is not supported. ' + 'Use an array of keyed ReactElements instead.');
|
|
|
}
|
|
|
|
|
|
didWarnAboutMaps = true;
|
|
|
} // First, validate keys.
|
|
|
// We'll get a different iterator later for the main pass.
|
|
|
|
|
|
|
|
|
var _newChildren = iteratorFn.call(newChildrenIterable);
|
|
|
|
|
|
if (_newChildren) {
|
|
|
var knownKeys = null;
|
|
|
|
|
|
var _step = _newChildren.next();
|
|
|
|
|
|
for (; !_step.done; _step = _newChildren.next()) {
|
|
|
var child = _step.value;
|
|
|
knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var newChildren = iteratorFn.call(newChildrenIterable);
|
|
|
|
|
|
if (newChildren == null) {
|
|
|
throw new Error('An iterable object provided no iterator.');
|
|
|
}
|
|
|
|
|
|
var resultingFirstChild = null;
|
|
|
var previousNewFiber = null;
|
|
|
var oldFiber = currentFirstChild;
|
|
|
var lastPlacedIndex = 0;
|
|
|
var newIdx = 0;
|
|
|
var nextOldFiber = null;
|
|
|
var step = newChildren.next();
|
|
|
|
|
|
for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next()) {
|
|
|
if (oldFiber.index > newIdx) {
|
|
|
nextOldFiber = oldFiber;
|
|
|
oldFiber = null;
|
|
|
} else {
|
|
|
nextOldFiber = oldFiber.sibling;
|
|
|
}
|
|
|
|
|
|
var newFiber = updateSlot(returnFiber, oldFiber, step.value, lanes);
|
|
|
|
|
|
if (newFiber === null) {
|
|
|
// TODO: This breaks on empty slots like null children. That's
|
|
|
// unfortunate because it triggers the slow path all the time. We need
|
|
|
// a better way to communicate whether this was a miss or null,
|
|
|
// boolean, undefined, etc.
|
|
|
if (oldFiber === null) {
|
|
|
oldFiber = nextOldFiber;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (shouldTrackSideEffects) {
|
|
|
if (oldFiber && newFiber.alternate === null) {
|
|
|
// We matched the slot, but we didn't reuse the existing fiber, so we
|
|
|
// need to delete the existing child.
|
|
|
deleteChild(returnFiber, oldFiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx);
|
|
|
|
|
|
if (previousNewFiber === null) {
|
|
|
// TODO: Move out of the loop. This only happens for the first run.
|
|
|
resultingFirstChild = newFiber;
|
|
|
} else {
|
|
|
// TODO: Defer siblings if we're not at the right index for this slot.
|
|
|
// I.e. if we had null values before, then we want to defer this
|
|
|
// for each null value. However, we also don't want to call updateSlot
|
|
|
// with the previous one.
|
|
|
previousNewFiber.sibling = newFiber;
|
|
|
}
|
|
|
|
|
|
previousNewFiber = newFiber;
|
|
|
oldFiber = nextOldFiber;
|
|
|
}
|
|
|
|
|
|
if (step.done) {
|
|
|
// We've reached the end of the new children. We can delete the rest.
|
|
|
deleteRemainingChildren(returnFiber, oldFiber);
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var numberOfForks = newIdx;
|
|
|
pushTreeFork(returnFiber, numberOfForks);
|
|
|
}
|
|
|
|
|
|
return resultingFirstChild;
|
|
|
}
|
|
|
|
|
|
if (oldFiber === null) {
|
|
|
// If we don't have any more existing children we can choose a fast path
|
|
|
// since the rest will all be insertions.
|
|
|
for (; !step.done; newIdx++, step = newChildren.next()) {
|
|
|
var _newFiber3 = createChild(returnFiber, step.value, lanes);
|
|
|
|
|
|
if (_newFiber3 === null) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
lastPlacedIndex = placeChild(_newFiber3, lastPlacedIndex, newIdx);
|
|
|
|
|
|
if (previousNewFiber === null) {
|
|
|
// TODO: Move out of the loop. This only happens for the first run.
|
|
|
resultingFirstChild = _newFiber3;
|
|
|
} else {
|
|
|
previousNewFiber.sibling = _newFiber3;
|
|
|
}
|
|
|
|
|
|
previousNewFiber = _newFiber3;
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var _numberOfForks3 = newIdx;
|
|
|
pushTreeFork(returnFiber, _numberOfForks3);
|
|
|
}
|
|
|
|
|
|
return resultingFirstChild;
|
|
|
} // Add all children to a key map for quick lookups.
|
|
|
|
|
|
|
|
|
var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves.
|
|
|
|
|
|
for (; !step.done; newIdx++, step = newChildren.next()) {
|
|
|
var _newFiber4 = updateFromMap(existingChildren, returnFiber, newIdx, step.value, lanes);
|
|
|
|
|
|
if (_newFiber4 !== null) {
|
|
|
if (shouldTrackSideEffects) {
|
|
|
if (_newFiber4.alternate !== null) {
|
|
|
// The new fiber is a work in progress, but if there exists a
|
|
|
// current, that means that we reused the fiber. We need to delete
|
|
|
// it from the child list so that we don't add it to the deletion
|
|
|
// list.
|
|
|
existingChildren.delete(_newFiber4.key === null ? newIdx : _newFiber4.key);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
lastPlacedIndex = placeChild(_newFiber4, lastPlacedIndex, newIdx);
|
|
|
|
|
|
if (previousNewFiber === null) {
|
|
|
resultingFirstChild = _newFiber4;
|
|
|
} else {
|
|
|
previousNewFiber.sibling = _newFiber4;
|
|
|
}
|
|
|
|
|
|
previousNewFiber = _newFiber4;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (shouldTrackSideEffects) {
|
|
|
// Any existing children that weren't consumed above were deleted. We need
|
|
|
// to add them to the deletion list.
|
|
|
existingChildren.forEach(function (child) {
|
|
|
return deleteChild(returnFiber, child);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var _numberOfForks4 = newIdx;
|
|
|
pushTreeFork(returnFiber, _numberOfForks4);
|
|
|
}
|
|
|
|
|
|
return resultingFirstChild;
|
|
|
}
|
|
|
|
|
|
function reconcileSingleTextNode(returnFiber, currentFirstChild, textContent, lanes) {
|
|
|
// There's no need to check for keys on text nodes since we don't have a
|
|
|
// way to define them.
|
|
|
if (currentFirstChild !== null && currentFirstChild.tag === HostText) {
|
|
|
// We already have an existing node so let's just update it and delete
|
|
|
// the rest.
|
|
|
deleteRemainingChildren(returnFiber, currentFirstChild.sibling);
|
|
|
var existing = useFiber(currentFirstChild, textContent);
|
|
|
existing.return = returnFiber;
|
|
|
return existing;
|
|
|
} // The existing first child is not a text node so we need to create one
|
|
|
// and delete the existing ones.
|
|
|
|
|
|
|
|
|
deleteRemainingChildren(returnFiber, currentFirstChild);
|
|
|
var created = createFiberFromText(textContent, returnFiber.mode, lanes);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
}
|
|
|
|
|
|
function reconcileSingleElement(returnFiber, currentFirstChild, element, lanes) {
|
|
|
var key = element.key;
|
|
|
var child = currentFirstChild;
|
|
|
|
|
|
while (child !== null) {
|
|
|
// TODO: If key === null and child.key === null, then this only applies to
|
|
|
// the first item in the list.
|
|
|
if (child.key === key) {
|
|
|
var elementType = element.type;
|
|
|
|
|
|
if (elementType === REACT_FRAGMENT_TYPE) {
|
|
|
if (child.tag === Fragment) {
|
|
|
deleteRemainingChildren(returnFiber, child.sibling);
|
|
|
var existing = useFiber(child, element.props.children);
|
|
|
existing.return = returnFiber;
|
|
|
|
|
|
{
|
|
|
existing._debugSource = element._source;
|
|
|
existing._debugOwner = element._owner;
|
|
|
}
|
|
|
|
|
|
return existing;
|
|
|
}
|
|
|
} else {
|
|
|
if (child.elementType === elementType || ( // Keep this check inline so it only runs on the false path:
|
|
|
isCompatibleFamilyForHotReloading(child, element) ) || // Lazy types should reconcile their resolved type.
|
|
|
// We need to do this after the Hot Reloading check above,
|
|
|
// because hot reloading has different semantics than prod because
|
|
|
// it doesn't resuspend. So we can't let the call below suspend.
|
|
|
typeof elementType === 'object' && elementType !== null && elementType.$$typeof === REACT_LAZY_TYPE && resolveLazy(elementType) === child.type) {
|
|
|
deleteRemainingChildren(returnFiber, child.sibling);
|
|
|
|
|
|
var _existing = useFiber(child, element.props);
|
|
|
|
|
|
_existing.ref = coerceRef(returnFiber, child, element);
|
|
|
_existing.return = returnFiber;
|
|
|
|
|
|
{
|
|
|
_existing._debugSource = element._source;
|
|
|
_existing._debugOwner = element._owner;
|
|
|
}
|
|
|
|
|
|
return _existing;
|
|
|
}
|
|
|
} // Didn't match.
|
|
|
|
|
|
|
|
|
deleteRemainingChildren(returnFiber, child);
|
|
|
break;
|
|
|
} else {
|
|
|
deleteChild(returnFiber, child);
|
|
|
}
|
|
|
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
|
|
|
if (element.type === REACT_FRAGMENT_TYPE) {
|
|
|
var created = createFiberFromFragment(element.props.children, returnFiber.mode, lanes, element.key);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
} else {
|
|
|
var _created4 = createFiberFromElement(element, returnFiber.mode, lanes);
|
|
|
|
|
|
_created4.ref = coerceRef(returnFiber, currentFirstChild, element);
|
|
|
_created4.return = returnFiber;
|
|
|
return _created4;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function reconcileSinglePortal(returnFiber, currentFirstChild, portal, lanes) {
|
|
|
var key = portal.key;
|
|
|
var child = currentFirstChild;
|
|
|
|
|
|
while (child !== null) {
|
|
|
// TODO: If key === null and child.key === null, then this only applies to
|
|
|
// the first item in the list.
|
|
|
if (child.key === key) {
|
|
|
if (child.tag === HostPortal && child.stateNode.containerInfo === portal.containerInfo && child.stateNode.implementation === portal.implementation) {
|
|
|
deleteRemainingChildren(returnFiber, child.sibling);
|
|
|
var existing = useFiber(child, portal.children || []);
|
|
|
existing.return = returnFiber;
|
|
|
return existing;
|
|
|
} else {
|
|
|
deleteRemainingChildren(returnFiber, child);
|
|
|
break;
|
|
|
}
|
|
|
} else {
|
|
|
deleteChild(returnFiber, child);
|
|
|
}
|
|
|
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
|
|
|
var created = createFiberFromPortal(portal, returnFiber.mode, lanes);
|
|
|
created.return = returnFiber;
|
|
|
return created;
|
|
|
} // This API will tag the children with the side-effect of the reconciliation
|
|
|
// itself. They will be added to the side-effect list as we pass through the
|
|
|
// children and the parent.
|
|
|
|
|
|
|
|
|
function reconcileChildFibers(returnFiber, currentFirstChild, newChild, lanes) {
|
|
|
// This function is not recursive.
|
|
|
// If the top level item is an array, we treat it as a set of children,
|
|
|
// not as a fragment. Nested arrays on the other hand will be treated as
|
|
|
// fragment nodes. Recursion happens at the normal flow.
|
|
|
// Handle top level unkeyed fragments as if they were arrays.
|
|
|
// This leads to an ambiguity between <>{[...]}</> and <>...</>.
|
|
|
// We treat the ambiguous cases above the same.
|
|
|
var isUnkeyedTopLevelFragment = typeof newChild === 'object' && newChild !== null && newChild.type === REACT_FRAGMENT_TYPE && newChild.key === null;
|
|
|
|
|
|
if (isUnkeyedTopLevelFragment) {
|
|
|
newChild = newChild.props.children;
|
|
|
} // Handle object types
|
|
|
|
|
|
|
|
|
if (typeof newChild === 'object' && newChild !== null) {
|
|
|
switch (newChild.$$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
return placeSingleChild(reconcileSingleElement(returnFiber, currentFirstChild, newChild, lanes));
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
return placeSingleChild(reconcileSinglePortal(returnFiber, currentFirstChild, newChild, lanes));
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
var payload = newChild._payload;
|
|
|
var init = newChild._init; // TODO: This function is supposed to be non-recursive.
|
|
|
|
|
|
return reconcileChildFibers(returnFiber, currentFirstChild, init(payload), lanes);
|
|
|
}
|
|
|
|
|
|
if (isArray(newChild)) {
|
|
|
return reconcileChildrenArray(returnFiber, currentFirstChild, newChild, lanes);
|
|
|
}
|
|
|
|
|
|
if (getIteratorFn(newChild)) {
|
|
|
return reconcileChildrenIterator(returnFiber, currentFirstChild, newChild, lanes);
|
|
|
}
|
|
|
|
|
|
throwOnInvalidObjectType(returnFiber, newChild);
|
|
|
}
|
|
|
|
|
|
if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') {
|
|
|
return placeSingleChild(reconcileSingleTextNode(returnFiber, currentFirstChild, '' + newChild, lanes));
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof newChild === 'function') {
|
|
|
warnOnFunctionType(returnFiber);
|
|
|
}
|
|
|
} // Remaining cases are all treated as empty.
|
|
|
|
|
|
|
|
|
return deleteRemainingChildren(returnFiber, currentFirstChild);
|
|
|
}
|
|
|
|
|
|
return reconcileChildFibers;
|
|
|
}
|
|
|
|
|
|
var reconcileChildFibers = ChildReconciler(true);
|
|
|
var mountChildFibers = ChildReconciler(false);
|
|
|
function cloneChildFibers(current, workInProgress) {
|
|
|
if (current !== null && workInProgress.child !== current.child) {
|
|
|
throw new Error('Resuming work not yet implemented.');
|
|
|
}
|
|
|
|
|
|
if (workInProgress.child === null) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var currentChild = workInProgress.child;
|
|
|
var newChild = createWorkInProgress(currentChild, currentChild.pendingProps);
|
|
|
workInProgress.child = newChild;
|
|
|
newChild.return = workInProgress;
|
|
|
|
|
|
while (currentChild.sibling !== null) {
|
|
|
currentChild = currentChild.sibling;
|
|
|
newChild = newChild.sibling = createWorkInProgress(currentChild, currentChild.pendingProps);
|
|
|
newChild.return = workInProgress;
|
|
|
}
|
|
|
|
|
|
newChild.sibling = null;
|
|
|
} // Reset a workInProgress child set to prepare it for a second pass.
|
|
|
|
|
|
function resetChildFibers(workInProgress, lanes) {
|
|
|
var child = workInProgress.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
resetWorkInProgress(child, lanes);
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var NO_CONTEXT = {};
|
|
|
var contextStackCursor$1 = createCursor(NO_CONTEXT);
|
|
|
var contextFiberStackCursor = createCursor(NO_CONTEXT);
|
|
|
var rootInstanceStackCursor = createCursor(NO_CONTEXT);
|
|
|
|
|
|
function requiredContext(c) {
|
|
|
if (c === NO_CONTEXT) {
|
|
|
throw new Error('Expected host context to exist. This error is likely caused by a bug ' + 'in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
return c;
|
|
|
}
|
|
|
|
|
|
function getRootHostContainer() {
|
|
|
var rootInstance = requiredContext(rootInstanceStackCursor.current);
|
|
|
return rootInstance;
|
|
|
}
|
|
|
|
|
|
function pushHostContainer(fiber, nextRootInstance) {
|
|
|
// Push current root instance onto the stack;
|
|
|
// This allows us to reset root when portals are popped.
|
|
|
push(rootInstanceStackCursor, nextRootInstance, fiber); // Track the context and the Fiber that provided it.
|
|
|
// This enables us to pop only Fibers that provide unique contexts.
|
|
|
|
|
|
push(contextFiberStackCursor, fiber, fiber); // Finally, we need to push the host context to the stack.
|
|
|
// However, we can't just call getRootHostContext() and push it because
|
|
|
// we'd have a different number of entries on the stack depending on
|
|
|
// whether getRootHostContext() throws somewhere in renderer code or not.
|
|
|
// So we push an empty value first. This lets us safely unwind on errors.
|
|
|
|
|
|
push(contextStackCursor$1, NO_CONTEXT, fiber);
|
|
|
var nextRootContext = getRootHostContext(nextRootInstance); // Now that we know this function doesn't throw, replace it.
|
|
|
|
|
|
pop(contextStackCursor$1, fiber);
|
|
|
push(contextStackCursor$1, nextRootContext, fiber);
|
|
|
}
|
|
|
|
|
|
function popHostContainer(fiber) {
|
|
|
pop(contextStackCursor$1, fiber);
|
|
|
pop(contextFiberStackCursor, fiber);
|
|
|
pop(rootInstanceStackCursor, fiber);
|
|
|
}
|
|
|
|
|
|
function getHostContext() {
|
|
|
var context = requiredContext(contextStackCursor$1.current);
|
|
|
return context;
|
|
|
}
|
|
|
|
|
|
function pushHostContext(fiber) {
|
|
|
var rootInstance = requiredContext(rootInstanceStackCursor.current);
|
|
|
var context = requiredContext(contextStackCursor$1.current);
|
|
|
var nextContext = getChildHostContext(context, fiber.type); // Don't push this Fiber's context unless it's unique.
|
|
|
|
|
|
if (context === nextContext) {
|
|
|
return;
|
|
|
} // Track the context and the Fiber that provided it.
|
|
|
// This enables us to pop only Fibers that provide unique contexts.
|
|
|
|
|
|
|
|
|
push(contextFiberStackCursor, fiber, fiber);
|
|
|
push(contextStackCursor$1, nextContext, fiber);
|
|
|
}
|
|
|
|
|
|
function popHostContext(fiber) {
|
|
|
// Do not pop unless this Fiber provided the current context.
|
|
|
// pushHostContext() only pushes Fibers that provide unique contexts.
|
|
|
if (contextFiberStackCursor.current !== fiber) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
pop(contextStackCursor$1, fiber);
|
|
|
pop(contextFiberStackCursor, fiber);
|
|
|
}
|
|
|
|
|
|
var DefaultSuspenseContext = 0; // The Suspense Context is split into two parts. The lower bits is
|
|
|
// inherited deeply down the subtree. The upper bits only affect
|
|
|
// this immediate suspense boundary and gets reset each new
|
|
|
// boundary or suspense list.
|
|
|
|
|
|
var SubtreeSuspenseContextMask = 1; // Subtree Flags:
|
|
|
// InvisibleParentSuspenseContext indicates that one of our parent Suspense
|
|
|
// boundaries is not currently showing visible main content.
|
|
|
// Either because it is already showing a fallback or is not mounted at all.
|
|
|
// We can use this to determine if it is desirable to trigger a fallback at
|
|
|
// the parent. If not, then we might need to trigger undesirable boundaries
|
|
|
// and/or suspend the commit to avoid hiding the parent content.
|
|
|
|
|
|
var InvisibleParentSuspenseContext = 1; // Shallow Flags:
|
|
|
// ForceSuspenseFallback can be used by SuspenseList to force newly added
|
|
|
// items into their fallback state during one of the render passes.
|
|
|
|
|
|
var ForceSuspenseFallback = 2;
|
|
|
var suspenseStackCursor = createCursor(DefaultSuspenseContext);
|
|
|
function hasSuspenseContext(parentContext, flag) {
|
|
|
return (parentContext & flag) !== 0;
|
|
|
}
|
|
|
function setDefaultShallowSuspenseContext(parentContext) {
|
|
|
return parentContext & SubtreeSuspenseContextMask;
|
|
|
}
|
|
|
function setShallowSuspenseContext(parentContext, shallowContext) {
|
|
|
return parentContext & SubtreeSuspenseContextMask | shallowContext;
|
|
|
}
|
|
|
function addSubtreeSuspenseContext(parentContext, subtreeContext) {
|
|
|
return parentContext | subtreeContext;
|
|
|
}
|
|
|
function pushSuspenseContext(fiber, newContext) {
|
|
|
push(suspenseStackCursor, newContext, fiber);
|
|
|
}
|
|
|
function popSuspenseContext(fiber) {
|
|
|
pop(suspenseStackCursor, fiber);
|
|
|
}
|
|
|
|
|
|
function shouldCaptureSuspense(workInProgress, hasInvisibleParent) {
|
|
|
// If it was the primary children that just suspended, capture and render the
|
|
|
// fallback. Otherwise, don't capture and bubble to the next boundary.
|
|
|
var nextState = workInProgress.memoizedState;
|
|
|
|
|
|
if (nextState !== null) {
|
|
|
if (nextState.dehydrated !== null) {
|
|
|
// A dehydrated boundary always captures.
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var props = workInProgress.memoizedProps; // Regular boundaries always capture.
|
|
|
|
|
|
{
|
|
|
return true;
|
|
|
} // If it's a boundary we should avoid, then we prefer to bubble up to the
|
|
|
}
|
|
|
function findFirstSuspended(row) {
|
|
|
var node = row;
|
|
|
|
|
|
while (node !== null) {
|
|
|
if (node.tag === SuspenseComponent) {
|
|
|
var state = node.memoizedState;
|
|
|
|
|
|
if (state !== null) {
|
|
|
var dehydrated = state.dehydrated;
|
|
|
|
|
|
if (dehydrated === null || isSuspenseInstancePending(dehydrated) || isSuspenseInstanceFallback(dehydrated)) {
|
|
|
return node;
|
|
|
}
|
|
|
}
|
|
|
} else if (node.tag === SuspenseListComponent && // revealOrder undefined can't be trusted because it don't
|
|
|
// keep track of whether it suspended or not.
|
|
|
node.memoizedProps.revealOrder !== undefined) {
|
|
|
var didSuspend = (node.flags & DidCapture) !== NoFlags;
|
|
|
|
|
|
if (didSuspend) {
|
|
|
return node;
|
|
|
}
|
|
|
} else if (node.child !== null) {
|
|
|
node.child.return = node;
|
|
|
node = node.child;
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (node === row) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || node.return === row) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var NoFlags$1 =
|
|
|
/* */
|
|
|
0; // Represents whether effect should fire.
|
|
|
|
|
|
var HasEffect =
|
|
|
/* */
|
|
|
1; // Represents the phase in which the effect (not the clean-up) fires.
|
|
|
|
|
|
var Insertion =
|
|
|
/* */
|
|
|
2;
|
|
|
var Layout =
|
|
|
/* */
|
|
|
4;
|
|
|
var Passive$1 =
|
|
|
/* */
|
|
|
8;
|
|
|
|
|
|
// and should be reset before starting a new render.
|
|
|
// This tracks which mutable sources need to be reset after a render.
|
|
|
|
|
|
var workInProgressSources = [];
|
|
|
function resetWorkInProgressVersions() {
|
|
|
for (var i = 0; i < workInProgressSources.length; i++) {
|
|
|
var mutableSource = workInProgressSources[i];
|
|
|
|
|
|
{
|
|
|
mutableSource._workInProgressVersionPrimary = null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
workInProgressSources.length = 0;
|
|
|
}
|
|
|
// This ensures that the version used for server rendering matches the one
|
|
|
// that is eventually read during hydration.
|
|
|
// If they don't match there's a potential tear and a full deopt render is required.
|
|
|
|
|
|
function registerMutableSourceForHydration(root, mutableSource) {
|
|
|
var getVersion = mutableSource._getVersion;
|
|
|
var version = getVersion(mutableSource._source); // TODO Clear this data once all pending hydration work is finished.
|
|
|
// Retaining it forever may interfere with GC.
|
|
|
|
|
|
if (root.mutableSourceEagerHydrationData == null) {
|
|
|
root.mutableSourceEagerHydrationData = [mutableSource, version];
|
|
|
} else {
|
|
|
root.mutableSourceEagerHydrationData.push(mutableSource, version);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentDispatcher$1 = ReactSharedInternals.ReactCurrentDispatcher,
|
|
|
ReactCurrentBatchConfig$2 = ReactSharedInternals.ReactCurrentBatchConfig;
|
|
|
var didWarnAboutMismatchedHooksForComponent;
|
|
|
var didWarnUncachedGetSnapshot;
|
|
|
|
|
|
{
|
|
|
didWarnAboutMismatchedHooksForComponent = new Set();
|
|
|
}
|
|
|
|
|
|
// These are set right before calling the component.
|
|
|
var renderLanes = NoLanes; // The work-in-progress fiber. I've named it differently to distinguish it from
|
|
|
// the work-in-progress hook.
|
|
|
|
|
|
var currentlyRenderingFiber$1 = null; // Hooks are stored as a linked list on the fiber's memoizedState field. The
|
|
|
// current hook list is the list that belongs to the current fiber. The
|
|
|
// work-in-progress hook list is a new list that will be added to the
|
|
|
// work-in-progress fiber.
|
|
|
|
|
|
var currentHook = null;
|
|
|
var workInProgressHook = null; // Whether an update was scheduled at any point during the render phase. This
|
|
|
// does not get reset if we do another render pass; only when we're completely
|
|
|
// finished evaluating this component. This is an optimization so we know
|
|
|
// whether we need to clear render phase updates after a throw.
|
|
|
|
|
|
var didScheduleRenderPhaseUpdate = false; // Where an update was scheduled only during the current render pass. This
|
|
|
// gets reset after each attempt.
|
|
|
// TODO: Maybe there's some way to consolidate this with
|
|
|
// `didScheduleRenderPhaseUpdate`. Or with `numberOfReRenders`.
|
|
|
|
|
|
var didScheduleRenderPhaseUpdateDuringThisPass = false; // Counts the number of useId hooks in this component.
|
|
|
|
|
|
var localIdCounter = 0; // Used for ids that are generated completely client-side (i.e. not during
|
|
|
// hydration). This counter is global, so client ids are not stable across
|
|
|
// render attempts.
|
|
|
|
|
|
var globalClientIdCounter = 0;
|
|
|
var RE_RENDER_LIMIT = 25; // In DEV, this is the name of the currently executing primitive hook
|
|
|
|
|
|
var currentHookNameInDev = null; // In DEV, this list ensures that hooks are called in the same order between renders.
|
|
|
// The list stores the order of hooks used during the initial render (mount).
|
|
|
// Subsequent renders (updates) reference this list.
|
|
|
|
|
|
var hookTypesDev = null;
|
|
|
var hookTypesUpdateIndexDev = -1; // In DEV, this tracks whether currently rendering component needs to ignore
|
|
|
// the dependencies for Hooks that need them (e.g. useEffect or useMemo).
|
|
|
// When true, such Hooks will always be "remounted". Only used during hot reload.
|
|
|
|
|
|
var ignorePreviousDependencies = false;
|
|
|
|
|
|
function mountHookTypesDev() {
|
|
|
{
|
|
|
var hookName = currentHookNameInDev;
|
|
|
|
|
|
if (hookTypesDev === null) {
|
|
|
hookTypesDev = [hookName];
|
|
|
} else {
|
|
|
hookTypesDev.push(hookName);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateHookTypesDev() {
|
|
|
{
|
|
|
var hookName = currentHookNameInDev;
|
|
|
|
|
|
if (hookTypesDev !== null) {
|
|
|
hookTypesUpdateIndexDev++;
|
|
|
|
|
|
if (hookTypesDev[hookTypesUpdateIndexDev] !== hookName) {
|
|
|
warnOnHookMismatchInDev(hookName);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function checkDepsAreArrayDev(deps) {
|
|
|
{
|
|
|
if (deps !== undefined && deps !== null && !isArray(deps)) {
|
|
|
// Verify deps, but only on mount to avoid extra checks.
|
|
|
// It's unlikely their type would change as usually you define them inline.
|
|
|
error('%s received a final argument that is not an array (instead, received `%s`). When ' + 'specified, the final argument must be an array.', currentHookNameInDev, typeof deps);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function warnOnHookMismatchInDev(currentHookName) {
|
|
|
{
|
|
|
var componentName = getComponentNameFromFiber(currentlyRenderingFiber$1);
|
|
|
|
|
|
if (!didWarnAboutMismatchedHooksForComponent.has(componentName)) {
|
|
|
didWarnAboutMismatchedHooksForComponent.add(componentName);
|
|
|
|
|
|
if (hookTypesDev !== null) {
|
|
|
var table = '';
|
|
|
var secondColumnStart = 30;
|
|
|
|
|
|
for (var i = 0; i <= hookTypesUpdateIndexDev; i++) {
|
|
|
var oldHookName = hookTypesDev[i];
|
|
|
var newHookName = i === hookTypesUpdateIndexDev ? currentHookName : oldHookName;
|
|
|
var row = i + 1 + ". " + oldHookName; // Extra space so second column lines up
|
|
|
// lol @ IE not supporting String#repeat
|
|
|
|
|
|
while (row.length < secondColumnStart) {
|
|
|
row += ' ';
|
|
|
}
|
|
|
|
|
|
row += newHookName + '\n';
|
|
|
table += row;
|
|
|
}
|
|
|
|
|
|
error('React has detected a change in the order of Hooks called by %s. ' + 'This will lead to bugs and errors if not fixed. ' + 'For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks\n\n' + ' Previous render Next render\n' + ' ------------------------------------------------------\n' + '%s' + ' ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n', componentName, table);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function throwInvalidHookError() {
|
|
|
throw new Error('Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' + ' one of the following reasons:\n' + '1. You might have mismatching versions of React and the renderer (such as React DOM)\n' + '2. You might be breaking the Rules of Hooks\n' + '3. You might have more than one copy of React in the same app\n' + 'See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.');
|
|
|
}
|
|
|
|
|
|
function areHookInputsEqual(nextDeps, prevDeps) {
|
|
|
{
|
|
|
if (ignorePreviousDependencies) {
|
|
|
// Only true when this component is being hot reloaded.
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (prevDeps === null) {
|
|
|
{
|
|
|
error('%s received a final argument during this render, but not during ' + 'the previous render. Even though the final argument is optional, ' + 'its type cannot change between renders.', currentHookNameInDev);
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// Don't bother comparing lengths in prod because these arrays should be
|
|
|
// passed inline.
|
|
|
if (nextDeps.length !== prevDeps.length) {
|
|
|
error('The final argument passed to %s changed size between renders. The ' + 'order and size of this array must remain constant.\n\n' + 'Previous: %s\n' + 'Incoming: %s', currentHookNameInDev, "[" + prevDeps.join(', ') + "]", "[" + nextDeps.join(', ') + "]");
|
|
|
}
|
|
|
}
|
|
|
|
|
|
for (var i = 0; i < prevDeps.length && i < nextDeps.length; i++) {
|
|
|
if (objectIs(nextDeps[i], prevDeps[i])) {
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function renderWithHooks(current, workInProgress, Component, props, secondArg, nextRenderLanes) {
|
|
|
renderLanes = nextRenderLanes;
|
|
|
currentlyRenderingFiber$1 = workInProgress;
|
|
|
|
|
|
{
|
|
|
hookTypesDev = current !== null ? current._debugHookTypes : null;
|
|
|
hookTypesUpdateIndexDev = -1; // Used for hot reloading:
|
|
|
|
|
|
ignorePreviousDependencies = current !== null && current.type !== workInProgress.type;
|
|
|
}
|
|
|
|
|
|
workInProgress.memoizedState = null;
|
|
|
workInProgress.updateQueue = null;
|
|
|
workInProgress.lanes = NoLanes; // The following should have already been reset
|
|
|
// currentHook = null;
|
|
|
// workInProgressHook = null;
|
|
|
// didScheduleRenderPhaseUpdate = false;
|
|
|
// localIdCounter = 0;
|
|
|
// TODO Warn if no hooks are used at all during mount, then some are used during update.
|
|
|
// Currently we will identify the update render as a mount because memoizedState === null.
|
|
|
// This is tricky because it's valid for certain types of components (e.g. React.lazy)
|
|
|
// Using memoizedState to differentiate between mount/update only works if at least one stateful hook is used.
|
|
|
// Non-stateful hooks (e.g. context) don't get added to memoizedState,
|
|
|
// so memoizedState would be null during updates and mounts.
|
|
|
|
|
|
{
|
|
|
if (current !== null && current.memoizedState !== null) {
|
|
|
ReactCurrentDispatcher$1.current = HooksDispatcherOnUpdateInDEV;
|
|
|
} else if (hookTypesDev !== null) {
|
|
|
// This dispatcher handles an edge case where a component is updating,
|
|
|
// but no stateful hooks have been used.
|
|
|
// We want to match the production code behavior (which will use HooksDispatcherOnMount),
|
|
|
// but with the extra DEV validation to ensure hooks ordering hasn't changed.
|
|
|
// This dispatcher does that.
|
|
|
ReactCurrentDispatcher$1.current = HooksDispatcherOnMountWithHookTypesInDEV;
|
|
|
} else {
|
|
|
ReactCurrentDispatcher$1.current = HooksDispatcherOnMountInDEV;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var children = Component(props, secondArg); // Check if there was a render phase update
|
|
|
|
|
|
if (didScheduleRenderPhaseUpdateDuringThisPass) {
|
|
|
// Keep rendering in a loop for as long as render phase updates continue to
|
|
|
// be scheduled. Use a counter to prevent infinite loops.
|
|
|
var numberOfReRenders = 0;
|
|
|
|
|
|
do {
|
|
|
didScheduleRenderPhaseUpdateDuringThisPass = false;
|
|
|
localIdCounter = 0;
|
|
|
|
|
|
if (numberOfReRenders >= RE_RENDER_LIMIT) {
|
|
|
throw new Error('Too many re-renders. React limits the number of renders to prevent ' + 'an infinite loop.');
|
|
|
}
|
|
|
|
|
|
numberOfReRenders += 1;
|
|
|
|
|
|
{
|
|
|
// Even when hot reloading, allow dependencies to stabilize
|
|
|
// after first render to prevent infinite render phase updates.
|
|
|
ignorePreviousDependencies = false;
|
|
|
} // Start over from the beginning of the list
|
|
|
|
|
|
|
|
|
currentHook = null;
|
|
|
workInProgressHook = null;
|
|
|
workInProgress.updateQueue = null;
|
|
|
|
|
|
{
|
|
|
// Also validate hook order for cascading updates.
|
|
|
hookTypesUpdateIndexDev = -1;
|
|
|
}
|
|
|
|
|
|
ReactCurrentDispatcher$1.current = HooksDispatcherOnRerenderInDEV ;
|
|
|
children = Component(props, secondArg);
|
|
|
} while (didScheduleRenderPhaseUpdateDuringThisPass);
|
|
|
} // We can assume the previous dispatcher is always this one, since we set it
|
|
|
// at the beginning of the render phase and there's no re-entrance.
|
|
|
|
|
|
|
|
|
ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
|
|
|
|
|
|
{
|
|
|
workInProgress._debugHookTypes = hookTypesDev;
|
|
|
} // This check uses currentHook so that it works the same in DEV and prod bundles.
|
|
|
// hookTypesDev could catch more cases (e.g. context) but only in DEV bundles.
|
|
|
|
|
|
|
|
|
var didRenderTooFewHooks = currentHook !== null && currentHook.next !== null;
|
|
|
renderLanes = NoLanes;
|
|
|
currentlyRenderingFiber$1 = null;
|
|
|
currentHook = null;
|
|
|
workInProgressHook = null;
|
|
|
|
|
|
{
|
|
|
currentHookNameInDev = null;
|
|
|
hookTypesDev = null;
|
|
|
hookTypesUpdateIndexDev = -1; // Confirm that a static flag was not added or removed since the last
|
|
|
// render. If this fires, it suggests that we incorrectly reset the static
|
|
|
// flags in some other part of the codebase. This has happened before, for
|
|
|
// example, in the SuspenseList implementation.
|
|
|
|
|
|
if (current !== null && (current.flags & StaticMask) !== (workInProgress.flags & StaticMask) && // Disable this warning in legacy mode, because legacy Suspense is weird
|
|
|
// and creates false positives. To make this work in legacy mode, we'd
|
|
|
// need to mark fibers that commit in an incomplete state, somehow. For
|
|
|
// now I'll disable the warning that most of the bugs that would trigger
|
|
|
// it are either exclusive to concurrent mode or exist in both.
|
|
|
(current.mode & ConcurrentMode) !== NoMode) {
|
|
|
error('Internal React error: Expected static flag was missing. Please ' + 'notify the React team.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
didScheduleRenderPhaseUpdate = false; // This is reset by checkDidRenderIdHook
|
|
|
// localIdCounter = 0;
|
|
|
|
|
|
if (didRenderTooFewHooks) {
|
|
|
throw new Error('Rendered fewer hooks than expected. This may be caused by an accidental ' + 'early return statement.');
|
|
|
}
|
|
|
|
|
|
return children;
|
|
|
}
|
|
|
function checkDidRenderIdHook() {
|
|
|
// This should be called immediately after every renderWithHooks call.
|
|
|
// Conceptually, it's part of the return value of renderWithHooks; it's only a
|
|
|
// separate function to avoid using an array tuple.
|
|
|
var didRenderIdHook = localIdCounter !== 0;
|
|
|
localIdCounter = 0;
|
|
|
return didRenderIdHook;
|
|
|
}
|
|
|
function bailoutHooks(current, workInProgress, lanes) {
|
|
|
workInProgress.updateQueue = current.updateQueue; // TODO: Don't need to reset the flags here, because they're reset in the
|
|
|
// complete phase (bubbleProperties).
|
|
|
|
|
|
if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) {
|
|
|
workInProgress.flags &= ~(MountPassiveDev | MountLayoutDev | Passive | Update);
|
|
|
} else {
|
|
|
workInProgress.flags &= ~(Passive | Update);
|
|
|
}
|
|
|
|
|
|
current.lanes = removeLanes(current.lanes, lanes);
|
|
|
}
|
|
|
function resetHooksAfterThrow() {
|
|
|
// We can assume the previous dispatcher is always this one, since we set it
|
|
|
// at the beginning of the render phase and there's no re-entrance.
|
|
|
ReactCurrentDispatcher$1.current = ContextOnlyDispatcher;
|
|
|
|
|
|
if (didScheduleRenderPhaseUpdate) {
|
|
|
// There were render phase updates. These are only valid for this render
|
|
|
// phase, which we are now aborting. Remove the updates from the queues so
|
|
|
// they do not persist to the next render. Do not remove updates from hooks
|
|
|
// that weren't processed.
|
|
|
//
|
|
|
// Only reset the updates from the queue if it has a clone. If it does
|
|
|
// not have a clone, that means it wasn't processed, and the updates were
|
|
|
// scheduled before we entered the render phase.
|
|
|
var hook = currentlyRenderingFiber$1.memoizedState;
|
|
|
|
|
|
while (hook !== null) {
|
|
|
var queue = hook.queue;
|
|
|
|
|
|
if (queue !== null) {
|
|
|
queue.pending = null;
|
|
|
}
|
|
|
|
|
|
hook = hook.next;
|
|
|
}
|
|
|
|
|
|
didScheduleRenderPhaseUpdate = false;
|
|
|
}
|
|
|
|
|
|
renderLanes = NoLanes;
|
|
|
currentlyRenderingFiber$1 = null;
|
|
|
currentHook = null;
|
|
|
workInProgressHook = null;
|
|
|
|
|
|
{
|
|
|
hookTypesDev = null;
|
|
|
hookTypesUpdateIndexDev = -1;
|
|
|
currentHookNameInDev = null;
|
|
|
isUpdatingOpaqueValueInRenderPhase = false;
|
|
|
}
|
|
|
|
|
|
didScheduleRenderPhaseUpdateDuringThisPass = false;
|
|
|
localIdCounter = 0;
|
|
|
}
|
|
|
|
|
|
function mountWorkInProgressHook() {
|
|
|
var hook = {
|
|
|
memoizedState: null,
|
|
|
baseState: null,
|
|
|
baseQueue: null,
|
|
|
queue: null,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (workInProgressHook === null) {
|
|
|
// This is the first hook in the list
|
|
|
currentlyRenderingFiber$1.memoizedState = workInProgressHook = hook;
|
|
|
} else {
|
|
|
// Append to the end of the list
|
|
|
workInProgressHook = workInProgressHook.next = hook;
|
|
|
}
|
|
|
|
|
|
return workInProgressHook;
|
|
|
}
|
|
|
|
|
|
function updateWorkInProgressHook() {
|
|
|
// This function is used both for updates and for re-renders triggered by a
|
|
|
// render phase update. It assumes there is either a current hook we can
|
|
|
// clone, or a work-in-progress hook from a previous render pass that we can
|
|
|
// use as a base. When we reach the end of the base list, we must switch to
|
|
|
// the dispatcher used for mounts.
|
|
|
var nextCurrentHook;
|
|
|
|
|
|
if (currentHook === null) {
|
|
|
var current = currentlyRenderingFiber$1.alternate;
|
|
|
|
|
|
if (current !== null) {
|
|
|
nextCurrentHook = current.memoizedState;
|
|
|
} else {
|
|
|
nextCurrentHook = null;
|
|
|
}
|
|
|
} else {
|
|
|
nextCurrentHook = currentHook.next;
|
|
|
}
|
|
|
|
|
|
var nextWorkInProgressHook;
|
|
|
|
|
|
if (workInProgressHook === null) {
|
|
|
nextWorkInProgressHook = currentlyRenderingFiber$1.memoizedState;
|
|
|
} else {
|
|
|
nextWorkInProgressHook = workInProgressHook.next;
|
|
|
}
|
|
|
|
|
|
if (nextWorkInProgressHook !== null) {
|
|
|
// There's already a work-in-progress. Reuse it.
|
|
|
workInProgressHook = nextWorkInProgressHook;
|
|
|
nextWorkInProgressHook = workInProgressHook.next;
|
|
|
currentHook = nextCurrentHook;
|
|
|
} else {
|
|
|
// Clone from the current hook.
|
|
|
if (nextCurrentHook === null) {
|
|
|
throw new Error('Rendered more hooks than during the previous render.');
|
|
|
}
|
|
|
|
|
|
currentHook = nextCurrentHook;
|
|
|
var newHook = {
|
|
|
memoizedState: currentHook.memoizedState,
|
|
|
baseState: currentHook.baseState,
|
|
|
baseQueue: currentHook.baseQueue,
|
|
|
queue: currentHook.queue,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (workInProgressHook === null) {
|
|
|
// This is the first hook in the list.
|
|
|
currentlyRenderingFiber$1.memoizedState = workInProgressHook = newHook;
|
|
|
} else {
|
|
|
// Append to the end of the list.
|
|
|
workInProgressHook = workInProgressHook.next = newHook;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return workInProgressHook;
|
|
|
}
|
|
|
|
|
|
function createFunctionComponentUpdateQueue() {
|
|
|
return {
|
|
|
lastEffect: null,
|
|
|
stores: null
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function basicStateReducer(state, action) {
|
|
|
// $FlowFixMe: Flow doesn't like mixed types
|
|
|
return typeof action === 'function' ? action(state) : action;
|
|
|
}
|
|
|
|
|
|
function mountReducer(reducer, initialArg, init) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
var initialState;
|
|
|
|
|
|
if (init !== undefined) {
|
|
|
initialState = init(initialArg);
|
|
|
} else {
|
|
|
initialState = initialArg;
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = hook.baseState = initialState;
|
|
|
var queue = {
|
|
|
pending: null,
|
|
|
interleaved: null,
|
|
|
lanes: NoLanes,
|
|
|
dispatch: null,
|
|
|
lastRenderedReducer: reducer,
|
|
|
lastRenderedState: initialState
|
|
|
};
|
|
|
hook.queue = queue;
|
|
|
var dispatch = queue.dispatch = dispatchReducerAction.bind(null, currentlyRenderingFiber$1, queue);
|
|
|
return [hook.memoizedState, dispatch];
|
|
|
}
|
|
|
|
|
|
function updateReducer(reducer, initialArg, init) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var queue = hook.queue;
|
|
|
|
|
|
if (queue === null) {
|
|
|
throw new Error('Should have a queue. This is likely a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
queue.lastRenderedReducer = reducer;
|
|
|
var current = currentHook; // The last rebase update that is NOT part of the base state.
|
|
|
|
|
|
var baseQueue = current.baseQueue; // The last pending update that hasn't been processed yet.
|
|
|
|
|
|
var pendingQueue = queue.pending;
|
|
|
|
|
|
if (pendingQueue !== null) {
|
|
|
// We have new updates that haven't been processed yet.
|
|
|
// We'll add them to the base queue.
|
|
|
if (baseQueue !== null) {
|
|
|
// Merge the pending queue and the base queue.
|
|
|
var baseFirst = baseQueue.next;
|
|
|
var pendingFirst = pendingQueue.next;
|
|
|
baseQueue.next = pendingFirst;
|
|
|
pendingQueue.next = baseFirst;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (current.baseQueue !== baseQueue) {
|
|
|
// Internal invariant that should never happen, but feasibly could in
|
|
|
// the future if we implement resuming, or some form of that.
|
|
|
error('Internal error: Expected work-in-progress queue to be a clone. ' + 'This is a bug in React.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
current.baseQueue = baseQueue = pendingQueue;
|
|
|
queue.pending = null;
|
|
|
}
|
|
|
|
|
|
if (baseQueue !== null) {
|
|
|
// We have a queue to process.
|
|
|
var first = baseQueue.next;
|
|
|
var newState = current.baseState;
|
|
|
var newBaseState = null;
|
|
|
var newBaseQueueFirst = null;
|
|
|
var newBaseQueueLast = null;
|
|
|
var update = first;
|
|
|
|
|
|
do {
|
|
|
var updateLane = update.lane;
|
|
|
|
|
|
if (!isSubsetOfLanes(renderLanes, updateLane)) {
|
|
|
// Priority is insufficient. Skip this update. If this is the first
|
|
|
// skipped update, the previous update/state is the new base
|
|
|
// update/state.
|
|
|
var clone = {
|
|
|
lane: updateLane,
|
|
|
action: update.action,
|
|
|
hasEagerState: update.hasEagerState,
|
|
|
eagerState: update.eagerState,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (newBaseQueueLast === null) {
|
|
|
newBaseQueueFirst = newBaseQueueLast = clone;
|
|
|
newBaseState = newState;
|
|
|
} else {
|
|
|
newBaseQueueLast = newBaseQueueLast.next = clone;
|
|
|
} // Update the remaining priority in the queue.
|
|
|
// TODO: Don't need to accumulate this. Instead, we can remove
|
|
|
// renderLanes from the original lanes.
|
|
|
|
|
|
|
|
|
currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, updateLane);
|
|
|
markSkippedUpdateLanes(updateLane);
|
|
|
} else {
|
|
|
// This update does have sufficient priority.
|
|
|
if (newBaseQueueLast !== null) {
|
|
|
var _clone = {
|
|
|
// This update is going to be committed so we never want uncommit
|
|
|
// it. Using NoLane works because 0 is a subset of all bitmasks, so
|
|
|
// this will never be skipped by the check above.
|
|
|
lane: NoLane,
|
|
|
action: update.action,
|
|
|
hasEagerState: update.hasEagerState,
|
|
|
eagerState: update.eagerState,
|
|
|
next: null
|
|
|
};
|
|
|
newBaseQueueLast = newBaseQueueLast.next = _clone;
|
|
|
} // Process this update.
|
|
|
|
|
|
|
|
|
if (update.hasEagerState) {
|
|
|
// If this update is a state update (not a reducer) and was processed eagerly,
|
|
|
// we can use the eagerly computed state
|
|
|
newState = update.eagerState;
|
|
|
} else {
|
|
|
var action = update.action;
|
|
|
newState = reducer(newState, action);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
update = update.next;
|
|
|
} while (update !== null && update !== first);
|
|
|
|
|
|
if (newBaseQueueLast === null) {
|
|
|
newBaseState = newState;
|
|
|
} else {
|
|
|
newBaseQueueLast.next = newBaseQueueFirst;
|
|
|
} // Mark that the fiber performed work, but only if the new state is
|
|
|
// different from the current state.
|
|
|
|
|
|
|
|
|
if (!objectIs(newState, hook.memoizedState)) {
|
|
|
markWorkInProgressReceivedUpdate();
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = newState;
|
|
|
hook.baseState = newBaseState;
|
|
|
hook.baseQueue = newBaseQueueLast;
|
|
|
queue.lastRenderedState = newState;
|
|
|
} // Interleaved updates are stored on a separate queue. We aren't going to
|
|
|
// process them during this render, but we do need to track which lanes
|
|
|
// are remaining.
|
|
|
|
|
|
|
|
|
var lastInterleaved = queue.interleaved;
|
|
|
|
|
|
if (lastInterleaved !== null) {
|
|
|
var interleaved = lastInterleaved;
|
|
|
|
|
|
do {
|
|
|
var interleavedLane = interleaved.lane;
|
|
|
currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, interleavedLane);
|
|
|
markSkippedUpdateLanes(interleavedLane);
|
|
|
interleaved = interleaved.next;
|
|
|
} while (interleaved !== lastInterleaved);
|
|
|
} else if (baseQueue === null) {
|
|
|
// `queue.lanes` is used for entangling transitions. We can set it back to
|
|
|
// zero once the queue is empty.
|
|
|
queue.lanes = NoLanes;
|
|
|
}
|
|
|
|
|
|
var dispatch = queue.dispatch;
|
|
|
return [hook.memoizedState, dispatch];
|
|
|
}
|
|
|
|
|
|
function rerenderReducer(reducer, initialArg, init) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var queue = hook.queue;
|
|
|
|
|
|
if (queue === null) {
|
|
|
throw new Error('Should have a queue. This is likely a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
queue.lastRenderedReducer = reducer; // This is a re-render. Apply the new render phase updates to the previous
|
|
|
// work-in-progress hook.
|
|
|
|
|
|
var dispatch = queue.dispatch;
|
|
|
var lastRenderPhaseUpdate = queue.pending;
|
|
|
var newState = hook.memoizedState;
|
|
|
|
|
|
if (lastRenderPhaseUpdate !== null) {
|
|
|
// The queue doesn't persist past this render pass.
|
|
|
queue.pending = null;
|
|
|
var firstRenderPhaseUpdate = lastRenderPhaseUpdate.next;
|
|
|
var update = firstRenderPhaseUpdate;
|
|
|
|
|
|
do {
|
|
|
// Process this render phase update. We don't have to check the
|
|
|
// priority because it will always be the same as the current
|
|
|
// render's.
|
|
|
var action = update.action;
|
|
|
newState = reducer(newState, action);
|
|
|
update = update.next;
|
|
|
} while (update !== firstRenderPhaseUpdate); // Mark that the fiber performed work, but only if the new state is
|
|
|
// different from the current state.
|
|
|
|
|
|
|
|
|
if (!objectIs(newState, hook.memoizedState)) {
|
|
|
markWorkInProgressReceivedUpdate();
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = newState; // Don't persist the state accumulated from the render phase updates to
|
|
|
// the base state unless the queue is empty.
|
|
|
// TODO: Not sure if this is the desired semantics, but it's what we
|
|
|
// do for gDSFP. I can't remember why.
|
|
|
|
|
|
if (hook.baseQueue === null) {
|
|
|
hook.baseState = newState;
|
|
|
}
|
|
|
|
|
|
queue.lastRenderedState = newState;
|
|
|
}
|
|
|
|
|
|
return [newState, dispatch];
|
|
|
}
|
|
|
|
|
|
function mountMutableSource(source, getSnapshot, subscribe) {
|
|
|
{
|
|
|
return undefined;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateMutableSource(source, getSnapshot, subscribe) {
|
|
|
{
|
|
|
return undefined;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
|
|
|
var fiber = currentlyRenderingFiber$1;
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
var nextSnapshot;
|
|
|
var isHydrating = getIsHydrating();
|
|
|
|
|
|
if (isHydrating) {
|
|
|
if (getServerSnapshot === undefined) {
|
|
|
throw new Error('Missing getServerSnapshot, which is required for ' + 'server-rendered content. Will revert to client rendering.');
|
|
|
}
|
|
|
|
|
|
nextSnapshot = getServerSnapshot();
|
|
|
|
|
|
{
|
|
|
if (!didWarnUncachedGetSnapshot) {
|
|
|
if (nextSnapshot !== getServerSnapshot()) {
|
|
|
error('The result of getServerSnapshot should be cached to avoid an infinite loop');
|
|
|
|
|
|
didWarnUncachedGetSnapshot = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
nextSnapshot = getSnapshot();
|
|
|
|
|
|
{
|
|
|
if (!didWarnUncachedGetSnapshot) {
|
|
|
var cachedSnapshot = getSnapshot();
|
|
|
|
|
|
if (!objectIs(nextSnapshot, cachedSnapshot)) {
|
|
|
error('The result of getSnapshot should be cached to avoid an infinite loop');
|
|
|
|
|
|
didWarnUncachedGetSnapshot = true;
|
|
|
}
|
|
|
}
|
|
|
} // Unless we're rendering a blocking lane, schedule a consistency check.
|
|
|
// Right before committing, we will walk the tree and check if any of the
|
|
|
// stores were mutated.
|
|
|
//
|
|
|
// We won't do this if we're hydrating server-rendered content, because if
|
|
|
// the content is stale, it's already visible anyway. Instead we'll patch
|
|
|
// it up in a passive effect.
|
|
|
|
|
|
|
|
|
var root = getWorkInProgressRoot();
|
|
|
|
|
|
if (root === null) {
|
|
|
throw new Error('Expected a work-in-progress root. This is a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
if (!includesBlockingLane(root, renderLanes)) {
|
|
|
pushStoreConsistencyCheck(fiber, getSnapshot, nextSnapshot);
|
|
|
}
|
|
|
} // Read the current snapshot from the store on every render. This breaks the
|
|
|
// normal rules of React, and only works because store updates are
|
|
|
// always synchronous.
|
|
|
|
|
|
|
|
|
hook.memoizedState = nextSnapshot;
|
|
|
var inst = {
|
|
|
value: nextSnapshot,
|
|
|
getSnapshot: getSnapshot
|
|
|
};
|
|
|
hook.queue = inst; // Schedule an effect to subscribe to the store.
|
|
|
|
|
|
mountEffect(subscribeToStore.bind(null, fiber, inst, subscribe), [subscribe]); // Schedule an effect to update the mutable instance fields. We will update
|
|
|
// this whenever subscribe, getSnapshot, or value changes. Because there's no
|
|
|
// clean-up function, and we track the deps correctly, we can call pushEffect
|
|
|
// directly, without storing any additional state. For the same reason, we
|
|
|
// don't need to set a static flag, either.
|
|
|
// TODO: We can move this to the passive phase once we add a pre-commit
|
|
|
// consistency check. See the next comment.
|
|
|
|
|
|
fiber.flags |= Passive;
|
|
|
pushEffect(HasEffect | Passive$1, updateStoreInstance.bind(null, fiber, inst, nextSnapshot, getSnapshot), undefined, null);
|
|
|
return nextSnapshot;
|
|
|
}
|
|
|
|
|
|
function updateSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
|
|
|
var fiber = currentlyRenderingFiber$1;
|
|
|
var hook = updateWorkInProgressHook(); // Read the current snapshot from the store on every render. This breaks the
|
|
|
// normal rules of React, and only works because store updates are
|
|
|
// always synchronous.
|
|
|
|
|
|
var nextSnapshot = getSnapshot();
|
|
|
|
|
|
{
|
|
|
if (!didWarnUncachedGetSnapshot) {
|
|
|
var cachedSnapshot = getSnapshot();
|
|
|
|
|
|
if (!objectIs(nextSnapshot, cachedSnapshot)) {
|
|
|
error('The result of getSnapshot should be cached to avoid an infinite loop');
|
|
|
|
|
|
didWarnUncachedGetSnapshot = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var prevSnapshot = hook.memoizedState;
|
|
|
var snapshotChanged = !objectIs(prevSnapshot, nextSnapshot);
|
|
|
|
|
|
if (snapshotChanged) {
|
|
|
hook.memoizedState = nextSnapshot;
|
|
|
markWorkInProgressReceivedUpdate();
|
|
|
}
|
|
|
|
|
|
var inst = hook.queue;
|
|
|
updateEffect(subscribeToStore.bind(null, fiber, inst, subscribe), [subscribe]); // Whenever getSnapshot or subscribe changes, we need to check in the
|
|
|
// commit phase if there was an interleaved mutation. In concurrent mode
|
|
|
// this can happen all the time, but even in synchronous mode, an earlier
|
|
|
// effect may have mutated the store.
|
|
|
|
|
|
if (inst.getSnapshot !== getSnapshot || snapshotChanged || // Check if the susbcribe function changed. We can save some memory by
|
|
|
// checking whether we scheduled a subscription effect above.
|
|
|
workInProgressHook !== null && workInProgressHook.memoizedState.tag & HasEffect) {
|
|
|
fiber.flags |= Passive;
|
|
|
pushEffect(HasEffect | Passive$1, updateStoreInstance.bind(null, fiber, inst, nextSnapshot, getSnapshot), undefined, null); // Unless we're rendering a blocking lane, schedule a consistency check.
|
|
|
// Right before committing, we will walk the tree and check if any of the
|
|
|
// stores were mutated.
|
|
|
|
|
|
var root = getWorkInProgressRoot();
|
|
|
|
|
|
if (root === null) {
|
|
|
throw new Error('Expected a work-in-progress root. This is a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
if (!includesBlockingLane(root, renderLanes)) {
|
|
|
pushStoreConsistencyCheck(fiber, getSnapshot, nextSnapshot);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return nextSnapshot;
|
|
|
}
|
|
|
|
|
|
function pushStoreConsistencyCheck(fiber, getSnapshot, renderedSnapshot) {
|
|
|
fiber.flags |= StoreConsistency;
|
|
|
var check = {
|
|
|
getSnapshot: getSnapshot,
|
|
|
value: renderedSnapshot
|
|
|
};
|
|
|
var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue;
|
|
|
|
|
|
if (componentUpdateQueue === null) {
|
|
|
componentUpdateQueue = createFunctionComponentUpdateQueue();
|
|
|
currentlyRenderingFiber$1.updateQueue = componentUpdateQueue;
|
|
|
componentUpdateQueue.stores = [check];
|
|
|
} else {
|
|
|
var stores = componentUpdateQueue.stores;
|
|
|
|
|
|
if (stores === null) {
|
|
|
componentUpdateQueue.stores = [check];
|
|
|
} else {
|
|
|
stores.push(check);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateStoreInstance(fiber, inst, nextSnapshot, getSnapshot) {
|
|
|
// These are updated in the passive phase
|
|
|
inst.value = nextSnapshot;
|
|
|
inst.getSnapshot = getSnapshot; // Something may have been mutated in between render and commit. This could
|
|
|
// have been in an event that fired before the passive effects, or it could
|
|
|
// have been in a layout effect. In that case, we would have used the old
|
|
|
// snapsho and getSnapshot values to bail out. We need to check one more time.
|
|
|
|
|
|
if (checkIfSnapshotChanged(inst)) {
|
|
|
// Force a re-render.
|
|
|
forceStoreRerender(fiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function subscribeToStore(fiber, inst, subscribe) {
|
|
|
var handleStoreChange = function () {
|
|
|
// The store changed. Check if the snapshot changed since the last time we
|
|
|
// read from the store.
|
|
|
if (checkIfSnapshotChanged(inst)) {
|
|
|
// Force a re-render.
|
|
|
forceStoreRerender(fiber);
|
|
|
}
|
|
|
}; // Subscribe to the store and return a clean-up function.
|
|
|
|
|
|
|
|
|
return subscribe(handleStoreChange);
|
|
|
}
|
|
|
|
|
|
function checkIfSnapshotChanged(inst) {
|
|
|
var latestGetSnapshot = inst.getSnapshot;
|
|
|
var prevValue = inst.value;
|
|
|
|
|
|
try {
|
|
|
var nextValue = latestGetSnapshot();
|
|
|
return !objectIs(prevValue, nextValue);
|
|
|
} catch (error) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function forceStoreRerender(fiber) {
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function mountState(initialState) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
|
|
|
if (typeof initialState === 'function') {
|
|
|
// $FlowFixMe: Flow doesn't like mixed types
|
|
|
initialState = initialState();
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = hook.baseState = initialState;
|
|
|
var queue = {
|
|
|
pending: null,
|
|
|
interleaved: null,
|
|
|
lanes: NoLanes,
|
|
|
dispatch: null,
|
|
|
lastRenderedReducer: basicStateReducer,
|
|
|
lastRenderedState: initialState
|
|
|
};
|
|
|
hook.queue = queue;
|
|
|
var dispatch = queue.dispatch = dispatchSetState.bind(null, currentlyRenderingFiber$1, queue);
|
|
|
return [hook.memoizedState, dispatch];
|
|
|
}
|
|
|
|
|
|
function updateState(initialState) {
|
|
|
return updateReducer(basicStateReducer);
|
|
|
}
|
|
|
|
|
|
function rerenderState(initialState) {
|
|
|
return rerenderReducer(basicStateReducer);
|
|
|
}
|
|
|
|
|
|
function pushEffect(tag, create, destroy, deps) {
|
|
|
var effect = {
|
|
|
tag: tag,
|
|
|
create: create,
|
|
|
destroy: destroy,
|
|
|
deps: deps,
|
|
|
// Circular
|
|
|
next: null
|
|
|
};
|
|
|
var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue;
|
|
|
|
|
|
if (componentUpdateQueue === null) {
|
|
|
componentUpdateQueue = createFunctionComponentUpdateQueue();
|
|
|
currentlyRenderingFiber$1.updateQueue = componentUpdateQueue;
|
|
|
componentUpdateQueue.lastEffect = effect.next = effect;
|
|
|
} else {
|
|
|
var lastEffect = componentUpdateQueue.lastEffect;
|
|
|
|
|
|
if (lastEffect === null) {
|
|
|
componentUpdateQueue.lastEffect = effect.next = effect;
|
|
|
} else {
|
|
|
var firstEffect = lastEffect.next;
|
|
|
lastEffect.next = effect;
|
|
|
effect.next = firstEffect;
|
|
|
componentUpdateQueue.lastEffect = effect;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return effect;
|
|
|
}
|
|
|
|
|
|
function mountRef(initialValue) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
|
|
|
{
|
|
|
var _ref2 = {
|
|
|
current: initialValue
|
|
|
};
|
|
|
hook.memoizedState = _ref2;
|
|
|
return _ref2;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateRef(initialValue) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
return hook.memoizedState;
|
|
|
}
|
|
|
|
|
|
function mountEffectImpl(fiberFlags, hookFlags, create, deps) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
var nextDeps = deps === undefined ? null : deps;
|
|
|
currentlyRenderingFiber$1.flags |= fiberFlags;
|
|
|
hook.memoizedState = pushEffect(HasEffect | hookFlags, create, undefined, nextDeps);
|
|
|
}
|
|
|
|
|
|
function updateEffectImpl(fiberFlags, hookFlags, create, deps) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var nextDeps = deps === undefined ? null : deps;
|
|
|
var destroy = undefined;
|
|
|
|
|
|
if (currentHook !== null) {
|
|
|
var prevEffect = currentHook.memoizedState;
|
|
|
destroy = prevEffect.destroy;
|
|
|
|
|
|
if (nextDeps !== null) {
|
|
|
var prevDeps = prevEffect.deps;
|
|
|
|
|
|
if (areHookInputsEqual(nextDeps, prevDeps)) {
|
|
|
hook.memoizedState = pushEffect(hookFlags, create, destroy, nextDeps);
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
currentlyRenderingFiber$1.flags |= fiberFlags;
|
|
|
hook.memoizedState = pushEffect(HasEffect | hookFlags, create, destroy, nextDeps);
|
|
|
}
|
|
|
|
|
|
function mountEffect(create, deps) {
|
|
|
if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
|
|
|
return mountEffectImpl(MountPassiveDev | Passive | PassiveStatic, Passive$1, create, deps);
|
|
|
} else {
|
|
|
return mountEffectImpl(Passive | PassiveStatic, Passive$1, create, deps);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateEffect(create, deps) {
|
|
|
return updateEffectImpl(Passive, Passive$1, create, deps);
|
|
|
}
|
|
|
|
|
|
function mountInsertionEffect(create, deps) {
|
|
|
return mountEffectImpl(Update, Insertion, create, deps);
|
|
|
}
|
|
|
|
|
|
function updateInsertionEffect(create, deps) {
|
|
|
return updateEffectImpl(Update, Insertion, create, deps);
|
|
|
}
|
|
|
|
|
|
function mountLayoutEffect(create, deps) {
|
|
|
var fiberFlags = Update;
|
|
|
|
|
|
{
|
|
|
fiberFlags |= LayoutStatic;
|
|
|
}
|
|
|
|
|
|
if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
|
|
|
fiberFlags |= MountLayoutDev;
|
|
|
}
|
|
|
|
|
|
return mountEffectImpl(fiberFlags, Layout, create, deps);
|
|
|
}
|
|
|
|
|
|
function updateLayoutEffect(create, deps) {
|
|
|
return updateEffectImpl(Update, Layout, create, deps);
|
|
|
}
|
|
|
|
|
|
function imperativeHandleEffect(create, ref) {
|
|
|
if (typeof ref === 'function') {
|
|
|
var refCallback = ref;
|
|
|
|
|
|
var _inst = create();
|
|
|
|
|
|
refCallback(_inst);
|
|
|
return function () {
|
|
|
refCallback(null);
|
|
|
};
|
|
|
} else if (ref !== null && ref !== undefined) {
|
|
|
var refObject = ref;
|
|
|
|
|
|
{
|
|
|
if (!refObject.hasOwnProperty('current')) {
|
|
|
error('Expected useImperativeHandle() first argument to either be a ' + 'ref callback or React.createRef() object. Instead received: %s.', 'an object with keys {' + Object.keys(refObject).join(', ') + '}');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var _inst2 = create();
|
|
|
|
|
|
refObject.current = _inst2;
|
|
|
return function () {
|
|
|
refObject.current = null;
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function mountImperativeHandle(ref, create, deps) {
|
|
|
{
|
|
|
if (typeof create !== 'function') {
|
|
|
error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null');
|
|
|
}
|
|
|
} // TODO: If deps are provided, should we skip comparing the ref itself?
|
|
|
|
|
|
|
|
|
var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null;
|
|
|
var fiberFlags = Update;
|
|
|
|
|
|
{
|
|
|
fiberFlags |= LayoutStatic;
|
|
|
}
|
|
|
|
|
|
if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) {
|
|
|
fiberFlags |= MountLayoutDev;
|
|
|
}
|
|
|
|
|
|
return mountEffectImpl(fiberFlags, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps);
|
|
|
}
|
|
|
|
|
|
function updateImperativeHandle(ref, create, deps) {
|
|
|
{
|
|
|
if (typeof create !== 'function') {
|
|
|
error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null');
|
|
|
}
|
|
|
} // TODO: If deps are provided, should we skip comparing the ref itself?
|
|
|
|
|
|
|
|
|
var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null;
|
|
|
return updateEffectImpl(Update, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps);
|
|
|
}
|
|
|
|
|
|
function mountDebugValue(value, formatterFn) {// This hook is normally a no-op.
|
|
|
// The react-debug-hooks package injects its own implementation
|
|
|
// so that e.g. DevTools can display custom hook values.
|
|
|
}
|
|
|
|
|
|
var updateDebugValue = mountDebugValue;
|
|
|
|
|
|
function mountCallback(callback, deps) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
var nextDeps = deps === undefined ? null : deps;
|
|
|
hook.memoizedState = [callback, nextDeps];
|
|
|
return callback;
|
|
|
}
|
|
|
|
|
|
function updateCallback(callback, deps) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var nextDeps = deps === undefined ? null : deps;
|
|
|
var prevState = hook.memoizedState;
|
|
|
|
|
|
if (prevState !== null) {
|
|
|
if (nextDeps !== null) {
|
|
|
var prevDeps = prevState[1];
|
|
|
|
|
|
if (areHookInputsEqual(nextDeps, prevDeps)) {
|
|
|
return prevState[0];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = [callback, nextDeps];
|
|
|
return callback;
|
|
|
}
|
|
|
|
|
|
function mountMemo(nextCreate, deps) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
var nextDeps = deps === undefined ? null : deps;
|
|
|
var nextValue = nextCreate();
|
|
|
hook.memoizedState = [nextValue, nextDeps];
|
|
|
return nextValue;
|
|
|
}
|
|
|
|
|
|
function updateMemo(nextCreate, deps) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var nextDeps = deps === undefined ? null : deps;
|
|
|
var prevState = hook.memoizedState;
|
|
|
|
|
|
if (prevState !== null) {
|
|
|
// Assume these are defined. If they're not, areHookInputsEqual will warn.
|
|
|
if (nextDeps !== null) {
|
|
|
var prevDeps = prevState[1];
|
|
|
|
|
|
if (areHookInputsEqual(nextDeps, prevDeps)) {
|
|
|
return prevState[0];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var nextValue = nextCreate();
|
|
|
hook.memoizedState = [nextValue, nextDeps];
|
|
|
return nextValue;
|
|
|
}
|
|
|
|
|
|
function mountDeferredValue(value) {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
hook.memoizedState = value;
|
|
|
return value;
|
|
|
}
|
|
|
|
|
|
function updateDeferredValue(value) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var resolvedCurrentHook = currentHook;
|
|
|
var prevValue = resolvedCurrentHook.memoizedState;
|
|
|
return updateDeferredValueImpl(hook, prevValue, value);
|
|
|
}
|
|
|
|
|
|
function rerenderDeferredValue(value) {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
|
|
|
if (currentHook === null) {
|
|
|
// This is a rerender during a mount.
|
|
|
hook.memoizedState = value;
|
|
|
return value;
|
|
|
} else {
|
|
|
// This is a rerender during an update.
|
|
|
var prevValue = currentHook.memoizedState;
|
|
|
return updateDeferredValueImpl(hook, prevValue, value);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateDeferredValueImpl(hook, prevValue, value) {
|
|
|
var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes);
|
|
|
|
|
|
if (shouldDeferValue) {
|
|
|
// This is an urgent update. If the value has changed, keep using the
|
|
|
// previous value and spawn a deferred render to update it later.
|
|
|
if (!objectIs(value, prevValue)) {
|
|
|
// Schedule a deferred render
|
|
|
var deferredLane = claimNextTransitionLane();
|
|
|
currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, deferredLane);
|
|
|
markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent
|
|
|
// from the latest value. The name "baseState" doesn't really match how we
|
|
|
// use it because we're reusing a state hook field instead of creating a
|
|
|
// new one.
|
|
|
|
|
|
hook.baseState = true;
|
|
|
} // Reuse the previous value
|
|
|
|
|
|
|
|
|
return prevValue;
|
|
|
} else {
|
|
|
// This is not an urgent update, so we can use the latest value regardless
|
|
|
// of what it is. No need to defer it.
|
|
|
// However, if we're currently inside a spawned render, then we need to mark
|
|
|
// this as an update to prevent the fiber from bailing out.
|
|
|
//
|
|
|
// `baseState` is true when the current value is different from the rendered
|
|
|
// value. The name doesn't really match how we use it because we're reusing
|
|
|
// a state hook field instead of creating a new one.
|
|
|
if (hook.baseState) {
|
|
|
// Flip this back to false.
|
|
|
hook.baseState = false;
|
|
|
markWorkInProgressReceivedUpdate();
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = value;
|
|
|
return value;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function startTransition(setPending, callback, options) {
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
setCurrentUpdatePriority(higherEventPriority(previousPriority, ContinuousEventPriority));
|
|
|
setPending(true);
|
|
|
var prevTransition = ReactCurrentBatchConfig$2.transition;
|
|
|
ReactCurrentBatchConfig$2.transition = {};
|
|
|
var currentTransition = ReactCurrentBatchConfig$2.transition;
|
|
|
|
|
|
{
|
|
|
ReactCurrentBatchConfig$2.transition._updatedFibers = new Set();
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
setPending(false);
|
|
|
callback();
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig$2.transition = prevTransition;
|
|
|
|
|
|
{
|
|
|
if (prevTransition === null && currentTransition._updatedFibers) {
|
|
|
var updatedFibersCount = currentTransition._updatedFibers.size;
|
|
|
|
|
|
if (updatedFibersCount > 10) {
|
|
|
warn('Detected a large number of updates inside startTransition. ' + 'If this is due to a subscription please re-write it to use React provided hooks. ' + 'Otherwise concurrent mode guarantees are off the table.');
|
|
|
}
|
|
|
|
|
|
currentTransition._updatedFibers.clear();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function mountTransition() {
|
|
|
var _mountState = mountState(false),
|
|
|
isPending = _mountState[0],
|
|
|
setPending = _mountState[1]; // The `start` method never changes.
|
|
|
|
|
|
|
|
|
var start = startTransition.bind(null, setPending);
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
hook.memoizedState = start;
|
|
|
return [isPending, start];
|
|
|
}
|
|
|
|
|
|
function updateTransition() {
|
|
|
var _updateState = updateState(),
|
|
|
isPending = _updateState[0];
|
|
|
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var start = hook.memoizedState;
|
|
|
return [isPending, start];
|
|
|
}
|
|
|
|
|
|
function rerenderTransition() {
|
|
|
var _rerenderState = rerenderState(),
|
|
|
isPending = _rerenderState[0];
|
|
|
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var start = hook.memoizedState;
|
|
|
return [isPending, start];
|
|
|
}
|
|
|
|
|
|
var isUpdatingOpaqueValueInRenderPhase = false;
|
|
|
function getIsUpdatingOpaqueValueInRenderPhaseInDEV() {
|
|
|
{
|
|
|
return isUpdatingOpaqueValueInRenderPhase;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function mountId() {
|
|
|
var hook = mountWorkInProgressHook();
|
|
|
var root = getWorkInProgressRoot(); // TODO: In Fizz, id generation is specific to each server config. Maybe we
|
|
|
// should do this in Fiber, too? Deferring this decision for now because
|
|
|
// there's no other place to store the prefix except for an internal field on
|
|
|
// the public createRoot object, which the fiber tree does not currently have
|
|
|
// a reference to.
|
|
|
|
|
|
var identifierPrefix = root.identifierPrefix;
|
|
|
var id;
|
|
|
|
|
|
if (getIsHydrating()) {
|
|
|
var treeId = getTreeId(); // Use a captial R prefix for server-generated ids.
|
|
|
|
|
|
id = ':' + identifierPrefix + 'R' + treeId; // Unless this is the first id at this level, append a number at the end
|
|
|
// that represents the position of this useId hook among all the useId
|
|
|
// hooks for this fiber.
|
|
|
|
|
|
var localId = localIdCounter++;
|
|
|
|
|
|
if (localId > 0) {
|
|
|
id += 'H' + localId.toString(32);
|
|
|
}
|
|
|
|
|
|
id += ':';
|
|
|
} else {
|
|
|
// Use a lowercase r prefix for client-generated ids.
|
|
|
var globalClientId = globalClientIdCounter++;
|
|
|
id = ':' + identifierPrefix + 'r' + globalClientId.toString(32) + ':';
|
|
|
}
|
|
|
|
|
|
hook.memoizedState = id;
|
|
|
return id;
|
|
|
}
|
|
|
|
|
|
function updateId() {
|
|
|
var hook = updateWorkInProgressHook();
|
|
|
var id = hook.memoizedState;
|
|
|
return id;
|
|
|
}
|
|
|
|
|
|
function dispatchReducerAction(fiber, queue, action) {
|
|
|
{
|
|
|
if (typeof arguments[3] === 'function') {
|
|
|
error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var lane = requestUpdateLane(fiber);
|
|
|
var update = {
|
|
|
lane: lane,
|
|
|
action: action,
|
|
|
hasEagerState: false,
|
|
|
eagerState: null,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (isRenderPhaseUpdate(fiber)) {
|
|
|
enqueueRenderPhaseUpdate(queue, update);
|
|
|
} else {
|
|
|
var root = enqueueConcurrentHookUpdate(fiber, queue, update, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
var eventTime = requestEventTime();
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
entangleTransitionUpdate(root, queue, lane);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
markUpdateInDevTools(fiber, lane);
|
|
|
}
|
|
|
|
|
|
function dispatchSetState(fiber, queue, action) {
|
|
|
{
|
|
|
if (typeof arguments[3] === 'function') {
|
|
|
error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var lane = requestUpdateLane(fiber);
|
|
|
var update = {
|
|
|
lane: lane,
|
|
|
action: action,
|
|
|
hasEagerState: false,
|
|
|
eagerState: null,
|
|
|
next: null
|
|
|
};
|
|
|
|
|
|
if (isRenderPhaseUpdate(fiber)) {
|
|
|
enqueueRenderPhaseUpdate(queue, update);
|
|
|
} else {
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (fiber.lanes === NoLanes && (alternate === null || alternate.lanes === NoLanes)) {
|
|
|
// The queue is currently empty, which means we can eagerly compute the
|
|
|
// next state before entering the render phase. If the new state is the
|
|
|
// same as the current state, we may be able to bail out entirely.
|
|
|
var lastRenderedReducer = queue.lastRenderedReducer;
|
|
|
|
|
|
if (lastRenderedReducer !== null) {
|
|
|
var prevDispatcher;
|
|
|
|
|
|
{
|
|
|
prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
var currentState = queue.lastRenderedState;
|
|
|
var eagerState = lastRenderedReducer(currentState, action); // Stash the eagerly computed state, and the reducer used to compute
|
|
|
// it, on the update object. If the reducer hasn't changed by the
|
|
|
// time we enter the render phase, then the eager state can be used
|
|
|
// without calling the reducer again.
|
|
|
|
|
|
update.hasEagerState = true;
|
|
|
update.eagerState = eagerState;
|
|
|
|
|
|
if (objectIs(eagerState, currentState)) {
|
|
|
// Fast path. We can bail out without scheduling React to re-render.
|
|
|
// It's still possible that we'll need to rebase this update later,
|
|
|
// if the component re-renders for a different reason and by that
|
|
|
// time the reducer has changed.
|
|
|
// TODO: Do we still need to entangle transitions in this case?
|
|
|
enqueueConcurrentHookUpdateAndEagerlyBailout(fiber, queue, update, lane);
|
|
|
return;
|
|
|
}
|
|
|
} catch (error) {// Suppress the error. It will throw again in the render phase.
|
|
|
} finally {
|
|
|
{
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var root = enqueueConcurrentHookUpdate(fiber, queue, update, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
var eventTime = requestEventTime();
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
entangleTransitionUpdate(root, queue, lane);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
markUpdateInDevTools(fiber, lane);
|
|
|
}
|
|
|
|
|
|
function isRenderPhaseUpdate(fiber) {
|
|
|
var alternate = fiber.alternate;
|
|
|
return fiber === currentlyRenderingFiber$1 || alternate !== null && alternate === currentlyRenderingFiber$1;
|
|
|
}
|
|
|
|
|
|
function enqueueRenderPhaseUpdate(queue, update) {
|
|
|
// This is a render phase update. Stash it in a lazily-created map of
|
|
|
// queue -> linked list of updates. After this render pass, we'll restart
|
|
|
// and apply the stashed updates on top of the work-in-progress hook.
|
|
|
didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate = true;
|
|
|
var pending = queue.pending;
|
|
|
|
|
|
if (pending === null) {
|
|
|
// This is the first update. Create a circular list.
|
|
|
update.next = update;
|
|
|
} else {
|
|
|
update.next = pending.next;
|
|
|
pending.next = update;
|
|
|
}
|
|
|
|
|
|
queue.pending = update;
|
|
|
} // TODO: Move to ReactFiberConcurrentUpdates?
|
|
|
|
|
|
|
|
|
function entangleTransitionUpdate(root, queue, lane) {
|
|
|
if (isTransitionLane(lane)) {
|
|
|
var queueLanes = queue.lanes; // If any entangled lanes are no longer pending on the root, then they
|
|
|
// must have finished. We can remove them from the shared queue, which
|
|
|
// represents a superset of the actually pending lanes. In some cases we
|
|
|
// may entangle more than we need to, but that's OK. In fact it's worse if
|
|
|
// we *don't* entangle when we should.
|
|
|
|
|
|
queueLanes = intersectLanes(queueLanes, root.pendingLanes); // Entangle the new transition lane with the other transition lanes.
|
|
|
|
|
|
var newQueueLanes = mergeLanes(queueLanes, lane);
|
|
|
queue.lanes = newQueueLanes; // Even if queue.lanes already include lane, we don't know for certain if
|
|
|
// the lane finished since the last time we entangled it. So we need to
|
|
|
// entangle it again, just to be sure.
|
|
|
|
|
|
markRootEntangled(root, newQueueLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function markUpdateInDevTools(fiber, lane, action) {
|
|
|
|
|
|
{
|
|
|
markStateUpdateScheduled(fiber, lane);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ContextOnlyDispatcher = {
|
|
|
readContext: readContext,
|
|
|
useCallback: throwInvalidHookError,
|
|
|
useContext: throwInvalidHookError,
|
|
|
useEffect: throwInvalidHookError,
|
|
|
useImperativeHandle: throwInvalidHookError,
|
|
|
useInsertionEffect: throwInvalidHookError,
|
|
|
useLayoutEffect: throwInvalidHookError,
|
|
|
useMemo: throwInvalidHookError,
|
|
|
useReducer: throwInvalidHookError,
|
|
|
useRef: throwInvalidHookError,
|
|
|
useState: throwInvalidHookError,
|
|
|
useDebugValue: throwInvalidHookError,
|
|
|
useDeferredValue: throwInvalidHookError,
|
|
|
useTransition: throwInvalidHookError,
|
|
|
useMutableSource: throwInvalidHookError,
|
|
|
useSyncExternalStore: throwInvalidHookError,
|
|
|
useId: throwInvalidHookError,
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
var HooksDispatcherOnMountInDEV = null;
|
|
|
var HooksDispatcherOnMountWithHookTypesInDEV = null;
|
|
|
var HooksDispatcherOnUpdateInDEV = null;
|
|
|
var HooksDispatcherOnRerenderInDEV = null;
|
|
|
var InvalidNestedHooksDispatcherOnMountInDEV = null;
|
|
|
var InvalidNestedHooksDispatcherOnUpdateInDEV = null;
|
|
|
var InvalidNestedHooksDispatcherOnRerenderInDEV = null;
|
|
|
|
|
|
{
|
|
|
var warnInvalidContextAccess = function () {
|
|
|
error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().');
|
|
|
};
|
|
|
|
|
|
var warnInvalidHookAccess = function () {
|
|
|
error('Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' + 'You can only call Hooks at the top level of your React function. ' + 'For more information, see ' + 'https://reactjs.org/link/rules-of-hooks');
|
|
|
};
|
|
|
|
|
|
HooksDispatcherOnMountInDEV = {
|
|
|
readContext: function (context) {
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
mountHookTypesDev();
|
|
|
checkDepsAreArrayDev(deps);
|
|
|
return mountCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
mountHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
mountHookTypesDev();
|
|
|
checkDepsAreArrayDev(deps);
|
|
|
return mountEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
mountHookTypesDev();
|
|
|
checkDepsAreArrayDev(deps);
|
|
|
return mountImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
mountHookTypesDev();
|
|
|
checkDepsAreArrayDev(deps);
|
|
|
return mountInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
mountHookTypesDev();
|
|
|
checkDepsAreArrayDev(deps);
|
|
|
return mountLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
mountHookTypesDev();
|
|
|
checkDepsAreArrayDev(deps);
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
mountHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
mountHookTypesDev();
|
|
|
return mountRef(initialValue);
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
mountHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
mountHookTypesDev();
|
|
|
return mountDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
mountHookTypesDev();
|
|
|
return mountDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
mountHookTypesDev();
|
|
|
return mountTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
mountHookTypesDev();
|
|
|
return mountMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
mountHookTypesDev();
|
|
|
return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
mountHookTypesDev();
|
|
|
return mountId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
HooksDispatcherOnMountWithHookTypesInDEV = {
|
|
|
readContext: function (context) {
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
updateHookTypesDev();
|
|
|
return mountCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
updateHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
updateHookTypesDev();
|
|
|
return mountEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
updateHookTypesDev();
|
|
|
return mountImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
updateHookTypesDev();
|
|
|
return mountInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
updateHookTypesDev();
|
|
|
return mountLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
updateHookTypesDev();
|
|
|
return mountRef(initialValue);
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
updateHookTypesDev();
|
|
|
return mountDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
updateHookTypesDev();
|
|
|
return mountDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
updateHookTypesDev();
|
|
|
return mountTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
updateHookTypesDev();
|
|
|
return mountMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
updateHookTypesDev();
|
|
|
return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
updateHookTypesDev();
|
|
|
return mountId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
HooksDispatcherOnUpdateInDEV = {
|
|
|
readContext: function (context) {
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
updateHookTypesDev();
|
|
|
return updateCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
updateHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
updateHookTypesDev();
|
|
|
return updateEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
updateHookTypesDev();
|
|
|
return updateImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
updateHookTypesDev();
|
|
|
return updateInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
updateHookTypesDev();
|
|
|
return updateLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
updateHookTypesDev();
|
|
|
return updateRef();
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
updateHookTypesDev();
|
|
|
return updateDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
updateHookTypesDev();
|
|
|
return updateDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
updateHookTypesDev();
|
|
|
return updateTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
updateHookTypesDev();
|
|
|
return updateMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
updateHookTypesDev();
|
|
|
return updateSyncExternalStore(subscribe, getSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
updateHookTypesDev();
|
|
|
return updateId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
HooksDispatcherOnRerenderInDEV = {
|
|
|
readContext: function (context) {
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
updateHookTypesDev();
|
|
|
return updateCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
updateHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
updateHookTypesDev();
|
|
|
return updateEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
updateHookTypesDev();
|
|
|
return updateImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
updateHookTypesDev();
|
|
|
return updateInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
updateHookTypesDev();
|
|
|
return updateLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
|
|
|
|
|
|
try {
|
|
|
return rerenderReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
updateHookTypesDev();
|
|
|
return updateRef();
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV;
|
|
|
|
|
|
try {
|
|
|
return rerenderState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
updateHookTypesDev();
|
|
|
return updateDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
updateHookTypesDev();
|
|
|
return rerenderDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
updateHookTypesDev();
|
|
|
return rerenderTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
updateHookTypesDev();
|
|
|
return updateMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
updateHookTypesDev();
|
|
|
return updateSyncExternalStore(subscribe, getSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
updateHookTypesDev();
|
|
|
return updateId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
InvalidNestedHooksDispatcherOnMountInDEV = {
|
|
|
readContext: function (context) {
|
|
|
warnInvalidContextAccess();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountRef(initialValue);
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV;
|
|
|
|
|
|
try {
|
|
|
return mountState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
warnInvalidHookAccess();
|
|
|
mountHookTypesDev();
|
|
|
return mountId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
InvalidNestedHooksDispatcherOnUpdateInDEV = {
|
|
|
readContext: function (context) {
|
|
|
warnInvalidContextAccess();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateRef();
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateSyncExternalStore(subscribe, getSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
|
|
|
InvalidNestedHooksDispatcherOnRerenderInDEV = {
|
|
|
readContext: function (context) {
|
|
|
warnInvalidContextAccess();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useCallback: function (callback, deps) {
|
|
|
currentHookNameInDev = 'useCallback';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateCallback(callback, deps);
|
|
|
},
|
|
|
useContext: function (context) {
|
|
|
currentHookNameInDev = 'useContext';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return readContext(context);
|
|
|
},
|
|
|
useEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateEffect(create, deps);
|
|
|
},
|
|
|
useImperativeHandle: function (ref, create, deps) {
|
|
|
currentHookNameInDev = 'useImperativeHandle';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateImperativeHandle(ref, create, deps);
|
|
|
},
|
|
|
useInsertionEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useInsertionEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateInsertionEffect(create, deps);
|
|
|
},
|
|
|
useLayoutEffect: function (create, deps) {
|
|
|
currentHookNameInDev = 'useLayoutEffect';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateLayoutEffect(create, deps);
|
|
|
},
|
|
|
useMemo: function (create, deps) {
|
|
|
currentHookNameInDev = 'useMemo';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return updateMemo(create, deps);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useReducer: function (reducer, initialArg, init) {
|
|
|
currentHookNameInDev = 'useReducer';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return rerenderReducer(reducer, initialArg, init);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useRef: function (initialValue) {
|
|
|
currentHookNameInDev = 'useRef';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateRef();
|
|
|
},
|
|
|
useState: function (initialState) {
|
|
|
currentHookNameInDev = 'useState';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
var prevDispatcher = ReactCurrentDispatcher$1.current;
|
|
|
ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV;
|
|
|
|
|
|
try {
|
|
|
return rerenderState(initialState);
|
|
|
} finally {
|
|
|
ReactCurrentDispatcher$1.current = prevDispatcher;
|
|
|
}
|
|
|
},
|
|
|
useDebugValue: function (value, formatterFn) {
|
|
|
currentHookNameInDev = 'useDebugValue';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateDebugValue();
|
|
|
},
|
|
|
useDeferredValue: function (value) {
|
|
|
currentHookNameInDev = 'useDeferredValue';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return rerenderDeferredValue(value);
|
|
|
},
|
|
|
useTransition: function () {
|
|
|
currentHookNameInDev = 'useTransition';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return rerenderTransition();
|
|
|
},
|
|
|
useMutableSource: function (source, getSnapshot, subscribe) {
|
|
|
currentHookNameInDev = 'useMutableSource';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateMutableSource();
|
|
|
},
|
|
|
useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) {
|
|
|
currentHookNameInDev = 'useSyncExternalStore';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateSyncExternalStore(subscribe, getSnapshot);
|
|
|
},
|
|
|
useId: function () {
|
|
|
currentHookNameInDev = 'useId';
|
|
|
warnInvalidHookAccess();
|
|
|
updateHookTypesDev();
|
|
|
return updateId();
|
|
|
},
|
|
|
unstable_isNewReconciler: enableNewReconciler
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var now$1 = Scheduler.unstable_now;
|
|
|
var commitTime = 0;
|
|
|
var layoutEffectStartTime = -1;
|
|
|
var profilerStartTime = -1;
|
|
|
var passiveEffectStartTime = -1;
|
|
|
/**
|
|
|
* Tracks whether the current update was a nested/cascading update (scheduled from a layout effect).
|
|
|
*
|
|
|
* The overall sequence is:
|
|
|
* 1. render
|
|
|
* 2. commit (and call `onRender`, `onCommit`)
|
|
|
* 3. check for nested updates
|
|
|
* 4. flush passive effects (and call `onPostCommit`)
|
|
|
*
|
|
|
* Nested updates are identified in step 3 above,
|
|
|
* but step 4 still applies to the work that was just committed.
|
|
|
* We use two flags to track nested updates then:
|
|
|
* one tracks whether the upcoming update is a nested update,
|
|
|
* and the other tracks whether the current update was a nested update.
|
|
|
* The first value gets synced to the second at the start of the render phase.
|
|
|
*/
|
|
|
|
|
|
var currentUpdateIsNested = false;
|
|
|
var nestedUpdateScheduled = false;
|
|
|
|
|
|
function isCurrentUpdateNested() {
|
|
|
return currentUpdateIsNested;
|
|
|
}
|
|
|
|
|
|
function markNestedUpdateScheduled() {
|
|
|
{
|
|
|
nestedUpdateScheduled = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function resetNestedUpdateFlag() {
|
|
|
{
|
|
|
currentUpdateIsNested = false;
|
|
|
nestedUpdateScheduled = false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function syncNestedUpdateFlag() {
|
|
|
{
|
|
|
currentUpdateIsNested = nestedUpdateScheduled;
|
|
|
nestedUpdateScheduled = false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getCommitTime() {
|
|
|
return commitTime;
|
|
|
}
|
|
|
|
|
|
function recordCommitTime() {
|
|
|
|
|
|
commitTime = now$1();
|
|
|
}
|
|
|
|
|
|
function startProfilerTimer(fiber) {
|
|
|
|
|
|
profilerStartTime = now$1();
|
|
|
|
|
|
if (fiber.actualStartTime < 0) {
|
|
|
fiber.actualStartTime = now$1();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function stopProfilerTimerIfRunning(fiber) {
|
|
|
|
|
|
profilerStartTime = -1;
|
|
|
}
|
|
|
|
|
|
function stopProfilerTimerIfRunningAndRecordDelta(fiber, overrideBaseTime) {
|
|
|
|
|
|
if (profilerStartTime >= 0) {
|
|
|
var elapsedTime = now$1() - profilerStartTime;
|
|
|
fiber.actualDuration += elapsedTime;
|
|
|
|
|
|
if (overrideBaseTime) {
|
|
|
fiber.selfBaseDuration = elapsedTime;
|
|
|
}
|
|
|
|
|
|
profilerStartTime = -1;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function recordLayoutEffectDuration(fiber) {
|
|
|
|
|
|
if (layoutEffectStartTime >= 0) {
|
|
|
var elapsedTime = now$1() - layoutEffectStartTime;
|
|
|
layoutEffectStartTime = -1; // Store duration on the next nearest Profiler ancestor
|
|
|
// Or the root (for the DevTools Profiler to read)
|
|
|
|
|
|
var parentFiber = fiber.return;
|
|
|
|
|
|
while (parentFiber !== null) {
|
|
|
switch (parentFiber.tag) {
|
|
|
case HostRoot:
|
|
|
var root = parentFiber.stateNode;
|
|
|
root.effectDuration += elapsedTime;
|
|
|
return;
|
|
|
|
|
|
case Profiler:
|
|
|
var parentStateNode = parentFiber.stateNode;
|
|
|
parentStateNode.effectDuration += elapsedTime;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
parentFiber = parentFiber.return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function recordPassiveEffectDuration(fiber) {
|
|
|
|
|
|
if (passiveEffectStartTime >= 0) {
|
|
|
var elapsedTime = now$1() - passiveEffectStartTime;
|
|
|
passiveEffectStartTime = -1; // Store duration on the next nearest Profiler ancestor
|
|
|
// Or the root (for the DevTools Profiler to read)
|
|
|
|
|
|
var parentFiber = fiber.return;
|
|
|
|
|
|
while (parentFiber !== null) {
|
|
|
switch (parentFiber.tag) {
|
|
|
case HostRoot:
|
|
|
var root = parentFiber.stateNode;
|
|
|
|
|
|
if (root !== null) {
|
|
|
root.passiveEffectDuration += elapsedTime;
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
|
|
|
case Profiler:
|
|
|
var parentStateNode = parentFiber.stateNode;
|
|
|
|
|
|
if (parentStateNode !== null) {
|
|
|
// Detached fibers have their state node cleared out.
|
|
|
// In this case, the return pointer is also cleared out,
|
|
|
// so we won't be able to report the time spent in this Profiler's subtree.
|
|
|
parentStateNode.passiveEffectDuration += elapsedTime;
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
parentFiber = parentFiber.return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function startLayoutEffectTimer() {
|
|
|
|
|
|
layoutEffectStartTime = now$1();
|
|
|
}
|
|
|
|
|
|
function startPassiveEffectTimer() {
|
|
|
|
|
|
passiveEffectStartTime = now$1();
|
|
|
}
|
|
|
|
|
|
function transferActualDuration(fiber) {
|
|
|
// Transfer time spent rendering these children so we don't lose it
|
|
|
// after we rerender. This is used as a helper in special cases
|
|
|
// where we should count the work of multiple passes.
|
|
|
var child = fiber.child;
|
|
|
|
|
|
while (child) {
|
|
|
fiber.actualDuration += child.actualDuration;
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function createCapturedValueAtFiber(value, source) {
|
|
|
// If the value is an error, call this function immediately after it is thrown
|
|
|
// so the stack is accurate.
|
|
|
return {
|
|
|
value: value,
|
|
|
source: source,
|
|
|
stack: getStackByFiberInDevAndProd(source),
|
|
|
digest: null
|
|
|
};
|
|
|
}
|
|
|
function createCapturedValue(value, digest, stack) {
|
|
|
return {
|
|
|
value: value,
|
|
|
source: null,
|
|
|
stack: stack != null ? stack : null,
|
|
|
digest: digest != null ? digest : null
|
|
|
};
|
|
|
}
|
|
|
|
|
|
// This module is forked in different environments.
|
|
|
// By default, return `true` to log errors to the console.
|
|
|
// Forks can return `false` if this isn't desirable.
|
|
|
function showErrorDialog(boundary, errorInfo) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function logCapturedError(boundary, errorInfo) {
|
|
|
try {
|
|
|
var logError = showErrorDialog(boundary, errorInfo); // Allow injected showErrorDialog() to prevent default console.error logging.
|
|
|
// This enables renderers like ReactNative to better manage redbox behavior.
|
|
|
|
|
|
if (logError === false) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var error = errorInfo.value;
|
|
|
|
|
|
if (true) {
|
|
|
var source = errorInfo.source;
|
|
|
var stack = errorInfo.stack;
|
|
|
var componentStack = stack !== null ? stack : ''; // Browsers support silencing uncaught errors by calling
|
|
|
// `preventDefault()` in window `error` handler.
|
|
|
// We record this information as an expando on the error.
|
|
|
|
|
|
if (error != null && error._suppressLogging) {
|
|
|
if (boundary.tag === ClassComponent) {
|
|
|
// The error is recoverable and was silenced.
|
|
|
// Ignore it and don't print the stack addendum.
|
|
|
// This is handy for testing error boundaries without noise.
|
|
|
return;
|
|
|
} // The error is fatal. Since the silencing might have
|
|
|
// been accidental, we'll surface it anyway.
|
|
|
// However, the browser would have silenced the original error
|
|
|
// so we'll print it first, and then print the stack addendum.
|
|
|
|
|
|
|
|
|
console['error'](error); // Don't transform to our wrapper
|
|
|
// For a more detailed description of this block, see:
|
|
|
// https://github.com/facebook/react/pull/13384
|
|
|
}
|
|
|
|
|
|
var componentName = source ? getComponentNameFromFiber(source) : null;
|
|
|
var componentNameMessage = componentName ? "The above error occurred in the <" + componentName + "> component:" : 'The above error occurred in one of your React components:';
|
|
|
var errorBoundaryMessage;
|
|
|
|
|
|
if (boundary.tag === HostRoot) {
|
|
|
errorBoundaryMessage = 'Consider adding an error boundary to your tree to customize error handling behavior.\n' + 'Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.';
|
|
|
} else {
|
|
|
var errorBoundaryName = getComponentNameFromFiber(boundary) || 'Anonymous';
|
|
|
errorBoundaryMessage = "React will try to recreate this component tree from scratch " + ("using the error boundary you provided, " + errorBoundaryName + ".");
|
|
|
}
|
|
|
|
|
|
var combinedMessage = componentNameMessage + "\n" + componentStack + "\n\n" + ("" + errorBoundaryMessage); // In development, we provide our own message with just the component stack.
|
|
|
// We don't include the original error message and JS stack because the browser
|
|
|
// has already printed it. Even if the application swallows the error, it is still
|
|
|
// displayed by the browser thanks to the DEV-only fake event trick in ReactErrorUtils.
|
|
|
|
|
|
console['error'](combinedMessage); // Don't transform to our wrapper
|
|
|
} else {}
|
|
|
} catch (e) {
|
|
|
// This method must not throw, or React internal state will get messed up.
|
|
|
// If console.error is overridden, or logCapturedError() shows a dialog that throws,
|
|
|
// we want to report this error outside of the normal stack as a last resort.
|
|
|
// https://github.com/facebook/react/issues/13188
|
|
|
setTimeout(function () {
|
|
|
throw e;
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var PossiblyWeakMap$1 = typeof WeakMap === 'function' ? WeakMap : Map;
|
|
|
|
|
|
function createRootErrorUpdate(fiber, errorInfo, lane) {
|
|
|
var update = createUpdate(NoTimestamp, lane); // Unmount the root by rendering null.
|
|
|
|
|
|
update.tag = CaptureUpdate; // Caution: React DevTools currently depends on this property
|
|
|
// being called "element".
|
|
|
|
|
|
update.payload = {
|
|
|
element: null
|
|
|
};
|
|
|
var error = errorInfo.value;
|
|
|
|
|
|
update.callback = function () {
|
|
|
onUncaughtError(error);
|
|
|
logCapturedError(fiber, errorInfo);
|
|
|
};
|
|
|
|
|
|
return update;
|
|
|
}
|
|
|
|
|
|
function createClassErrorUpdate(fiber, errorInfo, lane) {
|
|
|
var update = createUpdate(NoTimestamp, lane);
|
|
|
update.tag = CaptureUpdate;
|
|
|
var getDerivedStateFromError = fiber.type.getDerivedStateFromError;
|
|
|
|
|
|
if (typeof getDerivedStateFromError === 'function') {
|
|
|
var error$1 = errorInfo.value;
|
|
|
|
|
|
update.payload = function () {
|
|
|
return getDerivedStateFromError(error$1);
|
|
|
};
|
|
|
|
|
|
update.callback = function () {
|
|
|
{
|
|
|
markFailedErrorBoundaryForHotReloading(fiber);
|
|
|
}
|
|
|
|
|
|
logCapturedError(fiber, errorInfo);
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var inst = fiber.stateNode;
|
|
|
|
|
|
if (inst !== null && typeof inst.componentDidCatch === 'function') {
|
|
|
update.callback = function callback() {
|
|
|
{
|
|
|
markFailedErrorBoundaryForHotReloading(fiber);
|
|
|
}
|
|
|
|
|
|
logCapturedError(fiber, errorInfo);
|
|
|
|
|
|
if (typeof getDerivedStateFromError !== 'function') {
|
|
|
// To preserve the preexisting retry behavior of error boundaries,
|
|
|
// we keep track of which ones already failed during this batch.
|
|
|
// This gets reset before we yield back to the browser.
|
|
|
// TODO: Warn in strict mode if getDerivedStateFromError is
|
|
|
// not defined.
|
|
|
markLegacyErrorBoundaryAsFailed(this);
|
|
|
}
|
|
|
|
|
|
var error$1 = errorInfo.value;
|
|
|
var stack = errorInfo.stack;
|
|
|
this.componentDidCatch(error$1, {
|
|
|
componentStack: stack !== null ? stack : ''
|
|
|
});
|
|
|
|
|
|
{
|
|
|
if (typeof getDerivedStateFromError !== 'function') {
|
|
|
// If componentDidCatch is the only error boundary method defined,
|
|
|
// then it needs to call setState to recover from errors.
|
|
|
// If no state update is scheduled then the boundary will swallow the error.
|
|
|
if (!includesSomeLane(fiber.lanes, SyncLane)) {
|
|
|
error('%s: Error boundaries should implement getDerivedStateFromError(). ' + 'In that method, return a state update to display an error message or fallback UI.', getComponentNameFromFiber(fiber) || 'Unknown');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
return update;
|
|
|
}
|
|
|
|
|
|
function attachPingListener(root, wakeable, lanes) {
|
|
|
// Attach a ping listener
|
|
|
//
|
|
|
// The data might resolve before we have a chance to commit the fallback. Or,
|
|
|
// in the case of a refresh, we'll never commit a fallback. So we need to
|
|
|
// attach a listener now. When it resolves ("pings"), we can decide whether to
|
|
|
// try rendering the tree again.
|
|
|
//
|
|
|
// Only attach a listener if one does not already exist for the lanes
|
|
|
// we're currently rendering (which acts like a "thread ID" here).
|
|
|
//
|
|
|
// We only need to do this in concurrent mode. Legacy Suspense always
|
|
|
// commits fallbacks synchronously, so there are no pings.
|
|
|
var pingCache = root.pingCache;
|
|
|
var threadIDs;
|
|
|
|
|
|
if (pingCache === null) {
|
|
|
pingCache = root.pingCache = new PossiblyWeakMap$1();
|
|
|
threadIDs = new Set();
|
|
|
pingCache.set(wakeable, threadIDs);
|
|
|
} else {
|
|
|
threadIDs = pingCache.get(wakeable);
|
|
|
|
|
|
if (threadIDs === undefined) {
|
|
|
threadIDs = new Set();
|
|
|
pingCache.set(wakeable, threadIDs);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (!threadIDs.has(lanes)) {
|
|
|
// Memoize using the thread ID to prevent redundant listeners.
|
|
|
threadIDs.add(lanes);
|
|
|
var ping = pingSuspendedRoot.bind(null, root, wakeable, lanes);
|
|
|
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
// If we have pending work still, restore the original updaters
|
|
|
restorePendingUpdaters(root, lanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
wakeable.then(ping, ping);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function attachRetryListener(suspenseBoundary, root, wakeable, lanes) {
|
|
|
// Retry listener
|
|
|
//
|
|
|
// If the fallback does commit, we need to attach a different type of
|
|
|
// listener. This one schedules an update on the Suspense boundary to turn
|
|
|
// the fallback state off.
|
|
|
//
|
|
|
// Stash the wakeable on the boundary fiber so we can access it in the
|
|
|
// commit phase.
|
|
|
//
|
|
|
// When the wakeable resolves, we'll attempt to render the boundary
|
|
|
// again ("retry").
|
|
|
var wakeables = suspenseBoundary.updateQueue;
|
|
|
|
|
|
if (wakeables === null) {
|
|
|
var updateQueue = new Set();
|
|
|
updateQueue.add(wakeable);
|
|
|
suspenseBoundary.updateQueue = updateQueue;
|
|
|
} else {
|
|
|
wakeables.add(wakeable);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function resetSuspendedComponent(sourceFiber, rootRenderLanes) {
|
|
|
// A legacy mode Suspense quirk, only relevant to hook components.
|
|
|
|
|
|
|
|
|
var tag = sourceFiber.tag;
|
|
|
|
|
|
if ((sourceFiber.mode & ConcurrentMode) === NoMode && (tag === FunctionComponent || tag === ForwardRef || tag === SimpleMemoComponent)) {
|
|
|
var currentSource = sourceFiber.alternate;
|
|
|
|
|
|
if (currentSource) {
|
|
|
sourceFiber.updateQueue = currentSource.updateQueue;
|
|
|
sourceFiber.memoizedState = currentSource.memoizedState;
|
|
|
sourceFiber.lanes = currentSource.lanes;
|
|
|
} else {
|
|
|
sourceFiber.updateQueue = null;
|
|
|
sourceFiber.memoizedState = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getNearestSuspenseBoundaryToCapture(returnFiber) {
|
|
|
var node = returnFiber;
|
|
|
|
|
|
do {
|
|
|
if (node.tag === SuspenseComponent && shouldCaptureSuspense(node)) {
|
|
|
return node;
|
|
|
} // This boundary already captured during this render. Continue to the next
|
|
|
// boundary.
|
|
|
|
|
|
|
|
|
node = node.return;
|
|
|
} while (node !== null);
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function markSuspenseBoundaryShouldCapture(suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes) {
|
|
|
// This marks a Suspense boundary so that when we're unwinding the stack,
|
|
|
// it captures the suspended "exception" and does a second (fallback) pass.
|
|
|
if ((suspenseBoundary.mode & ConcurrentMode) === NoMode) {
|
|
|
// Legacy Mode Suspense
|
|
|
//
|
|
|
// If the boundary is in legacy mode, we should *not*
|
|
|
// suspend the commit. Pretend as if the suspended component rendered
|
|
|
// null and keep rendering. When the Suspense boundary completes,
|
|
|
// we'll do a second pass to render the fallback.
|
|
|
if (suspenseBoundary === returnFiber) {
|
|
|
// Special case where we suspended while reconciling the children of
|
|
|
// a Suspense boundary's inner Offscreen wrapper fiber. This happens
|
|
|
// when a React.lazy component is a direct child of a
|
|
|
// Suspense boundary.
|
|
|
//
|
|
|
// Suspense boundaries are implemented as multiple fibers, but they
|
|
|
// are a single conceptual unit. The legacy mode behavior where we
|
|
|
// pretend the suspended fiber committed as `null` won't work,
|
|
|
// because in this case the "suspended" fiber is the inner
|
|
|
// Offscreen wrapper.
|
|
|
//
|
|
|
// Because the contents of the boundary haven't started rendering
|
|
|
// yet (i.e. nothing in the tree has partially rendered) we can
|
|
|
// switch to the regular, concurrent mode behavior: mark the
|
|
|
// boundary with ShouldCapture and enter the unwind phase.
|
|
|
suspenseBoundary.flags |= ShouldCapture;
|
|
|
} else {
|
|
|
suspenseBoundary.flags |= DidCapture;
|
|
|
sourceFiber.flags |= ForceUpdateForLegacySuspense; // We're going to commit this fiber even though it didn't complete.
|
|
|
// But we shouldn't call any lifecycle methods or callbacks. Remove
|
|
|
// all lifecycle effect tags.
|
|
|
|
|
|
sourceFiber.flags &= ~(LifecycleEffectMask | Incomplete);
|
|
|
|
|
|
if (sourceFiber.tag === ClassComponent) {
|
|
|
var currentSourceFiber = sourceFiber.alternate;
|
|
|
|
|
|
if (currentSourceFiber === null) {
|
|
|
// This is a new mount. Change the tag so it's not mistaken for a
|
|
|
// completed class component. For example, we should not call
|
|
|
// componentWillUnmount if it is deleted.
|
|
|
sourceFiber.tag = IncompleteClassComponent;
|
|
|
} else {
|
|
|
// When we try rendering again, we should not reuse the current fiber,
|
|
|
// since it's known to be in an inconsistent state. Use a force update to
|
|
|
// prevent a bail out.
|
|
|
var update = createUpdate(NoTimestamp, SyncLane);
|
|
|
update.tag = ForceUpdate;
|
|
|
enqueueUpdate(sourceFiber, update, SyncLane);
|
|
|
}
|
|
|
} // The source fiber did not complete. Mark it with Sync priority to
|
|
|
// indicate that it still has pending work.
|
|
|
|
|
|
|
|
|
sourceFiber.lanes = mergeLanes(sourceFiber.lanes, SyncLane);
|
|
|
}
|
|
|
|
|
|
return suspenseBoundary;
|
|
|
} // Confirmed that the boundary is in a concurrent mode tree. Continue
|
|
|
// with the normal suspend path.
|
|
|
//
|
|
|
// After this we'll use a set of heuristics to determine whether this
|
|
|
// render pass will run to completion or restart or "suspend" the commit.
|
|
|
// The actual logic for this is spread out in different places.
|
|
|
//
|
|
|
// This first principle is that if we're going to suspend when we complete
|
|
|
// a root, then we should also restart if we get an update or ping that
|
|
|
// might unsuspend it, and vice versa. The only reason to suspend is
|
|
|
// because you think you might want to restart before committing. However,
|
|
|
// it doesn't make sense to restart only while in the period we're suspended.
|
|
|
//
|
|
|
// Restarting too aggressively is also not good because it starves out any
|
|
|
// intermediate loading state. So we use heuristics to determine when.
|
|
|
// Suspense Heuristics
|
|
|
//
|
|
|
// If nothing threw a Promise or all the same fallbacks are already showing,
|
|
|
// then don't suspend/restart.
|
|
|
//
|
|
|
// If this is an initial render of a new tree of Suspense boundaries and
|
|
|
// those trigger a fallback, then don't suspend/restart. We want to ensure
|
|
|
// that we can show the initial loading state as quickly as possible.
|
|
|
//
|
|
|
// If we hit a "Delayed" case, such as when we'd switch from content back into
|
|
|
// a fallback, then we should always suspend/restart. Transitions apply
|
|
|
// to this case. If none is defined, JND is used instead.
|
|
|
//
|
|
|
// If we're already showing a fallback and it gets "retried", allowing us to show
|
|
|
// another level, but there's still an inner boundary that would show a fallback,
|
|
|
// then we suspend/restart for 500ms since the last time we showed a fallback
|
|
|
// anywhere in the tree. This effectively throttles progressive loading into a
|
|
|
// consistent train of commits. This also gives us an opportunity to restart to
|
|
|
// get to the completed state slightly earlier.
|
|
|
//
|
|
|
// If there's ambiguity due to batching it's resolved in preference of:
|
|
|
// 1) "delayed", 2) "initial render", 3) "retry".
|
|
|
//
|
|
|
// We want to ensure that a "busy" state doesn't get force committed. We want to
|
|
|
// ensure that new initial loading states can commit as soon as possible.
|
|
|
|
|
|
|
|
|
suspenseBoundary.flags |= ShouldCapture; // TODO: I think we can remove this, since we now use `DidCapture` in
|
|
|
// the begin phase to prevent an early bailout.
|
|
|
|
|
|
suspenseBoundary.lanes = rootRenderLanes;
|
|
|
return suspenseBoundary;
|
|
|
}
|
|
|
|
|
|
function throwException(root, returnFiber, sourceFiber, value, rootRenderLanes) {
|
|
|
// The source fiber did not complete.
|
|
|
sourceFiber.flags |= Incomplete;
|
|
|
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
// If we have pending work still, restore the original updaters
|
|
|
restorePendingUpdaters(root, rootRenderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (value !== null && typeof value === 'object' && typeof value.then === 'function') {
|
|
|
// This is a wakeable. The component suspended.
|
|
|
var wakeable = value;
|
|
|
resetSuspendedComponent(sourceFiber);
|
|
|
|
|
|
{
|
|
|
if (getIsHydrating() && sourceFiber.mode & ConcurrentMode) {
|
|
|
markDidThrowWhileHydratingDEV();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
|
|
|
var suspenseBoundary = getNearestSuspenseBoundaryToCapture(returnFiber);
|
|
|
|
|
|
if (suspenseBoundary !== null) {
|
|
|
suspenseBoundary.flags &= ~ForceClientRender;
|
|
|
markSuspenseBoundaryShouldCapture(suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes); // We only attach ping listeners in concurrent mode. Legacy Suspense always
|
|
|
// commits fallbacks synchronously, so there are no pings.
|
|
|
|
|
|
if (suspenseBoundary.mode & ConcurrentMode) {
|
|
|
attachPingListener(root, wakeable, rootRenderLanes);
|
|
|
}
|
|
|
|
|
|
attachRetryListener(suspenseBoundary, root, wakeable);
|
|
|
return;
|
|
|
} else {
|
|
|
// No boundary was found. Unless this is a sync update, this is OK.
|
|
|
// We can suspend and wait for more data to arrive.
|
|
|
if (!includesSyncLane(rootRenderLanes)) {
|
|
|
// This is not a sync update. Suspend. Since we're not activating a
|
|
|
// Suspense boundary, this will unwind all the way to the root without
|
|
|
// performing a second pass to render a fallback. (This is arguably how
|
|
|
// refresh transitions should work, too, since we're not going to commit
|
|
|
// the fallbacks anyway.)
|
|
|
//
|
|
|
// This case also applies to initial hydration.
|
|
|
attachPingListener(root, wakeable, rootRenderLanes);
|
|
|
renderDidSuspendDelayIfPossible();
|
|
|
return;
|
|
|
} // This is a sync/discrete update. We treat this case like an error
|
|
|
// because discrete renders are expected to produce a complete tree
|
|
|
// synchronously to maintain consistency with external state.
|
|
|
|
|
|
|
|
|
var uncaughtSuspenseError = new Error('A component suspended while responding to synchronous input. This ' + 'will cause the UI to be replaced with a loading indicator. To ' + 'fix, updates that suspend should be wrapped ' + 'with startTransition.'); // If we're outside a transition, fall through to the regular error path.
|
|
|
// The error will be caught by the nearest suspense boundary.
|
|
|
|
|
|
value = uncaughtSuspenseError;
|
|
|
}
|
|
|
} else {
|
|
|
// This is a regular error, not a Suspense wakeable.
|
|
|
if (getIsHydrating() && sourceFiber.mode & ConcurrentMode) {
|
|
|
markDidThrowWhileHydratingDEV();
|
|
|
|
|
|
var _suspenseBoundary = getNearestSuspenseBoundaryToCapture(returnFiber); // If the error was thrown during hydration, we may be able to recover by
|
|
|
// discarding the dehydrated content and switching to a client render.
|
|
|
// Instead of surfacing the error, find the nearest Suspense boundary
|
|
|
// and render it again without hydration.
|
|
|
|
|
|
|
|
|
if (_suspenseBoundary !== null) {
|
|
|
if ((_suspenseBoundary.flags & ShouldCapture) === NoFlags) {
|
|
|
// Set a flag to indicate that we should try rendering the normal
|
|
|
// children again, not the fallback.
|
|
|
_suspenseBoundary.flags |= ForceClientRender;
|
|
|
}
|
|
|
|
|
|
markSuspenseBoundaryShouldCapture(_suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes); // Even though the user may not be affected by this error, we should
|
|
|
// still log it so it can be fixed.
|
|
|
|
|
|
queueHydrationError(createCapturedValueAtFiber(value, sourceFiber));
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
value = createCapturedValueAtFiber(value, sourceFiber);
|
|
|
renderDidError(value); // We didn't find a boundary that could handle this type of exception. Start
|
|
|
// over and traverse parent path again, this time treating the exception
|
|
|
// as an error.
|
|
|
|
|
|
var workInProgress = returnFiber;
|
|
|
|
|
|
do {
|
|
|
switch (workInProgress.tag) {
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var _errorInfo = value;
|
|
|
workInProgress.flags |= ShouldCapture;
|
|
|
var lane = pickArbitraryLane(rootRenderLanes);
|
|
|
workInProgress.lanes = mergeLanes(workInProgress.lanes, lane);
|
|
|
var update = createRootErrorUpdate(workInProgress, _errorInfo, lane);
|
|
|
enqueueCapturedUpdate(workInProgress, update);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
// Capture and retry
|
|
|
var errorInfo = value;
|
|
|
var ctor = workInProgress.type;
|
|
|
var instance = workInProgress.stateNode;
|
|
|
|
|
|
if ((workInProgress.flags & DidCapture) === NoFlags && (typeof ctor.getDerivedStateFromError === 'function' || instance !== null && typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance))) {
|
|
|
workInProgress.flags |= ShouldCapture;
|
|
|
|
|
|
var _lane = pickArbitraryLane(rootRenderLanes);
|
|
|
|
|
|
workInProgress.lanes = mergeLanes(workInProgress.lanes, _lane); // Schedule the error boundary to re-render using updated state
|
|
|
|
|
|
var _update = createClassErrorUpdate(workInProgress, errorInfo, _lane);
|
|
|
|
|
|
enqueueCapturedUpdate(workInProgress, _update);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
workInProgress = workInProgress.return;
|
|
|
} while (workInProgress !== null);
|
|
|
}
|
|
|
|
|
|
function getSuspendedCache() {
|
|
|
{
|
|
|
return null;
|
|
|
} // This function is called when a Suspense boundary suspends. It returns the
|
|
|
}
|
|
|
|
|
|
var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
|
|
|
var didReceiveUpdate = false;
|
|
|
var didWarnAboutBadClass;
|
|
|
var didWarnAboutModulePatternComponent;
|
|
|
var didWarnAboutContextTypeOnFunctionComponent;
|
|
|
var didWarnAboutGetDerivedStateOnFunctionComponent;
|
|
|
var didWarnAboutFunctionRefs;
|
|
|
var didWarnAboutReassigningProps;
|
|
|
var didWarnAboutRevealOrder;
|
|
|
var didWarnAboutTailOptions;
|
|
|
|
|
|
{
|
|
|
didWarnAboutBadClass = {};
|
|
|
didWarnAboutModulePatternComponent = {};
|
|
|
didWarnAboutContextTypeOnFunctionComponent = {};
|
|
|
didWarnAboutGetDerivedStateOnFunctionComponent = {};
|
|
|
didWarnAboutFunctionRefs = {};
|
|
|
didWarnAboutReassigningProps = false;
|
|
|
didWarnAboutRevealOrder = {};
|
|
|
didWarnAboutTailOptions = {};
|
|
|
}
|
|
|
|
|
|
function reconcileChildren(current, workInProgress, nextChildren, renderLanes) {
|
|
|
if (current === null) {
|
|
|
// If this is a fresh new component that hasn't been rendered yet, we
|
|
|
// won't update its child set by applying minimal side-effects. Instead,
|
|
|
// we will add them all to the child before it gets rendered. That means
|
|
|
// we can optimize this reconciliation pass by not tracking side-effects.
|
|
|
workInProgress.child = mountChildFibers(workInProgress, null, nextChildren, renderLanes);
|
|
|
} else {
|
|
|
// If the current child is the same as the work in progress, it means that
|
|
|
// we haven't yet started any work on these children. Therefore, we use
|
|
|
// the clone algorithm to create a copy of all the current children.
|
|
|
// If we had any progressed work already, that is invalid at this point so
|
|
|
// let's throw it out.
|
|
|
workInProgress.child = reconcileChildFibers(workInProgress, current.child, nextChildren, renderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes) {
|
|
|
// This function is fork of reconcileChildren. It's used in cases where we
|
|
|
// want to reconcile without matching against the existing set. This has the
|
|
|
// effect of all current children being unmounted; even if the type and key
|
|
|
// are the same, the old child is unmounted and a new child is created.
|
|
|
//
|
|
|
// To do this, we're going to go through the reconcile algorithm twice. In
|
|
|
// the first pass, we schedule a deletion for all the current children by
|
|
|
// passing null.
|
|
|
workInProgress.child = reconcileChildFibers(workInProgress, current.child, null, renderLanes); // In the second pass, we mount the new children. The trick here is that we
|
|
|
// pass null in place of where we usually pass the current child set. This has
|
|
|
// the effect of remounting all children regardless of whether their
|
|
|
// identities match.
|
|
|
|
|
|
workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes);
|
|
|
}
|
|
|
|
|
|
function updateForwardRef(current, workInProgress, Component, nextProps, renderLanes) {
|
|
|
// TODO: current can be non-null here even if the component
|
|
|
// hasn't yet mounted. This happens after the first render suspends.
|
|
|
// We'll need to figure out if this is fine or can cause issues.
|
|
|
{
|
|
|
if (workInProgress.type !== workInProgress.elementType) {
|
|
|
// Lazy component props can't be validated in createElement
|
|
|
// because they're only guaranteed to be resolved here.
|
|
|
var innerPropTypes = Component.propTypes;
|
|
|
|
|
|
if (innerPropTypes) {
|
|
|
checkPropTypes(innerPropTypes, nextProps, // Resolved props
|
|
|
'prop', getComponentNameFromType(Component));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var render = Component.render;
|
|
|
var ref = workInProgress.ref; // The rest is a fork of updateFunctionComponent
|
|
|
|
|
|
var nextChildren;
|
|
|
var hasId;
|
|
|
prepareToReadContext(workInProgress, renderLanes);
|
|
|
|
|
|
{
|
|
|
markComponentRenderStarted(workInProgress);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
ReactCurrentOwner$1.current = workInProgress;
|
|
|
setIsRendering(true);
|
|
|
nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes);
|
|
|
hasId = checkDidRenderIdHook();
|
|
|
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes);
|
|
|
hasId = checkDidRenderIdHook();
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
setIsRendering(false);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markComponentRenderStopped();
|
|
|
}
|
|
|
|
|
|
if (current !== null && !didReceiveUpdate) {
|
|
|
bailoutHooks(current, workInProgress, renderLanes);
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating() && hasId) {
|
|
|
pushMaterializedTreeId(workInProgress);
|
|
|
} // React DevTools reads this flag.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= PerformedWork;
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updateMemoComponent(current, workInProgress, Component, nextProps, renderLanes) {
|
|
|
if (current === null) {
|
|
|
var type = Component.type;
|
|
|
|
|
|
if (isSimpleFunctionComponent(type) && Component.compare === null && // SimpleMemoComponent codepath doesn't resolve outer props either.
|
|
|
Component.defaultProps === undefined) {
|
|
|
var resolvedType = type;
|
|
|
|
|
|
{
|
|
|
resolvedType = resolveFunctionForHotReloading(type);
|
|
|
} // If this is a plain function component without default props,
|
|
|
// and with only the default shallow comparison, we upgrade it
|
|
|
// to a SimpleMemoComponent to allow fast path updates.
|
|
|
|
|
|
|
|
|
workInProgress.tag = SimpleMemoComponent;
|
|
|
workInProgress.type = resolvedType;
|
|
|
|
|
|
{
|
|
|
validateFunctionComponentInDev(workInProgress, type);
|
|
|
}
|
|
|
|
|
|
return updateSimpleMemoComponent(current, workInProgress, resolvedType, nextProps, renderLanes);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var innerPropTypes = type.propTypes;
|
|
|
|
|
|
if (innerPropTypes) {
|
|
|
// Inner memo component props aren't currently validated in createElement.
|
|
|
// We could move it there, but we'd still need this for lazy code path.
|
|
|
checkPropTypes(innerPropTypes, nextProps, // Resolved props
|
|
|
'prop', getComponentNameFromType(type));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var child = createFiberFromTypeAndProps(Component.type, null, nextProps, workInProgress, workInProgress.mode, renderLanes);
|
|
|
child.ref = workInProgress.ref;
|
|
|
child.return = workInProgress;
|
|
|
workInProgress.child = child;
|
|
|
return child;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var _type = Component.type;
|
|
|
var _innerPropTypes = _type.propTypes;
|
|
|
|
|
|
if (_innerPropTypes) {
|
|
|
// Inner memo component props aren't currently validated in createElement.
|
|
|
// We could move it there, but we'd still need this for lazy code path.
|
|
|
checkPropTypes(_innerPropTypes, nextProps, // Resolved props
|
|
|
'prop', getComponentNameFromType(_type));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var currentChild = current.child; // This is always exactly one child
|
|
|
|
|
|
var hasScheduledUpdateOrContext = checkScheduledUpdateOrContext(current, renderLanes);
|
|
|
|
|
|
if (!hasScheduledUpdateOrContext) {
|
|
|
// This will be the props with resolved defaultProps,
|
|
|
// unlike current.memoizedProps which will be the unresolved ones.
|
|
|
var prevProps = currentChild.memoizedProps; // Default to shallow comparison
|
|
|
|
|
|
var compare = Component.compare;
|
|
|
compare = compare !== null ? compare : shallowEqual;
|
|
|
|
|
|
if (compare(prevProps, nextProps) && current.ref === workInProgress.ref) {
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
} // React DevTools reads this flag.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= PerformedWork;
|
|
|
var newChild = createWorkInProgress(currentChild, nextProps);
|
|
|
newChild.ref = workInProgress.ref;
|
|
|
newChild.return = workInProgress;
|
|
|
workInProgress.child = newChild;
|
|
|
return newChild;
|
|
|
}
|
|
|
|
|
|
function updateSimpleMemoComponent(current, workInProgress, Component, nextProps, renderLanes) {
|
|
|
// TODO: current can be non-null here even if the component
|
|
|
// hasn't yet mounted. This happens when the inner render suspends.
|
|
|
// We'll need to figure out if this is fine or can cause issues.
|
|
|
{
|
|
|
if (workInProgress.type !== workInProgress.elementType) {
|
|
|
// Lazy component props can't be validated in createElement
|
|
|
// because they're only guaranteed to be resolved here.
|
|
|
var outerMemoType = workInProgress.elementType;
|
|
|
|
|
|
if (outerMemoType.$$typeof === REACT_LAZY_TYPE) {
|
|
|
// We warn when you define propTypes on lazy()
|
|
|
// so let's just skip over it to find memo() outer wrapper.
|
|
|
// Inner props for memo are validated later.
|
|
|
var lazyComponent = outerMemoType;
|
|
|
var payload = lazyComponent._payload;
|
|
|
var init = lazyComponent._init;
|
|
|
|
|
|
try {
|
|
|
outerMemoType = init(payload);
|
|
|
} catch (x) {
|
|
|
outerMemoType = null;
|
|
|
} // Inner propTypes will be validated in the function component path.
|
|
|
|
|
|
|
|
|
var outerPropTypes = outerMemoType && outerMemoType.propTypes;
|
|
|
|
|
|
if (outerPropTypes) {
|
|
|
checkPropTypes(outerPropTypes, nextProps, // Resolved (SimpleMemoComponent has no defaultProps)
|
|
|
'prop', getComponentNameFromType(outerMemoType));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (current !== null) {
|
|
|
var prevProps = current.memoizedProps;
|
|
|
|
|
|
if (shallowEqual(prevProps, nextProps) && current.ref === workInProgress.ref && ( // Prevent bailout if the implementation changed due to hot reload.
|
|
|
workInProgress.type === current.type )) {
|
|
|
didReceiveUpdate = false; // The props are shallowly equal. Reuse the previous props object, like we
|
|
|
// would during a normal fiber bailout.
|
|
|
//
|
|
|
// We don't have strong guarantees that the props object is referentially
|
|
|
// equal during updates where we can't bail out anyway — like if the props
|
|
|
// are shallowly equal, but there's a local state or context update in the
|
|
|
// same batch.
|
|
|
//
|
|
|
// However, as a principle, we should aim to make the behavior consistent
|
|
|
// across different ways of memoizing a component. For example, React.memo
|
|
|
// has a different internal Fiber layout if you pass a normal function
|
|
|
// component (SimpleMemoComponent) versus if you pass a different type
|
|
|
// like forwardRef (MemoComponent). But this is an implementation detail.
|
|
|
// Wrapping a component in forwardRef (or React.lazy, etc) shouldn't
|
|
|
// affect whether the props object is reused during a bailout.
|
|
|
|
|
|
workInProgress.pendingProps = nextProps = prevProps;
|
|
|
|
|
|
if (!checkScheduledUpdateOrContext(current, renderLanes)) {
|
|
|
// The pending lanes were cleared at the beginning of beginWork. We're
|
|
|
// about to bail out, but there might be other lanes that weren't
|
|
|
// included in the current render. Usually, the priority level of the
|
|
|
// remaining updates is accumulated during the evaluation of the
|
|
|
// component (i.e. when processing the update queue). But since since
|
|
|
// we're bailing out early *without* evaluating the component, we need
|
|
|
// to account for it here, too. Reset to the value of the current fiber.
|
|
|
// NOTE: This only applies to SimpleMemoComponent, not MemoComponent,
|
|
|
// because a MemoComponent fiber does not have hooks or an update queue;
|
|
|
// rather, it wraps around an inner component, which may or may not
|
|
|
// contains hooks.
|
|
|
// TODO: Move the reset at in beginWork out of the common path so that
|
|
|
// this is no longer necessary.
|
|
|
workInProgress.lanes = current.lanes;
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
} else if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) {
|
|
|
// This is a special case that only exists for legacy mode.
|
|
|
// See https://github.com/facebook/react/pull/19216.
|
|
|
didReceiveUpdate = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes);
|
|
|
}
|
|
|
|
|
|
function updateOffscreenComponent(current, workInProgress, renderLanes) {
|
|
|
var nextProps = workInProgress.pendingProps;
|
|
|
var nextChildren = nextProps.children;
|
|
|
var prevState = current !== null ? current.memoizedState : null;
|
|
|
|
|
|
if (nextProps.mode === 'hidden' || enableLegacyHidden ) {
|
|
|
// Rendering a hidden tree.
|
|
|
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
// In legacy sync mode, don't defer the subtree. Render it now.
|
|
|
// TODO: Consider how Offscreen should work with transitions in the future
|
|
|
var nextState = {
|
|
|
baseLanes: NoLanes,
|
|
|
cachePool: null,
|
|
|
transitions: null
|
|
|
};
|
|
|
workInProgress.memoizedState = nextState;
|
|
|
|
|
|
pushRenderLanes(workInProgress, renderLanes);
|
|
|
} else if (!includesSomeLane(renderLanes, OffscreenLane)) {
|
|
|
var spawnedCachePool = null; // We're hidden, and we're not rendering at Offscreen. We will bail out
|
|
|
// and resume this tree later.
|
|
|
|
|
|
var nextBaseLanes;
|
|
|
|
|
|
if (prevState !== null) {
|
|
|
var prevBaseLanes = prevState.baseLanes;
|
|
|
nextBaseLanes = mergeLanes(prevBaseLanes, renderLanes);
|
|
|
} else {
|
|
|
nextBaseLanes = renderLanes;
|
|
|
} // Schedule this fiber to re-render at offscreen priority. Then bailout.
|
|
|
|
|
|
|
|
|
workInProgress.lanes = workInProgress.childLanes = laneToLanes(OffscreenLane);
|
|
|
var _nextState = {
|
|
|
baseLanes: nextBaseLanes,
|
|
|
cachePool: spawnedCachePool,
|
|
|
transitions: null
|
|
|
};
|
|
|
workInProgress.memoizedState = _nextState;
|
|
|
workInProgress.updateQueue = null;
|
|
|
// to avoid a push/pop misalignment.
|
|
|
|
|
|
|
|
|
pushRenderLanes(workInProgress, nextBaseLanes);
|
|
|
|
|
|
return null;
|
|
|
} else {
|
|
|
// This is the second render. The surrounding visible content has already
|
|
|
// committed. Now we resume rendering the hidden tree.
|
|
|
// Rendering at offscreen, so we can clear the base lanes.
|
|
|
var _nextState2 = {
|
|
|
baseLanes: NoLanes,
|
|
|
cachePool: null,
|
|
|
transitions: null
|
|
|
};
|
|
|
workInProgress.memoizedState = _nextState2; // Push the lanes that were skipped when we bailed out.
|
|
|
|
|
|
var subtreeRenderLanes = prevState !== null ? prevState.baseLanes : renderLanes;
|
|
|
|
|
|
pushRenderLanes(workInProgress, subtreeRenderLanes);
|
|
|
}
|
|
|
} else {
|
|
|
// Rendering a visible tree.
|
|
|
var _subtreeRenderLanes;
|
|
|
|
|
|
if (prevState !== null) {
|
|
|
// We're going from hidden -> visible.
|
|
|
_subtreeRenderLanes = mergeLanes(prevState.baseLanes, renderLanes);
|
|
|
|
|
|
workInProgress.memoizedState = null;
|
|
|
} else {
|
|
|
// We weren't previously hidden, and we still aren't, so there's nothing
|
|
|
// special to do. Need to push to the stack regardless, though, to avoid
|
|
|
// a push/pop misalignment.
|
|
|
_subtreeRenderLanes = renderLanes;
|
|
|
}
|
|
|
|
|
|
pushRenderLanes(workInProgress, _subtreeRenderLanes);
|
|
|
}
|
|
|
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
} // Note: These happen to have identical begin phases, for now. We shouldn't hold
|
|
|
|
|
|
function updateFragment(current, workInProgress, renderLanes) {
|
|
|
var nextChildren = workInProgress.pendingProps;
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updateMode(current, workInProgress, renderLanes) {
|
|
|
var nextChildren = workInProgress.pendingProps.children;
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updateProfiler(current, workInProgress, renderLanes) {
|
|
|
{
|
|
|
workInProgress.flags |= Update;
|
|
|
|
|
|
{
|
|
|
// Reset effect durations for the next eventual effect phase.
|
|
|
// These are reset during render to allow the DevTools commit hook a chance to read them,
|
|
|
var stateNode = workInProgress.stateNode;
|
|
|
stateNode.effectDuration = 0;
|
|
|
stateNode.passiveEffectDuration = 0;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var nextProps = workInProgress.pendingProps;
|
|
|
var nextChildren = nextProps.children;
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function markRef(current, workInProgress) {
|
|
|
var ref = workInProgress.ref;
|
|
|
|
|
|
if (current === null && ref !== null || current !== null && current.ref !== ref) {
|
|
|
// Schedule a Ref effect
|
|
|
workInProgress.flags |= Ref;
|
|
|
|
|
|
{
|
|
|
workInProgress.flags |= RefStatic;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes) {
|
|
|
{
|
|
|
if (workInProgress.type !== workInProgress.elementType) {
|
|
|
// Lazy component props can't be validated in createElement
|
|
|
// because they're only guaranteed to be resolved here.
|
|
|
var innerPropTypes = Component.propTypes;
|
|
|
|
|
|
if (innerPropTypes) {
|
|
|
checkPropTypes(innerPropTypes, nextProps, // Resolved props
|
|
|
'prop', getComponentNameFromType(Component));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var context;
|
|
|
|
|
|
{
|
|
|
var unmaskedContext = getUnmaskedContext(workInProgress, Component, true);
|
|
|
context = getMaskedContext(workInProgress, unmaskedContext);
|
|
|
}
|
|
|
|
|
|
var nextChildren;
|
|
|
var hasId;
|
|
|
prepareToReadContext(workInProgress, renderLanes);
|
|
|
|
|
|
{
|
|
|
markComponentRenderStarted(workInProgress);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
ReactCurrentOwner$1.current = workInProgress;
|
|
|
setIsRendering(true);
|
|
|
nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
|
|
|
hasId = checkDidRenderIdHook();
|
|
|
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes);
|
|
|
hasId = checkDidRenderIdHook();
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
setIsRendering(false);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markComponentRenderStopped();
|
|
|
}
|
|
|
|
|
|
if (current !== null && !didReceiveUpdate) {
|
|
|
bailoutHooks(current, workInProgress, renderLanes);
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating() && hasId) {
|
|
|
pushMaterializedTreeId(workInProgress);
|
|
|
} // React DevTools reads this flag.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= PerformedWork;
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updateClassComponent(current, workInProgress, Component, nextProps, renderLanes) {
|
|
|
{
|
|
|
// This is used by DevTools to force a boundary to error.
|
|
|
switch (shouldError(workInProgress)) {
|
|
|
case false:
|
|
|
{
|
|
|
var _instance = workInProgress.stateNode;
|
|
|
var ctor = workInProgress.type; // TODO This way of resetting the error boundary state is a hack.
|
|
|
// Is there a better way to do this?
|
|
|
|
|
|
var tempInstance = new ctor(workInProgress.memoizedProps, _instance.context);
|
|
|
var state = tempInstance.state;
|
|
|
|
|
|
_instance.updater.enqueueSetState(_instance, state, null);
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case true:
|
|
|
{
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
workInProgress.flags |= ShouldCapture; // eslint-disable-next-line react-internal/prod-error-codes
|
|
|
|
|
|
var error$1 = new Error('Simulated error coming from DevTools');
|
|
|
var lane = pickArbitraryLane(renderLanes);
|
|
|
workInProgress.lanes = mergeLanes(workInProgress.lanes, lane); // Schedule the error boundary to re-render using updated state
|
|
|
|
|
|
var update = createClassErrorUpdate(workInProgress, createCapturedValueAtFiber(error$1, workInProgress), lane);
|
|
|
enqueueCapturedUpdate(workInProgress, update);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (workInProgress.type !== workInProgress.elementType) {
|
|
|
// Lazy component props can't be validated in createElement
|
|
|
// because they're only guaranteed to be resolved here.
|
|
|
var innerPropTypes = Component.propTypes;
|
|
|
|
|
|
if (innerPropTypes) {
|
|
|
checkPropTypes(innerPropTypes, nextProps, // Resolved props
|
|
|
'prop', getComponentNameFromType(Component));
|
|
|
}
|
|
|
}
|
|
|
} // Push context providers early to prevent context stack mismatches.
|
|
|
// During mounting we don't know the child context yet as the instance doesn't exist.
|
|
|
// We will invalidate the child context in finishClassComponent() right after rendering.
|
|
|
|
|
|
|
|
|
var hasContext;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
hasContext = true;
|
|
|
pushContextProvider(workInProgress);
|
|
|
} else {
|
|
|
hasContext = false;
|
|
|
}
|
|
|
|
|
|
prepareToReadContext(workInProgress, renderLanes);
|
|
|
var instance = workInProgress.stateNode;
|
|
|
var shouldUpdate;
|
|
|
|
|
|
if (instance === null) {
|
|
|
resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress); // In the initial pass we might need to construct the instance.
|
|
|
|
|
|
constructClassInstance(workInProgress, Component, nextProps);
|
|
|
mountClassInstance(workInProgress, Component, nextProps, renderLanes);
|
|
|
shouldUpdate = true;
|
|
|
} else if (current === null) {
|
|
|
// In a resume, we'll already have an instance we can reuse.
|
|
|
shouldUpdate = resumeMountClassInstance(workInProgress, Component, nextProps, renderLanes);
|
|
|
} else {
|
|
|
shouldUpdate = updateClassInstance(current, workInProgress, Component, nextProps, renderLanes);
|
|
|
}
|
|
|
|
|
|
var nextUnitOfWork = finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes);
|
|
|
|
|
|
{
|
|
|
var inst = workInProgress.stateNode;
|
|
|
|
|
|
if (shouldUpdate && inst.props !== nextProps) {
|
|
|
if (!didWarnAboutReassigningProps) {
|
|
|
error('It looks like %s is reassigning its own `this.props` while rendering. ' + 'This is not supported and can lead to confusing bugs.', getComponentNameFromFiber(workInProgress) || 'a component');
|
|
|
}
|
|
|
|
|
|
didWarnAboutReassigningProps = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return nextUnitOfWork;
|
|
|
}
|
|
|
|
|
|
function finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes) {
|
|
|
// Refs should update even if shouldComponentUpdate returns false
|
|
|
markRef(current, workInProgress);
|
|
|
var didCaptureError = (workInProgress.flags & DidCapture) !== NoFlags;
|
|
|
|
|
|
if (!shouldUpdate && !didCaptureError) {
|
|
|
// Context providers should defer to sCU for rendering
|
|
|
if (hasContext) {
|
|
|
invalidateContextProvider(workInProgress, Component, false);
|
|
|
}
|
|
|
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
var instance = workInProgress.stateNode; // Rerender
|
|
|
|
|
|
ReactCurrentOwner$1.current = workInProgress;
|
|
|
var nextChildren;
|
|
|
|
|
|
if (didCaptureError && typeof Component.getDerivedStateFromError !== 'function') {
|
|
|
// If we captured an error, but getDerivedStateFromError is not defined,
|
|
|
// unmount all the children. componentDidCatch will schedule an update to
|
|
|
// re-render a fallback. This is temporary until we migrate everyone to
|
|
|
// the new API.
|
|
|
// TODO: Warn in a future release.
|
|
|
nextChildren = null;
|
|
|
|
|
|
{
|
|
|
stopProfilerTimerIfRunning();
|
|
|
}
|
|
|
} else {
|
|
|
{
|
|
|
markComponentRenderStarted(workInProgress);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
setIsRendering(true);
|
|
|
nextChildren = instance.render();
|
|
|
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
instance.render();
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
setIsRendering(false);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markComponentRenderStopped();
|
|
|
}
|
|
|
} // React DevTools reads this flag.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= PerformedWork;
|
|
|
|
|
|
if (current !== null && didCaptureError) {
|
|
|
// If we're recovering from an error, reconcile without reusing any of
|
|
|
// the existing children. Conceptually, the normal children and the children
|
|
|
// that are shown on error are two different sets, so we shouldn't reuse
|
|
|
// normal children even if their identities match.
|
|
|
forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes);
|
|
|
} else {
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
} // Memoize state using the values we just used to render.
|
|
|
// TODO: Restructure so we never read values from the instance.
|
|
|
|
|
|
|
|
|
workInProgress.memoizedState = instance.state; // The context might have changed so we need to recalculate it.
|
|
|
|
|
|
if (hasContext) {
|
|
|
invalidateContextProvider(workInProgress, Component, true);
|
|
|
}
|
|
|
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function pushHostRootContext(workInProgress) {
|
|
|
var root = workInProgress.stateNode;
|
|
|
|
|
|
if (root.pendingContext) {
|
|
|
pushTopLevelContextObject(workInProgress, root.pendingContext, root.pendingContext !== root.context);
|
|
|
} else if (root.context) {
|
|
|
// Should always be set
|
|
|
pushTopLevelContextObject(workInProgress, root.context, false);
|
|
|
}
|
|
|
|
|
|
pushHostContainer(workInProgress, root.containerInfo);
|
|
|
}
|
|
|
|
|
|
function updateHostRoot(current, workInProgress, renderLanes) {
|
|
|
pushHostRootContext(workInProgress);
|
|
|
|
|
|
if (current === null) {
|
|
|
throw new Error('Should have a current fiber. This is a bug in React.');
|
|
|
}
|
|
|
|
|
|
var nextProps = workInProgress.pendingProps;
|
|
|
var prevState = workInProgress.memoizedState;
|
|
|
var prevChildren = prevState.element;
|
|
|
cloneUpdateQueue(current, workInProgress);
|
|
|
processUpdateQueue(workInProgress, nextProps, null, renderLanes);
|
|
|
var nextState = workInProgress.memoizedState;
|
|
|
var root = workInProgress.stateNode;
|
|
|
// being called "element".
|
|
|
|
|
|
|
|
|
var nextChildren = nextState.element;
|
|
|
|
|
|
if ( prevState.isDehydrated) {
|
|
|
// This is a hydration root whose shell has not yet hydrated. We should
|
|
|
// attempt to hydrate.
|
|
|
// Flip isDehydrated to false to indicate that when this render
|
|
|
// finishes, the root will no longer be dehydrated.
|
|
|
var overrideState = {
|
|
|
element: nextChildren,
|
|
|
isDehydrated: false,
|
|
|
cache: nextState.cache,
|
|
|
pendingSuspenseBoundaries: nextState.pendingSuspenseBoundaries,
|
|
|
transitions: nextState.transitions
|
|
|
};
|
|
|
var updateQueue = workInProgress.updateQueue; // `baseState` can always be the last state because the root doesn't
|
|
|
// have reducer functions so it doesn't need rebasing.
|
|
|
|
|
|
updateQueue.baseState = overrideState;
|
|
|
workInProgress.memoizedState = overrideState;
|
|
|
|
|
|
if (workInProgress.flags & ForceClientRender) {
|
|
|
// Something errored during a previous attempt to hydrate the shell, so we
|
|
|
// forced a client render.
|
|
|
var recoverableError = createCapturedValueAtFiber(new Error('There was an error while hydrating. Because the error happened outside ' + 'of a Suspense boundary, the entire root will switch to ' + 'client rendering.'), workInProgress);
|
|
|
return mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, recoverableError);
|
|
|
} else if (nextChildren !== prevChildren) {
|
|
|
var _recoverableError = createCapturedValueAtFiber(new Error('This root received an early update, before anything was able ' + 'hydrate. Switched the entire root to client rendering.'), workInProgress);
|
|
|
|
|
|
return mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, _recoverableError);
|
|
|
} else {
|
|
|
// The outermost shell has not hydrated yet. Start hydrating.
|
|
|
enterHydrationState(workInProgress);
|
|
|
|
|
|
var child = mountChildFibers(workInProgress, null, nextChildren, renderLanes);
|
|
|
workInProgress.child = child;
|
|
|
var node = child;
|
|
|
|
|
|
while (node) {
|
|
|
// Mark each child as hydrating. This is a fast path to know whether this
|
|
|
// tree is part of a hydrating tree. This is used to determine if a child
|
|
|
// node has fully mounted yet, and for scheduling event replaying.
|
|
|
// Conceptually this is similar to Placement in that a new subtree is
|
|
|
// inserted into the React tree here. It just happens to not need DOM
|
|
|
// mutations because it already exists.
|
|
|
node.flags = node.flags & ~Placement | Hydrating;
|
|
|
node = node.sibling;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
// Root is not dehydrated. Either this is a client-only root, or it
|
|
|
// already hydrated.
|
|
|
resetHydrationState();
|
|
|
|
|
|
if (nextChildren === prevChildren) {
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
}
|
|
|
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, recoverableError) {
|
|
|
// Revert to client rendering.
|
|
|
resetHydrationState();
|
|
|
queueHydrationError(recoverableError);
|
|
|
workInProgress.flags |= ForceClientRender;
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updateHostComponent(current, workInProgress, renderLanes) {
|
|
|
pushHostContext(workInProgress);
|
|
|
|
|
|
if (current === null) {
|
|
|
tryToClaimNextHydratableInstance(workInProgress);
|
|
|
}
|
|
|
|
|
|
var type = workInProgress.type;
|
|
|
var nextProps = workInProgress.pendingProps;
|
|
|
var prevProps = current !== null ? current.memoizedProps : null;
|
|
|
var nextChildren = nextProps.children;
|
|
|
var isDirectTextChild = shouldSetTextContent(type, nextProps);
|
|
|
|
|
|
if (isDirectTextChild) {
|
|
|
// We special case a direct text child of a host node. This is a common
|
|
|
// case. We won't handle it as a reified child. We will instead handle
|
|
|
// this in the host environment that also has access to this prop. That
|
|
|
// avoids allocating another HostText fiber and traversing it.
|
|
|
nextChildren = null;
|
|
|
} else if (prevProps !== null && shouldSetTextContent(type, prevProps)) {
|
|
|
// If we're switching from a direct text child to a normal child, or to
|
|
|
// empty, we need to schedule the text content to be reset.
|
|
|
workInProgress.flags |= ContentReset;
|
|
|
}
|
|
|
|
|
|
markRef(current, workInProgress);
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updateHostText(current, workInProgress) {
|
|
|
if (current === null) {
|
|
|
tryToClaimNextHydratableInstance(workInProgress);
|
|
|
} // Nothing to do here. This is terminal. We'll do the completion step
|
|
|
// immediately after.
|
|
|
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function mountLazyComponent(_current, workInProgress, elementType, renderLanes) {
|
|
|
resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress);
|
|
|
var props = workInProgress.pendingProps;
|
|
|
var lazyComponent = elementType;
|
|
|
var payload = lazyComponent._payload;
|
|
|
var init = lazyComponent._init;
|
|
|
var Component = init(payload); // Store the unwrapped component in the type.
|
|
|
|
|
|
workInProgress.type = Component;
|
|
|
var resolvedTag = workInProgress.tag = resolveLazyComponentTag(Component);
|
|
|
var resolvedProps = resolveDefaultProps(Component, props);
|
|
|
var child;
|
|
|
|
|
|
switch (resolvedTag) {
|
|
|
case FunctionComponent:
|
|
|
{
|
|
|
{
|
|
|
validateFunctionComponentInDev(workInProgress, Component);
|
|
|
workInProgress.type = Component = resolveFunctionForHotReloading(Component);
|
|
|
}
|
|
|
|
|
|
child = updateFunctionComponent(null, workInProgress, Component, resolvedProps, renderLanes);
|
|
|
return child;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
{
|
|
|
workInProgress.type = Component = resolveClassForHotReloading(Component);
|
|
|
}
|
|
|
|
|
|
child = updateClassComponent(null, workInProgress, Component, resolvedProps, renderLanes);
|
|
|
return child;
|
|
|
}
|
|
|
|
|
|
case ForwardRef:
|
|
|
{
|
|
|
{
|
|
|
workInProgress.type = Component = resolveForwardRefForHotReloading(Component);
|
|
|
}
|
|
|
|
|
|
child = updateForwardRef(null, workInProgress, Component, resolvedProps, renderLanes);
|
|
|
return child;
|
|
|
}
|
|
|
|
|
|
case MemoComponent:
|
|
|
{
|
|
|
{
|
|
|
if (workInProgress.type !== workInProgress.elementType) {
|
|
|
var outerPropTypes = Component.propTypes;
|
|
|
|
|
|
if (outerPropTypes) {
|
|
|
checkPropTypes(outerPropTypes, resolvedProps, // Resolved for outer only
|
|
|
'prop', getComponentNameFromType(Component));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
child = updateMemoComponent(null, workInProgress, Component, resolveDefaultProps(Component.type, resolvedProps), // The inner type can have defaults too
|
|
|
renderLanes);
|
|
|
return child;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var hint = '';
|
|
|
|
|
|
{
|
|
|
if (Component !== null && typeof Component === 'object' && Component.$$typeof === REACT_LAZY_TYPE) {
|
|
|
hint = ' Did you wrap a component in React.lazy() more than once?';
|
|
|
}
|
|
|
} // This message intentionally doesn't mention ForwardRef or MemoComponent
|
|
|
// because the fact that it's a separate type of work is an
|
|
|
// implementation detail.
|
|
|
|
|
|
|
|
|
throw new Error("Element type is invalid. Received a promise that resolves to: " + Component + ". " + ("Lazy element type must resolve to a class or function." + hint));
|
|
|
}
|
|
|
|
|
|
function mountIncompleteClassComponent(_current, workInProgress, Component, nextProps, renderLanes) {
|
|
|
resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); // Promote the fiber to a class and try rendering again.
|
|
|
|
|
|
workInProgress.tag = ClassComponent; // The rest of this function is a fork of `updateClassComponent`
|
|
|
// Push context providers early to prevent context stack mismatches.
|
|
|
// During mounting we don't know the child context yet as the instance doesn't exist.
|
|
|
// We will invalidate the child context in finishClassComponent() right after rendering.
|
|
|
|
|
|
var hasContext;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
hasContext = true;
|
|
|
pushContextProvider(workInProgress);
|
|
|
} else {
|
|
|
hasContext = false;
|
|
|
}
|
|
|
|
|
|
prepareToReadContext(workInProgress, renderLanes);
|
|
|
constructClassInstance(workInProgress, Component, nextProps);
|
|
|
mountClassInstance(workInProgress, Component, nextProps, renderLanes);
|
|
|
return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes);
|
|
|
}
|
|
|
|
|
|
function mountIndeterminateComponent(_current, workInProgress, Component, renderLanes) {
|
|
|
resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress);
|
|
|
var props = workInProgress.pendingProps;
|
|
|
var context;
|
|
|
|
|
|
{
|
|
|
var unmaskedContext = getUnmaskedContext(workInProgress, Component, false);
|
|
|
context = getMaskedContext(workInProgress, unmaskedContext);
|
|
|
}
|
|
|
|
|
|
prepareToReadContext(workInProgress, renderLanes);
|
|
|
var value;
|
|
|
var hasId;
|
|
|
|
|
|
{
|
|
|
markComponentRenderStarted(workInProgress);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (Component.prototype && typeof Component.prototype.render === 'function') {
|
|
|
var componentName = getComponentNameFromType(Component) || 'Unknown';
|
|
|
|
|
|
if (!didWarnAboutBadClass[componentName]) {
|
|
|
error("The <%s /> component appears to have a render method, but doesn't extend React.Component. " + 'This is likely to cause errors. Change %s to extend React.Component instead.', componentName, componentName);
|
|
|
|
|
|
didWarnAboutBadClass[componentName] = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (workInProgress.mode & StrictLegacyMode) {
|
|
|
ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, null);
|
|
|
}
|
|
|
|
|
|
setIsRendering(true);
|
|
|
ReactCurrentOwner$1.current = workInProgress;
|
|
|
value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
|
|
|
hasId = checkDidRenderIdHook();
|
|
|
setIsRendering(false);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markComponentRenderStopped();
|
|
|
} // React DevTools reads this flag.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= PerformedWork;
|
|
|
|
|
|
{
|
|
|
// Support for module components is deprecated and is removed behind a flag.
|
|
|
// Whether or not it would crash later, we want to show a good message in DEV first.
|
|
|
if (typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) {
|
|
|
var _componentName = getComponentNameFromType(Component) || 'Unknown';
|
|
|
|
|
|
if (!didWarnAboutModulePatternComponent[_componentName]) {
|
|
|
error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName, _componentName, _componentName);
|
|
|
|
|
|
didWarnAboutModulePatternComponent[_componentName] = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ( // Run these checks in production only if the flag is off.
|
|
|
// Eventually we'll delete this branch altogether.
|
|
|
typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) {
|
|
|
{
|
|
|
var _componentName2 = getComponentNameFromType(Component) || 'Unknown';
|
|
|
|
|
|
if (!didWarnAboutModulePatternComponent[_componentName2]) {
|
|
|
error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName2, _componentName2, _componentName2);
|
|
|
|
|
|
didWarnAboutModulePatternComponent[_componentName2] = true;
|
|
|
}
|
|
|
} // Proceed under the assumption that this is a class instance
|
|
|
|
|
|
|
|
|
workInProgress.tag = ClassComponent; // Throw out any hooks that were used.
|
|
|
|
|
|
workInProgress.memoizedState = null;
|
|
|
workInProgress.updateQueue = null; // Push context providers early to prevent context stack mismatches.
|
|
|
// During mounting we don't know the child context yet as the instance doesn't exist.
|
|
|
// We will invalidate the child context in finishClassComponent() right after rendering.
|
|
|
|
|
|
var hasContext = false;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
hasContext = true;
|
|
|
pushContextProvider(workInProgress);
|
|
|
} else {
|
|
|
hasContext = false;
|
|
|
}
|
|
|
|
|
|
workInProgress.memoizedState = value.state !== null && value.state !== undefined ? value.state : null;
|
|
|
initializeUpdateQueue(workInProgress);
|
|
|
adoptClassInstance(workInProgress, value);
|
|
|
mountClassInstance(workInProgress, Component, props, renderLanes);
|
|
|
return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes);
|
|
|
} else {
|
|
|
// Proceed under the assumption that this is a function component
|
|
|
workInProgress.tag = FunctionComponent;
|
|
|
|
|
|
{
|
|
|
|
|
|
if ( workInProgress.mode & StrictLegacyMode) {
|
|
|
setIsStrictModeForDevtools(true);
|
|
|
|
|
|
try {
|
|
|
value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes);
|
|
|
hasId = checkDidRenderIdHook();
|
|
|
} finally {
|
|
|
setIsStrictModeForDevtools(false);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (getIsHydrating() && hasId) {
|
|
|
pushMaterializedTreeId(workInProgress);
|
|
|
}
|
|
|
|
|
|
reconcileChildren(null, workInProgress, value, renderLanes);
|
|
|
|
|
|
{
|
|
|
validateFunctionComponentInDev(workInProgress, Component);
|
|
|
}
|
|
|
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function validateFunctionComponentInDev(workInProgress, Component) {
|
|
|
{
|
|
|
if (Component) {
|
|
|
if (Component.childContextTypes) {
|
|
|
error('%s(...): childContextTypes cannot be defined on a function component.', Component.displayName || Component.name || 'Component');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (workInProgress.ref !== null) {
|
|
|
var info = '';
|
|
|
var ownerName = getCurrentFiberOwnerNameInDevOrNull();
|
|
|
|
|
|
if (ownerName) {
|
|
|
info += '\n\nCheck the render method of `' + ownerName + '`.';
|
|
|
}
|
|
|
|
|
|
var warningKey = ownerName || '';
|
|
|
var debugSource = workInProgress._debugSource;
|
|
|
|
|
|
if (debugSource) {
|
|
|
warningKey = debugSource.fileName + ':' + debugSource.lineNumber;
|
|
|
}
|
|
|
|
|
|
if (!didWarnAboutFunctionRefs[warningKey]) {
|
|
|
didWarnAboutFunctionRefs[warningKey] = true;
|
|
|
|
|
|
error('Function components cannot be given refs. ' + 'Attempts to access this ref will fail. ' + 'Did you mean to use React.forwardRef()?%s', info);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof Component.getDerivedStateFromProps === 'function') {
|
|
|
var _componentName3 = getComponentNameFromType(Component) || 'Unknown';
|
|
|
|
|
|
if (!didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3]) {
|
|
|
error('%s: Function components do not support getDerivedStateFromProps.', _componentName3);
|
|
|
|
|
|
didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3] = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof Component.contextType === 'object' && Component.contextType !== null) {
|
|
|
var _componentName4 = getComponentNameFromType(Component) || 'Unknown';
|
|
|
|
|
|
if (!didWarnAboutContextTypeOnFunctionComponent[_componentName4]) {
|
|
|
error('%s: Function components do not support contextType.', _componentName4);
|
|
|
|
|
|
didWarnAboutContextTypeOnFunctionComponent[_componentName4] = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var SUSPENDED_MARKER = {
|
|
|
dehydrated: null,
|
|
|
treeContext: null,
|
|
|
retryLane: NoLane
|
|
|
};
|
|
|
|
|
|
function mountSuspenseOffscreenState(renderLanes) {
|
|
|
return {
|
|
|
baseLanes: renderLanes,
|
|
|
cachePool: getSuspendedCache(),
|
|
|
transitions: null
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function updateSuspenseOffscreenState(prevOffscreenState, renderLanes) {
|
|
|
var cachePool = null;
|
|
|
|
|
|
return {
|
|
|
baseLanes: mergeLanes(prevOffscreenState.baseLanes, renderLanes),
|
|
|
cachePool: cachePool,
|
|
|
transitions: prevOffscreenState.transitions
|
|
|
};
|
|
|
} // TODO: Probably should inline this back
|
|
|
|
|
|
|
|
|
function shouldRemainOnFallback(suspenseContext, current, workInProgress, renderLanes) {
|
|
|
// If we're already showing a fallback, there are cases where we need to
|
|
|
// remain on that fallback regardless of whether the content has resolved.
|
|
|
// For example, SuspenseList coordinates when nested content appears.
|
|
|
if (current !== null) {
|
|
|
var suspenseState = current.memoizedState;
|
|
|
|
|
|
if (suspenseState === null) {
|
|
|
// Currently showing content. Don't hide it, even if ForceSuspenseFallback
|
|
|
// is true. More precise name might be "ForceRemainSuspenseFallback".
|
|
|
// Note: This is a factoring smell. Can't remain on a fallback if there's
|
|
|
// no fallback to remain on.
|
|
|
return false;
|
|
|
}
|
|
|
} // Not currently showing content. Consult the Suspense context.
|
|
|
|
|
|
|
|
|
return hasSuspenseContext(suspenseContext, ForceSuspenseFallback);
|
|
|
}
|
|
|
|
|
|
function getRemainingWorkInPrimaryTree(current, renderLanes) {
|
|
|
// TODO: Should not remove render lanes that were pinged during this render
|
|
|
return removeLanes(current.childLanes, renderLanes);
|
|
|
}
|
|
|
|
|
|
function updateSuspenseComponent(current, workInProgress, renderLanes) {
|
|
|
var nextProps = workInProgress.pendingProps; // This is used by DevTools to force a boundary to suspend.
|
|
|
|
|
|
{
|
|
|
if (shouldSuspend(workInProgress)) {
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var suspenseContext = suspenseStackCursor.current;
|
|
|
var showFallback = false;
|
|
|
var didSuspend = (workInProgress.flags & DidCapture) !== NoFlags;
|
|
|
|
|
|
if (didSuspend || shouldRemainOnFallback(suspenseContext, current)) {
|
|
|
// Something in this boundary's subtree already suspended. Switch to
|
|
|
// rendering the fallback children.
|
|
|
showFallback = true;
|
|
|
workInProgress.flags &= ~DidCapture;
|
|
|
} else {
|
|
|
// Attempting the main content
|
|
|
if (current === null || current.memoizedState !== null) {
|
|
|
// This is a new mount or this boundary is already showing a fallback state.
|
|
|
// Mark this subtree context as having at least one invisible parent that could
|
|
|
// handle the fallback state.
|
|
|
// Avoided boundaries are not considered since they cannot handle preferred fallback states.
|
|
|
{
|
|
|
suspenseContext = addSubtreeSuspenseContext(suspenseContext, InvisibleParentSuspenseContext);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
|
|
|
pushSuspenseContext(workInProgress, suspenseContext); // OK, the next part is confusing. We're about to reconcile the Suspense
|
|
|
// boundary's children. This involves some custom reconciliation logic. Two
|
|
|
// main reasons this is so complicated.
|
|
|
//
|
|
|
// First, Legacy Mode has different semantics for backwards compatibility. The
|
|
|
// primary tree will commit in an inconsistent state, so when we do the
|
|
|
// second pass to render the fallback, we do some exceedingly, uh, clever
|
|
|
// hacks to make that not totally break. Like transferring effects and
|
|
|
// deletions from hidden tree. In Concurrent Mode, it's much simpler,
|
|
|
// because we bailout on the primary tree completely and leave it in its old
|
|
|
// state, no effects. Same as what we do for Offscreen (except that
|
|
|
// Offscreen doesn't have the first render pass).
|
|
|
//
|
|
|
// Second is hydration. During hydration, the Suspense fiber has a slightly
|
|
|
// different layout, where the child points to a dehydrated fragment, which
|
|
|
// contains the DOM rendered by the server.
|
|
|
//
|
|
|
// Third, even if you set all that aside, Suspense is like error boundaries in
|
|
|
// that we first we try to render one tree, and if that fails, we render again
|
|
|
// and switch to a different tree. Like a try/catch block. So we have to track
|
|
|
// which branch we're currently rendering. Ideally we would model this using
|
|
|
// a stack.
|
|
|
|
|
|
if (current === null) {
|
|
|
// Initial mount
|
|
|
// Special path for hydration
|
|
|
// If we're currently hydrating, try to hydrate this boundary.
|
|
|
tryToClaimNextHydratableInstance(workInProgress); // This could've been a dehydrated suspense component.
|
|
|
|
|
|
var suspenseState = workInProgress.memoizedState;
|
|
|
|
|
|
if (suspenseState !== null) {
|
|
|
var dehydrated = suspenseState.dehydrated;
|
|
|
|
|
|
if (dehydrated !== null) {
|
|
|
return mountDehydratedSuspenseComponent(workInProgress, dehydrated);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var nextPrimaryChildren = nextProps.children;
|
|
|
var nextFallbackChildren = nextProps.fallback;
|
|
|
|
|
|
if (showFallback) {
|
|
|
var fallbackFragment = mountSuspenseFallbackChildren(workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes);
|
|
|
var primaryChildFragment = workInProgress.child;
|
|
|
primaryChildFragment.memoizedState = mountSuspenseOffscreenState(renderLanes);
|
|
|
workInProgress.memoizedState = SUSPENDED_MARKER;
|
|
|
|
|
|
return fallbackFragment;
|
|
|
} else {
|
|
|
return mountSuspensePrimaryChildren(workInProgress, nextPrimaryChildren);
|
|
|
}
|
|
|
} else {
|
|
|
// This is an update.
|
|
|
// Special path for hydration
|
|
|
var prevState = current.memoizedState;
|
|
|
|
|
|
if (prevState !== null) {
|
|
|
var _dehydrated = prevState.dehydrated;
|
|
|
|
|
|
if (_dehydrated !== null) {
|
|
|
return updateDehydratedSuspenseComponent(current, workInProgress, didSuspend, nextProps, _dehydrated, prevState, renderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (showFallback) {
|
|
|
var _nextFallbackChildren = nextProps.fallback;
|
|
|
var _nextPrimaryChildren = nextProps.children;
|
|
|
var fallbackChildFragment = updateSuspenseFallbackChildren(current, workInProgress, _nextPrimaryChildren, _nextFallbackChildren, renderLanes);
|
|
|
var _primaryChildFragment2 = workInProgress.child;
|
|
|
var prevOffscreenState = current.child.memoizedState;
|
|
|
_primaryChildFragment2.memoizedState = prevOffscreenState === null ? mountSuspenseOffscreenState(renderLanes) : updateSuspenseOffscreenState(prevOffscreenState, renderLanes);
|
|
|
|
|
|
_primaryChildFragment2.childLanes = getRemainingWorkInPrimaryTree(current, renderLanes);
|
|
|
workInProgress.memoizedState = SUSPENDED_MARKER;
|
|
|
return fallbackChildFragment;
|
|
|
} else {
|
|
|
var _nextPrimaryChildren2 = nextProps.children;
|
|
|
|
|
|
var _primaryChildFragment3 = updateSuspensePrimaryChildren(current, workInProgress, _nextPrimaryChildren2, renderLanes);
|
|
|
|
|
|
workInProgress.memoizedState = null;
|
|
|
return _primaryChildFragment3;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function mountSuspensePrimaryChildren(workInProgress, primaryChildren, renderLanes) {
|
|
|
var mode = workInProgress.mode;
|
|
|
var primaryChildProps = {
|
|
|
mode: 'visible',
|
|
|
children: primaryChildren
|
|
|
};
|
|
|
var primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, mode);
|
|
|
primaryChildFragment.return = workInProgress;
|
|
|
workInProgress.child = primaryChildFragment;
|
|
|
return primaryChildFragment;
|
|
|
}
|
|
|
|
|
|
function mountSuspenseFallbackChildren(workInProgress, primaryChildren, fallbackChildren, renderLanes) {
|
|
|
var mode = workInProgress.mode;
|
|
|
var progressedPrimaryFragment = workInProgress.child;
|
|
|
var primaryChildProps = {
|
|
|
mode: 'hidden',
|
|
|
children: primaryChildren
|
|
|
};
|
|
|
var primaryChildFragment;
|
|
|
var fallbackChildFragment;
|
|
|
|
|
|
if ((mode & ConcurrentMode) === NoMode && progressedPrimaryFragment !== null) {
|
|
|
// In legacy mode, we commit the primary tree as if it successfully
|
|
|
// completed, even though it's in an inconsistent state.
|
|
|
primaryChildFragment = progressedPrimaryFragment;
|
|
|
primaryChildFragment.childLanes = NoLanes;
|
|
|
primaryChildFragment.pendingProps = primaryChildProps;
|
|
|
|
|
|
if ( workInProgress.mode & ProfileMode) {
|
|
|
// Reset the durations from the first pass so they aren't included in the
|
|
|
// final amounts. This seems counterintuitive, since we're intentionally
|
|
|
// not measuring part of the render phase, but this makes it match what we
|
|
|
// do in Concurrent Mode.
|
|
|
primaryChildFragment.actualDuration = 0;
|
|
|
primaryChildFragment.actualStartTime = -1;
|
|
|
primaryChildFragment.selfBaseDuration = 0;
|
|
|
primaryChildFragment.treeBaseDuration = 0;
|
|
|
}
|
|
|
|
|
|
fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null);
|
|
|
} else {
|
|
|
primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, mode);
|
|
|
fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null);
|
|
|
}
|
|
|
|
|
|
primaryChildFragment.return = workInProgress;
|
|
|
fallbackChildFragment.return = workInProgress;
|
|
|
primaryChildFragment.sibling = fallbackChildFragment;
|
|
|
workInProgress.child = primaryChildFragment;
|
|
|
return fallbackChildFragment;
|
|
|
}
|
|
|
|
|
|
function mountWorkInProgressOffscreenFiber(offscreenProps, mode, renderLanes) {
|
|
|
// The props argument to `createFiberFromOffscreen` is `any` typed, so we use
|
|
|
// this wrapper function to constrain it.
|
|
|
return createFiberFromOffscreen(offscreenProps, mode, NoLanes, null);
|
|
|
}
|
|
|
|
|
|
function updateWorkInProgressOffscreenFiber(current, offscreenProps) {
|
|
|
// The props argument to `createWorkInProgress` is `any` typed, so we use this
|
|
|
// wrapper function to constrain it.
|
|
|
return createWorkInProgress(current, offscreenProps);
|
|
|
}
|
|
|
|
|
|
function updateSuspensePrimaryChildren(current, workInProgress, primaryChildren, renderLanes) {
|
|
|
var currentPrimaryChildFragment = current.child;
|
|
|
var currentFallbackChildFragment = currentPrimaryChildFragment.sibling;
|
|
|
var primaryChildFragment = updateWorkInProgressOffscreenFiber(currentPrimaryChildFragment, {
|
|
|
mode: 'visible',
|
|
|
children: primaryChildren
|
|
|
});
|
|
|
|
|
|
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
primaryChildFragment.lanes = renderLanes;
|
|
|
}
|
|
|
|
|
|
primaryChildFragment.return = workInProgress;
|
|
|
primaryChildFragment.sibling = null;
|
|
|
|
|
|
if (currentFallbackChildFragment !== null) {
|
|
|
// Delete the fallback child fragment
|
|
|
var deletions = workInProgress.deletions;
|
|
|
|
|
|
if (deletions === null) {
|
|
|
workInProgress.deletions = [currentFallbackChildFragment];
|
|
|
workInProgress.flags |= ChildDeletion;
|
|
|
} else {
|
|
|
deletions.push(currentFallbackChildFragment);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
workInProgress.child = primaryChildFragment;
|
|
|
return primaryChildFragment;
|
|
|
}
|
|
|
|
|
|
function updateSuspenseFallbackChildren(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) {
|
|
|
var mode = workInProgress.mode;
|
|
|
var currentPrimaryChildFragment = current.child;
|
|
|
var currentFallbackChildFragment = currentPrimaryChildFragment.sibling;
|
|
|
var primaryChildProps = {
|
|
|
mode: 'hidden',
|
|
|
children: primaryChildren
|
|
|
};
|
|
|
var primaryChildFragment;
|
|
|
|
|
|
if ( // In legacy mode, we commit the primary tree as if it successfully
|
|
|
// completed, even though it's in an inconsistent state.
|
|
|
(mode & ConcurrentMode) === NoMode && // Make sure we're on the second pass, i.e. the primary child fragment was
|
|
|
// already cloned. In legacy mode, the only case where this isn't true is
|
|
|
// when DevTools forces us to display a fallback; we skip the first render
|
|
|
// pass entirely and go straight to rendering the fallback. (In Concurrent
|
|
|
// Mode, SuspenseList can also trigger this scenario, but this is a legacy-
|
|
|
// only codepath.)
|
|
|
workInProgress.child !== currentPrimaryChildFragment) {
|
|
|
var progressedPrimaryFragment = workInProgress.child;
|
|
|
primaryChildFragment = progressedPrimaryFragment;
|
|
|
primaryChildFragment.childLanes = NoLanes;
|
|
|
primaryChildFragment.pendingProps = primaryChildProps;
|
|
|
|
|
|
if ( workInProgress.mode & ProfileMode) {
|
|
|
// Reset the durations from the first pass so they aren't included in the
|
|
|
// final amounts. This seems counterintuitive, since we're intentionally
|
|
|
// not measuring part of the render phase, but this makes it match what we
|
|
|
// do in Concurrent Mode.
|
|
|
primaryChildFragment.actualDuration = 0;
|
|
|
primaryChildFragment.actualStartTime = -1;
|
|
|
primaryChildFragment.selfBaseDuration = currentPrimaryChildFragment.selfBaseDuration;
|
|
|
primaryChildFragment.treeBaseDuration = currentPrimaryChildFragment.treeBaseDuration;
|
|
|
} // The fallback fiber was added as a deletion during the first pass.
|
|
|
// However, since we're going to remain on the fallback, we no longer want
|
|
|
// to delete it.
|
|
|
|
|
|
|
|
|
workInProgress.deletions = null;
|
|
|
} else {
|
|
|
primaryChildFragment = updateWorkInProgressOffscreenFiber(currentPrimaryChildFragment, primaryChildProps); // Since we're reusing a current tree, we need to reuse the flags, too.
|
|
|
// (We don't do this in legacy mode, because in legacy mode we don't re-use
|
|
|
// the current tree; see previous branch.)
|
|
|
|
|
|
primaryChildFragment.subtreeFlags = currentPrimaryChildFragment.subtreeFlags & StaticMask;
|
|
|
}
|
|
|
|
|
|
var fallbackChildFragment;
|
|
|
|
|
|
if (currentFallbackChildFragment !== null) {
|
|
|
fallbackChildFragment = createWorkInProgress(currentFallbackChildFragment, fallbackChildren);
|
|
|
} else {
|
|
|
fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null); // Needs a placement effect because the parent (the Suspense boundary) already
|
|
|
// mounted but this is a new fiber.
|
|
|
|
|
|
fallbackChildFragment.flags |= Placement;
|
|
|
}
|
|
|
|
|
|
fallbackChildFragment.return = workInProgress;
|
|
|
primaryChildFragment.return = workInProgress;
|
|
|
primaryChildFragment.sibling = fallbackChildFragment;
|
|
|
workInProgress.child = primaryChildFragment;
|
|
|
return fallbackChildFragment;
|
|
|
}
|
|
|
|
|
|
function retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, recoverableError) {
|
|
|
// Falling back to client rendering. Because this has performance
|
|
|
// implications, it's considered a recoverable error, even though the user
|
|
|
// likely won't observe anything wrong with the UI.
|
|
|
//
|
|
|
// The error is passed in as an argument to enforce that every caller provide
|
|
|
// a custom message, or explicitly opt out (currently the only path that opts
|
|
|
// out is legacy mode; every concurrent path provides an error).
|
|
|
if (recoverableError !== null) {
|
|
|
queueHydrationError(recoverableError);
|
|
|
} // This will add the old fiber to the deletion list
|
|
|
|
|
|
|
|
|
reconcileChildFibers(workInProgress, current.child, null, renderLanes); // We're now not suspended nor dehydrated.
|
|
|
|
|
|
var nextProps = workInProgress.pendingProps;
|
|
|
var primaryChildren = nextProps.children;
|
|
|
var primaryChildFragment = mountSuspensePrimaryChildren(workInProgress, primaryChildren); // Needs a placement effect because the parent (the Suspense boundary) already
|
|
|
// mounted but this is a new fiber.
|
|
|
|
|
|
primaryChildFragment.flags |= Placement;
|
|
|
workInProgress.memoizedState = null;
|
|
|
return primaryChildFragment;
|
|
|
}
|
|
|
|
|
|
function mountSuspenseFallbackAfterRetryWithoutHydrating(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) {
|
|
|
var fiberMode = workInProgress.mode;
|
|
|
var primaryChildProps = {
|
|
|
mode: 'visible',
|
|
|
children: primaryChildren
|
|
|
};
|
|
|
var primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, fiberMode);
|
|
|
var fallbackChildFragment = createFiberFromFragment(fallbackChildren, fiberMode, renderLanes, null); // Needs a placement effect because the parent (the Suspense
|
|
|
// boundary) already mounted but this is a new fiber.
|
|
|
|
|
|
fallbackChildFragment.flags |= Placement;
|
|
|
primaryChildFragment.return = workInProgress;
|
|
|
fallbackChildFragment.return = workInProgress;
|
|
|
primaryChildFragment.sibling = fallbackChildFragment;
|
|
|
workInProgress.child = primaryChildFragment;
|
|
|
|
|
|
if ((workInProgress.mode & ConcurrentMode) !== NoMode) {
|
|
|
// We will have dropped the effect list which contains the
|
|
|
// deletion. We need to reconcile to delete the current child.
|
|
|
reconcileChildFibers(workInProgress, current.child, null, renderLanes);
|
|
|
}
|
|
|
|
|
|
return fallbackChildFragment;
|
|
|
}
|
|
|
|
|
|
function mountDehydratedSuspenseComponent(workInProgress, suspenseInstance, renderLanes) {
|
|
|
// During the first pass, we'll bail out and not drill into the children.
|
|
|
// Instead, we'll leave the content in place and try to hydrate it later.
|
|
|
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
{
|
|
|
error('Cannot hydrate Suspense in legacy mode. Switch from ' + 'ReactDOM.hydrate(element, container) to ' + 'ReactDOMClient.hydrateRoot(container, <App />)' + '.render(element) or remove the Suspense components from ' + 'the server rendered components.');
|
|
|
}
|
|
|
|
|
|
workInProgress.lanes = laneToLanes(SyncLane);
|
|
|
} else if (isSuspenseInstanceFallback(suspenseInstance)) {
|
|
|
// This is a client-only boundary. Since we won't get any content from the server
|
|
|
// for this, we need to schedule that at a higher priority based on when it would
|
|
|
// have timed out. In theory we could render it in this pass but it would have the
|
|
|
// wrong priority associated with it and will prevent hydration of parent path.
|
|
|
// Instead, we'll leave work left on it to render it in a separate commit.
|
|
|
// TODO This time should be the time at which the server rendered response that is
|
|
|
// a parent to this boundary was displayed. However, since we currently don't have
|
|
|
// a protocol to transfer that time, we'll just estimate it by using the current
|
|
|
// time. This will mean that Suspense timeouts are slightly shifted to later than
|
|
|
// they should be.
|
|
|
// Schedule a normal pri update to render this content.
|
|
|
workInProgress.lanes = laneToLanes(DefaultHydrationLane);
|
|
|
} else {
|
|
|
// We'll continue hydrating the rest at offscreen priority since we'll already
|
|
|
// be showing the right content coming from the server, it is no rush.
|
|
|
workInProgress.lanes = laneToLanes(OffscreenLane);
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function updateDehydratedSuspenseComponent(current, workInProgress, didSuspend, nextProps, suspenseInstance, suspenseState, renderLanes) {
|
|
|
if (!didSuspend) {
|
|
|
// This is the first render pass. Attempt to hydrate.
|
|
|
// We should never be hydrating at this point because it is the first pass,
|
|
|
// but after we've already committed once.
|
|
|
warnIfHydrating();
|
|
|
|
|
|
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, // TODO: When we delete legacy mode, we should make this error argument
|
|
|
// required — every concurrent mode path that causes hydration to
|
|
|
// de-opt to client rendering should have an error message.
|
|
|
null);
|
|
|
}
|
|
|
|
|
|
if (isSuspenseInstanceFallback(suspenseInstance)) {
|
|
|
// This boundary is in a permanent fallback state. In this case, we'll never
|
|
|
// get an update and we'll never be able to hydrate the final content. Let's just try the
|
|
|
// client side render instead.
|
|
|
var digest, message, stack;
|
|
|
|
|
|
{
|
|
|
var _getSuspenseInstanceF = getSuspenseInstanceFallbackErrorDetails(suspenseInstance);
|
|
|
|
|
|
digest = _getSuspenseInstanceF.digest;
|
|
|
message = _getSuspenseInstanceF.message;
|
|
|
stack = _getSuspenseInstanceF.stack;
|
|
|
}
|
|
|
|
|
|
var error;
|
|
|
|
|
|
if (message) {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
error = new Error(message);
|
|
|
} else {
|
|
|
error = new Error('The server could not finish this Suspense boundary, likely ' + 'due to an error during server rendering. Switched to ' + 'client rendering.');
|
|
|
}
|
|
|
|
|
|
var capturedValue = createCapturedValue(error, digest, stack);
|
|
|
return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, capturedValue);
|
|
|
}
|
|
|
// any context has changed, we need to treat is as if the input might have changed.
|
|
|
|
|
|
|
|
|
var hasContextChanged = includesSomeLane(renderLanes, current.childLanes);
|
|
|
|
|
|
if (didReceiveUpdate || hasContextChanged) {
|
|
|
// This boundary has changed since the first render. This means that we are now unable to
|
|
|
// hydrate it. We might still be able to hydrate it using a higher priority lane.
|
|
|
var root = getWorkInProgressRoot();
|
|
|
|
|
|
if (root !== null) {
|
|
|
var attemptHydrationAtLane = getBumpedLaneForHydration(root, renderLanes);
|
|
|
|
|
|
if (attemptHydrationAtLane !== NoLane && attemptHydrationAtLane !== suspenseState.retryLane) {
|
|
|
// Intentionally mutating since this render will get interrupted. This
|
|
|
// is one of the very rare times where we mutate the current tree
|
|
|
// during the render phase.
|
|
|
suspenseState.retryLane = attemptHydrationAtLane; // TODO: Ideally this would inherit the event time of the current render
|
|
|
|
|
|
var eventTime = NoTimestamp;
|
|
|
enqueueConcurrentRenderForLane(current, attemptHydrationAtLane);
|
|
|
scheduleUpdateOnFiber(root, current, attemptHydrationAtLane, eventTime);
|
|
|
}
|
|
|
} // If we have scheduled higher pri work above, this will probably just abort the render
|
|
|
// since we now have higher priority work, but in case it doesn't, we need to prepare to
|
|
|
// render something, if we time out. Even if that requires us to delete everything and
|
|
|
// skip hydration.
|
|
|
// Delay having to do this as long as the suspense timeout allows us.
|
|
|
|
|
|
|
|
|
renderDidSuspendDelayIfPossible();
|
|
|
|
|
|
var _capturedValue = createCapturedValue(new Error('This Suspense boundary received an update before it finished ' + 'hydrating. This caused the boundary to switch to client rendering. ' + 'The usual way to fix this is to wrap the original update ' + 'in startTransition.'));
|
|
|
|
|
|
return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, _capturedValue);
|
|
|
} else if (isSuspenseInstancePending(suspenseInstance)) {
|
|
|
// This component is still pending more data from the server, so we can't hydrate its
|
|
|
// content. We treat it as if this component suspended itself. It might seem as if
|
|
|
// we could just try to render it client-side instead. However, this will perform a
|
|
|
// lot of unnecessary work and is unlikely to complete since it often will suspend
|
|
|
// on missing data anyway. Additionally, the server might be able to render more
|
|
|
// than we can on the client yet. In that case we'd end up with more fallback states
|
|
|
// on the client than if we just leave it alone. If the server times out or errors
|
|
|
// these should update this boundary to the permanent Fallback state instead.
|
|
|
// Mark it as having captured (i.e. suspended).
|
|
|
workInProgress.flags |= DidCapture; // Leave the child in place. I.e. the dehydrated fragment.
|
|
|
|
|
|
workInProgress.child = current.child; // Register a callback to retry this boundary once the server has sent the result.
|
|
|
|
|
|
var retry = retryDehydratedSuspenseBoundary.bind(null, current);
|
|
|
registerSuspenseInstanceRetry(suspenseInstance, retry);
|
|
|
return null;
|
|
|
} else {
|
|
|
// This is the first attempt.
|
|
|
reenterHydrationStateFromDehydratedSuspenseInstance(workInProgress, suspenseInstance, suspenseState.treeContext);
|
|
|
var primaryChildren = nextProps.children;
|
|
|
var primaryChildFragment = mountSuspensePrimaryChildren(workInProgress, primaryChildren); // Mark the children as hydrating. This is a fast path to know whether this
|
|
|
// tree is part of a hydrating tree. This is used to determine if a child
|
|
|
// node has fully mounted yet, and for scheduling event replaying.
|
|
|
// Conceptually this is similar to Placement in that a new subtree is
|
|
|
// inserted into the React tree here. It just happens to not need DOM
|
|
|
// mutations because it already exists.
|
|
|
|
|
|
primaryChildFragment.flags |= Hydrating;
|
|
|
return primaryChildFragment;
|
|
|
}
|
|
|
} else {
|
|
|
// This is the second render pass. We already attempted to hydrated, but
|
|
|
// something either suspended or errored.
|
|
|
if (workInProgress.flags & ForceClientRender) {
|
|
|
// Something errored during hydration. Try again without hydrating.
|
|
|
workInProgress.flags &= ~ForceClientRender;
|
|
|
|
|
|
var _capturedValue2 = createCapturedValue(new Error('There was an error while hydrating this Suspense boundary. ' + 'Switched to client rendering.'));
|
|
|
|
|
|
return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, _capturedValue2);
|
|
|
} else if (workInProgress.memoizedState !== null) {
|
|
|
// Something suspended and we should still be in dehydrated mode.
|
|
|
// Leave the existing child in place.
|
|
|
workInProgress.child = current.child; // The dehydrated completion pass expects this flag to be there
|
|
|
// but the normal suspense pass doesn't.
|
|
|
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
return null;
|
|
|
} else {
|
|
|
// Suspended but we should no longer be in dehydrated mode.
|
|
|
// Therefore we now have to render the fallback.
|
|
|
var nextPrimaryChildren = nextProps.children;
|
|
|
var nextFallbackChildren = nextProps.fallback;
|
|
|
var fallbackChildFragment = mountSuspenseFallbackAfterRetryWithoutHydrating(current, workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes);
|
|
|
var _primaryChildFragment4 = workInProgress.child;
|
|
|
_primaryChildFragment4.memoizedState = mountSuspenseOffscreenState(renderLanes);
|
|
|
workInProgress.memoizedState = SUSPENDED_MARKER;
|
|
|
return fallbackChildFragment;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function scheduleSuspenseWorkOnFiber(fiber, renderLanes, propagationRoot) {
|
|
|
fiber.lanes = mergeLanes(fiber.lanes, renderLanes);
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
alternate.lanes = mergeLanes(alternate.lanes, renderLanes);
|
|
|
}
|
|
|
|
|
|
scheduleContextWorkOnParentPath(fiber.return, renderLanes, propagationRoot);
|
|
|
}
|
|
|
|
|
|
function propagateSuspenseContextChange(workInProgress, firstChild, renderLanes) {
|
|
|
// Mark any Suspense boundaries with fallbacks as having work to do.
|
|
|
// If they were previously forced into fallbacks, they may now be able
|
|
|
// to unblock.
|
|
|
var node = firstChild;
|
|
|
|
|
|
while (node !== null) {
|
|
|
if (node.tag === SuspenseComponent) {
|
|
|
var state = node.memoizedState;
|
|
|
|
|
|
if (state !== null) {
|
|
|
scheduleSuspenseWorkOnFiber(node, renderLanes, workInProgress);
|
|
|
}
|
|
|
} else if (node.tag === SuspenseListComponent) {
|
|
|
// If the tail is hidden there might not be an Suspense boundaries
|
|
|
// to schedule work on. In this case we have to schedule it on the
|
|
|
// list itself.
|
|
|
// We don't have to traverse to the children of the list since
|
|
|
// the list will propagate the change when it rerenders.
|
|
|
scheduleSuspenseWorkOnFiber(node, renderLanes, workInProgress);
|
|
|
} else if (node.child !== null) {
|
|
|
node.child.return = node;
|
|
|
node = node.child;
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (node === workInProgress) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || node.return === workInProgress) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function findLastContentRow(firstChild) {
|
|
|
// This is going to find the last row among these children that is already
|
|
|
// showing content on the screen, as opposed to being in fallback state or
|
|
|
// new. If a row has multiple Suspense boundaries, any of them being in the
|
|
|
// fallback state, counts as the whole row being in a fallback state.
|
|
|
// Note that the "rows" will be workInProgress, but any nested children
|
|
|
// will still be current since we haven't rendered them yet. The mounted
|
|
|
// order may not be the same as the new order. We use the new order.
|
|
|
var row = firstChild;
|
|
|
var lastContentRow = null;
|
|
|
|
|
|
while (row !== null) {
|
|
|
var currentRow = row.alternate; // New rows can't be content rows.
|
|
|
|
|
|
if (currentRow !== null && findFirstSuspended(currentRow) === null) {
|
|
|
lastContentRow = row;
|
|
|
}
|
|
|
|
|
|
row = row.sibling;
|
|
|
}
|
|
|
|
|
|
return lastContentRow;
|
|
|
}
|
|
|
|
|
|
function validateRevealOrder(revealOrder) {
|
|
|
{
|
|
|
if (revealOrder !== undefined && revealOrder !== 'forwards' && revealOrder !== 'backwards' && revealOrder !== 'together' && !didWarnAboutRevealOrder[revealOrder]) {
|
|
|
didWarnAboutRevealOrder[revealOrder] = true;
|
|
|
|
|
|
if (typeof revealOrder === 'string') {
|
|
|
switch (revealOrder.toLowerCase()) {
|
|
|
case 'together':
|
|
|
case 'forwards':
|
|
|
case 'backwards':
|
|
|
{
|
|
|
error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'Use lowercase "%s" instead.', revealOrder, revealOrder.toLowerCase());
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case 'forward':
|
|
|
case 'backward':
|
|
|
{
|
|
|
error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'React uses the -s suffix in the spelling. Use "%ss" instead.', revealOrder, revealOrder.toLowerCase());
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
error('"%s" is not a supported revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder);
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
} else {
|
|
|
error('%s is not a supported value for revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function validateTailOptions(tailMode, revealOrder) {
|
|
|
{
|
|
|
if (tailMode !== undefined && !didWarnAboutTailOptions[tailMode]) {
|
|
|
if (tailMode !== 'collapsed' && tailMode !== 'hidden') {
|
|
|
didWarnAboutTailOptions[tailMode] = true;
|
|
|
|
|
|
error('"%s" is not a supported value for tail on <SuspenseList />. ' + 'Did you mean "collapsed" or "hidden"?', tailMode);
|
|
|
} else if (revealOrder !== 'forwards' && revealOrder !== 'backwards') {
|
|
|
didWarnAboutTailOptions[tailMode] = true;
|
|
|
|
|
|
error('<SuspenseList tail="%s" /> is only valid if revealOrder is ' + '"forwards" or "backwards". ' + 'Did you mean to specify revealOrder="forwards"?', tailMode);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function validateSuspenseListNestedChild(childSlot, index) {
|
|
|
{
|
|
|
var isAnArray = isArray(childSlot);
|
|
|
var isIterable = !isAnArray && typeof getIteratorFn(childSlot) === 'function';
|
|
|
|
|
|
if (isAnArray || isIterable) {
|
|
|
var type = isAnArray ? 'array' : 'iterable';
|
|
|
|
|
|
error('A nested %s was passed to row #%s in <SuspenseList />. Wrap it in ' + 'an additional SuspenseList to configure its revealOrder: ' + '<SuspenseList revealOrder=...> ... ' + '<SuspenseList revealOrder=...>{%s}</SuspenseList> ... ' + '</SuspenseList>', type, index, type);
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function validateSuspenseListChildren(children, revealOrder) {
|
|
|
{
|
|
|
if ((revealOrder === 'forwards' || revealOrder === 'backwards') && children !== undefined && children !== null && children !== false) {
|
|
|
if (isArray(children)) {
|
|
|
for (var i = 0; i < children.length; i++) {
|
|
|
if (!validateSuspenseListNestedChild(children[i], i)) {
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
var iteratorFn = getIteratorFn(children);
|
|
|
|
|
|
if (typeof iteratorFn === 'function') {
|
|
|
var childrenIterator = iteratorFn.call(children);
|
|
|
|
|
|
if (childrenIterator) {
|
|
|
var step = childrenIterator.next();
|
|
|
var _i = 0;
|
|
|
|
|
|
for (; !step.done; step = childrenIterator.next()) {
|
|
|
if (!validateSuspenseListNestedChild(step.value, _i)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
_i++;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
error('A single row was passed to a <SuspenseList revealOrder="%s" />. ' + 'This is not useful since it needs multiple rows. ' + 'Did you mean to pass multiple children or an array?', revealOrder);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function initSuspenseListRenderState(workInProgress, isBackwards, tail, lastContentRow, tailMode) {
|
|
|
var renderState = workInProgress.memoizedState;
|
|
|
|
|
|
if (renderState === null) {
|
|
|
workInProgress.memoizedState = {
|
|
|
isBackwards: isBackwards,
|
|
|
rendering: null,
|
|
|
renderingStartTime: 0,
|
|
|
last: lastContentRow,
|
|
|
tail: tail,
|
|
|
tailMode: tailMode
|
|
|
};
|
|
|
} else {
|
|
|
// We can reuse the existing object from previous renders.
|
|
|
renderState.isBackwards = isBackwards;
|
|
|
renderState.rendering = null;
|
|
|
renderState.renderingStartTime = 0;
|
|
|
renderState.last = lastContentRow;
|
|
|
renderState.tail = tail;
|
|
|
renderState.tailMode = tailMode;
|
|
|
}
|
|
|
} // This can end up rendering this component multiple passes.
|
|
|
// The first pass splits the children fibers into two sets. A head and tail.
|
|
|
// We first render the head. If anything is in fallback state, we do another
|
|
|
// pass through beginWork to rerender all children (including the tail) with
|
|
|
// the force suspend context. If the first render didn't have anything in
|
|
|
// in fallback state. Then we render each row in the tail one-by-one.
|
|
|
// That happens in the completeWork phase without going back to beginWork.
|
|
|
|
|
|
|
|
|
function updateSuspenseListComponent(current, workInProgress, renderLanes) {
|
|
|
var nextProps = workInProgress.pendingProps;
|
|
|
var revealOrder = nextProps.revealOrder;
|
|
|
var tailMode = nextProps.tail;
|
|
|
var newChildren = nextProps.children;
|
|
|
validateRevealOrder(revealOrder);
|
|
|
validateTailOptions(tailMode, revealOrder);
|
|
|
validateSuspenseListChildren(newChildren, revealOrder);
|
|
|
reconcileChildren(current, workInProgress, newChildren, renderLanes);
|
|
|
var suspenseContext = suspenseStackCursor.current;
|
|
|
var shouldForceFallback = hasSuspenseContext(suspenseContext, ForceSuspenseFallback);
|
|
|
|
|
|
if (shouldForceFallback) {
|
|
|
suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback);
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
} else {
|
|
|
var didSuspendBefore = current !== null && (current.flags & DidCapture) !== NoFlags;
|
|
|
|
|
|
if (didSuspendBefore) {
|
|
|
// If we previously forced a fallback, we need to schedule work
|
|
|
// on any nested boundaries to let them know to try to render
|
|
|
// again. This is the same as context updating.
|
|
|
propagateSuspenseContextChange(workInProgress, workInProgress.child, renderLanes);
|
|
|
}
|
|
|
|
|
|
suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
|
|
|
}
|
|
|
|
|
|
pushSuspenseContext(workInProgress, suspenseContext);
|
|
|
|
|
|
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
// In legacy mode, SuspenseList doesn't work so we just
|
|
|
// use make it a noop by treating it as the default revealOrder.
|
|
|
workInProgress.memoizedState = null;
|
|
|
} else {
|
|
|
switch (revealOrder) {
|
|
|
case 'forwards':
|
|
|
{
|
|
|
var lastContentRow = findLastContentRow(workInProgress.child);
|
|
|
var tail;
|
|
|
|
|
|
if (lastContentRow === null) {
|
|
|
// The whole list is part of the tail.
|
|
|
// TODO: We could fast path by just rendering the tail now.
|
|
|
tail = workInProgress.child;
|
|
|
workInProgress.child = null;
|
|
|
} else {
|
|
|
// Disconnect the tail rows after the content row.
|
|
|
// We're going to render them separately later.
|
|
|
tail = lastContentRow.sibling;
|
|
|
lastContentRow.sibling = null;
|
|
|
}
|
|
|
|
|
|
initSuspenseListRenderState(workInProgress, false, // isBackwards
|
|
|
tail, lastContentRow, tailMode);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case 'backwards':
|
|
|
{
|
|
|
// We're going to find the first row that has existing content.
|
|
|
// At the same time we're going to reverse the list of everything
|
|
|
// we pass in the meantime. That's going to be our tail in reverse
|
|
|
// order.
|
|
|
var _tail = null;
|
|
|
var row = workInProgress.child;
|
|
|
workInProgress.child = null;
|
|
|
|
|
|
while (row !== null) {
|
|
|
var currentRow = row.alternate; // New rows can't be content rows.
|
|
|
|
|
|
if (currentRow !== null && findFirstSuspended(currentRow) === null) {
|
|
|
// This is the beginning of the main content.
|
|
|
workInProgress.child = row;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var nextRow = row.sibling;
|
|
|
row.sibling = _tail;
|
|
|
_tail = row;
|
|
|
row = nextRow;
|
|
|
} // TODO: If workInProgress.child is null, we can continue on the tail immediately.
|
|
|
|
|
|
|
|
|
initSuspenseListRenderState(workInProgress, true, // isBackwards
|
|
|
_tail, null, // last
|
|
|
tailMode);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case 'together':
|
|
|
{
|
|
|
initSuspenseListRenderState(workInProgress, false, // isBackwards
|
|
|
null, // tail
|
|
|
null, // last
|
|
|
undefined);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
// The default reveal order is the same as not having
|
|
|
// a boundary.
|
|
|
workInProgress.memoizedState = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function updatePortalComponent(current, workInProgress, renderLanes) {
|
|
|
pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo);
|
|
|
var nextChildren = workInProgress.pendingProps;
|
|
|
|
|
|
if (current === null) {
|
|
|
// Portals are special because we don't append the children during mount
|
|
|
// but at commit. Therefore we need to track insertions which the normal
|
|
|
// flow doesn't do during mount. This doesn't happen at the root because
|
|
|
// the root always starts with a "current" with a null child.
|
|
|
// TODO: Consider unifying this with how the root works.
|
|
|
workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes);
|
|
|
} else {
|
|
|
reconcileChildren(current, workInProgress, nextChildren, renderLanes);
|
|
|
}
|
|
|
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
var hasWarnedAboutUsingNoValuePropOnContextProvider = false;
|
|
|
|
|
|
function updateContextProvider(current, workInProgress, renderLanes) {
|
|
|
var providerType = workInProgress.type;
|
|
|
var context = providerType._context;
|
|
|
var newProps = workInProgress.pendingProps;
|
|
|
var oldProps = workInProgress.memoizedProps;
|
|
|
var newValue = newProps.value;
|
|
|
|
|
|
{
|
|
|
if (!('value' in newProps)) {
|
|
|
if (!hasWarnedAboutUsingNoValuePropOnContextProvider) {
|
|
|
hasWarnedAboutUsingNoValuePropOnContextProvider = true;
|
|
|
|
|
|
error('The `value` prop is required for the `<Context.Provider>`. Did you misspell it or forget to pass it?');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var providerPropTypes = workInProgress.type.propTypes;
|
|
|
|
|
|
if (providerPropTypes) {
|
|
|
checkPropTypes(providerPropTypes, newProps, 'prop', 'Context.Provider');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
pushProvider(workInProgress, context, newValue);
|
|
|
|
|
|
{
|
|
|
if (oldProps !== null) {
|
|
|
var oldValue = oldProps.value;
|
|
|
|
|
|
if (objectIs(oldValue, newValue)) {
|
|
|
// No change. Bailout early if children are the same.
|
|
|
if (oldProps.children === newProps.children && !hasContextChanged()) {
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
} else {
|
|
|
// The context value changed. Search for matching consumers and schedule
|
|
|
// them to update.
|
|
|
propagateContextChange(workInProgress, context, renderLanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var newChildren = newProps.children;
|
|
|
reconcileChildren(current, workInProgress, newChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
var hasWarnedAboutUsingContextAsConsumer = false;
|
|
|
|
|
|
function updateContextConsumer(current, workInProgress, renderLanes) {
|
|
|
var context = workInProgress.type; // The logic below for Context differs depending on PROD or DEV mode. In
|
|
|
// DEV mode, we create a separate object for Context.Consumer that acts
|
|
|
// like a proxy to Context. This proxy object adds unnecessary code in PROD
|
|
|
// so we use the old behaviour (Context.Consumer references Context) to
|
|
|
// reduce size and overhead. The separate object references context via
|
|
|
// a property called "_context", which also gives us the ability to check
|
|
|
// in DEV mode if this property exists or not and warn if it does not.
|
|
|
|
|
|
{
|
|
|
if (context._context === undefined) {
|
|
|
// This may be because it's a Context (rather than a Consumer).
|
|
|
// Or it may be because it's older React where they're the same thing.
|
|
|
// We only want to warn if we're sure it's a new React.
|
|
|
if (context !== context.Consumer) {
|
|
|
if (!hasWarnedAboutUsingContextAsConsumer) {
|
|
|
hasWarnedAboutUsingContextAsConsumer = true;
|
|
|
|
|
|
error('Rendering <Context> directly is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?');
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
context = context._context;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var newProps = workInProgress.pendingProps;
|
|
|
var render = newProps.children;
|
|
|
|
|
|
{
|
|
|
if (typeof render !== 'function') {
|
|
|
error('A context consumer was rendered with multiple children, or a child ' + "that isn't a function. A context consumer expects a single child " + 'that is a function. If you did pass a function, make sure there ' + 'is no trailing or leading whitespace around it.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
prepareToReadContext(workInProgress, renderLanes);
|
|
|
var newValue = readContext(context);
|
|
|
|
|
|
{
|
|
|
markComponentRenderStarted(workInProgress);
|
|
|
}
|
|
|
|
|
|
var newChildren;
|
|
|
|
|
|
{
|
|
|
ReactCurrentOwner$1.current = workInProgress;
|
|
|
setIsRendering(true);
|
|
|
newChildren = render(newValue);
|
|
|
setIsRendering(false);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markComponentRenderStopped();
|
|
|
} // React DevTools reads this flag.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= PerformedWork;
|
|
|
reconcileChildren(current, workInProgress, newChildren, renderLanes);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function markWorkInProgressReceivedUpdate() {
|
|
|
didReceiveUpdate = true;
|
|
|
}
|
|
|
|
|
|
function resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress) {
|
|
|
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
if (current !== null) {
|
|
|
// A lazy component only mounts if it suspended inside a non-
|
|
|
// concurrent tree, in an inconsistent state. We want to treat it like
|
|
|
// a new mount, even though an empty version of it already committed.
|
|
|
// Disconnect the alternate pointers.
|
|
|
current.alternate = null;
|
|
|
workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect
|
|
|
|
|
|
workInProgress.flags |= Placement;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes) {
|
|
|
if (current !== null) {
|
|
|
// Reuse previous dependencies
|
|
|
workInProgress.dependencies = current.dependencies;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// Don't update "base" render times for bailouts.
|
|
|
stopProfilerTimerIfRunning();
|
|
|
}
|
|
|
|
|
|
markSkippedUpdateLanes(workInProgress.lanes); // Check if the children have any pending work.
|
|
|
|
|
|
if (!includesSomeLane(renderLanes, workInProgress.childLanes)) {
|
|
|
// The children don't have any work either. We can skip them.
|
|
|
// TODO: Once we add back resuming, we should check if the children are
|
|
|
// a work-in-progress set. If so, we need to transfer their effects.
|
|
|
{
|
|
|
return null;
|
|
|
}
|
|
|
} // This fiber doesn't have work, but its subtree does. Clone the child
|
|
|
// fibers and continue.
|
|
|
|
|
|
|
|
|
cloneChildFibers(current, workInProgress);
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
function remountFiber(current, oldWorkInProgress, newWorkInProgress) {
|
|
|
{
|
|
|
var returnFiber = oldWorkInProgress.return;
|
|
|
|
|
|
if (returnFiber === null) {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
throw new Error('Cannot swap the root fiber.');
|
|
|
} // Disconnect from the old current.
|
|
|
// It will get deleted.
|
|
|
|
|
|
|
|
|
current.alternate = null;
|
|
|
oldWorkInProgress.alternate = null; // Connect to the new tree.
|
|
|
|
|
|
newWorkInProgress.index = oldWorkInProgress.index;
|
|
|
newWorkInProgress.sibling = oldWorkInProgress.sibling;
|
|
|
newWorkInProgress.return = oldWorkInProgress.return;
|
|
|
newWorkInProgress.ref = oldWorkInProgress.ref; // Replace the child/sibling pointers above it.
|
|
|
|
|
|
if (oldWorkInProgress === returnFiber.child) {
|
|
|
returnFiber.child = newWorkInProgress;
|
|
|
} else {
|
|
|
var prevSibling = returnFiber.child;
|
|
|
|
|
|
if (prevSibling === null) {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
throw new Error('Expected parent to have a child.');
|
|
|
}
|
|
|
|
|
|
while (prevSibling.sibling !== oldWorkInProgress) {
|
|
|
prevSibling = prevSibling.sibling;
|
|
|
|
|
|
if (prevSibling === null) {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
throw new Error('Expected to find the previous sibling.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
prevSibling.sibling = newWorkInProgress;
|
|
|
} // Delete the old fiber and place the new one.
|
|
|
// Since the old fiber is disconnected, we have to schedule it manually.
|
|
|
|
|
|
|
|
|
var deletions = returnFiber.deletions;
|
|
|
|
|
|
if (deletions === null) {
|
|
|
returnFiber.deletions = [current];
|
|
|
returnFiber.flags |= ChildDeletion;
|
|
|
} else {
|
|
|
deletions.push(current);
|
|
|
}
|
|
|
|
|
|
newWorkInProgress.flags |= Placement; // Restart work from the new fiber.
|
|
|
|
|
|
return newWorkInProgress;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function checkScheduledUpdateOrContext(current, renderLanes) {
|
|
|
// Before performing an early bailout, we must check if there are pending
|
|
|
// updates or context.
|
|
|
var updateLanes = current.lanes;
|
|
|
|
|
|
if (includesSomeLane(updateLanes, renderLanes)) {
|
|
|
return true;
|
|
|
} // No pending update, but because context is propagated lazily, we need
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
function attemptEarlyBailoutIfNoScheduledUpdate(current, workInProgress, renderLanes) {
|
|
|
// This fiber does not have any pending work. Bailout without entering
|
|
|
// the begin phase. There's still some bookkeeping we that needs to be done
|
|
|
// in this optimized path, mostly pushing stuff onto the stack.
|
|
|
switch (workInProgress.tag) {
|
|
|
case HostRoot:
|
|
|
pushHostRootContext(workInProgress);
|
|
|
var root = workInProgress.stateNode;
|
|
|
|
|
|
resetHydrationState();
|
|
|
break;
|
|
|
|
|
|
case HostComponent:
|
|
|
pushHostContext(workInProgress);
|
|
|
break;
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var Component = workInProgress.type;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
pushContextProvider(workInProgress);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo);
|
|
|
break;
|
|
|
|
|
|
case ContextProvider:
|
|
|
{
|
|
|
var newValue = workInProgress.memoizedProps.value;
|
|
|
var context = workInProgress.type._context;
|
|
|
pushProvider(workInProgress, context, newValue);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case Profiler:
|
|
|
{
|
|
|
// Profiler should only call onRender when one of its descendants actually rendered.
|
|
|
var hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes);
|
|
|
|
|
|
if (hasChildWork) {
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// Reset effect durations for the next eventual effect phase.
|
|
|
// These are reset during render to allow the DevTools commit hook a chance to read them,
|
|
|
var stateNode = workInProgress.stateNode;
|
|
|
stateNode.effectDuration = 0;
|
|
|
stateNode.passiveEffectDuration = 0;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
var state = workInProgress.memoizedState;
|
|
|
|
|
|
if (state !== null) {
|
|
|
if (state.dehydrated !== null) {
|
|
|
pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // We know that this component will suspend again because if it has
|
|
|
// been unsuspended it has committed as a resolved Suspense component.
|
|
|
// If it needs to be retried, it should have work scheduled on it.
|
|
|
|
|
|
workInProgress.flags |= DidCapture; // We should never render the children of a dehydrated boundary until we
|
|
|
// upgrade it. We return null instead of bailoutOnAlreadyFinishedWork.
|
|
|
|
|
|
return null;
|
|
|
} // If this boundary is currently timed out, we need to decide
|
|
|
// whether to retry the primary children, or to skip over it and
|
|
|
// go straight to the fallback. Check the priority of the primary
|
|
|
// child fragment.
|
|
|
|
|
|
|
|
|
var primaryChildFragment = workInProgress.child;
|
|
|
var primaryChildLanes = primaryChildFragment.childLanes;
|
|
|
|
|
|
if (includesSomeLane(renderLanes, primaryChildLanes)) {
|
|
|
// The primary children have pending work. Use the normal path
|
|
|
// to attempt to render the primary children again.
|
|
|
return updateSuspenseComponent(current, workInProgress, renderLanes);
|
|
|
} else {
|
|
|
// The primary child fragment does not have pending work marked
|
|
|
// on it
|
|
|
pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // The primary children do not have pending work with sufficient
|
|
|
// priority. Bailout.
|
|
|
|
|
|
var child = bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
|
|
|
if (child !== null) {
|
|
|
// The fallback children have pending work. Skip over the
|
|
|
// primary children and work on the fallback.
|
|
|
return child.sibling;
|
|
|
} else {
|
|
|
// Note: We can return `null` here because we already checked
|
|
|
// whether there were nested context consumers, via the call to
|
|
|
// `bailoutOnAlreadyFinishedWork` above.
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current));
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
{
|
|
|
var didSuspendBefore = (current.flags & DidCapture) !== NoFlags;
|
|
|
|
|
|
var _hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes);
|
|
|
|
|
|
if (didSuspendBefore) {
|
|
|
if (_hasChildWork) {
|
|
|
// If something was in fallback state last time, and we have all the
|
|
|
// same children then we're still in progressive loading state.
|
|
|
// Something might get unblocked by state updates or retries in the
|
|
|
// tree which will affect the tail. So we need to use the normal
|
|
|
// path to compute the correct tail.
|
|
|
return updateSuspenseListComponent(current, workInProgress, renderLanes);
|
|
|
} // If none of the children had any work, that means that none of
|
|
|
// them got retried so they'll still be blocked in the same way
|
|
|
// as before. We can fast bail out.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
} // If nothing suspended before and we're rendering the same children,
|
|
|
// then the tail doesn't matter. Anything new that suspends will work
|
|
|
// in the "together" mode, so we can continue from the state we had.
|
|
|
|
|
|
|
|
|
var renderState = workInProgress.memoizedState;
|
|
|
|
|
|
if (renderState !== null) {
|
|
|
// Reset to the "together" mode in case we've started a different
|
|
|
// update in the past but didn't complete it.
|
|
|
renderState.rendering = null;
|
|
|
renderState.tail = null;
|
|
|
renderState.lastEffect = null;
|
|
|
}
|
|
|
|
|
|
pushSuspenseContext(workInProgress, suspenseStackCursor.current);
|
|
|
|
|
|
if (_hasChildWork) {
|
|
|
break;
|
|
|
} else {
|
|
|
// If none of the children had any work, that means that none of
|
|
|
// them got retried so they'll still be blocked in the same way
|
|
|
// as before. We can fast bail out.
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
case LegacyHiddenComponent:
|
|
|
{
|
|
|
// Need to check if the tree still needs to be deferred. This is
|
|
|
// almost identical to the logic used in the normal update path,
|
|
|
// so we'll just enter that. The only difference is we'll bail out
|
|
|
// at the next level instead of this one, because the child props
|
|
|
// have not changed. Which is fine.
|
|
|
// TODO: Probably should refactor `beginWork` to split the bailout
|
|
|
// path from the normal path. I'm tempted to do a labeled break here
|
|
|
// but I won't :)
|
|
|
workInProgress.lanes = NoLanes;
|
|
|
return updateOffscreenComponent(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
function beginWork(current, workInProgress, renderLanes) {
|
|
|
{
|
|
|
if (workInProgress._debugNeedsRemount && current !== null) {
|
|
|
// This will restart the begin phase with a new fiber.
|
|
|
return remountFiber(current, workInProgress, createFiberFromTypeAndProps(workInProgress.type, workInProgress.key, workInProgress.pendingProps, workInProgress._debugOwner || null, workInProgress.mode, workInProgress.lanes));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (current !== null) {
|
|
|
var oldProps = current.memoizedProps;
|
|
|
var newProps = workInProgress.pendingProps;
|
|
|
|
|
|
if (oldProps !== newProps || hasContextChanged() || ( // Force a re-render if the implementation changed due to hot reload:
|
|
|
workInProgress.type !== current.type )) {
|
|
|
// If props or context changed, mark the fiber as having performed work.
|
|
|
// This may be unset if the props are determined to be equal later (memo).
|
|
|
didReceiveUpdate = true;
|
|
|
} else {
|
|
|
// Neither props nor legacy context changes. Check if there's a pending
|
|
|
// update or context change.
|
|
|
var hasScheduledUpdateOrContext = checkScheduledUpdateOrContext(current, renderLanes);
|
|
|
|
|
|
if (!hasScheduledUpdateOrContext && // If this is the second pass of an error or suspense boundary, there
|
|
|
// may not be work scheduled on `current`, so we check for this flag.
|
|
|
(workInProgress.flags & DidCapture) === NoFlags) {
|
|
|
// No pending updates or context. Bail out now.
|
|
|
didReceiveUpdate = false;
|
|
|
return attemptEarlyBailoutIfNoScheduledUpdate(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) {
|
|
|
// This is a special case that only exists for legacy mode.
|
|
|
// See https://github.com/facebook/react/pull/19216.
|
|
|
didReceiveUpdate = true;
|
|
|
} else {
|
|
|
// An update was scheduled on this fiber, but there are no new props
|
|
|
// nor legacy context. Set this to false. If an update queue or context
|
|
|
// consumer produces a changed value, it will set this to true. Otherwise,
|
|
|
// the component will assume the children have not changed and bail out.
|
|
|
didReceiveUpdate = false;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
didReceiveUpdate = false;
|
|
|
|
|
|
if (getIsHydrating() && isForkedChild(workInProgress)) {
|
|
|
// Check if this child belongs to a list of muliple children in
|
|
|
// its parent.
|
|
|
//
|
|
|
// In a true multi-threaded implementation, we would render children on
|
|
|
// parallel threads. This would represent the beginning of a new render
|
|
|
// thread for this subtree.
|
|
|
//
|
|
|
// We only use this for id generation during hydration, which is why the
|
|
|
// logic is located in this special branch.
|
|
|
var slotIndex = workInProgress.index;
|
|
|
var numberOfForks = getForksAtLevel();
|
|
|
pushTreeId(workInProgress, numberOfForks, slotIndex);
|
|
|
}
|
|
|
} // Before entering the begin phase, clear pending update priority.
|
|
|
// TODO: This assumes that we're about to evaluate the component and process
|
|
|
// the update queue. However, there's an exception: SimpleMemoComponent
|
|
|
// sometimes bails out later in the begin phase. This indicates that we should
|
|
|
// move this assignment out of the common path and into each branch.
|
|
|
|
|
|
|
|
|
workInProgress.lanes = NoLanes;
|
|
|
|
|
|
switch (workInProgress.tag) {
|
|
|
case IndeterminateComponent:
|
|
|
{
|
|
|
return mountIndeterminateComponent(current, workInProgress, workInProgress.type, renderLanes);
|
|
|
}
|
|
|
|
|
|
case LazyComponent:
|
|
|
{
|
|
|
var elementType = workInProgress.elementType;
|
|
|
return mountLazyComponent(current, workInProgress, elementType, renderLanes);
|
|
|
}
|
|
|
|
|
|
case FunctionComponent:
|
|
|
{
|
|
|
var Component = workInProgress.type;
|
|
|
var unresolvedProps = workInProgress.pendingProps;
|
|
|
var resolvedProps = workInProgress.elementType === Component ? unresolvedProps : resolveDefaultProps(Component, unresolvedProps);
|
|
|
return updateFunctionComponent(current, workInProgress, Component, resolvedProps, renderLanes);
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var _Component = workInProgress.type;
|
|
|
var _unresolvedProps = workInProgress.pendingProps;
|
|
|
|
|
|
var _resolvedProps = workInProgress.elementType === _Component ? _unresolvedProps : resolveDefaultProps(_Component, _unresolvedProps);
|
|
|
|
|
|
return updateClassComponent(current, workInProgress, _Component, _resolvedProps, renderLanes);
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
return updateHostRoot(current, workInProgress, renderLanes);
|
|
|
|
|
|
case HostComponent:
|
|
|
return updateHostComponent(current, workInProgress, renderLanes);
|
|
|
|
|
|
case HostText:
|
|
|
return updateHostText(current, workInProgress);
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
return updateSuspenseComponent(current, workInProgress, renderLanes);
|
|
|
|
|
|
case HostPortal:
|
|
|
return updatePortalComponent(current, workInProgress, renderLanes);
|
|
|
|
|
|
case ForwardRef:
|
|
|
{
|
|
|
var type = workInProgress.type;
|
|
|
var _unresolvedProps2 = workInProgress.pendingProps;
|
|
|
|
|
|
var _resolvedProps2 = workInProgress.elementType === type ? _unresolvedProps2 : resolveDefaultProps(type, _unresolvedProps2);
|
|
|
|
|
|
return updateForwardRef(current, workInProgress, type, _resolvedProps2, renderLanes);
|
|
|
}
|
|
|
|
|
|
case Fragment:
|
|
|
return updateFragment(current, workInProgress, renderLanes);
|
|
|
|
|
|
case Mode:
|
|
|
return updateMode(current, workInProgress, renderLanes);
|
|
|
|
|
|
case Profiler:
|
|
|
return updateProfiler(current, workInProgress, renderLanes);
|
|
|
|
|
|
case ContextProvider:
|
|
|
return updateContextProvider(current, workInProgress, renderLanes);
|
|
|
|
|
|
case ContextConsumer:
|
|
|
return updateContextConsumer(current, workInProgress, renderLanes);
|
|
|
|
|
|
case MemoComponent:
|
|
|
{
|
|
|
var _type2 = workInProgress.type;
|
|
|
var _unresolvedProps3 = workInProgress.pendingProps; // Resolve outer props first, then resolve inner props.
|
|
|
|
|
|
var _resolvedProps3 = resolveDefaultProps(_type2, _unresolvedProps3);
|
|
|
|
|
|
{
|
|
|
if (workInProgress.type !== workInProgress.elementType) {
|
|
|
var outerPropTypes = _type2.propTypes;
|
|
|
|
|
|
if (outerPropTypes) {
|
|
|
checkPropTypes(outerPropTypes, _resolvedProps3, // Resolved for outer only
|
|
|
'prop', getComponentNameFromType(_type2));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
_resolvedProps3 = resolveDefaultProps(_type2.type, _resolvedProps3);
|
|
|
return updateMemoComponent(current, workInProgress, _type2, _resolvedProps3, renderLanes);
|
|
|
}
|
|
|
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
return updateSimpleMemoComponent(current, workInProgress, workInProgress.type, workInProgress.pendingProps, renderLanes);
|
|
|
}
|
|
|
|
|
|
case IncompleteClassComponent:
|
|
|
{
|
|
|
var _Component2 = workInProgress.type;
|
|
|
var _unresolvedProps4 = workInProgress.pendingProps;
|
|
|
|
|
|
var _resolvedProps4 = workInProgress.elementType === _Component2 ? _unresolvedProps4 : resolveDefaultProps(_Component2, _unresolvedProps4);
|
|
|
|
|
|
return mountIncompleteClassComponent(current, workInProgress, _Component2, _resolvedProps4, renderLanes);
|
|
|
}
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
{
|
|
|
return updateSuspenseListComponent(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
|
|
|
case ScopeComponent:
|
|
|
{
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
{
|
|
|
return updateOffscreenComponent(current, workInProgress, renderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
throw new Error("Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in " + 'React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
function markUpdate(workInProgress) {
|
|
|
// Tag the fiber with an update effect. This turns a Placement into
|
|
|
// a PlacementAndUpdate.
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
|
|
|
function markRef$1(workInProgress) {
|
|
|
workInProgress.flags |= Ref;
|
|
|
|
|
|
{
|
|
|
workInProgress.flags |= RefStatic;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var appendAllChildren;
|
|
|
var updateHostContainer;
|
|
|
var updateHostComponent$1;
|
|
|
var updateHostText$1;
|
|
|
|
|
|
{
|
|
|
// Mutation mode
|
|
|
appendAllChildren = function (parent, workInProgress, needsVisibilityToggle, isHidden) {
|
|
|
// We only have the top Fiber that was created but we need recurse down its
|
|
|
// children to find all the terminal nodes.
|
|
|
var node = workInProgress.child;
|
|
|
|
|
|
while (node !== null) {
|
|
|
if (node.tag === HostComponent || node.tag === HostText) {
|
|
|
appendInitialChild(parent, node.stateNode);
|
|
|
} else if (node.tag === HostPortal) ; else if (node.child !== null) {
|
|
|
node.child.return = node;
|
|
|
node = node.child;
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (node === workInProgress) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || node.return === workInProgress) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
updateHostContainer = function (current, workInProgress) {// Noop
|
|
|
};
|
|
|
|
|
|
updateHostComponent$1 = function (current, workInProgress, type, newProps, rootContainerInstance) {
|
|
|
// If we have an alternate, that means this is an update and we need to
|
|
|
// schedule a side-effect to do the updates.
|
|
|
var oldProps = current.memoizedProps;
|
|
|
|
|
|
if (oldProps === newProps) {
|
|
|
// In mutation mode, this is sufficient for a bailout because
|
|
|
// we won't touch this node even if children changed.
|
|
|
return;
|
|
|
} // If we get updated because one of our children updated, we don't
|
|
|
// have newProps so we'll have to reuse them.
|
|
|
// TODO: Split the update API as separate for the props vs. children.
|
|
|
// Even better would be if children weren't special cased at all tho.
|
|
|
|
|
|
|
|
|
var instance = workInProgress.stateNode;
|
|
|
var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host
|
|
|
// component is hitting the resume path. Figure out why. Possibly
|
|
|
// related to `hidden`.
|
|
|
|
|
|
var updatePayload = prepareUpdate(instance, type, oldProps, newProps, rootContainerInstance, currentHostContext); // TODO: Type this specific to this type of component.
|
|
|
|
|
|
workInProgress.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there
|
|
|
// is a new ref we mark this as an update. All the work is done in commitWork.
|
|
|
|
|
|
if (updatePayload) {
|
|
|
markUpdate(workInProgress);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
updateHostText$1 = function (current, workInProgress, oldText, newText) {
|
|
|
// If the text differs, mark it as an update. All the work in done in commitWork.
|
|
|
if (oldText !== newText) {
|
|
|
markUpdate(workInProgress);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) {
|
|
|
if (getIsHydrating()) {
|
|
|
// If we're hydrating, we should consume as many items as we can
|
|
|
// so we don't leave any behind.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
switch (renderState.tailMode) {
|
|
|
case 'hidden':
|
|
|
{
|
|
|
// Any insertions at the end of the tail list after this point
|
|
|
// should be invisible. If there are already mounted boundaries
|
|
|
// anything before them are not considered for collapsing.
|
|
|
// Therefore we need to go through the whole tail to find if
|
|
|
// there are any.
|
|
|
var tailNode = renderState.tail;
|
|
|
var lastTailNode = null;
|
|
|
|
|
|
while (tailNode !== null) {
|
|
|
if (tailNode.alternate !== null) {
|
|
|
lastTailNode = tailNode;
|
|
|
}
|
|
|
|
|
|
tailNode = tailNode.sibling;
|
|
|
} // Next we're simply going to delete all insertions after the
|
|
|
// last rendered item.
|
|
|
|
|
|
|
|
|
if (lastTailNode === null) {
|
|
|
// All remaining items in the tail are insertions.
|
|
|
renderState.tail = null;
|
|
|
} else {
|
|
|
// Detach the insertion after the last node that was already
|
|
|
// inserted.
|
|
|
lastTailNode.sibling = null;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case 'collapsed':
|
|
|
{
|
|
|
// Any insertions at the end of the tail list after this point
|
|
|
// should be invisible. If there are already mounted boundaries
|
|
|
// anything before them are not considered for collapsing.
|
|
|
// Therefore we need to go through the whole tail to find if
|
|
|
// there are any.
|
|
|
var _tailNode = renderState.tail;
|
|
|
var _lastTailNode = null;
|
|
|
|
|
|
while (_tailNode !== null) {
|
|
|
if (_tailNode.alternate !== null) {
|
|
|
_lastTailNode = _tailNode;
|
|
|
}
|
|
|
|
|
|
_tailNode = _tailNode.sibling;
|
|
|
} // Next we're simply going to delete all insertions after the
|
|
|
// last rendered item.
|
|
|
|
|
|
|
|
|
if (_lastTailNode === null) {
|
|
|
// All remaining items in the tail are insertions.
|
|
|
if (!hasRenderedATailFallback && renderState.tail !== null) {
|
|
|
// We suspended during the head. We want to show at least one
|
|
|
// row at the tail. So we'll keep on and cut off the rest.
|
|
|
renderState.tail.sibling = null;
|
|
|
} else {
|
|
|
renderState.tail = null;
|
|
|
}
|
|
|
} else {
|
|
|
// Detach the insertion after the last node that was already
|
|
|
// inserted.
|
|
|
_lastTailNode.sibling = null;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function bubbleProperties(completedWork) {
|
|
|
var didBailout = completedWork.alternate !== null && completedWork.alternate.child === completedWork.child;
|
|
|
var newChildLanes = NoLanes;
|
|
|
var subtreeFlags = NoFlags;
|
|
|
|
|
|
if (!didBailout) {
|
|
|
// Bubble up the earliest expiration time.
|
|
|
if ( (completedWork.mode & ProfileMode) !== NoMode) {
|
|
|
// In profiling mode, resetChildExpirationTime is also used to reset
|
|
|
// profiler durations.
|
|
|
var actualDuration = completedWork.actualDuration;
|
|
|
var treeBaseDuration = completedWork.selfBaseDuration;
|
|
|
var child = completedWork.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
newChildLanes = mergeLanes(newChildLanes, mergeLanes(child.lanes, child.childLanes));
|
|
|
subtreeFlags |= child.subtreeFlags;
|
|
|
subtreeFlags |= child.flags; // When a fiber is cloned, its actualDuration is reset to 0. This value will
|
|
|
// only be updated if work is done on the fiber (i.e. it doesn't bailout).
|
|
|
// When work is done, it should bubble to the parent's actualDuration. If
|
|
|
// the fiber has not been cloned though, (meaning no work was done), then
|
|
|
// this value will reflect the amount of time spent working on a previous
|
|
|
// render. In that case it should not bubble. We determine whether it was
|
|
|
// cloned by comparing the child pointer.
|
|
|
|
|
|
actualDuration += child.actualDuration;
|
|
|
treeBaseDuration += child.treeBaseDuration;
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
|
|
|
completedWork.actualDuration = actualDuration;
|
|
|
completedWork.treeBaseDuration = treeBaseDuration;
|
|
|
} else {
|
|
|
var _child = completedWork.child;
|
|
|
|
|
|
while (_child !== null) {
|
|
|
newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child.lanes, _child.childLanes));
|
|
|
subtreeFlags |= _child.subtreeFlags;
|
|
|
subtreeFlags |= _child.flags; // Update the return pointer so the tree is consistent. This is a code
|
|
|
// smell because it assumes the commit phase is never concurrent with
|
|
|
// the render phase. Will address during refactor to alternate model.
|
|
|
|
|
|
_child.return = completedWork;
|
|
|
_child = _child.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
completedWork.subtreeFlags |= subtreeFlags;
|
|
|
} else {
|
|
|
// Bubble up the earliest expiration time.
|
|
|
if ( (completedWork.mode & ProfileMode) !== NoMode) {
|
|
|
// In profiling mode, resetChildExpirationTime is also used to reset
|
|
|
// profiler durations.
|
|
|
var _treeBaseDuration = completedWork.selfBaseDuration;
|
|
|
var _child2 = completedWork.child;
|
|
|
|
|
|
while (_child2 !== null) {
|
|
|
newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child2.lanes, _child2.childLanes)); // "Static" flags share the lifetime of the fiber/hook they belong to,
|
|
|
// so we should bubble those up even during a bailout. All the other
|
|
|
// flags have a lifetime only of a single render + commit, so we should
|
|
|
// ignore them.
|
|
|
|
|
|
subtreeFlags |= _child2.subtreeFlags & StaticMask;
|
|
|
subtreeFlags |= _child2.flags & StaticMask;
|
|
|
_treeBaseDuration += _child2.treeBaseDuration;
|
|
|
_child2 = _child2.sibling;
|
|
|
}
|
|
|
|
|
|
completedWork.treeBaseDuration = _treeBaseDuration;
|
|
|
} else {
|
|
|
var _child3 = completedWork.child;
|
|
|
|
|
|
while (_child3 !== null) {
|
|
|
newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child3.lanes, _child3.childLanes)); // "Static" flags share the lifetime of the fiber/hook they belong to,
|
|
|
// so we should bubble those up even during a bailout. All the other
|
|
|
// flags have a lifetime only of a single render + commit, so we should
|
|
|
// ignore them.
|
|
|
|
|
|
subtreeFlags |= _child3.subtreeFlags & StaticMask;
|
|
|
subtreeFlags |= _child3.flags & StaticMask; // Update the return pointer so the tree is consistent. This is a code
|
|
|
// smell because it assumes the commit phase is never concurrent with
|
|
|
// the render phase. Will address during refactor to alternate model.
|
|
|
|
|
|
_child3.return = completedWork;
|
|
|
_child3 = _child3.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
completedWork.subtreeFlags |= subtreeFlags;
|
|
|
}
|
|
|
|
|
|
completedWork.childLanes = newChildLanes;
|
|
|
return didBailout;
|
|
|
}
|
|
|
|
|
|
function completeDehydratedSuspenseBoundary(current, workInProgress, nextState) {
|
|
|
if (hasUnhydratedTailNodes() && (workInProgress.mode & ConcurrentMode) !== NoMode && (workInProgress.flags & DidCapture) === NoFlags) {
|
|
|
warnIfUnhydratedTailNodes(workInProgress);
|
|
|
resetHydrationState();
|
|
|
workInProgress.flags |= ForceClientRender | Incomplete | ShouldCapture;
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var wasHydrated = popHydrationState(workInProgress);
|
|
|
|
|
|
if (nextState !== null && nextState.dehydrated !== null) {
|
|
|
// We might be inside a hydration state the first time we're picking up this
|
|
|
// Suspense boundary, and also after we've reentered it for further hydration.
|
|
|
if (current === null) {
|
|
|
if (!wasHydrated) {
|
|
|
throw new Error('A dehydrated suspense component was completed without a hydrated node. ' + 'This is probably a bug in React.');
|
|
|
}
|
|
|
|
|
|
prepareToHydrateHostSuspenseInstance(workInProgress);
|
|
|
bubbleProperties(workInProgress);
|
|
|
|
|
|
{
|
|
|
if ((workInProgress.mode & ProfileMode) !== NoMode) {
|
|
|
var isTimedOutSuspense = nextState !== null;
|
|
|
|
|
|
if (isTimedOutSuspense) {
|
|
|
// Don't count time spent in a timed out Suspense subtree as part of the base duration.
|
|
|
var primaryChildFragment = workInProgress.child;
|
|
|
|
|
|
if (primaryChildFragment !== null) {
|
|
|
// $FlowFixMe Flow doesn't support type casting in combination with the -= operator
|
|
|
workInProgress.treeBaseDuration -= primaryChildFragment.treeBaseDuration;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
} else {
|
|
|
// We might have reentered this boundary to hydrate it. If so, we need to reset the hydration
|
|
|
// state since we're now exiting out of it. popHydrationState doesn't do that for us.
|
|
|
resetHydrationState();
|
|
|
|
|
|
if ((workInProgress.flags & DidCapture) === NoFlags) {
|
|
|
// This boundary did not suspend so it's now hydrated and unsuspended.
|
|
|
workInProgress.memoizedState = null;
|
|
|
} // If nothing suspended, we need to schedule an effect to mark this boundary
|
|
|
// as having hydrated so events know that they're free to be invoked.
|
|
|
// It's also a signal to replay events and the suspense callback.
|
|
|
// If something suspended, schedule an effect to attach retry listeners.
|
|
|
// So we might as well always mark this.
|
|
|
|
|
|
|
|
|
workInProgress.flags |= Update;
|
|
|
bubbleProperties(workInProgress);
|
|
|
|
|
|
{
|
|
|
if ((workInProgress.mode & ProfileMode) !== NoMode) {
|
|
|
var _isTimedOutSuspense = nextState !== null;
|
|
|
|
|
|
if (_isTimedOutSuspense) {
|
|
|
// Don't count time spent in a timed out Suspense subtree as part of the base duration.
|
|
|
var _primaryChildFragment = workInProgress.child;
|
|
|
|
|
|
if (_primaryChildFragment !== null) {
|
|
|
// $FlowFixMe Flow doesn't support type casting in combination with the -= operator
|
|
|
workInProgress.treeBaseDuration -= _primaryChildFragment.treeBaseDuration;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
} else {
|
|
|
// Successfully completed this tree. If this was a forced client render,
|
|
|
// there may have been recoverable errors during first hydration
|
|
|
// attempt. If so, add them to a queue so we can log them in the
|
|
|
// commit phase.
|
|
|
upgradeHydrationErrorsToRecoverable(); // Fall through to normal Suspense path
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function completeWork(current, workInProgress, renderLanes) {
|
|
|
var newProps = workInProgress.pendingProps; // Note: This intentionally doesn't check if we're hydrating because comparing
|
|
|
// to the current tree provider fiber is just as fast and less error-prone.
|
|
|
// Ideally we would have a special version of the work loop only
|
|
|
// for hydration.
|
|
|
|
|
|
popTreeContext(workInProgress);
|
|
|
|
|
|
switch (workInProgress.tag) {
|
|
|
case IndeterminateComponent:
|
|
|
case LazyComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case Fragment:
|
|
|
case Mode:
|
|
|
case Profiler:
|
|
|
case ContextConsumer:
|
|
|
case MemoComponent:
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var Component = workInProgress.type;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
popContext(workInProgress);
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var fiberRoot = workInProgress.stateNode;
|
|
|
popHostContainer(workInProgress);
|
|
|
popTopLevelContextObject(workInProgress);
|
|
|
resetWorkInProgressVersions();
|
|
|
|
|
|
if (fiberRoot.pendingContext) {
|
|
|
fiberRoot.context = fiberRoot.pendingContext;
|
|
|
fiberRoot.pendingContext = null;
|
|
|
}
|
|
|
|
|
|
if (current === null || current.child === null) {
|
|
|
// If we hydrated, pop so that we can delete any remaining children
|
|
|
// that weren't hydrated.
|
|
|
var wasHydrated = popHydrationState(workInProgress);
|
|
|
|
|
|
if (wasHydrated) {
|
|
|
// If we hydrated, then we'll need to schedule an update for
|
|
|
// the commit side-effects on the root.
|
|
|
markUpdate(workInProgress);
|
|
|
} else {
|
|
|
if (current !== null) {
|
|
|
var prevState = current.memoizedState;
|
|
|
|
|
|
if ( // Check if this is a client root
|
|
|
!prevState.isDehydrated || // Check if we reverted to client rendering (e.g. due to an error)
|
|
|
(workInProgress.flags & ForceClientRender) !== NoFlags) {
|
|
|
// Schedule an effect to clear this container at the start of the
|
|
|
// next commit. This handles the case of React rendering into a
|
|
|
// container with previous children. It's also safe to do for
|
|
|
// updates too, because current.child would only be null if the
|
|
|
// previous render was null (so the container would already
|
|
|
// be empty).
|
|
|
workInProgress.flags |= Snapshot; // If this was a forced client render, there may have been
|
|
|
// recoverable errors during first hydration attempt. If so, add
|
|
|
// them to a queue so we can log them in the commit phase.
|
|
|
|
|
|
upgradeHydrationErrorsToRecoverable();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
updateHostContainer(current, workInProgress);
|
|
|
bubbleProperties(workInProgress);
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
popHostContext(workInProgress);
|
|
|
var rootContainerInstance = getRootHostContainer();
|
|
|
var type = workInProgress.type;
|
|
|
|
|
|
if (current !== null && workInProgress.stateNode != null) {
|
|
|
updateHostComponent$1(current, workInProgress, type, newProps, rootContainerInstance);
|
|
|
|
|
|
if (current.ref !== workInProgress.ref) {
|
|
|
markRef$1(workInProgress);
|
|
|
}
|
|
|
} else {
|
|
|
if (!newProps) {
|
|
|
if (workInProgress.stateNode === null) {
|
|
|
throw new Error('We must have new props for new mounts. This error is likely ' + 'caused by a bug in React. Please file an issue.');
|
|
|
} // This can happen when we abort work.
|
|
|
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var currentHostContext = getHostContext(); // TODO: Move createInstance to beginWork and keep it on a context
|
|
|
// "stack" as the parent. Then append children as we go in beginWork
|
|
|
// or completeWork depending on whether we want to add them top->down or
|
|
|
// bottom->up. Top->down is faster in IE11.
|
|
|
|
|
|
var _wasHydrated = popHydrationState(workInProgress);
|
|
|
|
|
|
if (_wasHydrated) {
|
|
|
// TODO: Move this and createInstance step into the beginPhase
|
|
|
// to consolidate.
|
|
|
if (prepareToHydrateHostInstance(workInProgress, rootContainerInstance, currentHostContext)) {
|
|
|
// If changes to the hydrated node need to be applied at the
|
|
|
// commit-phase we mark this as such.
|
|
|
markUpdate(workInProgress);
|
|
|
}
|
|
|
} else {
|
|
|
var instance = createInstance(type, newProps, rootContainerInstance, currentHostContext, workInProgress);
|
|
|
appendAllChildren(instance, workInProgress, false, false);
|
|
|
workInProgress.stateNode = instance; // Certain renderers require commit-time effects for initial mount.
|
|
|
// (eg DOM renderer supports auto-focus for certain elements).
|
|
|
// Make sure such renderers get scheduled for later work.
|
|
|
|
|
|
if (finalizeInitialChildren(instance, type, newProps, rootContainerInstance)) {
|
|
|
markUpdate(workInProgress);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (workInProgress.ref !== null) {
|
|
|
// If there is a ref on a host node we need to schedule a callback
|
|
|
markRef$1(workInProgress);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostText:
|
|
|
{
|
|
|
var newText = newProps;
|
|
|
|
|
|
if (current && workInProgress.stateNode != null) {
|
|
|
var oldText = current.memoizedProps; // If we have an alternate, that means this is an update and we need
|
|
|
// to schedule a side-effect to do the updates.
|
|
|
|
|
|
updateHostText$1(current, workInProgress, oldText, newText);
|
|
|
} else {
|
|
|
if (typeof newText !== 'string') {
|
|
|
if (workInProgress.stateNode === null) {
|
|
|
throw new Error('We must have new props for new mounts. This error is likely ' + 'caused by a bug in React. Please file an issue.');
|
|
|
} // This can happen when we abort work.
|
|
|
|
|
|
}
|
|
|
|
|
|
var _rootContainerInstance = getRootHostContainer();
|
|
|
|
|
|
var _currentHostContext = getHostContext();
|
|
|
|
|
|
var _wasHydrated2 = popHydrationState(workInProgress);
|
|
|
|
|
|
if (_wasHydrated2) {
|
|
|
if (prepareToHydrateHostTextInstance(workInProgress)) {
|
|
|
markUpdate(workInProgress);
|
|
|
}
|
|
|
} else {
|
|
|
workInProgress.stateNode = createTextInstance(newText, _rootContainerInstance, _currentHostContext, workInProgress);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
popSuspenseContext(workInProgress);
|
|
|
var nextState = workInProgress.memoizedState; // Special path for dehydrated boundaries. We may eventually move this
|
|
|
// to its own fiber type so that we can add other kinds of hydration
|
|
|
// boundaries that aren't associated with a Suspense tree. In anticipation
|
|
|
// of such a refactor, all the hydration logic is contained in
|
|
|
// this branch.
|
|
|
|
|
|
if (current === null || current.memoizedState !== null && current.memoizedState.dehydrated !== null) {
|
|
|
var fallthroughToNormalSuspensePath = completeDehydratedSuspenseBoundary(current, workInProgress, nextState);
|
|
|
|
|
|
if (!fallthroughToNormalSuspensePath) {
|
|
|
if (workInProgress.flags & ShouldCapture) {
|
|
|
// Special case. There were remaining unhydrated nodes. We treat
|
|
|
// this as a mismatch. Revert to client rendering.
|
|
|
return workInProgress;
|
|
|
} else {
|
|
|
// Did not finish hydrating, either because this is the initial
|
|
|
// render or because something suspended.
|
|
|
return null;
|
|
|
}
|
|
|
} // Continue with the normal Suspense path.
|
|
|
|
|
|
}
|
|
|
|
|
|
if ((workInProgress.flags & DidCapture) !== NoFlags) {
|
|
|
// Something suspended. Re-render with the fallback children.
|
|
|
workInProgress.lanes = renderLanes; // Do not reset the effect list.
|
|
|
|
|
|
if ( (workInProgress.mode & ProfileMode) !== NoMode) {
|
|
|
transferActualDuration(workInProgress);
|
|
|
} // Don't bubble properties in this case.
|
|
|
|
|
|
|
|
|
return workInProgress;
|
|
|
}
|
|
|
|
|
|
var nextDidTimeout = nextState !== null;
|
|
|
var prevDidTimeout = current !== null && current.memoizedState !== null;
|
|
|
// a passive effect, which is when we process the transitions
|
|
|
|
|
|
|
|
|
if (nextDidTimeout !== prevDidTimeout) {
|
|
|
// an effect to toggle the subtree's visibility. When we switch from
|
|
|
// fallback -> primary, the inner Offscreen fiber schedules this effect
|
|
|
// as part of its normal complete phase. But when we switch from
|
|
|
// primary -> fallback, the inner Offscreen fiber does not have a complete
|
|
|
// phase. So we need to schedule its effect here.
|
|
|
//
|
|
|
// We also use this flag to connect/disconnect the effects, but the same
|
|
|
// logic applies: when re-connecting, the Offscreen fiber's complete
|
|
|
// phase will handle scheduling the effect. It's only when the fallback
|
|
|
// is active that we have to do anything special.
|
|
|
|
|
|
|
|
|
if (nextDidTimeout) {
|
|
|
var _offscreenFiber2 = workInProgress.child;
|
|
|
_offscreenFiber2.flags |= Visibility; // TODO: This will still suspend a synchronous tree if anything
|
|
|
// in the concurrent tree already suspended during this render.
|
|
|
// This is a known bug.
|
|
|
|
|
|
if ((workInProgress.mode & ConcurrentMode) !== NoMode) {
|
|
|
// TODO: Move this back to throwException because this is too late
|
|
|
// if this is a large tree which is common for initial loads. We
|
|
|
// don't know if we should restart a render or not until we get
|
|
|
// this marker, and this is too late.
|
|
|
// If this render already had a ping or lower pri updates,
|
|
|
// and this is the first time we know we're going to suspend we
|
|
|
// should be able to immediately restart from within throwException.
|
|
|
var hasInvisibleChildContext = current === null && (workInProgress.memoizedProps.unstable_avoidThisFallback !== true || !enableSuspenseAvoidThisFallback);
|
|
|
|
|
|
if (hasInvisibleChildContext || hasSuspenseContext(suspenseStackCursor.current, InvisibleParentSuspenseContext)) {
|
|
|
// If this was in an invisible tree or a new render, then showing
|
|
|
// this boundary is ok.
|
|
|
renderDidSuspend();
|
|
|
} else {
|
|
|
// Otherwise, we're going to have to hide content so we should
|
|
|
// suspend for longer if possible.
|
|
|
renderDidSuspendDelayIfPossible();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var wakeables = workInProgress.updateQueue;
|
|
|
|
|
|
if (wakeables !== null) {
|
|
|
// Schedule an effect to attach a retry listener to the promise.
|
|
|
// TODO: Move to passive phase
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
|
|
|
{
|
|
|
if ((workInProgress.mode & ProfileMode) !== NoMode) {
|
|
|
if (nextDidTimeout) {
|
|
|
// Don't count time spent in a timed out Suspense subtree as part of the base duration.
|
|
|
var primaryChildFragment = workInProgress.child;
|
|
|
|
|
|
if (primaryChildFragment !== null) {
|
|
|
// $FlowFixMe Flow doesn't support type casting in combination with the -= operator
|
|
|
workInProgress.treeBaseDuration -= primaryChildFragment.treeBaseDuration;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
popHostContainer(workInProgress);
|
|
|
updateHostContainer(current, workInProgress);
|
|
|
|
|
|
if (current === null) {
|
|
|
preparePortalMount(workInProgress.stateNode.containerInfo);
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
|
|
|
case ContextProvider:
|
|
|
// Pop provider fiber
|
|
|
var context = workInProgress.type._context;
|
|
|
popProvider(context, workInProgress);
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
|
|
|
case IncompleteClassComponent:
|
|
|
{
|
|
|
// Same as class component case. I put it down here so that the tags are
|
|
|
// sequential to ensure this switch is compiled to a jump table.
|
|
|
var _Component = workInProgress.type;
|
|
|
|
|
|
if (isContextProvider(_Component)) {
|
|
|
popContext(workInProgress);
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
{
|
|
|
popSuspenseContext(workInProgress);
|
|
|
var renderState = workInProgress.memoizedState;
|
|
|
|
|
|
if (renderState === null) {
|
|
|
// We're running in the default, "independent" mode.
|
|
|
// We don't do anything in this mode.
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var didSuspendAlready = (workInProgress.flags & DidCapture) !== NoFlags;
|
|
|
var renderedTail = renderState.rendering;
|
|
|
|
|
|
if (renderedTail === null) {
|
|
|
// We just rendered the head.
|
|
|
if (!didSuspendAlready) {
|
|
|
// This is the first pass. We need to figure out if anything is still
|
|
|
// suspended in the rendered set.
|
|
|
// If new content unsuspended, but there's still some content that
|
|
|
// didn't. Then we need to do a second pass that forces everything
|
|
|
// to keep showing their fallbacks.
|
|
|
// We might be suspended if something in this render pass suspended, or
|
|
|
// something in the previous committed pass suspended. Otherwise,
|
|
|
// there's no chance so we can skip the expensive call to
|
|
|
// findFirstSuspended.
|
|
|
var cannotBeSuspended = renderHasNotSuspendedYet() && (current === null || (current.flags & DidCapture) === NoFlags);
|
|
|
|
|
|
if (!cannotBeSuspended) {
|
|
|
var row = workInProgress.child;
|
|
|
|
|
|
while (row !== null) {
|
|
|
var suspended = findFirstSuspended(row);
|
|
|
|
|
|
if (suspended !== null) {
|
|
|
didSuspendAlready = true;
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
cutOffTailIfNeeded(renderState, false); // If this is a newly suspended tree, it might not get committed as
|
|
|
// part of the second pass. In that case nothing will subscribe to
|
|
|
// its thenables. Instead, we'll transfer its thenables to the
|
|
|
// SuspenseList so that it can retry if they resolve.
|
|
|
// There might be multiple of these in the list but since we're
|
|
|
// going to wait for all of them anyway, it doesn't really matter
|
|
|
// which ones gets to ping. In theory we could get clever and keep
|
|
|
// track of how many dependencies remain but it gets tricky because
|
|
|
// in the meantime, we can add/remove/change items and dependencies.
|
|
|
// We might bail out of the loop before finding any but that
|
|
|
// doesn't matter since that means that the other boundaries that
|
|
|
// we did find already has their listeners attached.
|
|
|
|
|
|
var newThenables = suspended.updateQueue;
|
|
|
|
|
|
if (newThenables !== null) {
|
|
|
workInProgress.updateQueue = newThenables;
|
|
|
workInProgress.flags |= Update;
|
|
|
} // Rerender the whole list, but this time, we'll force fallbacks
|
|
|
// to stay in place.
|
|
|
// Reset the effect flags before doing the second pass since that's now invalid.
|
|
|
// Reset the child fibers to their original state.
|
|
|
|
|
|
|
|
|
workInProgress.subtreeFlags = NoFlags;
|
|
|
resetChildFibers(workInProgress, renderLanes); // Set up the Suspense Context to force suspense and immediately
|
|
|
// rerender the children.
|
|
|
|
|
|
pushSuspenseContext(workInProgress, setShallowSuspenseContext(suspenseStackCursor.current, ForceSuspenseFallback)); // Don't bubble properties in this case.
|
|
|
|
|
|
return workInProgress.child;
|
|
|
}
|
|
|
|
|
|
row = row.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (renderState.tail !== null && now() > getRenderTargetTime()) {
|
|
|
// We have already passed our CPU deadline but we still have rows
|
|
|
// left in the tail. We'll just give up further attempts to render
|
|
|
// the main content and only render fallbacks.
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
didSuspendAlready = true;
|
|
|
cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this
|
|
|
// to get it started back up to attempt the next item. While in terms
|
|
|
// of priority this work has the same priority as this current render,
|
|
|
// it's not part of the same transition once the transition has
|
|
|
// committed. If it's sync, we still want to yield so that it can be
|
|
|
// painted. Conceptually, this is really the same as pinging.
|
|
|
// We can use any RetryLane even if it's the one currently rendering
|
|
|
// since we're leaving it behind on this node.
|
|
|
|
|
|
workInProgress.lanes = SomeRetryLane;
|
|
|
}
|
|
|
} else {
|
|
|
cutOffTailIfNeeded(renderState, false);
|
|
|
} // Next we're going to render the tail.
|
|
|
|
|
|
} else {
|
|
|
// Append the rendered row to the child list.
|
|
|
if (!didSuspendAlready) {
|
|
|
var _suspended = findFirstSuspended(renderedTail);
|
|
|
|
|
|
if (_suspended !== null) {
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
didSuspendAlready = true; // Ensure we transfer the update queue to the parent so that it doesn't
|
|
|
// get lost if this row ends up dropped during a second pass.
|
|
|
|
|
|
var _newThenables = _suspended.updateQueue;
|
|
|
|
|
|
if (_newThenables !== null) {
|
|
|
workInProgress.updateQueue = _newThenables;
|
|
|
workInProgress.flags |= Update;
|
|
|
}
|
|
|
|
|
|
cutOffTailIfNeeded(renderState, true); // This might have been modified.
|
|
|
|
|
|
if (renderState.tail === null && renderState.tailMode === 'hidden' && !renderedTail.alternate && !getIsHydrating() // We don't cut it if we're hydrating.
|
|
|
) {
|
|
|
// We're done.
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
} else if ( // The time it took to render last row is greater than the remaining
|
|
|
// time we have to render. So rendering one more row would likely
|
|
|
// exceed it.
|
|
|
now() * 2 - renderState.renderingStartTime > getRenderTargetTime() && renderLanes !== OffscreenLane) {
|
|
|
// We have now passed our CPU deadline and we'll just give up further
|
|
|
// attempts to render the main content and only render fallbacks.
|
|
|
// The assumption is that this is usually faster.
|
|
|
workInProgress.flags |= DidCapture;
|
|
|
didSuspendAlready = true;
|
|
|
cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this
|
|
|
// to get it started back up to attempt the next item. While in terms
|
|
|
// of priority this work has the same priority as this current render,
|
|
|
// it's not part of the same transition once the transition has
|
|
|
// committed. If it's sync, we still want to yield so that it can be
|
|
|
// painted. Conceptually, this is really the same as pinging.
|
|
|
// We can use any RetryLane even if it's the one currently rendering
|
|
|
// since we're leaving it behind on this node.
|
|
|
|
|
|
workInProgress.lanes = SomeRetryLane;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (renderState.isBackwards) {
|
|
|
// The effect list of the backwards tail will have been added
|
|
|
// to the end. This breaks the guarantee that life-cycles fire in
|
|
|
// sibling order but that isn't a strong guarantee promised by React.
|
|
|
// Especially since these might also just pop in during future commits.
|
|
|
// Append to the beginning of the list.
|
|
|
renderedTail.sibling = workInProgress.child;
|
|
|
workInProgress.child = renderedTail;
|
|
|
} else {
|
|
|
var previousSibling = renderState.last;
|
|
|
|
|
|
if (previousSibling !== null) {
|
|
|
previousSibling.sibling = renderedTail;
|
|
|
} else {
|
|
|
workInProgress.child = renderedTail;
|
|
|
}
|
|
|
|
|
|
renderState.last = renderedTail;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (renderState.tail !== null) {
|
|
|
// We still have tail rows to render.
|
|
|
// Pop a row.
|
|
|
var next = renderState.tail;
|
|
|
renderState.rendering = next;
|
|
|
renderState.tail = next.sibling;
|
|
|
renderState.renderingStartTime = now();
|
|
|
next.sibling = null; // Restore the context.
|
|
|
// TODO: We can probably just avoid popping it instead and only
|
|
|
// setting it the first time we go from not suspended to suspended.
|
|
|
|
|
|
var suspenseContext = suspenseStackCursor.current;
|
|
|
|
|
|
if (didSuspendAlready) {
|
|
|
suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback);
|
|
|
} else {
|
|
|
suspenseContext = setDefaultShallowSuspenseContext(suspenseContext);
|
|
|
}
|
|
|
|
|
|
pushSuspenseContext(workInProgress, suspenseContext); // Do a pass over the next row.
|
|
|
// Don't bubble properties in this case.
|
|
|
|
|
|
return next;
|
|
|
}
|
|
|
|
|
|
bubbleProperties(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case ScopeComponent:
|
|
|
{
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
case LegacyHiddenComponent:
|
|
|
{
|
|
|
popRenderLanes(workInProgress);
|
|
|
var _nextState = workInProgress.memoizedState;
|
|
|
var nextIsHidden = _nextState !== null;
|
|
|
|
|
|
if (current !== null) {
|
|
|
var _prevState = current.memoizedState;
|
|
|
var prevIsHidden = _prevState !== null;
|
|
|
|
|
|
if (prevIsHidden !== nextIsHidden && ( // LegacyHidden doesn't do any hiding — it only pre-renders.
|
|
|
!enableLegacyHidden )) {
|
|
|
workInProgress.flags |= Visibility;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (!nextIsHidden || (workInProgress.mode & ConcurrentMode) === NoMode) {
|
|
|
bubbleProperties(workInProgress);
|
|
|
} else {
|
|
|
// Don't bubble properties for hidden children unless we're rendering
|
|
|
// at offscreen priority.
|
|
|
if (includesSomeLane(subtreeRenderLanes, OffscreenLane)) {
|
|
|
bubbleProperties(workInProgress);
|
|
|
|
|
|
{
|
|
|
// Check if there was an insertion or update in the hidden subtree.
|
|
|
// If so, we need to hide those nodes in the commit phase, so
|
|
|
// schedule a visibility effect.
|
|
|
if ( workInProgress.subtreeFlags & (Placement | Update)) {
|
|
|
workInProgress.flags |= Visibility;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case CacheComponent:
|
|
|
{
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case TracingMarkerComponent:
|
|
|
{
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
throw new Error("Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in " + 'React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
function unwindWork(current, workInProgress, renderLanes) {
|
|
|
// Note: This intentionally doesn't check if we're hydrating because comparing
|
|
|
// to the current tree provider fiber is just as fast and less error-prone.
|
|
|
// Ideally we would have a special version of the work loop only
|
|
|
// for hydration.
|
|
|
popTreeContext(workInProgress);
|
|
|
|
|
|
switch (workInProgress.tag) {
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var Component = workInProgress.type;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
popContext(workInProgress);
|
|
|
}
|
|
|
|
|
|
var flags = workInProgress.flags;
|
|
|
|
|
|
if (flags & ShouldCapture) {
|
|
|
workInProgress.flags = flags & ~ShouldCapture | DidCapture;
|
|
|
|
|
|
if ( (workInProgress.mode & ProfileMode) !== NoMode) {
|
|
|
transferActualDuration(workInProgress);
|
|
|
}
|
|
|
|
|
|
return workInProgress;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var root = workInProgress.stateNode;
|
|
|
popHostContainer(workInProgress);
|
|
|
popTopLevelContextObject(workInProgress);
|
|
|
resetWorkInProgressVersions();
|
|
|
var _flags = workInProgress.flags;
|
|
|
|
|
|
if ((_flags & ShouldCapture) !== NoFlags && (_flags & DidCapture) === NoFlags) {
|
|
|
// There was an error during render that wasn't captured by a suspense
|
|
|
// boundary. Do a second pass on the root to unmount the children.
|
|
|
workInProgress.flags = _flags & ~ShouldCapture | DidCapture;
|
|
|
return workInProgress;
|
|
|
} // We unwound to the root without completing it. Exit.
|
|
|
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
// TODO: popHydrationState
|
|
|
popHostContext(workInProgress);
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
popSuspenseContext(workInProgress);
|
|
|
var suspenseState = workInProgress.memoizedState;
|
|
|
|
|
|
if (suspenseState !== null && suspenseState.dehydrated !== null) {
|
|
|
if (workInProgress.alternate === null) {
|
|
|
throw new Error('Threw in newly mounted dehydrated component. This is likely a bug in ' + 'React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
resetHydrationState();
|
|
|
}
|
|
|
|
|
|
var _flags2 = workInProgress.flags;
|
|
|
|
|
|
if (_flags2 & ShouldCapture) {
|
|
|
workInProgress.flags = _flags2 & ~ShouldCapture | DidCapture; // Captured a suspense effect. Re-render the boundary.
|
|
|
|
|
|
if ( (workInProgress.mode & ProfileMode) !== NoMode) {
|
|
|
transferActualDuration(workInProgress);
|
|
|
}
|
|
|
|
|
|
return workInProgress;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
{
|
|
|
popSuspenseContext(workInProgress); // SuspenseList doesn't actually catch anything. It should've been
|
|
|
// caught by a nested boundary. If not, it should bubble through.
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
popHostContainer(workInProgress);
|
|
|
return null;
|
|
|
|
|
|
case ContextProvider:
|
|
|
var context = workInProgress.type._context;
|
|
|
popProvider(context, workInProgress);
|
|
|
return null;
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
case LegacyHiddenComponent:
|
|
|
popRenderLanes(workInProgress);
|
|
|
return null;
|
|
|
|
|
|
case CacheComponent:
|
|
|
|
|
|
return null;
|
|
|
|
|
|
default:
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function unwindInterruptedWork(current, interruptedWork, renderLanes) {
|
|
|
// Note: This intentionally doesn't check if we're hydrating because comparing
|
|
|
// to the current tree provider fiber is just as fast and less error-prone.
|
|
|
// Ideally we would have a special version of the work loop only
|
|
|
// for hydration.
|
|
|
popTreeContext(interruptedWork);
|
|
|
|
|
|
switch (interruptedWork.tag) {
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var childContextTypes = interruptedWork.type.childContextTypes;
|
|
|
|
|
|
if (childContextTypes !== null && childContextTypes !== undefined) {
|
|
|
popContext(interruptedWork);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var root = interruptedWork.stateNode;
|
|
|
popHostContainer(interruptedWork);
|
|
|
popTopLevelContextObject(interruptedWork);
|
|
|
resetWorkInProgressVersions();
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
popHostContext(interruptedWork);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
popHostContainer(interruptedWork);
|
|
|
break;
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
popSuspenseContext(interruptedWork);
|
|
|
break;
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
popSuspenseContext(interruptedWork);
|
|
|
break;
|
|
|
|
|
|
case ContextProvider:
|
|
|
var context = interruptedWork.type._context;
|
|
|
popProvider(context, interruptedWork);
|
|
|
break;
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
case LegacyHiddenComponent:
|
|
|
popRenderLanes(interruptedWork);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnAboutUndefinedSnapshotBeforeUpdate = null;
|
|
|
|
|
|
{
|
|
|
didWarnAboutUndefinedSnapshotBeforeUpdate = new Set();
|
|
|
} // Used during the commit phase to track the state of the Offscreen component stack.
|
|
|
// Allows us to avoid traversing the return path to find the nearest Offscreen ancestor.
|
|
|
// Only used when enableSuspenseLayoutEffectSemantics is enabled.
|
|
|
|
|
|
|
|
|
var offscreenSubtreeIsHidden = false;
|
|
|
var offscreenSubtreeWasHidden = false;
|
|
|
var PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set;
|
|
|
var nextEffect = null; // Used for Profiling builds to track updaters.
|
|
|
|
|
|
var inProgressLanes = null;
|
|
|
var inProgressRoot = null;
|
|
|
function reportUncaughtErrorInDEV(error) {
|
|
|
// Wrapping each small part of the commit phase into a guarded
|
|
|
// callback is a bit too slow (https://github.com/facebook/react/pull/21666).
|
|
|
// But we rely on it to surface errors to DEV tools like overlays
|
|
|
// (https://github.com/facebook/react/issues/21712).
|
|
|
// As a compromise, rethrow only caught errors in a guard.
|
|
|
{
|
|
|
invokeGuardedCallback(null, function () {
|
|
|
throw error;
|
|
|
});
|
|
|
clearCaughtError();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var callComponentWillUnmountWithTimer = function (current, instance) {
|
|
|
instance.props = current.memoizedProps;
|
|
|
instance.state = current.memoizedState;
|
|
|
|
|
|
if ( current.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
instance.componentWillUnmount();
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(current);
|
|
|
}
|
|
|
} else {
|
|
|
instance.componentWillUnmount();
|
|
|
}
|
|
|
}; // Capture errors so they don't interrupt mounting.
|
|
|
|
|
|
|
|
|
function safelyCallCommitHookLayoutEffectListMount(current, nearestMountedAncestor) {
|
|
|
try {
|
|
|
commitHookEffectListMount(Layout, current);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(current, nearestMountedAncestor, error);
|
|
|
}
|
|
|
} // Capture errors so they don't interrupt unmounting.
|
|
|
|
|
|
|
|
|
function safelyCallComponentWillUnmount(current, nearestMountedAncestor, instance) {
|
|
|
try {
|
|
|
callComponentWillUnmountWithTimer(current, instance);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(current, nearestMountedAncestor, error);
|
|
|
}
|
|
|
} // Capture errors so they don't interrupt mounting.
|
|
|
|
|
|
|
|
|
function safelyCallComponentDidMount(current, nearestMountedAncestor, instance) {
|
|
|
try {
|
|
|
instance.componentDidMount();
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(current, nearestMountedAncestor, error);
|
|
|
}
|
|
|
} // Capture errors so they don't interrupt mounting.
|
|
|
|
|
|
|
|
|
function safelyAttachRef(current, nearestMountedAncestor) {
|
|
|
try {
|
|
|
commitAttachRef(current);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(current, nearestMountedAncestor, error);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function safelyDetachRef(current, nearestMountedAncestor) {
|
|
|
var ref = current.ref;
|
|
|
|
|
|
if (ref !== null) {
|
|
|
if (typeof ref === 'function') {
|
|
|
var retVal;
|
|
|
|
|
|
try {
|
|
|
if (enableProfilerTimer && enableProfilerCommitHooks && current.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
retVal = ref(null);
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(current);
|
|
|
}
|
|
|
} else {
|
|
|
retVal = ref(null);
|
|
|
}
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(current, nearestMountedAncestor, error);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof retVal === 'function') {
|
|
|
error('Unexpected return value from a callback ref in %s. ' + 'A callback ref should not return a function.', getComponentNameFromFiber(current));
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
ref.current = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function safelyCallDestroy(current, nearestMountedAncestor, destroy) {
|
|
|
try {
|
|
|
destroy();
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(current, nearestMountedAncestor, error);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var focusedInstanceHandle = null;
|
|
|
var shouldFireAfterActiveInstanceBlur = false;
|
|
|
function commitBeforeMutationEffects(root, firstChild) {
|
|
|
focusedInstanceHandle = prepareForCommit(root.containerInfo);
|
|
|
nextEffect = firstChild;
|
|
|
commitBeforeMutationEffects_begin(); // We no longer need to track the active instance fiber
|
|
|
|
|
|
var shouldFire = shouldFireAfterActiveInstanceBlur;
|
|
|
shouldFireAfterActiveInstanceBlur = false;
|
|
|
focusedInstanceHandle = null;
|
|
|
return shouldFire;
|
|
|
}
|
|
|
|
|
|
function commitBeforeMutationEffects_begin() {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect; // This phase is only used for beforeActiveInstanceBlur.
|
|
|
|
|
|
var child = fiber.child;
|
|
|
|
|
|
if ((fiber.subtreeFlags & BeforeMutationMask) !== NoFlags && child !== null) {
|
|
|
child.return = fiber;
|
|
|
nextEffect = child;
|
|
|
} else {
|
|
|
commitBeforeMutationEffects_complete();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitBeforeMutationEffects_complete() {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
setCurrentFiber(fiber);
|
|
|
|
|
|
try {
|
|
|
commitBeforeMutationEffectsOnFiber(fiber);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
var sibling = fiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
sibling.return = fiber.return;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitBeforeMutationEffectsOnFiber(finishedWork) {
|
|
|
var current = finishedWork.alternate;
|
|
|
var flags = finishedWork.flags;
|
|
|
|
|
|
if ((flags & Snapshot) !== NoFlags) {
|
|
|
setCurrentFiber(finishedWork);
|
|
|
|
|
|
switch (finishedWork.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
if (current !== null) {
|
|
|
var prevProps = current.memoizedProps;
|
|
|
var prevState = current.memoizedState;
|
|
|
var instance = finishedWork.stateNode; // We could update instance props and state here,
|
|
|
// but instead we rely on them being set during last render.
|
|
|
// TODO: revisit this when we implement resuming.
|
|
|
|
|
|
{
|
|
|
if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
|
|
|
if (instance.props !== finishedWork.memoizedProps) {
|
|
|
error('Expected %s props to match memoized props before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
|
|
|
if (instance.state !== finishedWork.memoizedState) {
|
|
|
error('Expected %s state to match memoized state before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var snapshot = instance.getSnapshotBeforeUpdate(finishedWork.elementType === finishedWork.type ? prevProps : resolveDefaultProps(finishedWork.type, prevProps), prevState);
|
|
|
|
|
|
{
|
|
|
var didWarnSet = didWarnAboutUndefinedSnapshotBeforeUpdate;
|
|
|
|
|
|
if (snapshot === undefined && !didWarnSet.has(finishedWork.type)) {
|
|
|
didWarnSet.add(finishedWork.type);
|
|
|
|
|
|
error('%s.getSnapshotBeforeUpdate(): A snapshot value (or null) ' + 'must be returned. You have returned undefined.', getComponentNameFromFiber(finishedWork));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
instance.__reactInternalSnapshotBeforeUpdate = snapshot;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
{
|
|
|
var root = finishedWork.stateNode;
|
|
|
clearContainer(root.containerInfo);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
case HostText:
|
|
|
case HostPortal:
|
|
|
case IncompleteClassComponent:
|
|
|
// Nothing to do for these component types
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
throw new Error('This unit of work tag should not have side-effects. This error is ' + 'likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitHookEffectListUnmount(flags, finishedWork, nearestMountedAncestor) {
|
|
|
var updateQueue = finishedWork.updateQueue;
|
|
|
var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
|
|
|
|
|
|
if (lastEffect !== null) {
|
|
|
var firstEffect = lastEffect.next;
|
|
|
var effect = firstEffect;
|
|
|
|
|
|
do {
|
|
|
if ((effect.tag & flags) === flags) {
|
|
|
// Unmount
|
|
|
var destroy = effect.destroy;
|
|
|
effect.destroy = undefined;
|
|
|
|
|
|
if (destroy !== undefined) {
|
|
|
{
|
|
|
if ((flags & Passive$1) !== NoFlags$1) {
|
|
|
markComponentPassiveEffectUnmountStarted(finishedWork);
|
|
|
} else if ((flags & Layout) !== NoFlags$1) {
|
|
|
markComponentLayoutEffectUnmountStarted(finishedWork);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if ((flags & Insertion) !== NoFlags$1) {
|
|
|
setIsRunningInsertionEffect(true);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
safelyCallDestroy(finishedWork, nearestMountedAncestor, destroy);
|
|
|
|
|
|
{
|
|
|
if ((flags & Insertion) !== NoFlags$1) {
|
|
|
setIsRunningInsertionEffect(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if ((flags & Passive$1) !== NoFlags$1) {
|
|
|
markComponentPassiveEffectUnmountStopped();
|
|
|
} else if ((flags & Layout) !== NoFlags$1) {
|
|
|
markComponentLayoutEffectUnmountStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
effect = effect.next;
|
|
|
} while (effect !== firstEffect);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitHookEffectListMount(flags, finishedWork) {
|
|
|
var updateQueue = finishedWork.updateQueue;
|
|
|
var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;
|
|
|
|
|
|
if (lastEffect !== null) {
|
|
|
var firstEffect = lastEffect.next;
|
|
|
var effect = firstEffect;
|
|
|
|
|
|
do {
|
|
|
if ((effect.tag & flags) === flags) {
|
|
|
{
|
|
|
if ((flags & Passive$1) !== NoFlags$1) {
|
|
|
markComponentPassiveEffectMountStarted(finishedWork);
|
|
|
} else if ((flags & Layout) !== NoFlags$1) {
|
|
|
markComponentLayoutEffectMountStarted(finishedWork);
|
|
|
}
|
|
|
} // Mount
|
|
|
|
|
|
|
|
|
var create = effect.create;
|
|
|
|
|
|
{
|
|
|
if ((flags & Insertion) !== NoFlags$1) {
|
|
|
setIsRunningInsertionEffect(true);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
effect.destroy = create();
|
|
|
|
|
|
{
|
|
|
if ((flags & Insertion) !== NoFlags$1) {
|
|
|
setIsRunningInsertionEffect(false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if ((flags & Passive$1) !== NoFlags$1) {
|
|
|
markComponentPassiveEffectMountStopped();
|
|
|
} else if ((flags & Layout) !== NoFlags$1) {
|
|
|
markComponentLayoutEffectMountStopped();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var destroy = effect.destroy;
|
|
|
|
|
|
if (destroy !== undefined && typeof destroy !== 'function') {
|
|
|
var hookName = void 0;
|
|
|
|
|
|
if ((effect.tag & Layout) !== NoFlags) {
|
|
|
hookName = 'useLayoutEffect';
|
|
|
} else if ((effect.tag & Insertion) !== NoFlags) {
|
|
|
hookName = 'useInsertionEffect';
|
|
|
} else {
|
|
|
hookName = 'useEffect';
|
|
|
}
|
|
|
|
|
|
var addendum = void 0;
|
|
|
|
|
|
if (destroy === null) {
|
|
|
addendum = ' You returned null. If your effect does not require clean ' + 'up, return undefined (or nothing).';
|
|
|
} else if (typeof destroy.then === 'function') {
|
|
|
addendum = '\n\nIt looks like you wrote ' + hookName + '(async () => ...) or returned a Promise. ' + 'Instead, write the async function inside your effect ' + 'and call it immediately:\n\n' + hookName + '(() => {\n' + ' async function fetchData() {\n' + ' // You can await here\n' + ' const response = await MyAPI.getData(someId);\n' + ' // ...\n' + ' }\n' + ' fetchData();\n' + "}, [someId]); // Or [] if effect doesn't need props or state\n\n" + 'Learn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching';
|
|
|
} else {
|
|
|
addendum = ' You returned: ' + destroy;
|
|
|
}
|
|
|
|
|
|
error('%s must not return anything besides a function, ' + 'which is used for clean-up.%s', hookName, addendum);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
effect = effect.next;
|
|
|
} while (effect !== firstEffect);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveEffectDurations(finishedRoot, finishedWork) {
|
|
|
{
|
|
|
// Only Profilers with work in their subtree will have an Update effect scheduled.
|
|
|
if ((finishedWork.flags & Update) !== NoFlags) {
|
|
|
switch (finishedWork.tag) {
|
|
|
case Profiler:
|
|
|
{
|
|
|
var passiveEffectDuration = finishedWork.stateNode.passiveEffectDuration;
|
|
|
var _finishedWork$memoize = finishedWork.memoizedProps,
|
|
|
id = _finishedWork$memoize.id,
|
|
|
onPostCommit = _finishedWork$memoize.onPostCommit; // This value will still reflect the previous commit phase.
|
|
|
// It does not get reset until the start of the next commit phase.
|
|
|
|
|
|
var commitTime = getCommitTime();
|
|
|
var phase = finishedWork.alternate === null ? 'mount' : 'update';
|
|
|
|
|
|
{
|
|
|
if (isCurrentUpdateNested()) {
|
|
|
phase = 'nested-update';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof onPostCommit === 'function') {
|
|
|
onPostCommit(id, phase, passiveEffectDuration, commitTime);
|
|
|
} // Bubble times to the next nearest ancestor Profiler.
|
|
|
// After we process that Profiler, we'll bubble further up.
|
|
|
|
|
|
|
|
|
var parentFiber = finishedWork.return;
|
|
|
|
|
|
outer: while (parentFiber !== null) {
|
|
|
switch (parentFiber.tag) {
|
|
|
case HostRoot:
|
|
|
var root = parentFiber.stateNode;
|
|
|
root.passiveEffectDuration += passiveEffectDuration;
|
|
|
break outer;
|
|
|
|
|
|
case Profiler:
|
|
|
var parentStateNode = parentFiber.stateNode;
|
|
|
parentStateNode.passiveEffectDuration += passiveEffectDuration;
|
|
|
break outer;
|
|
|
}
|
|
|
|
|
|
parentFiber = parentFiber.return;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork, committedLanes) {
|
|
|
if ((finishedWork.flags & LayoutMask) !== NoFlags) {
|
|
|
switch (finishedWork.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ( !offscreenSubtreeWasHidden) {
|
|
|
// At this point layout effects have already been destroyed (during mutation phase).
|
|
|
// This is done to prevent sibling component effects from interfering with each other,
|
|
|
// e.g. a destroy function in one component should never override a ref set
|
|
|
// by a create function in another component during the same commit.
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
commitHookEffectListMount(Layout | HasEffect, finishedWork);
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(finishedWork);
|
|
|
}
|
|
|
} else {
|
|
|
commitHookEffectListMount(Layout | HasEffect, finishedWork);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var instance = finishedWork.stateNode;
|
|
|
|
|
|
if (finishedWork.flags & Update) {
|
|
|
if (!offscreenSubtreeWasHidden) {
|
|
|
if (current === null) {
|
|
|
// We could update instance props and state here,
|
|
|
// but instead we rely on them being set during last render.
|
|
|
// TODO: revisit this when we implement resuming.
|
|
|
{
|
|
|
if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
|
|
|
if (instance.props !== finishedWork.memoizedProps) {
|
|
|
error('Expected %s props to match memoized props before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
|
|
|
if (instance.state !== finishedWork.memoizedState) {
|
|
|
error('Expected %s state to match memoized state before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
instance.componentDidMount();
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(finishedWork);
|
|
|
}
|
|
|
} else {
|
|
|
instance.componentDidMount();
|
|
|
}
|
|
|
} else {
|
|
|
var prevProps = finishedWork.elementType === finishedWork.type ? current.memoizedProps : resolveDefaultProps(finishedWork.type, current.memoizedProps);
|
|
|
var prevState = current.memoizedState; // We could update instance props and state here,
|
|
|
// but instead we rely on them being set during last render.
|
|
|
// TODO: revisit this when we implement resuming.
|
|
|
|
|
|
{
|
|
|
if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
|
|
|
if (instance.props !== finishedWork.memoizedProps) {
|
|
|
error('Expected %s props to match memoized props before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
|
|
|
if (instance.state !== finishedWork.memoizedState) {
|
|
|
error('Expected %s state to match memoized state before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate);
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(finishedWork);
|
|
|
}
|
|
|
} else {
|
|
|
instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} // TODO: I think this is now always non-null by the time it reaches the
|
|
|
// commit phase. Consider removing the type check.
|
|
|
|
|
|
|
|
|
var updateQueue = finishedWork.updateQueue;
|
|
|
|
|
|
if (updateQueue !== null) {
|
|
|
{
|
|
|
if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) {
|
|
|
if (instance.props !== finishedWork.memoizedProps) {
|
|
|
error('Expected %s props to match memoized props before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
|
|
|
if (instance.state !== finishedWork.memoizedState) {
|
|
|
error('Expected %s state to match memoized state before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance');
|
|
|
}
|
|
|
}
|
|
|
} // We could update instance props and state here,
|
|
|
// but instead we rely on them being set during last render.
|
|
|
// TODO: revisit this when we implement resuming.
|
|
|
|
|
|
|
|
|
commitUpdateQueue(finishedWork, updateQueue, instance);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
// TODO: I think this is now always non-null by the time it reaches the
|
|
|
// commit phase. Consider removing the type check.
|
|
|
var _updateQueue = finishedWork.updateQueue;
|
|
|
|
|
|
if (_updateQueue !== null) {
|
|
|
var _instance = null;
|
|
|
|
|
|
if (finishedWork.child !== null) {
|
|
|
switch (finishedWork.child.tag) {
|
|
|
case HostComponent:
|
|
|
_instance = getPublicInstance(finishedWork.child.stateNode);
|
|
|
break;
|
|
|
|
|
|
case ClassComponent:
|
|
|
_instance = finishedWork.child.stateNode;
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
commitUpdateQueue(finishedWork, _updateQueue, _instance);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var _instance2 = finishedWork.stateNode; // Renderers may schedule work to be done after host components are mounted
|
|
|
// (eg DOM renderer may schedule auto-focus for inputs and form controls).
|
|
|
// These effects should only be committed when components are first mounted,
|
|
|
// aka when there is no current/alternate.
|
|
|
|
|
|
if (current === null && finishedWork.flags & Update) {
|
|
|
var type = finishedWork.type;
|
|
|
var props = finishedWork.memoizedProps;
|
|
|
commitMount(_instance2, type, props);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostText:
|
|
|
{
|
|
|
// We have no life-cycles associated with text.
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
{
|
|
|
// We have no life-cycles associated with portals.
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case Profiler:
|
|
|
{
|
|
|
{
|
|
|
var _finishedWork$memoize2 = finishedWork.memoizedProps,
|
|
|
onCommit = _finishedWork$memoize2.onCommit,
|
|
|
onRender = _finishedWork$memoize2.onRender;
|
|
|
var effectDuration = finishedWork.stateNode.effectDuration;
|
|
|
var commitTime = getCommitTime();
|
|
|
var phase = current === null ? 'mount' : 'update';
|
|
|
|
|
|
{
|
|
|
if (isCurrentUpdateNested()) {
|
|
|
phase = 'nested-update';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof onRender === 'function') {
|
|
|
onRender(finishedWork.memoizedProps.id, phase, finishedWork.actualDuration, finishedWork.treeBaseDuration, finishedWork.actualStartTime, commitTime);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof onCommit === 'function') {
|
|
|
onCommit(finishedWork.memoizedProps.id, phase, effectDuration, commitTime);
|
|
|
} // Schedule a passive effect for this Profiler to call onPostCommit hooks.
|
|
|
// This effect should be scheduled even if there is no onPostCommit callback for this Profiler,
|
|
|
// because the effect is also where times bubble to parent Profilers.
|
|
|
|
|
|
|
|
|
enqueuePendingPassiveProfilerEffect(finishedWork); // Propagate layout effect durations to the next nearest Profiler ancestor.
|
|
|
// Do not reset these values until the next render so DevTools has a chance to read them first.
|
|
|
|
|
|
var parentFiber = finishedWork.return;
|
|
|
|
|
|
outer: while (parentFiber !== null) {
|
|
|
switch (parentFiber.tag) {
|
|
|
case HostRoot:
|
|
|
var root = parentFiber.stateNode;
|
|
|
root.effectDuration += effectDuration;
|
|
|
break outer;
|
|
|
|
|
|
case Profiler:
|
|
|
var parentStateNode = parentFiber.stateNode;
|
|
|
parentStateNode.effectDuration += effectDuration;
|
|
|
break outer;
|
|
|
}
|
|
|
|
|
|
parentFiber = parentFiber.return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
commitSuspenseHydrationCallbacks(finishedRoot, finishedWork);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
case IncompleteClassComponent:
|
|
|
case ScopeComponent:
|
|
|
case OffscreenComponent:
|
|
|
case LegacyHiddenComponent:
|
|
|
case TracingMarkerComponent:
|
|
|
{
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
throw new Error('This unit of work tag should not have side-effects. This error is ' + 'likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ( !offscreenSubtreeWasHidden) {
|
|
|
{
|
|
|
if (finishedWork.flags & Ref) {
|
|
|
commitAttachRef(finishedWork);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function reappearLayoutEffectsOnFiber(node) {
|
|
|
// Turn on layout effects in a tree that previously disappeared.
|
|
|
// TODO (Offscreen) Check: flags & LayoutStatic
|
|
|
switch (node.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ( node.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
safelyCallCommitHookLayoutEffectListMount(node, node.return);
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(node);
|
|
|
}
|
|
|
} else {
|
|
|
safelyCallCommitHookLayoutEffectListMount(node, node.return);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var instance = node.stateNode;
|
|
|
|
|
|
if (typeof instance.componentDidMount === 'function') {
|
|
|
safelyCallComponentDidMount(node, node.return, instance);
|
|
|
}
|
|
|
|
|
|
safelyAttachRef(node, node.return);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
safelyAttachRef(node, node.return);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function hideOrUnhideAllChildren(finishedWork, isHidden) {
|
|
|
// Only hide or unhide the top-most host nodes.
|
|
|
var hostSubtreeRoot = null;
|
|
|
|
|
|
{
|
|
|
// We only have the top Fiber that was inserted but we need to recurse down its
|
|
|
// children to find all the terminal nodes.
|
|
|
var node = finishedWork;
|
|
|
|
|
|
while (true) {
|
|
|
if (node.tag === HostComponent) {
|
|
|
if (hostSubtreeRoot === null) {
|
|
|
hostSubtreeRoot = node;
|
|
|
|
|
|
try {
|
|
|
var instance = node.stateNode;
|
|
|
|
|
|
if (isHidden) {
|
|
|
hideInstance(instance);
|
|
|
} else {
|
|
|
unhideInstance(node.stateNode, node.memoizedProps);
|
|
|
}
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
} else if (node.tag === HostText) {
|
|
|
if (hostSubtreeRoot === null) {
|
|
|
try {
|
|
|
var _instance3 = node.stateNode;
|
|
|
|
|
|
if (isHidden) {
|
|
|
hideTextInstance(_instance3);
|
|
|
} else {
|
|
|
unhideTextInstance(_instance3, node.memoizedProps);
|
|
|
}
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
} else if ((node.tag === OffscreenComponent || node.tag === LegacyHiddenComponent) && node.memoizedState !== null && node !== finishedWork) ; else if (node.child !== null) {
|
|
|
node.child.return = node;
|
|
|
node = node.child;
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (node === finishedWork) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || node.return === finishedWork) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (hostSubtreeRoot === node) {
|
|
|
hostSubtreeRoot = null;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
if (hostSubtreeRoot === node) {
|
|
|
hostSubtreeRoot = null;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitAttachRef(finishedWork) {
|
|
|
var ref = finishedWork.ref;
|
|
|
|
|
|
if (ref !== null) {
|
|
|
var instance = finishedWork.stateNode;
|
|
|
var instanceToUse;
|
|
|
|
|
|
switch (finishedWork.tag) {
|
|
|
case HostComponent:
|
|
|
instanceToUse = getPublicInstance(instance);
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
instanceToUse = instance;
|
|
|
} // Moved outside to ensure DCE works with this flag
|
|
|
|
|
|
if (typeof ref === 'function') {
|
|
|
var retVal;
|
|
|
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
retVal = ref(instanceToUse);
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(finishedWork);
|
|
|
}
|
|
|
} else {
|
|
|
retVal = ref(instanceToUse);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof retVal === 'function') {
|
|
|
error('Unexpected return value from a callback ref in %s. ' + 'A callback ref should not return a function.', getComponentNameFromFiber(finishedWork));
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
{
|
|
|
if (!ref.hasOwnProperty('current')) {
|
|
|
error('Unexpected ref object provided for %s. ' + 'Use either a ref-setter function or React.createRef().', getComponentNameFromFiber(finishedWork));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ref.current = instanceToUse;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function detachFiberMutation(fiber) {
|
|
|
// Cut off the return pointer to disconnect it from the tree.
|
|
|
// This enables us to detect and warn against state updates on an unmounted component.
|
|
|
// It also prevents events from bubbling from within disconnected components.
|
|
|
//
|
|
|
// Ideally, we should also clear the child pointer of the parent alternate to let this
|
|
|
// get GC:ed but we don't know which for sure which parent is the current
|
|
|
// one so we'll settle for GC:ing the subtree of this child.
|
|
|
// This child itself will be GC:ed when the parent updates the next time.
|
|
|
//
|
|
|
// Note that we can't clear child or sibling pointers yet.
|
|
|
// They're needed for passive effects and for findDOMNode.
|
|
|
// We defer those fields, and all other cleanup, to the passive phase (see detachFiberAfterEffects).
|
|
|
//
|
|
|
// Don't reset the alternate yet, either. We need that so we can detach the
|
|
|
// alternate's fields in the passive phase. Clearing the return pointer is
|
|
|
// sufficient for findDOMNode semantics.
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
alternate.return = null;
|
|
|
}
|
|
|
|
|
|
fiber.return = null;
|
|
|
}
|
|
|
|
|
|
function detachFiberAfterEffects(fiber) {
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (alternate !== null) {
|
|
|
fiber.alternate = null;
|
|
|
detachFiberAfterEffects(alternate);
|
|
|
} // Note: Defensively using negation instead of < in case
|
|
|
// `deletedTreeCleanUpLevel` is undefined.
|
|
|
|
|
|
|
|
|
{
|
|
|
// Clear cyclical Fiber fields. This level alone is designed to roughly
|
|
|
// approximate the planned Fiber refactor. In that world, `setState` will be
|
|
|
// bound to a special "instance" object instead of a Fiber. The Instance
|
|
|
// object will not have any of these fields. It will only be connected to
|
|
|
// the fiber tree via a single link at the root. So if this level alone is
|
|
|
// sufficient to fix memory issues, that bodes well for our plans.
|
|
|
fiber.child = null;
|
|
|
fiber.deletions = null;
|
|
|
fiber.sibling = null; // The `stateNode` is cyclical because on host nodes it points to the host
|
|
|
// tree, which has its own pointers to children, parents, and siblings.
|
|
|
// The other host nodes also point back to fibers, so we should detach that
|
|
|
// one, too.
|
|
|
|
|
|
if (fiber.tag === HostComponent) {
|
|
|
var hostInstance = fiber.stateNode;
|
|
|
|
|
|
if (hostInstance !== null) {
|
|
|
detachDeletedInstance(hostInstance);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
fiber.stateNode = null; // I'm intentionally not clearing the `return` field in this level. We
|
|
|
// already disconnect the `return` pointer at the root of the deleted
|
|
|
// subtree (in `detachFiberMutation`). Besides, `return` by itself is not
|
|
|
// cyclical — it's only cyclical when combined with `child`, `sibling`, and
|
|
|
// `alternate`. But we'll clear it in the next level anyway, just in case.
|
|
|
|
|
|
{
|
|
|
fiber._debugOwner = null;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// Theoretically, nothing in here should be necessary, because we already
|
|
|
// disconnected the fiber from the tree. So even if something leaks this
|
|
|
// particular fiber, it won't leak anything else
|
|
|
//
|
|
|
// The purpose of this branch is to be super aggressive so we can measure
|
|
|
// if there's any difference in memory impact. If there is, that could
|
|
|
// indicate a React leak we don't know about.
|
|
|
fiber.return = null;
|
|
|
fiber.dependencies = null;
|
|
|
fiber.memoizedProps = null;
|
|
|
fiber.memoizedState = null;
|
|
|
fiber.pendingProps = null;
|
|
|
fiber.stateNode = null; // TODO: Move to `commitPassiveUnmountInsideDeletedTreeOnFiber` instead.
|
|
|
|
|
|
fiber.updateQueue = null;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getHostParentFiber(fiber) {
|
|
|
var parent = fiber.return;
|
|
|
|
|
|
while (parent !== null) {
|
|
|
if (isHostParent(parent)) {
|
|
|
return parent;
|
|
|
}
|
|
|
|
|
|
parent = parent.return;
|
|
|
}
|
|
|
|
|
|
throw new Error('Expected to find a host parent. This error is likely caused by a bug ' + 'in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
function isHostParent(fiber) {
|
|
|
return fiber.tag === HostComponent || fiber.tag === HostRoot || fiber.tag === HostPortal;
|
|
|
}
|
|
|
|
|
|
function getHostSibling(fiber) {
|
|
|
// We're going to search forward into the tree until we find a sibling host
|
|
|
// node. Unfortunately, if multiple insertions are done in a row we have to
|
|
|
// search past them. This leads to exponential search for the next sibling.
|
|
|
// TODO: Find a more efficient way to do this.
|
|
|
var node = fiber;
|
|
|
|
|
|
siblings: while (true) {
|
|
|
// If we didn't find anything, let's try the next sibling.
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || isHostParent(node.return)) {
|
|
|
// If we pop out of the root or hit the parent the fiber we are the
|
|
|
// last sibling.
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
|
|
|
while (node.tag !== HostComponent && node.tag !== HostText && node.tag !== DehydratedFragment) {
|
|
|
// If it is not host node and, we might have a host node inside it.
|
|
|
// Try to search down until we find one.
|
|
|
if (node.flags & Placement) {
|
|
|
// If we don't have a child, try the siblings instead.
|
|
|
continue siblings;
|
|
|
} // If we don't have a child, try the siblings instead.
|
|
|
// We also skip portals because they are not part of this host tree.
|
|
|
|
|
|
|
|
|
if (node.child === null || node.tag === HostPortal) {
|
|
|
continue siblings;
|
|
|
} else {
|
|
|
node.child.return = node;
|
|
|
node = node.child;
|
|
|
}
|
|
|
} // Check if this host node is stable or about to be placed.
|
|
|
|
|
|
|
|
|
if (!(node.flags & Placement)) {
|
|
|
// Found it!
|
|
|
return node.stateNode;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPlacement(finishedWork) {
|
|
|
|
|
|
|
|
|
var parentFiber = getHostParentFiber(finishedWork); // Note: these two variables *must* always be updated together.
|
|
|
|
|
|
switch (parentFiber.tag) {
|
|
|
case HostComponent:
|
|
|
{
|
|
|
var parent = parentFiber.stateNode;
|
|
|
|
|
|
if (parentFiber.flags & ContentReset) {
|
|
|
// Reset the text content of the parent before doing any insertions
|
|
|
resetTextContent(parent); // Clear ContentReset from the effect tag
|
|
|
|
|
|
parentFiber.flags &= ~ContentReset;
|
|
|
}
|
|
|
|
|
|
var before = getHostSibling(finishedWork); // We only have the top Fiber that was inserted but we need to recurse down its
|
|
|
// children to find all the terminal nodes.
|
|
|
|
|
|
insertOrAppendPlacementNode(finishedWork, before, parent);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
case HostPortal:
|
|
|
{
|
|
|
var _parent = parentFiber.stateNode.containerInfo;
|
|
|
|
|
|
var _before = getHostSibling(finishedWork);
|
|
|
|
|
|
insertOrAppendPlacementNodeIntoContainer(finishedWork, _before, _parent);
|
|
|
break;
|
|
|
}
|
|
|
// eslint-disable-next-line-no-fallthrough
|
|
|
|
|
|
default:
|
|
|
throw new Error('Invalid host parent fiber. This error is likely caused by a bug ' + 'in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function insertOrAppendPlacementNodeIntoContainer(node, before, parent) {
|
|
|
var tag = node.tag;
|
|
|
var isHost = tag === HostComponent || tag === HostText;
|
|
|
|
|
|
if (isHost) {
|
|
|
var stateNode = node.stateNode;
|
|
|
|
|
|
if (before) {
|
|
|
insertInContainerBefore(parent, stateNode, before);
|
|
|
} else {
|
|
|
appendChildToContainer(parent, stateNode);
|
|
|
}
|
|
|
} else if (tag === HostPortal) ; else {
|
|
|
var child = node.child;
|
|
|
|
|
|
if (child !== null) {
|
|
|
insertOrAppendPlacementNodeIntoContainer(child, before, parent);
|
|
|
var sibling = child.sibling;
|
|
|
|
|
|
while (sibling !== null) {
|
|
|
insertOrAppendPlacementNodeIntoContainer(sibling, before, parent);
|
|
|
sibling = sibling.sibling;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function insertOrAppendPlacementNode(node, before, parent) {
|
|
|
var tag = node.tag;
|
|
|
var isHost = tag === HostComponent || tag === HostText;
|
|
|
|
|
|
if (isHost) {
|
|
|
var stateNode = node.stateNode;
|
|
|
|
|
|
if (before) {
|
|
|
insertBefore(parent, stateNode, before);
|
|
|
} else {
|
|
|
appendChild(parent, stateNode);
|
|
|
}
|
|
|
} else if (tag === HostPortal) ; else {
|
|
|
var child = node.child;
|
|
|
|
|
|
if (child !== null) {
|
|
|
insertOrAppendPlacementNode(child, before, parent);
|
|
|
var sibling = child.sibling;
|
|
|
|
|
|
while (sibling !== null) {
|
|
|
insertOrAppendPlacementNode(sibling, before, parent);
|
|
|
sibling = sibling.sibling;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} // These are tracked on the stack as we recursively traverse a
|
|
|
// deleted subtree.
|
|
|
// TODO: Update these during the whole mutation phase, not just during
|
|
|
// a deletion.
|
|
|
|
|
|
|
|
|
var hostParent = null;
|
|
|
var hostParentIsContainer = false;
|
|
|
|
|
|
function commitDeletionEffects(root, returnFiber, deletedFiber) {
|
|
|
{
|
|
|
// We only have the top Fiber that was deleted but we need to recurse down its
|
|
|
// children to find all the terminal nodes.
|
|
|
// Recursively delete all host nodes from the parent, detach refs, clean
|
|
|
// up mounted layout effects, and call componentWillUnmount.
|
|
|
// We only need to remove the topmost host child in each branch. But then we
|
|
|
// still need to keep traversing to unmount effects, refs, and cWU. TODO: We
|
|
|
// could split this into two separate traversals functions, where the second
|
|
|
// one doesn't include any removeChild logic. This is maybe the same
|
|
|
// function as "disappearLayoutEffects" (or whatever that turns into after
|
|
|
// the layout phase is refactored to use recursion).
|
|
|
// Before starting, find the nearest host parent on the stack so we know
|
|
|
// which instance/container to remove the children from.
|
|
|
// TODO: Instead of searching up the fiber return path on every deletion, we
|
|
|
// can track the nearest host component on the JS stack as we traverse the
|
|
|
// tree during the commit phase. This would make insertions faster, too.
|
|
|
var parent = returnFiber;
|
|
|
|
|
|
findParent: while (parent !== null) {
|
|
|
switch (parent.tag) {
|
|
|
case HostComponent:
|
|
|
{
|
|
|
hostParent = parent.stateNode;
|
|
|
hostParentIsContainer = false;
|
|
|
break findParent;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
hostParent = parent.stateNode.containerInfo;
|
|
|
hostParentIsContainer = true;
|
|
|
break findParent;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
{
|
|
|
hostParent = parent.stateNode.containerInfo;
|
|
|
hostParentIsContainer = true;
|
|
|
break findParent;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
parent = parent.return;
|
|
|
}
|
|
|
|
|
|
if (hostParent === null) {
|
|
|
throw new Error('Expected to find a host parent. This error is likely caused by ' + 'a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
commitDeletionEffectsOnFiber(root, returnFiber, deletedFiber);
|
|
|
hostParent = null;
|
|
|
hostParentIsContainer = false;
|
|
|
}
|
|
|
|
|
|
detachFiberMutation(deletedFiber);
|
|
|
}
|
|
|
|
|
|
function recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, parent) {
|
|
|
// TODO: Use a static flag to skip trees that don't have unmount effects
|
|
|
var child = parent.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
commitDeletionEffectsOnFiber(finishedRoot, nearestMountedAncestor, child);
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitDeletionEffectsOnFiber(finishedRoot, nearestMountedAncestor, deletedFiber) {
|
|
|
onCommitUnmount(deletedFiber); // The cases in this outer switch modify the stack before they traverse
|
|
|
// into their subtree. There are simpler cases in the inner switch
|
|
|
// that don't modify the stack.
|
|
|
|
|
|
switch (deletedFiber.tag) {
|
|
|
case HostComponent:
|
|
|
{
|
|
|
if (!offscreenSubtreeWasHidden) {
|
|
|
safelyDetachRef(deletedFiber, nearestMountedAncestor);
|
|
|
} // Intentional fallthrough to next branch
|
|
|
|
|
|
}
|
|
|
// eslint-disable-next-line-no-fallthrough
|
|
|
|
|
|
case HostText:
|
|
|
{
|
|
|
// We only need to remove the nearest host child. Set the host parent
|
|
|
// to `null` on the stack to indicate that nested children don't
|
|
|
// need to be removed.
|
|
|
{
|
|
|
var prevHostParent = hostParent;
|
|
|
var prevHostParentIsContainer = hostParentIsContainer;
|
|
|
hostParent = null;
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
hostParent = prevHostParent;
|
|
|
hostParentIsContainer = prevHostParentIsContainer;
|
|
|
|
|
|
if (hostParent !== null) {
|
|
|
// Now that all the child effects have unmounted, we can remove the
|
|
|
// node from the tree.
|
|
|
if (hostParentIsContainer) {
|
|
|
removeChildFromContainer(hostParent, deletedFiber.stateNode);
|
|
|
} else {
|
|
|
removeChild(hostParent, deletedFiber.stateNode);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case DehydratedFragment:
|
|
|
{
|
|
|
// Delete the dehydrated suspense boundary and all of its content.
|
|
|
|
|
|
|
|
|
{
|
|
|
if (hostParent !== null) {
|
|
|
if (hostParentIsContainer) {
|
|
|
clearSuspenseBoundaryFromContainer(hostParent, deletedFiber.stateNode);
|
|
|
} else {
|
|
|
clearSuspenseBoundary(hostParent, deletedFiber.stateNode);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
{
|
|
|
{
|
|
|
// When we go into a portal, it becomes the parent to remove from.
|
|
|
var _prevHostParent = hostParent;
|
|
|
var _prevHostParentIsContainer = hostParentIsContainer;
|
|
|
hostParent = deletedFiber.stateNode.containerInfo;
|
|
|
hostParentIsContainer = true;
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
hostParent = _prevHostParent;
|
|
|
hostParentIsContainer = _prevHostParentIsContainer;
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case MemoComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if (!offscreenSubtreeWasHidden) {
|
|
|
var updateQueue = deletedFiber.updateQueue;
|
|
|
|
|
|
if (updateQueue !== null) {
|
|
|
var lastEffect = updateQueue.lastEffect;
|
|
|
|
|
|
if (lastEffect !== null) {
|
|
|
var firstEffect = lastEffect.next;
|
|
|
var effect = firstEffect;
|
|
|
|
|
|
do {
|
|
|
var _effect = effect,
|
|
|
destroy = _effect.destroy,
|
|
|
tag = _effect.tag;
|
|
|
|
|
|
if (destroy !== undefined) {
|
|
|
if ((tag & Insertion) !== NoFlags$1) {
|
|
|
safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy);
|
|
|
} else if ((tag & Layout) !== NoFlags$1) {
|
|
|
{
|
|
|
markComponentLayoutEffectUnmountStarted(deletedFiber);
|
|
|
}
|
|
|
|
|
|
if ( deletedFiber.mode & ProfileMode) {
|
|
|
startLayoutEffectTimer();
|
|
|
safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy);
|
|
|
recordLayoutEffectDuration(deletedFiber);
|
|
|
} else {
|
|
|
safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markComponentLayoutEffectUnmountStopped();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
effect = effect.next;
|
|
|
} while (effect !== firstEffect);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
if (!offscreenSubtreeWasHidden) {
|
|
|
safelyDetachRef(deletedFiber, nearestMountedAncestor);
|
|
|
var instance = deletedFiber.stateNode;
|
|
|
|
|
|
if (typeof instance.componentWillUnmount === 'function') {
|
|
|
safelyCallComponentWillUnmount(deletedFiber, nearestMountedAncestor, instance);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case ScopeComponent:
|
|
|
{
|
|
|
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
{
|
|
|
if ( // TODO: Remove this dead flag
|
|
|
deletedFiber.mode & ConcurrentMode) {
|
|
|
// If this offscreen component is hidden, we already unmounted it. Before
|
|
|
// deleting the children, track that it's already unmounted so that we
|
|
|
// don't attempt to unmount the effects again.
|
|
|
// TODO: If the tree is hidden, in most cases we should be able to skip
|
|
|
// over the nested children entirely. An exception is we haven't yet found
|
|
|
// the topmost host node to delete, which we already track on the stack.
|
|
|
// But the other case is portals, which need to be detached no matter how
|
|
|
// deeply they are nested. We should use a subtree flag to track whether a
|
|
|
// subtree includes a nested portal.
|
|
|
var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden;
|
|
|
offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden || deletedFiber.memoizedState !== null;
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
|
|
|
} else {
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber);
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitSuspenseCallback(finishedWork) {
|
|
|
// TODO: Move this to passive phase
|
|
|
var newState = finishedWork.memoizedState;
|
|
|
}
|
|
|
|
|
|
function commitSuspenseHydrationCallbacks(finishedRoot, finishedWork) {
|
|
|
|
|
|
var newState = finishedWork.memoizedState;
|
|
|
|
|
|
if (newState === null) {
|
|
|
var current = finishedWork.alternate;
|
|
|
|
|
|
if (current !== null) {
|
|
|
var prevState = current.memoizedState;
|
|
|
|
|
|
if (prevState !== null) {
|
|
|
var suspenseInstance = prevState.dehydrated;
|
|
|
|
|
|
if (suspenseInstance !== null) {
|
|
|
commitHydratedSuspenseInstance(suspenseInstance);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function attachSuspenseRetryListeners(finishedWork) {
|
|
|
// If this boundary just timed out, then it will have a set of wakeables.
|
|
|
// For each wakeable, attach a listener so that when it resolves, React
|
|
|
// attempts to re-render the boundary in the primary (pre-timeout) state.
|
|
|
var wakeables = finishedWork.updateQueue;
|
|
|
|
|
|
if (wakeables !== null) {
|
|
|
finishedWork.updateQueue = null;
|
|
|
var retryCache = finishedWork.stateNode;
|
|
|
|
|
|
if (retryCache === null) {
|
|
|
retryCache = finishedWork.stateNode = new PossiblyWeakSet();
|
|
|
}
|
|
|
|
|
|
wakeables.forEach(function (wakeable) {
|
|
|
// Memoize using the boundary fiber to prevent redundant listeners.
|
|
|
var retry = resolveRetryWakeable.bind(null, finishedWork, wakeable);
|
|
|
|
|
|
if (!retryCache.has(wakeable)) {
|
|
|
retryCache.add(wakeable);
|
|
|
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
if (inProgressLanes !== null && inProgressRoot !== null) {
|
|
|
// If we have pending work still, associate the original updaters with it.
|
|
|
restorePendingUpdaters(inProgressRoot, inProgressLanes);
|
|
|
} else {
|
|
|
throw Error('Expected finished root and lanes to be set. This is a bug in React.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
wakeable.then(retry, retry);
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
} // This function detects when a Suspense boundary goes from visible to hidden.
|
|
|
function commitMutationEffects(root, finishedWork, committedLanes) {
|
|
|
inProgressLanes = committedLanes;
|
|
|
inProgressRoot = root;
|
|
|
setCurrentFiber(finishedWork);
|
|
|
commitMutationEffectsOnFiber(finishedWork, root);
|
|
|
setCurrentFiber(finishedWork);
|
|
|
inProgressLanes = null;
|
|
|
inProgressRoot = null;
|
|
|
}
|
|
|
|
|
|
function recursivelyTraverseMutationEffects(root, parentFiber, lanes) {
|
|
|
// Deletions effects can be scheduled on any fiber type. They need to happen
|
|
|
// before the children effects hae fired.
|
|
|
var deletions = parentFiber.deletions;
|
|
|
|
|
|
if (deletions !== null) {
|
|
|
for (var i = 0; i < deletions.length; i++) {
|
|
|
var childToDelete = deletions[i];
|
|
|
|
|
|
try {
|
|
|
commitDeletionEffects(root, parentFiber, childToDelete);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(childToDelete, parentFiber, error);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var prevDebugFiber = getCurrentFiber();
|
|
|
|
|
|
if (parentFiber.subtreeFlags & MutationMask) {
|
|
|
var child = parentFiber.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
setCurrentFiber(child);
|
|
|
commitMutationEffectsOnFiber(child, root);
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
setCurrentFiber(prevDebugFiber);
|
|
|
}
|
|
|
|
|
|
function commitMutationEffectsOnFiber(finishedWork, root, lanes) {
|
|
|
var current = finishedWork.alternate;
|
|
|
var flags = finishedWork.flags; // The effect flag should be checked *after* we refine the type of fiber,
|
|
|
// because the fiber tag is more specific. An exception is any flag related
|
|
|
// to reconcilation, because those can be set on all fiber types.
|
|
|
|
|
|
switch (finishedWork.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case MemoComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Update) {
|
|
|
try {
|
|
|
commitHookEffectListUnmount(Insertion | HasEffect, finishedWork, finishedWork.return);
|
|
|
commitHookEffectListMount(Insertion | HasEffect, finishedWork);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
} // Layout effects are destroyed during the mutation phase so that all
|
|
|
// destroy functions for all fibers are called before any create functions.
|
|
|
// This prevents sibling component effects from interfering with each other,
|
|
|
// e.g. a destroy function in one component should never override a ref set
|
|
|
// by a create function in another component during the same commit.
|
|
|
|
|
|
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
commitHookEffectListUnmount(Layout | HasEffect, finishedWork, finishedWork.return);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
|
|
|
recordLayoutEffectDuration(finishedWork);
|
|
|
} else {
|
|
|
try {
|
|
|
commitHookEffectListUnmount(Layout | HasEffect, finishedWork, finishedWork.return);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Ref) {
|
|
|
if (current !== null) {
|
|
|
safelyDetachRef(current, current.return);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Ref) {
|
|
|
if (current !== null) {
|
|
|
safelyDetachRef(current, current.return);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// TODO: ContentReset gets cleared by the children during the commit
|
|
|
// phase. This is a refactor hazard because it means we must read
|
|
|
// flags the flags after `commitReconciliationEffects` has already run;
|
|
|
// the order matters. We should refactor so that ContentReset does not
|
|
|
// rely on mutating the flag during commit. Like by setting a flag
|
|
|
// during the render phase instead.
|
|
|
if (finishedWork.flags & ContentReset) {
|
|
|
var instance = finishedWork.stateNode;
|
|
|
|
|
|
try {
|
|
|
resetTextContent(instance);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (flags & Update) {
|
|
|
var _instance4 = finishedWork.stateNode;
|
|
|
|
|
|
if (_instance4 != null) {
|
|
|
// Commit the work prepared earlier.
|
|
|
var newProps = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps
|
|
|
// as the newProps. The updatePayload will contain the real change in
|
|
|
// this case.
|
|
|
|
|
|
var oldProps = current !== null ? current.memoizedProps : newProps;
|
|
|
var type = finishedWork.type; // TODO: Type the updateQueue to be specific to host components.
|
|
|
|
|
|
var updatePayload = finishedWork.updateQueue;
|
|
|
finishedWork.updateQueue = null;
|
|
|
|
|
|
if (updatePayload !== null) {
|
|
|
try {
|
|
|
commitUpdate(_instance4, updatePayload, type, oldProps, newProps, finishedWork);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case HostText:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Update) {
|
|
|
{
|
|
|
if (finishedWork.stateNode === null) {
|
|
|
throw new Error('This should have a text node initialized. This error is likely ' + 'caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
var textInstance = finishedWork.stateNode;
|
|
|
var newText = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps
|
|
|
// as the newProps. The updatePayload will contain the real change in
|
|
|
// this case.
|
|
|
|
|
|
var oldText = current !== null ? current.memoizedProps : newText;
|
|
|
|
|
|
try {
|
|
|
commitTextUpdate(textInstance, oldText, newText);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case HostRoot:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Update) {
|
|
|
{
|
|
|
if (current !== null) {
|
|
|
var prevRootState = current.memoizedState;
|
|
|
|
|
|
if (prevRootState.isDehydrated) {
|
|
|
try {
|
|
|
commitHydratedContainer(root.containerInfo);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case HostPortal:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
var offscreenFiber = finishedWork.child;
|
|
|
|
|
|
if (offscreenFiber.flags & Visibility) {
|
|
|
var offscreenInstance = offscreenFiber.stateNode;
|
|
|
var newState = offscreenFiber.memoizedState;
|
|
|
var isHidden = newState !== null; // Track the current state on the Offscreen instance so we can
|
|
|
// read it during an event
|
|
|
|
|
|
offscreenInstance.isHidden = isHidden;
|
|
|
|
|
|
if (isHidden) {
|
|
|
var wasHidden = offscreenFiber.alternate !== null && offscreenFiber.alternate.memoizedState !== null;
|
|
|
|
|
|
if (!wasHidden) {
|
|
|
// TODO: Move to passive phase
|
|
|
markCommitTimeOfFallback();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (flags & Update) {
|
|
|
try {
|
|
|
commitSuspenseCallback(finishedWork);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
}
|
|
|
|
|
|
attachSuspenseRetryListeners(finishedWork);
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
{
|
|
|
var _wasHidden = current !== null && current.memoizedState !== null;
|
|
|
|
|
|
if ( // TODO: Remove this dead flag
|
|
|
finishedWork.mode & ConcurrentMode) {
|
|
|
// Before committing the children, track on the stack whether this
|
|
|
// offscreen subtree was already hidden, so that we don't unmount the
|
|
|
// effects again.
|
|
|
var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden;
|
|
|
offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden || _wasHidden;
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
|
|
|
} else {
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
}
|
|
|
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Visibility) {
|
|
|
var _offscreenInstance = finishedWork.stateNode;
|
|
|
var _newState = finishedWork.memoizedState;
|
|
|
|
|
|
var _isHidden = _newState !== null;
|
|
|
|
|
|
var offscreenBoundary = finishedWork; // Track the current state on the Offscreen instance so we can
|
|
|
// read it during an event
|
|
|
|
|
|
_offscreenInstance.isHidden = _isHidden;
|
|
|
|
|
|
{
|
|
|
if (_isHidden) {
|
|
|
if (!_wasHidden) {
|
|
|
if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) {
|
|
|
nextEffect = offscreenBoundary;
|
|
|
var offscreenChild = offscreenBoundary.child;
|
|
|
|
|
|
while (offscreenChild !== null) {
|
|
|
nextEffect = offscreenChild;
|
|
|
disappearLayoutEffects_begin(offscreenChild);
|
|
|
offscreenChild = offscreenChild.sibling;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// TODO: This needs to run whenever there's an insertion or update
|
|
|
// inside a hidden Offscreen tree.
|
|
|
hideOrUnhideAllChildren(offscreenBoundary, _isHidden);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
|
|
|
if (flags & Update) {
|
|
|
attachSuspenseRetryListeners(finishedWork);
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
case ScopeComponent:
|
|
|
{
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
recursivelyTraverseMutationEffects(root, finishedWork);
|
|
|
commitReconciliationEffects(finishedWork);
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitReconciliationEffects(finishedWork) {
|
|
|
// Placement effects (insertions, reorders) can be scheduled on any fiber
|
|
|
// type. They needs to happen after the children effects have fired, but
|
|
|
// before the effects on this fiber have fired.
|
|
|
var flags = finishedWork.flags;
|
|
|
|
|
|
if (flags & Placement) {
|
|
|
try {
|
|
|
commitPlacement(finishedWork);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(finishedWork, finishedWork.return, error);
|
|
|
} // Clear the "placement" from effect tag so that we know that this is
|
|
|
// inserted, before any life-cycles like componentDidMount gets called.
|
|
|
// TODO: findDOMNode doesn't rely on this any more but isMounted does
|
|
|
// and isMounted is deprecated anyway so we should be able to kill this.
|
|
|
|
|
|
|
|
|
finishedWork.flags &= ~Placement;
|
|
|
}
|
|
|
|
|
|
if (flags & Hydrating) {
|
|
|
finishedWork.flags &= ~Hydrating;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitLayoutEffects(finishedWork, root, committedLanes) {
|
|
|
inProgressLanes = committedLanes;
|
|
|
inProgressRoot = root;
|
|
|
nextEffect = finishedWork;
|
|
|
commitLayoutEffects_begin(finishedWork, root, committedLanes);
|
|
|
inProgressLanes = null;
|
|
|
inProgressRoot = null;
|
|
|
}
|
|
|
|
|
|
function commitLayoutEffects_begin(subtreeRoot, root, committedLanes) {
|
|
|
// Suspense layout effects semantics don't change for legacy roots.
|
|
|
var isModernRoot = (subtreeRoot.mode & ConcurrentMode) !== NoMode;
|
|
|
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
var firstChild = fiber.child;
|
|
|
|
|
|
if ( fiber.tag === OffscreenComponent && isModernRoot) {
|
|
|
// Keep track of the current Offscreen stack's state.
|
|
|
var isHidden = fiber.memoizedState !== null;
|
|
|
var newOffscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden;
|
|
|
|
|
|
if (newOffscreenSubtreeIsHidden) {
|
|
|
// The Offscreen tree is hidden. Skip over its layout effects.
|
|
|
commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes);
|
|
|
continue;
|
|
|
} else {
|
|
|
// TODO (Offscreen) Also check: subtreeFlags & LayoutMask
|
|
|
var current = fiber.alternate;
|
|
|
var wasHidden = current !== null && current.memoizedState !== null;
|
|
|
var newOffscreenSubtreeWasHidden = wasHidden || offscreenSubtreeWasHidden;
|
|
|
var prevOffscreenSubtreeIsHidden = offscreenSubtreeIsHidden;
|
|
|
var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden; // Traverse the Offscreen subtree with the current Offscreen as the root.
|
|
|
|
|
|
offscreenSubtreeIsHidden = newOffscreenSubtreeIsHidden;
|
|
|
offscreenSubtreeWasHidden = newOffscreenSubtreeWasHidden;
|
|
|
|
|
|
if (offscreenSubtreeWasHidden && !prevOffscreenSubtreeWasHidden) {
|
|
|
// This is the root of a reappearing boundary. Turn its layout effects
|
|
|
// back on.
|
|
|
nextEffect = fiber;
|
|
|
reappearLayoutEffects_begin(fiber);
|
|
|
}
|
|
|
|
|
|
var child = firstChild;
|
|
|
|
|
|
while (child !== null) {
|
|
|
nextEffect = child;
|
|
|
commitLayoutEffects_begin(child, // New root; bubble back up to here and stop.
|
|
|
root, committedLanes);
|
|
|
child = child.sibling;
|
|
|
} // Restore Offscreen state and resume in our-progress traversal.
|
|
|
|
|
|
|
|
|
nextEffect = fiber;
|
|
|
offscreenSubtreeIsHidden = prevOffscreenSubtreeIsHidden;
|
|
|
offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden;
|
|
|
commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes);
|
|
|
continue;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ((fiber.subtreeFlags & LayoutMask) !== NoFlags && firstChild !== null) {
|
|
|
firstChild.return = fiber;
|
|
|
nextEffect = firstChild;
|
|
|
} else {
|
|
|
commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
|
|
|
if ((fiber.flags & LayoutMask) !== NoFlags) {
|
|
|
var current = fiber.alternate;
|
|
|
setCurrentFiber(fiber);
|
|
|
|
|
|
try {
|
|
|
commitLayoutEffectOnFiber(root, current, fiber, committedLanes);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
|
|
|
if (fiber === subtreeRoot) {
|
|
|
nextEffect = null;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var sibling = fiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
sibling.return = fiber.return;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function disappearLayoutEffects_begin(subtreeRoot) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
var firstChild = fiber.child; // TODO (Offscreen) Check: flags & (RefStatic | LayoutStatic)
|
|
|
|
|
|
switch (fiber.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case MemoComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ( fiber.mode & ProfileMode) {
|
|
|
try {
|
|
|
startLayoutEffectTimer();
|
|
|
commitHookEffectListUnmount(Layout, fiber, fiber.return);
|
|
|
} finally {
|
|
|
recordLayoutEffectDuration(fiber);
|
|
|
}
|
|
|
} else {
|
|
|
commitHookEffectListUnmount(Layout, fiber, fiber.return);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
// TODO (Offscreen) Check: flags & RefStatic
|
|
|
safelyDetachRef(fiber, fiber.return);
|
|
|
var instance = fiber.stateNode;
|
|
|
|
|
|
if (typeof instance.componentWillUnmount === 'function') {
|
|
|
safelyCallComponentWillUnmount(fiber, fiber.return, instance);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case HostComponent:
|
|
|
{
|
|
|
safelyDetachRef(fiber, fiber.return);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case OffscreenComponent:
|
|
|
{
|
|
|
// Check if this is a
|
|
|
var isHidden = fiber.memoizedState !== null;
|
|
|
|
|
|
if (isHidden) {
|
|
|
// Nested Offscreen tree is already hidden. Don't disappear
|
|
|
// its effects.
|
|
|
disappearLayoutEffects_complete(subtreeRoot);
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
} // TODO (Offscreen) Check: subtreeFlags & LayoutStatic
|
|
|
|
|
|
|
|
|
if (firstChild !== null) {
|
|
|
firstChild.return = fiber;
|
|
|
nextEffect = firstChild;
|
|
|
} else {
|
|
|
disappearLayoutEffects_complete(subtreeRoot);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function disappearLayoutEffects_complete(subtreeRoot) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
|
|
|
if (fiber === subtreeRoot) {
|
|
|
nextEffect = null;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var sibling = fiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
sibling.return = fiber.return;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function reappearLayoutEffects_begin(subtreeRoot) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
var firstChild = fiber.child;
|
|
|
|
|
|
if (fiber.tag === OffscreenComponent) {
|
|
|
var isHidden = fiber.memoizedState !== null;
|
|
|
|
|
|
if (isHidden) {
|
|
|
// Nested Offscreen tree is still hidden. Don't re-appear its effects.
|
|
|
reappearLayoutEffects_complete(subtreeRoot);
|
|
|
continue;
|
|
|
}
|
|
|
} // TODO (Offscreen) Check: subtreeFlags & LayoutStatic
|
|
|
|
|
|
|
|
|
if (firstChild !== null) {
|
|
|
// This node may have been reused from a previous render, so we can't
|
|
|
// assume its return pointer is correct.
|
|
|
firstChild.return = fiber;
|
|
|
nextEffect = firstChild;
|
|
|
} else {
|
|
|
reappearLayoutEffects_complete(subtreeRoot);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function reappearLayoutEffects_complete(subtreeRoot) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect; // TODO (Offscreen) Check: flags & LayoutStatic
|
|
|
|
|
|
setCurrentFiber(fiber);
|
|
|
|
|
|
try {
|
|
|
reappearLayoutEffectsOnFiber(fiber);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
|
|
|
if (fiber === subtreeRoot) {
|
|
|
nextEffect = null;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var sibling = fiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
// This node may have been reused from a previous render, so we can't
|
|
|
// assume its return pointer is correct.
|
|
|
sibling.return = fiber.return;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveMountEffects(root, finishedWork, committedLanes, committedTransitions) {
|
|
|
nextEffect = finishedWork;
|
|
|
commitPassiveMountEffects_begin(finishedWork, root, committedLanes, committedTransitions);
|
|
|
}
|
|
|
|
|
|
function commitPassiveMountEffects_begin(subtreeRoot, root, committedLanes, committedTransitions) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
var firstChild = fiber.child;
|
|
|
|
|
|
if ((fiber.subtreeFlags & PassiveMask) !== NoFlags && firstChild !== null) {
|
|
|
firstChild.return = fiber;
|
|
|
nextEffect = firstChild;
|
|
|
} else {
|
|
|
commitPassiveMountEffects_complete(subtreeRoot, root, committedLanes, committedTransitions);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveMountEffects_complete(subtreeRoot, root, committedLanes, committedTransitions) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
|
|
|
if ((fiber.flags & Passive) !== NoFlags) {
|
|
|
setCurrentFiber(fiber);
|
|
|
|
|
|
try {
|
|
|
commitPassiveMountOnFiber(root, fiber, committedLanes, committedTransitions);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
|
|
|
if (fiber === subtreeRoot) {
|
|
|
nextEffect = null;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var sibling = fiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
sibling.return = fiber.return;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveMountOnFiber(finishedRoot, finishedWork, committedLanes, committedTransitions) {
|
|
|
switch (finishedWork.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
startPassiveEffectTimer();
|
|
|
|
|
|
try {
|
|
|
commitHookEffectListMount(Passive$1 | HasEffect, finishedWork);
|
|
|
} finally {
|
|
|
recordPassiveEffectDuration(finishedWork);
|
|
|
}
|
|
|
} else {
|
|
|
commitHookEffectListMount(Passive$1 | HasEffect, finishedWork);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountEffects(firstChild) {
|
|
|
nextEffect = firstChild;
|
|
|
commitPassiveUnmountEffects_begin();
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountEffects_begin() {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
var child = fiber.child;
|
|
|
|
|
|
if ((nextEffect.flags & ChildDeletion) !== NoFlags) {
|
|
|
var deletions = fiber.deletions;
|
|
|
|
|
|
if (deletions !== null) {
|
|
|
for (var i = 0; i < deletions.length; i++) {
|
|
|
var fiberToDelete = deletions[i];
|
|
|
nextEffect = fiberToDelete;
|
|
|
commitPassiveUnmountEffectsInsideOfDeletedTree_begin(fiberToDelete, fiber);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// A fiber was deleted from this parent fiber, but it's still part of
|
|
|
// the previous (alternate) parent fiber's list of children. Because
|
|
|
// children are a linked list, an earlier sibling that's still alive
|
|
|
// will be connected to the deleted fiber via its `alternate`:
|
|
|
//
|
|
|
// live fiber
|
|
|
// --alternate--> previous live fiber
|
|
|
// --sibling--> deleted fiber
|
|
|
//
|
|
|
// We can't disconnect `alternate` on nodes that haven't been deleted
|
|
|
// yet, but we can disconnect the `sibling` and `child` pointers.
|
|
|
var previousFiber = fiber.alternate;
|
|
|
|
|
|
if (previousFiber !== null) {
|
|
|
var detachedChild = previousFiber.child;
|
|
|
|
|
|
if (detachedChild !== null) {
|
|
|
previousFiber.child = null;
|
|
|
|
|
|
do {
|
|
|
var detachedSibling = detachedChild.sibling;
|
|
|
detachedChild.sibling = null;
|
|
|
detachedChild = detachedSibling;
|
|
|
} while (detachedChild !== null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ((fiber.subtreeFlags & PassiveMask) !== NoFlags && child !== null) {
|
|
|
child.return = fiber;
|
|
|
nextEffect = child;
|
|
|
} else {
|
|
|
commitPassiveUnmountEffects_complete();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountEffects_complete() {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
|
|
|
if ((fiber.flags & Passive) !== NoFlags) {
|
|
|
setCurrentFiber(fiber);
|
|
|
commitPassiveUnmountOnFiber(fiber);
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
|
|
|
var sibling = fiber.sibling;
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
sibling.return = fiber.return;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = fiber.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountOnFiber(finishedWork) {
|
|
|
switch (finishedWork.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ( finishedWork.mode & ProfileMode) {
|
|
|
startPassiveEffectTimer();
|
|
|
commitHookEffectListUnmount(Passive$1 | HasEffect, finishedWork, finishedWork.return);
|
|
|
recordPassiveEffectDuration(finishedWork);
|
|
|
} else {
|
|
|
commitHookEffectListUnmount(Passive$1 | HasEffect, finishedWork, finishedWork.return);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountEffectsInsideOfDeletedTree_begin(deletedSubtreeRoot, nearestMountedAncestor) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect; // Deletion effects fire in parent -> child order
|
|
|
// TODO: Check if fiber has a PassiveStatic flag
|
|
|
|
|
|
setCurrentFiber(fiber);
|
|
|
commitPassiveUnmountInsideDeletedTreeOnFiber(fiber, nearestMountedAncestor);
|
|
|
resetCurrentFiber();
|
|
|
var child = fiber.child; // TODO: Only traverse subtree if it has a PassiveStatic flag. (But, if we
|
|
|
// do this, still need to handle `deletedTreeCleanUpLevel` correctly.)
|
|
|
|
|
|
if (child !== null) {
|
|
|
child.return = fiber;
|
|
|
nextEffect = child;
|
|
|
} else {
|
|
|
commitPassiveUnmountEffectsInsideOfDeletedTree_complete(deletedSubtreeRoot);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountEffectsInsideOfDeletedTree_complete(deletedSubtreeRoot) {
|
|
|
while (nextEffect !== null) {
|
|
|
var fiber = nextEffect;
|
|
|
var sibling = fiber.sibling;
|
|
|
var returnFiber = fiber.return;
|
|
|
|
|
|
{
|
|
|
// Recursively traverse the entire deleted tree and clean up fiber fields.
|
|
|
// This is more aggressive than ideal, and the long term goal is to only
|
|
|
// have to detach the deleted tree at the root.
|
|
|
detachFiberAfterEffects(fiber);
|
|
|
|
|
|
if (fiber === deletedSubtreeRoot) {
|
|
|
nextEffect = null;
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
sibling.return = returnFiber;
|
|
|
nextEffect = sibling;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
nextEffect = returnFiber;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitPassiveUnmountInsideDeletedTreeOnFiber(current, nearestMountedAncestor) {
|
|
|
switch (current.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ( current.mode & ProfileMode) {
|
|
|
startPassiveEffectTimer();
|
|
|
commitHookEffectListUnmount(Passive$1, current, nearestMountedAncestor);
|
|
|
recordPassiveEffectDuration(current);
|
|
|
} else {
|
|
|
commitHookEffectListUnmount(Passive$1, current, nearestMountedAncestor);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
} // TODO: Reuse reappearLayoutEffects traversal here?
|
|
|
|
|
|
|
|
|
function invokeLayoutEffectMountInDEV(fiber) {
|
|
|
{
|
|
|
// We don't need to re-check StrictEffectsMode here.
|
|
|
// This function is only called if that check has already passed.
|
|
|
switch (fiber.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
try {
|
|
|
commitHookEffectListMount(Layout | HasEffect, fiber);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var instance = fiber.stateNode;
|
|
|
|
|
|
try {
|
|
|
instance.componentDidMount();
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function invokePassiveEffectMountInDEV(fiber) {
|
|
|
{
|
|
|
// We don't need to re-check StrictEffectsMode here.
|
|
|
// This function is only called if that check has already passed.
|
|
|
switch (fiber.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
try {
|
|
|
commitHookEffectListMount(Passive$1 | HasEffect, fiber);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function invokeLayoutEffectUnmountInDEV(fiber) {
|
|
|
{
|
|
|
// We don't need to re-check StrictEffectsMode here.
|
|
|
// This function is only called if that check has already passed.
|
|
|
switch (fiber.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
try {
|
|
|
commitHookEffectListUnmount(Layout | HasEffect, fiber, fiber.return);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
var instance = fiber.stateNode;
|
|
|
|
|
|
if (typeof instance.componentWillUnmount === 'function') {
|
|
|
safelyCallComponentWillUnmount(fiber, fiber.return, instance);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function invokePassiveEffectUnmountInDEV(fiber) {
|
|
|
{
|
|
|
// We don't need to re-check StrictEffectsMode here.
|
|
|
// This function is only called if that check has already passed.
|
|
|
switch (fiber.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
try {
|
|
|
commitHookEffectListUnmount(Passive$1 | HasEffect, fiber, fiber.return);
|
|
|
} catch (error) {
|
|
|
captureCommitPhaseError(fiber, fiber.return, error);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var COMPONENT_TYPE = 0;
|
|
|
var HAS_PSEUDO_CLASS_TYPE = 1;
|
|
|
var ROLE_TYPE = 2;
|
|
|
var TEST_NAME_TYPE = 3;
|
|
|
var TEXT_TYPE = 4;
|
|
|
|
|
|
if (typeof Symbol === 'function' && Symbol.for) {
|
|
|
var symbolFor = Symbol.for;
|
|
|
COMPONENT_TYPE = symbolFor('selector.component');
|
|
|
HAS_PSEUDO_CLASS_TYPE = symbolFor('selector.has_pseudo_class');
|
|
|
ROLE_TYPE = symbolFor('selector.role');
|
|
|
TEST_NAME_TYPE = symbolFor('selector.test_id');
|
|
|
TEXT_TYPE = symbolFor('selector.text');
|
|
|
}
|
|
|
var commitHooks = [];
|
|
|
function onCommitRoot$1() {
|
|
|
{
|
|
|
commitHooks.forEach(function (commitHook) {
|
|
|
return commitHook();
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentActQueue = ReactSharedInternals.ReactCurrentActQueue;
|
|
|
function isLegacyActEnvironment(fiber) {
|
|
|
{
|
|
|
// Legacy mode. We preserve the behavior of React 17's act. It assumes an
|
|
|
// act environment whenever `jest` is defined, but you can still turn off
|
|
|
// spurious warnings by setting IS_REACT_ACT_ENVIRONMENT explicitly
|
|
|
// to false.
|
|
|
var isReactActEnvironmentGlobal = // $FlowExpectedError – Flow doesn't know about IS_REACT_ACT_ENVIRONMENT global
|
|
|
typeof IS_REACT_ACT_ENVIRONMENT !== 'undefined' ? IS_REACT_ACT_ENVIRONMENT : undefined; // $FlowExpectedError - Flow doesn't know about jest
|
|
|
|
|
|
var jestIsDefined = typeof jest !== 'undefined';
|
|
|
return jestIsDefined && isReactActEnvironmentGlobal !== false;
|
|
|
}
|
|
|
}
|
|
|
function isConcurrentActEnvironment() {
|
|
|
{
|
|
|
var isReactActEnvironmentGlobal = // $FlowExpectedError – Flow doesn't know about IS_REACT_ACT_ENVIRONMENT global
|
|
|
typeof IS_REACT_ACT_ENVIRONMENT !== 'undefined' ? IS_REACT_ACT_ENVIRONMENT : undefined;
|
|
|
|
|
|
if (!isReactActEnvironmentGlobal && ReactCurrentActQueue.current !== null) {
|
|
|
// TODO: Include link to relevant documentation page.
|
|
|
error('The current testing environment is not configured to support ' + 'act(...)');
|
|
|
}
|
|
|
|
|
|
return isReactActEnvironmentGlobal;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ceil = Math.ceil;
|
|
|
var ReactCurrentDispatcher$2 = ReactSharedInternals.ReactCurrentDispatcher,
|
|
|
ReactCurrentOwner$2 = ReactSharedInternals.ReactCurrentOwner,
|
|
|
ReactCurrentBatchConfig$3 = ReactSharedInternals.ReactCurrentBatchConfig,
|
|
|
ReactCurrentActQueue$1 = ReactSharedInternals.ReactCurrentActQueue;
|
|
|
var NoContext =
|
|
|
/* */
|
|
|
0;
|
|
|
var BatchedContext =
|
|
|
/* */
|
|
|
1;
|
|
|
var RenderContext =
|
|
|
/* */
|
|
|
2;
|
|
|
var CommitContext =
|
|
|
/* */
|
|
|
4;
|
|
|
var RootInProgress = 0;
|
|
|
var RootFatalErrored = 1;
|
|
|
var RootErrored = 2;
|
|
|
var RootSuspended = 3;
|
|
|
var RootSuspendedWithDelay = 4;
|
|
|
var RootCompleted = 5;
|
|
|
var RootDidNotComplete = 6; // Describes where we are in the React execution stack
|
|
|
|
|
|
var executionContext = NoContext; // The root we're working on
|
|
|
|
|
|
var workInProgressRoot = null; // The fiber we're working on
|
|
|
|
|
|
var workInProgress = null; // The lanes we're rendering
|
|
|
|
|
|
var workInProgressRootRenderLanes = NoLanes; // Stack that allows components to change the render lanes for its subtree
|
|
|
// This is a superset of the lanes we started working on at the root. The only
|
|
|
// case where it's different from `workInProgressRootRenderLanes` is when we
|
|
|
// enter a subtree that is hidden and needs to be unhidden: Suspense and
|
|
|
// Offscreen component.
|
|
|
//
|
|
|
// Most things in the work loop should deal with workInProgressRootRenderLanes.
|
|
|
// Most things in begin/complete phases should deal with subtreeRenderLanes.
|
|
|
|
|
|
var subtreeRenderLanes = NoLanes;
|
|
|
var subtreeRenderLanesCursor = createCursor(NoLanes); // Whether to root completed, errored, suspended, etc.
|
|
|
|
|
|
var workInProgressRootExitStatus = RootInProgress; // A fatal error, if one is thrown
|
|
|
|
|
|
var workInProgressRootFatalError = null; // "Included" lanes refer to lanes that were worked on during this render. It's
|
|
|
// slightly different than `renderLanes` because `renderLanes` can change as you
|
|
|
// enter and exit an Offscreen tree. This value is the combination of all render
|
|
|
// lanes for the entire render phase.
|
|
|
|
|
|
var workInProgressRootIncludedLanes = NoLanes; // The work left over by components that were visited during this render. Only
|
|
|
// includes unprocessed updates, not work in bailed out children.
|
|
|
|
|
|
var workInProgressRootSkippedLanes = NoLanes; // Lanes that were updated (in an interleaved event) during this render.
|
|
|
|
|
|
var workInProgressRootInterleavedUpdatedLanes = NoLanes; // Lanes that were updated during the render phase (*not* an interleaved event).
|
|
|
|
|
|
var workInProgressRootPingedLanes = NoLanes; // Errors that are thrown during the render phase.
|
|
|
|
|
|
var workInProgressRootConcurrentErrors = null; // These are errors that we recovered from without surfacing them to the UI.
|
|
|
// We will log them once the tree commits.
|
|
|
|
|
|
var workInProgressRootRecoverableErrors = null; // The most recent time we committed a fallback. This lets us ensure a train
|
|
|
// model where we don't commit new loading states in too quick succession.
|
|
|
|
|
|
var globalMostRecentFallbackTime = 0;
|
|
|
var FALLBACK_THROTTLE_MS = 500; // The absolute time for when we should start giving up on rendering
|
|
|
// more and prefer CPU suspense heuristics instead.
|
|
|
|
|
|
var workInProgressRootRenderTargetTime = Infinity; // How long a render is supposed to take before we start following CPU
|
|
|
// suspense heuristics and opt out of rendering more content.
|
|
|
|
|
|
var RENDER_TIMEOUT_MS = 500;
|
|
|
var workInProgressTransitions = null;
|
|
|
|
|
|
function resetRenderTimer() {
|
|
|
workInProgressRootRenderTargetTime = now() + RENDER_TIMEOUT_MS;
|
|
|
}
|
|
|
|
|
|
function getRenderTargetTime() {
|
|
|
return workInProgressRootRenderTargetTime;
|
|
|
}
|
|
|
var hasUncaughtError = false;
|
|
|
var firstUncaughtError = null;
|
|
|
var legacyErrorBoundariesThatAlreadyFailed = null; // Only used when enableProfilerNestedUpdateScheduledHook is true;
|
|
|
var rootDoesHavePassiveEffects = false;
|
|
|
var rootWithPendingPassiveEffects = null;
|
|
|
var pendingPassiveEffectsLanes = NoLanes;
|
|
|
var pendingPassiveProfilerEffects = [];
|
|
|
var pendingPassiveTransitions = null; // Use these to prevent an infinite loop of nested updates
|
|
|
|
|
|
var NESTED_UPDATE_LIMIT = 50;
|
|
|
var nestedUpdateCount = 0;
|
|
|
var rootWithNestedUpdates = null;
|
|
|
var isFlushingPassiveEffects = false;
|
|
|
var didScheduleUpdateDuringPassiveEffects = false;
|
|
|
var NESTED_PASSIVE_UPDATE_LIMIT = 50;
|
|
|
var nestedPassiveUpdateCount = 0;
|
|
|
var rootWithPassiveNestedUpdates = null; // If two updates are scheduled within the same event, we should treat their
|
|
|
// event times as simultaneous, even if the actual clock time has advanced
|
|
|
// between the first and second call.
|
|
|
|
|
|
var currentEventTime = NoTimestamp;
|
|
|
var currentEventTransitionLane = NoLanes;
|
|
|
var isRunningInsertionEffect = false;
|
|
|
function getWorkInProgressRoot() {
|
|
|
return workInProgressRoot;
|
|
|
}
|
|
|
function requestEventTime() {
|
|
|
if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
|
|
|
// We're inside React, so it's fine to read the actual time.
|
|
|
return now();
|
|
|
} // We're not inside React, so we may be in the middle of a browser event.
|
|
|
|
|
|
|
|
|
if (currentEventTime !== NoTimestamp) {
|
|
|
// Use the same start time for all updates until we enter React again.
|
|
|
return currentEventTime;
|
|
|
} // This is the first update since React yielded. Compute a new start time.
|
|
|
|
|
|
|
|
|
currentEventTime = now();
|
|
|
return currentEventTime;
|
|
|
}
|
|
|
function requestUpdateLane(fiber) {
|
|
|
// Special cases
|
|
|
var mode = fiber.mode;
|
|
|
|
|
|
if ((mode & ConcurrentMode) === NoMode) {
|
|
|
return SyncLane;
|
|
|
} else if ( (executionContext & RenderContext) !== NoContext && workInProgressRootRenderLanes !== NoLanes) {
|
|
|
// This is a render phase update. These are not officially supported. The
|
|
|
// old behavior is to give this the same "thread" (lanes) as
|
|
|
// whatever is currently rendering. So if you call `setState` on a component
|
|
|
// that happens later in the same render, it will flush. Ideally, we want to
|
|
|
// remove the special case and treat them as if they came from an
|
|
|
// interleaved event. Regardless, this pattern is not officially supported.
|
|
|
// This behavior is only a fallback. The flag only exists until we can roll
|
|
|
// out the setState warning, since existing code might accidentally rely on
|
|
|
// the current behavior.
|
|
|
return pickArbitraryLane(workInProgressRootRenderLanes);
|
|
|
}
|
|
|
|
|
|
var isTransition = requestCurrentTransition() !== NoTransition;
|
|
|
|
|
|
if (isTransition) {
|
|
|
if ( ReactCurrentBatchConfig$3.transition !== null) {
|
|
|
var transition = ReactCurrentBatchConfig$3.transition;
|
|
|
|
|
|
if (!transition._updatedFibers) {
|
|
|
transition._updatedFibers = new Set();
|
|
|
}
|
|
|
|
|
|
transition._updatedFibers.add(fiber);
|
|
|
} // The algorithm for assigning an update to a lane should be stable for all
|
|
|
// updates at the same priority within the same event. To do this, the
|
|
|
// inputs to the algorithm must be the same.
|
|
|
//
|
|
|
// The trick we use is to cache the first of each of these inputs within an
|
|
|
// event. Then reset the cached values once we can be sure the event is
|
|
|
// over. Our heuristic for that is whenever we enter a concurrent work loop.
|
|
|
|
|
|
|
|
|
if (currentEventTransitionLane === NoLane) {
|
|
|
// All transitions within the same event are assigned the same lane.
|
|
|
currentEventTransitionLane = claimNextTransitionLane();
|
|
|
}
|
|
|
|
|
|
return currentEventTransitionLane;
|
|
|
} // Updates originating inside certain React methods, like flushSync, have
|
|
|
// their priority set by tracking it with a context variable.
|
|
|
//
|
|
|
// The opaque type returned by the host config is internally a lane, so we can
|
|
|
// use that directly.
|
|
|
// TODO: Move this type conversion to the event priority module.
|
|
|
|
|
|
|
|
|
var updateLane = getCurrentUpdatePriority();
|
|
|
|
|
|
if (updateLane !== NoLane) {
|
|
|
return updateLane;
|
|
|
} // This update originated outside React. Ask the host environment for an
|
|
|
// appropriate priority, based on the type of event.
|
|
|
//
|
|
|
// The opaque type returned by the host config is internally a lane, so we can
|
|
|
// use that directly.
|
|
|
// TODO: Move this type conversion to the event priority module.
|
|
|
|
|
|
|
|
|
var eventLane = getCurrentEventPriority();
|
|
|
return eventLane;
|
|
|
}
|
|
|
|
|
|
function requestRetryLane(fiber) {
|
|
|
// This is a fork of `requestUpdateLane` designed specifically for Suspense
|
|
|
// "retries" — a special update that attempts to flip a Suspense boundary
|
|
|
// from its placeholder state to its primary/resolved state.
|
|
|
// Special cases
|
|
|
var mode = fiber.mode;
|
|
|
|
|
|
if ((mode & ConcurrentMode) === NoMode) {
|
|
|
return SyncLane;
|
|
|
}
|
|
|
|
|
|
return claimNextRetryLane();
|
|
|
}
|
|
|
|
|
|
function scheduleUpdateOnFiber(root, fiber, lane, eventTime) {
|
|
|
checkForNestedUpdates();
|
|
|
|
|
|
{
|
|
|
if (isRunningInsertionEffect) {
|
|
|
error('useInsertionEffect must not schedule updates.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (isFlushingPassiveEffects) {
|
|
|
didScheduleUpdateDuringPassiveEffects = true;
|
|
|
}
|
|
|
} // Mark that the root has a pending update.
|
|
|
|
|
|
|
|
|
markRootUpdated(root, lane, eventTime);
|
|
|
|
|
|
if ((executionContext & RenderContext) !== NoLanes && root === workInProgressRoot) {
|
|
|
// This update was dispatched during the render phase. This is a mistake
|
|
|
// if the update originates from user space (with the exception of local
|
|
|
// hook updates, which are handled differently and don't reach this
|
|
|
// function), but there are some internal React features that use this as
|
|
|
// an implementation detail, like selective hydration.
|
|
|
warnAboutRenderPhaseUpdatesInDEV(fiber); // Track lanes that were updated during the render phase
|
|
|
} else {
|
|
|
// This is a normal update, scheduled from outside the render phase. For
|
|
|
// example, during an input event.
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
addFiberToLanesMap(root, fiber, lane);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
warnIfUpdatesNotWrappedWithActDEV(fiber);
|
|
|
|
|
|
if (root === workInProgressRoot) {
|
|
|
// Received an update to a tree that's in the middle of rendering. Mark
|
|
|
// that there was an interleaved update work on this root. Unless the
|
|
|
// `deferRenderPhaseUpdateToNextBatch` flag is off and this is a render
|
|
|
// phase update. In that case, we don't treat render phase updates as if
|
|
|
// they were interleaved, for backwards compat reasons.
|
|
|
if ( (executionContext & RenderContext) === NoContext) {
|
|
|
workInProgressRootInterleavedUpdatedLanes = mergeLanes(workInProgressRootInterleavedUpdatedLanes, lane);
|
|
|
}
|
|
|
|
|
|
if (workInProgressRootExitStatus === RootSuspendedWithDelay) {
|
|
|
// The root already suspended with a delay, which means this render
|
|
|
// definitely won't finish. Since we have a new update, let's mark it as
|
|
|
// suspended now, right before marking the incoming update. This has the
|
|
|
// effect of interrupting the current render and switching to the update.
|
|
|
// TODO: Make sure this doesn't override pings that happen while we've
|
|
|
// already started rendering.
|
|
|
markRootSuspended$1(root, workInProgressRootRenderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ensureRootIsScheduled(root, eventTime);
|
|
|
|
|
|
if (lane === SyncLane && executionContext === NoContext && (fiber.mode & ConcurrentMode) === NoMode && // Treat `act` as if it's inside `batchedUpdates`, even in legacy mode.
|
|
|
!( ReactCurrentActQueue$1.isBatchingLegacy)) {
|
|
|
// Flush the synchronous work now, unless we're already working or inside
|
|
|
// a batch. This is intentionally inside scheduleUpdateOnFiber instead of
|
|
|
// scheduleCallbackForFiber to preserve the ability to schedule a callback
|
|
|
// without immediately flushing it. We only do this for user-initiated
|
|
|
// updates, to preserve historical behavior of legacy mode.
|
|
|
resetRenderTimer();
|
|
|
flushSyncCallbacksOnlyInLegacyMode();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function scheduleInitialHydrationOnRoot(root, lane, eventTime) {
|
|
|
// This is a special fork of scheduleUpdateOnFiber that is only used to
|
|
|
// schedule the initial hydration of a root that has just been created. Most
|
|
|
// of the stuff in scheduleUpdateOnFiber can be skipped.
|
|
|
//
|
|
|
// The main reason for this separate path, though, is to distinguish the
|
|
|
// initial children from subsequent updates. In fully client-rendered roots
|
|
|
// (createRoot instead of hydrateRoot), all top-level renders are modeled as
|
|
|
// updates, but hydration roots are special because the initial render must
|
|
|
// match what was rendered on the server.
|
|
|
var current = root.current;
|
|
|
current.lanes = lane;
|
|
|
markRootUpdated(root, lane, eventTime);
|
|
|
ensureRootIsScheduled(root, eventTime);
|
|
|
}
|
|
|
function isUnsafeClassRenderPhaseUpdate(fiber) {
|
|
|
// Check if this is a render phase update. Only called by class components,
|
|
|
// which special (deprecated) behavior for UNSAFE_componentWillReceive props.
|
|
|
return (// TODO: Remove outdated deferRenderPhaseUpdateToNextBatch experiment. We
|
|
|
// decided not to enable it.
|
|
|
(executionContext & RenderContext) !== NoContext
|
|
|
);
|
|
|
} // Use this function to schedule a task for a root. There's only one task per
|
|
|
// root; if a task was already scheduled, we'll check to make sure the priority
|
|
|
// of the existing task is the same as the priority of the next level that the
|
|
|
// root has work on. This function is called on every update, and right before
|
|
|
// exiting a task.
|
|
|
|
|
|
function ensureRootIsScheduled(root, currentTime) {
|
|
|
var existingCallbackNode = root.callbackNode; // Check if any lanes are being starved by other work. If so, mark them as
|
|
|
// expired so we know to work on those next.
|
|
|
|
|
|
markStarvedLanesAsExpired(root, currentTime); // Determine the next lanes to work on, and their priority.
|
|
|
|
|
|
var nextLanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes);
|
|
|
|
|
|
if (nextLanes === NoLanes) {
|
|
|
// Special case: There's nothing to work on.
|
|
|
if (existingCallbackNode !== null) {
|
|
|
cancelCallback$1(existingCallbackNode);
|
|
|
}
|
|
|
|
|
|
root.callbackNode = null;
|
|
|
root.callbackPriority = NoLane;
|
|
|
return;
|
|
|
} // We use the highest priority lane to represent the priority of the callback.
|
|
|
|
|
|
|
|
|
var newCallbackPriority = getHighestPriorityLane(nextLanes); // Check if there's an existing task. We may be able to reuse it.
|
|
|
|
|
|
var existingCallbackPriority = root.callbackPriority;
|
|
|
|
|
|
if (existingCallbackPriority === newCallbackPriority && // Special case related to `act`. If the currently scheduled task is a
|
|
|
// Scheduler task, rather than an `act` task, cancel it and re-scheduled
|
|
|
// on the `act` queue.
|
|
|
!( ReactCurrentActQueue$1.current !== null && existingCallbackNode !== fakeActCallbackNode)) {
|
|
|
{
|
|
|
// If we're going to re-use an existing task, it needs to exist.
|
|
|
// Assume that discrete update microtasks are non-cancellable and null.
|
|
|
// TODO: Temporary until we confirm this warning is not fired.
|
|
|
if (existingCallbackNode == null && existingCallbackPriority !== SyncLane) {
|
|
|
error('Expected scheduled callback to exist. This error is likely caused by a bug in React. Please file an issue.');
|
|
|
}
|
|
|
} // The priority hasn't changed. We can reuse the existing task. Exit.
|
|
|
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (existingCallbackNode != null) {
|
|
|
// Cancel the existing callback. We'll schedule a new one below.
|
|
|
cancelCallback$1(existingCallbackNode);
|
|
|
} // Schedule a new callback.
|
|
|
|
|
|
|
|
|
var newCallbackNode;
|
|
|
|
|
|
if (newCallbackPriority === SyncLane) {
|
|
|
// Special case: Sync React callbacks are scheduled on a special
|
|
|
// internal queue
|
|
|
if (root.tag === LegacyRoot) {
|
|
|
if ( ReactCurrentActQueue$1.isBatchingLegacy !== null) {
|
|
|
ReactCurrentActQueue$1.didScheduleLegacyUpdate = true;
|
|
|
}
|
|
|
|
|
|
scheduleLegacySyncCallback(performSyncWorkOnRoot.bind(null, root));
|
|
|
} else {
|
|
|
scheduleSyncCallback(performSyncWorkOnRoot.bind(null, root));
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// Flush the queue in a microtask.
|
|
|
if ( ReactCurrentActQueue$1.current !== null) {
|
|
|
// Inside `act`, use our internal `act` queue so that these get flushed
|
|
|
// at the end of the current scope even when using the sync version
|
|
|
// of `act`.
|
|
|
ReactCurrentActQueue$1.current.push(flushSyncCallbacks);
|
|
|
} else {
|
|
|
scheduleMicrotask(function () {
|
|
|
// In Safari, appending an iframe forces microtasks to run.
|
|
|
// https://github.com/facebook/react/issues/22459
|
|
|
// We don't support running callbacks in the middle of render
|
|
|
// or commit so we need to check against that.
|
|
|
if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
|
|
|
// Note that this would still prematurely flush the callbacks
|
|
|
// if this happens outside render or commit phase (e.g. in an event).
|
|
|
flushSyncCallbacks();
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
newCallbackNode = null;
|
|
|
} else {
|
|
|
var schedulerPriorityLevel;
|
|
|
|
|
|
switch (lanesToEventPriority(nextLanes)) {
|
|
|
case DiscreteEventPriority:
|
|
|
schedulerPriorityLevel = ImmediatePriority;
|
|
|
break;
|
|
|
|
|
|
case ContinuousEventPriority:
|
|
|
schedulerPriorityLevel = UserBlockingPriority;
|
|
|
break;
|
|
|
|
|
|
case DefaultEventPriority:
|
|
|
schedulerPriorityLevel = NormalPriority;
|
|
|
break;
|
|
|
|
|
|
case IdleEventPriority:
|
|
|
schedulerPriorityLevel = IdlePriority;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
schedulerPriorityLevel = NormalPriority;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
newCallbackNode = scheduleCallback$1(schedulerPriorityLevel, performConcurrentWorkOnRoot.bind(null, root));
|
|
|
}
|
|
|
|
|
|
root.callbackPriority = newCallbackPriority;
|
|
|
root.callbackNode = newCallbackNode;
|
|
|
} // This is the entry point for every concurrent task, i.e. anything that
|
|
|
// goes through Scheduler.
|
|
|
|
|
|
|
|
|
function performConcurrentWorkOnRoot(root, didTimeout) {
|
|
|
{
|
|
|
resetNestedUpdateFlag();
|
|
|
} // Since we know we're in a React event, we can clear the current
|
|
|
// event time. The next update will compute a new event time.
|
|
|
|
|
|
|
|
|
currentEventTime = NoTimestamp;
|
|
|
currentEventTransitionLane = NoLanes;
|
|
|
|
|
|
if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
|
|
|
throw new Error('Should not already be working.');
|
|
|
} // Flush any pending passive effects before deciding which lanes to work on,
|
|
|
// in case they schedule additional work.
|
|
|
|
|
|
|
|
|
var originalCallbackNode = root.callbackNode;
|
|
|
var didFlushPassiveEffects = flushPassiveEffects();
|
|
|
|
|
|
if (didFlushPassiveEffects) {
|
|
|
// Something in the passive effect phase may have canceled the current task.
|
|
|
// Check if the task node for this root was changed.
|
|
|
if (root.callbackNode !== originalCallbackNode) {
|
|
|
// The current task was canceled. Exit. We don't need to call
|
|
|
// `ensureRootIsScheduled` because the check above implies either that
|
|
|
// there's a new task, or that there's no remaining work on this root.
|
|
|
return null;
|
|
|
}
|
|
|
} // Determine the next lanes to work on, using the fields stored
|
|
|
// on the root.
|
|
|
|
|
|
|
|
|
var lanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes);
|
|
|
|
|
|
if (lanes === NoLanes) {
|
|
|
// Defensive coding. This is never expected to happen.
|
|
|
return null;
|
|
|
} // We disable time-slicing in some cases: if the work has been CPU-bound
|
|
|
// for too long ("expired" work, to prevent starvation), or we're in
|
|
|
// sync-updates-by-default mode.
|
|
|
// TODO: We only check `didTimeout` defensively, to account for a Scheduler
|
|
|
// bug we're still investigating. Once the bug in Scheduler is fixed,
|
|
|
// we can remove this, since we track expiration ourselves.
|
|
|
|
|
|
|
|
|
var shouldTimeSlice = !includesBlockingLane(root, lanes) && !includesExpiredLane(root, lanes) && ( !didTimeout);
|
|
|
var exitStatus = shouldTimeSlice ? renderRootConcurrent(root, lanes) : renderRootSync(root, lanes);
|
|
|
|
|
|
if (exitStatus !== RootInProgress) {
|
|
|
if (exitStatus === RootErrored) {
|
|
|
// If something threw an error, try rendering one more time. We'll
|
|
|
// render synchronously to block concurrent data mutations, and we'll
|
|
|
// includes all pending updates are included. If it still fails after
|
|
|
// the second attempt, we'll give up and commit the resulting tree.
|
|
|
var errorRetryLanes = getLanesToRetrySynchronouslyOnError(root);
|
|
|
|
|
|
if (errorRetryLanes !== NoLanes) {
|
|
|
lanes = errorRetryLanes;
|
|
|
exitStatus = recoverFromConcurrentError(root, errorRetryLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (exitStatus === RootFatalErrored) {
|
|
|
var fatalError = workInProgressRootFatalError;
|
|
|
prepareFreshStack(root, NoLanes);
|
|
|
markRootSuspended$1(root, lanes);
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
throw fatalError;
|
|
|
}
|
|
|
|
|
|
if (exitStatus === RootDidNotComplete) {
|
|
|
// The render unwound without completing the tree. This happens in special
|
|
|
// cases where need to exit the current render without producing a
|
|
|
// consistent tree or committing.
|
|
|
//
|
|
|
// This should only happen during a concurrent render, not a discrete or
|
|
|
// synchronous update. We should have already checked for this when we
|
|
|
// unwound the stack.
|
|
|
markRootSuspended$1(root, lanes);
|
|
|
} else {
|
|
|
// The render completed.
|
|
|
// Check if this render may have yielded to a concurrent event, and if so,
|
|
|
// confirm that any newly rendered stores are consistent.
|
|
|
// TODO: It's possible that even a concurrent render may never have yielded
|
|
|
// to the main thread, if it was fast enough, or if it expired. We could
|
|
|
// skip the consistency check in that case, too.
|
|
|
var renderWasConcurrent = !includesBlockingLane(root, lanes);
|
|
|
var finishedWork = root.current.alternate;
|
|
|
|
|
|
if (renderWasConcurrent && !isRenderConsistentWithExternalStores(finishedWork)) {
|
|
|
// A store was mutated in an interleaved event. Render again,
|
|
|
// synchronously, to block further mutations.
|
|
|
exitStatus = renderRootSync(root, lanes); // We need to check again if something threw
|
|
|
|
|
|
if (exitStatus === RootErrored) {
|
|
|
var _errorRetryLanes = getLanesToRetrySynchronouslyOnError(root);
|
|
|
|
|
|
if (_errorRetryLanes !== NoLanes) {
|
|
|
lanes = _errorRetryLanes;
|
|
|
exitStatus = recoverFromConcurrentError(root, _errorRetryLanes); // We assume the tree is now consistent because we didn't yield to any
|
|
|
// concurrent events.
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (exitStatus === RootFatalErrored) {
|
|
|
var _fatalError = workInProgressRootFatalError;
|
|
|
prepareFreshStack(root, NoLanes);
|
|
|
markRootSuspended$1(root, lanes);
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
throw _fatalError;
|
|
|
}
|
|
|
} // We now have a consistent tree. The next step is either to commit it,
|
|
|
// or, if something suspended, wait to commit it after a timeout.
|
|
|
|
|
|
|
|
|
root.finishedWork = finishedWork;
|
|
|
root.finishedLanes = lanes;
|
|
|
finishConcurrentRender(root, exitStatus, lanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
|
|
|
if (root.callbackNode === originalCallbackNode) {
|
|
|
// The task node scheduled for this root is the same one that's
|
|
|
// currently executed. Need to return a continuation.
|
|
|
return performConcurrentWorkOnRoot.bind(null, root);
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function recoverFromConcurrentError(root, errorRetryLanes) {
|
|
|
// If an error occurred during hydration, discard server response and fall
|
|
|
// back to client side render.
|
|
|
// Before rendering again, save the errors from the previous attempt.
|
|
|
var errorsFromFirstAttempt = workInProgressRootConcurrentErrors;
|
|
|
|
|
|
if (isRootDehydrated(root)) {
|
|
|
// The shell failed to hydrate. Set a flag to force a client rendering
|
|
|
// during the next attempt. To do this, we call prepareFreshStack now
|
|
|
// to create the root work-in-progress fiber. This is a bit weird in terms
|
|
|
// of factoring, because it relies on renderRootSync not calling
|
|
|
// prepareFreshStack again in the call below, which happens because the
|
|
|
// root and lanes haven't changed.
|
|
|
//
|
|
|
// TODO: I think what we should do is set ForceClientRender inside
|
|
|
// throwException, like we do for nested Suspense boundaries. The reason
|
|
|
// it's here instead is so we can switch to the synchronous work loop, too.
|
|
|
// Something to consider for a future refactor.
|
|
|
var rootWorkInProgress = prepareFreshStack(root, errorRetryLanes);
|
|
|
rootWorkInProgress.flags |= ForceClientRender;
|
|
|
|
|
|
{
|
|
|
errorHydratingContainer(root.containerInfo);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var exitStatus = renderRootSync(root, errorRetryLanes);
|
|
|
|
|
|
if (exitStatus !== RootErrored) {
|
|
|
// Successfully finished rendering on retry
|
|
|
// The errors from the failed first attempt have been recovered. Add
|
|
|
// them to the collection of recoverable errors. We'll log them in the
|
|
|
// commit phase.
|
|
|
var errorsFromSecondAttempt = workInProgressRootRecoverableErrors;
|
|
|
workInProgressRootRecoverableErrors = errorsFromFirstAttempt; // The errors from the second attempt should be queued after the errors
|
|
|
// from the first attempt, to preserve the causal sequence.
|
|
|
|
|
|
if (errorsFromSecondAttempt !== null) {
|
|
|
queueRecoverableErrors(errorsFromSecondAttempt);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return exitStatus;
|
|
|
}
|
|
|
|
|
|
function queueRecoverableErrors(errors) {
|
|
|
if (workInProgressRootRecoverableErrors === null) {
|
|
|
workInProgressRootRecoverableErrors = errors;
|
|
|
} else {
|
|
|
workInProgressRootRecoverableErrors.push.apply(workInProgressRootRecoverableErrors, errors);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function finishConcurrentRender(root, exitStatus, lanes) {
|
|
|
switch (exitStatus) {
|
|
|
case RootInProgress:
|
|
|
case RootFatalErrored:
|
|
|
{
|
|
|
throw new Error('Root did not complete. This is a bug in React.');
|
|
|
}
|
|
|
// Flow knows about invariant, so it complains if I add a break
|
|
|
// statement, but eslint doesn't know about invariant, so it complains
|
|
|
// if I do. eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case RootErrored:
|
|
|
{
|
|
|
// We should have already attempted to retry this tree. If we reached
|
|
|
// this point, it errored again. Commit it.
|
|
|
commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case RootSuspended:
|
|
|
{
|
|
|
markRootSuspended$1(root, lanes); // We have an acceptable loading state. We need to figure out if we
|
|
|
// should immediately commit it or wait a bit.
|
|
|
|
|
|
if (includesOnlyRetries(lanes) && // do not delay if we're inside an act() scope
|
|
|
!shouldForceFlushFallbacksInDEV()) {
|
|
|
// This render only included retries, no updates. Throttle committing
|
|
|
// retries so that we don't show too many loading states too quickly.
|
|
|
var msUntilTimeout = globalMostRecentFallbackTime + FALLBACK_THROTTLE_MS - now(); // Don't bother with a very short suspense time.
|
|
|
|
|
|
if (msUntilTimeout > 10) {
|
|
|
var nextLanes = getNextLanes(root, NoLanes);
|
|
|
|
|
|
if (nextLanes !== NoLanes) {
|
|
|
// There's additional work on this root.
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var suspendedLanes = root.suspendedLanes;
|
|
|
|
|
|
if (!isSubsetOfLanes(suspendedLanes, lanes)) {
|
|
|
// We should prefer to render the fallback of at the last
|
|
|
// suspended level. Ping the last suspended level to try
|
|
|
// rendering it again.
|
|
|
// FIXME: What if the suspended lanes are Idle? Should not restart.
|
|
|
var eventTime = requestEventTime();
|
|
|
markRootPinged(root, suspendedLanes);
|
|
|
break;
|
|
|
} // The render is suspended, it hasn't timed out, and there's no
|
|
|
// lower priority work to do. Instead of committing the fallback
|
|
|
// immediately, wait for more data to arrive.
|
|
|
|
|
|
|
|
|
root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root, workInProgressRootRecoverableErrors, workInProgressTransitions), msUntilTimeout);
|
|
|
break;
|
|
|
}
|
|
|
} // The work expired. Commit immediately.
|
|
|
|
|
|
|
|
|
commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case RootSuspendedWithDelay:
|
|
|
{
|
|
|
markRootSuspended$1(root, lanes);
|
|
|
|
|
|
if (includesOnlyTransitions(lanes)) {
|
|
|
// This is a transition, so we should exit without committing a
|
|
|
// placeholder and without scheduling a timeout. Delay indefinitely
|
|
|
// until we receive more data.
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (!shouldForceFlushFallbacksInDEV()) {
|
|
|
// This is not a transition, but we did trigger an avoided state.
|
|
|
// Schedule a placeholder to display after a short delay, using the Just
|
|
|
// Noticeable Difference.
|
|
|
// TODO: Is the JND optimization worth the added complexity? If this is
|
|
|
// the only reason we track the event time, then probably not.
|
|
|
// Consider removing.
|
|
|
var mostRecentEventTime = getMostRecentEventTime(root, lanes);
|
|
|
var eventTimeMs = mostRecentEventTime;
|
|
|
var timeElapsedMs = now() - eventTimeMs;
|
|
|
|
|
|
var _msUntilTimeout = jnd(timeElapsedMs) - timeElapsedMs; // Don't bother with a very short suspense time.
|
|
|
|
|
|
|
|
|
if (_msUntilTimeout > 10) {
|
|
|
// Instead of committing the fallback immediately, wait for more data
|
|
|
// to arrive.
|
|
|
root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root, workInProgressRootRecoverableErrors, workInProgressTransitions), _msUntilTimeout);
|
|
|
break;
|
|
|
}
|
|
|
} // Commit the placeholder.
|
|
|
|
|
|
|
|
|
commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case RootCompleted:
|
|
|
{
|
|
|
// The work completed. Ready to commit.
|
|
|
commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions);
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
throw new Error('Unknown root exit status.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function isRenderConsistentWithExternalStores(finishedWork) {
|
|
|
// Search the rendered tree for external store reads, and check whether the
|
|
|
// stores were mutated in a concurrent event. Intentionally using an iterative
|
|
|
// loop instead of recursion so we can exit early.
|
|
|
var node = finishedWork;
|
|
|
|
|
|
while (true) {
|
|
|
if (node.flags & StoreConsistency) {
|
|
|
var updateQueue = node.updateQueue;
|
|
|
|
|
|
if (updateQueue !== null) {
|
|
|
var checks = updateQueue.stores;
|
|
|
|
|
|
if (checks !== null) {
|
|
|
for (var i = 0; i < checks.length; i++) {
|
|
|
var check = checks[i];
|
|
|
var getSnapshot = check.getSnapshot;
|
|
|
var renderedValue = check.value;
|
|
|
|
|
|
try {
|
|
|
if (!objectIs(getSnapshot(), renderedValue)) {
|
|
|
// Found an inconsistent store.
|
|
|
return false;
|
|
|
}
|
|
|
} catch (error) {
|
|
|
// If `getSnapshot` throws, return `false`. This will schedule
|
|
|
// a re-render, and the error will be rethrown during render.
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var child = node.child;
|
|
|
|
|
|
if (node.subtreeFlags & StoreConsistency && child !== null) {
|
|
|
child.return = node;
|
|
|
node = child;
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (node === finishedWork) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || node.return === finishedWork) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
} // Flow doesn't know this is unreachable, but eslint does
|
|
|
// eslint-disable-next-line no-unreachable
|
|
|
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function markRootSuspended$1(root, suspendedLanes) {
|
|
|
// When suspending, we should always exclude lanes that were pinged or (more
|
|
|
// rarely, since we try to avoid it) updated during the render phase.
|
|
|
// TODO: Lol maybe there's a better way to factor this besides this
|
|
|
// obnoxiously named function :)
|
|
|
suspendedLanes = removeLanes(suspendedLanes, workInProgressRootPingedLanes);
|
|
|
suspendedLanes = removeLanes(suspendedLanes, workInProgressRootInterleavedUpdatedLanes);
|
|
|
markRootSuspended(root, suspendedLanes);
|
|
|
} // This is the entry point for synchronous tasks that don't go
|
|
|
// through Scheduler
|
|
|
|
|
|
|
|
|
function performSyncWorkOnRoot(root) {
|
|
|
{
|
|
|
syncNestedUpdateFlag();
|
|
|
}
|
|
|
|
|
|
if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
|
|
|
throw new Error('Should not already be working.');
|
|
|
}
|
|
|
|
|
|
flushPassiveEffects();
|
|
|
var lanes = getNextLanes(root, NoLanes);
|
|
|
|
|
|
if (!includesSomeLane(lanes, SyncLane)) {
|
|
|
// There's no remaining sync work left.
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var exitStatus = renderRootSync(root, lanes);
|
|
|
|
|
|
if (root.tag !== LegacyRoot && exitStatus === RootErrored) {
|
|
|
// If something threw an error, try rendering one more time. We'll render
|
|
|
// synchronously to block concurrent data mutations, and we'll includes
|
|
|
// all pending updates are included. If it still fails after the second
|
|
|
// attempt, we'll give up and commit the resulting tree.
|
|
|
var errorRetryLanes = getLanesToRetrySynchronouslyOnError(root);
|
|
|
|
|
|
if (errorRetryLanes !== NoLanes) {
|
|
|
lanes = errorRetryLanes;
|
|
|
exitStatus = recoverFromConcurrentError(root, errorRetryLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (exitStatus === RootFatalErrored) {
|
|
|
var fatalError = workInProgressRootFatalError;
|
|
|
prepareFreshStack(root, NoLanes);
|
|
|
markRootSuspended$1(root, lanes);
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
throw fatalError;
|
|
|
}
|
|
|
|
|
|
if (exitStatus === RootDidNotComplete) {
|
|
|
throw new Error('Root did not complete. This is a bug in React.');
|
|
|
} // We now have a consistent tree. Because this is a sync render, we
|
|
|
// will commit it even if something suspended.
|
|
|
|
|
|
|
|
|
var finishedWork = root.current.alternate;
|
|
|
root.finishedWork = finishedWork;
|
|
|
root.finishedLanes = lanes;
|
|
|
commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); // Before exiting, make sure there's a callback scheduled for the next
|
|
|
// pending level.
|
|
|
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function flushRoot(root, lanes) {
|
|
|
if (lanes !== NoLanes) {
|
|
|
markRootEntangled(root, mergeLanes(lanes, SyncLane));
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
|
|
|
if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
|
|
|
resetRenderTimer();
|
|
|
flushSyncCallbacks();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function batchedUpdates$1(fn, a) {
|
|
|
var prevExecutionContext = executionContext;
|
|
|
executionContext |= BatchedContext;
|
|
|
|
|
|
try {
|
|
|
return fn(a);
|
|
|
} finally {
|
|
|
executionContext = prevExecutionContext; // If there were legacy sync updates, flush them at the end of the outer
|
|
|
// most batchedUpdates-like method.
|
|
|
|
|
|
if (executionContext === NoContext && // Treat `act` as if it's inside `batchedUpdates`, even in legacy mode.
|
|
|
!( ReactCurrentActQueue$1.isBatchingLegacy)) {
|
|
|
resetRenderTimer();
|
|
|
flushSyncCallbacksOnlyInLegacyMode();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function discreteUpdates(fn, a, b, c, d) {
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
var prevTransition = ReactCurrentBatchConfig$3.transition;
|
|
|
|
|
|
try {
|
|
|
ReactCurrentBatchConfig$3.transition = null;
|
|
|
setCurrentUpdatePriority(DiscreteEventPriority);
|
|
|
return fn(a, b, c, d);
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig$3.transition = prevTransition;
|
|
|
|
|
|
if (executionContext === NoContext) {
|
|
|
resetRenderTimer();
|
|
|
}
|
|
|
}
|
|
|
} // Overload the definition to the two valid signatures.
|
|
|
// Warning, this opts-out of checking the function body.
|
|
|
|
|
|
// eslint-disable-next-line no-redeclare
|
|
|
function flushSync(fn) {
|
|
|
// In legacy mode, we flush pending passive effects at the beginning of the
|
|
|
// next event, not at the end of the previous one.
|
|
|
if (rootWithPendingPassiveEffects !== null && rootWithPendingPassiveEffects.tag === LegacyRoot && (executionContext & (RenderContext | CommitContext)) === NoContext) {
|
|
|
flushPassiveEffects();
|
|
|
}
|
|
|
|
|
|
var prevExecutionContext = executionContext;
|
|
|
executionContext |= BatchedContext;
|
|
|
var prevTransition = ReactCurrentBatchConfig$3.transition;
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
|
|
|
try {
|
|
|
ReactCurrentBatchConfig$3.transition = null;
|
|
|
setCurrentUpdatePriority(DiscreteEventPriority);
|
|
|
|
|
|
if (fn) {
|
|
|
return fn();
|
|
|
} else {
|
|
|
return undefined;
|
|
|
}
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig$3.transition = prevTransition;
|
|
|
executionContext = prevExecutionContext; // Flush the immediate callbacks that were scheduled during this batch.
|
|
|
// Note that this will happen even if batchedUpdates is higher up
|
|
|
// the stack.
|
|
|
|
|
|
if ((executionContext & (RenderContext | CommitContext)) === NoContext) {
|
|
|
flushSyncCallbacks();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function isAlreadyRendering() {
|
|
|
// Used by the renderer to print a warning if certain APIs are called from
|
|
|
// the wrong context.
|
|
|
return (executionContext & (RenderContext | CommitContext)) !== NoContext;
|
|
|
}
|
|
|
function pushRenderLanes(fiber, lanes) {
|
|
|
push(subtreeRenderLanesCursor, subtreeRenderLanes, fiber);
|
|
|
subtreeRenderLanes = mergeLanes(subtreeRenderLanes, lanes);
|
|
|
workInProgressRootIncludedLanes = mergeLanes(workInProgressRootIncludedLanes, lanes);
|
|
|
}
|
|
|
function popRenderLanes(fiber) {
|
|
|
subtreeRenderLanes = subtreeRenderLanesCursor.current;
|
|
|
pop(subtreeRenderLanesCursor, fiber);
|
|
|
}
|
|
|
|
|
|
function prepareFreshStack(root, lanes) {
|
|
|
root.finishedWork = null;
|
|
|
root.finishedLanes = NoLanes;
|
|
|
var timeoutHandle = root.timeoutHandle;
|
|
|
|
|
|
if (timeoutHandle !== noTimeout) {
|
|
|
// The root previous suspended and scheduled a timeout to commit a fallback
|
|
|
// state. Now that we have additional work, cancel the timeout.
|
|
|
root.timeoutHandle = noTimeout; // $FlowFixMe Complains noTimeout is not a TimeoutID, despite the check above
|
|
|
|
|
|
cancelTimeout(timeoutHandle);
|
|
|
}
|
|
|
|
|
|
if (workInProgress !== null) {
|
|
|
var interruptedWork = workInProgress.return;
|
|
|
|
|
|
while (interruptedWork !== null) {
|
|
|
var current = interruptedWork.alternate;
|
|
|
unwindInterruptedWork(current, interruptedWork);
|
|
|
interruptedWork = interruptedWork.return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
workInProgressRoot = root;
|
|
|
var rootWorkInProgress = createWorkInProgress(root.current, null);
|
|
|
workInProgress = rootWorkInProgress;
|
|
|
workInProgressRootRenderLanes = subtreeRenderLanes = workInProgressRootIncludedLanes = lanes;
|
|
|
workInProgressRootExitStatus = RootInProgress;
|
|
|
workInProgressRootFatalError = null;
|
|
|
workInProgressRootSkippedLanes = NoLanes;
|
|
|
workInProgressRootInterleavedUpdatedLanes = NoLanes;
|
|
|
workInProgressRootPingedLanes = NoLanes;
|
|
|
workInProgressRootConcurrentErrors = null;
|
|
|
workInProgressRootRecoverableErrors = null;
|
|
|
finishQueueingConcurrentUpdates();
|
|
|
|
|
|
{
|
|
|
ReactStrictModeWarnings.discardPendingWarnings();
|
|
|
}
|
|
|
|
|
|
return rootWorkInProgress;
|
|
|
}
|
|
|
|
|
|
function handleError(root, thrownValue) {
|
|
|
do {
|
|
|
var erroredWork = workInProgress;
|
|
|
|
|
|
try {
|
|
|
// Reset module-level state that was set during the render phase.
|
|
|
resetContextDependencies();
|
|
|
resetHooksAfterThrow();
|
|
|
resetCurrentFiber(); // TODO: I found and added this missing line while investigating a
|
|
|
// separate issue. Write a regression test using string refs.
|
|
|
|
|
|
ReactCurrentOwner$2.current = null;
|
|
|
|
|
|
if (erroredWork === null || erroredWork.return === null) {
|
|
|
// Expected to be working on a non-root fiber. This is a fatal error
|
|
|
// because there's no ancestor that can handle it; the root is
|
|
|
// supposed to capture all errors that weren't caught by an error
|
|
|
// boundary.
|
|
|
workInProgressRootExitStatus = RootFatalErrored;
|
|
|
workInProgressRootFatalError = thrownValue; // Set `workInProgress` to null. This represents advancing to the next
|
|
|
// sibling, or the parent if there are no siblings. But since the root
|
|
|
// has no siblings nor a parent, we set it to null. Usually this is
|
|
|
// handled by `completeUnitOfWork` or `unwindWork`, but since we're
|
|
|
// intentionally not calling those, we need set it here.
|
|
|
// TODO: Consider calling `unwindWork` to pop the contexts.
|
|
|
|
|
|
workInProgress = null;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (enableProfilerTimer && erroredWork.mode & ProfileMode) {
|
|
|
// Record the time spent rendering before an error was thrown. This
|
|
|
// avoids inaccurate Profiler durations in the case of a
|
|
|
// suspended render.
|
|
|
stopProfilerTimerIfRunningAndRecordDelta(erroredWork, true);
|
|
|
}
|
|
|
|
|
|
if (enableSchedulingProfiler) {
|
|
|
markComponentRenderStopped();
|
|
|
|
|
|
if (thrownValue !== null && typeof thrownValue === 'object' && typeof thrownValue.then === 'function') {
|
|
|
var wakeable = thrownValue;
|
|
|
markComponentSuspended(erroredWork, wakeable, workInProgressRootRenderLanes);
|
|
|
} else {
|
|
|
markComponentErrored(erroredWork, thrownValue, workInProgressRootRenderLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
throwException(root, erroredWork.return, erroredWork, thrownValue, workInProgressRootRenderLanes);
|
|
|
completeUnitOfWork(erroredWork);
|
|
|
} catch (yetAnotherThrownValue) {
|
|
|
// Something in the return path also threw.
|
|
|
thrownValue = yetAnotherThrownValue;
|
|
|
|
|
|
if (workInProgress === erroredWork && erroredWork !== null) {
|
|
|
// If this boundary has already errored, then we had trouble processing
|
|
|
// the error. Bubble it to the next boundary.
|
|
|
erroredWork = erroredWork.return;
|
|
|
workInProgress = erroredWork;
|
|
|
} else {
|
|
|
erroredWork = workInProgress;
|
|
|
}
|
|
|
|
|
|
continue;
|
|
|
} // Return to the normal work loop.
|
|
|
|
|
|
|
|
|
return;
|
|
|
} while (true);
|
|
|
}
|
|
|
|
|
|
function pushDispatcher() {
|
|
|
var prevDispatcher = ReactCurrentDispatcher$2.current;
|
|
|
ReactCurrentDispatcher$2.current = ContextOnlyDispatcher;
|
|
|
|
|
|
if (prevDispatcher === null) {
|
|
|
// The React isomorphic package does not include a default dispatcher.
|
|
|
// Instead the first renderer will lazily attach one, in order to give
|
|
|
// nicer error messages.
|
|
|
return ContextOnlyDispatcher;
|
|
|
} else {
|
|
|
return prevDispatcher;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function popDispatcher(prevDispatcher) {
|
|
|
ReactCurrentDispatcher$2.current = prevDispatcher;
|
|
|
}
|
|
|
|
|
|
function markCommitTimeOfFallback() {
|
|
|
globalMostRecentFallbackTime = now();
|
|
|
}
|
|
|
function markSkippedUpdateLanes(lane) {
|
|
|
workInProgressRootSkippedLanes = mergeLanes(lane, workInProgressRootSkippedLanes);
|
|
|
}
|
|
|
function renderDidSuspend() {
|
|
|
if (workInProgressRootExitStatus === RootInProgress) {
|
|
|
workInProgressRootExitStatus = RootSuspended;
|
|
|
}
|
|
|
}
|
|
|
function renderDidSuspendDelayIfPossible() {
|
|
|
if (workInProgressRootExitStatus === RootInProgress || workInProgressRootExitStatus === RootSuspended || workInProgressRootExitStatus === RootErrored) {
|
|
|
workInProgressRootExitStatus = RootSuspendedWithDelay;
|
|
|
} // Check if there are updates that we skipped tree that might have unblocked
|
|
|
// this render.
|
|
|
|
|
|
|
|
|
if (workInProgressRoot !== null && (includesNonIdleWork(workInProgressRootSkippedLanes) || includesNonIdleWork(workInProgressRootInterleavedUpdatedLanes))) {
|
|
|
// Mark the current render as suspended so that we switch to working on
|
|
|
// the updates that were skipped. Usually we only suspend at the end of
|
|
|
// the render phase.
|
|
|
// TODO: We should probably always mark the root as suspended immediately
|
|
|
// (inside this function), since by suspending at the end of the render
|
|
|
// phase introduces a potential mistake where we suspend lanes that were
|
|
|
// pinged or updated while we were rendering.
|
|
|
markRootSuspended$1(workInProgressRoot, workInProgressRootRenderLanes);
|
|
|
}
|
|
|
}
|
|
|
function renderDidError(error) {
|
|
|
if (workInProgressRootExitStatus !== RootSuspendedWithDelay) {
|
|
|
workInProgressRootExitStatus = RootErrored;
|
|
|
}
|
|
|
|
|
|
if (workInProgressRootConcurrentErrors === null) {
|
|
|
workInProgressRootConcurrentErrors = [error];
|
|
|
} else {
|
|
|
workInProgressRootConcurrentErrors.push(error);
|
|
|
}
|
|
|
} // Called during render to determine if anything has suspended.
|
|
|
// Returns false if we're not sure.
|
|
|
|
|
|
function renderHasNotSuspendedYet() {
|
|
|
// If something errored or completed, we can't really be sure,
|
|
|
// so those are false.
|
|
|
return workInProgressRootExitStatus === RootInProgress;
|
|
|
}
|
|
|
|
|
|
function renderRootSync(root, lanes) {
|
|
|
var prevExecutionContext = executionContext;
|
|
|
executionContext |= RenderContext;
|
|
|
var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack
|
|
|
// and prepare a fresh one. Otherwise we'll continue where we left off.
|
|
|
|
|
|
if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) {
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
var memoizedUpdaters = root.memoizedUpdaters;
|
|
|
|
|
|
if (memoizedUpdaters.size > 0) {
|
|
|
restorePendingUpdaters(root, workInProgressRootRenderLanes);
|
|
|
memoizedUpdaters.clear();
|
|
|
} // At this point, move Fibers that scheduled the upcoming work from the Map to the Set.
|
|
|
// If we bailout on this work, we'll move them back (like above).
|
|
|
// It's important to move them now in case the work spawns more work at the same priority with different updaters.
|
|
|
// That way we can keep the current update and future updates separate.
|
|
|
|
|
|
|
|
|
movePendingFibersToMemoized(root, lanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
workInProgressTransitions = getTransitionsForLanes();
|
|
|
prepareFreshStack(root, lanes);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markRenderStarted(lanes);
|
|
|
}
|
|
|
|
|
|
do {
|
|
|
try {
|
|
|
workLoopSync();
|
|
|
break;
|
|
|
} catch (thrownValue) {
|
|
|
handleError(root, thrownValue);
|
|
|
}
|
|
|
} while (true);
|
|
|
|
|
|
resetContextDependencies();
|
|
|
executionContext = prevExecutionContext;
|
|
|
popDispatcher(prevDispatcher);
|
|
|
|
|
|
if (workInProgress !== null) {
|
|
|
// This is a sync render, so we should have finished the whole tree.
|
|
|
throw new Error('Cannot commit an incomplete root. This error is likely caused by a ' + 'bug in React. Please file an issue.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markRenderStopped();
|
|
|
} // Set this to null to indicate there's no in-progress render.
|
|
|
|
|
|
|
|
|
workInProgressRoot = null;
|
|
|
workInProgressRootRenderLanes = NoLanes;
|
|
|
return workInProgressRootExitStatus;
|
|
|
} // The work loop is an extremely hot path. Tell Closure not to inline it.
|
|
|
|
|
|
/** @noinline */
|
|
|
|
|
|
|
|
|
function workLoopSync() {
|
|
|
// Already timed out, so perform work without checking if we need to yield.
|
|
|
while (workInProgress !== null) {
|
|
|
performUnitOfWork(workInProgress);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function renderRootConcurrent(root, lanes) {
|
|
|
var prevExecutionContext = executionContext;
|
|
|
executionContext |= RenderContext;
|
|
|
var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack
|
|
|
// and prepare a fresh one. Otherwise we'll continue where we left off.
|
|
|
|
|
|
if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) {
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
var memoizedUpdaters = root.memoizedUpdaters;
|
|
|
|
|
|
if (memoizedUpdaters.size > 0) {
|
|
|
restorePendingUpdaters(root, workInProgressRootRenderLanes);
|
|
|
memoizedUpdaters.clear();
|
|
|
} // At this point, move Fibers that scheduled the upcoming work from the Map to the Set.
|
|
|
// If we bailout on this work, we'll move them back (like above).
|
|
|
// It's important to move them now in case the work spawns more work at the same priority with different updaters.
|
|
|
// That way we can keep the current update and future updates separate.
|
|
|
|
|
|
|
|
|
movePendingFibersToMemoized(root, lanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
workInProgressTransitions = getTransitionsForLanes();
|
|
|
resetRenderTimer();
|
|
|
prepareFreshStack(root, lanes);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markRenderStarted(lanes);
|
|
|
}
|
|
|
|
|
|
do {
|
|
|
try {
|
|
|
workLoopConcurrent();
|
|
|
break;
|
|
|
} catch (thrownValue) {
|
|
|
handleError(root, thrownValue);
|
|
|
}
|
|
|
} while (true);
|
|
|
|
|
|
resetContextDependencies();
|
|
|
popDispatcher(prevDispatcher);
|
|
|
executionContext = prevExecutionContext;
|
|
|
|
|
|
|
|
|
if (workInProgress !== null) {
|
|
|
// Still work remaining.
|
|
|
{
|
|
|
markRenderYielded();
|
|
|
}
|
|
|
|
|
|
return RootInProgress;
|
|
|
} else {
|
|
|
// Completed the tree.
|
|
|
{
|
|
|
markRenderStopped();
|
|
|
} // Set this to null to indicate there's no in-progress render.
|
|
|
|
|
|
|
|
|
workInProgressRoot = null;
|
|
|
workInProgressRootRenderLanes = NoLanes; // Return the final exit status.
|
|
|
|
|
|
return workInProgressRootExitStatus;
|
|
|
}
|
|
|
}
|
|
|
/** @noinline */
|
|
|
|
|
|
|
|
|
function workLoopConcurrent() {
|
|
|
// Perform work until Scheduler asks us to yield
|
|
|
while (workInProgress !== null && !shouldYield()) {
|
|
|
performUnitOfWork(workInProgress);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function performUnitOfWork(unitOfWork) {
|
|
|
// The current, flushed, state of this fiber is the alternate. Ideally
|
|
|
// nothing should rely on this, but relying on it here means that we don't
|
|
|
// need an additional field on the work in progress.
|
|
|
var current = unitOfWork.alternate;
|
|
|
setCurrentFiber(unitOfWork);
|
|
|
var next;
|
|
|
|
|
|
if ( (unitOfWork.mode & ProfileMode) !== NoMode) {
|
|
|
startProfilerTimer(unitOfWork);
|
|
|
next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
|
|
|
stopProfilerTimerIfRunningAndRecordDelta(unitOfWork, true);
|
|
|
} else {
|
|
|
next = beginWork$1(current, unitOfWork, subtreeRenderLanes);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
unitOfWork.memoizedProps = unitOfWork.pendingProps;
|
|
|
|
|
|
if (next === null) {
|
|
|
// If this doesn't spawn new work, complete the current work.
|
|
|
completeUnitOfWork(unitOfWork);
|
|
|
} else {
|
|
|
workInProgress = next;
|
|
|
}
|
|
|
|
|
|
ReactCurrentOwner$2.current = null;
|
|
|
}
|
|
|
|
|
|
function completeUnitOfWork(unitOfWork) {
|
|
|
// Attempt to complete the current unit of work, then move to the next
|
|
|
// sibling. If there are no more siblings, return to the parent fiber.
|
|
|
var completedWork = unitOfWork;
|
|
|
|
|
|
do {
|
|
|
// The current, flushed, state of this fiber is the alternate. Ideally
|
|
|
// nothing should rely on this, but relying on it here means that we don't
|
|
|
// need an additional field on the work in progress.
|
|
|
var current = completedWork.alternate;
|
|
|
var returnFiber = completedWork.return; // Check if the work completed or if something threw.
|
|
|
|
|
|
if ((completedWork.flags & Incomplete) === NoFlags) {
|
|
|
setCurrentFiber(completedWork);
|
|
|
var next = void 0;
|
|
|
|
|
|
if ( (completedWork.mode & ProfileMode) === NoMode) {
|
|
|
next = completeWork(current, completedWork, subtreeRenderLanes);
|
|
|
} else {
|
|
|
startProfilerTimer(completedWork);
|
|
|
next = completeWork(current, completedWork, subtreeRenderLanes); // Update render duration assuming we didn't error.
|
|
|
|
|
|
stopProfilerTimerIfRunningAndRecordDelta(completedWork, false);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
|
|
|
if (next !== null) {
|
|
|
// Completing this fiber spawned new work. Work on that next.
|
|
|
workInProgress = next;
|
|
|
return;
|
|
|
}
|
|
|
} else {
|
|
|
// This fiber did not complete because something threw. Pop values off
|
|
|
// the stack without entering the complete phase. If this is a boundary,
|
|
|
// capture values if possible.
|
|
|
var _next = unwindWork(current, completedWork); // Because this fiber did not complete, don't reset its lanes.
|
|
|
|
|
|
|
|
|
if (_next !== null) {
|
|
|
// If completing this work spawned new work, do that next. We'll come
|
|
|
// back here again.
|
|
|
// Since we're restarting, remove anything that is not a host effect
|
|
|
// from the effect tag.
|
|
|
_next.flags &= HostEffectMask;
|
|
|
workInProgress = _next;
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if ( (completedWork.mode & ProfileMode) !== NoMode) {
|
|
|
// Record the render duration for the fiber that errored.
|
|
|
stopProfilerTimerIfRunningAndRecordDelta(completedWork, false); // Include the time spent working on failed children before continuing.
|
|
|
|
|
|
var actualDuration = completedWork.actualDuration;
|
|
|
var child = completedWork.child;
|
|
|
|
|
|
while (child !== null) {
|
|
|
actualDuration += child.actualDuration;
|
|
|
child = child.sibling;
|
|
|
}
|
|
|
|
|
|
completedWork.actualDuration = actualDuration;
|
|
|
}
|
|
|
|
|
|
if (returnFiber !== null) {
|
|
|
// Mark the parent fiber as incomplete and clear its subtree flags.
|
|
|
returnFiber.flags |= Incomplete;
|
|
|
returnFiber.subtreeFlags = NoFlags;
|
|
|
returnFiber.deletions = null;
|
|
|
} else {
|
|
|
// We've unwound all the way to the root.
|
|
|
workInProgressRootExitStatus = RootDidNotComplete;
|
|
|
workInProgress = null;
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var siblingFiber = completedWork.sibling;
|
|
|
|
|
|
if (siblingFiber !== null) {
|
|
|
// If there is more work to do in this returnFiber, do that next.
|
|
|
workInProgress = siblingFiber;
|
|
|
return;
|
|
|
} // Otherwise, return to the parent
|
|
|
|
|
|
|
|
|
completedWork = returnFiber; // Update the next thing we're working on in case something throws.
|
|
|
|
|
|
workInProgress = completedWork;
|
|
|
} while (completedWork !== null); // We've reached the root.
|
|
|
|
|
|
|
|
|
if (workInProgressRootExitStatus === RootInProgress) {
|
|
|
workInProgressRootExitStatus = RootCompleted;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitRoot(root, recoverableErrors, transitions) {
|
|
|
// TODO: This no longer makes any sense. We already wrap the mutation and
|
|
|
// layout phases. Should be able to remove.
|
|
|
var previousUpdateLanePriority = getCurrentUpdatePriority();
|
|
|
var prevTransition = ReactCurrentBatchConfig$3.transition;
|
|
|
|
|
|
try {
|
|
|
ReactCurrentBatchConfig$3.transition = null;
|
|
|
setCurrentUpdatePriority(DiscreteEventPriority);
|
|
|
commitRootImpl(root, recoverableErrors, transitions, previousUpdateLanePriority);
|
|
|
} finally {
|
|
|
ReactCurrentBatchConfig$3.transition = prevTransition;
|
|
|
setCurrentUpdatePriority(previousUpdateLanePriority);
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function commitRootImpl(root, recoverableErrors, transitions, renderPriorityLevel) {
|
|
|
do {
|
|
|
// `flushPassiveEffects` will call `flushSyncUpdateQueue` at the end, which
|
|
|
// means `flushPassiveEffects` will sometimes result in additional
|
|
|
// passive effects. So we need to keep flushing in a loop until there are
|
|
|
// no more pending effects.
|
|
|
// TODO: Might be better if `flushPassiveEffects` did not automatically
|
|
|
// flush synchronous work at the end, to avoid factoring hazards like this.
|
|
|
flushPassiveEffects();
|
|
|
} while (rootWithPendingPassiveEffects !== null);
|
|
|
|
|
|
flushRenderPhaseStrictModeWarningsInDEV();
|
|
|
|
|
|
if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
|
|
|
throw new Error('Should not already be working.');
|
|
|
}
|
|
|
|
|
|
var finishedWork = root.finishedWork;
|
|
|
var lanes = root.finishedLanes;
|
|
|
|
|
|
{
|
|
|
markCommitStarted(lanes);
|
|
|
}
|
|
|
|
|
|
if (finishedWork === null) {
|
|
|
|
|
|
{
|
|
|
markCommitStopped();
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
} else {
|
|
|
{
|
|
|
if (lanes === NoLanes) {
|
|
|
error('root.finishedLanes should not be empty during a commit. This is a ' + 'bug in React.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
root.finishedWork = null;
|
|
|
root.finishedLanes = NoLanes;
|
|
|
|
|
|
if (finishedWork === root.current) {
|
|
|
throw new Error('Cannot commit the same tree as before. This error is likely caused by ' + 'a bug in React. Please file an issue.');
|
|
|
} // commitRoot never returns a continuation; it always finishes synchronously.
|
|
|
// So we can clear these now to allow a new callback to be scheduled.
|
|
|
|
|
|
|
|
|
root.callbackNode = null;
|
|
|
root.callbackPriority = NoLane; // Update the first and last pending times on this root. The new first
|
|
|
// pending time is whatever is left on the root fiber.
|
|
|
|
|
|
var remainingLanes = mergeLanes(finishedWork.lanes, finishedWork.childLanes);
|
|
|
markRootFinished(root, remainingLanes);
|
|
|
|
|
|
if (root === workInProgressRoot) {
|
|
|
// We can reset these now that they are finished.
|
|
|
workInProgressRoot = null;
|
|
|
workInProgress = null;
|
|
|
workInProgressRootRenderLanes = NoLanes;
|
|
|
} // If there are pending passive effects, schedule a callback to process them.
|
|
|
// Do this as early as possible, so it is queued before anything else that
|
|
|
// might get scheduled in the commit phase. (See #16714.)
|
|
|
// TODO: Delete all other places that schedule the passive effect callback
|
|
|
// They're redundant.
|
|
|
|
|
|
|
|
|
if ((finishedWork.subtreeFlags & PassiveMask) !== NoFlags || (finishedWork.flags & PassiveMask) !== NoFlags) {
|
|
|
if (!rootDoesHavePassiveEffects) {
|
|
|
rootDoesHavePassiveEffects = true;
|
|
|
// to store it in pendingPassiveTransitions until they get processed
|
|
|
// We need to pass this through as an argument to commitRoot
|
|
|
// because workInProgressTransitions might have changed between
|
|
|
// the previous render and commit if we throttle the commit
|
|
|
// with setTimeout
|
|
|
|
|
|
pendingPassiveTransitions = transitions;
|
|
|
scheduleCallback$1(NormalPriority, function () {
|
|
|
flushPassiveEffects(); // This render triggered passive effects: release the root cache pool
|
|
|
// *after* passive effects fire to avoid freeing a cache pool that may
|
|
|
// be referenced by a node in the tree (HostRoot, Cache boundary etc)
|
|
|
|
|
|
return null;
|
|
|
});
|
|
|
}
|
|
|
} // Check if there are any effects in the whole tree.
|
|
|
// TODO: This is left over from the effect list implementation, where we had
|
|
|
// to check for the existence of `firstEffect` to satisfy Flow. I think the
|
|
|
// only other reason this optimization exists is because it affects profiling.
|
|
|
// Reconsider whether this is necessary.
|
|
|
|
|
|
|
|
|
var subtreeHasEffects = (finishedWork.subtreeFlags & (BeforeMutationMask | MutationMask | LayoutMask | PassiveMask)) !== NoFlags;
|
|
|
var rootHasEffect = (finishedWork.flags & (BeforeMutationMask | MutationMask | LayoutMask | PassiveMask)) !== NoFlags;
|
|
|
|
|
|
if (subtreeHasEffects || rootHasEffect) {
|
|
|
var prevTransition = ReactCurrentBatchConfig$3.transition;
|
|
|
ReactCurrentBatchConfig$3.transition = null;
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
setCurrentUpdatePriority(DiscreteEventPriority);
|
|
|
var prevExecutionContext = executionContext;
|
|
|
executionContext |= CommitContext; // Reset this to null before calling lifecycles
|
|
|
|
|
|
ReactCurrentOwner$2.current = null; // The commit phase is broken into several sub-phases. We do a separate pass
|
|
|
// of the effect list for each phase: all mutation effects come before all
|
|
|
// layout effects, and so on.
|
|
|
// The first phase a "before mutation" phase. We use this phase to read the
|
|
|
// state of the host tree right before we mutate it. This is where
|
|
|
// getSnapshotBeforeUpdate is called.
|
|
|
|
|
|
var shouldFireAfterActiveInstanceBlur = commitBeforeMutationEffects(root, finishedWork);
|
|
|
|
|
|
{
|
|
|
// Mark the current commit time to be shared by all Profilers in this
|
|
|
// batch. This enables them to be grouped later.
|
|
|
recordCommitTime();
|
|
|
}
|
|
|
|
|
|
|
|
|
commitMutationEffects(root, finishedWork, lanes);
|
|
|
|
|
|
resetAfterCommit(root.containerInfo); // The work-in-progress tree is now the current tree. This must come after
|
|
|
// the mutation phase, so that the previous tree is still current during
|
|
|
// componentWillUnmount, but before the layout phase, so that the finished
|
|
|
// work is current during componentDidMount/Update.
|
|
|
|
|
|
root.current = finishedWork; // The next phase is the layout phase, where we call effects that read
|
|
|
|
|
|
{
|
|
|
markLayoutEffectsStarted(lanes);
|
|
|
}
|
|
|
|
|
|
commitLayoutEffects(finishedWork, root, lanes);
|
|
|
|
|
|
{
|
|
|
markLayoutEffectsStopped();
|
|
|
}
|
|
|
// opportunity to paint.
|
|
|
|
|
|
|
|
|
requestPaint();
|
|
|
executionContext = prevExecutionContext; // Reset the priority to the previous non-sync value.
|
|
|
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig$3.transition = prevTransition;
|
|
|
} else {
|
|
|
// No effects.
|
|
|
root.current = finishedWork; // Measure these anyway so the flamegraph explicitly shows that there were
|
|
|
// no effects.
|
|
|
// TODO: Maybe there's a better way to report this.
|
|
|
|
|
|
{
|
|
|
recordCommitTime();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var rootDidHavePassiveEffects = rootDoesHavePassiveEffects;
|
|
|
|
|
|
if (rootDoesHavePassiveEffects) {
|
|
|
// This commit has passive effects. Stash a reference to them. But don't
|
|
|
// schedule a callback until after flushing layout work.
|
|
|
rootDoesHavePassiveEffects = false;
|
|
|
rootWithPendingPassiveEffects = root;
|
|
|
pendingPassiveEffectsLanes = lanes;
|
|
|
} else {
|
|
|
|
|
|
{
|
|
|
nestedPassiveUpdateCount = 0;
|
|
|
rootWithPassiveNestedUpdates = null;
|
|
|
}
|
|
|
} // Read this again, since an effect might have updated it
|
|
|
|
|
|
|
|
|
remainingLanes = root.pendingLanes; // Check if there's remaining work on this root
|
|
|
// TODO: This is part of the `componentDidCatch` implementation. Its purpose
|
|
|
// is to detect whether something might have called setState inside
|
|
|
// `componentDidCatch`. The mechanism is known to be flawed because `setState`
|
|
|
// inside `componentDidCatch` is itself flawed — that's why we recommend
|
|
|
// `getDerivedStateFromError` instead. However, it could be improved by
|
|
|
// checking if remainingLanes includes Sync work, instead of whether there's
|
|
|
// any work remaining at all (which would also include stuff like Suspense
|
|
|
// retries or transitions). It's been like this for a while, though, so fixing
|
|
|
// it probably isn't that urgent.
|
|
|
|
|
|
if (remainingLanes === NoLanes) {
|
|
|
// If there's no remaining work, we can clear the set of already failed
|
|
|
// error boundaries.
|
|
|
legacyErrorBoundariesThatAlreadyFailed = null;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (!rootDidHavePassiveEffects) {
|
|
|
commitDoubleInvokeEffectsInDEV(root.current, false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
onCommitRoot(finishedWork.stateNode, renderPriorityLevel);
|
|
|
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
root.memoizedUpdaters.clear();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
onCommitRoot$1();
|
|
|
} // Always call this before exiting `commitRoot`, to ensure that any
|
|
|
// additional work on this root is scheduled.
|
|
|
|
|
|
|
|
|
ensureRootIsScheduled(root, now());
|
|
|
|
|
|
if (recoverableErrors !== null) {
|
|
|
// There were errors during this render, but recovered from them without
|
|
|
// needing to surface it to the UI. We log them here.
|
|
|
var onRecoverableError = root.onRecoverableError;
|
|
|
|
|
|
for (var i = 0; i < recoverableErrors.length; i++) {
|
|
|
var recoverableError = recoverableErrors[i];
|
|
|
var componentStack = recoverableError.stack;
|
|
|
var digest = recoverableError.digest;
|
|
|
onRecoverableError(recoverableError.value, {
|
|
|
componentStack: componentStack,
|
|
|
digest: digest
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (hasUncaughtError) {
|
|
|
hasUncaughtError = false;
|
|
|
var error$1 = firstUncaughtError;
|
|
|
firstUncaughtError = null;
|
|
|
throw error$1;
|
|
|
} // If the passive effects are the result of a discrete render, flush them
|
|
|
// synchronously at the end of the current task so that the result is
|
|
|
// immediately observable. Otherwise, we assume that they are not
|
|
|
// order-dependent and do not need to be observed by external systems, so we
|
|
|
// can wait until after paint.
|
|
|
// TODO: We can optimize this by not scheduling the callback earlier. Since we
|
|
|
// currently schedule the callback in multiple places, will wait until those
|
|
|
// are consolidated.
|
|
|
|
|
|
|
|
|
if (includesSomeLane(pendingPassiveEffectsLanes, SyncLane) && root.tag !== LegacyRoot) {
|
|
|
flushPassiveEffects();
|
|
|
} // Read this again, since a passive effect might have updated it
|
|
|
|
|
|
|
|
|
remainingLanes = root.pendingLanes;
|
|
|
|
|
|
if (includesSomeLane(remainingLanes, SyncLane)) {
|
|
|
{
|
|
|
markNestedUpdateScheduled();
|
|
|
} // Count the number of times the root synchronously re-renders without
|
|
|
// finishing. If there are too many, it indicates an infinite update loop.
|
|
|
|
|
|
|
|
|
if (root === rootWithNestedUpdates) {
|
|
|
nestedUpdateCount++;
|
|
|
} else {
|
|
|
nestedUpdateCount = 0;
|
|
|
rootWithNestedUpdates = root;
|
|
|
}
|
|
|
} else {
|
|
|
nestedUpdateCount = 0;
|
|
|
} // If layout work was scheduled, flush it now.
|
|
|
|
|
|
|
|
|
flushSyncCallbacks();
|
|
|
|
|
|
{
|
|
|
markCommitStopped();
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function flushPassiveEffects() {
|
|
|
// Returns whether passive effects were flushed.
|
|
|
// TODO: Combine this check with the one in flushPassiveEFfectsImpl. We should
|
|
|
// probably just combine the two functions. I believe they were only separate
|
|
|
// in the first place because we used to wrap it with
|
|
|
// `Scheduler.runWithPriority`, which accepts a function. But now we track the
|
|
|
// priority within React itself, so we can mutate the variable directly.
|
|
|
if (rootWithPendingPassiveEffects !== null) {
|
|
|
var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes);
|
|
|
var priority = lowerEventPriority(DefaultEventPriority, renderPriority);
|
|
|
var prevTransition = ReactCurrentBatchConfig$3.transition;
|
|
|
var previousPriority = getCurrentUpdatePriority();
|
|
|
|
|
|
try {
|
|
|
ReactCurrentBatchConfig$3.transition = null;
|
|
|
setCurrentUpdatePriority(priority);
|
|
|
return flushPassiveEffectsImpl();
|
|
|
} finally {
|
|
|
setCurrentUpdatePriority(previousPriority);
|
|
|
ReactCurrentBatchConfig$3.transition = prevTransition; // Once passive effects have run for the tree - giving components a
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
function enqueuePendingPassiveProfilerEffect(fiber) {
|
|
|
{
|
|
|
pendingPassiveProfilerEffects.push(fiber);
|
|
|
|
|
|
if (!rootDoesHavePassiveEffects) {
|
|
|
rootDoesHavePassiveEffects = true;
|
|
|
scheduleCallback$1(NormalPriority, function () {
|
|
|
flushPassiveEffects();
|
|
|
return null;
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function flushPassiveEffectsImpl() {
|
|
|
if (rootWithPendingPassiveEffects === null) {
|
|
|
return false;
|
|
|
} // Cache and clear the transitions flag
|
|
|
|
|
|
|
|
|
var transitions = pendingPassiveTransitions;
|
|
|
pendingPassiveTransitions = null;
|
|
|
var root = rootWithPendingPassiveEffects;
|
|
|
var lanes = pendingPassiveEffectsLanes;
|
|
|
rootWithPendingPassiveEffects = null; // TODO: This is sometimes out of sync with rootWithPendingPassiveEffects.
|
|
|
// Figure out why and fix it. It's not causing any known issues (probably
|
|
|
// because it's only used for profiling), but it's a refactor hazard.
|
|
|
|
|
|
pendingPassiveEffectsLanes = NoLanes;
|
|
|
|
|
|
if ((executionContext & (RenderContext | CommitContext)) !== NoContext) {
|
|
|
throw new Error('Cannot flush passive effects while already rendering.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
isFlushingPassiveEffects = true;
|
|
|
didScheduleUpdateDuringPassiveEffects = false;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markPassiveEffectsStarted(lanes);
|
|
|
}
|
|
|
|
|
|
var prevExecutionContext = executionContext;
|
|
|
executionContext |= CommitContext;
|
|
|
commitPassiveUnmountEffects(root.current);
|
|
|
commitPassiveMountEffects(root, root.current, lanes, transitions); // TODO: Move to commitPassiveMountEffects
|
|
|
|
|
|
{
|
|
|
var profilerEffects = pendingPassiveProfilerEffects;
|
|
|
pendingPassiveProfilerEffects = [];
|
|
|
|
|
|
for (var i = 0; i < profilerEffects.length; i++) {
|
|
|
var _fiber = profilerEffects[i];
|
|
|
commitPassiveEffectDurations(root, _fiber);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
markPassiveEffectsStopped();
|
|
|
}
|
|
|
|
|
|
{
|
|
|
commitDoubleInvokeEffectsInDEV(root.current, true);
|
|
|
}
|
|
|
|
|
|
executionContext = prevExecutionContext;
|
|
|
flushSyncCallbacks();
|
|
|
|
|
|
{
|
|
|
// If additional passive effects were scheduled, increment a counter. If this
|
|
|
// exceeds the limit, we'll fire a warning.
|
|
|
if (didScheduleUpdateDuringPassiveEffects) {
|
|
|
if (root === rootWithPassiveNestedUpdates) {
|
|
|
nestedPassiveUpdateCount++;
|
|
|
} else {
|
|
|
nestedPassiveUpdateCount = 0;
|
|
|
rootWithPassiveNestedUpdates = root;
|
|
|
}
|
|
|
} else {
|
|
|
nestedPassiveUpdateCount = 0;
|
|
|
}
|
|
|
|
|
|
isFlushingPassiveEffects = false;
|
|
|
didScheduleUpdateDuringPassiveEffects = false;
|
|
|
} // TODO: Move to commitPassiveMountEffects
|
|
|
|
|
|
|
|
|
onPostCommitRoot(root);
|
|
|
|
|
|
{
|
|
|
var stateNode = root.current.stateNode;
|
|
|
stateNode.effectDuration = 0;
|
|
|
stateNode.passiveEffectDuration = 0;
|
|
|
}
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function isAlreadyFailedLegacyErrorBoundary(instance) {
|
|
|
return legacyErrorBoundariesThatAlreadyFailed !== null && legacyErrorBoundariesThatAlreadyFailed.has(instance);
|
|
|
}
|
|
|
function markLegacyErrorBoundaryAsFailed(instance) {
|
|
|
if (legacyErrorBoundariesThatAlreadyFailed === null) {
|
|
|
legacyErrorBoundariesThatAlreadyFailed = new Set([instance]);
|
|
|
} else {
|
|
|
legacyErrorBoundariesThatAlreadyFailed.add(instance);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function prepareToThrowUncaughtError(error) {
|
|
|
if (!hasUncaughtError) {
|
|
|
hasUncaughtError = true;
|
|
|
firstUncaughtError = error;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var onUncaughtError = prepareToThrowUncaughtError;
|
|
|
|
|
|
function captureCommitPhaseErrorOnRoot(rootFiber, sourceFiber, error) {
|
|
|
var errorInfo = createCapturedValueAtFiber(error, sourceFiber);
|
|
|
var update = createRootErrorUpdate(rootFiber, errorInfo, SyncLane);
|
|
|
var root = enqueueUpdate(rootFiber, update, SyncLane);
|
|
|
var eventTime = requestEventTime();
|
|
|
|
|
|
if (root !== null) {
|
|
|
markRootUpdated(root, SyncLane, eventTime);
|
|
|
ensureRootIsScheduled(root, eventTime);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function captureCommitPhaseError(sourceFiber, nearestMountedAncestor, error$1) {
|
|
|
{
|
|
|
reportUncaughtErrorInDEV(error$1);
|
|
|
setIsRunningInsertionEffect(false);
|
|
|
}
|
|
|
|
|
|
if (sourceFiber.tag === HostRoot) {
|
|
|
// Error was thrown at the root. There is no parent, so the root
|
|
|
// itself should capture it.
|
|
|
captureCommitPhaseErrorOnRoot(sourceFiber, sourceFiber, error$1);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var fiber = null;
|
|
|
|
|
|
{
|
|
|
fiber = nearestMountedAncestor;
|
|
|
}
|
|
|
|
|
|
while (fiber !== null) {
|
|
|
if (fiber.tag === HostRoot) {
|
|
|
captureCommitPhaseErrorOnRoot(fiber, sourceFiber, error$1);
|
|
|
return;
|
|
|
} else if (fiber.tag === ClassComponent) {
|
|
|
var ctor = fiber.type;
|
|
|
var instance = fiber.stateNode;
|
|
|
|
|
|
if (typeof ctor.getDerivedStateFromError === 'function' || typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance)) {
|
|
|
var errorInfo = createCapturedValueAtFiber(error$1, sourceFiber);
|
|
|
var update = createClassErrorUpdate(fiber, errorInfo, SyncLane);
|
|
|
var root = enqueueUpdate(fiber, update, SyncLane);
|
|
|
var eventTime = requestEventTime();
|
|
|
|
|
|
if (root !== null) {
|
|
|
markRootUpdated(root, SyncLane, eventTime);
|
|
|
ensureRootIsScheduled(root, eventTime);
|
|
|
}
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
fiber = fiber.return;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// TODO: Until we re-land skipUnmountedBoundaries (see #20147), this warning
|
|
|
// will fire for errors that are thrown by destroy functions inside deleted
|
|
|
// trees. What it should instead do is propagate the error to the parent of
|
|
|
// the deleted tree. In the meantime, do not add this warning to the
|
|
|
// allowlist; this is only for our internal use.
|
|
|
error('Internal React error: Attempted to capture a commit phase error ' + 'inside a detached tree. This indicates a bug in React. Likely ' + 'causes include deleting the same fiber more than once, committing an ' + 'already-finished tree, or an inconsistent return pointer.\n\n' + 'Error message:\n\n%s', error$1);
|
|
|
}
|
|
|
}
|
|
|
function pingSuspendedRoot(root, wakeable, pingedLanes) {
|
|
|
var pingCache = root.pingCache;
|
|
|
|
|
|
if (pingCache !== null) {
|
|
|
// The wakeable resolved, so we no longer need to memoize, because it will
|
|
|
// never be thrown again.
|
|
|
pingCache.delete(wakeable);
|
|
|
}
|
|
|
|
|
|
var eventTime = requestEventTime();
|
|
|
markRootPinged(root, pingedLanes);
|
|
|
warnIfSuspenseResolutionNotWrappedWithActDEV(root);
|
|
|
|
|
|
if (workInProgressRoot === root && isSubsetOfLanes(workInProgressRootRenderLanes, pingedLanes)) {
|
|
|
// Received a ping at the same priority level at which we're currently
|
|
|
// rendering. We might want to restart this render. This should mirror
|
|
|
// the logic of whether or not a root suspends once it completes.
|
|
|
// TODO: If we're rendering sync either due to Sync, Batched or expired,
|
|
|
// we should probably never restart.
|
|
|
// If we're suspended with delay, or if it's a retry, we'll always suspend
|
|
|
// so we can always restart.
|
|
|
if (workInProgressRootExitStatus === RootSuspendedWithDelay || workInProgressRootExitStatus === RootSuspended && includesOnlyRetries(workInProgressRootRenderLanes) && now() - globalMostRecentFallbackTime < FALLBACK_THROTTLE_MS) {
|
|
|
// Restart from the root.
|
|
|
prepareFreshStack(root, NoLanes);
|
|
|
} else {
|
|
|
// Even though we can't restart right now, we might get an
|
|
|
// opportunity later. So we mark this render as having a ping.
|
|
|
workInProgressRootPingedLanes = mergeLanes(workInProgressRootPingedLanes, pingedLanes);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ensureRootIsScheduled(root, eventTime);
|
|
|
}
|
|
|
|
|
|
function retryTimedOutBoundary(boundaryFiber, retryLane) {
|
|
|
// The boundary fiber (a Suspense component or SuspenseList component)
|
|
|
// previously was rendered in its fallback state. One of the promises that
|
|
|
// suspended it has resolved, which means at least part of the tree was
|
|
|
// likely unblocked. Try rendering again, at a new lanes.
|
|
|
if (retryLane === NoLane) {
|
|
|
// TODO: Assign this to `suspenseState.retryLane`? to avoid
|
|
|
// unnecessary entanglement?
|
|
|
retryLane = requestRetryLane(boundaryFiber);
|
|
|
} // TODO: Special case idle priority?
|
|
|
|
|
|
|
|
|
var eventTime = requestEventTime();
|
|
|
var root = enqueueConcurrentRenderForLane(boundaryFiber, retryLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
markRootUpdated(root, retryLane, eventTime);
|
|
|
ensureRootIsScheduled(root, eventTime);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function retryDehydratedSuspenseBoundary(boundaryFiber) {
|
|
|
var suspenseState = boundaryFiber.memoizedState;
|
|
|
var retryLane = NoLane;
|
|
|
|
|
|
if (suspenseState !== null) {
|
|
|
retryLane = suspenseState.retryLane;
|
|
|
}
|
|
|
|
|
|
retryTimedOutBoundary(boundaryFiber, retryLane);
|
|
|
}
|
|
|
function resolveRetryWakeable(boundaryFiber, wakeable) {
|
|
|
var retryLane = NoLane; // Default
|
|
|
|
|
|
var retryCache;
|
|
|
|
|
|
switch (boundaryFiber.tag) {
|
|
|
case SuspenseComponent:
|
|
|
retryCache = boundaryFiber.stateNode;
|
|
|
var suspenseState = boundaryFiber.memoizedState;
|
|
|
|
|
|
if (suspenseState !== null) {
|
|
|
retryLane = suspenseState.retryLane;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
case SuspenseListComponent:
|
|
|
retryCache = boundaryFiber.stateNode;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
throw new Error('Pinged unknown suspense boundary type. ' + 'This is probably a bug in React.');
|
|
|
}
|
|
|
|
|
|
if (retryCache !== null) {
|
|
|
// The wakeable resolved, so we no longer need to memoize, because it will
|
|
|
// never be thrown again.
|
|
|
retryCache.delete(wakeable);
|
|
|
}
|
|
|
|
|
|
retryTimedOutBoundary(boundaryFiber, retryLane);
|
|
|
} // Computes the next Just Noticeable Difference (JND) boundary.
|
|
|
// The theory is that a person can't tell the difference between small differences in time.
|
|
|
// Therefore, if we wait a bit longer than necessary that won't translate to a noticeable
|
|
|
// difference in the experience. However, waiting for longer might mean that we can avoid
|
|
|
// showing an intermediate loading state. The longer we have already waited, the harder it
|
|
|
// is to tell small differences in time. Therefore, the longer we've already waited,
|
|
|
// the longer we can wait additionally. At some point we have to give up though.
|
|
|
// We pick a train model where the next boundary commits at a consistent schedule.
|
|
|
// These particular numbers are vague estimates. We expect to adjust them based on research.
|
|
|
|
|
|
function jnd(timeElapsed) {
|
|
|
return timeElapsed < 120 ? 120 : timeElapsed < 480 ? 480 : timeElapsed < 1080 ? 1080 : timeElapsed < 1920 ? 1920 : timeElapsed < 3000 ? 3000 : timeElapsed < 4320 ? 4320 : ceil(timeElapsed / 1960) * 1960;
|
|
|
}
|
|
|
|
|
|
function checkForNestedUpdates() {
|
|
|
if (nestedUpdateCount > NESTED_UPDATE_LIMIT) {
|
|
|
nestedUpdateCount = 0;
|
|
|
rootWithNestedUpdates = null;
|
|
|
throw new Error('Maximum update depth exceeded. This can happen when a component ' + 'repeatedly calls setState inside componentWillUpdate or ' + 'componentDidUpdate. React limits the number of nested updates to ' + 'prevent infinite loops.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (nestedPassiveUpdateCount > NESTED_PASSIVE_UPDATE_LIMIT) {
|
|
|
nestedPassiveUpdateCount = 0;
|
|
|
rootWithPassiveNestedUpdates = null;
|
|
|
|
|
|
error('Maximum update depth exceeded. This can happen when a component ' + "calls setState inside useEffect, but useEffect either doesn't " + 'have a dependency array, or one of the dependencies changes on ' + 'every render.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function flushRenderPhaseStrictModeWarningsInDEV() {
|
|
|
{
|
|
|
ReactStrictModeWarnings.flushLegacyContextWarning();
|
|
|
|
|
|
{
|
|
|
ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function commitDoubleInvokeEffectsInDEV(fiber, hasPassiveEffects) {
|
|
|
{
|
|
|
// TODO (StrictEffects) Should we set a marker on the root if it contains strict effects
|
|
|
// so we don't traverse unnecessarily? similar to subtreeFlags but just at the root level.
|
|
|
// Maybe not a big deal since this is DEV only behavior.
|
|
|
setCurrentFiber(fiber);
|
|
|
invokeEffectsInDev(fiber, MountLayoutDev, invokeLayoutEffectUnmountInDEV);
|
|
|
|
|
|
if (hasPassiveEffects) {
|
|
|
invokeEffectsInDev(fiber, MountPassiveDev, invokePassiveEffectUnmountInDEV);
|
|
|
}
|
|
|
|
|
|
invokeEffectsInDev(fiber, MountLayoutDev, invokeLayoutEffectMountInDEV);
|
|
|
|
|
|
if (hasPassiveEffects) {
|
|
|
invokeEffectsInDev(fiber, MountPassiveDev, invokePassiveEffectMountInDEV);
|
|
|
}
|
|
|
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function invokeEffectsInDev(firstChild, fiberFlags, invokeEffectFn) {
|
|
|
{
|
|
|
// We don't need to re-check StrictEffectsMode here.
|
|
|
// This function is only called if that check has already passed.
|
|
|
var current = firstChild;
|
|
|
var subtreeRoot = null;
|
|
|
|
|
|
while (current !== null) {
|
|
|
var primarySubtreeFlag = current.subtreeFlags & fiberFlags;
|
|
|
|
|
|
if (current !== subtreeRoot && current.child !== null && primarySubtreeFlag !== NoFlags) {
|
|
|
current = current.child;
|
|
|
} else {
|
|
|
if ((current.flags & fiberFlags) !== NoFlags) {
|
|
|
invokeEffectFn(current);
|
|
|
}
|
|
|
|
|
|
if (current.sibling !== null) {
|
|
|
current = current.sibling;
|
|
|
} else {
|
|
|
current = subtreeRoot = current.return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnStateUpdateForNotYetMountedComponent = null;
|
|
|
function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber) {
|
|
|
{
|
|
|
if ((executionContext & RenderContext) !== NoContext) {
|
|
|
// We let the other warning about render phase updates deal with this one.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (!(fiber.mode & ConcurrentMode)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var tag = fiber.tag;
|
|
|
|
|
|
if (tag !== IndeterminateComponent && tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent) {
|
|
|
// Only warn for user-defined components, not internal ones like Suspense.
|
|
|
return;
|
|
|
} // We show the whole stack but dedupe on the top component's name because
|
|
|
// the problematic code almost always lies inside that component.
|
|
|
|
|
|
|
|
|
var componentName = getComponentNameFromFiber(fiber) || 'ReactComponent';
|
|
|
|
|
|
if (didWarnStateUpdateForNotYetMountedComponent !== null) {
|
|
|
if (didWarnStateUpdateForNotYetMountedComponent.has(componentName)) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
didWarnStateUpdateForNotYetMountedComponent.add(componentName);
|
|
|
} else {
|
|
|
didWarnStateUpdateForNotYetMountedComponent = new Set([componentName]);
|
|
|
}
|
|
|
|
|
|
var previousFiber = current;
|
|
|
|
|
|
try {
|
|
|
setCurrentFiber(fiber);
|
|
|
|
|
|
error("Can't perform a React state update on a component that hasn't mounted yet. " + 'This indicates that you have a side-effect in your render function that ' + 'asynchronously later calls tries to update the component. Move this work to ' + 'useEffect instead.');
|
|
|
} finally {
|
|
|
if (previousFiber) {
|
|
|
setCurrentFiber(fiber);
|
|
|
} else {
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
var beginWork$1;
|
|
|
|
|
|
{
|
|
|
var dummyFiber = null;
|
|
|
|
|
|
beginWork$1 = function (current, unitOfWork, lanes) {
|
|
|
// If a component throws an error, we replay it again in a synchronously
|
|
|
// dispatched event, so that the debugger will treat it as an uncaught
|
|
|
// error See ReactErrorUtils for more information.
|
|
|
// Before entering the begin phase, copy the work-in-progress onto a dummy
|
|
|
// fiber. If beginWork throws, we'll use this to reset the state.
|
|
|
var originalWorkInProgressCopy = assignFiberPropertiesInDEV(dummyFiber, unitOfWork);
|
|
|
|
|
|
try {
|
|
|
return beginWork(current, unitOfWork, lanes);
|
|
|
} catch (originalError) {
|
|
|
if (didSuspendOrErrorWhileHydratingDEV() || originalError !== null && typeof originalError === 'object' && typeof originalError.then === 'function') {
|
|
|
// Don't replay promises.
|
|
|
// Don't replay errors if we are hydrating and have already suspended or handled an error
|
|
|
throw originalError;
|
|
|
} // Keep this code in sync with handleError; any changes here must have
|
|
|
// corresponding changes there.
|
|
|
|
|
|
|
|
|
resetContextDependencies();
|
|
|
resetHooksAfterThrow(); // Don't reset current debug fiber, since we're about to work on the
|
|
|
// same fiber again.
|
|
|
// Unwind the failed stack frame
|
|
|
|
|
|
unwindInterruptedWork(current, unitOfWork); // Restore the original properties of the fiber.
|
|
|
|
|
|
assignFiberPropertiesInDEV(unitOfWork, originalWorkInProgressCopy);
|
|
|
|
|
|
if ( unitOfWork.mode & ProfileMode) {
|
|
|
// Reset the profiler timer.
|
|
|
startProfilerTimer(unitOfWork);
|
|
|
} // Run beginWork again.
|
|
|
|
|
|
|
|
|
invokeGuardedCallback(null, beginWork, null, current, unitOfWork, lanes);
|
|
|
|
|
|
if (hasCaughtError()) {
|
|
|
var replayError = clearCaughtError();
|
|
|
|
|
|
if (typeof replayError === 'object' && replayError !== null && replayError._suppressLogging && typeof originalError === 'object' && originalError !== null && !originalError._suppressLogging) {
|
|
|
// If suppressed, let the flag carry over to the original error which is the one we'll rethrow.
|
|
|
originalError._suppressLogging = true;
|
|
|
}
|
|
|
} // We always throw the original error in case the second render pass is not idempotent.
|
|
|
// This can happen if a memoized function or CommonJS module doesn't throw after first invocation.
|
|
|
|
|
|
|
|
|
throw originalError;
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var didWarnAboutUpdateInRender = false;
|
|
|
var didWarnAboutUpdateInRenderForAnotherComponent;
|
|
|
|
|
|
{
|
|
|
didWarnAboutUpdateInRenderForAnotherComponent = new Set();
|
|
|
}
|
|
|
|
|
|
function warnAboutRenderPhaseUpdatesInDEV(fiber) {
|
|
|
{
|
|
|
if (isRendering && !getIsUpdatingOpaqueValueInRenderPhaseInDEV()) {
|
|
|
switch (fiber.tag) {
|
|
|
case FunctionComponent:
|
|
|
case ForwardRef:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
var renderingComponentName = workInProgress && getComponentNameFromFiber(workInProgress) || 'Unknown'; // Dedupe by the rendering component because it's the one that needs to be fixed.
|
|
|
|
|
|
var dedupeKey = renderingComponentName;
|
|
|
|
|
|
if (!didWarnAboutUpdateInRenderForAnotherComponent.has(dedupeKey)) {
|
|
|
didWarnAboutUpdateInRenderForAnotherComponent.add(dedupeKey);
|
|
|
var setStateComponentName = getComponentNameFromFiber(fiber) || 'Unknown';
|
|
|
|
|
|
error('Cannot update a component (`%s`) while rendering a ' + 'different component (`%s`). To locate the bad setState() call inside `%s`, ' + 'follow the stack trace as described in https://reactjs.org/link/setstate-in-render', setStateComponentName, renderingComponentName, renderingComponentName);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
if (!didWarnAboutUpdateInRender) {
|
|
|
error('Cannot update during an existing state transition (such as ' + 'within `render`). Render methods should be a pure ' + 'function of props and state.');
|
|
|
|
|
|
didWarnAboutUpdateInRender = true;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function restorePendingUpdaters(root, lanes) {
|
|
|
{
|
|
|
if (isDevToolsPresent) {
|
|
|
var memoizedUpdaters = root.memoizedUpdaters;
|
|
|
memoizedUpdaters.forEach(function (schedulingFiber) {
|
|
|
addFiberToLanesMap(root, schedulingFiber, lanes);
|
|
|
}); // This function intentionally does not clear memoized updaters.
|
|
|
// Those may still be relevant to the current commit
|
|
|
// and a future one (e.g. Suspense).
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
var fakeActCallbackNode = {};
|
|
|
|
|
|
function scheduleCallback$1(priorityLevel, callback) {
|
|
|
{
|
|
|
// If we're currently inside an `act` scope, bypass Scheduler and push to
|
|
|
// the `act` queue instead.
|
|
|
var actQueue = ReactCurrentActQueue$1.current;
|
|
|
|
|
|
if (actQueue !== null) {
|
|
|
actQueue.push(callback);
|
|
|
return fakeActCallbackNode;
|
|
|
} else {
|
|
|
return scheduleCallback(priorityLevel, callback);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function cancelCallback$1(callbackNode) {
|
|
|
if ( callbackNode === fakeActCallbackNode) {
|
|
|
return;
|
|
|
} // In production, always call Scheduler. This function will be stripped out.
|
|
|
|
|
|
|
|
|
return cancelCallback(callbackNode);
|
|
|
}
|
|
|
|
|
|
function shouldForceFlushFallbacksInDEV() {
|
|
|
// Never force flush in production. This function should get stripped out.
|
|
|
return ReactCurrentActQueue$1.current !== null;
|
|
|
}
|
|
|
|
|
|
function warnIfUpdatesNotWrappedWithActDEV(fiber) {
|
|
|
{
|
|
|
if (fiber.mode & ConcurrentMode) {
|
|
|
if (!isConcurrentActEnvironment()) {
|
|
|
// Not in an act environment. No need to warn.
|
|
|
return;
|
|
|
}
|
|
|
} else {
|
|
|
// Legacy mode has additional cases where we suppress a warning.
|
|
|
if (!isLegacyActEnvironment()) {
|
|
|
// Not in an act environment. No need to warn.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (executionContext !== NoContext) {
|
|
|
// Legacy mode doesn't warn if the update is batched, i.e.
|
|
|
// batchedUpdates or flushSync.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (fiber.tag !== FunctionComponent && fiber.tag !== ForwardRef && fiber.tag !== SimpleMemoComponent) {
|
|
|
// For backwards compatibility with pre-hooks code, legacy mode only
|
|
|
// warns for updates that originate from a hook.
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (ReactCurrentActQueue$1.current === null) {
|
|
|
var previousFiber = current;
|
|
|
|
|
|
try {
|
|
|
setCurrentFiber(fiber);
|
|
|
|
|
|
error('An update to %s inside a test was not wrapped in act(...).\n\n' + 'When testing, code that causes React state updates should be ' + 'wrapped into act(...):\n\n' + 'act(() => {\n' + ' /* fire events that update state */\n' + '});\n' + '/* assert on the output */\n\n' + "This ensures that you're testing the behavior the user would see " + 'in the browser.' + ' Learn more at https://reactjs.org/link/wrap-tests-with-act', getComponentNameFromFiber(fiber));
|
|
|
} finally {
|
|
|
if (previousFiber) {
|
|
|
setCurrentFiber(fiber);
|
|
|
} else {
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function warnIfSuspenseResolutionNotWrappedWithActDEV(root) {
|
|
|
{
|
|
|
if (root.tag !== LegacyRoot && isConcurrentActEnvironment() && ReactCurrentActQueue$1.current === null) {
|
|
|
error('A suspended resource finished loading inside a test, but the event ' + 'was not wrapped in act(...).\n\n' + 'When testing, code that resolves suspended data should be wrapped ' + 'into act(...):\n\n' + 'act(() => {\n' + ' /* finish loading suspended data */\n' + '});\n' + '/* assert on the output */\n\n' + "This ensures that you're testing the behavior the user would see " + 'in the browser.' + ' Learn more at https://reactjs.org/link/wrap-tests-with-act');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function setIsRunningInsertionEffect(isRunning) {
|
|
|
{
|
|
|
isRunningInsertionEffect = isRunning;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/* eslint-disable react-internal/prod-error-codes */
|
|
|
var resolveFamily = null; // $FlowFixMe Flow gets confused by a WeakSet feature check below.
|
|
|
|
|
|
var failedBoundaries = null;
|
|
|
var setRefreshHandler = function (handler) {
|
|
|
{
|
|
|
resolveFamily = handler;
|
|
|
}
|
|
|
};
|
|
|
function resolveFunctionForHotReloading(type) {
|
|
|
{
|
|
|
if (resolveFamily === null) {
|
|
|
// Hot reloading is disabled.
|
|
|
return type;
|
|
|
}
|
|
|
|
|
|
var family = resolveFamily(type);
|
|
|
|
|
|
if (family === undefined) {
|
|
|
return type;
|
|
|
} // Use the latest known implementation.
|
|
|
|
|
|
|
|
|
return family.current;
|
|
|
}
|
|
|
}
|
|
|
function resolveClassForHotReloading(type) {
|
|
|
// No implementation differences.
|
|
|
return resolveFunctionForHotReloading(type);
|
|
|
}
|
|
|
function resolveForwardRefForHotReloading(type) {
|
|
|
{
|
|
|
if (resolveFamily === null) {
|
|
|
// Hot reloading is disabled.
|
|
|
return type;
|
|
|
}
|
|
|
|
|
|
var family = resolveFamily(type);
|
|
|
|
|
|
if (family === undefined) {
|
|
|
// Check if we're dealing with a real forwardRef. Don't want to crash early.
|
|
|
if (type !== null && type !== undefined && typeof type.render === 'function') {
|
|
|
// ForwardRef is special because its resolved .type is an object,
|
|
|
// but it's possible that we only have its inner render function in the map.
|
|
|
// If that inner render function is different, we'll build a new forwardRef type.
|
|
|
var currentRender = resolveFunctionForHotReloading(type.render);
|
|
|
|
|
|
if (type.render !== currentRender) {
|
|
|
var syntheticType = {
|
|
|
$$typeof: REACT_FORWARD_REF_TYPE,
|
|
|
render: currentRender
|
|
|
};
|
|
|
|
|
|
if (type.displayName !== undefined) {
|
|
|
syntheticType.displayName = type.displayName;
|
|
|
}
|
|
|
|
|
|
return syntheticType;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return type;
|
|
|
} // Use the latest known implementation.
|
|
|
|
|
|
|
|
|
return family.current;
|
|
|
}
|
|
|
}
|
|
|
function isCompatibleFamilyForHotReloading(fiber, element) {
|
|
|
{
|
|
|
if (resolveFamily === null) {
|
|
|
// Hot reloading is disabled.
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var prevType = fiber.elementType;
|
|
|
var nextType = element.type; // If we got here, we know types aren't === equal.
|
|
|
|
|
|
var needsCompareFamilies = false;
|
|
|
var $$typeofNextType = typeof nextType === 'object' && nextType !== null ? nextType.$$typeof : null;
|
|
|
|
|
|
switch (fiber.tag) {
|
|
|
case ClassComponent:
|
|
|
{
|
|
|
if (typeof nextType === 'function') {
|
|
|
needsCompareFamilies = true;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case FunctionComponent:
|
|
|
{
|
|
|
if (typeof nextType === 'function') {
|
|
|
needsCompareFamilies = true;
|
|
|
} else if ($$typeofNextType === REACT_LAZY_TYPE) {
|
|
|
// We don't know the inner type yet.
|
|
|
// We're going to assume that the lazy inner type is stable,
|
|
|
// and so it is sufficient to avoid reconciling it away.
|
|
|
// We're not going to unwrap or actually use the new lazy type.
|
|
|
needsCompareFamilies = true;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case ForwardRef:
|
|
|
{
|
|
|
if ($$typeofNextType === REACT_FORWARD_REF_TYPE) {
|
|
|
needsCompareFamilies = true;
|
|
|
} else if ($$typeofNextType === REACT_LAZY_TYPE) {
|
|
|
needsCompareFamilies = true;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case MemoComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
{
|
|
|
if ($$typeofNextType === REACT_MEMO_TYPE) {
|
|
|
// TODO: if it was but can no longer be simple,
|
|
|
// we shouldn't set this.
|
|
|
needsCompareFamilies = true;
|
|
|
} else if ($$typeofNextType === REACT_LAZY_TYPE) {
|
|
|
needsCompareFamilies = true;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
default:
|
|
|
return false;
|
|
|
} // Check if both types have a family and it's the same one.
|
|
|
|
|
|
|
|
|
if (needsCompareFamilies) {
|
|
|
// Note: memo() and forwardRef() we'll compare outer rather than inner type.
|
|
|
// This means both of them need to be registered to preserve state.
|
|
|
// If we unwrapped and compared the inner types for wrappers instead,
|
|
|
// then we would risk falsely saying two separate memo(Foo)
|
|
|
// calls are equivalent because they wrap the same Foo function.
|
|
|
var prevFamily = resolveFamily(prevType);
|
|
|
|
|
|
if (prevFamily !== undefined && prevFamily === resolveFamily(nextType)) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
function markFailedErrorBoundaryForHotReloading(fiber) {
|
|
|
{
|
|
|
if (resolveFamily === null) {
|
|
|
// Hot reloading is disabled.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (typeof WeakSet !== 'function') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (failedBoundaries === null) {
|
|
|
failedBoundaries = new WeakSet();
|
|
|
}
|
|
|
|
|
|
failedBoundaries.add(fiber);
|
|
|
}
|
|
|
}
|
|
|
var scheduleRefresh = function (root, update) {
|
|
|
{
|
|
|
if (resolveFamily === null) {
|
|
|
// Hot reloading is disabled.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var staleFamilies = update.staleFamilies,
|
|
|
updatedFamilies = update.updatedFamilies;
|
|
|
flushPassiveEffects();
|
|
|
flushSync(function () {
|
|
|
scheduleFibersWithFamiliesRecursively(root.current, updatedFamilies, staleFamilies);
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
var scheduleRoot = function (root, element) {
|
|
|
{
|
|
|
if (root.context !== emptyContextObject) {
|
|
|
// Super edge case: root has a legacy _renderSubtree context
|
|
|
// but we don't know the parentComponent so we can't pass it.
|
|
|
// Just ignore. We'll delete this with _renderSubtree code path later.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
flushPassiveEffects();
|
|
|
flushSync(function () {
|
|
|
updateContainer(element, root, null, null);
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
|
|
|
function scheduleFibersWithFamiliesRecursively(fiber, updatedFamilies, staleFamilies) {
|
|
|
{
|
|
|
var alternate = fiber.alternate,
|
|
|
child = fiber.child,
|
|
|
sibling = fiber.sibling,
|
|
|
tag = fiber.tag,
|
|
|
type = fiber.type;
|
|
|
var candidateType = null;
|
|
|
|
|
|
switch (tag) {
|
|
|
case FunctionComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
case ClassComponent:
|
|
|
candidateType = type;
|
|
|
break;
|
|
|
|
|
|
case ForwardRef:
|
|
|
candidateType = type.render;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
if (resolveFamily === null) {
|
|
|
throw new Error('Expected resolveFamily to be set during hot reload.');
|
|
|
}
|
|
|
|
|
|
var needsRender = false;
|
|
|
var needsRemount = false;
|
|
|
|
|
|
if (candidateType !== null) {
|
|
|
var family = resolveFamily(candidateType);
|
|
|
|
|
|
if (family !== undefined) {
|
|
|
if (staleFamilies.has(family)) {
|
|
|
needsRemount = true;
|
|
|
} else if (updatedFamilies.has(family)) {
|
|
|
if (tag === ClassComponent) {
|
|
|
needsRemount = true;
|
|
|
} else {
|
|
|
needsRender = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (failedBoundaries !== null) {
|
|
|
if (failedBoundaries.has(fiber) || alternate !== null && failedBoundaries.has(alternate)) {
|
|
|
needsRemount = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (needsRemount) {
|
|
|
fiber._debugNeedsRemount = true;
|
|
|
}
|
|
|
|
|
|
if (needsRemount || needsRender) {
|
|
|
var _root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (_root !== null) {
|
|
|
scheduleUpdateOnFiber(_root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (child !== null && !needsRemount) {
|
|
|
scheduleFibersWithFamiliesRecursively(child, updatedFamilies, staleFamilies);
|
|
|
}
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
scheduleFibersWithFamiliesRecursively(sibling, updatedFamilies, staleFamilies);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var findHostInstancesForRefresh = function (root, families) {
|
|
|
{
|
|
|
var hostInstances = new Set();
|
|
|
var types = new Set(families.map(function (family) {
|
|
|
return family.current;
|
|
|
}));
|
|
|
findHostInstancesForMatchingFibersRecursively(root.current, types, hostInstances);
|
|
|
return hostInstances;
|
|
|
}
|
|
|
};
|
|
|
|
|
|
function findHostInstancesForMatchingFibersRecursively(fiber, types, hostInstances) {
|
|
|
{
|
|
|
var child = fiber.child,
|
|
|
sibling = fiber.sibling,
|
|
|
tag = fiber.tag,
|
|
|
type = fiber.type;
|
|
|
var candidateType = null;
|
|
|
|
|
|
switch (tag) {
|
|
|
case FunctionComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
case ClassComponent:
|
|
|
candidateType = type;
|
|
|
break;
|
|
|
|
|
|
case ForwardRef:
|
|
|
candidateType = type.render;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var didMatch = false;
|
|
|
|
|
|
if (candidateType !== null) {
|
|
|
if (types.has(candidateType)) {
|
|
|
didMatch = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (didMatch) {
|
|
|
// We have a match. This only drills down to the closest host components.
|
|
|
// There's no need to search deeper because for the purpose of giving
|
|
|
// visual feedback, "flashing" outermost parent rectangles is sufficient.
|
|
|
findHostInstancesForFiberShallowly(fiber, hostInstances);
|
|
|
} else {
|
|
|
// If there's no match, maybe there will be one further down in the child tree.
|
|
|
if (child !== null) {
|
|
|
findHostInstancesForMatchingFibersRecursively(child, types, hostInstances);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (sibling !== null) {
|
|
|
findHostInstancesForMatchingFibersRecursively(sibling, types, hostInstances);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function findHostInstancesForFiberShallowly(fiber, hostInstances) {
|
|
|
{
|
|
|
var foundHostInstances = findChildHostInstancesForFiberShallowly(fiber, hostInstances);
|
|
|
|
|
|
if (foundHostInstances) {
|
|
|
return;
|
|
|
} // If we didn't find any host children, fallback to closest host parent.
|
|
|
|
|
|
|
|
|
var node = fiber;
|
|
|
|
|
|
while (true) {
|
|
|
switch (node.tag) {
|
|
|
case HostComponent:
|
|
|
hostInstances.add(node.stateNode);
|
|
|
return;
|
|
|
|
|
|
case HostPortal:
|
|
|
hostInstances.add(node.stateNode.containerInfo);
|
|
|
return;
|
|
|
|
|
|
case HostRoot:
|
|
|
hostInstances.add(node.stateNode.containerInfo);
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (node.return === null) {
|
|
|
throw new Error('Expected to reach root first.');
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function findChildHostInstancesForFiberShallowly(fiber, hostInstances) {
|
|
|
{
|
|
|
var node = fiber;
|
|
|
var foundHostInstances = false;
|
|
|
|
|
|
while (true) {
|
|
|
if (node.tag === HostComponent) {
|
|
|
// We got a match.
|
|
|
foundHostInstances = true;
|
|
|
hostInstances.add(node.stateNode); // There may still be more, so keep searching.
|
|
|
} else if (node.child !== null) {
|
|
|
node.child.return = node;
|
|
|
node = node.child;
|
|
|
continue;
|
|
|
}
|
|
|
|
|
|
if (node === fiber) {
|
|
|
return foundHostInstances;
|
|
|
}
|
|
|
|
|
|
while (node.sibling === null) {
|
|
|
if (node.return === null || node.return === fiber) {
|
|
|
return foundHostInstances;
|
|
|
}
|
|
|
|
|
|
node = node.return;
|
|
|
}
|
|
|
|
|
|
node.sibling.return = node.return;
|
|
|
node = node.sibling;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
var hasBadMapPolyfill;
|
|
|
|
|
|
{
|
|
|
hasBadMapPolyfill = false;
|
|
|
|
|
|
try {
|
|
|
var nonExtensibleObject = Object.preventExtensions({});
|
|
|
/* eslint-disable no-new */
|
|
|
|
|
|
new Map([[nonExtensibleObject, null]]);
|
|
|
new Set([nonExtensibleObject]);
|
|
|
/* eslint-enable no-new */
|
|
|
} catch (e) {
|
|
|
// TODO: Consider warning about bad polyfills
|
|
|
hasBadMapPolyfill = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function FiberNode(tag, pendingProps, key, mode) {
|
|
|
// Instance
|
|
|
this.tag = tag;
|
|
|
this.key = key;
|
|
|
this.elementType = null;
|
|
|
this.type = null;
|
|
|
this.stateNode = null; // Fiber
|
|
|
|
|
|
this.return = null;
|
|
|
this.child = null;
|
|
|
this.sibling = null;
|
|
|
this.index = 0;
|
|
|
this.ref = null;
|
|
|
this.pendingProps = pendingProps;
|
|
|
this.memoizedProps = null;
|
|
|
this.updateQueue = null;
|
|
|
this.memoizedState = null;
|
|
|
this.dependencies = null;
|
|
|
this.mode = mode; // Effects
|
|
|
|
|
|
this.flags = NoFlags;
|
|
|
this.subtreeFlags = NoFlags;
|
|
|
this.deletions = null;
|
|
|
this.lanes = NoLanes;
|
|
|
this.childLanes = NoLanes;
|
|
|
this.alternate = null;
|
|
|
|
|
|
{
|
|
|
// Note: The following is done to avoid a v8 performance cliff.
|
|
|
//
|
|
|
// Initializing the fields below to smis and later updating them with
|
|
|
// double values will cause Fibers to end up having separate shapes.
|
|
|
// This behavior/bug has something to do with Object.preventExtension().
|
|
|
// Fortunately this only impacts DEV builds.
|
|
|
// Unfortunately it makes React unusably slow for some applications.
|
|
|
// To work around this, initialize the fields below with doubles.
|
|
|
//
|
|
|
// Learn more about this here:
|
|
|
// https://github.com/facebook/react/issues/14365
|
|
|
// https://bugs.chromium.org/p/v8/issues/detail?id=8538
|
|
|
this.actualDuration = Number.NaN;
|
|
|
this.actualStartTime = Number.NaN;
|
|
|
this.selfBaseDuration = Number.NaN;
|
|
|
this.treeBaseDuration = Number.NaN; // It's okay to replace the initial doubles with smis after initialization.
|
|
|
// This won't trigger the performance cliff mentioned above,
|
|
|
// and it simplifies other profiler code (including DevTools).
|
|
|
|
|
|
this.actualDuration = 0;
|
|
|
this.actualStartTime = -1;
|
|
|
this.selfBaseDuration = 0;
|
|
|
this.treeBaseDuration = 0;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
// This isn't directly used but is handy for debugging internals:
|
|
|
this._debugSource = null;
|
|
|
this._debugOwner = null;
|
|
|
this._debugNeedsRemount = false;
|
|
|
this._debugHookTypes = null;
|
|
|
|
|
|
if (!hasBadMapPolyfill && typeof Object.preventExtensions === 'function') {
|
|
|
Object.preventExtensions(this);
|
|
|
}
|
|
|
}
|
|
|
} // This is a constructor function, rather than a POJO constructor, still
|
|
|
// please ensure we do the following:
|
|
|
// 1) Nobody should add any instance methods on this. Instance methods can be
|
|
|
// more difficult to predict when they get optimized and they are almost
|
|
|
// never inlined properly in static compilers.
|
|
|
// 2) Nobody should rely on `instanceof Fiber` for type testing. We should
|
|
|
// always know when it is a fiber.
|
|
|
// 3) We might want to experiment with using numeric keys since they are easier
|
|
|
// to optimize in a non-JIT environment.
|
|
|
// 4) We can easily go from a constructor to a createFiber object literal if that
|
|
|
// is faster.
|
|
|
// 5) It should be easy to port this to a C struct and keep a C implementation
|
|
|
// compatible.
|
|
|
|
|
|
|
|
|
var createFiber = function (tag, pendingProps, key, mode) {
|
|
|
// $FlowFixMe: the shapes are exact here but Flow doesn't like constructors
|
|
|
return new FiberNode(tag, pendingProps, key, mode);
|
|
|
};
|
|
|
|
|
|
function shouldConstruct$1(Component) {
|
|
|
var prototype = Component.prototype;
|
|
|
return !!(prototype && prototype.isReactComponent);
|
|
|
}
|
|
|
|
|
|
function isSimpleFunctionComponent(type) {
|
|
|
return typeof type === 'function' && !shouldConstruct$1(type) && type.defaultProps === undefined;
|
|
|
}
|
|
|
function resolveLazyComponentTag(Component) {
|
|
|
if (typeof Component === 'function') {
|
|
|
return shouldConstruct$1(Component) ? ClassComponent : FunctionComponent;
|
|
|
} else if (Component !== undefined && Component !== null) {
|
|
|
var $$typeof = Component.$$typeof;
|
|
|
|
|
|
if ($$typeof === REACT_FORWARD_REF_TYPE) {
|
|
|
return ForwardRef;
|
|
|
}
|
|
|
|
|
|
if ($$typeof === REACT_MEMO_TYPE) {
|
|
|
return MemoComponent;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return IndeterminateComponent;
|
|
|
} // This is used to create an alternate fiber to do work on.
|
|
|
|
|
|
function createWorkInProgress(current, pendingProps) {
|
|
|
var workInProgress = current.alternate;
|
|
|
|
|
|
if (workInProgress === null) {
|
|
|
// We use a double buffering pooling technique because we know that we'll
|
|
|
// only ever need at most two versions of a tree. We pool the "other" unused
|
|
|
// node that we're free to reuse. This is lazily created to avoid allocating
|
|
|
// extra objects for things that are never updated. It also allow us to
|
|
|
// reclaim the extra memory if needed.
|
|
|
workInProgress = createFiber(current.tag, pendingProps, current.key, current.mode);
|
|
|
workInProgress.elementType = current.elementType;
|
|
|
workInProgress.type = current.type;
|
|
|
workInProgress.stateNode = current.stateNode;
|
|
|
|
|
|
{
|
|
|
// DEV-only fields
|
|
|
workInProgress._debugSource = current._debugSource;
|
|
|
workInProgress._debugOwner = current._debugOwner;
|
|
|
workInProgress._debugHookTypes = current._debugHookTypes;
|
|
|
}
|
|
|
|
|
|
workInProgress.alternate = current;
|
|
|
current.alternate = workInProgress;
|
|
|
} else {
|
|
|
workInProgress.pendingProps = pendingProps; // Needed because Blocks store data on type.
|
|
|
|
|
|
workInProgress.type = current.type; // We already have an alternate.
|
|
|
// Reset the effect tag.
|
|
|
|
|
|
workInProgress.flags = NoFlags; // The effects are no longer valid.
|
|
|
|
|
|
workInProgress.subtreeFlags = NoFlags;
|
|
|
workInProgress.deletions = null;
|
|
|
|
|
|
{
|
|
|
// We intentionally reset, rather than copy, actualDuration & actualStartTime.
|
|
|
// This prevents time from endlessly accumulating in new commits.
|
|
|
// This has the downside of resetting values for different priority renders,
|
|
|
// But works for yielding (the common case) and should support resuming.
|
|
|
workInProgress.actualDuration = 0;
|
|
|
workInProgress.actualStartTime = -1;
|
|
|
}
|
|
|
} // Reset all effects except static ones.
|
|
|
// Static effects are not specific to a render.
|
|
|
|
|
|
|
|
|
workInProgress.flags = current.flags & StaticMask;
|
|
|
workInProgress.childLanes = current.childLanes;
|
|
|
workInProgress.lanes = current.lanes;
|
|
|
workInProgress.child = current.child;
|
|
|
workInProgress.memoizedProps = current.memoizedProps;
|
|
|
workInProgress.memoizedState = current.memoizedState;
|
|
|
workInProgress.updateQueue = current.updateQueue; // Clone the dependencies object. This is mutated during the render phase, so
|
|
|
// it cannot be shared with the current fiber.
|
|
|
|
|
|
var currentDependencies = current.dependencies;
|
|
|
workInProgress.dependencies = currentDependencies === null ? null : {
|
|
|
lanes: currentDependencies.lanes,
|
|
|
firstContext: currentDependencies.firstContext
|
|
|
}; // These will be overridden during the parent's reconciliation
|
|
|
|
|
|
workInProgress.sibling = current.sibling;
|
|
|
workInProgress.index = current.index;
|
|
|
workInProgress.ref = current.ref;
|
|
|
|
|
|
{
|
|
|
workInProgress.selfBaseDuration = current.selfBaseDuration;
|
|
|
workInProgress.treeBaseDuration = current.treeBaseDuration;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
workInProgress._debugNeedsRemount = current._debugNeedsRemount;
|
|
|
|
|
|
switch (workInProgress.tag) {
|
|
|
case IndeterminateComponent:
|
|
|
case FunctionComponent:
|
|
|
case SimpleMemoComponent:
|
|
|
workInProgress.type = resolveFunctionForHotReloading(current.type);
|
|
|
break;
|
|
|
|
|
|
case ClassComponent:
|
|
|
workInProgress.type = resolveClassForHotReloading(current.type);
|
|
|
break;
|
|
|
|
|
|
case ForwardRef:
|
|
|
workInProgress.type = resolveForwardRefForHotReloading(current.type);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return workInProgress;
|
|
|
} // Used to reuse a Fiber for a second pass.
|
|
|
|
|
|
function resetWorkInProgress(workInProgress, renderLanes) {
|
|
|
// This resets the Fiber to what createFiber or createWorkInProgress would
|
|
|
// have set the values to before during the first pass. Ideally this wouldn't
|
|
|
// be necessary but unfortunately many code paths reads from the workInProgress
|
|
|
// when they should be reading from current and writing to workInProgress.
|
|
|
// We assume pendingProps, index, key, ref, return are still untouched to
|
|
|
// avoid doing another reconciliation.
|
|
|
// Reset the effect flags but keep any Placement tags, since that's something
|
|
|
// that child fiber is setting, not the reconciliation.
|
|
|
workInProgress.flags &= StaticMask | Placement; // The effects are no longer valid.
|
|
|
|
|
|
var current = workInProgress.alternate;
|
|
|
|
|
|
if (current === null) {
|
|
|
// Reset to createFiber's initial values.
|
|
|
workInProgress.childLanes = NoLanes;
|
|
|
workInProgress.lanes = renderLanes;
|
|
|
workInProgress.child = null;
|
|
|
workInProgress.subtreeFlags = NoFlags;
|
|
|
workInProgress.memoizedProps = null;
|
|
|
workInProgress.memoizedState = null;
|
|
|
workInProgress.updateQueue = null;
|
|
|
workInProgress.dependencies = null;
|
|
|
workInProgress.stateNode = null;
|
|
|
|
|
|
{
|
|
|
// Note: We don't reset the actualTime counts. It's useful to accumulate
|
|
|
// actual time across multiple render passes.
|
|
|
workInProgress.selfBaseDuration = 0;
|
|
|
workInProgress.treeBaseDuration = 0;
|
|
|
}
|
|
|
} else {
|
|
|
// Reset to the cloned values that createWorkInProgress would've.
|
|
|
workInProgress.childLanes = current.childLanes;
|
|
|
workInProgress.lanes = current.lanes;
|
|
|
workInProgress.child = current.child;
|
|
|
workInProgress.subtreeFlags = NoFlags;
|
|
|
workInProgress.deletions = null;
|
|
|
workInProgress.memoizedProps = current.memoizedProps;
|
|
|
workInProgress.memoizedState = current.memoizedState;
|
|
|
workInProgress.updateQueue = current.updateQueue; // Needed because Blocks store data on type.
|
|
|
|
|
|
workInProgress.type = current.type; // Clone the dependencies object. This is mutated during the render phase, so
|
|
|
// it cannot be shared with the current fiber.
|
|
|
|
|
|
var currentDependencies = current.dependencies;
|
|
|
workInProgress.dependencies = currentDependencies === null ? null : {
|
|
|
lanes: currentDependencies.lanes,
|
|
|
firstContext: currentDependencies.firstContext
|
|
|
};
|
|
|
|
|
|
{
|
|
|
// Note: We don't reset the actualTime counts. It's useful to accumulate
|
|
|
// actual time across multiple render passes.
|
|
|
workInProgress.selfBaseDuration = current.selfBaseDuration;
|
|
|
workInProgress.treeBaseDuration = current.treeBaseDuration;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return workInProgress;
|
|
|
}
|
|
|
function createHostRootFiber(tag, isStrictMode, concurrentUpdatesByDefaultOverride) {
|
|
|
var mode;
|
|
|
|
|
|
if (tag === ConcurrentRoot) {
|
|
|
mode = ConcurrentMode;
|
|
|
|
|
|
if (isStrictMode === true) {
|
|
|
mode |= StrictLegacyMode;
|
|
|
|
|
|
{
|
|
|
mode |= StrictEffectsMode;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
mode = NoMode;
|
|
|
}
|
|
|
|
|
|
if ( isDevToolsPresent) {
|
|
|
// Always collect profile timings when DevTools are present.
|
|
|
// This enables DevTools to start capturing timing at any point–
|
|
|
// Without some nodes in the tree having empty base times.
|
|
|
mode |= ProfileMode;
|
|
|
}
|
|
|
|
|
|
return createFiber(HostRoot, null, null, mode);
|
|
|
}
|
|
|
function createFiberFromTypeAndProps(type, // React$ElementType
|
|
|
key, pendingProps, owner, mode, lanes) {
|
|
|
var fiberTag = IndeterminateComponent; // The resolved type is set if we know what the final type will be. I.e. it's not lazy.
|
|
|
|
|
|
var resolvedType = type;
|
|
|
|
|
|
if (typeof type === 'function') {
|
|
|
if (shouldConstruct$1(type)) {
|
|
|
fiberTag = ClassComponent;
|
|
|
|
|
|
{
|
|
|
resolvedType = resolveClassForHotReloading(resolvedType);
|
|
|
}
|
|
|
} else {
|
|
|
{
|
|
|
resolvedType = resolveFunctionForHotReloading(resolvedType);
|
|
|
}
|
|
|
}
|
|
|
} else if (typeof type === 'string') {
|
|
|
fiberTag = HostComponent;
|
|
|
} else {
|
|
|
getTag: switch (type) {
|
|
|
case REACT_FRAGMENT_TYPE:
|
|
|
return createFiberFromFragment(pendingProps.children, mode, lanes, key);
|
|
|
|
|
|
case REACT_STRICT_MODE_TYPE:
|
|
|
fiberTag = Mode;
|
|
|
mode |= StrictLegacyMode;
|
|
|
|
|
|
if ( (mode & ConcurrentMode) !== NoMode) {
|
|
|
// Strict effects should never run on legacy roots
|
|
|
mode |= StrictEffectsMode;
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
|
|
|
case REACT_PROFILER_TYPE:
|
|
|
return createFiberFromProfiler(pendingProps, mode, lanes, key);
|
|
|
|
|
|
case REACT_SUSPENSE_TYPE:
|
|
|
return createFiberFromSuspense(pendingProps, mode, lanes, key);
|
|
|
|
|
|
case REACT_SUSPENSE_LIST_TYPE:
|
|
|
return createFiberFromSuspenseList(pendingProps, mode, lanes, key);
|
|
|
|
|
|
case REACT_OFFSCREEN_TYPE:
|
|
|
return createFiberFromOffscreen(pendingProps, mode, lanes, key);
|
|
|
|
|
|
case REACT_LEGACY_HIDDEN_TYPE:
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case REACT_SCOPE_TYPE:
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case REACT_CACHE_TYPE:
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case REACT_TRACING_MARKER_TYPE:
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
case REACT_DEBUG_TRACING_MODE_TYPE:
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
|
|
|
default:
|
|
|
{
|
|
|
if (typeof type === 'object' && type !== null) {
|
|
|
switch (type.$$typeof) {
|
|
|
case REACT_PROVIDER_TYPE:
|
|
|
fiberTag = ContextProvider;
|
|
|
break getTag;
|
|
|
|
|
|
case REACT_CONTEXT_TYPE:
|
|
|
// This is a consumer
|
|
|
fiberTag = ContextConsumer;
|
|
|
break getTag;
|
|
|
|
|
|
case REACT_FORWARD_REF_TYPE:
|
|
|
fiberTag = ForwardRef;
|
|
|
|
|
|
{
|
|
|
resolvedType = resolveForwardRefForHotReloading(resolvedType);
|
|
|
}
|
|
|
|
|
|
break getTag;
|
|
|
|
|
|
case REACT_MEMO_TYPE:
|
|
|
fiberTag = MemoComponent;
|
|
|
break getTag;
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
fiberTag = LazyComponent;
|
|
|
resolvedType = null;
|
|
|
break getTag;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var info = '';
|
|
|
|
|
|
{
|
|
|
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
|
|
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and " + 'named imports.';
|
|
|
}
|
|
|
|
|
|
var ownerName = owner ? getComponentNameFromFiber(owner) : null;
|
|
|
|
|
|
if (ownerName) {
|
|
|
info += '\n\nCheck the render method of `' + ownerName + '`.';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
throw new Error('Element type is invalid: expected a string (for built-in ' + 'components) or a class/function (for composite components) ' + ("but got: " + (type == null ? type : typeof type) + "." + info));
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var fiber = createFiber(fiberTag, pendingProps, key, mode);
|
|
|
fiber.elementType = type;
|
|
|
fiber.type = resolvedType;
|
|
|
fiber.lanes = lanes;
|
|
|
|
|
|
{
|
|
|
fiber._debugOwner = owner;
|
|
|
}
|
|
|
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromElement(element, mode, lanes) {
|
|
|
var owner = null;
|
|
|
|
|
|
{
|
|
|
owner = element._owner;
|
|
|
}
|
|
|
|
|
|
var type = element.type;
|
|
|
var key = element.key;
|
|
|
var pendingProps = element.props;
|
|
|
var fiber = createFiberFromTypeAndProps(type, key, pendingProps, owner, mode, lanes);
|
|
|
|
|
|
{
|
|
|
fiber._debugSource = element._source;
|
|
|
fiber._debugOwner = element._owner;
|
|
|
}
|
|
|
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromFragment(elements, mode, lanes, key) {
|
|
|
var fiber = createFiber(Fragment, elements, key, mode);
|
|
|
fiber.lanes = lanes;
|
|
|
return fiber;
|
|
|
}
|
|
|
|
|
|
function createFiberFromProfiler(pendingProps, mode, lanes, key) {
|
|
|
{
|
|
|
if (typeof pendingProps.id !== 'string') {
|
|
|
error('Profiler must specify an "id" of type `string` as a prop. Received the type `%s` instead.', typeof pendingProps.id);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var fiber = createFiber(Profiler, pendingProps, key, mode | ProfileMode);
|
|
|
fiber.elementType = REACT_PROFILER_TYPE;
|
|
|
fiber.lanes = lanes;
|
|
|
|
|
|
{
|
|
|
fiber.stateNode = {
|
|
|
effectDuration: 0,
|
|
|
passiveEffectDuration: 0
|
|
|
};
|
|
|
}
|
|
|
|
|
|
return fiber;
|
|
|
}
|
|
|
|
|
|
function createFiberFromSuspense(pendingProps, mode, lanes, key) {
|
|
|
var fiber = createFiber(SuspenseComponent, pendingProps, key, mode);
|
|
|
fiber.elementType = REACT_SUSPENSE_TYPE;
|
|
|
fiber.lanes = lanes;
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromSuspenseList(pendingProps, mode, lanes, key) {
|
|
|
var fiber = createFiber(SuspenseListComponent, pendingProps, key, mode);
|
|
|
fiber.elementType = REACT_SUSPENSE_LIST_TYPE;
|
|
|
fiber.lanes = lanes;
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromOffscreen(pendingProps, mode, lanes, key) {
|
|
|
var fiber = createFiber(OffscreenComponent, pendingProps, key, mode);
|
|
|
fiber.elementType = REACT_OFFSCREEN_TYPE;
|
|
|
fiber.lanes = lanes;
|
|
|
var primaryChildInstance = {
|
|
|
isHidden: false
|
|
|
};
|
|
|
fiber.stateNode = primaryChildInstance;
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromText(content, mode, lanes) {
|
|
|
var fiber = createFiber(HostText, content, null, mode);
|
|
|
fiber.lanes = lanes;
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromHostInstanceForDeletion() {
|
|
|
var fiber = createFiber(HostComponent, null, null, NoMode);
|
|
|
fiber.elementType = 'DELETED';
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromDehydratedFragment(dehydratedNode) {
|
|
|
var fiber = createFiber(DehydratedFragment, null, null, NoMode);
|
|
|
fiber.stateNode = dehydratedNode;
|
|
|
return fiber;
|
|
|
}
|
|
|
function createFiberFromPortal(portal, mode, lanes) {
|
|
|
var pendingProps = portal.children !== null ? portal.children : [];
|
|
|
var fiber = createFiber(HostPortal, pendingProps, portal.key, mode);
|
|
|
fiber.lanes = lanes;
|
|
|
fiber.stateNode = {
|
|
|
containerInfo: portal.containerInfo,
|
|
|
pendingChildren: null,
|
|
|
// Used by persistent updates
|
|
|
implementation: portal.implementation
|
|
|
};
|
|
|
return fiber;
|
|
|
} // Used for stashing WIP properties to replay failed work in DEV.
|
|
|
|
|
|
function assignFiberPropertiesInDEV(target, source) {
|
|
|
if (target === null) {
|
|
|
// This Fiber's initial properties will always be overwritten.
|
|
|
// We only use a Fiber to ensure the same hidden class so DEV isn't slow.
|
|
|
target = createFiber(IndeterminateComponent, null, null, NoMode);
|
|
|
} // This is intentionally written as a list of all properties.
|
|
|
// We tried to use Object.assign() instead but this is called in
|
|
|
// the hottest path, and Object.assign() was too slow:
|
|
|
// https://github.com/facebook/react/issues/12502
|
|
|
// This code is DEV-only so size is not a concern.
|
|
|
|
|
|
|
|
|
target.tag = source.tag;
|
|
|
target.key = source.key;
|
|
|
target.elementType = source.elementType;
|
|
|
target.type = source.type;
|
|
|
target.stateNode = source.stateNode;
|
|
|
target.return = source.return;
|
|
|
target.child = source.child;
|
|
|
target.sibling = source.sibling;
|
|
|
target.index = source.index;
|
|
|
target.ref = source.ref;
|
|
|
target.pendingProps = source.pendingProps;
|
|
|
target.memoizedProps = source.memoizedProps;
|
|
|
target.updateQueue = source.updateQueue;
|
|
|
target.memoizedState = source.memoizedState;
|
|
|
target.dependencies = source.dependencies;
|
|
|
target.mode = source.mode;
|
|
|
target.flags = source.flags;
|
|
|
target.subtreeFlags = source.subtreeFlags;
|
|
|
target.deletions = source.deletions;
|
|
|
target.lanes = source.lanes;
|
|
|
target.childLanes = source.childLanes;
|
|
|
target.alternate = source.alternate;
|
|
|
|
|
|
{
|
|
|
target.actualDuration = source.actualDuration;
|
|
|
target.actualStartTime = source.actualStartTime;
|
|
|
target.selfBaseDuration = source.selfBaseDuration;
|
|
|
target.treeBaseDuration = source.treeBaseDuration;
|
|
|
}
|
|
|
|
|
|
target._debugSource = source._debugSource;
|
|
|
target._debugOwner = source._debugOwner;
|
|
|
target._debugNeedsRemount = source._debugNeedsRemount;
|
|
|
target._debugHookTypes = source._debugHookTypes;
|
|
|
return target;
|
|
|
}
|
|
|
|
|
|
function FiberRootNode(containerInfo, tag, hydrate, identifierPrefix, onRecoverableError) {
|
|
|
this.tag = tag;
|
|
|
this.containerInfo = containerInfo;
|
|
|
this.pendingChildren = null;
|
|
|
this.current = null;
|
|
|
this.pingCache = null;
|
|
|
this.finishedWork = null;
|
|
|
this.timeoutHandle = noTimeout;
|
|
|
this.context = null;
|
|
|
this.pendingContext = null;
|
|
|
this.callbackNode = null;
|
|
|
this.callbackPriority = NoLane;
|
|
|
this.eventTimes = createLaneMap(NoLanes);
|
|
|
this.expirationTimes = createLaneMap(NoTimestamp);
|
|
|
this.pendingLanes = NoLanes;
|
|
|
this.suspendedLanes = NoLanes;
|
|
|
this.pingedLanes = NoLanes;
|
|
|
this.expiredLanes = NoLanes;
|
|
|
this.mutableReadLanes = NoLanes;
|
|
|
this.finishedLanes = NoLanes;
|
|
|
this.entangledLanes = NoLanes;
|
|
|
this.entanglements = createLaneMap(NoLanes);
|
|
|
this.identifierPrefix = identifierPrefix;
|
|
|
this.onRecoverableError = onRecoverableError;
|
|
|
|
|
|
{
|
|
|
this.mutableSourceEagerHydrationData = null;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
this.effectDuration = 0;
|
|
|
this.passiveEffectDuration = 0;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
this.memoizedUpdaters = new Set();
|
|
|
var pendingUpdatersLaneMap = this.pendingUpdatersLaneMap = [];
|
|
|
|
|
|
for (var _i = 0; _i < TotalLanes; _i++) {
|
|
|
pendingUpdatersLaneMap.push(new Set());
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
switch (tag) {
|
|
|
case ConcurrentRoot:
|
|
|
this._debugRootType = hydrate ? 'hydrateRoot()' : 'createRoot()';
|
|
|
break;
|
|
|
|
|
|
case LegacyRoot:
|
|
|
this._debugRootType = hydrate ? 'hydrate()' : 'render()';
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, // TODO: We have several of these arguments that are conceptually part of the
|
|
|
// host config, but because they are passed in at runtime, we have to thread
|
|
|
// them through the root constructor. Perhaps we should put them all into a
|
|
|
// single type, like a DynamicHostConfig that is defined by the renderer.
|
|
|
identifierPrefix, onRecoverableError, transitionCallbacks) {
|
|
|
var root = new FiberRootNode(containerInfo, tag, hydrate, identifierPrefix, onRecoverableError);
|
|
|
// stateNode is any.
|
|
|
|
|
|
|
|
|
var uninitializedFiber = createHostRootFiber(tag, isStrictMode);
|
|
|
root.current = uninitializedFiber;
|
|
|
uninitializedFiber.stateNode = root;
|
|
|
|
|
|
{
|
|
|
var _initialState = {
|
|
|
element: initialChildren,
|
|
|
isDehydrated: hydrate,
|
|
|
cache: null,
|
|
|
// not enabled yet
|
|
|
transitions: null,
|
|
|
pendingSuspenseBoundaries: null
|
|
|
};
|
|
|
uninitializedFiber.memoizedState = _initialState;
|
|
|
}
|
|
|
|
|
|
initializeUpdateQueue(uninitializedFiber);
|
|
|
return root;
|
|
|
}
|
|
|
|
|
|
var ReactVersion = '18.2.0';
|
|
|
|
|
|
function createPortal(children, containerInfo, // TODO: figure out the API for cross-renderer implementation.
|
|
|
implementation) {
|
|
|
var key = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
|
|
|
|
|
|
{
|
|
|
checkKeyStringCoercion(key);
|
|
|
}
|
|
|
|
|
|
return {
|
|
|
// This tag allow us to uniquely identify this as a React Portal
|
|
|
$$typeof: REACT_PORTAL_TYPE,
|
|
|
key: key == null ? null : '' + key,
|
|
|
children: children,
|
|
|
containerInfo: containerInfo,
|
|
|
implementation: implementation
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var didWarnAboutNestedUpdates;
|
|
|
var didWarnAboutFindNodeInStrictMode;
|
|
|
|
|
|
{
|
|
|
didWarnAboutNestedUpdates = false;
|
|
|
didWarnAboutFindNodeInStrictMode = {};
|
|
|
}
|
|
|
|
|
|
function getContextForSubtree(parentComponent) {
|
|
|
if (!parentComponent) {
|
|
|
return emptyContextObject;
|
|
|
}
|
|
|
|
|
|
var fiber = get(parentComponent);
|
|
|
var parentContext = findCurrentUnmaskedContext(fiber);
|
|
|
|
|
|
if (fiber.tag === ClassComponent) {
|
|
|
var Component = fiber.type;
|
|
|
|
|
|
if (isContextProvider(Component)) {
|
|
|
return processChildContext(fiber, Component, parentContext);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return parentContext;
|
|
|
}
|
|
|
|
|
|
function findHostInstanceWithWarning(component, methodName) {
|
|
|
{
|
|
|
var fiber = get(component);
|
|
|
|
|
|
if (fiber === undefined) {
|
|
|
if (typeof component.render === 'function') {
|
|
|
throw new Error('Unable to find node on an unmounted component.');
|
|
|
} else {
|
|
|
var keys = Object.keys(component).join(',');
|
|
|
throw new Error("Argument appears to not be a ReactComponent. Keys: " + keys);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var hostFiber = findCurrentHostFiber(fiber);
|
|
|
|
|
|
if (hostFiber === null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
if (hostFiber.mode & StrictLegacyMode) {
|
|
|
var componentName = getComponentNameFromFiber(fiber) || 'Component';
|
|
|
|
|
|
if (!didWarnAboutFindNodeInStrictMode[componentName]) {
|
|
|
didWarnAboutFindNodeInStrictMode[componentName] = true;
|
|
|
var previousFiber = current;
|
|
|
|
|
|
try {
|
|
|
setCurrentFiber(hostFiber);
|
|
|
|
|
|
if (fiber.mode & StrictLegacyMode) {
|
|
|
error('%s is deprecated in StrictMode. ' + '%s was passed an instance of %s which is inside StrictMode. ' + 'Instead, add a ref directly to the element you want to reference. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node', methodName, methodName, componentName);
|
|
|
} else {
|
|
|
error('%s is deprecated in StrictMode. ' + '%s was passed an instance of %s which renders StrictMode children. ' + 'Instead, add a ref directly to the element you want to reference. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node', methodName, methodName, componentName);
|
|
|
}
|
|
|
} finally {
|
|
|
// Ideally this should reset to previous but this shouldn't be called in
|
|
|
// render and there's another warning for that anyway.
|
|
|
if (previousFiber) {
|
|
|
setCurrentFiber(previousFiber);
|
|
|
} else {
|
|
|
resetCurrentFiber();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return hostFiber.stateNode;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function createContainer(containerInfo, tag, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError, transitionCallbacks) {
|
|
|
var hydrate = false;
|
|
|
var initialChildren = null;
|
|
|
return createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError);
|
|
|
}
|
|
|
function createHydrationContainer(initialChildren, // TODO: Remove `callback` when we delete legacy mode.
|
|
|
callback, containerInfo, tag, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError, transitionCallbacks) {
|
|
|
var hydrate = true;
|
|
|
var root = createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError); // TODO: Move this to FiberRoot constructor
|
|
|
|
|
|
root.context = getContextForSubtree(null); // Schedule the initial render. In a hydration root, this is different from
|
|
|
// a regular update because the initial render must match was was rendered
|
|
|
// on the server.
|
|
|
// NOTE: This update intentionally doesn't have a payload. We're only using
|
|
|
// the update to schedule work on the root fiber (and, for legacy roots, to
|
|
|
// enqueue the callback if one is provided).
|
|
|
|
|
|
var current = root.current;
|
|
|
var eventTime = requestEventTime();
|
|
|
var lane = requestUpdateLane(current);
|
|
|
var update = createUpdate(eventTime, lane);
|
|
|
update.callback = callback !== undefined && callback !== null ? callback : null;
|
|
|
enqueueUpdate(current, update, lane);
|
|
|
scheduleInitialHydrationOnRoot(root, lane, eventTime);
|
|
|
return root;
|
|
|
}
|
|
|
function updateContainer(element, container, parentComponent, callback) {
|
|
|
{
|
|
|
onScheduleRoot(container, element);
|
|
|
}
|
|
|
|
|
|
var current$1 = container.current;
|
|
|
var eventTime = requestEventTime();
|
|
|
var lane = requestUpdateLane(current$1);
|
|
|
|
|
|
{
|
|
|
markRenderScheduled(lane);
|
|
|
}
|
|
|
|
|
|
var context = getContextForSubtree(parentComponent);
|
|
|
|
|
|
if (container.context === null) {
|
|
|
container.context = context;
|
|
|
} else {
|
|
|
container.pendingContext = context;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (isRendering && current !== null && !didWarnAboutNestedUpdates) {
|
|
|
didWarnAboutNestedUpdates = true;
|
|
|
|
|
|
error('Render methods should be a pure function of props and state; ' + 'triggering nested component updates from render is not allowed. ' + 'If necessary, trigger nested updates in componentDidUpdate.\n\n' + 'Check the render method of %s.', getComponentNameFromFiber(current) || 'Unknown');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var update = createUpdate(eventTime, lane); // Caution: React DevTools currently depends on this property
|
|
|
// being called "element".
|
|
|
|
|
|
update.payload = {
|
|
|
element: element
|
|
|
};
|
|
|
callback = callback === undefined ? null : callback;
|
|
|
|
|
|
if (callback !== null) {
|
|
|
{
|
|
|
if (typeof callback !== 'function') {
|
|
|
error('render(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callback);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
update.callback = callback;
|
|
|
}
|
|
|
|
|
|
var root = enqueueUpdate(current$1, update, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, current$1, lane, eventTime);
|
|
|
entangleTransitions(root, current$1, lane);
|
|
|
}
|
|
|
|
|
|
return lane;
|
|
|
}
|
|
|
function getPublicRootInstance(container) {
|
|
|
var containerFiber = container.current;
|
|
|
|
|
|
if (!containerFiber.child) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
switch (containerFiber.child.tag) {
|
|
|
case HostComponent:
|
|
|
return getPublicInstance(containerFiber.child.stateNode);
|
|
|
|
|
|
default:
|
|
|
return containerFiber.child.stateNode;
|
|
|
}
|
|
|
}
|
|
|
function attemptSynchronousHydration$1(fiber) {
|
|
|
switch (fiber.tag) {
|
|
|
case HostRoot:
|
|
|
{
|
|
|
var root = fiber.stateNode;
|
|
|
|
|
|
if (isRootDehydrated(root)) {
|
|
|
// Flush the first scheduled "update".
|
|
|
var lanes = getHighestPriorityPendingLanes(root);
|
|
|
flushRoot(root, lanes);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
case SuspenseComponent:
|
|
|
{
|
|
|
flushSync(function () {
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
var eventTime = requestEventTime();
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, eventTime);
|
|
|
}
|
|
|
}); // If we're still blocked after this, we need to increase
|
|
|
// the priority of any promises resolving within this
|
|
|
// boundary so that they next attempt also has higher pri.
|
|
|
|
|
|
var retryLane = SyncLane;
|
|
|
markRetryLaneIfNotHydrated(fiber, retryLane);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function markRetryLaneImpl(fiber, retryLane) {
|
|
|
var suspenseState = fiber.memoizedState;
|
|
|
|
|
|
if (suspenseState !== null && suspenseState.dehydrated !== null) {
|
|
|
suspenseState.retryLane = higherPriorityLane(suspenseState.retryLane, retryLane);
|
|
|
}
|
|
|
} // Increases the priority of thenables when they resolve within this boundary.
|
|
|
|
|
|
|
|
|
function markRetryLaneIfNotHydrated(fiber, retryLane) {
|
|
|
markRetryLaneImpl(fiber, retryLane);
|
|
|
var alternate = fiber.alternate;
|
|
|
|
|
|
if (alternate) {
|
|
|
markRetryLaneImpl(alternate, retryLane);
|
|
|
}
|
|
|
}
|
|
|
function attemptContinuousHydration$1(fiber) {
|
|
|
if (fiber.tag !== SuspenseComponent) {
|
|
|
// We ignore HostRoots here because we can't increase
|
|
|
// their priority and they should not suspend on I/O,
|
|
|
// since you have to wrap anything that might suspend in
|
|
|
// Suspense.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var lane = SelectiveHydrationLane;
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
var eventTime = requestEventTime();
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
}
|
|
|
|
|
|
markRetryLaneIfNotHydrated(fiber, lane);
|
|
|
}
|
|
|
function attemptHydrationAtCurrentPriority$1(fiber) {
|
|
|
if (fiber.tag !== SuspenseComponent) {
|
|
|
// We ignore HostRoots here because we can't increase
|
|
|
// their priority other than synchronously flush it.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var lane = requestUpdateLane(fiber);
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, lane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
var eventTime = requestEventTime();
|
|
|
scheduleUpdateOnFiber(root, fiber, lane, eventTime);
|
|
|
}
|
|
|
|
|
|
markRetryLaneIfNotHydrated(fiber, lane);
|
|
|
}
|
|
|
function findHostInstanceWithNoPortals(fiber) {
|
|
|
var hostFiber = findCurrentHostFiberWithNoPortals(fiber);
|
|
|
|
|
|
if (hostFiber === null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return hostFiber.stateNode;
|
|
|
}
|
|
|
|
|
|
var shouldErrorImpl = function (fiber) {
|
|
|
return null;
|
|
|
};
|
|
|
|
|
|
function shouldError(fiber) {
|
|
|
return shouldErrorImpl(fiber);
|
|
|
}
|
|
|
|
|
|
var shouldSuspendImpl = function (fiber) {
|
|
|
return false;
|
|
|
};
|
|
|
|
|
|
function shouldSuspend(fiber) {
|
|
|
return shouldSuspendImpl(fiber);
|
|
|
}
|
|
|
var overrideHookState = null;
|
|
|
var overrideHookStateDeletePath = null;
|
|
|
var overrideHookStateRenamePath = null;
|
|
|
var overrideProps = null;
|
|
|
var overridePropsDeletePath = null;
|
|
|
var overridePropsRenamePath = null;
|
|
|
var scheduleUpdate = null;
|
|
|
var setErrorHandler = null;
|
|
|
var setSuspenseHandler = null;
|
|
|
|
|
|
{
|
|
|
var copyWithDeleteImpl = function (obj, path, index) {
|
|
|
var key = path[index];
|
|
|
var updated = isArray(obj) ? obj.slice() : assign({}, obj);
|
|
|
|
|
|
if (index + 1 === path.length) {
|
|
|
if (isArray(updated)) {
|
|
|
updated.splice(key, 1);
|
|
|
} else {
|
|
|
delete updated[key];
|
|
|
}
|
|
|
|
|
|
return updated;
|
|
|
} // $FlowFixMe number or string is fine here
|
|
|
|
|
|
|
|
|
updated[key] = copyWithDeleteImpl(obj[key], path, index + 1);
|
|
|
return updated;
|
|
|
};
|
|
|
|
|
|
var copyWithDelete = function (obj, path) {
|
|
|
return copyWithDeleteImpl(obj, path, 0);
|
|
|
};
|
|
|
|
|
|
var copyWithRenameImpl = function (obj, oldPath, newPath, index) {
|
|
|
var oldKey = oldPath[index];
|
|
|
var updated = isArray(obj) ? obj.slice() : assign({}, obj);
|
|
|
|
|
|
if (index + 1 === oldPath.length) {
|
|
|
var newKey = newPath[index]; // $FlowFixMe number or string is fine here
|
|
|
|
|
|
updated[newKey] = updated[oldKey];
|
|
|
|
|
|
if (isArray(updated)) {
|
|
|
updated.splice(oldKey, 1);
|
|
|
} else {
|
|
|
delete updated[oldKey];
|
|
|
}
|
|
|
} else {
|
|
|
// $FlowFixMe number or string is fine here
|
|
|
updated[oldKey] = copyWithRenameImpl( // $FlowFixMe number or string is fine here
|
|
|
obj[oldKey], oldPath, newPath, index + 1);
|
|
|
}
|
|
|
|
|
|
return updated;
|
|
|
};
|
|
|
|
|
|
var copyWithRename = function (obj, oldPath, newPath) {
|
|
|
if (oldPath.length !== newPath.length) {
|
|
|
warn('copyWithRename() expects paths of the same length');
|
|
|
|
|
|
return;
|
|
|
} else {
|
|
|
for (var i = 0; i < newPath.length - 1; i++) {
|
|
|
if (oldPath[i] !== newPath[i]) {
|
|
|
warn('copyWithRename() expects paths to be the same except for the deepest key');
|
|
|
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return copyWithRenameImpl(obj, oldPath, newPath, 0);
|
|
|
};
|
|
|
|
|
|
var copyWithSetImpl = function (obj, path, index, value) {
|
|
|
if (index >= path.length) {
|
|
|
return value;
|
|
|
}
|
|
|
|
|
|
var key = path[index];
|
|
|
var updated = isArray(obj) ? obj.slice() : assign({}, obj); // $FlowFixMe number or string is fine here
|
|
|
|
|
|
updated[key] = copyWithSetImpl(obj[key], path, index + 1, value);
|
|
|
return updated;
|
|
|
};
|
|
|
|
|
|
var copyWithSet = function (obj, path, value) {
|
|
|
return copyWithSetImpl(obj, path, 0, value);
|
|
|
};
|
|
|
|
|
|
var findHook = function (fiber, id) {
|
|
|
// For now, the "id" of stateful hooks is just the stateful hook index.
|
|
|
// This may change in the future with e.g. nested hooks.
|
|
|
var currentHook = fiber.memoizedState;
|
|
|
|
|
|
while (currentHook !== null && id > 0) {
|
|
|
currentHook = currentHook.next;
|
|
|
id--;
|
|
|
}
|
|
|
|
|
|
return currentHook;
|
|
|
}; // Support DevTools editable values for useState and useReducer.
|
|
|
|
|
|
|
|
|
overrideHookState = function (fiber, id, path, value) {
|
|
|
var hook = findHook(fiber, id);
|
|
|
|
|
|
if (hook !== null) {
|
|
|
var newState = copyWithSet(hook.memoizedState, path, value);
|
|
|
hook.memoizedState = newState;
|
|
|
hook.baseState = newState; // We aren't actually adding an update to the queue,
|
|
|
// because there is no update we can add for useReducer hooks that won't trigger an error.
|
|
|
// (There's no appropriate action type for DevTools overrides.)
|
|
|
// As a result though, React will see the scheduled update as a noop and bailout.
|
|
|
// Shallow cloning props works as a workaround for now to bypass the bailout check.
|
|
|
|
|
|
fiber.memoizedProps = assign({}, fiber.memoizedProps);
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
overrideHookStateDeletePath = function (fiber, id, path) {
|
|
|
var hook = findHook(fiber, id);
|
|
|
|
|
|
if (hook !== null) {
|
|
|
var newState = copyWithDelete(hook.memoizedState, path);
|
|
|
hook.memoizedState = newState;
|
|
|
hook.baseState = newState; // We aren't actually adding an update to the queue,
|
|
|
// because there is no update we can add for useReducer hooks that won't trigger an error.
|
|
|
// (There's no appropriate action type for DevTools overrides.)
|
|
|
// As a result though, React will see the scheduled update as a noop and bailout.
|
|
|
// Shallow cloning props works as a workaround for now to bypass the bailout check.
|
|
|
|
|
|
fiber.memoizedProps = assign({}, fiber.memoizedProps);
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
overrideHookStateRenamePath = function (fiber, id, oldPath, newPath) {
|
|
|
var hook = findHook(fiber, id);
|
|
|
|
|
|
if (hook !== null) {
|
|
|
var newState = copyWithRename(hook.memoizedState, oldPath, newPath);
|
|
|
hook.memoizedState = newState;
|
|
|
hook.baseState = newState; // We aren't actually adding an update to the queue,
|
|
|
// because there is no update we can add for useReducer hooks that won't trigger an error.
|
|
|
// (There's no appropriate action type for DevTools overrides.)
|
|
|
// As a result though, React will see the scheduled update as a noop and bailout.
|
|
|
// Shallow cloning props works as a workaround for now to bypass the bailout check.
|
|
|
|
|
|
fiber.memoizedProps = assign({}, fiber.memoizedProps);
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
}
|
|
|
}; // Support DevTools props for function components, forwardRef, memo, host components, etc.
|
|
|
|
|
|
|
|
|
overrideProps = function (fiber, path, value) {
|
|
|
fiber.pendingProps = copyWithSet(fiber.memoizedProps, path, value);
|
|
|
|
|
|
if (fiber.alternate) {
|
|
|
fiber.alternate.pendingProps = fiber.pendingProps;
|
|
|
}
|
|
|
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
overridePropsDeletePath = function (fiber, path) {
|
|
|
fiber.pendingProps = copyWithDelete(fiber.memoizedProps, path);
|
|
|
|
|
|
if (fiber.alternate) {
|
|
|
fiber.alternate.pendingProps = fiber.pendingProps;
|
|
|
}
|
|
|
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
overridePropsRenamePath = function (fiber, oldPath, newPath) {
|
|
|
fiber.pendingProps = copyWithRename(fiber.memoizedProps, oldPath, newPath);
|
|
|
|
|
|
if (fiber.alternate) {
|
|
|
fiber.alternate.pendingProps = fiber.pendingProps;
|
|
|
}
|
|
|
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
scheduleUpdate = function (fiber) {
|
|
|
var root = enqueueConcurrentRenderForLane(fiber, SyncLane);
|
|
|
|
|
|
if (root !== null) {
|
|
|
scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
setErrorHandler = function (newShouldErrorImpl) {
|
|
|
shouldErrorImpl = newShouldErrorImpl;
|
|
|
};
|
|
|
|
|
|
setSuspenseHandler = function (newShouldSuspendImpl) {
|
|
|
shouldSuspendImpl = newShouldSuspendImpl;
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function findHostInstanceByFiber(fiber) {
|
|
|
var hostFiber = findCurrentHostFiber(fiber);
|
|
|
|
|
|
if (hostFiber === null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
return hostFiber.stateNode;
|
|
|
}
|
|
|
|
|
|
function emptyFindFiberByHostInstance(instance) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
function getCurrentFiberForDevTools() {
|
|
|
return current;
|
|
|
}
|
|
|
|
|
|
function injectIntoDevTools(devToolsConfig) {
|
|
|
var findFiberByHostInstance = devToolsConfig.findFiberByHostInstance;
|
|
|
var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
|
|
|
return injectInternals({
|
|
|
bundleType: devToolsConfig.bundleType,
|
|
|
version: devToolsConfig.version,
|
|
|
rendererPackageName: devToolsConfig.rendererPackageName,
|
|
|
rendererConfig: devToolsConfig.rendererConfig,
|
|
|
overrideHookState: overrideHookState,
|
|
|
overrideHookStateDeletePath: overrideHookStateDeletePath,
|
|
|
overrideHookStateRenamePath: overrideHookStateRenamePath,
|
|
|
overrideProps: overrideProps,
|
|
|
overridePropsDeletePath: overridePropsDeletePath,
|
|
|
overridePropsRenamePath: overridePropsRenamePath,
|
|
|
setErrorHandler: setErrorHandler,
|
|
|
setSuspenseHandler: setSuspenseHandler,
|
|
|
scheduleUpdate: scheduleUpdate,
|
|
|
currentDispatcherRef: ReactCurrentDispatcher,
|
|
|
findHostInstanceByFiber: findHostInstanceByFiber,
|
|
|
findFiberByHostInstance: findFiberByHostInstance || emptyFindFiberByHostInstance,
|
|
|
// React Refresh
|
|
|
findHostInstancesForRefresh: findHostInstancesForRefresh ,
|
|
|
scheduleRefresh: scheduleRefresh ,
|
|
|
scheduleRoot: scheduleRoot ,
|
|
|
setRefreshHandler: setRefreshHandler ,
|
|
|
// Enables DevTools to append owner stacks to error messages in DEV mode.
|
|
|
getCurrentFiber: getCurrentFiberForDevTools ,
|
|
|
// Enables DevTools to detect reconciler version rather than renderer version
|
|
|
// which may not match for third party renderers.
|
|
|
reconcilerVersion: ReactVersion
|
|
|
});
|
|
|
}
|
|
|
|
|
|
/* global reportError */
|
|
|
|
|
|
var defaultOnRecoverableError = typeof reportError === 'function' ? // In modern browsers, reportError will dispatch an error event,
|
|
|
// emulating an uncaught JavaScript error.
|
|
|
reportError : function (error) {
|
|
|
// In older browsers and test environments, fallback to console.error.
|
|
|
// eslint-disable-next-line react-internal/no-production-logging
|
|
|
console['error'](error);
|
|
|
};
|
|
|
|
|
|
function ReactDOMRoot(internalRoot) {
|
|
|
this._internalRoot = internalRoot;
|
|
|
}
|
|
|
|
|
|
ReactDOMHydrationRoot.prototype.render = ReactDOMRoot.prototype.render = function (children) {
|
|
|
var root = this._internalRoot;
|
|
|
|
|
|
if (root === null) {
|
|
|
throw new Error('Cannot update an unmounted root.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof arguments[1] === 'function') {
|
|
|
error('render(...): does not support the second callback argument. ' + 'To execute a side effect after rendering, declare it in a component body with useEffect().');
|
|
|
} else if (isValidContainer(arguments[1])) {
|
|
|
error('You passed a container to the second argument of root.render(...). ' + "You don't need to pass it again since you already passed it to create the root.");
|
|
|
} else if (typeof arguments[1] !== 'undefined') {
|
|
|
error('You passed a second argument to root.render(...) but it only accepts ' + 'one argument.');
|
|
|
}
|
|
|
|
|
|
var container = root.containerInfo;
|
|
|
|
|
|
if (container.nodeType !== COMMENT_NODE) {
|
|
|
var hostInstance = findHostInstanceWithNoPortals(root.current);
|
|
|
|
|
|
if (hostInstance) {
|
|
|
if (hostInstance.parentNode !== container) {
|
|
|
error('render(...): It looks like the React-rendered content of the ' + 'root container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + "root.unmount() to empty a root's container.");
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
updateContainer(children, root, null, null);
|
|
|
};
|
|
|
|
|
|
ReactDOMHydrationRoot.prototype.unmount = ReactDOMRoot.prototype.unmount = function () {
|
|
|
{
|
|
|
if (typeof arguments[0] === 'function') {
|
|
|
error('unmount(...): does not support a callback argument. ' + 'To execute a side effect after rendering, declare it in a component body with useEffect().');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var root = this._internalRoot;
|
|
|
|
|
|
if (root !== null) {
|
|
|
this._internalRoot = null;
|
|
|
var container = root.containerInfo;
|
|
|
|
|
|
{
|
|
|
if (isAlreadyRendering()) {
|
|
|
error('Attempted to synchronously unmount a root while React was already ' + 'rendering. React cannot finish unmounting the root until the ' + 'current render has completed, which may lead to a race condition.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
flushSync(function () {
|
|
|
updateContainer(null, root, null, null);
|
|
|
});
|
|
|
unmarkContainerAsRoot(container);
|
|
|
}
|
|
|
};
|
|
|
|
|
|
function createRoot(container, options) {
|
|
|
if (!isValidContainer(container)) {
|
|
|
throw new Error('createRoot(...): Target container is not a DOM element.');
|
|
|
}
|
|
|
|
|
|
warnIfReactDOMContainerInDEV(container);
|
|
|
var isStrictMode = false;
|
|
|
var concurrentUpdatesByDefaultOverride = false;
|
|
|
var identifierPrefix = '';
|
|
|
var onRecoverableError = defaultOnRecoverableError;
|
|
|
var transitionCallbacks = null;
|
|
|
|
|
|
if (options !== null && options !== undefined) {
|
|
|
{
|
|
|
if (options.hydrate) {
|
|
|
warn('hydrate through createRoot is deprecated. Use ReactDOMClient.hydrateRoot(container, <App />) instead.');
|
|
|
} else {
|
|
|
if (typeof options === 'object' && options !== null && options.$$typeof === REACT_ELEMENT_TYPE) {
|
|
|
error('You passed a JSX element to createRoot. You probably meant to ' + 'call root.render instead. ' + 'Example usage:\n\n' + ' let root = createRoot(domContainer);\n' + ' root.render(<App />);');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (options.unstable_strictMode === true) {
|
|
|
isStrictMode = true;
|
|
|
}
|
|
|
|
|
|
if (options.identifierPrefix !== undefined) {
|
|
|
identifierPrefix = options.identifierPrefix;
|
|
|
}
|
|
|
|
|
|
if (options.onRecoverableError !== undefined) {
|
|
|
onRecoverableError = options.onRecoverableError;
|
|
|
}
|
|
|
|
|
|
if (options.transitionCallbacks !== undefined) {
|
|
|
transitionCallbacks = options.transitionCallbacks;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var root = createContainer(container, ConcurrentRoot, null, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError);
|
|
|
markContainerAsRoot(root.current, container);
|
|
|
var rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container;
|
|
|
listenToAllSupportedEvents(rootContainerElement);
|
|
|
return new ReactDOMRoot(root);
|
|
|
}
|
|
|
|
|
|
function ReactDOMHydrationRoot(internalRoot) {
|
|
|
this._internalRoot = internalRoot;
|
|
|
}
|
|
|
|
|
|
function scheduleHydration(target) {
|
|
|
if (target) {
|
|
|
queueExplicitHydrationTarget(target);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = scheduleHydration;
|
|
|
function hydrateRoot(container, initialChildren, options) {
|
|
|
if (!isValidContainer(container)) {
|
|
|
throw new Error('hydrateRoot(...): Target container is not a DOM element.');
|
|
|
}
|
|
|
|
|
|
warnIfReactDOMContainerInDEV(container);
|
|
|
|
|
|
{
|
|
|
if (initialChildren === undefined) {
|
|
|
error('Must provide initial children as second argument to hydrateRoot. ' + 'Example usage: hydrateRoot(domContainer, <App />)');
|
|
|
}
|
|
|
} // For now we reuse the whole bag of options since they contain
|
|
|
// the hydration callbacks.
|
|
|
|
|
|
|
|
|
var hydrationCallbacks = options != null ? options : null; // TODO: Delete this option
|
|
|
|
|
|
var mutableSources = options != null && options.hydratedSources || null;
|
|
|
var isStrictMode = false;
|
|
|
var concurrentUpdatesByDefaultOverride = false;
|
|
|
var identifierPrefix = '';
|
|
|
var onRecoverableError = defaultOnRecoverableError;
|
|
|
|
|
|
if (options !== null && options !== undefined) {
|
|
|
if (options.unstable_strictMode === true) {
|
|
|
isStrictMode = true;
|
|
|
}
|
|
|
|
|
|
if (options.identifierPrefix !== undefined) {
|
|
|
identifierPrefix = options.identifierPrefix;
|
|
|
}
|
|
|
|
|
|
if (options.onRecoverableError !== undefined) {
|
|
|
onRecoverableError = options.onRecoverableError;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var root = createHydrationContainer(initialChildren, null, container, ConcurrentRoot, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError);
|
|
|
markContainerAsRoot(root.current, container); // This can't be a comment node since hydration doesn't work on comment nodes anyway.
|
|
|
|
|
|
listenToAllSupportedEvents(container);
|
|
|
|
|
|
if (mutableSources) {
|
|
|
for (var i = 0; i < mutableSources.length; i++) {
|
|
|
var mutableSource = mutableSources[i];
|
|
|
registerMutableSourceForHydration(root, mutableSource);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return new ReactDOMHydrationRoot(root);
|
|
|
}
|
|
|
function isValidContainer(node) {
|
|
|
return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || !disableCommentsAsDOMContainers ));
|
|
|
} // TODO: Remove this function which also includes comment nodes.
|
|
|
// We only use it in places that are currently more relaxed.
|
|
|
|
|
|
function isValidContainerLegacy(node) {
|
|
|
return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || node.nodeType === COMMENT_NODE && node.nodeValue === ' react-mount-point-unstable '));
|
|
|
}
|
|
|
|
|
|
function warnIfReactDOMContainerInDEV(container) {
|
|
|
{
|
|
|
if (container.nodeType === ELEMENT_NODE && container.tagName && container.tagName.toUpperCase() === 'BODY') {
|
|
|
error('createRoot(): Creating roots directly with document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try using a container element created ' + 'for your app.');
|
|
|
}
|
|
|
|
|
|
if (isContainerMarkedAsRoot(container)) {
|
|
|
if (container._reactRootContainer) {
|
|
|
error('You are calling ReactDOMClient.createRoot() on a container that was previously ' + 'passed to ReactDOM.render(). This is not supported.');
|
|
|
} else {
|
|
|
error('You are calling ReactDOMClient.createRoot() on a container that ' + 'has already been passed to createRoot() before. Instead, call ' + 'root.render() on the existing root instead if you want to update it.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentOwner$3 = ReactSharedInternals.ReactCurrentOwner;
|
|
|
var topLevelUpdateWarnings;
|
|
|
|
|
|
{
|
|
|
topLevelUpdateWarnings = function (container) {
|
|
|
if (container._reactRootContainer && container.nodeType !== COMMENT_NODE) {
|
|
|
var hostInstance = findHostInstanceWithNoPortals(container._reactRootContainer.current);
|
|
|
|
|
|
if (hostInstance) {
|
|
|
if (hostInstance.parentNode !== container) {
|
|
|
error('render(...): It looks like the React-rendered content of this ' + 'container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + 'ReactDOM.unmountComponentAtNode to empty a container.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var isRootRenderedBySomeReact = !!container._reactRootContainer;
|
|
|
var rootEl = getReactRootElementInContainer(container);
|
|
|
var hasNonRootReactChild = !!(rootEl && getInstanceFromNode(rootEl));
|
|
|
|
|
|
if (hasNonRootReactChild && !isRootRenderedBySomeReact) {
|
|
|
error('render(...): Replacing React-rendered children with a new root ' + 'component. If you intended to update the children of this node, ' + 'you should instead have the existing children update their state ' + 'and render the new components instead of calling ReactDOM.render.');
|
|
|
}
|
|
|
|
|
|
if (container.nodeType === ELEMENT_NODE && container.tagName && container.tagName.toUpperCase() === 'BODY') {
|
|
|
error('render(): Rendering components directly into document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try rendering into a container element created ' + 'for your app.');
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function getReactRootElementInContainer(container) {
|
|
|
if (!container) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
if (container.nodeType === DOCUMENT_NODE) {
|
|
|
return container.documentElement;
|
|
|
} else {
|
|
|
return container.firstChild;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function noopOnRecoverableError() {// This isn't reachable because onRecoverableError isn't called in the
|
|
|
// legacy API.
|
|
|
}
|
|
|
|
|
|
function legacyCreateRootFromDOMContainer(container, initialChildren, parentComponent, callback, isHydrationContainer) {
|
|
|
if (isHydrationContainer) {
|
|
|
if (typeof callback === 'function') {
|
|
|
var originalCallback = callback;
|
|
|
|
|
|
callback = function () {
|
|
|
var instance = getPublicRootInstance(root);
|
|
|
originalCallback.call(instance);
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var root = createHydrationContainer(initialChildren, callback, container, LegacyRoot, null, // hydrationCallbacks
|
|
|
false, // isStrictMode
|
|
|
false, // concurrentUpdatesByDefaultOverride,
|
|
|
'', // identifierPrefix
|
|
|
noopOnRecoverableError);
|
|
|
container._reactRootContainer = root;
|
|
|
markContainerAsRoot(root.current, container);
|
|
|
var rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container;
|
|
|
listenToAllSupportedEvents(rootContainerElement);
|
|
|
flushSync();
|
|
|
return root;
|
|
|
} else {
|
|
|
// First clear any existing content.
|
|
|
var rootSibling;
|
|
|
|
|
|
while (rootSibling = container.lastChild) {
|
|
|
container.removeChild(rootSibling);
|
|
|
}
|
|
|
|
|
|
if (typeof callback === 'function') {
|
|
|
var _originalCallback = callback;
|
|
|
|
|
|
callback = function () {
|
|
|
var instance = getPublicRootInstance(_root);
|
|
|
|
|
|
_originalCallback.call(instance);
|
|
|
};
|
|
|
}
|
|
|
|
|
|
var _root = createContainer(container, LegacyRoot, null, // hydrationCallbacks
|
|
|
false, // isStrictMode
|
|
|
false, // concurrentUpdatesByDefaultOverride,
|
|
|
'', // identifierPrefix
|
|
|
noopOnRecoverableError);
|
|
|
|
|
|
container._reactRootContainer = _root;
|
|
|
markContainerAsRoot(_root.current, container);
|
|
|
|
|
|
var _rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container;
|
|
|
|
|
|
listenToAllSupportedEvents(_rootContainerElement); // Initial mount should not be batched.
|
|
|
|
|
|
flushSync(function () {
|
|
|
updateContainer(initialChildren, _root, parentComponent, callback);
|
|
|
});
|
|
|
return _root;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function warnOnInvalidCallback$1(callback, callerName) {
|
|
|
{
|
|
|
if (callback !== null && typeof callback !== 'function') {
|
|
|
error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function legacyRenderSubtreeIntoContainer(parentComponent, children, container, forceHydrate, callback) {
|
|
|
{
|
|
|
topLevelUpdateWarnings(container);
|
|
|
warnOnInvalidCallback$1(callback === undefined ? null : callback, 'render');
|
|
|
}
|
|
|
|
|
|
var maybeRoot = container._reactRootContainer;
|
|
|
var root;
|
|
|
|
|
|
if (!maybeRoot) {
|
|
|
// Initial mount
|
|
|
root = legacyCreateRootFromDOMContainer(container, children, parentComponent, callback, forceHydrate);
|
|
|
} else {
|
|
|
root = maybeRoot;
|
|
|
|
|
|
if (typeof callback === 'function') {
|
|
|
var originalCallback = callback;
|
|
|
|
|
|
callback = function () {
|
|
|
var instance = getPublicRootInstance(root);
|
|
|
originalCallback.call(instance);
|
|
|
};
|
|
|
} // Update
|
|
|
|
|
|
|
|
|
updateContainer(children, root, parentComponent, callback);
|
|
|
}
|
|
|
|
|
|
return getPublicRootInstance(root);
|
|
|
}
|
|
|
|
|
|
function findDOMNode(componentOrElement) {
|
|
|
{
|
|
|
var owner = ReactCurrentOwner$3.current;
|
|
|
|
|
|
if (owner !== null && owner.stateNode !== null) {
|
|
|
var warnedAboutRefsInRender = owner.stateNode._warnedAboutRefsInRender;
|
|
|
|
|
|
if (!warnedAboutRefsInRender) {
|
|
|
error('%s is accessing findDOMNode inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentNameFromType(owner.type) || 'A component');
|
|
|
}
|
|
|
|
|
|
owner.stateNode._warnedAboutRefsInRender = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (componentOrElement == null) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
if (componentOrElement.nodeType === ELEMENT_NODE) {
|
|
|
return componentOrElement;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
return findHostInstanceWithWarning(componentOrElement, 'findDOMNode');
|
|
|
}
|
|
|
}
|
|
|
function hydrate(element, container, callback) {
|
|
|
{
|
|
|
error('ReactDOM.hydrate is no longer supported in React 18. Use hydrateRoot ' + 'instead. Until you switch to the new API, your app will behave as ' + "if it's running React 17. Learn " + 'more: https://reactjs.org/link/switch-to-createroot');
|
|
|
}
|
|
|
|
|
|
if (!isValidContainerLegacy(container)) {
|
|
|
throw new Error('Target container is not a DOM element.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined;
|
|
|
|
|
|
if (isModernRoot) {
|
|
|
error('You are calling ReactDOM.hydrate() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. ' + 'Did you mean to call hydrateRoot(container, element)?');
|
|
|
}
|
|
|
} // TODO: throw or warn if we couldn't hydrate?
|
|
|
|
|
|
|
|
|
return legacyRenderSubtreeIntoContainer(null, element, container, true, callback);
|
|
|
}
|
|
|
function render(element, container, callback) {
|
|
|
{
|
|
|
error('ReactDOM.render is no longer supported in React 18. Use createRoot ' + 'instead. Until you switch to the new API, your app will behave as ' + "if it's running React 17. Learn " + 'more: https://reactjs.org/link/switch-to-createroot');
|
|
|
}
|
|
|
|
|
|
if (!isValidContainerLegacy(container)) {
|
|
|
throw new Error('Target container is not a DOM element.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined;
|
|
|
|
|
|
if (isModernRoot) {
|
|
|
error('You are calling ReactDOM.render() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. ' + 'Did you mean to call root.render(element)?');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return legacyRenderSubtreeIntoContainer(null, element, container, false, callback);
|
|
|
}
|
|
|
function unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) {
|
|
|
{
|
|
|
error('ReactDOM.unstable_renderSubtreeIntoContainer() is no longer supported ' + 'in React 18. Consider using a portal instead. Until you switch to ' + "the createRoot API, your app will behave as if it's running React " + '17. Learn more: https://reactjs.org/link/switch-to-createroot');
|
|
|
}
|
|
|
|
|
|
if (!isValidContainerLegacy(containerNode)) {
|
|
|
throw new Error('Target container is not a DOM element.');
|
|
|
}
|
|
|
|
|
|
if (parentComponent == null || !has(parentComponent)) {
|
|
|
throw new Error('parentComponent must be a valid React Component');
|
|
|
}
|
|
|
|
|
|
return legacyRenderSubtreeIntoContainer(parentComponent, element, containerNode, false, callback);
|
|
|
}
|
|
|
function unmountComponentAtNode(container) {
|
|
|
if (!isValidContainerLegacy(container)) {
|
|
|
throw new Error('unmountComponentAtNode(...): Target container is not a DOM element.');
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined;
|
|
|
|
|
|
if (isModernRoot) {
|
|
|
error('You are calling ReactDOM.unmountComponentAtNode() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. Did you mean to call root.unmount()?');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (container._reactRootContainer) {
|
|
|
{
|
|
|
var rootEl = getReactRootElementInContainer(container);
|
|
|
var renderedByDifferentReact = rootEl && !getInstanceFromNode(rootEl);
|
|
|
|
|
|
if (renderedByDifferentReact) {
|
|
|
error("unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by another copy of React.');
|
|
|
}
|
|
|
} // Unmount should not be batched.
|
|
|
|
|
|
|
|
|
flushSync(function () {
|
|
|
legacyRenderSubtreeIntoContainer(null, null, container, false, function () {
|
|
|
// $FlowFixMe This should probably use `delete container._reactRootContainer`
|
|
|
container._reactRootContainer = null;
|
|
|
unmarkContainerAsRoot(container);
|
|
|
});
|
|
|
}); // If you call unmountComponentAtNode twice in quick succession, you'll
|
|
|
// get `true` twice. That's probably fine?
|
|
|
|
|
|
return true;
|
|
|
} else {
|
|
|
{
|
|
|
var _rootEl = getReactRootElementInContainer(container);
|
|
|
|
|
|
var hasNonRootReactChild = !!(_rootEl && getInstanceFromNode(_rootEl)); // Check if the container itself is a React root node.
|
|
|
|
|
|
var isContainerReactRoot = container.nodeType === ELEMENT_NODE && isValidContainerLegacy(container.parentNode) && !!container.parentNode._reactRootContainer;
|
|
|
|
|
|
if (hasNonRootReactChild) {
|
|
|
error("unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by React and is not a top-level container. %s', isContainerReactRoot ? 'You may have accidentally passed in a React root node instead ' + 'of its container.' : 'Instead, have the parent component update its state and ' + 'rerender in order to remove this component.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
setAttemptSynchronousHydration(attemptSynchronousHydration$1);
|
|
|
setAttemptContinuousHydration(attemptContinuousHydration$1);
|
|
|
setAttemptHydrationAtCurrentPriority(attemptHydrationAtCurrentPriority$1);
|
|
|
setGetCurrentUpdatePriority(getCurrentUpdatePriority);
|
|
|
setAttemptHydrationAtPriority(runWithPriority);
|
|
|
|
|
|
{
|
|
|
if (typeof Map !== 'function' || // $FlowIssue Flow incorrectly thinks Map has no prototype
|
|
|
Map.prototype == null || typeof Map.prototype.forEach !== 'function' || typeof Set !== 'function' || // $FlowIssue Flow incorrectly thinks Set has no prototype
|
|
|
Set.prototype == null || typeof Set.prototype.clear !== 'function' || typeof Set.prototype.forEach !== 'function') {
|
|
|
error('React depends on Map and Set built-in types. Make sure that you load a ' + 'polyfill in older browsers. https://reactjs.org/link/react-polyfills');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
setRestoreImplementation(restoreControlledState$3);
|
|
|
setBatchingImplementation(batchedUpdates$1, discreteUpdates, flushSync);
|
|
|
|
|
|
function createPortal$1(children, container) {
|
|
|
var key = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
|
|
|
|
|
|
if (!isValidContainer(container)) {
|
|
|
throw new Error('Target container is not a DOM element.');
|
|
|
} // TODO: pass ReactDOM portal implementation as third argument
|
|
|
// $FlowFixMe The Flow type is opaque but there's no way to actually create it.
|
|
|
|
|
|
|
|
|
return createPortal(children, container, null, key);
|
|
|
}
|
|
|
|
|
|
function renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) {
|
|
|
return unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback);
|
|
|
}
|
|
|
|
|
|
var Internals = {
|
|
|
usingClientEntryPoint: false,
|
|
|
// Keep in sync with ReactTestUtils.js.
|
|
|
// This is an array for better minification.
|
|
|
Events: [getInstanceFromNode, getNodeFromInstance, getFiberCurrentPropsFromNode, enqueueStateRestore, restoreStateIfNeeded, batchedUpdates$1]
|
|
|
};
|
|
|
|
|
|
function createRoot$1(container, options) {
|
|
|
{
|
|
|
if (!Internals.usingClientEntryPoint && !false) {
|
|
|
error('You are importing createRoot from "react-dom" which is not supported. ' + 'You should instead import it from "react-dom/client".');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return createRoot(container, options);
|
|
|
}
|
|
|
|
|
|
function hydrateRoot$1(container, initialChildren, options) {
|
|
|
{
|
|
|
if (!Internals.usingClientEntryPoint && !false) {
|
|
|
error('You are importing hydrateRoot from "react-dom" which is not supported. ' + 'You should instead import it from "react-dom/client".');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return hydrateRoot(container, initialChildren, options);
|
|
|
} // Overload the definition to the two valid signatures.
|
|
|
// Warning, this opts-out of checking the function body.
|
|
|
|
|
|
|
|
|
// eslint-disable-next-line no-redeclare
|
|
|
function flushSync$1(fn) {
|
|
|
{
|
|
|
if (isAlreadyRendering()) {
|
|
|
error('flushSync was called from inside a lifecycle method. React cannot ' + 'flush when React is already rendering. Consider moving this call to ' + 'a scheduler task or micro task.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return flushSync(fn);
|
|
|
}
|
|
|
var foundDevTools = injectIntoDevTools({
|
|
|
findFiberByHostInstance: getClosestInstanceFromNode,
|
|
|
bundleType: 1 ,
|
|
|
version: ReactVersion,
|
|
|
rendererPackageName: 'react-dom'
|
|
|
});
|
|
|
|
|
|
{
|
|
|
if (!foundDevTools && canUseDOM && window.top === window.self) {
|
|
|
// If we're in Chrome or Firefox, provide a download link if not installed.
|
|
|
if (navigator.userAgent.indexOf('Chrome') > -1 && navigator.userAgent.indexOf('Edge') === -1 || navigator.userAgent.indexOf('Firefox') > -1) {
|
|
|
var protocol = window.location.protocol; // Don't warn in exotic cases like chrome-extension://.
|
|
|
|
|
|
if (/^(https?|file):$/.test(protocol)) {
|
|
|
// eslint-disable-next-line react-internal/no-production-logging
|
|
|
console.info('%cDownload the React DevTools ' + 'for a better development experience: ' + 'https://reactjs.org/link/react-devtools' + (protocol === 'file:' ? '\nYou might need to use a local HTTP server (instead of file://): ' + 'https://reactjs.org/link/react-devtools-faq' : ''), 'font-weight:bold');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals;
|
|
|
exports.createPortal = createPortal$1;
|
|
|
exports.createRoot = createRoot$1;
|
|
|
exports.findDOMNode = findDOMNode;
|
|
|
exports.flushSync = flushSync$1;
|
|
|
exports.hydrate = hydrate;
|
|
|
exports.hydrateRoot = hydrateRoot$1;
|
|
|
exports.render = render;
|
|
|
exports.unmountComponentAtNode = unmountComponentAtNode;
|
|
|
exports.unstable_batchedUpdates = batchedUpdates$1;
|
|
|
exports.unstable_renderSubtreeIntoContainer = renderSubtreeIntoContainer;
|
|
|
exports.version = ReactVersion;
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop ===
|
|
|
'function'
|
|
|
) {
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error());
|
|
|
}
|
|
|
|
|
|
})();
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react-dom/client.js":
|
|
|
/*!******************************************!*\
|
|
|
!*** ./node_modules/react-dom/client.js ***!
|
|
|
\******************************************/
|
|
|
/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var m = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js");
|
|
|
if (false) {} else {
|
|
|
var i = m.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
|
|
|
exports.createRoot = function(c, o) {
|
|
|
i.usingClientEntryPoint = true;
|
|
|
try {
|
|
|
return m.createRoot(c, o);
|
|
|
} finally {
|
|
|
i.usingClientEntryPoint = false;
|
|
|
}
|
|
|
};
|
|
|
exports.hydrateRoot = function(c, h, o) {
|
|
|
i.usingClientEntryPoint = true;
|
|
|
try {
|
|
|
return m.hydrateRoot(c, h, o);
|
|
|
} finally {
|
|
|
i.usingClientEntryPoint = false;
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react-dom/index.js":
|
|
|
/*!*****************************************!*\
|
|
|
!*** ./node_modules/react-dom/index.js ***!
|
|
|
\*****************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
function checkDCE() {
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined' ||
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE !== 'function'
|
|
|
) {
|
|
|
return;
|
|
|
}
|
|
|
if (true) {
|
|
|
// This branch is unreachable because this function is only called
|
|
|
// in production, but the condition is true only in development.
|
|
|
// Therefore if the branch is still here, dead code elimination wasn't
|
|
|
// properly applied.
|
|
|
// Don't change the message. React DevTools relies on it. Also make sure
|
|
|
// this message doesn't occur elsewhere in this function, or it will cause
|
|
|
// a false positive.
|
|
|
throw new Error('^_^');
|
|
|
}
|
|
|
try {
|
|
|
// Verify that the code above has been dead code eliminated (DCE'd).
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(checkDCE);
|
|
|
} catch (err) {
|
|
|
// DevTools shouldn't crash React, no matter what.
|
|
|
// We should still report in case we break this code.
|
|
|
console.error(err);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (false) {} else {
|
|
|
module.exports = __webpack_require__(/*! ./cjs/react-dom.development.js */ "./node_modules/react-dom/cjs/react-dom.development.js");
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react-is/cjs/react-is.development.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/react-is/cjs/react-is.development.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
/** @license React v16.13.1
|
|
|
* react-is.development.js
|
|
|
*
|
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
|
*
|
|
|
* This source code is licensed under the MIT license found in the
|
|
|
* LICENSE file in the root directory of this source tree.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (true) {
|
|
|
(function() {
|
|
|
'use strict';
|
|
|
|
|
|
// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
|
|
|
// nor polyfill, then a plain number is used for performance.
|
|
|
var hasSymbol = typeof Symbol === 'function' && Symbol.for;
|
|
|
var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
|
|
|
var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
|
|
|
var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
|
|
|
var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
|
|
|
var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
|
|
|
var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
|
|
|
var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
|
|
|
// (unstable) APIs that have been removed. Can we remove the symbols?
|
|
|
|
|
|
var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
|
|
|
var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
|
|
|
var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
|
|
|
var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
|
|
|
var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
|
|
|
var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
|
|
|
var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
|
|
|
var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
|
|
|
var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
|
|
|
var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
|
|
|
var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
|
|
|
|
|
|
function isValidElementType(type) {
|
|
|
return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
|
|
|
type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
|
|
|
}
|
|
|
|
|
|
function typeOf(object) {
|
|
|
if (typeof object === 'object' && object !== null) {
|
|
|
var $$typeof = object.$$typeof;
|
|
|
|
|
|
switch ($$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
var type = object.type;
|
|
|
|
|
|
switch (type) {
|
|
|
case REACT_ASYNC_MODE_TYPE:
|
|
|
case REACT_CONCURRENT_MODE_TYPE:
|
|
|
case REACT_FRAGMENT_TYPE:
|
|
|
case REACT_PROFILER_TYPE:
|
|
|
case REACT_STRICT_MODE_TYPE:
|
|
|
case REACT_SUSPENSE_TYPE:
|
|
|
return type;
|
|
|
|
|
|
default:
|
|
|
var $$typeofType = type && type.$$typeof;
|
|
|
|
|
|
switch ($$typeofType) {
|
|
|
case REACT_CONTEXT_TYPE:
|
|
|
case REACT_FORWARD_REF_TYPE:
|
|
|
case REACT_LAZY_TYPE:
|
|
|
case REACT_MEMO_TYPE:
|
|
|
case REACT_PROVIDER_TYPE:
|
|
|
return $$typeofType;
|
|
|
|
|
|
default:
|
|
|
return $$typeof;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
return $$typeof;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return undefined;
|
|
|
} // AsyncMode is deprecated along with isAsyncMode
|
|
|
|
|
|
var AsyncMode = REACT_ASYNC_MODE_TYPE;
|
|
|
var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
|
|
|
var ContextConsumer = REACT_CONTEXT_TYPE;
|
|
|
var ContextProvider = REACT_PROVIDER_TYPE;
|
|
|
var Element = REACT_ELEMENT_TYPE;
|
|
|
var ForwardRef = REACT_FORWARD_REF_TYPE;
|
|
|
var Fragment = REACT_FRAGMENT_TYPE;
|
|
|
var Lazy = REACT_LAZY_TYPE;
|
|
|
var Memo = REACT_MEMO_TYPE;
|
|
|
var Portal = REACT_PORTAL_TYPE;
|
|
|
var Profiler = REACT_PROFILER_TYPE;
|
|
|
var StrictMode = REACT_STRICT_MODE_TYPE;
|
|
|
var Suspense = REACT_SUSPENSE_TYPE;
|
|
|
var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
|
|
|
|
|
|
function isAsyncMode(object) {
|
|
|
{
|
|
|
if (!hasWarnedAboutDeprecatedIsAsyncMode) {
|
|
|
hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
|
|
|
|
|
|
console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
|
|
|
}
|
|
|
function isConcurrentMode(object) {
|
|
|
return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
|
|
|
}
|
|
|
function isContextConsumer(object) {
|
|
|
return typeOf(object) === REACT_CONTEXT_TYPE;
|
|
|
}
|
|
|
function isContextProvider(object) {
|
|
|
return typeOf(object) === REACT_PROVIDER_TYPE;
|
|
|
}
|
|
|
function isElement(object) {
|
|
|
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
|
|
}
|
|
|
function isForwardRef(object) {
|
|
|
return typeOf(object) === REACT_FORWARD_REF_TYPE;
|
|
|
}
|
|
|
function isFragment(object) {
|
|
|
return typeOf(object) === REACT_FRAGMENT_TYPE;
|
|
|
}
|
|
|
function isLazy(object) {
|
|
|
return typeOf(object) === REACT_LAZY_TYPE;
|
|
|
}
|
|
|
function isMemo(object) {
|
|
|
return typeOf(object) === REACT_MEMO_TYPE;
|
|
|
}
|
|
|
function isPortal(object) {
|
|
|
return typeOf(object) === REACT_PORTAL_TYPE;
|
|
|
}
|
|
|
function isProfiler(object) {
|
|
|
return typeOf(object) === REACT_PROFILER_TYPE;
|
|
|
}
|
|
|
function isStrictMode(object) {
|
|
|
return typeOf(object) === REACT_STRICT_MODE_TYPE;
|
|
|
}
|
|
|
function isSuspense(object) {
|
|
|
return typeOf(object) === REACT_SUSPENSE_TYPE;
|
|
|
}
|
|
|
|
|
|
exports.AsyncMode = AsyncMode;
|
|
|
exports.ConcurrentMode = ConcurrentMode;
|
|
|
exports.ContextConsumer = ContextConsumer;
|
|
|
exports.ContextProvider = ContextProvider;
|
|
|
exports.Element = Element;
|
|
|
exports.ForwardRef = ForwardRef;
|
|
|
exports.Fragment = Fragment;
|
|
|
exports.Lazy = Lazy;
|
|
|
exports.Memo = Memo;
|
|
|
exports.Portal = Portal;
|
|
|
exports.Profiler = Profiler;
|
|
|
exports.StrictMode = StrictMode;
|
|
|
exports.Suspense = Suspense;
|
|
|
exports.isAsyncMode = isAsyncMode;
|
|
|
exports.isConcurrentMode = isConcurrentMode;
|
|
|
exports.isContextConsumer = isContextConsumer;
|
|
|
exports.isContextProvider = isContextProvider;
|
|
|
exports.isElement = isElement;
|
|
|
exports.isForwardRef = isForwardRef;
|
|
|
exports.isFragment = isFragment;
|
|
|
exports.isLazy = isLazy;
|
|
|
exports.isMemo = isMemo;
|
|
|
exports.isPortal = isPortal;
|
|
|
exports.isProfiler = isProfiler;
|
|
|
exports.isStrictMode = isStrictMode;
|
|
|
exports.isSuspense = isSuspense;
|
|
|
exports.isValidElementType = isValidElementType;
|
|
|
exports.typeOf = typeOf;
|
|
|
})();
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react-is/index.js":
|
|
|
/*!****************************************!*\
|
|
|
!*** ./node_modules/react-is/index.js ***!
|
|
|
\****************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
if (false) {} else {
|
|
|
module.exports = __webpack_require__(/*! ./cjs/react-is.development.js */ "./node_modules/react-is/cjs/react-is.development.js");
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react/cjs/react.development.js":
|
|
|
/*!*****************************************************!*\
|
|
|
!*** ./node_modules/react/cjs/react.development.js ***!
|
|
|
\*****************************************************/
|
|
|
/***/ ((module, exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
/* module decorator */ module = __webpack_require__.nmd(module);
|
|
|
/**
|
|
|
* @license React
|
|
|
* react.development.js
|
|
|
*
|
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
|
*
|
|
|
* This source code is licensed under the MIT license found in the
|
|
|
* LICENSE file in the root directory of this source tree.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
if (true) {
|
|
|
(function() {
|
|
|
|
|
|
'use strict';
|
|
|
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart ===
|
|
|
'function'
|
|
|
) {
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
|
|
|
}
|
|
|
var ReactVersion = '18.2.0';
|
|
|
|
|
|
// ATTENTION
|
|
|
// When adding new symbols to this file,
|
|
|
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
|
|
|
// The Symbol used to tag the ReactElement-like types.
|
|
|
var REACT_ELEMENT_TYPE = Symbol.for('react.element');
|
|
|
var REACT_PORTAL_TYPE = Symbol.for('react.portal');
|
|
|
var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
|
|
|
var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode');
|
|
|
var REACT_PROFILER_TYPE = Symbol.for('react.profiler');
|
|
|
var REACT_PROVIDER_TYPE = Symbol.for('react.provider');
|
|
|
var REACT_CONTEXT_TYPE = Symbol.for('react.context');
|
|
|
var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
|
|
|
var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense');
|
|
|
var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list');
|
|
|
var REACT_MEMO_TYPE = Symbol.for('react.memo');
|
|
|
var REACT_LAZY_TYPE = Symbol.for('react.lazy');
|
|
|
var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen');
|
|
|
var MAYBE_ITERATOR_SYMBOL = Symbol.iterator;
|
|
|
var FAUX_ITERATOR_SYMBOL = '@@iterator';
|
|
|
function getIteratorFn(maybeIterable) {
|
|
|
if (maybeIterable === null || typeof maybeIterable !== 'object') {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL];
|
|
|
|
|
|
if (typeof maybeIterator === 'function') {
|
|
|
return maybeIterator;
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Keeps track of the current dispatcher.
|
|
|
*/
|
|
|
var ReactCurrentDispatcher = {
|
|
|
/**
|
|
|
* @internal
|
|
|
* @type {ReactComponent}
|
|
|
*/
|
|
|
current: null
|
|
|
};
|
|
|
|
|
|
/**
|
|
|
* Keeps track of the current batch's configuration such as how long an update
|
|
|
* should suspend for if it needs to.
|
|
|
*/
|
|
|
var ReactCurrentBatchConfig = {
|
|
|
transition: null
|
|
|
};
|
|
|
|
|
|
var ReactCurrentActQueue = {
|
|
|
current: null,
|
|
|
// Used to reproduce behavior of `batchedUpdates` in legacy mode.
|
|
|
isBatchingLegacy: false,
|
|
|
didScheduleLegacyUpdate: false
|
|
|
};
|
|
|
|
|
|
/**
|
|
|
* Keeps track of the current owner.
|
|
|
*
|
|
|
* The current owner is the component who should own any components that are
|
|
|
* currently being constructed.
|
|
|
*/
|
|
|
var ReactCurrentOwner = {
|
|
|
/**
|
|
|
* @internal
|
|
|
* @type {ReactComponent}
|
|
|
*/
|
|
|
current: null
|
|
|
};
|
|
|
|
|
|
var ReactDebugCurrentFrame = {};
|
|
|
var currentExtraStackFrame = null;
|
|
|
function setExtraStackFrame(stack) {
|
|
|
{
|
|
|
currentExtraStackFrame = stack;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
ReactDebugCurrentFrame.setExtraStackFrame = function (stack) {
|
|
|
{
|
|
|
currentExtraStackFrame = stack;
|
|
|
}
|
|
|
}; // Stack implementation injected by the current renderer.
|
|
|
|
|
|
|
|
|
ReactDebugCurrentFrame.getCurrentStack = null;
|
|
|
|
|
|
ReactDebugCurrentFrame.getStackAddendum = function () {
|
|
|
var stack = ''; // Add an extra top frame while an element is being validated
|
|
|
|
|
|
if (currentExtraStackFrame) {
|
|
|
stack += currentExtraStackFrame;
|
|
|
} // Delegate to the injected renderer-specific implementation
|
|
|
|
|
|
|
|
|
var impl = ReactDebugCurrentFrame.getCurrentStack;
|
|
|
|
|
|
if (impl) {
|
|
|
stack += impl() || '';
|
|
|
}
|
|
|
|
|
|
return stack;
|
|
|
};
|
|
|
}
|
|
|
|
|
|
// -----------------------------------------------------------------------------
|
|
|
|
|
|
var enableScopeAPI = false; // Experimental Create Event Handle API.
|
|
|
var enableCacheElement = false;
|
|
|
var enableTransitionTracing = false; // No known bugs, but needs performance testing
|
|
|
|
|
|
var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber
|
|
|
// stuff. Intended to enable React core members to more easily debug scheduling
|
|
|
// issues in DEV builds.
|
|
|
|
|
|
var enableDebugTracing = false; // Track which Fiber(s) schedule render work.
|
|
|
|
|
|
var ReactSharedInternals = {
|
|
|
ReactCurrentDispatcher: ReactCurrentDispatcher,
|
|
|
ReactCurrentBatchConfig: ReactCurrentBatchConfig,
|
|
|
ReactCurrentOwner: ReactCurrentOwner
|
|
|
};
|
|
|
|
|
|
{
|
|
|
ReactSharedInternals.ReactDebugCurrentFrame = ReactDebugCurrentFrame;
|
|
|
ReactSharedInternals.ReactCurrentActQueue = ReactCurrentActQueue;
|
|
|
}
|
|
|
|
|
|
// by calls to these methods by a Babel plugin.
|
|
|
//
|
|
|
// In PROD (or in packages without access to React internals),
|
|
|
// they are left as they are instead.
|
|
|
|
|
|
function warn(format) {
|
|
|
{
|
|
|
{
|
|
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
|
args[_key - 1] = arguments[_key];
|
|
|
}
|
|
|
|
|
|
printWarning('warn', format, args);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function error(format) {
|
|
|
{
|
|
|
{
|
|
|
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
|
|
args[_key2 - 1] = arguments[_key2];
|
|
|
}
|
|
|
|
|
|
printWarning('error', format, args);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function printWarning(level, format, args) {
|
|
|
// When changing this logic, you might want to also
|
|
|
// update consoleWithStackDev.www.js as well.
|
|
|
{
|
|
|
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
|
var stack = ReactDebugCurrentFrame.getStackAddendum();
|
|
|
|
|
|
if (stack !== '') {
|
|
|
format += '%s';
|
|
|
args = args.concat([stack]);
|
|
|
} // eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
|
|
|
|
|
|
var argsWithFormat = args.map(function (item) {
|
|
|
return String(item);
|
|
|
}); // Careful: RN currently depends on this prefix
|
|
|
|
|
|
argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it
|
|
|
// breaks IE9: https://github.com/facebook/react/issues/13610
|
|
|
// eslint-disable-next-line react-internal/no-production-logging
|
|
|
|
|
|
Function.prototype.apply.call(console[level], console, argsWithFormat);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnStateUpdateForUnmountedComponent = {};
|
|
|
|
|
|
function warnNoop(publicInstance, callerName) {
|
|
|
{
|
|
|
var _constructor = publicInstance.constructor;
|
|
|
var componentName = _constructor && (_constructor.displayName || _constructor.name) || 'ReactClass';
|
|
|
var warningKey = componentName + "." + callerName;
|
|
|
|
|
|
if (didWarnStateUpdateForUnmountedComponent[warningKey]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
error("Can't call %s on a component that is not yet mounted. " + 'This is a no-op, but it might indicate a bug in your application. ' + 'Instead, assign to `this.state` directly or define a `state = {};` ' + 'class property with the desired state in the %s component.', callerName, componentName);
|
|
|
|
|
|
didWarnStateUpdateForUnmountedComponent[warningKey] = true;
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* This is the abstract API for an update queue.
|
|
|
*/
|
|
|
|
|
|
|
|
|
var ReactNoopUpdateQueue = {
|
|
|
/**
|
|
|
* Checks whether or not this composite component is mounted.
|
|
|
* @param {ReactClass} publicInstance The instance we want to test.
|
|
|
* @return {boolean} True if mounted, false otherwise.
|
|
|
* @protected
|
|
|
* @final
|
|
|
*/
|
|
|
isMounted: function (publicInstance) {
|
|
|
return false;
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* Forces an update. This should only be invoked when it is known with
|
|
|
* certainty that we are **not** in a DOM transaction.
|
|
|
*
|
|
|
* You may want to call this when you know that some deeper aspect of the
|
|
|
* component's state has changed but `setState` was not called.
|
|
|
*
|
|
|
* This will not invoke `shouldComponentUpdate`, but it will invoke
|
|
|
* `componentWillUpdate` and `componentDidUpdate`.
|
|
|
*
|
|
|
* @param {ReactClass} publicInstance The instance that should rerender.
|
|
|
* @param {?function} callback Called after component is updated.
|
|
|
* @param {?string} callerName name of the calling function in the public API.
|
|
|
* @internal
|
|
|
*/
|
|
|
enqueueForceUpdate: function (publicInstance, callback, callerName) {
|
|
|
warnNoop(publicInstance, 'forceUpdate');
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* Replaces all of the state. Always use this or `setState` to mutate state.
|
|
|
* You should treat `this.state` as immutable.
|
|
|
*
|
|
|
* There is no guarantee that `this.state` will be immediately updated, so
|
|
|
* accessing `this.state` after calling this method may return the old value.
|
|
|
*
|
|
|
* @param {ReactClass} publicInstance The instance that should rerender.
|
|
|
* @param {object} completeState Next state.
|
|
|
* @param {?function} callback Called after component is updated.
|
|
|
* @param {?string} callerName name of the calling function in the public API.
|
|
|
* @internal
|
|
|
*/
|
|
|
enqueueReplaceState: function (publicInstance, completeState, callback, callerName) {
|
|
|
warnNoop(publicInstance, 'replaceState');
|
|
|
},
|
|
|
|
|
|
/**
|
|
|
* Sets a subset of the state. This only exists because _pendingState is
|
|
|
* internal. This provides a merging strategy that is not available to deep
|
|
|
* properties which is confusing. TODO: Expose pendingState or don't use it
|
|
|
* during the merge.
|
|
|
*
|
|
|
* @param {ReactClass} publicInstance The instance that should rerender.
|
|
|
* @param {object} partialState Next partial state to be merged with state.
|
|
|
* @param {?function} callback Called after component is updated.
|
|
|
* @param {?string} Name of the calling function in the public API.
|
|
|
* @internal
|
|
|
*/
|
|
|
enqueueSetState: function (publicInstance, partialState, callback, callerName) {
|
|
|
warnNoop(publicInstance, 'setState');
|
|
|
}
|
|
|
};
|
|
|
|
|
|
var assign = Object.assign;
|
|
|
|
|
|
var emptyObject = {};
|
|
|
|
|
|
{
|
|
|
Object.freeze(emptyObject);
|
|
|
}
|
|
|
/**
|
|
|
* Base class helpers for the updating state of a component.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function Component(props, context, updater) {
|
|
|
this.props = props;
|
|
|
this.context = context; // If a component has string refs, we will assign a different object later.
|
|
|
|
|
|
this.refs = emptyObject; // We initialize the default updater but the real one gets injected by the
|
|
|
// renderer.
|
|
|
|
|
|
this.updater = updater || ReactNoopUpdateQueue;
|
|
|
}
|
|
|
|
|
|
Component.prototype.isReactComponent = {};
|
|
|
/**
|
|
|
* Sets a subset of the state. Always use this to mutate
|
|
|
* state. You should treat `this.state` as immutable.
|
|
|
*
|
|
|
* There is no guarantee that `this.state` will be immediately updated, so
|
|
|
* accessing `this.state` after calling this method may return the old value.
|
|
|
*
|
|
|
* There is no guarantee that calls to `setState` will run synchronously,
|
|
|
* as they may eventually be batched together. You can provide an optional
|
|
|
* callback that will be executed when the call to setState is actually
|
|
|
* completed.
|
|
|
*
|
|
|
* When a function is provided to setState, it will be called at some point in
|
|
|
* the future (not synchronously). It will be called with the up to date
|
|
|
* component arguments (state, props, context). These values can be different
|
|
|
* from this.* because your function may be called after receiveProps but before
|
|
|
* shouldComponentUpdate, and this new state, props, and context will not yet be
|
|
|
* assigned to this.
|
|
|
*
|
|
|
* @param {object|function} partialState Next partial state or function to
|
|
|
* produce next partial state to be merged with current state.
|
|
|
* @param {?function} callback Called after state is updated.
|
|
|
* @final
|
|
|
* @protected
|
|
|
*/
|
|
|
|
|
|
Component.prototype.setState = function (partialState, callback) {
|
|
|
if (typeof partialState !== 'object' && typeof partialState !== 'function' && partialState != null) {
|
|
|
throw new Error('setState(...): takes an object of state variables to update or a ' + 'function which returns an object of state variables.');
|
|
|
}
|
|
|
|
|
|
this.updater.enqueueSetState(this, partialState, callback, 'setState');
|
|
|
};
|
|
|
/**
|
|
|
* Forces an update. This should only be invoked when it is known with
|
|
|
* certainty that we are **not** in a DOM transaction.
|
|
|
*
|
|
|
* You may want to call this when you know that some deeper aspect of the
|
|
|
* component's state has changed but `setState` was not called.
|
|
|
*
|
|
|
* This will not invoke `shouldComponentUpdate`, but it will invoke
|
|
|
* `componentWillUpdate` and `componentDidUpdate`.
|
|
|
*
|
|
|
* @param {?function} callback Called after update is complete.
|
|
|
* @final
|
|
|
* @protected
|
|
|
*/
|
|
|
|
|
|
|
|
|
Component.prototype.forceUpdate = function (callback) {
|
|
|
this.updater.enqueueForceUpdate(this, callback, 'forceUpdate');
|
|
|
};
|
|
|
/**
|
|
|
* Deprecated APIs. These APIs used to exist on classic React classes but since
|
|
|
* we would like to deprecate them, we're not going to move them over to this
|
|
|
* modern base class. Instead, we define a getter that warns if it's accessed.
|
|
|
*/
|
|
|
|
|
|
|
|
|
{
|
|
|
var deprecatedAPIs = {
|
|
|
isMounted: ['isMounted', 'Instead, make sure to clean up subscriptions and pending requests in ' + 'componentWillUnmount to prevent memory leaks.'],
|
|
|
replaceState: ['replaceState', 'Refactor your code to use setState instead (see ' + 'https://github.com/facebook/react/issues/3236).']
|
|
|
};
|
|
|
|
|
|
var defineDeprecationWarning = function (methodName, info) {
|
|
|
Object.defineProperty(Component.prototype, methodName, {
|
|
|
get: function () {
|
|
|
warn('%s(...) is deprecated in plain JavaScript React classes. %s', info[0], info[1]);
|
|
|
|
|
|
return undefined;
|
|
|
}
|
|
|
});
|
|
|
};
|
|
|
|
|
|
for (var fnName in deprecatedAPIs) {
|
|
|
if (deprecatedAPIs.hasOwnProperty(fnName)) {
|
|
|
defineDeprecationWarning(fnName, deprecatedAPIs[fnName]);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function ComponentDummy() {}
|
|
|
|
|
|
ComponentDummy.prototype = Component.prototype;
|
|
|
/**
|
|
|
* Convenience component with default shallow equality check for sCU.
|
|
|
*/
|
|
|
|
|
|
function PureComponent(props, context, updater) {
|
|
|
this.props = props;
|
|
|
this.context = context; // If a component has string refs, we will assign a different object later.
|
|
|
|
|
|
this.refs = emptyObject;
|
|
|
this.updater = updater || ReactNoopUpdateQueue;
|
|
|
}
|
|
|
|
|
|
var pureComponentPrototype = PureComponent.prototype = new ComponentDummy();
|
|
|
pureComponentPrototype.constructor = PureComponent; // Avoid an extra prototype jump for these methods.
|
|
|
|
|
|
assign(pureComponentPrototype, Component.prototype);
|
|
|
pureComponentPrototype.isPureReactComponent = true;
|
|
|
|
|
|
// an immutable object with a single mutable value
|
|
|
function createRef() {
|
|
|
var refObject = {
|
|
|
current: null
|
|
|
};
|
|
|
|
|
|
{
|
|
|
Object.seal(refObject);
|
|
|
}
|
|
|
|
|
|
return refObject;
|
|
|
}
|
|
|
|
|
|
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
|
|
|
|
|
|
function isArray(a) {
|
|
|
return isArrayImpl(a);
|
|
|
}
|
|
|
|
|
|
/*
|
|
|
* The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol
|
|
|
* and Temporal.* types. See https://github.com/facebook/react/pull/22064.
|
|
|
*
|
|
|
* The functions in this module will throw an easier-to-understand,
|
|
|
* easier-to-debug exception with a clear errors message message explaining the
|
|
|
* problem. (Instead of a confusing exception thrown inside the implementation
|
|
|
* of the `value` object).
|
|
|
*/
|
|
|
// $FlowFixMe only called in DEV, so void return is not possible.
|
|
|
function typeName(value) {
|
|
|
{
|
|
|
// toStringTag is needed for namespaced types like Temporal.Instant
|
|
|
var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag;
|
|
|
var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object';
|
|
|
return type;
|
|
|
}
|
|
|
} // $FlowFixMe only called in DEV, so void return is not possible.
|
|
|
|
|
|
|
|
|
function willCoercionThrow(value) {
|
|
|
{
|
|
|
try {
|
|
|
testStringCoercion(value);
|
|
|
return false;
|
|
|
} catch (e) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function testStringCoercion(value) {
|
|
|
// If you ended up here by following an exception call stack, here's what's
|
|
|
// happened: you supplied an object or symbol value to React (as a prop, key,
|
|
|
// DOM attribute, CSS property, string ref, etc.) and when React tried to
|
|
|
// coerce it to a string using `'' + value`, an exception was thrown.
|
|
|
//
|
|
|
// The most common types that will cause this exception are `Symbol` instances
|
|
|
// and Temporal objects like `Temporal.Instant`. But any object that has a
|
|
|
// `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this
|
|
|
// exception. (Library authors do this to prevent users from using built-in
|
|
|
// numeric operators like `+` or comparison operators like `>=` because custom
|
|
|
// methods are needed to perform accurate arithmetic or comparison.)
|
|
|
//
|
|
|
// To fix the problem, coerce this object or symbol value to a string before
|
|
|
// passing it to React. The most reliable way is usually `String(value)`.
|
|
|
//
|
|
|
// To find which value is throwing, check the browser or debugger console.
|
|
|
// Before this exception was thrown, there should be `console.error` output
|
|
|
// that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the
|
|
|
// problem and how that type was used: key, atrribute, input value prop, etc.
|
|
|
// In most cases, this console output also shows the component and its
|
|
|
// ancestor components where the exception happened.
|
|
|
//
|
|
|
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
return '' + value;
|
|
|
}
|
|
|
function checkKeyStringCoercion(value) {
|
|
|
{
|
|
|
if (willCoercionThrow(value)) {
|
|
|
error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value));
|
|
|
|
|
|
return testStringCoercion(value); // throw (to help callers find troubleshooting comments)
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function getWrappedName(outerType, innerType, wrapperName) {
|
|
|
var displayName = outerType.displayName;
|
|
|
|
|
|
if (displayName) {
|
|
|
return displayName;
|
|
|
}
|
|
|
|
|
|
var functionName = innerType.displayName || innerType.name || '';
|
|
|
return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName;
|
|
|
} // Keep in sync with react-reconciler/getComponentNameFromFiber
|
|
|
|
|
|
|
|
|
function getContextName(type) {
|
|
|
return type.displayName || 'Context';
|
|
|
} // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead.
|
|
|
|
|
|
|
|
|
function getComponentNameFromType(type) {
|
|
|
if (type == null) {
|
|
|
// Host root, text node or just invalid type.
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof type.tag === 'number') {
|
|
|
error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'function') {
|
|
|
return type.displayName || type.name || null;
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'string') {
|
|
|
return type;
|
|
|
}
|
|
|
|
|
|
switch (type) {
|
|
|
case REACT_FRAGMENT_TYPE:
|
|
|
return 'Fragment';
|
|
|
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
return 'Portal';
|
|
|
|
|
|
case REACT_PROFILER_TYPE:
|
|
|
return 'Profiler';
|
|
|
|
|
|
case REACT_STRICT_MODE_TYPE:
|
|
|
return 'StrictMode';
|
|
|
|
|
|
case REACT_SUSPENSE_TYPE:
|
|
|
return 'Suspense';
|
|
|
|
|
|
case REACT_SUSPENSE_LIST_TYPE:
|
|
|
return 'SuspenseList';
|
|
|
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'object') {
|
|
|
switch (type.$$typeof) {
|
|
|
case REACT_CONTEXT_TYPE:
|
|
|
var context = type;
|
|
|
return getContextName(context) + '.Consumer';
|
|
|
|
|
|
case REACT_PROVIDER_TYPE:
|
|
|
var provider = type;
|
|
|
return getContextName(provider._context) + '.Provider';
|
|
|
|
|
|
case REACT_FORWARD_REF_TYPE:
|
|
|
return getWrappedName(type, type.render, 'ForwardRef');
|
|
|
|
|
|
case REACT_MEMO_TYPE:
|
|
|
var outerName = type.displayName || null;
|
|
|
|
|
|
if (outerName !== null) {
|
|
|
return outerName;
|
|
|
}
|
|
|
|
|
|
return getComponentNameFromType(type.type) || 'Memo';
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
{
|
|
|
var lazyComponent = type;
|
|
|
var payload = lazyComponent._payload;
|
|
|
var init = lazyComponent._init;
|
|
|
|
|
|
try {
|
|
|
return getComponentNameFromType(init(payload));
|
|
|
} catch (x) {
|
|
|
return null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// eslint-disable-next-line no-fallthrough
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
|
|
|
|
var RESERVED_PROPS = {
|
|
|
key: true,
|
|
|
ref: true,
|
|
|
__self: true,
|
|
|
__source: true
|
|
|
};
|
|
|
var specialPropKeyWarningShown, specialPropRefWarningShown, didWarnAboutStringRefs;
|
|
|
|
|
|
{
|
|
|
didWarnAboutStringRefs = {};
|
|
|
}
|
|
|
|
|
|
function hasValidRef(config) {
|
|
|
{
|
|
|
if (hasOwnProperty.call(config, 'ref')) {
|
|
|
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
|
|
|
|
|
if (getter && getter.isReactWarning) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return config.ref !== undefined;
|
|
|
}
|
|
|
|
|
|
function hasValidKey(config) {
|
|
|
{
|
|
|
if (hasOwnProperty.call(config, 'key')) {
|
|
|
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
|
|
|
|
|
if (getter && getter.isReactWarning) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return config.key !== undefined;
|
|
|
}
|
|
|
|
|
|
function defineKeyPropWarningGetter(props, displayName) {
|
|
|
var warnAboutAccessingKey = function () {
|
|
|
{
|
|
|
if (!specialPropKeyWarningShown) {
|
|
|
specialPropKeyWarningShown = true;
|
|
|
|
|
|
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
warnAboutAccessingKey.isReactWarning = true;
|
|
|
Object.defineProperty(props, 'key', {
|
|
|
get: warnAboutAccessingKey,
|
|
|
configurable: true
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function defineRefPropWarningGetter(props, displayName) {
|
|
|
var warnAboutAccessingRef = function () {
|
|
|
{
|
|
|
if (!specialPropRefWarningShown) {
|
|
|
specialPropRefWarningShown = true;
|
|
|
|
|
|
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
|
|
|
warnAboutAccessingRef.isReactWarning = true;
|
|
|
Object.defineProperty(props, 'ref', {
|
|
|
get: warnAboutAccessingRef,
|
|
|
configurable: true
|
|
|
});
|
|
|
}
|
|
|
|
|
|
function warnIfStringRefCannotBeAutoConverted(config) {
|
|
|
{
|
|
|
if (typeof config.ref === 'string' && ReactCurrentOwner.current && config.__self && ReactCurrentOwner.current.stateNode !== config.__self) {
|
|
|
var componentName = getComponentNameFromType(ReactCurrentOwner.current.type);
|
|
|
|
|
|
if (!didWarnAboutStringRefs[componentName]) {
|
|
|
error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', componentName, config.ref);
|
|
|
|
|
|
didWarnAboutStringRefs[componentName] = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Factory method to create a new React element. This no longer adheres to
|
|
|
* the class pattern, so do not use new to call it. Also, instanceof check
|
|
|
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
|
|
* if something is a React Element.
|
|
|
*
|
|
|
* @param {*} type
|
|
|
* @param {*} props
|
|
|
* @param {*} key
|
|
|
* @param {string|object} ref
|
|
|
* @param {*} owner
|
|
|
* @param {*} self A *temporary* helper to detect places where `this` is
|
|
|
* different from the `owner` when React.createElement is called, so that we
|
|
|
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
|
|
* functions, and as long as `this` and owner are the same, there will be no
|
|
|
* change in behavior.
|
|
|
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
|
|
* indicating filename, line number, and/or other information.
|
|
|
* @internal
|
|
|
*/
|
|
|
|
|
|
|
|
|
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
|
|
var element = {
|
|
|
// This tag allows us to uniquely identify this as a React Element
|
|
|
$$typeof: REACT_ELEMENT_TYPE,
|
|
|
// Built-in properties that belong on the element
|
|
|
type: type,
|
|
|
key: key,
|
|
|
ref: ref,
|
|
|
props: props,
|
|
|
// Record the component responsible for creating this element.
|
|
|
_owner: owner
|
|
|
};
|
|
|
|
|
|
{
|
|
|
// The validation flag is currently mutative. We put it on
|
|
|
// an external backing store so that we can freeze the whole object.
|
|
|
// This can be replaced with a WeakMap once they are implemented in
|
|
|
// commonly used development environments.
|
|
|
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
|
|
// the validation flag non-enumerable (where possible, which should
|
|
|
// include every environment we run tests in), so the test framework
|
|
|
// ignores it.
|
|
|
|
|
|
Object.defineProperty(element._store, 'validated', {
|
|
|
configurable: false,
|
|
|
enumerable: false,
|
|
|
writable: true,
|
|
|
value: false
|
|
|
}); // self and source are DEV only properties.
|
|
|
|
|
|
Object.defineProperty(element, '_self', {
|
|
|
configurable: false,
|
|
|
enumerable: false,
|
|
|
writable: false,
|
|
|
value: self
|
|
|
}); // Two elements created in two different places should be considered
|
|
|
// equal for testing purposes and therefore we hide it from enumeration.
|
|
|
|
|
|
Object.defineProperty(element, '_source', {
|
|
|
configurable: false,
|
|
|
enumerable: false,
|
|
|
writable: false,
|
|
|
value: source
|
|
|
});
|
|
|
|
|
|
if (Object.freeze) {
|
|
|
Object.freeze(element.props);
|
|
|
Object.freeze(element);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return element;
|
|
|
};
|
|
|
/**
|
|
|
* Create and return a new ReactElement of the given type.
|
|
|
* See https://reactjs.org/docs/react-api.html#createelement
|
|
|
*/
|
|
|
|
|
|
function createElement(type, config, children) {
|
|
|
var propName; // Reserved names are extracted
|
|
|
|
|
|
var props = {};
|
|
|
var key = null;
|
|
|
var ref = null;
|
|
|
var self = null;
|
|
|
var source = null;
|
|
|
|
|
|
if (config != null) {
|
|
|
if (hasValidRef(config)) {
|
|
|
ref = config.ref;
|
|
|
|
|
|
{
|
|
|
warnIfStringRefCannotBeAutoConverted(config);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (hasValidKey(config)) {
|
|
|
{
|
|
|
checkKeyStringCoercion(config.key);
|
|
|
}
|
|
|
|
|
|
key = '' + config.key;
|
|
|
}
|
|
|
|
|
|
self = config.__self === undefined ? null : config.__self;
|
|
|
source = config.__source === undefined ? null : config.__source; // Remaining properties are added to a new props object
|
|
|
|
|
|
for (propName in config) {
|
|
|
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
|
|
props[propName] = config[propName];
|
|
|
}
|
|
|
}
|
|
|
} // Children can be more than one argument, and those are transferred onto
|
|
|
// the newly allocated props object.
|
|
|
|
|
|
|
|
|
var childrenLength = arguments.length - 2;
|
|
|
|
|
|
if (childrenLength === 1) {
|
|
|
props.children = children;
|
|
|
} else if (childrenLength > 1) {
|
|
|
var childArray = Array(childrenLength);
|
|
|
|
|
|
for (var i = 0; i < childrenLength; i++) {
|
|
|
childArray[i] = arguments[i + 2];
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (Object.freeze) {
|
|
|
Object.freeze(childArray);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
props.children = childArray;
|
|
|
} // Resolve default props
|
|
|
|
|
|
|
|
|
if (type && type.defaultProps) {
|
|
|
var defaultProps = type.defaultProps;
|
|
|
|
|
|
for (propName in defaultProps) {
|
|
|
if (props[propName] === undefined) {
|
|
|
props[propName] = defaultProps[propName];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (key || ref) {
|
|
|
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
|
|
|
|
|
if (key) {
|
|
|
defineKeyPropWarningGetter(props, displayName);
|
|
|
}
|
|
|
|
|
|
if (ref) {
|
|
|
defineRefPropWarningGetter(props, displayName);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
|
|
}
|
|
|
function cloneAndReplaceKey(oldElement, newKey) {
|
|
|
var newElement = ReactElement(oldElement.type, newKey, oldElement.ref, oldElement._self, oldElement._source, oldElement._owner, oldElement.props);
|
|
|
return newElement;
|
|
|
}
|
|
|
/**
|
|
|
* Clone and return a new ReactElement using element as the starting point.
|
|
|
* See https://reactjs.org/docs/react-api.html#cloneelement
|
|
|
*/
|
|
|
|
|
|
function cloneElement(element, config, children) {
|
|
|
if (element === null || element === undefined) {
|
|
|
throw new Error("React.cloneElement(...): The argument must be a React element, but you passed " + element + ".");
|
|
|
}
|
|
|
|
|
|
var propName; // Original props are copied
|
|
|
|
|
|
var props = assign({}, element.props); // Reserved names are extracted
|
|
|
|
|
|
var key = element.key;
|
|
|
var ref = element.ref; // Self is preserved since the owner is preserved.
|
|
|
|
|
|
var self = element._self; // Source is preserved since cloneElement is unlikely to be targeted by a
|
|
|
// transpiler, and the original source is probably a better indicator of the
|
|
|
// true owner.
|
|
|
|
|
|
var source = element._source; // Owner will be preserved, unless ref is overridden
|
|
|
|
|
|
var owner = element._owner;
|
|
|
|
|
|
if (config != null) {
|
|
|
if (hasValidRef(config)) {
|
|
|
// Silently steal the ref from the parent.
|
|
|
ref = config.ref;
|
|
|
owner = ReactCurrentOwner.current;
|
|
|
}
|
|
|
|
|
|
if (hasValidKey(config)) {
|
|
|
{
|
|
|
checkKeyStringCoercion(config.key);
|
|
|
}
|
|
|
|
|
|
key = '' + config.key;
|
|
|
} // Remaining properties override existing props
|
|
|
|
|
|
|
|
|
var defaultProps;
|
|
|
|
|
|
if (element.type && element.type.defaultProps) {
|
|
|
defaultProps = element.type.defaultProps;
|
|
|
}
|
|
|
|
|
|
for (propName in config) {
|
|
|
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
|
|
if (config[propName] === undefined && defaultProps !== undefined) {
|
|
|
// Resolve default props
|
|
|
props[propName] = defaultProps[propName];
|
|
|
} else {
|
|
|
props[propName] = config[propName];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} // Children can be more than one argument, and those are transferred onto
|
|
|
// the newly allocated props object.
|
|
|
|
|
|
|
|
|
var childrenLength = arguments.length - 2;
|
|
|
|
|
|
if (childrenLength === 1) {
|
|
|
props.children = children;
|
|
|
} else if (childrenLength > 1) {
|
|
|
var childArray = Array(childrenLength);
|
|
|
|
|
|
for (var i = 0; i < childrenLength; i++) {
|
|
|
childArray[i] = arguments[i + 2];
|
|
|
}
|
|
|
|
|
|
props.children = childArray;
|
|
|
}
|
|
|
|
|
|
return ReactElement(element.type, key, ref, self, source, owner, props);
|
|
|
}
|
|
|
/**
|
|
|
* Verifies the object is a ReactElement.
|
|
|
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
|
|
* @param {?object} object
|
|
|
* @return {boolean} True if `object` is a ReactElement.
|
|
|
* @final
|
|
|
*/
|
|
|
|
|
|
function isValidElement(object) {
|
|
|
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
|
|
}
|
|
|
|
|
|
var SEPARATOR = '.';
|
|
|
var SUBSEPARATOR = ':';
|
|
|
/**
|
|
|
* Escape and wrap key so it is safe to use as a reactid
|
|
|
*
|
|
|
* @param {string} key to be escaped.
|
|
|
* @return {string} the escaped key.
|
|
|
*/
|
|
|
|
|
|
function escape(key) {
|
|
|
var escapeRegex = /[=:]/g;
|
|
|
var escaperLookup = {
|
|
|
'=': '=0',
|
|
|
':': '=2'
|
|
|
};
|
|
|
var escapedString = key.replace(escapeRegex, function (match) {
|
|
|
return escaperLookup[match];
|
|
|
});
|
|
|
return '$' + escapedString;
|
|
|
}
|
|
|
/**
|
|
|
* TODO: Test that a single child and an array with one item have the same key
|
|
|
* pattern.
|
|
|
*/
|
|
|
|
|
|
|
|
|
var didWarnAboutMaps = false;
|
|
|
var userProvidedKeyEscapeRegex = /\/+/g;
|
|
|
|
|
|
function escapeUserProvidedKey(text) {
|
|
|
return text.replace(userProvidedKeyEscapeRegex, '$&/');
|
|
|
}
|
|
|
/**
|
|
|
* Generate a key string that identifies a element within a set.
|
|
|
*
|
|
|
* @param {*} element A element that could contain a manual key.
|
|
|
* @param {number} index Index that is used if a manual key is not provided.
|
|
|
* @return {string}
|
|
|
*/
|
|
|
|
|
|
|
|
|
function getElementKey(element, index) {
|
|
|
// Do some typechecking here since we call this blindly. We want to ensure
|
|
|
// that we don't block potential future ES APIs.
|
|
|
if (typeof element === 'object' && element !== null && element.key != null) {
|
|
|
// Explicit key
|
|
|
{
|
|
|
checkKeyStringCoercion(element.key);
|
|
|
}
|
|
|
|
|
|
return escape('' + element.key);
|
|
|
} // Implicit key determined by the index in the set
|
|
|
|
|
|
|
|
|
return index.toString(36);
|
|
|
}
|
|
|
|
|
|
function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
|
|
|
var type = typeof children;
|
|
|
|
|
|
if (type === 'undefined' || type === 'boolean') {
|
|
|
// All of the above are perceived as null.
|
|
|
children = null;
|
|
|
}
|
|
|
|
|
|
var invokeCallback = false;
|
|
|
|
|
|
if (children === null) {
|
|
|
invokeCallback = true;
|
|
|
} else {
|
|
|
switch (type) {
|
|
|
case 'string':
|
|
|
case 'number':
|
|
|
invokeCallback = true;
|
|
|
break;
|
|
|
|
|
|
case 'object':
|
|
|
switch (children.$$typeof) {
|
|
|
case REACT_ELEMENT_TYPE:
|
|
|
case REACT_PORTAL_TYPE:
|
|
|
invokeCallback = true;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (invokeCallback) {
|
|
|
var _child = children;
|
|
|
var mappedChild = callback(_child); // If it's the only child, treat the name as if it was wrapped in an array
|
|
|
// so that it's consistent if the number of children grows:
|
|
|
|
|
|
var childKey = nameSoFar === '' ? SEPARATOR + getElementKey(_child, 0) : nameSoFar;
|
|
|
|
|
|
if (isArray(mappedChild)) {
|
|
|
var escapedChildKey = '';
|
|
|
|
|
|
if (childKey != null) {
|
|
|
escapedChildKey = escapeUserProvidedKey(childKey) + '/';
|
|
|
}
|
|
|
|
|
|
mapIntoArray(mappedChild, array, escapedChildKey, '', function (c) {
|
|
|
return c;
|
|
|
});
|
|
|
} else if (mappedChild != null) {
|
|
|
if (isValidElement(mappedChild)) {
|
|
|
{
|
|
|
// The `if` statement here prevents auto-disabling of the safe
|
|
|
// coercion ESLint rule, so we must manually disable it below.
|
|
|
// $FlowFixMe Flow incorrectly thinks React.Portal doesn't have a key
|
|
|
if (mappedChild.key && (!_child || _child.key !== mappedChild.key)) {
|
|
|
checkKeyStringCoercion(mappedChild.key);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
mappedChild = cloneAndReplaceKey(mappedChild, // Keep both the (mapped) and old keys if they differ, just as
|
|
|
// traverseAllChildren used to do for objects as children
|
|
|
escapedPrefix + ( // $FlowFixMe Flow incorrectly thinks React.Portal doesn't have a key
|
|
|
mappedChild.key && (!_child || _child.key !== mappedChild.key) ? // $FlowFixMe Flow incorrectly thinks existing element's key can be a number
|
|
|
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
escapeUserProvidedKey('' + mappedChild.key) + '/' : '') + childKey);
|
|
|
}
|
|
|
|
|
|
array.push(mappedChild);
|
|
|
}
|
|
|
|
|
|
return 1;
|
|
|
}
|
|
|
|
|
|
var child;
|
|
|
var nextName;
|
|
|
var subtreeCount = 0; // Count of children found in the current subtree.
|
|
|
|
|
|
var nextNamePrefix = nameSoFar === '' ? SEPARATOR : nameSoFar + SUBSEPARATOR;
|
|
|
|
|
|
if (isArray(children)) {
|
|
|
for (var i = 0; i < children.length; i++) {
|
|
|
child = children[i];
|
|
|
nextName = nextNamePrefix + getElementKey(child, i);
|
|
|
subtreeCount += mapIntoArray(child, array, escapedPrefix, nextName, callback);
|
|
|
}
|
|
|
} else {
|
|
|
var iteratorFn = getIteratorFn(children);
|
|
|
|
|
|
if (typeof iteratorFn === 'function') {
|
|
|
var iterableChildren = children;
|
|
|
|
|
|
{
|
|
|
// Warn about using Maps as children
|
|
|
if (iteratorFn === iterableChildren.entries) {
|
|
|
if (!didWarnAboutMaps) {
|
|
|
warn('Using Maps as children is not supported. ' + 'Use an array of keyed ReactElements instead.');
|
|
|
}
|
|
|
|
|
|
didWarnAboutMaps = true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var iterator = iteratorFn.call(iterableChildren);
|
|
|
var step;
|
|
|
var ii = 0;
|
|
|
|
|
|
while (!(step = iterator.next()).done) {
|
|
|
child = step.value;
|
|
|
nextName = nextNamePrefix + getElementKey(child, ii++);
|
|
|
subtreeCount += mapIntoArray(child, array, escapedPrefix, nextName, callback);
|
|
|
}
|
|
|
} else if (type === 'object') {
|
|
|
// eslint-disable-next-line react-internal/safe-string-coercion
|
|
|
var childrenString = String(children);
|
|
|
throw new Error("Objects are not valid as a React child (found: " + (childrenString === '[object Object]' ? 'object with keys {' + Object.keys(children).join(', ') + '}' : childrenString) + "). " + 'If you meant to render a collection of children, use an array ' + 'instead.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return subtreeCount;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Maps children that are typically specified as `props.children`.
|
|
|
*
|
|
|
* See https://reactjs.org/docs/react-api.html#reactchildrenmap
|
|
|
*
|
|
|
* The provided mapFunction(child, index) will be called for each
|
|
|
* leaf child.
|
|
|
*
|
|
|
* @param {?*} children Children tree container.
|
|
|
* @param {function(*, int)} func The map function.
|
|
|
* @param {*} context Context for mapFunction.
|
|
|
* @return {object} Object containing the ordered map of results.
|
|
|
*/
|
|
|
function mapChildren(children, func, context) {
|
|
|
if (children == null) {
|
|
|
return children;
|
|
|
}
|
|
|
|
|
|
var result = [];
|
|
|
var count = 0;
|
|
|
mapIntoArray(children, result, '', '', function (child) {
|
|
|
return func.call(context, child, count++);
|
|
|
});
|
|
|
return result;
|
|
|
}
|
|
|
/**
|
|
|
* Count the number of children that are typically specified as
|
|
|
* `props.children`.
|
|
|
*
|
|
|
* See https://reactjs.org/docs/react-api.html#reactchildrencount
|
|
|
*
|
|
|
* @param {?*} children Children tree container.
|
|
|
* @return {number} The number of children.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function countChildren(children) {
|
|
|
var n = 0;
|
|
|
mapChildren(children, function () {
|
|
|
n++; // Don't return anything
|
|
|
});
|
|
|
return n;
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* Iterates through children that are typically specified as `props.children`.
|
|
|
*
|
|
|
* See https://reactjs.org/docs/react-api.html#reactchildrenforeach
|
|
|
*
|
|
|
* The provided forEachFunc(child, index) will be called for each
|
|
|
* leaf child.
|
|
|
*
|
|
|
* @param {?*} children Children tree container.
|
|
|
* @param {function(*, int)} forEachFunc
|
|
|
* @param {*} forEachContext Context for forEachContext.
|
|
|
*/
|
|
|
function forEachChildren(children, forEachFunc, forEachContext) {
|
|
|
mapChildren(children, function () {
|
|
|
forEachFunc.apply(this, arguments); // Don't return anything.
|
|
|
}, forEachContext);
|
|
|
}
|
|
|
/**
|
|
|
* Flatten a children object (typically specified as `props.children`) and
|
|
|
* return an array with appropriately re-keyed children.
|
|
|
*
|
|
|
* See https://reactjs.org/docs/react-api.html#reactchildrentoarray
|
|
|
*/
|
|
|
|
|
|
|
|
|
function toArray(children) {
|
|
|
return mapChildren(children, function (child) {
|
|
|
return child;
|
|
|
}) || [];
|
|
|
}
|
|
|
/**
|
|
|
* Returns the first child in a collection of children and verifies that there
|
|
|
* is only one child in the collection.
|
|
|
*
|
|
|
* See https://reactjs.org/docs/react-api.html#reactchildrenonly
|
|
|
*
|
|
|
* The current implementation of this function assumes that a single child gets
|
|
|
* passed without a wrapper, but the purpose of this helper function is to
|
|
|
* abstract away the particular structure of children.
|
|
|
*
|
|
|
* @param {?object} children Child collection structure.
|
|
|
* @return {ReactElement} The first and only `ReactElement` contained in the
|
|
|
* structure.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function onlyChild(children) {
|
|
|
if (!isValidElement(children)) {
|
|
|
throw new Error('React.Children.only expected to receive a single React element child.');
|
|
|
}
|
|
|
|
|
|
return children;
|
|
|
}
|
|
|
|
|
|
function createContext(defaultValue) {
|
|
|
// TODO: Second argument used to be an optional `calculateChangedBits`
|
|
|
// function. Warn to reserve for future use?
|
|
|
var context = {
|
|
|
$$typeof: REACT_CONTEXT_TYPE,
|
|
|
// As a workaround to support multiple concurrent renderers, we categorize
|
|
|
// some renderers as primary and others as secondary. We only expect
|
|
|
// there to be two concurrent renderers at most: React Native (primary) and
|
|
|
// Fabric (secondary); React DOM (primary) and React ART (secondary).
|
|
|
// Secondary renderers store their context values on separate fields.
|
|
|
_currentValue: defaultValue,
|
|
|
_currentValue2: defaultValue,
|
|
|
// Used to track how many concurrent renderers this context currently
|
|
|
// supports within in a single renderer. Such as parallel server rendering.
|
|
|
_threadCount: 0,
|
|
|
// These are circular
|
|
|
Provider: null,
|
|
|
Consumer: null,
|
|
|
// Add these to use same hidden class in VM as ServerContext
|
|
|
_defaultValue: null,
|
|
|
_globalName: null
|
|
|
};
|
|
|
context.Provider = {
|
|
|
$$typeof: REACT_PROVIDER_TYPE,
|
|
|
_context: context
|
|
|
};
|
|
|
var hasWarnedAboutUsingNestedContextConsumers = false;
|
|
|
var hasWarnedAboutUsingConsumerProvider = false;
|
|
|
var hasWarnedAboutDisplayNameOnConsumer = false;
|
|
|
|
|
|
{
|
|
|
// A separate object, but proxies back to the original context object for
|
|
|
// backwards compatibility. It has a different $$typeof, so we can properly
|
|
|
// warn for the incorrect usage of Context as a Consumer.
|
|
|
var Consumer = {
|
|
|
$$typeof: REACT_CONTEXT_TYPE,
|
|
|
_context: context
|
|
|
}; // $FlowFixMe: Flow complains about not setting a value, which is intentional here
|
|
|
|
|
|
Object.defineProperties(Consumer, {
|
|
|
Provider: {
|
|
|
get: function () {
|
|
|
if (!hasWarnedAboutUsingConsumerProvider) {
|
|
|
hasWarnedAboutUsingConsumerProvider = true;
|
|
|
|
|
|
error('Rendering <Context.Consumer.Provider> is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Provider> instead?');
|
|
|
}
|
|
|
|
|
|
return context.Provider;
|
|
|
},
|
|
|
set: function (_Provider) {
|
|
|
context.Provider = _Provider;
|
|
|
}
|
|
|
},
|
|
|
_currentValue: {
|
|
|
get: function () {
|
|
|
return context._currentValue;
|
|
|
},
|
|
|
set: function (_currentValue) {
|
|
|
context._currentValue = _currentValue;
|
|
|
}
|
|
|
},
|
|
|
_currentValue2: {
|
|
|
get: function () {
|
|
|
return context._currentValue2;
|
|
|
},
|
|
|
set: function (_currentValue2) {
|
|
|
context._currentValue2 = _currentValue2;
|
|
|
}
|
|
|
},
|
|
|
_threadCount: {
|
|
|
get: function () {
|
|
|
return context._threadCount;
|
|
|
},
|
|
|
set: function (_threadCount) {
|
|
|
context._threadCount = _threadCount;
|
|
|
}
|
|
|
},
|
|
|
Consumer: {
|
|
|
get: function () {
|
|
|
if (!hasWarnedAboutUsingNestedContextConsumers) {
|
|
|
hasWarnedAboutUsingNestedContextConsumers = true;
|
|
|
|
|
|
error('Rendering <Context.Consumer.Consumer> is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?');
|
|
|
}
|
|
|
|
|
|
return context.Consumer;
|
|
|
}
|
|
|
},
|
|
|
displayName: {
|
|
|
get: function () {
|
|
|
return context.displayName;
|
|
|
},
|
|
|
set: function (displayName) {
|
|
|
if (!hasWarnedAboutDisplayNameOnConsumer) {
|
|
|
warn('Setting `displayName` on Context.Consumer has no effect. ' + "You should set it directly on the context with Context.displayName = '%s'.", displayName);
|
|
|
|
|
|
hasWarnedAboutDisplayNameOnConsumer = true;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}); // $FlowFixMe: Flow complains about missing properties because it doesn't understand defineProperty
|
|
|
|
|
|
context.Consumer = Consumer;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
context._currentRenderer = null;
|
|
|
context._currentRenderer2 = null;
|
|
|
}
|
|
|
|
|
|
return context;
|
|
|
}
|
|
|
|
|
|
var Uninitialized = -1;
|
|
|
var Pending = 0;
|
|
|
var Resolved = 1;
|
|
|
var Rejected = 2;
|
|
|
|
|
|
function lazyInitializer(payload) {
|
|
|
if (payload._status === Uninitialized) {
|
|
|
var ctor = payload._result;
|
|
|
var thenable = ctor(); // Transition to the next state.
|
|
|
// This might throw either because it's missing or throws. If so, we treat it
|
|
|
// as still uninitialized and try again next time. Which is the same as what
|
|
|
// happens if the ctor or any wrappers processing the ctor throws. This might
|
|
|
// end up fixing it if the resolution was a concurrency bug.
|
|
|
|
|
|
thenable.then(function (moduleObject) {
|
|
|
if (payload._status === Pending || payload._status === Uninitialized) {
|
|
|
// Transition to the next state.
|
|
|
var resolved = payload;
|
|
|
resolved._status = Resolved;
|
|
|
resolved._result = moduleObject;
|
|
|
}
|
|
|
}, function (error) {
|
|
|
if (payload._status === Pending || payload._status === Uninitialized) {
|
|
|
// Transition to the next state.
|
|
|
var rejected = payload;
|
|
|
rejected._status = Rejected;
|
|
|
rejected._result = error;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
if (payload._status === Uninitialized) {
|
|
|
// In case, we're still uninitialized, then we're waiting for the thenable
|
|
|
// to resolve. Set it as pending in the meantime.
|
|
|
var pending = payload;
|
|
|
pending._status = Pending;
|
|
|
pending._result = thenable;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (payload._status === Resolved) {
|
|
|
var moduleObject = payload._result;
|
|
|
|
|
|
{
|
|
|
if (moduleObject === undefined) {
|
|
|
error('lazy: Expected the result of a dynamic imp' + 'ort() call. ' + 'Instead received: %s\n\nYour code should look like: \n ' + // Break up imports to avoid accidentally parsing them as dependencies.
|
|
|
'const MyComponent = lazy(() => imp' + "ort('./MyComponent'))\n\n" + 'Did you accidentally put curly braces around the import?', moduleObject);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (!('default' in moduleObject)) {
|
|
|
error('lazy: Expected the result of a dynamic imp' + 'ort() call. ' + 'Instead received: %s\n\nYour code should look like: \n ' + // Break up imports to avoid accidentally parsing them as dependencies.
|
|
|
'const MyComponent = lazy(() => imp' + "ort('./MyComponent'))", moduleObject);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return moduleObject.default;
|
|
|
} else {
|
|
|
throw payload._result;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function lazy(ctor) {
|
|
|
var payload = {
|
|
|
// We use these fields to store the result.
|
|
|
_status: Uninitialized,
|
|
|
_result: ctor
|
|
|
};
|
|
|
var lazyType = {
|
|
|
$$typeof: REACT_LAZY_TYPE,
|
|
|
_payload: payload,
|
|
|
_init: lazyInitializer
|
|
|
};
|
|
|
|
|
|
{
|
|
|
// In production, this would just set it on the object.
|
|
|
var defaultProps;
|
|
|
var propTypes; // $FlowFixMe
|
|
|
|
|
|
Object.defineProperties(lazyType, {
|
|
|
defaultProps: {
|
|
|
configurable: true,
|
|
|
get: function () {
|
|
|
return defaultProps;
|
|
|
},
|
|
|
set: function (newDefaultProps) {
|
|
|
error('React.lazy(...): It is not supported to assign `defaultProps` to ' + 'a lazy component import. Either specify them where the component ' + 'is defined, or create a wrapping component around it.');
|
|
|
|
|
|
defaultProps = newDefaultProps; // Match production behavior more closely:
|
|
|
// $FlowFixMe
|
|
|
|
|
|
Object.defineProperty(lazyType, 'defaultProps', {
|
|
|
enumerable: true
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
propTypes: {
|
|
|
configurable: true,
|
|
|
get: function () {
|
|
|
return propTypes;
|
|
|
},
|
|
|
set: function (newPropTypes) {
|
|
|
error('React.lazy(...): It is not supported to assign `propTypes` to ' + 'a lazy component import. Either specify them where the component ' + 'is defined, or create a wrapping component around it.');
|
|
|
|
|
|
propTypes = newPropTypes; // Match production behavior more closely:
|
|
|
// $FlowFixMe
|
|
|
|
|
|
Object.defineProperty(lazyType, 'propTypes', {
|
|
|
enumerable: true
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return lazyType;
|
|
|
}
|
|
|
|
|
|
function forwardRef(render) {
|
|
|
{
|
|
|
if (render != null && render.$$typeof === REACT_MEMO_TYPE) {
|
|
|
error('forwardRef requires a render function but received a `memo` ' + 'component. Instead of forwardRef(memo(...)), use ' + 'memo(forwardRef(...)).');
|
|
|
} else if (typeof render !== 'function') {
|
|
|
error('forwardRef requires a render function but was given %s.', render === null ? 'null' : typeof render);
|
|
|
} else {
|
|
|
if (render.length !== 0 && render.length !== 2) {
|
|
|
error('forwardRef render functions accept exactly two parameters: props and ref. %s', render.length === 1 ? 'Did you forget to use the ref parameter?' : 'Any additional parameter will be undefined.');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (render != null) {
|
|
|
if (render.defaultProps != null || render.propTypes != null) {
|
|
|
error('forwardRef render functions do not support propTypes or defaultProps. ' + 'Did you accidentally pass a React component?');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var elementType = {
|
|
|
$$typeof: REACT_FORWARD_REF_TYPE,
|
|
|
render: render
|
|
|
};
|
|
|
|
|
|
{
|
|
|
var ownName;
|
|
|
Object.defineProperty(elementType, 'displayName', {
|
|
|
enumerable: false,
|
|
|
configurable: true,
|
|
|
get: function () {
|
|
|
return ownName;
|
|
|
},
|
|
|
set: function (name) {
|
|
|
ownName = name; // The inner component shouldn't inherit this display name in most cases,
|
|
|
// because the component may be used elsewhere.
|
|
|
// But it's nice for anonymous functions to inherit the name,
|
|
|
// so that our component-stack generation logic will display their frames.
|
|
|
// An anonymous function generally suggests a pattern like:
|
|
|
// React.forwardRef((props, ref) => {...});
|
|
|
// This kind of inner function is not used elsewhere so the side effect is okay.
|
|
|
|
|
|
if (!render.name && !render.displayName) {
|
|
|
render.displayName = name;
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return elementType;
|
|
|
}
|
|
|
|
|
|
var REACT_MODULE_REFERENCE;
|
|
|
|
|
|
{
|
|
|
REACT_MODULE_REFERENCE = Symbol.for('react.module.reference');
|
|
|
}
|
|
|
|
|
|
function isValidElementType(type) {
|
|
|
if (typeof type === 'string' || typeof type === 'function') {
|
|
|
return true;
|
|
|
} // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill).
|
|
|
|
|
|
|
|
|
if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || enableDebugTracing || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || enableLegacyHidden || type === REACT_OFFSCREEN_TYPE || enableScopeAPI || enableCacheElement || enableTransitionTracing ) {
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'object' && type !== null) {
|
|
|
if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || // This needs to include all possible module reference object
|
|
|
// types supported by any Flight configuration anywhere since
|
|
|
// we don't know which Flight build this will end up being used
|
|
|
// with.
|
|
|
type.$$typeof === REACT_MODULE_REFERENCE || type.getModuleId !== undefined) {
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
function memo(type, compare) {
|
|
|
{
|
|
|
if (!isValidElementType(type)) {
|
|
|
error('memo: The first argument must be a component. Instead ' + 'received: %s', type === null ? 'null' : typeof type);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var elementType = {
|
|
|
$$typeof: REACT_MEMO_TYPE,
|
|
|
type: type,
|
|
|
compare: compare === undefined ? null : compare
|
|
|
};
|
|
|
|
|
|
{
|
|
|
var ownName;
|
|
|
Object.defineProperty(elementType, 'displayName', {
|
|
|
enumerable: false,
|
|
|
configurable: true,
|
|
|
get: function () {
|
|
|
return ownName;
|
|
|
},
|
|
|
set: function (name) {
|
|
|
ownName = name; // The inner component shouldn't inherit this display name in most cases,
|
|
|
// because the component may be used elsewhere.
|
|
|
// But it's nice for anonymous functions to inherit the name,
|
|
|
// so that our component-stack generation logic will display their frames.
|
|
|
// An anonymous function generally suggests a pattern like:
|
|
|
// React.memo((props) => {...});
|
|
|
// This kind of inner function is not used elsewhere so the side effect is okay.
|
|
|
|
|
|
if (!type.name && !type.displayName) {
|
|
|
type.displayName = name;
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return elementType;
|
|
|
}
|
|
|
|
|
|
function resolveDispatcher() {
|
|
|
var dispatcher = ReactCurrentDispatcher.current;
|
|
|
|
|
|
{
|
|
|
if (dispatcher === null) {
|
|
|
error('Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' + ' one of the following reasons:\n' + '1. You might have mismatching versions of React and the renderer (such as React DOM)\n' + '2. You might be breaking the Rules of Hooks\n' + '3. You might have more than one copy of React in the same app\n' + 'See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.');
|
|
|
}
|
|
|
} // Will result in a null access error if accessed outside render phase. We
|
|
|
// intentionally don't throw our own error because this is in a hot path.
|
|
|
// Also helps ensure this is inlined.
|
|
|
|
|
|
|
|
|
return dispatcher;
|
|
|
}
|
|
|
function useContext(Context) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
|
|
|
{
|
|
|
// TODO: add a more generic warning for invalid values.
|
|
|
if (Context._context !== undefined) {
|
|
|
var realContext = Context._context; // Don't deduplicate because this legitimately causes bugs
|
|
|
// and nobody should be using this in existing code.
|
|
|
|
|
|
if (realContext.Consumer === Context) {
|
|
|
error('Calling useContext(Context.Consumer) is not supported, may cause bugs, and will be ' + 'removed in a future major release. Did you mean to call useContext(Context) instead?');
|
|
|
} else if (realContext.Provider === Context) {
|
|
|
error('Calling useContext(Context.Provider) is not supported. ' + 'Did you mean to call useContext(Context) instead?');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return dispatcher.useContext(Context);
|
|
|
}
|
|
|
function useState(initialState) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useState(initialState);
|
|
|
}
|
|
|
function useReducer(reducer, initialArg, init) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useReducer(reducer, initialArg, init);
|
|
|
}
|
|
|
function useRef(initialValue) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useRef(initialValue);
|
|
|
}
|
|
|
function useEffect(create, deps) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useEffect(create, deps);
|
|
|
}
|
|
|
function useInsertionEffect(create, deps) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useInsertionEffect(create, deps);
|
|
|
}
|
|
|
function useLayoutEffect(create, deps) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useLayoutEffect(create, deps);
|
|
|
}
|
|
|
function useCallback(callback, deps) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useCallback(callback, deps);
|
|
|
}
|
|
|
function useMemo(create, deps) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useMemo(create, deps);
|
|
|
}
|
|
|
function useImperativeHandle(ref, create, deps) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useImperativeHandle(ref, create, deps);
|
|
|
}
|
|
|
function useDebugValue(value, formatterFn) {
|
|
|
{
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useDebugValue(value, formatterFn);
|
|
|
}
|
|
|
}
|
|
|
function useTransition() {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useTransition();
|
|
|
}
|
|
|
function useDeferredValue(value) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useDeferredValue(value);
|
|
|
}
|
|
|
function useId() {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useId();
|
|
|
}
|
|
|
function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
|
|
|
var dispatcher = resolveDispatcher();
|
|
|
return dispatcher.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
|
|
|
}
|
|
|
|
|
|
// Helpers to patch console.logs to avoid logging during side-effect free
|
|
|
// replaying on render function. This currently only patches the object
|
|
|
// lazily which won't cover if the log function was extracted eagerly.
|
|
|
// We could also eagerly patch the method.
|
|
|
var disabledDepth = 0;
|
|
|
var prevLog;
|
|
|
var prevInfo;
|
|
|
var prevWarn;
|
|
|
var prevError;
|
|
|
var prevGroup;
|
|
|
var prevGroupCollapsed;
|
|
|
var prevGroupEnd;
|
|
|
|
|
|
function disabledLog() {}
|
|
|
|
|
|
disabledLog.__reactDisabledLog = true;
|
|
|
function disableLogs() {
|
|
|
{
|
|
|
if (disabledDepth === 0) {
|
|
|
/* eslint-disable react-internal/no-production-logging */
|
|
|
prevLog = console.log;
|
|
|
prevInfo = console.info;
|
|
|
prevWarn = console.warn;
|
|
|
prevError = console.error;
|
|
|
prevGroup = console.group;
|
|
|
prevGroupCollapsed = console.groupCollapsed;
|
|
|
prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099
|
|
|
|
|
|
var props = {
|
|
|
configurable: true,
|
|
|
enumerable: true,
|
|
|
value: disabledLog,
|
|
|
writable: true
|
|
|
}; // $FlowFixMe Flow thinks console is immutable.
|
|
|
|
|
|
Object.defineProperties(console, {
|
|
|
info: props,
|
|
|
log: props,
|
|
|
warn: props,
|
|
|
error: props,
|
|
|
group: props,
|
|
|
groupCollapsed: props,
|
|
|
groupEnd: props
|
|
|
});
|
|
|
/* eslint-enable react-internal/no-production-logging */
|
|
|
}
|
|
|
|
|
|
disabledDepth++;
|
|
|
}
|
|
|
}
|
|
|
function reenableLogs() {
|
|
|
{
|
|
|
disabledDepth--;
|
|
|
|
|
|
if (disabledDepth === 0) {
|
|
|
/* eslint-disable react-internal/no-production-logging */
|
|
|
var props = {
|
|
|
configurable: true,
|
|
|
enumerable: true,
|
|
|
writable: true
|
|
|
}; // $FlowFixMe Flow thinks console is immutable.
|
|
|
|
|
|
Object.defineProperties(console, {
|
|
|
log: assign({}, props, {
|
|
|
value: prevLog
|
|
|
}),
|
|
|
info: assign({}, props, {
|
|
|
value: prevInfo
|
|
|
}),
|
|
|
warn: assign({}, props, {
|
|
|
value: prevWarn
|
|
|
}),
|
|
|
error: assign({}, props, {
|
|
|
value: prevError
|
|
|
}),
|
|
|
group: assign({}, props, {
|
|
|
value: prevGroup
|
|
|
}),
|
|
|
groupCollapsed: assign({}, props, {
|
|
|
value: prevGroupCollapsed
|
|
|
}),
|
|
|
groupEnd: assign({}, props, {
|
|
|
value: prevGroupEnd
|
|
|
})
|
|
|
});
|
|
|
/* eslint-enable react-internal/no-production-logging */
|
|
|
}
|
|
|
|
|
|
if (disabledDepth < 0) {
|
|
|
error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var ReactCurrentDispatcher$1 = ReactSharedInternals.ReactCurrentDispatcher;
|
|
|
var prefix;
|
|
|
function describeBuiltInComponentFrame(name, source, ownerFn) {
|
|
|
{
|
|
|
if (prefix === undefined) {
|
|
|
// Extract the VM specific prefix used by each line.
|
|
|
try {
|
|
|
throw Error();
|
|
|
} catch (x) {
|
|
|
var match = x.stack.trim().match(/\n( *(at )?)/);
|
|
|
prefix = match && match[1] || '';
|
|
|
}
|
|
|
} // We use the prefix to ensure our stacks line up with native stack frames.
|
|
|
|
|
|
|
|
|
return '\n' + prefix + name;
|
|
|
}
|
|
|
}
|
|
|
var reentry = false;
|
|
|
var componentFrameCache;
|
|
|
|
|
|
{
|
|
|
var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map;
|
|
|
componentFrameCache = new PossiblyWeakMap();
|
|
|
}
|
|
|
|
|
|
function describeNativeComponentFrame(fn, construct) {
|
|
|
// If something asked for a stack inside a fake render, it should get ignored.
|
|
|
if ( !fn || reentry) {
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
{
|
|
|
var frame = componentFrameCache.get(fn);
|
|
|
|
|
|
if (frame !== undefined) {
|
|
|
return frame;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var control;
|
|
|
reentry = true;
|
|
|
var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined.
|
|
|
|
|
|
Error.prepareStackTrace = undefined;
|
|
|
var previousDispatcher;
|
|
|
|
|
|
{
|
|
|
previousDispatcher = ReactCurrentDispatcher$1.current; // Set the dispatcher in DEV because this might be call in the render function
|
|
|
// for warnings.
|
|
|
|
|
|
ReactCurrentDispatcher$1.current = null;
|
|
|
disableLogs();
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
// This should throw.
|
|
|
if (construct) {
|
|
|
// Something should be setting the props in the constructor.
|
|
|
var Fake = function () {
|
|
|
throw Error();
|
|
|
}; // $FlowFixMe
|
|
|
|
|
|
|
|
|
Object.defineProperty(Fake.prototype, 'props', {
|
|
|
set: function () {
|
|
|
// We use a throwing setter instead of frozen or non-writable props
|
|
|
// because that won't throw in a non-strict mode function.
|
|
|
throw Error();
|
|
|
}
|
|
|
});
|
|
|
|
|
|
if (typeof Reflect === 'object' && Reflect.construct) {
|
|
|
// We construct a different control for this case to include any extra
|
|
|
// frames added by the construct call.
|
|
|
try {
|
|
|
Reflect.construct(Fake, []);
|
|
|
} catch (x) {
|
|
|
control = x;
|
|
|
}
|
|
|
|
|
|
Reflect.construct(fn, [], Fake);
|
|
|
} else {
|
|
|
try {
|
|
|
Fake.call();
|
|
|
} catch (x) {
|
|
|
control = x;
|
|
|
}
|
|
|
|
|
|
fn.call(Fake.prototype);
|
|
|
}
|
|
|
} else {
|
|
|
try {
|
|
|
throw Error();
|
|
|
} catch (x) {
|
|
|
control = x;
|
|
|
}
|
|
|
|
|
|
fn();
|
|
|
}
|
|
|
} catch (sample) {
|
|
|
// This is inlined manually because closure doesn't do it for us.
|
|
|
if (sample && control && typeof sample.stack === 'string') {
|
|
|
// This extracts the first frame from the sample that isn't also in the control.
|
|
|
// Skipping one frame that we assume is the frame that calls the two.
|
|
|
var sampleLines = sample.stack.split('\n');
|
|
|
var controlLines = control.stack.split('\n');
|
|
|
var s = sampleLines.length - 1;
|
|
|
var c = controlLines.length - 1;
|
|
|
|
|
|
while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) {
|
|
|
// We expect at least one stack frame to be shared.
|
|
|
// Typically this will be the root most one. However, stack frames may be
|
|
|
// cut off due to maximum stack limits. In this case, one maybe cut off
|
|
|
// earlier than the other. We assume that the sample is longer or the same
|
|
|
// and there for cut off earlier. So we should find the root most frame in
|
|
|
// the sample somewhere in the control.
|
|
|
c--;
|
|
|
}
|
|
|
|
|
|
for (; s >= 1 && c >= 0; s--, c--) {
|
|
|
// Next we find the first one that isn't the same which should be the
|
|
|
// frame that called our sample function and the control.
|
|
|
if (sampleLines[s] !== controlLines[c]) {
|
|
|
// In V8, the first line is describing the message but other VMs don't.
|
|
|
// If we're about to return the first line, and the control is also on the same
|
|
|
// line, that's a pretty good indicator that our sample threw at same line as
|
|
|
// the control. I.e. before we entered the sample frame. So we ignore this result.
|
|
|
// This can happen if you passed a class to function component, or non-function.
|
|
|
if (s !== 1 || c !== 1) {
|
|
|
do {
|
|
|
s--;
|
|
|
c--; // We may still have similar intermediate frames from the construct call.
|
|
|
// The next one that isn't the same should be our match though.
|
|
|
|
|
|
if (c < 0 || sampleLines[s] !== controlLines[c]) {
|
|
|
// V8 adds a "new" prefix for native classes. Let's remove it to make it prettier.
|
|
|
var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>"
|
|
|
// but we have a user-provided "displayName"
|
|
|
// splice it in to make the stack more readable.
|
|
|
|
|
|
|
|
|
if (fn.displayName && _frame.includes('<anonymous>')) {
|
|
|
_frame = _frame.replace('<anonymous>', fn.displayName);
|
|
|
}
|
|
|
|
|
|
{
|
|
|
if (typeof fn === 'function') {
|
|
|
componentFrameCache.set(fn, _frame);
|
|
|
}
|
|
|
} // Return the line we found.
|
|
|
|
|
|
|
|
|
return _frame;
|
|
|
}
|
|
|
} while (s >= 1 && c >= 0);
|
|
|
}
|
|
|
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
} finally {
|
|
|
reentry = false;
|
|
|
|
|
|
{
|
|
|
ReactCurrentDispatcher$1.current = previousDispatcher;
|
|
|
reenableLogs();
|
|
|
}
|
|
|
|
|
|
Error.prepareStackTrace = previousPrepareStackTrace;
|
|
|
} // Fallback to just using the name if we couldn't make it throw.
|
|
|
|
|
|
|
|
|
var name = fn ? fn.displayName || fn.name : '';
|
|
|
var syntheticFrame = name ? describeBuiltInComponentFrame(name) : '';
|
|
|
|
|
|
{
|
|
|
if (typeof fn === 'function') {
|
|
|
componentFrameCache.set(fn, syntheticFrame);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return syntheticFrame;
|
|
|
}
|
|
|
function describeFunctionComponentFrame(fn, source, ownerFn) {
|
|
|
{
|
|
|
return describeNativeComponentFrame(fn, false);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function shouldConstruct(Component) {
|
|
|
var prototype = Component.prototype;
|
|
|
return !!(prototype && prototype.isReactComponent);
|
|
|
}
|
|
|
|
|
|
function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) {
|
|
|
|
|
|
if (type == null) {
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'function') {
|
|
|
{
|
|
|
return describeNativeComponentFrame(type, shouldConstruct(type));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'string') {
|
|
|
return describeBuiltInComponentFrame(type);
|
|
|
}
|
|
|
|
|
|
switch (type) {
|
|
|
case REACT_SUSPENSE_TYPE:
|
|
|
return describeBuiltInComponentFrame('Suspense');
|
|
|
|
|
|
case REACT_SUSPENSE_LIST_TYPE:
|
|
|
return describeBuiltInComponentFrame('SuspenseList');
|
|
|
}
|
|
|
|
|
|
if (typeof type === 'object') {
|
|
|
switch (type.$$typeof) {
|
|
|
case REACT_FORWARD_REF_TYPE:
|
|
|
return describeFunctionComponentFrame(type.render);
|
|
|
|
|
|
case REACT_MEMO_TYPE:
|
|
|
// Memo may contain any component type so we recursively resolve it.
|
|
|
return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn);
|
|
|
|
|
|
case REACT_LAZY_TYPE:
|
|
|
{
|
|
|
var lazyComponent = type;
|
|
|
var payload = lazyComponent._payload;
|
|
|
var init = lazyComponent._init;
|
|
|
|
|
|
try {
|
|
|
// Lazy may contain any component type so we recursively resolve it.
|
|
|
return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn);
|
|
|
} catch (x) {}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
var loggedTypeFailures = {};
|
|
|
var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame;
|
|
|
|
|
|
function setCurrentlyValidatingElement(element) {
|
|
|
{
|
|
|
if (element) {
|
|
|
var owner = element._owner;
|
|
|
var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
|
|
|
ReactDebugCurrentFrame$1.setExtraStackFrame(stack);
|
|
|
} else {
|
|
|
ReactDebugCurrentFrame$1.setExtraStackFrame(null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
|
|
{
|
|
|
// $FlowFixMe This is okay but Flow doesn't know it.
|
|
|
var has = Function.call.bind(hasOwnProperty);
|
|
|
|
|
|
for (var typeSpecName in typeSpecs) {
|
|
|
if (has(typeSpecs, typeSpecName)) {
|
|
|
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
|
|
// fail the render phase where it didn't fail before. So we log it.
|
|
|
// After these have been cleaned up, we'll let them throw.
|
|
|
|
|
|
try {
|
|
|
// This is intentionally an invariant that gets caught. It's the same
|
|
|
// behavior as without this statement except with a better message.
|
|
|
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
|
|
// eslint-disable-next-line react-internal/prod-error-codes
|
|
|
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
|
|
err.name = 'Invariant Violation';
|
|
|
throw err;
|
|
|
}
|
|
|
|
|
|
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
|
|
} catch (ex) {
|
|
|
error$1 = ex;
|
|
|
}
|
|
|
|
|
|
if (error$1 && !(error$1 instanceof Error)) {
|
|
|
setCurrentlyValidatingElement(element);
|
|
|
|
|
|
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
|
|
|
|
|
setCurrentlyValidatingElement(null);
|
|
|
}
|
|
|
|
|
|
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
|
|
// Only monitor this failure once because there tends to be a lot of the
|
|
|
// same error.
|
|
|
loggedTypeFailures[error$1.message] = true;
|
|
|
setCurrentlyValidatingElement(element);
|
|
|
|
|
|
error('Failed %s type: %s', location, error$1.message);
|
|
|
|
|
|
setCurrentlyValidatingElement(null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function setCurrentlyValidatingElement$1(element) {
|
|
|
{
|
|
|
if (element) {
|
|
|
var owner = element._owner;
|
|
|
var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null);
|
|
|
setExtraStackFrame(stack);
|
|
|
} else {
|
|
|
setExtraStackFrame(null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var propTypesMisspellWarningShown;
|
|
|
|
|
|
{
|
|
|
propTypesMisspellWarningShown = false;
|
|
|
}
|
|
|
|
|
|
function getDeclarationErrorAddendum() {
|
|
|
if (ReactCurrentOwner.current) {
|
|
|
var name = getComponentNameFromType(ReactCurrentOwner.current.type);
|
|
|
|
|
|
if (name) {
|
|
|
return '\n\nCheck the render method of `' + name + '`.';
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
function getSourceInfoErrorAddendum(source) {
|
|
|
if (source !== undefined) {
|
|
|
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
|
|
var lineNumber = source.lineNumber;
|
|
|
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
|
|
|
function getSourceInfoErrorAddendumForProps(elementProps) {
|
|
|
if (elementProps !== null && elementProps !== undefined) {
|
|
|
return getSourceInfoErrorAddendum(elementProps.__source);
|
|
|
}
|
|
|
|
|
|
return '';
|
|
|
}
|
|
|
/**
|
|
|
* Warn if there's no key explicitly set on dynamic arrays of children or
|
|
|
* object keys are not valid. This allows us to keep track of children between
|
|
|
* updates.
|
|
|
*/
|
|
|
|
|
|
|
|
|
var ownerHasKeyUseWarning = {};
|
|
|
|
|
|
function getCurrentComponentErrorInfo(parentType) {
|
|
|
var info = getDeclarationErrorAddendum();
|
|
|
|
|
|
if (!info) {
|
|
|
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
|
|
|
|
|
if (parentName) {
|
|
|
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return info;
|
|
|
}
|
|
|
/**
|
|
|
* Warn if the element doesn't have an explicit key assigned to it.
|
|
|
* This element is in an array. The array could grow and shrink or be
|
|
|
* reordered. All children that haven't already been validated are required to
|
|
|
* have a "key" property assigned to it. Error statuses are cached so a warning
|
|
|
* will only be shown once.
|
|
|
*
|
|
|
* @internal
|
|
|
* @param {ReactElement} element Element that requires a key.
|
|
|
* @param {*} parentType element's parent's type.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function validateExplicitKey(element, parentType) {
|
|
|
if (!element._store || element._store.validated || element.key != null) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
element._store.validated = true;
|
|
|
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
|
|
|
|
|
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
|
|
// property, it may be the creator of the child that's responsible for
|
|
|
// assigning it a key.
|
|
|
|
|
|
var childOwner = '';
|
|
|
|
|
|
if (element && element._owner && element._owner !== ReactCurrentOwner.current) {
|
|
|
// Give the component that originally created this child.
|
|
|
childOwner = " It was passed a child from " + getComponentNameFromType(element._owner.type) + ".";
|
|
|
}
|
|
|
|
|
|
{
|
|
|
setCurrentlyValidatingElement$1(element);
|
|
|
|
|
|
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
|
|
|
|
|
setCurrentlyValidatingElement$1(null);
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Ensure that every element either is passed in a static location, in an
|
|
|
* array with an explicit keys property defined, or in an object literal
|
|
|
* with valid key property.
|
|
|
*
|
|
|
* @internal
|
|
|
* @param {ReactNode} node Statically passed child of any type.
|
|
|
* @param {*} parentType node's parent's type.
|
|
|
*/
|
|
|
|
|
|
|
|
|
function validateChildKeys(node, parentType) {
|
|
|
if (typeof node !== 'object') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (isArray(node)) {
|
|
|
for (var i = 0; i < node.length; i++) {
|
|
|
var child = node[i];
|
|
|
|
|
|
if (isValidElement(child)) {
|
|
|
validateExplicitKey(child, parentType);
|
|
|
}
|
|
|
}
|
|
|
} else if (isValidElement(node)) {
|
|
|
// This element was passed in a valid location.
|
|
|
if (node._store) {
|
|
|
node._store.validated = true;
|
|
|
}
|
|
|
} else if (node) {
|
|
|
var iteratorFn = getIteratorFn(node);
|
|
|
|
|
|
if (typeof iteratorFn === 'function') {
|
|
|
// Entry iterators used to provide implicit keys,
|
|
|
// but now we print a separate warning for them later.
|
|
|
if (iteratorFn !== node.entries) {
|
|
|
var iterator = iteratorFn.call(node);
|
|
|
var step;
|
|
|
|
|
|
while (!(step = iterator.next()).done) {
|
|
|
if (isValidElement(step.value)) {
|
|
|
validateExplicitKey(step.value, parentType);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Given an element, validate that its props follow the propTypes definition,
|
|
|
* provided by the type.
|
|
|
*
|
|
|
* @param {ReactElement} element
|
|
|
*/
|
|
|
|
|
|
|
|
|
function validatePropTypes(element) {
|
|
|
{
|
|
|
var type = element.type;
|
|
|
|
|
|
if (type === null || type === undefined || typeof type === 'string') {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
var propTypes;
|
|
|
|
|
|
if (typeof type === 'function') {
|
|
|
propTypes = type.propTypes;
|
|
|
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
|
|
// Inner props are checked in the reconciler.
|
|
|
type.$$typeof === REACT_MEMO_TYPE)) {
|
|
|
propTypes = type.propTypes;
|
|
|
} else {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (propTypes) {
|
|
|
// Intentionally inside to avoid triggering lazy initializers:
|
|
|
var name = getComponentNameFromType(type);
|
|
|
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
|
|
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
|
|
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
|
|
|
|
|
var _name = getComponentNameFromType(type);
|
|
|
|
|
|
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
|
|
}
|
|
|
|
|
|
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
|
|
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
/**
|
|
|
* Given a fragment, validate that it can only be provided with fragment props
|
|
|
* @param {ReactElement} fragment
|
|
|
*/
|
|
|
|
|
|
|
|
|
function validateFragmentProps(fragment) {
|
|
|
{
|
|
|
var keys = Object.keys(fragment.props);
|
|
|
|
|
|
for (var i = 0; i < keys.length; i++) {
|
|
|
var key = keys[i];
|
|
|
|
|
|
if (key !== 'children' && key !== 'key') {
|
|
|
setCurrentlyValidatingElement$1(fragment);
|
|
|
|
|
|
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
|
|
|
|
|
setCurrentlyValidatingElement$1(null);
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (fragment.ref !== null) {
|
|
|
setCurrentlyValidatingElement$1(fragment);
|
|
|
|
|
|
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
|
|
|
|
|
setCurrentlyValidatingElement$1(null);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
function createElementWithValidation(type, props, children) {
|
|
|
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
|
|
// succeed and there will likely be errors in render.
|
|
|
|
|
|
if (!validType) {
|
|
|
var info = '';
|
|
|
|
|
|
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
|
|
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
|
|
}
|
|
|
|
|
|
var sourceInfo = getSourceInfoErrorAddendumForProps(props);
|
|
|
|
|
|
if (sourceInfo) {
|
|
|
info += sourceInfo;
|
|
|
} else {
|
|
|
info += getDeclarationErrorAddendum();
|
|
|
}
|
|
|
|
|
|
var typeString;
|
|
|
|
|
|
if (type === null) {
|
|
|
typeString = 'null';
|
|
|
} else if (isArray(type)) {
|
|
|
typeString = 'array';
|
|
|
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
|
|
typeString = "<" + (getComponentNameFromType(type.type) || 'Unknown') + " />";
|
|
|
info = ' Did you accidentally export a JSX literal instead of a component?';
|
|
|
} else {
|
|
|
typeString = typeof type;
|
|
|
}
|
|
|
|
|
|
{
|
|
|
error('React.createElement: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var element = createElement.apply(this, arguments); // The result can be nullish if a mock or a custom function is used.
|
|
|
// TODO: Drop this when these are no longer allowed as the type argument.
|
|
|
|
|
|
if (element == null) {
|
|
|
return element;
|
|
|
} // Skip key warning if the type isn't valid since our key validation logic
|
|
|
// doesn't expect a non-string/function type and can throw confusing errors.
|
|
|
// We don't want exception behavior to differ between dev and prod.
|
|
|
// (Rendering will throw with a helpful message and as soon as the type is
|
|
|
// fixed, the key warnings will appear.)
|
|
|
|
|
|
|
|
|
if (validType) {
|
|
|
for (var i = 2; i < arguments.length; i++) {
|
|
|
validateChildKeys(arguments[i], type);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if (type === REACT_FRAGMENT_TYPE) {
|
|
|
validateFragmentProps(element);
|
|
|
} else {
|
|
|
validatePropTypes(element);
|
|
|
}
|
|
|
|
|
|
return element;
|
|
|
}
|
|
|
var didWarnAboutDeprecatedCreateFactory = false;
|
|
|
function createFactoryWithValidation(type) {
|
|
|
var validatedFactory = createElementWithValidation.bind(null, type);
|
|
|
validatedFactory.type = type;
|
|
|
|
|
|
{
|
|
|
if (!didWarnAboutDeprecatedCreateFactory) {
|
|
|
didWarnAboutDeprecatedCreateFactory = true;
|
|
|
|
|
|
warn('React.createFactory() is deprecated and will be removed in ' + 'a future major release. Consider using JSX ' + 'or use React.createElement() directly instead.');
|
|
|
} // Legacy hook: remove it
|
|
|
|
|
|
|
|
|
Object.defineProperty(validatedFactory, 'type', {
|
|
|
enumerable: false,
|
|
|
get: function () {
|
|
|
warn('Factory.type is deprecated. Access the class directly ' + 'before passing it to createFactory.');
|
|
|
|
|
|
Object.defineProperty(this, 'type', {
|
|
|
value: type
|
|
|
});
|
|
|
return type;
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
|
|
|
return validatedFactory;
|
|
|
}
|
|
|
function cloneElementWithValidation(element, props, children) {
|
|
|
var newElement = cloneElement.apply(this, arguments);
|
|
|
|
|
|
for (var i = 2; i < arguments.length; i++) {
|
|
|
validateChildKeys(arguments[i], newElement.type);
|
|
|
}
|
|
|
|
|
|
validatePropTypes(newElement);
|
|
|
return newElement;
|
|
|
}
|
|
|
|
|
|
function startTransition(scope, options) {
|
|
|
var prevTransition = ReactCurrentBatchConfig.transition;
|
|
|
ReactCurrentBatchConfig.transition = {};
|
|
|
var currentTransition = ReactCurrentBatchConfig.transition;
|
|
|
|
|
|
{
|
|
|
ReactCurrentBatchConfig.transition._updatedFibers = new Set();
|
|
|
}
|
|
|
|
|
|
try {
|
|
|
scope();
|
|
|
} finally {
|
|
|
ReactCurrentBatchConfig.transition = prevTransition;
|
|
|
|
|
|
{
|
|
|
if (prevTransition === null && currentTransition._updatedFibers) {
|
|
|
var updatedFibersCount = currentTransition._updatedFibers.size;
|
|
|
|
|
|
if (updatedFibersCount > 10) {
|
|
|
warn('Detected a large number of updates inside startTransition. ' + 'If this is due to a subscription please re-write it to use React provided hooks. ' + 'Otherwise concurrent mode guarantees are off the table.');
|
|
|
}
|
|
|
|
|
|
currentTransition._updatedFibers.clear();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var didWarnAboutMessageChannel = false;
|
|
|
var enqueueTaskImpl = null;
|
|
|
function enqueueTask(task) {
|
|
|
if (enqueueTaskImpl === null) {
|
|
|
try {
|
|
|
// read require off the module object to get around the bundlers.
|
|
|
// we don't want them to detect a require and bundle a Node polyfill.
|
|
|
var requireString = ('require' + Math.random()).slice(0, 7);
|
|
|
var nodeRequire = module && module[requireString]; // assuming we're in node, let's try to get node's
|
|
|
// version of setImmediate, bypassing fake timers if any.
|
|
|
|
|
|
enqueueTaskImpl = nodeRequire.call(module, 'timers').setImmediate;
|
|
|
} catch (_err) {
|
|
|
// we're in a browser
|
|
|
// we can't use regular timers because they may still be faked
|
|
|
// so we try MessageChannel+postMessage instead
|
|
|
enqueueTaskImpl = function (callback) {
|
|
|
{
|
|
|
if (didWarnAboutMessageChannel === false) {
|
|
|
didWarnAboutMessageChannel = true;
|
|
|
|
|
|
if (typeof MessageChannel === 'undefined') {
|
|
|
error('This browser does not have a MessageChannel implementation, ' + 'so enqueuing tasks via await act(async () => ...) will fail. ' + 'Please file an issue at https://github.com/facebook/react/issues ' + 'if you encounter this warning.');
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var channel = new MessageChannel();
|
|
|
channel.port1.onmessage = callback;
|
|
|
channel.port2.postMessage(undefined);
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return enqueueTaskImpl(task);
|
|
|
}
|
|
|
|
|
|
var actScopeDepth = 0;
|
|
|
var didWarnNoAwaitAct = false;
|
|
|
function act(callback) {
|
|
|
{
|
|
|
// `act` calls can be nested, so we track the depth. This represents the
|
|
|
// number of `act` scopes on the stack.
|
|
|
var prevActScopeDepth = actScopeDepth;
|
|
|
actScopeDepth++;
|
|
|
|
|
|
if (ReactCurrentActQueue.current === null) {
|
|
|
// This is the outermost `act` scope. Initialize the queue. The reconciler
|
|
|
// will detect the queue and use it instead of Scheduler.
|
|
|
ReactCurrentActQueue.current = [];
|
|
|
}
|
|
|
|
|
|
var prevIsBatchingLegacy = ReactCurrentActQueue.isBatchingLegacy;
|
|
|
var result;
|
|
|
|
|
|
try {
|
|
|
// Used to reproduce behavior of `batchedUpdates` in legacy mode. Only
|
|
|
// set to `true` while the given callback is executed, not for updates
|
|
|
// triggered during an async event, because this is how the legacy
|
|
|
// implementation of `act` behaved.
|
|
|
ReactCurrentActQueue.isBatchingLegacy = true;
|
|
|
result = callback(); // Replicate behavior of original `act` implementation in legacy mode,
|
|
|
// which flushed updates immediately after the scope function exits, even
|
|
|
// if it's an async function.
|
|
|
|
|
|
if (!prevIsBatchingLegacy && ReactCurrentActQueue.didScheduleLegacyUpdate) {
|
|
|
var queue = ReactCurrentActQueue.current;
|
|
|
|
|
|
if (queue !== null) {
|
|
|
ReactCurrentActQueue.didScheduleLegacyUpdate = false;
|
|
|
flushActQueue(queue);
|
|
|
}
|
|
|
}
|
|
|
} catch (error) {
|
|
|
popActScope(prevActScopeDepth);
|
|
|
throw error;
|
|
|
} finally {
|
|
|
ReactCurrentActQueue.isBatchingLegacy = prevIsBatchingLegacy;
|
|
|
}
|
|
|
|
|
|
if (result !== null && typeof result === 'object' && typeof result.then === 'function') {
|
|
|
var thenableResult = result; // The callback is an async function (i.e. returned a promise). Wait
|
|
|
// for it to resolve before exiting the current scope.
|
|
|
|
|
|
var wasAwaited = false;
|
|
|
var thenable = {
|
|
|
then: function (resolve, reject) {
|
|
|
wasAwaited = true;
|
|
|
thenableResult.then(function (returnValue) {
|
|
|
popActScope(prevActScopeDepth);
|
|
|
|
|
|
if (actScopeDepth === 0) {
|
|
|
// We've exited the outermost act scope. Recursively flush the
|
|
|
// queue until there's no remaining work.
|
|
|
recursivelyFlushAsyncActWork(returnValue, resolve, reject);
|
|
|
} else {
|
|
|
resolve(returnValue);
|
|
|
}
|
|
|
}, function (error) {
|
|
|
// The callback threw an error.
|
|
|
popActScope(prevActScopeDepth);
|
|
|
reject(error);
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
|
|
|
{
|
|
|
if (!didWarnNoAwaitAct && typeof Promise !== 'undefined') {
|
|
|
// eslint-disable-next-line no-undef
|
|
|
Promise.resolve().then(function () {}).then(function () {
|
|
|
if (!wasAwaited) {
|
|
|
didWarnNoAwaitAct = true;
|
|
|
|
|
|
error('You called act(async () => ...) without await. ' + 'This could lead to unexpected testing behaviour, ' + 'interleaving multiple act calls and mixing their ' + 'scopes. ' + 'You should - await act(async () => ...);');
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return thenable;
|
|
|
} else {
|
|
|
var returnValue = result; // The callback is not an async function. Exit the current scope
|
|
|
// immediately, without awaiting.
|
|
|
|
|
|
popActScope(prevActScopeDepth);
|
|
|
|
|
|
if (actScopeDepth === 0) {
|
|
|
// Exiting the outermost act scope. Flush the queue.
|
|
|
var _queue = ReactCurrentActQueue.current;
|
|
|
|
|
|
if (_queue !== null) {
|
|
|
flushActQueue(_queue);
|
|
|
ReactCurrentActQueue.current = null;
|
|
|
} // Return a thenable. If the user awaits it, we'll flush again in
|
|
|
// case additional work was scheduled by a microtask.
|
|
|
|
|
|
|
|
|
var _thenable = {
|
|
|
then: function (resolve, reject) {
|
|
|
// Confirm we haven't re-entered another `act` scope, in case
|
|
|
// the user does something weird like await the thenable
|
|
|
// multiple times.
|
|
|
if (ReactCurrentActQueue.current === null) {
|
|
|
// Recursively flush the queue until there's no remaining work.
|
|
|
ReactCurrentActQueue.current = [];
|
|
|
recursivelyFlushAsyncActWork(returnValue, resolve, reject);
|
|
|
} else {
|
|
|
resolve(returnValue);
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
return _thenable;
|
|
|
} else {
|
|
|
// Since we're inside a nested `act` scope, the returned thenable
|
|
|
// immediately resolves. The outer scope will flush the queue.
|
|
|
var _thenable2 = {
|
|
|
then: function (resolve, reject) {
|
|
|
resolve(returnValue);
|
|
|
}
|
|
|
};
|
|
|
return _thenable2;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function popActScope(prevActScopeDepth) {
|
|
|
{
|
|
|
if (prevActScopeDepth !== actScopeDepth - 1) {
|
|
|
error('You seem to have overlapping act() calls, this is not supported. ' + 'Be sure to await previous act() calls before making a new one. ');
|
|
|
}
|
|
|
|
|
|
actScopeDepth = prevActScopeDepth;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function recursivelyFlushAsyncActWork(returnValue, resolve, reject) {
|
|
|
{
|
|
|
var queue = ReactCurrentActQueue.current;
|
|
|
|
|
|
if (queue !== null) {
|
|
|
try {
|
|
|
flushActQueue(queue);
|
|
|
enqueueTask(function () {
|
|
|
if (queue.length === 0) {
|
|
|
// No additional work was scheduled. Finish.
|
|
|
ReactCurrentActQueue.current = null;
|
|
|
resolve(returnValue);
|
|
|
} else {
|
|
|
// Keep flushing work until there's none left.
|
|
|
recursivelyFlushAsyncActWork(returnValue, resolve, reject);
|
|
|
}
|
|
|
});
|
|
|
} catch (error) {
|
|
|
reject(error);
|
|
|
}
|
|
|
} else {
|
|
|
resolve(returnValue);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var isFlushing = false;
|
|
|
|
|
|
function flushActQueue(queue) {
|
|
|
{
|
|
|
if (!isFlushing) {
|
|
|
// Prevent re-entrance.
|
|
|
isFlushing = true;
|
|
|
var i = 0;
|
|
|
|
|
|
try {
|
|
|
for (; i < queue.length; i++) {
|
|
|
var callback = queue[i];
|
|
|
|
|
|
do {
|
|
|
callback = callback(true);
|
|
|
} while (callback !== null);
|
|
|
}
|
|
|
|
|
|
queue.length = 0;
|
|
|
} catch (error) {
|
|
|
// If something throws, leave the remaining callbacks on the queue.
|
|
|
queue = queue.slice(i + 1);
|
|
|
throw error;
|
|
|
} finally {
|
|
|
isFlushing = false;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var createElement$1 = createElementWithValidation ;
|
|
|
var cloneElement$1 = cloneElementWithValidation ;
|
|
|
var createFactory = createFactoryWithValidation ;
|
|
|
var Children = {
|
|
|
map: mapChildren,
|
|
|
forEach: forEachChildren,
|
|
|
count: countChildren,
|
|
|
toArray: toArray,
|
|
|
only: onlyChild
|
|
|
};
|
|
|
|
|
|
exports.Children = Children;
|
|
|
exports.Component = Component;
|
|
|
exports.Fragment = REACT_FRAGMENT_TYPE;
|
|
|
exports.Profiler = REACT_PROFILER_TYPE;
|
|
|
exports.PureComponent = PureComponent;
|
|
|
exports.StrictMode = REACT_STRICT_MODE_TYPE;
|
|
|
exports.Suspense = REACT_SUSPENSE_TYPE;
|
|
|
exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = ReactSharedInternals;
|
|
|
exports.cloneElement = cloneElement$1;
|
|
|
exports.createContext = createContext;
|
|
|
exports.createElement = createElement$1;
|
|
|
exports.createFactory = createFactory;
|
|
|
exports.createRef = createRef;
|
|
|
exports.forwardRef = forwardRef;
|
|
|
exports.isValidElement = isValidElement;
|
|
|
exports.lazy = lazy;
|
|
|
exports.memo = memo;
|
|
|
exports.startTransition = startTransition;
|
|
|
exports.unstable_act = act;
|
|
|
exports.useCallback = useCallback;
|
|
|
exports.useContext = useContext;
|
|
|
exports.useDebugValue = useDebugValue;
|
|
|
exports.useDeferredValue = useDeferredValue;
|
|
|
exports.useEffect = useEffect;
|
|
|
exports.useId = useId;
|
|
|
exports.useImperativeHandle = useImperativeHandle;
|
|
|
exports.useInsertionEffect = useInsertionEffect;
|
|
|
exports.useLayoutEffect = useLayoutEffect;
|
|
|
exports.useMemo = useMemo;
|
|
|
exports.useReducer = useReducer;
|
|
|
exports.useRef = useRef;
|
|
|
exports.useState = useState;
|
|
|
exports.useSyncExternalStore = useSyncExternalStore;
|
|
|
exports.useTransition = useTransition;
|
|
|
exports.version = ReactVersion;
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop ===
|
|
|
'function'
|
|
|
) {
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error());
|
|
|
}
|
|
|
|
|
|
})();
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/react/index.js":
|
|
|
/*!*************************************!*\
|
|
|
!*** ./node_modules/react/index.js ***!
|
|
|
\*************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
if (false) {} else {
|
|
|
module.exports = __webpack_require__(/*! ./cjs/react.development.js */ "./node_modules/react/cjs/react.development.js");
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/scheduler/cjs/scheduler.development.js":
|
|
|
/*!*************************************************************!*\
|
|
|
!*** ./node_modules/scheduler/cjs/scheduler.development.js ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack_module, exports) => {
|
|
|
|
|
|
"use strict";
|
|
|
/**
|
|
|
* @license React
|
|
|
* scheduler.development.js
|
|
|
*
|
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
|
*
|
|
|
* This source code is licensed under the MIT license found in the
|
|
|
* LICENSE file in the root directory of this source tree.
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
if (true) {
|
|
|
(function() {
|
|
|
|
|
|
'use strict';
|
|
|
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart ===
|
|
|
'function'
|
|
|
) {
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
|
|
|
}
|
|
|
var enableSchedulerDebugging = false;
|
|
|
var enableProfiling = false;
|
|
|
var frameYieldMs = 5;
|
|
|
|
|
|
function push(heap, node) {
|
|
|
var index = heap.length;
|
|
|
heap.push(node);
|
|
|
siftUp(heap, node, index);
|
|
|
}
|
|
|
function peek(heap) {
|
|
|
return heap.length === 0 ? null : heap[0];
|
|
|
}
|
|
|
function pop(heap) {
|
|
|
if (heap.length === 0) {
|
|
|
return null;
|
|
|
}
|
|
|
|
|
|
var first = heap[0];
|
|
|
var last = heap.pop();
|
|
|
|
|
|
if (last !== first) {
|
|
|
heap[0] = last;
|
|
|
siftDown(heap, last, 0);
|
|
|
}
|
|
|
|
|
|
return first;
|
|
|
}
|
|
|
|
|
|
function siftUp(heap, node, i) {
|
|
|
var index = i;
|
|
|
|
|
|
while (index > 0) {
|
|
|
var parentIndex = index - 1 >>> 1;
|
|
|
var parent = heap[parentIndex];
|
|
|
|
|
|
if (compare(parent, node) > 0) {
|
|
|
// The parent is larger. Swap positions.
|
|
|
heap[parentIndex] = node;
|
|
|
heap[index] = parent;
|
|
|
index = parentIndex;
|
|
|
} else {
|
|
|
// The parent is smaller. Exit.
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function siftDown(heap, node, i) {
|
|
|
var index = i;
|
|
|
var length = heap.length;
|
|
|
var halfLength = length >>> 1;
|
|
|
|
|
|
while (index < halfLength) {
|
|
|
var leftIndex = (index + 1) * 2 - 1;
|
|
|
var left = heap[leftIndex];
|
|
|
var rightIndex = leftIndex + 1;
|
|
|
var right = heap[rightIndex]; // If the left or right node is smaller, swap with the smaller of those.
|
|
|
|
|
|
if (compare(left, node) < 0) {
|
|
|
if (rightIndex < length && compare(right, left) < 0) {
|
|
|
heap[index] = right;
|
|
|
heap[rightIndex] = node;
|
|
|
index = rightIndex;
|
|
|
} else {
|
|
|
heap[index] = left;
|
|
|
heap[leftIndex] = node;
|
|
|
index = leftIndex;
|
|
|
}
|
|
|
} else if (rightIndex < length && compare(right, node) < 0) {
|
|
|
heap[index] = right;
|
|
|
heap[rightIndex] = node;
|
|
|
index = rightIndex;
|
|
|
} else {
|
|
|
// Neither child is smaller. Exit.
|
|
|
return;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function compare(a, b) {
|
|
|
// Compare sort index first, then task id.
|
|
|
var diff = a.sortIndex - b.sortIndex;
|
|
|
return diff !== 0 ? diff : a.id - b.id;
|
|
|
}
|
|
|
|
|
|
// TODO: Use symbols?
|
|
|
var ImmediatePriority = 1;
|
|
|
var UserBlockingPriority = 2;
|
|
|
var NormalPriority = 3;
|
|
|
var LowPriority = 4;
|
|
|
var IdlePriority = 5;
|
|
|
|
|
|
function markTaskErrored(task, ms) {
|
|
|
}
|
|
|
|
|
|
/* eslint-disable no-var */
|
|
|
|
|
|
var hasPerformanceNow = typeof performance === 'object' && typeof performance.now === 'function';
|
|
|
|
|
|
if (hasPerformanceNow) {
|
|
|
var localPerformance = performance;
|
|
|
|
|
|
exports.unstable_now = function () {
|
|
|
return localPerformance.now();
|
|
|
};
|
|
|
} else {
|
|
|
var localDate = Date;
|
|
|
var initialTime = localDate.now();
|
|
|
|
|
|
exports.unstable_now = function () {
|
|
|
return localDate.now() - initialTime;
|
|
|
};
|
|
|
} // Max 31 bit integer. The max integer size in V8 for 32-bit systems.
|
|
|
// Math.pow(2, 30) - 1
|
|
|
// 0b111111111111111111111111111111
|
|
|
|
|
|
|
|
|
var maxSigned31BitInt = 1073741823; // Times out immediately
|
|
|
|
|
|
var IMMEDIATE_PRIORITY_TIMEOUT = -1; // Eventually times out
|
|
|
|
|
|
var USER_BLOCKING_PRIORITY_TIMEOUT = 250;
|
|
|
var NORMAL_PRIORITY_TIMEOUT = 5000;
|
|
|
var LOW_PRIORITY_TIMEOUT = 10000; // Never times out
|
|
|
|
|
|
var IDLE_PRIORITY_TIMEOUT = maxSigned31BitInt; // Tasks are stored on a min heap
|
|
|
|
|
|
var taskQueue = [];
|
|
|
var timerQueue = []; // Incrementing id counter. Used to maintain insertion order.
|
|
|
|
|
|
var taskIdCounter = 1; // Pausing the scheduler is useful for debugging.
|
|
|
var currentTask = null;
|
|
|
var currentPriorityLevel = NormalPriority; // This is set while performing work, to prevent re-entrance.
|
|
|
|
|
|
var isPerformingWork = false;
|
|
|
var isHostCallbackScheduled = false;
|
|
|
var isHostTimeoutScheduled = false; // Capture local references to native APIs, in case a polyfill overrides them.
|
|
|
|
|
|
var localSetTimeout = typeof setTimeout === 'function' ? setTimeout : null;
|
|
|
var localClearTimeout = typeof clearTimeout === 'function' ? clearTimeout : null;
|
|
|
var localSetImmediate = typeof setImmediate !== 'undefined' ? setImmediate : null; // IE and Node.js + jsdom
|
|
|
|
|
|
var isInputPending = typeof navigator !== 'undefined' && navigator.scheduling !== undefined && navigator.scheduling.isInputPending !== undefined ? navigator.scheduling.isInputPending.bind(navigator.scheduling) : null;
|
|
|
|
|
|
function advanceTimers(currentTime) {
|
|
|
// Check for tasks that are no longer delayed and add them to the queue.
|
|
|
var timer = peek(timerQueue);
|
|
|
|
|
|
while (timer !== null) {
|
|
|
if (timer.callback === null) {
|
|
|
// Timer was cancelled.
|
|
|
pop(timerQueue);
|
|
|
} else if (timer.startTime <= currentTime) {
|
|
|
// Timer fired. Transfer to the task queue.
|
|
|
pop(timerQueue);
|
|
|
timer.sortIndex = timer.expirationTime;
|
|
|
push(taskQueue, timer);
|
|
|
} else {
|
|
|
// Remaining timers are pending.
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
timer = peek(timerQueue);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function handleTimeout(currentTime) {
|
|
|
isHostTimeoutScheduled = false;
|
|
|
advanceTimers(currentTime);
|
|
|
|
|
|
if (!isHostCallbackScheduled) {
|
|
|
if (peek(taskQueue) !== null) {
|
|
|
isHostCallbackScheduled = true;
|
|
|
requestHostCallback(flushWork);
|
|
|
} else {
|
|
|
var firstTimer = peek(timerQueue);
|
|
|
|
|
|
if (firstTimer !== null) {
|
|
|
requestHostTimeout(handleTimeout, firstTimer.startTime - currentTime);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function flushWork(hasTimeRemaining, initialTime) {
|
|
|
|
|
|
|
|
|
isHostCallbackScheduled = false;
|
|
|
|
|
|
if (isHostTimeoutScheduled) {
|
|
|
// We scheduled a timeout but it's no longer needed. Cancel it.
|
|
|
isHostTimeoutScheduled = false;
|
|
|
cancelHostTimeout();
|
|
|
}
|
|
|
|
|
|
isPerformingWork = true;
|
|
|
var previousPriorityLevel = currentPriorityLevel;
|
|
|
|
|
|
try {
|
|
|
if (enableProfiling) {
|
|
|
try {
|
|
|
return workLoop(hasTimeRemaining, initialTime);
|
|
|
} catch (error) {
|
|
|
if (currentTask !== null) {
|
|
|
var currentTime = exports.unstable_now();
|
|
|
markTaskErrored(currentTask, currentTime);
|
|
|
currentTask.isQueued = false;
|
|
|
}
|
|
|
|
|
|
throw error;
|
|
|
}
|
|
|
} else {
|
|
|
// No catch in prod code path.
|
|
|
return workLoop(hasTimeRemaining, initialTime);
|
|
|
}
|
|
|
} finally {
|
|
|
currentTask = null;
|
|
|
currentPriorityLevel = previousPriorityLevel;
|
|
|
isPerformingWork = false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function workLoop(hasTimeRemaining, initialTime) {
|
|
|
var currentTime = initialTime;
|
|
|
advanceTimers(currentTime);
|
|
|
currentTask = peek(taskQueue);
|
|
|
|
|
|
while (currentTask !== null && !(enableSchedulerDebugging )) {
|
|
|
if (currentTask.expirationTime > currentTime && (!hasTimeRemaining || shouldYieldToHost())) {
|
|
|
// This currentTask hasn't expired, and we've reached the deadline.
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var callback = currentTask.callback;
|
|
|
|
|
|
if (typeof callback === 'function') {
|
|
|
currentTask.callback = null;
|
|
|
currentPriorityLevel = currentTask.priorityLevel;
|
|
|
var didUserCallbackTimeout = currentTask.expirationTime <= currentTime;
|
|
|
|
|
|
var continuationCallback = callback(didUserCallbackTimeout);
|
|
|
currentTime = exports.unstable_now();
|
|
|
|
|
|
if (typeof continuationCallback === 'function') {
|
|
|
currentTask.callback = continuationCallback;
|
|
|
} else {
|
|
|
|
|
|
if (currentTask === peek(taskQueue)) {
|
|
|
pop(taskQueue);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
advanceTimers(currentTime);
|
|
|
} else {
|
|
|
pop(taskQueue);
|
|
|
}
|
|
|
|
|
|
currentTask = peek(taskQueue);
|
|
|
} // Return whether there's additional work
|
|
|
|
|
|
|
|
|
if (currentTask !== null) {
|
|
|
return true;
|
|
|
} else {
|
|
|
var firstTimer = peek(timerQueue);
|
|
|
|
|
|
if (firstTimer !== null) {
|
|
|
requestHostTimeout(handleTimeout, firstTimer.startTime - currentTime);
|
|
|
}
|
|
|
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function unstable_runWithPriority(priorityLevel, eventHandler) {
|
|
|
switch (priorityLevel) {
|
|
|
case ImmediatePriority:
|
|
|
case UserBlockingPriority:
|
|
|
case NormalPriority:
|
|
|
case LowPriority:
|
|
|
case IdlePriority:
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
priorityLevel = NormalPriority;
|
|
|
}
|
|
|
|
|
|
var previousPriorityLevel = currentPriorityLevel;
|
|
|
currentPriorityLevel = priorityLevel;
|
|
|
|
|
|
try {
|
|
|
return eventHandler();
|
|
|
} finally {
|
|
|
currentPriorityLevel = previousPriorityLevel;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function unstable_next(eventHandler) {
|
|
|
var priorityLevel;
|
|
|
|
|
|
switch (currentPriorityLevel) {
|
|
|
case ImmediatePriority:
|
|
|
case UserBlockingPriority:
|
|
|
case NormalPriority:
|
|
|
// Shift down to normal priority
|
|
|
priorityLevel = NormalPriority;
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
// Anything lower than normal priority should remain at the current level.
|
|
|
priorityLevel = currentPriorityLevel;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var previousPriorityLevel = currentPriorityLevel;
|
|
|
currentPriorityLevel = priorityLevel;
|
|
|
|
|
|
try {
|
|
|
return eventHandler();
|
|
|
} finally {
|
|
|
currentPriorityLevel = previousPriorityLevel;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function unstable_wrapCallback(callback) {
|
|
|
var parentPriorityLevel = currentPriorityLevel;
|
|
|
return function () {
|
|
|
// This is a fork of runWithPriority, inlined for performance.
|
|
|
var previousPriorityLevel = currentPriorityLevel;
|
|
|
currentPriorityLevel = parentPriorityLevel;
|
|
|
|
|
|
try {
|
|
|
return callback.apply(this, arguments);
|
|
|
} finally {
|
|
|
currentPriorityLevel = previousPriorityLevel;
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function unstable_scheduleCallback(priorityLevel, callback, options) {
|
|
|
var currentTime = exports.unstable_now();
|
|
|
var startTime;
|
|
|
|
|
|
if (typeof options === 'object' && options !== null) {
|
|
|
var delay = options.delay;
|
|
|
|
|
|
if (typeof delay === 'number' && delay > 0) {
|
|
|
startTime = currentTime + delay;
|
|
|
} else {
|
|
|
startTime = currentTime;
|
|
|
}
|
|
|
} else {
|
|
|
startTime = currentTime;
|
|
|
}
|
|
|
|
|
|
var timeout;
|
|
|
|
|
|
switch (priorityLevel) {
|
|
|
case ImmediatePriority:
|
|
|
timeout = IMMEDIATE_PRIORITY_TIMEOUT;
|
|
|
break;
|
|
|
|
|
|
case UserBlockingPriority:
|
|
|
timeout = USER_BLOCKING_PRIORITY_TIMEOUT;
|
|
|
break;
|
|
|
|
|
|
case IdlePriority:
|
|
|
timeout = IDLE_PRIORITY_TIMEOUT;
|
|
|
break;
|
|
|
|
|
|
case LowPriority:
|
|
|
timeout = LOW_PRIORITY_TIMEOUT;
|
|
|
break;
|
|
|
|
|
|
case NormalPriority:
|
|
|
default:
|
|
|
timeout = NORMAL_PRIORITY_TIMEOUT;
|
|
|
break;
|
|
|
}
|
|
|
|
|
|
var expirationTime = startTime + timeout;
|
|
|
var newTask = {
|
|
|
id: taskIdCounter++,
|
|
|
callback: callback,
|
|
|
priorityLevel: priorityLevel,
|
|
|
startTime: startTime,
|
|
|
expirationTime: expirationTime,
|
|
|
sortIndex: -1
|
|
|
};
|
|
|
|
|
|
if (startTime > currentTime) {
|
|
|
// This is a delayed task.
|
|
|
newTask.sortIndex = startTime;
|
|
|
push(timerQueue, newTask);
|
|
|
|
|
|
if (peek(taskQueue) === null && newTask === peek(timerQueue)) {
|
|
|
// All tasks are delayed, and this is the task with the earliest delay.
|
|
|
if (isHostTimeoutScheduled) {
|
|
|
// Cancel an existing timeout.
|
|
|
cancelHostTimeout();
|
|
|
} else {
|
|
|
isHostTimeoutScheduled = true;
|
|
|
} // Schedule a timeout.
|
|
|
|
|
|
|
|
|
requestHostTimeout(handleTimeout, startTime - currentTime);
|
|
|
}
|
|
|
} else {
|
|
|
newTask.sortIndex = expirationTime;
|
|
|
push(taskQueue, newTask);
|
|
|
// wait until the next time we yield.
|
|
|
|
|
|
|
|
|
if (!isHostCallbackScheduled && !isPerformingWork) {
|
|
|
isHostCallbackScheduled = true;
|
|
|
requestHostCallback(flushWork);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return newTask;
|
|
|
}
|
|
|
|
|
|
function unstable_pauseExecution() {
|
|
|
}
|
|
|
|
|
|
function unstable_continueExecution() {
|
|
|
|
|
|
if (!isHostCallbackScheduled && !isPerformingWork) {
|
|
|
isHostCallbackScheduled = true;
|
|
|
requestHostCallback(flushWork);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function unstable_getFirstCallbackNode() {
|
|
|
return peek(taskQueue);
|
|
|
}
|
|
|
|
|
|
function unstable_cancelCallback(task) {
|
|
|
// remove from the queue because you can't remove arbitrary nodes from an
|
|
|
// array based heap, only the first one.)
|
|
|
|
|
|
|
|
|
task.callback = null;
|
|
|
}
|
|
|
|
|
|
function unstable_getCurrentPriorityLevel() {
|
|
|
return currentPriorityLevel;
|
|
|
}
|
|
|
|
|
|
var isMessageLoopRunning = false;
|
|
|
var scheduledHostCallback = null;
|
|
|
var taskTimeoutID = -1; // Scheduler periodically yields in case there is other work on the main
|
|
|
// thread, like user events. By default, it yields multiple times per frame.
|
|
|
// It does not attempt to align with frame boundaries, since most tasks don't
|
|
|
// need to be frame aligned; for those that do, use requestAnimationFrame.
|
|
|
|
|
|
var frameInterval = frameYieldMs;
|
|
|
var startTime = -1;
|
|
|
|
|
|
function shouldYieldToHost() {
|
|
|
var timeElapsed = exports.unstable_now() - startTime;
|
|
|
|
|
|
if (timeElapsed < frameInterval) {
|
|
|
// The main thread has only been blocked for a really short amount of time;
|
|
|
// smaller than a single frame. Don't yield yet.
|
|
|
return false;
|
|
|
} // The main thread has been blocked for a non-negligible amount of time. We
|
|
|
|
|
|
|
|
|
return true;
|
|
|
}
|
|
|
|
|
|
function requestPaint() {
|
|
|
|
|
|
}
|
|
|
|
|
|
function forceFrameRate(fps) {
|
|
|
if (fps < 0 || fps > 125) {
|
|
|
// Using console['error'] to evade Babel and ESLint
|
|
|
console['error']('forceFrameRate takes a positive int between 0 and 125, ' + 'forcing frame rates higher than 125 fps is not supported');
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
if (fps > 0) {
|
|
|
frameInterval = Math.floor(1000 / fps);
|
|
|
} else {
|
|
|
// reset the framerate
|
|
|
frameInterval = frameYieldMs;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var performWorkUntilDeadline = function () {
|
|
|
if (scheduledHostCallback !== null) {
|
|
|
var currentTime = exports.unstable_now(); // Keep track of the start time so we can measure how long the main thread
|
|
|
// has been blocked.
|
|
|
|
|
|
startTime = currentTime;
|
|
|
var hasTimeRemaining = true; // If a scheduler task throws, exit the current browser task so the
|
|
|
// error can be observed.
|
|
|
//
|
|
|
// Intentionally not using a try-catch, since that makes some debugging
|
|
|
// techniques harder. Instead, if `scheduledHostCallback` errors, then
|
|
|
// `hasMoreWork` will remain true, and we'll continue the work loop.
|
|
|
|
|
|
var hasMoreWork = true;
|
|
|
|
|
|
try {
|
|
|
hasMoreWork = scheduledHostCallback(hasTimeRemaining, currentTime);
|
|
|
} finally {
|
|
|
if (hasMoreWork) {
|
|
|
// If there's more work, schedule the next message event at the end
|
|
|
// of the preceding one.
|
|
|
schedulePerformWorkUntilDeadline();
|
|
|
} else {
|
|
|
isMessageLoopRunning = false;
|
|
|
scheduledHostCallback = null;
|
|
|
}
|
|
|
}
|
|
|
} else {
|
|
|
isMessageLoopRunning = false;
|
|
|
} // Yielding to the browser will give it a chance to paint, so we can
|
|
|
};
|
|
|
|
|
|
var schedulePerformWorkUntilDeadline;
|
|
|
|
|
|
if (typeof localSetImmediate === 'function') {
|
|
|
// Node.js and old IE.
|
|
|
// There's a few reasons for why we prefer setImmediate.
|
|
|
//
|
|
|
// Unlike MessageChannel, it doesn't prevent a Node.js process from exiting.
|
|
|
// (Even though this is a DOM fork of the Scheduler, you could get here
|
|
|
// with a mix of Node.js 15+, which has a MessageChannel, and jsdom.)
|
|
|
// https://github.com/facebook/react/issues/20756
|
|
|
//
|
|
|
// But also, it runs earlier which is the semantic we want.
|
|
|
// If other browsers ever implement it, it's better to use it.
|
|
|
// Although both of these would be inferior to native scheduling.
|
|
|
schedulePerformWorkUntilDeadline = function () {
|
|
|
localSetImmediate(performWorkUntilDeadline);
|
|
|
};
|
|
|
} else if (typeof MessageChannel !== 'undefined') {
|
|
|
// DOM and Worker environments.
|
|
|
// We prefer MessageChannel because of the 4ms setTimeout clamping.
|
|
|
var channel = new MessageChannel();
|
|
|
var port = channel.port2;
|
|
|
channel.port1.onmessage = performWorkUntilDeadline;
|
|
|
|
|
|
schedulePerformWorkUntilDeadline = function () {
|
|
|
port.postMessage(null);
|
|
|
};
|
|
|
} else {
|
|
|
// We should only fallback here in non-browser environments.
|
|
|
schedulePerformWorkUntilDeadline = function () {
|
|
|
localSetTimeout(performWorkUntilDeadline, 0);
|
|
|
};
|
|
|
}
|
|
|
|
|
|
function requestHostCallback(callback) {
|
|
|
scheduledHostCallback = callback;
|
|
|
|
|
|
if (!isMessageLoopRunning) {
|
|
|
isMessageLoopRunning = true;
|
|
|
schedulePerformWorkUntilDeadline();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
function requestHostTimeout(callback, ms) {
|
|
|
taskTimeoutID = localSetTimeout(function () {
|
|
|
callback(exports.unstable_now());
|
|
|
}, ms);
|
|
|
}
|
|
|
|
|
|
function cancelHostTimeout() {
|
|
|
localClearTimeout(taskTimeoutID);
|
|
|
taskTimeoutID = -1;
|
|
|
}
|
|
|
|
|
|
var unstable_requestPaint = requestPaint;
|
|
|
var unstable_Profiling = null;
|
|
|
|
|
|
exports.unstable_IdlePriority = IdlePriority;
|
|
|
exports.unstable_ImmediatePriority = ImmediatePriority;
|
|
|
exports.unstable_LowPriority = LowPriority;
|
|
|
exports.unstable_NormalPriority = NormalPriority;
|
|
|
exports.unstable_Profiling = unstable_Profiling;
|
|
|
exports.unstable_UserBlockingPriority = UserBlockingPriority;
|
|
|
exports.unstable_cancelCallback = unstable_cancelCallback;
|
|
|
exports.unstable_continueExecution = unstable_continueExecution;
|
|
|
exports.unstable_forceFrameRate = forceFrameRate;
|
|
|
exports.unstable_getCurrentPriorityLevel = unstable_getCurrentPriorityLevel;
|
|
|
exports.unstable_getFirstCallbackNode = unstable_getFirstCallbackNode;
|
|
|
exports.unstable_next = unstable_next;
|
|
|
exports.unstable_pauseExecution = unstable_pauseExecution;
|
|
|
exports.unstable_requestPaint = unstable_requestPaint;
|
|
|
exports.unstable_runWithPriority = unstable_runWithPriority;
|
|
|
exports.unstable_scheduleCallback = unstable_scheduleCallback;
|
|
|
exports.unstable_shouldYield = shouldYieldToHost;
|
|
|
exports.unstable_wrapCallback = unstable_wrapCallback;
|
|
|
/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */
|
|
|
if (
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' &&
|
|
|
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop ===
|
|
|
'function'
|
|
|
) {
|
|
|
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error());
|
|
|
}
|
|
|
|
|
|
})();
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/scheduler/index.js":
|
|
|
/*!*****************************************!*\
|
|
|
!*** ./node_modules/scheduler/index.js ***!
|
|
|
\*****************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
if (false) {} else {
|
|
|
module.exports = __webpack_require__(/*! ./cjs/scheduler.development.js */ "./node_modules/scheduler/cjs/scheduler.development.js");
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./src/containers/DashboardContainer/index.less":
|
|
|
/*!******************************************************!*\
|
|
|
!*** ./src/containers/DashboardContainer/index.less ***!
|
|
|
\******************************************************/
|
|
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/styleDomAPI.js */ "./node_modules/style-loader/dist/runtime/styleDomAPI.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/insertBySelector.js */ "./node_modules/style-loader/dist/runtime/insertBySelector.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/insertStyleElement.js */ "./node_modules/style-loader/dist/runtime/insertStyleElement.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../../../node_modules/style-loader/dist/runtime/styleTagTransform.js */ "./node_modules/style-loader/dist/runtime/styleTagTransform.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_index_less__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!../../../node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./index.less */ "./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/containers/DashboardContainer/index.less");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var options = {};
|
|
|
|
|
|
options.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());
|
|
|
options.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());
|
|
|
|
|
|
options.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, "head");
|
|
|
|
|
|
options.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());
|
|
|
options.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());
|
|
|
|
|
|
var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_index_less__WEBPACK_IMPORTED_MODULE_6__["default"], options);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_index_less__WEBPACK_IMPORTED_MODULE_6__["default"] && _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_index_less__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_index_less__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":
|
|
|
/*!****************************************************************************!*\
|
|
|
!*** ./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js ***!
|
|
|
\****************************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var stylesInDOM = [];
|
|
|
|
|
|
function getIndexByIdentifier(identifier) {
|
|
|
var result = -1;
|
|
|
|
|
|
for (var i = 0; i < stylesInDOM.length; i++) {
|
|
|
if (stylesInDOM[i].identifier === identifier) {
|
|
|
result = i;
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return result;
|
|
|
}
|
|
|
|
|
|
function modulesToDom(list, options) {
|
|
|
var idCountMap = {};
|
|
|
var identifiers = [];
|
|
|
|
|
|
for (var i = 0; i < list.length; i++) {
|
|
|
var item = list[i];
|
|
|
var id = options.base ? item[0] + options.base : item[0];
|
|
|
var count = idCountMap[id] || 0;
|
|
|
var identifier = "".concat(id, " ").concat(count);
|
|
|
idCountMap[id] = count + 1;
|
|
|
var indexByIdentifier = getIndexByIdentifier(identifier);
|
|
|
var obj = {
|
|
|
css: item[1],
|
|
|
media: item[2],
|
|
|
sourceMap: item[3],
|
|
|
supports: item[4],
|
|
|
layer: item[5]
|
|
|
};
|
|
|
|
|
|
if (indexByIdentifier !== -1) {
|
|
|
stylesInDOM[indexByIdentifier].references++;
|
|
|
stylesInDOM[indexByIdentifier].updater(obj);
|
|
|
} else {
|
|
|
var updater = addElementStyle(obj, options);
|
|
|
options.byIndex = i;
|
|
|
stylesInDOM.splice(i, 0, {
|
|
|
identifier: identifier,
|
|
|
updater: updater,
|
|
|
references: 1
|
|
|
});
|
|
|
}
|
|
|
|
|
|
identifiers.push(identifier);
|
|
|
}
|
|
|
|
|
|
return identifiers;
|
|
|
}
|
|
|
|
|
|
function addElementStyle(obj, options) {
|
|
|
var api = options.domAPI(options);
|
|
|
api.update(obj);
|
|
|
|
|
|
var updater = function updater(newObj) {
|
|
|
if (newObj) {
|
|
|
if (newObj.css === obj.css && newObj.media === obj.media && newObj.sourceMap === obj.sourceMap && newObj.supports === obj.supports && newObj.layer === obj.layer) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
api.update(obj = newObj);
|
|
|
} else {
|
|
|
api.remove();
|
|
|
}
|
|
|
};
|
|
|
|
|
|
return updater;
|
|
|
}
|
|
|
|
|
|
module.exports = function (list, options) {
|
|
|
options = options || {};
|
|
|
list = list || [];
|
|
|
var lastIdentifiers = modulesToDom(list, options);
|
|
|
return function update(newList) {
|
|
|
newList = newList || [];
|
|
|
|
|
|
for (var i = 0; i < lastIdentifiers.length; i++) {
|
|
|
var identifier = lastIdentifiers[i];
|
|
|
var index = getIndexByIdentifier(identifier);
|
|
|
stylesInDOM[index].references--;
|
|
|
}
|
|
|
|
|
|
var newLastIdentifiers = modulesToDom(newList, options);
|
|
|
|
|
|
for (var _i = 0; _i < lastIdentifiers.length; _i++) {
|
|
|
var _identifier = lastIdentifiers[_i];
|
|
|
|
|
|
var _index = getIndexByIdentifier(_identifier);
|
|
|
|
|
|
if (stylesInDOM[_index].references === 0) {
|
|
|
stylesInDOM[_index].updater();
|
|
|
|
|
|
stylesInDOM.splice(_index, 1);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
lastIdentifiers = newLastIdentifiers;
|
|
|
};
|
|
|
};
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/style-loader/dist/runtime/insertBySelector.js":
|
|
|
/*!********************************************************************!*\
|
|
|
!*** ./node_modules/style-loader/dist/runtime/insertBySelector.js ***!
|
|
|
\********************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
var memo = {};
|
|
|
/* istanbul ignore next */
|
|
|
|
|
|
function getTarget(target) {
|
|
|
if (typeof memo[target] === "undefined") {
|
|
|
var styleTarget = document.querySelector(target); // Special case to return head of iframe instead of iframe itself
|
|
|
|
|
|
if (window.HTMLIFrameElement && styleTarget instanceof window.HTMLIFrameElement) {
|
|
|
try {
|
|
|
// This will throw an exception if access to iframe is blocked
|
|
|
// due to cross-origin restrictions
|
|
|
styleTarget = styleTarget.contentDocument.head;
|
|
|
} catch (e) {
|
|
|
// istanbul ignore next
|
|
|
styleTarget = null;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
memo[target] = styleTarget;
|
|
|
}
|
|
|
|
|
|
return memo[target];
|
|
|
}
|
|
|
/* istanbul ignore next */
|
|
|
|
|
|
|
|
|
function insertBySelector(insert, style) {
|
|
|
var target = getTarget(insert);
|
|
|
|
|
|
if (!target) {
|
|
|
throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");
|
|
|
}
|
|
|
|
|
|
target.appendChild(style);
|
|
|
}
|
|
|
|
|
|
module.exports = insertBySelector;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/style-loader/dist/runtime/insertStyleElement.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/style-loader/dist/runtime/insertStyleElement.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
/* istanbul ignore next */
|
|
|
function insertStyleElement(options) {
|
|
|
var element = document.createElement("style");
|
|
|
options.setAttributes(element, options.attributes);
|
|
|
options.insert(element, options.options);
|
|
|
return element;
|
|
|
}
|
|
|
|
|
|
module.exports = insertStyleElement;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":
|
|
|
/*!**********************************************************************************!*\
|
|
|
!*** ./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js ***!
|
|
|
\**********************************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
/* istanbul ignore next */
|
|
|
function setAttributesWithoutAttributes(styleElement) {
|
|
|
var nonce = true ? __webpack_require__.nc : 0;
|
|
|
|
|
|
if (nonce) {
|
|
|
styleElement.setAttribute("nonce", nonce);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
module.exports = setAttributesWithoutAttributes;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/style-loader/dist/runtime/styleDomAPI.js":
|
|
|
/*!***************************************************************!*\
|
|
|
!*** ./node_modules/style-loader/dist/runtime/styleDomAPI.js ***!
|
|
|
\***************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
/* istanbul ignore next */
|
|
|
function apply(styleElement, options, obj) {
|
|
|
var css = "";
|
|
|
|
|
|
if (obj.supports) {
|
|
|
css += "@supports (".concat(obj.supports, ") {");
|
|
|
}
|
|
|
|
|
|
if (obj.media) {
|
|
|
css += "@media ".concat(obj.media, " {");
|
|
|
}
|
|
|
|
|
|
var needLayer = typeof obj.layer !== "undefined";
|
|
|
|
|
|
if (needLayer) {
|
|
|
css += "@layer".concat(obj.layer.length > 0 ? " ".concat(obj.layer) : "", " {");
|
|
|
}
|
|
|
|
|
|
css += obj.css;
|
|
|
|
|
|
if (needLayer) {
|
|
|
css += "}";
|
|
|
}
|
|
|
|
|
|
if (obj.media) {
|
|
|
css += "}";
|
|
|
}
|
|
|
|
|
|
if (obj.supports) {
|
|
|
css += "}";
|
|
|
}
|
|
|
|
|
|
var sourceMap = obj.sourceMap;
|
|
|
|
|
|
if (sourceMap && typeof btoa !== "undefined") {
|
|
|
css += "\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))), " */");
|
|
|
} // For old IE
|
|
|
|
|
|
/* istanbul ignore if */
|
|
|
|
|
|
|
|
|
options.styleTagTransform(css, styleElement, options.options);
|
|
|
}
|
|
|
|
|
|
function removeStyleElement(styleElement) {
|
|
|
// istanbul ignore if
|
|
|
if (styleElement.parentNode === null) {
|
|
|
return false;
|
|
|
}
|
|
|
|
|
|
styleElement.parentNode.removeChild(styleElement);
|
|
|
}
|
|
|
/* istanbul ignore next */
|
|
|
|
|
|
|
|
|
function domAPI(options) {
|
|
|
var styleElement = options.insertStyleElement(options);
|
|
|
return {
|
|
|
update: function update(obj) {
|
|
|
apply(styleElement, options, obj);
|
|
|
},
|
|
|
remove: function remove() {
|
|
|
removeStyleElement(styleElement);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
|
|
|
module.exports = domAPI;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/style-loader/dist/runtime/styleTagTransform.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/style-loader/dist/runtime/styleTagTransform.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
"use strict";
|
|
|
|
|
|
|
|
|
/* istanbul ignore next */
|
|
|
function styleTagTransform(css, styleElement) {
|
|
|
if (styleElement.styleSheet) {
|
|
|
styleElement.styleSheet.cssText = css;
|
|
|
} else {
|
|
|
while (styleElement.firstChild) {
|
|
|
styleElement.removeChild(styleElement.firstChild);
|
|
|
}
|
|
|
|
|
|
styleElement.appendChild(document.createTextNode(css));
|
|
|
}
|
|
|
}
|
|
|
|
|
|
module.exports = styleTagTransform;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js":
|
|
|
/*!*****************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/arrayLikeToArray.js ***!
|
|
|
\*****************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
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;
|
|
|
}
|
|
|
module.exports = _arrayLikeToArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/arrayWithHoles.js":
|
|
|
/*!***************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/arrayWithHoles.js ***!
|
|
|
\***************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function _arrayWithHoles(arr) {
|
|
|
if (Array.isArray(arr)) return arr;
|
|
|
}
|
|
|
module.exports = _arrayWithHoles, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var arrayLikeToArray = __webpack_require__(/*! ./arrayLikeToArray.js */ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js");
|
|
|
function _arrayWithoutHoles(arr) {
|
|
|
if (Array.isArray(arr)) return arrayLikeToArray(arr);
|
|
|
}
|
|
|
module.exports = _arrayWithoutHoles, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/asyncToGenerator.js":
|
|
|
/*!*****************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/asyncToGenerator.js ***!
|
|
|
\*****************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
|
|
|
try {
|
|
|
var info = gen[key](arg);
|
|
|
var value = info.value;
|
|
|
} catch (error) {
|
|
|
reject(error);
|
|
|
return;
|
|
|
}
|
|
|
if (info.done) {
|
|
|
resolve(value);
|
|
|
} else {
|
|
|
Promise.resolve(value).then(_next, _throw);
|
|
|
}
|
|
|
}
|
|
|
function _asyncToGenerator(fn) {
|
|
|
return function () {
|
|
|
var self = this,
|
|
|
args = arguments;
|
|
|
return new Promise(function (resolve, reject) {
|
|
|
var gen = fn.apply(self, args);
|
|
|
function _next(value) {
|
|
|
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
|
|
|
}
|
|
|
function _throw(err) {
|
|
|
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
|
|
|
}
|
|
|
_next(undefined);
|
|
|
});
|
|
|
};
|
|
|
}
|
|
|
module.exports = _asyncToGenerator, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/defineProperty.js":
|
|
|
/*!***************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/defineProperty.js ***!
|
|
|
\***************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var toPropertyKey = __webpack_require__(/*! ./toPropertyKey.js */ "./node_modules/@babel/runtime/helpers/toPropertyKey.js");
|
|
|
function _defineProperty(obj, key, value) {
|
|
|
key = toPropertyKey(key);
|
|
|
if (key in obj) {
|
|
|
Object.defineProperty(obj, key, {
|
|
|
value: value,
|
|
|
enumerable: true,
|
|
|
configurable: true,
|
|
|
writable: true
|
|
|
});
|
|
|
} else {
|
|
|
obj[key] = value;
|
|
|
}
|
|
|
return obj;
|
|
|
}
|
|
|
module.exports = _defineProperty, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/interopRequireDefault.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/interopRequireDefault.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function _interopRequireDefault(obj) {
|
|
|
return obj && obj.__esModule ? obj : {
|
|
|
"default": obj
|
|
|
};
|
|
|
}
|
|
|
module.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/interopRequireWildcard.js":
|
|
|
/*!***********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/interopRequireWildcard.js ***!
|
|
|
\***********************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var _typeof = (__webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/typeof.js")["default"]);
|
|
|
function _getRequireWildcardCache(nodeInterop) {
|
|
|
if (typeof WeakMap !== "function") return null;
|
|
|
var cacheBabelInterop = new WeakMap();
|
|
|
var cacheNodeInterop = new WeakMap();
|
|
|
return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {
|
|
|
return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
|
|
|
})(nodeInterop);
|
|
|
}
|
|
|
function _interopRequireWildcard(obj, nodeInterop) {
|
|
|
if (!nodeInterop && obj && obj.__esModule) {
|
|
|
return obj;
|
|
|
}
|
|
|
if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") {
|
|
|
return {
|
|
|
"default": obj
|
|
|
};
|
|
|
}
|
|
|
var cache = _getRequireWildcardCache(nodeInterop);
|
|
|
if (cache && cache.has(obj)) {
|
|
|
return cache.get(obj);
|
|
|
}
|
|
|
var newObj = {};
|
|
|
var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
|
|
|
for (var key in obj) {
|
|
|
if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
|
|
|
var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
|
|
|
if (desc && (desc.get || desc.set)) {
|
|
|
Object.defineProperty(newObj, key, desc);
|
|
|
} else {
|
|
|
newObj[key] = obj[key];
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
newObj["default"] = obj;
|
|
|
if (cache) {
|
|
|
cache.set(obj, newObj);
|
|
|
}
|
|
|
return newObj;
|
|
|
}
|
|
|
module.exports = _interopRequireWildcard, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/iterableToArray.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/iterableToArray.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function _iterableToArray(iter) {
|
|
|
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
|
}
|
|
|
module.exports = _iterableToArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/iterableToArrayLimit.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/iterableToArrayLimit.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function _iterableToArrayLimit(arr, i) {
|
|
|
var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
|
|
|
if (null != _i) {
|
|
|
var _s,
|
|
|
_e,
|
|
|
_x,
|
|
|
_r,
|
|
|
_arr = [],
|
|
|
_n = !0,
|
|
|
_d = !1;
|
|
|
try {
|
|
|
if (_x = (_i = _i.call(arr)).next, 0 === i) {
|
|
|
if (Object(_i) !== _i) return;
|
|
|
_n = !1;
|
|
|
} else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
|
|
|
} catch (err) {
|
|
|
_d = !0, _e = err;
|
|
|
} finally {
|
|
|
try {
|
|
|
if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
|
|
|
} finally {
|
|
|
if (_d) throw _e;
|
|
|
}
|
|
|
}
|
|
|
return _arr;
|
|
|
}
|
|
|
}
|
|
|
module.exports = _iterableToArrayLimit, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/nonIterableRest.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/nonIterableRest.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
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.");
|
|
|
}
|
|
|
module.exports = _nonIterableRest, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/nonIterableSpread.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/nonIterableSpread.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
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.");
|
|
|
}
|
|
|
module.exports = _nonIterableSpread, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/objectSpread2.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/objectSpread2.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var defineProperty = __webpack_require__(/*! ./defineProperty.js */ "./node_modules/@babel/runtime/helpers/defineProperty.js");
|
|
|
function ownKeys(object, enumerableOnly) {
|
|
|
var keys = Object.keys(object);
|
|
|
if (Object.getOwnPropertySymbols) {
|
|
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
|
enumerableOnly && (symbols = symbols.filter(function (sym) {
|
|
|
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
|
})), keys.push.apply(keys, symbols);
|
|
|
}
|
|
|
return keys;
|
|
|
}
|
|
|
function _objectSpread2(target) {
|
|
|
for (var i = 1; i < arguments.length; i++) {
|
|
|
var source = null != arguments[i] ? arguments[i] : {};
|
|
|
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
|
|
|
defineProperty(target, key, source[key]);
|
|
|
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
|
|
|
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
|
});
|
|
|
}
|
|
|
return target;
|
|
|
}
|
|
|
module.exports = _objectSpread2, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/objectWithoutProperties.js":
|
|
|
/*!************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/objectWithoutProperties.js ***!
|
|
|
\************************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var objectWithoutPropertiesLoose = __webpack_require__(/*! ./objectWithoutPropertiesLoose.js */ "./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js");
|
|
|
function _objectWithoutProperties(source, excluded) {
|
|
|
if (source == null) return {};
|
|
|
var target = objectWithoutPropertiesLoose(source, excluded);
|
|
|
var key, i;
|
|
|
if (Object.getOwnPropertySymbols) {
|
|
|
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
|
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
|
key = sourceSymbolKeys[i];
|
|
|
if (excluded.indexOf(key) >= 0) continue;
|
|
|
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
|
target[key] = source[key];
|
|
|
}
|
|
|
}
|
|
|
return target;
|
|
|
}
|
|
|
module.exports = _objectWithoutProperties, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js":
|
|
|
/*!*****************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/objectWithoutPropertiesLoose.js ***!
|
|
|
\*****************************************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
if (source == null) return {};
|
|
|
var target = {};
|
|
|
var sourceKeys = Object.keys(source);
|
|
|
var key, i;
|
|
|
for (i = 0; i < sourceKeys.length; i++) {
|
|
|
key = sourceKeys[i];
|
|
|
if (excluded.indexOf(key) >= 0) continue;
|
|
|
target[key] = source[key];
|
|
|
}
|
|
|
return target;
|
|
|
}
|
|
|
module.exports = _objectWithoutPropertiesLoose, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/regeneratorRuntime.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/regeneratorRuntime.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var _typeof = (__webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/typeof.js")["default"]);
|
|
|
function _regeneratorRuntime() {
|
|
|
"use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
|
|
|
module.exports = _regeneratorRuntime = function _regeneratorRuntime() {
|
|
|
return exports;
|
|
|
}, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
var exports = {},
|
|
|
Op = Object.prototype,
|
|
|
hasOwn = Op.hasOwnProperty,
|
|
|
defineProperty = Object.defineProperty || function (obj, key, desc) {
|
|
|
obj[key] = desc.value;
|
|
|
},
|
|
|
$Symbol = "function" == typeof Symbol ? Symbol : {},
|
|
|
iteratorSymbol = $Symbol.iterator || "@@iterator",
|
|
|
asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator",
|
|
|
toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag";
|
|
|
function define(obj, key, value) {
|
|
|
return Object.defineProperty(obj, key, {
|
|
|
value: value,
|
|
|
enumerable: !0,
|
|
|
configurable: !0,
|
|
|
writable: !0
|
|
|
}), obj[key];
|
|
|
}
|
|
|
try {
|
|
|
define({}, "");
|
|
|
} catch (err) {
|
|
|
define = function define(obj, key, value) {
|
|
|
return obj[key] = value;
|
|
|
};
|
|
|
}
|
|
|
function wrap(innerFn, outerFn, self, tryLocsList) {
|
|
|
var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator,
|
|
|
generator = Object.create(protoGenerator.prototype),
|
|
|
context = new Context(tryLocsList || []);
|
|
|
return defineProperty(generator, "_invoke", {
|
|
|
value: makeInvokeMethod(innerFn, self, context)
|
|
|
}), generator;
|
|
|
}
|
|
|
function tryCatch(fn, obj, arg) {
|
|
|
try {
|
|
|
return {
|
|
|
type: "normal",
|
|
|
arg: fn.call(obj, arg)
|
|
|
};
|
|
|
} catch (err) {
|
|
|
return {
|
|
|
type: "throw",
|
|
|
arg: err
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
exports.wrap = wrap;
|
|
|
var ContinueSentinel = {};
|
|
|
function Generator() {}
|
|
|
function GeneratorFunction() {}
|
|
|
function GeneratorFunctionPrototype() {}
|
|
|
var IteratorPrototype = {};
|
|
|
define(IteratorPrototype, iteratorSymbol, function () {
|
|
|
return this;
|
|
|
});
|
|
|
var getProto = Object.getPrototypeOf,
|
|
|
NativeIteratorPrototype = getProto && getProto(getProto(values([])));
|
|
|
NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype);
|
|
|
var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype);
|
|
|
function defineIteratorMethods(prototype) {
|
|
|
["next", "throw", "return"].forEach(function (method) {
|
|
|
define(prototype, method, function (arg) {
|
|
|
return this._invoke(method, arg);
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
function AsyncIterator(generator, PromiseImpl) {
|
|
|
function invoke(method, arg, resolve, reject) {
|
|
|
var record = tryCatch(generator[method], generator, arg);
|
|
|
if ("throw" !== record.type) {
|
|
|
var result = record.arg,
|
|
|
value = result.value;
|
|
|
return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) {
|
|
|
invoke("next", value, resolve, reject);
|
|
|
}, function (err) {
|
|
|
invoke("throw", err, resolve, reject);
|
|
|
}) : PromiseImpl.resolve(value).then(function (unwrapped) {
|
|
|
result.value = unwrapped, resolve(result);
|
|
|
}, function (error) {
|
|
|
return invoke("throw", error, resolve, reject);
|
|
|
});
|
|
|
}
|
|
|
reject(record.arg);
|
|
|
}
|
|
|
var previousPromise;
|
|
|
defineProperty(this, "_invoke", {
|
|
|
value: function value(method, arg) {
|
|
|
function callInvokeWithMethodAndArg() {
|
|
|
return new PromiseImpl(function (resolve, reject) {
|
|
|
invoke(method, arg, resolve, reject);
|
|
|
});
|
|
|
}
|
|
|
return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
function makeInvokeMethod(innerFn, self, context) {
|
|
|
var state = "suspendedStart";
|
|
|
return function (method, arg) {
|
|
|
if ("executing" === state) throw new Error("Generator is already running");
|
|
|
if ("completed" === state) {
|
|
|
if ("throw" === method) throw arg;
|
|
|
return doneResult();
|
|
|
}
|
|
|
for (context.method = method, context.arg = arg;;) {
|
|
|
var delegate = context.delegate;
|
|
|
if (delegate) {
|
|
|
var delegateResult = maybeInvokeDelegate(delegate, context);
|
|
|
if (delegateResult) {
|
|
|
if (delegateResult === ContinueSentinel) continue;
|
|
|
return delegateResult;
|
|
|
}
|
|
|
}
|
|
|
if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) {
|
|
|
if ("suspendedStart" === state) throw state = "completed", context.arg;
|
|
|
context.dispatchException(context.arg);
|
|
|
} else "return" === context.method && context.abrupt("return", context.arg);
|
|
|
state = "executing";
|
|
|
var record = tryCatch(innerFn, self, context);
|
|
|
if ("normal" === record.type) {
|
|
|
if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue;
|
|
|
return {
|
|
|
value: record.arg,
|
|
|
done: context.done
|
|
|
};
|
|
|
}
|
|
|
"throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
function maybeInvokeDelegate(delegate, context) {
|
|
|
var methodName = context.method,
|
|
|
method = delegate.iterator[methodName];
|
|
|
if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel;
|
|
|
var record = tryCatch(method, delegate.iterator, context.arg);
|
|
|
if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel;
|
|
|
var info = record.arg;
|
|
|
return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel);
|
|
|
}
|
|
|
function pushTryEntry(locs) {
|
|
|
var entry = {
|
|
|
tryLoc: locs[0]
|
|
|
};
|
|
|
1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry);
|
|
|
}
|
|
|
function resetTryEntry(entry) {
|
|
|
var record = entry.completion || {};
|
|
|
record.type = "normal", delete record.arg, entry.completion = record;
|
|
|
}
|
|
|
function Context(tryLocsList) {
|
|
|
this.tryEntries = [{
|
|
|
tryLoc: "root"
|
|
|
}], tryLocsList.forEach(pushTryEntry, this), this.reset(!0);
|
|
|
}
|
|
|
function values(iterable) {
|
|
|
if (iterable) {
|
|
|
var iteratorMethod = iterable[iteratorSymbol];
|
|
|
if (iteratorMethod) return iteratorMethod.call(iterable);
|
|
|
if ("function" == typeof iterable.next) return iterable;
|
|
|
if (!isNaN(iterable.length)) {
|
|
|
var i = -1,
|
|
|
next = function next() {
|
|
|
for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next;
|
|
|
return next.value = undefined, next.done = !0, next;
|
|
|
};
|
|
|
return next.next = next;
|
|
|
}
|
|
|
}
|
|
|
return {
|
|
|
next: doneResult
|
|
|
};
|
|
|
}
|
|
|
function doneResult() {
|
|
|
return {
|
|
|
value: undefined,
|
|
|
done: !0
|
|
|
};
|
|
|
}
|
|
|
return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", {
|
|
|
value: GeneratorFunctionPrototype,
|
|
|
configurable: !0
|
|
|
}), defineProperty(GeneratorFunctionPrototype, "constructor", {
|
|
|
value: GeneratorFunction,
|
|
|
configurable: !0
|
|
|
}), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) {
|
|
|
var ctor = "function" == typeof genFun && genFun.constructor;
|
|
|
return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name));
|
|
|
}, exports.mark = function (genFun) {
|
|
|
return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun;
|
|
|
}, exports.awrap = function (arg) {
|
|
|
return {
|
|
|
__await: arg
|
|
|
};
|
|
|
}, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () {
|
|
|
return this;
|
|
|
}), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) {
|
|
|
void 0 === PromiseImpl && (PromiseImpl = Promise);
|
|
|
var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl);
|
|
|
return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) {
|
|
|
return result.done ? result.value : iter.next();
|
|
|
});
|
|
|
}, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () {
|
|
|
return this;
|
|
|
}), define(Gp, "toString", function () {
|
|
|
return "[object Generator]";
|
|
|
}), exports.keys = function (val) {
|
|
|
var object = Object(val),
|
|
|
keys = [];
|
|
|
for (var key in object) keys.push(key);
|
|
|
return keys.reverse(), function next() {
|
|
|
for (; keys.length;) {
|
|
|
var key = keys.pop();
|
|
|
if (key in object) return next.value = key, next.done = !1, next;
|
|
|
}
|
|
|
return next.done = !0, next;
|
|
|
};
|
|
|
}, exports.values = values, Context.prototype = {
|
|
|
constructor: Context,
|
|
|
reset: function reset(skipTempReset) {
|
|
|
if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined);
|
|
|
},
|
|
|
stop: function stop() {
|
|
|
this.done = !0;
|
|
|
var rootRecord = this.tryEntries[0].completion;
|
|
|
if ("throw" === rootRecord.type) throw rootRecord.arg;
|
|
|
return this.rval;
|
|
|
},
|
|
|
dispatchException: function dispatchException(exception) {
|
|
|
if (this.done) throw exception;
|
|
|
var context = this;
|
|
|
function handle(loc, caught) {
|
|
|
return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught;
|
|
|
}
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i],
|
|
|
record = entry.completion;
|
|
|
if ("root" === entry.tryLoc) return handle("end");
|
|
|
if (entry.tryLoc <= this.prev) {
|
|
|
var hasCatch = hasOwn.call(entry, "catchLoc"),
|
|
|
hasFinally = hasOwn.call(entry, "finallyLoc");
|
|
|
if (hasCatch && hasFinally) {
|
|
|
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
|
|
|
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
|
|
|
} else if (hasCatch) {
|
|
|
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
|
|
|
} else {
|
|
|
if (!hasFinally) throw new Error("try statement without catch or finally");
|
|
|
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
abrupt: function abrupt(type, arg) {
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i];
|
|
|
if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) {
|
|
|
var finallyEntry = entry;
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null);
|
|
|
var record = finallyEntry ? finallyEntry.completion : {};
|
|
|
return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record);
|
|
|
},
|
|
|
complete: function complete(record, afterLoc) {
|
|
|
if ("throw" === record.type) throw record.arg;
|
|
|
return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel;
|
|
|
},
|
|
|
finish: function finish(finallyLoc) {
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i];
|
|
|
if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel;
|
|
|
}
|
|
|
},
|
|
|
"catch": function _catch(tryLoc) {
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i];
|
|
|
if (entry.tryLoc === tryLoc) {
|
|
|
var record = entry.completion;
|
|
|
if ("throw" === record.type) {
|
|
|
var thrown = record.arg;
|
|
|
resetTryEntry(entry);
|
|
|
}
|
|
|
return thrown;
|
|
|
}
|
|
|
}
|
|
|
throw new Error("illegal catch attempt");
|
|
|
},
|
|
|
delegateYield: function delegateYield(iterable, resultName, nextLoc) {
|
|
|
return this.delegate = {
|
|
|
iterator: values(iterable),
|
|
|
resultName: resultName,
|
|
|
nextLoc: nextLoc
|
|
|
}, "next" === this.method && (this.arg = undefined), ContinueSentinel;
|
|
|
}
|
|
|
}, exports;
|
|
|
}
|
|
|
module.exports = _regeneratorRuntime, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/slicedToArray.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/slicedToArray.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var arrayWithHoles = __webpack_require__(/*! ./arrayWithHoles.js */ "./node_modules/@babel/runtime/helpers/arrayWithHoles.js");
|
|
|
var iterableToArrayLimit = __webpack_require__(/*! ./iterableToArrayLimit.js */ "./node_modules/@babel/runtime/helpers/iterableToArrayLimit.js");
|
|
|
var unsupportedIterableToArray = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js");
|
|
|
var nonIterableRest = __webpack_require__(/*! ./nonIterableRest.js */ "./node_modules/@babel/runtime/helpers/nonIterableRest.js");
|
|
|
function _slicedToArray(arr, i) {
|
|
|
return arrayWithHoles(arr) || iterableToArrayLimit(arr, i) || unsupportedIterableToArray(arr, i) || nonIterableRest();
|
|
|
}
|
|
|
module.exports = _slicedToArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/toArray.js":
|
|
|
/*!********************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/toArray.js ***!
|
|
|
\********************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var arrayWithHoles = __webpack_require__(/*! ./arrayWithHoles.js */ "./node_modules/@babel/runtime/helpers/arrayWithHoles.js");
|
|
|
var iterableToArray = __webpack_require__(/*! ./iterableToArray.js */ "./node_modules/@babel/runtime/helpers/iterableToArray.js");
|
|
|
var unsupportedIterableToArray = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js");
|
|
|
var nonIterableRest = __webpack_require__(/*! ./nonIterableRest.js */ "./node_modules/@babel/runtime/helpers/nonIterableRest.js");
|
|
|
function _toArray(arr) {
|
|
|
return arrayWithHoles(arr) || iterableToArray(arr) || unsupportedIterableToArray(arr) || nonIterableRest();
|
|
|
}
|
|
|
module.exports = _toArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/toConsumableArray.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/toConsumableArray.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var arrayWithoutHoles = __webpack_require__(/*! ./arrayWithoutHoles.js */ "./node_modules/@babel/runtime/helpers/arrayWithoutHoles.js");
|
|
|
var iterableToArray = __webpack_require__(/*! ./iterableToArray.js */ "./node_modules/@babel/runtime/helpers/iterableToArray.js");
|
|
|
var unsupportedIterableToArray = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js");
|
|
|
var nonIterableSpread = __webpack_require__(/*! ./nonIterableSpread.js */ "./node_modules/@babel/runtime/helpers/nonIterableSpread.js");
|
|
|
function _toConsumableArray(arr) {
|
|
|
return arrayWithoutHoles(arr) || iterableToArray(arr) || unsupportedIterableToArray(arr) || nonIterableSpread();
|
|
|
}
|
|
|
module.exports = _toConsumableArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/toPrimitive.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/toPrimitive.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var _typeof = (__webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/typeof.js")["default"]);
|
|
|
function _toPrimitive(input, hint) {
|
|
|
if (_typeof(input) !== "object" || input === null) return input;
|
|
|
var prim = input[Symbol.toPrimitive];
|
|
|
if (prim !== undefined) {
|
|
|
var res = prim.call(input, hint || "default");
|
|
|
if (_typeof(res) !== "object") return res;
|
|
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
|
}
|
|
|
return (hint === "string" ? String : Number)(input);
|
|
|
}
|
|
|
module.exports = _toPrimitive, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/toPropertyKey.js":
|
|
|
/*!**************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/toPropertyKey.js ***!
|
|
|
\**************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var _typeof = (__webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/typeof.js")["default"]);
|
|
|
var toPrimitive = __webpack_require__(/*! ./toPrimitive.js */ "./node_modules/@babel/runtime/helpers/toPrimitive.js");
|
|
|
function _toPropertyKey(arg) {
|
|
|
var key = toPrimitive(arg, "string");
|
|
|
return _typeof(key) === "symbol" ? key : String(key);
|
|
|
}
|
|
|
module.exports = _toPropertyKey, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/typeof.js":
|
|
|
/*!*******************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/typeof.js ***!
|
|
|
\*******************************************************/
|
|
|
/***/ ((module) => {
|
|
|
|
|
|
function _typeof(obj) {
|
|
|
"@babel/helpers - typeof";
|
|
|
|
|
|
return (module.exports = _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
|
|
|
return typeof obj;
|
|
|
} : function (obj) {
|
|
|
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
|
|
}, module.exports.__esModule = true, module.exports["default"] = module.exports), _typeof(obj);
|
|
|
}
|
|
|
module.exports = _typeof, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js":
|
|
|
/*!***************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/unsupportedIterableToArray.js ***!
|
|
|
\***************************************************************************/
|
|
|
/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
|
|
|
|
|
|
var arrayLikeToArray = __webpack_require__(/*! ./arrayLikeToArray.js */ "./node_modules/@babel/runtime/helpers/arrayLikeToArray.js");
|
|
|
function _unsupportedIterableToArray(o, minLen) {
|
|
|
if (!o) return;
|
|
|
if (typeof o === "string") return arrayLikeToArray(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 arrayLikeToArray(o, minLen);
|
|
|
}
|
|
|
module.exports = _unsupportedIterableToArray, module.exports.__esModule = true, module.exports["default"] = module.exports;
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _arrayLikeToArray)
|
|
|
/* harmony export */ });
|
|
|
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 ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _arrayWithHoles)
|
|
|
/* harmony export */ });
|
|
|
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 ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _arrayWithoutHoles)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./arrayLikeToArray.js */ "./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js");
|
|
|
|
|
|
function _arrayWithoutHoles(arr) {
|
|
|
if (Array.isArray(arr)) return (0,_arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__["default"])(arr);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js":
|
|
|
/*!**************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js ***!
|
|
|
\**************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _assertThisInitialized)
|
|
|
/* harmony export */ });
|
|
|
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/asyncToGenerator.js":
|
|
|
/*!*********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/asyncToGenerator.js ***!
|
|
|
\*********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _asyncToGenerator)
|
|
|
/* harmony export */ });
|
|
|
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
|
|
|
try {
|
|
|
var info = gen[key](arg);
|
|
|
var value = info.value;
|
|
|
} catch (error) {
|
|
|
reject(error);
|
|
|
return;
|
|
|
}
|
|
|
if (info.done) {
|
|
|
resolve(value);
|
|
|
} else {
|
|
|
Promise.resolve(value).then(_next, _throw);
|
|
|
}
|
|
|
}
|
|
|
function _asyncToGenerator(fn) {
|
|
|
return function () {
|
|
|
var self = this,
|
|
|
args = arguments;
|
|
|
return new Promise(function (resolve, reject) {
|
|
|
var gen = fn.apply(self, args);
|
|
|
function _next(value) {
|
|
|
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
|
|
|
}
|
|
|
function _throw(err) {
|
|
|
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
|
|
|
}
|
|
|
_next(undefined);
|
|
|
});
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/classCallCheck.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/classCallCheck.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _classCallCheck)
|
|
|
/* harmony export */ });
|
|
|
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 ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _createClass)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./toPropertyKey.js */ "./node_modules/@babel/runtime/helpers/esm/toPropertyKey.js");
|
|
|
|
|
|
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, (0,_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["default"])(descriptor.key), descriptor);
|
|
|
}
|
|
|
}
|
|
|
function _createClass(Constructor, protoProps, staticProps) {
|
|
|
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
|
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
|
Object.defineProperty(Constructor, "prototype", {
|
|
|
writable: false
|
|
|
});
|
|
|
return Constructor;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/createSuper.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/createSuper.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _createSuper)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _getPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./getPrototypeOf.js */ "./node_modules/@babel/runtime/helpers/esm/getPrototypeOf.js");
|
|
|
/* harmony import */ var _isNativeReflectConstruct_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./isNativeReflectConstruct.js */ "./node_modules/@babel/runtime/helpers/esm/isNativeReflectConstruct.js");
|
|
|
/* harmony import */ var _possibleConstructorReturn_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./possibleConstructorReturn.js */ "./node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js");
|
|
|
|
|
|
|
|
|
|
|
|
function _createSuper(Derived) {
|
|
|
var hasNativeReflectConstruct = (0,_isNativeReflectConstruct_js__WEBPACK_IMPORTED_MODULE_1__["default"])();
|
|
|
return function _createSuperInternal() {
|
|
|
var Super = (0,_getPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__["default"])(Derived),
|
|
|
result;
|
|
|
if (hasNativeReflectConstruct) {
|
|
|
var NewTarget = (0,_getPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__["default"])(this).constructor;
|
|
|
result = Reflect.construct(Super, arguments, NewTarget);
|
|
|
} else {
|
|
|
result = Super.apply(this, arguments);
|
|
|
}
|
|
|
return (0,_possibleConstructorReturn_js__WEBPACK_IMPORTED_MODULE_2__["default"])(this, result);
|
|
|
};
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/defineProperty.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _defineProperty)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./toPropertyKey.js */ "./node_modules/@babel/runtime/helpers/esm/toPropertyKey.js");
|
|
|
|
|
|
function _defineProperty(obj, key, value) {
|
|
|
key = (0,_toPropertyKey_js__WEBPACK_IMPORTED_MODULE_0__["default"])(key);
|
|
|
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 ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _extends)
|
|
|
/* harmony export */ });
|
|
|
function _extends() {
|
|
|
_extends = Object.assign ? Object.assign.bind() : 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 ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _getPrototypeOf)
|
|
|
/* harmony export */ });
|
|
|
function _getPrototypeOf(o) {
|
|
|
_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : 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 ***!
|
|
|
\*************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _inherits)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _setPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./setPrototypeOf.js */ "./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
|
|
|
}
|
|
|
});
|
|
|
Object.defineProperty(subClass, "prototype", {
|
|
|
writable: false
|
|
|
});
|
|
|
if (superClass) (0,_setPrototypeOf_js__WEBPACK_IMPORTED_MODULE_0__["default"])(subClass, superClass);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/isNativeReflectConstruct.js":
|
|
|
/*!*****************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/isNativeReflectConstruct.js ***!
|
|
|
\*****************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _isNativeReflectConstruct)
|
|
|
/* harmony export */ });
|
|
|
function _isNativeReflectConstruct() {
|
|
|
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
|
if (Reflect.construct.sham) return false;
|
|
|
if (typeof Proxy === "function") return true;
|
|
|
try {
|
|
|
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
|
|
return true;
|
|
|
} catch (e) {
|
|
|
return false;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/iterableToArray.js":
|
|
|
/*!********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/iterableToArray.js ***!
|
|
|
\********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _iterableToArray)
|
|
|
/* harmony export */ });
|
|
|
function _iterableToArray(iter) {
|
|
|
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js":
|
|
|
/*!*************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js ***!
|
|
|
\*************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _iterableToArrayLimit)
|
|
|
/* harmony export */ });
|
|
|
function _iterableToArrayLimit(arr, i) {
|
|
|
var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
|
|
|
if (null != _i) {
|
|
|
var _s,
|
|
|
_e,
|
|
|
_x,
|
|
|
_r,
|
|
|
_arr = [],
|
|
|
_n = !0,
|
|
|
_d = !1;
|
|
|
try {
|
|
|
if (_x = (_i = _i.call(arr)).next, 0 === i) {
|
|
|
if (Object(_i) !== _i) return;
|
|
|
_n = !1;
|
|
|
} else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
|
|
|
} catch (err) {
|
|
|
_d = !0, _e = err;
|
|
|
} finally {
|
|
|
try {
|
|
|
if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
|
|
|
} finally {
|
|
|
if (_d) throw _e;
|
|
|
}
|
|
|
}
|
|
|
return _arr;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js":
|
|
|
/*!********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js ***!
|
|
|
\********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _nonIterableRest)
|
|
|
/* harmony export */ });
|
|
|
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 ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _nonIterableSpread)
|
|
|
/* harmony export */ });
|
|
|
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/objectSpread2.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/objectSpread2.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _objectSpread2)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _defineProperty_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./defineProperty.js */ "./node_modules/@babel/runtime/helpers/esm/defineProperty.js");
|
|
|
|
|
|
function ownKeys(object, enumerableOnly) {
|
|
|
var keys = Object.keys(object);
|
|
|
if (Object.getOwnPropertySymbols) {
|
|
|
var symbols = Object.getOwnPropertySymbols(object);
|
|
|
enumerableOnly && (symbols = symbols.filter(function (sym) {
|
|
|
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
|
})), keys.push.apply(keys, symbols);
|
|
|
}
|
|
|
return keys;
|
|
|
}
|
|
|
function _objectSpread2(target) {
|
|
|
for (var i = 1; i < arguments.length; i++) {
|
|
|
var source = null != arguments[i] ? arguments[i] : {};
|
|
|
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
|
|
|
(0,_defineProperty_js__WEBPACK_IMPORTED_MODULE_0__["default"])(target, key, source[key]);
|
|
|
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
|
|
|
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
|
});
|
|
|
}
|
|
|
return target;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js":
|
|
|
/*!****************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/objectWithoutProperties.js ***!
|
|
|
\****************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _objectWithoutProperties)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _objectWithoutPropertiesLoose_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./objectWithoutPropertiesLoose.js */ "./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js");
|
|
|
|
|
|
function _objectWithoutProperties(source, excluded) {
|
|
|
if (source == null) return {};
|
|
|
var target = (0,_objectWithoutPropertiesLoose_js__WEBPACK_IMPORTED_MODULE_0__["default"])(source, excluded);
|
|
|
var key, i;
|
|
|
if (Object.getOwnPropertySymbols) {
|
|
|
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
|
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
|
key = sourceSymbolKeys[i];
|
|
|
if (excluded.indexOf(key) >= 0) continue;
|
|
|
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
|
target[key] = source[key];
|
|
|
}
|
|
|
}
|
|
|
return target;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js":
|
|
|
/*!*********************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js ***!
|
|
|
\*********************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _objectWithoutPropertiesLoose)
|
|
|
/* harmony export */ });
|
|
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
if (source == null) return {};
|
|
|
var target = {};
|
|
|
var sourceKeys = Object.keys(source);
|
|
|
var key, i;
|
|
|
for (i = 0; i < sourceKeys.length; i++) {
|
|
|
key = sourceKeys[i];
|
|
|
if (excluded.indexOf(key) >= 0) continue;
|
|
|
target[key] = source[key];
|
|
|
}
|
|
|
return target;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js":
|
|
|
/*!******************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn.js ***!
|
|
|
\******************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _possibleConstructorReturn)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _typeof_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
/* harmony import */ var _assertThisInitialized_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./assertThisInitialized.js */ "./node_modules/@babel/runtime/helpers/esm/assertThisInitialized.js");
|
|
|
|
|
|
|
|
|
function _possibleConstructorReturn(self, call) {
|
|
|
if (call && ((0,_typeof_js__WEBPACK_IMPORTED_MODULE_0__["default"])(call) === "object" || typeof call === "function")) {
|
|
|
return call;
|
|
|
} else if (call !== void 0) {
|
|
|
throw new TypeError("Derived constructors may only return object or undefined");
|
|
|
}
|
|
|
return (0,_assertThisInitialized_js__WEBPACK_IMPORTED_MODULE_1__["default"])(self);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/regeneratorRuntime.js":
|
|
|
/*!***********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/regeneratorRuntime.js ***!
|
|
|
\***********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _regeneratorRuntime)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _typeof_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
|
|
|
function _regeneratorRuntime() {
|
|
|
"use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
|
|
|
_regeneratorRuntime = function _regeneratorRuntime() {
|
|
|
return exports;
|
|
|
};
|
|
|
var exports = {},
|
|
|
Op = Object.prototype,
|
|
|
hasOwn = Op.hasOwnProperty,
|
|
|
defineProperty = Object.defineProperty || function (obj, key, desc) {
|
|
|
obj[key] = desc.value;
|
|
|
},
|
|
|
$Symbol = "function" == typeof Symbol ? Symbol : {},
|
|
|
iteratorSymbol = $Symbol.iterator || "@@iterator",
|
|
|
asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator",
|
|
|
toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag";
|
|
|
function define(obj, key, value) {
|
|
|
return Object.defineProperty(obj, key, {
|
|
|
value: value,
|
|
|
enumerable: !0,
|
|
|
configurable: !0,
|
|
|
writable: !0
|
|
|
}), obj[key];
|
|
|
}
|
|
|
try {
|
|
|
define({}, "");
|
|
|
} catch (err) {
|
|
|
define = function define(obj, key, value) {
|
|
|
return obj[key] = value;
|
|
|
};
|
|
|
}
|
|
|
function wrap(innerFn, outerFn, self, tryLocsList) {
|
|
|
var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator,
|
|
|
generator = Object.create(protoGenerator.prototype),
|
|
|
context = new Context(tryLocsList || []);
|
|
|
return defineProperty(generator, "_invoke", {
|
|
|
value: makeInvokeMethod(innerFn, self, context)
|
|
|
}), generator;
|
|
|
}
|
|
|
function tryCatch(fn, obj, arg) {
|
|
|
try {
|
|
|
return {
|
|
|
type: "normal",
|
|
|
arg: fn.call(obj, arg)
|
|
|
};
|
|
|
} catch (err) {
|
|
|
return {
|
|
|
type: "throw",
|
|
|
arg: err
|
|
|
};
|
|
|
}
|
|
|
}
|
|
|
exports.wrap = wrap;
|
|
|
var ContinueSentinel = {};
|
|
|
function Generator() {}
|
|
|
function GeneratorFunction() {}
|
|
|
function GeneratorFunctionPrototype() {}
|
|
|
var IteratorPrototype = {};
|
|
|
define(IteratorPrototype, iteratorSymbol, function () {
|
|
|
return this;
|
|
|
});
|
|
|
var getProto = Object.getPrototypeOf,
|
|
|
NativeIteratorPrototype = getProto && getProto(getProto(values([])));
|
|
|
NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype);
|
|
|
var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype);
|
|
|
function defineIteratorMethods(prototype) {
|
|
|
["next", "throw", "return"].forEach(function (method) {
|
|
|
define(prototype, method, function (arg) {
|
|
|
return this._invoke(method, arg);
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
function AsyncIterator(generator, PromiseImpl) {
|
|
|
function invoke(method, arg, resolve, reject) {
|
|
|
var record = tryCatch(generator[method], generator, arg);
|
|
|
if ("throw" !== record.type) {
|
|
|
var result = record.arg,
|
|
|
value = result.value;
|
|
|
return value && "object" == (0,_typeof_js__WEBPACK_IMPORTED_MODULE_0__["default"])(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) {
|
|
|
invoke("next", value, resolve, reject);
|
|
|
}, function (err) {
|
|
|
invoke("throw", err, resolve, reject);
|
|
|
}) : PromiseImpl.resolve(value).then(function (unwrapped) {
|
|
|
result.value = unwrapped, resolve(result);
|
|
|
}, function (error) {
|
|
|
return invoke("throw", error, resolve, reject);
|
|
|
});
|
|
|
}
|
|
|
reject(record.arg);
|
|
|
}
|
|
|
var previousPromise;
|
|
|
defineProperty(this, "_invoke", {
|
|
|
value: function value(method, arg) {
|
|
|
function callInvokeWithMethodAndArg() {
|
|
|
return new PromiseImpl(function (resolve, reject) {
|
|
|
invoke(method, arg, resolve, reject);
|
|
|
});
|
|
|
}
|
|
|
return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
function makeInvokeMethod(innerFn, self, context) {
|
|
|
var state = "suspendedStart";
|
|
|
return function (method, arg) {
|
|
|
if ("executing" === state) throw new Error("Generator is already running");
|
|
|
if ("completed" === state) {
|
|
|
if ("throw" === method) throw arg;
|
|
|
return doneResult();
|
|
|
}
|
|
|
for (context.method = method, context.arg = arg;;) {
|
|
|
var delegate = context.delegate;
|
|
|
if (delegate) {
|
|
|
var delegateResult = maybeInvokeDelegate(delegate, context);
|
|
|
if (delegateResult) {
|
|
|
if (delegateResult === ContinueSentinel) continue;
|
|
|
return delegateResult;
|
|
|
}
|
|
|
}
|
|
|
if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) {
|
|
|
if ("suspendedStart" === state) throw state = "completed", context.arg;
|
|
|
context.dispatchException(context.arg);
|
|
|
} else "return" === context.method && context.abrupt("return", context.arg);
|
|
|
state = "executing";
|
|
|
var record = tryCatch(innerFn, self, context);
|
|
|
if ("normal" === record.type) {
|
|
|
if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue;
|
|
|
return {
|
|
|
value: record.arg,
|
|
|
done: context.done
|
|
|
};
|
|
|
}
|
|
|
"throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg);
|
|
|
}
|
|
|
};
|
|
|
}
|
|
|
function maybeInvokeDelegate(delegate, context) {
|
|
|
var methodName = context.method,
|
|
|
method = delegate.iterator[methodName];
|
|
|
if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel;
|
|
|
var record = tryCatch(method, delegate.iterator, context.arg);
|
|
|
if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel;
|
|
|
var info = record.arg;
|
|
|
return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel);
|
|
|
}
|
|
|
function pushTryEntry(locs) {
|
|
|
var entry = {
|
|
|
tryLoc: locs[0]
|
|
|
};
|
|
|
1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry);
|
|
|
}
|
|
|
function resetTryEntry(entry) {
|
|
|
var record = entry.completion || {};
|
|
|
record.type = "normal", delete record.arg, entry.completion = record;
|
|
|
}
|
|
|
function Context(tryLocsList) {
|
|
|
this.tryEntries = [{
|
|
|
tryLoc: "root"
|
|
|
}], tryLocsList.forEach(pushTryEntry, this), this.reset(!0);
|
|
|
}
|
|
|
function values(iterable) {
|
|
|
if (iterable) {
|
|
|
var iteratorMethod = iterable[iteratorSymbol];
|
|
|
if (iteratorMethod) return iteratorMethod.call(iterable);
|
|
|
if ("function" == typeof iterable.next) return iterable;
|
|
|
if (!isNaN(iterable.length)) {
|
|
|
var i = -1,
|
|
|
next = function next() {
|
|
|
for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next;
|
|
|
return next.value = undefined, next.done = !0, next;
|
|
|
};
|
|
|
return next.next = next;
|
|
|
}
|
|
|
}
|
|
|
return {
|
|
|
next: doneResult
|
|
|
};
|
|
|
}
|
|
|
function doneResult() {
|
|
|
return {
|
|
|
value: undefined,
|
|
|
done: !0
|
|
|
};
|
|
|
}
|
|
|
return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", {
|
|
|
value: GeneratorFunctionPrototype,
|
|
|
configurable: !0
|
|
|
}), defineProperty(GeneratorFunctionPrototype, "constructor", {
|
|
|
value: GeneratorFunction,
|
|
|
configurable: !0
|
|
|
}), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) {
|
|
|
var ctor = "function" == typeof genFun && genFun.constructor;
|
|
|
return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name));
|
|
|
}, exports.mark = function (genFun) {
|
|
|
return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun;
|
|
|
}, exports.awrap = function (arg) {
|
|
|
return {
|
|
|
__await: arg
|
|
|
};
|
|
|
}, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () {
|
|
|
return this;
|
|
|
}), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) {
|
|
|
void 0 === PromiseImpl && (PromiseImpl = Promise);
|
|
|
var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl);
|
|
|
return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) {
|
|
|
return result.done ? result.value : iter.next();
|
|
|
});
|
|
|
}, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () {
|
|
|
return this;
|
|
|
}), define(Gp, "toString", function () {
|
|
|
return "[object Generator]";
|
|
|
}), exports.keys = function (val) {
|
|
|
var object = Object(val),
|
|
|
keys = [];
|
|
|
for (var key in object) keys.push(key);
|
|
|
return keys.reverse(), function next() {
|
|
|
for (; keys.length;) {
|
|
|
var key = keys.pop();
|
|
|
if (key in object) return next.value = key, next.done = !1, next;
|
|
|
}
|
|
|
return next.done = !0, next;
|
|
|
};
|
|
|
}, exports.values = values, Context.prototype = {
|
|
|
constructor: Context,
|
|
|
reset: function reset(skipTempReset) {
|
|
|
if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined);
|
|
|
},
|
|
|
stop: function stop() {
|
|
|
this.done = !0;
|
|
|
var rootRecord = this.tryEntries[0].completion;
|
|
|
if ("throw" === rootRecord.type) throw rootRecord.arg;
|
|
|
return this.rval;
|
|
|
},
|
|
|
dispatchException: function dispatchException(exception) {
|
|
|
if (this.done) throw exception;
|
|
|
var context = this;
|
|
|
function handle(loc, caught) {
|
|
|
return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught;
|
|
|
}
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i],
|
|
|
record = entry.completion;
|
|
|
if ("root" === entry.tryLoc) return handle("end");
|
|
|
if (entry.tryLoc <= this.prev) {
|
|
|
var hasCatch = hasOwn.call(entry, "catchLoc"),
|
|
|
hasFinally = hasOwn.call(entry, "finallyLoc");
|
|
|
if (hasCatch && hasFinally) {
|
|
|
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
|
|
|
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
|
|
|
} else if (hasCatch) {
|
|
|
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
|
|
|
} else {
|
|
|
if (!hasFinally) throw new Error("try statement without catch or finally");
|
|
|
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
abrupt: function abrupt(type, arg) {
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i];
|
|
|
if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) {
|
|
|
var finallyEntry = entry;
|
|
|
break;
|
|
|
}
|
|
|
}
|
|
|
finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null);
|
|
|
var record = finallyEntry ? finallyEntry.completion : {};
|
|
|
return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record);
|
|
|
},
|
|
|
complete: function complete(record, afterLoc) {
|
|
|
if ("throw" === record.type) throw record.arg;
|
|
|
return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel;
|
|
|
},
|
|
|
finish: function finish(finallyLoc) {
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i];
|
|
|
if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel;
|
|
|
}
|
|
|
},
|
|
|
"catch": function _catch(tryLoc) {
|
|
|
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
|
|
|
var entry = this.tryEntries[i];
|
|
|
if (entry.tryLoc === tryLoc) {
|
|
|
var record = entry.completion;
|
|
|
if ("throw" === record.type) {
|
|
|
var thrown = record.arg;
|
|
|
resetTryEntry(entry);
|
|
|
}
|
|
|
return thrown;
|
|
|
}
|
|
|
}
|
|
|
throw new Error("illegal catch attempt");
|
|
|
},
|
|
|
delegateYield: function delegateYield(iterable, resultName, nextLoc) {
|
|
|
return this.delegate = {
|
|
|
iterator: values(iterable),
|
|
|
resultName: resultName,
|
|
|
nextLoc: nextLoc
|
|
|
}, "next" === this.method && (this.arg = undefined), ContinueSentinel;
|
|
|
}
|
|
|
}, exports;
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js":
|
|
|
/*!*******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/setPrototypeOf.js ***!
|
|
|
\*******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _setPrototypeOf)
|
|
|
/* harmony export */ });
|
|
|
function _setPrototypeOf(o, p) {
|
|
|
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : 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 ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _slicedToArray)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _arrayWithHoles_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./arrayWithHoles.js */ "./node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js");
|
|
|
/* harmony import */ var _iterableToArrayLimit_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./iterableToArrayLimit.js */ "./node_modules/@babel/runtime/helpers/esm/iterableToArrayLimit.js");
|
|
|
/* harmony import */ var _unsupportedIterableToArray_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js");
|
|
|
/* harmony import */ var _nonIterableRest_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./nonIterableRest.js */ "./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function _slicedToArray(arr, i) {
|
|
|
return (0,_arrayWithHoles_js__WEBPACK_IMPORTED_MODULE_0__["default"])(arr) || (0,_iterableToArrayLimit_js__WEBPACK_IMPORTED_MODULE_1__["default"])(arr, i) || (0,_unsupportedIterableToArray_js__WEBPACK_IMPORTED_MODULE_2__["default"])(arr, i) || (0,_nonIterableRest_js__WEBPACK_IMPORTED_MODULE_3__["default"])();
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/toArray.js":
|
|
|
/*!************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/toArray.js ***!
|
|
|
\************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _toArray)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _arrayWithHoles_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./arrayWithHoles.js */ "./node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js");
|
|
|
/* harmony import */ var _iterableToArray_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./iterableToArray.js */ "./node_modules/@babel/runtime/helpers/esm/iterableToArray.js");
|
|
|
/* harmony import */ var _unsupportedIterableToArray_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js");
|
|
|
/* harmony import */ var _nonIterableRest_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./nonIterableRest.js */ "./node_modules/@babel/runtime/helpers/esm/nonIterableRest.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function _toArray(arr) {
|
|
|
return (0,_arrayWithHoles_js__WEBPACK_IMPORTED_MODULE_0__["default"])(arr) || (0,_iterableToArray_js__WEBPACK_IMPORTED_MODULE_1__["default"])(arr) || (0,_unsupportedIterableToArray_js__WEBPACK_IMPORTED_MODULE_2__["default"])(arr) || (0,_nonIterableRest_js__WEBPACK_IMPORTED_MODULE_3__["default"])();
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js":
|
|
|
/*!**********************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/toConsumableArray.js ***!
|
|
|
\**********************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _toConsumableArray)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _arrayWithoutHoles_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./arrayWithoutHoles.js */ "./node_modules/@babel/runtime/helpers/esm/arrayWithoutHoles.js");
|
|
|
/* harmony import */ var _iterableToArray_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./iterableToArray.js */ "./node_modules/@babel/runtime/helpers/esm/iterableToArray.js");
|
|
|
/* harmony import */ var _unsupportedIterableToArray_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./unsupportedIterableToArray.js */ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js");
|
|
|
/* harmony import */ var _nonIterableSpread_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./nonIterableSpread.js */ "./node_modules/@babel/runtime/helpers/esm/nonIterableSpread.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function _toConsumableArray(arr) {
|
|
|
return (0,_arrayWithoutHoles_js__WEBPACK_IMPORTED_MODULE_0__["default"])(arr) || (0,_iterableToArray_js__WEBPACK_IMPORTED_MODULE_1__["default"])(arr) || (0,_unsupportedIterableToArray_js__WEBPACK_IMPORTED_MODULE_2__["default"])(arr) || (0,_nonIterableSpread_js__WEBPACK_IMPORTED_MODULE_3__["default"])();
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/toPrimitive.js":
|
|
|
/*!****************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/toPrimitive.js ***!
|
|
|
\****************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _toPrimitive)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _typeof_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
|
|
|
function _toPrimitive(input, hint) {
|
|
|
if ((0,_typeof_js__WEBPACK_IMPORTED_MODULE_0__["default"])(input) !== "object" || input === null) return input;
|
|
|
var prim = input[Symbol.toPrimitive];
|
|
|
if (prim !== undefined) {
|
|
|
var res = prim.call(input, hint || "default");
|
|
|
if ((0,_typeof_js__WEBPACK_IMPORTED_MODULE_0__["default"])(res) !== "object") return res;
|
|
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
|
}
|
|
|
return (hint === "string" ? String : Number)(input);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/toPropertyKey.js":
|
|
|
/*!******************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/toPropertyKey.js ***!
|
|
|
\******************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _toPropertyKey)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _typeof_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./typeof.js */ "./node_modules/@babel/runtime/helpers/esm/typeof.js");
|
|
|
/* harmony import */ var _toPrimitive_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./toPrimitive.js */ "./node_modules/@babel/runtime/helpers/esm/toPrimitive.js");
|
|
|
|
|
|
|
|
|
function _toPropertyKey(arg) {
|
|
|
var key = (0,_toPrimitive_js__WEBPACK_IMPORTED_MODULE_1__["default"])(arg, "string");
|
|
|
return (0,_typeof_js__WEBPACK_IMPORTED_MODULE_0__["default"])(key) === "symbol" ? key : String(key);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/typeof.js":
|
|
|
/*!***********************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/typeof.js ***!
|
|
|
\***********************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _typeof)
|
|
|
/* harmony export */ });
|
|
|
function _typeof(obj) {
|
|
|
"@babel/helpers - typeof";
|
|
|
|
|
|
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
|
|
|
return typeof obj;
|
|
|
} : function (obj) {
|
|
|
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
|
|
}, _typeof(obj);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js":
|
|
|
/*!*******************************************************************************!*\
|
|
|
!*** ./node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js ***!
|
|
|
\*******************************************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ _unsupportedIterableToArray)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./arrayLikeToArray.js */ "./node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js");
|
|
|
|
|
|
function _unsupportedIterableToArray(o, minLen) {
|
|
|
if (!o) return;
|
|
|
if (typeof o === "string") return (0,_arrayLikeToArray_js__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 (0,_arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__["default"])(o, minLen);
|
|
|
}
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/@netuno/service-client/index.mjs":
|
|
|
/*!*******************************************************!*\
|
|
|
!*** ./node_modules/@netuno/service-client/index.mjs ***!
|
|
|
\*******************************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var just_extend__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! just-extend */ "./node_modules/just-extend/index.mjs");
|
|
|
|
|
|
|
|
|
const isNode = typeof window === 'undefined' && typeof __webpack_require__ === 'undefined';
|
|
|
|
|
|
let nodeHTTP, nodeHTTPS = null;
|
|
|
|
|
|
const config = {
|
|
|
prefix: '',
|
|
|
url: '',
|
|
|
method: 'GET',
|
|
|
credentials: 'include',
|
|
|
headers: {
|
|
|
'Content-Type': 'application/json',
|
|
|
'Accept': 'application/json'
|
|
|
},
|
|
|
success: (data) => { },
|
|
|
fail: (data) => {}
|
|
|
};
|
|
|
|
|
|
const _service = async (args) => {
|
|
|
if (isNode && (nodeHTTP == null || nodeHTTPS == null)) {
|
|
|
nodeHTTP = await eval(`import('http')`);
|
|
|
nodeHTTPS = await eval(`import('https')`);
|
|
|
}
|
|
|
const settings = {};
|
|
|
(0,just_extend__WEBPACK_IMPORTED_MODULE_0__["default"])(true, settings, config);
|
|
|
(0,just_extend__WEBPACK_IMPORTED_MODULE_0__["default"])(true, settings, args);
|
|
|
if (!settings.url.toLowerCase().startsWith('http://')
|
|
|
&& !settings.url.toLowerCase().startsWith('https://')
|
|
|
&& settings.prefix && settings.prefix != ''
|
|
|
&& !settings.url.toLowerCase().startsWith(settings.prefix.toLowerCase())) {
|
|
|
if (settings.prefix.endsWith('/') && settings.url.startsWith('/')) {
|
|
|
settings.url = settings.url.substring(1);
|
|
|
} else if (!settings.prefix.endsWith('/') && !settings.url.startsWith('/')) {
|
|
|
settings.url = '/'+ settings.url;
|
|
|
}
|
|
|
let prefix = settings.prefix;
|
|
|
if (prefix.indexOf('/') == 0) {
|
|
|
let frontendServer = false;
|
|
|
let hostname = '';
|
|
|
let port = '';
|
|
|
if (window.location.host.indexOf(':')) {
|
|
|
hostname = window.location.host.substring(0, window.location.host.indexOf(':'));
|
|
|
port = window.location.host.substring(window.location.host.indexOf(':') + 1);
|
|
|
}
|
|
|
if (port === '3000') {
|
|
|
frontendServer = true;
|
|
|
port = '9000';
|
|
|
}
|
|
|
if (port.length > 2 && port.substring(port.length - 2, port.length) == '30') {
|
|
|
frontendServer = true;
|
|
|
port = port.substring(0, port.length - 2) + '90';
|
|
|
}
|
|
|
if (frontendServer) {
|
|
|
prefix = window.location.protocol +'//'+ hostname +':'+ port + prefix;
|
|
|
}
|
|
|
}
|
|
|
settings.url = prefix + settings.url;
|
|
|
}
|
|
|
if (settings.data) {
|
|
|
if (settings.method.toUpperCase() == 'GET') {
|
|
|
if (typeof settings.data == "object") {
|
|
|
settings.url = _service.urlWithEncodedParameters(settings.url, settings.data);
|
|
|
} else {
|
|
|
settings.url += `?${settings.data}`;
|
|
|
}
|
|
|
} else if (!isNode && (settings.data instanceof FormData || settings.multipart || (typeof settings.data === 'object' && Object.keys(settings.data).some((key) => settings.data[key] instanceof File)))) {
|
|
|
delete settings.headers['Content-Type'];
|
|
|
if (settings.data instanceof FormData) {
|
|
|
settings.body = settings.data;
|
|
|
} else if (settings.data === 'object') {
|
|
|
settings.body = new FormData();
|
|
|
Object.keys(settings.data).forEach((key) => {
|
|
|
if (settings.data[key] instanceof File) {
|
|
|
settings.body.append(key, settings.data[key]);
|
|
|
} else if (typeof settings.data[key] == 'object') {
|
|
|
settings.body.append(key, JSON.stringify(settings.data[key]));
|
|
|
} else {
|
|
|
settings.body.append(key, settings.data[key]);
|
|
|
}
|
|
|
});
|
|
|
} else {
|
|
|
settings.body = settings.data;
|
|
|
}
|
|
|
} else if (isNode && (settings.multipart || (typeof settings.data === 'object' && Object.keys(settings.data).some((key) => Buffer.isBuffer(settings.data[key]))))) {
|
|
|
const boundary = '---'+ _service.randomString(34);
|
|
|
settings.headers['Content-Type'] = `multipart/form-data; boundary=${boundary}`;
|
|
|
settings.body = Buffer.from('');
|
|
|
const bodyBufferAppend = (content) => {
|
|
|
if (Buffer.isBuffer(content)) {
|
|
|
settings.body = Buffer.concat([settings.body, content]);
|
|
|
} else {
|
|
|
settings.body = Buffer.concat([settings.body, Buffer.from(content)]);
|
|
|
}
|
|
|
};
|
|
|
Object.keys(settings.data).forEach((key) => {
|
|
|
if (Buffer.isBuffer(settings.data[key])) {
|
|
|
const bufferValue = settings.data[key];
|
|
|
const fileName = bufferValue.fileName;
|
|
|
const fileType = bufferValue.contentType || 'application/octet-stream';
|
|
|
bodyBufferAppend(`--${boundary}\r\n`);
|
|
|
bodyBufferAppend(`Content-Disposition: form-data; name="${key}"; filename="${fileName}";\r\n`);
|
|
|
bodyBufferAppend(`Content-Type: ${fileType}\r\n`);
|
|
|
bodyBufferAppend(`Content-Transfer-Encoding: binary\r\n\r\n`);
|
|
|
bodyBufferAppend(bufferValue);
|
|
|
} else {
|
|
|
let value = settings.data[key];
|
|
|
if (typeof value == 'object') {
|
|
|
value = JSON.stringify(value);
|
|
|
}
|
|
|
bodyBufferAppend(`--${boundary}\r\n`);
|
|
|
bodyBufferAppend(`Content-Disposition: form-data; name="${key}"; \r\n\r\n`);
|
|
|
bodyBufferAppend(`${value}\r\n`);
|
|
|
}
|
|
|
});
|
|
|
bodyBufferAppend(`\r\n--${boundary}--\r\n`);
|
|
|
} else if (settings.headers['Content-Type'] == 'application/json') {
|
|
|
if (typeof settings.data == "object") {
|
|
|
settings.body = JSON.stringify(settings.data);
|
|
|
} else {
|
|
|
settings.body = settings.data;
|
|
|
}
|
|
|
if (isNode) {
|
|
|
settings.headers['Content-Length'] = Buffer.byteLength(settings.body);
|
|
|
}
|
|
|
} else {
|
|
|
if (typeof settings.data == "object") {
|
|
|
settings.body = _service.urlWithEncodedParameters(settings.url, settings.data)
|
|
|
} else {
|
|
|
settings.body = settings.data;
|
|
|
}
|
|
|
if (isNode) {
|
|
|
settings.headers['Content-Length'] = Buffer.byteLength(postData);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
if (isNode) {
|
|
|
let nodeClient = null;
|
|
|
if (settings.url.toLowerCase().startsWith('http://')) {
|
|
|
nodeClient = nodeHTTP;
|
|
|
} else if (settings.url.toLowerCase().startsWith('https://')) {
|
|
|
nodeClient = nodeHTTPS;
|
|
|
} else {
|
|
|
throw new Error('URL with an invalid protocol. Only is supported HTTP or HTTPS.');
|
|
|
}
|
|
|
const nodeClientResponse = (response) => {
|
|
|
if (settings.encoding) {
|
|
|
response.setEncoding(settings.encoding);
|
|
|
}
|
|
|
const contentType = response.headers['content-type'];
|
|
|
const info = {
|
|
|
ok: response.statusCode >= 200 && response.statusCode < 300,
|
|
|
status: response.statusCode,
|
|
|
isJSON: contentType && contentType.toLowerCase().indexOf("application/json") == 0,
|
|
|
contentType: contentType,
|
|
|
response: response
|
|
|
};
|
|
|
if (response.statusCode == 204) {
|
|
|
return settings.success({...info});
|
|
|
} else {
|
|
|
let textData = '';
|
|
|
let blobData = [];
|
|
|
response.on('data', (chunk) => {
|
|
|
if (settings.blob && info.ok) {
|
|
|
blobData = blobData.concat([...chunk]);
|
|
|
} else {
|
|
|
textData += chunk;
|
|
|
}
|
|
|
});
|
|
|
response.on('end', () => {
|
|
|
if (info.ok) {
|
|
|
if (settings.blob) {
|
|
|
return settings.success({
|
|
|
...info,
|
|
|
blob: blobData
|
|
|
});
|
|
|
}
|
|
|
if (info.isJSON) {
|
|
|
try {
|
|
|
return settings.success({
|
|
|
...info,
|
|
|
json: JSON.parse(textData)
|
|
|
});
|
|
|
} catch (e) { }
|
|
|
}
|
|
|
return settings.success({
|
|
|
...info,
|
|
|
text: textData
|
|
|
});
|
|
|
}
|
|
|
if (info.isJSON) {
|
|
|
try {
|
|
|
return settings.fail({
|
|
|
...info,
|
|
|
error: new Error(`Service failed responding status ${info.status}.`),
|
|
|
json: JSON.parse(textData)
|
|
|
});
|
|
|
} catch (e) { }
|
|
|
}
|
|
|
return settings.fail({
|
|
|
...info,
|
|
|
error: new Error(`Service failed responding status ${info.status}.`),
|
|
|
text: textData
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
};
|
|
|
let nodeClientRequest = null;
|
|
|
if (settings.method.toUpperCase() === 'GET') {
|
|
|
nodeClientRequest = nodeClient.get(settings.url, settings, nodeClientResponse);
|
|
|
} else {
|
|
|
nodeClientRequest = nodeClient.request(settings.url, settings, nodeClientResponse);
|
|
|
}
|
|
|
nodeClientRequest.on("error", (e) => {
|
|
|
settings.fail({
|
|
|
error: e
|
|
|
});
|
|
|
});
|
|
|
if (settings.timeout && settings.timeout > 0) {
|
|
|
nodeClientRequest.setTimeout(settings.timeout, () => {
|
|
|
nodeClientRequest.abort();
|
|
|
});
|
|
|
}
|
|
|
if (settings.method.toUpperCase() !== 'GET') {
|
|
|
nodeClientRequest.write(settings.body);
|
|
|
nodeClientRequest.end();
|
|
|
}
|
|
|
} else {
|
|
|
fetch(settings.url, settings).then(
|
|
|
(response) => {
|
|
|
const contentType = response.headers.get("Content-Type");
|
|
|
const info = {
|
|
|
ok: response.ok,
|
|
|
status: response.status,
|
|
|
isJSON: contentType && contentType.toLowerCase().indexOf("application/json") == 0,
|
|
|
contentType: contentType,
|
|
|
response: response
|
|
|
};
|
|
|
if (info.ok) {
|
|
|
if (response.status == 204) {
|
|
|
return settings.success({...info});
|
|
|
}
|
|
|
if (settings.blob) {
|
|
|
return response.blob().then((blob) => {
|
|
|
return settings.success({
|
|
|
...info,
|
|
|
blob: blob
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
if (info.isJSON) {
|
|
|
return response.json().then((data) => {
|
|
|
return settings.success({
|
|
|
...info,
|
|
|
json: data
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
return response.text().then((text) => {
|
|
|
return settings.success({
|
|
|
...info,
|
|
|
text: text
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
if (info.isJSON) {
|
|
|
return response.json().then((data) => {
|
|
|
return settings.fail({
|
|
|
...info,
|
|
|
error: new Error(`Service failed responding status ${info.status}.`),
|
|
|
json: data
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
return response.text().then((text) => {
|
|
|
return settings.fail({
|
|
|
...info,
|
|
|
error: new Error(`Service failed responding status ${info.status}.`),
|
|
|
text: text
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
).catch(
|
|
|
(e) => {
|
|
|
return settings.fail({
|
|
|
error: e
|
|
|
});
|
|
|
}
|
|
|
)
|
|
|
}
|
|
|
};
|
|
|
|
|
|
_service.urlWithEncodedParameters = (url, obj) => {
|
|
|
const params = _service.encodedParameters(obj);
|
|
|
if (params != "") {
|
|
|
return `${url}?${params}`;
|
|
|
}
|
|
|
return url;
|
|
|
};
|
|
|
|
|
|
_service.encodedParameters = (obj) => {
|
|
|
const params = Object.keys(obj).reduce((a, k) => {
|
|
|
const v = encodeURIComponent(obj[k])
|
|
|
a.push(`${k}=${v}`)
|
|
|
return a
|
|
|
}, []).join('&');
|
|
|
return params;
|
|
|
};
|
|
|
|
|
|
_service.randomString = (length) => {
|
|
|
let result = '';
|
|
|
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
|
|
|
for (let i = 0; i < length; i++) {
|
|
|
result += chars.charAt(Math.floor(Math.random() * chars.length));
|
|
|
}
|
|
|
return result;
|
|
|
}
|
|
|
|
|
|
_service.config = (settings) => {
|
|
|
if (!!settings) {
|
|
|
(0,just_extend__WEBPACK_IMPORTED_MODULE_0__["default"])(true, config, settings);
|
|
|
}
|
|
|
const newConfig = {};
|
|
|
(0,just_extend__WEBPACK_IMPORTED_MODULE_0__["default"])(true, newConfig, config);
|
|
|
return newConfig;
|
|
|
};
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_service);
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/just-extend/index.mjs":
|
|
|
/*!********************************************!*\
|
|
|
!*** ./node_modules/just-extend/index.mjs ***!
|
|
|
\********************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (/* binding */ objectExtend)
|
|
|
/* harmony export */ });
|
|
|
var objectExtend = extend;
|
|
|
|
|
|
/*
|
|
|
var obj = {a: 3, b: 5};
|
|
|
extend(obj, {a: 4, c: 8}); // {a: 4, b: 5, c: 8}
|
|
|
obj; // {a: 4, b: 5, c: 8}
|
|
|
|
|
|
var obj = {a: 3, b: 5};
|
|
|
extend({}, obj, {a: 4, c: 8}); // {a: 4, b: 5, c: 8}
|
|
|
obj; // {a: 3, b: 5}
|
|
|
|
|
|
var arr = [1, 2, 3];
|
|
|
var obj = {a: 3, b: 5};
|
|
|
extend(obj, {c: arr}); // {a: 3, b: 5, c: [1, 2, 3]}
|
|
|
arr.push(4);
|
|
|
obj; // {a: 3, b: 5, c: [1, 2, 3, 4]}
|
|
|
|
|
|
var arr = [1, 2, 3];
|
|
|
var obj = {a: 3, b: 5};
|
|
|
extend(true, obj, {c: arr}); // {a: 3, b: 5, c: [1, 2, 3]}
|
|
|
arr.push(4);
|
|
|
obj; // {a: 3, b: 5, c: [1, 2, 3]}
|
|
|
|
|
|
extend({a: 4, b: 5}); // {a: 4, b: 5}
|
|
|
extend({a: 4, b: 5}, 3); {a: 4, b: 5}
|
|
|
extend({a: 4, b: 5}, true); {a: 4, b: 5}
|
|
|
extend('hello', {a: 4, b: 5}); // throws
|
|
|
extend(3, {a: 4, b: 5}); // throws
|
|
|
*/
|
|
|
|
|
|
function extend(/* [deep], obj1, obj2, [objn] */) {
|
|
|
var args = [].slice.call(arguments);
|
|
|
var deep = false;
|
|
|
if (typeof args[0] == 'boolean') {
|
|
|
deep = args.shift();
|
|
|
}
|
|
|
var result = args[0];
|
|
|
if (isUnextendable(result)) {
|
|
|
throw new Error('extendee must be an object');
|
|
|
}
|
|
|
var extenders = args.slice(1);
|
|
|
var len = extenders.length;
|
|
|
for (var i = 0; i < len; i++) {
|
|
|
var extender = extenders[i];
|
|
|
for (var key in extender) {
|
|
|
if (Object.prototype.hasOwnProperty.call(extender, key)) {
|
|
|
var value = extender[key];
|
|
|
if (deep && isCloneable(value)) {
|
|
|
var base = Array.isArray(value) ? [] : {};
|
|
|
result[key] = extend(
|
|
|
true,
|
|
|
Object.prototype.hasOwnProperty.call(result, key) && !isUnextendable(result[key])
|
|
|
? result[key]
|
|
|
: base,
|
|
|
value
|
|
|
);
|
|
|
} else {
|
|
|
result[key] = value;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
return result;
|
|
|
}
|
|
|
|
|
|
function isCloneable(obj) {
|
|
|
return Array.isArray(obj) || {}.toString.call(obj) == '[object Object]';
|
|
|
}
|
|
|
|
|
|
function isUnextendable(val) {
|
|
|
return !val || (typeof val != 'object' && typeof val != 'function');
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/stylis/src/Enum.js":
|
|
|
/*!*****************************************!*\
|
|
|
!*** ./node_modules/stylis/src/Enum.js ***!
|
|
|
\*****************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "CHARSET": () => (/* binding */ CHARSET),
|
|
|
/* harmony export */ "COMMENT": () => (/* binding */ COMMENT),
|
|
|
/* harmony export */ "COUNTER_STYLE": () => (/* binding */ COUNTER_STYLE),
|
|
|
/* harmony export */ "DECLARATION": () => (/* binding */ DECLARATION),
|
|
|
/* harmony export */ "DOCUMENT": () => (/* binding */ DOCUMENT),
|
|
|
/* harmony export */ "FONT_FACE": () => (/* binding */ FONT_FACE),
|
|
|
/* harmony export */ "FONT_FEATURE_VALUES": () => (/* binding */ FONT_FEATURE_VALUES),
|
|
|
/* harmony export */ "IMPORT": () => (/* binding */ IMPORT),
|
|
|
/* harmony export */ "KEYFRAMES": () => (/* binding */ KEYFRAMES),
|
|
|
/* harmony export */ "MEDIA": () => (/* binding */ MEDIA),
|
|
|
/* harmony export */ "MOZ": () => (/* binding */ MOZ),
|
|
|
/* harmony export */ "MS": () => (/* binding */ MS),
|
|
|
/* harmony export */ "NAMESPACE": () => (/* binding */ NAMESPACE),
|
|
|
/* harmony export */ "PAGE": () => (/* binding */ PAGE),
|
|
|
/* harmony export */ "RULESET": () => (/* binding */ RULESET),
|
|
|
/* harmony export */ "SUPPORTS": () => (/* binding */ SUPPORTS),
|
|
|
/* harmony export */ "VIEWPORT": () => (/* binding */ VIEWPORT),
|
|
|
/* harmony export */ "WEBKIT": () => (/* binding */ WEBKIT)
|
|
|
/* harmony export */ });
|
|
|
var MS = '-ms-'
|
|
|
var MOZ = '-moz-'
|
|
|
var WEBKIT = '-webkit-'
|
|
|
|
|
|
var COMMENT = 'comm'
|
|
|
var RULESET = 'rule'
|
|
|
var DECLARATION = 'decl'
|
|
|
|
|
|
var PAGE = '@page'
|
|
|
var MEDIA = '@media'
|
|
|
var IMPORT = '@import'
|
|
|
var CHARSET = '@charset'
|
|
|
var VIEWPORT = '@viewport'
|
|
|
var SUPPORTS = '@supports'
|
|
|
var DOCUMENT = '@document'
|
|
|
var NAMESPACE = '@namespace'
|
|
|
var KEYFRAMES = '@keyframes'
|
|
|
var FONT_FACE = '@font-face'
|
|
|
var COUNTER_STYLE = '@counter-style'
|
|
|
var FONT_FEATURE_VALUES = '@font-feature-values'
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/stylis/src/Parser.js":
|
|
|
/*!*******************************************!*\
|
|
|
!*** ./node_modules/stylis/src/Parser.js ***!
|
|
|
\*******************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "comment": () => (/* binding */ comment),
|
|
|
/* harmony export */ "compile": () => (/* binding */ compile),
|
|
|
/* harmony export */ "declaration": () => (/* binding */ declaration),
|
|
|
/* harmony export */ "parse": () => (/* binding */ parse),
|
|
|
/* harmony export */ "ruleset": () => (/* binding */ ruleset)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _Enum_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Enum.js */ "./node_modules/stylis/src/Enum.js");
|
|
|
/* harmony import */ var _Utility_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utility.js */ "./node_modules/stylis/src/Utility.js");
|
|
|
/* harmony import */ var _Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Tokenizer.js */ "./node_modules/stylis/src/Tokenizer.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @return {object[]}
|
|
|
*/
|
|
|
function compile (value) {
|
|
|
return (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.dealloc)(parse('', null, null, null, [''], value = (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.alloc)(value), 0, [0], value))
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {object} root
|
|
|
* @param {object?} parent
|
|
|
* @param {string[]} rule
|
|
|
* @param {string[]} rules
|
|
|
* @param {string[]} rulesets
|
|
|
* @param {number[]} pseudo
|
|
|
* @param {number[]} points
|
|
|
* @param {string[]} declarations
|
|
|
* @return {object}
|
|
|
*/
|
|
|
function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {
|
|
|
var index = 0
|
|
|
var offset = 0
|
|
|
var length = pseudo
|
|
|
var atrule = 0
|
|
|
var property = 0
|
|
|
var previous = 0
|
|
|
var variable = 1
|
|
|
var scanning = 1
|
|
|
var ampersand = 1
|
|
|
var character = 0
|
|
|
var type = ''
|
|
|
var props = rules
|
|
|
var children = rulesets
|
|
|
var reference = rule
|
|
|
var characters = type
|
|
|
|
|
|
while (scanning)
|
|
|
switch (previous = character, character = (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.next)()) {
|
|
|
// (
|
|
|
case 40:
|
|
|
if (previous != 108 && (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.charat)(characters, length - 1) == 58) {
|
|
|
if ((0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.indexof)(characters += (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.replace)((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.delimit)(character), '&', '&\f'), '&\f') != -1)
|
|
|
ampersand = -1
|
|
|
break
|
|
|
}
|
|
|
// " ' [
|
|
|
case 34: case 39: case 91:
|
|
|
characters += (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.delimit)(character)
|
|
|
break
|
|
|
// \t \n \r \s
|
|
|
case 9: case 10: case 13: case 32:
|
|
|
characters += (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.whitespace)(previous)
|
|
|
break
|
|
|
// \
|
|
|
case 92:
|
|
|
characters += (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.escaping)((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.caret)() - 1, 7)
|
|
|
continue
|
|
|
// /
|
|
|
case 47:
|
|
|
switch ((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.peek)()) {
|
|
|
case 42: case 47:
|
|
|
;(0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.append)(comment((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.commenter)((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.next)(), (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.caret)()), root, parent), declarations)
|
|
|
break
|
|
|
default:
|
|
|
characters += '/'
|
|
|
}
|
|
|
break
|
|
|
// {
|
|
|
case 123 * variable:
|
|
|
points[index++] = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.strlen)(characters) * ampersand
|
|
|
// } ; \0
|
|
|
case 125 * variable: case 59: case 0:
|
|
|
switch (character) {
|
|
|
// \0 }
|
|
|
case 0: case 125: scanning = 0
|
|
|
// ;
|
|
|
case 59 + offset:
|
|
|
if (property > 0 && ((0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.strlen)(characters) - length))
|
|
|
(0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.append)(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration((0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.replace)(characters, ' ', '') + ';', rule, parent, length - 2), declarations)
|
|
|
break
|
|
|
// @ ;
|
|
|
case 59: characters += ';'
|
|
|
// { rule/at-rule
|
|
|
default:
|
|
|
;(0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.append)(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets)
|
|
|
|
|
|
if (character === 123)
|
|
|
if (offset === 0)
|
|
|
parse(characters, root, reference, reference, props, rulesets, length, points, children)
|
|
|
else
|
|
|
switch (atrule === 99 && (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.charat)(characters, 3) === 110 ? 100 : atrule) {
|
|
|
// d m s
|
|
|
case 100: case 109: case 115:
|
|
|
parse(value, reference, reference, rule && (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.append)(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children)
|
|
|
break
|
|
|
default:
|
|
|
parse(characters, reference, reference, reference, [''], children, 0, points, children)
|
|
|
}
|
|
|
}
|
|
|
|
|
|
index = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo
|
|
|
break
|
|
|
// :
|
|
|
case 58:
|
|
|
length = 1 + (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.strlen)(characters), property = previous
|
|
|
default:
|
|
|
if (variable < 1)
|
|
|
if (character == 123)
|
|
|
--variable
|
|
|
else if (character == 125 && variable++ == 0 && (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.prev)() == 125)
|
|
|
continue
|
|
|
|
|
|
switch (characters += (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.from)(character), character * variable) {
|
|
|
// &
|
|
|
case 38:
|
|
|
ampersand = offset > 0 ? 1 : (characters += '\f', -1)
|
|
|
break
|
|
|
// ,
|
|
|
case 44:
|
|
|
points[index++] = ((0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.strlen)(characters) - 1) * ampersand, ampersand = 1
|
|
|
break
|
|
|
// @
|
|
|
case 64:
|
|
|
// -
|
|
|
if ((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.peek)() === 45)
|
|
|
characters += (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.delimit)((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.next)())
|
|
|
|
|
|
atrule = (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.peek)(), offset = length = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.strlen)(type = characters += (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.identifier)((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.caret)())), character++
|
|
|
break
|
|
|
// -
|
|
|
case 45:
|
|
|
if (previous === 45 && (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.strlen)(characters) == 2)
|
|
|
variable = 0
|
|
|
}
|
|
|
}
|
|
|
|
|
|
return rulesets
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {object} root
|
|
|
* @param {object?} parent
|
|
|
* @param {number} index
|
|
|
* @param {number} offset
|
|
|
* @param {string[]} rules
|
|
|
* @param {number[]} points
|
|
|
* @param {string} type
|
|
|
* @param {string[]} props
|
|
|
* @param {string[]} children
|
|
|
* @param {number} length
|
|
|
* @return {object}
|
|
|
*/
|
|
|
function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {
|
|
|
var post = offset - 1
|
|
|
var rule = offset === 0 ? rules : ['']
|
|
|
var size = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.sizeof)(rule)
|
|
|
|
|
|
for (var i = 0, j = 0, k = 0; i < index; ++i)
|
|
|
for (var x = 0, y = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.substr)(value, post + 1, post = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.abs)(j = points[i])), z = value; x < size; ++x)
|
|
|
if (z = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.trim)(j > 0 ? rule[x] + ' ' + y : (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.replace)(y, /&\f/g, rule[x])))
|
|
|
props[k++] = z
|
|
|
|
|
|
return (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.node)(value, root, parent, offset === 0 ? _Enum_js__WEBPACK_IMPORTED_MODULE_2__.RULESET : type, props, children, length)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} value
|
|
|
* @param {object} root
|
|
|
* @param {object?} parent
|
|
|
* @return {object}
|
|
|
*/
|
|
|
function comment (value, root, parent) {
|
|
|
return (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.node)(value, root, parent, _Enum_js__WEBPACK_IMPORTED_MODULE_2__.COMMENT, (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.from)((0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.char)()), (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.substr)(value, 2, -2), 0)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {object} root
|
|
|
* @param {object?} parent
|
|
|
* @param {number} length
|
|
|
* @return {object}
|
|
|
*/
|
|
|
function declaration (value, root, parent, length) {
|
|
|
return (0,_Tokenizer_js__WEBPACK_IMPORTED_MODULE_0__.node)(value, root, parent, _Enum_js__WEBPACK_IMPORTED_MODULE_2__.DECLARATION, (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.substr)(value, 0, length), (0,_Utility_js__WEBPACK_IMPORTED_MODULE_1__.substr)(value, length + 1, -1), length)
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/stylis/src/Serializer.js":
|
|
|
/*!***********************************************!*\
|
|
|
!*** ./node_modules/stylis/src/Serializer.js ***!
|
|
|
\***********************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "serialize": () => (/* binding */ serialize),
|
|
|
/* harmony export */ "stringify": () => (/* binding */ stringify)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _Enum_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Enum.js */ "./node_modules/stylis/src/Enum.js");
|
|
|
/* harmony import */ var _Utility_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Utility.js */ "./node_modules/stylis/src/Utility.js");
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
* @param {object[]} children
|
|
|
* @param {function} callback
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function serialize (children, callback) {
|
|
|
var output = ''
|
|
|
var length = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.sizeof)(children)
|
|
|
|
|
|
for (var i = 0; i < length; i++)
|
|
|
output += callback(children[i], i, children, callback) || ''
|
|
|
|
|
|
return output
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {object} element
|
|
|
* @param {number} index
|
|
|
* @param {object[]} children
|
|
|
* @param {function} callback
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function stringify (element, index, children, callback) {
|
|
|
switch (element.type) {
|
|
|
case _Enum_js__WEBPACK_IMPORTED_MODULE_1__.IMPORT: case _Enum_js__WEBPACK_IMPORTED_MODULE_1__.DECLARATION: return element.return = element.return || element.value
|
|
|
case _Enum_js__WEBPACK_IMPORTED_MODULE_1__.COMMENT: return ''
|
|
|
case _Enum_js__WEBPACK_IMPORTED_MODULE_1__.KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'
|
|
|
case _Enum_js__WEBPACK_IMPORTED_MODULE_1__.RULESET: element.value = element.props.join(',')
|
|
|
}
|
|
|
|
|
|
return (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.strlen)(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/stylis/src/Tokenizer.js":
|
|
|
/*!**********************************************!*\
|
|
|
!*** ./node_modules/stylis/src/Tokenizer.js ***!
|
|
|
\**********************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "alloc": () => (/* binding */ alloc),
|
|
|
/* harmony export */ "caret": () => (/* binding */ caret),
|
|
|
/* harmony export */ "char": () => (/* binding */ char),
|
|
|
/* harmony export */ "character": () => (/* binding */ character),
|
|
|
/* harmony export */ "characters": () => (/* binding */ characters),
|
|
|
/* harmony export */ "column": () => (/* binding */ column),
|
|
|
/* harmony export */ "commenter": () => (/* binding */ commenter),
|
|
|
/* harmony export */ "copy": () => (/* binding */ copy),
|
|
|
/* harmony export */ "dealloc": () => (/* binding */ dealloc),
|
|
|
/* harmony export */ "delimit": () => (/* binding */ delimit),
|
|
|
/* harmony export */ "delimiter": () => (/* binding */ delimiter),
|
|
|
/* harmony export */ "escaping": () => (/* binding */ escaping),
|
|
|
/* harmony export */ "identifier": () => (/* binding */ identifier),
|
|
|
/* harmony export */ "length": () => (/* binding */ length),
|
|
|
/* harmony export */ "line": () => (/* binding */ line),
|
|
|
/* harmony export */ "next": () => (/* binding */ next),
|
|
|
/* harmony export */ "node": () => (/* binding */ node),
|
|
|
/* harmony export */ "peek": () => (/* binding */ peek),
|
|
|
/* harmony export */ "position": () => (/* binding */ position),
|
|
|
/* harmony export */ "prev": () => (/* binding */ prev),
|
|
|
/* harmony export */ "slice": () => (/* binding */ slice),
|
|
|
/* harmony export */ "token": () => (/* binding */ token),
|
|
|
/* harmony export */ "tokenize": () => (/* binding */ tokenize),
|
|
|
/* harmony export */ "tokenizer": () => (/* binding */ tokenizer),
|
|
|
/* harmony export */ "whitespace": () => (/* binding */ whitespace)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _Utility_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Utility.js */ "./node_modules/stylis/src/Utility.js");
|
|
|
|
|
|
|
|
|
var line = 1
|
|
|
var column = 1
|
|
|
var length = 0
|
|
|
var position = 0
|
|
|
var character = 0
|
|
|
var characters = ''
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {object | null} root
|
|
|
* @param {object | null} parent
|
|
|
* @param {string} type
|
|
|
* @param {string[] | string} props
|
|
|
* @param {object[] | string} children
|
|
|
* @param {number} length
|
|
|
*/
|
|
|
function node (value, root, parent, type, props, children, length) {
|
|
|
return {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {object} root
|
|
|
* @param {object} props
|
|
|
* @return {object}
|
|
|
*/
|
|
|
function copy (root, props) {
|
|
|
return (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.assign)(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function char () {
|
|
|
return character
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function prev () {
|
|
|
character = position > 0 ? (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.charat)(characters, --position) : 0
|
|
|
|
|
|
if (column--, character === 10)
|
|
|
column = 1, line--
|
|
|
|
|
|
return character
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function next () {
|
|
|
character = position < length ? (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.charat)(characters, position++) : 0
|
|
|
|
|
|
if (column++, character === 10)
|
|
|
column = 1, line++
|
|
|
|
|
|
return character
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function peek () {
|
|
|
return (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.charat)(characters, position)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function caret () {
|
|
|
return position
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} begin
|
|
|
* @param {number} end
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function slice (begin, end) {
|
|
|
return (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.substr)(characters, begin, end)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} type
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function token (type) {
|
|
|
switch (type) {
|
|
|
// \0 \t \n \r \s whitespace token
|
|
|
case 0: case 9: case 10: case 13: case 32:
|
|
|
return 5
|
|
|
// ! + , / > @ ~ isolate token
|
|
|
case 33: case 43: case 44: case 47: case 62: case 64: case 126:
|
|
|
// ; { } breakpoint token
|
|
|
case 59: case 123: case 125:
|
|
|
return 4
|
|
|
// : accompanied token
|
|
|
case 58:
|
|
|
return 3
|
|
|
// " ' ( [ opening delimit token
|
|
|
case 34: case 39: case 40: case 91:
|
|
|
return 2
|
|
|
// ) ] closing delimit token
|
|
|
case 41: case 93:
|
|
|
return 1
|
|
|
}
|
|
|
|
|
|
return 0
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @return {any[]}
|
|
|
*/
|
|
|
function alloc (value) {
|
|
|
return line = column = 1, length = (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.strlen)(characters = value), position = 0, []
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {any} value
|
|
|
* @return {any}
|
|
|
*/
|
|
|
function dealloc (value) {
|
|
|
return characters = '', value
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} type
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function delimit (type) {
|
|
|
return (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.trim)(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @return {string[]}
|
|
|
*/
|
|
|
function tokenize (value) {
|
|
|
return dealloc(tokenizer(alloc(value)))
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} type
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function whitespace (type) {
|
|
|
while (character = peek())
|
|
|
if (character < 33)
|
|
|
next()
|
|
|
else
|
|
|
break
|
|
|
|
|
|
return token(type) > 2 || token(character) > 3 ? '' : ' '
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string[]} children
|
|
|
* @return {string[]}
|
|
|
*/
|
|
|
function tokenizer (children) {
|
|
|
while (next())
|
|
|
switch (token(character)) {
|
|
|
case 0: (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.append)(identifier(position - 1), children)
|
|
|
break
|
|
|
case 2: ;(0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.append)(delimit(character), children)
|
|
|
break
|
|
|
default: ;(0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.append)((0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.from)(character), children)
|
|
|
}
|
|
|
|
|
|
return children
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} index
|
|
|
* @param {number} count
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function escaping (index, count) {
|
|
|
while (--count && next())
|
|
|
// not 0-9 A-F a-f
|
|
|
if (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))
|
|
|
break
|
|
|
|
|
|
return slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} type
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function delimiter (type) {
|
|
|
while (next())
|
|
|
switch (character) {
|
|
|
// ] ) " '
|
|
|
case type:
|
|
|
return position
|
|
|
// " '
|
|
|
case 34: case 39:
|
|
|
if (type !== 34 && type !== 39)
|
|
|
delimiter(character)
|
|
|
break
|
|
|
// (
|
|
|
case 40:
|
|
|
if (type === 41)
|
|
|
delimiter(type)
|
|
|
break
|
|
|
// \
|
|
|
case 92:
|
|
|
next()
|
|
|
break
|
|
|
}
|
|
|
|
|
|
return position
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} type
|
|
|
* @param {number} index
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function commenter (type, index) {
|
|
|
while (next())
|
|
|
// //
|
|
|
if (type + character === 47 + 10)
|
|
|
break
|
|
|
// /*
|
|
|
else if (type + character === 42 + 42 && peek() === 47)
|
|
|
break
|
|
|
|
|
|
return '/*' + slice(index, position - 1) + '*' + (0,_Utility_js__WEBPACK_IMPORTED_MODULE_0__.from)(type === 47 ? type : next())
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {number} index
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function identifier (index) {
|
|
|
while (!token(peek()))
|
|
|
next()
|
|
|
|
|
|
return slice(index, position)
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ }),
|
|
|
|
|
|
/***/ "./node_modules/stylis/src/Utility.js":
|
|
|
/*!********************************************!*\
|
|
|
!*** ./node_modules/stylis/src/Utility.js ***!
|
|
|
\********************************************/
|
|
|
/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
|
|
|
|
|
|
"use strict";
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "abs": () => (/* binding */ abs),
|
|
|
/* harmony export */ "append": () => (/* binding */ append),
|
|
|
/* harmony export */ "assign": () => (/* binding */ assign),
|
|
|
/* harmony export */ "charat": () => (/* binding */ charat),
|
|
|
/* harmony export */ "combine": () => (/* binding */ combine),
|
|
|
/* harmony export */ "from": () => (/* binding */ from),
|
|
|
/* harmony export */ "hash": () => (/* binding */ hash),
|
|
|
/* harmony export */ "indexof": () => (/* binding */ indexof),
|
|
|
/* harmony export */ "match": () => (/* binding */ match),
|
|
|
/* harmony export */ "replace": () => (/* binding */ replace),
|
|
|
/* harmony export */ "sizeof": () => (/* binding */ sizeof),
|
|
|
/* harmony export */ "strlen": () => (/* binding */ strlen),
|
|
|
/* harmony export */ "substr": () => (/* binding */ substr),
|
|
|
/* harmony export */ "trim": () => (/* binding */ trim)
|
|
|
/* harmony export */ });
|
|
|
/**
|
|
|
* @param {number}
|
|
|
* @return {number}
|
|
|
*/
|
|
|
var abs = Math.abs
|
|
|
|
|
|
/**
|
|
|
* @param {number}
|
|
|
* @return {string}
|
|
|
*/
|
|
|
var from = String.fromCharCode
|
|
|
|
|
|
/**
|
|
|
* @param {object}
|
|
|
* @return {object}
|
|
|
*/
|
|
|
var assign = Object.assign
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {number} length
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function hash (value, length) {
|
|
|
return charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function trim (value) {
|
|
|
return value.trim()
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {RegExp} pattern
|
|
|
* @return {string?}
|
|
|
*/
|
|
|
function match (value, pattern) {
|
|
|
return (value = pattern.exec(value)) ? value[0] : value
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {(string|RegExp)} pattern
|
|
|
* @param {string} replacement
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function replace (value, pattern, replacement) {
|
|
|
return value.replace(pattern, replacement)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {string} search
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function indexof (value, search) {
|
|
|
return value.indexOf(search)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {number} index
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function charat (value, index) {
|
|
|
return value.charCodeAt(index) | 0
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @param {number} begin
|
|
|
* @param {number} end
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function substr (value, begin, end) {
|
|
|
return value.slice(begin, end)
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string} value
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function strlen (value) {
|
|
|
return value.length
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {any[]} value
|
|
|
* @return {number}
|
|
|
*/
|
|
|
function sizeof (value) {
|
|
|
return value.length
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {any} value
|
|
|
* @param {any[]} array
|
|
|
* @return {any}
|
|
|
*/
|
|
|
function append (value, array) {
|
|
|
return array.push(value), value
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* @param {string[]} array
|
|
|
* @param {function} callback
|
|
|
* @return {string}
|
|
|
*/
|
|
|
function combine (array, callback) {
|
|
|
return array.map(callback).join('')
|
|
|
}
|
|
|
|
|
|
|
|
|
/***/ })
|
|
|
|
|
|
/******/ });
|
|
|
/************************************************************************/
|
|
|
/******/ // The module cache
|
|
|
/******/ var __webpack_module_cache__ = {};
|
|
|
/******/
|
|
|
/******/ // The require function
|
|
|
/******/ function __webpack_require__(moduleId) {
|
|
|
/******/ // Check if module is in cache
|
|
|
/******/ var cachedModule = __webpack_module_cache__[moduleId];
|
|
|
/******/ if (cachedModule !== undefined) {
|
|
|
/******/ return cachedModule.exports;
|
|
|
/******/ }
|
|
|
/******/ // Create a new module (and put it into the cache)
|
|
|
/******/ var module = __webpack_module_cache__[moduleId] = {
|
|
|
/******/ id: moduleId,
|
|
|
/******/ loaded: false,
|
|
|
/******/ exports: {}
|
|
|
/******/ };
|
|
|
/******/
|
|
|
/******/ // Execute the module function
|
|
|
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
|
|
|
/******/
|
|
|
/******/ // Flag the module as loaded
|
|
|
/******/ module.loaded = true;
|
|
|
/******/
|
|
|
/******/ // Return the exports of the module
|
|
|
/******/ return module.exports;
|
|
|
/******/ }
|
|
|
/******/
|
|
|
/************************************************************************/
|
|
|
/******/ /* webpack/runtime/compat get default export */
|
|
|
/******/ (() => {
|
|
|
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
|
/******/ __webpack_require__.n = (module) => {
|
|
|
/******/ var getter = module && module.__esModule ?
|
|
|
/******/ () => (module['default']) :
|
|
|
/******/ () => (module);
|
|
|
/******/ __webpack_require__.d(getter, { a: getter });
|
|
|
/******/ return getter;
|
|
|
/******/ };
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/******/ /* webpack/runtime/define property getters */
|
|
|
/******/ (() => {
|
|
|
/******/ // define getter functions for harmony exports
|
|
|
/******/ __webpack_require__.d = (exports, definition) => {
|
|
|
/******/ for(var key in definition) {
|
|
|
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
|
|
|
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
|
|
|
/******/ }
|
|
|
/******/ }
|
|
|
/******/ };
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/******/ /* webpack/runtime/harmony module decorator */
|
|
|
/******/ (() => {
|
|
|
/******/ __webpack_require__.hmd = (module) => {
|
|
|
/******/ module = Object.create(module);
|
|
|
/******/ if (!module.children) module.children = [];
|
|
|
/******/ Object.defineProperty(module, 'exports', {
|
|
|
/******/ enumerable: true,
|
|
|
/******/ set: () => {
|
|
|
/******/ throw new Error('ES Modules may not assign module.exports or exports.*, Use ESM export syntax, instead: ' + module.id);
|
|
|
/******/ }
|
|
|
/******/ });
|
|
|
/******/ return module;
|
|
|
/******/ };
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
|
/******/ (() => {
|
|
|
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/******/ /* webpack/runtime/make namespace object */
|
|
|
/******/ (() => {
|
|
|
/******/ // define __esModule on exports
|
|
|
/******/ __webpack_require__.r = (exports) => {
|
|
|
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
|
|
|
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
/******/ }
|
|
|
/******/ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
/******/ };
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/******/ /* webpack/runtime/node module decorator */
|
|
|
/******/ (() => {
|
|
|
/******/ __webpack_require__.nmd = (module) => {
|
|
|
/******/ module.paths = [];
|
|
|
/******/ if (!module.children) module.children = [];
|
|
|
/******/ return module;
|
|
|
/******/ };
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/******/ /* webpack/runtime/nonce */
|
|
|
/******/ (() => {
|
|
|
/******/ __webpack_require__.nc = undefined;
|
|
|
/******/ })();
|
|
|
/******/
|
|
|
/************************************************************************/
|
|
|
var __webpack_exports__ = {};
|
|
|
// This entry need to be wrapped in an IIFE because it need to be in strict mode.
|
|
|
(() => {
|
|
|
"use strict";
|
|
|
var __webpack_exports__ = {};
|
|
|
/*!**********************!*\
|
|
|
!*** ./src/index.js ***!
|
|
|
\**********************/
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
|
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom/client */ "./node_modules/react-dom/client.js");
|
|
|
/* harmony import */ var _netuno_service_client__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @netuno/service-client */ "./node_modules/@netuno/service-client/index.mjs");
|
|
|
/* harmony import */ var _containers_DashboardContainer__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./containers/DashboardContainer */ "./src/containers/DashboardContainer/index.js");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_netuno_service_client__WEBPACK_IMPORTED_MODULE_2__["default"].config({
|
|
|
prefix: netuno.config.urlServices
|
|
|
});
|
|
|
var dashboardDiv = document.getElementById("app-dashboard");
|
|
|
var dashboardContainer = dashboardDiv ? react_dom_client__WEBPACK_IMPORTED_MODULE_1__.createRoot(dashboardDiv) : false;
|
|
|
if (dashboardContainer) {
|
|
|
dashboardContainer.render( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_DashboardContainer__WEBPACK_IMPORTED_MODULE_3__["default"], null));
|
|
|
}
|
|
|
netuno.addNavigationLoad(function () {
|
|
|
$('[netuno-navigation]').find('a').on('netuno:click', function (e) {
|
|
|
var link = $(e.target);
|
|
|
if (dashboardContainer && link.is('[netuno-navigation-dashboard]')) {
|
|
|
// Menu > Dashboard > Clicked!
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
netuno.addContentLoad(function (container) {
|
|
|
// When any content is loaded dinamically this is executed...
|
|
|
if (container.is('[netuno-form-search="YOUR_FORM_NAME"]')) {
|
|
|
// When search page is loaded...
|
|
|
} else if (container.is('[netuno-form-edit="YOUR_FORM_NAME"]')) {
|
|
|
// When form edit is loaded...
|
|
|
}
|
|
|
});
|
|
|
netuno.addPageLoad(function () {
|
|
|
// When page is loaded...
|
|
|
var modal = $('#app-dashboard-modal-form');
|
|
|
modal.on('hidden.bs.modal', function () {
|
|
|
modal.find('[netuno-form-edit]').empty();
|
|
|
});
|
|
|
$('#app-dashboard-modal-form-button').on('click', function () {
|
|
|
modal.modal('show');
|
|
|
netuno.loadFormEdit(modal.find('[netuno-form]'));
|
|
|
});
|
|
|
modal.find('[netuno-form]').on('netuno:save', function () {
|
|
|
modal.modal('hide');
|
|
|
});
|
|
|
});
|
|
|
})();
|
|
|
|
|
|
// This entry need to be wrapped in an IIFE because it need to be in strict mode.
|
|
|
(() => {
|
|
|
"use strict";
|
|
|
/*!******************************!*\
|
|
|
!*** ./src/styles/main.less ***!
|
|
|
\******************************/
|
|
|
__webpack_require__.r(__webpack_exports__);
|
|
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
|
/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
|
|
|
/* harmony export */ });
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js */ "./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/styleDomAPI.js */ "./node_modules/style-loader/dist/runtime/styleDomAPI.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/insertBySelector.js */ "./node_modules/style-loader/dist/runtime/insertBySelector.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js */ "./node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/insertStyleElement.js */ "./node_modules/style-loader/dist/runtime/insertStyleElement.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4__);
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! !../../node_modules/style-loader/dist/runtime/styleTagTransform.js */ "./node_modules/style-loader/dist/runtime/styleTagTransform.js");
|
|
|
/* harmony import */ var _node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5__);
|
|
|
/* harmony import */ var _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_less__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! !!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!../../node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./main.less */ "./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/less-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/styles/main.less");
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var options = {};
|
|
|
|
|
|
options.styleTagTransform = (_node_modules_style_loader_dist_runtime_styleTagTransform_js__WEBPACK_IMPORTED_MODULE_5___default());
|
|
|
options.setAttributes = (_node_modules_style_loader_dist_runtime_setAttributesWithoutAttributes_js__WEBPACK_IMPORTED_MODULE_3___default());
|
|
|
|
|
|
options.insert = _node_modules_style_loader_dist_runtime_insertBySelector_js__WEBPACK_IMPORTED_MODULE_2___default().bind(null, "head");
|
|
|
|
|
|
options.domAPI = (_node_modules_style_loader_dist_runtime_styleDomAPI_js__WEBPACK_IMPORTED_MODULE_1___default());
|
|
|
options.insertStyleElement = (_node_modules_style_loader_dist_runtime_insertStyleElement_js__WEBPACK_IMPORTED_MODULE_4___default());
|
|
|
|
|
|
var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js__WEBPACK_IMPORTED_MODULE_0___default()(_node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_less__WEBPACK_IMPORTED_MODULE_6__["default"], options);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_less__WEBPACK_IMPORTED_MODULE_6__["default"] && _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_less__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_less_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_less__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined);
|
|
|
|
|
|
})();
|
|
|
|
|
|
/******/ })()
|
|
|
;
|
|
|
//# sourceMappingURL=main.js.map
|