Documentation MDX Components Guide

Most commonly used components for documentation writers

A practical guide for the most commonly used MDX components in BA documentation. This guide focuses on components you'll use most frequently when writing documentation.

Quick navigation#

• Essential components - Most commonly used
• Tabbed content - CodeTabs and Tabs for organized content
• Content organization - Structure and navigation components

Essential components#

These are the most frequently used components in BA docs.

Admonition#

Callouts for notes, warnings, and tips. Available types: note (default), tip, warning, caution, danger, deprecation.

Live preview:

Steps#

Numbered step-by-step instructions split by h2 headings.

Live preview:

Tabbed content#

Components for organizing content into tabs.

CodeTabs#

Multi-language code examples with tabs.

1
const { Client } = require('pg');
2
const client = new Client({
3
  connectionString: process.env.DATABASE_URL,
4
});
5
await client.connect();

Tabs#

General tabbed content (not just code).

Content organization#

Components for structuring and organizing page content.

DetailIconCards#

Alternative layout using DetailIconCards icons.

DocsList#

Simple, clean lists for documentation links with optional theming.

Best practices#

Component selection#

• Admonition for important callouts
• Steps for sequential instructions
• CodeTabs for multi-language examples
• DocsList for simple navigation lists

For specialized components and specific use cases, see the Component Specialized Guide.