@aiquants/spreadsheet 0.15.0 → 0.16.1

package/src/grid/GridBody.tsx

@@ -28,6 +28,14 @@
  * helper (ADR-31 — no package CSS; capability absent ⇒ O(1) false ⇒ keys absent ⇒ the DOM
  * stays byte-identical).
  *
+ * Accessibility structure (v0.16): the body wrapper is the ONE `role="grid"` element (row / column counts, its name
+ * from `labelledBy` or the built-in root label, `aria-readonly` from `readOnly`; no `aria-multiselectable`, since no
+ * cell carries `aria-selected` — the live region announces the selection), so the frozen leading,
+ * scrolling and frozen trailing panes VirtualGrid draws inside it are all owned by it; the scrolling pane's content
+ * element is the body `rowgroup`, the cells of the first `headerRows` rows are `columnheader` (`data-aqsp-header-row`),
+ * and both scroll bars are declared pointer-only (`enableArrowButtonTabStops: false` — the grid owns keyboard
+ * scrolling), so no `scrollbar` / `button` becomes a child of the grid.
+ *
  * UI chrome locale: the resolved `locale` and the value-stable engine subset `scrollLabels` are
  * forwarded to VirtualGrid, which localizes the embedded vertical bar, the horizontal bar and the
  * degenerate-band "No items" — no lang attribute, no new data-* hook.
@@ -55,6 +63,13 @@
  * `aria-readonly="true"` + `data-aqsp-readonly=""` を `isReadOnlyCell` ヘルパ経由で条件スタンプ
  * する (ADR-31 — パッケージ CSS なし。能力未宣言 = O(1) false = キー不在 = DOM バイト同一)。
  *
+ * アクセシビリティの構造 (v0.16): 本体の包みが唯一の `role="grid"` (行数 / 列数・`labelledBy` か組み込みのルートの名前による
+ * 名前・`readOnly` からの `aria-readonly`。セルが `aria-selected` を持たないので `aria-multiselectable` は付けず、選択は
+ * live region が読み上げる) で、VirtualGrid がその中に描く先頭の凍結・スクロール・末尾の凍結の
+ * ペインを全て持つ。スクロールのペインの中身の要素は本体の `rowgroup`、先頭 `headerRows` 行のセルは `columnheader`
+ * (`data-aqsp-header-row`)、両方のスクロールバーはポインタ専用 (`enableArrowButtonTabStops: false` — キーボードのスクロールは
+ * グリッドが持つ) と宣言し、`scrollbar` / `button` をグリッドの子にしない。
+ *
  * UI クロームロケール: 解決済み `locale` と値安定なエンジン部分集合 `scrollLabels` を VirtualGrid へ
  * 素通しし、埋込み縦バー・横バー・退化帯の "No items" を現地化する (lang 属性・新規 data-* フックなし)。
  */
@@ -83,6 +98,15 @@ const ALIGN_ONLY_STYLES: Readonly<Record<CellAlign, CellStyle>> = Object.freeze(
     right: Object.freeze({ justifyContent: alignToJustify("right") }),
 })
 
+/**
+ * The scrolling pane's content element is the row group of the body rows; the `role="grid"` element is the body wrapper,
+ * which contains the frozen leading pane, the scrolling pane and the frozen trailing pane, so every row has the grid as
+ * an ancestor.
+ * スクロールするペインの中身の要素は本体の行の行グループ。`role="grid"` は本体の包みが持ち、先頭の凍結のペイン・スクロールの
+ * ペイン・末尾の凍結のペインを全て含むので、どの行もグリッドを祖先に持つ。
+ */
+const BODY_ROWGROUP_PROPS = Object.freeze({ role: "rowgroup" }) as { readonly role: "rowgroup" }
+
 /** Whole-Map clearing threshold of the canonical-JSON style intern (the CF memo's bound). / 正準 JSON style intern の全消去しきい値 (CF memo と同じ上限)。 */
 export const STYLE_INTERN_LIMIT = 4096
 
