You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Define an optional searchParams schema inside each route() entry.
Keys merge into the existing params object, giving type-safety to both href() and component props.
When user is already using flat routes you can augment the existing fs routes with ones with the search params, react router will deduplicate entries with the same path:
Supports arrays (repeat keys), numbers, emails, etc.
Validation
Powered by standard-schema, so any validator (Zod, Yup, Ajv, …) can be plugged in.
Error Handling
Validation failures bubble to the route’s existing error boundary.
Scope & Compatibility
Fully opt-in: no searchParams → current behavior
Name-collision check keeps path params intact
Not applicable to data-router or declarative <Routes> mode
FAQ
Question
Answer
Why reuse params instead of adding searchParams?
Smaller surface; keeps href() and component props unchanged.
Can I swap validation libraries?
Yes—standard-schema is just an adapter layer.
What data types are supported?
Anything jsonschema can express—numbers, arrays, enums, email, etc.
What happens on validation error?
Your route’s error boundary renders.
Does this touch declarative routes?
No—those modes stay exactly as they are.
Blockers
To extract the typescript code from the params schema defined using standard-schema we need to wait for jsonschema support in standard-schema first, or only support Zod initially.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
Initial Idea
Define an optional
searchParams
schema inside eachroute()
entry.Keys merge into the existing
params
object, giving type-safety to bothhref()
and component props.Example
When user is already using flat routes you can augment the existing fs routes with ones with the search params, react router will deduplicate entries with the same path:
Usage
Motivation
href()
creation and component accessValidation
Powered by standard-schema, so any validator (Zod, Yup, Ajv, …) can be plugged in.
Error Handling
Validation failures bubble to the route’s existing error boundary.
Scope & Compatibility
searchParams
→ current behavior<Routes>
modeFAQ
params
instead of addingsearchParams
?href()
and component props unchanged.standard-schema
is just an adapter layer.Blockers
To extract the typescript code from the params schema defined using standard-schema we need to wait for jsonschema support in standard-schema first, or only support Zod initially.
Beta Was this translation helpful? Give feedback.
All reactions