@ozdao/scriptorium 0.0.0-stage → 0.1.1

package/src/components/SearchBox.vue

@@ -0,0 +1,381 @@
+<script setup>
+// Окно локального поиска — порт VPLocalSearchBox VitePress 1.6.4 (MIT) на
+// martyrs: модалка — Popup дизайн-системы (телепорт только на клиенте, подложка
+// закрывает окно по клику вне, блокировка прокрутки страницы), поле, список
+// результатов с подсветкой совпадений и крошками заголовков, клавиши ↑ ↓ Enter
+// Esc, фокус-ловушка. Открыто ли окно — store.core.state.search_open: его
+// ставят SearchButton и горячие клавиши (⌘K / Ctrl+K, /).
+//
+// Индекс (content/search-index.js) и MiniSearch грузятся лениво при первом
+// открытии отдельными чанками: в основной бандл и в SSR они не попадают. В dev
+// правка .md пересобирает индекс, новый модуль приходит по HMR, и при
+// следующем открытии окно берёт его.
+//
+// Отличия от VitePress: нет подробного вида (выдержки текста под заголовком —
+// VitePress монтирует для них компоненты страниц в браузере), нет сохранения
+// запроса в sessionStorage (запрос живёт, пока открыта вкладка) и нет возврата
+// «Назад» через pushState.
+import { ref, shallowRef, computed, watch, nextTick, onMounted, onBeforeUnmount, markRaw } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { useStore } from '@ozdao/martyrs/modules/core/client';
+import { Popup } from '@ozdao/martyrs';
+import { IconSearch, IconCross } from '@ozdao/martyrs/modules/icons/client';
+
+import site_config from '../configs/site.config.js';
+import { search_options } from '../content/search-options.js';
+import { scrollToAnchor } from '../router/links.js';
+
+// Сколько результатов показывать — как у VitePress.
+const result_limit = 16;
+
+const store = useStore();
+const route = useRoute();
+const router = useRouter();
+
+const shell = ref(null);
+const search_input = ref(null);
+const results_list = ref(null);
+
+const query = ref('');
+const search_index = shallowRef(null);
+const results = shallowRef([]);
+const selected_index = ref(-1);
+// Поиск по текущему запросу уже прошёл: «Ничего не найдено» не мигает, пока грузится индекс.
+const searched = ref(false);
+
+// JSON индекса, из которого собран search_index: новый модуль после HMR — новая строка.
+let index_json = null;
+// Элемент, с которого открыли окно: фокус возвращается на него при закрытии.
+let opener = null;
+
+async function loadIndex() {
+  const [{ default: MiniSearch }, { default: json }] = await Promise.all([
+    import('minisearch'),
+    import('../content/search-index.js'),
+  ]);
+  if (json === index_json) return;
+  index_json = json;
+  search_index.value = markRaw(MiniSearch.loadJSON(json, search_options));
+}
+
+function runSearch() {
+  if (!search_index.value) return;
+  results.value = search_index.value.search(query.value).slice(0, result_limit);
+  searched.value = true;
+}
+
+watch(query, () => {
+  searched.value = false;
+  runSearch();
+});
+
+watch(search_index, runSearch);
+
+watch(results, (list) => {
+  selected_index.value = list.length ? 0 : -1;
+  scrollToSelected();
+});
+
+// Текст → куски с отметкой совпадения. Совпавшие термины — ключи result.match
+// (термины индекса, уже в нижнем регистре); длинные — раньше, как у VitePress.
+function escapeRegExp(text) {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function highlightParts(text, pattern) {
+  const parts = [];
+  let last_index = 0;
+
+  for (const match of text.matchAll(pattern)) {
+    if (!match[0]) continue;
+    if (match.index > last_index) parts.push({ text: text.slice(last_index, match.index), mark: false });
+    parts.push({ text: match[0], mark: true });
+    last_index = match.index + match[0].length;
+  }
+
+  if (last_index < text.length) parts.push({ text: text.slice(last_index), mark: false });
+  return parts;
+}
+
+const result_items = computed(() => results.value.map((result) => {
+  const terms = Object.keys(result.match).sort((a, b) => b.length - a.length);
+  const pattern = terms.length ? new RegExp(terms.map(escapeRegExp).join('|'), 'giu') : null;
+  const partsOf = (text) => (pattern ? highlightParts(text, pattern) : [{ text, mark: false }]);
+
+  return {
+    id: result.id,
+    label: [...result.titles, result.title].join(' > '),
+    title_parts: partsOf(result.title),
+    titles_parts: result.titles.map(partsOf),
+  };
+}));
+
+function scrollToSelected() {
+  nextTick(() => {
+    results_list.value?.querySelector('.docs-search__result--selected')?.scrollIntoView({ block: 'nearest' });
+  });
+}
+
+function moveSelection(step) {
+  const count = results.value.length;
+  if (!count) return;
+  selected_index.value = (selected_index.value + step + count) % count;
+  scrollToSelected();
+}
+
+function focusInput(select = true) {
+  search_input.value?.focus();
+  if (select) search_input.value?.select();
+}
+
+function open() {
+  store.core.state.search_open = true;
+}
+
+function close() {
+  store.core.state.search_open = false;
+}
+
+function resetSearch() {
+  query.value = '';
+  nextTick(() => focusInput(false));
+}
+
+// Переход по результату роутером; якорь прокручивает скроллер раскладки martyrs
+// (#scrollview), а не окно — как ссылки на заголовки в router/links.js.
+async function openResult(item) {
+  close();
+  const hash_index = item.id.indexOf('#');
+  const anchor = hash_index === -1 ? '' : item.id.slice(hash_index + 1);
+
+  await router.push(item.id);
+  await nextTick();
+
+  if (anchor) scrollToAnchor(anchor);
+  else document.getElementById('scrollview')?.scrollTo({ top: 0, behavior: 'smooth' });
+}
+
+// Клик с модификатором или средней кнопкой — новая вкладка браузера, как у обычной ссылки.
+function onResultClick(event, item) {
+  if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
+  event.preventDefault();
+  openResult(item);
+}
+
+// Выбор мышью — по движению, а не по mouseenter: прокрутка списка клавишами
+// подводит результаты под неподвижный курсор и не должна сбивать выбор.
+function onResultsMousemove(event) {
+  const index = Number(event.target.closest?.('[data-index]')?.dataset.index);
+  if (Number.isInteger(index) && index !== selected_index.value) selected_index.value = index;
+}
+
+function isEditingContent(event) {
+  const element = event.target;
+  return Boolean(element?.isContentEditable) || ['INPUT', 'SELECT', 'TEXTAREA'].includes(element?.tagName);
+}
+
+// Фокус-ловушка: Tab и Shift+Tab ходят по кругу внутри окна (поле, сброс,
+// результаты). Кнопка закрытия Popup выключена (options.close_button):
+// закрытие — Esc, клик вне окна, сброс поля.
+function trapFocus(event) {
+  const panel = shell.value?.closest('.popup-content') ?? shell.value;
+  if (!panel) return;
+
+  const focusable = [...panel.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"])')]
+    .filter((element) => element.getClientRects().length > 0);
+  if (!focusable.length) return;
+
+  const first = focusable[0];
+  const last = focusable[focusable.length - 1];
+  const active = document.activeElement;
+
+  if (!panel.contains(active)) {
+    event.preventDefault();
+    first.focus();
+  } else if (event.shiftKey && active === first) {
+    event.preventDefault();
+    last.focus();
+  } else if (!event.shiftKey && active === last) {
+    event.preventDefault();
+    first.focus();
+  }
+}
+
+function onKeydown(event) {
+  const key = event.key;
+  if (typeof key !== 'string') return;
+
+  const is_shortcut = key.toLowerCase() === 'k' && (event.metaKey || event.ctrlKey);
+
+  if (!store.core.state.search_open) {
+    if (is_shortcut || (key === '/' && !isEditingContent(event))) {
+      event.preventDefault();
+      open();
+    }
+    return;
+  }
+
+  if (is_shortcut) {
+    event.preventDefault();
+    focusInput();
+    return;
+  }
+
+  if (key === 'ArrowUp' || key === 'ArrowDown') {
+    event.preventDefault();
+    moveSelection(key === 'ArrowUp' ? -1 : 1);
+  } else if (key === 'Enter') {
+    if (event.isComposing) return;
+    // Enter на кнопке нажимает её, на результате — открывает ссылку (onResultClick).
+    if (event.target instanceof HTMLButtonElement || event.target instanceof HTMLAnchorElement) return;
+    event.preventDefault();
+    const item = result_items.value[selected_index.value];
+    if (item) openResult(item);
+  } else if (key === 'Escape') {
+    event.preventDefault();
+    close();
+  } else if (key === 'Tab') {
+    trapFocus(event);
+  }
+}
+
+watch(() => store.core.state.search_open, (is_open) => {
+  if (is_open) {
+    opener = document.activeElement;
+    loadIndex().catch((error) => console.error('[scriptorium] индекс поиска не загрузился', error));
+    return;
+  }
+  opener?.focus?.();
+  opener = null;
+});
+
+// Поле появляется вместе с окном (Popup монтирует содержимое на открытии).
+watch(search_input, (input) => {
+  if (input) nextTick(() => focusInput());
+});
+
+// Переход по истории (Назад/Вперёд) при открытом окне закрывает его.
+watch(() => route.fullPath, close);
+
+onMounted(() => window.addEventListener('keydown', onKeydown));
+onBeforeUnmount(() => window.removeEventListener('keydown', onKeydown));
+</script>
+
+<template>
+  <Popup
+    :isPopupOpen="Boolean(store.core.state.search_open)"
+    :options="{ close_button: false }"
+    align="top center"
+    class="docs-search bg-base radius-medium pd-small"
+    role="dialog"
+    aria-modal="true"
+    :aria-label="site_config.labels.search.button"
+    @close-popup="close"
+  >
+    <div ref="shell" class="docs-search__shell flex flex-column gap-regular">
+      <form class="docs-search__bar field-wrapper flex flex-nowrap flex-v-center gap-thin pd-l-small radius-small" role="search" @submit.prevent>
+        <label id="docs-search-label" for="docs-search-input" class="flex flex-v-center" :title="site_config.labels.search.button">
+          <IconSearch class="docs-search__icon i-regular" aria-hidden="true" />
+        </label>
+
+        <input
+          id="docs-search-input"
+          ref="search_input"
+          v-model="query"
+          type="search"
+          class="docs-search__input w-100 pd-t-small pd-b-small"
+          :placeholder="site_config.labels.search.placeholder"
+          aria-labelledby="docs-search-label"
+          aria-autocomplete="list"
+          :aria-controls="results.length ? 'docs-search-list' : undefined"
+          :aria-activedescendant="selected_index > -1 ? `docs-search-item-${selected_index}` : undefined"
+          autocapitalize="off"
+          autocomplete="off"
+          autocorrect="off"
+          spellcheck="false"
+          enterkeyhint="go"
+          maxlength="64"
+        >
+
+        <!-- Сброс есть только при введённом запросе, как у VitePress: пустому полю
+             выключенная кнопка ни к чему. -->
+        <button
+          v-if="query"
+          type="button"
+          class="docs-search__reset flex flex-center pd-small radius-small"
+          :title="site_config.labels.search.reset"
+          :aria-label="site_config.labels.search.reset"
+          @click="resetSearch"
+        >
+          <IconCross class="docs-search__icon i-small" aria-hidden="true" />
+        </button>
+      </form>
+
+      <ul
+        v-if="results.length"
+        id="docs-search-list"
+        ref="results_list"
+        role="listbox"
+        aria-labelledby="docs-search-label"
+        class="docs-search__results flex flex-column gap-thin"
+        @mousemove="onResultsMousemove"
+      >
+        <li
+          v-for="(item, index) in result_items"
+          :id="`docs-search-item-${index}`"
+          :key="item.id"
+          role="option"
+          :aria-selected="index === selected_index ? 'true' : 'false'"
+        >
+          <a
+            :href="item.id"
+            :data-index="index"
+            class="docs-search__result flex flex-nowrap flex-v-center gap-small pd-small radius-small"
+            :class="{ 'docs-search__result--selected': index === selected_index }"
+            :aria-label="item.label"
+            @focusin="selected_index = index"
+            @click="onResultClick($event, item)"
+          >
+            <span class="docs-search__hash" aria-hidden="true">#</span>
+            <span class="flex flex-wrap flex-v-center gap-thin">
+              <template v-for="(parts, title_index) in item.titles_parts" :key="title_index">
+                <span class="docs-search__title">
+                  <template v-for="(part, part_index) in parts" :key="part_index">
+                    <mark v-if="part.mark" class="docs-search__mark">{{ part.text }}</mark>
+                    <template v-else>{{ part.text }}</template>
+                  </template>
+                </span>
+                <span class="docs-search__separator" aria-hidden="true">›</span>
+              </template>
+              <span class="docs-search__title docs-search__title--main">
+                <template v-for="(part, part_index) in item.title_parts" :key="part_index">
+                  <mark v-if="part.mark" class="docs-search__mark">{{ part.text }}</mark>
+                  <template v-else>{{ part.text }}</template>
+                </template>
+              </span>
+            </span>
+          </a>
+        </li>
+      </ul>
+
+      <p v-else-if="query && searched" class="docs-search__empty t-center pd-small">
+        {{ site_config.labels.search.no_results }} «<strong>{{ query }}</strong>»
+      </p>
+
+      <div class="docs-search__keys desktop-only flex flex-wrap gap-regular">
+        <span class="flex flex-nowrap flex-v-center gap-thin">
+          <kbd class="docs-search__key">↑</kbd><kbd class="docs-search__key">↓</kbd>
+          {{ site_config.labels.search.navigate }}
+        </span>
+        <span class="flex flex-nowrap flex-v-center gap-thin">
+          <kbd class="docs-search__key">↵</kbd>
+          {{ site_config.labels.search.select }}
+        </span>
+        <span class="flex flex-nowrap flex-v-center gap-thin">
+          <kbd class="docs-search__key">esc</kbd>
+          {{ site_config.labels.search.close }}
+        </span>
+      </div>
+    </div>
+  </Popup>
+</template>

package/src/components/SearchButton.vue

@@ -0,0 +1,36 @@
+<script setup>
+// Кнопка поиска в шапке — порт VPNavBarSearchButton VitePress: лупа, подпись и
+// подсказка клавиш. На мобильном — только лупа. Открывает SearchBox через стор
+// (store.core.state.search_open).
+//
+// Подсказка ⌘K / Ctrl K: платформу знает только браузер. SSR и гидратация
+// печатают Ctrl K, на Mac подпись меняется после монтирования — так разметка
+// сервера и клиента при гидратации совпадает.
+import { ref, onMounted } from 'vue';
+import { useStore } from '@ozdao/martyrs/modules/core/client';
+import { IconSearch } from '@ozdao/martyrs/modules/icons/client';
+
+import site_config from '../configs/site.config.js';
+
+const store = useStore();
+
+const is_mac = ref(false);
+
+onMounted(() => {
+  is_mac.value = /Mac|iPhone|iPad|iPod/i.test(navigator.userAgentData?.platform || navigator.platform || navigator.userAgent);
+});
+</script>
+
+<template>
+  <button
+    type="button"
+    class="docs-search-button flex flex-nowrap flex-v-center gap-thin pd-thin radius-small"
+    :aria-label="site_config.labels.search.button"
+    aria-keyshortcuts="Meta+K Control+K /"
+    @click="store.core.state.search_open = true"
+  >
+    <IconSearch class="docs-search-button__icon i-regular" aria-hidden="true" />
+    <span class="docs-search-button__label desktop-only">{{ site_config.labels.search.button }}</span>
+    <kbd class="docs-search-button__keys desktop-only pd-l-thin pd-r-thin radius-small">{{ is_mac ? '⌘K' : 'Ctrl K' }}</kbd>
+  </button>
+</template>

package/src/components/SidebarTree.vue

@@ -0,0 +1,114 @@
+<script setup>
+// Дерево сайдбара (правила — content/sidebar.js). Компонент рекурсивный: корень
+// строит дерево из страниц и вызывает себя для вложенных папок.
+//
+// Не Tree и не Spoiler дизайн-системы: Tree — список категорий с drag-n-drop, а
+// Spoiler раскрывается только после монтирования, и SSR отдавал бы ветку
+// активной страницы свёрнутой. Здесь раскрытие считается из адреса и совпадает
+// на сервере и клиенте; свёрнутые ветки есть в HTML, скрыты стилем.
+import { computed, reactive, onMounted } from 'vue';
+import { useRoute } from 'vue-router';
+import { useStore, mixins } from '@ozdao/martyrs/modules/core/client';
+import { IconChevronBottom } from '@ozdao/martyrs/modules/icons/client';
+
+import site_config from '../configs/site.config.js';
+import { pages } from '../content/pages.js';
+import { buildSidebar, containsUrl } from '../content/sidebar.js';
+
+// Сайдбар martyrs передаёт навигации свои пропсы (theme, stateSidebar,
+// navigationItems) — дереву они не нужны и атрибутами в разметку не идут.
+defineOptions({ inheritAttrs: false });
+
+const props = defineProps({
+  items: {
+    type: Array,
+    default: null,
+  },
+  depth: {
+    type: Number,
+    default: 0,
+  },
+});
+
+const route = useRoute();
+const store = useStore();
+
+const is_root = props.items === null;
+const list = computed(() => props.items ?? buildSidebar(pages, site_config));
+
+const current_url = computed(() => {
+  try {
+    return decodeURI(route.path);
+  } catch {
+    return route.path;
+  }
+});
+
+// Ручное раскрытие/сворачивание папки сильнее умолчаний; ключ — адрес или подпись.
+const toggled = reactive({});
+
+function itemKey(item) {
+  return item.url ?? item.text;
+}
+
+function isOpen(item) {
+  const key = itemKey(item);
+  if (key in toggled) return toggled[key];
+  return !item.collapsed || containsUrl(item, current_url.value);
+}
+
+function toggle(item) {
+  toggled[itemKey(item)] = !isOpen(item);
+}
+
+if (is_root) {
+  const { isPhone, isTablet } = mixins.useGlobalMixins();
+  // SSR открывает сайдбар (sidebarOpenOnEnter) — это десктопная раскладка. На
+  // телефоне и планшете сайдбар — выезжающее меню: закрываем его после
+  // гидратации, иначе первое нажатие кнопки меню только сбросило бы флаг.
+  onMounted(() => {
+    if (isPhone() || isTablet()) store.core.state.isOpenSidebar = false;
+  });
+}
+</script>
+
+<template>
+  <nav v-if="is_root" class="docs-sidebar pd-medium flex flex-column gap-medium" :aria-label="site_config.labels.menu">
+    <!-- На мобильном шапка без ссылок nav: они встают в начало меню, как у VitePress. -->
+    <ul v-if="site_config.nav.length" class="docs-sidebar__nav mobile-only flex flex-column gap-thin">
+      <li v-for="item in site_config.nav" :key="item.link">
+        <router-link :to="item.link" class="docs-sidebar__link">{{ item.text }}</router-link>
+      </li>
+    </ul>
+
+    <SidebarTree :items="list" :depth="1" />
+  </nav>
+
+  <ul v-else class="docs-sidebar__list flex flex-column" :class="{ 'docs-sidebar__list--nested': depth > 1 }">
+    <li v-for="item in list" :key="itemKey(item)" class="docs-sidebar__item" :class="{ 'docs-sidebar__item--folder': item.items }">
+      <div class="docs-sidebar__row flex flex-nowrap flex-v-center gap-thin">
+        <router-link
+          v-if="item.url"
+          :to="item.url"
+          class="docs-sidebar__link"
+          :class="{ 'docs-sidebar__link--active': item.url === current_url }"
+        >{{ item.text }}</router-link>
+        <button v-else type="button" class="docs-sidebar__link docs-sidebar__folder" @click="toggle(item)">{{ item.text }}</button>
+
+        <button
+          v-if="item.items"
+          type="button"
+          class="docs-sidebar__caret flex-center flex"
+          :class="{ 'docs-sidebar__caret--open': isOpen(item) }"
+          :aria-expanded="isOpen(item)"
+          :aria-label="item.text"
+          @click="toggle(item)"
+        >
+          <IconChevronBottom class="i-small" fill="rgb(var(--text-muted))" />
+        </button>
+      </div>
+
+      <SidebarTree v-if="item.items" v-show="isOpen(item)" :items="item.items" :depth="depth + 1" />
+    </li>
+  </ul>
+</template>

package/src/components/SiteTitle.vue

@@ -0,0 +1,11 @@
+<script setup>
+// Заголовок сайта текстом — в шапке, когда тема потребителя не дала Logo.
+import site_config from '../configs/site.config.js';
+
+// Шапка martyrs передаёт логотипу theme и обработчик клика — ссылке они не нужны.
+defineOptions({ inheritAttrs: false });
+</script>
+
+<template>
+  <router-link to="/" class="docs-site-title">{{ site_config.title }}</router-link>
+</template>

package/src/components/ThemeToggle.vue

@@ -0,0 +1,31 @@
+<script setup>
+// Переключатель темы — механизм martyrs (ds.theme): data-theme на <html> и
+// cookie theme. По cookie сервер рендерит <html> уже в выбранной теме
+// (vue-app-renderer.js), поэтому страница не мигает при загрузке. Тема по
+// умолчанию — config.appearance, её подставляет server.js, пока cookie нет.
+//
+// Значок выбирается стилем по data-theme, а не из состояния: на сервере режим
+// темы проставляется в стор уже после рендера, и значок из состояния разошёлся
+// бы с разметкой при гидратации.
+import { ds } from '@ozdao/martyrs/design-system';
+
+import site_config from '../configs/site.config.js';
+
+// Сайдбар martyrs передаёт theme и stateSidebar — переключателю они не нужны.
+defineOptions({ inheritAttrs: false });
+</script>
+
+<template>
+  <div class="docs-theme-toggle pd-small">
+    <button
+      type="button"
+      class="docs-theme-toggle__button flex flex-nowrap flex-v-center gap-small w-100 pd-thin radius-small"
+      :aria-label="site_config.labels.theme"
+      @click="ds.theme.toggle()"
+    >
+      <span class="w-100 t-left">{{ site_config.labels.theme }}</span>
+      <span class="docs-theme-toggle__icon docs-theme-toggle__icon--dark" aria-hidden="true">🌙</span>
+      <span class="docs-theme-toggle__icon docs-theme-toggle__icon--light" aria-hidden="true">☀️</span>
+    </button>
+  </div>
+</template>

package/src/configs/client.config.js

@@ -0,0 +1,38 @@
+// Клиентская проводка: getConfig() для martyrs. Конфиг сайта документации
+// компоненты берут из configs/site.config.js напрямую.
+import site_config from './site.config.js';
+
+// Мета-теги страницы: App.vue martyrs печатает их по ключам meta.* из
+// app.messages (свой словарь useI18n). Заголовок и описание — из конфига сайта,
+// остальное пусто: без ключей в словаре в теги попадали бы сами ключи.
+const meta = {
+  title: site_config.title,
+  description: site_config.description,
+  keywords: '',
+  og: { title: site_config.title, description: site_config.description, image: '' },
+  twitter: { title: site_config.title, description: site_config.description, image: '', card: 'summary' },
+};
+
+export async function getConfig() {
+  return {
+    env: {
+      isMobileApp: false,
+    },
+
+    // core.app.js поднимает WebSocket, если globals.websocket не false; у сайта
+    // документации сервера сокетов нет.
+    globals: {
+      websocket: false,
+    },
+
+    app: {
+      url: '',
+      messages: {
+        [site_config.locale]: { meta },
+      },
+    },
+
+    // Модулей martyrs (auth, orders…) у сайта документации нет.
+    modules: {},
+  };
+}

package/src/configs/site.config.js

@@ -0,0 +1,8 @@
+// Конфиг сайта потребителя с умолчаниями — для бандла сайта. Алиас
+// '@docs-theme' ставит bin/scriptorium.js (→ папка documentation/); в node этот
+// файл не грузится, там конфиг читает content/scan.js.
+import raw_config from '@docs-theme/config.js';
+
+import { resolveSiteConfig } from '../content/site-config.js';
+
+export default resolveSiteConfig(raw_config);

package/src/content/current-page.js

@@ -0,0 +1,54 @@
+// Страница по адресу и её загрузка. Модуль страницы (чанк .md) грузится до
+// рендера — в гарде роутера, — поэтому SSR отдаёт готовый HTML, а клиент
+// гидрирует тот же HTML без ожидания чанка.
+//
+// В стор (store.core.state.docs) кладутся только данные страницы: стор уходит
+// в data-state ответа JSON'ом, компонент туда не сериализуется. Сами модули
+// лежат в карте ниже: это неизменяемые ES-модули, общие для всех запросов, как
+// кэш импортов, — состояния запроса в них нет.
+import { pages } from './pages.js';
+
+const page_by_url = new Map(pages.map((page) => [page.url, page]));
+const loaded_modules = new Map();
+
+function decodePath(path) {
+  try {
+    return decodeURI(path);
+  } catch {
+    return path;
+  }
+}
+
+// Адрес → страница. Адрес папки без слеша ведёт на её индекс: redirect_url.
+export function findPage(path) {
+  const page_path = decodePath(path);
+  const page = page_by_url.get(page_path);
+  if (page) return { page };
+
+  const folder_page = page_by_url.get(page_path.replace(/\/?$/, '/'));
+  if (folder_page) return { redirect_url: folder_page.url };
+
+  return {};
+}
+
+export async function openPage(page) {
+  let module = loaded_modules.get(page.url);
+  if (!module) {
+    module = await page.load();
+    loaded_modules.set(page.url, module);
+  }
+
+  return {
+    url: page.url,
+    file: page.file,
+    // Заголовок вкладки — h1 документа, как у VitePress; без h1 — подпись из сайдбара.
+    title: module.title || page.title,
+    frontmatter: module.frontmatter,
+    headers: module.headers,
+  };
+}
+
+// Компонент содержимого уже открытой страницы.
+export function pageComponent(url) {
+  return loaded_modules.get(url)?.default ?? null;
+}