Components
Browse Plandalf's Mintlify-style MDX component library for structure, attention, API docs, navigation, and visual context.
Plandalf docs use Mintlify-style MDX components so implementation guides can teach one step at a time, keep examples close to the API call, and move readers to the next useful page without turning every section into a dashboard.
The main path
-
Start with the one move the reader should make next.
Use Steps when a reader needs to move through setup in order.
-
Offer the right implementation view
Let the reader choose HTML, React, API, or agent-oriented examples.
Use Tabs, Code groups, or View when the same concept has multiple implementation paths.
-
Define terms and constraints without interrupting the flow.
-
Show exact parameters, responses, and examples beside the explanation.
-
Only add navigation surfaces once the reader understands what they need next.
Structure your content
Tabs
Organize related content into switchable tabbed views.
Code groups
Display code examples in multiple languages.
Steps
Display sequential instructions in a numbered format.
Columns
Arrange content side by side in responsive layouts.
Panel
Create side-panel context for supplementary content.
Text formatting
Format prose, links, quotes, inline values, and anchors.
Code formatting
Add titles, line numbers, highlights, diffs, wrapping, and expandable snippets.
Lists and tables
Structure ordered lists, checklists, nested lists, and compact reference tables.
Headings
Render explicit imported section headings without rewriting MDX.
Draw attention
Callouts
Emphasize notes, tips, checks, warnings, and danger states.
Banner
Display prominent announcements at the top of docs pages.
Badge
Add inline labels and compact status indicators.
Update
Highlight dated product updates and changelog entries.
Frames
Add borders and captions to images and media.
Tooltips
Display short contextual definitions on hover.
Snippet
Show compact copyable values inside prose.
Reusable snippets
Reuse MDX fragments and compact setup values across docs pages.
Showcase AI prompts
Show and hide content
Accordions
Expandable sections for progressive disclosure.
Expandables
Show and hide detailed content on demand.
View
Switch visible content by reader context.
Visibility
Control content shown to humans versus AI agents.
Document your API
Fields
Display request parameters, headers, body fields, and props.
Responses
Document API response structures and fields with Mintlify-compatible naming.
ResponseField
Describe a single response property, nested object, or returned value.
Examples
Show request and response examples beside API content.
API endpoint pages
Pair endpoint metadata with request fields, response fields, and the right example rail.
API playground pages
Build manual Mintlify-style API pages with multiple responses, SDK samples, and OpenAPI planning notes.
Link to other pages
Cards
Highlight links with customizable containers, icons, images, and CTAs.
Tiles
Display visual previews and dense navigation grids.
Add visual context
Images and embeds
Add screenshots, media-library images, videos, and iframe embeds.
Files
Link downloadable files, static assets, and reference artifacts.
Icons
Add visual indicators using the shared docs icon layer.
Mermaid diagrams
Create flowcharts, sequence diagrams, and other small visualizations.
Color
Display color swatches with copyable values.
Tree
Display hierarchical file and folder structures.