diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION
index e224a80073caa..9d874bc6a5368 100644
--- a/compiled/facebook-www/REVISION
+++ b/compiled/facebook-www/REVISION
@@ -1 +1 @@
-7cbd026ff4ff833db2a2f2271f95cb2b91cb3895
+66924457594bc28eb2f3f39c7c61d54b931c188e
diff --git a/compiled/facebook-www/React-dev.classic.js b/compiled/facebook-www/React-dev.classic.js
index 3c21449fdd357..e20321ebfc755 100644
--- a/compiled/facebook-www/React-dev.classic.js
+++ b/compiled/facebook-www/React-dev.classic.js
@@ -24,7 +24,7 @@ if (__DEV__) {
) {
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
}
- var ReactVersion = "18.3.0-www-classic-14d23768";
+ var ReactVersion = "18.3.0-www-classic-12d69e63";
// ATTENTION
// When adding new symbols to this file,
@@ -1677,2018 +1677,2018 @@ if (__DEV__) {
}
}
- var REACT_CLIENT_REFERENCE$1 = Symbol.for("react.client.reference");
-
- 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$1;
+ var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
+ var RESERVED_PROPS = {
+ key: true,
+ ref: true,
+ __self: true,
+ __source: true
+ };
+ var specialPropKeyWarningShown;
+ var specialPropRefWarningShown;
+ var didWarnAboutStringRefs;
{
- propTypesMisspellWarningShown$1 = false;
+ didWarnAboutStringRefs = {};
}
- function getDeclarationErrorAddendum$1() {
- if (ReactCurrentOwner$2.current) {
- var name = getComponentNameFromType(ReactCurrentOwner$2.current.type);
+ function hasValidRef(config) {
+ {
+ if (hasOwnProperty.call(config, "ref")) {
+ var getter = Object.getOwnPropertyDescriptor(config, "ref").get;
- if (name) {
- return "\n\nCheck the render method of `" + name + "`.";
+ if (getter && getter.isReactWarning) {
+ return false;
+ }
}
}
- return "";
+ return config.ref !== undefined;
}
- function getSourceInfoErrorAddendum$1(source) {
- if (source !== undefined) {
- var fileName = source.fileName.replace(/^.*[\\\/]/, "");
- var lineNumber = source.lineNumber;
- return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
- }
-
- return "";
- }
+ function hasValidKey(config) {
+ {
+ if (hasOwnProperty.call(config, "key")) {
+ var getter = Object.getOwnPropertyDescriptor(config, "key").get;
- function getSourceInfoErrorAddendumForProps(elementProps) {
- if (elementProps !== null && elementProps !== undefined) {
- return getSourceInfoErrorAddendum$1(elementProps.__source);
+ if (getter && getter.isReactWarning) {
+ return false;
+ }
+ }
}
- return "";
+ return config.key !== undefined;
}
- /**
- * 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$1 = {};
-
- function getCurrentComponentErrorInfo$1(parentType) {
- var info = getDeclarationErrorAddendum$1();
+ function warnIfStringRefCannotBeAutoConverted(config, self) {
+ {
+ if (
+ typeof config.ref === "string" &&
+ ReactCurrentOwner$1.current &&
+ self &&
+ ReactCurrentOwner$1.current.stateNode !== self
+ ) {
+ var componentName = getComponentNameFromType(
+ ReactCurrentOwner$1.current.type
+ );
- if (!info) {
- var parentName = getComponentNameFromType(parentType);
+ 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",
+ getComponentNameFromType(ReactCurrentOwner$1.current.type),
+ config.ref
+ );
- if (parentName) {
- info =
- "\n\nCheck the top-level render call using <" + parentName + ">.";
+ didWarnAboutStringRefs[componentName] = true;
+ }
}
}
-
- 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$1(element, parentType) {
- if (!element._store || element._store.validated || element.key != null) {
- return;
- }
-
- element._store.validated = true;
- var currentComponentErrorInfo =
- getCurrentComponentErrorInfo$1(parentType);
-
- if (ownerHasKeyUseWarning$1[currentComponentErrorInfo]) {
- return;
- }
- ownerHasKeyUseWarning$1[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.
+ function defineKeyPropWarningGetter(props, displayName) {
+ {
+ var warnAboutAccessingKey = function () {
+ if (!specialPropKeyWarningShown) {
+ specialPropKeyWarningShown = true;
- var childOwner = "";
+ 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
+ );
+ }
+ };
- if (
- element &&
- element._owner &&
- element._owner !== ReactCurrentOwner$2.current
- ) {
- // Give the component that originally created this child.
- childOwner =
- " It was passed a child from " +
- getComponentNameFromType(element._owner.type) +
- ".";
+ warnAboutAccessingKey.isReactWarning = true;
+ Object.defineProperty(props, "key", {
+ get: warnAboutAccessingKey,
+ configurable: true
+ });
}
+ }
+ function defineRefPropWarningGetter(props, displayName) {
{
- setCurrentlyValidatingElement$1(element);
+ var warnAboutAccessingRef = function () {
+ if (!specialPropRefWarningShown) {
+ specialPropRefWarningShown = true;
- 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
- );
+ 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
+ );
+ }
+ };
- setCurrentlyValidatingElement$1(null);
+ warnAboutAccessingRef.isReactWarning = true;
+ Object.defineProperty(props, "ref", {
+ get: warnAboutAccessingRef,
+ configurable: true
+ });
}
}
/**
- * 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.
+ * 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
- * @param {ReactNode} node Statically passed child of any type.
- * @param {*} parentType node's parent's type.
*/
- function validateChildKeys$1(node, parentType) {
- if (typeof node !== "object" || !node) {
- return;
- }
-
- if (node.$$typeof === REACT_CLIENT_REFERENCE$1);
- else if (isArray(node)) {
- for (var i = 0; i < node.length; i++) {
- var child = node[i];
+ function ReactElement(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
+ };
- if (isValidElement$1(child)) {
- validateExplicitKey$1(child, parentType);
- }
- }
- } else if (isValidElement$1(node)) {
- // This element was passed in a valid location.
- if (node._store) {
- node._store.validated = true;
- }
- } else {
- var iteratorFn = getIteratorFn(node);
+ {
+ // 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.
- 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;
+ Object.defineProperty(element._store, "validated", {
+ configurable: false,
+ enumerable: false,
+ writable: true,
+ value: false
+ }); // self and source are DEV only properties.
- while (!(step = iterator.next()).done) {
- if (isValidElement$1(step.value)) {
- validateExplicitKey$1(step.value, parentType);
- }
- }
- }
+ 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;
}
/**
- * Given an element, validate that its props follow the propTypes definition,
- * provided by the type.
- *
- * @param {ReactElement} element
+ * https://github.com/reactjs/rfcs/pull/107
+ * @param {*} type
+ * @param {object} props
+ * @param {string} key
*/
- function validatePropTypes$1(element) {
+ function jsxDEV$1(type, config, maybeKey, source, self) {
{
- var type = element.type;
+ var propName; // Reserved names are extracted
- if (type === null || type === undefined || typeof type === "string") {
- return;
- }
+ var props = {};
+ var key = null;
+ var ref = null; // Currently, key can be spread in as a prop. This causes a potential
+ // issue if key is also explicitly declared (ie.
+ // or ). We want to deprecate key spread,
+ // but as an intermediary step, we will use jsxDEV for everything except
+ // , because we aren't currently able to tell if
+ // key is explicitly declared to be undefined or not.
- if (type.$$typeof === REACT_CLIENT_REFERENCE$1) {
- return;
+ if (maybeKey !== undefined) {
+ {
+ checkKeyStringCoercion(maybeKey);
+ }
+
+ key = "" + maybeKey;
}
- var propTypes;
+ if (hasValidKey(config)) {
+ {
+ checkKeyStringCoercion(config.key);
+ }
- 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;
+ key = "" + config.key;
}
- 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$1
- ) {
- propTypesMisspellWarningShown$1 = true; // Intentionally inside to avoid triggering lazy initializers:
+ if (hasValidRef(config)) {
+ ref = config.ref;
+ warnIfStringRefCannotBeAutoConverted(config, self);
+ } // Remaining properties are added to a new props object
- var _name = getComponentNameFromType(type);
+ for (propName in config) {
+ if (
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName)
+ ) {
+ props[propName] = config[propName];
+ }
+ } // Resolve default props
- error(
- "Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",
- _name || "Unknown"
- );
- }
+ if (type && type.defaultProps) {
+ var defaultProps = type.defaultProps;
- 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."
- );
+ for (propName in defaultProps) {
+ if (props[propName] === undefined) {
+ props[propName] = defaultProps[propName];
+ }
+ }
}
- }
- }
- /**
- * Given a fragment, validate that it can only be provided with fragment props
- * @param {ReactElement} fragment
- */
-
- function validateFragmentProps$1(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);
+ if (key || ref) {
+ var displayName =
+ typeof type === "function"
+ ? type.displayName || type.name || "Unknown"
+ : type;
- error(
- "Invalid prop `%s` supplied to `React.Fragment`. " +
- "React.Fragment can only have `key` and `children` props.",
- key
- );
+ if (key) {
+ defineKeyPropWarningGetter(props, displayName);
+ }
- setCurrentlyValidatingElement$1(null);
- break;
+ if (ref) {
+ defineRefPropWarningGetter(props, displayName);
}
}
- if (fragment.ref !== null) {
- setCurrentlyValidatingElement$1(fragment);
+ return ReactElement(
+ type,
+ key,
+ ref,
+ self,
+ source,
+ ReactCurrentOwner$1.current,
+ props
+ );
+ }
+ }
- error("Invalid attribute `ref` supplied to `React.Fragment`.");
+ var REACT_CLIENT_REFERENCE$1 = Symbol.for("react.client.reference");
- setCurrentlyValidatingElement$1(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);
}
}
}
- 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 = "";
+ var propTypesMisspellWarningShown$1;
- 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.";
- }
+ {
+ propTypesMisspellWarningShown$1 = false;
+ }
- var sourceInfo = getSourceInfoErrorAddendumForProps(props);
+ function getDeclarationErrorAddendum$1() {
+ if (ReactCurrentOwner$2.current) {
+ var name = getComponentNameFromType(ReactCurrentOwner$2.current.type);
- if (sourceInfo) {
- info += sourceInfo;
- } else {
- info += getDeclarationErrorAddendum$1();
+ if (name) {
+ return "\n\nCheck the render method of `" + name + "`.";
}
+ }
- 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;
- }
+ return "";
+ }
- {
- 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
- );
- }
+ function getSourceInfoErrorAddendum$1(source) {
+ if (source !== undefined) {
+ var fileName = source.fileName.replace(/^.*[\\\/]/, "");
+ var lineNumber = source.lineNumber;
+ return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
}
- var element = createElement$1.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.
+ return "";
+ }
- 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$1(arguments[i], type);
- }
- }
-
- if (type === REACT_FRAGMENT_TYPE) {
- validateFragmentProps$1(element);
- } else {
- validatePropTypes$1(element);
+ function getSourceInfoErrorAddendumForProps(elementProps) {
+ if (elementProps !== null && elementProps !== undefined) {
+ return getSourceInfoErrorAddendum$1(elementProps.__source);
}
- return element;
+ return "";
}
- 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
+ /**
+ * 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.
+ */
- Object.defineProperty(validatedFactory, "type", {
- enumerable: false,
- get: function () {
- warn(
- "Factory.type is deprecated. Access the class directly " +
- "before passing it to createFactory."
- );
+ var ownerHasKeyUseWarning$1 = {};
- Object.defineProperty(this, "type", {
- value: type
- });
- return type;
- }
- });
- }
+ function getCurrentComponentErrorInfo$1(parentType) {
+ var info = getDeclarationErrorAddendum$1();
- return validatedFactory;
- }
- function cloneElementWithValidation(element, props, children) {
- var newElement = cloneElement$1.apply(this, arguments);
+ if (!info) {
+ var parentName = getComponentNameFromType(parentType);
- for (var i = 2; i < arguments.length; i++) {
- validateChildKeys$1(arguments[i], newElement.type);
+ if (parentName) {
+ info =
+ "\n\nCheck the top-level render call using <" + parentName + ">.";
+ }
}
- validatePropTypes$1(newElement);
- return newElement;
+ return info;
}
-
- var createElement = createElementWithValidation;
- var cloneElement = cloneElementWithValidation;
- var createFactory = createFactoryWithValidation;
-
- var SEPARATOR = ".";
- var SUBSEPARATOR = ":";
/**
- * Escape and wrap key so it is safe to use as a reactid
+ * 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.
*
- * @param {string} key to be escaped.
- * @return {string} the escaped key.
+ * @internal
+ * @param {ReactElement} element Element that requires a key.
+ * @param {*} parentType element's parent's type.
*/
- 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.
- */
+ function validateExplicitKey$1(element, parentType) {
+ if (!element._store || element._store.validated || element.key != null) {
+ return;
+ }
- var didWarnAboutMaps = false;
- var userProvidedKeyEscapeRegex = /\/+/g;
+ element._store.validated = true;
+ var currentComponentErrorInfo =
+ getCurrentComponentErrorInfo$1(parentType);
- 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}
- */
+ if (ownerHasKeyUseWarning$1[currentComponentErrorInfo]) {
+ return;
+ }
+
+ ownerHasKeyUseWarning$1[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 = "";
- 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
+ element &&
+ element._owner &&
+ element._owner !== ReactCurrentOwner$2.current
) {
- // Explicit key
- {
- checkKeyStringCoercion(element.key);
- }
+ // Give the component that originally created this child.
+ childOwner =
+ " It was passed a child from " +
+ getComponentNameFromType(element._owner.type) +
+ ".";
+ }
- return escape("" + element.key);
- } // Implicit key determined by the index in the set
+ {
+ setCurrentlyValidatingElement$1(element);
- return index.toString(36);
- }
+ 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
+ );
- function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
- var type = typeof children;
+ 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.
+ */
- if (type === "undefined" || type === "boolean") {
- // All of the above are perceived as null.
- children = null;
+ function validateChildKeys$1(node, parentType) {
+ if (typeof node !== "object" || !node) {
+ return;
}
- var invokeCallback = false;
+ if (node.$$typeof === REACT_CLIENT_REFERENCE$1);
+ else if (isArray(node)) {
+ for (var i = 0; i < node.length; i++) {
+ var child = node[i];
- if (children === null) {
- invokeCallback = true;
+ if (isValidElement$1(child)) {
+ validateExplicitKey$1(child, parentType);
+ }
+ }
+ } else if (isValidElement$1(node)) {
+ // This element was passed in a valid location.
+ if (node._store) {
+ node._store.validated = true;
+ }
} else {
- switch (type) {
- case "string":
- case "number":
- invokeCallback = true;
- break;
+ var iteratorFn = getIteratorFn(node);
- case "object":
- switch (children.$$typeof) {
- case REACT_ELEMENT_TYPE:
- case REACT_PORTAL_TYPE:
- invokeCallback = true;
+ 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$1(step.value)) {
+ validateExplicitKey$1(step.value, parentType);
+ }
}
+ }
}
}
+ }
+ /**
+ * Given an element, validate that its props follow the propTypes definition,
+ * provided by the type.
+ *
+ * @param {ReactElement} element
+ */
- 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:
+ function validatePropTypes$1(element) {
+ {
+ var type = element.type;
- var childKey =
- nameSoFar === "" ? SEPARATOR + getElementKey(_child, 0) : nameSoFar;
+ if (type === null || type === undefined || typeof type === "string") {
+ return;
+ }
- if (isArray(mappedChild)) {
- var escapedChildKey = "";
+ if (type.$$typeof === REACT_CLIENT_REFERENCE$1) {
+ return;
+ }
- if (childKey != null) {
- escapedChildKey = escapeUserProvidedKey(childKey) + "/";
- }
+ var propTypes;
- mapIntoArray(mappedChild, array, escapedChildKey, "", function (c) {
- return c;
- });
- } else if (mappedChild != null) {
- if (isValidElement$1(mappedChild)) {
- {
- // The `if` statement here prevents auto-disabling of the safe
- // coercion ESLint rule, so we must manually disable it below.
- // $FlowFixMe[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
- if (
- mappedChild.key &&
- (!_child || _child.key !== mappedChild.key)
- ) {
- checkKeyStringCoercion(mappedChild.key);
- }
- }
+ 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;
+ }
- 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[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
- (mappedChild.key && (!_child || _child.key !== mappedChild.key)
- ? escapeUserProvidedKey(
- // $FlowFixMe[unsafe-addition]
- "" + mappedChild.key // eslint-disable-line react-internal/safe-string-coercion
- ) + "/"
- : "") +
- childKey
- );
- }
+ 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$1
+ ) {
+ propTypesMisspellWarningShown$1 = true; // Intentionally inside to avoid triggering lazy initializers:
- array.push(mappedChild);
+ var _name = getComponentNameFromType(type);
+
+ error(
+ "Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",
+ _name || "Unknown"
+ );
}
- return 1;
+ 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
+ */
- var child;
- var nextName;
- var subtreeCount = 0; // Count of children found in the current subtree.
+ function validateFragmentProps$1(fragment) {
+ {
+ var keys = Object.keys(fragment.props);
- var nextNamePrefix =
- nameSoFar === "" ? SEPARATOR : nameSoFar + SUBSEPARATOR;
+ for (var i = 0; i < keys.length; i++) {
+ var key = keys[i];
- 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
- );
+ 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;
+ }
}
- } else {
- var iteratorFn = getIteratorFn(children);
- if (typeof iteratorFn === "function") {
- var iterableChildren = children;
+ if (fragment.ref !== null) {
+ setCurrentlyValidatingElement$1(fragment);
- {
- // 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."
- );
- }
+ error("Invalid attribute `ref` supplied to `React.Fragment`.");
- didWarnAboutMaps = true;
- }
- }
+ 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.
- var iterator = iteratorFn.call(iterableChildren);
- var step;
- var ii = 0; // $FlowFixMe[incompatible-use] `iteratorFn` might return null according to typing.
+ if (!validType) {
+ var info = "";
- 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."
+ 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$1();
+ }
+
+ 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
);
}
}
- 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.
- */
+ var element = createElement$1.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.
- function mapChildren(children, func, context) {
- if (children == null) {
- // $FlowFixMe limitation refining abstract types in Flow
- return children;
+ 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$1(arguments[i], type);
+ }
}
- 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.
- */
+ if (type === REACT_FRAGMENT_TYPE) {
+ validateFragmentProps$1(element);
+ } else {
+ validatePropTypes$1(element);
+ }
- function countChildren(children) {
- var n = 0;
- mapChildren(children, function () {
- n++; // Don't return anything
- });
- return n;
+ return element;
}
- /**
- * 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.
+ 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$1.apply(this, arguments);
+
+ for (var i = 2; i < arguments.length; i++) {
+ validateChildKeys$1(arguments[i], newElement.type);
+ }
+
+ validatePropTypes$1(newElement);
+ return newElement;
+ }
+
+ var createElement = createElementWithValidation;
+ var cloneElement = cloneElementWithValidation;
+ var createFactory = createFactoryWithValidation;
+
+ var SEPARATOR = ".";
+ var SUBSEPARATOR = ":";
+ /**
+ * Escape and wrap key so it is safe to use as a reactid
*
- * @param {?*} children Children tree container.
- * @param {function(*, int)} forEachFunc
- * @param {*} forEachContext Context for forEachContext.
+ * @param {string} key to be escaped.
+ * @return {string} the escaped key.
*/
- function forEachChildren(children, forEachFunc, forEachContext) {
- mapChildren(
- children, // $FlowFixMe[missing-this-annot]
- function () {
- forEachFunc.apply(this, arguments); // Don't return anything.
- },
- forEachContext
- );
+ function escape(key) {
+ var escapeRegex = /[=:]/g;
+ var escaperLookup = {
+ "=": "=0",
+ ":": "=2"
+ };
+ var escapedString = key.replace(escapeRegex, function (match) {
+ return escaperLookup[match];
+ });
+ return "$" + escapedString;
}
/**
- * 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
+ * TODO: Test that a single child and an array with one item have the same key
+ * pattern.
*/
- function toArray(children) {
- return (
- mapChildren(children, function (child) {
- return child;
- }) || []
- );
+ var didWarnAboutMaps = false;
+ var userProvidedKeyEscapeRegex = /\/+/g;
+
+ function escapeUserProvidedKey(text) {
+ return text.replace(userProvidedKeyEscapeRegex, "$&/");
}
/**
- * 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.
+ * Generate a key string that identifies a element within a set.
*
- * @param {?object} children Child collection structure.
- * @return {ReactElement} The first and only `ReactElement` contained in the
- * structure.
+ * @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 onlyChild(children) {
- if (!isValidElement$1(children)) {
- throw new Error(
- "React.Children.only expected to receive a single React element child."
- );
- }
+ 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 children;
+ return escape("" + element.key);
+ } // Implicit key determined by the index in the set
+
+ return index.toString(36);
}
- 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
- };
- context.Provider = {
- $$typeof: REACT_PROVIDER_TYPE,
- _context: context
- };
- var hasWarnedAboutUsingNestedContextConsumers = false;
- var hasWarnedAboutUsingConsumerProvider = false;
- var hasWarnedAboutDisplayNameOnConsumer = false;
+ function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
+ var type = typeof children;
- {
- // 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[prop-missing]: Flow complains about not setting a value, which is intentional here
+ if (type === "undefined" || type === "boolean") {
+ // All of the above are perceived as null.
+ children = null;
+ }
- Object.defineProperties(Consumer, {
- Provider: {
- get: function () {
- if (!hasWarnedAboutUsingConsumerProvider) {
- hasWarnedAboutUsingConsumerProvider = true;
+ var invokeCallback = false;
- error(
- "Rendering is not supported and will be removed in " +
- "a future major release. Did you mean to render instead?"
- );
- }
+ if (children === null) {
+ invokeCallback = true;
+ } else {
+ switch (type) {
+ case "string":
+ case "number":
+ invokeCallback = true;
+ break;
- 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;
+ case "object":
+ switch (children.$$typeof) {
+ case REACT_ELEMENT_TYPE:
+ case REACT_PORTAL_TYPE:
+ invokeCallback = true;
}
- },
- Consumer: {
- get: function () {
- if (!hasWarnedAboutUsingNestedContextConsumers) {
- hasWarnedAboutUsingNestedContextConsumers = true;
-
- error(
- "Rendering is not supported and will be removed in " +
- "a future major release. Did you mean to render 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
- );
+ 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:
- hasWarnedAboutDisplayNameOnConsumer = true;
- }
- }
- }
- }); // $FlowFixMe[prop-missing]: 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;
+ var childKey =
+ nameSoFar === "" ? SEPARATOR + getElementKey(_child, 0) : nameSoFar;
- 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.
+ if (isArray(mappedChild)) {
+ var escapedChildKey = "";
- 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 (childKey != null) {
+ escapedChildKey = escapeUserProvidedKey(childKey) + "/";
}
- );
-
- 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;
+ mapIntoArray(mappedChild, array, escapedChildKey, "", function (c) {
+ return c;
+ });
+ } else if (mappedChild != null) {
+ if (isValidElement$1(mappedChild)) {
+ {
+ // The `if` statement here prevents auto-disabling of the safe
+ // coercion ESLint rule, so we must manually disable it below.
+ // $FlowFixMe[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
+ if (
+ mappedChild.key &&
+ (!_child || _child.key !== mappedChild.key)
+ ) {
+ checkKeyStringCoercion(mappedChild.key);
+ }
+ }
- {
- 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
+ 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[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
+ (mappedChild.key && (!_child || _child.key !== mappedChild.key)
+ ? escapeUserProvidedKey(
+ // $FlowFixMe[unsafe-addition]
+ "" + mappedChild.key // eslint-disable-line react-internal/safe-string-coercion
+ ) + "/"
+ : "") +
+ childKey
);
}
- }
- {
- 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
- );
- }
+ array.push(mappedChild);
}
- return moduleObject.default;
- } else {
- throw payload._result;
+ return 1;
}
- }
-
- 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[prop-missing]
+ var child;
+ var nextName;
+ var subtreeCount = 0; // Count of children found in the current subtree.
- Object.defineProperties(lazyType, {
- defaultProps: {
- configurable: true,
- get: function () {
- return defaultProps;
- },
- // $FlowFixMe[missing-local-annot]
- 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."
- );
+ var nextNamePrefix =
+ nameSoFar === "" ? SEPARATOR : nameSoFar + SUBSEPARATOR;
- defaultProps = newDefaultProps; // Match production behavior more closely:
- // $FlowFixMe[prop-missing]
+ 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);
- Object.defineProperty(lazyType, "defaultProps", {
- enumerable: true
- });
- }
- },
- propTypes: {
- configurable: true,
- get: function () {
- return propTypes;
- },
- // $FlowFixMe[missing-local-annot]
- 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."
- );
+ if (typeof iteratorFn === "function") {
+ var iterableChildren = children;
- propTypes = newPropTypes; // Match production behavior more closely:
- // $FlowFixMe[prop-missing]
+ {
+ // 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."
+ );
+ }
- Object.defineProperty(lazyType, "propTypes", {
- enumerable: true
- });
+ didWarnAboutMaps = true;
}
}
- });
- }
- return lazyType;
- }
+ var iterator = iteratorFn.call(iterableChildren);
+ var step;
+ var ii = 0; // $FlowFixMe[incompatible-use] `iteratorFn` might return null according to typing.
- 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."
+ 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."
+ );
}
-
- 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;
+ 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 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;
- }
- }
- });
+ function mapChildren(children, func, context) {
+ if (children == null) {
+ // $FlowFixMe limitation refining abstract types in Flow
+ return children;
}
- return elementType;
+ 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 cache(fn) {
- {
- // On the client (i.e. not a Server Components environment) `cache` has
- // no caching behavior. We just return the function as-is.
- //
- // We intend to implement client caching in a future major release. In the
- // meantime, it's only exposed as an API so that Shared Components can use
- // per-request caching on the server without breaking on the client. But it
- // does mean they need to be aware of the behavioral difference.
- //
- // The rest of the behavior is the same as the server implementation — it
- // returns a new reference, extra properties like `displayName` are not
- // preserved, the length of the new function is 0, etc. That way apps can't
- // accidentally depend on those details.
- return function () {
- // $FlowFixMe[incompatible-call]: We don't want to use rest arguments since we transpile the code.
- return fn.apply(null, arguments);
- };
- }
+ 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 resolveDispatcher() {
- var dispatcher = ReactCurrentDispatcher$1.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 forEachChildren(children, forEachFunc, forEachContext) {
+ mapChildren(
+ children, // $FlowFixMe[missing-this-annot]
+ 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 getCacheSignal() {
- var dispatcher = ReactCurrentCache.current;
+ 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.
+ */
- if (!dispatcher) {
- // If we have no cache to associate with this call, then we don't know
- // its lifetime. We abort early since that's safer than letting it live
- // for ever. Unlike just caching which can be a functional noop outside
- // of React, these should generally always be associated with some React
- // render but we're not limiting quite as much as making it a Hook.
- // It's safer than erroring early at runtime.
- var controller = new AbortController();
- var reason = new Error(
- "This CacheSignal was requested outside React which means that it is " +
- "immediately aborted."
+ function onlyChild(children) {
+ if (!isValidElement$1(children)) {
+ throw new Error(
+ "React.Children.only expected to receive a single React element child."
);
- controller.abort(reason);
- return controller.signal;
}
- return dispatcher.getCacheSignal();
+ return children;
}
- function getCacheForType(resourceType) {
- var dispatcher = ReactCurrentCache.current;
- if (!dispatcher) {
- // If there is no dispatcher, then we treat this as not being cached.
- return resourceType();
- }
-
- return dispatcher.getCacheForType(resourceType);
- }
- function useContext(Context) {
- var dispatcher = resolveDispatcher();
+ 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
+ };
+ context.Provider = {
+ $$typeof: REACT_PROVIDER_TYPE,
+ _context: context
+ };
+ var hasWarnedAboutUsingNestedContextConsumers = false;
+ var hasWarnedAboutUsingConsumerProvider = false;
+ var hasWarnedAboutDisplayNameOnConsumer = false;
{
- // 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?"
- );
- }
- }
- }
+ // 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[prop-missing]: Flow complains about not setting a value, which is intentional here
- 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, initialValue) {
- var dispatcher = resolveDispatcher();
- return dispatcher.useDeferredValue(value, initialValue);
- }
- function useId() {
- var dispatcher = resolveDispatcher();
- return dispatcher.useId();
- }
- function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
- var dispatcher = resolveDispatcher();
- return dispatcher.useSyncExternalStore(
- subscribe,
- getSnapshot,
- getServerSnapshot
- );
- }
- function useCacheRefresh() {
- var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
+ Object.defineProperties(Consumer, {
+ Provider: {
+ get: function () {
+ if (!hasWarnedAboutUsingConsumerProvider) {
+ hasWarnedAboutUsingConsumerProvider = true;
- return dispatcher.useCacheRefresh();
- }
- function use(usable) {
- var dispatcher = resolveDispatcher();
- return dispatcher.use(usable);
- }
- function useMemoCache(size) {
- var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
+ error(
+ "Rendering is not supported and will be removed in " +
+ "a future major release. Did you mean to render instead?"
+ );
+ }
- return dispatcher.useMemoCache(size);
- }
- function useEffectEvent(callback) {
- var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
+ 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;
- return dispatcher.useEffectEvent(callback);
- }
- function useOptimistic(passthrough, reducer) {
- var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
+ error(
+ "Rendering is not supported and will be removed in " +
+ "a future major release. Did you mean to render instead?"
+ );
+ }
- return dispatcher.useOptimistic(passthrough, reducer);
- }
+ 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
+ );
- function startTransition(scope, options) {
- var prevTransition = ReactCurrentBatchConfig.transition; // Each renderer registers a callback to receive the return value of
- // the scope function. This is used to implement async actions.
+ hasWarnedAboutDisplayNameOnConsumer = true;
+ }
+ }
+ }
+ }); // $FlowFixMe[prop-missing]: Flow complains about missing properties because it doesn't understand defineProperty
- var callbacks = new Set();
- var transition = {
- _callbacks: callbacks
- };
- ReactCurrentBatchConfig.transition = transition;
- var currentTransition = ReactCurrentBatchConfig.transition;
+ context.Consumer = Consumer;
+ }
{
- ReactCurrentBatchConfig.transition._updatedFibers = new Set();
+ context._currentRenderer = null;
+ context._currentRenderer2 = null;
}
- if (enableTransitionTracing) {
- if (options !== undefined && options.name !== undefined) {
- // $FlowFixMe[incompatible-use] found when upgrading Flow
- ReactCurrentBatchConfig.transition.name = options.name; // $FlowFixMe[incompatible-use] found when upgrading Flow
+ return context;
+ }
- ReactCurrentBatchConfig.transition.startTime = -1;
+ 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 (enableAsyncActions) {
- try {
- var returnValue = scope();
+ if (payload._status === Resolved) {
+ var moduleObject = payload._result;
- if (
- typeof returnValue === "object" &&
- returnValue !== null &&
- typeof returnValue.then === "function"
- ) {
- callbacks.forEach(function (callback) {
- return callback(currentTransition, returnValue);
- });
- returnValue.then(noop, onError);
+ {
+ 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
+ );
}
- } catch (error) {
- onError(error);
- } finally {
- warnAboutTransitionSubscriptions(prevTransition, currentTransition);
- ReactCurrentBatchConfig.transition = prevTransition;
- }
- } else {
- // When async actions are not enabled, startTransition does not
- // capture errors.
- try {
- scope();
- } finally {
- warnAboutTransitionSubscriptions(prevTransition, currentTransition);
- ReactCurrentBatchConfig.transition = prevTransition;
}
- }
- }
-
- function warnAboutTransitionSubscriptions(
- prevTransition,
- currentTransition
- ) {
- {
- if (prevTransition === null && currentTransition._updatedFibers) {
- var updatedFibersCount = currentTransition._updatedFibers.size;
-
- currentTransition._updatedFibers.clear();
- 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."
+ {
+ 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 noop() {} // Use reportError, if it exists. Otherwise console.error. This is the same as
- // the default for onRecoverableError.
+ 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
+ };
- var onError =
- 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);
- };
+ {
+ // In production, this would just set it on the object.
+ var defaultProps;
+ var propTypes; // $FlowFixMe[prop-missing]
- 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.
+ Object.defineProperties(lazyType, {
+ defaultProps: {
+ configurable: true,
+ get: function () {
+ return defaultProps;
+ },
+ // $FlowFixMe[missing-local-annot]
+ 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."
+ );
- 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;
+ defaultProps = newDefaultProps; // Match production behavior more closely:
+ // $FlowFixMe[prop-missing]
- 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."
- );
- }
- }
+ Object.defineProperty(lazyType, "defaultProps", {
+ enumerable: true
+ });
}
+ },
+ propTypes: {
+ configurable: true,
+ get: function () {
+ return propTypes;
+ },
+ // $FlowFixMe[missing-local-annot]
+ 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."
+ );
- var channel = new MessageChannel();
- channel.port1.onmessage = callback;
- channel.port2.postMessage(undefined);
- };
- }
+ propTypes = newPropTypes; // Match production behavior more closely:
+ // $FlowFixMe[prop-missing]
+
+ Object.defineProperty(lazyType, "propTypes", {
+ enumerable: true
+ });
+ }
+ }
+ });
}
- return enqueueTaskImpl(task);
+ return lazyType;
}
- // number of `act` scopes on the stack.
+ 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."
+ );
+ }
+ }
- var actScopeDepth = 0; // We only warn the first time you neglect to await an async `act` scope.
+ 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 didWarnNoAwaitAct = false;
- function act(callback) {
{
- // When ReactCurrentActQueue.current is not null, it signals to React that
- // we're currently inside an `act` scope. React will push all its tasks to
- // this queue instead of scheduling them with platform APIs.
- //
- // We set this to an empty array when we first enter an `act` scope, and
- // only unset it once we've left the outermost `act` scope — remember that
- // `act` calls can be nested.
- //
- // If we're already inside an `act` scope, reuse the existing queue.
- var prevIsBatchingLegacy = ReactCurrentActQueue.isBatchingLegacy;
- var prevActQueue = ReactCurrentActQueue.current;
- var prevActScopeDepth = actScopeDepth;
- actScopeDepth++;
- var queue = (ReactCurrentActQueue.current =
- prevActQueue !== null ? prevActQueue : []); // 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.
+ 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.
- ReactCurrentActQueue.isBatchingLegacy = true;
- var result; // This tracks whether the `act` call is awaited. In certain cases, not
- // awaiting it is a mistake, so we will detect that and warn.
+ if (!render.name && !render.displayName) {
+ render.displayName = name;
+ }
+ }
+ });
+ }
- var didAwaitActCall = false;
+ return elementType;
+ }
- try {
- // Reset this to `false` right before entering the React work loop. The
- // only place we ever read this fields is just below, right after running
- // the callback. So we don't need to reset after the callback runs.
- ReactCurrentActQueue.didScheduleLegacyUpdate = false;
- result = callback();
- var didScheduleLegacyUpdate =
- ReactCurrentActQueue.didScheduleLegacyUpdate; // 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 && didScheduleLegacyUpdate) {
- flushActQueue(queue);
- } // `isBatchingLegacy` gets reset using the regular stack, not the async
- // one used to track `act` scopes. Why, you may be wondering? Because
- // that's how it worked before version 18. Yes, it's confusing! We should
- // delete legacy mode!!
-
- ReactCurrentActQueue.isBatchingLegacy = prevIsBatchingLegacy;
- } catch (error) {
- // `isBatchingLegacy` gets reset using the regular stack, not the async
- // one used to track `act` scopes. Why, you may be wondering? Because
- // that's how it worked before version 18. Yes, it's confusing! We should
- // delete legacy mode!!
- ReactCurrentActQueue.isBatchingLegacy = prevIsBatchingLegacy;
- popActScope(prevActQueue, prevActScopeDepth);
- throw error;
+ function memo(type, compare) {
+ {
+ if (!isValidElementType(type)) {
+ error(
+ "memo: The first argument must be a component. Instead " +
+ "received: %s",
+ type === null ? "null" : typeof type
+ );
}
+ }
- if (
- result !== null &&
- typeof result === "object" && // $FlowFixMe[method-unbinding]
- typeof result.then === "function"
- ) {
- // A promise/thenable was returned from the callback. Wait for it to
- // resolve before flushing the queue.
- //
- // If `act` were implemented as an async function, this whole block could
- // be a single `await` call. That's really the only difference between
- // this branch and the next one.
- var thenable = result; // Warn if the an `act` call with an async scope is not awaited. In a
- // future release, consider making this an error.
+ var elementType = {
+ $$typeof: REACT_MEMO_TYPE,
+ type: type,
+ compare: compare === undefined ? null : compare
+ };
- queueSeveralMicrotasks(function () {
- if (!didAwaitActCall && !didWarnNoAwaitAct) {
- didWarnNoAwaitAct = true;
+ {
+ 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.
- 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 () => ...);"
- );
+ if (!type.name && !type.displayName) {
+ type.displayName = name;
}
- });
- return {
- then: function (resolve, reject) {
- didAwaitActCall = true;
- thenable.then(
- function (returnValue) {
- popActScope(prevActQueue, prevActScopeDepth);
+ }
+ });
+ }
- if (prevActScopeDepth === 0) {
- // We're exiting the outermost `act` scope. Flush the queue.
- try {
- flushActQueue(queue);
- enqueueTask(function () {
- return (
- // Recursively flush tasks scheduled by a microtask.
- recursivelyFlushAsyncActWork(
- returnValue,
- resolve,
- reject
- )
- );
- });
- } catch (error) {
- // `thenable` might not be a real promise, and `flushActQueue`
- // might throw, so we need to wrap `flushActQueue` in a
- // try/catch.
- reject(error);
- }
- } else {
- resolve(returnValue);
- }
- },
- function (error) {
- popActScope(prevActQueue, prevActScopeDepth);
- reject(error);
- }
- );
- }
- };
- } else {
- var returnValue = result; // The callback is not an async function. Exit the current
- // scope immediately.
+ return elementType;
+ }
- popActScope(prevActQueue, prevActScopeDepth);
+ function cache(fn) {
+ {
+ // On the client (i.e. not a Server Components environment) `cache` has
+ // no caching behavior. We just return the function as-is.
+ //
+ // We intend to implement client caching in a future major release. In the
+ // meantime, it's only exposed as an API so that Shared Components can use
+ // per-request caching on the server without breaking on the client. But it
+ // does mean they need to be aware of the behavioral difference.
+ //
+ // The rest of the behavior is the same as the server implementation — it
+ // returns a new reference, extra properties like `displayName` are not
+ // preserved, the length of the new function is 0, etc. That way apps can't
+ // accidentally depend on those details.
+ return function () {
+ // $FlowFixMe[incompatible-call]: We don't want to use rest arguments since we transpile the code.
+ return fn.apply(null, arguments);
+ };
+ }
+ }
- if (prevActScopeDepth === 0) {
- // We're exiting the outermost `act` scope. Flush the queue.
- flushActQueue(queue); // If the queue is not empty, it implies that we intentionally yielded
- // to the main thread, because something suspended. We will continue
- // in an asynchronous task.
- //
- // Warn if something suspends but the `act` call is not awaited.
- // In a future release, consider making this an error.
+ function resolveDispatcher() {
+ var dispatcher = ReactCurrentDispatcher$1.current;
- if (queue.length !== 0) {
- queueSeveralMicrotasks(function () {
- if (!didAwaitActCall && !didWarnNoAwaitAct) {
- didWarnNoAwaitAct = true;
+ {
+ 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.
- error(
- "A component suspended inside an `act` scope, but the " +
- "`act` call was not awaited. When testing React " +
- "components that depend on asynchronous data, you must " +
- "await the result:\n\n" +
- "await act(() => ...)"
- );
- }
- });
- } // Like many things in this module, this is next part is confusing.
- //
- // We do not currently require every `act` call that is passed a
- // callback to be awaited, through arguably we should. Since this
- // callback was synchronous, we need to exit the current scope before
- // returning.
- //
- // However, if thenable we're about to return *is* awaited, we'll
- // immediately restore the current scope. So it shouldn't observable.
- //
- // This doesn't affect the case where the scope callback is async,
- // because we always require those calls to be awaited.
- //
- // TODO: In a future version, consider always requiring all `act` calls
- // to be awaited, regardless of whether the callback is sync or async.
+ return dispatcher;
+ }
- ReactCurrentActQueue.current = null;
+ function getCacheSignal() {
+ var dispatcher = ReactCurrentCache.current;
+
+ if (!dispatcher) {
+ // If we have no cache to associate with this call, then we don't know
+ // its lifetime. We abort early since that's safer than letting it live
+ // for ever. Unlike just caching which can be a functional noop outside
+ // of React, these should generally always be associated with some React
+ // render but we're not limiting quite as much as making it a Hook.
+ // It's safer than erroring early at runtime.
+ var controller = new AbortController();
+ var reason = new Error(
+ "This CacheSignal was requested outside React which means that it is " +
+ "immediately aborted."
+ );
+ controller.abort(reason);
+ return controller.signal;
+ }
+
+ return dispatcher.getCacheSignal();
+ }
+ function getCacheForType(resourceType) {
+ var dispatcher = ReactCurrentCache.current;
+
+ if (!dispatcher) {
+ // If there is no dispatcher, then we treat this as not being cached.
+ return resourceType();
+ }
+
+ return dispatcher.getCacheForType(resourceType);
+ }
+ 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, initialValue) {
+ var dispatcher = resolveDispatcher();
+ return dispatcher.useDeferredValue(value, initialValue);
+ }
+ function useId() {
+ var dispatcher = resolveDispatcher();
+ return dispatcher.useId();
+ }
+ function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) {
+ var dispatcher = resolveDispatcher();
+ return dispatcher.useSyncExternalStore(
+ subscribe,
+ getSnapshot,
+ getServerSnapshot
+ );
+ }
+ function useCacheRefresh() {
+ var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
- return {
- then: function (resolve, reject) {
- didAwaitActCall = true;
+ return dispatcher.useCacheRefresh();
+ }
+ function use(usable) {
+ var dispatcher = resolveDispatcher();
+ return dispatcher.use(usable);
+ }
+ function useMemoCache(size) {
+ var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
- if (prevActScopeDepth === 0) {
- // If the `act` call is awaited, restore the queue we were
- // using before (see long comment above) so we can flush it.
- ReactCurrentActQueue.current = queue;
- enqueueTask(function () {
- return (
- // Recursively flush tasks scheduled by a microtask.
- recursivelyFlushAsyncActWork(returnValue, resolve, reject)
- );
- });
- } else {
- resolve(returnValue);
- }
- }
- };
- }
- }
+ return dispatcher.useMemoCache(size);
}
+ function useEffectEvent(callback) {
+ var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
- function popActScope(prevActQueue, 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. "
- );
- }
+ return dispatcher.useEffectEvent(callback);
+ }
+ function useOptimistic(passthrough, reducer) {
+ var dispatcher = resolveDispatcher(); // $FlowFixMe[not-a-function] This is unstable, thus optional
- actScopeDepth = prevActScopeDepth;
- }
+ return dispatcher.useOptimistic(passthrough, reducer);
}
- function recursivelyFlushAsyncActWork(returnValue, resolve, reject) {
+ function startTransition(scope, options) {
+ var prevTransition = ReactCurrentBatchConfig.transition; // Each renderer registers a callback to receive the return value of
+ // the scope function. This is used to implement async actions.
+
+ var callbacks = new Set();
+ var transition = {
+ _callbacks: callbacks
+ };
+ ReactCurrentBatchConfig.transition = transition;
+ var currentTransition = ReactCurrentBatchConfig.transition;
+
{
- // Check if any tasks were scheduled asynchronously.
- var queue = ReactCurrentActQueue.current;
+ ReactCurrentBatchConfig.transition._updatedFibers = new Set();
+ }
- if (queue !== null) {
- if (queue.length !== 0) {
- // Async tasks were scheduled, mostly likely in a microtask.
- // Keep flushing until there are no more.
- try {
- flushActQueue(queue); // The work we just performed may have schedule additional async
- // tasks. Wait a macrotask and check again.
+ if (enableTransitionTracing) {
+ if (options !== undefined && options.name !== undefined) {
+ // $FlowFixMe[incompatible-use] found when upgrading Flow
+ ReactCurrentBatchConfig.transition.name = options.name; // $FlowFixMe[incompatible-use] found when upgrading Flow
- enqueueTask(function () {
- return recursivelyFlushAsyncActWork(
- returnValue,
- resolve,
- reject
- );
- });
- } catch (error) {
- // Leave remaining tasks on the queue if something throws.
- reject(error);
- }
- } else {
- // The queue is empty. We can finish.
- ReactCurrentActQueue.current = null;
- resolve(returnValue);
+ ReactCurrentBatchConfig.transition.startTime = -1;
+ }
+ }
+
+ if (enableAsyncActions) {
+ try {
+ var returnValue = scope();
+
+ if (
+ typeof returnValue === "object" &&
+ returnValue !== null &&
+ typeof returnValue.then === "function"
+ ) {
+ callbacks.forEach(function (callback) {
+ return callback(currentTransition, returnValue);
+ });
+ returnValue.then(noop, onError);
}
- } else {
- resolve(returnValue);
+ } catch (error) {
+ onError(error);
+ } finally {
+ warnAboutTransitionSubscriptions(prevTransition, currentTransition);
+ ReactCurrentBatchConfig.transition = prevTransition;
+ }
+ } else {
+ // When async actions are not enabled, startTransition does not
+ // capture errors.
+ try {
+ scope();
+ } finally {
+ warnAboutTransitionSubscriptions(prevTransition, currentTransition);
+ ReactCurrentBatchConfig.transition = prevTransition;
}
}
}
- var isFlushing = false;
-
- function flushActQueue(queue) {
+ function warnAboutTransitionSubscriptions(
+ prevTransition,
+ currentTransition
+ ) {
{
- if (!isFlushing) {
- // Prevent re-entrance.
- isFlushing = true;
- var i = 0;
-
- try {
- for (; i < queue.length; i++) {
- var callback = queue[i];
-
- do {
- ReactCurrentActQueue.didUsePromise = false;
- var continuation = callback(false);
-
- if (continuation !== null) {
- if (ReactCurrentActQueue.didUsePromise) {
- // The component just suspended. Yield to the main thread in
- // case the promise is already resolved. If so, it will ping in
- // a microtask and we can resume without unwinding the stack.
- queue[i] = callback;
- queue.splice(0, i);
- return;
- }
+ if (prevTransition === null && currentTransition._updatedFibers) {
+ var updatedFibersCount = currentTransition._updatedFibers.size;
- callback = continuation;
- } else {
- break;
- }
- } while (true);
- } // We flushed the entire queue.
+ currentTransition._updatedFibers.clear();
- queue.length = 0;
- } catch (error) {
- // If something throws, leave the remaining callbacks on the queue.
- queue.splice(0, i + 1);
- throw error;
- } finally {
- isFlushing = false;
+ 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."
+ );
}
}
}
- } // Some of our warnings attempt to detect if the `act` call is awaited by
- // checking in an asynchronous task. Wait a few microtasks before checking. The
- // only reason one isn't sufficient is we want to accommodate the case where an
- // `act` call is returned from an async function without first being awaited,
- // since that's a somewhat common pattern. If you do this too many times in a
- // nested sequence, you might get a warning, but you can always fix by awaiting
- // the call.
- //
- // A macrotask would also work (and is the fallback) but depending on the test
- // environment it may cause the warning to fire too late.
+ }
- var queueSeveralMicrotasks =
- typeof queueMicrotask === "function"
- ? function (callback) {
- queueMicrotask(function () {
- return queueMicrotask(callback);
- });
- }
- : enqueueTask;
+ function noop() {} // Use reportError, if it exists. Otherwise console.error. This is the same as
+ // the default for onRecoverableError.
- var Children = {
- map: mapChildren,
- forEach: forEachChildren,
- count: countChildren,
- toArray: toArray,
- only: onlyChild
- };
+ var onError =
+ 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);
+ };
- var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
- var RESERVED_PROPS = {
- key: true,
- ref: true,
- __self: true,
- __source: true
- };
- var specialPropKeyWarningShown;
- var specialPropRefWarningShown;
- var didWarnAboutStringRefs;
+ 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.
- {
- didWarnAboutStringRefs = {};
- }
+ 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;
- function hasValidRef(config) {
- {
- if (hasOwnProperty.call(config, "ref")) {
- var getter = Object.getOwnPropertyDescriptor(config, "ref").get;
+ 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."
+ );
+ }
+ }
+ }
- if (getter && getter.isReactWarning) {
- return false;
- }
+ var channel = new MessageChannel();
+ channel.port1.onmessage = callback;
+ channel.port2.postMessage(undefined);
+ };
}
}
- return config.ref !== undefined;
+ return enqueueTaskImpl(task);
}
- function hasValidKey(config) {
+ // number of `act` scopes on the stack.
+
+ var actScopeDepth = 0; // We only warn the first time you neglect to await an async `act` scope.
+
+ var didWarnNoAwaitAct = false;
+ function act(callback) {
{
- if (hasOwnProperty.call(config, "key")) {
- var getter = Object.getOwnPropertyDescriptor(config, "key").get;
+ // When ReactCurrentActQueue.current is not null, it signals to React that
+ // we're currently inside an `act` scope. React will push all its tasks to
+ // this queue instead of scheduling them with platform APIs.
+ //
+ // We set this to an empty array when we first enter an `act` scope, and
+ // only unset it once we've left the outermost `act` scope — remember that
+ // `act` calls can be nested.
+ //
+ // If we're already inside an `act` scope, reuse the existing queue.
+ var prevIsBatchingLegacy = ReactCurrentActQueue.isBatchingLegacy;
+ var prevActQueue = ReactCurrentActQueue.current;
+ var prevActScopeDepth = actScopeDepth;
+ actScopeDepth++;
+ var queue = (ReactCurrentActQueue.current =
+ prevActQueue !== null ? prevActQueue : []); // 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.
- if (getter && getter.isReactWarning) {
- return false;
- }
- }
- }
+ ReactCurrentActQueue.isBatchingLegacy = true;
+ var result; // This tracks whether the `act` call is awaited. In certain cases, not
+ // awaiting it is a mistake, so we will detect that and warn.
- return config.key !== undefined;
- }
+ var didAwaitActCall = false;
- function warnIfStringRefCannotBeAutoConverted(config, self) {
- {
- if (
- typeof config.ref === "string" &&
- ReactCurrentOwner$1.current &&
- self &&
- ReactCurrentOwner$1.current.stateNode !== self
- ) {
- var componentName = getComponentNameFromType(
- ReactCurrentOwner$1.current.type
- );
+ try {
+ // Reset this to `false` right before entering the React work loop. The
+ // only place we ever read this fields is just below, right after running
+ // the callback. So we don't need to reset after the callback runs.
+ ReactCurrentActQueue.didScheduleLegacyUpdate = false;
+ result = callback();
+ var didScheduleLegacyUpdate =
+ ReactCurrentActQueue.didScheduleLegacyUpdate; // 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 (!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",
- getComponentNameFromType(ReactCurrentOwner$1.current.type),
- config.ref
- );
+ if (!prevIsBatchingLegacy && didScheduleLegacyUpdate) {
+ flushActQueue(queue);
+ } // `isBatchingLegacy` gets reset using the regular stack, not the async
+ // one used to track `act` scopes. Why, you may be wondering? Because
+ // that's how it worked before version 18. Yes, it's confusing! We should
+ // delete legacy mode!!
- didWarnAboutStringRefs[componentName] = true;
- }
+ ReactCurrentActQueue.isBatchingLegacy = prevIsBatchingLegacy;
+ } catch (error) {
+ // `isBatchingLegacy` gets reset using the regular stack, not the async
+ // one used to track `act` scopes. Why, you may be wondering? Because
+ // that's how it worked before version 18. Yes, it's confusing! We should
+ // delete legacy mode!!
+ ReactCurrentActQueue.isBatchingLegacy = prevIsBatchingLegacy;
+ popActScope(prevActQueue, prevActScopeDepth);
+ throw error;
}
- }
- }
- 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
- );
- }
- };
+ if (
+ result !== null &&
+ typeof result === "object" && // $FlowFixMe[method-unbinding]
+ typeof result.then === "function"
+ ) {
+ // A promise/thenable was returned from the callback. Wait for it to
+ // resolve before flushing the queue.
+ //
+ // If `act` were implemented as an async function, this whole block could
+ // be a single `await` call. That's really the only difference between
+ // this branch and the next one.
+ var thenable = result; // Warn if the an `act` call with an async scope is not awaited. In a
+ // future release, consider making this an error.
- warnAboutAccessingKey.isReactWarning = true;
- Object.defineProperty(props, "key", {
- get: warnAboutAccessingKey,
- configurable: true
- });
- }
- }
+ queueSeveralMicrotasks(function () {
+ if (!didAwaitActCall && !didWarnNoAwaitAct) {
+ didWarnNoAwaitAct = true;
- function defineRefPropWarningGetter(props, displayName) {
- {
- var warnAboutAccessingRef = function () {
- if (!specialPropRefWarningShown) {
- specialPropRefWarningShown = 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 {
+ then: function (resolve, reject) {
+ didAwaitActCall = true;
+ thenable.then(
+ function (returnValue) {
+ popActScope(prevActQueue, prevActScopeDepth);
- 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
- );
- }
- };
+ if (prevActScopeDepth === 0) {
+ // We're exiting the outermost `act` scope. Flush the queue.
+ try {
+ flushActQueue(queue);
+ enqueueTask(function () {
+ return (
+ // Recursively flush tasks scheduled by a microtask.
+ recursivelyFlushAsyncActWork(
+ returnValue,
+ resolve,
+ reject
+ )
+ );
+ });
+ } catch (error) {
+ // `thenable` might not be a real promise, and `flushActQueue`
+ // might throw, so we need to wrap `flushActQueue` in a
+ // try/catch.
+ reject(error);
+ }
+ } else {
+ resolve(returnValue);
+ }
+ },
+ function (error) {
+ popActScope(prevActQueue, prevActScopeDepth);
+ reject(error);
+ }
+ );
+ }
+ };
+ } else {
+ var returnValue = result; // The callback is not an async function. Exit the current
+ // scope immediately.
- warnAboutAccessingRef.isReactWarning = true;
- Object.defineProperty(props, "ref", {
- get: warnAboutAccessingRef,
- configurable: 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
- */
+ popActScope(prevActQueue, prevActScopeDepth);
- function ReactElement(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
- };
+ if (prevActScopeDepth === 0) {
+ // We're exiting the outermost `act` scope. Flush the queue.
+ flushActQueue(queue); // If the queue is not empty, it implies that we intentionally yielded
+ // to the main thread, because something suspended. We will continue
+ // in an asynchronous task.
+ //
+ // Warn if something suspends but the `act` call is not awaited.
+ // In a future release, consider making this an error.
- {
- // 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.
+ if (queue.length !== 0) {
+ queueSeveralMicrotasks(function () {
+ if (!didAwaitActCall && !didWarnNoAwaitAct) {
+ didWarnNoAwaitAct = true;
- Object.defineProperty(element._store, "validated", {
- configurable: false,
- enumerable: false,
- writable: true,
- value: false
- }); // self and source are DEV only properties.
+ error(
+ "A component suspended inside an `act` scope, but the " +
+ "`act` call was not awaited. When testing React " +
+ "components that depend on asynchronous data, you must " +
+ "await the result:\n\n" +
+ "await act(() => ...)"
+ );
+ }
+ });
+ } // Like many things in this module, this is next part is confusing.
+ //
+ // We do not currently require every `act` call that is passed a
+ // callback to be awaited, through arguably we should. Since this
+ // callback was synchronous, we need to exit the current scope before
+ // returning.
+ //
+ // However, if thenable we're about to return *is* awaited, we'll
+ // immediately restore the current scope. So it shouldn't observable.
+ //
+ // This doesn't affect the case where the scope callback is async,
+ // because we always require those calls to be awaited.
+ //
+ // TODO: In a future version, consider always requiring all `act` calls
+ // to be awaited, regardless of whether the callback is sync or async.
- 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.
+ ReactCurrentActQueue.current = null;
+ }
- Object.defineProperty(element, "_source", {
- configurable: false,
- enumerable: false,
- writable: false,
- value: source
- });
+ return {
+ then: function (resolve, reject) {
+ didAwaitActCall = true;
- if (Object.freeze) {
- Object.freeze(element.props);
- Object.freeze(element);
+ if (prevActScopeDepth === 0) {
+ // If the `act` call is awaited, restore the queue we were
+ // using before (see long comment above) so we can flush it.
+ ReactCurrentActQueue.current = queue;
+ enqueueTask(function () {
+ return (
+ // Recursively flush tasks scheduled by a microtask.
+ recursivelyFlushAsyncActWork(returnValue, resolve, reject)
+ );
+ });
+ } else {
+ resolve(returnValue);
+ }
+ }
+ };
}
}
-
- return element;
}
- /**
- * https://github.com/reactjs/rfcs/pull/107
- * @param {*} type
- * @param {object} props
- * @param {string} key
- */
- function jsxDEV$1(type, config, maybeKey, source, self) {
+ function popActScope(prevActQueue, prevActScopeDepth) {
{
- var propName; // Reserved names are extracted
+ 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. "
+ );
+ }
- var props = {};
- var key = null;
- var ref = null; // Currently, key can be spread in as a prop. This causes a potential
- // issue if key is also explicitly declared (ie.
- // or ). We want to deprecate key spread,
- // but as an intermediary step, we will use jsxDEV for everything except
- // , because we aren't currently able to tell if
- // key is explicitly declared to be undefined or not.
+ actScopeDepth = prevActScopeDepth;
+ }
+ }
- if (maybeKey !== undefined) {
- {
- checkKeyStringCoercion(maybeKey);
- }
+ function recursivelyFlushAsyncActWork(returnValue, resolve, reject) {
+ {
+ // Check if any tasks were scheduled asynchronously.
+ var queue = ReactCurrentActQueue.current;
- key = "" + maybeKey;
- }
+ if (queue !== null) {
+ if (queue.length !== 0) {
+ // Async tasks were scheduled, mostly likely in a microtask.
+ // Keep flushing until there are no more.
+ try {
+ flushActQueue(queue); // The work we just performed may have schedule additional async
+ // tasks. Wait a macrotask and check again.
- if (hasValidKey(config)) {
- {
- checkKeyStringCoercion(config.key);
+ enqueueTask(function () {
+ return recursivelyFlushAsyncActWork(
+ returnValue,
+ resolve,
+ reject
+ );
+ });
+ } catch (error) {
+ // Leave remaining tasks on the queue if something throws.
+ reject(error);
+ }
+ } else {
+ // The queue is empty. We can finish.
+ ReactCurrentActQueue.current = null;
+ resolve(returnValue);
}
-
- key = "" + config.key;
+ } else {
+ resolve(returnValue);
}
+ }
+ }
- if (hasValidRef(config)) {
- ref = config.ref;
- warnIfStringRefCannotBeAutoConverted(config, self);
- } // Remaining properties are added to a new props object
+ var isFlushing = false;
- for (propName in config) {
- if (
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName)
- ) {
- props[propName] = config[propName];
- }
- } // Resolve default props
+ function flushActQueue(queue) {
+ {
+ if (!isFlushing) {
+ // Prevent re-entrance.
+ isFlushing = true;
+ var i = 0;
- if (type && type.defaultProps) {
- var defaultProps = type.defaultProps;
+ try {
+ for (; i < queue.length; i++) {
+ var callback = queue[i];
- for (propName in defaultProps) {
- if (props[propName] === undefined) {
- props[propName] = defaultProps[propName];
- }
- }
- }
+ do {
+ ReactCurrentActQueue.didUsePromise = false;
+ var continuation = callback(false);
- if (key || ref) {
- var displayName =
- typeof type === "function"
- ? type.displayName || type.name || "Unknown"
- : type;
+ if (continuation !== null) {
+ if (ReactCurrentActQueue.didUsePromise) {
+ // The component just suspended. Yield to the main thread in
+ // case the promise is already resolved. If so, it will ping in
+ // a microtask and we can resume without unwinding the stack.
+ queue[i] = callback;
+ queue.splice(0, i);
+ return;
+ }
- if (key) {
- defineKeyPropWarningGetter(props, displayName);
- }
+ callback = continuation;
+ } else {
+ break;
+ }
+ } while (true);
+ } // We flushed the entire queue.
- if (ref) {
- defineRefPropWarningGetter(props, displayName);
+ queue.length = 0;
+ } catch (error) {
+ // If something throws, leave the remaining callbacks on the queue.
+ queue.splice(0, i + 1);
+ throw error;
+ } finally {
+ isFlushing = false;
}
}
-
- return ReactElement(
- type,
- key,
- ref,
- self,
- source,
- ReactCurrentOwner$1.current,
- props
- );
}
- }
+ } // Some of our warnings attempt to detect if the `act` call is awaited by
+ // checking in an asynchronous task. Wait a few microtasks before checking. The
+ // only reason one isn't sufficient is we want to accommodate the case where an
+ // `act` call is returned from an async function without first being awaited,
+ // since that's a somewhat common pattern. If you do this too many times in a
+ // nested sequence, you might get a warning, but you can always fix by awaiting
+ // the call.
+ //
+ // A macrotask would also work (and is the fallback) but depending on the test
+ // environment it may cause the warning to fire too late.
+
+ var queueSeveralMicrotasks =
+ typeof queueMicrotask === "function"
+ ? function (callback) {
+ queueMicrotask(function () {
+ return queueMicrotask(callback);
+ });
+ }
+ : enqueueTask;
+
+ var Children = {
+ map: mapChildren,
+ forEach: forEachChildren,
+ count: countChildren,
+ toArray: toArray,
+ only: onlyChild
+ };
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js
index e92d357c40156..5d0d88f03a013 100644
--- a/compiled/facebook-www/React-dev.modern.js
+++ b/compiled/facebook-www/React-dev.modern.js
@@ -24,7 +24,7 @@ if (__DEV__) {
) {
__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
}
- var ReactVersion = "18.3.0-www-modern-7437533c";
+ var ReactVersion = "18.3.0-www-modern-3d181aee";
// ATTENTION
// When adding new symbols to this file,
@@ -1677,634 +1677,915 @@ if (__DEV__) {
}
}
- var REACT_CLIENT_REFERENCE$1 = Symbol.for("react.client.reference");
-
- 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$1;
+ var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
+ var RESERVED_PROPS = {
+ key: true,
+ ref: true,
+ __self: true,
+ __source: true
+ };
+ var specialPropKeyWarningShown;
+ var specialPropRefWarningShown;
+ var didWarnAboutStringRefs;
{
- propTypesMisspellWarningShown$1 = false;
+ didWarnAboutStringRefs = {};
}
- function getDeclarationErrorAddendum$1() {
- if (ReactCurrentOwner$2.current) {
- var name = getComponentNameFromType(ReactCurrentOwner$2.current.type);
+ function hasValidRef(config) {
+ {
+ if (hasOwnProperty.call(config, "ref")) {
+ var getter = Object.getOwnPropertyDescriptor(config, "ref").get;
- if (name) {
- return "\n\nCheck the render method of `" + name + "`.";
+ if (getter && getter.isReactWarning) {
+ return false;
+ }
}
}
- return "";
+ return config.ref !== undefined;
}
- function getSourceInfoErrorAddendum$1(source) {
- if (source !== undefined) {
- var fileName = source.fileName.replace(/^.*[\\\/]/, "");
- var lineNumber = source.lineNumber;
- return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
- }
-
- return "";
- }
+ function hasValidKey(config) {
+ {
+ if (hasOwnProperty.call(config, "key")) {
+ var getter = Object.getOwnPropertyDescriptor(config, "key").get;
- function getSourceInfoErrorAddendumForProps(elementProps) {
- if (elementProps !== null && elementProps !== undefined) {
- return getSourceInfoErrorAddendum$1(elementProps.__source);
+ if (getter && getter.isReactWarning) {
+ return false;
+ }
+ }
}
- return "";
+ return config.key !== undefined;
}
- /**
- * 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$1 = {};
-
- function getCurrentComponentErrorInfo$1(parentType) {
- var info = getDeclarationErrorAddendum$1();
+ function warnIfStringRefCannotBeAutoConverted(config, self) {
+ {
+ if (
+ typeof config.ref === "string" &&
+ ReactCurrentOwner$1.current &&
+ self &&
+ ReactCurrentOwner$1.current.stateNode !== self
+ ) {
+ var componentName = getComponentNameFromType(
+ ReactCurrentOwner$1.current.type
+ );
- if (!info) {
- var parentName = getComponentNameFromType(parentType);
+ 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",
+ getComponentNameFromType(ReactCurrentOwner$1.current.type),
+ config.ref
+ );
- if (parentName) {
- info =
- "\n\nCheck the top-level render call using <" + parentName + ">.";
+ didWarnAboutStringRefs[componentName] = true;
+ }
}
}
-
- 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$1(element, parentType) {
- if (!element._store || element._store.validated || element.key != null) {
- return;
- }
-
- element._store.validated = true;
- var currentComponentErrorInfo =
- getCurrentComponentErrorInfo$1(parentType);
-
- if (ownerHasKeyUseWarning$1[currentComponentErrorInfo]) {
- return;
- }
- ownerHasKeyUseWarning$1[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.
+ function defineKeyPropWarningGetter(props, displayName) {
+ {
+ var warnAboutAccessingKey = function () {
+ if (!specialPropKeyWarningShown) {
+ specialPropKeyWarningShown = true;
- var childOwner = "";
+ 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
+ );
+ }
+ };
- if (
- element &&
- element._owner &&
- element._owner !== ReactCurrentOwner$2.current
- ) {
- // Give the component that originally created this child.
- childOwner =
- " It was passed a child from " +
- getComponentNameFromType(element._owner.type) +
- ".";
+ warnAboutAccessingKey.isReactWarning = true;
+ Object.defineProperty(props, "key", {
+ get: warnAboutAccessingKey,
+ configurable: true
+ });
}
+ }
+ function defineRefPropWarningGetter(props, displayName) {
{
- setCurrentlyValidatingElement$1(element);
+ var warnAboutAccessingRef = function () {
+ if (!specialPropRefWarningShown) {
+ specialPropRefWarningShown = true;
- 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
- );
+ 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
+ );
+ }
+ };
- setCurrentlyValidatingElement$1(null);
+ warnAboutAccessingRef.isReactWarning = true;
+ Object.defineProperty(props, "ref", {
+ get: warnAboutAccessingRef,
+ configurable: true
+ });
}
}
/**
- * 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.
+ * 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
- * @param {ReactNode} node Statically passed child of any type.
- * @param {*} parentType node's parent's type.
*/
- function validateChildKeys$1(node, parentType) {
- if (typeof node !== "object" || !node) {
- return;
- }
-
- if (node.$$typeof === REACT_CLIENT_REFERENCE$1);
- else if (isArray(node)) {
- for (var i = 0; i < node.length; i++) {
- var child = node[i];
+ function ReactElement(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
+ };
- if (isValidElement$1(child)) {
- validateExplicitKey$1(child, parentType);
- }
- }
- } else if (isValidElement$1(node)) {
- // This element was passed in a valid location.
- if (node._store) {
- node._store.validated = true;
- }
- } else {
- var iteratorFn = getIteratorFn(node);
+ {
+ // 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.
- 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;
+ Object.defineProperty(element._store, "validated", {
+ configurable: false,
+ enumerable: false,
+ writable: true,
+ value: false
+ }); // self and source are DEV only properties.
- while (!(step = iterator.next()).done) {
- if (isValidElement$1(step.value)) {
- validateExplicitKey$1(step.value, parentType);
- }
- }
- }
+ 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;
}
/**
- * Given an element, validate that its props follow the propTypes definition,
- * provided by the type.
- *
- * @param {ReactElement} element
+ * https://github.com/reactjs/rfcs/pull/107
+ * @param {*} type
+ * @param {object} props
+ * @param {string} key
*/
- function validatePropTypes$1(element) {
+ function jsxDEV$1(type, config, maybeKey, source, self) {
{
- var type = element.type;
+ var propName; // Reserved names are extracted
- if (type === null || type === undefined || typeof type === "string") {
- return;
- }
+ var props = {};
+ var key = null;
+ var ref = null; // Currently, key can be spread in as a prop. This causes a potential
+ // issue if key is also explicitly declared (ie.
+ // or ). We want to deprecate key spread,
+ // but as an intermediary step, we will use jsxDEV for everything except
+ // , because we aren't currently able to tell if
+ // key is explicitly declared to be undefined or not.
- if (type.$$typeof === REACT_CLIENT_REFERENCE$1) {
- return;
+ if (maybeKey !== undefined) {
+ {
+ checkKeyStringCoercion(maybeKey);
+ }
+
+ key = "" + maybeKey;
}
- var propTypes;
+ if (hasValidKey(config)) {
+ {
+ checkKeyStringCoercion(config.key);
+ }
- 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;
+ key = "" + config.key;
}
- 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$1
- ) {
- propTypesMisspellWarningShown$1 = true; // Intentionally inside to avoid triggering lazy initializers:
+ if (hasValidRef(config)) {
+ ref = config.ref;
+ warnIfStringRefCannotBeAutoConverted(config, self);
+ } // Remaining properties are added to a new props object
- var _name = getComponentNameFromType(type);
+ for (propName in config) {
+ if (
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName)
+ ) {
+ props[propName] = config[propName];
+ }
+ } // Resolve default props
- error(
- "Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",
- _name || "Unknown"
- );
- }
+ if (type && type.defaultProps) {
+ var defaultProps = type.defaultProps;
- 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."
- );
+ for (propName in defaultProps) {
+ if (props[propName] === undefined) {
+ props[propName] = defaultProps[propName];
+ }
+ }
}
- }
- }
- /**
- * Given a fragment, validate that it can only be provided with fragment props
- * @param {ReactElement} fragment
- */
-
- function validateFragmentProps$1(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);
+ if (key || ref) {
+ var displayName =
+ typeof type === "function"
+ ? type.displayName || type.name || "Unknown"
+ : type;
- error(
- "Invalid prop `%s` supplied to `React.Fragment`. " +
- "React.Fragment can only have `key` and `children` props.",
- key
- );
+ if (key) {
+ defineKeyPropWarningGetter(props, displayName);
+ }
- setCurrentlyValidatingElement$1(null);
- break;
+ if (ref) {
+ defineRefPropWarningGetter(props, displayName);
}
}
- if (fragment.ref !== null) {
- setCurrentlyValidatingElement$1(fragment);
+ return ReactElement(
+ type,
+ key,
+ ref,
+ self,
+ source,
+ ReactCurrentOwner$1.current,
+ props
+ );
+ }
+ }
- error("Invalid attribute `ref` supplied to `React.Fragment`.");
+ var REACT_CLIENT_REFERENCE$1 = Symbol.for("react.client.reference");
- setCurrentlyValidatingElement$1(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);
}
}
}
- 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 = "";
+ var propTypesMisspellWarningShown$1;
- 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.";
- }
+ {
+ propTypesMisspellWarningShown$1 = false;
+ }
- var sourceInfo = getSourceInfoErrorAddendumForProps(props);
+ function getDeclarationErrorAddendum$1() {
+ if (ReactCurrentOwner$2.current) {
+ var name = getComponentNameFromType(ReactCurrentOwner$2.current.type);
- if (sourceInfo) {
- info += sourceInfo;
- } else {
- info += getDeclarationErrorAddendum$1();
+ if (name) {
+ return "\n\nCheck the render method of `" + name + "`.";
}
+ }
- 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;
- }
+ return "";
+ }
- {
- 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
- );
- }
+ function getSourceInfoErrorAddendum$1(source) {
+ if (source !== undefined) {
+ var fileName = source.fileName.replace(/^.*[\\\/]/, "");
+ var lineNumber = source.lineNumber;
+ return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
}
- var element = createElement$1.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.
+ return "";
+ }
- 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$1(arguments[i], type);
- }
- }
-
- if (type === REACT_FRAGMENT_TYPE) {
- validateFragmentProps$1(element);
- } else {
- validatePropTypes$1(element);
- }
-
- return element;
- }
- function cloneElementWithValidation(element, props, children) {
- var newElement = cloneElement$1.apply(this, arguments);
-
- for (var i = 2; i < arguments.length; i++) {
- validateChildKeys$1(arguments[i], newElement.type);
+ function getSourceInfoErrorAddendumForProps(elementProps) {
+ if (elementProps !== null && elementProps !== undefined) {
+ return getSourceInfoErrorAddendum$1(elementProps.__source);
}
- validatePropTypes$1(newElement);
- return newElement;
+ return "";
}
-
- var createElement = createElementWithValidation;
- var cloneElement = cloneElementWithValidation;
-
- 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.
+ * 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.
*/
- 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 ownerHasKeyUseWarning$1 = {};
- var didWarnAboutMaps = false;
- var userProvidedKeyEscapeRegex = /\/+/g;
+ function getCurrentComponentErrorInfo$1(parentType) {
+ var info = getDeclarationErrorAddendum$1();
- function escapeUserProvidedKey(text) {
- return text.replace(userProvidedKeyEscapeRegex, "$&/");
+ if (!info) {
+ var parentName = getComponentNameFromType(parentType);
+
+ if (parentName) {
+ info =
+ "\n\nCheck the top-level render call using <" + parentName + ">.";
+ }
+ }
+
+ return info;
}
/**
- * Generate a key string that identifies a element within a set.
+ * 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.
*
- * @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}
+ * @internal
+ * @param {ReactElement} element Element that requires a key.
+ * @param {*} parentType element's parent's type.
*/
- 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);
- }
+ function validateExplicitKey$1(element, parentType) {
+ if (!element._store || element._store.validated || element.key != null) {
+ return;
+ }
- return escape("" + element.key);
- } // Implicit key determined by the index in the set
+ element._store.validated = true;
+ var currentComponentErrorInfo =
+ getCurrentComponentErrorInfo$1(parentType);
- return index.toString(36);
- }
+ if (ownerHasKeyUseWarning$1[currentComponentErrorInfo]) {
+ return;
+ }
- function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
- var type = typeof children;
+ ownerHasKeyUseWarning$1[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.
- if (type === "undefined" || type === "boolean") {
- // All of the above are perceived as null.
- children = null;
+ var childOwner = "";
+
+ if (
+ element &&
+ element._owner &&
+ element._owner !== ReactCurrentOwner$2.current
+ ) {
+ // Give the component that originally created this child.
+ childOwner =
+ " It was passed a child from " +
+ getComponentNameFromType(element._owner.type) +
+ ".";
}
- var invokeCallback = false;
+ {
+ setCurrentlyValidatingElement$1(element);
- if (children === null) {
- invokeCallback = true;
- } else {
- switch (type) {
- case "string":
- case "number":
- invokeCallback = true;
- break;
+ 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
+ );
- case "object":
- switch (children.$$typeof) {
- case REACT_ELEMENT_TYPE:
- case REACT_PORTAL_TYPE:
- invokeCallback = true;
- }
- }
+ 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.
+ */
- 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;
+ function validateChildKeys$1(node, parentType) {
+ if (typeof node !== "object" || !node) {
+ return;
+ }
- if (isArray(mappedChild)) {
- var escapedChildKey = "";
+ if (node.$$typeof === REACT_CLIENT_REFERENCE$1);
+ else if (isArray(node)) {
+ for (var i = 0; i < node.length; i++) {
+ var child = node[i];
- if (childKey != null) {
- escapedChildKey = escapeUserProvidedKey(childKey) + "/";
+ if (isValidElement$1(child)) {
+ validateExplicitKey$1(child, parentType);
}
+ }
+ } else if (isValidElement$1(node)) {
+ // This element was passed in a valid location.
+ if (node._store) {
+ node._store.validated = true;
+ }
+ } else {
+ var iteratorFn = getIteratorFn(node);
- mapIntoArray(mappedChild, array, escapedChildKey, "", function (c) {
- return c;
- });
- } else if (mappedChild != null) {
- if (isValidElement$1(mappedChild)) {
- {
- // The `if` statement here prevents auto-disabling of the safe
- // coercion ESLint rule, so we must manually disable it below.
- // $FlowFixMe[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
- if (
- mappedChild.key &&
- (!_child || _child.key !== mappedChild.key)
- ) {
- checkKeyStringCoercion(mappedChild.key);
+ 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$1(step.value)) {
+ validateExplicitKey$1(step.value, parentType);
}
}
-
- 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[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
- (mappedChild.key && (!_child || _child.key !== mappedChild.key)
- ? escapeUserProvidedKey(
- // $FlowFixMe[unsafe-addition]
- "" + mappedChild.key // eslint-disable-line react-internal/safe-string-coercion
- ) + "/"
- : "") +
- childKey
- );
}
-
- array.push(mappedChild);
}
-
- return 1;
}
+ }
+ /**
+ * Given an element, validate that its props follow the propTypes definition,
+ * provided by the type.
+ *
+ * @param {ReactElement} element
+ */
- var child;
- var nextName;
- var subtreeCount = 0; // Count of children found in the current subtree.
+ function validatePropTypes$1(element) {
+ {
+ var type = element.type;
- var nextNamePrefix =
- nameSoFar === "" ? SEPARATOR : nameSoFar + SUBSEPARATOR;
+ if (type === null || type === undefined || typeof type === "string") {
+ return;
+ }
- 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
+ if (type.$$typeof === REACT_CLIENT_REFERENCE$1) {
+ 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$1
+ ) {
+ propTypesMisspellWarningShown$1 = 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"
);
}
- } else {
- var iteratorFn = getIteratorFn(children);
- if (typeof iteratorFn === "function") {
- var iterableChildren = children;
+ 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
+ */
- {
- // 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."
- );
- }
+ function validateFragmentProps$1(fragment) {
+ {
+ var keys = Object.keys(fragment.props);
- didWarnAboutMaps = true;
- }
- }
+ for (var i = 0; i < keys.length; i++) {
+ var key = keys[i];
- var iterator = iteratorFn.call(iterableChildren);
- var step;
- var ii = 0; // $FlowFixMe[incompatible-use] `iteratorFn` might return null according to typing.
+ if (key !== "children" && key !== "key") {
+ setCurrentlyValidatingElement$1(fragment);
- while (!(step = iterator.next()).done) {
- child = step.value;
- nextName = nextNamePrefix + getElementKey(child, ii++);
- subtreeCount += mapIntoArray(
- child,
- array,
- escapedPrefix,
- nextName,
- callback
+ error(
+ "Invalid prop `%s` supplied to `React.Fragment`. " +
+ "React.Fragment can only have `key` and `children` props.",
+ key
);
+
+ setCurrentlyValidatingElement$1(null);
+ break;
}
- } 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."
+ }
+
+ 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$1();
+ }
+
+ 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
);
}
}
- return subtreeCount;
+ var element = createElement$1.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$1(arguments[i], type);
+ }
+ }
+
+ if (type === REACT_FRAGMENT_TYPE) {
+ validateFragmentProps$1(element);
+ } else {
+ validatePropTypes$1(element);
+ }
+
+ return element;
}
- /**
- * 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 cloneElementWithValidation(element, props, children) {
+ var newElement = cloneElement$1.apply(this, arguments);
- function mapChildren(children, func, context) {
- if (children == null) {
- // $FlowFixMe limitation refining abstract types in Flow
- return children;
+ for (var i = 2; i < arguments.length; i++) {
+ validateChildKeys$1(arguments[i], newElement.type);
}
- var result = [];
- var count = 0;
- mapIntoArray(children, result, "", "", function (child) {
- return func.call(context, child, count++);
- });
- return result;
+ validatePropTypes$1(newElement);
+ return newElement;
}
+
+ var createElement = createElementWithValidation;
+ var cloneElement = cloneElementWithValidation;
+
+ var SEPARATOR = ".";
+ var SUBSEPARATOR = ":";
/**
- * Count the number of children that are typically specified as
- * `props.children`.
- *
- * See https://reactjs.org/docs/react-api.html#reactchildrencount
+ * Escape and wrap key so it is safe to use as a reactid
*
- * @param {?*} children Children tree container.
- * @return {number} The number of children.
+ * @param {string} key to be escaped.
+ * @return {string} the escaped key.
*/
- function countChildren(children) {
- var n = 0;
- mapChildren(children, function () {
- n++; // Don't return anything
+ function escape(key) {
+ var escapeRegex = /[=:]/g;
+ var escaperLookup = {
+ "=": "=0",
+ ":": "=2"
+ };
+ var escapedString = key.replace(escapeRegex, function (match) {
+ return escaperLookup[match];
});
- return n;
+ return "$" + escapedString;
}
/**
- * 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.
+ * 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$1(mappedChild)) {
+ {
+ // The `if` statement here prevents auto-disabling of the safe
+ // coercion ESLint rule, so we must manually disable it below.
+ // $FlowFixMe[incompatible-type] 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[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
+ (mappedChild.key && (!_child || _child.key !== mappedChild.key)
+ ? escapeUserProvidedKey(
+ // $FlowFixMe[unsafe-addition]
+ "" + mappedChild.key // eslint-disable-line react-internal/safe-string-coercion
+ ) + "/"
+ : "") +
+ 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; // $FlowFixMe[incompatible-use] `iteratorFn` might return null according to typing.
+
+ 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) {
+ // $FlowFixMe limitation refining abstract types in Flow
+ 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
@@ -3192,468 +3473,187 @@ if (__DEV__) {
if (prevActScopeDepth === 0) {
// We're exiting the outermost `act` scope. Flush the queue.
flushActQueue(queue); // If the queue is not empty, it implies that we intentionally yielded
- // to the main thread, because something suspended. We will continue
- // in an asynchronous task.
- //
- // Warn if something suspends but the `act` call is not awaited.
- // In a future release, consider making this an error.
-
- if (queue.length !== 0) {
- queueSeveralMicrotasks(function () {
- if (!didAwaitActCall && !didWarnNoAwaitAct) {
- didWarnNoAwaitAct = true;
-
- error(
- "A component suspended inside an `act` scope, but the " +
- "`act` call was not awaited. When testing React " +
- "components that depend on asynchronous data, you must " +
- "await the result:\n\n" +
- "await act(() => ...)"
- );
- }
- });
- } // Like many things in this module, this is next part is confusing.
- //
- // We do not currently require every `act` call that is passed a
- // callback to be awaited, through arguably we should. Since this
- // callback was synchronous, we need to exit the current scope before
- // returning.
- //
- // However, if thenable we're about to return *is* awaited, we'll
- // immediately restore the current scope. So it shouldn't observable.
- //
- // This doesn't affect the case where the scope callback is async,
- // because we always require those calls to be awaited.
- //
- // TODO: In a future version, consider always requiring all `act` calls
- // to be awaited, regardless of whether the callback is sync or async.
-
- ReactCurrentActQueue.current = null;
- }
-
- return {
- then: function (resolve, reject) {
- didAwaitActCall = true;
-
- if (prevActScopeDepth === 0) {
- // If the `act` call is awaited, restore the queue we were
- // using before (see long comment above) so we can flush it.
- ReactCurrentActQueue.current = queue;
- enqueueTask(function () {
- return (
- // Recursively flush tasks scheduled by a microtask.
- recursivelyFlushAsyncActWork(returnValue, resolve, reject)
- );
- });
- } else {
- resolve(returnValue);
- }
- }
- };
- }
- }
- }
-
- function popActScope(prevActQueue, 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) {
- {
- // Check if any tasks were scheduled asynchronously.
- var queue = ReactCurrentActQueue.current;
-
- if (queue !== null) {
- if (queue.length !== 0) {
- // Async tasks were scheduled, mostly likely in a microtask.
- // Keep flushing until there are no more.
- try {
- flushActQueue(queue); // The work we just performed may have schedule additional async
- // tasks. Wait a macrotask and check again.
-
- enqueueTask(function () {
- return recursivelyFlushAsyncActWork(
- returnValue,
- resolve,
- reject
- );
- });
- } catch (error) {
- // Leave remaining tasks on the queue if something throws.
- reject(error);
- }
- } else {
- // The queue is empty. We can finish.
- ReactCurrentActQueue.current = null;
- resolve(returnValue);
- }
- } 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 {
- ReactCurrentActQueue.didUsePromise = false;
- var continuation = callback(false);
-
- if (continuation !== null) {
- if (ReactCurrentActQueue.didUsePromise) {
- // The component just suspended. Yield to the main thread in
- // case the promise is already resolved. If so, it will ping in
- // a microtask and we can resume without unwinding the stack.
- queue[i] = callback;
- queue.splice(0, i);
- return;
- }
-
- callback = continuation;
- } else {
- break;
- }
- } while (true);
- } // We flushed the entire queue.
-
- queue.length = 0;
- } catch (error) {
- // If something throws, leave the remaining callbacks on the queue.
- queue.splice(0, i + 1);
- throw error;
- } finally {
- isFlushing = false;
- }
- }
- }
- } // Some of our warnings attempt to detect if the `act` call is awaited by
- // checking in an asynchronous task. Wait a few microtasks before checking. The
- // only reason one isn't sufficient is we want to accommodate the case where an
- // `act` call is returned from an async function without first being awaited,
- // since that's a somewhat common pattern. If you do this too many times in a
- // nested sequence, you might get a warning, but you can always fix by awaiting
- // the call.
- //
- // A macrotask would also work (and is the fallback) but depending on the test
- // environment it may cause the warning to fire too late.
-
- var queueSeveralMicrotasks =
- typeof queueMicrotask === "function"
- ? function (callback) {
- queueMicrotask(function () {
- return queueMicrotask(callback);
- });
- }
- : enqueueTask;
-
- var Children = {
- map: mapChildren,
- forEach: forEachChildren,
- count: countChildren,
- toArray: toArray,
- only: onlyChild
- };
-
- var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
- var RESERVED_PROPS = {
- key: true,
- ref: true,
- __self: true,
- __source: true
- };
- var specialPropKeyWarningShown;
- var specialPropRefWarningShown;
- var 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 warnIfStringRefCannotBeAutoConverted(config, self) {
- {
- if (
- typeof config.ref === "string" &&
- ReactCurrentOwner$1.current &&
- self &&
- ReactCurrentOwner$1.current.stateNode !== self
- ) {
- var componentName = getComponentNameFromType(
- ReactCurrentOwner$1.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",
- getComponentNameFromType(ReactCurrentOwner$1.current.type),
- config.ref
- );
-
- didWarnAboutStringRefs[componentName] = true;
- }
- }
- }
- }
-
- 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
- });
- }
- }
- /**
- * 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
- */
-
- function ReactElement(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
- };
+ // to the main thread, because something suspended. We will continue
+ // in an asynchronous task.
+ //
+ // Warn if something suspends but the `act` call is not awaited.
+ // In a future release, consider making this an error.
- {
- // 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.
+ if (queue.length !== 0) {
+ queueSeveralMicrotasks(function () {
+ if (!didAwaitActCall && !didWarnNoAwaitAct) {
+ didWarnNoAwaitAct = true;
- Object.defineProperty(element._store, "validated", {
- configurable: false,
- enumerable: false,
- writable: true,
- value: false
- }); // self and source are DEV only properties.
+ error(
+ "A component suspended inside an `act` scope, but the " +
+ "`act` call was not awaited. When testing React " +
+ "components that depend on asynchronous data, you must " +
+ "await the result:\n\n" +
+ "await act(() => ...)"
+ );
+ }
+ });
+ } // Like many things in this module, this is next part is confusing.
+ //
+ // We do not currently require every `act` call that is passed a
+ // callback to be awaited, through arguably we should. Since this
+ // callback was synchronous, we need to exit the current scope before
+ // returning.
+ //
+ // However, if thenable we're about to return *is* awaited, we'll
+ // immediately restore the current scope. So it shouldn't observable.
+ //
+ // This doesn't affect the case where the scope callback is async,
+ // because we always require those calls to be awaited.
+ //
+ // TODO: In a future version, consider always requiring all `act` calls
+ // to be awaited, regardless of whether the callback is sync or async.
- 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.
+ ReactCurrentActQueue.current = null;
+ }
- Object.defineProperty(element, "_source", {
- configurable: false,
- enumerable: false,
- writable: false,
- value: source
- });
+ return {
+ then: function (resolve, reject) {
+ didAwaitActCall = true;
- if (Object.freeze) {
- Object.freeze(element.props);
- Object.freeze(element);
+ if (prevActScopeDepth === 0) {
+ // If the `act` call is awaited, restore the queue we were
+ // using before (see long comment above) so we can flush it.
+ ReactCurrentActQueue.current = queue;
+ enqueueTask(function () {
+ return (
+ // Recursively flush tasks scheduled by a microtask.
+ recursivelyFlushAsyncActWork(returnValue, resolve, reject)
+ );
+ });
+ } else {
+ resolve(returnValue);
+ }
+ }
+ };
}
}
-
- return element;
}
- /**
- * https://github.com/reactjs/rfcs/pull/107
- * @param {*} type
- * @param {object} props
- * @param {string} key
- */
- function jsxDEV$1(type, config, maybeKey, source, self) {
+ function popActScope(prevActQueue, prevActScopeDepth) {
{
- var propName; // Reserved names are extracted
+ 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. "
+ );
+ }
- var props = {};
- var key = null;
- var ref = null; // Currently, key can be spread in as a prop. This causes a potential
- // issue if key is also explicitly declared (ie.
- // or ). We want to deprecate key spread,
- // but as an intermediary step, we will use jsxDEV for everything except
- // , because we aren't currently able to tell if
- // key is explicitly declared to be undefined or not.
+ actScopeDepth = prevActScopeDepth;
+ }
+ }
- if (maybeKey !== undefined) {
- {
- checkKeyStringCoercion(maybeKey);
- }
+ function recursivelyFlushAsyncActWork(returnValue, resolve, reject) {
+ {
+ // Check if any tasks were scheduled asynchronously.
+ var queue = ReactCurrentActQueue.current;
- key = "" + maybeKey;
- }
+ if (queue !== null) {
+ if (queue.length !== 0) {
+ // Async tasks were scheduled, mostly likely in a microtask.
+ // Keep flushing until there are no more.
+ try {
+ flushActQueue(queue); // The work we just performed may have schedule additional async
+ // tasks. Wait a macrotask and check again.
- if (hasValidKey(config)) {
- {
- checkKeyStringCoercion(config.key);
+ enqueueTask(function () {
+ return recursivelyFlushAsyncActWork(
+ returnValue,
+ resolve,
+ reject
+ );
+ });
+ } catch (error) {
+ // Leave remaining tasks on the queue if something throws.
+ reject(error);
+ }
+ } else {
+ // The queue is empty. We can finish.
+ ReactCurrentActQueue.current = null;
+ resolve(returnValue);
}
-
- key = "" + config.key;
+ } else {
+ resolve(returnValue);
}
+ }
+ }
- if (hasValidRef(config)) {
- ref = config.ref;
- warnIfStringRefCannotBeAutoConverted(config, self);
- } // Remaining properties are added to a new props object
+ var isFlushing = false;
- for (propName in config) {
- if (
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName)
- ) {
- props[propName] = config[propName];
- }
- } // Resolve default props
+ function flushActQueue(queue) {
+ {
+ if (!isFlushing) {
+ // Prevent re-entrance.
+ isFlushing = true;
+ var i = 0;
- if (type && type.defaultProps) {
- var defaultProps = type.defaultProps;
+ try {
+ for (; i < queue.length; i++) {
+ var callback = queue[i];
- for (propName in defaultProps) {
- if (props[propName] === undefined) {
- props[propName] = defaultProps[propName];
- }
- }
- }
+ do {
+ ReactCurrentActQueue.didUsePromise = false;
+ var continuation = callback(false);
- if (key || ref) {
- var displayName =
- typeof type === "function"
- ? type.displayName || type.name || "Unknown"
- : type;
+ if (continuation !== null) {
+ if (ReactCurrentActQueue.didUsePromise) {
+ // The component just suspended. Yield to the main thread in
+ // case the promise is already resolved. If so, it will ping in
+ // a microtask and we can resume without unwinding the stack.
+ queue[i] = callback;
+ queue.splice(0, i);
+ return;
+ }
- if (key) {
- defineKeyPropWarningGetter(props, displayName);
- }
+ callback = continuation;
+ } else {
+ break;
+ }
+ } while (true);
+ } // We flushed the entire queue.
- if (ref) {
- defineRefPropWarningGetter(props, displayName);
+ queue.length = 0;
+ } catch (error) {
+ // If something throws, leave the remaining callbacks on the queue.
+ queue.splice(0, i + 1);
+ throw error;
+ } finally {
+ isFlushing = false;
}
}
-
- return ReactElement(
- type,
- key,
- ref,
- self,
- source,
- ReactCurrentOwner$1.current,
- props
- );
}
- }
+ } // Some of our warnings attempt to detect if the `act` call is awaited by
+ // checking in an asynchronous task. Wait a few microtasks before checking. The
+ // only reason one isn't sufficient is we want to accommodate the case where an
+ // `act` call is returned from an async function without first being awaited,
+ // since that's a somewhat common pattern. If you do this too many times in a
+ // nested sequence, you might get a warning, but you can always fix by awaiting
+ // the call.
+ //
+ // A macrotask would also work (and is the fallback) but depending on the test
+ // environment it may cause the warning to fire too late.
+
+ var queueSeveralMicrotasks =
+ typeof queueMicrotask === "function"
+ ? function (callback) {
+ queueMicrotask(function () {
+ return queueMicrotask(callback);
+ });
+ }
+ : enqueueTask;
+
+ var Children = {
+ map: mapChildren,
+ forEach: forEachChildren,
+ count: countChildren,
+ toArray: toArray,
+ only: onlyChild
+ };
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
diff --git a/compiled/facebook-www/React-prod.classic.js b/compiled/facebook-www/React-prod.classic.js
index 9909f63df7000..7599a9db4f368 100644
--- a/compiled/facebook-www/React-prod.classic.js
+++ b/compiled/facebook-www/React-prod.classic.js
@@ -144,7 +144,33 @@ var ReactCurrentDispatcher = { current: null },
ReactCurrentCache: ReactCurrentCache,
ReactCurrentBatchConfig: ReactCurrentBatchConfig,
ReactCurrentOwner: ReactCurrentOwner$1
+ },
+ ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
+ RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
+function jsx$1(type, config, maybeKey) {
+ var propName,
+ props = {},
+ key = null,
+ ref = null;
+ void 0 !== maybeKey && (key = "" + maybeKey);
+ void 0 !== config.key && (key = "" + config.key);
+ void 0 !== config.ref && (ref = config.ref);
+ for (propName in config)
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName) &&
+ (props[propName] = config[propName]);
+ if (type && type.defaultProps)
+ for (propName in ((config = type.defaultProps), config))
+ void 0 === props[propName] && (props[propName] = config[propName]);
+ return {
+ $$typeof: REACT_ELEMENT_TYPE,
+ type: type,
+ key: key,
+ ref: ref,
+ props: props,
+ _owner: ReactCurrentOwner.current
};
+}
function escape(key) {
var escaperLookup = { "=": "=0", ":": "=2" };
return (
@@ -283,37 +309,11 @@ function lazyInitializer(payload) {
}
function noop() {}
var onError =
- "function" === typeof reportError
- ? reportError
- : function (error) {
- console.error(error);
- },
- ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
- RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
-function jsx$1(type, config, maybeKey) {
- var propName,
- props = {},
- key = null,
- ref = null;
- void 0 !== maybeKey && (key = "" + maybeKey);
- void 0 !== config.key && (key = "" + config.key);
- void 0 !== config.ref && (ref = config.ref);
- for (propName in config)
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName) &&
- (props[propName] = config[propName]);
- if (type && type.defaultProps)
- for (propName in ((config = type.defaultProps), config))
- void 0 === props[propName] && (props[propName] = config[propName]);
- return {
- $$typeof: REACT_ELEMENT_TYPE,
- type: type,
- key: key,
- ref: ref,
- props: props,
- _owner: ReactCurrentOwner.current
- };
-}
+ "function" === typeof reportError
+ ? reportError
+ : function (error) {
+ console.error(error);
+ };
exports.Children = {
map: mapChildren,
forEach: function (children, forEachFunc, forEachContext) {
@@ -570,4 +570,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
-exports.version = "18.3.0-www-classic-f4740bf5";
+exports.version = "18.3.0-www-classic-b2425be8";
diff --git a/compiled/facebook-www/React-prod.modern.js b/compiled/facebook-www/React-prod.modern.js
index cd3ace0990a39..0667e50db9748 100644
--- a/compiled/facebook-www/React-prod.modern.js
+++ b/compiled/facebook-www/React-prod.modern.js
@@ -111,7 +111,33 @@ var ReactCurrentDispatcher = { current: null },
ReactCurrentCache: ReactCurrentCache,
ReactCurrentBatchConfig: ReactCurrentBatchConfig,
ReactCurrentOwner: ReactCurrentOwner$1
+ },
+ ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
+ RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
+function jsx$1(type, config, maybeKey) {
+ var propName,
+ props = {},
+ key = null,
+ ref = null;
+ void 0 !== maybeKey && (key = "" + maybeKey);
+ void 0 !== config.key && (key = "" + config.key);
+ void 0 !== config.ref && (ref = config.ref);
+ for (propName in config)
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName) &&
+ (props[propName] = config[propName]);
+ if (type && type.defaultProps)
+ for (propName in ((config = type.defaultProps), config))
+ void 0 === props[propName] && (props[propName] = config[propName]);
+ return {
+ $$typeof: REACT_ELEMENT_TYPE,
+ type: type,
+ key: key,
+ ref: ref,
+ props: props,
+ _owner: ReactCurrentOwner.current
};
+}
function escape(key) {
var escaperLookup = { "=": "=0", ":": "=2" };
return (
@@ -250,37 +276,11 @@ function lazyInitializer(payload) {
}
function noop() {}
var onError =
- "function" === typeof reportError
- ? reportError
- : function (error) {
- console.error(error);
- },
- ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
- RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
-function jsx$1(type, config, maybeKey) {
- var propName,
- props = {},
- key = null,
- ref = null;
- void 0 !== maybeKey && (key = "" + maybeKey);
- void 0 !== config.key && (key = "" + config.key);
- void 0 !== config.ref && (ref = config.ref);
- for (propName in config)
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName) &&
- (props[propName] = config[propName]);
- if (type && type.defaultProps)
- for (propName in ((config = type.defaultProps), config))
- void 0 === props[propName] && (props[propName] = config[propName]);
- return {
- $$typeof: REACT_ELEMENT_TYPE,
- type: type,
- key: key,
- ref: ref,
- props: props,
- _owner: ReactCurrentOwner.current
- };
-}
+ "function" === typeof reportError
+ ? reportError
+ : function (error) {
+ console.error(error);
+ };
exports.Children = {
map: mapChildren,
forEach: function (children, forEachFunc, forEachContext) {
@@ -562,4 +562,4 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
-exports.version = "18.3.0-www-modern-ec0970fd";
+exports.version = "18.3.0-www-modern-1e4811e0";
diff --git a/compiled/facebook-www/React-profiling.classic.js b/compiled/facebook-www/React-profiling.classic.js
index 3ab1aaeedb324..f9ffe8e1ca7e7 100644
--- a/compiled/facebook-www/React-profiling.classic.js
+++ b/compiled/facebook-www/React-profiling.classic.js
@@ -148,7 +148,33 @@ var ReactCurrentDispatcher = { current: null },
ReactCurrentCache: ReactCurrentCache,
ReactCurrentBatchConfig: ReactCurrentBatchConfig,
ReactCurrentOwner: ReactCurrentOwner$1
+ },
+ ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
+ RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
+function jsx$1(type, config, maybeKey) {
+ var propName,
+ props = {},
+ key = null,
+ ref = null;
+ void 0 !== maybeKey && (key = "" + maybeKey);
+ void 0 !== config.key && (key = "" + config.key);
+ void 0 !== config.ref && (ref = config.ref);
+ for (propName in config)
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName) &&
+ (props[propName] = config[propName]);
+ if (type && type.defaultProps)
+ for (propName in ((config = type.defaultProps), config))
+ void 0 === props[propName] && (props[propName] = config[propName]);
+ return {
+ $$typeof: REACT_ELEMENT_TYPE,
+ type: type,
+ key: key,
+ ref: ref,
+ props: props,
+ _owner: ReactCurrentOwner.current
};
+}
function escape(key) {
var escaperLookup = { "=": "=0", ":": "=2" };
return (
@@ -287,37 +313,11 @@ function lazyInitializer(payload) {
}
function noop() {}
var onError =
- "function" === typeof reportError
- ? reportError
- : function (error) {
- console.error(error);
- },
- ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
- RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
-function jsx$1(type, config, maybeKey) {
- var propName,
- props = {},
- key = null,
- ref = null;
- void 0 !== maybeKey && (key = "" + maybeKey);
- void 0 !== config.key && (key = "" + config.key);
- void 0 !== config.ref && (ref = config.ref);
- for (propName in config)
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName) &&
- (props[propName] = config[propName]);
- if (type && type.defaultProps)
- for (propName in ((config = type.defaultProps), config))
- void 0 === props[propName] && (props[propName] = config[propName]);
- return {
- $$typeof: REACT_ELEMENT_TYPE,
- type: type,
- key: key,
- ref: ref,
- props: props,
- _owner: ReactCurrentOwner.current
- };
-}
+ "function" === typeof reportError
+ ? reportError
+ : function (error) {
+ console.error(error);
+ };
exports.Children = {
map: mapChildren,
forEach: function (children, forEachFunc, forEachContext) {
@@ -574,7 +574,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
-exports.version = "18.3.0-www-classic-b75b6a09";
+exports.version = "18.3.0-www-classic-65d179d4";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
diff --git a/compiled/facebook-www/React-profiling.modern.js b/compiled/facebook-www/React-profiling.modern.js
index 7063f2fa4e176..46be190a41459 100644
--- a/compiled/facebook-www/React-profiling.modern.js
+++ b/compiled/facebook-www/React-profiling.modern.js
@@ -115,7 +115,33 @@ var ReactCurrentDispatcher = { current: null },
ReactCurrentCache: ReactCurrentCache,
ReactCurrentBatchConfig: ReactCurrentBatchConfig,
ReactCurrentOwner: ReactCurrentOwner$1
+ },
+ ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
+ RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
+function jsx$1(type, config, maybeKey) {
+ var propName,
+ props = {},
+ key = null,
+ ref = null;
+ void 0 !== maybeKey && (key = "" + maybeKey);
+ void 0 !== config.key && (key = "" + config.key);
+ void 0 !== config.ref && (ref = config.ref);
+ for (propName in config)
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName) &&
+ (props[propName] = config[propName]);
+ if (type && type.defaultProps)
+ for (propName in ((config = type.defaultProps), config))
+ void 0 === props[propName] && (props[propName] = config[propName]);
+ return {
+ $$typeof: REACT_ELEMENT_TYPE,
+ type: type,
+ key: key,
+ ref: ref,
+ props: props,
+ _owner: ReactCurrentOwner.current
};
+}
function escape(key) {
var escaperLookup = { "=": "=0", ":": "=2" };
return (
@@ -254,37 +280,11 @@ function lazyInitializer(payload) {
}
function noop() {}
var onError =
- "function" === typeof reportError
- ? reportError
- : function (error) {
- console.error(error);
- },
- ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
- RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
-function jsx$1(type, config, maybeKey) {
- var propName,
- props = {},
- key = null,
- ref = null;
- void 0 !== maybeKey && (key = "" + maybeKey);
- void 0 !== config.key && (key = "" + config.key);
- void 0 !== config.ref && (ref = config.ref);
- for (propName in config)
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName) &&
- (props[propName] = config[propName]);
- if (type && type.defaultProps)
- for (propName in ((config = type.defaultProps), config))
- void 0 === props[propName] && (props[propName] = config[propName]);
- return {
- $$typeof: REACT_ELEMENT_TYPE,
- type: type,
- key: key,
- ref: ref,
- props: props,
- _owner: ReactCurrentOwner.current
- };
-}
+ "function" === typeof reportError
+ ? reportError
+ : function (error) {
+ console.error(error);
+ };
exports.Children = {
map: mapChildren,
forEach: function (children, forEachFunc, forEachContext) {
@@ -566,7 +566,7 @@ exports.useSyncExternalStore = function (
exports.useTransition = function () {
return ReactCurrentDispatcher.current.useTransition();
};
-exports.version = "18.3.0-www-modern-aeab456d";
+exports.version = "18.3.0-www-modern-751434a6";
"undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
"function" ===
typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
diff --git a/compiled/facebook-www/ReactDOMTesting-dev.classic.js b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
index 2a32ee2407460..4673f77101671 100644
--- a/compiled/facebook-www/ReactDOMTesting-dev.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-dev.classic.js
@@ -36374,7 +36374,7 @@ if (__DEV__) {
return root;
}
- var ReactVersion = "18.3.0-www-classic-f4740bf5";
+ var ReactVersion = "18.3.0-www-classic-b2425be8";
function createPortal$1(
children,
diff --git a/compiled/facebook-www/ReactDOMTesting-prod.classic.js b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
index fdeb8e32bf40b..3d87c9573c22b 100644
--- a/compiled/facebook-www/ReactDOMTesting-prod.classic.js
+++ b/compiled/facebook-www/ReactDOMTesting-prod.classic.js
@@ -17490,7 +17490,7 @@ Internals.Events = [
var devToolsConfig$jscomp$inline_1828 = {
findFiberByHostInstance: getClosestInstanceFromNode,
bundleType: 0,
- version: "18.3.0-www-classic-b75b6a09",
+ version: "18.3.0-www-classic-65d179d4",
rendererPackageName: "react-dom"
};
var internals$jscomp$inline_2197 = {
@@ -17520,7 +17520,7 @@ var internals$jscomp$inline_2197 = {
scheduleRoot: null,
setRefreshHandler: null,
getCurrentFiber: null,
- reconcilerVersion: "18.3.0-www-classic-b75b6a09"
+ reconcilerVersion: "18.3.0-www-classic-65d179d4"
};
if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) {
var hook$jscomp$inline_2198 = __REACT_DEVTOOLS_GLOBAL_HOOK__;
@@ -18021,4 +18021,4 @@ exports.useFormStatus = function () {
return ReactCurrentDispatcher$2.current.useHostTransitionStatus();
throw Error(formatProdErrorMessage(248));
};
-exports.version = "18.3.0-www-classic-b75b6a09";
+exports.version = "18.3.0-www-classic-65d179d4";
diff --git a/compiled/facebook-www/ReactServer-dev.modern.js b/compiled/facebook-www/ReactServer-dev.modern.js
index c8b69ddc222cd..5dc3fb472987c 100644
--- a/compiled/facebook-www/ReactServer-dev.modern.js
+++ b/compiled/facebook-www/ReactServer-dev.modern.js
@@ -1390,523 +1390,804 @@ if (__DEV__) {
}
}
- var REACT_CLIENT_REFERENCE$1 = Symbol.for("react.client.reference");
-
- 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$1;
+ var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
+ var RESERVED_PROPS = {
+ key: true,
+ ref: true,
+ __self: true,
+ __source: true
+ };
+ var specialPropKeyWarningShown;
+ var specialPropRefWarningShown;
+ var didWarnAboutStringRefs;
{
- propTypesMisspellWarningShown$1 = false;
+ didWarnAboutStringRefs = {};
}
- function getDeclarationErrorAddendum$1() {
- if (ReactCurrentOwner$2.current) {
- var name = getComponentNameFromType(ReactCurrentOwner$2.current.type);
+ function hasValidRef(config) {
+ {
+ if (hasOwnProperty.call(config, "ref")) {
+ var getter = Object.getOwnPropertyDescriptor(config, "ref").get;
- if (name) {
- return "\n\nCheck the render method of `" + name + "`.";
+ if (getter && getter.isReactWarning) {
+ return false;
+ }
}
}
- return "";
+ return config.ref !== undefined;
}
- function getSourceInfoErrorAddendum$1(source) {
- if (source !== undefined) {
- var fileName = source.fileName.replace(/^.*[\\\/]/, "");
- var lineNumber = source.lineNumber;
- return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
- }
-
- return "";
- }
+ function hasValidKey(config) {
+ {
+ if (hasOwnProperty.call(config, "key")) {
+ var getter = Object.getOwnPropertyDescriptor(config, "key").get;
- function getSourceInfoErrorAddendumForProps(elementProps) {
- if (elementProps !== null && elementProps !== undefined) {
- return getSourceInfoErrorAddendum$1(elementProps.__source);
+ if (getter && getter.isReactWarning) {
+ return false;
+ }
+ }
}
- return "";
+ return config.key !== undefined;
}
- /**
- * 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$1 = {};
-
- function getCurrentComponentErrorInfo$1(parentType) {
- var info = getDeclarationErrorAddendum$1();
+ function warnIfStringRefCannotBeAutoConverted(config, self) {
+ {
+ if (
+ typeof config.ref === "string" &&
+ ReactCurrentOwner$1.current &&
+ self &&
+ ReactCurrentOwner$1.current.stateNode !== self
+ ) {
+ var componentName = getComponentNameFromType(
+ ReactCurrentOwner$1.current.type
+ );
- if (!info) {
- var parentName = getComponentNameFromType(parentType);
+ 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",
+ getComponentNameFromType(ReactCurrentOwner$1.current.type),
+ config.ref
+ );
- if (parentName) {
- info =
- "\n\nCheck the top-level render call using <" + parentName + ">.";
+ didWarnAboutStringRefs[componentName] = true;
+ }
}
}
-
- 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$1(element, parentType) {
- if (!element._store || element._store.validated || element.key != null) {
- return;
- }
-
- element._store.validated = true;
- var currentComponentErrorInfo =
- getCurrentComponentErrorInfo$1(parentType);
-
- if (ownerHasKeyUseWarning$1[currentComponentErrorInfo]) {
- return;
- }
- ownerHasKeyUseWarning$1[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.
+ function defineKeyPropWarningGetter(props, displayName) {
+ {
+ var warnAboutAccessingKey = function () {
+ if (!specialPropKeyWarningShown) {
+ specialPropKeyWarningShown = true;
- var childOwner = "";
+ 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
+ );
+ }
+ };
- if (
- element &&
- element._owner &&
- element._owner !== ReactCurrentOwner$2.current
- ) {
- // Give the component that originally created this child.
- childOwner =
- " It was passed a child from " +
- getComponentNameFromType(element._owner.type) +
- ".";
+ warnAboutAccessingKey.isReactWarning = true;
+ Object.defineProperty(props, "key", {
+ get: warnAboutAccessingKey,
+ configurable: true
+ });
}
+ }
+ function defineRefPropWarningGetter(props, displayName) {
{
- setCurrentlyValidatingElement$1(element);
+ var warnAboutAccessingRef = function () {
+ if (!specialPropRefWarningShown) {
+ specialPropRefWarningShown = true;
- 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
- );
+ 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
+ );
+ }
+ };
- setCurrentlyValidatingElement$1(null);
+ warnAboutAccessingRef.isReactWarning = true;
+ Object.defineProperty(props, "ref", {
+ get: warnAboutAccessingRef,
+ configurable: true
+ });
}
}
/**
- * 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.
+ * 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
- * @param {ReactNode} node Statically passed child of any type.
- * @param {*} parentType node's parent's type.
*/
- function validateChildKeys$1(node, parentType) {
- if (typeof node !== "object" || !node) {
- return;
- }
-
- if (node.$$typeof === REACT_CLIENT_REFERENCE$1);
- else if (isArray(node)) {
- for (var i = 0; i < node.length; i++) {
- var child = node[i];
+ function ReactElement(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
+ };
- if (isValidElement$1(child)) {
- validateExplicitKey$1(child, parentType);
- }
- }
- } else if (isValidElement$1(node)) {
- // This element was passed in a valid location.
- if (node._store) {
- node._store.validated = true;
- }
- } else {
- var iteratorFn = getIteratorFn(node);
+ {
+ // 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.
- 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;
+ Object.defineProperty(element._store, "validated", {
+ configurable: false,
+ enumerable: false,
+ writable: true,
+ value: false
+ }); // self and source are DEV only properties.
- while (!(step = iterator.next()).done) {
- if (isValidElement$1(step.value)) {
- validateExplicitKey$1(step.value, parentType);
- }
- }
- }
+ 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;
}
/**
- * Given an element, validate that its props follow the propTypes definition,
- * provided by the type.
- *
- * @param {ReactElement} element
+ * https://github.com/reactjs/rfcs/pull/107
+ * @param {*} type
+ * @param {object} props
+ * @param {string} key
*/
- function validatePropTypes$1(element) {
+ function jsxDEV$1(type, config, maybeKey, source, self) {
{
- var type = element.type;
+ var propName; // Reserved names are extracted
- if (type === null || type === undefined || typeof type === "string") {
- return;
- }
+ var props = {};
+ var key = null;
+ var ref = null; // Currently, key can be spread in as a prop. This causes a potential
+ // issue if key is also explicitly declared (ie.
+ // or ). We want to deprecate key spread,
+ // but as an intermediary step, we will use jsxDEV for everything except
+ // , because we aren't currently able to tell if
+ // key is explicitly declared to be undefined or not.
- if (type.$$typeof === REACT_CLIENT_REFERENCE$1) {
- return;
+ if (maybeKey !== undefined) {
+ {
+ checkKeyStringCoercion(maybeKey);
+ }
+
+ key = "" + maybeKey;
}
- var propTypes;
+ if (hasValidKey(config)) {
+ {
+ checkKeyStringCoercion(config.key);
+ }
- 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;
+ key = "" + config.key;
}
- 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$1
- ) {
- propTypesMisspellWarningShown$1 = true; // Intentionally inside to avoid triggering lazy initializers:
+ if (hasValidRef(config)) {
+ ref = config.ref;
+ warnIfStringRefCannotBeAutoConverted(config, self);
+ } // Remaining properties are added to a new props object
- var _name = getComponentNameFromType(type);
+ for (propName in config) {
+ if (
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName)
+ ) {
+ props[propName] = config[propName];
+ }
+ } // Resolve default props
- error(
- "Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",
- _name || "Unknown"
- );
- }
+ if (type && type.defaultProps) {
+ var defaultProps = type.defaultProps;
- 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."
- );
+ for (propName in defaultProps) {
+ if (props[propName] === undefined) {
+ props[propName] = defaultProps[propName];
+ }
+ }
}
- }
- }
- /**
- * Given a fragment, validate that it can only be provided with fragment props
- * @param {ReactElement} fragment
- */
-
- function validateFragmentProps$1(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);
+ if (key || ref) {
+ var displayName =
+ typeof type === "function"
+ ? type.displayName || type.name || "Unknown"
+ : type;
- error(
- "Invalid prop `%s` supplied to `React.Fragment`. " +
- "React.Fragment can only have `key` and `children` props.",
- key
- );
+ if (key) {
+ defineKeyPropWarningGetter(props, displayName);
+ }
- setCurrentlyValidatingElement$1(null);
- break;
+ if (ref) {
+ defineRefPropWarningGetter(props, displayName);
}
}
- if (fragment.ref !== null) {
- setCurrentlyValidatingElement$1(fragment);
+ return ReactElement(
+ type,
+ key,
+ ref,
+ self,
+ source,
+ ReactCurrentOwner$1.current,
+ props
+ );
+ }
+ }
- error("Invalid attribute `ref` supplied to `React.Fragment`.");
+ var REACT_CLIENT_REFERENCE$1 = Symbol.for("react.client.reference");
- setCurrentlyValidatingElement$1(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);
}
}
}
- 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 = "";
+ var propTypesMisspellWarningShown$1;
- 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.";
- }
+ {
+ propTypesMisspellWarningShown$1 = false;
+ }
- var sourceInfo = getSourceInfoErrorAddendumForProps(props);
+ function getDeclarationErrorAddendum$1() {
+ if (ReactCurrentOwner$2.current) {
+ var name = getComponentNameFromType(ReactCurrentOwner$2.current.type);
- if (sourceInfo) {
- info += sourceInfo;
- } else {
- info += getDeclarationErrorAddendum$1();
+ if (name) {
+ return "\n\nCheck the render method of `" + name + "`.";
}
+ }
- 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;
- }
+ return "";
+ }
- {
- 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
- );
- }
+ function getSourceInfoErrorAddendum$1(source) {
+ if (source !== undefined) {
+ var fileName = source.fileName.replace(/^.*[\\\/]/, "");
+ var lineNumber = source.lineNumber;
+ return "\n\nCheck your code at " + fileName + ":" + lineNumber + ".";
}
- var element = createElement$1.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.
+ return "";
+ }
- 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$1(arguments[i], type);
- }
- }
-
- if (type === REACT_FRAGMENT_TYPE) {
- validateFragmentProps$1(element);
- } else {
- validatePropTypes$1(element);
- }
-
- return element;
- }
- function cloneElementWithValidation(element, props, children) {
- var newElement = cloneElement$1.apply(this, arguments);
-
- for (var i = 2; i < arguments.length; i++) {
- validateChildKeys$1(arguments[i], newElement.type);
+ function getSourceInfoErrorAddendumForProps(elementProps) {
+ if (elementProps !== null && elementProps !== undefined) {
+ return getSourceInfoErrorAddendum$1(elementProps.__source);
}
- validatePropTypes$1(newElement);
- return newElement;
+ return "";
}
-
- var createElement = createElementWithValidation;
- var cloneElement = cloneElementWithValidation;
-
- 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.
+ * 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.
*/
- 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 ownerHasKeyUseWarning$1 = {};
- var didWarnAboutMaps = false;
- var userProvidedKeyEscapeRegex = /\/+/g;
+ function getCurrentComponentErrorInfo$1(parentType) {
+ var info = getDeclarationErrorAddendum$1();
- function escapeUserProvidedKey(text) {
- return text.replace(userProvidedKeyEscapeRegex, "$&/");
+ if (!info) {
+ var parentName = getComponentNameFromType(parentType);
+
+ if (parentName) {
+ info =
+ "\n\nCheck the top-level render call using <" + parentName + ">.";
+ }
+ }
+
+ return info;
}
/**
- * Generate a key string that identifies a element within a set.
+ * 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.
*
- * @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}
+ * @internal
+ * @param {ReactElement} element Element that requires a key.
+ * @param {*} parentType element's parent's type.
*/
- 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);
- }
+ function validateExplicitKey$1(element, parentType) {
+ if (!element._store || element._store.validated || element.key != null) {
+ return;
+ }
- return escape("" + element.key);
- } // Implicit key determined by the index in the set
+ element._store.validated = true;
+ var currentComponentErrorInfo =
+ getCurrentComponentErrorInfo$1(parentType);
- return index.toString(36);
- }
+ if (ownerHasKeyUseWarning$1[currentComponentErrorInfo]) {
+ return;
+ }
- function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) {
- var type = typeof children;
+ ownerHasKeyUseWarning$1[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.
- if (type === "undefined" || type === "boolean") {
- // All of the above are perceived as null.
- children = null;
+ var childOwner = "";
+
+ if (
+ element &&
+ element._owner &&
+ element._owner !== ReactCurrentOwner$2.current
+ ) {
+ // Give the component that originally created this child.
+ childOwner =
+ " It was passed a child from " +
+ getComponentNameFromType(element._owner.type) +
+ ".";
}
- var invokeCallback = false;
+ {
+ setCurrentlyValidatingElement$1(element);
- if (children === null) {
- invokeCallback = true;
- } else {
- switch (type) {
- case "string":
- case "number":
- invokeCallback = true;
- break;
+ 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
+ );
- case "object":
- switch (children.$$typeof) {
- case REACT_ELEMENT_TYPE:
- case REACT_PORTAL_TYPE:
- invokeCallback = true;
- }
- }
+ 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.
+ */
- 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;
+ function validateChildKeys$1(node, parentType) {
+ if (typeof node !== "object" || !node) {
+ return;
+ }
- if (isArray(mappedChild)) {
- var escapedChildKey = "";
+ if (node.$$typeof === REACT_CLIENT_REFERENCE$1);
+ else if (isArray(node)) {
+ for (var i = 0; i < node.length; i++) {
+ var child = node[i];
- if (childKey != null) {
- escapedChildKey = escapeUserProvidedKey(childKey) + "/";
+ if (isValidElement$1(child)) {
+ validateExplicitKey$1(child, parentType);
}
+ }
+ } else if (isValidElement$1(node)) {
+ // This element was passed in a valid location.
+ if (node._store) {
+ node._store.validated = true;
+ }
+ } else {
+ var iteratorFn = getIteratorFn(node);
- mapIntoArray(mappedChild, array, escapedChildKey, "", function (c) {
- return c;
- });
- } else if (mappedChild != null) {
- if (isValidElement$1(mappedChild)) {
- {
- // The `if` statement here prevents auto-disabling of the safe
- // coercion ESLint rule, so we must manually disable it below.
- // $FlowFixMe[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
- if (
- mappedChild.key &&
- (!_child || _child.key !== mappedChild.key)
- ) {
- checkKeyStringCoercion(mappedChild.key);
+ 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$1(step.value)) {
+ validateExplicitKey$1(step.value, parentType);
}
}
-
- 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[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
- (mappedChild.key && (!_child || _child.key !== mappedChild.key)
- ? escapeUserProvidedKey(
- // $FlowFixMe[unsafe-addition]
- "" + mappedChild.key // eslint-disable-line react-internal/safe-string-coercion
- ) + "/"
- : "") +
- childKey
- );
}
-
- array.push(mappedChild);
}
-
- return 1;
}
+ }
+ /**
+ * Given an element, validate that its props follow the propTypes definition,
+ * provided by the type.
+ *
+ * @param {ReactElement} element
+ */
- var child;
- var nextName;
- var subtreeCount = 0; // Count of children found in the current subtree.
+ function validatePropTypes$1(element) {
+ {
+ var type = element.type;
- var nextNamePrefix =
- nameSoFar === "" ? SEPARATOR : nameSoFar + SUBSEPARATOR;
+ if (type === null || type === undefined || typeof type === "string") {
+ return;
+ }
- if (isArray(children)) {
- for (var i = 0; i < children.length; i++) {
- child = children[i];
- nextName = nextNamePrefix + getElementKey(child, i);
+ if (type.$$typeof === REACT_CLIENT_REFERENCE$1) {
+ 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$1
+ ) {
+ propTypesMisspellWarningShown$1 = 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$1(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$1();
+ }
+
+ 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$1.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$1(arguments[i], type);
+ }
+ }
+
+ if (type === REACT_FRAGMENT_TYPE) {
+ validateFragmentProps$1(element);
+ } else {
+ validatePropTypes$1(element);
+ }
+
+ return element;
+ }
+ function cloneElementWithValidation(element, props, children) {
+ var newElement = cloneElement$1.apply(this, arguments);
+
+ for (var i = 2; i < arguments.length; i++) {
+ validateChildKeys$1(arguments[i], newElement.type);
+ }
+
+ validatePropTypes$1(newElement);
+ return newElement;
+ }
+
+ var createElement = createElementWithValidation;
+ var cloneElement = cloneElementWithValidation;
+
+ 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$1(mappedChild)) {
+ {
+ // The `if` statement here prevents auto-disabling of the safe
+ // coercion ESLint rule, so we must manually disable it below.
+ // $FlowFixMe[incompatible-type] 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[incompatible-type] Flow incorrectly thinks React.Portal doesn't have a key
+ (mappedChild.key && (!_child || _child.key !== mappedChild.key)
+ ? escapeUserProvidedKey(
+ // $FlowFixMe[unsafe-addition]
+ "" + mappedChild.key // eslint-disable-line react-internal/safe-string-coercion
+ ) + "/"
+ : "") +
+ 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,
@@ -2151,214 +2432,20 @@ if (__DEV__) {
);
}
}
-
- 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 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[prop-missing]
-
- Object.defineProperties(lazyType, {
- defaultProps: {
- configurable: true,
- get: function () {
- return defaultProps;
- },
- // $FlowFixMe[missing-local-annot]
- 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[prop-missing]
-
- Object.defineProperty(lazyType, "defaultProps", {
- enumerable: true
- });
- }
- },
- propTypes: {
- configurable: true,
- get: function () {
- return propTypes;
- },
- // $FlowFixMe[missing-local-annot]
- 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[prop-missing]
-
- Object.defineProperty(lazyType, "propTypes", {
- enumerable: true
- });
- }
- }
- });
- }
-
- return lazyType;
- }
-
- function memo(type, compare) {
- {
- if (!isValidElementType(type)) {
- error(
- "memo: The first argument must be a component. Instead " +
- "received: %s",
- type === null ? "null" : typeof type
- );
+
+ 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_MEMO_TYPE,
- type: type,
- compare: compare === undefined ? null : compare
+ $$typeof: REACT_FORWARD_REF_TYPE,
+ render: render
};
{
@@ -2375,11 +2462,11 @@ if (__DEV__) {
// 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) => {...});
+ // React.forwardRef((props, ref) => {...});
// This kind of inner function is not used elsewhere so the side effect is okay.
- if (!type.name && !type.displayName) {
- type.displayName = name;
+ if (!render.name && !render.displayName) {
+ render.displayName = name;
}
}
});
@@ -2388,503 +2475,416 @@ if (__DEV__) {
return elementType;
}
- var UNTERMINATED = 0;
- var TERMINATED = 1;
- var ERRORED = 2;
-
- function createCacheRoot() {
- return new WeakMap();
- }
-
- function createCacheNode() {
- return {
- s: UNTERMINATED,
- // status, represents whether the cached computation returned a value or threw an error
- v: undefined,
- // value, either the cached result or an error, depending on s
- o: null,
- // object cache, a WeakMap where non-primitive arguments are stored
- p: null // primitive cache, a regular Map where primitive arguments are stored.
- };
- }
-
- function cache(fn) {
- return function () {
- var dispatcher = ReactCurrentCache.current;
-
- if (!dispatcher) {
- // If there is no dispatcher, then we treat this as not being cached.
- // $FlowFixMe[incompatible-call]: We don't want to use rest arguments since we transpile the code.
- return fn.apply(null, arguments);
- }
-
- var fnMap = dispatcher.getCacheForType(createCacheRoot);
- var fnNode = fnMap.get(fn);
- var cacheNode;
-
- if (fnNode === undefined) {
- cacheNode = createCacheNode();
- fnMap.set(fn, cacheNode);
- } else {
- cacheNode = fnNode;
- }
-
- for (var i = 0, l = arguments.length; i < l; i++) {
- var arg = arguments[i];
-
- if (
- typeof arg === "function" ||
- (typeof arg === "object" && arg !== null)
- ) {
- // Objects go into a WeakMap
- var objectCache = cacheNode.o;
-
- if (objectCache === null) {
- cacheNode.o = objectCache = new WeakMap();
- }
-
- var objectNode = objectCache.get(arg);
+ var Uninitialized = -1;
+ var Pending = 0;
+ var Resolved = 1;
+ var Rejected = 2;
- if (objectNode === undefined) {
- cacheNode = createCacheNode();
- objectCache.set(arg, cacheNode);
- } else {
- cacheNode = objectNode;
- }
- } else {
- // Primitives go into a regular Map
- var primitiveCache = cacheNode.p;
+ 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.
- if (primitiveCache === null) {
- cacheNode.p = primitiveCache = new Map();
+ 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;
}
-
- var primitiveNode = primitiveCache.get(arg);
-
- if (primitiveNode === undefined) {
- cacheNode = createCacheNode();
- primitiveCache.set(arg, cacheNode);
- } else {
- cacheNode = primitiveNode;
+ },
+ function (error) {
+ if (
+ payload._status === Pending ||
+ payload._status === Uninitialized
+ ) {
+ // Transition to the next state.
+ var rejected = payload;
+ rejected._status = Rejected;
+ rejected._result = error;
}
}
- }
-
- if (cacheNode.s === TERMINATED) {
- return cacheNode.v;
- }
-
- if (cacheNode.s === ERRORED) {
- throw cacheNode.v;
- }
-
- try {
- // $FlowFixMe[incompatible-call]: We don't want to use rest arguments since we transpile the code.
- var result = fn.apply(null, arguments);
- var terminatedNode = cacheNode;
- terminatedNode.s = TERMINATED;
- terminatedNode.v = result;
- return result;
- } catch (error) {
- // We store the first error that's thrown and rethrow it.
- var erroredNode = cacheNode;
- erroredNode.s = ERRORED;
- erroredNode.v = error;
- throw error;
- }
- };
- }
-
- /**
- * 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
- };
-
- function startTransition(scope, options) {
- var prevTransition = ReactCurrentBatchConfig.transition; // Each renderer registers a callback to receive the return value of
- // the scope function. This is used to implement async actions.
-
- var callbacks = new Set();
- var transition = {
- _callbacks: callbacks
- };
- ReactCurrentBatchConfig.transition = transition;
- var currentTransition = ReactCurrentBatchConfig.transition;
-
- {
- ReactCurrentBatchConfig.transition._updatedFibers = new Set();
- }
-
- if (enableTransitionTracing) {
- if (options !== undefined && options.name !== undefined) {
- // $FlowFixMe[incompatible-use] found when upgrading Flow
- ReactCurrentBatchConfig.transition.name = options.name; // $FlowFixMe[incompatible-use] found when upgrading Flow
+ );
- ReactCurrentBatchConfig.transition.startTime = -1;
+ 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 (enableAsyncActions) {
- try {
- var returnValue = scope();
+ if (payload._status === Resolved) {
+ var moduleObject = payload._result;
- if (
- typeof returnValue === "object" &&
- returnValue !== null &&
- typeof returnValue.then === "function"
- ) {
- callbacks.forEach(function (callback) {
- return callback(currentTransition, returnValue);
- });
- returnValue.then(noop, onError);
+ {
+ 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
+ );
}
- } catch (error) {
- onError(error);
- } finally {
- warnAboutTransitionSubscriptions(prevTransition, currentTransition);
- ReactCurrentBatchConfig.transition = prevTransition;
- }
- } else {
- // When async actions are not enabled, startTransition does not
- // capture errors.
- try {
- scope();
- } finally {
- warnAboutTransitionSubscriptions(prevTransition, currentTransition);
- ReactCurrentBatchConfig.transition = prevTransition;
}
- }
- }
-
- function warnAboutTransitionSubscriptions(
- prevTransition,
- currentTransition
- ) {
- {
- if (prevTransition === null && currentTransition._updatedFibers) {
- var updatedFibersCount = currentTransition._updatedFibers.size;
-
- currentTransition._updatedFibers.clear();
- 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."
+ {
+ 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 noop() {} // Use reportError, if it exists. Otherwise console.error. This is the same as
- // the default for onRecoverableError.
-
- var onError =
- 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 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
+ };
- var ReactVersion = "18.3.0-www-modern-813d6bf7";
+ {
+ // In production, this would just set it on the object.
+ var defaultProps;
+ var propTypes; // $FlowFixMe[prop-missing]
- // Patch fetch
- var Children = {
- map: mapChildren,
- forEach: forEachChildren,
- count: countChildren,
- toArray: toArray,
- only: onlyChild
- };
+ Object.defineProperties(lazyType, {
+ defaultProps: {
+ configurable: true,
+ get: function () {
+ return defaultProps;
+ },
+ // $FlowFixMe[missing-local-annot]
+ 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."
+ );
- var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
- var RESERVED_PROPS = {
- key: true,
- ref: true,
- __self: true,
- __source: true
- };
- var specialPropKeyWarningShown;
- var specialPropRefWarningShown;
- var didWarnAboutStringRefs;
+ defaultProps = newDefaultProps; // Match production behavior more closely:
+ // $FlowFixMe[prop-missing]
- {
- didWarnAboutStringRefs = {};
- }
+ Object.defineProperty(lazyType, "defaultProps", {
+ enumerable: true
+ });
+ }
+ },
+ propTypes: {
+ configurable: true,
+ get: function () {
+ return propTypes;
+ },
+ // $FlowFixMe[missing-local-annot]
+ 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."
+ );
- function hasValidRef(config) {
- {
- if (hasOwnProperty.call(config, "ref")) {
- var getter = Object.getOwnPropertyDescriptor(config, "ref").get;
+ propTypes = newPropTypes; // Match production behavior more closely:
+ // $FlowFixMe[prop-missing]
- if (getter && getter.isReactWarning) {
- return false;
+ Object.defineProperty(lazyType, "propTypes", {
+ enumerable: true
+ });
+ }
}
- }
+ });
}
- return config.ref !== undefined;
+ return lazyType;
}
- function hasValidKey(config) {
+ function memo(type, compare) {
{
- if (hasOwnProperty.call(config, "key")) {
- var getter = Object.getOwnPropertyDescriptor(config, "key").get;
-
- if (getter && getter.isReactWarning) {
- return false;
- }
+ if (!isValidElementType(type)) {
+ error(
+ "memo: The first argument must be a component. Instead " +
+ "received: %s",
+ type === null ? "null" : typeof type
+ );
}
}
- return config.key !== undefined;
- }
+ var elementType = {
+ $$typeof: REACT_MEMO_TYPE,
+ type: type,
+ compare: compare === undefined ? null : compare
+ };
- function warnIfStringRefCannotBeAutoConverted(config, self) {
{
- if (
- typeof config.ref === "string" &&
- ReactCurrentOwner$1.current &&
- self &&
- ReactCurrentOwner$1.current.stateNode !== self
- ) {
- var componentName = getComponentNameFromType(
- ReactCurrentOwner$1.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",
- getComponentNameFromType(ReactCurrentOwner$1.current.type),
- config.ref
- );
+ 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.
- didWarnAboutStringRefs[componentName] = true;
+ if (!type.name && !type.displayName) {
+ type.displayName = name;
+ }
}
- }
+ });
}
+
+ return elementType;
}
- function defineKeyPropWarningGetter(props, displayName) {
- {
- var warnAboutAccessingKey = function () {
- if (!specialPropKeyWarningShown) {
- specialPropKeyWarningShown = true;
+ var UNTERMINATED = 0;
+ var TERMINATED = 1;
+ var ERRORED = 2;
- 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
- );
- }
- };
+ function createCacheRoot() {
+ return new WeakMap();
+ }
- warnAboutAccessingKey.isReactWarning = true;
- Object.defineProperty(props, "key", {
- get: warnAboutAccessingKey,
- configurable: true
- });
- }
+ function createCacheNode() {
+ return {
+ s: UNTERMINATED,
+ // status, represents whether the cached computation returned a value or threw an error
+ v: undefined,
+ // value, either the cached result or an error, depending on s
+ o: null,
+ // object cache, a WeakMap where non-primitive arguments are stored
+ p: null // primitive cache, a regular Map where primitive arguments are stored.
+ };
}
- function defineRefPropWarningGetter(props, displayName) {
- {
- var warnAboutAccessingRef = function () {
- if (!specialPropRefWarningShown) {
- specialPropRefWarningShown = true;
+ function cache(fn) {
+ return function () {
+ var dispatcher = ReactCurrentCache.current;
- 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
- );
- }
- };
+ if (!dispatcher) {
+ // If there is no dispatcher, then we treat this as not being cached.
+ // $FlowFixMe[incompatible-call]: We don't want to use rest arguments since we transpile the code.
+ return fn.apply(null, arguments);
+ }
- warnAboutAccessingRef.isReactWarning = true;
- Object.defineProperty(props, "ref", {
- get: warnAboutAccessingRef,
- configurable: 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 fnMap = dispatcher.getCacheForType(createCacheRoot);
+ var fnNode = fnMap.get(fn);
+ var cacheNode;
+
+ if (fnNode === undefined) {
+ cacheNode = createCacheNode();
+ fnMap.set(fn, cacheNode);
+ } else {
+ cacheNode = fnNode;
+ }
- function ReactElement(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
- };
+ for (var i = 0, l = arguments.length; i < l; i++) {
+ var arg = arguments[i];
- {
- // 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.
+ if (
+ typeof arg === "function" ||
+ (typeof arg === "object" && arg !== null)
+ ) {
+ // Objects go into a WeakMap
+ var objectCache = cacheNode.o;
- Object.defineProperty(element._store, "validated", {
- configurable: false,
- enumerable: false,
- writable: true,
- value: false
- }); // self and source are DEV only properties.
+ if (objectCache === null) {
+ cacheNode.o = objectCache = new WeakMap();
+ }
- 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.
+ var objectNode = objectCache.get(arg);
- Object.defineProperty(element, "_source", {
- configurable: false,
- enumerable: false,
- writable: false,
- value: source
- });
+ if (objectNode === undefined) {
+ cacheNode = createCacheNode();
+ objectCache.set(arg, cacheNode);
+ } else {
+ cacheNode = objectNode;
+ }
+ } else {
+ // Primitives go into a regular Map
+ var primitiveCache = cacheNode.p;
- if (Object.freeze) {
- Object.freeze(element.props);
- Object.freeze(element);
+ if (primitiveCache === null) {
+ cacheNode.p = primitiveCache = new Map();
+ }
+
+ var primitiveNode = primitiveCache.get(arg);
+
+ if (primitiveNode === undefined) {
+ cacheNode = createCacheNode();
+ primitiveCache.set(arg, cacheNode);
+ } else {
+ cacheNode = primitiveNode;
+ }
+ }
}
- }
- return element;
+ if (cacheNode.s === TERMINATED) {
+ return cacheNode.v;
+ }
+
+ if (cacheNode.s === ERRORED) {
+ throw cacheNode.v;
+ }
+
+ try {
+ // $FlowFixMe[incompatible-call]: We don't want to use rest arguments since we transpile the code.
+ var result = fn.apply(null, arguments);
+ var terminatedNode = cacheNode;
+ terminatedNode.s = TERMINATED;
+ terminatedNode.v = result;
+ return result;
+ } catch (error) {
+ // We store the first error that's thrown and rethrow it.
+ var erroredNode = cacheNode;
+ erroredNode.s = ERRORED;
+ erroredNode.v = error;
+ throw error;
+ }
+ };
}
+
/**
- * https://github.com/reactjs/rfcs/pull/107
- * @param {*} type
- * @param {object} props
- * @param {string} key
+ * 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
+ };
- function jsxDEV$1(type, config, maybeKey, source, self) {
- {
- var propName; // Reserved names are extracted
-
- var props = {};
- var key = null;
- var ref = null; // Currently, key can be spread in as a prop. This causes a potential
- // issue if key is also explicitly declared (ie.
- // or ). We want to deprecate key spread,
- // but as an intermediary step, we will use jsxDEV for everything except
- // , because we aren't currently able to tell if
- // key is explicitly declared to be undefined or not.
+ function startTransition(scope, options) {
+ var prevTransition = ReactCurrentBatchConfig.transition; // Each renderer registers a callback to receive the return value of
+ // the scope function. This is used to implement async actions.
- if (maybeKey !== undefined) {
- {
- checkKeyStringCoercion(maybeKey);
- }
+ var callbacks = new Set();
+ var transition = {
+ _callbacks: callbacks
+ };
+ ReactCurrentBatchConfig.transition = transition;
+ var currentTransition = ReactCurrentBatchConfig.transition;
- key = "" + maybeKey;
- }
+ {
+ ReactCurrentBatchConfig.transition._updatedFibers = new Set();
+ }
- if (hasValidKey(config)) {
- {
- checkKeyStringCoercion(config.key);
- }
+ if (enableTransitionTracing) {
+ if (options !== undefined && options.name !== undefined) {
+ // $FlowFixMe[incompatible-use] found when upgrading Flow
+ ReactCurrentBatchConfig.transition.name = options.name; // $FlowFixMe[incompatible-use] found when upgrading Flow
- key = "" + config.key;
+ ReactCurrentBatchConfig.transition.startTime = -1;
}
+ }
- if (hasValidRef(config)) {
- ref = config.ref;
- warnIfStringRefCannotBeAutoConverted(config, self);
- } // Remaining properties are added to a new props object
+ if (enableAsyncActions) {
+ try {
+ var returnValue = scope();
- for (propName in config) {
if (
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName)
+ typeof returnValue === "object" &&
+ returnValue !== null &&
+ typeof returnValue.then === "function"
) {
- props[propName] = config[propName];
- }
- } // Resolve default props
-
- if (type && type.defaultProps) {
- var defaultProps = type.defaultProps;
-
- for (propName in defaultProps) {
- if (props[propName] === undefined) {
- props[propName] = defaultProps[propName];
- }
+ callbacks.forEach(function (callback) {
+ return callback(currentTransition, returnValue);
+ });
+ returnValue.then(noop, onError);
}
+ } catch (error) {
+ onError(error);
+ } finally {
+ warnAboutTransitionSubscriptions(prevTransition, currentTransition);
+ ReactCurrentBatchConfig.transition = prevTransition;
+ }
+ } else {
+ // When async actions are not enabled, startTransition does not
+ // capture errors.
+ try {
+ scope();
+ } finally {
+ warnAboutTransitionSubscriptions(prevTransition, currentTransition);
+ ReactCurrentBatchConfig.transition = prevTransition;
}
+ }
+ }
- if (key || ref) {
- var displayName =
- typeof type === "function"
- ? type.displayName || type.name || "Unknown"
- : type;
+ function warnAboutTransitionSubscriptions(
+ prevTransition,
+ currentTransition
+ ) {
+ {
+ if (prevTransition === null && currentTransition._updatedFibers) {
+ var updatedFibersCount = currentTransition._updatedFibers.size;
- if (key) {
- defineKeyPropWarningGetter(props, displayName);
- }
+ currentTransition._updatedFibers.clear();
- if (ref) {
- defineRefPropWarningGetter(props, displayName);
+ 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."
+ );
}
}
-
- return ReactElement(
- type,
- key,
- ref,
- self,
- source,
- ReactCurrentOwner$1.current,
- props
- );
}
}
+ function noop() {} // Use reportError, if it exists. Otherwise console.error. This is the same as
+ // the default for onRecoverableError.
+
+ var onError =
+ 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);
+ };
+
+ var ReactVersion = "18.3.0-www-modern-303a3284";
+
+ // Patch fetch
+ var Children = {
+ map: mapChildren,
+ forEach: forEachChildren,
+ count: countChildren,
+ toArray: toArray,
+ only: onlyChild
+ };
+
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
var REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference");
diff --git a/compiled/facebook-www/ReactServer-prod.modern.js b/compiled/facebook-www/ReactServer-prod.modern.js
index f8859a4ff3680..a08e6e3bc033f 100644
--- a/compiled/facebook-www/ReactServer-prod.modern.js
+++ b/compiled/facebook-www/ReactServer-prod.modern.js
@@ -75,6 +75,32 @@ function isValidElement(object) {
object.$$typeof === REACT_ELEMENT_TYPE
);
}
+var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
+ RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
+function jsx$1(type, config, maybeKey) {
+ var propName,
+ props = {},
+ key = null,
+ ref = null;
+ void 0 !== maybeKey && (key = "" + maybeKey);
+ void 0 !== config.key && (key = "" + config.key);
+ void 0 !== config.ref && (ref = config.ref);
+ for (propName in config)
+ hasOwnProperty.call(config, propName) &&
+ !RESERVED_PROPS.hasOwnProperty(propName) &&
+ (props[propName] = config[propName]);
+ if (type && type.defaultProps)
+ for (propName in ((config = type.defaultProps), config))
+ void 0 === props[propName] && (props[propName] = config[propName]);
+ return {
+ $$typeof: REACT_ELEMENT_TYPE,
+ type: type,
+ key: key,
+ ref: ref,
+ props: props,
+ _owner: ReactCurrentOwner.current
+ };
+}
function escape(key) {
var escaperLookup = { "=": "=0", ":": "=2" };
return (
@@ -221,37 +247,11 @@ function createCacheNode() {
var ReactCurrentBatchConfig = { transition: null };
function noop() {}
var onError =
- "function" === typeof reportError
- ? reportError
- : function (error) {
- console.error(error);
- },
- ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner,
- RESERVED_PROPS = { key: !0, ref: !0, __self: !0, __source: !0 };
-function jsx$1(type, config, maybeKey) {
- var propName,
- props = {},
- key = null,
- ref = null;
- void 0 !== maybeKey && (key = "" + maybeKey);
- void 0 !== config.key && (key = "" + config.key);
- void 0 !== config.ref && (ref = config.ref);
- for (propName in config)
- hasOwnProperty.call(config, propName) &&
- !RESERVED_PROPS.hasOwnProperty(propName) &&
- (props[propName] = config[propName]);
- if (type && type.defaultProps)
- for (propName in ((config = type.defaultProps), config))
- void 0 === props[propName] && (props[propName] = config[propName]);
- return {
- $$typeof: REACT_ELEMENT_TYPE,
- type: type,
- key: key,
- ref: ref,
- props: props,
- _owner: ReactCurrentOwner.current
- };
-}
+ "function" === typeof reportError
+ ? reportError
+ : function (error) {
+ console.error(error);
+ };
exports.Children = {
map: mapChildren,
forEach: function (children, forEachFunc, forEachContext) {
@@ -468,4 +468,4 @@ exports.useId = function () {
exports.useMemo = function (create, deps) {
return ReactCurrentDispatcher.current.useMemo(create, deps);
};
-exports.version = "18.3.0-www-modern-4fd18aea";
+exports.version = "18.3.0-www-modern-6a0476d6";