### Install documentation-ai CLI on Linux

Source: https://documentation.ai/docs/write-and-publish/cursor

Use apt to install the documentation-ai package and npm to install the CLI globally on Linux.

```bash
sudo apt install documentation-ai
npm install -g doc-ai-cli
```

--------------------------------

### Complete Header Configuration Example

Source: https://documentation.ai/docs/customize/header-and-navbar

A full example of a configured navbar with primary and multiple secondary links.

```json
{
  "navbar": {
    "actions": {
      "primary": {
        "title": "Start Free Trial",
        "link": "https://app.example.com/signup"
      },
      "links": [
        {
          "title": "Sign In",
          "link": "https://app.example.com/login"
        },
        {
          "title": "Pricing",
          "link": "https://example.com/pricing"
        },
        {
          "title": "Get Help",
          "link": "mailto:support@example.com"
        }
      ]
    }
  }
}
```

--------------------------------

### Install documentation-ai CLI on Windows

Source: https://documentation.ai/docs/write-and-publish/cursor

Use winget to install the documentation-ai package and npm to install the CLI globally on Windows.

```powershell
winget install documentation-ai
npm install -g doc-ai-cli
```

--------------------------------

### Steps Component with Icons and Code Examples

Source: https://documentation.ai/docs/components/steps

Illustrates using the Steps and Step components with titles, icons, and embedded code blocks for each step. This is suitable for guides that involve installation or configuration.

```jsx
<Steps>
  <Step title="Install dependencies" icon="download">
    Run the installation command to add required packages to your project.
    
    ```bash
    npm install documentation-ai
    ```
  </Step>
  <Step title="Configure settings" icon="settings">
    Create a configuration file in your project root with your API credentials.
    
    ```javascript
    module.exports = {
      apiKey: process.env.DOC_AI_KEY
    }
    ```
  </Step>
  <Step title="Deploy documentation" icon="rocket">
    Push your changes and deploy to production.
    
    ```bash
    npm run deploy
    ```
  </Step>
</Steps>
```

```jsx
<Steps>
  <Step title="Install dependencies" icon="download" title-type="p">
    Run the installation command to add required packages to your project.

    ```bash
    npm install documentation-ai
    ```
  </Step>

  <Step title="Configure settings" icon="settings" title-type="p">
    Create a configuration file in your project root with your API credentials.

    ```javascript
    module.exports = {
      apiKey: process.env.DOC_AI_KEY
    }
    ```
  </Step>

  <Step title="Deploy documentation" icon="rocket" title-type="p">
    Push your changes and deploy to production.

    ```bash
    npm run deploy
    ```
  </Step>
</Steps>
```

--------------------------------

### JSON Configuration Examples

Source: https://documentation.ai/docs/customize/site-configuration

Provides JSON examples for configuring navigation using products, versions, and languages.

```APIDOC
## JSON Configuration Examples

### Description
Examples of how to structure the JSON for navigation configuration using different dimension types.

### Example 1: Products Dimension
```json
{
  "navigation": {
    "products": [
      {
        "product": "API Platform",
        "icon": "code",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [...] 
          }
        ]
      },
      {
        "product": "Dashboard",
        "icon": "layout-dashboard",
        "pages": [...] 
      }
    ]
  }
}
```

### Example 2: Versions Dimension
```json
{
  "navigation": {
    "versions": [
      {
        "version": "v2.0",
        "icon": "badge",
        "tabs": [
          {
            "tab": "API Reference",
            "groups": [...] 
          }
        ]
      },
      {
        "version": "v1.0",
        "icon": "badge",
        "groups": [...] 
      }
    ]
  }
}
```

### Example 3: Languages Dimension
```json
{
  "navigation": {
    "languages": [
      {
        "language": "English",
        "icon": "languages",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [...] 
          }
        ]
      },
      {
        "language": "Español",
        "icon": "languages",
        "tabs": [...] 
      }
    ]
  }
}
```
```

--------------------------------

### Install SDK and CLI with npm

Source: https://documentation.ai/docs/components/tabs

Use these npm commands to install the SDK and CLI. Add the provided scripts to your package.json for development, build, and deployment.

```bash
npm install @documentation-ai/sdk
npm install --save-dev @documentation-ai/cli
```

```json
{
  "scripts": {
    "docs:dev": "doc-ai dev",
    "docs:build": "doc-ai build",
    "docs:deploy": "doc-ai deploy"
  }
}
```

--------------------------------

### Install documentation-ai package

Source: https://documentation.ai/docs/write-and-publish/cursor

Use this command to install the documentation-ai package. Verify installation by running `npm list documentation-ai`.

```bash
npm install documentation-ai
```

--------------------------------

### Start development server

Source: https://documentation.ai/docs/write-and-publish/cursor

Launch the local development server using this command.

```bash
npm run dev
```

--------------------------------

### Install SDK and CLI with pnpm

Source: https://documentation.ai/docs/components/tabs

Use these pnpm commands to install the SDK and CLI. Add the provided scripts to your package.json for development, build, and deployment.

```bash
pnpm add @documentation-ai/sdk
pnpm add -D @documentation-ai/cli
```

```json
{
  "scripts": {
    "docs:dev": "doc-ai dev",
    "docs:build": "doc-ai build",
    "docs:deploy": "doc-ai deploy"
  }
}
```

--------------------------------

### Navigation Examples

Source: https://documentation.ai/docs/customize/site-configuration

Examples demonstrating different navigation architectures for various use cases.

