vendor: 78 bytes, lines 1-3
1/******/ (() => { // webpackBootstrap 2/******/ var __webpack_modules__ = ({ 3
vendor: 169,461 bytes, lines 4-4354
4/***/ "./node_modules/@remix-run/router/dist/router.js": 5/*!*******************************************************!*\ 6 !*** ./node_modules/@remix-run/router/dist/router.js ***! 7 \*******************************************************/ 8/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 9 10"use strict"; 11__webpack_require__.r(__webpack_exports__); 12/* harmony export */ __webpack_require__.d(__webpack_exports__, { 13/* harmony export */ AbortedDeferredError: () => (/* binding */ AbortedDeferredError), 14/* harmony export */ Action: () => (/* binding */ Action), 15/* harmony export */ IDLE_BLOCKER: () => (/* binding */ IDLE_BLOCKER), 16/* harmony export */ IDLE_FETCHER: () => (/* binding */ IDLE_FETCHER), 17/* harmony export */ IDLE_NAVIGATION: () => (/* binding */ IDLE_NAVIGATION), 18/* harmony export */ UNSAFE_DEFERRED_SYMBOL: () => (/* binding */ UNSAFE_DEFERRED_SYMBOL), 19/* harmony export */ UNSAFE_DeferredData: () => (/* binding */ DeferredData), 20/* harmony export */ UNSAFE_ErrorResponseImpl: () => (/* binding */ ErrorResponseImpl), 21/* harmony export */ UNSAFE_convertRouteMatchToUiMatch: () => (/* binding */ convertRouteMatchToUiMatch), 22/* harmony export */ UNSAFE_convertRoutesToDataRoutes: () => (/* binding */ convertRoutesToDataRoutes), 23/* harmony export */ UNSAFE_getResolveToMatches: () => (/* binding */ getResolveToMatches), 24/* harmony export */ UNSAFE_invariant: () => (/* binding */ invariant), 25/* harmony export */ UNSAFE_warning: () => (/* binding */ warning), 26/* harmony export */ createBrowserHistory: () => (/* binding */ createBrowserHistory), 27/* harmony export */ createHashHistory: () => (/* binding */ createHashHistory), 28/* harmony export */ createMemoryHistory: () => (/* binding */ createMemoryHistory), 29/* harmony export */ createPath: () => (/* binding */ createPath), 30/* harmony export */ createRouter: () => (/* binding */ createRouter), 31/* harmony export */ createStaticHandler: () => (/* binding */ createStaticHandler), 32/* harmony export */ defer: () => (/* binding */ defer), 33/* harmony export */ generatePath: () => (/* binding */ generatePath), 34/* harmony export */ getStaticContextFromError: () => (/* binding */ getStaticContextFromError), 35/* harmony export */ getToPathname: () => (/* binding */ getToPathname), 36/* harmony export */ isDeferredData: () => (/* binding */ isDeferredData), 37/* harmony export */ isRouteErrorResponse: () => (/* binding */ isRouteErrorResponse), 38/* harmony export */ joinPaths: () => (/* binding */ joinPaths), 39/* harmony export */ json: () => (/* binding */ json), 40/* harmony export */ matchPath: () => (/* binding */ matchPath), 41/* harmony export */ matchRoutes: () => (/* binding */ matchRoutes), 42/* harmony export */ normalizePathname: () => (/* binding */ normalizePathname), 43/* harmony export */ parsePath: () => (/* binding */ parsePath), 44/* harmony export */ redirect: () => (/* binding */ redirect), 45/* harmony export */ redirectDocument: () => (/* binding */ redirectDocument), 46/* harmony export */ resolvePath: () => (/* binding */ resolvePath), 47/* harmony export */ resolveTo: () => (/* binding */ resolveTo), 48/* harmony export */ stripBasename: () => (/* binding */ stripBasename) 49/* harmony export */ }); 50/** 51 * @remix-run/router v1.15.1 52 * 53 * Copyright (c) Remix Software Inc. 54 * 55 * This source code is licensed under the MIT license found in the 56 * LICENSE.md file in the root directory of this source tree. 57 * 58 * @license MIT 59 */ 60function _extends() { 61 _extends = Object.assign ? Object.assign.bind() : function (target) { 62 for (var i = 1; i < arguments.length; i++) { 63 var source = arguments[i]; 64 for (var key in source) { 65 if (Object.prototype.hasOwnProperty.call(source, key)) { 66 target[key] = source[key]; 67 } 68 } 69 } 70 return target; 71 }; 72 return _extends.apply(this, arguments); 73} 74 75//////////////////////////////////////////////////////////////////////////////// 76//#region Types and Constants 77//////////////////////////////////////////////////////////////////////////////// 78/** 79 * Actions represent the type of change to a location value. 80 */ 81var Action; 82(function (Action) { 83 /** 84 * A POP indicates a change to an arbitrary index in the history stack, such 85 * as a back or forward navigation. It does not describe the direction of the 86 * navigation, only that the current index changed. 87 * 88 * Note: This is the default action for newly created history objects. 89 */ 90 Action["Pop"] = "POP"; 91 /** 92 * A PUSH indicates a new entry being added to the history stack, such as when 93 * a link is clicked and a new page loads. When this happens, all subsequent 94 * entries in the stack are lost. 95 */ 96 Action["Push"] = "PUSH"; 97 /** 98 * A REPLACE indicates the entry at the current index in the history stack 99 * being replaced by a new one. 100 */ 101 Action["Replace"] = "REPLACE"; 102})(Action || (Action = {})); 103const PopStateEventType = "popstate"; 104/** 105 * Memory history stores the current location in memory. It is designed for use 106 * in stateful non-browser environments like tests and React Native. 107 */ 108function createMemoryHistory(options) { 109 if (options === void 0) { 110 options = {}; 111 } 112 let { 113 initialEntries = ["/"], 114 initialIndex, 115 v5Compat = false 116 } = options; 117 let entries; // Declare so we can access from createMemoryLocation 118 entries = initialEntries.map((entry, index) => createMemoryLocation(entry, typeof entry === "string" ? null : entry.state, index === 0 ? "default" : undefined)); 119 let index = clampIndex(initialIndex == null ? entries.length - 1 : initialIndex); 120 let action = Action.Pop; 121 let listener = null; 122 function clampIndex(n) { 123 return Math.min(Math.max(n, 0), entries.length - 1); 124 } 125 function getCurrentLocation() { 126 return entries[index]; 127 } 128 function createMemoryLocation(to, state, key) { 129 if (state === void 0) { 130 state = null; 131 } 132 let location = createLocation(entries ? getCurrentLocation().pathname : "/", to, state, key); 133 warning(location.pathname.charAt(0) === "/", "relative pathnames are not supported in memory history: " + JSON.stringify(to)); 134 return location; 135 } 136 function createHref(to) { 137 return typeof to === "string" ? to : createPath(to); 138 } 139 let history = { 140 get index() { 141 return index; 142 }, 143 get action() { 144 return action; 145 }, 146 get location() { 147 return getCurrentLocation(); 148 }, 149 createHref, 150 createURL(to) { 151 return new URL(createHref(to), "http://localhost"); 152 }, 153 encodeLocation(to) { 154 let path = typeof to === "string" ? parsePath(to) : to; 155 return { 156 pathname: path.pathname || "", 157 search: path.search || "", 158 hash: path.hash || "" 159 }; 160 }, 161 push(to, state) { 162 action = Action.Push; 163 let nextLocation = createMemoryLocation(to, state); 164 index += 1; 165 entries.splice(index, entries.length, nextLocation); 166 if (v5Compat && listener) { 167 listener({ 168 action, 169 location: nextLocation, 170 delta: 1 171 }); 172 } 173 }, 174 replace(to, state) { 175 action = Action.Replace; 176 let nextLocation = createMemoryLocation(to, state); 177 entries[index] = nextLocation; 178 if (v5Compat && listener) { 179 listener({ 180 action, 181 location: nextLocation, 182 delta: 0 183 }); 184 } 185 }, 186 go(delta) { 187 action = Action.Pop; 188 let nextIndex = clampIndex(index + delta); 189 let nextLocation = entries[nextIndex]; 190 index = nextIndex; 191 if (listener) { 192 listener({ 193 action, 194 location: nextLocation, 195 delta 196 }); 197 } 198 }, 199 listen(fn) { 200 listener = fn; 201 return () => { 202 listener = null; 203 }; 204 } 205 }; 206 return history; 207} 208/** 209 * Browser history stores the location in regular URLs. This is the standard for 210 * most web apps, but it requires some configuration on the server to ensure you 211 * serve the same app at multiple URLs. 212 * 213 * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#createbrowserhistory 214 */ 215function createBrowserHistory(options) { 216 if (options === void 0) { 217 options = {}; 218 } 219 function createBrowserLocation(window, globalHistory) { 220 let { 221 pathname, 222 search, 223 hash 224 } = window.location; 225 return createLocation("", { 226 pathname, 227 search, 228 hash 229 }, 230 // state defaults to `null` because `window.history.state` does 231 globalHistory.state && globalHistory.state.usr || null, globalHistory.state && globalHistory.state.key || "default"); 232 } 233 function createBrowserHref(window, to) { 234 return typeof to === "string" ? to : createPath(to); 235 } 236 return getUrlBasedHistory(createBrowserLocation, createBrowserHref, null, options); 237} 238/** 239 * Hash history stores the location in window.location.hash. This makes it ideal 240 * for situations where you don't want to send the location to the server for 241 * some reason, either because you do cannot configure it or the URL space is 242 * reserved for something else. 243 * 244 * @see https://github.com/remix-run/history/tree/main/docs/api-reference.md#createhashhistory 245 */ 246function createHashHistory(options) { 247 if (options === void 0) { 248 options = {}; 249 } 250 function createHashLocation(window, globalHistory) { 251 let { 252 pathname = "/", 253 search = "", 254 hash = "" 255 } = parsePath(window.location.hash.substr(1)); 256 // Hash URL should always have a leading / just like window.location.pathname 257 // does, so if an app ends up at a route like /#something then we add a 258 // leading slash so all of our path-matching behaves the same as if it would 259 // in a browser router. This is particularly important when there exists a 260 // root splat route (<Route path="*">) since that matches internally against 261 // "/*" and we'd expect /#something to 404 in a hash router app. 262 if (!pathname.startsWith("/") && !pathname.startsWith(".")) { 263 pathname = "/" + pathname; 264 } 265 return createLocation("", { 266 pathname, 267 search, 268 hash 269 }, 270 // state defaults to `null` because `window.history.state` does 271 globalHistory.state && globalHistory.state.usr || null, globalHistory.state && globalHistory.state.key || "default"); 272 } 273 function createHashHref(window, to) { 274 let base = window.document.querySelector("base"); 275 let href = ""; 276 if (base && base.getAttribute("href")) { 277 let url = window.location.href; 278 let hashIndex = url.indexOf("#"); 279 href = hashIndex === -1 ? url : url.slice(0, hashIndex); 280 } 281 return href + "#" + (typeof to === "string" ? to : createPath(to)); 282 } 283 function validateHashLocation(location, to) { 284 warning(location.pathname.charAt(0) === "/", "relative pathnames are not supported in hash history.push(" + JSON.stringify(to) + ")"); 285 } 286 return getUrlBasedHistory(createHashLocation, createHashHref, validateHashLocation, options); 287} 288function invariant(value, message) { 289 if (value === false || value === null || typeof value === "undefined") { 290 throw new Error(message); 291 } 292} 293function warning(cond, message) { 294 if (!cond) { 295 // eslint-disable-next-line no-console 296 if (typeof console !== "undefined") console.warn(message); 297 try { 298 // Welcome to debugging history! 299 // 300 // This error is thrown as a convenience, so you can more easily 301 // find the source for a warning that appears in the console by 302 // enabling "pause on exceptions" in your JavaScript debugger. 303 throw new Error(message); 304 // eslint-disable-next-line no-empty 305 } catch (e) {} 306 } 307} 308function createKey() { 309 return Math.random().toString(36).substr(2, 8); 310} 311/** 312 * For browser-based histories, we combine the state and key into an object 313 */ 314function getHistoryState(location, index) { 315 return { 316 usr: location.state, 317 key: location.key, 318 idx: index 319 }; 320} 321/** 322 * Creates a Location object with a unique key from the given Path 323 */ 324function createLocation(current, to, state, key) { 325 if (state === void 0) { 326 state = null; 327 } 328 let location = _extends({ 329 pathname: typeof current === "string" ? current : current.pathname, 330 search: "", 331 hash: "" 332 }, typeof to === "string" ? parsePath(to) : to, { 333 state, 334 // TODO: This could be cleaned up. push/replace should probably just take 335 // full Locations now and avoid the need to run through this flow at all 336 // But that's a pretty big refactor to the current test suite so going to 337 // keep as is for the time being and just let any incoming keys take precedence 338 key: to && to.key || key || createKey() 339 }); 340 return location; 341} 342/** 343 * Creates a string URL path from the given pathname, search, and hash components. 344 */ 345function createPath(_ref) { 346 let { 347 pathname = "/", 348 search = "", 349 hash = "" 350 } = _ref; 351 if (search && search !== "?") pathname += search.charAt(0) === "?" ? search : "?" + search; 352 if (hash && hash !== "#") pathname += hash.charAt(0) === "#" ? hash : "#" + hash; 353 return pathname; 354} 355/** 356 * Parses a string URL path into its separate pathname, search, and hash components. 357 */ 358function parsePath(path) { 359 let parsedPath = {}; 360 if (path) { 361 let hashIndex = path.indexOf("#"); 362 if (hashIndex >= 0) { 363 parsedPath.hash = path.substr(hashIndex); 364 path = path.substr(0, hashIndex); 365 } 366 let searchIndex = path.indexOf("?"); 367 if (searchIndex >= 0) { 368 parsedPath.search = path.substr(searchIndex); 369 path = path.substr(0, searchIndex); 370 } 371 if (path) { 372 parsedPath.pathname = path; 373 } 374 } 375 return parsedPath; 376} 377function getUrlBasedHistory(getLocation, createHref, validateLocation, options) { 378 if (options === void 0) { 379 options = {}; 380 } 381 let { 382 window = document.defaultView, 383 v5Compat = false 384 } = options; 385 let globalHistory = window.history; 386 let action = Action.Pop; 387 let listener = null; 388 let index = getIndex(); 389 // Index should only be null when we initialize. If not, it's because the 390 // user called history.pushState or history.replaceState directly, in which 391 // case we should log a warning as it will result in bugs. 392 if (index == null) { 393 index = 0; 394 globalHistory.replaceState(_extends({}, globalHistory.state, { 395 idx: index 396 }), ""); 397 } 398 function getIndex() { 399 let state = globalHistory.state || { 400 idx: null 401 }; 402 return state.idx; 403 } 404 function handlePop() { 405 action = Action.Pop; 406 let nextIndex = getIndex(); 407 let delta = nextIndex == null ? null : nextIndex - index; 408 index = nextIndex; 409 if (listener) { 410 listener({ 411 action, 412 location: history.location, 413 delta 414 }); 415 } 416 } 417 function push(to, state) { 418 action = Action.Push; 419 let location = createLocation(history.location, to, state); 420 if (validateLocation) validateLocation(location, to); 421 index = getIndex() + 1; 422 let historyState = getHistoryState(location, index); 423 let url = history.createHref(location); 424 // try...catch because iOS limits us to 100 pushState calls :/ 425 try { 426 globalHistory.pushState(historyState, "", url); 427 } catch (error) { 428 // If the exception is because `state` can't be serialized, let that throw 429 // outwards just like a replace call would so the dev knows the cause 430 // https://html.spec.whatwg.org/multipage/nav-history-apis.html#shared-history-push/replace-state-steps 431 // https://html.spec.whatwg.org/multipage/structured-data.html#structuredserializeinternal 432 if (error instanceof DOMException && error.name === "DataCloneError") { 433 throw error; 434 } 435 // They are going to lose state here, but there is no real 436 // way to warn them about it since the page will refresh... 437 window.location.assign(url); 438 } 439 if (v5Compat && listener) { 440 listener({ 441 action, 442 location: history.location, 443 delta: 1 444 }); 445 } 446 } 447 function replace(to, state) { 448 action = Action.Replace; 449 let location = createLocation(history.location, to, state); 450 if (validateLocation) validateLocation(location, to); 451 index = getIndex(); 452 let historyState = getHistoryState(location, index); 453 let url = history.createHref(location); 454 globalHistory.replaceState(historyState, "", url); 455 if (v5Compat && listener) { 456 listener({ 457 action, 458 location: history.location, 459 delta: 0 460 }); 461 } 462 } 463 function createURL(to) { 464 // window.location.origin is "null" (the literal string value) in Firefox 465 // under certain conditions, notably when serving from a local HTML file 466 // See https://bugzilla.mozilla.org/show_bug.cgi?id=878297 467 let base = window.location.origin !== "null" ? window.location.origin : window.location.href; 468 let href = typeof to === "string" ? to : createPath(to); 469 // Treating this as a full URL will strip any trailing spaces so we need to 470 // pre-encode them since they might be part of a matching splat param from 471 // an ancestor route 472 href = href.replace(/ $/, "%20"); 473 invariant(base, "No window.location.(origin|href) available to create URL for href: " + href); 474 return new URL(href, base); 475 } 476 let history = { 477 get action() { 478 return action; 479 }, 480 get location() { 481 return getLocation(window, globalHistory); 482 }, 483 listen(fn) { 484 if (listener) { 485 throw new Error("A history only accepts one active listener"); 486 } 487 window.addEventListener(PopStateEventType, handlePop); 488 listener = fn; 489 return () => { 490 window.removeEventListener(PopStateEventType, handlePop); 491 listener = null; 492 }; 493 }, 494 createHref(to) { 495 return createHref(window, to); 496 }, 497 createURL, 498 encodeLocation(to) { 499 // Encode a Location the same way window.location would 500 let url = createURL(to); 501 return { 502 pathname: url.pathname, 503 search: url.search, 504 hash: url.hash 505 }; 506 }, 507 push, 508 replace, 509 go(n) { 510 return globalHistory.go(n); 511 } 512 }; 513 return history; 514} 515//#endregion 516 517var ResultType; 518(function (ResultType) { 519 ResultType["data"] = "data"; 520 ResultType["deferred"] = "deferred"; 521 ResultType["redirect"] = "redirect"; 522 ResultType["error"] = "error"; 523})(ResultType || (ResultType = {})); 524const immutableRouteKeys = new Set(["lazy", "caseSensitive", "path", "id", "index", "children"]); 525function isIndexRoute(route) { 526 return route.index === true; 527} 528// Walk the route tree generating unique IDs where necessary, so we are working 529// solely with AgnosticDataRouteObject's within the Router 530function convertRoutesToDataRoutes(routes, mapRouteProperties, parentPath, manifest) { 531 if (parentPath === void 0) { 532 parentPath = []; 533 } 534 if (manifest === void 0) { 535 manifest = {}; 536 } 537 return routes.map((route, index) => { 538 let treePath = [...parentPath, index]; 539 let id = typeof route.id === "string" ? route.id : treePath.join("-"); 540 invariant(route.index !== true || !route.children, "Cannot specify children on an index route"); 541 invariant(!manifest[id], "Found a route id collision on id \"" + id + "\". Route " + "id's must be globally unique within Data Router usages"); 542 if (isIndexRoute(route)) { 543 let indexRoute = _extends({}, route, mapRouteProperties(route), { 544 id 545 }); 546 manifest[id] = indexRoute; 547 return indexRoute; 548 } else { 549 let pathOrLayoutRoute = _extends({}, route, mapRouteProperties(route), { 550 id, 551 children: undefined 552 }); 553 manifest[id] = pathOrLayoutRoute; 554 if (route.children) { 555 pathOrLayoutRoute.children = convertRoutesToDataRoutes(route.children, mapRouteProperties, treePath, manifest); 556 } 557 return pathOrLayoutRoute; 558 } 559 }); 560} 561/** 562 * Matches the given routes to a location and returns the match data. 563 * 564 * @see https://reactrouter.com/utils/match-routes 565 */ 566function matchRoutes(routes, locationArg, basename) { 567 if (basename === void 0) { 568 basename = "/"; 569 } 570 let location = typeof locationArg === "string" ? parsePath(locationArg) : locationArg; 571 let pathname = stripBasename(location.pathname || "/", basename); 572 if (pathname == null) { 573 return null; 574 } 575 let branches = flattenRoutes(routes); 576 rankRouteBranches(branches); 577 let matches = null; 578 for (let i = 0; matches == null && i < branches.length; ++i) { 579 // Incoming pathnames are generally encoded from either window.location 580 // or from router.navigate, but we want to match against the unencoded 581 // paths in the route definitions. Memory router locations won't be 582 // encoded here but there also shouldn't be anything to decode so this 583 // should be a safe operation. This avoids needing matchRoutes to be 584 // history-aware. 585 let decoded = decodePath(pathname); 586 matches = matchRouteBranch(branches[i], decoded); 587 } 588 return matches; 589} 590function convertRouteMatchToUiMatch(match, loaderData) { 591 let { 592 route, 593 pathname, 594 params 595 } = match; 596 return { 597 id: route.id, 598 pathname, 599 params, 600 data: loaderData[route.id], 601 handle: route.handle 602 }; 603} 604function flattenRoutes(routes, branches, parentsMeta, parentPath) { 605 if (branches === void 0) { 606 branches = []; 607 } 608 if (parentsMeta === void 0) { 609 parentsMeta = []; 610 } 611 if (parentPath === void 0) { 612 parentPath = ""; 613 } 614 let flattenRoute = (route, index, relativePath) => { 615 let meta = { 616 relativePath: relativePath === undefined ? route.path || "" : relativePath, 617 caseSensitive: route.caseSensitive === true, 618 childrenIndex: index, 619 route 620 }; 621 if (meta.relativePath.startsWith("/")) { 622 invariant(meta.relativePath.startsWith(parentPath), "Absolute route path \"" + meta.relativePath + "\" nested under path " + ("\"" + parentPath + "\" is not valid. An absolute child route path ") + "must start with the combined path of all its parent routes."); 623 meta.relativePath = meta.relativePath.slice(parentPath.length); 624 } 625 let path = joinPaths([parentPath, meta.relativePath]); 626 let routesMeta = parentsMeta.concat(meta); 627 // Add the children before adding this route to the array, so we traverse the 628 // route tree depth-first and child routes appear before their parents in 629 // the "flattened" version. 630 if (route.children && route.children.length > 0) { 631 invariant( 632 // Our types know better, but runtime JS may not! 633 // @ts-expect-error 634 route.index !== true, "Index routes must not have child routes. Please remove " + ("all child routes from route path \"" + path + "\".")); 635 flattenRoutes(route.children, branches, routesMeta, path); 636 } 637 // Routes without a path shouldn't ever match by themselves unless they are 638 // index routes, so don't add them to the list of possible branches. 639 if (route.path == null && !route.index) { 640 return; 641 } 642 branches.push({ 643 path, 644 score: computeScore(path, route.index), 645 routesMeta 646 }); 647 }; 648 routes.forEach((route, index) => { 649 var _route$path; 650 // coarse-grain check for optional params 651 if (route.path === "" || !((_route$path = route.path) != null && _route$path.includes("?"))) { 652 flattenRoute(route, index); 653 } else { 654 for (let exploded of explodeOptionalSegments(route.path)) { 655 flattenRoute(route, index, exploded); 656 } 657 } 658 }); 659 return branches; 660} 661/** 662 * Computes all combinations of optional path segments for a given path, 663 * excluding combinations that are ambiguous and of lower priority. 664 * 665 * For example, `/one/:two?/three/:four?/:five?` explodes to: 666 * - `/one/three` 667 * - `/one/:two/three` 668 * - `/one/three/:four` 669 * - `/one/three/:five` 670 * - `/one/:two/three/:four` 671 * - `/one/:two/three/:five` 672 * - `/one/three/:four/:five` 673 * - `/one/:two/three/:four/:five` 674 */ 675function explodeOptionalSegments(path) { 676 let segments = path.split("/"); 677 if (segments.length === 0) return []; 678 let [first, ...rest] = segments; 679 // Optional path segments are denoted by a trailing `?` 680 let isOptional = first.endsWith("?"); 681 // Compute the corresponding required segment: `foo?` -> `foo` 682 let required = first.replace(/\?$/, ""); 683 if (rest.length === 0) { 684 // Intepret empty string as omitting an optional segment 685 // `["one", "", "three"]` corresponds to omitting `:two` from `/one/:two?/three` -> `/one/three` 686 return isOptional ? [required, ""] : [required]; 687 } 688 let restExploded = explodeOptionalSegments(rest.join("/")); 689 let result = []; 690 // All child paths with the prefix. Do this for all children before the 691 // optional version for all children, so we get consistent ordering where the 692 // parent optional aspect is preferred as required. Otherwise, we can get 693 // child sections interspersed where deeper optional segments are higher than 694 // parent optional segments, where for example, /:two would explode _earlier_ 695 // then /:one. By always including the parent as required _for all children_ 696 // first, we avoid this issue 697 result.push(...restExploded.map(subpath => subpath === "" ? required : [required, subpath].join("/"))); 698 // Then, if this is an optional value, add all child versions without 699 if (isOptional) { 700 result.push(...restExploded); 701 } 702 // for absolute paths, ensure `/` instead of empty segment 703 return result.map(exploded => path.startsWith("/") && exploded === "" ? "/" : exploded); 704} 705function rankRouteBranches(branches) { 706 branches.sort((a, b) => a.score !== b.score ? b.score - a.score // Higher score first 707 : compareIndexes(a.routesMeta.map(meta => meta.childrenIndex), b.routesMeta.map(meta => meta.childrenIndex))); 708} 709const paramRe = /^:[\w-]+$/; 710const dynamicSegmentValue = 3; 711const indexRouteValue = 2; 712const emptySegmentValue = 1; 713const staticSegmentValue = 10; 714const splatPenalty = -2; 715const isSplat = s => s === "*"; 716function computeScore(path, index) { 717 let segments = path.split("/"); 718 let initialScore = segments.length; 719 if (segments.some(isSplat)) { 720 initialScore += splatPenalty; 721 } 722 if (index) { 723 initialScore += indexRouteValue; 724 } 725 return segments.filter(s => !isSplat(s)).reduce((score, segment) => score + (paramRe.test(segment) ? dynamicSegmentValue : segment === "" ? emptySegmentValue : staticSegmentValue), initialScore); 726} 727function compareIndexes(a, b) { 728 let siblings = a.length === b.length && a.slice(0, -1).every((n, i) => n === b[i]); 729 return siblings ? 730 // If two routes are siblings, we should try to match the earlier sibling 731 // first. This allows people to have fine-grained control over the matching 732 // behavior by simply putting routes with identical paths in the order they 733 // want them tried. 734 a[a.length - 1] - b[b.length - 1] : 735 // Otherwise, it doesn't really make sense to rank non-siblings by index, 736 // so they sort equally. 737 0; 738} 739function matchRouteBranch(branch, pathname) { 740 let { 741 routesMeta 742 } = branch; 743 let matchedParams = {}; 744 let matchedPathname = "/"; 745 let matches = []; 746 for (let i = 0; i < routesMeta.length; ++i) { 747 let meta = routesMeta[i]; 748 let end = i === routesMeta.length - 1; 749 let remainingPathname = matchedPathname === "/" ? pathname : pathname.slice(matchedPathname.length) || "/"; 750 let match = matchPath({ 751 path: meta.relativePath, 752 caseSensitive: meta.caseSensitive, 753 end 754 }, remainingPathname); 755 if (!match) return null; 756 Object.assign(matchedParams, match.params); 757 let route = meta.route; 758 matches.push({ 759 // TODO: Can this as be avoided? 760 params: matchedParams, 761 pathname: joinPaths([matchedPathname, match.pathname]), 762 pathnameBase: normalizePathname(joinPaths([matchedPathname, match.pathnameBase])), 763 route 764 }); 765 if (match.pathnameBase !== "/") { 766 matchedPathname = joinPaths([matchedPathname, match.pathnameBase]); 767 } 768 } 769 return matches; 770} 771/** 772 * Returns a path with params interpolated. 773 * 774 * @see https://reactrouter.com/utils/generate-path 775 */ 776function generatePath(originalPath, params) { 777 if (params === void 0) { 778 params = {}; 779 } 780 let path = originalPath; 781 if (path.endsWith("*") && path !== "*" && !path.endsWith("/*")) { 782 warning(false, "Route path \"" + path + "\" will be treated as if it were " + ("\"" + path.replace(/\*$/, "/*") + "\" because the `*` character must ") + "always follow a `/` in the pattern. To get rid of this warning, " + ("please change the route path to \"" + path.replace(/\*$/, "/*") + "\".")); 783 path = path.replace(/\*$/, "/*"); 784 } 785 // ensure `/` is added at the beginning if the path is absolute 786 const prefix = path.startsWith("/") ? "/" : ""; 787 const stringify = p => p == null ? "" : typeof p === "string" ? p : String(p); 788 const segments = path.split(/\/+/).map((segment, index, array) => { 789 const isLastSegment = index === array.length - 1; 790 // only apply the splat if it's the last segment 791 if (isLastSegment && segment === "*") { 792 const star = "*"; 793 // Apply the splat 794 return stringify(params[star]); 795 } 796 const keyMatch = segment.match(/^:([\w-]+)(\??)$/); 797 if (keyMatch) { 798 const [, key, optional] = keyMatch; 799 let param = params[key]; 800 invariant(optional === "?" || param != null, "Missing \":" + key + "\" param"); 801 return stringify(param); 802 } 803 // Remove any optional markers from optional static segments 804 return segment.replace(/\?$/g, ""); 805 }) 806 // Remove empty segments 807 .filter(segment => !!segment); 808 return prefix + segments.join("/"); 809} 810/** 811 * Performs pattern matching on a URL pathname and returns information about 812 * the match. 813 * 814 * @see https://reactrouter.com/utils/match-path 815 */ 816function matchPath(pattern, pathname) { 817 if (typeof pattern === "string") { 818 pattern = { 819 path: pattern, 820 caseSensitive: false, 821 end: true 822 }; 823 } 824 let [matcher, compiledParams] = compilePath(pattern.path, pattern.caseSensitive, pattern.end); 825 let match = pathname.match(matcher); 826 if (!match) return null; 827 let matchedPathname = match[0]; 828 let pathnameBase = matchedPathname.replace(/(.)\/+$/, "$1"); 829 let captureGroups = match.slice(1); 830 let params = compiledParams.reduce((memo, _ref, index) => { 831 let { 832 paramName, 833 isOptional 834 } = _ref; 835 // We need to compute the pathnameBase here using the raw splat value 836 // instead of using params["*"] later because it will be decoded then 837 if (paramName === "*") { 838 let splatValue = captureGroups[index] || ""; 839 pathnameBase = matchedPathname.slice(0, matchedPathname.length - splatValue.length).replace(/(.)\/+$/, "$1"); 840 } 841 const value = captureGroups[index]; 842 if (isOptional && !value) { 843 memo[paramName] = undefined; 844 } else { 845 memo[paramName] = (value || "").replace(/%2F/g, "/"); 846 } 847 return memo; 848 }, {}); 849 return { 850 params, 851 pathname: matchedPathname, 852 pathnameBase, 853 pattern 854 }; 855} 856function compilePath(path, caseSensitive, end) { 857 if (caseSensitive === void 0) { 858 caseSensitive = false; 859 } 860 if (end === void 0) { 861 end = true; 862 } 863 warning(path === "*" || !path.endsWith("*") || path.endsWith("/*"), "Route path \"" + path + "\" will be treated as if it were " + ("\"" + path.replace(/\*$/, "/*") + "\" because the `*` character must ") + "always follow a `/` in the pattern. To get rid of this warning, " + ("please change the route path to \"" + path.replace(/\*$/, "/*") + "\".")); 864 let params = []; 865 let regexpSource = "^" + path.replace(/\/*\*?$/, "") // Ignore trailing / and /*, we'll handle it below 866 .replace(/^\/*/, "/") // Make sure it has a leading / 867 .replace(/[\\.*+^${}|()[\]]/g, "\\$&") // Escape special regex chars 868 .replace(/\/:([\w-]+)(\?)?/g, (_, paramName, isOptional) => { 869 params.push({ 870 paramName, 871 isOptional: isOptional != null 872 }); 873 return isOptional ? "/?([^\\/]+)?" : "/([^\\/]+)"; 874 }); 875 if (path.endsWith("*")) { 876 params.push({ 877 paramName: "*" 878 }); 879 regexpSource += path === "*" || path === "/*" ? "(.*)$" // Already matched the initial /, just match the rest 880 : "(?:\\/(.+)|\\/*)$"; // Don't include the / in params["*"] 881 } else if (end) { 882 // When matching to the end, ignore trailing slashes 883 regexpSource += "\\/*$"; 884 } else if (path !== "" && path !== "/") { 885 // If our path is non-empty and contains anything beyond an initial slash, 886 // then we have _some_ form of path in our regex, so we should expect to 887 // match only if we find the end of this path segment. Look for an optional 888 // non-captured trailing slash (to match a portion of the URL) or the end 889 // of the path (if we've matched to the end). We used to do this with a 890 // word boundary but that gives false positives on routes like 891 // /user-preferences since `-` counts as a word boundary. 892 regexpSource += "(?:(?=\\/|$))"; 893 } else ; 894 let matcher = new RegExp(regexpSource, caseSensitive ? undefined : "i"); 895 return [matcher, params]; 896} 897function decodePath(value) { 898 try { 899 return value.split("/").map(v => decodeURIComponent(v).replace(/\//g, "%2F")).join("/"); 900 } catch (error) { 901 warning(false, "The URL path \"" + value + "\" could not be decoded because it is is a " + "malformed URL segment. This is probably due to a bad percent " + ("encoding (" + error + ").")); 902 return value; 903 } 904} 905/** 906 * @private 907 */ 908function stripBasename(pathname, basename) { 909 if (basename === "/") return pathname; 910 if (!pathname.toLowerCase().startsWith(basename.toLowerCase())) { 911 return null; 912 } 913 // We want to leave trailing slash behavior in the user's control, so if they 914 // specify a basename with a trailing slash, we should support it 915 let startIndex = basename.endsWith("/") ? basename.length - 1 : basename.length; 916 let nextChar = pathname.charAt(startIndex); 917 if (nextChar && nextChar !== "/") { 918 // pathname does not start with basename/ 919 return null; 920 } 921 return pathname.slice(startIndex) || "/"; 922} 923/** 924 * Returns a resolved path object relative to the given pathname. 925 * 926 * @see https://reactrouter.com/utils/resolve-path 927 */ 928function resolvePath(to, fromPathname) { 929 if (fromPathname === void 0) { 930 fromPathname = "/"; 931 } 932 let { 933 pathname: toPathname, 934 search = "", 935 hash = "" 936 } = typeof to === "string" ? parsePath(to) : to; 937 let pathname = toPathname ? toPathname.startsWith("/") ? toPathname : resolvePathname(toPathname, fromPathname) : fromPathname; 938 return { 939 pathname, 940 search: normalizeSearch(search), 941 hash: normalizeHash(hash) 942 }; 943} 944function resolvePathname(relativePath, fromPathname) { 945 let segments = fromPathname.replace(/\/+$/, "").split("/"); 946 let relativeSegments = relativePath.split("/"); 947 relativeSegments.forEach(segment => { 948 if (segment === "..") { 949 // Keep the root "" segment so the pathname starts at / 950 if (segments.length > 1) segments.pop(); 951 } else if (segment !== ".") { 952 segments.push(segment); 953 } 954 }); 955 return segments.length > 1 ? segments.join("/") : "/"; 956} 957function getInvalidPathError(char, field, dest, path) { 958 return "Cannot include a '" + char + "' character in a manually specified " + ("`to." + field + "` field [" + JSON.stringify(path) + "]. Please separate it out to the ") + ("`to." + dest + "` field. Alternatively you may provide the full path as ") + "a string in <Link to=\"...\"> and the router will parse it for you."; 959} 960/** 961 * @private 962 * 963 * When processing relative navigation we want to ignore ancestor routes that 964 * do not contribute to the path, such that index/pathless layout routes don't 965 * interfere. 966 * 967 * For example, when moving a route element into an index route and/or a 968 * pathless layout route, relative link behavior contained within should stay 969 * the same. Both of the following examples should link back to the root: 970 * 971 * <Route path="/"> 972 * <Route path="accounts" element={<Link to=".."}> 973 * </Route> 974 * 975 * <Route path="/"> 976 * <Route path="accounts"> 977 * <Route element={<AccountsLayout />}> // <-- Does not contribute 978 * <Route index element={<Link to=".."} /> // <-- Does not contribute 979 * </Route 980 * </Route> 981 * </Route> 982 */ 983function getPathContributingMatches(matches) { 984 return matches.filter((match, index) => index === 0 || match.route.path && match.route.path.length > 0); 985} 986// Return the array of pathnames for the current route matches - used to 987// generate the routePathnames input for resolveTo() 988function getResolveToMatches(matches, v7_relativeSplatPath) { 989 let pathMatches = getPathContributingMatches(matches); 990 // When v7_relativeSplatPath is enabled, use the full pathname for the leaf 991 // match so we include splat values for "." links. See: 992 // https://github.com/remix-run/react-router/issues/11052#issuecomment-1836589329 993 if (v7_relativeSplatPath) { 994 return pathMatches.map((match, idx) => idx === matches.length - 1 ? match.pathname : match.pathnameBase); 995 } 996 return pathMatches.map(match => match.pathnameBase); 997} 998/** 999 * @private 1000 */ 1001function resolveTo(toArg, routePathnames, locationPathname, isPathRelative) { 1002 if (isPathRelative === void 0) { 1003 isPathRelative = false; 1004 } 1005 let to; 1006 if (typeof toArg === "string") { 1007 to = parsePath(toArg); 1008 } else { 1009 to = _extends({}, toArg); 1010 invariant(!to.pathname || !to.pathname.includes("?"), getInvalidPathError("?", "pathname", "search", to)); 1011 invariant(!to.pathname || !to.pathname.includes("#"), getInvalidPathError("#", "pathname", "hash", to)); 1012 invariant(!to.search || !to.search.includes("#"), getInvalidPathError("#", "search", "hash", to)); 1013 } 1014 let isEmptyPath = toArg === "" || to.pathname === ""; 1015 let toPathname = isEmptyPath ? "/" : to.pathname; 1016 let from; 1017 // Routing is relative to the current pathname if explicitly requested. 1018 // 1019 // If a pathname is explicitly provided in `to`, it should be relative to the 1020 // route context. This is explained in `Note on `<Link to>` values` in our 1021 // migration guide from v5 as a means of disambiguation between `to` values 1022 // that begin with `/` and those that do not. However, this is problematic for 1023 // `to` values that do not provide a pathname. `to` can simply be a search or 1024 // hash string, in which case we should assume that the navigation is relative 1025 // to the current location's pathname and *not* the route pathname. 1026 if (toPathname == null) { 1027 from = locationPathname; 1028 } else { 1029 let routePathnameIndex = routePathnames.length - 1; 1030 // With relative="route" (the default), each leading .. segment means 1031 // "go up one route" instead of "go up one URL segment". This is a key 1032 // difference from how <a href> works and a major reason we call this a 1033 // "to" value instead of a "href". 1034 if (!isPathRelative && toPathname.startsWith("..")) { 1035 let toSegments = toPathname.split("/"); 1036 while (toSegments[0] === "..") { 1037 toSegments.shift(); 1038 routePathnameIndex -= 1; 1039 } 1040 to.pathname = toSegments.join("/"); 1041 } 1042 from = routePathnameIndex >= 0 ? routePathnames[routePathnameIndex] : "/"; 1043 } 1044 let path = resolvePath(to, from); 1045 // Ensure the pathname has a trailing slash if the original "to" had one 1046 let hasExplicitTrailingSlash = toPathname && toPathname !== "/" && toPathname.endsWith("/"); 1047 // Or if this was a link to the current path which has a trailing slash 1048 let hasCurrentTrailingSlash = (isEmptyPath || toPathname === ".") && locationPathname.endsWith("/"); 1049 if (!path.pathname.endsWith("/") && (hasExplicitTrailingSlash || hasCurrentTrailingSlash)) { 1050 path.pathname += "/"; 1051 } 1052 return path; 1053} 1054/** 1055 * @private 1056 */ 1057function getToPathname(to) { 1058 // Empty strings should be treated the same as / paths 1059 return to === "" || to.pathname === "" ? "/" : typeof to === "string" ? parsePath(to).pathname : to.pathname; 1060} 1061/** 1062 * @private 1063 */ 1064const joinPaths = paths => paths.join("/").replace(/\/\/+/g, "/"); 1065/** 1066 * @private 1067 */ 1068const normalizePathname = pathname => pathname.replace(/\/+$/, "").replace(/^\/*/, "/"); 1069/** 1070 * @private 1071 */ 1072const normalizeSearch = search => !search || search === "?" ? "" : search.startsWith("?") ? search : "?" + search; 1073/** 1074 * @private 1075 */ 1076const normalizeHash = hash => !hash || hash === "#" ? "" : hash.startsWith("#") ? hash : "#" + hash; 1077/** 1078 * This is a shortcut for creating `application/json` responses. Converts `data` 1079 * to JSON and sets the `Content-Type` header. 1080 */ 1081const json = function json(data, init) { 1082 if (init === void 0) { 1083 init = {}; 1084 } 1085 let responseInit = typeof init === "number" ? { 1086 status: init 1087 } : init; 1088 let headers = new Headers(responseInit.headers); 1089 if (!headers.has("Content-Type")) { 1090 headers.set("Content-Type", "application/json; charset=utf-8"); 1091 } 1092 return new Response(JSON.stringify(data), _extends({}, responseInit, { 1093 headers 1094 })); 1095}; 1096class AbortedDeferredError extends Error {} 1097class DeferredData { 1098 constructor(data, responseInit) { 1099 this.pendingKeysSet = new Set(); 1100 this.subscribers = new Set(); 1101 this.deferredKeys = []; 1102 invariant(data && typeof data === "object" && !Array.isArray(data), "defer() only accepts plain objects"); 1103 // Set up an AbortController + Promise we can race against to exit early 1104 // cancellation 1105 let reject; 1106 this.abortPromise = new Promise((_, r) => reject = r); 1107 this.controller = new AbortController(); 1108 let onAbort = () => reject(new AbortedDeferredError("Deferred data aborted")); 1109 this.unlistenAbortSignal = () => this.controller.signal.removeEventListener("abort", onAbort); 1110 this.controller.signal.addEventListener("abort", onAbort); 1111 this.data = Object.entries(data).reduce((acc, _ref2) => { 1112 let [key, value] = _ref2; 1113 return Object.assign(acc, { 1114 [key]: this.trackPromise(key, value) 1115 }); 1116 }, {}); 1117 if (this.done) { 1118 // All incoming values were resolved 1119 this.unlistenAbortSignal(); 1120 } 1121 this.init = responseInit; 1122 } 1123 trackPromise(key, value) { 1124 if (!(value instanceof Promise)) { 1125 return value; 1126 } 1127 this.deferredKeys.push(key); 1128 this.pendingKeysSet.add(key); 1129 // We store a little wrapper promise that will be extended with 1130 // _data/_error props upon resolve/reject 1131 let promise = Promise.race([value, this.abortPromise]).then(data => this.onSettle(promise, key, undefined, data), error => this.onSettle(promise, key, error)); 1132 // Register rejection listeners to avoid uncaught promise rejections on 1133 // errors or aborted deferred values 1134 promise.catch(() => {}); 1135 Object.defineProperty(promise, "_tracked", { 1136 get: () => true 1137 }); 1138 return promise; 1139 } 1140 onSettle(promise, key, error, data) { 1141 if (this.controller.signal.aborted && error instanceof AbortedDeferredError) { 1142 this.unlistenAbortSignal(); 1143 Object.defineProperty(promise, "_error", { 1144 get: () => error 1145 }); 1146 return Promise.reject(error); 1147 } 1148 this.pendingKeysSet.delete(key); 1149 if (this.done) { 1150 // Nothing left to abort! 1151 this.unlistenAbortSignal(); 1152 } 1153 // If the promise was resolved/rejected with undefined, we'll throw an error as you 1154 // should always resolve with a value or null 1155 if (error === undefined && data === undefined) { 1156 let undefinedError = new Error("Deferred data for key \"" + key + "\" resolved/rejected with `undefined`, " + "you must resolve/reject with a value or `null`."); 1157 Object.defineProperty(promise, "_error", { 1158 get: () => undefinedError 1159 }); 1160 this.emit(false, key); 1161 return Promise.reject(undefinedError); 1162 } 1163 if (data === undefined) { 1164 Object.defineProperty(promise, "_error", { 1165 get: () => error 1166 }); 1167 this.emit(false, key); 1168 return Promise.reject(error); 1169 } 1170 Object.defineProperty(promise, "_data", { 1171 get: () => data 1172 }); 1173 this.emit(false, key); 1174 return data; 1175 } 1176 emit(aborted, settledKey) { 1177 this.subscribers.forEach(subscriber => subscriber(aborted, settledKey)); 1178 } 1179 subscribe(fn) { 1180 this.subscribers.add(fn); 1181 return () => this.subscribers.delete(fn); 1182 } 1183 cancel() { 1184 this.controller.abort(); 1185 this.pendingKeysSet.forEach((v, k) => this.pendingKeysSet.delete(k)); 1186 this.emit(true); 1187 } 1188 async resolveData(signal) { 1189 let aborted = false; 1190 if (!this.done) { 1191 let onAbort = () => this.cancel(); 1192 signal.addEventListener("abort", onAbort); 1193 aborted = await new Promise(resolve => { 1194 this.subscribe(aborted => { 1195 signal.removeEventListener("abort", onAbort); 1196 if (aborted || this.done) { 1197 resolve(aborted); 1198 } 1199 }); 1200 }); 1201 } 1202 return aborted; 1203 } 1204 get done() { 1205 return this.pendingKeysSet.size === 0; 1206 } 1207 get unwrappedData() { 1208 invariant(this.data !== null && this.done, "Can only unwrap data on initialized and settled deferreds"); 1209 return Object.entries(this.data).reduce((acc, _ref3) => { 1210 let [key, value] = _ref3; 1211 return Object.assign(acc, { 1212 [key]: unwrapTrackedPromise(value) 1213 }); 1214 }, {}); 1215 } 1216 get pendingKeys() { 1217 return Array.from(this.pendingKeysSet); 1218 } 1219} 1220function isTrackedPromise(value) { 1221 return value instanceof Promise && value._tracked === true; 1222} 1223function unwrapTrackedPromise(value) { 1224 if (!isTrackedPromise(value)) { 1225 return value; 1226 } 1227 if (value._error) { 1228 throw value._error; 1229 } 1230 return value._data; 1231} 1232const defer = function defer(data, init) { 1233 if (init === void 0) { 1234 init = {}; 1235 } 1236 let responseInit = typeof init === "number" ? { 1237 status: init 1238 } : init; 1239 return new DeferredData(data, responseInit); 1240}; 1241/** 1242 * A redirect response. Sets the status code and the `Location` header. 1243 * Defaults to "302 Found". 1244 */ 1245const redirect = function redirect(url, init) { 1246 if (init === void 0) { 1247 init = 302; 1248 } 1249 let responseInit = init; 1250 if (typeof responseInit === "number") { 1251 responseInit = { 1252 status: responseInit 1253 }; 1254 } else if (typeof responseInit.status === "undefined") { 1255 responseInit.status = 302; 1256 } 1257 let headers = new Headers(responseInit.headers); 1258 headers.set("Location", url); 1259 return new Response(null, _extends({}, responseInit, { 1260 headers 1261 })); 1262}; 1263/** 1264 * A redirect response that will force a document reload to the new location. 1265 * Sets the status code and the `Location` header. 1266 * Defaults to "302 Found". 1267 */ 1268const redirectDocument = (url, init) => { 1269 let response = redirect(url, init); 1270 response.headers.set("X-Remix-Reload-Document", "true"); 1271 return response; 1272}; 1273/** 1274 * @private 1275 * Utility class we use to hold auto-unwrapped 4xx/5xx Response bodies 1276 * 1277 * We don't export the class for public use since it's an implementation 1278 * detail, but we export the interface above so folks can build their own 1279 * abstractions around instances via isRouteErrorResponse() 1280 */ 1281class ErrorResponseImpl { 1282 constructor(status, statusText, data, internal) { 1283 if (internal === void 0) { 1284 internal = false; 1285 } 1286 this.status = status; 1287 this.statusText = statusText || ""; 1288 this.internal = internal; 1289 if (data instanceof Error) { 1290 this.data = data.toString(); 1291 this.error = data; 1292 } else { 1293 this.data = data; 1294 } 1295 } 1296} 1297/** 1298 * Check if the given error is an ErrorResponse generated from a 4xx/5xx 1299 * Response thrown from an action/loader 1300 */ 1301function isRouteErrorResponse(error) { 1302 return error != null && typeof error.status === "number" && typeof error.statusText === "string" && typeof error.internal === "boolean" && "data" in error; 1303} 1304 1305const validMutationMethodsArr = ["post", "put", "patch", "delete"]; 1306const validMutationMethods = new Set(validMutationMethodsArr); 1307const validRequestMethodsArr = ["get", ...validMutationMethodsArr]; 1308const validRequestMethods = new Set(validRequestMethodsArr); 1309const redirectStatusCodes = new Set([301, 302, 303, 307, 308]); 1310const redirectPreserveMethodStatusCodes = new Set([307, 308]); 1311const IDLE_NAVIGATION = { 1312 state: "idle", 1313 location: undefined, 1314 formMethod: undefined, 1315 formAction: undefined, 1316 formEncType: undefined, 1317 formData: undefined, 1318 json: undefined, 1319 text: undefined 1320}; 1321const IDLE_FETCHER = { 1322 state: "idle", 1323 data: undefined, 1324 formMethod: undefined, 1325 formAction: undefined, 1326 formEncType: undefined, 1327 formData: undefined, 1328 json: undefined, 1329 text: undefined 1330}; 1331const IDLE_BLOCKER = { 1332 state: "unblocked", 1333 proceed: undefined, 1334 reset: undefined, 1335 location: undefined 1336}; 1337const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i; 1338const defaultMapRouteProperties = route => ({ 1339 hasErrorBoundary: Boolean(route.hasErrorBoundary) 1340}); 1341const TRANSITIONS_STORAGE_KEY = "remix-router-transitions"; 1342//#endregion 1343//////////////////////////////////////////////////////////////////////////////// 1344//#region createRouter 1345//////////////////////////////////////////////////////////////////////////////// 1346/** 1347 * Create a router and listen to history POP navigations 1348 */ 1349function createRouter(init) { 1350 const routerWindow = init.window ? init.window : typeof window !== "undefined" ? window : undefined; 1351 const isBrowser = typeof routerWindow !== "undefined" && typeof routerWindow.document !== "undefined" && typeof routerWindow.document.createElement !== "undefined"; 1352 const isServer = !isBrowser; 1353 invariant(init.routes.length > 0, "You must provide a non-empty routes array to createRouter"); 1354 let mapRouteProperties; 1355 if (init.mapRouteProperties) { 1356 mapRouteProperties = init.mapRouteProperties; 1357 } else if (init.detectErrorBoundary) { 1358 // If they are still using the deprecated version, wrap it with the new API 1359 let detectErrorBoundary = init.detectErrorBoundary; 1360 mapRouteProperties = route => ({ 1361 hasErrorBoundary: detectErrorBoundary(route) 1362 }); 1363 } else { 1364 mapRouteProperties = defaultMapRouteProperties; 1365 } 1366 // Routes keyed by ID 1367 let manifest = {}; 1368 // Routes in tree format for matching 1369 let dataRoutes = convertRoutesToDataRoutes(init.routes, mapRouteProperties, undefined, manifest); 1370 let inFlightDataRoutes; 1371 let basename = init.basename || "/"; 1372 // Config driven behavior flags 1373 let future = _extends({ 1374 v7_fetcherPersist: false, 1375 v7_normalizeFormMethod: false, 1376 v7_partialHydration: false, 1377 v7_prependBasename: false, 1378 v7_relativeSplatPath: false 1379 }, init.future); 1380 // Cleanup function for history 1381 let unlistenHistory = null; 1382 // Externally-provided functions to call on all state changes 1383 let subscribers = new Set(); 1384 // Externally-provided object to hold scroll restoration locations during routing 1385 let savedScrollPositions = null; 1386 // Externally-provided function to get scroll restoration keys 1387 let getScrollRestorationKey = null; 1388 // Externally-provided function to get current scroll position 1389 let getScrollPosition = null; 1390 // One-time flag to control the initial hydration scroll restoration. Because 1391 // we don't get the saved positions from <ScrollRestoration /> until _after_ 1392 // the initial render, we need to manually trigger a separate updateState to 1393 // send along the restoreScrollPosition 1394 // Set to true if we have `hydrationData` since we assume we were SSR'd and that 1395 // SSR did the initial scroll restoration. 1396 let initialScrollRestored = init.hydrationData != null; 1397 let initialMatches = matchRoutes(dataRoutes, init.history.location, basename); 1398 let initialErrors = null; 1399 if (initialMatches == null) { 1400 // If we do not match a user-provided-route, fall back to the root 1401 // to allow the error boundary to take over 1402 let error = getInternalRouterError(404, { 1403 pathname: init.history.location.pathname 1404 }); 1405 let { 1406 matches, 1407 route 1408 } = getShortCircuitMatches(dataRoutes); 1409 initialMatches = matches; 1410 initialErrors = { 1411 [route.id]: error 1412 }; 1413 } 1414 let initialized; 1415 let hasLazyRoutes = initialMatches.some(m => m.route.lazy); 1416 let hasLoaders = initialMatches.some(m => m.route.loader); 1417 if (hasLazyRoutes) { 1418 // All initialMatches need to be loaded before we're ready. If we have lazy 1419 // functions around still then we'll need to run them in initialize() 1420 initialized = false; 1421 } else if (!hasLoaders) { 1422 // If we've got no loaders to run, then we're good to go 1423 initialized = true; 1424 } else if (future.v7_partialHydration) { 1425 // If partial hydration is enabled, we're initialized so long as we were 1426 // provided with hydrationData for every route with a loader, and no loaders 1427 // were marked for explicit hydration 1428 let loaderData = init.hydrationData ? init.hydrationData.loaderData : null; 1429 let errors = init.hydrationData ? init.hydrationData.errors : null; 1430 initialized = initialMatches.every(m => m.route.loader && m.route.loader.hydrate !== true && (loaderData && loaderData[m.route.id] !== undefined || errors && errors[m.route.id] !== undefined)); 1431 } else { 1432 // Without partial hydration - we're initialized if we were provided any 1433 // hydrationData - which is expected to be complete 1434 initialized = init.hydrationData != null; 1435 } 1436 let router; 1437 let state = { 1438 historyAction: init.history.action, 1439 location: init.history.location, 1440 matches: initialMatches, 1441 initialized, 1442 navigation: IDLE_NAVIGATION, 1443 // Don't restore on initial updateState() if we were SSR'd 1444 restoreScrollPosition: init.hydrationData != null ? false : null, 1445 preventScrollReset: false, 1446 revalidation: "idle", 1447 loaderData: init.hydrationData && init.hydrationData.loaderData || {}, 1448 actionData: init.hydrationData && init.hydrationData.actionData || null, 1449 errors: init.hydrationData && init.hydrationData.errors || initialErrors, 1450 fetchers: new Map(), 1451 blockers: new Map() 1452 }; 1453 // -- Stateful internal variables to manage navigations -- 1454 // Current navigation in progress (to be committed in completeNavigation) 1455 let pendingAction = Action.Pop; 1456 // Should the current navigation prevent the scroll reset if scroll cannot 1457 // be restored? 1458 let pendingPreventScrollReset = false; 1459 // AbortController for the active navigation 1460 let pendingNavigationController; 1461 // Should the current navigation enable document.startViewTransition? 1462 let pendingViewTransitionEnabled = false; 1463 // Store applied view transitions so we can apply them on POP 1464 let appliedViewTransitions = new Map(); 1465 // Cleanup function for persisting applied transitions to sessionStorage 1466 let removePageHideEventListener = null; 1467 // We use this to avoid touching history in completeNavigation if a 1468 // revalidation is entirely uninterrupted 1469 let isUninterruptedRevalidation = false; 1470 // Use this internal flag to force revalidation of all loaders: 1471 // - submissions (completed or interrupted) 1472 // - useRevalidator() 1473 // - X-Remix-Revalidate (from redirect) 1474 let isRevalidationRequired = false; 1475 // Use this internal array to capture routes that require revalidation due 1476 // to a cancelled deferred on action submission 1477 let cancelledDeferredRoutes = []; 1478 // Use this internal array to capture fetcher loads that were cancelled by an 1479 // action navigation and require revalidation 1480 let cancelledFetcherLoads = []; 1481 // AbortControllers for any in-flight fetchers 1482 let fetchControllers = new Map(); 1483 // Track loads based on the order in which they started 1484 let incrementingLoadId = 0; 1485 // Track the outstanding pending navigation data load to be compared against 1486 // the globally incrementing load when a fetcher load lands after a completed 1487 // navigation 1488 let pendingNavigationLoadId = -1; 1489 // Fetchers that triggered data reloads as a result of their actions 1490 let fetchReloadIds = new Map(); 1491 // Fetchers that triggered redirect navigations 1492 let fetchRedirectIds = new Set(); 1493 // Most recent href/match for fetcher.load calls for fetchers 1494 let fetchLoadMatches = new Map(); 1495 // Ref-count mounted fetchers so we know when it's ok to clean them up 1496 let activeFetchers = new Map(); 1497 // Fetchers that have requested a delete when using v7_fetcherPersist, 1498 // they'll be officially removed after they return to idle 1499 let deletedFetchers = new Set(); 1500 // Store DeferredData instances for active route matches. When a 1501 // route loader returns defer() we stick one in here. Then, when a nested 1502 // promise resolves we update loaderData. If a new navigation starts we 1503 // cancel active deferreds for eliminated routes. 1504 let activeDeferreds = new Map(); 1505 // Store blocker functions in a separate Map outside of router state since 1506 // we don't need to update UI state if they change 1507 let blockerFunctions = new Map(); 1508 // Flag to ignore the next history update, so we can revert the URL change on 1509 // a POP navigation that was blocked by the user without touching router state 1510 let ignoreNextHistoryUpdate = false; 1511 // Initialize the router, all side effects should be kicked off from here. 1512 // Implemented as a Fluent API for ease of: 1513 // let router = createRouter(init).initialize(); 1514 function initialize() { 1515 // If history informs us of a POP navigation, start the navigation but do not update 1516 // state. We'll update our own state once the navigation completes 1517 unlistenHistory = init.history.listen(_ref => { 1518 let { 1519 action: historyAction, 1520 location, 1521 delta 1522 } = _ref; 1523 // Ignore this event if it was just us resetting the URL from a 1524 // blocked POP navigation 1525 if (ignoreNextHistoryUpdate) { 1526 ignoreNextHistoryUpdate = false; 1527 return; 1528 } 1529 warning(blockerFunctions.size === 0 || delta != null, "You are trying to use a blocker on a POP navigation to a location " + "that was not created by @remix-run/router. This will fail silently in " + "production. This can happen if you are navigating outside the router " + "via `window.history.pushState`/`window.location.hash` instead of using " + "router navigation APIs. This can also happen if you are using " + "createHashRouter and the user manually changes the URL."); 1530 let blockerKey = shouldBlockNavigation({ 1531 currentLocation: state.location, 1532 nextLocation: location, 1533 historyAction 1534 }); 1535 if (blockerKey && delta != null) { 1536 // Restore the URL to match the current UI, but don't update router state 1537 ignoreNextHistoryUpdate = true; 1538 init.history.go(delta * -1); 1539 // Put the blocker into a blocked state 1540 updateBlocker(blockerKey, { 1541 state: "blocked", 1542 location, 1543 proceed() { 1544 updateBlocker(blockerKey, { 1545 state: "proceeding", 1546 proceed: undefined, 1547 reset: undefined, 1548 location 1549 }); 1550 // Re-do the same POP navigation we just blocked 1551 init.history.go(delta); 1552 }, 1553 reset() { 1554 let blockers = new Map(state.blockers); 1555 blockers.set(blockerKey, IDLE_BLOCKER); 1556 updateState({ 1557 blockers 1558 }); 1559 } 1560 }); 1561 return; 1562 } 1563 return startNavigation(historyAction, location); 1564 }); 1565 if (isBrowser) { 1566 // FIXME: This feels gross. How can we cleanup the lines between 1567 // scrollRestoration/appliedTransitions persistance? 1568 restoreAppliedTransitions(routerWindow, appliedViewTransitions); 1569 let _saveAppliedTransitions = () => persistAppliedTransitions(routerWindow, appliedViewTransitions); 1570 routerWindow.addEventListener("pagehide", _saveAppliedTransitions); 1571 removePageHideEventListener = () => routerWindow.removeEventListener("pagehide", _saveAppliedTransitions); 1572 } 1573 // Kick off initial data load if needed. Use Pop to avoid modifying history 1574 // Note we don't do any handling of lazy here. For SPA's it'll get handled 1575 // in the normal navigation flow. For SSR it's expected that lazy modules are 1576 // resolved prior to router creation since we can't go into a fallbackElement 1577 // UI for SSR'd apps 1578 if (!state.initialized) { 1579 startNavigation(Action.Pop, state.location, { 1580 initialHydration: true 1581 }); 1582 } 1583 return router; 1584 } 1585 // Clean up a router and it's side effects 1586 function dispose() { 1587 if (unlistenHistory) { 1588 unlistenHistory(); 1589 } 1590 if (removePageHideEventListener) { 1591 removePageHideEventListener(); 1592 } 1593 subscribers.clear(); 1594 pendingNavigationController && pendingNavigationController.abort(); 1595 state.fetchers.forEach((_, key) => deleteFetcher(key)); 1596 state.blockers.forEach((_, key) => deleteBlocker(key)); 1597 } 1598 // Subscribe to state updates for the router 1599 function subscribe(fn) { 1600 subscribers.add(fn); 1601 return () => subscribers.delete(fn); 1602 } 1603 // Update our state and notify the calling context of the change 1604 function updateState(newState, opts) { 1605 if (opts === void 0) { 1606 opts = {}; 1607 } 1608 state = _extends({}, state, newState); 1609 // Prep fetcher cleanup so we can tell the UI which fetcher data entries 1610 // can be removed 1611 let completedFetchers = []; 1612 let deletedFetchersKeys = []; 1613 if (future.v7_fetcherPersist) { 1614 state.fetchers.forEach((fetcher, key) => { 1615 if (fetcher.state === "idle") { 1616 if (deletedFetchers.has(key)) { 1617 // Unmounted from the UI and can be totally removed 1618 deletedFetchersKeys.push(key); 1619 } else { 1620 // Returned to idle but still mounted in the UI, so semi-remains for 1621 // revalidations and such 1622 completedFetchers.push(key); 1623 } 1624 } 1625 }); 1626 } 1627 // Iterate over a local copy so that if flushSync is used and we end up 1628 // removing and adding a new subscriber due to the useCallback dependencies, 1629 // we don't get ourselves into a loop calling the new subscriber immediately 1630 [...subscribers].forEach(subscriber => subscriber(state, { 1631 deletedFetchers: deletedFetchersKeys, 1632 unstable_viewTransitionOpts: opts.viewTransitionOpts, 1633 unstable_flushSync: opts.flushSync === true 1634 })); 1635 // Remove idle fetchers from state since we only care about in-flight fetchers. 1636 if (future.v7_fetcherPersist) { 1637 completedFetchers.forEach(key => state.fetchers.delete(key)); 1638 deletedFetchersKeys.forEach(key => deleteFetcher(key)); 1639 } 1640 } 1641 // Complete a navigation returning the state.navigation back to the IDLE_NAVIGATION 1642 // and setting state.[historyAction/location/matches] to the new route. 1643 // - Location is a required param 1644 // - Navigation will always be set to IDLE_NAVIGATION 1645 // - Can pass any other state in newState 1646 function completeNavigation(location, newState, _temp) { 1647 var _location$state, _location$state2; 1648 let { 1649 flushSync 1650 } = _temp === void 0 ? {} : _temp; 1651 // Deduce if we're in a loading/actionReload state: 1652 // - We have committed actionData in the store 1653 // - The current navigation was a mutation submission 1654 // - We're past the submitting state and into the loading state 1655 // - The location being loaded is not the result of a redirect 1656 let isActionReload = state.actionData != null && state.navigation.formMethod != null && isMutationMethod(state.navigation.formMethod) && state.navigation.state === "loading" && ((_location$state = location.state) == null ? void 0 : _location$state._isRedirect) !== true; 1657 let actionData; 1658 if (newState.actionData) { 1659 if (Object.keys(newState.actionData).length > 0) { 1660 actionData = newState.actionData; 1661 } else { 1662 // Empty actionData -> clear prior actionData due to an action error 1663 actionData = null; 1664 } 1665 } else if (isActionReload) { 1666 // Keep the current data if we're wrapping up the action reload 1667 actionData = state.actionData; 1668 } else { 1669 // Clear actionData on any other completed navigations 1670 actionData = null; 1671 } 1672 // Always preserve any existing loaderData from re-used routes 1673 let loaderData = newState.loaderData ? mergeLoaderData(state.loaderData, newState.loaderData, newState.matches || [], newState.errors) : state.loaderData; 1674 // On a successful navigation we can assume we got through all blockers 1675 // so we can start fresh 1676 let blockers = state.blockers; 1677 if (blockers.size > 0) { 1678 blockers = new Map(blockers); 1679 blockers.forEach((_, k) => blockers.set(k, IDLE_BLOCKER)); 1680 } 1681 // Always respect the user flag. Otherwise don't reset on mutation 1682 // submission navigations unless they redirect 1683 let preventScrollReset = pendingPreventScrollReset === true || state.navigation.formMethod != null && isMutationMethod(state.navigation.formMethod) && ((_location$state2 = location.state) == null ? void 0 : _location$state2._isRedirect) !== true; 1684 if (inFlightDataRoutes) { 1685 dataRoutes = inFlightDataRoutes; 1686 inFlightDataRoutes = undefined; 1687 } 1688 if (isUninterruptedRevalidation) ; else if (pendingAction === Action.Pop) ; else if (pendingAction === Action.Push) { 1689 init.history.push(location, location.state); 1690 } else if (pendingAction === Action.Replace) { 1691 init.history.replace(location, location.state); 1692 } 1693 let viewTransitionOpts; 1694 // On POP, enable transitions if they were enabled on the original navigation 1695 if (pendingAction === Action.Pop) { 1696 // Forward takes precedence so they behave like the original navigation 1697 let priorPaths = appliedViewTransitions.get(state.location.pathname); 1698 if (priorPaths && priorPaths.has(location.pathname)) { 1699 viewTransitionOpts = { 1700 currentLocation: state.location, 1701 nextLocation: location 1702 }; 1703 } else if (appliedViewTransitions.has(location.pathname)) { 1704 // If we don't have a previous forward nav, assume we're popping back to 1705 // the new location and enable if that location previously enabled 1706 viewTransitionOpts = { 1707 currentLocation: location, 1708 nextLocation: state.location 1709 }; 1710 } 1711 } else if (pendingViewTransitionEnabled) { 1712 // Store the applied transition on PUSH/REPLACE 1713 let toPaths = appliedViewTransitions.get(state.location.pathname); 1714 if (toPaths) { 1715 toPaths.add(location.pathname); 1716 } else { 1717 toPaths = new Set([location.pathname]); 1718 appliedViewTransitions.set(state.location.pathname, toPaths); 1719 } 1720 viewTransitionOpts = { 1721 currentLocation: state.location, 1722 nextLocation: location 1723 }; 1724 } 1725 updateState(_extends({}, newState, { 1726 actionData, 1727 loaderData, 1728 historyAction: pendingAction, 1729 location, 1730 initialized: true, 1731 navigation: IDLE_NAVIGATION, 1732 revalidation: "idle", 1733 restoreScrollPosition: getSavedScrollPosition(location, newState.matches || state.matches), 1734 preventScrollReset, 1735 blockers 1736 }), { 1737 viewTransitionOpts, 1738 flushSync: flushSync === true 1739 }); 1740 // Reset stateful navigation vars 1741 pendingAction = Action.Pop; 1742 pendingPreventScrollReset = false; 1743 pendingViewTransitionEnabled = false; 1744 isUninterruptedRevalidation = false; 1745 isRevalidationRequired = false; 1746 cancelledDeferredRoutes = []; 1747 cancelledFetcherLoads = []; 1748 } 1749 // Trigger a navigation event, which can either be a numerical POP or a PUSH 1750 // replace with an optional submission 1751 async function navigate(to, opts) { 1752 if (typeof to === "number") { 1753 init.history.go(to); 1754 return; 1755 } 1756 let normalizedPath = normalizeTo(state.location, state.matches, basename, future.v7_prependBasename, to, future.v7_relativeSplatPath, opts == null ? void 0 : opts.fromRouteId, opts == null ? void 0 : opts.relative); 1757 let { 1758 path, 1759 submission, 1760 error 1761 } = normalizeNavigateOptions(future.v7_normalizeFormMethod, false, normalizedPath, opts); 1762 let currentLocation = state.location; 1763 let nextLocation = createLocation(state.location, path, opts && opts.state); 1764 // When using navigate as a PUSH/REPLACE we aren't reading an already-encoded 1765 // URL from window.location, so we need to encode it here so the behavior 1766 // remains the same as POP and non-data-router usages. new URL() does all 1767 // the same encoding we'd get from a history.pushState/window.location read 1768 // without having to touch history 1769 nextLocation = _extends({}, nextLocation, init.history.encodeLocation(nextLocation)); 1770 let userReplace = opts && opts.replace != null ? opts.replace : undefined; 1771 let historyAction = Action.Push; 1772 if (userReplace === true) { 1773 historyAction = Action.Replace; 1774 } else if (userReplace === false) ; else if (submission != null && isMutationMethod(submission.formMethod) && submission.formAction === state.location.pathname + state.location.search) { 1775 // By default on submissions to the current location we REPLACE so that 1776 // users don't have to double-click the back button to get to the prior 1777 // location. If the user redirects to a different location from the 1778 // action/loader this will be ignored and the redirect will be a PUSH 1779 historyAction = Action.Replace; 1780 } 1781 let preventScrollReset = opts && "preventScrollReset" in opts ? opts.preventScrollReset === true : undefined; 1782 let flushSync = (opts && opts.unstable_flushSync) === true; 1783 let blockerKey = shouldBlockNavigation({ 1784 currentLocation, 1785 nextLocation, 1786 historyAction 1787 }); 1788 if (blockerKey) { 1789 // Put the blocker into a blocked state 1790 updateBlocker(blockerKey, { 1791 state: "blocked", 1792 location: nextLocation, 1793 proceed() { 1794 updateBlocker(blockerKey, { 1795 state: "proceeding", 1796 proceed: undefined, 1797 reset: undefined, 1798 location: nextLocation 1799 }); 1800 // Send the same navigation through 1801 navigate(to, opts); 1802 }, 1803 reset() { 1804 let blockers = new Map(state.blockers); 1805 blockers.set(blockerKey, IDLE_BLOCKER); 1806 updateState({ 1807 blockers 1808 }); 1809 } 1810 }); 1811 return; 1812 } 1813 return await startNavigation(historyAction, nextLocation, { 1814 submission, 1815 // Send through the formData serialization error if we have one so we can 1816 // render at the right error boundary after we match routes 1817 pendingError: error, 1818 preventScrollReset, 1819 replace: opts && opts.replace, 1820 enableViewTransition: opts && opts.unstable_viewTransition, 1821 flushSync 1822 }); 1823 } 1824 // Revalidate all current loaders. If a navigation is in progress or if this 1825 // is interrupted by a navigation, allow this to "succeed" by calling all 1826 // loaders during the next loader round 1827 function revalidate() { 1828 interruptActiveLoads(); 1829 updateState({ 1830 revalidation: "loading" 1831 }); 1832 // If we're currently submitting an action, we don't need to start a new 1833 // navigation, we'll just let the follow up loader execution call all loaders 1834 if (state.navigation.state === "submitting") { 1835 return; 1836 } 1837 // If we're currently in an idle state, start a new navigation for the current 1838 // action/location and mark it as uninterrupted, which will skip the history 1839 // update in completeNavigation 1840 if (state.navigation.state === "idle") { 1841 startNavigation(state.historyAction, state.location, { 1842 startUninterruptedRevalidation: true 1843 }); 1844 return; 1845 } 1846 // Otherwise, if we're currently in a loading state, just start a new 1847 // navigation to the navigation.location but do not trigger an uninterrupted 1848 // revalidation so that history correctly updates once the navigation completes 1849 startNavigation(pendingAction || state.historyAction, state.navigation.location, { 1850 overrideNavigation: state.navigation 1851 }); 1852 } 1853 // Start a navigation to the given action/location. Can optionally provide a 1854 // overrideNavigation which will override the normalLoad in the case of a redirect 1855 // navigation 1856 async function startNavigation(historyAction, location, opts) { 1857 // Abort any in-progress navigations and start a new one. Unset any ongoing 1858 // uninterrupted revalidations unless told otherwise, since we want this 1859 // new navigation to update history normally 1860 pendingNavigationController && pendingNavigationController.abort(); 1861 pendingNavigationController = null; 1862 pendingAction = historyAction; 1863 isUninterruptedRevalidation = (opts && opts.startUninterruptedRevalidation) === true; 1864 // Save the current scroll position every time we start a new navigation, 1865 // and track whether we should reset scroll on completion 1866 saveScrollPosition(state.location, state.matches); 1867 pendingPreventScrollReset = (opts && opts.preventScrollReset) === true; 1868 pendingViewTransitionEnabled = (opts && opts.enableViewTransition) === true; 1869 let routesToUse = inFlightDataRoutes || dataRoutes; 1870 let loadingNavigation = opts && opts.overrideNavigation; 1871 let matches = matchRoutes(routesToUse, location, basename); 1872 let flushSync = (opts && opts.flushSync) === true; 1873 // Short circuit with a 404 on the root error boundary if we match nothing 1874 if (!matches) { 1875 let error = getInternalRouterError(404, { 1876 pathname: location.pathname 1877 }); 1878 let { 1879 matches: notFoundMatches, 1880 route 1881 } = getShortCircuitMatches(routesToUse); 1882 // Cancel all pending deferred on 404s since we don't keep any routes 1883 cancelActiveDeferreds(); 1884 completeNavigation(location, { 1885 matches: notFoundMatches, 1886 loaderData: {}, 1887 errors: { 1888 [route.id]: error 1889 } 1890 }, { 1891 flushSync 1892 }); 1893 return; 1894 } 1895 // Short circuit if it's only a hash change and not a revalidation or 1896 // mutation submission. 1897 // 1898 // Ignore on initial page loads because since the initial load will always 1899 // be "same hash". For example, on /page#hash and submit a <Form method="post"> 1900 // which will default to a navigation to /page 1901 if (state.initialized && !isRevalidationRequired && isHashChangeOnly(state.location, location) && !(opts && opts.submission && isMutationMethod(opts.submission.formMethod))) { 1902 completeNavigation(location, { 1903 matches 1904 }, { 1905 flushSync 1906 }); 1907 return; 1908 } 1909 // Create a controller/Request for this navigation 1910 pendingNavigationController = new AbortController(); 1911 let request = createClientSideRequest(init.history, location, pendingNavigationController.signal, opts && opts.submission); 1912 let pendingActionData; 1913 let pendingError; 1914 if (opts && opts.pendingError) { 1915 // If we have a pendingError, it means the user attempted a GET submission 1916 // with binary FormData so assign here and skip to handleLoaders. That 1917 // way we handle calling loaders above the boundary etc. It's not really 1918 // different from an actionError in that sense. 1919 pendingError = { 1920 [findNearestBoundary(matches).route.id]: opts.pendingError 1921 }; 1922 } else if (opts && opts.submission && isMutationMethod(opts.submission.formMethod)) { 1923 // Call action if we received an action submission 1924 let actionOutput = await handleAction(request, location, opts.submission, matches, { 1925 replace: opts.replace, 1926 flushSync 1927 }); 1928 if (actionOutput.shortCircuited) { 1929 return; 1930 } 1931 pendingActionData = actionOutput.pendingActionData; 1932 pendingError = actionOutput.pendingActionError; 1933 loadingNavigation = getLoadingNavigation(location, opts.submission); 1934 flushSync = false; 1935 // Create a GET request for the loaders 1936 request = new Request(request.url, { 1937 signal: request.signal 1938 }); 1939 } 1940 // Call loaders 1941 let { 1942 shortCircuited, 1943 loaderData, 1944 errors 1945 } = await handleLoaders(request, location, matches, loadingNavigation, opts && opts.submission, opts && opts.fetcherSubmission, opts && opts.replace, opts && opts.initialHydration === true, flushSync, pendingActionData, pendingError); 1946 if (shortCircuited) { 1947 return; 1948 } 1949 // Clean up now that the action/loaders have completed. Don't clean up if 1950 // we short circuited because pendingNavigationController will have already 1951 // been assigned to a new controller for the next navigation 1952 pendingNavigationController = null; 1953 completeNavigation(location, _extends({ 1954 matches 1955 }, pendingActionData ? { 1956 actionData: pendingActionData 1957 } : {}, { 1958 loaderData, 1959 errors 1960 })); 1961 } 1962 // Call the action matched by the leaf route for this navigation and handle 1963 // redirects/errors 1964 async function handleAction(request, location, submission, matches, opts) { 1965 if (opts === void 0) { 1966 opts = {}; 1967 } 1968 interruptActiveLoads(); 1969 // Put us in a submitting state 1970 let navigation = getSubmittingNavigation(location, submission); 1971 updateState({ 1972 navigation 1973 }, { 1974 flushSync: opts.flushSync === true 1975 }); 1976 // Call our action and get the result 1977 let result; 1978 let actionMatch = getTargetMatch(matches, location); 1979 if (!actionMatch.route.action && !actionMatch.route.lazy) { 1980 result = { 1981 type: ResultType.error, 1982 error: getInternalRouterError(405, { 1983 method: request.method, 1984 pathname: location.pathname, 1985 routeId: actionMatch.route.id 1986 }) 1987 }; 1988 } else { 1989 result = await callLoaderOrAction("action", request, actionMatch, matches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath); 1990 if (request.signal.aborted) { 1991 return { 1992 shortCircuited: true 1993 }; 1994 } 1995 } 1996 if (isRedirectResult(result)) { 1997 let replace; 1998 if (opts && opts.replace != null) { 1999 replace = opts.replace; 2000 } else { 2001 // If the user didn't explicity indicate replace behavior, replace if 2002 // we redirected to the exact same location we're currently at to avoid 2003 // double back-buttons 2004 replace = result.location === state.location.pathname + state.location.search; 2005 } 2006 await startRedirectNavigation(state, result, { 2007 submission, 2008 replace 2009 }); 2010 return { 2011 shortCircuited: true 2012 }; 2013 } 2014 if (isErrorResult(result)) { 2015 // Store off the pending error - we use it to determine which loaders 2016 // to call and will commit it when we complete the navigation 2017 let boundaryMatch = findNearestBoundary(matches, actionMatch.route.id); 2018 // By default, all submissions are REPLACE navigations, but if the 2019 // action threw an error that'll be rendered in an errorElement, we fall 2020 // back to PUSH so that the user can use the back button to get back to 2021 // the pre-submission form location to try again 2022 if ((opts && opts.replace) !== true) { 2023 pendingAction = Action.Push; 2024 } 2025 return { 2026 // Send back an empty object we can use to clear out any prior actionData 2027 pendingActionData: {}, 2028 pendingActionError: { 2029 [boundaryMatch.route.id]: result.error 2030 } 2031 }; 2032 } 2033 if (isDeferredResult(result)) { 2034 throw getInternalRouterError(400, { 2035 type: "defer-action" 2036 }); 2037 } 2038 return { 2039 pendingActionData: { 2040 [actionMatch.route.id]: result.data 2041 } 2042 }; 2043 } 2044 // Call all applicable loaders for the given matches, handling redirects, 2045 // errors, etc. 2046 async function handleLoaders(request, location, matches, overrideNavigation, submission, fetcherSubmission, replace, initialHydration, flushSync, pendingActionData, pendingError) { 2047 // Figure out the right navigation we want to use for data loading 2048 let loadingNavigation = overrideNavigation || getLoadingNavigation(location, submission); 2049 // If this was a redirect from an action we don't have a "submission" but 2050 // we have it on the loading navigation so use that if available 2051 let activeSubmission = submission || fetcherSubmission || getSubmissionFromNavigation(loadingNavigation); 2052 let routesToUse = inFlightDataRoutes || dataRoutes; 2053 let [matchesToLoad, revalidatingFetchers] = getMatchesToLoad(init.history, state, matches, activeSubmission, location, future.v7_partialHydration && initialHydration === true, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionData, pendingError); 2054 // Cancel pending deferreds for no-longer-matched routes or routes we're 2055 // about to reload. Note that if this is an action reload we would have 2056 // already cancelled all pending deferreds so this would be a no-op 2057 cancelActiveDeferreds(routeId => !(matches && matches.some(m => m.route.id === routeId)) || matchesToLoad && matchesToLoad.some(m => m.route.id === routeId)); 2058 pendingNavigationLoadId = ++incrementingLoadId; 2059 // Short circuit if we have no loaders to run 2060 if (matchesToLoad.length === 0 && revalidatingFetchers.length === 0) { 2061 let updatedFetchers = markFetchRedirectsDone(); 2062 completeNavigation(location, _extends({ 2063 matches, 2064 loaderData: {}, 2065 // Commit pending error if we're short circuiting 2066 errors: pendingError || null 2067 }, pendingActionData ? { 2068 actionData: pendingActionData 2069 } : {}, updatedFetchers ? { 2070 fetchers: new Map(state.fetchers) 2071 } : {}), { 2072 flushSync 2073 }); 2074 return { 2075 shortCircuited: true 2076 }; 2077 } 2078 // If this is an uninterrupted revalidation, we remain in our current idle 2079 // state. If not, we need to switch to our loading state and load data, 2080 // preserving any new action data or existing action data (in the case of 2081 // a revalidation interrupting an actionReload) 2082 // If we have partialHydration enabled, then don't update the state for the 2083 // initial data load since iot's not a "navigation" 2084 if (!isUninterruptedRevalidation && (!future.v7_partialHydration || !initialHydration)) { 2085 revalidatingFetchers.forEach(rf => { 2086 let fetcher = state.fetchers.get(rf.key); 2087 let revalidatingFetcher = getLoadingFetcher(undefined, fetcher ? fetcher.data : undefined); 2088 state.fetchers.set(rf.key, revalidatingFetcher); 2089 }); 2090 let actionData = pendingActionData || state.actionData; 2091 updateState(_extends({ 2092 navigation: loadingNavigation 2093 }, actionData ? Object.keys(actionData).length === 0 ? { 2094 actionData: null 2095 } : { 2096 actionData 2097 } : {}, revalidatingFetchers.length > 0 ? { 2098 fetchers: new Map(state.fetchers) 2099 } : {}), { 2100 flushSync 2101 }); 2102 } 2103 revalidatingFetchers.forEach(rf => { 2104 if (fetchControllers.has(rf.key)) { 2105 abortFetcher(rf.key); 2106 } 2107 if (rf.controller) { 2108 // Fetchers use an independent AbortController so that aborting a fetcher 2109 // (via deleteFetcher) does not abort the triggering navigation that 2110 // triggered the revalidation 2111 fetchControllers.set(rf.key, rf.controller); 2112 } 2113 }); 2114 // Proxy navigation abort through to revalidation fetchers 2115 let abortPendingFetchRevalidations = () => revalidatingFetchers.forEach(f => abortFetcher(f.key)); 2116 if (pendingNavigationController) { 2117 pendingNavigationController.signal.addEventListener("abort", abortPendingFetchRevalidations); 2118 } 2119 let { 2120 results, 2121 loaderResults, 2122 fetcherResults 2123 } = await callLoadersAndMaybeResolveData(state.matches, matches, matchesToLoad, revalidatingFetchers, request); 2124 if (request.signal.aborted) { 2125 return { 2126 shortCircuited: true 2127 }; 2128 } 2129 // Clean up _after_ loaders have completed. Don't clean up if we short 2130 // circuited because fetchControllers would have been aborted and 2131 // reassigned to new controllers for the next navigation 2132 if (pendingNavigationController) { 2133 pendingNavigationController.signal.removeEventListener("abort", abortPendingFetchRevalidations); 2134 } 2135 revalidatingFetchers.forEach(rf => fetchControllers.delete(rf.key)); 2136 // If any loaders returned a redirect Response, start a new REPLACE navigation 2137 let redirect = findRedirect(results); 2138 if (redirect) { 2139 if (redirect.idx >= matchesToLoad.length) { 2140 // If this redirect came from a fetcher make sure we mark it in 2141 // fetchRedirectIds so it doesn't get revalidated on the next set of 2142 // loader executions 2143 let fetcherKey = revalidatingFetchers[redirect.idx - matchesToLoad.length].key; 2144 fetchRedirectIds.add(fetcherKey); 2145 } 2146 await startRedirectNavigation(state, redirect.result, { 2147 replace 2148 }); 2149 return { 2150 shortCircuited: true 2151 }; 2152 } 2153 // Process and commit output from loaders 2154 let { 2155 loaderData, 2156 errors 2157 } = processLoaderData(state, matches, matchesToLoad, loaderResults, pendingError, revalidatingFetchers, fetcherResults, activeDeferreds); 2158 // Wire up subscribers to update loaderData as promises settle 2159 activeDeferreds.forEach((deferredData, routeId) => { 2160 deferredData.subscribe(aborted => { 2161 // Note: No need to updateState here since the TrackedPromise on 2162 // loaderData is stable across resolve/reject 2163 // Remove this instance if we were aborted or if promises have settled 2164 if (aborted || deferredData.done) { 2165 activeDeferreds.delete(routeId); 2166 } 2167 }); 2168 }); 2169 let updatedFetchers = markFetchRedirectsDone(); 2170 let didAbortFetchLoads = abortStaleFetchLoads(pendingNavigationLoadId); 2171 let shouldUpdateFetchers = updatedFetchers || didAbortFetchLoads || revalidatingFetchers.length > 0; 2172 return _extends({ 2173 loaderData, 2174 errors 2175 }, shouldUpdateFetchers ? { 2176 fetchers: new Map(state.fetchers) 2177 } : {}); 2178 } 2179 // Trigger a fetcher load/submit for the given fetcher key 2180 function fetch(key, routeId, href, opts) { 2181 if (isServer) { 2182 throw new Error("router.fetch() was called during the server render, but it shouldn't be. " + "You are likely calling a useFetcher() method in the body of your component. " + "Try moving it to a useEffect or a callback."); 2183 } 2184 if (fetchControllers.has(key)) abortFetcher(key); 2185 let flushSync = (opts && opts.unstable_flushSync) === true; 2186 let routesToUse = inFlightDataRoutes || dataRoutes; 2187 let normalizedPath = normalizeTo(state.location, state.matches, basename, future.v7_prependBasename, href, future.v7_relativeSplatPath, routeId, opts == null ? void 0 : opts.relative); 2188 let matches = matchRoutes(routesToUse, normalizedPath, basename); 2189 if (!matches) { 2190 setFetcherError(key, routeId, getInternalRouterError(404, { 2191 pathname: normalizedPath 2192 }), { 2193 flushSync 2194 }); 2195 return; 2196 } 2197 let { 2198 path, 2199 submission, 2200 error 2201 } = normalizeNavigateOptions(future.v7_normalizeFormMethod, true, normalizedPath, opts); 2202 if (error) { 2203 setFetcherError(key, routeId, error, { 2204 flushSync 2205 }); 2206 return; 2207 } 2208 let match = getTargetMatch(matches, path); 2209 pendingPreventScrollReset = (opts && opts.preventScrollReset) === true; 2210 if (submission && isMutationMethod(submission.formMethod)) { 2211 handleFetcherAction(key, routeId, path, match, matches, flushSync, submission); 2212 return; 2213 } 2214 // Store off the match so we can call it's shouldRevalidate on subsequent 2215 // revalidations 2216 fetchLoadMatches.set(key, { 2217 routeId, 2218 path 2219 }); 2220 handleFetcherLoader(key, routeId, path, match, matches, flushSync, submission); 2221 } 2222 // Call the action for the matched fetcher.submit(), and then handle redirects, 2223 // errors, and revalidation 2224 async function handleFetcherAction(key, routeId, path, match, requestMatches, flushSync, submission) { 2225 interruptActiveLoads(); 2226 fetchLoadMatches.delete(key); 2227 if (!match.route.action && !match.route.lazy) { 2228 let error = getInternalRouterError(405, { 2229 method: submission.formMethod, 2230 pathname: path, 2231 routeId: routeId 2232 }); 2233 setFetcherError(key, routeId, error, { 2234 flushSync 2235 }); 2236 return; 2237 } 2238 // Put this fetcher into it's submitting state 2239 let existingFetcher = state.fetchers.get(key); 2240 updateFetcherState(key, getSubmittingFetcher(submission, existingFetcher), { 2241 flushSync 2242 }); 2243 // Call the action for the fetcher 2244 let abortController = new AbortController(); 2245 let fetchRequest = createClientSideRequest(init.history, path, abortController.signal, submission); 2246 fetchControllers.set(key, abortController); 2247 let originatingLoadId = incrementingLoadId; 2248 let actionResult = await callLoaderOrAction("action", fetchRequest, match, requestMatches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath); 2249 if (fetchRequest.signal.aborted) { 2250 // We can delete this so long as we weren't aborted by our own fetcher 2251 // re-submit which would have put _new_ controller is in fetchControllers 2252 if (fetchControllers.get(key) === abortController) { 2253 fetchControllers.delete(key); 2254 } 2255 return; 2256 } 2257 // When using v7_fetcherPersist, we don't want errors bubbling up to the UI 2258 // or redirects processed for unmounted fetchers so we just revert them to 2259 // idle 2260 if (future.v7_fetcherPersist && deletedFetchers.has(key)) { 2261 if (isRedirectResult(actionResult) || isErrorResult(actionResult)) { 2262 updateFetcherState(key, getDoneFetcher(undefined)); 2263 return; 2264 } 2265 // Let SuccessResult's fall through for revalidation 2266 } else { 2267 if (isRedirectResult(actionResult)) { 2268 fetchControllers.delete(key); 2269 if (pendingNavigationLoadId > originatingLoadId) { 2270 // A new navigation was kicked off after our action started, so that 2271 // should take precedence over this redirect navigation. We already 2272 // set isRevalidationRequired so all loaders for the new route should 2273 // fire unless opted out via shouldRevalidate 2274 updateFetcherState(key, getDoneFetcher(undefined)); 2275 return; 2276 } else { 2277 fetchRedirectIds.add(key); 2278 updateFetcherState(key, getLoadingFetcher(submission)); 2279 return startRedirectNavigation(state, actionResult, { 2280 fetcherSubmission: submission 2281 }); 2282 } 2283 } 2284 // Process any non-redirect errors thrown 2285 if (isErrorResult(actionResult)) { 2286 setFetcherError(key, routeId, actionResult.error); 2287 return; 2288 } 2289 } 2290 if (isDeferredResult(actionResult)) { 2291 throw getInternalRouterError(400, { 2292 type: "defer-action" 2293 }); 2294 } 2295 // Start the data load for current matches, or the next location if we're 2296 // in the middle of a navigation 2297 let nextLocation = state.navigation.location || state.location; 2298 let revalidationRequest = createClientSideRequest(init.history, nextLocation, abortController.signal); 2299 let routesToUse = inFlightDataRoutes || dataRoutes; 2300 let matches = state.navigation.state !== "idle" ? matchRoutes(routesToUse, state.navigation.location, basename) : state.matches; 2301 invariant(matches, "Didn't find any matches after fetcher action"); 2302 let loadId = ++incrementingLoadId; 2303 fetchReloadIds.set(key, loadId); 2304 let loadFetcher = getLoadingFetcher(submission, actionResult.data); 2305 state.fetchers.set(key, loadFetcher); 2306 let [matchesToLoad, revalidatingFetchers] = getMatchesToLoad(init.history, state, matches, submission, nextLocation, false, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, { 2307 [match.route.id]: actionResult.data 2308 }, undefined // No need to send through errors since we short circuit above 2309 ); 2310 // Put all revalidating fetchers into the loading state, except for the 2311 // current fetcher which we want to keep in it's current loading state which 2312 // contains it's action submission info + action data 2313 revalidatingFetchers.filter(rf => rf.key !== key).forEach(rf => { 2314 let staleKey = rf.key; 2315 let existingFetcher = state.fetchers.get(staleKey); 2316 let revalidatingFetcher = getLoadingFetcher(undefined, existingFetcher ? existingFetcher.data : undefined); 2317 state.fetchers.set(staleKey, revalidatingFetcher); 2318 if (fetchControllers.has(staleKey)) { 2319 abortFetcher(staleKey); 2320 } 2321 if (rf.controller) { 2322 fetchControllers.set(staleKey, rf.controller); 2323 } 2324 }); 2325 updateState({ 2326 fetchers: new Map(state.fetchers) 2327 }); 2328 let abortPendingFetchRevalidations = () => revalidatingFetchers.forEach(rf => abortFetcher(rf.key)); 2329 abortController.signal.addEventListener("abort", abortPendingFetchRevalidations); 2330 let { 2331 results, 2332 loaderResults, 2333 fetcherResults 2334 } = await callLoadersAndMaybeResolveData(state.matches, matches, matchesToLoad, revalidatingFetchers, revalidationRequest); 2335 if (abortController.signal.aborted) { 2336 return; 2337 } 2338 abortController.signal.removeEventListener("abort", abortPendingFetchRevalidations); 2339 fetchReloadIds.delete(key); 2340 fetchControllers.delete(key); 2341 revalidatingFetchers.forEach(r => fetchControllers.delete(r.key)); 2342 let redirect = findRedirect(results); 2343 if (redirect) { 2344 if (redirect.idx >= matchesToLoad.length) { 2345 // If this redirect came from a fetcher make sure we mark it in 2346 // fetchRedirectIds so it doesn't get revalidated on the next set of 2347 // loader executions 2348 let fetcherKey = revalidatingFetchers[redirect.idx - matchesToLoad.length].key; 2349 fetchRedirectIds.add(fetcherKey); 2350 } 2351 return startRedirectNavigation(state, redirect.result); 2352 } 2353 // Process and commit output from loaders 2354 let { 2355 loaderData, 2356 errors 2357 } = processLoaderData(state, state.matches, matchesToLoad, loaderResults, undefined, revalidatingFetchers, fetcherResults, activeDeferreds); 2358 // Since we let revalidations complete even if the submitting fetcher was 2359 // deleted, only put it back to idle if it hasn't been deleted 2360 if (state.fetchers.has(key)) { 2361 let doneFetcher = getDoneFetcher(actionResult.data); 2362 state.fetchers.set(key, doneFetcher); 2363 } 2364 abortStaleFetchLoads(loadId); 2365 // If we are currently in a navigation loading state and this fetcher is 2366 // more recent than the navigation, we want the newer data so abort the 2367 // navigation and complete it with the fetcher data 2368 if (state.navigation.state === "loading" && loadId > pendingNavigationLoadId) { 2369 invariant(pendingAction, "Expected pending action"); 2370 pendingNavigationController && pendingNavigationController.abort(); 2371 completeNavigation(state.navigation.location, { 2372 matches, 2373 loaderData, 2374 errors, 2375 fetchers: new Map(state.fetchers) 2376 }); 2377 } else { 2378 // otherwise just update with the fetcher data, preserving any existing 2379 // loaderData for loaders that did not need to reload. We have to 2380 // manually merge here since we aren't going through completeNavigation 2381 updateState({ 2382 errors, 2383 loaderData: mergeLoaderData(state.loaderData, loaderData, matches, errors), 2384 fetchers: new Map(state.fetchers) 2385 }); 2386 isRevalidationRequired = false; 2387 } 2388 } 2389 // Call the matched loader for fetcher.load(), handling redirects, errors, etc. 2390 async function handleFetcherLoader(key, routeId, path, match, matches, flushSync, submission) { 2391 let existingFetcher = state.fetchers.get(key); 2392 updateFetcherState(key, getLoadingFetcher(submission, existingFetcher ? existingFetcher.data : undefined), { 2393 flushSync 2394 }); 2395 // Call the loader for this fetcher route match 2396 let abortController = new AbortController(); 2397 let fetchRequest = createClientSideRequest(init.history, path, abortController.signal); 2398 fetchControllers.set(key, abortController); 2399 let originatingLoadId = incrementingLoadId; 2400 let result = await callLoaderOrAction("loader", fetchRequest, match, matches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath); 2401 // Deferred isn't supported for fetcher loads, await everything and treat it 2402 // as a normal load. resolveDeferredData will return undefined if this 2403 // fetcher gets aborted, so we just leave result untouched and short circuit 2404 // below if that happens 2405 if (isDeferredResult(result)) { 2406 result = (await resolveDeferredData(result, fetchRequest.signal, true)) || result; 2407 } 2408 // We can delete this so long as we weren't aborted by our our own fetcher 2409 // re-load which would have put _new_ controller is in fetchControllers 2410 if (fetchControllers.get(key) === abortController) { 2411 fetchControllers.delete(key); 2412 } 2413 if (fetchRequest.signal.aborted) { 2414 return; 2415 } 2416 // We don't want errors bubbling up or redirects followed for unmounted 2417 // fetchers, so short circuit here if it was removed from the UI 2418 if (deletedFetchers.has(key)) { 2419 updateFetcherState(key, getDoneFetcher(undefined)); 2420 return; 2421 } 2422 // If the loader threw a redirect Response, start a new REPLACE navigation 2423 if (isRedirectResult(result)) { 2424 if (pendingNavigationLoadId > originatingLoadId) { 2425 // A new navigation was kicked off after our loader started, so that 2426 // should take precedence over this redirect navigation 2427 updateFetcherState(key, getDoneFetcher(undefined)); 2428 return; 2429 } else { 2430 fetchRedirectIds.add(key); 2431 await startRedirectNavigation(state, result); 2432 return; 2433 } 2434 } 2435 // Process any non-redirect errors thrown 2436 if (isErrorResult(result)) { 2437 setFetcherError(key, routeId, result.error); 2438 return; 2439 } 2440 invariant(!isDeferredResult(result), "Unhandled fetcher deferred data"); 2441 // Put the fetcher back into an idle state 2442 updateFetcherState(key, getDoneFetcher(result.data)); 2443 } 2444 /** 2445 * Utility function to handle redirects returned from an action or loader. 2446 * Normally, a redirect "replaces" the navigation that triggered it. So, for 2447 * example: 2448 * 2449 * - user is on /a 2450 * - user clicks a link to /b 2451 * - loader for /b redirects to /c 2452 * 2453 * In a non-JS app the browser would track the in-flight navigation to /b and 2454 * then replace it with /c when it encountered the redirect response. In 2455 * the end it would only ever update the URL bar with /c. 2456 * 2457 * In client-side routing using pushState/replaceState, we aim to emulate 2458 * this behavior and we also do not update history until the end of the 2459 * navigation (including processed redirects). This means that we never 2460 * actually touch history until we've processed redirects, so we just use 2461 * the history action from the original navigation (PUSH or REPLACE). 2462 */ 2463 async function startRedirectNavigation(state, redirect, _temp2) { 2464 let { 2465 submission, 2466 fetcherSubmission, 2467 replace 2468 } = _temp2 === void 0 ? {} : _temp2; 2469 if (redirect.revalidate) { 2470 isRevalidationRequired = true; 2471 } 2472 let redirectLocation = createLocation(state.location, redirect.location, { 2473 _isRedirect: true 2474 }); 2475 invariant(redirectLocation, "Expected a location on the redirect navigation"); 2476 if (isBrowser) { 2477 let isDocumentReload = false; 2478 if (redirect.reloadDocument) { 2479 // Hard reload if the response contained X-Remix-Reload-Document 2480 isDocumentReload = true; 2481 } else if (ABSOLUTE_URL_REGEX.test(redirect.location)) { 2482 const url = init.history.createURL(redirect.location); 2483 isDocumentReload = 2484 // Hard reload if it's an absolute URL to a new origin 2485 url.origin !== routerWindow.location.origin || 2486 // Hard reload if it's an absolute URL that does not match our basename 2487 stripBasename(url.pathname, basename) == null; 2488 } 2489 if (isDocumentReload) { 2490 if (replace) { 2491 routerWindow.location.replace(redirect.location); 2492 } else { 2493 routerWindow.location.assign(redirect.location); 2494 } 2495 return; 2496 } 2497 } 2498 // There's no need to abort on redirects, since we don't detect the 2499 // redirect until the action/loaders have settled 2500 pendingNavigationController = null; 2501 let redirectHistoryAction = replace === true ? Action.Replace : Action.Push; 2502 // Use the incoming submission if provided, fallback on the active one in 2503 // state.navigation 2504 let { 2505 formMethod, 2506 formAction, 2507 formEncType 2508 } = state.navigation; 2509 if (!submission && !fetcherSubmission && formMethod && formAction && formEncType) { 2510 submission = getSubmissionFromNavigation(state.navigation); 2511 } 2512 // If this was a 307/308 submission we want to preserve the HTTP method and 2513 // re-submit the GET/POST/PUT/PATCH/DELETE as a submission navigation to the 2514 // redirected location 2515 let activeSubmission = submission || fetcherSubmission; 2516 if (redirectPreserveMethodStatusCodes.has(redirect.status) && activeSubmission && isMutationMethod(activeSubmission.formMethod)) { 2517 await startNavigation(redirectHistoryAction, redirectLocation, { 2518 submission: _extends({}, activeSubmission, { 2519 formAction: redirect.location 2520 }), 2521 // Preserve this flag across redirects 2522 preventScrollReset: pendingPreventScrollReset 2523 }); 2524 } else { 2525 // If we have a navigation submission, we will preserve it through the 2526 // redirect navigation 2527 let overrideNavigation = getLoadingNavigation(redirectLocation, submission); 2528 await startNavigation(redirectHistoryAction, redirectLocation, { 2529 overrideNavigation, 2530 // Send fetcher submissions through for shouldRevalidate 2531 fetcherSubmission, 2532 // Preserve this flag across redirects 2533 preventScrollReset: pendingPreventScrollReset 2534 }); 2535 } 2536 } 2537 async function callLoadersAndMaybeResolveData(currentMatches, matches, matchesToLoad, fetchersToLoad, request) { 2538 // Call all navigation loaders and revalidating fetcher loaders in parallel, 2539 // then slice off the results into separate arrays so we can handle them 2540 // accordingly 2541 let results = await Promise.all([...matchesToLoad.map(match => callLoaderOrAction("loader", request, match, matches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath)), ...fetchersToLoad.map(f => { 2542 if (f.matches && f.match && f.controller) { 2543 return callLoaderOrAction("loader", createClientSideRequest(init.history, f.path, f.controller.signal), f.match, f.matches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath); 2544 } else { 2545 let error = { 2546 type: ResultType.error, 2547 error: getInternalRouterError(404, { 2548 pathname: f.path 2549 }) 2550 }; 2551 return error; 2552 } 2553 })]); 2554 let loaderResults = results.slice(0, matchesToLoad.length); 2555 let fetcherResults = results.slice(matchesToLoad.length); 2556 await Promise.all([resolveDeferredResults(currentMatches, matchesToLoad, loaderResults, loaderResults.map(() => request.signal), false, state.loaderData), resolveDeferredResults(currentMatches, fetchersToLoad.map(f => f.match), fetcherResults, fetchersToLoad.map(f => f.controller ? f.controller.signal : null), true)]); 2557 return { 2558 results, 2559 loaderResults, 2560 fetcherResults 2561 }; 2562 } 2563 function interruptActiveLoads() { 2564 // Every interruption triggers a revalidation 2565 isRevalidationRequired = true; 2566 // Cancel pending route-level deferreds and mark cancelled routes for 2567 // revalidation 2568 cancelledDeferredRoutes.push(...cancelActiveDeferreds()); 2569 // Abort in-flight fetcher loads 2570 fetchLoadMatches.forEach((_, key) => { 2571 if (fetchControllers.has(key)) { 2572 cancelledFetcherLoads.push(key); 2573 abortFetcher(key); 2574 } 2575 }); 2576 } 2577 function updateFetcherState(key, fetcher, opts) { 2578 if (opts === void 0) { 2579 opts = {}; 2580 } 2581 state.fetchers.set(key, fetcher); 2582 updateState({ 2583 fetchers: new Map(state.fetchers) 2584 }, { 2585 flushSync: (opts && opts.flushSync) === true 2586 }); 2587 } 2588 function setFetcherError(key, routeId, error, opts) { 2589 if (opts === void 0) { 2590 opts = {}; 2591 } 2592 let boundaryMatch = findNearestBoundary(state.matches, routeId); 2593 deleteFetcher(key); 2594 updateState({ 2595 errors: { 2596 [boundaryMatch.route.id]: error 2597 }, 2598 fetchers: new Map(state.fetchers) 2599 }, { 2600 flushSync: (opts && opts.flushSync) === true 2601 }); 2602 } 2603 function getFetcher(key) { 2604 if (future.v7_fetcherPersist) { 2605 activeFetchers.set(key, (activeFetchers.get(key) || 0) + 1); 2606 // If this fetcher was previously marked for deletion, unmark it since we 2607 // have a new instance 2608 if (deletedFetchers.has(key)) { 2609 deletedFetchers.delete(key); 2610 } 2611 } 2612 return state.fetchers.get(key) || IDLE_FETCHER; 2613 } 2614 function deleteFetcher(key) { 2615 let fetcher = state.fetchers.get(key); 2616 // Don't abort the controller if this is a deletion of a fetcher.submit() 2617 // in it's loading phase since - we don't want to abort the corresponding 2618 // revalidation and want them to complete and land 2619 if (fetchControllers.has(key) && !(fetcher && fetcher.state === "loading" && fetchReloadIds.has(key))) { 2620 abortFetcher(key); 2621 } 2622 fetchLoadMatches.delete(key); 2623 fetchReloadIds.delete(key); 2624 fetchRedirectIds.delete(key); 2625 deletedFetchers.delete(key); 2626 state.fetchers.delete(key); 2627 } 2628 function deleteFetcherAndUpdateState(key) { 2629 if (future.v7_fetcherPersist) { 2630 let count = (activeFetchers.get(key) || 0) - 1; 2631 if (count <= 0) { 2632 activeFetchers.delete(key); 2633 deletedFetchers.add(key); 2634 } else { 2635 activeFetchers.set(key, count); 2636 } 2637 } else { 2638 deleteFetcher(key); 2639 } 2640 updateState({ 2641 fetchers: new Map(state.fetchers) 2642 }); 2643 } 2644 function abortFetcher(key) { 2645 let controller = fetchControllers.get(key); 2646 invariant(controller, "Expected fetch controller: " + key); 2647 controller.abort(); 2648 fetchControllers.delete(key); 2649 } 2650 function markFetchersDone(keys) { 2651 for (let key of keys) { 2652 let fetcher = getFetcher(key); 2653 let doneFetcher = getDoneFetcher(fetcher.data); 2654 state.fetchers.set(key, doneFetcher); 2655 } 2656 } 2657 function markFetchRedirectsDone() { 2658 let doneKeys = []; 2659 let updatedFetchers = false; 2660 for (let key of fetchRedirectIds) { 2661 let fetcher = state.fetchers.get(key); 2662 invariant(fetcher, "Expected fetcher: " + key); 2663 if (fetcher.state === "loading") { 2664 fetchRedirectIds.delete(key); 2665 doneKeys.push(key); 2666 updatedFetchers = true; 2667 } 2668 } 2669 markFetchersDone(doneKeys); 2670 return updatedFetchers; 2671 } 2672 function abortStaleFetchLoads(landedId) { 2673 let yeetedKeys = []; 2674 for (let [key, id] of fetchReloadIds) { 2675 if (id < landedId) { 2676 let fetcher = state.fetchers.get(key); 2677 invariant(fetcher, "Expected fetcher: " + key); 2678 if (fetcher.state === "loading") { 2679 abortFetcher(key); 2680 fetchReloadIds.delete(key); 2681 yeetedKeys.push(key); 2682 } 2683 } 2684 } 2685 markFetchersDone(yeetedKeys); 2686 return yeetedKeys.length > 0; 2687 } 2688 function getBlocker(key, fn) { 2689 let blocker = state.blockers.get(key) || IDLE_BLOCKER; 2690 if (blockerFunctions.get(key) !== fn) { 2691 blockerFunctions.set(key, fn); 2692 } 2693 return blocker; 2694 } 2695 function deleteBlocker(key) { 2696 state.blockers.delete(key); 2697 blockerFunctions.delete(key); 2698 } 2699 // Utility function to update blockers, ensuring valid state transitions 2700 function updateBlocker(key, newBlocker) { 2701 let blocker = state.blockers.get(key) || IDLE_BLOCKER; 2702 // Poor mans state machine :) 2703 // https://mermaid.live/edit#pako:eNqVkc9OwzAMxl8l8nnjAYrEtDIOHEBIgwvKJTReGy3_lDpIqO27k6awMG0XcrLlnz87nwdonESogKXXBuE79rq75XZO3-yHds0RJVuv70YrPlUrCEe2HfrORS3rubqZfuhtpg5C9wk5tZ4VKcRUq88q9Z8RS0-48cE1iHJkL0ugbHuFLus9L6spZy8nX9MP2CNdomVaposqu3fGayT8T8-jJQwhepo_UtpgBQaDEUom04dZhAN1aJBDlUKJBxE1ceB2Smj0Mln-IBW5AFU2dwUiktt_2Qaq2dBfaKdEup85UV7Yd-dKjlnkabl2Pvr0DTkTreM 2704 invariant(blocker.state === "unblocked" && newBlocker.state === "blocked" || blocker.state === "blocked" && newBlocker.state === "blocked" || blocker.state === "blocked" && newBlocker.state === "proceeding" || blocker.state === "blocked" && newBlocker.state === "unblocked" || blocker.state === "proceeding" && newBlocker.state === "unblocked", "Invalid blocker state transition: " + blocker.state + " -> " + newBlocker.state); 2705 let blockers = new Map(state.blockers); 2706 blockers.set(key, newBlocker); 2707 updateState({ 2708 blockers 2709 }); 2710 } 2711 function shouldBlockNavigation(_ref2) { 2712 let { 2713 currentLocation, 2714 nextLocation, 2715 historyAction 2716 } = _ref2; 2717 if (blockerFunctions.size === 0) { 2718 return; 2719 } 2720 // We ony support a single active blocker at the moment since we don't have 2721 // any compelling use cases for multi-blocker yet 2722 if (blockerFunctions.size > 1) { 2723 warning(false, "A router only supports one blocker at a time"); 2724 } 2725 let entries = Array.from(blockerFunctions.entries()); 2726 let [blockerKey, blockerFunction] = entries[entries.length - 1]; 2727 let blocker = state.blockers.get(blockerKey); 2728 if (blocker && blocker.state === "proceeding") { 2729 // If the blocker is currently proceeding, we don't need to re-check 2730 // it and can let this navigation continue 2731 return; 2732 } 2733 // At this point, we know we're unblocked/blocked so we need to check the 2734 // user-provided blocker function 2735 if (blockerFunction({ 2736 currentLocation, 2737 nextLocation, 2738 historyAction 2739 })) { 2740 return blockerKey; 2741 } 2742 } 2743 function cancelActiveDeferreds(predicate) { 2744 let cancelledRouteIds = []; 2745 activeDeferreds.forEach((dfd, routeId) => { 2746 if (!predicate || predicate(routeId)) { 2747 // Cancel the deferred - but do not remove from activeDeferreds here - 2748 // we rely on the subscribers to do that so our tests can assert proper 2749 // cleanup via _internalActiveDeferreds 2750 dfd.cancel(); 2751 cancelledRouteIds.push(routeId); 2752 activeDeferreds.delete(routeId); 2753 } 2754 }); 2755 return cancelledRouteIds; 2756 } 2757 // Opt in to capturing and reporting scroll positions during navigations, 2758 // used by the <ScrollRestoration> component 2759 function enableScrollRestoration(positions, getPosition, getKey) { 2760 savedScrollPositions = positions; 2761 getScrollPosition = getPosition; 2762 getScrollRestorationKey = getKey || null; 2763 // Perform initial hydration scroll restoration, since we miss the boat on 2764 // the initial updateState() because we've not yet rendered <ScrollRestoration/> 2765 // and therefore have no savedScrollPositions available 2766 if (!initialScrollRestored && state.navigation === IDLE_NAVIGATION) { 2767 initialScrollRestored = true; 2768 let y = getSavedScrollPosition(state.location, state.matches); 2769 if (y != null) { 2770 updateState({ 2771 restoreScrollPosition: y 2772 }); 2773 } 2774 } 2775 return () => { 2776 savedScrollPositions = null; 2777 getScrollPosition = null; 2778 getScrollRestorationKey = null; 2779 }; 2780 } 2781 function getScrollKey(location, matches) { 2782 if (getScrollRestorationKey) { 2783 let key = getScrollRestorationKey(location, matches.map(m => convertRouteMatchToUiMatch(m, state.loaderData))); 2784 return key || location.key; 2785 } 2786 return location.key; 2787 } 2788 function saveScrollPosition(location, matches) { 2789 if (savedScrollPositions && getScrollPosition) { 2790 let key = getScrollKey(location, matches); 2791 savedScrollPositions[key] = getScrollPosition(); 2792 } 2793 } 2794 function getSavedScrollPosition(location, matches) { 2795 if (savedScrollPositions) { 2796 let key = getScrollKey(location, matches); 2797 let y = savedScrollPositions[key]; 2798 if (typeof y === "number") { 2799 return y; 2800 } 2801 } 2802 return null; 2803 } 2804 function _internalSetRoutes(newRoutes) { 2805 manifest = {}; 2806 inFlightDataRoutes = convertRoutesToDataRoutes(newRoutes, mapRouteProperties, undefined, manifest); 2807 } 2808 router = { 2809 get basename() { 2810 return basename; 2811 }, 2812 get future() { 2813 return future; 2814 }, 2815 get state() { 2816 return state; 2817 }, 2818 get routes() { 2819 return dataRoutes; 2820 }, 2821 get window() { 2822 return routerWindow; 2823 }, 2824 initialize, 2825 subscribe, 2826 enableScrollRestoration, 2827 navigate, 2828 fetch, 2829 revalidate, 2830 // Passthrough to history-aware createHref used by useHref so we get proper 2831 // hash-aware URLs in DOM paths 2832 createHref: to => init.history.createHref(to), 2833 encodeLocation: to => init.history.encodeLocation(to), 2834 getFetcher, 2835 deleteFetcher: deleteFetcherAndUpdateState, 2836 dispose, 2837 getBlocker, 2838 deleteBlocker, 2839 _internalFetchControllers: fetchControllers, 2840 _internalActiveDeferreds: activeDeferreds, 2841 // TODO: Remove setRoutes, it's temporary to avoid dealing with 2842 // updating the tree while validating the update algorithm. 2843 _internalSetRoutes 2844 }; 2845 return router; 2846} 2847//#endregion 2848//////////////////////////////////////////////////////////////////////////////// 2849//#region createStaticHandler 2850//////////////////////////////////////////////////////////////////////////////// 2851const UNSAFE_DEFERRED_SYMBOL = Symbol("deferred"); 2852function createStaticHandler(routes, opts) { 2853 invariant(routes.length > 0, "You must provide a non-empty routes array to createStaticHandler"); 2854 let manifest = {}; 2855 let basename = (opts ? opts.basename : null) || "/"; 2856 let mapRouteProperties; 2857 if (opts != null && opts.mapRouteProperties) { 2858 mapRouteProperties = opts.mapRouteProperties; 2859 } else if (opts != null && opts.detectErrorBoundary) { 2860 // If they are still using the deprecated version, wrap it with the new API 2861 let detectErrorBoundary = opts.detectErrorBoundary; 2862 mapRouteProperties = route => ({ 2863 hasErrorBoundary: detectErrorBoundary(route) 2864 }); 2865 } else { 2866 mapRouteProperties = defaultMapRouteProperties; 2867 } 2868 // Config driven behavior flags 2869 let future = _extends({ 2870 v7_relativeSplatPath: false, 2871 v7_throwAbortReason: false 2872 }, opts ? opts.future : null); 2873 let dataRoutes = convertRoutesToDataRoutes(routes, mapRouteProperties, undefined, manifest); 2874 /** 2875 * The query() method is intended for document requests, in which we want to 2876 * call an optional action and potentially multiple loaders for all nested 2877 * routes. It returns a StaticHandlerContext object, which is very similar 2878 * to the router state (location, loaderData, actionData, errors, etc.) and 2879 * also adds SSR-specific information such as the statusCode and headers 2880 * from action/loaders Responses. 2881 * 2882 * It _should_ never throw and should report all errors through the 2883 * returned context.errors object, properly associating errors to their error 2884 * boundary. Additionally, it tracks _deepestRenderedBoundaryId which can be 2885 * used to emulate React error boundaries during SSr by performing a second 2886 * pass only down to the boundaryId. 2887 * 2888 * The one exception where we do not return a StaticHandlerContext is when a 2889 * redirect response is returned or thrown from any action/loader. We 2890 * propagate that out and return the raw Response so the HTTP server can 2891 * return it directly. 2892 */ 2893 async function query(request, _temp3) { 2894 let { 2895 requestContext 2896 } = _temp3 === void 0 ? {} : _temp3; 2897 let url = new URL(request.url); 2898 let method = request.method; 2899 let location = createLocation("", createPath(url), null, "default"); 2900 let matches = matchRoutes(dataRoutes, location, basename); 2901 // SSR supports HEAD requests while SPA doesn't 2902 if (!isValidMethod(method) && method !== "HEAD") { 2903 let error = getInternalRouterError(405, { 2904 method 2905 }); 2906 let { 2907 matches: methodNotAllowedMatches, 2908 route 2909 } = getShortCircuitMatches(dataRoutes); 2910 return { 2911 basename, 2912 location, 2913 matches: methodNotAllowedMatches, 2914 loaderData: {}, 2915 actionData: null, 2916 errors: { 2917 [route.id]: error 2918 }, 2919 statusCode: error.status, 2920 loaderHeaders: {}, 2921 actionHeaders: {}, 2922 activeDeferreds: null 2923 }; 2924 } else if (!matches) { 2925 let error = getInternalRouterError(404, { 2926 pathname: location.pathname 2927 }); 2928 let { 2929 matches: notFoundMatches, 2930 route 2931 } = getShortCircuitMatches(dataRoutes); 2932 return { 2933 basename, 2934 location, 2935 matches: notFoundMatches, 2936 loaderData: {}, 2937 actionData: null, 2938 errors: { 2939 [route.id]: error 2940 }, 2941 statusCode: error.status, 2942 loaderHeaders: {}, 2943 actionHeaders: {}, 2944 activeDeferreds: null 2945 }; 2946 } 2947 let result = await queryImpl(request, location, matches, requestContext); 2948 if (isResponse(result)) { 2949 return result; 2950 } 2951 // When returning StaticHandlerContext, we patch back in the location here 2952 // since we need it for React Context. But this helps keep our submit and 2953 // loadRouteData operating on a Request instead of a Location 2954 return _extends({ 2955 location, 2956 basename 2957 }, result); 2958 } 2959 /** 2960 * The queryRoute() method is intended for targeted route requests, either 2961 * for fetch ?_data requests or resource route requests. In this case, we 2962 * are only ever calling a single action or loader, and we are returning the 2963 * returned value directly. In most cases, this will be a Response returned 2964 * from the action/loader, but it may be a primitive or other value as well - 2965 * and in such cases the calling context should handle that accordingly. 2966 * 2967 * We do respect the throw/return differentiation, so if an action/loader 2968 * throws, then this method will throw the value. This is important so we 2969 * can do proper boundary identification in Remix where a thrown Response 2970 * must go to the Catch Boundary but a returned Response is happy-path. 2971 * 2972 * One thing to note is that any Router-initiated Errors that make sense 2973 * to associate with a status code will be thrown as an ErrorResponse 2974 * instance which include the raw Error, such that the calling context can 2975 * serialize the error as they see fit while including the proper response 2976 * code. Examples here are 404 and 405 errors that occur prior to reaching 2977 * any user-defined loaders. 2978 */ 2979 async function queryRoute(request, _temp4) { 2980 let { 2981 routeId, 2982 requestContext 2983 } = _temp4 === void 0 ? {} : _temp4; 2984 let url = new URL(request.url); 2985 let method = request.method; 2986 let location = createLocation("", createPath(url), null, "default"); 2987 let matches = matchRoutes(dataRoutes, location, basename); 2988 // SSR supports HEAD requests while SPA doesn't 2989 if (!isValidMethod(method) && method !== "HEAD" && method !== "OPTIONS") { 2990 throw getInternalRouterError(405, { 2991 method 2992 }); 2993 } else if (!matches) { 2994 throw getInternalRouterError(404, { 2995 pathname: location.pathname 2996 }); 2997 } 2998 let match = routeId ? matches.find(m => m.route.id === routeId) : getTargetMatch(matches, location); 2999 if (routeId && !match) { 3000 throw getInternalRouterError(403, { 3001 pathname: location.pathname, 3002 routeId 3003 }); 3004 } else if (!match) { 3005 // This should never hit I don't think? 3006 throw getInternalRouterError(404, { 3007 pathname: location.pathname 3008 }); 3009 } 3010 let result = await queryImpl(request, location, matches, requestContext, match); 3011 if (isResponse(result)) { 3012 return result; 3013 } 3014 let error = result.errors ? Object.values(result.errors)[0] : undefined; 3015 if (error !== undefined) { 3016 // If we got back result.errors, that means the loader/action threw 3017 // _something_ that wasn't a Response, but it's not guaranteed/required 3018 // to be an `instanceof Error` either, so we have to use throw here to 3019 // preserve the "error" state outside of queryImpl. 3020 throw error; 3021 } 3022 // Pick off the right state value to return 3023 if (result.actionData) { 3024 return Object.values(result.actionData)[0]; 3025 } 3026 if (result.loaderData) { 3027 var _result$activeDeferre; 3028 let data = Object.values(result.loaderData)[0]; 3029 if ((_result$activeDeferre = result.activeDeferreds) != null && _result$activeDeferre[match.route.id]) { 3030 data[UNSAFE_DEFERRED_SYMBOL] = result.activeDeferreds[match.route.id]; 3031 } 3032 return data; 3033 } 3034 return undefined; 3035 } 3036 async function queryImpl(request, location, matches, requestContext, routeMatch) { 3037 invariant(request.signal, "query()/queryRoute() requests must contain an AbortController signal"); 3038 try { 3039 if (isMutationMethod(request.method.toLowerCase())) { 3040 let result = await submit(request, matches, routeMatch || getTargetMatch(matches, location), requestContext, routeMatch != null); 3041 return result; 3042 } 3043 let result = await loadRouteData(request, matches, requestContext, routeMatch); 3044 return isResponse(result) ? result : _extends({}, result, { 3045 actionData: null, 3046 actionHeaders: {} 3047 }); 3048 } catch (e) { 3049 // If the user threw/returned a Response in callLoaderOrAction, we throw 3050 // it to bail out and then return or throw here based on whether the user 3051 // returned or threw 3052 if (isQueryRouteResponse(e)) { 3053 if (e.type === ResultType.error) { 3054 throw e.response; 3055 } 3056 return e.response; 3057 } 3058 // Redirects are always returned since they don't propagate to catch 3059 // boundaries 3060 if (isRedirectResponse(e)) { 3061 return e; 3062 } 3063 throw e; 3064 } 3065 } 3066 async function submit(request, matches, actionMatch, requestContext, isRouteRequest) { 3067 let result; 3068 if (!actionMatch.route.action && !actionMatch.route.lazy) { 3069 let error = getInternalRouterError(405, { 3070 method: request.method, 3071 pathname: new URL(request.url).pathname, 3072 routeId: actionMatch.route.id 3073 }); 3074 if (isRouteRequest) { 3075 throw error; 3076 } 3077 result = { 3078 type: ResultType.error, 3079 error 3080 }; 3081 } else { 3082 result = await callLoaderOrAction("action", request, actionMatch, matches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath, { 3083 isStaticRequest: true, 3084 isRouteRequest, 3085 requestContext 3086 }); 3087 if (request.signal.aborted) { 3088 throwStaticHandlerAbortedError(request, isRouteRequest, future); 3089 } 3090 } 3091 if (isRedirectResult(result)) { 3092 // Uhhhh - this should never happen, we should always throw these from 3093 // callLoaderOrAction, but the type narrowing here keeps TS happy and we 3094 // can get back on the "throw all redirect responses" train here should 3095 // this ever happen :/ 3096 throw new Response(null, { 3097 status: result.status, 3098 headers: { 3099 Location: result.location 3100 } 3101 }); 3102 } 3103 if (isDeferredResult(result)) { 3104 let error = getInternalRouterError(400, { 3105 type: "defer-action" 3106 }); 3107 if (isRouteRequest) { 3108 throw error; 3109 } 3110 result = { 3111 type: ResultType.error, 3112 error 3113 }; 3114 } 3115 if (isRouteRequest) { 3116 // Note: This should only be non-Response values if we get here, since 3117 // isRouteRequest should throw any Response received in callLoaderOrAction 3118 if (isErrorResult(result)) { 3119 throw result.error; 3120 } 3121 return { 3122 matches: [actionMatch], 3123 loaderData: {}, 3124 actionData: { 3125 [actionMatch.route.id]: result.data 3126 }, 3127 errors: null, 3128 // Note: statusCode + headers are unused here since queryRoute will 3129 // return the raw Response or value 3130 statusCode: 200, 3131 loaderHeaders: {}, 3132 actionHeaders: {}, 3133 activeDeferreds: null 3134 }; 3135 } 3136 if (isErrorResult(result)) { 3137 // Store off the pending error - we use it to determine which loaders 3138 // to call and will commit it when we complete the navigation 3139 let boundaryMatch = findNearestBoundary(matches, actionMatch.route.id); 3140 let context = await loadRouteData(request, matches, requestContext, undefined, { 3141 [boundaryMatch.route.id]: result.error 3142 }); 3143 // action status codes take precedence over loader status codes 3144 return _extends({}, context, { 3145 statusCode: isRouteErrorResponse(result.error) ? result.error.status : 500, 3146 actionData: null, 3147 actionHeaders: _extends({}, result.headers ? { 3148 [actionMatch.route.id]: result.headers 3149 } : {}) 3150 }); 3151 } 3152 // Create a GET request for the loaders 3153 let loaderRequest = new Request(request.url, { 3154 headers: request.headers, 3155 redirect: request.redirect, 3156 signal: request.signal 3157 }); 3158 let context = await loadRouteData(loaderRequest, matches, requestContext); 3159 return _extends({}, context, result.statusCode ? { 3160 statusCode: result.statusCode 3161 } : {}, { 3162 actionData: { 3163 [actionMatch.route.id]: result.data 3164 }, 3165 actionHeaders: _extends({}, result.headers ? { 3166 [actionMatch.route.id]: result.headers 3167 } : {}) 3168 }); 3169 } 3170 async function loadRouteData(request, matches, requestContext, routeMatch, pendingActionError) { 3171 let isRouteRequest = routeMatch != null; 3172 // Short circuit if we have no loaders to run (queryRoute()) 3173 if (isRouteRequest && !(routeMatch != null && routeMatch.route.loader) && !(routeMatch != null && routeMatch.route.lazy)) { 3174 throw getInternalRouterError(400, { 3175 method: request.method, 3176 pathname: new URL(request.url).pathname, 3177 routeId: routeMatch == null ? void 0 : routeMatch.route.id 3178 }); 3179 } 3180 let requestMatches = routeMatch ? [routeMatch] : getLoaderMatchesUntilBoundary(matches, Object.keys(pendingActionError || {})[0]); 3181 let matchesToLoad = requestMatches.filter(m => m.route.loader || m.route.lazy); 3182 // Short circuit if we have no loaders to run (query()) 3183 if (matchesToLoad.length === 0) { 3184 return { 3185 matches, 3186 // Add a null for all matched routes for proper revalidation on the client 3187 loaderData: matches.reduce((acc, m) => Object.assign(acc, { 3188 [m.route.id]: null 3189 }), {}), 3190 errors: pendingActionError || null, 3191 statusCode: 200, 3192 loaderHeaders: {}, 3193 activeDeferreds: null 3194 }; 3195 } 3196 let results = await Promise.all([...matchesToLoad.map(match => callLoaderOrAction("loader", request, match, matches, manifest, mapRouteProperties, basename, future.v7_relativeSplatPath, { 3197 isStaticRequest: true, 3198 isRouteRequest, 3199 requestContext 3200 }))]); 3201 if (request.signal.aborted) { 3202 throwStaticHandlerAbortedError(request, isRouteRequest, future); 3203 } 3204 // Process and commit output from loaders 3205 let activeDeferreds = new Map(); 3206 let context = processRouteLoaderData(matches, matchesToLoad, results, pendingActionError, activeDeferreds); 3207 // Add a null for any non-loader matches for proper revalidation on the client 3208 let executedLoaders = new Set(matchesToLoad.map(match => match.route.id)); 3209 matches.forEach(match => { 3210 if (!executedLoaders.has(match.route.id)) { 3211 context.loaderData[match.route.id] = null; 3212 } 3213 }); 3214 return _extends({}, context, { 3215 matches, 3216 activeDeferreds: activeDeferreds.size > 0 ? Object.fromEntries(activeDeferreds.entries()) : null 3217 }); 3218 } 3219 return { 3220 dataRoutes, 3221 query, 3222 queryRoute 3223 }; 3224} 3225//#endregion 3226//////////////////////////////////////////////////////////////////////////////// 3227//#region Helpers 3228//////////////////////////////////////////////////////////////////////////////// 3229/** 3230 * Given an existing StaticHandlerContext and an error thrown at render time, 3231 * provide an updated StaticHandlerContext suitable for a second SSR render 3232 */ 3233function getStaticContextFromError(routes, context, error) { 3234 let newContext = _extends({}, context, { 3235 statusCode: isRouteErrorResponse(error) ? error.status : 500, 3236 errors: { 3237 [context._deepestRenderedBoundaryId || routes[0].id]: error 3238 } 3239 }); 3240 return newContext; 3241} 3242function throwStaticHandlerAbortedError(request, isRouteRequest, future) { 3243 if (future.v7_throwAbortReason && request.signal.reason !== undefined) { 3244 throw request.signal.reason; 3245 } 3246 let method = isRouteRequest ? "queryRoute" : "query"; 3247 throw new Error(method + "() call aborted: " + request.method + " " + request.url); 3248} 3249function isSubmissionNavigation(opts) { 3250 return opts != null && ("formData" in opts && opts.formData != null || "body" in opts && opts.body !== undefined); 3251} 3252function normalizeTo(location, matches, basename, prependBasename, to, v7_relativeSplatPath, fromRouteId, relative) { 3253 let contextualMatches; 3254 let activeRouteMatch; 3255 if (fromRouteId) { 3256 // Grab matches up to the calling route so our route-relative logic is 3257 // relative to the correct source route 3258 contextualMatches = []; 3259 for (let match of matches) { 3260 contextualMatches.push(match); 3261 if (match.route.id === fromRouteId) { 3262 activeRouteMatch = match; 3263 break; 3264 } 3265 } 3266 } else { 3267 contextualMatches = matches; 3268 activeRouteMatch = matches[matches.length - 1]; 3269 } 3270 // Resolve the relative path 3271 let path = resolveTo(to ? to : ".", getResolveToMatches(contextualMatches, v7_relativeSplatPath), stripBasename(location.pathname, basename) || location.pathname, relative === "path"); 3272 // When `to` is not specified we inherit search/hash from the current 3273 // location, unlike when to="." and we just inherit the path. 3274 // See https://github.com/remix-run/remix/issues/927 3275 if (to == null) { 3276 path.search = location.search; 3277 path.hash = location.hash; 3278 } 3279 // Add an ?index param for matched index routes if we don't already have one 3280 if ((to == null || to === "" || to === ".") && activeRouteMatch && activeRouteMatch.route.index && !hasNakedIndexQuery(path.search)) { 3281 path.search = path.search ? path.search.replace(/^\?/, "?index&") : "?index"; 3282 } 3283 // If we're operating within a basename, prepend it to the pathname. If 3284 // this is a root navigation, then just use the raw basename which allows 3285 // the basename to have full control over the presence of a trailing slash 3286 // on root actions 3287 if (prependBasename && basename !== "/") { 3288 path.pathname = path.pathname === "/" ? basename : joinPaths([basename, path.pathname]); 3289 } 3290 return createPath(path); 3291} 3292// Normalize navigation options by converting formMethod=GET formData objects to 3293// URLSearchParams so they behave identically to links with query params 3294function normalizeNavigateOptions(normalizeFormMethod, isFetcher, path, opts) { 3295 // Return location verbatim on non-submission navigations 3296 if (!opts || !isSubmissionNavigation(opts)) { 3297 return { 3298 path 3299 }; 3300 } 3301 if (opts.formMethod && !isValidMethod(opts.formMethod)) { 3302 return { 3303 path, 3304 error: getInternalRouterError(405, { 3305 method: opts.formMethod 3306 }) 3307 }; 3308 } 3309 let getInvalidBodyError = () => ({ 3310 path, 3311 error: getInternalRouterError(400, { 3312 type: "invalid-body" 3313 }) 3314 }); 3315 // Create a Submission on non-GET navigations 3316 let rawFormMethod = opts.formMethod || "get"; 3317 let formMethod = normalizeFormMethod ? rawFormMethod.toUpperCase() : rawFormMethod.toLowerCase(); 3318 let formAction = stripHashFromPath(path); 3319 if (opts.body !== undefined) { 3320 if (opts.formEncType === "text/plain") { 3321 // text only support POST/PUT/PATCH/DELETE submissions 3322 if (!isMutationMethod(formMethod)) { 3323 return getInvalidBodyError(); 3324 } 3325 let text = typeof opts.body === "string" ? opts.body : opts.body instanceof FormData || opts.body instanceof URLSearchParams ? 3326 // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#plain-text-form-data 3327 Array.from(opts.body.entries()).reduce((acc, _ref3) => { 3328 let [name, value] = _ref3; 3329 return "" + acc + name + "=" + value + "\n"; 3330 }, "") : String(opts.body); 3331 return { 3332 path, 3333 submission: { 3334 formMethod, 3335 formAction, 3336 formEncType: opts.formEncType, 3337 formData: undefined, 3338 json: undefined, 3339 text 3340 } 3341 }; 3342 } else if (opts.formEncType === "application/json") { 3343 // json only supports POST/PUT/PATCH/DELETE submissions 3344 if (!isMutationMethod(formMethod)) { 3345 return getInvalidBodyError(); 3346 } 3347 try { 3348 let json = typeof opts.body === "string" ? JSON.parse(opts.body) : opts.body; 3349 return { 3350 path, 3351 submission: { 3352 formMethod, 3353 formAction, 3354 formEncType: opts.formEncType, 3355 formData: undefined, 3356 json, 3357 text: undefined 3358 } 3359 }; 3360 } catch (e) { 3361 return getInvalidBodyError(); 3362 } 3363 } 3364 } 3365 invariant(typeof FormData === "function", "FormData is not available in this environment"); 3366 let searchParams; 3367 let formData; 3368 if (opts.formData) { 3369 searchParams = convertFormDataToSearchParams(opts.formData); 3370 formData = opts.formData; 3371 } else if (opts.body instanceof FormData) { 3372 searchParams = convertFormDataToSearchParams(opts.body); 3373 formData = opts.body; 3374 } else if (opts.body instanceof URLSearchParams) { 3375 searchParams = opts.body; 3376 formData = convertSearchParamsToFormData(searchParams); 3377 } else if (opts.body == null) { 3378 searchParams = new URLSearchParams(); 3379 formData = new FormData(); 3380 } else { 3381 try { 3382 searchParams = new URLSearchParams(opts.body); 3383 formData = convertSearchParamsToFormData(searchParams); 3384 } catch (e) { 3385 return getInvalidBodyError(); 3386 } 3387 } 3388 let submission = { 3389 formMethod, 3390 formAction, 3391 formEncType: opts && opts.formEncType || "application/x-www-form-urlencoded", 3392 formData, 3393 json: undefined, 3394 text: undefined 3395 }; 3396 if (isMutationMethod(submission.formMethod)) { 3397 return { 3398 path, 3399 submission 3400 }; 3401 } 3402 // Flatten submission onto URLSearchParams for GET submissions 3403 let parsedPath = parsePath(path); 3404 // On GET navigation submissions we can drop the ?index param from the 3405 // resulting location since all loaders will run. But fetcher GET submissions 3406 // only run a single loader so we need to preserve any incoming ?index params 3407 if (isFetcher && parsedPath.search && hasNakedIndexQuery(parsedPath.search)) { 3408 searchParams.append("index", ""); 3409 } 3410 parsedPath.search = "?" + searchParams; 3411 return { 3412 path: createPath(parsedPath), 3413 submission 3414 }; 3415} 3416// Filter out all routes below any caught error as they aren't going to 3417// render so we don't need to load them 3418function getLoaderMatchesUntilBoundary(matches, boundaryId) { 3419 let boundaryMatches = matches; 3420 if (boundaryId) { 3421 let index = matches.findIndex(m => m.route.id === boundaryId); 3422 if (index >= 0) { 3423 boundaryMatches = matches.slice(0, index); 3424 } 3425 } 3426 return boundaryMatches; 3427} 3428function getMatchesToLoad(history, state, matches, submission, location, isInitialLoad, isRevalidationRequired, cancelledDeferredRoutes, cancelledFetcherLoads, deletedFetchers, fetchLoadMatches, fetchRedirectIds, routesToUse, basename, pendingActionData, pendingError) { 3429 let actionResult = pendingError ? Object.values(pendingError)[0] : pendingActionData ? Object.values(pendingActionData)[0] : undefined; 3430 let currentUrl = history.createURL(state.location); 3431 let nextUrl = history.createURL(location); 3432 // Pick navigation matches that are net-new or qualify for revalidation 3433 let boundaryId = pendingError ? Object.keys(pendingError)[0] : undefined; 3434 let boundaryMatches = getLoaderMatchesUntilBoundary(matches, boundaryId); 3435 let navigationMatches = boundaryMatches.filter((match, index) => { 3436 let { 3437 route 3438 } = match; 3439 if (route.lazy) { 3440 // We haven't loaded this route yet so we don't know if it's got a loader! 3441 return true; 3442 } 3443 if (route.loader == null) { 3444 return false; 3445 } 3446 if (isInitialLoad) { 3447 if (route.loader.hydrate) { 3448 return true; 3449 } 3450 return state.loaderData[route.id] === undefined && ( 3451 // Don't re-run if the loader ran and threw an error 3452 !state.errors || state.errors[route.id] === undefined); 3453 } 3454 // Always call the loader on new route instances and pending defer cancellations 3455 if (isNewLoader(state.loaderData, state.matches[index], match) || cancelledDeferredRoutes.some(id => id === match.route.id)) { 3456 return true; 3457 } 3458 // This is the default implementation for when we revalidate. If the route 3459 // provides it's own implementation, then we give them full control but 3460 // provide this value so they can leverage it if needed after they check 3461 // their own specific use cases 3462 let currentRouteMatch = state.matches[index]; 3463 let nextRouteMatch = match; 3464 return shouldRevalidateLoader(match, _extends({ 3465 currentUrl, 3466 currentParams: currentRouteMatch.params, 3467 nextUrl, 3468 nextParams: nextRouteMatch.params 3469 }, submission, { 3470 actionResult, 3471 defaultShouldRevalidate: 3472 // Forced revalidation due to submission, useRevalidator, or X-Remix-Revalidate 3473 isRevalidationRequired || 3474 // Clicked the same link, resubmitted a GET form 3475 currentUrl.pathname + currentUrl.search === nextUrl.pathname + nextUrl.search || 3476 // Search params affect all loaders 3477 currentUrl.search !== nextUrl.search || isNewRouteInstance(currentRouteMatch, nextRouteMatch) 3478 })); 3479 }); 3480 // Pick fetcher.loads that need to be revalidated 3481 let revalidatingFetchers = []; 3482 fetchLoadMatches.forEach((f, key) => { 3483 // Don't revalidate: 3484 // - on initial load (shouldn't be any fetchers then anyway) 3485 // - if fetcher won't be present in the subsequent render 3486 // - no longer matches the URL (v7_fetcherPersist=false) 3487 // - was unmounted but persisted due to v7_fetcherPersist=true 3488 if (isInitialLoad || !matches.some(m => m.route.id === f.routeId) || deletedFetchers.has(key)) { 3489 return; 3490 } 3491 let fetcherMatches = matchRoutes(routesToUse, f.path, basename); 3492 // If the fetcher path no longer matches, push it in with null matches so 3493 // we can trigger a 404 in callLoadersAndMaybeResolveData. Note this is 3494 // currently only a use-case for Remix HMR where the route tree can change 3495 // at runtime and remove a route previously loaded via a fetcher 3496 if (!fetcherMatches) { 3497 revalidatingFetchers.push({ 3498 key, 3499 routeId: f.routeId, 3500 path: f.path, 3501 matches: null, 3502 match: null, 3503 controller: null 3504 }); 3505 return; 3506 } 3507 // Revalidating fetchers are decoupled from the route matches since they 3508 // load from a static href. They revalidate based on explicit revalidation 3509 // (submission, useRevalidator, or X-Remix-Revalidate) 3510 let fetcher = state.fetchers.get(key); 3511 let fetcherMatch = getTargetMatch(fetcherMatches, f.path); 3512 let shouldRevalidate = false; 3513 if (fetchRedirectIds.has(key)) { 3514 // Never trigger a revalidation of an actively redirecting fetcher 3515 shouldRevalidate = false; 3516 } else if (cancelledFetcherLoads.includes(key)) { 3517 // Always revalidate if the fetcher was cancelled 3518 shouldRevalidate = true; 3519 } else if (fetcher && fetcher.state !== "idle" && fetcher.data === undefined) { 3520 // If the fetcher hasn't ever completed loading yet, then this isn't a 3521 // revalidation, it would just be a brand new load if an explicit 3522 // revalidation is required 3523 shouldRevalidate = isRevalidationRequired; 3524 } else { 3525 // Otherwise fall back on any user-defined shouldRevalidate, defaulting 3526 // to explicit revalidations only 3527 shouldRevalidate = shouldRevalidateLoader(fetcherMatch, _extends({ 3528 currentUrl, 3529 currentParams: state.matches[state.matches.length - 1].params, 3530 nextUrl, 3531 nextParams: matches[matches.length - 1].params 3532 }, submission, { 3533 actionResult, 3534 defaultShouldRevalidate: isRevalidationRequired 3535 })); 3536 } 3537 if (shouldRevalidate) { 3538 revalidatingFetchers.push({ 3539 key, 3540 routeId: f.routeId, 3541 path: f.path, 3542 matches: fetcherMatches, 3543 match: fetcherMatch, 3544 controller: new AbortController() 3545 }); 3546 } 3547 }); 3548 return [navigationMatches, revalidatingFetchers]; 3549} 3550function isNewLoader(currentLoaderData, currentMatch, match) { 3551 let isNew = 3552 // [a] -> [a, b] 3553 !currentMatch || 3554 // [a, b] -> [a, c] 3555 match.route.id !== currentMatch.route.id; 3556 // Handle the case that we don't have data for a re-used route, potentially 3557 // from a prior error or from a cancelled pending deferred 3558 let isMissingData = currentLoaderData[match.route.id] === undefined; 3559 // Always load if this is a net-new route or we don't yet have data 3560 return isNew || isMissingData; 3561} 3562function isNewRouteInstance(currentMatch, match) { 3563 let currentPath = currentMatch.route.path; 3564 return ( 3565 // param change for this match, /users/123 -> /users/456 3566 currentMatch.pathname !== match.pathname || 3567 // splat param changed, which is not present in match.path 3568 // e.g. /files/images/avatar.jpg -> files/finances.xls 3569 currentPath != null && currentPath.endsWith("*") && currentMatch.params["*"] !== match.params["*"] 3570 ); 3571} 3572function shouldRevalidateLoader(loaderMatch, arg) { 3573 if (loaderMatch.route.shouldRevalidate) { 3574 let routeChoice = loaderMatch.route.shouldRevalidate(arg); 3575 if (typeof routeChoice === "boolean") { 3576 return routeChoice; 3577 } 3578 } 3579 return arg.defaultShouldRevalidate; 3580} 3581/** 3582 * Execute route.lazy() methods to lazily load route modules (loader, action, 3583 * shouldRevalidate) and update the routeManifest in place which shares objects 3584 * with dataRoutes so those get updated as well. 3585 */ 3586async function loadLazyRouteModule(route, mapRouteProperties, manifest) { 3587 if (!route.lazy) { 3588 return; 3589 } 3590 let lazyRoute = await route.lazy(); 3591 // If the lazy route function was executed and removed by another parallel 3592 // call then we can return - first lazy() to finish wins because the return 3593 // value of lazy is expected to be static 3594 if (!route.lazy) { 3595 return; 3596 } 3597 let routeToUpdate = manifest[route.id]; 3598 invariant(routeToUpdate, "No route found in manifest"); 3599 // Update the route in place. This should be safe because there's no way 3600 // we could yet be sitting on this route as we can't get there without 3601 // resolving lazy() first. 3602 // 3603 // This is different than the HMR "update" use-case where we may actively be 3604 // on the route being updated. The main concern boils down to "does this 3605 // mutation affect any ongoing navigations or any current state.matches 3606 // values?". If not, it should be safe to update in place. 3607 let routeUpdates = {}; 3608 for (let lazyRouteProperty in lazyRoute) { 3609 let staticRouteValue = routeToUpdate[lazyRouteProperty]; 3610 let isPropertyStaticallyDefined = staticRouteValue !== undefined && 3611 // This property isn't static since it should always be updated based 3612 // on the route updates 3613 lazyRouteProperty !== "hasErrorBoundary"; 3614 warning(!isPropertyStaticallyDefined, "Route \"" + routeToUpdate.id + "\" has a static property \"" + lazyRouteProperty + "\" " + "defined but its lazy function is also returning a value for this property. " + ("The lazy route property \"" + lazyRouteProperty + "\" will be ignored.")); 3615 if (!isPropertyStaticallyDefined && !immutableRouteKeys.has(lazyRouteProperty)) { 3616 routeUpdates[lazyRouteProperty] = lazyRoute[lazyRouteProperty]; 3617 } 3618 } 3619 // Mutate the route with the provided updates. Do this first so we pass 3620 // the updated version to mapRouteProperties 3621 Object.assign(routeToUpdate, routeUpdates); 3622 // Mutate the `hasErrorBoundary` property on the route based on the route 3623 // updates and remove the `lazy` function so we don't resolve the lazy 3624 // route again. 3625 Object.assign(routeToUpdate, _extends({}, mapRouteProperties(routeToUpdate), { 3626 lazy: undefined 3627 })); 3628} 3629async function callLoaderOrAction(type, request, match, matches, manifest, mapRouteProperties, basename, v7_relativeSplatPath, opts) { 3630 if (opts === void 0) { 3631 opts = {}; 3632 } 3633 let resultType; 3634 let result; 3635 let onReject; 3636 let runHandler = handler => { 3637 // Setup a promise we can race against so that abort signals short circuit 3638 let reject; 3639 let abortPromise = new Promise((_, r) => reject = r); 3640 onReject = () => reject(); 3641 request.signal.addEventListener("abort", onReject); 3642 return Promise.race([handler({ 3643 request, 3644 params: match.params, 3645 context: opts.requestContext 3646 }), abortPromise]); 3647 }; 3648 try { 3649 let handler = match.route[type]; 3650 if (match.route.lazy) { 3651 if (handler) { 3652 // Run statically defined handler in parallel with lazy() 3653 let handlerError; 3654 let values = await Promise.all([ 3655 // If the handler throws, don't let it immediately bubble out, 3656 // since we need to let the lazy() execution finish so we know if this 3657 // route has a boundary that can handle the error 3658 runHandler(handler).catch(e => { 3659 handlerError = e; 3660 }), loadLazyRouteModule(match.route, mapRouteProperties, manifest)]); 3661 if (handlerError) { 3662 throw handlerError; 3663 } 3664 result = values[0]; 3665 } else { 3666 // Load lazy route module, then run any returned handler 3667 await loadLazyRouteModule(match.route, mapRouteProperties, manifest); 3668 handler = match.route[type]; 3669 if (handler) { 3670 // Handler still run even if we got interrupted to maintain consistency 3671 // with un-abortable behavior of handler execution on non-lazy or 3672 // previously-lazy-loaded routes 3673 result = await runHandler(handler); 3674 } else if (type === "action") { 3675 let url = new URL(request.url); 3676 let pathname = url.pathname + url.search; 3677 throw getInternalRouterError(405, { 3678 method: request.method, 3679 pathname, 3680 routeId: match.route.id 3681 }); 3682 } else { 3683 // lazy() route has no loader to run. Short circuit here so we don't 3684 // hit the invariant below that errors on returning undefined. 3685 return { 3686 type: ResultType.data, 3687 data: undefined 3688 }; 3689 } 3690 } 3691 } else if (!handler) { 3692 let url = new URL(request.url); 3693 let pathname = url.pathname + url.search; 3694 throw getInternalRouterError(404, { 3695 pathname 3696 }); 3697 } else { 3698 result = await runHandler(handler); 3699 } 3700 invariant(result !== undefined, "You defined " + (type === "action" ? "an action" : "a loader") + " for route " + ("\"" + match.route.id + "\" but didn't return anything from your `" + type + "` ") + "function. Please return a value or `null`."); 3701 } catch (e) { 3702 resultType = ResultType.error; 3703 result = e; 3704 } finally { 3705 if (onReject) { 3706 request.signal.removeEventListener("abort", onReject); 3707 } 3708 } 3709 if (isResponse(result)) { 3710 let status = result.status; 3711 // Process redirects 3712 if (redirectStatusCodes.has(status)) { 3713 let location = result.headers.get("Location"); 3714 invariant(location, "Redirects returned/thrown from loaders/actions must have a Location header"); 3715 // Support relative routing in internal redirects 3716 if (!ABSOLUTE_URL_REGEX.test(location)) { 3717 location = normalizeTo(new URL(request.url), matches.slice(0, matches.indexOf(match) + 1), basename, true, location, v7_relativeSplatPath); 3718 } else if (!opts.isStaticRequest) { 3719 // Strip off the protocol+origin for same-origin + same-basename absolute 3720 // redirects. If this is a static request, we can let it go back to the 3721 // browser as-is 3722 let currentUrl = new URL(request.url); 3723 let url = location.startsWith("//") ? new URL(currentUrl.protocol + location) : new URL(location); 3724 let isSameBasename = stripBasename(url.pathname, basename) != null; 3725 if (url.origin === currentUrl.origin && isSameBasename) { 3726 location = url.pathname + url.search + url.hash; 3727 } 3728 } 3729 // Don't process redirects in the router during static requests requests. 3730 // Instead, throw the Response and let the server handle it with an HTTP 3731 // redirect. We also update the Location header in place in this flow so 3732 // basename and relative routing is taken into account 3733 if (opts.isStaticRequest) { 3734 result.headers.set("Location", location); 3735 throw result; 3736 } 3737 return { 3738 type: ResultType.redirect, 3739 status, 3740 location, 3741 revalidate: result.headers.get("X-Remix-Revalidate") !== null, 3742 reloadDocument: result.headers.get("X-Remix-Reload-Document") !== null 3743 }; 3744 } 3745 // For SSR single-route requests, we want to hand Responses back directly 3746 // without unwrapping. We do this with the QueryRouteResponse wrapper 3747 // interface so we can know whether it was returned or thrown 3748 if (opts.isRouteRequest) { 3749 let queryRouteResponse = { 3750 type: resultType === ResultType.error ? ResultType.error : ResultType.data, 3751 response: result 3752 }; 3753 throw queryRouteResponse; 3754 } 3755 let data; 3756 try { 3757 let contentType = result.headers.get("Content-Type"); 3758 // Check between word boundaries instead of startsWith() due to the last 3759 // paragraph of https://httpwg.org/specs/rfc9110.html#field.content-type 3760 if (contentType && /\bapplication\/json\b/.test(contentType)) { 3761 if (result.body == null) { 3762 data = null; 3763 } else { 3764 data = await result.json(); 3765 } 3766 } else { 3767 data = await result.text(); 3768 } 3769 } catch (e) { 3770 return { 3771 type: ResultType.error, 3772 error: e 3773 }; 3774 } 3775 if (resultType === ResultType.error) { 3776 return { 3777 type: resultType, 3778 error: new ErrorResponseImpl(status, result.statusText, data), 3779 headers: result.headers 3780 }; 3781 } 3782 return { 3783 type: ResultType.data, 3784 data, 3785 statusCode: result.status, 3786 headers: result.headers 3787 }; 3788 } 3789 if (resultType === ResultType.error) { 3790 return { 3791 type: resultType, 3792 error: result 3793 }; 3794 } 3795 if (isDeferredData(result)) { 3796 var _result$init, _result$init2; 3797 return { 3798 type: ResultType.deferred, 3799 deferredData: result, 3800 statusCode: (_result$init = result.init) == null ? void 0 : _result$init.status, 3801 headers: ((_result$init2 = result.init) == null ? void 0 : _result$init2.headers) && new Headers(result.init.headers) 3802 }; 3803 } 3804 return { 3805 type: ResultType.data, 3806 data: result 3807 }; 3808} 3809// Utility method for creating the Request instances for loaders/actions during 3810// client-side navigations and fetches. During SSR we will always have a 3811// Request instance from the static handler (query/queryRoute) 3812function createClientSideRequest(history, location, signal, submission) { 3813 let url = history.createURL(stripHashFromPath(location)).toString(); 3814 let init = { 3815 signal 3816 }; 3817 if (submission && isMutationMethod(submission.formMethod)) { 3818 let { 3819 formMethod, 3820 formEncType 3821 } = submission; 3822 // Didn't think we needed this but it turns out unlike other methods, patch 3823 // won't be properly normalized to uppercase and results in a 405 error. 3824 // See: https://fetch.spec.whatwg.org/#concept-method 3825 init.method = formMethod.toUpperCase(); 3826 if (formEncType === "application/json") { 3827 init.headers = new Headers({ 3828 "Content-Type": formEncType 3829 }); 3830 init.body = JSON.stringify(submission.json); 3831 } else if (formEncType === "text/plain") { 3832 // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request) 3833 init.body = submission.text; 3834 } else if (formEncType === "application/x-www-form-urlencoded" && submission.formData) { 3835 // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request) 3836 init.body = convertFormDataToSearchParams(submission.formData); 3837 } else { 3838 // Content-Type is inferred (https://fetch.spec.whatwg.org/#dom-request) 3839 init.body = submission.formData; 3840 } 3841 } 3842 return new Request(url, init); 3843} 3844function convertFormDataToSearchParams(formData) { 3845 let searchParams = new URLSearchParams(); 3846 for (let [key, value] of formData.entries()) { 3847 // https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#converting-an-entry-list-to-a-list-of-name-value-pairs 3848 searchParams.append(key, typeof value === "string" ? value : value.name); 3849 } 3850 return searchParams; 3851} 3852function convertSearchParamsToFormData(searchParams) { 3853 let formData = new FormData(); 3854 for (let [key, value] of searchParams.entries()) { 3855 formData.append(key, value); 3856 } 3857 return formData; 3858} 3859function processRouteLoaderData(matches, matchesToLoad, results, pendingError, activeDeferreds) { 3860 // Fill in loaderData/errors from our loaders 3861 let loaderData = {}; 3862 let errors = null; 3863 let statusCode; 3864 let foundError = false; 3865 let loaderHeaders = {}; 3866 // Process loader results into state.loaderData/state.errors 3867 results.forEach((result, index) => { 3868 let id = matchesToLoad[index].route.id; 3869 invariant(!isRedirectResult(result), "Cannot handle redirect results in processLoaderData"); 3870 if (isErrorResult(result)) { 3871 // Look upwards from the matched route for the closest ancestor 3872 // error boundary, defaulting to the root match 3873 let boundaryMatch = findNearestBoundary(matches, id); 3874 let error = result.error; 3875 // If we have a pending action error, we report it at the highest-route 3876 // that throws a loader error, and then clear it out to indicate that 3877 // it was consumed 3878 if (pendingError) { 3879 error = Object.values(pendingError)[0]; 3880 pendingError = undefined; 3881 } 3882 errors = errors || {}; 3883 // Prefer higher error values if lower errors bubble to the same boundary 3884 if (errors[boundaryMatch.route.id] == null) { 3885 errors[boundaryMatch.route.id] = error; 3886 } 3887 // Clear our any prior loaderData for the throwing route 3888 loaderData[id] = undefined; 3889 // Once we find our first (highest) error, we set the status code and 3890 // prevent deeper status codes from overriding 3891 if (!foundError) { 3892 foundError = true; 3893 statusCode = isRouteErrorResponse(result.error) ? result.error.status : 500; 3894 } 3895 if (result.headers) { 3896 loaderHeaders[id] = result.headers; 3897 } 3898 } else { 3899 if (isDeferredResult(result)) { 3900 activeDeferreds.set(id, result.deferredData); 3901 loaderData[id] = result.deferredData.data; 3902 } else { 3903 loaderData[id] = result.data; 3904 } 3905 // Error status codes always override success status codes, but if all 3906 // loaders are successful we take the deepest status code. 3907 if (result.statusCode != null && result.statusCode !== 200 && !foundError) { 3908 statusCode = result.statusCode; 3909 } 3910 if (result.headers) { 3911 loaderHeaders[id] = result.headers; 3912 } 3913 } 3914 }); 3915 // If we didn't consume the pending action error (i.e., all loaders 3916 // resolved), then consume it here. Also clear out any loaderData for the 3917 // throwing route 3918 if (pendingError) { 3919 errors = pendingError; 3920 loaderData[Object.keys(pendingError)[0]] = undefined; 3921 } 3922 return { 3923 loaderData, 3924 errors, 3925 statusCode: statusCode || 200, 3926 loaderHeaders 3927 }; 3928} 3929function processLoaderData(state, matches, matchesToLoad, results, pendingError, revalidatingFetchers, fetcherResults, activeDeferreds) { 3930 let { 3931 loaderData, 3932 errors 3933 } = processRouteLoaderData(matches, matchesToLoad, results, pendingError, activeDeferreds); 3934 // Process results from our revalidating fetchers 3935 for (let index = 0; index < revalidatingFetchers.length; index++) { 3936 let { 3937 key, 3938 match, 3939 controller 3940 } = revalidatingFetchers[index]; 3941 invariant(fetcherResults !== undefined && fetcherResults[index] !== undefined, "Did not find corresponding fetcher result"); 3942 let result = fetcherResults[index]; 3943 // Process fetcher non-redirect errors 3944 if (controller && controller.signal.aborted) { 3945 // Nothing to do for aborted fetchers 3946 continue; 3947 } else if (isErrorResult(result)) { 3948 let boundaryMatch = findNearestBoundary(state.matches, match == null ? void 0 : match.route.id); 3949 if (!(errors && errors[boundaryMatch.route.id])) { 3950 errors = _extends({}, errors, { 3951 [boundaryMatch.route.id]: result.error 3952 }); 3953 } 3954 state.fetchers.delete(key); 3955 } else if (isRedirectResult(result)) { 3956 // Should never get here, redirects should get processed above, but we 3957 // keep this to type narrow to a success result in the else 3958 invariant(false, "Unhandled fetcher revalidation redirect"); 3959 } else if (isDeferredResult(result)) { 3960 // Should never get here, deferred data should be awaited for fetchers 3961 // in resolveDeferredResults 3962 invariant(false, "Unhandled fetcher deferred data"); 3963 } else { 3964 let doneFetcher = getDoneFetcher(result.data); 3965 state.fetchers.set(key, doneFetcher); 3966 } 3967 } 3968 return { 3969 loaderData, 3970 errors 3971 }; 3972} 3973function mergeLoaderData(loaderData, newLoaderData, matches, errors) { 3974 let mergedLoaderData = _extends({}, newLoaderData); 3975 for (let match of matches) { 3976 let id = match.route.id; 3977 if (newLoaderData.hasOwnProperty(id)) { 3978 if (newLoaderData[id] !== undefined) { 3979 mergedLoaderData[id] = newLoaderData[id]; 3980 } 3981 } else if (loaderData[id] !== undefined && match.route.loader) { 3982 // Preserve existing keys not included in newLoaderData and where a loader 3983 // wasn't removed by HMR 3984 mergedLoaderData[id] = loaderData[id]; 3985 } 3986 if (errors && errors.hasOwnProperty(id)) { 3987 // Don't keep any loader data below the boundary 3988 break; 3989 } 3990 } 3991 return mergedLoaderData; 3992} 3993// Find the nearest error boundary, looking upwards from the leaf route (or the 3994// route specified by routeId) for the closest ancestor error boundary, 3995// defaulting to the root match 3996function findNearestBoundary(matches, routeId) { 3997 let eligibleMatches = routeId ? matches.slice(0, matches.findIndex(m => m.route.id === routeId) + 1) : [...matches]; 3998 return eligibleMatches.reverse().find(m => m.route.hasErrorBoundary === true) || matches[0]; 3999} 4000function getShortCircuitMatches(routes) { 4001 // Prefer a root layout route if present, otherwise shim in a route object 4002 let route = routes.length === 1 ? routes[0] : routes.find(r => r.index || !r.path || r.path === "/") || { 4003 id: "__shim-error-route__" 4004 }; 4005 return { 4006 matches: [{ 4007 params: {}, 4008 pathname: "", 4009 pathnameBase: "", 4010 route 4011 }], 4012 route 4013 }; 4014} 4015function getInternalRouterError(status, _temp5) { 4016 let { 4017 pathname, 4018 routeId, 4019 method, 4020 type 4021 } = _temp5 === void 0 ? {} : _temp5; 4022 let statusText = "Unknown Server Error"; 4023 let errorMessage = "Unknown @remix-run/router error"; 4024 if (status === 400) { 4025 statusText = "Bad Request"; 4026 if (method && pathname && routeId) { 4027 errorMessage = "You made a " + method + " request to \"" + pathname + "\" but " + ("did not provide a `loader` for route \"" + routeId + "\", ") + "so there is no way to handle the request."; 4028 } else if (type === "defer-action") { 4029 errorMessage = "defer() is not supported in actions"; 4030 } else if (type === "invalid-body") { 4031 errorMessage = "Unable to encode submission body"; 4032 } 4033 } else if (status === 403) { 4034 statusText = "Forbidden"; 4035 errorMessage = "Route \"" + routeId + "\" does not match URL \"" + pathname + "\""; 4036 } else if (status === 404) { 4037 statusText = "Not Found"; 4038 errorMessage = "No route matches URL \"" + pathname + "\""; 4039 } else if (status === 405) { 4040 statusText = "Method Not Allowed"; 4041 if (method && pathname && routeId) { 4042 errorMessage = "You made a " + method.toUpperCase() + " request to \"" + pathname + "\" but " + ("did not provide an `action` for route \"" + routeId + "\", ") + "so there is no way to handle the request."; 4043 } else if (method) { 4044 errorMessage = "Invalid request method \"" + method.toUpperCase() + "\""; 4045 } 4046 } 4047 return new ErrorResponseImpl(status || 500, statusText, new Error(errorMessage), true); 4048} 4049// Find any returned redirect errors, starting from the lowest match 4050function findRedirect(results) { 4051 for (let i = results.length - 1; i >= 0; i--) { 4052 let result = results[i]; 4053 if (isRedirectResult(result)) { 4054 return { 4055 result, 4056 idx: i 4057 }; 4058 } 4059 } 4060} 4061function stripHashFromPath(path) { 4062 let parsedPath = typeof path === "string" ? parsePath(path) : path; 4063 return createPath(_extends({}, parsedPath, { 4064 hash: "" 4065 })); 4066} 4067function isHashChangeOnly(a, b) { 4068 if (a.pathname !== b.pathname || a.search !== b.search) { 4069 return false; 4070 } 4071 if (a.hash === "") { 4072 // /page -> /page#hash 4073 return b.hash !== ""; 4074 } else if (a.hash === b.hash) { 4075 // /page#hash -> /page#hash 4076 return true; 4077 } else if (b.hash !== "") { 4078 // /page#hash -> /page#other 4079 return true; 4080 } 4081 // If the hash is removed the browser will re-perform a request to the server 4082 // /page#hash -> /page 4083 return false; 4084} 4085function isDeferredResult(result) { 4086 return result.type === ResultType.deferred; 4087} 4088function isErrorResult(result) { 4089 return result.type === ResultType.error; 4090} 4091function isRedirectResult(result) { 4092 return (result && result.type) === ResultType.redirect; 4093} 4094function isDeferredData(value) { 4095 let deferred = value; 4096 return deferred && typeof deferred === "object" && typeof deferred.data === "object" && typeof deferred.subscribe === "function" && typeof deferred.cancel === "function" && typeof deferred.resolveData === "function"; 4097} 4098function isResponse(value) { 4099 return value != null && typeof value.status === "number" && typeof value.statusText === "string" && typeof value.headers === "object" && typeof value.body !== "undefined"; 4100} 4101function isRedirectResponse(result) { 4102 if (!isResponse(result)) { 4103 return false; 4104 } 4105 let status = result.status; 4106 let location = result.headers.get("Location"); 4107 return status >= 300 && status <= 399 && location != null; 4108} 4109function isQueryRouteResponse(obj) { 4110 return obj && isResponse(obj.response) && (obj.type === ResultType.data || obj.type === ResultType.error); 4111} 4112function isValidMethod(method) { 4113 return validRequestMethods.has(method.toLowerCase()); 4114} 4115function isMutationMethod(method) { 4116 return validMutationMethods.has(method.toLowerCase()); 4117} 4118async function resolveDeferredResults(currentMatches, matchesToLoad, results, signals, isFetcher, currentLoaderData) { 4119 for (let index = 0; index < results.length; index++) { 4120 let result = results[index]; 4121 let match = matchesToLoad[index]; 4122 // If we don't have a match, then we can have a deferred result to do 4123 // anything with. This is for revalidating fetchers where the route was 4124 // removed during HMR 4125 if (!match) { 4126 continue; 4127 } 4128 let currentMatch = currentMatches.find(m => m.route.id === match.route.id); 4129 let isRevalidatingLoader = currentMatch != null && !isNewRouteInstance(currentMatch, match) && (currentLoaderData && currentLoaderData[match.route.id]) !== undefined; 4130 if (isDeferredResult(result) && (isFetcher || isRevalidatingLoader)) { 4131 // Note: we do not have to touch activeDeferreds here since we race them 4132 // against the signal in resolveDeferredData and they'll get aborted 4133 // there if needed 4134 let signal = signals[index]; 4135 invariant(signal, "Expected an AbortSignal for revalidating fetcher deferred result"); 4136 await resolveDeferredData(result, signal, isFetcher).then(result => { 4137 if (result) { 4138 results[index] = result || results[index]; 4139 } 4140 }); 4141 } 4142 } 4143} 4144async function resolveDeferredData(result, signal, unwrap) { 4145 if (unwrap === void 0) { 4146 unwrap = false; 4147 } 4148 let aborted = await result.deferredData.resolveData(signal); 4149 if (aborted) { 4150 return; 4151 } 4152 if (unwrap) { 4153 try { 4154 return { 4155 type: ResultType.data, 4156 data: result.deferredData.unwrappedData 4157 }; 4158 } catch (e) { 4159 // Handle any TrackedPromise._error values encountered while unwrapping 4160 return { 4161 type: ResultType.error, 4162 error: e 4163 }; 4164 } 4165 } 4166 return { 4167 type: ResultType.data, 4168 data: result.deferredData.data 4169 }; 4170} 4171function hasNakedIndexQuery(search) { 4172 return new URLSearchParams(search).getAll("index").some(v => v === ""); 4173} 4174function getTargetMatch(matches, location) { 4175 let search = typeof location === "string" ? parsePath(location).search : location.search; 4176 if (matches[matches.length - 1].route.index && hasNakedIndexQuery(search || "")) { 4177 // Return the leaf index route when index is present 4178 return matches[matches.length - 1]; 4179 } 4180 // Otherwise grab the deepest "path contributing" match (ignoring index and 4181 // pathless layout routes) 4182 let pathMatches = getPathContributingMatches(matches); 4183 return pathMatches[pathMatches.length - 1]; 4184} 4185function getSubmissionFromNavigation(navigation) { 4186 let { 4187 formMethod, 4188 formAction, 4189 formEncType, 4190 text, 4191 formData, 4192 json 4193 } = navigation; 4194 if (!formMethod || !formAction || !formEncType) { 4195 return; 4196 } 4197 if (text != null) { 4198 return { 4199 formMethod, 4200 formAction, 4201 formEncType, 4202 formData: undefined, 4203 json: undefined, 4204 text 4205 }; 4206 } else if (formData != null) { 4207 return { 4208 formMethod, 4209 formAction, 4210 formEncType, 4211 formData, 4212 json: undefined, 4213 text: undefined 4214 }; 4215 } else if (json !== undefined) { 4216 return { 4217 formMethod, 4218 formAction, 4219 formEncType, 4220 formData: undefined, 4221 json, 4222 text: undefined 4223 }; 4224 } 4225} 4226function getLoadingNavigation(location, submission) { 4227 if (submission) { 4228 let navigation = { 4229 state: "loading", 4230 location, 4231 formMethod: submission.formMethod, 4232 formAction: submission.formAction, 4233 formEncType: submission.formEncType, 4234 formData: submission.formData, 4235 json: submission.json, 4236 text: submission.text 4237 }; 4238 return navigation; 4239 } else { 4240 let navigation = { 4241 state: "loading", 4242 location, 4243 formMethod: undefined, 4244 formAction: undefined, 4245 formEncType: undefined, 4246 formData: undefined, 4247 json: undefined, 4248 text: undefined 4249 }; 4250 return navigation; 4251 } 4252} 4253function getSubmittingNavigation(location, submission) { 4254 let navigation = { 4255 state: "submitting", 4256 location, 4257 formMethod: submission.formMethod, 4258 formAction: submission.formAction, 4259 formEncType: submission.formEncType, 4260 formData: submission.formData, 4261 json: submission.json, 4262 text: submission.text 4263 }; 4264 return navigation; 4265} 4266function getLoadingFetcher(submission, data) { 4267 if (submission) { 4268 let fetcher = { 4269 state: "loading", 4270 formMethod: submission.formMethod, 4271 formAction: submission.formAction, 4272 formEncType: submission.formEncType, 4273 formData: submission.formData, 4274 json: submission.json, 4275 text: submission.text, 4276 data 4277 }; 4278 return fetcher; 4279 } else { 4280 let fetcher = { 4281 state: "loading", 4282 formMethod: undefined, 4283 formAction: undefined, 4284 formEncType: undefined, 4285 formData: undefined, 4286 json: undefined, 4287 text: undefined, 4288 data 4289 }; 4290 return fetcher; 4291 } 4292} 4293function getSubmittingFetcher(submission, existingFetcher) { 4294 let fetcher = { 4295 state: "submitting", 4296 formMethod: submission.formMethod, 4297 formAction: submission.formAction, 4298 formEncType: submission.formEncType, 4299 formData: submission.formData, 4300 json: submission.json, 4301 text: submission.text, 4302 data: existingFetcher ? existingFetcher.data : undefined 4303 }; 4304 return fetcher; 4305} 4306function getDoneFetcher(data) { 4307 let fetcher = { 4308 state: "idle", 4309 formMethod: undefined, 4310 formAction: undefined, 4311 formEncType: undefined, 4312 formData: undefined, 4313 json: undefined, 4314 text: undefined, 4315 data 4316 }; 4317 return fetcher; 4318} 4319function restoreAppliedTransitions(_window, transitions) { 4320 try { 4321 let sessionPositions = _window.sessionStorage.getItem(TRANSITIONS_STORAGE_KEY); 4322 if (sessionPositions) { 4323 let json = JSON.parse(sessionPositions); 4324 for (let [k, v] of Object.entries(json || {})) { 4325 if (v && Array.isArray(v)) { 4326 transitions.set(k, new Set(v || [])); 4327 } 4328 } 4329 } 4330 } catch (e) { 4331 // no-op, use default empty object 4332 } 4333} 4334function persistAppliedTransitions(_window, transitions) { 4335 if (transitions.size > 0) { 4336 let json = {}; 4337 for (let [k, v] of transitions) { 4338 json[k] = [...v]; 4339 } 4340 try { 4341 _window.sessionStorage.setItem(TRANSITIONS_STORAGE_KEY, JSON.stringify(json)); 4342 } catch (error) { 4343 warning(false, "Failed to save applied view transitions in sessionStorage (" + error + ")."); 4344 } 4345 } 4346} 4347//#endregion 4348 4349 4350//# sourceMappingURL=router.js.map 4351 4352 4353/***/ }), 4354
4355/***/ "./src/App.jsx": 4356/*!*********************!*\ 4357 !*** ./src/App.jsx ***! 4358 \*********************/ 4359/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 4360 4361"use strict"; 4362__webpack_require__.r(__webpack_exports__); 4363/* harmony export */ __webpack_require__.d(__webpack_exports__, { 4364/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 4365/* harmony export */ }); 4366/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 4367/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 4368/* harmony import */ var _controllers_room__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./controllers/room */ "./src/controllers/room.js"); 4369/* harmony import */ var _controllers_room_finder__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./controllers/room-finder */ "./src/controllers/room-finder.js"); 4370/* harmony import */ var _controllers_browse__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./controllers/browse */ "./src/controllers/browse.js"); 4371/* harmony import */ var _component_toggleView__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./component/toggleView */ "./src/component/toggleView.js"); 4372/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router-dom/dist/index.js"); 4373/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router/dist/index.js"); 4374 4375 4376 4377 4378 4379 4380//import React, { useState, useEffect } from 'react'; 4381 4382var MainController = function MainController() { 4383 var location = window.location.pathname; 4384 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_5__.HashRouter, { 4385 history: history 4386 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_component_toggleView__WEBPACK_IMPORTED_MODULE_4__["default"], null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_6__.Routes, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_6__.Route, { 4387 path: "/", 4388 element: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_controllers_browse__WEBPACK_IMPORTED_MODULE_3__["default"], null) 4389 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_6__.Route, { 4390 path: "/browse", 4391 element: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_controllers_browse__WEBPACK_IMPORTED_MODULE_3__["default"], null) 4392 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_6__.Route, { 4393 path: "/room-finder", 4394 element: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_controllers_room_finder__WEBPACK_IMPORTED_MODULE_2__["default"], null) 4395 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_6__.Route, { 4396 path: "/room", 4397 element: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_controllers_room__WEBPACK_IMPORTED_MODULE_1__["default"], null) 4398 }))); 4399}; 4400var LandingController = function LandingController() { 4401 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("br", null), "Take a tour of our venue and find the perfect space for your event in two ways. ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 4402 href: "browse" 4403 }, "BROWSE"), " our floor plans, find room capacities, view diagrams of standard room sets, and envision your event through real event photos and virtual tours. Or, if you know the type of event you are planning, the number of people, and the room set-up, use our ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
4404 href: "room-finder" 4405 }, "ROOM FINDER"), " to discover the perfect space for your occasion.")); 4406}; 4407 4408// Custom hooks and functional components to replace directives 4409 4410// const toggleUpdate = (el) => { 4411// if (el.target.classList.contains('left')) { 4412// jQuery(document).find('.toggleSwitch').removeClass("right"); 4413// } else { 4414// jQuery(document).find('.toggleSwitch').addClass("right"); 4415// } 4416// }; 4417 4418var App = function App() { 4419 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(MainController, null)); 4420}; 4421/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (App); 4422 4423/***/ }), 4424
4425/***/ "./src/component/toggleView.js": 4426/*!*************************************!*\ 4427 !*** ./src/component/toggleView.js ***! 4428 \*************************************/ 4429/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 4430 4431"use strict"; 4432__webpack_require__.r(__webpack_exports__); 4433/* harmony export */ __webpack_require__.d(__webpack_exports__, { 4434/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 4435/* harmony export */ }); 4436/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 4437/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 4438/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router-dom/dist/index.js"); 4439 4440 4441var toggleView = function toggleView(url) { 4442 //const [svgContent, setSvgContent] = useState(null); 4443 4444 var buttonLeftRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); 4445 var buttonRightRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); 4446 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 4447 console.log('toggleView'); 4448 }, [url]); 4449 var toggleUpdate = function toggleUpdate(el) { 4450 if (el.target.classList.contains('left')) { 4451 console.log('left'); 4452 jQuery(document).find('.toggleSwitch').addClass("left"); 4453 jQuery(document).find('.toggleSwitch').removeClass("right"); 4454 } else { 4455 console.log('right'); 4456 jQuery(document).find('.toggleSwitch').addClass("right"); 4457 jQuery(document).find('.toggleSwitch').removeClass("left"); 4458 } 4459 }; 4460 var customEvent = function customEvent(el) { 4461 var elToggleSwitch = document.getElementsByClassName('toggleSwitch'); 4462 if (elToggleSwitch[0].classList.contains('left')) { 4463 buttonRightRef.current.click(); 4464 jQuery(document).find('.toggleSwitch').addClass("right"); 4465 jQuery(document).find('.toggleSwitch').removeClass("left"); 4466 } else { 4467 buttonLeftRef.current.click(); 4468 jQuery(document).find('.toggleSwitch').addClass("left"); 4469 jQuery(document).find('.toggleSwitch').removeClass("right"); 4470 } 4471 }; 4472 return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("nav", null, /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", { 4473 className: "browse" 4474 }, /*#__PURE__*/React.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_1__.Link, { 4475 to: "/browse", 4476 className: "left", 4477 onClick: toggleUpdate 4478 }, /*#__PURE__*/React.createElement("span", { 4479 className: "title" 4480 }, "Browse the Map"), /*#__PURE__*/React.createElement("br", null), "Offers an overview of what's available. Dive into our floor plans to see room capacities, explore standard setup diagrams, and visualize your event with real photos.")), /*#__PURE__*/React.createElement("li", { 4481 className: "room-finder" 4482 }, /*#__PURE__*/React.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_1__.Link, { 4483 to: "/room-finder", 4484 className: "right", 4485 onClick: toggleUpdate 4486 }, /*#__PURE__*/React.createElement("span", { 4487 className: "title" 4488 }, "Room Finder"), /*#__PURE__*/React.createElement("br", null), "Searching by your specific type of event, expected number of guests, and preferred room layout, the Room Finder tool suggests the best space for your event.")))), /*#__PURE__*/React.createElement("p", { 4489 className: "contact-cta" 4490 }, /*#__PURE__*/React.createElement("a", { 4491 href: "/atlanta-event-planners/book-your-event/" 4492 }, "Contact Sales Manager")), /*#__PURE__*/React.createElement("div", { 4493 className: "toggleSwitch left" 4494 }, /*#__PURE__*/React.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_1__.Link, { 4495 ref: buttonLeftRef, 4496 className: "left", 4497 to: "/browse", 4498 onClick: toggleUpdate 4499 }, "Map View"), /*#__PURE__*/React.createElement("div", { 4500 className: "capsule", 4501 onClick: customEvent 4502 }, /*#__PURE__*/React.createElement("div", { 4503 className: "indicator" 4504 })), /*#__PURE__*/React.createElement(react_router_dom__WEBPACK_IMPORTED_MODULE_1__.Link, { 4505 ref: buttonRightRef, 4506 className: "right", 4507 to: "/room-finder", 4508 onClick: toggleUpdate 4509 }, "Room Finder"))); 4510}; 4511/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (toggleView); 4512 4513/***/ }), 4514
vendor: 2,201 bytes, lines 4515-4529
4515/***/ "./src/component/useFetchSvg.js": 4516/*!**************************************!*\ 4517 !*** ./src/component/useFetchSvg.js ***! 4518 \**************************************/ 4519/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 4520 4521"use strict"; 4522__webpack_require__.r(__webpack_exports__); 4523/* harmony export */ __webpack_require__.d(__webpack_exports__, { 4524/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 4525/* harmony export */ }); 4526/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 4527/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 4528function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } 4529function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap;
vendor: 5,446 bytes, line 4529
4529 var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEac
vendor: 6,267 bytes, lines 4529-4586
4529h(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; } 4530function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } } 4531function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } 4532function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } 4533function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } 4534function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } 4535function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } 4536function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } 4537function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } 4538 4539var useFetchSvg = function useFetchSvg(url) { 4540 var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null), 4541 _useState2 = _slicedToArray(_useState, 2), 4542 svgContent = _useState2[0], 4543 setSvgContent = _useState2[1]; 4544 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 4545 var fetchSvg = /*#__PURE__*/function () { 4546 var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() { 4547 var response, text; 4548 return _regeneratorRuntime().wrap(function _callee$(_context) { 4549 while (1) switch (_context.prev = _context.next) { 4550 case 0: 4551 _context.prev = 0; 4552 _context.next = 3; 4553 return fetch(url); 4554 case 3: 4555 response = _context.sent; 4556 _context.next = 6; 4557 return response.text(); 4558 case 6: 4559 text = _context.sent; 4560 setSvgContent(text); 4561 _context.next = 13; 4562 break; 4563 case 10: 4564 _context.prev = 10; 4565 _context.t0 = _context["catch"](0); 4566 console.error('Error fetching SVG:', _context.t0); 4567 case 13: 4568 case "end": 4569 return _context.stop(); 4570 } 4571 }, _callee, null, [[0, 10]]); 4572 })); 4573 return function fetchSvg() { 4574 return _ref.apply(this, arguments); 4575 }; 4576 }(); 4577 if (url) { 4578 fetchSvg(); 4579 } 4580 }, [url]); 4581 return svgContent; 4582}; 4583/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (useFetchSvg); 4584 4585/***/ }), 4586
vendor: 2,947 bytes, lines 4587-4606
4587/***/ "./src/controllers/browse.js": 4588/*!***********************************!*\ 4589 !*** ./src/controllers/browse.js ***! 4590 \***********************************/ 4591/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 4592 4593"use strict"; 4594__webpack_require__.r(__webpack_exports__); 4595/* harmony export */ __webpack_require__.d(__webpack_exports__, { 4596/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 4597/* harmony export */ }); 4598/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 4599/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 4600/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! axios */ "./node_modules/axios/lib/axios.js"); 4601/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router/dist/index.js"); 4602/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! classnames */ "./node_modules/classnames/index.js"); 4603/* harmony import */ var classnames__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__); 4604/* harmony import */ var _component_useFetchSvg__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../component/useFetchSvg */ "./src/component/useFetchSvg.js"); 4605function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } 4606function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap;
vendor: 5,446 bytes, line 4606
4606 var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEac
vendor: 4,725 bytes, lines 4606-4615
4606h(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; } 4607function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } } 4608function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } 4609function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } 4610function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } 4611function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } 4612function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); } 4613function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } 4614function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } 4615function _nonIterableRest() { throw new TypeError("Invalid attempt to de
4615structure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } 4616function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } 4617function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } 4618function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } 4619function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } 4620 4621 4622 4623 4624 4625 4626 // Import the custom hook 4627 4628var BrowseController = function BrowseController() { 4629 var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({ 4630 level: '', 4631 zone: '', 4632 floors: [], 4633 levelLoaded: false 4634 }), 4635 _useState2 = _slicedToArray(_useState, 2), 4636 browse = _useState2[0], 4637 setBrowse = _useState2[1]; 4638 var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)('Select A Level'), 4639 _useState4 = _slicedToArray(_useState3, 2), 4640 title = _useState4[0], 4641 setTitle = _useState4[1]; 4642 var _useState5 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)('All Levels'), 4643 _useState6 = _slicedToArray(_useState5, 2), 4644 levelTitle = _useState6[0], 4645 setLevelTitle = _useState6[1]; 4646 var location = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_3__.useLocation)(); 4647 var navigate = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_3__.useNavigate)(); 4648 4649 // Parse URL parameters 4650 var queryParams = new URLSearchParams(location.search); 4651 var level = queryParams.get('level') || ''; 4652 var zone = queryParams.get('zone') || ''; 4653 var _useState7 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({ 4654 params: { 4655 level: queryParams.get('level') || '2nd-level', 4656 zone: queryParams.get('zone') || '' 4657 } 4658 }), 4659 _useState8 = _slicedToArray(_useState7, 2), 4660 finder = _useState8[0], 4661 setFinder = _useState8[1]; 4662 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 4663 navigate({ 4664 pathname: '/browse', 4665 search: new URLSearchParams(finder.params).toString() 4666 }); 4667 }, [finder.params, navigate]); 4668 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 4669 setBrowse(function (prevBrowse) { 4670 return _objectSpread(_objectSpread({}, prevBrowse), {}, { 4671 level: level, 4672 zone: zone, 4673 floors: [] 4674 }); 4675 }); 4676 var data = { 4677 action: 'cg-vt-browse', 4678 model: 'location', 4679 level: level, 4680 zone: zone 4681 }; 4682 var newTitle = 'Select A Level'; 4683 if (data.level !== '' && data.zone !== '') { 4684 newTitle = 'Select A Room'; 4685 } else if (data.level !== '') { 4686 newTitle = 'Select A Zone'; 4687 } 4688 setTitle(newTitle); 4689 axios__WEBPACK_IMPORTED_MODULE_4__["default"].get('/wp-admin/admin-ajax.php', { 4690 params: data, 4691 cache: true 4692 }).then(function (response) { 4693 setBrowse(function (prevBrowse) { 4694 return _objectSpread(_objectSpread({}, prevBrowse), {}, { 4695 level: level, 4696 zone: zone, 4697 floors: response.data.data 4698 }); 4699 }); 4700 if (response.data.data.length === 1) { 4701 setLevelTitle(response.data.data[0].name); 4702 } 4703 })["catch"](function (error) { 4704 console.error('There was an error making the request:', error); 4705 }); 4706 }, [level, zone]); 4707 var floorClasses = function floorClasses() { 4708 var classes = []; 4709 if (zone !== '') { 4710 classes.push('zone'); 4711 classes.push("zone-".concat(zone)); 4712 } 4713 if (zone === '' && level !== '') { 4714 classes.push('level'); 4715 classes.push("level-".concat(level)); 4716 } 4717 if (level === '') { 4718 classes.push('levels'); 4719 } 4720 return classes.join(' '); 4721 };
4722 var renderSvgContent = function renderSvgContent(floor) { 4723 return { 4724 __html: floor.svgContent 4725 }; 4726 }; 4727 var svgLoaded = function svgLoaded() { 4728 setBrowse(function (prevBrowse) { 4729 return _objectSpread(_objectSpread({}, prevBrowse), {}, { 4730 levelLoaded: true 4731 }); 4732 }); 4733 }; 4734 var SvgContent = function SvgContent(_ref) { 4735 var url = _ref.url, 4736 floor = _ref.floor; 4737 var svgContent = (0,_component_useFetchSvg__WEBPACK_IMPORTED_MODULE_2__["default"])(url); 4738 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 4739 var handleClick = /*#__PURE__*/function () { 4740 var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(element) { 4741 var zone, roomId, customParams, _element$target, name, value, data; 4742 return _regeneratorRuntime().wrap(function _callee$(_context) { 4743 while (1) switch (_context.prev = _context.next) { 4744 case 0: 4745 console.log('element:', element); 4746 customParams = { 4747 userId: 123, 4748 theme: 'dark', 4749 showSidebar: true 4750 }; 4751 _element$target = element.target, name = _element$target.name, value = _element$target.value; 4752 if (!element.target.classList.contains('room')) { 4753 _context.next = 7; 4754 break; 4755 } 4756 roomId = element.target.id; 4757 window.location.href = '/rooms/' + roomId; 4758 return _context.abrupt("return"); 4759 case 7: 4760 if (element.target.classList.contains('zone')) { 4761 console.log('zone'); 4762 zone = element.target.dataset.zone; 4763 jQuery('.floor-plan-area').removeClass('levels'); 4764 jQuery('.floor-plan-area').addClass('zone'); 4765 } else { 4766 //console.log('not zone'); 4767 jQuery('.floor-plan-area').removeClass('zone'); 4768 jQuery('.floor-plan-area').addClass('levels'); 4769 } 4770 data = { 4771 action: 'cg-vt-browse', 4772 model: 'location', 4773 level: floor.slug, 4774 zone: zone 4775 }; 4776 axios__WEBPACK_IMPORTED_MODULE_4__["default"].get('/wp-admin/admin-ajax.php', { 4777 params: data, 4778 cache: true 4779 }).then(function (response) { 4780 //browse.level = floor.slug; 4781 console.log('response', response); 4782 console.log('floors:', response.data.data); 4783 browse.floors = response.data.data; 4784 setBrowse(function (prevBrowse) { 4785 return _objectSpread(_objectSpread({}, prevBrowse), {}, { 4786 level: floor.slug, 4787 floors: response.data.data 4788 }); 4789 }); 4790 if (response.data.data.length === 1) { 4791 console.log('SETTING LEVEL TITLE'); 4792 setLevelTitle(response.data.data[0].name); 4793 } 4794 console.log('floor:', response.data.data[0].slug); 4795 var slug = response.data.data[0].slug; 4796 if (slug == '2nd-level' || slug == '1st-level') { 4797 console.log('before'); 4798 jQuery('.floor-plan-area').addClass('level'); 4799 setFinder(function (prevFinder) { 4800 return _objectSpread(_objectSpread({}, prevFinder), {}, { 4801 params: { 4802 level: slug 4803 } 4804 }); 4805 }); 4806 console.log('after'); 4807 } else { 4808 jQuery('.floor-plan-area').removeClass('level'); 4809 } 4810 if (slug == 'exhibition-halls' || slug == 'ballrooms') { 4811 setFinder(function (prevFinder) { 4812 return _objectSpread(_objectSpread({}, prevFinder), {}, { 4813 params: { 4814 level: floor.slug, 4815 zone: slug 4816 } 4817 }); 4818 }); 4819 } 4820 jQuery(document).on("click", '.basic-info .close-info', function () { 4821 jQuery(this).closest('.basic-info').addClass('hidden'); 4822 }); 4823 jQuery(document).on("mouseover", '.zone', function () { 4824 jQuery(this).addClass('hover-area'); 4825 var zone = jQuery(this).attr('data-zone'); 4826 console.log('zone:', zone); 4827 jQuery(document).find('._360_pin').find('.basic-info').addClass('hidden'); 4828 jQuery(document).find('._360_pin').find('.' + zone).removeClass('hidden'); 4829 }); 4830 jQuery(document).on("mouseout", '.zone', function () { 4831 jQuery(this).removeClass('hover-area'); 4832 var zone = jQuery(this).attr('data-zone'); 4833 }); 4834 jQuery(document).on("mouseover", '.room', function () { 4835 jQuery(this).addClass('hover-area'); 4836 }); 4837 jQuery(document).on("mouseout", '.room', function () { 4838 jQuery(this).removeClass('hover-area'); 4839 }); 4840 })["catch"](function (error) { 4841 console.error('There was an error making the request:', error); 4842 }); 4843 case 10: 4844 case "end": 4845 return _context.stop(); 4846 } 4847 }, _callee); 4848 })); 4849 return function handleClick(_x) { 4850 return _ref2.apply(this, arguments); 4851 }; 4852 }(); 4853 var handleClickBack = /*#__PURE__*/function () { 4854 var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() { 4855 var data; 4856 return _regeneratorRuntime().wrap(function _callee2$(_context2) { 4857 while (1) switch (_context2.prev = _context2.next) { 4858 case 0: 4859 data = { 4860 action: 'cg-vt-browse', 4861 model: 'location', 4862 level: '', 4863 zone: '', 4864 floors: [] 4865 }; //const response = await axios.get('YOUR_API_ENDPOINT_HERE'); 4866 //console.log(response.data); 4867 axios__WEBPACK_IMPORTED_MODULE_4__["default"].get('/wp-admin/admin-ajax.php', { 4868 params: data, 4869 cache: true 4870 }).then(function (response) { 4871 console.log('response:', response); 4872 setBrowse(function (prevBrowse) { 4873 return _objectSpread(_objectSpread({}, prevBrowse), {}, { 4874 level: '', 4875 zone: '', 4876 floors: response.data.data 4877 }); 4878 }); 4879 setLevelTitle('All levels'); 4880 jQuery('.floor-plan-area').removeClass('level'); 4881 jQuery('.floor-plan-area').removeClass('zone'); 4882 jQuery('.floor-plan-area').addClass('levels'); 4883 })["catch"](function (error) { 4884 console.error('There was an error making the request:', error); 4885 }); 4886 case 2: 4887 case "end": 4888 return _context2.stop(); 4889 } 4890 }, _callee2); 4891 })); 4892 return function handleClickBack() { 4893 return _ref3.apply(this, arguments); 4894 }; 4895 }(); 4896 var element = document.querySelector("._".concat(floor.slug, ".floor-plan")); 4897 if (element) { 4898 element.addEventListener('click', handleClick); 4899 } 4900 var elementCta = document.querySelector("._".concat(floor.slug, ".floor-plan-cta")); 4901 if (elementCta) { 4902 console.log('add event listener button'); 4903 console.log('element:', element); 4904 elementCta.addEventListener('click', handleClick); 4905 } 4906 var backButton = document.querySelector('.back'); 4907 if (backButton) { 4908 backButton.addEventListener('click', handleClickBack); 4909 } 4910 4911 // const zone = document.querySelector(`.zone`); 4912 // if (element) { 4913 // element.addEventListener('click', handleClick); 4914 // } 4915 4916 // Clean up the event listener when the component unmounts or updates 4917 return function () { 4918 if (element) { 4919 element.removeEventListener('click', handleClick); 4920 } 4921 if (backButton) { 4922 backButton.removeEventListener('click', handleClickBack); 4923 } 4924 }; 4925 }, [floor.slug]); 4926 jQuery(document).on("click", '._360_view', function () { 4927 jQuery(this).closest('._360_pin').find('.custom-lightbox').addClass('active'); 4928 }); 4929 jQuery(document).on("click", '.custom-lightbox .close', function () { 4930 jQuery(this).closest('.custom-lightbox').removeClass('active'); 4931 }); 4932 jQuery(document).on("click", '.custom-lightbox .overlay', function () { 4933 jQuery(this).closest('.custom-lightbox').removeClass('active'); 4934 }); 4935 4936 // if( typeof( FOOBOX ) !== "undefined" ) { 4937 // FOOBOX.init(); 4938 // } 4939 4940 // jQuery("._360_pin span").fancybox(); 4941 4942 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4943 className: "_".concat(floor.slug, " floor-plan"), 4944 "data-floor": floor.slug, 4945 dangerouslySetInnerHTML: { 4946 __html: svgContent 4947 } 4948 })); 4949 }; 4950 4951 // function updateURLWithParams(params) { 4952 // // Get the current URL 4953 // const currentURL = new URL(window.location.href); 4954 4955 // // Add each parameter to the URL search parameters 4956 // for (const key in params) { 4957 // if (params.hasOwnProperty(key)) { 4958 // currentURL.searchParams.set(key, params[key]); 4959 // } 4960 // } 4961 4962 // // Use history.pushState to update the URL without reloading the page 4963 // window.history.pushState({}, '', currentURL.toString()); 4964 // } 4965 //jQuery('.floor-plan-area').find('.floor-plan').off('click', handleClick); 4966 4967 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4968 className: "floor-plan-nav" 4969 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4970 className: "row row-override" 4971 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4972 className: "columns small-12 text-center" 4973 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h2", null, levelTitle)))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4974 className: classnames__WEBPACK_IMPORTED_MODULE_1___default()('floor-plan-area u-max-width', floorClasses()) 4975 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4976 className: "row" 4977 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4978 className: "columns medium-8 medium-offset-2" 4979 }, browse.level === '' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { 4980 className: "text-center" 4981 }, "Please select a FLOOR to explore ZONE options."), browse.level !== '' && browse.zone === '' && browse.level !== '1st-level' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { 4982 className: "text-center" 4983 }, "Please select a ZONE to explore ROOM options.", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("br", null), "Hover over a zone for basic information. Select which zone you\u2019d like to explore room options in.")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4984 className: "columns medium-2 text-right" 4985 }, browse.zone === '' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("img", { 4986 src: "/wp-content/plugins/cobb-galleria-virtual-tour/assets/images/360-icon.png", 4987 alt: "360 icon" 4988 }))), browse.floors.map(function (floor) { 4989 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4990 key: floor.slug, 4991 className: "location u-max-width _".concat(floor.slug, " row"), 4992 "data-floor": floor.slug 4993 }, (floor.child_data || []).map(function (childFloor) { 4994 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4995 key: childFloor.slug, 4996 className: "_360_pin ".concat(browse.levelLoaded ? '' : 'u-hidden') 4997 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 4998 id: "lightbox-".concat(floor.slug), 4999 className: "custom-lightbox" 5000 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5001 className: "content" 5002 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("iframe", { 5003 src: childFloor._360_view 5004 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5005 className: "close" 5006 }, "X")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5007 className: "overlay" 5008 })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5009 "data-target": "#lightbox-".concat(floor.slug), 5010 className: "_360_view ".concat(childFloor.slug) 5011 }, childFloor.name), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5012 className: "child-floor basic-info hidden ".concat(childFloor.slug) 5013 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5014 className: "close-info", 5015 onClick: function onClick() { 5016 childFloor.show_info = false;
5017 } 5018 }, "x"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5019 className: "basic-info-title" 5020 }, childFloor.name), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5021 className: "info" 5022 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h4", null, "Basic Information"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { 5023 dangerouslySetInnerHTML: { 5024 __html: childFloor.basic_info 5025 } 5026 })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5027 className: "basic-info-footer" 5028 }, childFloor.type !== 'room' && childFloor.slug !== 'gallery' && childFloor.slug !== 'exhibition-halls' && childFloor.slug !== 'ballrooms' && childFloor.slug !== 'meeting-rooms' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5029 href: "/rooms/".concat(childFloor.slug) 5030 }, "View Zone Details ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5031 className: "fa fa-angle-double-right" 5032 })), childFloor.slug === 'gallery' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5033 href: "/rooms/".concat(childFloor.slug) 5034 }, "View Zone Details ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5035 className: "fa fa-angle-double-right" 5036 })), childFloor.slug === 'exhibition-halls' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5037 href: "/rooms/exhibit-hall" 5038 }, "View Zone Details ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5039 className: "fa fa-angle-double-right" 5040 })), childFloor.slug === 'meeting-rooms' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5041 href: "/rooms/meeting-room" 5042 }, "View Zone Details ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5043 className: "fa fa-angle-double-right" 5044 })), childFloor.slug === 'ballrooms' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5045 href: "/rooms/ballroom" 5046 }, "View Zone Details ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5047 className: "fa fa-angle-double-right" 5048 })), childFloor.type === 'room' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5049 href: "/rooms/".concat(childFloor.slug) 5050 }, "View Details Page ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5051 className: "fa fa-angle-double-right" 5052 }))))); 5053 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5054 className: "columns medium-3 text-center ".concat(browse.level === '' ? '' : 'hidden') 5055 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5056 className: "_".concat(floor.slug, " floor-plan-cta button"), 5057 onClick: function onClick() { 5058 handleClick; 5059 }, 5060 "data-floor": floor.slug 5061 }, floor.name), floor.description && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5062 className: "floor-desc" 5063 }, floor.description)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5064 className: classnames__WEBPACK_IMPORTED_MODULE_1___default()('columns', { 5065 'medium-9': browse.level === '', 5066 'small-12': browse.level !== '' || browse.zone !== '' 5067 }) 5068 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(SvgContent, { 5069 url: floor.floor_plan, 5070 floor: floor 5071 }), browse.levelLoaded && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5072 className: "level-shadow-background" 5073 }))); 5074 }))); 5075}; 5076/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (BrowseController); 5077 5078/***/ }), 5079
vendor: 3,101 bytes, lines 5080-5100
5080/***/ "./src/controllers/room-finder.js": 5081/*!****************************************!*\ 5082 !*** ./src/controllers/room-finder.js ***! 5083 \****************************************/ 5084/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 5085 5086"use strict"; 5087__webpack_require__.r(__webpack_exports__); 5088/* harmony export */ __webpack_require__.d(__webpack_exports__, { 5089/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 5090/* harmony export */ }); 5091/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 5092/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 5093/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! axios */ "./node_modules/axios/lib/axios.js"); 5094/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router/dist/index.js"); 5095function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } 5096function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } 5097function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } 5098function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } 5099function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } 5100function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap;
vendor: 5,446 bytes, line 5100
5100 var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEac
vendor: 4,725 bytes, lines 5100-5109
5100h(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; } 5101function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; } 5102function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } 5103function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } 5104function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); } 5105function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } 5106function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } } 5107function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } 5108function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } 5109function _nonIterableRest() { throw new TypeError("Invalid attempt to de
5109structure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } 5110function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } 5111function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } 5112function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } 5113function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } 5114 5115 5116 5117var RoomFinderController = function RoomFinderController() { 5118 var location = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_1__.useLocation)(); 5119 var navigate = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_1__.useNavigate)(); 5120 var params = new URLSearchParams(location.search); 5121 var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({ 5122 params: { 5123 event_type: params.get('event_type') || 'select', 5124 num_people: params.get('num_people') || '', 5125 num_booths: params.get('num_booths') || '', 5126 room_layout: params.get('room_layout') || 'select' 5127 }, 5128 rooms: {} 5129 }), 5130 _useState2 = _slicedToArray(_useState, 2), 5131 finder = _useState2[0], 5132 setFinder = _useState2[1]; 5133 var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(true), 5134 _useState4 = _slicedToArray(_useState3, 2), 5135 moreRecords = _useState4[0], 5136 setMoreRecords = _useState4[1]; 5137 var _useState5 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), 5138 _useState6 = _slicedToArray(_useState5, 2), 5139 ready = _useState6[0], 5140 setReady = _useState6[1]; 5141 var _useState7 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(2), 5142 _useState8 = _slicedToArray(_useState7, 2), 5143 page = _useState8[0], 5144 setPage = _useState8[1]; 5145 var configData = { 5146 action: 'cg-vt-finder', 5147 model: 'room', 5148 finder: true, 5149 page: 1 5150 }; 5151 var configDataIncremental = { 5152 action: 'cg-vt-finder', 5153 model: 'room', 5154 finder: true, 5155 page: page 5156 }; 5157 console.log('configData.page:', configData.page); 5158 5159 // const [terms, setTerms] = useState([]); 5160 var terms = ['banquet', 'convention', 'job-fair', 'meeting', 'reception', 'trade-showexpoconsumer', 'wedding']; 5161 var roomLayouts = ['theater', 'classroom', 'banquet', 'reception']; 5162 var roomTypes = ['exhibition_hall', 'ballroom', 'meeting_room']; 5163 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 5164 var fetchData = /*#__PURE__*/function () { 5165 var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() { 5166 var response; 5167 return _regeneratorRuntime().wrap(function _callee$(_context) { 5168 while (1) switch (_context.prev = _context.next) { 5169 case 0: 5170 _context.prev = 0; 5171 _context.next = 3; 5172 return axios__WEBPACK_IMPORTED_MODULE_2__["default"].get('/wp-admin/admin-ajax.php', { 5173 params: _objectSpread(_objectSpread({}, configData), finder.params) 5174 }); 5175 case 3: 5176 response = _context.sent; 5177 setReady(true); 5178 setFinder(function (prevFinder) { 5179 return _objectSpread(_objectSpread({}, prevFinder), {}, { 5180 rooms: response.data 5181 }); 5182 }); 5183 setMoreRecords(response.data.more_records); 5184 _context.next = 12; 5185 break; 5186 case 9: 5187 _context.prev = 9; 5188 _context.t0 = _context["catch"](0); 5189 console.error('Error fetching room finder data:', _context.t0); 5190 case 12: 5191 case "end": 5192 return _context.stop(); 5193 } 5194 }, _callee, null, [[0, 9]]); 5195 })); 5196 return function fetchData() { 5197 return _ref.apply(this, arguments); 5198 }; 5199 }(); 5200 fetchData(); 5201 }, []); 5202 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 5203 var fetchData = /*#__PURE__*/function () { 5204 var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() { 5205 var response; 5206 return _regeneratorRuntime().wrap(function _callee2$(_context2) { 5207 while (1) switch (_context2.prev = _context2.next) { 5208 case 0: 5209 _context2.prev = 0; 5210 _context2.next = 3; 5211 return axios__WEBPACK_IMPORTED_MODULE_2__["default"].get('/wp-admin/admin-ajax.php', { 5212 params: _objectSpread(_objectSpread({}, configData), finder.params) 5213 }); 5214 case 3: 5215 response = _context2.sent; 5216 setFinder(function (prevFinder) { 5217 return _objectSpread(_objectSpread({}, prevFinder), {}, { 5218 rooms: response.data 5219 }); 5220 }); 5221 setMoreRecords(response.data.more_records); 5222 _context2.next = 11; 5223 break; 5224 case 8: 5225 _context2.prev = 8; 5226 _context2.t0 = _context2["catch"](0); 5227 console.error('Error fetching room finder data:', _context2.t0); 5228 case 11: 5229 case "end": 5230 return _context2.stop(); 5231 } 5232 }, _callee2, null, [[0, 8]]); 5233 })); 5234 return function fetchData() { 5235 return _ref2.apply(this, arguments); 5236 }; 5237 }(); 5238 if (ready) { 5239 fetchData(); 5240 } 5241 }, [finder.params]); 5242 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 5243 navigate({ 5244 pathname: '/room-finder', 5245 search: new URLSearchParams(finder.params).toString() 5246 }); 5247 }, [finder.params, navigate]); 5248 var handleParamsChange = function handleParamsChange(newParams) { 5249 if (ready) { 5250 var canceler = axios__WEBPACK_IMPORTED_MODULE_2__["default"].CancelToken.source(); 5251 configData.page = 1; 5252 if (newParams.event_type !== 'trade-showexpoconsumer' && newParams.event_type !== 'job-fair') { 5253 delete newParams.num_booths; 5254 } else { 5255 delete newParams.num_people; 5256 delete newParams.room_layout; 5257 } 5258 var fetchData = /*#__PURE__*/function () { 5259 var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() { 5260 var response; 5261 return _regeneratorRuntime().wrap(function _callee3$(_context3) { 5262 while (1) switch (_context3.prev = _context3.next) { 5263 case 0: 5264 _context3.prev = 0; 5265 _context3.next = 3; 5266 return axios__WEBPACK_IMPORTED_MODULE_2__["default"].get('/wp-admin/admin-ajax.php', { 5267 params: _objectSpread(_objectSpread({}, configData), newParams), 5268 cancelToken: canceler.token 5269 }); 5270 case 3: 5271 response = _context3.sent; 5272 setFinder(function (prevFinder) { 5273 return _objectSpread(_objectSpread({}, prevFinder), {}, { 5274 rooms: response.data 5275 }); 5276 }); 5277 setMoreRecords(response.data.more_records); 5278 _context3.next = 11; 5279 break; 5280 case 8: 5281 _context3.prev = 8; 5282 _context3.t0 = _context3["catch"](0); 5283 if (axios__WEBPACK_IMPORTED_MODULE_2__["default"].isCancel(_context3.t0)) { 5284 console.log('Request canceled:', _context3.t0.message); 5285 } else { 5286 console.error('Error fetching room finder data:', _context3.t0); 5287 } 5288 case 11: 5289 case "end": 5290 return _context3.stop(); 5291 } 5292 }, _callee3, null, [[0, 8]]); 5293 })); 5294 return function fetchData() { 5295 return _ref3.apply(this, arguments); 5296 }; 5297 }(); 5298 fetchData(); 5299 return function () { 5300 return canceler.cancel('Request canceled by cleanup'); 5301 }; 5302 } 5303 }; 5304 var handleInputChange = function handleInputChange(event) { 5305 console.log('change'); 5306 setPage(2); 5307 var _event$target = event.target, 5308 name = _event$target.name, 5309 value = _event$target.value; 5310 setFinder(function (prevFinder) { 5311 return _objectSpread(_objectSpread({}, prevFinder), {}, { 5312 params: _objectSpread(_objectSpread({}, prevFinder.params), {}, _defineProperty({}, name, value)) 5313 }); 5314 }); 5315 }; 5316 var loadMoreRooms = function loadMoreRooms() { 5317 // configData.page += 1; 5318 setPage(function (prevPage) { 5319 return prevPage + 1; 5320 }); 5321 console.log('configData.page testing', configData.page); 5322 axios__WEBPACK_IMPORTED_MODULE_2__["default"].get('/wp-admin/admin-ajax.php', { 5323 params: _objectSpread(_objectSpread({}, configDataIncremental), finder.params) 5324 }).then(function (response) { 5325 var newData = response.data; 5326 setFinder(function (prevFinder) { 5327 var updatedRooms = _objectSpread({}, prevFinder.rooms); 5328 for (var prop in newData) { 5329 if (prop !== 'more_records') { 5330 updatedRooms[prop] = [].concat(_toConsumableArray(updatedRooms[prop] || []), _toConsumableArray(newData[prop])); 5331 } 5332 } 5333 return _objectSpread(_objectSpread({}, prevFinder), {}, { 5334 rooms: updatedRooms 5335 }); 5336 }); 5337 setMoreRecords(newData.more_records); 5338 })["catch"](function (error) { 5339 console.error('Error fetching more rooms:', error); 5340 }); 5341 }; 5342 var renderHtml = function renderHtml(htmlCode) { 5343 return { 5344 __html: htmlCode 5345 }; 5346 }; 5347 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5348 className: "roomFinderController" 5349 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5350 className: "floor-plan-nav" 5351 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5352 className: "text-center" 5353 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h2", null, "Room finder"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5354 className: "tooltip-cta" 5355 }, "i"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5356 className: "tooltip-text" 5357 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "The room finder tool provides an overview of rooms that MAY be appropriate for your event."), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "Search results are approximations, and you must contact a sales manager to provide specific event requirements, and to research date availability.")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5358 className: "room-finder-container row u-max-width" 5359 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5360 className: "small-12" 5361 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5362 className: "finder-options" 5363 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5364 className: "row u-max-width" 5365 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5366 className: "columns large-4 option events" 5367 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { 5368 htmlFor: "cg-vt-event-type" 5369 }, "Type of Event"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("select", { 5370 id: "cg-vt-event-type", 5371 name: "event_type", 5372 value: finder.params.event_type, 5373 onChange: handleInputChange 5374 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("option", { 5375 value: "select" 5376 }, "Select..."), terms.map(function (term) { 5377 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("option", { 5378 key: term, 5379 value: term 5380 }, ucwords(term.replace("_", " ").replace("trade-showexpoconsumer", "Trade Show/Expo/Consumer"))); 5381 }))), !(finder.params.event_type === 'trade-showexpoconsumer' || finder.params.event_type === 'job-fair') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5382 className: "columns large-4 option num-people" 5383 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { 5384 htmlFor: "cg-vt-number-people" 5385 }, "Number of People"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("input", { 5386 type: "text", 5387 id: "cg-vt-number-people", 5388 name: "num_people", 5389 placeholder: "Approx. # of guests?", 5390 value: finder.params.num_people, 5391 onChange: handleInputChange 5392 })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
5393 className: "columns large-4 option room-layout" 5394 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { 5395 htmlFor: "cg-vt-room-layout" 5396 }, "Desired Room Layout"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("select", { 5397 id: "cg-vt-room-layout", 5398 name: "room_layout", 5399 value: finder.params.room_layout, 5400 onChange: handleInputChange 5401 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("option", { 5402 value: "select" 5403 }, "Select..."), roomLayouts.map(function (layout) { 5404 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("option", { 5405 key: layout, 5406 value: layout 5407 }, ucwords(layout.replace("_", " "))); 5408 })))), (finder.params.event_type === 'trade-showexpoconsumer' || finder.params.event_type === 'job-fair') && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5409 className: "columns medium-8 option num-booths" 5410 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("label", { 5411 htmlFor: "cg-vt-number-booth" 5412 }, "Number of Booth(s)"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("input", { 5413 type: "text", 5414 id: "cg-vt-number-booth", 5415 name: "num_booths", 5416 value: finder.params.num_booths, 5417 onChange: handleInputChange 5418 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5419 className: "fa fa-2x fa-angle-left" 5420 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5421 className: "text" 5422 }, "Specify the number of 10x10 booths", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("br", null), "needed for your event."))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5423 className: "small-12 hide-for-small-only" 5424 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5425 className: "room-type-titles" 5426 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5427 className: "row u-max-width" 5428 }, roomTypes.map(function (roomType) { 5429 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5430 key: roomType, 5431 className: "room-type columns medium-4" 5432 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", null, ucwords(roomType.replace("_", " ")), "s")); 5433 })))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5434 className: "columns small-12" 5435 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5436 className: "rooms row u-max-width" 5437 }, roomTypes.map(function (roomType) { 5438 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5439 key: roomType, 5440 className: "room-column ".concat(roomType, " columns medium-4") 5441 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5442 className: "room-type-header show-for-small-only" 5443 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h3", null, ucwords(roomType.replace("_", " ")), "s")), (finder.rooms[roomType] || []).map(function (room) { 5444 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5445 key: room.post_name, 5446 className: "room-info" 5447 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5448 className: "room-title text-center", 5449 href: "/rooms/".concat(room.post_name) 5450 }, room.post_title), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5451 className: "room-basic-info" 5452 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5453 className: "basic-info-toggle text-center" 5454 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5455 className: "fa fa-angle-right" 5456 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("i", { 5457 className: "fa fa-angle-up" 5458 }), "Basic Information"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { 5459 className: "info" 5460 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5461 dangerouslySetInnerHTML: { 5462 __html: room.basic_info 5463 } 5464 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5465 className: "find-out-more", 5466 href: "/rooms/".concat(room.post_name) 5467 }, "Find out more")))); 5468 })); 5469 }))), moreRecords && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5470 className: "columns small-12" 5471 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5472 className: "more-rooms text-center" 5473 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5474 className: "more-rooms-cta", 5475 onClick: loadMoreRooms 5476 }, "Load More Rooms"))))); 5477}; 5478/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (RoomFinderController); 5479 5480// Helper function to convert underscores to spaces and capitalize words 5481function ucwords(str) { 5482 return str.replace(/_/g, ' ').replace(/\b\w/g, function (_char) { 5483 return _char.toUpperCase(); 5484 }); 5485} 5486 5487/***/ }), 5488
vendor: 2,477 bytes, lines 5489-5505
5489/***/ "./src/controllers/room.js": 5490/*!*********************************!*\ 5491 !*** ./src/controllers/room.js ***! 5492 \*********************************/ 5493/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 5494 5495"use strict"; 5496__webpack_require__.r(__webpack_exports__); 5497/* harmony export */ __webpack_require__.d(__webpack_exports__, { 5498/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 5499/* harmony export */ }); 5500/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 5501/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 5502/* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router/dist/index.js"); 5503/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! axios */ "./node_modules/axios/lib/axios.js"); 5504function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } 5505function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap;
vendor: 5,446 bytes, line 5505
5505 var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEac
vendor: 5,614 bytes, lines 5505-5541
5505h(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; } 5506function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } } 5507function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; } 5508function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } 5509function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } 5510function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } 5511function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; } 5512function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } 5513function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } 5514 5515 5516 5517 5518var renderHtml = function renderHtml(html) { 5519 return { 5520 __html: html 5521 }; 5522}; 5523var formatSize = function formatSize(size) { 5524 return "".concat(size, " sq ft"); 5525}; 5526var RoomController = function RoomController() { 5527 var _useParams = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_1__.useParams)(), 5528 room = _useParams.room; 5529 var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)('main'), 5530 _useState2 = _slicedToArray(_useState, 2), 5531 selectedLayout = _useState2[0], 5532 setSelectedLayout = _useState2[1]; 5533 var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({}), 5534 _useState4 = _slicedToArray(_useState3, 2), 5535 roomData = _useState4[0], 5536 setRoomData = _useState4[1]; 5537 var location = (0,react_router_dom__WEBPACK_IMPORTED_MODULE_1__.useLocation)(); 5538 5539 // Parse URL parameters 5540 var queryParams = new URLSearchParams(location.search); 5541 var roomParam = queryParams.get('room') || '';
5542 console.log('roomParam:', roomParam); 5543 var data = { 5544 action: 'cg-vt-room', 5545 model: 'room', 5546 room: roomParam 5547 }; 5548 (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () { 5549 var fetchData = /*#__PURE__*/function () { 5550 var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() { 5551 var response; 5552 return _regeneratorRuntime().wrap(function _callee$(_context) { 5553 while (1) switch (_context.prev = _context.next) { 5554 case 0: 5555 _context.prev = 0; 5556 _context.next = 3; 5557 return axios__WEBPACK_IMPORTED_MODULE_2__["default"].get('/wp-admin/admin-ajax.php', { 5558 params: data 5559 }); 5560 case 3: 5561 response = _context.sent; 5562 setRoomData(response.data[0]); 5563 if (typeof FOOBOX !== 'undefined') { 5564 FOOBOX.init(); 5565 } 5566 _context.next = 11; 5567 break; 5568 case 8: 5569 _context.prev = 8; 5570 _context.t0 = _context["catch"](0); 5571 console.error('Error fetching room data:', _context.t0); 5572 case 11: 5573 case "end": 5574 return _context.stop(); 5575 } 5576 }, _callee, null, [[0, 8]]); 5577 })); 5578 return function fetchData() { 5579 return _ref.apply(this, arguments); 5580 }; 5581 }(); 5582 fetchData(); 5583 }, [room]); 5584 var renderHtml = function renderHtml(htmlCode) { 5585 return { 5586 __html: htmlCode 5587 }; 5588 }; 5589 var formatSize = function formatSize(roomSize) { 5590 if (!roomSize) return ''; 5591 var output = ''; 5592 if (roomSize.l && roomSize.w) { 5593 output = "".concat(roomSize.l, " x ").concat(roomSize.w); 5594 } 5595 if (roomSize.gsf) { 5596 output += " ".concat(roomSize.gsf, " GSF"); 5597 } 5598 return output; 5599 }; 5600 var updateLayout = function updateLayout(key) { 5601 if (roomData.svgs[key]) { 5602 setSelectedLayout(key); 5603 } 5604 }; 5605 var emptySvgs = function emptySvgs() { 5606 return Array.isArray(roomData.svgs); 5607 }; 5608 var emptyProp = function emptyProp(layout) { 5609 return roomData[layout] !== undefined && roomData[layout] !== ''; 5610 }; 5611 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { 5612 className: "small-text" 5613 }, "*Room capacities are based on maximum set with minimal consideration for additional equipment. Requirements for audiovisual and presentation equipment, food service sets, stage, risers, etc. will decrease the capacity accordingly. Rooms can only be reserved by contacting a ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5614 href: "/atlanta-event-planners/book-your-event/" 5615 }, "sales manager"), "."), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5616 className: "row room-inner u-max-width" 5617 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5618 className: "columns medium-6" 5619 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5620 className: "room-content" 5621 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h2", null, roomData.post_title, " ROOM"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", { 5622 dangerouslySetInnerHTML: renderHtml(roomData.post_content) 5623 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5624 className: "size-info" 5625 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("img", { 5626 src: "/wp-content/plugins/cobb-galleria-virtual-tour/assets/images/size-icon.png", 5627 alt: "Size Icon" 5628 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5629 className: "title" 5630 }, "Size: "), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5631 className: "room-info", 5632 dangerouslySetInnerHTML: renderHtml(formatSize(roomData.room_size)) 5633 }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5634 className: "inside-room ".concat(!emptyProp('photo_gallery') && !emptyProp('_360_view') ? '' : 'ng-hide') 5635 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h4", null, "Look inside this room"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5636 className: "photo-gallery row ".concat(emptyProp('photo_gallery') ? '' : 'ng-hide') 5637 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5638 className: "columns small-3 text-center" 5639 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5640 href: "#room-gallery", 5641 className: roomData.photo_gallery ? '' : 'disabled' 5642 }, "Photo Gallery"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5643 id: "room-gallery", 5644 style: { 5645 display: 'none' 5646 }, 5647 dangerouslySetInnerHTML: renderHtml(roomData.photo_gallery) 5648 })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5649 className: "columns small-9" 5650 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "View photos of this space in a variety of room sets and event types."))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5651 className: "_360-view row ".concat(emptyProp('_360_view') ? '' : 'ng-hide') 5652 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5653 className: "columns small-3 text-center" 5654 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", { 5655 href: roomData._360_view, 5656 className: "foobox", 5657 target: "foobox" 5658 }, "360\xB0 View")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5659 className: "columns small-9" 5660 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", null, "Walk through this event space, take a look around, and check out the whole venue, while you're at it!"))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5661 className: "columns medium-6" 5662 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5663 className: "capacity-info text-center" 5664 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5665 className: "row" 5666 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5667 className: "columns small-12" 5668 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5669 className: "table-row" 5670 }, ['Theater', 'Classroom', 'Banquet', 'Reception'].map(function (layout) { 5671 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5672 key: layout, 5673 className: "table-cell small-3 room-selector ".concat(layout.toLowerCase()), 5674 onClick: function onClick() { 5675 return updateLayout(layout); 5676 } 5677 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("h5", null, layout === 'T' ? 'Theater' : layout === 'C' ? 'Classroom' : layout === 'B' ? 'Banquet' : 'Reception'), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("img", { 5678 src: "/wp-content/plugins/cobb-galleria-virtual-tour/assets/images/".concat(layout.toLowerCase(), "-icon.svg"), 5679 alt: "".concat(layout, " Icon") 5680 }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5681 className: "room-info" 5682 }, layout === 'T' && roomData.theater_num, layout === 'C' && roomData.classroom_num, layout === 'B' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5683 style: { 5684 display: roomData.banquet_10_num ? 'block' : 'none' 5685 } 5686 }, "Rounds of 10-", roomData.banquet_10_num), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("span", { 5687 style: { 5688 display: roomData.banquet_12_num ? 'block' : 'none' 5689 } 5690 }, "Rounds of 12-", roomData.banquet_12_num)), layout === 'R' && roomData.reception_num)); 5691 }))))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { 5692 className: "room-svg-container" 5693 })))); 5694}; 5695/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (RoomController); 5696 5697/***/ }), 5698
vendor: 1,026,590 bytes, lines 5699-35572
5699/***/ "./node_modules/react-dom/cjs/react-dom.development.js": 5700/*!*************************************************************!*\ 5701 !*** ./node_modules/react-dom/cjs/react-dom.development.js ***! 5702 \*************************************************************/ 5703/***/ ((__unused_webpack_module, exports, __webpack_require__) => { 5704 5705"use strict"; 5706/** 5707 * @license React 5708 * react-dom.development.js 5709 * 5710 * Copyright (c) Facebook, Inc. and its affiliates. 5711 * 5712 * This source code is licensed under the MIT license found in the 5713 * LICENSE file in the root directory of this source tree. 5714 */ 5715 5716 5717 5718if (true) { 5719 (function() { 5720 5721 'use strict'; 5722 5723/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 5724if ( 5725 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && 5726 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart === 5727 'function' 5728) { 5729 __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error()); 5730} 5731 var React = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 5732var Scheduler = __webpack_require__(/*! scheduler */ "./node_modules/scheduler/index.js"); 5733 5734var ReactSharedInternals = React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; 5735 5736var suppressWarning = false; 5737function setSuppressWarning(newSuppressWarning) { 5738 { 5739 suppressWarning = newSuppressWarning; 5740 } 5741} // In DEV, calls to console.warn and console.error get replaced 5742// by calls to these methods by a Babel plugin. 5743// 5744// In PROD (or in packages without access to React internals), 5745// they are left as they are instead. 5746 5747function warn(format) { 5748 { 5749 if (!suppressWarning) { 5750 for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { 5751 args[_key - 1] = arguments[_key]; 5752 } 5753 5754 printWarning('warn', format, args); 5755 } 5756 } 5757} 5758function error(format) { 5759 { 5760 if (!suppressWarning) { 5761 for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) { 5762 args[_key2 - 1] = arguments[_key2]; 5763 } 5764 5765 printWarning('error', format, args); 5766 } 5767 } 5768} 5769 5770function printWarning(level, format, args) { 5771 // When changing this logic, you might want to also 5772 // update consoleWithStackDev.www.js as well. 5773 { 5774 var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame; 5775 var stack = ReactDebugCurrentFrame.getStackAddendum(); 5776 5777 if (stack !== '') { 5778 format += '%s'; 5779 args = args.concat([stack]); 5780 } // eslint-disable-next-line react-internal/safe-string-coercion 5781 5782 5783 var argsWithFormat = args.map(function (item) { 5784 return String(item); 5785 }); // Careful: RN currently depends on this prefix 5786 5787 argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it 5788 // breaks IE9: https://github.com/facebook/react/issues/13610 5789 // eslint-disable-next-line react-internal/no-production-logging 5790 5791 Function.prototype.apply.call(console[level], console, argsWithFormat); 5792 } 5793} 5794 5795var FunctionComponent = 0; 5796var ClassComponent = 1; 5797var IndeterminateComponent = 2; // Before we know whether it is function or class 5798 5799var HostRoot = 3; // Root of a host tree. Could be nested inside another node. 5800 5801var HostPortal = 4; // A subtree. Could be an entry point to a different renderer. 5802 5803var HostComponent = 5; 5804var HostText = 6; 5805var Fragment = 7; 5806var Mode = 8; 5807var ContextConsumer = 9; 5808var ContextProvider = 10; 5809var ForwardRef = 11; 5810var Profiler = 12; 5811var SuspenseComponent = 13; 5812var MemoComponent = 14; 5813var SimpleMemoComponent = 15; 5814var LazyComponent = 16; 5815var IncompleteClassComponent = 17; 5816var DehydratedFragment = 18; 5817var SuspenseListComponent = 19; 5818var ScopeComponent = 21; 5819var OffscreenComponent = 22; 5820var LegacyHiddenComponent = 23; 5821var CacheComponent = 24; 5822var TracingMarkerComponent = 25; 5823 5824// ----------------------------------------------------------------------------- 5825 5826var enableClientRenderFallbackOnTextMismatch = true; // TODO: Need to review this code one more time before landing 5827// the react-reconciler package. 5828 5829var enableNewReconciler = false; // Support legacy Primer support on internal FB www 5830 5831var enableLazyContextPropagation = false; // FB-only usage. The new API has different semantics. 5832 5833var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber 5834 5835var enableSuspenseAvoidThisFallback = false; // Enables unstable_avoidThisFallback feature in Fizz 5836// React DOM Chopping Block 5837// 5838// Similar to main Chopping Block but only flags related to React DOM. These are 5839// grouped because we will likely batch all of them into a single major release. 5840// ----------------------------------------------------------------------------- 5841// Disable support for comment nodes as React DOM containers. Already disabled 5842// in open source, but www codebase still relies on it. Need to remove. 5843 5844var disableCommentsAsDOMContainers = true; // Disable javascript: URL strings in href for XSS protection. 5845// and client rendering, mostly to allow JSX attributes to apply to the custom 5846// element's object properties instead of only HTML attributes. 5847// https://github.com/facebook/react/issues/11347 5848 5849var enableCustomElementPropertySupport = false; // Disables children for <textarea> elements 5850var warnAboutStringRefs = false; // ----------------------------------------------------------------------------- 5851// Debugging and DevTools 5852// ----------------------------------------------------------------------------- 5853// Adds user timing marks for e.g. state updates, suspense, and work loop stuff, 5854// for an experimental timeline tool. 5855 5856var enableSchedulingProfiler = true; // Helps identify side effects in render-phase lifecycle hooks and setState 5857 5858var enableProfilerTimer = true; // Record durations for commit and passive effects phases. 5859 5860var enableProfilerCommitHooks = true; // Phase param passed to onRender callback differentiates between an "update" and a "cascading-update". 5861 5862var allNativeEvents = new Set(); 5863/** 5864 * Mapping from registration name to event name 5865 */ 5866 5867 5868var registrationNameDependencies = {}; 5869/** 5870 * Mapping from lowercase registration names to the properly cased version, 5871 * used to warn in the case of missing event handlers. Available 5872 * only in true. 5873 * @type {Object} 5874 */ 5875 5876var possibleRegistrationNames = {} ; // Trust the developer to only use possibleRegistrationNames in true 5877 5878function registerTwoPhaseEvent(registrationName, dependencies) { 5879 registerDirectEvent(registrationName, dependencies); 5880 registerDirectEvent(registrationName + 'Capture', dependencies); 5881} 5882function registerDirectEvent(registrationName, dependencies) { 5883 { 5884 if (registrationNameDependencies[registrationName]) { 5885 error('EventRegistry: More than one plugin attempted to publish the same ' + 'registration name, `%s`.', registrationName); 5886 } 5887 } 5888 5889 registrationNameDependencies[registrationName] = dependencies; 5890 5891 { 5892 var lowerCasedName = registrationName.toLowerCase(); 5893 possibleRegistrationNames[lowerCasedName] = registrationName; 5894 5895 if (registrationName === 'onDoubleClick') { 5896 possibleRegistrationNames.ondblclick = registrationName; 5897 } 5898 } 5899 5900 for (var i = 0; i < dependencies.length; i++) { 5901 allNativeEvents.add(dependencies[i]); 5902 } 5903} 5904 5905var canUseDOM = !!(typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined'); 5906 5907var hasOwnProperty = Object.prototype.hasOwnProperty; 5908 5909/* 5910 * The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol 5911 * and Temporal.* types. See https://github.com/facebook/react/pull/22064. 5912 * 5913 * The functions in this module will throw an easier-to-understand, 5914 * easier-to-debug exception with a clear errors message message explaining the 5915 * problem. (Instead of a confusing exception thrown inside the implementation 5916 * of the `value` object). 5917 */ 5918// $FlowFixMe only called in DEV, so void return is not possible. 5919function typeName(value) { 5920 { 5921 // toStringTag is needed for namespaced types like Temporal.Instant 5922 var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag; 5923 var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object'; 5924 return type; 5925 } 5926} // $FlowFixMe only called in DEV, so void return is not possible. 5927 5928 5929function willCoercionThrow(value) { 5930 { 5931 try { 5932 testStringCoercion(value); 5933 return false; 5934 } catch (e) { 5935 return true; 5936 } 5937 } 5938} 5939 5940function testStringCoercion(value) { 5941 // If you ended up here by following an exception call stack, here's what's 5942 // happened: you supplied an object or symbol value to React (as a prop, key, 5943 // DOM attribute, CSS property, string ref, etc.) and when React tried to 5944 // coerce it to a string using `'' + value`, an exception was thrown. 5945 // 5946 // The most common types that will cause this exception are `Symbol` instances 5947 // and Temporal objects like `Temporal.Instant`. But any object that has a 5948 // `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this 5949 // exception. (Library authors do this to prevent users from using built-in 5950 // numeric operators like `+` or comparison operators like `>=` because custom 5951 // methods are needed to perform accurate arithmetic or comparison.) 5952 // 5953 // To fix the problem, coerce this object or symbol value to a string before 5954 // passing it to React. The most reliable way is usually `String(value)`. 5955 // 5956 // To find which value is throwing, check the browser or debugger console. 5957 // Before this exception was thrown, there should be `console.error` output 5958 // that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the 5959 // problem and how that type was used: key, atrribute, input value prop, etc. 5960 // In most cases, this console output also shows the component and its 5961 // ancestor components where the exception happened. 5962 // 5963 // eslint-disable-next-line react-internal/safe-string-coercion 5964 return '' + value; 5965} 5966 5967function checkAttributeStringCoercion(value, attributeName) { 5968 { 5969 if (willCoercionThrow(value)) { 5970 error('The provided `%s` attribute is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', attributeName, typeName(value)); 5971 5972 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 5973 } 5974 } 5975} 5976function checkKeyStringCoercion(value) { 5977 { 5978 if (willCoercionThrow(value)) { 5979 error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value)); 5980 5981 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 5982 } 5983 } 5984} 5985function checkPropStringCoercion(value, propName) { 5986 { 5987 if (willCoercionThrow(value)) { 5988 error('The provided `%s` prop is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', propName, typeName(value)); 5989 5990 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 5991 } 5992 } 5993} 5994function checkCSSPropertyStringCoercion(value, propName) { 5995 { 5996 if (willCoercionThrow(value)) { 5997 error('The provided `%s` CSS property is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', propName, typeName(value)); 5998 5999 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 6000 } 6001 } 6002} 6003function checkHtmlStringCoercion(value) { 6004 { 6005 if (willCoercionThrow(value)) { 6006 error('The provided HTML markup uses a value of unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value)); 6007 6008 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 6009 } 6010 } 6011} 6012function checkFormFieldValueStringCoercion(value) { 6013 { 6014 if (willCoercionThrow(value)) { 6015 error('Form field values (value, checked, defaultValue, or defaultChecked props)' + ' must be strings, not %s.' + ' This value must be coerced to a string before before using it here.', typeName(value)); 6016 6017 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 6018 } 6019 } 6020} 6021 6022// A reserved attribute. 6023// It is handled by React separately and shouldn't be written to the DOM. 6024var RESERVED = 0; // A simple string attribute. 6025// Attributes that aren't in the filter are presumed to have this type. 6026 6027var STRING = 1; // A string attribute that accepts booleans in React. In HTML, these are called 6028// "enumerated" attributes with "true" and "false" as possible values. 6029// When true, it should be set to a "true" string. 6030// When false, it should be set to a "false" string. 6031 6032var BOOLEANISH_STRING = 2; // A real boolean attribute. 6033// When true, it should be present (set either to an empty string or its name). 6034// When false, it should be omitted. 6035 6036var BOOLEAN = 3; // An attribute that can be used as a flag as well as with a value. 6037// When true, it should be present (set either to an empty string or its name). 6038// When false, it should be omitted. 6039// For any other value, should be present with that value. 6040 6041var OVERLOADED_BOOLEAN = 4; // An attribute that must be numeric or parse as a numeric. 6042// When falsy, it should be removed. 6043 6044var NUMERIC = 5; // An attribute that must be positive numeric or parse as a positive numeric. 6045// When falsy, it should be removed. 6046 6047var POSITIVE_NUMERIC = 6; 6048 6049/* eslint-disable max-len */ 6050var ATTRIBUTE_NAME_START_CHAR = ":A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD"; 6051/* eslint-enable max-len */ 6052 6053var ATTRIBUTE_NAME_CHAR = ATTRIBUTE_NAME_START_CHAR + "\\-.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040"; 6054var VALID_ATTRIBUTE_NAME_REGEX = new RegExp('^[' + ATTRIBUTE_NAME_START_CHAR + '][' + ATTRIBUTE_NAME_CHAR + ']*$'); 6055var illegalAttributeNameCache = {}; 6056var validatedAttributeNameCache = {}; 6057function isAttributeNameSafe(attributeName) { 6058 if (hasOwnProperty.call(validatedAttributeNameCache, attributeName)) { 6059 return true; 6060 } 6061 6062 if (hasOwnProperty.call(illegalAttributeNameCache, attributeName)) { 6063 return false; 6064 } 6065 6066 if (VALID_ATTRIBUTE_NAME_REGEX.test(attributeName)) { 6067 validatedAttributeNameCache[attributeName] = true; 6068 return true; 6069 } 6070 6071 illegalAttributeNameCache[attributeName] = true; 6072 6073 { 6074 error('Invalid attribute name: `%s`', attributeName); 6075 } 6076 6077 return false; 6078} 6079function shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag) { 6080 if (propertyInfo !== null) { 6081 return propertyInfo.type === RESERVED; 6082 } 6083 6084 if (isCustomComponentTag) { 6085 return false; 6086 } 6087 6088 if (name.length > 2 && (name[0] === 'o' || name[0] === 'O') && (name[1] === 'n' || name[1] === 'N')) { 6089 return true; 6090 } 6091 6092 return false; 6093} 6094function shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag) { 6095 if (propertyInfo !== null && propertyInfo.type === RESERVED) { 6096 return false; 6097 } 6098 6099 switch (typeof value) { 6100 case 'function': // $FlowIssue symbol is perfectly valid here 6101 6102 case 'symbol': 6103 // eslint-disable-line 6104 return true; 6105 6106 case 'boolean': 6107 { 6108 if (isCustomComponentTag) { 6109 return false; 6110 } 6111 6112 if (propertyInfo !== null) { 6113 return !propertyInfo.acceptsBooleans; 6114 } else { 6115 var prefix = name.toLowerCase().slice(0, 5); 6116 return prefix !== 'data-' && prefix !== 'aria-'; 6117 } 6118 } 6119 6120 default: 6121 return false; 6122 } 6123} 6124function shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag) { 6125 if (value === null || typeof value === 'undefined') { 6126 return true; 6127 } 6128 6129 if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, isCustomComponentTag)) { 6130 return true; 6131 } 6132 6133 if (isCustomComponentTag) { 6134 6135 return false; 6136 } 6137 6138 if (propertyInfo !== null) { 6139 6140 switch (propertyInfo.type) { 6141 case BOOLEAN: 6142 return !value; 6143 6144 case OVERLOADED_BOOLEAN: 6145 return value === false; 6146 6147 case NUMERIC: 6148 return isNaN(value); 6149 6150 case POSITIVE_NUMERIC: 6151 return isNaN(value) || value < 1; 6152 } 6153 } 6154 6155 return false; 6156} 6157function getPropertyInfo(name) { 6158 return properties.hasOwnProperty(name) ? properties[name] : null; 6159} 6160 6161function PropertyInfoRecord(name, type, mustUseProperty, attributeName, attributeNamespace, sanitizeURL, removeEmptyString) { 6162 this.acceptsBooleans = type === BOOLEANISH_STRING || type === BOOLEAN || type === OVERLOADED_BOOLEAN; 6163 this.attributeName = attributeName; 6164 this.attributeNamespace = attributeNamespace; 6165 this.mustUseProperty = mustUseProperty; 6166 this.propertyName = name; 6167 this.type = type; 6168 this.sanitizeURL = sanitizeURL; 6169 this.removeEmptyString = removeEmptyString; 6170} // When adding attributes to this list, be sure to also add them to 6171// the `possibleStandardNames` module to ensure casing and incorrect 6172// name warnings. 6173 6174 6175var properties = {}; // These props are reserved by React. They shouldn't be written to the DOM. 6176 6177var reservedProps = ['children', 'dangerouslySetInnerHTML', // TODO: This prevents the assignment of defaultValue to regular 6178// elements (not just inputs). Now that ReactDOMInput assigns to the 6179// defaultValue property -- do we need this? 6180'defaultValue', 'defaultChecked', 'innerHTML', 'suppressContentEditableWarning', 'suppressHydrationWarning', 'style']; 6181 6182reservedProps.forEach(function (name) { 6183 properties[name] = new PropertyInfoRecord(name, RESERVED, false, // mustUseProperty 6184 name, // attributeName 6185 null, // attributeNamespace 6186 false, // sanitizeURL 6187 false); 6188}); // A few React string attributes have a different name. 6189// This is a mapping from React prop names to the attribute names. 6190 6191[['acceptCharset', 'accept-charset'], ['className', 'class'], ['htmlFor', 'for'], ['httpEquiv', 'http-equiv']].forEach(function (_ref) { 6192 var name = _ref[0], 6193 attributeName = _ref[1]; 6194 properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty 6195 attributeName, // attributeName 6196 null, // attributeNamespace 6197 false, // sanitizeURL 6198 false); 6199}); // These are "enumerated" HTML attributes that accept "true" and "false". 6200// In React, we let users pass `true` and `false` even though technically 6201// these aren't boolean attributes (they are coerced to strings). 6202 6203['contentEditable', 'draggable', 'spellCheck', 'value'].forEach(function (name) { 6204 properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty 6205 name.toLowerCase(), // attributeName 6206 null, // attributeNamespace 6207 false, // sanitizeURL 6208 false); 6209}); // These are "enumerated" SVG attributes that accept "true" and "false". 6210// In React, we let users pass `true` and `false` even though technically 6211// these aren't boolean attributes (they are coerced to strings). 6212// Since these are SVG attributes, their attribute names are case-sensitive. 6213 6214['autoReverse', 'externalResourcesRequired', 'focusable', 'preserveAlpha'].forEach(function (name) { 6215 properties[name] = new PropertyInfoRecord(name, BOOLEANISH_STRING, false, // mustUseProperty 6216 name, // attributeName 6217 null, // attributeNamespace 6218 false, // sanitizeURL 6219 false); 6220}); // These are HTML boolean attributes. 6221 6222['allowFullScreen', 'async', // Note: there is a special case that prevents it from being written to the DOM 6223// on the client side because the browsers are inconsistent. Instead we call focus(). 6224'autoFocus', 'autoPlay', 'controls', 'default', 'defer', 'disabled', 'disablePictureInPicture', 'disableRemotePlayback', 'formNoValidate', 'hidden', 'loop', 'noModule', 'noValidate', 'open', 'playsInline', 'readOnly', 'required', 'reversed', 'scoped', 'seamless', // Microdata 6225'itemScope'].forEach(function (name) { 6226 properties[name] = new PropertyInfoRecord(name, BOOLEAN, false, // mustUseProperty 6227 name.toLowerCase(), // attributeName 6228 null, // attributeNamespace 6229 false, // sanitizeURL 6230 false); 6231}); // These are the few React props that we set as DOM properties 6232// rather than attributes. These are all booleans. 6233 6234['checked', // Note: `option.selected` is not updated if `select.multiple` is 6235// disabled with `removeAttribute`. We have special logic for handling this. 6236'multiple', 'muted', 'selected' // NOTE: if you add a camelCased prop to this list, 6237// you'll need to set attributeName to name.toLowerCase() 6238// instead in the assignment below. 6239].forEach(function (name) { 6240 properties[name] = new PropertyInfoRecord(name, BOOLEAN, true, // mustUseProperty 6241 name, // attributeName 6242 null, // attributeNamespace 6243 false, // sanitizeURL 6244 false); 6245}); // These are HTML attributes that are "overloaded booleans": they behave like 6246// booleans, but can also accept a string value. 6247 6248['capture', 'download' // NOTE: if you add a camelCased prop to this list, 6249// you'll need to set attributeName to name.toLowerCase() 6250// instead in the assignment below. 6251].forEach(function (name) { 6252 properties[name] = new PropertyInfoRecord(name, OVERLOADED_BOOLEAN, false, // mustUseProperty 6253 name, // attributeName 6254 null, // attributeNamespace 6255 false, // sanitizeURL 6256 false); 6257}); // These are HTML attributes that must be positive numbers. 6258 6259['cols', 'rows', 'size', 'span' // NOTE: if you add a camelCased prop to this list, 6260// you'll need to set attributeName to name.toLowerCase() 6261// instead in the assignment below. 6262].forEach(function (name) { 6263 properties[name] = new PropertyInfoRecord(name, POSITIVE_NUMERIC, false, // mustUseProperty 6264 name, // attributeName 6265 null, // attributeNamespace 6266 false, // sanitizeURL 6267 false); 6268}); // These are HTML attributes that must be numbers. 6269 6270['rowSpan', 'start'].forEach(function (name) { 6271 properties[name] = new PropertyInfoRecord(name, NUMERIC, false, // mustUseProperty 6272 name.toLowerCase(), // attributeName 6273 null, // attributeNamespace 6274 false, // sanitizeURL 6275 false); 6276}); 6277var CAMELIZE = /[\-\:]([a-z])/g; 6278 6279var capitalize = function (token) { 6280 return token[1].toUpperCase(); 6281}; // This is a list of all SVG attributes that need special casing, namespacing, 6282// or boolean value assignment. Regular attributes that just accept strings 6283// and have the same names are omitted, just like in the HTML attribute filter. 6284// Some of these attributes can be hard to find. This list was created by 6285// scraping the MDN documentation. 6286 6287 6288['accent-height', 'alignment-baseline', 'arabic-form', 'baseline-shift', 'cap-height', 'clip-path', 'clip-rule', 'color-interpolation', 'color-interpolation-filters', 'color-profile', 'color-rendering', 'dominant-baseline', 'enable-background', 'fill-opacity', 'fill-rule', 'flood-color', 'flood-opacity', 'font-family', 'font-size', 'font-size-adjust', 'font-stretch', 'font-style', 'font-variant', 'font-weight', 'glyph-name', 'glyph-orientation-horizontal', 'glyph-orientation-vertical', 'horiz-adv-x', 'horiz-origin-x', 'image-rendering', 'letter-spacing', 'lighting-color', 'marker-end', 'marker-mid', 'marker-start', 'overline-position', 'overline-thickness', 'paint-order', 'panose-1', 'pointer-events', 'rendering-intent', 'shape-rendering', 'stop-color', 'stop-opacity', 'strikethrough-position', 'strikethrough-thickness', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'text-anchor', 'text-decoration', 'text-rendering', 'underline-position', 'underline-thickness', 'unicode-bidi', 'unicode-range', 'units-per-em', 'v-alphabetic', 'v-hanging', 'v-ideographic', 'v-mathematical', 'vector-effect', 'vert-adv-y', 'vert-origin-x', 'vert-origin-y', 'word-spacing', 'writing-mode', 'xmlns:xlink', 'x-height' // NOTE: if you add a camelCased prop to this list, 6289// you'll need to set attributeName to name.toLowerCase() 6290// instead in the assignment below. 6291].forEach(function (attributeName) { 6292 var name = attributeName.replace(CAMELIZE, capitalize); 6293 properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty 6294 attributeName, null, // attributeNamespace 6295 false, // sanitizeURL 6296 false); 6297}); // String SVG attributes with the xlink namespace. 6298 6299['xlink:actuate', 'xlink:arcrole', 'xlink:role', 'xlink:show', 'xlink:title', 'xlink:type' // NOTE: if you add a camelCased prop to this list, 6300// you'll need to set attributeName to name.toLowerCase() 6301// instead in the assignment below. 6302].forEach(function (attributeName) { 6303 var name = attributeName.replace(CAMELIZE, capitalize); 6304 properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty 6305 attributeName, 'http://www.w3.org/1999/xlink', false, // sanitizeURL 6306 false); 6307}); // String SVG attributes with the xml namespace. 6308 6309['xml:base', 'xml:lang', 'xml:space' // NOTE: if you add a camelCased prop to this list, 6310// you'll need to set attributeName to name.toLowerCase() 6311// instead in the assignment below. 6312].forEach(function (attributeName) { 6313 var name = attributeName.replace(CAMELIZE, capitalize); 6314 properties[name] = new PropertyInfoRecord(name, STRING, false, // mustUseProperty 6315 attributeName, 'http://www.w3.org/XML/1998/namespace', false, // sanitizeURL 6316 false); 6317}); // These attribute exists both in HTML and SVG. 6318// The attribute name is case-sensitive in SVG so we can't just use 6319// the React name like we do for attributes that exist only in HTML. 6320 6321['tabIndex', 'crossOrigin'].forEach(function (attributeName) { 6322 properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty 6323 attributeName.toLowerCase(), // attributeName 6324 null, // attributeNamespace 6325 false, // sanitizeURL 6326 false); 6327}); // These attributes accept URLs. These must not allow javascript: URLS. 6328// These will also need to accept Trusted Types object in the future. 6329 6330var xlinkHref = 'xlinkHref'; 6331properties[xlinkHref] = new PropertyInfoRecord('xlinkHref', STRING, false, // mustUseProperty 6332'xlink:href', 'http://www.w3.org/1999/xlink', true, // sanitizeURL 6333false); 6334['src', 'href', 'action', 'formAction'].forEach(function (attributeName) { 6335 properties[attributeName] = new PropertyInfoRecord(attributeName, STRING, false, // mustUseProperty 6336 attributeName.toLowerCase(), // attributeName 6337 null, // attributeNamespace 6338 true, // sanitizeURL 6339 true); 6340}); 6341 6342// and any newline or tab are filtered out as if they're not part of the URL. 6343// https://url.spec.whatwg.org/#url-parsing 6344// Tab or newline are defined as \r\n\t: 6345// https://infra.spec.whatwg.org/#ascii-tab-or-newline 6346// A C0 control is a code point in the range \u0000 NULL to \u001F 6347// INFORMATION SEPARATOR ONE, inclusive: 6348// https://infra.spec.whatwg.org/#c0-control-or-space 6349 6350/* eslint-disable max-len */ 6351 6352var isJavaScriptProtocol = /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*\:/i; 6353var didWarn = false; 6354 6355function sanitizeURL(url) { 6356 { 6357 if (!didWarn && isJavaScriptProtocol.test(url)) { 6358 didWarn = true; 6359 6360 error('A future version of React will block javascript: URLs as a security precaution. ' + 'Use event handlers instead if you can. If you need to generate unsafe HTML try ' + 'using dangerouslySetInnerHTML instead. React was passed %s.', JSON.stringify(url)); 6361 } 6362 } 6363} 6364 6365/** 6366 * Get the value for a property on a node. Only used in DEV for SSR validation. 6367 * The "expected" argument is used as a hint of what the expected value is. 6368 * Some properties have multiple equivalent values. 6369 */ 6370function getValueForProperty(node, name, expected, propertyInfo) { 6371 { 6372 if (propertyInfo.mustUseProperty) { 6373 var propertyName = propertyInfo.propertyName; 6374 return node[propertyName]; 6375 } else { 6376 // This check protects multiple uses of `expected`, which is why the 6377 // react-internal/safe-string-coercion rule is disabled in several spots 6378 // below. 6379 { 6380 checkAttributeStringCoercion(expected, name); 6381 } 6382 6383 if ( propertyInfo.sanitizeURL) { 6384 // If we haven't fully disabled javascript: URLs, and if 6385 // the hydration is successful of a javascript: URL, we 6386 // still want to warn on the client. 6387 // eslint-disable-next-line react-internal/safe-string-coercion 6388 sanitizeURL('' + expected); 6389 } 6390 6391 var attributeName = propertyInfo.attributeName; 6392 var stringValue = null; 6393 6394 if (propertyInfo.type === OVERLOADED_BOOLEAN) { 6395 if (node.hasAttribute(attributeName)) { 6396 var value = node.getAttribute(attributeName); 6397 6398 if (value === '') { 6399 return true; 6400 } 6401 6402 if (shouldRemoveAttribute(name, expected, propertyInfo, false)) { 6403 return value; 6404 } // eslint-disable-next-line react-internal/safe-string-coercion 6405 6406 6407 if (value === '' + expected) { 6408 return expected; 6409 } 6410 6411 return value; 6412 } 6413 } else if (node.hasAttribute(attributeName)) { 6414 if (shouldRemoveAttribute(name, expected, propertyInfo, false)) { 6415 // We had an attribute but shouldn't have had one, so read it 6416 // for the error message. 6417 return node.getAttribute(attributeName); 6418 } 6419 6420 if (propertyInfo.type === BOOLEAN) { 6421 // If this was a boolean, it doesn't matter what the value is 6422 // the fact that we have it is the same as the expected. 6423 return expected; 6424 } // Even if this property uses a namespace we use getAttribute 6425 // because we assume its namespaced name is the same as our config. 6426 // To use getAttributeNS we need the local name which we don't have 6427 // in our config atm. 6428 6429 6430 stringValue = node.getAttribute(attributeName); 6431 } 6432 6433 if (shouldRemoveAttribute(name, expected, propertyInfo, false)) { 6434 return stringValue === null ? expected : stringValue; // eslint-disable-next-line react-internal/safe-string-coercion 6435 } else if (stringValue === '' + expected) { 6436 return expected; 6437 } else { 6438 return stringValue; 6439 } 6440 } 6441 } 6442} 6443/** 6444 * Get the value for a attribute on a node. Only used in DEV for SSR validation. 6445 * The third argument is used as a hint of what the expected value is. Some 6446 * attributes have multiple equivalent values. 6447 */ 6448 6449function getValueForAttribute(node, name, expected, isCustomComponentTag) { 6450 { 6451 if (!isAttributeNameSafe(name)) { 6452 return; 6453 } 6454 6455 if (!node.hasAttribute(name)) { 6456 return expected === undefined ? undefined : null; 6457 } 6458 6459 var value = node.getAttribute(name); 6460 6461 { 6462 checkAttributeStringCoercion(expected, name); 6463 } 6464 6465 if (value === '' + expected) { 6466 return expected; 6467 } 6468 6469 return value; 6470 } 6471} 6472/** 6473 * Sets the value for a property on a node. 6474 * 6475 * @param {DOMElement} node 6476 * @param {string} name 6477 * @param {*} value 6478 */ 6479 6480function setValueForProperty(node, name, value, isCustomComponentTag) { 6481 var propertyInfo = getPropertyInfo(name); 6482 6483 if (shouldIgnoreAttribute(name, propertyInfo, isCustomComponentTag)) { 6484 return; 6485 } 6486 6487 if (shouldRemoveAttribute(name, value, propertyInfo, isCustomComponentTag)) { 6488 value = null; 6489 } 6490 6491 6492 if (isCustomComponentTag || propertyInfo === null) { 6493 if (isAttributeNameSafe(name)) { 6494 var _attributeName = name; 6495 6496 if (value === null) { 6497 node.removeAttribute(_attributeName); 6498 } else { 6499 { 6500 checkAttributeStringCoercion(value, name); 6501 } 6502 6503 node.setAttribute(_attributeName, '' + value); 6504 } 6505 } 6506 6507 return; 6508 } 6509 6510 var mustUseProperty = propertyInfo.mustUseProperty; 6511 6512 if (mustUseProperty) { 6513 var propertyName = propertyInfo.propertyName; 6514 6515 if (value === null) { 6516 var type = propertyInfo.type; 6517 node[propertyName] = type === BOOLEAN ? false : ''; 6518 } else { 6519 // Contrary to `setAttribute`, object properties are properly 6520 // `toString`ed by IE8/9. 6521 node[propertyName] = value; 6522 } 6523 6524 return; 6525 } // The rest are treated as attributes with special cases. 6526 6527 6528 var attributeName = propertyInfo.attributeName, 6529 attributeNamespace = propertyInfo.attributeNamespace; 6530 6531 if (value === null) { 6532 node.removeAttribute(attributeName); 6533 } else { 6534 var _type = propertyInfo.type; 6535 var attributeValue; 6536 6537 if (_type === BOOLEAN || _type === OVERLOADED_BOOLEAN && value === true) { 6538 // If attribute type is boolean, we know for sure it won't be an execution sink 6539 // and we won't require Trusted Type here. 6540 attributeValue = ''; 6541 } else { 6542 // `setAttribute` with objects becomes only `[object]` in IE8/9, 6543 // ('' + value) makes it output the correct toString()-value. 6544 { 6545 { 6546 checkAttributeStringCoercion(value, attributeName); 6547 } 6548 6549 attributeValue = '' + value; 6550 } 6551 6552 if (propertyInfo.sanitizeURL) { 6553 sanitizeURL(attributeValue.toString()); 6554 } 6555 } 6556 6557 if (attributeNamespace) { 6558 node.setAttributeNS(attributeNamespace, attributeName, attributeValue); 6559 } else { 6560 node.setAttribute(attributeName, attributeValue); 6561 } 6562 } 6563} 6564 6565// ATTENTION 6566// When adding new symbols to this file, 6567// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols' 6568// The Symbol used to tag the ReactElement-like types. 6569var REACT_ELEMENT_TYPE = Symbol.for('react.element'); 6570var REACT_PORTAL_TYPE = Symbol.for('react.portal'); 6571var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment'); 6572var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode'); 6573var REACT_PROFILER_TYPE = Symbol.for('react.profiler'); 6574var REACT_PROVIDER_TYPE = Symbol.for('react.provider'); 6575var REACT_CONTEXT_TYPE = Symbol.for('react.context'); 6576var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref'); 6577var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense'); 6578var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list'); 6579var REACT_MEMO_TYPE = Symbol.for('react.memo'); 6580var REACT_LAZY_TYPE = Symbol.for('react.lazy'); 6581var REACT_SCOPE_TYPE = Symbol.for('react.scope'); 6582var REACT_DEBUG_TRACING_MODE_TYPE = Symbol.for('react.debug_trace_mode'); 6583var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen'); 6584var REACT_LEGACY_HIDDEN_TYPE = Symbol.for('react.legacy_hidden'); 6585var REACT_CACHE_TYPE = Symbol.for('react.cache'); 6586var REACT_TRACING_MARKER_TYPE = Symbol.for('react.tracing_marker'); 6587var MAYBE_ITERATOR_SYMBOL = Symbol.iterator; 6588var FAUX_ITERATOR_SYMBOL = '@@iterator'; 6589function getIteratorFn(maybeIterable) { 6590 if (maybeIterable === null || typeof maybeIterable !== 'object') { 6591 return null; 6592 } 6593 6594 var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]; 6595 6596 if (typeof maybeIterator === 'function') { 6597 return maybeIterator; 6598 } 6599 6600 return null; 6601} 6602 6603var assign = Object.assign; 6604 6605// Helpers to patch console.logs to avoid logging during side-effect free 6606// replaying on render function. This currently only patches the object 6607// lazily which won't cover if the log function was extracted eagerly. 6608// We could also eagerly patch the method. 6609var disabledDepth = 0; 6610var prevLog; 6611var prevInfo; 6612var prevWarn; 6613var prevError; 6614var prevGroup; 6615var prevGroupCollapsed; 6616var prevGroupEnd; 6617 6618function disabledLog() {} 6619 6620disabledLog.__reactDisabledLog = true; 6621function disableLogs() { 6622 { 6623 if (disabledDepth === 0) { 6624 /* eslint-disable react-internal/no-production-logging */ 6625 prevLog = console.log; 6626 prevInfo = console.info; 6627 prevWarn = console.warn; 6628 prevError = console.error; 6629 prevGroup = console.group; 6630 prevGroupCollapsed = console.groupCollapsed; 6631 prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099 6632 6633 var props = { 6634 configurable: true, 6635 enumerable: true, 6636 value: disabledLog, 6637 writable: true 6638 }; // $FlowFixMe Flow thinks console is immutable. 6639 6640 Object.defineProperties(console, { 6641 info: props, 6642 log: props, 6643 warn: props, 6644 error: props, 6645 group: props, 6646 groupCollapsed: props, 6647 groupEnd: props 6648 }); 6649 /* eslint-enable react-internal/no-production-logging */ 6650 } 6651 6652 disabledDepth++; 6653 } 6654} 6655function reenableLogs() { 6656 { 6657 disabledDepth--; 6658 6659 if (disabledDepth === 0) { 6660 /* eslint-disable react-internal/no-production-logging */ 6661 var props = { 6662 configurable: true, 6663 enumerable: true, 6664 writable: true 6665 }; // $FlowFixMe Flow thinks console is immutable. 6666 6667 Object.defineProperties(console, { 6668 log: assign({}, props, { 6669 value: prevLog 6670 }), 6671 info: assign({}, props, { 6672 value: prevInfo 6673 }), 6674 warn: assign({}, props, { 6675 value: prevWarn 6676 }), 6677 error: assign({}, props, { 6678 value: prevError 6679 }), 6680 group: assign({}, props, { 6681 value: prevGroup 6682 }), 6683 groupCollapsed: assign({}, props, { 6684 value: prevGroupCollapsed 6685 }), 6686 groupEnd: assign({}, props, { 6687 value: prevGroupEnd 6688 }) 6689 }); 6690 /* eslint-enable react-internal/no-production-logging */ 6691 } 6692 6693 if (disabledDepth < 0) { 6694 error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.'); 6695 } 6696 } 6697} 6698 6699var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher; 6700var prefix; 6701function describeBuiltInComponentFrame(name, source, ownerFn) { 6702 { 6703 if (prefix === undefined) { 6704 // Extract the VM specific prefix used by each line. 6705 try { 6706 throw Error(); 6707 } catch (x) { 6708 var match = x.stack.trim().match(/\n( *(at )?)/); 6709 prefix = match && match[1] || ''; 6710 } 6711 } // We use the prefix to ensure our stacks line up with native stack frames. 6712 6713 6714 return '\n' + prefix + name; 6715 } 6716} 6717var reentry = false; 6718var componentFrameCache; 6719 6720{ 6721 var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map; 6722 componentFrameCache = new PossiblyWeakMap(); 6723} 6724 6725function describeNativeComponentFrame(fn, construct) { 6726 // If something asked for a stack inside a fake render, it should get ignored. 6727 if ( !fn || reentry) { 6728 return ''; 6729 } 6730 6731 { 6732 var frame = componentFrameCache.get(fn); 6733 6734 if (frame !== undefined) { 6735 return frame; 6736 } 6737 } 6738 6739 var control; 6740 reentry = true; 6741 var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined. 6742 6743 Error.prepareStackTrace = undefined; 6744 var previousDispatcher; 6745 6746 { 6747 previousDispatcher = ReactCurrentDispatcher.current; // Set the dispatcher in DEV because this might be call in the render function 6748 // for warnings. 6749 6750 ReactCurrentDispatcher.current = null; 6751 disableLogs(); 6752 } 6753 6754 try { 6755 // This should throw. 6756 if (construct) { 6757 // Something should be setting the props in the constructor. 6758 var Fake = function () { 6759 throw Error(); 6760 }; // $FlowFixMe 6761 6762 6763 Object.defineProperty(Fake.prototype, 'props', { 6764 set: function () { 6765 // We use a throwing setter instead of frozen or non-writable props 6766 // because that won't throw in a non-strict mode function. 6767 throw Error(); 6768 } 6769 }); 6770 6771 if (typeof Reflect === 'object' && Reflect.construct) { 6772 // We construct a different control for this case to include any extra 6773 // frames added by the construct call. 6774 try { 6775 Reflect.construct(Fake, []); 6776 } catch (x) { 6777 control = x; 6778 } 6779 6780 Reflect.construct(fn, [], Fake); 6781 } else { 6782 try { 6783 Fake.call(); 6784 } catch (x) { 6785 control = x; 6786 } 6787 6788 fn.call(Fake.prototype); 6789 } 6790 } else { 6791 try { 6792 throw Error(); 6793 } catch (x) { 6794 control = x; 6795 } 6796 6797 fn(); 6798 } 6799 } catch (sample) { 6800 // This is inlined manually because closure doesn't do it for us. 6801 if (sample && control && typeof sample.stack === 'string') { 6802 // This extracts the first frame from the sample that isn't also in the control. 6803 // Skipping one frame that we assume is the frame that calls the two. 6804 var sampleLines = sample.stack.split('\n'); 6805 var controlLines = control.stack.split('\n'); 6806 var s = sampleLines.length - 1; 6807 var c = controlLines.length - 1; 6808 6809 while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) { 6810 // We expect at least one stack frame to be shared. 6811 // Typically this will be the root most one. However, stack frames may be 6812 // cut off due to maximum stack limits. In this case, one maybe cut off 6813 // earlier than the other. We assume that the sample is longer or the same 6814 // and there for cut off earlier. So we should find the root most frame in 6815 // the sample somewhere in the control. 6816 c--; 6817 } 6818 6819 for (; s >= 1 && c >= 0; s--, c--) { 6820 // Next we find the first one that isn't the same which should be the 6821 // frame that called our sample function and the control. 6822 if (sampleLines[s] !== controlLines[c]) { 6823 // In V8, the first line is describing the message but other VMs don't. 6824 // If we're about to return the first line, and the control is also on the same 6825 // line, that's a pretty good indicator that our sample threw at same line as 6826 // the control. I.e. before we entered the sample frame. So we ignore this result. 6827 // This can happen if you passed a class to function component, or non-function. 6828 if (s !== 1 || c !== 1) { 6829 do { 6830 s--; 6831 c--; // We may still have similar intermediate frames from the construct call. 6832 // The next one that isn't the same should be our match though. 6833 6834 if (c < 0 || sampleLines[s] !== controlLines[c]) { 6835 // V8 adds a "new" prefix for native classes. Let's remove it to make it prettier. 6836 var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>" 6837 // but we have a user-provided "displayName" 6838 // splice it in to make the stack more readable. 6839 6840 6841 if (fn.displayName && _frame.includes('<anonymous>')) { 6842 _frame = _frame.replace('<anonymous>', fn.displayName); 6843 } 6844 6845 { 6846 if (typeof fn === 'function') { 6847 componentFrameCache.set(fn, _frame); 6848 } 6849 } // Return the line we found. 6850 6851 6852 return _frame; 6853 } 6854 } while (s >= 1 && c >= 0); 6855 } 6856 6857 break; 6858 } 6859 } 6860 } 6861 } finally { 6862 reentry = false; 6863 6864 { 6865 ReactCurrentDispatcher.current = previousDispatcher; 6866 reenableLogs(); 6867 } 6868 6869 Error.prepareStackTrace = previousPrepareStackTrace; 6870 } // Fallback to just using the name if we couldn't make it throw. 6871 6872 6873 var name = fn ? fn.displayName || fn.name : ''; 6874 var syntheticFrame = name ? describeBuiltInComponentFrame(name) : ''; 6875 6876 { 6877 if (typeof fn === 'function') { 6878 componentFrameCache.set(fn, syntheticFrame); 6879 } 6880 } 6881 6882 return syntheticFrame; 6883} 6884 6885function describeClassComponentFrame(ctor, source, ownerFn) { 6886 { 6887 return describeNativeComponentFrame(ctor, true); 6888 } 6889} 6890function describeFunctionComponentFrame(fn, source, ownerFn) { 6891 { 6892 return describeNativeComponentFrame(fn, false); 6893 } 6894} 6895 6896function shouldConstruct(Component) { 6897 var prototype = Component.prototype; 6898 return !!(prototype && prototype.isReactComponent); 6899} 6900 6901function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) { 6902 6903 if (type == null) { 6904 return ''; 6905 } 6906 6907 if (typeof type === 'function') { 6908 { 6909 return describeNativeComponentFrame(type, shouldConstruct(type)); 6910 } 6911 } 6912 6913 if (typeof type === 'string') { 6914 return describeBuiltInComponentFrame(type); 6915 } 6916 6917 switch (type) { 6918 case REACT_SUSPENSE_TYPE: 6919 return describeBuiltInComponentFrame('Suspense'); 6920 6921 case REACT_SUSPENSE_LIST_TYPE: 6922 return describeBuiltInComponentFrame('SuspenseList'); 6923 } 6924 6925 if (typeof type === 'object') { 6926 switch (type.$$typeof) { 6927 case REACT_FORWARD_REF_TYPE: 6928 return describeFunctionComponentFrame(type.render); 6929 6930 case REACT_MEMO_TYPE: 6931 // Memo may contain any component type so we recursively resolve it. 6932 return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn); 6933 6934 case REACT_LAZY_TYPE: 6935 { 6936 var lazyComponent = type; 6937 var payload = lazyComponent._payload; 6938 var init = lazyComponent._init; 6939 6940 try { 6941 // Lazy may contain any component type so we recursively resolve it. 6942 return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn); 6943 } catch (x) {} 6944 } 6945 } 6946 } 6947 6948 return ''; 6949} 6950 6951function describeFiber(fiber) { 6952 var owner = fiber._debugOwner ? fiber._debugOwner.type : null ; 6953 var source = fiber._debugSource ; 6954 6955 switch (fiber.tag) { 6956 case HostComponent: 6957 return describeBuiltInComponentFrame(fiber.type); 6958 6959 case LazyComponent: 6960 return describeBuiltInComponentFrame('Lazy'); 6961 6962 case SuspenseComponent: 6963 return describeBuiltInComponentFrame('Suspense'); 6964 6965 case SuspenseListComponent: 6966 return describeBuiltInComponentFrame('SuspenseList'); 6967 6968 case FunctionComponent: 6969 case IndeterminateComponent: 6970 case SimpleMemoComponent: 6971 return describeFunctionComponentFrame(fiber.type); 6972 6973 case ForwardRef: 6974 return describeFunctionComponentFrame(fiber.type.render); 6975 6976 case ClassComponent: 6977 return describeClassComponentFrame(fiber.type); 6978 6979 default: 6980 return ''; 6981 } 6982} 6983 6984function getStackByFiberInDevAndProd(workInProgress) { 6985 try { 6986 var info = ''; 6987 var node = workInProgress; 6988 6989 do { 6990 info += describeFiber(node); 6991 node = node.return; 6992 } while (node); 6993 6994 return info; 6995 } catch (x) { 6996 return '\nError generating stack: ' + x.message + '\n' + x.stack; 6997 } 6998} 6999 7000function getWrappedName(outerType, innerType, wrapperName) { 7001 var displayName = outerType.displayName; 7002 7003 if (displayName) { 7004 return displayName; 7005 } 7006 7007 var functionName = innerType.displayName || innerType.name || ''; 7008 return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName; 7009} // Keep in sync with react-reconciler/getComponentNameFromFiber 7010 7011 7012function getContextName(type) { 7013 return type.displayName || 'Context'; 7014} // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead. 7015 7016 7017function getComponentNameFromType(type) { 7018 if (type == null) { 7019 // Host root, text node or just invalid type. 7020 return null; 7021 } 7022 7023 { 7024 if (typeof type.tag === 'number') { 7025 error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.'); 7026 } 7027 } 7028 7029 if (typeof type === 'function') { 7030 return type.displayName || type.name || null; 7031 } 7032 7033 if (typeof type === 'string') { 7034 return type; 7035 } 7036 7037 switch (type) { 7038 case REACT_FRAGMENT_TYPE: 7039 return 'Fragment'; 7040 7041 case REACT_PORTAL_TYPE: 7042 return 'Portal'; 7043 7044 case REACT_PROFILER_TYPE: 7045 return 'Profiler'; 7046 7047 case REACT_STRICT_MODE_TYPE: 7048 return 'StrictMode'; 7049 7050 case REACT_SUSPENSE_TYPE: 7051 return 'Suspense'; 7052 7053 case REACT_SUSPENSE_LIST_TYPE: 7054 return 'SuspenseList'; 7055 7056 } 7057 7058 if (typeof type === 'object') { 7059 switch (type.$$typeof) { 7060 case REACT_CONTEXT_TYPE: 7061 var context = type; 7062 return getContextName(context) + '.Consumer'; 7063 7064 case REACT_PROVIDER_TYPE: 7065 var provider = type; 7066 return getContextName(provider._context) + '.Provider'; 7067 7068 case REACT_FORWARD_REF_TYPE: 7069 return getWrappedName(type, type.render, 'ForwardRef'); 7070 7071 case REACT_MEMO_TYPE: 7072 var outerName = type.displayName || null; 7073 7074 if (outerName !== null) { 7075 return outerName; 7076 } 7077 7078 return getComponentNameFromType(type.type) || 'Memo'; 7079 7080 case REACT_LAZY_TYPE: 7081 { 7082 var lazyComponent = type; 7083 var payload = lazyComponent._payload; 7084 var init = lazyComponent._init; 7085 7086 try { 7087 return getComponentNameFromType(init(payload)); 7088 } catch (x) { 7089 return null; 7090 } 7091 } 7092 7093 // eslint-disable-next-line no-fallthrough 7094 } 7095 } 7096 7097 return null; 7098} 7099 7100function getWrappedName$1(outerType, innerType, wrapperName) { 7101 var functionName = innerType.displayName || innerType.name || ''; 7102 return outerType.displayName || (functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName); 7103} // Keep in sync with shared/getComponentNameFromType 7104 7105 7106function getContextName$1(type) { 7107 return type.displayName || 'Context'; 7108} 7109 7110function getComponentNameFromFiber(fiber) { 7111 var tag = fiber.tag, 7112 type = fiber.type; 7113 7114 switch (tag) { 7115 case CacheComponent: 7116 return 'Cache'; 7117 7118 case ContextConsumer: 7119 var context = type; 7120 return getContextName$1(context) + '.Consumer'; 7121 7122 case ContextProvider: 7123 var provider = type; 7124 return getContextName$1(provider._context) + '.Provider'; 7125 7126 case DehydratedFragment: 7127 return 'DehydratedFragment'; 7128 7129 case ForwardRef: 7130 return getWrappedName$1(type, type.render, 'ForwardRef'); 7131 7132 case Fragment: 7133 return 'Fragment'; 7134 7135 case HostComponent: 7136 // Host component type is the display name (e.g. "div", "View") 7137 return type; 7138 7139 case HostPortal: 7140 return 'Portal'; 7141 7142 case HostRoot: 7143 return 'Root'; 7144 7145 case HostText: 7146 return 'Text'; 7147 7148 case LazyComponent: 7149 // Name comes from the type in this case; we don't have a tag. 7150 return getComponentNameFromType(type); 7151 7152 case Mode: 7153 if (type === REACT_STRICT_MODE_TYPE) { 7154 // Don't be less specific than shared/getComponentNameFromType 7155 return 'StrictMode'; 7156 } 7157 7158 return 'Mode'; 7159 7160 case OffscreenComponent: 7161 return 'Offscreen'; 7162 7163 case Profiler: 7164 return 'Profiler'; 7165 7166 case ScopeComponent: 7167 return 'Scope'; 7168 7169 case SuspenseComponent: 7170 return 'Suspense'; 7171 7172 case SuspenseListComponent: 7173 return 'SuspenseList'; 7174 7175 case TracingMarkerComponent: 7176 return 'TracingMarker'; 7177 // The display name for this tags come from the user-provided type: 7178 7179 case ClassComponent: 7180 case FunctionComponent: 7181 case IncompleteClassComponent: 7182 case IndeterminateComponent: 7183 case MemoComponent: 7184 case SimpleMemoComponent: 7185 if (typeof type === 'function') { 7186 return type.displayName || type.name || null; 7187 } 7188 7189 if (typeof type === 'string') { 7190 return type; 7191 } 7192 7193 break; 7194 7195 } 7196 7197 return null; 7198} 7199 7200var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame; 7201var current = null; 7202var isRendering = false; 7203function getCurrentFiberOwnerNameInDevOrNull() { 7204 { 7205 if (current === null) { 7206 return null; 7207 } 7208 7209 var owner = current._debugOwner; 7210 7211 if (owner !== null && typeof owner !== 'undefined') { 7212 return getComponentNameFromFiber(owner); 7213 } 7214 } 7215 7216 return null; 7217} 7218 7219function getCurrentFiberStackInDev() { 7220 { 7221 if (current === null) { 7222 return ''; 7223 } // Safe because if current fiber exists, we are reconciling, 7224 // and it is guaranteed to be the work-in-progress version. 7225 7226 7227 return getStackByFiberInDevAndProd(current); 7228 } 7229} 7230 7231function resetCurrentFiber() { 7232 { 7233 ReactDebugCurrentFrame.getCurrentStack = null; 7234 current = null; 7235 isRendering = false; 7236 } 7237} 7238function setCurrentFiber(fiber) { 7239 { 7240 ReactDebugCurrentFrame.getCurrentStack = fiber === null ? null : getCurrentFiberStackInDev; 7241 current = fiber; 7242 isRendering = false; 7243 } 7244} 7245function getCurrentFiber() { 7246 { 7247 return current; 7248 } 7249} 7250function setIsRendering(rendering) { 7251 { 7252 isRendering = rendering; 7253 } 7254} 7255 7256// Flow does not allow string concatenation of most non-string types. To work 7257// around this limitation, we use an opaque type that can only be obtained by 7258// passing the value through getToStringValue first. 7259function toString(value) { 7260 // The coercion safety check is performed in getToStringValue(). 7261 // eslint-disable-next-line react-internal/safe-string-coercion 7262 return '' + value; 7263} 7264function getToStringValue(value) { 7265 switch (typeof value) { 7266 case 'boolean': 7267 case 'number': 7268 case 'string': 7269 case 'undefined': 7270 return value; 7271 7272 case 'object': 7273 { 7274 checkFormFieldValueStringCoercion(value); 7275 } 7276 7277 return value; 7278 7279 default: 7280 // function, symbol are assigned as empty strings 7281 return ''; 7282 } 7283} 7284 7285var hasReadOnlyValue = { 7286 button: true, 7287 checkbox: true, 7288 image: true, 7289 hidden: true, 7290 radio: true, 7291 reset: true, 7292 submit: true 7293}; 7294function checkControlledValueProps(tagName, props) { 7295 { 7296 if (!(hasReadOnlyValue[props.type] || props.onChange || props.onInput || props.readOnly || props.disabled || props.value == null)) { 7297 error('You provided a `value` prop to a form field without an ' + '`onChange` handler. This will render a read-only field. If ' + 'the field should be mutable use `defaultValue`. Otherwise, ' + 'set either `onChange` or `readOnly`.'); 7298 } 7299 7300 if (!(props.onChange || props.readOnly || props.disabled || props.checked == null)) { 7301 error('You provided a `checked` prop to a form field without an ' + '`onChange` handler. This will render a read-only field. If ' + 'the field should be mutable use `defaultChecked`. Otherwise, ' + 'set either `onChange` or `readOnly`.'); 7302 } 7303 } 7304} 7305 7306function isCheckable(elem) { 7307 var type = elem.type; 7308 var nodeName = elem.nodeName; 7309 return nodeName && nodeName.toLowerCase() === 'input' && (type === 'checkbox' || type === 'radio'); 7310} 7311 7312function getTracker(node) { 7313 return node._valueTracker; 7314} 7315 7316function detachTracker(node) { 7317 node._valueTracker = null; 7318} 7319 7320function getValueFromNode(node) { 7321 var value = ''; 7322 7323 if (!node) { 7324 return value; 7325 } 7326 7327 if (isCheckable(node)) { 7328 value = node.checked ? 'true' : 'false'; 7329 } else { 7330 value = node.value; 7331 } 7332 7333 return value; 7334} 7335 7336function trackValueOnNode(node) { 7337 var valueField = isCheckable(node) ? 'checked' : 'value'; 7338 var descriptor = Object.getOwnPropertyDescriptor(node.constructor.prototype, valueField); 7339 7340 { 7341 checkFormFieldValueStringCoercion(node[valueField]); 7342 } 7343 7344 var currentValue = '' + node[valueField]; // if someone has already defined a value or Safari, then bail 7345 // and don't track value will cause over reporting of changes, 7346 // but it's better then a hard failure 7347 // (needed for certain tests that spyOn input values and Safari) 7348 7349 if (node.hasOwnProperty(valueField) || typeof descriptor === 'undefined' || typeof descriptor.get !== 'function' || typeof descriptor.set !== 'function') { 7350 return; 7351 } 7352 7353 var get = descriptor.get, 7354 set = descriptor.set; 7355 Object.defineProperty(node, valueField, { 7356 configurable: true, 7357 get: function () { 7358 return get.call(this); 7359 }, 7360 set: function (value) { 7361 { 7362 checkFormFieldValueStringCoercion(value); 7363 } 7364 7365 currentValue = '' + value; 7366 set.call(this, value); 7367 } 7368 }); // We could've passed this the first time 7369 // but it triggers a bug in IE11 and Edge 14/15. 7370 // Calling defineProperty() again should be equivalent. 7371 // https://github.com/facebook/react/issues/11768 7372 7373 Object.defineProperty(node, valueField, { 7374 enumerable: descriptor.enumerable 7375 }); 7376 var tracker = { 7377 getValue: function () { 7378 return currentValue; 7379 }, 7380 setValue: function (value) { 7381 { 7382 checkFormFieldValueStringCoercion(value); 7383 } 7384 7385 currentValue = '' + value; 7386 }, 7387 stopTracking: function () { 7388 detachTracker(node); 7389 delete node[valueField]; 7390 } 7391 }; 7392 return tracker; 7393} 7394 7395function track(node) { 7396 if (getTracker(node)) { 7397 return; 7398 } // TODO: Once it's just Fiber we can move this to node._wrapperState 7399 7400 7401 node._valueTracker = trackValueOnNode(node); 7402} 7403function updateValueIfChanged(node) { 7404 if (!node) { 7405 return false; 7406 } 7407 7408 var tracker = getTracker(node); // if there is no tracker at this point it's unlikely 7409 // that trying again will succeed 7410 7411 if (!tracker) { 7412 return true; 7413 } 7414 7415 var lastValue = tracker.getValue(); 7416 var nextValue = getValueFromNode(node); 7417 7418 if (nextValue !== lastValue) { 7419 tracker.setValue(nextValue); 7420 return true; 7421 } 7422 7423 return false; 7424} 7425 7426function getActiveElement(doc) { 7427 doc = doc || (typeof document !== 'undefined' ? document : undefined); 7428 7429 if (typeof doc === 'undefined') { 7430 return null; 7431 } 7432 7433 try { 7434 return doc.activeElement || doc.body; 7435 } catch (e) { 7436 return doc.body; 7437 } 7438} 7439 7440var didWarnValueDefaultValue = false; 7441var didWarnCheckedDefaultChecked = false; 7442var didWarnControlledToUncontrolled = false; 7443var didWarnUncontrolledToControlled = false; 7444 7445function isControlled(props) { 7446 var usesChecked = props.type === 'checkbox' || props.type === 'radio'; 7447 return usesChecked ? props.checked != null : props.value != null; 7448} 7449/** 7450 * Implements an <input> host component that allows setting these optional 7451 * props: `checked`, `value`, `defaultChecked`, and `defaultValue`. 7452 * 7453 * If `checked` or `value` are not supplied (or null/undefined), user actions 7454 * that affect the checked state or value will trigger updates to the element. 7455 * 7456 * If they are supplied (and not null/undefined), the rendered element will not 7457 * trigger updates to the element. Instead, the props must change in order for 7458 * the rendered element to be updated. 7459 * 7460 * The rendered element will be initialized as unchecked (or `defaultChecked`) 7461 * with an empty value (or `defaultValue`). 7462 * 7463 * See http://www.w3.org/TR/2012/WD-html5-20121025/the-input-element.html 7464 */ 7465 7466 7467function getHostProps(element, props) { 7468 var node = element; 7469 var checked = props.checked; 7470 var hostProps = assign({}, props, { 7471 defaultChecked: undefined, 7472 defaultValue: undefined, 7473 value: undefined, 7474 checked: checked != null ? checked : node._wrapperState.initialChecked 7475 }); 7476 return hostProps; 7477} 7478function initWrapperState(element, props) { 7479 { 7480 checkControlledValueProps('input', props); 7481 7482 if (props.checked !== undefined && props.defaultChecked !== undefined && !didWarnCheckedDefaultChecked) { 7483 error('%s contains an input of type %s with both checked and defaultChecked props. ' + 'Input elements must be either controlled or uncontrolled ' + '(specify either the checked prop, or the defaultChecked prop, but not ' + 'both). Decide between using a controlled or uncontrolled input ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component', props.type); 7484 7485 didWarnCheckedDefaultChecked = true; 7486 } 7487 7488 if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue) { 7489 error('%s contains an input of type %s with both value and defaultValue props. ' + 'Input elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled input ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component', props.type); 7490 7491 didWarnValueDefaultValue = true; 7492 } 7493 } 7494 7495 var node = element; 7496 var defaultValue = props.defaultValue == null ? '' : props.defaultValue; 7497 node._wrapperState = { 7498 initialChecked: props.checked != null ? props.checked : props.defaultChecked, 7499 initialValue: getToStringValue(props.value != null ? props.value : defaultValue), 7500 controlled: isControlled(props) 7501 }; 7502} 7503function updateChecked(element, props) { 7504 var node = element; 7505 var checked = props.checked; 7506 7507 if (checked != null) { 7508 setValueForProperty(node, 'checked', checked, false); 7509 } 7510} 7511function updateWrapper(element, props) { 7512 var node = element; 7513 7514 { 7515 var controlled = isControlled(props); 7516 7517 if (!node._wrapperState.controlled && controlled && !didWarnUncontrolledToControlled) { 7518 error('A component is changing an uncontrolled input to be controlled. ' + 'This is likely caused by the value changing from undefined to ' + 'a defined value, which should not happen. ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components'); 7519 7520 didWarnUncontrolledToControlled = true; 7521 } 7522 7523 if (node._wrapperState.controlled && !controlled && !didWarnControlledToUncontrolled) { 7524 error('A component is changing a controlled input to be uncontrolled. ' + 'This is likely caused by the value changing from a defined to ' + 'undefined, which should not happen. ' + 'Decide between using a controlled or uncontrolled input ' + 'element for the lifetime of the component. More info: https://reactjs.org/link/controlled-components'); 7525 7526 didWarnControlledToUncontrolled = true; 7527 } 7528 } 7529 7530 updateChecked(element, props); 7531 var value = getToStringValue(props.value); 7532 var type = props.type; 7533 7534 if (value != null) { 7535 if (type === 'number') { 7536 if (value === 0 && node.value === '' || // We explicitly want to coerce to number here if possible. 7537 // eslint-disable-next-line 7538 node.value != value) { 7539 node.value = toString(value); 7540 } 7541 } else if (node.value !== toString(value)) { 7542 node.value = toString(value); 7543 } 7544 } else if (type === 'submit' || type === 'reset') { 7545 // Submit/reset inputs need the attribute removed completely to avoid 7546 // blank-text buttons. 7547 node.removeAttribute('value'); 7548 return; 7549 } 7550 7551 { 7552 // When syncing the value attribute, the value comes from a cascade of 7553 // properties: 7554 // 1. The value React property 7555 // 2. The defaultValue React property 7556 // 3. Otherwise there should be no change 7557 if (props.hasOwnProperty('value')) { 7558 setDefaultValue(node, props.type, value); 7559 } else if (props.hasOwnProperty('defaultValue')) { 7560 setDefaultValue(node, props.type, getToStringValue(props.defaultValue)); 7561 } 7562 } 7563 7564 { 7565 // When syncing the checked attribute, it only changes when it needs 7566 // to be removed, such as transitioning from a checkbox into a text input 7567 if (props.checked == null && props.defaultChecked != null) { 7568 node.defaultChecked = !!props.defaultChecked; 7569 } 7570 } 7571} 7572function postMountWrapper(element, props, isHydrating) { 7573 var node = element; // Do not assign value if it is already set. This prevents user text input 7574 // from being lost during SSR hydration. 7575 7576 if (props.hasOwnProperty('value') || props.hasOwnProperty('defaultValue')) { 7577 var type = props.type; 7578 var isButton = type === 'submit' || type === 'reset'; // Avoid setting value attribute on submit/reset inputs as it overrides the 7579 // default value provided by the browser. See: #12872 7580 7581 if (isButton && (props.value === undefined || props.value === null)) { 7582 return; 7583 } 7584 7585 var initialValue = toString(node._wrapperState.initialValue); // Do not assign value if it is already set. This prevents user text input 7586 // from being lost during SSR hydration. 7587 7588 if (!isHydrating) { 7589 { 7590 // When syncing the value attribute, the value property should use 7591 // the wrapperState._initialValue property. This uses: 7592 // 7593 // 1. The value React property when present 7594 // 2. The defaultValue React property when present 7595 // 3. An empty string 7596 if (initialValue !== node.value) { 7597 node.value = initialValue; 7598 } 7599 } 7600 } 7601 7602 { 7603 // Otherwise, the value attribute is synchronized to the property, 7604 // so we assign defaultValue to the same thing as the value property 7605 // assignment step above. 7606 node.defaultValue = initialValue; 7607 } 7608 } // Normally, we'd just do `node.checked = node.checked` upon initial mount, less this bug 7609 // this is needed to work around a chrome bug where setting defaultChecked 7610 // will sometimes influence the value of checked (even after detachment). 7611 // Reference: https://bugs.chromium.org/p/chromium/issues/detail?id=608416 7612 // We need to temporarily unset name to avoid disrupting radio button groups. 7613 7614 7615 var name = node.name; 7616 7617 if (name !== '') { 7618 node.name = ''; 7619 } 7620 7621 { 7622 // When syncing the checked attribute, both the checked property and 7623 // attribute are assigned at the same time using defaultChecked. This uses: 7624 // 7625 // 1. The checked React property when present 7626 // 2. The defaultChecked React property when present 7627 // 3. Otherwise, false 7628 node.defaultChecked = !node.defaultChecked; 7629 node.defaultChecked = !!node._wrapperState.initialChecked; 7630 } 7631 7632 if (name !== '') { 7633 node.name = name; 7634 } 7635} 7636function restoreControlledState(element, props) { 7637 var node = element; 7638 updateWrapper(node, props); 7639 updateNamedCousins(node, props); 7640} 7641 7642function updateNamedCousins(rootNode, props) { 7643 var name = props.name; 7644 7645 if (props.type === 'radio' && name != null) { 7646 var queryRoot = rootNode; 7647 7648 while (queryRoot.parentNode) { 7649 queryRoot = queryRoot.parentNode; 7650 } // If `rootNode.form` was non-null, then we could try `form.elements`, 7651 // but that sometimes behaves strangely in IE8. We could also try using 7652 // `form.getElementsByName`, but that will only return direct children 7653 // and won't include inputs that use the HTML5 `form=` attribute. Since 7654 // the input might not even be in a form. It might not even be in the 7655 // document. Let's just use the local `querySelectorAll` to ensure we don't 7656 // miss anything. 7657 7658 7659 { 7660 checkAttributeStringCoercion(name, 'name'); 7661 } 7662 7663 var group = queryRoot.querySelectorAll('input[name=' + JSON.stringify('' + name) + '][type="radio"]'); 7664 7665 for (var i = 0; i < group.length; i++) { 7666 var otherNode = group[i]; 7667 7668 if (otherNode === rootNode || otherNode.form !== rootNode.form) { 7669 continue; 7670 } // This will throw if radio buttons rendered by different copies of React 7671 // and the same name are rendered into the same form (same as #1939). 7672 // That's probably okay; we don't support it just as we don't support 7673 // mixing React radio buttons with non-React ones. 7674 7675 7676 var otherProps = getFiberCurrentPropsFromNode(otherNode); 7677 7678 if (!otherProps) { 7679 throw new Error('ReactDOMInput: Mixing React and non-React radio inputs with the ' + 'same `name` is not supported.'); 7680 } // We need update the tracked value on the named cousin since the value 7681 // was changed but the input saw no event or value set 7682 7683 7684 updateValueIfChanged(otherNode); // If this is a controlled radio button group, forcing the input that 7685 // was previously checked to update will cause it to be come re-checked 7686 // as appropriate. 7687 7688 updateWrapper(otherNode, otherProps); 7689 } 7690 } 7691} // In Chrome, assigning defaultValue to certain input types triggers input validation. 7692// For number inputs, the display value loses trailing decimal points. For email inputs, 7693// Chrome raises "The specified value <x> is not a valid email address". 7694// 7695// Here we check to see if the defaultValue has actually changed, avoiding these problems 7696// when the user is inputting text 7697// 7698// https://github.com/facebook/react/issues/7253 7699 7700 7701function setDefaultValue(node, type, value) { 7702 if ( // Focused number inputs synchronize on blur. See ChangeEventPlugin.js 7703 type !== 'number' || getActiveElement(node.ownerDocument) !== node) { 7704 if (value == null) { 7705 node.defaultValue = toString(node._wrapperState.initialValue); 7706 } else if (node.defaultValue !== toString(value)) { 7707 node.defaultValue = toString(value); 7708 } 7709 } 7710} 7711 7712var didWarnSelectedSetOnOption = false; 7713var didWarnInvalidChild = false; 7714var didWarnInvalidInnerHTML = false; 7715/** 7716 * Implements an <option> host component that warns when `selected` is set. 7717 */ 7718 7719function validateProps(element, props) { 7720 { 7721 // If a value is not provided, then the children must be simple. 7722 if (props.value == null) { 7723 if (typeof props.children === 'object' && props.children !== null) { 7724 React.Children.forEach(props.children, function (child) { 7725 if (child == null) { 7726 return; 7727 } 7728 7729 if (typeof child === 'string' || typeof child === 'number') { 7730 return; 7731 } 7732 7733 if (!didWarnInvalidChild) { 7734 didWarnInvalidChild = true; 7735 7736 error('Cannot infer the option value of complex children. ' + 'Pass a `value` prop or use a plain string as children to <option>.'); 7737 } 7738 }); 7739 } else if (props.dangerouslySetInnerHTML != null) { 7740 if (!didWarnInvalidInnerHTML) { 7741 didWarnInvalidInnerHTML = true; 7742 7743 error('Pass a `value` prop if you set dangerouslyInnerHTML so React knows ' + 'which value should be selected.'); 7744 } 7745 } 7746 } // TODO: Remove support for `selected` in <option>. 7747 7748 7749 if (props.selected != null && !didWarnSelectedSetOnOption) { 7750 error('Use the `defaultValue` or `value` props on <select> instead of ' + 'setting `selected` on <option>.'); 7751 7752 didWarnSelectedSetOnOption = true; 7753 } 7754 } 7755} 7756function postMountWrapper$1(element, props) { 7757 // value="" should make a value attribute (#6219) 7758 if (props.value != null) { 7759 element.setAttribute('value', toString(getToStringValue(props.value))); 7760 } 7761} 7762 7763var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare 7764 7765function isArray(a) { 7766 return isArrayImpl(a); 7767} 7768 7769var didWarnValueDefaultValue$1; 7770 7771{ 7772 didWarnValueDefaultValue$1 = false; 7773} 7774 7775function getDeclarationErrorAddendum() { 7776 var ownerName = getCurrentFiberOwnerNameInDevOrNull(); 7777 7778 if (ownerName) { 7779 return '\n\nCheck the render method of `' + ownerName + '`.'; 7780 } 7781 7782 return ''; 7783} 7784 7785var valuePropNames = ['value', 'defaultValue']; 7786/** 7787 * Validation function for `value` and `defaultValue`. 7788 */ 7789 7790function checkSelectPropTypes(props) { 7791 { 7792 checkControlledValueProps('select', props); 7793 7794 for (var i = 0; i < valuePropNames.length; i++) { 7795 var propName = valuePropNames[i]; 7796 7797 if (props[propName] == null) { 7798 continue; 7799 } 7800 7801 var propNameIsArray = isArray(props[propName]); 7802 7803 if (props.multiple && !propNameIsArray) { 7804 error('The `%s` prop supplied to <select> must be an array if ' + '`multiple` is true.%s', propName, getDeclarationErrorAddendum()); 7805 } else if (!props.multiple && propNameIsArray) { 7806 error('The `%s` prop supplied to <select> must be a scalar ' + 'value if `multiple` is false.%s', propName, getDeclarationErrorAddendum()); 7807 } 7808 } 7809 } 7810} 7811 7812function updateOptions(node, multiple, propValue, setDefaultSelected) { 7813 var options = node.options; 7814 7815 if (multiple) { 7816 var selectedValues = propValue; 7817 var selectedValue = {}; 7818 7819 for (var i = 0; i < selectedValues.length; i++) { 7820 // Prefix to avoid chaos with special keys. 7821 selectedValue['$' + selectedValues[i]] = true; 7822 } 7823 7824 for (var _i = 0; _i < options.length; _i++) { 7825 var selected = selectedValue.hasOwnProperty('$' + options[_i].value); 7826 7827 if (options[_i].selected !== selected) { 7828 options[_i].selected = selected; 7829 } 7830 7831 if (selected && setDefaultSelected) { 7832 options[_i].defaultSelected = true; 7833 } 7834 } 7835 } else { 7836 // Do not set `select.value` as exact behavior isn't consistent across all 7837 // browsers for all cases. 7838 var _selectedValue = toString(getToStringValue(propValue)); 7839 7840 var defaultSelected = null; 7841 7842 for (var _i2 = 0; _i2 < options.length; _i2++) { 7843 if (options[_i2].value === _selectedValue) { 7844 options[_i2].selected = true; 7845 7846 if (setDefaultSelected) { 7847 options[_i2].defaultSelected = true; 7848 } 7849 7850 return; 7851 } 7852 7853 if (defaultSelected === null && !options[_i2].disabled) { 7854 defaultSelected = options[_i2]; 7855 } 7856 } 7857 7858 if (defaultSelected !== null) { 7859 defaultSelected.selected = true; 7860 } 7861 } 7862} 7863/** 7864 * Implements a <select> host component that allows optionally setting the 7865 * props `value` and `defaultValue`. If `multiple` is false, the prop must be a 7866 * stringable. If `multiple` is true, the prop must be an array of stringables. 7867 * 7868 * If `value` is not supplied (or null/undefined), user actions that change the 7869 * selected option will trigger updates to the rendered options. 7870 * 7871 * If it is supplied (and not null/undefined), the rendered options will not 7872 * update in response to user actions. Instead, the `value` prop must change in 7873 * order for the rendered options to update. 7874 * 7875 * If `defaultValue` is provided, any options with the supplied values will be 7876 * selected. 7877 */ 7878 7879 7880function getHostProps$1(element, props) { 7881 return assign({}, props, { 7882 value: undefined 7883 }); 7884} 7885function initWrapperState$1(element, props) { 7886 var node = element; 7887 7888 { 7889 checkSelectPropTypes(props); 7890 } 7891 7892 node._wrapperState = { 7893 wasMultiple: !!props.multiple 7894 }; 7895 7896 { 7897 if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValueDefaultValue$1) { 7898 error('Select elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled select ' + 'element and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components'); 7899 7900 didWarnValueDefaultValue$1 = true; 7901 } 7902 } 7903} 7904function postMountWrapper$2(element, props) { 7905 var node = element; 7906 node.multiple = !!props.multiple; 7907 var value = props.value; 7908 7909 if (value != null) { 7910 updateOptions(node, !!props.multiple, value, false); 7911 } else if (props.defaultValue != null) { 7912 updateOptions(node, !!props.multiple, props.defaultValue, true); 7913 } 7914} 7915function postUpdateWrapper(element, props) { 7916 var node = element; 7917 var wasMultiple = node._wrapperState.wasMultiple; 7918 node._wrapperState.wasMultiple = !!props.multiple; 7919 var value = props.value; 7920 7921 if (value != null) { 7922 updateOptions(node, !!props.multiple, value, false); 7923 } else if (wasMultiple !== !!props.multiple) { 7924 // For simplicity, reapply `defaultValue` if `multiple` is toggled. 7925 if (props.defaultValue != null) { 7926 updateOptions(node, !!props.multiple, props.defaultValue, true); 7927 } else { 7928 // Revert the select back to its default unselected state. 7929 updateOptions(node, !!props.multiple, props.multiple ? [] : '', false); 7930 } 7931 } 7932} 7933function restoreControlledState$1(element, props) { 7934 var node = element; 7935 var value = props.value; 7936 7937 if (value != null) { 7938 updateOptions(node, !!props.multiple, value, false); 7939 } 7940} 7941 7942var didWarnValDefaultVal = false; 7943 7944/** 7945 * Implements a <textarea> host component that allows setting `value`, and 7946 * `defaultValue`. This differs from the traditional DOM API because value is 7947 * usually set as PCDATA children. 7948 * 7949 * If `value` is not supplied (or null/undefined), user actions that affect the 7950 * value will trigger updates to the element. 7951 * 7952 * If `value` is supplied (and not null/undefined), the rendered element will 7953 * not trigger updates to the element. Instead, the `value` prop must change in 7954 * order for the rendered element to be updated. 7955 * 7956 * The rendered element will be initialized with an empty value, the prop 7957 * `defaultValue` if specified, or the children content (deprecated). 7958 */ 7959function getHostProps$2(element, props) { 7960 var node = element; 7961 7962 if (props.dangerouslySetInnerHTML != null) { 7963 throw new Error('`dangerouslySetInnerHTML` does not make sense on <textarea>.'); 7964 } // Always set children to the same thing. In IE9, the selection range will 7965 // get reset if `textContent` is mutated. We could add a check in setTextContent 7966 // to only set the value if/when the value differs from the node value (which would 7967 // completely solve this IE9 bug), but Sebastian+Sophie seemed to like this 7968 // solution. The value can be a boolean or object so that's why it's forced 7969 // to be a string. 7970 7971 7972 var hostProps = assign({}, props, { 7973 value: undefined, 7974 defaultValue: undefined, 7975 children: toString(node._wrapperState.initialValue) 7976 }); 7977 7978 return hostProps; 7979} 7980function initWrapperState$2(element, props) { 7981 var node = element; 7982 7983 { 7984 checkControlledValueProps('textarea', props); 7985 7986 if (props.value !== undefined && props.defaultValue !== undefined && !didWarnValDefaultVal) { 7987 error('%s contains a textarea with both value and defaultValue props. ' + 'Textarea elements must be either controlled or uncontrolled ' + '(specify either the value prop, or the defaultValue prop, but not ' + 'both). Decide between using a controlled or uncontrolled textarea ' + 'and remove one of these props. More info: ' + 'https://reactjs.org/link/controlled-components', getCurrentFiberOwnerNameInDevOrNull() || 'A component'); 7988 7989 didWarnValDefaultVal = true; 7990 } 7991 } 7992 7993 var initialValue = props.value; // Only bother fetching default value if we're going to use it 7994 7995 if (initialValue == null) { 7996 var children = props.children, 7997 defaultValue = props.defaultValue; 7998 7999 if (children != null) { 8000 { 8001 error('Use the `defaultValue` or `value` props instead of setting ' + 'children on <textarea>.'); 8002 } 8003 8004 { 8005 if (defaultValue != null) { 8006 throw new Error('If you supply `defaultValue` on a <textarea>, do not pass children.'); 8007 } 8008 8009 if (isArray(children)) { 8010 if (children.length > 1) { 8011 throw new Error('<textarea> can only have at most one child.'); 8012 } 8013 8014 children = children[0]; 8015 } 8016 8017 defaultValue = children; 8018 } 8019 } 8020 8021 if (defaultValue == null) { 8022 defaultValue = ''; 8023 } 8024 8025 initialValue = defaultValue; 8026 } 8027 8028 node._wrapperState = { 8029 initialValue: getToStringValue(initialValue) 8030 }; 8031} 8032function updateWrapper$1(element, props) { 8033 var node = element; 8034 var value = getToStringValue(props.value); 8035 var defaultValue = getToStringValue(props.defaultValue); 8036 8037 if (value != null) { 8038 // Cast `value` to a string to ensure the value is set correctly. While 8039 // browsers typically do this as necessary, jsdom doesn't. 8040 var newValue = toString(value); // To avoid side effects (such as losing text selection), only set value if changed 8041 8042 if (newValue !== node.value) { 8043 node.value = newValue; 8044 } 8045 8046 if (props.defaultValue == null && node.defaultValue !== newValue) { 8047 node.defaultValue = newValue; 8048 } 8049 } 8050 8051 if (defaultValue != null) { 8052 node.defaultValue = toString(defaultValue); 8053 } 8054} 8055function postMountWrapper$3(element, props) { 8056 var node = element; // This is in postMount because we need access to the DOM node, which is not 8057 // available until after the component has mounted. 8058 8059 var textContent = node.textContent; // Only set node.value if textContent is equal to the expected 8060 // initial value. In IE10/IE11 there is a bug where the placeholder attribute 8061 // will populate textContent as well. 8062 // https://developer.microsoft.com/microsoft-edge/platform/issues/101525/ 8063 8064 if (textContent === node._wrapperState.initialValue) { 8065 if (textContent !== '' && textContent !== null) { 8066 node.value = textContent; 8067 } 8068 } 8069} 8070function restoreControlledState$2(element, props) { 8071 // DOM component is still mounted; update 8072 updateWrapper$1(element, props); 8073} 8074 8075var HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml'; 8076var MATH_NAMESPACE = 'http://www.w3.org/1998/Math/MathML'; 8077var SVG_NAMESPACE = 'http://www.w3.org/2000/svg'; // Assumes there is no parent namespace. 8078 8079function getIntrinsicNamespace(type) { 8080 switch (type) { 8081 case 'svg': 8082 return SVG_NAMESPACE; 8083 8084 case 'math': 8085 return MATH_NAMESPACE; 8086 8087 default: 8088 return HTML_NAMESPACE; 8089 } 8090} 8091function getChildNamespace(parentNamespace, type) { 8092 if (parentNamespace == null || parentNamespace === HTML_NAMESPACE) { 8093 // No (or default) parent namespace: potential entry point. 8094 return getIntrinsicNamespace(type); 8095 } 8096 8097 if (parentNamespace === SVG_NAMESPACE && type === 'foreignObject') { 8098 // We're leaving SVG. 8099 return HTML_NAMESPACE; 8100 } // By default, pass namespace below. 8101 8102 8103 return parentNamespace; 8104} 8105 8106/* globals MSApp */ 8107 8108/** 8109 * Create a function which has 'unsafe' privileges (required by windows8 apps) 8110 */ 8111var createMicrosoftUnsafeLocalFunction = function (func) { 8112 if (typeof MSApp !== 'undefined' && MSApp.execUnsafeLocalFunction) { 8113 return function (arg0, arg1, arg2, arg3) { 8114 MSApp.execUnsafeLocalFunction(function () { 8115 return func(arg0, arg1, arg2, arg3); 8116 }); 8117 }; 8118 } else { 8119 return func; 8120 } 8121}; 8122 8123var reusableSVGContainer; 8124/** 8125 * Set the innerHTML property of a node 8126 * 8127 * @param {DOMElement} node 8128 * @param {string} html 8129 * @internal 8130 */ 8131 8132var setInnerHTML = createMicrosoftUnsafeLocalFunction(function (node, html) { 8133 if (node.namespaceURI === SVG_NAMESPACE) { 8134 8135 if (!('innerHTML' in node)) { 8136 // IE does not have innerHTML for SVG nodes, so instead we inject the 8137 // new markup in a temp node and then move the child nodes across into 8138 // the target node 8139 reusableSVGContainer = reusableSVGContainer || document.createElement('div'); 8140 reusableSVGContainer.innerHTML = '<svg>' + html.valueOf().toString() + '</svg>'; 8141 var svgNode = reusableSVGContainer.firstChild; 8142 8143 while (node.firstChild) { 8144 node.removeChild(node.firstChild); 8145 } 8146 8147 while (svgNode.firstChild) { 8148 node.appendChild(svgNode.firstChild); 8149 } 8150 8151 return; 8152 } 8153 } 8154 8155 node.innerHTML = html; 8156}); 8157 8158/** 8159 * HTML nodeType values that represent the type of the node 8160 */ 8161var ELEMENT_NODE = 1; 8162var TEXT_NODE = 3; 8163var COMMENT_NODE = 8; 8164var DOCUMENT_NODE = 9; 8165var DOCUMENT_FRAGMENT_NODE = 11; 8166 8167/** 8168 * Set the textContent property of a node. For text updates, it's faster 8169 * to set the `nodeValue` of the Text node directly instead of using 8170 * `.textContent` which will remove the existing node and create a new one. 8171 * 8172 * @param {DOMElement} node 8173 * @param {string} text 8174 * @internal 8175 */ 8176 8177var setTextContent = function (node, text) { 8178 if (text) { 8179 var firstChild = node.firstChild; 8180 8181 if (firstChild && firstChild === node.lastChild && firstChild.nodeType === TEXT_NODE) { 8182 firstChild.nodeValue = text; 8183 return; 8184 } 8185 } 8186 8187 node.textContent = text; 8188}; 8189 8190// List derived from Gecko source code: 8191// https://github.com/mozilla/gecko-dev/blob/4e638efc71/layout/style/test/property_database.js 8192var shorthandToLonghand = { 8193 animation: ['animationDelay', 'animationDirection', 'animationDuration', 'animationFillMode', 'animationIterationCount', 'animationName', 'animationPlayState', 'animationTimingFunction'], 8194 background: ['backgroundAttachment', 'backgroundClip', 'backgroundColor', 'backgroundImage', 'backgroundOrigin', 'backgroundPositionX', 'backgroundPositionY', 'backgroundRepeat', 'backgroundSize'], 8195 backgroundPosition: ['backgroundPositionX', 'backgroundPositionY'], 8196 border: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth', 'borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth', 'borderLeftColor', 'borderLeftStyle', 'borderLeftWidth', 'borderRightColor', 'borderRightStyle', 'borderRightWidth', 'borderTopColor', 'borderTopStyle', 'borderTopWidth'], 8197 borderBlockEnd: ['borderBlockEndColor', 'borderBlockEndStyle', 'borderBlockEndWidth'], 8198 borderBlockStart: ['borderBlockStartColor', 'borderBlockStartStyle', 'borderBlockStartWidth'], 8199 borderBottom: ['borderBottomColor', 'borderBottomStyle', 'borderBottomWidth'], 8200 borderColor: ['borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor'], 8201 borderImage: ['borderImageOutset', 'borderImageRepeat', 'borderImageSlice', 'borderImageSource', 'borderImageWidth'], 8202 borderInlineEnd: ['borderInlineEndColor', 'borderInlineEndStyle', 'borderInlineEndWidth'], 8203 borderInlineStart: ['borderInlineStartColor', 'borderInlineStartStyle', 'borderInlineStartWidth'], 8204 borderLeft: ['borderLeftColor', 'borderLeftStyle', 'borderLeftWidth'], 8205 borderRadius: ['borderBottomLeftRadius', 'borderBottomRightRadius', 'borderTopLeftRadius', 'borderTopRightRadius'], 8206 borderRight: ['borderRightColor', 'borderRightStyle', 'borderRightWidth'], 8207 borderStyle: ['borderBottomStyle', 'borderLeftStyle', 'borderRightStyle', 'borderTopStyle'], 8208 borderTop: ['borderTopColor', 'borderTopStyle', 'borderTopWidth'], 8209 borderWidth: ['borderBottomWidth', 'borderLeftWidth', 'borderRightWidth', 'borderTopWidth'], 8210 columnRule: ['columnRuleColor', 'columnRuleStyle', 'columnRuleWidth'], 8211 columns: ['columnCount', 'columnWidth'], 8212 flex: ['flexBasis', 'flexGrow', 'flexShrink'], 8213 flexFlow: ['flexDirection', 'flexWrap'], 8214 font: ['fontFamily', 'fontFeatureSettings', 'fontKerning', 'fontLanguageOverride', 'fontSize', 'fontSizeAdjust', 'fontStretch', 'fontStyle', 'fontVariant', 'fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition', 'fontWeight', 'lineHeight'], 8215 fontVariant: ['fontVariantAlternates', 'fontVariantCaps', 'fontVariantEastAsian', 'fontVariantLigatures', 'fontVariantNumeric', 'fontVariantPosition'], 8216 gap: ['columnGap', 'rowGap'], 8217 grid: ['gridAutoColumns', 'gridAutoFlow', 'gridAutoRows', 'gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'], 8218 gridArea: ['gridColumnEnd', 'gridColumnStart', 'gridRowEnd', 'gridRowStart'], 8219 gridColumn: ['gridColumnEnd', 'gridColumnStart'], 8220 gridColumnGap: ['columnGap'], 8221 gridGap: ['columnGap', 'rowGap'], 8222 gridRow: ['gridRowEnd', 'gridRowStart'], 8223 gridRowGap: ['rowGap'], 8224 gridTemplate: ['gridTemplateAreas', 'gridTemplateColumns', 'gridTemplateRows'], 8225 listStyle: ['listStyleImage', 'listStylePosition', 'listStyleType'], 8226 margin: ['marginBottom', 'marginLeft', 'marginRight', 'marginTop'], 8227 marker: ['markerEnd', 'markerMid', 'markerStart'], 8228 mask: ['maskClip', 'maskComposite', 'maskImage', 'maskMode', 'maskOrigin', 'maskPositionX', 'maskPositionY', 'maskRepeat', 'maskSize'], 8229 maskPosition: ['maskPositionX', 'maskPositionY'], 8230 outline: ['outlineColor', 'outlineStyle', 'outlineWidth'], 8231 overflow: ['overflowX', 'overflowY'], 8232 padding: ['paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop'], 8233 placeContent: ['alignContent', 'justifyContent'], 8234 placeItems: ['alignItems', 'justifyItems'], 8235 placeSelf: ['alignSelf', 'justifySelf'], 8236 textDecoration: ['textDecorationColor', 'textDecorationLine', 'textDecorationStyle'], 8237 textEmphasis: ['textEmphasisColor', 'textEmphasisStyle'], 8238 transition: ['transitionDelay', 'transitionDuration', 'transitionProperty', 'transitionTimingFunction'], 8239 wordWrap: ['overflowWrap'] 8240}; 8241 8242/** 8243 * CSS properties which accept numbers but are not in units of "px". 8244 */ 8245var isUnitlessNumber = { 8246 animationIterationCount: true, 8247 aspectRatio: true, 8248 borderImageOutset: true, 8249 borderImageSlice: true, 8250 borderImageWidth: true, 8251 boxFlex: true, 8252 boxFlexGroup: true, 8253 boxOrdinalGroup: true, 8254 columnCount: true, 8255 columns: true, 8256 flex: true, 8257 flexGrow: true, 8258 flexPositive: true, 8259 flexShrink: true, 8260 flexNegative: true, 8261 flexOrder: true, 8262 gridArea: true, 8263 gridRow: true, 8264 gridRowEnd: true, 8265 gridRowSpan: true, 8266 gridRowStart: true, 8267 gridColumn: true, 8268 gridColumnEnd: true, 8269 gridColumnSpan: true, 8270 gridColumnStart: true, 8271 fontWeight: true, 8272 lineClamp: true, 8273 lineHeight: true, 8274 opacity: true, 8275 order: true, 8276 orphans: true, 8277 tabSize: true, 8278 widows: true, 8279 zIndex: true, 8280 zoom: true, 8281 // SVG-related properties 8282 fillOpacity: true, 8283 floodOpacity: true, 8284 stopOpacity: true, 8285 strokeDasharray: true, 8286 strokeDashoffset: true, 8287 strokeMiterlimit: true, 8288 strokeOpacity: true, 8289 strokeWidth: true 8290}; 8291/** 8292 * @param {string} prefix vendor-specific prefix, eg: Webkit 8293 * @param {string} key style name, eg: transitionDuration 8294 * @return {string} style name prefixed with `prefix`, properly camelCased, eg: 8295 * WebkitTransitionDuration 8296 */ 8297 8298function prefixKey(prefix, key) { 8299 return prefix + key.charAt(0).toUpperCase() + key.substring(1); 8300} 8301/** 8302 * Support style names that may come passed in prefixed by adding permutations 8303 * of vendor prefixes. 8304 */ 8305 8306 8307var prefixes = ['Webkit', 'ms', 'Moz', 'O']; // Using Object.keys here, or else the vanilla for-in loop makes IE8 go into an 8308// infinite loop, because it iterates over the newly added props too. 8309 8310Object.keys(isUnitlessNumber).forEach(function (prop) { 8311 prefixes.forEach(function (prefix) { 8312 isUnitlessNumber[prefixKey(prefix, prop)] = isUnitlessNumber[prop]; 8313 }); 8314}); 8315 8316/** 8317 * Convert a value into the proper css writable value. The style name `name` 8318 * should be logical (no hyphens), as specified 8319 * in `CSSProperty.isUnitlessNumber`. 8320 * 8321 * @param {string} name CSS property name such as `topMargin`. 8322 * @param {*} value CSS property value such as `10px`. 8323 * @return {string} Normalized style value with dimensions applied. 8324 */ 8325 8326function dangerousStyleValue(name, value, isCustomProperty) { 8327 // Note that we've removed escapeTextForBrowser() calls here since the 8328 // whole string will be escaped when the attribute is injected into 8329 // the markup. If you provide unsafe user data here they can inject 8330 // arbitrary CSS which may be problematic (I couldn't repro this): 8331 // https://www.owasp.org/index.php/XSS_Filter_Evasion_Cheat_Sheet 8332 // http://www.thespanner.co.uk/2007/11/26/ultimate-xss-css-injection/ 8333 // This is not an XSS hole but instead a potential CSS injection issue 8334 // which has lead to a greater discussion about how we're going to 8335 // trust URLs moving forward. See #2115901 8336 var isEmpty = value == null || typeof value === 'boolean' || value === ''; 8337 8338 if (isEmpty) { 8339 return ''; 8340 } 8341 8342 if (!isCustomProperty && typeof value === 'number' && value !== 0 && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name])) { 8343 return value + 'px'; // Presumes implicit 'px' suffix for unitless numbers 8344 } 8345 8346 { 8347 checkCSSPropertyStringCoercion(value, name); 8348 } 8349 8350 return ('' + value).trim(); 8351} 8352 8353var uppercasePattern = /([A-Z])/g; 8354var msPattern = /^ms-/; 8355/** 8356 * Hyphenates a camelcased CSS property name, for example: 8357 * 8358 * > hyphenateStyleName('backgroundColor') 8359 * < "background-color" 8360 * > hyphenateStyleName('MozTransition') 8361 * < "-moz-transition" 8362 * > hyphenateStyleName('msTransition') 8363 * < "-ms-transition" 8364 * 8365 * As Modernizr suggests (http://modernizr.com/docs/#prefixed), an `ms` prefix 8366 * is converted to `-ms-`. 8367 */ 8368 8369function hyphenateStyleName(name) { 8370 return name.replace(uppercasePattern, '-$1').toLowerCase().replace(msPattern, '-ms-'); 8371} 8372 8373var warnValidStyle = function () {}; 8374 8375{ 8376 // 'msTransform' is correct, but the other prefixes should be capitalized 8377 var badVendoredStyleNamePattern = /^(?:webkit|moz|o)[A-Z]/; 8378 var msPattern$1 = /^-ms-/; 8379 var hyphenPattern = /-(.)/g; // style values shouldn't contain a semicolon 8380 8381 var badStyleValueWithSemicolonPattern = /;\s*$/; 8382 var warnedStyleNames = {}; 8383 var warnedStyleValues = {}; 8384 var warnedForNaNValue = false; 8385 var warnedForInfinityValue = false; 8386 8387 var camelize = function (string) { 8388 return string.replace(hyphenPattern, function (_, character) { 8389 return character.toUpperCase(); 8390 }); 8391 }; 8392 8393 var warnHyphenatedStyleName = function (name) { 8394 if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) { 8395 return; 8396 } 8397 8398 warnedStyleNames[name] = true; 8399 8400 error('Unsupported style property %s. Did you mean %s?', name, // As Andi Smith suggests 8401 // (http://www.andismith.com/blog/2012/02/modernizr-prefixed/), an `-ms` prefix 8402 // is converted to lowercase `ms`. 8403 camelize(name.replace(msPattern$1, 'ms-'))); 8404 }; 8405 8406 var warnBadVendoredStyleName = function (name) { 8407 if (warnedStyleNames.hasOwnProperty(name) && warnedStyleNames[name]) { 8408 return; 8409 } 8410 8411 warnedStyleNames[name] = true; 8412 8413 error('Unsupported vendor-prefixed style property %s. Did you mean %s?', name, name.charAt(0).toUpperCase() + name.slice(1)); 8414 }; 8415 8416 var warnStyleValueWithSemicolon = function (name, value) { 8417 if (warnedStyleValues.hasOwnProperty(value) && warnedStyleValues[value]) { 8418 return; 8419 } 8420 8421 warnedStyleValues[value] = true; 8422 8423 error("Style property values shouldn't contain a semicolon. " + 'Try "%s: %s" instead.', name, value.replace(badStyleValueWithSemicolonPattern, '')); 8424 }; 8425 8426 var warnStyleValueIsNaN = function (name, value) { 8427 if (warnedForNaNValue) { 8428 return; 8429 } 8430 8431 warnedForNaNValue = true; 8432 8433 error('`NaN` is an invalid value for the `%s` css style property.', name); 8434 }; 8435 8436 var warnStyleValueIsInfinity = function (name, value) { 8437 if (warnedForInfinityValue) { 8438 return; 8439 } 8440 8441 warnedForInfinityValue = true; 8442 8443 error('`Infinity` is an invalid value for the `%s` css style property.', name); 8444 }; 8445 8446 warnValidStyle = function (name, value) { 8447 if (name.indexOf('-') > -1) { 8448 warnHyphenatedStyleName(name); 8449 } else if (badVendoredStyleNamePattern.test(name)) { 8450 warnBadVendoredStyleName(name); 8451 } else if (badStyleValueWithSemicolonPattern.test(value)) { 8452 warnStyleValueWithSemicolon(name, value); 8453 } 8454 8455 if (typeof value === 'number') { 8456 if (isNaN(value)) { 8457 warnStyleValueIsNaN(name, value); 8458 } else if (!isFinite(value)) { 8459 warnStyleValueIsInfinity(name, value); 8460 } 8461 } 8462 }; 8463} 8464 8465var warnValidStyle$1 = warnValidStyle; 8466 8467/** 8468 * Operations for dealing with CSS properties. 8469 */ 8470 8471/** 8472 * This creates a string that is expected to be equivalent to the style 8473 * attribute generated by server-side rendering. It by-passes warnings and 8474 * security checks so it's not safe to use this value for anything other than 8475 * comparison. It is only used in DEV for SSR validation. 8476 */ 8477 8478function createDangerousStringForStyles(styles) { 8479 { 8480 var serialized = ''; 8481 var delimiter = ''; 8482 8483 for (var styleName in styles) { 8484 if (!styles.hasOwnProperty(styleName)) { 8485 continue; 8486 } 8487 8488 var styleValue = styles[styleName]; 8489 8490 if (styleValue != null) { 8491 var isCustomProperty = styleName.indexOf('--') === 0; 8492 serialized += delimiter + (isCustomProperty ? styleName : hyphenateStyleName(styleName)) + ':'; 8493 serialized += dangerousStyleValue(styleName, styleValue, isCustomProperty); 8494 delimiter = ';'; 8495 } 8496 } 8497 8498 return serialized || null; 8499 } 8500} 8501/** 8502 * Sets the value for multiple styles on a node. If a value is specified as 8503 * '' (empty string), the corresponding style property will be unset. 8504 * 8505 * @param {DOMElement} node 8506 * @param {object} styles 8507 */ 8508 8509function setValueForStyles(node, styles) { 8510 var style = node.style; 8511 8512 for (var styleName in styles) { 8513 if (!styles.hasOwnProperty(styleName)) { 8514 continue; 8515 } 8516 8517 var isCustomProperty = styleName.indexOf('--') === 0; 8518 8519 { 8520 if (!isCustomProperty) { 8521 warnValidStyle$1(styleName, styles[styleName]); 8522 } 8523 } 8524 8525 var styleValue = dangerousStyleValue(styleName, styles[styleName], isCustomProperty); 8526 8527 if (styleName === 'float') { 8528 styleName = 'cssFloat'; 8529 } 8530 8531 if (isCustomProperty) { 8532 style.setProperty(styleName, styleValue); 8533 } else { 8534 style[styleName] = styleValue; 8535 } 8536 } 8537} 8538 8539function isValueEmpty(value) { 8540 return value == null || typeof value === 'boolean' || value === ''; 8541} 8542/** 8543 * Given {color: 'red', overflow: 'hidden'} returns { 8544 * color: 'color', 8545 * overflowX: 'overflow', 8546 * overflowY: 'overflow', 8547 * }. This can be read as "the overflowY property was set by the overflow 8548 * shorthand". That is, the values are the property that each was derived from. 8549 */ 8550 8551 8552function expandShorthandMap(styles) { 8553 var expanded = {}; 8554 8555 for (var key in styles) { 8556 var longhands = shorthandToLonghand[key] || [key]; 8557 8558 for (var i = 0; i < longhands.length; i++) { 8559 expanded[longhands[i]] = key; 8560 } 8561 } 8562 8563 return expanded; 8564} 8565/** 8566 * When mixing shorthand and longhand property names, we warn during updates if 8567 * we expect an incorrect result to occur. In particular, we warn for: 8568 * 8569 * Updating a shorthand property (longhand gets overwritten): 8570 * {font: 'foo', fontVariant: 'bar'} -> {font: 'baz', fontVariant: 'bar'} 8571 * becomes .style.font = 'baz' 8572 * Removing a shorthand property (longhand gets lost too): 8573 * {font: 'foo', fontVariant: 'bar'} -> {fontVariant: 'bar'} 8574 * becomes .style.font = '' 8575 * Removing a longhand property (should revert to shorthand; doesn't): 8576 * {font: 'foo', fontVariant: 'bar'} -> {font: 'foo'} 8577 * becomes .style.fontVariant = '' 8578 */ 8579 8580 8581function validateShorthandPropertyCollisionInDev(styleUpdates, nextStyles) { 8582 { 8583 if (!nextStyles) { 8584 return; 8585 } 8586 8587 var expandedUpdates = expandShorthandMap(styleUpdates); 8588 var expandedStyles = expandShorthandMap(nextStyles); 8589 var warnedAbout = {}; 8590 8591 for (var key in expandedUpdates) { 8592 var originalKey = expandedUpdates[key]; 8593 var correctOriginalKey = expandedStyles[key]; 8594 8595 if (correctOriginalKey && originalKey !== correctOriginalKey) { 8596 var warningKey = originalKey + ',' + correctOriginalKey; 8597 8598 if (warnedAbout[warningKey]) { 8599 continue; 8600 } 8601 8602 warnedAbout[warningKey] = true; 8603 8604 error('%s a style property during rerender (%s) when a ' + 'conflicting property is set (%s) can lead to styling bugs. To ' + "avoid this, don't mix shorthand and non-shorthand properties " + 'for the same value; instead, replace the shorthand with ' + 'separate values.', isValueEmpty(styleUpdates[originalKey]) ? 'Removing' : 'Updating', originalKey, correctOriginalKey); 8605 } 8606 } 8607 } 8608} 8609 8610// For HTML, certain tags should omit their close tag. We keep a list for 8611// those special-case tags. 8612var omittedCloseTags = { 8613 area: true, 8614 base: true, 8615 br: true, 8616 col: true, 8617 embed: true, 8618 hr: true, 8619 img: true, 8620 input: true, 8621 keygen: true, 8622 link: true, 8623 meta: true, 8624 param: true, 8625 source: true, 8626 track: true, 8627 wbr: true // NOTE: menuitem's close tag should be omitted, but that causes problems. 8628 8629}; 8630 8631// `omittedCloseTags` except that `menuitem` should still have its closing tag. 8632 8633var voidElementTags = assign({ 8634 menuitem: true 8635}, omittedCloseTags); 8636 8637var HTML = '__html'; 8638 8639function assertValidProps(tag, props) { 8640 if (!props) { 8641 return; 8642 } // Note the use of `==` which checks for null or undefined. 8643 8644 8645 if (voidElementTags[tag]) { 8646 if (props.children != null || props.dangerouslySetInnerHTML != null) { 8647 throw new Error(tag + " is a void element tag and must neither have `children` nor " + 'use `dangerouslySetInnerHTML`.'); 8648 } 8649 } 8650 8651 if (props.dangerouslySetInnerHTML != null) { 8652 if (props.children != null) { 8653 throw new Error('Can only set one of `children` or `props.dangerouslySetInnerHTML`.'); 8654 } 8655 8656 if (typeof props.dangerouslySetInnerHTML !== 'object' || !(HTML in props.dangerouslySetInnerHTML)) { 8657 throw new Error('`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. ' + 'Please visit https://reactjs.org/link/dangerously-set-inner-html ' + 'for more information.'); 8658 } 8659 } 8660 8661 { 8662 if (!props.suppressContentEditableWarning && props.contentEditable && props.children != null) { 8663 error('A component is `contentEditable` and contains `children` managed by ' + 'React. It is now your responsibility to guarantee that none of ' + 'those nodes are unexpectedly modified or duplicated. This is ' + 'probably not intentional.'); 8664 } 8665 } 8666 8667 if (props.style != null && typeof props.style !== 'object') { 8668 throw new Error('The `style` prop expects a mapping from style properties to values, ' + "not a string. For example, style={{marginRight: spacing + 'em'}} when " + 'using JSX.'); 8669 } 8670} 8671 8672function isCustomComponent(tagName, props) { 8673 if (tagName.indexOf('-') === -1) { 8674 return typeof props.is === 'string'; 8675 } 8676 8677 switch (tagName) { 8678 // These are reserved SVG and MathML elements. 8679 // We don't mind this list too much because we expect it to never grow. 8680 // The alternative is to track the namespace in a few places which is convoluted. 8681 // https://w3c.github.io/webcomponents/spec/custom/#custom-elements-core-concepts 8682 case 'annotation-xml': 8683 case 'color-profile': 8684 case 'font-face': 8685 case 'font-face-src': 8686 case 'font-face-uri': 8687 case 'font-face-format': 8688 case 'font-face-name': 8689 case 'missing-glyph': 8690 return false; 8691 8692 default: 8693 return true; 8694 } 8695} 8696 8697// When adding attributes to the HTML or SVG allowed attribute list, be sure to 8698// also add them to this module to ensure casing and incorrect name 8699// warnings. 8700var possibleStandardNames = { 8701 // HTML 8702 accept: 'accept', 8703 acceptcharset: 'acceptCharset', 8704 'accept-charset': 'acceptCharset', 8705 accesskey: 'accessKey', 8706 action: 'action', 8707 allowfullscreen: 'allowFullScreen', 8708 alt: 'alt', 8709 as: 'as', 8710 async: 'async', 8711 autocapitalize: 'autoCapitalize', 8712 autocomplete: 'autoComplete', 8713 autocorrect: 'autoCorrect', 8714 autofocus: 'autoFocus', 8715 autoplay: 'autoPlay', 8716 autosave: 'autoSave', 8717 capture: 'capture', 8718 cellpadding: 'cellPadding', 8719 cellspacing: 'cellSpacing', 8720 challenge: 'challenge', 8721 charset: 'charSet', 8722 checked: 'checked', 8723 children: 'children', 8724 cite: 'cite', 8725 class: 'className', 8726 classid: 'classID', 8727 classname: 'className', 8728 cols: 'cols', 8729 colspan: 'colSpan', 8730 content: 'content', 8731 contenteditable: 'contentEditable', 8732 contextmenu: 'contextMenu', 8733 controls: 'controls', 8734 controlslist: 'controlsList', 8735 coords: 'coords', 8736 crossorigin: 'crossOrigin', 8737 dangerouslysetinnerhtml: 'dangerouslySetInnerHTML', 8738 data: 'data', 8739 datetime: 'dateTime', 8740 default: 'default', 8741 defaultchecked: 'defaultChecked', 8742 defaultvalue: 'defaultValue', 8743 defer: 'defer', 8744 dir: 'dir', 8745 disabled: 'disabled', 8746 disablepictureinpicture: 'disablePictureInPicture', 8747 disableremoteplayback: 'disableRemotePlayback', 8748 download: 'download', 8749 draggable: 'draggable', 8750 enctype: 'encType', 8751 enterkeyhint: 'enterKeyHint', 8752 for: 'htmlFor', 8753 form: 'form', 8754 formmethod: 'formMethod', 8755 formaction: 'formAction', 8756 formenctype: 'formEncType', 8757 formnovalidate: 'formNoValidate', 8758 formtarget: 'formTarget', 8759 frameborder: 'frameBorder', 8760 headers: 'headers', 8761 height: 'height', 8762 hidden: 'hidden', 8763 high: 'high', 8764 href: 'href', 8765 hreflang: 'hrefLang', 8766 htmlfor: 'htmlFor', 8767 httpequiv: 'httpEquiv', 8768 'http-equiv': 'httpEquiv', 8769 icon: 'icon', 8770 id: 'id', 8771 imagesizes: 'imageSizes', 8772 imagesrcset: 'imageSrcSet', 8773 innerhtml: 'innerHTML', 8774 inputmode: 'inputMode', 8775 integrity: 'integrity', 8776 is: 'is', 8777 itemid: 'itemID', 8778 itemprop: 'itemProp', 8779 itemref: 'itemRef', 8780 itemscope: 'itemScope', 8781 itemtype: 'itemType', 8782 keyparams: 'keyParams', 8783 keytype: 'keyType', 8784 kind: 'kind', 8785 label: 'label', 8786 lang: 'lang', 8787 list: 'list', 8788 loop: 'loop', 8789 low: 'low', 8790 manifest: 'manifest', 8791 marginwidth: 'marginWidth', 8792 marginheight: 'marginHeight', 8793 max: 'max', 8794 maxlength: 'maxLength', 8795 media: 'media', 8796 mediagroup: 'mediaGroup', 8797 method: 'method', 8798 min: 'min', 8799 minlength: 'minLength', 8800 multiple: 'multiple', 8801 muted: 'muted', 8802 name: 'name', 8803 nomodule: 'noModule', 8804 nonce: 'nonce', 8805 novalidate: 'noValidate', 8806 open: 'open', 8807 optimum: 'optimum', 8808 pattern: 'pattern', 8809 placeholder: 'placeholder', 8810 playsinline: 'playsInline', 8811 poster: 'poster', 8812 preload: 'preload', 8813 profile: 'profile', 8814 radiogroup: 'radioGroup', 8815 readonly: 'readOnly', 8816 referrerpolicy: 'referrerPolicy', 8817 rel: 'rel', 8818 required: 'required', 8819 reversed: 'reversed', 8820 role: 'role', 8821 rows: 'rows', 8822 rowspan: 'rowSpan', 8823 sandbox: 'sandbox', 8824 scope: 'scope', 8825 scoped: 'scoped', 8826 scrolling: 'scrolling', 8827 seamless: 'seamless', 8828 selected: 'selected', 8829 shape: 'shape', 8830 size: 'size', 8831 sizes: 'sizes', 8832 span: 'span', 8833 spellcheck: 'spellCheck', 8834 src: 'src', 8835 srcdoc: 'srcDoc', 8836 srclang: 'srcLang', 8837 srcset: 'srcSet', 8838 start: 'start', 8839 step: 'step', 8840 style: 'style', 8841 summary: 'summary', 8842 tabindex: 'tabIndex', 8843 target: 'target', 8844 title: 'title', 8845 type: 'type', 8846 usemap: 'useMap', 8847 value: 'value', 8848 width: 'width', 8849 wmode: 'wmode', 8850 wrap: 'wrap', 8851 // SVG 8852 about: 'about', 8853 accentheight: 'accentHeight', 8854 'accent-height': 'accentHeight', 8855 accumulate: 'accumulate', 8856 additive: 'additive', 8857 alignmentbaseline: 'alignmentBaseline', 8858 'alignment-baseline': 'alignmentBaseline', 8859 allowreorder: 'allowReorder', 8860 alphabetic: 'alphabetic', 8861 amplitude: 'amplitude', 8862 arabicform: 'arabicForm', 8863 'arabic-form': 'arabicForm', 8864 ascent: 'ascent', 8865 attributename: 'attributeName', 8866 attributetype: 'attributeType', 8867 autoreverse: 'autoReverse', 8868 azimuth: 'azimuth', 8869 basefrequency: 'baseFrequency', 8870 baselineshift: 'baselineShift', 8871 'baseline-shift': 'baselineShift', 8872 baseprofile: 'baseProfile', 8873 bbox: 'bbox', 8874 begin: 'begin', 8875 bias: 'bias', 8876 by: 'by', 8877 calcmode: 'calcMode', 8878 capheight: 'capHeight', 8879 'cap-height': 'capHeight', 8880 clip: 'clip', 8881 clippath: 'clipPath', 8882 'clip-path': 'clipPath', 8883 clippathunits: 'clipPathUnits', 8884 cliprule: 'clipRule', 8885 'clip-rule': 'clipRule', 8886 color: 'color', 8887 colorinterpolation: 'colorInterpolation', 8888 'color-interpolation': 'colorInterpolation', 8889 colorinterpolationfilters: 'colorInterpolationFilters', 8890 'color-interpolation-filters': 'colorInterpolationFilters', 8891 colorprofile: 'colorProfile', 8892 'color-profile': 'colorProfile', 8893 colorrendering: 'colorRendering', 8894 'color-rendering': 'colorRendering', 8895 contentscripttype: 'contentScriptType', 8896 contentstyletype: 'contentStyleType', 8897 cursor: 'cursor', 8898 cx: 'cx', 8899 cy: 'cy', 8900 d: 'd', 8901 datatype: 'datatype', 8902 decelerate: 'decelerate', 8903 descent: 'descent', 8904 diffuseconstant: 'diffuseConstant', 8905 direction: 'direction', 8906 display: 'display', 8907 divisor: 'divisor', 8908 dominantbaseline: 'dominantBaseline', 8909 'dominant-baseline': 'dominantBaseline', 8910 dur: 'dur', 8911 dx: 'dx', 8912 dy: 'dy', 8913 edgemode: 'edgeMode', 8914 elevation: 'elevation', 8915 enablebackground: 'enableBackground', 8916 'enable-background': 'enableBackground', 8917 end: 'end', 8918 exponent: 'exponent', 8919 externalresourcesrequired: 'externalResourcesRequired', 8920 fill: 'fill', 8921 fillopacity: 'fillOpacity', 8922 'fill-opacity': 'fillOpacity', 8923 fillrule: 'fillRule', 8924 'fill-rule': 'fillRule', 8925 filter: 'filter', 8926 filterres: 'filterRes', 8927 filterunits: 'filterUnits', 8928 floodopacity: 'floodOpacity', 8929 'flood-opacity': 'floodOpacity', 8930 floodcolor: 'floodColor', 8931 'flood-color': 'floodColor', 8932 focusable: 'focusable', 8933 fontfamily: 'fontFamily', 8934 'font-family': 'fontFamily', 8935 fontsize: 'fontSize', 8936 'font-size': 'fontSize', 8937 fontsizeadjust: 'fontSizeAdjust', 8938 'font-size-adjust': 'fontSizeAdjust', 8939 fontstretch: 'fontStretch', 8940 'font-stretch': 'fontStretch', 8941 fontstyle: 'fontStyle', 8942 'font-style': 'fontStyle', 8943 fontvariant: 'fontVariant', 8944 'font-variant': 'fontVariant', 8945 fontweight: 'fontWeight', 8946 'font-weight': 'fontWeight', 8947 format: 'format', 8948 from: 'from', 8949 fx: 'fx', 8950 fy: 'fy', 8951 g1: 'g1', 8952 g2: 'g2', 8953 glyphname: 'glyphName', 8954 'glyph-name': 'glyphName', 8955 glyphorientationhorizontal: 'glyphOrientationHorizontal', 8956 'glyph-orientation-horizontal': 'glyphOrientationHorizontal', 8957 glyphorientationvertical: 'glyphOrientationVertical', 8958 'glyph-orientation-vertical': 'glyphOrientationVertical', 8959 glyphref: 'glyphRef', 8960 gradienttransform: 'gradientTransform', 8961 gradientunits: 'gradientUnits', 8962 hanging: 'hanging', 8963 horizadvx: 'horizAdvX', 8964 'horiz-adv-x': 'horizAdvX', 8965 horizoriginx: 'horizOriginX', 8966 'horiz-origin-x': 'horizOriginX', 8967 ideographic: 'ideographic', 8968 imagerendering: 'imageRendering', 8969 'image-rendering': 'imageRendering', 8970 in2: 'in2', 8971 in: 'in', 8972 inlist: 'inlist', 8973 intercept: 'intercept', 8974 k1: 'k1', 8975 k2: 'k2', 8976 k3: 'k3', 8977 k4: 'k4', 8978 k: 'k', 8979 kernelmatrix: 'kernelMatrix', 8980 kernelunitlength: 'kernelUnitLength', 8981 kerning: 'kerning', 8982 keypoints: 'keyPoints', 8983 keysplines: 'keySplines', 8984 keytimes: 'keyTimes', 8985 lengthadjust: 'lengthAdjust', 8986 letterspacing: 'letterSpacing', 8987 'letter-spacing': 'letterSpacing', 8988 lightingcolor: 'lightingColor', 8989 'lighting-color': 'lightingColor', 8990 limitingconeangle: 'limitingConeAngle', 8991 local: 'local', 8992 markerend: 'markerEnd', 8993 'marker-end': 'markerEnd', 8994 markerheight: 'markerHeight', 8995 markermid: 'markerMid', 8996 'marker-mid': 'markerMid', 8997 markerstart: 'markerStart', 8998 'marker-start': 'markerStart', 8999 markerunits: 'markerUnits', 9000 markerwidth: 'markerWidth', 9001 mask: 'mask', 9002 maskcontentunits: 'maskContentUnits', 9003 maskunits: 'maskUnits', 9004 mathematical: 'mathematical', 9005 mode: 'mode', 9006 numoctaves: 'numOctaves', 9007 offset: 'offset', 9008 opacity: 'opacity', 9009 operator: 'operator', 9010 order: 'order', 9011 orient: 'orient', 9012 orientation: 'orientation', 9013 origin: 'origin', 9014 overflow: 'overflow', 9015 overlineposition: 'overlinePosition', 9016 'overline-position': 'overlinePosition', 9017 overlinethickness: 'overlineThickness', 9018 'overline-thickness': 'overlineThickness', 9019 paintorder: 'paintOrder', 9020 'paint-order': 'paintOrder', 9021 panose1: 'panose1', 9022 'panose-1': 'panose1', 9023 pathlength: 'pathLength', 9024 patterncontentunits: 'patternContentUnits', 9025 patterntransform: 'patternTransform', 9026 patternunits: 'patternUnits', 9027 pointerevents: 'pointerEvents', 9028 'pointer-events': 'pointerEvents', 9029 points: 'points', 9030 pointsatx: 'pointsAtX', 9031 pointsaty: 'pointsAtY', 9032 pointsatz: 'pointsAtZ', 9033 prefix: 'prefix', 9034 preservealpha: 'preserveAlpha', 9035 preserveaspectratio: 'preserveAspectRatio', 9036 primitiveunits: 'primitiveUnits', 9037 property: 'property', 9038 r: 'r', 9039 radius: 'radius', 9040 refx: 'refX', 9041 refy: 'refY', 9042 renderingintent: 'renderingIntent', 9043 'rendering-intent': 'renderingIntent', 9044 repeatcount: 'repeatCount', 9045 repeatdur: 'repeatDur', 9046 requiredextensions: 'requiredExtensions', 9047 requiredfeatures: 'requiredFeatures', 9048 resource: 'resource', 9049 restart: 'restart', 9050 result: 'result', 9051 results: 'results', 9052 rotate: 'rotate', 9053 rx: 'rx', 9054 ry: 'ry', 9055 scale: 'scale', 9056 security: 'security', 9057 seed: 'seed', 9058 shaperendering: 'shapeRendering', 9059 'shape-rendering': 'shapeRendering', 9060 slope: 'slope', 9061 spacing: 'spacing', 9062 specularconstant: 'specularConstant', 9063 specularexponent: 'specularExponent', 9064 speed: 'speed', 9065 spreadmethod: 'spreadMethod', 9066 startoffset: 'startOffset', 9067 stddeviation: 'stdDeviation', 9068 stemh: 'stemh', 9069 stemv: 'stemv', 9070 stitchtiles: 'stitchTiles', 9071 stopcolor: 'stopColor', 9072 'stop-color': 'stopColor', 9073 stopopacity: 'stopOpacity', 9074 'stop-opacity': 'stopOpacity', 9075 strikethroughposition: 'strikethroughPosition', 9076 'strikethrough-position': 'strikethroughPosition', 9077 strikethroughthickness: 'strikethroughThickness', 9078 'strikethrough-thickness': 'strikethroughThickness', 9079 string: 'string', 9080 stroke: 'stroke', 9081 strokedasharray: 'strokeDasharray', 9082 'stroke-dasharray': 'strokeDasharray', 9083 strokedashoffset: 'strokeDashoffset', 9084 'stroke-dashoffset': 'strokeDashoffset', 9085 strokelinecap: 'strokeLinecap', 9086 'stroke-linecap': 'strokeLinecap', 9087 strokelinejoin: 'strokeLinejoin', 9088 'stroke-linejoin': 'strokeLinejoin', 9089 strokemiterlimit: 'strokeMiterlimit', 9090 'stroke-miterlimit': 'strokeMiterlimit', 9091 strokewidth: 'strokeWidth', 9092 'stroke-width': 'strokeWidth', 9093 strokeopacity: 'strokeOpacity', 9094 'stroke-opacity': 'strokeOpacity', 9095 suppresscontenteditablewarning: 'suppressContentEditableWarning', 9096 suppresshydrationwarning: 'suppressHydrationWarning', 9097 surfacescale: 'surfaceScale', 9098 systemlanguage: 'systemLanguage', 9099 tablevalues: 'tableValues', 9100 targetx: 'targetX', 9101 targety: 'targetY', 9102 textanchor: 'textAnchor', 9103 'text-anchor': 'textAnchor', 9104 textdecoration: 'textDecoration', 9105 'text-decoration': 'textDecoration', 9106 textlength: 'textLength', 9107 textrendering: 'textRendering', 9108 'text-rendering': 'textRendering', 9109 to: 'to', 9110 transform: 'transform', 9111 typeof: 'typeof', 9112 u1: 'u1', 9113 u2: 'u2', 9114 underlineposition: 'underlinePosition', 9115 'underline-position': 'underlinePosition', 9116 underlinethickness: 'underlineThickness', 9117 'underline-thickness': 'underlineThickness', 9118 unicode: 'unicode', 9119 unicodebidi: 'unicodeBidi', 9120 'unicode-bidi': 'unicodeBidi', 9121 unicoderange: 'unicodeRange', 9122 'unicode-range': 'unicodeRange', 9123 unitsperem: 'unitsPerEm', 9124 'units-per-em': 'unitsPerEm', 9125 unselectable: 'unselectable', 9126 valphabetic: 'vAlphabetic', 9127 'v-alphabetic': 'vAlphabetic', 9128 values: 'values', 9129 vectoreffect: 'vectorEffect', 9130 'vector-effect': 'vectorEffect', 9131 version: 'version', 9132 vertadvy: 'vertAdvY', 9133 'vert-adv-y': 'vertAdvY', 9134 vertoriginx: 'vertOriginX', 9135 'vert-origin-x': 'vertOriginX', 9136 vertoriginy: 'vertOriginY', 9137 'vert-origin-y': 'vertOriginY', 9138 vhanging: 'vHanging', 9139 'v-hanging': 'vHanging', 9140 videographic: 'vIdeographic', 9141 'v-ideographic': 'vIdeographic', 9142 viewbox: 'viewBox', 9143 viewtarget: 'viewTarget', 9144 visibility: 'visibility', 9145 vmathematical: 'vMathematical', 9146 'v-mathematical': 'vMathematical', 9147 vocab: 'vocab', 9148 widths: 'widths', 9149 wordspacing: 'wordSpacing', 9150 'word-spacing': 'wordSpacing', 9151 writingmode: 'writingMode', 9152 'writing-mode': 'writingMode', 9153 x1: 'x1', 9154 x2: 'x2', 9155 x: 'x', 9156 xchannelselector: 'xChannelSelector', 9157 xheight: 'xHeight', 9158 'x-height': 'xHeight', 9159 xlinkactuate: 'xlinkActuate', 9160 'xlink:actuate': 'xlinkActuate', 9161 xlinkarcrole: 'xlinkArcrole', 9162 'xlink:arcrole': 'xlinkArcrole', 9163 xlinkhref: 'xlinkHref', 9164 'xlink:href': 'xlinkHref', 9165 xlinkrole: 'xlinkRole', 9166 'xlink:role': 'xlinkRole', 9167 xlinkshow: 'xlinkShow', 9168 'xlink:show': 'xlinkShow', 9169 xlinktitle: 'xlinkTitle', 9170 'xlink:title': 'xlinkTitle', 9171 xlinktype: 'xlinkType', 9172 'xlink:type': 'xlinkType', 9173 xmlbase: 'xmlBase', 9174 'xml:base': 'xmlBase', 9175 xmllang: 'xmlLang', 9176 'xml:lang': 'xmlLang', 9177 xmlns: 'xmlns', 9178 'xml:space': 'xmlSpace', 9179 xmlnsxlink: 'xmlnsXlink', 9180 'xmlns:xlink': 'xmlnsXlink', 9181 xmlspace: 'xmlSpace', 9182 y1: 'y1', 9183 y2: 'y2', 9184 y: 'y', 9185 ychannelselector: 'yChannelSelector', 9186 z: 'z', 9187 zoomandpan: 'zoomAndPan' 9188}; 9189 9190var ariaProperties = { 9191 'aria-current': 0, 9192 // state 9193 'aria-description': 0, 9194 'aria-details': 0, 9195 'aria-disabled': 0, 9196 // state 9197 'aria-hidden': 0, 9198 // state 9199 'aria-invalid': 0, 9200 // state 9201 'aria-keyshortcuts': 0, 9202 'aria-label': 0, 9203 'aria-roledescription': 0, 9204 // Widget Attributes 9205 'aria-autocomplete': 0, 9206 'aria-checked': 0, 9207 'aria-expanded': 0, 9208 'aria-haspopup': 0, 9209 'aria-level': 0, 9210 'aria-modal': 0, 9211 'aria-multiline': 0, 9212 'aria-multiselectable': 0, 9213 'aria-orientation': 0, 9214 'aria-placeholder': 0, 9215 'aria-pressed': 0, 9216 'aria-readonly': 0, 9217 'aria-required': 0, 9218 'aria-selected': 0, 9219 'aria-sort': 0, 9220 'aria-valuemax': 0, 9221 'aria-valuemin': 0, 9222 'aria-valuenow': 0, 9223 'aria-valuetext': 0, 9224 // Live Region Attributes 9225 'aria-atomic': 0, 9226 'aria-busy': 0, 9227 'aria-live': 0, 9228 'aria-relevant': 0, 9229 // Drag-and-Drop Attributes 9230 'aria-dropeffect': 0, 9231 'aria-grabbed': 0, 9232 // Relationship Attributes 9233 'aria-activedescendant': 0, 9234 'aria-colcount': 0, 9235 'aria-colindex': 0, 9236 'aria-colspan': 0, 9237 'aria-controls': 0, 9238 'aria-describedby': 0, 9239 'aria-errormessage': 0, 9240 'aria-flowto': 0, 9241 'aria-labelledby': 0, 9242 'aria-owns': 0, 9243 'aria-posinset': 0, 9244 'aria-rowcount': 0, 9245 'aria-rowindex': 0, 9246 'aria-rowspan': 0, 9247 'aria-setsize': 0 9248}; 9249 9250var warnedProperties = {}; 9251var rARIA = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$'); 9252var rARIACamel = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$'); 9253 9254function validateProperty(tagName, name) { 9255 { 9256 if (hasOwnProperty.call(warnedProperties, name) && warnedProperties[name]) { 9257 return true; 9258 } 9259 9260 if (rARIACamel.test(name)) { 9261 var ariaName = 'aria-' + name.slice(4).toLowerCase(); 9262 var correctName = ariaProperties.hasOwnProperty(ariaName) ? ariaName : null; // If this is an aria-* attribute, but is not listed in the known DOM 9263 // DOM properties, then it is an invalid aria-* attribute. 9264 9265 if (correctName == null) { 9266 error('Invalid ARIA attribute `%s`. ARIA attributes follow the pattern aria-* and must be lowercase.', name); 9267 9268 warnedProperties[name] = true; 9269 return true; 9270 } // aria-* attributes should be lowercase; suggest the lowercase version. 9271 9272 9273 if (name !== correctName) { 9274 error('Invalid ARIA attribute `%s`. Did you mean `%s`?', name, correctName); 9275 9276 warnedProperties[name] = true; 9277 return true; 9278 } 9279 } 9280 9281 if (rARIA.test(name)) { 9282 var lowerCasedName = name.toLowerCase(); 9283 var standardName = ariaProperties.hasOwnProperty(lowerCasedName) ? lowerCasedName : null; // If this is an aria-* attribute, but is not listed in the known DOM 9284 // DOM properties, then it is an invalid aria-* attribute. 9285 9286 if (standardName == null) { 9287 warnedProperties[name] = true; 9288 return false; 9289 } // aria-* attributes should be lowercase; suggest the lowercase version. 9290 9291 9292 if (name !== standardName) { 9293 error('Unknown ARIA attribute `%s`. Did you mean `%s`?', name, standardName); 9294 9295 warnedProperties[name] = true; 9296 return true; 9297 } 9298 } 9299 } 9300 9301 return true; 9302} 9303 9304function warnInvalidARIAProps(type, props) { 9305 { 9306 var invalidProps = []; 9307 9308 for (var key in props) { 9309 var isValid = validateProperty(type, key); 9310 9311 if (!isValid) { 9312 invalidProps.push(key); 9313 } 9314 } 9315 9316 var unknownPropString = invalidProps.map(function (prop) { 9317 return '`' + prop + '`'; 9318 }).join(', '); 9319 9320 if (invalidProps.length === 1) { 9321 error('Invalid aria prop %s on <%s> tag. ' + 'For details, see https://reactjs.org/link/invalid-aria-props', unknownPropString, type); 9322 } else if (invalidProps.length > 1) { 9323 error('Invalid aria props %s on <%s> tag. ' + 'For details, see https://reactjs.org/link/invalid-aria-props', unknownPropString, type); 9324 } 9325 } 9326} 9327 9328function validateProperties(type, props) { 9329 if (isCustomComponent(type, props)) { 9330 return; 9331 } 9332 9333 warnInvalidARIAProps(type, props); 9334} 9335 9336var didWarnValueNull = false; 9337function validateProperties$1(type, props) { 9338 { 9339 if (type !== 'input' && type !== 'textarea' && type !== 'select') { 9340 return; 9341 } 9342 9343 if (props != null && props.value === null && !didWarnValueNull) { 9344 didWarnValueNull = true; 9345 9346 if (type === 'select' && props.multiple) { 9347 error('`value` prop on `%s` should not be null. ' + 'Consider using an empty array when `multiple` is set to `true` ' + 'to clear the component or `undefined` for uncontrolled components.', type); 9348 } else { 9349 error('`value` prop on `%s` should not be null. ' + 'Consider using an empty string to clear the component or `undefined` ' + 'for uncontrolled components.', type); 9350 } 9351 } 9352 } 9353} 9354 9355var validateProperty$1 = function () {}; 9356 9357{ 9358 var warnedProperties$1 = {}; 9359 var EVENT_NAME_REGEX = /^on./; 9360 var INVALID_EVENT_NAME_REGEX = /^on[^A-Z]/; 9361 var rARIA$1 = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$'); 9362 var rARIACamel$1 = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$'); 9363 9364 validateProperty$1 = function (tagName, name, value, eventRegistry) { 9365 if (hasOwnProperty.call(warnedProperties$1, name) && warnedProperties$1[name]) { 9366 return true; 9367 } 9368 9369 var lowerCasedName = name.toLowerCase(); 9370 9371 if (lowerCasedName === 'onfocusin' || lowerCasedName === 'onfocusout') { 9372 error('React uses onFocus and onBlur instead of onFocusIn and onFocusOut. ' + 'All React events are normalized to bubble, so onFocusIn and onFocusOut ' + 'are not needed/supported by React.'); 9373 9374 warnedProperties$1[name] = true; 9375 return true; 9376 } // We can't rely on the event system being injected on the server. 9377 9378 9379 if (eventRegistry != null) { 9380 var registrationNameDependencies = eventRegistry.registrationNameDependencies, 9381 possibleRegistrationNames = eventRegistry.possibleRegistrationNames; 9382 9383 if (registrationNameDependencies.hasOwnProperty(name)) { 9384 return true; 9385 } 9386 9387 var registrationName = possibleRegistrationNames.hasOwnProperty(lowerCasedName) ? possibleRegistrationNames[lowerCasedName] : null; 9388 9389 if (registrationName != null) { 9390 error('Invalid event handler property `%s`. Did you mean `%s`?', name, registrationName); 9391 9392 warnedProperties$1[name] = true; 9393 return true; 9394 } 9395 9396 if (EVENT_NAME_REGEX.test(name)) { 9397 error('Unknown event handler property `%s`. It will be ignored.', name); 9398 9399 warnedProperties$1[name] = true; 9400 return true; 9401 } 9402 } else if (EVENT_NAME_REGEX.test(name)) { 9403 // If no event plugins have been injected, we are in a server environment. 9404 // So we can't tell if the event name is correct for sure, but we can filter 9405 // out known bad ones like `onclick`. We can't suggest a specific replacement though. 9406 if (INVALID_EVENT_NAME_REGEX.test(name)) { 9407 error('Invalid event handler property `%s`. ' + 'React events use the camelCase naming convention, for example `onClick`.', name); 9408 } 9409 9410 warnedProperties$1[name] = true; 9411 return true; 9412 } // Let the ARIA attribute hook validate ARIA attributes 9413 9414 9415 if (rARIA$1.test(name) || rARIACamel$1.test(name)) { 9416 return true; 9417 } 9418 9419 if (lowerCasedName === 'innerhtml') { 9420 error('Directly setting property `innerHTML` is not permitted. ' + 'For more information, lookup documentation on `dangerouslySetInnerHTML`.'); 9421 9422 warnedProperties$1[name] = true; 9423 return true; 9424 } 9425 9426 if (lowerCasedName === 'aria') { 9427 error('The `aria` attribute is reserved for future use in React. ' + 'Pass individual `aria-` attributes instead.'); 9428 9429 warnedProperties$1[name] = true; 9430 return true; 9431 } 9432 9433 if (lowerCasedName === 'is' && value !== null && value !== undefined && typeof value !== 'string') { 9434 error('Received a `%s` for a string attribute `is`. If this is expected, cast ' + 'the value to a string.', typeof value); 9435 9436 warnedProperties$1[name] = true; 9437 return true; 9438 } 9439 9440 if (typeof value === 'number' && isNaN(value)) { 9441 error('Received NaN for the `%s` attribute. If this is expected, cast ' + 'the value to a string.', name); 9442 9443 warnedProperties$1[name] = true; 9444 return true; 9445 } 9446 9447 var propertyInfo = getPropertyInfo(name); 9448 var isReserved = propertyInfo !== null && propertyInfo.type === RESERVED; // Known attributes should match the casing specified in the property config. 9449 9450 if (possibleStandardNames.hasOwnProperty(lowerCasedName)) { 9451 var standardName = possibleStandardNames[lowerCasedName]; 9452 9453 if (standardName !== name) { 9454 error('Invalid DOM property `%s`. Did you mean `%s`?', name, standardName); 9455 9456 warnedProperties$1[name] = true; 9457 return true; 9458 } 9459 } else if (!isReserved && name !== lowerCasedName) { 9460 // Unknown attributes should have lowercase casing since that's how they 9461 // will be cased anyway with server rendering. 9462 error('React does not recognize the `%s` prop on a DOM element. If you ' + 'intentionally want it to appear in the DOM as a custom ' + 'attribute, spell it as lowercase `%s` instead. ' + 'If you accidentally passed it from a parent component, remove ' + 'it from the DOM element.', name, lowerCasedName); 9463 9464 warnedProperties$1[name] = true; 9465 return true; 9466 } 9467 9468 if (typeof value === 'boolean' && shouldRemoveAttributeWithWarning(name, value, propertyInfo, false)) { 9469 if (value) { 9470 error('Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.', value, name, name, value, name); 9471 } else { 9472 error('Received `%s` for a non-boolean attribute `%s`.\n\n' + 'If you want to write it to the DOM, pass a string instead: ' + '%s="%s" or %s={value.toString()}.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.', value, name, name, value, name, name, name); 9473 } 9474 9475 warnedProperties$1[name] = true; 9476 return true; 9477 } // Now that we've validated casing, do not validate 9478 // data types for reserved props 9479 9480 9481 if (isReserved) { 9482 return true; 9483 } // Warn when a known attribute is a bad type 9484 9485 9486 if (shouldRemoveAttributeWithWarning(name, value, propertyInfo, false)) { 9487 warnedProperties$1[name] = true; 9488 return false; 9489 } // Warn when passing the strings 'false' or 'true' into a boolean prop 9490 9491 9492 if ((value === 'false' || value === 'true') && propertyInfo !== null && propertyInfo.type === BOOLEAN) { 9493 error('Received the string `%s` for the boolean attribute `%s`. ' + '%s ' + 'Did you mean %s={%s}?', value, name, value === 'false' ? 'The browser will interpret it as a truthy value.' : 'Although this works, it will not work as expected if you pass the string "false".', name, value); 9494 9495 warnedProperties$1[name] = true; 9496 return true; 9497 } 9498 9499 return true; 9500 }; 9501} 9502 9503var warnUnknownProperties = function (type, props, eventRegistry) { 9504 { 9505 var unknownProps = []; 9506 9507 for (var key in props) { 9508 var isValid = validateProperty$1(type, key, props[key], eventRegistry); 9509 9510 if (!isValid) { 9511 unknownProps.push(key); 9512 } 9513 } 9514 9515 var unknownPropString = unknownProps.map(function (prop) { 9516 return '`' + prop + '`'; 9517 }).join(', '); 9518 9519 if (unknownProps.length === 1) { 9520 error('Invalid value for prop %s on <%s> tag. Either remove it from the element, ' + 'or pass a string or number value to keep it in the DOM. ' + 'For details, see https://reactjs.org/link/attribute-behavior ', unknownPropString, type); 9521 } else if (unknownProps.length > 1) { 9522 error('Invalid values for props %s on <%s> tag. Either remove them from the element, ' + 'or pass a string or number value to keep them in the DOM. ' + 'For details, see https://reactjs.org/link/attribute-behavior ', unknownPropString, type); 9523 } 9524 } 9525}; 9526 9527function validateProperties$2(type, props, eventRegistry) { 9528 if (isCustomComponent(type, props)) { 9529 return; 9530 } 9531 9532 warnUnknownProperties(type, props, eventRegistry); 9533} 9534 9535var IS_EVENT_HANDLE_NON_MANAGED_NODE = 1; 9536var IS_NON_DELEGATED = 1 << 1; 9537var IS_CAPTURE_PHASE = 1 << 2; 9538// set to LEGACY_FB_SUPPORT. LEGACY_FB_SUPPORT only gets set when 9539// we call willDeferLaterForLegacyFBSupport, thus not bailing out 9540// will result in endless cycles like an infinite loop. 9541// We also don't want to defer during event replaying. 9542 9543var SHOULD_NOT_PROCESS_POLYFILL_EVENT_PLUGINS = IS_EVENT_HANDLE_NON_MANAGED_NODE | IS_NON_DELEGATED | IS_CAPTURE_PHASE; 9544 9545// This exists to avoid circular dependency between ReactDOMEventReplaying 9546// and DOMPluginEventSystem. 9547var currentReplayingEvent = null; 9548function setReplayingEvent(event) { 9549 { 9550 if (currentReplayingEvent !== null) { 9551 error('Expected currently replaying event to be null. This error ' + 'is likely caused by a bug in React. Please file an issue.'); 9552 } 9553 } 9554 9555 currentReplayingEvent = event; 9556} 9557function resetReplayingEvent() { 9558 { 9559 if (currentReplayingEvent === null) { 9560 error('Expected currently replaying event to not be null. This error ' + 'is likely caused by a bug in React. Please file an issue.'); 9561 } 9562 } 9563 9564 currentReplayingEvent = null; 9565} 9566function isReplayingEvent(event) { 9567 return event === currentReplayingEvent; 9568} 9569 9570/** 9571 * Gets the target node from a native browser event by accounting for 9572 * inconsistencies in browser DOM APIs. 9573 * 9574 * @param {object} nativeEvent Native browser event. 9575 * @return {DOMEventTarget} Target node. 9576 */ 9577 9578function getEventTarget(nativeEvent) { 9579 // Fallback to nativeEvent.srcElement for IE9 9580 // https://github.com/facebook/react/issues/12506 9581 var target = nativeEvent.target || nativeEvent.srcElement || window; // Normalize SVG <use> element events #4963 9582 9583 if (target.correspondingUseElement) { 9584 target = target.correspondingUseElement; 9585 } // Safari may fire events on text nodes (Node.TEXT_NODE is 3). 9586 // @see http://www.quirksmode.org/js/events_properties.html 9587 9588 9589 return target.nodeType === TEXT_NODE ? target.parentNode : target; 9590} 9591 9592var restoreImpl = null; 9593var restoreTarget = null; 9594var restoreQueue = null; 9595 9596function restoreStateOfTarget(target) { 9597 // We perform this translation at the end of the event loop so that we 9598 // always receive the correct fiber here 9599 var internalInstance = getInstanceFromNode(target); 9600 9601 if (!internalInstance) { 9602 // Unmounted 9603 return; 9604 } 9605 9606 if (typeof restoreImpl !== 'function') { 9607 throw new Error('setRestoreImplementation() needs to be called to handle a target for controlled ' + 'events. This error is likely caused by a bug in React. Please file an issue.'); 9608 } 9609 9610 var stateNode = internalInstance.stateNode; // Guard against Fiber being unmounted. 9611 9612 if (stateNode) { 9613 var _props = getFiberCurrentPropsFromNode(stateNode); 9614 9615 restoreImpl(internalInstance.stateNode, internalInstance.type, _props); 9616 } 9617} 9618 9619function setRestoreImplementation(impl) { 9620 restoreImpl = impl; 9621} 9622function enqueueStateRestore(target) { 9623 if (restoreTarget) { 9624 if (restoreQueue) { 9625 restoreQueue.push(target); 9626 } else { 9627 restoreQueue = [target]; 9628 } 9629 } else { 9630 restoreTarget = target; 9631 } 9632} 9633function needsStateRestore() { 9634 return restoreTarget !== null || restoreQueue !== null; 9635} 9636function restoreStateIfNeeded() { 9637 if (!restoreTarget) { 9638 return; 9639 } 9640 9641 var target = restoreTarget; 9642 var queuedTargets = restoreQueue; 9643 restoreTarget = null; 9644 restoreQueue = null; 9645 restoreStateOfTarget(target); 9646 9647 if (queuedTargets) { 9648 for (var i = 0; i < queuedTargets.length; i++) { 9649 restoreStateOfTarget(queuedTargets[i]); 9650 } 9651 } 9652} 9653 9654// the renderer. Such as when we're dispatching events or if third party 9655// libraries need to call batchedUpdates. Eventually, this API will go away when 9656// everything is batched by default. We'll then have a similar API to opt-out of 9657// scheduled work and instead do synchronous work. 9658// Defaults 9659 9660var batchedUpdatesImpl = function (fn, bookkeeping) { 9661 return fn(bookkeeping); 9662}; 9663 9664var flushSyncImpl = function () {}; 9665 9666var isInsideEventHandler = false; 9667 9668function finishEventHandler() { 9669 // Here we wait until all updates have propagated, which is important 9670 // when using controlled components within layers: 9671 // https://github.com/facebook/react/issues/1698 9672 // Then we restore state of any controlled component. 9673 var controlledComponentsHavePendingUpdates = needsStateRestore(); 9674 9675 if (controlledComponentsHavePendingUpdates) { 9676 // If a controlled event was fired, we may need to restore the state of 9677 // the DOM node back to the controlled value. This is necessary when React 9678 // bails out of the update without touching the DOM. 9679 // TODO: Restore state in the microtask, after the discrete updates flush, 9680 // instead of early flushing them here. 9681 flushSyncImpl(); 9682 restoreStateIfNeeded(); 9683 } 9684} 9685 9686function batchedUpdates(fn, a, b) { 9687 if (isInsideEventHandler) { 9688 // If we are currently inside another batch, we need to wait until it 9689 // fully completes before restoring state. 9690 return fn(a, b); 9691 } 9692 9693 isInsideEventHandler = true; 9694 9695 try { 9696 return batchedUpdatesImpl(fn, a, b); 9697 } finally { 9698 isInsideEventHandler = false; 9699 finishEventHandler(); 9700 } 9701} // TODO: Replace with flushSync 9702function setBatchingImplementation(_batchedUpdatesImpl, _discreteUpdatesImpl, _flushSyncImpl) { 9703 batchedUpdatesImpl = _batchedUpdatesImpl; 9704 flushSyncImpl = _flushSyncImpl; 9705} 9706 9707function isInteractive(tag) { 9708 return tag === 'button' || tag === 'input' || tag === 'select' || tag === 'textarea'; 9709} 9710 9711function shouldPreventMouseEvent(name, type, props) { 9712 switch (name) { 9713 case 'onClick': 9714 case 'onClickCapture': 9715 case 'onDoubleClick': 9716 case 'onDoubleClickCapture': 9717 case 'onMouseDown': 9718 case 'onMouseDownCapture': 9719 case 'onMouseMove': 9720 case 'onMouseMoveCapture': 9721 case 'onMouseUp': 9722 case 'onMouseUpCapture': 9723 case 'onMouseEnter': 9724 return !!(props.disabled && isInteractive(type)); 9725 9726 default: 9727 return false; 9728 } 9729} 9730/** 9731 * @param {object} inst The instance, which is the source of events. 9732 * @param {string} registrationName Name of listener (e.g. `onClick`). 9733 * @return {?function} The stored callback. 9734 */ 9735 9736 9737function getListener(inst, registrationName) { 9738 var stateNode = inst.stateNode; 9739 9740 if (stateNode === null) { 9741 // Work in progress (ex: onload events in incremental mode). 9742 return null; 9743 } 9744 9745 var props = getFiberCurrentPropsFromNode(stateNode); 9746 9747 if (props === null) { 9748 // Work in progress. 9749 return null; 9750 } 9751 9752 var listener = props[registrationName]; 9753 9754 if (shouldPreventMouseEvent(registrationName, inst.type, props)) { 9755 return null; 9756 } 9757 9758 if (listener && typeof listener !== 'function') { 9759 throw new Error("Expected `" + registrationName + "` listener to be a function, instead got a value of `" + typeof listener + "` type."); 9760 } 9761 9762 return listener; 9763} 9764 9765var passiveBrowserEventsSupported = false; // Check if browser support events with passive listeners 9766// https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support 9767 9768if (canUseDOM) { 9769 try { 9770 var options = {}; // $FlowFixMe: Ignore Flow complaining about needing a value 9771 9772 Object.defineProperty(options, 'passive', { 9773 get: function () { 9774 passiveBrowserEventsSupported = true; 9775 } 9776 }); 9777 window.addEventListener('test', options, options); 9778 window.removeEventListener('test', options, options); 9779 } catch (e) { 9780 passiveBrowserEventsSupported = false; 9781 } 9782} 9783 9784function invokeGuardedCallbackProd(name, func, context, a, b, c, d, e, f) { 9785 var funcArgs = Array.prototype.slice.call(arguments, 3); 9786 9787 try { 9788 func.apply(context, funcArgs); 9789 } catch (error) { 9790 this.onError(error); 9791 } 9792} 9793 9794var invokeGuardedCallbackImpl = invokeGuardedCallbackProd; 9795 9796{ 9797 // In DEV mode, we swap out invokeGuardedCallback for a special version 9798 // that plays more nicely with the browser's DevTools. The idea is to preserve 9799 // "Pause on exceptions" behavior. Because React wraps all user-provided 9800 // functions in invokeGuardedCallback, and the production version of 9801 // invokeGuardedCallback uses a try-catch, all user exceptions are treated 9802 // like caught exceptions, and the DevTools won't pause unless the developer 9803 // takes the extra step of enabling pause on caught exceptions. This is 9804 // unintuitive, though, because even though React has caught the error, from 9805 // the developer's perspective, the error is uncaught. 9806 // 9807 // To preserve the expected "Pause on exceptions" behavior, we don't use a 9808 // try-catch in DEV. Instead, we synchronously dispatch a fake event to a fake 9809 // DOM node, and call the user-provided callback from inside an event handler 9810 // for that fake event. If the callback throws, the error is "captured" using 9811 // a global event handler. But because the error happens in a different 9812 // event loop context, it does not interrupt the normal program flow. 9813 // Effectively, this gives us try-catch behavior without actually using 9814 // try-catch. Neat! 9815 // Check that the browser supports the APIs we need to implement our special 9816 // DEV version of invokeGuardedCallback 9817 if (typeof window !== 'undefined' && typeof window.dispatchEvent === 'function' && typeof document !== 'undefined' && typeof document.createEvent === 'function') { 9818 var fakeNode = document.createElement('react'); 9819 9820 invokeGuardedCallbackImpl = function invokeGuardedCallbackDev(name, func, context, a, b, c, d, e, f) { 9821 // If document doesn't exist we know for sure we will crash in this method 9822 // when we call document.createEvent(). However this can cause confusing 9823 // errors: https://github.com/facebook/create-react-app/issues/3482 9824 // So we preemptively throw with a better message instead. 9825 if (typeof document === 'undefined' || document === null) { 9826 throw new Error('The `document` global was defined when React was initialized, but is not ' + 'defined anymore. This can happen in a test environment if a component ' + 'schedules an update from an asynchronous callback, but the test has already ' + 'finished running. To solve this, you can either unmount the component at ' + 'the end of your test (and ensure that any asynchronous operations get ' + 'canceled in `componentWillUnmount`), or you can change the test itself ' + 'to be asynchronous.'); 9827 } 9828 9829 var evt = document.createEvent('Event'); 9830 var didCall = false; // Keeps track of whether the user-provided callback threw an error. We 9831 // set this to true at the beginning, then set it to false right after 9832 // calling the function. If the function errors, `didError` will never be 9833 // set to false. This strategy works even if the browser is flaky and 9834 // fails to call our global error handler, because it doesn't rely on 9835 // the error event at all. 9836 9837 var didError = true; // Keeps track of the value of window.event so that we can reset it 9838 // during the callback to let user code access window.event in the 9839 // browsers that support it. 9840 9841 var windowEvent = window.event; // Keeps track of the descriptor of window.event to restore it after event 9842 // dispatching: https://github.com/facebook/react/issues/13688 9843 9844 var windowEventDescriptor = Object.getOwnPropertyDescriptor(window, 'event'); 9845 9846 function restoreAfterDispatch() { 9847 // We immediately remove the callback from event listeners so that 9848 // nested `invokeGuardedCallback` calls do not clash. Otherwise, a 9849 // nested call would trigger the fake event handlers of any call higher 9850 // in the stack. 9851 fakeNode.removeEventListener(evtType, callCallback, false); // We check for window.hasOwnProperty('event') to prevent the 9852 // window.event assignment in both IE <= 10 as they throw an error 9853 // "Member not found" in strict mode, and in Firefox which does not 9854 // support window.event. 9855 9856 if (typeof window.event !== 'undefined' && window.hasOwnProperty('event')) { 9857 window.event = windowEvent; 9858 } 9859 } // Create an event handler for our fake event. We will synchronously 9860 // dispatch our fake event using `dispatchEvent`. Inside the handler, we 9861 // call the user-provided callback. 9862 9863 9864 var funcArgs = Array.prototype.slice.call(arguments, 3); 9865 9866 function callCallback() { 9867 didCall = true; 9868 restoreAfterDispatch(); 9869 func.apply(context, funcArgs); 9870 didError = false; 9871 } // Create a global error event handler. We use this to capture the value 9872 // that was thrown. It's possible that this error handler will fire more 9873 // than once; for example, if non-React code also calls `dispatchEvent` 9874 // and a handler for that event throws. We should be resilient to most of 9875 // those cases. Even if our error event handler fires more than once, the 9876 // last error event is always used. If the callback actually does error, 9877 // we know that the last error event is the correct one, because it's not 9878 // possible for anything else to have happened in between our callback 9879 // erroring and the code that follows the `dispatchEvent` call below. If 9880 // the callback doesn't error, but the error event was fired, we know to 9881 // ignore it because `didError` will be false, as described above. 9882 9883 9884 var error; // Use this to track whether the error event is ever called. 9885 9886 var didSetError = false; 9887 var isCrossOriginError = false; 9888 9889 function handleWindowError(event) { 9890 error = event.error; 9891 didSetError = true; 9892 9893 if (error === null && event.colno === 0 && event.lineno === 0) { 9894 isCrossOriginError = true; 9895 } 9896 9897 if (event.defaultPrevented) { 9898 // Some other error handler has prevented default. 9899 // Browsers silence the error report if this happens. 9900 // We'll remember this to later decide whether to log it or not. 9901 if (error != null && typeof error === 'object') { 9902 try { 9903 error._suppressLogging = true; 9904 } catch (inner) {// Ignore. 9905 } 9906 } 9907 } 9908 } // Create a fake event type. 9909 9910 9911 var evtType = "react-" + (name ? name : 'invokeguardedcallback'); // Attach our event handlers 9912 9913 window.addEventListener('error', handleWindowError); 9914 fakeNode.addEventListener(evtType, callCallback, false); // Synchronously dispatch our fake event. If the user-provided function 9915 // errors, it will trigger our global error handler. 9916 9917 evt.initEvent(evtType, false, false); 9918 fakeNode.dispatchEvent(evt); 9919 9920 if (windowEventDescriptor) { 9921 Object.defineProperty(window, 'event', windowEventDescriptor); 9922 } 9923 9924 if (didCall && didError) { 9925 if (!didSetError) { 9926 // The callback errored, but the error event never fired. 9927 // eslint-disable-next-line react-internal/prod-error-codes 9928 error = new Error('An error was thrown inside one of your components, but React ' + "doesn't know what it was. This is likely due to browser " + 'flakiness. React does its best to preserve the "Pause on ' + 'exceptions" behavior of the DevTools, which requires some ' + "DEV-mode only tricks. It's possible that these don't work in " + 'your browser. Try triggering the error in production mode, ' + 'or switching to a modern browser. If you suspect that this is ' + 'actually an issue with React, please file an issue.'); 9929 } else if (isCrossOriginError) { 9930 // eslint-disable-next-line react-internal/prod-error-codes 9931 error = new Error("A cross-origin error was thrown. React doesn't have access to " + 'the actual error object in development. ' + 'See https://reactjs.org/link/crossorigin-error for more information.'); 9932 } 9933 9934 this.onError(error); 9935 } // Remove our event listeners 9936 9937 9938 window.removeEventListener('error', handleWindowError); 9939 9940 if (!didCall) { 9941 // Something went really wrong, and our event was not dispatched. 9942 // https://github.com/facebook/react/issues/16734 9943 // https://github.com/facebook/react/issues/16585 9944 // Fall back to the production implementation. 9945 restoreAfterDispatch(); 9946 return invokeGuardedCallbackProd.apply(this, arguments); 9947 } 9948 }; 9949 } 9950} 9951 9952var invokeGuardedCallbackImpl$1 = invokeGuardedCallbackImpl; 9953 9954var hasError = false; 9955var caughtError = null; // Used by event system to capture/rethrow the first error. 9956 9957var hasRethrowError = false; 9958var rethrowError = null; 9959var reporter = { 9960 onError: function (error) { 9961 hasError = true; 9962 caughtError = error; 9963 } 9964}; 9965/** 9966 * Call a function while guarding against errors that happens within it. 9967 * Returns an error if it throws, otherwise null. 9968 * 9969 * In production, this is implemented using a try-catch. The reason we don't 9970 * use a try-catch directly is so that we can swap out a different 9971 * implementation in DEV mode. 9972 * 9973 * @param {String} name of the guard to use for logging or debugging 9974 * @param {Function} func The function to invoke 9975 * @param {*} context The context to use when calling the function 9976 * @param {...*} args Arguments for function 9977 */ 9978 9979function invokeGuardedCallback(name, func, context, a, b, c, d, e, f) { 9980 hasError = false; 9981 caughtError = null; 9982 invokeGuardedCallbackImpl$1.apply(reporter, arguments); 9983} 9984/** 9985 * Same as invokeGuardedCallback, but instead of returning an error, it stores 9986 * it in a global so it can be rethrown by `rethrowCaughtError` later. 9987 * TODO: See if caughtError and rethrowError can be unified. 9988 * 9989 * @param {String} name of the guard to use for logging or debugging 9990 * @param {Function} func The function to invoke 9991 * @param {*} context The context to use when calling the function 9992 * @param {...*} args Arguments for function 9993 */ 9994 9995function invokeGuardedCallbackAndCatchFirstError(name, func, context, a, b, c, d, e, f) { 9996 invokeGuardedCallback.apply(this, arguments); 9997 9998 if (hasError) { 9999 var error = clearCaughtError(); 10000 10001 if (!hasRethrowError) { 10002 hasRethrowError = true; 10003 rethrowError = error; 10004 } 10005 } 10006} 10007/** 10008 * During execution of guarded functions we will capture the first error which 10009 * we will rethrow to be handled by the top level error handler. 10010 */ 10011 10012function rethrowCaughtError() { 10013 if (hasRethrowError) { 10014 var error = rethrowError; 10015 hasRethrowError = false; 10016 rethrowError = null; 10017 throw error; 10018 } 10019} 10020function hasCaughtError() { 10021 return hasError; 10022} 10023function clearCaughtError() { 10024 if (hasError) { 10025 var error = caughtError; 10026 hasError = false; 10027 caughtError = null; 10028 return error; 10029 } else { 10030 throw new Error('clearCaughtError was called but no error was captured. This error ' + 'is likely caused by a bug in React. Please file an issue.'); 10031 } 10032} 10033 10034/** 10035 * `ReactInstanceMap` maintains a mapping from a public facing stateful 10036 * instance (key) and the internal representation (value). This allows public 10037 * methods to accept the user facing instance as an argument and map them back 10038 * to internal methods. 10039 * 10040 * Note that this module is currently shared and assumed to be stateless. 10041 * If this becomes an actual Map, that will break. 10042 */ 10043function get(key) { 10044 return key._reactInternals; 10045} 10046function has(key) { 10047 return key._reactInternals !== undefined; 10048} 10049function set(key, value) { 10050 key._reactInternals = value; 10051} 10052 10053// Don't change these two values. They're used by React Dev Tools. 10054var NoFlags = 10055/* */ 100560; 10057var PerformedWork = 10058/* */ 100591; // You can change the rest (and add more). 10060 10061var Placement = 10062/* */ 100632; 10064var Update = 10065/* */ 100664; 10067var ChildDeletion = 10068/* */ 1006916; 10070var ContentReset = 10071/* */ 1007232; 10073var Callback = 10074/* */ 1007564; 10076var DidCapture = 10077/* */ 10078128; 10079var ForceClientRender = 10080/* */ 10081256; 10082var Ref = 10083/* */ 10084512; 10085var Snapshot = 10086/* */ 100871024; 10088var Passive = 10089/* */ 100902048; 10091var Hydrating = 10092/* */ 100934096; 10094var Visibility = 10095/* */ 100968192; 10097var StoreConsistency = 10098/* */ 1009916384; 10100var LifecycleEffectMask = Passive | Update | Callback | Ref | Snapshot | StoreConsistency; // Union of all commit flags (flags with the lifetime of a particular commit) 10101 10102var HostEffectMask = 10103/* */ 1010432767; // These are not really side effects, but we still reuse this field. 10105 10106var Incomplete = 10107/* */ 1010832768; 10109var ShouldCapture = 10110/* */ 1011165536; 10112var ForceUpdateForLegacySuspense = 10113/* */ 10114131072; 10115var Forked = 10116/* */ 101171048576; // Static tags describe aspects of a fiber that are not specific to a render, 10118// e.g. a fiber uses a passive effect (even if there are no updates on this particular render). 10119// This enables us to defer more work in the unmount case, 10120// since we can defer traversing the tree during layout to look for Passive effects, 10121// and instead rely on the static flag as a signal that there may be cleanup work. 10122 10123var RefStatic = 10124/* */ 101252097152; 10126var LayoutStatic = 10127/* */ 101284194304; 10129var PassiveStatic = 10130/* */ 101318388608; // These flags allow us to traverse to fibers that have effects on mount 10132// without traversing the entire tree after every commit for 10133// double invoking 10134 10135var MountLayoutDev = 10136/* */ 1013716777216; 10138var MountPassiveDev = 10139/* */ 1014033554432; // Groups of flags that are used in the commit phase to skip over trees that 10141// don't contain effects, by checking subtreeFlags. 10142 10143var BeforeMutationMask = // TODO: Remove Update flag from before mutation phase by re-landing Visibility 10144// flag logic (see #20043) 10145Update | Snapshot | ( 0); 10146var MutationMask = Placement | Update | ChildDeletion | ContentReset | Ref | Hydrating | Visibility; 10147var LayoutMask = Update | Callback | Ref | Visibility; // TODO: Split into PassiveMountMask and PassiveUnmountMask 10148 10149var PassiveMask = Passive | ChildDeletion; // Union of tags that don't get reset on clones. 10150// This allows certain concepts to persist without recalculating them, 10151// e.g. whether a subtree contains passive effects or portals. 10152 10153var StaticMask = LayoutStatic | PassiveStatic | RefStatic; 10154 10155var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner; 10156function getNearestMountedFiber(fiber) { 10157 var node = fiber; 10158 var nearestMounted = fiber; 10159 10160 if (!fiber.alternate) { 10161 // If there is no alternate, this might be a new tree that isn't inserted 10162 // yet. If it is, then it will have a pending insertion effect on it. 10163 var nextNode = node; 10164 10165 do { 10166 node = nextNode; 10167 10168 if ((node.flags & (Placement | Hydrating)) !== NoFlags) { 10169 // This is an insertion or in-progress hydration. The nearest possible 10170 // mounted fiber is the parent but we need to continue to figure out 10171 // if that one is still mounted. 10172 nearestMounted = node.return; 10173 } 10174 10175 nextNode = node.return; 10176 } while (nextNode); 10177 } else { 10178 while (node.return) { 10179 node = node.return; 10180 } 10181 } 10182 10183 if (node.tag === HostRoot) { 10184 // TODO: Check if this was a nested HostRoot when used with 10185 // renderContainerIntoSubtree. 10186 return nearestMounted; 10187 } // If we didn't hit the root, that means that we're in an disconnected tree 10188 // that has been unmounted. 10189 10190 10191 return null; 10192} 10193function getSuspenseInstanceFromFiber(fiber) { 10194 if (fiber.tag === SuspenseComponent) { 10195 var suspenseState = fiber.memoizedState; 10196 10197 if (suspenseState === null) { 10198 var current = fiber.alternate; 10199 10200 if (current !== null) { 10201 suspenseState = current.memoizedState; 10202 } 10203 } 10204 10205 if (suspenseState !== null) { 10206 return suspenseState.dehydrated; 10207 } 10208 } 10209 10210 return null; 10211} 10212function getContainerFromFiber(fiber) { 10213 return fiber.tag === HostRoot ? fiber.stateNode.containerInfo : null; 10214} 10215function isFiberMounted(fiber) { 10216 return getNearestMountedFiber(fiber) === fiber; 10217} 10218function isMounted(component) { 10219 { 10220 var owner = ReactCurrentOwner.current; 10221 10222 if (owner !== null && owner.tag === ClassComponent) { 10223 var ownerFiber = owner; 10224 var instance = ownerFiber.stateNode; 10225 10226 if (!instance._warnedAboutRefsInRender) { 10227 error('%s is accessing isMounted inside its render() function. ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentNameFromFiber(ownerFiber) || 'A component'); 10228 } 10229 10230 instance._warnedAboutRefsInRender = true; 10231 } 10232 } 10233 10234 var fiber = get(component); 10235 10236 if (!fiber) { 10237 return false; 10238 } 10239 10240 return getNearestMountedFiber(fiber) === fiber; 10241} 10242 10243function assertIsMounted(fiber) { 10244 if (getNearestMountedFiber(fiber) !== fiber) { 10245 throw new Error('Unable to find node on an unmounted component.'); 10246 } 10247} 10248 10249function findCurrentFiberUsingSlowPath(fiber) { 10250 var alternate = fiber.alternate; 10251 10252 if (!alternate) { 10253 // If there is no alternate, then we only need to check if it is mounted. 10254 var nearestMounted = getNearestMountedFiber(fiber); 10255 10256 if (nearestMounted === null) { 10257 throw new Error('Unable to find node on an unmounted component.'); 10258 } 10259 10260 if (nearestMounted !== fiber) { 10261 return null; 10262 } 10263 10264 return fiber; 10265 } // If we have two possible branches, we'll walk backwards up to the root 10266 // to see what path the root points to. On the way we may hit one of the 10267 // special cases and we'll deal with them. 10268 10269 10270 var a = fiber; 10271 var b = alternate; 10272 10273 while (true) { 10274 var parentA = a.return; 10275 10276 if (parentA === null) { 10277 // We're at the root. 10278 break; 10279 } 10280 10281 var parentB = parentA.alternate; 10282 10283 if (parentB === null) { 10284 // There is no alternate. This is an unusual case. Currently, it only 10285 // happens when a Suspense component is hidden. An extra fragment fiber 10286 // is inserted in between the Suspense fiber and its children. Skip 10287 // over this extra fragment fiber and proceed to the next parent. 10288 var nextParent = parentA.return; 10289 10290 if (nextParent !== null) { 10291 a = b = nextParent; 10292 continue; 10293 } // If there's no parent, we're at the root. 10294 10295 10296 break; 10297 } // If both copies of the parent fiber point to the same child, we can 10298 // assume that the child is current. This happens when we bailout on low 10299 // priority: the bailed out fiber's child reuses the current child. 10300 10301 10302 if (parentA.child === parentB.child) { 10303 var child = parentA.child; 10304 10305 while (child) { 10306 if (child === a) { 10307 // We've determined that A is the current branch. 10308 assertIsMounted(parentA); 10309 return fiber; 10310 } 10311 10312 if (child === b) { 10313 // We've determined that B is the current branch. 10314 assertIsMounted(parentA); 10315 return alternate; 10316 } 10317 10318 child = child.sibling; 10319 } // We should never have an alternate for any mounting node. So the only 10320 // way this could possibly happen is if this was unmounted, if at all. 10321 10322 10323 throw new Error('Unable to find node on an unmounted component.'); 10324 } 10325 10326 if (a.return !== b.return) { 10327 // The return pointer of A and the return pointer of B point to different 10328 // fibers. We assume that return pointers never criss-cross, so A must 10329 // belong to the child set of A.return, and B must belong to the child 10330 // set of B.return. 10331 a = parentA; 10332 b = parentB; 10333 } else { 10334 // The return pointers point to the same fiber. We'll have to use the 10335 // default, slow path: scan the child sets of each parent alternate to see 10336 // which child belongs to which set. 10337 // 10338 // Search parent A's child set 10339 var didFindChild = false; 10340 var _child = parentA.child; 10341 10342 while (_child) { 10343 if (_child === a) { 10344 didFindChild = true; 10345 a = parentA; 10346 b = parentB; 10347 break; 10348 } 10349 10350 if (_child === b) { 10351 didFindChild = true; 10352 b = parentA; 10353 a = parentB; 10354 break; 10355 } 10356 10357 _child = _child.sibling; 10358 } 10359 10360 if (!didFindChild) { 10361 // Search parent B's child set 10362 _child = parentB.child; 10363 10364 while (_child) { 10365 if (_child === a) { 10366 didFindChild = true; 10367 a = parentB; 10368 b = parentA; 10369 break; 10370 } 10371 10372 if (_child === b) { 10373 didFindChild = true; 10374 b = parentB; 10375 a = parentA; 10376 break; 10377 } 10378 10379 _child = _child.sibling; 10380 } 10381 10382 if (!didFindChild) { 10383 throw new Error('Child was not found in either parent set. This indicates a bug ' + 'in React related to the return pointer. Please file an issue.'); 10384 } 10385 } 10386 } 10387 10388 if (a.alternate !== b) { 10389 throw new Error("Return fibers should always be each others' alternates. " + 'This error is likely caused by a bug in React. Please file an issue.'); 10390 } 10391 } // If the root is not a host container, we're in a disconnected tree. I.e. 10392 // unmounted. 10393 10394 10395 if (a.tag !== HostRoot) { 10396 throw new Error('Unable to find node on an unmounted component.'); 10397 } 10398 10399 if (a.stateNode.current === a) { 10400 // We've determined that A is the current branch. 10401 return fiber; 10402 } // Otherwise B has to be current branch. 10403 10404 10405 return alternate; 10406} 10407function findCurrentHostFiber(parent) { 10408 var currentParent = findCurrentFiberUsingSlowPath(parent); 10409 return currentParent !== null ? findCurrentHostFiberImpl(currentParent) : null; 10410} 10411 10412function findCurrentHostFiberImpl(node) { 10413 // Next we'll drill down this component to find the first HostComponent/Text. 10414 if (node.tag === HostComponent || node.tag === HostText) { 10415 return node; 10416 } 10417 10418 var child = node.child; 10419 10420 while (child !== null) { 10421 var match = findCurrentHostFiberImpl(child); 10422 10423 if (match !== null) { 10424 return match; 10425 } 10426 10427 child = child.sibling; 10428 } 10429 10430 return null; 10431} 10432 10433function findCurrentHostFiberWithNoPortals(parent) { 10434 var currentParent = findCurrentFiberUsingSlowPath(parent); 10435 return currentParent !== null ? findCurrentHostFiberWithNoPortalsImpl(currentParent) : null; 10436} 10437 10438function findCurrentHostFiberWithNoPortalsImpl(node) { 10439 // Next we'll drill down this component to find the first HostComponent/Text. 10440 if (node.tag === HostComponent || node.tag === HostText) { 10441 return node; 10442 } 10443 10444 var child = node.child; 10445 10446 while (child !== null) { 10447 if (child.tag !== HostPortal) { 10448 var match = findCurrentHostFiberWithNoPortalsImpl(child); 10449 10450 if (match !== null) { 10451 return match; 10452 } 10453 } 10454 10455 child = child.sibling; 10456 } 10457 10458 return null; 10459} 10460 10461// This module only exists as an ESM wrapper around the external CommonJS 10462var scheduleCallback = Scheduler.unstable_scheduleCallback; 10463var cancelCallback = Scheduler.unstable_cancelCallback; 10464var shouldYield = Scheduler.unstable_shouldYield; 10465var requestPaint = Scheduler.unstable_requestPaint; 10466var now = Scheduler.unstable_now; 10467var getCurrentPriorityLevel = Scheduler.unstable_getCurrentPriorityLevel; 10468var ImmediatePriority = Scheduler.unstable_ImmediatePriority; 10469var UserBlockingPriority = Scheduler.unstable_UserBlockingPriority; 10470var NormalPriority = Scheduler.unstable_NormalPriority; 10471var LowPriority = Scheduler.unstable_LowPriority; 10472var IdlePriority = Scheduler.unstable_IdlePriority; 10473// this doesn't actually exist on the scheduler, but it *does* 10474// on scheduler/unstable_mock, which we'll need for internal testing 10475var unstable_yieldValue = Scheduler.unstable_yieldValue; 10476var unstable_setDisableYieldValue = Scheduler.unstable_setDisableYieldValue; 10477 10478var rendererID = null; 10479var injectedHook = null; 10480var injectedProfilingHooks = null; 10481var hasLoggedError = false; 10482var isDevToolsPresent = typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined'; 10483function injectInternals(internals) { 10484 if (typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined') { 10485 // No DevTools 10486 return false; 10487 } 10488 10489 var hook = __REACT_DEVTOOLS_GLOBAL_HOOK__; 10490 10491 if (hook.isDisabled) { 10492 // This isn't a real property on the hook, but it can be set to opt out 10493 // of DevTools integration and associated warnings and logs. 10494 // https://github.com/facebook/react/issues/3877 10495 return true; 10496 } 10497 10498 if (!hook.supportsFiber) { 10499 { 10500 error('The installed version of React DevTools is too old and will not work ' + 'with the current version of React. Please update React DevTools. ' + 'https://reactjs.org/link/react-devtools'); 10501 } // DevTools exists, even though it doesn't support Fiber. 10502 10503 10504 return true; 10505 } 10506 10507 try { 10508 if (enableSchedulingProfiler) { 10509 // Conditionally inject these hooks only if Timeline profiler is supported by this build. 10510 // This gives DevTools a way to feature detect that isn't tied to version number 10511 // (since profiling and timeline are controlled by different feature flags). 10512 internals = assign({}, internals, { 10513 getLaneLabelMap: getLaneLabelMap, 10514 injectProfilingHooks: injectProfilingHooks 10515 }); 10516 } 10517 10518 rendererID = hook.inject(internals); // We have successfully injected, so now it is safe to set up hooks. 10519 10520 injectedHook = hook; 10521 } catch (err) { 10522 // Catch all errors because it is unsafe to throw during initialization. 10523 { 10524 error('React instrumentation encountered an error: %s.', err); 10525 } 10526 } 10527 10528 if (hook.checkDCE) { 10529 // This is the real DevTools. 10530 return true; 10531 } else { 10532 // This is likely a hook installed by Fast Refresh runtime. 10533 return false; 10534 } 10535} 10536function onScheduleRoot(root, children) { 10537 { 10538 if (injectedHook && typeof injectedHook.onScheduleFiberRoot === 'function') { 10539 try { 10540 injectedHook.onScheduleFiberRoot(rendererID, root, children); 10541 } catch (err) { 10542 if ( !hasLoggedError) { 10543 hasLoggedError = true; 10544 10545 error('React instrumentation encountered an error: %s', err); 10546 } 10547 } 10548 } 10549 } 10550} 10551function onCommitRoot(root, eventPriority) { 10552 if (injectedHook && typeof injectedHook.onCommitFiberRoot === 'function') { 10553 try { 10554 var didError = (root.current.flags & DidCapture) === DidCapture; 10555 10556 if (enableProfilerTimer) { 10557 var schedulerPriority; 10558 10559 switch (eventPriority) { 10560 case DiscreteEventPriority: 10561 schedulerPriority = ImmediatePriority; 10562 break; 10563 10564 case ContinuousEventPriority: 10565 schedulerPriority = UserBlockingPriority; 10566 break; 10567 10568 case DefaultEventPriority: 10569 schedulerPriority = NormalPriority; 10570 break; 10571 10572 case IdleEventPriority: 10573 schedulerPriority = IdlePriority; 10574 break; 10575 10576 default: 10577 schedulerPriority = NormalPriority; 10578 break; 10579 } 10580 10581 injectedHook.onCommitFiberRoot(rendererID, root, schedulerPriority, didError); 10582 } else { 10583 injectedHook.onCommitFiberRoot(rendererID, root, undefined, didError); 10584 } 10585 } catch (err) { 10586 { 10587 if (!hasLoggedError) { 10588 hasLoggedError = true; 10589 10590 error('React instrumentation encountered an error: %s', err); 10591 } 10592 } 10593 } 10594 } 10595} 10596function onPostCommitRoot(root) { 10597 if (injectedHook && typeof injectedHook.onPostCommitFiberRoot === 'function') { 10598 try { 10599 injectedHook.onPostCommitFiberRoot(rendererID, root); 10600 } catch (err) { 10601 { 10602 if (!hasLoggedError) { 10603 hasLoggedError = true; 10604 10605 error('React instrumentation encountered an error: %s', err); 10606 } 10607 } 10608 } 10609 } 10610} 10611function onCommitUnmount(fiber) { 10612 if (injectedHook && typeof injectedHook.onCommitFiberUnmount === 'function') { 10613 try { 10614 injectedHook.onCommitFiberUnmount(rendererID, fiber); 10615 } catch (err) { 10616 { 10617 if (!hasLoggedError) { 10618 hasLoggedError = true; 10619 10620 error('React instrumentation encountered an error: %s', err); 10621 } 10622 } 10623 } 10624 } 10625} 10626function setIsStrictModeForDevtools(newIsStrictMode) { 10627 { 10628 if (typeof unstable_yieldValue === 'function') { 10629 // We're in a test because Scheduler.unstable_yieldValue only exists 10630 // in SchedulerMock. To reduce the noise in strict mode tests, 10631 // suppress warnings and disable scheduler yielding during the double render 10632 unstable_setDisableYieldValue(newIsStrictMode); 10633 setSuppressWarning(newIsStrictMode); 10634 } 10635 10636 if (injectedHook && typeof injectedHook.setStrictMode === 'function') { 10637 try { 10638 injectedHook.setStrictMode(rendererID, newIsStrictMode); 10639 } catch (err) { 10640 { 10641 if (!hasLoggedError) { 10642 hasLoggedError = true; 10643 10644 error('React instrumentation encountered an error: %s', err); 10645 } 10646 } 10647 } 10648 } 10649 } 10650} // Profiler API hooks 10651 10652function injectProfilingHooks(profilingHooks) { 10653 injectedProfilingHooks = profilingHooks; 10654} 10655 10656function getLaneLabelMap() { 10657 { 10658 var map = new Map(); 10659 var lane = 1; 10660 10661 for (var index = 0; index < TotalLanes; index++) { 10662 var label = getLabelForLane(lane); 10663 map.set(lane, label); 10664 lane *= 2; 10665 } 10666 10667 return map; 10668 } 10669} 10670 10671function markCommitStarted(lanes) { 10672 { 10673 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markCommitStarted === 'function') { 10674 injectedProfilingHooks.markCommitStarted(lanes); 10675 } 10676 } 10677} 10678function markCommitStopped() { 10679 { 10680 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markCommitStopped === 'function') { 10681 injectedProfilingHooks.markCommitStopped(); 10682 } 10683 } 10684} 10685function markComponentRenderStarted(fiber) { 10686 { 10687 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentRenderStarted === 'function') { 10688 injectedProfilingHooks.markComponentRenderStarted(fiber); 10689 } 10690 } 10691} 10692function markComponentRenderStopped() { 10693 { 10694 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentRenderStopped === 'function') { 10695 injectedProfilingHooks.markComponentRenderStopped(); 10696 } 10697 } 10698} 10699function markComponentPassiveEffectMountStarted(fiber) { 10700 { 10701 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectMountStarted === 'function') { 10702 injectedProfilingHooks.markComponentPassiveEffectMountStarted(fiber); 10703 } 10704 } 10705} 10706function markComponentPassiveEffectMountStopped() { 10707 { 10708 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectMountStopped === 'function') { 10709 injectedProfilingHooks.markComponentPassiveEffectMountStopped(); 10710 } 10711 } 10712} 10713function markComponentPassiveEffectUnmountStarted(fiber) { 10714 { 10715 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectUnmountStarted === 'function') { 10716 injectedProfilingHooks.markComponentPassiveEffectUnmountStarted(fiber); 10717 } 10718 } 10719} 10720function markComponentPassiveEffectUnmountStopped() { 10721 { 10722 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentPassiveEffectUnmountStopped === 'function') { 10723 injectedProfilingHooks.markComponentPassiveEffectUnmountStopped(); 10724 } 10725 } 10726} 10727function markComponentLayoutEffectMountStarted(fiber) { 10728 { 10729 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectMountStarted === 'function') { 10730 injectedProfilingHooks.markComponentLayoutEffectMountStarted(fiber); 10731 } 10732 } 10733} 10734function markComponentLayoutEffectMountStopped() { 10735 { 10736 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectMountStopped === 'function') { 10737 injectedProfilingHooks.markComponentLayoutEffectMountStopped(); 10738 } 10739 } 10740} 10741function markComponentLayoutEffectUnmountStarted(fiber) { 10742 { 10743 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectUnmountStarted === 'function') { 10744 injectedProfilingHooks.markComponentLayoutEffectUnmountStarted(fiber); 10745 } 10746 } 10747} 10748function markComponentLayoutEffectUnmountStopped() { 10749 { 10750 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentLayoutEffectUnmountStopped === 'function') { 10751 injectedProfilingHooks.markComponentLayoutEffectUnmountStopped(); 10752 } 10753 } 10754} 10755function markComponentErrored(fiber, thrownValue, lanes) { 10756 { 10757 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentErrored === 'function') { 10758 injectedProfilingHooks.markComponentErrored(fiber, thrownValue, lanes); 10759 } 10760 } 10761} 10762function markComponentSuspended(fiber, wakeable, lanes) { 10763 { 10764 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markComponentSuspended === 'function') { 10765 injectedProfilingHooks.markComponentSuspended(fiber, wakeable, lanes); 10766 } 10767 } 10768} 10769function markLayoutEffectsStarted(lanes) { 10770 { 10771 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markLayoutEffectsStarted === 'function') { 10772 injectedProfilingHooks.markLayoutEffectsStarted(lanes); 10773 } 10774 } 10775} 10776function markLayoutEffectsStopped() { 10777 { 10778 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markLayoutEffectsStopped === 'function') { 10779 injectedProfilingHooks.markLayoutEffectsStopped(); 10780 } 10781 } 10782} 10783function markPassiveEffectsStarted(lanes) { 10784 { 10785 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markPassiveEffectsStarted === 'function') { 10786 injectedProfilingHooks.markPassiveEffectsStarted(lanes); 10787 } 10788 } 10789} 10790function markPassiveEffectsStopped() { 10791 { 10792 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markPassiveEffectsStopped === 'function') { 10793 injectedProfilingHooks.markPassiveEffectsStopped(); 10794 } 10795 } 10796} 10797function markRenderStarted(lanes) { 10798 { 10799 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderStarted === 'function') { 10800 injectedProfilingHooks.markRenderStarted(lanes); 10801 } 10802 } 10803} 10804function markRenderYielded() { 10805 { 10806 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderYielded === 'function') { 10807 injectedProfilingHooks.markRenderYielded(); 10808 } 10809 } 10810} 10811function markRenderStopped() { 10812 { 10813 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderStopped === 'function') { 10814 injectedProfilingHooks.markRenderStopped(); 10815 } 10816 } 10817} 10818function markRenderScheduled(lane) { 10819 { 10820 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markRenderScheduled === 'function') { 10821 injectedProfilingHooks.markRenderScheduled(lane); 10822 } 10823 } 10824} 10825function markForceUpdateScheduled(fiber, lane) { 10826 { 10827 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markForceUpdateScheduled === 'function') { 10828 injectedProfilingHooks.markForceUpdateScheduled(fiber, lane); 10829 } 10830 } 10831} 10832function markStateUpdateScheduled(fiber, lane) { 10833 { 10834 if (injectedProfilingHooks !== null && typeof injectedProfilingHooks.markStateUpdateScheduled === 'function') { 10835 injectedProfilingHooks.markStateUpdateScheduled(fiber, lane); 10836 } 10837 } 10838} 10839 10840var NoMode = 10841/* */ 108420; // TODO: Remove ConcurrentMode by reading from the root tag instead 10843 10844var ConcurrentMode = 10845/* */ 108461; 10847var ProfileMode = 10848/* */ 108492; 10850var StrictLegacyMode = 10851/* */ 108528; 10853var StrictEffectsMode = 10854/* */ 1085516; 10856 10857// TODO: This is pretty well supported by browsers. Maybe we can drop it. 10858var clz32 = Math.clz32 ? Math.clz32 : clz32Fallback; // Count leading zeros. 10859// Based on: 10860// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/clz32 10861 10862var log = Math.log; 10863var LN2 = Math.LN2; 10864 10865function clz32Fallback(x) { 10866 var asUint = x >>> 0; 10867 10868 if (asUint === 0) { 10869 return 32; 10870 } 10871 10872 return 31 - (log(asUint) / LN2 | 0) | 0; 10873} 10874 10875// If those values are changed that package should be rebuilt and redeployed. 10876 10877var TotalLanes = 31; 10878var NoLanes = 10879/* */ 108800; 10881var NoLane = 10882/* */ 108830; 10884var SyncLane = 10885/* */ 108861; 10887var InputContinuousHydrationLane = 10888/* */ 108892; 10890var InputContinuousLane = 10891/* */ 108924; 10893var DefaultHydrationLane = 10894/* */ 108958; 10896var DefaultLane = 10897/* */ 1089816; 10899var TransitionHydrationLane = 10900/* */ 1090132; 10902var TransitionLanes = 10903/* */ 109044194240; 10905var TransitionLane1 = 10906/* */ 1090764; 10908var TransitionLane2 = 10909/* */ 10910128; 10911var TransitionLane3 = 10912/* */ 10913256; 10914var TransitionLane4 = 10915/* */ 10916512; 10917var TransitionLane5 = 10918/* */ 109191024; 10920var TransitionLane6 = 10921/* */ 109222048; 10923var TransitionLane7 = 10924/* */ 109254096; 10926var TransitionLane8 = 10927/* */ 109288192; 10929var TransitionLane9 = 10930/* */ 1093116384; 10932var TransitionLane10 = 10933/* */ 1093432768; 10935var TransitionLane11 = 10936/* */ 1093765536; 10938var TransitionLane12 = 10939/* */ 10940131072; 10941var TransitionLane13 = 10942/* */ 10943262144; 10944var TransitionLane14 = 10945/* */ 10946524288; 10947var TransitionLane15 = 10948/* */ 109491048576; 10950var TransitionLane16 = 10951/* */ 109522097152; 10953var RetryLanes = 10954/* */ 10955130023424; 10956var RetryLane1 = 10957/* */ 109584194304; 10959var RetryLane2 = 10960/* */ 109618388608; 10962var RetryLane3 = 10963/* */ 1096416777216; 10965var RetryLane4 = 10966/* */ 1096733554432; 10968var RetryLane5 = 10969/* */ 1097067108864; 10971var SomeRetryLane = RetryLane1; 10972var SelectiveHydrationLane = 10973/* */ 10974134217728; 10975var NonIdleLanes = 10976/* */ 10977268435455; 10978var IdleHydrationLane = 10979/* */ 10980268435456; 10981var IdleLane = 10982/* */ 10983536870912; 10984var OffscreenLane = 10985/* */ 109861073741824; // This function is used for the experimental timeline (react-devtools-timeline) 10987// It should be kept in sync with the Lanes values above. 10988 10989function getLabelForLane(lane) { 10990 { 10991 if (lane & SyncLane) { 10992 return 'Sync'; 10993 } 10994 10995 if (lane & InputContinuousHydrationLane) { 10996 return 'InputContinuousHydration'; 10997 } 10998 10999 if (lane & InputContinuousLane) { 11000 return 'InputContinuous'; 11001 } 11002 11003 if (lane & DefaultHydrationLane) { 11004 return 'DefaultHydration'; 11005 } 11006 11007 if (lane & DefaultLane) { 11008 return 'Default'; 11009 } 11010 11011 if (lane & TransitionHydrationLane) { 11012 return 'TransitionHydration'; 11013 } 11014 11015 if (lane & TransitionLanes) { 11016 return 'Transition'; 11017 } 11018 11019 if (lane & RetryLanes) { 11020 return 'Retry'; 11021 } 11022 11023 if (lane & SelectiveHydrationLane) { 11024 return 'SelectiveHydration'; 11025 } 11026 11027 if (lane & IdleHydrationLane) { 11028 return 'IdleHydration'; 11029 } 11030 11031 if (lane & IdleLane) { 11032 return 'Idle'; 11033 } 11034 11035 if (lane & OffscreenLane) { 11036 return 'Offscreen'; 11037 } 11038 } 11039} 11040var NoTimestamp = -1; 11041var nextTransitionLane = TransitionLane1; 11042var nextRetryLane = RetryLane1; 11043 11044function getHighestPriorityLanes(lanes) { 11045 switch (getHighestPriorityLane(lanes)) { 11046 case SyncLane: 11047 return SyncLane; 11048 11049 case InputContinuousHydrationLane: 11050 return InputContinuousHydrationLane; 11051 11052 case InputContinuousLane: 11053 return InputContinuousLane; 11054 11055 case DefaultHydrationLane: 11056 return DefaultHydrationLane; 11057 11058 case DefaultLane: 11059 return DefaultLane; 11060 11061 case TransitionHydrationLane: 11062 return TransitionHydrationLane; 11063 11064 case TransitionLane1: 11065 case TransitionLane2: 11066 case TransitionLane3: 11067 case TransitionLane4: 11068 case TransitionLane5: 11069 case TransitionLane6: 11070 case TransitionLane7: 11071 case TransitionLane8: 11072 case TransitionLane9: 11073 case TransitionLane10: 11074 case TransitionLane11: 11075 case TransitionLane12: 11076 case TransitionLane13: 11077 case TransitionLane14: 11078 case TransitionLane15: 11079 case TransitionLane16: 11080 return lanes & TransitionLanes; 11081 11082 case RetryLane1: 11083 case RetryLane2: 11084 case RetryLane3: 11085 case RetryLane4: 11086 case RetryLane5: 11087 return lanes & RetryLanes; 11088 11089 case SelectiveHydrationLane: 11090 return SelectiveHydrationLane; 11091 11092 case IdleHydrationLane: 11093 return IdleHydrationLane; 11094 11095 case IdleLane: 11096 return IdleLane; 11097 11098 case OffscreenLane: 11099 return OffscreenLane; 11100 11101 default: 11102 { 11103 error('Should have found matching lanes. This is a bug in React.'); 11104 } // This shouldn't be reachable, but as a fallback, return the entire bitmask. 11105 11106 11107 return lanes; 11108 } 11109} 11110 11111function getNextLanes(root, wipLanes) { 11112 // Early bailout if there's no pending work left. 11113 var pendingLanes = root.pendingLanes; 11114 11115 if (pendingLanes === NoLanes) { 11116 return NoLanes; 11117 } 11118 11119 var nextLanes = NoLanes; 11120 var suspendedLanes = root.suspendedLanes; 11121 var pingedLanes = root.pingedLanes; // Do not work on any idle work until all the non-idle work has finished, 11122 // even if the work is suspended. 11123 11124 var nonIdlePendingLanes = pendingLanes & NonIdleLanes; 11125 11126 if (nonIdlePendingLanes !== NoLanes) { 11127 var nonIdleUnblockedLanes = nonIdlePendingLanes & ~suspendedLanes; 11128 11129 if (nonIdleUnblockedLanes !== NoLanes) { 11130 nextLanes = getHighestPriorityLanes(nonIdleUnblockedLanes); 11131 } else { 11132 var nonIdlePingedLanes = nonIdlePendingLanes & pingedLanes; 11133 11134 if (nonIdlePingedLanes !== NoLanes) { 11135 nextLanes = getHighestPriorityLanes(nonIdlePingedLanes); 11136 } 11137 } 11138 } else { 11139 // The only remaining work is Idle. 11140 var unblockedLanes = pendingLanes & ~suspendedLanes; 11141 11142 if (unblockedLanes !== NoLanes) { 11143 nextLanes = getHighestPriorityLanes(unblockedLanes); 11144 } else { 11145 if (pingedLanes !== NoLanes) { 11146 nextLanes = getHighestPriorityLanes(pingedLanes); 11147 } 11148 } 11149 } 11150 11151 if (nextLanes === NoLanes) { 11152 // This should only be reachable if we're suspended 11153 // TODO: Consider warning in this path if a fallback timer is not scheduled. 11154 return NoLanes; 11155 } // If we're already in the middle of a render, switching lanes will interrupt 11156 // it and we'll lose our progress. We should only do this if the new lanes are 11157 // higher priority. 11158 11159 11160 if (wipLanes !== NoLanes && wipLanes !== nextLanes && // If we already suspended with a delay, then interrupting is fine. Don't 11161 // bother waiting until the root is complete. 11162 (wipLanes & suspendedLanes) === NoLanes) { 11163 var nextLane = getHighestPriorityLane(nextLanes); 11164 var wipLane = getHighestPriorityLane(wipLanes); 11165 11166 if ( // Tests whether the next lane is equal or lower priority than the wip 11167 // one. This works because the bits decrease in priority as you go left. 11168 nextLane >= wipLane || // Default priority updates should not interrupt transition updates. The 11169 // only difference between default updates and transition updates is that 11170 // default updates do not support refresh transitions. 11171 nextLane === DefaultLane && (wipLane & TransitionLanes) !== NoLanes) { 11172 // Keep working on the existing in-progress tree. Do not interrupt. 11173 return wipLanes; 11174 } 11175 } 11176 11177 if ((nextLanes & InputContinuousLane) !== NoLanes) { 11178 // When updates are sync by default, we entangle continuous priority updates 11179 // and default updates, so they render in the same batch. The only reason 11180 // they use separate lanes is because continuous updates should interrupt 11181 // transitions, but default updates should not. 11182 nextLanes |= pendingLanes & DefaultLane; 11183 } // Check for entangled lanes and add them to the batch. 11184 // 11185 // A lane is said to be entangled with another when it's not allowed to render 11186 // in a batch that does not also include the other lane. Typically we do this 11187 // when multiple updates have the same source, and we only want to respond to 11188 // the most recent event from that source. 11189 // 11190 // Note that we apply entanglements *after* checking for partial work above. 11191 // This means that if a lane is entangled during an interleaved event while 11192 // it's already rendering, we won't interrupt it. This is intentional, since 11193 // entanglement is usually "best effort": we'll try our best to render the 11194 // lanes in the same batch, but it's not worth throwing out partially 11195 // completed work in order to do it. 11196 // TODO: Reconsider this. The counter-argument is that the partial work 11197 // represents an intermediate state, which we don't want to show to the user. 11198 // And by spending extra time finishing it, we're increasing the amount of 11199 // time it takes to show the final state, which is what they are actually 11200 // waiting for. 11201 // 11202 // For those exceptions where entanglement is semantically important, like 11203 // useMutableSource, we should ensure that there is no partial work at the 11204 // time we apply the entanglement. 11205 11206 11207 var entangledLanes = root.entangledLanes; 11208 11209 if (entangledLanes !== NoLanes) { 11210 var entanglements = root.entanglements; 11211 var lanes = nextLanes & entangledLanes; 11212 11213 while (lanes > 0) { 11214 var index = pickArbitraryLaneIndex(lanes); 11215 var lane = 1 << index; 11216 nextLanes |= entanglements[index]; 11217 lanes &= ~lane; 11218 } 11219 } 11220 11221 return nextLanes; 11222} 11223function getMostRecentEventTime(root, lanes) { 11224 var eventTimes = root.eventTimes; 11225 var mostRecentEventTime = NoTimestamp; 11226 11227 while (lanes > 0) { 11228 var index = pickArbitraryLaneIndex(lanes); 11229 var lane = 1 << index; 11230 var eventTime = eventTimes[index]; 11231 11232 if (eventTime > mostRecentEventTime) { 11233 mostRecentEventTime = eventTime; 11234 } 11235 11236 lanes &= ~lane; 11237 } 11238 11239 return mostRecentEventTime; 11240} 11241 11242function computeExpirationTime(lane, currentTime) { 11243 switch (lane) { 11244 case SyncLane: 11245 case InputContinuousHydrationLane: 11246 case InputContinuousLane: 11247 // User interactions should expire slightly more quickly. 11248 // 11249 // NOTE: This is set to the corresponding constant as in Scheduler.js. 11250 // When we made it larger, a product metric in www regressed, suggesting 11251 // there's a user interaction that's being starved by a series of 11252 // synchronous updates. If that theory is correct, the proper solution is 11253 // to fix the starvation. However, this scenario supports the idea that 11254 // expiration times are an important safeguard when starvation 11255 // does happen. 11256 return currentTime + 250; 11257 11258 case DefaultHydrationLane: 11259 case DefaultLane: 11260 case TransitionHydrationLane: 11261 case TransitionLane1: 11262 case TransitionLane2: 11263 case TransitionLane3: 11264 case TransitionLane4: 11265 case TransitionLane5: 11266 case TransitionLane6: 11267 case TransitionLane7: 11268 case TransitionLane8: 11269 case TransitionLane9: 11270 case TransitionLane10: 11271 case TransitionLane11: 11272 case TransitionLane12: 11273 case TransitionLane13: 11274 case TransitionLane14: 11275 case TransitionLane15: 11276 case TransitionLane16: 11277 return currentTime + 5000; 11278 11279 case RetryLane1: 11280 case RetryLane2: 11281 case RetryLane3: 11282 case RetryLane4: 11283 case RetryLane5: 11284 // TODO: Retries should be allowed to expire if they are CPU bound for 11285 // too long, but when I made this change it caused a spike in browser 11286 // crashes. There must be some other underlying bug; not super urgent but 11287 // ideally should figure out why and fix it. Unfortunately we don't have 11288 // a repro for the crashes, only detected via production metrics. 11289 return NoTimestamp; 11290 11291 case SelectiveHydrationLane: 11292 case IdleHydrationLane: 11293 case IdleLane: 11294 case OffscreenLane: 11295 // Anything idle priority or lower should never expire. 11296 return NoTimestamp; 11297 11298 default: 11299 { 11300 error('Should have found matching lanes. This is a bug in React.'); 11301 } 11302 11303 return NoTimestamp; 11304 } 11305} 11306 11307function markStarvedLanesAsExpired(root, currentTime) { 11308 // TODO: This gets called every time we yield. We can optimize by storing 11309 // the earliest expiration time on the root. Then use that to quickly bail out 11310 // of this function. 11311 var pendingLanes = root.pendingLanes; 11312 var suspendedLanes = root.suspendedLanes; 11313 var pingedLanes = root.pingedLanes; 11314 var expirationTimes = root.expirationTimes; // Iterate through the pending lanes and check if we've reached their 11315 // expiration time. If so, we'll assume the update is being starved and mark 11316 // it as expired to force it to finish. 11317 11318 var lanes = pendingLanes; 11319 11320 while (lanes > 0) { 11321 var index = pickArbitraryLaneIndex(lanes); 11322 var lane = 1 << index; 11323 var expirationTime = expirationTimes[index]; 11324 11325 if (expirationTime === NoTimestamp) { 11326 // Found a pending lane with no expiration time. If it's not suspended, or 11327 // if it's pinged, assume it's CPU-bound. Compute a new expiration time 11328 // using the current time. 11329 if ((lane & suspendedLanes) === NoLanes || (lane & pingedLanes) !== NoLanes) { 11330 // Assumes timestamps are monotonically increasing. 11331 expirationTimes[index] = computeExpirationTime(lane, currentTime); 11332 } 11333 } else if (expirationTime <= currentTime) { 11334 // This lane expired 11335 root.expiredLanes |= lane; 11336 } 11337 11338 lanes &= ~lane; 11339 } 11340} // This returns the highest priority pending lanes regardless of whether they 11341// are suspended. 11342 11343function getHighestPriorityPendingLanes(root) { 11344 return getHighestPriorityLanes(root.pendingLanes); 11345} 11346function getLanesToRetrySynchronouslyOnError(root) { 11347 var everythingButOffscreen = root.pendingLanes & ~OffscreenLane; 11348 11349 if (everythingButOffscreen !== NoLanes) { 11350 return everythingButOffscreen; 11351 } 11352 11353 if (everythingButOffscreen & OffscreenLane) { 11354 return OffscreenLane; 11355 } 11356 11357 return NoLanes; 11358} 11359function includesSyncLane(lanes) { 11360 return (lanes & SyncLane) !== NoLanes; 11361} 11362function includesNonIdleWork(lanes) { 11363 return (lanes & NonIdleLanes) !== NoLanes; 11364} 11365function includesOnlyRetries(lanes) { 11366 return (lanes & RetryLanes) === lanes; 11367} 11368function includesOnlyNonUrgentLanes(lanes) { 11369 var UrgentLanes = SyncLane | InputContinuousLane | DefaultLane; 11370 return (lanes & UrgentLanes) === NoLanes; 11371} 11372function includesOnlyTransitions(lanes) { 11373 return (lanes & TransitionLanes) === lanes; 11374} 11375function includesBlockingLane(root, lanes) { 11376 11377 var SyncDefaultLanes = InputContinuousHydrationLane | InputContinuousLane | DefaultHydrationLane | DefaultLane; 11378 return (lanes & SyncDefaultLanes) !== NoLanes; 11379} 11380function includesExpiredLane(root, lanes) { 11381 // This is a separate check from includesBlockingLane because a lane can 11382 // expire after a render has already started. 11383 return (lanes & root.expiredLanes) !== NoLanes; 11384} 11385function isTransitionLane(lane) { 11386 return (lane & TransitionLanes) !== NoLanes; 11387} 11388function claimNextTransitionLane() { 11389 // Cycle through the lanes, assigning each new transition to the next lane. 11390 // In most cases, this means every transition gets its own lane, until we 11391 // run out of lanes and cycle back to the beginning. 11392 var lane = nextTransitionLane; 11393 nextTransitionLane <<= 1; 11394 11395 if ((nextTransitionLane & TransitionLanes) === NoLanes) { 11396 nextTransitionLane = TransitionLane1; 11397 } 11398 11399 return lane; 11400} 11401function claimNextRetryLane() { 11402 var lane = nextRetryLane; 11403 nextRetryLane <<= 1; 11404 11405 if ((nextRetryLane & RetryLanes) === NoLanes) { 11406 nextRetryLane = RetryLane1; 11407 } 11408 11409 return lane; 11410} 11411function getHighestPriorityLane(lanes) { 11412 return lanes & -lanes; 11413} 11414function pickArbitraryLane(lanes) { 11415 // This wrapper function gets inlined. Only exists so to communicate that it 11416 // doesn't matter which bit is selected; you can pick any bit without 11417 // affecting the algorithms where its used. Here I'm using 11418 // getHighestPriorityLane because it requires the fewest operations. 11419 return getHighestPriorityLane(lanes); 11420} 11421 11422function pickArbitraryLaneIndex(lanes) { 11423 return 31 - clz32(lanes); 11424} 11425 11426function laneToIndex(lane) { 11427 return pickArbitraryLaneIndex(lane); 11428} 11429 11430function includesSomeLane(a, b) { 11431 return (a & b) !== NoLanes; 11432} 11433function isSubsetOfLanes(set, subset) { 11434 return (set & subset) === subset; 11435} 11436function mergeLanes(a, b) { 11437 return a | b; 11438} 11439function removeLanes(set, subset) { 11440 return set & ~subset; 11441} 11442function intersectLanes(a, b) { 11443 return a & b; 11444} // Seems redundant, but it changes the type from a single lane (used for 11445// updates) to a group of lanes (used for flushing work). 11446 11447function laneToLanes(lane) { 11448 return lane; 11449} 11450function higherPriorityLane(a, b) { 11451 // This works because the bit ranges decrease in priority as you go left. 11452 return a !== NoLane && a < b ? a : b; 11453} 11454function createLaneMap(initial) { 11455 // Intentionally pushing one by one. 11456 // https://v8.dev/blog/elements-kinds#avoid-creating-holes 11457 var laneMap = []; 11458 11459 for (var i = 0; i < TotalLanes; i++) { 11460 laneMap.push(initial); 11461 } 11462 11463 return laneMap; 11464} 11465function markRootUpdated(root, updateLane, eventTime) { 11466 root.pendingLanes |= updateLane; // If there are any suspended transitions, it's possible this new update 11467 // could unblock them. Clear the suspended lanes so that we can try rendering 11468 // them again. 11469 // 11470 // TODO: We really only need to unsuspend only lanes that are in the 11471 // `subtreeLanes` of the updated fiber, or the update lanes of the return 11472 // path. This would exclude suspended updates in an unrelated sibling tree, 11473 // since there's no way for this update to unblock it. 11474 // 11475 // We don't do this if the incoming update is idle, because we never process 11476 // idle updates until after all the regular updates have finished; there's no 11477 // way it could unblock a transition. 11478 11479 if (updateLane !== IdleLane) { 11480 root.suspendedLanes = NoLanes; 11481 root.pingedLanes = NoLanes; 11482 } 11483 11484 var eventTimes = root.eventTimes; 11485 var index = laneToIndex(updateLane); // We can always overwrite an existing timestamp because we prefer the most 11486 // recent event, and we assume time is monotonically increasing. 11487 11488 eventTimes[index] = eventTime; 11489} 11490function markRootSuspended(root, suspendedLanes) { 11491 root.suspendedLanes |= suspendedLanes; 11492 root.pingedLanes &= ~suspendedLanes; // The suspended lanes are no longer CPU-bound. Clear their expiration times. 11493 11494 var expirationTimes = root.expirationTimes; 11495 var lanes = suspendedLanes; 11496 11497 while (lanes > 0) { 11498 var index = pickArbitraryLaneIndex(lanes); 11499 var lane = 1 << index; 11500 expirationTimes[index] = NoTimestamp; 11501 lanes &= ~lane; 11502 } 11503} 11504function markRootPinged(root, pingedLanes, eventTime) { 11505 root.pingedLanes |= root.suspendedLanes & pingedLanes; 11506} 11507function markRootFinished(root, remainingLanes) { 11508 var noLongerPendingLanes = root.pendingLanes & ~remainingLanes; 11509 root.pendingLanes = remainingLanes; // Let's try everything again 11510 11511 root.suspendedLanes = NoLanes; 11512 root.pingedLanes = NoLanes; 11513 root.expiredLanes &= remainingLanes; 11514 root.mutableReadLanes &= remainingLanes; 11515 root.entangledLanes &= remainingLanes; 11516 var entanglements = root.entanglements; 11517 var eventTimes = root.eventTimes; 11518 var expirationTimes = root.expirationTimes; // Clear the lanes that no longer have pending work 11519 11520 var lanes = noLongerPendingLanes; 11521 11522 while (lanes > 0) { 11523 var index = pickArbitraryLaneIndex(lanes); 11524 var lane = 1 << index; 11525 entanglements[index] = NoLanes; 11526 eventTimes[index] = NoTimestamp; 11527 expirationTimes[index] = NoTimestamp; 11528 lanes &= ~lane; 11529 } 11530} 11531function markRootEntangled(root, entangledLanes) { 11532 // In addition to entangling each of the given lanes with each other, we also 11533 // have to consider _transitive_ entanglements. For each lane that is already 11534 // entangled with *any* of the given lanes, that lane is now transitively 11535 // entangled with *all* the given lanes. 11536 // 11537 // Translated: If C is entangled with A, then entangling A with B also 11538 // entangles C with B. 11539 // 11540 // If this is hard to grasp, it might help to intentionally break this 11541 // function and look at the tests that fail in ReactTransition-test.js. Try 11542 // commenting out one of the conditions below. 11543 var rootEntangledLanes = root.entangledLanes |= entangledLanes; 11544 var entanglements = root.entanglements; 11545 var lanes = rootEntangledLanes; 11546 11547 while (lanes) { 11548 var index = pickArbitraryLaneIndex(lanes); 11549 var lane = 1 << index; 11550 11551 if ( // Is this one of the newly entangled lanes? 11552 lane & entangledLanes | // Is this lane transitively entangled with the newly entangled lanes? 11553 entanglements[index] & entangledLanes) { 11554 entanglements[index] |= entangledLanes; 11555 } 11556 11557 lanes &= ~lane; 11558 } 11559} 11560function getBumpedLaneForHydration(root, renderLanes) { 11561 var renderLane = getHighestPriorityLane(renderLanes); 11562 var lane; 11563 11564 switch (renderLane) { 11565 case InputContinuousLane: 11566 lane = InputContinuousHydrationLane; 11567 break; 11568 11569 case DefaultLane: 11570 lane = DefaultHydrationLane; 11571 break; 11572 11573 case TransitionLane1: 11574 case TransitionLane2: 11575 case TransitionLane3: 11576 case TransitionLane4: 11577 case TransitionLane5: 11578 case TransitionLane6: 11579 case TransitionLane7: 11580 case TransitionLane8: 11581 case TransitionLane9: 11582 case TransitionLane10: 11583 case TransitionLane11: 11584 case TransitionLane12: 11585 case TransitionLane13: 11586 case TransitionLane14: 11587 case TransitionLane15: 11588 case TransitionLane16: 11589 case RetryLane1: 11590 case RetryLane2: 11591 case RetryLane3: 11592 case RetryLane4: 11593 case RetryLane5: 11594 lane = TransitionHydrationLane; 11595 break; 11596 11597 case IdleLane: 11598 lane = IdleHydrationLane; 11599 break; 11600 11601 default: 11602 // Everything else is already either a hydration lane, or shouldn't 11603 // be retried at a hydration lane. 11604 lane = NoLane; 11605 break; 11606 } // Check if the lane we chose is suspended. If so, that indicates that we 11607 // already attempted and failed to hydrate at that level. Also check if we're 11608 // already rendering that lane, which is rare but could happen. 11609 11610 11611 if ((lane & (root.suspendedLanes | renderLanes)) !== NoLane) { 11612 // Give up trying to hydrate and fall back to client render. 11613 return NoLane; 11614 } 11615 11616 return lane; 11617} 11618function addFiberToLanesMap(root, fiber, lanes) { 11619 11620 if (!isDevToolsPresent) { 11621 return; 11622 } 11623 11624 var pendingUpdatersLaneMap = root.pendingUpdatersLaneMap; 11625 11626 while (lanes > 0) { 11627 var index = laneToIndex(lanes); 11628 var lane = 1 << index; 11629 var updaters = pendingUpdatersLaneMap[index]; 11630 updaters.add(fiber); 11631 lanes &= ~lane; 11632 } 11633} 11634function movePendingFibersToMemoized(root, lanes) { 11635 11636 if (!isDevToolsPresent) { 11637 return; 11638 } 11639 11640 var pendingUpdatersLaneMap = root.pendingUpdatersLaneMap; 11641 var memoizedUpdaters = root.memoizedUpdaters; 11642 11643 while (lanes > 0) { 11644 var index = laneToIndex(lanes); 11645 var lane = 1 << index; 11646 var updaters = pendingUpdatersLaneMap[index]; 11647 11648 if (updaters.size > 0) { 11649 updaters.forEach(function (fiber) { 11650 var alternate = fiber.alternate; 11651 11652 if (alternate === null || !memoizedUpdaters.has(alternate)) { 11653 memoizedUpdaters.add(fiber); 11654 } 11655 }); 11656 updaters.clear(); 11657 } 11658 11659 lanes &= ~lane; 11660 } 11661} 11662function getTransitionsForLanes(root, lanes) { 11663 { 11664 return null; 11665 } 11666} 11667 11668var DiscreteEventPriority = SyncLane; 11669var ContinuousEventPriority = InputContinuousLane; 11670var DefaultEventPriority = DefaultLane; 11671var IdleEventPriority = IdleLane; 11672var currentUpdatePriority = NoLane; 11673function getCurrentUpdatePriority() { 11674 return currentUpdatePriority; 11675} 11676function setCurrentUpdatePriority(newPriority) { 11677 currentUpdatePriority = newPriority; 11678} 11679function runWithPriority(priority, fn) { 11680 var previousPriority = currentUpdatePriority; 11681 11682 try { 11683 currentUpdatePriority = priority; 11684 return fn(); 11685 } finally { 11686 currentUpdatePriority = previousPriority; 11687 } 11688} 11689function higherEventPriority(a, b) { 11690 return a !== 0 && a < b ? a : b; 11691} 11692function lowerEventPriority(a, b) { 11693 return a === 0 || a > b ? a : b; 11694} 11695function isHigherEventPriority(a, b) { 11696 return a !== 0 && a < b; 11697} 11698function lanesToEventPriority(lanes) { 11699 var lane = getHighestPriorityLane(lanes); 11700 11701 if (!isHigherEventPriority(DiscreteEventPriority, lane)) { 11702 return DiscreteEventPriority; 11703 } 11704 11705 if (!isHigherEventPriority(ContinuousEventPriority, lane)) { 11706 return ContinuousEventPriority; 11707 } 11708 11709 if (includesNonIdleWork(lane)) { 11710 return DefaultEventPriority; 11711 } 11712 11713 return IdleEventPriority; 11714} 11715 11716// This is imported by the event replaying implementation in React DOM. It's 11717// in a separate file to break a circular dependency between the renderer and 11718// the reconciler. 11719function isRootDehydrated(root) { 11720 var currentState = root.current.memoizedState; 11721 return currentState.isDehydrated; 11722} 11723 11724var _attemptSynchronousHydration; 11725 11726function setAttemptSynchronousHydration(fn) { 11727 _attemptSynchronousHydration = fn; 11728} 11729function attemptSynchronousHydration(fiber) { 11730 _attemptSynchronousHydration(fiber); 11731} 11732var attemptContinuousHydration; 11733function setAttemptContinuousHydration(fn) { 11734 attemptContinuousHydration = fn; 11735} 11736var attemptHydrationAtCurrentPriority; 11737function setAttemptHydrationAtCurrentPriority(fn) { 11738 attemptHydrationAtCurrentPriority = fn; 11739} 11740var getCurrentUpdatePriority$1; 11741function setGetCurrentUpdatePriority(fn) { 11742 getCurrentUpdatePriority$1 = fn; 11743} 11744var attemptHydrationAtPriority; 11745function setAttemptHydrationAtPriority(fn) { 11746 attemptHydrationAtPriority = fn; 11747} // TODO: Upgrade this definition once we're on a newer version of Flow that 11748// has this definition built-in. 11749 11750var hasScheduledReplayAttempt = false; // The queue of discrete events to be replayed. 11751 11752var queuedDiscreteEvents = []; // Indicates if any continuous event targets are non-null for early bailout. 11753// if the last target was dehydrated. 11754 11755var queuedFocus = null; 11756var queuedDrag = null; 11757var queuedMouse = null; // For pointer events there can be one latest event per pointerId. 11758 11759var queuedPointers = new Map(); 11760var queuedPointerCaptures = new Map(); // We could consider replaying selectionchange and touchmoves too. 11761 11762var queuedExplicitHydrationTargets = []; 11763var discreteReplayableEvents = ['mousedown', 'mouseup', 'touchcancel', 'touchend', 'touchstart', 'auxclick', 'dblclick', 'pointercancel', 'pointerdown', 'pointerup', 'dragend', 'dragstart', 'drop', 'compositionend', 'compositionstart', 'keydown', 'keypress', 'keyup', 'input', 'textInput', // Intentionally camelCase 11764'copy', 'cut', 'paste', 'click', 'change', 'contextmenu', 'reset', 'submit']; 11765function isDiscreteEventThatRequiresHydration(eventType) { 11766 return discreteReplayableEvents.indexOf(eventType) > -1; 11767} 11768 11769function createQueuedReplayableEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) { 11770 return { 11771 blockedOn: blockedOn, 11772 domEventName: domEventName, 11773 eventSystemFlags: eventSystemFlags, 11774 nativeEvent: nativeEvent, 11775 targetContainers: [targetContainer] 11776 }; 11777} 11778 11779function clearIfContinuousEvent(domEventName, nativeEvent) { 11780 switch (domEventName) { 11781 case 'focusin': 11782 case 'focusout': 11783 queuedFocus = null; 11784 break; 11785 11786 case 'dragenter': 11787 case 'dragleave': 11788 queuedDrag = null; 11789 break; 11790 11791 case 'mouseover': 11792 case 'mouseout': 11793 queuedMouse = null; 11794 break; 11795 11796 case 'pointerover': 11797 case 'pointerout': 11798 { 11799 var pointerId = nativeEvent.pointerId; 11800 queuedPointers.delete(pointerId); 11801 break; 11802 } 11803 11804 case 'gotpointercapture': 11805 case 'lostpointercapture': 11806 { 11807 var _pointerId = nativeEvent.pointerId; 11808 queuedPointerCaptures.delete(_pointerId); 11809 break; 11810 } 11811 } 11812} 11813 11814function accumulateOrCreateContinuousQueuedReplayableEvent(existingQueuedEvent, blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) { 11815 if (existingQueuedEvent === null || existingQueuedEvent.nativeEvent !== nativeEvent) { 11816 var queuedEvent = createQueuedReplayableEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent); 11817 11818 if (blockedOn !== null) { 11819 var _fiber2 = getInstanceFromNode(blockedOn); 11820 11821 if (_fiber2 !== null) { 11822 // Attempt to increase the priority of this target. 11823 attemptContinuousHydration(_fiber2); 11824 } 11825 } 11826 11827 return queuedEvent; 11828 } // If we have already queued this exact event, then it's because 11829 // the different event systems have different DOM event listeners. 11830 // We can accumulate the flags, and the targetContainers, and 11831 // store a single event to be replayed. 11832 11833 11834 existingQueuedEvent.eventSystemFlags |= eventSystemFlags; 11835 var targetContainers = existingQueuedEvent.targetContainers; 11836 11837 if (targetContainer !== null && targetContainers.indexOf(targetContainer) === -1) { 11838 targetContainers.push(targetContainer); 11839 } 11840 11841 return existingQueuedEvent; 11842} 11843 11844function queueIfContinuousEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent) { 11845 // These set relatedTarget to null because the replayed event will be treated as if we 11846 // moved from outside the window (no target) onto the target once it hydrates. 11847 // Instead of mutating we could clone the event. 11848 switch (domEventName) { 11849 case 'focusin': 11850 { 11851 var focusEvent = nativeEvent; 11852 queuedFocus = accumulateOrCreateContinuousQueuedReplayableEvent(queuedFocus, blockedOn, domEventName, eventSystemFlags, targetContainer, focusEvent); 11853 return true; 11854 } 11855 11856 case 'dragenter': 11857 { 11858 var dragEvent = nativeEvent; 11859 queuedDrag = accumulateOrCreateContinuousQueuedReplayableEvent(queuedDrag, blockedOn, domEventName, eventSystemFlags, targetContainer, dragEvent); 11860 return true; 11861 } 11862 11863 case 'mouseover': 11864 { 11865 var mouseEvent = nativeEvent; 11866 queuedMouse = accumulateOrCreateContinuousQueuedReplayableEvent(queuedMouse, blockedOn, domEventName, eventSystemFlags, targetContainer, mouseEvent); 11867 return true; 11868 } 11869 11870 case 'pointerover': 11871 { 11872 var pointerEvent = nativeEvent; 11873 var pointerId = pointerEvent.pointerId; 11874 queuedPointers.set(pointerId, accumulateOrCreateContinuousQueuedReplayableEvent(queuedPointers.get(pointerId) || null, blockedOn, domEventName, eventSystemFlags, targetContainer, pointerEvent)); 11875 return true; 11876 } 11877 11878 case 'gotpointercapture': 11879 { 11880 var _pointerEvent = nativeEvent; 11881 var _pointerId2 = _pointerEvent.pointerId; 11882 queuedPointerCaptures.set(_pointerId2, accumulateOrCreateContinuousQueuedReplayableEvent(queuedPointerCaptures.get(_pointerId2) || null, blockedOn, domEventName, eventSystemFlags, targetContainer, _pointerEvent)); 11883 return true; 11884 } 11885 } 11886 11887 return false; 11888} // Check if this target is unblocked. Returns true if it's unblocked. 11889 11890function attemptExplicitHydrationTarget(queuedTarget) { 11891 // TODO: This function shares a lot of logic with findInstanceBlockingEvent. 11892 // Try to unify them. It's a bit tricky since it would require two return 11893 // values. 11894 var targetInst = getClosestInstanceFromNode(queuedTarget.target); 11895 11896 if (targetInst !== null) { 11897 var nearestMounted = getNearestMountedFiber(targetInst); 11898 11899 if (nearestMounted !== null) { 11900 var tag = nearestMounted.tag; 11901 11902 if (tag === SuspenseComponent) { 11903 var instance = getSuspenseInstanceFromFiber(nearestMounted); 11904 11905 if (instance !== null) { 11906 // We're blocked on hydrating this boundary. 11907 // Increase its priority. 11908 queuedTarget.blockedOn = instance; 11909 attemptHydrationAtPriority(queuedTarget.priority, function () { 11910 attemptHydrationAtCurrentPriority(nearestMounted); 11911 }); 11912 return; 11913 } 11914 } else if (tag === HostRoot) { 11915 var root = nearestMounted.stateNode; 11916 11917 if (isRootDehydrated(root)) { 11918 queuedTarget.blockedOn = getContainerFromFiber(nearestMounted); // We don't currently have a way to increase the priority of 11919 // a root other than sync. 11920 11921 return; 11922 } 11923 } 11924 } 11925 } 11926 11927 queuedTarget.blockedOn = null; 11928} 11929 11930function queueExplicitHydrationTarget(target) { 11931 // TODO: This will read the priority if it's dispatched by the React 11932 // event system but not native events. Should read window.event.type, like 11933 // we do for updates (getCurrentEventPriority). 11934 var updatePriority = getCurrentUpdatePriority$1(); 11935 var queuedTarget = { 11936 blockedOn: null, 11937 target: target, 11938 priority: updatePriority 11939 }; 11940 var i = 0; 11941 11942 for (; i < queuedExplicitHydrationTargets.length; i++) { 11943 // Stop once we hit the first target with lower priority than 11944 if (!isHigherEventPriority(updatePriority, queuedExplicitHydrationTargets[i].priority)) { 11945 break; 11946 } 11947 } 11948 11949 queuedExplicitHydrationTargets.splice(i, 0, queuedTarget); 11950 11951 if (i === 0) { 11952 attemptExplicitHydrationTarget(queuedTarget); 11953 } 11954} 11955 11956function attemptReplayContinuousQueuedEvent(queuedEvent) { 11957 if (queuedEvent.blockedOn !== null) { 11958 return false; 11959 } 11960 11961 var targetContainers = queuedEvent.targetContainers; 11962 11963 while (targetContainers.length > 0) { 11964 var targetContainer = targetContainers[0]; 11965 var nextBlockedOn = findInstanceBlockingEvent(queuedEvent.domEventName, queuedEvent.eventSystemFlags, targetContainer, queuedEvent.nativeEvent); 11966 11967 if (nextBlockedOn === null) { 11968 { 11969 var nativeEvent = queuedEvent.nativeEvent; 11970 var nativeEventClone = new nativeEvent.constructor(nativeEvent.type, nativeEvent); 11971 setReplayingEvent(nativeEventClone); 11972 nativeEvent.target.dispatchEvent(nativeEventClone); 11973 resetReplayingEvent(); 11974 } 11975 } else { 11976 // We're still blocked. Try again later. 11977 var _fiber3 = getInstanceFromNode(nextBlockedOn); 11978 11979 if (_fiber3 !== null) { 11980 attemptContinuousHydration(_fiber3); 11981 } 11982 11983 queuedEvent.blockedOn = nextBlockedOn; 11984 return false; 11985 } // This target container was successfully dispatched. Try the next. 11986 11987 11988 targetContainers.shift(); 11989 } 11990 11991 return true; 11992} 11993 11994function attemptReplayContinuousQueuedEventInMap(queuedEvent, key, map) { 11995 if (attemptReplayContinuousQueuedEvent(queuedEvent)) { 11996 map.delete(key); 11997 } 11998} 11999 12000function replayUnblockedEvents() { 12001 hasScheduledReplayAttempt = false; 12002 12003 12004 if (queuedFocus !== null && attemptReplayContinuousQueuedEvent(queuedFocus)) { 12005 queuedFocus = null; 12006 } 12007 12008 if (queuedDrag !== null && attemptReplayContinuousQueuedEvent(queuedDrag)) { 12009 queuedDrag = null; 12010 } 12011 12012 if (queuedMouse !== null && attemptReplayContinuousQueuedEvent(queuedMouse)) { 12013 queuedMouse = null; 12014 } 12015 12016 queuedPointers.forEach(attemptReplayContinuousQueuedEventInMap); 12017 queuedPointerCaptures.forEach(attemptReplayContinuousQueuedEventInMap); 12018} 12019 12020function scheduleCallbackIfUnblocked(queuedEvent, unblocked) { 12021 if (queuedEvent.blockedOn === unblocked) { 12022 queuedEvent.blockedOn = null; 12023 12024 if (!hasScheduledReplayAttempt) { 12025 hasScheduledReplayAttempt = true; // Schedule a callback to attempt replaying as many events as are 12026 // now unblocked. This first might not actually be unblocked yet. 12027 // We could check it early to avoid scheduling an unnecessary callback. 12028 12029 Scheduler.unstable_scheduleCallback(Scheduler.unstable_NormalPriority, replayUnblockedEvents); 12030 } 12031 } 12032} 12033 12034function retryIfBlockedOn(unblocked) { 12035 // Mark anything that was blocked on this as no longer blocked 12036 // and eligible for a replay. 12037 if (queuedDiscreteEvents.length > 0) { 12038 scheduleCallbackIfUnblocked(queuedDiscreteEvents[0], unblocked); // This is a exponential search for each boundary that commits. I think it's 12039 // worth it because we expect very few discrete events to queue up and once 12040 // we are actually fully unblocked it will be fast to replay them. 12041 12042 for (var i = 1; i < queuedDiscreteEvents.length; i++) { 12043 var queuedEvent = queuedDiscreteEvents[i]; 12044 12045 if (queuedEvent.blockedOn === unblocked) { 12046 queuedEvent.blockedOn = null; 12047 } 12048 } 12049 } 12050 12051 if (queuedFocus !== null) { 12052 scheduleCallbackIfUnblocked(queuedFocus, unblocked); 12053 } 12054 12055 if (queuedDrag !== null) { 12056 scheduleCallbackIfUnblocked(queuedDrag, unblocked); 12057 } 12058 12059 if (queuedMouse !== null) { 12060 scheduleCallbackIfUnblocked(queuedMouse, unblocked); 12061 } 12062 12063 var unblock = function (queuedEvent) { 12064 return scheduleCallbackIfUnblocked(queuedEvent, unblocked); 12065 }; 12066 12067 queuedPointers.forEach(unblock); 12068 queuedPointerCaptures.forEach(unblock); 12069 12070 for (var _i = 0; _i < queuedExplicitHydrationTargets.length; _i++) { 12071 var queuedTarget = queuedExplicitHydrationTargets[_i]; 12072 12073 if (queuedTarget.blockedOn === unblocked) { 12074 queuedTarget.blockedOn = null; 12075 } 12076 } 12077 12078 while (queuedExplicitHydrationTargets.length > 0) { 12079 var nextExplicitTarget = queuedExplicitHydrationTargets[0]; 12080 12081 if (nextExplicitTarget.blockedOn !== null) { 12082 // We're still blocked. 12083 break; 12084 } else { 12085 attemptExplicitHydrationTarget(nextExplicitTarget); 12086 12087 if (nextExplicitTarget.blockedOn === null) { 12088 // We're unblocked. 12089 queuedExplicitHydrationTargets.shift(); 12090 } 12091 } 12092 } 12093} 12094 12095var ReactCurrentBatchConfig = ReactSharedInternals.ReactCurrentBatchConfig; // TODO: can we stop exporting these? 12096 12097var _enabled = true; // This is exported in FB builds for use by legacy FB layer infra. 12098// We'd like to remove this but it's not clear if this is safe. 12099 12100function setEnabled(enabled) { 12101 _enabled = !!enabled; 12102} 12103function isEnabled() { 12104 return _enabled; 12105} 12106function createEventListenerWrapperWithPriority(targetContainer, domEventName, eventSystemFlags) { 12107 var eventPriority = getEventPriority(domEventName); 12108 var listenerWrapper; 12109 12110 switch (eventPriority) { 12111 case DiscreteEventPriority: 12112 listenerWrapper = dispatchDiscreteEvent; 12113 break; 12114 12115 case ContinuousEventPriority: 12116 listenerWrapper = dispatchContinuousEvent; 12117 break; 12118 12119 case DefaultEventPriority: 12120 default: 12121 listenerWrapper = dispatchEvent; 12122 break; 12123 } 12124 12125 return listenerWrapper.bind(null, domEventName, eventSystemFlags, targetContainer); 12126} 12127 12128function dispatchDiscreteEvent(domEventName, eventSystemFlags, container, nativeEvent) { 12129 var previousPriority = getCurrentUpdatePriority(); 12130 var prevTransition = ReactCurrentBatchConfig.transition; 12131 ReactCurrentBatchConfig.transition = null; 12132 12133 try { 12134 setCurrentUpdatePriority(DiscreteEventPriority); 12135 dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent); 12136 } finally { 12137 setCurrentUpdatePriority(previousPriority); 12138 ReactCurrentBatchConfig.transition = prevTransition; 12139 } 12140} 12141 12142function dispatchContinuousEvent(domEventName, eventSystemFlags, container, nativeEvent) { 12143 var previousPriority = getCurrentUpdatePriority(); 12144 var prevTransition = ReactCurrentBatchConfig.transition; 12145 ReactCurrentBatchConfig.transition = null; 12146 12147 try { 12148 setCurrentUpdatePriority(ContinuousEventPriority); 12149 dispatchEvent(domEventName, eventSystemFlags, container, nativeEvent); 12150 } finally { 12151 setCurrentUpdatePriority(previousPriority); 12152 ReactCurrentBatchConfig.transition = prevTransition; 12153 } 12154} 12155 12156function dispatchEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent) { 12157 if (!_enabled) { 12158 return; 12159 } 12160 12161 { 12162 dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay(domEventName, eventSystemFlags, targetContainer, nativeEvent); 12163 } 12164} 12165 12166function dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay(domEventName, eventSystemFlags, targetContainer, nativeEvent) { 12167 var blockedOn = findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent); 12168 12169 if (blockedOn === null) { 12170 dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, return_targetInst, targetContainer); 12171 clearIfContinuousEvent(domEventName, nativeEvent); 12172 return; 12173 } 12174 12175 if (queueIfContinuousEvent(blockedOn, domEventName, eventSystemFlags, targetContainer, nativeEvent)) { 12176 nativeEvent.stopPropagation(); 12177 return; 12178 } // We need to clear only if we didn't queue because 12179 // queueing is accumulative. 12180 12181 12182 clearIfContinuousEvent(domEventName, nativeEvent); 12183 12184 if (eventSystemFlags & IS_CAPTURE_PHASE && isDiscreteEventThatRequiresHydration(domEventName)) { 12185 while (blockedOn !== null) { 12186 var fiber = getInstanceFromNode(blockedOn); 12187 12188 if (fiber !== null) { 12189 attemptSynchronousHydration(fiber); 12190 } 12191 12192 var nextBlockedOn = findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent); 12193 12194 if (nextBlockedOn === null) { 12195 dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, return_targetInst, targetContainer); 12196 } 12197 12198 if (nextBlockedOn === blockedOn) { 12199 break; 12200 } 12201 12202 blockedOn = nextBlockedOn; 12203 } 12204 12205 if (blockedOn !== null) { 12206 nativeEvent.stopPropagation(); 12207 } 12208 12209 return; 12210 } // This is not replayable so we'll invoke it but without a target, 12211 // in case the event system needs to trace it. 12212 12213 12214 dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, null, targetContainer); 12215} 12216 12217var return_targetInst = null; // Returns a SuspenseInstance or Container if it's blocked. 12218// The return_targetInst field above is conceptually part of the return value. 12219 12220function findInstanceBlockingEvent(domEventName, eventSystemFlags, targetContainer, nativeEvent) { 12221 // TODO: Warn if _enabled is false. 12222 return_targetInst = null; 12223 var nativeEventTarget = getEventTarget(nativeEvent); 12224 var targetInst = getClosestInstanceFromNode(nativeEventTarget); 12225 12226 if (targetInst !== null) { 12227 var nearestMounted = getNearestMountedFiber(targetInst); 12228 12229 if (nearestMounted === null) { 12230 // This tree has been unmounted already. Dispatch without a target. 12231 targetInst = null; 12232 } else { 12233 var tag = nearestMounted.tag; 12234 12235 if (tag === SuspenseComponent) { 12236 var instance = getSuspenseInstanceFromFiber(nearestMounted); 12237 12238 if (instance !== null) { 12239 // Queue the event to be replayed later. Abort dispatching since we 12240 // don't want this event dispatched twice through the event system. 12241 // TODO: If this is the first discrete event in the queue. Schedule an increased 12242 // priority for this boundary. 12243 return instance; 12244 } // This shouldn't happen, something went wrong but to avoid blocking 12245 // the whole system, dispatch the event without a target. 12246 // TODO: Warn. 12247 12248 12249 targetInst = null; 12250 } else if (tag === HostRoot) { 12251 var root = nearestMounted.stateNode; 12252 12253 if (isRootDehydrated(root)) { 12254 // If this happens during a replay something went wrong and it might block 12255 // the whole system. 12256 return getContainerFromFiber(nearestMounted); 12257 } 12258 12259 targetInst = null; 12260 } else if (nearestMounted !== targetInst) { 12261 // If we get an event (ex: img onload) before committing that 12262 // component's mount, ignore it for now (that is, treat it as if it was an 12263 // event on a non-React tree). We might also consider queueing events and 12264 // dispatching them after the mount. 12265 targetInst = null; 12266 } 12267 } 12268 } 12269 12270 return_targetInst = targetInst; // We're not blocked on anything. 12271 12272 return null; 12273} 12274function getEventPriority(domEventName) { 12275 switch (domEventName) { 12276 // Used by SimpleEventPlugin: 12277 case 'cancel': 12278 case 'click': 12279 case 'close': 12280 case 'contextmenu': 12281 case 'copy': 12282 case 'cut': 12283 case 'auxclick': 12284 case 'dblclick': 12285 case 'dragend': 12286 case 'dragstart': 12287 case 'drop': 12288 case 'focusin': 12289 case 'focusout': 12290 case 'input': 12291 case 'invalid': 12292 case 'keydown': 12293 case 'keypress': 12294 case 'keyup': 12295 case 'mousedown': 12296 case 'mouseup': 12297 case 'paste': 12298 case 'pause': 12299 case 'play': 12300 case 'pointercancel': 12301 case 'pointerdown': 12302 case 'pointerup': 12303 case 'ratechange': 12304 case 'reset': 12305 case 'resize': 12306 case 'seeked': 12307 case 'submit': 12308 case 'touchcancel': 12309 case 'touchend': 12310 case 'touchstart': 12311 case 'volumechange': // Used by polyfills: 12312 // eslint-disable-next-line no-fallthrough 12313 12314 case 'change': 12315 case 'selectionchange': 12316 case 'textInput': 12317 case 'compositionstart': 12318 case 'compositionend': 12319 case 'compositionupdate': // Only enableCreateEventHandleAPI: 12320 // eslint-disable-next-line no-fallthrough 12321 12322 case 'beforeblur': 12323 case 'afterblur': // Not used by React but could be by user code: 12324 // eslint-disable-next-line no-fallthrough 12325 12326 case 'beforeinput': 12327 case 'blur': 12328 case 'fullscreenchange': 12329 case 'focus': 12330 case 'hashchange': 12331 case 'popstate': 12332 case 'select': 12333 case 'selectstart': 12334 return DiscreteEventPriority; 12335 12336 case 'drag': 12337 case 'dragenter': 12338 case 'dragexit': 12339 case 'dragleave': 12340 case 'dragover': 12341 case 'mousemove': 12342 case 'mouseout': 12343 case 'mouseover': 12344 case 'pointermove': 12345 case 'pointerout': 12346 case 'pointerover': 12347 case 'scroll': 12348 case 'toggle': 12349 case 'touchmove': 12350 case 'wheel': // Not used by React but could be by user code: 12351 // eslint-disable-next-line no-fallthrough 12352 12353 case 'mouseenter': 12354 case 'mouseleave': 12355 case 'pointerenter': 12356 case 'pointerleave': 12357 return ContinuousEventPriority; 12358 12359 case 'message': 12360 { 12361 // We might be in the Scheduler callback. 12362 // Eventually this mechanism will be replaced by a check 12363 // of the current priority on the native scheduler. 12364 var schedulerPriority = getCurrentPriorityLevel(); 12365 12366 switch (schedulerPriority) { 12367 case ImmediatePriority: 12368 return DiscreteEventPriority; 12369 12370 case UserBlockingPriority: 12371 return ContinuousEventPriority; 12372 12373 case NormalPriority: 12374 case LowPriority: 12375 // TODO: Handle LowSchedulerPriority, somehow. Maybe the same lane as hydration. 12376 return DefaultEventPriority; 12377 12378 case IdlePriority: 12379 return IdleEventPriority; 12380 12381 default: 12382 return DefaultEventPriority; 12383 } 12384 } 12385 12386 default: 12387 return DefaultEventPriority; 12388 } 12389} 12390 12391function addEventBubbleListener(target, eventType, listener) { 12392 target.addEventListener(eventType, listener, false); 12393 return listener; 12394} 12395function addEventCaptureListener(target, eventType, listener) { 12396 target.addEventListener(eventType, listener, true); 12397 return listener; 12398} 12399function addEventCaptureListenerWithPassiveFlag(target, eventType, listener, passive) { 12400 target.addEventListener(eventType, listener, { 12401 capture: true, 12402 passive: passive 12403 }); 12404 return listener; 12405} 12406function addEventBubbleListenerWithPassiveFlag(target, eventType, listener, passive) { 12407 target.addEventListener(eventType, listener, { 12408 passive: passive 12409 }); 12410 return listener; 12411} 12412 12413/** 12414 * These variables store information about text content of a target node, 12415 * allowing comparison of content before and after a given event. 12416 * 12417 * Identify the node where selection currently begins, then observe 12418 * both its text content and its current position in the DOM. Since the 12419 * browser may natively replace the target node during composition, we can 12420 * use its position to find its replacement. 12421 * 12422 * 12423 */ 12424var root = null; 12425var startText = null; 12426var fallbackText = null; 12427function initialize(nativeEventTarget) { 12428 root = nativeEventTarget; 12429 startText = getText(); 12430 return true; 12431} 12432function reset() { 12433 root = null; 12434 startText = null; 12435 fallbackText = null; 12436} 12437function getData() { 12438 if (fallbackText) { 12439 return fallbackText; 12440 } 12441 12442 var start; 12443 var startValue = startText; 12444 var startLength = startValue.length; 12445 var end; 12446 var endValue = getText(); 12447 var endLength = endValue.length; 12448 12449 for (start = 0; start < startLength; start++) { 12450 if (startValue[start] !== endValue[start]) { 12451 break; 12452 } 12453 } 12454 12455 var minEnd = startLength - start; 12456 12457 for (end = 1; end <= minEnd; end++) { 12458 if (startValue[startLength - end] !== endValue[endLength - end]) { 12459 break; 12460 } 12461 } 12462 12463 var sliceTail = end > 1 ? 1 - end : undefined; 12464 fallbackText = endValue.slice(start, sliceTail); 12465 return fallbackText; 12466} 12467function getText() { 12468 if ('value' in root) { 12469 return root.value; 12470 } 12471 12472 return root.textContent; 12473} 12474 12475/** 12476 * `charCode` represents the actual "character code" and is safe to use with 12477 * `String.fromCharCode`. As such, only keys that correspond to printable 12478 * characters produce a valid `charCode`, the only exception to this is Enter. 12479 * The Tab-key is considered non-printable and does not have a `charCode`, 12480 * presumably because it does not produce a tab-character in browsers. 12481 * 12482 * @param {object} nativeEvent Native browser event. 12483 * @return {number} Normalized `charCode` property. 12484 */ 12485function getEventCharCode(nativeEvent) { 12486 var charCode; 12487 var keyCode = nativeEvent.keyCode; 12488 12489 if ('charCode' in nativeEvent) { 12490 charCode = nativeEvent.charCode; // FF does not set `charCode` for the Enter-key, check against `keyCode`. 12491 12492 if (charCode === 0 && keyCode === 13) { 12493 charCode = 13; 12494 } 12495 } else { 12496 // IE8 does not implement `charCode`, but `keyCode` has the correct value. 12497 charCode = keyCode; 12498 } // IE and Edge (on Windows) and Chrome / Safari (on Windows and Linux) 12499 // report Enter as charCode 10 when ctrl is pressed. 12500 12501 12502 if (charCode === 10) { 12503 charCode = 13; 12504 } // Some non-printable keys are reported in `charCode`/`keyCode`, discard them. 12505 // Must not discard the (non-)printable Enter-key. 12506 12507 12508 if (charCode >= 32 || charCode === 13) { 12509 return charCode; 12510 } 12511 12512 return 0; 12513} 12514 12515function functionThatReturnsTrue() { 12516 return true; 12517} 12518 12519function functionThatReturnsFalse() { 12520 return false; 12521} // This is intentionally a factory so that we have different returned constructors. 12522// If we had a single constructor, it would be megamorphic and engines would deopt. 12523 12524 12525function createSyntheticEvent(Interface) { 12526 /** 12527 * Synthetic events are dispatched by event plugins, typically in response to a 12528 * top-level event delegation handler. 12529 * 12530 * These systems should generally use pooling to reduce the frequency of garbage 12531 * collection. The system should check `isPersistent` to determine whether the 12532 * event should be released into the pool after being dispatched. Users that 12533 * need a persisted event should invoke `persist`. 12534 * 12535 * Synthetic events (and subclasses) implement the DOM Level 3 Events API by 12536 * normalizing browser quirks. Subclasses do not necessarily have to implement a 12537 * DOM interface; custom application-specific events can also subclass this. 12538 */ 12539 function SyntheticBaseEvent(reactName, reactEventType, targetInst, nativeEvent, nativeEventTarget) { 12540 this._reactName = reactName; 12541 this._targetInst = targetInst; 12542 this.type = reactEventType; 12543 this.nativeEvent = nativeEvent; 12544 this.target = nativeEventTarget; 12545 this.currentTarget = null; 12546 12547 for (var _propName in Interface) { 12548 if (!Interface.hasOwnProperty(_propName)) { 12549 continue; 12550 } 12551 12552 var normalize = Interface[_propName]; 12553 12554 if (normalize) { 12555 this[_propName] = normalize(nativeEvent); 12556 } else { 12557 this[_propName] = nativeEvent[_propName]; 12558 } 12559 } 12560 12561 var defaultPrevented = nativeEvent.defaultPrevented != null ? nativeEvent.defaultPrevented : nativeEvent.returnValue === false; 12562 12563 if (defaultPrevented) { 12564 this.isDefaultPrevented = functionThatReturnsTrue; 12565 } else { 12566 this.isDefaultPrevented = functionThatReturnsFalse; 12567 } 12568 12569 this.isPropagationStopped = functionThatReturnsFalse; 12570 return this; 12571 } 12572 12573 assign(SyntheticBaseEvent.prototype, { 12574 preventDefault: function () { 12575 this.defaultPrevented = true; 12576 var event = this.nativeEvent; 12577 12578 if (!event) { 12579 return; 12580 } 12581 12582 if (event.preventDefault) { 12583 event.preventDefault(); // $FlowFixMe - flow is not aware of `unknown` in IE 12584 } else if (typeof event.returnValue !== 'unknown') { 12585 event.returnValue = false; 12586 } 12587 12588 this.isDefaultPrevented = functionThatReturnsTrue; 12589 }, 12590 stopPropagation: function () { 12591 var event = this.nativeEvent; 12592 12593 if (!event) { 12594 return; 12595 } 12596 12597 if (event.stopPropagation) { 12598 event.stopPropagation(); // $FlowFixMe - flow is not aware of `unknown` in IE 12599 } else if (typeof event.cancelBubble !== 'unknown') { 12600 // The ChangeEventPlugin registers a "propertychange" event for 12601 // IE. This event does not support bubbling or cancelling, and 12602 // any references to cancelBubble throw "Member not found". A 12603 // typeof check of "unknown" circumvents this issue (and is also 12604 // IE specific). 12605 event.cancelBubble = true; 12606 } 12607 12608 this.isPropagationStopped = functionThatReturnsTrue; 12609 }, 12610 12611 /** 12612 * We release all dispatched `SyntheticEvent`s after each event loop, adding 12613 * them back into the pool. This allows a way to hold onto a reference that 12614 * won't be added back into the pool. 12615 */ 12616 persist: function () {// Modern event system doesn't use pooling. 12617 }, 12618 12619 /** 12620 * Checks if this event should be released back into the pool. 12621 * 12622 * @return {boolean} True if this should not be released, false otherwise. 12623 */ 12624 isPersistent: functionThatReturnsTrue 12625 }); 12626 return SyntheticBaseEvent; 12627} 12628/** 12629 * @interface Event 12630 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 12631 */ 12632 12633 12634var EventInterface = { 12635 eventPhase: 0, 12636 bubbles: 0, 12637 cancelable: 0, 12638 timeStamp: function (event) { 12639 return event.timeStamp || Date.now(); 12640 }, 12641 defaultPrevented: 0, 12642 isTrusted: 0 12643}; 12644var SyntheticEvent = createSyntheticEvent(EventInterface); 12645 12646var UIEventInterface = assign({}, EventInterface, { 12647 view: 0, 12648 detail: 0 12649}); 12650 12651var SyntheticUIEvent = createSyntheticEvent(UIEventInterface); 12652var lastMovementX; 12653var lastMovementY; 12654var lastMouseEvent; 12655 12656function updateMouseMovementPolyfillState(event) { 12657 if (event !== lastMouseEvent) { 12658 if (lastMouseEvent && event.type === 'mousemove') { 12659 lastMovementX = event.screenX - lastMouseEvent.screenX; 12660 lastMovementY = event.screenY - lastMouseEvent.screenY; 12661 } else { 12662 lastMovementX = 0; 12663 lastMovementY = 0; 12664 } 12665 12666 lastMouseEvent = event; 12667 } 12668} 12669/** 12670 * @interface MouseEvent 12671 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 12672 */ 12673 12674 12675var MouseEventInterface = assign({}, UIEventInterface, { 12676 screenX: 0, 12677 screenY: 0, 12678 clientX: 0, 12679 clientY: 0, 12680 pageX: 0, 12681 pageY: 0, 12682 ctrlKey: 0, 12683 shiftKey: 0, 12684 altKey: 0, 12685 metaKey: 0, 12686 getModifierState: getEventModifierState, 12687 button: 0, 12688 buttons: 0, 12689 relatedTarget: function (event) { 12690 if (event.relatedTarget === undefined) return event.fromElement === event.srcElement ? event.toElement : event.fromElement; 12691 return event.relatedTarget; 12692 }, 12693 movementX: function (event) { 12694 if ('movementX' in event) { 12695 return event.movementX; 12696 } 12697 12698 updateMouseMovementPolyfillState(event); 12699 return lastMovementX; 12700 }, 12701 movementY: function (event) { 12702 if ('movementY' in event) { 12703 return event.movementY; 12704 } // Don't need to call updateMouseMovementPolyfillState() here 12705 // because it's guaranteed to have already run when movementX 12706 // was copied. 12707 12708 12709 return lastMovementY; 12710 } 12711}); 12712 12713var SyntheticMouseEvent = createSyntheticEvent(MouseEventInterface); 12714/** 12715 * @interface DragEvent 12716 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 12717 */ 12718 12719var DragEventInterface = assign({}, MouseEventInterface, { 12720 dataTransfer: 0 12721}); 12722 12723var SyntheticDragEvent = createSyntheticEvent(DragEventInterface); 12724/** 12725 * @interface FocusEvent 12726 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 12727 */ 12728 12729var FocusEventInterface = assign({}, UIEventInterface, { 12730 relatedTarget: 0 12731}); 12732 12733var SyntheticFocusEvent = createSyntheticEvent(FocusEventInterface); 12734/** 12735 * @interface Event 12736 * @see http://www.w3.org/TR/css3-animations/#AnimationEvent-interface 12737 * @see https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent 12738 */ 12739 12740var AnimationEventInterface = assign({}, EventInterface, { 12741 animationName: 0, 12742 elapsedTime: 0, 12743 pseudoElement: 0 12744}); 12745 12746var SyntheticAnimationEvent = createSyntheticEvent(AnimationEventInterface); 12747/** 12748 * @interface Event 12749 * @see http://www.w3.org/TR/clipboard-apis/ 12750 */ 12751 12752var ClipboardEventInterface = assign({}, EventInterface, { 12753 clipboardData: function (event) { 12754 return 'clipboardData' in event ? event.clipboardData : window.clipboardData; 12755 } 12756}); 12757 12758var SyntheticClipboardEvent = createSyntheticEvent(ClipboardEventInterface); 12759/** 12760 * @interface Event 12761 * @see http://www.w3.org/TR/DOM-Level-3-Events/#events-compositionevents 12762 */ 12763 12764var CompositionEventInterface = assign({}, EventInterface, { 12765 data: 0 12766}); 12767 12768var SyntheticCompositionEvent = createSyntheticEvent(CompositionEventInterface); 12769/** 12770 * @interface Event 12771 * @see http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105 12772 * /#events-inputevents 12773 */ 12774// Happens to share the same list for now. 12775 12776var SyntheticInputEvent = SyntheticCompositionEvent; 12777/** 12778 * Normalization of deprecated HTML5 `key` values 12779 * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names 12780 */ 12781 12782var normalizeKey = { 12783 Esc: 'Escape', 12784 Spacebar: ' ', 12785 Left: 'ArrowLeft', 12786 Up: 'ArrowUp', 12787 Right: 'ArrowRight', 12788 Down: 'ArrowDown', 12789 Del: 'Delete', 12790 Win: 'OS', 12791 Menu: 'ContextMenu', 12792 Apps: 'ContextMenu', 12793 Scroll: 'ScrollLock', 12794 MozPrintableKey: 'Unidentified' 12795}; 12796/** 12797 * Translation from legacy `keyCode` to HTML5 `key` 12798 * Only special keys supported, all others depend on keyboard layout or browser 12799 * @see https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent#Key_names 12800 */ 12801 12802var translateToKey = { 12803 '8': 'Backspace', 12804 '9': 'Tab', 12805 '12': 'Clear', 12806 '13': 'Enter', 12807 '16': 'Shift', 12808 '17': 'Control', 12809 '18': 'Alt', 12810 '19': 'Pause', 12811 '20': 'CapsLock', 12812 '27': 'Escape', 12813 '32': ' ', 12814 '33': 'PageUp', 12815 '34': 'PageDown', 12816 '35': 'End', 12817 '36': 'Home', 12818 '37': 'ArrowLeft', 12819 '38': 'ArrowUp', 12820 '39': 'ArrowRight', 12821 '40': 'ArrowDown', 12822 '45': 'Insert', 12823 '46': 'Delete', 12824 '112': 'F1', 12825 '113': 'F2', 12826 '114': 'F3', 12827 '115': 'F4', 12828 '116': 'F5', 12829 '117': 'F6', 12830 '118': 'F7', 12831 '119': 'F8', 12832 '120': 'F9', 12833 '121': 'F10', 12834 '122': 'F11', 12835 '123': 'F12', 12836 '144': 'NumLock', 12837 '145': 'ScrollLock', 12838 '224': 'Meta' 12839}; 12840/** 12841 * @param {object} nativeEvent Native browser event. 12842 * @return {string} Normalized `key` property. 12843 */ 12844 12845function getEventKey(nativeEvent) { 12846 if (nativeEvent.key) { 12847 // Normalize inconsistent values reported by browsers due to 12848 // implementations of a working draft specification. 12849 // FireFox implements `key` but returns `MozPrintableKey` for all 12850 // printable characters (normalized to `Unidentified`), ignore it. 12851 var key = normalizeKey[nativeEvent.key] || nativeEvent.key; 12852 12853 if (key !== 'Unidentified') { 12854 return key; 12855 } 12856 } // Browser does not implement `key`, polyfill as much of it as we can. 12857 12858 12859 if (nativeEvent.type === 'keypress') { 12860 var charCode = getEventCharCode(nativeEvent); // The enter-key is technically both printable and non-printable and can 12861 // thus be captured by `keypress`, no other non-printable key should. 12862 12863 return charCode === 13 ? 'Enter' : String.fromCharCode(charCode); 12864 } 12865 12866 if (nativeEvent.type === 'keydown' || nativeEvent.type === 'keyup') { 12867 // While user keyboard layout determines the actual meaning of each 12868 // `keyCode` value, almost all function keys have a universal value. 12869 return translateToKey[nativeEvent.keyCode] || 'Unidentified'; 12870 } 12871 12872 return ''; 12873} 12874/** 12875 * Translation from modifier key to the associated property in the event. 12876 * @see http://www.w3.org/TR/DOM-Level-3-Events/#keys-Modifiers 12877 */ 12878 12879 12880var modifierKeyToProp = { 12881 Alt: 'altKey', 12882 Control: 'ctrlKey', 12883 Meta: 'metaKey', 12884 Shift: 'shiftKey' 12885}; // Older browsers (Safari <= 10, iOS Safari <= 10.2) do not support 12886// getModifierState. If getModifierState is not supported, we map it to a set of 12887// modifier keys exposed by the event. In this case, Lock-keys are not supported. 12888 12889function modifierStateGetter(keyArg) { 12890 var syntheticEvent = this; 12891 var nativeEvent = syntheticEvent.nativeEvent; 12892 12893 if (nativeEvent.getModifierState) { 12894 return nativeEvent.getModifierState(keyArg); 12895 } 12896 12897 var keyProp = modifierKeyToProp[keyArg]; 12898 return keyProp ? !!nativeEvent[keyProp] : false; 12899} 12900 12901function getEventModifierState(nativeEvent) { 12902 return modifierStateGetter; 12903} 12904/** 12905 * @interface KeyboardEvent 12906 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 12907 */ 12908 12909 12910var KeyboardEventInterface = assign({}, UIEventInterface, { 12911 key: getEventKey, 12912 code: 0, 12913 location: 0, 12914 ctrlKey: 0, 12915 shiftKey: 0, 12916 altKey: 0, 12917 metaKey: 0, 12918 repeat: 0, 12919 locale: 0, 12920 getModifierState: getEventModifierState, 12921 // Legacy Interface 12922 charCode: function (event) { 12923 // `charCode` is the result of a KeyPress event and represents the value of 12924 // the actual printable character. 12925 // KeyPress is deprecated, but its replacement is not yet final and not 12926 // implemented in any major browser. Only KeyPress has charCode. 12927 if (event.type === 'keypress') { 12928 return getEventCharCode(event); 12929 } 12930 12931 return 0; 12932 }, 12933 keyCode: function (event) { 12934 // `keyCode` is the result of a KeyDown/Up event and represents the value of 12935 // physical keyboard key. 12936 // The actual meaning of the value depends on the users' keyboard layout 12937 // which cannot be detected. Assuming that it is a US keyboard layout 12938 // provides a surprisingly accurate mapping for US and European users. 12939 // Due to this, it is left to the user to implement at this time. 12940 if (event.type === 'keydown' || event.type === 'keyup') { 12941 return event.keyCode; 12942 } 12943 12944 return 0; 12945 }, 12946 which: function (event) { 12947 // `which` is an alias for either `keyCode` or `charCode` depending on the 12948 // type of the event. 12949 if (event.type === 'keypress') { 12950 return getEventCharCode(event); 12951 } 12952 12953 if (event.type === 'keydown' || event.type === 'keyup') { 12954 return event.keyCode; 12955 } 12956 12957 return 0; 12958 } 12959}); 12960 12961var SyntheticKeyboardEvent = createSyntheticEvent(KeyboardEventInterface); 12962/** 12963 * @interface PointerEvent 12964 * @see http://www.w3.org/TR/pointerevents/ 12965 */ 12966 12967var PointerEventInterface = assign({}, MouseEventInterface, { 12968 pointerId: 0, 12969 width: 0, 12970 height: 0, 12971 pressure: 0, 12972 tangentialPressure: 0, 12973 tiltX: 0, 12974 tiltY: 0, 12975 twist: 0, 12976 pointerType: 0, 12977 isPrimary: 0 12978}); 12979 12980var SyntheticPointerEvent = createSyntheticEvent(PointerEventInterface); 12981/** 12982 * @interface TouchEvent 12983 * @see http://www.w3.org/TR/touch-events/ 12984 */ 12985 12986var TouchEventInterface = assign({}, UIEventInterface, { 12987 touches: 0, 12988 targetTouches: 0, 12989 changedTouches: 0, 12990 altKey: 0, 12991 metaKey: 0, 12992 ctrlKey: 0, 12993 shiftKey: 0, 12994 getModifierState: getEventModifierState 12995}); 12996 12997var SyntheticTouchEvent = createSyntheticEvent(TouchEventInterface); 12998/** 12999 * @interface Event 13000 * @see http://www.w3.org/TR/2009/WD-css3-transitions-20090320/#transition-events- 13001 * @see https://developer.mozilla.org/en-US/docs/Web/API/TransitionEvent 13002 */ 13003 13004var TransitionEventInterface = assign({}, EventInterface, { 13005 propertyName: 0, 13006 elapsedTime: 0, 13007 pseudoElement: 0 13008}); 13009 13010var SyntheticTransitionEvent = createSyntheticEvent(TransitionEventInterface); 13011/** 13012 * @interface WheelEvent 13013 * @see http://www.w3.org/TR/DOM-Level-3-Events/ 13014 */ 13015 13016var WheelEventInterface = assign({}, MouseEventInterface, { 13017 deltaX: function (event) { 13018 return 'deltaX' in event ? event.deltaX : // Fallback to `wheelDeltaX` for Webkit and normalize (right is positive). 13019 'wheelDeltaX' in event ? -event.wheelDeltaX : 0; 13020 }, 13021 deltaY: function (event) { 13022 return 'deltaY' in event ? event.deltaY : // Fallback to `wheelDeltaY` for Webkit and normalize (down is positive). 13023 'wheelDeltaY' in event ? -event.wheelDeltaY : // Fallback to `wheelDelta` for IE<9 and normalize (down is positive). 13024 'wheelDelta' in event ? -event.wheelDelta : 0; 13025 }, 13026 deltaZ: 0, 13027 // Browsers without "deltaMode" is reporting in raw wheel delta where one 13028 // notch on the scroll is always +/- 120, roughly equivalent to pixels. 13029 // A good approximation of DOM_DELTA_LINE (1) is 5% of viewport size or 13030 // ~40 pixels, for DOM_DELTA_SCREEN (2) it is 87.5% of viewport size. 13031 deltaMode: 0 13032}); 13033 13034var SyntheticWheelEvent = createSyntheticEvent(WheelEventInterface); 13035 13036var END_KEYCODES = [9, 13, 27, 32]; // Tab, Return, Esc, Space 13037 13038var START_KEYCODE = 229; 13039var canUseCompositionEvent = canUseDOM && 'CompositionEvent' in window; 13040var documentMode = null; 13041 13042if (canUseDOM && 'documentMode' in document) { 13043 documentMode = document.documentMode; 13044} // Webkit offers a very useful `textInput` event that can be used to 13045// directly represent `beforeInput`. The IE `textinput` event is not as 13046// useful, so we don't use it. 13047 13048 13049var canUseTextInputEvent = canUseDOM && 'TextEvent' in window && !documentMode; // In IE9+, we have access to composition events, but the data supplied 13050// by the native compositionend event may be incorrect. Japanese ideographic 13051// spaces, for instance (\u3000) are not recorded correctly. 13052 13053var useFallbackCompositionData = canUseDOM && (!canUseCompositionEvent || documentMode && documentMode > 8 && documentMode <= 11); 13054var SPACEBAR_CODE = 32; 13055var SPACEBAR_CHAR = String.fromCharCode(SPACEBAR_CODE); 13056 13057function registerEvents() { 13058 registerTwoPhaseEvent('onBeforeInput', ['compositionend', 'keypress', 'textInput', 'paste']); 13059 registerTwoPhaseEvent('onCompositionEnd', ['compositionend', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']); 13060 registerTwoPhaseEvent('onCompositionStart', ['compositionstart', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']); 13061 registerTwoPhaseEvent('onCompositionUpdate', ['compositionupdate', 'focusout', 'keydown', 'keypress', 'keyup', 'mousedown']); 13062} // Track whether we've ever handled a keypress on the space key. 13063 13064 13065var hasSpaceKeypress = false; 13066/** 13067 * Return whether a native keypress event is assumed to be a command. 13068 * This is required because Firefox fires `keypress` events for key commands 13069 * (cut, copy, select-all, etc.) even though no character is inserted. 13070 */ 13071 13072function isKeypressCommand(nativeEvent) { 13073 return (nativeEvent.ctrlKey || nativeEvent.altKey || nativeEvent.metaKey) && // ctrlKey && altKey is equivalent to AltGr, and is not a command. 13074 !(nativeEvent.ctrlKey && nativeEvent.altKey); 13075} 13076/** 13077 * Translate native top level events into event types. 13078 */ 13079 13080 13081function getCompositionEventType(domEventName) { 13082 switch (domEventName) { 13083 case 'compositionstart': 13084 return 'onCompositionStart'; 13085 13086 case 'compositionend': 13087 return 'onCompositionEnd'; 13088 13089 case 'compositionupdate': 13090 return 'onCompositionUpdate'; 13091 } 13092} 13093/** 13094 * Does our fallback best-guess model think this event signifies that 13095 * composition has begun? 13096 */ 13097 13098 13099function isFallbackCompositionStart(domEventName, nativeEvent) { 13100 return domEventName === 'keydown' && nativeEvent.keyCode === START_KEYCODE; 13101} 13102/** 13103 * Does our fallback mode think that this event is the end of composition? 13104 */ 13105 13106 13107function isFallbackCompositionEnd(domEventName, nativeEvent) { 13108 switch (domEventName) { 13109 case 'keyup': 13110 // Command keys insert or clear IME input. 13111 return END_KEYCODES.indexOf(nativeEvent.keyCode) !== -1; 13112 13113 case 'keydown': 13114 // Expect IME keyCode on each keydown. If we get any other 13115 // code we must have exited earlier. 13116 return nativeEvent.keyCode !== START_KEYCODE; 13117 13118 case 'keypress': 13119 case 'mousedown': 13120 case 'focusout': 13121 // Events are not possible without cancelling IME. 13122 return true; 13123 13124 default: 13125 return false; 13126 } 13127} 13128/** 13129 * Google Input Tools provides composition data via a CustomEvent, 13130 * with the `data` property populated in the `detail` object. If this 13131 * is available on the event object, use it. If not, this is a plain 13132 * composition event and we have nothing special to extract. 13133 * 13134 * @param {object} nativeEvent 13135 * @return {?string} 13136 */ 13137 13138 13139function getDataFromCustomEvent(nativeEvent) { 13140 var detail = nativeEvent.detail; 13141 13142 if (typeof detail === 'object' && 'data' in detail) { 13143 return detail.data; 13144 } 13145 13146 return null; 13147} 13148/** 13149 * Check if a composition event was triggered by Korean IME. 13150 * Our fallback mode does not work well with IE's Korean IME, 13151 * so just use native composition events when Korean IME is used. 13152 * Although CompositionEvent.locale property is deprecated, 13153 * it is available in IE, where our fallback mode is enabled. 13154 * 13155 * @param {object} nativeEvent 13156 * @return {boolean} 13157 */ 13158 13159 13160function isUsingKoreanIME(nativeEvent) { 13161 return nativeEvent.locale === 'ko'; 13162} // Track the current IME composition status, if any. 13163 13164 13165var isComposing = false; 13166/** 13167 * @return {?object} A SyntheticCompositionEvent. 13168 */ 13169 13170function extractCompositionEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget) { 13171 var eventType; 13172 var fallbackData; 13173 13174 if (canUseCompositionEvent) { 13175 eventType = getCompositionEventType(domEventName); 13176 } else if (!isComposing) { 13177 if (isFallbackCompositionStart(domEventName, nativeEvent)) { 13178 eventType = 'onCompositionStart'; 13179 } 13180 } else if (isFallbackCompositionEnd(domEventName, nativeEvent)) { 13181 eventType = 'onCompositionEnd'; 13182 } 13183 13184 if (!eventType) { 13185 return null; 13186 } 13187 13188 if (useFallbackCompositionData && !isUsingKoreanIME(nativeEvent)) { 13189 // The current composition is stored statically and must not be 13190 // overwritten while composition continues. 13191 if (!isComposing && eventType === 'onCompositionStart') { 13192 isComposing = initialize(nativeEventTarget); 13193 } else if (eventType === 'onCompositionEnd') { 13194 if (isComposing) { 13195 fallbackData = getData(); 13196 } 13197 } 13198 } 13199 13200 var listeners = accumulateTwoPhaseListeners(targetInst, eventType); 13201 13202 if (listeners.length > 0) { 13203 var event = new SyntheticCompositionEvent(eventType, domEventName, null, nativeEvent, nativeEventTarget); 13204 dispatchQueue.push({ 13205 event: event, 13206 listeners: listeners 13207 }); 13208 13209 if (fallbackData) { 13210 // Inject data generated from fallback path into the synthetic event. 13211 // This matches the property of native CompositionEventInterface. 13212 event.data = fallbackData; 13213 } else { 13214 var customData = getDataFromCustomEvent(nativeEvent); 13215 13216 if (customData !== null) { 13217 event.data = customData; 13218 } 13219 } 13220 } 13221} 13222 13223function getNativeBeforeInputChars(domEventName, nativeEvent) { 13224 switch (domEventName) { 13225 case 'compositionend': 13226 return getDataFromCustomEvent(nativeEvent); 13227 13228 case 'keypress': 13229 /** 13230 * If native `textInput` events are available, our goal is to make 13231 * use of them. However, there is a special case: the spacebar key. 13232 * In Webkit, preventing default on a spacebar `textInput` event 13233 * cancels character insertion, but it *also* causes the browser 13234 * to fall back to its default spacebar behavior of scrolling the 13235 * page. 13236 * 13237 * Tracking at: 13238 * https://code.google.com/p/chromium/issues/detail?id=355103 13239 * 13240 * To avoid this issue, use the keypress event as if no `textInput` 13241 * event is available. 13242 */ 13243 var which = nativeEvent.which; 13244 13245 if (which !== SPACEBAR_CODE) { 13246 return null; 13247 } 13248 13249 hasSpaceKeypress = true; 13250 return SPACEBAR_CHAR; 13251 13252 case 'textInput': 13253 // Record the characters to be added to the DOM. 13254 var chars = nativeEvent.data; // If it's a spacebar character, assume that we have already handled 13255 // it at the keypress level and bail immediately. Android Chrome 13256 // doesn't give us keycodes, so we need to ignore it. 13257 13258 if (chars === SPACEBAR_CHAR && hasSpaceKeypress) { 13259 return null; 13260 } 13261 13262 return chars; 13263 13264 default: 13265 // For other native event types, do nothing. 13266 return null; 13267 } 13268} 13269/** 13270 * For browsers that do not provide the `textInput` event, extract the 13271 * appropriate string to use for SyntheticInputEvent. 13272 */ 13273 13274 13275function getFallbackBeforeInputChars(domEventName, nativeEvent) { 13276 // If we are currently composing (IME) and using a fallback to do so, 13277 // try to extract the composed characters from the fallback object. 13278 // If composition event is available, we extract a string only at 13279 // compositionevent, otherwise extract it at fallback events. 13280 if (isComposing) { 13281 if (domEventName === 'compositionend' || !canUseCompositionEvent && isFallbackCompositionEnd(domEventName, nativeEvent)) { 13282 var chars = getData(); 13283 reset(); 13284 isComposing = false; 13285 return chars; 13286 } 13287 13288 return null; 13289 } 13290 13291 switch (domEventName) { 13292 case 'paste': 13293 // If a paste event occurs after a keypress, throw out the input 13294 // chars. Paste events should not lead to BeforeInput events. 13295 return null; 13296 13297 case 'keypress': 13298 /** 13299 * As of v27, Firefox may fire keypress events even when no character 13300 * will be inserted. A few possibilities: 13301 * 13302 * - `which` is `0`. Arrow keys, Esc key, etc. 13303 * 13304 * - `which` is the pressed key code, but no char is available. 13305 * Ex: 'AltGr + d` in Polish. There is no modified character for 13306 * this key combination and no character is inserted into the 13307 * document, but FF fires the keypress for char code `100` anyway. 13308 * No `input` event will occur. 13309 * 13310 * - `which` is the pressed key code, but a command combination is 13311 * being used. Ex: `Cmd+C`. No character is inserted, and no 13312 * `input` event will occur. 13313 */ 13314 if (!isKeypressCommand(nativeEvent)) { 13315 // IE fires the `keypress` event when a user types an emoji via 13316 // Touch keyboard of Windows. In such a case, the `char` property 13317 // holds an emoji character like `\uD83D\uDE0A`. Because its length 13318 // is 2, the property `which` does not represent an emoji correctly. 13319 // In such a case, we directly return the `char` property instead of 13320 // using `which`. 13321 if (nativeEvent.char && nativeEvent.char.length > 1) { 13322 return nativeEvent.char; 13323 } else if (nativeEvent.which) { 13324 return String.fromCharCode(nativeEvent.which); 13325 } 13326 } 13327 13328 return null; 13329 13330 case 'compositionend': 13331 return useFallbackCompositionData && !isUsingKoreanIME(nativeEvent) ? null : nativeEvent.data; 13332 13333 default: 13334 return null; 13335 } 13336} 13337/** 13338 * Extract a SyntheticInputEvent for `beforeInput`, based on either native 13339 * `textInput` or fallback behavior. 13340 * 13341 * @return {?object} A SyntheticInputEvent. 13342 */ 13343 13344 13345function extractBeforeInputEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget) { 13346 var chars; 13347 13348 if (canUseTextInputEvent) { 13349 chars = getNativeBeforeInputChars(domEventName, nativeEvent); 13350 } else { 13351 chars = getFallbackBeforeInputChars(domEventName, nativeEvent); 13352 } // If no characters are being inserted, no BeforeInput event should 13353 // be fired. 13354 13355 13356 if (!chars) { 13357 return null; 13358 } 13359 13360 var listeners = accumulateTwoPhaseListeners(targetInst, 'onBeforeInput'); 13361 13362 if (listeners.length > 0) { 13363 var event = new SyntheticInputEvent('onBeforeInput', 'beforeinput', null, nativeEvent, nativeEventTarget); 13364 dispatchQueue.push({ 13365 event: event, 13366 listeners: listeners 13367 }); 13368 event.data = chars; 13369 } 13370} 13371/** 13372 * Create an `onBeforeInput` event to match 13373 * http://www.w3.org/TR/2013/WD-DOM-Level-3-Events-20131105/#events-inputevents. 13374 * 13375 * This event plugin is based on the native `textInput` event 13376 * available in Chrome, Safari, Opera, and IE. This event fires after 13377 * `onKeyPress` and `onCompositionEnd`, but before `onInput`. 13378 * 13379 * `beforeInput` is spec'd but not implemented in any browsers, and 13380 * the `input` event does not provide any useful information about what has 13381 * actually been added, contrary to the spec. Thus, `textInput` is the best 13382 * available event to identify the characters that have actually been inserted 13383 * into the target node. 13384 * 13385 * This plugin is also responsible for emitting `composition` events, thus 13386 * allowing us to share composition fallback code for both `beforeInput` and 13387 * `composition` event types. 13388 */ 13389 13390 13391function extractEvents(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) { 13392 extractCompositionEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget); 13393 extractBeforeInputEvent(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget); 13394} 13395 13396/** 13397 * @see http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#input-type-attr-summary 13398 */ 13399var supportedInputTypes = { 13400 color: true, 13401 date: true, 13402 datetime: true, 13403 'datetime-local': true, 13404 email: true, 13405 month: true, 13406 number: true, 13407 password: true, 13408 range: true, 13409 search: true, 13410 tel: true, 13411 text: true, 13412 time: true, 13413 url: true, 13414 week: true 13415}; 13416 13417function isTextInputElement(elem) { 13418 var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); 13419 13420 if (nodeName === 'input') { 13421 return !!supportedInputTypes[elem.type]; 13422 } 13423 13424 if (nodeName === 'textarea') { 13425 return true; 13426 } 13427 13428 return false; 13429} 13430 13431/** 13432 * Checks if an event is supported in the current execution environment. 13433 * 13434 * NOTE: This will not work correctly for non-generic events such as `change`, 13435 * `reset`, `load`, `error`, and `select`. 13436 * 13437 * Borrows from Modernizr. 13438 * 13439 * @param {string} eventNameSuffix Event name, e.g. "click". 13440 * @return {boolean} True if the event is supported. 13441 * @internal 13442 * @license Modernizr 3.0.0pre (Custom Build) | MIT 13443 */ 13444 13445function isEventSupported(eventNameSuffix) { 13446 if (!canUseDOM) { 13447 return false; 13448 } 13449 13450 var eventName = 'on' + eventNameSuffix; 13451 var isSupported = (eventName in document); 13452 13453 if (!isSupported) { 13454 var element = document.createElement('div'); 13455 element.setAttribute(eventName, 'return;'); 13456 isSupported = typeof element[eventName] === 'function'; 13457 } 13458 13459 return isSupported; 13460} 13461 13462function registerEvents$1() { 13463 registerTwoPhaseEvent('onChange', ['change', 'click', 'focusin', 'focusout', 'input', 'keydown', 'keyup', 'selectionchange']); 13464} 13465 13466function createAndAccumulateChangeEvent(dispatchQueue, inst, nativeEvent, target) { 13467 // Flag this event loop as needing state restore. 13468 enqueueStateRestore(target); 13469 var listeners = accumulateTwoPhaseListeners(inst, 'onChange'); 13470 13471 if (listeners.length > 0) { 13472 var event = new SyntheticEvent('onChange', 'change', null, nativeEvent, target); 13473 dispatchQueue.push({ 13474 event: event, 13475 listeners: listeners 13476 }); 13477 } 13478} 13479/** 13480 * For IE shims 13481 */ 13482 13483 13484var activeElement = null; 13485var activeElementInst = null; 13486/** 13487 * SECTION: handle `change` event 13488 */ 13489 13490function shouldUseChangeEvent(elem) { 13491 var nodeName = elem.nodeName && elem.nodeName.toLowerCase(); 13492 return nodeName === 'select' || nodeName === 'input' && elem.type === 'file'; 13493} 13494 13495function manualDispatchChangeEvent(nativeEvent) { 13496 var dispatchQueue = []; 13497 createAndAccumulateChangeEvent(dispatchQueue, activeElementInst, nativeEvent, getEventTarget(nativeEvent)); // If change and propertychange bubbled, we'd just bind to it like all the 13498 // other events and have it go through ReactBrowserEventEmitter. Since it 13499 // doesn't, we manually listen for the events and so we have to enqueue and 13500 // process the abstract event manually. 13501 // 13502 // Batching is necessary here in order to ensure that all event handlers run 13503 // before the next rerender (including event handlers attached to ancestor 13504 // elements instead of directly on the input). Without this, controlled 13505 // components don't work properly in conjunction with event bubbling because 13506 // the component is rerendered and the value reverted before all the event 13507 // handlers can run. See https://github.com/facebook/react/issues/708. 13508 13509 batchedUpdates(runEventInBatch, dispatchQueue); 13510} 13511 13512function runEventInBatch(dispatchQueue) { 13513 processDispatchQueue(dispatchQueue, 0); 13514} 13515 13516function getInstIfValueChanged(targetInst) { 13517 var targetNode = getNodeFromInstance(targetInst); 13518 13519 if (updateValueIfChanged(targetNode)) { 13520 return targetInst; 13521 } 13522} 13523 13524function getTargetInstForChangeEvent(domEventName, targetInst) { 13525 if (domEventName === 'change') { 13526 return targetInst; 13527 } 13528} 13529/** 13530 * SECTION: handle `input` event 13531 */ 13532 13533 13534var isInputEventSupported = false; 13535 13536if (canUseDOM) { 13537 // IE9 claims to support the input event but fails to trigger it when 13538 // deleting text, so we ignore its input events. 13539 isInputEventSupported = isEventSupported('input') && (!document.documentMode || document.documentMode > 9); 13540} 13541/** 13542 * (For IE <=9) Starts tracking propertychange events on the passed-in element 13543 * and override the value property so that we can distinguish user events from 13544 * value changes in JS. 13545 */ 13546 13547 13548function startWatchingForValueChange(target, targetInst) { 13549 activeElement = target; 13550 activeElementInst = targetInst; 13551 activeElement.attachEvent('onpropertychange', handlePropertyChange); 13552} 13553/** 13554 * (For IE <=9) Removes the event listeners from the currently-tracked element, 13555 * if any exists. 13556 */ 13557 13558 13559function stopWatchingForValueChange() { 13560 if (!activeElement) { 13561 return; 13562 } 13563 13564 activeElement.detachEvent('onpropertychange', handlePropertyChange); 13565 activeElement = null; 13566 activeElementInst = null; 13567} 13568/** 13569 * (For IE <=9) Handles a propertychange event, sending a `change` event if 13570 * the value of the active element has changed. 13571 */ 13572 13573 13574function handlePropertyChange(nativeEvent) { 13575 if (nativeEvent.propertyName !== 'value') { 13576 return; 13577 } 13578 13579 if (getInstIfValueChanged(activeElementInst)) { 13580 manualDispatchChangeEvent(nativeEvent); 13581 } 13582} 13583 13584function handleEventsForInputEventPolyfill(domEventName, target, targetInst) { 13585 if (domEventName === 'focusin') { 13586 // In IE9, propertychange fires for most input events but is buggy and 13587 // doesn't fire when text is deleted, but conveniently, selectionchange 13588 // appears to fire in all of the remaining cases so we catch those and 13589 // forward the event if the value has changed 13590 // In either case, we don't want to call the event handler if the value 13591 // is changed from JS so we redefine a setter for `.value` that updates 13592 // our activeElementValue variable, allowing us to ignore those changes 13593 // 13594 // stopWatching() should be a noop here but we call it just in case we 13595 // missed a blur event somehow. 13596 stopWatchingForValueChange(); 13597 startWatchingForValueChange(target, targetInst); 13598 } else if (domEventName === 'focusout') { 13599 stopWatchingForValueChange(); 13600 } 13601} // For IE8 and IE9. 13602 13603 13604function getTargetInstForInputEventPolyfill(domEventName, targetInst) { 13605 if (domEventName === 'selectionchange' || domEventName === 'keyup' || domEventName === 'keydown') { 13606 // On the selectionchange event, the target is just document which isn't 13607 // helpful for us so just check activeElement instead. 13608 // 13609 // 99% of the time, keydown and keyup aren't necessary. IE8 fails to fire 13610 // propertychange on the first input event after setting `value` from a 13611 // script and fires only keydown, keypress, keyup. Catching keyup usually 13612 // gets it and catching keydown lets us fire an event for the first 13613 // keystroke if user does a key repeat (it'll be a little delayed: right 13614 // before the second keystroke). Other input methods (e.g., paste) seem to 13615 // fire selectionchange normally. 13616 return getInstIfValueChanged(activeElementInst); 13617 } 13618} 13619/** 13620 * SECTION: handle `click` event 13621 */ 13622 13623 13624function shouldUseClickEvent(elem) { 13625 // Use the `click` event to detect changes to checkbox and radio inputs. 13626 // This approach works across all browsers, whereas `change` does not fire 13627 // until `blur` in IE8. 13628 var nodeName = elem.nodeName; 13629 return nodeName && nodeName.toLowerCase() === 'input' && (elem.type === 'checkbox' || elem.type === 'radio'); 13630} 13631 13632function getTargetInstForClickEvent(domEventName, targetInst) { 13633 if (domEventName === 'click') { 13634 return getInstIfValueChanged(targetInst); 13635 } 13636} 13637 13638function getTargetInstForInputOrChangeEvent(domEventName, targetInst) { 13639 if (domEventName === 'input' || domEventName === 'change') { 13640 return getInstIfValueChanged(targetInst); 13641 } 13642} 13643 13644function handleControlledInputBlur(node) { 13645 var state = node._wrapperState; 13646 13647 if (!state || !state.controlled || node.type !== 'number') { 13648 return; 13649 } 13650 13651 { 13652 // If controlled, assign the value attribute to the current value on blur 13653 setDefaultValue(node, 'number', node.value); 13654 } 13655} 13656/** 13657 * This plugin creates an `onChange` event that normalizes change events 13658 * across form elements. This event fires at a time when it's possible to 13659 * change the element's value without seeing a flicker. 13660 * 13661 * Supported elements are: 13662 * - input (see `isTextInputElement`) 13663 * - textarea 13664 * - select 13665 */ 13666 13667 13668function extractEvents$1(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) { 13669 var targetNode = targetInst ? getNodeFromInstance(targetInst) : window; 13670 var getTargetInstFunc, handleEventFunc; 13671 13672 if (shouldUseChangeEvent(targetNode)) { 13673 getTargetInstFunc = getTargetInstForChangeEvent; 13674 } else if (isTextInputElement(targetNode)) { 13675 if (isInputEventSupported) { 13676 getTargetInstFunc = getTargetInstForInputOrChangeEvent; 13677 } else { 13678 getTargetInstFunc = getTargetInstForInputEventPolyfill; 13679 handleEventFunc = handleEventsForInputEventPolyfill; 13680 } 13681 } else if (shouldUseClickEvent(targetNode)) { 13682 getTargetInstFunc = getTargetInstForClickEvent; 13683 } 13684 13685 if (getTargetInstFunc) { 13686 var inst = getTargetInstFunc(domEventName, targetInst); 13687 13688 if (inst) { 13689 createAndAccumulateChangeEvent(dispatchQueue, inst, nativeEvent, nativeEventTarget); 13690 return; 13691 } 13692 } 13693 13694 if (handleEventFunc) { 13695 handleEventFunc(domEventName, targetNode, targetInst); 13696 } // When blurring, set the value attribute for number inputs 13697 13698 13699 if (domEventName === 'focusout') { 13700 handleControlledInputBlur(targetNode); 13701 } 13702} 13703 13704function registerEvents$2() { 13705 registerDirectEvent('onMouseEnter', ['mouseout', 'mouseover']); 13706 registerDirectEvent('onMouseLeave', ['mouseout', 'mouseover']); 13707 registerDirectEvent('onPointerEnter', ['pointerout', 'pointerover']); 13708 registerDirectEvent('onPointerLeave', ['pointerout', 'pointerover']); 13709} 13710/** 13711 * For almost every interaction we care about, there will be both a top-level 13712 * `mouseover` and `mouseout` event that occurs. Only use `mouseout` so that 13713 * we do not extract duplicate events. However, moving the mouse into the 13714 * browser from outside will not fire a `mouseout` event. In this case, we use 13715 * the `mouseover` top-level event. 13716 */ 13717 13718 13719function extractEvents$2(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) { 13720 var isOverEvent = domEventName === 'mouseover' || domEventName === 'pointerover'; 13721 var isOutEvent = domEventName === 'mouseout' || domEventName === 'pointerout'; 13722 13723 if (isOverEvent && !isReplayingEvent(nativeEvent)) { 13724 // If this is an over event with a target, we might have already dispatched 13725 // the event in the out event of the other target. If this is replayed, 13726 // then it's because we couldn't dispatch against this target previously 13727 // so we have to do it now instead. 13728 var related = nativeEvent.relatedTarget || nativeEvent.fromElement; 13729 13730 if (related) { 13731 // If the related node is managed by React, we can assume that we have 13732 // already dispatched the corresponding events during its mouseout. 13733 if (getClosestInstanceFromNode(related) || isContainerMarkedAsRoot(related)) { 13734 return; 13735 } 13736 } 13737 } 13738 13739 if (!isOutEvent && !isOverEvent) { 13740 // Must not be a mouse or pointer in or out - ignoring. 13741 return; 13742 } 13743 13744 var win; // TODO: why is this nullable in the types but we read from it? 13745 13746 if (nativeEventTarget.window === nativeEventTarget) { 13747 // `nativeEventTarget` is probably a window object. 13748 win = nativeEventTarget; 13749 } else { 13750 // TODO: Figure out why `ownerDocument` is sometimes undefined in IE8. 13751 var doc = nativeEventTarget.ownerDocument; 13752 13753 if (doc) { 13754 win = doc.defaultView || doc.parentWindow; 13755 } else { 13756 win = window; 13757 } 13758 } 13759 13760 var from; 13761 var to; 13762 13763 if (isOutEvent) { 13764 var _related = nativeEvent.relatedTarget || nativeEvent.toElement; 13765 13766 from = targetInst; 13767 to = _related ? getClosestInstanceFromNode(_related) : null; 13768 13769 if (to !== null) { 13770 var nearestMounted = getNearestMountedFiber(to); 13771 13772 if (to !== nearestMounted || to.tag !== HostComponent && to.tag !== HostText) { 13773 to = null; 13774 } 13775 } 13776 } else { 13777 // Moving to a node from outside the window. 13778 from = null; 13779 to = targetInst; 13780 } 13781 13782 if (from === to) { 13783 // Nothing pertains to our managed components. 13784 return; 13785 } 13786 13787 var SyntheticEventCtor = SyntheticMouseEvent; 13788 var leaveEventType = 'onMouseLeave'; 13789 var enterEventType = 'onMouseEnter'; 13790 var eventTypePrefix = 'mouse'; 13791 13792 if (domEventName === 'pointerout' || domEventName === 'pointerover') { 13793 SyntheticEventCtor = SyntheticPointerEvent; 13794 leaveEventType = 'onPointerLeave'; 13795 enterEventType = 'onPointerEnter'; 13796 eventTypePrefix = 'pointer'; 13797 } 13798 13799 var fromNode = from == null ? win : getNodeFromInstance(from); 13800 var toNode = to == null ? win : getNodeFromInstance(to); 13801 var leave = new SyntheticEventCtor(leaveEventType, eventTypePrefix + 'leave', from, nativeEvent, nativeEventTarget); 13802 leave.target = fromNode; 13803 leave.relatedTarget = toNode; 13804 var enter = null; // We should only process this nativeEvent if we are processing 13805 // the first ancestor. Next time, we will ignore the event. 13806 13807 var nativeTargetInst = getClosestInstanceFromNode(nativeEventTarget); 13808 13809 if (nativeTargetInst === targetInst) { 13810 var enterEvent = new SyntheticEventCtor(enterEventType, eventTypePrefix + 'enter', to, nativeEvent, nativeEventTarget); 13811 enterEvent.target = toNode; 13812 enterEvent.relatedTarget = fromNode; 13813 enter = enterEvent; 13814 } 13815 13816 accumulateEnterLeaveTwoPhaseListeners(dispatchQueue, leave, enter, from, to); 13817} 13818 13819/** 13820 * inlined Object.is polyfill to avoid requiring consumers ship their own 13821 * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is 13822 */ 13823function is(x, y) { 13824 return x === y && (x !== 0 || 1 / x === 1 / y) || x !== x && y !== y // eslint-disable-line no-self-compare 13825 ; 13826} 13827 13828var objectIs = typeof Object.is === 'function' ? Object.is : is; 13829 13830/** 13831 * Performs equality by iterating through keys on an object and returning false 13832 * when any key has values which are not strictly equal between the arguments. 13833 * Returns true when the values of all keys are strictly equal. 13834 */ 13835 13836function shallowEqual(objA, objB) { 13837 if (objectIs(objA, objB)) { 13838 return true; 13839 } 13840 13841 if (typeof objA !== 'object' || objA === null || typeof objB !== 'object' || objB === null) { 13842 return false; 13843 } 13844 13845 var keysA = Object.keys(objA); 13846 var keysB = Object.keys(objB); 13847 13848 if (keysA.length !== keysB.length) { 13849 return false; 13850 } // Test for A's keys different from B. 13851 13852 13853 for (var i = 0; i < keysA.length; i++) { 13854 var currentKey = keysA[i]; 13855 13856 if (!hasOwnProperty.call(objB, currentKey) || !objectIs(objA[currentKey], objB[currentKey])) { 13857 return false; 13858 } 13859 } 13860 13861 return true; 13862} 13863 13864/** 13865 * Given any node return the first leaf node without children. 13866 * 13867 * @param {DOMElement|DOMTextNode} node 13868 * @return {DOMElement|DOMTextNode} 13869 */ 13870 13871function getLeafNode(node) { 13872 while (node && node.firstChild) { 13873 node = node.firstChild; 13874 } 13875 13876 return node; 13877} 13878/** 13879 * Get the next sibling within a container. This will walk up the 13880 * DOM if a node's siblings have been exhausted. 13881 * 13882 * @param {DOMElement|DOMTextNode} node 13883 * @return {?DOMElement|DOMTextNode} 13884 */ 13885 13886 13887function getSiblingNode(node) { 13888 while (node) { 13889 if (node.nextSibling) { 13890 return node.nextSibling; 13891 } 13892 13893 node = node.parentNode; 13894 } 13895} 13896/** 13897 * Get object describing the nodes which contain characters at offset. 13898 * 13899 * @param {DOMElement|DOMTextNode} root 13900 * @param {number} offset 13901 * @return {?object} 13902 */ 13903 13904 13905function getNodeForCharacterOffset(root, offset) { 13906 var node = getLeafNode(root); 13907 var nodeStart = 0; 13908 var nodeEnd = 0; 13909 13910 while (node) { 13911 if (node.nodeType === TEXT_NODE) { 13912 nodeEnd = nodeStart + node.textContent.length; 13913 13914 if (nodeStart <= offset && nodeEnd >= offset) { 13915 return { 13916 node: node, 13917 offset: offset - nodeStart 13918 }; 13919 } 13920 13921 nodeStart = nodeEnd; 13922 } 13923 13924 node = getLeafNode(getSiblingNode(node)); 13925 } 13926} 13927 13928/** 13929 * @param {DOMElement} outerNode 13930 * @return {?object} 13931 */ 13932 13933function getOffsets(outerNode) { 13934 var ownerDocument = outerNode.ownerDocument; 13935 var win = ownerDocument && ownerDocument.defaultView || window; 13936 var selection = win.getSelection && win.getSelection(); 13937 13938 if (!selection || selection.rangeCount === 0) { 13939 return null; 13940 } 13941 13942 var anchorNode = selection.anchorNode, 13943 anchorOffset = selection.anchorOffset, 13944 focusNode = selection.focusNode, 13945 focusOffset = selection.focusOffset; // In Firefox, anchorNode and focusNode can be "anonymous divs", e.g. the 13946 // up/down buttons on an <input type="number">. Anonymous divs do not seem to 13947 // expose properties, triggering a "Permission denied error" if any of its 13948 // properties are accessed. The only seemingly possible way to avoid erroring 13949 // is to access a property that typically works for non-anonymous divs and 13950 // catch any error that may otherwise arise. See 13951 // https://bugzilla.mozilla.org/show_bug.cgi?id=208427 13952 13953 try { 13954 /* eslint-disable no-unused-expressions */ 13955 anchorNode.nodeType; 13956 focusNode.nodeType; 13957 /* eslint-enable no-unused-expressions */ 13958 } catch (e) { 13959 return null; 13960 } 13961 13962 return getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode, focusOffset); 13963} 13964/** 13965 * Returns {start, end} where `start` is the character/codepoint index of 13966 * (anchorNode, anchorOffset) within the textContent of `outerNode`, and 13967 * `end` is the index of (focusNode, focusOffset). 13968 * 13969 * Returns null if you pass in garbage input but we should probably just crash. 13970 * 13971 * Exported only for testing. 13972 */ 13973 13974function getModernOffsetsFromPoints(outerNode, anchorNode, anchorOffset, focusNode, focusOffset) { 13975 var length = 0; 13976 var start = -1; 13977 var end = -1; 13978 var indexWithinAnchor = 0; 13979 var indexWithinFocus = 0; 13980 var node = outerNode; 13981 var parentNode = null; 13982 13983 outer: while (true) { 13984 var next = null; 13985 13986 while (true) { 13987 if (node === anchorNode && (anchorOffset === 0 || node.nodeType === TEXT_NODE)) { 13988 start = length + anchorOffset; 13989 } 13990 13991 if (node === focusNode && (focusOffset === 0 || node.nodeType === TEXT_NODE)) { 13992 end = length + focusOffset; 13993 } 13994 13995 if (node.nodeType === TEXT_NODE) { 13996 length += node.nodeValue.length; 13997 } 13998 13999 if ((next = node.firstChild) === null) { 14000 break; 14001 } // Moving from `node` to its first child `next`. 14002 14003 14004 parentNode = node; 14005 node = next; 14006 } 14007 14008 while (true) { 14009 if (node === outerNode) { 14010 // If `outerNode` has children, this is always the second time visiting 14011 // it. If it has no children, this is still the first loop, and the only 14012 // valid selection is anchorNode and focusNode both equal to this node 14013 // and both offsets 0, in which case we will have handled above. 14014 break outer; 14015 } 14016 14017 if (parentNode === anchorNode && ++indexWithinAnchor === anchorOffset) { 14018 start = length; 14019 } 14020 14021 if (parentNode === focusNode && ++indexWithinFocus === focusOffset) { 14022 end = length; 14023 } 14024 14025 if ((next = node.nextSibling) !== null) { 14026 break; 14027 } 14028 14029 node = parentNode; 14030 parentNode = node.parentNode; 14031 } // Moving from `node` to its next sibling `next`. 14032 14033 14034 node = next; 14035 } 14036 14037 if (start === -1 || end === -1) { 14038 // This should never happen. (Would happen if the anchor/focus nodes aren't 14039 // actually inside the passed-in node.) 14040 return null; 14041 } 14042 14043 return { 14044 start: start, 14045 end: end 14046 }; 14047} 14048/** 14049 * In modern non-IE browsers, we can support both forward and backward 14050 * selections. 14051 * 14052 * Note: IE10+ supports the Selection object, but it does not support 14053 * the `extend` method, which means that even in modern IE, it's not possible 14054 * to programmatically create a backward selection. Thus, for all IE 14055 * versions, we use the old IE API to create our selections. 14056 * 14057 * @param {DOMElement|DOMTextNode} node 14058 * @param {object} offsets 14059 */ 14060 14061function setOffsets(node, offsets) { 14062 var doc = node.ownerDocument || document; 14063 var win = doc && doc.defaultView || window; // Edge fails with "Object expected" in some scenarios. 14064 // (For instance: TinyMCE editor used in a list component that supports pasting to add more, 14065 // fails when pasting 100+ items) 14066 14067 if (!win.getSelection) { 14068 return; 14069 } 14070 14071 var selection = win.getSelection(); 14072 var length = node.textContent.length; 14073 var start = Math.min(offsets.start, length); 14074 var end = offsets.end === undefined ? start : Math.min(offsets.end, length); // IE 11 uses modern selection, but doesn't support the extend method. 14075 // Flip backward selections, so we can set with a single range. 14076 14077 if (!selection.extend && start > end) { 14078 var temp = end; 14079 end = start; 14080 start = temp; 14081 } 14082 14083 var startMarker = getNodeForCharacterOffset(node, start); 14084 var endMarker = getNodeForCharacterOffset(node, end); 14085 14086 if (startMarker && endMarker) { 14087 if (selection.rangeCount === 1 && selection.anchorNode === startMarker.node && selection.anchorOffset === startMarker.offset && selection.focusNode === endMarker.node && selection.focusOffset === endMarker.offset) { 14088 return; 14089 } 14090 14091 var range = doc.createRange(); 14092 range.setStart(startMarker.node, startMarker.offset); 14093 selection.removeAllRanges(); 14094 14095 if (start > end) { 14096 selection.addRange(range); 14097 selection.extend(endMarker.node, endMarker.offset); 14098 } else { 14099 range.setEnd(endMarker.node, endMarker.offset); 14100 selection.addRange(range); 14101 } 14102 } 14103} 14104 14105function isTextNode(node) { 14106 return node && node.nodeType === TEXT_NODE; 14107} 14108 14109function containsNode(outerNode, innerNode) { 14110 if (!outerNode || !innerNode) { 14111 return false; 14112 } else if (outerNode === innerNode) { 14113 return true; 14114 } else if (isTextNode(outerNode)) { 14115 return false; 14116 } else if (isTextNode(innerNode)) { 14117 return containsNode(outerNode, innerNode.parentNode); 14118 } else if ('contains' in outerNode) { 14119 return outerNode.contains(innerNode); 14120 } else if (outerNode.compareDocumentPosition) { 14121 return !!(outerNode.compareDocumentPosition(innerNode) & 16); 14122 } else { 14123 return false; 14124 } 14125} 14126 14127function isInDocument(node) { 14128 return node && node.ownerDocument && containsNode(node.ownerDocument.documentElement, node); 14129} 14130 14131function isSameOriginFrame(iframe) { 14132 try { 14133 // Accessing the contentDocument of a HTMLIframeElement can cause the browser 14134 // to throw, e.g. if it has a cross-origin src attribute. 14135 // Safari will show an error in the console when the access results in "Blocked a frame with origin". e.g: 14136 // iframe.contentDocument.defaultView; 14137 // A safety way is to access one of the cross origin properties: Window or Location 14138 // Which might result in "SecurityError" DOM Exception and it is compatible to Safari. 14139 // https://html.spec.whatwg.org/multipage/browsers.html#integration-with-idl 14140 return typeof iframe.contentWindow.location.href === 'string'; 14141 } catch (err) { 14142 return false; 14143 } 14144} 14145 14146function getActiveElementDeep() { 14147 var win = window; 14148 var element = getActiveElement(); 14149 14150 while (element instanceof win.HTMLIFrameElement) { 14151 if (isSameOriginFrame(element)) { 14152 win = element.contentWindow; 14153 } else { 14154 return element; 14155 } 14156 14157 element = getActiveElement(win.document); 14158 } 14159 14160 return element; 14161} 14162/** 14163 * @ReactInputSelection: React input selection module. Based on Selection.js, 14164 * but modified to be suitable for react and has a couple of bug fixes (doesn't 14165 * assume buttons have range selections allowed). 14166 * Input selection module for React. 14167 */ 14168 14169/** 14170 * @hasSelectionCapabilities: we get the element types that support selection 14171 * from https://html.spec.whatwg.org/#do-not-apply, looking at `selectionStart` 14172 * and `selectionEnd` rows. 14173 */ 14174 14175 14176function hasSelectionCapabilities(elem) { 14177 var nodeName = elem && elem.nodeName && elem.nodeName.toLowerCase(); 14178 return nodeName && (nodeName === 'input' && (elem.type === 'text' || elem.type === 'search' || elem.type === 'tel' || elem.type === 'url' || elem.type === 'password') || nodeName === 'textarea' || elem.contentEditable === 'true'); 14179} 14180function getSelectionInformation() { 14181 var focusedElem = getActiveElementDeep(); 14182 return { 14183 focusedElem: focusedElem, 14184 selectionRange: hasSelectionCapabilities(focusedElem) ? getSelection(focusedElem) : null 14185 }; 14186} 14187/** 14188 * @restoreSelection: If any selection information was potentially lost, 14189 * restore it. This is useful when performing operations that could remove dom 14190 * nodes and place them back in, resulting in focus being lost. 14191 */ 14192 14193function restoreSelection(priorSelectionInformation) { 14194 var curFocusedElem = getActiveElementDeep(); 14195 var priorFocusedElem = priorSelectionInformation.focusedElem; 14196 var priorSelectionRange = priorSelectionInformation.selectionRange; 14197 14198 if (curFocusedElem !== priorFocusedElem && isInDocument(priorFocusedElem)) { 14199 if (priorSelectionRange !== null && hasSelectionCapabilities(priorFocusedElem)) { 14200 setSelection(priorFocusedElem, priorSelectionRange); 14201 } // Focusing a node can change the scroll position, which is undesirable 14202 14203 14204 var ancestors = []; 14205 var ancestor = priorFocusedElem; 14206 14207 while (ancestor = ancestor.parentNode) { 14208 if (ancestor.nodeType === ELEMENT_NODE) { 14209 ancestors.push({ 14210 element: ancestor, 14211 left: ancestor.scrollLeft, 14212 top: ancestor.scrollTop 14213 }); 14214 } 14215 } 14216 14217 if (typeof priorFocusedElem.focus === 'function') { 14218 priorFocusedElem.focus(); 14219 } 14220 14221 for (var i = 0; i < ancestors.length; i++) { 14222 var info = ancestors[i]; 14223 info.element.scrollLeft = info.left; 14224 info.element.scrollTop = info.top; 14225 } 14226 } 14227} 14228/** 14229 * @getSelection: Gets the selection bounds of a focused textarea, input or 14230 * contentEditable node. 14231 * -@input: Look up selection bounds of this input 14232 * -@return {start: selectionStart, end: selectionEnd} 14233 */ 14234 14235function getSelection(input) { 14236 var selection; 14237 14238 if ('selectionStart' in input) { 14239 // Modern browser with input or textarea. 14240 selection = { 14241 start: input.selectionStart, 14242 end: input.selectionEnd 14243 }; 14244 } else { 14245 // Content editable or old IE textarea. 14246 selection = getOffsets(input); 14247 } 14248 14249 return selection || { 14250 start: 0, 14251 end: 0 14252 }; 14253} 14254/** 14255 * @setSelection: Sets the selection bounds of a textarea or input and focuses 14256 * the input. 14257 * -@input Set selection bounds of this input or textarea 14258 * -@offsets Object of same form that is returned from get* 14259 */ 14260 14261function setSelection(input, offsets) { 14262 var start = offsets.start; 14263 var end = offsets.end; 14264 14265 if (end === undefined) { 14266 end = start; 14267 } 14268 14269 if ('selectionStart' in input) { 14270 input.selectionStart = start; 14271 input.selectionEnd = Math.min(end, input.value.length); 14272 } else { 14273 setOffsets(input, offsets); 14274 } 14275} 14276 14277var skipSelectionChangeEvent = canUseDOM && 'documentMode' in document && document.documentMode <= 11; 14278 14279function registerEvents$3() { 14280 registerTwoPhaseEvent('onSelect', ['focusout', 'contextmenu', 'dragend', 'focusin', 'keydown', 'keyup', 'mousedown', 'mouseup', 'selectionchange']); 14281} 14282 14283var activeElement$1 = null; 14284var activeElementInst$1 = null; 14285var lastSelection = null; 14286var mouseDown = false; 14287/** 14288 * Get an object which is a unique representation of the current selection. 14289 * 14290 * The return value will not be consistent across nodes or browsers, but 14291 * two identical selections on the same node will return identical objects. 14292 */ 14293 14294function getSelection$1(node) { 14295 if ('selectionStart' in node && hasSelectionCapabilities(node)) { 14296 return { 14297 start: node.selectionStart, 14298 end: node.selectionEnd 14299 }; 14300 } else { 14301 var win = node.ownerDocument && node.ownerDocument.defaultView || window; 14302 var selection = win.getSelection(); 14303 return { 14304 anchorNode: selection.anchorNode, 14305 anchorOffset: selection.anchorOffset, 14306 focusNode: selection.focusNode, 14307 focusOffset: selection.focusOffset 14308 }; 14309 } 14310} 14311/** 14312 * Get document associated with the event target. 14313 */ 14314 14315 14316function getEventTargetDocument(eventTarget) { 14317 return eventTarget.window === eventTarget ? eventTarget.document : eventTarget.nodeType === DOCUMENT_NODE ? eventTarget : eventTarget.ownerDocument; 14318} 14319/** 14320 * Poll selection to see whether it's changed. 14321 * 14322 * @param {object} nativeEvent 14323 * @param {object} nativeEventTarget 14324 * @return {?SyntheticEvent} 14325 */ 14326 14327 14328function constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget) { 14329 // Ensure we have the right element, and that the user is not dragging a 14330 // selection (this matches native `select` event behavior). In HTML5, select 14331 // fires only on input and textarea thus if there's no focused element we 14332 // won't dispatch. 14333 var doc = getEventTargetDocument(nativeEventTarget); 14334 14335 if (mouseDown || activeElement$1 == null || activeElement$1 !== getActiveElement(doc)) { 14336 return; 14337 } // Only fire when selection has actually changed. 14338 14339 14340 var currentSelection = getSelection$1(activeElement$1); 14341 14342 if (!lastSelection || !shallowEqual(lastSelection, currentSelection)) { 14343 lastSelection = currentSelection; 14344 var listeners = accumulateTwoPhaseListeners(activeElementInst$1, 'onSelect'); 14345 14346 if (listeners.length > 0) { 14347 var event = new SyntheticEvent('onSelect', 'select', null, nativeEvent, nativeEventTarget); 14348 dispatchQueue.push({ 14349 event: event, 14350 listeners: listeners 14351 }); 14352 event.target = activeElement$1; 14353 } 14354 } 14355} 14356/** 14357 * This plugin creates an `onSelect` event that normalizes select events 14358 * across form elements. 14359 * 14360 * Supported elements are: 14361 * - input (see `isTextInputElement`) 14362 * - textarea 14363 * - contentEditable 14364 * 14365 * This differs from native browser implementations in the following ways: 14366 * - Fires on contentEditable fields as well as inputs. 14367 * - Fires for collapsed selection. 14368 * - Fires after user input. 14369 */ 14370 14371 14372function extractEvents$3(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) { 14373 var targetNode = targetInst ? getNodeFromInstance(targetInst) : window; 14374 14375 switch (domEventName) { 14376 // Track the input node that has focus. 14377 case 'focusin': 14378 if (isTextInputElement(targetNode) || targetNode.contentEditable === 'true') { 14379 activeElement$1 = targetNode; 14380 activeElementInst$1 = targetInst; 14381 lastSelection = null; 14382 } 14383 14384 break; 14385 14386 case 'focusout': 14387 activeElement$1 = null; 14388 activeElementInst$1 = null; 14389 lastSelection = null; 14390 break; 14391 // Don't fire the event while the user is dragging. This matches the 14392 // semantics of the native select event. 14393 14394 case 'mousedown': 14395 mouseDown = true; 14396 break; 14397 14398 case 'contextmenu': 14399 case 'mouseup': 14400 case 'dragend': 14401 mouseDown = false; 14402 constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget); 14403 break; 14404 // Chrome and IE fire non-standard event when selection is changed (and 14405 // sometimes when it hasn't). IE's event fires out of order with respect 14406 // to key and input events on deletion, so we discard it. 14407 // 14408 // Firefox doesn't support selectionchange, so check selection status 14409 // after each key entry. The selection changes after keydown and before 14410 // keyup, but we check on keydown as well in the case of holding down a 14411 // key, when multiple keydown events are fired but only one keyup is. 14412 // This is also our approach for IE handling, for the reason above. 14413 14414 case 'selectionchange': 14415 if (skipSelectionChangeEvent) { 14416 break; 14417 } 14418 14419 // falls through 14420 14421 case 'keydown': 14422 case 'keyup': 14423 constructSelectEvent(dispatchQueue, nativeEvent, nativeEventTarget); 14424 } 14425} 14426 14427/** 14428 * Generate a mapping of standard vendor prefixes using the defined style property and event name. 14429 * 14430 * @param {string} styleProp 14431 * @param {string} eventName 14432 * @returns {object} 14433 */ 14434 14435function makePrefixMap(styleProp, eventName) { 14436 var prefixes = {}; 14437 prefixes[styleProp.toLowerCase()] = eventName.toLowerCase(); 14438 prefixes['Webkit' + styleProp] = 'webkit' + eventName; 14439 prefixes['Moz' + styleProp] = 'moz' + eventName; 14440 return prefixes; 14441} 14442/** 14443 * A list of event names to a configurable list of vendor prefixes. 14444 */ 14445 14446 14447var vendorPrefixes = { 14448 animationend: makePrefixMap('Animation', 'AnimationEnd'), 14449 animationiteration: makePrefixMap('Animation', 'AnimationIteration'), 14450 animationstart: makePrefixMap('Animation', 'AnimationStart'), 14451 transitionend: makePrefixMap('Transition', 'TransitionEnd') 14452}; 14453/** 14454 * Event names that have already been detected and prefixed (if applicable). 14455 */ 14456 14457var prefixedEventNames = {}; 14458/** 14459 * Element to check for prefixes on. 14460 */ 14461 14462var style = {}; 14463/** 14464 * Bootstrap if a DOM exists. 14465 */ 14466 14467if (canUseDOM) { 14468 style = document.createElement('div').style; // On some platforms, in particular some releases of Android 4.x, 14469 // the un-prefixed "animation" and "transition" properties are defined on the 14470 // style object but the events that fire will still be prefixed, so we need 14471 // to check if the un-prefixed events are usable, and if not remove them from the map. 14472 14473 if (!('AnimationEvent' in window)) { 14474 delete vendorPrefixes.animationend.animation; 14475 delete vendorPrefixes.animationiteration.animation; 14476 delete vendorPrefixes.animationstart.animation; 14477 } // Same as above 14478 14479 14480 if (!('TransitionEvent' in window)) { 14481 delete vendorPrefixes.transitionend.transition; 14482 } 14483} 14484/** 14485 * Attempts to determine the correct vendor prefixed event name. 14486 * 14487 * @param {string} eventName 14488 * @returns {string} 14489 */ 14490 14491 14492function getVendorPrefixedEventName(eventName) { 14493 if (prefixedEventNames[eventName]) { 14494 return prefixedEventNames[eventName]; 14495 } else if (!vendorPrefixes[eventName]) { 14496 return eventName; 14497 } 14498 14499 var prefixMap = vendorPrefixes[eventName]; 14500 14501 for (var styleProp in prefixMap) { 14502 if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) { 14503 return prefixedEventNames[eventName] = prefixMap[styleProp]; 14504 } 14505 } 14506 14507 return eventName; 14508} 14509 14510var ANIMATION_END = getVendorPrefixedEventName('animationend'); 14511var ANIMATION_ITERATION = getVendorPrefixedEventName('animationiteration'); 14512var ANIMATION_START = getVendorPrefixedEventName('animationstart'); 14513var TRANSITION_END = getVendorPrefixedEventName('transitionend'); 14514 14515var topLevelEventsToReactNames = new Map(); // NOTE: Capitalization is important in this list! 14516// 14517// E.g. it needs "pointerDown", not "pointerdown". 14518// This is because we derive both React name ("onPointerDown") 14519// and DOM name ("pointerdown") from the same list. 14520// 14521// Exceptions that don't match this convention are listed separately. 14522// 14523// prettier-ignore 14524 14525var simpleEventPluginEvents = ['abort', 'auxClick', 'cancel', 'canPlay', 'canPlayThrough', 'click', 'close', 'contextMenu', 'copy', 'cut', 'drag', 'dragEnd', 'dragEnter', 'dragExit', 'dragLeave', 'dragOver', 'dragStart', 'drop', 'durationChange', 'emptied', 'encrypted', 'ended', 'error', 'gotPointerCapture', 'input', 'invalid', 'keyDown', 'keyPress', 'keyUp', 'load', 'loadedData', 'loadedMetadata', 'loadStart', 'lostPointerCapture', 'mouseDown', 'mouseMove', 'mouseOut', 'mouseOver', 'mouseUp', 'paste', 'pause', 'play', 'playing', 'pointerCancel', 'pointerDown', 'pointerMove', 'pointerOut', 'pointerOver', 'pointerUp', 'progress', 'rateChange', 'reset', 'resize', 'seeked', 'seeking', 'stalled', 'submit', 'suspend', 'timeUpdate', 'touchCancel', 'touchEnd', 'touchStart', 'volumeChange', 'scroll', 'toggle', 'touchMove', 'waiting', 'wheel']; 14526 14527function registerSimpleEvent(domEventName, reactName) { 14528 topLevelEventsToReactNames.set(domEventName, reactName); 14529 registerTwoPhaseEvent(reactName, [domEventName]); 14530} 14531 14532function registerSimpleEvents() { 14533 for (var i = 0; i < simpleEventPluginEvents.length; i++) { 14534 var eventName = simpleEventPluginEvents[i]; 14535 var domEventName = eventName.toLowerCase(); 14536 var capitalizedEvent = eventName[0].toUpperCase() + eventName.slice(1); 14537 registerSimpleEvent(domEventName, 'on' + capitalizedEvent); 14538 } // Special cases where event names don't match. 14539 14540 14541 registerSimpleEvent(ANIMATION_END, 'onAnimationEnd'); 14542 registerSimpleEvent(ANIMATION_ITERATION, 'onAnimationIteration'); 14543 registerSimpleEvent(ANIMATION_START, 'onAnimationStart'); 14544 registerSimpleEvent('dblclick', 'onDoubleClick'); 14545 registerSimpleEvent('focusin', 'onFocus'); 14546 registerSimpleEvent('focusout', 'onBlur'); 14547 registerSimpleEvent(TRANSITION_END, 'onTransitionEnd'); 14548} 14549 14550function extractEvents$4(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) { 14551 var reactName = topLevelEventsToReactNames.get(domEventName); 14552 14553 if (reactName === undefined) { 14554 return; 14555 } 14556 14557 var SyntheticEventCtor = SyntheticEvent; 14558 var reactEventType = domEventName; 14559 14560 switch (domEventName) { 14561 case 'keypress': 14562 // Firefox creates a keypress event for function keys too. This removes 14563 // the unwanted keypress events. Enter is however both printable and 14564 // non-printable. One would expect Tab to be as well (but it isn't). 14565 if (getEventCharCode(nativeEvent) === 0) { 14566 return; 14567 } 14568 14569 /* falls through */ 14570 14571 case 'keydown': 14572 case 'keyup': 14573 SyntheticEventCtor = SyntheticKeyboardEvent; 14574 break; 14575 14576 case 'focusin': 14577 reactEventType = 'focus'; 14578 SyntheticEventCtor = SyntheticFocusEvent; 14579 break; 14580 14581 case 'focusout': 14582 reactEventType = 'blur'; 14583 SyntheticEventCtor = SyntheticFocusEvent; 14584 break; 14585 14586 case 'beforeblur': 14587 case 'afterblur': 14588 SyntheticEventCtor = SyntheticFocusEvent; 14589 break; 14590 14591 case 'click': 14592 // Firefox creates a click event on right mouse clicks. This removes the 14593 // unwanted click events. 14594 if (nativeEvent.button === 2) { 14595 return; 14596 } 14597 14598 /* falls through */ 14599 14600 case 'auxclick': 14601 case 'dblclick': 14602 case 'mousedown': 14603 case 'mousemove': 14604 case 'mouseup': // TODO: Disabled elements should not respond to mouse events 14605 14606 /* falls through */ 14607 14608 case 'mouseout': 14609 case 'mouseover': 14610 case 'contextmenu': 14611 SyntheticEventCtor = SyntheticMouseEvent; 14612 break; 14613 14614 case 'drag': 14615 case 'dragend': 14616 case 'dragenter': 14617 case 'dragexit': 14618 case 'dragleave': 14619 case 'dragover': 14620 case 'dragstart': 14621 case 'drop': 14622 SyntheticEventCtor = SyntheticDragEvent; 14623 break; 14624 14625 case 'touchcancel': 14626 case 'touchend': 14627 case 'touchmove': 14628 case 'touchstart': 14629 SyntheticEventCtor = SyntheticTouchEvent; 14630 break; 14631 14632 case ANIMATION_END: 14633 case ANIMATION_ITERATION: 14634 case ANIMATION_START: 14635 SyntheticEventCtor = SyntheticAnimationEvent; 14636 break; 14637 14638 case TRANSITION_END: 14639 SyntheticEventCtor = SyntheticTransitionEvent; 14640 break; 14641 14642 case 'scroll': 14643 SyntheticEventCtor = SyntheticUIEvent; 14644 break; 14645 14646 case 'wheel': 14647 SyntheticEventCtor = SyntheticWheelEvent; 14648 break; 14649 14650 case 'copy': 14651 case 'cut': 14652 case 'paste': 14653 SyntheticEventCtor = SyntheticClipboardEvent; 14654 break; 14655 14656 case 'gotpointercapture': 14657 case 'lostpointercapture': 14658 case 'pointercancel': 14659 case 'pointerdown': 14660 case 'pointermove': 14661 case 'pointerout': 14662 case 'pointerover': 14663 case 'pointerup': 14664 SyntheticEventCtor = SyntheticPointerEvent; 14665 break; 14666 } 14667 14668 var inCapturePhase = (eventSystemFlags & IS_CAPTURE_PHASE) !== 0; 14669 14670 { 14671 // Some events don't bubble in the browser. 14672 // In the past, React has always bubbled them, but this can be surprising. 14673 // We're going to try aligning closer to the browser behavior by not bubbling 14674 // them in React either. We'll start by not bubbling onScroll, and then expand. 14675 var accumulateTargetOnly = !inCapturePhase && // TODO: ideally, we'd eventually add all events from 14676 // nonDelegatedEvents list in DOMPluginEventSystem. 14677 // Then we can remove this special list. 14678 // This is a breaking change that can wait until React 18. 14679 domEventName === 'scroll'; 14680 14681 var _listeners = accumulateSinglePhaseListeners(targetInst, reactName, nativeEvent.type, inCapturePhase, accumulateTargetOnly); 14682 14683 if (_listeners.length > 0) { 14684 // Intentionally create event lazily. 14685 var _event = new SyntheticEventCtor(reactName, reactEventType, null, nativeEvent, nativeEventTarget); 14686 14687 dispatchQueue.push({ 14688 event: _event, 14689 listeners: _listeners 14690 }); 14691 } 14692 } 14693} 14694 14695// TODO: remove top-level side effect. 14696registerSimpleEvents(); 14697registerEvents$2(); 14698registerEvents$1(); 14699registerEvents$3(); 14700registerEvents(); 14701 14702function extractEvents$5(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags, targetContainer) { 14703 // TODO: we should remove the concept of a "SimpleEventPlugin". 14704 // This is the basic functionality of the event system. All 14705 // the other plugins are essentially polyfills. So the plugin 14706 // should probably be inlined somewhere and have its logic 14707 // be core the to event system. This would potentially allow 14708 // us to ship builds of React without the polyfilled plugins below. 14709 extractEvents$4(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags); 14710 var shouldProcessPolyfillPlugins = (eventSystemFlags & SHOULD_NOT_PROCESS_POLYFILL_EVENT_PLUGINS) === 0; // We don't process these events unless we are in the 14711 // event's native "bubble" phase, which means that we're 14712 // not in the capture phase. That's because we emulate 14713 // the capture phase here still. This is a trade-off, 14714 // because in an ideal world we would not emulate and use 14715 // the phases properly, like we do with the SimpleEvent 14716 // plugin. However, the plugins below either expect 14717 // emulation (EnterLeave) or use state localized to that 14718 // plugin (BeforeInput, Change, Select). The state in 14719 // these modules complicates things, as you'll essentially 14720 // get the case where the capture phase event might change 14721 // state, only for the following bubble event to come in 14722 // later and not trigger anything as the state now 14723 // invalidates the heuristics of the event plugin. We 14724 // could alter all these plugins to work in such ways, but 14725 // that might cause other unknown side-effects that we 14726 // can't foresee right now. 14727 14728 if (shouldProcessPolyfillPlugins) { 14729 extractEvents$2(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget); 14730 extractEvents$1(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget); 14731 extractEvents$3(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget); 14732 extractEvents(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget); 14733 } 14734} // List of events that need to be individually attached to media elements. 14735 14736 14737var mediaEventTypes = ['abort', 'canplay', 'canplaythrough', 'durationchange', 'emptied', 'encrypted', 'ended', 'error', 'loadeddata', 'loadedmetadata', 'loadstart', 'pause', 'play', 'playing', 'progress', 'ratechange', 'resize', 'seeked', 'seeking', 'stalled', 'suspend', 'timeupdate', 'volumechange', 'waiting']; // We should not delegate these events to the container, but rather 14738// set them on the actual target element itself. This is primarily 14739// because these events do not consistently bubble in the DOM. 14740 14741var nonDelegatedEvents = new Set(['cancel', 'close', 'invalid', 'load', 'scroll', 'toggle'].concat(mediaEventTypes)); 14742 14743function executeDispatch(event, listener, currentTarget) { 14744 var type = event.type || 'unknown-event'; 14745 event.currentTarget = currentTarget; 14746 invokeGuardedCallbackAndCatchFirstError(type, listener, undefined, event); 14747 event.currentTarget = null; 14748} 14749 14750function processDispatchQueueItemsInOrder(event, dispatchListeners, inCapturePhase) { 14751 var previousInstance; 14752 14753 if (inCapturePhase) { 14754 for (var i = dispatchListeners.length - 1; i >= 0; i--) { 14755 var _dispatchListeners$i = dispatchListeners[i], 14756 instance = _dispatchListeners$i.instance, 14757 currentTarget = _dispatchListeners$i.currentTarget, 14758 listener = _dispatchListeners$i.listener; 14759 14760 if (instance !== previousInstance && event.isPropagationStopped()) { 14761 return; 14762 } 14763 14764 executeDispatch(event, listener, currentTarget); 14765 previousInstance = instance; 14766 } 14767 } else { 14768 for (var _i = 0; _i < dispatchListeners.length; _i++) { 14769 var _dispatchListeners$_i = dispatchListeners[_i], 14770 _instance = _dispatchListeners$_i.instance, 14771 _currentTarget = _dispatchListeners$_i.currentTarget, 14772 _listener = _dispatchListeners$_i.listener; 14773 14774 if (_instance !== previousInstance && event.isPropagationStopped()) { 14775 return; 14776 } 14777 14778 executeDispatch(event, _listener, _currentTarget); 14779 previousInstance = _instance; 14780 } 14781 } 14782} 14783 14784function processDispatchQueue(dispatchQueue, eventSystemFlags) { 14785 var inCapturePhase = (eventSystemFlags & IS_CAPTURE_PHASE) !== 0; 14786 14787 for (var i = 0; i < dispatchQueue.length; i++) { 14788 var _dispatchQueue$i = dispatchQueue[i], 14789 event = _dispatchQueue$i.event, 14790 listeners = _dispatchQueue$i.listeners; 14791 processDispatchQueueItemsInOrder(event, listeners, inCapturePhase); // event system doesn't use pooling. 14792 } // This would be a good time to rethrow if any of the event handlers threw. 14793 14794 14795 rethrowCaughtError(); 14796} 14797 14798function dispatchEventsForPlugins(domEventName, eventSystemFlags, nativeEvent, targetInst, targetContainer) { 14799 var nativeEventTarget = getEventTarget(nativeEvent); 14800 var dispatchQueue = []; 14801 extractEvents$5(dispatchQueue, domEventName, targetInst, nativeEvent, nativeEventTarget, eventSystemFlags); 14802 processDispatchQueue(dispatchQueue, eventSystemFlags); 14803} 14804 14805function listenToNonDelegatedEvent(domEventName, targetElement) { 14806 { 14807 if (!nonDelegatedEvents.has(domEventName)) { 14808 error('Did not expect a listenToNonDelegatedEvent() call for "%s". ' + 'This is a bug in React. Please file an issue.', domEventName); 14809 } 14810 } 14811 14812 var isCapturePhaseListener = false; 14813 var listenerSet = getEventListenerSet(targetElement); 14814 var listenerSetKey = getListenerSetKey(domEventName, isCapturePhaseListener); 14815 14816 if (!listenerSet.has(listenerSetKey)) { 14817 addTrappedEventListener(targetElement, domEventName, IS_NON_DELEGATED, isCapturePhaseListener); 14818 listenerSet.add(listenerSetKey); 14819 } 14820} 14821function listenToNativeEvent(domEventName, isCapturePhaseListener, target) { 14822 { 14823 if (nonDelegatedEvents.has(domEventName) && !isCapturePhaseListener) { 14824 error('Did not expect a listenToNativeEvent() call for "%s" in the bubble phase. ' + 'This is a bug in React. Please file an issue.', domEventName); 14825 } 14826 } 14827 14828 var eventSystemFlags = 0; 14829 14830 if (isCapturePhaseListener) { 14831 eventSystemFlags |= IS_CAPTURE_PHASE; 14832 } 14833 14834 addTrappedEventListener(target, domEventName, eventSystemFlags, isCapturePhaseListener); 14835} // This is only used by createEventHandle when the 14836var listeningMarker = '_reactListening' + Math.random().toString(36).slice(2); 14837function listenToAllSupportedEvents(rootContainerElement) { 14838 if (!rootContainerElement[listeningMarker]) { 14839 rootContainerElement[listeningMarker] = true; 14840 allNativeEvents.forEach(function (domEventName) { 14841 // We handle selectionchange separately because it 14842 // doesn't bubble and needs to be on the document. 14843 if (domEventName !== 'selectionchange') { 14844 if (!nonDelegatedEvents.has(domEventName)) { 14845 listenToNativeEvent(domEventName, false, rootContainerElement); 14846 } 14847 14848 listenToNativeEvent(domEventName, true, rootContainerElement); 14849 } 14850 }); 14851 var ownerDocument = rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument; 14852 14853 if (ownerDocument !== null) { 14854 // The selectionchange event also needs deduplication 14855 // but it is attached to the document. 14856 if (!ownerDocument[listeningMarker]) { 14857 ownerDocument[listeningMarker] = true; 14858 listenToNativeEvent('selectionchange', false, ownerDocument); 14859 } 14860 } 14861 } 14862} 14863 14864function addTrappedEventListener(targetContainer, domEventName, eventSystemFlags, isCapturePhaseListener, isDeferredListenerForLegacyFBSupport) { 14865 var listener = createEventListenerWrapperWithPriority(targetContainer, domEventName, eventSystemFlags); // If passive option is not supported, then the event will be 14866 // active and not passive. 14867 14868 var isPassiveListener = undefined; 14869 14870 if (passiveBrowserEventsSupported) { 14871 // Browsers introduced an intervention, making these events 14872 // passive by default on document. React doesn't bind them 14873 // to document anymore, but changing this now would undo 14874 // the performance wins from the change. So we emulate 14875 // the existing behavior manually on the roots now. 14876 // https://github.com/facebook/react/issues/19651 14877 if (domEventName === 'touchstart' || domEventName === 'touchmove' || domEventName === 'wheel') { 14878 isPassiveListener = true; 14879 } 14880 } 14881 14882 targetContainer = targetContainer; 14883 var unsubscribeListener; // When legacyFBSupport is enabled, it's for when we 14884 14885 14886 if (isCapturePhaseListener) { 14887 if (isPassiveListener !== undefined) { 14888 unsubscribeListener = addEventCaptureListenerWithPassiveFlag(targetContainer, domEventName, listener, isPassiveListener); 14889 } else { 14890 unsubscribeListener = addEventCaptureListener(targetContainer, domEventName, listener); 14891 } 14892 } else { 14893 if (isPassiveListener !== undefined) { 14894 unsubscribeListener = addEventBubbleListenerWithPassiveFlag(targetContainer, domEventName, listener, isPassiveListener); 14895 } else { 14896 unsubscribeListener = addEventBubbleListener(targetContainer, domEventName, listener); 14897 } 14898 } 14899} 14900 14901function isMatchingRootContainer(grandContainer, targetContainer) { 14902 return grandContainer === targetContainer || grandContainer.nodeType === COMMENT_NODE && grandContainer.parentNode === targetContainer; 14903} 14904 14905function dispatchEventForPluginEventSystem(domEventName, eventSystemFlags, nativeEvent, targetInst, targetContainer) { 14906 var ancestorInst = targetInst; 14907 14908 if ((eventSystemFlags & IS_EVENT_HANDLE_NON_MANAGED_NODE) === 0 && (eventSystemFlags & IS_NON_DELEGATED) === 0) { 14909 var targetContainerNode = targetContainer; // If we are using the legacy FB support flag, we 14910 14911 if (targetInst !== null) { 14912 // The below logic attempts to work out if we need to change 14913 // the target fiber to a different ancestor. We had similar logic 14914 // in the legacy event system, except the big difference between 14915 // systems is that the modern event system now has an event listener 14916 // attached to each React Root and React Portal Root. Together, 14917 // the DOM nodes representing these roots are the "rootContainer". 14918 // To figure out which ancestor instance we should use, we traverse 14919 // up the fiber tree from the target instance and attempt to find 14920 // root boundaries that match that of our current "rootContainer". 14921 // If we find that "rootContainer", we find the parent fiber 14922 // sub-tree for that root and make that our ancestor instance. 14923 var node = targetInst; 14924 14925 mainLoop: while (true) { 14926 if (node === null) { 14927 return; 14928 } 14929 14930 var nodeTag = node.tag; 14931 14932 if (nodeTag === HostRoot || nodeTag === HostPortal) { 14933 var container = node.stateNode.containerInfo; 14934 14935 if (isMatchingRootContainer(container, targetContainerNode)) { 14936 break; 14937 } 14938 14939 if (nodeTag === HostPortal) { 14940 // The target is a portal, but it's not the rootContainer we're looking for. 14941 // Normally portals handle their own events all the way down to the root. 14942 // So we should be able to stop now. However, we don't know if this portal 14943 // was part of *our* root. 14944 var grandNode = node.return; 14945 14946 while (grandNode !== null) { 14947 var grandTag = grandNode.tag; 14948 14949 if (grandTag === HostRoot || grandTag === HostPortal) { 14950 var grandContainer = grandNode.stateNode.containerInfo; 14951 14952 if (isMatchingRootContainer(grandContainer, targetContainerNode)) { 14953 // This is the rootContainer we're looking for and we found it as 14954 // a parent of the Portal. That means we can ignore it because the 14955 // Portal will bubble through to us. 14956 return; 14957 } 14958 } 14959 14960 grandNode = grandNode.return; 14961 } 14962 } // Now we need to find it's corresponding host fiber in the other 14963 // tree. To do this we can use getClosestInstanceFromNode, but we 14964 // need to validate that the fiber is a host instance, otherwise 14965 // we need to traverse up through the DOM till we find the correct 14966 // node that is from the other tree. 14967 14968 14969 while (container !== null) { 14970 var parentNode = getClosestInstanceFromNode(container); 14971 14972 if (parentNode === null) { 14973 return; 14974 } 14975 14976 var parentTag = parentNode.tag; 14977 14978 if (parentTag === HostComponent || parentTag === HostText) { 14979 node = ancestorInst = parentNode; 14980 continue mainLoop; 14981 } 14982 14983 container = container.parentNode; 14984 } 14985 } 14986 14987 node = node.return; 14988 } 14989 } 14990 } 14991 14992 batchedUpdates(function () { 14993 return dispatchEventsForPlugins(domEventName, eventSystemFlags, nativeEvent, ancestorInst); 14994 }); 14995} 14996 14997function createDispatchListener(instance, listener, currentTarget) { 14998 return { 14999 instance: instance, 15000 listener: listener, 15001 currentTarget: currentTarget 15002 }; 15003} 15004 15005function accumulateSinglePhaseListeners(targetFiber, reactName, nativeEventType, inCapturePhase, accumulateTargetOnly, nativeEvent) { 15006 var captureName = reactName !== null ? reactName + 'Capture' : null; 15007 var reactEventName = inCapturePhase ? captureName : reactName; 15008 var listeners = []; 15009 var instance = targetFiber; 15010 var lastHostComponent = null; // Accumulate all instances and listeners via the target -> root path. 15011 15012 while (instance !== null) { 15013 var _instance2 = instance, 15014 stateNode = _instance2.stateNode, 15015 tag = _instance2.tag; // Handle listeners that are on HostComponents (i.e. <div>) 15016 15017 if (tag === HostComponent && stateNode !== null) { 15018 lastHostComponent = stateNode; // createEventHandle listeners 15019 15020 15021 if (reactEventName !== null) { 15022 var listener = getListener(instance, reactEventName); 15023 15024 if (listener != null) { 15025 listeners.push(createDispatchListener(instance, listener, lastHostComponent)); 15026 } 15027 } 15028 } // If we are only accumulating events for the target, then we don't 15029 // continue to propagate through the React fiber tree to find other 15030 // listeners. 15031 15032 15033 if (accumulateTargetOnly) { 15034 break; 15035 } // If we are processing the onBeforeBlur event, then we need to take 15036 15037 instance = instance.return; 15038 } 15039 15040 return listeners; 15041} // We should only use this function for: 15042// - BeforeInputEventPlugin 15043// - ChangeEventPlugin 15044// - SelectEventPlugin 15045// This is because we only process these plugins 15046// in the bubble phase, so we need to accumulate two 15047// phase event listeners (via emulation). 15048 15049function accumulateTwoPhaseListeners(targetFiber, reactName) { 15050 var captureName = reactName + 'Capture'; 15051 var listeners = []; 15052 var instance = targetFiber; // Accumulate all instances and listeners via the target -> root path. 15053 15054 while (instance !== null) { 15055 var _instance3 = instance, 15056 stateNode = _instance3.stateNode, 15057 tag = _instance3.tag; // Handle listeners that are on HostComponents (i.e. <div>) 15058 15059 if (tag === HostComponent && stateNode !== null) { 15060 var currentTarget = stateNode; 15061 var captureListener = getListener(instance, captureName); 15062 15063 if (captureListener != null) { 15064 listeners.unshift(createDispatchListener(instance, captureListener, currentTarget)); 15065 } 15066 15067 var bubbleListener = getListener(instance, reactName); 15068 15069 if (bubbleListener != null) { 15070 listeners.push(createDispatchListener(instance, bubbleListener, currentTarget)); 15071 } 15072 } 15073 15074 instance = instance.return; 15075 } 15076 15077 return listeners; 15078} 15079 15080function getParent(inst) { 15081 if (inst === null) { 15082 return null; 15083 } 15084 15085 do { 15086 inst = inst.return; // TODO: If this is a HostRoot we might want to bail out. 15087 // That is depending on if we want nested subtrees (layers) to bubble 15088 // events to their parent. We could also go through parentNode on the 15089 // host node but that wouldn't work for React Native and doesn't let us 15090 // do the portal feature. 15091 } while (inst && inst.tag !== HostComponent); 15092 15093 if (inst) { 15094 return inst; 15095 } 15096 15097 return null; 15098} 15099/** 15100 * Return the lowest common ancestor of A and B, or null if they are in 15101 * different trees. 15102 */ 15103 15104 15105function getLowestCommonAncestor(instA, instB) { 15106 var nodeA = instA; 15107 var nodeB = instB; 15108 var depthA = 0; 15109 15110 for (var tempA = nodeA; tempA; tempA = getParent(tempA)) { 15111 depthA++; 15112 } 15113 15114 var depthB = 0; 15115 15116 for (var tempB = nodeB; tempB; tempB = getParent(tempB)) { 15117 depthB++; 15118 } // If A is deeper, crawl up. 15119 15120 15121 while (depthA - depthB > 0) { 15122 nodeA = getParent(nodeA); 15123 depthA--; 15124 } // If B is deeper, crawl up. 15125 15126 15127 while (depthB - depthA > 0) { 15128 nodeB = getParent(nodeB); 15129 depthB--; 15130 } // Walk in lockstep until we find a match. 15131 15132 15133 var depth = depthA; 15134 15135 while (depth--) { 15136 if (nodeA === nodeB || nodeB !== null && nodeA === nodeB.alternate) { 15137 return nodeA; 15138 } 15139 15140 nodeA = getParent(nodeA); 15141 nodeB = getParent(nodeB); 15142 } 15143 15144 return null; 15145} 15146 15147function accumulateEnterLeaveListenersForEvent(dispatchQueue, event, target, common, inCapturePhase) { 15148 var registrationName = event._reactName; 15149 var listeners = []; 15150 var instance = target; 15151 15152 while (instance !== null) { 15153 if (instance === common) { 15154 break; 15155 } 15156 15157 var _instance4 = instance, 15158 alternate = _instance4.alternate, 15159 stateNode = _instance4.stateNode, 15160 tag = _instance4.tag; 15161 15162 if (alternate !== null && alternate === common) { 15163 break; 15164 } 15165 15166 if (tag === HostComponent && stateNode !== null) { 15167 var currentTarget = stateNode; 15168 15169 if (inCapturePhase) { 15170 var captureListener = getListener(instance, registrationName); 15171 15172 if (captureListener != null) { 15173 listeners.unshift(createDispatchListener(instance, captureListener, currentTarget)); 15174 } 15175 } else if (!inCapturePhase) { 15176 var bubbleListener = getListener(instance, registrationName); 15177 15178 if (bubbleListener != null) { 15179 listeners.push(createDispatchListener(instance, bubbleListener, currentTarget)); 15180 } 15181 } 15182 } 15183 15184 instance = instance.return; 15185 } 15186 15187 if (listeners.length !== 0) { 15188 dispatchQueue.push({ 15189 event: event, 15190 listeners: listeners 15191 }); 15192 } 15193} // We should only use this function for: 15194// - EnterLeaveEventPlugin 15195// This is because we only process this plugin 15196// in the bubble phase, so we need to accumulate two 15197// phase event listeners. 15198 15199 15200function accumulateEnterLeaveTwoPhaseListeners(dispatchQueue, leaveEvent, enterEvent, from, to) { 15201 var common = from && to ? getLowestCommonAncestor(from, to) : null; 15202 15203 if (from !== null) { 15204 accumulateEnterLeaveListenersForEvent(dispatchQueue, leaveEvent, from, common, false); 15205 } 15206 15207 if (to !== null && enterEvent !== null) { 15208 accumulateEnterLeaveListenersForEvent(dispatchQueue, enterEvent, to, common, true); 15209 } 15210} 15211function getListenerSetKey(domEventName, capture) { 15212 return domEventName + "__" + (capture ? 'capture' : 'bubble'); 15213} 15214 15215var didWarnInvalidHydration = false; 15216var DANGEROUSLY_SET_INNER_HTML = 'dangerouslySetInnerHTML'; 15217var SUPPRESS_CONTENT_EDITABLE_WARNING = 'suppressContentEditableWarning'; 15218var SUPPRESS_HYDRATION_WARNING = 'suppressHydrationWarning'; 15219var AUTOFOCUS = 'autoFocus'; 15220var CHILDREN = 'children'; 15221var STYLE = 'style'; 15222var HTML$1 = '__html'; 15223var warnedUnknownTags; 15224var validatePropertiesInDevelopment; 15225var warnForPropDifference; 15226var warnForExtraAttributes; 15227var warnForInvalidEventListener; 15228var canDiffStyleForHydrationWarning; 15229var normalizeHTML; 15230 15231{ 15232 warnedUnknownTags = { 15233 // There are working polyfills for <dialog>. Let people use it. 15234 dialog: true, 15235 // Electron ships a custom <webview> tag to display external web content in 15236 // an isolated frame and process. 15237 // This tag is not present in non Electron environments such as JSDom which 15238 // is often used for testing purposes. 15239 // @see https://electronjs.org/docs/api/webview-tag 15240 webview: true 15241 }; 15242 15243 validatePropertiesInDevelopment = function (type, props) { 15244 validateProperties(type, props); 15245 validateProperties$1(type, props); 15246 validateProperties$2(type, props, { 15247 registrationNameDependencies: registrationNameDependencies, 15248 possibleRegistrationNames: possibleRegistrationNames 15249 }); 15250 }; // IE 11 parses & normalizes the style attribute as opposed to other 15251 // browsers. It adds spaces and sorts the properties in some 15252 // non-alphabetical order. Handling that would require sorting CSS 15253 // properties in the client & server versions or applying 15254 // `expectedStyle` to a temporary DOM node to read its `style` attribute 15255 // normalized. Since it only affects IE, we're skipping style warnings 15256 // in that browser completely in favor of doing all that work. 15257 // See https://github.com/facebook/react/issues/11807 15258 15259 15260 canDiffStyleForHydrationWarning = canUseDOM && !document.documentMode; 15261 15262 warnForPropDifference = function (propName, serverValue, clientValue) { 15263 if (didWarnInvalidHydration) { 15264 return; 15265 } 15266 15267 var normalizedClientValue = normalizeMarkupForTextOrAttribute(clientValue); 15268 var normalizedServerValue = normalizeMarkupForTextOrAttribute(serverValue); 15269 15270 if (normalizedServerValue === normalizedClientValue) { 15271 return; 15272 } 15273 15274 didWarnInvalidHydration = true; 15275 15276 error('Prop `%s` did not match. Server: %s Client: %s', propName, JSON.stringify(normalizedServerValue), JSON.stringify(normalizedClientValue)); 15277 }; 15278 15279 warnForExtraAttributes = function (attributeNames) { 15280 if (didWarnInvalidHydration) { 15281 return; 15282 } 15283 15284 didWarnInvalidHydration = true; 15285 var names = []; 15286 attributeNames.forEach(function (name) { 15287 names.push(name); 15288 }); 15289 15290 error('Extra attributes from the server: %s', names); 15291 }; 15292 15293 warnForInvalidEventListener = function (registrationName, listener) { 15294 if (listener === false) { 15295 error('Expected `%s` listener to be a function, instead got `false`.\n\n' + 'If you used to conditionally omit it with %s={condition && value}, ' + 'pass %s={condition ? value : undefined} instead.', registrationName, registrationName, registrationName); 15296 } else { 15297 error('Expected `%s` listener to be a function, instead got a value of `%s` type.', registrationName, typeof listener); 15298 } 15299 }; // Parse the HTML and read it back to normalize the HTML string so that it 15300 // can be used for comparison. 15301 15302 15303 normalizeHTML = function (parent, html) { 15304 // We could have created a separate document here to avoid 15305 // re-initializing custom elements if they exist. But this breaks 15306 // how <noscript> is being handled. So we use the same document. 15307 // See the discussion in https://github.com/facebook/react/pull/11157. 15308 var testElement = parent.namespaceURI === HTML_NAMESPACE ? parent.ownerDocument.createElement(parent.tagName) : parent.ownerDocument.createElementNS(parent.namespaceURI, parent.tagName); 15309 testElement.innerHTML = html; 15310 return testElement.innerHTML; 15311 }; 15312} // HTML parsing normalizes CR and CRLF to LF. 15313// It also can turn \u0000 into \uFFFD inside attributes. 15314// https://www.w3.org/TR/html5/single-page.html#preprocessing-the-input-stream 15315// If we have a mismatch, it might be caused by that. 15316// We will still patch up in this case but not fire the warning. 15317 15318 15319var NORMALIZE_NEWLINES_REGEX = /\r\n?/g; 15320var NORMALIZE_NULL_AND_REPLACEMENT_REGEX = /\u0000|\uFFFD/g; 15321 15322function normalizeMarkupForTextOrAttribute(markup) { 15323 { 15324 checkHtmlStringCoercion(markup); 15325 } 15326 15327 var markupString = typeof markup === 'string' ? markup : '' + markup; 15328 return markupString.replace(NORMALIZE_NEWLINES_REGEX, '\n').replace(NORMALIZE_NULL_AND_REPLACEMENT_REGEX, ''); 15329} 15330 15331function checkForUnmatchedText(serverText, clientText, isConcurrentMode, shouldWarnDev) { 15332 var normalizedClientText = normalizeMarkupForTextOrAttribute(clientText); 15333 var normalizedServerText = normalizeMarkupForTextOrAttribute(serverText); 15334 15335 if (normalizedServerText === normalizedClientText) { 15336 return; 15337 } 15338 15339 if (shouldWarnDev) { 15340 { 15341 if (!didWarnInvalidHydration) { 15342 didWarnInvalidHydration = true; 15343 15344 error('Text content did not match. Server: "%s" Client: "%s"', normalizedServerText, normalizedClientText); 15345 } 15346 } 15347 } 15348 15349 if (isConcurrentMode && enableClientRenderFallbackOnTextMismatch) { 15350 // In concurrent roots, we throw when there's a text mismatch and revert to 15351 // client rendering, up to the nearest Suspense boundary. 15352 throw new Error('Text content does not match server-rendered HTML.'); 15353 } 15354} 15355 15356function getOwnerDocumentFromRootContainer(rootContainerElement) { 15357 return rootContainerElement.nodeType === DOCUMENT_NODE ? rootContainerElement : rootContainerElement.ownerDocument; 15358} 15359 15360function noop() {} 15361 15362function trapClickOnNonInteractiveElement(node) { 15363 // Mobile Safari does not fire properly bubble click events on 15364 // non-interactive elements, which means delegated click listeners do not 15365 // fire. The workaround for this bug involves attaching an empty click 15366 // listener on the target node. 15367 // https://www.quirksmode.org/blog/archives/2010/09/click_event_del.html 15368 // Just set it using the onclick property so that we don't have to manage any 15369 // bookkeeping for it. Not sure if we need to clear it when the listener is 15370 // removed. 15371 // TODO: Only do this for the relevant Safaris maybe? 15372 node.onclick = noop; 15373} 15374 15375function setInitialDOMProperties(tag, domElement, rootContainerElement, nextProps, isCustomComponentTag) { 15376 for (var propKey in nextProps) { 15377 if (!nextProps.hasOwnProperty(propKey)) { 15378 continue; 15379 } 15380 15381 var nextProp = nextProps[propKey]; 15382 15383 if (propKey === STYLE) { 15384 { 15385 if (nextProp) { 15386 // Freeze the next style object so that we can assume it won't be 15387 // mutated. We have already warned for this in the past. 15388 Object.freeze(nextProp); 15389 } 15390 } // Relies on `updateStylesByID` not mutating `styleUpdates`. 15391 15392 15393 setValueForStyles(domElement, nextProp); 15394 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 15395 var nextHtml = nextProp ? nextProp[HTML$1] : undefined; 15396 15397 if (nextHtml != null) { 15398 setInnerHTML(domElement, nextHtml); 15399 } 15400 } else if (propKey === CHILDREN) { 15401 if (typeof nextProp === 'string') { 15402 // Avoid setting initial textContent when the text is empty. In IE11 setting 15403 // textContent on a <textarea> will cause the placeholder to not 15404 // show within the <textarea> until it has been focused and blurred again. 15405 // https://github.com/facebook/react/issues/6731#issuecomment-254874553 15406 var canSetTextContent = tag !== 'textarea' || nextProp !== ''; 15407 15408 if (canSetTextContent) { 15409 setTextContent(domElement, nextProp); 15410 } 15411 } else if (typeof nextProp === 'number') { 15412 setTextContent(domElement, '' + nextProp); 15413 } 15414 } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (propKey === AUTOFOCUS) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) { 15415 if (nextProp != null) { 15416 if ( typeof nextProp !== 'function') { 15417 warnForInvalidEventListener(propKey, nextProp); 15418 } 15419 15420 if (propKey === 'onScroll') { 15421 listenToNonDelegatedEvent('scroll', domElement); 15422 } 15423 } 15424 } else if (nextProp != null) { 15425 setValueForProperty(domElement, propKey, nextProp, isCustomComponentTag); 15426 } 15427 } 15428} 15429 15430function updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag) { 15431 // TODO: Handle wasCustomComponentTag 15432 for (var i = 0; i < updatePayload.length; i += 2) { 15433 var propKey = updatePayload[i]; 15434 var propValue = updatePayload[i + 1]; 15435 15436 if (propKey === STYLE) { 15437 setValueForStyles(domElement, propValue); 15438 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 15439 setInnerHTML(domElement, propValue); 15440 } else if (propKey === CHILDREN) { 15441 setTextContent(domElement, propValue); 15442 } else { 15443 setValueForProperty(domElement, propKey, propValue, isCustomComponentTag); 15444 } 15445 } 15446} 15447 15448function createElement(type, props, rootContainerElement, parentNamespace) { 15449 var isCustomComponentTag; // We create tags in the namespace of their parent container, except HTML 15450 // tags get no namespace. 15451 15452 var ownerDocument = getOwnerDocumentFromRootContainer(rootContainerElement); 15453 var domElement; 15454 var namespaceURI = parentNamespace; 15455 15456 if (namespaceURI === HTML_NAMESPACE) { 15457 namespaceURI = getIntrinsicNamespace(type); 15458 } 15459 15460 if (namespaceURI === HTML_NAMESPACE) { 15461 { 15462 isCustomComponentTag = isCustomComponent(type, props); // Should this check be gated by parent namespace? Not sure we want to 15463 // allow <SVG> or <mATH>. 15464 15465 if (!isCustomComponentTag && type !== type.toLowerCase()) { 15466 error('<%s /> is using incorrect casing. ' + 'Use PascalCase for React components, ' + 'or lowercase for HTML elements.', type); 15467 } 15468 } 15469 15470 if (type === 'script') { 15471 // Create the script via .innerHTML so its "parser-inserted" flag is 15472 // set to true and it does not execute 15473 var div = ownerDocument.createElement('div'); 15474 15475 div.innerHTML = '<script><' + '/script>'; // eslint-disable-line 15476 // This is guaranteed to yield a script element. 15477 15478 var firstChild = div.firstChild; 15479 domElement = div.removeChild(firstChild); 15480 } else if (typeof props.is === 'string') { 15481 // $FlowIssue `createElement` should be updated for Web Components 15482 domElement = ownerDocument.createElement(type, { 15483 is: props.is 15484 }); 15485 } else { 15486 // Separate else branch instead of using `props.is || undefined` above because of a Firefox bug. 15487 // See discussion in https://github.com/facebook/react/pull/6896 15488 // and discussion in https://bugzilla.mozilla.org/show_bug.cgi?id=1276240 15489 domElement = ownerDocument.createElement(type); // Normally attributes are assigned in `setInitialDOMProperties`, however the `multiple` and `size` 15490 // attributes on `select`s needs to be added before `option`s are inserted. 15491 // This prevents: 15492 // - a bug where the `select` does not scroll to the correct option because singular 15493 // `select` elements automatically pick the first item #13222 15494 // - a bug where the `select` set the first item as selected despite the `size` attribute #14239 15495 // See https://github.com/facebook/react/issues/13222 15496 // and https://github.com/facebook/react/issues/14239 15497 15498 if (type === 'select') { 15499 var node = domElement; 15500 15501 if (props.multiple) { 15502 node.multiple = true; 15503 } else if (props.size) { 15504 // Setting a size greater than 1 causes a select to behave like `multiple=true`, where 15505 // it is possible that no option is selected. 15506 // 15507 // This is only necessary when a select in "single selection mode". 15508 node.size = props.size; 15509 } 15510 } 15511 } 15512 } else { 15513 domElement = ownerDocument.createElementNS(namespaceURI, type); 15514 } 15515 15516 { 15517 if (namespaceURI === HTML_NAMESPACE) { 15518 if (!isCustomComponentTag && Object.prototype.toString.call(domElement) === '[object HTMLUnknownElement]' && !hasOwnProperty.call(warnedUnknownTags, type)) { 15519 warnedUnknownTags[type] = true; 15520 15521 error('The tag <%s> is unrecognized in this browser. ' + 'If you meant to render a React component, start its name with ' + 'an uppercase letter.', type); 15522 } 15523 } 15524 } 15525 15526 return domElement; 15527} 15528function createTextNode(text, rootContainerElement) { 15529 return getOwnerDocumentFromRootContainer(rootContainerElement).createTextNode(text); 15530} 15531function setInitialProperties(domElement, tag, rawProps, rootContainerElement) { 15532 var isCustomComponentTag = isCustomComponent(tag, rawProps); 15533 15534 { 15535 validatePropertiesInDevelopment(tag, rawProps); 15536 } // TODO: Make sure that we check isMounted before firing any of these events. 15537 15538 15539 var props; 15540 15541 switch (tag) { 15542 case 'dialog': 15543 listenToNonDelegatedEvent('cancel', domElement); 15544 listenToNonDelegatedEvent('close', domElement); 15545 props = rawProps; 15546 break; 15547 15548 case 'iframe': 15549 case 'object': 15550 case 'embed': 15551 // We listen to this event in case to ensure emulated bubble 15552 // listeners still fire for the load event. 15553 listenToNonDelegatedEvent('load', domElement); 15554 props = rawProps; 15555 break; 15556 15557 case 'video': 15558 case 'audio': 15559 // We listen to these events in case to ensure emulated bubble 15560 // listeners still fire for all the media events. 15561 for (var i = 0; i < mediaEventTypes.length; i++) { 15562 listenToNonDelegatedEvent(mediaEventTypes[i], domElement); 15563 } 15564 15565 props = rawProps; 15566 break; 15567 15568 case 'source': 15569 // We listen to this event in case to ensure emulated bubble 15570 // listeners still fire for the error event. 15571 listenToNonDelegatedEvent('error', domElement); 15572 props = rawProps; 15573 break; 15574 15575 case 'img': 15576 case 'image': 15577 case 'link': 15578 // We listen to these events in case to ensure emulated bubble 15579 // listeners still fire for error and load events. 15580 listenToNonDelegatedEvent('error', domElement); 15581 listenToNonDelegatedEvent('load', domElement); 15582 props = rawProps; 15583 break; 15584 15585 case 'details': 15586 // We listen to this event in case to ensure emulated bubble 15587 // listeners still fire for the toggle event. 15588 listenToNonDelegatedEvent('toggle', domElement); 15589 props = rawProps; 15590 break; 15591 15592 case 'input': 15593 initWrapperState(domElement, rawProps); 15594 props = getHostProps(domElement, rawProps); // We listen to this event in case to ensure emulated bubble 15595 // listeners still fire for the invalid event. 15596 15597 listenToNonDelegatedEvent('invalid', domElement); 15598 break; 15599 15600 case 'option': 15601 validateProps(domElement, rawProps); 15602 props = rawProps; 15603 break; 15604 15605 case 'select': 15606 initWrapperState$1(domElement, rawProps); 15607 props = getHostProps$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble 15608 // listeners still fire for the invalid event. 15609 15610 listenToNonDelegatedEvent('invalid', domElement); 15611 break; 15612 15613 case 'textarea': 15614 initWrapperState$2(domElement, rawProps); 15615 props = getHostProps$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble 15616 // listeners still fire for the invalid event. 15617 15618 listenToNonDelegatedEvent('invalid', domElement); 15619 break; 15620 15621 default: 15622 props = rawProps; 15623 } 15624 15625 assertValidProps(tag, props); 15626 setInitialDOMProperties(tag, domElement, rootContainerElement, props, isCustomComponentTag); 15627 15628 switch (tag) { 15629 case 'input': 15630 // TODO: Make sure we check if this is still unmounted or do any clean 15631 // up necessary since we never stop tracking anymore. 15632 track(domElement); 15633 postMountWrapper(domElement, rawProps, false); 15634 break; 15635 15636 case 'textarea': 15637 // TODO: Make sure we check if this is still unmounted or do any clean 15638 // up necessary since we never stop tracking anymore. 15639 track(domElement); 15640 postMountWrapper$3(domElement); 15641 break; 15642 15643 case 'option': 15644 postMountWrapper$1(domElement, rawProps); 15645 break; 15646 15647 case 'select': 15648 postMountWrapper$2(domElement, rawProps); 15649 break; 15650 15651 default: 15652 if (typeof props.onClick === 'function') { 15653 // TODO: This cast may not be sound for SVG, MathML or custom elements. 15654 trapClickOnNonInteractiveElement(domElement); 15655 } 15656 15657 break; 15658 } 15659} // Calculate the diff between the two objects. 15660 15661function diffProperties(domElement, tag, lastRawProps, nextRawProps, rootContainerElement) { 15662 { 15663 validatePropertiesInDevelopment(tag, nextRawProps); 15664 } 15665 15666 var updatePayload = null; 15667 var lastProps; 15668 var nextProps; 15669 15670 switch (tag) { 15671 case 'input': 15672 lastProps = getHostProps(domElement, lastRawProps); 15673 nextProps = getHostProps(domElement, nextRawProps); 15674 updatePayload = []; 15675 break; 15676 15677 case 'select': 15678 lastProps = getHostProps$1(domElement, lastRawProps); 15679 nextProps = getHostProps$1(domElement, nextRawProps); 15680 updatePayload = []; 15681 break; 15682 15683 case 'textarea': 15684 lastProps = getHostProps$2(domElement, lastRawProps); 15685 nextProps = getHostProps$2(domElement, nextRawProps); 15686 updatePayload = []; 15687 break; 15688 15689 default: 15690 lastProps = lastRawProps; 15691 nextProps = nextRawProps; 15692 15693 if (typeof lastProps.onClick !== 'function' && typeof nextProps.onClick === 'function') { 15694 // TODO: This cast may not be sound for SVG, MathML or custom elements. 15695 trapClickOnNonInteractiveElement(domElement); 15696 } 15697 15698 break; 15699 } 15700 15701 assertValidProps(tag, nextProps); 15702 var propKey; 15703 var styleName; 15704 var styleUpdates = null; 15705 15706 for (propKey in lastProps) { 15707 if (nextProps.hasOwnProperty(propKey) || !lastProps.hasOwnProperty(propKey) || lastProps[propKey] == null) { 15708 continue; 15709 } 15710 15711 if (propKey === STYLE) { 15712 var lastStyle = lastProps[propKey]; 15713 15714 for (styleName in lastStyle) { 15715 if (lastStyle.hasOwnProperty(styleName)) { 15716 if (!styleUpdates) { 15717 styleUpdates = {}; 15718 } 15719 15720 styleUpdates[styleName] = ''; 15721 } 15722 } 15723 } else if (propKey === DANGEROUSLY_SET_INNER_HTML || propKey === CHILDREN) ; else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (propKey === AUTOFOCUS) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) { 15724 // This is a special case. If any listener updates we need to ensure 15725 // that the "current" fiber pointer gets updated so we need a commit 15726 // to update this element. 15727 if (!updatePayload) { 15728 updatePayload = []; 15729 } 15730 } else { 15731 // For all other deleted properties we add it to the queue. We use 15732 // the allowed property list in the commit phase instead. 15733 (updatePayload = updatePayload || []).push(propKey, null); 15734 } 15735 } 15736 15737 for (propKey in nextProps) { 15738 var nextProp = nextProps[propKey]; 15739 var lastProp = lastProps != null ? lastProps[propKey] : undefined; 15740 15741 if (!nextProps.hasOwnProperty(propKey) || nextProp === lastProp || nextProp == null && lastProp == null) { 15742 continue; 15743 } 15744 15745 if (propKey === STYLE) { 15746 { 15747 if (nextProp) { 15748 // Freeze the next style object so that we can assume it won't be 15749 // mutated. We have already warned for this in the past. 15750 Object.freeze(nextProp); 15751 } 15752 } 15753 15754 if (lastProp) { 15755 // Unset styles on `lastProp` but not on `nextProp`. 15756 for (styleName in lastProp) { 15757 if (lastProp.hasOwnProperty(styleName) && (!nextProp || !nextProp.hasOwnProperty(styleName))) { 15758 if (!styleUpdates) { 15759 styleUpdates = {}; 15760 } 15761 15762 styleUpdates[styleName] = ''; 15763 } 15764 } // Update styles that changed since `lastProp`. 15765 15766 15767 for (styleName in nextProp) { 15768 if (nextProp.hasOwnProperty(styleName) && lastProp[styleName] !== nextProp[styleName]) { 15769 if (!styleUpdates) { 15770 styleUpdates = {}; 15771 } 15772 15773 styleUpdates[styleName] = nextProp[styleName]; 15774 } 15775 } 15776 } else { 15777 // Relies on `updateStylesByID` not mutating `styleUpdates`. 15778 if (!styleUpdates) { 15779 if (!updatePayload) { 15780 updatePayload = []; 15781 } 15782 15783 updatePayload.push(propKey, styleUpdates); 15784 } 15785 15786 styleUpdates = nextProp; 15787 } 15788 } else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 15789 var nextHtml = nextProp ? nextProp[HTML$1] : undefined; 15790 var lastHtml = lastProp ? lastProp[HTML$1] : undefined; 15791 15792 if (nextHtml != null) { 15793 if (lastHtml !== nextHtml) { 15794 (updatePayload = updatePayload || []).push(propKey, nextHtml); 15795 } 15796 } 15797 } else if (propKey === CHILDREN) { 15798 if (typeof nextProp === 'string' || typeof nextProp === 'number') { 15799 (updatePayload = updatePayload || []).push(propKey, '' + nextProp); 15800 } 15801 } else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING) ; else if (registrationNameDependencies.hasOwnProperty(propKey)) { 15802 if (nextProp != null) { 15803 // We eagerly listen to this even though we haven't committed yet. 15804 if ( typeof nextProp !== 'function') { 15805 warnForInvalidEventListener(propKey, nextProp); 15806 } 15807 15808 if (propKey === 'onScroll') { 15809 listenToNonDelegatedEvent('scroll', domElement); 15810 } 15811 } 15812 15813 if (!updatePayload && lastProp !== nextProp) { 15814 // This is a special case. If any listener updates we need to ensure 15815 // that the "current" props pointer gets updated so we need a commit 15816 // to update this element. 15817 updatePayload = []; 15818 } 15819 } else { 15820 // For any other property we always add it to the queue and then we 15821 // filter it out using the allowed property list during the commit. 15822 (updatePayload = updatePayload || []).push(propKey, nextProp); 15823 } 15824 } 15825 15826 if (styleUpdates) { 15827 { 15828 validateShorthandPropertyCollisionInDev(styleUpdates, nextProps[STYLE]); 15829 } 15830 15831 (updatePayload = updatePayload || []).push(STYLE, styleUpdates); 15832 } 15833 15834 return updatePayload; 15835} // Apply the diff. 15836 15837function updateProperties(domElement, updatePayload, tag, lastRawProps, nextRawProps) { 15838 // Update checked *before* name. 15839 // In the middle of an update, it is possible to have multiple checked. 15840 // When a checked radio tries to change name, browser makes another radio's checked false. 15841 if (tag === 'input' && nextRawProps.type === 'radio' && nextRawProps.name != null) { 15842 updateChecked(domElement, nextRawProps); 15843 } 15844 15845 var wasCustomComponentTag = isCustomComponent(tag, lastRawProps); 15846 var isCustomComponentTag = isCustomComponent(tag, nextRawProps); // Apply the diff. 15847 15848 updateDOMProperties(domElement, updatePayload, wasCustomComponentTag, isCustomComponentTag); // TODO: Ensure that an update gets scheduled if any of the special props 15849 // changed. 15850 15851 switch (tag) { 15852 case 'input': 15853 // Update the wrapper around inputs *after* updating props. This has to 15854 // happen after `updateDOMProperties`. Otherwise HTML5 input validations 15855 // raise warnings and prevent the new value from being assigned. 15856 updateWrapper(domElement, nextRawProps); 15857 break; 15858 15859 case 'textarea': 15860 updateWrapper$1(domElement, nextRawProps); 15861 break; 15862 15863 case 'select': 15864 // <select> value update needs to occur after <option> children 15865 // reconciliation 15866 postUpdateWrapper(domElement, nextRawProps); 15867 break; 15868 } 15869} 15870 15871function getPossibleStandardName(propName) { 15872 { 15873 var lowerCasedName = propName.toLowerCase(); 15874 15875 if (!possibleStandardNames.hasOwnProperty(lowerCasedName)) { 15876 return null; 15877 } 15878 15879 return possibleStandardNames[lowerCasedName] || null; 15880 } 15881} 15882 15883function diffHydratedProperties(domElement, tag, rawProps, parentNamespace, rootContainerElement, isConcurrentMode, shouldWarnDev) { 15884 var isCustomComponentTag; 15885 var extraAttributeNames; 15886 15887 { 15888 isCustomComponentTag = isCustomComponent(tag, rawProps); 15889 validatePropertiesInDevelopment(tag, rawProps); 15890 } // TODO: Make sure that we check isMounted before firing any of these events. 15891 15892 15893 switch (tag) { 15894 case 'dialog': 15895 listenToNonDelegatedEvent('cancel', domElement); 15896 listenToNonDelegatedEvent('close', domElement); 15897 break; 15898 15899 case 'iframe': 15900 case 'object': 15901 case 'embed': 15902 // We listen to this event in case to ensure emulated bubble 15903 // listeners still fire for the load event. 15904 listenToNonDelegatedEvent('load', domElement); 15905 break; 15906 15907 case 'video': 15908 case 'audio': 15909 // We listen to these events in case to ensure emulated bubble 15910 // listeners still fire for all the media events. 15911 for (var i = 0; i < mediaEventTypes.length; i++) { 15912 listenToNonDelegatedEvent(mediaEventTypes[i], domElement); 15913 } 15914 15915 break; 15916 15917 case 'source': 15918 // We listen to this event in case to ensure emulated bubble 15919 // listeners still fire for the error event. 15920 listenToNonDelegatedEvent('error', domElement); 15921 break; 15922 15923 case 'img': 15924 case 'image': 15925 case 'link': 15926 // We listen to these events in case to ensure emulated bubble 15927 // listeners still fire for error and load events. 15928 listenToNonDelegatedEvent('error', domElement); 15929 listenToNonDelegatedEvent('load', domElement); 15930 break; 15931 15932 case 'details': 15933 // We listen to this event in case to ensure emulated bubble 15934 // listeners still fire for the toggle event. 15935 listenToNonDelegatedEvent('toggle', domElement); 15936 break; 15937 15938 case 'input': 15939 initWrapperState(domElement, rawProps); // We listen to this event in case to ensure emulated bubble 15940 // listeners still fire for the invalid event. 15941 15942 listenToNonDelegatedEvent('invalid', domElement); 15943 break; 15944 15945 case 'option': 15946 validateProps(domElement, rawProps); 15947 break; 15948 15949 case 'select': 15950 initWrapperState$1(domElement, rawProps); // We listen to this event in case to ensure emulated bubble 15951 // listeners still fire for the invalid event. 15952 15953 listenToNonDelegatedEvent('invalid', domElement); 15954 break; 15955 15956 case 'textarea': 15957 initWrapperState$2(domElement, rawProps); // We listen to this event in case to ensure emulated bubble 15958 // listeners still fire for the invalid event. 15959 15960 listenToNonDelegatedEvent('invalid', domElement); 15961 break; 15962 } 15963 15964 assertValidProps(tag, rawProps); 15965 15966 { 15967 extraAttributeNames = new Set(); 15968 var attributes = domElement.attributes; 15969 15970 for (var _i = 0; _i < attributes.length; _i++) { 15971 var name = attributes[_i].name.toLowerCase(); 15972 15973 switch (name) { 15974 // Controlled attributes are not validated 15975 // TODO: Only ignore them on controlled tags. 15976 case 'value': 15977 break; 15978 15979 case 'checked': 15980 break; 15981 15982 case 'selected': 15983 break; 15984 15985 default: 15986 // Intentionally use the original name. 15987 // See discussion in https://github.com/facebook/react/pull/10676. 15988 extraAttributeNames.add(attributes[_i].name); 15989 } 15990 } 15991 } 15992 15993 var updatePayload = null; 15994 15995 for (var propKey in rawProps) { 15996 if (!rawProps.hasOwnProperty(propKey)) { 15997 continue; 15998 } 15999 16000 var nextProp = rawProps[propKey]; 16001 16002 if (propKey === CHILDREN) { 16003 // For text content children we compare against textContent. This 16004 // might match additional HTML that is hidden when we read it using 16005 // textContent. E.g. "foo" will match "f<span>oo</span>" but that still 16006 // satisfies our requirement. Our requirement is not to produce perfect 16007 // HTML and attributes. Ideally we should preserve structure but it's 16008 // ok not to if the visible content is still enough to indicate what 16009 // even listeners these nodes might be wired up to. 16010 // TODO: Warn if there is more than a single textNode as a child. 16011 // TODO: Should we use domElement.firstChild.nodeValue to compare? 16012 if (typeof nextProp === 'string') { 16013 if (domElement.textContent !== nextProp) { 16014 if (rawProps[SUPPRESS_HYDRATION_WARNING] !== true) { 16015 checkForUnmatchedText(domElement.textContent, nextProp, isConcurrentMode, shouldWarnDev); 16016 } 16017 16018 updatePayload = [CHILDREN, nextProp]; 16019 } 16020 } else if (typeof nextProp === 'number') { 16021 if (domElement.textContent !== '' + nextProp) { 16022 if (rawProps[SUPPRESS_HYDRATION_WARNING] !== true) { 16023 checkForUnmatchedText(domElement.textContent, nextProp, isConcurrentMode, shouldWarnDev); 16024 } 16025 16026 updatePayload = [CHILDREN, '' + nextProp]; 16027 } 16028 } 16029 } else if (registrationNameDependencies.hasOwnProperty(propKey)) { 16030 if (nextProp != null) { 16031 if ( typeof nextProp !== 'function') { 16032 warnForInvalidEventListener(propKey, nextProp); 16033 } 16034 16035 if (propKey === 'onScroll') { 16036 listenToNonDelegatedEvent('scroll', domElement); 16037 } 16038 } 16039 } else if (shouldWarnDev && true && // Convince Flow we've calculated it (it's DEV-only in this method.) 16040 typeof isCustomComponentTag === 'boolean') { 16041 // Validate that the properties correspond to their expected values. 16042 var serverValue = void 0; 16043 var propertyInfo = isCustomComponentTag && enableCustomElementPropertySupport ? null : getPropertyInfo(propKey); 16044 16045 if (rawProps[SUPPRESS_HYDRATION_WARNING] === true) ; else if (propKey === SUPPRESS_CONTENT_EDITABLE_WARNING || propKey === SUPPRESS_HYDRATION_WARNING || // Controlled attributes are not validated 16046 // TODO: Only ignore them on controlled tags. 16047 propKey === 'value' || propKey === 'checked' || propKey === 'selected') ; else if (propKey === DANGEROUSLY_SET_INNER_HTML) { 16048 var serverHTML = domElement.innerHTML; 16049 var nextHtml = nextProp ? nextProp[HTML$1] : undefined; 16050 16051 if (nextHtml != null) { 16052 var expectedHTML = normalizeHTML(domElement, nextHtml); 16053 16054 if (expectedHTML !== serverHTML) { 16055 warnForPropDifference(propKey, serverHTML, expectedHTML); 16056 } 16057 } 16058 } else if (propKey === STYLE) { 16059 // $FlowFixMe - Should be inferred as not undefined. 16060 extraAttributeNames.delete(propKey); 16061 16062 if (canDiffStyleForHydrationWarning) { 16063 var expectedStyle = createDangerousStringForStyles(nextProp); 16064 serverValue = domElement.getAttribute('style'); 16065 16066 if (expectedStyle !== serverValue) { 16067 warnForPropDifference(propKey, serverValue, expectedStyle); 16068 } 16069 } 16070 } else if (isCustomComponentTag && !enableCustomElementPropertySupport) { 16071 // $FlowFixMe - Should be inferred as not undefined. 16072 extraAttributeNames.delete(propKey.toLowerCase()); 16073 serverValue = getValueForAttribute(domElement, propKey, nextProp); 16074 16075 if (nextProp !== serverValue) { 16076 warnForPropDifference(propKey, serverValue, nextProp); 16077 } 16078 } else if (!shouldIgnoreAttribute(propKey, propertyInfo, isCustomComponentTag) && !shouldRemoveAttribute(propKey, nextProp, propertyInfo, isCustomComponentTag)) { 16079 var isMismatchDueToBadCasing = false; 16080 16081 if (propertyInfo !== null) { 16082 // $FlowFixMe - Should be inferred as not undefined. 16083 extraAttributeNames.delete(propertyInfo.attributeName); 16084 serverValue = getValueForProperty(domElement, propKey, nextProp, propertyInfo); 16085 } else { 16086 var ownNamespace = parentNamespace; 16087 16088 if (ownNamespace === HTML_NAMESPACE) { 16089 ownNamespace = getIntrinsicNamespace(tag); 16090 } 16091 16092 if (ownNamespace === HTML_NAMESPACE) { 16093 // $FlowFixMe - Should be inferred as not undefined. 16094 extraAttributeNames.delete(propKey.toLowerCase()); 16095 } else { 16096 var standardName = getPossibleStandardName(propKey); 16097 16098 if (standardName !== null && standardName !== propKey) { 16099 // If an SVG prop is supplied with bad casing, it will 16100 // be successfully parsed from HTML, but will produce a mismatch 16101 // (and would be incorrectly rendered on the client). 16102 // However, we already warn about bad casing elsewhere. 16103 // So we'll skip the misleading extra mismatch warning in this case. 16104 isMismatchDueToBadCasing = true; // $FlowFixMe - Should be inferred as not undefined. 16105 16106 extraAttributeNames.delete(standardName); 16107 } // $FlowFixMe - Should be inferred as not undefined. 16108 16109 16110 extraAttributeNames.delete(propKey); 16111 } 16112 16113 serverValue = getValueForAttribute(domElement, propKey, nextProp); 16114 } 16115 16116 var dontWarnCustomElement = enableCustomElementPropertySupport ; 16117 16118 if (!dontWarnCustomElement && nextProp !== serverValue && !isMismatchDueToBadCasing) { 16119 warnForPropDifference(propKey, serverValue, nextProp); 16120 } 16121 } 16122 } 16123 } 16124 16125 { 16126 if (shouldWarnDev) { 16127 if ( // $FlowFixMe - Should be inferred as not undefined. 16128 extraAttributeNames.size > 0 && rawProps[SUPPRESS_HYDRATION_WARNING] !== true) { 16129 // $FlowFixMe - Should be inferred as not undefined. 16130 warnForExtraAttributes(extraAttributeNames); 16131 } 16132 } 16133 } 16134 16135 switch (tag) { 16136 case 'input': 16137 // TODO: Make sure we check if this is still unmounted or do any clean 16138 // up necessary since we never stop tracking anymore. 16139 track(domElement); 16140 postMountWrapper(domElement, rawProps, true); 16141 break; 16142 16143 case 'textarea': 16144 // TODO: Make sure we check if this is still unmounted or do any clean 16145 // up necessary since we never stop tracking anymore. 16146 track(domElement); 16147 postMountWrapper$3(domElement); 16148 break; 16149 16150 case 'select': 16151 case 'option': 16152 // For input and textarea we current always set the value property at 16153 // post mount to force it to diverge from attributes. However, for 16154 // option and select we don't quite do the same thing and select 16155 // is not resilient to the DOM state changing so we don't do that here. 16156 // TODO: Consider not doing this for input and textarea. 16157 break; 16158 16159 default: 16160 if (typeof rawProps.onClick === 'function') { 16161 // TODO: This cast may not be sound for SVG, MathML or custom elements. 16162 trapClickOnNonInteractiveElement(domElement); 16163 } 16164 16165 break; 16166 } 16167 16168 return updatePayload; 16169} 16170function diffHydratedText(textNode, text, isConcurrentMode) { 16171 var isDifferent = textNode.nodeValue !== text; 16172 return isDifferent; 16173} 16174function warnForDeletedHydratableElement(parentNode, child) { 16175 { 16176 if (didWarnInvalidHydration) { 16177 return; 16178 } 16179 16180 didWarnInvalidHydration = true; 16181 16182 error('Did not expect server HTML to contain a <%s> in <%s>.', child.nodeName.toLowerCase(), parentNode.nodeName.toLowerCase()); 16183 } 16184} 16185function warnForDeletedHydratableText(parentNode, child) { 16186 { 16187 if (didWarnInvalidHydration) { 16188 return; 16189 } 16190 16191 didWarnInvalidHydration = true; 16192 16193 error('Did not expect server HTML to contain the text node "%s" in <%s>.', child.nodeValue, parentNode.nodeName.toLowerCase()); 16194 } 16195} 16196function warnForInsertedHydratedElement(parentNode, tag, props) { 16197 { 16198 if (didWarnInvalidHydration) { 16199 return; 16200 } 16201 16202 didWarnInvalidHydration = true; 16203 16204 error('Expected server HTML to contain a matching <%s> in <%s>.', tag, parentNode.nodeName.toLowerCase()); 16205 } 16206} 16207function warnForInsertedHydratedText(parentNode, text) { 16208 { 16209 if (text === '') { 16210 // We expect to insert empty text nodes since they're not represented in 16211 // the HTML. 16212 // TODO: Remove this special case if we can just avoid inserting empty 16213 // text nodes. 16214 return; 16215 } 16216 16217 if (didWarnInvalidHydration) { 16218 return; 16219 } 16220 16221 didWarnInvalidHydration = true; 16222 16223 error('Expected server HTML to contain a matching text node for "%s" in <%s>.', text, parentNode.nodeName.toLowerCase()); 16224 } 16225} 16226function restoreControlledState$3(domElement, tag, props) { 16227 switch (tag) { 16228 case 'input': 16229 restoreControlledState(domElement, props); 16230 return; 16231 16232 case 'textarea': 16233 restoreControlledState$2(domElement, props); 16234 return; 16235 16236 case 'select': 16237 restoreControlledState$1(domElement, props); 16238 return; 16239 } 16240} 16241 16242var validateDOMNesting = function () {}; 16243 16244var updatedAncestorInfo = function () {}; 16245 16246{ 16247 // This validation code was written based on the HTML5 parsing spec: 16248 // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope 16249 // 16250 // Note: this does not catch all invalid nesting, nor does it try to (as it's 16251 // not clear what practical benefit doing so provides); instead, we warn only 16252 // for cases where the parser will give a parse tree differing from what React 16253 // intended. For example, <b><div></div></b> is invalid but we don't warn 16254 // because it still parses correctly; we do warn for other cases like nested 16255 // <p> tags where the beginning of the second element implicitly closes the 16256 // first, causing a confusing mess. 16257 // https://html.spec.whatwg.org/multipage/syntax.html#special 16258 var specialTags = ['address', 'applet', 'area', 'article', 'aside', 'base', 'basefont', 'bgsound', 'blockquote', 'body', 'br', 'button', 'caption', 'center', 'col', 'colgroup', 'dd', 'details', 'dir', 'div', 'dl', 'dt', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'frame', 'frameset', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'iframe', 'img', 'input', 'isindex', 'li', 'link', 'listing', 'main', 'marquee', 'menu', 'menuitem', 'meta', 'nav', 'noembed', 'noframes', 'noscript', 'object', 'ol', 'p', 'param', 'plaintext', 'pre', 'script', 'section', 'select', 'source', 'style', 'summary', 'table', 'tbody', 'td', 'template', 'textarea', 'tfoot', 'th', 'thead', 'title', 'tr', 'track', 'ul', 'wbr', 'xmp']; // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-scope 16259 16260 var inScopeTags = ['applet', 'caption', 'html', 'table', 'td', 'th', 'marquee', 'object', 'template', // https://html.spec.whatwg.org/multipage/syntax.html#html-integration-point 16261 // TODO: Distinguish by namespace here -- for <title>, including it here 16262 // errs on the side of fewer warnings 16263 'foreignObject', 'desc', 'title']; // https://html.spec.whatwg.org/multipage/syntax.html#has-an-element-in-button-scope 16264 16265 var buttonScopeTags = inScopeTags.concat(['button']); // https://html.spec.whatwg.org/multipage/syntax.html#generate-implied-end-tags 16266 16267 var impliedEndTags = ['dd', 'dt', 'li', 'option', 'optgroup', 'p', 'rp', 'rt']; 16268 var emptyAncestorInfo = { 16269 current: null, 16270 formTag: null, 16271 aTagInScope: null, 16272 buttonTagInScope: null, 16273 nobrTagInScope: null, 16274 pTagInButtonScope: null, 16275 listItemTagAutoclosing: null, 16276 dlItemTagAutoclosing: null 16277 }; 16278 16279 updatedAncestorInfo = function (oldInfo, tag) { 16280 var ancestorInfo = assign({}, oldInfo || emptyAncestorInfo); 16281 16282 var info = { 16283 tag: tag 16284 }; 16285 16286 if (inScopeTags.indexOf(tag) !== -1) { 16287 ancestorInfo.aTagInScope = null; 16288 ancestorInfo.buttonTagInScope = null; 16289 ancestorInfo.nobrTagInScope = null; 16290 } 16291 16292 if (buttonScopeTags.indexOf(tag) !== -1) { 16293 ancestorInfo.pTagInButtonScope = null; 16294 } // See rules for 'li', 'dd', 'dt' start tags in 16295 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody 16296 16297 16298 if (specialTags.indexOf(tag) !== -1 && tag !== 'address' && tag !== 'div' && tag !== 'p') { 16299 ancestorInfo.listItemTagAutoclosing = null; 16300 ancestorInfo.dlItemTagAutoclosing = null; 16301 } 16302 16303 ancestorInfo.current = info; 16304 16305 if (tag === 'form') { 16306 ancestorInfo.formTag = info; 16307 } 16308 16309 if (tag === 'a') { 16310 ancestorInfo.aTagInScope = info; 16311 } 16312 16313 if (tag === 'button') { 16314 ancestorInfo.buttonTagInScope = info; 16315 } 16316 16317 if (tag === 'nobr') { 16318 ancestorInfo.nobrTagInScope = info; 16319 } 16320 16321 if (tag === 'p') { 16322 ancestorInfo.pTagInButtonScope = info; 16323 } 16324 16325 if (tag === 'li') { 16326 ancestorInfo.listItemTagAutoclosing = info; 16327 } 16328 16329 if (tag === 'dd' || tag === 'dt') { 16330 ancestorInfo.dlItemTagAutoclosing = info; 16331 } 16332 16333 return ancestorInfo; 16334 }; 16335 /** 16336 * Returns whether 16337 */ 16338 16339 16340 var isTagValidWithParent = function (tag, parentTag) { 16341 // First, let's check if we're in an unusual parsing mode... 16342 switch (parentTag) { 16343 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inselect 16344 case 'select': 16345 return tag === 'option' || tag === 'optgroup' || tag === '#text'; 16346 16347 case 'optgroup': 16348 return tag === 'option' || tag === '#text'; 16349 // Strictly speaking, seeing an <option> doesn't mean we're in a <select> 16350 // but 16351 16352 case 'option': 16353 return tag === '#text'; 16354 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intd 16355 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incaption 16356 // No special behavior since these rules fall back to "in body" mode for 16357 // all except special table nodes which cause bad parsing behavior anyway. 16358 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intr 16359 16360 case 'tr': 16361 return tag === 'th' || tag === 'td' || tag === 'style' || tag === 'script' || tag === 'template'; 16362 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intbody 16363 16364 case 'tbody': 16365 case 'thead': 16366 case 'tfoot': 16367 return tag === 'tr' || tag === 'style' || tag === 'script' || tag === 'template'; 16368 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-incolgroup 16369 16370 case 'colgroup': 16371 return tag === 'col' || tag === 'template'; 16372 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-intable 16373 16374 case 'table': 16375 return tag === 'caption' || tag === 'colgroup' || tag === 'tbody' || tag === 'tfoot' || tag === 'thead' || tag === 'style' || tag === 'script' || tag === 'template'; 16376 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inhead 16377 16378 case 'head': 16379 return tag === 'base' || tag === 'basefont' || tag === 'bgsound' || tag === 'link' || tag === 'meta' || tag === 'title' || tag === 'noscript' || tag === 'noframes' || tag === 'style' || tag === 'script' || tag === 'template'; 16380 // https://html.spec.whatwg.org/multipage/semantics.html#the-html-element 16381 16382 case 'html': 16383 return tag === 'head' || tag === 'body' || tag === 'frameset'; 16384 16385 case 'frameset': 16386 return tag === 'frame'; 16387 16388 case '#document': 16389 return tag === 'html'; 16390 } // Probably in the "in body" parsing mode, so we outlaw only tag combos 16391 // where the parsing rules cause implicit opens or closes to be added. 16392 // https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody 16393 16394 16395 switch (tag) { 16396 case 'h1': 16397 case 'h2': 16398 case 'h3': 16399 case 'h4': 16400 case 'h5': 16401 case 'h6': 16402 return parentTag !== 'h1' && parentTag !== 'h2' && parentTag !== 'h3' && parentTag !== 'h4' && parentTag !== 'h5' && parentTag !== 'h6'; 16403 16404 case 'rp': 16405 case 'rt': 16406 return impliedEndTags.indexOf(parentTag) === -1; 16407 16408 case 'body': 16409 case 'caption': 16410 case 'col': 16411 case 'colgroup': 16412 case 'frameset': 16413 case 'frame': 16414 case 'head': 16415 case 'html': 16416 case 'tbody': 16417 case 'td': 16418 case 'tfoot': 16419 case 'th': 16420 case 'thead': 16421 case 'tr': 16422 // These tags are only valid with a few parents that have special child 16423 // parsing rules -- if we're down here, then none of those matched and 16424 // so we allow it only if we don't know what the parent is, as all other 16425 // cases are invalid. 16426 return parentTag == null; 16427 } 16428 16429 return true; 16430 }; 16431 /** 16432 * Returns whether 16433 */ 16434 16435 16436 var findInvalidAncestorForTag = function (tag, ancestorInfo) { 16437 switch (tag) { 16438 case 'address': 16439 case 'article': 16440 case 'aside': 16441 case 'blockquote': 16442 case 'center': 16443 case 'details': 16444 case 'dialog': 16445 case 'dir': 16446 case 'div': 16447 case 'dl': 16448 case 'fieldset': 16449 case 'figcaption': 16450 case 'figure': 16451 case 'footer': 16452 case 'header': 16453 case 'hgroup': 16454 case 'main': 16455 case 'menu': 16456 case 'nav': 16457 case 'ol': 16458 case 'p': 16459 case 'section': 16460 case 'summary': 16461 case 'ul': 16462 case 'pre': 16463 case 'listing': 16464 case 'table': 16465 case 'hr': 16466 case 'xmp': 16467 case 'h1': 16468 case 'h2': 16469 case 'h3': 16470 case 'h4': 16471 case 'h5': 16472 case 'h6': 16473 return ancestorInfo.pTagInButtonScope; 16474 16475 case 'form': 16476 return ancestorInfo.formTag || ancestorInfo.pTagInButtonScope; 16477 16478 case 'li': 16479 return ancestorInfo.listItemTagAutoclosing; 16480 16481 case 'dd': 16482 case 'dt': 16483 return ancestorInfo.dlItemTagAutoclosing; 16484 16485 case 'button': 16486 return ancestorInfo.buttonTagInScope; 16487 16488 case 'a': 16489 // Spec says something about storing a list of markers, but it sounds 16490 // equivalent to this check. 16491 return ancestorInfo.aTagInScope; 16492 16493 case 'nobr': 16494 return ancestorInfo.nobrTagInScope; 16495 } 16496 16497 return null; 16498 }; 16499 16500 var didWarn$1 = {}; 16501 16502 validateDOMNesting = function (childTag, childText, ancestorInfo) { 16503 ancestorInfo = ancestorInfo || emptyAncestorInfo; 16504 var parentInfo = ancestorInfo.current; 16505 var parentTag = parentInfo && parentInfo.tag; 16506 16507 if (childText != null) { 16508 if (childTag != null) { 16509 error('validateDOMNesting: when childText is passed, childTag should be null'); 16510 } 16511 16512 childTag = '#text'; 16513 } 16514 16515 var invalidParent = isTagValidWithParent(childTag, parentTag) ? null : parentInfo; 16516 var invalidAncestor = invalidParent ? null : findInvalidAncestorForTag(childTag, ancestorInfo); 16517 var invalidParentOrAncestor = invalidParent || invalidAncestor; 16518 16519 if (!invalidParentOrAncestor) { 16520 return; 16521 } 16522 16523 var ancestorTag = invalidParentOrAncestor.tag; 16524 var warnKey = !!invalidParent + '|' + childTag + '|' + ancestorTag; 16525 16526 if (didWarn$1[warnKey]) { 16527 return; 16528 } 16529 16530 didWarn$1[warnKey] = true; 16531 var tagDisplayName = childTag; 16532 var whitespaceInfo = ''; 16533 16534 if (childTag === '#text') { 16535 if (/\S/.test(childText)) { 16536 tagDisplayName = 'Text nodes'; 16537 } else { 16538 tagDisplayName = 'Whitespace text nodes'; 16539 whitespaceInfo = " Make sure you don't have any extra whitespace between tags on " + 'each line of your source code.'; 16540 } 16541 } else { 16542 tagDisplayName = '<' + childTag + '>'; 16543 } 16544 16545 if (invalidParent) { 16546 var info = ''; 16547 16548 if (ancestorTag === 'table' && childTag === 'tr') { 16549 info += ' Add a <tbody>, <thead> or <tfoot> to your code to match the DOM tree generated by ' + 'the browser.'; 16550 } 16551 16552 error('validateDOMNesting(...): %s cannot appear as a child of <%s>.%s%s', tagDisplayName, ancestorTag, whitespaceInfo, info); 16553 } else { 16554 error('validateDOMNesting(...): %s cannot appear as a descendant of ' + '<%s>.', tagDisplayName, ancestorTag); 16555 } 16556 }; 16557} 16558 16559var SUPPRESS_HYDRATION_WARNING$1 = 'suppressHydrationWarning'; 16560var SUSPENSE_START_DATA = '$'; 16561var SUSPENSE_END_DATA = '/$'; 16562var SUSPENSE_PENDING_START_DATA = '$?'; 16563var SUSPENSE_FALLBACK_START_DATA = '$!'; 16564var STYLE$1 = 'style'; 16565var eventsEnabled = null; 16566var selectionInformation = null; 16567function getRootHostContext(rootContainerInstance) { 16568 var type; 16569 var namespace; 16570 var nodeType = rootContainerInstance.nodeType; 16571 16572 switch (nodeType) { 16573 case DOCUMENT_NODE: 16574 case DOCUMENT_FRAGMENT_NODE: 16575 { 16576 type = nodeType === DOCUMENT_NODE ? '#document' : '#fragment'; 16577 var root = rootContainerInstance.documentElement; 16578 namespace = root ? root.namespaceURI : getChildNamespace(null, ''); 16579 break; 16580 } 16581 16582 default: 16583 { 16584 var container = nodeType === COMMENT_NODE ? rootContainerInstance.parentNode : rootContainerInstance; 16585 var ownNamespace = container.namespaceURI || null; 16586 type = container.tagName; 16587 namespace = getChildNamespace(ownNamespace, type); 16588 break; 16589 } 16590 } 16591 16592 { 16593 var validatedTag = type.toLowerCase(); 16594 var ancestorInfo = updatedAncestorInfo(null, validatedTag); 16595 return { 16596 namespace: namespace, 16597 ancestorInfo: ancestorInfo 16598 }; 16599 } 16600} 16601function getChildHostContext(parentHostContext, type, rootContainerInstance) { 16602 { 16603 var parentHostContextDev = parentHostContext; 16604 var namespace = getChildNamespace(parentHostContextDev.namespace, type); 16605 var ancestorInfo = updatedAncestorInfo(parentHostContextDev.ancestorInfo, type); 16606 return { 16607 namespace: namespace, 16608 ancestorInfo: ancestorInfo 16609 }; 16610 } 16611} 16612function getPublicInstance(instance) { 16613 return instance; 16614} 16615function prepareForCommit(containerInfo) { 16616 eventsEnabled = isEnabled(); 16617 selectionInformation = getSelectionInformation(); 16618 var activeInstance = null; 16619 16620 setEnabled(false); 16621 return activeInstance; 16622} 16623function resetAfterCommit(containerInfo) { 16624 restoreSelection(selectionInformation); 16625 setEnabled(eventsEnabled); 16626 eventsEnabled = null; 16627 selectionInformation = null; 16628} 16629function createInstance(type, props, rootContainerInstance, hostContext, internalInstanceHandle) { 16630 var parentNamespace; 16631 16632 { 16633 // TODO: take namespace into account when validating. 16634 var hostContextDev = hostContext; 16635 validateDOMNesting(type, null, hostContextDev.ancestorInfo); 16636 16637 if (typeof props.children === 'string' || typeof props.children === 'number') { 16638 var string = '' + props.children; 16639 var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type); 16640 validateDOMNesting(null, string, ownAncestorInfo); 16641 } 16642 16643 parentNamespace = hostContextDev.namespace; 16644 } 16645 16646 var domElement = createElement(type, props, rootContainerInstance, parentNamespace); 16647 precacheFiberNode(internalInstanceHandle, domElement); 16648 updateFiberProps(domElement, props); 16649 return domElement; 16650} 16651function appendInitialChild(parentInstance, child) { 16652 parentInstance.appendChild(child); 16653} 16654function finalizeInitialChildren(domElement, type, props, rootContainerInstance, hostContext) { 16655 setInitialProperties(domElement, type, props, rootContainerInstance); 16656 16657 switch (type) { 16658 case 'button': 16659 case 'input': 16660 case 'select': 16661 case 'textarea': 16662 return !!props.autoFocus; 16663 16664 case 'img': 16665 return true; 16666 16667 default: 16668 return false; 16669 } 16670} 16671function prepareUpdate(domElement, type, oldProps, newProps, rootContainerInstance, hostContext) { 16672 { 16673 var hostContextDev = hostContext; 16674 16675 if (typeof newProps.children !== typeof oldProps.children && (typeof newProps.children === 'string' || typeof newProps.children === 'number')) { 16676 var string = '' + newProps.children; 16677 var ownAncestorInfo = updatedAncestorInfo(hostContextDev.ancestorInfo, type); 16678 validateDOMNesting(null, string, ownAncestorInfo); 16679 } 16680 } 16681 16682 return diffProperties(domElement, type, oldProps, newProps); 16683} 16684function shouldSetTextContent(type, props) { 16685 return type === 'textarea' || type === 'noscript' || typeof props.children === 'string' || typeof props.children === 'number' || typeof props.dangerouslySetInnerHTML === 'object' && props.dangerouslySetInnerHTML !== null && props.dangerouslySetInnerHTML.__html != null; 16686} 16687function createTextInstance(text, rootContainerInstance, hostContext, internalInstanceHandle) { 16688 { 16689 var hostContextDev = hostContext; 16690 validateDOMNesting(null, text, hostContextDev.ancestorInfo); 16691 } 16692 16693 var textNode = createTextNode(text, rootContainerInstance); 16694 precacheFiberNode(internalInstanceHandle, textNode); 16695 return textNode; 16696} 16697function getCurrentEventPriority() { 16698 var currentEvent = window.event; 16699 16700 if (currentEvent === undefined) { 16701 return DefaultEventPriority; 16702 } 16703 16704 return getEventPriority(currentEvent.type); 16705} 16706// if a component just imports ReactDOM (e.g. for findDOMNode). 16707// Some environments might not have setTimeout or clearTimeout. 16708 16709var scheduleTimeout = typeof setTimeout === 'function' ? setTimeout : undefined; 16710var cancelTimeout = typeof clearTimeout === 'function' ? clearTimeout : undefined; 16711var noTimeout = -1; 16712var localPromise = typeof Promise === 'function' ? Promise : undefined; // ------------------- 16713var scheduleMicrotask = typeof queueMicrotask === 'function' ? queueMicrotask : typeof localPromise !== 'undefined' ? function (callback) { 16714 return localPromise.resolve(null).then(callback).catch(handleErrorInNextTick); 16715} : scheduleTimeout; // TODO: Determine the best fallback here. 16716 16717function handleErrorInNextTick(error) { 16718 setTimeout(function () { 16719 throw error; 16720 }); 16721} // ------------------- 16722function commitMount(domElement, type, newProps, internalInstanceHandle) { 16723 // Despite the naming that might imply otherwise, this method only 16724 // fires if there is an `Update` effect scheduled during mounting. 16725 // This happens if `finalizeInitialChildren` returns `true` (which it 16726 // does to implement the `autoFocus` attribute on the client). But 16727 // there are also other cases when this might happen (such as patching 16728 // up text content during hydration mismatch). So we'll check this again. 16729 switch (type) { 16730 case 'button': 16731 case 'input': 16732 case 'select': 16733 case 'textarea': 16734 if (newProps.autoFocus) { 16735 domElement.focus(); 16736 } 16737 16738 return; 16739 16740 case 'img': 16741 { 16742 if (newProps.src) { 16743 domElement.src = newProps.src; 16744 } 16745 16746 return; 16747 } 16748 } 16749} 16750function commitUpdate(domElement, updatePayload, type, oldProps, newProps, internalInstanceHandle) { 16751 // Apply the diff to the DOM node. 16752 updateProperties(domElement, updatePayload, type, oldProps, newProps); // Update the props handle so that we know which props are the ones with 16753 // with current event handlers. 16754 16755 updateFiberProps(domElement, newProps); 16756} 16757function resetTextContent(domElement) { 16758 setTextContent(domElement, ''); 16759} 16760function commitTextUpdate(textInstance, oldText, newText) { 16761 textInstance.nodeValue = newText; 16762} 16763function appendChild(parentInstance, child) { 16764 parentInstance.appendChild(child); 16765} 16766function appendChildToContainer(container, child) { 16767 var parentNode; 16768 16769 if (container.nodeType === COMMENT_NODE) { 16770 parentNode = container.parentNode; 16771 parentNode.insertBefore(child, container); 16772 } else { 16773 parentNode = container; 16774 parentNode.appendChild(child); 16775 } // This container might be used for a portal. 16776 // If something inside a portal is clicked, that click should bubble 16777 // through the React tree. However, on Mobile Safari the click would 16778 // never bubble through the *DOM* tree unless an ancestor with onclick 16779 // event exists. So we wouldn't see it and dispatch it. 16780 // This is why we ensure that non React root containers have inline onclick 16781 // defined. 16782 // https://github.com/facebook/react/issues/11918 16783 16784 16785 var reactRootContainer = container._reactRootContainer; 16786 16787 if ((reactRootContainer === null || reactRootContainer === undefined) && parentNode.onclick === null) { 16788 // TODO: This cast may not be sound for SVG, MathML or custom elements. 16789 trapClickOnNonInteractiveElement(parentNode); 16790 } 16791} 16792function insertBefore(parentInstance, child, beforeChild) { 16793 parentInstance.insertBefore(child, beforeChild); 16794} 16795function insertInContainerBefore(container, child, beforeChild) { 16796 if (container.nodeType === COMMENT_NODE) { 16797 container.parentNode.insertBefore(child, beforeChild); 16798 } else { 16799 container.insertBefore(child, beforeChild); 16800 } 16801} 16802 16803function removeChild(parentInstance, child) { 16804 parentInstance.removeChild(child); 16805} 16806function removeChildFromContainer(container, child) { 16807 if (container.nodeType === COMMENT_NODE) { 16808 container.parentNode.removeChild(child); 16809 } else { 16810 container.removeChild(child); 16811 } 16812} 16813function clearSuspenseBoundary(parentInstance, suspenseInstance) { 16814 var node = suspenseInstance; // Delete all nodes within this suspense boundary. 16815 // There might be nested nodes so we need to keep track of how 16816 // deep we are and only break out when we're back on top. 16817 16818 var depth = 0; 16819 16820 do { 16821 var nextNode = node.nextSibling; 16822 parentInstance.removeChild(node); 16823 16824 if (nextNode && nextNode.nodeType === COMMENT_NODE) { 16825 var data = nextNode.data; 16826 16827 if (data === SUSPENSE_END_DATA) { 16828 if (depth === 0) { 16829 parentInstance.removeChild(nextNode); // Retry if any event replaying was blocked on this. 16830 16831 retryIfBlockedOn(suspenseInstance); 16832 return; 16833 } else { 16834 depth--; 16835 } 16836 } else if (data === SUSPENSE_START_DATA || data === SUSPENSE_PENDING_START_DATA || data === SUSPENSE_FALLBACK_START_DATA) { 16837 depth++; 16838 } 16839 } 16840 16841 node = nextNode; 16842 } while (node); // TODO: Warn, we didn't find the end comment boundary. 16843 // Retry if any event replaying was blocked on this. 16844 16845 16846 retryIfBlockedOn(suspenseInstance); 16847} 16848function clearSuspenseBoundaryFromContainer(container, suspenseInstance) { 16849 if (container.nodeType === COMMENT_NODE) { 16850 clearSuspenseBoundary(container.parentNode, suspenseInstance); 16851 } else if (container.nodeType === ELEMENT_NODE) { 16852 clearSuspenseBoundary(container, suspenseInstance); 16853 } // Retry if any event replaying was blocked on this. 16854 16855 16856 retryIfBlockedOn(container); 16857} 16858function hideInstance(instance) { 16859 // TODO: Does this work for all element types? What about MathML? Should we 16860 // pass host context to this method? 16861 instance = instance; 16862 var style = instance.style; 16863 16864 if (typeof style.setProperty === 'function') { 16865 style.setProperty('display', 'none', 'important'); 16866 } else { 16867 style.display = 'none'; 16868 } 16869} 16870function hideTextInstance(textInstance) { 16871 textInstance.nodeValue = ''; 16872} 16873function unhideInstance(instance, props) { 16874 instance = instance; 16875 var styleProp = props[STYLE$1]; 16876 var display = styleProp !== undefined && styleProp !== null && styleProp.hasOwnProperty('display') ? styleProp.display : null; 16877 instance.style.display = dangerousStyleValue('display', display); 16878} 16879function unhideTextInstance(textInstance, text) { 16880 textInstance.nodeValue = text; 16881} 16882function clearContainer(container) { 16883 if (container.nodeType === ELEMENT_NODE) { 16884 container.textContent = ''; 16885 } else if (container.nodeType === DOCUMENT_NODE) { 16886 if (container.documentElement) { 16887 container.removeChild(container.documentElement); 16888 } 16889 } 16890} // ------------------- 16891function canHydrateInstance(instance, type, props) { 16892 if (instance.nodeType !== ELEMENT_NODE || type.toLowerCase() !== instance.nodeName.toLowerCase()) { 16893 return null; 16894 } // This has now been refined to an element node. 16895 16896 16897 return instance; 16898} 16899function canHydrateTextInstance(instance, text) { 16900 if (text === '' || instance.nodeType !== TEXT_NODE) { 16901 // Empty strings are not parsed by HTML so there won't be a correct match here. 16902 return null; 16903 } // This has now been refined to a text node. 16904 16905 16906 return instance; 16907} 16908function canHydrateSuspenseInstance(instance) { 16909 if (instance.nodeType !== COMMENT_NODE) { 16910 // Empty strings are not parsed by HTML so there won't be a correct match here. 16911 return null; 16912 } // This has now been refined to a suspense node. 16913 16914 16915 return instance; 16916} 16917function isSuspenseInstancePending(instance) { 16918 return instance.data === SUSPENSE_PENDING_START_DATA; 16919} 16920function isSuspenseInstanceFallback(instance) { 16921 return instance.data === SUSPENSE_FALLBACK_START_DATA; 16922} 16923function getSuspenseInstanceFallbackErrorDetails(instance) { 16924 var dataset = instance.nextSibling && instance.nextSibling.dataset; 16925 var digest, message, stack; 16926 16927 if (dataset) { 16928 digest = dataset.dgst; 16929 16930 { 16931 message = dataset.msg; 16932 stack = dataset.stck; 16933 } 16934 } 16935 16936 { 16937 return { 16938 message: message, 16939 digest: digest, 16940 stack: stack 16941 }; 16942 } // let value = {message: undefined, hash: undefined}; 16943 // const nextSibling = instance.nextSibling; 16944 // if (nextSibling) { 16945 // const dataset = ((nextSibling: any): HTMLTemplateElement).dataset; 16946 // value.message = dataset.msg; 16947 // value.hash = dataset.hash; 16948 // if (true) { 16949 // value.stack = dataset.stack; 16950 // } 16951 // } 16952 // return value; 16953 16954} 16955function registerSuspenseInstanceRetry(instance, callback) { 16956 instance._reactRetry = callback; 16957} 16958 16959function getNextHydratable(node) { 16960 // Skip non-hydratable nodes. 16961 for (; node != null; node = node.nextSibling) { 16962 var nodeType = node.nodeType; 16963 16964 if (nodeType === ELEMENT_NODE || nodeType === TEXT_NODE) { 16965 break; 16966 } 16967 16968 if (nodeType === COMMENT_NODE) { 16969 var nodeData = node.data; 16970 16971 if (nodeData === SUSPENSE_START_DATA || nodeData === SUSPENSE_FALLBACK_START_DATA || nodeData === SUSPENSE_PENDING_START_DATA) { 16972 break; 16973 } 16974 16975 if (nodeData === SUSPENSE_END_DATA) { 16976 return null; 16977 } 16978 } 16979 } 16980 16981 return node; 16982} 16983 16984function getNextHydratableSibling(instance) { 16985 return getNextHydratable(instance.nextSibling); 16986} 16987function getFirstHydratableChild(parentInstance) { 16988 return getNextHydratable(parentInstance.firstChild); 16989} 16990function getFirstHydratableChildWithinContainer(parentContainer) { 16991 return getNextHydratable(parentContainer.firstChild); 16992} 16993function getFirstHydratableChildWithinSuspenseInstance(parentInstance) { 16994 return getNextHydratable(parentInstance.nextSibling); 16995} 16996function hydrateInstance(instance, type, props, rootContainerInstance, hostContext, internalInstanceHandle, shouldWarnDev) { 16997 precacheFiberNode(internalInstanceHandle, instance); // TODO: Possibly defer this until the commit phase where all the events 16998 // get attached. 16999 17000 updateFiberProps(instance, props); 17001 var parentNamespace; 17002 17003 { 17004 var hostContextDev = hostContext; 17005 parentNamespace = hostContextDev.namespace; 17006 } // TODO: Temporary hack to check if we're in a concurrent root. We can delete 17007 // when the legacy root API is removed. 17008 17009 17010 var isConcurrentMode = (internalInstanceHandle.mode & ConcurrentMode) !== NoMode; 17011 return diffHydratedProperties(instance, type, props, parentNamespace, rootContainerInstance, isConcurrentMode, shouldWarnDev); 17012} 17013function hydrateTextInstance(textInstance, text, internalInstanceHandle, shouldWarnDev) { 17014 precacheFiberNode(internalInstanceHandle, textInstance); // TODO: Temporary hack to check if we're in a concurrent root. We can delete 17015 // when the legacy root API is removed. 17016 17017 var isConcurrentMode = (internalInstanceHandle.mode & ConcurrentMode) !== NoMode; 17018 return diffHydratedText(textInstance, text); 17019} 17020function hydrateSuspenseInstance(suspenseInstance, internalInstanceHandle) { 17021 precacheFiberNode(internalInstanceHandle, suspenseInstance); 17022} 17023function getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance) { 17024 var node = suspenseInstance.nextSibling; // Skip past all nodes within this suspense boundary. 17025 // There might be nested nodes so we need to keep track of how 17026 // deep we are and only break out when we're back on top. 17027 17028 var depth = 0; 17029 17030 while (node) { 17031 if (node.nodeType === COMMENT_NODE) { 17032 var data = node.data; 17033 17034 if (data === SUSPENSE_END_DATA) { 17035 if (depth === 0) { 17036 return getNextHydratableSibling(node); 17037 } else { 17038 depth--; 17039 } 17040 } else if (data === SUSPENSE_START_DATA || data === SUSPENSE_FALLBACK_START_DATA || data === SUSPENSE_PENDING_START_DATA) { 17041 depth++; 17042 } 17043 } 17044 17045 node = node.nextSibling; 17046 } // TODO: Warn, we didn't find the end comment boundary. 17047 17048 17049 return null; 17050} // Returns the SuspenseInstance if this node is a direct child of a 17051// SuspenseInstance. I.e. if its previous sibling is a Comment with 17052// SUSPENSE_x_START_DATA. Otherwise, null. 17053 17054function getParentSuspenseInstance(targetInstance) { 17055 var node = targetInstance.previousSibling; // Skip past all nodes within this suspense boundary. 17056 // There might be nested nodes so we need to keep track of how 17057 // deep we are and only break out when we're back on top. 17058 17059 var depth = 0; 17060 17061 while (node) { 17062 if (node.nodeType === COMMENT_NODE) { 17063 var data = node.data; 17064 17065 if (data === SUSPENSE_START_DATA || data === SUSPENSE_FALLBACK_START_DATA || data === SUSPENSE_PENDING_START_DATA) { 17066 if (depth === 0) { 17067 return node; 17068 } else { 17069 depth--; 17070 } 17071 } else if (data === SUSPENSE_END_DATA) { 17072 depth++; 17073 } 17074 } 17075 17076 node = node.previousSibling; 17077 } 17078 17079 return null; 17080} 17081function commitHydratedContainer(container) { 17082 // Retry if any event replaying was blocked on this. 17083 retryIfBlockedOn(container); 17084} 17085function commitHydratedSuspenseInstance(suspenseInstance) { 17086 // Retry if any event replaying was blocked on this. 17087 retryIfBlockedOn(suspenseInstance); 17088} 17089function shouldDeleteUnhydratedTailInstances(parentType) { 17090 return parentType !== 'head' && parentType !== 'body'; 17091} 17092function didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, text, isConcurrentMode) { 17093 var shouldWarnDev = true; 17094 checkForUnmatchedText(textInstance.nodeValue, text, isConcurrentMode, shouldWarnDev); 17095} 17096function didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, text, isConcurrentMode) { 17097 if (parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) { 17098 var shouldWarnDev = true; 17099 checkForUnmatchedText(textInstance.nodeValue, text, isConcurrentMode, shouldWarnDev); 17100 } 17101} 17102function didNotHydrateInstanceWithinContainer(parentContainer, instance) { 17103 { 17104 if (instance.nodeType === ELEMENT_NODE) { 17105 warnForDeletedHydratableElement(parentContainer, instance); 17106 } else if (instance.nodeType === COMMENT_NODE) ; else { 17107 warnForDeletedHydratableText(parentContainer, instance); 17108 } 17109 } 17110} 17111function didNotHydrateInstanceWithinSuspenseInstance(parentInstance, instance) { 17112 { 17113 // $FlowFixMe: Only Element or Document can be parent nodes. 17114 var parentNode = parentInstance.parentNode; 17115 17116 if (parentNode !== null) { 17117 if (instance.nodeType === ELEMENT_NODE) { 17118 warnForDeletedHydratableElement(parentNode, instance); 17119 } else if (instance.nodeType === COMMENT_NODE) ; else { 17120 warnForDeletedHydratableText(parentNode, instance); 17121 } 17122 } 17123 } 17124} 17125function didNotHydrateInstance(parentType, parentProps, parentInstance, instance, isConcurrentMode) { 17126 { 17127 if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) { 17128 if (instance.nodeType === ELEMENT_NODE) { 17129 warnForDeletedHydratableElement(parentInstance, instance); 17130 } else if (instance.nodeType === COMMENT_NODE) ; else { 17131 warnForDeletedHydratableText(parentInstance, instance); 17132 } 17133 } 17134 } 17135} 17136function didNotFindHydratableInstanceWithinContainer(parentContainer, type, props) { 17137 { 17138 warnForInsertedHydratedElement(parentContainer, type); 17139 } 17140} 17141function didNotFindHydratableTextInstanceWithinContainer(parentContainer, text) { 17142 { 17143 warnForInsertedHydratedText(parentContainer, text); 17144 } 17145} 17146function didNotFindHydratableInstanceWithinSuspenseInstance(parentInstance, type, props) { 17147 { 17148 // $FlowFixMe: Only Element or Document can be parent nodes. 17149 var parentNode = parentInstance.parentNode; 17150 if (parentNode !== null) warnForInsertedHydratedElement(parentNode, type); 17151 } 17152} 17153function didNotFindHydratableTextInstanceWithinSuspenseInstance(parentInstance, text) { 17154 { 17155 // $FlowFixMe: Only Element or Document can be parent nodes. 17156 var parentNode = parentInstance.parentNode; 17157 if (parentNode !== null) warnForInsertedHydratedText(parentNode, text); 17158 } 17159} 17160function didNotFindHydratableInstance(parentType, parentProps, parentInstance, type, props, isConcurrentMode) { 17161 { 17162 if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) { 17163 warnForInsertedHydratedElement(parentInstance, type); 17164 } 17165 } 17166} 17167function didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, text, isConcurrentMode) { 17168 { 17169 if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING$1] !== true) { 17170 warnForInsertedHydratedText(parentInstance, text); 17171 } 17172 } 17173} 17174function errorHydratingContainer(parentContainer) { 17175 { 17176 // TODO: This gets logged by onRecoverableError, too, so we should be 17177 // able to remove it. 17178 error('An error occurred during hydration. The server HTML was replaced with client content in <%s>.', parentContainer.nodeName.toLowerCase()); 17179 } 17180} 17181function preparePortalMount(portalInstance) { 17182 listenToAllSupportedEvents(portalInstance); 17183} 17184 17185var randomKey = Math.random().toString(36).slice(2); 17186var internalInstanceKey = '__reactFiber$' + randomKey; 17187var internalPropsKey = '__reactProps$' + randomKey; 17188var internalContainerInstanceKey = '__reactContainer$' + randomKey; 17189var internalEventHandlersKey = '__reactEvents$' + randomKey; 17190var internalEventHandlerListenersKey = '__reactListeners$' + randomKey; 17191var internalEventHandlesSetKey = '__reactHandles$' + randomKey; 17192function detachDeletedInstance(node) { 17193 // TODO: This function is only called on host components. I don't think all of 17194 // these fields are relevant. 17195 delete node[internalInstanceKey]; 17196 delete node[internalPropsKey]; 17197 delete node[internalEventHandlersKey]; 17198 delete node[internalEventHandlerListenersKey]; 17199 delete node[internalEventHandlesSetKey]; 17200} 17201function precacheFiberNode(hostInst, node) { 17202 node[internalInstanceKey] = hostInst; 17203} 17204function markContainerAsRoot(hostRoot, node) { 17205 node[internalContainerInstanceKey] = hostRoot; 17206} 17207function unmarkContainerAsRoot(node) { 17208 node[internalContainerInstanceKey] = null; 17209} 17210function isContainerMarkedAsRoot(node) { 17211 return !!node[internalContainerInstanceKey]; 17212} // Given a DOM node, return the closest HostComponent or HostText fiber ancestor. 17213// If the target node is part of a hydrated or not yet rendered subtree, then 17214// this may also return a SuspenseComponent or HostRoot to indicate that. 17215// Conceptually the HostRoot fiber is a child of the Container node. So if you 17216// pass the Container node as the targetNode, you will not actually get the 17217// HostRoot back. To get to the HostRoot, you need to pass a child of it. 17218// The same thing applies to Suspense boundaries. 17219 17220function getClosestInstanceFromNode(targetNode) { 17221 var targetInst = targetNode[internalInstanceKey]; 17222 17223 if (targetInst) { 17224 // Don't return HostRoot or SuspenseComponent here. 17225 return targetInst; 17226 } // If the direct event target isn't a React owned DOM node, we need to look 17227 // to see if one of its parents is a React owned DOM node. 17228 17229 17230 var parentNode = targetNode.parentNode; 17231 17232 while (parentNode) { 17233 // We'll check if this is a container root that could include 17234 // React nodes in the future. We need to check this first because 17235 // if we're a child of a dehydrated container, we need to first 17236 // find that inner container before moving on to finding the parent 17237 // instance. Note that we don't check this field on the targetNode 17238 // itself because the fibers are conceptually between the container 17239 // node and the first child. It isn't surrounding the container node. 17240 // If it's not a container, we check if it's an instance. 17241 targetInst = parentNode[internalContainerInstanceKey] || parentNode[internalInstanceKey]; 17242 17243 if (targetInst) { 17244 // Since this wasn't the direct target of the event, we might have 17245 // stepped past dehydrated DOM nodes to get here. However they could 17246 // also have been non-React nodes. We need to answer which one. 17247 // If we the instance doesn't have any children, then there can't be 17248 // a nested suspense boundary within it. So we can use this as a fast 17249 // bailout. Most of the time, when people add non-React children to 17250 // the tree, it is using a ref to a child-less DOM node. 17251 // Normally we'd only need to check one of the fibers because if it 17252 // has ever gone from having children to deleting them or vice versa 17253 // it would have deleted the dehydrated boundary nested inside already. 17254 // However, since the HostRoot starts out with an alternate it might 17255 // have one on the alternate so we need to check in case this was a 17256 // root. 17257 var alternate = targetInst.alternate; 17258 17259 if (targetInst.child !== null || alternate !== null && alternate.child !== null) { 17260 // Next we need to figure out if the node that skipped past is 17261 // nested within a dehydrated boundary and if so, which one. 17262 var suspenseInstance = getParentSuspenseInstance(targetNode); 17263 17264 while (suspenseInstance !== null) { 17265 // We found a suspense instance. That means that we haven't 17266 // hydrated it yet. Even though we leave the comments in the 17267 // DOM after hydrating, and there are boundaries in the DOM 17268 // that could already be hydrated, we wouldn't have found them 17269 // through this pass since if the target is hydrated it would 17270 // have had an internalInstanceKey on it. 17271 // Let's get the fiber associated with the SuspenseComponent 17272 // as the deepest instance. 17273 var targetSuspenseInst = suspenseInstance[internalInstanceKey]; 17274 17275 if (targetSuspenseInst) { 17276 return targetSuspenseInst; 17277 } // If we don't find a Fiber on the comment, it might be because 17278 // we haven't gotten to hydrate it yet. There might still be a 17279 // parent boundary that hasn't above this one so we need to find 17280 // the outer most that is known. 17281 17282 17283 suspenseInstance = getParentSuspenseInstance(suspenseInstance); // If we don't find one, then that should mean that the parent 17284 // host component also hasn't hydrated yet. We can return it 17285 // below since it will bail out on the isMounted check later. 17286 } 17287 } 17288 17289 return targetInst; 17290 } 17291 17292 targetNode = parentNode; 17293 parentNode = targetNode.parentNode; 17294 } 17295 17296 return null; 17297} 17298/** 17299 * Given a DOM node, return the ReactDOMComponent or ReactDOMTextComponent 17300 * instance, or null if the node was not rendered by this React. 17301 */ 17302 17303function getInstanceFromNode(node) { 17304 var inst = node[internalInstanceKey] || node[internalContainerInstanceKey]; 17305 17306 if (inst) { 17307 if (inst.tag === HostComponent || inst.tag === HostText || inst.tag === SuspenseComponent || inst.tag === HostRoot) { 17308 return inst; 17309 } else { 17310 return null; 17311 } 17312 } 17313 17314 return null; 17315} 17316/** 17317 * Given a ReactDOMComponent or ReactDOMTextComponent, return the corresponding 17318 * DOM node. 17319 */ 17320 17321function getNodeFromInstance(inst) { 17322 if (inst.tag === HostComponent || inst.tag === HostText) { 17323 // In Fiber this, is just the state node right now. We assume it will be 17324 // a host component or host text. 17325 return inst.stateNode; 17326 } // Without this first invariant, passing a non-DOM-component triggers the next 17327 // invariant for a missing parent, which is super confusing. 17328 17329 17330 throw new Error('getNodeFromInstance: Invalid argument.'); 17331} 17332function getFiberCurrentPropsFromNode(node) { 17333 return node[internalPropsKey] || null; 17334} 17335function updateFiberProps(node, props) { 17336 node[internalPropsKey] = props; 17337} 17338function getEventListenerSet(node) { 17339 var elementListenerSet = node[internalEventHandlersKey]; 17340 17341 if (elementListenerSet === undefined) { 17342 elementListenerSet = node[internalEventHandlersKey] = new Set(); 17343 } 17344 17345 return elementListenerSet; 17346} 17347 17348var loggedTypeFailures = {}; 17349var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame; 17350 17351function setCurrentlyValidatingElement(element) { 17352 { 17353 if (element) { 17354 var owner = element._owner; 17355 var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null); 17356 ReactDebugCurrentFrame$1.setExtraStackFrame(stack); 17357 } else { 17358 ReactDebugCurrentFrame$1.setExtraStackFrame(null); 17359 } 17360 } 17361} 17362 17363function checkPropTypes(typeSpecs, values, location, componentName, element) { 17364 { 17365 // $FlowFixMe This is okay but Flow doesn't know it. 17366 var has = Function.call.bind(hasOwnProperty); 17367 17368 for (var typeSpecName in typeSpecs) { 17369 if (has(typeSpecs, typeSpecName)) { 17370 var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to 17371 // fail the render phase where it didn't fail before. So we log it. 17372 // After these have been cleaned up, we'll let them throw. 17373 17374 try { 17375 // This is intentionally an invariant that gets caught. It's the same 17376 // behavior as without this statement except with a better message. 17377 if (typeof typeSpecs[typeSpecName] !== 'function') { 17378 // eslint-disable-next-line react-internal/prod-error-codes 17379 var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.'); 17380 err.name = 'Invariant Violation'; 17381 throw err; 17382 } 17383 17384 error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'); 17385 } catch (ex) { 17386 error$1 = ex; 17387 } 17388 17389 if (error$1 && !(error$1 instanceof Error)) { 17390 setCurrentlyValidatingElement(element); 17391 17392 error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1); 17393 17394 setCurrentlyValidatingElement(null); 17395 } 17396 17397 if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) { 17398 // Only monitor this failure once because there tends to be a lot of the 17399 // same error. 17400 loggedTypeFailures[error$1.message] = true; 17401 setCurrentlyValidatingElement(element); 17402 17403 error('Failed %s type: %s', location, error$1.message); 17404 17405 setCurrentlyValidatingElement(null); 17406 } 17407 } 17408 } 17409 } 17410} 17411 17412var valueStack = []; 17413var fiberStack; 17414 17415{ 17416 fiberStack = []; 17417} 17418 17419var index = -1; 17420 17421function createCursor(defaultValue) { 17422 return { 17423 current: defaultValue 17424 }; 17425} 17426 17427function pop(cursor, fiber) { 17428 if (index < 0) { 17429 { 17430 error('Unexpected pop.'); 17431 } 17432 17433 return; 17434 } 17435 17436 { 17437 if (fiber !== fiberStack[index]) { 17438 error('Unexpected Fiber popped.'); 17439 } 17440 } 17441 17442 cursor.current = valueStack[index]; 17443 valueStack[index] = null; 17444 17445 { 17446 fiberStack[index] = null; 17447 } 17448 17449 index--; 17450} 17451 17452function push(cursor, value, fiber) { 17453 index++; 17454 valueStack[index] = cursor.current; 17455 17456 { 17457 fiberStack[index] = fiber; 17458 } 17459 17460 cursor.current = value; 17461} 17462 17463var warnedAboutMissingGetChildContext; 17464 17465{ 17466 warnedAboutMissingGetChildContext = {}; 17467} 17468 17469var emptyContextObject = {}; 17470 17471{ 17472 Object.freeze(emptyContextObject); 17473} // A cursor to the current merged context object on the stack. 17474 17475 17476var contextStackCursor = createCursor(emptyContextObject); // A cursor to a boolean indicating whether the context has changed. 17477 17478var didPerformWorkStackCursor = createCursor(false); // Keep track of the previous context object that was on the stack. 17479// We use this to get access to the parent context after we have already 17480// pushed the next context provider, and now need to merge their contexts. 17481 17482var previousContext = emptyContextObject; 17483 17484function getUnmaskedContext(workInProgress, Component, didPushOwnContextIfProvider) { 17485 { 17486 if (didPushOwnContextIfProvider && isContextProvider(Component)) { 17487 // If the fiber is a context provider itself, when we read its context 17488 // we may have already pushed its own child context on the stack. A context 17489 // provider should not "see" its own child context. Therefore we read the 17490 // previous (parent) context instead for a context provider. 17491 return previousContext; 17492 } 17493 17494 return contextStackCursor.current; 17495 } 17496} 17497 17498function cacheContext(workInProgress, unmaskedContext, maskedContext) { 17499 { 17500 var instance = workInProgress.stateNode; 17501 instance.__reactInternalMemoizedUnmaskedChildContext = unmaskedContext; 17502 instance.__reactInternalMemoizedMaskedChildContext = maskedContext; 17503 } 17504} 17505 17506function getMaskedContext(workInProgress, unmaskedContext) { 17507 { 17508 var type = workInProgress.type; 17509 var contextTypes = type.contextTypes; 17510 17511 if (!contextTypes) { 17512 return emptyContextObject; 17513 } // Avoid recreating masked context unless unmasked context has changed. 17514 // Failing to do this will result in unnecessary calls to componentWillReceiveProps. 17515 // This may trigger infinite loops if componentWillReceiveProps calls setState. 17516 17517 17518 var instance = workInProgress.stateNode; 17519 17520 if (instance && instance.__reactInternalMemoizedUnmaskedChildContext === unmaskedContext) { 17521 return instance.__reactInternalMemoizedMaskedChildContext; 17522 } 17523 17524 var context = {}; 17525 17526 for (var key in contextTypes) { 17527 context[key] = unmaskedContext[key]; 17528 } 17529 17530 { 17531 var name = getComponentNameFromFiber(workInProgress) || 'Unknown'; 17532 checkPropTypes(contextTypes, context, 'context', name); 17533 } // Cache unmasked context so we can avoid recreating masked context unless necessary. 17534 // Context is created before the class component is instantiated so check for instance. 17535 17536 17537 if (instance) { 17538 cacheContext(workInProgress, unmaskedContext, context); 17539 } 17540 17541 return context; 17542 } 17543} 17544 17545function hasContextChanged() { 17546 { 17547 return didPerformWorkStackCursor.current; 17548 } 17549} 17550 17551function isContextProvider(type) { 17552 { 17553 var childContextTypes = type.childContextTypes; 17554 return childContextTypes !== null && childContextTypes !== undefined; 17555 } 17556} 17557 17558function popContext(fiber) { 17559 { 17560 pop(didPerformWorkStackCursor, fiber); 17561 pop(contextStackCursor, fiber); 17562 } 17563} 17564 17565function popTopLevelContextObject(fiber) { 17566 { 17567 pop(didPerformWorkStackCursor, fiber); 17568 pop(contextStackCursor, fiber); 17569 } 17570} 17571 17572function pushTopLevelContextObject(fiber, context, didChange) { 17573 { 17574 if (contextStackCursor.current !== emptyContextObject) { 17575 throw new Error('Unexpected context found on stack. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 17576 } 17577 17578 push(contextStackCursor, context, fiber); 17579 push(didPerformWorkStackCursor, didChange, fiber); 17580 } 17581} 17582 17583function processChildContext(fiber, type, parentContext) { 17584 { 17585 var instance = fiber.stateNode; 17586 var childContextTypes = type.childContextTypes; // TODO (bvaughn) Replace this behavior with an invariant() in the future. 17587 // It has only been added in Fiber to match the (unintentional) behavior in Stack. 17588 17589 if (typeof instance.getChildContext !== 'function') { 17590 { 17591 var componentName = getComponentNameFromFiber(fiber) || 'Unknown'; 17592 17593 if (!warnedAboutMissingGetChildContext[componentName]) { 17594 warnedAboutMissingGetChildContext[componentName] = true; 17595 17596 error('%s.childContextTypes is specified but there is no getChildContext() method ' + 'on the instance. You can either define getChildContext() on %s or remove ' + 'childContextTypes from it.', componentName, componentName); 17597 } 17598 } 17599 17600 return parentContext; 17601 } 17602 17603 var childContext = instance.getChildContext(); 17604 17605 for (var contextKey in childContext) { 17606 if (!(contextKey in childContextTypes)) { 17607 throw new Error((getComponentNameFromFiber(fiber) || 'Unknown') + ".getChildContext(): key \"" + contextKey + "\" is not defined in childContextTypes."); 17608 } 17609 } 17610 17611 { 17612 var name = getComponentNameFromFiber(fiber) || 'Unknown'; 17613 checkPropTypes(childContextTypes, childContext, 'child context', name); 17614 } 17615 17616 return assign({}, parentContext, childContext); 17617 } 17618} 17619 17620function pushContextProvider(workInProgress) { 17621 { 17622 var instance = workInProgress.stateNode; // We push the context as early as possible to ensure stack integrity. 17623 // If the instance does not exist yet, we will push null at first, 17624 // and replace it on the stack later when invalidating the context. 17625 17626 var memoizedMergedChildContext = instance && instance.__reactInternalMemoizedMergedChildContext || emptyContextObject; // Remember the parent context so we can merge with it later. 17627 // Inherit the parent's did-perform-work value to avoid inadvertently blocking updates. 17628 17629 previousContext = contextStackCursor.current; 17630 push(contextStackCursor, memoizedMergedChildContext, workInProgress); 17631 push(didPerformWorkStackCursor, didPerformWorkStackCursor.current, workInProgress); 17632 return true; 17633 } 17634} 17635 17636function invalidateContextProvider(workInProgress, type, didChange) { 17637 { 17638 var instance = workInProgress.stateNode; 17639 17640 if (!instance) { 17641 throw new Error('Expected to have an instance by this point. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 17642 } 17643 17644 if (didChange) { 17645 // Merge parent and own context. 17646 // Skip this if we're not updating due to sCU. 17647 // This avoids unnecessarily recomputing memoized values. 17648 var mergedContext = processChildContext(workInProgress, type, previousContext); 17649 instance.__reactInternalMemoizedMergedChildContext = mergedContext; // Replace the old (or empty) context with the new one. 17650 // It is important to unwind the context in the reverse order. 17651 17652 pop(didPerformWorkStackCursor, workInProgress); 17653 pop(contextStackCursor, workInProgress); // Now push the new context and mark that it has changed. 17654 17655 push(contextStackCursor, mergedContext, workInProgress); 17656 push(didPerformWorkStackCursor, didChange, workInProgress); 17657 } else { 17658 pop(didPerformWorkStackCursor, workInProgress); 17659 push(didPerformWorkStackCursor, didChange, workInProgress); 17660 } 17661 } 17662} 17663 17664function findCurrentUnmaskedContext(fiber) { 17665 { 17666 // Currently this is only used with renderSubtreeIntoContainer; not sure if it 17667 // makes sense elsewhere 17668 if (!isFiberMounted(fiber) || fiber.tag !== ClassComponent) { 17669 throw new Error('Expected subtree parent to be a mounted class component. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 17670 } 17671 17672 var node = fiber; 17673 17674 do { 17675 switch (node.tag) { 17676 case HostRoot: 17677 return node.stateNode.context; 17678 17679 case ClassComponent: 17680 { 17681 var Component = node.type; 17682 17683 if (isContextProvider(Component)) { 17684 return node.stateNode.__reactInternalMemoizedMergedChildContext; 17685 } 17686 17687 break; 17688 } 17689 } 17690 17691 node = node.return; 17692 } while (node !== null); 17693 17694 throw new Error('Found unexpected detached subtree parent. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 17695 } 17696} 17697 17698var LegacyRoot = 0; 17699var ConcurrentRoot = 1; 17700 17701var syncQueue = null; 17702var includesLegacySyncCallbacks = false; 17703var isFlushingSyncQueue = false; 17704function scheduleSyncCallback(callback) { 17705 // Push this callback into an internal queue. We'll flush these either in 17706 // the next tick, or earlier if something calls `flushSyncCallbackQueue`. 17707 if (syncQueue === null) { 17708 syncQueue = [callback]; 17709 } else { 17710 // Push onto existing queue. Don't need to schedule a callback because 17711 // we already scheduled one when we created the queue. 17712 syncQueue.push(callback); 17713 } 17714} 17715function scheduleLegacySyncCallback(callback) { 17716 includesLegacySyncCallbacks = true; 17717 scheduleSyncCallback(callback); 17718} 17719function flushSyncCallbacksOnlyInLegacyMode() { 17720 // Only flushes the queue if there's a legacy sync callback scheduled. 17721 // TODO: There's only a single type of callback: performSyncOnWorkOnRoot. So 17722 // it might make more sense for the queue to be a list of roots instead of a 17723 // list of generic callbacks. Then we can have two: one for legacy roots, one 17724 // for concurrent roots. And this method would only flush the legacy ones. 17725 if (includesLegacySyncCallbacks) { 17726 flushSyncCallbacks(); 17727 } 17728} 17729function flushSyncCallbacks() { 17730 if (!isFlushingSyncQueue && syncQueue !== null) { 17731 // Prevent re-entrance. 17732 isFlushingSyncQueue = true; 17733 var i = 0; 17734 var previousUpdatePriority = getCurrentUpdatePriority(); 17735 17736 try { 17737 var isSync = true; 17738 var queue = syncQueue; // TODO: Is this necessary anymore? The only user code that runs in this 17739 // queue is in the render or commit phases. 17740 17741 setCurrentUpdatePriority(DiscreteEventPriority); 17742 17743 for (; i < queue.length; i++) { 17744 var callback = queue[i]; 17745 17746 do { 17747 callback = callback(isSync); 17748 } while (callback !== null); 17749 } 17750 17751 syncQueue = null; 17752 includesLegacySyncCallbacks = false; 17753 } catch (error) { 17754 // If something throws, leave the remaining callbacks on the queue. 17755 if (syncQueue !== null) { 17756 syncQueue = syncQueue.slice(i + 1); 17757 } // Resume flushing in the next tick 17758 17759 17760 scheduleCallback(ImmediatePriority, flushSyncCallbacks); 17761 throw error; 17762 } finally { 17763 setCurrentUpdatePriority(previousUpdatePriority); 17764 isFlushingSyncQueue = false; 17765 } 17766 } 17767 17768 return null; 17769} 17770 17771// TODO: Use the unified fiber stack module instead of this local one? 17772// Intentionally not using it yet to derisk the initial implementation, because 17773// the way we push/pop these values is a bit unusual. If there's a mistake, I'd 17774// rather the ids be wrong than crash the whole reconciler. 17775var forkStack = []; 17776var forkStackIndex = 0; 17777var treeForkProvider = null; 17778var treeForkCount = 0; 17779var idStack = []; 17780var idStackIndex = 0; 17781var treeContextProvider = null; 17782var treeContextId = 1; 17783var treeContextOverflow = ''; 17784function isForkedChild(workInProgress) { 17785 warnIfNotHydrating(); 17786 return (workInProgress.flags & Forked) !== NoFlags; 17787} 17788function getForksAtLevel(workInProgress) { 17789 warnIfNotHydrating(); 17790 return treeForkCount; 17791} 17792function getTreeId() { 17793 var overflow = treeContextOverflow; 17794 var idWithLeadingBit = treeContextId; 17795 var id = idWithLeadingBit & ~getLeadingBit(idWithLeadingBit); 17796 return id.toString(32) + overflow; 17797} 17798function pushTreeFork(workInProgress, totalChildren) { 17799 // This is called right after we reconcile an array (or iterator) of child 17800 // fibers, because that's the only place where we know how many children in 17801 // the whole set without doing extra work later, or storing addtional 17802 // information on the fiber. 17803 // 17804 // That's why this function is separate from pushTreeId — it's called during 17805 // the render phase of the fork parent, not the child, which is where we push 17806 // the other context values. 17807 // 17808 // In the Fizz implementation this is much simpler because the child is 17809 // rendered in the same callstack as the parent. 17810 // 17811 // It might be better to just add a `forks` field to the Fiber type. It would 17812 // make this module simpler. 17813 warnIfNotHydrating(); 17814 forkStack[forkStackIndex++] = treeForkCount; 17815 forkStack[forkStackIndex++] = treeForkProvider; 17816 treeForkProvider = workInProgress; 17817 treeForkCount = totalChildren; 17818} 17819function pushTreeId(workInProgress, totalChildren, index) { 17820 warnIfNotHydrating(); 17821 idStack[idStackIndex++] = treeContextId; 17822 idStack[idStackIndex++] = treeContextOverflow; 17823 idStack[idStackIndex++] = treeContextProvider; 17824 treeContextProvider = workInProgress; 17825 var baseIdWithLeadingBit = treeContextId; 17826 var baseOverflow = treeContextOverflow; // The leftmost 1 marks the end of the sequence, non-inclusive. It's not part 17827 // of the id; we use it to account for leading 0s. 17828 17829 var baseLength = getBitLength(baseIdWithLeadingBit) - 1; 17830 var baseId = baseIdWithLeadingBit & ~(1 << baseLength); 17831 var slot = index + 1; 17832 var length = getBitLength(totalChildren) + baseLength; // 30 is the max length we can store without overflowing, taking into 17833 // consideration the leading 1 we use to mark the end of the sequence. 17834 17835 if (length > 30) { 17836 // We overflowed the bitwise-safe range. Fall back to slower algorithm. 17837 // This branch assumes the length of the base id is greater than 5; it won't 17838 // work for smaller ids, because you need 5 bits per character. 17839 // 17840 // We encode the id in multiple steps: first the base id, then the 17841 // remaining digits. 17842 // 17843 // Each 5 bit sequence corresponds to a single base 32 character. So for 17844 // example, if the current id is 23 bits long, we can convert 20 of those 17845 // bits into a string of 4 characters, with 3 bits left over. 17846 // 17847 // First calculate how many bits in the base id represent a complete 17848 // sequence of characters. 17849 var numberOfOverflowBits = baseLength - baseLength % 5; // Then create a bitmask that selects only those bits. 17850 17851 var newOverflowBits = (1 << numberOfOverflowBits) - 1; // Select the bits, and convert them to a base 32 string. 17852 17853 var newOverflow = (baseId & newOverflowBits).toString(32); // Now we can remove those bits from the base id. 17854 17855 var restOfBaseId = baseId >> numberOfOverflowBits; 17856 var restOfBaseLength = baseLength - numberOfOverflowBits; // Finally, encode the rest of the bits using the normal algorithm. Because 17857 // we made more room, this time it won't overflow. 17858 17859 var restOfLength = getBitLength(totalChildren) + restOfBaseLength; 17860 var restOfNewBits = slot << restOfBaseLength; 17861 var id = restOfNewBits | restOfBaseId; 17862 var overflow = newOverflow + baseOverflow; 17863 treeContextId = 1 << restOfLength | id; 17864 treeContextOverflow = overflow; 17865 } else { 17866 // Normal path 17867 var newBits = slot << baseLength; 17868 17869 var _id = newBits | baseId; 17870 17871 var _overflow = baseOverflow; 17872 treeContextId = 1 << length | _id; 17873 treeContextOverflow = _overflow; 17874 } 17875} 17876function pushMaterializedTreeId(workInProgress) { 17877 warnIfNotHydrating(); // This component materialized an id. This will affect any ids that appear 17878 // in its children. 17879 17880 var returnFiber = workInProgress.return; 17881 17882 if (returnFiber !== null) { 17883 var numberOfForks = 1; 17884 var slotIndex = 0; 17885 pushTreeFork(workInProgress, numberOfForks); 17886 pushTreeId(workInProgress, numberOfForks, slotIndex); 17887 } 17888} 17889 17890function getBitLength(number) { 17891 return 32 - clz32(number); 17892} 17893 17894function getLeadingBit(id) { 17895 return 1 << getBitLength(id) - 1; 17896} 17897 17898function popTreeContext(workInProgress) { 17899 // Restore the previous values. 17900 // This is a bit more complicated than other context-like modules in Fiber 17901 // because the same Fiber may appear on the stack multiple times and for 17902 // different reasons. We have to keep popping until the work-in-progress is 17903 // no longer at the top of the stack. 17904 while (workInProgress === treeForkProvider) { 17905 treeForkProvider = forkStack[--forkStackIndex]; 17906 forkStack[forkStackIndex] = null; 17907 treeForkCount = forkStack[--forkStackIndex]; 17908 forkStack[forkStackIndex] = null; 17909 } 17910 17911 while (workInProgress === treeContextProvider) { 17912 treeContextProvider = idStack[--idStackIndex]; 17913 idStack[idStackIndex] = null; 17914 treeContextOverflow = idStack[--idStackIndex]; 17915 idStack[idStackIndex] = null; 17916 treeContextId = idStack[--idStackIndex]; 17917 idStack[idStackIndex] = null; 17918 } 17919} 17920function getSuspendedTreeContext() { 17921 warnIfNotHydrating(); 17922 17923 if (treeContextProvider !== null) { 17924 return { 17925 id: treeContextId, 17926 overflow: treeContextOverflow 17927 }; 17928 } else { 17929 return null; 17930 } 17931} 17932function restoreSuspendedTreeContext(workInProgress, suspendedContext) { 17933 warnIfNotHydrating(); 17934 idStack[idStackIndex++] = treeContextId; 17935 idStack[idStackIndex++] = treeContextOverflow; 17936 idStack[idStackIndex++] = treeContextProvider; 17937 treeContextId = suspendedContext.id; 17938 treeContextOverflow = suspendedContext.overflow; 17939 treeContextProvider = workInProgress; 17940} 17941 17942function warnIfNotHydrating() { 17943 { 17944 if (!getIsHydrating()) { 17945 error('Expected to be hydrating. This is a bug in React. Please file ' + 'an issue.'); 17946 } 17947 } 17948} 17949 17950// This may have been an insertion or a hydration. 17951 17952var hydrationParentFiber = null; 17953var nextHydratableInstance = null; 17954var isHydrating = false; // This flag allows for warning supression when we expect there to be mismatches 17955// due to earlier mismatches or a suspended fiber. 17956 17957var didSuspendOrErrorDEV = false; // Hydration errors that were thrown inside this boundary 17958 17959var hydrationErrors = null; 17960 17961function warnIfHydrating() { 17962 { 17963 if (isHydrating) { 17964 error('We should not be hydrating here. This is a bug in React. Please file a bug.'); 17965 } 17966 } 17967} 17968 17969function markDidThrowWhileHydratingDEV() { 17970 { 17971 didSuspendOrErrorDEV = true; 17972 } 17973} 17974function didSuspendOrErrorWhileHydratingDEV() { 17975 { 17976 return didSuspendOrErrorDEV; 17977 } 17978} 17979 17980function enterHydrationState(fiber) { 17981 17982 var parentInstance = fiber.stateNode.containerInfo; 17983 nextHydratableInstance = getFirstHydratableChildWithinContainer(parentInstance); 17984 hydrationParentFiber = fiber; 17985 isHydrating = true; 17986 hydrationErrors = null; 17987 didSuspendOrErrorDEV = false; 17988 return true; 17989} 17990 17991function reenterHydrationStateFromDehydratedSuspenseInstance(fiber, suspenseInstance, treeContext) { 17992 17993 nextHydratableInstance = getFirstHydratableChildWithinSuspenseInstance(suspenseInstance); 17994 hydrationParentFiber = fiber; 17995 isHydrating = true; 17996 hydrationErrors = null; 17997 didSuspendOrErrorDEV = false; 17998 17999 if (treeContext !== null) { 18000 restoreSuspendedTreeContext(fiber, treeContext); 18001 } 18002 18003 return true; 18004} 18005 18006function warnUnhydratedInstance(returnFiber, instance) { 18007 { 18008 switch (returnFiber.tag) { 18009 case HostRoot: 18010 { 18011 didNotHydrateInstanceWithinContainer(returnFiber.stateNode.containerInfo, instance); 18012 break; 18013 } 18014 18015 case HostComponent: 18016 { 18017 var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode; 18018 didNotHydrateInstance(returnFiber.type, returnFiber.memoizedProps, returnFiber.stateNode, instance, // TODO: Delete this argument when we remove the legacy root API. 18019 isConcurrentMode); 18020 break; 18021 } 18022 18023 case SuspenseComponent: 18024 { 18025 var suspenseState = returnFiber.memoizedState; 18026 if (suspenseState.dehydrated !== null) didNotHydrateInstanceWithinSuspenseInstance(suspenseState.dehydrated, instance); 18027 break; 18028 } 18029 } 18030 } 18031} 18032 18033function deleteHydratableInstance(returnFiber, instance) { 18034 warnUnhydratedInstance(returnFiber, instance); 18035 var childToDelete = createFiberFromHostInstanceForDeletion(); 18036 childToDelete.stateNode = instance; 18037 childToDelete.return = returnFiber; 18038 var deletions = returnFiber.deletions; 18039 18040 if (deletions === null) { 18041 returnFiber.deletions = [childToDelete]; 18042 returnFiber.flags |= ChildDeletion; 18043 } else { 18044 deletions.push(childToDelete); 18045 } 18046} 18047 18048function warnNonhydratedInstance(returnFiber, fiber) { 18049 { 18050 if (didSuspendOrErrorDEV) { 18051 // Inside a boundary that already suspended. We're currently rendering the 18052 // siblings of a suspended node. The mismatch may be due to the missing 18053 // data, so it's probably a false positive. 18054 return; 18055 } 18056 18057 switch (returnFiber.tag) { 18058 case HostRoot: 18059 { 18060 var parentContainer = returnFiber.stateNode.containerInfo; 18061 18062 switch (fiber.tag) { 18063 case HostComponent: 18064 var type = fiber.type; 18065 var props = fiber.pendingProps; 18066 didNotFindHydratableInstanceWithinContainer(parentContainer, type); 18067 break; 18068 18069 case HostText: 18070 var text = fiber.pendingProps; 18071 didNotFindHydratableTextInstanceWithinContainer(parentContainer, text); 18072 break; 18073 } 18074 18075 break; 18076 } 18077 18078 case HostComponent: 18079 { 18080 var parentType = returnFiber.type; 18081 var parentProps = returnFiber.memoizedProps; 18082 var parentInstance = returnFiber.stateNode; 18083 18084 switch (fiber.tag) { 18085 case HostComponent: 18086 { 18087 var _type = fiber.type; 18088 var _props = fiber.pendingProps; 18089 var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode; 18090 didNotFindHydratableInstance(parentType, parentProps, parentInstance, _type, _props, // TODO: Delete this argument when we remove the legacy root API. 18091 isConcurrentMode); 18092 break; 18093 } 18094 18095 case HostText: 18096 { 18097 var _text = fiber.pendingProps; 18098 18099 var _isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode; 18100 18101 didNotFindHydratableTextInstance(parentType, parentProps, parentInstance, _text, // TODO: Delete this argument when we remove the legacy root API. 18102 _isConcurrentMode); 18103 break; 18104 } 18105 } 18106 18107 break; 18108 } 18109 18110 case SuspenseComponent: 18111 { 18112 var suspenseState = returnFiber.memoizedState; 18113 var _parentInstance = suspenseState.dehydrated; 18114 if (_parentInstance !== null) switch (fiber.tag) { 18115 case HostComponent: 18116 var _type2 = fiber.type; 18117 var _props2 = fiber.pendingProps; 18118 didNotFindHydratableInstanceWithinSuspenseInstance(_parentInstance, _type2); 18119 break; 18120 18121 case HostText: 18122 var _text2 = fiber.pendingProps; 18123 didNotFindHydratableTextInstanceWithinSuspenseInstance(_parentInstance, _text2); 18124 break; 18125 } 18126 break; 18127 } 18128 18129 default: 18130 return; 18131 } 18132 } 18133} 18134 18135function insertNonHydratedInstance(returnFiber, fiber) { 18136 fiber.flags = fiber.flags & ~Hydrating | Placement; 18137 warnNonhydratedInstance(returnFiber, fiber); 18138} 18139 18140function tryHydrate(fiber, nextInstance) { 18141 switch (fiber.tag) { 18142 case HostComponent: 18143 { 18144 var type = fiber.type; 18145 var props = fiber.pendingProps; 18146 var instance = canHydrateInstance(nextInstance, type); 18147 18148 if (instance !== null) { 18149 fiber.stateNode = instance; 18150 hydrationParentFiber = fiber; 18151 nextHydratableInstance = getFirstHydratableChild(instance); 18152 return true; 18153 } 18154 18155 return false; 18156 } 18157 18158 case HostText: 18159 { 18160 var text = fiber.pendingProps; 18161 var textInstance = canHydrateTextInstance(nextInstance, text); 18162 18163 if (textInstance !== null) { 18164 fiber.stateNode = textInstance; 18165 hydrationParentFiber = fiber; // Text Instances don't have children so there's nothing to hydrate. 18166 18167 nextHydratableInstance = null; 18168 return true; 18169 } 18170 18171 return false; 18172 } 18173 18174 case SuspenseComponent: 18175 { 18176 var suspenseInstance = canHydrateSuspenseInstance(nextInstance); 18177 18178 if (suspenseInstance !== null) { 18179 var suspenseState = { 18180 dehydrated: suspenseInstance, 18181 treeContext: getSuspendedTreeContext(), 18182 retryLane: OffscreenLane 18183 }; 18184 fiber.memoizedState = suspenseState; // Store the dehydrated fragment as a child fiber. 18185 // This simplifies the code for getHostSibling and deleting nodes, 18186 // since it doesn't have to consider all Suspense boundaries and 18187 // check if they're dehydrated ones or not. 18188 18189 var dehydratedFragment = createFiberFromDehydratedFragment(suspenseInstance); 18190 dehydratedFragment.return = fiber; 18191 fiber.child = dehydratedFragment; 18192 hydrationParentFiber = fiber; // While a Suspense Instance does have children, we won't step into 18193 // it during the first pass. Instead, we'll reenter it later. 18194 18195 nextHydratableInstance = null; 18196 return true; 18197 } 18198 18199 return false; 18200 } 18201 18202 default: 18203 return false; 18204 } 18205} 18206 18207function shouldClientRenderOnMismatch(fiber) { 18208 return (fiber.mode & ConcurrentMode) !== NoMode && (fiber.flags & DidCapture) === NoFlags; 18209} 18210 18211function throwOnHydrationMismatch(fiber) { 18212 throw new Error('Hydration failed because the initial UI does not match what was ' + 'rendered on the server.'); 18213} 18214 18215function tryToClaimNextHydratableInstance(fiber) { 18216 if (!isHydrating) { 18217 return; 18218 } 18219 18220 var nextInstance = nextHydratableInstance; 18221 18222 if (!nextInstance) { 18223 if (shouldClientRenderOnMismatch(fiber)) { 18224 warnNonhydratedInstance(hydrationParentFiber, fiber); 18225 throwOnHydrationMismatch(); 18226 } // Nothing to hydrate. Make it an insertion. 18227 18228 18229 insertNonHydratedInstance(hydrationParentFiber, fiber); 18230 isHydrating = false; 18231 hydrationParentFiber = fiber; 18232 return; 18233 } 18234 18235 var firstAttemptedInstance = nextInstance; 18236 18237 if (!tryHydrate(fiber, nextInstance)) { 18238 if (shouldClientRenderOnMismatch(fiber)) { 18239 warnNonhydratedInstance(hydrationParentFiber, fiber); 18240 throwOnHydrationMismatch(); 18241 } // If we can't hydrate this instance let's try the next one. 18242 // We use this as a heuristic. It's based on intuition and not data so it 18243 // might be flawed or unnecessary. 18244 18245 18246 nextInstance = getNextHydratableSibling(firstAttemptedInstance); 18247 var prevHydrationParentFiber = hydrationParentFiber; 18248 18249 if (!nextInstance || !tryHydrate(fiber, nextInstance)) { 18250 // Nothing to hydrate. Make it an insertion. 18251 insertNonHydratedInstance(hydrationParentFiber, fiber); 18252 isHydrating = false; 18253 hydrationParentFiber = fiber; 18254 return; 18255 } // We matched the next one, we'll now assume that the first one was 18256 // superfluous and we'll delete it. Since we can't eagerly delete it 18257 // we'll have to schedule a deletion. To do that, this node needs a dummy 18258 // fiber associated with it. 18259 18260 18261 deleteHydratableInstance(prevHydrationParentFiber, firstAttemptedInstance); 18262 } 18263} 18264 18265function prepareToHydrateHostInstance(fiber, rootContainerInstance, hostContext) { 18266 18267 var instance = fiber.stateNode; 18268 var shouldWarnIfMismatchDev = !didSuspendOrErrorDEV; 18269 var updatePayload = hydrateInstance(instance, fiber.type, fiber.memoizedProps, rootContainerInstance, hostContext, fiber, shouldWarnIfMismatchDev); // TODO: Type this specific to this type of component. 18270 18271 fiber.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there 18272 // is a new ref we mark this as an update. 18273 18274 if (updatePayload !== null) { 18275 return true; 18276 } 18277 18278 return false; 18279} 18280 18281function prepareToHydrateHostTextInstance(fiber) { 18282 18283 var textInstance = fiber.stateNode; 18284 var textContent = fiber.memoizedProps; 18285 var shouldUpdate = hydrateTextInstance(textInstance, textContent, fiber); 18286 18287 if (shouldUpdate) { 18288 // We assume that prepareToHydrateHostTextInstance is called in a context where the 18289 // hydration parent is the parent host component of this host text. 18290 var returnFiber = hydrationParentFiber; 18291 18292 if (returnFiber !== null) { 18293 switch (returnFiber.tag) { 18294 case HostRoot: 18295 { 18296 var parentContainer = returnFiber.stateNode.containerInfo; 18297 var isConcurrentMode = (returnFiber.mode & ConcurrentMode) !== NoMode; 18298 didNotMatchHydratedContainerTextInstance(parentContainer, textInstance, textContent, // TODO: Delete this argument when we remove the legacy root API. 18299 isConcurrentMode); 18300 break; 18301 } 18302 18303 case HostComponent: 18304 { 18305 var parentType = returnFiber.type; 18306 var parentProps = returnFiber.memoizedProps; 18307 var parentInstance = returnFiber.stateNode; 18308 18309 var _isConcurrentMode2 = (returnFiber.mode & ConcurrentMode) !== NoMode; 18310 18311 didNotMatchHydratedTextInstance(parentType, parentProps, parentInstance, textInstance, textContent, // TODO: Delete this argument when we remove the legacy root API. 18312 _isConcurrentMode2); 18313 break; 18314 } 18315 } 18316 } 18317 } 18318 18319 return shouldUpdate; 18320} 18321 18322function prepareToHydrateHostSuspenseInstance(fiber) { 18323 18324 var suspenseState = fiber.memoizedState; 18325 var suspenseInstance = suspenseState !== null ? suspenseState.dehydrated : null; 18326 18327 if (!suspenseInstance) { 18328 throw new Error('Expected to have a hydrated suspense instance. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 18329 } 18330 18331 hydrateSuspenseInstance(suspenseInstance, fiber); 18332} 18333 18334function skipPastDehydratedSuspenseInstance(fiber) { 18335 18336 var suspenseState = fiber.memoizedState; 18337 var suspenseInstance = suspenseState !== null ? suspenseState.dehydrated : null; 18338 18339 if (!suspenseInstance) { 18340 throw new Error('Expected to have a hydrated suspense instance. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 18341 } 18342 18343 return getNextHydratableInstanceAfterSuspenseInstance(suspenseInstance); 18344} 18345 18346function popToNextHostParent(fiber) { 18347 var parent = fiber.return; 18348 18349 while (parent !== null && parent.tag !== HostComponent && parent.tag !== HostRoot && parent.tag !== SuspenseComponent) { 18350 parent = parent.return; 18351 } 18352 18353 hydrationParentFiber = parent; 18354} 18355 18356function popHydrationState(fiber) { 18357 18358 if (fiber !== hydrationParentFiber) { 18359 // We're deeper than the current hydration context, inside an inserted 18360 // tree. 18361 return false; 18362 } 18363 18364 if (!isHydrating) { 18365 // If we're not currently hydrating but we're in a hydration context, then 18366 // we were an insertion and now need to pop up reenter hydration of our 18367 // siblings. 18368 popToNextHostParent(fiber); 18369 isHydrating = true; 18370 return false; 18371 } // If we have any remaining hydratable nodes, we need to delete them now. 18372 // We only do this deeper than head and body since they tend to have random 18373 // other nodes in them. We also ignore components with pure text content in 18374 // side of them. We also don't delete anything inside the root container. 18375 18376 18377 if (fiber.tag !== HostRoot && (fiber.tag !== HostComponent || shouldDeleteUnhydratedTailInstances(fiber.type) && !shouldSetTextContent(fiber.type, fiber.memoizedProps))) { 18378 var nextInstance = nextHydratableInstance; 18379 18380 if (nextInstance) { 18381 if (shouldClientRenderOnMismatch(fiber)) { 18382 warnIfUnhydratedTailNodes(fiber); 18383 throwOnHydrationMismatch(); 18384 } else { 18385 while (nextInstance) { 18386 deleteHydratableInstance(fiber, nextInstance); 18387 nextInstance = getNextHydratableSibling(nextInstance); 18388 } 18389 } 18390 } 18391 } 18392 18393 popToNextHostParent(fiber); 18394 18395 if (fiber.tag === SuspenseComponent) { 18396 nextHydratableInstance = skipPastDehydratedSuspenseInstance(fiber); 18397 } else { 18398 nextHydratableInstance = hydrationParentFiber ? getNextHydratableSibling(fiber.stateNode) : null; 18399 } 18400 18401 return true; 18402} 18403 18404function hasUnhydratedTailNodes() { 18405 return isHydrating && nextHydratableInstance !== null; 18406} 18407 18408function warnIfUnhydratedTailNodes(fiber) { 18409 var nextInstance = nextHydratableInstance; 18410 18411 while (nextInstance) { 18412 warnUnhydratedInstance(fiber, nextInstance); 18413 nextInstance = getNextHydratableSibling(nextInstance); 18414 } 18415} 18416 18417function resetHydrationState() { 18418 18419 hydrationParentFiber = null; 18420 nextHydratableInstance = null; 18421 isHydrating = false; 18422 didSuspendOrErrorDEV = false; 18423} 18424 18425function upgradeHydrationErrorsToRecoverable() { 18426 if (hydrationErrors !== null) { 18427 // Successfully completed a forced client render. The errors that occurred 18428 // during the hydration attempt are now recovered. We will log them in 18429 // commit phase, once the entire tree has finished. 18430 queueRecoverableErrors(hydrationErrors); 18431 hydrationErrors = null; 18432 } 18433} 18434 18435function getIsHydrating() { 18436 return isHydrating; 18437} 18438 18439function queueHydrationError(error) { 18440 if (hydrationErrors === null) { 18441 hydrationErrors = [error]; 18442 } else { 18443 hydrationErrors.push(error); 18444 } 18445} 18446 18447var ReactCurrentBatchConfig$1 = ReactSharedInternals.ReactCurrentBatchConfig; 18448var NoTransition = null; 18449function requestCurrentTransition() { 18450 return ReactCurrentBatchConfig$1.transition; 18451} 18452 18453var ReactStrictModeWarnings = { 18454 recordUnsafeLifecycleWarnings: function (fiber, instance) {}, 18455 flushPendingUnsafeLifecycleWarnings: function () {}, 18456 recordLegacyContextWarning: function (fiber, instance) {}, 18457 flushLegacyContextWarning: function () {}, 18458 discardPendingWarnings: function () {} 18459}; 18460 18461{ 18462 var findStrictRoot = function (fiber) { 18463 var maybeStrictRoot = null; 18464 var node = fiber; 18465 18466 while (node !== null) { 18467 if (node.mode & StrictLegacyMode) { 18468 maybeStrictRoot = node; 18469 } 18470 18471 node = node.return; 18472 } 18473 18474 return maybeStrictRoot; 18475 }; 18476 18477 var setToSortedString = function (set) { 18478 var array = []; 18479 set.forEach(function (value) { 18480 array.push(value); 18481 }); 18482 return array.sort().join(', '); 18483 }; 18484 18485 var pendingComponentWillMountWarnings = []; 18486 var pendingUNSAFE_ComponentWillMountWarnings = []; 18487 var pendingComponentWillReceivePropsWarnings = []; 18488 var pendingUNSAFE_ComponentWillReceivePropsWarnings = []; 18489 var pendingComponentWillUpdateWarnings = []; 18490 var pendingUNSAFE_ComponentWillUpdateWarnings = []; // Tracks components we have already warned about. 18491 18492 var didWarnAboutUnsafeLifecycles = new Set(); 18493 18494 ReactStrictModeWarnings.recordUnsafeLifecycleWarnings = function (fiber, instance) { 18495 // Dedupe strategy: Warn once per component. 18496 if (didWarnAboutUnsafeLifecycles.has(fiber.type)) { 18497 return; 18498 } 18499 18500 if (typeof instance.componentWillMount === 'function' && // Don't warn about react-lifecycles-compat polyfilled components. 18501 instance.componentWillMount.__suppressDeprecationWarning !== true) { 18502 pendingComponentWillMountWarnings.push(fiber); 18503 } 18504 18505 if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillMount === 'function') { 18506 pendingUNSAFE_ComponentWillMountWarnings.push(fiber); 18507 } 18508 18509 if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) { 18510 pendingComponentWillReceivePropsWarnings.push(fiber); 18511 } 18512 18513 if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillReceiveProps === 'function') { 18514 pendingUNSAFE_ComponentWillReceivePropsWarnings.push(fiber); 18515 } 18516 18517 if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) { 18518 pendingComponentWillUpdateWarnings.push(fiber); 18519 } 18520 18521 if (fiber.mode & StrictLegacyMode && typeof instance.UNSAFE_componentWillUpdate === 'function') { 18522 pendingUNSAFE_ComponentWillUpdateWarnings.push(fiber); 18523 } 18524 }; 18525 18526 ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings = function () { 18527 // We do an initial pass to gather component names 18528 var componentWillMountUniqueNames = new Set(); 18529 18530 if (pendingComponentWillMountWarnings.length > 0) { 18531 pendingComponentWillMountWarnings.forEach(function (fiber) { 18532 componentWillMountUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18533 didWarnAboutUnsafeLifecycles.add(fiber.type); 18534 }); 18535 pendingComponentWillMountWarnings = []; 18536 } 18537 18538 var UNSAFE_componentWillMountUniqueNames = new Set(); 18539 18540 if (pendingUNSAFE_ComponentWillMountWarnings.length > 0) { 18541 pendingUNSAFE_ComponentWillMountWarnings.forEach(function (fiber) { 18542 UNSAFE_componentWillMountUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18543 didWarnAboutUnsafeLifecycles.add(fiber.type); 18544 }); 18545 pendingUNSAFE_ComponentWillMountWarnings = []; 18546 } 18547 18548 var componentWillReceivePropsUniqueNames = new Set(); 18549 18550 if (pendingComponentWillReceivePropsWarnings.length > 0) { 18551 pendingComponentWillReceivePropsWarnings.forEach(function (fiber) { 18552 componentWillReceivePropsUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18553 didWarnAboutUnsafeLifecycles.add(fiber.type); 18554 }); 18555 pendingComponentWillReceivePropsWarnings = []; 18556 } 18557 18558 var UNSAFE_componentWillReceivePropsUniqueNames = new Set(); 18559 18560 if (pendingUNSAFE_ComponentWillReceivePropsWarnings.length > 0) { 18561 pendingUNSAFE_ComponentWillReceivePropsWarnings.forEach(function (fiber) { 18562 UNSAFE_componentWillReceivePropsUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18563 didWarnAboutUnsafeLifecycles.add(fiber.type); 18564 }); 18565 pendingUNSAFE_ComponentWillReceivePropsWarnings = []; 18566 } 18567 18568 var componentWillUpdateUniqueNames = new Set(); 18569 18570 if (pendingComponentWillUpdateWarnings.length > 0) { 18571 pendingComponentWillUpdateWarnings.forEach(function (fiber) { 18572 componentWillUpdateUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18573 didWarnAboutUnsafeLifecycles.add(fiber.type); 18574 }); 18575 pendingComponentWillUpdateWarnings = []; 18576 } 18577 18578 var UNSAFE_componentWillUpdateUniqueNames = new Set(); 18579 18580 if (pendingUNSAFE_ComponentWillUpdateWarnings.length > 0) { 18581 pendingUNSAFE_ComponentWillUpdateWarnings.forEach(function (fiber) { 18582 UNSAFE_componentWillUpdateUniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18583 didWarnAboutUnsafeLifecycles.add(fiber.type); 18584 }); 18585 pendingUNSAFE_ComponentWillUpdateWarnings = []; 18586 } // Finally, we flush all the warnings 18587 // UNSAFE_ ones before the deprecated ones, since they'll be 'louder' 18588 18589 18590 if (UNSAFE_componentWillMountUniqueNames.size > 0) { 18591 var sortedNames = setToSortedString(UNSAFE_componentWillMountUniqueNames); 18592 18593 error('Using UNSAFE_componentWillMount in strict mode is not recommended and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '\nPlease update the following components: %s', sortedNames); 18594 } 18595 18596 if (UNSAFE_componentWillReceivePropsUniqueNames.size > 0) { 18597 var _sortedNames = setToSortedString(UNSAFE_componentWillReceivePropsUniqueNames); 18598 18599 error('Using UNSAFE_componentWillReceiveProps in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, " + 'refactor your code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '\nPlease update the following components: %s', _sortedNames); 18600 } 18601 18602 if (UNSAFE_componentWillUpdateUniqueNames.size > 0) { 18603 var _sortedNames2 = setToSortedString(UNSAFE_componentWillUpdateUniqueNames); 18604 18605 error('Using UNSAFE_componentWillUpdate in strict mode is not recommended ' + 'and may indicate bugs in your code. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '\nPlease update the following components: %s', _sortedNames2); 18606 } 18607 18608 if (componentWillMountUniqueNames.size > 0) { 18609 var _sortedNames3 = setToSortedString(componentWillMountUniqueNames); 18610 18611 warn('componentWillMount has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move code with side effects to componentDidMount, and set initial state in the constructor.\n' + '* Rename componentWillMount to UNSAFE_componentWillMount to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames3); 18612 } 18613 18614 if (componentWillReceivePropsUniqueNames.size > 0) { 18615 var _sortedNames4 = setToSortedString(componentWillReceivePropsUniqueNames); 18616 18617 warn('componentWillReceiveProps has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + "* If you're updating state whenever props change, refactor your " + 'code to use memoization techniques or move it to ' + 'static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state\n' + '* Rename componentWillReceiveProps to UNSAFE_componentWillReceiveProps to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames4); 18618 } 18619 18620 if (componentWillUpdateUniqueNames.size > 0) { 18621 var _sortedNames5 = setToSortedString(componentWillUpdateUniqueNames); 18622 18623 warn('componentWillUpdate has been renamed, and is not recommended for use. ' + 'See https://reactjs.org/link/unsafe-component-lifecycles for details.\n\n' + '* Move data fetching code or side effects to componentDidUpdate.\n' + '* Rename componentWillUpdate to UNSAFE_componentWillUpdate to suppress ' + 'this warning in non-strict mode. In React 18.x, only the UNSAFE_ name will work. ' + 'To rename all deprecated lifecycles to their new names, you can run ' + '`npx react-codemod rename-unsafe-lifecycles` in your project source folder.\n' + '\nPlease update the following components: %s', _sortedNames5); 18624 } 18625 }; 18626 18627 var pendingLegacyContextWarning = new Map(); // Tracks components we have already warned about. 18628 18629 var didWarnAboutLegacyContext = new Set(); 18630 18631 ReactStrictModeWarnings.recordLegacyContextWarning = function (fiber, instance) { 18632 var strictRoot = findStrictRoot(fiber); 18633 18634 if (strictRoot === null) { 18635 error('Expected to find a StrictMode component in a strict mode tree. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 18636 18637 return; 18638 } // Dedup strategy: Warn once per component. 18639 18640 18641 if (didWarnAboutLegacyContext.has(fiber.type)) { 18642 return; 18643 } 18644 18645 var warningsForRoot = pendingLegacyContextWarning.get(strictRoot); 18646 18647 if (fiber.type.contextTypes != null || fiber.type.childContextTypes != null || instance !== null && typeof instance.getChildContext === 'function') { 18648 if (warningsForRoot === undefined) { 18649 warningsForRoot = []; 18650 pendingLegacyContextWarning.set(strictRoot, warningsForRoot); 18651 } 18652 18653 warningsForRoot.push(fiber); 18654 } 18655 }; 18656 18657 ReactStrictModeWarnings.flushLegacyContextWarning = function () { 18658 pendingLegacyContextWarning.forEach(function (fiberArray, strictRoot) { 18659 if (fiberArray.length === 0) { 18660 return; 18661 } 18662 18663 var firstFiber = fiberArray[0]; 18664 var uniqueNames = new Set(); 18665 fiberArray.forEach(function (fiber) { 18666 uniqueNames.add(getComponentNameFromFiber(fiber) || 'Component'); 18667 didWarnAboutLegacyContext.add(fiber.type); 18668 }); 18669 var sortedNames = setToSortedString(uniqueNames); 18670 18671 try { 18672 setCurrentFiber(firstFiber); 18673 18674 error('Legacy context API has been detected within a strict-mode tree.' + '\n\nThe old API will be supported in all 16.x releases, but applications ' + 'using it should migrate to the new version.' + '\n\nPlease update the following components: %s' + '\n\nLearn more about this warning here: https://reactjs.org/link/legacy-context', sortedNames); 18675 } finally { 18676 resetCurrentFiber(); 18677 } 18678 }); 18679 }; 18680 18681 ReactStrictModeWarnings.discardPendingWarnings = function () { 18682 pendingComponentWillMountWarnings = []; 18683 pendingUNSAFE_ComponentWillMountWarnings = []; 18684 pendingComponentWillReceivePropsWarnings = []; 18685 pendingUNSAFE_ComponentWillReceivePropsWarnings = []; 18686 pendingComponentWillUpdateWarnings = []; 18687 pendingUNSAFE_ComponentWillUpdateWarnings = []; 18688 pendingLegacyContextWarning = new Map(); 18689 }; 18690} 18691 18692function resolveDefaultProps(Component, baseProps) { 18693 if (Component && Component.defaultProps) { 18694 // Resolve default props. Taken from ReactElement 18695 var props = assign({}, baseProps); 18696 var defaultProps = Component.defaultProps; 18697 18698 for (var propName in defaultProps) { 18699 if (props[propName] === undefined) { 18700 props[propName] = defaultProps[propName]; 18701 } 18702 } 18703 18704 return props; 18705 } 18706 18707 return baseProps; 18708} 18709 18710var valueCursor = createCursor(null); 18711var rendererSigil; 18712 18713{ 18714 // Use this to detect multiple renderers using the same context 18715 rendererSigil = {}; 18716} 18717 18718var currentlyRenderingFiber = null; 18719var lastContextDependency = null; 18720var lastFullyObservedContext = null; 18721var isDisallowedContextReadInDEV = false; 18722function resetContextDependencies() { 18723 // This is called right before React yields execution, to ensure `readContext` 18724 // cannot be called outside the render phase. 18725 currentlyRenderingFiber = null; 18726 lastContextDependency = null; 18727 lastFullyObservedContext = null; 18728 18729 { 18730 isDisallowedContextReadInDEV = false; 18731 } 18732} 18733function enterDisallowedContextReadInDEV() { 18734 { 18735 isDisallowedContextReadInDEV = true; 18736 } 18737} 18738function exitDisallowedContextReadInDEV() { 18739 { 18740 isDisallowedContextReadInDEV = false; 18741 } 18742} 18743function pushProvider(providerFiber, context, nextValue) { 18744 { 18745 push(valueCursor, context._currentValue, providerFiber); 18746 context._currentValue = nextValue; 18747 18748 { 18749 if (context._currentRenderer !== undefined && context._currentRenderer !== null && context._currentRenderer !== rendererSigil) { 18750 error('Detected multiple renderers concurrently rendering the ' + 'same context provider. This is currently unsupported.'); 18751 } 18752 18753 context._currentRenderer = rendererSigil; 18754 } 18755 } 18756} 18757function popProvider(context, providerFiber) { 18758 var currentValue = valueCursor.current; 18759 pop(valueCursor, providerFiber); 18760 18761 { 18762 { 18763 context._currentValue = currentValue; 18764 } 18765 } 18766} 18767function scheduleContextWorkOnParentPath(parent, renderLanes, propagationRoot) { 18768 // Update the child lanes of all the ancestors, including the alternates. 18769 var node = parent; 18770 18771 while (node !== null) { 18772 var alternate = node.alternate; 18773 18774 if (!isSubsetOfLanes(node.childLanes, renderLanes)) { 18775 node.childLanes = mergeLanes(node.childLanes, renderLanes); 18776 18777 if (alternate !== null) { 18778 alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes); 18779 } 18780 } else if (alternate !== null && !isSubsetOfLanes(alternate.childLanes, renderLanes)) { 18781 alternate.childLanes = mergeLanes(alternate.childLanes, renderLanes); 18782 } 18783 18784 if (node === propagationRoot) { 18785 break; 18786 } 18787 18788 node = node.return; 18789 } 18790 18791 { 18792 if (node !== propagationRoot) { 18793 error('Expected to find the propagation root when scheduling context work. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 18794 } 18795 } 18796} 18797function propagateContextChange(workInProgress, context, renderLanes) { 18798 { 18799 propagateContextChange_eager(workInProgress, context, renderLanes); 18800 } 18801} 18802 18803function propagateContextChange_eager(workInProgress, context, renderLanes) { 18804 18805 var fiber = workInProgress.child; 18806 18807 if (fiber !== null) { 18808 // Set the return pointer of the child to the work-in-progress fiber. 18809 fiber.return = workInProgress; 18810 } 18811 18812 while (fiber !== null) { 18813 var nextFiber = void 0; // Visit this fiber. 18814 18815 var list = fiber.dependencies; 18816 18817 if (list !== null) { 18818 nextFiber = fiber.child; 18819 var dependency = list.firstContext; 18820 18821 while (dependency !== null) { 18822 // Check if the context matches. 18823 if (dependency.context === context) { 18824 // Match! Schedule an update on this fiber. 18825 if (fiber.tag === ClassComponent) { 18826 // Schedule a force update on the work-in-progress. 18827 var lane = pickArbitraryLane(renderLanes); 18828 var update = createUpdate(NoTimestamp, lane); 18829 update.tag = ForceUpdate; // TODO: Because we don't have a work-in-progress, this will add the 18830 // update to the current fiber, too, which means it will persist even if 18831 // this render is thrown away. Since it's a race condition, not sure it's 18832 // worth fixing. 18833 // Inlined `enqueueUpdate` to remove interleaved update check 18834 18835 var updateQueue = fiber.updateQueue; 18836 18837 if (updateQueue === null) ; else { 18838 var sharedQueue = updateQueue.shared; 18839 var pending = sharedQueue.pending; 18840 18841 if (pending === null) { 18842 // This is the first update. Create a circular list. 18843 update.next = update; 18844 } else { 18845 update.next = pending.next; 18846 pending.next = update; 18847 } 18848 18849 sharedQueue.pending = update; 18850 } 18851 } 18852 18853 fiber.lanes = mergeLanes(fiber.lanes, renderLanes); 18854 var alternate = fiber.alternate; 18855 18856 if (alternate !== null) { 18857 alternate.lanes = mergeLanes(alternate.lanes, renderLanes); 18858 } 18859 18860 scheduleContextWorkOnParentPath(fiber.return, renderLanes, workInProgress); // Mark the updated lanes on the list, too. 18861 18862 list.lanes = mergeLanes(list.lanes, renderLanes); // Since we already found a match, we can stop traversing the 18863 // dependency list. 18864 18865 break; 18866 } 18867 18868 dependency = dependency.next; 18869 } 18870 } else if (fiber.tag === ContextProvider) { 18871 // Don't scan deeper if this is a matching provider 18872 nextFiber = fiber.type === workInProgress.type ? null : fiber.child; 18873 } else if (fiber.tag === DehydratedFragment) { 18874 // If a dehydrated suspense boundary is in this subtree, we don't know 18875 // if it will have any context consumers in it. The best we can do is 18876 // mark it as having updates. 18877 var parentSuspense = fiber.return; 18878 18879 if (parentSuspense === null) { 18880 throw new Error('We just came from a parent so we must have had a parent. This is a bug in React.'); 18881 } 18882 18883 parentSuspense.lanes = mergeLanes(parentSuspense.lanes, renderLanes); 18884 var _alternate = parentSuspense.alternate; 18885 18886 if (_alternate !== null) { 18887 _alternate.lanes = mergeLanes(_alternate.lanes, renderLanes); 18888 } // This is intentionally passing this fiber as the parent 18889 // because we want to schedule this fiber as having work 18890 // on its children. We'll use the childLanes on 18891 // this fiber to indicate that a context has changed. 18892 18893 18894 scheduleContextWorkOnParentPath(parentSuspense, renderLanes, workInProgress); 18895 nextFiber = fiber.sibling; 18896 } else { 18897 // Traverse down. 18898 nextFiber = fiber.child; 18899 } 18900 18901 if (nextFiber !== null) { 18902 // Set the return pointer of the child to the work-in-progress fiber. 18903 nextFiber.return = fiber; 18904 } else { 18905 // No child. Traverse to next sibling. 18906 nextFiber = fiber; 18907 18908 while (nextFiber !== null) { 18909 if (nextFiber === workInProgress) { 18910 // We're back to the root of this subtree. Exit. 18911 nextFiber = null; 18912 break; 18913 } 18914 18915 var sibling = nextFiber.sibling; 18916 18917 if (sibling !== null) { 18918 // Set the return pointer of the sibling to the work-in-progress fiber. 18919 sibling.return = nextFiber.return; 18920 nextFiber = sibling; 18921 break; 18922 } // No more siblings. Traverse up. 18923 18924 18925 nextFiber = nextFiber.return; 18926 } 18927 } 18928 18929 fiber = nextFiber; 18930 } 18931} 18932function prepareToReadContext(workInProgress, renderLanes) { 18933 currentlyRenderingFiber = workInProgress; 18934 lastContextDependency = null; 18935 lastFullyObservedContext = null; 18936 var dependencies = workInProgress.dependencies; 18937 18938 if (dependencies !== null) { 18939 { 18940 var firstContext = dependencies.firstContext; 18941 18942 if (firstContext !== null) { 18943 if (includesSomeLane(dependencies.lanes, renderLanes)) { 18944 // Context list has a pending update. Mark that this fiber performed work. 18945 markWorkInProgressReceivedUpdate(); 18946 } // Reset the work-in-progress list 18947 18948 18949 dependencies.firstContext = null; 18950 } 18951 } 18952 } 18953} 18954function readContext(context) { 18955 { 18956 // This warning would fire if you read context inside a Hook like useMemo. 18957 // Unlike the class check below, it's not enforced in production for perf. 18958 if (isDisallowedContextReadInDEV) { 18959 error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().'); 18960 } 18961 } 18962 18963 var value = context._currentValue ; 18964 18965 if (lastFullyObservedContext === context) ; else { 18966 var contextItem = { 18967 context: context, 18968 memoizedValue: value, 18969 next: null 18970 }; 18971 18972 if (lastContextDependency === null) { 18973 if (currentlyRenderingFiber === null) { 18974 throw new Error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().'); 18975 } // This is the first dependency for this component. Create a new list. 18976 18977 18978 lastContextDependency = contextItem; 18979 currentlyRenderingFiber.dependencies = { 18980 lanes: NoLanes, 18981 firstContext: contextItem 18982 }; 18983 } else { 18984 // Append a new context item. 18985 lastContextDependency = lastContextDependency.next = contextItem; 18986 } 18987 } 18988 18989 return value; 18990} 18991 18992// render. When this render exits, either because it finishes or because it is 18993// interrupted, the interleaved updates will be transferred onto the main part 18994// of the queue. 18995 18996var concurrentQueues = null; 18997function pushConcurrentUpdateQueue(queue) { 18998 if (concurrentQueues === null) { 18999 concurrentQueues = [queue]; 19000 } else { 19001 concurrentQueues.push(queue); 19002 } 19003} 19004function finishQueueingConcurrentUpdates() { 19005 // Transfer the interleaved updates onto the main queue. Each queue has a 19006 // `pending` field and an `interleaved` field. When they are not null, they 19007 // point to the last node in a circular linked list. We need to append the 19008 // interleaved list to the end of the pending list by joining them into a 19009 // single, circular list. 19010 if (concurrentQueues !== null) { 19011 for (var i = 0; i < concurrentQueues.length; i++) { 19012 var queue = concurrentQueues[i]; 19013 var lastInterleavedUpdate = queue.interleaved; 19014 19015 if (lastInterleavedUpdate !== null) { 19016 queue.interleaved = null; 19017 var firstInterleavedUpdate = lastInterleavedUpdate.next; 19018 var lastPendingUpdate = queue.pending; 19019 19020 if (lastPendingUpdate !== null) { 19021 var firstPendingUpdate = lastPendingUpdate.next; 19022 lastPendingUpdate.next = firstInterleavedUpdate; 19023 lastInterleavedUpdate.next = firstPendingUpdate; 19024 } 19025 19026 queue.pending = lastInterleavedUpdate; 19027 } 19028 } 19029 19030 concurrentQueues = null; 19031 } 19032} 19033function enqueueConcurrentHookUpdate(fiber, queue, update, lane) { 19034 var interleaved = queue.interleaved; 19035 19036 if (interleaved === null) { 19037 // This is the first update. Create a circular list. 19038 update.next = update; // At the end of the current render, this queue's interleaved updates will 19039 // be transferred to the pending queue. 19040 19041 pushConcurrentUpdateQueue(queue); 19042 } else { 19043 update.next = interleaved.next; 19044 interleaved.next = update; 19045 } 19046 19047 queue.interleaved = update; 19048 return markUpdateLaneFromFiberToRoot(fiber, lane); 19049} 19050function enqueueConcurrentHookUpdateAndEagerlyBailout(fiber, queue, update, lane) { 19051 var interleaved = queue.interleaved; 19052 19053 if (interleaved === null) { 19054 // This is the first update. Create a circular list. 19055 update.next = update; // At the end of the current render, this queue's interleaved updates will 19056 // be transferred to the pending queue. 19057 19058 pushConcurrentUpdateQueue(queue); 19059 } else { 19060 update.next = interleaved.next; 19061 interleaved.next = update; 19062 } 19063 19064 queue.interleaved = update; 19065} 19066function enqueueConcurrentClassUpdate(fiber, queue, update, lane) { 19067 var interleaved = queue.interleaved; 19068 19069 if (interleaved === null) { 19070 // This is the first update. Create a circular list. 19071 update.next = update; // At the end of the current render, this queue's interleaved updates will 19072 // be transferred to the pending queue. 19073 19074 pushConcurrentUpdateQueue(queue); 19075 } else { 19076 update.next = interleaved.next; 19077 interleaved.next = update; 19078 } 19079 19080 queue.interleaved = update; 19081 return markUpdateLaneFromFiberToRoot(fiber, lane); 19082} 19083function enqueueConcurrentRenderForLane(fiber, lane) { 19084 return markUpdateLaneFromFiberToRoot(fiber, lane); 19085} // Calling this function outside this module should only be done for backwards 19086// compatibility and should always be accompanied by a warning. 19087 19088var unsafe_markUpdateLaneFromFiberToRoot = markUpdateLaneFromFiberToRoot; 19089 19090function markUpdateLaneFromFiberToRoot(sourceFiber, lane) { 19091 // Update the source fiber's lanes 19092 sourceFiber.lanes = mergeLanes(sourceFiber.lanes, lane); 19093 var alternate = sourceFiber.alternate; 19094 19095 if (alternate !== null) { 19096 alternate.lanes = mergeLanes(alternate.lanes, lane); 19097 } 19098 19099 { 19100 if (alternate === null && (sourceFiber.flags & (Placement | Hydrating)) !== NoFlags) { 19101 warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber); 19102 } 19103 } // Walk the parent path to the root and update the child lanes. 19104 19105 19106 var node = sourceFiber; 19107 var parent = sourceFiber.return; 19108 19109 while (parent !== null) { 19110 parent.childLanes = mergeLanes(parent.childLanes, lane); 19111 alternate = parent.alternate; 19112 19113 if (alternate !== null) { 19114 alternate.childLanes = mergeLanes(alternate.childLanes, lane); 19115 } else { 19116 { 19117 if ((parent.flags & (Placement | Hydrating)) !== NoFlags) { 19118 warnAboutUpdateOnNotYetMountedFiberInDEV(sourceFiber); 19119 } 19120 } 19121 } 19122 19123 node = parent; 19124 parent = parent.return; 19125 } 19126 19127 if (node.tag === HostRoot) { 19128 var root = node.stateNode; 19129 return root; 19130 } else { 19131 return null; 19132 } 19133} 19134 19135var UpdateState = 0; 19136var ReplaceState = 1; 19137var ForceUpdate = 2; 19138var CaptureUpdate = 3; // Global state that is reset at the beginning of calling `processUpdateQueue`. 19139// It should only be read right after calling `processUpdateQueue`, via 19140// `checkHasForceUpdateAfterProcessing`. 19141 19142var hasForceUpdate = false; 19143var didWarnUpdateInsideUpdate; 19144var currentlyProcessingQueue; 19145 19146{ 19147 didWarnUpdateInsideUpdate = false; 19148 currentlyProcessingQueue = null; 19149} 19150 19151function initializeUpdateQueue(fiber) { 19152 var queue = { 19153 baseState: fiber.memoizedState, 19154 firstBaseUpdate: null, 19155 lastBaseUpdate: null, 19156 shared: { 19157 pending: null, 19158 interleaved: null, 19159 lanes: NoLanes 19160 }, 19161 effects: null 19162 }; 19163 fiber.updateQueue = queue; 19164} 19165function cloneUpdateQueue(current, workInProgress) { 19166 // Clone the update queue from current. Unless it's already a clone. 19167 var queue = workInProgress.updateQueue; 19168 var currentQueue = current.updateQueue; 19169 19170 if (queue === currentQueue) { 19171 var clone = { 19172 baseState: currentQueue.baseState, 19173 firstBaseUpdate: currentQueue.firstBaseUpdate, 19174 lastBaseUpdate: currentQueue.lastBaseUpdate, 19175 shared: currentQueue.shared, 19176 effects: currentQueue.effects 19177 }; 19178 workInProgress.updateQueue = clone; 19179 } 19180} 19181function createUpdate(eventTime, lane) { 19182 var update = { 19183 eventTime: eventTime, 19184 lane: lane, 19185 tag: UpdateState, 19186 payload: null, 19187 callback: null, 19188 next: null 19189 }; 19190 return update; 19191} 19192function enqueueUpdate(fiber, update, lane) { 19193 var updateQueue = fiber.updateQueue; 19194 19195 if (updateQueue === null) { 19196 // Only occurs if the fiber has been unmounted. 19197 return null; 19198 } 19199 19200 var sharedQueue = updateQueue.shared; 19201 19202 { 19203 if (currentlyProcessingQueue === sharedQueue && !didWarnUpdateInsideUpdate) { 19204 error('An update (setState, replaceState, or forceUpdate) was scheduled ' + 'from inside an update function. Update functions should be pure, ' + 'with zero side-effects. Consider using componentDidUpdate or a ' + 'callback.'); 19205 19206 didWarnUpdateInsideUpdate = true; 19207 } 19208 } 19209 19210 if (isUnsafeClassRenderPhaseUpdate()) { 19211 // This is an unsafe render phase update. Add directly to the update 19212 // queue so we can process it immediately during the current render. 19213 var pending = sharedQueue.pending; 19214 19215 if (pending === null) { 19216 // This is the first update. Create a circular list. 19217 update.next = update; 19218 } else { 19219 update.next = pending.next; 19220 pending.next = update; 19221 } 19222 19223 sharedQueue.pending = update; // Update the childLanes even though we're most likely already rendering 19224 // this fiber. This is for backwards compatibility in the case where you 19225 // update a different component during render phase than the one that is 19226 // currently renderings (a pattern that is accompanied by a warning). 19227 19228 return unsafe_markUpdateLaneFromFiberToRoot(fiber, lane); 19229 } else { 19230 return enqueueConcurrentClassUpdate(fiber, sharedQueue, update, lane); 19231 } 19232} 19233function entangleTransitions(root, fiber, lane) { 19234 var updateQueue = fiber.updateQueue; 19235 19236 if (updateQueue === null) { 19237 // Only occurs if the fiber has been unmounted. 19238 return; 19239 } 19240 19241 var sharedQueue = updateQueue.shared; 19242 19243 if (isTransitionLane(lane)) { 19244 var queueLanes = sharedQueue.lanes; // If any entangled lanes are no longer pending on the root, then they must 19245 // have finished. We can remove them from the shared queue, which represents 19246 // a superset of the actually pending lanes. In some cases we may entangle 19247 // more than we need to, but that's OK. In fact it's worse if we *don't* 19248 // entangle when we should. 19249 19250 queueLanes = intersectLanes(queueLanes, root.pendingLanes); // Entangle the new transition lane with the other transition lanes. 19251 19252 var newQueueLanes = mergeLanes(queueLanes, lane); 19253 sharedQueue.lanes = newQueueLanes; // Even if queue.lanes already include lane, we don't know for certain if 19254 // the lane finished since the last time we entangled it. So we need to 19255 // entangle it again, just to be sure. 19256 19257 markRootEntangled(root, newQueueLanes); 19258 } 19259} 19260function enqueueCapturedUpdate(workInProgress, capturedUpdate) { 19261 // Captured updates are updates that are thrown by a child during the render 19262 // phase. They should be discarded if the render is aborted. Therefore, 19263 // we should only put them on the work-in-progress queue, not the current one. 19264 var queue = workInProgress.updateQueue; // Check if the work-in-progress queue is a clone. 19265 19266 var current = workInProgress.alternate; 19267 19268 if (current !== null) { 19269 var currentQueue = current.updateQueue; 19270 19271 if (queue === currentQueue) { 19272 // The work-in-progress queue is the same as current. This happens when 19273 // we bail out on a parent fiber that then captures an error thrown by 19274 // a child. Since we want to append the update only to the work-in 19275 // -progress queue, we need to clone the updates. We usually clone during 19276 // processUpdateQueue, but that didn't happen in this case because we 19277 // skipped over the parent when we bailed out. 19278 var newFirst = null; 19279 var newLast = null; 19280 var firstBaseUpdate = queue.firstBaseUpdate; 19281 19282 if (firstBaseUpdate !== null) { 19283 // Loop through the updates and clone them. 19284 var update = firstBaseUpdate; 19285 19286 do { 19287 var clone = { 19288 eventTime: update.eventTime, 19289 lane: update.lane, 19290 tag: update.tag, 19291 payload: update.payload, 19292 callback: update.callback, 19293 next: null 19294 }; 19295 19296 if (newLast === null) { 19297 newFirst = newLast = clone; 19298 } else { 19299 newLast.next = clone; 19300 newLast = clone; 19301 } 19302 19303 update = update.next; 19304 } while (update !== null); // Append the captured update the end of the cloned list. 19305 19306 19307 if (newLast === null) { 19308 newFirst = newLast = capturedUpdate; 19309 } else { 19310 newLast.next = capturedUpdate; 19311 newLast = capturedUpdate; 19312 } 19313 } else { 19314 // There are no base updates. 19315 newFirst = newLast = capturedUpdate; 19316 } 19317 19318 queue = { 19319 baseState: currentQueue.baseState, 19320 firstBaseUpdate: newFirst, 19321 lastBaseUpdate: newLast, 19322 shared: currentQueue.shared, 19323 effects: currentQueue.effects 19324 }; 19325 workInProgress.updateQueue = queue; 19326 return; 19327 } 19328 } // Append the update to the end of the list. 19329 19330 19331 var lastBaseUpdate = queue.lastBaseUpdate; 19332 19333 if (lastBaseUpdate === null) { 19334 queue.firstBaseUpdate = capturedUpdate; 19335 } else { 19336 lastBaseUpdate.next = capturedUpdate; 19337 } 19338 19339 queue.lastBaseUpdate = capturedUpdate; 19340} 19341 19342function getStateFromUpdate(workInProgress, queue, update, prevState, nextProps, instance) { 19343 switch (update.tag) { 19344 case ReplaceState: 19345 { 19346 var payload = update.payload; 19347 19348 if (typeof payload === 'function') { 19349 // Updater function 19350 { 19351 enterDisallowedContextReadInDEV(); 19352 } 19353 19354 var nextState = payload.call(instance, prevState, nextProps); 19355 19356 { 19357 if ( workInProgress.mode & StrictLegacyMode) { 19358 setIsStrictModeForDevtools(true); 19359 19360 try { 19361 payload.call(instance, prevState, nextProps); 19362 } finally { 19363 setIsStrictModeForDevtools(false); 19364 } 19365 } 19366 19367 exitDisallowedContextReadInDEV(); 19368 } 19369 19370 return nextState; 19371 } // State object 19372 19373 19374 return payload; 19375 } 19376 19377 case CaptureUpdate: 19378 { 19379 workInProgress.flags = workInProgress.flags & ~ShouldCapture | DidCapture; 19380 } 19381 // Intentional fallthrough 19382 19383 case UpdateState: 19384 { 19385 var _payload = update.payload; 19386 var partialState; 19387 19388 if (typeof _payload === 'function') { 19389 // Updater function 19390 { 19391 enterDisallowedContextReadInDEV(); 19392 } 19393 19394 partialState = _payload.call(instance, prevState, nextProps); 19395 19396 { 19397 if ( workInProgress.mode & StrictLegacyMode) { 19398 setIsStrictModeForDevtools(true); 19399 19400 try { 19401 _payload.call(instance, prevState, nextProps); 19402 } finally { 19403 setIsStrictModeForDevtools(false); 19404 } 19405 } 19406 19407 exitDisallowedContextReadInDEV(); 19408 } 19409 } else { 19410 // Partial state object 19411 partialState = _payload; 19412 } 19413 19414 if (partialState === null || partialState === undefined) { 19415 // Null and undefined are treated as no-ops. 19416 return prevState; 19417 } // Merge the partial state and the previous state. 19418 19419 19420 return assign({}, prevState, partialState); 19421 } 19422 19423 case ForceUpdate: 19424 { 19425 hasForceUpdate = true; 19426 return prevState; 19427 } 19428 } 19429 19430 return prevState; 19431} 19432 19433function processUpdateQueue(workInProgress, props, instance, renderLanes) { 19434 // This is always non-null on a ClassComponent or HostRoot 19435 var queue = workInProgress.updateQueue; 19436 hasForceUpdate = false; 19437 19438 { 19439 currentlyProcessingQueue = queue.shared; 19440 } 19441 19442 var firstBaseUpdate = queue.firstBaseUpdate; 19443 var lastBaseUpdate = queue.lastBaseUpdate; // Check if there are pending updates. If so, transfer them to the base queue. 19444 19445 var pendingQueue = queue.shared.pending; 19446 19447 if (pendingQueue !== null) { 19448 queue.shared.pending = null; // The pending queue is circular. Disconnect the pointer between first 19449 // and last so that it's non-circular. 19450 19451 var lastPendingUpdate = pendingQueue; 19452 var firstPendingUpdate = lastPendingUpdate.next; 19453 lastPendingUpdate.next = null; // Append pending updates to base queue 19454 19455 if (lastBaseUpdate === null) { 19456 firstBaseUpdate = firstPendingUpdate; 19457 } else { 19458 lastBaseUpdate.next = firstPendingUpdate; 19459 } 19460 19461 lastBaseUpdate = lastPendingUpdate; // If there's a current queue, and it's different from the base queue, then 19462 // we need to transfer the updates to that queue, too. Because the base 19463 // queue is a singly-linked list with no cycles, we can append to both 19464 // lists and take advantage of structural sharing. 19465 // TODO: Pass `current` as argument 19466 19467 var current = workInProgress.alternate; 19468 19469 if (current !== null) { 19470 // This is always non-null on a ClassComponent or HostRoot 19471 var currentQueue = current.updateQueue; 19472 var currentLastBaseUpdate = currentQueue.lastBaseUpdate; 19473 19474 if (currentLastBaseUpdate !== lastBaseUpdate) { 19475 if (currentLastBaseUpdate === null) { 19476 currentQueue.firstBaseUpdate = firstPendingUpdate; 19477 } else { 19478 currentLastBaseUpdate.next = firstPendingUpdate; 19479 } 19480 19481 currentQueue.lastBaseUpdate = lastPendingUpdate; 19482 } 19483 } 19484 } // These values may change as we process the queue. 19485 19486 19487 if (firstBaseUpdate !== null) { 19488 // Iterate through the list of updates to compute the result. 19489 var newState = queue.baseState; // TODO: Don't need to accumulate this. Instead, we can remove renderLanes 19490 // from the original lanes. 19491 19492 var newLanes = NoLanes; 19493 var newBaseState = null; 19494 var newFirstBaseUpdate = null; 19495 var newLastBaseUpdate = null; 19496 var update = firstBaseUpdate; 19497 19498 do { 19499 var updateLane = update.lane; 19500 var updateEventTime = update.eventTime; 19501 19502 if (!isSubsetOfLanes(renderLanes, updateLane)) { 19503 // Priority is insufficient. Skip this update. If this is the first 19504 // skipped update, the previous update/state is the new base 19505 // update/state. 19506 var clone = { 19507 eventTime: updateEventTime, 19508 lane: updateLane, 19509 tag: update.tag, 19510 payload: update.payload, 19511 callback: update.callback, 19512 next: null 19513 }; 19514 19515 if (newLastBaseUpdate === null) { 19516 newFirstBaseUpdate = newLastBaseUpdate = clone; 19517 newBaseState = newState; 19518 } else { 19519 newLastBaseUpdate = newLastBaseUpdate.next = clone; 19520 } // Update the remaining priority in the queue. 19521 19522 19523 newLanes = mergeLanes(newLanes, updateLane); 19524 } else { 19525 // This update does have sufficient priority. 19526 if (newLastBaseUpdate !== null) { 19527 var _clone = { 19528 eventTime: updateEventTime, 19529 // This update is going to be committed so we never want uncommit 19530 // it. Using NoLane works because 0 is a subset of all bitmasks, so 19531 // this will never be skipped by the check above. 19532 lane: NoLane, 19533 tag: update.tag, 19534 payload: update.payload, 19535 callback: update.callback, 19536 next: null 19537 }; 19538 newLastBaseUpdate = newLastBaseUpdate.next = _clone; 19539 } // Process this update. 19540 19541 19542 newState = getStateFromUpdate(workInProgress, queue, update, newState, props, instance); 19543 var callback = update.callback; 19544 19545 if (callback !== null && // If the update was already committed, we should not queue its 19546 // callback again. 19547 update.lane !== NoLane) { 19548 workInProgress.flags |= Callback; 19549 var effects = queue.effects; 19550 19551 if (effects === null) { 19552 queue.effects = [update]; 19553 } else { 19554 effects.push(update); 19555 } 19556 } 19557 } 19558 19559 update = update.next; 19560 19561 if (update === null) { 19562 pendingQueue = queue.shared.pending; 19563 19564 if (pendingQueue === null) { 19565 break; 19566 } else { 19567 // An update was scheduled from inside a reducer. Add the new 19568 // pending updates to the end of the list and keep processing. 19569 var _lastPendingUpdate = pendingQueue; // Intentionally unsound. Pending updates form a circular list, but we 19570 // unravel them when transferring them to the base queue. 19571 19572 var _firstPendingUpdate = _lastPendingUpdate.next; 19573 _lastPendingUpdate.next = null; 19574 update = _firstPendingUpdate; 19575 queue.lastBaseUpdate = _lastPendingUpdate; 19576 queue.shared.pending = null; 19577 } 19578 } 19579 } while (true); 19580 19581 if (newLastBaseUpdate === null) { 19582 newBaseState = newState; 19583 } 19584 19585 queue.baseState = newBaseState; 19586 queue.firstBaseUpdate = newFirstBaseUpdate; 19587 queue.lastBaseUpdate = newLastBaseUpdate; // Interleaved updates are stored on a separate queue. We aren't going to 19588 // process them during this render, but we do need to track which lanes 19589 // are remaining. 19590 19591 var lastInterleaved = queue.shared.interleaved; 19592 19593 if (lastInterleaved !== null) { 19594 var interleaved = lastInterleaved; 19595 19596 do { 19597 newLanes = mergeLanes(newLanes, interleaved.lane); 19598 interleaved = interleaved.next; 19599 } while (interleaved !== lastInterleaved); 19600 } else if (firstBaseUpdate === null) { 19601 // `queue.lanes` is used for entangling transitions. We can set it back to 19602 // zero once the queue is empty. 19603 queue.shared.lanes = NoLanes; 19604 } // Set the remaining expiration time to be whatever is remaining in the queue. 19605 // This should be fine because the only two other things that contribute to 19606 // expiration time are props and context. We're already in the middle of the 19607 // begin phase by the time we start processing the queue, so we've already 19608 // dealt with the props. Context in components that specify 19609 // shouldComponentUpdate is tricky; but we'll have to account for 19610 // that regardless. 19611 19612 19613 markSkippedUpdateLanes(newLanes); 19614 workInProgress.lanes = newLanes; 19615 workInProgress.memoizedState = newState; 19616 } 19617 19618 { 19619 currentlyProcessingQueue = null; 19620 } 19621} 19622 19623function callCallback(callback, context) { 19624 if (typeof callback !== 'function') { 19625 throw new Error('Invalid argument passed as callback. Expected a function. Instead ' + ("received: " + callback)); 19626 } 19627 19628 callback.call(context); 19629} 19630 19631function resetHasForceUpdateBeforeProcessing() { 19632 hasForceUpdate = false; 19633} 19634function checkHasForceUpdateAfterProcessing() { 19635 return hasForceUpdate; 19636} 19637function commitUpdateQueue(finishedWork, finishedQueue, instance) { 19638 // Commit the effects 19639 var effects = finishedQueue.effects; 19640 finishedQueue.effects = null; 19641 19642 if (effects !== null) { 19643 for (var i = 0; i < effects.length; i++) { 19644 var effect = effects[i]; 19645 var callback = effect.callback; 19646 19647 if (callback !== null) { 19648 effect.callback = null; 19649 callCallback(callback, instance); 19650 } 19651 } 19652 } 19653} 19654 19655var fakeInternalInstance = {}; // React.Component uses a shared frozen object by default. 19656// We'll use it to determine whether we need to initialize legacy refs. 19657 19658var emptyRefsObject = new React.Component().refs; 19659var didWarnAboutStateAssignmentForComponent; 19660var didWarnAboutUninitializedState; 19661var didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate; 19662var didWarnAboutLegacyLifecyclesAndDerivedState; 19663var didWarnAboutUndefinedDerivedState; 19664var warnOnUndefinedDerivedState; 19665var warnOnInvalidCallback; 19666var didWarnAboutDirectlyAssigningPropsToState; 19667var didWarnAboutContextTypeAndContextTypes; 19668var didWarnAboutInvalidateContextType; 19669 19670{ 19671 didWarnAboutStateAssignmentForComponent = new Set(); 19672 didWarnAboutUninitializedState = new Set(); 19673 didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate = new Set(); 19674 didWarnAboutLegacyLifecyclesAndDerivedState = new Set(); 19675 didWarnAboutDirectlyAssigningPropsToState = new Set(); 19676 didWarnAboutUndefinedDerivedState = new Set(); 19677 didWarnAboutContextTypeAndContextTypes = new Set(); 19678 didWarnAboutInvalidateContextType = new Set(); 19679 var didWarnOnInvalidCallback = new Set(); 19680 19681 warnOnInvalidCallback = function (callback, callerName) { 19682 if (callback === null || typeof callback === 'function') { 19683 return; 19684 } 19685 19686 var key = callerName + '_' + callback; 19687 19688 if (!didWarnOnInvalidCallback.has(key)) { 19689 didWarnOnInvalidCallback.add(key); 19690 19691 error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback); 19692 } 19693 }; 19694 19695 warnOnUndefinedDerivedState = function (type, partialState) { 19696 if (partialState === undefined) { 19697 var componentName = getComponentNameFromType(type) || 'Component'; 19698 19699 if (!didWarnAboutUndefinedDerivedState.has(componentName)) { 19700 didWarnAboutUndefinedDerivedState.add(componentName); 19701 19702 error('%s.getDerivedStateFromProps(): A valid state object (or null) must be returned. ' + 'You have returned undefined.', componentName); 19703 } 19704 } 19705 }; // This is so gross but it's at least non-critical and can be removed if 19706 // it causes problems. This is meant to give a nicer error message for 19707 // ReactDOM15.unstable_renderSubtreeIntoContainer(reactDOM16Component, 19708 // ...)) which otherwise throws a "_processChildContext is not a function" 19709 // exception. 19710 19711 19712 Object.defineProperty(fakeInternalInstance, '_processChildContext', { 19713 enumerable: false, 19714 value: function () { 19715 throw new Error('_processChildContext is not available in React 16+. This likely ' + 'means you have multiple copies of React and are attempting to nest ' + 'a React 15 tree inside a React 16 tree using ' + "unstable_renderSubtreeIntoContainer, which isn't supported. Try " + 'to make sure you have only one copy of React (and ideally, switch ' + 'to ReactDOM.createPortal).'); 19716 } 19717 }); 19718 Object.freeze(fakeInternalInstance); 19719} 19720 19721function applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, nextProps) { 19722 var prevState = workInProgress.memoizedState; 19723 var partialState = getDerivedStateFromProps(nextProps, prevState); 19724 19725 { 19726 if ( workInProgress.mode & StrictLegacyMode) { 19727 setIsStrictModeForDevtools(true); 19728 19729 try { 19730 // Invoke the function an extra time to help detect side-effects. 19731 partialState = getDerivedStateFromProps(nextProps, prevState); 19732 } finally { 19733 setIsStrictModeForDevtools(false); 19734 } 19735 } 19736 19737 warnOnUndefinedDerivedState(ctor, partialState); 19738 } // Merge the partial state and the previous state. 19739 19740 19741 var memoizedState = partialState === null || partialState === undefined ? prevState : assign({}, prevState, partialState); 19742 workInProgress.memoizedState = memoizedState; // Once the update queue is empty, persist the derived state onto the 19743 // base state. 19744 19745 if (workInProgress.lanes === NoLanes) { 19746 // Queue is always non-null for classes 19747 var updateQueue = workInProgress.updateQueue; 19748 updateQueue.baseState = memoizedState; 19749 } 19750} 19751 19752var classComponentUpdater = { 19753 isMounted: isMounted, 19754 enqueueSetState: function (inst, payload, callback) { 19755 var fiber = get(inst); 19756 var eventTime = requestEventTime(); 19757 var lane = requestUpdateLane(fiber); 19758 var update = createUpdate(eventTime, lane); 19759 update.payload = payload; 19760 19761 if (callback !== undefined && callback !== null) { 19762 { 19763 warnOnInvalidCallback(callback, 'setState'); 19764 } 19765 19766 update.callback = callback; 19767 } 19768 19769 var root = enqueueUpdate(fiber, update, lane); 19770 19771 if (root !== null) { 19772 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 19773 entangleTransitions(root, fiber, lane); 19774 } 19775 19776 { 19777 markStateUpdateScheduled(fiber, lane); 19778 } 19779 }, 19780 enqueueReplaceState: function (inst, payload, callback) { 19781 var fiber = get(inst); 19782 var eventTime = requestEventTime(); 19783 var lane = requestUpdateLane(fiber); 19784 var update = createUpdate(eventTime, lane); 19785 update.tag = ReplaceState; 19786 update.payload = payload; 19787 19788 if (callback !== undefined && callback !== null) { 19789 { 19790 warnOnInvalidCallback(callback, 'replaceState'); 19791 } 19792 19793 update.callback = callback; 19794 } 19795 19796 var root = enqueueUpdate(fiber, update, lane); 19797 19798 if (root !== null) { 19799 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 19800 entangleTransitions(root, fiber, lane); 19801 } 19802 19803 { 19804 markStateUpdateScheduled(fiber, lane); 19805 } 19806 }, 19807 enqueueForceUpdate: function (inst, callback) { 19808 var fiber = get(inst); 19809 var eventTime = requestEventTime(); 19810 var lane = requestUpdateLane(fiber); 19811 var update = createUpdate(eventTime, lane); 19812 update.tag = ForceUpdate; 19813 19814 if (callback !== undefined && callback !== null) { 19815 { 19816 warnOnInvalidCallback(callback, 'forceUpdate'); 19817 } 19818 19819 update.callback = callback; 19820 } 19821 19822 var root = enqueueUpdate(fiber, update, lane); 19823 19824 if (root !== null) { 19825 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 19826 entangleTransitions(root, fiber, lane); 19827 } 19828 19829 { 19830 markForceUpdateScheduled(fiber, lane); 19831 } 19832 } 19833}; 19834 19835function checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) { 19836 var instance = workInProgress.stateNode; 19837 19838 if (typeof instance.shouldComponentUpdate === 'function') { 19839 var shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext); 19840 19841 { 19842 if ( workInProgress.mode & StrictLegacyMode) { 19843 setIsStrictModeForDevtools(true); 19844 19845 try { 19846 // Invoke the function an extra time to help detect side-effects. 19847 shouldUpdate = instance.shouldComponentUpdate(newProps, newState, nextContext); 19848 } finally { 19849 setIsStrictModeForDevtools(false); 19850 } 19851 } 19852 19853 if (shouldUpdate === undefined) { 19854 error('%s.shouldComponentUpdate(): Returned undefined instead of a ' + 'boolean value. Make sure to return true or false.', getComponentNameFromType(ctor) || 'Component'); 19855 } 19856 } 19857 19858 return shouldUpdate; 19859 } 19860 19861 if (ctor.prototype && ctor.prototype.isPureReactComponent) { 19862 return !shallowEqual(oldProps, newProps) || !shallowEqual(oldState, newState); 19863 } 19864 19865 return true; 19866} 19867 19868function checkClassInstance(workInProgress, ctor, newProps) { 19869 var instance = workInProgress.stateNode; 19870 19871 { 19872 var name = getComponentNameFromType(ctor) || 'Component'; 19873 var renderPresent = instance.render; 19874 19875 if (!renderPresent) { 19876 if (ctor.prototype && typeof ctor.prototype.render === 'function') { 19877 error('%s(...): No `render` method found on the returned component ' + 'instance: did you accidentally return an object from the constructor?', name); 19878 } else { 19879 error('%s(...): No `render` method found on the returned component ' + 'instance: you may have forgotten to define `render`.', name); 19880 } 19881 } 19882 19883 if (instance.getInitialState && !instance.getInitialState.isReactClassApproved && !instance.state) { 19884 error('getInitialState was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Did you mean to define a state property instead?', name); 19885 } 19886 19887 if (instance.getDefaultProps && !instance.getDefaultProps.isReactClassApproved) { 19888 error('getDefaultProps was defined on %s, a plain JavaScript class. ' + 'This is only supported for classes created using React.createClass. ' + 'Use a static property to define defaultProps instead.', name); 19889 } 19890 19891 if (instance.propTypes) { 19892 error('propTypes was defined as an instance property on %s. Use a static ' + 'property to define propTypes instead.', name); 19893 } 19894 19895 if (instance.contextType) { 19896 error('contextType was defined as an instance property on %s. Use a static ' + 'property to define contextType instead.', name); 19897 } 19898 19899 { 19900 if (instance.contextTypes) { 19901 error('contextTypes was defined as an instance property on %s. Use a static ' + 'property to define contextTypes instead.', name); 19902 } 19903 19904 if (ctor.contextType && ctor.contextTypes && !didWarnAboutContextTypeAndContextTypes.has(ctor)) { 19905 didWarnAboutContextTypeAndContextTypes.add(ctor); 19906 19907 error('%s declares both contextTypes and contextType static properties. ' + 'The legacy contextTypes property will be ignored.', name); 19908 } 19909 } 19910 19911 if (typeof instance.componentShouldUpdate === 'function') { 19912 error('%s has a method called ' + 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' + 'The name is phrased as a question because the function is ' + 'expected to return a value.', name); 19913 } 19914 19915 if (ctor.prototype && ctor.prototype.isPureReactComponent && typeof instance.shouldComponentUpdate !== 'undefined') { 19916 error('%s has a method called shouldComponentUpdate(). ' + 'shouldComponentUpdate should not be used when extending React.PureComponent. ' + 'Please extend React.Component if shouldComponentUpdate is used.', getComponentNameFromType(ctor) || 'A pure component'); 19917 } 19918 19919 if (typeof instance.componentDidUnmount === 'function') { 19920 error('%s has a method called ' + 'componentDidUnmount(). But there is no such lifecycle method. ' + 'Did you mean componentWillUnmount()?', name); 19921 } 19922 19923 if (typeof instance.componentDidReceiveProps === 'function') { 19924 error('%s has a method called ' + 'componentDidReceiveProps(). But there is no such lifecycle method. ' + 'If you meant to update the state in response to changing props, ' + 'use componentWillReceiveProps(). If you meant to fetch data or ' + 'run side-effects or mutations after React has updated the UI, use componentDidUpdate().', name); 19925 } 19926 19927 if (typeof instance.componentWillRecieveProps === 'function') { 19928 error('%s has a method called ' + 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?', name); 19929 } 19930 19931 if (typeof instance.UNSAFE_componentWillRecieveProps === 'function') { 19932 error('%s has a method called ' + 'UNSAFE_componentWillRecieveProps(). Did you mean UNSAFE_componentWillReceiveProps()?', name); 19933 } 19934 19935 var hasMutatedProps = instance.props !== newProps; 19936 19937 if (instance.props !== undefined && hasMutatedProps) { 19938 error('%s(...): When calling super() in `%s`, make sure to pass ' + "up the same props that your component's constructor was passed.", name, name); 19939 } 19940 19941 if (instance.defaultProps) { 19942 error('Setting defaultProps as an instance property on %s is not supported and will be ignored.' + ' Instead, define defaultProps as a static property on %s.', name, name); 19943 } 19944 19945 if (typeof instance.getSnapshotBeforeUpdate === 'function' && typeof instance.componentDidUpdate !== 'function' && !didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.has(ctor)) { 19946 didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate.add(ctor); 19947 19948 error('%s: getSnapshotBeforeUpdate() should be used with componentDidUpdate(). ' + 'This component defines getSnapshotBeforeUpdate() only.', getComponentNameFromType(ctor)); 19949 } 19950 19951 if (typeof instance.getDerivedStateFromProps === 'function') { 19952 error('%s: getDerivedStateFromProps() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name); 19953 } 19954 19955 if (typeof instance.getDerivedStateFromError === 'function') { 19956 error('%s: getDerivedStateFromError() is defined as an instance method ' + 'and will be ignored. Instead, declare it as a static method.', name); 19957 } 19958 19959 if (typeof ctor.getSnapshotBeforeUpdate === 'function') { 19960 error('%s: getSnapshotBeforeUpdate() is defined as a static method ' + 'and will be ignored. Instead, declare it as an instance method.', name); 19961 } 19962 19963 var _state = instance.state; 19964 19965 if (_state && (typeof _state !== 'object' || isArray(_state))) { 19966 error('%s.state: must be set to an object or null', name); 19967 } 19968 19969 if (typeof instance.getChildContext === 'function' && typeof ctor.childContextTypes !== 'object') { 19970 error('%s.getChildContext(): childContextTypes must be defined in order to ' + 'use getChildContext().', name); 19971 } 19972 } 19973} 19974 19975function adoptClassInstance(workInProgress, instance) { 19976 instance.updater = classComponentUpdater; 19977 workInProgress.stateNode = instance; // The instance needs access to the fiber so that it can schedule updates 19978 19979 set(instance, workInProgress); 19980 19981 { 19982 instance._reactInternalInstance = fakeInternalInstance; 19983 } 19984} 19985 19986function constructClassInstance(workInProgress, ctor, props) { 19987 var isLegacyContextConsumer = false; 19988 var unmaskedContext = emptyContextObject; 19989 var context = emptyContextObject; 19990 var contextType = ctor.contextType; 19991 19992 { 19993 if ('contextType' in ctor) { 19994 var isValid = // Allow null for conditional declaration 19995 contextType === null || contextType !== undefined && contextType.$$typeof === REACT_CONTEXT_TYPE && contextType._context === undefined; // Not a <Context.Consumer> 19996 19997 if (!isValid && !didWarnAboutInvalidateContextType.has(ctor)) { 19998 didWarnAboutInvalidateContextType.add(ctor); 19999 var addendum = ''; 20000 20001 if (contextType === undefined) { 20002 addendum = ' However, it is set to undefined. ' + 'This can be caused by a typo or by mixing up named and default imports. ' + 'This can also happen due to a circular dependency, so ' + 'try moving the createContext() call to a separate file.'; 20003 } else if (typeof contextType !== 'object') { 20004 addendum = ' However, it is set to a ' + typeof contextType + '.'; 20005 } else if (contextType.$$typeof === REACT_PROVIDER_TYPE) { 20006 addendum = ' Did you accidentally pass the Context.Provider instead?'; 20007 } else if (contextType._context !== undefined) { 20008 // <Context.Consumer> 20009 addendum = ' Did you accidentally pass the Context.Consumer instead?'; 20010 } else { 20011 addendum = ' However, it is set to an object with keys {' + Object.keys(contextType).join(', ') + '}.'; 20012 } 20013 20014 error('%s defines an invalid contextType. ' + 'contextType should point to the Context object returned by React.createContext().%s', getComponentNameFromType(ctor) || 'Component', addendum); 20015 } 20016 } 20017 } 20018 20019 if (typeof contextType === 'object' && contextType !== null) { 20020 context = readContext(contextType); 20021 } else { 20022 unmaskedContext = getUnmaskedContext(workInProgress, ctor, true); 20023 var contextTypes = ctor.contextTypes; 20024 isLegacyContextConsumer = contextTypes !== null && contextTypes !== undefined; 20025 context = isLegacyContextConsumer ? getMaskedContext(workInProgress, unmaskedContext) : emptyContextObject; 20026 } 20027 20028 var instance = new ctor(props, context); // Instantiate twice to help detect side-effects. 20029 20030 { 20031 if ( workInProgress.mode & StrictLegacyMode) { 20032 setIsStrictModeForDevtools(true); 20033 20034 try { 20035 instance = new ctor(props, context); // eslint-disable-line no-new 20036 } finally { 20037 setIsStrictModeForDevtools(false); 20038 } 20039 } 20040 } 20041 20042 var state = workInProgress.memoizedState = instance.state !== null && instance.state !== undefined ? instance.state : null; 20043 adoptClassInstance(workInProgress, instance); 20044 20045 { 20046 if (typeof ctor.getDerivedStateFromProps === 'function' && state === null) { 20047 var componentName = getComponentNameFromType(ctor) || 'Component'; 20048 20049 if (!didWarnAboutUninitializedState.has(componentName)) { 20050 didWarnAboutUninitializedState.add(componentName); 20051 20052 error('`%s` uses `getDerivedStateFromProps` but its initial state is ' + '%s. This is not recommended. Instead, define the initial state by ' + 'assigning an object to `this.state` in the constructor of `%s`. ' + 'This ensures that `getDerivedStateFromProps` arguments have a consistent shape.', componentName, instance.state === null ? 'null' : 'undefined', componentName); 20053 } 20054 } // If new component APIs are defined, "unsafe" lifecycles won't be called. 20055 // Warn about these lifecycles if they are present. 20056 // Don't warn about react-lifecycles-compat polyfilled methods though. 20057 20058 20059 if (typeof ctor.getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function') { 20060 var foundWillMountName = null; 20061 var foundWillReceivePropsName = null; 20062 var foundWillUpdateName = null; 20063 20064 if (typeof instance.componentWillMount === 'function' && instance.componentWillMount.__suppressDeprecationWarning !== true) { 20065 foundWillMountName = 'componentWillMount'; 20066 } else if (typeof instance.UNSAFE_componentWillMount === 'function') { 20067 foundWillMountName = 'UNSAFE_componentWillMount'; 20068 } 20069 20070 if (typeof instance.componentWillReceiveProps === 'function' && instance.componentWillReceiveProps.__suppressDeprecationWarning !== true) { 20071 foundWillReceivePropsName = 'componentWillReceiveProps'; 20072 } else if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') { 20073 foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps'; 20074 } 20075 20076 if (typeof instance.componentWillUpdate === 'function' && instance.componentWillUpdate.__suppressDeprecationWarning !== true) { 20077 foundWillUpdateName = 'componentWillUpdate'; 20078 } else if (typeof instance.UNSAFE_componentWillUpdate === 'function') { 20079 foundWillUpdateName = 'UNSAFE_componentWillUpdate'; 20080 } 20081 20082 if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) { 20083 var _componentName = getComponentNameFromType(ctor) || 'Component'; 20084 20085 var newApiName = typeof ctor.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()'; 20086 20087 if (!didWarnAboutLegacyLifecyclesAndDerivedState.has(_componentName)) { 20088 didWarnAboutLegacyLifecyclesAndDerivedState.add(_componentName); 20089 20090 error('Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' + '%s uses %s but also contains the following legacy lifecycles:%s%s%s\n\n' + 'The above lifecycles should be removed. Learn more about this warning here:\n' + 'https://reactjs.org/link/unsafe-component-lifecycles', _componentName, newApiName, foundWillMountName !== null ? "\n " + foundWillMountName : '', foundWillReceivePropsName !== null ? "\n " + foundWillReceivePropsName : '', foundWillUpdateName !== null ? "\n " + foundWillUpdateName : ''); 20091 } 20092 } 20093 } 20094 } // Cache unmasked context so we can avoid recreating masked context unless necessary. 20095 // ReactFiberContext usually updates this cache but can't for newly-created instances. 20096 20097 20098 if (isLegacyContextConsumer) { 20099 cacheContext(workInProgress, unmaskedContext, context); 20100 } 20101 20102 return instance; 20103} 20104 20105function callComponentWillMount(workInProgress, instance) { 20106 var oldState = instance.state; 20107 20108 if (typeof instance.componentWillMount === 'function') { 20109 instance.componentWillMount(); 20110 } 20111 20112 if (typeof instance.UNSAFE_componentWillMount === 'function') { 20113 instance.UNSAFE_componentWillMount(); 20114 } 20115 20116 if (oldState !== instance.state) { 20117 { 20118 error('%s.componentWillMount(): Assigning directly to this.state is ' + "deprecated (except inside a component's " + 'constructor). Use setState instead.', getComponentNameFromFiber(workInProgress) || 'Component'); 20119 } 20120 20121 classComponentUpdater.enqueueReplaceState(instance, instance.state, null); 20122 } 20123} 20124 20125function callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext) { 20126 var oldState = instance.state; 20127 20128 if (typeof instance.componentWillReceiveProps === 'function') { 20129 instance.componentWillReceiveProps(newProps, nextContext); 20130 } 20131 20132 if (typeof instance.UNSAFE_componentWillReceiveProps === 'function') { 20133 instance.UNSAFE_componentWillReceiveProps(newProps, nextContext); 20134 } 20135 20136 if (instance.state !== oldState) { 20137 { 20138 var componentName = getComponentNameFromFiber(workInProgress) || 'Component'; 20139 20140 if (!didWarnAboutStateAssignmentForComponent.has(componentName)) { 20141 didWarnAboutStateAssignmentForComponent.add(componentName); 20142 20143 error('%s.componentWillReceiveProps(): Assigning directly to ' + "this.state is deprecated (except inside a component's " + 'constructor). Use setState instead.', componentName); 20144 } 20145 } 20146 20147 classComponentUpdater.enqueueReplaceState(instance, instance.state, null); 20148 } 20149} // Invokes the mount life-cycles on a previously never rendered instance. 20150 20151 20152function mountClassInstance(workInProgress, ctor, newProps, renderLanes) { 20153 { 20154 checkClassInstance(workInProgress, ctor, newProps); 20155 } 20156 20157 var instance = workInProgress.stateNode; 20158 instance.props = newProps; 20159 instance.state = workInProgress.memoizedState; 20160 instance.refs = emptyRefsObject; 20161 initializeUpdateQueue(workInProgress); 20162 var contextType = ctor.contextType; 20163 20164 if (typeof contextType === 'object' && contextType !== null) { 20165 instance.context = readContext(contextType); 20166 } else { 20167 var unmaskedContext = getUnmaskedContext(workInProgress, ctor, true); 20168 instance.context = getMaskedContext(workInProgress, unmaskedContext); 20169 } 20170 20171 { 20172 if (instance.state === newProps) { 20173 var componentName = getComponentNameFromType(ctor) || 'Component'; 20174 20175 if (!didWarnAboutDirectlyAssigningPropsToState.has(componentName)) { 20176 didWarnAboutDirectlyAssigningPropsToState.add(componentName); 20177 20178 error('%s: It is not recommended to assign props directly to state ' + "because updates to props won't be reflected in state. " + 'In most cases, it is better to use props directly.', componentName); 20179 } 20180 } 20181 20182 if (workInProgress.mode & StrictLegacyMode) { 20183 ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, instance); 20184 } 20185 20186 { 20187 ReactStrictModeWarnings.recordUnsafeLifecycleWarnings(workInProgress, instance); 20188 } 20189 } 20190 20191 instance.state = workInProgress.memoizedState; 20192 var getDerivedStateFromProps = ctor.getDerivedStateFromProps; 20193 20194 if (typeof getDerivedStateFromProps === 'function') { 20195 applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps); 20196 instance.state = workInProgress.memoizedState; 20197 } // In order to support react-lifecycles-compat polyfilled components, 20198 // Unsafe lifecycles should not be invoked for components using the new APIs. 20199 20200 20201 if (typeof ctor.getDerivedStateFromProps !== 'function' && typeof instance.getSnapshotBeforeUpdate !== 'function' && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) { 20202 callComponentWillMount(workInProgress, instance); // If we had additional state updates during this life-cycle, let's 20203 // process them now. 20204 20205 processUpdateQueue(workInProgress, newProps, instance, renderLanes); 20206 instance.state = workInProgress.memoizedState; 20207 } 20208 20209 if (typeof instance.componentDidMount === 'function') { 20210 var fiberFlags = Update; 20211 20212 { 20213 fiberFlags |= LayoutStatic; 20214 } 20215 20216 if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) { 20217 fiberFlags |= MountLayoutDev; 20218 } 20219 20220 workInProgress.flags |= fiberFlags; 20221 } 20222} 20223 20224function resumeMountClassInstance(workInProgress, ctor, newProps, renderLanes) { 20225 var instance = workInProgress.stateNode; 20226 var oldProps = workInProgress.memoizedProps; 20227 instance.props = oldProps; 20228 var oldContext = instance.context; 20229 var contextType = ctor.contextType; 20230 var nextContext = emptyContextObject; 20231 20232 if (typeof contextType === 'object' && contextType !== null) { 20233 nextContext = readContext(contextType); 20234 } else { 20235 var nextLegacyUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true); 20236 nextContext = getMaskedContext(workInProgress, nextLegacyUnmaskedContext); 20237 } 20238 20239 var getDerivedStateFromProps = ctor.getDerivedStateFromProps; 20240 var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what 20241 // ever the previously attempted to render - not the "current". However, 20242 // during componentDidUpdate we pass the "current" props. 20243 // In order to support react-lifecycles-compat polyfilled components, 20244 // Unsafe lifecycles should not be invoked for components using the new APIs. 20245 20246 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) { 20247 if (oldProps !== newProps || oldContext !== nextContext) { 20248 callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext); 20249 } 20250 } 20251 20252 resetHasForceUpdateBeforeProcessing(); 20253 var oldState = workInProgress.memoizedState; 20254 var newState = instance.state = oldState; 20255 processUpdateQueue(workInProgress, newProps, instance, renderLanes); 20256 newState = workInProgress.memoizedState; 20257 20258 if (oldProps === newProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing()) { 20259 // If an update was already in progress, we should schedule an Update 20260 // effect even though we're bailing out, so that cWU/cDU are called. 20261 if (typeof instance.componentDidMount === 'function') { 20262 var fiberFlags = Update; 20263 20264 { 20265 fiberFlags |= LayoutStatic; 20266 } 20267 20268 if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) { 20269 fiberFlags |= MountLayoutDev; 20270 } 20271 20272 workInProgress.flags |= fiberFlags; 20273 } 20274 20275 return false; 20276 } 20277 20278 if (typeof getDerivedStateFromProps === 'function') { 20279 applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps); 20280 newState = workInProgress.memoizedState; 20281 } 20282 20283 var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext); 20284 20285 if (shouldUpdate) { 20286 // In order to support react-lifecycles-compat polyfilled components, 20287 // Unsafe lifecycles should not be invoked for components using the new APIs. 20288 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillMount === 'function' || typeof instance.componentWillMount === 'function')) { 20289 if (typeof instance.componentWillMount === 'function') { 20290 instance.componentWillMount(); 20291 } 20292 20293 if (typeof instance.UNSAFE_componentWillMount === 'function') { 20294 instance.UNSAFE_componentWillMount(); 20295 } 20296 } 20297 20298 if (typeof instance.componentDidMount === 'function') { 20299 var _fiberFlags = Update; 20300 20301 { 20302 _fiberFlags |= LayoutStatic; 20303 } 20304 20305 if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) { 20306 _fiberFlags |= MountLayoutDev; 20307 } 20308 20309 workInProgress.flags |= _fiberFlags; 20310 } 20311 } else { 20312 // If an update was already in progress, we should schedule an Update 20313 // effect even though we're bailing out, so that cWU/cDU are called. 20314 if (typeof instance.componentDidMount === 'function') { 20315 var _fiberFlags2 = Update; 20316 20317 { 20318 _fiberFlags2 |= LayoutStatic; 20319 } 20320 20321 if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) { 20322 _fiberFlags2 |= MountLayoutDev; 20323 } 20324 20325 workInProgress.flags |= _fiberFlags2; 20326 } // If shouldComponentUpdate returned false, we should still update the 20327 // memoized state to indicate that this work can be reused. 20328 20329 20330 workInProgress.memoizedProps = newProps; 20331 workInProgress.memoizedState = newState; 20332 } // Update the existing instance's state, props, and context pointers even 20333 // if shouldComponentUpdate returns false. 20334 20335 20336 instance.props = newProps; 20337 instance.state = newState; 20338 instance.context = nextContext; 20339 return shouldUpdate; 20340} // Invokes the update life-cycles and returns false if it shouldn't rerender. 20341 20342 20343function updateClassInstance(current, workInProgress, ctor, newProps, renderLanes) { 20344 var instance = workInProgress.stateNode; 20345 cloneUpdateQueue(current, workInProgress); 20346 var unresolvedOldProps = workInProgress.memoizedProps; 20347 var oldProps = workInProgress.type === workInProgress.elementType ? unresolvedOldProps : resolveDefaultProps(workInProgress.type, unresolvedOldProps); 20348 instance.props = oldProps; 20349 var unresolvedNewProps = workInProgress.pendingProps; 20350 var oldContext = instance.context; 20351 var contextType = ctor.contextType; 20352 var nextContext = emptyContextObject; 20353 20354 if (typeof contextType === 'object' && contextType !== null) { 20355 nextContext = readContext(contextType); 20356 } else { 20357 var nextUnmaskedContext = getUnmaskedContext(workInProgress, ctor, true); 20358 nextContext = getMaskedContext(workInProgress, nextUnmaskedContext); 20359 } 20360 20361 var getDerivedStateFromProps = ctor.getDerivedStateFromProps; 20362 var hasNewLifecycles = typeof getDerivedStateFromProps === 'function' || typeof instance.getSnapshotBeforeUpdate === 'function'; // Note: During these life-cycles, instance.props/instance.state are what 20363 // ever the previously attempted to render - not the "current". However, 20364 // during componentDidUpdate we pass the "current" props. 20365 // In order to support react-lifecycles-compat polyfilled components, 20366 // Unsafe lifecycles should not be invoked for components using the new APIs. 20367 20368 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillReceiveProps === 'function' || typeof instance.componentWillReceiveProps === 'function')) { 20369 if (unresolvedOldProps !== unresolvedNewProps || oldContext !== nextContext) { 20370 callComponentWillReceiveProps(workInProgress, instance, newProps, nextContext); 20371 } 20372 } 20373 20374 resetHasForceUpdateBeforeProcessing(); 20375 var oldState = workInProgress.memoizedState; 20376 var newState = instance.state = oldState; 20377 processUpdateQueue(workInProgress, newProps, instance, renderLanes); 20378 newState = workInProgress.memoizedState; 20379 20380 if (unresolvedOldProps === unresolvedNewProps && oldState === newState && !hasContextChanged() && !checkHasForceUpdateAfterProcessing() && !(enableLazyContextPropagation )) { 20381 // If an update was already in progress, we should schedule an Update 20382 // effect even though we're bailing out, so that cWU/cDU are called. 20383 if (typeof instance.componentDidUpdate === 'function') { 20384 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) { 20385 workInProgress.flags |= Update; 20386 } 20387 } 20388 20389 if (typeof instance.getSnapshotBeforeUpdate === 'function') { 20390 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) { 20391 workInProgress.flags |= Snapshot; 20392 } 20393 } 20394 20395 return false; 20396 } 20397 20398 if (typeof getDerivedStateFromProps === 'function') { 20399 applyDerivedStateFromProps(workInProgress, ctor, getDerivedStateFromProps, newProps); 20400 newState = workInProgress.memoizedState; 20401 } 20402 20403 var shouldUpdate = checkHasForceUpdateAfterProcessing() || checkShouldComponentUpdate(workInProgress, ctor, oldProps, newProps, oldState, newState, nextContext) || // TODO: In some cases, we'll end up checking if context has changed twice, 20404 // both before and after `shouldComponentUpdate` has been called. Not ideal, 20405 // but I'm loath to refactor this function. This only happens for memoized 20406 // components so it's not that common. 20407 enableLazyContextPropagation ; 20408 20409 if (shouldUpdate) { 20410 // In order to support react-lifecycles-compat polyfilled components, 20411 // Unsafe lifecycles should not be invoked for components using the new APIs. 20412 if (!hasNewLifecycles && (typeof instance.UNSAFE_componentWillUpdate === 'function' || typeof instance.componentWillUpdate === 'function')) { 20413 if (typeof instance.componentWillUpdate === 'function') { 20414 instance.componentWillUpdate(newProps, newState, nextContext); 20415 } 20416 20417 if (typeof instance.UNSAFE_componentWillUpdate === 'function') { 20418 instance.UNSAFE_componentWillUpdate(newProps, newState, nextContext); 20419 } 20420 } 20421 20422 if (typeof instance.componentDidUpdate === 'function') { 20423 workInProgress.flags |= Update; 20424 } 20425 20426 if (typeof instance.getSnapshotBeforeUpdate === 'function') { 20427 workInProgress.flags |= Snapshot; 20428 } 20429 } else { 20430 // If an update was already in progress, we should schedule an Update 20431 // effect even though we're bailing out, so that cWU/cDU are called. 20432 if (typeof instance.componentDidUpdate === 'function') { 20433 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) { 20434 workInProgress.flags |= Update; 20435 } 20436 } 20437 20438 if (typeof instance.getSnapshotBeforeUpdate === 'function') { 20439 if (unresolvedOldProps !== current.memoizedProps || oldState !== current.memoizedState) { 20440 workInProgress.flags |= Snapshot; 20441 } 20442 } // If shouldComponentUpdate returned false, we should still update the 20443 // memoized props/state to indicate that this work can be reused. 20444 20445 20446 workInProgress.memoizedProps = newProps; 20447 workInProgress.memoizedState = newState; 20448 } // Update the existing instance's state, props, and context pointers even 20449 // if shouldComponentUpdate returns false. 20450 20451 20452 instance.props = newProps; 20453 instance.state = newState; 20454 instance.context = nextContext; 20455 return shouldUpdate; 20456} 20457 20458var didWarnAboutMaps; 20459var didWarnAboutGenerators; 20460var didWarnAboutStringRefs; 20461var ownerHasKeyUseWarning; 20462var ownerHasFunctionTypeWarning; 20463 20464var warnForMissingKey = function (child, returnFiber) {}; 20465 20466{ 20467 didWarnAboutMaps = false; 20468 didWarnAboutGenerators = false; 20469 didWarnAboutStringRefs = {}; 20470 /** 20471 * Warn if there's no key explicitly set on dynamic arrays of children or 20472 * object keys are not valid. This allows us to keep track of children between 20473 * updates. 20474 */ 20475 20476 ownerHasKeyUseWarning = {}; 20477 ownerHasFunctionTypeWarning = {}; 20478 20479 warnForMissingKey = function (child, returnFiber) { 20480 if (child === null || typeof child !== 'object') { 20481 return; 20482 } 20483 20484 if (!child._store || child._store.validated || child.key != null) { 20485 return; 20486 } 20487 20488 if (typeof child._store !== 'object') { 20489 throw new Error('React Component in warnForMissingKey should have a _store. ' + 'This error is likely caused by a bug in React. Please file an issue.'); 20490 } 20491 20492 child._store.validated = true; 20493 var componentName = getComponentNameFromFiber(returnFiber) || 'Component'; 20494 20495 if (ownerHasKeyUseWarning[componentName]) { 20496 return; 20497 } 20498 20499 ownerHasKeyUseWarning[componentName] = true; 20500 20501 error('Each child in a list should have a unique ' + '"key" prop. See https://reactjs.org/link/warning-keys for ' + 'more information.'); 20502 }; 20503} 20504 20505function coerceRef(returnFiber, current, element) { 20506 var mixedRef = element.ref; 20507 20508 if (mixedRef !== null && typeof mixedRef !== 'function' && typeof mixedRef !== 'object') { 20509 { 20510 // TODO: Clean this up once we turn on the string ref warning for 20511 // everyone, because the strict mode case will no longer be relevant 20512 if ((returnFiber.mode & StrictLegacyMode || warnAboutStringRefs) && // We warn in ReactElement.js if owner and self are equal for string refs 20513 // because these cannot be automatically converted to an arrow function 20514 // using a codemod. Therefore, we don't have to warn about string refs again. 20515 !(element._owner && element._self && element._owner.stateNode !== element._self)) { 20516 var componentName = getComponentNameFromFiber(returnFiber) || 'Component'; 20517 20518 if (!didWarnAboutStringRefs[componentName]) { 20519 { 20520 error('A string ref, "%s", has been found within a strict mode tree. ' + 'String refs are a source of potential bugs and should be avoided. ' + 'We recommend using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', mixedRef); 20521 } 20522 20523 didWarnAboutStringRefs[componentName] = true; 20524 } 20525 } 20526 } 20527 20528 if (element._owner) { 20529 var owner = element._owner; 20530 var inst; 20531 20532 if (owner) { 20533 var ownerFiber = owner; 20534 20535 if (ownerFiber.tag !== ClassComponent) { 20536 throw new Error('Function components cannot have string refs. ' + 'We recommend using useRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref'); 20537 } 20538 20539 inst = ownerFiber.stateNode; 20540 } 20541 20542 if (!inst) { 20543 throw new Error("Missing owner for string ref " + mixedRef + ". This error is likely caused by a " + 'bug in React. Please file an issue.'); 20544 } // Assigning this to a const so Flow knows it won't change in the closure 20545 20546 20547 var resolvedInst = inst; 20548 20549 { 20550 checkPropStringCoercion(mixedRef, 'ref'); 20551 } 20552 20553 var stringRef = '' + mixedRef; // Check if previous string ref matches new string ref 20554 20555 if (current !== null && current.ref !== null && typeof current.ref === 'function' && current.ref._stringRef === stringRef) { 20556 return current.ref; 20557 } 20558 20559 var ref = function (value) { 20560 var refs = resolvedInst.refs; 20561 20562 if (refs === emptyRefsObject) { 20563 // This is a lazy pooled frozen object, so we need to initialize. 20564 refs = resolvedInst.refs = {}; 20565 } 20566 20567 if (value === null) { 20568 delete refs[stringRef]; 20569 } else { 20570 refs[stringRef] = value; 20571 } 20572 }; 20573 20574 ref._stringRef = stringRef; 20575 return ref; 20576 } else { 20577 if (typeof mixedRef !== 'string') { 20578 throw new Error('Expected ref to be a function, a string, an object returned by React.createRef(), or null.'); 20579 } 20580 20581 if (!element._owner) { 20582 throw new Error("Element ref was specified as a string (" + mixedRef + ") but no owner was set. This could happen for one of" + ' the following reasons:\n' + '1. You may be adding a ref to a function component\n' + "2. You may be adding a ref to a component that was not created inside a component's render method\n" + '3. You have multiple copies of React loaded\n' + 'See https://reactjs.org/link/refs-must-have-owner for more information.'); 20583 } 20584 } 20585 } 20586 20587 return mixedRef; 20588} 20589 20590function throwOnInvalidObjectType(returnFiber, newChild) { 20591 var childString = Object.prototype.toString.call(newChild); 20592 throw new Error("Objects are not valid as a React child (found: " + (childString === '[object Object]' ? 'object with keys {' + Object.keys(newChild).join(', ') + '}' : childString) + "). " + 'If you meant to render a collection of children, use an array ' + 'instead.'); 20593} 20594 20595function warnOnFunctionType(returnFiber) { 20596 { 20597 var componentName = getComponentNameFromFiber(returnFiber) || 'Component'; 20598 20599 if (ownerHasFunctionTypeWarning[componentName]) { 20600 return; 20601 } 20602 20603 ownerHasFunctionTypeWarning[componentName] = true; 20604 20605 error('Functions are not valid as a React child. This may happen if ' + 'you return a Component instead of <Component /> from render. ' + 'Or maybe you meant to call this function rather than return it.'); 20606 } 20607} 20608 20609function resolveLazy(lazyType) { 20610 var payload = lazyType._payload; 20611 var init = lazyType._init; 20612 return init(payload); 20613} // This wrapper function exists because I expect to clone the code in each path 20614// to be able to optimize each path individually by branching early. This needs 20615// a compiler or we can do it manually. Helpers that don't need this branching 20616// live outside of this function. 20617 20618 20619function ChildReconciler(shouldTrackSideEffects) { 20620 function deleteChild(returnFiber, childToDelete) { 20621 if (!shouldTrackSideEffects) { 20622 // Noop. 20623 return; 20624 } 20625 20626 var deletions = returnFiber.deletions; 20627 20628 if (deletions === null) { 20629 returnFiber.deletions = [childToDelete]; 20630 returnFiber.flags |= ChildDeletion; 20631 } else { 20632 deletions.push(childToDelete); 20633 } 20634 } 20635 20636 function deleteRemainingChildren(returnFiber, currentFirstChild) { 20637 if (!shouldTrackSideEffects) { 20638 // Noop. 20639 return null; 20640 } // TODO: For the shouldClone case, this could be micro-optimized a bit by 20641 // assuming that after the first child we've already added everything. 20642 20643 20644 var childToDelete = currentFirstChild; 20645 20646 while (childToDelete !== null) { 20647 deleteChild(returnFiber, childToDelete); 20648 childToDelete = childToDelete.sibling; 20649 } 20650 20651 return null; 20652 } 20653 20654 function mapRemainingChildren(returnFiber, currentFirstChild) { 20655 // Add the remaining children to a temporary map so that we can find them by 20656 // keys quickly. Implicit (null) keys get added to this set with their index 20657 // instead. 20658 var existingChildren = new Map(); 20659 var existingChild = currentFirstChild; 20660 20661 while (existingChild !== null) { 20662 if (existingChild.key !== null) { 20663 existingChildren.set(existingChild.key, existingChild); 20664 } else { 20665 existingChildren.set(existingChild.index, existingChild); 20666 } 20667 20668 existingChild = existingChild.sibling; 20669 } 20670 20671 return existingChildren; 20672 } 20673 20674 function useFiber(fiber, pendingProps) { 20675 // We currently set sibling to null and index to 0 here because it is easy 20676 // to forget to do before returning it. E.g. for the single child case. 20677 var clone = createWorkInProgress(fiber, pendingProps); 20678 clone.index = 0; 20679 clone.sibling = null; 20680 return clone; 20681 } 20682 20683 function placeChild(newFiber, lastPlacedIndex, newIndex) { 20684 newFiber.index = newIndex; 20685 20686 if (!shouldTrackSideEffects) { 20687 // During hydration, the useId algorithm needs to know which fibers are 20688 // part of a list of children (arrays, iterators). 20689 newFiber.flags |= Forked; 20690 return lastPlacedIndex; 20691 } 20692 20693 var current = newFiber.alternate; 20694 20695 if (current !== null) { 20696 var oldIndex = current.index; 20697 20698 if (oldIndex < lastPlacedIndex) { 20699 // This is a move. 20700 newFiber.flags |= Placement; 20701 return lastPlacedIndex; 20702 } else { 20703 // This item can stay in place. 20704 return oldIndex; 20705 } 20706 } else { 20707 // This is an insertion. 20708 newFiber.flags |= Placement; 20709 return lastPlacedIndex; 20710 } 20711 } 20712 20713 function placeSingleChild(newFiber) { 20714 // This is simpler for the single child case. We only need to do a 20715 // placement for inserting new children. 20716 if (shouldTrackSideEffects && newFiber.alternate === null) { 20717 newFiber.flags |= Placement; 20718 } 20719 20720 return newFiber; 20721 } 20722 20723 function updateTextNode(returnFiber, current, textContent, lanes) { 20724 if (current === null || current.tag !== HostText) { 20725 // Insert 20726 var created = createFiberFromText(textContent, returnFiber.mode, lanes); 20727 created.return = returnFiber; 20728 return created; 20729 } else { 20730 // Update 20731 var existing = useFiber(current, textContent); 20732 existing.return = returnFiber; 20733 return existing; 20734 } 20735 } 20736 20737 function updateElement(returnFiber, current, element, lanes) { 20738 var elementType = element.type; 20739 20740 if (elementType === REACT_FRAGMENT_TYPE) { 20741 return updateFragment(returnFiber, current, element.props.children, lanes, element.key); 20742 } 20743 20744 if (current !== null) { 20745 if (current.elementType === elementType || ( // Keep this check inline so it only runs on the false path: 20746 isCompatibleFamilyForHotReloading(current, element) ) || // Lazy types should reconcile their resolved type. 20747 // We need to do this after the Hot Reloading check above, 20748 // because hot reloading has different semantics than prod because 20749 // it doesn't resuspend. So we can't let the call below suspend. 20750 typeof elementType === 'object' && elementType !== null && elementType.$$typeof === REACT_LAZY_TYPE && resolveLazy(elementType) === current.type) { 20751 // Move based on index 20752 var existing = useFiber(current, element.props); 20753 existing.ref = coerceRef(returnFiber, current, element); 20754 existing.return = returnFiber; 20755 20756 { 20757 existing._debugSource = element._source; 20758 existing._debugOwner = element._owner; 20759 } 20760 20761 return existing; 20762 } 20763 } // Insert 20764 20765 20766 var created = createFiberFromElement(element, returnFiber.mode, lanes); 20767 created.ref = coerceRef(returnFiber, current, element); 20768 created.return = returnFiber; 20769 return created; 20770 } 20771 20772 function updatePortal(returnFiber, current, portal, lanes) { 20773 if (current === null || current.tag !== HostPortal || current.stateNode.containerInfo !== portal.containerInfo || current.stateNode.implementation !== portal.implementation) { 20774 // Insert 20775 var created = createFiberFromPortal(portal, returnFiber.mode, lanes); 20776 created.return = returnFiber; 20777 return created; 20778 } else { 20779 // Update 20780 var existing = useFiber(current, portal.children || []); 20781 existing.return = returnFiber; 20782 return existing; 20783 } 20784 } 20785 20786 function updateFragment(returnFiber, current, fragment, lanes, key) { 20787 if (current === null || current.tag !== Fragment) { 20788 // Insert 20789 var created = createFiberFromFragment(fragment, returnFiber.mode, lanes, key); 20790 created.return = returnFiber; 20791 return created; 20792 } else { 20793 // Update 20794 var existing = useFiber(current, fragment); 20795 existing.return = returnFiber; 20796 return existing; 20797 } 20798 } 20799 20800 function createChild(returnFiber, newChild, lanes) { 20801 if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') { 20802 // Text nodes don't have keys. If the previous node is implicitly keyed 20803 // we can continue to replace it without aborting even if it is not a text 20804 // node. 20805 var created = createFiberFromText('' + newChild, returnFiber.mode, lanes); 20806 created.return = returnFiber; 20807 return created; 20808 } 20809 20810 if (typeof newChild === 'object' && newChild !== null) { 20811 switch (newChild.$$typeof) { 20812 case REACT_ELEMENT_TYPE: 20813 { 20814 var _created = createFiberFromElement(newChild, returnFiber.mode, lanes); 20815 20816 _created.ref = coerceRef(returnFiber, null, newChild); 20817 _created.return = returnFiber; 20818 return _created; 20819 } 20820 20821 case REACT_PORTAL_TYPE: 20822 { 20823 var _created2 = createFiberFromPortal(newChild, returnFiber.mode, lanes); 20824 20825 _created2.return = returnFiber; 20826 return _created2; 20827 } 20828 20829 case REACT_LAZY_TYPE: 20830 { 20831 var payload = newChild._payload; 20832 var init = newChild._init; 20833 return createChild(returnFiber, init(payload), lanes); 20834 } 20835 } 20836 20837 if (isArray(newChild) || getIteratorFn(newChild)) { 20838 var _created3 = createFiberFromFragment(newChild, returnFiber.mode, lanes, null); 20839 20840 _created3.return = returnFiber; 20841 return _created3; 20842 } 20843 20844 throwOnInvalidObjectType(returnFiber, newChild); 20845 } 20846 20847 { 20848 if (typeof newChild === 'function') { 20849 warnOnFunctionType(returnFiber); 20850 } 20851 } 20852 20853 return null; 20854 } 20855 20856 function updateSlot(returnFiber, oldFiber, newChild, lanes) { 20857 // Update the fiber if the keys match, otherwise return null. 20858 var key = oldFiber !== null ? oldFiber.key : null; 20859 20860 if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') { 20861 // Text nodes don't have keys. If the previous node is implicitly keyed 20862 // we can continue to replace it without aborting even if it is not a text 20863 // node. 20864 if (key !== null) { 20865 return null; 20866 } 20867 20868 return updateTextNode(returnFiber, oldFiber, '' + newChild, lanes); 20869 } 20870 20871 if (typeof newChild === 'object' && newChild !== null) { 20872 switch (newChild.$$typeof) { 20873 case REACT_ELEMENT_TYPE: 20874 { 20875 if (newChild.key === key) { 20876 return updateElement(returnFiber, oldFiber, newChild, lanes); 20877 } else { 20878 return null; 20879 } 20880 } 20881 20882 case REACT_PORTAL_TYPE: 20883 { 20884 if (newChild.key === key) { 20885 return updatePortal(returnFiber, oldFiber, newChild, lanes); 20886 } else { 20887 return null; 20888 } 20889 } 20890 20891 case REACT_LAZY_TYPE: 20892 { 20893 var payload = newChild._payload; 20894 var init = newChild._init; 20895 return updateSlot(returnFiber, oldFiber, init(payload), lanes); 20896 } 20897 } 20898 20899 if (isArray(newChild) || getIteratorFn(newChild)) { 20900 if (key !== null) { 20901 return null; 20902 } 20903 20904 return updateFragment(returnFiber, oldFiber, newChild, lanes, null); 20905 } 20906 20907 throwOnInvalidObjectType(returnFiber, newChild); 20908 } 20909 20910 { 20911 if (typeof newChild === 'function') { 20912 warnOnFunctionType(returnFiber); 20913 } 20914 } 20915 20916 return null; 20917 } 20918 20919 function updateFromMap(existingChildren, returnFiber, newIdx, newChild, lanes) { 20920 if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') { 20921 // Text nodes don't have keys, so we neither have to check the old nor 20922 // new node for the key. If both are text nodes, they match. 20923 var matchedFiber = existingChildren.get(newIdx) || null; 20924 return updateTextNode(returnFiber, matchedFiber, '' + newChild, lanes); 20925 } 20926 20927 if (typeof newChild === 'object' && newChild !== null) { 20928 switch (newChild.$$typeof) { 20929 case REACT_ELEMENT_TYPE: 20930 { 20931 var _matchedFiber = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null; 20932 20933 return updateElement(returnFiber, _matchedFiber, newChild, lanes); 20934 } 20935 20936 case REACT_PORTAL_TYPE: 20937 { 20938 var _matchedFiber2 = existingChildren.get(newChild.key === null ? newIdx : newChild.key) || null; 20939 20940 return updatePortal(returnFiber, _matchedFiber2, newChild, lanes); 20941 } 20942 20943 case REACT_LAZY_TYPE: 20944 var payload = newChild._payload; 20945 var init = newChild._init; 20946 return updateFromMap(existingChildren, returnFiber, newIdx, init(payload), lanes); 20947 } 20948 20949 if (isArray(newChild) || getIteratorFn(newChild)) { 20950 var _matchedFiber3 = existingChildren.get(newIdx) || null; 20951 20952 return updateFragment(returnFiber, _matchedFiber3, newChild, lanes, null); 20953 } 20954 20955 throwOnInvalidObjectType(returnFiber, newChild); 20956 } 20957 20958 { 20959 if (typeof newChild === 'function') { 20960 warnOnFunctionType(returnFiber); 20961 } 20962 } 20963 20964 return null; 20965 } 20966 /** 20967 * Warns if there is a duplicate or missing key 20968 */ 20969 20970 20971 function warnOnInvalidKey(child, knownKeys, returnFiber) { 20972 { 20973 if (typeof child !== 'object' || child === null) { 20974 return knownKeys; 20975 } 20976 20977 switch (child.$$typeof) { 20978 case REACT_ELEMENT_TYPE: 20979 case REACT_PORTAL_TYPE: 20980 warnForMissingKey(child, returnFiber); 20981 var key = child.key; 20982 20983 if (typeof key !== 'string') { 20984 break; 20985 } 20986 20987 if (knownKeys === null) { 20988 knownKeys = new Set(); 20989 knownKeys.add(key); 20990 break; 20991 } 20992 20993 if (!knownKeys.has(key)) { 20994 knownKeys.add(key); 20995 break; 20996 } 20997 20998 error('Encountered two children with the same key, `%s`. ' + 'Keys should be unique so that components maintain their identity ' + 'across updates. Non-unique keys may cause children to be ' + 'duplicated and/or omitted — the behavior is unsupported and ' + 'could change in a future version.', key); 20999 21000 break; 21001 21002 case REACT_LAZY_TYPE: 21003 var payload = child._payload; 21004 var init = child._init; 21005 warnOnInvalidKey(init(payload), knownKeys, returnFiber); 21006 break; 21007 } 21008 } 21009 21010 return knownKeys; 21011 } 21012 21013 function reconcileChildrenArray(returnFiber, currentFirstChild, newChildren, lanes) { 21014 // This algorithm can't optimize by searching from both ends since we 21015 // don't have backpointers on fibers. I'm trying to see how far we can get 21016 // with that model. If it ends up not being worth the tradeoffs, we can 21017 // add it later. 21018 // Even with a two ended optimization, we'd want to optimize for the case 21019 // where there are few changes and brute force the comparison instead of 21020 // going for the Map. It'd like to explore hitting that path first in 21021 // forward-only mode and only go for the Map once we notice that we need 21022 // lots of look ahead. This doesn't handle reversal as well as two ended 21023 // search but that's unusual. Besides, for the two ended optimization to 21024 // work on Iterables, we'd need to copy the whole set. 21025 // In this first iteration, we'll just live with hitting the bad case 21026 // (adding everything to a Map) in for every insert/move. 21027 // If you change this code, also update reconcileChildrenIterator() which 21028 // uses the same algorithm. 21029 { 21030 // First, validate keys. 21031 var knownKeys = null; 21032 21033 for (var i = 0; i < newChildren.length; i++) { 21034 var child = newChildren[i]; 21035 knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber); 21036 } 21037 } 21038 21039 var resultingFirstChild = null; 21040 var previousNewFiber = null; 21041 var oldFiber = currentFirstChild; 21042 var lastPlacedIndex = 0; 21043 var newIdx = 0; 21044 var nextOldFiber = null; 21045 21046 for (; oldFiber !== null && newIdx < newChildren.length; newIdx++) { 21047 if (oldFiber.index > newIdx) { 21048 nextOldFiber = oldFiber; 21049 oldFiber = null; 21050 } else { 21051 nextOldFiber = oldFiber.sibling; 21052 } 21053 21054 var newFiber = updateSlot(returnFiber, oldFiber, newChildren[newIdx], lanes); 21055 21056 if (newFiber === null) { 21057 // TODO: This breaks on empty slots like null children. That's 21058 // unfortunate because it triggers the slow path all the time. We need 21059 // a better way to communicate whether this was a miss or null, 21060 // boolean, undefined, etc. 21061 if (oldFiber === null) { 21062 oldFiber = nextOldFiber; 21063 } 21064 21065 break; 21066 } 21067 21068 if (shouldTrackSideEffects) { 21069 if (oldFiber && newFiber.alternate === null) { 21070 // We matched the slot, but we didn't reuse the existing fiber, so we 21071 // need to delete the existing child. 21072 deleteChild(returnFiber, oldFiber); 21073 } 21074 } 21075 21076 lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx); 21077 21078 if (previousNewFiber === null) { 21079 // TODO: Move out of the loop. This only happens for the first run. 21080 resultingFirstChild = newFiber; 21081 } else { 21082 // TODO: Defer siblings if we're not at the right index for this slot. 21083 // I.e. if we had null values before, then we want to defer this 21084 // for each null value. However, we also don't want to call updateSlot 21085 // with the previous one. 21086 previousNewFiber.sibling = newFiber; 21087 } 21088 21089 previousNewFiber = newFiber; 21090 oldFiber = nextOldFiber; 21091 } 21092 21093 if (newIdx === newChildren.length) { 21094 // We've reached the end of the new children. We can delete the rest. 21095 deleteRemainingChildren(returnFiber, oldFiber); 21096 21097 if (getIsHydrating()) { 21098 var numberOfForks = newIdx; 21099 pushTreeFork(returnFiber, numberOfForks); 21100 } 21101 21102 return resultingFirstChild; 21103 } 21104 21105 if (oldFiber === null) { 21106 // If we don't have any more existing children we can choose a fast path 21107 // since the rest will all be insertions. 21108 for (; newIdx < newChildren.length; newIdx++) { 21109 var _newFiber = createChild(returnFiber, newChildren[newIdx], lanes); 21110 21111 if (_newFiber === null) { 21112 continue; 21113 } 21114 21115 lastPlacedIndex = placeChild(_newFiber, lastPlacedIndex, newIdx); 21116 21117 if (previousNewFiber === null) { 21118 // TODO: Move out of the loop. This only happens for the first run. 21119 resultingFirstChild = _newFiber; 21120 } else { 21121 previousNewFiber.sibling = _newFiber; 21122 } 21123 21124 previousNewFiber = _newFiber; 21125 } 21126 21127 if (getIsHydrating()) { 21128 var _numberOfForks = newIdx; 21129 pushTreeFork(returnFiber, _numberOfForks); 21130 } 21131 21132 return resultingFirstChild; 21133 } // Add all children to a key map for quick lookups. 21134 21135 21136 var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves. 21137 21138 for (; newIdx < newChildren.length; newIdx++) { 21139 var _newFiber2 = updateFromMap(existingChildren, returnFiber, newIdx, newChildren[newIdx], lanes); 21140 21141 if (_newFiber2 !== null) { 21142 if (shouldTrackSideEffects) { 21143 if (_newFiber2.alternate !== null) { 21144 // The new fiber is a work in progress, but if there exists a 21145 // current, that means that we reused the fiber. We need to delete 21146 // it from the child list so that we don't add it to the deletion 21147 // list. 21148 existingChildren.delete(_newFiber2.key === null ? newIdx : _newFiber2.key); 21149 } 21150 } 21151 21152 lastPlacedIndex = placeChild(_newFiber2, lastPlacedIndex, newIdx); 21153 21154 if (previousNewFiber === null) { 21155 resultingFirstChild = _newFiber2; 21156 } else { 21157 previousNewFiber.sibling = _newFiber2; 21158 } 21159 21160 previousNewFiber = _newFiber2; 21161 } 21162 } 21163 21164 if (shouldTrackSideEffects) { 21165 // Any existing children that weren't consumed above were deleted. We need 21166 // to add them to the deletion list. 21167 existingChildren.forEach(function (child) { 21168 return deleteChild(returnFiber, child); 21169 }); 21170 } 21171 21172 if (getIsHydrating()) { 21173 var _numberOfForks2 = newIdx; 21174 pushTreeFork(returnFiber, _numberOfForks2); 21175 } 21176 21177 return resultingFirstChild; 21178 } 21179 21180 function reconcileChildrenIterator(returnFiber, currentFirstChild, newChildrenIterable, lanes) { 21181 // This is the same implementation as reconcileChildrenArray(), 21182 // but using the iterator instead. 21183 var iteratorFn = getIteratorFn(newChildrenIterable); 21184 21185 if (typeof iteratorFn !== 'function') { 21186 throw new Error('An object is not an iterable. This error is likely caused by a bug in ' + 'React. Please file an issue.'); 21187 } 21188 21189 { 21190 // We don't support rendering Generators because it's a mutation. 21191 // See https://github.com/facebook/react/issues/12995 21192 if (typeof Symbol === 'function' && // $FlowFixMe Flow doesn't know about toStringTag 21193 newChildrenIterable[Symbol.toStringTag] === 'Generator') { 21194 if (!didWarnAboutGenerators) { 21195 error('Using Generators as children is unsupported and will likely yield ' + 'unexpected results because enumerating a generator mutates it. ' + 'You may convert it to an array with `Array.from()` or the ' + '`[...spread]` operator before rendering. Keep in mind ' + 'you might need to polyfill these features for older browsers.'); 21196 } 21197 21198 didWarnAboutGenerators = true; 21199 } // Warn about using Maps as children 21200 21201 21202 if (newChildrenIterable.entries === iteratorFn) { 21203 if (!didWarnAboutMaps) { 21204 error('Using Maps as children is not supported. ' + 'Use an array of keyed ReactElements instead.'); 21205 } 21206 21207 didWarnAboutMaps = true; 21208 } // First, validate keys. 21209 // We'll get a different iterator later for the main pass. 21210 21211 21212 var _newChildren = iteratorFn.call(newChildrenIterable); 21213 21214 if (_newChildren) { 21215 var knownKeys = null; 21216 21217 var _step = _newChildren.next(); 21218 21219 for (; !_step.done; _step = _newChildren.next()) { 21220 var child = _step.value; 21221 knownKeys = warnOnInvalidKey(child, knownKeys, returnFiber); 21222 } 21223 } 21224 } 21225 21226 var newChildren = iteratorFn.call(newChildrenIterable); 21227 21228 if (newChildren == null) { 21229 throw new Error('An iterable object provided no iterator.'); 21230 } 21231 21232 var resultingFirstChild = null; 21233 var previousNewFiber = null; 21234 var oldFiber = currentFirstChild; 21235 var lastPlacedIndex = 0; 21236 var newIdx = 0; 21237 var nextOldFiber = null; 21238 var step = newChildren.next(); 21239 21240 for (; oldFiber !== null && !step.done; newIdx++, step = newChildren.next()) { 21241 if (oldFiber.index > newIdx) { 21242 nextOldFiber = oldFiber; 21243 oldFiber = null; 21244 } else { 21245 nextOldFiber = oldFiber.sibling; 21246 } 21247 21248 var newFiber = updateSlot(returnFiber, oldFiber, step.value, lanes); 21249 21250 if (newFiber === null) { 21251 // TODO: This breaks on empty slots like null children. That's 21252 // unfortunate because it triggers the slow path all the time. We need 21253 // a better way to communicate whether this was a miss or null, 21254 // boolean, undefined, etc. 21255 if (oldFiber === null) { 21256 oldFiber = nextOldFiber; 21257 } 21258 21259 break; 21260 } 21261 21262 if (shouldTrackSideEffects) { 21263 if (oldFiber && newFiber.alternate === null) { 21264 // We matched the slot, but we didn't reuse the existing fiber, so we 21265 // need to delete the existing child. 21266 deleteChild(returnFiber, oldFiber); 21267 } 21268 } 21269 21270 lastPlacedIndex = placeChild(newFiber, lastPlacedIndex, newIdx); 21271 21272 if (previousNewFiber === null) { 21273 // TODO: Move out of the loop. This only happens for the first run. 21274 resultingFirstChild = newFiber; 21275 } else { 21276 // TODO: Defer siblings if we're not at the right index for this slot. 21277 // I.e. if we had null values before, then we want to defer this 21278 // for each null value. However, we also don't want to call updateSlot 21279 // with the previous one. 21280 previousNewFiber.sibling = newFiber; 21281 } 21282 21283 previousNewFiber = newFiber; 21284 oldFiber = nextOldFiber; 21285 } 21286 21287 if (step.done) { 21288 // We've reached the end of the new children. We can delete the rest. 21289 deleteRemainingChildren(returnFiber, oldFiber); 21290 21291 if (getIsHydrating()) { 21292 var numberOfForks = newIdx; 21293 pushTreeFork(returnFiber, numberOfForks); 21294 } 21295 21296 return resultingFirstChild; 21297 } 21298 21299 if (oldFiber === null) { 21300 // If we don't have any more existing children we can choose a fast path 21301 // since the rest will all be insertions. 21302 for (; !step.done; newIdx++, step = newChildren.next()) { 21303 var _newFiber3 = createChild(returnFiber, step.value, lanes); 21304 21305 if (_newFiber3 === null) { 21306 continue; 21307 } 21308 21309 lastPlacedIndex = placeChild(_newFiber3, lastPlacedIndex, newIdx); 21310 21311 if (previousNewFiber === null) { 21312 // TODO: Move out of the loop. This only happens for the first run. 21313 resultingFirstChild = _newFiber3; 21314 } else { 21315 previousNewFiber.sibling = _newFiber3; 21316 } 21317 21318 previousNewFiber = _newFiber3; 21319 } 21320 21321 if (getIsHydrating()) { 21322 var _numberOfForks3 = newIdx; 21323 pushTreeFork(returnFiber, _numberOfForks3); 21324 } 21325 21326 return resultingFirstChild; 21327 } // Add all children to a key map for quick lookups. 21328 21329 21330 var existingChildren = mapRemainingChildren(returnFiber, oldFiber); // Keep scanning and use the map to restore deleted items as moves. 21331 21332 for (; !step.done; newIdx++, step = newChildren.next()) { 21333 var _newFiber4 = updateFromMap(existingChildren, returnFiber, newIdx, step.value, lanes); 21334 21335 if (_newFiber4 !== null) { 21336 if (shouldTrackSideEffects) { 21337 if (_newFiber4.alternate !== null) { 21338 // The new fiber is a work in progress, but if there exists a 21339 // current, that means that we reused the fiber. We need to delete 21340 // it from the child list so that we don't add it to the deletion 21341 // list. 21342 existingChildren.delete(_newFiber4.key === null ? newIdx : _newFiber4.key); 21343 } 21344 } 21345 21346 lastPlacedIndex = placeChild(_newFiber4, lastPlacedIndex, newIdx); 21347 21348 if (previousNewFiber === null) { 21349 resultingFirstChild = _newFiber4; 21350 } else { 21351 previousNewFiber.sibling = _newFiber4; 21352 } 21353 21354 previousNewFiber = _newFiber4; 21355 } 21356 } 21357 21358 if (shouldTrackSideEffects) { 21359 // Any existing children that weren't consumed above were deleted. We need 21360 // to add them to the deletion list. 21361 existingChildren.forEach(function (child) { 21362 return deleteChild(returnFiber, child); 21363 }); 21364 } 21365 21366 if (getIsHydrating()) { 21367 var _numberOfForks4 = newIdx; 21368 pushTreeFork(returnFiber, _numberOfForks4); 21369 } 21370 21371 return resultingFirstChild; 21372 } 21373 21374 function reconcileSingleTextNode(returnFiber, currentFirstChild, textContent, lanes) { 21375 // There's no need to check for keys on text nodes since we don't have a 21376 // way to define them. 21377 if (currentFirstChild !== null && currentFirstChild.tag === HostText) { 21378 // We already have an existing node so let's just update it and delete 21379 // the rest. 21380 deleteRemainingChildren(returnFiber, currentFirstChild.sibling); 21381 var existing = useFiber(currentFirstChild, textContent); 21382 existing.return = returnFiber; 21383 return existing; 21384 } // The existing first child is not a text node so we need to create one 21385 // and delete the existing ones. 21386 21387 21388 deleteRemainingChildren(returnFiber, currentFirstChild); 21389 var created = createFiberFromText(textContent, returnFiber.mode, lanes); 21390 created.return = returnFiber; 21391 return created; 21392 } 21393 21394 function reconcileSingleElement(returnFiber, currentFirstChild, element, lanes) { 21395 var key = element.key; 21396 var child = currentFirstChild; 21397 21398 while (child !== null) { 21399 // TODO: If key === null and child.key === null, then this only applies to 21400 // the first item in the list. 21401 if (child.key === key) { 21402 var elementType = element.type; 21403 21404 if (elementType === REACT_FRAGMENT_TYPE) { 21405 if (child.tag === Fragment) { 21406 deleteRemainingChildren(returnFiber, child.sibling); 21407 var existing = useFiber(child, element.props.children); 21408 existing.return = returnFiber; 21409 21410 { 21411 existing._debugSource = element._source; 21412 existing._debugOwner = element._owner; 21413 } 21414 21415 return existing; 21416 } 21417 } else { 21418 if (child.elementType === elementType || ( // Keep this check inline so it only runs on the false path: 21419 isCompatibleFamilyForHotReloading(child, element) ) || // Lazy types should reconcile their resolved type. 21420 // We need to do this after the Hot Reloading check above, 21421 // because hot reloading has different semantics than prod because 21422 // it doesn't resuspend. So we can't let the call below suspend. 21423 typeof elementType === 'object' && elementType !== null && elementType.$$typeof === REACT_LAZY_TYPE && resolveLazy(elementType) === child.type) { 21424 deleteRemainingChildren(returnFiber, child.sibling); 21425 21426 var _existing = useFiber(child, element.props); 21427 21428 _existing.ref = coerceRef(returnFiber, child, element); 21429 _existing.return = returnFiber; 21430 21431 { 21432 _existing._debugSource = element._source; 21433 _existing._debugOwner = element._owner; 21434 } 21435 21436 return _existing; 21437 } 21438 } // Didn't match. 21439 21440 21441 deleteRemainingChildren(returnFiber, child); 21442 break; 21443 } else { 21444 deleteChild(returnFiber, child); 21445 } 21446 21447 child = child.sibling; 21448 } 21449 21450 if (element.type === REACT_FRAGMENT_TYPE) { 21451 var created = createFiberFromFragment(element.props.children, returnFiber.mode, lanes, element.key); 21452 created.return = returnFiber; 21453 return created; 21454 } else { 21455 var _created4 = createFiberFromElement(element, returnFiber.mode, lanes); 21456 21457 _created4.ref = coerceRef(returnFiber, currentFirstChild, element); 21458 _created4.return = returnFiber; 21459 return _created4; 21460 } 21461 } 21462 21463 function reconcileSinglePortal(returnFiber, currentFirstChild, portal, lanes) { 21464 var key = portal.key; 21465 var child = currentFirstChild; 21466 21467 while (child !== null) { 21468 // TODO: If key === null and child.key === null, then this only applies to 21469 // the first item in the list. 21470 if (child.key === key) { 21471 if (child.tag === HostPortal && child.stateNode.containerInfo === portal.containerInfo && child.stateNode.implementation === portal.implementation) { 21472 deleteRemainingChildren(returnFiber, child.sibling); 21473 var existing = useFiber(child, portal.children || []); 21474 existing.return = returnFiber; 21475 return existing; 21476 } else { 21477 deleteRemainingChildren(returnFiber, child); 21478 break; 21479 } 21480 } else { 21481 deleteChild(returnFiber, child); 21482 } 21483 21484 child = child.sibling; 21485 } 21486 21487 var created = createFiberFromPortal(portal, returnFiber.mode, lanes); 21488 created.return = returnFiber; 21489 return created; 21490 } // This API will tag the children with the side-effect of the reconciliation 21491 // itself. They will be added to the side-effect list as we pass through the 21492 // children and the parent. 21493 21494 21495 function reconcileChildFibers(returnFiber, currentFirstChild, newChild, lanes) { 21496 // This function is not recursive. 21497 // If the top level item is an array, we treat it as a set of children, 21498 // not as a fragment. Nested arrays on the other hand will be treated as 21499 // fragment nodes. Recursion happens at the normal flow. 21500 // Handle top level unkeyed fragments as if they were arrays. 21501 // This leads to an ambiguity between <>{[...]}</> and <>...</>. 21502 // We treat the ambiguous cases above the same. 21503 var isUnkeyedTopLevelFragment = typeof newChild === 'object' && newChild !== null && newChild.type === REACT_FRAGMENT_TYPE && newChild.key === null; 21504 21505 if (isUnkeyedTopLevelFragment) { 21506 newChild = newChild.props.children; 21507 } // Handle object types 21508 21509 21510 if (typeof newChild === 'object' && newChild !== null) { 21511 switch (newChild.$$typeof) { 21512 case REACT_ELEMENT_TYPE: 21513 return placeSingleChild(reconcileSingleElement(returnFiber, currentFirstChild, newChild, lanes)); 21514 21515 case REACT_PORTAL_TYPE: 21516 return placeSingleChild(reconcileSinglePortal(returnFiber, currentFirstChild, newChild, lanes)); 21517 21518 case REACT_LAZY_TYPE: 21519 var payload = newChild._payload; 21520 var init = newChild._init; // TODO: This function is supposed to be non-recursive. 21521 21522 return reconcileChildFibers(returnFiber, currentFirstChild, init(payload), lanes); 21523 } 21524 21525 if (isArray(newChild)) { 21526 return reconcileChildrenArray(returnFiber, currentFirstChild, newChild, lanes); 21527 } 21528 21529 if (getIteratorFn(newChild)) { 21530 return reconcileChildrenIterator(returnFiber, currentFirstChild, newChild, lanes); 21531 } 21532 21533 throwOnInvalidObjectType(returnFiber, newChild); 21534 } 21535 21536 if (typeof newChild === 'string' && newChild !== '' || typeof newChild === 'number') { 21537 return placeSingleChild(reconcileSingleTextNode(returnFiber, currentFirstChild, '' + newChild, lanes)); 21538 } 21539 21540 { 21541 if (typeof newChild === 'function') { 21542 warnOnFunctionType(returnFiber); 21543 } 21544 } // Remaining cases are all treated as empty. 21545 21546 21547 return deleteRemainingChildren(returnFiber, currentFirstChild); 21548 } 21549 21550 return reconcileChildFibers; 21551} 21552 21553var reconcileChildFibers = ChildReconciler(true); 21554var mountChildFibers = ChildReconciler(false); 21555function cloneChildFibers(current, workInProgress) { 21556 if (current !== null && workInProgress.child !== current.child) { 21557 throw new Error('Resuming work not yet implemented.'); 21558 } 21559 21560 if (workInProgress.child === null) { 21561 return; 21562 } 21563 21564 var currentChild = workInProgress.child; 21565 var newChild = createWorkInProgress(currentChild, currentChild.pendingProps); 21566 workInProgress.child = newChild; 21567 newChild.return = workInProgress; 21568 21569 while (currentChild.sibling !== null) { 21570 currentChild = currentChild.sibling; 21571 newChild = newChild.sibling = createWorkInProgress(currentChild, currentChild.pendingProps); 21572 newChild.return = workInProgress; 21573 } 21574 21575 newChild.sibling = null; 21576} // Reset a workInProgress child set to prepare it for a second pass. 21577 21578function resetChildFibers(workInProgress, lanes) { 21579 var child = workInProgress.child; 21580 21581 while (child !== null) { 21582 resetWorkInProgress(child, lanes); 21583 child = child.sibling; 21584 } 21585} 21586 21587var NO_CONTEXT = {}; 21588var contextStackCursor$1 = createCursor(NO_CONTEXT); 21589var contextFiberStackCursor = createCursor(NO_CONTEXT); 21590var rootInstanceStackCursor = createCursor(NO_CONTEXT); 21591 21592function requiredContext(c) { 21593 if (c === NO_CONTEXT) { 21594 throw new Error('Expected host context to exist. This error is likely caused by a bug ' + 'in React. Please file an issue.'); 21595 } 21596 21597 return c; 21598} 21599 21600function getRootHostContainer() { 21601 var rootInstance = requiredContext(rootInstanceStackCursor.current); 21602 return rootInstance; 21603} 21604 21605function pushHostContainer(fiber, nextRootInstance) { 21606 // Push current root instance onto the stack; 21607 // This allows us to reset root when portals are popped. 21608 push(rootInstanceStackCursor, nextRootInstance, fiber); // Track the context and the Fiber that provided it. 21609 // This enables us to pop only Fibers that provide unique contexts. 21610 21611 push(contextFiberStackCursor, fiber, fiber); // Finally, we need to push the host context to the stack. 21612 // However, we can't just call getRootHostContext() and push it because 21613 // we'd have a different number of entries on the stack depending on 21614 // whether getRootHostContext() throws somewhere in renderer code or not. 21615 // So we push an empty value first. This lets us safely unwind on errors. 21616 21617 push(contextStackCursor$1, NO_CONTEXT, fiber); 21618 var nextRootContext = getRootHostContext(nextRootInstance); // Now that we know this function doesn't throw, replace it. 21619 21620 pop(contextStackCursor$1, fiber); 21621 push(contextStackCursor$1, nextRootContext, fiber); 21622} 21623 21624function popHostContainer(fiber) { 21625 pop(contextStackCursor$1, fiber); 21626 pop(contextFiberStackCursor, fiber); 21627 pop(rootInstanceStackCursor, fiber); 21628} 21629 21630function getHostContext() { 21631 var context = requiredContext(contextStackCursor$1.current); 21632 return context; 21633} 21634 21635function pushHostContext(fiber) { 21636 var rootInstance = requiredContext(rootInstanceStackCursor.current); 21637 var context = requiredContext(contextStackCursor$1.current); 21638 var nextContext = getChildHostContext(context, fiber.type); // Don't push this Fiber's context unless it's unique. 21639 21640 if (context === nextContext) { 21641 return; 21642 } // Track the context and the Fiber that provided it. 21643 // This enables us to pop only Fibers that provide unique contexts. 21644 21645 21646 push(contextFiberStackCursor, fiber, fiber); 21647 push(contextStackCursor$1, nextContext, fiber); 21648} 21649 21650function popHostContext(fiber) { 21651 // Do not pop unless this Fiber provided the current context. 21652 // pushHostContext() only pushes Fibers that provide unique contexts. 21653 if (contextFiberStackCursor.current !== fiber) { 21654 return; 21655 } 21656 21657 pop(contextStackCursor$1, fiber); 21658 pop(contextFiberStackCursor, fiber); 21659} 21660 21661var DefaultSuspenseContext = 0; // The Suspense Context is split into two parts. The lower bits is 21662// inherited deeply down the subtree. The upper bits only affect 21663// this immediate suspense boundary and gets reset each new 21664// boundary or suspense list. 21665 21666var SubtreeSuspenseContextMask = 1; // Subtree Flags: 21667// InvisibleParentSuspenseContext indicates that one of our parent Suspense 21668// boundaries is not currently showing visible main content. 21669// Either because it is already showing a fallback or is not mounted at all. 21670// We can use this to determine if it is desirable to trigger a fallback at 21671// the parent. If not, then we might need to trigger undesirable boundaries 21672// and/or suspend the commit to avoid hiding the parent content. 21673 21674var InvisibleParentSuspenseContext = 1; // Shallow Flags: 21675// ForceSuspenseFallback can be used by SuspenseList to force newly added 21676// items into their fallback state during one of the render passes. 21677 21678var ForceSuspenseFallback = 2; 21679var suspenseStackCursor = createCursor(DefaultSuspenseContext); 21680function hasSuspenseContext(parentContext, flag) { 21681 return (parentContext & flag) !== 0; 21682} 21683function setDefaultShallowSuspenseContext(parentContext) { 21684 return parentContext & SubtreeSuspenseContextMask; 21685} 21686function setShallowSuspenseContext(parentContext, shallowContext) { 21687 return parentContext & SubtreeSuspenseContextMask | shallowContext; 21688} 21689function addSubtreeSuspenseContext(parentContext, subtreeContext) { 21690 return parentContext | subtreeContext; 21691} 21692function pushSuspenseContext(fiber, newContext) { 21693 push(suspenseStackCursor, newContext, fiber); 21694} 21695function popSuspenseContext(fiber) { 21696 pop(suspenseStackCursor, fiber); 21697} 21698 21699function shouldCaptureSuspense(workInProgress, hasInvisibleParent) { 21700 // If it was the primary children that just suspended, capture and render the 21701 // fallback. Otherwise, don't capture and bubble to the next boundary. 21702 var nextState = workInProgress.memoizedState; 21703 21704 if (nextState !== null) { 21705 if (nextState.dehydrated !== null) { 21706 // A dehydrated boundary always captures. 21707 return true; 21708 } 21709 21710 return false; 21711 } 21712 21713 var props = workInProgress.memoizedProps; // Regular boundaries always capture. 21714 21715 { 21716 return true; 21717 } // If it's a boundary we should avoid, then we prefer to bubble up to the 21718} 21719function findFirstSuspended(row) { 21720 var node = row; 21721 21722 while (node !== null) { 21723 if (node.tag === SuspenseComponent) { 21724 var state = node.memoizedState; 21725 21726 if (state !== null) { 21727 var dehydrated = state.dehydrated; 21728 21729 if (dehydrated === null || isSuspenseInstancePending(dehydrated) || isSuspenseInstanceFallback(dehydrated)) { 21730 return node; 21731 } 21732 } 21733 } else if (node.tag === SuspenseListComponent && // revealOrder undefined can't be trusted because it don't 21734 // keep track of whether it suspended or not. 21735 node.memoizedProps.revealOrder !== undefined) { 21736 var didSuspend = (node.flags & DidCapture) !== NoFlags; 21737 21738 if (didSuspend) { 21739 return node; 21740 } 21741 } else if (node.child !== null) { 21742 node.child.return = node; 21743 node = node.child; 21744 continue; 21745 } 21746 21747 if (node === row) { 21748 return null; 21749 } 21750 21751 while (node.sibling === null) { 21752 if (node.return === null || node.return === row) { 21753 return null; 21754 } 21755 21756 node = node.return; 21757 } 21758 21759 node.sibling.return = node.return; 21760 node = node.sibling; 21761 } 21762 21763 return null; 21764} 21765 21766var NoFlags$1 = 21767/* */ 217680; // Represents whether effect should fire. 21769 21770var HasEffect = 21771/* */ 217721; // Represents the phase in which the effect (not the clean-up) fires. 21773 21774var Insertion = 21775/* */ 217762; 21777var Layout = 21778/* */ 217794; 21780var Passive$1 = 21781/* */ 217828; 21783 21784// and should be reset before starting a new render. 21785// This tracks which mutable sources need to be reset after a render. 21786 21787var workInProgressSources = []; 21788function resetWorkInProgressVersions() { 21789 for (var i = 0; i < workInProgressSources.length; i++) { 21790 var mutableSource = workInProgressSources[i]; 21791 21792 { 21793 mutableSource._workInProgressVersionPrimary = null; 21794 } 21795 } 21796 21797 workInProgressSources.length = 0; 21798} 21799// This ensures that the version used for server rendering matches the one 21800// that is eventually read during hydration. 21801// If they don't match there's a potential tear and a full deopt render is required. 21802 21803function registerMutableSourceForHydration(root, mutableSource) { 21804 var getVersion = mutableSource._getVersion; 21805 var version = getVersion(mutableSource._source); // TODO Clear this data once all pending hydration work is finished. 21806 // Retaining it forever may interfere with GC. 21807 21808 if (root.mutableSourceEagerHydrationData == null) { 21809 root.mutableSourceEagerHydrationData = [mutableSource, version]; 21810 } else { 21811 root.mutableSourceEagerHydrationData.push(mutableSource, version); 21812 } 21813} 21814 21815var ReactCurrentDispatcher$1 = ReactSharedInternals.ReactCurrentDispatcher, 21816 ReactCurrentBatchConfig$2 = ReactSharedInternals.ReactCurrentBatchConfig; 21817var didWarnAboutMismatchedHooksForComponent; 21818var didWarnUncachedGetSnapshot; 21819 21820{ 21821 didWarnAboutMismatchedHooksForComponent = new Set(); 21822} 21823 21824// These are set right before calling the component. 21825var renderLanes = NoLanes; // The work-in-progress fiber. I've named it differently to distinguish it from 21826// the work-in-progress hook. 21827 21828var currentlyRenderingFiber$1 = null; // Hooks are stored as a linked list on the fiber's memoizedState field. The 21829// current hook list is the list that belongs to the current fiber. The 21830// work-in-progress hook list is a new list that will be added to the 21831// work-in-progress fiber. 21832 21833var currentHook = null; 21834var workInProgressHook = null; // Whether an update was scheduled at any point during the render phase. This 21835// does not get reset if we do another render pass; only when we're completely 21836// finished evaluating this component. This is an optimization so we know 21837// whether we need to clear render phase updates after a throw. 21838 21839var didScheduleRenderPhaseUpdate = false; // Where an update was scheduled only during the current render pass. This 21840// gets reset after each attempt. 21841// TODO: Maybe there's some way to consolidate this with 21842// `didScheduleRenderPhaseUpdate`. Or with `numberOfReRenders`. 21843 21844var didScheduleRenderPhaseUpdateDuringThisPass = false; // Counts the number of useId hooks in this component. 21845 21846var localIdCounter = 0; // Used for ids that are generated completely client-side (i.e. not during 21847// hydration). This counter is global, so client ids are not stable across 21848// render attempts. 21849 21850var globalClientIdCounter = 0; 21851var RE_RENDER_LIMIT = 25; // In DEV, this is the name of the currently executing primitive hook 21852 21853var currentHookNameInDev = null; // In DEV, this list ensures that hooks are called in the same order between renders. 21854// The list stores the order of hooks used during the initial render (mount). 21855// Subsequent renders (updates) reference this list. 21856 21857var hookTypesDev = null; 21858var hookTypesUpdateIndexDev = -1; // In DEV, this tracks whether currently rendering component needs to ignore 21859// the dependencies for Hooks that need them (e.g. useEffect or useMemo). 21860// When true, such Hooks will always be "remounted". Only used during hot reload. 21861 21862var ignorePreviousDependencies = false; 21863 21864function mountHookTypesDev() { 21865 { 21866 var hookName = currentHookNameInDev; 21867 21868 if (hookTypesDev === null) { 21869 hookTypesDev = [hookName]; 21870 } else { 21871 hookTypesDev.push(hookName); 21872 } 21873 } 21874} 21875 21876function updateHookTypesDev() { 21877 { 21878 var hookName = currentHookNameInDev; 21879 21880 if (hookTypesDev !== null) { 21881 hookTypesUpdateIndexDev++; 21882 21883 if (hookTypesDev[hookTypesUpdateIndexDev] !== hookName) { 21884 warnOnHookMismatchInDev(hookName); 21885 } 21886 } 21887 } 21888} 21889 21890function checkDepsAreArrayDev(deps) { 21891 { 21892 if (deps !== undefined && deps !== null && !isArray(deps)) { 21893 // Verify deps, but only on mount to avoid extra checks. 21894 // It's unlikely their type would change as usually you define them inline. 21895 error('%s received a final argument that is not an array (instead, received `%s`). When ' + 'specified, the final argument must be an array.', currentHookNameInDev, typeof deps); 21896 } 21897 } 21898} 21899 21900function warnOnHookMismatchInDev(currentHookName) { 21901 { 21902 var componentName = getComponentNameFromFiber(currentlyRenderingFiber$1); 21903 21904 if (!didWarnAboutMismatchedHooksForComponent.has(componentName)) { 21905 didWarnAboutMismatchedHooksForComponent.add(componentName); 21906 21907 if (hookTypesDev !== null) { 21908 var table = ''; 21909 var secondColumnStart = 30; 21910 21911 for (var i = 0; i <= hookTypesUpdateIndexDev; i++) { 21912 var oldHookName = hookTypesDev[i]; 21913 var newHookName = i === hookTypesUpdateIndexDev ? currentHookName : oldHookName; 21914 var row = i + 1 + ". " + oldHookName; // Extra space so second column lines up 21915 // lol @ IE not supporting String#repeat 21916 21917 while (row.length < secondColumnStart) { 21918 row += ' '; 21919 } 21920 21921 row += newHookName + '\n'; 21922 table += row; 21923 } 21924 21925 error('React has detected a change in the order of Hooks called by %s. ' + 'This will lead to bugs and errors if not fixed. ' + 'For more information, read the Rules of Hooks: https://reactjs.org/link/rules-of-hooks\n\n' + ' Previous render Next render\n' + ' ------------------------------------------------------\n' + '%s' + ' ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^\n', componentName, table); 21926 } 21927 } 21928 } 21929} 21930 21931function throwInvalidHookError() { 21932 throw new Error('Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for' + ' one of the following reasons:\n' + '1. You might have mismatching versions of React and the renderer (such as React DOM)\n' + '2. You might be breaking the Rules of Hooks\n' + '3. You might have more than one copy of React in the same app\n' + 'See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.'); 21933} 21934 21935function areHookInputsEqual(nextDeps, prevDeps) { 21936 { 21937 if (ignorePreviousDependencies) { 21938 // Only true when this component is being hot reloaded. 21939 return false; 21940 } 21941 } 21942 21943 if (prevDeps === null) { 21944 { 21945 error('%s received a final argument during this render, but not during ' + 'the previous render. Even though the final argument is optional, ' + 'its type cannot change between renders.', currentHookNameInDev); 21946 } 21947 21948 return false; 21949 } 21950 21951 { 21952 // Don't bother comparing lengths in prod because these arrays should be 21953 // passed inline. 21954 if (nextDeps.length !== prevDeps.length) { 21955 error('The final argument passed to %s changed size between renders. The ' + 'order and size of this array must remain constant.\n\n' + 'Previous: %s\n' + 'Incoming: %s', currentHookNameInDev, "[" + prevDeps.join(', ') + "]", "[" + nextDeps.join(', ') + "]"); 21956 } 21957 } 21958 21959 for (var i = 0; i < prevDeps.length && i < nextDeps.length; i++) { 21960 if (objectIs(nextDeps[i], prevDeps[i])) { 21961 continue; 21962 } 21963 21964 return false; 21965 } 21966 21967 return true; 21968} 21969 21970function renderWithHooks(current, workInProgress, Component, props, secondArg, nextRenderLanes) { 21971 renderLanes = nextRenderLanes; 21972 currentlyRenderingFiber$1 = workInProgress; 21973 21974 { 21975 hookTypesDev = current !== null ? current._debugHookTypes : null; 21976 hookTypesUpdateIndexDev = -1; // Used for hot reloading: 21977 21978 ignorePreviousDependencies = current !== null && current.type !== workInProgress.type; 21979 } 21980 21981 workInProgress.memoizedState = null; 21982 workInProgress.updateQueue = null; 21983 workInProgress.lanes = NoLanes; // The following should have already been reset 21984 // currentHook = null; 21985 // workInProgressHook = null; 21986 // didScheduleRenderPhaseUpdate = false; 21987 // localIdCounter = 0; 21988 // TODO Warn if no hooks are used at all during mount, then some are used during update. 21989 // Currently we will identify the update render as a mount because memoizedState === null. 21990 // This is tricky because it's valid for certain types of components (e.g. React.lazy) 21991 // Using memoizedState to differentiate between mount/update only works if at least one stateful hook is used. 21992 // Non-stateful hooks (e.g. context) don't get added to memoizedState, 21993 // so memoizedState would be null during updates and mounts. 21994 21995 { 21996 if (current !== null && current.memoizedState !== null) { 21997 ReactCurrentDispatcher$1.current = HooksDispatcherOnUpdateInDEV; 21998 } else if (hookTypesDev !== null) { 21999 // This dispatcher handles an edge case where a component is updating, 22000 // but no stateful hooks have been used. 22001 // We want to match the production code behavior (which will use HooksDispatcherOnMount), 22002 // but with the extra DEV validation to ensure hooks ordering hasn't changed. 22003 // This dispatcher does that. 22004 ReactCurrentDispatcher$1.current = HooksDispatcherOnMountWithHookTypesInDEV; 22005 } else { 22006 ReactCurrentDispatcher$1.current = HooksDispatcherOnMountInDEV; 22007 } 22008 } 22009 22010 var children = Component(props, secondArg); // Check if there was a render phase update 22011 22012 if (didScheduleRenderPhaseUpdateDuringThisPass) { 22013 // Keep rendering in a loop for as long as render phase updates continue to 22014 // be scheduled. Use a counter to prevent infinite loops. 22015 var numberOfReRenders = 0; 22016 22017 do { 22018 didScheduleRenderPhaseUpdateDuringThisPass = false; 22019 localIdCounter = 0; 22020 22021 if (numberOfReRenders >= RE_RENDER_LIMIT) { 22022 throw new Error('Too many re-renders. React limits the number of renders to prevent ' + 'an infinite loop.'); 22023 } 22024 22025 numberOfReRenders += 1; 22026 22027 { 22028 // Even when hot reloading, allow dependencies to stabilize 22029 // after first render to prevent infinite render phase updates. 22030 ignorePreviousDependencies = false; 22031 } // Start over from the beginning of the list 22032 22033 22034 currentHook = null; 22035 workInProgressHook = null; 22036 workInProgress.updateQueue = null; 22037 22038 { 22039 // Also validate hook order for cascading updates. 22040 hookTypesUpdateIndexDev = -1; 22041 } 22042 22043 ReactCurrentDispatcher$1.current = HooksDispatcherOnRerenderInDEV ; 22044 children = Component(props, secondArg); 22045 } while (didScheduleRenderPhaseUpdateDuringThisPass); 22046 } // We can assume the previous dispatcher is always this one, since we set it 22047 // at the beginning of the render phase and there's no re-entrance. 22048 22049 22050 ReactCurrentDispatcher$1.current = ContextOnlyDispatcher; 22051 22052 { 22053 workInProgress._debugHookTypes = hookTypesDev; 22054 } // This check uses currentHook so that it works the same in DEV and prod bundles. 22055 // hookTypesDev could catch more cases (e.g. context) but only in DEV bundles. 22056 22057 22058 var didRenderTooFewHooks = currentHook !== null && currentHook.next !== null; 22059 renderLanes = NoLanes; 22060 currentlyRenderingFiber$1 = null; 22061 currentHook = null; 22062 workInProgressHook = null; 22063 22064 { 22065 currentHookNameInDev = null; 22066 hookTypesDev = null; 22067 hookTypesUpdateIndexDev = -1; // Confirm that a static flag was not added or removed since the last 22068 // render. If this fires, it suggests that we incorrectly reset the static 22069 // flags in some other part of the codebase. This has happened before, for 22070 // example, in the SuspenseList implementation. 22071 22072 if (current !== null && (current.flags & StaticMask) !== (workInProgress.flags & StaticMask) && // Disable this warning in legacy mode, because legacy Suspense is weird 22073 // and creates false positives. To make this work in legacy mode, we'd 22074 // need to mark fibers that commit in an incomplete state, somehow. For 22075 // now I'll disable the warning that most of the bugs that would trigger 22076 // it are either exclusive to concurrent mode or exist in both. 22077 (current.mode & ConcurrentMode) !== NoMode) { 22078 error('Internal React error: Expected static flag was missing. Please ' + 'notify the React team.'); 22079 } 22080 } 22081 22082 didScheduleRenderPhaseUpdate = false; // This is reset by checkDidRenderIdHook 22083 // localIdCounter = 0; 22084 22085 if (didRenderTooFewHooks) { 22086 throw new Error('Rendered fewer hooks than expected. This may be caused by an accidental ' + 'early return statement.'); 22087 } 22088 22089 return children; 22090} 22091function checkDidRenderIdHook() { 22092 // This should be called immediately after every renderWithHooks call. 22093 // Conceptually, it's part of the return value of renderWithHooks; it's only a 22094 // separate function to avoid using an array tuple. 22095 var didRenderIdHook = localIdCounter !== 0; 22096 localIdCounter = 0; 22097 return didRenderIdHook; 22098} 22099function bailoutHooks(current, workInProgress, lanes) { 22100 workInProgress.updateQueue = current.updateQueue; // TODO: Don't need to reset the flags here, because they're reset in the 22101 // complete phase (bubbleProperties). 22102 22103 if ( (workInProgress.mode & StrictEffectsMode) !== NoMode) { 22104 workInProgress.flags &= ~(MountPassiveDev | MountLayoutDev | Passive | Update); 22105 } else { 22106 workInProgress.flags &= ~(Passive | Update); 22107 } 22108 22109 current.lanes = removeLanes(current.lanes, lanes); 22110} 22111function resetHooksAfterThrow() { 22112 // We can assume the previous dispatcher is always this one, since we set it 22113 // at the beginning of the render phase and there's no re-entrance. 22114 ReactCurrentDispatcher$1.current = ContextOnlyDispatcher; 22115 22116 if (didScheduleRenderPhaseUpdate) { 22117 // There were render phase updates. These are only valid for this render 22118 // phase, which we are now aborting. Remove the updates from the queues so 22119 // they do not persist to the next render. Do not remove updates from hooks 22120 // that weren't processed. 22121 // 22122 // Only reset the updates from the queue if it has a clone. If it does 22123 // not have a clone, that means it wasn't processed, and the updates were 22124 // scheduled before we entered the render phase. 22125 var hook = currentlyRenderingFiber$1.memoizedState; 22126 22127 while (hook !== null) { 22128 var queue = hook.queue; 22129 22130 if (queue !== null) { 22131 queue.pending = null; 22132 } 22133 22134 hook = hook.next; 22135 } 22136 22137 didScheduleRenderPhaseUpdate = false; 22138 } 22139 22140 renderLanes = NoLanes; 22141 currentlyRenderingFiber$1 = null; 22142 currentHook = null; 22143 workInProgressHook = null; 22144 22145 { 22146 hookTypesDev = null; 22147 hookTypesUpdateIndexDev = -1; 22148 currentHookNameInDev = null; 22149 isUpdatingOpaqueValueInRenderPhase = false; 22150 } 22151 22152 didScheduleRenderPhaseUpdateDuringThisPass = false; 22153 localIdCounter = 0; 22154} 22155 22156function mountWorkInProgressHook() { 22157 var hook = { 22158 memoizedState: null, 22159 baseState: null, 22160 baseQueue: null, 22161 queue: null, 22162 next: null 22163 }; 22164 22165 if (workInProgressHook === null) { 22166 // This is the first hook in the list 22167 currentlyRenderingFiber$1.memoizedState = workInProgressHook = hook; 22168 } else { 22169 // Append to the end of the list 22170 workInProgressHook = workInProgressHook.next = hook; 22171 } 22172 22173 return workInProgressHook; 22174} 22175 22176function updateWorkInProgressHook() { 22177 // This function is used both for updates and for re-renders triggered by a 22178 // render phase update. It assumes there is either a current hook we can 22179 // clone, or a work-in-progress hook from a previous render pass that we can 22180 // use as a base. When we reach the end of the base list, we must switch to 22181 // the dispatcher used for mounts. 22182 var nextCurrentHook; 22183 22184 if (currentHook === null) { 22185 var current = currentlyRenderingFiber$1.alternate; 22186 22187 if (current !== null) { 22188 nextCurrentHook = current.memoizedState; 22189 } else { 22190 nextCurrentHook = null; 22191 } 22192 } else { 22193 nextCurrentHook = currentHook.next; 22194 } 22195 22196 var nextWorkInProgressHook; 22197 22198 if (workInProgressHook === null) { 22199 nextWorkInProgressHook = currentlyRenderingFiber$1.memoizedState; 22200 } else { 22201 nextWorkInProgressHook = workInProgressHook.next; 22202 } 22203 22204 if (nextWorkInProgressHook !== null) { 22205 // There's already a work-in-progress. Reuse it. 22206 workInProgressHook = nextWorkInProgressHook; 22207 nextWorkInProgressHook = workInProgressHook.next; 22208 currentHook = nextCurrentHook; 22209 } else { 22210 // Clone from the current hook. 22211 if (nextCurrentHook === null) { 22212 throw new Error('Rendered more hooks than during the previous render.'); 22213 } 22214 22215 currentHook = nextCurrentHook; 22216 var newHook = { 22217 memoizedState: currentHook.memoizedState, 22218 baseState: currentHook.baseState, 22219 baseQueue: currentHook.baseQueue, 22220 queue: currentHook.queue, 22221 next: null 22222 }; 22223 22224 if (workInProgressHook === null) { 22225 // This is the first hook in the list. 22226 currentlyRenderingFiber$1.memoizedState = workInProgressHook = newHook; 22227 } else { 22228 // Append to the end of the list. 22229 workInProgressHook = workInProgressHook.next = newHook; 22230 } 22231 } 22232 22233 return workInProgressHook; 22234} 22235 22236function createFunctionComponentUpdateQueue() { 22237 return { 22238 lastEffect: null, 22239 stores: null 22240 }; 22241} 22242 22243function basicStateReducer(state, action) { 22244 // $FlowFixMe: Flow doesn't like mixed types 22245 return typeof action === 'function' ? action(state) : action; 22246} 22247 22248function mountReducer(reducer, initialArg, init) { 22249 var hook = mountWorkInProgressHook(); 22250 var initialState; 22251 22252 if (init !== undefined) { 22253 initialState = init(initialArg); 22254 } else { 22255 initialState = initialArg; 22256 } 22257 22258 hook.memoizedState = hook.baseState = initialState; 22259 var queue = { 22260 pending: null, 22261 interleaved: null, 22262 lanes: NoLanes, 22263 dispatch: null, 22264 lastRenderedReducer: reducer, 22265 lastRenderedState: initialState 22266 }; 22267 hook.queue = queue; 22268 var dispatch = queue.dispatch = dispatchReducerAction.bind(null, currentlyRenderingFiber$1, queue); 22269 return [hook.memoizedState, dispatch]; 22270} 22271 22272function updateReducer(reducer, initialArg, init) { 22273 var hook = updateWorkInProgressHook(); 22274 var queue = hook.queue; 22275 22276 if (queue === null) { 22277 throw new Error('Should have a queue. This is likely a bug in React. Please file an issue.'); 22278 } 22279 22280 queue.lastRenderedReducer = reducer; 22281 var current = currentHook; // The last rebase update that is NOT part of the base state. 22282 22283 var baseQueue = current.baseQueue; // The last pending update that hasn't been processed yet. 22284 22285 var pendingQueue = queue.pending; 22286 22287 if (pendingQueue !== null) { 22288 // We have new updates that haven't been processed yet. 22289 // We'll add them to the base queue. 22290 if (baseQueue !== null) { 22291 // Merge the pending queue and the base queue. 22292 var baseFirst = baseQueue.next; 22293 var pendingFirst = pendingQueue.next; 22294 baseQueue.next = pendingFirst; 22295 pendingQueue.next = baseFirst; 22296 } 22297 22298 { 22299 if (current.baseQueue !== baseQueue) { 22300 // Internal invariant that should never happen, but feasibly could in 22301 // the future if we implement resuming, or some form of that. 22302 error('Internal error: Expected work-in-progress queue to be a clone. ' + 'This is a bug in React.'); 22303 } 22304 } 22305 22306 current.baseQueue = baseQueue = pendingQueue; 22307 queue.pending = null; 22308 } 22309 22310 if (baseQueue !== null) { 22311 // We have a queue to process. 22312 var first = baseQueue.next; 22313 var newState = current.baseState; 22314 var newBaseState = null; 22315 var newBaseQueueFirst = null; 22316 var newBaseQueueLast = null; 22317 var update = first; 22318 22319 do { 22320 var updateLane = update.lane; 22321 22322 if (!isSubsetOfLanes(renderLanes, updateLane)) { 22323 // Priority is insufficient. Skip this update. If this is the first 22324 // skipped update, the previous update/state is the new base 22325 // update/state. 22326 var clone = { 22327 lane: updateLane, 22328 action: update.action, 22329 hasEagerState: update.hasEagerState, 22330 eagerState: update.eagerState, 22331 next: null 22332 }; 22333 22334 if (newBaseQueueLast === null) { 22335 newBaseQueueFirst = newBaseQueueLast = clone; 22336 newBaseState = newState; 22337 } else { 22338 newBaseQueueLast = newBaseQueueLast.next = clone; 22339 } // Update the remaining priority in the queue. 22340 // TODO: Don't need to accumulate this. Instead, we can remove 22341 // renderLanes from the original lanes. 22342 22343 22344 currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, updateLane); 22345 markSkippedUpdateLanes(updateLane); 22346 } else { 22347 // This update does have sufficient priority. 22348 if (newBaseQueueLast !== null) { 22349 var _clone = { 22350 // This update is going to be committed so we never want uncommit 22351 // it. Using NoLane works because 0 is a subset of all bitmasks, so 22352 // this will never be skipped by the check above. 22353 lane: NoLane, 22354 action: update.action, 22355 hasEagerState: update.hasEagerState, 22356 eagerState: update.eagerState, 22357 next: null 22358 }; 22359 newBaseQueueLast = newBaseQueueLast.next = _clone; 22360 } // Process this update. 22361 22362 22363 if (update.hasEagerState) { 22364 // If this update is a state update (not a reducer) and was processed eagerly, 22365 // we can use the eagerly computed state 22366 newState = update.eagerState; 22367 } else { 22368 var action = update.action; 22369 newState = reducer(newState, action); 22370 } 22371 } 22372 22373 update = update.next; 22374 } while (update !== null && update !== first); 22375 22376 if (newBaseQueueLast === null) { 22377 newBaseState = newState; 22378 } else { 22379 newBaseQueueLast.next = newBaseQueueFirst; 22380 } // Mark that the fiber performed work, but only if the new state is 22381 // different from the current state. 22382 22383 22384 if (!objectIs(newState, hook.memoizedState)) { 22385 markWorkInProgressReceivedUpdate(); 22386 } 22387 22388 hook.memoizedState = newState; 22389 hook.baseState = newBaseState; 22390 hook.baseQueue = newBaseQueueLast; 22391 queue.lastRenderedState = newState; 22392 } // Interleaved updates are stored on a separate queue. We aren't going to 22393 // process them during this render, but we do need to track which lanes 22394 // are remaining. 22395 22396 22397 var lastInterleaved = queue.interleaved; 22398 22399 if (lastInterleaved !== null) { 22400 var interleaved = lastInterleaved; 22401 22402 do { 22403 var interleavedLane = interleaved.lane; 22404 currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, interleavedLane); 22405 markSkippedUpdateLanes(interleavedLane); 22406 interleaved = interleaved.next; 22407 } while (interleaved !== lastInterleaved); 22408 } else if (baseQueue === null) { 22409 // `queue.lanes` is used for entangling transitions. We can set it back to 22410 // zero once the queue is empty. 22411 queue.lanes = NoLanes; 22412 } 22413 22414 var dispatch = queue.dispatch; 22415 return [hook.memoizedState, dispatch]; 22416} 22417 22418function rerenderReducer(reducer, initialArg, init) { 22419 var hook = updateWorkInProgressHook(); 22420 var queue = hook.queue; 22421 22422 if (queue === null) { 22423 throw new Error('Should have a queue. This is likely a bug in React. Please file an issue.'); 22424 } 22425 22426 queue.lastRenderedReducer = reducer; // This is a re-render. Apply the new render phase updates to the previous 22427 // work-in-progress hook. 22428 22429 var dispatch = queue.dispatch; 22430 var lastRenderPhaseUpdate = queue.pending; 22431 var newState = hook.memoizedState; 22432 22433 if (lastRenderPhaseUpdate !== null) { 22434 // The queue doesn't persist past this render pass. 22435 queue.pending = null; 22436 var firstRenderPhaseUpdate = lastRenderPhaseUpdate.next; 22437 var update = firstRenderPhaseUpdate; 22438 22439 do { 22440 // Process this render phase update. We don't have to check the 22441 // priority because it will always be the same as the current 22442 // render's. 22443 var action = update.action; 22444 newState = reducer(newState, action); 22445 update = update.next; 22446 } while (update !== firstRenderPhaseUpdate); // Mark that the fiber performed work, but only if the new state is 22447 // different from the current state. 22448 22449 22450 if (!objectIs(newState, hook.memoizedState)) { 22451 markWorkInProgressReceivedUpdate(); 22452 } 22453 22454 hook.memoizedState = newState; // Don't persist the state accumulated from the render phase updates to 22455 // the base state unless the queue is empty. 22456 // TODO: Not sure if this is the desired semantics, but it's what we 22457 // do for gDSFP. I can't remember why. 22458 22459 if (hook.baseQueue === null) { 22460 hook.baseState = newState; 22461 } 22462 22463 queue.lastRenderedState = newState; 22464 } 22465 22466 return [newState, dispatch]; 22467} 22468 22469function mountMutableSource(source, getSnapshot, subscribe) { 22470 { 22471 return undefined; 22472 } 22473} 22474 22475function updateMutableSource(source, getSnapshot, subscribe) { 22476 { 22477 return undefined; 22478 } 22479} 22480 22481function mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) { 22482 var fiber = currentlyRenderingFiber$1; 22483 var hook = mountWorkInProgressHook(); 22484 var nextSnapshot; 22485 var isHydrating = getIsHydrating(); 22486 22487 if (isHydrating) { 22488 if (getServerSnapshot === undefined) { 22489 throw new Error('Missing getServerSnapshot, which is required for ' + 'server-rendered content. Will revert to client rendering.'); 22490 } 22491 22492 nextSnapshot = getServerSnapshot(); 22493 22494 { 22495 if (!didWarnUncachedGetSnapshot) { 22496 if (nextSnapshot !== getServerSnapshot()) { 22497 error('The result of getServerSnapshot should be cached to avoid an infinite loop'); 22498 22499 didWarnUncachedGetSnapshot = true; 22500 } 22501 } 22502 } 22503 } else { 22504 nextSnapshot = getSnapshot(); 22505 22506 { 22507 if (!didWarnUncachedGetSnapshot) { 22508 var cachedSnapshot = getSnapshot(); 22509 22510 if (!objectIs(nextSnapshot, cachedSnapshot)) { 22511 error('The result of getSnapshot should be cached to avoid an infinite loop'); 22512 22513 didWarnUncachedGetSnapshot = true; 22514 } 22515 } 22516 } // Unless we're rendering a blocking lane, schedule a consistency check. 22517 // Right before committing, we will walk the tree and check if any of the 22518 // stores were mutated. 22519 // 22520 // We won't do this if we're hydrating server-rendered content, because if 22521 // the content is stale, it's already visible anyway. Instead we'll patch 22522 // it up in a passive effect. 22523 22524 22525 var root = getWorkInProgressRoot(); 22526 22527 if (root === null) { 22528 throw new Error('Expected a work-in-progress root. This is a bug in React. Please file an issue.'); 22529 } 22530 22531 if (!includesBlockingLane(root, renderLanes)) { 22532 pushStoreConsistencyCheck(fiber, getSnapshot, nextSnapshot); 22533 } 22534 } // Read the current snapshot from the store on every render. This breaks the 22535 // normal rules of React, and only works because store updates are 22536 // always synchronous. 22537 22538 22539 hook.memoizedState = nextSnapshot; 22540 var inst = { 22541 value: nextSnapshot, 22542 getSnapshot: getSnapshot 22543 }; 22544 hook.queue = inst; // Schedule an effect to subscribe to the store. 22545 22546 mountEffect(subscribeToStore.bind(null, fiber, inst, subscribe), [subscribe]); // Schedule an effect to update the mutable instance fields. We will update 22547 // this whenever subscribe, getSnapshot, or value changes. Because there's no 22548 // clean-up function, and we track the deps correctly, we can call pushEffect 22549 // directly, without storing any additional state. For the same reason, we 22550 // don't need to set a static flag, either. 22551 // TODO: We can move this to the passive phase once we add a pre-commit 22552 // consistency check. See the next comment. 22553 22554 fiber.flags |= Passive; 22555 pushEffect(HasEffect | Passive$1, updateStoreInstance.bind(null, fiber, inst, nextSnapshot, getSnapshot), undefined, null); 22556 return nextSnapshot; 22557} 22558 22559function updateSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) { 22560 var fiber = currentlyRenderingFiber$1; 22561 var hook = updateWorkInProgressHook(); // Read the current snapshot from the store on every render. This breaks the 22562 // normal rules of React, and only works because store updates are 22563 // always synchronous. 22564 22565 var nextSnapshot = getSnapshot(); 22566 22567 { 22568 if (!didWarnUncachedGetSnapshot) { 22569 var cachedSnapshot = getSnapshot(); 22570 22571 if (!objectIs(nextSnapshot, cachedSnapshot)) { 22572 error('The result of getSnapshot should be cached to avoid an infinite loop'); 22573 22574 didWarnUncachedGetSnapshot = true; 22575 } 22576 } 22577 } 22578 22579 var prevSnapshot = hook.memoizedState; 22580 var snapshotChanged = !objectIs(prevSnapshot, nextSnapshot); 22581 22582 if (snapshotChanged) { 22583 hook.memoizedState = nextSnapshot; 22584 markWorkInProgressReceivedUpdate(); 22585 } 22586 22587 var inst = hook.queue; 22588 updateEffect(subscribeToStore.bind(null, fiber, inst, subscribe), [subscribe]); // Whenever getSnapshot or subscribe changes, we need to check in the 22589 // commit phase if there was an interleaved mutation. In concurrent mode 22590 // this can happen all the time, but even in synchronous mode, an earlier 22591 // effect may have mutated the store. 22592 22593 if (inst.getSnapshot !== getSnapshot || snapshotChanged || // Check if the susbcribe function changed. We can save some memory by 22594 // checking whether we scheduled a subscription effect above. 22595 workInProgressHook !== null && workInProgressHook.memoizedState.tag & HasEffect) { 22596 fiber.flags |= Passive; 22597 pushEffect(HasEffect | Passive$1, updateStoreInstance.bind(null, fiber, inst, nextSnapshot, getSnapshot), undefined, null); // Unless we're rendering a blocking lane, schedule a consistency check. 22598 // Right before committing, we will walk the tree and check if any of the 22599 // stores were mutated. 22600 22601 var root = getWorkInProgressRoot(); 22602 22603 if (root === null) { 22604 throw new Error('Expected a work-in-progress root. This is a bug in React. Please file an issue.'); 22605 } 22606 22607 if (!includesBlockingLane(root, renderLanes)) { 22608 pushStoreConsistencyCheck(fiber, getSnapshot, nextSnapshot); 22609 } 22610 } 22611 22612 return nextSnapshot; 22613} 22614 22615function pushStoreConsistencyCheck(fiber, getSnapshot, renderedSnapshot) { 22616 fiber.flags |= StoreConsistency; 22617 var check = { 22618 getSnapshot: getSnapshot, 22619 value: renderedSnapshot 22620 }; 22621 var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue; 22622 22623 if (componentUpdateQueue === null) { 22624 componentUpdateQueue = createFunctionComponentUpdateQueue(); 22625 currentlyRenderingFiber$1.updateQueue = componentUpdateQueue; 22626 componentUpdateQueue.stores = [check]; 22627 } else { 22628 var stores = componentUpdateQueue.stores; 22629 22630 if (stores === null) { 22631 componentUpdateQueue.stores = [check]; 22632 } else { 22633 stores.push(check); 22634 } 22635 } 22636} 22637 22638function updateStoreInstance(fiber, inst, nextSnapshot, getSnapshot) { 22639 // These are updated in the passive phase 22640 inst.value = nextSnapshot; 22641 inst.getSnapshot = getSnapshot; // Something may have been mutated in between render and commit. This could 22642 // have been in an event that fired before the passive effects, or it could 22643 // have been in a layout effect. In that case, we would have used the old 22644 // snapsho and getSnapshot values to bail out. We need to check one more time. 22645 22646 if (checkIfSnapshotChanged(inst)) { 22647 // Force a re-render. 22648 forceStoreRerender(fiber); 22649 } 22650} 22651 22652function subscribeToStore(fiber, inst, subscribe) { 22653 var handleStoreChange = function () { 22654 // The store changed. Check if the snapshot changed since the last time we 22655 // read from the store. 22656 if (checkIfSnapshotChanged(inst)) { 22657 // Force a re-render. 22658 forceStoreRerender(fiber); 22659 } 22660 }; // Subscribe to the store and return a clean-up function. 22661 22662 22663 return subscribe(handleStoreChange); 22664} 22665 22666function checkIfSnapshotChanged(inst) { 22667 var latestGetSnapshot = inst.getSnapshot; 22668 var prevValue = inst.value; 22669 22670 try { 22671 var nextValue = latestGetSnapshot(); 22672 return !objectIs(prevValue, nextValue); 22673 } catch (error) { 22674 return true; 22675 } 22676} 22677 22678function forceStoreRerender(fiber) { 22679 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 22680 22681 if (root !== null) { 22682 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 22683 } 22684} 22685 22686function mountState(initialState) { 22687 var hook = mountWorkInProgressHook(); 22688 22689 if (typeof initialState === 'function') { 22690 // $FlowFixMe: Flow doesn't like mixed types 22691 initialState = initialState(); 22692 } 22693 22694 hook.memoizedState = hook.baseState = initialState; 22695 var queue = { 22696 pending: null, 22697 interleaved: null, 22698 lanes: NoLanes, 22699 dispatch: null, 22700 lastRenderedReducer: basicStateReducer, 22701 lastRenderedState: initialState 22702 }; 22703 hook.queue = queue; 22704 var dispatch = queue.dispatch = dispatchSetState.bind(null, currentlyRenderingFiber$1, queue); 22705 return [hook.memoizedState, dispatch]; 22706} 22707 22708function updateState(initialState) { 22709 return updateReducer(basicStateReducer); 22710} 22711 22712function rerenderState(initialState) { 22713 return rerenderReducer(basicStateReducer); 22714} 22715 22716function pushEffect(tag, create, destroy, deps) { 22717 var effect = { 22718 tag: tag, 22719 create: create, 22720 destroy: destroy, 22721 deps: deps, 22722 // Circular 22723 next: null 22724 }; 22725 var componentUpdateQueue = currentlyRenderingFiber$1.updateQueue; 22726 22727 if (componentUpdateQueue === null) { 22728 componentUpdateQueue = createFunctionComponentUpdateQueue(); 22729 currentlyRenderingFiber$1.updateQueue = componentUpdateQueue; 22730 componentUpdateQueue.lastEffect = effect.next = effect; 22731 } else { 22732 var lastEffect = componentUpdateQueue.lastEffect; 22733 22734 if (lastEffect === null) { 22735 componentUpdateQueue.lastEffect = effect.next = effect; 22736 } else { 22737 var firstEffect = lastEffect.next; 22738 lastEffect.next = effect; 22739 effect.next = firstEffect; 22740 componentUpdateQueue.lastEffect = effect; 22741 } 22742 } 22743 22744 return effect; 22745} 22746 22747function mountRef(initialValue) { 22748 var hook = mountWorkInProgressHook(); 22749 22750 { 22751 var _ref2 = { 22752 current: initialValue 22753 }; 22754 hook.memoizedState = _ref2; 22755 return _ref2; 22756 } 22757} 22758 22759function updateRef(initialValue) { 22760 var hook = updateWorkInProgressHook(); 22761 return hook.memoizedState; 22762} 22763 22764function mountEffectImpl(fiberFlags, hookFlags, create, deps) { 22765 var hook = mountWorkInProgressHook(); 22766 var nextDeps = deps === undefined ? null : deps; 22767 currentlyRenderingFiber$1.flags |= fiberFlags; 22768 hook.memoizedState = pushEffect(HasEffect | hookFlags, create, undefined, nextDeps); 22769} 22770 22771function updateEffectImpl(fiberFlags, hookFlags, create, deps) { 22772 var hook = updateWorkInProgressHook(); 22773 var nextDeps = deps === undefined ? null : deps; 22774 var destroy = undefined; 22775 22776 if (currentHook !== null) { 22777 var prevEffect = currentHook.memoizedState; 22778 destroy = prevEffect.destroy; 22779 22780 if (nextDeps !== null) { 22781 var prevDeps = prevEffect.deps; 22782 22783 if (areHookInputsEqual(nextDeps, prevDeps)) { 22784 hook.memoizedState = pushEffect(hookFlags, create, destroy, nextDeps); 22785 return; 22786 } 22787 } 22788 } 22789 22790 currentlyRenderingFiber$1.flags |= fiberFlags; 22791 hook.memoizedState = pushEffect(HasEffect | hookFlags, create, destroy, nextDeps); 22792} 22793 22794function mountEffect(create, deps) { 22795 if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) { 22796 return mountEffectImpl(MountPassiveDev | Passive | PassiveStatic, Passive$1, create, deps); 22797 } else { 22798 return mountEffectImpl(Passive | PassiveStatic, Passive$1, create, deps); 22799 } 22800} 22801 22802function updateEffect(create, deps) { 22803 return updateEffectImpl(Passive, Passive$1, create, deps); 22804} 22805 22806function mountInsertionEffect(create, deps) { 22807 return mountEffectImpl(Update, Insertion, create, deps); 22808} 22809 22810function updateInsertionEffect(create, deps) { 22811 return updateEffectImpl(Update, Insertion, create, deps); 22812} 22813 22814function mountLayoutEffect(create, deps) { 22815 var fiberFlags = Update; 22816 22817 { 22818 fiberFlags |= LayoutStatic; 22819 } 22820 22821 if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) { 22822 fiberFlags |= MountLayoutDev; 22823 } 22824 22825 return mountEffectImpl(fiberFlags, Layout, create, deps); 22826} 22827 22828function updateLayoutEffect(create, deps) { 22829 return updateEffectImpl(Update, Layout, create, deps); 22830} 22831 22832function imperativeHandleEffect(create, ref) { 22833 if (typeof ref === 'function') { 22834 var refCallback = ref; 22835 22836 var _inst = create(); 22837 22838 refCallback(_inst); 22839 return function () { 22840 refCallback(null); 22841 }; 22842 } else if (ref !== null && ref !== undefined) { 22843 var refObject = ref; 22844 22845 { 22846 if (!refObject.hasOwnProperty('current')) { 22847 error('Expected useImperativeHandle() first argument to either be a ' + 'ref callback or React.createRef() object. Instead received: %s.', 'an object with keys {' + Object.keys(refObject).join(', ') + '}'); 22848 } 22849 } 22850 22851 var _inst2 = create(); 22852 22853 refObject.current = _inst2; 22854 return function () { 22855 refObject.current = null; 22856 }; 22857 } 22858} 22859 22860function mountImperativeHandle(ref, create, deps) { 22861 { 22862 if (typeof create !== 'function') { 22863 error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null'); 22864 } 22865 } // TODO: If deps are provided, should we skip comparing the ref itself? 22866 22867 22868 var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null; 22869 var fiberFlags = Update; 22870 22871 { 22872 fiberFlags |= LayoutStatic; 22873 } 22874 22875 if ( (currentlyRenderingFiber$1.mode & StrictEffectsMode) !== NoMode) { 22876 fiberFlags |= MountLayoutDev; 22877 } 22878 22879 return mountEffectImpl(fiberFlags, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps); 22880} 22881 22882function updateImperativeHandle(ref, create, deps) { 22883 { 22884 if (typeof create !== 'function') { 22885 error('Expected useImperativeHandle() second argument to be a function ' + 'that creates a handle. Instead received: %s.', create !== null ? typeof create : 'null'); 22886 } 22887 } // TODO: If deps are provided, should we skip comparing the ref itself? 22888 22889 22890 var effectDeps = deps !== null && deps !== undefined ? deps.concat([ref]) : null; 22891 return updateEffectImpl(Update, Layout, imperativeHandleEffect.bind(null, create, ref), effectDeps); 22892} 22893 22894function mountDebugValue(value, formatterFn) {// This hook is normally a no-op. 22895 // The react-debug-hooks package injects its own implementation 22896 // so that e.g. DevTools can display custom hook values. 22897} 22898 22899var updateDebugValue = mountDebugValue; 22900 22901function mountCallback(callback, deps) { 22902 var hook = mountWorkInProgressHook(); 22903 var nextDeps = deps === undefined ? null : deps; 22904 hook.memoizedState = [callback, nextDeps]; 22905 return callback; 22906} 22907 22908function updateCallback(callback, deps) { 22909 var hook = updateWorkInProgressHook(); 22910 var nextDeps = deps === undefined ? null : deps; 22911 var prevState = hook.memoizedState; 22912 22913 if (prevState !== null) { 22914 if (nextDeps !== null) { 22915 var prevDeps = prevState[1]; 22916 22917 if (areHookInputsEqual(nextDeps, prevDeps)) { 22918 return prevState[0]; 22919 } 22920 } 22921 } 22922 22923 hook.memoizedState = [callback, nextDeps]; 22924 return callback; 22925} 22926 22927function mountMemo(nextCreate, deps) { 22928 var hook = mountWorkInProgressHook(); 22929 var nextDeps = deps === undefined ? null : deps; 22930 var nextValue = nextCreate(); 22931 hook.memoizedState = [nextValue, nextDeps]; 22932 return nextValue; 22933} 22934 22935function updateMemo(nextCreate, deps) { 22936 var hook = updateWorkInProgressHook(); 22937 var nextDeps = deps === undefined ? null : deps; 22938 var prevState = hook.memoizedState; 22939 22940 if (prevState !== null) { 22941 // Assume these are defined. If they're not, areHookInputsEqual will warn. 22942 if (nextDeps !== null) { 22943 var prevDeps = prevState[1]; 22944 22945 if (areHookInputsEqual(nextDeps, prevDeps)) { 22946 return prevState[0]; 22947 } 22948 } 22949 } 22950 22951 var nextValue = nextCreate(); 22952 hook.memoizedState = [nextValue, nextDeps]; 22953 return nextValue; 22954} 22955 22956function mountDeferredValue(value) { 22957 var hook = mountWorkInProgressHook(); 22958 hook.memoizedState = value; 22959 return value; 22960} 22961 22962function updateDeferredValue(value) { 22963 var hook = updateWorkInProgressHook(); 22964 var resolvedCurrentHook = currentHook; 22965 var prevValue = resolvedCurrentHook.memoizedState; 22966 return updateDeferredValueImpl(hook, prevValue, value); 22967} 22968 22969function rerenderDeferredValue(value) { 22970 var hook = updateWorkInProgressHook(); 22971 22972 if (currentHook === null) { 22973 // This is a rerender during a mount. 22974 hook.memoizedState = value; 22975 return value; 22976 } else { 22977 // This is a rerender during an update. 22978 var prevValue = currentHook.memoizedState; 22979 return updateDeferredValueImpl(hook, prevValue, value); 22980 } 22981} 22982 22983function updateDeferredValueImpl(hook, prevValue, value) { 22984 var shouldDeferValue = !includesOnlyNonUrgentLanes(renderLanes); 22985 22986 if (shouldDeferValue) { 22987 // This is an urgent update. If the value has changed, keep using the 22988 // previous value and spawn a deferred render to update it later. 22989 if (!objectIs(value, prevValue)) { 22990 // Schedule a deferred render 22991 var deferredLane = claimNextTransitionLane(); 22992 currentlyRenderingFiber$1.lanes = mergeLanes(currentlyRenderingFiber$1.lanes, deferredLane); 22993 markSkippedUpdateLanes(deferredLane); // Set this to true to indicate that the rendered value is inconsistent 22994 // from the latest value. The name "baseState" doesn't really match how we 22995 // use it because we're reusing a state hook field instead of creating a 22996 // new one. 22997 22998 hook.baseState = true; 22999 } // Reuse the previous value 23000 23001 23002 return prevValue; 23003 } else { 23004 // This is not an urgent update, so we can use the latest value regardless 23005 // of what it is. No need to defer it. 23006 // However, if we're currently inside a spawned render, then we need to mark 23007 // this as an update to prevent the fiber from bailing out. 23008 // 23009 // `baseState` is true when the current value is different from the rendered 23010 // value. The name doesn't really match how we use it because we're reusing 23011 // a state hook field instead of creating a new one. 23012 if (hook.baseState) { 23013 // Flip this back to false. 23014 hook.baseState = false; 23015 markWorkInProgressReceivedUpdate(); 23016 } 23017 23018 hook.memoizedState = value; 23019 return value; 23020 } 23021} 23022 23023function startTransition(setPending, callback, options) { 23024 var previousPriority = getCurrentUpdatePriority(); 23025 setCurrentUpdatePriority(higherEventPriority(previousPriority, ContinuousEventPriority)); 23026 setPending(true); 23027 var prevTransition = ReactCurrentBatchConfig$2.transition; 23028 ReactCurrentBatchConfig$2.transition = {}; 23029 var currentTransition = ReactCurrentBatchConfig$2.transition; 23030 23031 { 23032 ReactCurrentBatchConfig$2.transition._updatedFibers = new Set(); 23033 } 23034 23035 try { 23036 setPending(false); 23037 callback(); 23038 } finally { 23039 setCurrentUpdatePriority(previousPriority); 23040 ReactCurrentBatchConfig$2.transition = prevTransition; 23041 23042 { 23043 if (prevTransition === null && currentTransition._updatedFibers) { 23044 var updatedFibersCount = currentTransition._updatedFibers.size; 23045 23046 if (updatedFibersCount > 10) { 23047 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.'); 23048 } 23049 23050 currentTransition._updatedFibers.clear(); 23051 } 23052 } 23053 } 23054} 23055 23056function mountTransition() { 23057 var _mountState = mountState(false), 23058 isPending = _mountState[0], 23059 setPending = _mountState[1]; // The `start` method never changes. 23060 23061 23062 var start = startTransition.bind(null, setPending); 23063 var hook = mountWorkInProgressHook(); 23064 hook.memoizedState = start; 23065 return [isPending, start]; 23066} 23067 23068function updateTransition() { 23069 var _updateState = updateState(), 23070 isPending = _updateState[0]; 23071 23072 var hook = updateWorkInProgressHook(); 23073 var start = hook.memoizedState; 23074 return [isPending, start]; 23075} 23076 23077function rerenderTransition() { 23078 var _rerenderState = rerenderState(), 23079 isPending = _rerenderState[0]; 23080 23081 var hook = updateWorkInProgressHook(); 23082 var start = hook.memoizedState; 23083 return [isPending, start]; 23084} 23085 23086var isUpdatingOpaqueValueInRenderPhase = false; 23087function getIsUpdatingOpaqueValueInRenderPhaseInDEV() { 23088 { 23089 return isUpdatingOpaqueValueInRenderPhase; 23090 } 23091} 23092 23093function mountId() { 23094 var hook = mountWorkInProgressHook(); 23095 var root = getWorkInProgressRoot(); // TODO: In Fizz, id generation is specific to each server config. Maybe we 23096 // should do this in Fiber, too? Deferring this decision for now because 23097 // there's no other place to store the prefix except for an internal field on 23098 // the public createRoot object, which the fiber tree does not currently have 23099 // a reference to. 23100 23101 var identifierPrefix = root.identifierPrefix; 23102 var id; 23103 23104 if (getIsHydrating()) { 23105 var treeId = getTreeId(); // Use a captial R prefix for server-generated ids. 23106 23107 id = ':' + identifierPrefix + 'R' + treeId; // Unless this is the first id at this level, append a number at the end 23108 // that represents the position of this useId hook among all the useId 23109 // hooks for this fiber. 23110 23111 var localId = localIdCounter++; 23112 23113 if (localId > 0) { 23114 id += 'H' + localId.toString(32); 23115 } 23116 23117 id += ':'; 23118 } else { 23119 // Use a lowercase r prefix for client-generated ids. 23120 var globalClientId = globalClientIdCounter++; 23121 id = ':' + identifierPrefix + 'r' + globalClientId.toString(32) + ':'; 23122 } 23123 23124 hook.memoizedState = id; 23125 return id; 23126} 23127 23128function updateId() { 23129 var hook = updateWorkInProgressHook(); 23130 var id = hook.memoizedState; 23131 return id; 23132} 23133 23134function dispatchReducerAction(fiber, queue, action) { 23135 { 23136 if (typeof arguments[3] === 'function') { 23137 error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().'); 23138 } 23139 } 23140 23141 var lane = requestUpdateLane(fiber); 23142 var update = { 23143 lane: lane, 23144 action: action, 23145 hasEagerState: false, 23146 eagerState: null, 23147 next: null 23148 }; 23149 23150 if (isRenderPhaseUpdate(fiber)) { 23151 enqueueRenderPhaseUpdate(queue, update); 23152 } else { 23153 var root = enqueueConcurrentHookUpdate(fiber, queue, update, lane); 23154 23155 if (root !== null) { 23156 var eventTime = requestEventTime(); 23157 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 23158 entangleTransitionUpdate(root, queue, lane); 23159 } 23160 } 23161 23162 markUpdateInDevTools(fiber, lane); 23163} 23164 23165function dispatchSetState(fiber, queue, action) { 23166 { 23167 if (typeof arguments[3] === 'function') { 23168 error("State updates from the useState() and useReducer() Hooks don't support the " + 'second callback argument. To execute a side effect after ' + 'rendering, declare it in the component body with useEffect().'); 23169 } 23170 } 23171 23172 var lane = requestUpdateLane(fiber); 23173 var update = { 23174 lane: lane, 23175 action: action, 23176 hasEagerState: false, 23177 eagerState: null, 23178 next: null 23179 }; 23180 23181 if (isRenderPhaseUpdate(fiber)) { 23182 enqueueRenderPhaseUpdate(queue, update); 23183 } else { 23184 var alternate = fiber.alternate; 23185 23186 if (fiber.lanes === NoLanes && (alternate === null || alternate.lanes === NoLanes)) { 23187 // The queue is currently empty, which means we can eagerly compute the 23188 // next state before entering the render phase. If the new state is the 23189 // same as the current state, we may be able to bail out entirely. 23190 var lastRenderedReducer = queue.lastRenderedReducer; 23191 23192 if (lastRenderedReducer !== null) { 23193 var prevDispatcher; 23194 23195 { 23196 prevDispatcher = ReactCurrentDispatcher$1.current; 23197 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23198 } 23199 23200 try { 23201 var currentState = queue.lastRenderedState; 23202 var eagerState = lastRenderedReducer(currentState, action); // Stash the eagerly computed state, and the reducer used to compute 23203 // it, on the update object. If the reducer hasn't changed by the 23204 // time we enter the render phase, then the eager state can be used 23205 // without calling the reducer again. 23206 23207 update.hasEagerState = true; 23208 update.eagerState = eagerState; 23209 23210 if (objectIs(eagerState, currentState)) { 23211 // Fast path. We can bail out without scheduling React to re-render. 23212 // It's still possible that we'll need to rebase this update later, 23213 // if the component re-renders for a different reason and by that 23214 // time the reducer has changed. 23215 // TODO: Do we still need to entangle transitions in this case? 23216 enqueueConcurrentHookUpdateAndEagerlyBailout(fiber, queue, update, lane); 23217 return; 23218 } 23219 } catch (error) {// Suppress the error. It will throw again in the render phase. 23220 } finally { 23221 { 23222 ReactCurrentDispatcher$1.current = prevDispatcher; 23223 } 23224 } 23225 } 23226 } 23227 23228 var root = enqueueConcurrentHookUpdate(fiber, queue, update, lane); 23229 23230 if (root !== null) { 23231 var eventTime = requestEventTime(); 23232 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 23233 entangleTransitionUpdate(root, queue, lane); 23234 } 23235 } 23236 23237 markUpdateInDevTools(fiber, lane); 23238} 23239 23240function isRenderPhaseUpdate(fiber) { 23241 var alternate = fiber.alternate; 23242 return fiber === currentlyRenderingFiber$1 || alternate !== null && alternate === currentlyRenderingFiber$1; 23243} 23244 23245function enqueueRenderPhaseUpdate(queue, update) { 23246 // This is a render phase update. Stash it in a lazily-created map of 23247 // queue -> linked list of updates. After this render pass, we'll restart 23248 // and apply the stashed updates on top of the work-in-progress hook. 23249 didScheduleRenderPhaseUpdateDuringThisPass = didScheduleRenderPhaseUpdate = true; 23250 var pending = queue.pending; 23251 23252 if (pending === null) { 23253 // This is the first update. Create a circular list. 23254 update.next = update; 23255 } else { 23256 update.next = pending.next; 23257 pending.next = update; 23258 } 23259 23260 queue.pending = update; 23261} // TODO: Move to ReactFiberConcurrentUpdates? 23262 23263 23264function entangleTransitionUpdate(root, queue, lane) { 23265 if (isTransitionLane(lane)) { 23266 var queueLanes = queue.lanes; // If any entangled lanes are no longer pending on the root, then they 23267 // must have finished. We can remove them from the shared queue, which 23268 // represents a superset of the actually pending lanes. In some cases we 23269 // may entangle more than we need to, but that's OK. In fact it's worse if 23270 // we *don't* entangle when we should. 23271 23272 queueLanes = intersectLanes(queueLanes, root.pendingLanes); // Entangle the new transition lane with the other transition lanes. 23273 23274 var newQueueLanes = mergeLanes(queueLanes, lane); 23275 queue.lanes = newQueueLanes; // Even if queue.lanes already include lane, we don't know for certain if 23276 // the lane finished since the last time we entangled it. So we need to 23277 // entangle it again, just to be sure. 23278 23279 markRootEntangled(root, newQueueLanes); 23280 } 23281} 23282 23283function markUpdateInDevTools(fiber, lane, action) { 23284 23285 { 23286 markStateUpdateScheduled(fiber, lane); 23287 } 23288} 23289 23290var ContextOnlyDispatcher = { 23291 readContext: readContext, 23292 useCallback: throwInvalidHookError, 23293 useContext: throwInvalidHookError, 23294 useEffect: throwInvalidHookError, 23295 useImperativeHandle: throwInvalidHookError, 23296 useInsertionEffect: throwInvalidHookError, 23297 useLayoutEffect: throwInvalidHookError, 23298 useMemo: throwInvalidHookError, 23299 useReducer: throwInvalidHookError, 23300 useRef: throwInvalidHookError, 23301 useState: throwInvalidHookError, 23302 useDebugValue: throwInvalidHookError, 23303 useDeferredValue: throwInvalidHookError, 23304 useTransition: throwInvalidHookError, 23305 useMutableSource: throwInvalidHookError, 23306 useSyncExternalStore: throwInvalidHookError, 23307 useId: throwInvalidHookError, 23308 unstable_isNewReconciler: enableNewReconciler 23309}; 23310 23311var HooksDispatcherOnMountInDEV = null; 23312var HooksDispatcherOnMountWithHookTypesInDEV = null; 23313var HooksDispatcherOnUpdateInDEV = null; 23314var HooksDispatcherOnRerenderInDEV = null; 23315var InvalidNestedHooksDispatcherOnMountInDEV = null; 23316var InvalidNestedHooksDispatcherOnUpdateInDEV = null; 23317var InvalidNestedHooksDispatcherOnRerenderInDEV = null; 23318 23319{ 23320 var warnInvalidContextAccess = function () { 23321 error('Context can only be read while React is rendering. ' + 'In classes, you can read it in the render method or getDerivedStateFromProps. ' + 'In function components, you can read it directly in the function body, but not ' + 'inside Hooks like useReducer() or useMemo().'); 23322 }; 23323 23324 var warnInvalidHookAccess = function () { 23325 error('Do not call Hooks inside useEffect(...), useMemo(...), or other built-in Hooks. ' + 'You can only call Hooks at the top level of your React function. ' + 'For more information, see ' + 'https://reactjs.org/link/rules-of-hooks'); 23326 }; 23327 23328 HooksDispatcherOnMountInDEV = { 23329 readContext: function (context) { 23330 return readContext(context); 23331 }, 23332 useCallback: function (callback, deps) { 23333 currentHookNameInDev = 'useCallback'; 23334 mountHookTypesDev(); 23335 checkDepsAreArrayDev(deps); 23336 return mountCallback(callback, deps); 23337 }, 23338 useContext: function (context) { 23339 currentHookNameInDev = 'useContext'; 23340 mountHookTypesDev(); 23341 return readContext(context); 23342 }, 23343 useEffect: function (create, deps) { 23344 currentHookNameInDev = 'useEffect'; 23345 mountHookTypesDev(); 23346 checkDepsAreArrayDev(deps); 23347 return mountEffect(create, deps); 23348 }, 23349 useImperativeHandle: function (ref, create, deps) { 23350 currentHookNameInDev = 'useImperativeHandle'; 23351 mountHookTypesDev(); 23352 checkDepsAreArrayDev(deps); 23353 return mountImperativeHandle(ref, create, deps); 23354 }, 23355 useInsertionEffect: function (create, deps) { 23356 currentHookNameInDev = 'useInsertionEffect'; 23357 mountHookTypesDev(); 23358 checkDepsAreArrayDev(deps); 23359 return mountInsertionEffect(create, deps); 23360 }, 23361 useLayoutEffect: function (create, deps) { 23362 currentHookNameInDev = 'useLayoutEffect'; 23363 mountHookTypesDev(); 23364 checkDepsAreArrayDev(deps); 23365 return mountLayoutEffect(create, deps); 23366 }, 23367 useMemo: function (create, deps) { 23368 currentHookNameInDev = 'useMemo'; 23369 mountHookTypesDev(); 23370 checkDepsAreArrayDev(deps); 23371 var prevDispatcher = ReactCurrentDispatcher$1.current; 23372 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23373 23374 try { 23375 return mountMemo(create, deps); 23376 } finally { 23377 ReactCurrentDispatcher$1.current = prevDispatcher; 23378 } 23379 }, 23380 useReducer: function (reducer, initialArg, init) { 23381 currentHookNameInDev = 'useReducer'; 23382 mountHookTypesDev(); 23383 var prevDispatcher = ReactCurrentDispatcher$1.current; 23384 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23385 23386 try { 23387 return mountReducer(reducer, initialArg, init); 23388 } finally { 23389 ReactCurrentDispatcher$1.current = prevDispatcher; 23390 } 23391 }, 23392 useRef: function (initialValue) { 23393 currentHookNameInDev = 'useRef'; 23394 mountHookTypesDev(); 23395 return mountRef(initialValue); 23396 }, 23397 useState: function (initialState) { 23398 currentHookNameInDev = 'useState'; 23399 mountHookTypesDev(); 23400 var prevDispatcher = ReactCurrentDispatcher$1.current; 23401 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23402 23403 try { 23404 return mountState(initialState); 23405 } finally { 23406 ReactCurrentDispatcher$1.current = prevDispatcher; 23407 } 23408 }, 23409 useDebugValue: function (value, formatterFn) { 23410 currentHookNameInDev = 'useDebugValue'; 23411 mountHookTypesDev(); 23412 return mountDebugValue(); 23413 }, 23414 useDeferredValue: function (value) { 23415 currentHookNameInDev = 'useDeferredValue'; 23416 mountHookTypesDev(); 23417 return mountDeferredValue(value); 23418 }, 23419 useTransition: function () { 23420 currentHookNameInDev = 'useTransition'; 23421 mountHookTypesDev(); 23422 return mountTransition(); 23423 }, 23424 useMutableSource: function (source, getSnapshot, subscribe) { 23425 currentHookNameInDev = 'useMutableSource'; 23426 mountHookTypesDev(); 23427 return mountMutableSource(); 23428 }, 23429 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 23430 currentHookNameInDev = 'useSyncExternalStore'; 23431 mountHookTypesDev(); 23432 return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot); 23433 }, 23434 useId: function () { 23435 currentHookNameInDev = 'useId'; 23436 mountHookTypesDev(); 23437 return mountId(); 23438 }, 23439 unstable_isNewReconciler: enableNewReconciler 23440 }; 23441 23442 HooksDispatcherOnMountWithHookTypesInDEV = { 23443 readContext: function (context) { 23444 return readContext(context); 23445 }, 23446 useCallback: function (callback, deps) { 23447 currentHookNameInDev = 'useCallback'; 23448 updateHookTypesDev(); 23449 return mountCallback(callback, deps); 23450 }, 23451 useContext: function (context) { 23452 currentHookNameInDev = 'useContext'; 23453 updateHookTypesDev(); 23454 return readContext(context); 23455 }, 23456 useEffect: function (create, deps) { 23457 currentHookNameInDev = 'useEffect'; 23458 updateHookTypesDev(); 23459 return mountEffect(create, deps); 23460 }, 23461 useImperativeHandle: function (ref, create, deps) { 23462 currentHookNameInDev = 'useImperativeHandle'; 23463 updateHookTypesDev(); 23464 return mountImperativeHandle(ref, create, deps); 23465 }, 23466 useInsertionEffect: function (create, deps) { 23467 currentHookNameInDev = 'useInsertionEffect'; 23468 updateHookTypesDev(); 23469 return mountInsertionEffect(create, deps); 23470 }, 23471 useLayoutEffect: function (create, deps) { 23472 currentHookNameInDev = 'useLayoutEffect'; 23473 updateHookTypesDev(); 23474 return mountLayoutEffect(create, deps); 23475 }, 23476 useMemo: function (create, deps) { 23477 currentHookNameInDev = 'useMemo'; 23478 updateHookTypesDev(); 23479 var prevDispatcher = ReactCurrentDispatcher$1.current; 23480 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23481 23482 try { 23483 return mountMemo(create, deps); 23484 } finally { 23485 ReactCurrentDispatcher$1.current = prevDispatcher; 23486 } 23487 }, 23488 useReducer: function (reducer, initialArg, init) { 23489 currentHookNameInDev = 'useReducer'; 23490 updateHookTypesDev(); 23491 var prevDispatcher = ReactCurrentDispatcher$1.current; 23492 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23493 23494 try { 23495 return mountReducer(reducer, initialArg, init); 23496 } finally { 23497 ReactCurrentDispatcher$1.current = prevDispatcher; 23498 } 23499 }, 23500 useRef: function (initialValue) { 23501 currentHookNameInDev = 'useRef'; 23502 updateHookTypesDev(); 23503 return mountRef(initialValue); 23504 }, 23505 useState: function (initialState) { 23506 currentHookNameInDev = 'useState'; 23507 updateHookTypesDev(); 23508 var prevDispatcher = ReactCurrentDispatcher$1.current; 23509 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23510 23511 try { 23512 return mountState(initialState); 23513 } finally { 23514 ReactCurrentDispatcher$1.current = prevDispatcher; 23515 } 23516 }, 23517 useDebugValue: function (value, formatterFn) { 23518 currentHookNameInDev = 'useDebugValue'; 23519 updateHookTypesDev(); 23520 return mountDebugValue(); 23521 }, 23522 useDeferredValue: function (value) { 23523 currentHookNameInDev = 'useDeferredValue'; 23524 updateHookTypesDev(); 23525 return mountDeferredValue(value); 23526 }, 23527 useTransition: function () { 23528 currentHookNameInDev = 'useTransition'; 23529 updateHookTypesDev(); 23530 return mountTransition(); 23531 }, 23532 useMutableSource: function (source, getSnapshot, subscribe) { 23533 currentHookNameInDev = 'useMutableSource'; 23534 updateHookTypesDev(); 23535 return mountMutableSource(); 23536 }, 23537 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 23538 currentHookNameInDev = 'useSyncExternalStore'; 23539 updateHookTypesDev(); 23540 return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot); 23541 }, 23542 useId: function () { 23543 currentHookNameInDev = 'useId'; 23544 updateHookTypesDev(); 23545 return mountId(); 23546 }, 23547 unstable_isNewReconciler: enableNewReconciler 23548 }; 23549 23550 HooksDispatcherOnUpdateInDEV = { 23551 readContext: function (context) { 23552 return readContext(context); 23553 }, 23554 useCallback: function (callback, deps) { 23555 currentHookNameInDev = 'useCallback'; 23556 updateHookTypesDev(); 23557 return updateCallback(callback, deps); 23558 }, 23559 useContext: function (context) { 23560 currentHookNameInDev = 'useContext'; 23561 updateHookTypesDev(); 23562 return readContext(context); 23563 }, 23564 useEffect: function (create, deps) { 23565 currentHookNameInDev = 'useEffect'; 23566 updateHookTypesDev(); 23567 return updateEffect(create, deps); 23568 }, 23569 useImperativeHandle: function (ref, create, deps) { 23570 currentHookNameInDev = 'useImperativeHandle'; 23571 updateHookTypesDev(); 23572 return updateImperativeHandle(ref, create, deps); 23573 }, 23574 useInsertionEffect: function (create, deps) { 23575 currentHookNameInDev = 'useInsertionEffect'; 23576 updateHookTypesDev(); 23577 return updateInsertionEffect(create, deps); 23578 }, 23579 useLayoutEffect: function (create, deps) { 23580 currentHookNameInDev = 'useLayoutEffect'; 23581 updateHookTypesDev(); 23582 return updateLayoutEffect(create, deps); 23583 }, 23584 useMemo: function (create, deps) { 23585 currentHookNameInDev = 'useMemo'; 23586 updateHookTypesDev(); 23587 var prevDispatcher = ReactCurrentDispatcher$1.current; 23588 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23589 23590 try { 23591 return updateMemo(create, deps); 23592 } finally { 23593 ReactCurrentDispatcher$1.current = prevDispatcher; 23594 } 23595 }, 23596 useReducer: function (reducer, initialArg, init) { 23597 currentHookNameInDev = 'useReducer'; 23598 updateHookTypesDev(); 23599 var prevDispatcher = ReactCurrentDispatcher$1.current; 23600 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23601 23602 try { 23603 return updateReducer(reducer, initialArg, init); 23604 } finally { 23605 ReactCurrentDispatcher$1.current = prevDispatcher; 23606 } 23607 }, 23608 useRef: function (initialValue) { 23609 currentHookNameInDev = 'useRef'; 23610 updateHookTypesDev(); 23611 return updateRef(); 23612 }, 23613 useState: function (initialState) { 23614 currentHookNameInDev = 'useState'; 23615 updateHookTypesDev(); 23616 var prevDispatcher = ReactCurrentDispatcher$1.current; 23617 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23618 23619 try { 23620 return updateState(initialState); 23621 } finally { 23622 ReactCurrentDispatcher$1.current = prevDispatcher; 23623 } 23624 }, 23625 useDebugValue: function (value, formatterFn) { 23626 currentHookNameInDev = 'useDebugValue'; 23627 updateHookTypesDev(); 23628 return updateDebugValue(); 23629 }, 23630 useDeferredValue: function (value) { 23631 currentHookNameInDev = 'useDeferredValue'; 23632 updateHookTypesDev(); 23633 return updateDeferredValue(value); 23634 }, 23635 useTransition: function () { 23636 currentHookNameInDev = 'useTransition'; 23637 updateHookTypesDev(); 23638 return updateTransition(); 23639 }, 23640 useMutableSource: function (source, getSnapshot, subscribe) { 23641 currentHookNameInDev = 'useMutableSource'; 23642 updateHookTypesDev(); 23643 return updateMutableSource(); 23644 }, 23645 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 23646 currentHookNameInDev = 'useSyncExternalStore'; 23647 updateHookTypesDev(); 23648 return updateSyncExternalStore(subscribe, getSnapshot); 23649 }, 23650 useId: function () { 23651 currentHookNameInDev = 'useId'; 23652 updateHookTypesDev(); 23653 return updateId(); 23654 }, 23655 unstable_isNewReconciler: enableNewReconciler 23656 }; 23657 23658 HooksDispatcherOnRerenderInDEV = { 23659 readContext: function (context) { 23660 return readContext(context); 23661 }, 23662 useCallback: function (callback, deps) { 23663 currentHookNameInDev = 'useCallback'; 23664 updateHookTypesDev(); 23665 return updateCallback(callback, deps); 23666 }, 23667 useContext: function (context) { 23668 currentHookNameInDev = 'useContext'; 23669 updateHookTypesDev(); 23670 return readContext(context); 23671 }, 23672 useEffect: function (create, deps) { 23673 currentHookNameInDev = 'useEffect'; 23674 updateHookTypesDev(); 23675 return updateEffect(create, deps); 23676 }, 23677 useImperativeHandle: function (ref, create, deps) { 23678 currentHookNameInDev = 'useImperativeHandle'; 23679 updateHookTypesDev(); 23680 return updateImperativeHandle(ref, create, deps); 23681 }, 23682 useInsertionEffect: function (create, deps) { 23683 currentHookNameInDev = 'useInsertionEffect'; 23684 updateHookTypesDev(); 23685 return updateInsertionEffect(create, deps); 23686 }, 23687 useLayoutEffect: function (create, deps) { 23688 currentHookNameInDev = 'useLayoutEffect'; 23689 updateHookTypesDev(); 23690 return updateLayoutEffect(create, deps); 23691 }, 23692 useMemo: function (create, deps) { 23693 currentHookNameInDev = 'useMemo'; 23694 updateHookTypesDev(); 23695 var prevDispatcher = ReactCurrentDispatcher$1.current; 23696 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV; 23697 23698 try { 23699 return updateMemo(create, deps); 23700 } finally { 23701 ReactCurrentDispatcher$1.current = prevDispatcher; 23702 } 23703 }, 23704 useReducer: function (reducer, initialArg, init) { 23705 currentHookNameInDev = 'useReducer'; 23706 updateHookTypesDev(); 23707 var prevDispatcher = ReactCurrentDispatcher$1.current; 23708 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV; 23709 23710 try { 23711 return rerenderReducer(reducer, initialArg, init); 23712 } finally { 23713 ReactCurrentDispatcher$1.current = prevDispatcher; 23714 } 23715 }, 23716 useRef: function (initialValue) { 23717 currentHookNameInDev = 'useRef'; 23718 updateHookTypesDev(); 23719 return updateRef(); 23720 }, 23721 useState: function (initialState) { 23722 currentHookNameInDev = 'useState'; 23723 updateHookTypesDev(); 23724 var prevDispatcher = ReactCurrentDispatcher$1.current; 23725 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnRerenderInDEV; 23726 23727 try { 23728 return rerenderState(initialState); 23729 } finally { 23730 ReactCurrentDispatcher$1.current = prevDispatcher; 23731 } 23732 }, 23733 useDebugValue: function (value, formatterFn) { 23734 currentHookNameInDev = 'useDebugValue'; 23735 updateHookTypesDev(); 23736 return updateDebugValue(); 23737 }, 23738 useDeferredValue: function (value) { 23739 currentHookNameInDev = 'useDeferredValue'; 23740 updateHookTypesDev(); 23741 return rerenderDeferredValue(value); 23742 }, 23743 useTransition: function () { 23744 currentHookNameInDev = 'useTransition'; 23745 updateHookTypesDev(); 23746 return rerenderTransition(); 23747 }, 23748 useMutableSource: function (source, getSnapshot, subscribe) { 23749 currentHookNameInDev = 'useMutableSource'; 23750 updateHookTypesDev(); 23751 return updateMutableSource(); 23752 }, 23753 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 23754 currentHookNameInDev = 'useSyncExternalStore'; 23755 updateHookTypesDev(); 23756 return updateSyncExternalStore(subscribe, getSnapshot); 23757 }, 23758 useId: function () { 23759 currentHookNameInDev = 'useId'; 23760 updateHookTypesDev(); 23761 return updateId(); 23762 }, 23763 unstable_isNewReconciler: enableNewReconciler 23764 }; 23765 23766 InvalidNestedHooksDispatcherOnMountInDEV = { 23767 readContext: function (context) { 23768 warnInvalidContextAccess(); 23769 return readContext(context); 23770 }, 23771 useCallback: function (callback, deps) { 23772 currentHookNameInDev = 'useCallback'; 23773 warnInvalidHookAccess(); 23774 mountHookTypesDev(); 23775 return mountCallback(callback, deps); 23776 }, 23777 useContext: function (context) { 23778 currentHookNameInDev = 'useContext'; 23779 warnInvalidHookAccess(); 23780 mountHookTypesDev(); 23781 return readContext(context); 23782 }, 23783 useEffect: function (create, deps) { 23784 currentHookNameInDev = 'useEffect'; 23785 warnInvalidHookAccess(); 23786 mountHookTypesDev(); 23787 return mountEffect(create, deps); 23788 }, 23789 useImperativeHandle: function (ref, create, deps) { 23790 currentHookNameInDev = 'useImperativeHandle'; 23791 warnInvalidHookAccess(); 23792 mountHookTypesDev(); 23793 return mountImperativeHandle(ref, create, deps); 23794 }, 23795 useInsertionEffect: function (create, deps) { 23796 currentHookNameInDev = 'useInsertionEffect'; 23797 warnInvalidHookAccess(); 23798 mountHookTypesDev(); 23799 return mountInsertionEffect(create, deps); 23800 }, 23801 useLayoutEffect: function (create, deps) { 23802 currentHookNameInDev = 'useLayoutEffect'; 23803 warnInvalidHookAccess(); 23804 mountHookTypesDev(); 23805 return mountLayoutEffect(create, deps); 23806 }, 23807 useMemo: function (create, deps) { 23808 currentHookNameInDev = 'useMemo'; 23809 warnInvalidHookAccess(); 23810 mountHookTypesDev(); 23811 var prevDispatcher = ReactCurrentDispatcher$1.current; 23812 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23813 23814 try { 23815 return mountMemo(create, deps); 23816 } finally { 23817 ReactCurrentDispatcher$1.current = prevDispatcher; 23818 } 23819 }, 23820 useReducer: function (reducer, initialArg, init) { 23821 currentHookNameInDev = 'useReducer'; 23822 warnInvalidHookAccess(); 23823 mountHookTypesDev(); 23824 var prevDispatcher = ReactCurrentDispatcher$1.current; 23825 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23826 23827 try { 23828 return mountReducer(reducer, initialArg, init); 23829 } finally { 23830 ReactCurrentDispatcher$1.current = prevDispatcher; 23831 } 23832 }, 23833 useRef: function (initialValue) { 23834 currentHookNameInDev = 'useRef'; 23835 warnInvalidHookAccess(); 23836 mountHookTypesDev(); 23837 return mountRef(initialValue); 23838 }, 23839 useState: function (initialState) { 23840 currentHookNameInDev = 'useState'; 23841 warnInvalidHookAccess(); 23842 mountHookTypesDev(); 23843 var prevDispatcher = ReactCurrentDispatcher$1.current; 23844 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnMountInDEV; 23845 23846 try { 23847 return mountState(initialState); 23848 } finally { 23849 ReactCurrentDispatcher$1.current = prevDispatcher; 23850 } 23851 }, 23852 useDebugValue: function (value, formatterFn) { 23853 currentHookNameInDev = 'useDebugValue'; 23854 warnInvalidHookAccess(); 23855 mountHookTypesDev(); 23856 return mountDebugValue(); 23857 }, 23858 useDeferredValue: function (value) { 23859 currentHookNameInDev = 'useDeferredValue'; 23860 warnInvalidHookAccess(); 23861 mountHookTypesDev(); 23862 return mountDeferredValue(value); 23863 }, 23864 useTransition: function () { 23865 currentHookNameInDev = 'useTransition'; 23866 warnInvalidHookAccess(); 23867 mountHookTypesDev(); 23868 return mountTransition(); 23869 }, 23870 useMutableSource: function (source, getSnapshot, subscribe) { 23871 currentHookNameInDev = 'useMutableSource'; 23872 warnInvalidHookAccess(); 23873 mountHookTypesDev(); 23874 return mountMutableSource(); 23875 }, 23876 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 23877 currentHookNameInDev = 'useSyncExternalStore'; 23878 warnInvalidHookAccess(); 23879 mountHookTypesDev(); 23880 return mountSyncExternalStore(subscribe, getSnapshot, getServerSnapshot); 23881 }, 23882 useId: function () { 23883 currentHookNameInDev = 'useId'; 23884 warnInvalidHookAccess(); 23885 mountHookTypesDev(); 23886 return mountId(); 23887 }, 23888 unstable_isNewReconciler: enableNewReconciler 23889 }; 23890 23891 InvalidNestedHooksDispatcherOnUpdateInDEV = { 23892 readContext: function (context) { 23893 warnInvalidContextAccess(); 23894 return readContext(context); 23895 }, 23896 useCallback: function (callback, deps) { 23897 currentHookNameInDev = 'useCallback'; 23898 warnInvalidHookAccess(); 23899 updateHookTypesDev(); 23900 return updateCallback(callback, deps); 23901 }, 23902 useContext: function (context) { 23903 currentHookNameInDev = 'useContext'; 23904 warnInvalidHookAccess(); 23905 updateHookTypesDev(); 23906 return readContext(context); 23907 }, 23908 useEffect: function (create, deps) { 23909 currentHookNameInDev = 'useEffect'; 23910 warnInvalidHookAccess(); 23911 updateHookTypesDev(); 23912 return updateEffect(create, deps); 23913 }, 23914 useImperativeHandle: function (ref, create, deps) { 23915 currentHookNameInDev = 'useImperativeHandle'; 23916 warnInvalidHookAccess(); 23917 updateHookTypesDev(); 23918 return updateImperativeHandle(ref, create, deps); 23919 }, 23920 useInsertionEffect: function (create, deps) { 23921 currentHookNameInDev = 'useInsertionEffect'; 23922 warnInvalidHookAccess(); 23923 updateHookTypesDev(); 23924 return updateInsertionEffect(create, deps); 23925 }, 23926 useLayoutEffect: function (create, deps) { 23927 currentHookNameInDev = 'useLayoutEffect'; 23928 warnInvalidHookAccess(); 23929 updateHookTypesDev(); 23930 return updateLayoutEffect(create, deps); 23931 }, 23932 useMemo: function (create, deps) { 23933 currentHookNameInDev = 'useMemo'; 23934 warnInvalidHookAccess(); 23935 updateHookTypesDev(); 23936 var prevDispatcher = ReactCurrentDispatcher$1.current; 23937 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23938 23939 try { 23940 return updateMemo(create, deps); 23941 } finally { 23942 ReactCurrentDispatcher$1.current = prevDispatcher; 23943 } 23944 }, 23945 useReducer: function (reducer, initialArg, init) { 23946 currentHookNameInDev = 'useReducer'; 23947 warnInvalidHookAccess(); 23948 updateHookTypesDev(); 23949 var prevDispatcher = ReactCurrentDispatcher$1.current; 23950 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23951 23952 try { 23953 return updateReducer(reducer, initialArg, init); 23954 } finally { 23955 ReactCurrentDispatcher$1.current = prevDispatcher; 23956 } 23957 }, 23958 useRef: function (initialValue) { 23959 currentHookNameInDev = 'useRef'; 23960 warnInvalidHookAccess(); 23961 updateHookTypesDev(); 23962 return updateRef(); 23963 }, 23964 useState: function (initialState) { 23965 currentHookNameInDev = 'useState'; 23966 warnInvalidHookAccess(); 23967 updateHookTypesDev(); 23968 var prevDispatcher = ReactCurrentDispatcher$1.current; 23969 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 23970 23971 try { 23972 return updateState(initialState); 23973 } finally { 23974 ReactCurrentDispatcher$1.current = prevDispatcher; 23975 } 23976 }, 23977 useDebugValue: function (value, formatterFn) { 23978 currentHookNameInDev = 'useDebugValue'; 23979 warnInvalidHookAccess(); 23980 updateHookTypesDev(); 23981 return updateDebugValue(); 23982 }, 23983 useDeferredValue: function (value) { 23984 currentHookNameInDev = 'useDeferredValue'; 23985 warnInvalidHookAccess(); 23986 updateHookTypesDev(); 23987 return updateDeferredValue(value); 23988 }, 23989 useTransition: function () { 23990 currentHookNameInDev = 'useTransition'; 23991 warnInvalidHookAccess(); 23992 updateHookTypesDev(); 23993 return updateTransition(); 23994 }, 23995 useMutableSource: function (source, getSnapshot, subscribe) { 23996 currentHookNameInDev = 'useMutableSource'; 23997 warnInvalidHookAccess(); 23998 updateHookTypesDev(); 23999 return updateMutableSource(); 24000 }, 24001 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 24002 currentHookNameInDev = 'useSyncExternalStore'; 24003 warnInvalidHookAccess(); 24004 updateHookTypesDev(); 24005 return updateSyncExternalStore(subscribe, getSnapshot); 24006 }, 24007 useId: function () { 24008 currentHookNameInDev = 'useId'; 24009 warnInvalidHookAccess(); 24010 updateHookTypesDev(); 24011 return updateId(); 24012 }, 24013 unstable_isNewReconciler: enableNewReconciler 24014 }; 24015 24016 InvalidNestedHooksDispatcherOnRerenderInDEV = { 24017 readContext: function (context) { 24018 warnInvalidContextAccess(); 24019 return readContext(context); 24020 }, 24021 useCallback: function (callback, deps) { 24022 currentHookNameInDev = 'useCallback'; 24023 warnInvalidHookAccess(); 24024 updateHookTypesDev(); 24025 return updateCallback(callback, deps); 24026 }, 24027 useContext: function (context) { 24028 currentHookNameInDev = 'useContext'; 24029 warnInvalidHookAccess(); 24030 updateHookTypesDev(); 24031 return readContext(context); 24032 }, 24033 useEffect: function (create, deps) { 24034 currentHookNameInDev = 'useEffect'; 24035 warnInvalidHookAccess(); 24036 updateHookTypesDev(); 24037 return updateEffect(create, deps); 24038 }, 24039 useImperativeHandle: function (ref, create, deps) { 24040 currentHookNameInDev = 'useImperativeHandle'; 24041 warnInvalidHookAccess(); 24042 updateHookTypesDev(); 24043 return updateImperativeHandle(ref, create, deps); 24044 }, 24045 useInsertionEffect: function (create, deps) { 24046 currentHookNameInDev = 'useInsertionEffect'; 24047 warnInvalidHookAccess(); 24048 updateHookTypesDev(); 24049 return updateInsertionEffect(create, deps); 24050 }, 24051 useLayoutEffect: function (create, deps) { 24052 currentHookNameInDev = 'useLayoutEffect'; 24053 warnInvalidHookAccess(); 24054 updateHookTypesDev(); 24055 return updateLayoutEffect(create, deps); 24056 }, 24057 useMemo: function (create, deps) { 24058 currentHookNameInDev = 'useMemo'; 24059 warnInvalidHookAccess(); 24060 updateHookTypesDev(); 24061 var prevDispatcher = ReactCurrentDispatcher$1.current; 24062 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 24063 24064 try { 24065 return updateMemo(create, deps); 24066 } finally { 24067 ReactCurrentDispatcher$1.current = prevDispatcher; 24068 } 24069 }, 24070 useReducer: function (reducer, initialArg, init) { 24071 currentHookNameInDev = 'useReducer'; 24072 warnInvalidHookAccess(); 24073 updateHookTypesDev(); 24074 var prevDispatcher = ReactCurrentDispatcher$1.current; 24075 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 24076 24077 try { 24078 return rerenderReducer(reducer, initialArg, init); 24079 } finally { 24080 ReactCurrentDispatcher$1.current = prevDispatcher; 24081 } 24082 }, 24083 useRef: function (initialValue) { 24084 currentHookNameInDev = 'useRef'; 24085 warnInvalidHookAccess(); 24086 updateHookTypesDev(); 24087 return updateRef(); 24088 }, 24089 useState: function (initialState) { 24090 currentHookNameInDev = 'useState'; 24091 warnInvalidHookAccess(); 24092 updateHookTypesDev(); 24093 var prevDispatcher = ReactCurrentDispatcher$1.current; 24094 ReactCurrentDispatcher$1.current = InvalidNestedHooksDispatcherOnUpdateInDEV; 24095 24096 try { 24097 return rerenderState(initialState); 24098 } finally { 24099 ReactCurrentDispatcher$1.current = prevDispatcher; 24100 } 24101 }, 24102 useDebugValue: function (value, formatterFn) { 24103 currentHookNameInDev = 'useDebugValue'; 24104 warnInvalidHookAccess(); 24105 updateHookTypesDev(); 24106 return updateDebugValue(); 24107 }, 24108 useDeferredValue: function (value) { 24109 currentHookNameInDev = 'useDeferredValue'; 24110 warnInvalidHookAccess(); 24111 updateHookTypesDev(); 24112 return rerenderDeferredValue(value); 24113 }, 24114 useTransition: function () { 24115 currentHookNameInDev = 'useTransition'; 24116 warnInvalidHookAccess(); 24117 updateHookTypesDev(); 24118 return rerenderTransition(); 24119 }, 24120 useMutableSource: function (source, getSnapshot, subscribe) { 24121 currentHookNameInDev = 'useMutableSource'; 24122 warnInvalidHookAccess(); 24123 updateHookTypesDev(); 24124 return updateMutableSource(); 24125 }, 24126 useSyncExternalStore: function (subscribe, getSnapshot, getServerSnapshot) { 24127 currentHookNameInDev = 'useSyncExternalStore'; 24128 warnInvalidHookAccess(); 24129 updateHookTypesDev(); 24130 return updateSyncExternalStore(subscribe, getSnapshot); 24131 }, 24132 useId: function () { 24133 currentHookNameInDev = 'useId'; 24134 warnInvalidHookAccess(); 24135 updateHookTypesDev(); 24136 return updateId(); 24137 }, 24138 unstable_isNewReconciler: enableNewReconciler 24139 }; 24140} 24141 24142var now$1 = Scheduler.unstable_now; 24143var commitTime = 0; 24144var layoutEffectStartTime = -1; 24145var profilerStartTime = -1; 24146var passiveEffectStartTime = -1; 24147/** 24148 * Tracks whether the current update was a nested/cascading update (scheduled from a layout effect). 24149 * 24150 * The overall sequence is: 24151 * 1. render 24152 * 2. commit (and call `onRender`, `onCommit`) 24153 * 3. check for nested updates 24154 * 4. flush passive effects (and call `onPostCommit`) 24155 * 24156 * Nested updates are identified in step 3 above, 24157 * but step 4 still applies to the work that was just committed. 24158 * We use two flags to track nested updates then: 24159 * one tracks whether the upcoming update is a nested update, 24160 * and the other tracks whether the current update was a nested update. 24161 * The first value gets synced to the second at the start of the render phase. 24162 */ 24163 24164var currentUpdateIsNested = false; 24165var nestedUpdateScheduled = false; 24166 24167function isCurrentUpdateNested() { 24168 return currentUpdateIsNested; 24169} 24170 24171function markNestedUpdateScheduled() { 24172 { 24173 nestedUpdateScheduled = true; 24174 } 24175} 24176 24177function resetNestedUpdateFlag() { 24178 { 24179 currentUpdateIsNested = false; 24180 nestedUpdateScheduled = false; 24181 } 24182} 24183 24184function syncNestedUpdateFlag() { 24185 { 24186 currentUpdateIsNested = nestedUpdateScheduled; 24187 nestedUpdateScheduled = false; 24188 } 24189} 24190 24191function getCommitTime() { 24192 return commitTime; 24193} 24194 24195function recordCommitTime() { 24196 24197 commitTime = now$1(); 24198} 24199 24200function startProfilerTimer(fiber) { 24201 24202 profilerStartTime = now$1(); 24203 24204 if (fiber.actualStartTime < 0) { 24205 fiber.actualStartTime = now$1(); 24206 } 24207} 24208 24209function stopProfilerTimerIfRunning(fiber) { 24210 24211 profilerStartTime = -1; 24212} 24213 24214function stopProfilerTimerIfRunningAndRecordDelta(fiber, overrideBaseTime) { 24215 24216 if (profilerStartTime >= 0) { 24217 var elapsedTime = now$1() - profilerStartTime; 24218 fiber.actualDuration += elapsedTime; 24219 24220 if (overrideBaseTime) { 24221 fiber.selfBaseDuration = elapsedTime; 24222 } 24223 24224 profilerStartTime = -1; 24225 } 24226} 24227 24228function recordLayoutEffectDuration(fiber) { 24229 24230 if (layoutEffectStartTime >= 0) { 24231 var elapsedTime = now$1() - layoutEffectStartTime; 24232 layoutEffectStartTime = -1; // Store duration on the next nearest Profiler ancestor 24233 // Or the root (for the DevTools Profiler to read) 24234 24235 var parentFiber = fiber.return; 24236 24237 while (parentFiber !== null) { 24238 switch (parentFiber.tag) { 24239 case HostRoot: 24240 var root = parentFiber.stateNode; 24241 root.effectDuration += elapsedTime; 24242 return; 24243 24244 case Profiler: 24245 var parentStateNode = parentFiber.stateNode; 24246 parentStateNode.effectDuration += elapsedTime; 24247 return; 24248 } 24249 24250 parentFiber = parentFiber.return; 24251 } 24252 } 24253} 24254 24255function recordPassiveEffectDuration(fiber) { 24256 24257 if (passiveEffectStartTime >= 0) { 24258 var elapsedTime = now$1() - passiveEffectStartTime; 24259 passiveEffectStartTime = -1; // Store duration on the next nearest Profiler ancestor 24260 // Or the root (for the DevTools Profiler to read) 24261 24262 var parentFiber = fiber.return; 24263 24264 while (parentFiber !== null) { 24265 switch (parentFiber.tag) { 24266 case HostRoot: 24267 var root = parentFiber.stateNode; 24268 24269 if (root !== null) { 24270 root.passiveEffectDuration += elapsedTime; 24271 } 24272 24273 return; 24274 24275 case Profiler: 24276 var parentStateNode = parentFiber.stateNode; 24277 24278 if (parentStateNode !== null) { 24279 // Detached fibers have their state node cleared out. 24280 // In this case, the return pointer is also cleared out, 24281 // so we won't be able to report the time spent in this Profiler's subtree. 24282 parentStateNode.passiveEffectDuration += elapsedTime; 24283 } 24284 24285 return; 24286 } 24287 24288 parentFiber = parentFiber.return; 24289 } 24290 } 24291} 24292 24293function startLayoutEffectTimer() { 24294 24295 layoutEffectStartTime = now$1(); 24296} 24297 24298function startPassiveEffectTimer() { 24299 24300 passiveEffectStartTime = now$1(); 24301} 24302 24303function transferActualDuration(fiber) { 24304 // Transfer time spent rendering these children so we don't lose it 24305 // after we rerender. This is used as a helper in special cases 24306 // where we should count the work of multiple passes. 24307 var child = fiber.child; 24308 24309 while (child) { 24310 fiber.actualDuration += child.actualDuration; 24311 child = child.sibling; 24312 } 24313} 24314 24315function createCapturedValueAtFiber(value, source) { 24316 // If the value is an error, call this function immediately after it is thrown 24317 // so the stack is accurate. 24318 return { 24319 value: value, 24320 source: source, 24321 stack: getStackByFiberInDevAndProd(source), 24322 digest: null 24323 }; 24324} 24325function createCapturedValue(value, digest, stack) { 24326 return { 24327 value: value, 24328 source: null, 24329 stack: stack != null ? stack : null, 24330 digest: digest != null ? digest : null 24331 }; 24332} 24333 24334// This module is forked in different environments. 24335// By default, return `true` to log errors to the console. 24336// Forks can return `false` if this isn't desirable. 24337function showErrorDialog(boundary, errorInfo) { 24338 return true; 24339} 24340 24341function logCapturedError(boundary, errorInfo) { 24342 try { 24343 var logError = showErrorDialog(boundary, errorInfo); // Allow injected showErrorDialog() to prevent default console.error logging. 24344 // This enables renderers like ReactNative to better manage redbox behavior. 24345 24346 if (logError === false) { 24347 return; 24348 } 24349 24350 var error = errorInfo.value; 24351 24352 if (true) { 24353 var source = errorInfo.source; 24354 var stack = errorInfo.stack; 24355 var componentStack = stack !== null ? stack : ''; // Browsers support silencing uncaught errors by calling 24356 // `preventDefault()` in window `error` handler. 24357 // We record this information as an expando on the error. 24358 24359 if (error != null && error._suppressLogging) { 24360 if (boundary.tag === ClassComponent) { 24361 // The error is recoverable and was silenced. 24362 // Ignore it and don't print the stack addendum. 24363 // This is handy for testing error boundaries without noise. 24364 return; 24365 } // The error is fatal. Since the silencing might have 24366 // been accidental, we'll surface it anyway. 24367 // However, the browser would have silenced the original error 24368 // so we'll print it first, and then print the stack addendum. 24369 24370 24371 console['error'](error); // Don't transform to our wrapper 24372 // For a more detailed description of this block, see: 24373 // https://github.com/facebook/react/pull/13384 24374 } 24375 24376 var componentName = source ? getComponentNameFromFiber(source) : null; 24377 var componentNameMessage = componentName ? "The above error occurred in the <" + componentName + "> component:" : 'The above error occurred in one of your React components:'; 24378 var errorBoundaryMessage; 24379 24380 if (boundary.tag === HostRoot) { 24381 errorBoundaryMessage = 'Consider adding an error boundary to your tree to customize error handling behavior.\n' + 'Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries.'; 24382 } else { 24383 var errorBoundaryName = getComponentNameFromFiber(boundary) || 'Anonymous'; 24384 errorBoundaryMessage = "React will try to recreate this component tree from scratch " + ("using the error boundary you provided, " + errorBoundaryName + "."); 24385 } 24386 24387 var combinedMessage = componentNameMessage + "\n" + componentStack + "\n\n" + ("" + errorBoundaryMessage); // In development, we provide our own message with just the component stack. 24388 // We don't include the original error message and JS stack because the browser 24389 // has already printed it. Even if the application swallows the error, it is still 24390 // displayed by the browser thanks to the DEV-only fake event trick in ReactErrorUtils. 24391 24392 console['error'](combinedMessage); // Don't transform to our wrapper 24393 } else {} 24394 } catch (e) { 24395 // This method must not throw, or React internal state will get messed up. 24396 // If console.error is overridden, or logCapturedError() shows a dialog that throws, 24397 // we want to report this error outside of the normal stack as a last resort. 24398 // https://github.com/facebook/react/issues/13188 24399 setTimeout(function () { 24400 throw e; 24401 }); 24402 } 24403} 24404 24405var PossiblyWeakMap$1 = typeof WeakMap === 'function' ? WeakMap : Map; 24406 24407function createRootErrorUpdate(fiber, errorInfo, lane) { 24408 var update = createUpdate(NoTimestamp, lane); // Unmount the root by rendering null. 24409 24410 update.tag = CaptureUpdate; // Caution: React DevTools currently depends on this property 24411 // being called "element". 24412 24413 update.payload = { 24414 element: null 24415 }; 24416 var error = errorInfo.value; 24417 24418 update.callback = function () { 24419 onUncaughtError(error); 24420 logCapturedError(fiber, errorInfo); 24421 }; 24422 24423 return update; 24424} 24425 24426function createClassErrorUpdate(fiber, errorInfo, lane) { 24427 var update = createUpdate(NoTimestamp, lane); 24428 update.tag = CaptureUpdate; 24429 var getDerivedStateFromError = fiber.type.getDerivedStateFromError; 24430 24431 if (typeof getDerivedStateFromError === 'function') { 24432 var error$1 = errorInfo.value; 24433 24434 update.payload = function () { 24435 return getDerivedStateFromError(error$1); 24436 }; 24437 24438 update.callback = function () { 24439 { 24440 markFailedErrorBoundaryForHotReloading(fiber); 24441 } 24442 24443 logCapturedError(fiber, errorInfo); 24444 }; 24445 } 24446 24447 var inst = fiber.stateNode; 24448 24449 if (inst !== null && typeof inst.componentDidCatch === 'function') { 24450 update.callback = function callback() { 24451 { 24452 markFailedErrorBoundaryForHotReloading(fiber); 24453 } 24454 24455 logCapturedError(fiber, errorInfo); 24456 24457 if (typeof getDerivedStateFromError !== 'function') { 24458 // To preserve the preexisting retry behavior of error boundaries, 24459 // we keep track of which ones already failed during this batch. 24460 // This gets reset before we yield back to the browser. 24461 // TODO: Warn in strict mode if getDerivedStateFromError is 24462 // not defined. 24463 markLegacyErrorBoundaryAsFailed(this); 24464 } 24465 24466 var error$1 = errorInfo.value; 24467 var stack = errorInfo.stack; 24468 this.componentDidCatch(error$1, { 24469 componentStack: stack !== null ? stack : '' 24470 }); 24471 24472 { 24473 if (typeof getDerivedStateFromError !== 'function') { 24474 // If componentDidCatch is the only error boundary method defined, 24475 // then it needs to call setState to recover from errors. 24476 // If no state update is scheduled then the boundary will swallow the error. 24477 if (!includesSomeLane(fiber.lanes, SyncLane)) { 24478 error('%s: Error boundaries should implement getDerivedStateFromError(). ' + 'In that method, return a state update to display an error message or fallback UI.', getComponentNameFromFiber(fiber) || 'Unknown'); 24479 } 24480 } 24481 } 24482 }; 24483 } 24484 24485 return update; 24486} 24487 24488function attachPingListener(root, wakeable, lanes) { 24489 // Attach a ping listener 24490 // 24491 // The data might resolve before we have a chance to commit the fallback. Or, 24492 // in the case of a refresh, we'll never commit a fallback. So we need to 24493 // attach a listener now. When it resolves ("pings"), we can decide whether to 24494 // try rendering the tree again. 24495 // 24496 // Only attach a listener if one does not already exist for the lanes 24497 // we're currently rendering (which acts like a "thread ID" here). 24498 // 24499 // We only need to do this in concurrent mode. Legacy Suspense always 24500 // commits fallbacks synchronously, so there are no pings. 24501 var pingCache = root.pingCache; 24502 var threadIDs; 24503 24504 if (pingCache === null) { 24505 pingCache = root.pingCache = new PossiblyWeakMap$1(); 24506 threadIDs = new Set(); 24507 pingCache.set(wakeable, threadIDs); 24508 } else { 24509 threadIDs = pingCache.get(wakeable); 24510 24511 if (threadIDs === undefined) { 24512 threadIDs = new Set(); 24513 pingCache.set(wakeable, threadIDs); 24514 } 24515 } 24516 24517 if (!threadIDs.has(lanes)) { 24518 // Memoize using the thread ID to prevent redundant listeners. 24519 threadIDs.add(lanes); 24520 var ping = pingSuspendedRoot.bind(null, root, wakeable, lanes); 24521 24522 { 24523 if (isDevToolsPresent) { 24524 // If we have pending work still, restore the original updaters 24525 restorePendingUpdaters(root, lanes); 24526 } 24527 } 24528 24529 wakeable.then(ping, ping); 24530 } 24531} 24532 24533function attachRetryListener(suspenseBoundary, root, wakeable, lanes) { 24534 // Retry listener 24535 // 24536 // If the fallback does commit, we need to attach a different type of 24537 // listener. This one schedules an update on the Suspense boundary to turn 24538 // the fallback state off. 24539 // 24540 // Stash the wakeable on the boundary fiber so we can access it in the 24541 // commit phase. 24542 // 24543 // When the wakeable resolves, we'll attempt to render the boundary 24544 // again ("retry"). 24545 var wakeables = suspenseBoundary.updateQueue; 24546 24547 if (wakeables === null) { 24548 var updateQueue = new Set(); 24549 updateQueue.add(wakeable); 24550 suspenseBoundary.updateQueue = updateQueue; 24551 } else { 24552 wakeables.add(wakeable); 24553 } 24554} 24555 24556function resetSuspendedComponent(sourceFiber, rootRenderLanes) { 24557 // A legacy mode Suspense quirk, only relevant to hook components. 24558 24559 24560 var tag = sourceFiber.tag; 24561 24562 if ((sourceFiber.mode & ConcurrentMode) === NoMode && (tag === FunctionComponent || tag === ForwardRef || tag === SimpleMemoComponent)) { 24563 var currentSource = sourceFiber.alternate; 24564 24565 if (currentSource) { 24566 sourceFiber.updateQueue = currentSource.updateQueue; 24567 sourceFiber.memoizedState = currentSource.memoizedState; 24568 sourceFiber.lanes = currentSource.lanes; 24569 } else { 24570 sourceFiber.updateQueue = null; 24571 sourceFiber.memoizedState = null; 24572 } 24573 } 24574} 24575 24576function getNearestSuspenseBoundaryToCapture(returnFiber) { 24577 var node = returnFiber; 24578 24579 do { 24580 if (node.tag === SuspenseComponent && shouldCaptureSuspense(node)) { 24581 return node; 24582 } // This boundary already captured during this render. Continue to the next 24583 // boundary. 24584 24585 24586 node = node.return; 24587 } while (node !== null); 24588 24589 return null; 24590} 24591 24592function markSuspenseBoundaryShouldCapture(suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes) { 24593 // This marks a Suspense boundary so that when we're unwinding the stack, 24594 // it captures the suspended "exception" and does a second (fallback) pass. 24595 if ((suspenseBoundary.mode & ConcurrentMode) === NoMode) { 24596 // Legacy Mode Suspense 24597 // 24598 // If the boundary is in legacy mode, we should *not* 24599 // suspend the commit. Pretend as if the suspended component rendered 24600 // null and keep rendering. When the Suspense boundary completes, 24601 // we'll do a second pass to render the fallback. 24602 if (suspenseBoundary === returnFiber) { 24603 // Special case where we suspended while reconciling the children of 24604 // a Suspense boundary's inner Offscreen wrapper fiber. This happens 24605 // when a React.lazy component is a direct child of a 24606 // Suspense boundary. 24607 // 24608 // Suspense boundaries are implemented as multiple fibers, but they 24609 // are a single conceptual unit. The legacy mode behavior where we 24610 // pretend the suspended fiber committed as `null` won't work, 24611 // because in this case the "suspended" fiber is the inner 24612 // Offscreen wrapper. 24613 // 24614 // Because the contents of the boundary haven't started rendering 24615 // yet (i.e. nothing in the tree has partially rendered) we can 24616 // switch to the regular, concurrent mode behavior: mark the 24617 // boundary with ShouldCapture and enter the unwind phase. 24618 suspenseBoundary.flags |= ShouldCapture; 24619 } else { 24620 suspenseBoundary.flags |= DidCapture; 24621 sourceFiber.flags |= ForceUpdateForLegacySuspense; // We're going to commit this fiber even though it didn't complete. 24622 // But we shouldn't call any lifecycle methods or callbacks. Remove 24623 // all lifecycle effect tags. 24624 24625 sourceFiber.flags &= ~(LifecycleEffectMask | Incomplete); 24626 24627 if (sourceFiber.tag === ClassComponent) { 24628 var currentSourceFiber = sourceFiber.alternate; 24629 24630 if (currentSourceFiber === null) { 24631 // This is a new mount. Change the tag so it's not mistaken for a 24632 // completed class component. For example, we should not call 24633 // componentWillUnmount if it is deleted. 24634 sourceFiber.tag = IncompleteClassComponent; 24635 } else { 24636 // When we try rendering again, we should not reuse the current fiber, 24637 // since it's known to be in an inconsistent state. Use a force update to 24638 // prevent a bail out. 24639 var update = createUpdate(NoTimestamp, SyncLane); 24640 update.tag = ForceUpdate; 24641 enqueueUpdate(sourceFiber, update, SyncLane); 24642 } 24643 } // The source fiber did not complete. Mark it with Sync priority to 24644 // indicate that it still has pending work. 24645 24646 24647 sourceFiber.lanes = mergeLanes(sourceFiber.lanes, SyncLane); 24648 } 24649 24650 return suspenseBoundary; 24651 } // Confirmed that the boundary is in a concurrent mode tree. Continue 24652 // with the normal suspend path. 24653 // 24654 // After this we'll use a set of heuristics to determine whether this 24655 // render pass will run to completion or restart or "suspend" the commit. 24656 // The actual logic for this is spread out in different places. 24657 // 24658 // This first principle is that if we're going to suspend when we complete 24659 // a root, then we should also restart if we get an update or ping that 24660 // might unsuspend it, and vice versa. The only reason to suspend is 24661 // because you think you might want to restart before committing. However, 24662 // it doesn't make sense to restart only while in the period we're suspended. 24663 // 24664 // Restarting too aggressively is also not good because it starves out any 24665 // intermediate loading state. So we use heuristics to determine when. 24666 // Suspense Heuristics 24667 // 24668 // If nothing threw a Promise or all the same fallbacks are already showing, 24669 // then don't suspend/restart. 24670 // 24671 // If this is an initial render of a new tree of Suspense boundaries and 24672 // those trigger a fallback, then don't suspend/restart. We want to ensure 24673 // that we can show the initial loading state as quickly as possible. 24674 // 24675 // If we hit a "Delayed" case, such as when we'd switch from content back into 24676 // a fallback, then we should always suspend/restart. Transitions apply 24677 // to this case. If none is defined, JND is used instead. 24678 // 24679 // If we're already showing a fallback and it gets "retried", allowing us to show 24680 // another level, but there's still an inner boundary that would show a fallback, 24681 // then we suspend/restart for 500ms since the last time we showed a fallback 24682 // anywhere in the tree. This effectively throttles progressive loading into a 24683 // consistent train of commits. This also gives us an opportunity to restart to 24684 // get to the completed state slightly earlier. 24685 // 24686 // If there's ambiguity due to batching it's resolved in preference of: 24687 // 1) "delayed", 2) "initial render", 3) "retry". 24688 // 24689 // We want to ensure that a "busy" state doesn't get force committed. We want to 24690 // ensure that new initial loading states can commit as soon as possible. 24691 24692 24693 suspenseBoundary.flags |= ShouldCapture; // TODO: I think we can remove this, since we now use `DidCapture` in 24694 // the begin phase to prevent an early bailout. 24695 24696 suspenseBoundary.lanes = rootRenderLanes; 24697 return suspenseBoundary; 24698} 24699 24700function throwException(root, returnFiber, sourceFiber, value, rootRenderLanes) { 24701 // The source fiber did not complete. 24702 sourceFiber.flags |= Incomplete; 24703 24704 { 24705 if (isDevToolsPresent) { 24706 // If we have pending work still, restore the original updaters 24707 restorePendingUpdaters(root, rootRenderLanes); 24708 } 24709 } 24710 24711 if (value !== null && typeof value === 'object' && typeof value.then === 'function') { 24712 // This is a wakeable. The component suspended. 24713 var wakeable = value; 24714 resetSuspendedComponent(sourceFiber); 24715 24716 { 24717 if (getIsHydrating() && sourceFiber.mode & ConcurrentMode) { 24718 markDidThrowWhileHydratingDEV(); 24719 } 24720 } 24721 24722 24723 var suspenseBoundary = getNearestSuspenseBoundaryToCapture(returnFiber); 24724 24725 if (suspenseBoundary !== null) { 24726 suspenseBoundary.flags &= ~ForceClientRender; 24727 markSuspenseBoundaryShouldCapture(suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes); // We only attach ping listeners in concurrent mode. Legacy Suspense always 24728 // commits fallbacks synchronously, so there are no pings. 24729 24730 if (suspenseBoundary.mode & ConcurrentMode) { 24731 attachPingListener(root, wakeable, rootRenderLanes); 24732 } 24733 24734 attachRetryListener(suspenseBoundary, root, wakeable); 24735 return; 24736 } else { 24737 // No boundary was found. Unless this is a sync update, this is OK. 24738 // We can suspend and wait for more data to arrive. 24739 if (!includesSyncLane(rootRenderLanes)) { 24740 // This is not a sync update. Suspend. Since we're not activating a 24741 // Suspense boundary, this will unwind all the way to the root without 24742 // performing a second pass to render a fallback. (This is arguably how 24743 // refresh transitions should work, too, since we're not going to commit 24744 // the fallbacks anyway.) 24745 // 24746 // This case also applies to initial hydration. 24747 attachPingListener(root, wakeable, rootRenderLanes); 24748 renderDidSuspendDelayIfPossible(); 24749 return; 24750 } // This is a sync/discrete update. We treat this case like an error 24751 // because discrete renders are expected to produce a complete tree 24752 // synchronously to maintain consistency with external state. 24753 24754 24755 var uncaughtSuspenseError = new Error('A component suspended while responding to synchronous input. This ' + 'will cause the UI to be replaced with a loading indicator. To ' + 'fix, updates that suspend should be wrapped ' + 'with startTransition.'); // If we're outside a transition, fall through to the regular error path. 24756 // The error will be caught by the nearest suspense boundary. 24757 24758 value = uncaughtSuspenseError; 24759 } 24760 } else { 24761 // This is a regular error, not a Suspense wakeable. 24762 if (getIsHydrating() && sourceFiber.mode & ConcurrentMode) { 24763 markDidThrowWhileHydratingDEV(); 24764 24765 var _suspenseBoundary = getNearestSuspenseBoundaryToCapture(returnFiber); // If the error was thrown during hydration, we may be able to recover by 24766 // discarding the dehydrated content and switching to a client render. 24767 // Instead of surfacing the error, find the nearest Suspense boundary 24768 // and render it again without hydration. 24769 24770 24771 if (_suspenseBoundary !== null) { 24772 if ((_suspenseBoundary.flags & ShouldCapture) === NoFlags) { 24773 // Set a flag to indicate that we should try rendering the normal 24774 // children again, not the fallback. 24775 _suspenseBoundary.flags |= ForceClientRender; 24776 } 24777 24778 markSuspenseBoundaryShouldCapture(_suspenseBoundary, returnFiber, sourceFiber, root, rootRenderLanes); // Even though the user may not be affected by this error, we should 24779 // still log it so it can be fixed. 24780 24781 queueHydrationError(createCapturedValueAtFiber(value, sourceFiber)); 24782 return; 24783 } 24784 } 24785 } 24786 24787 value = createCapturedValueAtFiber(value, sourceFiber); 24788 renderDidError(value); // We didn't find a boundary that could handle this type of exception. Start 24789 // over and traverse parent path again, this time treating the exception 24790 // as an error. 24791 24792 var workInProgress = returnFiber; 24793 24794 do { 24795 switch (workInProgress.tag) { 24796 case HostRoot: 24797 { 24798 var _errorInfo = value; 24799 workInProgress.flags |= ShouldCapture; 24800 var lane = pickArbitraryLane(rootRenderLanes); 24801 workInProgress.lanes = mergeLanes(workInProgress.lanes, lane); 24802 var update = createRootErrorUpdate(workInProgress, _errorInfo, lane); 24803 enqueueCapturedUpdate(workInProgress, update); 24804 return; 24805 } 24806 24807 case ClassComponent: 24808 // Capture and retry 24809 var errorInfo = value; 24810 var ctor = workInProgress.type; 24811 var instance = workInProgress.stateNode; 24812 24813 if ((workInProgress.flags & DidCapture) === NoFlags && (typeof ctor.getDerivedStateFromError === 'function' || instance !== null && typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance))) { 24814 workInProgress.flags |= ShouldCapture; 24815 24816 var _lane = pickArbitraryLane(rootRenderLanes); 24817 24818 workInProgress.lanes = mergeLanes(workInProgress.lanes, _lane); // Schedule the error boundary to re-render using updated state 24819 24820 var _update = createClassErrorUpdate(workInProgress, errorInfo, _lane); 24821 24822 enqueueCapturedUpdate(workInProgress, _update); 24823 return; 24824 } 24825 24826 break; 24827 } 24828 24829 workInProgress = workInProgress.return; 24830 } while (workInProgress !== null); 24831} 24832 24833function getSuspendedCache() { 24834 { 24835 return null; 24836 } // This function is called when a Suspense boundary suspends. It returns the 24837} 24838 24839var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner; 24840var didReceiveUpdate = false; 24841var didWarnAboutBadClass; 24842var didWarnAboutModulePatternComponent; 24843var didWarnAboutContextTypeOnFunctionComponent; 24844var didWarnAboutGetDerivedStateOnFunctionComponent; 24845var didWarnAboutFunctionRefs; 24846var didWarnAboutReassigningProps; 24847var didWarnAboutRevealOrder; 24848var didWarnAboutTailOptions; 24849 24850{ 24851 didWarnAboutBadClass = {}; 24852 didWarnAboutModulePatternComponent = {}; 24853 didWarnAboutContextTypeOnFunctionComponent = {}; 24854 didWarnAboutGetDerivedStateOnFunctionComponent = {}; 24855 didWarnAboutFunctionRefs = {}; 24856 didWarnAboutReassigningProps = false; 24857 didWarnAboutRevealOrder = {}; 24858 didWarnAboutTailOptions = {}; 24859} 24860 24861function reconcileChildren(current, workInProgress, nextChildren, renderLanes) { 24862 if (current === null) { 24863 // If this is a fresh new component that hasn't been rendered yet, we 24864 // won't update its child set by applying minimal side-effects. Instead, 24865 // we will add them all to the child before it gets rendered. That means 24866 // we can optimize this reconciliation pass by not tracking side-effects. 24867 workInProgress.child = mountChildFibers(workInProgress, null, nextChildren, renderLanes); 24868 } else { 24869 // If the current child is the same as the work in progress, it means that 24870 // we haven't yet started any work on these children. Therefore, we use 24871 // the clone algorithm to create a copy of all the current children. 24872 // If we had any progressed work already, that is invalid at this point so 24873 // let's throw it out. 24874 workInProgress.child = reconcileChildFibers(workInProgress, current.child, nextChildren, renderLanes); 24875 } 24876} 24877 24878function forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes) { 24879 // This function is fork of reconcileChildren. It's used in cases where we 24880 // want to reconcile without matching against the existing set. This has the 24881 // effect of all current children being unmounted; even if the type and key 24882 // are the same, the old child is unmounted and a new child is created. 24883 // 24884 // To do this, we're going to go through the reconcile algorithm twice. In 24885 // the first pass, we schedule a deletion for all the current children by 24886 // passing null. 24887 workInProgress.child = reconcileChildFibers(workInProgress, current.child, null, renderLanes); // In the second pass, we mount the new children. The trick here is that we 24888 // pass null in place of where we usually pass the current child set. This has 24889 // the effect of remounting all children regardless of whether their 24890 // identities match. 24891 24892 workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes); 24893} 24894 24895function updateForwardRef(current, workInProgress, Component, nextProps, renderLanes) { 24896 // TODO: current can be non-null here even if the component 24897 // hasn't yet mounted. This happens after the first render suspends. 24898 // We'll need to figure out if this is fine or can cause issues. 24899 { 24900 if (workInProgress.type !== workInProgress.elementType) { 24901 // Lazy component props can't be validated in createElement 24902 // because they're only guaranteed to be resolved here. 24903 var innerPropTypes = Component.propTypes; 24904 24905 if (innerPropTypes) { 24906 checkPropTypes(innerPropTypes, nextProps, // Resolved props 24907 'prop', getComponentNameFromType(Component)); 24908 } 24909 } 24910 } 24911 24912 var render = Component.render; 24913 var ref = workInProgress.ref; // The rest is a fork of updateFunctionComponent 24914 24915 var nextChildren; 24916 var hasId; 24917 prepareToReadContext(workInProgress, renderLanes); 24918 24919 { 24920 markComponentRenderStarted(workInProgress); 24921 } 24922 24923 { 24924 ReactCurrentOwner$1.current = workInProgress; 24925 setIsRendering(true); 24926 nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes); 24927 hasId = checkDidRenderIdHook(); 24928 24929 if ( workInProgress.mode & StrictLegacyMode) { 24930 setIsStrictModeForDevtools(true); 24931 24932 try { 24933 nextChildren = renderWithHooks(current, workInProgress, render, nextProps, ref, renderLanes); 24934 hasId = checkDidRenderIdHook(); 24935 } finally { 24936 setIsStrictModeForDevtools(false); 24937 } 24938 } 24939 24940 setIsRendering(false); 24941 } 24942 24943 { 24944 markComponentRenderStopped(); 24945 } 24946 24947 if (current !== null && !didReceiveUpdate) { 24948 bailoutHooks(current, workInProgress, renderLanes); 24949 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 24950 } 24951 24952 if (getIsHydrating() && hasId) { 24953 pushMaterializedTreeId(workInProgress); 24954 } // React DevTools reads this flag. 24955 24956 24957 workInProgress.flags |= PerformedWork; 24958 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 24959 return workInProgress.child; 24960} 24961 24962function updateMemoComponent(current, workInProgress, Component, nextProps, renderLanes) { 24963 if (current === null) { 24964 var type = Component.type; 24965 24966 if (isSimpleFunctionComponent(type) && Component.compare === null && // SimpleMemoComponent codepath doesn't resolve outer props either. 24967 Component.defaultProps === undefined) { 24968 var resolvedType = type; 24969 24970 { 24971 resolvedType = resolveFunctionForHotReloading(type); 24972 } // If this is a plain function component without default props, 24973 // and with only the default shallow comparison, we upgrade it 24974 // to a SimpleMemoComponent to allow fast path updates. 24975 24976 24977 workInProgress.tag = SimpleMemoComponent; 24978 workInProgress.type = resolvedType; 24979 24980 { 24981 validateFunctionComponentInDev(workInProgress, type); 24982 } 24983 24984 return updateSimpleMemoComponent(current, workInProgress, resolvedType, nextProps, renderLanes); 24985 } 24986 24987 { 24988 var innerPropTypes = type.propTypes; 24989 24990 if (innerPropTypes) { 24991 // Inner memo component props aren't currently validated in createElement. 24992 // We could move it there, but we'd still need this for lazy code path. 24993 checkPropTypes(innerPropTypes, nextProps, // Resolved props 24994 'prop', getComponentNameFromType(type)); 24995 } 24996 } 24997 24998 var child = createFiberFromTypeAndProps(Component.type, null, nextProps, workInProgress, workInProgress.mode, renderLanes); 24999 child.ref = workInProgress.ref; 25000 child.return = workInProgress; 25001 workInProgress.child = child; 25002 return child; 25003 } 25004 25005 { 25006 var _type = Component.type; 25007 var _innerPropTypes = _type.propTypes; 25008 25009 if (_innerPropTypes) { 25010 // Inner memo component props aren't currently validated in createElement. 25011 // We could move it there, but we'd still need this for lazy code path. 25012 checkPropTypes(_innerPropTypes, nextProps, // Resolved props 25013 'prop', getComponentNameFromType(_type)); 25014 } 25015 } 25016 25017 var currentChild = current.child; // This is always exactly one child 25018 25019 var hasScheduledUpdateOrContext = checkScheduledUpdateOrContext(current, renderLanes); 25020 25021 if (!hasScheduledUpdateOrContext) { 25022 // This will be the props with resolved defaultProps, 25023 // unlike current.memoizedProps which will be the unresolved ones. 25024 var prevProps = currentChild.memoizedProps; // Default to shallow comparison 25025 25026 var compare = Component.compare; 25027 compare = compare !== null ? compare : shallowEqual; 25028 25029 if (compare(prevProps, nextProps) && current.ref === workInProgress.ref) { 25030 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 25031 } 25032 } // React DevTools reads this flag. 25033 25034 25035 workInProgress.flags |= PerformedWork; 25036 var newChild = createWorkInProgress(currentChild, nextProps); 25037 newChild.ref = workInProgress.ref; 25038 newChild.return = workInProgress; 25039 workInProgress.child = newChild; 25040 return newChild; 25041} 25042 25043function updateSimpleMemoComponent(current, workInProgress, Component, nextProps, renderLanes) { 25044 // TODO: current can be non-null here even if the component 25045 // hasn't yet mounted. This happens when the inner render suspends. 25046 // We'll need to figure out if this is fine or can cause issues. 25047 { 25048 if (workInProgress.type !== workInProgress.elementType) { 25049 // Lazy component props can't be validated in createElement 25050 // because they're only guaranteed to be resolved here. 25051 var outerMemoType = workInProgress.elementType; 25052 25053 if (outerMemoType.$$typeof === REACT_LAZY_TYPE) { 25054 // We warn when you define propTypes on lazy() 25055 // so let's just skip over it to find memo() outer wrapper. 25056 // Inner props for memo are validated later. 25057 var lazyComponent = outerMemoType; 25058 var payload = lazyComponent._payload; 25059 var init = lazyComponent._init; 25060 25061 try { 25062 outerMemoType = init(payload); 25063 } catch (x) { 25064 outerMemoType = null; 25065 } // Inner propTypes will be validated in the function component path. 25066 25067 25068 var outerPropTypes = outerMemoType && outerMemoType.propTypes; 25069 25070 if (outerPropTypes) { 25071 checkPropTypes(outerPropTypes, nextProps, // Resolved (SimpleMemoComponent has no defaultProps) 25072 'prop', getComponentNameFromType(outerMemoType)); 25073 } 25074 } 25075 } 25076 } 25077 25078 if (current !== null) { 25079 var prevProps = current.memoizedProps; 25080 25081 if (shallowEqual(prevProps, nextProps) && current.ref === workInProgress.ref && ( // Prevent bailout if the implementation changed due to hot reload. 25082 workInProgress.type === current.type )) { 25083 didReceiveUpdate = false; // The props are shallowly equal. Reuse the previous props object, like we 25084 // would during a normal fiber bailout. 25085 // 25086 // We don't have strong guarantees that the props object is referentially 25087 // equal during updates where we can't bail out anyway — like if the props 25088 // are shallowly equal, but there's a local state or context update in the 25089 // same batch. 25090 // 25091 // However, as a principle, we should aim to make the behavior consistent 25092 // across different ways of memoizing a component. For example, React.memo 25093 // has a different internal Fiber layout if you pass a normal function 25094 // component (SimpleMemoComponent) versus if you pass a different type 25095 // like forwardRef (MemoComponent). But this is an implementation detail. 25096 // Wrapping a component in forwardRef (or React.lazy, etc) shouldn't 25097 // affect whether the props object is reused during a bailout. 25098 25099 workInProgress.pendingProps = nextProps = prevProps; 25100 25101 if (!checkScheduledUpdateOrContext(current, renderLanes)) { 25102 // The pending lanes were cleared at the beginning of beginWork. We're 25103 // about to bail out, but there might be other lanes that weren't 25104 // included in the current render. Usually, the priority level of the 25105 // remaining updates is accumulated during the evaluation of the 25106 // component (i.e. when processing the update queue). But since since 25107 // we're bailing out early *without* evaluating the component, we need 25108 // to account for it here, too. Reset to the value of the current fiber. 25109 // NOTE: This only applies to SimpleMemoComponent, not MemoComponent, 25110 // because a MemoComponent fiber does not have hooks or an update queue; 25111 // rather, it wraps around an inner component, which may or may not 25112 // contains hooks. 25113 // TODO: Move the reset at in beginWork out of the common path so that 25114 // this is no longer necessary. 25115 workInProgress.lanes = current.lanes; 25116 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 25117 } else if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) { 25118 // This is a special case that only exists for legacy mode. 25119 // See https://github.com/facebook/react/pull/19216. 25120 didReceiveUpdate = true; 25121 } 25122 } 25123 } 25124 25125 return updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes); 25126} 25127 25128function updateOffscreenComponent(current, workInProgress, renderLanes) { 25129 var nextProps = workInProgress.pendingProps; 25130 var nextChildren = nextProps.children; 25131 var prevState = current !== null ? current.memoizedState : null; 25132 25133 if (nextProps.mode === 'hidden' || enableLegacyHidden ) { 25134 // Rendering a hidden tree. 25135 if ((workInProgress.mode & ConcurrentMode) === NoMode) { 25136 // In legacy sync mode, don't defer the subtree. Render it now. 25137 // TODO: Consider how Offscreen should work with transitions in the future 25138 var nextState = { 25139 baseLanes: NoLanes, 25140 cachePool: null, 25141 transitions: null 25142 }; 25143 workInProgress.memoizedState = nextState; 25144 25145 pushRenderLanes(workInProgress, renderLanes); 25146 } else if (!includesSomeLane(renderLanes, OffscreenLane)) { 25147 var spawnedCachePool = null; // We're hidden, and we're not rendering at Offscreen. We will bail out 25148 // and resume this tree later. 25149 25150 var nextBaseLanes; 25151 25152 if (prevState !== null) { 25153 var prevBaseLanes = prevState.baseLanes; 25154 nextBaseLanes = mergeLanes(prevBaseLanes, renderLanes); 25155 } else { 25156 nextBaseLanes = renderLanes; 25157 } // Schedule this fiber to re-render at offscreen priority. Then bailout. 25158 25159 25160 workInProgress.lanes = workInProgress.childLanes = laneToLanes(OffscreenLane); 25161 var _nextState = { 25162 baseLanes: nextBaseLanes, 25163 cachePool: spawnedCachePool, 25164 transitions: null 25165 }; 25166 workInProgress.memoizedState = _nextState; 25167 workInProgress.updateQueue = null; 25168 // to avoid a push/pop misalignment. 25169 25170 25171 pushRenderLanes(workInProgress, nextBaseLanes); 25172 25173 return null; 25174 } else { 25175 // This is the second render. The surrounding visible content has already 25176 // committed. Now we resume rendering the hidden tree. 25177 // Rendering at offscreen, so we can clear the base lanes. 25178 var _nextState2 = { 25179 baseLanes: NoLanes, 25180 cachePool: null, 25181 transitions: null 25182 }; 25183 workInProgress.memoizedState = _nextState2; // Push the lanes that were skipped when we bailed out. 25184 25185 var subtreeRenderLanes = prevState !== null ? prevState.baseLanes : renderLanes; 25186 25187 pushRenderLanes(workInProgress, subtreeRenderLanes); 25188 } 25189 } else { 25190 // Rendering a visible tree. 25191 var _subtreeRenderLanes; 25192 25193 if (prevState !== null) { 25194 // We're going from hidden -> visible. 25195 _subtreeRenderLanes = mergeLanes(prevState.baseLanes, renderLanes); 25196 25197 workInProgress.memoizedState = null; 25198 } else { 25199 // We weren't previously hidden, and we still aren't, so there's nothing 25200 // special to do. Need to push to the stack regardless, though, to avoid 25201 // a push/pop misalignment. 25202 _subtreeRenderLanes = renderLanes; 25203 } 25204 25205 pushRenderLanes(workInProgress, _subtreeRenderLanes); 25206 } 25207 25208 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25209 return workInProgress.child; 25210} // Note: These happen to have identical begin phases, for now. We shouldn't hold 25211 25212function updateFragment(current, workInProgress, renderLanes) { 25213 var nextChildren = workInProgress.pendingProps; 25214 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25215 return workInProgress.child; 25216} 25217 25218function updateMode(current, workInProgress, renderLanes) { 25219 var nextChildren = workInProgress.pendingProps.children; 25220 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25221 return workInProgress.child; 25222} 25223 25224function updateProfiler(current, workInProgress, renderLanes) { 25225 { 25226 workInProgress.flags |= Update; 25227 25228 { 25229 // Reset effect durations for the next eventual effect phase. 25230 // These are reset during render to allow the DevTools commit hook a chance to read them, 25231 var stateNode = workInProgress.stateNode; 25232 stateNode.effectDuration = 0; 25233 stateNode.passiveEffectDuration = 0; 25234 } 25235 } 25236 25237 var nextProps = workInProgress.pendingProps; 25238 var nextChildren = nextProps.children; 25239 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25240 return workInProgress.child; 25241} 25242 25243function markRef(current, workInProgress) { 25244 var ref = workInProgress.ref; 25245 25246 if (current === null && ref !== null || current !== null && current.ref !== ref) { 25247 // Schedule a Ref effect 25248 workInProgress.flags |= Ref; 25249 25250 { 25251 workInProgress.flags |= RefStatic; 25252 } 25253 } 25254} 25255 25256function updateFunctionComponent(current, workInProgress, Component, nextProps, renderLanes) { 25257 { 25258 if (workInProgress.type !== workInProgress.elementType) { 25259 // Lazy component props can't be validated in createElement 25260 // because they're only guaranteed to be resolved here. 25261 var innerPropTypes = Component.propTypes; 25262 25263 if (innerPropTypes) { 25264 checkPropTypes(innerPropTypes, nextProps, // Resolved props 25265 'prop', getComponentNameFromType(Component)); 25266 } 25267 } 25268 } 25269 25270 var context; 25271 25272 { 25273 var unmaskedContext = getUnmaskedContext(workInProgress, Component, true); 25274 context = getMaskedContext(workInProgress, unmaskedContext); 25275 } 25276 25277 var nextChildren; 25278 var hasId; 25279 prepareToReadContext(workInProgress, renderLanes); 25280 25281 { 25282 markComponentRenderStarted(workInProgress); 25283 } 25284 25285 { 25286 ReactCurrentOwner$1.current = workInProgress; 25287 setIsRendering(true); 25288 nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes); 25289 hasId = checkDidRenderIdHook(); 25290 25291 if ( workInProgress.mode & StrictLegacyMode) { 25292 setIsStrictModeForDevtools(true); 25293 25294 try { 25295 nextChildren = renderWithHooks(current, workInProgress, Component, nextProps, context, renderLanes); 25296 hasId = checkDidRenderIdHook(); 25297 } finally { 25298 setIsStrictModeForDevtools(false); 25299 } 25300 } 25301 25302 setIsRendering(false); 25303 } 25304 25305 { 25306 markComponentRenderStopped(); 25307 } 25308 25309 if (current !== null && !didReceiveUpdate) { 25310 bailoutHooks(current, workInProgress, renderLanes); 25311 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 25312 } 25313 25314 if (getIsHydrating() && hasId) { 25315 pushMaterializedTreeId(workInProgress); 25316 } // React DevTools reads this flag. 25317 25318 25319 workInProgress.flags |= PerformedWork; 25320 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25321 return workInProgress.child; 25322} 25323 25324function updateClassComponent(current, workInProgress, Component, nextProps, renderLanes) { 25325 { 25326 // This is used by DevTools to force a boundary to error. 25327 switch (shouldError(workInProgress)) { 25328 case false: 25329 { 25330 var _instance = workInProgress.stateNode; 25331 var ctor = workInProgress.type; // TODO This way of resetting the error boundary state is a hack. 25332 // Is there a better way to do this? 25333 25334 var tempInstance = new ctor(workInProgress.memoizedProps, _instance.context); 25335 var state = tempInstance.state; 25336 25337 _instance.updater.enqueueSetState(_instance, state, null); 25338 25339 break; 25340 } 25341 25342 case true: 25343 { 25344 workInProgress.flags |= DidCapture; 25345 workInProgress.flags |= ShouldCapture; // eslint-disable-next-line react-internal/prod-error-codes 25346 25347 var error$1 = new Error('Simulated error coming from DevTools'); 25348 var lane = pickArbitraryLane(renderLanes); 25349 workInProgress.lanes = mergeLanes(workInProgress.lanes, lane); // Schedule the error boundary to re-render using updated state 25350 25351 var update = createClassErrorUpdate(workInProgress, createCapturedValueAtFiber(error$1, workInProgress), lane); 25352 enqueueCapturedUpdate(workInProgress, update); 25353 break; 25354 } 25355 } 25356 25357 if (workInProgress.type !== workInProgress.elementType) { 25358 // Lazy component props can't be validated in createElement 25359 // because they're only guaranteed to be resolved here. 25360 var innerPropTypes = Component.propTypes; 25361 25362 if (innerPropTypes) { 25363 checkPropTypes(innerPropTypes, nextProps, // Resolved props 25364 'prop', getComponentNameFromType(Component)); 25365 } 25366 } 25367 } // Push context providers early to prevent context stack mismatches. 25368 // During mounting we don't know the child context yet as the instance doesn't exist. 25369 // We will invalidate the child context in finishClassComponent() right after rendering. 25370 25371 25372 var hasContext; 25373 25374 if (isContextProvider(Component)) { 25375 hasContext = true; 25376 pushContextProvider(workInProgress); 25377 } else { 25378 hasContext = false; 25379 } 25380 25381 prepareToReadContext(workInProgress, renderLanes); 25382 var instance = workInProgress.stateNode; 25383 var shouldUpdate; 25384 25385 if (instance === null) { 25386 resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress); // In the initial pass we might need to construct the instance. 25387 25388 constructClassInstance(workInProgress, Component, nextProps); 25389 mountClassInstance(workInProgress, Component, nextProps, renderLanes); 25390 shouldUpdate = true; 25391 } else if (current === null) { 25392 // In a resume, we'll already have an instance we can reuse. 25393 shouldUpdate = resumeMountClassInstance(workInProgress, Component, nextProps, renderLanes); 25394 } else { 25395 shouldUpdate = updateClassInstance(current, workInProgress, Component, nextProps, renderLanes); 25396 } 25397 25398 var nextUnitOfWork = finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes); 25399 25400 { 25401 var inst = workInProgress.stateNode; 25402 25403 if (shouldUpdate && inst.props !== nextProps) { 25404 if (!didWarnAboutReassigningProps) { 25405 error('It looks like %s is reassigning its own `this.props` while rendering. ' + 'This is not supported and can lead to confusing bugs.', getComponentNameFromFiber(workInProgress) || 'a component'); 25406 } 25407 25408 didWarnAboutReassigningProps = true; 25409 } 25410 } 25411 25412 return nextUnitOfWork; 25413} 25414 25415function finishClassComponent(current, workInProgress, Component, shouldUpdate, hasContext, renderLanes) { 25416 // Refs should update even if shouldComponentUpdate returns false 25417 markRef(current, workInProgress); 25418 var didCaptureError = (workInProgress.flags & DidCapture) !== NoFlags; 25419 25420 if (!shouldUpdate && !didCaptureError) { 25421 // Context providers should defer to sCU for rendering 25422 if (hasContext) { 25423 invalidateContextProvider(workInProgress, Component, false); 25424 } 25425 25426 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 25427 } 25428 25429 var instance = workInProgress.stateNode; // Rerender 25430 25431 ReactCurrentOwner$1.current = workInProgress; 25432 var nextChildren; 25433 25434 if (didCaptureError && typeof Component.getDerivedStateFromError !== 'function') { 25435 // If we captured an error, but getDerivedStateFromError is not defined, 25436 // unmount all the children. componentDidCatch will schedule an update to 25437 // re-render a fallback. This is temporary until we migrate everyone to 25438 // the new API. 25439 // TODO: Warn in a future release. 25440 nextChildren = null; 25441 25442 { 25443 stopProfilerTimerIfRunning(); 25444 } 25445 } else { 25446 { 25447 markComponentRenderStarted(workInProgress); 25448 } 25449 25450 { 25451 setIsRendering(true); 25452 nextChildren = instance.render(); 25453 25454 if ( workInProgress.mode & StrictLegacyMode) { 25455 setIsStrictModeForDevtools(true); 25456 25457 try { 25458 instance.render(); 25459 } finally { 25460 setIsStrictModeForDevtools(false); 25461 } 25462 } 25463 25464 setIsRendering(false); 25465 } 25466 25467 { 25468 markComponentRenderStopped(); 25469 } 25470 } // React DevTools reads this flag. 25471 25472 25473 workInProgress.flags |= PerformedWork; 25474 25475 if (current !== null && didCaptureError) { 25476 // If we're recovering from an error, reconcile without reusing any of 25477 // the existing children. Conceptually, the normal children and the children 25478 // that are shown on error are two different sets, so we shouldn't reuse 25479 // normal children even if their identities match. 25480 forceUnmountCurrentAndReconcile(current, workInProgress, nextChildren, renderLanes); 25481 } else { 25482 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25483 } // Memoize state using the values we just used to render. 25484 // TODO: Restructure so we never read values from the instance. 25485 25486 25487 workInProgress.memoizedState = instance.state; // The context might have changed so we need to recalculate it. 25488 25489 if (hasContext) { 25490 invalidateContextProvider(workInProgress, Component, true); 25491 } 25492 25493 return workInProgress.child; 25494} 25495 25496function pushHostRootContext(workInProgress) { 25497 var root = workInProgress.stateNode; 25498 25499 if (root.pendingContext) { 25500 pushTopLevelContextObject(workInProgress, root.pendingContext, root.pendingContext !== root.context); 25501 } else if (root.context) { 25502 // Should always be set 25503 pushTopLevelContextObject(workInProgress, root.context, false); 25504 } 25505 25506 pushHostContainer(workInProgress, root.containerInfo); 25507} 25508 25509function updateHostRoot(current, workInProgress, renderLanes) { 25510 pushHostRootContext(workInProgress); 25511 25512 if (current === null) { 25513 throw new Error('Should have a current fiber. This is a bug in React.'); 25514 } 25515 25516 var nextProps = workInProgress.pendingProps; 25517 var prevState = workInProgress.memoizedState; 25518 var prevChildren = prevState.element; 25519 cloneUpdateQueue(current, workInProgress); 25520 processUpdateQueue(workInProgress, nextProps, null, renderLanes); 25521 var nextState = workInProgress.memoizedState; 25522 var root = workInProgress.stateNode; 25523 // being called "element". 25524 25525 25526 var nextChildren = nextState.element; 25527 25528 if ( prevState.isDehydrated) { 25529 // This is a hydration root whose shell has not yet hydrated. We should 25530 // attempt to hydrate. 25531 // Flip isDehydrated to false to indicate that when this render 25532 // finishes, the root will no longer be dehydrated. 25533 var overrideState = { 25534 element: nextChildren, 25535 isDehydrated: false, 25536 cache: nextState.cache, 25537 pendingSuspenseBoundaries: nextState.pendingSuspenseBoundaries, 25538 transitions: nextState.transitions 25539 }; 25540 var updateQueue = workInProgress.updateQueue; // `baseState` can always be the last state because the root doesn't 25541 // have reducer functions so it doesn't need rebasing. 25542 25543 updateQueue.baseState = overrideState; 25544 workInProgress.memoizedState = overrideState; 25545 25546 if (workInProgress.flags & ForceClientRender) { 25547 // Something errored during a previous attempt to hydrate the shell, so we 25548 // forced a client render. 25549 var recoverableError = createCapturedValueAtFiber(new Error('There was an error while hydrating. Because the error happened outside ' + 'of a Suspense boundary, the entire root will switch to ' + 'client rendering.'), workInProgress); 25550 return mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, recoverableError); 25551 } else if (nextChildren !== prevChildren) { 25552 var _recoverableError = createCapturedValueAtFiber(new Error('This root received an early update, before anything was able ' + 'hydrate. Switched the entire root to client rendering.'), workInProgress); 25553 25554 return mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, _recoverableError); 25555 } else { 25556 // The outermost shell has not hydrated yet. Start hydrating. 25557 enterHydrationState(workInProgress); 25558 25559 var child = mountChildFibers(workInProgress, null, nextChildren, renderLanes); 25560 workInProgress.child = child; 25561 var node = child; 25562 25563 while (node) { 25564 // Mark each child as hydrating. This is a fast path to know whether this 25565 // tree is part of a hydrating tree. This is used to determine if a child 25566 // node has fully mounted yet, and for scheduling event replaying. 25567 // Conceptually this is similar to Placement in that a new subtree is 25568 // inserted into the React tree here. It just happens to not need DOM 25569 // mutations because it already exists. 25570 node.flags = node.flags & ~Placement | Hydrating; 25571 node = node.sibling; 25572 } 25573 } 25574 } else { 25575 // Root is not dehydrated. Either this is a client-only root, or it 25576 // already hydrated. 25577 resetHydrationState(); 25578 25579 if (nextChildren === prevChildren) { 25580 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 25581 } 25582 25583 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25584 } 25585 25586 return workInProgress.child; 25587} 25588 25589function mountHostRootWithoutHydrating(current, workInProgress, nextChildren, renderLanes, recoverableError) { 25590 // Revert to client rendering. 25591 resetHydrationState(); 25592 queueHydrationError(recoverableError); 25593 workInProgress.flags |= ForceClientRender; 25594 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25595 return workInProgress.child; 25596} 25597 25598function updateHostComponent(current, workInProgress, renderLanes) { 25599 pushHostContext(workInProgress); 25600 25601 if (current === null) { 25602 tryToClaimNextHydratableInstance(workInProgress); 25603 } 25604 25605 var type = workInProgress.type; 25606 var nextProps = workInProgress.pendingProps; 25607 var prevProps = current !== null ? current.memoizedProps : null; 25608 var nextChildren = nextProps.children; 25609 var isDirectTextChild = shouldSetTextContent(type, nextProps); 25610 25611 if (isDirectTextChild) { 25612 // We special case a direct text child of a host node. This is a common 25613 // case. We won't handle it as a reified child. We will instead handle 25614 // this in the host environment that also has access to this prop. That 25615 // avoids allocating another HostText fiber and traversing it. 25616 nextChildren = null; 25617 } else if (prevProps !== null && shouldSetTextContent(type, prevProps)) { 25618 // If we're switching from a direct text child to a normal child, or to 25619 // empty, we need to schedule the text content to be reset. 25620 workInProgress.flags |= ContentReset; 25621 } 25622 25623 markRef(current, workInProgress); 25624 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 25625 return workInProgress.child; 25626} 25627 25628function updateHostText(current, workInProgress) { 25629 if (current === null) { 25630 tryToClaimNextHydratableInstance(workInProgress); 25631 } // Nothing to do here. This is terminal. We'll do the completion step 25632 // immediately after. 25633 25634 25635 return null; 25636} 25637 25638function mountLazyComponent(_current, workInProgress, elementType, renderLanes) { 25639 resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); 25640 var props = workInProgress.pendingProps; 25641 var lazyComponent = elementType; 25642 var payload = lazyComponent._payload; 25643 var init = lazyComponent._init; 25644 var Component = init(payload); // Store the unwrapped component in the type. 25645 25646 workInProgress.type = Component; 25647 var resolvedTag = workInProgress.tag = resolveLazyComponentTag(Component); 25648 var resolvedProps = resolveDefaultProps(Component, props); 25649 var child; 25650 25651 switch (resolvedTag) { 25652 case FunctionComponent: 25653 { 25654 { 25655 validateFunctionComponentInDev(workInProgress, Component); 25656 workInProgress.type = Component = resolveFunctionForHotReloading(Component); 25657 } 25658 25659 child = updateFunctionComponent(null, workInProgress, Component, resolvedProps, renderLanes); 25660 return child; 25661 } 25662 25663 case ClassComponent: 25664 { 25665 { 25666 workInProgress.type = Component = resolveClassForHotReloading(Component); 25667 } 25668 25669 child = updateClassComponent(null, workInProgress, Component, resolvedProps, renderLanes); 25670 return child; 25671 } 25672 25673 case ForwardRef: 25674 { 25675 { 25676 workInProgress.type = Component = resolveForwardRefForHotReloading(Component); 25677 } 25678 25679 child = updateForwardRef(null, workInProgress, Component, resolvedProps, renderLanes); 25680 return child; 25681 } 25682 25683 case MemoComponent: 25684 { 25685 { 25686 if (workInProgress.type !== workInProgress.elementType) { 25687 var outerPropTypes = Component.propTypes; 25688 25689 if (outerPropTypes) { 25690 checkPropTypes(outerPropTypes, resolvedProps, // Resolved for outer only 25691 'prop', getComponentNameFromType(Component)); 25692 } 25693 } 25694 } 25695 25696 child = updateMemoComponent(null, workInProgress, Component, resolveDefaultProps(Component.type, resolvedProps), // The inner type can have defaults too 25697 renderLanes); 25698 return child; 25699 } 25700 } 25701 25702 var hint = ''; 25703 25704 { 25705 if (Component !== null && typeof Component === 'object' && Component.$$typeof === REACT_LAZY_TYPE) { 25706 hint = ' Did you wrap a component in React.lazy() more than once?'; 25707 } 25708 } // This message intentionally doesn't mention ForwardRef or MemoComponent 25709 // because the fact that it's a separate type of work is an 25710 // implementation detail. 25711 25712 25713 throw new Error("Element type is invalid. Received a promise that resolves to: " + Component + ". " + ("Lazy element type must resolve to a class or function." + hint)); 25714} 25715 25716function mountIncompleteClassComponent(_current, workInProgress, Component, nextProps, renderLanes) { 25717 resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); // Promote the fiber to a class and try rendering again. 25718 25719 workInProgress.tag = ClassComponent; // The rest of this function is a fork of `updateClassComponent` 25720 // Push context providers early to prevent context stack mismatches. 25721 // During mounting we don't know the child context yet as the instance doesn't exist. 25722 // We will invalidate the child context in finishClassComponent() right after rendering. 25723 25724 var hasContext; 25725 25726 if (isContextProvider(Component)) { 25727 hasContext = true; 25728 pushContextProvider(workInProgress); 25729 } else { 25730 hasContext = false; 25731 } 25732 25733 prepareToReadContext(workInProgress, renderLanes); 25734 constructClassInstance(workInProgress, Component, nextProps); 25735 mountClassInstance(workInProgress, Component, nextProps, renderLanes); 25736 return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes); 25737} 25738 25739function mountIndeterminateComponent(_current, workInProgress, Component, renderLanes) { 25740 resetSuspendedCurrentOnMountInLegacyMode(_current, workInProgress); 25741 var props = workInProgress.pendingProps; 25742 var context; 25743 25744 { 25745 var unmaskedContext = getUnmaskedContext(workInProgress, Component, false); 25746 context = getMaskedContext(workInProgress, unmaskedContext); 25747 } 25748 25749 prepareToReadContext(workInProgress, renderLanes); 25750 var value; 25751 var hasId; 25752 25753 { 25754 markComponentRenderStarted(workInProgress); 25755 } 25756 25757 { 25758 if (Component.prototype && typeof Component.prototype.render === 'function') { 25759 var componentName = getComponentNameFromType(Component) || 'Unknown'; 25760 25761 if (!didWarnAboutBadClass[componentName]) { 25762 error("The <%s /> component appears to have a render method, but doesn't extend React.Component. " + 'This is likely to cause errors. Change %s to extend React.Component instead.', componentName, componentName); 25763 25764 didWarnAboutBadClass[componentName] = true; 25765 } 25766 } 25767 25768 if (workInProgress.mode & StrictLegacyMode) { 25769 ReactStrictModeWarnings.recordLegacyContextWarning(workInProgress, null); 25770 } 25771 25772 setIsRendering(true); 25773 ReactCurrentOwner$1.current = workInProgress; 25774 value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes); 25775 hasId = checkDidRenderIdHook(); 25776 setIsRendering(false); 25777 } 25778 25779 { 25780 markComponentRenderStopped(); 25781 } // React DevTools reads this flag. 25782 25783 25784 workInProgress.flags |= PerformedWork; 25785 25786 { 25787 // Support for module components is deprecated and is removed behind a flag. 25788 // Whether or not it would crash later, we want to show a good message in DEV first. 25789 if (typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) { 25790 var _componentName = getComponentNameFromType(Component) || 'Unknown'; 25791 25792 if (!didWarnAboutModulePatternComponent[_componentName]) { 25793 error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName, _componentName, _componentName); 25794 25795 didWarnAboutModulePatternComponent[_componentName] = true; 25796 } 25797 } 25798 } 25799 25800 if ( // Run these checks in production only if the flag is off. 25801 // Eventually we'll delete this branch altogether. 25802 typeof value === 'object' && value !== null && typeof value.render === 'function' && value.$$typeof === undefined) { 25803 { 25804 var _componentName2 = getComponentNameFromType(Component) || 'Unknown'; 25805 25806 if (!didWarnAboutModulePatternComponent[_componentName2]) { 25807 error('The <%s /> component appears to be a function component that returns a class instance. ' + 'Change %s to a class that extends React.Component instead. ' + "If you can't use a class try assigning the prototype on the function as a workaround. " + "`%s.prototype = React.Component.prototype`. Don't use an arrow function since it " + 'cannot be called with `new` by React.', _componentName2, _componentName2, _componentName2); 25808 25809 didWarnAboutModulePatternComponent[_componentName2] = true; 25810 } 25811 } // Proceed under the assumption that this is a class instance 25812 25813 25814 workInProgress.tag = ClassComponent; // Throw out any hooks that were used. 25815 25816 workInProgress.memoizedState = null; 25817 workInProgress.updateQueue = null; // Push context providers early to prevent context stack mismatches. 25818 // During mounting we don't know the child context yet as the instance doesn't exist. 25819 // We will invalidate the child context in finishClassComponent() right after rendering. 25820 25821 var hasContext = false; 25822 25823 if (isContextProvider(Component)) { 25824 hasContext = true; 25825 pushContextProvider(workInProgress); 25826 } else { 25827 hasContext = false; 25828 } 25829 25830 workInProgress.memoizedState = value.state !== null && value.state !== undefined ? value.state : null; 25831 initializeUpdateQueue(workInProgress); 25832 adoptClassInstance(workInProgress, value); 25833 mountClassInstance(workInProgress, Component, props, renderLanes); 25834 return finishClassComponent(null, workInProgress, Component, true, hasContext, renderLanes); 25835 } else { 25836 // Proceed under the assumption that this is a function component 25837 workInProgress.tag = FunctionComponent; 25838 25839 { 25840 25841 if ( workInProgress.mode & StrictLegacyMode) { 25842 setIsStrictModeForDevtools(true); 25843 25844 try { 25845 value = renderWithHooks(null, workInProgress, Component, props, context, renderLanes); 25846 hasId = checkDidRenderIdHook(); 25847 } finally { 25848 setIsStrictModeForDevtools(false); 25849 } 25850 } 25851 } 25852 25853 if (getIsHydrating() && hasId) { 25854 pushMaterializedTreeId(workInProgress); 25855 } 25856 25857 reconcileChildren(null, workInProgress, value, renderLanes); 25858 25859 { 25860 validateFunctionComponentInDev(workInProgress, Component); 25861 } 25862 25863 return workInProgress.child; 25864 } 25865} 25866 25867function validateFunctionComponentInDev(workInProgress, Component) { 25868 { 25869 if (Component) { 25870 if (Component.childContextTypes) { 25871 error('%s(...): childContextTypes cannot be defined on a function component.', Component.displayName || Component.name || 'Component'); 25872 } 25873 } 25874 25875 if (workInProgress.ref !== null) { 25876 var info = ''; 25877 var ownerName = getCurrentFiberOwnerNameInDevOrNull(); 25878 25879 if (ownerName) { 25880 info += '\n\nCheck the render method of `' + ownerName + '`.'; 25881 } 25882 25883 var warningKey = ownerName || ''; 25884 var debugSource = workInProgress._debugSource; 25885 25886 if (debugSource) { 25887 warningKey = debugSource.fileName + ':' + debugSource.lineNumber; 25888 } 25889 25890 if (!didWarnAboutFunctionRefs[warningKey]) { 25891 didWarnAboutFunctionRefs[warningKey] = true; 25892 25893 error('Function components cannot be given refs. ' + 'Attempts to access this ref will fail. ' + 'Did you mean to use React.forwardRef()?%s', info); 25894 } 25895 } 25896 25897 if (typeof Component.getDerivedStateFromProps === 'function') { 25898 var _componentName3 = getComponentNameFromType(Component) || 'Unknown'; 25899 25900 if (!didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3]) { 25901 error('%s: Function components do not support getDerivedStateFromProps.', _componentName3); 25902 25903 didWarnAboutGetDerivedStateOnFunctionComponent[_componentName3] = true; 25904 } 25905 } 25906 25907 if (typeof Component.contextType === 'object' && Component.contextType !== null) { 25908 var _componentName4 = getComponentNameFromType(Component) || 'Unknown'; 25909 25910 if (!didWarnAboutContextTypeOnFunctionComponent[_componentName4]) { 25911 error('%s: Function components do not support contextType.', _componentName4); 25912 25913 didWarnAboutContextTypeOnFunctionComponent[_componentName4] = true; 25914 } 25915 } 25916 } 25917} 25918 25919var SUSPENDED_MARKER = { 25920 dehydrated: null, 25921 treeContext: null, 25922 retryLane: NoLane 25923}; 25924 25925function mountSuspenseOffscreenState(renderLanes) { 25926 return { 25927 baseLanes: renderLanes, 25928 cachePool: getSuspendedCache(), 25929 transitions: null 25930 }; 25931} 25932 25933function updateSuspenseOffscreenState(prevOffscreenState, renderLanes) { 25934 var cachePool = null; 25935 25936 return { 25937 baseLanes: mergeLanes(prevOffscreenState.baseLanes, renderLanes), 25938 cachePool: cachePool, 25939 transitions: prevOffscreenState.transitions 25940 }; 25941} // TODO: Probably should inline this back 25942 25943 25944function shouldRemainOnFallback(suspenseContext, current, workInProgress, renderLanes) { 25945 // If we're already showing a fallback, there are cases where we need to 25946 // remain on that fallback regardless of whether the content has resolved. 25947 // For example, SuspenseList coordinates when nested content appears. 25948 if (current !== null) { 25949 var suspenseState = current.memoizedState; 25950 25951 if (suspenseState === null) { 25952 // Currently showing content. Don't hide it, even if ForceSuspenseFallback 25953 // is true. More precise name might be "ForceRemainSuspenseFallback". 25954 // Note: This is a factoring smell. Can't remain on a fallback if there's 25955 // no fallback to remain on. 25956 return false; 25957 } 25958 } // Not currently showing content. Consult the Suspense context. 25959 25960 25961 return hasSuspenseContext(suspenseContext, ForceSuspenseFallback); 25962} 25963 25964function getRemainingWorkInPrimaryTree(current, renderLanes) { 25965 // TODO: Should not remove render lanes that were pinged during this render 25966 return removeLanes(current.childLanes, renderLanes); 25967} 25968 25969function updateSuspenseComponent(current, workInProgress, renderLanes) { 25970 var nextProps = workInProgress.pendingProps; // This is used by DevTools to force a boundary to suspend. 25971 25972 { 25973 if (shouldSuspend(workInProgress)) { 25974 workInProgress.flags |= DidCapture; 25975 } 25976 } 25977 25978 var suspenseContext = suspenseStackCursor.current; 25979 var showFallback = false; 25980 var didSuspend = (workInProgress.flags & DidCapture) !== NoFlags; 25981 25982 if (didSuspend || shouldRemainOnFallback(suspenseContext, current)) { 25983 // Something in this boundary's subtree already suspended. Switch to 25984 // rendering the fallback children. 25985 showFallback = true; 25986 workInProgress.flags &= ~DidCapture; 25987 } else { 25988 // Attempting the main content 25989 if (current === null || current.memoizedState !== null) { 25990 // This is a new mount or this boundary is already showing a fallback state. 25991 // Mark this subtree context as having at least one invisible parent that could 25992 // handle the fallback state. 25993 // Avoided boundaries are not considered since they cannot handle preferred fallback states. 25994 { 25995 suspenseContext = addSubtreeSuspenseContext(suspenseContext, InvisibleParentSuspenseContext); 25996 } 25997 } 25998 } 25999 26000 suspenseContext = setDefaultShallowSuspenseContext(suspenseContext); 26001 pushSuspenseContext(workInProgress, suspenseContext); // OK, the next part is confusing. We're about to reconcile the Suspense 26002 // boundary's children. This involves some custom reconciliation logic. Two 26003 // main reasons this is so complicated. 26004 // 26005 // First, Legacy Mode has different semantics for backwards compatibility. The 26006 // primary tree will commit in an inconsistent state, so when we do the 26007 // second pass to render the fallback, we do some exceedingly, uh, clever 26008 // hacks to make that not totally break. Like transferring effects and 26009 // deletions from hidden tree. In Concurrent Mode, it's much simpler, 26010 // because we bailout on the primary tree completely and leave it in its old 26011 // state, no effects. Same as what we do for Offscreen (except that 26012 // Offscreen doesn't have the first render pass). 26013 // 26014 // Second is hydration. During hydration, the Suspense fiber has a slightly 26015 // different layout, where the child points to a dehydrated fragment, which 26016 // contains the DOM rendered by the server. 26017 // 26018 // Third, even if you set all that aside, Suspense is like error boundaries in 26019 // that we first we try to render one tree, and if that fails, we render again 26020 // and switch to a different tree. Like a try/catch block. So we have to track 26021 // which branch we're currently rendering. Ideally we would model this using 26022 // a stack. 26023 26024 if (current === null) { 26025 // Initial mount 26026 // Special path for hydration 26027 // If we're currently hydrating, try to hydrate this boundary. 26028 tryToClaimNextHydratableInstance(workInProgress); // This could've been a dehydrated suspense component. 26029 26030 var suspenseState = workInProgress.memoizedState; 26031 26032 if (suspenseState !== null) { 26033 var dehydrated = suspenseState.dehydrated; 26034 26035 if (dehydrated !== null) { 26036 return mountDehydratedSuspenseComponent(workInProgress, dehydrated); 26037 } 26038 } 26039 26040 var nextPrimaryChildren = nextProps.children; 26041 var nextFallbackChildren = nextProps.fallback; 26042 26043 if (showFallback) { 26044 var fallbackFragment = mountSuspenseFallbackChildren(workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes); 26045 var primaryChildFragment = workInProgress.child; 26046 primaryChildFragment.memoizedState = mountSuspenseOffscreenState(renderLanes); 26047 workInProgress.memoizedState = SUSPENDED_MARKER; 26048 26049 return fallbackFragment; 26050 } else { 26051 return mountSuspensePrimaryChildren(workInProgress, nextPrimaryChildren); 26052 } 26053 } else { 26054 // This is an update. 26055 // Special path for hydration 26056 var prevState = current.memoizedState; 26057 26058 if (prevState !== null) { 26059 var _dehydrated = prevState.dehydrated; 26060 26061 if (_dehydrated !== null) { 26062 return updateDehydratedSuspenseComponent(current, workInProgress, didSuspend, nextProps, _dehydrated, prevState, renderLanes); 26063 } 26064 } 26065 26066 if (showFallback) { 26067 var _nextFallbackChildren = nextProps.fallback; 26068 var _nextPrimaryChildren = nextProps.children; 26069 var fallbackChildFragment = updateSuspenseFallbackChildren(current, workInProgress, _nextPrimaryChildren, _nextFallbackChildren, renderLanes); 26070 var _primaryChildFragment2 = workInProgress.child; 26071 var prevOffscreenState = current.child.memoizedState; 26072 _primaryChildFragment2.memoizedState = prevOffscreenState === null ? mountSuspenseOffscreenState(renderLanes) : updateSuspenseOffscreenState(prevOffscreenState, renderLanes); 26073 26074 _primaryChildFragment2.childLanes = getRemainingWorkInPrimaryTree(current, renderLanes); 26075 workInProgress.memoizedState = SUSPENDED_MARKER; 26076 return fallbackChildFragment; 26077 } else { 26078 var _nextPrimaryChildren2 = nextProps.children; 26079 26080 var _primaryChildFragment3 = updateSuspensePrimaryChildren(current, workInProgress, _nextPrimaryChildren2, renderLanes); 26081 26082 workInProgress.memoizedState = null; 26083 return _primaryChildFragment3; 26084 } 26085 } 26086} 26087 26088function mountSuspensePrimaryChildren(workInProgress, primaryChildren, renderLanes) { 26089 var mode = workInProgress.mode; 26090 var primaryChildProps = { 26091 mode: 'visible', 26092 children: primaryChildren 26093 }; 26094 var primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, mode); 26095 primaryChildFragment.return = workInProgress; 26096 workInProgress.child = primaryChildFragment; 26097 return primaryChildFragment; 26098} 26099 26100function mountSuspenseFallbackChildren(workInProgress, primaryChildren, fallbackChildren, renderLanes) { 26101 var mode = workInProgress.mode; 26102 var progressedPrimaryFragment = workInProgress.child; 26103 var primaryChildProps = { 26104 mode: 'hidden', 26105 children: primaryChildren 26106 }; 26107 var primaryChildFragment; 26108 var fallbackChildFragment; 26109 26110 if ((mode & ConcurrentMode) === NoMode && progressedPrimaryFragment !== null) { 26111 // In legacy mode, we commit the primary tree as if it successfully 26112 // completed, even though it's in an inconsistent state. 26113 primaryChildFragment = progressedPrimaryFragment; 26114 primaryChildFragment.childLanes = NoLanes; 26115 primaryChildFragment.pendingProps = primaryChildProps; 26116 26117 if ( workInProgress.mode & ProfileMode) { 26118 // Reset the durations from the first pass so they aren't included in the 26119 // final amounts. This seems counterintuitive, since we're intentionally 26120 // not measuring part of the render phase, but this makes it match what we 26121 // do in Concurrent Mode. 26122 primaryChildFragment.actualDuration = 0; 26123 primaryChildFragment.actualStartTime = -1; 26124 primaryChildFragment.selfBaseDuration = 0; 26125 primaryChildFragment.treeBaseDuration = 0; 26126 } 26127 26128 fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null); 26129 } else { 26130 primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, mode); 26131 fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null); 26132 } 26133 26134 primaryChildFragment.return = workInProgress; 26135 fallbackChildFragment.return = workInProgress; 26136 primaryChildFragment.sibling = fallbackChildFragment; 26137 workInProgress.child = primaryChildFragment; 26138 return fallbackChildFragment; 26139} 26140 26141function mountWorkInProgressOffscreenFiber(offscreenProps, mode, renderLanes) { 26142 // The props argument to `createFiberFromOffscreen` is `any` typed, so we use 26143 // this wrapper function to constrain it. 26144 return createFiberFromOffscreen(offscreenProps, mode, NoLanes, null); 26145} 26146 26147function updateWorkInProgressOffscreenFiber(current, offscreenProps) { 26148 // The props argument to `createWorkInProgress` is `any` typed, so we use this 26149 // wrapper function to constrain it. 26150 return createWorkInProgress(current, offscreenProps); 26151} 26152 26153function updateSuspensePrimaryChildren(current, workInProgress, primaryChildren, renderLanes) { 26154 var currentPrimaryChildFragment = current.child; 26155 var currentFallbackChildFragment = currentPrimaryChildFragment.sibling; 26156 var primaryChildFragment = updateWorkInProgressOffscreenFiber(currentPrimaryChildFragment, { 26157 mode: 'visible', 26158 children: primaryChildren 26159 }); 26160 26161 if ((workInProgress.mode & ConcurrentMode) === NoMode) { 26162 primaryChildFragment.lanes = renderLanes; 26163 } 26164 26165 primaryChildFragment.return = workInProgress; 26166 primaryChildFragment.sibling = null; 26167 26168 if (currentFallbackChildFragment !== null) { 26169 // Delete the fallback child fragment 26170 var deletions = workInProgress.deletions; 26171 26172 if (deletions === null) { 26173 workInProgress.deletions = [currentFallbackChildFragment]; 26174 workInProgress.flags |= ChildDeletion; 26175 } else { 26176 deletions.push(currentFallbackChildFragment); 26177 } 26178 } 26179 26180 workInProgress.child = primaryChildFragment; 26181 return primaryChildFragment; 26182} 26183 26184function updateSuspenseFallbackChildren(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) { 26185 var mode = workInProgress.mode; 26186 var currentPrimaryChildFragment = current.child; 26187 var currentFallbackChildFragment = currentPrimaryChildFragment.sibling; 26188 var primaryChildProps = { 26189 mode: 'hidden', 26190 children: primaryChildren 26191 }; 26192 var primaryChildFragment; 26193 26194 if ( // In legacy mode, we commit the primary tree as if it successfully 26195 // completed, even though it's in an inconsistent state. 26196 (mode & ConcurrentMode) === NoMode && // Make sure we're on the second pass, i.e. the primary child fragment was 26197 // already cloned. In legacy mode, the only case where this isn't true is 26198 // when DevTools forces us to display a fallback; we skip the first render 26199 // pass entirely and go straight to rendering the fallback. (In Concurrent 26200 // Mode, SuspenseList can also trigger this scenario, but this is a legacy- 26201 // only codepath.) 26202 workInProgress.child !== currentPrimaryChildFragment) { 26203 var progressedPrimaryFragment = workInProgress.child; 26204 primaryChildFragment = progressedPrimaryFragment; 26205 primaryChildFragment.childLanes = NoLanes; 26206 primaryChildFragment.pendingProps = primaryChildProps; 26207 26208 if ( workInProgress.mode & ProfileMode) { 26209 // Reset the durations from the first pass so they aren't included in the 26210 // final amounts. This seems counterintuitive, since we're intentionally 26211 // not measuring part of the render phase, but this makes it match what we 26212 // do in Concurrent Mode. 26213 primaryChildFragment.actualDuration = 0; 26214 primaryChildFragment.actualStartTime = -1; 26215 primaryChildFragment.selfBaseDuration = currentPrimaryChildFragment.selfBaseDuration; 26216 primaryChildFragment.treeBaseDuration = currentPrimaryChildFragment.treeBaseDuration; 26217 } // The fallback fiber was added as a deletion during the first pass. 26218 // However, since we're going to remain on the fallback, we no longer want 26219 // to delete it. 26220 26221 26222 workInProgress.deletions = null; 26223 } else { 26224 primaryChildFragment = updateWorkInProgressOffscreenFiber(currentPrimaryChildFragment, primaryChildProps); // Since we're reusing a current tree, we need to reuse the flags, too. 26225 // (We don't do this in legacy mode, because in legacy mode we don't re-use 26226 // the current tree; see previous branch.) 26227 26228 primaryChildFragment.subtreeFlags = currentPrimaryChildFragment.subtreeFlags & StaticMask; 26229 } 26230 26231 var fallbackChildFragment; 26232 26233 if (currentFallbackChildFragment !== null) { 26234 fallbackChildFragment = createWorkInProgress(currentFallbackChildFragment, fallbackChildren); 26235 } else { 26236 fallbackChildFragment = createFiberFromFragment(fallbackChildren, mode, renderLanes, null); // Needs a placement effect because the parent (the Suspense boundary) already 26237 // mounted but this is a new fiber. 26238 26239 fallbackChildFragment.flags |= Placement; 26240 } 26241 26242 fallbackChildFragment.return = workInProgress; 26243 primaryChildFragment.return = workInProgress; 26244 primaryChildFragment.sibling = fallbackChildFragment; 26245 workInProgress.child = primaryChildFragment; 26246 return fallbackChildFragment; 26247} 26248 26249function retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, recoverableError) { 26250 // Falling back to client rendering. Because this has performance 26251 // implications, it's considered a recoverable error, even though the user 26252 // likely won't observe anything wrong with the UI. 26253 // 26254 // The error is passed in as an argument to enforce that every caller provide 26255 // a custom message, or explicitly opt out (currently the only path that opts 26256 // out is legacy mode; every concurrent path provides an error). 26257 if (recoverableError !== null) { 26258 queueHydrationError(recoverableError); 26259 } // This will add the old fiber to the deletion list 26260 26261 26262 reconcileChildFibers(workInProgress, current.child, null, renderLanes); // We're now not suspended nor dehydrated. 26263 26264 var nextProps = workInProgress.pendingProps; 26265 var primaryChildren = nextProps.children; 26266 var primaryChildFragment = mountSuspensePrimaryChildren(workInProgress, primaryChildren); // Needs a placement effect because the parent (the Suspense boundary) already 26267 // mounted but this is a new fiber. 26268 26269 primaryChildFragment.flags |= Placement; 26270 workInProgress.memoizedState = null; 26271 return primaryChildFragment; 26272} 26273 26274function mountSuspenseFallbackAfterRetryWithoutHydrating(current, workInProgress, primaryChildren, fallbackChildren, renderLanes) { 26275 var fiberMode = workInProgress.mode; 26276 var primaryChildProps = { 26277 mode: 'visible', 26278 children: primaryChildren 26279 }; 26280 var primaryChildFragment = mountWorkInProgressOffscreenFiber(primaryChildProps, fiberMode); 26281 var fallbackChildFragment = createFiberFromFragment(fallbackChildren, fiberMode, renderLanes, null); // Needs a placement effect because the parent (the Suspense 26282 // boundary) already mounted but this is a new fiber. 26283 26284 fallbackChildFragment.flags |= Placement; 26285 primaryChildFragment.return = workInProgress; 26286 fallbackChildFragment.return = workInProgress; 26287 primaryChildFragment.sibling = fallbackChildFragment; 26288 workInProgress.child = primaryChildFragment; 26289 26290 if ((workInProgress.mode & ConcurrentMode) !== NoMode) { 26291 // We will have dropped the effect list which contains the 26292 // deletion. We need to reconcile to delete the current child. 26293 reconcileChildFibers(workInProgress, current.child, null, renderLanes); 26294 } 26295 26296 return fallbackChildFragment; 26297} 26298 26299function mountDehydratedSuspenseComponent(workInProgress, suspenseInstance, renderLanes) { 26300 // During the first pass, we'll bail out and not drill into the children. 26301 // Instead, we'll leave the content in place and try to hydrate it later. 26302 if ((workInProgress.mode & ConcurrentMode) === NoMode) { 26303 { 26304 error('Cannot hydrate Suspense in legacy mode. Switch from ' + 'ReactDOM.hydrate(element, container) to ' + 'ReactDOMClient.hydrateRoot(container, <App />)' + '.render(element) or remove the Suspense components from ' + 'the server rendered components.'); 26305 } 26306 26307 workInProgress.lanes = laneToLanes(SyncLane); 26308 } else if (isSuspenseInstanceFallback(suspenseInstance)) { 26309 // This is a client-only boundary. Since we won't get any content from the server 26310 // for this, we need to schedule that at a higher priority based on when it would 26311 // have timed out. In theory we could render it in this pass but it would have the 26312 // wrong priority associated with it and will prevent hydration of parent path. 26313 // Instead, we'll leave work left on it to render it in a separate commit. 26314 // TODO This time should be the time at which the server rendered response that is 26315 // a parent to this boundary was displayed. However, since we currently don't have 26316 // a protocol to transfer that time, we'll just estimate it by using the current 26317 // time. This will mean that Suspense timeouts are slightly shifted to later than 26318 // they should be. 26319 // Schedule a normal pri update to render this content. 26320 workInProgress.lanes = laneToLanes(DefaultHydrationLane); 26321 } else { 26322 // We'll continue hydrating the rest at offscreen priority since we'll already 26323 // be showing the right content coming from the server, it is no rush. 26324 workInProgress.lanes = laneToLanes(OffscreenLane); 26325 } 26326 26327 return null; 26328} 26329 26330function updateDehydratedSuspenseComponent(current, workInProgress, didSuspend, nextProps, suspenseInstance, suspenseState, renderLanes) { 26331 if (!didSuspend) { 26332 // This is the first render pass. Attempt to hydrate. 26333 // We should never be hydrating at this point because it is the first pass, 26334 // but after we've already committed once. 26335 warnIfHydrating(); 26336 26337 if ((workInProgress.mode & ConcurrentMode) === NoMode) { 26338 return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, // TODO: When we delete legacy mode, we should make this error argument 26339 // required — every concurrent mode path that causes hydration to 26340 // de-opt to client rendering should have an error message. 26341 null); 26342 } 26343 26344 if (isSuspenseInstanceFallback(suspenseInstance)) { 26345 // This boundary is in a permanent fallback state. In this case, we'll never 26346 // get an update and we'll never be able to hydrate the final content. Let's just try the 26347 // client side render instead. 26348 var digest, message, stack; 26349 26350 { 26351 var _getSuspenseInstanceF = getSuspenseInstanceFallbackErrorDetails(suspenseInstance); 26352 26353 digest = _getSuspenseInstanceF.digest; 26354 message = _getSuspenseInstanceF.message; 26355 stack = _getSuspenseInstanceF.stack; 26356 } 26357 26358 var error; 26359 26360 if (message) { 26361 // eslint-disable-next-line react-internal/prod-error-codes 26362 error = new Error(message); 26363 } else { 26364 error = new Error('The server could not finish this Suspense boundary, likely ' + 'due to an error during server rendering. Switched to ' + 'client rendering.'); 26365 } 26366 26367 var capturedValue = createCapturedValue(error, digest, stack); 26368 return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, capturedValue); 26369 } 26370 // any context has changed, we need to treat is as if the input might have changed. 26371 26372 26373 var hasContextChanged = includesSomeLane(renderLanes, current.childLanes); 26374 26375 if (didReceiveUpdate || hasContextChanged) { 26376 // This boundary has changed since the first render. This means that we are now unable to 26377 // hydrate it. We might still be able to hydrate it using a higher priority lane. 26378 var root = getWorkInProgressRoot(); 26379 26380 if (root !== null) { 26381 var attemptHydrationAtLane = getBumpedLaneForHydration(root, renderLanes); 26382 26383 if (attemptHydrationAtLane !== NoLane && attemptHydrationAtLane !== suspenseState.retryLane) { 26384 // Intentionally mutating since this render will get interrupted. This 26385 // is one of the very rare times where we mutate the current tree 26386 // during the render phase. 26387 suspenseState.retryLane = attemptHydrationAtLane; // TODO: Ideally this would inherit the event time of the current render 26388 26389 var eventTime = NoTimestamp; 26390 enqueueConcurrentRenderForLane(current, attemptHydrationAtLane); 26391 scheduleUpdateOnFiber(root, current, attemptHydrationAtLane, eventTime); 26392 } 26393 } // If we have scheduled higher pri work above, this will probably just abort the render 26394 // since we now have higher priority work, but in case it doesn't, we need to prepare to 26395 // render something, if we time out. Even if that requires us to delete everything and 26396 // skip hydration. 26397 // Delay having to do this as long as the suspense timeout allows us. 26398 26399 26400 renderDidSuspendDelayIfPossible(); 26401 26402 var _capturedValue = createCapturedValue(new Error('This Suspense boundary received an update before it finished ' + 'hydrating. This caused the boundary to switch to client rendering. ' + 'The usual way to fix this is to wrap the original update ' + 'in startTransition.')); 26403 26404 return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, _capturedValue); 26405 } else if (isSuspenseInstancePending(suspenseInstance)) { 26406 // This component is still pending more data from the server, so we can't hydrate its 26407 // content. We treat it as if this component suspended itself. It might seem as if 26408 // we could just try to render it client-side instead. However, this will perform a 26409 // lot of unnecessary work and is unlikely to complete since it often will suspend 26410 // on missing data anyway. Additionally, the server might be able to render more 26411 // than we can on the client yet. In that case we'd end up with more fallback states 26412 // on the client than if we just leave it alone. If the server times out or errors 26413 // these should update this boundary to the permanent Fallback state instead. 26414 // Mark it as having captured (i.e. suspended). 26415 workInProgress.flags |= DidCapture; // Leave the child in place. I.e. the dehydrated fragment. 26416 26417 workInProgress.child = current.child; // Register a callback to retry this boundary once the server has sent the result. 26418 26419 var retry = retryDehydratedSuspenseBoundary.bind(null, current); 26420 registerSuspenseInstanceRetry(suspenseInstance, retry); 26421 return null; 26422 } else { 26423 // This is the first attempt. 26424 reenterHydrationStateFromDehydratedSuspenseInstance(workInProgress, suspenseInstance, suspenseState.treeContext); 26425 var primaryChildren = nextProps.children; 26426 var primaryChildFragment = mountSuspensePrimaryChildren(workInProgress, primaryChildren); // Mark the children as hydrating. This is a fast path to know whether this 26427 // tree is part of a hydrating tree. This is used to determine if a child 26428 // node has fully mounted yet, and for scheduling event replaying. 26429 // Conceptually this is similar to Placement in that a new subtree is 26430 // inserted into the React tree here. It just happens to not need DOM 26431 // mutations because it already exists. 26432 26433 primaryChildFragment.flags |= Hydrating; 26434 return primaryChildFragment; 26435 } 26436 } else { 26437 // This is the second render pass. We already attempted to hydrated, but 26438 // something either suspended or errored. 26439 if (workInProgress.flags & ForceClientRender) { 26440 // Something errored during hydration. Try again without hydrating. 26441 workInProgress.flags &= ~ForceClientRender; 26442 26443 var _capturedValue2 = createCapturedValue(new Error('There was an error while hydrating this Suspense boundary. ' + 'Switched to client rendering.')); 26444 26445 return retrySuspenseComponentWithoutHydrating(current, workInProgress, renderLanes, _capturedValue2); 26446 } else if (workInProgress.memoizedState !== null) { 26447 // Something suspended and we should still be in dehydrated mode. 26448 // Leave the existing child in place. 26449 workInProgress.child = current.child; // The dehydrated completion pass expects this flag to be there 26450 // but the normal suspense pass doesn't. 26451 26452 workInProgress.flags |= DidCapture; 26453 return null; 26454 } else { 26455 // Suspended but we should no longer be in dehydrated mode. 26456 // Therefore we now have to render the fallback. 26457 var nextPrimaryChildren = nextProps.children; 26458 var nextFallbackChildren = nextProps.fallback; 26459 var fallbackChildFragment = mountSuspenseFallbackAfterRetryWithoutHydrating(current, workInProgress, nextPrimaryChildren, nextFallbackChildren, renderLanes); 26460 var _primaryChildFragment4 = workInProgress.child; 26461 _primaryChildFragment4.memoizedState = mountSuspenseOffscreenState(renderLanes); 26462 workInProgress.memoizedState = SUSPENDED_MARKER; 26463 return fallbackChildFragment; 26464 } 26465 } 26466} 26467 26468function scheduleSuspenseWorkOnFiber(fiber, renderLanes, propagationRoot) { 26469 fiber.lanes = mergeLanes(fiber.lanes, renderLanes); 26470 var alternate = fiber.alternate; 26471 26472 if (alternate !== null) { 26473 alternate.lanes = mergeLanes(alternate.lanes, renderLanes); 26474 } 26475 26476 scheduleContextWorkOnParentPath(fiber.return, renderLanes, propagationRoot); 26477} 26478 26479function propagateSuspenseContextChange(workInProgress, firstChild, renderLanes) { 26480 // Mark any Suspense boundaries with fallbacks as having work to do. 26481 // If they were previously forced into fallbacks, they may now be able 26482 // to unblock. 26483 var node = firstChild; 26484 26485 while (node !== null) { 26486 if (node.tag === SuspenseComponent) { 26487 var state = node.memoizedState; 26488 26489 if (state !== null) { 26490 scheduleSuspenseWorkOnFiber(node, renderLanes, workInProgress); 26491 } 26492 } else if (node.tag === SuspenseListComponent) { 26493 // If the tail is hidden there might not be an Suspense boundaries 26494 // to schedule work on. In this case we have to schedule it on the 26495 // list itself. 26496 // We don't have to traverse to the children of the list since 26497 // the list will propagate the change when it rerenders. 26498 scheduleSuspenseWorkOnFiber(node, renderLanes, workInProgress); 26499 } else if (node.child !== null) { 26500 node.child.return = node; 26501 node = node.child; 26502 continue; 26503 } 26504 26505 if (node === workInProgress) { 26506 return; 26507 } 26508 26509 while (node.sibling === null) { 26510 if (node.return === null || node.return === workInProgress) { 26511 return; 26512 } 26513 26514 node = node.return; 26515 } 26516 26517 node.sibling.return = node.return; 26518 node = node.sibling; 26519 } 26520} 26521 26522function findLastContentRow(firstChild) { 26523 // This is going to find the last row among these children that is already 26524 // showing content on the screen, as opposed to being in fallback state or 26525 // new. If a row has multiple Suspense boundaries, any of them being in the 26526 // fallback state, counts as the whole row being in a fallback state. 26527 // Note that the "rows" will be workInProgress, but any nested children 26528 // will still be current since we haven't rendered them yet. The mounted 26529 // order may not be the same as the new order. We use the new order. 26530 var row = firstChild; 26531 var lastContentRow = null; 26532 26533 while (row !== null) { 26534 var currentRow = row.alternate; // New rows can't be content rows. 26535 26536 if (currentRow !== null && findFirstSuspended(currentRow) === null) { 26537 lastContentRow = row; 26538 } 26539 26540 row = row.sibling; 26541 } 26542 26543 return lastContentRow; 26544} 26545 26546function validateRevealOrder(revealOrder) { 26547 { 26548 if (revealOrder !== undefined && revealOrder !== 'forwards' && revealOrder !== 'backwards' && revealOrder !== 'together' && !didWarnAboutRevealOrder[revealOrder]) { 26549 didWarnAboutRevealOrder[revealOrder] = true; 26550 26551 if (typeof revealOrder === 'string') { 26552 switch (revealOrder.toLowerCase()) { 26553 case 'together': 26554 case 'forwards': 26555 case 'backwards': 26556 { 26557 error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'Use lowercase "%s" instead.', revealOrder, revealOrder.toLowerCase()); 26558 26559 break; 26560 } 26561 26562 case 'forward': 26563 case 'backward': 26564 { 26565 error('"%s" is not a valid value for revealOrder on <SuspenseList />. ' + 'React uses the -s suffix in the spelling. Use "%ss" instead.', revealOrder, revealOrder.toLowerCase()); 26566 26567 break; 26568 } 26569 26570 default: 26571 error('"%s" is not a supported revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder); 26572 26573 break; 26574 } 26575 } else { 26576 error('%s is not a supported value for revealOrder on <SuspenseList />. ' + 'Did you mean "together", "forwards" or "backwards"?', revealOrder); 26577 } 26578 } 26579 } 26580} 26581 26582function validateTailOptions(tailMode, revealOrder) { 26583 { 26584 if (tailMode !== undefined && !didWarnAboutTailOptions[tailMode]) { 26585 if (tailMode !== 'collapsed' && tailMode !== 'hidden') { 26586 didWarnAboutTailOptions[tailMode] = true; 26587 26588 error('"%s" is not a supported value for tail on <SuspenseList />. ' + 'Did you mean "collapsed" or "hidden"?', tailMode); 26589 } else if (revealOrder !== 'forwards' && revealOrder !== 'backwards') { 26590 didWarnAboutTailOptions[tailMode] = true; 26591 26592 error('<SuspenseList tail="%s" /> is only valid if revealOrder is ' + '"forwards" or "backwards". ' + 'Did you mean to specify revealOrder="forwards"?', tailMode); 26593 } 26594 } 26595 } 26596} 26597 26598function validateSuspenseListNestedChild(childSlot, index) { 26599 { 26600 var isAnArray = isArray(childSlot); 26601 var isIterable = !isAnArray && typeof getIteratorFn(childSlot) === 'function'; 26602 26603 if (isAnArray || isIterable) { 26604 var type = isAnArray ? 'array' : 'iterable'; 26605 26606 error('A nested %s was passed to row #%s in <SuspenseList />. Wrap it in ' + 'an additional SuspenseList to configure its revealOrder: ' + '<SuspenseList revealOrder=...> ... ' + '<SuspenseList revealOrder=...>{%s}</SuspenseList> ... ' + '</SuspenseList>', type, index, type); 26607 26608 return false; 26609 } 26610 } 26611 26612 return true; 26613} 26614 26615function validateSuspenseListChildren(children, revealOrder) { 26616 { 26617 if ((revealOrder === 'forwards' || revealOrder === 'backwards') && children !== undefined && children !== null && children !== false) { 26618 if (isArray(children)) { 26619 for (var i = 0; i < children.length; i++) { 26620 if (!validateSuspenseListNestedChild(children[i], i)) { 26621 return; 26622 } 26623 } 26624 } else { 26625 var iteratorFn = getIteratorFn(children); 26626 26627 if (typeof iteratorFn === 'function') { 26628 var childrenIterator = iteratorFn.call(children); 26629 26630 if (childrenIterator) { 26631 var step = childrenIterator.next(); 26632 var _i = 0; 26633 26634 for (; !step.done; step = childrenIterator.next()) { 26635 if (!validateSuspenseListNestedChild(step.value, _i)) { 26636 return; 26637 } 26638 26639 _i++; 26640 } 26641 } 26642 } else { 26643 error('A single row was passed to a <SuspenseList revealOrder="%s" />. ' + 'This is not useful since it needs multiple rows. ' + 'Did you mean to pass multiple children or an array?', revealOrder); 26644 } 26645 } 26646 } 26647 } 26648} 26649 26650function initSuspenseListRenderState(workInProgress, isBackwards, tail, lastContentRow, tailMode) { 26651 var renderState = workInProgress.memoizedState; 26652 26653 if (renderState === null) { 26654 workInProgress.memoizedState = { 26655 isBackwards: isBackwards, 26656 rendering: null, 26657 renderingStartTime: 0, 26658 last: lastContentRow, 26659 tail: tail, 26660 tailMode: tailMode 26661 }; 26662 } else { 26663 // We can reuse the existing object from previous renders. 26664 renderState.isBackwards = isBackwards; 26665 renderState.rendering = null; 26666 renderState.renderingStartTime = 0; 26667 renderState.last = lastContentRow; 26668 renderState.tail = tail; 26669 renderState.tailMode = tailMode; 26670 } 26671} // This can end up rendering this component multiple passes. 26672// The first pass splits the children fibers into two sets. A head and tail. 26673// We first render the head. If anything is in fallback state, we do another 26674// pass through beginWork to rerender all children (including the tail) with 26675// the force suspend context. If the first render didn't have anything in 26676// in fallback state. Then we render each row in the tail one-by-one. 26677// That happens in the completeWork phase without going back to beginWork. 26678 26679 26680function updateSuspenseListComponent(current, workInProgress, renderLanes) { 26681 var nextProps = workInProgress.pendingProps; 26682 var revealOrder = nextProps.revealOrder; 26683 var tailMode = nextProps.tail; 26684 var newChildren = nextProps.children; 26685 validateRevealOrder(revealOrder); 26686 validateTailOptions(tailMode, revealOrder); 26687 validateSuspenseListChildren(newChildren, revealOrder); 26688 reconcileChildren(current, workInProgress, newChildren, renderLanes); 26689 var suspenseContext = suspenseStackCursor.current; 26690 var shouldForceFallback = hasSuspenseContext(suspenseContext, ForceSuspenseFallback); 26691 26692 if (shouldForceFallback) { 26693 suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback); 26694 workInProgress.flags |= DidCapture; 26695 } else { 26696 var didSuspendBefore = current !== null && (current.flags & DidCapture) !== NoFlags; 26697 26698 if (didSuspendBefore) { 26699 // If we previously forced a fallback, we need to schedule work 26700 // on any nested boundaries to let them know to try to render 26701 // again. This is the same as context updating. 26702 propagateSuspenseContextChange(workInProgress, workInProgress.child, renderLanes); 26703 } 26704 26705 suspenseContext = setDefaultShallowSuspenseContext(suspenseContext); 26706 } 26707 26708 pushSuspenseContext(workInProgress, suspenseContext); 26709 26710 if ((workInProgress.mode & ConcurrentMode) === NoMode) { 26711 // In legacy mode, SuspenseList doesn't work so we just 26712 // use make it a noop by treating it as the default revealOrder. 26713 workInProgress.memoizedState = null; 26714 } else { 26715 switch (revealOrder) { 26716 case 'forwards': 26717 { 26718 var lastContentRow = findLastContentRow(workInProgress.child); 26719 var tail; 26720 26721 if (lastContentRow === null) { 26722 // The whole list is part of the tail. 26723 // TODO: We could fast path by just rendering the tail now. 26724 tail = workInProgress.child; 26725 workInProgress.child = null; 26726 } else { 26727 // Disconnect the tail rows after the content row. 26728 // We're going to render them separately later. 26729 tail = lastContentRow.sibling; 26730 lastContentRow.sibling = null; 26731 } 26732 26733 initSuspenseListRenderState(workInProgress, false, // isBackwards 26734 tail, lastContentRow, tailMode); 26735 break; 26736 } 26737 26738 case 'backwards': 26739 { 26740 // We're going to find the first row that has existing content. 26741 // At the same time we're going to reverse the list of everything 26742 // we pass in the meantime. That's going to be our tail in reverse 26743 // order. 26744 var _tail = null; 26745 var row = workInProgress.child; 26746 workInProgress.child = null; 26747 26748 while (row !== null) { 26749 var currentRow = row.alternate; // New rows can't be content rows. 26750 26751 if (currentRow !== null && findFirstSuspended(currentRow) === null) { 26752 // This is the beginning of the main content. 26753 workInProgress.child = row; 26754 break; 26755 } 26756 26757 var nextRow = row.sibling; 26758 row.sibling = _tail; 26759 _tail = row; 26760 row = nextRow; 26761 } // TODO: If workInProgress.child is null, we can continue on the tail immediately. 26762 26763 26764 initSuspenseListRenderState(workInProgress, true, // isBackwards 26765 _tail, null, // last 26766 tailMode); 26767 break; 26768 } 26769 26770 case 'together': 26771 { 26772 initSuspenseListRenderState(workInProgress, false, // isBackwards 26773 null, // tail 26774 null, // last 26775 undefined); 26776 break; 26777 } 26778 26779 default: 26780 { 26781 // The default reveal order is the same as not having 26782 // a boundary. 26783 workInProgress.memoizedState = null; 26784 } 26785 } 26786 } 26787 26788 return workInProgress.child; 26789} 26790 26791function updatePortalComponent(current, workInProgress, renderLanes) { 26792 pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo); 26793 var nextChildren = workInProgress.pendingProps; 26794 26795 if (current === null) { 26796 // Portals are special because we don't append the children during mount 26797 // but at commit. Therefore we need to track insertions which the normal 26798 // flow doesn't do during mount. This doesn't happen at the root because 26799 // the root always starts with a "current" with a null child. 26800 // TODO: Consider unifying this with how the root works. 26801 workInProgress.child = reconcileChildFibers(workInProgress, null, nextChildren, renderLanes); 26802 } else { 26803 reconcileChildren(current, workInProgress, nextChildren, renderLanes); 26804 } 26805 26806 return workInProgress.child; 26807} 26808 26809var hasWarnedAboutUsingNoValuePropOnContextProvider = false; 26810 26811function updateContextProvider(current, workInProgress, renderLanes) { 26812 var providerType = workInProgress.type; 26813 var context = providerType._context; 26814 var newProps = workInProgress.pendingProps; 26815 var oldProps = workInProgress.memoizedProps; 26816 var newValue = newProps.value; 26817 26818 { 26819 if (!('value' in newProps)) { 26820 if (!hasWarnedAboutUsingNoValuePropOnContextProvider) { 26821 hasWarnedAboutUsingNoValuePropOnContextProvider = true; 26822 26823 error('The `value` prop is required for the `<Context.Provider>`. Did you misspell it or forget to pass it?'); 26824 } 26825 } 26826 26827 var providerPropTypes = workInProgress.type.propTypes; 26828 26829 if (providerPropTypes) { 26830 checkPropTypes(providerPropTypes, newProps, 'prop', 'Context.Provider'); 26831 } 26832 } 26833 26834 pushProvider(workInProgress, context, newValue); 26835 26836 { 26837 if (oldProps !== null) { 26838 var oldValue = oldProps.value; 26839 26840 if (objectIs(oldValue, newValue)) { 26841 // No change. Bailout early if children are the same. 26842 if (oldProps.children === newProps.children && !hasContextChanged()) { 26843 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 26844 } 26845 } else { 26846 // The context value changed. Search for matching consumers and schedule 26847 // them to update. 26848 propagateContextChange(workInProgress, context, renderLanes); 26849 } 26850 } 26851 } 26852 26853 var newChildren = newProps.children; 26854 reconcileChildren(current, workInProgress, newChildren, renderLanes); 26855 return workInProgress.child; 26856} 26857 26858var hasWarnedAboutUsingContextAsConsumer = false; 26859 26860function updateContextConsumer(current, workInProgress, renderLanes) { 26861 var context = workInProgress.type; // The logic below for Context differs depending on PROD or DEV mode. In 26862 // DEV mode, we create a separate object for Context.Consumer that acts 26863 // like a proxy to Context. This proxy object adds unnecessary code in PROD 26864 // so we use the old behaviour (Context.Consumer references Context) to 26865 // reduce size and overhead. The separate object references context via 26866 // a property called "_context", which also gives us the ability to check 26867 // in DEV mode if this property exists or not and warn if it does not. 26868 26869 { 26870 if (context._context === undefined) { 26871 // This may be because it's a Context (rather than a Consumer). 26872 // Or it may be because it's older React where they're the same thing. 26873 // We only want to warn if we're sure it's a new React. 26874 if (context !== context.Consumer) { 26875 if (!hasWarnedAboutUsingContextAsConsumer) { 26876 hasWarnedAboutUsingContextAsConsumer = true; 26877 26878 error('Rendering <Context> directly is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?'); 26879 } 26880 } 26881 } else { 26882 context = context._context; 26883 } 26884 } 26885 26886 var newProps = workInProgress.pendingProps; 26887 var render = newProps.children; 26888 26889 { 26890 if (typeof render !== 'function') { 26891 error('A context consumer was rendered with multiple children, or a child ' + "that isn't a function. A context consumer expects a single child " + 'that is a function. If you did pass a function, make sure there ' + 'is no trailing or leading whitespace around it.'); 26892 } 26893 } 26894 26895 prepareToReadContext(workInProgress, renderLanes); 26896 var newValue = readContext(context); 26897 26898 { 26899 markComponentRenderStarted(workInProgress); 26900 } 26901 26902 var newChildren; 26903 26904 { 26905 ReactCurrentOwner$1.current = workInProgress; 26906 setIsRendering(true); 26907 newChildren = render(newValue); 26908 setIsRendering(false); 26909 } 26910 26911 { 26912 markComponentRenderStopped(); 26913 } // React DevTools reads this flag. 26914 26915 26916 workInProgress.flags |= PerformedWork; 26917 reconcileChildren(current, workInProgress, newChildren, renderLanes); 26918 return workInProgress.child; 26919} 26920 26921function markWorkInProgressReceivedUpdate() { 26922 didReceiveUpdate = true; 26923} 26924 26925function resetSuspendedCurrentOnMountInLegacyMode(current, workInProgress) { 26926 if ((workInProgress.mode & ConcurrentMode) === NoMode) { 26927 if (current !== null) { 26928 // A lazy component only mounts if it suspended inside a non- 26929 // concurrent tree, in an inconsistent state. We want to treat it like 26930 // a new mount, even though an empty version of it already committed. 26931 // Disconnect the alternate pointers. 26932 current.alternate = null; 26933 workInProgress.alternate = null; // Since this is conceptually a new fiber, schedule a Placement effect 26934 26935 workInProgress.flags |= Placement; 26936 } 26937 } 26938} 26939 26940function bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes) { 26941 if (current !== null) { 26942 // Reuse previous dependencies 26943 workInProgress.dependencies = current.dependencies; 26944 } 26945 26946 { 26947 // Don't update "base" render times for bailouts. 26948 stopProfilerTimerIfRunning(); 26949 } 26950 26951 markSkippedUpdateLanes(workInProgress.lanes); // Check if the children have any pending work. 26952 26953 if (!includesSomeLane(renderLanes, workInProgress.childLanes)) { 26954 // The children don't have any work either. We can skip them. 26955 // TODO: Once we add back resuming, we should check if the children are 26956 // a work-in-progress set. If so, we need to transfer their effects. 26957 { 26958 return null; 26959 } 26960 } // This fiber doesn't have work, but its subtree does. Clone the child 26961 // fibers and continue. 26962 26963 26964 cloneChildFibers(current, workInProgress); 26965 return workInProgress.child; 26966} 26967 26968function remountFiber(current, oldWorkInProgress, newWorkInProgress) { 26969 { 26970 var returnFiber = oldWorkInProgress.return; 26971 26972 if (returnFiber === null) { 26973 // eslint-disable-next-line react-internal/prod-error-codes 26974 throw new Error('Cannot swap the root fiber.'); 26975 } // Disconnect from the old current. 26976 // It will get deleted. 26977 26978 26979 current.alternate = null; 26980 oldWorkInProgress.alternate = null; // Connect to the new tree. 26981 26982 newWorkInProgress.index = oldWorkInProgress.index; 26983 newWorkInProgress.sibling = oldWorkInProgress.sibling; 26984 newWorkInProgress.return = oldWorkInProgress.return; 26985 newWorkInProgress.ref = oldWorkInProgress.ref; // Replace the child/sibling pointers above it. 26986 26987 if (oldWorkInProgress === returnFiber.child) { 26988 returnFiber.child = newWorkInProgress; 26989 } else { 26990 var prevSibling = returnFiber.child; 26991 26992 if (prevSibling === null) { 26993 // eslint-disable-next-line react-internal/prod-error-codes 26994 throw new Error('Expected parent to have a child.'); 26995 } 26996 26997 while (prevSibling.sibling !== oldWorkInProgress) { 26998 prevSibling = prevSibling.sibling; 26999 27000 if (prevSibling === null) { 27001 // eslint-disable-next-line react-internal/prod-error-codes 27002 throw new Error('Expected to find the previous sibling.'); 27003 } 27004 } 27005 27006 prevSibling.sibling = newWorkInProgress; 27007 } // Delete the old fiber and place the new one. 27008 // Since the old fiber is disconnected, we have to schedule it manually. 27009 27010 27011 var deletions = returnFiber.deletions; 27012 27013 if (deletions === null) { 27014 returnFiber.deletions = [current]; 27015 returnFiber.flags |= ChildDeletion; 27016 } else { 27017 deletions.push(current); 27018 } 27019 27020 newWorkInProgress.flags |= Placement; // Restart work from the new fiber. 27021 27022 return newWorkInProgress; 27023 } 27024} 27025 27026function checkScheduledUpdateOrContext(current, renderLanes) { 27027 // Before performing an early bailout, we must check if there are pending 27028 // updates or context. 27029 var updateLanes = current.lanes; 27030 27031 if (includesSomeLane(updateLanes, renderLanes)) { 27032 return true; 27033 } // No pending update, but because context is propagated lazily, we need 27034 27035 return false; 27036} 27037 27038function attemptEarlyBailoutIfNoScheduledUpdate(current, workInProgress, renderLanes) { 27039 // This fiber does not have any pending work. Bailout without entering 27040 // the begin phase. There's still some bookkeeping we that needs to be done 27041 // in this optimized path, mostly pushing stuff onto the stack. 27042 switch (workInProgress.tag) { 27043 case HostRoot: 27044 pushHostRootContext(workInProgress); 27045 var root = workInProgress.stateNode; 27046 27047 resetHydrationState(); 27048 break; 27049 27050 case HostComponent: 27051 pushHostContext(workInProgress); 27052 break; 27053 27054 case ClassComponent: 27055 { 27056 var Component = workInProgress.type; 27057 27058 if (isContextProvider(Component)) { 27059 pushContextProvider(workInProgress); 27060 } 27061 27062 break; 27063 } 27064 27065 case HostPortal: 27066 pushHostContainer(workInProgress, workInProgress.stateNode.containerInfo); 27067 break; 27068 27069 case ContextProvider: 27070 { 27071 var newValue = workInProgress.memoizedProps.value; 27072 var context = workInProgress.type._context; 27073 pushProvider(workInProgress, context, newValue); 27074 break; 27075 } 27076 27077 case Profiler: 27078 { 27079 // Profiler should only call onRender when one of its descendants actually rendered. 27080 var hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes); 27081 27082 if (hasChildWork) { 27083 workInProgress.flags |= Update; 27084 } 27085 27086 { 27087 // Reset effect durations for the next eventual effect phase. 27088 // These are reset during render to allow the DevTools commit hook a chance to read them, 27089 var stateNode = workInProgress.stateNode; 27090 stateNode.effectDuration = 0; 27091 stateNode.passiveEffectDuration = 0; 27092 } 27093 } 27094 27095 break; 27096 27097 case SuspenseComponent: 27098 { 27099 var state = workInProgress.memoizedState; 27100 27101 if (state !== null) { 27102 if (state.dehydrated !== null) { 27103 pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // We know that this component will suspend again because if it has 27104 // been unsuspended it has committed as a resolved Suspense component. 27105 // If it needs to be retried, it should have work scheduled on it. 27106 27107 workInProgress.flags |= DidCapture; // We should never render the children of a dehydrated boundary until we 27108 // upgrade it. We return null instead of bailoutOnAlreadyFinishedWork. 27109 27110 return null; 27111 } // If this boundary is currently timed out, we need to decide 27112 // whether to retry the primary children, or to skip over it and 27113 // go straight to the fallback. Check the priority of the primary 27114 // child fragment. 27115 27116 27117 var primaryChildFragment = workInProgress.child; 27118 var primaryChildLanes = primaryChildFragment.childLanes; 27119 27120 if (includesSomeLane(renderLanes, primaryChildLanes)) { 27121 // The primary children have pending work. Use the normal path 27122 // to attempt to render the primary children again. 27123 return updateSuspenseComponent(current, workInProgress, renderLanes); 27124 } else { 27125 // The primary child fragment does not have pending work marked 27126 // on it 27127 pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); // The primary children do not have pending work with sufficient 27128 // priority. Bailout. 27129 27130 var child = bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 27131 27132 if (child !== null) { 27133 // The fallback children have pending work. Skip over the 27134 // primary children and work on the fallback. 27135 return child.sibling; 27136 } else { 27137 // Note: We can return `null` here because we already checked 27138 // whether there were nested context consumers, via the call to 27139 // `bailoutOnAlreadyFinishedWork` above. 27140 return null; 27141 } 27142 } 27143 } else { 27144 pushSuspenseContext(workInProgress, setDefaultShallowSuspenseContext(suspenseStackCursor.current)); 27145 } 27146 27147 break; 27148 } 27149 27150 case SuspenseListComponent: 27151 { 27152 var didSuspendBefore = (current.flags & DidCapture) !== NoFlags; 27153 27154 var _hasChildWork = includesSomeLane(renderLanes, workInProgress.childLanes); 27155 27156 if (didSuspendBefore) { 27157 if (_hasChildWork) { 27158 // If something was in fallback state last time, and we have all the 27159 // same children then we're still in progressive loading state. 27160 // Something might get unblocked by state updates or retries in the 27161 // tree which will affect the tail. So we need to use the normal 27162 // path to compute the correct tail. 27163 return updateSuspenseListComponent(current, workInProgress, renderLanes); 27164 } // If none of the children had any work, that means that none of 27165 // them got retried so they'll still be blocked in the same way 27166 // as before. We can fast bail out. 27167 27168 27169 workInProgress.flags |= DidCapture; 27170 } // If nothing suspended before and we're rendering the same children, 27171 // then the tail doesn't matter. Anything new that suspends will work 27172 // in the "together" mode, so we can continue from the state we had. 27173 27174 27175 var renderState = workInProgress.memoizedState; 27176 27177 if (renderState !== null) { 27178 // Reset to the "together" mode in case we've started a different 27179 // update in the past but didn't complete it. 27180 renderState.rendering = null; 27181 renderState.tail = null; 27182 renderState.lastEffect = null; 27183 } 27184 27185 pushSuspenseContext(workInProgress, suspenseStackCursor.current); 27186 27187 if (_hasChildWork) { 27188 break; 27189 } else { 27190 // If none of the children had any work, that means that none of 27191 // them got retried so they'll still be blocked in the same way 27192 // as before. We can fast bail out. 27193 return null; 27194 } 27195 } 27196 27197 case OffscreenComponent: 27198 case LegacyHiddenComponent: 27199 { 27200 // Need to check if the tree still needs to be deferred. This is 27201 // almost identical to the logic used in the normal update path, 27202 // so we'll just enter that. The only difference is we'll bail out 27203 // at the next level instead of this one, because the child props 27204 // have not changed. Which is fine. 27205 // TODO: Probably should refactor `beginWork` to split the bailout 27206 // path from the normal path. I'm tempted to do a labeled break here 27207 // but I won't :) 27208 workInProgress.lanes = NoLanes; 27209 return updateOffscreenComponent(current, workInProgress, renderLanes); 27210 } 27211 } 27212 27213 return bailoutOnAlreadyFinishedWork(current, workInProgress, renderLanes); 27214} 27215 27216function beginWork(current, workInProgress, renderLanes) { 27217 { 27218 if (workInProgress._debugNeedsRemount && current !== null) { 27219 // This will restart the begin phase with a new fiber. 27220 return remountFiber(current, workInProgress, createFiberFromTypeAndProps(workInProgress.type, workInProgress.key, workInProgress.pendingProps, workInProgress._debugOwner || null, workInProgress.mode, workInProgress.lanes)); 27221 } 27222 } 27223 27224 if (current !== null) { 27225 var oldProps = current.memoizedProps; 27226 var newProps = workInProgress.pendingProps; 27227 27228 if (oldProps !== newProps || hasContextChanged() || ( // Force a re-render if the implementation changed due to hot reload: 27229 workInProgress.type !== current.type )) { 27230 // If props or context changed, mark the fiber as having performed work. 27231 // This may be unset if the props are determined to be equal later (memo). 27232 didReceiveUpdate = true; 27233 } else { 27234 // Neither props nor legacy context changes. Check if there's a pending 27235 // update or context change. 27236 var hasScheduledUpdateOrContext = checkScheduledUpdateOrContext(current, renderLanes); 27237 27238 if (!hasScheduledUpdateOrContext && // If this is the second pass of an error or suspense boundary, there 27239 // may not be work scheduled on `current`, so we check for this flag. 27240 (workInProgress.flags & DidCapture) === NoFlags) { 27241 // No pending updates or context. Bail out now. 27242 didReceiveUpdate = false; 27243 return attemptEarlyBailoutIfNoScheduledUpdate(current, workInProgress, renderLanes); 27244 } 27245 27246 if ((current.flags & ForceUpdateForLegacySuspense) !== NoFlags) { 27247 // This is a special case that only exists for legacy mode. 27248 // See https://github.com/facebook/react/pull/19216. 27249 didReceiveUpdate = true; 27250 } else { 27251 // An update was scheduled on this fiber, but there are no new props 27252 // nor legacy context. Set this to false. If an update queue or context 27253 // consumer produces a changed value, it will set this to true. Otherwise, 27254 // the component will assume the children have not changed and bail out. 27255 didReceiveUpdate = false; 27256 } 27257 } 27258 } else { 27259 didReceiveUpdate = false; 27260 27261 if (getIsHydrating() && isForkedChild(workInProgress)) { 27262 // Check if this child belongs to a list of muliple children in 27263 // its parent. 27264 // 27265 // In a true multi-threaded implementation, we would render children on 27266 // parallel threads. This would represent the beginning of a new render 27267 // thread for this subtree. 27268 // 27269 // We only use this for id generation during hydration, which is why the 27270 // logic is located in this special branch. 27271 var slotIndex = workInProgress.index; 27272 var numberOfForks = getForksAtLevel(); 27273 pushTreeId(workInProgress, numberOfForks, slotIndex); 27274 } 27275 } // Before entering the begin phase, clear pending update priority. 27276 // TODO: This assumes that we're about to evaluate the component and process 27277 // the update queue. However, there's an exception: SimpleMemoComponent 27278 // sometimes bails out later in the begin phase. This indicates that we should 27279 // move this assignment out of the common path and into each branch. 27280 27281 27282 workInProgress.lanes = NoLanes; 27283 27284 switch (workInProgress.tag) { 27285 case IndeterminateComponent: 27286 { 27287 return mountIndeterminateComponent(current, workInProgress, workInProgress.type, renderLanes); 27288 } 27289 27290 case LazyComponent: 27291 { 27292 var elementType = workInProgress.elementType; 27293 return mountLazyComponent(current, workInProgress, elementType, renderLanes); 27294 } 27295 27296 case FunctionComponent: 27297 { 27298 var Component = workInProgress.type; 27299 var unresolvedProps = workInProgress.pendingProps; 27300 var resolvedProps = workInProgress.elementType === Component ? unresolvedProps : resolveDefaultProps(Component, unresolvedProps); 27301 return updateFunctionComponent(current, workInProgress, Component, resolvedProps, renderLanes); 27302 } 27303 27304 case ClassComponent: 27305 { 27306 var _Component = workInProgress.type; 27307 var _unresolvedProps = workInProgress.pendingProps; 27308 27309 var _resolvedProps = workInProgress.elementType === _Component ? _unresolvedProps : resolveDefaultProps(_Component, _unresolvedProps); 27310 27311 return updateClassComponent(current, workInProgress, _Component, _resolvedProps, renderLanes); 27312 } 27313 27314 case HostRoot: 27315 return updateHostRoot(current, workInProgress, renderLanes); 27316 27317 case HostComponent: 27318 return updateHostComponent(current, workInProgress, renderLanes); 27319 27320 case HostText: 27321 return updateHostText(current, workInProgress); 27322 27323 case SuspenseComponent: 27324 return updateSuspenseComponent(current, workInProgress, renderLanes); 27325 27326 case HostPortal: 27327 return updatePortalComponent(current, workInProgress, renderLanes); 27328 27329 case ForwardRef: 27330 { 27331 var type = workInProgress.type; 27332 var _unresolvedProps2 = workInProgress.pendingProps; 27333 27334 var _resolvedProps2 = workInProgress.elementType === type ? _unresolvedProps2 : resolveDefaultProps(type, _unresolvedProps2); 27335 27336 return updateForwardRef(current, workInProgress, type, _resolvedProps2, renderLanes); 27337 } 27338 27339 case Fragment: 27340 return updateFragment(current, workInProgress, renderLanes); 27341 27342 case Mode: 27343 return updateMode(current, workInProgress, renderLanes); 27344 27345 case Profiler: 27346 return updateProfiler(current, workInProgress, renderLanes); 27347 27348 case ContextProvider: 27349 return updateContextProvider(current, workInProgress, renderLanes); 27350 27351 case ContextConsumer: 27352 return updateContextConsumer(current, workInProgress, renderLanes); 27353 27354 case MemoComponent: 27355 { 27356 var _type2 = workInProgress.type; 27357 var _unresolvedProps3 = workInProgress.pendingProps; // Resolve outer props first, then resolve inner props. 27358 27359 var _resolvedProps3 = resolveDefaultProps(_type2, _unresolvedProps3); 27360 27361 { 27362 if (workInProgress.type !== workInProgress.elementType) { 27363 var outerPropTypes = _type2.propTypes; 27364 27365 if (outerPropTypes) { 27366 checkPropTypes(outerPropTypes, _resolvedProps3, // Resolved for outer only 27367 'prop', getComponentNameFromType(_type2)); 27368 } 27369 } 27370 } 27371 27372 _resolvedProps3 = resolveDefaultProps(_type2.type, _resolvedProps3); 27373 return updateMemoComponent(current, workInProgress, _type2, _resolvedProps3, renderLanes); 27374 } 27375 27376 case SimpleMemoComponent: 27377 { 27378 return updateSimpleMemoComponent(current, workInProgress, workInProgress.type, workInProgress.pendingProps, renderLanes); 27379 } 27380 27381 case IncompleteClassComponent: 27382 { 27383 var _Component2 = workInProgress.type; 27384 var _unresolvedProps4 = workInProgress.pendingProps; 27385 27386 var _resolvedProps4 = workInProgress.elementType === _Component2 ? _unresolvedProps4 : resolveDefaultProps(_Component2, _unresolvedProps4); 27387 27388 return mountIncompleteClassComponent(current, workInProgress, _Component2, _resolvedProps4, renderLanes); 27389 } 27390 27391 case SuspenseListComponent: 27392 { 27393 return updateSuspenseListComponent(current, workInProgress, renderLanes); 27394 } 27395 27396 case ScopeComponent: 27397 { 27398 27399 break; 27400 } 27401 27402 case OffscreenComponent: 27403 { 27404 return updateOffscreenComponent(current, workInProgress, renderLanes); 27405 } 27406 } 27407 27408 throw new Error("Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in " + 'React. Please file an issue.'); 27409} 27410 27411function markUpdate(workInProgress) { 27412 // Tag the fiber with an update effect. This turns a Placement into 27413 // a PlacementAndUpdate. 27414 workInProgress.flags |= Update; 27415} 27416 27417function markRef$1(workInProgress) { 27418 workInProgress.flags |= Ref; 27419 27420 { 27421 workInProgress.flags |= RefStatic; 27422 } 27423} 27424 27425var appendAllChildren; 27426var updateHostContainer; 27427var updateHostComponent$1; 27428var updateHostText$1; 27429 27430{ 27431 // Mutation mode 27432 appendAllChildren = function (parent, workInProgress, needsVisibilityToggle, isHidden) { 27433 // We only have the top Fiber that was created but we need recurse down its 27434 // children to find all the terminal nodes. 27435 var node = workInProgress.child; 27436 27437 while (node !== null) { 27438 if (node.tag === HostComponent || node.tag === HostText) { 27439 appendInitialChild(parent, node.stateNode); 27440 } else if (node.tag === HostPortal) ; else if (node.child !== null) { 27441 node.child.return = node; 27442 node = node.child; 27443 continue; 27444 } 27445 27446 if (node === workInProgress) { 27447 return; 27448 } 27449 27450 while (node.sibling === null) { 27451 if (node.return === null || node.return === workInProgress) { 27452 return; 27453 } 27454 27455 node = node.return; 27456 } 27457 27458 node.sibling.return = node.return; 27459 node = node.sibling; 27460 } 27461 }; 27462 27463 updateHostContainer = function (current, workInProgress) {// Noop 27464 }; 27465 27466 updateHostComponent$1 = function (current, workInProgress, type, newProps, rootContainerInstance) { 27467 // If we have an alternate, that means this is an update and we need to 27468 // schedule a side-effect to do the updates. 27469 var oldProps = current.memoizedProps; 27470 27471 if (oldProps === newProps) { 27472 // In mutation mode, this is sufficient for a bailout because 27473 // we won't touch this node even if children changed. 27474 return; 27475 } // If we get updated because one of our children updated, we don't 27476 // have newProps so we'll have to reuse them. 27477 // TODO: Split the update API as separate for the props vs. children. 27478 // Even better would be if children weren't special cased at all tho. 27479 27480 27481 var instance = workInProgress.stateNode; 27482 var currentHostContext = getHostContext(); // TODO: Experiencing an error where oldProps is null. Suggests a host 27483 // component is hitting the resume path. Figure out why. Possibly 27484 // related to `hidden`. 27485 27486 var updatePayload = prepareUpdate(instance, type, oldProps, newProps, rootContainerInstance, currentHostContext); // TODO: Type this specific to this type of component. 27487 27488 workInProgress.updateQueue = updatePayload; // If the update payload indicates that there is a change or if there 27489 // is a new ref we mark this as an update. All the work is done in commitWork. 27490 27491 if (updatePayload) { 27492 markUpdate(workInProgress); 27493 } 27494 }; 27495 27496 updateHostText$1 = function (current, workInProgress, oldText, newText) { 27497 // If the text differs, mark it as an update. All the work in done in commitWork. 27498 if (oldText !== newText) { 27499 markUpdate(workInProgress); 27500 } 27501 }; 27502} 27503 27504function cutOffTailIfNeeded(renderState, hasRenderedATailFallback) { 27505 if (getIsHydrating()) { 27506 // If we're hydrating, we should consume as many items as we can 27507 // so we don't leave any behind. 27508 return; 27509 } 27510 27511 switch (renderState.tailMode) { 27512 case 'hidden': 27513 { 27514 // Any insertions at the end of the tail list after this point 27515 // should be invisible. If there are already mounted boundaries 27516 // anything before them are not considered for collapsing. 27517 // Therefore we need to go through the whole tail to find if 27518 // there are any. 27519 var tailNode = renderState.tail; 27520 var lastTailNode = null; 27521 27522 while (tailNode !== null) { 27523 if (tailNode.alternate !== null) { 27524 lastTailNode = tailNode; 27525 } 27526 27527 tailNode = tailNode.sibling; 27528 } // Next we're simply going to delete all insertions after the 27529 // last rendered item. 27530 27531 27532 if (lastTailNode === null) { 27533 // All remaining items in the tail are insertions. 27534 renderState.tail = null; 27535 } else { 27536 // Detach the insertion after the last node that was already 27537 // inserted. 27538 lastTailNode.sibling = null; 27539 } 27540 27541 break; 27542 } 27543 27544 case 'collapsed': 27545 { 27546 // Any insertions at the end of the tail list after this point 27547 // should be invisible. If there are already mounted boundaries 27548 // anything before them are not considered for collapsing. 27549 // Therefore we need to go through the whole tail to find if 27550 // there are any. 27551 var _tailNode = renderState.tail; 27552 var _lastTailNode = null; 27553 27554 while (_tailNode !== null) { 27555 if (_tailNode.alternate !== null) { 27556 _lastTailNode = _tailNode; 27557 } 27558 27559 _tailNode = _tailNode.sibling; 27560 } // Next we're simply going to delete all insertions after the 27561 // last rendered item. 27562 27563 27564 if (_lastTailNode === null) { 27565 // All remaining items in the tail are insertions. 27566 if (!hasRenderedATailFallback && renderState.tail !== null) { 27567 // We suspended during the head. We want to show at least one 27568 // row at the tail. So we'll keep on and cut off the rest. 27569 renderState.tail.sibling = null; 27570 } else { 27571 renderState.tail = null; 27572 } 27573 } else { 27574 // Detach the insertion after the last node that was already 27575 // inserted. 27576 _lastTailNode.sibling = null; 27577 } 27578 27579 break; 27580 } 27581 } 27582} 27583 27584function bubbleProperties(completedWork) { 27585 var didBailout = completedWork.alternate !== null && completedWork.alternate.child === completedWork.child; 27586 var newChildLanes = NoLanes; 27587 var subtreeFlags = NoFlags; 27588 27589 if (!didBailout) { 27590 // Bubble up the earliest expiration time. 27591 if ( (completedWork.mode & ProfileMode) !== NoMode) { 27592 // In profiling mode, resetChildExpirationTime is also used to reset 27593 // profiler durations. 27594 var actualDuration = completedWork.actualDuration; 27595 var treeBaseDuration = completedWork.selfBaseDuration; 27596 var child = completedWork.child; 27597 27598 while (child !== null) { 27599 newChildLanes = mergeLanes(newChildLanes, mergeLanes(child.lanes, child.childLanes)); 27600 subtreeFlags |= child.subtreeFlags; 27601 subtreeFlags |= child.flags; // When a fiber is cloned, its actualDuration is reset to 0. This value will 27602 // only be updated if work is done on the fiber (i.e. it doesn't bailout). 27603 // When work is done, it should bubble to the parent's actualDuration. If 27604 // the fiber has not been cloned though, (meaning no work was done), then 27605 // this value will reflect the amount of time spent working on a previous 27606 // render. In that case it should not bubble. We determine whether it was 27607 // cloned by comparing the child pointer. 27608 27609 actualDuration += child.actualDuration; 27610 treeBaseDuration += child.treeBaseDuration; 27611 child = child.sibling; 27612 } 27613 27614 completedWork.actualDuration = actualDuration; 27615 completedWork.treeBaseDuration = treeBaseDuration; 27616 } else { 27617 var _child = completedWork.child; 27618 27619 while (_child !== null) { 27620 newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child.lanes, _child.childLanes)); 27621 subtreeFlags |= _child.subtreeFlags; 27622 subtreeFlags |= _child.flags; // Update the return pointer so the tree is consistent. This is a code 27623 // smell because it assumes the commit phase is never concurrent with 27624 // the render phase. Will address during refactor to alternate model. 27625 27626 _child.return = completedWork; 27627 _child = _child.sibling; 27628 } 27629 } 27630 27631 completedWork.subtreeFlags |= subtreeFlags; 27632 } else { 27633 // Bubble up the earliest expiration time. 27634 if ( (completedWork.mode & ProfileMode) !== NoMode) { 27635 // In profiling mode, resetChildExpirationTime is also used to reset 27636 // profiler durations. 27637 var _treeBaseDuration = completedWork.selfBaseDuration; 27638 var _child2 = completedWork.child; 27639 27640 while (_child2 !== null) { 27641 newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child2.lanes, _child2.childLanes)); // "Static" flags share the lifetime of the fiber/hook they belong to, 27642 // so we should bubble those up even during a bailout. All the other 27643 // flags have a lifetime only of a single render + commit, so we should 27644 // ignore them. 27645 27646 subtreeFlags |= _child2.subtreeFlags & StaticMask; 27647 subtreeFlags |= _child2.flags & StaticMask; 27648 _treeBaseDuration += _child2.treeBaseDuration; 27649 _child2 = _child2.sibling; 27650 } 27651 27652 completedWork.treeBaseDuration = _treeBaseDuration; 27653 } else { 27654 var _child3 = completedWork.child; 27655 27656 while (_child3 !== null) { 27657 newChildLanes = mergeLanes(newChildLanes, mergeLanes(_child3.lanes, _child3.childLanes)); // "Static" flags share the lifetime of the fiber/hook they belong to, 27658 // so we should bubble those up even during a bailout. All the other 27659 // flags have a lifetime only of a single render + commit, so we should 27660 // ignore them. 27661 27662 subtreeFlags |= _child3.subtreeFlags & StaticMask; 27663 subtreeFlags |= _child3.flags & StaticMask; // Update the return pointer so the tree is consistent. This is a code 27664 // smell because it assumes the commit phase is never concurrent with 27665 // the render phase. Will address during refactor to alternate model. 27666 27667 _child3.return = completedWork; 27668 _child3 = _child3.sibling; 27669 } 27670 } 27671 27672 completedWork.subtreeFlags |= subtreeFlags; 27673 } 27674 27675 completedWork.childLanes = newChildLanes; 27676 return didBailout; 27677} 27678 27679function completeDehydratedSuspenseBoundary(current, workInProgress, nextState) { 27680 if (hasUnhydratedTailNodes() && (workInProgress.mode & ConcurrentMode) !== NoMode && (workInProgress.flags & DidCapture) === NoFlags) { 27681 warnIfUnhydratedTailNodes(workInProgress); 27682 resetHydrationState(); 27683 workInProgress.flags |= ForceClientRender | Incomplete | ShouldCapture; 27684 return false; 27685 } 27686 27687 var wasHydrated = popHydrationState(workInProgress); 27688 27689 if (nextState !== null && nextState.dehydrated !== null) { 27690 // We might be inside a hydration state the first time we're picking up this 27691 // Suspense boundary, and also after we've reentered it for further hydration. 27692 if (current === null) { 27693 if (!wasHydrated) { 27694 throw new Error('A dehydrated suspense component was completed without a hydrated node. ' + 'This is probably a bug in React.'); 27695 } 27696 27697 prepareToHydrateHostSuspenseInstance(workInProgress); 27698 bubbleProperties(workInProgress); 27699 27700 { 27701 if ((workInProgress.mode & ProfileMode) !== NoMode) { 27702 var isTimedOutSuspense = nextState !== null; 27703 27704 if (isTimedOutSuspense) { 27705 // Don't count time spent in a timed out Suspense subtree as part of the base duration. 27706 var primaryChildFragment = workInProgress.child; 27707 27708 if (primaryChildFragment !== null) { 27709 // $FlowFixMe Flow doesn't support type casting in combination with the -= operator 27710 workInProgress.treeBaseDuration -= primaryChildFragment.treeBaseDuration; 27711 } 27712 } 27713 } 27714 } 27715 27716 return false; 27717 } else { 27718 // We might have reentered this boundary to hydrate it. If so, we need to reset the hydration 27719 // state since we're now exiting out of it. popHydrationState doesn't do that for us. 27720 resetHydrationState(); 27721 27722 if ((workInProgress.flags & DidCapture) === NoFlags) { 27723 // This boundary did not suspend so it's now hydrated and unsuspended. 27724 workInProgress.memoizedState = null; 27725 } // If nothing suspended, we need to schedule an effect to mark this boundary 27726 // as having hydrated so events know that they're free to be invoked. 27727 // It's also a signal to replay events and the suspense callback. 27728 // If something suspended, schedule an effect to attach retry listeners. 27729 // So we might as well always mark this. 27730 27731 27732 workInProgress.flags |= Update; 27733 bubbleProperties(workInProgress); 27734 27735 { 27736 if ((workInProgress.mode & ProfileMode) !== NoMode) { 27737 var _isTimedOutSuspense = nextState !== null; 27738 27739 if (_isTimedOutSuspense) { 27740 // Don't count time spent in a timed out Suspense subtree as part of the base duration. 27741 var _primaryChildFragment = workInProgress.child; 27742 27743 if (_primaryChildFragment !== null) { 27744 // $FlowFixMe Flow doesn't support type casting in combination with the -= operator 27745 workInProgress.treeBaseDuration -= _primaryChildFragment.treeBaseDuration; 27746 } 27747 } 27748 } 27749 } 27750 27751 return false; 27752 } 27753 } else { 27754 // Successfully completed this tree. If this was a forced client render, 27755 // there may have been recoverable errors during first hydration 27756 // attempt. If so, add them to a queue so we can log them in the 27757 // commit phase. 27758 upgradeHydrationErrorsToRecoverable(); // Fall through to normal Suspense path 27759 27760 return true; 27761 } 27762} 27763 27764function completeWork(current, workInProgress, renderLanes) { 27765 var newProps = workInProgress.pendingProps; // Note: This intentionally doesn't check if we're hydrating because comparing 27766 // to the current tree provider fiber is just as fast and less error-prone. 27767 // Ideally we would have a special version of the work loop only 27768 // for hydration. 27769 27770 popTreeContext(workInProgress); 27771 27772 switch (workInProgress.tag) { 27773 case IndeterminateComponent: 27774 case LazyComponent: 27775 case SimpleMemoComponent: 27776 case FunctionComponent: 27777 case ForwardRef: 27778 case Fragment: 27779 case Mode: 27780 case Profiler: 27781 case ContextConsumer: 27782 case MemoComponent: 27783 bubbleProperties(workInProgress); 27784 return null; 27785 27786 case ClassComponent: 27787 { 27788 var Component = workInProgress.type; 27789 27790 if (isContextProvider(Component)) { 27791 popContext(workInProgress); 27792 } 27793 27794 bubbleProperties(workInProgress); 27795 return null; 27796 } 27797 27798 case HostRoot: 27799 { 27800 var fiberRoot = workInProgress.stateNode; 27801 popHostContainer(workInProgress); 27802 popTopLevelContextObject(workInProgress); 27803 resetWorkInProgressVersions(); 27804 27805 if (fiberRoot.pendingContext) { 27806 fiberRoot.context = fiberRoot.pendingContext; 27807 fiberRoot.pendingContext = null; 27808 } 27809 27810 if (current === null || current.child === null) { 27811 // If we hydrated, pop so that we can delete any remaining children 27812 // that weren't hydrated. 27813 var wasHydrated = popHydrationState(workInProgress); 27814 27815 if (wasHydrated) { 27816 // If we hydrated, then we'll need to schedule an update for 27817 // the commit side-effects on the root. 27818 markUpdate(workInProgress); 27819 } else { 27820 if (current !== null) { 27821 var prevState = current.memoizedState; 27822 27823 if ( // Check if this is a client root 27824 !prevState.isDehydrated || // Check if we reverted to client rendering (e.g. due to an error) 27825 (workInProgress.flags & ForceClientRender) !== NoFlags) { 27826 // Schedule an effect to clear this container at the start of the 27827 // next commit. This handles the case of React rendering into a 27828 // container with previous children. It's also safe to do for 27829 // updates too, because current.child would only be null if the 27830 // previous render was null (so the container would already 27831 // be empty). 27832 workInProgress.flags |= Snapshot; // If this was a forced client render, there may have been 27833 // recoverable errors during first hydration attempt. If so, add 27834 // them to a queue so we can log them in the commit phase. 27835 27836 upgradeHydrationErrorsToRecoverable(); 27837 } 27838 } 27839 } 27840 } 27841 27842 updateHostContainer(current, workInProgress); 27843 bubbleProperties(workInProgress); 27844 27845 return null; 27846 } 27847 27848 case HostComponent: 27849 { 27850 popHostContext(workInProgress); 27851 var rootContainerInstance = getRootHostContainer(); 27852 var type = workInProgress.type; 27853 27854 if (current !== null && workInProgress.stateNode != null) { 27855 updateHostComponent$1(current, workInProgress, type, newProps, rootContainerInstance); 27856 27857 if (current.ref !== workInProgress.ref) { 27858 markRef$1(workInProgress); 27859 } 27860 } else { 27861 if (!newProps) { 27862 if (workInProgress.stateNode === null) { 27863 throw new Error('We must have new props for new mounts. This error is likely ' + 'caused by a bug in React. Please file an issue.'); 27864 } // This can happen when we abort work. 27865 27866 27867 bubbleProperties(workInProgress); 27868 return null; 27869 } 27870 27871 var currentHostContext = getHostContext(); // TODO: Move createInstance to beginWork and keep it on a context 27872 // "stack" as the parent. Then append children as we go in beginWork 27873 // or completeWork depending on whether we want to add them top->down or 27874 // bottom->up. Top->down is faster in IE11. 27875 27876 var _wasHydrated = popHydrationState(workInProgress); 27877 27878 if (_wasHydrated) { 27879 // TODO: Move this and createInstance step into the beginPhase 27880 // to consolidate. 27881 if (prepareToHydrateHostInstance(workInProgress, rootContainerInstance, currentHostContext)) { 27882 // If changes to the hydrated node need to be applied at the 27883 // commit-phase we mark this as such. 27884 markUpdate(workInProgress); 27885 } 27886 } else { 27887 var instance = createInstance(type, newProps, rootContainerInstance, currentHostContext, workInProgress); 27888 appendAllChildren(instance, workInProgress, false, false); 27889 workInProgress.stateNode = instance; // Certain renderers require commit-time effects for initial mount. 27890 // (eg DOM renderer supports auto-focus for certain elements). 27891 // Make sure such renderers get scheduled for later work. 27892 27893 if (finalizeInitialChildren(instance, type, newProps, rootContainerInstance)) { 27894 markUpdate(workInProgress); 27895 } 27896 } 27897 27898 if (workInProgress.ref !== null) { 27899 // If there is a ref on a host node we need to schedule a callback 27900 markRef$1(workInProgress); 27901 } 27902 } 27903 27904 bubbleProperties(workInProgress); 27905 return null; 27906 } 27907 27908 case HostText: 27909 { 27910 var newText = newProps; 27911 27912 if (current && workInProgress.stateNode != null) { 27913 var oldText = current.memoizedProps; // If we have an alternate, that means this is an update and we need 27914 // to schedule a side-effect to do the updates. 27915 27916 updateHostText$1(current, workInProgress, oldText, newText); 27917 } else { 27918 if (typeof newText !== 'string') { 27919 if (workInProgress.stateNode === null) { 27920 throw new Error('We must have new props for new mounts. This error is likely ' + 'caused by a bug in React. Please file an issue.'); 27921 } // This can happen when we abort work. 27922 27923 } 27924 27925 var _rootContainerInstance = getRootHostContainer(); 27926 27927 var _currentHostContext = getHostContext(); 27928 27929 var _wasHydrated2 = popHydrationState(workInProgress); 27930 27931 if (_wasHydrated2) { 27932 if (prepareToHydrateHostTextInstance(workInProgress)) { 27933 markUpdate(workInProgress); 27934 } 27935 } else { 27936 workInProgress.stateNode = createTextInstance(newText, _rootContainerInstance, _currentHostContext, workInProgress); 27937 } 27938 } 27939 27940 bubbleProperties(workInProgress); 27941 return null; 27942 } 27943 27944 case SuspenseComponent: 27945 { 27946 popSuspenseContext(workInProgress); 27947 var nextState = workInProgress.memoizedState; // Special path for dehydrated boundaries. We may eventually move this 27948 // to its own fiber type so that we can add other kinds of hydration 27949 // boundaries that aren't associated with a Suspense tree. In anticipation 27950 // of such a refactor, all the hydration logic is contained in 27951 // this branch. 27952 27953 if (current === null || current.memoizedState !== null && current.memoizedState.dehydrated !== null) { 27954 var fallthroughToNormalSuspensePath = completeDehydratedSuspenseBoundary(current, workInProgress, nextState); 27955 27956 if (!fallthroughToNormalSuspensePath) { 27957 if (workInProgress.flags & ShouldCapture) { 27958 // Special case. There were remaining unhydrated nodes. We treat 27959 // this as a mismatch. Revert to client rendering. 27960 return workInProgress; 27961 } else { 27962 // Did not finish hydrating, either because this is the initial 27963 // render or because something suspended. 27964 return null; 27965 } 27966 } // Continue with the normal Suspense path. 27967 27968 } 27969 27970 if ((workInProgress.flags & DidCapture) !== NoFlags) { 27971 // Something suspended. Re-render with the fallback children. 27972 workInProgress.lanes = renderLanes; // Do not reset the effect list. 27973 27974 if ( (workInProgress.mode & ProfileMode) !== NoMode) { 27975 transferActualDuration(workInProgress); 27976 } // Don't bubble properties in this case. 27977 27978 27979 return workInProgress; 27980 } 27981 27982 var nextDidTimeout = nextState !== null; 27983 var prevDidTimeout = current !== null && current.memoizedState !== null; 27984 // a passive effect, which is when we process the transitions 27985 27986 27987 if (nextDidTimeout !== prevDidTimeout) { 27988 // an effect to toggle the subtree's visibility. When we switch from 27989 // fallback -> primary, the inner Offscreen fiber schedules this effect 27990 // as part of its normal complete phase. But when we switch from 27991 // primary -> fallback, the inner Offscreen fiber does not have a complete 27992 // phase. So we need to schedule its effect here. 27993 // 27994 // We also use this flag to connect/disconnect the effects, but the same 27995 // logic applies: when re-connecting, the Offscreen fiber's complete 27996 // phase will handle scheduling the effect. It's only when the fallback 27997 // is active that we have to do anything special. 27998 27999 28000 if (nextDidTimeout) { 28001 var _offscreenFiber2 = workInProgress.child; 28002 _offscreenFiber2.flags |= Visibility; // TODO: This will still suspend a synchronous tree if anything 28003 // in the concurrent tree already suspended during this render. 28004 // This is a known bug. 28005 28006 if ((workInProgress.mode & ConcurrentMode) !== NoMode) { 28007 // TODO: Move this back to throwException because this is too late 28008 // if this is a large tree which is common for initial loads. We 28009 // don't know if we should restart a render or not until we get 28010 // this marker, and this is too late. 28011 // If this render already had a ping or lower pri updates, 28012 // and this is the first time we know we're going to suspend we 28013 // should be able to immediately restart from within throwException. 28014 var hasInvisibleChildContext = current === null && (workInProgress.memoizedProps.unstable_avoidThisFallback !== true || !enableSuspenseAvoidThisFallback); 28015 28016 if (hasInvisibleChildContext || hasSuspenseContext(suspenseStackCursor.current, InvisibleParentSuspenseContext)) { 28017 // If this was in an invisible tree or a new render, then showing 28018 // this boundary is ok. 28019 renderDidSuspend(); 28020 } else { 28021 // Otherwise, we're going to have to hide content so we should 28022 // suspend for longer if possible. 28023 renderDidSuspendDelayIfPossible(); 28024 } 28025 } 28026 } 28027 } 28028 28029 var wakeables = workInProgress.updateQueue; 28030 28031 if (wakeables !== null) { 28032 // Schedule an effect to attach a retry listener to the promise. 28033 // TODO: Move to passive phase 28034 workInProgress.flags |= Update; 28035 } 28036 28037 bubbleProperties(workInProgress); 28038 28039 { 28040 if ((workInProgress.mode & ProfileMode) !== NoMode) { 28041 if (nextDidTimeout) { 28042 // Don't count time spent in a timed out Suspense subtree as part of the base duration. 28043 var primaryChildFragment = workInProgress.child; 28044 28045 if (primaryChildFragment !== null) { 28046 // $FlowFixMe Flow doesn't support type casting in combination with the -= operator 28047 workInProgress.treeBaseDuration -= primaryChildFragment.treeBaseDuration; 28048 } 28049 } 28050 } 28051 } 28052 28053 return null; 28054 } 28055 28056 case HostPortal: 28057 popHostContainer(workInProgress); 28058 updateHostContainer(current, workInProgress); 28059 28060 if (current === null) { 28061 preparePortalMount(workInProgress.stateNode.containerInfo); 28062 } 28063 28064 bubbleProperties(workInProgress); 28065 return null; 28066 28067 case ContextProvider: 28068 // Pop provider fiber 28069 var context = workInProgress.type._context; 28070 popProvider(context, workInProgress); 28071 bubbleProperties(workInProgress); 28072 return null; 28073 28074 case IncompleteClassComponent: 28075 { 28076 // Same as class component case. I put it down here so that the tags are 28077 // sequential to ensure this switch is compiled to a jump table. 28078 var _Component = workInProgress.type; 28079 28080 if (isContextProvider(_Component)) { 28081 popContext(workInProgress); 28082 } 28083 28084 bubbleProperties(workInProgress); 28085 return null; 28086 } 28087 28088 case SuspenseListComponent: 28089 { 28090 popSuspenseContext(workInProgress); 28091 var renderState = workInProgress.memoizedState; 28092 28093 if (renderState === null) { 28094 // We're running in the default, "independent" mode. 28095 // We don't do anything in this mode. 28096 bubbleProperties(workInProgress); 28097 return null; 28098 } 28099 28100 var didSuspendAlready = (workInProgress.flags & DidCapture) !== NoFlags; 28101 var renderedTail = renderState.rendering; 28102 28103 if (renderedTail === null) { 28104 // We just rendered the head. 28105 if (!didSuspendAlready) { 28106 // This is the first pass. We need to figure out if anything is still 28107 // suspended in the rendered set. 28108 // If new content unsuspended, but there's still some content that 28109 // didn't. Then we need to do a second pass that forces everything 28110 // to keep showing their fallbacks. 28111 // We might be suspended if something in this render pass suspended, or 28112 // something in the previous committed pass suspended. Otherwise, 28113 // there's no chance so we can skip the expensive call to 28114 // findFirstSuspended. 28115 var cannotBeSuspended = renderHasNotSuspendedYet() && (current === null || (current.flags & DidCapture) === NoFlags); 28116 28117 if (!cannotBeSuspended) { 28118 var row = workInProgress.child; 28119 28120 while (row !== null) { 28121 var suspended = findFirstSuspended(row); 28122 28123 if (suspended !== null) { 28124 didSuspendAlready = true; 28125 workInProgress.flags |= DidCapture; 28126 cutOffTailIfNeeded(renderState, false); // If this is a newly suspended tree, it might not get committed as 28127 // part of the second pass. In that case nothing will subscribe to 28128 // its thenables. Instead, we'll transfer its thenables to the 28129 // SuspenseList so that it can retry if they resolve. 28130 // There might be multiple of these in the list but since we're 28131 // going to wait for all of them anyway, it doesn't really matter 28132 // which ones gets to ping. In theory we could get clever and keep 28133 // track of how many dependencies remain but it gets tricky because 28134 // in the meantime, we can add/remove/change items and dependencies. 28135 // We might bail out of the loop before finding any but that 28136 // doesn't matter since that means that the other boundaries that 28137 // we did find already has their listeners attached. 28138 28139 var newThenables = suspended.updateQueue; 28140 28141 if (newThenables !== null) { 28142 workInProgress.updateQueue = newThenables; 28143 workInProgress.flags |= Update; 28144 } // Rerender the whole list, but this time, we'll force fallbacks 28145 // to stay in place. 28146 // Reset the effect flags before doing the second pass since that's now invalid. 28147 // Reset the child fibers to their original state. 28148 28149 28150 workInProgress.subtreeFlags = NoFlags; 28151 resetChildFibers(workInProgress, renderLanes); // Set up the Suspense Context to force suspense and immediately 28152 // rerender the children. 28153 28154 pushSuspenseContext(workInProgress, setShallowSuspenseContext(suspenseStackCursor.current, ForceSuspenseFallback)); // Don't bubble properties in this case. 28155 28156 return workInProgress.child; 28157 } 28158 28159 row = row.sibling; 28160 } 28161 } 28162 28163 if (renderState.tail !== null && now() > getRenderTargetTime()) { 28164 // We have already passed our CPU deadline but we still have rows 28165 // left in the tail. We'll just give up further attempts to render 28166 // the main content and only render fallbacks. 28167 workInProgress.flags |= DidCapture; 28168 didSuspendAlready = true; 28169 cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this 28170 // to get it started back up to attempt the next item. While in terms 28171 // of priority this work has the same priority as this current render, 28172 // it's not part of the same transition once the transition has 28173 // committed. If it's sync, we still want to yield so that it can be 28174 // painted. Conceptually, this is really the same as pinging. 28175 // We can use any RetryLane even if it's the one currently rendering 28176 // since we're leaving it behind on this node. 28177 28178 workInProgress.lanes = SomeRetryLane; 28179 } 28180 } else { 28181 cutOffTailIfNeeded(renderState, false); 28182 } // Next we're going to render the tail. 28183 28184 } else { 28185 // Append the rendered row to the child list. 28186 if (!didSuspendAlready) { 28187 var _suspended = findFirstSuspended(renderedTail); 28188 28189 if (_suspended !== null) { 28190 workInProgress.flags |= DidCapture; 28191 didSuspendAlready = true; // Ensure we transfer the update queue to the parent so that it doesn't 28192 // get lost if this row ends up dropped during a second pass. 28193 28194 var _newThenables = _suspended.updateQueue; 28195 28196 if (_newThenables !== null) { 28197 workInProgress.updateQueue = _newThenables; 28198 workInProgress.flags |= Update; 28199 } 28200 28201 cutOffTailIfNeeded(renderState, true); // This might have been modified. 28202 28203 if (renderState.tail === null && renderState.tailMode === 'hidden' && !renderedTail.alternate && !getIsHydrating() // We don't cut it if we're hydrating. 28204 ) { 28205 // We're done. 28206 bubbleProperties(workInProgress); 28207 return null; 28208 } 28209 } else if ( // The time it took to render last row is greater than the remaining 28210 // time we have to render. So rendering one more row would likely 28211 // exceed it. 28212 now() * 2 - renderState.renderingStartTime > getRenderTargetTime() && renderLanes !== OffscreenLane) { 28213 // We have now passed our CPU deadline and we'll just give up further 28214 // attempts to render the main content and only render fallbacks. 28215 // The assumption is that this is usually faster. 28216 workInProgress.flags |= DidCapture; 28217 didSuspendAlready = true; 28218 cutOffTailIfNeeded(renderState, false); // Since nothing actually suspended, there will nothing to ping this 28219 // to get it started back up to attempt the next item. While in terms 28220 // of priority this work has the same priority as this current render, 28221 // it's not part of the same transition once the transition has 28222 // committed. If it's sync, we still want to yield so that it can be 28223 // painted. Conceptually, this is really the same as pinging. 28224 // We can use any RetryLane even if it's the one currently rendering 28225 // since we're leaving it behind on this node. 28226 28227 workInProgress.lanes = SomeRetryLane; 28228 } 28229 } 28230 28231 if (renderState.isBackwards) { 28232 // The effect list of the backwards tail will have been added 28233 // to the end. This breaks the guarantee that life-cycles fire in 28234 // sibling order but that isn't a strong guarantee promised by React. 28235 // Especially since these might also just pop in during future commits. 28236 // Append to the beginning of the list. 28237 renderedTail.sibling = workInProgress.child; 28238 workInProgress.child = renderedTail; 28239 } else { 28240 var previousSibling = renderState.last; 28241 28242 if (previousSibling !== null) { 28243 previousSibling.sibling = renderedTail; 28244 } else { 28245 workInProgress.child = renderedTail; 28246 } 28247 28248 renderState.last = renderedTail; 28249 } 28250 } 28251 28252 if (renderState.tail !== null) { 28253 // We still have tail rows to render. 28254 // Pop a row. 28255 var next = renderState.tail; 28256 renderState.rendering = next; 28257 renderState.tail = next.sibling; 28258 renderState.renderingStartTime = now(); 28259 next.sibling = null; // Restore the context. 28260 // TODO: We can probably just avoid popping it instead and only 28261 // setting it the first time we go from not suspended to suspended. 28262 28263 var suspenseContext = suspenseStackCursor.current; 28264 28265 if (didSuspendAlready) { 28266 suspenseContext = setShallowSuspenseContext(suspenseContext, ForceSuspenseFallback); 28267 } else { 28268 suspenseContext = setDefaultShallowSuspenseContext(suspenseContext); 28269 } 28270 28271 pushSuspenseContext(workInProgress, suspenseContext); // Do a pass over the next row. 28272 // Don't bubble properties in this case. 28273 28274 return next; 28275 } 28276 28277 bubbleProperties(workInProgress); 28278 return null; 28279 } 28280 28281 case ScopeComponent: 28282 { 28283 28284 break; 28285 } 28286 28287 case OffscreenComponent: 28288 case LegacyHiddenComponent: 28289 { 28290 popRenderLanes(workInProgress); 28291 var _nextState = workInProgress.memoizedState; 28292 var nextIsHidden = _nextState !== null; 28293 28294 if (current !== null) { 28295 var _prevState = current.memoizedState; 28296 var prevIsHidden = _prevState !== null; 28297 28298 if (prevIsHidden !== nextIsHidden && ( // LegacyHidden doesn't do any hiding — it only pre-renders. 28299 !enableLegacyHidden )) { 28300 workInProgress.flags |= Visibility; 28301 } 28302 } 28303 28304 if (!nextIsHidden || (workInProgress.mode & ConcurrentMode) === NoMode) { 28305 bubbleProperties(workInProgress); 28306 } else { 28307 // Don't bubble properties for hidden children unless we're rendering 28308 // at offscreen priority. 28309 if (includesSomeLane(subtreeRenderLanes, OffscreenLane)) { 28310 bubbleProperties(workInProgress); 28311 28312 { 28313 // Check if there was an insertion or update in the hidden subtree. 28314 // If so, we need to hide those nodes in the commit phase, so 28315 // schedule a visibility effect. 28316 if ( workInProgress.subtreeFlags & (Placement | Update)) { 28317 workInProgress.flags |= Visibility; 28318 } 28319 } 28320 } 28321 } 28322 return null; 28323 } 28324 28325 case CacheComponent: 28326 { 28327 28328 return null; 28329 } 28330 28331 case TracingMarkerComponent: 28332 { 28333 28334 return null; 28335 } 28336 } 28337 28338 throw new Error("Unknown unit of work tag (" + workInProgress.tag + "). This error is likely caused by a bug in " + 'React. Please file an issue.'); 28339} 28340 28341function unwindWork(current, workInProgress, renderLanes) { 28342 // Note: This intentionally doesn't check if we're hydrating because comparing 28343 // to the current tree provider fiber is just as fast and less error-prone. 28344 // Ideally we would have a special version of the work loop only 28345 // for hydration. 28346 popTreeContext(workInProgress); 28347 28348 switch (workInProgress.tag) { 28349 case ClassComponent: 28350 { 28351 var Component = workInProgress.type; 28352 28353 if (isContextProvider(Component)) { 28354 popContext(workInProgress); 28355 } 28356 28357 var flags = workInProgress.flags; 28358 28359 if (flags & ShouldCapture) { 28360 workInProgress.flags = flags & ~ShouldCapture | DidCapture; 28361 28362 if ( (workInProgress.mode & ProfileMode) !== NoMode) { 28363 transferActualDuration(workInProgress); 28364 } 28365 28366 return workInProgress; 28367 } 28368 28369 return null; 28370 } 28371 28372 case HostRoot: 28373 { 28374 var root = workInProgress.stateNode; 28375 popHostContainer(workInProgress); 28376 popTopLevelContextObject(workInProgress); 28377 resetWorkInProgressVersions(); 28378 var _flags = workInProgress.flags; 28379 28380 if ((_flags & ShouldCapture) !== NoFlags && (_flags & DidCapture) === NoFlags) { 28381 // There was an error during render that wasn't captured by a suspense 28382 // boundary. Do a second pass on the root to unmount the children. 28383 workInProgress.flags = _flags & ~ShouldCapture | DidCapture; 28384 return workInProgress; 28385 } // We unwound to the root without completing it. Exit. 28386 28387 28388 return null; 28389 } 28390 28391 case HostComponent: 28392 { 28393 // TODO: popHydrationState 28394 popHostContext(workInProgress); 28395 return null; 28396 } 28397 28398 case SuspenseComponent: 28399 { 28400 popSuspenseContext(workInProgress); 28401 var suspenseState = workInProgress.memoizedState; 28402 28403 if (suspenseState !== null && suspenseState.dehydrated !== null) { 28404 if (workInProgress.alternate === null) { 28405 throw new Error('Threw in newly mounted dehydrated component. This is likely a bug in ' + 'React. Please file an issue.'); 28406 } 28407 28408 resetHydrationState(); 28409 } 28410 28411 var _flags2 = workInProgress.flags; 28412 28413 if (_flags2 & ShouldCapture) { 28414 workInProgress.flags = _flags2 & ~ShouldCapture | DidCapture; // Captured a suspense effect. Re-render the boundary. 28415 28416 if ( (workInProgress.mode & ProfileMode) !== NoMode) { 28417 transferActualDuration(workInProgress); 28418 } 28419 28420 return workInProgress; 28421 } 28422 28423 return null; 28424 } 28425 28426 case SuspenseListComponent: 28427 { 28428 popSuspenseContext(workInProgress); // SuspenseList doesn't actually catch anything. It should've been 28429 // caught by a nested boundary. If not, it should bubble through. 28430 28431 return null; 28432 } 28433 28434 case HostPortal: 28435 popHostContainer(workInProgress); 28436 return null; 28437 28438 case ContextProvider: 28439 var context = workInProgress.type._context; 28440 popProvider(context, workInProgress); 28441 return null; 28442 28443 case OffscreenComponent: 28444 case LegacyHiddenComponent: 28445 popRenderLanes(workInProgress); 28446 return null; 28447 28448 case CacheComponent: 28449 28450 return null; 28451 28452 default: 28453 return null; 28454 } 28455} 28456 28457function unwindInterruptedWork(current, interruptedWork, renderLanes) { 28458 // Note: This intentionally doesn't check if we're hydrating because comparing 28459 // to the current tree provider fiber is just as fast and less error-prone. 28460 // Ideally we would have a special version of the work loop only 28461 // for hydration. 28462 popTreeContext(interruptedWork); 28463 28464 switch (interruptedWork.tag) { 28465 case ClassComponent: 28466 { 28467 var childContextTypes = interruptedWork.type.childContextTypes; 28468 28469 if (childContextTypes !== null && childContextTypes !== undefined) { 28470 popContext(interruptedWork); 28471 } 28472 28473 break; 28474 } 28475 28476 case HostRoot: 28477 { 28478 var root = interruptedWork.stateNode; 28479 popHostContainer(interruptedWork); 28480 popTopLevelContextObject(interruptedWork); 28481 resetWorkInProgressVersions(); 28482 break; 28483 } 28484 28485 case HostComponent: 28486 { 28487 popHostContext(interruptedWork); 28488 break; 28489 } 28490 28491 case HostPortal: 28492 popHostContainer(interruptedWork); 28493 break; 28494 28495 case SuspenseComponent: 28496 popSuspenseContext(interruptedWork); 28497 break; 28498 28499 case SuspenseListComponent: 28500 popSuspenseContext(interruptedWork); 28501 break; 28502 28503 case ContextProvider: 28504 var context = interruptedWork.type._context; 28505 popProvider(context, interruptedWork); 28506 break; 28507 28508 case OffscreenComponent: 28509 case LegacyHiddenComponent: 28510 popRenderLanes(interruptedWork); 28511 break; 28512 } 28513} 28514 28515var didWarnAboutUndefinedSnapshotBeforeUpdate = null; 28516 28517{ 28518 didWarnAboutUndefinedSnapshotBeforeUpdate = new Set(); 28519} // Used during the commit phase to track the state of the Offscreen component stack. 28520// Allows us to avoid traversing the return path to find the nearest Offscreen ancestor. 28521// Only used when enableSuspenseLayoutEffectSemantics is enabled. 28522 28523 28524var offscreenSubtreeIsHidden = false; 28525var offscreenSubtreeWasHidden = false; 28526var PossiblyWeakSet = typeof WeakSet === 'function' ? WeakSet : Set; 28527var nextEffect = null; // Used for Profiling builds to track updaters. 28528 28529var inProgressLanes = null; 28530var inProgressRoot = null; 28531function reportUncaughtErrorInDEV(error) { 28532 // Wrapping each small part of the commit phase into a guarded 28533 // callback is a bit too slow (https://github.com/facebook/react/pull/21666). 28534 // But we rely on it to surface errors to DEV tools like overlays 28535 // (https://github.com/facebook/react/issues/21712). 28536 // As a compromise, rethrow only caught errors in a guard. 28537 { 28538 invokeGuardedCallback(null, function () { 28539 throw error; 28540 }); 28541 clearCaughtError(); 28542 } 28543} 28544 28545var callComponentWillUnmountWithTimer = function (current, instance) { 28546 instance.props = current.memoizedProps; 28547 instance.state = current.memoizedState; 28548 28549 if ( current.mode & ProfileMode) { 28550 try { 28551 startLayoutEffectTimer(); 28552 instance.componentWillUnmount(); 28553 } finally { 28554 recordLayoutEffectDuration(current); 28555 } 28556 } else { 28557 instance.componentWillUnmount(); 28558 } 28559}; // Capture errors so they don't interrupt mounting. 28560 28561 28562function safelyCallCommitHookLayoutEffectListMount(current, nearestMountedAncestor) { 28563 try { 28564 commitHookEffectListMount(Layout, current); 28565 } catch (error) { 28566 captureCommitPhaseError(current, nearestMountedAncestor, error); 28567 } 28568} // Capture errors so they don't interrupt unmounting. 28569 28570 28571function safelyCallComponentWillUnmount(current, nearestMountedAncestor, instance) { 28572 try { 28573 callComponentWillUnmountWithTimer(current, instance); 28574 } catch (error) { 28575 captureCommitPhaseError(current, nearestMountedAncestor, error); 28576 } 28577} // Capture errors so they don't interrupt mounting. 28578 28579 28580function safelyCallComponentDidMount(current, nearestMountedAncestor, instance) { 28581 try { 28582 instance.componentDidMount(); 28583 } catch (error) { 28584 captureCommitPhaseError(current, nearestMountedAncestor, error); 28585 } 28586} // Capture errors so they don't interrupt mounting. 28587 28588 28589function safelyAttachRef(current, nearestMountedAncestor) { 28590 try { 28591 commitAttachRef(current); 28592 } catch (error) { 28593 captureCommitPhaseError(current, nearestMountedAncestor, error); 28594 } 28595} 28596 28597function safelyDetachRef(current, nearestMountedAncestor) { 28598 var ref = current.ref; 28599 28600 if (ref !== null) { 28601 if (typeof ref === 'function') { 28602 var retVal; 28603 28604 try { 28605 if (enableProfilerTimer && enableProfilerCommitHooks && current.mode & ProfileMode) { 28606 try { 28607 startLayoutEffectTimer(); 28608 retVal = ref(null); 28609 } finally { 28610 recordLayoutEffectDuration(current); 28611 } 28612 } else { 28613 retVal = ref(null); 28614 } 28615 } catch (error) { 28616 captureCommitPhaseError(current, nearestMountedAncestor, error); 28617 } 28618 28619 { 28620 if (typeof retVal === 'function') { 28621 error('Unexpected return value from a callback ref in %s. ' + 'A callback ref should not return a function.', getComponentNameFromFiber(current)); 28622 } 28623 } 28624 } else { 28625 ref.current = null; 28626 } 28627 } 28628} 28629 28630function safelyCallDestroy(current, nearestMountedAncestor, destroy) { 28631 try { 28632 destroy(); 28633 } catch (error) { 28634 captureCommitPhaseError(current, nearestMountedAncestor, error); 28635 } 28636} 28637 28638var focusedInstanceHandle = null; 28639var shouldFireAfterActiveInstanceBlur = false; 28640function commitBeforeMutationEffects(root, firstChild) { 28641 focusedInstanceHandle = prepareForCommit(root.containerInfo); 28642 nextEffect = firstChild; 28643 commitBeforeMutationEffects_begin(); // We no longer need to track the active instance fiber 28644 28645 var shouldFire = shouldFireAfterActiveInstanceBlur; 28646 shouldFireAfterActiveInstanceBlur = false; 28647 focusedInstanceHandle = null; 28648 return shouldFire; 28649} 28650 28651function commitBeforeMutationEffects_begin() { 28652 while (nextEffect !== null) { 28653 var fiber = nextEffect; // This phase is only used for beforeActiveInstanceBlur. 28654 28655 var child = fiber.child; 28656 28657 if ((fiber.subtreeFlags & BeforeMutationMask) !== NoFlags && child !== null) { 28658 child.return = fiber; 28659 nextEffect = child; 28660 } else { 28661 commitBeforeMutationEffects_complete(); 28662 } 28663 } 28664} 28665 28666function commitBeforeMutationEffects_complete() { 28667 while (nextEffect !== null) { 28668 var fiber = nextEffect; 28669 setCurrentFiber(fiber); 28670 28671 try { 28672 commitBeforeMutationEffectsOnFiber(fiber); 28673 } catch (error) { 28674 captureCommitPhaseError(fiber, fiber.return, error); 28675 } 28676 28677 resetCurrentFiber(); 28678 var sibling = fiber.sibling; 28679 28680 if (sibling !== null) { 28681 sibling.return = fiber.return; 28682 nextEffect = sibling; 28683 return; 28684 } 28685 28686 nextEffect = fiber.return; 28687 } 28688} 28689 28690function commitBeforeMutationEffectsOnFiber(finishedWork) { 28691 var current = finishedWork.alternate; 28692 var flags = finishedWork.flags; 28693 28694 if ((flags & Snapshot) !== NoFlags) { 28695 setCurrentFiber(finishedWork); 28696 28697 switch (finishedWork.tag) { 28698 case FunctionComponent: 28699 case ForwardRef: 28700 case SimpleMemoComponent: 28701 { 28702 break; 28703 } 28704 28705 case ClassComponent: 28706 { 28707 if (current !== null) { 28708 var prevProps = current.memoizedProps; 28709 var prevState = current.memoizedState; 28710 var instance = finishedWork.stateNode; // We could update instance props and state here, 28711 // but instead we rely on them being set during last render. 28712 // TODO: revisit this when we implement resuming. 28713 28714 { 28715 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) { 28716 if (instance.props !== finishedWork.memoizedProps) { 28717 error('Expected %s props to match memoized props before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 28718 } 28719 28720 if (instance.state !== finishedWork.memoizedState) { 28721 error('Expected %s state to match memoized state before ' + 'getSnapshotBeforeUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 28722 } 28723 } 28724 } 28725 28726 var snapshot = instance.getSnapshotBeforeUpdate(finishedWork.elementType === finishedWork.type ? prevProps : resolveDefaultProps(finishedWork.type, prevProps), prevState); 28727 28728 { 28729 var didWarnSet = didWarnAboutUndefinedSnapshotBeforeUpdate; 28730 28731 if (snapshot === undefined && !didWarnSet.has(finishedWork.type)) { 28732 didWarnSet.add(finishedWork.type); 28733 28734 error('%s.getSnapshotBeforeUpdate(): A snapshot value (or null) ' + 'must be returned. You have returned undefined.', getComponentNameFromFiber(finishedWork)); 28735 } 28736 } 28737 28738 instance.__reactInternalSnapshotBeforeUpdate = snapshot; 28739 } 28740 28741 break; 28742 } 28743 28744 case HostRoot: 28745 { 28746 { 28747 var root = finishedWork.stateNode; 28748 clearContainer(root.containerInfo); 28749 } 28750 28751 break; 28752 } 28753 28754 case HostComponent: 28755 case HostText: 28756 case HostPortal: 28757 case IncompleteClassComponent: 28758 // Nothing to do for these component types 28759 break; 28760 28761 default: 28762 { 28763 throw new Error('This unit of work tag should not have side-effects. This error is ' + 'likely caused by a bug in React. Please file an issue.'); 28764 } 28765 } 28766 28767 resetCurrentFiber(); 28768 } 28769} 28770 28771function commitHookEffectListUnmount(flags, finishedWork, nearestMountedAncestor) { 28772 var updateQueue = finishedWork.updateQueue; 28773 var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null; 28774 28775 if (lastEffect !== null) { 28776 var firstEffect = lastEffect.next; 28777 var effect = firstEffect; 28778 28779 do { 28780 if ((effect.tag & flags) === flags) { 28781 // Unmount 28782 var destroy = effect.destroy; 28783 effect.destroy = undefined; 28784 28785 if (destroy !== undefined) { 28786 { 28787 if ((flags & Passive$1) !== NoFlags$1) { 28788 markComponentPassiveEffectUnmountStarted(finishedWork); 28789 } else if ((flags & Layout) !== NoFlags$1) { 28790 markComponentLayoutEffectUnmountStarted(finishedWork); 28791 } 28792 } 28793 28794 { 28795 if ((flags & Insertion) !== NoFlags$1) { 28796 setIsRunningInsertionEffect(true); 28797 } 28798 } 28799 28800 safelyCallDestroy(finishedWork, nearestMountedAncestor, destroy); 28801 28802 { 28803 if ((flags & Insertion) !== NoFlags$1) { 28804 setIsRunningInsertionEffect(false); 28805 } 28806 } 28807 28808 { 28809 if ((flags & Passive$1) !== NoFlags$1) { 28810 markComponentPassiveEffectUnmountStopped(); 28811 } else if ((flags & Layout) !== NoFlags$1) { 28812 markComponentLayoutEffectUnmountStopped(); 28813 } 28814 } 28815 } 28816 } 28817 28818 effect = effect.next; 28819 } while (effect !== firstEffect); 28820 } 28821} 28822 28823function commitHookEffectListMount(flags, finishedWork) { 28824 var updateQueue = finishedWork.updateQueue; 28825 var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null; 28826 28827 if (lastEffect !== null) { 28828 var firstEffect = lastEffect.next; 28829 var effect = firstEffect; 28830 28831 do { 28832 if ((effect.tag & flags) === flags) { 28833 { 28834 if ((flags & Passive$1) !== NoFlags$1) { 28835 markComponentPassiveEffectMountStarted(finishedWork); 28836 } else if ((flags & Layout) !== NoFlags$1) { 28837 markComponentLayoutEffectMountStarted(finishedWork); 28838 } 28839 } // Mount 28840 28841 28842 var create = effect.create; 28843 28844 { 28845 if ((flags & Insertion) !== NoFlags$1) { 28846 setIsRunningInsertionEffect(true); 28847 } 28848 } 28849 28850 effect.destroy = create(); 28851 28852 { 28853 if ((flags & Insertion) !== NoFlags$1) { 28854 setIsRunningInsertionEffect(false); 28855 } 28856 } 28857 28858 { 28859 if ((flags & Passive$1) !== NoFlags$1) { 28860 markComponentPassiveEffectMountStopped(); 28861 } else if ((flags & Layout) !== NoFlags$1) { 28862 markComponentLayoutEffectMountStopped(); 28863 } 28864 } 28865 28866 { 28867 var destroy = effect.destroy; 28868 28869 if (destroy !== undefined && typeof destroy !== 'function') { 28870 var hookName = void 0; 28871 28872 if ((effect.tag & Layout) !== NoFlags) { 28873 hookName = 'useLayoutEffect'; 28874 } else if ((effect.tag & Insertion) !== NoFlags) { 28875 hookName = 'useInsertionEffect'; 28876 } else { 28877 hookName = 'useEffect'; 28878 } 28879 28880 var addendum = void 0; 28881 28882 if (destroy === null) { 28883 addendum = ' You returned null. If your effect does not require clean ' + 'up, return undefined (or nothing).'; 28884 } else if (typeof destroy.then === 'function') { 28885 addendum = '\n\nIt looks like you wrote ' + hookName + '(async () => ...) or returned a Promise. ' + 'Instead, write the async function inside your effect ' + 'and call it immediately:\n\n' + hookName + '(() => {\n' + ' async function fetchData() {\n' + ' // You can await here\n' + ' const response = await MyAPI.getData(someId);\n' + ' // ...\n' + ' }\n' + ' fetchData();\n' + "}, [someId]); // Or [] if effect doesn't need props or state\n\n" + 'Learn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching'; 28886 } else { 28887 addendum = ' You returned: ' + destroy; 28888 } 28889 28890 error('%s must not return anything besides a function, ' + 'which is used for clean-up.%s', hookName, addendum); 28891 } 28892 } 28893 } 28894 28895 effect = effect.next; 28896 } while (effect !== firstEffect); 28897 } 28898} 28899 28900function commitPassiveEffectDurations(finishedRoot, finishedWork) { 28901 { 28902 // Only Profilers with work in their subtree will have an Update effect scheduled. 28903 if ((finishedWork.flags & Update) !== NoFlags) { 28904 switch (finishedWork.tag) { 28905 case Profiler: 28906 { 28907 var passiveEffectDuration = finishedWork.stateNode.passiveEffectDuration; 28908 var _finishedWork$memoize = finishedWork.memoizedProps, 28909 id = _finishedWork$memoize.id, 28910 onPostCommit = _finishedWork$memoize.onPostCommit; // This value will still reflect the previous commit phase. 28911 // It does not get reset until the start of the next commit phase. 28912 28913 var commitTime = getCommitTime(); 28914 var phase = finishedWork.alternate === null ? 'mount' : 'update'; 28915 28916 { 28917 if (isCurrentUpdateNested()) { 28918 phase = 'nested-update'; 28919 } 28920 } 28921 28922 if (typeof onPostCommit === 'function') { 28923 onPostCommit(id, phase, passiveEffectDuration, commitTime); 28924 } // Bubble times to the next nearest ancestor Profiler. 28925 // After we process that Profiler, we'll bubble further up. 28926 28927 28928 var parentFiber = finishedWork.return; 28929 28930 outer: while (parentFiber !== null) { 28931 switch (parentFiber.tag) { 28932 case HostRoot: 28933 var root = parentFiber.stateNode; 28934 root.passiveEffectDuration += passiveEffectDuration; 28935 break outer; 28936 28937 case Profiler: 28938 var parentStateNode = parentFiber.stateNode; 28939 parentStateNode.passiveEffectDuration += passiveEffectDuration; 28940 break outer; 28941 } 28942 28943 parentFiber = parentFiber.return; 28944 } 28945 28946 break; 28947 } 28948 } 28949 } 28950 } 28951} 28952 28953function commitLayoutEffectOnFiber(finishedRoot, current, finishedWork, committedLanes) { 28954 if ((finishedWork.flags & LayoutMask) !== NoFlags) { 28955 switch (finishedWork.tag) { 28956 case FunctionComponent: 28957 case ForwardRef: 28958 case SimpleMemoComponent: 28959 { 28960 if ( !offscreenSubtreeWasHidden) { 28961 // At this point layout effects have already been destroyed (during mutation phase). 28962 // This is done to prevent sibling component effects from interfering with each other, 28963 // e.g. a destroy function in one component should never override a ref set 28964 // by a create function in another component during the same commit. 28965 if ( finishedWork.mode & ProfileMode) { 28966 try { 28967 startLayoutEffectTimer(); 28968 commitHookEffectListMount(Layout | HasEffect, finishedWork); 28969 } finally { 28970 recordLayoutEffectDuration(finishedWork); 28971 } 28972 } else { 28973 commitHookEffectListMount(Layout | HasEffect, finishedWork); 28974 } 28975 } 28976 28977 break; 28978 } 28979 28980 case ClassComponent: 28981 { 28982 var instance = finishedWork.stateNode; 28983 28984 if (finishedWork.flags & Update) { 28985 if (!offscreenSubtreeWasHidden) { 28986 if (current === null) { 28987 // We could update instance props and state here, 28988 // but instead we rely on them being set during last render. 28989 // TODO: revisit this when we implement resuming. 28990 { 28991 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) { 28992 if (instance.props !== finishedWork.memoizedProps) { 28993 error('Expected %s props to match memoized props before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 28994 } 28995 28996 if (instance.state !== finishedWork.memoizedState) { 28997 error('Expected %s state to match memoized state before ' + 'componentDidMount. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 28998 } 28999 } 29000 } 29001 29002 if ( finishedWork.mode & ProfileMode) { 29003 try { 29004 startLayoutEffectTimer(); 29005 instance.componentDidMount(); 29006 } finally { 29007 recordLayoutEffectDuration(finishedWork); 29008 } 29009 } else { 29010 instance.componentDidMount(); 29011 } 29012 } else { 29013 var prevProps = finishedWork.elementType === finishedWork.type ? current.memoizedProps : resolveDefaultProps(finishedWork.type, current.memoizedProps); 29014 var prevState = current.memoizedState; // We could update instance props and state here, 29015 // but instead we rely on them being set during last render. 29016 // TODO: revisit this when we implement resuming. 29017 29018 { 29019 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) { 29020 if (instance.props !== finishedWork.memoizedProps) { 29021 error('Expected %s props to match memoized props before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 29022 } 29023 29024 if (instance.state !== finishedWork.memoizedState) { 29025 error('Expected %s state to match memoized state before ' + 'componentDidUpdate. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 29026 } 29027 } 29028 } 29029 29030 if ( finishedWork.mode & ProfileMode) { 29031 try { 29032 startLayoutEffectTimer(); 29033 instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate); 29034 } finally { 29035 recordLayoutEffectDuration(finishedWork); 29036 } 29037 } else { 29038 instance.componentDidUpdate(prevProps, prevState, instance.__reactInternalSnapshotBeforeUpdate); 29039 } 29040 } 29041 } 29042 } // TODO: I think this is now always non-null by the time it reaches the 29043 // commit phase. Consider removing the type check. 29044 29045 29046 var updateQueue = finishedWork.updateQueue; 29047 29048 if (updateQueue !== null) { 29049 { 29050 if (finishedWork.type === finishedWork.elementType && !didWarnAboutReassigningProps) { 29051 if (instance.props !== finishedWork.memoizedProps) { 29052 error('Expected %s props to match memoized props before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.props`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 29053 } 29054 29055 if (instance.state !== finishedWork.memoizedState) { 29056 error('Expected %s state to match memoized state before ' + 'processing the update queue. ' + 'This might either be because of a bug in React, or because ' + 'a component reassigns its own `this.state`. ' + 'Please file an issue.', getComponentNameFromFiber(finishedWork) || 'instance'); 29057 } 29058 } 29059 } // We could update instance props and state here, 29060 // but instead we rely on them being set during last render. 29061 // TODO: revisit this when we implement resuming. 29062 29063 29064 commitUpdateQueue(finishedWork, updateQueue, instance); 29065 } 29066 29067 break; 29068 } 29069 29070 case HostRoot: 29071 { 29072 // TODO: I think this is now always non-null by the time it reaches the 29073 // commit phase. Consider removing the type check. 29074 var _updateQueue = finishedWork.updateQueue; 29075 29076 if (_updateQueue !== null) { 29077 var _instance = null; 29078 29079 if (finishedWork.child !== null) { 29080 switch (finishedWork.child.tag) { 29081 case HostComponent: 29082 _instance = getPublicInstance(finishedWork.child.stateNode); 29083 break; 29084 29085 case ClassComponent: 29086 _instance = finishedWork.child.stateNode; 29087 break; 29088 } 29089 } 29090 29091 commitUpdateQueue(finishedWork, _updateQueue, _instance); 29092 } 29093 29094 break; 29095 } 29096 29097 case HostComponent: 29098 { 29099 var _instance2 = finishedWork.stateNode; // Renderers may schedule work to be done after host components are mounted 29100 // (eg DOM renderer may schedule auto-focus for inputs and form controls). 29101 // These effects should only be committed when components are first mounted, 29102 // aka when there is no current/alternate. 29103 29104 if (current === null && finishedWork.flags & Update) { 29105 var type = finishedWork.type; 29106 var props = finishedWork.memoizedProps; 29107 commitMount(_instance2, type, props); 29108 } 29109 29110 break; 29111 } 29112 29113 case HostText: 29114 { 29115 // We have no life-cycles associated with text. 29116 break; 29117 } 29118 29119 case HostPortal: 29120 { 29121 // We have no life-cycles associated with portals. 29122 break; 29123 } 29124 29125 case Profiler: 29126 { 29127 { 29128 var _finishedWork$memoize2 = finishedWork.memoizedProps, 29129 onCommit = _finishedWork$memoize2.onCommit, 29130 onRender = _finishedWork$memoize2.onRender; 29131 var effectDuration = finishedWork.stateNode.effectDuration; 29132 var commitTime = getCommitTime(); 29133 var phase = current === null ? 'mount' : 'update'; 29134 29135 { 29136 if (isCurrentUpdateNested()) { 29137 phase = 'nested-update'; 29138 } 29139 } 29140 29141 if (typeof onRender === 'function') { 29142 onRender(finishedWork.memoizedProps.id, phase, finishedWork.actualDuration, finishedWork.treeBaseDuration, finishedWork.actualStartTime, commitTime); 29143 } 29144 29145 { 29146 if (typeof onCommit === 'function') { 29147 onCommit(finishedWork.memoizedProps.id, phase, effectDuration, commitTime); 29148 } // Schedule a passive effect for this Profiler to call onPostCommit hooks. 29149 // This effect should be scheduled even if there is no onPostCommit callback for this Profiler, 29150 // because the effect is also where times bubble to parent Profilers. 29151 29152 29153 enqueuePendingPassiveProfilerEffect(finishedWork); // Propagate layout effect durations to the next nearest Profiler ancestor. 29154 // Do not reset these values until the next render so DevTools has a chance to read them first. 29155 29156 var parentFiber = finishedWork.return; 29157 29158 outer: while (parentFiber !== null) { 29159 switch (parentFiber.tag) { 29160 case HostRoot: 29161 var root = parentFiber.stateNode; 29162 root.effectDuration += effectDuration; 29163 break outer; 29164 29165 case Profiler: 29166 var parentStateNode = parentFiber.stateNode; 29167 parentStateNode.effectDuration += effectDuration; 29168 break outer; 29169 } 29170 29171 parentFiber = parentFiber.return; 29172 } 29173 } 29174 } 29175 29176 break; 29177 } 29178 29179 case SuspenseComponent: 29180 { 29181 commitSuspenseHydrationCallbacks(finishedRoot, finishedWork); 29182 break; 29183 } 29184 29185 case SuspenseListComponent: 29186 case IncompleteClassComponent: 29187 case ScopeComponent: 29188 case OffscreenComponent: 29189 case LegacyHiddenComponent: 29190 case TracingMarkerComponent: 29191 { 29192 break; 29193 } 29194 29195 default: 29196 throw new Error('This unit of work tag should not have side-effects. This error is ' + 'likely caused by a bug in React. Please file an issue.'); 29197 } 29198 } 29199 29200 if ( !offscreenSubtreeWasHidden) { 29201 { 29202 if (finishedWork.flags & Ref) { 29203 commitAttachRef(finishedWork); 29204 } 29205 } 29206 } 29207} 29208 29209function reappearLayoutEffectsOnFiber(node) { 29210 // Turn on layout effects in a tree that previously disappeared. 29211 // TODO (Offscreen) Check: flags & LayoutStatic 29212 switch (node.tag) { 29213 case FunctionComponent: 29214 case ForwardRef: 29215 case SimpleMemoComponent: 29216 { 29217 if ( node.mode & ProfileMode) { 29218 try { 29219 startLayoutEffectTimer(); 29220 safelyCallCommitHookLayoutEffectListMount(node, node.return); 29221 } finally { 29222 recordLayoutEffectDuration(node); 29223 } 29224 } else { 29225 safelyCallCommitHookLayoutEffectListMount(node, node.return); 29226 } 29227 29228 break; 29229 } 29230 29231 case ClassComponent: 29232 { 29233 var instance = node.stateNode; 29234 29235 if (typeof instance.componentDidMount === 'function') { 29236 safelyCallComponentDidMount(node, node.return, instance); 29237 } 29238 29239 safelyAttachRef(node, node.return); 29240 break; 29241 } 29242 29243 case HostComponent: 29244 { 29245 safelyAttachRef(node, node.return); 29246 break; 29247 } 29248 } 29249} 29250 29251function hideOrUnhideAllChildren(finishedWork, isHidden) { 29252 // Only hide or unhide the top-most host nodes. 29253 var hostSubtreeRoot = null; 29254 29255 { 29256 // We only have the top Fiber that was inserted but we need to recurse down its 29257 // children to find all the terminal nodes. 29258 var node = finishedWork; 29259 29260 while (true) { 29261 if (node.tag === HostComponent) { 29262 if (hostSubtreeRoot === null) { 29263 hostSubtreeRoot = node; 29264 29265 try { 29266 var instance = node.stateNode; 29267 29268 if (isHidden) { 29269 hideInstance(instance); 29270 } else { 29271 unhideInstance(node.stateNode, node.memoizedProps); 29272 } 29273 } catch (error) { 29274 captureCommitPhaseError(finishedWork, finishedWork.return, error); 29275 } 29276 } 29277 } else if (node.tag === HostText) { 29278 if (hostSubtreeRoot === null) { 29279 try { 29280 var _instance3 = node.stateNode; 29281 29282 if (isHidden) { 29283 hideTextInstance(_instance3); 29284 } else { 29285 unhideTextInstance(_instance3, node.memoizedProps); 29286 } 29287 } catch (error) { 29288 captureCommitPhaseError(finishedWork, finishedWork.return, error); 29289 } 29290 } 29291 } else if ((node.tag === OffscreenComponent || node.tag === LegacyHiddenComponent) && node.memoizedState !== null && node !== finishedWork) ; else if (node.child !== null) { 29292 node.child.return = node; 29293 node = node.child; 29294 continue; 29295 } 29296 29297 if (node === finishedWork) { 29298 return; 29299 } 29300 29301 while (node.sibling === null) { 29302 if (node.return === null || node.return === finishedWork) { 29303 return; 29304 } 29305 29306 if (hostSubtreeRoot === node) { 29307 hostSubtreeRoot = null; 29308 } 29309 29310 node = node.return; 29311 } 29312 29313 if (hostSubtreeRoot === node) { 29314 hostSubtreeRoot = null; 29315 } 29316 29317 node.sibling.return = node.return; 29318 node = node.sibling; 29319 } 29320 } 29321} 29322 29323function commitAttachRef(finishedWork) { 29324 var ref = finishedWork.ref; 29325 29326 if (ref !== null) { 29327 var instance = finishedWork.stateNode; 29328 var instanceToUse; 29329 29330 switch (finishedWork.tag) { 29331 case HostComponent: 29332 instanceToUse = getPublicInstance(instance); 29333 break; 29334 29335 default: 29336 instanceToUse = instance; 29337 } // Moved outside to ensure DCE works with this flag 29338 29339 if (typeof ref === 'function') { 29340 var retVal; 29341 29342 if ( finishedWork.mode & ProfileMode) { 29343 try { 29344 startLayoutEffectTimer(); 29345 retVal = ref(instanceToUse); 29346 } finally { 29347 recordLayoutEffectDuration(finishedWork); 29348 } 29349 } else { 29350 retVal = ref(instanceToUse); 29351 } 29352 29353 { 29354 if (typeof retVal === 'function') { 29355 error('Unexpected return value from a callback ref in %s. ' + 'A callback ref should not return a function.', getComponentNameFromFiber(finishedWork)); 29356 } 29357 } 29358 } else { 29359 { 29360 if (!ref.hasOwnProperty('current')) { 29361 error('Unexpected ref object provided for %s. ' + 'Use either a ref-setter function or React.createRef().', getComponentNameFromFiber(finishedWork)); 29362 } 29363 } 29364 29365 ref.current = instanceToUse; 29366 } 29367 } 29368} 29369 29370function detachFiberMutation(fiber) { 29371 // Cut off the return pointer to disconnect it from the tree. 29372 // This enables us to detect and warn against state updates on an unmounted component. 29373 // It also prevents events from bubbling from within disconnected components. 29374 // 29375 // Ideally, we should also clear the child pointer of the parent alternate to let this 29376 // get GC:ed but we don't know which for sure which parent is the current 29377 // one so we'll settle for GC:ing the subtree of this child. 29378 // This child itself will be GC:ed when the parent updates the next time. 29379 // 29380 // Note that we can't clear child or sibling pointers yet. 29381 // They're needed for passive effects and for findDOMNode. 29382 // We defer those fields, and all other cleanup, to the passive phase (see detachFiberAfterEffects). 29383 // 29384 // Don't reset the alternate yet, either. We need that so we can detach the 29385 // alternate's fields in the passive phase. Clearing the return pointer is 29386 // sufficient for findDOMNode semantics. 29387 var alternate = fiber.alternate; 29388 29389 if (alternate !== null) { 29390 alternate.return = null; 29391 } 29392 29393 fiber.return = null; 29394} 29395 29396function detachFiberAfterEffects(fiber) { 29397 var alternate = fiber.alternate; 29398 29399 if (alternate !== null) { 29400 fiber.alternate = null; 29401 detachFiberAfterEffects(alternate); 29402 } // Note: Defensively using negation instead of < in case 29403 // `deletedTreeCleanUpLevel` is undefined. 29404 29405 29406 { 29407 // Clear cyclical Fiber fields. This level alone is designed to roughly 29408 // approximate the planned Fiber refactor. In that world, `setState` will be 29409 // bound to a special "instance" object instead of a Fiber. The Instance 29410 // object will not have any of these fields. It will only be connected to 29411 // the fiber tree via a single link at the root. So if this level alone is 29412 // sufficient to fix memory issues, that bodes well for our plans. 29413 fiber.child = null; 29414 fiber.deletions = null; 29415 fiber.sibling = null; // The `stateNode` is cyclical because on host nodes it points to the host 29416 // tree, which has its own pointers to children, parents, and siblings. 29417 // The other host nodes also point back to fibers, so we should detach that 29418 // one, too. 29419 29420 if (fiber.tag === HostComponent) { 29421 var hostInstance = fiber.stateNode; 29422 29423 if (hostInstance !== null) { 29424 detachDeletedInstance(hostInstance); 29425 } 29426 } 29427 29428 fiber.stateNode = null; // I'm intentionally not clearing the `return` field in this level. We 29429 // already disconnect the `return` pointer at the root of the deleted 29430 // subtree (in `detachFiberMutation`). Besides, `return` by itself is not 29431 // cyclical — it's only cyclical when combined with `child`, `sibling`, and 29432 // `alternate`. But we'll clear it in the next level anyway, just in case. 29433 29434 { 29435 fiber._debugOwner = null; 29436 } 29437 29438 { 29439 // Theoretically, nothing in here should be necessary, because we already 29440 // disconnected the fiber from the tree. So even if something leaks this 29441 // particular fiber, it won't leak anything else 29442 // 29443 // The purpose of this branch is to be super aggressive so we can measure 29444 // if there's any difference in memory impact. If there is, that could 29445 // indicate a React leak we don't know about. 29446 fiber.return = null; 29447 fiber.dependencies = null; 29448 fiber.memoizedProps = null; 29449 fiber.memoizedState = null; 29450 fiber.pendingProps = null; 29451 fiber.stateNode = null; // TODO: Move to `commitPassiveUnmountInsideDeletedTreeOnFiber` instead. 29452 29453 fiber.updateQueue = null; 29454 } 29455 } 29456} 29457 29458function getHostParentFiber(fiber) { 29459 var parent = fiber.return; 29460 29461 while (parent !== null) { 29462 if (isHostParent(parent)) { 29463 return parent; 29464 } 29465 29466 parent = parent.return; 29467 } 29468 29469 throw new Error('Expected to find a host parent. This error is likely caused by a bug ' + 'in React. Please file an issue.'); 29470} 29471 29472function isHostParent(fiber) { 29473 return fiber.tag === HostComponent || fiber.tag === HostRoot || fiber.tag === HostPortal; 29474} 29475 29476function getHostSibling(fiber) { 29477 // We're going to search forward into the tree until we find a sibling host 29478 // node. Unfortunately, if multiple insertions are done in a row we have to 29479 // search past them. This leads to exponential search for the next sibling. 29480 // TODO: Find a more efficient way to do this. 29481 var node = fiber; 29482 29483 siblings: while (true) { 29484 // If we didn't find anything, let's try the next sibling. 29485 while (node.sibling === null) { 29486 if (node.return === null || isHostParent(node.return)) { 29487 // If we pop out of the root or hit the parent the fiber we are the 29488 // last sibling. 29489 return null; 29490 } 29491 29492 node = node.return; 29493 } 29494 29495 node.sibling.return = node.return; 29496 node = node.sibling; 29497 29498 while (node.tag !== HostComponent && node.tag !== HostText && node.tag !== DehydratedFragment) { 29499 // If it is not host node and, we might have a host node inside it. 29500 // Try to search down until we find one. 29501 if (node.flags & Placement) { 29502 // If we don't have a child, try the siblings instead. 29503 continue siblings; 29504 } // If we don't have a child, try the siblings instead. 29505 // We also skip portals because they are not part of this host tree. 29506 29507 29508 if (node.child === null || node.tag === HostPortal) { 29509 continue siblings; 29510 } else { 29511 node.child.return = node; 29512 node = node.child; 29513 } 29514 } // Check if this host node is stable or about to be placed. 29515 29516 29517 if (!(node.flags & Placement)) { 29518 // Found it! 29519 return node.stateNode; 29520 } 29521 } 29522} 29523 29524function commitPlacement(finishedWork) { 29525 29526 29527 var parentFiber = getHostParentFiber(finishedWork); // Note: these two variables *must* always be updated together. 29528 29529 switch (parentFiber.tag) { 29530 case HostComponent: 29531 { 29532 var parent = parentFiber.stateNode; 29533 29534 if (parentFiber.flags & ContentReset) { 29535 // Reset the text content of the parent before doing any insertions 29536 resetTextContent(parent); // Clear ContentReset from the effect tag 29537 29538 parentFiber.flags &= ~ContentReset; 29539 } 29540 29541 var before = getHostSibling(finishedWork); // We only have the top Fiber that was inserted but we need to recurse down its 29542 // children to find all the terminal nodes. 29543 29544 insertOrAppendPlacementNode(finishedWork, before, parent); 29545 break; 29546 } 29547 29548 case HostRoot: 29549 case HostPortal: 29550 { 29551 var _parent = parentFiber.stateNode.containerInfo; 29552 29553 var _before = getHostSibling(finishedWork); 29554 29555 insertOrAppendPlacementNodeIntoContainer(finishedWork, _before, _parent); 29556 break; 29557 } 29558 // eslint-disable-next-line-no-fallthrough 29559 29560 default: 29561 throw new Error('Invalid host parent fiber. This error is likely caused by a bug ' + 'in React. Please file an issue.'); 29562 } 29563} 29564 29565function insertOrAppendPlacementNodeIntoContainer(node, before, parent) { 29566 var tag = node.tag; 29567 var isHost = tag === HostComponent || tag === HostText; 29568 29569 if (isHost) { 29570 var stateNode = node.stateNode; 29571 29572 if (before) { 29573 insertInContainerBefore(parent, stateNode, before); 29574 } else { 29575 appendChildToContainer(parent, stateNode); 29576 } 29577 } else if (tag === HostPortal) ; else { 29578 var child = node.child; 29579 29580 if (child !== null) { 29581 insertOrAppendPlacementNodeIntoContainer(child, before, parent); 29582 var sibling = child.sibling; 29583 29584 while (sibling !== null) { 29585 insertOrAppendPlacementNodeIntoContainer(sibling, before, parent); 29586 sibling = sibling.sibling; 29587 } 29588 } 29589 } 29590} 29591 29592function insertOrAppendPlacementNode(node, before, parent) { 29593 var tag = node.tag; 29594 var isHost = tag === HostComponent || tag === HostText; 29595 29596 if (isHost) { 29597 var stateNode = node.stateNode; 29598 29599 if (before) { 29600 insertBefore(parent, stateNode, before); 29601 } else { 29602 appendChild(parent, stateNode); 29603 } 29604 } else if (tag === HostPortal) ; else { 29605 var child = node.child; 29606 29607 if (child !== null) { 29608 insertOrAppendPlacementNode(child, before, parent); 29609 var sibling = child.sibling; 29610 29611 while (sibling !== null) { 29612 insertOrAppendPlacementNode(sibling, before, parent); 29613 sibling = sibling.sibling; 29614 } 29615 } 29616 } 29617} // These are tracked on the stack as we recursively traverse a 29618// deleted subtree. 29619// TODO: Update these during the whole mutation phase, not just during 29620// a deletion. 29621 29622 29623var hostParent = null; 29624var hostParentIsContainer = false; 29625 29626function commitDeletionEffects(root, returnFiber, deletedFiber) { 29627 { 29628 // We only have the top Fiber that was deleted but we need to recurse down its 29629 // children to find all the terminal nodes. 29630 // Recursively delete all host nodes from the parent, detach refs, clean 29631 // up mounted layout effects, and call componentWillUnmount. 29632 // We only need to remove the topmost host child in each branch. But then we 29633 // still need to keep traversing to unmount effects, refs, and cWU. TODO: We 29634 // could split this into two separate traversals functions, where the second 29635 // one doesn't include any removeChild logic. This is maybe the same 29636 // function as "disappearLayoutEffects" (or whatever that turns into after 29637 // the layout phase is refactored to use recursion). 29638 // Before starting, find the nearest host parent on the stack so we know 29639 // which instance/container to remove the children from. 29640 // TODO: Instead of searching up the fiber return path on every deletion, we 29641 // can track the nearest host component on the JS stack as we traverse the 29642 // tree during the commit phase. This would make insertions faster, too. 29643 var parent = returnFiber; 29644 29645 findParent: while (parent !== null) { 29646 switch (parent.tag) { 29647 case HostComponent: 29648 { 29649 hostParent = parent.stateNode; 29650 hostParentIsContainer = false; 29651 break findParent; 29652 } 29653 29654 case HostRoot: 29655 { 29656 hostParent = parent.stateNode.containerInfo; 29657 hostParentIsContainer = true; 29658 break findParent; 29659 } 29660 29661 case HostPortal: 29662 { 29663 hostParent = parent.stateNode.containerInfo; 29664 hostParentIsContainer = true; 29665 break findParent; 29666 } 29667 } 29668 29669 parent = parent.return; 29670 } 29671 29672 if (hostParent === null) { 29673 throw new Error('Expected to find a host parent. This error is likely caused by ' + 'a bug in React. Please file an issue.'); 29674 } 29675 29676 commitDeletionEffectsOnFiber(root, returnFiber, deletedFiber); 29677 hostParent = null; 29678 hostParentIsContainer = false; 29679 } 29680 29681 detachFiberMutation(deletedFiber); 29682} 29683 29684function recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, parent) { 29685 // TODO: Use a static flag to skip trees that don't have unmount effects 29686 var child = parent.child; 29687 29688 while (child !== null) { 29689 commitDeletionEffectsOnFiber(finishedRoot, nearestMountedAncestor, child); 29690 child = child.sibling; 29691 } 29692} 29693 29694function commitDeletionEffectsOnFiber(finishedRoot, nearestMountedAncestor, deletedFiber) { 29695 onCommitUnmount(deletedFiber); // The cases in this outer switch modify the stack before they traverse 29696 // into their subtree. There are simpler cases in the inner switch 29697 // that don't modify the stack. 29698 29699 switch (deletedFiber.tag) { 29700 case HostComponent: 29701 { 29702 if (!offscreenSubtreeWasHidden) { 29703 safelyDetachRef(deletedFiber, nearestMountedAncestor); 29704 } // Intentional fallthrough to next branch 29705 29706 } 29707 // eslint-disable-next-line-no-fallthrough 29708 29709 case HostText: 29710 { 29711 // We only need to remove the nearest host child. Set the host parent 29712 // to `null` on the stack to indicate that nested children don't 29713 // need to be removed. 29714 { 29715 var prevHostParent = hostParent; 29716 var prevHostParentIsContainer = hostParentIsContainer; 29717 hostParent = null; 29718 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29719 hostParent = prevHostParent; 29720 hostParentIsContainer = prevHostParentIsContainer; 29721 29722 if (hostParent !== null) { 29723 // Now that all the child effects have unmounted, we can remove the 29724 // node from the tree. 29725 if (hostParentIsContainer) { 29726 removeChildFromContainer(hostParent, deletedFiber.stateNode); 29727 } else { 29728 removeChild(hostParent, deletedFiber.stateNode); 29729 } 29730 } 29731 } 29732 29733 return; 29734 } 29735 29736 case DehydratedFragment: 29737 { 29738 // Delete the dehydrated suspense boundary and all of its content. 29739 29740 29741 { 29742 if (hostParent !== null) { 29743 if (hostParentIsContainer) { 29744 clearSuspenseBoundaryFromContainer(hostParent, deletedFiber.stateNode); 29745 } else { 29746 clearSuspenseBoundary(hostParent, deletedFiber.stateNode); 29747 } 29748 } 29749 } 29750 29751 return; 29752 } 29753 29754 case HostPortal: 29755 { 29756 { 29757 // When we go into a portal, it becomes the parent to remove from. 29758 var _prevHostParent = hostParent; 29759 var _prevHostParentIsContainer = hostParentIsContainer; 29760 hostParent = deletedFiber.stateNode.containerInfo; 29761 hostParentIsContainer = true; 29762 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29763 hostParent = _prevHostParent; 29764 hostParentIsContainer = _prevHostParentIsContainer; 29765 } 29766 29767 return; 29768 } 29769 29770 case FunctionComponent: 29771 case ForwardRef: 29772 case MemoComponent: 29773 case SimpleMemoComponent: 29774 { 29775 if (!offscreenSubtreeWasHidden) { 29776 var updateQueue = deletedFiber.updateQueue; 29777 29778 if (updateQueue !== null) { 29779 var lastEffect = updateQueue.lastEffect; 29780 29781 if (lastEffect !== null) { 29782 var firstEffect = lastEffect.next; 29783 var effect = firstEffect; 29784 29785 do { 29786 var _effect = effect, 29787 destroy = _effect.destroy, 29788 tag = _effect.tag; 29789 29790 if (destroy !== undefined) { 29791 if ((tag & Insertion) !== NoFlags$1) { 29792 safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy); 29793 } else if ((tag & Layout) !== NoFlags$1) { 29794 { 29795 markComponentLayoutEffectUnmountStarted(deletedFiber); 29796 } 29797 29798 if ( deletedFiber.mode & ProfileMode) { 29799 startLayoutEffectTimer(); 29800 safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy); 29801 recordLayoutEffectDuration(deletedFiber); 29802 } else { 29803 safelyCallDestroy(deletedFiber, nearestMountedAncestor, destroy); 29804 } 29805 29806 { 29807 markComponentLayoutEffectUnmountStopped(); 29808 } 29809 } 29810 } 29811 29812 effect = effect.next; 29813 } while (effect !== firstEffect); 29814 } 29815 } 29816 } 29817 29818 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29819 return; 29820 } 29821 29822 case ClassComponent: 29823 { 29824 if (!offscreenSubtreeWasHidden) { 29825 safelyDetachRef(deletedFiber, nearestMountedAncestor); 29826 var instance = deletedFiber.stateNode; 29827 29828 if (typeof instance.componentWillUnmount === 'function') { 29829 safelyCallComponentWillUnmount(deletedFiber, nearestMountedAncestor, instance); 29830 } 29831 } 29832 29833 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29834 return; 29835 } 29836 29837 case ScopeComponent: 29838 { 29839 29840 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29841 return; 29842 } 29843 29844 case OffscreenComponent: 29845 { 29846 if ( // TODO: Remove this dead flag 29847 deletedFiber.mode & ConcurrentMode) { 29848 // If this offscreen component is hidden, we already unmounted it. Before 29849 // deleting the children, track that it's already unmounted so that we 29850 // don't attempt to unmount the effects again. 29851 // TODO: If the tree is hidden, in most cases we should be able to skip 29852 // over the nested children entirely. An exception is we haven't yet found 29853 // the topmost host node to delete, which we already track on the stack. 29854 // But the other case is portals, which need to be detached no matter how 29855 // deeply they are nested. We should use a subtree flag to track whether a 29856 // subtree includes a nested portal. 29857 var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden; 29858 offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden || deletedFiber.memoizedState !== null; 29859 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29860 offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden; 29861 } else { 29862 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29863 } 29864 29865 break; 29866 } 29867 29868 default: 29869 { 29870 recursivelyTraverseDeletionEffects(finishedRoot, nearestMountedAncestor, deletedFiber); 29871 return; 29872 } 29873 } 29874} 29875 29876function commitSuspenseCallback(finishedWork) { 29877 // TODO: Move this to passive phase 29878 var newState = finishedWork.memoizedState; 29879} 29880 29881function commitSuspenseHydrationCallbacks(finishedRoot, finishedWork) { 29882 29883 var newState = finishedWork.memoizedState; 29884 29885 if (newState === null) { 29886 var current = finishedWork.alternate; 29887 29888 if (current !== null) { 29889 var prevState = current.memoizedState; 29890 29891 if (prevState !== null) { 29892 var suspenseInstance = prevState.dehydrated; 29893 29894 if (suspenseInstance !== null) { 29895 commitHydratedSuspenseInstance(suspenseInstance); 29896 } 29897 } 29898 } 29899 } 29900} 29901 29902function attachSuspenseRetryListeners(finishedWork) { 29903 // If this boundary just timed out, then it will have a set of wakeables. 29904 // For each wakeable, attach a listener so that when it resolves, React 29905 // attempts to re-render the boundary in the primary (pre-timeout) state. 29906 var wakeables = finishedWork.updateQueue; 29907 29908 if (wakeables !== null) { 29909 finishedWork.updateQueue = null; 29910 var retryCache = finishedWork.stateNode; 29911 29912 if (retryCache === null) { 29913 retryCache = finishedWork.stateNode = new PossiblyWeakSet(); 29914 } 29915 29916 wakeables.forEach(function (wakeable) { 29917 // Memoize using the boundary fiber to prevent redundant listeners. 29918 var retry = resolveRetryWakeable.bind(null, finishedWork, wakeable); 29919 29920 if (!retryCache.has(wakeable)) { 29921 retryCache.add(wakeable); 29922 29923 { 29924 if (isDevToolsPresent) { 29925 if (inProgressLanes !== null && inProgressRoot !== null) { 29926 // If we have pending work still, associate the original updaters with it. 29927 restorePendingUpdaters(inProgressRoot, inProgressLanes); 29928 } else { 29929 throw Error('Expected finished root and lanes to be set. This is a bug in React.'); 29930 } 29931 } 29932 } 29933 29934 wakeable.then(retry, retry); 29935 } 29936 }); 29937 } 29938} // This function detects when a Suspense boundary goes from visible to hidden. 29939function commitMutationEffects(root, finishedWork, committedLanes) { 29940 inProgressLanes = committedLanes; 29941 inProgressRoot = root; 29942 setCurrentFiber(finishedWork); 29943 commitMutationEffectsOnFiber(finishedWork, root); 29944 setCurrentFiber(finishedWork); 29945 inProgressLanes = null; 29946 inProgressRoot = null; 29947} 29948 29949function recursivelyTraverseMutationEffects(root, parentFiber, lanes) { 29950 // Deletions effects can be scheduled on any fiber type. They need to happen 29951 // before the children effects hae fired. 29952 var deletions = parentFiber.deletions; 29953 29954 if (deletions !== null) { 29955 for (var i = 0; i < deletions.length; i++) { 29956 var childToDelete = deletions[i]; 29957 29958 try { 29959 commitDeletionEffects(root, parentFiber, childToDelete); 29960 } catch (error) { 29961 captureCommitPhaseError(childToDelete, parentFiber, error); 29962 } 29963 } 29964 } 29965 29966 var prevDebugFiber = getCurrentFiber(); 29967 29968 if (parentFiber.subtreeFlags & MutationMask) { 29969 var child = parentFiber.child; 29970 29971 while (child !== null) { 29972 setCurrentFiber(child); 29973 commitMutationEffectsOnFiber(child, root); 29974 child = child.sibling; 29975 } 29976 } 29977 29978 setCurrentFiber(prevDebugFiber); 29979} 29980 29981function commitMutationEffectsOnFiber(finishedWork, root, lanes) { 29982 var current = finishedWork.alternate; 29983 var flags = finishedWork.flags; // The effect flag should be checked *after* we refine the type of fiber, 29984 // because the fiber tag is more specific. An exception is any flag related 29985 // to reconcilation, because those can be set on all fiber types. 29986 29987 switch (finishedWork.tag) { 29988 case FunctionComponent: 29989 case ForwardRef: 29990 case MemoComponent: 29991 case SimpleMemoComponent: 29992 { 29993 recursivelyTraverseMutationEffects(root, finishedWork); 29994 commitReconciliationEffects(finishedWork); 29995 29996 if (flags & Update) { 29997 try { 29998 commitHookEffectListUnmount(Insertion | HasEffect, finishedWork, finishedWork.return); 29999 commitHookEffectListMount(Insertion | HasEffect, finishedWork); 30000 } catch (error) { 30001 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30002 } // Layout effects are destroyed during the mutation phase so that all 30003 // destroy functions for all fibers are called before any create functions. 30004 // This prevents sibling component effects from interfering with each other, 30005 // e.g. a destroy function in one component should never override a ref set 30006 // by a create function in another component during the same commit. 30007 30008 30009 if ( finishedWork.mode & ProfileMode) { 30010 try { 30011 startLayoutEffectTimer(); 30012 commitHookEffectListUnmount(Layout | HasEffect, finishedWork, finishedWork.return); 30013 } catch (error) { 30014 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30015 } 30016 30017 recordLayoutEffectDuration(finishedWork); 30018 } else { 30019 try { 30020 commitHookEffectListUnmount(Layout | HasEffect, finishedWork, finishedWork.return); 30021 } catch (error) { 30022 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30023 } 30024 } 30025 } 30026 30027 return; 30028 } 30029 30030 case ClassComponent: 30031 { 30032 recursivelyTraverseMutationEffects(root, finishedWork); 30033 commitReconciliationEffects(finishedWork); 30034 30035 if (flags & Ref) { 30036 if (current !== null) { 30037 safelyDetachRef(current, current.return); 30038 } 30039 } 30040 30041 return; 30042 } 30043 30044 case HostComponent: 30045 { 30046 recursivelyTraverseMutationEffects(root, finishedWork); 30047 commitReconciliationEffects(finishedWork); 30048 30049 if (flags & Ref) { 30050 if (current !== null) { 30051 safelyDetachRef(current, current.return); 30052 } 30053 } 30054 30055 { 30056 // TODO: ContentReset gets cleared by the children during the commit 30057 // phase. This is a refactor hazard because it means we must read 30058 // flags the flags after `commitReconciliationEffects` has already run; 30059 // the order matters. We should refactor so that ContentReset does not 30060 // rely on mutating the flag during commit. Like by setting a flag 30061 // during the render phase instead. 30062 if (finishedWork.flags & ContentReset) { 30063 var instance = finishedWork.stateNode; 30064 30065 try { 30066 resetTextContent(instance); 30067 } catch (error) { 30068 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30069 } 30070 } 30071 30072 if (flags & Update) { 30073 var _instance4 = finishedWork.stateNode; 30074 30075 if (_instance4 != null) { 30076 // Commit the work prepared earlier. 30077 var newProps = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps 30078 // as the newProps. The updatePayload will contain the real change in 30079 // this case. 30080 30081 var oldProps = current !== null ? current.memoizedProps : newProps; 30082 var type = finishedWork.type; // TODO: Type the updateQueue to be specific to host components. 30083 30084 var updatePayload = finishedWork.updateQueue; 30085 finishedWork.updateQueue = null; 30086 30087 if (updatePayload !== null) { 30088 try { 30089 commitUpdate(_instance4, updatePayload, type, oldProps, newProps, finishedWork); 30090 } catch (error) { 30091 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30092 } 30093 } 30094 } 30095 } 30096 } 30097 30098 return; 30099 } 30100 30101 case HostText: 30102 { 30103 recursivelyTraverseMutationEffects(root, finishedWork); 30104 commitReconciliationEffects(finishedWork); 30105 30106 if (flags & Update) { 30107 { 30108 if (finishedWork.stateNode === null) { 30109 throw new Error('This should have a text node initialized. This error is likely ' + 'caused by a bug in React. Please file an issue.'); 30110 } 30111 30112 var textInstance = finishedWork.stateNode; 30113 var newText = finishedWork.memoizedProps; // For hydration we reuse the update path but we treat the oldProps 30114 // as the newProps. The updatePayload will contain the real change in 30115 // this case. 30116 30117 var oldText = current !== null ? current.memoizedProps : newText; 30118 30119 try { 30120 commitTextUpdate(textInstance, oldText, newText); 30121 } catch (error) { 30122 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30123 } 30124 } 30125 } 30126 30127 return; 30128 } 30129 30130 case HostRoot: 30131 { 30132 recursivelyTraverseMutationEffects(root, finishedWork); 30133 commitReconciliationEffects(finishedWork); 30134 30135 if (flags & Update) { 30136 { 30137 if (current !== null) { 30138 var prevRootState = current.memoizedState; 30139 30140 if (prevRootState.isDehydrated) { 30141 try { 30142 commitHydratedContainer(root.containerInfo); 30143 } catch (error) { 30144 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30145 } 30146 } 30147 } 30148 } 30149 } 30150 30151 return; 30152 } 30153 30154 case HostPortal: 30155 { 30156 recursivelyTraverseMutationEffects(root, finishedWork); 30157 commitReconciliationEffects(finishedWork); 30158 30159 return; 30160 } 30161 30162 case SuspenseComponent: 30163 { 30164 recursivelyTraverseMutationEffects(root, finishedWork); 30165 commitReconciliationEffects(finishedWork); 30166 var offscreenFiber = finishedWork.child; 30167 30168 if (offscreenFiber.flags & Visibility) { 30169 var offscreenInstance = offscreenFiber.stateNode; 30170 var newState = offscreenFiber.memoizedState; 30171 var isHidden = newState !== null; // Track the current state on the Offscreen instance so we can 30172 // read it during an event 30173 30174 offscreenInstance.isHidden = isHidden; 30175 30176 if (isHidden) { 30177 var wasHidden = offscreenFiber.alternate !== null && offscreenFiber.alternate.memoizedState !== null; 30178 30179 if (!wasHidden) { 30180 // TODO: Move to passive phase 30181 markCommitTimeOfFallback(); 30182 } 30183 } 30184 } 30185 30186 if (flags & Update) { 30187 try { 30188 commitSuspenseCallback(finishedWork); 30189 } catch (error) { 30190 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30191 } 30192 30193 attachSuspenseRetryListeners(finishedWork); 30194 } 30195 30196 return; 30197 } 30198 30199 case OffscreenComponent: 30200 { 30201 var _wasHidden = current !== null && current.memoizedState !== null; 30202 30203 if ( // TODO: Remove this dead flag 30204 finishedWork.mode & ConcurrentMode) { 30205 // Before committing the children, track on the stack whether this 30206 // offscreen subtree was already hidden, so that we don't unmount the 30207 // effects again. 30208 var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden; 30209 offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden || _wasHidden; 30210 recursivelyTraverseMutationEffects(root, finishedWork); 30211 offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden; 30212 } else { 30213 recursivelyTraverseMutationEffects(root, finishedWork); 30214 } 30215 30216 commitReconciliationEffects(finishedWork); 30217 30218 if (flags & Visibility) { 30219 var _offscreenInstance = finishedWork.stateNode; 30220 var _newState = finishedWork.memoizedState; 30221 30222 var _isHidden = _newState !== null; 30223 30224 var offscreenBoundary = finishedWork; // Track the current state on the Offscreen instance so we can 30225 // read it during an event 30226 30227 _offscreenInstance.isHidden = _isHidden; 30228 30229 { 30230 if (_isHidden) { 30231 if (!_wasHidden) { 30232 if ((offscreenBoundary.mode & ConcurrentMode) !== NoMode) { 30233 nextEffect = offscreenBoundary; 30234 var offscreenChild = offscreenBoundary.child; 30235 30236 while (offscreenChild !== null) { 30237 nextEffect = offscreenChild; 30238 disappearLayoutEffects_begin(offscreenChild); 30239 offscreenChild = offscreenChild.sibling; 30240 } 30241 } 30242 } 30243 } 30244 } 30245 30246 { 30247 // TODO: This needs to run whenever there's an insertion or update 30248 // inside a hidden Offscreen tree. 30249 hideOrUnhideAllChildren(offscreenBoundary, _isHidden); 30250 } 30251 } 30252 30253 return; 30254 } 30255 30256 case SuspenseListComponent: 30257 { 30258 recursivelyTraverseMutationEffects(root, finishedWork); 30259 commitReconciliationEffects(finishedWork); 30260 30261 if (flags & Update) { 30262 attachSuspenseRetryListeners(finishedWork); 30263 } 30264 30265 return; 30266 } 30267 30268 case ScopeComponent: 30269 { 30270 30271 return; 30272 } 30273 30274 default: 30275 { 30276 recursivelyTraverseMutationEffects(root, finishedWork); 30277 commitReconciliationEffects(finishedWork); 30278 return; 30279 } 30280 } 30281} 30282 30283function commitReconciliationEffects(finishedWork) { 30284 // Placement effects (insertions, reorders) can be scheduled on any fiber 30285 // type. They needs to happen after the children effects have fired, but 30286 // before the effects on this fiber have fired. 30287 var flags = finishedWork.flags; 30288 30289 if (flags & Placement) { 30290 try { 30291 commitPlacement(finishedWork); 30292 } catch (error) { 30293 captureCommitPhaseError(finishedWork, finishedWork.return, error); 30294 } // Clear the "placement" from effect tag so that we know that this is 30295 // inserted, before any life-cycles like componentDidMount gets called. 30296 // TODO: findDOMNode doesn't rely on this any more but isMounted does 30297 // and isMounted is deprecated anyway so we should be able to kill this. 30298 30299 30300 finishedWork.flags &= ~Placement; 30301 } 30302 30303 if (flags & Hydrating) { 30304 finishedWork.flags &= ~Hydrating; 30305 } 30306} 30307 30308function commitLayoutEffects(finishedWork, root, committedLanes) { 30309 inProgressLanes = committedLanes; 30310 inProgressRoot = root; 30311 nextEffect = finishedWork; 30312 commitLayoutEffects_begin(finishedWork, root, committedLanes); 30313 inProgressLanes = null; 30314 inProgressRoot = null; 30315} 30316 30317function commitLayoutEffects_begin(subtreeRoot, root, committedLanes) { 30318 // Suspense layout effects semantics don't change for legacy roots. 30319 var isModernRoot = (subtreeRoot.mode & ConcurrentMode) !== NoMode; 30320 30321 while (nextEffect !== null) { 30322 var fiber = nextEffect; 30323 var firstChild = fiber.child; 30324 30325 if ( fiber.tag === OffscreenComponent && isModernRoot) { 30326 // Keep track of the current Offscreen stack's state. 30327 var isHidden = fiber.memoizedState !== null; 30328 var newOffscreenSubtreeIsHidden = isHidden || offscreenSubtreeIsHidden; 30329 30330 if (newOffscreenSubtreeIsHidden) { 30331 // The Offscreen tree is hidden. Skip over its layout effects. 30332 commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes); 30333 continue; 30334 } else { 30335 // TODO (Offscreen) Also check: subtreeFlags & LayoutMask 30336 var current = fiber.alternate; 30337 var wasHidden = current !== null && current.memoizedState !== null; 30338 var newOffscreenSubtreeWasHidden = wasHidden || offscreenSubtreeWasHidden; 30339 var prevOffscreenSubtreeIsHidden = offscreenSubtreeIsHidden; 30340 var prevOffscreenSubtreeWasHidden = offscreenSubtreeWasHidden; // Traverse the Offscreen subtree with the current Offscreen as the root. 30341 30342 offscreenSubtreeIsHidden = newOffscreenSubtreeIsHidden; 30343 offscreenSubtreeWasHidden = newOffscreenSubtreeWasHidden; 30344 30345 if (offscreenSubtreeWasHidden && !prevOffscreenSubtreeWasHidden) { 30346 // This is the root of a reappearing boundary. Turn its layout effects 30347 // back on. 30348 nextEffect = fiber; 30349 reappearLayoutEffects_begin(fiber); 30350 } 30351 30352 var child = firstChild; 30353 30354 while (child !== null) { 30355 nextEffect = child; 30356 commitLayoutEffects_begin(child, // New root; bubble back up to here and stop. 30357 root, committedLanes); 30358 child = child.sibling; 30359 } // Restore Offscreen state and resume in our-progress traversal. 30360 30361 30362 nextEffect = fiber; 30363 offscreenSubtreeIsHidden = prevOffscreenSubtreeIsHidden; 30364 offscreenSubtreeWasHidden = prevOffscreenSubtreeWasHidden; 30365 commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes); 30366 continue; 30367 } 30368 } 30369 30370 if ((fiber.subtreeFlags & LayoutMask) !== NoFlags && firstChild !== null) { 30371 firstChild.return = fiber; 30372 nextEffect = firstChild; 30373 } else { 30374 commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes); 30375 } 30376 } 30377} 30378 30379function commitLayoutMountEffects_complete(subtreeRoot, root, committedLanes) { 30380 while (nextEffect !== null) { 30381 var fiber = nextEffect; 30382 30383 if ((fiber.flags & LayoutMask) !== NoFlags) { 30384 var current = fiber.alternate; 30385 setCurrentFiber(fiber); 30386 30387 try { 30388 commitLayoutEffectOnFiber(root, current, fiber, committedLanes); 30389 } catch (error) { 30390 captureCommitPhaseError(fiber, fiber.return, error); 30391 } 30392 30393 resetCurrentFiber(); 30394 } 30395 30396 if (fiber === subtreeRoot) { 30397 nextEffect = null; 30398 return; 30399 } 30400 30401 var sibling = fiber.sibling; 30402 30403 if (sibling !== null) { 30404 sibling.return = fiber.return; 30405 nextEffect = sibling; 30406 return; 30407 } 30408 30409 nextEffect = fiber.return; 30410 } 30411} 30412 30413function disappearLayoutEffects_begin(subtreeRoot) { 30414 while (nextEffect !== null) { 30415 var fiber = nextEffect; 30416 var firstChild = fiber.child; // TODO (Offscreen) Check: flags & (RefStatic | LayoutStatic) 30417 30418 switch (fiber.tag) { 30419 case FunctionComponent: 30420 case ForwardRef: 30421 case MemoComponent: 30422 case SimpleMemoComponent: 30423 { 30424 if ( fiber.mode & ProfileMode) { 30425 try { 30426 startLayoutEffectTimer(); 30427 commitHookEffectListUnmount(Layout, fiber, fiber.return); 30428 } finally { 30429 recordLayoutEffectDuration(fiber); 30430 } 30431 } else { 30432 commitHookEffectListUnmount(Layout, fiber, fiber.return); 30433 } 30434 30435 break; 30436 } 30437 30438 case ClassComponent: 30439 { 30440 // TODO (Offscreen) Check: flags & RefStatic 30441 safelyDetachRef(fiber, fiber.return); 30442 var instance = fiber.stateNode; 30443 30444 if (typeof instance.componentWillUnmount === 'function') { 30445 safelyCallComponentWillUnmount(fiber, fiber.return, instance); 30446 } 30447 30448 break; 30449 } 30450 30451 case HostComponent: 30452 { 30453 safelyDetachRef(fiber, fiber.return); 30454 break; 30455 } 30456 30457 case OffscreenComponent: 30458 { 30459 // Check if this is a 30460 var isHidden = fiber.memoizedState !== null; 30461 30462 if (isHidden) { 30463 // Nested Offscreen tree is already hidden. Don't disappear 30464 // its effects. 30465 disappearLayoutEffects_complete(subtreeRoot); 30466 continue; 30467 } 30468 30469 break; 30470 } 30471 } // TODO (Offscreen) Check: subtreeFlags & LayoutStatic 30472 30473 30474 if (firstChild !== null) { 30475 firstChild.return = fiber; 30476 nextEffect = firstChild; 30477 } else { 30478 disappearLayoutEffects_complete(subtreeRoot); 30479 } 30480 } 30481} 30482 30483function disappearLayoutEffects_complete(subtreeRoot) { 30484 while (nextEffect !== null) { 30485 var fiber = nextEffect; 30486 30487 if (fiber === subtreeRoot) { 30488 nextEffect = null; 30489 return; 30490 } 30491 30492 var sibling = fiber.sibling; 30493 30494 if (sibling !== null) { 30495 sibling.return = fiber.return; 30496 nextEffect = sibling; 30497 return; 30498 } 30499 30500 nextEffect = fiber.return; 30501 } 30502} 30503 30504function reappearLayoutEffects_begin(subtreeRoot) { 30505 while (nextEffect !== null) { 30506 var fiber = nextEffect; 30507 var firstChild = fiber.child; 30508 30509 if (fiber.tag === OffscreenComponent) { 30510 var isHidden = fiber.memoizedState !== null; 30511 30512 if (isHidden) { 30513 // Nested Offscreen tree is still hidden. Don't re-appear its effects. 30514 reappearLayoutEffects_complete(subtreeRoot); 30515 continue; 30516 } 30517 } // TODO (Offscreen) Check: subtreeFlags & LayoutStatic 30518 30519 30520 if (firstChild !== null) { 30521 // This node may have been reused from a previous render, so we can't 30522 // assume its return pointer is correct. 30523 firstChild.return = fiber; 30524 nextEffect = firstChild; 30525 } else { 30526 reappearLayoutEffects_complete(subtreeRoot); 30527 } 30528 } 30529} 30530 30531function reappearLayoutEffects_complete(subtreeRoot) { 30532 while (nextEffect !== null) { 30533 var fiber = nextEffect; // TODO (Offscreen) Check: flags & LayoutStatic 30534 30535 setCurrentFiber(fiber); 30536 30537 try { 30538 reappearLayoutEffectsOnFiber(fiber); 30539 } catch (error) { 30540 captureCommitPhaseError(fiber, fiber.return, error); 30541 } 30542 30543 resetCurrentFiber(); 30544 30545 if (fiber === subtreeRoot) { 30546 nextEffect = null; 30547 return; 30548 } 30549 30550 var sibling = fiber.sibling; 30551 30552 if (sibling !== null) { 30553 // This node may have been reused from a previous render, so we can't 30554 // assume its return pointer is correct. 30555 sibling.return = fiber.return; 30556 nextEffect = sibling; 30557 return; 30558 } 30559 30560 nextEffect = fiber.return; 30561 } 30562} 30563 30564function commitPassiveMountEffects(root, finishedWork, committedLanes, committedTransitions) { 30565 nextEffect = finishedWork; 30566 commitPassiveMountEffects_begin(finishedWork, root, committedLanes, committedTransitions); 30567} 30568 30569function commitPassiveMountEffects_begin(subtreeRoot, root, committedLanes, committedTransitions) { 30570 while (nextEffect !== null) { 30571 var fiber = nextEffect; 30572 var firstChild = fiber.child; 30573 30574 if ((fiber.subtreeFlags & PassiveMask) !== NoFlags && firstChild !== null) { 30575 firstChild.return = fiber; 30576 nextEffect = firstChild; 30577 } else { 30578 commitPassiveMountEffects_complete(subtreeRoot, root, committedLanes, committedTransitions); 30579 } 30580 } 30581} 30582 30583function commitPassiveMountEffects_complete(subtreeRoot, root, committedLanes, committedTransitions) { 30584 while (nextEffect !== null) { 30585 var fiber = nextEffect; 30586 30587 if ((fiber.flags & Passive) !== NoFlags) { 30588 setCurrentFiber(fiber); 30589 30590 try { 30591 commitPassiveMountOnFiber(root, fiber, committedLanes, committedTransitions); 30592 } catch (error) { 30593 captureCommitPhaseError(fiber, fiber.return, error); 30594 } 30595 30596 resetCurrentFiber(); 30597 } 30598 30599 if (fiber === subtreeRoot) { 30600 nextEffect = null; 30601 return; 30602 } 30603 30604 var sibling = fiber.sibling; 30605 30606 if (sibling !== null) { 30607 sibling.return = fiber.return; 30608 nextEffect = sibling; 30609 return; 30610 } 30611 30612 nextEffect = fiber.return; 30613 } 30614} 30615 30616function commitPassiveMountOnFiber(finishedRoot, finishedWork, committedLanes, committedTransitions) { 30617 switch (finishedWork.tag) { 30618 case FunctionComponent: 30619 case ForwardRef: 30620 case SimpleMemoComponent: 30621 { 30622 if ( finishedWork.mode & ProfileMode) { 30623 startPassiveEffectTimer(); 30624 30625 try { 30626 commitHookEffectListMount(Passive$1 | HasEffect, finishedWork); 30627 } finally { 30628 recordPassiveEffectDuration(finishedWork); 30629 } 30630 } else { 30631 commitHookEffectListMount(Passive$1 | HasEffect, finishedWork); 30632 } 30633 30634 break; 30635 } 30636 } 30637} 30638 30639function commitPassiveUnmountEffects(firstChild) { 30640 nextEffect = firstChild; 30641 commitPassiveUnmountEffects_begin(); 30642} 30643 30644function commitPassiveUnmountEffects_begin() { 30645 while (nextEffect !== null) { 30646 var fiber = nextEffect; 30647 var child = fiber.child; 30648 30649 if ((nextEffect.flags & ChildDeletion) !== NoFlags) { 30650 var deletions = fiber.deletions; 30651 30652 if (deletions !== null) { 30653 for (var i = 0; i < deletions.length; i++) { 30654 var fiberToDelete = deletions[i]; 30655 nextEffect = fiberToDelete; 30656 commitPassiveUnmountEffectsInsideOfDeletedTree_begin(fiberToDelete, fiber); 30657 } 30658 30659 { 30660 // A fiber was deleted from this parent fiber, but it's still part of 30661 // the previous (alternate) parent fiber's list of children. Because 30662 // children are a linked list, an earlier sibling that's still alive 30663 // will be connected to the deleted fiber via its `alternate`: 30664 // 30665 // live fiber 30666 // --alternate--> previous live fiber 30667 // --sibling--> deleted fiber 30668 // 30669 // We can't disconnect `alternate` on nodes that haven't been deleted 30670 // yet, but we can disconnect the `sibling` and `child` pointers. 30671 var previousFiber = fiber.alternate; 30672 30673 if (previousFiber !== null) { 30674 var detachedChild = previousFiber.child; 30675 30676 if (detachedChild !== null) { 30677 previousFiber.child = null; 30678 30679 do { 30680 var detachedSibling = detachedChild.sibling; 30681 detachedChild.sibling = null; 30682 detachedChild = detachedSibling; 30683 } while (detachedChild !== null); 30684 } 30685 } 30686 } 30687 30688 nextEffect = fiber; 30689 } 30690 } 30691 30692 if ((fiber.subtreeFlags & PassiveMask) !== NoFlags && child !== null) { 30693 child.return = fiber; 30694 nextEffect = child; 30695 } else { 30696 commitPassiveUnmountEffects_complete(); 30697 } 30698 } 30699} 30700 30701function commitPassiveUnmountEffects_complete() { 30702 while (nextEffect !== null) { 30703 var fiber = nextEffect; 30704 30705 if ((fiber.flags & Passive) !== NoFlags) { 30706 setCurrentFiber(fiber); 30707 commitPassiveUnmountOnFiber(fiber); 30708 resetCurrentFiber(); 30709 } 30710 30711 var sibling = fiber.sibling; 30712 30713 if (sibling !== null) { 30714 sibling.return = fiber.return; 30715 nextEffect = sibling; 30716 return; 30717 } 30718 30719 nextEffect = fiber.return; 30720 } 30721} 30722 30723function commitPassiveUnmountOnFiber(finishedWork) { 30724 switch (finishedWork.tag) { 30725 case FunctionComponent: 30726 case ForwardRef: 30727 case SimpleMemoComponent: 30728 { 30729 if ( finishedWork.mode & ProfileMode) { 30730 startPassiveEffectTimer(); 30731 commitHookEffectListUnmount(Passive$1 | HasEffect, finishedWork, finishedWork.return); 30732 recordPassiveEffectDuration(finishedWork); 30733 } else { 30734 commitHookEffectListUnmount(Passive$1 | HasEffect, finishedWork, finishedWork.return); 30735 } 30736 30737 break; 30738 } 30739 } 30740} 30741 30742function commitPassiveUnmountEffectsInsideOfDeletedTree_begin(deletedSubtreeRoot, nearestMountedAncestor) { 30743 while (nextEffect !== null) { 30744 var fiber = nextEffect; // Deletion effects fire in parent -> child order 30745 // TODO: Check if fiber has a PassiveStatic flag 30746 30747 setCurrentFiber(fiber); 30748 commitPassiveUnmountInsideDeletedTreeOnFiber(fiber, nearestMountedAncestor); 30749 resetCurrentFiber(); 30750 var child = fiber.child; // TODO: Only traverse subtree if it has a PassiveStatic flag. (But, if we 30751 // do this, still need to handle `deletedTreeCleanUpLevel` correctly.) 30752 30753 if (child !== null) { 30754 child.return = fiber; 30755 nextEffect = child; 30756 } else { 30757 commitPassiveUnmountEffectsInsideOfDeletedTree_complete(deletedSubtreeRoot); 30758 } 30759 } 30760} 30761 30762function commitPassiveUnmountEffectsInsideOfDeletedTree_complete(deletedSubtreeRoot) { 30763 while (nextEffect !== null) { 30764 var fiber = nextEffect; 30765 var sibling = fiber.sibling; 30766 var returnFiber = fiber.return; 30767 30768 { 30769 // Recursively traverse the entire deleted tree and clean up fiber fields. 30770 // This is more aggressive than ideal, and the long term goal is to only 30771 // have to detach the deleted tree at the root. 30772 detachFiberAfterEffects(fiber); 30773 30774 if (fiber === deletedSubtreeRoot) { 30775 nextEffect = null; 30776 return; 30777 } 30778 } 30779 30780 if (sibling !== null) { 30781 sibling.return = returnFiber; 30782 nextEffect = sibling; 30783 return; 30784 } 30785 30786 nextEffect = returnFiber; 30787 } 30788} 30789 30790function commitPassiveUnmountInsideDeletedTreeOnFiber(current, nearestMountedAncestor) { 30791 switch (current.tag) { 30792 case FunctionComponent: 30793 case ForwardRef: 30794 case SimpleMemoComponent: 30795 { 30796 if ( current.mode & ProfileMode) { 30797 startPassiveEffectTimer(); 30798 commitHookEffectListUnmount(Passive$1, current, nearestMountedAncestor); 30799 recordPassiveEffectDuration(current); 30800 } else { 30801 commitHookEffectListUnmount(Passive$1, current, nearestMountedAncestor); 30802 } 30803 30804 break; 30805 } 30806 } 30807} // TODO: Reuse reappearLayoutEffects traversal here? 30808 30809 30810function invokeLayoutEffectMountInDEV(fiber) { 30811 { 30812 // We don't need to re-check StrictEffectsMode here. 30813 // This function is only called if that check has already passed. 30814 switch (fiber.tag) { 30815 case FunctionComponent: 30816 case ForwardRef: 30817 case SimpleMemoComponent: 30818 { 30819 try { 30820 commitHookEffectListMount(Layout | HasEffect, fiber); 30821 } catch (error) { 30822 captureCommitPhaseError(fiber, fiber.return, error); 30823 } 30824 30825 break; 30826 } 30827 30828 case ClassComponent: 30829 { 30830 var instance = fiber.stateNode; 30831 30832 try { 30833 instance.componentDidMount(); 30834 } catch (error) { 30835 captureCommitPhaseError(fiber, fiber.return, error); 30836 } 30837 30838 break; 30839 } 30840 } 30841 } 30842} 30843 30844function invokePassiveEffectMountInDEV(fiber) { 30845 { 30846 // We don't need to re-check StrictEffectsMode here. 30847 // This function is only called if that check has already passed. 30848 switch (fiber.tag) { 30849 case FunctionComponent: 30850 case ForwardRef: 30851 case SimpleMemoComponent: 30852 { 30853 try { 30854 commitHookEffectListMount(Passive$1 | HasEffect, fiber); 30855 } catch (error) { 30856 captureCommitPhaseError(fiber, fiber.return, error); 30857 } 30858 30859 break; 30860 } 30861 } 30862 } 30863} 30864 30865function invokeLayoutEffectUnmountInDEV(fiber) { 30866 { 30867 // We don't need to re-check StrictEffectsMode here. 30868 // This function is only called if that check has already passed. 30869 switch (fiber.tag) { 30870 case FunctionComponent: 30871 case ForwardRef: 30872 case SimpleMemoComponent: 30873 { 30874 try { 30875 commitHookEffectListUnmount(Layout | HasEffect, fiber, fiber.return); 30876 } catch (error) { 30877 captureCommitPhaseError(fiber, fiber.return, error); 30878 } 30879 30880 break; 30881 } 30882 30883 case ClassComponent: 30884 { 30885 var instance = fiber.stateNode; 30886 30887 if (typeof instance.componentWillUnmount === 'function') { 30888 safelyCallComponentWillUnmount(fiber, fiber.return, instance); 30889 } 30890 30891 break; 30892 } 30893 } 30894 } 30895} 30896 30897function invokePassiveEffectUnmountInDEV(fiber) { 30898 { 30899 // We don't need to re-check StrictEffectsMode here. 30900 // This function is only called if that check has already passed. 30901 switch (fiber.tag) { 30902 case FunctionComponent: 30903 case ForwardRef: 30904 case SimpleMemoComponent: 30905 { 30906 try { 30907 commitHookEffectListUnmount(Passive$1 | HasEffect, fiber, fiber.return); 30908 } catch (error) { 30909 captureCommitPhaseError(fiber, fiber.return, error); 30910 } 30911 } 30912 } 30913 } 30914} 30915 30916var COMPONENT_TYPE = 0; 30917var HAS_PSEUDO_CLASS_TYPE = 1; 30918var ROLE_TYPE = 2; 30919var TEST_NAME_TYPE = 3; 30920var TEXT_TYPE = 4; 30921 30922if (typeof Symbol === 'function' && Symbol.for) { 30923 var symbolFor = Symbol.for; 30924 COMPONENT_TYPE = symbolFor('selector.component'); 30925 HAS_PSEUDO_CLASS_TYPE = symbolFor('selector.has_pseudo_class'); 30926 ROLE_TYPE = symbolFor('selector.role'); 30927 TEST_NAME_TYPE = symbolFor('selector.test_id'); 30928 TEXT_TYPE = symbolFor('selector.text'); 30929} 30930var commitHooks = []; 30931function onCommitRoot$1() { 30932 { 30933 commitHooks.forEach(function (commitHook) { 30934 return commitHook(); 30935 }); 30936 } 30937} 30938 30939var ReactCurrentActQueue = ReactSharedInternals.ReactCurrentActQueue; 30940function isLegacyActEnvironment(fiber) { 30941 { 30942 // Legacy mode. We preserve the behavior of React 17's act. It assumes an 30943 // act environment whenever `jest` is defined, but you can still turn off 30944 // spurious warnings by setting IS_REACT_ACT_ENVIRONMENT explicitly 30945 // to false. 30946 var isReactActEnvironmentGlobal = // $FlowExpectedError – Flow doesn't know about IS_REACT_ACT_ENVIRONMENT global 30947 typeof IS_REACT_ACT_ENVIRONMENT !== 'undefined' ? IS_REACT_ACT_ENVIRONMENT : undefined; // $FlowExpectedError - Flow doesn't know about jest 30948 30949 var jestIsDefined = typeof jest !== 'undefined'; 30950 return jestIsDefined && isReactActEnvironmentGlobal !== false; 30951 } 30952} 30953function isConcurrentActEnvironment() { 30954 { 30955 var isReactActEnvironmentGlobal = // $FlowExpectedError – Flow doesn't know about IS_REACT_ACT_ENVIRONMENT global 30956 typeof IS_REACT_ACT_ENVIRONMENT !== 'undefined' ? IS_REACT_ACT_ENVIRONMENT : undefined; 30957 30958 if (!isReactActEnvironmentGlobal && ReactCurrentActQueue.current !== null) { 30959 // TODO: Include link to relevant documentation page. 30960 error('The current testing environment is not configured to support ' + 'act(...)'); 30961 } 30962 30963 return isReactActEnvironmentGlobal; 30964 } 30965} 30966 30967var ceil = Math.ceil; 30968var ReactCurrentDispatcher$2 = ReactSharedInternals.ReactCurrentDispatcher, 30969 ReactCurrentOwner$2 = ReactSharedInternals.ReactCurrentOwner, 30970 ReactCurrentBatchConfig$3 = ReactSharedInternals.ReactCurrentBatchConfig, 30971 ReactCurrentActQueue$1 = ReactSharedInternals.ReactCurrentActQueue; 30972var NoContext = 30973/* */ 309740; 30975var BatchedContext = 30976/* */ 309771; 30978var RenderContext = 30979/* */ 309802; 30981var CommitContext = 30982/* */ 309834; 30984var RootInProgress = 0; 30985var RootFatalErrored = 1; 30986var RootErrored = 2; 30987var RootSuspended = 3; 30988var RootSuspendedWithDelay = 4; 30989var RootCompleted = 5; 30990var RootDidNotComplete = 6; // Describes where we are in the React execution stack 30991 30992var executionContext = NoContext; // The root we're working on 30993 30994var workInProgressRoot = null; // The fiber we're working on 30995 30996var workInProgress = null; // The lanes we're rendering 30997 30998var workInProgressRootRenderLanes = NoLanes; // Stack that allows components to change the render lanes for its subtree 30999// This is a superset of the lanes we started working on at the root. The only 31000// case where it's different from `workInProgressRootRenderLanes` is when we 31001// enter a subtree that is hidden and needs to be unhidden: Suspense and 31002// Offscreen component. 31003// 31004// Most things in the work loop should deal with workInProgressRootRenderLanes. 31005// Most things in begin/complete phases should deal with subtreeRenderLanes. 31006 31007var subtreeRenderLanes = NoLanes; 31008var subtreeRenderLanesCursor = createCursor(NoLanes); // Whether to root completed, errored, suspended, etc. 31009 31010var workInProgressRootExitStatus = RootInProgress; // A fatal error, if one is thrown 31011 31012var workInProgressRootFatalError = null; // "Included" lanes refer to lanes that were worked on during this render. It's 31013// slightly different than `renderLanes` because `renderLanes` can change as you 31014// enter and exit an Offscreen tree. This value is the combination of all render 31015// lanes for the entire render phase. 31016 31017var workInProgressRootIncludedLanes = NoLanes; // The work left over by components that were visited during this render. Only 31018// includes unprocessed updates, not work in bailed out children. 31019 31020var workInProgressRootSkippedLanes = NoLanes; // Lanes that were updated (in an interleaved event) during this render. 31021 31022var workInProgressRootInterleavedUpdatedLanes = NoLanes; // Lanes that were updated during the render phase (*not* an interleaved event). 31023 31024var workInProgressRootPingedLanes = NoLanes; // Errors that are thrown during the render phase. 31025 31026var workInProgressRootConcurrentErrors = null; // These are errors that we recovered from without surfacing them to the UI. 31027// We will log them once the tree commits. 31028 31029var workInProgressRootRecoverableErrors = null; // The most recent time we committed a fallback. This lets us ensure a train 31030// model where we don't commit new loading states in too quick succession. 31031 31032var globalMostRecentFallbackTime = 0; 31033var FALLBACK_THROTTLE_MS = 500; // The absolute time for when we should start giving up on rendering 31034// more and prefer CPU suspense heuristics instead. 31035 31036var workInProgressRootRenderTargetTime = Infinity; // How long a render is supposed to take before we start following CPU 31037// suspense heuristics and opt out of rendering more content. 31038 31039var RENDER_TIMEOUT_MS = 500; 31040var workInProgressTransitions = null; 31041 31042function resetRenderTimer() { 31043 workInProgressRootRenderTargetTime = now() + RENDER_TIMEOUT_MS; 31044} 31045 31046function getRenderTargetTime() { 31047 return workInProgressRootRenderTargetTime; 31048} 31049var hasUncaughtError = false; 31050var firstUncaughtError = null; 31051var legacyErrorBoundariesThatAlreadyFailed = null; // Only used when enableProfilerNestedUpdateScheduledHook is true; 31052var rootDoesHavePassiveEffects = false; 31053var rootWithPendingPassiveEffects = null; 31054var pendingPassiveEffectsLanes = NoLanes; 31055var pendingPassiveProfilerEffects = []; 31056var pendingPassiveTransitions = null; // Use these to prevent an infinite loop of nested updates 31057 31058var NESTED_UPDATE_LIMIT = 50; 31059var nestedUpdateCount = 0; 31060var rootWithNestedUpdates = null; 31061var isFlushingPassiveEffects = false; 31062var didScheduleUpdateDuringPassiveEffects = false; 31063var NESTED_PASSIVE_UPDATE_LIMIT = 50; 31064var nestedPassiveUpdateCount = 0; 31065var rootWithPassiveNestedUpdates = null; // If two updates are scheduled within the same event, we should treat their 31066// event times as simultaneous, even if the actual clock time has advanced 31067// between the first and second call. 31068 31069var currentEventTime = NoTimestamp; 31070var currentEventTransitionLane = NoLanes; 31071var isRunningInsertionEffect = false; 31072function getWorkInProgressRoot() { 31073 return workInProgressRoot; 31074} 31075function requestEventTime() { 31076 if ((executionContext & (RenderContext | CommitContext)) !== NoContext) { 31077 // We're inside React, so it's fine to read the actual time. 31078 return now(); 31079 } // We're not inside React, so we may be in the middle of a browser event. 31080 31081 31082 if (currentEventTime !== NoTimestamp) { 31083 // Use the same start time for all updates until we enter React again. 31084 return currentEventTime; 31085 } // This is the first update since React yielded. Compute a new start time. 31086 31087 31088 currentEventTime = now(); 31089 return currentEventTime; 31090} 31091function requestUpdateLane(fiber) { 31092 // Special cases 31093 var mode = fiber.mode; 31094 31095 if ((mode & ConcurrentMode) === NoMode) { 31096 return SyncLane; 31097 } else if ( (executionContext & RenderContext) !== NoContext && workInProgressRootRenderLanes !== NoLanes) { 31098 // This is a render phase update. These are not officially supported. The 31099 // old behavior is to give this the same "thread" (lanes) as 31100 // whatever is currently rendering. So if you call `setState` on a component 31101 // that happens later in the same render, it will flush. Ideally, we want to 31102 // remove the special case and treat them as if they came from an 31103 // interleaved event. Regardless, this pattern is not officially supported. 31104 // This behavior is only a fallback. The flag only exists until we can roll 31105 // out the setState warning, since existing code might accidentally rely on 31106 // the current behavior. 31107 return pickArbitraryLane(workInProgressRootRenderLanes); 31108 } 31109 31110 var isTransition = requestCurrentTransition() !== NoTransition; 31111 31112 if (isTransition) { 31113 if ( ReactCurrentBatchConfig$3.transition !== null) { 31114 var transition = ReactCurrentBatchConfig$3.transition; 31115 31116 if (!transition._updatedFibers) { 31117 transition._updatedFibers = new Set(); 31118 } 31119 31120 transition._updatedFibers.add(fiber); 31121 } // The algorithm for assigning an update to a lane should be stable for all 31122 // updates at the same priority within the same event. To do this, the 31123 // inputs to the algorithm must be the same. 31124 // 31125 // The trick we use is to cache the first of each of these inputs within an 31126 // event. Then reset the cached values once we can be sure the event is 31127 // over. Our heuristic for that is whenever we enter a concurrent work loop. 31128 31129 31130 if (currentEventTransitionLane === NoLane) { 31131 // All transitions within the same event are assigned the same lane. 31132 currentEventTransitionLane = claimNextTransitionLane(); 31133 } 31134 31135 return currentEventTransitionLane; 31136 } // Updates originating inside certain React methods, like flushSync, have 31137 // their priority set by tracking it with a context variable. 31138 // 31139 // The opaque type returned by the host config is internally a lane, so we can 31140 // use that directly. 31141 // TODO: Move this type conversion to the event priority module. 31142 31143 31144 var updateLane = getCurrentUpdatePriority(); 31145 31146 if (updateLane !== NoLane) { 31147 return updateLane; 31148 } // This update originated outside React. Ask the host environment for an 31149 // appropriate priority, based on the type of event. 31150 // 31151 // The opaque type returned by the host config is internally a lane, so we can 31152 // use that directly. 31153 // TODO: Move this type conversion to the event priority module. 31154 31155 31156 var eventLane = getCurrentEventPriority(); 31157 return eventLane; 31158} 31159 31160function requestRetryLane(fiber) { 31161 // This is a fork of `requestUpdateLane` designed specifically for Suspense 31162 // "retries" — a special update that attempts to flip a Suspense boundary 31163 // from its placeholder state to its primary/resolved state. 31164 // Special cases 31165 var mode = fiber.mode; 31166 31167 if ((mode & ConcurrentMode) === NoMode) { 31168 return SyncLane; 31169 } 31170 31171 return claimNextRetryLane(); 31172} 31173 31174function scheduleUpdateOnFiber(root, fiber, lane, eventTime) { 31175 checkForNestedUpdates(); 31176 31177 { 31178 if (isRunningInsertionEffect) { 31179 error('useInsertionEffect must not schedule updates.'); 31180 } 31181 } 31182 31183 { 31184 if (isFlushingPassiveEffects) { 31185 didScheduleUpdateDuringPassiveEffects = true; 31186 } 31187 } // Mark that the root has a pending update. 31188 31189 31190 markRootUpdated(root, lane, eventTime); 31191 31192 if ((executionContext & RenderContext) !== NoLanes && root === workInProgressRoot) { 31193 // This update was dispatched during the render phase. This is a mistake 31194 // if the update originates from user space (with the exception of local 31195 // hook updates, which are handled differently and don't reach this 31196 // function), but there are some internal React features that use this as 31197 // an implementation detail, like selective hydration. 31198 warnAboutRenderPhaseUpdatesInDEV(fiber); // Track lanes that were updated during the render phase 31199 } else { 31200 // This is a normal update, scheduled from outside the render phase. For 31201 // example, during an input event. 31202 { 31203 if (isDevToolsPresent) { 31204 addFiberToLanesMap(root, fiber, lane); 31205 } 31206 } 31207 31208 warnIfUpdatesNotWrappedWithActDEV(fiber); 31209 31210 if (root === workInProgressRoot) { 31211 // Received an update to a tree that's in the middle of rendering. Mark 31212 // that there was an interleaved update work on this root. Unless the 31213 // `deferRenderPhaseUpdateToNextBatch` flag is off and this is a render 31214 // phase update. In that case, we don't treat render phase updates as if 31215 // they were interleaved, for backwards compat reasons. 31216 if ( (executionContext & RenderContext) === NoContext) { 31217 workInProgressRootInterleavedUpdatedLanes = mergeLanes(workInProgressRootInterleavedUpdatedLanes, lane); 31218 } 31219 31220 if (workInProgressRootExitStatus === RootSuspendedWithDelay) { 31221 // The root already suspended with a delay, which means this render 31222 // definitely won't finish. Since we have a new update, let's mark it as 31223 // suspended now, right before marking the incoming update. This has the 31224 // effect of interrupting the current render and switching to the update. 31225 // TODO: Make sure this doesn't override pings that happen while we've 31226 // already started rendering. 31227 markRootSuspended$1(root, workInProgressRootRenderLanes); 31228 } 31229 } 31230 31231 ensureRootIsScheduled(root, eventTime); 31232 31233 if (lane === SyncLane && executionContext === NoContext && (fiber.mode & ConcurrentMode) === NoMode && // Treat `act` as if it's inside `batchedUpdates`, even in legacy mode. 31234 !( ReactCurrentActQueue$1.isBatchingLegacy)) { 31235 // Flush the synchronous work now, unless we're already working or inside 31236 // a batch. This is intentionally inside scheduleUpdateOnFiber instead of 31237 // scheduleCallbackForFiber to preserve the ability to schedule a callback 31238 // without immediately flushing it. We only do this for user-initiated 31239 // updates, to preserve historical behavior of legacy mode. 31240 resetRenderTimer(); 31241 flushSyncCallbacksOnlyInLegacyMode(); 31242 } 31243 } 31244} 31245function scheduleInitialHydrationOnRoot(root, lane, eventTime) { 31246 // This is a special fork of scheduleUpdateOnFiber that is only used to 31247 // schedule the initial hydration of a root that has just been created. Most 31248 // of the stuff in scheduleUpdateOnFiber can be skipped. 31249 // 31250 // The main reason for this separate path, though, is to distinguish the 31251 // initial children from subsequent updates. In fully client-rendered roots 31252 // (createRoot instead of hydrateRoot), all top-level renders are modeled as 31253 // updates, but hydration roots are special because the initial render must 31254 // match what was rendered on the server. 31255 var current = root.current; 31256 current.lanes = lane; 31257 markRootUpdated(root, lane, eventTime); 31258 ensureRootIsScheduled(root, eventTime); 31259} 31260function isUnsafeClassRenderPhaseUpdate(fiber) { 31261 // Check if this is a render phase update. Only called by class components, 31262 // which special (deprecated) behavior for UNSAFE_componentWillReceive props. 31263 return (// TODO: Remove outdated deferRenderPhaseUpdateToNextBatch experiment. We 31264 // decided not to enable it. 31265 (executionContext & RenderContext) !== NoContext 31266 ); 31267} // Use this function to schedule a task for a root. There's only one task per 31268// root; if a task was already scheduled, we'll check to make sure the priority 31269// of the existing task is the same as the priority of the next level that the 31270// root has work on. This function is called on every update, and right before 31271// exiting a task. 31272 31273function ensureRootIsScheduled(root, currentTime) { 31274 var existingCallbackNode = root.callbackNode; // Check if any lanes are being starved by other work. If so, mark them as 31275 // expired so we know to work on those next. 31276 31277 markStarvedLanesAsExpired(root, currentTime); // Determine the next lanes to work on, and their priority. 31278 31279 var nextLanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes); 31280 31281 if (nextLanes === NoLanes) { 31282 // Special case: There's nothing to work on. 31283 if (existingCallbackNode !== null) { 31284 cancelCallback$1(existingCallbackNode); 31285 } 31286 31287 root.callbackNode = null; 31288 root.callbackPriority = NoLane; 31289 return; 31290 } // We use the highest priority lane to represent the priority of the callback. 31291 31292 31293 var newCallbackPriority = getHighestPriorityLane(nextLanes); // Check if there's an existing task. We may be able to reuse it. 31294 31295 var existingCallbackPriority = root.callbackPriority; 31296 31297 if (existingCallbackPriority === newCallbackPriority && // Special case related to `act`. If the currently scheduled task is a 31298 // Scheduler task, rather than an `act` task, cancel it and re-scheduled 31299 // on the `act` queue. 31300 !( ReactCurrentActQueue$1.current !== null && existingCallbackNode !== fakeActCallbackNode)) { 31301 { 31302 // If we're going to re-use an existing task, it needs to exist. 31303 // Assume that discrete update microtasks are non-cancellable and null. 31304 // TODO: Temporary until we confirm this warning is not fired. 31305 if (existingCallbackNode == null && existingCallbackPriority !== SyncLane) { 31306 error('Expected scheduled callback to exist. This error is likely caused by a bug in React. Please file an issue.'); 31307 } 31308 } // The priority hasn't changed. We can reuse the existing task. Exit. 31309 31310 31311 return; 31312 } 31313 31314 if (existingCallbackNode != null) { 31315 // Cancel the existing callback. We'll schedule a new one below. 31316 cancelCallback$1(existingCallbackNode); 31317 } // Schedule a new callback. 31318 31319 31320 var newCallbackNode; 31321 31322 if (newCallbackPriority === SyncLane) { 31323 // Special case: Sync React callbacks are scheduled on a special 31324 // internal queue 31325 if (root.tag === LegacyRoot) { 31326 if ( ReactCurrentActQueue$1.isBatchingLegacy !== null) { 31327 ReactCurrentActQueue$1.didScheduleLegacyUpdate = true; 31328 } 31329 31330 scheduleLegacySyncCallback(performSyncWorkOnRoot.bind(null, root)); 31331 } else { 31332 scheduleSyncCallback(performSyncWorkOnRoot.bind(null, root)); 31333 } 31334 31335 { 31336 // Flush the queue in a microtask. 31337 if ( ReactCurrentActQueue$1.current !== null) { 31338 // Inside `act`, use our internal `act` queue so that these get flushed 31339 // at the end of the current scope even when using the sync version 31340 // of `act`. 31341 ReactCurrentActQueue$1.current.push(flushSyncCallbacks); 31342 } else { 31343 scheduleMicrotask(function () { 31344 // In Safari, appending an iframe forces microtasks to run. 31345 // https://github.com/facebook/react/issues/22459 31346 // We don't support running callbacks in the middle of render 31347 // or commit so we need to check against that. 31348 if ((executionContext & (RenderContext | CommitContext)) === NoContext) { 31349 // Note that this would still prematurely flush the callbacks 31350 // if this happens outside render or commit phase (e.g. in an event). 31351 flushSyncCallbacks(); 31352 } 31353 }); 31354 } 31355 } 31356 31357 newCallbackNode = null; 31358 } else { 31359 var schedulerPriorityLevel; 31360 31361 switch (lanesToEventPriority(nextLanes)) { 31362 case DiscreteEventPriority: 31363 schedulerPriorityLevel = ImmediatePriority; 31364 break; 31365 31366 case ContinuousEventPriority: 31367 schedulerPriorityLevel = UserBlockingPriority; 31368 break; 31369 31370 case DefaultEventPriority: 31371 schedulerPriorityLevel = NormalPriority; 31372 break; 31373 31374 case IdleEventPriority: 31375 schedulerPriorityLevel = IdlePriority; 31376 break; 31377 31378 default: 31379 schedulerPriorityLevel = NormalPriority; 31380 break; 31381 } 31382 31383 newCallbackNode = scheduleCallback$1(schedulerPriorityLevel, performConcurrentWorkOnRoot.bind(null, root)); 31384 } 31385 31386 root.callbackPriority = newCallbackPriority; 31387 root.callbackNode = newCallbackNode; 31388} // This is the entry point for every concurrent task, i.e. anything that 31389// goes through Scheduler. 31390 31391 31392function performConcurrentWorkOnRoot(root, didTimeout) { 31393 { 31394 resetNestedUpdateFlag(); 31395 } // Since we know we're in a React event, we can clear the current 31396 // event time. The next update will compute a new event time. 31397 31398 31399 currentEventTime = NoTimestamp; 31400 currentEventTransitionLane = NoLanes; 31401 31402 if ((executionContext & (RenderContext | CommitContext)) !== NoContext) { 31403 throw new Error('Should not already be working.'); 31404 } // Flush any pending passive effects before deciding which lanes to work on, 31405 // in case they schedule additional work. 31406 31407 31408 var originalCallbackNode = root.callbackNode; 31409 var didFlushPassiveEffects = flushPassiveEffects(); 31410 31411 if (didFlushPassiveEffects) { 31412 // Something in the passive effect phase may have canceled the current task. 31413 // Check if the task node for this root was changed. 31414 if (root.callbackNode !== originalCallbackNode) { 31415 // The current task was canceled. Exit. We don't need to call 31416 // `ensureRootIsScheduled` because the check above implies either that 31417 // there's a new task, or that there's no remaining work on this root. 31418 return null; 31419 } 31420 } // Determine the next lanes to work on, using the fields stored 31421 // on the root. 31422 31423 31424 var lanes = getNextLanes(root, root === workInProgressRoot ? workInProgressRootRenderLanes : NoLanes); 31425 31426 if (lanes === NoLanes) { 31427 // Defensive coding. This is never expected to happen. 31428 return null; 31429 } // We disable time-slicing in some cases: if the work has been CPU-bound 31430 // for too long ("expired" work, to prevent starvation), or we're in 31431 // sync-updates-by-default mode. 31432 // TODO: We only check `didTimeout` defensively, to account for a Scheduler 31433 // bug we're still investigating. Once the bug in Scheduler is fixed, 31434 // we can remove this, since we track expiration ourselves. 31435 31436 31437 var shouldTimeSlice = !includesBlockingLane(root, lanes) && !includesExpiredLane(root, lanes) && ( !didTimeout); 31438 var exitStatus = shouldTimeSlice ? renderRootConcurrent(root, lanes) : renderRootSync(root, lanes); 31439 31440 if (exitStatus !== RootInProgress) { 31441 if (exitStatus === RootErrored) { 31442 // If something threw an error, try rendering one more time. We'll 31443 // render synchronously to block concurrent data mutations, and we'll 31444 // includes all pending updates are included. If it still fails after 31445 // the second attempt, we'll give up and commit the resulting tree. 31446 var errorRetryLanes = getLanesToRetrySynchronouslyOnError(root); 31447 31448 if (errorRetryLanes !== NoLanes) { 31449 lanes = errorRetryLanes; 31450 exitStatus = recoverFromConcurrentError(root, errorRetryLanes); 31451 } 31452 } 31453 31454 if (exitStatus === RootFatalErrored) { 31455 var fatalError = workInProgressRootFatalError; 31456 prepareFreshStack(root, NoLanes); 31457 markRootSuspended$1(root, lanes); 31458 ensureRootIsScheduled(root, now()); 31459 throw fatalError; 31460 } 31461 31462 if (exitStatus === RootDidNotComplete) { 31463 // The render unwound without completing the tree. This happens in special 31464 // cases where need to exit the current render without producing a 31465 // consistent tree or committing. 31466 // 31467 // This should only happen during a concurrent render, not a discrete or 31468 // synchronous update. We should have already checked for this when we 31469 // unwound the stack. 31470 markRootSuspended$1(root, lanes); 31471 } else { 31472 // The render completed. 31473 // Check if this render may have yielded to a concurrent event, and if so, 31474 // confirm that any newly rendered stores are consistent. 31475 // TODO: It's possible that even a concurrent render may never have yielded 31476 // to the main thread, if it was fast enough, or if it expired. We could 31477 // skip the consistency check in that case, too. 31478 var renderWasConcurrent = !includesBlockingLane(root, lanes); 31479 var finishedWork = root.current.alternate; 31480 31481 if (renderWasConcurrent && !isRenderConsistentWithExternalStores(finishedWork)) { 31482 // A store was mutated in an interleaved event. Render again, 31483 // synchronously, to block further mutations. 31484 exitStatus = renderRootSync(root, lanes); // We need to check again if something threw 31485 31486 if (exitStatus === RootErrored) { 31487 var _errorRetryLanes = getLanesToRetrySynchronouslyOnError(root); 31488 31489 if (_errorRetryLanes !== NoLanes) { 31490 lanes = _errorRetryLanes; 31491 exitStatus = recoverFromConcurrentError(root, _errorRetryLanes); // We assume the tree is now consistent because we didn't yield to any 31492 // concurrent events. 31493 } 31494 } 31495 31496 if (exitStatus === RootFatalErrored) { 31497 var _fatalError = workInProgressRootFatalError; 31498 prepareFreshStack(root, NoLanes); 31499 markRootSuspended$1(root, lanes); 31500 ensureRootIsScheduled(root, now()); 31501 throw _fatalError; 31502 } 31503 } // We now have a consistent tree. The next step is either to commit it, 31504 // or, if something suspended, wait to commit it after a timeout. 31505 31506 31507 root.finishedWork = finishedWork; 31508 root.finishedLanes = lanes; 31509 finishConcurrentRender(root, exitStatus, lanes); 31510 } 31511 } 31512 31513 ensureRootIsScheduled(root, now()); 31514 31515 if (root.callbackNode === originalCallbackNode) { 31516 // The task node scheduled for this root is the same one that's 31517 // currently executed. Need to return a continuation. 31518 return performConcurrentWorkOnRoot.bind(null, root); 31519 } 31520 31521 return null; 31522} 31523 31524function recoverFromConcurrentError(root, errorRetryLanes) { 31525 // If an error occurred during hydration, discard server response and fall 31526 // back to client side render. 31527 // Before rendering again, save the errors from the previous attempt. 31528 var errorsFromFirstAttempt = workInProgressRootConcurrentErrors; 31529 31530 if (isRootDehydrated(root)) { 31531 // The shell failed to hydrate. Set a flag to force a client rendering 31532 // during the next attempt. To do this, we call prepareFreshStack now 31533 // to create the root work-in-progress fiber. This is a bit weird in terms 31534 // of factoring, because it relies on renderRootSync not calling 31535 // prepareFreshStack again in the call below, which happens because the 31536 // root and lanes haven't changed. 31537 // 31538 // TODO: I think what we should do is set ForceClientRender inside 31539 // throwException, like we do for nested Suspense boundaries. The reason 31540 // it's here instead is so we can switch to the synchronous work loop, too. 31541 // Something to consider for a future refactor. 31542 var rootWorkInProgress = prepareFreshStack(root, errorRetryLanes); 31543 rootWorkInProgress.flags |= ForceClientRender; 31544 31545 { 31546 errorHydratingContainer(root.containerInfo); 31547 } 31548 } 31549 31550 var exitStatus = renderRootSync(root, errorRetryLanes); 31551 31552 if (exitStatus !== RootErrored) { 31553 // Successfully finished rendering on retry 31554 // The errors from the failed first attempt have been recovered. Add 31555 // them to the collection of recoverable errors. We'll log them in the 31556 // commit phase. 31557 var errorsFromSecondAttempt = workInProgressRootRecoverableErrors; 31558 workInProgressRootRecoverableErrors = errorsFromFirstAttempt; // The errors from the second attempt should be queued after the errors 31559 // from the first attempt, to preserve the causal sequence. 31560 31561 if (errorsFromSecondAttempt !== null) { 31562 queueRecoverableErrors(errorsFromSecondAttempt); 31563 } 31564 } 31565 31566 return exitStatus; 31567} 31568 31569function queueRecoverableErrors(errors) { 31570 if (workInProgressRootRecoverableErrors === null) { 31571 workInProgressRootRecoverableErrors = errors; 31572 } else { 31573 workInProgressRootRecoverableErrors.push.apply(workInProgressRootRecoverableErrors, errors); 31574 } 31575} 31576 31577function finishConcurrentRender(root, exitStatus, lanes) { 31578 switch (exitStatus) { 31579 case RootInProgress: 31580 case RootFatalErrored: 31581 { 31582 throw new Error('Root did not complete. This is a bug in React.'); 31583 } 31584 // Flow knows about invariant, so it complains if I add a break 31585 // statement, but eslint doesn't know about invariant, so it complains 31586 // if I do. eslint-disable-next-line no-fallthrough 31587 31588 case RootErrored: 31589 { 31590 // We should have already attempted to retry this tree. If we reached 31591 // this point, it errored again. Commit it. 31592 commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); 31593 break; 31594 } 31595 31596 case RootSuspended: 31597 { 31598 markRootSuspended$1(root, lanes); // We have an acceptable loading state. We need to figure out if we 31599 // should immediately commit it or wait a bit. 31600 31601 if (includesOnlyRetries(lanes) && // do not delay if we're inside an act() scope 31602 !shouldForceFlushFallbacksInDEV()) { 31603 // This render only included retries, no updates. Throttle committing 31604 // retries so that we don't show too many loading states too quickly. 31605 var msUntilTimeout = globalMostRecentFallbackTime + FALLBACK_THROTTLE_MS - now(); // Don't bother with a very short suspense time. 31606 31607 if (msUntilTimeout > 10) { 31608 var nextLanes = getNextLanes(root, NoLanes); 31609 31610 if (nextLanes !== NoLanes) { 31611 // There's additional work on this root. 31612 break; 31613 } 31614 31615 var suspendedLanes = root.suspendedLanes; 31616 31617 if (!isSubsetOfLanes(suspendedLanes, lanes)) { 31618 // We should prefer to render the fallback of at the last 31619 // suspended level. Ping the last suspended level to try 31620 // rendering it again. 31621 // FIXME: What if the suspended lanes are Idle? Should not restart. 31622 var eventTime = requestEventTime(); 31623 markRootPinged(root, suspendedLanes); 31624 break; 31625 } // The render is suspended, it hasn't timed out, and there's no 31626 // lower priority work to do. Instead of committing the fallback 31627 // immediately, wait for more data to arrive. 31628 31629 31630 root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root, workInProgressRootRecoverableErrors, workInProgressTransitions), msUntilTimeout); 31631 break; 31632 } 31633 } // The work expired. Commit immediately. 31634 31635 31636 commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); 31637 break; 31638 } 31639 31640 case RootSuspendedWithDelay: 31641 { 31642 markRootSuspended$1(root, lanes); 31643 31644 if (includesOnlyTransitions(lanes)) { 31645 // This is a transition, so we should exit without committing a 31646 // placeholder and without scheduling a timeout. Delay indefinitely 31647 // until we receive more data. 31648 break; 31649 } 31650 31651 if (!shouldForceFlushFallbacksInDEV()) { 31652 // This is not a transition, but we did trigger an avoided state. 31653 // Schedule a placeholder to display after a short delay, using the Just 31654 // Noticeable Difference. 31655 // TODO: Is the JND optimization worth the added complexity? If this is 31656 // the only reason we track the event time, then probably not. 31657 // Consider removing. 31658 var mostRecentEventTime = getMostRecentEventTime(root, lanes); 31659 var eventTimeMs = mostRecentEventTime; 31660 var timeElapsedMs = now() - eventTimeMs; 31661 31662 var _msUntilTimeout = jnd(timeElapsedMs) - timeElapsedMs; // Don't bother with a very short suspense time. 31663 31664 31665 if (_msUntilTimeout > 10) { 31666 // Instead of committing the fallback immediately, wait for more data 31667 // to arrive. 31668 root.timeoutHandle = scheduleTimeout(commitRoot.bind(null, root, workInProgressRootRecoverableErrors, workInProgressTransitions), _msUntilTimeout); 31669 break; 31670 } 31671 } // Commit the placeholder. 31672 31673 31674 commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); 31675 break; 31676 } 31677 31678 case RootCompleted: 31679 { 31680 // The work completed. Ready to commit. 31681 commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); 31682 break; 31683 } 31684 31685 default: 31686 { 31687 throw new Error('Unknown root exit status.'); 31688 } 31689 } 31690} 31691 31692function isRenderConsistentWithExternalStores(finishedWork) { 31693 // Search the rendered tree for external store reads, and check whether the 31694 // stores were mutated in a concurrent event. Intentionally using an iterative 31695 // loop instead of recursion so we can exit early. 31696 var node = finishedWork; 31697 31698 while (true) { 31699 if (node.flags & StoreConsistency) { 31700 var updateQueue = node.updateQueue; 31701 31702 if (updateQueue !== null) { 31703 var checks = updateQueue.stores; 31704 31705 if (checks !== null) { 31706 for (var i = 0; i < checks.length; i++) { 31707 var check = checks[i]; 31708 var getSnapshot = check.getSnapshot; 31709 var renderedValue = check.value; 31710 31711 try { 31712 if (!objectIs(getSnapshot(), renderedValue)) { 31713 // Found an inconsistent store. 31714 return false; 31715 } 31716 } catch (error) { 31717 // If `getSnapshot` throws, return `false`. This will schedule 31718 // a re-render, and the error will be rethrown during render. 31719 return false; 31720 } 31721 } 31722 } 31723 } 31724 } 31725 31726 var child = node.child; 31727 31728 if (node.subtreeFlags & StoreConsistency && child !== null) { 31729 child.return = node; 31730 node = child; 31731 continue; 31732 } 31733 31734 if (node === finishedWork) { 31735 return true; 31736 } 31737 31738 while (node.sibling === null) { 31739 if (node.return === null || node.return === finishedWork) { 31740 return true; 31741 } 31742 31743 node = node.return; 31744 } 31745 31746 node.sibling.return = node.return; 31747 node = node.sibling; 31748 } // Flow doesn't know this is unreachable, but eslint does 31749 // eslint-disable-next-line no-unreachable 31750 31751 31752 return true; 31753} 31754 31755function markRootSuspended$1(root, suspendedLanes) { 31756 // When suspending, we should always exclude lanes that were pinged or (more 31757 // rarely, since we try to avoid it) updated during the render phase. 31758 // TODO: Lol maybe there's a better way to factor this besides this 31759 // obnoxiously named function :) 31760 suspendedLanes = removeLanes(suspendedLanes, workInProgressRootPingedLanes); 31761 suspendedLanes = removeLanes(suspendedLanes, workInProgressRootInterleavedUpdatedLanes); 31762 markRootSuspended(root, suspendedLanes); 31763} // This is the entry point for synchronous tasks that don't go 31764// through Scheduler 31765 31766 31767function performSyncWorkOnRoot(root) { 31768 { 31769 syncNestedUpdateFlag(); 31770 } 31771 31772 if ((executionContext & (RenderContext | CommitContext)) !== NoContext) { 31773 throw new Error('Should not already be working.'); 31774 } 31775 31776 flushPassiveEffects(); 31777 var lanes = getNextLanes(root, NoLanes); 31778 31779 if (!includesSomeLane(lanes, SyncLane)) { 31780 // There's no remaining sync work left. 31781 ensureRootIsScheduled(root, now()); 31782 return null; 31783 } 31784 31785 var exitStatus = renderRootSync(root, lanes); 31786 31787 if (root.tag !== LegacyRoot && exitStatus === RootErrored) { 31788 // If something threw an error, try rendering one more time. We'll render 31789 // synchronously to block concurrent data mutations, and we'll includes 31790 // all pending updates are included. If it still fails after the second 31791 // attempt, we'll give up and commit the resulting tree. 31792 var errorRetryLanes = getLanesToRetrySynchronouslyOnError(root); 31793 31794 if (errorRetryLanes !== NoLanes) { 31795 lanes = errorRetryLanes; 31796 exitStatus = recoverFromConcurrentError(root, errorRetryLanes); 31797 } 31798 } 31799 31800 if (exitStatus === RootFatalErrored) { 31801 var fatalError = workInProgressRootFatalError; 31802 prepareFreshStack(root, NoLanes); 31803 markRootSuspended$1(root, lanes); 31804 ensureRootIsScheduled(root, now()); 31805 throw fatalError; 31806 } 31807 31808 if (exitStatus === RootDidNotComplete) { 31809 throw new Error('Root did not complete. This is a bug in React.'); 31810 } // We now have a consistent tree. Because this is a sync render, we 31811 // will commit it even if something suspended. 31812 31813 31814 var finishedWork = root.current.alternate; 31815 root.finishedWork = finishedWork; 31816 root.finishedLanes = lanes; 31817 commitRoot(root, workInProgressRootRecoverableErrors, workInProgressTransitions); // Before exiting, make sure there's a callback scheduled for the next 31818 // pending level. 31819 31820 ensureRootIsScheduled(root, now()); 31821 return null; 31822} 31823 31824function flushRoot(root, lanes) { 31825 if (lanes !== NoLanes) { 31826 markRootEntangled(root, mergeLanes(lanes, SyncLane)); 31827 ensureRootIsScheduled(root, now()); 31828 31829 if ((executionContext & (RenderContext | CommitContext)) === NoContext) { 31830 resetRenderTimer(); 31831 flushSyncCallbacks(); 31832 } 31833 } 31834} 31835function batchedUpdates$1(fn, a) { 31836 var prevExecutionContext = executionContext; 31837 executionContext |= BatchedContext; 31838 31839 try { 31840 return fn(a); 31841 } finally { 31842 executionContext = prevExecutionContext; // If there were legacy sync updates, flush them at the end of the outer 31843 // most batchedUpdates-like method. 31844 31845 if (executionContext === NoContext && // Treat `act` as if it's inside `batchedUpdates`, even in legacy mode. 31846 !( ReactCurrentActQueue$1.isBatchingLegacy)) { 31847 resetRenderTimer(); 31848 flushSyncCallbacksOnlyInLegacyMode(); 31849 } 31850 } 31851} 31852function discreteUpdates(fn, a, b, c, d) { 31853 var previousPriority = getCurrentUpdatePriority(); 31854 var prevTransition = ReactCurrentBatchConfig$3.transition; 31855 31856 try { 31857 ReactCurrentBatchConfig$3.transition = null; 31858 setCurrentUpdatePriority(DiscreteEventPriority); 31859 return fn(a, b, c, d); 31860 } finally { 31861 setCurrentUpdatePriority(previousPriority); 31862 ReactCurrentBatchConfig$3.transition = prevTransition; 31863 31864 if (executionContext === NoContext) { 31865 resetRenderTimer(); 31866 } 31867 } 31868} // Overload the definition to the two valid signatures. 31869// Warning, this opts-out of checking the function body. 31870 31871// eslint-disable-next-line no-redeclare 31872function flushSync(fn) { 31873 // In legacy mode, we flush pending passive effects at the beginning of the 31874 // next event, not at the end of the previous one. 31875 if (rootWithPendingPassiveEffects !== null && rootWithPendingPassiveEffects.tag === LegacyRoot && (executionContext & (RenderContext | CommitContext)) === NoContext) { 31876 flushPassiveEffects(); 31877 } 31878 31879 var prevExecutionContext = executionContext; 31880 executionContext |= BatchedContext; 31881 var prevTransition = ReactCurrentBatchConfig$3.transition; 31882 var previousPriority = getCurrentUpdatePriority(); 31883 31884 try { 31885 ReactCurrentBatchConfig$3.transition = null; 31886 setCurrentUpdatePriority(DiscreteEventPriority); 31887 31888 if (fn) { 31889 return fn(); 31890 } else { 31891 return undefined; 31892 } 31893 } finally { 31894 setCurrentUpdatePriority(previousPriority); 31895 ReactCurrentBatchConfig$3.transition = prevTransition; 31896 executionContext = prevExecutionContext; // Flush the immediate callbacks that were scheduled during this batch. 31897 // Note that this will happen even if batchedUpdates is higher up 31898 // the stack. 31899 31900 if ((executionContext & (RenderContext | CommitContext)) === NoContext) { 31901 flushSyncCallbacks(); 31902 } 31903 } 31904} 31905function isAlreadyRendering() { 31906 // Used by the renderer to print a warning if certain APIs are called from 31907 // the wrong context. 31908 return (executionContext & (RenderContext | CommitContext)) !== NoContext; 31909} 31910function pushRenderLanes(fiber, lanes) { 31911 push(subtreeRenderLanesCursor, subtreeRenderLanes, fiber); 31912 subtreeRenderLanes = mergeLanes(subtreeRenderLanes, lanes); 31913 workInProgressRootIncludedLanes = mergeLanes(workInProgressRootIncludedLanes, lanes); 31914} 31915function popRenderLanes(fiber) { 31916 subtreeRenderLanes = subtreeRenderLanesCursor.current; 31917 pop(subtreeRenderLanesCursor, fiber); 31918} 31919 31920function prepareFreshStack(root, lanes) { 31921 root.finishedWork = null; 31922 root.finishedLanes = NoLanes; 31923 var timeoutHandle = root.timeoutHandle; 31924 31925 if (timeoutHandle !== noTimeout) { 31926 // The root previous suspended and scheduled a timeout to commit a fallback 31927 // state. Now that we have additional work, cancel the timeout. 31928 root.timeoutHandle = noTimeout; // $FlowFixMe Complains noTimeout is not a TimeoutID, despite the check above 31929 31930 cancelTimeout(timeoutHandle); 31931 } 31932 31933 if (workInProgress !== null) { 31934 var interruptedWork = workInProgress.return; 31935 31936 while (interruptedWork !== null) { 31937 var current = interruptedWork.alternate; 31938 unwindInterruptedWork(current, interruptedWork); 31939 interruptedWork = interruptedWork.return; 31940 } 31941 } 31942 31943 workInProgressRoot = root; 31944 var rootWorkInProgress = createWorkInProgress(root.current, null); 31945 workInProgress = rootWorkInProgress; 31946 workInProgressRootRenderLanes = subtreeRenderLanes = workInProgressRootIncludedLanes = lanes; 31947 workInProgressRootExitStatus = RootInProgress; 31948 workInProgressRootFatalError = null; 31949 workInProgressRootSkippedLanes = NoLanes; 31950 workInProgressRootInterleavedUpdatedLanes = NoLanes; 31951 workInProgressRootPingedLanes = NoLanes; 31952 workInProgressRootConcurrentErrors = null; 31953 workInProgressRootRecoverableErrors = null; 31954 finishQueueingConcurrentUpdates(); 31955 31956 { 31957 ReactStrictModeWarnings.discardPendingWarnings(); 31958 } 31959 31960 return rootWorkInProgress; 31961} 31962 31963function handleError(root, thrownValue) { 31964 do { 31965 var erroredWork = workInProgress; 31966 31967 try { 31968 // Reset module-level state that was set during the render phase. 31969 resetContextDependencies(); 31970 resetHooksAfterThrow(); 31971 resetCurrentFiber(); // TODO: I found and added this missing line while investigating a 31972 // separate issue. Write a regression test using string refs. 31973 31974 ReactCurrentOwner$2.current = null; 31975 31976 if (erroredWork === null || erroredWork.return === null) { 31977 // Expected to be working on a non-root fiber. This is a fatal error 31978 // because there's no ancestor that can handle it; the root is 31979 // supposed to capture all errors that weren't caught by an error 31980 // boundary. 31981 workInProgressRootExitStatus = RootFatalErrored; 31982 workInProgressRootFatalError = thrownValue; // Set `workInProgress` to null. This represents advancing to the next 31983 // sibling, or the parent if there are no siblings. But since the root 31984 // has no siblings nor a parent, we set it to null. Usually this is 31985 // handled by `completeUnitOfWork` or `unwindWork`, but since we're 31986 // intentionally not calling those, we need set it here. 31987 // TODO: Consider calling `unwindWork` to pop the contexts. 31988 31989 workInProgress = null; 31990 return; 31991 } 31992 31993 if (enableProfilerTimer && erroredWork.mode & ProfileMode) { 31994 // Record the time spent rendering before an error was thrown. This 31995 // avoids inaccurate Profiler durations in the case of a 31996 // suspended render. 31997 stopProfilerTimerIfRunningAndRecordDelta(erroredWork, true); 31998 } 31999 32000 if (enableSchedulingProfiler) { 32001 markComponentRenderStopped(); 32002 32003 if (thrownValue !== null && typeof thrownValue === 'object' && typeof thrownValue.then === 'function') { 32004 var wakeable = thrownValue; 32005 markComponentSuspended(erroredWork, wakeable, workInProgressRootRenderLanes); 32006 } else { 32007 markComponentErrored(erroredWork, thrownValue, workInProgressRootRenderLanes); 32008 } 32009 } 32010 32011 throwException(root, erroredWork.return, erroredWork, thrownValue, workInProgressRootRenderLanes); 32012 completeUnitOfWork(erroredWork); 32013 } catch (yetAnotherThrownValue) { 32014 // Something in the return path also threw. 32015 thrownValue = yetAnotherThrownValue; 32016 32017 if (workInProgress === erroredWork && erroredWork !== null) { 32018 // If this boundary has already errored, then we had trouble processing 32019 // the error. Bubble it to the next boundary. 32020 erroredWork = erroredWork.return; 32021 workInProgress = erroredWork; 32022 } else { 32023 erroredWork = workInProgress; 32024 } 32025 32026 continue; 32027 } // Return to the normal work loop. 32028 32029 32030 return; 32031 } while (true); 32032} 32033 32034function pushDispatcher() { 32035 var prevDispatcher = ReactCurrentDispatcher$2.current; 32036 ReactCurrentDispatcher$2.current = ContextOnlyDispatcher; 32037 32038 if (prevDispatcher === null) { 32039 // The React isomorphic package does not include a default dispatcher. 32040 // Instead the first renderer will lazily attach one, in order to give 32041 // nicer error messages. 32042 return ContextOnlyDispatcher; 32043 } else { 32044 return prevDispatcher; 32045 } 32046} 32047 32048function popDispatcher(prevDispatcher) { 32049 ReactCurrentDispatcher$2.current = prevDispatcher; 32050} 32051 32052function markCommitTimeOfFallback() { 32053 globalMostRecentFallbackTime = now(); 32054} 32055function markSkippedUpdateLanes(lane) { 32056 workInProgressRootSkippedLanes = mergeLanes(lane, workInProgressRootSkippedLanes); 32057} 32058function renderDidSuspend() { 32059 if (workInProgressRootExitStatus === RootInProgress) { 32060 workInProgressRootExitStatus = RootSuspended; 32061 } 32062} 32063function renderDidSuspendDelayIfPossible() { 32064 if (workInProgressRootExitStatus === RootInProgress || workInProgressRootExitStatus === RootSuspended || workInProgressRootExitStatus === RootErrored) { 32065 workInProgressRootExitStatus = RootSuspendedWithDelay; 32066 } // Check if there are updates that we skipped tree that might have unblocked 32067 // this render. 32068 32069 32070 if (workInProgressRoot !== null && (includesNonIdleWork(workInProgressRootSkippedLanes) || includesNonIdleWork(workInProgressRootInterleavedUpdatedLanes))) { 32071 // Mark the current render as suspended so that we switch to working on 32072 // the updates that were skipped. Usually we only suspend at the end of 32073 // the render phase. 32074 // TODO: We should probably always mark the root as suspended immediately 32075 // (inside this function), since by suspending at the end of the render 32076 // phase introduces a potential mistake where we suspend lanes that were 32077 // pinged or updated while we were rendering. 32078 markRootSuspended$1(workInProgressRoot, workInProgressRootRenderLanes); 32079 } 32080} 32081function renderDidError(error) { 32082 if (workInProgressRootExitStatus !== RootSuspendedWithDelay) { 32083 workInProgressRootExitStatus = RootErrored; 32084 } 32085 32086 if (workInProgressRootConcurrentErrors === null) { 32087 workInProgressRootConcurrentErrors = [error]; 32088 } else { 32089 workInProgressRootConcurrentErrors.push(error); 32090 } 32091} // Called during render to determine if anything has suspended. 32092// Returns false if we're not sure. 32093 32094function renderHasNotSuspendedYet() { 32095 // If something errored or completed, we can't really be sure, 32096 // so those are false. 32097 return workInProgressRootExitStatus === RootInProgress; 32098} 32099 32100function renderRootSync(root, lanes) { 32101 var prevExecutionContext = executionContext; 32102 executionContext |= RenderContext; 32103 var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack 32104 // and prepare a fresh one. Otherwise we'll continue where we left off. 32105 32106 if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) { 32107 { 32108 if (isDevToolsPresent) { 32109 var memoizedUpdaters = root.memoizedUpdaters; 32110 32111 if (memoizedUpdaters.size > 0) { 32112 restorePendingUpdaters(root, workInProgressRootRenderLanes); 32113 memoizedUpdaters.clear(); 32114 } // At this point, move Fibers that scheduled the upcoming work from the Map to the Set. 32115 // If we bailout on this work, we'll move them back (like above). 32116 // It's important to move them now in case the work spawns more work at the same priority with different updaters. 32117 // That way we can keep the current update and future updates separate. 32118 32119 32120 movePendingFibersToMemoized(root, lanes); 32121 } 32122 } 32123 32124 workInProgressTransitions = getTransitionsForLanes(); 32125 prepareFreshStack(root, lanes); 32126 } 32127 32128 { 32129 markRenderStarted(lanes); 32130 } 32131 32132 do { 32133 try { 32134 workLoopSync(); 32135 break; 32136 } catch (thrownValue) { 32137 handleError(root, thrownValue); 32138 } 32139 } while (true); 32140 32141 resetContextDependencies(); 32142 executionContext = prevExecutionContext; 32143 popDispatcher(prevDispatcher); 32144 32145 if (workInProgress !== null) { 32146 // This is a sync render, so we should have finished the whole tree. 32147 throw new Error('Cannot commit an incomplete root. This error is likely caused by a ' + 'bug in React. Please file an issue.'); 32148 } 32149 32150 { 32151 markRenderStopped(); 32152 } // Set this to null to indicate there's no in-progress render. 32153 32154 32155 workInProgressRoot = null; 32156 workInProgressRootRenderLanes = NoLanes; 32157 return workInProgressRootExitStatus; 32158} // The work loop is an extremely hot path. Tell Closure not to inline it. 32159 32160/** @noinline */ 32161 32162 32163function workLoopSync() { 32164 // Already timed out, so perform work without checking if we need to yield. 32165 while (workInProgress !== null) { 32166 performUnitOfWork(workInProgress); 32167 } 32168} 32169 32170function renderRootConcurrent(root, lanes) { 32171 var prevExecutionContext = executionContext; 32172 executionContext |= RenderContext; 32173 var prevDispatcher = pushDispatcher(); // If the root or lanes have changed, throw out the existing stack 32174 // and prepare a fresh one. Otherwise we'll continue where we left off. 32175 32176 if (workInProgressRoot !== root || workInProgressRootRenderLanes !== lanes) { 32177 { 32178 if (isDevToolsPresent) { 32179 var memoizedUpdaters = root.memoizedUpdaters; 32180 32181 if (memoizedUpdaters.size > 0) { 32182 restorePendingUpdaters(root, workInProgressRootRenderLanes); 32183 memoizedUpdaters.clear(); 32184 } // At this point, move Fibers that scheduled the upcoming work from the Map to the Set. 32185 // If we bailout on this work, we'll move them back (like above). 32186 // It's important to move them now in case the work spawns more work at the same priority with different updaters. 32187 // That way we can keep the current update and future updates separate. 32188 32189 32190 movePendingFibersToMemoized(root, lanes); 32191 } 32192 } 32193 32194 workInProgressTransitions = getTransitionsForLanes(); 32195 resetRenderTimer(); 32196 prepareFreshStack(root, lanes); 32197 } 32198 32199 { 32200 markRenderStarted(lanes); 32201 } 32202 32203 do { 32204 try { 32205 workLoopConcurrent(); 32206 break; 32207 } catch (thrownValue) { 32208 handleError(root, thrownValue); 32209 } 32210 } while (true); 32211 32212 resetContextDependencies(); 32213 popDispatcher(prevDispatcher); 32214 executionContext = prevExecutionContext; 32215 32216 32217 if (workInProgress !== null) { 32218 // Still work remaining. 32219 { 32220 markRenderYielded(); 32221 } 32222 32223 return RootInProgress; 32224 } else { 32225 // Completed the tree. 32226 { 32227 markRenderStopped(); 32228 } // Set this to null to indicate there's no in-progress render. 32229 32230 32231 workInProgressRoot = null; 32232 workInProgressRootRenderLanes = NoLanes; // Return the final exit status. 32233 32234 return workInProgressRootExitStatus; 32235 } 32236} 32237/** @noinline */ 32238 32239 32240function workLoopConcurrent() { 32241 // Perform work until Scheduler asks us to yield 32242 while (workInProgress !== null && !shouldYield()) { 32243 performUnitOfWork(workInProgress); 32244 } 32245} 32246 32247function performUnitOfWork(unitOfWork) { 32248 // The current, flushed, state of this fiber is the alternate. Ideally 32249 // nothing should rely on this, but relying on it here means that we don't 32250 // need an additional field on the work in progress. 32251 var current = unitOfWork.alternate; 32252 setCurrentFiber(unitOfWork); 32253 var next; 32254 32255 if ( (unitOfWork.mode & ProfileMode) !== NoMode) { 32256 startProfilerTimer(unitOfWork); 32257 next = beginWork$1(current, unitOfWork, subtreeRenderLanes); 32258 stopProfilerTimerIfRunningAndRecordDelta(unitOfWork, true); 32259 } else { 32260 next = beginWork$1(current, unitOfWork, subtreeRenderLanes); 32261 } 32262 32263 resetCurrentFiber(); 32264 unitOfWork.memoizedProps = unitOfWork.pendingProps; 32265 32266 if (next === null) { 32267 // If this doesn't spawn new work, complete the current work. 32268 completeUnitOfWork(unitOfWork); 32269 } else { 32270 workInProgress = next; 32271 } 32272 32273 ReactCurrentOwner$2.current = null; 32274} 32275 32276function completeUnitOfWork(unitOfWork) { 32277 // Attempt to complete the current unit of work, then move to the next 32278 // sibling. If there are no more siblings, return to the parent fiber. 32279 var completedWork = unitOfWork; 32280 32281 do { 32282 // The current, flushed, state of this fiber is the alternate. Ideally 32283 // nothing should rely on this, but relying on it here means that we don't 32284 // need an additional field on the work in progress. 32285 var current = completedWork.alternate; 32286 var returnFiber = completedWork.return; // Check if the work completed or if something threw. 32287 32288 if ((completedWork.flags & Incomplete) === NoFlags) { 32289 setCurrentFiber(completedWork); 32290 var next = void 0; 32291 32292 if ( (completedWork.mode & ProfileMode) === NoMode) { 32293 next = completeWork(current, completedWork, subtreeRenderLanes); 32294 } else { 32295 startProfilerTimer(completedWork); 32296 next = completeWork(current, completedWork, subtreeRenderLanes); // Update render duration assuming we didn't error. 32297 32298 stopProfilerTimerIfRunningAndRecordDelta(completedWork, false); 32299 } 32300 32301 resetCurrentFiber(); 32302 32303 if (next !== null) { 32304 // Completing this fiber spawned new work. Work on that next. 32305 workInProgress = next; 32306 return; 32307 } 32308 } else { 32309 // This fiber did not complete because something threw. Pop values off 32310 // the stack without entering the complete phase. If this is a boundary, 32311 // capture values if possible. 32312 var _next = unwindWork(current, completedWork); // Because this fiber did not complete, don't reset its lanes. 32313 32314 32315 if (_next !== null) { 32316 // If completing this work spawned new work, do that next. We'll come 32317 // back here again. 32318 // Since we're restarting, remove anything that is not a host effect 32319 // from the effect tag. 32320 _next.flags &= HostEffectMask; 32321 workInProgress = _next; 32322 return; 32323 } 32324 32325 if ( (completedWork.mode & ProfileMode) !== NoMode) { 32326 // Record the render duration for the fiber that errored. 32327 stopProfilerTimerIfRunningAndRecordDelta(completedWork, false); // Include the time spent working on failed children before continuing. 32328 32329 var actualDuration = completedWork.actualDuration; 32330 var child = completedWork.child; 32331 32332 while (child !== null) { 32333 actualDuration += child.actualDuration; 32334 child = child.sibling; 32335 } 32336 32337 completedWork.actualDuration = actualDuration; 32338 } 32339 32340 if (returnFiber !== null) { 32341 // Mark the parent fiber as incomplete and clear its subtree flags. 32342 returnFiber.flags |= Incomplete; 32343 returnFiber.subtreeFlags = NoFlags; 32344 returnFiber.deletions = null; 32345 } else { 32346 // We've unwound all the way to the root. 32347 workInProgressRootExitStatus = RootDidNotComplete; 32348 workInProgress = null; 32349 return; 32350 } 32351 } 32352 32353 var siblingFiber = completedWork.sibling; 32354 32355 if (siblingFiber !== null) { 32356 // If there is more work to do in this returnFiber, do that next. 32357 workInProgress = siblingFiber; 32358 return; 32359 } // Otherwise, return to the parent 32360 32361 32362 completedWork = returnFiber; // Update the next thing we're working on in case something throws. 32363 32364 workInProgress = completedWork; 32365 } while (completedWork !== null); // We've reached the root. 32366 32367 32368 if (workInProgressRootExitStatus === RootInProgress) { 32369 workInProgressRootExitStatus = RootCompleted; 32370 } 32371} 32372 32373function commitRoot(root, recoverableErrors, transitions) { 32374 // TODO: This no longer makes any sense. We already wrap the mutation and 32375 // layout phases. Should be able to remove. 32376 var previousUpdateLanePriority = getCurrentUpdatePriority(); 32377 var prevTransition = ReactCurrentBatchConfig$3.transition; 32378 32379 try { 32380 ReactCurrentBatchConfig$3.transition = null; 32381 setCurrentUpdatePriority(DiscreteEventPriority); 32382 commitRootImpl(root, recoverableErrors, transitions, previousUpdateLanePriority); 32383 } finally { 32384 ReactCurrentBatchConfig$3.transition = prevTransition; 32385 setCurrentUpdatePriority(previousUpdateLanePriority); 32386 } 32387 32388 return null; 32389} 32390 32391function commitRootImpl(root, recoverableErrors, transitions, renderPriorityLevel) { 32392 do { 32393 // `flushPassiveEffects` will call `flushSyncUpdateQueue` at the end, which 32394 // means `flushPassiveEffects` will sometimes result in additional 32395 // passive effects. So we need to keep flushing in a loop until there are 32396 // no more pending effects. 32397 // TODO: Might be better if `flushPassiveEffects` did not automatically 32398 // flush synchronous work at the end, to avoid factoring hazards like this. 32399 flushPassiveEffects(); 32400 } while (rootWithPendingPassiveEffects !== null); 32401 32402 flushRenderPhaseStrictModeWarningsInDEV(); 32403 32404 if ((executionContext & (RenderContext | CommitContext)) !== NoContext) { 32405 throw new Error('Should not already be working.'); 32406 } 32407 32408 var finishedWork = root.finishedWork; 32409 var lanes = root.finishedLanes; 32410 32411 { 32412 markCommitStarted(lanes); 32413 } 32414 32415 if (finishedWork === null) { 32416 32417 { 32418 markCommitStopped(); 32419 } 32420 32421 return null; 32422 } else { 32423 { 32424 if (lanes === NoLanes) { 32425 error('root.finishedLanes should not be empty during a commit. This is a ' + 'bug in React.'); 32426 } 32427 } 32428 } 32429 32430 root.finishedWork = null; 32431 root.finishedLanes = NoLanes; 32432 32433 if (finishedWork === root.current) { 32434 throw new Error('Cannot commit the same tree as before. This error is likely caused by ' + 'a bug in React. Please file an issue.'); 32435 } // commitRoot never returns a continuation; it always finishes synchronously. 32436 // So we can clear these now to allow a new callback to be scheduled. 32437 32438 32439 root.callbackNode = null; 32440 root.callbackPriority = NoLane; // Update the first and last pending times on this root. The new first 32441 // pending time is whatever is left on the root fiber. 32442 32443 var remainingLanes = mergeLanes(finishedWork.lanes, finishedWork.childLanes); 32444 markRootFinished(root, remainingLanes); 32445 32446 if (root === workInProgressRoot) { 32447 // We can reset these now that they are finished. 32448 workInProgressRoot = null; 32449 workInProgress = null; 32450 workInProgressRootRenderLanes = NoLanes; 32451 } // If there are pending passive effects, schedule a callback to process them. 32452 // Do this as early as possible, so it is queued before anything else that 32453 // might get scheduled in the commit phase. (See #16714.) 32454 // TODO: Delete all other places that schedule the passive effect callback 32455 // They're redundant. 32456 32457 32458 if ((finishedWork.subtreeFlags & PassiveMask) !== NoFlags || (finishedWork.flags & PassiveMask) !== NoFlags) { 32459 if (!rootDoesHavePassiveEffects) { 32460 rootDoesHavePassiveEffects = true; 32461 // to store it in pendingPassiveTransitions until they get processed 32462 // We need to pass this through as an argument to commitRoot 32463 // because workInProgressTransitions might have changed between 32464 // the previous render and commit if we throttle the commit 32465 // with setTimeout 32466 32467 pendingPassiveTransitions = transitions; 32468 scheduleCallback$1(NormalPriority, function () { 32469 flushPassiveEffects(); // This render triggered passive effects: release the root cache pool 32470 // *after* passive effects fire to avoid freeing a cache pool that may 32471 // be referenced by a node in the tree (HostRoot, Cache boundary etc) 32472 32473 return null; 32474 }); 32475 } 32476 } // Check if there are any effects in the whole tree. 32477 // TODO: This is left over from the effect list implementation, where we had 32478 // to check for the existence of `firstEffect` to satisfy Flow. I think the 32479 // only other reason this optimization exists is because it affects profiling. 32480 // Reconsider whether this is necessary. 32481 32482 32483 var subtreeHasEffects = (finishedWork.subtreeFlags & (BeforeMutationMask | MutationMask | LayoutMask | PassiveMask)) !== NoFlags; 32484 var rootHasEffect = (finishedWork.flags & (BeforeMutationMask | MutationMask | LayoutMask | PassiveMask)) !== NoFlags; 32485 32486 if (subtreeHasEffects || rootHasEffect) { 32487 var prevTransition = ReactCurrentBatchConfig$3.transition; 32488 ReactCurrentBatchConfig$3.transition = null; 32489 var previousPriority = getCurrentUpdatePriority(); 32490 setCurrentUpdatePriority(DiscreteEventPriority); 32491 var prevExecutionContext = executionContext; 32492 executionContext |= CommitContext; // Reset this to null before calling lifecycles 32493 32494 ReactCurrentOwner$2.current = null; // The commit phase is broken into several sub-phases. We do a separate pass 32495 // of the effect list for each phase: all mutation effects come before all 32496 // layout effects, and so on. 32497 // The first phase a "before mutation" phase. We use this phase to read the 32498 // state of the host tree right before we mutate it. This is where 32499 // getSnapshotBeforeUpdate is called. 32500 32501 var shouldFireAfterActiveInstanceBlur = commitBeforeMutationEffects(root, finishedWork); 32502 32503 { 32504 // Mark the current commit time to be shared by all Profilers in this 32505 // batch. This enables them to be grouped later. 32506 recordCommitTime(); 32507 } 32508 32509 32510 commitMutationEffects(root, finishedWork, lanes); 32511 32512 resetAfterCommit(root.containerInfo); // The work-in-progress tree is now the current tree. This must come after 32513 // the mutation phase, so that the previous tree is still current during 32514 // componentWillUnmount, but before the layout phase, so that the finished 32515 // work is current during componentDidMount/Update. 32516 32517 root.current = finishedWork; // The next phase is the layout phase, where we call effects that read 32518 32519 { 32520 markLayoutEffectsStarted(lanes); 32521 } 32522 32523 commitLayoutEffects(finishedWork, root, lanes); 32524 32525 { 32526 markLayoutEffectsStopped(); 32527 } 32528 // opportunity to paint. 32529 32530 32531 requestPaint(); 32532 executionContext = prevExecutionContext; // Reset the priority to the previous non-sync value. 32533 32534 setCurrentUpdatePriority(previousPriority); 32535 ReactCurrentBatchConfig$3.transition = prevTransition; 32536 } else { 32537 // No effects. 32538 root.current = finishedWork; // Measure these anyway so the flamegraph explicitly shows that there were 32539 // no effects. 32540 // TODO: Maybe there's a better way to report this. 32541 32542 { 32543 recordCommitTime(); 32544 } 32545 } 32546 32547 var rootDidHavePassiveEffects = rootDoesHavePassiveEffects; 32548 32549 if (rootDoesHavePassiveEffects) { 32550 // This commit has passive effects. Stash a reference to them. But don't 32551 // schedule a callback until after flushing layout work. 32552 rootDoesHavePassiveEffects = false; 32553 rootWithPendingPassiveEffects = root; 32554 pendingPassiveEffectsLanes = lanes; 32555 } else { 32556 32557 { 32558 nestedPassiveUpdateCount = 0; 32559 rootWithPassiveNestedUpdates = null; 32560 } 32561 } // Read this again, since an effect might have updated it 32562 32563 32564 remainingLanes = root.pendingLanes; // Check if there's remaining work on this root 32565 // TODO: This is part of the `componentDidCatch` implementation. Its purpose 32566 // is to detect whether something might have called setState inside 32567 // `componentDidCatch`. The mechanism is known to be flawed because `setState` 32568 // inside `componentDidCatch` is itself flawed — that's why we recommend 32569 // `getDerivedStateFromError` instead. However, it could be improved by 32570 // checking if remainingLanes includes Sync work, instead of whether there's 32571 // any work remaining at all (which would also include stuff like Suspense 32572 // retries or transitions). It's been like this for a while, though, so fixing 32573 // it probably isn't that urgent. 32574 32575 if (remainingLanes === NoLanes) { 32576 // If there's no remaining work, we can clear the set of already failed 32577 // error boundaries. 32578 legacyErrorBoundariesThatAlreadyFailed = null; 32579 } 32580 32581 { 32582 if (!rootDidHavePassiveEffects) { 32583 commitDoubleInvokeEffectsInDEV(root.current, false); 32584 } 32585 } 32586 32587 onCommitRoot(finishedWork.stateNode, renderPriorityLevel); 32588 32589 { 32590 if (isDevToolsPresent) { 32591 root.memoizedUpdaters.clear(); 32592 } 32593 } 32594 32595 { 32596 onCommitRoot$1(); 32597 } // Always call this before exiting `commitRoot`, to ensure that any 32598 // additional work on this root is scheduled. 32599 32600 32601 ensureRootIsScheduled(root, now()); 32602 32603 if (recoverableErrors !== null) { 32604 // There were errors during this render, but recovered from them without 32605 // needing to surface it to the UI. We log them here. 32606 var onRecoverableError = root.onRecoverableError; 32607 32608 for (var i = 0; i < recoverableErrors.length; i++) { 32609 var recoverableError = recoverableErrors[i]; 32610 var componentStack = recoverableError.stack; 32611 var digest = recoverableError.digest; 32612 onRecoverableError(recoverableError.value, { 32613 componentStack: componentStack, 32614 digest: digest 32615 }); 32616 } 32617 } 32618 32619 if (hasUncaughtError) { 32620 hasUncaughtError = false; 32621 var error$1 = firstUncaughtError; 32622 firstUncaughtError = null; 32623 throw error$1; 32624 } // If the passive effects are the result of a discrete render, flush them 32625 // synchronously at the end of the current task so that the result is 32626 // immediately observable. Otherwise, we assume that they are not 32627 // order-dependent and do not need to be observed by external systems, so we 32628 // can wait until after paint. 32629 // TODO: We can optimize this by not scheduling the callback earlier. Since we 32630 // currently schedule the callback in multiple places, will wait until those 32631 // are consolidated. 32632 32633 32634 if (includesSomeLane(pendingPassiveEffectsLanes, SyncLane) && root.tag !== LegacyRoot) { 32635 flushPassiveEffects(); 32636 } // Read this again, since a passive effect might have updated it 32637 32638 32639 remainingLanes = root.pendingLanes; 32640 32641 if (includesSomeLane(remainingLanes, SyncLane)) { 32642 { 32643 markNestedUpdateScheduled(); 32644 } // Count the number of times the root synchronously re-renders without 32645 // finishing. If there are too many, it indicates an infinite update loop. 32646 32647 32648 if (root === rootWithNestedUpdates) { 32649 nestedUpdateCount++; 32650 } else { 32651 nestedUpdateCount = 0; 32652 rootWithNestedUpdates = root; 32653 } 32654 } else { 32655 nestedUpdateCount = 0; 32656 } // If layout work was scheduled, flush it now. 32657 32658 32659 flushSyncCallbacks(); 32660 32661 { 32662 markCommitStopped(); 32663 } 32664 32665 return null; 32666} 32667 32668function flushPassiveEffects() { 32669 // Returns whether passive effects were flushed. 32670 // TODO: Combine this check with the one in flushPassiveEFfectsImpl. We should 32671 // probably just combine the two functions. I believe they were only separate 32672 // in the first place because we used to wrap it with 32673 // `Scheduler.runWithPriority`, which accepts a function. But now we track the 32674 // priority within React itself, so we can mutate the variable directly. 32675 if (rootWithPendingPassiveEffects !== null) { 32676 var renderPriority = lanesToEventPriority(pendingPassiveEffectsLanes); 32677 var priority = lowerEventPriority(DefaultEventPriority, renderPriority); 32678 var prevTransition = ReactCurrentBatchConfig$3.transition; 32679 var previousPriority = getCurrentUpdatePriority(); 32680 32681 try { 32682 ReactCurrentBatchConfig$3.transition = null; 32683 setCurrentUpdatePriority(priority); 32684 return flushPassiveEffectsImpl(); 32685 } finally { 32686 setCurrentUpdatePriority(previousPriority); 32687 ReactCurrentBatchConfig$3.transition = prevTransition; // Once passive effects have run for the tree - giving components a 32688 } 32689 } 32690 32691 return false; 32692} 32693function enqueuePendingPassiveProfilerEffect(fiber) { 32694 { 32695 pendingPassiveProfilerEffects.push(fiber); 32696 32697 if (!rootDoesHavePassiveEffects) { 32698 rootDoesHavePassiveEffects = true; 32699 scheduleCallback$1(NormalPriority, function () { 32700 flushPassiveEffects(); 32701 return null; 32702 }); 32703 } 32704 } 32705} 32706 32707function flushPassiveEffectsImpl() { 32708 if (rootWithPendingPassiveEffects === null) { 32709 return false; 32710 } // Cache and clear the transitions flag 32711 32712 32713 var transitions = pendingPassiveTransitions; 32714 pendingPassiveTransitions = null; 32715 var root = rootWithPendingPassiveEffects; 32716 var lanes = pendingPassiveEffectsLanes; 32717 rootWithPendingPassiveEffects = null; // TODO: This is sometimes out of sync with rootWithPendingPassiveEffects. 32718 // Figure out why and fix it. It's not causing any known issues (probably 32719 // because it's only used for profiling), but it's a refactor hazard. 32720 32721 pendingPassiveEffectsLanes = NoLanes; 32722 32723 if ((executionContext & (RenderContext | CommitContext)) !== NoContext) { 32724 throw new Error('Cannot flush passive effects while already rendering.'); 32725 } 32726 32727 { 32728 isFlushingPassiveEffects = true; 32729 didScheduleUpdateDuringPassiveEffects = false; 32730 } 32731 32732 { 32733 markPassiveEffectsStarted(lanes); 32734 } 32735 32736 var prevExecutionContext = executionContext; 32737 executionContext |= CommitContext; 32738 commitPassiveUnmountEffects(root.current); 32739 commitPassiveMountEffects(root, root.current, lanes, transitions); // TODO: Move to commitPassiveMountEffects 32740 32741 { 32742 var profilerEffects = pendingPassiveProfilerEffects; 32743 pendingPassiveProfilerEffects = []; 32744 32745 for (var i = 0; i < profilerEffects.length; i++) { 32746 var _fiber = profilerEffects[i]; 32747 commitPassiveEffectDurations(root, _fiber); 32748 } 32749 } 32750 32751 { 32752 markPassiveEffectsStopped(); 32753 } 32754 32755 { 32756 commitDoubleInvokeEffectsInDEV(root.current, true); 32757 } 32758 32759 executionContext = prevExecutionContext; 32760 flushSyncCallbacks(); 32761 32762 { 32763 // If additional passive effects were scheduled, increment a counter. If this 32764 // exceeds the limit, we'll fire a warning. 32765 if (didScheduleUpdateDuringPassiveEffects) { 32766 if (root === rootWithPassiveNestedUpdates) { 32767 nestedPassiveUpdateCount++; 32768 } else { 32769 nestedPassiveUpdateCount = 0; 32770 rootWithPassiveNestedUpdates = root; 32771 } 32772 } else { 32773 nestedPassiveUpdateCount = 0; 32774 } 32775 32776 isFlushingPassiveEffects = false; 32777 didScheduleUpdateDuringPassiveEffects = false; 32778 } // TODO: Move to commitPassiveMountEffects 32779 32780 32781 onPostCommitRoot(root); 32782 32783 { 32784 var stateNode = root.current.stateNode; 32785 stateNode.effectDuration = 0; 32786 stateNode.passiveEffectDuration = 0; 32787 } 32788 32789 return true; 32790} 32791 32792function isAlreadyFailedLegacyErrorBoundary(instance) { 32793 return legacyErrorBoundariesThatAlreadyFailed !== null && legacyErrorBoundariesThatAlreadyFailed.has(instance); 32794} 32795function markLegacyErrorBoundaryAsFailed(instance) { 32796 if (legacyErrorBoundariesThatAlreadyFailed === null) { 32797 legacyErrorBoundariesThatAlreadyFailed = new Set([instance]); 32798 } else { 32799 legacyErrorBoundariesThatAlreadyFailed.add(instance); 32800 } 32801} 32802 32803function prepareToThrowUncaughtError(error) { 32804 if (!hasUncaughtError) { 32805 hasUncaughtError = true; 32806 firstUncaughtError = error; 32807 } 32808} 32809 32810var onUncaughtError = prepareToThrowUncaughtError; 32811 32812function captureCommitPhaseErrorOnRoot(rootFiber, sourceFiber, error) { 32813 var errorInfo = createCapturedValueAtFiber(error, sourceFiber); 32814 var update = createRootErrorUpdate(rootFiber, errorInfo, SyncLane); 32815 var root = enqueueUpdate(rootFiber, update, SyncLane); 32816 var eventTime = requestEventTime(); 32817 32818 if (root !== null) { 32819 markRootUpdated(root, SyncLane, eventTime); 32820 ensureRootIsScheduled(root, eventTime); 32821 } 32822} 32823 32824function captureCommitPhaseError(sourceFiber, nearestMountedAncestor, error$1) { 32825 { 32826 reportUncaughtErrorInDEV(error$1); 32827 setIsRunningInsertionEffect(false); 32828 } 32829 32830 if (sourceFiber.tag === HostRoot) { 32831 // Error was thrown at the root. There is no parent, so the root 32832 // itself should capture it. 32833 captureCommitPhaseErrorOnRoot(sourceFiber, sourceFiber, error$1); 32834 return; 32835 } 32836 32837 var fiber = null; 32838 32839 { 32840 fiber = nearestMountedAncestor; 32841 } 32842 32843 while (fiber !== null) { 32844 if (fiber.tag === HostRoot) { 32845 captureCommitPhaseErrorOnRoot(fiber, sourceFiber, error$1); 32846 return; 32847 } else if (fiber.tag === ClassComponent) { 32848 var ctor = fiber.type; 32849 var instance = fiber.stateNode; 32850 32851 if (typeof ctor.getDerivedStateFromError === 'function' || typeof instance.componentDidCatch === 'function' && !isAlreadyFailedLegacyErrorBoundary(instance)) { 32852 var errorInfo = createCapturedValueAtFiber(error$1, sourceFiber); 32853 var update = createClassErrorUpdate(fiber, errorInfo, SyncLane); 32854 var root = enqueueUpdate(fiber, update, SyncLane); 32855 var eventTime = requestEventTime(); 32856 32857 if (root !== null) { 32858 markRootUpdated(root, SyncLane, eventTime); 32859 ensureRootIsScheduled(root, eventTime); 32860 } 32861 32862 return; 32863 } 32864 } 32865 32866 fiber = fiber.return; 32867 } 32868 32869 { 32870 // TODO: Until we re-land skipUnmountedBoundaries (see #20147), this warning 32871 // will fire for errors that are thrown by destroy functions inside deleted 32872 // trees. What it should instead do is propagate the error to the parent of 32873 // the deleted tree. In the meantime, do not add this warning to the 32874 // allowlist; this is only for our internal use. 32875 error('Internal React error: Attempted to capture a commit phase error ' + 'inside a detached tree. This indicates a bug in React. Likely ' + 'causes include deleting the same fiber more than once, committing an ' + 'already-finished tree, or an inconsistent return pointer.\n\n' + 'Error message:\n\n%s', error$1); 32876 } 32877} 32878function pingSuspendedRoot(root, wakeable, pingedLanes) { 32879 var pingCache = root.pingCache; 32880 32881 if (pingCache !== null) { 32882 // The wakeable resolved, so we no longer need to memoize, because it will 32883 // never be thrown again. 32884 pingCache.delete(wakeable); 32885 } 32886 32887 var eventTime = requestEventTime(); 32888 markRootPinged(root, pingedLanes); 32889 warnIfSuspenseResolutionNotWrappedWithActDEV(root); 32890 32891 if (workInProgressRoot === root && isSubsetOfLanes(workInProgressRootRenderLanes, pingedLanes)) { 32892 // Received a ping at the same priority level at which we're currently 32893 // rendering. We might want to restart this render. This should mirror 32894 // the logic of whether or not a root suspends once it completes. 32895 // TODO: If we're rendering sync either due to Sync, Batched or expired, 32896 // we should probably never restart. 32897 // If we're suspended with delay, or if it's a retry, we'll always suspend 32898 // so we can always restart. 32899 if (workInProgressRootExitStatus === RootSuspendedWithDelay || workInProgressRootExitStatus === RootSuspended && includesOnlyRetries(workInProgressRootRenderLanes) && now() - globalMostRecentFallbackTime < FALLBACK_THROTTLE_MS) { 32900 // Restart from the root. 32901 prepareFreshStack(root, NoLanes); 32902 } else { 32903 // Even though we can't restart right now, we might get an 32904 // opportunity later. So we mark this render as having a ping. 32905 workInProgressRootPingedLanes = mergeLanes(workInProgressRootPingedLanes, pingedLanes); 32906 } 32907 } 32908 32909 ensureRootIsScheduled(root, eventTime); 32910} 32911 32912function retryTimedOutBoundary(boundaryFiber, retryLane) { 32913 // The boundary fiber (a Suspense component or SuspenseList component) 32914 // previously was rendered in its fallback state. One of the promises that 32915 // suspended it has resolved, which means at least part of the tree was 32916 // likely unblocked. Try rendering again, at a new lanes. 32917 if (retryLane === NoLane) { 32918 // TODO: Assign this to `suspenseState.retryLane`? to avoid 32919 // unnecessary entanglement? 32920 retryLane = requestRetryLane(boundaryFiber); 32921 } // TODO: Special case idle priority? 32922 32923 32924 var eventTime = requestEventTime(); 32925 var root = enqueueConcurrentRenderForLane(boundaryFiber, retryLane); 32926 32927 if (root !== null) { 32928 markRootUpdated(root, retryLane, eventTime); 32929 ensureRootIsScheduled(root, eventTime); 32930 } 32931} 32932 32933function retryDehydratedSuspenseBoundary(boundaryFiber) { 32934 var suspenseState = boundaryFiber.memoizedState; 32935 var retryLane = NoLane; 32936 32937 if (suspenseState !== null) { 32938 retryLane = suspenseState.retryLane; 32939 } 32940 32941 retryTimedOutBoundary(boundaryFiber, retryLane); 32942} 32943function resolveRetryWakeable(boundaryFiber, wakeable) { 32944 var retryLane = NoLane; // Default 32945 32946 var retryCache; 32947 32948 switch (boundaryFiber.tag) { 32949 case SuspenseComponent: 32950 retryCache = boundaryFiber.stateNode; 32951 var suspenseState = boundaryFiber.memoizedState; 32952 32953 if (suspenseState !== null) { 32954 retryLane = suspenseState.retryLane; 32955 } 32956 32957 break; 32958 32959 case SuspenseListComponent: 32960 retryCache = boundaryFiber.stateNode; 32961 break; 32962 32963 default: 32964 throw new Error('Pinged unknown suspense boundary type. ' + 'This is probably a bug in React.'); 32965 } 32966 32967 if (retryCache !== null) { 32968 // The wakeable resolved, so we no longer need to memoize, because it will 32969 // never be thrown again. 32970 retryCache.delete(wakeable); 32971 } 32972 32973 retryTimedOutBoundary(boundaryFiber, retryLane); 32974} // Computes the next Just Noticeable Difference (JND) boundary. 32975// The theory is that a person can't tell the difference between small differences in time. 32976// Therefore, if we wait a bit longer than necessary that won't translate to a noticeable 32977// difference in the experience. However, waiting for longer might mean that we can avoid 32978// showing an intermediate loading state. The longer we have already waited, the harder it 32979// is to tell small differences in time. Therefore, the longer we've already waited, 32980// the longer we can wait additionally. At some point we have to give up though. 32981// We pick a train model where the next boundary commits at a consistent schedule. 32982// These particular numbers are vague estimates. We expect to adjust them based on research. 32983 32984function jnd(timeElapsed) { 32985 return timeElapsed < 120 ? 120 : timeElapsed < 480 ? 480 : timeElapsed < 1080 ? 1080 : timeElapsed < 1920 ? 1920 : timeElapsed < 3000 ? 3000 : timeElapsed < 4320 ? 4320 : ceil(timeElapsed / 1960) * 1960; 32986} 32987 32988function checkForNestedUpdates() { 32989 if (nestedUpdateCount > NESTED_UPDATE_LIMIT) { 32990 nestedUpdateCount = 0; 32991 rootWithNestedUpdates = null; 32992 throw new Error('Maximum update depth exceeded. This can happen when a component ' + 'repeatedly calls setState inside componentWillUpdate or ' + 'componentDidUpdate. React limits the number of nested updates to ' + 'prevent infinite loops.'); 32993 } 32994 32995 { 32996 if (nestedPassiveUpdateCount > NESTED_PASSIVE_UPDATE_LIMIT) { 32997 nestedPassiveUpdateCount = 0; 32998 rootWithPassiveNestedUpdates = null; 32999 33000 error('Maximum update depth exceeded. This can happen when a component ' + "calls setState inside useEffect, but useEffect either doesn't " + 'have a dependency array, or one of the dependencies changes on ' + 'every render.'); 33001 } 33002 } 33003} 33004 33005function flushRenderPhaseStrictModeWarningsInDEV() { 33006 { 33007 ReactStrictModeWarnings.flushLegacyContextWarning(); 33008 33009 { 33010 ReactStrictModeWarnings.flushPendingUnsafeLifecycleWarnings(); 33011 } 33012 } 33013} 33014 33015function commitDoubleInvokeEffectsInDEV(fiber, hasPassiveEffects) { 33016 { 33017 // TODO (StrictEffects) Should we set a marker on the root if it contains strict effects 33018 // so we don't traverse unnecessarily? similar to subtreeFlags but just at the root level. 33019 // Maybe not a big deal since this is DEV only behavior. 33020 setCurrentFiber(fiber); 33021 invokeEffectsInDev(fiber, MountLayoutDev, invokeLayoutEffectUnmountInDEV); 33022 33023 if (hasPassiveEffects) { 33024 invokeEffectsInDev(fiber, MountPassiveDev, invokePassiveEffectUnmountInDEV); 33025 } 33026 33027 invokeEffectsInDev(fiber, MountLayoutDev, invokeLayoutEffectMountInDEV); 33028 33029 if (hasPassiveEffects) { 33030 invokeEffectsInDev(fiber, MountPassiveDev, invokePassiveEffectMountInDEV); 33031 } 33032 33033 resetCurrentFiber(); 33034 } 33035} 33036 33037function invokeEffectsInDev(firstChild, fiberFlags, invokeEffectFn) { 33038 { 33039 // We don't need to re-check StrictEffectsMode here. 33040 // This function is only called if that check has already passed. 33041 var current = firstChild; 33042 var subtreeRoot = null; 33043 33044 while (current !== null) { 33045 var primarySubtreeFlag = current.subtreeFlags & fiberFlags; 33046 33047 if (current !== subtreeRoot && current.child !== null && primarySubtreeFlag !== NoFlags) { 33048 current = current.child; 33049 } else { 33050 if ((current.flags & fiberFlags) !== NoFlags) { 33051 invokeEffectFn(current); 33052 } 33053 33054 if (current.sibling !== null) { 33055 current = current.sibling; 33056 } else { 33057 current = subtreeRoot = current.return; 33058 } 33059 } 33060 } 33061 } 33062} 33063 33064var didWarnStateUpdateForNotYetMountedComponent = null; 33065function warnAboutUpdateOnNotYetMountedFiberInDEV(fiber) { 33066 { 33067 if ((executionContext & RenderContext) !== NoContext) { 33068 // We let the other warning about render phase updates deal with this one. 33069 return; 33070 } 33071 33072 if (!(fiber.mode & ConcurrentMode)) { 33073 return; 33074 } 33075 33076 var tag = fiber.tag; 33077 33078 if (tag !== IndeterminateComponent && tag !== HostRoot && tag !== ClassComponent && tag !== FunctionComponent && tag !== ForwardRef && tag !== MemoComponent && tag !== SimpleMemoComponent) { 33079 // Only warn for user-defined components, not internal ones like Suspense. 33080 return; 33081 } // We show the whole stack but dedupe on the top component's name because 33082 // the problematic code almost always lies inside that component. 33083 33084 33085 var componentName = getComponentNameFromFiber(fiber) || 'ReactComponent'; 33086 33087 if (didWarnStateUpdateForNotYetMountedComponent !== null) { 33088 if (didWarnStateUpdateForNotYetMountedComponent.has(componentName)) { 33089 return; 33090 } 33091 33092 didWarnStateUpdateForNotYetMountedComponent.add(componentName); 33093 } else { 33094 didWarnStateUpdateForNotYetMountedComponent = new Set([componentName]); 33095 } 33096 33097 var previousFiber = current; 33098 33099 try { 33100 setCurrentFiber(fiber); 33101 33102 error("Can't perform a React state update on a component that hasn't mounted yet. " + 'This indicates that you have a side-effect in your render function that ' + 'asynchronously later calls tries to update the component. Move this work to ' + 'useEffect instead.'); 33103 } finally { 33104 if (previousFiber) { 33105 setCurrentFiber(fiber); 33106 } else { 33107 resetCurrentFiber(); 33108 } 33109 } 33110 } 33111} 33112var beginWork$1; 33113 33114{ 33115 var dummyFiber = null; 33116 33117 beginWork$1 = function (current, unitOfWork, lanes) { 33118 // If a component throws an error, we replay it again in a synchronously 33119 // dispatched event, so that the debugger will treat it as an uncaught 33120 // error See ReactErrorUtils for more information. 33121 // Before entering the begin phase, copy the work-in-progress onto a dummy 33122 // fiber. If beginWork throws, we'll use this to reset the state. 33123 var originalWorkInProgressCopy = assignFiberPropertiesInDEV(dummyFiber, unitOfWork); 33124 33125 try { 33126 return beginWork(current, unitOfWork, lanes); 33127 } catch (originalError) { 33128 if (didSuspendOrErrorWhileHydratingDEV() || originalError !== null && typeof originalError === 'object' && typeof originalError.then === 'function') { 33129 // Don't replay promises. 33130 // Don't replay errors if we are hydrating and have already suspended or handled an error 33131 throw originalError; 33132 } // Keep this code in sync with handleError; any changes here must have 33133 // corresponding changes there. 33134 33135 33136 resetContextDependencies(); 33137 resetHooksAfterThrow(); // Don't reset current debug fiber, since we're about to work on the 33138 // same fiber again. 33139 // Unwind the failed stack frame 33140 33141 unwindInterruptedWork(current, unitOfWork); // Restore the original properties of the fiber. 33142 33143 assignFiberPropertiesInDEV(unitOfWork, originalWorkInProgressCopy); 33144 33145 if ( unitOfWork.mode & ProfileMode) { 33146 // Reset the profiler timer. 33147 startProfilerTimer(unitOfWork); 33148 } // Run beginWork again. 33149 33150 33151 invokeGuardedCallback(null, beginWork, null, current, unitOfWork, lanes); 33152 33153 if (hasCaughtError()) { 33154 var replayError = clearCaughtError(); 33155 33156 if (typeof replayError === 'object' && replayError !== null && replayError._suppressLogging && typeof originalError === 'object' && originalError !== null && !originalError._suppressLogging) { 33157 // If suppressed, let the flag carry over to the original error which is the one we'll rethrow. 33158 originalError._suppressLogging = true; 33159 } 33160 } // We always throw the original error in case the second render pass is not idempotent. 33161 // This can happen if a memoized function or CommonJS module doesn't throw after first invocation. 33162 33163 33164 throw originalError; 33165 } 33166 }; 33167} 33168 33169var didWarnAboutUpdateInRender = false; 33170var didWarnAboutUpdateInRenderForAnotherComponent; 33171 33172{ 33173 didWarnAboutUpdateInRenderForAnotherComponent = new Set(); 33174} 33175 33176function warnAboutRenderPhaseUpdatesInDEV(fiber) { 33177 { 33178 if (isRendering && !getIsUpdatingOpaqueValueInRenderPhaseInDEV()) { 33179 switch (fiber.tag) { 33180 case FunctionComponent: 33181 case ForwardRef: 33182 case SimpleMemoComponent: 33183 { 33184 var renderingComponentName = workInProgress && getComponentNameFromFiber(workInProgress) || 'Unknown'; // Dedupe by the rendering component because it's the one that needs to be fixed. 33185 33186 var dedupeKey = renderingComponentName; 33187 33188 if (!didWarnAboutUpdateInRenderForAnotherComponent.has(dedupeKey)) { 33189 didWarnAboutUpdateInRenderForAnotherComponent.add(dedupeKey); 33190 var setStateComponentName = getComponentNameFromFiber(fiber) || 'Unknown'; 33191 33192 error('Cannot update a component (`%s`) while rendering a ' + 'different component (`%s`). To locate the bad setState() call inside `%s`, ' + 'follow the stack trace as described in https://reactjs.org/link/setstate-in-render', setStateComponentName, renderingComponentName, renderingComponentName); 33193 } 33194 33195 break; 33196 } 33197 33198 case ClassComponent: 33199 { 33200 if (!didWarnAboutUpdateInRender) { 33201 error('Cannot update during an existing state transition (such as ' + 'within `render`). Render methods should be a pure ' + 'function of props and state.'); 33202 33203 didWarnAboutUpdateInRender = true; 33204 } 33205 33206 break; 33207 } 33208 } 33209 } 33210 } 33211} 33212 33213function restorePendingUpdaters(root, lanes) { 33214 { 33215 if (isDevToolsPresent) { 33216 var memoizedUpdaters = root.memoizedUpdaters; 33217 memoizedUpdaters.forEach(function (schedulingFiber) { 33218 addFiberToLanesMap(root, schedulingFiber, lanes); 33219 }); // This function intentionally does not clear memoized updaters. 33220 // Those may still be relevant to the current commit 33221 // and a future one (e.g. Suspense). 33222 } 33223 } 33224} 33225var fakeActCallbackNode = {}; 33226 33227function scheduleCallback$1(priorityLevel, callback) { 33228 { 33229 // If we're currently inside an `act` scope, bypass Scheduler and push to 33230 // the `act` queue instead. 33231 var actQueue = ReactCurrentActQueue$1.current; 33232 33233 if (actQueue !== null) { 33234 actQueue.push(callback); 33235 return fakeActCallbackNode; 33236 } else { 33237 return scheduleCallback(priorityLevel, callback); 33238 } 33239 } 33240} 33241 33242function cancelCallback$1(callbackNode) { 33243 if ( callbackNode === fakeActCallbackNode) { 33244 return; 33245 } // In production, always call Scheduler. This function will be stripped out. 33246 33247 33248 return cancelCallback(callbackNode); 33249} 33250 33251function shouldForceFlushFallbacksInDEV() { 33252 // Never force flush in production. This function should get stripped out. 33253 return ReactCurrentActQueue$1.current !== null; 33254} 33255 33256function warnIfUpdatesNotWrappedWithActDEV(fiber) { 33257 { 33258 if (fiber.mode & ConcurrentMode) { 33259 if (!isConcurrentActEnvironment()) { 33260 // Not in an act environment. No need to warn. 33261 return; 33262 } 33263 } else { 33264 // Legacy mode has additional cases where we suppress a warning. 33265 if (!isLegacyActEnvironment()) { 33266 // Not in an act environment. No need to warn. 33267 return; 33268 } 33269 33270 if (executionContext !== NoContext) { 33271 // Legacy mode doesn't warn if the update is batched, i.e. 33272 // batchedUpdates or flushSync. 33273 return; 33274 } 33275 33276 if (fiber.tag !== FunctionComponent && fiber.tag !== ForwardRef && fiber.tag !== SimpleMemoComponent) { 33277 // For backwards compatibility with pre-hooks code, legacy mode only 33278 // warns for updates that originate from a hook. 33279 return; 33280 } 33281 } 33282 33283 if (ReactCurrentActQueue$1.current === null) { 33284 var previousFiber = current; 33285 33286 try { 33287 setCurrentFiber(fiber); 33288 33289 error('An update to %s inside a test was not wrapped in act(...).\n\n' + 'When testing, code that causes React state updates should be ' + 'wrapped into act(...):\n\n' + 'act(() => {\n' + ' /* fire events that update state */\n' + '});\n' + '/* assert on the output */\n\n' + "This ensures that you're testing the behavior the user would see " + 'in the browser.' + ' Learn more at https://reactjs.org/link/wrap-tests-with-act', getComponentNameFromFiber(fiber)); 33290 } finally { 33291 if (previousFiber) { 33292 setCurrentFiber(fiber); 33293 } else { 33294 resetCurrentFiber(); 33295 } 33296 } 33297 } 33298 } 33299} 33300 33301function warnIfSuspenseResolutionNotWrappedWithActDEV(root) { 33302 { 33303 if (root.tag !== LegacyRoot && isConcurrentActEnvironment() && ReactCurrentActQueue$1.current === null) { 33304 error('A suspended resource finished loading inside a test, but the event ' + 'was not wrapped in act(...).\n\n' + 'When testing, code that resolves suspended data should be wrapped ' + 'into act(...):\n\n' + 'act(() => {\n' + ' /* finish loading suspended data */\n' + '});\n' + '/* assert on the output */\n\n' + "This ensures that you're testing the behavior the user would see " + 'in the browser.' + ' Learn more at https://reactjs.org/link/wrap-tests-with-act'); 33305 } 33306 } 33307} 33308 33309function setIsRunningInsertionEffect(isRunning) { 33310 { 33311 isRunningInsertionEffect = isRunning; 33312 } 33313} 33314 33315/* eslint-disable react-internal/prod-error-codes */ 33316var resolveFamily = null; // $FlowFixMe Flow gets confused by a WeakSet feature check below. 33317 33318var failedBoundaries = null; 33319var setRefreshHandler = function (handler) { 33320 { 33321 resolveFamily = handler; 33322 } 33323}; 33324function resolveFunctionForHotReloading(type) { 33325 { 33326 if (resolveFamily === null) { 33327 // Hot reloading is disabled. 33328 return type; 33329 } 33330 33331 var family = resolveFamily(type); 33332 33333 if (family === undefined) { 33334 return type; 33335 } // Use the latest known implementation. 33336 33337 33338 return family.current; 33339 } 33340} 33341function resolveClassForHotReloading(type) { 33342 // No implementation differences. 33343 return resolveFunctionForHotReloading(type); 33344} 33345function resolveForwardRefForHotReloading(type) { 33346 { 33347 if (resolveFamily === null) { 33348 // Hot reloading is disabled. 33349 return type; 33350 } 33351 33352 var family = resolveFamily(type); 33353 33354 if (family === undefined) { 33355 // Check if we're dealing with a real forwardRef. Don't want to crash early. 33356 if (type !== null && type !== undefined && typeof type.render === 'function') { 33357 // ForwardRef is special because its resolved .type is an object, 33358 // but it's possible that we only have its inner render function in the map. 33359 // If that inner render function is different, we'll build a new forwardRef type. 33360 var currentRender = resolveFunctionForHotReloading(type.render); 33361 33362 if (type.render !== currentRender) { 33363 var syntheticType = { 33364 $$typeof: REACT_FORWARD_REF_TYPE, 33365 render: currentRender 33366 }; 33367 33368 if (type.displayName !== undefined) { 33369 syntheticType.displayName = type.displayName; 33370 } 33371 33372 return syntheticType; 33373 } 33374 } 33375 33376 return type; 33377 } // Use the latest known implementation. 33378 33379 33380 return family.current; 33381 } 33382} 33383function isCompatibleFamilyForHotReloading(fiber, element) { 33384 { 33385 if (resolveFamily === null) { 33386 // Hot reloading is disabled. 33387 return false; 33388 } 33389 33390 var prevType = fiber.elementType; 33391 var nextType = element.type; // If we got here, we know types aren't === equal. 33392 33393 var needsCompareFamilies = false; 33394 var $$typeofNextType = typeof nextType === 'object' && nextType !== null ? nextType.$$typeof : null; 33395 33396 switch (fiber.tag) { 33397 case ClassComponent: 33398 { 33399 if (typeof nextType === 'function') { 33400 needsCompareFamilies = true; 33401 } 33402 33403 break; 33404 } 33405 33406 case FunctionComponent: 33407 { 33408 if (typeof nextType === 'function') { 33409 needsCompareFamilies = true; 33410 } else if ($$typeofNextType === REACT_LAZY_TYPE) { 33411 // We don't know the inner type yet. 33412 // We're going to assume that the lazy inner type is stable, 33413 // and so it is sufficient to avoid reconciling it away. 33414 // We're not going to unwrap or actually use the new lazy type. 33415 needsCompareFamilies = true; 33416 } 33417 33418 break; 33419 } 33420 33421 case ForwardRef: 33422 { 33423 if ($$typeofNextType === REACT_FORWARD_REF_TYPE) { 33424 needsCompareFamilies = true; 33425 } else if ($$typeofNextType === REACT_LAZY_TYPE) { 33426 needsCompareFamilies = true; 33427 } 33428 33429 break; 33430 } 33431 33432 case MemoComponent: 33433 case SimpleMemoComponent: 33434 { 33435 if ($$typeofNextType === REACT_MEMO_TYPE) { 33436 // TODO: if it was but can no longer be simple, 33437 // we shouldn't set this. 33438 needsCompareFamilies = true; 33439 } else if ($$typeofNextType === REACT_LAZY_TYPE) { 33440 needsCompareFamilies = true; 33441 } 33442 33443 break; 33444 } 33445 33446 default: 33447 return false; 33448 } // Check if both types have a family and it's the same one. 33449 33450 33451 if (needsCompareFamilies) { 33452 // Note: memo() and forwardRef() we'll compare outer rather than inner type. 33453 // This means both of them need to be registered to preserve state. 33454 // If we unwrapped and compared the inner types for wrappers instead, 33455 // then we would risk falsely saying two separate memo(Foo) 33456 // calls are equivalent because they wrap the same Foo function. 33457 var prevFamily = resolveFamily(prevType); 33458 33459 if (prevFamily !== undefined && prevFamily === resolveFamily(nextType)) { 33460 return true; 33461 } 33462 } 33463 33464 return false; 33465 } 33466} 33467function markFailedErrorBoundaryForHotReloading(fiber) { 33468 { 33469 if (resolveFamily === null) { 33470 // Hot reloading is disabled. 33471 return; 33472 } 33473 33474 if (typeof WeakSet !== 'function') { 33475 return; 33476 } 33477 33478 if (failedBoundaries === null) { 33479 failedBoundaries = new WeakSet(); 33480 } 33481 33482 failedBoundaries.add(fiber); 33483 } 33484} 33485var scheduleRefresh = function (root, update) { 33486 { 33487 if (resolveFamily === null) { 33488 // Hot reloading is disabled. 33489 return; 33490 } 33491 33492 var staleFamilies = update.staleFamilies, 33493 updatedFamilies = update.updatedFamilies; 33494 flushPassiveEffects(); 33495 flushSync(function () { 33496 scheduleFibersWithFamiliesRecursively(root.current, updatedFamilies, staleFamilies); 33497 }); 33498 } 33499}; 33500var scheduleRoot = function (root, element) { 33501 { 33502 if (root.context !== emptyContextObject) { 33503 // Super edge case: root has a legacy _renderSubtree context 33504 // but we don't know the parentComponent so we can't pass it. 33505 // Just ignore. We'll delete this with _renderSubtree code path later. 33506 return; 33507 } 33508 33509 flushPassiveEffects(); 33510 flushSync(function () { 33511 updateContainer(element, root, null, null); 33512 }); 33513 } 33514}; 33515 33516function scheduleFibersWithFamiliesRecursively(fiber, updatedFamilies, staleFamilies) { 33517 { 33518 var alternate = fiber.alternate, 33519 child = fiber.child, 33520 sibling = fiber.sibling, 33521 tag = fiber.tag, 33522 type = fiber.type; 33523 var candidateType = null; 33524 33525 switch (tag) { 33526 case FunctionComponent: 33527 case SimpleMemoComponent: 33528 case ClassComponent: 33529 candidateType = type; 33530 break; 33531 33532 case ForwardRef: 33533 candidateType = type.render; 33534 break; 33535 } 33536 33537 if (resolveFamily === null) { 33538 throw new Error('Expected resolveFamily to be set during hot reload.'); 33539 } 33540 33541 var needsRender = false; 33542 var needsRemount = false; 33543 33544 if (candidateType !== null) { 33545 var family = resolveFamily(candidateType); 33546 33547 if (family !== undefined) { 33548 if (staleFamilies.has(family)) { 33549 needsRemount = true; 33550 } else if (updatedFamilies.has(family)) { 33551 if (tag === ClassComponent) { 33552 needsRemount = true; 33553 } else { 33554 needsRender = true; 33555 } 33556 } 33557 } 33558 } 33559 33560 if (failedBoundaries !== null) { 33561 if (failedBoundaries.has(fiber) || alternate !== null && failedBoundaries.has(alternate)) { 33562 needsRemount = true; 33563 } 33564 } 33565 33566 if (needsRemount) { 33567 fiber._debugNeedsRemount = true; 33568 } 33569 33570 if (needsRemount || needsRender) { 33571 var _root = enqueueConcurrentRenderForLane(fiber, SyncLane); 33572 33573 if (_root !== null) { 33574 scheduleUpdateOnFiber(_root, fiber, SyncLane, NoTimestamp); 33575 } 33576 } 33577 33578 if (child !== null && !needsRemount) { 33579 scheduleFibersWithFamiliesRecursively(child, updatedFamilies, staleFamilies); 33580 } 33581 33582 if (sibling !== null) { 33583 scheduleFibersWithFamiliesRecursively(sibling, updatedFamilies, staleFamilies); 33584 } 33585 } 33586} 33587 33588var findHostInstancesForRefresh = function (root, families) { 33589 { 33590 var hostInstances = new Set(); 33591 var types = new Set(families.map(function (family) { 33592 return family.current; 33593 })); 33594 findHostInstancesForMatchingFibersRecursively(root.current, types, hostInstances); 33595 return hostInstances; 33596 } 33597}; 33598 33599function findHostInstancesForMatchingFibersRecursively(fiber, types, hostInstances) { 33600 { 33601 var child = fiber.child, 33602 sibling = fiber.sibling, 33603 tag = fiber.tag, 33604 type = fiber.type; 33605 var candidateType = null; 33606 33607 switch (tag) { 33608 case FunctionComponent: 33609 case SimpleMemoComponent: 33610 case ClassComponent: 33611 candidateType = type; 33612 break; 33613 33614 case ForwardRef: 33615 candidateType = type.render; 33616 break; 33617 } 33618 33619 var didMatch = false; 33620 33621 if (candidateType !== null) { 33622 if (types.has(candidateType)) { 33623 didMatch = true; 33624 } 33625 } 33626 33627 if (didMatch) { 33628 // We have a match. This only drills down to the closest host components. 33629 // There's no need to search deeper because for the purpose of giving 33630 // visual feedback, "flashing" outermost parent rectangles is sufficient. 33631 findHostInstancesForFiberShallowly(fiber, hostInstances); 33632 } else { 33633 // If there's no match, maybe there will be one further down in the child tree. 33634 if (child !== null) { 33635 findHostInstancesForMatchingFibersRecursively(child, types, hostInstances); 33636 } 33637 } 33638 33639 if (sibling !== null) { 33640 findHostInstancesForMatchingFibersRecursively(sibling, types, hostInstances); 33641 } 33642 } 33643} 33644 33645function findHostInstancesForFiberShallowly(fiber, hostInstances) { 33646 { 33647 var foundHostInstances = findChildHostInstancesForFiberShallowly(fiber, hostInstances); 33648 33649 if (foundHostInstances) { 33650 return; 33651 } // If we didn't find any host children, fallback to closest host parent. 33652 33653 33654 var node = fiber; 33655 33656 while (true) { 33657 switch (node.tag) { 33658 case HostComponent: 33659 hostInstances.add(node.stateNode); 33660 return; 33661 33662 case HostPortal: 33663 hostInstances.add(node.stateNode.containerInfo); 33664 return; 33665 33666 case HostRoot: 33667 hostInstances.add(node.stateNode.containerInfo); 33668 return; 33669 } 33670 33671 if (node.return === null) { 33672 throw new Error('Expected to reach root first.'); 33673 } 33674 33675 node = node.return; 33676 } 33677 } 33678} 33679 33680function findChildHostInstancesForFiberShallowly(fiber, hostInstances) { 33681 { 33682 var node = fiber; 33683 var foundHostInstances = false; 33684 33685 while (true) { 33686 if (node.tag === HostComponent) { 33687 // We got a match. 33688 foundHostInstances = true; 33689 hostInstances.add(node.stateNode); // There may still be more, so keep searching. 33690 } else if (node.child !== null) { 33691 node.child.return = node; 33692 node = node.child; 33693 continue; 33694 } 33695 33696 if (node === fiber) { 33697 return foundHostInstances; 33698 } 33699 33700 while (node.sibling === null) { 33701 if (node.return === null || node.return === fiber) { 33702 return foundHostInstances; 33703 } 33704 33705 node = node.return; 33706 } 33707 33708 node.sibling.return = node.return; 33709 node = node.sibling; 33710 } 33711 } 33712 33713 return false; 33714} 33715 33716var hasBadMapPolyfill; 33717 33718{ 33719 hasBadMapPolyfill = false; 33720 33721 try { 33722 var nonExtensibleObject = Object.preventExtensions({}); 33723 /* eslint-disable no-new */ 33724 33725 new Map([[nonExtensibleObject, null]]); 33726 new Set([nonExtensibleObject]); 33727 /* eslint-enable no-new */ 33728 } catch (e) { 33729 // TODO: Consider warning about bad polyfills 33730 hasBadMapPolyfill = true; 33731 } 33732} 33733 33734function FiberNode(tag, pendingProps, key, mode) { 33735 // Instance 33736 this.tag = tag; 33737 this.key = key; 33738 this.elementType = null; 33739 this.type = null; 33740 this.stateNode = null; // Fiber 33741 33742 this.return = null; 33743 this.child = null; 33744 this.sibling = null; 33745 this.index = 0; 33746 this.ref = null; 33747 this.pendingProps = pendingProps; 33748 this.memoizedProps = null; 33749 this.updateQueue = null; 33750 this.memoizedState = null; 33751 this.dependencies = null; 33752 this.mode = mode; // Effects 33753 33754 this.flags = NoFlags; 33755 this.subtreeFlags = NoFlags; 33756 this.deletions = null; 33757 this.lanes = NoLanes; 33758 this.childLanes = NoLanes; 33759 this.alternate = null; 33760 33761 { 33762 // Note: The following is done to avoid a v8 performance cliff. 33763 // 33764 // Initializing the fields below to smis and later updating them with 33765 // double values will cause Fibers to end up having separate shapes. 33766 // This behavior/bug has something to do with Object.preventExtension(). 33767 // Fortunately this only impacts DEV builds. 33768 // Unfortunately it makes React unusably slow for some applications. 33769 // To work around this, initialize the fields below with doubles. 33770 // 33771 // Learn more about this here: 33772 // https://github.com/facebook/react/issues/14365 33773 // https://bugs.chromium.org/p/v8/issues/detail?id=8538 33774 this.actualDuration = Number.NaN; 33775 this.actualStartTime = Number.NaN; 33776 this.selfBaseDuration = Number.NaN; 33777 this.treeBaseDuration = Number.NaN; // It's okay to replace the initial doubles with smis after initialization. 33778 // This won't trigger the performance cliff mentioned above, 33779 // and it simplifies other profiler code (including DevTools). 33780 33781 this.actualDuration = 0; 33782 this.actualStartTime = -1; 33783 this.selfBaseDuration = 0; 33784 this.treeBaseDuration = 0; 33785 } 33786 33787 { 33788 // This isn't directly used but is handy for debugging internals: 33789 this._debugSource = null; 33790 this._debugOwner = null; 33791 this._debugNeedsRemount = false; 33792 this._debugHookTypes = null; 33793 33794 if (!hasBadMapPolyfill && typeof Object.preventExtensions === 'function') { 33795 Object.preventExtensions(this); 33796 } 33797 } 33798} // This is a constructor function, rather than a POJO constructor, still 33799// please ensure we do the following: 33800// 1) Nobody should add any instance methods on this. Instance methods can be 33801// more difficult to predict when they get optimized and they are almost 33802// never inlined properly in static compilers. 33803// 2) Nobody should rely on `instanceof Fiber` for type testing. We should 33804// always know when it is a fiber. 33805// 3) We might want to experiment with using numeric keys since they are easier 33806// to optimize in a non-JIT environment. 33807// 4) We can easily go from a constructor to a createFiber object literal if that 33808// is faster. 33809// 5) It should be easy to port this to a C struct and keep a C implementation 33810// compatible. 33811 33812 33813var createFiber = function (tag, pendingProps, key, mode) { 33814 // $FlowFixMe: the shapes are exact here but Flow doesn't like constructors 33815 return new FiberNode(tag, pendingProps, key, mode); 33816}; 33817 33818function shouldConstruct$1(Component) { 33819 var prototype = Component.prototype; 33820 return !!(prototype && prototype.isReactComponent); 33821} 33822 33823function isSimpleFunctionComponent(type) { 33824 return typeof type === 'function' && !shouldConstruct$1(type) && type.defaultProps === undefined; 33825} 33826function resolveLazyComponentTag(Component) { 33827 if (typeof Component === 'function') { 33828 return shouldConstruct$1(Component) ? ClassComponent : FunctionComponent; 33829 } else if (Component !== undefined && Component !== null) { 33830 var $$typeof = Component.$$typeof; 33831 33832 if ($$typeof === REACT_FORWARD_REF_TYPE) { 33833 return ForwardRef; 33834 } 33835 33836 if ($$typeof === REACT_MEMO_TYPE) { 33837 return MemoComponent; 33838 } 33839 } 33840 33841 return IndeterminateComponent; 33842} // This is used to create an alternate fiber to do work on. 33843 33844function createWorkInProgress(current, pendingProps) { 33845 var workInProgress = current.alternate; 33846 33847 if (workInProgress === null) { 33848 // We use a double buffering pooling technique because we know that we'll 33849 // only ever need at most two versions of a tree. We pool the "other" unused 33850 // node that we're free to reuse. This is lazily created to avoid allocating 33851 // extra objects for things that are never updated. It also allow us to 33852 // reclaim the extra memory if needed. 33853 workInProgress = createFiber(current.tag, pendingProps, current.key, current.mode); 33854 workInProgress.elementType = current.elementType; 33855 workInProgress.type = current.type; 33856 workInProgress.stateNode = current.stateNode; 33857 33858 { 33859 // DEV-only fields 33860 workInProgress._debugSource = current._debugSource; 33861 workInProgress._debugOwner = current._debugOwner; 33862 workInProgress._debugHookTypes = current._debugHookTypes; 33863 } 33864 33865 workInProgress.alternate = current; 33866 current.alternate = workInProgress; 33867 } else { 33868 workInProgress.pendingProps = pendingProps; // Needed because Blocks store data on type. 33869 33870 workInProgress.type = current.type; // We already have an alternate. 33871 // Reset the effect tag. 33872 33873 workInProgress.flags = NoFlags; // The effects are no longer valid. 33874 33875 workInProgress.subtreeFlags = NoFlags; 33876 workInProgress.deletions = null; 33877 33878 { 33879 // We intentionally reset, rather than copy, actualDuration & actualStartTime. 33880 // This prevents time from endlessly accumulating in new commits. 33881 // This has the downside of resetting values for different priority renders, 33882 // But works for yielding (the common case) and should support resuming. 33883 workInProgress.actualDuration = 0; 33884 workInProgress.actualStartTime = -1; 33885 } 33886 } // Reset all effects except static ones. 33887 // Static effects are not specific to a render. 33888 33889 33890 workInProgress.flags = current.flags & StaticMask; 33891 workInProgress.childLanes = current.childLanes; 33892 workInProgress.lanes = current.lanes; 33893 workInProgress.child = current.child; 33894 workInProgress.memoizedProps = current.memoizedProps; 33895 workInProgress.memoizedState = current.memoizedState; 33896 workInProgress.updateQueue = current.updateQueue; // Clone the dependencies object. This is mutated during the render phase, so 33897 // it cannot be shared with the current fiber. 33898 33899 var currentDependencies = current.dependencies; 33900 workInProgress.dependencies = currentDependencies === null ? null : { 33901 lanes: currentDependencies.lanes, 33902 firstContext: currentDependencies.firstContext 33903 }; // These will be overridden during the parent's reconciliation 33904 33905 workInProgress.sibling = current.sibling; 33906 workInProgress.index = current.index; 33907 workInProgress.ref = current.ref; 33908 33909 { 33910 workInProgress.selfBaseDuration = current.selfBaseDuration; 33911 workInProgress.treeBaseDuration = current.treeBaseDuration; 33912 } 33913 33914 { 33915 workInProgress._debugNeedsRemount = current._debugNeedsRemount; 33916 33917 switch (workInProgress.tag) { 33918 case IndeterminateComponent: 33919 case FunctionComponent: 33920 case SimpleMemoComponent: 33921 workInProgress.type = resolveFunctionForHotReloading(current.type); 33922 break; 33923 33924 case ClassComponent: 33925 workInProgress.type = resolveClassForHotReloading(current.type); 33926 break; 33927 33928 case ForwardRef: 33929 workInProgress.type = resolveForwardRefForHotReloading(current.type); 33930 break; 33931 } 33932 } 33933 33934 return workInProgress; 33935} // Used to reuse a Fiber for a second pass. 33936 33937function resetWorkInProgress(workInProgress, renderLanes) { 33938 // This resets the Fiber to what createFiber or createWorkInProgress would 33939 // have set the values to before during the first pass. Ideally this wouldn't 33940 // be necessary but unfortunately many code paths reads from the workInProgress 33941 // when they should be reading from current and writing to workInProgress. 33942 // We assume pendingProps, index, key, ref, return are still untouched to 33943 // avoid doing another reconciliation. 33944 // Reset the effect flags but keep any Placement tags, since that's something 33945 // that child fiber is setting, not the reconciliation. 33946 workInProgress.flags &= StaticMask | Placement; // The effects are no longer valid. 33947 33948 var current = workInProgress.alternate; 33949 33950 if (current === null) { 33951 // Reset to createFiber's initial values. 33952 workInProgress.childLanes = NoLanes; 33953 workInProgress.lanes = renderLanes; 33954 workInProgress.child = null; 33955 workInProgress.subtreeFlags = NoFlags; 33956 workInProgress.memoizedProps = null; 33957 workInProgress.memoizedState = null; 33958 workInProgress.updateQueue = null; 33959 workInProgress.dependencies = null; 33960 workInProgress.stateNode = null; 33961 33962 { 33963 // Note: We don't reset the actualTime counts. It's useful to accumulate 33964 // actual time across multiple render passes. 33965 workInProgress.selfBaseDuration = 0; 33966 workInProgress.treeBaseDuration = 0; 33967 } 33968 } else { 33969 // Reset to the cloned values that createWorkInProgress would've. 33970 workInProgress.childLanes = current.childLanes; 33971 workInProgress.lanes = current.lanes; 33972 workInProgress.child = current.child; 33973 workInProgress.subtreeFlags = NoFlags; 33974 workInProgress.deletions = null; 33975 workInProgress.memoizedProps = current.memoizedProps; 33976 workInProgress.memoizedState = current.memoizedState; 33977 workInProgress.updateQueue = current.updateQueue; // Needed because Blocks store data on type. 33978 33979 workInProgress.type = current.type; // Clone the dependencies object. This is mutated during the render phase, so 33980 // it cannot be shared with the current fiber. 33981 33982 var currentDependencies = current.dependencies; 33983 workInProgress.dependencies = currentDependencies === null ? null : { 33984 lanes: currentDependencies.lanes, 33985 firstContext: currentDependencies.firstContext 33986 }; 33987 33988 { 33989 // Note: We don't reset the actualTime counts. It's useful to accumulate 33990 // actual time across multiple render passes. 33991 workInProgress.selfBaseDuration = current.selfBaseDuration; 33992 workInProgress.treeBaseDuration = current.treeBaseDuration; 33993 } 33994 } 33995 33996 return workInProgress; 33997} 33998function createHostRootFiber(tag, isStrictMode, concurrentUpdatesByDefaultOverride) { 33999 var mode; 34000 34001 if (tag === ConcurrentRoot) { 34002 mode = ConcurrentMode; 34003 34004 if (isStrictMode === true) { 34005 mode |= StrictLegacyMode; 34006 34007 { 34008 mode |= StrictEffectsMode; 34009 } 34010 } 34011 } else { 34012 mode = NoMode; 34013 } 34014 34015 if ( isDevToolsPresent) { 34016 // Always collect profile timings when DevTools are present. 34017 // This enables DevTools to start capturing timing at any point– 34018 // Without some nodes in the tree having empty base times. 34019 mode |= ProfileMode; 34020 } 34021 34022 return createFiber(HostRoot, null, null, mode); 34023} 34024function createFiberFromTypeAndProps(type, // React$ElementType 34025key, pendingProps, owner, mode, lanes) { 34026 var fiberTag = IndeterminateComponent; // The resolved type is set if we know what the final type will be. I.e. it's not lazy. 34027 34028 var resolvedType = type; 34029 34030 if (typeof type === 'function') { 34031 if (shouldConstruct$1(type)) { 34032 fiberTag = ClassComponent; 34033 34034 { 34035 resolvedType = resolveClassForHotReloading(resolvedType); 34036 } 34037 } else { 34038 { 34039 resolvedType = resolveFunctionForHotReloading(resolvedType); 34040 } 34041 } 34042 } else if (typeof type === 'string') { 34043 fiberTag = HostComponent; 34044 } else { 34045 getTag: switch (type) { 34046 case REACT_FRAGMENT_TYPE: 34047 return createFiberFromFragment(pendingProps.children, mode, lanes, key); 34048 34049 case REACT_STRICT_MODE_TYPE: 34050 fiberTag = Mode; 34051 mode |= StrictLegacyMode; 34052 34053 if ( (mode & ConcurrentMode) !== NoMode) { 34054 // Strict effects should never run on legacy roots 34055 mode |= StrictEffectsMode; 34056 } 34057 34058 break; 34059 34060 case REACT_PROFILER_TYPE: 34061 return createFiberFromProfiler(pendingProps, mode, lanes, key); 34062 34063 case REACT_SUSPENSE_TYPE: 34064 return createFiberFromSuspense(pendingProps, mode, lanes, key); 34065 34066 case REACT_SUSPENSE_LIST_TYPE: 34067 return createFiberFromSuspenseList(pendingProps, mode, lanes, key); 34068 34069 case REACT_OFFSCREEN_TYPE: 34070 return createFiberFromOffscreen(pendingProps, mode, lanes, key); 34071 34072 case REACT_LEGACY_HIDDEN_TYPE: 34073 34074 // eslint-disable-next-line no-fallthrough 34075 34076 case REACT_SCOPE_TYPE: 34077 34078 // eslint-disable-next-line no-fallthrough 34079 34080 case REACT_CACHE_TYPE: 34081 34082 // eslint-disable-next-line no-fallthrough 34083 34084 case REACT_TRACING_MARKER_TYPE: 34085 34086 // eslint-disable-next-line no-fallthrough 34087 34088 case REACT_DEBUG_TRACING_MODE_TYPE: 34089 34090 // eslint-disable-next-line no-fallthrough 34091 34092 default: 34093 { 34094 if (typeof type === 'object' && type !== null) { 34095 switch (type.$$typeof) { 34096 case REACT_PROVIDER_TYPE: 34097 fiberTag = ContextProvider; 34098 break getTag; 34099 34100 case REACT_CONTEXT_TYPE: 34101 // This is a consumer 34102 fiberTag = ContextConsumer; 34103 break getTag; 34104 34105 case REACT_FORWARD_REF_TYPE: 34106 fiberTag = ForwardRef; 34107 34108 { 34109 resolvedType = resolveForwardRefForHotReloading(resolvedType); 34110 } 34111 34112 break getTag; 34113 34114 case REACT_MEMO_TYPE: 34115 fiberTag = MemoComponent; 34116 break getTag; 34117 34118 case REACT_LAZY_TYPE: 34119 fiberTag = LazyComponent; 34120 resolvedType = null; 34121 break getTag; 34122 } 34123 } 34124 34125 var info = ''; 34126 34127 { 34128 if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) { 34129 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.'; 34130 } 34131 34132 var ownerName = owner ? getComponentNameFromFiber(owner) : null; 34133 34134 if (ownerName) { 34135 info += '\n\nCheck the render method of `' + ownerName + '`.'; 34136 } 34137 } 34138 34139 throw new Error('Element type is invalid: expected a string (for built-in ' + 'components) or a class/function (for composite components) ' + ("but got: " + (type == null ? type : typeof type) + "." + info)); 34140 } 34141 } 34142 } 34143 34144 var fiber = createFiber(fiberTag, pendingProps, key, mode); 34145 fiber.elementType = type; 34146 fiber.type = resolvedType; 34147 fiber.lanes = lanes; 34148 34149 { 34150 fiber._debugOwner = owner; 34151 } 34152 34153 return fiber; 34154} 34155function createFiberFromElement(element, mode, lanes) { 34156 var owner = null; 34157 34158 { 34159 owner = element._owner; 34160 } 34161 34162 var type = element.type; 34163 var key = element.key; 34164 var pendingProps = element.props; 34165 var fiber = createFiberFromTypeAndProps(type, key, pendingProps, owner, mode, lanes); 34166 34167 { 34168 fiber._debugSource = element._source; 34169 fiber._debugOwner = element._owner; 34170 } 34171 34172 return fiber; 34173} 34174function createFiberFromFragment(elements, mode, lanes, key) { 34175 var fiber = createFiber(Fragment, elements, key, mode); 34176 fiber.lanes = lanes; 34177 return fiber; 34178} 34179 34180function createFiberFromProfiler(pendingProps, mode, lanes, key) { 34181 { 34182 if (typeof pendingProps.id !== 'string') { 34183 error('Profiler must specify an "id" of type `string` as a prop. Received the type `%s` instead.', typeof pendingProps.id); 34184 } 34185 } 34186 34187 var fiber = createFiber(Profiler, pendingProps, key, mode | ProfileMode); 34188 fiber.elementType = REACT_PROFILER_TYPE; 34189 fiber.lanes = lanes; 34190 34191 { 34192 fiber.stateNode = { 34193 effectDuration: 0, 34194 passiveEffectDuration: 0 34195 }; 34196 } 34197 34198 return fiber; 34199} 34200 34201function createFiberFromSuspense(pendingProps, mode, lanes, key) { 34202 var fiber = createFiber(SuspenseComponent, pendingProps, key, mode); 34203 fiber.elementType = REACT_SUSPENSE_TYPE; 34204 fiber.lanes = lanes; 34205 return fiber; 34206} 34207function createFiberFromSuspenseList(pendingProps, mode, lanes, key) { 34208 var fiber = createFiber(SuspenseListComponent, pendingProps, key, mode); 34209 fiber.elementType = REACT_SUSPENSE_LIST_TYPE; 34210 fiber.lanes = lanes; 34211 return fiber; 34212} 34213function createFiberFromOffscreen(pendingProps, mode, lanes, key) { 34214 var fiber = createFiber(OffscreenComponent, pendingProps, key, mode); 34215 fiber.elementType = REACT_OFFSCREEN_TYPE; 34216 fiber.lanes = lanes; 34217 var primaryChildInstance = { 34218 isHidden: false 34219 }; 34220 fiber.stateNode = primaryChildInstance; 34221 return fiber; 34222} 34223function createFiberFromText(content, mode, lanes) { 34224 var fiber = createFiber(HostText, content, null, mode); 34225 fiber.lanes = lanes; 34226 return fiber; 34227} 34228function createFiberFromHostInstanceForDeletion() { 34229 var fiber = createFiber(HostComponent, null, null, NoMode); 34230 fiber.elementType = 'DELETED'; 34231 return fiber; 34232} 34233function createFiberFromDehydratedFragment(dehydratedNode) { 34234 var fiber = createFiber(DehydratedFragment, null, null, NoMode); 34235 fiber.stateNode = dehydratedNode; 34236 return fiber; 34237} 34238function createFiberFromPortal(portal, mode, lanes) { 34239 var pendingProps = portal.children !== null ? portal.children : []; 34240 var fiber = createFiber(HostPortal, pendingProps, portal.key, mode); 34241 fiber.lanes = lanes; 34242 fiber.stateNode = { 34243 containerInfo: portal.containerInfo, 34244 pendingChildren: null, 34245 // Used by persistent updates 34246 implementation: portal.implementation 34247 }; 34248 return fiber; 34249} // Used for stashing WIP properties to replay failed work in DEV. 34250 34251function assignFiberPropertiesInDEV(target, source) { 34252 if (target === null) { 34253 // This Fiber's initial properties will always be overwritten. 34254 // We only use a Fiber to ensure the same hidden class so DEV isn't slow. 34255 target = createFiber(IndeterminateComponent, null, null, NoMode); 34256 } // This is intentionally written as a list of all properties. 34257 // We tried to use Object.assign() instead but this is called in 34258 // the hottest path, and Object.assign() was too slow: 34259 // https://github.com/facebook/react/issues/12502 34260 // This code is DEV-only so size is not a concern. 34261 34262 34263 target.tag = source.tag; 34264 target.key = source.key; 34265 target.elementType = source.elementType; 34266 target.type = source.type; 34267 target.stateNode = source.stateNode; 34268 target.return = source.return; 34269 target.child = source.child; 34270 target.sibling = source.sibling; 34271 target.index = source.index; 34272 target.ref = source.ref; 34273 target.pendingProps = source.pendingProps; 34274 target.memoizedProps = source.memoizedProps; 34275 target.updateQueue = source.updateQueue; 34276 target.memoizedState = source.memoizedState; 34277 target.dependencies = source.dependencies; 34278 target.mode = source.mode; 34279 target.flags = source.flags; 34280 target.subtreeFlags = source.subtreeFlags; 34281 target.deletions = source.deletions; 34282 target.lanes = source.lanes; 34283 target.childLanes = source.childLanes; 34284 target.alternate = source.alternate; 34285 34286 { 34287 target.actualDuration = source.actualDuration; 34288 target.actualStartTime = source.actualStartTime; 34289 target.selfBaseDuration = source.selfBaseDuration; 34290 target.treeBaseDuration = source.treeBaseDuration; 34291 } 34292 34293 target._debugSource = source._debugSource; 34294 target._debugOwner = source._debugOwner; 34295 target._debugNeedsRemount = source._debugNeedsRemount; 34296 target._debugHookTypes = source._debugHookTypes; 34297 return target; 34298} 34299 34300function FiberRootNode(containerInfo, tag, hydrate, identifierPrefix, onRecoverableError) { 34301 this.tag = tag; 34302 this.containerInfo = containerInfo; 34303 this.pendingChildren = null; 34304 this.current = null; 34305 this.pingCache = null; 34306 this.finishedWork = null; 34307 this.timeoutHandle = noTimeout; 34308 this.context = null; 34309 this.pendingContext = null; 34310 this.callbackNode = null; 34311 this.callbackPriority = NoLane; 34312 this.eventTimes = createLaneMap(NoLanes); 34313 this.expirationTimes = createLaneMap(NoTimestamp); 34314 this.pendingLanes = NoLanes; 34315 this.suspendedLanes = NoLanes; 34316 this.pingedLanes = NoLanes; 34317 this.expiredLanes = NoLanes; 34318 this.mutableReadLanes = NoLanes; 34319 this.finishedLanes = NoLanes; 34320 this.entangledLanes = NoLanes; 34321 this.entanglements = createLaneMap(NoLanes); 34322 this.identifierPrefix = identifierPrefix; 34323 this.onRecoverableError = onRecoverableError; 34324 34325 { 34326 this.mutableSourceEagerHydrationData = null; 34327 } 34328 34329 { 34330 this.effectDuration = 0; 34331 this.passiveEffectDuration = 0; 34332 } 34333 34334 { 34335 this.memoizedUpdaters = new Set(); 34336 var pendingUpdatersLaneMap = this.pendingUpdatersLaneMap = []; 34337 34338 for (var _i = 0; _i < TotalLanes; _i++) { 34339 pendingUpdatersLaneMap.push(new Set()); 34340 } 34341 } 34342 34343 { 34344 switch (tag) { 34345 case ConcurrentRoot: 34346 this._debugRootType = hydrate ? 'hydrateRoot()' : 'createRoot()'; 34347 break; 34348 34349 case LegacyRoot: 34350 this._debugRootType = hydrate ? 'hydrate()' : 'render()'; 34351 break; 34352 } 34353 } 34354} 34355 34356function createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, // TODO: We have several of these arguments that are conceptually part of the 34357// host config, but because they are passed in at runtime, we have to thread 34358// them through the root constructor. Perhaps we should put them all into a 34359// single type, like a DynamicHostConfig that is defined by the renderer. 34360identifierPrefix, onRecoverableError, transitionCallbacks) { 34361 var root = new FiberRootNode(containerInfo, tag, hydrate, identifierPrefix, onRecoverableError); 34362 // stateNode is any. 34363 34364 34365 var uninitializedFiber = createHostRootFiber(tag, isStrictMode); 34366 root.current = uninitializedFiber; 34367 uninitializedFiber.stateNode = root; 34368 34369 { 34370 var _initialState = { 34371 element: initialChildren, 34372 isDehydrated: hydrate, 34373 cache: null, 34374 // not enabled yet 34375 transitions: null, 34376 pendingSuspenseBoundaries: null 34377 }; 34378 uninitializedFiber.memoizedState = _initialState; 34379 } 34380 34381 initializeUpdateQueue(uninitializedFiber); 34382 return root; 34383} 34384 34385var ReactVersion = '18.2.0'; 34386 34387function createPortal(children, containerInfo, // TODO: figure out the API for cross-renderer implementation. 34388implementation) { 34389 var key = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null; 34390 34391 { 34392 checkKeyStringCoercion(key); 34393 } 34394 34395 return { 34396 // This tag allow us to uniquely identify this as a React Portal 34397 $$typeof: REACT_PORTAL_TYPE, 34398 key: key == null ? null : '' + key, 34399 children: children, 34400 containerInfo: containerInfo, 34401 implementation: implementation 34402 }; 34403} 34404 34405var didWarnAboutNestedUpdates; 34406var didWarnAboutFindNodeInStrictMode; 34407 34408{ 34409 didWarnAboutNestedUpdates = false; 34410 didWarnAboutFindNodeInStrictMode = {}; 34411} 34412 34413function getContextForSubtree(parentComponent) { 34414 if (!parentComponent) { 34415 return emptyContextObject; 34416 } 34417 34418 var fiber = get(parentComponent); 34419 var parentContext = findCurrentUnmaskedContext(fiber); 34420 34421 if (fiber.tag === ClassComponent) { 34422 var Component = fiber.type; 34423 34424 if (isContextProvider(Component)) { 34425 return processChildContext(fiber, Component, parentContext); 34426 } 34427 } 34428 34429 return parentContext; 34430} 34431 34432function findHostInstanceWithWarning(component, methodName) { 34433 { 34434 var fiber = get(component); 34435 34436 if (fiber === undefined) { 34437 if (typeof component.render === 'function') { 34438 throw new Error('Unable to find node on an unmounted component.'); 34439 } else { 34440 var keys = Object.keys(component).join(','); 34441 throw new Error("Argument appears to not be a ReactComponent. Keys: " + keys); 34442 } 34443 } 34444 34445 var hostFiber = findCurrentHostFiber(fiber); 34446 34447 if (hostFiber === null) { 34448 return null; 34449 } 34450 34451 if (hostFiber.mode & StrictLegacyMode) { 34452 var componentName = getComponentNameFromFiber(fiber) || 'Component'; 34453 34454 if (!didWarnAboutFindNodeInStrictMode[componentName]) { 34455 didWarnAboutFindNodeInStrictMode[componentName] = true; 34456 var previousFiber = current; 34457 34458 try { 34459 setCurrentFiber(hostFiber); 34460 34461 if (fiber.mode & StrictLegacyMode) { 34462 error('%s is deprecated in StrictMode. ' + '%s was passed an instance of %s which is inside StrictMode. ' + 'Instead, add a ref directly to the element you want to reference. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node', methodName, methodName, componentName); 34463 } else { 34464 error('%s is deprecated in StrictMode. ' + '%s was passed an instance of %s which renders StrictMode children. ' + 'Instead, add a ref directly to the element you want to reference. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-find-node', methodName, methodName, componentName); 34465 } 34466 } finally { 34467 // Ideally this should reset to previous but this shouldn't be called in 34468 // render and there's another warning for that anyway. 34469 if (previousFiber) { 34470 setCurrentFiber(previousFiber); 34471 } else { 34472 resetCurrentFiber(); 34473 } 34474 } 34475 } 34476 } 34477 34478 return hostFiber.stateNode; 34479 } 34480} 34481 34482function createContainer(containerInfo, tag, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError, transitionCallbacks) { 34483 var hydrate = false; 34484 var initialChildren = null; 34485 return createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError); 34486} 34487function createHydrationContainer(initialChildren, // TODO: Remove `callback` when we delete legacy mode. 34488callback, containerInfo, tag, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError, transitionCallbacks) { 34489 var hydrate = true; 34490 var root = createFiberRoot(containerInfo, tag, hydrate, initialChildren, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError); // TODO: Move this to FiberRoot constructor 34491 34492 root.context = getContextForSubtree(null); // Schedule the initial render. In a hydration root, this is different from 34493 // a regular update because the initial render must match was was rendered 34494 // on the server. 34495 // NOTE: This update intentionally doesn't have a payload. We're only using 34496 // the update to schedule work on the root fiber (and, for legacy roots, to 34497 // enqueue the callback if one is provided). 34498 34499 var current = root.current; 34500 var eventTime = requestEventTime(); 34501 var lane = requestUpdateLane(current); 34502 var update = createUpdate(eventTime, lane); 34503 update.callback = callback !== undefined && callback !== null ? callback : null; 34504 enqueueUpdate(current, update, lane); 34505 scheduleInitialHydrationOnRoot(root, lane, eventTime); 34506 return root; 34507} 34508function updateContainer(element, container, parentComponent, callback) { 34509 { 34510 onScheduleRoot(container, element); 34511 } 34512 34513 var current$1 = container.current; 34514 var eventTime = requestEventTime(); 34515 var lane = requestUpdateLane(current$1); 34516 34517 { 34518 markRenderScheduled(lane); 34519 } 34520 34521 var context = getContextForSubtree(parentComponent); 34522 34523 if (container.context === null) { 34524 container.context = context; 34525 } else { 34526 container.pendingContext = context; 34527 } 34528 34529 { 34530 if (isRendering && current !== null && !didWarnAboutNestedUpdates) { 34531 didWarnAboutNestedUpdates = true; 34532 34533 error('Render methods should be a pure function of props and state; ' + 'triggering nested component updates from render is not allowed. ' + 'If necessary, trigger nested updates in componentDidUpdate.\n\n' + 'Check the render method of %s.', getComponentNameFromFiber(current) || 'Unknown'); 34534 } 34535 } 34536 34537 var update = createUpdate(eventTime, lane); // Caution: React DevTools currently depends on this property 34538 // being called "element". 34539 34540 update.payload = { 34541 element: element 34542 }; 34543 callback = callback === undefined ? null : callback; 34544 34545 if (callback !== null) { 34546 { 34547 if (typeof callback !== 'function') { 34548 error('render(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callback); 34549 } 34550 } 34551 34552 update.callback = callback; 34553 } 34554 34555 var root = enqueueUpdate(current$1, update, lane); 34556 34557 if (root !== null) { 34558 scheduleUpdateOnFiber(root, current$1, lane, eventTime); 34559 entangleTransitions(root, current$1, lane); 34560 } 34561 34562 return lane; 34563} 34564function getPublicRootInstance(container) { 34565 var containerFiber = container.current; 34566 34567 if (!containerFiber.child) { 34568 return null; 34569 } 34570 34571 switch (containerFiber.child.tag) { 34572 case HostComponent: 34573 return getPublicInstance(containerFiber.child.stateNode); 34574 34575 default: 34576 return containerFiber.child.stateNode; 34577 } 34578} 34579function attemptSynchronousHydration$1(fiber) { 34580 switch (fiber.tag) { 34581 case HostRoot: 34582 { 34583 var root = fiber.stateNode; 34584 34585 if (isRootDehydrated(root)) { 34586 // Flush the first scheduled "update". 34587 var lanes = getHighestPriorityPendingLanes(root); 34588 flushRoot(root, lanes); 34589 } 34590 34591 break; 34592 } 34593 34594 case SuspenseComponent: 34595 { 34596 flushSync(function () { 34597 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34598 34599 if (root !== null) { 34600 var eventTime = requestEventTime(); 34601 scheduleUpdateOnFiber(root, fiber, SyncLane, eventTime); 34602 } 34603 }); // If we're still blocked after this, we need to increase 34604 // the priority of any promises resolving within this 34605 // boundary so that they next attempt also has higher pri. 34606 34607 var retryLane = SyncLane; 34608 markRetryLaneIfNotHydrated(fiber, retryLane); 34609 break; 34610 } 34611 } 34612} 34613 34614function markRetryLaneImpl(fiber, retryLane) { 34615 var suspenseState = fiber.memoizedState; 34616 34617 if (suspenseState !== null && suspenseState.dehydrated !== null) { 34618 suspenseState.retryLane = higherPriorityLane(suspenseState.retryLane, retryLane); 34619 } 34620} // Increases the priority of thenables when they resolve within this boundary. 34621 34622 34623function markRetryLaneIfNotHydrated(fiber, retryLane) { 34624 markRetryLaneImpl(fiber, retryLane); 34625 var alternate = fiber.alternate; 34626 34627 if (alternate) { 34628 markRetryLaneImpl(alternate, retryLane); 34629 } 34630} 34631function attemptContinuousHydration$1(fiber) { 34632 if (fiber.tag !== SuspenseComponent) { 34633 // We ignore HostRoots here because we can't increase 34634 // their priority and they should not suspend on I/O, 34635 // since you have to wrap anything that might suspend in 34636 // Suspense. 34637 return; 34638 } 34639 34640 var lane = SelectiveHydrationLane; 34641 var root = enqueueConcurrentRenderForLane(fiber, lane); 34642 34643 if (root !== null) { 34644 var eventTime = requestEventTime(); 34645 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 34646 } 34647 34648 markRetryLaneIfNotHydrated(fiber, lane); 34649} 34650function attemptHydrationAtCurrentPriority$1(fiber) { 34651 if (fiber.tag !== SuspenseComponent) { 34652 // We ignore HostRoots here because we can't increase 34653 // their priority other than synchronously flush it. 34654 return; 34655 } 34656 34657 var lane = requestUpdateLane(fiber); 34658 var root = enqueueConcurrentRenderForLane(fiber, lane); 34659 34660 if (root !== null) { 34661 var eventTime = requestEventTime(); 34662 scheduleUpdateOnFiber(root, fiber, lane, eventTime); 34663 } 34664 34665 markRetryLaneIfNotHydrated(fiber, lane); 34666} 34667function findHostInstanceWithNoPortals(fiber) { 34668 var hostFiber = findCurrentHostFiberWithNoPortals(fiber); 34669 34670 if (hostFiber === null) { 34671 return null; 34672 } 34673 34674 return hostFiber.stateNode; 34675} 34676 34677var shouldErrorImpl = function (fiber) { 34678 return null; 34679}; 34680 34681function shouldError(fiber) { 34682 return shouldErrorImpl(fiber); 34683} 34684 34685var shouldSuspendImpl = function (fiber) { 34686 return false; 34687}; 34688 34689function shouldSuspend(fiber) { 34690 return shouldSuspendImpl(fiber); 34691} 34692var overrideHookState = null; 34693var overrideHookStateDeletePath = null; 34694var overrideHookStateRenamePath = null; 34695var overrideProps = null; 34696var overridePropsDeletePath = null; 34697var overridePropsRenamePath = null; 34698var scheduleUpdate = null; 34699var setErrorHandler = null; 34700var setSuspenseHandler = null; 34701 34702{ 34703 var copyWithDeleteImpl = function (obj, path, index) { 34704 var key = path[index]; 34705 var updated = isArray(obj) ? obj.slice() : assign({}, obj); 34706 34707 if (index + 1 === path.length) { 34708 if (isArray(updated)) { 34709 updated.splice(key, 1); 34710 } else { 34711 delete updated[key]; 34712 } 34713 34714 return updated; 34715 } // $FlowFixMe number or string is fine here 34716 34717 34718 updated[key] = copyWithDeleteImpl(obj[key], path, index + 1); 34719 return updated; 34720 }; 34721 34722 var copyWithDelete = function (obj, path) { 34723 return copyWithDeleteImpl(obj, path, 0); 34724 }; 34725 34726 var copyWithRenameImpl = function (obj, oldPath, newPath, index) { 34727 var oldKey = oldPath[index]; 34728 var updated = isArray(obj) ? obj.slice() : assign({}, obj); 34729 34730 if (index + 1 === oldPath.length) { 34731 var newKey = newPath[index]; // $FlowFixMe number or string is fine here 34732 34733 updated[newKey] = updated[oldKey]; 34734 34735 if (isArray(updated)) { 34736 updated.splice(oldKey, 1); 34737 } else { 34738 delete updated[oldKey]; 34739 } 34740 } else { 34741 // $FlowFixMe number or string is fine here 34742 updated[oldKey] = copyWithRenameImpl( // $FlowFixMe number or string is fine here 34743 obj[oldKey], oldPath, newPath, index + 1); 34744 } 34745 34746 return updated; 34747 }; 34748 34749 var copyWithRename = function (obj, oldPath, newPath) { 34750 if (oldPath.length !== newPath.length) { 34751 warn('copyWithRename() expects paths of the same length'); 34752 34753 return; 34754 } else { 34755 for (var i = 0; i < newPath.length - 1; i++) { 34756 if (oldPath[i] !== newPath[i]) { 34757 warn('copyWithRename() expects paths to be the same except for the deepest key'); 34758 34759 return; 34760 } 34761 } 34762 } 34763 34764 return copyWithRenameImpl(obj, oldPath, newPath, 0); 34765 }; 34766 34767 var copyWithSetImpl = function (obj, path, index, value) { 34768 if (index >= path.length) { 34769 return value; 34770 } 34771 34772 var key = path[index]; 34773 var updated = isArray(obj) ? obj.slice() : assign({}, obj); // $FlowFixMe number or string is fine here 34774 34775 updated[key] = copyWithSetImpl(obj[key], path, index + 1, value); 34776 return updated; 34777 }; 34778 34779 var copyWithSet = function (obj, path, value) { 34780 return copyWithSetImpl(obj, path, 0, value); 34781 }; 34782 34783 var findHook = function (fiber, id) { 34784 // For now, the "id" of stateful hooks is just the stateful hook index. 34785 // This may change in the future with e.g. nested hooks. 34786 var currentHook = fiber.memoizedState; 34787 34788 while (currentHook !== null && id > 0) { 34789 currentHook = currentHook.next; 34790 id--; 34791 } 34792 34793 return currentHook; 34794 }; // Support DevTools editable values for useState and useReducer. 34795 34796 34797 overrideHookState = function (fiber, id, path, value) { 34798 var hook = findHook(fiber, id); 34799 34800 if (hook !== null) { 34801 var newState = copyWithSet(hook.memoizedState, path, value); 34802 hook.memoizedState = newState; 34803 hook.baseState = newState; // We aren't actually adding an update to the queue, 34804 // because there is no update we can add for useReducer hooks that won't trigger an error. 34805 // (There's no appropriate action type for DevTools overrides.) 34806 // As a result though, React will see the scheduled update as a noop and bailout. 34807 // Shallow cloning props works as a workaround for now to bypass the bailout check. 34808 34809 fiber.memoizedProps = assign({}, fiber.memoizedProps); 34810 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34811 34812 if (root !== null) { 34813 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34814 } 34815 } 34816 }; 34817 34818 overrideHookStateDeletePath = function (fiber, id, path) { 34819 var hook = findHook(fiber, id); 34820 34821 if (hook !== null) { 34822 var newState = copyWithDelete(hook.memoizedState, path); 34823 hook.memoizedState = newState; 34824 hook.baseState = newState; // We aren't actually adding an update to the queue, 34825 // because there is no update we can add for useReducer hooks that won't trigger an error. 34826 // (There's no appropriate action type for DevTools overrides.) 34827 // As a result though, React will see the scheduled update as a noop and bailout. 34828 // Shallow cloning props works as a workaround for now to bypass the bailout check. 34829 34830 fiber.memoizedProps = assign({}, fiber.memoizedProps); 34831 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34832 34833 if (root !== null) { 34834 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34835 } 34836 } 34837 }; 34838 34839 overrideHookStateRenamePath = function (fiber, id, oldPath, newPath) { 34840 var hook = findHook(fiber, id); 34841 34842 if (hook !== null) { 34843 var newState = copyWithRename(hook.memoizedState, oldPath, newPath); 34844 hook.memoizedState = newState; 34845 hook.baseState = newState; // We aren't actually adding an update to the queue, 34846 // because there is no update we can add for useReducer hooks that won't trigger an error. 34847 // (There's no appropriate action type for DevTools overrides.) 34848 // As a result though, React will see the scheduled update as a noop and bailout. 34849 // Shallow cloning props works as a workaround for now to bypass the bailout check. 34850 34851 fiber.memoizedProps = assign({}, fiber.memoizedProps); 34852 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34853 34854 if (root !== null) { 34855 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34856 } 34857 } 34858 }; // Support DevTools props for function components, forwardRef, memo, host components, etc. 34859 34860 34861 overrideProps = function (fiber, path, value) { 34862 fiber.pendingProps = copyWithSet(fiber.memoizedProps, path, value); 34863 34864 if (fiber.alternate) { 34865 fiber.alternate.pendingProps = fiber.pendingProps; 34866 } 34867 34868 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34869 34870 if (root !== null) { 34871 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34872 } 34873 }; 34874 34875 overridePropsDeletePath = function (fiber, path) { 34876 fiber.pendingProps = copyWithDelete(fiber.memoizedProps, path); 34877 34878 if (fiber.alternate) { 34879 fiber.alternate.pendingProps = fiber.pendingProps; 34880 } 34881 34882 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34883 34884 if (root !== null) { 34885 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34886 } 34887 }; 34888 34889 overridePropsRenamePath = function (fiber, oldPath, newPath) { 34890 fiber.pendingProps = copyWithRename(fiber.memoizedProps, oldPath, newPath); 34891 34892 if (fiber.alternate) { 34893 fiber.alternate.pendingProps = fiber.pendingProps; 34894 } 34895 34896 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34897 34898 if (root !== null) { 34899 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34900 } 34901 }; 34902 34903 scheduleUpdate = function (fiber) { 34904 var root = enqueueConcurrentRenderForLane(fiber, SyncLane); 34905 34906 if (root !== null) { 34907 scheduleUpdateOnFiber(root, fiber, SyncLane, NoTimestamp); 34908 } 34909 }; 34910 34911 setErrorHandler = function (newShouldErrorImpl) { 34912 shouldErrorImpl = newShouldErrorImpl; 34913 }; 34914 34915 setSuspenseHandler = function (newShouldSuspendImpl) { 34916 shouldSuspendImpl = newShouldSuspendImpl; 34917 }; 34918} 34919 34920function findHostInstanceByFiber(fiber) { 34921 var hostFiber = findCurrentHostFiber(fiber); 34922 34923 if (hostFiber === null) { 34924 return null; 34925 } 34926 34927 return hostFiber.stateNode; 34928} 34929 34930function emptyFindFiberByHostInstance(instance) { 34931 return null; 34932} 34933 34934function getCurrentFiberForDevTools() { 34935 return current; 34936} 34937 34938function injectIntoDevTools(devToolsConfig) { 34939 var findFiberByHostInstance = devToolsConfig.findFiberByHostInstance; 34940 var ReactCurrentDispatcher = ReactSharedInternals.ReactCurrentDispatcher; 34941 return injectInternals({ 34942 bundleType: devToolsConfig.bundleType, 34943 version: devToolsConfig.version, 34944 rendererPackageName: devToolsConfig.rendererPackageName, 34945 rendererConfig: devToolsConfig.rendererConfig, 34946 overrideHookState: overrideHookState, 34947 overrideHookStateDeletePath: overrideHookStateDeletePath, 34948 overrideHookStateRenamePath: overrideHookStateRenamePath, 34949 overrideProps: overrideProps, 34950 overridePropsDeletePath: overridePropsDeletePath, 34951 overridePropsRenamePath: overridePropsRenamePath, 34952 setErrorHandler: setErrorHandler, 34953 setSuspenseHandler: setSuspenseHandler, 34954 scheduleUpdate: scheduleUpdate, 34955 currentDispatcherRef: ReactCurrentDispatcher, 34956 findHostInstanceByFiber: findHostInstanceByFiber, 34957 findFiberByHostInstance: findFiberByHostInstance || emptyFindFiberByHostInstance, 34958 // React Refresh 34959 findHostInstancesForRefresh: findHostInstancesForRefresh , 34960 scheduleRefresh: scheduleRefresh , 34961 scheduleRoot: scheduleRoot , 34962 setRefreshHandler: setRefreshHandler , 34963 // Enables DevTools to append owner stacks to error messages in DEV mode. 34964 getCurrentFiber: getCurrentFiberForDevTools , 34965 // Enables DevTools to detect reconciler version rather than renderer version 34966 // which may not match for third party renderers. 34967 reconcilerVersion: ReactVersion 34968 }); 34969} 34970 34971/* global reportError */ 34972 34973var defaultOnRecoverableError = typeof reportError === 'function' ? // In modern browsers, reportError will dispatch an error event, 34974// emulating an uncaught JavaScript error. 34975reportError : function (error) { 34976 // In older browsers and test environments, fallback to console.error. 34977 // eslint-disable-next-line react-internal/no-production-logging 34978 console['error'](error); 34979}; 34980 34981function ReactDOMRoot(internalRoot) { 34982 this._internalRoot = internalRoot; 34983} 34984 34985ReactDOMHydrationRoot.prototype.render = ReactDOMRoot.prototype.render = function (children) { 34986 var root = this._internalRoot; 34987 34988 if (root === null) { 34989 throw new Error('Cannot update an unmounted root.'); 34990 } 34991 34992 { 34993 if (typeof arguments[1] === 'function') { 34994 error('render(...): does not support the second callback argument. ' + 'To execute a side effect after rendering, declare it in a component body with useEffect().'); 34995 } else if (isValidContainer(arguments[1])) { 34996 error('You passed a container to the second argument of root.render(...). ' + "You don't need to pass it again since you already passed it to create the root."); 34997 } else if (typeof arguments[1] !== 'undefined') { 34998 error('You passed a second argument to root.render(...) but it only accepts ' + 'one argument.'); 34999 } 35000 35001 var container = root.containerInfo; 35002 35003 if (container.nodeType !== COMMENT_NODE) { 35004 var hostInstance = findHostInstanceWithNoPortals(root.current); 35005 35006 if (hostInstance) { 35007 if (hostInstance.parentNode !== container) { 35008 error('render(...): It looks like the React-rendered content of the ' + 'root container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + "root.unmount() to empty a root's container."); 35009 } 35010 } 35011 } 35012 } 35013 35014 updateContainer(children, root, null, null); 35015}; 35016 35017ReactDOMHydrationRoot.prototype.unmount = ReactDOMRoot.prototype.unmount = function () { 35018 { 35019 if (typeof arguments[0] === 'function') { 35020 error('unmount(...): does not support a callback argument. ' + 'To execute a side effect after rendering, declare it in a component body with useEffect().'); 35021 } 35022 } 35023 35024 var root = this._internalRoot; 35025 35026 if (root !== null) { 35027 this._internalRoot = null; 35028 var container = root.containerInfo; 35029 35030 { 35031 if (isAlreadyRendering()) { 35032 error('Attempted to synchronously unmount a root while React was already ' + 'rendering. React cannot finish unmounting the root until the ' + 'current render has completed, which may lead to a race condition.'); 35033 } 35034 } 35035 35036 flushSync(function () { 35037 updateContainer(null, root, null, null); 35038 }); 35039 unmarkContainerAsRoot(container); 35040 } 35041}; 35042 35043function createRoot(container, options) { 35044 if (!isValidContainer(container)) { 35045 throw new Error('createRoot(...): Target container is not a DOM element.'); 35046 } 35047 35048 warnIfReactDOMContainerInDEV(container); 35049 var isStrictMode = false; 35050 var concurrentUpdatesByDefaultOverride = false; 35051 var identifierPrefix = ''; 35052 var onRecoverableError = defaultOnRecoverableError; 35053 var transitionCallbacks = null; 35054 35055 if (options !== null && options !== undefined) { 35056 { 35057 if (options.hydrate) { 35058 warn('hydrate through createRoot is deprecated. Use ReactDOMClient.hydrateRoot(container, <App />) instead.'); 35059 } else { 35060 if (typeof options === 'object' && options !== null && options.$$typeof === REACT_ELEMENT_TYPE) { 35061 error('You passed a JSX element to createRoot. You probably meant to ' + 'call root.render instead. ' + 'Example usage:\n\n' + ' let root = createRoot(domContainer);\n' + ' root.render(<App />);'); 35062 } 35063 } 35064 } 35065 35066 if (options.unstable_strictMode === true) { 35067 isStrictMode = true; 35068 } 35069 35070 if (options.identifierPrefix !== undefined) { 35071 identifierPrefix = options.identifierPrefix; 35072 } 35073 35074 if (options.onRecoverableError !== undefined) { 35075 onRecoverableError = options.onRecoverableError; 35076 } 35077 35078 if (options.transitionCallbacks !== undefined) { 35079 transitionCallbacks = options.transitionCallbacks; 35080 } 35081 } 35082 35083 var root = createContainer(container, ConcurrentRoot, null, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError); 35084 markContainerAsRoot(root.current, container); 35085 var rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container; 35086 listenToAllSupportedEvents(rootContainerElement); 35087 return new ReactDOMRoot(root); 35088} 35089 35090function ReactDOMHydrationRoot(internalRoot) { 35091 this._internalRoot = internalRoot; 35092} 35093 35094function scheduleHydration(target) { 35095 if (target) { 35096 queueExplicitHydrationTarget(target); 35097 } 35098} 35099 35100ReactDOMHydrationRoot.prototype.unstable_scheduleHydration = scheduleHydration; 35101function hydrateRoot(container, initialChildren, options) { 35102 if (!isValidContainer(container)) { 35103 throw new Error('hydrateRoot(...): Target container is not a DOM element.'); 35104 } 35105 35106 warnIfReactDOMContainerInDEV(container); 35107 35108 { 35109 if (initialChildren === undefined) { 35110 error('Must provide initial children as second argument to hydrateRoot. ' + 'Example usage: hydrateRoot(domContainer, <App />)'); 35111 } 35112 } // For now we reuse the whole bag of options since they contain 35113 // the hydration callbacks. 35114 35115 35116 var hydrationCallbacks = options != null ? options : null; // TODO: Delete this option 35117 35118 var mutableSources = options != null && options.hydratedSources || null; 35119 var isStrictMode = false; 35120 var concurrentUpdatesByDefaultOverride = false; 35121 var identifierPrefix = ''; 35122 var onRecoverableError = defaultOnRecoverableError; 35123 35124 if (options !== null && options !== undefined) { 35125 if (options.unstable_strictMode === true) { 35126 isStrictMode = true; 35127 } 35128 35129 if (options.identifierPrefix !== undefined) { 35130 identifierPrefix = options.identifierPrefix; 35131 } 35132 35133 if (options.onRecoverableError !== undefined) { 35134 onRecoverableError = options.onRecoverableError; 35135 } 35136 } 35137 35138 var root = createHydrationContainer(initialChildren, null, container, ConcurrentRoot, hydrationCallbacks, isStrictMode, concurrentUpdatesByDefaultOverride, identifierPrefix, onRecoverableError); 35139 markContainerAsRoot(root.current, container); // This can't be a comment node since hydration doesn't work on comment nodes anyway. 35140 35141 listenToAllSupportedEvents(container); 35142 35143 if (mutableSources) { 35144 for (var i = 0; i < mutableSources.length; i++) { 35145 var mutableSource = mutableSources[i]; 35146 registerMutableSourceForHydration(root, mutableSource); 35147 } 35148 } 35149 35150 return new ReactDOMHydrationRoot(root); 35151} 35152function isValidContainer(node) { 35153 return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || !disableCommentsAsDOMContainers )); 35154} // TODO: Remove this function which also includes comment nodes. 35155// We only use it in places that are currently more relaxed. 35156 35157function isValidContainerLegacy(node) { 35158 return !!(node && (node.nodeType === ELEMENT_NODE || node.nodeType === DOCUMENT_NODE || node.nodeType === DOCUMENT_FRAGMENT_NODE || node.nodeType === COMMENT_NODE && node.nodeValue === ' react-mount-point-unstable ')); 35159} 35160 35161function warnIfReactDOMContainerInDEV(container) { 35162 { 35163 if (container.nodeType === ELEMENT_NODE && container.tagName && container.tagName.toUpperCase() === 'BODY') { 35164 error('createRoot(): Creating roots directly with document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try using a container element created ' + 'for your app.'); 35165 } 35166 35167 if (isContainerMarkedAsRoot(container)) { 35168 if (container._reactRootContainer) { 35169 error('You are calling ReactDOMClient.createRoot() on a container that was previously ' + 'passed to ReactDOM.render(). This is not supported.'); 35170 } else { 35171 error('You are calling ReactDOMClient.createRoot() on a container that ' + 'has already been passed to createRoot() before. Instead, call ' + 'root.render() on the existing root instead if you want to update it.'); 35172 } 35173 } 35174 } 35175} 35176 35177var ReactCurrentOwner$3 = ReactSharedInternals.ReactCurrentOwner; 35178var topLevelUpdateWarnings; 35179 35180{ 35181 topLevelUpdateWarnings = function (container) { 35182 if (container._reactRootContainer && container.nodeType !== COMMENT_NODE) { 35183 var hostInstance = findHostInstanceWithNoPortals(container._reactRootContainer.current); 35184 35185 if (hostInstance) { 35186 if (hostInstance.parentNode !== container) { 35187 error('render(...): It looks like the React-rendered content of this ' + 'container was removed without using React. This is not ' + 'supported and will cause errors. Instead, call ' + 'ReactDOM.unmountComponentAtNode to empty a container.'); 35188 } 35189 } 35190 } 35191 35192 var isRootRenderedBySomeReact = !!container._reactRootContainer; 35193 var rootEl = getReactRootElementInContainer(container); 35194 var hasNonRootReactChild = !!(rootEl && getInstanceFromNode(rootEl)); 35195 35196 if (hasNonRootReactChild && !isRootRenderedBySomeReact) { 35197 error('render(...): Replacing React-rendered children with a new root ' + 'component. If you intended to update the children of this node, ' + 'you should instead have the existing children update their state ' + 'and render the new components instead of calling ReactDOM.render.'); 35198 } 35199 35200 if (container.nodeType === ELEMENT_NODE && container.tagName && container.tagName.toUpperCase() === 'BODY') { 35201 error('render(): Rendering components directly into document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try rendering into a container element created ' + 'for your app.'); 35202 } 35203 }; 35204} 35205 35206function getReactRootElementInContainer(container) { 35207 if (!container) { 35208 return null; 35209 } 35210 35211 if (container.nodeType === DOCUMENT_NODE) { 35212 return container.documentElement; 35213 } else { 35214 return container.firstChild; 35215 } 35216} 35217 35218function noopOnRecoverableError() {// This isn't reachable because onRecoverableError isn't called in the 35219 // legacy API. 35220} 35221 35222function legacyCreateRootFromDOMContainer(container, initialChildren, parentComponent, callback, isHydrationContainer) { 35223 if (isHydrationContainer) { 35224 if (typeof callback === 'function') { 35225 var originalCallback = callback; 35226 35227 callback = function () { 35228 var instance = getPublicRootInstance(root); 35229 originalCallback.call(instance); 35230 }; 35231 } 35232 35233 var root = createHydrationContainer(initialChildren, callback, container, LegacyRoot, null, // hydrationCallbacks 35234 false, // isStrictMode 35235 false, // concurrentUpdatesByDefaultOverride, 35236 '', // identifierPrefix 35237 noopOnRecoverableError); 35238 container._reactRootContainer = root; 35239 markContainerAsRoot(root.current, container); 35240 var rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container; 35241 listenToAllSupportedEvents(rootContainerElement); 35242 flushSync(); 35243 return root; 35244 } else { 35245 // First clear any existing content. 35246 var rootSibling; 35247 35248 while (rootSibling = container.lastChild) { 35249 container.removeChild(rootSibling); 35250 } 35251 35252 if (typeof callback === 'function') { 35253 var _originalCallback = callback; 35254 35255 callback = function () { 35256 var instance = getPublicRootInstance(_root); 35257 35258 _originalCallback.call(instance); 35259 }; 35260 } 35261 35262 var _root = createContainer(container, LegacyRoot, null, // hydrationCallbacks 35263 false, // isStrictMode 35264 false, // concurrentUpdatesByDefaultOverride, 35265 '', // identifierPrefix 35266 noopOnRecoverableError); 35267 35268 container._reactRootContainer = _root; 35269 markContainerAsRoot(_root.current, container); 35270 35271 var _rootContainerElement = container.nodeType === COMMENT_NODE ? container.parentNode : container; 35272 35273 listenToAllSupportedEvents(_rootContainerElement); // Initial mount should not be batched. 35274 35275 flushSync(function () { 35276 updateContainer(initialChildren, _root, parentComponent, callback); 35277 }); 35278 return _root; 35279 } 35280} 35281 35282function warnOnInvalidCallback$1(callback, callerName) { 35283 { 35284 if (callback !== null && typeof callback !== 'function') { 35285 error('%s(...): Expected the last optional `callback` argument to be a ' + 'function. Instead received: %s.', callerName, callback); 35286 } 35287 } 35288} 35289 35290function legacyRenderSubtreeIntoContainer(parentComponent, children, container, forceHydrate, callback) { 35291 { 35292 topLevelUpdateWarnings(container); 35293 warnOnInvalidCallback$1(callback === undefined ? null : callback, 'render'); 35294 } 35295 35296 var maybeRoot = container._reactRootContainer; 35297 var root; 35298 35299 if (!maybeRoot) { 35300 // Initial mount 35301 root = legacyCreateRootFromDOMContainer(container, children, parentComponent, callback, forceHydrate); 35302 } else { 35303 root = maybeRoot; 35304 35305 if (typeof callback === 'function') { 35306 var originalCallback = callback; 35307 35308 callback = function () { 35309 var instance = getPublicRootInstance(root); 35310 originalCallback.call(instance); 35311 }; 35312 } // Update 35313 35314 35315 updateContainer(children, root, parentComponent, callback); 35316 } 35317 35318 return getPublicRootInstance(root); 35319} 35320 35321function findDOMNode(componentOrElement) { 35322 { 35323 var owner = ReactCurrentOwner$3.current; 35324 35325 if (owner !== null && owner.stateNode !== null) { 35326 var warnedAboutRefsInRender = owner.stateNode._warnedAboutRefsInRender; 35327 35328 if (!warnedAboutRefsInRender) { 35329 error('%s is accessing findDOMNode inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', getComponentNameFromType(owner.type) || 'A component'); 35330 } 35331 35332 owner.stateNode._warnedAboutRefsInRender = true; 35333 } 35334 } 35335 35336 if (componentOrElement == null) { 35337 return null; 35338 } 35339 35340 if (componentOrElement.nodeType === ELEMENT_NODE) { 35341 return componentOrElement; 35342 } 35343 35344 { 35345 return findHostInstanceWithWarning(componentOrElement, 'findDOMNode'); 35346 } 35347} 35348function hydrate(element, container, callback) { 35349 { 35350 error('ReactDOM.hydrate is no longer supported in React 18. Use hydrateRoot ' + 'instead. Until you switch to the new API, your app will behave as ' + "if it's running React 17. Learn " + 'more: https://reactjs.org/link/switch-to-createroot'); 35351 } 35352 35353 if (!isValidContainerLegacy(container)) { 35354 throw new Error('Target container is not a DOM element.'); 35355 } 35356 35357 { 35358 var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined; 35359 35360 if (isModernRoot) { 35361 error('You are calling ReactDOM.hydrate() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. ' + 'Did you mean to call hydrateRoot(container, element)?'); 35362 } 35363 } // TODO: throw or warn if we couldn't hydrate? 35364 35365 35366 return legacyRenderSubtreeIntoContainer(null, element, container, true, callback); 35367} 35368function render(element, container, callback) { 35369 { 35370 error('ReactDOM.render is no longer supported in React 18. Use createRoot ' + 'instead. Until you switch to the new API, your app will behave as ' + "if it's running React 17. Learn " + 'more: https://reactjs.org/link/switch-to-createroot'); 35371 } 35372 35373 if (!isValidContainerLegacy(container)) { 35374 throw new Error('Target container is not a DOM element.'); 35375 } 35376 35377 { 35378 var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined; 35379 35380 if (isModernRoot) { 35381 error('You are calling ReactDOM.render() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. ' + 'Did you mean to call root.render(element)?'); 35382 } 35383 } 35384 35385 return legacyRenderSubtreeIntoContainer(null, element, container, false, callback); 35386} 35387function unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) { 35388 { 35389 error('ReactDOM.unstable_renderSubtreeIntoContainer() is no longer supported ' + 'in React 18. Consider using a portal instead. Until you switch to ' + "the createRoot API, your app will behave as if it's running React " + '17. Learn more: https://reactjs.org/link/switch-to-createroot'); 35390 } 35391 35392 if (!isValidContainerLegacy(containerNode)) { 35393 throw new Error('Target container is not a DOM element.'); 35394 } 35395 35396 if (parentComponent == null || !has(parentComponent)) { 35397 throw new Error('parentComponent must be a valid React Component'); 35398 } 35399 35400 return legacyRenderSubtreeIntoContainer(parentComponent, element, containerNode, false, callback); 35401} 35402function unmountComponentAtNode(container) { 35403 if (!isValidContainerLegacy(container)) { 35404 throw new Error('unmountComponentAtNode(...): Target container is not a DOM element.'); 35405 } 35406 35407 { 35408 var isModernRoot = isContainerMarkedAsRoot(container) && container._reactRootContainer === undefined; 35409 35410 if (isModernRoot) { 35411 error('You are calling ReactDOM.unmountComponentAtNode() on a container that was previously ' + 'passed to ReactDOMClient.createRoot(). This is not supported. Did you mean to call root.unmount()?'); 35412 } 35413 } 35414 35415 if (container._reactRootContainer) { 35416 { 35417 var rootEl = getReactRootElementInContainer(container); 35418 var renderedByDifferentReact = rootEl && !getInstanceFromNode(rootEl); 35419 35420 if (renderedByDifferentReact) { 35421 error("unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by another copy of React.'); 35422 } 35423 } // Unmount should not be batched. 35424 35425 35426 flushSync(function () { 35427 legacyRenderSubtreeIntoContainer(null, null, container, false, function () { 35428 // $FlowFixMe This should probably use `delete container._reactRootContainer` 35429 container._reactRootContainer = null; 35430 unmarkContainerAsRoot(container); 35431 }); 35432 }); // If you call unmountComponentAtNode twice in quick succession, you'll 35433 // get `true` twice. That's probably fine? 35434 35435 return true; 35436 } else { 35437 { 35438 var _rootEl = getReactRootElementInContainer(container); 35439 35440 var hasNonRootReactChild = !!(_rootEl && getInstanceFromNode(_rootEl)); // Check if the container itself is a React root node. 35441 35442 var isContainerReactRoot = container.nodeType === ELEMENT_NODE && isValidContainerLegacy(container.parentNode) && !!container.parentNode._reactRootContainer; 35443 35444 if (hasNonRootReactChild) { 35445 error("unmountComponentAtNode(): The node you're attempting to unmount " + 'was rendered by React and is not a top-level container. %s', isContainerReactRoot ? 'You may have accidentally passed in a React root node instead ' + 'of its container.' : 'Instead, have the parent component update its state and ' + 'rerender in order to remove this component.'); 35446 } 35447 } 35448 35449 return false; 35450 } 35451} 35452 35453setAttemptSynchronousHydration(attemptSynchronousHydration$1); 35454setAttemptContinuousHydration(attemptContinuousHydration$1); 35455setAttemptHydrationAtCurrentPriority(attemptHydrationAtCurrentPriority$1); 35456setGetCurrentUpdatePriority(getCurrentUpdatePriority); 35457setAttemptHydrationAtPriority(runWithPriority); 35458 35459{ 35460 if (typeof Map !== 'function' || // $FlowIssue Flow incorrectly thinks Map has no prototype 35461 Map.prototype == null || typeof Map.prototype.forEach !== 'function' || typeof Set !== 'function' || // $FlowIssue Flow incorrectly thinks Set has no prototype 35462 Set.prototype == null || typeof Set.prototype.clear !== 'function' || typeof Set.prototype.forEach !== 'function') { 35463 error('React depends on Map and Set built-in types. Make sure that you load a ' + 'polyfill in older browsers. https://reactjs.org/link/react-polyfills'); 35464 } 35465} 35466 35467setRestoreImplementation(restoreControlledState$3); 35468setBatchingImplementation(batchedUpdates$1, discreteUpdates, flushSync); 35469 35470function createPortal$1(children, container) { 35471 var key = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null; 35472 35473 if (!isValidContainer(container)) { 35474 throw new Error('Target container is not a DOM element.'); 35475 } // TODO: pass ReactDOM portal implementation as third argument 35476 // $FlowFixMe The Flow type is opaque but there's no way to actually create it. 35477 35478 35479 return createPortal(children, container, null, key); 35480} 35481 35482function renderSubtreeIntoContainer(parentComponent, element, containerNode, callback) { 35483 return unstable_renderSubtreeIntoContainer(parentComponent, element, containerNode, callback); 35484} 35485 35486var Internals = { 35487 usingClientEntryPoint: false, 35488 // Keep in sync with ReactTestUtils.js. 35489 // This is an array for better minification. 35490 Events: [getInstanceFromNode, getNodeFromInstance, getFiberCurrentPropsFromNode, enqueueStateRestore, restoreStateIfNeeded, batchedUpdates$1] 35491}; 35492 35493function createRoot$1(container, options) { 35494 { 35495 if (!Internals.usingClientEntryPoint && !false) { 35496 error('You are importing createRoot from "react-dom" which is not supported. ' + 'You should instead import it from "react-dom/client".'); 35497 } 35498 } 35499 35500 return createRoot(container, options); 35501} 35502 35503function hydrateRoot$1(container, initialChildren, options) { 35504 { 35505 if (!Internals.usingClientEntryPoint && !false) { 35506 error('You are importing hydrateRoot from "react-dom" which is not supported. ' + 'You should instead import it from "react-dom/client".'); 35507 } 35508 } 35509 35510 return hydrateRoot(container, initialChildren, options); 35511} // Overload the definition to the two valid signatures. 35512// Warning, this opts-out of checking the function body. 35513 35514 35515// eslint-disable-next-line no-redeclare 35516function flushSync$1(fn) { 35517 { 35518 if (isAlreadyRendering()) { 35519 error('flushSync was called from inside a lifecycle method. React cannot ' + 'flush when React is already rendering. Consider moving this call to ' + 'a scheduler task or micro task.'); 35520 } 35521 } 35522 35523 return flushSync(fn); 35524} 35525var foundDevTools = injectIntoDevTools({ 35526 findFiberByHostInstance: getClosestInstanceFromNode, 35527 bundleType: 1 , 35528 version: ReactVersion, 35529 rendererPackageName: 'react-dom' 35530}); 35531 35532{ 35533 if (!foundDevTools && canUseDOM && window.top === window.self) { 35534 // If we're in Chrome or Firefox, provide a download link if not installed. 35535 if (navigator.userAgent.indexOf('Chrome') > -1 && navigator.userAgent.indexOf('Edge') === -1 || navigator.userAgent.indexOf('Firefox') > -1) { 35536 var protocol = window.location.protocol; // Don't warn in exotic cases like chrome-extension://. 35537 35538 if (/^(https?|file):$/.test(protocol)) { 35539 // eslint-disable-next-line react-internal/no-production-logging 35540 console.info('%cDownload the React DevTools ' + 'for a better development experience: ' + 'https://reactjs.org/link/react-devtools' + (protocol === 'file:' ? '\nYou might need to use a local HTTP server (instead of file://): ' + 'https://reactjs.org/link/react-devtools-faq' : ''), 'font-weight:bold'); 35541 } 35542 } 35543 } 35544} 35545 35546exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; 35547exports.createPortal = createPortal$1; 35548exports.createRoot = createRoot$1; 35549exports.findDOMNode = findDOMNode; 35550exports.flushSync = flushSync$1; 35551exports.hydrate = hydrate; 35552exports.hydrateRoot = hydrateRoot$1; 35553exports.render = render; 35554exports.unmountComponentAtNode = unmountComponentAtNode; 35555exports.unstable_batchedUpdates = batchedUpdates$1; 35556exports.unstable_renderSubtreeIntoContainer = renderSubtreeIntoContainer; 35557exports.version = ReactVersion; 35558 /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 35559if ( 35560 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && 35561 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop === 35562 'function' 35563) { 35564 __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error()); 35565} 35566 35567 })(); 35568} 35569 35570 35571/***/ }), 35572
vendor: 833 bytes, lines 35573-35605
35573/***/ "./node_modules/react-dom/client.js": 35574/*!******************************************!*\ 35575 !*** ./node_modules/react-dom/client.js ***! 35576 \******************************************/ 35577/***/ ((__unused_webpack_module, exports, __webpack_require__) => { 35578 35579"use strict"; 35580 35581 35582var m = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js"); 35583if (false) {} else { 35584 var i = m.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; 35585 exports.createRoot = function(c, o) { 35586 i.usingClientEntryPoint = true; 35587 try { 35588 return m.createRoot(c, o); 35589 } finally { 35590 i.usingClientEntryPoint = false; 35591 } 35592 }; 35593 exports.hydrateRoot = function(c, h, o) { 35594 i.usingClientEntryPoint = true; 35595 try { 35596 return m.hydrateRoot(c, h, o); 35597 } finally { 35598 i.usingClientEntryPoint = false; 35599 } 35600 }; 35601} 35602 35603 35604/***/ }), 35605
vendor: 1,428 bytes, lines 35606-35649
35606/***/ "./node_modules/react-dom/index.js": 35607/*!*****************************************!*\ 35608 !*** ./node_modules/react-dom/index.js ***! 35609 \*****************************************/ 35610/***/ ((module, __unused_webpack_exports, __webpack_require__) => { 35611 35612"use strict"; 35613 35614 35615function checkDCE() { 35616 /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 35617 if ( 35618 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ === 'undefined' || 35619 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE !== 'function' 35620 ) { 35621 return; 35622 } 35623 if (true) { 35624 // This branch is unreachable because this function is only called 35625 // in production, but the condition is true only in development. 35626 // Therefore if the branch is still here, dead code elimination wasn't 35627 // properly applied. 35628 // Don't change the message. React DevTools relies on it. Also make sure 35629 // this message doesn't occur elsewhere in this function, or it will cause 35630 // a false positive. 35631 throw new Error('^_^'); 35632 } 35633 try { 35634 // Verify that the code above has been dead code eliminated (DCE'd). 35635 __REACT_DEVTOOLS_GLOBAL_HOOK__.checkDCE(checkDCE); 35636 } catch (err) { 35637 // DevTools shouldn't crash React, no matter what. 35638 // We should still report in case we break this code. 35639 console.error(err); 35640 } 35641} 35642 35643if (false) {} else { 35644 module.exports = __webpack_require__(/*! ./cjs/react-dom.development.js */ "./node_modules/react-dom/cjs/react-dom.development.js"); 35645} 35646 35647 35648/***/ }), 35649
vendor: 68,326 bytes, lines 35650-37185
35650/***/ "./node_modules/react-router-dom/dist/index.js": 35651/*!*****************************************************!*\ 35652 !*** ./node_modules/react-router-dom/dist/index.js ***! 35653 \*****************************************************/ 35654/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 35655 35656"use strict"; 35657var react_dom__WEBPACK_IMPORTED_MODULE_1___namespace_cache; 35658__webpack_require__.r(__webpack_exports__); 35659/* harmony export */ __webpack_require__.d(__webpack_exports__, { 35660/* harmony export */ AbortedDeferredError: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.AbortedDeferredError), 35661/* harmony export */ Await: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.Await), 35662/* harmony export */ BrowserRouter: () => (/* binding */ BrowserRouter), 35663/* harmony export */ Form: () => (/* binding */ Form), 35664/* harmony export */ HashRouter: () => (/* binding */ HashRouter), 35665/* harmony export */ Link: () => (/* binding */ Link), 35666/* harmony export */ MemoryRouter: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.MemoryRouter), 35667/* harmony export */ NavLink: () => (/* binding */ NavLink), 35668/* harmony export */ Navigate: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.Navigate), 35669/* harmony export */ NavigationType: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.Action), 35670/* harmony export */ Outlet: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.Outlet), 35671/* harmony export */ Route: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.Route), 35672/* harmony export */ Router: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.Router), 35673/* harmony export */ RouterProvider: () => (/* binding */ RouterProvider), 35674/* harmony export */ Routes: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.Routes), 35675/* harmony export */ ScrollRestoration: () => (/* binding */ ScrollRestoration), 35676/* harmony export */ UNSAFE_DataRouterContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterContext), 35677/* harmony export */ UNSAFE_DataRouterStateContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterStateContext), 35678/* harmony export */ UNSAFE_FetchersContext: () => (/* binding */ FetchersContext), 35679/* harmony export */ UNSAFE_LocationContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_LocationContext), 35680/* harmony export */ UNSAFE_NavigationContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_NavigationContext), 35681/* harmony export */ UNSAFE_RouteContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_RouteContext), 35682/* harmony export */ UNSAFE_ViewTransitionContext: () => (/* binding */ ViewTransitionContext), 35683/* harmony export */ UNSAFE_useRouteId: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_useRouteId), 35684/* harmony export */ UNSAFE_useScrollRestoration: () => (/* binding */ useScrollRestoration), 35685/* harmony export */ createBrowserRouter: () => (/* binding */ createBrowserRouter), 35686/* harmony export */ createHashRouter: () => (/* binding */ createHashRouter), 35687/* harmony export */ createMemoryRouter: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.createMemoryRouter), 35688/* harmony export */ createPath: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.createPath), 35689/* harmony export */ createRoutesFromChildren: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.createRoutesFromChildren), 35690/* harmony export */ createRoutesFromElements: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.createRoutesFromElements), 35691/* harmony export */ createSearchParams: () => (/* binding */ createSearchParams), 35692/* harmony export */ defer: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.defer), 35693/* harmony export */ generatePath: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.generatePath), 35694/* harmony export */ isRouteErrorResponse: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.isRouteErrorResponse), 35695/* harmony export */ json: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.json), 35696/* harmony export */ matchPath: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.matchPath), 35697/* harmony export */ matchRoutes: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.matchRoutes), 35698/* harmony export */ parsePath: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.parsePath), 35699/* harmony export */ redirect: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.redirect), 35700/* harmony export */ redirectDocument: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.redirectDocument), 35701/* harmony export */ renderMatches: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.renderMatches), 35702/* harmony export */ resolvePath: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_2__.resolvePath), 35703/* harmony export */ unstable_HistoryRouter: () => (/* binding */ HistoryRouter), 35704/* harmony export */ unstable_usePrompt: () => (/* binding */ usePrompt), 35705/* harmony export */ unstable_useViewTransitionState: () => (/* binding */ useViewTransitionState), 35706/* harmony export */ useActionData: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useActionData), 35707/* harmony export */ useAsyncError: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useAsyncError), 35708/* harmony export */ useAsyncValue: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useAsyncValue), 35709/* harmony export */ useBeforeUnload: () => (/* binding */ useBeforeUnload), 35710/* harmony export */ useBlocker: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useBlocker), 35711/* harmony export */ useFetcher: () => (/* binding */ useFetcher), 35712/* harmony export */ useFetchers: () => (/* binding */ useFetchers), 35713/* harmony export */ useFormAction: () => (/* binding */ useFormAction), 35714/* harmony export */ useHref: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useHref), 35715/* harmony export */ useInRouterContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useInRouterContext), 35716/* harmony export */ useLinkClickHandler: () => (/* binding */ useLinkClickHandler), 35717/* harmony export */ useLoaderData: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useLoaderData), 35718/* harmony export */ useLocation: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useLocation), 35719/* harmony export */ useMatch: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useMatch), 35720/* harmony export */ useMatches: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useMatches), 35721/* harmony export */ useNavigate: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useNavigate), 35722/* harmony export */ useNavigation: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useNavigation), 35723/* harmony export */ useNavigationType: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useNavigationType), 35724/* harmony export */ useOutlet: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useOutlet), 35725/* harmony export */ useOutletContext: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useOutletContext), 35726/* harmony export */ useParams: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useParams), 35727/* harmony export */ useResolvedPath: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useResolvedPath), 35728/* harmony export */ useRevalidator: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useRevalidator), 35729/* harmony export */ useRouteError: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useRouteError), 35730/* harmony export */ useRouteLoaderData: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useRouteLoaderData), 35731/* harmony export */ useRoutes: () => (/* reexport safe */ react_router__WEBPACK_IMPORTED_MODULE_3__.useRoutes), 35732/* harmony export */ useSearchParams: () => (/* binding */ useSearchParams), 35733/* harmony export */ useSubmit: () => (/* binding */ useSubmit) 35734/* harmony export */ }); 35735/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 35736/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 35737/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js"); 35738/* harmony import */ var react_router__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-router */ "./node_modules/react-router/dist/index.js"); 35739/* harmony import */ var react_router__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @remix-run/router */ "./node_modules/@remix-run/router/dist/router.js"); 35740/** 35741 * React Router DOM v6.22.1 35742 * 35743 * Copyright (c) Remix Software Inc. 35744 * 35745 * This source code is licensed under the MIT license found in the 35746 * LICENSE.md file in the root directory of this source tree. 35747 * 35748 * @license MIT 35749 */ 35750 35751 35752 35753 35754 35755 35756function _extends() { 35757 _extends = Object.assign ? Object.assign.bind() : function (target) { 35758 for (var i = 1; i < arguments.length; i++) { 35759 var source = arguments[i]; 35760 for (var key in source) { 35761 if (Object.prototype.hasOwnProperty.call(source, key)) { 35762 target[key] = source[key]; 35763 } 35764 } 35765 } 35766 return target; 35767 }; 35768 return _extends.apply(this, arguments); 35769} 35770function _objectWithoutPropertiesLoose(source, excluded) { 35771 if (source == null) return {}; 35772 var target = {}; 35773 var sourceKeys = Object.keys(source); 35774 var key, i; 35775 for (i = 0; i < sourceKeys.length; i++) { 35776 key = sourceKeys[i]; 35777 if (excluded.indexOf(key) >= 0) continue; 35778 target[key] = source[key]; 35779 } 35780 return target; 35781} 35782 35783const defaultMethod = "get"; 35784const defaultEncType = "application/x-www-form-urlencoded"; 35785function isHtmlElement(object) { 35786 return object != null && typeof object.tagName === "string"; 35787} 35788function isButtonElement(object) { 35789 return isHtmlElement(object) && object.tagName.toLowerCase() === "button"; 35790} 35791function isFormElement(object) { 35792 return isHtmlElement(object) && object.tagName.toLowerCase() === "form"; 35793} 35794function isInputElement(object) { 35795 return isHtmlElement(object) && object.tagName.toLowerCase() === "input"; 35796} 35797function isModifiedEvent(event) { 35798 return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey); 35799} 35800function shouldProcessLinkClick(event, target) { 35801 return event.button === 0 && ( 35802 // Ignore everything but left clicks 35803 !target || target === "_self") && 35804 // Let browser handle "target=_blank" etc. 35805 !isModifiedEvent(event) // Ignore clicks with modifier keys 35806 ; 35807} 35808/** 35809 * Creates a URLSearchParams object using the given initializer. 35810 * 35811 * This is identical to `new URLSearchParams(init)` except it also 35812 * supports arrays as values in the object form of the initializer 35813 * instead of just strings. This is convenient when you need multiple 35814 * values for a given key, but don't want to use an array initializer. 35815 * 35816 * For example, instead of: 35817 * 35818 * let searchParams = new URLSearchParams([ 35819 * ['sort', 'name'], 35820 * ['sort', 'price'] 35821 * ]); 35822 * 35823 * you can do: 35824 * 35825 * let searchParams = createSearchParams({ 35826 * sort: ['name', 'price'] 35827 * }); 35828 */ 35829function createSearchParams(init) { 35830 if (init === void 0) { 35831 init = ""; 35832 } 35833 return new URLSearchParams(typeof init === "string" || Array.isArray(init) || init instanceof URLSearchParams ? init : Object.keys(init).reduce((memo, key) => { 35834 let value = init[key]; 35835 return memo.concat(Array.isArray(value) ? value.map(v => [key, v]) : [[key, value]]); 35836 }, [])); 35837} 35838function getSearchParamsForLocation(locationSearch, defaultSearchParams) { 35839 let searchParams = createSearchParams(locationSearch); 35840 if (defaultSearchParams) { 35841 // Use `defaultSearchParams.forEach(...)` here instead of iterating of 35842 // `defaultSearchParams.keys()` to work-around a bug in Firefox related to 35843 // web extensions. Relevant Bugzilla tickets: 35844 // https://bugzilla.mozilla.org/show_bug.cgi?id=1414602 35845 // https://bugzilla.mozilla.org/show_bug.cgi?id=1023984 35846 defaultSearchParams.forEach((_, key) => { 35847 if (!searchParams.has(key)) { 35848 defaultSearchParams.getAll(key).forEach(value => { 35849 searchParams.append(key, value); 35850 }); 35851 } 35852 }); 35853 } 35854 return searchParams; 35855} 35856// One-time check for submitter support 35857let _formDataSupportsSubmitter = null; 35858function isFormDataSubmitterSupported() { 35859 if (_formDataSupportsSubmitter === null) { 35860 try { 35861 new FormData(document.createElement("form"), 35862 // @ts-expect-error if FormData supports the submitter parameter, this will throw 35863 0); 35864 _formDataSupportsSubmitter = false; 35865 } catch (e) { 35866 _formDataSupportsSubmitter = true; 35867 } 35868 } 35869 return _formDataSupportsSubmitter; 35870} 35871const supportedFormEncTypes = new Set(["application/x-www-form-urlencoded", "multipart/form-data", "text/plain"]); 35872function getFormEncType(encType) { 35873 if (encType != null && !supportedFormEncTypes.has(encType)) { 35874 true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_warning)(false, "\"" + encType + "\" is not a valid `encType` for `<Form>`/`<fetcher.Form>` " + ("and will default to \"" + defaultEncType + "\"")) : 0; 35875 return null; 35876 } 35877 return encType; 35878} 35879function getFormSubmissionInfo(target, basename) { 35880 let method; 35881 let action; 35882 let encType; 35883 let formData; 35884 let body; 35885 if (isFormElement(target)) { 35886 // When grabbing the action from the element, it will have had the basename 35887 // prefixed to ensure non-JS scenarios work, so strip it since we'll 35888 // re-prefix in the router 35889 let attr = target.getAttribute("action"); 35890 action = attr ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(attr, basename) : null; 35891 method = target.getAttribute("method") || defaultMethod; 35892 encType = getFormEncType(target.getAttribute("enctype")) || defaultEncType; 35893 formData = new FormData(target); 35894 } else if (isButtonElement(target) || isInputElement(target) && (target.type === "submit" || target.type === "image")) { 35895 let form = target.form; 35896 if (form == null) { 35897 throw new Error("Cannot submit a <button> or <input type=\"submit\"> without a <form>"); 35898 } 35899 // <button>/<input type="submit"> may override attributes of <form> 35900 // When grabbing the action from the element, it will have had the basename 35901 // prefixed to ensure non-JS scenarios work, so strip it since we'll 35902 // re-prefix in the router 35903 let attr = target.getAttribute("formaction") || form.getAttribute("action"); 35904 action = attr ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(attr, basename) : null; 35905 method = target.getAttribute("formmethod") || form.getAttribute("method") || defaultMethod; 35906 encType = getFormEncType(target.getAttribute("formenctype")) || getFormEncType(form.getAttribute("enctype")) || defaultEncType; 35907 // Build a FormData object populated from a form and submitter 35908 formData = new FormData(form, target); 35909 // If this browser doesn't support the `FormData(el, submitter)` format, 35910 // then tack on the submitter value at the end. This is a lightweight 35911 // solution that is not 100% spec compliant. For complete support in older 35912 // browsers, consider using the `formdata-submitter-polyfill` package 35913 if (!isFormDataSubmitterSupported()) { 35914 let { 35915 name, 35916 type, 35917 value 35918 } = target; 35919 if (type === "image") { 35920 let prefix = name ? name + "." : ""; 35921 formData.append(prefix + "x", "0"); 35922 formData.append(prefix + "y", "0"); 35923 } else if (name) { 35924 formData.append(name, value); 35925 } 35926 } 35927 } else if (isHtmlElement(target)) { 35928 throw new Error("Cannot submit element that is not <form>, <button>, or " + "<input type=\"submit|image\">"); 35929 } else { 35930 method = defaultMethod; 35931 action = null; 35932 encType = defaultEncType; 35933 body = target; 35934 } 35935 // Send body for <Form encType="text/plain" so we encode it into text 35936 if (formData && encType === "text/plain") { 35937 body = formData; 35938 formData = undefined; 35939 } 35940 return { 35941 action, 35942 method: method.toLowerCase(), 35943 encType, 35944 formData, 35945 body 35946 }; 35947} 35948 35949const _excluded = ["onClick", "relative", "reloadDocument", "replace", "state", "target", "to", "preventScrollReset", "unstable_viewTransition"], 35950 _excluded2 = ["aria-current", "caseSensitive", "className", "end", "style", "to", "unstable_viewTransition", "children"], 35951 _excluded3 = ["fetcherKey", "navigate", "reloadDocument", "replace", "state", "method", "action", "onSubmit", "relative", "preventScrollReset", "unstable_viewTransition"]; 35952// HEY YOU! DON'T TOUCH THIS VARIABLE! 35953// 35954// It is replaced with the proper version at build time via a babel plugin in 35955// the rollup config. 35956// 35957// Export a global property onto the window for React Router detection by the 35958// Core Web Vitals Technology Report. This way they can configure the `wappalyzer` 35959// to detect and properly classify live websites as being built with React Router: 35960// https://github.com/HTTPArchive/wappalyzer/blob/main/src/technologies/r.json 35961const REACT_ROUTER_VERSION = "6"; 35962try { 35963 window.__reactRouterVersion = REACT_ROUTER_VERSION; 35964} catch (e) { 35965 // no-op 35966} 35967function createBrowserRouter(routes, opts) { 35968 return (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createRouter)({ 35969 basename: opts == null ? void 0 : opts.basename, 35970 future: _extends({}, opts == null ? void 0 : opts.future, { 35971 v7_prependBasename: true 35972 }), 35973 history: (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createBrowserHistory)({ 35974 window: opts == null ? void 0 : opts.window 35975 }), 35976 hydrationData: (opts == null ? void 0 : opts.hydrationData) || parseHydrationData(), 35977 routes, 35978 mapRouteProperties: react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_mapRouteProperties, 35979 window: opts == null ? void 0 : opts.window 35980 }).initialize(); 35981} 35982function createHashRouter(routes, opts) { 35983 return (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createRouter)({ 35984 basename: opts == null ? void 0 : opts.basename, 35985 future: _extends({}, opts == null ? void 0 : opts.future, { 35986 v7_prependBasename: true 35987 }), 35988 history: (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createHashHistory)({ 35989 window: opts == null ? void 0 : opts.window 35990 }), 35991 hydrationData: (opts == null ? void 0 : opts.hydrationData) || parseHydrationData(), 35992 routes, 35993 mapRouteProperties: react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_mapRouteProperties, 35994 window: opts == null ? void 0 : opts.window 35995 }).initialize(); 35996} 35997function parseHydrationData() { 35998 var _window; 35999 let state = (_window = window) == null ? void 0 : _window.__staticRouterHydrationData; 36000 if (state && state.errors) { 36001 state = _extends({}, state, { 36002 errors: deserializeErrors(state.errors) 36003 }); 36004 } 36005 return state; 36006} 36007function deserializeErrors(errors) { 36008 if (!errors) return null; 36009 let entries = Object.entries(errors); 36010 let serialized = {}; 36011 for (let [key, val] of entries) { 36012 // Hey you! If you change this, please change the corresponding logic in 36013 // serializeErrors in react-router-dom/server.tsx :) 36014 if (val && val.__type === "RouteErrorResponse") { 36015 serialized[key] = new react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_ErrorResponseImpl(val.status, val.statusText, val.data, val.internal === true); 36016 } else if (val && val.__type === "Error") { 36017 // Attempt to reconstruct the right type of Error (i.e., ReferenceError) 36018 if (val.__subType) { 36019 let ErrorConstructor = window[val.__subType]; 36020 if (typeof ErrorConstructor === "function") { 36021 try { 36022 // @ts-expect-error 36023 let error = new ErrorConstructor(val.message); 36024 // Wipe away the client-side stack trace. Nothing to fill it in with 36025 // because we don't serialize SSR stack traces for security reasons 36026 error.stack = ""; 36027 serialized[key] = error; 36028 } catch (e) { 36029 // no-op - fall through and create a normal Error 36030 } 36031 } 36032 } 36033 if (serialized[key] == null) { 36034 let error = new Error(val.message); 36035 // Wipe away the client-side stack trace. Nothing to fill it in with 36036 // because we don't serialize SSR stack traces for security reasons 36037 error.stack = ""; 36038 serialized[key] = error; 36039 } 36040 } else { 36041 serialized[key] = val; 36042 } 36043 } 36044 return serialized; 36045} 36046const ViewTransitionContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext({ 36047 isTransitioning: false 36048}); 36049if (true) { 36050 ViewTransitionContext.displayName = "ViewTransition"; 36051} 36052const FetchersContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(new Map()); 36053if (true) { 36054 FetchersContext.displayName = "Fetchers"; 36055} 36056//#endregion 36057//////////////////////////////////////////////////////////////////////////////// 36058//#region Components 36059//////////////////////////////////////////////////////////////////////////////// 36060/** 36061 Webpack + React 17 fails to compile on any of the following because webpack 36062 complains that `startTransition` doesn't exist in `React`: 36063 * import { startTransition } from "react" 36064 * import * as React from from "react"; 36065 "startTransition" in React ? React.startTransition(() => setState()) : setState() 36066 * import * as React from from "react"; 36067 "startTransition" in React ? React["startTransition"](() => setState()) : setState() 36068 36069 Moving it to a constant such as the following solves the Webpack/React 17 issue: 36070 * import * as React from from "react"; 36071 const START_TRANSITION = "startTransition"; 36072 START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState() 36073 36074 However, that introduces webpack/terser minification issues in production builds 36075 in React 18 where minification/obfuscation ends up removing the call of 36076 React.startTransition entirely from the first half of the ternary. Grabbing 36077 this exported reference once up front resolves that issue. 36078 36079 See https://github.com/remix-run/react-router/issues/10579 36080*/ 36081const START_TRANSITION = "startTransition"; 36082const startTransitionImpl = react__WEBPACK_IMPORTED_MODULE_0__[START_TRANSITION]; 36083const FLUSH_SYNC = "flushSync"; 36084const flushSyncImpl = /*#__PURE__*/ (react_dom__WEBPACK_IMPORTED_MODULE_1___namespace_cache || (react_dom__WEBPACK_IMPORTED_MODULE_1___namespace_cache = __webpack_require__.t(react_dom__WEBPACK_IMPORTED_MODULE_1__, 2)))[FLUSH_SYNC]; 36085const USE_ID = "useId"; 36086const useIdImpl = react__WEBPACK_IMPORTED_MODULE_0__[USE_ID]; 36087function startTransitionSafe(cb) { 36088 if (startTransitionImpl) { 36089 startTransitionImpl(cb); 36090 } else { 36091 cb(); 36092 } 36093} 36094function flushSyncSafe(cb) { 36095 if (flushSyncImpl) { 36096 flushSyncImpl(cb); 36097 } else { 36098 cb(); 36099 } 36100} 36101class Deferred { 36102 constructor() { 36103 this.status = "pending"; 36104 this.promise = new Promise((resolve, reject) => { 36105 this.resolve = value => { 36106 if (this.status === "pending") { 36107 this.status = "resolved"; 36108 resolve(value); 36109 } 36110 }; 36111 this.reject = reason => { 36112 if (this.status === "pending") { 36113 this.status = "rejected"; 36114 reject(reason); 36115 } 36116 }; 36117 }); 36118 } 36119} 36120/** 36121 * Given a Remix Router instance, render the appropriate UI 36122 */ 36123function RouterProvider(_ref) { 36124 let { 36125 fallbackElement, 36126 router, 36127 future 36128 } = _ref; 36129 let [state, setStateImpl] = react__WEBPACK_IMPORTED_MODULE_0__.useState(router.state); 36130 let [pendingState, setPendingState] = react__WEBPACK_IMPORTED_MODULE_0__.useState(); 36131 let [vtContext, setVtContext] = react__WEBPACK_IMPORTED_MODULE_0__.useState({ 36132 isTransitioning: false 36133 }); 36134 let [renderDfd, setRenderDfd] = react__WEBPACK_IMPORTED_MODULE_0__.useState(); 36135 let [transition, setTransition] = react__WEBPACK_IMPORTED_MODULE_0__.useState(); 36136 let [interruption, setInterruption] = react__WEBPACK_IMPORTED_MODULE_0__.useState(); 36137 let fetcherData = react__WEBPACK_IMPORTED_MODULE_0__.useRef(new Map()); 36138 let { 36139 v7_startTransition 36140 } = future || {}; 36141 let optInStartTransition = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(cb => { 36142 if (v7_startTransition) { 36143 startTransitionSafe(cb); 36144 } else { 36145 cb(); 36146 } 36147 }, [v7_startTransition]); 36148 let setState = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((newState, _ref2) => { 36149 let { 36150 deletedFetchers, 36151 unstable_flushSync: flushSync, 36152 unstable_viewTransitionOpts: viewTransitionOpts 36153 } = _ref2; 36154 deletedFetchers.forEach(key => fetcherData.current.delete(key)); 36155 newState.fetchers.forEach((fetcher, key) => { 36156 if (fetcher.data !== undefined) { 36157 fetcherData.current.set(key, fetcher.data); 36158 } 36159 }); 36160 let isViewTransitionUnavailable = router.window == null || typeof router.window.document.startViewTransition !== "function"; 36161 // If this isn't a view transition or it's not available in this browser, 36162 // just update and be done with it 36163 if (!viewTransitionOpts || isViewTransitionUnavailable) { 36164 if (flushSync) { 36165 flushSyncSafe(() => setStateImpl(newState)); 36166 } else { 36167 optInStartTransition(() => setStateImpl(newState)); 36168 } 36169 return; 36170 } 36171 // flushSync + startViewTransition 36172 if (flushSync) { 36173 // Flush through the context to mark DOM elements as transition=ing 36174 flushSyncSafe(() => { 36175 // Cancel any pending transitions 36176 if (transition) { 36177 renderDfd && renderDfd.resolve(); 36178 transition.skipTransition(); 36179 } 36180 setVtContext({ 36181 isTransitioning: true, 36182 flushSync: true, 36183 currentLocation: viewTransitionOpts.currentLocation, 36184 nextLocation: viewTransitionOpts.nextLocation 36185 }); 36186 }); 36187 // Update the DOM 36188 let t = router.window.document.startViewTransition(() => { 36189 flushSyncSafe(() => setStateImpl(newState)); 36190 }); 36191 // Clean up after the animation completes 36192 t.finished.finally(() => { 36193 flushSyncSafe(() => { 36194 setRenderDfd(undefined); 36195 setTransition(undefined); 36196 setPendingState(undefined); 36197 setVtContext({ 36198 isTransitioning: false 36199 }); 36200 }); 36201 }); 36202 flushSyncSafe(() => setTransition(t)); 36203 return; 36204 } 36205 // startTransition + startViewTransition 36206 if (transition) { 36207 // Interrupting an in-progress transition, cancel and let everything flush 36208 // out, and then kick off a new transition from the interruption state 36209 renderDfd && renderDfd.resolve(); 36210 transition.skipTransition(); 36211 setInterruption({ 36212 state: newState, 36213 currentLocation: viewTransitionOpts.currentLocation, 36214 nextLocation: viewTransitionOpts.nextLocation 36215 }); 36216 } else { 36217 // Completed navigation update with opted-in view transitions, let 'er rip 36218 setPendingState(newState); 36219 setVtContext({ 36220 isTransitioning: true, 36221 flushSync: false, 36222 currentLocation: viewTransitionOpts.currentLocation, 36223 nextLocation: viewTransitionOpts.nextLocation 36224 }); 36225 } 36226 }, [router.window, transition, renderDfd, fetcherData, optInStartTransition]); 36227 // Need to use a layout effect here so we are subscribed early enough to 36228 // pick up on any render-driven redirects/navigations (useEffect/<Navigate>) 36229 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => router.subscribe(setState), [router, setState]); 36230 // When we start a view transition, create a Deferred we can use for the 36231 // eventual "completed" render 36232 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36233 if (vtContext.isTransitioning && !vtContext.flushSync) { 36234 setRenderDfd(new Deferred()); 36235 } 36236 }, [vtContext]); 36237 // Once the deferred is created, kick off startViewTransition() to update the 36238 // DOM and then wait on the Deferred to resolve (indicating the DOM update has 36239 // happened) 36240 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36241 if (renderDfd && pendingState && router.window) { 36242 let newState = pendingState; 36243 let renderPromise = renderDfd.promise; 36244 let transition = router.window.document.startViewTransition(async () => { 36245 optInStartTransition(() => setStateImpl(newState)); 36246 await renderPromise; 36247 }); 36248 transition.finished.finally(() => { 36249 setRenderDfd(undefined); 36250 setTransition(undefined); 36251 setPendingState(undefined); 36252 setVtContext({ 36253 isTransitioning: false 36254 }); 36255 }); 36256 setTransition(transition); 36257 } 36258 }, [optInStartTransition, pendingState, renderDfd, router.window]); 36259 // When the new location finally renders and is committed to the DOM, this 36260 // effect will run to resolve the transition 36261 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36262 if (renderDfd && pendingState && state.location.key === pendingState.location.key) { 36263 renderDfd.resolve(); 36264 } 36265 }, [renderDfd, transition, state.location, pendingState]); 36266 // If we get interrupted with a new navigation during a transition, we skip 36267 // the active transition, let it cleanup, then kick it off again here 36268 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36269 if (!vtContext.isTransitioning && interruption) { 36270 setPendingState(interruption.state); 36271 setVtContext({ 36272 isTransitioning: true, 36273 flushSync: false, 36274 currentLocation: interruption.currentLocation, 36275 nextLocation: interruption.nextLocation 36276 }); 36277 setInterruption(undefined); 36278 } 36279 }, [vtContext.isTransitioning, interruption]); 36280 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36281 true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_warning)(fallbackElement == null || !router.future.v7_partialHydration, "`<RouterProvider fallbackElement>` is deprecated when using " + "`v7_partialHydration`, use a `HydrateFallback` component instead") : 0; 36282 // Only log this once on initial mount 36283 // eslint-disable-next-line react-hooks/exhaustive-deps 36284 }, []); 36285 let navigator = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => { 36286 return { 36287 createHref: router.createHref, 36288 encodeLocation: router.encodeLocation, 36289 go: n => router.navigate(n), 36290 push: (to, state, opts) => router.navigate(to, { 36291 state, 36292 preventScrollReset: opts == null ? void 0 : opts.preventScrollReset 36293 }), 36294 replace: (to, state, opts) => router.navigate(to, { 36295 replace: true, 36296 state, 36297 preventScrollReset: opts == null ? void 0 : opts.preventScrollReset 36298 }) 36299 }; 36300 }, [router]); 36301 let basename = router.basename || "/"; 36302 let dataRouterContext = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => ({ 36303 router, 36304 navigator, 36305 static: false, 36306 basename 36307 }), [router, navigator, basename]); 36308 // The fragment and {null} here are important! We need them to keep React 18's 36309 // useId happy when we are server-rendering since we may have a <script> here 36310 // containing the hydrated server-side staticContext (from StaticRouterProvider). 36311 // useId relies on the component tree structure to generate deterministic id's 36312 // so we need to ensure it remains the same on the client even though 36313 // we don't need the <script> tag 36314 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterContext.Provider, { 36315 value: dataRouterContext 36316 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterStateContext.Provider, { 36317 value: state 36318 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(FetchersContext.Provider, { 36319 value: fetcherData.current 36320 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(ViewTransitionContext.Provider, { 36321 value: vtContext 36322 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_3__.Router, { 36323 basename: basename, 36324 location: state.location, 36325 navigationType: state.historyAction, 36326 navigator: navigator, 36327 future: { 36328 v7_relativeSplatPath: router.future.v7_relativeSplatPath 36329 } 36330 }, state.initialized || router.future.v7_partialHydration ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(DataRoutes, { 36331 routes: router.routes, 36332 future: router.future, 36333 state: state 36334 }) : fallbackElement))))), null); 36335} 36336function DataRoutes(_ref3) { 36337 let { 36338 routes, 36339 future, 36340 state 36341 } = _ref3; 36342 return (0,react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_useRoutesImpl)(routes, undefined, state, future); 36343} 36344/** 36345 * A `<Router>` for use in web browsers. Provides the cleanest URLs. 36346 */ 36347function BrowserRouter(_ref4) { 36348 let { 36349 basename, 36350 children, 36351 future, 36352 window 36353 } = _ref4; 36354 let historyRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(); 36355 if (historyRef.current == null) { 36356 historyRef.current = (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createBrowserHistory)({ 36357 window, 36358 v5Compat: true 36359 }); 36360 } 36361 let history = historyRef.current; 36362 let [state, setStateImpl] = react__WEBPACK_IMPORTED_MODULE_0__.useState({ 36363 action: history.action, 36364 location: history.location 36365 }); 36366 let { 36367 v7_startTransition 36368 } = future || {}; 36369 let setState = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(newState => { 36370 v7_startTransition && startTransitionImpl ? startTransitionImpl(() => setStateImpl(newState)) : setStateImpl(newState); 36371 }, [setStateImpl, v7_startTransition]); 36372 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => history.listen(setState), [history, setState]); 36373 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_3__.Router, { 36374 basename: basename, 36375 children: children, 36376 location: state.location, 36377 navigationType: state.action, 36378 navigator: history, 36379 future: future 36380 }); 36381} 36382/** 36383 * A `<Router>` for use in web browsers. Stores the location in the hash 36384 * portion of the URL so it is not sent to the server. 36385 */ 36386function HashRouter(_ref5) { 36387 let { 36388 basename, 36389 children, 36390 future, 36391 window 36392 } = _ref5; 36393 let historyRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(); 36394 if (historyRef.current == null) { 36395 historyRef.current = (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createHashHistory)({ 36396 window, 36397 v5Compat: true 36398 }); 36399 } 36400 let history = historyRef.current; 36401 let [state, setStateImpl] = react__WEBPACK_IMPORTED_MODULE_0__.useState({ 36402 action: history.action, 36403 location: history.location 36404 }); 36405 let { 36406 v7_startTransition 36407 } = future || {}; 36408 let setState = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(newState => { 36409 v7_startTransition && startTransitionImpl ? startTransitionImpl(() => setStateImpl(newState)) : setStateImpl(newState); 36410 }, [setStateImpl, v7_startTransition]); 36411 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => history.listen(setState), [history, setState]); 36412 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_3__.Router, { 36413 basename: basename, 36414 children: children, 36415 location: state.location, 36416 navigationType: state.action, 36417 navigator: history, 36418 future: future 36419 }); 36420} 36421/** 36422 * A `<Router>` that accepts a pre-instantiated history object. It's important 36423 * to note that using your own history object is highly discouraged and may add 36424 * two versions of the history library to your bundles unless you use the same 36425 * version of the history library that React Router uses internally. 36426 */ 36427function HistoryRouter(_ref6) { 36428 let { 36429 basename, 36430 children, 36431 future, 36432 history 36433 } = _ref6; 36434 let [state, setStateImpl] = react__WEBPACK_IMPORTED_MODULE_0__.useState({ 36435 action: history.action, 36436 location: history.location 36437 }); 36438 let { 36439 v7_startTransition 36440 } = future || {}; 36441 let setState = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(newState => { 36442 v7_startTransition && startTransitionImpl ? startTransitionImpl(() => setStateImpl(newState)) : setStateImpl(newState); 36443 }, [setStateImpl, v7_startTransition]); 36444 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => history.listen(setState), [history, setState]); 36445 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react_router__WEBPACK_IMPORTED_MODULE_3__.Router, { 36446 basename: basename, 36447 children: children, 36448 location: state.location, 36449 navigationType: state.action, 36450 navigator: history, 36451 future: future 36452 }); 36453} 36454if (true) { 36455 HistoryRouter.displayName = "unstable_HistoryRouter"; 36456} 36457const isBrowser = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined"; 36458const ABSOLUTE_URL_REGEX = /^(?:[a-z][a-z0-9+.-]*:|\/\/)/i; 36459/** 36460 * The public API for rendering a history-aware `<a>`. 36461 */ 36462const Link = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.forwardRef(function LinkWithRef(_ref7, ref) { 36463 let { 36464 onClick, 36465 relative, 36466 reloadDocument, 36467 replace, 36468 state, 36469 target, 36470 to, 36471 preventScrollReset, 36472 unstable_viewTransition 36473 } = _ref7, 36474 rest = _objectWithoutPropertiesLoose(_ref7, _excluded); 36475 let { 36476 basename 36477 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_NavigationContext); 36478 // Rendered into <a href> for absolute URLs 36479 let absoluteHref; 36480 let isExternal = false; 36481 if (typeof to === "string" && ABSOLUTE_URL_REGEX.test(to)) { 36482 // Render the absolute href server- and client-side 36483 absoluteHref = to; 36484 // Only check for external origins client-side 36485 if (isBrowser) { 36486 try { 36487 let currentUrl = new URL(window.location.href); 36488 let targetUrl = to.startsWith("//") ? new URL(currentUrl.protocol + to) : new URL(to); 36489 let path = (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(targetUrl.pathname, basename); 36490 if (targetUrl.origin === currentUrl.origin && path != null) { 36491 // Strip the protocol/origin/basename for same-origin absolute URLs 36492 to = path + targetUrl.search + targetUrl.hash; 36493 } else { 36494 isExternal = true; 36495 } 36496 } catch (e) { 36497 // We can't do external URL detection without a valid URL 36498 true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_warning)(false, "<Link to=\"" + to + "\"> contains an invalid URL which will probably break " + "when clicked - please update to a valid URL path.") : 0; 36499 } 36500 } 36501 } 36502 // Rendered into <a href> for relative URLs 36503 let href = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useHref)(to, { 36504 relative 36505 }); 36506 let internalOnClick = useLinkClickHandler(to, { 36507 replace, 36508 state, 36509 target, 36510 preventScrollReset, 36511 relative, 36512 unstable_viewTransition 36513 }); 36514 function handleClick(event) { 36515 if (onClick) onClick(event); 36516 if (!event.defaultPrevented) { 36517 internalOnClick(event); 36518 } 36519 } 36520 return ( 36521 /*#__PURE__*/ 36522 // eslint-disable-next-line jsx-a11y/anchor-has-content 36523 react__WEBPACK_IMPORTED_MODULE_0__.createElement("a", _extends({}, rest, { 36524 href: absoluteHref || href, 36525 onClick: isExternal || reloadDocument ? onClick : handleClick, 36526 ref: ref, 36527 target: target 36528 })) 36529 ); 36530}); 36531if (true) { 36532 Link.displayName = "Link"; 36533} 36534/** 36535 * A `<Link>` wrapper that knows if it's "active" or not. 36536 */ 36537const NavLink = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.forwardRef(function NavLinkWithRef(_ref8, ref) { 36538 let { 36539 "aria-current": ariaCurrentProp = "page", 36540 caseSensitive = false, 36541 className: classNameProp = "", 36542 end = false, 36543 style: styleProp, 36544 to, 36545 unstable_viewTransition, 36546 children 36547 } = _ref8, 36548 rest = _objectWithoutPropertiesLoose(_ref8, _excluded2); 36549 let path = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useResolvedPath)(to, { 36550 relative: rest.relative 36551 }); 36552 let location = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useLocation)(); 36553 let routerState = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterStateContext); 36554 let { 36555 navigator, 36556 basename 36557 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_NavigationContext); 36558 let isTransitioning = routerState != null && 36559 // Conditional usage is OK here because the usage of a data router is static 36560 // eslint-disable-next-line react-hooks/rules-of-hooks 36561 useViewTransitionState(path) && unstable_viewTransition === true; 36562 let toPathname = navigator.encodeLocation ? navigator.encodeLocation(path).pathname : path.pathname; 36563 let locationPathname = location.pathname; 36564 let nextLocationPathname = routerState && routerState.navigation && routerState.navigation.location ? routerState.navigation.location.pathname : null; 36565 if (!caseSensitive) { 36566 locationPathname = locationPathname.toLowerCase(); 36567 nextLocationPathname = nextLocationPathname ? nextLocationPathname.toLowerCase() : null; 36568 toPathname = toPathname.toLowerCase(); 36569 } 36570 if (nextLocationPathname && basename) { 36571 nextLocationPathname = (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(nextLocationPathname, basename) || nextLocationPathname; 36572 } 36573 // If the `to` has a trailing slash, look at that exact spot. Otherwise, 36574 // we're looking for a slash _after_ what's in `to`. For example: 36575 // 36576 // <NavLink to="/users"> and <NavLink to="/users/"> 36577 // both want to look for a / at index 6 to match URL `/users/matt` 36578 const endSlashPosition = toPathname !== "/" && toPathname.endsWith("/") ? toPathname.length - 1 : toPathname.length; 36579 let isActive = locationPathname === toPathname || !end && locationPathname.startsWith(toPathname) && locationPathname.charAt(endSlashPosition) === "/"; 36580 let isPending = nextLocationPathname != null && (nextLocationPathname === toPathname || !end && nextLocationPathname.startsWith(toPathname) && nextLocationPathname.charAt(toPathname.length) === "/"); 36581 let renderProps = { 36582 isActive, 36583 isPending, 36584 isTransitioning 36585 }; 36586 let ariaCurrent = isActive ? ariaCurrentProp : undefined; 36587 let className; 36588 if (typeof classNameProp === "function") { 36589 className = classNameProp(renderProps); 36590 } else { 36591 // If the className prop is not a function, we use a default `active` 36592 // class for <NavLink />s that are active. In v5 `active` was the default 36593 // value for `activeClassName`, but we are removing that API and can still 36594 // use the old default behavior for a cleaner upgrade path and keep the 36595 // simple styling rules working as they currently do. 36596 className = [classNameProp, isActive ? "active" : null, isPending ? "pending" : null, isTransitioning ? "transitioning" : null].filter(Boolean).join(" "); 36597 } 36598 let style = typeof styleProp === "function" ? styleProp(renderProps) : styleProp; 36599 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(Link, _extends({}, rest, { 36600 "aria-current": ariaCurrent, 36601 className: className, 36602 ref: ref, 36603 style: style, 36604 to: to, 36605 unstable_viewTransition: unstable_viewTransition 36606 }), typeof children === "function" ? children(renderProps) : children); 36607}); 36608if (true) { 36609 NavLink.displayName = "NavLink"; 36610} 36611/** 36612 * A `@remix-run/router`-aware `<form>`. It behaves like a normal form except 36613 * that the interaction with the server is with `fetch` instead of new document 36614 * requests, allowing components to add nicer UX to the page as the form is 36615 * submitted and returns with data. 36616 */ 36617const Form = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.forwardRef((_ref9, forwardedRef) => { 36618 let { 36619 fetcherKey, 36620 navigate, 36621 reloadDocument, 36622 replace, 36623 state, 36624 method = defaultMethod, 36625 action, 36626 onSubmit, 36627 relative, 36628 preventScrollReset, 36629 unstable_viewTransition 36630 } = _ref9, 36631 props = _objectWithoutPropertiesLoose(_ref9, _excluded3); 36632 let submit = useSubmit(); 36633 let formAction = useFormAction(action, { 36634 relative 36635 }); 36636 let formMethod = method.toLowerCase() === "get" ? "get" : "post"; 36637 let submitHandler = event => { 36638 onSubmit && onSubmit(event); 36639 if (event.defaultPrevented) return; 36640 event.preventDefault(); 36641 let submitter = event.nativeEvent.submitter; 36642 let submitMethod = (submitter == null ? void 0 : submitter.getAttribute("formmethod")) || method; 36643 submit(submitter || event.currentTarget, { 36644 fetcherKey, 36645 method: submitMethod, 36646 navigate, 36647 replace, 36648 state, 36649 relative, 36650 preventScrollReset, 36651 unstable_viewTransition 36652 }); 36653 }; 36654 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("form", _extends({ 36655 ref: forwardedRef, 36656 method: formMethod, 36657 action: formAction, 36658 onSubmit: reloadDocument ? onSubmit : submitHandler 36659 }, props)); 36660}); 36661if (true) { 36662 Form.displayName = "Form"; 36663} 36664/** 36665 * This component will emulate the browser's scroll restoration on location 36666 * changes. 36667 */ 36668function ScrollRestoration(_ref10) { 36669 let { 36670 getKey, 36671 storageKey 36672 } = _ref10; 36673 useScrollRestoration({ 36674 getKey, 36675 storageKey 36676 }); 36677 return null; 36678} 36679if (true) { 36680 ScrollRestoration.displayName = "ScrollRestoration"; 36681} 36682//#endregion 36683//////////////////////////////////////////////////////////////////////////////// 36684//#region Hooks 36685//////////////////////////////////////////////////////////////////////////////// 36686var DataRouterHook; 36687(function (DataRouterHook) { 36688 DataRouterHook["UseScrollRestoration"] = "useScrollRestoration"; 36689 DataRouterHook["UseSubmit"] = "useSubmit"; 36690 DataRouterHook["UseSubmitFetcher"] = "useSubmitFetcher"; 36691 DataRouterHook["UseFetcher"] = "useFetcher"; 36692 DataRouterHook["useViewTransitionState"] = "useViewTransitionState"; 36693})(DataRouterHook || (DataRouterHook = {})); 36694var DataRouterStateHook; 36695(function (DataRouterStateHook) { 36696 DataRouterStateHook["UseFetcher"] = "useFetcher"; 36697 DataRouterStateHook["UseFetchers"] = "useFetchers"; 36698 DataRouterStateHook["UseScrollRestoration"] = "useScrollRestoration"; 36699})(DataRouterStateHook || (DataRouterStateHook = {})); 36700// Internal hooks 36701function getDataRouterConsoleError(hookName) { 36702 return hookName + " must be used within a data router. See https://reactrouter.com/routers/picking-a-router."; 36703} 36704function useDataRouterContext(hookName) { 36705 let ctx = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterContext); 36706 !ctx ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, getDataRouterConsoleError(hookName)) : 0 : void 0; 36707 return ctx; 36708} 36709function useDataRouterState(hookName) { 36710 let state = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_DataRouterStateContext); 36711 !state ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, getDataRouterConsoleError(hookName)) : 0 : void 0; 36712 return state; 36713} 36714// External hooks 36715/** 36716 * Handles the click behavior for router `<Link>` components. This is useful if 36717 * you need to create custom `<Link>` components with the same click behavior we 36718 * use in our exported `<Link>`. 36719 */ 36720function useLinkClickHandler(to, _temp) { 36721 let { 36722 target, 36723 replace: replaceProp, 36724 state, 36725 preventScrollReset, 36726 relative, 36727 unstable_viewTransition 36728 } = _temp === void 0 ? {} : _temp; 36729 let navigate = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useNavigate)(); 36730 let location = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useLocation)(); 36731 let path = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useResolvedPath)(to, { 36732 relative 36733 }); 36734 return react__WEBPACK_IMPORTED_MODULE_0__.useCallback(event => { 36735 if (shouldProcessLinkClick(event, target)) { 36736 event.preventDefault(); 36737 // If the URL hasn't changed, a regular <a> will do a replace instead of 36738 // a push, so do the same here unless the replace prop is explicitly set 36739 let replace = replaceProp !== undefined ? replaceProp : (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createPath)(location) === (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createPath)(path); 36740 navigate(to, { 36741 replace, 36742 state, 36743 preventScrollReset, 36744 relative, 36745 unstable_viewTransition 36746 }); 36747 } 36748 }, [location, navigate, path, replaceProp, state, target, to, preventScrollReset, relative, unstable_viewTransition]); 36749} 36750/** 36751 * A convenient wrapper for reading and writing search parameters via the 36752 * URLSearchParams interface. 36753 */ 36754function useSearchParams(defaultInit) { 36755 true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_warning)(typeof URLSearchParams !== "undefined", "You cannot use the `useSearchParams` hook in a browser that does not " + "support the URLSearchParams API. If you need to support Internet " + "Explorer 11, we recommend you load a polyfill such as " + "https://github.com/ungap/url-search-params\n\n" + "If you're unsure how to load polyfills, we recommend you check out " + "https://polyfill.io/v3/ which provides some recommendations about how " + "to load polyfills only for users that need them, instead of for every " + "user.") : 0; 36756 let defaultSearchParamsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(createSearchParams(defaultInit)); 36757 let hasSetSearchParamsRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false); 36758 let location = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useLocation)(); 36759 let searchParams = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => 36760 // Only merge in the defaults if we haven't yet called setSearchParams. 36761 // Once we call that we want those to take precedence, otherwise you can't 36762 // remove a param with setSearchParams({}) if it has an initial value 36763 getSearchParamsForLocation(location.search, hasSetSearchParamsRef.current ? null : defaultSearchParamsRef.current), [location.search]); 36764 let navigate = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useNavigate)(); 36765 let setSearchParams = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((nextInit, navigateOptions) => { 36766 const newSearchParams = createSearchParams(typeof nextInit === "function" ? nextInit(searchParams) : nextInit); 36767 hasSetSearchParamsRef.current = true; 36768 navigate("?" + newSearchParams, navigateOptions); 36769 }, [navigate, searchParams]); 36770 return [searchParams, setSearchParams]; 36771} 36772function validateClientSideSubmission() { 36773 if (typeof document === "undefined") { 36774 throw new Error("You are calling submit during the server render. " + "Try calling submit within a `useEffect` or callback instead."); 36775 } 36776} 36777let fetcherId = 0; 36778let getUniqueFetcherId = () => "__" + String(++fetcherId) + "__"; 36779/** 36780 * Returns a function that may be used to programmatically submit a form (or 36781 * some arbitrary data) to the server. 36782 */ 36783function useSubmit() { 36784 let { 36785 router 36786 } = useDataRouterContext(DataRouterHook.UseSubmit); 36787 let { 36788 basename 36789 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_NavigationContext); 36790 let currentRouteId = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_useRouteId)(); 36791 return react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function (target, options) { 36792 if (options === void 0) { 36793 options = {}; 36794 } 36795 validateClientSideSubmission(); 36796 let { 36797 action, 36798 method, 36799 encType, 36800 formData, 36801 body 36802 } = getFormSubmissionInfo(target, basename); 36803 if (options.navigate === false) { 36804 let key = options.fetcherKey || getUniqueFetcherId(); 36805 router.fetch(key, currentRouteId, options.action || action, { 36806 preventScrollReset: options.preventScrollReset, 36807 formData, 36808 body, 36809 formMethod: options.method || method, 36810 formEncType: options.encType || encType, 36811 unstable_flushSync: options.unstable_flushSync 36812 }); 36813 } else { 36814 router.navigate(options.action || action, { 36815 preventScrollReset: options.preventScrollReset, 36816 formData, 36817 body, 36818 formMethod: options.method || method, 36819 formEncType: options.encType || encType, 36820 replace: options.replace, 36821 state: options.state, 36822 fromRouteId: currentRouteId, 36823 unstable_flushSync: options.unstable_flushSync, 36824 unstable_viewTransition: options.unstable_viewTransition 36825 }); 36826 } 36827 }, [router, basename, currentRouteId]); 36828} 36829// v7: Eventually we should deprecate this entirely in favor of using the 36830// router method directly? 36831function useFormAction(action, _temp2) { 36832 let { 36833 relative 36834 } = _temp2 === void 0 ? {} : _temp2; 36835 let { 36836 basename 36837 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_NavigationContext); 36838 let routeContext = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_RouteContext); 36839 !routeContext ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, "useFormAction must be used inside a RouteContext") : 0 : void 0; 36840 let [match] = routeContext.matches.slice(-1); 36841 // Shallow clone path so we can modify it below, otherwise we modify the 36842 // object referenced by useMemo inside useResolvedPath 36843 let path = _extends({}, (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useResolvedPath)(action ? action : ".", { 36844 relative 36845 })); 36846 // If no action was specified, browsers will persist current search params 36847 // when determining the path, so match that behavior 36848 // https://github.com/remix-run/remix/issues/927 36849 let location = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useLocation)(); 36850 if (action == null) { 36851 // Safe to write to this directly here since if action was undefined, we 36852 // would have called useResolvedPath(".") which will never include a search 36853 path.search = location.search; 36854 // When grabbing search params from the URL, remove any included ?index param 36855 // since it might not apply to our contextual route. We add it back based 36856 // on match.route.index below 36857 let params = new URLSearchParams(path.search); 36858 if (params.has("index") && params.get("index") === "") { 36859 params.delete("index"); 36860 path.search = params.toString() ? "?" + params.toString() : ""; 36861 } 36862 } 36863 if ((!action || action === ".") && match.route.index) { 36864 path.search = path.search ? path.search.replace(/^\?/, "?index&") : "?index"; 36865 } 36866 // If we're operating within a basename, prepend it to the pathname prior 36867 // to creating the form action. If this is a root navigation, then just use 36868 // the raw basename which allows the basename to have full control over the 36869 // presence of a trailing slash on root actions 36870 if (basename !== "/") { 36871 path.pathname = path.pathname === "/" ? basename : (0,react_router__WEBPACK_IMPORTED_MODULE_2__.joinPaths)([basename, path.pathname]); 36872 } 36873 return (0,react_router__WEBPACK_IMPORTED_MODULE_2__.createPath)(path); 36874} 36875// TODO: (v7) Change the useFetcher generic default from `any` to `unknown` 36876/** 36877 * Interacts with route loaders and actions without causing a navigation. Great 36878 * for any interaction that stays on the same page. 36879 */ 36880function useFetcher(_temp3) { 36881 var _route$matches; 36882 let { 36883 key 36884 } = _temp3 === void 0 ? {} : _temp3; 36885 let { 36886 router 36887 } = useDataRouterContext(DataRouterHook.UseFetcher); 36888 let state = useDataRouterState(DataRouterStateHook.UseFetcher); 36889 let fetcherData = react__WEBPACK_IMPORTED_MODULE_0__.useContext(FetchersContext); 36890 let route = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_RouteContext); 36891 let routeId = (_route$matches = route.matches[route.matches.length - 1]) == null ? void 0 : _route$matches.route.id; 36892 !fetcherData ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, "useFetcher must be used inside a FetchersContext") : 0 : void 0; 36893 !route ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, "useFetcher must be used inside a RouteContext") : 0 : void 0; 36894 !(routeId != null) ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, "useFetcher can only be used on routes that contain a unique \"id\"") : 0 : void 0; 36895 // Fetcher key handling 36896 // OK to call conditionally to feature detect `useId` 36897 // eslint-disable-next-line react-hooks/rules-of-hooks 36898 let defaultKey = useIdImpl ? useIdImpl() : ""; 36899 let [fetcherKey, setFetcherKey] = react__WEBPACK_IMPORTED_MODULE_0__.useState(key || defaultKey); 36900 if (key && key !== fetcherKey) { 36901 setFetcherKey(key); 36902 } else if (!fetcherKey) { 36903 // We will only fall through here when `useId` is not available 36904 setFetcherKey(getUniqueFetcherId()); 36905 } 36906 // Registration/cleanup 36907 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36908 router.getFetcher(fetcherKey); 36909 return () => { 36910 // Tell the router we've unmounted - if v7_fetcherPersist is enabled this 36911 // will not delete immediately but instead queue up a delete after the 36912 // fetcher returns to an `idle` state 36913 router.deleteFetcher(fetcherKey); 36914 }; 36915 }, [router, fetcherKey]); 36916 // Fetcher additions 36917 let load = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((href, opts) => { 36918 !routeId ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, "No routeId available for fetcher.load()") : 0 : void 0; 36919 router.fetch(fetcherKey, routeId, href, opts); 36920 }, [fetcherKey, routeId, router]); 36921 let submitImpl = useSubmit(); 36922 let submit = react__WEBPACK_IMPORTED_MODULE_0__.useCallback((target, opts) => { 36923 submitImpl(target, _extends({}, opts, { 36924 navigate: false, 36925 fetcherKey 36926 })); 36927 }, [fetcherKey, submitImpl]); 36928 let FetcherForm = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => { 36929 let FetcherForm = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.forwardRef((props, ref) => { 36930 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(Form, _extends({}, props, { 36931 navigate: false, 36932 fetcherKey: fetcherKey, 36933 ref: ref 36934 })); 36935 }); 36936 if (true) { 36937 FetcherForm.displayName = "fetcher.Form"; 36938 } 36939 return FetcherForm; 36940 }, [fetcherKey]); 36941 // Exposed FetcherWithComponents 36942 let fetcher = state.fetchers.get(fetcherKey) || react_router__WEBPACK_IMPORTED_MODULE_2__.IDLE_FETCHER; 36943 let data = fetcherData.get(fetcherKey); 36944 let fetcherWithComponents = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => _extends({ 36945 Form: FetcherForm, 36946 submit, 36947 load 36948 }, fetcher, { 36949 data 36950 }), [FetcherForm, submit, load, fetcher, data]); 36951 return fetcherWithComponents; 36952} 36953/** 36954 * Provides all fetchers currently on the page. Useful for layouts and parent 36955 * routes that need to provide pending/optimistic UI regarding the fetch. 36956 */ 36957function useFetchers() { 36958 let state = useDataRouterState(DataRouterStateHook.UseFetchers); 36959 return Array.from(state.fetchers.entries()).map(_ref11 => { 36960 let [key, fetcher] = _ref11; 36961 return _extends({}, fetcher, { 36962 key 36963 }); 36964 }); 36965} 36966const SCROLL_RESTORATION_STORAGE_KEY = "react-router-scroll-positions"; 36967let savedScrollPositions = {}; 36968/** 36969 * When rendered inside a RouterProvider, will restore scroll positions on navigations 36970 */ 36971function useScrollRestoration(_temp4) { 36972 let { 36973 getKey, 36974 storageKey 36975 } = _temp4 === void 0 ? {} : _temp4; 36976 let { 36977 router 36978 } = useDataRouterContext(DataRouterHook.UseScrollRestoration); 36979 let { 36980 restoreScrollPosition, 36981 preventScrollReset 36982 } = useDataRouterState(DataRouterStateHook.UseScrollRestoration); 36983 let { 36984 basename 36985 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(react_router__WEBPACK_IMPORTED_MODULE_3__.UNSAFE_NavigationContext); 36986 let location = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useLocation)(); 36987 let matches = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useMatches)(); 36988 let navigation = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useNavigation)(); 36989 // Trigger manual scroll restoration while we're active 36990 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 36991 window.history.scrollRestoration = "manual"; 36992 return () => { 36993 window.history.scrollRestoration = "auto"; 36994 }; 36995 }, []); 36996 // Save positions on pagehide 36997 usePageHide(react__WEBPACK_IMPORTED_MODULE_0__.useCallback(() => { 36998 if (navigation.state === "idle") { 36999 let key = (getKey ? getKey(location, matches) : null) || location.key; 37000 savedScrollPositions[key] = window.scrollY; 37001 } 37002 try { 37003 sessionStorage.setItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY, JSON.stringify(savedScrollPositions)); 37004 } catch (error) { 37005 true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_warning)(false, "Failed to save scroll positions in sessionStorage, <ScrollRestoration /> will not work properly (" + error + ").") : 0; 37006 } 37007 window.history.scrollRestoration = "auto"; 37008 }, [storageKey, getKey, navigation.state, location, matches])); 37009 // Read in any saved scroll locations 37010 if (typeof document !== "undefined") { 37011 // eslint-disable-next-line react-hooks/rules-of-hooks 37012 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => { 37013 try { 37014 let sessionPositions = sessionStorage.getItem(storageKey || SCROLL_RESTORATION_STORAGE_KEY); 37015 if (sessionPositions) { 37016 savedScrollPositions = JSON.parse(sessionPositions); 37017 } 37018 } catch (e) { 37019 // no-op, use default empty object 37020 } 37021 }, [storageKey]); 37022 // Enable scroll restoration in the router 37023 // eslint-disable-next-line react-hooks/rules-of-hooks 37024 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => { 37025 let getKeyWithoutBasename = getKey && basename !== "/" ? (location, matches) => getKey( // Strip the basename to match useLocation() 37026 _extends({}, location, { 37027 pathname: (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(location.pathname, basename) || location.pathname 37028 }), matches) : getKey; 37029 let disableScrollRestoration = router == null ? void 0 : router.enableScrollRestoration(savedScrollPositions, () => window.scrollY, getKeyWithoutBasename); 37030 return () => disableScrollRestoration && disableScrollRestoration(); 37031 }, [router, basename, getKey]); 37032 // Restore scrolling when state.restoreScrollPosition changes 37033 // eslint-disable-next-line react-hooks/rules-of-hooks 37034 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => { 37035 // Explicit false means don't do anything (used for submissions) 37036 if (restoreScrollPosition === false) { 37037 return; 37038 } 37039 // been here before, scroll to it 37040 if (typeof restoreScrollPosition === "number") { 37041 window.scrollTo(0, restoreScrollPosition); 37042 return; 37043 } 37044 // try to scroll to the hash 37045 if (location.hash) { 37046 let el = document.getElementById(decodeURIComponent(location.hash.slice(1))); 37047 if (el) { 37048 el.scrollIntoView(); 37049 return; 37050 } 37051 } 37052 // Don't reset if this navigation opted out 37053 if (preventScrollReset === true) { 37054 return; 37055 } 37056 // otherwise go to the top on new locations 37057 window.scrollTo(0, 0); 37058 }, [location, restoreScrollPosition, preventScrollReset]); 37059 } 37060} 37061/** 37062 * Setup a callback to be fired on the window's `beforeunload` event. This is 37063 * useful for saving some data to `window.localStorage` just before the page 37064 * refreshes. 37065 * 37066 * Note: The `callback` argument should be a function created with 37067 * `React.useCallback()`. 37068 */ 37069function useBeforeUnload(callback, options) { 37070 let { 37071 capture 37072 } = options || {}; 37073 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 37074 let opts = capture != null ? { 37075 capture 37076 } : undefined; 37077 window.addEventListener("beforeunload", callback, opts); 37078 return () => { 37079 window.removeEventListener("beforeunload", callback, opts); 37080 }; 37081 }, [callback, capture]); 37082} 37083/** 37084 * Setup a callback to be fired on the window's `pagehide` event. This is 37085 * useful for saving some data to `window.localStorage` just before the page 37086 * refreshes. This event is better supported than beforeunload across browsers. 37087 * 37088 * Note: The `callback` argument should be a function created with 37089 * `React.useCallback()`. 37090 */ 37091function usePageHide(callback, options) { 37092 let { 37093 capture 37094 } = options || {}; 37095 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 37096 let opts = capture != null ? { 37097 capture 37098 } : undefined; 37099 window.addEventListener("pagehide", callback, opts); 37100 return () => { 37101 window.removeEventListener("pagehide", callback, opts); 37102 }; 37103 }, [callback, capture]); 37104} 37105/** 37106 * Wrapper around useBlocker to show a window.confirm prompt to users instead 37107 * of building a custom UI with useBlocker. 37108 * 37109 * Warning: This has *a lot of rough edges* and behaves very differently (and 37110 * very incorrectly in some cases) across browsers if user click addition 37111 * back/forward navigations while the confirm is open. Use at your own risk. 37112 */ 37113function usePrompt(_ref12) { 37114 let { 37115 when, 37116 message 37117 } = _ref12; 37118 let blocker = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useBlocker)(when); 37119 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 37120 if (blocker.state === "blocked") { 37121 let proceed = window.confirm(message); 37122 if (proceed) { 37123 // This timeout is needed to avoid a weird "race" on POP navigations 37124 // between the `window.history` revert navigation and the result of 37125 // `window.confirm` 37126 setTimeout(blocker.proceed, 0); 37127 } else { 37128 blocker.reset(); 37129 } 37130 } 37131 }, [blocker, message]); 37132 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 37133 if (blocker.state === "blocked" && !when) { 37134 blocker.reset(); 37135 } 37136 }, [blocker, when]); 37137} 37138/** 37139 * Return a boolean indicating if there is an active view transition to the 37140 * given href. You can use this value to render CSS classes or viewTransitionName 37141 * styles onto your elements 37142 * 37143 * @param href The destination href 37144 * @param [opts.relative] Relative routing type ("route" | "path") 37145 */ 37146function useViewTransitionState(to, opts) { 37147 if (opts === void 0) { 37148 opts = {}; 37149 } 37150 let vtContext = react__WEBPACK_IMPORTED_MODULE_0__.useContext(ViewTransitionContext); 37151 !(vtContext != null) ? true ? (0,react_router__WEBPACK_IMPORTED_MODULE_2__.UNSAFE_invariant)(false, "`unstable_useViewTransitionState` must be used within `react-router-dom`'s `RouterProvider`. " + "Did you accidentally import `RouterProvider` from `react-router`?") : 0 : void 0; 37152 let { 37153 basename 37154 } = useDataRouterContext(DataRouterHook.useViewTransitionState); 37155 let path = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useResolvedPath)(to, { 37156 relative: opts.relative 37157 }); 37158 if (!vtContext.isTransitioning) { 37159 return false; 37160 } 37161 let currentPath = (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(vtContext.currentLocation.pathname, basename) || vtContext.currentLocation.pathname; 37162 let nextPath = (0,react_router__WEBPACK_IMPORTED_MODULE_2__.stripBasename)(vtContext.nextLocation.pathname, basename) || vtContext.nextLocation.pathname; 37163 // Transition is active if we're going to or coming from the indicated 37164 // destination. This ensures that other PUSH navigations that reverse 37165 // an indicated transition apply. I.e., on the list view you have: 37166 // 37167 // <NavLink to="/details/1" unstable_viewTransition> 37168 // 37169 // If you click the breadcrumb back to the list view: 37170 // 37171 // <NavLink to="/list" unstable_viewTransition> 37172 // 37173 // We should apply the transition because it's indicated as active going 37174 // from /list -> /details/1 and therefore should be active on the reverse 37175 // (even though this isn't strictly a POP reverse) 37176 return (0,react_router__WEBPACK_IMPORTED_MODULE_2__.matchPath)(path.pathname, nextPath) != null || (0,react_router__WEBPACK_IMPORTED_MODULE_2__.matchPath)(path.pathname, currentPath) != null; 37177} 37178//#endregion 37179 37180 37181//# sourceMappingURL=index.js.map 37182 37183 37184/***/ }), 37185
vendor: 65,654 bytes, lines 37186-38710
37186/***/ "./node_modules/react-router/dist/index.js": 37187/*!*************************************************!*\ 37188 !*** ./node_modules/react-router/dist/index.js ***! 37189 \*************************************************/ 37190/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { 37191 37192"use strict"; 37193__webpack_require__.r(__webpack_exports__); 37194/* harmony export */ __webpack_require__.d(__webpack_exports__, { 37195/* harmony export */ AbortedDeferredError: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.AbortedDeferredError), 37196/* harmony export */ Await: () => (/* binding */ Await), 37197/* harmony export */ MemoryRouter: () => (/* binding */ MemoryRouter), 37198/* harmony export */ Navigate: () => (/* binding */ Navigate), 37199/* harmony export */ NavigationType: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.Action), 37200/* harmony export */ Outlet: () => (/* binding */ Outlet), 37201/* harmony export */ Route: () => (/* binding */ Route), 37202/* harmony export */ Router: () => (/* binding */ Router), 37203/* harmony export */ RouterProvider: () => (/* binding */ RouterProvider), 37204/* harmony export */ Routes: () => (/* binding */ Routes), 37205/* harmony export */ UNSAFE_DataRouterContext: () => (/* binding */ DataRouterContext), 37206/* harmony export */ UNSAFE_DataRouterStateContext: () => (/* binding */ DataRouterStateContext), 37207/* harmony export */ UNSAFE_LocationContext: () => (/* binding */ LocationContext), 37208/* harmony export */ UNSAFE_NavigationContext: () => (/* binding */ NavigationContext), 37209/* harmony export */ UNSAFE_RouteContext: () => (/* binding */ RouteContext), 37210/* harmony export */ UNSAFE_mapRouteProperties: () => (/* binding */ mapRouteProperties), 37211/* harmony export */ UNSAFE_useRouteId: () => (/* binding */ useRouteId), 37212/* harmony export */ UNSAFE_useRoutesImpl: () => (/* binding */ useRoutesImpl), 37213/* harmony export */ createMemoryRouter: () => (/* binding */ createMemoryRouter), 37214/* harmony export */ createPath: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.createPath), 37215/* harmony export */ createRoutesFromChildren: () => (/* binding */ createRoutesFromChildren), 37216/* harmony export */ createRoutesFromElements: () => (/* binding */ createRoutesFromChildren), 37217/* harmony export */ defer: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.defer), 37218/* harmony export */ generatePath: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.generatePath), 37219/* harmony export */ isRouteErrorResponse: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.isRouteErrorResponse), 37220/* harmony export */ json: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.json), 37221/* harmony export */ matchPath: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.matchPath), 37222/* harmony export */ matchRoutes: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.matchRoutes), 37223/* harmony export */ parsePath: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.parsePath), 37224/* harmony export */ redirect: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.redirect), 37225/* harmony export */ redirectDocument: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.redirectDocument), 37226/* harmony export */ renderMatches: () => (/* binding */ renderMatches), 37227/* harmony export */ resolvePath: () => (/* reexport safe */ _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.resolvePath), 37228/* harmony export */ useActionData: () => (/* binding */ useActionData), 37229/* harmony export */ useAsyncError: () => (/* binding */ useAsyncError), 37230/* harmony export */ useAsyncValue: () => (/* binding */ useAsyncValue), 37231/* harmony export */ useBlocker: () => (/* binding */ useBlocker), 37232/* harmony export */ useHref: () => (/* binding */ useHref), 37233/* harmony export */ useInRouterContext: () => (/* binding */ useInRouterContext), 37234/* harmony export */ useLoaderData: () => (/* binding */ useLoaderData), 37235/* harmony export */ useLocation: () => (/* binding */ useLocation), 37236/* harmony export */ useMatch: () => (/* binding */ useMatch), 37237/* harmony export */ useMatches: () => (/* binding */ useMatches), 37238/* harmony export */ useNavigate: () => (/* binding */ useNavigate), 37239/* harmony export */ useNavigation: () => (/* binding */ useNavigation), 37240/* harmony export */ useNavigationType: () => (/* binding */ useNavigationType), 37241/* harmony export */ useOutlet: () => (/* binding */ useOutlet), 37242/* harmony export */ useOutletContext: () => (/* binding */ useOutletContext), 37243/* harmony export */ useParams: () => (/* binding */ useParams), 37244/* harmony export */ useResolvedPath: () => (/* binding */ useResolvedPath), 37245/* harmony export */ useRevalidator: () => (/* binding */ useRevalidator), 37246/* harmony export */ useRouteError: () => (/* binding */ useRouteError), 37247/* harmony export */ useRouteLoaderData: () => (/* binding */ useRouteLoaderData), 37248/* harmony export */ useRoutes: () => (/* binding */ useRoutes) 37249/* harmony export */ }); 37250/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 37251/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 37252/* harmony import */ var _remix_run_router__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @remix-run/router */ "./node_modules/@remix-run/router/dist/router.js"); 37253/** 37254 * React Router v6.22.1 37255 * 37256 * Copyright (c) Remix Software Inc. 37257 * 37258 * This source code is licensed under the MIT license found in the 37259 * LICENSE.md file in the root directory of this source tree. 37260 * 37261 * @license MIT 37262 */ 37263 37264 37265 37266 37267function _extends() { 37268 _extends = Object.assign ? Object.assign.bind() : function (target) { 37269 for (var i = 1; i < arguments.length; i++) { 37270 var source = arguments[i]; 37271 for (var key in source) { 37272 if (Object.prototype.hasOwnProperty.call(source, key)) { 37273 target[key] = source[key]; 37274 } 37275 } 37276 } 37277 return target; 37278 }; 37279 return _extends.apply(this, arguments); 37280} 37281 37282// Create react-specific types from the agnostic types in @remix-run/router to 37283// export from react-router 37284const DataRouterContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37285if (true) { 37286 DataRouterContext.displayName = "DataRouter"; 37287} 37288const DataRouterStateContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37289if (true) { 37290 DataRouterStateContext.displayName = "DataRouterState"; 37291} 37292const AwaitContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37293if (true) { 37294 AwaitContext.displayName = "Await"; 37295} 37296 37297/** 37298 * A Navigator is a "location changer"; it's how you get to different locations. 37299 * 37300 * Every history instance conforms to the Navigator interface, but the 37301 * distinction is useful primarily when it comes to the low-level `<Router>` API 37302 * where both the location and a navigator must be provided separately in order 37303 * to avoid "tearing" that may occur in a suspense-enabled app if the action 37304 * and/or location were to be read directly from the history instance. 37305 */ 37306 37307const NavigationContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37308if (true) { 37309 NavigationContext.displayName = "Navigation"; 37310} 37311const LocationContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37312if (true) { 37313 LocationContext.displayName = "Location"; 37314} 37315const RouteContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext({ 37316 outlet: null, 37317 matches: [], 37318 isDataRoute: false 37319}); 37320if (true) { 37321 RouteContext.displayName = "Route"; 37322} 37323const RouteErrorContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37324if (true) { 37325 RouteErrorContext.displayName = "RouteError"; 37326} 37327 37328/** 37329 * Returns the full href for the given "to" value. This is useful for building 37330 * custom links that are also accessible and preserve right-click behavior. 37331 * 37332 * @see https://reactrouter.com/hooks/use-href 37333 */ 37334function useHref(to, _temp) { 37335 let { 37336 relative 37337 } = _temp === void 0 ? {} : _temp; 37338 !useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, // TODO: This error is probably because they somehow have 2 versions of the 37339 // router loaded. We can help them understand how to avoid that. 37340 "useHref() may be used only in the context of a <Router> component.") : 0 : void 0; 37341 let { 37342 basename, 37343 navigator 37344 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(NavigationContext); 37345 let { 37346 hash, 37347 pathname, 37348 search 37349 } = useResolvedPath(to, { 37350 relative 37351 }); 37352 let joinedPathname = pathname; 37353 37354 // If we're operating within a basename, prepend it to the pathname prior 37355 // to creating the href. If this is a root navigation, then just use the raw 37356 // basename which allows the basename to have full control over the presence 37357 // of a trailing slash on root links 37358 if (basename !== "/") { 37359 joinedPathname = pathname === "/" ? basename : (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.joinPaths)([basename, pathname]); 37360 } 37361 return navigator.createHref({ 37362 pathname: joinedPathname, 37363 search, 37364 hash 37365 }); 37366} 37367 37368/** 37369 * Returns true if this component is a descendant of a `<Router>`. 37370 * 37371 * @see https://reactrouter.com/hooks/use-in-router-context 37372 */ 37373function useInRouterContext() { 37374 return react__WEBPACK_IMPORTED_MODULE_0__.useContext(LocationContext) != null; 37375} 37376 37377/** 37378 * Returns the current location object, which represents the current URL in web 37379 * browsers. 37380 * 37381 * Note: If you're using this it may mean you're doing some of your own 37382 * "routing" in your app, and we'd like to know what your use case is. We may 37383 * be able to provide something higher-level to better suit your needs. 37384 * 37385 * @see https://reactrouter.com/hooks/use-location 37386 */ 37387function useLocation() { 37388 !useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, // TODO: This error is probably because they somehow have 2 versions of the 37389 // router loaded. We can help them understand how to avoid that. 37390 "useLocation() may be used only in the context of a <Router> component.") : 0 : void 0; 37391 return react__WEBPACK_IMPORTED_MODULE_0__.useContext(LocationContext).location; 37392} 37393 37394/** 37395 * Returns the current navigation action which describes how the router came to 37396 * the current location, either by a pop, push, or replace on the history stack. 37397 * 37398 * @see https://reactrouter.com/hooks/use-navigation-type 37399 */ 37400function useNavigationType() { 37401 return react__WEBPACK_IMPORTED_MODULE_0__.useContext(LocationContext).navigationType; 37402} 37403 37404/** 37405 * Returns a PathMatch object if the given pattern matches the current URL. 37406 * This is useful for components that need to know "active" state, e.g. 37407 * `<NavLink>`. 37408 * 37409 * @see https://reactrouter.com/hooks/use-match 37410 */ 37411function useMatch(pattern) { 37412 !useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, // TODO: This error is probably because they somehow have 2 versions of the 37413 // router loaded. We can help them understand how to avoid that. 37414 "useMatch() may be used only in the context of a <Router> component.") : 0 : void 0; 37415 let { 37416 pathname 37417 } = useLocation(); 37418 return react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.matchPath)(pattern, pathname), [pathname, pattern]); 37419} 37420 37421/** 37422 * The interface for the navigate() function returned from useNavigate(). 37423 */ 37424 37425const navigateEffectWarning = "You should call navigate() in a React.useEffect(), not when " + "your component is first rendered."; 37426 37427// Mute warnings for calls to useNavigate in SSR environments 37428function useIsomorphicLayoutEffect(cb) { 37429 let isStatic = react__WEBPACK_IMPORTED_MODULE_0__.useContext(NavigationContext).static; 37430 if (!isStatic) { 37431 // We should be able to get rid of this once react 18.3 is released 37432 // See: https://github.com/facebook/react/pull/26395 37433 // eslint-disable-next-line react-hooks/rules-of-hooks 37434 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(cb); 37435 } 37436} 37437 37438/** 37439 * Returns an imperative method for changing the location. Used by `<Link>`s, but 37440 * may also be used by other elements to change the location. 37441 * 37442 * @see https://reactrouter.com/hooks/use-navigate 37443 */ 37444function useNavigate() { 37445 let { 37446 isDataRoute 37447 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 37448 // Conditional usage is OK here because the usage of a data router is static 37449 // eslint-disable-next-line react-hooks/rules-of-hooks 37450 return isDataRoute ? useNavigateStable() : useNavigateUnstable(); 37451} 37452function useNavigateUnstable() { 37453 !useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, // TODO: This error is probably because they somehow have 2 versions of the 37454 // router loaded. We can help them understand how to avoid that. 37455 "useNavigate() may be used only in the context of a <Router> component.") : 0 : void 0; 37456 let dataRouterContext = react__WEBPACK_IMPORTED_MODULE_0__.useContext(DataRouterContext); 37457 let { 37458 basename, 37459 future, 37460 navigator 37461 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(NavigationContext); 37462 let { 37463 matches 37464 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 37465 let { 37466 pathname: locationPathname 37467 } = useLocation(); 37468 let routePathnamesJson = JSON.stringify((0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_getResolveToMatches)(matches, future.v7_relativeSplatPath)); 37469 let activeRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false); 37470 useIsomorphicLayoutEffect(() => { 37471 activeRef.current = true; 37472 }); 37473 let navigate = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function (to, options) { 37474 if (options === void 0) { 37475 options = {}; 37476 } 37477 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(activeRef.current, navigateEffectWarning) : 0; 37478 37479 // Short circuit here since if this happens on first render the navigate 37480 // is useless because we haven't wired up our history listener yet 37481 if (!activeRef.current) return; 37482 if (typeof to === "number") { 37483 navigator.go(to); 37484 return; 37485 } 37486 let path = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.resolveTo)(to, JSON.parse(routePathnamesJson), locationPathname, options.relative === "path"); 37487 37488 // If we're operating within a basename, prepend it to the pathname prior 37489 // to handing off to history (but only if we're not in a data router, 37490 // otherwise it'll prepend the basename inside of the router). 37491 // If this is a root navigation, then we navigate to the raw basename 37492 // which allows the basename to have full control over the presence of a 37493 // trailing slash on root links 37494 if (dataRouterContext == null && basename !== "/") { 37495 path.pathname = path.pathname === "/" ? basename : (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.joinPaths)([basename, path.pathname]); 37496 } 37497 (!!options.replace ? navigator.replace : navigator.push)(path, options.state, options); 37498 }, [basename, navigator, routePathnamesJson, locationPathname, dataRouterContext]); 37499 return navigate; 37500} 37501const OutletContext = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createContext(null); 37502 37503/** 37504 * Returns the context (if provided) for the child route at this level of the route 37505 * hierarchy. 37506 * @see https://reactrouter.com/hooks/use-outlet-context 37507 */ 37508function useOutletContext() { 37509 return react__WEBPACK_IMPORTED_MODULE_0__.useContext(OutletContext); 37510} 37511 37512/** 37513 * Returns the element for the child route at this level of the route 37514 * hierarchy. Used internally by `<Outlet>` to render child routes. 37515 * 37516 * @see https://reactrouter.com/hooks/use-outlet 37517 */ 37518function useOutlet(context) { 37519 let outlet = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext).outlet; 37520 if (outlet) { 37521 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(OutletContext.Provider, { 37522 value: context 37523 }, outlet); 37524 } 37525 return outlet; 37526} 37527 37528/** 37529 * Returns an object of key/value pairs of the dynamic params from the current 37530 * URL that were matched by the route path. 37531 * 37532 * @see https://reactrouter.com/hooks/use-params 37533 */ 37534function useParams() { 37535 let { 37536 matches 37537 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 37538 let routeMatch = matches[matches.length - 1]; 37539 return routeMatch ? routeMatch.params : {}; 37540} 37541 37542/** 37543 * Resolves the pathname of the given `to` value against the current location. 37544 * 37545 * @see https://reactrouter.com/hooks/use-resolved-path 37546 */ 37547function useResolvedPath(to, _temp2) { 37548 let { 37549 relative 37550 } = _temp2 === void 0 ? {} : _temp2; 37551 let { 37552 future 37553 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(NavigationContext); 37554 let { 37555 matches 37556 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 37557 let { 37558 pathname: locationPathname 37559 } = useLocation(); 37560 let routePathnamesJson = JSON.stringify((0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_getResolveToMatches)(matches, future.v7_relativeSplatPath)); 37561 return react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.resolveTo)(to, JSON.parse(routePathnamesJson), locationPathname, relative === "path"), [to, routePathnamesJson, locationPathname, relative]); 37562} 37563 37564/** 37565 * Returns the element of the route that matched the current location, prepared 37566 * with the correct context to render the remainder of the route tree. Route 37567 * elements in the tree must render an `<Outlet>` to render their child route's 37568 * element. 37569 * 37570 * @see https://reactrouter.com/hooks/use-routes 37571 */ 37572function useRoutes(routes, locationArg) { 37573 return useRoutesImpl(routes, locationArg); 37574} 37575 37576// Internal implementation with accept optional param for RouterProvider usage 37577function useRoutesImpl(routes, locationArg, dataRouterState, future) { 37578 !useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, // TODO: This error is probably because they somehow have 2 versions of the 37579 // router loaded. We can help them understand how to avoid that. 37580 "useRoutes() may be used only in the context of a <Router> component.") : 0 : void 0; 37581 let { 37582 navigator 37583 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(NavigationContext); 37584 let { 37585 matches: parentMatches 37586 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 37587 let routeMatch = parentMatches[parentMatches.length - 1]; 37588 let parentParams = routeMatch ? routeMatch.params : {}; 37589 let parentPathname = routeMatch ? routeMatch.pathname : "/"; 37590 let parentPathnameBase = routeMatch ? routeMatch.pathnameBase : "/"; 37591 let parentRoute = routeMatch && routeMatch.route; 37592 if (true) { 37593 // You won't get a warning about 2 different <Routes> under a <Route> 37594 // without a trailing *, but this is a best-effort warning anyway since we 37595 // cannot even give the warning unless they land at the parent route. 37596 // 37597 // Example: 37598 // 37599 // <Routes> 37600 // {/* This route path MUST end with /* because otherwise 37601 // it will never match /blog/post/123 */} 37602 // <Route path="blog" element={<Blog />} /> 37603 // <Route path="blog/feed" element={<BlogFeed />} /> 37604 // </Routes> 37605 // 37606 // function Blog() { 37607 // return ( 37608 // <Routes> 37609 // <Route path="post/:id" element={<Post />} /> 37610 // </Routes> 37611 // ); 37612 // } 37613 let parentPath = parentRoute && parentRoute.path || ""; 37614 warningOnce(parentPathname, !parentRoute || parentPath.endsWith("*"), "You rendered descendant <Routes> (or called `useRoutes()`) at " + ("\"" + parentPathname + "\" (under <Route path=\"" + parentPath + "\">) but the ") + "parent route path has no trailing \"*\". This means if you navigate " + "deeper, the parent won't match anymore and therefore the child " + "routes will never render.\n\n" + ("Please change the parent <Route path=\"" + parentPath + "\"> to <Route ") + ("path=\"" + (parentPath === "/" ? "*" : parentPath + "/*") + "\">.")); 37615 } 37616 let locationFromContext = useLocation(); 37617 let location; 37618 if (locationArg) { 37619 var _parsedLocationArg$pa; 37620 let parsedLocationArg = typeof locationArg === "string" ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.parsePath)(locationArg) : locationArg; 37621 !(parentPathnameBase === "/" || ((_parsedLocationArg$pa = parsedLocationArg.pathname) == null ? void 0 : _parsedLocationArg$pa.startsWith(parentPathnameBase))) ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, "When overriding the location using `<Routes location>` or `useRoutes(routes, location)`, " + "the location pathname must begin with the portion of the URL pathname that was " + ("matched by all parent routes. The current pathname base is \"" + parentPathnameBase + "\" ") + ("but pathname \"" + parsedLocationArg.pathname + "\" was given in the `location` prop.")) : 0 : void 0; 37622 location = parsedLocationArg; 37623 } else { 37624 location = locationFromContext; 37625 } 37626 let pathname = location.pathname || "/"; 37627 let remainingPathname = pathname; 37628 if (parentPathnameBase !== "/") { 37629 // Determine the remaining pathname by removing the # of URL segments the 37630 // parentPathnameBase has, instead of removing based on character count. 37631 // This is because we can't guarantee that incoming/outgoing encodings/ 37632 // decodings will match exactly. 37633 // We decode paths before matching on a per-segment basis with 37634 // decodeURIComponent(), but we re-encode pathnames via `new URL()` so they 37635 // match what `window.location.pathname` would reflect. Those don't 100% 37636 // align when it comes to encoded URI characters such as % and &. 37637 // 37638 // So we may end up with: 37639 // pathname: "/descendant/a%25b/match" 37640 // parentPathnameBase: "/descendant/a%b" 37641 // 37642 // And the direct substring removal approach won't work :/ 37643 let parentSegments = parentPathnameBase.replace(/^\//, "").split("/"); 37644 let segments = pathname.replace(/^\//, "").split("/"); 37645 remainingPathname = "/" + segments.slice(parentSegments.length).join("/"); 37646 } 37647 let matches = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.matchRoutes)(routes, { 37648 pathname: remainingPathname 37649 }); 37650 if (true) { 37651 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(parentRoute || matches != null, "No routes matched location \"" + location.pathname + location.search + location.hash + "\" ") : 0; 37652 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(matches == null || matches[matches.length - 1].route.element !== undefined || matches[matches.length - 1].route.Component !== undefined || matches[matches.length - 1].route.lazy !== undefined, "Matched leaf route at location \"" + location.pathname + location.search + location.hash + "\" " + "does not have an element or Component. This means it will render an <Outlet /> with a " + "null value by default resulting in an \"empty\" page.") : 0; 37653 } 37654 let renderedMatches = _renderMatches(matches && matches.map(match => Object.assign({}, match, { 37655 params: Object.assign({}, parentParams, match.params), 37656 pathname: (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.joinPaths)([parentPathnameBase, 37657 // Re-encode pathnames that were decoded inside matchRoutes 37658 navigator.encodeLocation ? navigator.encodeLocation(match.pathname).pathname : match.pathname]), 37659 pathnameBase: match.pathnameBase === "/" ? parentPathnameBase : (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.joinPaths)([parentPathnameBase, 37660 // Re-encode pathnames that were decoded inside matchRoutes 37661 navigator.encodeLocation ? navigator.encodeLocation(match.pathnameBase).pathname : match.pathnameBase]) 37662 })), parentMatches, dataRouterState, future); 37663 37664 // When a user passes in a `locationArg`, the associated routes need to 37665 // be wrapped in a new `LocationContext.Provider` in order for `useLocation` 37666 // to use the scoped location instead of the global location. 37667 if (locationArg && renderedMatches) { 37668 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(LocationContext.Provider, { 37669 value: { 37670 location: _extends({ 37671 pathname: "/", 37672 search: "", 37673 hash: "", 37674 state: null, 37675 key: "default" 37676 }, location), 37677 navigationType: _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.Action.Pop 37678 } 37679 }, renderedMatches); 37680 } 37681 return renderedMatches; 37682} 37683function DefaultErrorComponent() { 37684 let error = useRouteError(); 37685 let message = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.isRouteErrorResponse)(error) ? error.status + " " + error.statusText : error instanceof Error ? error.message : JSON.stringify(error); 37686 let stack = error instanceof Error ? error.stack : null; 37687 let lightgrey = "rgba(200,200,200, 0.5)"; 37688 let preStyles = { 37689 padding: "0.5rem", 37690 backgroundColor: lightgrey 37691 }; 37692 let codeStyles = { 37693 padding: "2px 4px", 37694 backgroundColor: lightgrey 37695 }; 37696 let devInfo = null; 37697 if (true) { 37698 console.error("Error handled by React Router default ErrorBoundary:", error); 37699 devInfo = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("p", null, "\uD83D\uDCBF Hey developer \uD83D\uDC4B"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("p", null, "You can provide a way better UX than this when your app throws errors by providing your own ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("code", { 37700 style: codeStyles 37701 }, "ErrorBoundary"), " or", " ", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("code", { 37702 style: codeStyles 37703 }, "errorElement"), " prop on your route.")); 37704 } 37705 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("h2", null, "Unexpected Application Error!"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("h3", { 37706 style: { 37707 fontStyle: "italic" 37708 } 37709 }, message), stack ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("pre", { 37710 style: preStyles 37711 }, stack) : null, devInfo); 37712} 37713const defaultErrorElement = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(DefaultErrorComponent, null); 37714class RenderErrorBoundary extends react__WEBPACK_IMPORTED_MODULE_0__.Component { 37715 constructor(props) { 37716 super(props); 37717 this.state = { 37718 location: props.location, 37719 revalidation: props.revalidation, 37720 error: props.error 37721 }; 37722 } 37723 static getDerivedStateFromError(error) { 37724 return { 37725 error: error 37726 }; 37727 } 37728 static getDerivedStateFromProps(props, state) { 37729 // When we get into an error state, the user will likely click "back" to the 37730 // previous page that didn't have an error. Because this wraps the entire 37731 // application, that will have no effect--the error page continues to display. 37732 // This gives us a mechanism to recover from the error when the location changes. 37733 // 37734 // Whether we're in an error state or not, we update the location in state 37735 // so that when we are in an error state, it gets reset when a new location 37736 // comes in and the user recovers from the error. 37737 if (state.location !== props.location || state.revalidation !== "idle" && props.revalidation === "idle") { 37738 return { 37739 error: props.error, 37740 location: props.location, 37741 revalidation: props.revalidation 37742 }; 37743 } 37744 37745 // If we're not changing locations, preserve the location but still surface 37746 // any new errors that may come through. We retain the existing error, we do 37747 // this because the error provided from the app state may be cleared without 37748 // the location changing. 37749 return { 37750 error: props.error !== undefined ? props.error : state.error, 37751 location: state.location, 37752 revalidation: props.revalidation || state.revalidation 37753 }; 37754 } 37755 componentDidCatch(error, errorInfo) { 37756 console.error("React Router caught the following error during render", error, errorInfo); 37757 } 37758 render() { 37759 return this.state.error !== undefined ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(RouteContext.Provider, { 37760 value: this.props.routeContext 37761 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(RouteErrorContext.Provider, { 37762 value: this.state.error, 37763 children: this.props.component 37764 })) : this.props.children; 37765 } 37766} 37767function RenderedRoute(_ref) { 37768 let { 37769 routeContext, 37770 match, 37771 children 37772 } = _ref; 37773 let dataRouterContext = react__WEBPACK_IMPORTED_MODULE_0__.useContext(DataRouterContext); 37774 37775 // Track how deep we got in our render pass to emulate SSR componentDidCatch 37776 // in a DataStaticRouter 37777 if (dataRouterContext && dataRouterContext.static && dataRouterContext.staticContext && (match.route.errorElement || match.route.ErrorBoundary)) { 37778 dataRouterContext.staticContext._deepestRenderedBoundaryId = match.route.id; 37779 } 37780 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(RouteContext.Provider, { 37781 value: routeContext 37782 }, children); 37783} 37784function _renderMatches(matches, parentMatches, dataRouterState, future) { 37785 var _dataRouterState2; 37786 if (parentMatches === void 0) { 37787 parentMatches = []; 37788 } 37789 if (dataRouterState === void 0) { 37790 dataRouterState = null; 37791 } 37792 if (future === void 0) { 37793 future = null; 37794 } 37795 if (matches == null) { 37796 var _dataRouterState; 37797 if ((_dataRouterState = dataRouterState) != null && _dataRouterState.errors) { 37798 // Don't bail if we have data router errors so we can render them in the 37799 // boundary. Use the pre-matched (or shimmed) matches 37800 matches = dataRouterState.matches; 37801 } else { 37802 return null; 37803 } 37804 } 37805 let renderedMatches = matches; 37806 37807 // If we have data errors, trim matches to the highest error boundary 37808 let errors = (_dataRouterState2 = dataRouterState) == null ? void 0 : _dataRouterState2.errors; 37809 if (errors != null) { 37810 let errorIndex = renderedMatches.findIndex(m => m.route.id && (errors == null ? void 0 : errors[m.route.id])); 37811 !(errorIndex >= 0) ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, "Could not find a matching route for errors on route IDs: " + Object.keys(errors).join(",")) : 0 : void 0; 37812 renderedMatches = renderedMatches.slice(0, Math.min(renderedMatches.length, errorIndex + 1)); 37813 } 37814 37815 // If we're in a partial hydration mode, detect if we need to render down to 37816 // a given HydrateFallback while we load the rest of the hydration data 37817 let renderFallback = false; 37818 let fallbackIndex = -1; 37819 if (dataRouterState && future && future.v7_partialHydration) { 37820 for (let i = 0; i < renderedMatches.length; i++) { 37821 let match = renderedMatches[i]; 37822 // Track the deepest fallback up until the first route without data 37823 if (match.route.HydrateFallback || match.route.hydrateFallbackElement) { 37824 fallbackIndex = i; 37825 } 37826 if (match.route.id) { 37827 let { 37828 loaderData, 37829 errors 37830 } = dataRouterState; 37831 let needsToRunLoader = match.route.loader && loaderData[match.route.id] === undefined && (!errors || errors[match.route.id] === undefined); 37832 if (match.route.lazy || needsToRunLoader) { 37833 // We found the first route that's not ready to render (waiting on 37834 // lazy, or has a loader that hasn't run yet). Flag that we need to 37835 // render a fallback and render up until the appropriate fallback 37836 renderFallback = true; 37837 if (fallbackIndex >= 0) { 37838 renderedMatches = renderedMatches.slice(0, fallbackIndex + 1); 37839 } else { 37840 renderedMatches = [renderedMatches[0]]; 37841 } 37842 break; 37843 } 37844 } 37845 } 37846 } 37847 return renderedMatches.reduceRight((outlet, match, index) => { 37848 // Only data routers handle errors/fallbacks 37849 let error; 37850 let shouldRenderHydrateFallback = false; 37851 let errorElement = null; 37852 let hydrateFallbackElement = null; 37853 if (dataRouterState) { 37854 error = errors && match.route.id ? errors[match.route.id] : undefined; 37855 errorElement = match.route.errorElement || defaultErrorElement; 37856 if (renderFallback) { 37857 if (fallbackIndex < 0 && index === 0) { 37858 warningOnce("route-fallback", false, "No `HydrateFallback` element provided to render during initial hydration"); 37859 shouldRenderHydrateFallback = true; 37860 hydrateFallbackElement = null; 37861 } else if (fallbackIndex === index) { 37862 shouldRenderHydrateFallback = true; 37863 hydrateFallbackElement = match.route.hydrateFallbackElement || null; 37864 } 37865 } 37866 } 37867 let matches = parentMatches.concat(renderedMatches.slice(0, index + 1)); 37868 let getChildren = () => { 37869 let children; 37870 if (error) { 37871 children = errorElement; 37872 } else if (shouldRenderHydrateFallback) { 37873 children = hydrateFallbackElement; 37874 } else if (match.route.Component) { 37875 // Note: This is a de-optimized path since React won't re-use the 37876 // ReactElement since it's identity changes with each new 37877 // React.createElement call. We keep this so folks can use 37878 // `<Route Component={...}>` in `<Routes>` but generally `Component` 37879 // usage is only advised in `RouterProvider` when we can convert it to 37880 // `element` ahead of time. 37881 children = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(match.route.Component, null); 37882 } else if (match.route.element) { 37883 children = match.route.element; 37884 } else { 37885 children = outlet; 37886 } 37887 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(RenderedRoute, { 37888 match: match, 37889 routeContext: { 37890 outlet, 37891 matches, 37892 isDataRoute: dataRouterState != null 37893 }, 37894 children: children 37895 }); 37896 }; 37897 // Only wrap in an error boundary within data router usages when we have an 37898 // ErrorBoundary/errorElement on this route. Otherwise let it bubble up to 37899 // an ancestor ErrorBoundary/errorElement 37900 return dataRouterState && (match.route.ErrorBoundary || match.route.errorElement || index === 0) ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(RenderErrorBoundary, { 37901 location: dataRouterState.location, 37902 revalidation: dataRouterState.revalidation, 37903 component: errorElement, 37904 error: error, 37905 children: getChildren(), 37906 routeContext: { 37907 outlet: null, 37908 matches, 37909 isDataRoute: true 37910 } 37911 }) : getChildren(); 37912 }, null); 37913} 37914var DataRouterHook = /*#__PURE__*/function (DataRouterHook) { 37915 DataRouterHook["UseBlocker"] = "useBlocker"; 37916 DataRouterHook["UseRevalidator"] = "useRevalidator"; 37917 DataRouterHook["UseNavigateStable"] = "useNavigate"; 37918 return DataRouterHook; 37919}(DataRouterHook || {}); 37920var DataRouterStateHook = /*#__PURE__*/function (DataRouterStateHook) { 37921 DataRouterStateHook["UseBlocker"] = "useBlocker"; 37922 DataRouterStateHook["UseLoaderData"] = "useLoaderData"; 37923 DataRouterStateHook["UseActionData"] = "useActionData"; 37924 DataRouterStateHook["UseRouteError"] = "useRouteError"; 37925 DataRouterStateHook["UseNavigation"] = "useNavigation"; 37926 DataRouterStateHook["UseRouteLoaderData"] = "useRouteLoaderData"; 37927 DataRouterStateHook["UseMatches"] = "useMatches"; 37928 DataRouterStateHook["UseRevalidator"] = "useRevalidator"; 37929 DataRouterStateHook["UseNavigateStable"] = "useNavigate"; 37930 DataRouterStateHook["UseRouteId"] = "useRouteId"; 37931 return DataRouterStateHook; 37932}(DataRouterStateHook || {}); 37933function getDataRouterConsoleError(hookName) { 37934 return hookName + " must be used within a data router. See https://reactrouter.com/routers/picking-a-router."; 37935} 37936function useDataRouterContext(hookName) { 37937 let ctx = react__WEBPACK_IMPORTED_MODULE_0__.useContext(DataRouterContext); 37938 !ctx ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, getDataRouterConsoleError(hookName)) : 0 : void 0; 37939 return ctx; 37940} 37941function useDataRouterState(hookName) { 37942 let state = react__WEBPACK_IMPORTED_MODULE_0__.useContext(DataRouterStateContext); 37943 !state ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, getDataRouterConsoleError(hookName)) : 0 : void 0; 37944 return state; 37945} 37946function useRouteContext(hookName) { 37947 let route = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 37948 !route ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, getDataRouterConsoleError(hookName)) : 0 : void 0; 37949 return route; 37950} 37951 37952// Internal version with hookName-aware debugging 37953function useCurrentRouteId(hookName) { 37954 let route = useRouteContext(hookName); 37955 let thisRoute = route.matches[route.matches.length - 1]; 37956 !thisRoute.route.id ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, hookName + " can only be used on routes that contain a unique \"id\"") : 0 : void 0; 37957 return thisRoute.route.id; 37958} 37959 37960/** 37961 * Returns the ID for the nearest contextual route 37962 */ 37963function useRouteId() { 37964 return useCurrentRouteId(DataRouterStateHook.UseRouteId); 37965} 37966 37967/** 37968 * Returns the current navigation, defaulting to an "idle" navigation when 37969 * no navigation is in progress 37970 */ 37971function useNavigation() { 37972 let state = useDataRouterState(DataRouterStateHook.UseNavigation); 37973 return state.navigation; 37974} 37975 37976/** 37977 * Returns a revalidate function for manually triggering revalidation, as well 37978 * as the current state of any manual revalidations 37979 */ 37980function useRevalidator() { 37981 let dataRouterContext = useDataRouterContext(DataRouterHook.UseRevalidator); 37982 let state = useDataRouterState(DataRouterStateHook.UseRevalidator); 37983 return react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => ({ 37984 revalidate: dataRouterContext.router.revalidate, 37985 state: state.revalidation 37986 }), [dataRouterContext.router.revalidate, state.revalidation]); 37987} 37988 37989/** 37990 * Returns the active route matches, useful for accessing loaderData for 37991 * parent/child routes or the route "handle" property 37992 */ 37993function useMatches() { 37994 let { 37995 matches, 37996 loaderData 37997 } = useDataRouterState(DataRouterStateHook.UseMatches); 37998 return react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => matches.map(m => (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_convertRouteMatchToUiMatch)(m, loaderData)), [matches, loaderData]); 37999} 38000 38001/** 38002 * Returns the loader data for the nearest ancestor Route loader 38003 */ 38004function useLoaderData() { 38005 let state = useDataRouterState(DataRouterStateHook.UseLoaderData); 38006 let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData); 38007 if (state.errors && state.errors[routeId] != null) { 38008 console.error("You cannot `useLoaderData` in an errorElement (routeId: " + routeId + ")"); 38009 return undefined; 38010 } 38011 return state.loaderData[routeId]; 38012} 38013 38014/** 38015 * Returns the loaderData for the given routeId 38016 */ 38017function useRouteLoaderData(routeId) { 38018 let state = useDataRouterState(DataRouterStateHook.UseRouteLoaderData); 38019 return state.loaderData[routeId]; 38020} 38021 38022/** 38023 * Returns the action data for the nearest ancestor Route action 38024 */ 38025function useActionData() { 38026 let state = useDataRouterState(DataRouterStateHook.UseActionData); 38027 let routeId = useCurrentRouteId(DataRouterStateHook.UseLoaderData); 38028 return state.actionData ? state.actionData[routeId] : undefined; 38029} 38030 38031/** 38032 * Returns the nearest ancestor Route error, which could be a loader/action 38033 * error or a render error. This is intended to be called from your 38034 * ErrorBoundary/errorElement to display a proper error message. 38035 */ 38036function useRouteError() { 38037 var _state$errors; 38038 let error = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteErrorContext); 38039 let state = useDataRouterState(DataRouterStateHook.UseRouteError); 38040 let routeId = useCurrentRouteId(DataRouterStateHook.UseRouteError); 38041 38042 // If this was a render error, we put it in a RouteError context inside 38043 // of RenderErrorBoundary 38044 if (error !== undefined) { 38045 return error; 38046 } 38047 38048 // Otherwise look for errors from our data router state 38049 return (_state$errors = state.errors) == null ? void 0 : _state$errors[routeId]; 38050} 38051 38052/** 38053 * Returns the happy-path data from the nearest ancestor `<Await />` value 38054 */ 38055function useAsyncValue() { 38056 let value = react__WEBPACK_IMPORTED_MODULE_0__.useContext(AwaitContext); 38057 return value == null ? void 0 : value._data; 38058} 38059 38060/** 38061 * Returns the error from the nearest ancestor `<Await />` value 38062 */ 38063function useAsyncError() { 38064 let value = react__WEBPACK_IMPORTED_MODULE_0__.useContext(AwaitContext); 38065 return value == null ? void 0 : value._error; 38066} 38067let blockerId = 0; 38068 38069/** 38070 * Allow the application to block navigations within the SPA and present the 38071 * user a confirmation dialog to confirm the navigation. Mostly used to avoid 38072 * using half-filled form data. This does not handle hard-reloads or 38073 * cross-origin navigations. 38074 */ 38075function useBlocker(shouldBlock) { 38076 let { 38077 router, 38078 basename 38079 } = useDataRouterContext(DataRouterHook.UseBlocker); 38080 let state = useDataRouterState(DataRouterStateHook.UseBlocker); 38081 let [blockerKey, setBlockerKey] = react__WEBPACK_IMPORTED_MODULE_0__.useState(""); 38082 let blockerFunction = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(arg => { 38083 if (typeof shouldBlock !== "function") { 38084 return !!shouldBlock; 38085 } 38086 if (basename === "/") { 38087 return shouldBlock(arg); 38088 } 38089 38090 // If they provided us a function and we've got an active basename, strip 38091 // it from the locations we expose to the user to match the behavior of 38092 // useLocation 38093 let { 38094 currentLocation, 38095 nextLocation, 38096 historyAction 38097 } = arg; 38098 return shouldBlock({ 38099 currentLocation: _extends({}, currentLocation, { 38100 pathname: (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.stripBasename)(currentLocation.pathname, basename) || currentLocation.pathname 38101 }), 38102 nextLocation: _extends({}, nextLocation, { 38103 pathname: (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.stripBasename)(nextLocation.pathname, basename) || nextLocation.pathname 38104 }), 38105 historyAction 38106 }); 38107 }, [basename, shouldBlock]); 38108 38109 // This effect is in charge of blocker key assignment and deletion (which is 38110 // tightly coupled to the key) 38111 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 38112 let key = String(++blockerId); 38113 setBlockerKey(key); 38114 return () => router.deleteBlocker(key); 38115 }, [router]); 38116 38117 // This effect handles assigning the blockerFunction. This is to handle 38118 // unstable blocker function identities, and happens only after the prior 38119 // effect so we don't get an orphaned blockerFunction in the router with a 38120 // key of "". Until then we just have the IDLE_BLOCKER. 38121 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 38122 if (blockerKey !== "") { 38123 router.getBlocker(blockerKey, blockerFunction); 38124 } 38125 }, [router, blockerKey, blockerFunction]); 38126 38127 // Prefer the blocker from `state` not `router.state` since DataRouterContext 38128 // is memoized so this ensures we update on blocker state updates 38129 return blockerKey && state.blockers.has(blockerKey) ? state.blockers.get(blockerKey) : _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.IDLE_BLOCKER; 38130} 38131 38132/** 38133 * Stable version of useNavigate that is used when we are in the context of 38134 * a RouterProvider. 38135 */ 38136function useNavigateStable() { 38137 let { 38138 router 38139 } = useDataRouterContext(DataRouterHook.UseNavigateStable); 38140 let id = useCurrentRouteId(DataRouterStateHook.UseNavigateStable); 38141 let activeRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(false); 38142 useIsomorphicLayoutEffect(() => { 38143 activeRef.current = true; 38144 }); 38145 let navigate = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(function (to, options) { 38146 if (options === void 0) { 38147 options = {}; 38148 } 38149 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(activeRef.current, navigateEffectWarning) : 0; 38150 38151 // Short circuit here since if this happens on first render the navigate 38152 // is useless because we haven't wired up our router subscriber yet 38153 if (!activeRef.current) return; 38154 if (typeof to === "number") { 38155 router.navigate(to); 38156 } else { 38157 router.navigate(to, _extends({ 38158 fromRouteId: id 38159 }, options)); 38160 } 38161 }, [router, id]); 38162 return navigate; 38163} 38164const alreadyWarned = {}; 38165function warningOnce(key, cond, message) { 38166 if (!cond && !alreadyWarned[key]) { 38167 alreadyWarned[key] = true; 38168 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(false, message) : 0; 38169 } 38170} 38171 38172/** 38173 Webpack + React 17 fails to compile on any of the following because webpack 38174 complains that `startTransition` doesn't exist in `React`: 38175 * import { startTransition } from "react" 38176 * import * as React from from "react"; 38177 "startTransition" in React ? React.startTransition(() => setState()) : setState() 38178 * import * as React from from "react"; 38179 "startTransition" in React ? React["startTransition"](() => setState()) : setState() 38180 38181 Moving it to a constant such as the following solves the Webpack/React 17 issue: 38182 * import * as React from from "react"; 38183 const START_TRANSITION = "startTransition"; 38184 START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState() 38185 38186 However, that introduces webpack/terser minification issues in production builds 38187 in React 18 where minification/obfuscation ends up removing the call of 38188 React.startTransition entirely from the first half of the ternary. Grabbing 38189 this exported reference once up front resolves that issue. 38190 38191 See https://github.com/remix-run/react-router/issues/10579 38192*/ 38193const START_TRANSITION = "startTransition"; 38194const startTransitionImpl = react__WEBPACK_IMPORTED_MODULE_0__[START_TRANSITION]; 38195 38196/** 38197 * Given a Remix Router instance, render the appropriate UI 38198 */ 38199function RouterProvider(_ref) { 38200 let { 38201 fallbackElement, 38202 router, 38203 future 38204 } = _ref; 38205 let [state, setStateImpl] = react__WEBPACK_IMPORTED_MODULE_0__.useState(router.state); 38206 let { 38207 v7_startTransition 38208 } = future || {}; 38209 let setState = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(newState => { 38210 if (v7_startTransition && startTransitionImpl) { 38211 startTransitionImpl(() => setStateImpl(newState)); 38212 } else { 38213 setStateImpl(newState); 38214 } 38215 }, [setStateImpl, v7_startTransition]); 38216 38217 // Need to use a layout effect here so we are subscribed early enough to 38218 // pick up on any render-driven redirects/navigations (useEffect/<Navigate>) 38219 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => router.subscribe(setState), [router, setState]); 38220 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => { 38221 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(fallbackElement == null || !router.future.v7_partialHydration, "`<RouterProvider fallbackElement>` is deprecated when using " + "`v7_partialHydration`, use a `HydrateFallback` component instead") : 0; 38222 // Only log this once on initial mount 38223 // eslint-disable-next-line react-hooks/exhaustive-deps 38224 }, []); 38225 let navigator = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => { 38226 return { 38227 createHref: router.createHref, 38228 encodeLocation: router.encodeLocation, 38229 go: n => router.navigate(n), 38230 push: (to, state, opts) => router.navigate(to, { 38231 state, 38232 preventScrollReset: opts == null ? void 0 : opts.preventScrollReset 38233 }), 38234 replace: (to, state, opts) => router.navigate(to, { 38235 replace: true, 38236 state, 38237 preventScrollReset: opts == null ? void 0 : opts.preventScrollReset 38238 }) 38239 }; 38240 }, [router]); 38241 let basename = router.basename || "/"; 38242 let dataRouterContext = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => ({ 38243 router, 38244 navigator, 38245 static: false, 38246 basename 38247 }), [router, navigator, basename]); 38248 38249 // The fragment and {null} here are important! We need them to keep React 18's 38250 // useId happy when we are server-rendering since we may have a <script> here 38251 // containing the hydrated server-side staticContext (from StaticRouterProvider). 38252 // useId relies on the component tree structure to generate deterministic id's 38253 // so we need to ensure it remains the same on the client even though 38254 // we don't need the <script> tag 38255 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(DataRouterContext.Provider, { 38256 value: dataRouterContext 38257 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(DataRouterStateContext.Provider, { 38258 value: state 38259 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(Router, { 38260 basename: basename, 38261 location: state.location, 38262 navigationType: state.historyAction, 38263 navigator: navigator, 38264 future: { 38265 v7_relativeSplatPath: router.future.v7_relativeSplatPath 38266 } 38267 }, state.initialized || router.future.v7_partialHydration ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(DataRoutes, { 38268 routes: router.routes, 38269 future: router.future, 38270 state: state 38271 }) : fallbackElement))), null); 38272} 38273function DataRoutes(_ref2) { 38274 let { 38275 routes, 38276 future, 38277 state 38278 } = _ref2; 38279 return useRoutesImpl(routes, undefined, state, future); 38280} 38281/** 38282 * A `<Router>` that stores all entries in memory. 38283 * 38284 * @see https://reactrouter.com/router-components/memory-router 38285 */ 38286function MemoryRouter(_ref3) { 38287 let { 38288 basename, 38289 children, 38290 initialEntries, 38291 initialIndex, 38292 future 38293 } = _ref3; 38294 let historyRef = react__WEBPACK_IMPORTED_MODULE_0__.useRef(); 38295 if (historyRef.current == null) { 38296 historyRef.current = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.createMemoryHistory)({ 38297 initialEntries, 38298 initialIndex, 38299 v5Compat: true 38300 }); 38301 } 38302 let history = historyRef.current; 38303 let [state, setStateImpl] = react__WEBPACK_IMPORTED_MODULE_0__.useState({ 38304 action: history.action, 38305 location: history.location 38306 }); 38307 let { 38308 v7_startTransition 38309 } = future || {}; 38310 let setState = react__WEBPACK_IMPORTED_MODULE_0__.useCallback(newState => { 38311 v7_startTransition && startTransitionImpl ? startTransitionImpl(() => setStateImpl(newState)) : setStateImpl(newState); 38312 }, [setStateImpl, v7_startTransition]); 38313 react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(() => history.listen(setState), [history, setState]); 38314 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(Router, { 38315 basename: basename, 38316 children: children, 38317 location: state.location, 38318 navigationType: state.action, 38319 navigator: history, 38320 future: future 38321 }); 38322} 38323/** 38324 * Changes the current location. 38325 * 38326 * Note: This API is mostly useful in React.Component subclasses that are not 38327 * able to use hooks. In functional components, we recommend you use the 38328 * `useNavigate` hook instead. 38329 * 38330 * @see https://reactrouter.com/components/navigate 38331 */ 38332function Navigate(_ref4) { 38333 let { 38334 to, 38335 replace, 38336 state, 38337 relative 38338 } = _ref4; 38339 !useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, // TODO: This error is probably because they somehow have 2 versions of 38340 // the router loaded. We can help them understand how to avoid that. 38341 "<Navigate> may be used only in the context of a <Router> component.") : 0 : void 0; 38342 let { 38343 future, 38344 static: isStatic 38345 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(NavigationContext); 38346 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(!isStatic, "<Navigate> must not be used on the initial render in a <StaticRouter>. " + "This is a no-op, but you should modify your code so the <Navigate> is " + "only ever rendered in response to some user interaction or state change.") : 0; 38347 let { 38348 matches 38349 } = react__WEBPACK_IMPORTED_MODULE_0__.useContext(RouteContext); 38350 let { 38351 pathname: locationPathname 38352 } = useLocation(); 38353 let navigate = useNavigate(); 38354 38355 // Resolve the path outside of the effect so that when effects run twice in 38356 // StrictMode they navigate to the same place 38357 let path = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.resolveTo)(to, (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_getResolveToMatches)(matches, future.v7_relativeSplatPath), locationPathname, relative === "path"); 38358 let jsonPath = JSON.stringify(path); 38359 react__WEBPACK_IMPORTED_MODULE_0__.useEffect(() => navigate(JSON.parse(jsonPath), { 38360 replace, 38361 state, 38362 relative 38363 }), [navigate, jsonPath, relative, replace, state]); 38364 return null; 38365} 38366/** 38367 * Renders the child route's element, if there is one. 38368 * 38369 * @see https://reactrouter.com/components/outlet 38370 */ 38371function Outlet(props) { 38372 return useOutlet(props.context); 38373} 38374/** 38375 * Declares an element that should be rendered at a certain URL path. 38376 * 38377 * @see https://reactrouter.com/components/route 38378 */ 38379function Route(_props) { 38380 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, "A <Route> is only ever to be used as the child of <Routes> element, " + "never rendered directly. Please wrap your <Route> in a <Routes>.") : 0 ; 38381} 38382/** 38383 * Provides location context for the rest of the app. 38384 * 38385 * Note: You usually won't render a `<Router>` directly. Instead, you'll render a 38386 * router that is more specific to your environment such as a `<BrowserRouter>` 38387 * in web browsers or a `<StaticRouter>` for server rendering. 38388 * 38389 * @see https://reactrouter.com/router-components/router 38390 */ 38391function Router(_ref5) { 38392 let { 38393 basename: basenameProp = "/", 38394 children = null, 38395 location: locationProp, 38396 navigationType = _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.Action.Pop, 38397 navigator, 38398 static: staticProp = false, 38399 future 38400 } = _ref5; 38401 !!useInRouterContext() ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, "You cannot render a <Router> inside another <Router>." + " You should never have more than one in your app.") : 0 : void 0; 38402 38403 // Preserve trailing slashes on basename, so we can let the user control 38404 // the enforcement of trailing slashes throughout the app 38405 let basename = basenameProp.replace(/^\/*/, "/"); 38406 let navigationContext = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => ({ 38407 basename, 38408 navigator, 38409 static: staticProp, 38410 future: _extends({ 38411 v7_relativeSplatPath: false 38412 }, future) 38413 }), [basename, future, navigator, staticProp]); 38414 if (typeof locationProp === "string") { 38415 locationProp = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.parsePath)(locationProp); 38416 } 38417 let { 38418 pathname = "/", 38419 search = "", 38420 hash = "", 38421 state = null, 38422 key = "default" 38423 } = locationProp; 38424 let locationContext = react__WEBPACK_IMPORTED_MODULE_0__.useMemo(() => { 38425 let trailingPathname = (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.stripBasename)(pathname, basename); 38426 if (trailingPathname == null) { 38427 return null; 38428 } 38429 return { 38430 location: { 38431 pathname: trailingPathname, 38432 search, 38433 hash, 38434 state, 38435 key 38436 }, 38437 navigationType 38438 }; 38439 }, [basename, pathname, search, hash, state, key, navigationType]); 38440 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(locationContext != null, "<Router basename=\"" + basename + "\"> is not able to match the URL " + ("\"" + pathname + search + hash + "\" because it does not start with the ") + "basename, so the <Router> won't render anything.") : 0; 38441 if (locationContext == null) { 38442 return null; 38443 } 38444 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(NavigationContext.Provider, { 38445 value: navigationContext 38446 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(LocationContext.Provider, { 38447 children: children, 38448 value: locationContext 38449 })); 38450} 38451/** 38452 * A container for a nested tree of `<Route>` elements that renders the branch 38453 * that best matches the current location. 38454 * 38455 * @see https://reactrouter.com/components/routes 38456 */ 38457function Routes(_ref6) { 38458 let { 38459 children, 38460 location 38461 } = _ref6; 38462 return useRoutes(createRoutesFromChildren(children), location); 38463} 38464/** 38465 * Component to use for rendering lazily loaded data from returning defer() 38466 * in a loader function 38467 */ 38468function Await(_ref7) { 38469 let { 38470 children, 38471 errorElement, 38472 resolve 38473 } = _ref7; 38474 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(AwaitErrorBoundary, { 38475 resolve: resolve, 38476 errorElement: errorElement 38477 }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(ResolveAwait, null, children)); 38478} 38479var AwaitRenderStatus = /*#__PURE__*/function (AwaitRenderStatus) { 38480 AwaitRenderStatus[AwaitRenderStatus["pending"] = 0] = "pending"; 38481 AwaitRenderStatus[AwaitRenderStatus["success"] = 1] = "success"; 38482 AwaitRenderStatus[AwaitRenderStatus["error"] = 2] = "error"; 38483 return AwaitRenderStatus; 38484}(AwaitRenderStatus || {}); 38485const neverSettledPromise = new Promise(() => {}); 38486class AwaitErrorBoundary extends react__WEBPACK_IMPORTED_MODULE_0__.Component { 38487 constructor(props) { 38488 super(props); 38489 this.state = { 38490 error: null 38491 }; 38492 } 38493 static getDerivedStateFromError(error) { 38494 return { 38495 error 38496 }; 38497 } 38498 componentDidCatch(error, errorInfo) { 38499 console.error("<Await> caught the following error during render", error, errorInfo); 38500 } 38501 render() { 38502 let { 38503 children, 38504 errorElement, 38505 resolve 38506 } = this.props; 38507 let promise = null; 38508 let status = AwaitRenderStatus.pending; 38509 if (!(resolve instanceof Promise)) { 38510 // Didn't get a promise - provide as a resolved promise 38511 status = AwaitRenderStatus.success; 38512 promise = Promise.resolve(); 38513 Object.defineProperty(promise, "_tracked", { 38514 get: () => true 38515 }); 38516 Object.defineProperty(promise, "_data", { 38517 get: () => resolve 38518 }); 38519 } else if (this.state.error) { 38520 // Caught a render error, provide it as a rejected promise 38521 status = AwaitRenderStatus.error; 38522 let renderError = this.state.error; 38523 promise = Promise.reject().catch(() => {}); // Avoid unhandled rejection warnings 38524 Object.defineProperty(promise, "_tracked", { 38525 get: () => true 38526 }); 38527 Object.defineProperty(promise, "_error", { 38528 get: () => renderError 38529 }); 38530 } else if (resolve._tracked) { 38531 // Already tracked promise - check contents 38532 promise = resolve; 38533 status = promise._error !== undefined ? AwaitRenderStatus.error : promise._data !== undefined ? AwaitRenderStatus.success : AwaitRenderStatus.pending; 38534 } else { 38535 // Raw (untracked) promise - track it 38536 status = AwaitRenderStatus.pending; 38537 Object.defineProperty(resolve, "_tracked", { 38538 get: () => true 38539 }); 38540 promise = resolve.then(data => Object.defineProperty(resolve, "_data", { 38541 get: () => data 38542 }), error => Object.defineProperty(resolve, "_error", { 38543 get: () => error 38544 })); 38545 } 38546 if (status === AwaitRenderStatus.error && promise._error instanceof _remix_run_router__WEBPACK_IMPORTED_MODULE_1__.AbortedDeferredError) { 38547 // Freeze the UI by throwing a never resolved promise 38548 throw neverSettledPromise; 38549 } 38550 if (status === AwaitRenderStatus.error && !errorElement) { 38551 // No errorElement, throw to the nearest route-level error boundary 38552 throw promise._error; 38553 } 38554 if (status === AwaitRenderStatus.error) { 38555 // Render via our errorElement 38556 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(AwaitContext.Provider, { 38557 value: promise, 38558 children: errorElement 38559 }); 38560 } 38561 if (status === AwaitRenderStatus.success) { 38562 // Render children with resolved value 38563 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(AwaitContext.Provider, { 38564 value: promise, 38565 children: children 38566 }); 38567 } 38568 38569 // Throw to the suspense boundary 38570 throw promise; 38571 } 38572} 38573 38574/** 38575 * @private 38576 * Indirection to leverage useAsyncValue for a render-prop API on `<Await>` 38577 */ 38578function ResolveAwait(_ref8) { 38579 let { 38580 children 38581 } = _ref8; 38582 let data = useAsyncValue(); 38583 let toRender = typeof children === "function" ? children(data) : children; 38584 return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(react__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, toRender); 38585} 38586 38587/////////////////////////////////////////////////////////////////////////////// 38588// UTILS 38589/////////////////////////////////////////////////////////////////////////////// 38590 38591/** 38592 * Creates a route config from a React "children" object, which is usually 38593 * either a `<Route>` element or an array of them. Used internally by 38594 * `<Routes>` to create a route config from its children. 38595 * 38596 * @see https://reactrouter.com/utils/create-routes-from-children 38597 */ 38598function createRoutesFromChildren(children, parentPath) { 38599 if (parentPath === void 0) { 38600 parentPath = []; 38601 } 38602 let routes = []; 38603 react__WEBPACK_IMPORTED_MODULE_0__.Children.forEach(children, (element, index) => { 38604 if (! /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.isValidElement(element)) { 38605 // Ignore non-elements. This allows people to more easily inline 38606 // conditionals in their route config. 38607 return; 38608 } 38609 let treePath = [...parentPath, index]; 38610 if (element.type === react__WEBPACK_IMPORTED_MODULE_0__.Fragment) { 38611 // Transparently support React.Fragment and its children. 38612 routes.push.apply(routes, createRoutesFromChildren(element.props.children, treePath)); 38613 return; 38614 } 38615 !(element.type === Route) ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, "[" + (typeof element.type === "string" ? element.type : element.type.name) + "] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>") : 0 : void 0; 38616 !(!element.props.index || !element.props.children) ? true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_invariant)(false, "An index route cannot have child routes.") : 0 : void 0; 38617 let route = { 38618 id: element.props.id || treePath.join("-"), 38619 caseSensitive: element.props.caseSensitive, 38620 element: element.props.element, 38621 Component: element.props.Component, 38622 index: element.props.index, 38623 path: element.props.path, 38624 loader: element.props.loader, 38625 action: element.props.action, 38626 errorElement: element.props.errorElement, 38627 ErrorBoundary: element.props.ErrorBoundary, 38628 hasErrorBoundary: element.props.ErrorBoundary != null || element.props.errorElement != null, 38629 shouldRevalidate: element.props.shouldRevalidate, 38630 handle: element.props.handle, 38631 lazy: element.props.lazy 38632 }; 38633 if (element.props.children) { 38634 route.children = createRoutesFromChildren(element.props.children, treePath); 38635 } 38636 routes.push(route); 38637 }); 38638 return routes; 38639} 38640 38641/** 38642 * Renders the result of `matchRoutes()` into a React element. 38643 */ 38644function renderMatches(matches) { 38645 return _renderMatches(matches); 38646} 38647 38648function mapRouteProperties(route) { 38649 let updates = { 38650 // Note: this check also occurs in createRoutesFromChildren so update 38651 // there if you change this -- please and thank you! 38652 hasErrorBoundary: route.ErrorBoundary != null || route.errorElement != null 38653 }; 38654 if (route.Component) { 38655 if (true) { 38656 if (route.element) { 38657 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(false, "You should not include both `Component` and `element` on your route - " + "`Component` will be used.") : 0; 38658 } 38659 } 38660 Object.assign(updates, { 38661 element: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(route.Component), 38662 Component: undefined 38663 }); 38664 } 38665 if (route.HydrateFallback) { 38666 if (true) { 38667 if (route.hydrateFallbackElement) { 38668 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(false, "You should not include both `HydrateFallback` and `hydrateFallbackElement` on your route - " + "`HydrateFallback` will be used.") : 0; 38669 } 38670 } 38671 Object.assign(updates, { 38672 hydrateFallbackElement: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(route.HydrateFallback), 38673 HydrateFallback: undefined 38674 }); 38675 } 38676 if (route.ErrorBoundary) { 38677 if (true) { 38678 if (route.errorElement) { 38679 true ? (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.UNSAFE_warning)(false, "You should not include both `ErrorBoundary` and `errorElement` on your route - " + "`ErrorBoundary` will be used.") : 0; 38680 } 38681 } 38682 Object.assign(updates, { 38683 errorElement: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(route.ErrorBoundary), 38684 ErrorBoundary: undefined 38685 }); 38686 } 38687 return updates; 38688} 38689function createMemoryRouter(routes, opts) { 38690 return (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.createRouter)({ 38691 basename: opts == null ? void 0 : opts.basename, 38692 future: _extends({}, opts == null ? void 0 : opts.future, { 38693 v7_prependBasename: true 38694 }), 38695 history: (0,_remix_run_router__WEBPACK_IMPORTED_MODULE_1__.createMemoryHistory)({ 38696 initialEntries: opts == null ? void 0 : opts.initialEntries, 38697 initialIndex: opts == null ? void 0 : opts.initialIndex 38698 }), 38699 hydrationData: opts == null ? void 0 : opts.hydrationData, 38700 routes, 38701 mapRouteProperties 38702 }).initialize(); 38703} 38704 38705 38706//# sourceMappingURL=index.js.map 38707 38708 38709/***/ }), 38710
vendor: 87,903 bytes, lines 38711-41461
38711/***/ "./node_modules/react/cjs/react.development.js": 38712/*!*****************************************************!*\ 38713 !*** ./node_modules/react/cjs/react.development.js ***! 38714 \*****************************************************/ 38715/***/ ((module, exports, __webpack_require__) => { 38716 38717"use strict"; 38718/* module decorator */ module = __webpack_require__.nmd(module); 38719/** 38720 * @license React 38721 * react.development.js 38722 * 38723 * Copyright (c) Facebook, Inc. and its affiliates. 38724 * 38725 * This source code is licensed under the MIT license found in the 38726 * LICENSE file in the root directory of this source tree. 38727 */ 38728 38729 38730 38731if (true) { 38732 (function() { 38733 38734 'use strict'; 38735 38736/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 38737if ( 38738 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && 38739 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart === 38740 'function' 38741) { 38742 __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error()); 38743} 38744 var ReactVersion = '18.2.0'; 38745 38746// ATTENTION 38747// When adding new symbols to this file, 38748// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols' 38749// The Symbol used to tag the ReactElement-like types. 38750var REACT_ELEMENT_TYPE = Symbol.for('react.element'); 38751var REACT_PORTAL_TYPE = Symbol.for('react.portal'); 38752var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment'); 38753var REACT_STRICT_MODE_TYPE = Symbol.for('react.strict_mode'); 38754var REACT_PROFILER_TYPE = Symbol.for('react.profiler'); 38755var REACT_PROVIDER_TYPE = Symbol.for('react.provider'); 38756var REACT_CONTEXT_TYPE = Symbol.for('react.context'); 38757var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref'); 38758var REACT_SUSPENSE_TYPE = Symbol.for('react.suspense'); 38759var REACT_SUSPENSE_LIST_TYPE = Symbol.for('react.suspense_list'); 38760var REACT_MEMO_TYPE = Symbol.for('react.memo'); 38761var REACT_LAZY_TYPE = Symbol.for('react.lazy'); 38762var REACT_OFFSCREEN_TYPE = Symbol.for('react.offscreen'); 38763var MAYBE_ITERATOR_SYMBOL = Symbol.iterator; 38764var FAUX_ITERATOR_SYMBOL = '@@iterator'; 38765function getIteratorFn(maybeIterable) { 38766 if (maybeIterable === null || typeof maybeIterable !== 'object') { 38767 return null; 38768 } 38769 38770 var maybeIterator = MAYBE_ITERATOR_SYMBOL && maybeIterable[MAYBE_ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]; 38771 38772 if (typeof maybeIterator === 'function') { 38773 return maybeIterator; 38774 } 38775 38776 return null; 38777} 38778 38779/** 38780 * Keeps track of the current dispatcher. 38781 */ 38782var ReactCurrentDispatcher = { 38783 /** 38784 * @internal 38785 * @type {ReactComponent} 38786 */ 38787 current: null 38788}; 38789 38790/** 38791 * Keeps track of the current batch's configuration such as how long an update 38792 * should suspend for if it needs to. 38793 */ 38794var ReactCurrentBatchConfig = { 38795 transition: null 38796}; 38797 38798var ReactCurrentActQueue = { 38799 current: null, 38800 // Used to reproduce behavior of `batchedUpdates` in legacy mode. 38801 isBatchingLegacy: false, 38802 didScheduleLegacyUpdate: false 38803}; 38804 38805/** 38806 * Keeps track of the current owner. 38807 * 38808 * The current owner is the component who should own any components that are 38809 * currently being constructed. 38810 */ 38811var ReactCurrentOwner = { 38812 /** 38813 * @internal 38814 * @type {ReactComponent} 38815 */ 38816 current: null 38817}; 38818 38819var ReactDebugCurrentFrame = {}; 38820var currentExtraStackFrame = null; 38821function setExtraStackFrame(stack) { 38822 { 38823 currentExtraStackFrame = stack; 38824 } 38825} 38826 38827{ 38828 ReactDebugCurrentFrame.setExtraStackFrame = function (stack) { 38829 { 38830 currentExtraStackFrame = stack; 38831 } 38832 }; // Stack implementation injected by the current renderer. 38833 38834 38835 ReactDebugCurrentFrame.getCurrentStack = null; 38836 38837 ReactDebugCurrentFrame.getStackAddendum = function () { 38838 var stack = ''; // Add an extra top frame while an element is being validated 38839 38840 if (currentExtraStackFrame) { 38841 stack += currentExtraStackFrame; 38842 } // Delegate to the injected renderer-specific implementation 38843 38844 38845 var impl = ReactDebugCurrentFrame.getCurrentStack; 38846 38847 if (impl) { 38848 stack += impl() || ''; 38849 } 38850 38851 return stack; 38852 }; 38853} 38854 38855// ----------------------------------------------------------------------------- 38856 38857var enableScopeAPI = false; // Experimental Create Event Handle API. 38858var enableCacheElement = false; 38859var enableTransitionTracing = false; // No known bugs, but needs performance testing 38860 38861var enableLegacyHidden = false; // Enables unstable_avoidThisFallback feature in Fiber 38862// stuff. Intended to enable React core members to more easily debug scheduling 38863// issues in DEV builds. 38864 38865var enableDebugTracing = false; // Track which Fiber(s) schedule render work. 38866 38867var ReactSharedInternals = { 38868 ReactCurrentDispatcher: ReactCurrentDispatcher, 38869 ReactCurrentBatchConfig: ReactCurrentBatchConfig, 38870 ReactCurrentOwner: ReactCurrentOwner 38871}; 38872 38873{ 38874 ReactSharedInternals.ReactDebugCurrentFrame = ReactDebugCurrentFrame; 38875 ReactSharedInternals.ReactCurrentActQueue = ReactCurrentActQueue; 38876} 38877 38878// by calls to these methods by a Babel plugin. 38879// 38880// In PROD (or in packages without access to React internals), 38881// they are left as they are instead. 38882 38883function warn(format) { 38884 { 38885 { 38886 for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { 38887 args[_key - 1] = arguments[_key]; 38888 } 38889 38890 printWarning('warn', format, args); 38891 } 38892 } 38893} 38894function error(format) { 38895 { 38896 { 38897 for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) { 38898 args[_key2 - 1] = arguments[_key2]; 38899 } 38900 38901 printWarning('error', format, args); 38902 } 38903 } 38904} 38905 38906function printWarning(level, format, args) { 38907 // When changing this logic, you might want to also 38908 // update consoleWithStackDev.www.js as well. 38909 { 38910 var ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame; 38911 var stack = ReactDebugCurrentFrame.getStackAddendum(); 38912 38913 if (stack !== '') { 38914 format += '%s'; 38915 args = args.concat([stack]); 38916 } // eslint-disable-next-line react-internal/safe-string-coercion 38917 38918 38919 var argsWithFormat = args.map(function (item) { 38920 return String(item); 38921 }); // Careful: RN currently depends on this prefix 38922 38923 argsWithFormat.unshift('Warning: ' + format); // We intentionally don't use spread (or .apply) directly because it 38924 // breaks IE9: https://github.com/facebook/react/issues/13610 38925 // eslint-disable-next-line react-internal/no-production-logging 38926 38927 Function.prototype.apply.call(console[level], console, argsWithFormat); 38928 } 38929} 38930 38931var didWarnStateUpdateForUnmountedComponent = {}; 38932 38933function warnNoop(publicInstance, callerName) { 38934 { 38935 var _constructor = publicInstance.constructor; 38936 var componentName = _constructor && (_constructor.displayName || _constructor.name) || 'ReactClass'; 38937 var warningKey = componentName + "." + callerName; 38938 38939 if (didWarnStateUpdateForUnmountedComponent[warningKey]) { 38940 return; 38941 } 38942 38943 error("Can't call %s on a component that is not yet mounted. " + 'This is a no-op, but it might indicate a bug in your application. ' + 'Instead, assign to `this.state` directly or define a `state = {};` ' + 'class property with the desired state in the %s component.', callerName, componentName); 38944 38945 didWarnStateUpdateForUnmountedComponent[warningKey] = true; 38946 } 38947} 38948/** 38949 * This is the abstract API for an update queue. 38950 */ 38951 38952 38953var ReactNoopUpdateQueue = { 38954 /** 38955 * Checks whether or not this composite component is mounted. 38956 * @param {ReactClass} publicInstance The instance we want to test. 38957 * @return {boolean} True if mounted, false otherwise. 38958 * @protected 38959 * @final 38960 */ 38961 isMounted: function (publicInstance) { 38962 return false; 38963 }, 38964 38965 /** 38966 * Forces an update. This should only be invoked when it is known with 38967 * certainty that we are **not** in a DOM transaction. 38968 * 38969 * You may want to call this when you know that some deeper aspect of the 38970 * component's state has changed but `setState` was not called. 38971 * 38972 * This will not invoke `shouldComponentUpdate`, but it will invoke 38973 * `componentWillUpdate` and `componentDidUpdate`. 38974 * 38975 * @param {ReactClass} publicInstance The instance that should rerender. 38976 * @param {?function} callback Called after component is updated. 38977 * @param {?string} callerName name of the calling function in the public API. 38978 * @internal 38979 */ 38980 enqueueForceUpdate: function (publicInstance, callback, callerName) { 38981 warnNoop(publicInstance, 'forceUpdate'); 38982 }, 38983 38984 /** 38985 * Replaces all of the state. Always use this or `setState` to mutate state. 38986 * You should treat `this.state` as immutable. 38987 * 38988 * There is no guarantee that `this.state` will be immediately updated, so 38989 * accessing `this.state` after calling this method may return the old value. 38990 * 38991 * @param {ReactClass} publicInstance The instance that should rerender. 38992 * @param {object} completeState Next state. 38993 * @param {?function} callback Called after component is updated. 38994 * @param {?string} callerName name of the calling function in the public API. 38995 * @internal 38996 */ 38997 enqueueReplaceState: function (publicInstance, completeState, callback, callerName) { 38998 warnNoop(publicInstance, 'replaceState'); 38999 }, 39000 39001 /** 39002 * Sets a subset of the state. This only exists because _pendingState is 39003 * internal. This provides a merging strategy that is not available to deep 39004 * properties which is confusing. TODO: Expose pendingState or don't use it 39005 * during the merge. 39006 * 39007 * @param {ReactClass} publicInstance The instance that should rerender. 39008 * @param {object} partialState Next partial state to be merged with state. 39009 * @param {?function} callback Called after component is updated. 39010 * @param {?string} Name of the calling function in the public API. 39011 * @internal 39012 */ 39013 enqueueSetState: function (publicInstance, partialState, callback, callerName) { 39014 warnNoop(publicInstance, 'setState'); 39015 } 39016}; 39017 39018var assign = Object.assign; 39019 39020var emptyObject = {}; 39021 39022{ 39023 Object.freeze(emptyObject); 39024} 39025/** 39026 * Base class helpers for the updating state of a component. 39027 */ 39028 39029 39030function Component(props, context, updater) { 39031 this.props = props; 39032 this.context = context; // If a component has string refs, we will assign a different object later. 39033 39034 this.refs = emptyObject; // We initialize the default updater but the real one gets injected by the 39035 // renderer. 39036 39037 this.updater = updater || ReactNoopUpdateQueue; 39038} 39039 39040Component.prototype.isReactComponent = {}; 39041/** 39042 * Sets a subset of the state. Always use this to mutate 39043 * state. You should treat `this.state` as immutable. 39044 * 39045 * There is no guarantee that `this.state` will be immediately updated, so 39046 * accessing `this.state` after calling this method may return the old value. 39047 * 39048 * There is no guarantee that calls to `setState` will run synchronously, 39049 * as they may eventually be batched together. You can provide an optional 39050 * callback that will be executed when the call to setState is actually 39051 * completed. 39052 * 39053 * When a function is provided to setState, it will be called at some point in 39054 * the future (not synchronously). It will be called with the up to date 39055 * component arguments (state, props, context). These values can be different 39056 * from this.* because your function may be called after receiveProps but before 39057 * shouldComponentUpdate, and this new state, props, and context will not yet be 39058 * assigned to this. 39059 * 39060 * @param {object|function} partialState Next partial state or function to 39061 * produce next partial state to be merged with current state. 39062 * @param {?function} callback Called after state is updated. 39063 * @final 39064 * @protected 39065 */ 39066 39067Component.prototype.setState = function (partialState, callback) { 39068 if (typeof partialState !== 'object' && typeof partialState !== 'function' && partialState != null) { 39069 throw new Error('setState(...): takes an object of state variables to update or a ' + 'function which returns an object of state variables.'); 39070 } 39071 39072 this.updater.enqueueSetState(this, partialState, callback, 'setState'); 39073}; 39074/** 39075 * Forces an update. This should only be invoked when it is known with 39076 * certainty that we are **not** in a DOM transaction. 39077 * 39078 * You may want to call this when you know that some deeper aspect of the 39079 * component's state has changed but `setState` was not called. 39080 * 39081 * This will not invoke `shouldComponentUpdate`, but it will invoke 39082 * `componentWillUpdate` and `componentDidUpdate`. 39083 * 39084 * @param {?function} callback Called after update is complete. 39085 * @final 39086 * @protected 39087 */ 39088 39089 39090Component.prototype.forceUpdate = function (callback) { 39091 this.updater.enqueueForceUpdate(this, callback, 'forceUpdate'); 39092}; 39093/** 39094 * Deprecated APIs. These APIs used to exist on classic React classes but since 39095 * we would like to deprecate them, we're not going to move them over to this 39096 * modern base class. Instead, we define a getter that warns if it's accessed. 39097 */ 39098 39099 39100{ 39101 var deprecatedAPIs = { 39102 isMounted: ['isMounted', 'Instead, make sure to clean up subscriptions and pending requests in ' + 'componentWillUnmount to prevent memory leaks.'], 39103 replaceState: ['replaceState', 'Refactor your code to use setState instead (see ' + 'https://github.com/facebook/react/issues/3236).'] 39104 }; 39105 39106 var defineDeprecationWarning = function (methodName, info) { 39107 Object.defineProperty(Component.prototype, methodName, { 39108 get: function () { 39109 warn('%s(...) is deprecated in plain JavaScript React classes. %s', info[0], info[1]); 39110 39111 return undefined; 39112 } 39113 }); 39114 }; 39115 39116 for (var fnName in deprecatedAPIs) { 39117 if (deprecatedAPIs.hasOwnProperty(fnName)) { 39118 defineDeprecationWarning(fnName, deprecatedAPIs[fnName]); 39119 } 39120 } 39121} 39122 39123function ComponentDummy() {} 39124 39125ComponentDummy.prototype = Component.prototype; 39126/** 39127 * Convenience component with default shallow equality check for sCU. 39128 */ 39129 39130function PureComponent(props, context, updater) { 39131 this.props = props; 39132 this.context = context; // If a component has string refs, we will assign a different object later. 39133 39134 this.refs = emptyObject; 39135 this.updater = updater || ReactNoopUpdateQueue; 39136} 39137 39138var pureComponentPrototype = PureComponent.prototype = new ComponentDummy(); 39139pureComponentPrototype.constructor = PureComponent; // Avoid an extra prototype jump for these methods. 39140 39141assign(pureComponentPrototype, Component.prototype); 39142pureComponentPrototype.isPureReactComponent = true; 39143 39144// an immutable object with a single mutable value 39145function createRef() { 39146 var refObject = { 39147 current: null 39148 }; 39149 39150 { 39151 Object.seal(refObject); 39152 } 39153 39154 return refObject; 39155} 39156 39157var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare 39158 39159function isArray(a) { 39160 return isArrayImpl(a); 39161} 39162 39163/* 39164 * The `'' + value` pattern (used in in perf-sensitive code) throws for Symbol 39165 * and Temporal.* types. See https://github.com/facebook/react/pull/22064. 39166 * 39167 * The functions in this module will throw an easier-to-understand, 39168 * easier-to-debug exception with a clear errors message message explaining the 39169 * problem. (Instead of a confusing exception thrown inside the implementation 39170 * of the `value` object). 39171 */ 39172// $FlowFixMe only called in DEV, so void return is not possible. 39173function typeName(value) { 39174 { 39175 // toStringTag is needed for namespaced types like Temporal.Instant 39176 var hasToStringTag = typeof Symbol === 'function' && Symbol.toStringTag; 39177 var type = hasToStringTag && value[Symbol.toStringTag] || value.constructor.name || 'Object'; 39178 return type; 39179 } 39180} // $FlowFixMe only called in DEV, so void return is not possible. 39181 39182 39183function willCoercionThrow(value) { 39184 { 39185 try { 39186 testStringCoercion(value); 39187 return false; 39188 } catch (e) { 39189 return true; 39190 } 39191 } 39192} 39193 39194function testStringCoercion(value) { 39195 // If you ended up here by following an exception call stack, here's what's 39196 // happened: you supplied an object or symbol value to React (as a prop, key, 39197 // DOM attribute, CSS property, string ref, etc.) and when React tried to 39198 // coerce it to a string using `'' + value`, an exception was thrown. 39199 // 39200 // The most common types that will cause this exception are `Symbol` instances 39201 // and Temporal objects like `Temporal.Instant`. But any object that has a 39202 // `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this 39203 // exception. (Library authors do this to prevent users from using built-in 39204 // numeric operators like `+` or comparison operators like `>=` because custom 39205 // methods are needed to perform accurate arithmetic or comparison.) 39206 // 39207 // To fix the problem, coerce this object or symbol value to a string before 39208 // passing it to React. The most reliable way is usually `String(value)`. 39209 // 39210 // To find which value is throwing, check the browser or debugger console. 39211 // Before this exception was thrown, there should be `console.error` output 39212 // that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the 39213 // problem and how that type was used: key, atrribute, input value prop, etc. 39214 // In most cases, this console output also shows the component and its 39215 // ancestor components where the exception happened. 39216 // 39217 // eslint-disable-next-line react-internal/safe-string-coercion 39218 return '' + value; 39219} 39220function checkKeyStringCoercion(value) { 39221 { 39222 if (willCoercionThrow(value)) { 39223 error('The provided key is an unsupported type %s.' + ' This value must be coerced to a string before before using it here.', typeName(value)); 39224 39225 return testStringCoercion(value); // throw (to help callers find troubleshooting comments) 39226 } 39227 } 39228} 39229 39230function getWrappedName(outerType, innerType, wrapperName) { 39231 var displayName = outerType.displayName; 39232 39233 if (displayName) { 39234 return displayName; 39235 } 39236 39237 var functionName = innerType.displayName || innerType.name || ''; 39238 return functionName !== '' ? wrapperName + "(" + functionName + ")" : wrapperName; 39239} // Keep in sync with react-reconciler/getComponentNameFromFiber 39240 39241 39242function getContextName(type) { 39243 return type.displayName || 'Context'; 39244} // Note that the reconciler package should generally prefer to use getComponentNameFromFiber() instead. 39245 39246 39247function getComponentNameFromType(type) { 39248 if (type == null) { 39249 // Host root, text node or just invalid type. 39250 return null; 39251 } 39252 39253 { 39254 if (typeof type.tag === 'number') { 39255 error('Received an unexpected object in getComponentNameFromType(). ' + 'This is likely a bug in React. Please file an issue.'); 39256 } 39257 } 39258 39259 if (typeof type === 'function') { 39260 return type.displayName || type.name || null; 39261 } 39262 39263 if (typeof type === 'string') { 39264 return type; 39265 } 39266 39267 switch (type) { 39268 case REACT_FRAGMENT_TYPE: 39269 return 'Fragment'; 39270 39271 case REACT_PORTAL_TYPE: 39272 return 'Portal'; 39273 39274 case REACT_PROFILER_TYPE: 39275 return 'Profiler'; 39276 39277 case REACT_STRICT_MODE_TYPE: 39278 return 'StrictMode'; 39279 39280 case REACT_SUSPENSE_TYPE: 39281 return 'Suspense'; 39282 39283 case REACT_SUSPENSE_LIST_TYPE: 39284 return 'SuspenseList'; 39285 39286 } 39287 39288 if (typeof type === 'object') { 39289 switch (type.$$typeof) { 39290 case REACT_CONTEXT_TYPE: 39291 var context = type; 39292 return getContextName(context) + '.Consumer'; 39293 39294 case REACT_PROVIDER_TYPE: 39295 var provider = type; 39296 return getContextName(provider._context) + '.Provider'; 39297 39298 case REACT_FORWARD_REF_TYPE: 39299 return getWrappedName(type, type.render, 'ForwardRef'); 39300 39301 case REACT_MEMO_TYPE: 39302 var outerName = type.displayName || null; 39303 39304 if (outerName !== null) { 39305 return outerName; 39306 } 39307 39308 return getComponentNameFromType(type.type) || 'Memo'; 39309 39310 case REACT_LAZY_TYPE: 39311 { 39312 var lazyComponent = type; 39313 var payload = lazyComponent._payload; 39314 var init = lazyComponent._init; 39315 39316 try { 39317 return getComponentNameFromType(init(payload)); 39318 } catch (x) { 39319 return null; 39320 } 39321 } 39322 39323 // eslint-disable-next-line no-fallthrough 39324 } 39325 } 39326 39327 return null; 39328} 39329 39330var hasOwnProperty = Object.prototype.hasOwnProperty; 39331 39332var RESERVED_PROPS = { 39333 key: true, 39334 ref: true, 39335 __self: true, 39336 __source: true 39337}; 39338var specialPropKeyWarningShown, specialPropRefWarningShown, didWarnAboutStringRefs; 39339 39340{ 39341 didWarnAboutStringRefs = {}; 39342} 39343 39344function hasValidRef(config) { 39345 { 39346 if (hasOwnProperty.call(config, 'ref')) { 39347 var getter = Object.getOwnPropertyDescriptor(config, 'ref').get; 39348 39349 if (getter && getter.isReactWarning) { 39350 return false; 39351 } 39352 } 39353 } 39354 39355 return config.ref !== undefined; 39356} 39357 39358function hasValidKey(config) { 39359 { 39360 if (hasOwnProperty.call(config, 'key')) { 39361 var getter = Object.getOwnPropertyDescriptor(config, 'key').get; 39362 39363 if (getter && getter.isReactWarning) { 39364 return false; 39365 } 39366 } 39367 } 39368 39369 return config.key !== undefined; 39370} 39371 39372function defineKeyPropWarningGetter(props, displayName) { 39373 var warnAboutAccessingKey = function () { 39374 { 39375 if (!specialPropKeyWarningShown) { 39376 specialPropKeyWarningShown = true; 39377 39378 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); 39379 } 39380 } 39381 }; 39382 39383 warnAboutAccessingKey.isReactWarning = true; 39384 Object.defineProperty(props, 'key', { 39385 get: warnAboutAccessingKey, 39386 configurable: true 39387 }); 39388} 39389 39390function defineRefPropWarningGetter(props, displayName) { 39391 var warnAboutAccessingRef = function () { 39392 { 39393 if (!specialPropRefWarningShown) { 39394 specialPropRefWarningShown = true; 39395 39396 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); 39397 } 39398 } 39399 }; 39400 39401 warnAboutAccessingRef.isReactWarning = true; 39402 Object.defineProperty(props, 'ref', { 39403 get: warnAboutAccessingRef, 39404 configurable: true 39405 }); 39406} 39407 39408function warnIfStringRefCannotBeAutoConverted(config) { 39409 { 39410 if (typeof config.ref === 'string' && ReactCurrentOwner.current && config.__self && ReactCurrentOwner.current.stateNode !== config.__self) { 39411 var componentName = getComponentNameFromType(ReactCurrentOwner.current.type); 39412 39413 if (!didWarnAboutStringRefs[componentName]) { 39414 error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', componentName, config.ref); 39415 39416 didWarnAboutStringRefs[componentName] = true; 39417 } 39418 } 39419 } 39420} 39421/** 39422 * Factory method to create a new React element. This no longer adheres to 39423 * the class pattern, so do not use new to call it. Also, instanceof check 39424 * will not work. Instead test $$typeof field against Symbol.for('react.element') to check 39425 * if something is a React Element. 39426 * 39427 * @param {*} type 39428 * @param {*} props 39429 * @param {*} key 39430 * @param {string|object} ref 39431 * @param {*} owner 39432 * @param {*} self A *temporary* helper to detect places where `this` is 39433 * different from the `owner` when React.createElement is called, so that we 39434 * can warn. We want to get rid of owner and replace string `ref`s with arrow 39435 * functions, and as long as `this` and owner are the same, there will be no 39436 * change in behavior. 39437 * @param {*} source An annotation object (added by a transpiler or otherwise) 39438 * indicating filename, line number, and/or other information. 39439 * @internal 39440 */ 39441 39442 39443var ReactElement = function (type, key, ref, self, source, owner, props) { 39444 var element = { 39445 // This tag allows us to uniquely identify this as a React Element 39446 $$typeof: REACT_ELEMENT_TYPE, 39447 // Built-in properties that belong on the element 39448 type: type, 39449 key: key, 39450 ref: ref, 39451 props: props, 39452 // Record the component responsible for creating this element. 39453 _owner: owner 39454 }; 39455 39456 { 39457 // The validation flag is currently mutative. We put it on 39458 // an external backing store so that we can freeze the whole object. 39459 // This can be replaced with a WeakMap once they are implemented in 39460 // commonly used development environments. 39461 element._store = {}; // To make comparing ReactElements easier for testing purposes, we make 39462 // the validation flag non-enumerable (where possible, which should 39463 // include every environment we run tests in), so the test framework 39464 // ignores it. 39465 39466 Object.defineProperty(element._store, 'validated', { 39467 configurable: false, 39468 enumerable: false, 39469 writable: true, 39470 value: false 39471 }); // self and source are DEV only properties. 39472 39473 Object.defineProperty(element, '_self', { 39474 configurable: false, 39475 enumerable: false, 39476 writable: false, 39477 value: self 39478 }); // Two elements created in two different places should be considered 39479 // equal for testing purposes and therefore we hide it from enumeration. 39480 39481 Object.defineProperty(element, '_source', { 39482 configurable: false, 39483 enumerable: false, 39484 writable: false, 39485 value: source 39486 }); 39487 39488 if (Object.freeze) { 39489 Object.freeze(element.props); 39490 Object.freeze(element); 39491 } 39492 } 39493 39494 return element; 39495}; 39496/** 39497 * Create and return a new ReactElement of the given type. 39498 * See https://reactjs.org/docs/react-api.html#createelement 39499 */ 39500 39501function createElement(type, config, children) { 39502 var propName; // Reserved names are extracted 39503 39504 var props = {}; 39505 var key = null; 39506 var ref = null; 39507 var self = null; 39508 var source = null; 39509 39510 if (config != null) { 39511 if (hasValidRef(config)) { 39512 ref = config.ref; 39513 39514 { 39515 warnIfStringRefCannotBeAutoConverted(config); 39516 } 39517 } 39518 39519 if (hasValidKey(config)) { 39520 { 39521 checkKeyStringCoercion(config.key); 39522 } 39523 39524 key = '' + config.key; 39525 } 39526 39527 self = config.__self === undefined ? null : config.__self; 39528 source = config.__source === undefined ? null : config.__source; // Remaining properties are added to a new props object 39529 39530 for (propName in config) { 39531 if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) { 39532 props[propName] = config[propName]; 39533 } 39534 } 39535 } // Children can be more than one argument, and those are transferred onto 39536 // the newly allocated props object. 39537 39538 39539 var childrenLength = arguments.length - 2; 39540 39541 if (childrenLength === 1) { 39542 props.children = children; 39543 } else if (childrenLength > 1) { 39544 var childArray = Array(childrenLength); 39545 39546 for (var i = 0; i < childrenLength; i++) { 39547 childArray[i] = arguments[i + 2]; 39548 } 39549 39550 { 39551 if (Object.freeze) { 39552 Object.freeze(childArray); 39553 } 39554 } 39555 39556 props.children = childArray; 39557 } // Resolve default props 39558 39559 39560 if (type && type.defaultProps) { 39561 var defaultProps = type.defaultProps; 39562 39563 for (propName in defaultProps) { 39564 if (props[propName] === undefined) { 39565 props[propName] = defaultProps[propName]; 39566 } 39567 } 39568 } 39569 39570 { 39571 if (key || ref) { 39572 var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type; 39573 39574 if (key) { 39575 defineKeyPropWarningGetter(props, displayName); 39576 } 39577 39578 if (ref) { 39579 defineRefPropWarningGetter(props, displayName); 39580 } 39581 } 39582 } 39583 39584 return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props); 39585} 39586function cloneAndReplaceKey(oldElement, newKey) { 39587 var newElement = ReactElement(oldElement.type, newKey, oldElement.ref, oldElement._self, oldElement._source, oldElement._owner, oldElement.props); 39588 return newElement; 39589} 39590/** 39591 * Clone and return a new ReactElement using element as the starting point. 39592 * See https://reactjs.org/docs/react-api.html#cloneelement 39593 */ 39594 39595function cloneElement(element, config, children) { 39596 if (element === null || element === undefined) { 39597 throw new Error("React.cloneElement(...): The argument must be a React element, but you passed " + element + "."); 39598 } 39599 39600 var propName; // Original props are copied 39601 39602 var props = assign({}, element.props); // Reserved names are extracted 39603 39604 var key = element.key; 39605 var ref = element.ref; // Self is preserved since the owner is preserved. 39606 39607 var self = element._self; // Source is preserved since cloneElement is unlikely to be targeted by a 39608 // transpiler, and the original source is probably a better indicator of the 39609 // true owner. 39610 39611 var source = element._source; // Owner will be preserved, unless ref is overridden 39612 39613 var owner = element._owner; 39614 39615 if (config != null) { 39616 if (hasValidRef(config)) { 39617 // Silently steal the ref from the parent. 39618 ref = config.ref; 39619 owner = ReactCurrentOwner.current; 39620 } 39621 39622 if (hasValidKey(config)) { 39623 { 39624 checkKeyStringCoercion(config.key); 39625 } 39626 39627 key = '' + config.key; 39628 } // Remaining properties override existing props 39629 39630 39631 var defaultProps; 39632 39633 if (element.type && element.type.defaultProps) { 39634 defaultProps = element.type.defaultProps; 39635 } 39636 39637 for (propName in config) { 39638 if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) { 39639 if (config[propName] === undefined && defaultProps !== undefined) { 39640 // Resolve default props 39641 props[propName] = defaultProps[propName]; 39642 } else { 39643 props[propName] = config[propName]; 39644 } 39645 } 39646 } 39647 } // Children can be more than one argument, and those are transferred onto 39648 // the newly allocated props object. 39649 39650 39651 var childrenLength = arguments.length - 2; 39652 39653 if (childrenLength === 1) { 39654 props.children = children; 39655 } else if (childrenLength > 1) { 39656 var childArray = Array(childrenLength); 39657 39658 for (var i = 0; i < childrenLength; i++) { 39659 childArray[i] = arguments[i + 2]; 39660 } 39661 39662 props.children = childArray; 39663 } 39664 39665 return ReactElement(element.type, key, ref, self, source, owner, props); 39666} 39667/** 39668 * Verifies the object is a ReactElement. 39669 * See https://reactjs.org/docs/react-api.html#isvalidelement 39670 * @param {?object} object 39671 * @return {boolean} True if `object` is a ReactElement. 39672 * @final 39673 */ 39674 39675function isValidElement(object) { 39676 return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE; 39677} 39678 39679var SEPARATOR = '.'; 39680var SUBSEPARATOR = ':'; 39681/** 39682 * Escape and wrap key so it is safe to use as a reactid 39683 * 39684 * @param {string} key to be escaped. 39685 * @return {string} the escaped key. 39686 */ 39687 39688function escape(key) { 39689 var escapeRegex = /[=:]/g; 39690 var escaperLookup = { 39691 '=': '=0', 39692 ':': '=2' 39693 }; 39694 var escapedString = key.replace(escapeRegex, function (match) { 39695 return escaperLookup[match]; 39696 }); 39697 return '$' + escapedString; 39698} 39699/** 39700 * TODO: Test that a single child and an array with one item have the same key 39701 * pattern. 39702 */ 39703 39704 39705var didWarnAboutMaps = false; 39706var userProvidedKeyEscapeRegex = /\/+/g; 39707 39708function escapeUserProvidedKey(text) { 39709 return text.replace(userProvidedKeyEscapeRegex, '$&/'); 39710} 39711/** 39712 * Generate a key string that identifies a element within a set. 39713 * 39714 * @param {*} element A element that could contain a manual key. 39715 * @param {number} index Index that is used if a manual key is not provided. 39716 * @return {string} 39717 */ 39718 39719 39720function getElementKey(element, index) { 39721 // Do some typechecking here since we call this blindly. We want to ensure 39722 // that we don't block potential future ES APIs. 39723 if (typeof element === 'object' && element !== null && element.key != null) { 39724 // Explicit key 39725 { 39726 checkKeyStringCoercion(element.key); 39727 } 39728 39729 return escape('' + element.key); 39730 } // Implicit key determined by the index in the set 39731 39732 39733 return index.toString(36); 39734} 39735 39736function mapIntoArray(children, array, escapedPrefix, nameSoFar, callback) { 39737 var type = typeof children; 39738 39739 if (type === 'undefined' || type === 'boolean') { 39740 // All of the above are perceived as null. 39741 children = null; 39742 } 39743 39744 var invokeCallback = false; 39745 39746 if (children === null) { 39747 invokeCallback = true; 39748 } else { 39749 switch (type) { 39750 case 'string': 39751 case 'number': 39752 invokeCallback = true; 39753 break; 39754 39755 case 'object': 39756 switch (children.$$typeof) { 39757 case REACT_ELEMENT_TYPE: 39758 case REACT_PORTAL_TYPE: 39759 invokeCallback = true; 39760 } 39761 39762 } 39763 } 39764 39765 if (invokeCallback) { 39766 var _child = children; 39767 var mappedChild = callback(_child); // If it's the only child, treat the name as if it was wrapped in an array 39768 // so that it's consistent if the number of children grows: 39769 39770 var childKey = nameSoFar === '' ? SEPARATOR + getElementKey(_child, 0) : nameSoFar; 39771 39772 if (isArray(mappedChild)) { 39773 var escapedChildKey = ''; 39774 39775 if (childKey != null) { 39776 escapedChildKey = escapeUserProvidedKey(childKey) + '/'; 39777 } 39778 39779 mapIntoArray(mappedChild, array, escapedChildKey, '', function (c) { 39780 return c; 39781 }); 39782 } else if (mappedChild != null) { 39783 if (isValidElement(mappedChild)) { 39784 { 39785 // The `if` statement here prevents auto-disabling of the safe 39786 // coercion ESLint rule, so we must manually disable it below. 39787 // $FlowFixMe Flow incorrectly thinks React.Portal doesn't have a key 39788 if (mappedChild.key && (!_child || _child.key !== mappedChild.key)) { 39789 checkKeyStringCoercion(mappedChild.key); 39790 } 39791 } 39792 39793 mappedChild = cloneAndReplaceKey(mappedChild, // Keep both the (mapped) and old keys if they differ, just as 39794 // traverseAllChildren used to do for objects as children 39795 escapedPrefix + ( // $FlowFixMe Flow incorrectly thinks React.Portal doesn't have a key 39796 mappedChild.key && (!_child || _child.key !== mappedChild.key) ? // $FlowFixMe Flow incorrectly thinks existing element's key can be a number 39797 // eslint-disable-next-line react-internal/safe-string-coercion 39798 escapeUserProvidedKey('' + mappedChild.key) + '/' : '') + childKey); 39799 } 39800 39801 array.push(mappedChild); 39802 } 39803 39804 return 1; 39805 } 39806 39807 var child; 39808 var nextName; 39809 var subtreeCount = 0; // Count of children found in the current subtree. 39810 39811 var nextNamePrefix = nameSoFar === '' ? SEPARATOR : nameSoFar + SUBSEPARATOR; 39812 39813 if (isArray(children)) { 39814 for (var i = 0; i < children.length; i++) { 39815 child = children[i]; 39816 nextName = nextNamePrefix + getElementKey(child, i); 39817 subtreeCount += mapIntoArray(child, array, escapedPrefix, nextName, callback); 39818 } 39819 } else { 39820 var iteratorFn = getIteratorFn(children); 39821 39822 if (typeof iteratorFn === 'function') { 39823 var iterableChildren = children; 39824 39825 { 39826 // Warn about using Maps as children 39827 if (iteratorFn === iterableChildren.entries) { 39828 if (!didWarnAboutMaps) { 39829 warn('Using Maps as children is not supported. ' + 'Use an array of keyed ReactElements instead.'); 39830 } 39831 39832 didWarnAboutMaps = true; 39833 } 39834 } 39835 39836 var iterator = iteratorFn.call(iterableChildren); 39837 var step; 39838 var ii = 0; 39839 39840 while (!(step = iterator.next()).done) { 39841 child = step.value; 39842 nextName = nextNamePrefix + getElementKey(child, ii++); 39843 subtreeCount += mapIntoArray(child, array, escapedPrefix, nextName, callback); 39844 } 39845 } else if (type === 'object') { 39846 // eslint-disable-next-line react-internal/safe-string-coercion 39847 var childrenString = String(children); 39848 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.'); 39849 } 39850 } 39851 39852 return subtreeCount; 39853} 39854 39855/** 39856 * Maps children that are typically specified as `props.children`. 39857 * 39858 * See https://reactjs.org/docs/react-api.html#reactchildrenmap 39859 * 39860 * The provided mapFunction(child, index) will be called for each 39861 * leaf child. 39862 * 39863 * @param {?*} children Children tree container. 39864 * @param {function(*, int)} func The map function. 39865 * @param {*} context Context for mapFunction. 39866 * @return {object} Object containing the ordered map of results. 39867 */ 39868function mapChildren(children, func, context) { 39869 if (children == null) { 39870 return children; 39871 } 39872 39873 var result = []; 39874 var count = 0; 39875 mapIntoArray(children, result, '', '', function (child) { 39876 return func.call(context, child, count++); 39877 }); 39878 return result; 39879} 39880/** 39881 * Count the number of children that are typically specified as 39882 * `props.children`. 39883 * 39884 * See https://reactjs.org/docs/react-api.html#reactchildrencount 39885 * 39886 * @param {?*} children Children tree container. 39887 * @return {number} The number of children. 39888 */ 39889 39890 39891function countChildren(children) { 39892 var n = 0; 39893 mapChildren(children, function () { 39894 n++; // Don't return anything 39895 }); 39896 return n; 39897} 39898 39899/** 39900 * Iterates through children that are typically specified as `props.children`. 39901 * 39902 * See https://reactjs.org/docs/react-api.html#reactchildrenforeach 39903 * 39904 * The provided forEachFunc(child, index) will be called for each 39905 * leaf child. 39906 * 39907 * @param {?*} children Children tree container. 39908 * @param {function(*, int)} forEachFunc 39909 * @param {*} forEachContext Context for forEachContext. 39910 */ 39911function forEachChildren(children, forEachFunc, forEachContext) { 39912 mapChildren(children, function () { 39913 forEachFunc.apply(this, arguments); // Don't return anything. 39914 }, forEachContext); 39915} 39916/** 39917 * Flatten a children object (typically specified as `props.children`) and 39918 * return an array with appropriately re-keyed children. 39919 * 39920 * See https://reactjs.org/docs/react-api.html#reactchildrentoarray 39921 */ 39922 39923 39924function toArray(children) { 39925 return mapChildren(children, function (child) { 39926 return child; 39927 }) || []; 39928} 39929/** 39930 * Returns the first child in a collection of children and verifies that there 39931 * is only one child in the collection. 39932 * 39933 * See https://reactjs.org/docs/react-api.html#reactchildrenonly 39934 * 39935 * The current implementation of this function assumes that a single child gets 39936 * passed without a wrapper, but the purpose of this helper function is to 39937 * abstract away the particular structure of children. 39938 * 39939 * @param {?object} children Child collection structure. 39940 * @return {ReactElement} The first and only `ReactElement` contained in the 39941 * structure. 39942 */ 39943 39944 39945function onlyChild(children) { 39946 if (!isValidElement(children)) { 39947 throw new Error('React.Children.only expected to receive a single React element child.'); 39948 } 39949 39950 return children; 39951} 39952 39953function createContext(defaultValue) { 39954 // TODO: Second argument used to be an optional `calculateChangedBits` 39955 // function. Warn to reserve for future use? 39956 var context = { 39957 $$typeof: REACT_CONTEXT_TYPE, 39958 // As a workaround to support multiple concurrent renderers, we categorize 39959 // some renderers as primary and others as secondary. We only expect 39960 // there to be two concurrent renderers at most: React Native (primary) and 39961 // Fabric (secondary); React DOM (primary) and React ART (secondary). 39962 // Secondary renderers store their context values on separate fields. 39963 _currentValue: defaultValue, 39964 _currentValue2: defaultValue, 39965 // Used to track how many concurrent renderers this context currently 39966 // supports within in a single renderer. Such as parallel server rendering. 39967 _threadCount: 0, 39968 // These are circular 39969 Provider: null, 39970 Consumer: null, 39971 // Add these to use same hidden class in VM as ServerContext 39972 _defaultValue: null, 39973 _globalName: null 39974 }; 39975 context.Provider = { 39976 $$typeof: REACT_PROVIDER_TYPE, 39977 _context: context 39978 }; 39979 var hasWarnedAboutUsingNestedContextConsumers = false; 39980 var hasWarnedAboutUsingConsumerProvider = false; 39981 var hasWarnedAboutDisplayNameOnConsumer = false; 39982 39983 { 39984 // A separate object, but proxies back to the original context object for 39985 // backwards compatibility. It has a different $$typeof, so we can properly 39986 // warn for the incorrect usage of Context as a Consumer. 39987 var Consumer = { 39988 $$typeof: REACT_CONTEXT_TYPE, 39989 _context: context 39990 }; // $FlowFixMe: Flow complains about not setting a value, which is intentional here 39991 39992 Object.defineProperties(Consumer, { 39993 Provider: { 39994 get: function () { 39995 if (!hasWarnedAboutUsingConsumerProvider) { 39996 hasWarnedAboutUsingConsumerProvider = true; 39997 39998 error('Rendering <Context.Consumer.Provider> is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Provider> instead?'); 39999 } 40000 40001 return context.Provider; 40002 }, 40003 set: function (_Provider) { 40004 context.Provider = _Provider; 40005 } 40006 }, 40007 _currentValue: { 40008 get: function () { 40009 return context._currentValue; 40010 }, 40011 set: function (_currentValue) { 40012 context._currentValue = _currentValue; 40013 } 40014 }, 40015 _currentValue2: { 40016 get: function () { 40017 return context._currentValue2; 40018 }, 40019 set: function (_currentValue2) { 40020 context._currentValue2 = _currentValue2; 40021 } 40022 }, 40023 _threadCount: { 40024 get: function () { 40025 return context._threadCount; 40026 }, 40027 set: function (_threadCount) { 40028 context._threadCount = _threadCount; 40029 } 40030 }, 40031 Consumer: { 40032 get: function () { 40033 if (!hasWarnedAboutUsingNestedContextConsumers) { 40034 hasWarnedAboutUsingNestedContextConsumers = true; 40035 40036 error('Rendering <Context.Consumer.Consumer> is not supported and will be removed in ' + 'a future major release. Did you mean to render <Context.Consumer> instead?'); 40037 } 40038 40039 return context.Consumer; 40040 } 40041 }, 40042 displayName: { 40043 get: function () { 40044 return context.displayName; 40045 }, 40046 set: function (displayName) { 40047 if (!hasWarnedAboutDisplayNameOnConsumer) { 40048 warn('Setting `displayName` on Context.Consumer has no effect. ' + "You should set it directly on the context with Context.displayName = '%s'.", displayName); 40049 40050 hasWarnedAboutDisplayNameOnConsumer = true; 40051 } 40052 } 40053 } 40054 }); // $FlowFixMe: Flow complains about missing properties because it doesn't understand defineProperty 40055 40056 context.Consumer = Consumer; 40057 } 40058 40059 { 40060 context._currentRenderer = null; 40061 context._currentRenderer2 = null; 40062 } 40063 40064 return context; 40065} 40066 40067var Uninitialized = -1; 40068var Pending = 0; 40069var Resolved = 1; 40070var Rejected = 2; 40071 40072function lazyInitializer(payload) { 40073 if (payload._status === Uninitialized) { 40074 var ctor = payload._result; 40075 var thenable = ctor(); // Transition to the next state. 40076 // This might throw either because it's missing or throws. If so, we treat it 40077 // as still uninitialized and try again next time. Which is the same as what 40078 // happens if the ctor or any wrappers processing the ctor throws. This might 40079 // end up fixing it if the resolution was a concurrency bug. 40080 40081 thenable.then(function (moduleObject) { 40082 if (payload._status === Pending || payload._status === Uninitialized) { 40083 // Transition to the next state. 40084 var resolved = payload; 40085 resolved._status = Resolved; 40086 resolved._result = moduleObject; 40087 } 40088 }, function (error) { 40089 if (payload._status === Pending || payload._status === Uninitialized) { 40090 // Transition to the next state. 40091 var rejected = payload; 40092 rejected._status = Rejected; 40093 rejected._result = error; 40094 } 40095 }); 40096 40097 if (payload._status === Uninitialized) { 40098 // In case, we're still uninitialized, then we're waiting for the thenable 40099 // to resolve. Set it as pending in the meantime. 40100 var pending = payload; 40101 pending._status = Pending; 40102 pending._result = thenable; 40103 } 40104 } 40105 40106 if (payload._status === Resolved) { 40107 var moduleObject = payload._result; 40108 40109 { 40110 if (moduleObject === undefined) { 40111 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. 40112 'const MyComponent = lazy(() => imp' + "ort('./MyComponent'))\n\n" + 'Did you accidentally put curly braces around the import?', moduleObject); 40113 } 40114 } 40115 40116 { 40117 if (!('default' in moduleObject)) { 40118 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. 40119 'const MyComponent = lazy(() => imp' + "ort('./MyComponent'))", moduleObject); 40120 } 40121 } 40122 40123 return moduleObject.default; 40124 } else { 40125 throw payload._result; 40126 } 40127} 40128 40129function lazy(ctor) { 40130 var payload = { 40131 // We use these fields to store the result. 40132 _status: Uninitialized, 40133 _result: ctor 40134 }; 40135 var lazyType = { 40136 $$typeof: REACT_LAZY_TYPE, 40137 _payload: payload, 40138 _init: lazyInitializer 40139 }; 40140 40141 { 40142 // In production, this would just set it on the object. 40143 var defaultProps; 40144 var propTypes; // $FlowFixMe 40145 40146 Object.defineProperties(lazyType, { 40147 defaultProps: { 40148 configurable: true, 40149 get: function () { 40150 return defaultProps; 40151 }, 40152 set: function (newDefaultProps) { 40153 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.'); 40154 40155 defaultProps = newDefaultProps; // Match production behavior more closely: 40156 // $FlowFixMe 40157 40158 Object.defineProperty(lazyType, 'defaultProps', { 40159 enumerable: true 40160 }); 40161 } 40162 }, 40163 propTypes: { 40164 configurable: true, 40165 get: function () { 40166 return propTypes; 40167 }, 40168 set: function (newPropTypes) { 40169 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.'); 40170 40171 propTypes = newPropTypes; // Match production behavior more closely: 40172 // $FlowFixMe 40173 40174 Object.defineProperty(lazyType, 'propTypes', { 40175 enumerable: true 40176 }); 40177 } 40178 } 40179 }); 40180 } 40181 40182 return lazyType; 40183} 40184 40185function forwardRef(render) { 40186 { 40187 if (render != null && render.$$typeof === REACT_MEMO_TYPE) { 40188 error('forwardRef requires a render function but received a `memo` ' + 'component. Instead of forwardRef(memo(...)), use ' + 'memo(forwardRef(...)).'); 40189 } else if (typeof render !== 'function') { 40190 error('forwardRef requires a render function but was given %s.', render === null ? 'null' : typeof render); 40191 } else { 40192 if (render.length !== 0 && render.length !== 2) { 40193 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.'); 40194 } 40195 } 40196 40197 if (render != null) { 40198 if (render.defaultProps != null || render.propTypes != null) { 40199 error('forwardRef render functions do not support propTypes or defaultProps. ' + 'Did you accidentally pass a React component?'); 40200 } 40201 } 40202 } 40203 40204 var elementType = { 40205 $$typeof: REACT_FORWARD_REF_TYPE, 40206 render: render 40207 }; 40208 40209 { 40210 var ownName; 40211 Object.defineProperty(elementType, 'displayName', { 40212 enumerable: false, 40213 configurable: true, 40214 get: function () { 40215 return ownName; 40216 }, 40217 set: function (name) { 40218 ownName = name; // The inner component shouldn't inherit this display name in most cases, 40219 // because the component may be used elsewhere. 40220 // But it's nice for anonymous functions to inherit the name, 40221 // so that our component-stack generation logic will display their frames. 40222 // An anonymous function generally suggests a pattern like: 40223 // React.forwardRef((props, ref) => {...}); 40224 // This kind of inner function is not used elsewhere so the side effect is okay. 40225 40226 if (!render.name && !render.displayName) { 40227 render.displayName = name; 40228 } 40229 } 40230 }); 40231 } 40232 40233 return elementType; 40234} 40235 40236var REACT_MODULE_REFERENCE; 40237 40238{ 40239 REACT_MODULE_REFERENCE = Symbol.for('react.module.reference'); 40240} 40241 40242function isValidElementType(type) { 40243 if (typeof type === 'string' || typeof type === 'function') { 40244 return true; 40245 } // Note: typeof might be other than 'symbol' or 'number' (e.g. if it's a polyfill). 40246 40247 40248 if (type === REACT_FRAGMENT_TYPE || type === REACT_PROFILER_TYPE || enableDebugTracing || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || enableLegacyHidden || type === REACT_OFFSCREEN_TYPE || enableScopeAPI || enableCacheElement || enableTransitionTracing ) { 40249 return true; 40250 } 40251 40252 if (typeof type === 'object' && type !== null) { 40253 if (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || // This needs to include all possible module reference object 40254 // types supported by any Flight configuration anywhere since 40255 // we don't know which Flight build this will end up being used 40256 // with. 40257 type.$$typeof === REACT_MODULE_REFERENCE || type.getModuleId !== undefined) { 40258 return true; 40259 } 40260 } 40261 40262 return false; 40263} 40264 40265function memo(type, compare) { 40266 { 40267 if (!isValidElementType(type)) { 40268 error('memo: The first argument must be a component. Instead ' + 'received: %s', type === null ? 'null' : typeof type); 40269 } 40270 } 40271 40272 var elementType = { 40273 $$typeof: REACT_MEMO_TYPE, 40274 type: type, 40275 compare: compare === undefined ? null : compare 40276 }; 40277 40278 { 40279 var ownName; 40280 Object.defineProperty(elementType, 'displayName', { 40281 enumerable: false, 40282 configurable: true, 40283 get: function () { 40284 return ownName; 40285 }, 40286 set: function (name) { 40287 ownName = name; // The inner component shouldn't inherit this display name in most cases, 40288 // because the component may be used elsewhere. 40289 // But it's nice for anonymous functions to inherit the name, 40290 // so that our component-stack generation logic will display their frames. 40291 // An anonymous function generally suggests a pattern like: 40292 // React.memo((props) => {...}); 40293 // This kind of inner function is not used elsewhere so the side effect is okay. 40294 40295 if (!type.name && !type.displayName) { 40296 type.displayName = name; 40297 } 40298 } 40299 }); 40300 } 40301 40302 return elementType; 40303} 40304 40305function resolveDispatcher() { 40306 var dispatcher = ReactCurrentDispatcher.current; 40307 40308 { 40309 if (dispatcher === null) { 40310 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.'); 40311 } 40312 } // Will result in a null access error if accessed outside render phase. We 40313 // intentionally don't throw our own error because this is in a hot path. 40314 // Also helps ensure this is inlined. 40315 40316 40317 return dispatcher; 40318} 40319function useContext(Context) { 40320 var dispatcher = resolveDispatcher(); 40321 40322 { 40323 // TODO: add a more generic warning for invalid values. 40324 if (Context._context !== undefined) { 40325 var realContext = Context._context; // Don't deduplicate because this legitimately causes bugs 40326 // and nobody should be using this in existing code. 40327 40328 if (realContext.Consumer === Context) { 40329 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?'); 40330 } else if (realContext.Provider === Context) { 40331 error('Calling useContext(Context.Provider) is not supported. ' + 'Did you mean to call useContext(Context) instead?'); 40332 } 40333 } 40334 } 40335 40336 return dispatcher.useContext(Context); 40337} 40338function useState(initialState) { 40339 var dispatcher = resolveDispatcher(); 40340 return dispatcher.useState(initialState); 40341} 40342function useReducer(reducer, initialArg, init) { 40343 var dispatcher = resolveDispatcher(); 40344 return dispatcher.useReducer(reducer, initialArg, init); 40345} 40346function useRef(initialValue) { 40347 var dispatcher = resolveDispatcher(); 40348 return dispatcher.useRef(initialValue); 40349} 40350function useEffect(create, deps) { 40351 var dispatcher = resolveDispatcher(); 40352 return dispatcher.useEffect(create, deps); 40353} 40354function useInsertionEffect(create, deps) { 40355 var dispatcher = resolveDispatcher(); 40356 return dispatcher.useInsertionEffect(create, deps); 40357} 40358function useLayoutEffect(create, deps) { 40359 var dispatcher = resolveDispatcher(); 40360 return dispatcher.useLayoutEffect(create, deps); 40361} 40362function useCallback(callback, deps) { 40363 var dispatcher = resolveDispatcher(); 40364 return dispatcher.useCallback(callback, deps); 40365} 40366function useMemo(create, deps) { 40367 var dispatcher = resolveDispatcher(); 40368 return dispatcher.useMemo(create, deps); 40369} 40370function useImperativeHandle(ref, create, deps) { 40371 var dispatcher = resolveDispatcher(); 40372 return dispatcher.useImperativeHandle(ref, create, deps); 40373} 40374function useDebugValue(value, formatterFn) { 40375 { 40376 var dispatcher = resolveDispatcher(); 40377 return dispatcher.useDebugValue(value, formatterFn); 40378 } 40379} 40380function useTransition() { 40381 var dispatcher = resolveDispatcher(); 40382 return dispatcher.useTransition(); 40383} 40384function useDeferredValue(value) { 40385 var dispatcher = resolveDispatcher(); 40386 return dispatcher.useDeferredValue(value); 40387} 40388function useId() { 40389 var dispatcher = resolveDispatcher(); 40390 return dispatcher.useId(); 40391} 40392function useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot) { 40393 var dispatcher = resolveDispatcher(); 40394 return dispatcher.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot); 40395} 40396 40397// Helpers to patch console.logs to avoid logging during side-effect free 40398// replaying on render function. This currently only patches the object 40399// lazily which won't cover if the log function was extracted eagerly. 40400// We could also eagerly patch the method. 40401var disabledDepth = 0; 40402var prevLog; 40403var prevInfo; 40404var prevWarn; 40405var prevError; 40406var prevGroup; 40407var prevGroupCollapsed; 40408var prevGroupEnd; 40409 40410function disabledLog() {} 40411 40412disabledLog.__reactDisabledLog = true; 40413function disableLogs() { 40414 { 40415 if (disabledDepth === 0) { 40416 /* eslint-disable react-internal/no-production-logging */ 40417 prevLog = console.log; 40418 prevInfo = console.info; 40419 prevWarn = console.warn; 40420 prevError = console.error; 40421 prevGroup = console.group; 40422 prevGroupCollapsed = console.groupCollapsed; 40423 prevGroupEnd = console.groupEnd; // https://github.com/facebook/react/issues/19099 40424 40425 var props = { 40426 configurable: true, 40427 enumerable: true, 40428 value: disabledLog, 40429 writable: true 40430 }; // $FlowFixMe Flow thinks console is immutable. 40431 40432 Object.defineProperties(console, { 40433 info: props, 40434 log: props, 40435 warn: props, 40436 error: props, 40437 group: props, 40438 groupCollapsed: props, 40439 groupEnd: props 40440 }); 40441 /* eslint-enable react-internal/no-production-logging */ 40442 } 40443 40444 disabledDepth++; 40445 } 40446} 40447function reenableLogs() { 40448 { 40449 disabledDepth--; 40450 40451 if (disabledDepth === 0) { 40452 /* eslint-disable react-internal/no-production-logging */ 40453 var props = { 40454 configurable: true, 40455 enumerable: true, 40456 writable: true 40457 }; // $FlowFixMe Flow thinks console is immutable. 40458 40459 Object.defineProperties(console, { 40460 log: assign({}, props, { 40461 value: prevLog 40462 }), 40463 info: assign({}, props, { 40464 value: prevInfo 40465 }), 40466 warn: assign({}, props, { 40467 value: prevWarn 40468 }), 40469 error: assign({}, props, { 40470 value: prevError 40471 }), 40472 group: assign({}, props, { 40473 value: prevGroup 40474 }), 40475 groupCollapsed: assign({}, props, { 40476 value: prevGroupCollapsed 40477 }), 40478 groupEnd: assign({}, props, { 40479 value: prevGroupEnd 40480 }) 40481 }); 40482 /* eslint-enable react-internal/no-production-logging */ 40483 } 40484 40485 if (disabledDepth < 0) { 40486 error('disabledDepth fell below zero. ' + 'This is a bug in React. Please file an issue.'); 40487 } 40488 } 40489} 40490 40491var ReactCurrentDispatcher$1 = ReactSharedInternals.ReactCurrentDispatcher; 40492var prefix; 40493function describeBuiltInComponentFrame(name, source, ownerFn) { 40494 { 40495 if (prefix === undefined) { 40496 // Extract the VM specific prefix used by each line. 40497 try { 40498 throw Error(); 40499 } catch (x) { 40500 var match = x.stack.trim().match(/\n( *(at )?)/); 40501 prefix = match && match[1] || ''; 40502 } 40503 } // We use the prefix to ensure our stacks line up with native stack frames. 40504 40505 40506 return '\n' + prefix + name; 40507 } 40508} 40509var reentry = false; 40510var componentFrameCache; 40511 40512{ 40513 var PossiblyWeakMap = typeof WeakMap === 'function' ? WeakMap : Map; 40514 componentFrameCache = new PossiblyWeakMap(); 40515} 40516 40517function describeNativeComponentFrame(fn, construct) { 40518 // If something asked for a stack inside a fake render, it should get ignored. 40519 if ( !fn || reentry) { 40520 return ''; 40521 } 40522 40523 { 40524 var frame = componentFrameCache.get(fn); 40525 40526 if (frame !== undefined) { 40527 return frame; 40528 } 40529 } 40530 40531 var control; 40532 reentry = true; 40533 var previousPrepareStackTrace = Error.prepareStackTrace; // $FlowFixMe It does accept undefined. 40534 40535 Error.prepareStackTrace = undefined; 40536 var previousDispatcher; 40537 40538 { 40539 previousDispatcher = ReactCurrentDispatcher$1.current; // Set the dispatcher in DEV because this might be call in the render function 40540 // for warnings. 40541 40542 ReactCurrentDispatcher$1.current = null; 40543 disableLogs(); 40544 } 40545 40546 try { 40547 // This should throw. 40548 if (construct) { 40549 // Something should be setting the props in the constructor. 40550 var Fake = function () { 40551 throw Error(); 40552 }; // $FlowFixMe 40553 40554 40555 Object.defineProperty(Fake.prototype, 'props', { 40556 set: function () { 40557 // We use a throwing setter instead of frozen or non-writable props 40558 // because that won't throw in a non-strict mode function. 40559 throw Error(); 40560 } 40561 }); 40562 40563 if (typeof Reflect === 'object' && Reflect.construct) { 40564 // We construct a different control for this case to include any extra 40565 // frames added by the construct call. 40566 try { 40567 Reflect.construct(Fake, []); 40568 } catch (x) { 40569 control = x; 40570 } 40571 40572 Reflect.construct(fn, [], Fake); 40573 } else { 40574 try { 40575 Fake.call(); 40576 } catch (x) { 40577 control = x; 40578 } 40579 40580 fn.call(Fake.prototype); 40581 } 40582 } else { 40583 try { 40584 throw Error(); 40585 } catch (x) { 40586 control = x; 40587 } 40588 40589 fn(); 40590 } 40591 } catch (sample) { 40592 // This is inlined manually because closure doesn't do it for us. 40593 if (sample && control && typeof sample.stack === 'string') { 40594 // This extracts the first frame from the sample that isn't also in the control. 40595 // Skipping one frame that we assume is the frame that calls the two. 40596 var sampleLines = sample.stack.split('\n'); 40597 var controlLines = control.stack.split('\n'); 40598 var s = sampleLines.length - 1; 40599 var c = controlLines.length - 1; 40600 40601 while (s >= 1 && c >= 0 && sampleLines[s] !== controlLines[c]) { 40602 // We expect at least one stack frame to be shared. 40603 // Typically this will be the root most one. However, stack frames may be 40604 // cut off due to maximum stack limits. In this case, one maybe cut off 40605 // earlier than the other. We assume that the sample is longer or the same 40606 // and there for cut off earlier. So we should find the root most frame in 40607 // the sample somewhere in the control. 40608 c--; 40609 } 40610 40611 for (; s >= 1 && c >= 0; s--, c--) { 40612 // Next we find the first one that isn't the same which should be the 40613 // frame that called our sample function and the control. 40614 if (sampleLines[s] !== controlLines[c]) { 40615 // In V8, the first line is describing the message but other VMs don't. 40616 // If we're about to return the first line, and the control is also on the same 40617 // line, that's a pretty good indicator that our sample threw at same line as 40618 // the control. I.e. before we entered the sample frame. So we ignore this result. 40619 // This can happen if you passed a class to function component, or non-function. 40620 if (s !== 1 || c !== 1) { 40621 do { 40622 s--; 40623 c--; // We may still have similar intermediate frames from the construct call. 40624 // The next one that isn't the same should be our match though. 40625 40626 if (c < 0 || sampleLines[s] !== controlLines[c]) { 40627 // V8 adds a "new" prefix for native classes. Let's remove it to make it prettier. 40628 var _frame = '\n' + sampleLines[s].replace(' at new ', ' at '); // If our component frame is labeled "<anonymous>" 40629 // but we have a user-provided "displayName" 40630 // splice it in to make the stack more readable. 40631 40632 40633 if (fn.displayName && _frame.includes('<anonymous>')) { 40634 _frame = _frame.replace('<anonymous>', fn.displayName); 40635 } 40636 40637 { 40638 if (typeof fn === 'function') { 40639 componentFrameCache.set(fn, _frame); 40640 } 40641 } // Return the line we found. 40642 40643 40644 return _frame; 40645 } 40646 } while (s >= 1 && c >= 0); 40647 } 40648 40649 break; 40650 } 40651 } 40652 } 40653 } finally { 40654 reentry = false; 40655 40656 { 40657 ReactCurrentDispatcher$1.current = previousDispatcher; 40658 reenableLogs(); 40659 } 40660 40661 Error.prepareStackTrace = previousPrepareStackTrace; 40662 } // Fallback to just using the name if we couldn't make it throw. 40663 40664 40665 var name = fn ? fn.displayName || fn.name : ''; 40666 var syntheticFrame = name ? describeBuiltInComponentFrame(name) : ''; 40667 40668 { 40669 if (typeof fn === 'function') { 40670 componentFrameCache.set(fn, syntheticFrame); 40671 } 40672 } 40673 40674 return syntheticFrame; 40675} 40676function describeFunctionComponentFrame(fn, source, ownerFn) { 40677 { 40678 return describeNativeComponentFrame(fn, false); 40679 } 40680} 40681 40682function shouldConstruct(Component) { 40683 var prototype = Component.prototype; 40684 return !!(prototype && prototype.isReactComponent); 40685} 40686 40687function describeUnknownElementTypeFrameInDEV(type, source, ownerFn) { 40688 40689 if (type == null) { 40690 return ''; 40691 } 40692 40693 if (typeof type === 'function') { 40694 { 40695 return describeNativeComponentFrame(type, shouldConstruct(type)); 40696 } 40697 } 40698 40699 if (typeof type === 'string') { 40700 return describeBuiltInComponentFrame(type); 40701 } 40702 40703 switch (type) { 40704 case REACT_SUSPENSE_TYPE: 40705 return describeBuiltInComponentFrame('Suspense'); 40706 40707 case REACT_SUSPENSE_LIST_TYPE: 40708 return describeBuiltInComponentFrame('SuspenseList'); 40709 } 40710 40711 if (typeof type === 'object') { 40712 switch (type.$$typeof) { 40713 case REACT_FORWARD_REF_TYPE: 40714 return describeFunctionComponentFrame(type.render); 40715 40716 case REACT_MEMO_TYPE: 40717 // Memo may contain any component type so we recursively resolve it. 40718 return describeUnknownElementTypeFrameInDEV(type.type, source, ownerFn); 40719 40720 case REACT_LAZY_TYPE: 40721 { 40722 var lazyComponent = type; 40723 var payload = lazyComponent._payload; 40724 var init = lazyComponent._init; 40725 40726 try { 40727 // Lazy may contain any component type so we recursively resolve it. 40728 return describeUnknownElementTypeFrameInDEV(init(payload), source, ownerFn); 40729 } catch (x) {} 40730 } 40731 } 40732 } 40733 40734 return ''; 40735} 40736 40737var loggedTypeFailures = {}; 40738var ReactDebugCurrentFrame$1 = ReactSharedInternals.ReactDebugCurrentFrame; 40739 40740function setCurrentlyValidatingElement(element) { 40741 { 40742 if (element) { 40743 var owner = element._owner; 40744 var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null); 40745 ReactDebugCurrentFrame$1.setExtraStackFrame(stack); 40746 } else { 40747 ReactDebugCurrentFrame$1.setExtraStackFrame(null); 40748 } 40749 } 40750} 40751 40752function checkPropTypes(typeSpecs, values, location, componentName, element) { 40753 { 40754 // $FlowFixMe This is okay but Flow doesn't know it. 40755 var has = Function.call.bind(hasOwnProperty); 40756 40757 for (var typeSpecName in typeSpecs) { 40758 if (has(typeSpecs, typeSpecName)) { 40759 var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to 40760 // fail the render phase where it didn't fail before. So we log it. 40761 // After these have been cleaned up, we'll let them throw. 40762 40763 try { 40764 // This is intentionally an invariant that gets caught. It's the same 40765 // behavior as without this statement except with a better message. 40766 if (typeof typeSpecs[typeSpecName] !== 'function') { 40767 // eslint-disable-next-line react-internal/prod-error-codes 40768 var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.'); 40769 err.name = 'Invariant Violation'; 40770 throw err; 40771 } 40772 40773 error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED'); 40774 } catch (ex) { 40775 error$1 = ex; 40776 } 40777 40778 if (error$1 && !(error$1 instanceof Error)) { 40779 setCurrentlyValidatingElement(element); 40780 40781 error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1); 40782 40783 setCurrentlyValidatingElement(null); 40784 } 40785 40786 if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) { 40787 // Only monitor this failure once because there tends to be a lot of the 40788 // same error. 40789 loggedTypeFailures[error$1.message] = true; 40790 setCurrentlyValidatingElement(element); 40791 40792 error('Failed %s type: %s', location, error$1.message); 40793 40794 setCurrentlyValidatingElement(null); 40795 } 40796 } 40797 } 40798 } 40799} 40800 40801function setCurrentlyValidatingElement$1(element) { 40802 { 40803 if (element) { 40804 var owner = element._owner; 40805 var stack = describeUnknownElementTypeFrameInDEV(element.type, element._source, owner ? owner.type : null); 40806 setExtraStackFrame(stack); 40807 } else { 40808 setExtraStackFrame(null); 40809 } 40810 } 40811} 40812 40813var propTypesMisspellWarningShown; 40814 40815{ 40816 propTypesMisspellWarningShown = false; 40817} 40818 40819function getDeclarationErrorAddendum() { 40820 if (ReactCurrentOwner.current) { 40821 var name = getComponentNameFromType(ReactCurrentOwner.current.type); 40822 40823 if (name) { 40824 return '\n\nCheck the render method of `' + name + '`.'; 40825 } 40826 } 40827 40828 return ''; 40829} 40830 40831function getSourceInfoErrorAddendum(source) { 40832 if (source !== undefined) { 40833 var fileName = source.fileName.replace(/^.*[\\\/]/, ''); 40834 var lineNumber = source.lineNumber; 40835 return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.'; 40836 } 40837 40838 return ''; 40839} 40840 40841function getSourceInfoErrorAddendumForProps(elementProps) { 40842 if (elementProps !== null && elementProps !== undefined) { 40843 return getSourceInfoErrorAddendum(elementProps.__source); 40844 } 40845 40846 return ''; 40847} 40848/** 40849 * Warn if there's no key explicitly set on dynamic arrays of children or 40850 * object keys are not valid. This allows us to keep track of children between 40851 * updates. 40852 */ 40853 40854 40855var ownerHasKeyUseWarning = {}; 40856 40857function getCurrentComponentErrorInfo(parentType) { 40858 var info = getDeclarationErrorAddendum(); 40859 40860 if (!info) { 40861 var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name; 40862 40863 if (parentName) { 40864 info = "\n\nCheck the top-level render call using <" + parentName + ">."; 40865 } 40866 } 40867 40868 return info; 40869} 40870/** 40871 * Warn if the element doesn't have an explicit key assigned to it. 40872 * This element is in an array. The array could grow and shrink or be 40873 * reordered. All children that haven't already been validated are required to 40874 * have a "key" property assigned to it. Error statuses are cached so a warning 40875 * will only be shown once. 40876 * 40877 * @internal 40878 * @param {ReactElement} element Element that requires a key. 40879 * @param {*} parentType element's parent's type. 40880 */ 40881 40882 40883function validateExplicitKey(element, parentType) { 40884 if (!element._store || element._store.validated || element.key != null) { 40885 return; 40886 } 40887 40888 element._store.validated = true; 40889 var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType); 40890 40891 if (ownerHasKeyUseWarning[currentComponentErrorInfo]) { 40892 return; 40893 } 40894 40895 ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a 40896 // property, it may be the creator of the child that's responsible for 40897 // assigning it a key. 40898 40899 var childOwner = ''; 40900 40901 if (element && element._owner && element._owner !== ReactCurrentOwner.current) { 40902 // Give the component that originally created this child. 40903 childOwner = " It was passed a child from " + getComponentNameFromType(element._owner.type) + "."; 40904 } 40905 40906 { 40907 setCurrentlyValidatingElement$1(element); 40908 40909 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); 40910 40911 setCurrentlyValidatingElement$1(null); 40912 } 40913} 40914/** 40915 * Ensure that every element either is passed in a static location, in an 40916 * array with an explicit keys property defined, or in an object literal 40917 * with valid key property. 40918 * 40919 * @internal 40920 * @param {ReactNode} node Statically passed child of any type. 40921 * @param {*} parentType node's parent's type. 40922 */ 40923 40924 40925function validateChildKeys(node, parentType) { 40926 if (typeof node !== 'object') { 40927 return; 40928 } 40929 40930 if (isArray(node)) { 40931 for (var i = 0; i < node.length; i++) { 40932 var child = node[i]; 40933 40934 if (isValidElement(child)) { 40935 validateExplicitKey(child, parentType); 40936 } 40937 } 40938 } else if (isValidElement(node)) { 40939 // This element was passed in a valid location. 40940 if (node._store) { 40941 node._store.validated = true; 40942 } 40943 } else if (node) { 40944 var iteratorFn = getIteratorFn(node); 40945 40946 if (typeof iteratorFn === 'function') { 40947 // Entry iterators used to provide implicit keys, 40948 // but now we print a separate warning for them later. 40949 if (iteratorFn !== node.entries) { 40950 var iterator = iteratorFn.call(node); 40951 var step; 40952 40953 while (!(step = iterator.next()).done) { 40954 if (isValidElement(step.value)) { 40955 validateExplicitKey(step.value, parentType); 40956 } 40957 } 40958 } 40959 } 40960 } 40961} 40962/** 40963 * Given an element, validate that its props follow the propTypes definition, 40964 * provided by the type. 40965 * 40966 * @param {ReactElement} element 40967 */ 40968 40969 40970function validatePropTypes(element) { 40971 { 40972 var type = element.type; 40973 40974 if (type === null || type === undefined || typeof type === 'string') { 40975 return; 40976 } 40977 40978 var propTypes; 40979 40980 if (typeof type === 'function') { 40981 propTypes = type.propTypes; 40982 } else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here. 40983 // Inner props are checked in the reconciler. 40984 type.$$typeof === REACT_MEMO_TYPE)) { 40985 propTypes = type.propTypes; 40986 } else { 40987 return; 40988 } 40989 40990 if (propTypes) { 40991 // Intentionally inside to avoid triggering lazy initializers: 40992 var name = getComponentNameFromType(type); 40993 checkPropTypes(propTypes, element.props, 'prop', name, element); 40994 } else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) { 40995 propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers: 40996 40997 var _name = getComponentNameFromType(type); 40998 40999 error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown'); 41000 } 41001 41002 if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) { 41003 error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.'); 41004 } 41005 } 41006} 41007/** 41008 * Given a fragment, validate that it can only be provided with fragment props 41009 * @param {ReactElement} fragment 41010 */ 41011 41012 41013function validateFragmentProps(fragment) { 41014 { 41015 var keys = Object.keys(fragment.props); 41016 41017 for (var i = 0; i < keys.length; i++) { 41018 var key = keys[i]; 41019 41020 if (key !== 'children' && key !== 'key') { 41021 setCurrentlyValidatingElement$1(fragment); 41022 41023 error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key); 41024 41025 setCurrentlyValidatingElement$1(null); 41026 break; 41027 } 41028 } 41029 41030 if (fragment.ref !== null) { 41031 setCurrentlyValidatingElement$1(fragment); 41032 41033 error('Invalid attribute `ref` supplied to `React.Fragment`.'); 41034 41035 setCurrentlyValidatingElement$1(null); 41036 } 41037 } 41038} 41039function createElementWithValidation(type, props, children) { 41040 var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to 41041 // succeed and there will likely be errors in render. 41042 41043 if (!validType) { 41044 var info = ''; 41045 41046 if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) { 41047 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."; 41048 } 41049 41050 var sourceInfo = getSourceInfoErrorAddendumForProps(props); 41051 41052 if (sourceInfo) { 41053 info += sourceInfo; 41054 } else { 41055 info += getDeclarationErrorAddendum(); 41056 } 41057 41058 var typeString; 41059 41060 if (type === null) { 41061 typeString = 'null'; 41062 } else if (isArray(type)) { 41063 typeString = 'array'; 41064 } else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) { 41065 typeString = "<" + (getComponentNameFromType(type.type) || 'Unknown') + " />"; 41066 info = ' Did you accidentally export a JSX literal instead of a component?'; 41067 } else { 41068 typeString = typeof type; 41069 } 41070 41071 { 41072 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); 41073 } 41074 } 41075 41076 var element = createElement.apply(this, arguments); // The result can be nullish if a mock or a custom function is used. 41077 // TODO: Drop this when these are no longer allowed as the type argument. 41078 41079 if (element == null) { 41080 return element; 41081 } // Skip key warning if the type isn't valid since our key validation logic 41082 // doesn't expect a non-string/function type and can throw confusing errors. 41083 // We don't want exception behavior to differ between dev and prod. 41084 // (Rendering will throw with a helpful message and as soon as the type is 41085 // fixed, the key warnings will appear.) 41086 41087 41088 if (validType) { 41089 for (var i = 2; i < arguments.length; i++) { 41090 validateChildKeys(arguments[i], type); 41091 } 41092 } 41093 41094 if (type === REACT_FRAGMENT_TYPE) { 41095 validateFragmentProps(element); 41096 } else { 41097 validatePropTypes(element); 41098 } 41099 41100 return element; 41101} 41102var didWarnAboutDeprecatedCreateFactory = false; 41103function createFactoryWithValidation(type) { 41104 var validatedFactory = createElementWithValidation.bind(null, type); 41105 validatedFactory.type = type; 41106 41107 { 41108 if (!didWarnAboutDeprecatedCreateFactory) { 41109 didWarnAboutDeprecatedCreateFactory = true; 41110 41111 warn('React.createFactory() is deprecated and will be removed in ' + 'a future major release. Consider using JSX ' + 'or use React.createElement() directly instead.'); 41112 } // Legacy hook: remove it 41113 41114 41115 Object.defineProperty(validatedFactory, 'type', { 41116 enumerable: false, 41117 get: function () { 41118 warn('Factory.type is deprecated. Access the class directly ' + 'before passing it to createFactory.'); 41119 41120 Object.defineProperty(this, 'type', { 41121 value: type 41122 }); 41123 return type; 41124 } 41125 }); 41126 } 41127 41128 return validatedFactory; 41129} 41130function cloneElementWithValidation(element, props, children) { 41131 var newElement = cloneElement.apply(this, arguments); 41132 41133 for (var i = 2; i < arguments.length; i++) { 41134 validateChildKeys(arguments[i], newElement.type); 41135 } 41136 41137 validatePropTypes(newElement); 41138 return newElement; 41139} 41140 41141function startTransition(scope, options) { 41142 var prevTransition = ReactCurrentBatchConfig.transition; 41143 ReactCurrentBatchConfig.transition = {}; 41144 var currentTransition = ReactCurrentBatchConfig.transition; 41145 41146 { 41147 ReactCurrentBatchConfig.transition._updatedFibers = new Set(); 41148 } 41149 41150 try { 41151 scope(); 41152 } finally { 41153 ReactCurrentBatchConfig.transition = prevTransition; 41154 41155 { 41156 if (prevTransition === null && currentTransition._updatedFibers) { 41157 var updatedFibersCount = currentTransition._updatedFibers.size; 41158 41159 if (updatedFibersCount > 10) { 41160 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.'); 41161 } 41162 41163 currentTransition._updatedFibers.clear(); 41164 } 41165 } 41166 } 41167} 41168 41169var didWarnAboutMessageChannel = false; 41170var enqueueTaskImpl = null; 41171function enqueueTask(task) { 41172 if (enqueueTaskImpl === null) { 41173 try { 41174 // read require off the module object to get around the bundlers. 41175 // we don't want them to detect a require and bundle a Node polyfill. 41176 var requireString = ('require' + Math.random()).slice(0, 7); 41177 var nodeRequire = module && module[requireString]; // assuming we're in node, let's try to get node's 41178 // version of setImmediate, bypassing fake timers if any. 41179 41180 enqueueTaskImpl = nodeRequire.call(module, 'timers').setImmediate; 41181 } catch (_err) { 41182 // we're in a browser 41183 // we can't use regular timers because they may still be faked 41184 // so we try MessageChannel+postMessage instead 41185 enqueueTaskImpl = function (callback) { 41186 { 41187 if (didWarnAboutMessageChannel === false) { 41188 didWarnAboutMessageChannel = true; 41189 41190 if (typeof MessageChannel === 'undefined') { 41191 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.'); 41192 } 41193 } 41194 } 41195 41196 var channel = new MessageChannel(); 41197 channel.port1.onmessage = callback; 41198 channel.port2.postMessage(undefined); 41199 }; 41200 } 41201 } 41202 41203 return enqueueTaskImpl(task); 41204} 41205 41206var actScopeDepth = 0; 41207var didWarnNoAwaitAct = false; 41208function act(callback) { 41209 { 41210 // `act` calls can be nested, so we track the depth. This represents the 41211 // number of `act` scopes on the stack. 41212 var prevActScopeDepth = actScopeDepth; 41213 actScopeDepth++; 41214 41215 if (ReactCurrentActQueue.current === null) { 41216 // This is the outermost `act` scope. Initialize the queue. The reconciler 41217 // will detect the queue and use it instead of Scheduler. 41218 ReactCurrentActQueue.current = []; 41219 } 41220 41221 var prevIsBatchingLegacy = ReactCurrentActQueue.isBatchingLegacy; 41222 var result; 41223 41224 try { 41225 // Used to reproduce behavior of `batchedUpdates` in legacy mode. Only 41226 // set to `true` while the given callback is executed, not for updates 41227 // triggered during an async event, because this is how the legacy 41228 // implementation of `act` behaved. 41229 ReactCurrentActQueue.isBatchingLegacy = true; 41230 result = callback(); // Replicate behavior of original `act` implementation in legacy mode, 41231 // which flushed updates immediately after the scope function exits, even 41232 // if it's an async function. 41233 41234 if (!prevIsBatchingLegacy && ReactCurrentActQueue.didScheduleLegacyUpdate) { 41235 var queue = ReactCurrentActQueue.current; 41236 41237 if (queue !== null) { 41238 ReactCurrentActQueue.didScheduleLegacyUpdate = false; 41239 flushActQueue(queue); 41240 } 41241 } 41242 } catch (error) { 41243 popActScope(prevActScopeDepth); 41244 throw error; 41245 } finally { 41246 ReactCurrentActQueue.isBatchingLegacy = prevIsBatchingLegacy; 41247 } 41248 41249 if (result !== null && typeof result === 'object' && typeof result.then === 'function') { 41250 var thenableResult = result; // The callback is an async function (i.e. returned a promise). Wait 41251 // for it to resolve before exiting the current scope. 41252 41253 var wasAwaited = false; 41254 var thenable = { 41255 then: function (resolve, reject) { 41256 wasAwaited = true; 41257 thenableResult.then(function (returnValue) { 41258 popActScope(prevActScopeDepth); 41259 41260 if (actScopeDepth === 0) { 41261 // We've exited the outermost act scope. Recursively flush the 41262 // queue until there's no remaining work. 41263 recursivelyFlushAsyncActWork(returnValue, resolve, reject); 41264 } else { 41265 resolve(returnValue); 41266 } 41267 }, function (error) { 41268 // The callback threw an error. 41269 popActScope(prevActScopeDepth); 41270 reject(error); 41271 }); 41272 } 41273 }; 41274 41275 { 41276 if (!didWarnNoAwaitAct && typeof Promise !== 'undefined') { 41277 // eslint-disable-next-line no-undef 41278 Promise.resolve().then(function () {}).then(function () { 41279 if (!wasAwaited) { 41280 didWarnNoAwaitAct = true; 41281 41282 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 () => ...);'); 41283 } 41284 }); 41285 } 41286 } 41287 41288 return thenable; 41289 } else { 41290 var returnValue = result; // The callback is not an async function. Exit the current scope 41291 // immediately, without awaiting. 41292 41293 popActScope(prevActScopeDepth); 41294 41295 if (actScopeDepth === 0) { 41296 // Exiting the outermost act scope. Flush the queue. 41297 var _queue = ReactCurrentActQueue.current; 41298 41299 if (_queue !== null) { 41300 flushActQueue(_queue); 41301 ReactCurrentActQueue.current = null; 41302 } // Return a thenable. If the user awaits it, we'll flush again in 41303 // case additional work was scheduled by a microtask. 41304 41305 41306 var _thenable = { 41307 then: function (resolve, reject) { 41308 // Confirm we haven't re-entered another `act` scope, in case 41309 // the user does something weird like await the thenable 41310 // multiple times. 41311 if (ReactCurrentActQueue.current === null) { 41312 // Recursively flush the queue until there's no remaining work. 41313 ReactCurrentActQueue.current = []; 41314 recursivelyFlushAsyncActWork(returnValue, resolve, reject); 41315 } else { 41316 resolve(returnValue); 41317 } 41318 } 41319 }; 41320 return _thenable; 41321 } else { 41322 // Since we're inside a nested `act` scope, the returned thenable 41323 // immediately resolves. The outer scope will flush the queue. 41324 var _thenable2 = { 41325 then: function (resolve, reject) { 41326 resolve(returnValue); 41327 } 41328 }; 41329 return _thenable2; 41330 } 41331 } 41332 } 41333} 41334 41335function popActScope(prevActScopeDepth) { 41336 { 41337 if (prevActScopeDepth !== actScopeDepth - 1) { 41338 error('You seem to have overlapping act() calls, this is not supported. ' + 'Be sure to await previous act() calls before making a new one. '); 41339 } 41340 41341 actScopeDepth = prevActScopeDepth; 41342 } 41343} 41344 41345function recursivelyFlushAsyncActWork(returnValue, resolve, reject) { 41346 { 41347 var queue = ReactCurrentActQueue.current; 41348 41349 if (queue !== null) { 41350 try { 41351 flushActQueue(queue); 41352 enqueueTask(function () { 41353 if (queue.length === 0) { 41354 // No additional work was scheduled. Finish. 41355 ReactCurrentActQueue.current = null; 41356 resolve(returnValue); 41357 } else { 41358 // Keep flushing work until there's none left. 41359 recursivelyFlushAsyncActWork(returnValue, resolve, reject); 41360 } 41361 }); 41362 } catch (error) { 41363 reject(error); 41364 } 41365 } else { 41366 resolve(returnValue); 41367 } 41368 } 41369} 41370 41371var isFlushing = false; 41372 41373function flushActQueue(queue) { 41374 { 41375 if (!isFlushing) { 41376 // Prevent re-entrance. 41377 isFlushing = true; 41378 var i = 0; 41379 41380 try { 41381 for (; i < queue.length; i++) { 41382 var callback = queue[i]; 41383 41384 do { 41385 callback = callback(true); 41386 } while (callback !== null); 41387 } 41388 41389 queue.length = 0; 41390 } catch (error) { 41391 // If something throws, leave the remaining callbacks on the queue. 41392 queue = queue.slice(i + 1); 41393 throw error; 41394 } finally { 41395 isFlushing = false; 41396 } 41397 } 41398 } 41399} 41400 41401var createElement$1 = createElementWithValidation ; 41402var cloneElement$1 = cloneElementWithValidation ; 41403var createFactory = createFactoryWithValidation ; 41404var Children = { 41405 map: mapChildren, 41406 forEach: forEachChildren, 41407 count: countChildren, 41408 toArray: toArray, 41409 only: onlyChild 41410}; 41411 41412exports.Children = Children; 41413exports.Component = Component; 41414exports.Fragment = REACT_FRAGMENT_TYPE; 41415exports.Profiler = REACT_PROFILER_TYPE; 41416exports.PureComponent = PureComponent; 41417exports.StrictMode = REACT_STRICT_MODE_TYPE; 41418exports.Suspense = REACT_SUSPENSE_TYPE; 41419exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = ReactSharedInternals; 41420exports.cloneElement = cloneElement$1; 41421exports.createContext = createContext; 41422exports.createElement = createElement$1; 41423exports.createFactory = createFactory; 41424exports.createRef = createRef; 41425exports.forwardRef = forwardRef; 41426exports.isValidElement = isValidElement; 41427exports.lazy = lazy; 41428exports.memo = memo; 41429exports.startTransition = startTransition; 41430exports.unstable_act = act; 41431exports.useCallback = useCallback; 41432exports.useContext = useContext; 41433exports.useDebugValue = useDebugValue; 41434exports.useDeferredValue = useDeferredValue; 41435exports.useEffect = useEffect; 41436exports.useId = useId; 41437exports.useImperativeHandle = useImperativeHandle; 41438exports.useInsertionEffect = useInsertionEffect; 41439exports.useLayoutEffect = useLayoutEffect; 41440exports.useMemo = useMemo; 41441exports.useReducer = useReducer; 41442exports.useRef = useRef; 41443exports.useState = useState; 41444exports.useSyncExternalStore = useSyncExternalStore; 41445exports.useTransition = useTransition; 41446exports.version = ReactVersion; 41447 /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 41448if ( 41449 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && 41450 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop === 41451 'function' 41452) { 41453 __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error()); 41454} 41455 41456 })(); 41457} 41458 41459 41460/***/ }), 41461
vendor: 411 bytes, lines 41462-41477
41462/***/ "./node_modules/react/index.js": 41463/*!*************************************!*\ 41464 !*** ./node_modules/react/index.js ***! 41465 \*************************************/ 41466/***/ ((module, __unused_webpack_exports, __webpack_require__) => { 41467 41468"use strict"; 41469 41470 41471if (false) {} else { 41472 module.exports = __webpack_require__(/*! ./cjs/react.development.js */ "./node_modules/react/cjs/react.development.js"); 41473} 41474 41475 41476/***/ }), 41477
vendor: 17,789 bytes, lines 41478-42122
41478/***/ "./node_modules/scheduler/cjs/scheduler.development.js": 41479/*!*************************************************************!*\ 41480 !*** ./node_modules/scheduler/cjs/scheduler.development.js ***! 41481 \*************************************************************/ 41482/***/ ((__unused_webpack_module, exports) => { 41483 41484"use strict"; 41485/** 41486 * @license React 41487 * scheduler.development.js 41488 * 41489 * Copyright (c) Facebook, Inc. and its affiliates. 41490 * 41491 * This source code is licensed under the MIT license found in the 41492 * LICENSE file in the root directory of this source tree. 41493 */ 41494 41495 41496 41497if (true) { 41498 (function() { 41499 41500 'use strict'; 41501 41502/* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 41503if ( 41504 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && 41505 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart === 41506 'function' 41507) { 41508 __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error()); 41509} 41510 var enableSchedulerDebugging = false; 41511var enableProfiling = false; 41512var frameYieldMs = 5; 41513 41514function push(heap, node) { 41515 var index = heap.length; 41516 heap.push(node); 41517 siftUp(heap, node, index); 41518} 41519function peek(heap) { 41520 return heap.length === 0 ? null : heap[0]; 41521} 41522function pop(heap) { 41523 if (heap.length === 0) { 41524 return null; 41525 } 41526 41527 var first = heap[0]; 41528 var last = heap.pop(); 41529 41530 if (last !== first) { 41531 heap[0] = last; 41532 siftDown(heap, last, 0); 41533 } 41534 41535 return first; 41536} 41537 41538function siftUp(heap, node, i) { 41539 var index = i; 41540 41541 while (index > 0) { 41542 var parentIndex = index - 1 >>> 1; 41543 var parent = heap[parentIndex]; 41544 41545 if (compare(parent, node) > 0) { 41546 // The parent is larger. Swap positions. 41547 heap[parentIndex] = node; 41548 heap[index] = parent; 41549 index = parentIndex; 41550 } else { 41551 // The parent is smaller. Exit. 41552 return; 41553 } 41554 } 41555} 41556 41557function siftDown(heap, node, i) { 41558 var index = i; 41559 var length = heap.length; 41560 var halfLength = length >>> 1; 41561 41562 while (index < halfLength) { 41563 var leftIndex = (index + 1) * 2 - 1; 41564 var left = heap[leftIndex]; 41565 var rightIndex = leftIndex + 1; 41566 var right = heap[rightIndex]; // If the left or right node is smaller, swap with the smaller of those. 41567 41568 if (compare(left, node) < 0) { 41569 if (rightIndex < length && compare(right, left) < 0) { 41570 heap[index] = right; 41571 heap[rightIndex] = node; 41572 index = rightIndex; 41573 } else { 41574 heap[index] = left; 41575 heap[leftIndex] = node; 41576 index = leftIndex; 41577 } 41578 } else if (rightIndex < length && compare(right, node) < 0) { 41579 heap[index] = right; 41580 heap[rightIndex] = node; 41581 index = rightIndex; 41582 } else { 41583 // Neither child is smaller. Exit. 41584 return; 41585 } 41586 } 41587} 41588 41589function compare(a, b) { 41590 // Compare sort index first, then task id. 41591 var diff = a.sortIndex - b.sortIndex; 41592 return diff !== 0 ? diff : a.id - b.id; 41593} 41594 41595// TODO: Use symbols? 41596var ImmediatePriority = 1; 41597var UserBlockingPriority = 2; 41598var NormalPriority = 3; 41599var LowPriority = 4; 41600var IdlePriority = 5; 41601 41602function markTaskErrored(task, ms) { 41603} 41604 41605/* eslint-disable no-var */ 41606 41607var hasPerformanceNow = typeof performance === 'object' && typeof performance.now === 'function'; 41608 41609if (hasPerformanceNow) { 41610 var localPerformance = performance; 41611 41612 exports.unstable_now = function () { 41613 return localPerformance.now(); 41614 }; 41615} else { 41616 var localDate = Date; 41617 var initialTime = localDate.now(); 41618 41619 exports.unstable_now = function () { 41620 return localDate.now() - initialTime; 41621 }; 41622} // Max 31 bit integer. The max integer size in V8 for 32-bit systems. 41623// Math.pow(2, 30) - 1 41624// 0b111111111111111111111111111111 41625 41626 41627var maxSigned31BitInt = 1073741823; // Times out immediately 41628 41629var IMMEDIATE_PRIORITY_TIMEOUT = -1; // Eventually times out 41630 41631var USER_BLOCKING_PRIORITY_TIMEOUT = 250; 41632var NORMAL_PRIORITY_TIMEOUT = 5000; 41633var LOW_PRIORITY_TIMEOUT = 10000; // Never times out 41634 41635var IDLE_PRIORITY_TIMEOUT = maxSigned31BitInt; // Tasks are stored on a min heap 41636 41637var taskQueue = []; 41638var timerQueue = []; // Incrementing id counter. Used to maintain insertion order. 41639 41640var taskIdCounter = 1; // Pausing the scheduler is useful for debugging. 41641var currentTask = null; 41642var currentPriorityLevel = NormalPriority; // This is set while performing work, to prevent re-entrance. 41643 41644var isPerformingWork = false; 41645var isHostCallbackScheduled = false; 41646var isHostTimeoutScheduled = false; // Capture local references to native APIs, in case a polyfill overrides them. 41647 41648var localSetTimeout = typeof setTimeout === 'function' ? setTimeout : null; 41649var localClearTimeout = typeof clearTimeout === 'function' ? clearTimeout : null; 41650var localSetImmediate = typeof setImmediate !== 'undefined' ? setImmediate : null; // IE and Node.js + jsdom 41651 41652var isInputPending = typeof navigator !== 'undefined' && navigator.scheduling !== undefined && navigator.scheduling.isInputPending !== undefined ? navigator.scheduling.isInputPending.bind(navigator.scheduling) : null; 41653 41654function advanceTimers(currentTime) { 41655 // Check for tasks that are no longer delayed and add them to the queue. 41656 var timer = peek(timerQueue); 41657 41658 while (timer !== null) { 41659 if (timer.callback === null) { 41660 // Timer was cancelled. 41661 pop(timerQueue); 41662 } else if (timer.startTime <= currentTime) { 41663 // Timer fired. Transfer to the task queue. 41664 pop(timerQueue); 41665 timer.sortIndex = timer.expirationTime; 41666 push(taskQueue, timer); 41667 } else { 41668 // Remaining timers are pending. 41669 return; 41670 } 41671 41672 timer = peek(timerQueue); 41673 } 41674} 41675 41676function handleTimeout(currentTime) { 41677 isHostTimeoutScheduled = false; 41678 advanceTimers(currentTime); 41679 41680 if (!isHostCallbackScheduled) { 41681 if (peek(taskQueue) !== null) { 41682 isHostCallbackScheduled = true; 41683 requestHostCallback(flushWork); 41684 } else { 41685 var firstTimer = peek(timerQueue); 41686 41687 if (firstTimer !== null) { 41688 requestHostTimeout(handleTimeout, firstTimer.startTime - currentTime); 41689 } 41690 } 41691 } 41692} 41693 41694function flushWork(hasTimeRemaining, initialTime) { 41695 41696 41697 isHostCallbackScheduled = false; 41698 41699 if (isHostTimeoutScheduled) { 41700 // We scheduled a timeout but it's no longer needed. Cancel it. 41701 isHostTimeoutScheduled = false; 41702 cancelHostTimeout(); 41703 } 41704 41705 isPerformingWork = true; 41706 var previousPriorityLevel = currentPriorityLevel; 41707 41708 try { 41709 if (enableProfiling) { 41710 try { 41711 return workLoop(hasTimeRemaining, initialTime); 41712 } catch (error) { 41713 if (currentTask !== null) { 41714 var currentTime = exports.unstable_now(); 41715 markTaskErrored(currentTask, currentTime); 41716 currentTask.isQueued = false; 41717 } 41718 41719 throw error; 41720 } 41721 } else { 41722 // No catch in prod code path. 41723 return workLoop(hasTimeRemaining, initialTime); 41724 } 41725 } finally { 41726 currentTask = null; 41727 currentPriorityLevel = previousPriorityLevel; 41728 isPerformingWork = false; 41729 } 41730} 41731 41732function workLoop(hasTimeRemaining, initialTime) { 41733 var currentTime = initialTime; 41734 advanceTimers(currentTime); 41735 currentTask = peek(taskQueue); 41736 41737 while (currentTask !== null && !(enableSchedulerDebugging )) { 41738 if (currentTask.expirationTime > currentTime && (!hasTimeRemaining || shouldYieldToHost())) { 41739 // This currentTask hasn't expired, and we've reached the deadline. 41740 break; 41741 } 41742 41743 var callback = currentTask.callback; 41744 41745 if (typeof callback === 'function') { 41746 currentTask.callback = null; 41747 currentPriorityLevel = currentTask.priorityLevel; 41748 var didUserCallbackTimeout = currentTask.expirationTime <= currentTime; 41749 41750 var continuationCallback = callback(didUserCallbackTimeout); 41751 currentTime = exports.unstable_now(); 41752 41753 if (typeof continuationCallback === 'function') { 41754 currentTask.callback = continuationCallback; 41755 } else { 41756 41757 if (currentTask === peek(taskQueue)) { 41758 pop(taskQueue); 41759 } 41760 } 41761 41762 advanceTimers(currentTime); 41763 } else { 41764 pop(taskQueue); 41765 } 41766 41767 currentTask = peek(taskQueue); 41768 } // Return whether there's additional work 41769 41770 41771 if (currentTask !== null) { 41772 return true; 41773 } else { 41774 var firstTimer = peek(timerQueue); 41775 41776 if (firstTimer !== null) { 41777 requestHostTimeout(handleTimeout, firstTimer.startTime - currentTime); 41778 } 41779 41780 return false; 41781 } 41782} 41783 41784function unstable_runWithPriority(priorityLevel, eventHandler) { 41785 switch (priorityLevel) { 41786 case ImmediatePriority: 41787 case UserBlockingPriority: 41788 case NormalPriority: 41789 case LowPriority: 41790 case IdlePriority: 41791 break; 41792 41793 default: 41794 priorityLevel = NormalPriority; 41795 } 41796 41797 var previousPriorityLevel = currentPriorityLevel; 41798 currentPriorityLevel = priorityLevel; 41799 41800 try { 41801 return eventHandler(); 41802 } finally { 41803 currentPriorityLevel = previousPriorityLevel; 41804 } 41805} 41806 41807function unstable_next(eventHandler) { 41808 var priorityLevel; 41809 41810 switch (currentPriorityLevel) { 41811 case ImmediatePriority: 41812 case UserBlockingPriority: 41813 case NormalPriority: 41814 // Shift down to normal priority 41815 priorityLevel = NormalPriority; 41816 break; 41817 41818 default: 41819 // Anything lower than normal priority should remain at the current level. 41820 priorityLevel = currentPriorityLevel; 41821 break; 41822 } 41823 41824 var previousPriorityLevel = currentPriorityLevel; 41825 currentPriorityLevel = priorityLevel; 41826 41827 try { 41828 return eventHandler(); 41829 } finally { 41830 currentPriorityLevel = previousPriorityLevel; 41831 } 41832} 41833 41834function unstable_wrapCallback(callback) { 41835 var parentPriorityLevel = currentPriorityLevel; 41836 return function () { 41837 // This is a fork of runWithPriority, inlined for performance. 41838 var previousPriorityLevel = currentPriorityLevel; 41839 currentPriorityLevel = parentPriorityLevel; 41840 41841 try { 41842 return callback.apply(this, arguments); 41843 } finally { 41844 currentPriorityLevel = previousPriorityLevel; 41845 } 41846 }; 41847} 41848 41849function unstable_scheduleCallback(priorityLevel, callback, options) { 41850 var currentTime = exports.unstable_now(); 41851 var startTime; 41852 41853 if (typeof options === 'object' && options !== null) { 41854 var delay = options.delay; 41855 41856 if (typeof delay === 'number' && delay > 0) { 41857 startTime = currentTime + delay; 41858 } else { 41859 startTime = currentTime; 41860 } 41861 } else { 41862 startTime = currentTime; 41863 } 41864 41865 var timeout; 41866 41867 switch (priorityLevel) { 41868 case ImmediatePriority: 41869 timeout = IMMEDIATE_PRIORITY_TIMEOUT; 41870 break; 41871 41872 case UserBlockingPriority: 41873 timeout = USER_BLOCKING_PRIORITY_TIMEOUT; 41874 break; 41875 41876 case IdlePriority: 41877 timeout = IDLE_PRIORITY_TIMEOUT; 41878 break; 41879 41880 case LowPriority: 41881 timeout = LOW_PRIORITY_TIMEOUT; 41882 break; 41883 41884 case NormalPriority: 41885 default: 41886 timeout = NORMAL_PRIORITY_TIMEOUT; 41887 break; 41888 } 41889 41890 var expirationTime = startTime + timeout; 41891 var newTask = { 41892 id: taskIdCounter++, 41893 callback: callback, 41894 priorityLevel: priorityLevel, 41895 startTime: startTime, 41896 expirationTime: expirationTime, 41897 sortIndex: -1 41898 }; 41899 41900 if (startTime > currentTime) { 41901 // This is a delayed task. 41902 newTask.sortIndex = startTime; 41903 push(timerQueue, newTask); 41904 41905 if (peek(taskQueue) === null && newTask === peek(timerQueue)) { 41906 // All tasks are delayed, and this is the task with the earliest delay. 41907 if (isHostTimeoutScheduled) { 41908 // Cancel an existing timeout. 41909 cancelHostTimeout(); 41910 } else { 41911 isHostTimeoutScheduled = true; 41912 } // Schedule a timeout. 41913 41914 41915 requestHostTimeout(handleTimeout, startTime - currentTime); 41916 } 41917 } else { 41918 newTask.sortIndex = expirationTime; 41919 push(taskQueue, newTask); 41920 // wait until the next time we yield. 41921 41922 41923 if (!isHostCallbackScheduled && !isPerformingWork) { 41924 isHostCallbackScheduled = true; 41925 requestHostCallback(flushWork); 41926 } 41927 } 41928 41929 return newTask; 41930} 41931 41932function unstable_pauseExecution() { 41933} 41934 41935function unstable_continueExecution() { 41936 41937 if (!isHostCallbackScheduled && !isPerformingWork) { 41938 isHostCallbackScheduled = true; 41939 requestHostCallback(flushWork); 41940 } 41941} 41942 41943function unstable_getFirstCallbackNode() { 41944 return peek(taskQueue); 41945} 41946 41947function unstable_cancelCallback(task) { 41948 // remove from the queue because you can't remove arbitrary nodes from an 41949 // array based heap, only the first one.) 41950 41951 41952 task.callback = null; 41953} 41954 41955function unstable_getCurrentPriorityLevel() { 41956 return currentPriorityLevel; 41957} 41958 41959var isMessageLoopRunning = false; 41960var scheduledHostCallback = null; 41961var taskTimeoutID = -1; // Scheduler periodically yields in case there is other work on the main 41962// thread, like user events. By default, it yields multiple times per frame. 41963// It does not attempt to align with frame boundaries, since most tasks don't 41964// need to be frame aligned; for those that do, use requestAnimationFrame. 41965 41966var frameInterval = frameYieldMs; 41967var startTime = -1; 41968 41969function shouldYieldToHost() { 41970 var timeElapsed = exports.unstable_now() - startTime; 41971 41972 if (timeElapsed < frameInterval) { 41973 // The main thread has only been blocked for a really short amount of time; 41974 // smaller than a single frame. Don't yield yet. 41975 return false; 41976 } // The main thread has been blocked for a non-negligible amount of time. We 41977 41978 41979 return true; 41980} 41981 41982function requestPaint() { 41983 41984} 41985 41986function forceFrameRate(fps) { 41987 if (fps < 0 || fps > 125) { 41988 // Using console['error'] to evade Babel and ESLint 41989 console['error']('forceFrameRate takes a positive int between 0 and 125, ' + 'forcing frame rates higher than 125 fps is not supported'); 41990 return; 41991 } 41992 41993 if (fps > 0) { 41994 frameInterval = Math.floor(1000 / fps); 41995 } else { 41996 // reset the framerate 41997 frameInterval = frameYieldMs; 41998 } 41999} 42000 42001var performWorkUntilDeadline = function () { 42002 if (scheduledHostCallback !== null) { 42003 var currentTime = exports.unstable_now(); // Keep track of the start time so we can measure how long the main thread 42004 // has been blocked. 42005 42006 startTime = currentTime; 42007 var hasTimeRemaining = true; // If a scheduler task throws, exit the current browser task so the 42008 // error can be observed. 42009 // 42010 // Intentionally not using a try-catch, since that makes some debugging 42011 // techniques harder. Instead, if `scheduledHostCallback` errors, then 42012 // `hasMoreWork` will remain true, and we'll continue the work loop. 42013 42014 var hasMoreWork = true; 42015 42016 try { 42017 hasMoreWork = scheduledHostCallback(hasTimeRemaining, currentTime); 42018 } finally { 42019 if (hasMoreWork) { 42020 // If there's more work, schedule the next message event at the end 42021 // of the preceding one. 42022 schedulePerformWorkUntilDeadline(); 42023 } else { 42024 isMessageLoopRunning = false; 42025 scheduledHostCallback = null; 42026 } 42027 } 42028 } else { 42029 isMessageLoopRunning = false; 42030 } // Yielding to the browser will give it a chance to paint, so we can 42031}; 42032 42033var schedulePerformWorkUntilDeadline; 42034 42035if (typeof localSetImmediate === 'function') { 42036 // Node.js and old IE. 42037 // There's a few reasons for why we prefer setImmediate. 42038 // 42039 // Unlike MessageChannel, it doesn't prevent a Node.js process from exiting. 42040 // (Even though this is a DOM fork of the Scheduler, you could get here 42041 // with a mix of Node.js 15+, which has a MessageChannel, and jsdom.) 42042 // https://github.com/facebook/react/issues/20756 42043 // 42044 // But also, it runs earlier which is the semantic we want. 42045 // If other browsers ever implement it, it's better to use it. 42046 // Although both of these would be inferior to native scheduling. 42047 schedulePerformWorkUntilDeadline = function () { 42048 localSetImmediate(performWorkUntilDeadline); 42049 }; 42050} else if (typeof MessageChannel !== 'undefined') { 42051 // DOM and Worker environments. 42052 // We prefer MessageChannel because of the 4ms setTimeout clamping. 42053 var channel = new MessageChannel(); 42054 var port = channel.port2; 42055 channel.port1.onmessage = performWorkUntilDeadline; 42056 42057 schedulePerformWorkUntilDeadline = function () { 42058 port.postMessage(null); 42059 }; 42060} else { 42061 // We should only fallback here in non-browser environments. 42062 schedulePerformWorkUntilDeadline = function () { 42063 localSetTimeout(performWorkUntilDeadline, 0); 42064 }; 42065} 42066 42067function requestHostCallback(callback) { 42068 scheduledHostCallback = callback; 42069 42070 if (!isMessageLoopRunning) { 42071 isMessageLoopRunning = true; 42072 schedulePerformWorkUntilDeadline(); 42073 } 42074} 42075 42076function requestHostTimeout(callback, ms) { 42077 taskTimeoutID = localSetTimeout(function () { 42078 callback(exports.unstable_now()); 42079 }, ms); 42080} 42081 42082function cancelHostTimeout() { 42083 localClearTimeout(taskTimeoutID); 42084 taskTimeoutID = -1; 42085} 42086 42087var unstable_requestPaint = requestPaint; 42088var unstable_Profiling = null; 42089 42090exports.unstable_IdlePriority = IdlePriority; 42091exports.unstable_ImmediatePriority = ImmediatePriority; 42092exports.unstable_LowPriority = LowPriority; 42093exports.unstable_NormalPriority = NormalPriority; 42094exports.unstable_Profiling = unstable_Profiling; 42095exports.unstable_UserBlockingPriority = UserBlockingPriority; 42096exports.unstable_cancelCallback = unstable_cancelCallback; 42097exports.unstable_continueExecution = unstable_continueExecution; 42098exports.unstable_forceFrameRate = forceFrameRate; 42099exports.unstable_getCurrentPriorityLevel = unstable_getCurrentPriorityLevel; 42100exports.unstable_getFirstCallbackNode = unstable_getFirstCallbackNode; 42101exports.unstable_next = unstable_next; 42102exports.unstable_pauseExecution = unstable_pauseExecution; 42103exports.unstable_requestPaint = unstable_requestPaint; 42104exports.unstable_runWithPriority = unstable_runWithPriority; 42105exports.unstable_scheduleCallback = unstable_scheduleCallback; 42106exports.unstable_shouldYield = shouldYieldToHost; 42107exports.unstable_wrapCallback = unstable_wrapCallback; 42108 /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ 42109if ( 42110 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ !== 'undefined' && 42111 typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop === 42112 'function' 42113) { 42114 __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error()); 42115} 42116 42117 })(); 42118} 42119 42120 42121/***/ }), 42122
vendor: 439 bytes, lines 42123-42138
42123/***/ "./node_modules/scheduler/index.js": 42124/*!*****************************************!*\ 42125 !*** ./node_modules/scheduler/index.js ***! 42126 \*****************************************/ 42127/***/ ((module, __unused_webpack_exports, __webpack_require__) => { 42128 42129"use strict"; 42130 42131 42132if (false) {} else { 42133 module.exports = __webpack_require__(/*! ./cjs/scheduler.development.js */ "./node_modules/scheduler/cjs/scheduler.development.js"); 42134} 42135 42136 42137/***/ }), 42138
vendor: 1,883 bytes, lines 42139-42224
42139/***/ "./node_modules/classnames/index.js": 42140/*!******************************************!*\ 42141 !*** ./node_modules/classnames/index.js ***! 42142 \******************************************/ 42143/***/ ((module, exports) => { 42144 42145var __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_DEFINE_RESULT__;/*! 42146 Copyright (c) 2018 Jed Watson. 42147 Licensed under the MIT License (MIT), see 42148 http://jedwatson.github.io/classnames 42149*/ 42150/* global define */ 42151 42152(function () { 42153 'use strict'; 42154 42155 var hasOwn = {}.hasOwnProperty; 42156 42157 function classNames () { 42158 var classes = ''; 42159 42160 for (var i = 0; i < arguments.length; i++) { 42161 var arg = arguments[i]; 42162 if (arg) { 42163 classes = appendClass(classes, parseValue(arg)); 42164 } 42165 } 42166 42167 return classes; 42168 } 42169 42170 function parseValue (arg) { 42171 if (typeof arg === 'string' || typeof arg === 'number') { 42172 return arg; 42173 } 42174 42175 if (typeof arg !== 'object') { 42176 return ''; 42177 } 42178 42179 if (Array.isArray(arg)) { 42180 return classNames.apply(null, arg); 42181 } 42182 42183 if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) { 42184 return arg.toString(); 42185 } 42186 42187 var classes = ''; 42188 42189 for (var key in arg) { 42190 if (hasOwn.call(arg, key) && arg[key]) { 42191 classes = appendClass(classes, key); 42192 } 42193 } 42194 42195 return classes; 42196 } 42197 42198 function appendClass (value, newClass) { 42199 if (!newClass) { 42200 return value; 42201 } 42202 42203 if (value) { 42204 return value + ' ' + newClass; 42205 } 42206 42207 return value + newClass; 42208 } 42209 42210 if ( true && module.exports) { 42211 classNames.default = classNames; 42212 module.exports = classNames; 42213 } else if (true) { 42214 // register as 'classnames', consistent with npm package name 42215 !(__WEBPACK_AMD_DEFINE_ARRAY__ = [], __WEBPACK_AMD_DEFINE_RESULT__ = (function () { 42216 return classNames; 42217 }).apply(exports, __WEBPACK_AMD_DEFINE_ARRAY__), 42218 __WEBPACK_AMD_DEFINE_RESULT__ !== undefined && (module.exports = __WEBPACK_AMD_DEFINE_RESULT__)); 42219 } else {} 42220}()); 42221 42222 42223/***/ }), 42224
vendor: 3,278 bytes, lines 42225-42320
42225/***/ "./node_modules/axios/lib/adapters/adapters.js": 42226/*!*****************************************************!*\ 42227 !*** ./node_modules/axios/lib/adapters/adapters.js ***! 42228 \*****************************************************/ 42229/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42230 42231"use strict"; 42232__webpack_require__.r(__webpack_exports__); 42233/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42234/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 42235/* harmony export */ }); 42236/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 42237/* harmony import */ var _http_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./http.js */ "./node_modules/axios/lib/helpers/null.js"); 42238/* harmony import */ var _xhr_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./xhr.js */ "./node_modules/axios/lib/adapters/xhr.js"); 42239/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 42240 42241 42242 42243 42244 42245const knownAdapters = { 42246 http: _http_js__WEBPACK_IMPORTED_MODULE_0__["default"], 42247 xhr: _xhr_js__WEBPACK_IMPORTED_MODULE_1__["default"] 42248} 42249 42250_utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].forEach(knownAdapters, (fn, value) => { 42251 if (fn) { 42252 try { 42253 Object.defineProperty(fn, 'name', {value}); 42254 } catch (e) { 42255 // eslint-disable-next-line no-empty 42256 } 42257 Object.defineProperty(fn, 'adapterName', {value}); 42258 } 42259}); 42260 42261const renderReason = (reason) => `- ${reason}`; 42262 42263const isResolvedHandle = (adapter) => _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isFunction(adapter) || adapter === null || adapter === false; 42264 42265/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ 42266 getAdapter: (adapters) => { 42267 adapters = _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isArray(adapters) ? adapters : [adapters]; 42268 42269 const {length} = adapters; 42270 let nameOrAdapter; 42271 let adapter; 42272 42273 const rejectedReasons = {}; 42274 42275 for (let i = 0; i < length; i++) { 42276 nameOrAdapter = adapters[i]; 42277 let id; 42278 42279 adapter = nameOrAdapter; 42280 42281 if (!isResolvedHandle(nameOrAdapter)) { 42282 adapter = knownAdapters[(id = String(nameOrAdapter)).toLowerCase()]; 42283 42284 if (adapter === undefined) { 42285 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_3__["default"](`Unknown adapter '${id}'`); 42286 } 42287 } 42288 42289 if (adapter) { 42290 break; 42291 } 42292 42293 rejectedReasons[id || '#' + i] = adapter; 42294 } 42295 42296 if (!adapter) { 42297 42298 const reasons = Object.entries(rejectedReasons) 42299 .map(([id, state]) => `adapter ${id} ` + 42300 (state === false ? 'is not supported by the environment' : 'is not available in the build') 42301 ); 42302 42303 let s = length ? 42304 (reasons.length > 1 ? 'since :\n' + reasons.map(renderReason).join('\n') : ' ' + renderReason(reasons[0])) : 42305 'as no adapter specified'; 42306 42307 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_3__["default"]( 42308 `There is no suitable adapter to dispatch the request ` + s, 42309 'ERR_NOT_SUPPORT' 42310 ); 42311 } 42312 42313 return adapter; 42314 }, 42315 adapters: knownAdapters 42316}); 42317 42318 42319/***/ }), 42320
vendor: 12,482 bytes, lines 42321-42608
42321/***/ "./node_modules/axios/lib/adapters/xhr.js": 42322/*!************************************************!*\ 42323 !*** ./node_modules/axios/lib/adapters/xhr.js ***! 42324 \************************************************/ 42325/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42326 42327"use strict"; 42328__webpack_require__.r(__webpack_exports__); 42329/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42330/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 42331/* harmony export */ }); 42332/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 42333/* harmony import */ var _core_settle_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./../core/settle.js */ "./node_modules/axios/lib/core/settle.js"); 42334/* harmony import */ var _helpers_cookies_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./../helpers/cookies.js */ "./node_modules/axios/lib/helpers/cookies.js"); 42335/* harmony import */ var _helpers_buildURL_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./../helpers/buildURL.js */ "./node_modules/axios/lib/helpers/buildURL.js"); 42336/* harmony import */ var _core_buildFullPath_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../core/buildFullPath.js */ "./node_modules/axios/lib/core/buildFullPath.js"); 42337/* harmony import */ var _helpers_isURLSameOrigin_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./../helpers/isURLSameOrigin.js */ "./node_modules/axios/lib/helpers/isURLSameOrigin.js"); 42338/* harmony import */ var _defaults_transitional_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../defaults/transitional.js */ "./node_modules/axios/lib/defaults/transitional.js"); 42339/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 42340/* harmony import */ var _cancel_CanceledError_js__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../cancel/CanceledError.js */ "./node_modules/axios/lib/cancel/CanceledError.js"); 42341/* harmony import */ var _helpers_parseProtocol_js__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../helpers/parseProtocol.js */ "./node_modules/axios/lib/helpers/parseProtocol.js"); 42342/* harmony import */ var _platform_index_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../platform/index.js */ "./node_modules/axios/lib/platform/index.js"); 42343/* harmony import */ var _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/AxiosHeaders.js */ "./node_modules/axios/lib/core/AxiosHeaders.js"); 42344/* harmony import */ var _helpers_speedometer_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../helpers/speedometer.js */ "./node_modules/axios/lib/helpers/speedometer.js"); 42345 42346 42347 42348 42349 42350 42351 42352 42353 42354 42355 42356 42357 42358 42359 42360 42361function progressEventReducer(listener, isDownloadStream) { 42362 let bytesNotified = 0; 42363 const _speedometer = (0,_helpers_speedometer_js__WEBPACK_IMPORTED_MODULE_0__["default"])(50, 250); 42364 42365 return e => { 42366 const loaded = e.loaded; 42367 const total = e.lengthComputable ? e.total : undefined; 42368 const progressBytes = loaded - bytesNotified; 42369 const rate = _speedometer(progressBytes); 42370 const inRange = loaded <= total; 42371 42372 bytesNotified = loaded; 42373 42374 const data = { 42375 loaded, 42376 total, 42377 progress: total ? (loaded / total) : undefined, 42378 bytes: progressBytes, 42379 rate: rate ? rate : undefined, 42380 estimated: rate && total && inRange ? (total - loaded) / rate : undefined, 42381 event: e 42382 }; 42383 42384 data[isDownloadStream ? 'download' : 'upload'] = true; 42385 42386 listener(data); 42387 }; 42388} 42389 42390const isXHRAdapterSupported = typeof XMLHttpRequest !== 'undefined'; 42391 42392/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (isXHRAdapterSupported && function (config) { 42393 return new Promise(function dispatchXhrRequest(resolve, reject) { 42394 let requestData = config.data; 42395 const requestHeaders = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"].from(config.headers).normalize(); 42396 let {responseType, withXSRFToken} = config; 42397 let onCanceled; 42398 function done() { 42399 if (config.cancelToken) { 42400 config.cancelToken.unsubscribe(onCanceled); 42401 } 42402 42403 if (config.signal) { 42404 config.signal.removeEventListener('abort', onCanceled); 42405 } 42406 } 42407 42408 let contentType; 42409 42410 if (_utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isFormData(requestData)) { 42411 if (_platform_index_js__WEBPACK_IMPORTED_MODULE_3__["default"].hasStandardBrowserEnv || _platform_index_js__WEBPACK_IMPORTED_MODULE_3__["default"].hasStandardBrowserWebWorkerEnv) { 42412 requestHeaders.setContentType(false); // Let the browser set it 42413 } else if ((contentType = requestHeaders.getContentType()) !== false) { 42414 // fix semicolon duplication issue for ReactNative FormData implementation 42415 const [type, ...tokens] = contentType ? contentType.split(';').map(token => token.trim()).filter(Boolean) : []; 42416 requestHeaders.setContentType([type || 'multipart/form-data', ...tokens].join('; ')); 42417 } 42418 } 42419 42420 let request = new XMLHttpRequest(); 42421 42422 // HTTP basic authentication 42423 if (config.auth) { 42424 const username = config.auth.username || ''; 42425 const password = config.auth.password ? unescape(encodeURIComponent(config.auth.password)) : ''; 42426 requestHeaders.set('Authorization', 'Basic ' + btoa(username + ':' + password)); 42427 } 42428 42429 const fullPath = (0,_core_buildFullPath_js__WEBPACK_IMPORTED_MODULE_4__["default"])(config.baseURL, config.url); 42430 42431 request.open(config.method.toUpperCase(), (0,_helpers_buildURL_js__WEBPACK_IMPORTED_MODULE_5__["default"])(fullPath, config.params, config.paramsSerializer), true); 42432 42433 // Set the request timeout in MS 42434 request.timeout = config.timeout; 42435 42436 function onloadend() { 42437 if (!request) { 42438 return; 42439 } 42440 // Prepare the response 42441 const responseHeaders = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"].from( 42442 'getAllResponseHeaders' in request && request.getAllResponseHeaders() 42443 ); 42444 const responseData = !responseType || responseType === 'text' || responseType === 'json' ? 42445 request.responseText : request.response; 42446 const response = { 42447 data: responseData, 42448 status: request.status, 42449 statusText: request.statusText, 42450 headers: responseHeaders, 42451 config, 42452 request 42453 }; 42454 42455 (0,_core_settle_js__WEBPACK_IMPORTED_MODULE_6__["default"])(function _resolve(value) { 42456 resolve(value); 42457 done(); 42458 }, function _reject(err) { 42459 reject(err); 42460 done(); 42461 }, response); 42462 42463 // Clean up request 42464 request = null; 42465 } 42466 42467 if ('onloadend' in request) { 42468 // Use onloadend if available 42469 request.onloadend = onloadend; 42470 } else { 42471 // Listen for ready state to emulate onloadend 42472 request.onreadystatechange = function handleLoad() { 42473 if (!request || request.readyState !== 4) { 42474 return; 42475 } 42476 42477 // The request errored out and we didn't get a response, this will be 42478 // handled by onerror instead 42479 // With one exception: request that using file: protocol, most browsers 42480 // will return status as 0 even though it's a successful request 42481 if (request.status === 0 && !(request.responseURL && request.responseURL.indexOf('file:') === 0)) { 42482 return; 42483 } 42484 // readystate handler is calling before onerror or ontimeout handlers, 42485 // so we should call onloadend on the next 'tick' 42486 setTimeout(onloadend); 42487 }; 42488 } 42489 42490 // Handle browser request cancellation (as opposed to a manual cancellation) 42491 request.onabort = function handleAbort() { 42492 if (!request) { 42493 return; 42494 } 42495 42496 reject(new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"]('Request aborted', _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"].ECONNABORTED, config, request)); 42497 42498 // Clean up request 42499 request = null; 42500 }; 42501 42502 // Handle low level network errors 42503 request.onerror = function handleError() { 42504 // Real errors are hidden from us by the browser 42505 // onerror should only fire if it's a network error 42506 reject(new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"]('Network Error', _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"].ERR_NETWORK, config, request)); 42507 42508 // Clean up request 42509 request = null; 42510 }; 42511 42512 // Handle timeout 42513 request.ontimeout = function handleTimeout() { 42514 let timeoutErrorMessage = config.timeout ? 'timeout of ' + config.timeout + 'ms exceeded' : 'timeout exceeded'; 42515 const transitional = config.transitional || _defaults_transitional_js__WEBPACK_IMPORTED_MODULE_8__["default"]; 42516 if (config.timeoutErrorMessage) { 42517 timeoutErrorMessage = config.timeoutErrorMessage; 42518 } 42519 reject(new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"]( 42520 timeoutErrorMessage, 42521 transitional.clarifyTimeoutError ? _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"].ETIMEDOUT : _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"].ECONNABORTED, 42522 config, 42523 request)); 42524 42525 // Clean up request 42526 request = null; 42527 }; 42528 42529 // Add xsrf header 42530 // This is only done if running in a standard browser environment. 42531 // Specifically not if we're in a web worker, or react-native. 42532 if(_platform_index_js__WEBPACK_IMPORTED_MODULE_3__["default"].hasStandardBrowserEnv) { 42533 withXSRFToken && _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isFunction(withXSRFToken) && (withXSRFToken = withXSRFToken(config)); 42534 42535 if (withXSRFToken || (withXSRFToken !== false && (0,_helpers_isURLSameOrigin_js__WEBPACK_IMPORTED_MODULE_9__["default"])(fullPath))) { 42536 // Add xsrf header 42537 const xsrfValue = config.xsrfHeaderName && config.xsrfCookieName && _helpers_cookies_js__WEBPACK_IMPORTED_MODULE_10__["default"].read(config.xsrfCookieName); 42538 42539 if (xsrfValue) { 42540 requestHeaders.set(config.xsrfHeaderName, xsrfValue); 42541 } 42542 } 42543 } 42544 42545 // Remove Content-Type if data is undefined 42546 requestData === undefined && requestHeaders.setContentType(null); 42547 42548 // Add headers to the request 42549 if ('setRequestHeader' in request) { 42550 _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].forEach(requestHeaders.toJSON(), function setRequestHeader(val, key) { 42551 request.setRequestHeader(key, val); 42552 }); 42553 } 42554 42555 // Add withCredentials to request if needed 42556 if (!_utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isUndefined(config.withCredentials)) { 42557 request.withCredentials = !!config.withCredentials; 42558 } 42559 42560 // Add responseType to request if needed 42561 if (responseType && responseType !== 'json') { 42562 request.responseType = config.responseType; 42563 } 42564 42565 // Handle progress if needed 42566 if (typeof config.onDownloadProgress === 'function') { 42567 request.addEventListener('progress', progressEventReducer(config.onDownloadProgress, true)); 42568 } 42569 42570 // Not all browsers support upload events 42571 if (typeof config.onUploadProgress === 'function' && request.upload) { 42572 request.upload.addEventListener('progress', progressEventReducer(config.onUploadProgress)); 42573 } 42574 42575 if (config.cancelToken || config.signal) { 42576 // Handle cancellation 42577 // eslint-disable-next-line func-names 42578 onCanceled = cancel => { 42579 if (!request) { 42580 return; 42581 } 42582 reject(!cancel || cancel.type ? new _cancel_CanceledError_js__WEBPACK_IMPORTED_MODULE_11__["default"](null, config, request) : cancel); 42583 request.abort(); 42584 request = null; 42585 }; 42586 42587 config.cancelToken && config.cancelToken.subscribe(onCanceled); 42588 if (config.signal) { 42589 config.signal.aborted ? onCanceled() : config.signal.addEventListener('abort', onCanceled); 42590 } 42591 } 42592 42593 const protocol = (0,_helpers_parseProtocol_js__WEBPACK_IMPORTED_MODULE_12__["default"])(fullPath); 42594 42595 if (protocol && _platform_index_js__WEBPACK_IMPORTED_MODULE_3__["default"].protocols.indexOf(protocol) === -1) { 42596 reject(new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"]('Unsupported protocol ' + protocol + ':', _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_7__["default"].ERR_BAD_REQUEST, config)); 42597 return; 42598 } 42599 42600 42601 // Send the request 42602 request.send(requestData || null); 42603 }); 42604}); 42605 42606 42607/***/ }), 42608
vendor: 6,423 bytes, lines 42609-42729
42609/***/ "./node_modules/axios/lib/axios.js": 42610/*!*****************************************!*\ 42611 !*** ./node_modules/axios/lib/axios.js ***! 42612 \*****************************************/ 42613/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42614 42615"use strict"; 42616__webpack_require__.r(__webpack_exports__); 42617/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42618/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 42619/* harmony export */ }); 42620/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./utils.js */ "./node_modules/axios/lib/utils.js"); 42621/* harmony import */ var _helpers_bind_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./helpers/bind.js */ "./node_modules/axios/lib/helpers/bind.js"); 42622/* harmony import */ var _core_Axios_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./core/Axios.js */ "./node_modules/axios/lib/core/Axios.js"); 42623/* harmony import */ var _core_mergeConfig_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./core/mergeConfig.js */ "./node_modules/axios/lib/core/mergeConfig.js"); 42624/* harmony import */ var _defaults_index_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./defaults/index.js */ "./node_modules/axios/lib/defaults/index.js"); 42625/* harmony import */ var _helpers_formDataToJSON_js__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./helpers/formDataToJSON.js */ "./node_modules/axios/lib/helpers/formDataToJSON.js"); 42626/* harmony import */ var _cancel_CanceledError_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./cancel/CanceledError.js */ "./node_modules/axios/lib/cancel/CanceledError.js"); 42627/* harmony import */ var _cancel_CancelToken_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./cancel/CancelToken.js */ "./node_modules/axios/lib/cancel/CancelToken.js"); 42628/* harmony import */ var _cancel_isCancel_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./cancel/isCancel.js */ "./node_modules/axios/lib/cancel/isCancel.js"); 42629/* harmony import */ var _env_data_js__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./env/data.js */ "./node_modules/axios/lib/env/data.js"); 42630/* harmony import */ var _helpers_toFormData_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./helpers/toFormData.js */ "./node_modules/axios/lib/helpers/toFormData.js"); 42631/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 42632/* harmony import */ var _helpers_spread_js__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./helpers/spread.js */ "./node_modules/axios/lib/helpers/spread.js"); 42633/* harmony import */ var _helpers_isAxiosError_js__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./helpers/isAxiosError.js */ "./node_modules/axios/lib/helpers/isAxiosError.js"); 42634/* harmony import */ var _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./core/AxiosHeaders.js */ "./node_modules/axios/lib/core/AxiosHeaders.js"); 42635/* harmony import */ var _adapters_adapters_js__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./adapters/adapters.js */ "./node_modules/axios/lib/adapters/adapters.js"); 42636/* harmony import */ var _helpers_HttpStatusCode_js__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./helpers/HttpStatusCode.js */ "./node_modules/axios/lib/helpers/HttpStatusCode.js"); 42637 42638 42639 42640 42641 42642 42643 42644 42645 42646 42647 42648 42649 42650 42651 42652 42653 42654 42655 42656 42657/** 42658 * Create an instance of Axios 42659 * 42660 * @param {Object} defaultConfig The default config for the instance 42661 * 42662 * @returns {Axios} A new instance of Axios 42663 */ 42664function createInstance(defaultConfig) { 42665 const context = new _core_Axios_js__WEBPACK_IMPORTED_MODULE_0__["default"](defaultConfig); 42666 const instance = (0,_helpers_bind_js__WEBPACK_IMPORTED_MODULE_1__["default"])(_core_Axios_js__WEBPACK_IMPORTED_MODULE_0__["default"].prototype.request, context); 42667 42668 // Copy axios.prototype to instance 42669 _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].extend(instance, _core_Axios_js__WEBPACK_IMPORTED_MODULE_0__["default"].prototype, context, {allOwnKeys: true}); 42670 42671 // Copy context to instance 42672 _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].extend(instance, context, null, {allOwnKeys: true}); 42673 42674 // Factory for creating new instances 42675 instance.create = function create(instanceConfig) { 42676 return createInstance((0,_core_mergeConfig_js__WEBPACK_IMPORTED_MODULE_3__["default"])(defaultConfig, instanceConfig)); 42677 }; 42678 42679 return instance; 42680} 42681 42682// Create the default instance to be exported 42683const axios = createInstance(_defaults_index_js__WEBPACK_IMPORTED_MODULE_4__["default"]); 42684 42685// Expose Axios class to allow class inheritance 42686axios.Axios = _core_Axios_js__WEBPACK_IMPORTED_MODULE_0__["default"]; 42687 42688// Expose Cancel & CancelToken 42689axios.CanceledError = _cancel_CanceledError_js__WEBPACK_IMPORTED_MODULE_5__["default"]; 42690axios.CancelToken = _cancel_CancelToken_js__WEBPACK_IMPORTED_MODULE_6__["default"]; 42691axios.isCancel = _cancel_isCancel_js__WEBPACK_IMPORTED_MODULE_7__["default"]; 42692axios.VERSION = _env_data_js__WEBPACK_IMPORTED_MODULE_8__.VERSION; 42693axios.toFormData = _helpers_toFormData_js__WEBPACK_IMPORTED_MODULE_9__["default"]; 42694 42695// Expose AxiosError class 42696axios.AxiosError = _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_10__["default"]; 42697 42698// alias for CanceledError for backward compatibility 42699axios.Cancel = axios.CanceledError; 42700 42701// Expose all/spread 42702axios.all = function all(promises) { 42703 return Promise.all(promises); 42704}; 42705 42706axios.spread = _helpers_spread_js__WEBPACK_IMPORTED_MODULE_11__["default"]; 42707 42708// Expose isAxiosError 42709axios.isAxiosError = _helpers_isAxiosError_js__WEBPACK_IMPORTED_MODULE_12__["default"]; 42710 42711// Expose mergeConfig 42712axios.mergeConfig = _core_mergeConfig_js__WEBPACK_IMPORTED_MODULE_3__["default"]; 42713 42714axios.AxiosHeaders = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_13__["default"]; 42715 42716axios.formToJSON = thing => (0,_helpers_formDataToJSON_js__WEBPACK_IMPORTED_MODULE_14__["default"])(_utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isHTMLForm(thing) ? new FormData(thing) : thing); 42717 42718axios.getAdapter = _adapters_adapters_js__WEBPACK_IMPORTED_MODULE_15__["default"].getAdapter; 42719 42720axios.HttpStatusCode = _helpers_HttpStatusCode_js__WEBPACK_IMPORTED_MODULE_16__["default"]; 42721 42722axios.default = axios; 42723 42724// this module should only have a default export 42725/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (axios); 42726 42727 42728/***/ }), 42729
vendor: 3,292 bytes, lines 42730-42866
42730/***/ "./node_modules/axios/lib/cancel/CancelToken.js": 42731/*!******************************************************!*\ 42732 !*** ./node_modules/axios/lib/cancel/CancelToken.js ***! 42733 \******************************************************/ 42734/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42735 42736"use strict"; 42737__webpack_require__.r(__webpack_exports__); 42738/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42739/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 42740/* harmony export */ }); 42741/* harmony import */ var _CanceledError_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./CanceledError.js */ "./node_modules/axios/lib/cancel/CanceledError.js"); 42742 42743 42744 42745 42746/** 42747 * A `CancelToken` is an object that can be used to request cancellation of an operation. 42748 * 42749 * @param {Function} executor The executor function. 42750 * 42751 * @returns {CancelToken} 42752 */ 42753class CancelToken { 42754 constructor(executor) { 42755 if (typeof executor !== 'function') { 42756 throw new TypeError('executor must be a function.'); 42757 } 42758 42759 let resolvePromise; 42760 42761 this.promise = new Promise(function promiseExecutor(resolve) { 42762 resolvePromise = resolve; 42763 }); 42764 42765 const token = this; 42766 42767 // eslint-disable-next-line func-names 42768 this.promise.then(cancel => { 42769 if (!token._listeners) return; 42770 42771 let i = token._listeners.length; 42772 42773 while (i-- > 0) { 42774 token._listeners[i](cancel); 42775 } 42776 token._listeners = null; 42777 }); 42778 42779 // eslint-disable-next-line func-names 42780 this.promise.then = onfulfilled => { 42781 let _resolve; 42782 // eslint-disable-next-line func-names 42783 const promise = new Promise(resolve => { 42784 token.subscribe(resolve); 42785 _resolve = resolve; 42786 }).then(onfulfilled); 42787 42788 promise.cancel = function reject() { 42789 token.unsubscribe(_resolve); 42790 }; 42791 42792 return promise; 42793 }; 42794 42795 executor(function cancel(message, config, request) { 42796 if (token.reason) { 42797 // Cancellation has already been requested 42798 return; 42799 } 42800 42801 token.reason = new _CanceledError_js__WEBPACK_IMPORTED_MODULE_0__["default"](message, config, request); 42802 resolvePromise(token.reason); 42803 }); 42804 } 42805 42806 /** 42807 * Throws a `CanceledError` if cancellation has been requested. 42808 */ 42809 throwIfRequested() { 42810 if (this.reason) { 42811 throw this.reason; 42812 } 42813 } 42814 42815 /** 42816 * Subscribe to the cancel signal 42817 */ 42818 42819 subscribe(listener) { 42820 if (this.reason) { 42821 listener(this.reason); 42822 return; 42823 } 42824 42825 if (this._listeners) { 42826 this._listeners.push(listener); 42827 } else { 42828 this._listeners = [listener]; 42829 } 42830 } 42831 42832 /** 42833 * Unsubscribe from the cancel signal 42834 */ 42835 42836 unsubscribe(listener) { 42837 if (!this._listeners) { 42838 return; 42839 } 42840 const index = this._listeners.indexOf(listener); 42841 if (index !== -1) { 42842 this._listeners.splice(index, 1); 42843 } 42844 } 42845 42846 /** 42847 * Returns an object that contains a new `CancelToken` and a function that, when called, 42848 * cancels the `CancelToken`. 42849 */ 42850 static source() { 42851 let cancel; 42852 const token = new CancelToken(function executor(c) { 42853 cancel = c; 42854 }); 42855 return { 42856 token, 42857 cancel 42858 }; 42859 } 42860} 42861 42862/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CancelToken); 42863 42864 42865/***/ }), 42866
vendor: 1,730 bytes, lines 42867-42908
42867/***/ "./node_modules/axios/lib/cancel/CanceledError.js": 42868/*!********************************************************!*\ 42869 !*** ./node_modules/axios/lib/cancel/CanceledError.js ***! 42870 \********************************************************/ 42871/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42872 42873"use strict"; 42874__webpack_require__.r(__webpack_exports__); 42875/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42876/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 42877/* harmony export */ }); 42878/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 42879/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 42880 42881 42882 42883 42884 42885/** 42886 * A `CanceledError` is an object that is thrown when an operation is canceled. 42887 * 42888 * @param {string=} message The message. 42889 * @param {Object=} config The config. 42890 * @param {Object=} request The request. 42891 * 42892 * @returns {CanceledError} The created error. 42893 */ 42894function CanceledError(message, config, request) { 42895 // eslint-disable-next-line no-eq-null,eqeqeq 42896 _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_0__["default"].call(this, message == null ? 'canceled' : message, _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_0__["default"].ERR_CANCELED, config, request); 42897 this.name = 'CanceledError'; 42898} 42899 42900_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].inherits(CanceledError, _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_0__["default"], { 42901 __CANCEL__: true 42902}); 42903 42904/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (CanceledError); 42905 42906 42907/***/ }), 42908
vendor: 614 bytes, lines 42909-42928
42909/***/ "./node_modules/axios/lib/cancel/isCancel.js": 42910/*!***************************************************!*\ 42911 !*** ./node_modules/axios/lib/cancel/isCancel.js ***! 42912 \***************************************************/ 42913/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42914 42915"use strict"; 42916__webpack_require__.r(__webpack_exports__); 42917/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42918/* harmony export */ "default": () => (/* binding */ isCancel) 42919/* harmony export */ }); 42920 42921 42922function isCancel(value) { 42923 return !!(value && value.__CANCEL__); 42924} 42925 42926 42927/***/ }), 42928
vendor: 8,709 bytes, lines 42929-43176
42929/***/ "./node_modules/axios/lib/core/Axios.js": 42930/*!**********************************************!*\ 42931 !*** ./node_modules/axios/lib/core/Axios.js ***! 42932 \**********************************************/ 42933/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 42934 42935"use strict"; 42936__webpack_require__.r(__webpack_exports__); 42937/* harmony export */ __webpack_require__.d(__webpack_exports__, { 42938/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 42939/* harmony export */ }); 42940/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 42941/* harmony import */ var _helpers_buildURL_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../helpers/buildURL.js */ "./node_modules/axios/lib/helpers/buildURL.js"); 42942/* harmony import */ var _InterceptorManager_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./InterceptorManager.js */ "./node_modules/axios/lib/core/InterceptorManager.js"); 42943/* harmony import */ var _dispatchRequest_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./dispatchRequest.js */ "./node_modules/axios/lib/core/dispatchRequest.js"); 42944/* harmony import */ var _mergeConfig_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./mergeConfig.js */ "./node_modules/axios/lib/core/mergeConfig.js"); 42945/* harmony import */ var _buildFullPath_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./buildFullPath.js */ "./node_modules/axios/lib/core/buildFullPath.js"); 42946/* harmony import */ var _helpers_validator_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../helpers/validator.js */ "./node_modules/axios/lib/helpers/validator.js"); 42947/* harmony import */ var _AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./AxiosHeaders.js */ "./node_modules/axios/lib/core/AxiosHeaders.js"); 42948 42949 42950 42951 42952 42953 42954 42955 42956 42957 42958 42959const validators = _helpers_validator_js__WEBPACK_IMPORTED_MODULE_0__["default"].validators; 42960 42961/** 42962 * Create a new instance of Axios 42963 * 42964 * @param {Object} instanceConfig The default config for the instance 42965 * 42966 * @return {Axios} A new instance of Axios 42967 */ 42968class Axios { 42969 constructor(instanceConfig) { 42970 this.defaults = instanceConfig; 42971 this.interceptors = { 42972 request: new _InterceptorManager_js__WEBPACK_IMPORTED_MODULE_1__["default"](), 42973 response: new _InterceptorManager_js__WEBPACK_IMPORTED_MODULE_1__["default"]() 42974 }; 42975 } 42976 42977 /** 42978 * Dispatch a request 42979 * 42980 * @param {String|Object} configOrUrl The config specific for this request (merged with this.defaults) 42981 * @param {?Object} config 42982 * 42983 * @returns {Promise} The Promise to be fulfilled 42984 */ 42985 async request(configOrUrl, config) { 42986 try { 42987 return await this._request(configOrUrl, config); 42988 } catch (err) { 42989 if (err instanceof Error) { 42990 let dummy; 42991 42992 Error.captureStackTrace ? Error.captureStackTrace(dummy = {}) : (dummy = new Error()); 42993 42994 // slice off the Error: ... line 42995 const stack = dummy.stack ? dummy.stack.replace(/^.+\n/, '') : ''; 42996 42997 if (!err.stack) { 42998 err.stack = stack; 42999 // match without the 2 top stack lines 43000 } else if (stack && !String(err.stack).endsWith(stack.replace(/^.+\n.+\n/, ''))) { 43001 err.stack += '\n' + stack 43002 } 43003 } 43004 43005 throw err; 43006 } 43007 } 43008 43009 _request(configOrUrl, config) { 43010 /*eslint no-param-reassign:0*/ 43011 // Allow for axios('example/url'[, config]) a la fetch API 43012 if (typeof configOrUrl === 'string') { 43013 config = config || {}; 43014 config.url = configOrUrl; 43015 } else { 43016 config = configOrUrl || {}; 43017 } 43018 43019 config = (0,_mergeConfig_js__WEBPACK_IMPORTED_MODULE_2__["default"])(this.defaults, config); 43020 43021 const {transitional, paramsSerializer, headers} = config; 43022 43023 if (transitional !== undefined) { 43024 _helpers_validator_js__WEBPACK_IMPORTED_MODULE_0__["default"].assertOptions(transitional, { 43025 silentJSONParsing: validators.transitional(validators.boolean), 43026 forcedJSONParsing: validators.transitional(validators.boolean), 43027 clarifyTimeoutError: validators.transitional(validators.boolean) 43028 }, false); 43029 } 43030 43031 if (paramsSerializer != null) { 43032 if (_utils_js__WEBPACK_IMPORTED_MODULE_3__["default"].isFunction(paramsSerializer)) { 43033 config.paramsSerializer = { 43034 serialize: paramsSerializer 43035 } 43036 } else { 43037 _helpers_validator_js__WEBPACK_IMPORTED_MODULE_0__["default"].assertOptions(paramsSerializer, { 43038 encode: validators.function, 43039 serialize: validators.function 43040 }, true); 43041 } 43042 } 43043 43044 // Set config.method 43045 config.method = (config.method || this.defaults.method || 'get').toLowerCase(); 43046 43047 // Flatten headers 43048 let contextHeaders = headers && _utils_js__WEBPACK_IMPORTED_MODULE_3__["default"].merge( 43049 headers.common, 43050 headers[config.method] 43051 ); 43052 43053 headers && _utils_js__WEBPACK_IMPORTED_MODULE_3__["default"].forEach( 43054 ['delete', 'get', 'head', 'post', 'put', 'patch', 'common'], 43055 (method) => { 43056 delete headers[method]; 43057 } 43058 ); 43059 43060 config.headers = _AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_4__["default"].concat(contextHeaders, headers); 43061 43062 // filter out skipped interceptors 43063 const requestInterceptorChain = []; 43064 let synchronousRequestInterceptors = true; 43065 this.interceptors.request.forEach(function unshiftRequestInterceptors(interceptor) { 43066 if (typeof interceptor.runWhen === 'function' && interceptor.runWhen(config) === false) { 43067 return; 43068 } 43069 43070 synchronousRequestInterceptors = synchronousRequestInterceptors && interceptor.synchronous; 43071 43072 requestInterceptorChain.unshift(interceptor.fulfilled, interceptor.rejected); 43073 }); 43074 43075 const responseInterceptorChain = []; 43076 this.interceptors.response.forEach(function pushResponseInterceptors(interceptor) { 43077 responseInterceptorChain.push(interceptor.fulfilled, interceptor.rejected); 43078 }); 43079 43080 let promise; 43081 let i = 0; 43082 let len; 43083 43084 if (!synchronousRequestInterceptors) { 43085 const chain = [_dispatchRequest_js__WEBPACK_IMPORTED_MODULE_5__["default"].bind(this), undefined]; 43086 chain.unshift.apply(chain, requestInterceptorChain); 43087 chain.push.apply(chain, responseInterceptorChain); 43088 len = chain.length; 43089 43090 promise = Promise.resolve(config); 43091 43092 while (i < len) { 43093 promise = promise.then(chain[i++], chain[i++]); 43094 } 43095 43096 return promise; 43097 } 43098 43099 len = requestInterceptorChain.length; 43100 43101 let newConfig = config; 43102 43103 i = 0; 43104 43105 while (i < len) { 43106 const onFulfilled = requestInterceptorChain[i++]; 43107 const onRejected = requestInterceptorChain[i++]; 43108 try { 43109 newConfig = onFulfilled(newConfig); 43110 } catch (error) { 43111 onRejected.call(this, error); 43112 break; 43113 } 43114 } 43115 43116 try { 43117 promise = _dispatchRequest_js__WEBPACK_IMPORTED_MODULE_5__["default"].call(this, newConfig); 43118 } catch (error) { 43119 return Promise.reject(error); 43120 } 43121 43122 i = 0; 43123 len = responseInterceptorChain.length; 43124 43125 while (i < len) { 43126 promise = promise.then(responseInterceptorChain[i++], responseInterceptorChain[i++]); 43127 } 43128 43129 return promise; 43130 } 43131 43132 getUri(config) { 43133 config = (0,_mergeConfig_js__WEBPACK_IMPORTED_MODULE_2__["default"])(this.defaults, config); 43134 const fullPath = (0,_buildFullPath_js__WEBPACK_IMPORTED_MODULE_6__["default"])(config.baseURL, config.url); 43135 return (0,_helpers_buildURL_js__WEBPACK_IMPORTED_MODULE_7__["default"])(fullPath, config.params, config.paramsSerializer); 43136 } 43137} 43138 43139// Provide aliases for supported request methods 43140_utils_js__WEBPACK_IMPORTED_MODULE_3__["default"].forEach(['delete', 'get', 'head', 'options'], function forEachMethodNoData(method) { 43141 /*eslint func-names:0*/ 43142 Axios.prototype[method] = function(url, config) { 43143 return this.request((0,_mergeConfig_js__WEBPACK_IMPORTED_MODULE_2__["default"])(config || {}, { 43144 method, 43145 url, 43146 data: (config || {}).data 43147 })); 43148 }; 43149}); 43150 43151_utils_js__WEBPACK_IMPORTED_MODULE_3__["default"].forEach(['post', 'put', 'patch'], function forEachMethodWithData(method) { 43152 /*eslint func-names:0*/ 43153 43154 function generateHTTPMethod(isForm) { 43155 return function httpMethod(url, data, config) { 43156 return this.request((0,_mergeConfig_js__WEBPACK_IMPORTED_MODULE_2__["default"])(config || {}, { 43157 method, 43158 headers: isForm ? { 43159 'Content-Type': 'multipart/form-data' 43160 } : {}, 43161 url, 43162 data 43163 })); 43164 }; 43165 } 43166 43167 Axios.prototype[method] = generateHTTPMethod(); 43168 43169 Axios.prototype[method + 'Form'] = generateHTTPMethod(true); 43170}); 43171 43172/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Axios); 43173 43174 43175/***/ }), 43176
vendor: 3,360 bytes, lines 43177-43292
43177/***/ "./node_modules/axios/lib/core/AxiosError.js": 43178/*!***************************************************!*\ 43179 !*** ./node_modules/axios/lib/core/AxiosError.js ***! 43180 \***************************************************/ 43181/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43182 43183"use strict"; 43184__webpack_require__.r(__webpack_exports__); 43185/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43186/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 43187/* harmony export */ }); 43188/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 43189 43190 43191 43192 43193/** 43194 * Create an Error with the specified message, config, error code, request and response. 43195 * 43196 * @param {string} message The error message. 43197 * @param {string} [code] The error code (for example, 'ECONNABORTED'). 43198 * @param {Object} [config] The config. 43199 * @param {Object} [request] The request. 43200 * @param {Object} [response] The response. 43201 * 43202 * @returns {Error} The created error. 43203 */ 43204function AxiosError(message, code, config, request, response) { 43205 Error.call(this); 43206 43207 if (Error.captureStackTrace) { 43208 Error.captureStackTrace(this, this.constructor); 43209 } else { 43210 this.stack = (new Error()).stack; 43211 } 43212 43213 this.message = message; 43214 this.name = 'AxiosError'; 43215 code && (this.code = code); 43216 config && (this.config = config); 43217 request && (this.request = request); 43218 response && (this.response = response); 43219} 43220 43221_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].inherits(AxiosError, Error, { 43222 toJSON: function toJSON() { 43223 return { 43224 // Standard 43225 message: this.message, 43226 name: this.name, 43227 // Microsoft 43228 description: this.description, 43229 number: this.number, 43230 // Mozilla 43231 fileName: this.fileName, 43232 lineNumber: this.lineNumber, 43233 columnNumber: this.columnNumber, 43234 stack: this.stack, 43235 // Axios 43236 config: _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toJSONObject(this.config), 43237 code: this.code, 43238 status: this.response && this.response.status ? this.response.status : null 43239 }; 43240 } 43241}); 43242 43243const prototype = AxiosError.prototype; 43244const descriptors = {}; 43245 43246[ 43247 'ERR_BAD_OPTION_VALUE', 43248 'ERR_BAD_OPTION', 43249 'ECONNABORTED', 43250 'ETIMEDOUT', 43251 'ERR_NETWORK', 43252 'ERR_FR_TOO_MANY_REDIRECTS', 43253 'ERR_DEPRECATED', 43254 'ERR_BAD_RESPONSE', 43255 'ERR_BAD_REQUEST', 43256 'ERR_CANCELED', 43257 'ERR_NOT_SUPPORT', 43258 'ERR_INVALID_URL' 43259// eslint-disable-next-line func-names 43260].forEach(code => { 43261 descriptors[code] = {value: code}; 43262}); 43263 43264Object.defineProperties(AxiosError, descriptors); 43265Object.defineProperty(prototype, 'isAxiosError', {value: true}); 43266 43267// eslint-disable-next-line func-names 43268AxiosError.from = (error, code, config, request, response, customProps) => { 43269 const axiosError = Object.create(prototype); 43270 43271 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toFlatObject(error, axiosError, function filter(obj) { 43272 return obj !== Error.prototype; 43273 }, prop => { 43274 return prop !== 'isAxiosError'; 43275 }); 43276 43277 AxiosError.call(axiosError, error.message, code, config, request, response); 43278 43279 axiosError.cause = error; 43280 43281 axiosError.name = error.name; 43282 43283 customProps && Object.assign(axiosError, customProps); 43284 43285 return axiosError; 43286}; 43287 43288/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (AxiosError); 43289 43290 43291/***/ }), 43292
vendor: 8,795 bytes, lines 43293-43607
43293/***/ "./node_modules/axios/lib/core/AxiosHeaders.js": 43294/*!*****************************************************!*\ 43295 !*** ./node_modules/axios/lib/core/AxiosHeaders.js ***! 43296 \*****************************************************/ 43297/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43298 43299"use strict"; 43300__webpack_require__.r(__webpack_exports__); 43301/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43302/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 43303/* harmony export */ }); 43304/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 43305/* harmony import */ var _helpers_parseHeaders_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../helpers/parseHeaders.js */ "./node_modules/axios/lib/helpers/parseHeaders.js"); 43306 43307 43308 43309 43310 43311const $internals = Symbol('internals'); 43312 43313function normalizeHeader(header) { 43314 return header && String(header).trim().toLowerCase(); 43315} 43316 43317function normalizeValue(value) { 43318 if (value === false || value == null) { 43319 return value; 43320 } 43321 43322 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(value) ? value.map(normalizeValue) : String(value); 43323} 43324 43325function parseTokens(str) { 43326 const tokens = Object.create(null); 43327 const tokensRE = /([^\s,;=]+)\s*(?:=\s*([^,;]+))?/g; 43328 let match; 43329 43330 while ((match = tokensRE.exec(str))) { 43331 tokens[match[1]] = match[2]; 43332 } 43333 43334 return tokens; 43335} 43336 43337const isValidHeaderName = (str) => /^[-_a-zA-Z0-9^`|~,!#$%&'*+.]+$/.test(str.trim()); 43338 43339function matchHeaderValue(context, value, header, filter, isHeaderNameFilter) { 43340 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFunction(filter)) { 43341 return filter.call(this, value, header); 43342 } 43343 43344 if (isHeaderNameFilter) { 43345 value = header; 43346 } 43347 43348 if (!_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isString(value)) return; 43349 43350 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isString(filter)) { 43351 return value.indexOf(filter) !== -1; 43352 } 43353 43354 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isRegExp(filter)) { 43355 return filter.test(value); 43356 } 43357} 43358 43359function formatHeader(header) { 43360 return header.trim() 43361 .toLowerCase().replace(/([a-z\d])(\w*)/g, (w, char, str) => { 43362 return char.toUpperCase() + str; 43363 }); 43364} 43365 43366function buildAccessors(obj, header) { 43367 const accessorName = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toCamelCase(' ' + header); 43368 43369 ['get', 'set', 'has'].forEach(methodName => { 43370 Object.defineProperty(obj, methodName + accessorName, { 43371 value: function(arg1, arg2, arg3) { 43372 return this[methodName].call(this, header, arg1, arg2, arg3); 43373 }, 43374 configurable: true 43375 }); 43376 }); 43377} 43378 43379class AxiosHeaders { 43380 constructor(headers) { 43381 headers && this.set(headers); 43382 } 43383 43384 set(header, valueOrRewrite, rewrite) { 43385 const self = this; 43386 43387 function setHeader(_value, _header, _rewrite) { 43388 const lHeader = normalizeHeader(_header); 43389 43390 if (!lHeader) { 43391 throw new Error('header name must be a non-empty string'); 43392 } 43393 43394 const key = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].findKey(self, lHeader); 43395 43396 if(!key || self[key] === undefined || _rewrite === true || (_rewrite === undefined && self[key] !== false)) { 43397 self[key || _header] = normalizeValue(_value); 43398 } 43399 } 43400 43401 const setHeaders = (headers, _rewrite) => 43402 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEach(headers, (_value, _header) => setHeader(_value, _header, _rewrite)); 43403 43404 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isPlainObject(header) || header instanceof this.constructor) { 43405 setHeaders(header, valueOrRewrite) 43406 } else if(_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isString(header) && (header = header.trim()) && !isValidHeaderName(header)) { 43407 setHeaders((0,_helpers_parseHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"])(header), valueOrRewrite); 43408 } else { 43409 header != null && setHeader(valueOrRewrite, header, rewrite); 43410 } 43411 43412 return this; 43413 } 43414 43415 get(header, parser) { 43416 header = normalizeHeader(header); 43417 43418 if (header) { 43419 const key = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].findKey(this, header); 43420 43421 if (key) { 43422 const value = this[key]; 43423 43424 if (!parser) { 43425 return value; 43426 } 43427 43428 if (parser === true) { 43429 return parseTokens(value); 43430 } 43431 43432 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFunction(parser)) { 43433 return parser.call(this, value, key); 43434 } 43435 43436 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isRegExp(parser)) { 43437 return parser.exec(value); 43438 } 43439 43440 throw new TypeError('parser must be boolean|regexp|function'); 43441 } 43442 } 43443 } 43444 43445 has(header, matcher) { 43446 header = normalizeHeader(header); 43447 43448 if (header) { 43449 const key = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].findKey(this, header); 43450 43451 return !!(key && this[key] !== undefined && (!matcher || matchHeaderValue(this, this[key], key, matcher))); 43452 } 43453 43454 return false; 43455 } 43456 43457 delete(header, matcher) { 43458 const self = this; 43459 let deleted = false; 43460 43461 function deleteHeader(_header) { 43462 _header = normalizeHeader(_header); 43463 43464 if (_header) { 43465 const key = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].findKey(self, _header); 43466 43467 if (key && (!matcher || matchHeaderValue(self, self[key], key, matcher))) { 43468 delete self[key]; 43469 43470 deleted = true; 43471 } 43472 } 43473 } 43474 43475 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(header)) { 43476 header.forEach(deleteHeader); 43477 } else { 43478 deleteHeader(header); 43479 } 43480 43481 return deleted; 43482 } 43483 43484 clear(matcher) { 43485 const keys = Object.keys(this); 43486 let i = keys.length; 43487 let deleted = false; 43488 43489 while (i--) { 43490 const key = keys[i]; 43491 if(!matcher || matchHeaderValue(this, this[key], key, matcher, true)) { 43492 delete this[key]; 43493 deleted = true; 43494 } 43495 } 43496 43497 return deleted; 43498 } 43499 43500 normalize(format) { 43501 const self = this; 43502 const headers = {}; 43503 43504 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEach(this, (value, header) => { 43505 const key = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].findKey(headers, header); 43506 43507 if (key) { 43508 self[key] = normalizeValue(value); 43509 delete self[header]; 43510 return; 43511 } 43512 43513 const normalized = format ? formatHeader(header) : String(header).trim(); 43514 43515 if (normalized !== header) { 43516 delete self[header]; 43517 } 43518 43519 self[normalized] = normalizeValue(value); 43520 43521 headers[normalized] = true; 43522 }); 43523 43524 return this; 43525 } 43526 43527 concat(...targets) { 43528 return this.constructor.concat(this, ...targets); 43529 } 43530 43531 toJSON(asStrings) { 43532 const obj = Object.create(null); 43533 43534 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEach(this, (value, header) => { 43535 value != null && value !== false && (obj[header] = asStrings && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(value) ? value.join(', ') : value); 43536 }); 43537 43538 return obj; 43539 } 43540 43541 [Symbol.iterator]() { 43542 return Object.entries(this.toJSON())[Symbol.iterator](); 43543 } 43544 43545 toString() { 43546 return Object.entries(this.toJSON()).map(([header, value]) => header + ': ' + value).join('\n'); 43547 } 43548 43549 get [Symbol.toStringTag]() { 43550 return 'AxiosHeaders'; 43551 } 43552 43553 static from(thing) { 43554 return thing instanceof this ? thing : new this(thing); 43555 } 43556 43557 static concat(first, ...targets) { 43558 const computed = new this(first); 43559 43560 targets.forEach((target) => computed.set(target)); 43561 43562 return computed; 43563 } 43564 43565 static accessor(header) { 43566 const internals = this[$internals] = (this[$internals] = { 43567 accessors: {} 43568 }); 43569 43570 const accessors = internals.accessors; 43571 const prototype = this.prototype; 43572 43573 function defineAccessor(_header) { 43574 const lHeader = normalizeHeader(_header); 43575 43576 if (!accessors[lHeader]) { 43577 buildAccessors(prototype, _header); 43578 accessors[lHeader] = true; 43579 } 43580 } 43581 43582 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(header) ? header.forEach(defineAccessor) : defineAccessor(header); 43583 43584 return this; 43585 } 43586} 43587 43588AxiosHeaders.accessor(['Content-Type', 'Content-Length', 'Accept', 'Accept-Encoding', 'User-Agent', 'Authorization']); 43589 43590// reserved names hotfix 43591_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].reduceDescriptors(AxiosHeaders.prototype, ({value}, key) => { 43592 let mapped = key[0].toUpperCase() + key.slice(1); // map `set` => `Set` 43593 return { 43594 get: () => value, 43595 set(headerValue) { 43596 this[mapped] = headerValue; 43597 } 43598 } 43599}); 43600 43601_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].freezeMethods(AxiosHeaders); 43602 43603/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (AxiosHeaders); 43604 43605 43606/***/ }), 43607
vendor: 2,341 bytes, lines 43608-43694
43608/***/ "./node_modules/axios/lib/core/InterceptorManager.js": 43609/*!***********************************************************!*\ 43610 !*** ./node_modules/axios/lib/core/InterceptorManager.js ***! 43611 \***********************************************************/ 43612/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43613 43614"use strict"; 43615__webpack_require__.r(__webpack_exports__); 43616/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43617/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 43618/* harmony export */ }); 43619/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 43620 43621 43622 43623 43624class InterceptorManager { 43625 constructor() { 43626 this.handlers = []; 43627 } 43628 43629 /** 43630 * Add a new interceptor to the stack 43631 * 43632 * @param {Function} fulfilled The function to handle `then` for a `Promise` 43633 * @param {Function} rejected The function to handle `reject` for a `Promise` 43634 * 43635 * @return {Number} An ID used to remove interceptor later 43636 */ 43637 use(fulfilled, rejected, options) { 43638 this.handlers.push({ 43639 fulfilled, 43640 rejected, 43641 synchronous: options ? options.synchronous : false, 43642 runWhen: options ? options.runWhen : null 43643 }); 43644 return this.handlers.length - 1; 43645 } 43646 43647 /** 43648 * Remove an interceptor from the stack 43649 * 43650 * @param {Number} id The ID that was returned by `use` 43651 * 43652 * @returns {Boolean} `true` if the interceptor was removed, `false` otherwise 43653 */ 43654 eject(id) { 43655 if (this.handlers[id]) { 43656 this.handlers[id] = null; 43657 } 43658 } 43659 43660 /** 43661 * Clear all interceptors from the stack 43662 * 43663 * @returns {void} 43664 */ 43665 clear() { 43666 if (this.handlers) { 43667 this.handlers = []; 43668 } 43669 } 43670 43671 /** 43672 * Iterate over all the registered interceptors 43673 * 43674 * This method is particularly useful for skipping over any 43675 * interceptors that may have become `null` calling `eject`. 43676 * 43677 * @param {Function} fn The function to call for each interceptor 43678 * 43679 * @returns {void} 43680 */ 43681 forEach(fn) { 43682 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEach(this.handlers, function forEachHandler(h) { 43683 if (h !== null) { 43684 fn(h); 43685 } 43686 }); 43687 } 43688} 43689 43690/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (InterceptorManager); 43691 43692 43693/***/ }), 43694
vendor: 1,607 bytes, lines 43695-43732
43695/***/ "./node_modules/axios/lib/core/buildFullPath.js": 43696/*!******************************************************!*\ 43697 !*** ./node_modules/axios/lib/core/buildFullPath.js ***! 43698 \******************************************************/ 43699/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43700 43701"use strict"; 43702__webpack_require__.r(__webpack_exports__); 43703/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43704/* harmony export */ "default": () => (/* binding */ buildFullPath) 43705/* harmony export */ }); 43706/* harmony import */ var _helpers_isAbsoluteURL_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../helpers/isAbsoluteURL.js */ "./node_modules/axios/lib/helpers/isAbsoluteURL.js"); 43707/* harmony import */ var _helpers_combineURLs_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../helpers/combineURLs.js */ "./node_modules/axios/lib/helpers/combineURLs.js"); 43708 43709 43710 43711 43712 43713/** 43714 * Creates a new URL by combining the baseURL with the requestedURL, 43715 * only when the requestedURL is not already an absolute URL. 43716 * If the requestURL is absolute, this function returns the requestedURL untouched. 43717 * 43718 * @param {string} baseURL The base URL 43719 * @param {string} requestedURL Absolute or relative URL to combine 43720 * 43721 * @returns {string} The combined full path 43722 */ 43723function buildFullPath(baseURL, requestedURL) { 43724 if (baseURL && !(0,_helpers_isAbsoluteURL_js__WEBPACK_IMPORTED_MODULE_0__["default"])(requestedURL)) { 43725 return (0,_helpers_combineURLs_js__WEBPACK_IMPORTED_MODULE_1__["default"])(baseURL, requestedURL); 43726 } 43727 return requestedURL; 43728} 43729 43730 43731/***/ }), 43732
vendor: 3,988 bytes, lines 43733-43834
43733/***/ "./node_modules/axios/lib/core/dispatchRequest.js": 43734/*!********************************************************!*\ 43735 !*** ./node_modules/axios/lib/core/dispatchRequest.js ***! 43736 \********************************************************/ 43737/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43738 43739"use strict"; 43740__webpack_require__.r(__webpack_exports__); 43741/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43742/* harmony export */ "default": () => (/* binding */ dispatchRequest) 43743/* harmony export */ }); 43744/* harmony import */ var _transformData_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./transformData.js */ "./node_modules/axios/lib/core/transformData.js"); 43745/* harmony import */ var _cancel_isCancel_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../cancel/isCancel.js */ "./node_modules/axios/lib/cancel/isCancel.js"); 43746/* harmony import */ var _defaults_index_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../defaults/index.js */ "./node_modules/axios/lib/defaults/index.js"); 43747/* harmony import */ var _cancel_CanceledError_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../cancel/CanceledError.js */ "./node_modules/axios/lib/cancel/CanceledError.js"); 43748/* harmony import */ var _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/AxiosHeaders.js */ "./node_modules/axios/lib/core/AxiosHeaders.js"); 43749/* harmony import */ var _adapters_adapters_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../adapters/adapters.js */ "./node_modules/axios/lib/adapters/adapters.js"); 43750 43751 43752 43753 43754 43755 43756 43757 43758 43759/** 43760 * Throws a `CanceledError` if cancellation has been requested. 43761 * 43762 * @param {Object} config The config that is to be used for the request 43763 * 43764 * @returns {void} 43765 */ 43766function throwIfCancellationRequested(config) { 43767 if (config.cancelToken) { 43768 config.cancelToken.throwIfRequested(); 43769 } 43770 43771 if (config.signal && config.signal.aborted) { 43772 throw new _cancel_CanceledError_js__WEBPACK_IMPORTED_MODULE_0__["default"](null, config); 43773 } 43774} 43775 43776/** 43777 * Dispatch a request to the server using the configured adapter. 43778 * 43779 * @param {object} config The config that is to be used for the request 43780 * 43781 * @returns {Promise} The Promise to be fulfilled 43782 */ 43783function dispatchRequest(config) { 43784 throwIfCancellationRequested(config); 43785 43786 config.headers = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"].from(config.headers); 43787 43788 // Transform request data 43789 config.data = _transformData_js__WEBPACK_IMPORTED_MODULE_2__["default"].call( 43790 config, 43791 config.transformRequest 43792 ); 43793 43794 if (['post', 'put', 'patch'].indexOf(config.method) !== -1) { 43795 config.headers.setContentType('application/x-www-form-urlencoded', false); 43796 } 43797 43798 const adapter = _adapters_adapters_js__WEBPACK_IMPORTED_MODULE_3__["default"].getAdapter(config.adapter || _defaults_index_js__WEBPACK_IMPORTED_MODULE_4__["default"].adapter); 43799 43800 return adapter(config).then(function onAdapterResolution(response) { 43801 throwIfCancellationRequested(config); 43802 43803 // Transform response data 43804 response.data = _transformData_js__WEBPACK_IMPORTED_MODULE_2__["default"].call( 43805 config, 43806 config.transformResponse, 43807 response 43808 ); 43809 43810 response.headers = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"].from(response.headers); 43811 43812 return response; 43813 }, function onAdapterRejection(reason) { 43814 if (!(0,_cancel_isCancel_js__WEBPACK_IMPORTED_MODULE_5__["default"])(reason)) { 43815 throwIfCancellationRequested(config); 43816 43817 // Transform response data 43818 if (reason && reason.response) { 43819 reason.response.data = _transformData_js__WEBPACK_IMPORTED_MODULE_2__["default"].call( 43820 config, 43821 config.transformResponse, 43822 reason.response 43823 ); 43824 reason.response.headers = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"].from(reason.response.headers); 43825 } 43826 } 43827 43828 return Promise.reject(reason); 43829 }); 43830} 43831 43832 43833/***/ }), 43834
vendor: 4,750 bytes, lines 43835-43957
43835/***/ "./node_modules/axios/lib/core/mergeConfig.js": 43836/*!****************************************************!*\ 43837 !*** ./node_modules/axios/lib/core/mergeConfig.js ***! 43838 \****************************************************/ 43839/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43840 43841"use strict"; 43842__webpack_require__.r(__webpack_exports__); 43843/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43844/* harmony export */ "default": () => (/* binding */ mergeConfig) 43845/* harmony export */ }); 43846/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 43847/* harmony import */ var _AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./AxiosHeaders.js */ "./node_modules/axios/lib/core/AxiosHeaders.js"); 43848 43849 43850 43851 43852 43853const headersToObject = (thing) => thing instanceof _AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_0__["default"] ? thing.toJSON() : thing; 43854 43855/** 43856 * Config-specific merge-function which creates a new config-object 43857 * by merging two configuration objects together. 43858 * 43859 * @param {Object} config1 43860 * @param {Object} config2 43861 * 43862 * @returns {Object} New object resulting from merging config2 to config1 43863 */ 43864function mergeConfig(config1, config2) { 43865 // eslint-disable-next-line no-param-reassign 43866 config2 = config2 || {}; 43867 const config = {}; 43868 43869 function getMergedValue(target, source, caseless) { 43870 if (_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isPlainObject(target) && _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isPlainObject(source)) { 43871 return _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].merge.call({caseless}, target, source); 43872 } else if (_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isPlainObject(source)) { 43873 return _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].merge({}, source); 43874 } else if (_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isArray(source)) { 43875 return source.slice(); 43876 } 43877 return source; 43878 } 43879 43880 // eslint-disable-next-line consistent-return 43881 function mergeDeepProperties(a, b, caseless) { 43882 if (!_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isUndefined(b)) { 43883 return getMergedValue(a, b, caseless); 43884 } else if (!_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isUndefined(a)) { 43885 return getMergedValue(undefined, a, caseless); 43886 } 43887 } 43888 43889 // eslint-disable-next-line consistent-return 43890 function valueFromConfig2(a, b) { 43891 if (!_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isUndefined(b)) { 43892 return getMergedValue(undefined, b); 43893 } 43894 } 43895 43896 // eslint-disable-next-line consistent-return 43897 function defaultToConfig2(a, b) { 43898 if (!_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isUndefined(b)) { 43899 return getMergedValue(undefined, b); 43900 } else if (!_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isUndefined(a)) { 43901 return getMergedValue(undefined, a); 43902 } 43903 } 43904 43905 // eslint-disable-next-line consistent-return 43906 function mergeDirectKeys(a, b, prop) { 43907 if (prop in config2) { 43908 return getMergedValue(a, b); 43909 } else if (prop in config1) { 43910 return getMergedValue(undefined, a); 43911 } 43912 } 43913 43914 const mergeMap = { 43915 url: valueFromConfig2, 43916 method: valueFromConfig2, 43917 data: valueFromConfig2, 43918 baseURL: defaultToConfig2, 43919 transformRequest: defaultToConfig2, 43920 transformResponse: defaultToConfig2, 43921 paramsSerializer: defaultToConfig2, 43922 timeout: defaultToConfig2, 43923 timeoutMessage: defaultToConfig2, 43924 withCredentials: defaultToConfig2, 43925 withXSRFToken: defaultToConfig2, 43926 adapter: defaultToConfig2, 43927 responseType: defaultToConfig2, 43928 xsrfCookieName: defaultToConfig2, 43929 xsrfHeaderName: defaultToConfig2, 43930 onUploadProgress: defaultToConfig2, 43931 onDownloadProgress: defaultToConfig2, 43932 decompress: defaultToConfig2, 43933 maxContentLength: defaultToConfig2, 43934 maxBodyLength: defaultToConfig2, 43935 beforeRedirect: defaultToConfig2, 43936 transport: defaultToConfig2, 43937 httpAgent: defaultToConfig2, 43938 httpsAgent: defaultToConfig2, 43939 cancelToken: defaultToConfig2, 43940 socketPath: defaultToConfig2, 43941 responseEncoding: defaultToConfig2, 43942 validateStatus: mergeDirectKeys, 43943 headers: (a, b) => mergeDeepProperties(headersToObject(a), headersToObject(b), true) 43944 }; 43945 43946 _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].forEach(Object.keys(Object.assign({}, config1, config2)), function computeConfigValue(prop) { 43947 const merge = mergeMap[prop] || mergeDeepProperties; 43948 const configValue = merge(config1[prop], config2[prop], prop); 43949 (_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isUndefined(configValue) && merge !== mergeDirectKeys) || (config[prop] = configValue); 43950 }); 43951 43952 return config; 43953} 43954 43955 43956/***/ }), 43957
vendor: 1,586 bytes, lines 43958-44000
43958/***/ "./node_modules/axios/lib/core/settle.js": 43959/*!***********************************************!*\ 43960 !*** ./node_modules/axios/lib/core/settle.js ***! 43961 \***********************************************/ 43962/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 43963 43964"use strict"; 43965__webpack_require__.r(__webpack_exports__); 43966/* harmony export */ __webpack_require__.d(__webpack_exports__, { 43967/* harmony export */ "default": () => (/* binding */ settle) 43968/* harmony export */ }); 43969/* harmony import */ var _AxiosError_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 43970 43971 43972 43973 43974/** 43975 * Resolve or reject a Promise based on response status. 43976 * 43977 * @param {Function} resolve A function that resolves the promise. 43978 * @param {Function} reject A function that rejects the promise. 43979 * @param {object} response The response. 43980 * 43981 * @returns {object} The response. 43982 */ 43983function settle(resolve, reject, response) { 43984 const validateStatus = response.config.validateStatus; 43985 if (!response.status || !validateStatus || validateStatus(response.status)) { 43986 resolve(response); 43987 } else { 43988 reject(new _AxiosError_js__WEBPACK_IMPORTED_MODULE_0__["default"]( 43989 'Request failed with status code ' + response.status, 43990 [_AxiosError_js__WEBPACK_IMPORTED_MODULE_0__["default"].ERR_BAD_REQUEST, _AxiosError_js__WEBPACK_IMPORTED_MODULE_0__["default"].ERR_BAD_RESPONSE][Math.floor(response.status / 100) - 4], 43991 response.config, 43992 response.request, 43993 response 43994 )); 43995 } 43996} 43997 43998 43999/***/ }), 44000
vendor: 1,818 bytes, lines 44001-44046
44001/***/ "./node_modules/axios/lib/core/transformData.js": 44002/*!******************************************************!*\ 44003 !*** ./node_modules/axios/lib/core/transformData.js ***! 44004 \******************************************************/ 44005/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44006 44007"use strict"; 44008__webpack_require__.r(__webpack_exports__); 44009/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44010/* harmony export */ "default": () => (/* binding */ transformData) 44011/* harmony export */ }); 44012/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 44013/* harmony import */ var _defaults_index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../defaults/index.js */ "./node_modules/axios/lib/defaults/index.js"); 44014/* harmony import */ var _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/AxiosHeaders.js */ "./node_modules/axios/lib/core/AxiosHeaders.js"); 44015 44016 44017 44018 44019 44020 44021/** 44022 * Transform the data for a request or a response 44023 * 44024 * @param {Array|Function} fns A single function or Array of functions 44025 * @param {?Object} response The response object 44026 * 44027 * @returns {*} The resulting transformed data 44028 */ 44029function transformData(fns, response) { 44030 const config = this || _defaults_index_js__WEBPACK_IMPORTED_MODULE_0__["default"]; 44031 const context = response || config; 44032 const headers = _core_AxiosHeaders_js__WEBPACK_IMPORTED_MODULE_1__["default"].from(context.headers); 44033 let data = context.data; 44034 44035 _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].forEach(fns, function transform(fn) { 44036 data = fn.call(config, data, headers.normalize(), response ? response.status : undefined); 44037 }); 44038 44039 headers.normalize(); 44040 44041 return data; 44042} 44043 44044 44045/***/ }), 44046
vendor: 6,871 bytes, lines 44047-44224
44047/***/ "./node_modules/axios/lib/defaults/index.js": 44048/*!**************************************************!*\ 44049 !*** ./node_modules/axios/lib/defaults/index.js ***! 44050 \**************************************************/ 44051/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44052 44053"use strict"; 44054__webpack_require__.r(__webpack_exports__); 44055/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44056/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44057/* harmony export */ }); 44058/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 44059/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 44060/* harmony import */ var _transitional_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./transitional.js */ "./node_modules/axios/lib/defaults/transitional.js"); 44061/* harmony import */ var _helpers_toFormData_js__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../helpers/toFormData.js */ "./node_modules/axios/lib/helpers/toFormData.js"); 44062/* harmony import */ var _helpers_toURLEncodedForm_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../helpers/toURLEncodedForm.js */ "./node_modules/axios/lib/helpers/toURLEncodedForm.js"); 44063/* harmony import */ var _platform_index_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../platform/index.js */ "./node_modules/axios/lib/platform/index.js"); 44064/* harmony import */ var _helpers_formDataToJSON_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../helpers/formDataToJSON.js */ "./node_modules/axios/lib/helpers/formDataToJSON.js"); 44065 44066 44067 44068 44069 44070 44071 44072 44073 44074 44075/** 44076 * It takes a string, tries to parse it, and if it fails, it returns the stringified version 44077 * of the input 44078 * 44079 * @param {any} rawValue - The value to be stringified. 44080 * @param {Function} parser - A function that parses a string into a JavaScript object. 44081 * @param {Function} encoder - A function that takes a value and returns a string. 44082 * 44083 * @returns {string} A stringified version of the rawValue. 44084 */ 44085function stringifySafely(rawValue, parser, encoder) { 44086 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isString(rawValue)) { 44087 try { 44088 (parser || JSON.parse)(rawValue); 44089 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].trim(rawValue); 44090 } catch (e) { 44091 if (e.name !== 'SyntaxError') { 44092 throw e; 44093 } 44094 } 44095 } 44096 44097 return (encoder || JSON.stringify)(rawValue); 44098} 44099 44100const defaults = { 44101 44102 transitional: _transitional_js__WEBPACK_IMPORTED_MODULE_1__["default"], 44103 44104 adapter: ['xhr', 'http'], 44105 44106 transformRequest: [function transformRequest(data, headers) { 44107 const contentType = headers.getContentType() || ''; 44108 const hasJSONContentType = contentType.indexOf('application/json') > -1; 44109 const isObjectPayload = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isObject(data); 44110 44111 if (isObjectPayload && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isHTMLForm(data)) { 44112 data = new FormData(data); 44113 } 44114 44115 const isFormData = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFormData(data); 44116 44117 if (isFormData) { 44118 return hasJSONContentType ? JSON.stringify((0,_helpers_formDataToJSON_js__WEBPACK_IMPORTED_MODULE_2__["default"])(data)) : data; 44119 } 44120 44121 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArrayBuffer(data) || 44122 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isBuffer(data) || 44123 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isStream(data) || 44124 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFile(data) || 44125 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isBlob(data) 44126 ) { 44127 return data; 44128 } 44129 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArrayBufferView(data)) { 44130 return data.buffer; 44131 } 44132 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isURLSearchParams(data)) { 44133 headers.setContentType('application/x-www-form-urlencoded;charset=utf-8', false); 44134 return data.toString(); 44135 } 44136 44137 let isFileList; 44138 44139 if (isObjectPayload) { 44140 if (contentType.indexOf('application/x-www-form-urlencoded') > -1) { 44141 return (0,_helpers_toURLEncodedForm_js__WEBPACK_IMPORTED_MODULE_3__["default"])(data, this.formSerializer).toString(); 44142 } 44143 44144 if ((isFileList = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFileList(data)) || contentType.indexOf('multipart/form-data') > -1) { 44145 const _FormData = this.env && this.env.FormData; 44146 44147 return (0,_helpers_toFormData_js__WEBPACK_IMPORTED_MODULE_4__["default"])( 44148 isFileList ? {'files[]': data} : data, 44149 _FormData && new _FormData(), 44150 this.formSerializer 44151 ); 44152 } 44153 } 44154 44155 if (isObjectPayload || hasJSONContentType ) { 44156 headers.setContentType('application/json', false); 44157 return stringifySafely(data); 44158 } 44159 44160 return data; 44161 }], 44162 44163 transformResponse: [function transformResponse(data) { 44164 const transitional = this.transitional || defaults.transitional; 44165 const forcedJSONParsing = transitional && transitional.forcedJSONParsing; 44166 const JSONRequested = this.responseType === 'json'; 44167 44168 if (data && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isString(data) && ((forcedJSONParsing && !this.responseType) || JSONRequested)) { 44169 const silentJSONParsing = transitional && transitional.silentJSONParsing; 44170 const strictJSONParsing = !silentJSONParsing && JSONRequested; 44171 44172 try { 44173 return JSON.parse(data); 44174 } catch (e) { 44175 if (strictJSONParsing) { 44176 if (e.name === 'SyntaxError') { 44177 throw _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_5__["default"].from(e, _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_5__["default"].ERR_BAD_RESPONSE, this, null, this.response); 44178 } 44179 throw e; 44180 } 44181 } 44182 } 44183 44184 return data; 44185 }], 44186 44187 /** 44188 * A timeout in milliseconds to abort a request. If set to 0 (default) a 44189 * timeout is not created. 44190 */ 44191 timeout: 0, 44192 44193 xsrfCookieName: 'XSRF-TOKEN', 44194 xsrfHeaderName: 'X-XSRF-TOKEN', 44195 44196 maxContentLength: -1, 44197 maxBodyLength: -1, 44198 44199 env: { 44200 FormData: _platform_index_js__WEBPACK_IMPORTED_MODULE_6__["default"].classes.FormData, 44201 Blob: _platform_index_js__WEBPACK_IMPORTED_MODULE_6__["default"].classes.Blob 44202 }, 44203 44204 validateStatus: function validateStatus(status) { 44205 return status >= 200 && status < 300; 44206 }, 44207 44208 headers: { 44209 common: { 44210 'Accept': 'application/json, text/plain, */*', 44211 'Content-Type': undefined 44212 } 44213 } 44214}; 44215 44216_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEach(['delete', 'get', 'head', 'post', 'put', 'patch'], (method) => { 44217 defaults.headers[method] = {}; 44218}); 44219 44220/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (defaults); 44221 44222 44223/***/ }), 44224
vendor: 727 bytes, lines 44225-44246
44225/***/ "./node_modules/axios/lib/defaults/transitional.js": 44226/*!*********************************************************!*\ 44227 !*** ./node_modules/axios/lib/defaults/transitional.js ***! 44228 \*********************************************************/ 44229/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44230 44231"use strict"; 44232__webpack_require__.r(__webpack_exports__); 44233/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44234/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44235/* harmony export */ }); 44236 44237 44238/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ 44239 silentJSONParsing: true, 44240 forcedJSONParsing: true, 44241 clarifyTimeoutError: false 44242}); 44243 44244 44245/***/ }), 44246
vendor: 536 bytes, lines 44247-44261
44247/***/ "./node_modules/axios/lib/env/data.js": 44248/*!********************************************!*\ 44249 !*** ./node_modules/axios/lib/env/data.js ***! 44250 \********************************************/ 44251/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44252 44253"use strict"; 44254__webpack_require__.r(__webpack_exports__); 44255/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44256/* harmony export */ VERSION: () => (/* binding */ VERSION) 44257/* harmony export */ }); 44258const VERSION = "1.6.7"; 44259 44260/***/ }), 44261
vendor: 2,248 bytes, lines 44262-44335
44262/***/ "./node_modules/axios/lib/helpers/AxiosURLSearchParams.js": 44263/*!****************************************************************!*\ 44264 !*** ./node_modules/axios/lib/helpers/AxiosURLSearchParams.js ***! 44265 \****************************************************************/ 44266/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44267 44268"use strict"; 44269__webpack_require__.r(__webpack_exports__); 44270/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44271/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44272/* harmony export */ }); 44273/* harmony import */ var _toFormData_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./toFormData.js */ "./node_modules/axios/lib/helpers/toFormData.js"); 44274 44275 44276 44277 44278/** 44279 * It encodes a string by replacing all characters that are not in the unreserved set with 44280 * their percent-encoded equivalents 44281 * 44282 * @param {string} str - The string to encode. 44283 * 44284 * @returns {string} The encoded string. 44285 */ 44286function encode(str) { 44287 const charMap = { 44288 '!': '%21', 44289 "'": '%27', 44290 '(': '%28', 44291 ')': '%29', 44292 '~': '%7E', 44293 '%20': '+', 44294 '%00': '\x00' 44295 }; 44296 return encodeURIComponent(str).replace(/[!'()~]|%20|%00/g, function replacer(match) { 44297 return charMap[match]; 44298 }); 44299} 44300 44301/** 44302 * It takes a params object and converts it to a FormData object 44303 * 44304 * @param {Object<string, any>} params - The parameters to be converted to a FormData object. 44305 * @param {Object<string, any>} options - The options object passed to the Axios constructor. 44306 * 44307 * @returns {void} 44308 */ 44309function AxiosURLSearchParams(params, options) { 44310 this._pairs = []; 44311 44312 params && (0,_toFormData_js__WEBPACK_IMPORTED_MODULE_0__["default"])(params, this, options); 44313} 44314 44315const prototype = AxiosURLSearchParams.prototype; 44316 44317prototype.append = function append(name, value) { 44318 this._pairs.push([name, value]); 44319}; 44320 44321prototype.toString = function toString(encoder) { 44322 const _encode = encoder ? function(value) { 44323 return encoder.call(this, value, encode); 44324 } : encode; 44325 44326 return this._pairs.map(function each(pair) { 44327 return _encode(pair[0]) + '=' + _encode(pair[1]); 44328 }, '').join('&'); 44329}; 44330 44331/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (AxiosURLSearchParams); 44332 44333 44334/***/ }), 44335
vendor: 2,226 bytes, lines 44336-44421
44336/***/ "./node_modules/axios/lib/helpers/HttpStatusCode.js": 44337/*!**********************************************************!*\ 44338 !*** ./node_modules/axios/lib/helpers/HttpStatusCode.js ***! 44339 \**********************************************************/ 44340/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44341 44342"use strict"; 44343__webpack_require__.r(__webpack_exports__); 44344/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44345/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44346/* harmony export */ }); 44347const HttpStatusCode = { 44348 Continue: 100, 44349 SwitchingProtocols: 101, 44350 Processing: 102, 44351 EarlyHints: 103, 44352 Ok: 200, 44353 Created: 201, 44354 Accepted: 202, 44355 NonAuthoritativeInformation: 203, 44356 NoContent: 204, 44357 ResetContent: 205, 44358 PartialContent: 206, 44359 MultiStatus: 207, 44360 AlreadyReported: 208, 44361 ImUsed: 226, 44362 MultipleChoices: 300, 44363 MovedPermanently: 301, 44364 Found: 302, 44365 SeeOther: 303, 44366 NotModified: 304, 44367 UseProxy: 305, 44368 Unused: 306, 44369 TemporaryRedirect: 307, 44370 PermanentRedirect: 308, 44371 BadRequest: 400, 44372 Unauthorized: 401, 44373 PaymentRequired: 402, 44374 Forbidden: 403, 44375 NotFound: 404, 44376 MethodNotAllowed: 405, 44377 NotAcceptable: 406, 44378 ProxyAuthenticationRequired: 407, 44379 RequestTimeout: 408, 44380 Conflict: 409, 44381 Gone: 410, 44382 LengthRequired: 411, 44383 PreconditionFailed: 412, 44384 PayloadTooLarge: 413, 44385 UriTooLong: 414, 44386 UnsupportedMediaType: 415, 44387 RangeNotSatisfiable: 416, 44388 ExpectationFailed: 417, 44389 ImATeapot: 418, 44390 MisdirectedRequest: 421, 44391 UnprocessableEntity: 422, 44392 Locked: 423, 44393 FailedDependency: 424, 44394 TooEarly: 425, 44395 UpgradeRequired: 426, 44396 PreconditionRequired: 428, 44397 TooManyRequests: 429, 44398 RequestHeaderFieldsTooLarge: 431, 44399 UnavailableForLegalReasons: 451, 44400 InternalServerError: 500, 44401 NotImplemented: 501, 44402 BadGateway: 502, 44403 ServiceUnavailable: 503, 44404 GatewayTimeout: 504, 44405 HttpVersionNotSupported: 505, 44406 VariantAlsoNegotiates: 506, 44407 InsufficientStorage: 507, 44408 LoopDetected: 508, 44409 NotExtended: 510, 44410 NetworkAuthenticationRequired: 511, 44411}; 44412 44413Object.entries(HttpStatusCode).forEach(([key, value]) => { 44414 HttpStatusCode[value] = key; 44415}); 44416 44417/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (HttpStatusCode); 44418 44419 44420/***/ }), 44421
vendor: 633 bytes, lines 44422-44443
44422/***/ "./node_modules/axios/lib/helpers/bind.js": 44423/*!************************************************!*\ 44424 !*** ./node_modules/axios/lib/helpers/bind.js ***! 44425 \************************************************/ 44426/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44427 44428"use strict"; 44429__webpack_require__.r(__webpack_exports__); 44430/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44431/* harmony export */ "default": () => (/* binding */ bind) 44432/* harmony export */ }); 44433 44434 44435function bind(fn, thisArg) { 44436 return function wrap() { 44437 return fn.apply(thisArg, arguments); 44438 }; 44439} 44440 44441 44442/***/ }), 44443
vendor: 2,427 bytes, lines 44444-44523
44444/***/ "./node_modules/axios/lib/helpers/buildURL.js": 44445/*!****************************************************!*\ 44446 !*** ./node_modules/axios/lib/helpers/buildURL.js ***! 44447 \****************************************************/ 44448/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44449 44450"use strict"; 44451__webpack_require__.r(__webpack_exports__); 44452/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44453/* harmony export */ "default": () => (/* binding */ buildURL) 44454/* harmony export */ }); 44455/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 44456/* harmony import */ var _helpers_AxiosURLSearchParams_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../helpers/AxiosURLSearchParams.js */ "./node_modules/axios/lib/helpers/AxiosURLSearchParams.js"); 44457 44458 44459 44460 44461 44462/** 44463 * It replaces all instances of the characters `:`, `$`, `,`, `+`, `[`, and `]` with their 44464 * URI encoded counterparts 44465 * 44466 * @param {string} val The value to be encoded. 44467 * 44468 * @returns {string} The encoded value. 44469 */ 44470function encode(val) { 44471 return encodeURIComponent(val). 44472 replace(/%3A/gi, ':'). 44473 replace(/%24/g, '$'). 44474 replace(/%2C/gi, ','). 44475 replace(/%20/g, '+'). 44476 replace(/%5B/gi, '['). 44477 replace(/%5D/gi, ']'); 44478} 44479 44480/** 44481 * Build a URL by appending params to the end 44482 * 44483 * @param {string} url The base of the url (e.g., http://www.google.com) 44484 * @param {object} [params] The params to be appended 44485 * @param {?object} options 44486 * 44487 * @returns {string} The formatted url 44488 */ 44489function buildURL(url, params, options) { 44490 /*eslint no-param-reassign:0*/ 44491 if (!params) { 44492 return url; 44493 } 44494 44495 const _encode = options && options.encode || encode; 44496 44497 const serializeFn = options && options.serialize; 44498 44499 let serializedParams; 44500 44501 if (serializeFn) { 44502 serializedParams = serializeFn(params, options); 44503 } else { 44504 serializedParams = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isURLSearchParams(params) ? 44505 params.toString() : 44506 new _helpers_AxiosURLSearchParams_js__WEBPACK_IMPORTED_MODULE_1__["default"](params, options).toString(_encode); 44507 } 44508 44509 if (serializedParams) { 44510 const hashmarkIndex = url.indexOf("#"); 44511 44512 if (hashmarkIndex !== -1) { 44513 url = url.slice(0, hashmarkIndex); 44514 } 44515 url += (url.indexOf('?') === -1 ? '?' : '&') + serializedParams; 44516 } 44517 44518 return url; 44519} 44520 44521 44522/***/ }), 44523
vendor: 916 bytes, lines 44524-44553
44524/***/ "./node_modules/axios/lib/helpers/combineURLs.js": 44525/*!*******************************************************!*\ 44526 !*** ./node_modules/axios/lib/helpers/combineURLs.js ***! 44527 \*******************************************************/ 44528/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44529 44530"use strict"; 44531__webpack_require__.r(__webpack_exports__); 44532/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44533/* harmony export */ "default": () => (/* binding */ combineURLs) 44534/* harmony export */ }); 44535 44536 44537/** 44538 * Creates a new URL by combining the specified URLs 44539 * 44540 * @param {string} baseURL The base URL 44541 * @param {string} relativeURL The relative URL 44542 * 44543 * @returns {string} The combined URL 44544 */ 44545function combineURLs(baseURL, relativeURL) { 44546 return relativeURL 44547 ? baseURL.replace(/\/?\/$/, '') + '/' + relativeURL.replace(/^\/+/, '') 44548 : baseURL; 44549} 44550 44551 44552/***/ }), 44553
vendor: 2,062 bytes, lines 44554-44612
44554/***/ "./node_modules/axios/lib/helpers/cookies.js": 44555/*!***************************************************!*\ 44556 !*** ./node_modules/axios/lib/helpers/cookies.js ***! 44557 \***************************************************/ 44558/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44559 44560"use strict"; 44561__webpack_require__.r(__webpack_exports__); 44562/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44563/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44564/* harmony export */ }); 44565/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 44566/* harmony import */ var _platform_index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../platform/index.js */ "./node_modules/axios/lib/platform/index.js"); 44567 44568 44569 44570/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_platform_index_js__WEBPACK_IMPORTED_MODULE_0__["default"].hasStandardBrowserEnv ? 44571 44572 // Standard browser envs support document.cookie 44573 { 44574 write(name, value, expires, path, domain, secure) { 44575 const cookie = [name + '=' + encodeURIComponent(value)]; 44576 44577 _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isNumber(expires) && cookie.push('expires=' + new Date(expires).toGMTString()); 44578 44579 _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isString(path) && cookie.push('path=' + path); 44580 44581 _utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isString(domain) && cookie.push('domain=' + domain); 44582 44583 secure === true && cookie.push('secure'); 44584 44585 document.cookie = cookie.join('; '); 44586 }, 44587 44588 read(name) { 44589 const match = document.cookie.match(new RegExp('(^|;\\s*)(' + name + ')=([^;]*)')); 44590 return (match ? decodeURIComponent(match[3]) : null); 44591 }, 44592 44593 remove(name) { 44594 this.write(name, '', Date.now() - 86400000); 44595 } 44596 } 44597 44598 : 44599 44600 // Non-standard browser env (web workers, react-native) lack needed support. 44601 { 44602 write() {}, 44603 read() { 44604 return null; 44605 }, 44606 remove() {} 44607 }); 44608 44609 44610 44611/***/ }), 44612
vendor: 3,240 bytes, lines 44613-44723
44613/***/ "./node_modules/axios/lib/helpers/formDataToJSON.js": 44614/*!**********************************************************!*\ 44615 !*** ./node_modules/axios/lib/helpers/formDataToJSON.js ***! 44616 \**********************************************************/ 44617/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44618 44619"use strict"; 44620__webpack_require__.r(__webpack_exports__); 44621/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44622/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44623/* harmony export */ }); 44624/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 44625 44626 44627 44628 44629/** 44630 * It takes a string like `foo[x][y][z]` and returns an array like `['foo', 'x', 'y', 'z'] 44631 * 44632 * @param {string} name - The name of the property to get. 44633 * 44634 * @returns An array of strings. 44635 */ 44636function parsePropPath(name) { 44637 // foo[x][y][z] 44638 // foo.x.y.z 44639 // foo-x-y-z 44640 // foo x y z 44641 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].matchAll(/\w+|\[(\w*)]/g, name).map(match => { 44642 return match[0] === '[]' ? '' : match[1] || match[0]; 44643 }); 44644} 44645 44646/** 44647 * Convert an array to an object. 44648 * 44649 * @param {Array<any>} arr - The array to convert to an object. 44650 * 44651 * @returns An object with the same keys and values as the array. 44652 */ 44653function arrayToObject(arr) { 44654 const obj = {}; 44655 const keys = Object.keys(arr); 44656 let i; 44657 const len = keys.length; 44658 let key; 44659 for (i = 0; i < len; i++) { 44660 key = keys[i]; 44661 obj[key] = arr[key]; 44662 } 44663 return obj; 44664} 44665 44666/** 44667 * It takes a FormData object and returns a JavaScript object 44668 * 44669 * @param {string} formData The FormData object to convert to JSON. 44670 * 44671 * @returns {Object<string, any> | null} The converted object. 44672 */ 44673function formDataToJSON(formData) { 44674 function buildPath(path, value, target, index) { 44675 let name = path[index++]; 44676 44677 if (name === '__proto__') return true; 44678 44679 const isNumericKey = Number.isFinite(+name); 44680 const isLast = index >= path.length; 44681 name = !name && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(target) ? target.length : name; 44682 44683 if (isLast) { 44684 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].hasOwnProp(target, name)) { 44685 target[name] = [target[name], value]; 44686 } else { 44687 target[name] = value; 44688 } 44689 44690 return !isNumericKey; 44691 } 44692 44693 if (!target[name] || !_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isObject(target[name])) { 44694 target[name] = []; 44695 } 44696 44697 const result = buildPath(path, value, target[name], index); 44698 44699 if (result && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(target[name])) { 44700 target[name] = arrayToObject(target[name]); 44701 } 44702 44703 return !isNumericKey; 44704 } 44705 44706 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFormData(formData) && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFunction(formData.entries)) { 44707 const obj = {}; 44708 44709 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEachEntry(formData, (name, value) => { 44710 buildPath(parsePropPath(name), value, obj, 0); 44711 }); 44712 44713 return obj; 44714 } 44715 44716 return null; 44717} 44718 44719/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (formDataToJSON); 44720 44721 44722/***/ }), 44723
vendor: 1,105 bytes, lines 44724-44753
44724/***/ "./node_modules/axios/lib/helpers/isAbsoluteURL.js": 44725/*!*********************************************************!*\ 44726 !*** ./node_modules/axios/lib/helpers/isAbsoluteURL.js ***! 44727 \*********************************************************/ 44728/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44729 44730"use strict"; 44731__webpack_require__.r(__webpack_exports__); 44732/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44733/* harmony export */ "default": () => (/* binding */ isAbsoluteURL) 44734/* harmony export */ }); 44735 44736 44737/** 44738 * Determines whether the specified URL is absolute 44739 * 44740 * @param {string} url The URL to test 44741 * 44742 * @returns {boolean} True if the specified URL is absolute, otherwise false 44743 */ 44744function isAbsoluteURL(url) { 44745 // A URL is considered absolute if it begins with "<scheme>://" or "//" (protocol-relative URL). 44746 // RFC 3986 defines scheme name as a sequence of characters beginning with a letter and followed 44747 // by any combination of letters, digits, plus, period, or hyphen. 44748 return /^([a-z][a-z\d+\-.]*:)?\/\//i.test(url); 44749} 44750 44751 44752/***/ }), 44753
vendor: 1,067 bytes, lines 44754-44783
44754/***/ "./node_modules/axios/lib/helpers/isAxiosError.js": 44755/*!********************************************************!*\ 44756 !*** ./node_modules/axios/lib/helpers/isAxiosError.js ***! 44757 \********************************************************/ 44758/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44759 44760"use strict"; 44761__webpack_require__.r(__webpack_exports__); 44762/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44763/* harmony export */ "default": () => (/* binding */ isAxiosError) 44764/* harmony export */ }); 44765/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 44766 44767 44768 44769 44770/** 44771 * Determines whether the payload is an error thrown by Axios 44772 * 44773 * @param {*} payload The value to test 44774 * 44775 * @returns {boolean} True if the payload is an error thrown by Axios, otherwise false 44776 */ 44777function isAxiosError(payload) { 44778 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isObject(payload) && (payload.isAxiosError === true); 44779} 44780 44781 44782/***/ }), 44783
vendor: 3,215 bytes, lines 44784-44867
44784/***/ "./node_modules/axios/lib/helpers/isURLSameOrigin.js": 44785/*!***********************************************************!*\ 44786 !*** ./node_modules/axios/lib/helpers/isURLSameOrigin.js ***! 44787 \***********************************************************/ 44788/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44789 44790"use strict"; 44791__webpack_require__.r(__webpack_exports__); 44792/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44793/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44794/* harmony export */ }); 44795/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 44796/* harmony import */ var _platform_index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../platform/index.js */ "./node_modules/axios/lib/platform/index.js"); 44797 44798 44799 44800 44801 44802/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_platform_index_js__WEBPACK_IMPORTED_MODULE_0__["default"].hasStandardBrowserEnv ? 44803 44804// Standard browser envs have full support of the APIs needed to test 44805// whether the request URL is of the same origin as current location. 44806 (function standardBrowserEnv() { 44807 const msie = /(msie|trident)/i.test(navigator.userAgent); 44808 const urlParsingNode = document.createElement('a'); 44809 let originURL; 44810 44811 /** 44812 * Parse a URL to discover its components 44813 * 44814 * @param {String} url The URL to be parsed 44815 * @returns {Object} 44816 */ 44817 function resolveURL(url) { 44818 let href = url; 44819 44820 if (msie) { 44821 // IE needs attribute set twice to normalize properties 44822 urlParsingNode.setAttribute('href', href); 44823 href = urlParsingNode.href; 44824 } 44825 44826 urlParsingNode.setAttribute('href', href); 44827 44828 // urlParsingNode provides the UrlUtils interface - http://url.spec.whatwg.org/#urlutils 44829 return { 44830 href: urlParsingNode.href, 44831 protocol: urlParsingNode.protocol ? urlParsingNode.protocol.replace(/:$/, '') : '', 44832 host: urlParsingNode.host, 44833 search: urlParsingNode.search ? urlParsingNode.search.replace(/^\?/, '') : '', 44834 hash: urlParsingNode.hash ? urlParsingNode.hash.replace(/^#/, '') : '', 44835 hostname: urlParsingNode.hostname, 44836 port: urlParsingNode.port, 44837 pathname: (urlParsingNode.pathname.charAt(0) === '/') ? 44838 urlParsingNode.pathname : 44839 '/' + urlParsingNode.pathname 44840 }; 44841 } 44842 44843 originURL = resolveURL(window.location.href); 44844 44845 /** 44846 * Determine if a URL shares the same origin as the current location 44847 * 44848 * @param {String} requestURL The URL to test 44849 * @returns {boolean} True if URL shares the same origin, otherwise false 44850 */ 44851 return function isURLSameOrigin(requestURL) { 44852 const parsed = (_utils_js__WEBPACK_IMPORTED_MODULE_1__["default"].isString(requestURL)) ? resolveURL(requestURL) : requestURL; 44853 return (parsed.protocol === originURL.protocol && 44854 parsed.host === originURL.host); 44855 }; 44856 })() : 44857 44858 // Non standard browser envs (web workers, react-native) lack needed support. 44859 (function nonStandardBrowserEnv() { 44860 return function isURLSameOrigin() { 44861 return true; 44862 }; 44863 })()); 44864 44865 44866/***/ }), 44867
vendor: 642 bytes, lines 44868-44884
44868/***/ "./node_modules/axios/lib/helpers/null.js": 44869/*!************************************************!*\ 44870 !*** ./node_modules/axios/lib/helpers/null.js ***! 44871 \************************************************/ 44872/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44873 44874"use strict"; 44875__webpack_require__.r(__webpack_exports__); 44876/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44877/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44878/* harmony export */ }); 44879// eslint-disable-next-line strict 44880/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (null); 44881 44882 44883/***/ }), 44884
vendor: 2,142 bytes, lines 44885-44955
44885/***/ "./node_modules/axios/lib/helpers/parseHeaders.js": 44886/*!********************************************************!*\ 44887 !*** ./node_modules/axios/lib/helpers/parseHeaders.js ***! 44888 \********************************************************/ 44889/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44890 44891"use strict"; 44892__webpack_require__.r(__webpack_exports__); 44893/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44894/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44895/* harmony export */ }); 44896/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./../utils.js */ "./node_modules/axios/lib/utils.js"); 44897 44898 44899 44900 44901// RawAxiosHeaders whose duplicates are ignored by node 44902// c.f. https://nodejs.org/api/http.html#http_message_headers 44903const ignoreDuplicateOf = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toObjectSet([ 44904 'age', 'authorization', 'content-length', 'content-type', 'etag', 44905 'expires', 'from', 'host', 'if-modified-since', 'if-unmodified-since', 44906 'last-modified', 'location', 'max-forwards', 'proxy-authorization', 44907 'referer', 'retry-after', 'user-agent' 44908]); 44909 44910/** 44911 * Parse headers into an object 44912 * 44913 * ``` 44914 * Date: Wed, 27 Aug 2014 08:58:49 GMT 44915 * Content-Type: application/json 44916 * Connection: keep-alive 44917 * Transfer-Encoding: chunked 44918 * ``` 44919 * 44920 * @param {String} rawHeaders Headers needing to be parsed 44921 * 44922 * @returns {Object} Headers parsed into an object 44923 */ 44924/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (rawHeaders => { 44925 const parsed = {}; 44926 let key; 44927 let val; 44928 let i; 44929 44930 rawHeaders && rawHeaders.split('\n').forEach(function parser(line) { 44931 i = line.indexOf(':'); 44932 key = line.substring(0, i).trim().toLowerCase(); 44933 val = line.substring(i + 1).trim(); 44934 44935 if (!key || (parsed[key] && ignoreDuplicateOf[key])) { 44936 return; 44937 } 44938 44939 if (key === 'set-cookie') { 44940 if (parsed[key]) { 44941 parsed[key].push(val); 44942 } else { 44943 parsed[key] = [val]; 44944 } 44945 } else { 44946 parsed[key] = parsed[key] ? parsed[key] + ', ' + val : val; 44947 } 44948 }); 44949 44950 return parsed; 44951}); 44952 44953 44954/***/ }), 44955
vendor: 695 bytes, lines 44956-44976
44956/***/ "./node_modules/axios/lib/helpers/parseProtocol.js": 44957/*!*********************************************************!*\ 44958 !*** ./node_modules/axios/lib/helpers/parseProtocol.js ***! 44959 \*********************************************************/ 44960/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44961 44962"use strict"; 44963__webpack_require__.r(__webpack_exports__); 44964/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44965/* harmony export */ "default": () => (/* binding */ parseProtocol) 44966/* harmony export */ }); 44967 44968 44969function parseProtocol(url) { 44970 const match = /^([-+\w]{1,25})(:?\/\/|:)/.exec(url); 44971 return match && match[1] || ''; 44972} 44973 44974 44975/***/ }), 44976
vendor: 1,693 bytes, lines 44977-45046
44977/***/ "./node_modules/axios/lib/helpers/speedometer.js": 44978/*!*******************************************************!*\ 44979 !*** ./node_modules/axios/lib/helpers/speedometer.js ***! 44980 \*******************************************************/ 44981/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 44982 44983"use strict"; 44984__webpack_require__.r(__webpack_exports__); 44985/* harmony export */ __webpack_require__.d(__webpack_exports__, { 44986/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 44987/* harmony export */ }); 44988 44989 44990/** 44991 * Calculate data maxRate 44992 * @param {Number} [samplesCount= 10] 44993 * @param {Number} [min= 1000] 44994 * @returns {Function} 44995 */ 44996function speedometer(samplesCount, min) { 44997 samplesCount = samplesCount || 10; 44998 const bytes = new Array(samplesCount); 44999 const timestamps = new Array(samplesCount); 45000 let head = 0; 45001 let tail = 0; 45002 let firstSampleTS; 45003 45004 min = min !== undefined ? min : 1000; 45005 45006 return function push(chunkLength) { 45007 const now = Date.now(); 45008 45009 const startedAt = timestamps[tail]; 45010 45011 if (!firstSampleTS) { 45012 firstSampleTS = now; 45013 } 45014 45015 bytes[head] = chunkLength; 45016 timestamps[head] = now; 45017 45018 let i = tail; 45019 let bytesCount = 0; 45020 45021 while (i !== head) { 45022 bytesCount += bytes[i++]; 45023 i = i % samplesCount; 45024 } 45025 45026 head = (head + 1) % samplesCount; 45027 45028 if (head === tail) { 45029 tail = (tail + 1) % samplesCount; 45030 } 45031 45032 if (now - firstSampleTS < min) { 45033 return; 45034 } 45035 45036 const passed = startedAt && now - startedAt; 45037 45038 return passed ? Math.round(bytesCount * 1000 / passed) : undefined; 45039 }; 45040} 45041 45042/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (speedometer); 45043 45044 45045/***/ }), 45046
vendor: 1,073 bytes, lines 45047-45089
45047/***/ "./node_modules/axios/lib/helpers/spread.js": 45048/*!**************************************************!*\ 45049 !*** ./node_modules/axios/lib/helpers/spread.js ***! 45050 \**************************************************/ 45051/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45052 45053"use strict"; 45054__webpack_require__.r(__webpack_exports__); 45055/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45056/* harmony export */ "default": () => (/* binding */ spread) 45057/* harmony export */ }); 45058 45059 45060/** 45061 * Syntactic sugar for invoking a function and expanding an array for arguments. 45062 * 45063 * Common use case would be to use `Function.prototype.apply`. 45064 * 45065 * ```js 45066 * function f(x, y, z) {} 45067 * var args = [1, 2, 3]; 45068 * f.apply(null, args); 45069 * ``` 45070 * 45071 * With `spread` this example can be re-written. 45072 * 45073 * ```js 45074 * spread(function(x, y, z) {})([1, 2, 3]); 45075 * ``` 45076 * 45077 * @param {Function} callback 45078 * 45079 * @returns {Function} 45080 */ 45081function spread(callback) { 45082 return function wrap(arr) { 45083 return callback.apply(null, arr); 45084 }; 45085} 45086 45087 45088/***/ }), 45089
vendor: 8,261 bytes, lines 45090-45326
45090/***/ "./node_modules/axios/lib/helpers/toFormData.js": 45091/*!******************************************************!*\ 45092 !*** ./node_modules/axios/lib/helpers/toFormData.js ***! 45093 \******************************************************/ 45094/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45095 45096"use strict"; 45097__webpack_require__.r(__webpack_exports__); 45098/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45099/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45100/* harmony export */ }); 45101/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 45102/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 45103/* harmony import */ var _platform_node_classes_FormData_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../platform/node/classes/FormData.js */ "./node_modules/axios/lib/helpers/null.js"); 45104 45105 45106 45107 45108// temporary hotfix to avoid circular references until AxiosURLSearchParams is refactored 45109 45110 45111/** 45112 * Determines if the given thing is a array or js object. 45113 * 45114 * @param {string} thing - The object or array to be visited. 45115 * 45116 * @returns {boolean} 45117 */ 45118function isVisitable(thing) { 45119 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isPlainObject(thing) || _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(thing); 45120} 45121 45122/** 45123 * It removes the brackets from the end of a string 45124 * 45125 * @param {string} key - The key of the parameter. 45126 * 45127 * @returns {string} the key without the brackets. 45128 */ 45129function removeBrackets(key) { 45130 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].endsWith(key, '[]') ? key.slice(0, -2) : key; 45131} 45132 45133/** 45134 * It takes a path, a key, and a boolean, and returns a string 45135 * 45136 * @param {string} path - The path to the current key. 45137 * @param {string} key - The key of the current object being iterated over. 45138 * @param {string} dots - If true, the key will be rendered with dots instead of brackets. 45139 * 45140 * @returns {string} The path to the current key. 45141 */ 45142function renderKey(path, key, dots) { 45143 if (!path) return key; 45144 return path.concat(key).map(function each(token, i) { 45145 // eslint-disable-next-line no-param-reassign 45146 token = removeBrackets(token); 45147 return !dots && i ? '[' + token + ']' : token; 45148 }).join(dots ? '.' : ''); 45149} 45150 45151/** 45152 * If the array is an array and none of its elements are visitable, then it's a flat array. 45153 * 45154 * @param {Array<any>} arr - The array to check 45155 * 45156 * @returns {boolean} 45157 */ 45158function isFlatArray(arr) { 45159 return _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(arr) && !arr.some(isVisitable); 45160} 45161 45162const predicates = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toFlatObject(_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"], {}, null, function filter(prop) { 45163 return /^is[A-Z]/.test(prop); 45164}); 45165 45166/** 45167 * Convert a data object to FormData 45168 * 45169 * @param {Object} obj 45170 * @param {?Object} [formData] 45171 * @param {?Object} [options] 45172 * @param {Function} [options.visitor] 45173 * @param {Boolean} [options.metaTokens = true] 45174 * @param {Boolean} [options.dots = false] 45175 * @param {?Boolean} [options.indexes = false] 45176 * 45177 * @returns {Object} 45178 **/ 45179 45180/** 45181 * It converts an object into a FormData object 45182 * 45183 * @param {Object<any, any>} obj - The object to convert to form data. 45184 * @param {string} formData - The FormData object to append to. 45185 * @param {Object<string, any>} options 45186 * 45187 * @returns 45188 */ 45189function toFormData(obj, formData, options) { 45190 if (!_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isObject(obj)) { 45191 throw new TypeError('target must be an object'); 45192 } 45193 45194 // eslint-disable-next-line no-param-reassign 45195 formData = formData || new (_platform_node_classes_FormData_js__WEBPACK_IMPORTED_MODULE_1__["default"] || FormData)(); 45196 45197 // eslint-disable-next-line no-param-reassign 45198 options = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toFlatObject(options, { 45199 metaTokens: true, 45200 dots: false, 45201 indexes: false 45202 }, false, function defined(option, source) { 45203 // eslint-disable-next-line no-eq-null,eqeqeq 45204 return !_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isUndefined(source[option]); 45205 }); 45206 45207 const metaTokens = options.metaTokens; 45208 // eslint-disable-next-line no-use-before-define 45209 const visitor = options.visitor || defaultVisitor; 45210 const dots = options.dots; 45211 const indexes = options.indexes; 45212 const _Blob = options.Blob || typeof Blob !== 'undefined' && Blob; 45213 const useBlob = _Blob && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isSpecCompliantForm(formData); 45214 45215 if (!_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFunction(visitor)) { 45216 throw new TypeError('visitor must be a function'); 45217 } 45218 45219 function convertValue(value) { 45220 if (value === null) return ''; 45221 45222 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isDate(value)) { 45223 return value.toISOString(); 45224 } 45225 45226 if (!useBlob && _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isBlob(value)) { 45227 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_2__["default"]('Blob is not supported. Use a Buffer instead.'); 45228 } 45229 45230 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArrayBuffer(value) || _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isTypedArray(value)) { 45231 return useBlob && typeof Blob === 'function' ? new Blob([value]) : Buffer.from(value); 45232 } 45233 45234 return value; 45235 } 45236 45237 /** 45238 * Default visitor. 45239 * 45240 * @param {*} value 45241 * @param {String|Number} key 45242 * @param {Array<String|Number>} path 45243 * @this {FormData} 45244 * 45245 * @returns {boolean} return true to visit the each prop of the value recursively 45246 */ 45247 function defaultVisitor(value, key, path) { 45248 let arr = value; 45249 45250 if (value && !path && typeof value === 'object') { 45251 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].endsWith(key, '{}')) { 45252 // eslint-disable-next-line no-param-reassign 45253 key = metaTokens ? key : key.slice(0, -2); 45254 // eslint-disable-next-line no-param-reassign 45255 value = JSON.stringify(value); 45256 } else if ( 45257 (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isArray(value) && isFlatArray(value)) || 45258 ((_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isFileList(value) || _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].endsWith(key, '[]')) && (arr = _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].toArray(value)) 45259 )) { 45260 // eslint-disable-next-line no-param-reassign 45261 key = removeBrackets(key); 45262 45263 arr.forEach(function each(el, index) { 45264 !(_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isUndefined(el) || el === null) && formData.append( 45265 // eslint-disable-next-line no-nested-ternary 45266 indexes === true ? renderKey([key], index, dots) : (indexes === null ? key : key + '[]'), 45267 convertValue(el) 45268 ); 45269 }); 45270 return false; 45271 } 45272 } 45273 45274 if (isVisitable(value)) { 45275 return true; 45276 } 45277 45278 formData.append(renderKey(path, key, dots), convertValue(value)); 45279 45280 return false; 45281 } 45282 45283 const stack = []; 45284 45285 const exposedHelpers = Object.assign(predicates, { 45286 defaultVisitor, 45287 convertValue, 45288 isVisitable 45289 }); 45290 45291 function build(value, path) { 45292 if (_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isUndefined(value)) return; 45293 45294 if (stack.indexOf(value) !== -1) { 45295 throw Error('Circular reference detected in ' + path.join('.')); 45296 } 45297 45298 stack.push(value); 45299 45300 _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].forEach(value, function each(el, key) { 45301 const result = !(_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isUndefined(el) || el === null) && visitor.call( 45302 formData, el, _utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isString(key) ? key.trim() : key, path, exposedHelpers 45303 ); 45304 45305 if (result === true) { 45306 build(el, path ? path.concat(key) : [key]); 45307 } 45308 }); 45309 45310 stack.pop(); 45311 } 45312 45313 if (!_utils_js__WEBPACK_IMPORTED_MODULE_0__["default"].isObject(obj)) { 45314 throw new TypeError('data must be an object'); 45315 } 45316 45317 build(obj); 45318 45319 return formData; 45320} 45321 45322/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (toFormData); 45323 45324 45325/***/ }), 45326
vendor: 1,660 bytes, lines 45327-45362
45327/***/ "./node_modules/axios/lib/helpers/toURLEncodedForm.js": 45328/*!************************************************************!*\ 45329 !*** ./node_modules/axios/lib/helpers/toURLEncodedForm.js ***! 45330 \************************************************************/ 45331/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45332 45333"use strict"; 45334__webpack_require__.r(__webpack_exports__); 45335/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45336/* harmony export */ "default": () => (/* binding */ toURLEncodedForm) 45337/* harmony export */ }); 45338/* harmony import */ var _utils_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils.js */ "./node_modules/axios/lib/utils.js"); 45339/* harmony import */ var _toFormData_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./toFormData.js */ "./node_modules/axios/lib/helpers/toFormData.js"); 45340/* harmony import */ var _platform_index_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../platform/index.js */ "./node_modules/axios/lib/platform/index.js"); 45341 45342 45343 45344 45345 45346 45347function toURLEncodedForm(data, options) { 45348 return (0,_toFormData_js__WEBPACK_IMPORTED_MODULE_0__["default"])(data, new _platform_index_js__WEBPACK_IMPORTED_MODULE_1__["default"].classes.URLSearchParams(), Object.assign({ 45349 visitor: function(value, key, path, helpers) { 45350 if (_platform_index_js__WEBPACK_IMPORTED_MODULE_1__["default"].isNode && _utils_js__WEBPACK_IMPORTED_MODULE_2__["default"].isBuffer(value)) { 45351 this.append(key, value.toString('base64')); 45352 return false; 45353 } 45354 45355 return helpers.defaultVisitor.apply(this, arguments); 45356 } 45357 }, options)); 45358} 45359 45360 45361/***/ }), 45362
vendor: 3,823 bytes, lines 45363-45470
45363/***/ "./node_modules/axios/lib/helpers/validator.js": 45364/*!*****************************************************!*\ 45365 !*** ./node_modules/axios/lib/helpers/validator.js ***! 45366 \*****************************************************/ 45367/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45368 45369"use strict"; 45370__webpack_require__.r(__webpack_exports__); 45371/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45372/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45373/* harmony export */ }); 45374/* harmony import */ var _env_data_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../env/data.js */ "./node_modules/axios/lib/env/data.js"); 45375/* harmony import */ var _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../core/AxiosError.js */ "./node_modules/axios/lib/core/AxiosError.js"); 45376 45377 45378 45379 45380 45381const validators = {}; 45382 45383// eslint-disable-next-line func-names 45384['object', 'boolean', 'number', 'function', 'string', 'symbol'].forEach((type, i) => { 45385 validators[type] = function validator(thing) { 45386 return typeof thing === type || 'a' + (i < 1 ? 'n ' : ' ') + type; 45387 }; 45388}); 45389 45390const deprecatedWarnings = {}; 45391 45392/** 45393 * Transitional option validator 45394 * 45395 * @param {function|boolean?} validator - set to false if the transitional option has been removed 45396 * @param {string?} version - deprecated version / removed since version 45397 * @param {string?} message - some message with additional info 45398 * 45399 * @returns {function} 45400 */ 45401validators.transitional = function transitional(validator, version, message) { 45402 function formatMessage(opt, desc) { 45403 return '[Axios v' + _env_data_js__WEBPACK_IMPORTED_MODULE_0__.VERSION + '] Transitional option \'' + opt + '\'' + desc + (message ? '. ' + message : ''); 45404 } 45405 45406 // eslint-disable-next-line func-names 45407 return (value, opt, opts) => { 45408 if (validator === false) { 45409 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"]( 45410 formatMessage(opt, ' has been removed' + (version ? ' in ' + version : '')), 45411 _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"].ERR_DEPRECATED 45412 ); 45413 } 45414 45415 if (version && !deprecatedWarnings[opt]) { 45416 deprecatedWarnings[opt] = true; 45417 // eslint-disable-next-line no-console 45418 console.warn( 45419 formatMessage( 45420 opt, 45421 ' has been deprecated since v' + version + ' and will be removed in the near future' 45422 ) 45423 ); 45424 } 45425 45426 return validator ? validator(value, opt, opts) : true; 45427 }; 45428}; 45429 45430/** 45431 * Assert object's properties type 45432 * 45433 * @param {object} options 45434 * @param {object} schema 45435 * @param {boolean?} allowUnknown 45436 * 45437 * @returns {object} 45438 */ 45439 45440function assertOptions(options, schema, allowUnknown) { 45441 if (typeof options !== 'object') { 45442 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"]('options must be an object', _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"].ERR_BAD_OPTION_VALUE); 45443 } 45444 const keys = Object.keys(options); 45445 let i = keys.length; 45446 while (i-- > 0) { 45447 const opt = keys[i]; 45448 const validator = schema[opt]; 45449 if (validator) { 45450 const value = options[opt]; 45451 const result = value === undefined || validator(value, opt, options); 45452 if (result !== true) { 45453 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"]('option ' + opt + ' must be ' + result, _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"].ERR_BAD_OPTION_VALUE); 45454 } 45455 continue; 45456 } 45457 if (allowUnknown !== true) { 45458 throw new _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"]('Unknown option ' + opt, _core_AxiosError_js__WEBPACK_IMPORTED_MODULE_1__["default"].ERR_BAD_OPTION); 45459 } 45460 } 45461} 45462 45463/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ 45464 assertOptions, 45465 validators 45466}); 45467 45468 45469/***/ }), 45470
vendor: 714 bytes, lines 45471-45488
45471/***/ "./node_modules/axios/lib/platform/browser/classes/Blob.js": 45472/*!*****************************************************************!*\ 45473 !*** ./node_modules/axios/lib/platform/browser/classes/Blob.js ***! 45474 \*****************************************************************/ 45475/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45476 45477"use strict"; 45478__webpack_require__.r(__webpack_exports__); 45479/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45480/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45481/* harmony export */ }); 45482 45483 45484/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (typeof Blob !== 'undefined' ? Blob : null); 45485 45486 45487/***/ }), 45488
vendor: 738 bytes, lines 45489-45506
45489/***/ "./node_modules/axios/lib/platform/browser/classes/FormData.js": 45490/*!*********************************************************************!*\ 45491 !*** ./node_modules/axios/lib/platform/browser/classes/FormData.js ***! 45492 \*********************************************************************/ 45493/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45494 45495"use strict"; 45496__webpack_require__.r(__webpack_exports__); 45497/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45498/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45499/* harmony export */ }); 45500 45501 45502/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (typeof FormData !== 'undefined' ? FormData : null); 45503 45504 45505/***/ }), 45506
vendor: 1,067 bytes, lines 45507-45526
45507/***/ "./node_modules/axios/lib/platform/browser/classes/URLSearchParams.js": 45508/*!****************************************************************************!*\ 45509 !*** ./node_modules/axios/lib/platform/browser/classes/URLSearchParams.js ***! 45510 \****************************************************************************/ 45511/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45512 45513"use strict"; 45514__webpack_require__.r(__webpack_exports__); 45515/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45516/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45517/* harmony export */ }); 45518/* harmony import */ var _helpers_AxiosURLSearchParams_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../helpers/AxiosURLSearchParams.js */ "./node_modules/axios/lib/helpers/AxiosURLSearchParams.js"); 45519 45520 45521 45522/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (typeof URLSearchParams !== 'undefined' ? URLSearchParams : _helpers_AxiosURLSearchParams_js__WEBPACK_IMPORTED_MODULE_0__["default"]); 45523 45524 45525/***/ }), 45526
vendor: 1,567 bytes, lines 45527-45557
45527/***/ "./node_modules/axios/lib/platform/browser/index.js": 45528/*!**********************************************************!*\ 45529 !*** ./node_modules/axios/lib/platform/browser/index.js ***! 45530 \**********************************************************/ 45531/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45532 45533"use strict"; 45534__webpack_require__.r(__webpack_exports__); 45535/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45536/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45537/* harmony export */ }); 45538/* harmony import */ var _classes_URLSearchParams_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./classes/URLSearchParams.js */ "./node_modules/axios/lib/platform/browser/classes/URLSearchParams.js"); 45539/* harmony import */ var _classes_FormData_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./classes/FormData.js */ "./node_modules/axios/lib/platform/browser/classes/FormData.js"); 45540/* harmony import */ var _classes_Blob_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./classes/Blob.js */ "./node_modules/axios/lib/platform/browser/classes/Blob.js"); 45541 45542 45543 45544 45545/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ 45546 isBrowser: true, 45547 classes: { 45548 URLSearchParams: _classes_URLSearchParams_js__WEBPACK_IMPORTED_MODULE_0__["default"], 45549 FormData: _classes_FormData_js__WEBPACK_IMPORTED_MODULE_1__["default"], 45550 Blob: _classes_Blob_js__WEBPACK_IMPORTED_MODULE_2__["default"] 45551 }, 45552 protocols: ['http', 'https', 'file', 'blob', 'url', 'data'] 45553}); 45554 45555 45556/***/ }), 45557
vendor: 2,155 bytes, lines 45558-45617
45558/***/ "./node_modules/axios/lib/platform/common/utils.js": 45559/*!*********************************************************!*\ 45560 !*** ./node_modules/axios/lib/platform/common/utils.js ***! 45561 \*********************************************************/ 45562/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45563 45564"use strict"; 45565__webpack_require__.r(__webpack_exports__); 45566/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45567/* harmony export */ hasBrowserEnv: () => (/* binding */ hasBrowserEnv), 45568/* harmony export */ hasStandardBrowserEnv: () => (/* binding */ hasStandardBrowserEnv), 45569/* harmony export */ hasStandardBrowserWebWorkerEnv: () => (/* binding */ hasStandardBrowserWebWorkerEnv) 45570/* harmony export */ }); 45571const hasBrowserEnv = typeof window !== 'undefined' && typeof document !== 'undefined'; 45572 45573/** 45574 * Determine if we're running in a standard browser environment 45575 * 45576 * This allows axios to run in a web worker, and react-native. 45577 * Both environments support XMLHttpRequest, but not fully standard globals. 45578 * 45579 * web workers: 45580 * typeof window -> undefined 45581 * typeof document -> undefined 45582 * 45583 * react-native: 45584 * navigator.product -> 'ReactNative' 45585 * nativescript 45586 * navigator.product -> 'NativeScript' or 'NS' 45587 * 45588 * @returns {boolean} 45589 */ 45590const hasStandardBrowserEnv = ( 45591 (product) => { 45592 return hasBrowserEnv && ['ReactNative', 'NativeScript', 'NS'].indexOf(product) < 0 45593 })(typeof navigator !== 'undefined' && navigator.product); 45594 45595/** 45596 * Determine if we're running in a standard browser webWorker environment 45597 * 45598 * Although the `isStandardBrowserEnv` method indicates that 45599 * `allows axios to run in a web worker`, the WebWorker will still be 45600 * filtered out due to its judgment standard 45601 * `typeof window !== 'undefined' && typeof document !== 'undefined'`. 45602 * This leads to a problem when axios post `FormData` in webWorker 45603 */ 45604const hasStandardBrowserWebWorkerEnv = (() => { 45605 return ( 45606 typeof WorkerGlobalScope !== 'undefined' && 45607 // eslint-disable-next-line no-undef 45608 self instanceof WorkerGlobalScope && 45609 typeof self.importScripts === 'function' 45610 ); 45611})(); 45612 45613 45614 45615 45616/***/ }), 45617
vendor: 1,070 bytes, lines 45618-45641
45618/***/ "./node_modules/axios/lib/platform/index.js": 45619/*!**************************************************!*\ 45620 !*** ./node_modules/axios/lib/platform/index.js ***! 45621 \**************************************************/ 45622/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45623 45624"use strict"; 45625__webpack_require__.r(__webpack_exports__); 45626/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45627/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45628/* harmony export */ }); 45629/* harmony import */ var _node_index_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./node/index.js */ "./node_modules/axios/lib/platform/browser/index.js"); 45630/* harmony import */ var _common_utils_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./common/utils.js */ "./node_modules/axios/lib/platform/common/utils.js"); 45631 45632 45633 45634/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ 45635 ..._common_utils_js__WEBPACK_IMPORTED_MODULE_0__, 45636 ..._node_index_js__WEBPACK_IMPORTED_MODULE_1__["default"] 45637}); 45638 45639 45640/***/ }), 45641
vendor: 18,219 bytes, lines 45642-46379
45642/***/ "./node_modules/axios/lib/utils.js": 45643/*!*****************************************!*\ 45644 !*** ./node_modules/axios/lib/utils.js ***! 45645 \*****************************************/ 45646/***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => { 45647 45648"use strict"; 45649__webpack_require__.r(__webpack_exports__); 45650/* harmony export */ __webpack_require__.d(__webpack_exports__, { 45651/* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) 45652/* harmony export */ }); 45653/* harmony import */ var _helpers_bind_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./helpers/bind.js */ "./node_modules/axios/lib/helpers/bind.js"); 45654 45655 45656 45657 45658// utils is a library of generic helper functions non-specific to axios 45659 45660const {toString} = Object.prototype; 45661const {getPrototypeOf} = Object; 45662 45663const kindOf = (cache => thing => { 45664 const str = toString.call(thing); 45665 return cache[str] || (cache[str] = str.slice(8, -1).toLowerCase()); 45666})(Object.create(null)); 45667 45668const kindOfTest = (type) => { 45669 type = type.toLowerCase(); 45670 return (thing) => kindOf(thing) === type 45671} 45672 45673const typeOfTest = type => thing => typeof thing === type; 45674 45675/** 45676 * Determine if a value is an Array 45677 * 45678 * @param {Object} val The value to test 45679 * 45680 * @returns {boolean} True if value is an Array, otherwise false 45681 */ 45682const {isArray} = Array; 45683 45684/** 45685 * Determine if a value is undefined 45686 * 45687 * @param {*} val The value to test 45688 * 45689 * @returns {boolean} True if the value is undefined, otherwise false 45690 */ 45691const isUndefined = typeOfTest('undefined'); 45692 45693/** 45694 * Determine if a value is a Buffer 45695 * 45696 * @param {*} val The value to test 45697 * 45698 * @returns {boolean} True if value is a Buffer, otherwise false 45699 */ 45700function isBuffer(val) { 45701 return val !== null && !isUndefined(val) && val.constructor !== null && !isUndefined(val.constructor) 45702 && isFunction(val.constructor.isBuffer) && val.constructor.isBuffer(val); 45703} 45704 45705/** 45706 * Determine if a value is an ArrayBuffer 45707 * 45708 * @param {*} val The value to test 45709 * 45710 * @returns {boolean} True if value is an ArrayBuffer, otherwise false 45711 */ 45712const isArrayBuffer = kindOfTest('ArrayBuffer'); 45713 45714 45715/** 45716 * Determine if a value is a view on an ArrayBuffer 45717 * 45718 * @param {*} val The value to test 45719 * 45720 * @returns {boolean} True if value is a view on an ArrayBuffer, otherwise false 45721 */ 45722function isArrayBufferView(val) { 45723 let result; 45724 if ((typeof ArrayBuffer !== 'undefined') && (ArrayBuffer.isView)) { 45725 result = ArrayBuffer.isView(val); 45726 } else { 45727 result = (val) && (val.buffer) && (isArrayBuffer(val.buffer)); 45728 } 45729 return result; 45730} 45731 45732/** 45733 * Determine if a value is a String 45734 * 45735 * @param {*} val The value to test 45736 * 45737 * @returns {boolean} True if value is a String, otherwise false 45738 */ 45739const isString = typeOfTest('string'); 45740 45741/** 45742 * Determine if a value is a Function 45743 * 45744 * @param {*} val The value to test 45745 * @returns {boolean} True if value is a Function, otherwise false 45746 */ 45747const isFunction = typeOfTest('function'); 45748 45749/** 45750 * Determine if a value is a Number 45751 * 45752 * @param {*} val The value to test 45753 * 45754 * @returns {boolean} True if value is a Number, otherwise false 45755 */ 45756const isNumber = typeOfTest('number'); 45757 45758/** 45759 * Determine if a value is an Object 45760 * 45761 * @param {*} thing The value to test 45762 * 45763 * @returns {boolean} True if value is an Object, otherwise false 45764 */ 45765const isObject = (thing) => thing !== null && typeof thing === 'object'; 45766 45767/** 45768 * Determine if a value is a Boolean 45769 * 45770 * @param {*} thing The value to test 45771 * @returns {boolean} True if value is a Boolean, otherwise false 45772 */ 45773const isBoolean = thing => thing === true || thing === false; 45774 45775/** 45776 * Determine if a value is a plain Object 45777 * 45778 * @param {*} val The value to test 45779 * 45780 * @returns {boolean} True if value is a plain Object, otherwise false 45781 */ 45782const isPlainObject = (val) => { 45783 if (kindOf(val) !== 'object') { 45784 return false; 45785 } 45786 45787 const prototype = getPrototypeOf(val); 45788 return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in val) && !(Symbol.iterator in val); 45789} 45790 45791/** 45792 * Determine if a value is a Date 45793 * 45794 * @param {*} val The value to test 45795 * 45796 * @returns {boolean} True if value is a Date, otherwise false 45797 */ 45798const isDate = kindOfTest('Date'); 45799 45800/** 45801 * Determine if a value is a File 45802 * 45803 * @param {*} val The value to test 45804 * 45805 * @returns {boolean} True if value is a File, otherwise false 45806 */ 45807const isFile = kindOfTest('File'); 45808 45809/** 45810 * Determine if a value is a Blob 45811 * 45812 * @param {*} val The value to test 45813 * 45814 * @returns {boolean} True if value is a Blob, otherwise false 45815 */ 45816const isBlob = kindOfTest('Blob'); 45817 45818/** 45819 * Determine if a value is a FileList 45820 * 45821 * @param {*} val The value to test 45822 * 45823 * @returns {boolean} True if value is a File, otherwise false 45824 */ 45825const isFileList = kindOfTest('FileList'); 45826 45827/** 45828 * Determine if a value is a Stream 45829 * 45830 * @param {*} val The value to test 45831 * 45832 * @returns {boolean} True if value is a Stream, otherwise false 45833 */ 45834const isStream = (val) => isObject(val) && isFunction(val.pipe); 45835 45836/** 45837 * Determine if a value is a FormData 45838 * 45839 * @param {*} thing The value to test 45840 * 45841 * @returns {boolean} True if value is an FormData, otherwise false 45842 */ 45843const isFormData = (thing) => { 45844 let kind; 45845 return thing && ( 45846 (typeof FormData === 'function' && thing instanceof FormData) || ( 45847 isFunction(thing.append) && ( 45848 (kind = kindOf(thing)) === 'formdata' || 45849 // detect form-data instance 45850 (kind === 'object' && isFunction(thing.toString) && thing.toString() === '[object FormData]') 45851 ) 45852 ) 45853 ) 45854} 45855 45856/** 45857 * Determine if a value is a URLSearchParams object 45858 * 45859 * @param {*} val The value to test 45860 * 45861 * @returns {boolean} True if value is a URLSearchParams object, otherwise false 45862 */ 45863const isURLSearchParams = kindOfTest('URLSearchParams'); 45864 45865/** 45866 * Trim excess whitespace off the beginning and end of a string 45867 * 45868 * @param {String} str The String to trim 45869 * 45870 * @returns {String} The String freed of excess whitespace 45871 */ 45872const trim = (str) => str.trim ? 45873 str.trim() : str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''); 45874 45875/** 45876 * Iterate over an Array or an Object invoking a function for each item. 45877 * 45878 * If `obj` is an Array callback will be called passing 45879 * the value, index, and complete array for each item. 45880 * 45881 * If 'obj' is an Object callback will be called passing 45882 * the value, key, and complete object for each property. 45883 * 45884 * @param {Object|Array} obj The object to iterate 45885 * @param {Function} fn The callback to invoke for each item 45886 * 45887 * @param {Boolean} [allOwnKeys = false] 45888 * @returns {any} 45889 */ 45890function forEach(obj, fn, {allOwnKeys = false} = {}) { 45891 // Don't bother if no value provided 45892 if (obj === null || typeof obj === 'undefined') { 45893 return; 45894 } 45895 45896 let i; 45897 let l; 45898 45899 // Force an array if not already something iterable 45900 if (typeof obj !== 'object') { 45901 /*eslint no-param-reassign:0*/ 45902 obj = [obj]; 45903 } 45904 45905 if (isArray(obj)) { 45906 // Iterate over array values 45907 for (i = 0, l = obj.length; i < l; i++) { 45908 fn.call(null, obj[i], i, obj); 45909 } 45910 } else { 45911 // Iterate over object keys 45912 const keys = allOwnKeys ? Object.getOwnPropertyNames(obj) : Object.keys(obj); 45913 const len = keys.length; 45914 let key; 45915 45916 for (i = 0; i < len; i++) { 45917 key = keys[i]; 45918 fn.call(null, obj[key], key, obj); 45919 } 45920 } 45921} 45922 45923function findKey(obj, key) { 45924 key = key.toLowerCase(); 45925 const keys = Object.keys(obj); 45926 let i = keys.length; 45927 let _key; 45928 while (i-- > 0) { 45929 _key = keys[i]; 45930 if (key === _key.toLowerCase()) { 45931 return _key; 45932 } 45933 } 45934 return null; 45935} 45936 45937const _global = (() => { 45938 /*eslint no-undef:0*/ 45939 if (typeof globalThis !== "undefined") return globalThis; 45940 return typeof self !== "undefined" ? self : (typeof window !== 'undefined' ? window : global) 45941})(); 45942 45943const isContextDefined = (context) => !isUndefined(context) && context !== _global; 45944 45945/** 45946 * Accepts varargs expecting each argument to be an object, then 45947 * immutably merges the properties of each object and returns result. 45948 * 45949 * When multiple objects contain the same key the later object in 45950 * the arguments list will take precedence. 45951 * 45952 * Example: 45953 * 45954 * ```js 45955 * var result = merge({foo: 123}, {foo: 456}); 45956 * console.log(result.foo); // outputs 456 45957 * ``` 45958 * 45959 * @param {Object} obj1 Object to merge 45960 * 45961 * @returns {Object} Result of all merge properties 45962 */ 45963function merge(/* obj1, obj2, obj3, ... */) { 45964 const {caseless} = isContextDefined(this) && this || {}; 45965 const result = {}; 45966 const assignValue = (val, key) => { 45967 const targetKey = caseless && findKey(result, key) || key; 45968 if (isPlainObject(result[targetKey]) && isPlainObject(val)) { 45969 result[targetKey] = merge(result[targetKey], val); 45970 } else if (isPlainObject(val)) { 45971 result[targetKey] = merge({}, val); 45972 } else if (isArray(val)) { 45973 result[targetKey] = val.slice(); 45974 } else { 45975 result[targetKey] = val; 45976 } 45977 } 45978 45979 for (let i = 0, l = arguments.length; i < l; i++) { 45980 arguments[i] && forEach(arguments[i], assignValue); 45981 } 45982 return result; 45983} 45984 45985/** 45986 * Extends object a by mutably adding to it the properties of object b. 45987 * 45988 * @param {Object} a The object to be extended 45989 * @param {Object} b The object to copy properties from 45990 * @param {Object} thisArg The object to bind function to 45991 * 45992 * @param {Boolean} [allOwnKeys] 45993 * @returns {Object} The resulting value of object a 45994 */ 45995const extend = (a, b, thisArg, {allOwnKeys}= {}) => { 45996 forEach(b, (val, key) => { 45997 if (thisArg && isFunction(val)) { 45998 a[key] = (0,_helpers_bind_js__WEBPACK_IMPORTED_MODULE_0__["default"])(val, thisArg); 45999 } else { 46000 a[key] = val; 46001 } 46002 }, {allOwnKeys}); 46003 return a; 46004} 46005 46006/** 46007 * Remove byte order marker. This catches EF BB BF (the UTF-8 BOM) 46008 * 46009 * @param {string} content with BOM 46010 * 46011 * @returns {string} content value without BOM 46012 */ 46013const stripBOM = (content) => { 46014 if (content.charCodeAt(0) === 0xFEFF) { 46015 content = content.slice(1); 46016 } 46017 return content; 46018} 46019 46020/** 46021 * Inherit the prototype methods from one constructor into another 46022 * @param {function} constructor 46023 * @param {function} superConstructor 46024 * @param {object} [props] 46025 * @param {object} [descriptors] 46026 * 46027 * @returns {void} 46028 */ 46029const inherits = (constructor, superConstructor, props, descriptors) => { 46030 constructor.prototype = Object.create(superConstructor.prototype, descriptors); 46031 constructor.prototype.constructor = constructor; 46032 Object.defineProperty(constructor, 'super', { 46033 value: superConstructor.prototype 46034 }); 46035 props && Object.assign(constructor.prototype, props); 46036} 46037 46038/** 46039 * Resolve object with deep prototype chain to a flat object 46040 * @param {Object} sourceObj source object 46041 * @param {Object} [destObj] 46042 * @param {Function|Boolean} [filter] 46043 * @param {Function} [propFilter] 46044 * 46045 * @returns {Object} 46046 */ 46047const toFlatObject = (sourceObj, destObj, filter, propFilter) => { 46048 let props; 46049 let i; 46050 let prop; 46051 const merged = {}; 46052 46053 destObj = destObj || {}; 46054 // eslint-disable-next-line no-eq-null,eqeqeq 46055 if (sourceObj == null) return destObj; 46056 46057 do { 46058 props = Object.getOwnPropertyNames(sourceObj); 46059 i = props.length; 46060 while (i-- > 0) { 46061 prop = props[i]; 46062 if ((!propFilter || propFilter(prop, sourceObj, destObj)) && !merged[prop]) { 46063 destObj[prop] = sourceObj[prop]; 46064 merged[prop] = true; 46065 } 46066 } 46067 sourceObj = filter !== false && getPrototypeOf(sourceObj); 46068 } while (sourceObj && (!filter || filter(sourceObj, destObj)) && sourceObj !== Object.prototype); 46069 46070 return destObj; 46071} 46072 46073/** 46074 * Determines whether a string ends with the characters of a specified string 46075 * 46076 * @param {String} str 46077 * @param {String} searchString 46078 * @param {Number} [position= 0] 46079 * 46080 * @returns {boolean} 46081 */ 46082const endsWith = (str, searchString, position) => { 46083 str = String(str); 46084 if (position === undefined || position > str.length) { 46085 position = str.length; 46086 } 46087 position -= searchString.length; 46088 const lastIndex = str.indexOf(searchString, position); 46089 return lastIndex !== -1 && lastIndex === position; 46090} 46091 46092 46093/** 46094 * Returns new array from array like object or null if failed 46095 * 46096 * @param {*} [thing] 46097 * 46098 * @returns {?Array} 46099 */ 46100const toArray = (thing) => { 46101 if (!thing) return null; 46102 if (isArray(thing)) return thing; 46103 let i = thing.length; 46104 if (!isNumber(i)) return null; 46105 const arr = new Array(i); 46106 while (i-- > 0) { 46107 arr[i] = thing[i]; 46108 } 46109 return arr; 46110} 46111 46112/** 46113 * Checking if the Uint8Array exists and if it does, it returns a function that checks if the 46114 * thing passed in is an instance of Uint8Array 46115 * 46116 * @param {TypedArray} 46117 * 46118 * @returns {Array} 46119 */ 46120// eslint-disable-next-line func-names 46121const isTypedArray = (TypedArray => { 46122 // eslint-disable-next-line func-names 46123 return thing => { 46124 return TypedArray && thing instanceof TypedArray; 46125 }; 46126})(typeof Uint8Array !== 'undefined' && getPrototypeOf(Uint8Array)); 46127 46128/** 46129 * For each entry in the object, call the function with the key and value. 46130 * 46131 * @param {Object<any, any>} obj - The object to iterate over. 46132 * @param {Function} fn - The function to call for each entry. 46133 * 46134 * @returns {void} 46135 */ 46136const forEachEntry = (obj, fn) => { 46137 const generator = obj && obj[Symbol.iterator]; 46138 46139 const iterator = generator.call(obj); 46140 46141 let result; 46142 46143 while ((result = iterator.next()) && !result.done) { 46144 const pair = result.value; 46145 fn.call(obj, pair[0], pair[1]); 46146 } 46147} 46148 46149/** 46150 * It takes a regular expression and a string, and returns an array of all the matches 46151 * 46152 * @param {string} regExp - The regular expression to match against. 46153 * @param {string} str - The string to search. 46154 * 46155 * @returns {Array<boolean>} 46156 */ 46157const matchAll = (regExp, str) => { 46158 let matches; 46159 const arr = []; 46160 46161 while ((matches = regExp.exec(str)) !== null) { 46162 arr.push(matches); 46163 } 46164 46165 return arr; 46166} 46167 46168/* Checking if the kindOfTest function returns true when passed an HTMLFormElement. */ 46169const isHTMLForm = kindOfTest('HTMLFormElement'); 46170 46171const toCamelCase = str => { 46172 return str.toLowerCase().replace(/[-_\s]([a-z\d])(\w*)/g, 46173 function replacer(m, p1, p2) { 46174 return p1.toUpperCase() + p2; 46175 } 46176 ); 46177}; 46178 46179/* Creating a function that will check if an object has a property. */ 46180const hasOwnProperty = (({hasOwnProperty}) => (obj, prop) => hasOwnProperty.call(obj, prop))(Object.prototype); 46181 46182/** 46183 * Determine if a value is a RegExp object 46184 * 46185 * @param {*} val The value to test 46186 * 46187 * @returns {boolean} True if value is a RegExp object, otherwise false 46188 */ 46189const isRegExp = kindOfTest('RegExp'); 46190 46191const reduceDescriptors = (obj, reducer) => { 46192 const descriptors = Object.getOwnPropertyDescriptors(obj); 46193 const reducedDescriptors = {}; 46194 46195 forEach(descriptors, (descriptor, name) => { 46196 let ret; 46197 if ((ret = reducer(descriptor, name, obj)) !== false) { 46198 reducedDescriptors[name] = ret || descriptor; 46199 } 46200 }); 46201 46202 Object.defineProperties(obj, reducedDescriptors); 46203} 46204 46205/** 46206 * Makes all methods read-only 46207 * @param {Object} obj 46208 */ 46209 46210const freezeMethods = (obj) => { 46211 reduceDescriptors(obj, (descriptor, name) => { 46212 // skip restricted props in strict mode 46213 if (isFunction(obj) && ['arguments', 'caller', 'callee'].indexOf(name) !== -1) { 46214 return false; 46215 } 46216 46217 const value = obj[name]; 46218 46219 if (!isFunction(value)) return; 46220 46221 descriptor.enumerable = false; 46222 46223 if ('writable' in descriptor) { 46224 descriptor.writable = false; 46225 return; 46226 } 46227 46228 if (!descriptor.set) { 46229 descriptor.set = () => { 46230 throw Error('Can not rewrite read-only method \'' + name + '\''); 46231 }; 46232 } 46233 }); 46234} 46235 46236const toObjectSet = (arrayOrString, delimiter) => { 46237 const obj = {}; 46238 46239 const define = (arr) => { 46240 arr.forEach(value => { 46241 obj[value] = true; 46242 }); 46243 } 46244 46245 isArray(arrayOrString) ? define(arrayOrString) : define(String(arrayOrString).split(delimiter)); 46246 46247 return obj; 46248} 46249 46250const noop = () => {} 46251 46252const toFiniteNumber = (value, defaultValue) => { 46253 value = +value; 46254 return Number.isFinite(value) ? value : defaultValue; 46255} 46256 46257const ALPHA = 'abcdefghijklmnopqrstuvwxyz' 46258 46259const DIGIT = '0123456789'; 46260 46261const ALPHABET = { 46262 DIGIT, 46263 ALPHA, 46264 ALPHA_DIGIT: ALPHA + ALPHA.toUpperCase() + DIGIT 46265} 46266 46267const generateString = (size = 16, alphabet = ALPHABET.ALPHA_DIGIT) => { 46268 let str = ''; 46269 const {length} = alphabet; 46270 while (size--) { 46271 str += alphabet[Math.random() * length|0] 46272 } 46273 46274 return str; 46275} 46276 46277/** 46278 * If the thing is a FormData object, return true, otherwise return false. 46279 * 46280 * @param {unknown} thing - The thing to check. 46281 * 46282 * @returns {boolean} 46283 */ 46284function isSpecCompliantForm(thing) { 46285 return !!(thing && isFunction(thing.append) && thing[Symbol.toStringTag] === 'FormData' && thing[Symbol.iterator]); 46286} 46287 46288const toJSONObject = (obj) => { 46289 const stack = new Array(10); 46290 46291 const visit = (source, i) => { 46292 46293 if (isObject(source)) { 46294 if (stack.indexOf(source) >= 0) { 46295 return; 46296 } 46297 46298 if(!('toJSON' in source)) { 46299 stack[i] = source; 46300 const target = isArray(source) ? [] : {}; 46301 46302 forEach(source, (value, key) => { 46303 const reducedValue = visit(value, i + 1); 46304 !isUndefined(reducedValue) && (target[key] = reducedValue); 46305 }); 46306 46307 stack[i] = undefined; 46308 46309 return target; 46310 } 46311 } 46312 46313 return source; 46314 } 46315 46316 return visit(obj, 0); 46317} 46318 46319const isAsyncFn = kindOfTest('AsyncFunction'); 46320 46321const isThenable = (thing) => 46322 thing && (isObject(thing) || isFunction(thing)) && isFunction(thing.then) && isFunction(thing.catch); 46323 46324/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({ 46325 isArray, 46326 isArrayBuffer, 46327 isBuffer, 46328 isFormData, 46329 isArrayBufferView, 46330 isString, 46331 isNumber, 46332 isBoolean, 46333 isObject, 46334 isPlainObject, 46335 isUndefined, 46336 isDate, 46337 isFile, 46338 isBlob, 46339 isRegExp, 46340 isFunction, 46341 isStream, 46342 isURLSearchParams, 46343 isTypedArray, 46344 isFileList, 46345 forEach, 46346 merge, 46347 extend, 46348 trim, 46349 stripBOM, 46350 inherits, 46351 toFlatObject, 46352 kindOf, 46353 kindOfTest, 46354 endsWith, 46355 toArray, 46356 forEachEntry, 46357 matchAll, 46358 isHTMLForm, 46359 hasOwnProperty, 46360 hasOwnProp: hasOwnProperty, // an alias to avoid ESLint no-prototype-builtins detection 46361 reduceDescriptors, 46362 freezeMethods, 46363 toObjectSet, 46364 toCamelCase, 46365 noop, 46366 toFiniteNumber, 46367 findKey, 46368 global: _global, 46369 isContextDefined, 46370 ALPHABET, 46371 generateString, 46372 isSpecCompliantForm, 46373 toJSONObject, 46374 isAsyncFn, 46375 isThenable 46376}); 46377 46378 46379/***/ })
vendor: 5,731 bytes, lines 46379-46514
46379 46380 46381/******/ }); 46382/************************************************************************/ 46383/******/ // The module cache 46384/******/ var __webpack_module_cache__ = {}; 46385/******/ 46386/******/ // The require function 46387/******/ function __webpack_require__(moduleId) { 46388/******/ // Check if module is in cache 46389/******/ var cachedModule = __webpack_module_cache__[moduleId]; 46390/******/ if (cachedModule !== undefined) { 46391/******/ return cachedModule.exports; 46392/******/ } 46393/******/ // Create a new module (and put it into the cache) 46394/******/ var module = __webpack_module_cache__[moduleId] = { 46395/******/ id: moduleId, 46396/******/ loaded: false, 46397/******/ exports: {} 46398/******/ }; 46399/******/ 46400/******/ // Execute the module function 46401/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__); 46402/******/ 46403/******/ // Flag the module as loaded 46404/******/ module.loaded = true; 46405/******/ 46406/******/ // Return the exports of the module 46407/******/ return module.exports; 46408/******/ } 46409/******/ 46410/************************************************************************/ 46411/******/ /* webpack/runtime/compat get default export */ 46412/******/ (() => { 46413/******/ // getDefaultExport function for compatibility with non-harmony modules 46414/******/ __webpack_require__.n = (module) => { 46415/******/ var getter = module && module.__esModule ? 46416/******/ () => (module['default']) : 46417/******/ () => (module); 46418/******/ __webpack_require__.d(getter, { a: getter }); 46419/******/ return getter; 46420/******/ }; 46421/******/ })(); 46422/******/ 46423/******/ /* webpack/runtime/create fake namespace object */ 46424/******/ (() => { 46425/******/ var getProto = Object.getPrototypeOf ? (obj) => (Object.getPrototypeOf(obj)) : (obj) => (obj.__proto__); 46426/******/ var leafPrototypes; 46427/******/ // create a fake namespace object 46428/******/ // mode & 1: value is a module id, require it 46429/******/ // mode & 2: merge all properties of value into the ns 46430/******/ // mode & 4: return value when already ns object 46431/******/ // mode & 16: return value when it's Promise-like 46432/******/ // mode & 8|1: behave like require 46433/******/ __webpack_require__.t = function(value, mode) { 46434/******/ if(mode & 1) value = this(value); 46435/******/ if(mode & 8) return value; 46436/******/ if(typeof value === 'object' && value) { 46437/******/ if((mode & 4) && value.__esModule) return value; 46438/******/ if((mode & 16) && typeof value.then === 'function') return value; 46439/******/ } 46440/******/ var ns = Object.create(null); 46441/******/ __webpack_require__.r(ns); 46442/******/ var def = {}; 46443/******/ leafPrototypes = leafPrototypes || [null, getProto({}), getProto([]), getProto(getProto)]; 46444/******/ for(var current = mode & 2 && value; typeof current == 'object' && !~leafPrototypes.indexOf(current); current = getProto(current)) { 46445/******/ Object.getOwnPropertyNames(current).forEach((key) => (def[key] = () => (value[key]))); 46446/******/ } 46447/******/ def['default'] = () => (value); 46448/******/ __webpack_require__.d(ns, def); 46449/******/ return ns; 46450/******/ }; 46451/******/ })(); 46452/******/ 46453/******/ /* webpack/runtime/define property getters */ 46454/******/ (() => { 46455/******/ // define getter functions for harmony exports 46456/******/ __webpack_require__.d = (exports, definition) => { 46457/******/ for(var key in definition) { 46458/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { 46459/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); 46460/******/ } 46461/******/ } 46462/******/ }; 46463/******/ })(); 46464/******/ 46465/******/ /* webpack/runtime/hasOwnProperty shorthand */ 46466/******/ (() => { 46467/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop)) 46468/******/ })(); 46469/******/ 46470/******/ /* webpack/runtime/make namespace object */ 46471/******/ (() => { 46472/******/ // define __esModule on exports 46473/******/ __webpack_require__.r = (exports) => { 46474/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { 46475/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); 46476/******/ } 46477/******/ Object.defineProperty(exports, '__esModule', { value: true }); 46478/******/ }; 46479/******/ })(); 46480/******/ 46481/******/ /* webpack/runtime/node module decorator */ 46482/******/ (() => { 46483/******/ __webpack_require__.nmd = (module) => { 46484/******/ module.paths = []; 46485/******/ if (!module.children) module.children = []; 46486/******/ return module; 46487/******/ }; 46488/******/ })(); 46489/******/ 46490/************************************************************************/ 46491var __webpack_exports__ = {}; 46492// This entry need to be wrapped in an IIFE because it need to be in strict mode. 46493(() => { 46494"use strict"; 46495/*!**********************!*\ 46496 !*** ./src/index.js ***! 46497 \**********************/ 46498__webpack_require__.r(__webpack_exports__); 46499/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); 46500/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); 46501/* harmony import */ var react_dom_client__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom/client */ "./node_modules/react-dom/client.js"); 46502/* harmony import */ var _App__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./App */ "./src/App.jsx"); 46503 46504 46505 46506var container = document.getElementById("virtual-tour"); 46507if (container) { 46508 var root = (0,react_dom_client__WEBPACK_IMPORTED_MODULE_1__.createRoot)(container); 46509 root.render( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_App__WEBPACK_IMPORTED_MODULE_2__["default"], null)); 46510} 46511})(); 46512 46513/******/ })() 46514;
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.