TSX Docs

We provide components to get you going fast when documenting your components or libraries. These are built to look great and they're easily customisible - they're styled-components after all.

Link

Use the <Link> component to route to your pages.

It's the same as Next.js Link, read more in the docs.

<CodeHighlight
	code={`
		<Link href="/test-page" prefetch>
			<a>Test Page</a>
		</Link>
	`}
	language="tsx"
/>

Lead

The <Lead> component helps text standout. It's especially useful for introductions to pages.

The quick brown fox jumps over the lazy dog

<Lead>The quick brown fox jumps over the lazy dog</Lead>

CodeHighlight

Use the <CodeHighlight> component to err... highlight code!

<CodeHighlight
	code={`
		import React from 'react'

		const Component = () => <p>Content</p>

		export default Component
	`}
	language="tsx"
/>

The language prop supports javascript, typescript, JSX, TSX, bash, json.

Core Components

TSX Docs exports the following core components:

  • <App>
  • <Document>
  • <Error>

These components are there to give you an instant layer of styling and functionality so you don't have to worry about them unless you want to customise the shell of the pages.