```APIDOC
## Navigation Examples

Comprehensive examples demonstrating different navigation architectures for various use cases.

### Example 1: Simple Documentation (No Dimensions)

Basic documentation site with tabs and groups, no version or product variants.

```json
{
  "name": "Documentation.AI",
  "initialRoute": "getting-started/introduction",
  "colors": {
    "light": { "brand": "#3143e3" },
    "dark": { "brand": "#85a1ff" }
  },
  "navigation": {
    "tabs": [
      {
        "tab": "Documentation",
        "icon": "book",
        "groups": [
          {
            "group": "Getting Started",
            "icon": "rocket",
            "expandable": false,
            "pages": [
              {
                "title": "Introduction",
                "path": "getting-started/introduction",
                "icon": "star"
              },
              {
                "title": "Quickstart",
                "path": "getting-started/quickstart",
                "icon": "zap"
              }
            ]
          }
        ]
      },
      {
        "tab": "API Reference",
        "icon": "code",
        "groups": [
          {
            "group": "Endpoints",
            "openapi": "api-reference/openapi.json",
            "pages": [
              {
                "title": "Authentication",
                "path": "api-reference/auth"
              }
            ]
          }
        ]
      }
    ]
  }
}
```

### Example 2: Version Dimension Only

Documentation with multiple versions but single product.

```json
{
  "name": "API Documentation",
  "navigation": {
    "versions": [
      {
        "version": "v2.0",
        "icon": "badge",
        "tabs": [
          {
            "tab": "Guides",
            "icon": "book",
            "groups": [
              {
                "group": "Getting Started",
                "pages": [
                  {
                    "title": "Introduction",
                    "path": "v2/introduction"
                  }
                ]
              }
            ]
          },
          {
            "tab": "API Reference",
            "icon": "code",
            "groups": [
              {
                "group": "Core API",
                "openapi": "api-reference/v2/openapi.yaml",
                "pages": []
              }
            ]
          }
        ]
      },
      {
        "version": "v1.0",
        "icon": "badge",
        "groups": [
          {
            "group": "Legacy Documentation",
            "pages": [
              {
                "title": "Migration Guide",
                "path": "v1/migration"
              }
            ]
          }
        ]
      }
    ]
  }
}
```
```

--------------------------------

### Generate Python Request Example

Source: https://documentation.ai/docs/ai/ai-documentation-agent

Use this snippet to generate a Python example for a POST request. Ensure the 'requests' library is installed.

```python
import requests
res = requests.post("/v1/payments")
```

--------------------------------

### Install SDK and CLI with Yarn

Source: https://documentation.ai/docs/components/tabs

Use these Yarn commands to install the SDK and CLI. Add the provided scripts to your package.json for development, build, and deployment.

```bash
yarn add @documentation-ai/sdk
yarn add --dev @documentation-ai/cli
```

```json
{
  "scripts": {
    "docs:dev": "doc-ai dev",
    "docs:build": "doc-ai build",
    "docs:deploy": "doc-ai deploy"
  }
}
```

--------------------------------

### Install documentation-ai CLI on macOS

Source: https://documentation.ai/docs/write-and-publish/cursor

Use Homebrew to install the documentation-ai package and npm to install the CLI globally on macOS.

```bash
brew install documentation-ai
npm install -g doc-ai-cli
```

--------------------------------

### Combine OpenAPI and Manual Pages

Source: https://documentation.ai/docs/api-documentation-and-playground/organize-api-reference

Integrate generated API documentation (from OpenAPI specifications) with custom explanatory content like 'Getting Started' or 'SDK Documentation'. This allows for a comprehensive API reference that includes both technical details and user guides.

```json
{
  "group": "API Documentation",
  "pages": [
    {
      "title": "Getting Started",
      "path": "api/getting-started"
    },
    {
      "title": "Authentication Guide",
      "path": "api/authentication"
    },
    {
      "group": "Core Endpoints",
      "openapi": "api/core.yaml"
    },
    {
      "title": "SDK Documentation",
      "path": "api/sdks"
    },
    {
      "group": "Advanced Features",
      "openapi": "api/advanced.yaml",
      "pages": [
        {
          "title": "Usage Examples",
          "path": "api/examples"
        }
      ]
    }
  ]
}
```

--------------------------------

### API Endpoint Request Examples

Source: https://documentation.ai/docs/write-and-publish/claude-code

Demonstrates how to make a GET request to an API endpoint in JavaScript, Python, and Bash. Ensure you replace YOUR_API_KEY with your actual key.

```javascript
const response = await fetch('/api/endpoint', {
    headers: { Authorization: `Bearer ${apiKey}` }
  });
  const data = await response.json();
```

```python
import requests
response = requests.get('/api/endpoint', 
  headers={'Authorization': f'Bearer {api_key}'})
data = response.json()
```

```bash
curl -X GET '/api/endpoint' \
  -H 'Authorization: Bearer YOUR_API_KEY'
```

--------------------------------

### Generated Go Request Example

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Example of a generated Go GET request using net/http with authentication and content type headers.

```go
package main

import (
    "fmt"
    "net/http"
    "io/ioutil"
)

func main() {
    req, _ := http.NewRequest("GET", "/api/users/123", nil)
    req.Header.Add("Authorization", "Bearer YOUR_TOKEN")
    req.Header.Add("Content-Type", "application/json")
    
    client := &http.Client{}
    resp, _ := client.Do(req)
    defer resp.Body.Close()
    
    body, _ := ioutil.ReadAll(resp.Body)
    fmt.Println(string(body))
}

```

