СправочникКомпонентыВечнозелёнаяобновлено 2026.082 мин чтения
ОбзорЧасть II · Вики и навигация
Часть II · Вики и навигация

Вики и навигация

Всё в этой главе работает на этом сайте вживую: полки главной собраны из NoteCard, её ряды рубрик — это FacetNav, полоса мета над этим текстом — TaxonomyLine, а маленькое созвездие в сайдбаре — LocalGraph. Все они — чисто презентационные компоненты: сайт сам разрешает свой реестр и передаёт данные, готовые к показу. Помощники разрешения едут в пакете — createTaxonomy и createBacklinks (механика в пакете, смысл на сайте).

§2.1Вся привязка — три строки

src/lib/taxonomy.ts (вся привязка этого сайта)
import { createTaxonomy } from 'astro-inkstone/lib/taxonomy';
import { DOMAINS, KINDS, STATUSES } from '../content/notes/_meta/taxonomy';

export const { getWikiUnits, groupByKind, groupByDomain, groupByPrimaryDomain, tagIndex, resolveTaxonomy } =
  createTaxonomy({ kinds: KINDS, domains: DOMAINS, statuses: STATUSES },
    { collection: 'notes', locales: [{ code: 'zh', prefix: 'zh/' }], primary: 'en' });

Реестр (_meta/taxonomy.ts) — чистые данные в дереве контента: типы, направления с тоновыми цветами, статусы с цветами точек, и у каждого значения подписи по-английски и по-китайски. Добавьте туда значение, пометьте им заметку — и каждая обзорная страница его подхватит: маршруты и так параметризованы по значениям.

§2.2Полка и её токены

Обзорные страницы стоят на втором фоне: browse.css даёт им тёплую бумагу, антиквенную шапку, линейку полки в два пункта и сетку карточек — всё через токены --wb-*, навигационную половину двухконтекстной палитры. Страница входит в контекст одним классом wb-root на body; внутри него токены обвязки переназначены, и одна и та же панель навигации сидит на любом из двух фонов.

§2.3NoteCard

Карточка получает данные, готовые к показу, — разрешённые подписи, тона, отформатированную дату, ссылки на зеркала. Живут карточки на полке, поэтому образец помещён в лоскут навигационного контекста (.wb-root.wb-inset) прямо посреди колонки чтения:

  • Справочник2026.08
    Всё и сразу

    Каждый элемент конвейера Markdown выступает на этой странице ровно один раз.

    ПайплайнВечнозелёнаяEN
  • Справочник3 chapters2026.08
    Набор компонентов

    Все компоненты пакета за три главы — и живой показ хаба.

    КомпонентыВечнозелёная

    Hero · HubCard · Stats — обрамление хаба, показанное на самом хабе

§2.4FacetNav

Многомерный указатель для навигации — типы, направления (со своими тонами), популярные теги, всё в виде заранее отрисованных ссылок-пилюль:

Строки подписей — тоже props с английскими умолчаниями: выше передано labels={{ kind: 'Тип', domain: 'Направление', tag: 'Теги', all: 'Все →' }} — ровно то, что передают русские страницы рубрик этого сада; больше не меняется ничего.

§2.5TaxonomyLine, KindBadge, StatusDot, DomainChip

Однострочная полоса мета в шапке заметки — это три бейджа-атома, собранные вместе; каждый атом можно использовать и поодиночке:

ПаттернДизайнРастётupdated 2026.08

Атомы сами по себе, прямо в строке текста: бейдж типа Инструкция, чип направления Пайплайн, точка статуса Вечнозелёная.

Панель «Обратные ссылки» под каждой заметкой этого сада считает пакетный createBacklinks: он выворачивает собственный резолвер вики-ссылок движка в индекс «цель ← источники», вместе с фрагментами контекста. Здесь — на встроенных образцах данных:

Долистайте до подвала этой страницы — там настоящая панель: эта глава сама служит целью вики-ссылок.

§2.7LocalGraph

Тот же индекс отвечает и на второй вопрос — что отсюда в одном переходе? — а index.localGraph(id, titleOf) возвращает ответ списком соседей, входящие первыми. Компонент рассаживает их по эллипсу вокруг заметки: входящие — сплошной линией, исходящие — пунктиром; сосед может нести собственный color (скажем, из второй коллекции). Ниже — на ширину колонки, с образцами данных; настоящий граф стоит в сайдбаре каждой заметки, у которой есть ссылки:

Заголовки, разделы и текст заметок — на этом языке.
    ↑↓ · Enter · Escastro-inkstone