From 0956f4f33e15abce8674cc7f1d8728bca479d7d5 Mon Sep 17 00:00:00 2001
From: Tate Thurston <tatethurston@gmail.com>
Date: Tue, 24 Sep 2024 21:05:33 -0700
Subject: [PATCH] Tatthurs/nextjs link type (#200)

* Update nextjs link types

* Update nextjs link types
---
 .husky/pre-commit                             |   2 +-
 CHANGELOG.md                                  |   2 +
 examples/app/@types/nextjs-routes.d.ts        | 103 ++-
 examples/cjs/types/nextjs-routes.d.ts         |  35 +-
 examples/intl/@types/nextjs-routes.d.ts       |  35 +-
 examples/typescript/types/nextjs-routes.d.ts  |  35 +-
 packages/e2e/@types/nextjs-routes.d.ts        |  35 +-
 packages/e2e/typetest.tsx                     |   2 +
 packages/nextjs-routes/package.json           |   2 +-
 .../src/__snapshots__/core.test.ts.snap       | 795 ++++++++----------
 packages/nextjs-routes/src/core.ts            | 103 ++-
 11 files changed, 491 insertions(+), 658 deletions(-)

diff --git a/.husky/pre-commit b/.husky/pre-commit
index 3b72917..074d80b 100755
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -1,3 +1,3 @@
-pnpm run package:build
+pnpm run e2e:setup
 pnpm run examples:regen
 pnpm run lint:fix
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 92be758..0bcd0be 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -27,6 +27,8 @@
 
 - Fix generated routes when using [parallel-routes](https://nextjs.org/docs/app/building-your-application/routing/parallel-routes) and [intercepting-routes](https://nextjs.org/docs/app/building-your-application/routing/intercepting-routes).
 
+- Fix `ref` type for `Link`. Previously `ref` was missing, now it's correctly typed.
+
 ## 2.2.1
 
 - Fix route generation on Windows. See [#187](https://github.com/tatethurston/nextjs-routes/issues/187). Thanks @AkanoCA!
diff --git a/examples/app/@types/nextjs-routes.d.ts b/examples/app/@types/nextjs-routes.d.ts
index ade9588..d61e0a2 100644
--- a/examples/app/@types/nextjs-routes.d.ts
+++ b/examples/app/@types/nextjs-routes.d.ts
@@ -83,35 +83,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route, RouteLiteral } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: StaticRoute | RouteLiteral;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML `<a>` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: `<Link>`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -181,41 +172,41 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * ```ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * ```
- *
- * Read more: [Next.js Docs: `usePathname`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * ```ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * ```
+   *
+   * Read more: [Next.js Docs: `usePathname`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * ```ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * ```
- *
- * Read more: [Next.js Docs: `useParams`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * ```ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * ```
+   *
+   * Read more: [Next.js Docs: `useParams`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
diff --git a/examples/cjs/types/nextjs-routes.d.ts b/examples/cjs/types/nextjs-routes.d.ts
index 36684ac..54c37cc 100644
--- a/examples/cjs/types/nextjs-routes.d.ts
+++ b/examples/cjs/types/nextjs-routes.d.ts
@@ -83,35 +83,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML `<a>` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: `<Link>`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
diff --git a/examples/intl/@types/nextjs-routes.d.ts b/examples/intl/@types/nextjs-routes.d.ts
index 3ec0980..5269920 100644
--- a/examples/intl/@types/nextjs-routes.d.ts
+++ b/examples/intl/@types/nextjs-routes.d.ts
@@ -90,35 +90,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: Locale | false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML `<a>` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: `<Link>`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
diff --git a/examples/typescript/types/nextjs-routes.d.ts b/examples/typescript/types/nextjs-routes.d.ts
index 57e964e..aef6fc1 100644
--- a/examples/typescript/types/nextjs-routes.d.ts
+++ b/examples/typescript/types/nextjs-routes.d.ts
@@ -85,35 +85,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML `<a>` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: `<Link>`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
diff --git a/packages/e2e/@types/nextjs-routes.d.ts b/packages/e2e/@types/nextjs-routes.d.ts
index 10bcb65..9dc3e6d 100644
--- a/packages/e2e/@types/nextjs-routes.d.ts
+++ b/packages/e2e/@types/nextjs-routes.d.ts
@@ -84,35 +84,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML `<a>` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: `<Link>`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
diff --git a/packages/e2e/typetest.tsx b/packages/e2e/typetest.tsx
index 14174d9..b59e450 100644
--- a/packages/e2e/typetest.tsx
+++ b/packages/e2e/typetest.tsx
@@ -83,6 +83,8 @@ function expectType<T>(_value: T) {}
 <Link href={{ query: {} }} replacey />;
 // anchor props https://beta.nextjs.org/docs/api-reference/components/link#props
 <Link href={{ query: {} }} className="foo" />;
+<Link href="/" ref="legacy-ref" />;
+<Link href="/" ref={(_ref: HTMLAnchorElement | null) => {}} />;
 
 // LinkProps
 
diff --git a/packages/nextjs-routes/package.json b/packages/nextjs-routes/package.json
index 3640c5c..50fca75 100644
--- a/packages/nextjs-routes/package.json
+++ b/packages/nextjs-routes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nextjs-routes",
-  "version": "2.2.2-rc.3",
+  "version": "2.2.2-rc.4",
   "description": "Type safe routing for Next.js",
   "license": "MIT",
   "author": "Tate <tatethurston@gmail.com>",
diff --git a/packages/nextjs-routes/src/__snapshots__/core.test.ts.snap b/packages/nextjs-routes/src/__snapshots__/core.test.ts.snap
index 55fdcdb..32cc04d 100644
--- a/packages/nextjs-routes/src/__snapshots__/core.test.ts.snap
+++ b/packages/nextjs-routes/src/__snapshots__/core.test.ts.snap
@@ -94,35 +94,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route, RouteLiteral } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: StaticRoute | RouteLiteral;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -192,42 +183,42 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
 ",
@@ -323,35 +314,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route, RouteLiteral } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: StaticRoute | RouteLiteral;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -421,42 +403,42 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
 ",
@@ -553,35 +535,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route, RouteLiteral } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: StaticRoute | RouteLiteral;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -651,42 +624,42 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
 ",
@@ -782,35 +755,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route, RouteLiteral } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: StaticRoute | RouteLiteral;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -880,42 +844,42 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
 ",
@@ -1018,35 +982,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: Locale | false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -1220,35 +1175,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -1407,35 +1353,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -1592,35 +1529,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -1777,35 +1705,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -1962,35 +1881,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -2149,35 +2059,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route, RouteLiteral } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname"> | RouteLiteral;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -2247,42 +2148,42 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
 ",
@@ -2378,35 +2279,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -2580,35 +2472,26 @@ declare module "nextjs-routes" {
 declare module "next/link" {
   import type { Route } from "nextjs-routes";;
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: Route | StaticRoute | Omit<Route, "pathname">;
     locale?: false;
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
diff --git a/packages/nextjs-routes/src/core.ts b/packages/nextjs-routes/src/core.ts
index dc1f232..b02682c 100644
--- a/packages/nextjs-routes/src/core.ts
+++ b/packages/nextjs-routes/src/core.ts
@@ -206,19 +206,11 @@ declare module "next/link" {
     }
   })()};
   import type { LinkProps as NextLinkProps } from "next/dist/client/link";
