feat: optional params and static segments

[lordofthecactus]

Closes: #9550

Allows optional params and optional static segments

Optional params examples

:lang?/about will get expanded matched with

/:lang/about
/about

/multistep/:widget1?/widget2?/widget3?
Will get expanded matched with:

/multistep
/multistep/:widget1
/multistep/:widget1/:widget2
/multistep/:widget1/:widget2/:widget3

Same with static segments

/fr?/about will get expanded and matched with:

/about
/fr/about

Context

Code was added at the point of flattenRoutes

Feedback required

Should we allow intercalated situations? currently:
/one/:two?/three/four? gets matched with:

/one/:two/three
/one/:two/three/:four

[changeset-bot]

🦋 Changeset detected

Latest commit: afbcf9a

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

This PR includes changesets to release 5 packages

Name	Type
react-router	Minor
@remix-run/router	Minor
react-router-dom	Minor
react-router-dom-v5-compat	Minor
react-router-native	Minor

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

[remix-cla-bot]

Hi @lordofthecactus,

Welcome, and thank you for contributing to React Router!

Before we consider your pull request, we ask that you sign our Contributor License Agreement (CLA). We require this only once.

You may review the CLA and sign it by adding your name to contributors.yml.

Once the CLA is signed, the CLA Signed label will be added to the pull request.

If you have already signed the CLA and received this response in error, or if you have any questions, please contact us at [email protected].

Thanks!

- The Remix team

[remix-cla-bot]

Thank you for signing the Contributor License Agreement. Let's get this merged! 🥳

[ryanflorence]

Awesome! Thanks Daniel! Pedro will work with you to get this over the finish line.

[ryanflorence]

I think we should support /one/:two?/three/four?, yes. The concern is always ranking when multiple patterns match the URL. I imagine we handle it the same as if the user typed them all out by hand:

<Route path="/one/:two?/three/four?" />
// becomes
1. <Route path="/one/:two/three/four" />
2. <Route path="/one/three/four" />
3. <Route path="/one/:two/three" />
4. <Route path="/one/three" />

And the ranking should behave the same way.

[brophdawg11]

Agreed - this "exploding" approach (before scoring/ranking) is designed to do just that - behave as if the user manually exploded the enumerations out on their own 👍

[pcattori]

Looks like CI is failing due to filesize limitations. @lordofthecactus , could you bump the 35kB to 35.5kB for packages/router/dist/router.umd.min.js in package.json?

[lordofthecactus]

@pcattori made the changes

[ryanflorence]

We gotta get @developit in here to shrink it all down again.