Use <DirectoryListing /> to display the directory of a specific folder, which appears as a list of links.
import { DirectoryListing } from "~/components";
<p>
<strong>Default</strong>
</p>
<DirectoryListing folder="workers/wrangler" />
<br />
<p>
<strong>maxDepth</strong>
</p>
<DirectoryListing folder="workers/wrangler" maxDepth={2} />
<p>
<strong>Descriptions</strong>
</p>
<DirectoryListing folder="workers/wrangler" descriptions />
<p>
<strong>Button</strong>
</p>
<DirectoryListing folder="workers/wrangler" button />type: string
The folder path to list contents from. If not provided, defaults to the current page's path.
type: boolean
default: false
When enabled, displays the listing as a 3-column grid of button-style cards (sorted alphabetically) instead of a bullet list. The cards match the style of Starlight's LinkCard component.
type: boolean
default: false
When enabled, shows the frontmatter description field for each page in the listing.
type: number
default: 1
Controls how many levels of nested pages to display. A value of 1 shows only direct children, while higher values will show deeper nesting levels.
type: string
Optionally, filter the listing to only pages with a specific tag.