import { NavigationFailure } from './errors'
import { isArray, isBrowser, noop } from './utils'
import type { Router } from './router'
-import { RouteNamedMap, RouteStaticPathMap } from './types/named'
+import type { RouteNamedMap, RouteStaticPathMap } from './types/named'
+import type { RouterTyped } from './typedRouter'
export interface RouterLinkOptions<
Routes extends RouteLocationRaw = RouteLocationRaw
*/
export const RouterLink = RouterLinkImpl as unknown as RouterLinkTyped
-export interface RouterLinkTyped<R extends Router = Router> {
+/**
+ * Typed version of the `RouterLink` component. Its generic defaults to the typed router so it can be inferred
+ * automatically for JSX.
+ */
+export interface RouterLinkTyped<R extends Router = RouterTyped> {
new (): {
$props: AllowedComponentProps &
ComponentCustomProps &
-import {
+import type {
NavigationGuardWithThis,
NavigationGuard,
RouteLocationNormalizedLoaded,
} from './types'
import { RouterView } from './RouterView'
-import { RouterLink } from './RouterLink'
-import { RouterTyped } from './typedRouter'
+import type { RouterLinkTyped } from './RouterLink'
+import type { RouterTyped } from './typedRouter'
declare module '@vue/runtime-core' {
export interface ComponentCustomOptions {
export interface GlobalComponents {
RouterView: typeof RouterView
- RouterLink: typeof RouterLink
+ RouterLink: RouterLinkTyped<RouterTyped>
}
}
})
// RouterLink
-// @ts-expect-error
+// @ts-expect-error missing to
expectError(<RouterLink />)
-// @ts-expect-error
+// @ts-expect-error: invalid prop
expectError(<RouterLink to="/" custom="text" />)
-// @ts-expect-error
+// @ts-expect-error: invalid prop
expectError(<RouterLink to="/" replace="text" />)
expectType<JSX.Element>(<RouterLink to="/foo" replace />)
expectType<JSX.Element>(<RouterLink to="/foo" />)
expectType<JSX.Element>(<RouterLink class="link" to="/foo" />)
expectType<JSX.Element>(<RouterLink to={{ path: '/foo' }} />)
expectType<JSX.Element>(<RouterLink to={{ path: '/foo' }} custom />)
+// @ts-expect-error: non existing name
+expectType<JSX.Element>(<RouterLink to={{ name: 'nope' }} custom />)
// RouterView
expectType<JSX.Element>(<RouterView class="view" />)