React Aria: External <Link> incorrectly uses client side routing with React Router

Provide a general summary of the issue here

I am using React Aria with React Router and the Link component behaves not as expected. External links are opened in a new tab prefixed by the URL from React Router. Any help with this issue would be greatly appreciated.

<Link href="https://cds.climate.copernicus.eu/#!/home" target="_blank">
    Copernicus Climate Data Store
</Link>

This Link should open in a new tab and circumvent React Router as is stated here:

Note that external links to different origins will not trigger client side routing, and will use native browser navigation. Additionally, if the link has a target other than "_self", uses the download attribute, or the user presses modifier keys such as Command or Alt to change the default behavior, browser native navigation will occur instead of client side routing.

🤔 Expected Behavior?

Should open a new tab with https://cds.climate.copernicus.eu/#!/home

😯 Current Behavior

Opens a new tab with http://127.0.0.1:5173/baseurl/https:/cds.climate.copernicus.eu/#!/home

💁 Possible Solution

No response

🔦 Context

Vite React react-router-dom

main.jsx

import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { BrowserRouter } from "react-router-dom";

import App from "./App";

const root = createRoot(document.getElementById("root"));
root.render(
  <StrictMode>
    <BrowserRouter basename={import.meta.env.BASE_URL}>
      <App />
    </BrowserRouter>
  </StrictMode>
);

App.jsx

import { RouterProvider } from "react-aria-components";
import { Route, Routes, useHref, useNavigate } from "react-router-dom";

import Navbar from "./components/Navbar";
import HomeRoute from "./components/HomeRoute";
import MapRoute from "./components/DifferentRoute";

function App() {
  let navigate = useNavigate();

  return (
    <RouterProvider navigate={navigate} useHref={useHref}>
          <div className="App">
            <Navbar />
            <Routes>
              <Route path="/" element={<HomeRoute />} />
              <Route path="/map" element={<DifferentRoute />} />
            </Routes>
          </div>
    </RouterProvider>
  );
}

export default App;

🖥️ Steps to Reproduce

I'm not sure if I can reproduce the behavior with the listed sandboxes, but I included relevant files with a minimal example above.

Version

"react-aria-components": "^1.2.1",

What browsers are you seeing the problem on?

Firefox, Chrome

If other, please specify.

No response

What operating system are you using?

Windows Subsystem for Linux (Debian)

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

adobe / react-spectrum