---
name: docs-creator
description: Create and organize public documentation pages using Fumadocs. Use when building new documentation pages or organizing existing ones.
---

# Documentation Creator Skill

This skill helps you build public-facing documentation in `src/content/docs`. The system is powered by [Fumadocs](https://fumadocs.dev) and supports MDX, automatic routing, and Lucide icons.

## Core Concepts

### 1. File Structure
-   **Root**: `src/content/docs/`
-   **Pages**: `.mdx` files become pages (e.g., `getting-started.mdx` -> `/docs/getting-started`).
-   **Nested**: Folders create URL segments (e.g., `api/auth.mdx` -> `/docs/api/auth`).
-   **Images**: Automatic OG image generation is enabled.

### 2. Frontmatter
Every `.mdx` file should have frontmatter:

```yaml
---
title: Page Title
description: A short description for SEO and search
icon: Box # Lucide icon name
---
```

### 3. Folder Organization (`meta.json`)
Control sidebar order, group titles, and icons by placing a `meta.json` in any directory.

```json
{
  "title": "Section Name",
  "icon": "Settings",
  "pages": [
    "index",           // Matches index.mdx
    "getting-started", // Matches getting-started.mdx
    "---Separator---", // Adds a visual separator
    "advanced"         // Matches advanced/ folder or file
  ],
  "defaultOpen": true
}
```

## Features

-   **Lucide Icons**: Use any [Lucide icon name](https://lucide.dev/icons) in frontmatter `icon: Name`.
-   **Components**: All standard MDX components + Fumadocs UI components (Callout, Cards, Tabs) are available.
-   **Relative Links**: `[Link](./other-page)` works correctly.
-   **Sitemap**: Automatically generated.

## Examples

### Basic Page (`src/content/docs/introduction.mdx`)
```mdx
---
title: Introduction
description: Getting started with our platform
icon: BookOpen
---

# Welcome

This is the introduction page.

## Next Steps
- [Installation](./installation)
- [Configuration](./config)
```

### Folder Metadata (`src/content/docs/api/meta.json`)
```json
{
  "title": "API Reference",
  "icon": "Webhook",
  "root": true, 
  "pages": ["introduction", "endpoints", "authentication"]
}
```
*Note: `"root": true` makes this folder a separate tab in the sidebar if using root-level folders.*