--------------------------------

### Code Examples Requirements

Source: https://documentation.ai/docs/write-and-publish/claude-code

Outlines the standards for writing high-quality, runnable code examples.

```APIDOC
## Content quality standards

### Code examples requirements

- Always include complete, runnable examples that users can copy and execute

- Show proper error handling and edge case management

- Use realistic data instead of placeholder values

- Include expected outputs and results for verification

- Test all code examples thoroughly before publishing

- Specify language and include filename when relevant

- Add explanatory comments for complex logic

- Never include real API keys or secrets in code examples
```

--------------------------------

### Display API Request Examples

Source: https://documentation.ai/docs/components/api-components

Use the `Request` component to show API request examples. It supports multiple language tabs, such as JavaScript and Python. Ensure the `Authorization` header is correctly set.

```javascript
const response = await fetch('/api/docs', {
  method: 'POST',
  headers: { 'Authorization': 'Bearer TOKEN' },
  body: JSON.stringify({ title: 'Getting Started' })
});
```

```python
import requests
response = requests.post('/api/docs',
  headers={'Authorization': 'Bearer TOKEN'},
  json={'title': 'Getting Started'}
)
```

--------------------------------

### Install Documentation AI CLI

Source: https://documentation.ai/docs/write-and-publish/claude-code

Commands to install the documentation-ai package and CLI tool on macOS, Windows, and Linux.

```bash
npm install documentation-ai
```

```json
{
    "name": "Your Documentation",
    "initialRoute": "getting-started/introduction"
  }
```

```bash
npm run dev
```

```bash
brew install documentation-ai
npm install -g doc-ai-cli
```

```powershell
winget install documentation-ai
npm install -g doc-ai-cli
```

```bash
sudo apt install documentation-ai
npm install -g doc-ai-cli
```

--------------------------------

### Basic Project Structure

Source: https://documentation.ai/docs/write-and-publish/code-editor

A typical project structure for Documentation.AI, including the site configuration file and example content directories.

```bash
docs/
├── documentation.json       # Site configuration and navigation
├── getting-started/
│   ├── introduction.mdx
│   └── quickstart.mdx
├── api/
│   ├── authentication.mdx
│   └── openapi.yaml         # Optional OpenAPI for API docs
└── guides/
    └── integrations.mdx
```

--------------------------------

### Implement API Key Authentication

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Examples for sending requests with an API key header.

```javascript
const response = await fetch('/api/users', {
  headers: {
    'X-API-Key': 'YOUR_API_KEY'
  }
});
```

```python
response = requests.get(
    '/api/users',
    headers={'X-API-Key': 'YOUR_API_KEY'}
)
```

```bash
curl -H 'X-API-Key: YOUR_API_KEY' '/api/users'
```

--------------------------------

### Expandable Component Configuration

Source: https://documentation.ai/docs/components/expandables

Examples showing how to configure the title and initial open state of an Expandable component.

```jsx
<Expandable title="Click to expand" default-open="false">
  Add your content here...
</Expandable>
```

```jsx
<Expandable title="Getting started guide" default-open="true">
  This section starts open by default and is useful for key onboarding content.
</Expandable>
```

--------------------------------

### Create Code Groups

Source: https://documentation.ai/docs/write-and-publish/prompts

Group multiple language examples into a single tabbed interface.

```jsx
<CodeGroup show-lines="true" tabs="JavaScript,Python,Bash">
  ```javascript
  const response = await fetch('/api/endpoint', {
    headers: { Authorization: `Bearer ${apiKey}` }
  });
  const data = await response.json();
  ```

  ```python
  import requests
  response = requests.get('/api/endpoint', 
    headers={'Authorization': f'Bearer {api_key}'})
  data = response.json()
  ```

  ```bash
  curl -X GET '/api/endpoint' \
    -H 'Authorization: Bearer YOUR_API_KEY'
  ```
</CodeGroup>
```

--------------------------------

### Multi-Service APIs Example

Source: https://documentation.ai/docs/api-documentation-and-playground/openapi-import

Document microservices with separate OpenAPI specifications organized into tabs.

```APIDOC
## Multi-Service APIs

Document microservices with separate OpenAPI specifications:

```json
{
  "navigation": {
    "tabs": [
      {
        "tab": "User Service",
        "groups": [
          {
            "group": "Users API",
            "openapi": "api-reference/users-service.yaml"
          }
        ]
      },
      {
        "tab": "Payment Service",
        "groups": [
          {
            "group": "Payments API", 
            "openapi": "api-reference/payments-service.yaml"
          }
        ]
      }
    ]
  }
}
```
```

--------------------------------

### Create Internal Links

Source: https://documentation.ai/docs/components/heading-and-text

Use absolute paths starting from the documentation root for internal navigation.

```markdown
[Quickstart](/getting-started/quickstart)
[Lists and Tables](/components/lists-and-tables)
[Code and Groups](/components/code-blocks-and-groups)
```

--------------------------------

### Example Request Fetch Call

Source: https://documentation.ai/docs/api-documentation-and-playground/interactive-playground-setup

Demonstrates the structure of a request that the playground generates forms for.

```javascript
// For an endpoint: GET /users/{id}?include=profile
const response = await fetch('/api/users/123?include=profile', {
  headers: { 'Authorization': 'Bearer TOKEN' }
});
```

--------------------------------

### Configure Multi-Dimension Navigation

Source: https://documentation.ai/docs/customize/site-configuration

Examples of nesting dimensions like products, versions, and languages to define navigation structures.

