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

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

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

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

---
overview: true
title: Обзор API
---

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

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

#Пример

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

---
overview: true
title: Обзор API
---

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

[
  { "type": "file", "name": "index", "label": "API Overview" },
  { "type": "dir", "name": "config", "label": "Config" },
  { "type": "dir", "name": "runtime", "label": "Runtime" }
]

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

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

#overviewHeaders

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

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

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

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

---
overviewHeaders: [2, 3]
---

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

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

#Настройка

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

#Подход 1: настройка стилей через кастомную тему

Используйте кастомную тему для изменения стилей компонента OverviewGroup, продолжая использовать встроенную функциональность страницы обзора:

---
overview: true
---

#Подход 2: полностью кастомное содержимое страницы

Используйте компонент OverviewGroup с pageType: doc-wide для настройки макета страницы и определения содержимого самостоятельно:

---
pageType: doc-wide
---

# Моя кастомная страница обзора

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 },
        ],
      },
    ],
  }}
/>