marksites 0.1.0 → 0.2.2

package/dist/features/file-tree/index.js

@@ -61,6 +61,80 @@ function countComments(nodes) {
                 ? node.commentCount
                 : 0), 0);
 }
+function collectRecentFiles(nodes) {
+    const files = [];
+    const collect = (items, parentPath = "") => {
+        for (const item of items) {
+            if (item.type === "directory") {
+                collect(item.children, parentPath ? `${parentPath}/${item.name}` : item.name);
+                continue;
+            }
+            if (!item.modifiedAt)
+                continue;
+            const date = new Date(item.modifiedAt);
+            if (Number.isNaN(date.getTime()))
+                throw new Error(`Invalid file tree modifiedAt timestamp: ${item.modifiedAt}`);
+            files.push({
+                name: item.name,
+                path: item.path ?? (parentPath ? `${parentPath}/${item.name}` : item.name),
+                href: item.href,
+                current: item.current === true,
+                modifiedAt: date.toISOString(),
+                timestamp: date.getTime(),
+                commentCount: item.commentCount,
+            });
+        }
+    };
+    collect(nodes);
+    return files.sort((left, right) => right.timestamp - left.timestamp ||
+        left.path.localeCompare(right.path, "en"));
+}
+function renderRecentFiles(nodes) {
+    const files = collectRecentFiles(nodes);
+    if (files.length === 0)
+        return `    <li class="file-tree-recent-empty">更新日時のあるファイルはありません</li>`;
+    let currentDate = "";
+    let groupNumber = 0;
+    const output = [];
+    for (let index = 0; index < files.length;) {
+        const first = files[index];
+        const date = first.modifiedAt.slice(0, 10);
+        if (date !== currentDate) {
+            const dateCount = files.filter((file) => file.modifiedAt.startsWith(date)).length;
+            output.push(`    <li class="file-tree-date" data-date="${date}"><button type="button" data-recent-date-toggle aria-expanded="true"><svg viewBox="0 0 16 16" aria-hidden="true"><path d="M4 6l4 4 4-4"/></svg><time datetime="${date}">${Number(date.slice(0, 4))}年${Number(date.slice(5, 7))}月${Number(date.slice(8, 10))}日</time><span aria-label="ファイル${dateCount}件">${dateCount}</span></button></li>`);
+            currentDate = date;
+        }
+        const separator = first.path.lastIndexOf("/");
+        const directory = separator === -1 ? "" : first.path.slice(0, separator + 1);
+        let end = index + 1;
+        while (end < files.length) {
+            const candidate = files[end];
+            const candidateSeparator = candidate.path.lastIndexOf("/");
+            const candidateDirectory = candidateSeparator === -1
+                ? ""
+                : candidate.path.slice(0, candidateSeparator + 1);
+            if (candidate.modifiedAt.slice(0, 10) !== date ||
+                candidateDirectory !== directory)
+                break;
+            end++;
+        }
+        const grouped = end - index >= 2;
+        const groupId = grouped ? `recent-${groupNumber++}` : "";
+        const directoryLabel = directory ? `/${directory}` : "/";
+        if (grouped)
+            output.push(`    <li class="file-tree-directory-group" data-recent-group="${groupId}" title="${escapeHtml(directoryLabel)}">${renderFolderIcon()}<span>${escapeHtml(directoryLabel)}</span></li>`);
+        for (; index < end; index++) {
+            const file = files[index];
+            const current = file.current ? ' aria-current="page"' : "";
+            const count = Number.isSafeInteger(file.commentCount) && file.commentCount > 0
+                ? `<span class="file-tree-comment-count" aria-label="コメント${file.commentCount}件">${file.commentCount}</span>`
+                : "";
+            const time = file.modifiedAt.slice(11, 16);
+            output.push(`    <li class="file-tree-recent-file${grouped ? " is-grouped" : ""}" data-file-path="${escapeHtml(file.path)}" data-directory="${escapeHtml(directory)}" data-modified-at="${file.modifiedAt}"${grouped ? ` data-recent-group="${groupId}"` : ""}><a href="${escapeHtml(file.href)}" title="${escapeHtml(file.path)}"${current}><time datetime="${file.modifiedAt}">${time}</time><span class="file-tree-recent-label"><span class="file-tree-name">${escapeHtml(file.name)}</span><span class="file-tree-directory-path">${renderFolderIcon()}<span>${escapeHtml(directoryLabel)}</span></span></span>${count}</a></li>`);
+        }
+    }
+    return output.join("\n");
+}
 export function renderFileTree(options) {
     if (!options || options.items.length === 0)
         return "";
@@ -71,13 +145,20 @@ ${contents}</nav>
 `;
 }
 function renderTreeContents(items, folderIds) {
-    return `    <div class="file-tree-filter">
+    return `    <div class="file-tree-view-tabs" role="tablist" aria-label="ファイル表示">
+      <button type="button" role="tab" data-file-tree-view="tree" aria-selected="true">ツリー</button>
+      <button type="button" role="tab" data-file-tree-view="recent" aria-selected="false" tabindex="-1">更新順</button>
+    </div>
+    <div class="file-tree-filter">
       <input type="search" class="file-tree-filter-input" placeholder="ファイルを検索" aria-label="ファイル名で検索" autocomplete="off">
       <p class="file-tree-filter-empty" hidden>一致するファイルはありません</p>
     </div>
-    <ul class="file-tree-root">
+    <ul class="file-tree-root" data-file-tree-panel="tree" role="tabpanel">
 ${renderNodes(items, folderIds)}
     </ul>
+    <ul class="file-tree-recent" data-file-tree-panel="recent" role="tabpanel" hidden>
+${renderRecentFiles(items)}
+    </ul>
 `;
 }
 export function renderFileSidebar(options) {
@@ -85,17 +166,12 @@ export function renderFileSidebar(options) {
         return "";
     const folderIds = createFolderIds(options.items);
     const title = escapeHtml(options.title ?? "ファイル");
+    const contents = renderTreeContents(options.items, folderIds);
     return `<button type="button" class="file-sidebar-close" data-file-sidebar-close aria-label="ファイルサイドバーを閉じる" title="ファイルサイドバーを閉じる"><svg class="file-sidebar-toggle-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="1.75" y="2.25" width="12.5" height="11.5" rx="1.5" /><path d="M6 2.5v11M10.5 5.5L8 8l2.5 2.5" /></svg></button>
 <aside class="file-sidebar" id="file-sidebar" aria-label="${title}">
   <div class="file-sidebar-header"><span>${title}</span></div>
   <nav class="file-tree file-tree-sidebar" aria-label="${title}">
-    <div class="file-tree-filter">
-      <input type="search" class="file-tree-filter-input" placeholder="ファイルを検索" aria-label="ファイル名で検索" autocomplete="off">
-      <p class="file-tree-filter-empty" hidden>一致するファイルはありません</p>
-    </div>
-    <ul class="file-tree-root">
-${renderNodes(options.items, folderIds)}
-    </ul>
+${contents}
 </nav>
 </aside>
 `;
@@ -117,10 +193,12 @@ export function renderFileTreeScript(enabled) {
   const stateParameter = 'open';
   const popoverParameter = 'marksites-files';
   const sidebarParameter = 'file-sidebar';
+  const viewParameter = 'file-view';
   const pageUrl = new URL(location.href);
   const openPaths = new Set(pageUrl.searchParams.getAll(stateParameter));
   const compact = matchMedia('(max-width: 900px)');
   let sidebarPreferenceOpen = pageUrl.searchParams.get(sidebarParameter) !== 'closed';
+  let activeView = pageUrl.searchParams.get(viewParameter) === 'recent' ? 'recent' : 'tree';
   const ignoredToggles = new WeakSet();
   const initialOpenState = new Map();
 
@@ -141,6 +219,8 @@ export function renderFileTreeScript(enabled) {
       if (!popover.hidden) url.searchParams.set(popoverParameter, 'open');
       url.searchParams.delete(sidebarParameter);
       if (!sidebarPreferenceOpen) url.searchParams.set(sidebarParameter, 'closed');
+      url.searchParams.delete(viewParameter);
+      if (activeView === 'recent') url.searchParams.set(viewParameter, 'recent');
       return url;
     };
 
@@ -182,11 +262,14 @@ export function renderFileTreeScript(enabled) {
   };
 
   const applySidebarState = (open) => {
+    if (open && !popover.hidden) setPopoverOpen(false, false, false);
     sidebar.hidden = !open;
     sidebarCloseButton.hidden = !open;
     sidebarOpenButton.hidden = open;
     sidebarOpenButton.setAttribute('aria-expanded', String(open));
     document.body.classList.toggle('file-sidebar-collapsed', !open);
+    popoverToggle.disabled = open;
+    popoverToggle.setAttribute('aria-disabled', String(open));
   };
 
   const setSidebarOpen = (open, sync = true) => {
@@ -197,8 +280,162 @@ export function renderFileTreeScript(enabled) {
     else sidebarOpenButton.focus();
   };
 
-  setPopoverOpen(pageUrl.searchParams.get(popoverParameter) === 'open', false, false);
+  const openRecentDates = new Set();
+
+  const rebuildRecentGroups = (tree) => {
+    const list = tree.querySelector('.file-tree-recent');
+    if (!list) return;
+    const files = [...list.querySelectorAll('.file-tree-recent-file')];
+    for (const heading of list.querySelectorAll('.file-tree-date,.file-tree-directory-group')) heading.remove();
+    for (const file of files) {
+      file.classList.remove('is-grouped');
+      delete file.dataset.recentGroup;
+    }
+    const pad = value => String(value).padStart(2, '0');
+    files.sort((left, right) => {
+      const dateDifference = new Date(right.dataset.modifiedAt) - new Date(left.dataset.modifiedAt);
+      return dateDifference || left.dataset.filePath.localeCompare(right.dataset.filePath, 'en');
+    });
+    let previousDate = '',groupNumber = 0;
+    for (let index = 0; index < files.length;) {
+      const first = files[index];
+      const firstDate = new Date(first.dataset.modifiedAt);
+      const dateKey = firstDate.getFullYear()+'-'+pad(firstDate.getMonth()+1)+'-'+pad(firstDate.getDate());
+      let end = index+1;
+      while (end < files.length) {
+        const candidate = files[end],candidateDate = new Date(candidate.dataset.modifiedAt);
+        const candidateDateKey = candidateDate.getFullYear()+'-'+pad(candidateDate.getMonth()+1)+'-'+pad(candidateDate.getDate());
+        if (candidateDateKey !== dateKey || candidate.dataset.directory !== first.dataset.directory) break;
+        end++;
+      }
+      const grouped = end-index >= 2;
+      const groupId = grouped ? 'recent-'+groupNumber++ : '';
+      if (dateKey !== previousDate) {
+        const heading = document.createElement('li');
+        heading.className = 'file-tree-date';
+        heading.dataset.date = dateKey;
+        const button = document.createElement('button');
+        button.type = 'button';
+        button.dataset.recentDateToggle = '';
+        button.setAttribute('aria-expanded', 'true');
+        button.innerHTML = '<svg viewBox="0 0 16 16" aria-hidden="true"><path d="M4 6l4 4 4-4"/></svg>';
+        const label = document.createElement('time');
+        label.dateTime = dateKey;
+        label.textContent = firstDate.getFullYear()+'年'+(firstDate.getMonth()+1)+'月'+firstDate.getDate()+'日';
+        const count = document.createElement('span');
+        const dateCount = files.filter(file => {
+          const value = new Date(file.dataset.modifiedAt);
+          return value.getFullYear()+'-'+pad(value.getMonth()+1)+'-'+pad(value.getDate()) === dateKey;
+        }).length;
+        count.textContent = String(dateCount);
+        count.setAttribute('aria-label', 'ファイル'+dateCount+'件');
+        button.append(label,count);
+        heading.append(button);
+        list.append(heading);
+        previousDate = dateKey;
+      }
+      if (grouped) {
+        const group = document.createElement('li');
+        group.className = 'file-tree-directory-group';
+        group.dataset.recentGroup = groupId;
+        group.dataset.localDate = dateKey;
+        const directoryLabel = first.dataset.directory ? '/'+first.dataset.directory : '/';
+        group.title = directoryLabel;
+        group.innerHTML = ${JSON.stringify(renderFolderIcon())};
+        const name = document.createElement('span');
+        name.textContent = directoryLabel;
+        group.append(name);
+        list.append(group);
+      }
+      for (; index < end; index++) {
+        const file = files[index];
+      const date = new Date(file.dataset.modifiedAt);
+      file.dataset.localDate = dateKey;
+      const time = file.querySelector('time');
+      time.textContent = pad(date.getHours())+':'+pad(date.getMinutes());
+        if (grouped) {
+          file.classList.add('is-grouped');
+          file.dataset.recentGroup = groupId;
+        }
+        list.append(file);
+      }
+    }
+  };
+
+  for (const tree of trees) rebuildRecentGroups(tree);
+
+  const firstRecentTree = trees[0];
+  const firstRecentFiles = [...firstRecentTree.querySelectorAll('.file-tree-recent-file')];
+  const latestRecentDate = firstRecentFiles[0]?.dataset.localDate;
+  if (latestRecentDate) openRecentDates.add(latestRecentDate);
+  for (const file of firstRecentFiles) {
+    if (file.querySelector('a[aria-current="page"]')) openRecentDates.add(file.dataset.localDate);
+  }
+
+  const applyRecentDateState = (searching = false) => {
+    for (const tree of trees) {
+      const files = [...tree.querySelectorAll('.file-tree-recent-file')];
+      for (const heading of tree.querySelectorAll('.file-tree-date')) {
+        const expanded = searching
+          ? files.some(file => file.dataset.localDate === heading.dataset.date && !file.hidden)
+          : openRecentDates.has(heading.dataset.date);
+        heading.querySelector('button').setAttribute('aria-expanded', String(expanded));
+        for (const item of tree.querySelectorAll('.file-tree-recent-file,.file-tree-directory-group')) {
+          if (item.dataset.localDate === heading.dataset.date)
+            item.classList.toggle('is-date-collapsed', !expanded);
+        }
+      }
+    }
+  };
+
+  applyRecentDateState();
+  for (const tree of trees) {
+    for (const button of tree.querySelectorAll('[data-recent-date-toggle]')) {
+      button.addEventListener('click', () => {
+        if (tree.querySelector('.file-tree-filter-input').value.trim() !== '') return;
+        const date = button.closest('.file-tree-date').dataset.date;
+        if (openRecentDates.has(date)) openRecentDates.delete(date);
+        else openRecentDates.add(date);
+        applyRecentDateState();
+      });
+    }
+  }
+
+  const applyView = (view, sync = true) => {
+    activeView = view;
+    for (const tree of trees) {
+      for (const button of tree.querySelectorAll('[data-file-tree-view]')) {
+        const selected = button.dataset.fileTreeView === view;
+        button.setAttribute('aria-selected', String(selected));
+        button.tabIndex = selected ? 0 : -1;
+      }
+      for (const panel of tree.querySelectorAll('[data-file-tree-panel]'))
+        panel.hidden = panel.dataset.fileTreePanel !== view;
+      const selector = view === 'tree' ? '.file-tree-file' : '.file-tree-recent-file';
+      const items = [...tree.querySelectorAll(selector)];
+      tree.querySelector('.file-tree-filter-empty').hidden = items.length === 0 || items.some(item => !item.hidden);
+    }
+    if (sync) syncState();
+  };
+
+  for (const tree of trees) {
+    const buttons = [...tree.querySelectorAll('[data-file-tree-view]')];
+    for (const button of buttons) {
+      button.addEventListener('click', () => applyView(button.dataset.fileTreeView));
+      button.addEventListener('keydown', (event) => {
+        if (!['ArrowLeft', 'ArrowRight'].includes(event.key)) return;
+        event.preventDefault();
+        const direction = event.key === 'ArrowRight' ? 1 : -1;
+        const next = buttons[(buttons.indexOf(button)+direction+buttons.length)%buttons.length];
+        applyView(next.dataset.fileTreeView);
+        next.focus();
+      });
+    }
+  }
+
   applySidebarState(sidebarPreferenceOpen && !compact.matches);
+  setPopoverOpen(pageUrl.searchParams.get(popoverParameter) === 'open' && sidebar.hidden, false, false);
+  applyView(activeView, false);
   syncState();
 
   popoverToggle?.addEventListener('click', (event) => {
@@ -208,7 +445,7 @@ export function renderFileTreeScript(enabled) {
   sidebarOpenButton?.addEventListener('click', () => setSidebarOpen(true));
   sidebarCloseButton?.addEventListener('click', () => setSidebarOpen(false));
   document.addEventListener('pointerdown', (event) => {
-    if (popover.hidden || event.target.closest('.file-navigation,.file-sidebar')) return;
+    if (popover.hidden || event.target.closest('.site-header-document-meta,.file-sidebar')) return;
     setPopoverOpen(false);
   });
   document.addEventListener('keydown', (event) => {
@@ -253,50 +490,68 @@ export function renderFileTreeScript(enabled) {
     }, 1000);
   });
 
-  for (const tree of trees) {
-    const input = tree.querySelector('.file-tree-filter-input');
+  const filterTree = (tree, query) => {
     const empty = tree.querySelector('.file-tree-filter-empty');
     const root = tree.querySelector('.file-tree-root');
     const treeDirectories = [...root.querySelectorAll('.file-tree-directory')];
-    const filter = () => {
-      const query = input.value.trim().toLocaleLowerCase();
-      const files = [...root.querySelectorAll('.file-tree-file')];
-      let matches = 0;
-      for (const file of files) {
-        const name = file.querySelector('a').dataset.fileName.toLocaleLowerCase();
-        const visible = query === '' || name.includes(query);
-        file.hidden = !visible;
-        if (visible) matches += 1;
-      }
-      for (const directory of [...treeDirectories].reverse()) {
-        const details = directory.querySelector(':scope > details');
-        const hasVisibleFile = [...details.querySelectorAll('.file-tree-file')].some((file) => !file.hidden);
-        directory.hidden = !hasVisibleFile;
-        const open = query === '' ? initialOpenState.get(details.dataset.folderId) : hasVisibleFile;
-        if (details.open !== open) {
-          ignoredToggles.add(details);
-          details.open = open;
-        }
+    const files = [...root.querySelectorAll('.file-tree-file')];
+    let treeMatches = 0;
+    for (const file of files) {
+      const name = file.querySelector('a').dataset.fileName.toLocaleLowerCase();
+      const visible = query === '' || name.includes(query);
+      file.hidden = !visible;
+      if (visible) treeMatches += 1;
+    }
+    for (const directory of [...treeDirectories].reverse()) {
+      const details = directory.querySelector(':scope > details');
+      const hasVisibleFile = [...details.querySelectorAll('.file-tree-file')].some((file) => !file.hidden);
+      directory.hidden = !hasVisibleFile;
+      const open = query === '' ? initialOpenState.get(details.dataset.folderId) : hasVisibleFile;
+      if (details.open !== open) {
+        ignoredToggles.add(details);
+        details.open = open;
       }
-      empty.hidden = matches !== 0;
-    };
-    input.addEventListener('input', filter);
+    }
+    const recentFiles = [...tree.querySelectorAll('.file-tree-recent-file')];
+    let recentMatches = 0;
+    for (const file of recentFiles) {
+      const visible = query === '' || file.dataset.filePath.toLocaleLowerCase().includes(query);
+      file.hidden = !visible;
+      if (visible) recentMatches += 1;
+    }
+    for (const heading of tree.querySelectorAll('.file-tree-date'))
+      heading.hidden = !recentFiles.some(file => file.dataset.localDate === heading.dataset.date && !file.hidden);
+    for (const heading of tree.querySelectorAll('.file-tree-directory-group'))
+      heading.hidden = !recentFiles.some(file => file.dataset.recentGroup === heading.dataset.recentGroup && !file.hidden);
+    const matches = activeView === 'tree' ? treeMatches : recentMatches;
+    empty.hidden = query === '' || matches !== 0;
+  };
+
+  const applyFilter = (value) => {
+    const query = value.trim().toLocaleLowerCase();
+    for (const tree of trees) {
+      tree.querySelector('.file-tree-filter-input').value = value;
+      filterTree(tree, query);
+    }
+    applyRecentDateState(query !== '');
+  };
+
+  for (const tree of trees) {
+    const input = tree.querySelector('.file-tree-filter-input');
+    input.addEventListener('input', () => applyFilter(input.value));
     input.addEventListener('keydown', (event) => {
       if (event.key !== 'Escape' || input.value === '') return;
-      input.value = '';
-      filter();
+      applyFilter('');
     });
   }
 })();
 </script>`;
 }
-export function renderBreadcrumbs(breadcrumbs, modifiedAt) {
-    const timestamp = renderModifiedAt(modifiedAt);
+export function renderBreadcrumbs(breadcrumbs) {
     if (!breadcrumbs || breadcrumbs.length === 0)
         return `<nav class="file-breadcrumbs" aria-label="パンくずリスト">
   <button type="button" class="file-sidebar-open" data-file-sidebar-open aria-expanded="true" aria-controls="file-sidebar" aria-label="ファイルサイドバーを開く" title="ファイルサイドバーを開く" hidden><svg class="file-sidebar-toggle-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="1.75" y="2.25" width="12.5" height="11.5" rx="1.5" /><path d="M6 2.5v11M8 5.5L10.5 8 8 10.5" /></svg></button>
   <button type="button" class="file-tree-popover-toggle" data-file-tree-toggle aria-expanded="false" aria-controls="file-tree-popover" aria-haspopup="true" aria-label="ファイルを開く" title="ファイルを開く"><span>ファイル</span><svg class="panel-toggle-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M4 6l4 4 4-4" /></svg></button>
-${timestamp}
 </nav>
 `;
     const current = breadcrumbs.find((breadcrumb) => breadcrumb.current);
@@ -322,7 +577,6 @@ ${items}
   <button type="button" class="file-sidebar-open" data-file-sidebar-open aria-expanded="true" aria-controls="file-sidebar" aria-label="ファイルサイドバーを開く" title="ファイルサイドバーを開く" hidden><svg class="file-sidebar-toggle-icon" viewBox="0 0 16 16" aria-hidden="true"><rect x="1.75" y="2.25" width="12.5" height="11.5" rx="1.5" /><path d="M6 2.5v11M8 5.5L10.5 8 8 10.5" /></svg></button>
 ${trail}  <button type="button" class="file-tree-popover-toggle" data-file-tree-toggle aria-expanded="false" aria-controls="file-tree-popover" aria-haspopup="true" aria-label="ファイルを開く" title="ファイルを開く"><span>${popoverLabel}</span><svg class="panel-toggle-icon" viewBox="0 0 16 16" aria-hidden="true"><path d="M4 6l4 4 4-4" /></svg></button>
   <button type="button" class="copy-file-path" data-copy-file-path="${escapeHtml(path)}" aria-label="ファイルパスをコピー" title="ファイルパスをコピー">${renderCopyIcon()}</button>
-${timestamp}
 </nav>
 `;
 }
@@ -332,7 +586,7 @@ export function renderModifiedAt(modifiedAt) {
     const date = new Date(modifiedAt);
     if (Number.isNaN(date.getTime()))
         throw new Error(`Invalid modifiedAt timestamp: ${modifiedAt}`);
-    const label = date.toISOString().slice(0, 19).replace("T", " ");
+    const label = date.toISOString().slice(0, 16).replace("T", " ");
     return `<time class="document-modified" datetime="${date.toISOString()}">更新 ${label}</time>`;
 }
 export function renderModifiedAtScript(enabled) {
@@ -342,6 +596,6 @@ export function renderModifiedAtScript(enabled) {
 const element=document.querySelector('.document-modified');if(!element)return;
 const date=new Date(element.dateTime);if(Number.isNaN(date.getTime()))return;
 const pad=value=>String(value).padStart(2,'0');
-element.textContent='更新 '+date.getFullYear()+'-'+pad(date.getMonth()+1)+'-'+pad(date.getDate())+' '+pad(date.getHours())+':'+pad(date.getMinutes())+':'+pad(date.getSeconds());
+element.textContent='更新 '+date.getFullYear()+'-'+pad(date.getMonth()+1)+'-'+pad(date.getDate())+' '+pad(date.getHours())+':'+pad(date.getMinutes());
 })()</script>`;
 }

package/dist/features/header/index.d.ts

@@ -1,4 +1,10 @@
 import type { DocumentFeature } from "../types.js";
 /** Assets owned by the generated document header. */
 export type HeaderFeature = DocumentFeature;
-export declare function createHeaderFeature(): HeaderFeature;
+interface HeaderFeatureOptions {
+    documentNavigation: string;
+    documentMetadata: string;
+    fileTree: string;
+}
+export declare function createHeaderFeature(options?: HeaderFeatureOptions): HeaderFeature;
+export {};

package/dist/features/header/index.js

@@ -1,18 +1,26 @@
-export function createHeaderFeature() {
+export function createHeaderFeature(options = {
+    documentNavigation: "",
+    documentMetadata: "",
+    fileTree: "",
+}) {
     const markup = `<header class="site-header">
-  <div class="site-header-brand"><strong>marksites</strong></div>
+  <div class="site-header-brand">
+    <strong class="site-header-logo">marksites</strong>
+    <div class="site-header-document-meta">
+${options.documentNavigation}${options.documentMetadata ? `      <span class="site-header-metadata-separator" aria-hidden="true"></span>\n      <div class="document-metadata">${options.documentMetadata}</div>\n` : ""}${options.fileTree}    </div>
+  </div>
   <div class="site-header-actions">
     <button type="button" class="site-header-action" data-theme-toggle aria-label="ダークモードに切り替え" title="ダークモードに切り替え"><svg data-theme-dark-icon viewBox="0 0 16 16" aria-hidden="true"><path d="M13.5 10.2A5.8 5.8 0 015.8 2.5 5.8 5.8 0 1013.5 10.2z" /></svg><svg data-theme-light-icon viewBox="0 0 16 16" aria-hidden="true" hidden><circle cx="8" cy="8" r="2.5"/><path d="M8 1v1.5M8 13.5V15M1 8h1.5M13.5 8H15M3.05 3.05l1.06 1.06M11.89 11.89l1.06 1.06M12.95 3.05l-1.06 1.06M4.11 11.89l-1.06 1.06"/></svg></button>
     <button type="button" class="site-header-action language-toggle" data-language-toggle aria-label="英語に切り替え" title="英語に切り替え"><svg viewBox="0 0 16 16" aria-hidden="true"><circle cx="8" cy="8" r="6"/><path d="M2 8h12M8 2a9 9 0 010 12M8 2a9 9 0 000 12"/></svg><span data-language-label>JA</span></button>
   </div>
 </header>`;
     const styles = `
-.site-header{position:fixed;z-index:40;top:0;right:0;left:0;box-sizing:border-box;display:flex;height:56px;align-items:center;justify-content:space-between;gap:16px;padding:0 16px;color:var(--fgColor-default,#1f2328);background:var(--bgColor-default,#fff);border-bottom:1px solid var(--borderColor-muted,#d8dee4)}body.markdown-body.has-file-tree .site-header{padding-left:56px}
-.site-header-brand{display:flex;min-width:0;align-items:center}.site-header-brand strong{font-size:.9375rem}.site-header-actions{display:flex;flex:none;align-items:center;gap:6px}.site-header-action{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;gap:3px;padding:0;color:var(--fgColor-muted,#59636e);font:inherit;background:transparent;border:0;border-radius:6px;cursor:pointer}.site-header-action:hover{color:var(--fgColor-default,#1f2328);background:var(--button-default-bgColor-hover,#eaeef2)}.site-header-action:focus-visible{outline:2px solid var(--focus-outlineColor,#0969da);outline-offset:2px}.site-header-action svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}.site-header-action svg[hidden]{display:none}.site-header-action.language-toggle{width:auto;min-width:48px;padding:0 7px}.language-toggle span{font-size:.6875rem;font-weight:700;line-height:1}
-body.markdown-body,body.markdown-body.has-file-tree,body.markdown-body.has-file-tree.file-sidebar-collapsed{padding-top:88px}.document-sidebar{top:88px;max-height:calc(100vh - 120px)}.file-sidebar{top:56px}.markdown-content :is(h1,h2,h3,h4,h5,h6){scroll-margin-top:88px}
+.site-header{position:fixed;z-index:40;top:0;right:0;left:0;box-sizing:border-box;display:flex;height:56px;align-items:center;gap:16px;padding:0 16px;color:var(--fgColor-default,#1f2328);background:var(--bgColor-default,#fff);border-bottom:1px solid var(--borderColor-muted,#d8dee4)}body.markdown-body.has-file-tree .site-header{padding-left:56px}
+.site-header-brand{display:flex;min-width:0;flex:1;align-items:center;gap:10px}.site-header-logo{display:inline-flex;height:26px;flex:none;align-items:center;padding:0 9px;color:#fff;font-size:.75rem;line-height:26px;background:#24292f;border-radius:6px}.site-header-document-meta{position:relative;display:flex;min-width:0;align-items:center}.site-header-document-meta .file-breadcrumbs{height:28px;min-width:0;align-items:center;padding:0;border:0}.site-header-document-meta .file-breadcrumbs ol{min-height:20px;align-items:center}.site-header-document-meta .file-breadcrumbs li,.site-header-document-meta .file-breadcrumbs a,.site-header-document-meta .file-breadcrumb-separator,.site-header-document-meta .file-tree-popover-toggle{height:20px;font-size:.8125rem;line-height:20px}.site-header-document-meta .file-tree-popover-toggle{top:0}.site-header-document-meta .copy-file-path{width:22px;height:20px}.site-header-metadata-separator{width:1px;height:16px;flex:none;margin:0 10px;background:var(--borderColor-default,#d0d7de)}.site-header-document-meta .document-metadata{display:flex;height:28px;flex:none;align-items:center;margin:0}.site-header-document-meta .document-modified{color:var(--fgColor-muted,#59636e);font-size:.6875rem;line-height:20px;white-space:nowrap}.site-header-actions{display:flex;flex:none;align-items:center;gap:6px}.site-header-action{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;gap:3px;padding:0;color:var(--fgColor-muted,#59636e);font:inherit;background:transparent;border:0;border-radius:6px;cursor:pointer}.site-header-action:hover{color:var(--fgColor-default,#1f2328);background:var(--button-default-bgColor-hover,#eaeef2)}.site-header-action:focus-visible{outline:2px solid var(--focus-outlineColor,#0969da);outline-offset:2px}.site-header-action svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}.site-header-action svg[hidden]{display:none}.site-header-action.language-toggle{width:auto;min-width:48px;padding:0 7px}.language-toggle span{font-size:.6875rem;font-weight:700;line-height:1}
+body.markdown-body,body.markdown-body.has-file-tree,body.markdown-body.has-file-tree.file-sidebar-collapsed{padding-top:88px}.document-sidebar{top:88px;height:calc(100vh - 120px);max-height:calc(100vh - 120px)}.file-sidebar{top:56px}.markdown-content :is(h1,h2,h3,h4,h5,h6){scroll-margin-top:88px}
 body.markdown-body[data-theme="dark"]{color-scheme:dark;color:#f0f6fc;background:#0d1117;--fgColor-default:#f0f6fc;--fgColor-muted:#a3abb5;--fgColor-accent:#58a6ff;--fgColor-danger:#ff7b72;--fgColor-attention:#e3b341;--fgColor-success:#56d364;--bgColor-default:#0d1117;--bgColor-muted:#161b22;--bgColor-neutral-muted:#6e768166;--bgColor-accent-muted:#1f6feb40;--bgColor-attention-muted:#bb800940;--bgColor-danger-muted:#67060c;--borderColor-default:#484f58;--borderColor-muted:#484f58cc;--borderColor-accent-emphasis:#388bfd;--button-default-bgColor-rest:#21262d;--button-default-bgColor-hover:#30363d;--focus-outlineColor:#58a6ff;--codeBlock-bgColor:#161b22;--codeBlock-fgColor:#e6edf3;--annotation-highlight-bgColor:#4d3b05;--annotation-highlight-borderColor:#e3b341;--color-prettylights-syntax-comment:#a3abb5;--color-prettylights-syntax-constant:#79c0ff;--color-prettylights-syntax-entity:#d2a8ff;--color-prettylights-syntax-entity-tag:#7ee787;--color-prettylights-syntax-keyword:#ff7b72;--color-prettylights-syntax-string:#a5d6ff;--color-prettylights-syntax-variable:#ffa657}
 body.markdown-body[data-theme="light"]{color-scheme:light;color:#1f2328;background:#fff;--fgColor-default:#1f2328;--fgColor-muted:#59636e;--fgColor-accent:#0969da;--fgColor-danger:#d1242f;--fgColor-attention:#9a6700;--fgColor-success:#1a7f37;--bgColor-default:#fff;--bgColor-muted:#f6f8fa;--bgColor-neutral-muted:#818b981f;--bgColor-accent-muted:#ddf4ff;--bgColor-attention-muted:#fff8c5;--bgColor-danger-muted:#ffebe9;--borderColor-default:#d0d7de;--borderColor-muted:#d8dee4;--borderColor-accent-emphasis:#0969da;--button-default-bgColor-rest:#f6f8fa;--button-default-bgColor-hover:#eaeef2;--focus-outlineColor:#0969da;--codeBlock-bgColor:#fff;--codeBlock-fgColor:#24292f;--annotation-highlight-bgColor:#fff8c5;--annotation-highlight-borderColor:#bf8700}
-@media(max-width:900px){body.markdown-body,body.markdown-body.has-file-tree,body.markdown-body.has-file-tree.file-sidebar-collapsed{padding-top:68px}.document-sidebar{top:68px;max-height:calc(100vh - 80px)}.file-sidebar{top:56px}.markdown-content :is(h1,h2,h3,h4,h5,h6){scroll-margin-top:68px}}
+@media(max-width:900px){.site-header{gap:10px;padding-right:10px}.site-header-document-meta .file-breadcrumbs ol,.site-header-document-meta .file-breadcrumb-separator,.site-header-document-meta .copy-file-path,.site-header-metadata-separator,.site-header-document-meta .document-metadata{display:none}body.markdown-body,body.markdown-body.has-file-tree,body.markdown-body.has-file-tree.file-sidebar-collapsed{padding-top:68px}.document-sidebar{top:68px;height:calc(100vh - 80px);max-height:calc(100vh - 80px)}.file-sidebar{top:56px}.markdown-content :is(h1,h2,h3,h4,h5,h6){scroll-margin-top:68px}}
 `;
     const script = `<script>(()=>{
 const languageParameter='lang',themeParameter='theme',pageUrl=new URL(location.href),textOriginal=new WeakMap(),attributeOriginal=new WeakMap();
@@ -21,7 +29,7 @@ const english=new Map(${JSON.stringify([
         ["追加", "Add"], ["コピー", "Copy"], ["コメントを追加", "Add comment"], ["コメントをすべてコピー", "Copy all comments"], ["コメントはありません。", "No comments."], ["このページにコメントはありません。", "No comments on this page."],
         ["コピー", "Copy"], ["AI向けコピー", "Copy for AI"], ["折り返す", "Wrap"], ["コピーしました", "Copied"], ["保存", "Save"], ["キャンセル", "Cancel"],
         ["引用", "Quote"], ["引用先なし", "Quote unavailable"], ["文書全体", "Whole document"],
-        ["ファイルを検索", "Filter files"], ["一致するファイルはありません", "No matching files"],
+        ["ファイルを検索", "Filter files"], ["一致するファイルはありません", "No matching files"], ["ファイル表示", "File view"], ["ツリー", "Tree"], ["更新順", "Recently updated"], ["更新日時のあるファイルはありません", "No files with update times"],
         ["ファイルサイドバーを開く", "Open file sidebar"], ["ファイルサイドバーを閉じる", "Close file sidebar"], ["ファイルを開く", "Open files"], ["ファイルを閉じる", "Close files"],
         ["ファイル名で検索", "Filter files by name"], ["ファイルパスをコピー", "Copy file path"], ["ファイルパスをコピーしました", "File path copied"], ["ファイルパスをコピーできませんでした", "Could not copy file path"],
         ["選択範囲の操作", "Selection actions"], ["選択範囲をコピー", "Copy selection"], ["AI向けの形式でコピー", "Copy for AI"], ["選択範囲にコメントを追加", "Add comment to selection"], ["文書全体にコメントを追加", "Add comment to document"],
@@ -32,8 +40,8 @@ const english=new Map(${JSON.stringify([
         ["コードをコピー", "Copy code"], ["長い行を折り返す", "Wrap long lines"], ["折り返しを解除", "Disable line wrapping"], ["コードをコピーしました", "Code copied"], ["コードをコピーできませんでした", "Could not copy code"],
         ["文書ナビゲーション", "Document navigation"], ["文書サイドバー", "Document sidebar"], ["パンくずリスト", "Breadcrumbs"]
     ])});
-const skipText=node=>{const parent=node.parentElement;if(!parent)return true;if(parent.closest('.file-tree-name,.file-tree summary span,.file-breadcrumbs ol,.table-of-contents a,.annotation-card>p,.annotation-quote,.annotation-source,.code-language'))return true;return Boolean(parent.closest('.markdown-content')&&!parent.closest('.file-navigation,.code-toolbar'))};
-const translate=value=>{if(english.has(value))return english.get(value);if(value.startsWith('更新 '))return'Updated '+value.slice(3);if(/^コメント\d+件$/.test(value))return value.replace(/^コメント(\d+)件$/,'$1 comments');return value};
+const skipText=node=>{const parent=node.parentElement;if(!parent)return true;if(parent.closest('.file-tree-name,.file-tree summary span,.file-breadcrumbs ol,.table-of-contents a,.annotation-card>p,.annotation-quote,.annotation-source,.code-language'))return true;return Boolean(parent.closest('.markdown-content')&&!parent.closest('.code-toolbar'))};
+const translate=value=>{if(english.has(value))return english.get(value);if(value.startsWith('更新 '))return'Updated '+value.slice(3);if(/^(\d{4})年(\d{1,2})月(\d{1,2})日$/.test(value))return value.replace(/^(\d{4})年(\d{1,2})月(\d{1,2})日$/,'$1-$2-$3');if(/^コメント\d+件$/.test(value))return value.replace(/^コメント(\d+)件$/,'$1 comments');if(/^ファイル\d+件$/.test(value))return value.replace(/^ファイル(\d+)件$/,'$1 files');return value};
 function applyNode(node,language){if(node.nodeType===Node.TEXT_NODE){if(skipText(node))return;if(!textOriginal.has(node))textOriginal.set(node,node.data);const original=textOriginal.get(node),trimmed=original.trim(),next=language==='en'?original.replace(trimmed,translate(trimmed)):original;if(node.data!==next)node.data=next;return}if(node.nodeType!==Node.ELEMENT_NODE)return;const element=node,attributes=['aria-label','title','placeholder'];let originals=attributeOriginal.get(element);if(!originals){originals=new Map();attributeOriginal.set(element,originals)}for(const name of attributes){if(!element.hasAttribute(name)&&!originals.has(name))continue;if(!originals.has(name))originals.set(name,element.getAttribute(name));const original=originals.get(name),next=language==='en'?translate(original):original;if(element.getAttribute(name)!==next)element.setAttribute(name,next)}for(const child of element.childNodes)applyNode(child,language)}
 function applyLanguage(language){document.documentElement.lang=language;document.body.dataset.language=language;for(const root of document.querySelectorAll('.site-header,.file-sidebar,.file-navigation,.document-sidebar,.selection-actions,.code-toolbar'))applyNode(root,language);const button=document.querySelector('[data-language-toggle]'),label=document.querySelector('[data-language-label]'),next=language==='ja'?'en':'ja';label.textContent=language==='ja'?'JA':'EN';button.setAttribute('aria-label',next==='en'?'英語に切り替え':'Switch to Japanese');button.title=button.getAttribute('aria-label')}
 function syncLinks(){const language=document.body.dataset.language,theme=document.body.dataset.theme;const update=url=>{url.searchParams.delete(languageParameter);if(language==='en')url.searchParams.set(languageParameter,'en');url.searchParams.set(themeParameter,theme);return url};history.replaceState(null,'',update(new URL(location.href)));for(const link of document.querySelectorAll('a[href]')){const raw=link.getAttribute('href');if(!raw||raw.startsWith('#'))continue;const url=new URL(raw,location.href);if(url.protocol===location.protocol&&url.host===location.host&&url.pathname.endsWith('.html'))link.href=update(url).href}}

package/dist/features/image-viewer/index.d.ts

@@ -0,0 +1,6 @@
+export interface ImageViewerFeature {
+    markup: string;
+    styles: string;
+    script: string;
+}
+export declare function createImageViewerFeature(enabled: boolean): ImageViewerFeature;

package/dist/features/image-viewer/index.js

@@ -0,0 +1,28 @@
+export function createImageViewerFeature(enabled) {
+    if (!enabled)
+        return { markup: "", styles: "", script: "" };
+    const markup = `<div class="image-viewer" data-image-viewer hidden role="dialog" aria-modal="true" aria-label="画像ビューアー">
+  <div class="image-viewer-toolbar">
+    <button type="button" data-image-zoom-out aria-label="縮小" title="縮小">−</button>
+    <button type="button" data-image-reset aria-label="元の大きさ" title="元の大きさ">100%</button>
+    <button type="button" data-image-zoom-in aria-label="拡大" title="拡大">＋</button>
+    <button type="button" data-image-close aria-label="閉じる" title="閉じる">×</button>
+  </div>
+  <div class="image-viewer-stage" data-image-stage><img data-image-viewer-image alt=""></div>
+</div>`;
+    const styles = `
+    .markdown-content img { cursor: zoom-in; }
+    .markdown-content img:focus-visible { outline: 2px solid var(--focus-outlineColor, #0969da); outline-offset: 3px; }
+    .image-viewer[hidden] { display: none; }
+    .image-viewer { position: fixed; z-index: 1000; inset: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); color: #fff; background: rgba(0,0,0,.9); }
+    .image-viewer-toolbar { display: flex; justify-content: flex-end; gap: 8px; padding: 12px; }
+    .image-viewer-toolbar button { min-width: 40px; height: 40px; padding: 0 10px; color: #fff; font: inherit; font-weight: 600; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.3); border-radius: 6px; cursor: pointer; }
+    .image-viewer-toolbar button:hover { background: rgba(255,255,255,.22); }
+    .image-viewer-toolbar button:focus-visible { outline: 2px solid #58a6ff; outline-offset: 2px; }
+    .image-viewer-stage { min-width: 0; min-height: 0; overflow: hidden; cursor: grab; touch-action: none; user-select: none; }
+    .image-viewer-stage.is-dragging { cursor: grabbing; }
+    .image-viewer-stage img { display: block; max-width: none; max-height: none; transform-origin: center; pointer-events: none; }
+    body.has-open-image-viewer { overflow: hidden; }`;
+    const script = `<script>(()=>{const viewer=document.querySelector('[data-image-viewer]'),stage=viewer?.querySelector('[data-image-stage]'),image=viewer?.querySelector('[data-image-viewer-image]');if(!(viewer instanceof HTMLElement)||!(stage instanceof HTMLElement)||!(image instanceof HTMLImageElement))return;let scale=1,x=0,y=0,drag=null,opener=null;const draw=()=>{image.style.transform='translate('+x+'px,'+y+'px) scale('+scale+')';};const reset=()=>{scale=1;x=(stage.clientWidth-image.naturalWidth)/2;y=(stage.clientHeight-image.naturalHeight)/2;draw();};const close=()=>{viewer.hidden=true;document.body.classList.remove('has-open-image-viewer');if(opener instanceof HTMLElement)opener.focus();};const open=target=>{opener=target;image.src=target.currentSrc||target.src;image.alt=target.alt;viewer.hidden=false;document.body.classList.add('has-open-image-viewer');image.onload=reset;viewer.querySelector('[data-image-close]')?.focus();};document.querySelectorAll('.markdown-content img').forEach(target=>{target.tabIndex=0;target.setAttribute('role','button');target.setAttribute('aria-label',(target.alt||'画像')+'を拡大表示');target.addEventListener('click',()=>open(target));target.addEventListener('keydown',event=>{if(event.key==='Enter'||event.key===' '){event.preventDefault();open(target);}});});viewer.querySelector('[data-image-close]')?.addEventListener('click',close);viewer.querySelector('[data-image-reset]')?.addEventListener('click',reset);const zoom=amount=>{scale=Math.min(8,Math.max(.1,scale*amount));draw();};viewer.querySelector('[data-image-zoom-in]')?.addEventListener('click',()=>zoom(1.25));viewer.querySelector('[data-image-zoom-out]')?.addEventListener('click',()=>zoom(.8));stage.addEventListener('wheel',event=>{event.preventDefault();zoom(event.deltaY<0?1.15:.87);},{passive:false});stage.addEventListener('pointerdown',event=>{drag={id:event.pointerId,x:event.clientX,y:event.clientY,ox:x,oy:y};stage.setPointerCapture(event.pointerId);stage.classList.add('is-dragging');});stage.addEventListener('pointermove',event=>{if(!drag||drag.id!==event.pointerId)return;x=drag.ox+event.clientX-drag.x;y=drag.oy+event.clientY-drag.y;draw();});const end=event=>{if(drag?.id===event.pointerId){drag=null;stage.classList.remove('is-dragging');}};stage.addEventListener('pointerup',end);stage.addEventListener('pointercancel',end);document.addEventListener('keydown',event=>{if(!viewer.hidden&&event.key==='Escape')close();});})();</script>`;
+    return { markup, styles, script };
+}

package/dist/features/sidebar/index.js

@@ -23,9 +23,9 @@ ${tableOfContents}${annotations}
   </div>
 </aside>`;
     const styles = `
-.document-sidebar{grid-area:toc;position:sticky;top:32px;box-sizing:border-box;display:flex;max-height:calc(100vh - 64px);min-height:0;flex-direction:column;border:1px solid var(--borderColor-muted,#d8dee4);border-radius:8px;background:var(--bgColor-default,#fff);overflow:hidden}
+.document-sidebar{grid-area:toc;position:sticky;top:32px;box-sizing:border-box;display:flex;height:calc(100vh - 64px);max-height:calc(100vh - 64px);min-height:0;flex-direction:column;border:1px solid var(--borderColor-muted,#d8dee4);border-radius:8px;background:var(--bgColor-default,#fff);overflow:hidden}
 .sidebar-toggle{display:none}
-.document-sidebar-body{display:flex;min-height:0;flex:0 1 auto;flex-direction:column;overflow:hidden}
+.document-sidebar-body{display:flex;min-height:0;flex:1 1 auto;flex-direction:column;overflow:hidden}
 .sidebar-tabs{display:flex;flex:none;gap:4px;padding:10px 10px 0;border-bottom:1px solid var(--borderColor-muted,#d8dee4)}
 .sidebar-tab{position:relative;min-width:0;flex:1;padding:8px 6px 10px;color:var(--fgColor-muted,#59636e);font:inherit;font-size:.8125rem;font-weight:600;line-height:1.25;background:transparent;border:0;cursor:pointer}
 .sidebar-tab::after{position:absolute;right:4px;bottom:-1px;left:4px;height:2px;background:transparent;content:""}
@@ -34,16 +34,18 @@ ${tableOfContents}${annotations}
 .sidebar-tab[aria-selected="true"]{color:var(--fgColor-default,#1f2328)}
 .sidebar-tab[aria-selected="true"]::after{background:var(--borderColor-accent-emphasis,#0969da)}
 .sidebar-count{display:inline-flex;min-width:18px;height:18px;align-items:center;justify-content:center;margin-left:3px;padding:0 4px;color:var(--fgColor-muted,#59636e);font-size:.6875rem;line-height:18px;background:var(--bgColor-muted,#f6f8fa);border-radius:9px}
-.sidebar-panels{display:flex;min-height:0;flex:0 1 auto;align-items:flex-start;overflow:hidden}
-.sidebar-panel{box-sizing:border-box;width:100%;max-height:100%;min-height:0;overflow:auto;padding:12px;scrollbar-width:thin;scrollbar-color:var(--borderColor-default,#d0d7de) transparent}
+.sidebar-panels{display:flex;min-height:0;flex:1 1 auto;align-items:stretch;overflow:hidden}
+.sidebar-panel{box-sizing:border-box;width:100%;height:100%;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:12px;scrollbar-width:thin;scrollbar-color:var(--borderColor-default,#d0d7de) transparent}
 .sidebar-panel[hidden],.document-sidebar-body[hidden]{display:none}
 @media(max-width:900px){.document-sidebar{z-index:10;top:12px;width:auto;max-height:calc(100vh - 24px);box-shadow:0 4px 12px rgba(31,35,40,.08)}.sidebar-toggle{box-sizing:border-box;display:flex;width:100%;min-height:44px;flex:none;align-items:center;justify-content:space-between;padding:8px 12px;color:var(--fgColor-default,#1f2328);font:inherit;font-size:.9375rem;font-weight:700;background:transparent;border:0;cursor:pointer}.sidebar-toggle:focus-visible{outline:2px solid var(--focus-outlineColor,#0969da);outline-offset:-2px}.sidebar-toggle[aria-expanded="false"] .panel-toggle-icon{transform:rotate(-90deg)}.sidebar-tabs{padding-top:0}}
 @media(prefers-reduced-motion:reduce){.panel-toggle-icon{transition:none}}`;
     const script = `<script>(()=>{
 const sidebar=document.querySelector('.document-sidebar');if(!sidebar)return;
 const tabs=[...sidebar.querySelectorAll('[data-sidebar-tab]')],panels=[...sidebar.querySelectorAll('.sidebar-panel')],toggle=sidebar.querySelector('.sidebar-toggle'),body=sidebar.querySelector('.document-sidebar-body'),label=sidebar.querySelector('[data-sidebar-toggle-label]'),compact=matchMedia('(max-width: 900px)');
-let active=${JSON.stringify(initialPanel)};
-function activate(name,focus=false){const tab=tabs.find(item=>item.dataset.sidebarTab===name);if(!tab)return;active=name;for(const item of tabs){const selected=item===tab;item.setAttribute('aria-selected',String(selected));item.tabIndex=selected?0:-1}for(const panel of panels)panel.hidden=panel.id!=='sidebar-panel-'+name;label.textContent=tab.childNodes[0].textContent.trim();if(compact.matches){body.hidden=false;toggle.setAttribute('aria-expanded','true')}if(focus)tab.focus()}
+const tabParameter='sidebar-tab',pageUrl=new URL(location.href),requestedTab=pageUrl.searchParams.get(tabParameter);
+let active=tabs.some(item=>item.dataset.sidebarTab===requestedTab)?requestedTab:${JSON.stringify(initialPanel)};
+function syncActiveTab(){const updateUrl=url=>{url.searchParams.delete(tabParameter);if(active==='comments')url.searchParams.set(tabParameter,active);return url};history.replaceState(null,'',updateUrl(new URL(location.href)));for(const link of document.querySelectorAll('a[href]')){const rawHref=link.getAttribute('href');if(!rawHref||rawHref.startsWith('#'))continue;const url=new URL(rawHref,location.href);if(url.protocol!==location.protocol||url.host!==location.host||!url.pathname.endsWith('.html'))continue;link.href=updateUrl(url).href}}
+function activate(name,focus=false){const tab=tabs.find(item=>item.dataset.sidebarTab===name);if(!tab)return;active=name;for(const item of tabs){const selected=item===tab;item.setAttribute('aria-selected',String(selected));item.tabIndex=selected?0:-1}for(const panel of panels)panel.hidden=panel.id!=='sidebar-panel-'+name;label.textContent=tab.childNodes[0].textContent.trim();if(compact.matches){body.hidden=false;toggle.setAttribute('aria-expanded','true')}syncActiveTab();if(focus)tab.focus()}
 function setExpanded(expanded){toggle.setAttribute('aria-expanded',String(expanded));body.hidden=!expanded}
 tabs.forEach((tab,index)=>{tab.addEventListener('click',()=>activate(tab.dataset.sidebarTab));tab.addEventListener('keydown',event=>{if(event.key!=='ArrowLeft'&&event.key!=='ArrowRight')return;event.preventDefault();const step=event.key==='ArrowRight'?1:-1;activate(tabs[(index+step+tabs.length)%tabs.length].dataset.sidebarTab,true)})});
 toggle.addEventListener('click',()=>setExpanded(toggle.getAttribute('aria-expanded')!=='true'));