```json
{
  "navigation": {
    "products": [
      {
        "product": "API Platform",
        "icon": "code",
        "versions": [
          {
            "version": "v2.0",
            "icon": "badge",
            "tabs": [
              {
                "tab": "Documentation",
                "groups": [
                  {
                    "group": "Getting Started",
                    "pages": [
                      {
                        "title": "Introduction",
                        "path": "api-v2/introduction"
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "version": "v1.0",
            "icon": "badge",
            "tabs": [...]
          }
        ]
      },
      {
        "product": "Dashboard",
        "icon": "layout-dashboard",
        "versions": [
          {
            "version": "v2.0",
            "icon": "badge",
            "tabs": [...]
          }
        ]
      }
    ]
  }
}
```

```json
{
  "navigation": {
    "versions": [
      {
        "version": "v2.0",
        "icon": "badge",
        "products": [
          {
            "product": "API Platform",
            "icon": "code",
            "tabs": [
              {
                "tab": "Documentation",
                "groups": [
                  {
                    "group": "Getting Started",
                    "pages": [
                      {
                        "title": "Introduction",
                        "path": "v2/api/introduction"
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "product": "Dashboard",
            "icon": "layout-dashboard",
            "tabs": [...]
          }
        ]
      },
      {
        "version": "v1.0",
        "icon": "badge",
        "products": [...]
      }
    ]
  }
}
```

```json
{
  "navigation": {
    "products": [
      {
        "product": "API Platform",
        "icon": "code",
        "versions": [
          {
            "version": "v2.0",
            "icon": "badge",
            "languages": [
              {
                "language": "English",
                "icon": "languages",
                "tabs": [
                  {
                    "tab": "Documentation",
                    "groups": [
                      {
                        "group": "Getting Started",
                        "pages": [
                          {
                            "title": "Introduction",
                            "path": "api-v2/en/introduction"
                          }
                        ]
                      }
                    ]
                  }
                ]
              },
              {
                "language": "Español",
                "icon": "languages",
                "tabs": [
                  {
                    "tab": "Documentación",
                    "groups": [...]
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  }
}
```

```json
{
  "navigation": {
    "versions": [
      {
        "version": "v2.0",
        "icon": "badge",
        "languages": [
          {
            "language": "English",
            "icon": "languages",
            "tabs": [
              {
                "tab": "Documentation",
                "groups": [
                  {
                    "group": "Getting Started",
                    "pages": [
                      {
                        "title": "Introduction",
                        "path": "v2/en/introduction"
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            "language": "Español",
            "icon": "languages",
            "tabs": [
              {
                "tab": "Documentación",
                "groups": [...]
              }
            ]
          }
        ]
      },
      {
        "version": "v1.0",
        "icon": "badge",
        "languages": [...]
      }
    ]
  }
}
```

--------------------------------

### API Versioning Example

Source: https://documentation.ai/docs/api-documentation-and-playground/openapi-import

Organize versioned APIs using separate OpenAPI files within a navigation structure.

```APIDOC
## API Versioning

Organize versioned APIs using separate OpenAPI files:

```json
{
  "navigation": {
    "versions": [
      {
        "version": "v2.0",
        "groups": [
          {
            "group": "API Reference",
            "openapi": "api-reference/v2/openapi.yaml"
          }
        ]
      },
      {
        "version": "v1.0", 
        "groups": [
          {
            "group": "Legacy API",
            "openapi": "api-reference/v1/openapi.json"
          }
        ]
      }
    ]
  }
}
```
```

--------------------------------

### POST /api/docs

Source: https://documentation.ai/docs/components/api-components

Example endpoint demonstrating the use of Request and Response components for API documentation.

```APIDOC
## POST /api/docs

### Description
Creates a new documentation entry.

### Method
POST

### Endpoint
/api/docs

### Request Body
- **title** (string) - Required - The title of the documentation entry.

### Request Example
{
  "title": "Getting Started"
}

### Response
#### Success Response (200)
- **id** (string) - The unique identifier of the created document.
- **status** (string) - The status of the operation.

#### Response Example
{
  "id": "doc-123",
  "status": "success"
}
```

--------------------------------

### Generated cURL Request Example

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Example of a generated cURL GET request with authentication and content type headers.

```bash
curl -X GET '/api/users/123' \
    -H 'Authorization: Bearer YOUR_TOKEN' \
    -H 'Content-Type: application/json'

```

--------------------------------

### Generated JavaScript Request Example

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Example of a generated JavaScript GET request using fetch with authentication and JSON parsing.

```javascript
const response = await fetch('/api/users/123', {
    method: 'GET',
    headers: {
      'Authorization': 'Bearer YOUR_TOKEN',
      'Content-Type': 'application/json'
    }
  });

  const user = await response.json();
  console.log(user);

```

--------------------------------

### Generated Python Request Example

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Example of a generated Python GET request using the requests library with authentication and JSON parsing.

```python
import requests

response = requests.get(
    '/api/users/123',
    headers={
        'Authorization': 'Bearer YOUR_TOKEN',
        'Content-Type': 'application/json'
    }
)

user = response.json()
print(user)

```

--------------------------------

### Configure Clearbit via documentation.json

Source: https://documentation.ai/docs/integrations/clearbit

Add the `clearbit` key under `integrations` in your `documentation.json` file to enable the integration. Ensure you replace "your_clearbit_key" with your actual API key.

```json
{
  "integrations": {
    "clearbit": {
      "apiKey": "your_clearbit_key"
    }
  }
}
```

