Typed Links for Next.js

Previous

Type-safe linking for Next.js (using typedRoutes + nuqs)

Docs
nuqsitem

Preview

Loading preview…
lib/typed-links.ts
import type { Route } from 'next'
import {
  createSerializer,
  type CreateSerializerOptions,
  type ParserMap
} from 'nuqs/server'

export function createTypedLink<Parsers extends ParserMap>(
  route: Route,
  parsers: Parsers,
  options: CreateSerializerOptions<Parsers> = {}
) {
  const serialize = createSerializer<Parsers, Route, Route>(parsers, options)
  return serialize.bind(null, route)
}

Installation

npx shadcn@latest add @nuqs/next-typed-links

Usage

import { NextTypedLinks } from "@/components/next-typed-links"
<NextTypedLinks />