Component Gallery

This is a gallery listing of all the Components you have access to when writing content for this Docs site. Some of these components come directly from Nexus and therefore are brand-consistent. Others are wrapped Docusaurus components and so start as unbranded; the indicator should describe if the component has been branded/themed or not.

Markdown​

CommonMark and MDX are supported. There may be some overlap or extension of these below.

Nexus Components​

Coming Soon...

Docusaurus Components​

Placeholder​

Use this in lieu of a component that has not yet been built.

  <Placeholder label={"Here's some content"}>

Headings​

Markdown allows for tiered headings:

## Level 2 title

### Level 3 title

#### Level 4 title

Tabs​

Reference

import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";

<Tabs>
	<TabItem value="apple" label="Apple" default>
		This is an apple 🍎
	</TabItem>
	<TabItem value="orange" label="Orange">
		This is an orange 🍊
	</TabItem>
	<TabItem value="banana" label="Banana">
		This is a banana 🍌
	</TabItem>
</Tabs>;

Code Blocks​

Reference

```jsx title="/src/components/HelloCodeTitle.js" showLineNumbers
function HelloCodeTitle(props) {
	return <h1>Hello, {props.name}</h1>;
}
```

BrowserWindow

function HelloCodeTitle(props) {
	return <h1>Hello, {props.name}</h1>;
}

BrowserWindow

Table of Contents​

import TOCInline from "@theme/TOCInline";
<TOCInline toc={toc} />;

Navigation Buttons​

import DocPaginator from '@theme/DocPaginator';
<DocPaginator previous={{some: "prop"}} next={{another: "prop"}}} />