close

Страница обзора

Страница обзора отображает обзор всех статей в директории, автоматически извлекая информацию из боковой панели для создания сгруппированного контента.

Использование

Чтобы включить такую страницу, добавьте overview: true в файл index.md нужной директории:

api/index.md
---
overview: true
title: Обзор API
---

Это обзорная страница API.

Страница обзора автоматически считывает конфигурацию боковой панели текущей директории (конфигурация боковой панели) и извлекает заголовки статей для генерации сгруппированных карточек.

Пример

При следующей структуре директорий и конфигурации _meta.json:

docs
└── api
    ├── _meta.json
    ├── index.md        <-- overview: true
    ├── config
    │   ├── _meta.json
    │   ├── basic.mdx
    │   └── theme.mdx
    └── runtime
        ├── _meta.json
        ├── hooks.mdx
        └── context.mdx
api/index.md
---
overview: true
title: Обзор API
---

Это обзорная страница API.
api/_meta.json
[
  { "type": "file", "name": "index", "label": "API Overview" },
  { "type": "dir", "name": "config", "label": "Config" },
  { "type": "dir", "name": "runtime", "label": "Runtime" }
]

Сгенерированная страница обзора выглядит следующим образом:

Страница обзора

Это обзорная страница API.

Config

Runtime

Конфигурация

overviewHeaders

Управляет уровнями заголовков, которые отображаются на странице обзора. По умолчанию — [2] (только заголовки h2).

Можно настроить в файле _meta.json:

_meta.json
[
  {
    "type": "file",
    "name": "component",
    "overviewHeaders": [2, 3]
  }
]

Или в блоке метаданных самой статьи:

component.mdx
---
overviewHeaders: [2, 3]
---

Вложенные страницы обзора

Подкаталоги также могут иметь собственные страницы обзора — для этого достаточно настроить overview: true в файле index.md соответствующей поддиректории:

docs
└── api
    ├── index.md         <-- overview: true
    └── theme
        ├── index.md     <-- overview: true (вложенная страница обзора)
        ├── component.mdx
        └── utils.mdx

Настройка

Если вам нужно полностью настроить содержимое страницы обзора, вы можете вручную собрать её с помощью компонента OverviewGroup:

index.mdx
---
overview: true
---

import { OverviewGroup } from '@rspress/core/theme';

<OverviewGroup
  group={{
    name: 'Пользовательская группа',
    items: [
      {
        text: 'Заголовок страницы',
        link: '/path/to/page',
        headers: [
          { id: 'section-1', text: 'Секция 1', depth: 2 },
          { id: 'section-2', text: 'Секция 2', depth: 2 },
        ],
      },
    ],
  }}
/>