react-router-native - npm Package Compare versions

Comparing version 0.0.0-experimental-42adf24c to 0.0.0-experimental-432fcb2e

CHANGELOG.md

 # `react-router-native`
 
+## 6.22.2
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.22.2`
+
+## 6.22.1
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.22.1`
+
+## 6.22.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.22.0`
+
+## 6.21.3
+
+### Patch Changes
+
+- Remove leftover `unstable_` prefix from `Blocker`/`BlockerFunction` types ([#11187](https://github.com/remix-run/react-router/pull/11187))
+- Updated dependencies:
+  - `react-router@6.21.3`
+
+## 6.21.2
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.21.2`
+
+## 6.21.1
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.21.1`
+
+## 6.21.0
+
+### Minor Changes
+
+- Add a new `future.v7_relativeSplatPath` flag to implement a breaking bug fix to relative routing when inside a splat route. ([#11087](https://github.com/remix-run/react-router/pull/11087))
+
+  This fix was originally added in [#10983](https://github.com/remix-run/react-router/issues/10983) and was later reverted in [#11078](https://github.com/remix-run/react-router/pull/11078) because it was determined that a large number of existing applications were relying on the buggy behavior (see [#11052](https://github.com/remix-run/react-router/issues/11052))
+
+  **The Bug**
+  The buggy behavior is that without this flag, the default behavior when resolving relative paths is to _ignore_ any splat (`*`) portion of the current route path.
+
+  **The Background**
+  This decision was originally made thinking that it would make the concept of nested different sections of your apps in `<Routes>` easier if relative routing would _replace_ the current splat:
+
+  ```jsx
+  <BrowserRouter>
+    <Routes>
+      <Route path="/" element={<Home />} />
+      <Route path="dashboard/*" element={<Dashboard />} />
+    </Routes>
+  </BrowserRouter>
+  ```
+
+  Any paths like `/dashboard`, `/dashboard/team`, `/dashboard/projects` will match the `Dashboard` route. The dashboard component itself can then render nested `<Routes>`:
+
+  ```jsx
+  function Dashboard() {
+    return (
+      <div>
+        <h2>Dashboard</h2>
+        <nav>
+          <Link to="/">Dashboard Home</Link>
+          <Link to="team">Team</Link>
+          <Link to="projects">Projects</Link>
+        </nav>
+
+        <Routes>
+          <Route path="/" element={<DashboardHome />} />
+          <Route path="team" element={<DashboardTeam />} />
+          <Route path="projects" element={<DashboardProjects />} />
+        </Routes>
+      </div>
+    );
+  }
+  ```
+
+  Now, all links and route paths are relative to the router above them. This makes code splitting and compartmentalizing your app really easy. You could render the `Dashboard` as its own independent app, or embed it into your large app without making any changes to it.
+
+  **The Problem**
+
+  The problem is that this concept of ignoring part of a path breaks a lot of other assumptions in React Router - namely that `"."` always means the current location pathname for that route. When we ignore the splat portion, we start getting invalid paths when using `"."`:
+
+  ```jsx
+  // If we are on URL /dashboard/team, and we want to link to /dashboard/team:
+  function DashboardTeam() {
+    // ❌ This is broken and results in <a href="/dashboard">
+    return <Link to=".">A broken link to the Current URL</Link>;
+
+    // ✅ This is fixed but super unintuitive since we're already at /dashboard/team!
+    return <Link to="./team">A broken link to the Current URL</Link>;
+  }
+  ```
+
+  We've also introduced an issue that we can no longer move our `DashboardTeam` component around our route hierarchy easily - since it behaves differently if we're underneath a non-splat route, such as `/dashboard/:widget`. Now, our `"."` links will, properly point to ourself _inclusive of the dynamic param value_ so behavior will break from it's corresponding usage in a `/dashboard/*` route.
+
+  Even worse, consider a nested splat route configuration:
+
+  ```jsx
+  <BrowserRouter>
+    <Routes>
+      <Route path="dashboard">
+        <Route path="*" element={<Dashboard />} />
+      </Route>
+    </Routes>
+  </BrowserRouter>
+  ```
+
+  Now, a `<Link to=".">` and a `<Link to="..">` inside the `Dashboard` component go to the same place! That is definitely not correct!
+
+  Another common issue arose in Data Routers (and Remix) where any `<Form>` should post to it's own route `action` if you the user doesn't specify a form action:
+
+  ```jsx
+  let router = createBrowserRouter({
+    path: "/dashboard",
+    children: [
+      {
+        path: "*",
+        action: dashboardAction,
+        Component() {
+          // ❌ This form is broken!  It throws a 405 error when it submits because
+          // it tries to submit to /dashboard (without the splat value) and the parent
+          // `/dashboard` route doesn't have an action
+          return <Form method="post">...</Form>;
+        },
+      },
+    ],
+  });
+  ```
+
+  This is just a compounded issue from the above because the default location for a `Form` to submit to is itself (`"."`) - and if we ignore the splat portion, that now resolves to the parent route.
+
+  **The Solution**
+  If you are leveraging this behavior, it's recommended to enable the future flag, move your splat to it's own route, and leverage `../` for any links to "sibling" pages:
+
+  ```jsx
+  <BrowserRouter>
+    <Routes>
+      <Route path="dashboard">
+        <Route index path="*" element={<Dashboard />} />
+      </Route>
+    </Routes>
+  </BrowserRouter>
+
+  function Dashboard() {
+    return (
+      <div>
+        <h2>Dashboard</h2>
+        <nav>
+          <Link to="..">Dashboard Home</Link>
+          <Link to="../team">Team</Link>
+          <Link to="../projects">Projects</Link>
+        </nav>
+
+        <Routes>
+          <Route path="/" element={<DashboardHome />} />
+          <Route path="team" element={<DashboardTeam />} />
+          <Route path="projects" element={<DashboardProjects />} />
+        </Router>
+      </div>
+    );
+  }
+  ```
+
+  This way, `.` means "the full current pathname for my route" in all cases (including static, dynamic, and splat routes) and `..` always means "my parents pathname".
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.21.0`
+
+## 6.20.1
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.20.1`
+
+## 6.20.0
+
+### Minor Changes
+
+- Export the `PathParam` type from the public API ([#10719](https://github.com/remix-run/react-router/pull/10719))
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.20.0`
+
+## 6.19.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.19.0`
+
+## 6.18.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.18.0`
+
+## 6.17.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.17.0`
+
+## 6.16.0
+
+### Minor Changes
+
+- Updated dependencies:
+  - `react-router@6.16.0`
+
+## 6.15.0
+
+### Minor Changes
+
+- Add's a new `redirectDocument()` function which allows users to specify that a redirect from a `loader`/`action` should trigger a document reload (via `window.location`) instead of attempting to navigate to the redirected location via React Router ([#10705](https://github.com/remix-run/react-router/pull/10705))
+
+### Patch Changes
+
+- Update `@ungap/url-search-params` dependency from `^0.1.4` to `^0.2.2` ([#10590](https://github.com/remix-run/react-router/pull/10590))
+- Updated dependencies:
+  - `react-router@6.15.0`
+
+## 6.14.2
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.14.2`
+
+## 6.14.1
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.14.1`
+
+## 6.14.0
+
+### Patch Changes
+
+- Upgrade `typescript` to 5.1 ([#10581](https://github.com/remix-run/react-router/pull/10581))
+- Updated dependencies:
+  - `react-router@6.14.0`
+
+## 6.13.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.13.0`
+
+## 6.12.1
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.12.1`
+
+## 6.12.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.12.0`
+
+## 6.11.2
+
+### Patch Changes
+
+- Export `SetURLSearchParams` type ([#10444](https://github.com/remix-run/react-router/pull/10444))
+- Updated dependencies:
+  - `react-router@6.11.2`
+
+## 6.11.1
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.11.1`
+
+## 6.11.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.11.0`
+
+## 6.10.0
+
+### Patch Changes
+
+- Updated dependencies:
+  - `react-router@6.10.0`
+
 ## 6.9.0
@@ -4,0 +317,0 @@

dist/index.d.ts

@@ -5,12 +5,12 @@ import * as React from "react";
 import URLSearchParams from "@ungap/url-search-params";
-export type { ActionFunction, ActionFunctionArgs, AwaitProps, unstable_Blocker, unstable_BlockerFunction, DataRouteMatch, DataRouteObject, Fetcher, Hash, IndexRouteObject, IndexRouteProps, JsonFunction, LazyRouteFunction, LayoutRouteProps, LoaderFunction, LoaderFunctionArgs, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, NonIndexRouteObject, OutletProps, Params, ParamParseKey, Path, PathMatch, Pathname, PathPattern, PathRouteProps, RedirectFunction, RelativeRoutingType, RouteMatch, RouteObject, RouteProps, RouterProps, RouterProviderProps, RoutesProps, Search, ShouldRevalidateFunction, To, } from "react-router";
-export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, unstable_useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, } from "react-router";
+export type { ActionFunction, ActionFunctionArgs, AwaitProps, Blocker, BlockerFunction, DataRouteMatch, DataRouteObject, DataStrategyFunction, DataStrategyFunctionArgs, DataStrategyMatch, ErrorResponse, Fetcher, FutureConfig, Hash, IndexRouteObject, IndexRouteProps, JsonFunction, LazyRouteFunction, LayoutRouteProps, LoaderFunction, LoaderFunctionArgs, Location, MemoryRouterProps, NavigateFunction, NavigateOptions, NavigateProps, Navigation, Navigator, NonIndexRouteObject, OutletProps, Params, ParamParseKey, Path, PathMatch, Pathname, PathParam, PathPattern, PathRouteProps, RedirectFunction, RelativeRoutingType, RouteMatch, RouteObject, RouteProps, RouterProps, RouterProviderProps, RoutesProps, Search, ShouldRevalidateFunction, ShouldRevalidateFunctionArgs, To, UIMatch, unstable_HandlerResult, } from "react-router";
+export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, isRouteErrorResponse, generatePath, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes, } from "react-router";
 /** @internal */
-export { UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_NavigationContext, UNSAFE_LocationContext, UNSAFE_RouteContext, } from "react-router";
+export { UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_NavigationContext, UNSAFE_LocationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, } from "react-router";
 export interface NativeRouterProps extends MemoryRouterProps {
 }
 /**
- * A <Router> that runs on React Native.
+ * A `<Router>` that runs on React Native.
  */
-export declare function NativeRouter(props: NativeRouterProps): JSX.Element;
+export declare function NativeRouter(props: NativeRouterProps): React.JSX.Element;
 export interface LinkProps extends TouchableHighlightProps {
@@ -25,5 +25,5 @@ children?: React.ReactNode;
 /**
- * A <TouchableHighlight> that navigates to a different URL when touched.
+ * A `<TouchableHighlight>` that navigates to a different URL when touched.
  */
-export declare function Link({ onPress, relative, replace, state, to, ...rest }: LinkProps): JSX.Element;
+export declare function Link({ onPress, relative, replace, state, to, ...rest }: LinkProps): React.JSX.Element;
 /**
@@ -54,5 +54,5 @@ * Handles the press behavior for router `<Link>` components. This is useful if
 export declare function useSearchParams(defaultInit?: URLSearchParamsInit): [URLSearchParams, SetURLSearchParams];
-declare type SetURLSearchParams = (nextInit?: URLSearchParamsInit | ((prev: URLSearchParams) => URLSearchParamsInit), navigateOpts?: NavigateOptions) => void;
-export declare type ParamKeyValuePair = [string, string];
-export declare type URLSearchParamsInit = string | ParamKeyValuePair[] | Record<string, string | string[]> | URLSearchParams;
+export type SetURLSearchParams = (nextInit?: URLSearchParamsInit | ((prev: URLSearchParams) => URLSearchParamsInit), navigateOpts?: NavigateOptions) => void;
+export type ParamKeyValuePair = [string, string];
+export type URLSearchParamsInit = string | ParamKeyValuePair[] | Record<string, string | string[]> | URLSearchParams;
 /**
@@ -59,0 +59,0 @@ * Creates a URLSearchParams object using the given initializer.

dist/index.js

 /**
- * React Router Native v0.0.0-experimental-42adf24c
+ * React Router Native v0.0.0-experimental-432fcb2e
  *
@@ -14,3 +14,3 @@ * Copyright (c) Remix Software Inc.
 import { MemoryRouter, useNavigate, useLocation } from 'react-router';
-export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, renderMatches, resolvePath, unstable_useBlocker, useActionData, useAsyncError, useAsyncValue, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes } from 'react-router';
+export { AbortedDeferredError, Await, MemoryRouter, Navigate, NavigationType, Outlet, Route, Router, RouterProvider, Routes, UNSAFE_DataRouterContext, UNSAFE_DataRouterStateContext, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, UNSAFE_useRouteId, createMemoryRouter, createPath, createRoutesFromChildren, createRoutesFromElements, defer, generatePath, isRouteErrorResponse, json, matchPath, matchRoutes, parsePath, redirect, redirectDocument, renderMatches, resolvePath, useActionData, useAsyncError, useAsyncValue, useBlocker, useHref, useInRouterContext, useLoaderData, useLocation, useMatch, useMatches, useNavigate, useNavigation, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRevalidator, useRouteError, useRouteLoaderData, useRoutes } from 'react-router';
 import URLSearchParams from '@ungap/url-search-params';
@@ -23,3 +23,2 @@
   var key, i;
-
   for (i = 0; i < sourceKeys.length; i++) {
@@ -30,16 +29,10 @@ key = sourceKeys[i];
   }
-
   return target;
 }
-
 function _objectWithoutProperties(source, excluded) {
   if (source == null) return {};
-
   var target = _objectWithoutPropertiesLoose(source, excluded);
-
   var key, i;
-
   if (Object.getOwnPropertySymbols) {
     var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-
     for (i = 0; i < sourceSymbolKeys.length; i++) {
@@ -52,3 +45,2 @@ key = sourceSymbolKeys[i];
   }
-
   return target;
@@ -55,0 +47,0 @@ }

LICENSE.md

 MIT License
 
-Copyright (c) React Training 2015-2019
-Copyright (c) Remix Software 2020-2022
+Copyright (c) React Training LLC 2015-2019
+Copyright (c) Remix Software Inc. 2020-2021
+Copyright (c) Shopify Inc. 2022-2023
 
@@ -6,0 +7,0 @@ Permission is hereby granted, free of charge, to any person obtaining a copy

package.json

 {
   "name": "react-router-native",
-  "version": "0.0.0-experimental-42adf24c",
+  "version": "0.0.0-experimental-432fcb2e",
   "description": "Declarative routing for React Native applications",
@@ -24,4 +24,4 @@ "keywords": [
   "dependencies": {
-    "@ungap/url-search-params": "^0.1.4",
-    "react-router": "0.0.0-experimental-42adf24c"
+    "@ungap/url-search-params": "^0.2.2",
+    "react-router": "0.0.0-experimental-432fcb2e"
   },
@@ -43,4 +43,4 @@ "devDependencies": {
   "engines": {
-    "node": ">=14"
+    "node": ">=14.0.0"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

38034

increased by31.88%

Lines of code

140

increased by0.72%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• + Added@remix-run/router@0.0.0-experimental-432fcb2e(transitive)

• + Added@ungap/url-search-params@0.2.2(transitive)

• + Addedreact-router@0.0.0-experimental-432fcb2e(transitive)

• - Removed@remix-run/router@0.0.0-experimental-42adf24c(transitive)

• - Removed@ungap/url-search-params@0.1.4(transitive)

• - Removedreact-router@0.0.0-experimental-42adf24c(transitive)

• Updated@ungap/url-search-params@^0.2.2

• Updatedreact-router@0.0.0-experimental-432fcb2e