Optional parameters with special characters

[a4vg]

Describe the problem

It's not possible to have special characters in optional parameters. I've read the Encoding section on the docs, but it doesn't apply to optional params.

I created an /[[about-us]] route (with the "about-us" part as optional), but it throws the error: Invalid param: [about-us]. Params and matcher names can only have underscores and alphanumeric characters.

I've also tried with:

• [[about[x+2d]us]]
• [[aboutx+2dus]]

but I keep getting the same error.

As a workaround, I'm using a matcher as suggested by cirilla on Discord.

Describe the proposed solution

If it's not possible to allow special characters on the optional parameters, adding a way to have encoded params would be ok too.

Alternatives considered

No response

Importance

nice to have

Additional Information

No response

[stephane-vanraes]

I do not see how that would work, the part between the [[ ]] (or for that matter between [ ]) has to be a valid javascript property, after all it would be translated to params.about-us which obviously doesn't work in javascript it could be reached by using params['about-us'] but I feel that would be unnecessary complicated,

all in all the actual name of the property has no real meaning here, using about_us would work just as well without any extra pitfalls

note that a matcher would be the only way to ensure it is /about-us anyway, once you use a slug it can be anything

[a4vg]

I'm migrating an existing website which already uses /about-us, so I can't use /about_us.

I'll stick with the matcher then. It's just that it seems such a common use case (an optional path with a hyphen) that I found weird there wasn't another way.

[ghostdevv]

The parm inside the [] or [[]] is just what it's called, there is no other significance - If I had [[test]] I could still go to / and /about-us, or even /foobar and get to the same +page.svelte. The about-us, foorbar etc would be $page.params.test.

Using a matcher here is one of the correct solutions, another could be checking what the path is in a layout and redirecting if it's not / or /about-us. Furthermore you could even use a component as your page and import it in both routes/+page.svelte and routes/about-us/+page.svelte. It's really up to you.

As far as I can tell it's intended that you can't use escape sequences here, - wouldn't even be one since it's allowed on the file system. So I am going to close this for now :pray: