nuqs
itemadapter-react-router-v5source: ok · hit
React Router v5 Adapter
Using nuqs in React Router v5 applications.
npx shadcn add "https://nuqs.dev/r/adapter-react-router-v5.json"free
No selection tags yet — empty means no evidence, not lack of support.
Dependencies
Bundle weight · lightreact-router-dom@^5nuqs
Files1 · source cached 10/15/2026, 6:15:14 AM
src/registry/items/adapter-react-router-v5.source
import {
type unstable_AdapterInterface as AdapterInterface,
unstable_createAdapterProvider as createAdapterProvider,
renderQueryString,
type unstable_UpdateUrlFunction as UpdateUrlFunction
} from 'nuqs/adapters/custom'
import { useCallback, useMemo } from 'react'
import { useHistory, useLocation } from 'react-router-dom'
function useNuqsReactRouterV5Adapter(): AdapterInterface {
const history = useHistory()
const location = useLocation()
const searchParams = useMemo(() => {
return new URLSearchParams(location.search)
}, [location.search])
const updateUrl = useCallback<UpdateUrlFunction>(
(search, options) => {
const queryString = renderQueryString(search)
if (options.history === 'push') {
history.push({
search: queryString,
hash: window.location.hash
})
} else {
history.replace({
search: queryString,
hash: window.location.hash
})
}
if (options.scroll) {
window.scrollTo(0, 0)
}
},
[history.push, history.replace]
)
return {
searchParams,
updateUrl
}
}
export const NuqsAdapter = createAdapterProvider(useNuqsReactRouterV5Adapter)