Fumadocs component pack

Install the alpha

corepack pnpm add @inkeep/open-knowledge-components-fumadocs@alpha

In an OpenKnowledge Desktop build with component-pack support, add node_modules/@inkeep/open-knowledge-components-fumadocs in Settings → This project → Integrations → Components, then trust and enable it. The npm package includes its styles and needs no local build.

Using the pack

The component gallery shows every export in this pack. See the pack overview for all packages and the Changesets release workflow.

This example exports Callout, Tabs, and Tab through one mdx-components.tsx file. In OpenKnowledge Desktop, open Settings → This project → Integrations → Components. Select this folder. Enable the pack for the current project. If the entry file changes, OpenKnowledge reloads the project.

The default Tabs insertion contains one empty panel. To edit tabs:

1. Rename the tab in the child Properties panel.
2. Edit its body directly in the visual editor.
3. Add tabs from the parent Properties panel.

<Tabs>

<Tab value="Tab">

Panel content.

</Tab>

</Tabs>

The component map uses the original Fumadocs Tabs and Tab components. A prop is an input to a component. OpenKnowledge builds the native items prop from each child value. The original tab components keep their shared state. The panel body stays editable in the document.

The styles come from Fumadocs 16.1.0 under its MIT license, included in LICENSE. They apply only inside this pack, so they do not change the editor controls or page layout. The pack keeps the shipped neutral colors. The Fumadocs website uses a custom blue tab color. The editor.css file removes extra margins added by editable content and makes the idea icon’s outline visible. After changing it or updating Fumadocs, run corepack pnpm styles:generate from this folder. Run corepack pnpm styles:check to check that the generated file is current.