wiki とブラウズ

この章にあるものは、すべてこのサイトで実際に動いています:ランディングページの書架は 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書架とそのトークン

ブラウズページは第二の地の上に立ちます:温かい紙、セリフのマストヘッド、書架の 2 ポイント罫、カードのグリッド——すべて browse.css が --wb-* トークン経由で与えます。二文脈パレットのブラウズ側の半分です。ページは body のクラス一つ、wb-root でこの文脈に入ります。その内側ではクロームのトークンが再マップされるので、同じナビバーがどちらの地にも正しく載ります。

§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

原子を単体で本文に流し込むと:ガイドの種類バッジ、パイプラインの分野チップ、常緑の状態ドット。

§2.6Backlinks

この庭の各ノートの下にある「バックリンク」パネルは、パッケージの createBacklinks が計算しています——エンジン自身のウィキリンクリゾルバを「ターゲット ← ソース」の索引に反転させたもので、文脈のスニペットも付いてきます。ここではインラインのサンプルデータで:

このページの足元までスクロールすれば本物が見えます——この章自身が、ウィキリンクのターゲットだからです。

§2.7LocalGraph

同じ索引はもう一つの問いにも答えます——ここから 1 ホップ以内には誰がいる?——index.localGraph(id, titleOf) がその答えを、インバウンドを先頭にした隣人リストで返します。コンポーネントは彼らをノートの周りの楕円の上に描きます:インバウンドは実線、アウトバウンドは破線。隣人は自分の color を持てます(たとえば第二のコレクション)。ここではカラム幅でサンプルデータを一枚。本物は、リンクを持つすべてのノートのサイドバーにいます: