feat: add relative=path option for url-relative routing

[brophdawg11]

Adds a relative=path option to navigation aspects to allow users to opt-into paths behaving relative to the current URL instead of the current route hierarchy. This is useful if you're sharing route patterns in a non-nested for UI reasons:

// Contact and EditContact do not share additional UI layout
<Route path="/" element={<Layout />}>
  <Route path="contacts/:id" element={<Contact />} />
  <Route path="contacts:id/edit" element={<EditContact />} />
</Route>

function EditContact() {
  // ...
  return <Link to=".." relative="path">Cancel</Link>
}

Without this, a .. link would navigate up to Layout so the user would need to reconstruct the contacts/:id url using useParams and either hardcoding the /contacts prefix or parsing it from useLocation 😕

This applies to all path-related hooks and components:

• react-router: useHref, useResolvedPath, useNavigate, Navigate
• react-router-dom: useLinkClickHandler, useFormAction, useSubmit, Link, Form
• react-router-native: useLinkPressHandler, Link

[changeset-bot]

🦋 Changeset detected

Latest commit: aa26610

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages

Name	Type
react-router	Patch
react-router-dom	Patch
react-router-native	Patch
react-router-dom-v5-compat	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[kiliman]

Awesome. This makes so much sense. I know a lot of people get tripped up by this.

[xr0master]

previously it was necessary to parse the location since the path parameter no longer exists. This is no longer required with the relative="path" parameter! It remains only to revive Prompt