--------------------------------

### JavaScript GET Request with Query Parameters

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Example of a JavaScript GET request including query parameters, error handling, and JSON parsing. Uses modern ES6+ syntax with async/await.

```javascript
// GET request with query parameters
const response = await fetch('/api/users?page=1&limit=20', {
  method: 'GET',
  headers: {
    'Authorization': 'Bearer YOUR_TOKEN'
  }
});

if (!response.ok) {
  throw new Error(`HTTP error! status: ${response.status}`);
}

const users = await response.json();

```

--------------------------------

### API Request Code Generation

Source: https://documentation.ai/docs/api-documentation-and-playground/interactive-playground-setup

Examples of how to perform a GET request to the API using various programming languages and tools.

```javascript
const response = await fetch('https://api.example.com/v2/users/123', {
    method: 'GET',
    headers: {
      'Authorization': 'Bearer YOUR_TOKEN',
      'Content-Type': 'application/json'
    }
  });

  const data = await response.json();
  console.log(data);
```

```python
import requests

  response = requests.get(
      'https://api.example.com/v2/users/123',
      headers={
          'Authorization': 'Bearer YOUR_TOKEN',
          'Content-Type': 'application/json'
      }
  )

  data = response.json()
  print(data)
```

```bash
curl -X GET 'https://api.example.com/v2/users/123' \
    -H 'Authorization: Bearer YOUR_TOKEN' \
    -H 'Content-Type: application/json'
```

```go
package main

  import (
      "fmt"
      "net/http"
      "io/ioutil"
  )

  func main() {
      req, _ := http.NewRequest("GET", "https://api.example.com/v2/users/123", nil)
      req.Header.Add("Authorization", "Bearer YOUR_TOKEN")
      req.Header.Add("Content-Type", "application/json")
      
      client := &http.Client{}
      resp, _ := client.Do(req)
      defer resp.Body.Close()
      
      body, _ := ioutil.ReadAll(resp.Body)
      fmt.Println(string(body))
  }
```

--------------------------------

### Generated MDX Frontmatter for Endpoint

Source: https://documentation.ai/docs/api-documentation-and-playground/openapi-import

Example of the frontmatter generated for an endpoint like GET /users/{id}, including title, method, and path.

```mdx
---
title: Get User by ID
method: GET
path: /users/{id}
---

```

--------------------------------

### Example Documentation.AI Technical Writing Rule

Source: https://documentation.ai/docs/write-and-publish/cursor

This markdown rule provides AI with context for formatting Documentation.AI components and following technical writing best practices. Customize language, component examples, and tone preferences to match your project's style guide.

```markdown
# Documentation.AI technical writing rule

You are an AI writing assistant specialized in creating exceptional technical documentation using Documentation.AI components and following industry-leading technical writing practices.

## Core writing principles

### Language and style requirements

- Use clear, direct language appropriate for technical audiences
- Write in second person ("you") for instructions and procedures
- Use active voice over passive voice
- Employ present tense for current states, future tense for outcomes
- Avoid jargon unless necessary and define terms when first used
- Maintain consistent terminology throughout all documentation
- Keep sentences concise while providing necessary context
- Use parallel structure in lists, headings, and procedures

### Content organization standards

- Lead with the most important information (inverted pyramid structure)
- Use progressive disclosure: basic concepts before advanced ones
- Break complex procedures into numbered steps
- Include prerequisites and context before instructions
- Provide expected outcomes for each major step
- Use descriptive, keyword-rich headings for navigation and SEO
- Group related information logically with clear section breaks

### User-centered approach

- Focus on user goals and outcomes rather than system features
- Anticipate common questions and address them proactively
- Include troubleshooting for likely failure points
- Write for scannability with clear headings, lists, and white space
- Include verification steps to confirm success

## Documentation.AI component reference

### Important syntax notes

**Attribute naming:**
- All Documentation.AI components use **kebab-case** for multi-word attributes: `param-type`, `title-type`, `default-open`, `show-lines`
- Boolean attributes can be strings: `required="true"`, `collapsed="false"`, or JSX expressions: `horizontal={true}`
- String attributes use quotes: `kind="info"`, `cols="2"`, `tabs="JavaScript,Python"`

**Layout patterns:**
- Columns with Cards: Wrap Cards directly in `<Columns cols="2">`
- Columns with plain content: Wrap content in `<div>` inside `<Columns cols="2">`
- Cards always need `title` and `href` attributes
- Card layouts: `horizontal={false}` (default, stacked) or `horizontal={true}` (side-by-side)

**Icons:**
- Lucide icons: Use icon names without suffix, e.g., `icon="zap"`, `icon="book-open"`
- See [Lucide icons](https://lucide.dev/icons/) for complete list

**Optional attributes:**
- `title-type` on Steps: Defaults to `p`, use `h2` or `h3` for semantic heading structure
- `default-open` on Expandable: Defaults to `false`
- `collapsed` on Callout: Defaults to `false`
- `show-lines` on code blocks: Defaults to `false`

### Headings and text

Documentation.AI pages support standard markdown for headings, paragraphs, and inline formatting:

#### Heading hierarchy

- H1 is automatically generated from the frontmatter `title` field
- Start page content with H2 (`##`) and maintain proper hierarchy
- Use H2 for main sections, H3 for subsections, H4 for detailed subsections
- Keep headings descriptive and keyword-rich for navigation and SEO

