Skip to main content
Type-safe links to documentation pages with compile-time TypeScript validation and runtime checking.

​
Basic Usage

import { PageLink } from "/snippets/tsdocs/PageLink.jsx"

<PageLink target="quickstart" />
Default link text
quickstart
With custom text: 
<PageLink target="guides/setup-guide">Setup Guide</PageLink>
Custom link text
Check the coverage docs for details.

​
Properties

​
target
string
required
Page path from docs.json. Must match navigation entries exactly.Examples: quickstart, guides/setup-guide, components/type-tree
​
children
ReactNode
Link text. Defaults to the page path if omitted.

​
Type Safety

PageLink validates links in two ways: Compile-time - TypeScript checks against ValidPages.d.ts: 
<PageLink target="quickstart" />        // ✅ Valid
<PageLink target="nonexistent-page" />  // ❌ Type error
Runtime - Browser checks against ValidPages Set and applies styling:
Valid vs broken links
✅ Valid: Introduction
❌ Broken: Fake Page
Broken links get:
  • Red color (#ef4444)
  • Red dotted underline (2px)
  • Red wavy text decoration
  • Tooltip showing the error
Learn more: Link Validation

​
Examples

Linking to different page types

​
Page Paths

Page paths must match docs.json navigation entries: 
{
  "pages": [
    "introduction",        // ← use "introduction"
    "guides/setup-guide"   // ← use "guides/setup-guide"
  ]
}
Path normalization: leading / is added automatically if missing. Links break when pages are removed from docs.json, renamed, or moved.
  1. Check TypeScript error in IDE
  2. Verify page exists in docs.json navigation
  3. Update target to match exact path
  4. Run mint-tsdocs generate if navigation changed

​
Best Practices

Use PageLink for guides/concepts, RefLink for API references
Use exact paths from docs.json
Avoid hardcoded absolute paths
Fix broken links before committing

​
Troubleshooting

Run mint-tsdocs generate to copy components to docs/snippets/tsdocs/
Verify the page is listed in docs.json navigation and path matches exactly (case-sensitive).
Due to an MDX extension bug, try:
  1. Use relative path while editing: "../snippets/tsdocs/PageLink.jsx"
  2. Get autocomplete
  3. Change back to absolute: "/snippets/tsdocs/PageLink.jsx"

RefLink

API reference links

Link Validation

How validation works

Custom Styles

Style broken links