Custom Components

How MDX components are registered in Flame and how to plan for custom ones.

How Components Are Registered

Flame registers MDX components through createMdxComponents() from @docubook/mdx-content. The built-in components (Note, Steps, Tabs, Card, etc.) come from that package.

The function accepts a customComponents parameter for overrides — but Flame calls it without arguments in all three places where it's used (SSR build, client hydration, component registry).

No custom component registration mechanism exists today.

Future: registry-based

The path forward is a code registry inspired by shadcn/ui registry:

bash
flame add <component-name>

The CLI would download component files into the project and register them automatically — feeding into createMdxComponents() at build time. No plugin hooks needed.

Built-in component list

These are the MDX components available by default:

MDX tagComponentPackage
<Note>NoteMdx@docubook/mdx-content
<Steps>, <Step>StepsMdx, StepMdx@docubook/mdx-content
<Tabs>, <Tab>TabsMdx, TabMdx@docubook/mdx-content
<Card>, <Cards>CardMdx, CardsMdx@docubook/mdx-content
<Accordion>, <Accordions>AccordionMdx, AccordionsMdx@docubook/mdx-content
<Kbd>KbdMdx@docubook/mdx-content
<Tooltip>TooltipMdx@docubook/mdx-content
<Mermaid>MermaidMdx@docubook/mdx-content
<Image>, <img>ImageMdx@docubook/mdx-content
<Youtube>YoutubeMdx@docubook/mdx-content
<Release>, <Changes>ReleaseMdx, ChangesMdx@docubook/mdx-content
<Files>, <File>, <Folder>FileTreeMdx@docubook/mdx-content
<Button>ButtonMdx@docubook/mdx-content
a, LinkLinkMdx@docubook/mdx-content
pre, codeCodeBlock@docubook/mdx-content
table, thead, tbody, tr, th, tdTableMdx components@docubook/mdx-content

Last updated Jul 9, 2026