```markdown
## Main section heading

### Subsection heading

#### Detailed subsection
```
```

--------------------------------

### Minimal documentation.json Configuration

Source: https://documentation.ai/docs/write-and-publish/code-editor

A minimal example of a `documentation.json` file to define sidebar navigation groups and pages. Ensure `path` values match your file structure.

```json
{
  "tabs": [
    {
      "tab": "Documentation",
      "groups": [
        {
          "group": "Getting Started",
          "pages": [
            { "title": "Introduction", "path": "getting-started/introduction" },
            { "title": "Quickstart", "path": "getting-started/quickstart" }
          ]
        }
      ]
    }
  ]
}
```

--------------------------------

### Navbar Configuration Example

Source: https://documentation.ai/docs/customize/site-configuration

Configure the top navigation bar with primary actions and secondary links. Use this to define main calls-to-action and supplementary navigation options.

```json
{
  "navbar": {
    "actions": {
      "primary": {
        "title": "Get Started",
        "link": "https://dashboard.example.com/signup"
      },
      "links": [
        {
          "title": "Login",
          "link": "https://dashboard.example.com/login"
        },
        {
          "title": "Support",
          "link": "mailto:support@example.com"
        }
      ]
    }
  }
}
```

--------------------------------

### Tabs Component with Icons and Platform-Specific Content

Source: https://documentation.ai/docs/components/tabs

This example shows how to use the Tabs component with icons and platform-specific installation instructions in MDX. Each tab includes a code block for bash commands.

```jsx
<Tabs>
  <Tab title="macOS" icon="apple">
    Install using Homebrew for the best experience on macOS.
    
    ```bash
    brew install documentation-ai
    ```
  </Tab>
  <Tab title="Windows" icon="monitor">
    Download and run the Windows installer from the releases page. 
    
    ```bash
    winget install documentation-ai
    ```
  </Tab>
  <Tab title="Linux" icon="terminal">
    Use your package manager or download the binary directly.
    
    ```bash
    sudo apt install documentation-ai
    ```
  </Tab>
</Tabs>
```

--------------------------------

### OpenAPI Specification Example

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

An example of an OpenAPI specification that can be used to automatically generate code examples for API endpoints.

```yaml
# Your OpenAPI specification automatically generates code
paths:
  /users/{id}:
    get:
      summary: Get user by ID
      parameters:
        - name: id
          in: path
          required: true
          schema:
            type: string
      responses:
        '200':
          description: User details
          content:
            application/json:
              schema:
                $ref: '#/components/schemas/User'

```

--------------------------------

### Documentation.AI Components and Settings Prompt

Source: https://documentation.ai/docs/write-and-publish/prompts

Use this prompt to guide an AI assistant in utilizing Documentation.AI components and MDX syntax.

```markdown
# Documentation.AI Components and Settings Prompt