@@ -287,6 +311,14 @@ type GridBodyProps = {
     frozenTrailingColumns: number
     /** Trailing frozen rows (v0.9 — VirtualGrid frozenTrailingRows engine-validated pass-through; the row twin). / 末尾凍結行数 (v0.9 — frozenTrailingRows のエンジン検証素通し。行双子)。 */
     frozenTrailingRows: number
+    /** Leading rows whose cells are column headers (validated by the root against frozenRows). / セルが列の見出しになる先頭の行数 (root が frozenRows と照らして検証済み)。 */
+    headerRows: number
+    /** The id naming the grid (`aria-labelledby` of the `role="grid"` element), or undefined. / グリッドに名前を与える id (`role="grid"` の要素の `aria-labelledby`)。無ければ undefined。 */
+    labelledBy: string | undefined
+    /** The grid's own name (`aria-label`) when no `labelledBy` names it, else undefined. / `labelledBy` が無いときのグリッド自身の名前 (`aria-label`)。あれば undefined。 */
+    gridLabel: string | undefined
+    /** Whole-grid read-only (`aria-readonly` of the `role="grid"` element). / グリッド全体の読み取り専用 (`role="grid"` の要素の `aria-readonly`)。 */
+    readOnly: boolean
     renderCell?: (ctx: RenderCellContext) => ReactNode
     /** 2D scroll notification from the grid handle (the truth — §7-4). / グリッドハンドル発の 2 軸スクロール通知 (§7-4 の真実側)。 */
     onScroll: (position: { x: number; y: number }) => void
@@ -382,6 +414,10 @@ const GridBodyInner = ({
     frozenRows,
     frozenTrailingColumns,
     frozenTrailingRows,
+    headerRows,
+    labelledBy,
+    gridLabel,
+    readOnly,
     renderCell,
     onScroll,
     onRangeChange,
@@ -424,14 +460,14 @@ const GridBodyInner = ({
     const getRowHeight = useCallback((row: number) => rowAxis.sizeOf(row), [rowAxis])
     const getColWidth = useCallback((col: number) => colAxis.sizeOf(col), [colAxis])
     const getCell = useCallback((row: number, col: number) => adapter.getCellText(row, col), [adapter])
-    // ARIA コンテナ属性 (identity は行列数にのみ追随)。型は行側と同型の狭い contentProps
-    const contentProps = useMemo(() => ({ role: "grid", "aria-rowcount": adapter.rowCount, "aria-colcount": adapter.colCount, "aria-multiselectable": true }) as const, [adapter.rowCount, adapter.colCount])
     // 挙動オプション: 行木は identity 変化で再構築 (軸再構築追随)、列幅木も対称 + defaultColWidth
     // (§7-8 — サンプリング省略の Fenwick baseValue)。pointerDragInputs はペン / タッチのみ
     // (マウスドラッグは選択エンジンの所有)
     const behaviorOptions = useMemo(() => ({ enableKeyboardNavigation: false, pointerDragInputs: ["pen", "touch"] as const, resetOnGetItemHeightChange: true, resetOnGetColWidthChange: true, defaultColWidth: defaultColumnWidth }), [defaultColumnWidth])
     // タップサークル素通し (v0.10 §2.1): 未指定は undefined キー同乗 = エンジン宣言の不在信号
-    const scrollBarOptions = useMemo(() => ({ width: SPREADSHEET_SCROLLBAR_SIZE_PX, tapScrollCircleOptions }), [tapScrollCircleOptions])
+    // 矢印の Tab の止まり先は false: キーボードのスクロールはグリッド自身 (シンク) が持つので、バーはネイティブのスクロールバーと同じ
+    // ポインタ専用の部品になり (aria-hidden)、role="grid" の中に許されない子 (scrollbar・button) を作らない
+    const scrollBarOptions = useMemo(() => ({ width: SPREADSHEET_SCROLLBAR_SIZE_PX, tapScrollCircleOptions, enableArrowButtonTabStops: false }), [tapScrollCircleOptions])
     // 表示値書式の掛け金 (getCellProps が書き、同じセルの children が直後に消費 — 番兵は届かない座標)
     const displayLatchRef = useRef<DisplayLatch>({ row: -1, col: -1, value: undefined })
     /**
@@ -446,9 +482,10 @@ const GridBodyInner = ({
      */
     const getCellProps = useCallback(
         (row: number, col: number) => {
+            const isHeader = row < headerRows
             const base = {
                 // aria-rowindex は行ラッパーと重複出力 (合法な上位集合) — セル単独が AT に読まれた際の行文脈補助 (§10-1)
-                role: "gridcell",
+                role: isHeader ? "columnheader" : "gridcell",
                 "aria-rowindex": row + 1,
                 "aria-colindex": col + 1,
                 "data-aqsp-cell": "",
@@ -460,6 +497,7 @@ const GridBodyInner = ({
                 // 単一居住 — layer-2 census)。未宣言 = O(1) false = キー不在 = v0.9 と DOM バイト同一、
                 // 宣言ホストは塗りセル毎 1 述語読み (ADR-31 の登記コスト)
                 ...(isReadOnlyCell(adapter, row, col) ? { "aria-readonly": "true", "data-aqsp-readonly": "" } : {}),
+                ...(isHeader ? { "data-aqsp-header-row": "" } : {}),
             }
             // v0.12 ホスト属性の継ぎ目: resolveCellAttributes が予約キー (data-aqsp* / data-row /
             // data-col) と非 data-* を fail-fast 済みなのでパッケージ属性と衝突しない。未宣言は
@@ -477,7 +515,7 @@ const GridBodyInner = ({
             }
             return (rich.style === null ? { ...stamped, ...rich.attrs } : { ...stamped, ...rich.attrs, style: rich.style }) as HTMLAttributes<HTMLDivElement>
         },
-        [adapter, rowAxis, colAxis, cf],
+        [adapter, rowAxis, colAxis, cf, headerRows],
     )
     /** Row attribute surface — carries the engine event gate (data-aqsp-cells §6.4.3-1). / 行属性面 — エンジンのイベントゲート (data-aqsp-cells) を運ぶ。 */
     const getRowProps = useCallback(
@@ -518,11 +556,18 @@ const GridBodyInner = ({
     )
 
     return (
+        // biome-ignore lint/a11y/useSemanticElements: <table> を描けない — 行は VirtualGrid が 3 つのペインに仮想化して描き、表の構造要素の入れ子を作れないため、ARIA の grid で全ての行を包む
         <div
             ref={bodyRef}
             className="aqsp-body"
             data-aqsp-body=""
             data-testid={testId ? `${testId}-body` : undefined}
+            role="grid"
+            aria-rowcount={adapter.rowCount}
+            aria-colcount={adapter.colCount}
+            aria-label={gridLabel}
+            aria-labelledby={labelledBy}
+            aria-readonly={readOnly ? "true" : undefined}
             onPointerDownCapture={(event) => {
                 // バー帯の統合ゲート (§6.8-3 — v0.4 でスクロールバー 2 本ともグリッド内在化):
                 // セル領域 (data-aqsp-cells) 由来は選択エンジンの所有 — 素通し。それ以外 (縦バー /
@@ -574,7 +619,7 @@ const GridBodyInner = ({
                 getCell={getCell}
                 getCellProps={getCellProps}
                 getRowProps={getRowProps}
-                contentProps={contentProps}
+                contentProps={BODY_ROWGROUP_PROPS}
                 behaviorOptions={behaviorOptions}
                 scrollBarOptions={scrollBarOptions}
                 overscanRows={overscanRows}

package/src/header/resizeGates.ts

@@ -55,6 +55,40 @@ export const MAX_TRACK_SIZE_PX = 10_000
  */
 export const ROW_FANOUT_DIVISOR = 10
 
+/**
+ * The ratio of one keyboard resize step: the zoom ladder's 2^(1/4), so four presses double a track and four halve it,
+ * at every size.
+ * キーボードの寸法の 1 段の比。拡大率の段と同じ 2^(1/4) で、どの寸法でも 4 回で 2 倍、4 回で半分になる。
+ */
+const KEYBOARD_RESIZE_RATIO = 2 ** (1 / 4)
+
+/**
+ * The size one keyboard step gives a track (increaseColumnWidth / decreaseColumnWidth / increaseRowHeight /
+ * decreaseRowHeight): `size × 2^(1/4)` up and `size / 2^(1/4)` down, rounded to whole px, moving at least 1 px, never
+ * below 1 px (a step never hides a track) and never above MAX_TRACK_SIZE_PX. A track already at a bound keeps its size:
+ * a hidden track (0 px) stays hidden in both directions (only unhide restores it), and growing never shrinks a track a
+ * host made wider than MAX_TRACK_SIZE_PX.
+ * キーボードの 1 段がトラックに与える寸法。上は `size × 2^(1/4)`、下は `size / 2^(1/4)` を整数 px に丸め、少なくとも 1 px 動き、
+ * 1 px を下回らず (1 段でトラックを隠さない)、MAX_TRACK_SIZE_PX を超えない。端にあるトラックは寸法を保つ: 隠れたトラック (0 px)
+ * はどちらの向きでも隠れたまま (戻すのは再表示だけ)、ホストが MAX_TRACK_SIZE_PX より広くしたトラックを大きくする向きで縮めない。
+ *
+ * @param size - The track's current size in px. トラックの今の寸法 (px)。
+ * @param direction - 1 to grow, -1 to shrink. 大きくするなら 1、小さくするなら -1。
+ * @returns The new size in px. 新しい寸法 (px)。
+ */
+export const keyboardStepSize = (size: number, direction: 1 | -1): number => {
+    if (size <= 0) {
+        return size
+    }
+    if (direction > 0) {
+        if (size >= MAX_TRACK_SIZE_PX) {
+            return size
+        }
+        return Math.min(MAX_TRACK_SIZE_PX, Math.max(size + 1, Math.round(size * KEYBOARD_RESIZE_RATIO)))
+    }
+    return Math.max(1, Math.min(size - 1, Math.round(size / KEYBOARD_RESIZE_RATIO)))
+}
+
 /** One track-size entry of a resize batch (size in logical px, 0 = hidden). / リサイズバッチの 1 entry (論理 px、0 = 非表示)。 */
 export type ResizeEntry = { index: number; size: number }
 

package/src/header/useHeaderResize.ts

@@ -63,7 +63,7 @@ import type { ViewStore } from "../model/viewStore.ts"
 import type { ResizeGuide } from "../overlay/SelectionOverlay.tsx"
 import type { SelectionState } from "../selection/selectionState.ts"
 import type { SelectionEngine } from "../selection/useSelectionEngine.ts"
-import { gateResizeEntries, type ResizeEntry, ROW_FANOUT_DIVISOR, ROW_HIDDEN_LIMIT } from "./resizeGates.ts"
+import { gateResizeEntries, keyboardStepSize, type ResizeEntry, ROW_FANOUT_DIVISOR, ROW_HIDDEN_LIMIT } from "./resizeGates.ts"
 
 /** Autofit horizontal padding: cell padding 4+4 + right border 1 (px). / autofit の水平パディング (セル padding 4+4 + 右罫 1)。 */
 const AUTOFIT_PADDING = 9
@@ -97,6 +97,8 @@ type UseHeaderResizeParams = {
     adapter: SpreadsheetDataAdapter
     /** Autofit adoption condition: renderCell unspecified (custom DOM defeats measureText — §10 deviation). / autofit 採用条件 (renderCell 未指定)。 */
     autofitEnabled: boolean
+    /** Leading header rows (`headerRows`): autofit measures their cells in the stylesheet's header-row weight. / 先頭の見出しの行数 (`headerRows`)。autofit はそのセルをスタイルシートの見出し行の太さで測る。 */
+    headerRows: number
     defaultRowHeight: number
     defaultColumnWidth: number
     maxOperationCells: number
@@ -125,7 +127,7 @@ type UseHeaderResizeParams = {
  * cellPaint と同式) / フォント族を重ねる)。書式 object 毎に intern (塗り intern が書式毎に 1 object を
  * 保つので、異なりフォント毎に 1 文字列)。
  */
-const fontKeyOf = (painted: CellFormat, fontKeys: WeakMap<CellFormat, string>, bandStyle: CSSStyleDeclaration): string => {
+const fontKeyOf = (painted: CellFormat, fontKeys: WeakMap<CellFormat, string>, bandStyle: Pick<CSSStyleDeclaration, "fontStyle" | "fontWeight" | "fontSize" | "fontFamily">): string => {
     const cached = fontKeys.get(painted)
     if (cached !== undefined) {
         return cached
@@ -169,10 +171,26 @@ type ResizeGesture = {
 const guidePositionOf = (gesture: ResizeGesture, axisModel: AxisModel, pendingSize: number): number => (gesture.anchor === "trailing" ? axisModel.offsetOf(gesture.index) + gesture.initialSize - pendingSize : axisModel.offsetOf(gesture.index) + pendingSize)
 
 /**
- * Wires the resize/unhide machine onto both header bands; returns the §7.4 composite surface.
- * 両ヘッダー帯へリサイズ / unhide 機械を結線し、§7.4 の合成面を返す。
+ * The resize machine's surface: the §7.4 drag surface plus the keyboard twins of the strips, which resize through the
+ * same fan-out, gates and batch seam as a strip release. Both return whether the command ran: false only after a
+ * refusal through onOperationRejected (and for autofit while renderCell is set); a track already at a bound, an empty
+ * column or nothing to measure is a run that changes nothing (true).
+ * リサイズ機械の面。§7.4 のドラッグ面に、ストリップのキーボードの双子を加えたもの (ストリップの放しと同じファンアウト・
+ * ゲート・バッチの継ぎ目で寸法を変える)。どちらもコマンドが走ったかを返す: false は onOperationRejected で拒まれたとき
+ * (と renderCell がある間の autofit) だけで、端にあるトラック・全空列・測るものが無いときは何も変えずに走った (true)。
  */
-export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine => {
+export type HeaderResizeMachine = SelectionEngine & {
+    /** Grows (1) or shrinks (-1) track `index` by one keyboard step (keyboardStepSize), with the strip's fan-out. / トラック `index` を 1 段大きく (1) / 小さく (-1) する (keyboardStepSize。ストリップと同じファンアウト)。 */
+    stepTrack: (axis: "row" | "col", index: number, direction: 1 | -1) => boolean
+    /** Fits column `index` to its content, as the strip double-click does (false when renderCell is set). / 列 `index` を中身に合わせる (ストリップのダブルクリックと同じ。renderCell があれば false)。 */
+    autofitColumn: (index: number) => boolean
+}
+
+/**
+ * Wires the resize/unhide machine onto both header bands; returns the §7.4 composite surface with the keyboard twins.
+ * 両ヘッダー帯へリサイズ / unhide 機械を結線し、§7.4 の合成面とキーボードの双子を返す。
+ */
+export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMachine => {
     // paramsRef パターン: リスナーは結線 1 回、最新パラメータはレンダー毎にここへ写す
     const paramsRef = useRef(params)
     paramsRef.current = params
@@ -271,16 +289,17 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
      * 純関数ゲート (resizeGates.ts: 件数ゲート・丸め・§7.2 の押下トラック 0 化ガード・§5.4(b) の行軸
      * 非表示総数ゲート) を通してから resizeTracks を 1 回呼ぶ。拒否は onOperationRejected("resize")。
      */
-    const applyEntries = useCallback((axis: "row" | "col", rawEntries: readonly ResizeEntry[], pressedIndex: number | null): void => {
+    const applyEntries = useCallback((axis: "row" | "col", rawEntries: readonly ResizeEntry[], pressedIndex: number | null): boolean => {
         const p = paramsRef.current
         const axisModel = axis === "col" ? p.colAxis : p.rowAxis
         // ゲートは純関数 (§4.2.10 の委譲) — ヘッダー由来のサイズは常に有限 ≥ 0 なので RangeError 枝は到達しない
         const result = gateResizeEntries(axisModel, rawEntries, pressedIndex, { maxOperationCells: p.maxOperationCells, rowHiddenLimit: ROW_HIDDEN_LIMIT, axisKind: axis })
         if (!result.ok) {
             p.onOperationRejected?.("resize", result.count, result.reason)
-            return
+            return false
         }
         p.resizeTracks(axis, result.entries)
+        return true
     }, [])
 
     /** The up commit: same-value skip → fan-out targets → batch apply. / up 確定 (同値スキップ → ファンアウト → バッチ適用)。 */
@@ -306,11 +325,11 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
 
     /** Column autofit (§7.3 / v0.8 §4.2.10 / ADR-21): per-column canvas measurement over the union of both frozen bands and the visible window — `[0, R_eff) ∪ [rowStart, rowEnd] ∪ [rowCount − T_eff, rowCount)`, each filtered by sizeOf > 0 — in each cell's painted font, bucketed by font key. / 列 autofit (§7.3 / v0.8 §4.2.10 / ADR-21): 両凍結帯 + 可視ウィンドウの和集合 `[0, R_eff) ∪ [rowStart, rowEnd] ∪ [rowCount − T_eff, rowCount)` (各 sizeOf > 0) をセルの塗りフォントで計測、フォントキーでバケット化。 */
     const autofitColumns = useCallback(
-        (band: HTMLElement, pressedIndex: number): void => {
+        (band: HTMLElement, pressedIndex: number): boolean => {
             const p = paramsRef.current
             const targets = collectTargets("col", pressedIndex)
             if (targets === null) {
-                return
+                return false
             }
             // 帯件数は判断時ハンドル読み (ADR-21 / ADR-19 の判断時規律 — getFrozenSize().rows /
             // .trailingRows はエンジンクランプ済み実効値)。装着前 (null) は帯集合なし — 測定集合が
@@ -344,8 +363,9 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
             }
             // 計測対象の可視行がゼロ (全帯 + 窓が非表示) は no-op — Excel も計測対象
             // なしでは幅を変えない (0 計測 → 9px 潰しの破壊を作らない。R1(B) 所見)
+            // 測る行が無い / 測る書体が無い / 全空列は「当てるものが無い」実行で、拒否ではない (true)
             if (measuredRows.length === 0) {
-                return
+                return true
             }
             // 上限ゲートは計測セル数単位 (§7.3 — トラック数単位では 16k 列 × 可視 40 行が素通り
             // する)。上限は autofit 専用の低い係数 (§13 (e) の設計返却 — 実測根拠は定数 docstring)。
@@ -354,24 +374,30 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
             const measureLimit = Math.floor(p.maxOperationCells / AUTOFIT_MEASURE_DIVISOR)
             if (measuredCells > measureLimit) {
                 p.onOperationRejected?.("resize", measuredCells, "limit")
-                return
+                return false
             }
             // canvas 生成 + computed font 取得はジェスチャ 1 回につき 1 度 (§7.3)。font は
             // ロングハンド合成の単一経路 (Firefox は font ショートハンドの computed 値を空で
             // 返すため、合成だけが全ブラウザで決定的)
             const context = document.createElement("canvas").getContext("2d")
             if (context === null) {
-                return // 実ブラウザでは常に成立 (jsdom は 2d 未実装 — 計測面は E2E がピン)
+                return true // 実ブラウザでは常に成立 (jsdom は 2d 未実装 — 計測面は E2E がピン)
             }
             const bandStyle = getComputedStyle(band)
             // 既定フォント (書式なしセル) — 帯の computed style のロングハンド合成
             const baseFont = `${bandStyle.fontStyle} ${bandStyle.fontWeight} ${bandStyle.fontSize} ${bandStyle.fontFamily}`
+            // 見出しの行は書式でなくスタイルシートが太くする — 測る書体もセルと同じ太さにする。スタイルシートが読まれていなければ
+            // 見出しの行も帯と同じ太さで描かれるので、帯の太さがそのまま実際の描画の値
+            const headerWeight = bandStyle.getPropertyValue("--_aqsp-header-row-font-weight").trim()
+            const headerStyle = { fontStyle: bandStyle.fontStyle, fontWeight: headerWeight === "" ? bandStyle.fontWeight : headerWeight, fontSize: bandStyle.fontSize, fontFamily: bandStyle.fontFamily }
+            const headerFont = `${headerStyle.fontStyle} ${headerStyle.fontWeight} ${headerStyle.fontSize} ${headerStyle.fontFamily}`
             // CF は幅に効く規則 (bold / italic 設定) と stopIfTrue の障壁だけを 1 ジェスチャ 1 回抽出し列毎に
             // スライスする (実測 155 → 56 ms)。障壁を残すため走査は塗りと同じ位置で止まり bold / italic が
             // 厳密一致する。getConditionalFormats は getCellFormat を要する (root がマウント時に保証)
             const cfRules = p.adapter.getConditionalFormats === undefined ? null : widthRelevantRules(p.adapter.getConditionalFormats())
             const memo = createCfMemo()
             const fontKeys = new WeakMap<CellFormat, string>()
+            const headerFontKeys = new WeakMap<CellFormat, string>()
             // フォントキー毎のバケット (列 index + 表示文字列): ctx.font の代入は異なりフォント毎に 1 回
             const buckets = new Map<string, { col: number; text: string }[]>()
             for (const col of targets) {
@@ -384,7 +410,8 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
                     const raw = p.adapter.getCellText(row, col)
                     // 塗り書式 (base ⊕ 幅に効く CF) — raw は既読なので thunk は再読しない
                     const painted = p.adapter.getCellFormat === undefined ? undefined : resolvePaintedFormat(p.adapter, colIndex, memo, row, col, () => raw)
-                    const font = painted === undefined ? baseFont : fontKeyOf(painted, fontKeys, bandStyle)
+                    const isHeaderRow = row < p.headerRows
+                    const font = painted === undefined ? (isHeaderRow ? headerFont : baseFont) : isHeaderRow ? fontKeyOf(painted, headerFontKeys, headerStyle) : fontKeyOf(painted, fontKeys, bandStyle)
                     const text = formatCellValue(raw, painted === undefined ? undefined : painted.value)
                     const bucket = buckets.get(font)
                     if (bucket === undefined) {
@@ -415,13 +442,51 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
                 }
             }
             if (entries.length === 0) {
-                return
+                return true
+            }
+            return applyEntries("col", entries, pressedIndex)
+        },
+        [collectTargets, applyEntries],
+    )
+
+    const stepTrack = useCallback(
+        (axis: "row" | "col", index: number, direction: 1 | -1): boolean => {
+            const axisModel = axis === "col" ? paramsRef.current.colAxis : paramsRef.current.rowAxis
+            const size = keyboardStepSize(axisModel.sizeOf(index), direction)
+            // 端にあるトラックは寸法を保つ (当てるものが無い — 拒否ではないので onOperationRejected は鳴らさない)
+            if (size === axisModel.sizeOf(index)) {
+                return true
+            }
+            const targets = collectTargets(axis, index)
+            if (targets === null) {
+                return false
             }
-            applyEntries("col", entries, pressedIndex)
+            return applyEntries(
+                axis,
+                targets.map((target) => ({ index: target, size })),
+                index,
+            )
         },
         [collectTargets, applyEntries],
     )
 
+    const autofitColumn = useCallback(
+        (index: number): boolean => {
+            const p = paramsRef.current
+            const band = p.colBandRef.current
+            // renderCell のカスタム DOM は measureText で測れない (帯のダブルクリックと同じ逸脱) — 帯の未装着は測る書体が無い
+            if (!p.autofitEnabled || band === null) {
+                return false
+            }
+            // 隠れた列は隠れたまま (戻すのは再表示だけ) — 走ったが何も変えない
+            if (p.colAxis.sizeOf(index) === 0) {
+                return true
+            }
+            return autofitColumns(band, index)
+        },
+        [autofitColumns],
+    )
+
     const { enabled, colBandRef, rowBandRef } = params
     useEffect(() => {
         const colBand = colBandRef.current
@@ -650,6 +715,8 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
 
     return useMemo(
         () => ({
+            stepTrack,
+            autofitColumn,
             isDragging: () => draggingRef.current,
             // リサイズ / unhide は選択矩形を配送しない — 配送モードは常に加算
             getDragMode: (): "add" | "subtract" | "point" => "add",
@@ -661,6 +728,6 @@ export const useHeaderResize = (params: UseHeaderResizeParams): SelectionEngine
             },
             cancelDrag: cleanupDrag,
         }),
-        [cleanupDrag],
+        [cleanupDrag, stepTrack, autofitColumn],
     )
 }

package/src/index.ts

@@ -46,7 +46,7 @@ export { type HtmlTableKind, type HtmlTableResult, parseHtmlTable, serializeHtml
 export type { NumberFormatDecodeOptions } from "./clipboard/numberFormatCodec.ts"
 export type { PasteMode, PasteOperation, PasteOptions } from "./clipboard/pasteSpecial.ts"
 export { estimatePasteCellCount, expandPaste } from "./clipboard/tiling.ts"
-export { parseTsv, serializeTsv } from "./clipboard/tsv.ts"
+export { iterateTsvPrefixRows, iterateTsvRows, measureTsv, parseTsv, serializeClipboardTsv, serializeTsv } from "./clipboard/tsv.ts"
 export type { ClipInfo, PasteOutcome } from "./clipboard/useClipboard.ts"
 export type { BorderPreset } from "./commands/useCommands.ts"
 // renderCell の ctx 型 — prop が公開面にある以上、その引数型も名指しできなければならない

package/src/keyboard/shortcuts.ts

@@ -67,6 +67,12 @@ export type SpreadsheetCommand =
     | "hideColumns"
     | "unhideRows"
     | "unhideColumns"
+    // 寸法のキーボード操作 (WCAG 2.1.1 — 帯の境界のドラッグと同じ処理)
+    | "increaseColumnWidth"
+    | "decreaseColumnWidth"
+    | "increaseRowHeight"
+    | "decreaseRowHeight"
+    | "autoFitColumnWidth"
     // 拡張コマンド (既定 [] = 未束縛、再バインド可)
     | "formatGeneral"
     | "bordersAll"
@@ -147,6 +153,11 @@ export const SPREADSHEET_COMMANDS: readonly SpreadsheetCommand[] = [
     "hideColumns",
     "unhideRows",
     "unhideColumns",
+    "increaseColumnWidth",
+    "decreaseColumnWidth",
+    "increaseRowHeight",
+    "decreaseRowHeight",
+    "autoFitColumnWidth",
     "formatGeneral",
     "bordersAll",
     "pasteFormats",
@@ -498,8 +509,64 @@ export const BUILTIN_ROWS: readonly BuiltinRow[] = [
     command("hideRows", "Ctrl+Alt+Digit9", "idle", "hide the selected rows"),
     command("unhideRows", "Ctrl+Shift+Digit9", "idle", "unhide rows"),
     command("unhideColumns", "Ctrl+Shift+Digit0", "idle", "unhide columns"),
+    command("increaseColumnWidth", "Alt+Shift+ArrowRight", "idle", "widen the active column by one step (x 2^(1/4))"),
+    command("decreaseColumnWidth", "Alt+Shift+ArrowLeft", "idle", "narrow the active column by one step (/ 2^(1/4), never below 1 px)"),
+    command("increaseRowHeight", "Alt+Shift+ArrowDown", "idle", "make the active row taller by one step (x 2^(1/4))"),
+    command("decreaseRowHeight", "Alt+Shift+ArrowUp", "idle", "make the active row shorter by one step (/ 2^(1/4), never below 1 px)"),
+    command("autoFitColumnWidth", "Alt+Shift+Equal", "idle", "fit the active column to its content (the strip double-click)"),
 ]
 
+/**
+ * The commands that change the size of the active track (WCAG 2.1.1 — the keyboard twins of the header strips), in the
+ * order the hidden input describes them through `aria-keyshortcuts`.
+ * アクティブなトラックの寸法を変えるコマンド (WCAG 2.1.1 — 帯の境界のキーボードの双子)。隠しの入力が `aria-keyshortcuts` で
+ * 示す順。
+ */
+export const RESIZE_COMMANDS: readonly SpreadsheetCommand[] = Object.freeze(["increaseColumnWidth", "decreaseColumnWidth", "increaseRowHeight", "decreaseRowHeight", "autoFitColumnWidth"])
+
+/** ARIA key names of the code tokens whose key differs from the token (US layout, unshifted). / トークンと名前が違うコードの ARIA のキー名 (US 配列・Shift なし)。 */
+const ARIA_KEY_OF_CODE: Readonly<Record<string, string>> = Object.freeze({
+    Equal: "=",
+    Minus: "-",
+    Semicolon: ";",
+    Quote: "'",
+    Comma: ",",
+    Period: ".",
+    Slash: "/",
+    Backslash: "\\",
+    BracketLeft: "[",
+    BracketRight: "]",
+    Backquote: "`",
+    NumpadAdd: "+",
+    NumpadSubtract: "-",
+    NumpadMultiply: "*",
+    NumpadDivide: "/",
+    NumpadDecimal: ".",
+    NumpadEnter: "Enter",
+})
+
+/**
+ * One canonical chord in the `aria-keyshortcuts` syntax: `Ctrl` becomes `Control`, digits and punctuation become the
+ * key they produce on a US layout without Shift (`Equal` → `=`, `Digit5` → `5`), and every other token is already an
+ * ARIA key name. The layout-specific keys `IntlYen`, `IntlRo` and `IntlBackslash` have no fixed character, so a chord
+ * using one has no ARIA form (null).
+ * 正準のチョード 1 つの `aria-keyshortcuts` の書き方。`Ctrl` は `Control`、数字と記号は US 配列で Shift なしに生む文字
+ * (`Equal` → `=`、`Digit5` → `5`) にし、ほかのトークンはそのまま ARIA のキー名。配列ごとのキー `IntlYen` / `IntlRo` /
+ * `IntlBackslash` は文字が決まらないので、それを使うチョードは ARIA の形を持たない (null)。
+ *
+ * @param chord - A canonical chord (`Ctrl+Alt+Shift+KEY`). 正準のチョード。
+ * @returns The ARIA form, or null. ARIA の形、または null。
+ */
+export const toAriaKeyShortcut = (chord: string): string | null => {
+    const parsed = parseChord(chord)
+    if (parsed.key === "IntlYen" || parsed.key === "IntlRo" || parsed.key === "IntlBackslash") {
+        return null
+    }
+    const digit = /^(?:Digit|Numpad)(\d)$/u.exec(parsed.key)
+    const key = digit !== null ? (digit[1] as string) : parsed.key in ARIA_KEY_OF_CODE ? (ARIA_KEY_OF_CODE[parsed.key] as string) : parsed.key
+    return `${parsed.ctrl ? "Control+" : ""}${parsed.alt ? "Alt+" : ""}${parsed.shift ? "Shift+" : ""}${key}`
+}
+
 /** True when a row is consulted in the given column (`both` covers idle and editing). / 行が指定列で参照されるなら true (`both` は idle と編集の両方)。 */
 const rowInColumn = (row: BuiltinRow, column: "idle" | "editing"): boolean => row.column === "both" || row.column === column
 

package/src/model/dataAdapter.ts

@@ -581,6 +581,80 @@ export const readOnlyDeclared = (adapter: SpreadsheetDataAdapter): boolean => ad
  */
 export const isReadOnlyCell = (adapter: SpreadsheetDataAdapter, row: number, col: number): boolean => adapter.isCellReadOnly?.(row, col) === true
 
+/**
+ * Every member of SpreadsheetDataAdapter, so a view can forward each one by name; the compile-time check below fails when
+ * the adapter type gains a member this list lacks.
+ * SpreadsheetDataAdapter の全メンバー。ビューが名前ごとに転送するための一覧で、型にメンバーが増えて一覧に無いときは下の
+ * コンパイル時の検査が落ちる。
+ */
+const ADAPTER_MEMBERS = [
+    "rowCount",
+    "colCount",
+    "getCellText",
+    "applyEdits",
+    "findDataEdge",
+    "getCellFormat",
+    "getCellFormula",
+    "getCellNote",
+    "getCellComments",
+    "getCellHyperlink",
+    "getCellValidation",
+    "getConditionalFormats",
+    "isCellReadOnly",
+    "getCellAttributes",
+    "getRangeExtrema",
+    "evaluateFormula",
+] as const satisfies readonly (keyof SpreadsheetDataAdapter)[]
+
+/** True when ADAPTER_MEMBERS names every member of the adapter type. / ADAPTER_MEMBERS が型の全メンバーを挙げているとき true。 */
+const ADAPTER_MEMBERS_COMPLETE: [Exclude<keyof SpreadsheetDataAdapter, (typeof ADAPTER_MEMBERS)[number]>] extends [never] ? true : never = true
+void ADAPTER_MEMBERS_COMPLETE
+
+/** The read-only answer of a whole read-only grid: every cell. / グリッド全体を読み取り専用にしたときの答え (どのセルも読み取り専用)。 */
+const EVERY_CELL_READ_ONLY = (): boolean => true
+
+/**
+ * A view of `adapter` whose every cell is read-only (the `readOnly` prop): `isCellReadOnly` answers true for every cell
+ * whatever the adapter declares, so every read-only gate refuses every write and routes it to `onReadOnlyRejected`, and
+ * every other member reads the adapter live (getters run on the adapter, methods are bound to it once per function
+ * identity), so a class-based adapter with private fields or accessors keeps working through the view.
+ * 全てのセルを読み取り専用にした `adapter` のビュー (`readOnly` prop)。`isCellReadOnly` はアダプタの宣言に関わらずどのセルにも
+ * true を返すので、読み取り専用のゲートは全ての書き込みを拒み `onReadOnlyRejected` へ送る。ほかのメンバーはアダプタを毎回読む
+ * (アクセサはアダプタの上で動き、メソッドは関数の同一性ごとに 1 度だけアダプタへ束ねる) ので、private なフィールドやアクセサを
+ * 持つクラスのアダプタもビュー越しに動く。
+ *
+ * @param adapter - The host's adapter. ホストのアダプタ。
+ * @returns The read-only view. 読み取り専用のビュー。
+ */
+export const readOnlyAdapterView = (adapter: SpreadsheetDataAdapter): SpreadsheetDataAdapter => {
+    const bound = new WeakMap<object, unknown>()
+    const view = {} as SpreadsheetDataAdapter
+    for (const member of ADAPTER_MEMBERS) {
+        if (member === "isCellReadOnly") {
+            continue
+        }
+        Object.defineProperty(view, member, {
+            enumerable: true,
+            get: () => {
+                const value: unknown = Reflect.get(adapter, member, adapter)
+                if (typeof value !== "function") {
+                    return value
+                }
+                // メソッドの同一性を保つ (毎回 bind すると依存配列の比較や能力の読みのたびに別の関数になる)
+                const cached = bound.get(value)
+                if (cached !== undefined) {
+                    return cached
+                }
+                const fresh = value.bind(adapter)
+                bound.set(value, fresh)
+                return fresh
+            },
+        })
+    }
+    Object.defineProperty(view, "isCellReadOnly", { enumerable: true, value: EVERY_CELL_READ_ONLY })
+    return view
+}
+
 /** Host cell-attribute key grammar (v0.12): lowercase `data-*` only. / ホストセル属性キーの文法 (v0.12): 小文字 `data-*` のみ。 */
 const CELL_ATTRIBUTE_KEY = /^data-[a-z0-9-]+$/
 

package/src/overlay/SelectionOverlay.tsx

@@ -371,7 +371,7 @@ export const placeBandSegments = (nodes: BandNodes, rect: BandRect, extents: Ban
         // 埋め色は族の CSS 変数を参照するインライン background (パレット交換に追随)、交点表示へ戻るとき解除
         if (crossTint !== last.crossTint) {
             last.crossTint = crossTint
-            nodes.cross.style.background = crossTint === "intersection" ? "" : `var(--aqsp-band-${crossTint})`
+            nodes.cross.style.background = crossTint === "intersection" ? "" : `var(--_aqsp-band-${crossTint})`
         }
         if (rect.width !== last.crossWidth || rect.height !== last.crossHeight) {
             last.crossWidth = rect.width
@@ -490,6 +490,10 @@ type SelectionOverlayProps = {
     /** v0.9 capability: trailing frozen rows (the vertical twin of trailingCols). / v0.9 能力: 末尾凍結行数 (trailingCols の縦双子)。 */
     trailingRows?: number
     sinkAriaLabel: string
+    /** Whole-grid read-only (the `readOnly` prop): the hidden input carries `aria-readonly="true"`. / グリッド全体の読み取り専用 (`readOnly` prop)。隠しの入力が `aria-readonly="true"` を持つ。 */
+    sinkReadOnly: boolean
+    /** The keyboard resize chords in `aria-keyshortcuts` syntax, or undefined. / キーボードの寸法の操作のチョード (`aria-keyshortcuts` の書き方)。無ければ undefined。 */
+    sinkKeyShortcuts: string | undefined
     onSinkMouseDown: (event: MouseEvent) => void
     /**
      * v0.8 capability: the editing sink's paint (line box + vertical alignment) owned by the
@@ -683,6 +687,8 @@ export const SelectionOverlay = ({
     trailingCols,
     trailingRows,
     sinkAriaLabel,
+    sinkReadOnly,
+    sinkKeyShortcuts,
     onSinkMouseDown,
     editPaintRef,
     highlightRef,
@@ -1899,7 +1905,21 @@ export const SelectionOverlay = ({
                 一度も変化しない — 変換中の属性変更 (Windows TSF が変換を強制終了する) を構造的に排除する。
                 OSK の実際の表示は UA 依存: WebKit はフォーカス済み要素の変更を再評価する、Chromium はフォーカス取得時に
                 しか評価しない。ハードウェアキーボードとデスクトップ IME は無影響 */}
-            <textarea ref={mergedSinkRef} className="aqsp-sink" aria-label={sinkAriaLabel} tabIndex={-1} defaultValue=" " inputMode={virtualKeyboard ? "text" : "none"} spellCheck={false} autoCorrect="off" autoCapitalize="off" autoComplete="off" data-aqsp-sink="" />
+            <textarea
+                ref={mergedSinkRef}
+                className="aqsp-sink"
+                aria-label={sinkAriaLabel}
+                aria-readonly={sinkReadOnly ? "true" : undefined}
+                aria-keyshortcuts={sinkKeyShortcuts}
+                tabIndex={-1}
+                defaultValue=" "
+                inputMode={virtualKeyboard ? "text" : "none"}
+                spellCheck={false}
+                autoCorrect="off"
+                autoCapitalize="off"
+                autoComplete="off"
+                data-aqsp-sink=""
+            />
             {/* pointer-events: auto の例外第 2 号 (§8.1) — シンクより後置 = 最上層。enableFillHandle=false は
                 DOM ごと抑止 (機械も不活性) */}
             {enableFillHandle ? <div ref={fillHandleNodeRef} className="aqsp-autofill-handle" data-aqsp-autofill-handle="" style={{ display: "none" }} /> : null}