react-router 6.0.0-beta.7 → 6.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  /**
2
- * React Router v6.0.0-beta.7
2
+ * React Router v6.0.2
3
3
  *
4
4
  * Copyright (c) Remix Software Inc.
5
5
  *
@@ -80,7 +80,7 @@ const RouteContext = /*#__PURE__*/createContext({
80
80
  /**
81
81
  * A <Router> that stores all entries in memory.
82
82
  *
83
- * @see https://reactrouter.com/api/MemoryRouter
83
+ * @see https://reactrouter.com/docs/en/v6/api#memoryrouter
84
84
  */
85
85
  function MemoryRouter({
86
86
  basename,
@@ -106,8 +106,8 @@ function MemoryRouter({
106
106
  return /*#__PURE__*/createElement(Router, {
107
107
  basename: basename,
108
108
  children: children,
109
- action: state.action,
110
109
  location: state.location,
110
+ navigationType: state.action,
111
111
  navigator: history
112
112
  });
113
113
  }
@@ -119,7 +119,7 @@ function MemoryRouter({
119
119
  * able to use hooks. In functional components, we recommend you use the
120
120
  * `useNavigate` hook instead.
121
121
  *
122
- * @see https://reactrouter.com/api/Navigate
122
+ * @see https://reactrouter.com/docs/en/v6/api#navigate
123
123
  */
124
124
  function Navigate({
125
125
  to,
@@ -143,7 +143,7 @@ function Navigate({
143
143
  /**
144
144
  * Renders the child route's element, if there is one.
145
145
  *
146
- * @see https://reactrouter.com/api/Outlet
146
+ * @see https://reactrouter.com/docs/en/v6/api#outlet
147
147
  */
148
148
  function Outlet(_props) {
149
149
  return useOutlet();
@@ -152,7 +152,7 @@ function Outlet(_props) {
152
152
  /**
153
153
  * Declares an element that should be rendered at a certain URL path.
154
154
  *
155
- * @see https://reactrouter.com/api/Route
155
+ * @see https://reactrouter.com/docs/en/v6/api#route
156
156
  */
157
157
  function Route(_props) {
158
158
  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>.`) ;
@@ -165,13 +165,13 @@ function Route(_props) {
165
165
  * router that is more specific to your environment such as a <BrowserRouter>
166
166
  * in web browsers or a <StaticRouter> for server rendering.
167
167
  *
168
- * @see https://reactrouter.com/api/Router
168
+ * @see https://reactrouter.com/docs/en/v6/api#router
169
169
  */
170
170
  function Router({
171
- action = Action.Pop,
172
171
  basename: basenameProp = "/",
173
172
  children = null,
174
173
  location: locationProp,
174
+ navigationType = Action.Pop,
175
175
  navigator,
176
176
  static: staticProp = false
177
177
  }) {
@@ -220,8 +220,8 @@ function Router({
220
220
  }, /*#__PURE__*/createElement(LocationContext.Provider, {
221
221
  children: children,
222
222
  value: {
223
- action,
224
- location
223
+ location,
224
+ navigationType
225
225
  }
226
226
  }));
227
227
  }
@@ -230,7 +230,7 @@ function Router({
230
230
  * A container for a nested tree of <Route> elements that renders the branch
231
231
  * that best matches the current location.
232
232
  *
233
- * @see https://reactrouter.com/api/Routes
233
+ * @see https://reactrouter.com/docs/en/v6/api#routes
234
234
  */
235
235
  function Routes({
236
236
  children,
@@ -245,7 +245,7 @@ function Routes({
245
245
  * Returns the full href for the given "to" value. This is useful for building
246
246
  * custom links that are also accessible and preserve right-click behavior.
247
247
  *
248
- * @see https://reactrouter.com/api/useHref
248
+ * @see https://reactrouter.com/docs/en/v6/api#usehref
249
249
  */
250
250
 
251
251
  function useHref(to) {
@@ -256,20 +256,29 @@ function useHref(to) {
256
256
  basename,
257
257
  navigator
258
258
  } = useContext(NavigationContext);
259
- let path = useResolvedPath(to);
259
+ let {
260
+ hash,
261
+ pathname,
262
+ search
263
+ } = useResolvedPath(to);
264
+ let joinedPathname = pathname;
260
265
 
261
266
  if (basename !== "/") {
262
267
  let toPathname = getToPathname(to);
263
268
  let endsWithSlash = toPathname != null && toPathname.endsWith("/");
264
- path.pathname = path.pathname === "/" ? basename + (endsWithSlash ? "/" : "") : joinPaths([basename, path.pathname]);
269
+ joinedPathname = pathname === "/" ? basename + (endsWithSlash ? "/" : "") : joinPaths([basename, pathname]);
265
270
  }
266
271
 
267
- return navigator.createHref(path);
272
+ return navigator.createHref({
273
+ pathname: joinedPathname,
274
+ search,
275
+ hash
276
+ });
268
277
  }
269
278
  /**
270
279
  * Returns true if this component is a descendant of a <Router>.
271
280
  *
272
- * @see https://reactrouter.com/api/useInRouterContext
281
+ * @see https://reactrouter.com/docs/en/v6/api#useinroutercontext
273
282
  */
274
283
 
275
284
  function useInRouterContext() {
@@ -283,7 +292,7 @@ function useInRouterContext() {
283
292
  * "routing" in your app, and we'd like to know what your use case is. We may
284
293
  * be able to provide something higher-level to better suit your needs.
285
294
  *
286
- * @see https://reactrouter.com/api/useLocation
295
+ * @see https://reactrouter.com/docs/en/v6/api#uselocation
287
296
  */
288
297
 
289
298
  function useLocation() {
@@ -292,12 +301,22 @@ function useLocation() {
292
301
  `useLocation() may be used only in the context of a <Router> component.`) : void 0;
293
302
  return useContext(LocationContext).location;
294
303
  }
304
+ /**
305
+ * Returns the current navigation action which describes how the router came to
306
+ * the current location, either by a pop, push, or replace on the history stack.
307
+ *
308
+ * @see https://reactrouter.com/docs/en/v6/api#usenavigationtype
309
+ */
310
+
311
+ function useNavigationType() {
312
+ return useContext(LocationContext).navigationType;
313
+ }
295
314
  /**
296
315
  * Returns true if the URL for the given "to" value matches the current URL.
297
316
  * This is useful for components that need to know "active" state, e.g.
298
317
  * <NavLink>.
299
318
  *
300
- * @see https://reactrouter.com/api/useMatch
319
+ * @see https://reactrouter.com/docs/en/v6/api#usematch
301
320
  */
302
321
 
303
322
  function useMatch(pattern) {
@@ -314,7 +333,7 @@ function useMatch(pattern) {
314
333
  * Returns an imperative method for changing the location. Used by <Link>s, but
315
334
  * may also be used by other elements to change the location.
316
335
  *
317
- * @see https://reactrouter.com/api/useNavigate
336
+ * @see https://reactrouter.com/docs/en/v6/api#usenavigate
318
337
  */
319
338
  function useNavigate() {
320
339
  !useInRouterContext() ? invariant(false, // TODO: This error is probably because they somehow have 2 versions of the
@@ -358,7 +377,7 @@ function useNavigate() {
358
377
  * Returns the element for the child route at this level of the route
359
378
  * hierarchy. Used internally by <Outlet> to render child routes.
360
379
  *
361
- * @see https://reactrouter.com/api/useOutlet
380
+ * @see https://reactrouter.com/docs/en/v6/api#useoutlet
362
381
  */
363
382
 
364
383
  function useOutlet() {
@@ -368,7 +387,7 @@ function useOutlet() {
368
387
  * Returns an object of key/value pairs of the dynamic params from the current
369
388
  * URL that were matched by the route path.
370
389
  *
371
- * @see https://reactrouter.com/api/useParams
390
+ * @see https://reactrouter.com/docs/en/v6/api#useparams
372
391
  */
373
392
 
374
393
  function useParams() {
@@ -381,7 +400,7 @@ function useParams() {
381
400
  /**
382
401
  * Resolves the pathname of the given `to` value against the current location.
383
402
  *
384
- * @see https://reactrouter.com/api/useResolvedPath
403
+ * @see https://reactrouter.com/docs/en/v6/api#useresolvedpath
385
404
  */
386
405
 
387
406
  function useResolvedPath(to) {
@@ -400,7 +419,7 @@ function useResolvedPath(to) {
400
419
  * elements in the tree must render an <Outlet> to render their child route's
401
420
  * element.
402
421
  *
403
- * @see https://reactrouter.com/api/useRoutes
422
+ * @see https://reactrouter.com/docs/en/v6/api#useroutes
404
423
  */
405
424
 
406
425
  function useRoutes(routes, locationArg) {
@@ -460,12 +479,13 @@ function useRoutes(routes, locationArg) {
460
479
 
461
480
  {
462
481
  warning(parentRoute || matches != null, `No routes matched location "${location.pathname}${location.search}${location.hash}" `) ;
482
+ warning(matches == null || matches[matches.length - 1].route.element !== undefined, `Matched leaf route at location "${location.pathname}${location.search}${location.hash}" does not have an element. ` + `This means it will render an <Outlet /> with a null value by default resulting in an "empty" page.`) ;
463
483
  }
464
484
 
465
485
  return _renderMatches(matches && matches.map(match => Object.assign({}, match, {
466
486
  params: Object.assign({}, parentParams, match.params),
467
487
  pathname: joinPaths([parentPathnameBase, match.pathname]),
468
- pathnameBase: joinPaths([parentPathnameBase, match.pathnameBase])
488
+ pathnameBase: match.pathnameBase === "/" ? parentPathnameBase : joinPaths([parentPathnameBase, match.pathnameBase])
469
489
  })), parentMatches);
470
490
  } ///////////////////////////////////////////////////////////////////////////////
471
491
  // UTILS
@@ -476,7 +496,7 @@ function useRoutes(routes, locationArg) {
476
496
  * either a `<Route>` element or an array of them. Used internally by
477
497
  * `<Routes>` to create a route config from its children.
478
498
  *
479
- * @see https://reactrouter.com/api/createRoutesFromChildren
499
+ * @see https://reactrouter.com/docs/en/v6/api#createroutesfromchildren
480
500
  */
481
501
 
482
502
  function createRoutesFromChildren(children) {
@@ -494,6 +514,7 @@ function createRoutesFromChildren(children) {
494
514
  return;
495
515
  }
496
516
 
517
+ !(element.type === Route) ? 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>`) : void 0;
497
518
  let route = {
498
519
  caseSensitive: element.props.caseSensitive,
499
520
  element: element.props.element,
@@ -516,7 +537,7 @@ function createRoutesFromChildren(children) {
516
537
  /**
517
538
  * Returns a path with params interpolated.
518
539
  *
519
- * @see https://reactrouter.com/api/generatePath
540
+ * @see https://reactrouter.com/docs/en/v6/api#generatepath
520
541
  */
521
542
  function generatePath(path, params = {}) {
522
543
  return path.replace(/:(\w+)/g, (_, key) => {
@@ -531,7 +552,7 @@ function generatePath(path, params = {}) {
531
552
  /**
532
553
  * Matches the given routes to a location and returns the match data.
533
554
  *
534
- * @see https://reactrouter.com/api/matchRoutes
555
+ * @see https://reactrouter.com/docs/en/v6/api#matchroutes
535
556
  */
536
557
  function matchRoutes(routes, locationArg, basename = "/") {
537
558
  let location = typeof locationArg === "string" ? parsePath(locationArg) : locationArg;
@@ -583,7 +604,7 @@ function flattenRoutes(routes, branches = [], parentsMeta = [], parentPath = "")
583
604
 
584
605
  branches.push({
585
606
  path,
586
- score: computeScore(path),
607
+ score: computeScore(path, route.index),
587
608
  routesMeta
588
609
  });
589
610
  });
@@ -596,14 +617,15 @@ function rankRouteBranches(branches) {
596
617
  }
597
618
 
598
619
  const paramRe = /^:\w+$/;
599
- const dynamicSegmentValue = 2;
620
+ const dynamicSegmentValue = 3;
621
+ const indexRouteValue = 2;
600
622
  const emptySegmentValue = 1;
601
623
  const staticSegmentValue = 10;
602
624
  const splatPenalty = -2;
603
625
 
604
626
  const isSplat = s => s === "*";
605
627
 
606
- function computeScore(path) {
628
+ function computeScore(path, index) {
607
629
  let segments = path.split("/");
608
630
  let initialScore = segments.length;
609
631
 
@@ -611,6 +633,10 @@ function computeScore(path) {
611
633
  initialScore += splatPenalty;
612
634
  }
613
635
 
636
+ if (index) {
637
+ initialScore += indexRouteValue;
638
+ }
639
+
614
640
  return segments.filter(s => !isSplat(s)).reduce((score, segment) => score + (paramRe.test(segment) ? dynamicSegmentValue : segment === "" ? emptySegmentValue : staticSegmentValue), initialScore);
615
641
  }
616
642
 
@@ -676,7 +702,7 @@ function _renderMatches(matches, parentMatches = []) {
676
702
  if (matches == null) return null;
677
703
  return matches.reduceRight((outlet, match, index) => {
678
704
  return /*#__PURE__*/createElement(RouteContext.Provider, {
679
- children: match.route.element || /*#__PURE__*/createElement(Outlet, null),
705
+ children: match.route.element !== undefined ? match.route.element : /*#__PURE__*/createElement(Outlet, null),
680
706
  value: {
681
707
  outlet,
682
708
  matches: parentMatches.concat(matches.slice(0, index + 1))
@@ -693,7 +719,7 @@ function _renderMatches(matches, parentMatches = []) {
693
719
  * Performs pattern matching on a URL pathname and returns information about
694
720
  * the match.
695
721
  *
696
- * @see https://reactrouter.com/api/matchPath
722
+ * @see https://reactrouter.com/docs/en/v6/api#matchpath
697
723
  */
698
724
  function matchPath(pattern, pathname) {
699
725
  if (typeof pattern === "string") {
@@ -767,7 +793,7 @@ function safelyDecodeURIComponent(value, paramName) {
767
793
  /**
768
794
  * Returns a resolved path object relative to the given pathname.
769
795
  *
770
- * @see https://reactrouter.com/api/resolvePath
796
+ * @see https://reactrouter.com/docs/en/v6/api#resolvepath
771
797
  */
772
798
 
773
799
 
@@ -873,5 +899,5 @@ const normalizeSearch = search => !search || search === "?" ? "" : search.starts
873
899
 
874
900
  const normalizeHash = hash => !hash || hash === "#" ? "" : hash.startsWith("#") ? hash : "#" + hash; ///////////////////////////////////////////////////////////////////////////////
875
901
 
876
- export { MemoryRouter, Navigate, Outlet, Route, Router, Routes, LocationContext as UNSAFE_LocationContext, NavigationContext as UNSAFE_NavigationContext, RouteContext as UNSAFE_RouteContext, createRoutesFromChildren, generatePath, matchPath, matchRoutes, renderMatches, resolvePath, useHref, useInRouterContext, useLocation, useMatch, useNavigate, useOutlet, useParams, useResolvedPath, useRoutes };
902
+ export { MemoryRouter, Navigate, Outlet, Route, Router, Routes, LocationContext as UNSAFE_LocationContext, NavigationContext as UNSAFE_NavigationContext, RouteContext as UNSAFE_RouteContext, createRoutesFromChildren, generatePath, matchPath, matchRoutes, renderMatches, resolvePath, useHref, useInRouterContext, useLocation, useMatch, useNavigate, useNavigationType, useOutlet, useParams, useResolvedPath, useRoutes };
877
903
  //# sourceMappingURL=react-router.development.js.map