-  import type {
-    AnchorHTMLAttributes,
-    DetailedReactHTMLElement,
-    MouseEventHandler,
-    PropsWithChildren,
-  } from "react";
-  export * from "next/dist/client/link";
+  import type React from "react";
 
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
-  export interface LinkProps
-    extends Omit<NextLinkProps, "href" | "locale">,
-      AnchorHTMLAttributes<HTMLAnchorElement> {
+  export type LinkProps = Omit<NextLinkProps, "href" | "locale"> & {
     href: ${(() => {
       if (config.usingPagesDirectory && config.usingAppDirectory) {
         return 'Route | StaticRoute | Omit<Route, "pathname"> | RouteLiteral';
@@ -231,18 +223,17 @@ declare module "next/link" {
     locale?: ${!i18n.locales.length ? "false" : `Locale | false`};
   }
 
-  type LinkReactElement = DetailedReactHTMLElement<
-    {
-      onMouseEnter?: MouseEventHandler<Element> | undefined;
-      onClick: MouseEventHandler;
-      href?: string | undefined;
-      ref?: any;
-    },
-    HTMLElement
-  >;
-
-  declare function Link(props: PropsWithChildren<LinkProps>): LinkReactElement;
-
+  /**
+   * A React component that extends the HTML \`<a>\` element to provide [prefetching](https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating#2-prefetching)
+   * and client-side navigation between routes.
+   *
+   * It is the primary way to navigate between routes in Next.js.
+   *
+   * Read more: [Next.js docs: \`<Link>\`](https://nextjs.org/docs/app/api-reference/components/link)
+   */
+  declare const Link: React.ForwardRefExoticComponent<Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof LinkProps> & LinkProps & {
+      children?: React.ReactNode;
+  } & React.RefAttributes<HTMLAnchorElement>>;
   export default Link;
 }
 
@@ -322,42 +313,42 @@ declare module "next/navigation" {
   export * from "next/dist/client/components/navigation";
   import type { RoutedQuery, RouteLiteral } from "nextjs-routes";
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read the current URL's pathname.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { usePathname } from 'next/navigation'
- *
- * export default function Page() {
- *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
- *  // ...
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read the current URL's pathname.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { usePathname } from 'next/navigation'
+   *
+   * export default function Page() {
+   *  const pathname = usePathname() // returns "/dashboard" on /dashboard?foo=bar
+   *  // ...
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`usePathname\`](https://nextjs.org/docs/app/api-reference/functions/use-pathname)
+   */
   export function usePathname(): RouteLiteral;
 
-/**
- * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
- * that lets you read a route's dynamic params filled in by the current URL.
- *
- * @example
- * \`\`\`ts
- * "use client"
- * import { useParams } from 'next/navigation'
- *
- * export default function Page() {
- *   // on /dashboard/[team] where pathname is /dashboard/nextjs
- *   const { team } = useParams() // team === "nextjs"
- * }
- * \`\`\`
- *
- * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
- */
+  /**
+   * A [Client Component](https://nextjs.org/docs/app/building-your-application/rendering/client-components) hook
+   * that lets you read a route's dynamic params filled in by the current URL.
+   *
+   * @example
+   * \`\`\`ts
+   * "use client"
+   * import { useParams } from 'next/navigation'
+   *
+   * export default function Page() {
+   *   // on /dashboard/[team] where pathname is /dashboard/nextjs
+   *   const { team } = useParams() // team === "nextjs"
+   * }
+   * \`\`\`
+   *
+   * Read more: [Next.js Docs: \`useParams\`](https://nextjs.org/docs/app/api-reference/functions/use-params)
+   */
   export function useParams<Pathname extends Route["pathname"] = Route["pathname"]>(): RoutedQuery<Pathname>;
 }
 `;