You are an AI assistant specialized in creating technical documentation using Documentation.AI components and MDX syntax.
```

--------------------------------

### Basic Site Settings

Source: https://documentation.ai/docs/customize/site-configuration

Configure the site name and the initial route for your documentation. The site name appears in the browser title and navigation header. The initial route specifies the default page path.

```json
{
  "name": "Documentation.AI",
  "initialRoute": "getting-started/introduction"
}
```

--------------------------------

### Configure Paperguide Project Settings

Source: https://documentation.ai/docs/customize/site-configuration

Defines the full project configuration including branding, navigation structure, and OpenAPI integration.

```json
{
  "name": "Paperguide Documentation",
  "initialRoute": "introduction",
  "logo-dark": "https://example.com/logo-dark.svg",
  "logo-light": "https://example.com/logo-light.svg",
  "logo-small-dark": "https://example.com/favicon-dark.svg",
  "logo-small-light": "https://example.com/favicon-light.svg",
  "colors": {
    "light": {
      "brand": "#3B82F6",
      "heading": "#1a1a1a",
      "text": "#374151"
    },
    "dark": {
      "brand": "#60A5FA",
      "heading": "#f2f2f2",
      "text": "#c1c1c1"
    }
  },
  "navbar": {
    "actions": {
      "primary": {
        "title": "Get Started",
        "link": "https://dashboard.paperguide.com/signup"
      },
      "links": [
        {
          "title": "Login",
          "link": "https://dashboard.paperguide.com/login"
        }
      ]
    }
  },
  "navigation": {
    "products": [
      {
        "product": "Paperguide",
        "versions": [
          {
            "version": "v1",
            "languages": [
              {
                "language": "English",
                "tabs": [
                  {
                    "tab": "Getting Started",
                    "icon": "rocket",
                    "pages": [
                      {
                        "title": "Introduction",
                        "path": "introduction",
                        "icon": "home"
                      }
                    ]
                  },
                  {
                    "tab": "Documentation",
                    "icon": "book",
                    "dropdowns": [
                      {
                        "dropdown": "Core Features",
                        "icon": "lightbulb",
                        "dropdowns": [
                          {
                            "dropdown": "Content Management",
                            "pages": [
                              {
                                "title": "Spaces",
                                "path": "spaces",
                                "icon": "folder"
                              },
                              {
                                "title": "Pages",
                                "path": "pages",
                                "icon": "file-text"
                              }
                            ]
                          }
                        ]
                      },
                      {
                        "dropdown": "Advanced Features",
                        "icon": "zap",
                        "pages": [
                          {
                            "title": "Webhooks",
                            "path": "webhooks",
                            "icon": "link"
                          }
                        ]
                      }
                    ]
                  },
                    {
                    "tab": "API Reference",
                    "icon": "code",
                    "groups": [
                      {
                        "group": "REST API",
                        "openapi": "api-reference/openapi.yaml",
                        "pages": [
                          {
                            "title": "Authentication",
                            "path": "api-reference/authentication"
                          }
                        ]
                      }
                    ]
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  },
  "seo": {
    "robots:index": true,
    "robots:follow": true
  }
}
```

--------------------------------

### Configure Product Navigation

Source: https://documentation.ai/docs/customize/site-configuration

Use this JSON structure to organize documentation by product. Each product can have associated tabs and groups.

```json
{
  "navigation": {
    "products": [
      {
        "product": "API Platform",
        "icon": "code",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [...] 
          }
        ]
      },
      {
        "product": "Dashboard",
        "icon": "layout-dashboard",
        "pages": [...] 
      }
    ]
  }
}
```

--------------------------------

### Configure Clarity via documentation.json

Source: https://documentation.ai/docs/integrations/clarity

Add the 'clarity' key under 'integrations' in your documentation.json file to enable the integration. Replace 'your_project_id' with your actual Clarity Project ID.

```json
{
  "integrations": {
    "clarity": {
      "projectId": "your_project_id"
    }
  }
}
```

--------------------------------

### Configure documentation.json

Source: https://documentation.ai/docs/write-and-publish/cursor

Create a `documentation.json` file with your site configuration. Never commit API keys or secrets to version control.

```json
{
  "name": "Your Documentation",
  "initialRoute": "getting-started/introduction"
}
```

--------------------------------

### Generate Go API Client

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Demonstrates creating a user via POST request with JSON marshaling, error handling, and resource cleanup.

```go
package main

import (
    "bytes"
    "encoding/json"
    "fmt"
    "net/http"
)

type User struct {
    ID    string `json:"id"`
    Name  string `json:"name"`
    Email string `json:"email"`
}

func createUser() (*User, error) {
    user := User{
        Name:  "John Doe",
        Email: "john@example.com",
    }
    
    jsonData, err := json.Marshal(user)
    if err != nil {
        return nil, err
    }
    
    req, err := http.NewRequest("POST", "/api/users", bytes.NewBuffer(jsonData))
    if err != nil {
        return nil, err
    }
    
    req.Header.Set("Authorization", "Bearer YOUR_TOKEN")
    req.Header.Set("Content-Type", "application/json")
    
    client := &http.Client{}
    resp, err := client.Do(req)
    if err != nil {
        return nil, err
    }
    defer resp.Body.Close()
    
    var createdUser User
    if err := json.NewDecoder(resp.Body).Decode(&createdUser); err != nil {
        return nil, err
    }
    
    return &createdUser, nil
}
```

--------------------------------

### API POST Request Example

Source: https://documentation.ai/docs/write-and-publish/claude-code

Shows how to send a POST request to an API endpoint for creating documentation. Includes request body and headers in JavaScript and Python.

```javascript
const response = await fetch('https://api.documentation.ai/docs', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      'Authorization': 'Bearer TOKEN'
    },
    body: JSON.stringify({
      title: "Getting Started",
      content: "Welcome to our API"
    })
  });
```

```python
import requests
response = requests.post(
  'https://api.documentation.ai/docs',
  headers={'Authorization': 'Bearer TOKEN'},
  json={'title': 'Getting Started', 'content': 'Welcome to our API'}
)
```

--------------------------------

### Example Callout in JSX

Source: https://documentation.ai/docs/write-and-publish/web-editor

Use callouts to emphasize best practices or caveats that readers should not miss. This example shows a 'tip' callout in JSX format.

```jsx
<Callout kind="tip">
  Use callouts to emphasize best practices or caveats that readers should not miss.
</Callout>
```

--------------------------------

### Define Simple Navigation Structure

Source: https://documentation.ai/docs/customize/site-configuration

Create a basic documentation site layout using tabs and groups without versioning.

```json
{
  "name": "Documentation.AI",
  "initialRoute": "getting-started/introduction",
  "colors": {
    "light": { "brand": "#3143e3" },
    "dark": { "brand": "#85a1ff" }
  },
  "navigation": {
    "tabs": [
      {
        "tab": "Documentation",
        "icon": "book",
        "groups": [
          {
            "group": "Getting Started",
            "icon": "rocket",
            "expandable": false,
            "pages": [
              {
                "title": "Introduction",
                "path": "getting-started/introduction",
                "icon": "star"
              },
              {
                "title": "Quickstart",
                "path": "getting-started/quickstart",
                "icon": "zap"
              }
            ]
          }
        ]
      },
      {
        "tab": "API Reference",
        "icon": "code",
        "groups": [
          {
            "group": "Endpoints",
            "openapi": "api-reference/openapi.json",
            "pages": [
              {
                "title": "Authentication",
                "path": "api-reference/auth"
              }
            ]
          }
        ]
      }
    ]
  }
}
```

--------------------------------

### Complete Branding Setup Configuration

Source: https://documentation.ai/docs/customize/branding

A comprehensive JSON configuration for branding, including site name, light and dark logos (main and small/favicon), and color schemes for both themes.

```json
{
  "name": "Documentation.AI",
  "logo-dark": "https://cdn.example.com/logo-dark.svg",
  "logo-light": "https://cdn.example.com/logo-light.svg", 
  "logo-small-dark": "https://cdn.example.com/favicon-dark.png",
  "logo-small-light": "https://cdn.example.com/favicon-light.png",
  "colors": {
    "light": {
      "brand": "#3143e3",
      "heading": "#1a1a1a",
      "text": "#374151"
    },
    "dark": {
      "brand": "#85a1ff", 
      "heading": "#f2f2f2",
      "text": "#c1c1c1"
    }
  }
}
```

--------------------------------

### Display API Response Examples

Source: https://documentation.ai/docs/components/api-components

Use the `Response` component to display API response examples, typically beneath `Request` content. It supports tabs for different status codes like `200` and `500`.

```json
{
  "id": "doc-123",
  "status": "success"
}
```

```json
{
  "error": "Internal server error",
  "code": "INTERNAL_ERROR"
}
```

--------------------------------

### Configure Heap via documentation.json

Source: https://documentation.ai/docs/integrations/heap

Add the 'heap' key under 'integrations' in your documentation.json file to enable Heap analytics. Ensure you replace 'your_app_id' with your actual Heap app ID.

```json
{
  "integrations": {
    "heap": {
      "appId": "your_app_id"
    }
  }
}
```

--------------------------------

### GET api/projects/list

Source: https://documentation.ai/docs/api-documentation-and-playground/organize-api-reference

Lists all available projects.

```APIDOC
## GET api/projects/list

### Description
Returns a list of all projects.

### Method
GET

### Endpoint
api/projects/list
```

--------------------------------

### Configure Crisp via documentation.json

Source: https://documentation.ai/docs/integrations/crisp

Add the crisp integration settings to your project configuration file.

```json
{
  "integrations": {
    "crisp": {
      "websiteId": "your_website_id"
    }
  }
}
```

--------------------------------

### GET api/users/get

Source: https://documentation.ai/docs/api-documentation-and-playground/organize-api-reference

Retrieves user information.

```APIDOC
## GET api/users/get

### Description
Retrieves details for a specific user.

### Method
GET

### Endpoint
api/users/get
```

--------------------------------

### GET /api/users/{id}

Source: https://documentation.ai/docs/api-documentation-and-playground/openapi-import

Retrieve detailed information for a specific user.

```APIDOC
## GET /api/users/{id}

### Description
Retrieve detailed information for a specific user.

### Method
GET

### Endpoint
/api/users/{id}

#### Path Parameters
- **id** (string) - Required - Unique identifier for the user.

### Request Example
```javascript
const response = await fetch('/api/users/123', {
  headers: { 'Authorization': 'Bearer TOKEN' }
});
```

### Response
#### Success Response (200)
- **id** (string) - Unique identifier for the user.
- **name** (string) - Full name of the user.
- **email** (string) - Email address of the user.

#### Response Example
```json
{
  "id": "123",
  "name": "John Doe", 
  "email": "john@example.com"
}
```
```

--------------------------------

### Callout Component Usage

Source: https://documentation.ai/docs/write-and-publish/claude-code

Examples of different callout types for contextual information.

```jsx
<Callout kind="info">
  Supplementary information that supports the main content without interrupting flow
</Callout>

<Callout kind="tip">
  Expert advice, shortcuts, or best practices that enhance user success
</Callout>

<Callout kind="alert">
  Critical information about potential issues, breaking changes, or actions requiring attention
</Callout>

<Callout kind="danger">
  Warnings about destructive actions, data loss, or irreversible operations
</Callout>

<Callout kind="success">
  Positive confirmations, successful completions, or achievement indicators
</Callout>
```

--------------------------------

### Configure Mixpanel via documentation.json

Source: https://documentation.ai/docs/integrations/mixpanel

Add the `mixpanel` key under `integrations` in your `documentation.json` file to enable the integration. Ensure you replace `your_project_token` with your actual Mixpanel project token.

```json
{
  "integrations": {
    "mixpanel": {
      "projectToken": "your_project_token"
    }
  }
}
```

--------------------------------

### Markdown Inline Formatting

Source: https://documentation.ai/docs/write-and-publish/claude-code

Examples of bold, italic, inline code, and link syntax.

```markdown
Use **bold** for emphasis and `inline code` for technical terms.

Create [descriptive links](https://documentation.ai) instead of "click here".

Use *italic* sparingly for subtle emphasis.

Combine formatting: **bold with `code`** when needed.
```

--------------------------------

### Implement OAuth 2.0 Client Credentials Flow

Source: https://documentation.ai/docs/api-documentation-and-playground/code-generation

Examples for obtaining and using an access token via the OAuth 2.0 client credentials flow.

```javascript
// OAuth 2.0 client credentials flow
async function getAccessToken() {
  const response = await fetch('/oauth/token', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded',
      'Authorization': 'Basic ' + btoa('CLIENT_ID:CLIENT_SECRET')
    },
    body: 'grant_type=client_credentials&scope=read write'
  });
  
  const tokenData = await response.json();
  return tokenData.access_token;
}

// Use token for API requests
const token = await getAccessToken();
const response = await fetch('/api/users', {
  headers: {
    'Authorization': `Bearer ${token}`
  }
});
```

```python
import requests
import base64

def get_access_token():
    credentials = base64.b64encode(f"CLIENT_ID:CLIENT_SECRET".encode()).decode()
    
    response = requests.post(
        '/oauth/token',
        headers={
            'Content-Type': 'application/x-www-form-urlencoded',
            'Authorization': f'Basic {credentials}'
        },
        data='grant_type=client_credentials&scope=read write'
    )
    
    token_data = response.json()
    return token_data['access_token']

# Use token for API requests  
token = get_access_token()
response = requests.get(
    '/api/users',
    headers={'Authorization': f'Bearer {token}'}
)
```