@squadbase/vantage 0.5.3 → 0.6.1-dev.2d25e94

package/docs/ja/changelog.md

@@ -8,6 +8,111 @@ Vantage のリリースごとの変更点です。新しいものが上に来ま
 > まだプロトタイプ(**0.x**)です。0.x の間は **minor が実質のメジャー**扱いで、後方互換性の
 > ない変更は minor で入ることがあります。patch は後方互換の機能追加とバグ修正のみです。
 
+## v0.6.2
+
+リバースプロキシの後ろで dev サーバーを動かせるようになりました(2026-09-23)。
+
+### 追加
+
+- **`--host [addr]` と `--allowed-hosts <list|true>`** を `vantage dev` / `vantage preview`(SPA)に
+  追加しました。Vite は `Host` ヘッダが `localhost` 以外のリクエストを 403 で拒否するため、
+  サンドボックスのプレビュープロキシやトンネルなど**別のホスト名で前に立つもの**があると
+  そのままでは届きませんでした。`--allowed-hosts` は環境変数 **`VANTAGE_ALLOWED_HOSTS`** でも
+  渡せます(フラグが優先)。どちらも指定しなければ挙動は従来どおりです。詳細は
+  [CLI リファレンス](cli-reference)を参照してください。
+
+## v0.6.1
+
+ドキュメントのページを書けるようになりました(2026-09-25)。
+
+### 追加
+
+- **`<name>.doc.tsx` がドキュメントのページになります。** `@squadbase/vantage/doc` の `Document` で
+  包むと、中の見出し・段落・リスト・表・引用・コードにクラスなしでスタイルが当たります。配色・書体・
+  本文の幅は `--doc-*` トークンで変えられます。詳しくは[ルーティング](routing)と
+  [UI とテーマ](ui-and-theming)を参照してください。
+
+## v0.6.0
+
+`src/` に置けるものが `.tsx` だけではなくなりました。`.csv` / `.xlsx` はそのまま表として
+読めるページになり、`<name>.slide.tsx` はスライドデッキになります。どちらもナビに
+ダッシュボードのページと同格で並びます。
+
+### 追加
+
+- **`.csv` / `.xlsx` がページになります。** `src/data/june.xlsx` を置いて `/data/june` を
+  開くと、ダウンロードせずブラウザ上で表として読めます。URL の作り方は `.tsx` と同じ
+  (`index.csv` はディレクトリにマップ)で、`vantage routes` にも `useRoutes()` のナビにも
+  同格で並びます。xlsx は複数シートを切り替えられ、元ファイルのダウンロード導線も付きます。
+
+  タイトルはファイル名から導かれます(`june.xlsx` → 「June」)。パースはブラウザで行われるので、
+  dev・ビルド後・デプロイ後で同じ URL が同じものを返します。数式・グラフ・セル書式は
+  再現されません(値として読めれば十分、という設計)。ページにしたくないファイルは `_` を
+  前置してください。
+
+  ビューアは**表計算ソフトの見た目**です —— 列は A / B / C、左に行番号、ファイルの 1 行目は
+  ヘッダとして固定、シートのタブは下端、罫線はデータの外まで続きます。読み取り専用で、
+  ツールバーもソートもありません(セルを選んで `Cmd/Ctrl+C` でコピーはできます)。
+
+- **`@squadbase/vantage/table` サブパスを追加しました。** ファイルページを描いている表ビューア
+  そのものです。`FilePageView` を直接使えば、`_` を前置してルート化を止めたファイルを自分の
+  `definePage` 付きのページから描けます(`TableViewer` はパース済みの 1 シート、`SheetGrid` は
+  グリッド本体)。
+
+- **`<name>.slide.tsx` がスライドデッキになります。** `.slide` はページ種別サフィックスで、
+  URL には出ません(`src/june.slide.tsx` → `/june`)。中身は `<SlideDeck>` を返す普通の React
+  コンポーネントなので、`definePage` もナビも通常のページと同じように効きます。
+
+  1920×1080 の固定キャンバスに絶対 px で書き、画面サイズに合わせて縮小されます。キーボードと
+  クリックで送れ、現在位置は `?p=` として URL に入り、ツールバーから **pptx を書き出せます**。
+  書き出しは各スライドを画像として焼くので、受け取り側にフォントが要らず日本語も欠けません。
+
+  見え方は読み手が 3 通りから選べます — **一覧 + スライド**(既定。左にサムネイル列)、
+  **スライドのみ**(`L` で一覧を閉じる)、**全画面**(`F`。一覧は退く)。一覧の開閉は `?rail=` に
+  入るのでその状態のリンクも共有できます。閉じた状態から始めたいデッキだけ
+  `<SlideDeck rail={false}>` と書きます(`embedded` は既定で閉)。
+
+- **`@squadbase/vantage/slide` サブパスを追加しました。** `SlideDeck`・`Slide`・`Steps`・`Step`・
+  `MorphElement`・`useSlideNumber`・`useIsActiveSlide`。段階表示、ページ間トランジション、
+  2 枚にまたがる同一要素のモーフ(Keynote の「マジックムーブ」相当)を含みます。ランタイムは
+  [open-slide](https://github.com/1weiho/open-slide)(MIT)から移植したもので、帰属は
+  パッケージ同梱の `NOTICE` にあります。
+
+- **`vantage-slide` skill を同梱しました。** キャンバスの縦方向の予算の取り方、タイプスケール、
+  段階表示、トランジションの設計原則、モーフの規則、pptx 書き出しが壊れる条件。配置は他の
+  skill と同じ `vantage add skill --all`。
+
+- **`--slide-*` テーマトークンを追加しました。** 既定はアプリ自身のトークンへの別名なので、
+  デッキは何もしなくてもライト / ダークに追従します。`<SlideDeck theme={{ … }}>` でデッキ単位に
+  上書きできます。
+
+- **静的診断が 3 つ増えました**(合計 11: エラー 7・警告 4)。`UNSUPPORTED_PAGE_FILE`(警告 ―
+  ビューアの無い拡張子はルートにならないので、置いても出てこない理由を告げる)、
+  `FILE_PAGE_TOO_LARGE`(警告 ― 25MB 超)、`INVALID_PAGE_VARIANT`(エラー ―
+  `_layout.slide.tsx` のように、ルートにならないファイルにサフィックスが付いている)。
+
+- **`AGENTS.md` を「地図」+ `agents/*.md`(種類ごとの知識ファイル)に分割しました。** 通常
+  ページ・API・スライド・xlsx・csv のそれぞれに 1 ファイル(`agents/page.md` /
+  `agents/api.md` / `agents/slide.md` / `agents/xlsx.md` / `agents/csv.md`)があり、
+  `AGENTS.md` は不変条件と「何を書くか → どのファイルを読むか」の索引表だけを持ちます。
+  書こうとしている種類のファイルだけを読めば済むぶん、エージェントが最初に読み込む量が
+  減ります。`vantage add agents` はこのセット一式をアプリルート(`AGENTS.md` + `agents/`)へ
+  配置し、`vantage upgrade` はまとめて再同期します(バンドルに無いファイルは消しません)。
+
+- **`DESIGN.md` と `vantage-design` skill を追加しました。** プロジェクトルートの `DESIGN.md` に
+  見た目の意図(配色の役割・チャート・書体・レイアウト)をトークン名で書いておくと、エージェントは
+  UI を書く前にそれを読みます(`AGENTS.md` / `agents/page.md` / `agents/slide.md` に案内を追加)。
+  `DESIGN.md` はユーザーの持ち物で、`vantage upgrade` は触りません。「ブランドに合わせて」などの
+  依頼は `vantage-design` skill が `DESIGN.md` と `styles.css` をまとめて更新します。
+
+### 変更
+
+- `useRoutes()` が返す `RouteInfo` に **`kind`**(`"module"` | `"file"`)と
+  **`variant`**(`"slide"`)が増えました。ナビをダッシュボード / スライド / データで分けたり、
+  種類ごとにアイコンを変えたりできます。既存のナビのコードは変更なしで動きます。
+- `vantage routes` がファイルページとスライドを種類つきで表示するようになりました
+  (`--json` にも `kind` / `variant` / `unrouted` が出ます)。
+
 ## v0.5.3
 
 Squadbase の Project Storage をブラウザから扱うための Skill を同梱しました。`^0.5.0` を

package/docs/ja/cli-reference.md

@@ -13,11 +13,11 @@
 | `vantage preview` | 本番ビルドをローカルで起動（fullstack は既定 `:4173`、spa は Vite プレビュー） |
 | `vantage check` | 静的検査（ルート・境界・禁止ファイル）。エラーがあれば exit 1 |
 | `vantage routes` | ページ + API の URL マップを表示（`--pages` / `--apis` で片側だけ、`--detail` で仕様つき） |
-| `vantage add <kind> <name>` | `page` / `api` / `ui` / `block` / `skill` / `agents` を雛形生成・配置（`--force` で上書き、`skill` は配置済みを走査してスキップ・`--dir` で配置先を指定） |
+| `vantage add <kind> <name>` | `page` / `api` / `ui` / `block` / `skill` / `agents`(`AGENTS.md` + `agents/*.md`)を雛形生成・配置（`--force` で上書き、`skill` は配置済みを走査してスキップ・`--dir` で配置先を指定） |
 | `vantage docs [name]` | 同梱のガイド + コンポーネントリファレンスを表示 |
 | `vantage search <query>` | 同じリファレンスを全文検索（自然言語 or `--regex`） |
 | `vantage doctor` | 環境・インストールの健全性を診断 |
-| `vantage upgrade` | 生成成果物を再生成し、配置済みの `AGENTS.md` を正本から同期 |
+| `vantage upgrade` | 生成成果物を再生成し、配置済みの `AGENTS.md` + `agents/*.md` を正本から同期 |
 
 ## クイックモード（パスを直接渡す）
 
@@ -351,6 +351,35 @@ vantage dev --strict-port                  # 5173 が取れなければ起動し
 > また fullstack の `preview` は Node サーバーを 1 ポートに bind するだけなので**常に厳格**で、
 > `--no-strict-port` は効きません。
 
+## `--host` / `--allowed-hosts` — リバースプロキシの後ろで動かす
+
+`vantage dev` と `vantage preview`(SPA)は、既定では `localhost` にしか bind せず、`Host` ヘッダが
+`localhost` か bind したアドレス以外のリクエストを **403 で拒否**します(Vite の DNS リバインディング
+対策)。サンドボックスのプレビュープロキシ・トンネル・コンテナのネットワークなど、**別のホスト名で
+前に立つもの**があるときは、この 2 つを組み合わせて通します。
+
+```bash
+vantage dev --host                              # すべてのインターフェースで listen
+vantage dev --host 0.0.0.0                      # アドレスを明示(--host=:: の形も可)
+vantage dev --allowed-hosts preview.example.com # プロキシが名乗るホスト名を許可(カンマ区切りで複数)
+vantage dev --allowed-hosts true                # Host の検査そのものを無効化
+```
+
+| フラグ | 意味 |
+|---|---|
+| `--host [addr]` | 値なしなら**すべてのインターフェース**、値があればそのアドレスに bind する(Vite の `server.host`)|
+| `--allowed-hosts <list\|true>` | 受け付ける `Host` ヘッダの一覧(カンマ区切り)。`true` で検査を無効化(Vite の `server.allowedHosts`)|
+
+`--allowed-hosts` は環境変数 **`VANTAGE_ALLOWED_HOSTS`** でも渡せます(同じ書式)。サーバーを起動する
+側の仕組みがホスト名を知っている場合はそちらが便利です。フラグと環境変数の両方があれば**フラグが
+勝ちます**。どちらも無ければ Vite の既定のままで、これまでどおり `localhost` だけを受け付けます。
+
+> [!NOTE]
+> `--host` の値は次のトークンを取ります。`vantage --host dev` のように直後にコマンドやパスが来る
+> 書き方は値と取り違えるので、その場合は `--host=<addr>` か、末尾に `--host` を置いてください。
+> fullstack の `preview` は Node サーバーがすべてのインターフェースで listen し `Host` を検査しない
+> ので、どちらのフラグも効きません(その旨が表示されます)。
+
 ## dev のブラウザ出力 — 転送とオーバーレイ
 
 `vantage dev` は、ブラウザ側で起きたことを**開発ターミナルへ転送します**。既定で転送するのは
@@ -411,7 +440,7 @@ VANTAGE_PROFILE=1 vantage dev
 
 ## 静的診断（`check`）
 
-`vantage check` が検出する診断は次の 8 種類です（エラー 6・警告 2）。
+`vantage check` が検出する診断は次の 13 種類です（エラー 7・警告 6）。
 
 | コード | 深刻度 | 意味 |
 |---|---|---|
@@ -421,11 +450,18 @@ VANTAGE_PROFILE=1 vantage dev
 | `MISSING_DEFAULT_EXPORT` | エラー | ページに default export がない |
 | `INVALID_API_EXPORT` | エラー | API が有効な HTTP メソッドをエクスポートしていない |
 | `CLIENT_IMPORTS_SERVER` | エラー | クライアントが `server/` から import している |
+| `INVALID_PAGE_VARIANT` | エラー | `.slide` などのページ種別サフィックスが、ルートにならないファイルに付いている（`_layout.slide.tsx` など） |
 | `SUSPICIOUS_ROUTE_DIR` | 警告 | `pages/`・`app/`・`utils/` など、足場に見えるディレクトリ名が URL に出ている |
 | `PUBLIC_ENV_MISUSE` | 警告 | クライアントが `PUBLIC_` 以外の env を読んでいる |
+| `UNSUPPORTED_PAGE_FILE` | 警告 | ビューアの無い拡張子（`.xls`・`.ods` など）を置いている。ルートにならない |
+| `FILE_PAGE_TOO_LARGE` | 警告 | データファイルページが 25MB を超えている。そのページはエラー表示になる |
+| `HARDCODED_COLOR` | 警告 | `.ts`/`.tsx` に色を直書きしている（`#hex`・`rgb()`/`hsl()`/`oklch()` など・`bg-[#…]`・`bg-blue-500` などの Tailwind パレット）。ファイルごとに `path:行` と置き換え候補のトークンを出す |
+| `DESIGN_MD_TOO_LONG` | 警告 | ルートの `DESIGN.md` が 150 行を超えている。実値は `styles.css` に置き、トークン名で参照する |
 
 いずれもユーザーコードを import・実行しません（純粋に静的な検査です）。
 
+`HARDCODED_COLOR` は `.css` を見ません（値の置き場は `styles.css`）。地図の塗り分けのように色がデータの意味を持つ場合は、その行か直前の行に `// vantage-ignore-color`（JSX 内は `{/* vantage-ignore-color */}`）を付けると除外されます。ファイルごと除外するには先頭 5 行以内に `vantage-ignore-color-file` を書きます。
+
 ## 生成物と成果物
 
 `dist/` の中身:
@@ -447,4 +483,5 @@ dist/
 ページ・API・UI を足していってください。
 
 AI エージェントに手順ごと渡したいときは、同梱の [エージェントと Skills](agent-skills) を
-`vantage add skill` で、アプリの地図となる `AGENTS.md` を `vantage add agents` で配置してください。
+`vantage add skill` で、アプリの地図となる `AGENTS.md` と種類ごとの知識ファイル `agents/*.md` を
+`vantage add agents` で配置してください。

package/docs/ja/pages-and-metadata.md

@@ -43,6 +43,23 @@ export default function MonthlyAnalysis() {
 > `export const page = definePage({...})` の**エクスポート名は `page` 固定**です。別名にすると
 > メタデータが読まれません。
 
+## データファイルページのタイトル
+
+`.csv` / `.xlsx` の[ファイルページ](routing#tsx-以外もページになる)に `definePage` は書けないので、
+タイトルは**ファイル名から導かれます**。
+
+| ファイル | `title` |
+|---|---|
+| `june.xlsx` | `June` |
+| `sales_by_region.csv` | `Sales By Region` |
+| `salesByRegion.csv` | `Sales By Region` |
+| `kpi/index.csv` | `KPI`（`index` はディレクトリ名を借りる。全大文字は略語とみなして保つ） |
+| ルート直下の `index.csv` | なし（`definePage` の無いルート `index.tsx` と同じ） |
+
+`navLabel` は設定されないので、ナビの表示名も同じ値になります。名前を変えたいときは
+**ファイルをリネーム**するか、`_` を前置してルート化を止め、tsx から `FilePageView` で描いて
+そこに `definePage` を書きます。
+
 ## Fast Refresh との関係
 
 `page` のような非コンポーネントのエクスポートがあっても、Vantage はそれを内部で扱うため

package/docs/ja/routing.md

@@ -1,6 +1,6 @@
 # ファイルベースルーティング
 
-> ファイルを置くだけでルートが生まれる。ページ・レイアウト・動的パラメータ・404/error の規約。
+> ファイルを置くだけでルートが生まれる。ページ・レイアウト・動的パラメータ・404/error の規約と、tsx 以外のページ（csv / xlsx / スライド / ドキュメント）。
 
 Vantage のルーティングは **ファイルの配置がそのまま URL** になります。ルーターの設定は書きません。
 
@@ -35,11 +35,102 @@ Vantage のルーティングは **ファイルの配置がそのまま URL**
 | `_layout.tsx` | そのディレクトリ配下のレイアウト（入れ子可） |
 | `_404.tsx` | not-found の UI（**ルートのみ**） |
 | `_error.tsx` | error の UI（**ルートのみ**） |
+| `monthly-report.slide.tsx` | `/monthly-report`（スライドデッキ） |
+| `june-summary.doc.tsx` | `/june-summary`（ドキュメント） |
+| `sales-export.csv` | `/sales-export`（表として描かれる） |
+| `data/june.xlsx` | `/data/june`（同上） |
 
 - `[name]` → 動的パラメータ、`[...name]` → catchall。
 - `index` は自身のディレクトリにマップ（名前は URL から落ちる）。
 - `_` で始まるファイルは予約（`_layout`/`_404`/`_error`）またはプライベート（ルーティングされない）。
 
+## tsx 以外もページになる
+
+ルートになるのは `.tsx` / `.jsx` だけではありません。**`.csv` と `.xlsx`** はそのまま表として
+読めるページになり、**`<name>.slide.tsx`** はスライドデッキに、**`<name>.doc.tsx`** はドキュメントになります。どれも URL の作り方は
+tsx と同じで、`vantage routes` にも `useRoutes()` のナビにも同格で並びます。
+
+### データファイル（`.csv` / `.xlsx`）
+
+`src/data/june.xlsx` を置いて `/data/june` を開くと、ダウンロードせずブラウザ上で表として
+読めます。xlsx は複数シートを切り替えられ、元ファイルをダウンロードする導線も付きます。
+
+描かれるのは**表計算ソフトそのものの見た目**です —— 列は A / B / C、左に行番号、ファイルの
+1 行目はヘッダとして固定され、罫線はデータの外まで続きます。シートのタブは下端に並びます。
+読み取り専用なので編集もソートもできません(セルを選んで `Cmd/Ctrl+C` でコピーはできます)。
+並べ替えや絞り込みが要るデータは、`server/api/` から配って `DataTable` で描いてください。
+
+- **タイトルはファイル名から導かれます**（`june.xlsx` → 「June」、`index.csv` はディレクトリ名）。
+  データファイルに `definePage` は書けないので、名前を変えたいときはファイルをリネームします。
+- **パースはブラウザで行われます。** dev・ビルド後・デプロイ後で同じコードが同じバイトを読むので、
+  同じ URL が同じものを返します。25MB を超えるファイルはそのページにエラーが出ます
+  （`vantage check` が `FILE_PAGE_TOO_LARGE` で先に警告します）。
+- 数式・グラフ・セル書式は再現されません。**値として読めれば十分**という設計です。
+- ページにしたくないファイルは `_` を前置します（`_june.xlsx`）。tsx から自分で描きたいときは
+  こうしてルート化を止め、`@squadbase/vantage/table` の `FilePageView` を使います。
+
+> [!WARNING]
+> **ビューアの無い拡張子はルートになりません。** `.xls` / `.ods` / `.tsv` などを置いても
+> 404 にすらならず、ナビにも `vantage routes` にも出ません。`vantage check` の
+> `UNSUPPORTED_PAGE_FILE` 警告が唯一の告知点です。
+
+### スライド（`.slide.tsx`）
+
+`.slide` は**ページ種別サフィックス**で、URL には出ません（`src/june.slide.tsx` → `/june`）。
+中身は `<SlideDeck>` を返す普通の React コンポーネントなので、`definePage` もナビも
+通常のページと同じように効きます。
+
+```tsx
+import { definePage } from "@squadbase/vantage";
+import { Slide, SlideDeck } from "@squadbase/vantage/slide";
+
+export const page = definePage({ title: "6月度レビュー", navLabel: "6月度" });
+
+export default function Deck() {
+  return (
+    <SlideDeck>
+      <Slide>…</Slide>
+      <Slide>…</Slide>
+    </SlideDeck>
+  );
+}
+```
+
+1920×1080 の固定キャンバスに書き、画面サイズに合わせて縮小されます。キーボードとクリックで
+送れ、左のスライド一覧は `L` で開閉、`F` で全画面、ツールバーから pptx を書き出せます。詳しくは
+[UI とテーマ](ui-and-theming)。
+
+> [!WARNING]
+> `.slide` を付けられるのは**ルートになるページモジュールだけ**です。`_layout.slide.tsx` や
+> `deck.slide.ts` は `INVALID_PAGE_VARIANT` エラーになります。また `june.slide.tsx` と
+> `june.tsx`、`sales.csv` と `sales.tsx` はいずれも同じ URL に解決するので `ROUTE_CONFLICT` です。
+
+### ドキュメント（`.doc.tsx`）
+
+`.doc` も**ページ種別サフィックス**です（`src/june-summary.doc.tsx` → `/june-summary`）。上から下へ
+読む文章のページで、中身は `<Document>` を返す普通の React コンポーネントです。
+
+```tsx
+import { definePage } from "@squadbase/vantage";
+import { Document } from "@squadbase/vantage/doc";
+
+export const page = definePage({ title: "6月度サマリー" });
+
+export default function JuneSummary() {
+  return (
+    <Document>
+      <h1>6月度サマリー</h1>
+      <p>6月の売上は目標を 5% 上回りました。</p>
+      <table>…</table>
+    </Document>
+  );
+}
+```
+
+`<Document>` の中の見出し・段落・リスト・表・引用・コードには、クラスを書かなくてもスタイルが
+当たります。詳しくは [UI とテーマ](ui-and-theming)。`.slide` と同じく、`.doc` を付けられるのは
+ルートになるページモジュールだけです。
+
 ## ルーティングされないディレクトリ
 
 次のディレクトリは（どの階層でも）決して走査されません。ここには自由にコードを置けます。
@@ -149,6 +240,8 @@ export default function RootLayout() {
 | `index` | `boolean` | ディレクトリの index ルートか |
 | `label` | `string` | `navLabel` → `title` → `path` の順で決まる表示名 |
 | `title` / `description` / `navLabel` | `string \| undefined` | [`definePage`](pages-and-metadata) の値 |
+| `kind` | `"module" \| "file"` | 何から描かれるか。`"file"` は `.csv` / `.xlsx` |
+| `variant` | `"slide" \| "doc" \| undefined` | ページ種別サフィックス |
 
 `useCurrentRoute()` は今表示中のルートを返します（404 のときは `undefined`）。
 上の例のような「現在地」判定のほか、パンくずやページ見出しに使えます。
@@ -188,8 +281,10 @@ setSegments((prev) => [...prev, "enterprise"]);
 
 ## HMR とルート再生成
 
-`.tsx` ページや `server/api` ファイルを追加・削除すると、開発サーバーがルートを再生成して
-フルリロードします。ページ本体を編集した場合は React Fast Refresh がその場で反映します。
+`.tsx` ページ・データファイル・`server/api` ファイルを追加・削除すると、開発サーバーがルートを
+再生成してフルリロードします。ページ本体を編集した場合は React Fast Refresh がその場で反映します。
+`.csv` / `.xlsx` は**中身を書き換えたときもフルリロード**します（実行時に固定 URL から取得される
+ので、モジュールグラフは変化しないためです）。
 
 ## 次に読む
 

package/docs/ja/ui-and-theming.md

@@ -40,6 +40,106 @@ export default function Overview() {
 
 各コンポーネントの props と使い方は [コンポーネント](components) タブにまとめてあります。
 
+## 専用サブパスの UI
+
+重い依存を持つ 3 つは、使うアプリだけが取り込むよう別サブパスに隔離してあります。
+
+| サブパス | 何が入っているか |
+|---|---|
+| `@squadbase/vantage/markdown` | `MarkdownRenderer`（Shiki の全言語文法を引き込むため隔離） |
+| `@squadbase/vantage/table` | `TableViewer` / `FilePageView`（csv・xlsx のパーサを動的 import） |
+| `@squadbase/vantage/slide` | スライドのプリミティブ（pptx 書き出しを動的 import） |
+
+`/components` の barrel に混ぜると、`DataTable` を使うだけのアプリにも import の辺ができて
+バンドラが落とせなくなるためです。
+
+### 表ビューア（`/table`）
+
+`.csv` / `.xlsx` を `src/` に置けば[自動でページになります](routing)。自分でタイトルを付けたい、
+ダッシュボードの一部として表を埋めたい、といったときだけ直接使います。
+
+```tsx
+import { FilePageView, TableViewer, SheetGrid, loadWorkbook } from "@squadbase/vantage/table";
+```
+
+| 名前 | 役割 |
+|---|---|
+| `FilePageView` | ファイルページそのもの。URL を渡すと取得・パース・表示まで面倒を見る |
+| `TableViewer` | 1 シートを枠付きで描く（ビューポートの残りを埋め、下端にシートタブと行数） |
+| `SheetGrid` | 表計算ソフトのグリッド本体。高さの決まった親の中に置く |
+| `loadWorkbook` | URL → パース済みのシート配列 |
+
+見た目は**表計算ソフトそのもの**です —— 列は A / B / C、左に行番号、ファイルの 1 行目は
+ヘッダとして固定、罫線はデータの外まで続きます。読み取り専用で、ツールバーもソートも
+ページネーションもありません（セルを選んで `Cmd/Ctrl+C` でコピーはできます）。並べ替えや
+絞り込みが要るなら、それは表ビューアではなく [`DataTable`](parts/data-table) の
+仕事です。配色はアプリのテーマトークンで塗られるので、ダークモードにも追従します。
+
+### スライド（`/slide`）
+
+`<name>.slide.tsx` を[置くとスライドデッキのページになります](routing)。
+
+```tsx
+import {
+  MorphElement, Slide, SlideDeck, Step, Steps, useSlideNumber,
+} from "@squadbase/vantage/slide";
+```
+
+| 名前 | 役割 |
+|---|---|
+| `SlideDeck` | デッキの器。`theme` でトークンを上書き、`embedded` でページ内に埋め込む、`rail={false}` で一覧を閉じた状態から始める |
+| `Slide` | 1 枚。`transition` で enter / exit を宣言する |
+| `Steps` / `Step` | 段階表示。`→` で 1 つずつ開く |
+| `MorphElement` | 2 枚にまたがる同一要素を連続して動かす（同じ `id` を両方に付ける） |
+| `useSlideNumber` | `{ current, total }`。ページ番号のフッター用 |
+| `useIsActiveSlide` | 聴衆が見ているインスタンスかどうか。入場アニメーションの門番に使う |
+
+読み手は見え方を 3 通りに切り替えられます — **一覧 + スライド**（既定。左にサムネイル列）、
+**スライドのみ**（`L` で一覧を閉じ、表示領域いっぱいに描く）、**全画面**（`F`。一覧は退く）。
+どれもコードでは決めず、開閉の状態は `?rail=` に入るのでその状態のリンクを共有できます。
+閉じた状態から始めたいデッキだけ `<SlideDeck rail={false}>` と書きます（`embedded` は既定で閉）。
+サムネイル列はデッキ自身の `--slide-bg` / `--slide-fg` の混色だけで塗られるので、色味を持たず
+デッキのテーマにそのまま馴染みます。
+
+スライドは **1920×1080 の固定キャンバス**に絶対 px で書き、画面サイズに合わせて縮小されます。
+配色と書体は `--slide-*` トークン（下の「テーマトークン」と同じ仕組みで、既定はアプリのトークンへの
+別名なので**ダークモードにも自動で追従します**）。
+
+書き方の作法 — キャンバスの縦方向の予算、タイプスケール、トランジションの設計原則、モーフの規則、
+pptx 書き出しが壊れる条件 — は同梱の **`vantage-slide` スキル**にあります
+（[エージェント Skill](agent-skills)）。
+
+> [!NOTE]
+> スライドの中で `@squadbase/vantage/ui` のプリミティブを使わないでください。UI キットは rem と
+> Tailwind でダッシュボード向けに組まれているので、1920×1080 を縮小投影すると `text-sm` のボタンは
+> 実効 8px 程度になって読めません。
+
+## ドキュメント（`/doc`）
+
+`<name>.doc.tsx` を[置くとドキュメントのページになります](routing)。`Document` で包むと、中に
+書いた素の HTML 要素（`h1`〜`h4`・`p`・`ul`/`ol`・`table`・`blockquote`・`pre`/`code`・`hr`・`a`・
+`figure`/`figcaption`・`img`）に見出しの大きさ・余白・罫線が当たります。チャートは
+[`EChart`](parts/echart) をそのまま文中に置けます。
+
+```tsx
+import { Document } from "@squadbase/vantage/doc";
+```
+
+配色・書体・本文の幅は `--doc-*` トークンで、既定はアプリのトークンへの別名なので
+**ダークモードにも自動で追従します**。
+
+| トークン | 既定 | 何に効くか |
+|---|---|---|
+| `--doc-fg` / `--doc-muted` | `--foreground` / `--muted-foreground` | 本文 / 引用・キャプション |
+| `--doc-accent` | `--primary` | リンク |
+| `--doc-border` / `--doc-subtle` | `--border` / `--muted` | 罫線 / コード・表の見出し行の背景 |
+| `--doc-font-body` / `--doc-font-heading` / `--doc-font-mono` | アプリの書体 | 本文 / 見出し / コード |
+| `--doc-size-body` / `--doc-line-height` / `--doc-max-width` | `1rem` / `1.8` / `48rem` | 文字サイズ / 行間 / 本文の幅 |
+
+アプリ全体では `styles.css` の `:root` で、1 つのドキュメントだけなら
+`<Document theme={{ accent: "#2563eb" }}>` で上書きします。要素に `className` で Tailwind
+ユーティリティを付けると、既定のスタイルより優先されます。
+
 ## Tailwind はそのまま使える
 
 `className` に Tailwind ユーティリティを書くだけで効きます。`tailwind.config` も `postcss.config`

package/package.json

@@ -1,18 +1,18 @@
 {
   "name": "@squadbase/vantage",
-  "version": "0.5.3",
+  "version": "0.6.1-dev.2d25e94",
   "description": "Data dashboard framework for Squadbase Editor. Vite-powered, config-free, one-file first.",
   "type": "module",
   "license": "MIT",
   "author": "Squadbase",
-  "homepage": "https://github.com/squadbase/vantage-framework/tree/main/packages/vantage#readme",
+  "homepage": "https://github.com/squadbase/squadbase-monorepo/tree/main/packages/vantage#readme",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/squadbase/vantage-framework.git",
+    "url": "git+https://github.com/squadbase/squadbase-monorepo.git",
     "directory": "packages/vantage"
   },
   "bugs": {
-    "url": "https://github.com/squadbase/vantage-framework/issues"
+    "url": "https://github.com/squadbase/squadbase-monorepo/issues"
   },
   "keywords": [
     "vantage",
@@ -25,10 +25,11 @@
     "tanstack"
   ],
   "engines": {
-    "node": ">=20"
+    "node": ">=22"
   },
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
   },
   "bin": {
     "vantage": "./dist/cli.js"
@@ -58,6 +59,18 @@
       "types": "./dist/markdown/index.d.ts",
       "default": "./dist/markdown/index.js"
     },
+    "./table": {
+      "types": "./dist/table/index.d.ts",
+      "default": "./dist/table/index.js"
+    },
+    "./slide": {
+      "types": "./dist/slide/index.d.ts",
+      "default": "./dist/slide/index.js"
+    },
+    "./doc": {
+      "types": "./dist/doc/index.d.ts",
+      "default": "./dist/doc/index.js"
+    },
     "./server": {
       "types": "./dist/server/index.d.ts",
       "default": "./dist/server/index.js"
@@ -83,7 +96,8 @@
     "theme.css",
     "registry",
     "skills",
-    "templates"
+    "templates",
+    "NOTICE"
   ],
   "scripts": {
     "build": "node scripts/build-docs.mjs && node scripts/build.mjs",
@@ -93,7 +107,12 @@
     "dev": "tsup --watch --no-dts",
     "dev:types": "tsc --noEmit --watch",
     "typecheck": "tsc --noEmit",
-    "prepublishOnly": "node scripts/build-docs.mjs && node scripts/build.mjs"
+    "type-check": "tsc --noEmit",
+    "prepublishOnly": "node scripts/build-docs.mjs && node scripts/build.mjs",
+    "release": "npm publish --@squadbase:registry=https://registry.npmjs.org",
+    "site:install": "npm --prefix site install",
+    "site:dev": "npm --prefix site run dev",
+    "site:build": "npm --prefix site run build"
   },
   "dependencies": {
     "@base-ui/react": "^1.6.0",
@@ -110,10 +129,14 @@
     "date-fns": "^4.1.0",
     "echarts": "^6.0.0",
     "esbuild": "^0.28.1",
-    "hono": "^4.12.30",
+    "fflate": "^0.8.3",
+    "hono": "^4.13.5",
+    "html-to-image": "^1.11.13",
     "lucide-react": "^0.468.0",
+    "papaparse": "^5.7.0",
     "picocolors": "^1.1.1",
     "react-day-picker": "^10.0.1",
+    "read-excel-file": "^9.3.10",
     "streamdown": "^2.5.0",
     "tailwind-merge": "^3.0.0",
     "tailwindcss": "^4.3.2",
@@ -126,6 +149,7 @@
   },
   "devDependencies": {
     "@types/node": "^22.10.0",
+    "@types/papaparse": "^5.5.2",
     "@types/react": "^19.2.0",
     "@types/react-dom": "^19.2.0",
     "react": "^19.2.7",

package/skills/vantage-app/SKILL.md

@@ -75,6 +75,10 @@ vantage add skill  # 配置済みの skill(このファイルの仲間)と、そ
 - 共通の枠(ヘッダ・サイドバー)は `_layout.tsx`、Not Found と例外は `_404.tsx` / `_error.tsx`。
 - 一覧 → 詳細を作るなら、**動的パラメータの「3 つの綴り」を先に決めてから**両方のファイルを
   書く。後から変えると静かにマッチしなくなる。
+- **ページになるのは tsx だけではない。** `.csv` / `.xlsx` を `src/` に置けば表として読めるページに
+  なり、`<name>.slide.tsx` はスライドデッキになる(どちらもナビに同格で並ぶ)。ダッシュボード・
+  スライド・データを 1 つのアプリに並べたいときは、まずこの 2 つで足りないか考える —— 表を出すために
+  ページを書く必要は無い。スライドの書き方は `vantage-slide` スキル。
 
 ## Step 3 — データを繋ぐ