Update react dependencies

[renovate]

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
@vitejs/plugin-react-swc	^3.3.2 -> ^3.7.2
eslint-plugin-react-hooks (source)	^4.6.0 -> ^4.6.2
eslint-plugin-react-refresh	^0.4.3 -> ^0.4.16
react (source)	^18.2.0 -> ^18.3.1
react-dom (source)	^18.2.0 -> ^18.3.1
react-router-dom (source)	^6.18.0 -> ^6.28.0

---

Release Notes

vitejs/vite-plugin-react-swc (@​vitejs/plugin-react-swc)

v3.7.2

Compare Source

Add Vite 6 to peerDependencies range #​207

Thanks @​RobinTail

Revert throw when refresh runtime is loaded twice #​237

Revert the throw when refresh runtime is loaded twice to enable usage in micro frontend apps. This was added to help fix setup usage, and this is not worth an annoying warning for others or a config parameter.

This revert was done in the Babel plugin last year and I didn't port it back.

v3.7.1

Compare Source

Ignore directive sourcemap error #​231

v3.7.0

Compare Source

Support HMR for class components

This is a long overdue and should fix some issues people had with HMR when migrating from CRA.

v3.6.0

Compare Source

Add parserConfig option

This will unlock to use the plugin in some use cases where the original source code is not in TS. Using this option to keep using JSX inside .js files is highly discouraged and can be removed in any future version.

v3.5.0

Compare Source

Update peer dependency range to target Vite 5

There were no breaking change that impacted this plugin, so any combination of React plugins and Vite core version will work.

Align jsx runtime for optimized dependencies

This will only affect people using internal libraries that contains untranspiled JSX. This change aligns the optimizer with the source code and avoid issues when the published source don't have React in the scope.

Reminder: While being partially supported in Vite, publishing TS & JSX outside of internal libraries is highly discouraged.

facebook/react (eslint-plugin-react-hooks)

v4.6.2

Compare Source

v4.6.1

Compare Source

ArnaudBarre/eslint-plugin-react-refresh (eslint-plugin-react-refresh)

v0.4.16

Compare Source

Fix CJS/ESM interop issue. Sorry everyone for the trouble.

v0.4.15

Compare Source

Add support for custom HOCs (#​60)

By default, the rule only knows that memo & forwardRef function calls with return a React component. With this option, you can also allow extra function names like Mobx observer to make this code valid:

const Foo = () => <></>;
export default observer(Foo);

{
  "react-refresh/only-export-components": [
    "error",
    { "customHOCs": ["observer"] }
  ]
}

Thanks @​HorusGoul!

Add recommended config and simple types (#​67)

You can now add the recommended config to your ESLint config like this:

import reactRefresh from "eslint-plugin-react-refresh";

export default [
  /* Main config */
  reactRefresh.configs.recommended, // Or reactRefresh.configs.vite for Vite users
];

To follow ESLint recommandations, the rule is added with the error severity.

Some simple types ensure that people typecheking their config won't need @ts-expect-error anymore.

Bump ESLint peer dependency to 8.40

This was actually done by mistake in the previous release when moving from a deprecated API to a new one.

Given that ESLint 8 is officialy end-of-life and the only report (#​56) didn't get likes, I'm going forward and documenting the expected minimum version from ESLin in the package JSON so that people can get warning from their package manager.

v0.4.14

Compare Source

• Warn if a context is exported alongside a component (fixes #​53). Thanks @​IgorAufricht!

v0.4.13

Compare Source

• Support for react-redux connect (export default connect(mapStateToProps, mapDispatchToProps)(MyComponent)) (fixes #​51)
• Support for Arbitrary Module Identifiers syntax (fixes #​52)

v0.4.12

Compare Source

• Support type assertion on default export (fixes #​48)
• Add default export to fix usage with jiti (fixes #​50)

v0.4.11

Compare Source

• Ignore type exports (ex. export type foo = string;) (fixes #​47)

v0.4.10

Compare Source

• Support function Foo() {}; export default React.memo(Foo) (#​46) (thanks @​SukkaW!)

v0.4.9

Compare Source

• Support function Foo() {}; export default memo(Foo) (fixes #​44)

v0.4.8

Compare Source

• Support export const foo = -1 with allowConstantExport (fixes #​43)

v0.4.7

Compare Source

• Support export { Component as default } (fixes #​41)

v0.4.6

Compare Source

• Ignore cypress test files (#​39)

v0.4.5

Compare Source

• Allow TaggedTemplateExpression for styled components (fixes #​32)

facebook/react (react)

v18.3.1

Compare Source

v18.3.0

Compare Source

facebook/react (react-dom)

v18.3.1

Compare Source

v18.3.0

Compare Source

remix-run/react-router (react-router-dom)

v6.28.0

Compare Source

Minor Changes

• • Log deprecation warnings for v7 flags (#​11750)
  • Add deprecation warnings to json/defer in favor of returning raw objects
    • These methods will be removed in React Router v7

Patch Changes

• Update JSDoc URLs for new website structure (add /v6/ segment) (#​12141)
• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

v6.27.0

Compare Source

v6.26.2

Compare Source

v6.26.1

Compare Source

v6.26.0

Compare Source

Minor Changes

• Add a new replace(url, init?) alternative to redirect(url, init?) that performs a history.replaceState instead of a history.pushState on client-side navigation redirects (#​11811)

Patch Changes

• Fix initial hydration behavior when using future.v7_partialHydration along with unstable_patchRoutesOnMiss (#​11838)
  • During initial hydration, router.state.matches will now include any partial matches so that we can render ancestor HydrateFallback components
• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.25.1

Compare Source

Patch Changes

• Memoize some RouterProvider internals to reduce unnecessary re-renders (#​11803)
• Updated dependencies:
  • [email protected]

v6.25.0

Compare Source

Minor Changes

• Stabilize future.unstable_skipActionErrorRevalidation as future.v7_skipActionErrorRevalidation (#​11769)

  • When this flag is enabled, actions will not automatically trigger a revalidation if they return/throw a Response with a 4xx/5xx status code
  • You may still opt-into revalidation via shouldRevalidate
  • This also changes shouldRevalidate's unstable_actionStatus parameter to actionStatus

Patch Changes

• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

v6.24.1

Compare Source

Patch Changes

• Remove polyfill.io reference from warning message because the domain was sold and has since been determined to serve malware (#​11741)
  • See https://sansec.io/research/polyfill-supply-chain-attack
• Export NavLinkRenderProps type for easier typing of custom NavLink callback (#​11553)
• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.24.0

Compare Source

Minor Changes

• Add support for Lazy Route Discovery (a.k.a. Fog of War) (#​11626)

  • RFC: https://redirect.github.com/remix-run/react-router/discussions/11113
  • unstable_patchRoutesOnMiss docs: https://reactrouter.com/en/main/routers/create-browser-router

Patch Changes

• Fix fetcher.submit types - remove incorrect navigate/fetcherKey/unstable_viewTransition options because they are only relevant for useSubmit (#​11631)
• Allow falsy location.state values passed to <StaticRouter> (#​11495)
• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

v6.23.1

Compare Source

Patch Changes

• Check for document existence when checking startViewTransition (#​11544)
• Change the react-router-dom/server import back to react-router-dom instead of index.ts (#​11514)
• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.23.0

Compare Source

Minor Changes

• Add a new unstable_dataStrategy configuration option (#​11098)
  • This option allows Data Router applications to take control over the approach for executing route loaders and actions
  • The default implementation is today's behavior, to fetch all loaders in parallel, but this option allows users to implement more advanced data flows including Remix single-fetch, middleware/context APIs, automatic loader caching, and more

Patch Changes

• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.22.3

Compare Source

Patch Changes

• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.22.2

Compare Source

Patch Changes

• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.22.1

Compare Source

v6.22.0

Compare Source

Minor Changes

• Include a window__reactRouterVersion tag for CWV Report detection (#​11222)

Patch Changes

• Updated dependencies:
  • @remix-run/[email protected]
  • [email protected]

v6.21.3

Compare Source

Patch Changes

• Fix NavLink isPending when a basename is used (#​11195)
• Remove leftover unstable_ prefix from Blocker/BlockerFunction types (#​11187)
• Updated dependencies:
  • [email protected]

v6.21.2

Compare Source

v6.21.1

Compare Source

Patch Changes

• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

v6.21.0

Compare Source

Minor Changes

• Add a new future.v7_relativeSplatPath flag to implement a breaking bug fix to relative routing when inside a splat route. (#​11087)

  This fix was originally added in #​10983 and was later reverted in #​11078 because it was determined that a large number of existing applications were relying on the buggy behavior (see #​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:

  <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>:

  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 ".":

  // 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:

  <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:

  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:

  <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:
  • @remix-run/[email protected]
  • [email protected]

v6.20.1

Compare Source

Patch Changes

• Revert the useResolvedPath fix for splat routes due to a large number of applications that were relying on the buggy behavior (see https://github.com/remix-run/react-router/issues/11052#issuecomment-1836589329). We plan to re-introduce this fix behind a future flag in the next minor version. (#​11078)
• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

v6.20.0

Compare Source

Minor Changes

• Export the PathParam type from the public API (#​10719)

Patch Changes

• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

v6.19.0

Compare Source

Minor Changes

• Add unstable_flushSync option to useNavigate/useSumbit/fetcher.load/fetcher.submit to opt-out of React.startTransition and into ReactDOM.flushSync for state updates (#​11005)
• Allow unstable_usePrompt to accept a BlockerFunction in addition to a boolean (#​10991)

Patch Changes

• Fix issue where a changing fetcher key in a useFetcher that remains mounted wasn't getting picked up (#​11009)
• Fix useFormAction which was incorrectly inheriting the ?index query param from child route action submissions (#​11025)
• Fix NavLink active logic when to location has a trailing slash (#​10734)
• Updated dependencies:
  • [email protected]
  • @remix-run/[email protected]

---

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

👻 Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.

---

• If you want to rebase/retry this PR, check this box

---

This PR was generated by Mend Renovate. View the repository job log.