Pagination Component (shadcn/ui)

[dmytrotree]

Is there a way to implement <Link /> despite the absence of Next.js in the design-system package in its current setup?

By default the <PaginationLink /> component will render an <a /> tag. To use the Next.js <Link /> component, make the following updates to pagination.tsx.

Link to docs: shadcn/pagination

[QuentinFrc]

1. You can add next as peerDependency (and dev if you get problems when running lint or dev commands) and import Link from next package on design-system package (since package is only used by next projects)
2. You can use Slot primitives from Radix-ui in order to implement an asChild prop (But you will need to use asChild prop every time using PaginationLink)

Ex:

// import Link from 'next/link';

<PaginationLink asChild>
  <Link href="/page-1">1</Link>
</PaginationLink>