@aiquants/spreadsheet 0.16.1 → 0.17.0

package/src/header/useHeaderResize.ts

@@ -25,7 +25,10 @@
  * byte-identical (sign +1, guide `offsetOf + pendingSize`, both writers). Column autofit
  * measures the union `[0, R_eff) ∪ [rowStart, rowEnd] ∪ [rowCount − T_eff, rowCount)` (each
  * filtered by sizeOf > 0 — ADR-21, band counts from a judgment-time `getFrozenSize()` read)
- * and the measured-cell budget gate counts band rows.
+ * and the measured-cell budget gate counts band rows. v0.17: autofit measures with the cells' base
+ * font, read from the body pane (`fontSourceRef`), so the keyboard twin and the imperative all-rows
+ * fit (`autofitColumnsInAllRows` — every row of the named columns, no fan-out, gated at
+ * maxOperationCells measured cells) work whether the header bands are shown or not.
  *
  * ヘッダーリサイズ / unhide 機械 (§7 PT-1)。単一フックが両帯を結線 (§7.4 の機械勘定 = 1)。
  * 帯へ wire-once の native capture pointerdown を 1 本 (ストリップはリスナーを持たない —
@@ -49,7 +52,10 @@
  * 即時書込) が予定動く辺 `offsetOf(index) + initialSize − pendingSize` に置く。leading パスは
  * byte 恒等 (符号 +1、ガイド `offsetOf + pendingSize`、両書き手)。列 autofit の測定行集合は
  * 和集合 `[0, R_eff) ∪ [rowStart, rowEnd] ∪ [rowCount − T_eff, rowCount)` (各 sizeOf > 0 —
- * ADR-21。帯件数は判断時 `getFrozenSize()` 読み)、計測セル予算ゲートは帯行を算入する。
+ * ADR-21。帯件数は判断時 `getFrozenSize()` 読み)、計測セル予算ゲートは帯行を算入する。v0.17: autofit はセルの
+ * 基本の書体を本体ペイン (`fontSourceRef`) から読むので、キーの双子と命令の全部の行の合わせ
+ * (`autofitColumnsInAllRows` — 名指した列の全部の行、ファンアウトなし、測るセルは maxOperationCells まで) は
+ * 見出しの帯の有無に依らず働く。
  */
 
 import type { VirtualGridHandle } from "@aiquants/virtualscroll"
@@ -86,6 +92,12 @@ type UseHeaderResizeParams = {
     enabled: boolean
     colBandRef: RefObject<HTMLElement | null>
     rowBandRef: RefObject<HTMLElement | null>
+    /**
+     * The element whose computed font is the cells' base font (the body pane, the cells' parent): autofit measures with it,
+     * so it works whether the header bands are shown or not.
+     * 計算済みの書体がセルの基本の書体になる要素 (セルの親の本体ペイン)。autofit はこれで測るので、見出しの帯の有無に依らない。
+     */
+    fontSourceRef: RefObject<HTMLElement | null>
     colAxis: AxisModel
     rowAxis: AxisModel
     viewStore: ViewStore
@@ -119,25 +131,25 @@ type UseHeaderResizeParams = {
 }
 
 /**
- * The canvas `font` shorthand of a painted format over the band's computed style: italic /
- * bold / pt size (× 4/3 px, like cellPaint) / family from the format, the band's values
- * otherwise. Interned per format object (the paint intern keeps one object per distinct
+ * The canvas `font` shorthand of a painted format over the cells' base computed style (the body
+ * pane's): italic / bold / pt size (× 4/3 px, like cellPaint) / family from the format, the base
+ * values otherwise. Interned per format object (the paint intern keeps one object per distinct
  * painted format, so this is one string per distinct font).
- * 塗り書式の canvas `font` 短縮形 (帯の computed style の上に italic / bold / pt サイズ (× 4/3 px —
- * cellPaint と同式) / フォント族を重ねる)。書式 object 毎に intern (塗り intern が書式毎に 1 object を
- * 保つので、異なりフォント毎に 1 文字列)。
+ * 塗り書式の canvas `font` 短縮形 (セルの基本の computed style — 本体ペインのもの — の上に italic / bold /
+ * pt サイズ (× 4/3 px — cellPaint と同式) / フォント族を重ねる)。書式 object 毎に intern (塗り intern が書式毎に
+ * 1 object を保つので、異なりフォント毎に 1 文字列)。
  */
-const fontKeyOf = (painted: CellFormat, fontKeys: WeakMap<CellFormat, string>, bandStyle: Pick<CSSStyleDeclaration, "fontStyle" | "fontWeight" | "fontSize" | "fontFamily">): string => {
+const fontKeyOf = (painted: CellFormat, fontKeys: WeakMap<CellFormat, string>, baseStyle: Pick<CSSStyleDeclaration, "fontStyle" | "fontWeight" | "fontSize" | "fontFamily">): string => {
     const cached = fontKeys.get(painted)
     if (cached !== undefined) {
         return cached
     }
     // 真偽値は厳密 true のみ (fail-soft — cellPaint と同じ判定)
-    const style = painted.italic === true ? "italic" : bandStyle.fontStyle
-    const weight = painted.bold === true ? "bold" : bandStyle.fontWeight
-    // pt は cellPaint と同じ × 4/3 で px へ (非有限 / 非正は帯の既定のまま)
-    const size = typeof painted.fontSize === "number" && Number.isFinite(painted.fontSize) && painted.fontSize > 0 ? `${(painted.fontSize * 4) / 3}px` : bandStyle.fontSize
-    const family = typeof painted.fontFamily === "string" && painted.fontFamily !== "" ? painted.fontFamily : bandStyle.fontFamily
+    const style = painted.italic === true ? "italic" : baseStyle.fontStyle
+    const weight = painted.bold === true ? "bold" : baseStyle.fontWeight
+    // pt は cellPaint と同じ × 4/3 で px へ (非有限 / 非正は基本の書体の既定のまま)
+    const size = typeof painted.fontSize === "number" && Number.isFinite(painted.fontSize) && painted.fontSize > 0 ? `${(painted.fontSize * 4) / 3}px` : baseStyle.fontSize
+    const family = typeof painted.fontFamily === "string" && painted.fontFamily !== "" ? painted.fontFamily : baseStyle.fontFamily
     const font = `${style} ${weight} ${size} ${family}`
     fontKeys.set(painted, font)
     return font
@@ -184,6 +196,14 @@ export type HeaderResizeMachine = SelectionEngine & {
     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
+    /**
+     * Fits the listed columns to the widest text of every row (no fan-out; hidden columns keep their width), gated at
+     * maxOperationCells measured cells (false after onOperationRejected; false when renderCell is set or no font source is
+     * mounted).
+     * 名指した列を全部の行で最も広い文字に合わせる (ファンアウトなし。隠した列は幅を保つ)。測るセルは maxOperationCells まで
+     * (超えると onOperationRejected の後に false。renderCell があるか書体の元が未装着なら false)。
+     */
+    autofitColumnsInAllRows: (columns: readonly number[]) => boolean
 }
 
 /**
@@ -323,44 +343,28 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
         [collectTargets, applyEntries],
     )
 
-    /** 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): boolean => {
+    /**
+     * The measuring core of both autofit entries: fits `targets` to the widest painted text of `measuredRows` (per-column
+     * canvas measurement in each cell's painted font over the cells' base font from fontSourceRef, bucketed by font key),
+     * gated at `measureLimit` measured cells. No row to measure, no 2d context (jsdom) or an all-empty column set changes
+     * nothing and still counts as a run (true).
+     * 両方の autofit の入口が共有する計測の芯。`targets` を `measuredRows` の最も広い塗りの文字に合わせる (fontSourceRef のセルの
+     * 基本の書体の上で、セルごとの塗りの書体で列ごとに canvas で測り、書体の鍵で束ねる)。測るセルは `measureLimit` まで。測る行が無い・
+     * 2d の文脈が無い (jsdom)・全部が空の列は何も変えずに走ったものとする (true)。
+     *
+     * @param targets - The columns to fit. 合わせる列。
+     * @param measuredRows - The rows to measure, each with a size above 0. 測る行 (どれも大きさ 0 より大きい)。
+     * @param measureLimit - The most measured cells. 測るセルの上限。
+     * @param pressedIndex - The pressed track for the §7.2 zero-guard, or null for an imperative fit. §7.2 の 0 化ガードの押下トラック (命令の合わせでは null)。
+     * @returns Whether the fit ran (false after a refusal or without a mounted font source). 走ったか (拒んだとき・書体の元が未装着なら false)。
+     */
+    const fitColumns = useCallback(
+        (targets: readonly number[], measuredRows: readonly number[], measureLimit: number, pressedIndex: number | null): boolean => {
             const p = paramsRef.current
-            const targets = collectTargets("col", pressedIndex)
-            if (targets === null) {
+            const fontSource = p.fontSourceRef.current
+            if (fontSource === null) {
                 return false
             }
-            // 帯件数は判断時ハンドル読み (ADR-21 / ADR-19 の判断時規律 — getFrozenSize().rows /
-            // .trailingRows はエンジンクランプ済み実効値)。装着前 (null) は帯集合なし — 測定集合が
-            // 窓のみに縮む v0.8 恒等の能力分岐 (値代替フォールバックではない)
-            const handle = p.handleRef.current
-            const frozenSize = handle === null ? null : handle.getFrozenSize()
-            const leadingRows = frozenSize === null ? 0 : frozenSize.rows
-            const trailingRows = frozenSize === null ? 0 : frozenSize.trailingRows
-            // 測定行集合 = [0, R_eff) ∪ [rowStart, rowEnd] ∪ [rowCount − T_eff, rowCount) の順序付き
-            // 和集合 (ADR-21 — v0.9 §4.14)。幅 0 行は計測しない (sizeOf > 0 フィルタ)、重複は Set で
-            // 去重 (R = T = 0 は窓のみ = v0.8 恒等)
-            const { rowStart, rowEnd } = p.viewStore.get()
-            const last = Math.min(rowEnd, p.rowAxis.count - 1)
-            const measuredRows: number[] = []
-            const seen = new Set<number>()
-            const pushRow = (row: number): void => {
-                if (!seen.has(row) && p.rowAxis.sizeOf(row) > 0) {
-                    seen.add(row)
-                    measuredRows.push(row)
-                }
-            }
-            for (let row = 0; row < leadingRows; row += 1) {
-                pushRow(row)
-            }
-            for (let row = rowStart; row <= last; row += 1) {
-                pushRow(row)
-            }
-            // 末尾帯の開始 = rowCount − T_eff (エンジンクランプ済みのため常に ≥ R_eff ≥ 0 — §1.2)
-            for (let row = p.rowAxis.count - trailingRows; row < p.rowAxis.count; row += 1) {
-                pushRow(row)
-            }
             // 計測対象の可視行がゼロ (全帯 + 窓が非表示) は no-op — Excel も計測対象
             // なしでは幅を変えない (0 計測 → 9px 潰しの破壊を作らない。R1(B) 所見)
             // 測る行が無い / 測る書体が無い / 全空列は「当てるものが無い」実行で、拒否ではない (true)
@@ -368,30 +372,28 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
                 return true
             }
             // 上限ゲートは計測セル数単位 (§7.3 — トラック数単位では 16k 列 × 可視 40 行が素通り
-            // する)。上限は autofit 専用の低い係数 (§13 (e) の設計返却 — 実測根拠は定数 docstring)。
-            // 帯行も算入する (ADR-21 — measuredRows が帯行を含む)
+            // する)。帯行も算入する (ADR-21 — measuredRows が帯行を含む)
             const measuredCells = targets.length * measuredRows.length
-            const measureLimit = Math.floor(p.maxOperationCells / AUTOFIT_MEASURE_DIVISOR)
             if (measuredCells > measureLimit) {
                 p.onOperationRejected?.("resize", measuredCells, "limit")
                 return false
             }
-            // canvas 生成 + computed font 取得はジェスチャ 1 回につき 1 度 (§7.3)。font は
+            // canvas 生成 + computed font 取得は合わせ 1 回につき 1 度 (§7.3)。font は
             // ロングハンド合成の単一経路 (Firefox は font ショートハンドの computed 値を空で
             // 返すため、合成だけが全ブラウザで決定的)
             const context = document.createElement("canvas").getContext("2d")
             if (context === null) {
                 return true // 実ブラウザでは常に成立 (jsdom は 2d 未実装 — 計測面は E2E がピン)
             }
-            const bandStyle = getComputedStyle(band)
-            // 既定フォント (書式なしセル) — 帯の computed style のロングハンド合成
-            const baseFont = `${bandStyle.fontStyle} ${bandStyle.fontWeight} ${bandStyle.fontSize} ${bandStyle.fontFamily}`
+            const baseStyle = getComputedStyle(fontSource)
+            // 既定フォント (書式なしセル) — 本体ペインの computed style のロングハンド合成 (セルは本体ペインの書体を継ぐ)
+            const baseFont = `${baseStyle.fontStyle} ${baseStyle.fontWeight} ${baseStyle.fontSize} ${baseStyle.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 headerWeight = baseStyle.getPropertyValue("--_aqsp-header-row-font-weight").trim()
+            const headerStyle = { fontStyle: baseStyle.fontStyle, fontWeight: headerWeight === "" ? baseStyle.fontWeight : headerWeight, fontSize: baseStyle.fontSize, fontFamily: baseStyle.fontFamily }
             const headerFont = `${headerStyle.fontStyle} ${headerStyle.fontWeight} ${headerStyle.fontSize} ${headerStyle.fontFamily}`
-            // CF は幅に効く規則 (bold / italic 設定) と stopIfTrue の障壁だけを 1 ジェスチャ 1 回抽出し列毎に
+            // 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())
@@ -411,7 +413,7 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
                     // 塗り書式 (base ⊕ 幅に効く CF) — raw は既読なので thunk は再読しない
                     const painted = p.adapter.getCellFormat === undefined ? undefined : resolvePaintedFormat(p.adapter, colIndex, memo, row, col, () => raw)
                     const isHeaderRow = row < p.headerRows
-                    const font = painted === undefined ? (isHeaderRow ? headerFont : baseFont) : isHeaderRow ? fontKeyOf(painted, headerFontKeys, headerStyle) : fontKeyOf(painted, fontKeys, bandStyle)
+                    const font = painted === undefined ? (isHeaderRow ? headerFont : baseFont) : isHeaderRow ? fontKeyOf(painted, headerFontKeys, headerStyle) : fontKeyOf(painted, fontKeys, baseStyle)
                     const text = formatCellValue(raw, painted === undefined ? undefined : painted.value)
                     const bucket = buckets.get(font)
                     if (bucket === undefined) {
@@ -446,7 +448,51 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
             }
             return applyEntries("col", entries, pressedIndex)
         },
-        [collectTargets, applyEntries],
+        [applyEntries],
+    )
+
+    /** 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(
+        (pressedIndex: number): boolean => {
+            const p = paramsRef.current
+            const targets = collectTargets("col", pressedIndex)
+            if (targets === null) {
+                return false
+            }
+            // 帯件数は判断時ハンドル読み (ADR-21 / ADR-19 の判断時規律 — getFrozenSize().rows /
+            // .trailingRows はエンジンクランプ済み実効値)。装着前 (null) は帯集合なし — 測定集合が
+            // 窓のみに縮む v0.8 恒等の能力分岐 (値代替フォールバックではない)
+            const handle = p.handleRef.current
+            const frozenSize = handle === null ? null : handle.getFrozenSize()
+            const leadingRows = frozenSize === null ? 0 : frozenSize.rows
+            const trailingRows = frozenSize === null ? 0 : frozenSize.trailingRows
+            // 測定行集合 = [0, R_eff) ∪ [rowStart, rowEnd] ∪ [rowCount − T_eff, rowCount) の順序付き
+            // 和集合 (ADR-21 — v0.9 §4.14)。幅 0 行は計測しない (sizeOf > 0 フィルタ)、重複は Set で
+            // 去重 (R = T = 0 は窓のみ = v0.8 恒等)
+            const { rowStart, rowEnd } = p.viewStore.get()
+            const last = Math.min(rowEnd, p.rowAxis.count - 1)
+            const measuredRows: number[] = []
+            const seen = new Set<number>()
+            const pushRow = (row: number): void => {
+                if (!seen.has(row) && p.rowAxis.sizeOf(row) > 0) {
+                    seen.add(row)
+                    measuredRows.push(row)
+                }
+            }
+            for (let row = 0; row < leadingRows; row += 1) {
+                pushRow(row)
+            }
+            for (let row = rowStart; row <= last; row += 1) {
+                pushRow(row)
+            }
+            // 末尾帯の開始 = rowCount − T_eff (エンジンクランプ済みのため常に ≥ R_eff ≥ 0 — §1.2)
+            for (let row = p.rowAxis.count - trailingRows; row < p.rowAxis.count; row += 1) {
+                pushRow(row)
+            }
+            // 上限は autofit 専用の低い係数 (§13 (e) の設計返却 — 実測根拠は定数 docstring)。帯行も算入する (ADR-21)
+            return fitColumns(targets, measuredRows, Math.floor(p.maxOperationCells / AUTOFIT_MEASURE_DIVISOR), pressedIndex)
+        },
+        [collectTargets, fitColumns],
     )
 
     const stepTrack = useCallback(
@@ -473,20 +519,42 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
     const autofitColumn = useCallback(
         (index: number): boolean => {
             const p = paramsRef.current
-            const band = p.colBandRef.current
-            // renderCell のカスタム DOM は measureText で測れない (帯のダブルクリックと同じ逸脱) — 帯の未装着は測る書体が無い
-            if (!p.autofitEnabled || band === null) {
+            // renderCell のカスタム DOM は measureText で測れない (帯のダブルクリックと同じ逸脱)。書体の元の未装着は芯が false を返す
+            if (!p.autofitEnabled) {
                 return false
             }
             // 隠れた列は隠れたまま (戻すのは再表示だけ) — 走ったが何も変えない
             if (p.colAxis.sizeOf(index) === 0) {
                 return true
             }
-            return autofitColumns(band, index)
+            return autofitColumns(index)
         },
         [autofitColumns],
     )
 
+    const autofitColumnsInAllRows = useCallback(
+        (columns: readonly number[]): boolean => {
+            const p = paramsRef.current
+            if (!p.autofitEnabled) {
+                return false
+            }
+            // 隠れた列は隠れたまま (戻すのは再表示だけ)。重複は 1 回
+            const targets = [...new Set(columns)].filter((col) => p.colAxis.sizeOf(col) > 0)
+            if (targets.length === 0) {
+                return true
+            }
+            const measuredRows: number[] = []
+            for (let row = 0; row < p.rowAxis.count; row += 1) {
+                if (p.rowAxis.sizeOf(row) > 0) {
+                    measuredRows.push(row)
+                }
+            }
+            // ホストが一度だけ呼ぶ合わせなので、上限は操作の予算そのもの (画面の操作の 1/4 の係数は打鍵ごとの応答のためのもの)
+            return fitColumns(targets, measuredRows, p.maxOperationCells, null)
+        },
+        [fitColumns],
+    )
+
     const { enabled, colBandRef, rowBandRef } = params
     useEffect(() => {
         const colBand = colBandRef.current
@@ -680,7 +748,7 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
                 }
                 return
             }
-            autofitColumns(band, hit.index)
+            autofitColumns(hit.index)
         }
 
         const onLostPointerCapture = (event: PointerEvent) => {
@@ -717,6 +785,7 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
         () => ({
             stepTrack,
             autofitColumn,
+            autofitColumnsInAllRows,
             isDragging: () => draggingRef.current,
             // リサイズ / unhide は選択矩形を配送しない — 配送モードは常に加算
             getDragMode: (): "add" | "subtract" | "point" => "add",
@@ -728,6 +797,6 @@ export const useHeaderResize = (params: UseHeaderResizeParams): HeaderResizeMach
             },
             cancelDrag: cleanupDrag,
         }),
-        [cleanupDrag, stepTrack, autofitColumn],
+        [cleanupDrag, stepTrack, autofitColumn, autofitColumnsInAllRows],
     )
 }

package/src/index.ts

@@ -122,5 +122,5 @@ export { NoteTip, type NoteTipProps } from "./popover/NoteTip.tsx"
 // PopoverContext.anchorRect の型 (層座標系の矩形) — 配置エンジン placePopover 本体は非公開のまま
 export type { PopoverRect } from "./popover/placement.ts"
 export type { CommentPopoverContext, LinkPopoverContext, ListPopoverContext, MessagePopoverContext, NotePopoverContext, NoteTipContext, PopoverContext, PopoverKind, PopoverOverrides } from "./popover/usePopovers.ts"
-export { DEFAULT_CUSTOM_COLORS, type ScrollToCellOptions, Spreadsheet, type SpreadsheetHandle, type SpreadsheetProps } from "./Spreadsheet.tsx"
+export { DEFAULT_CUSTOM_COLORS, type ScrollToCellOptions, Spreadsheet, type SpreadsheetContentSize, type SpreadsheetHandle, type SpreadsheetProps } from "./Spreadsheet.tsx"
 export type { SelectionState } from "./selection/selectionState.ts"

package/src/styles/spreadsheet.css

@@ -113,6 +113,26 @@
   transform-origin: 0 0;
 }
 
+/* 見出し (列の記号・行の番号・角) を出さないグリッド (headings={false}): 格子の 2 本の帯を 0 にし、本体を根の左上から始める */
+.aqsp-root[data-aqsp-headings-hidden] .aqsp-zoom {
+  grid-template-columns: 0 minmax(0, 1fr);
+  grid-template-rows: 0 minmax(0, 1fr);
+}
+
+/*
+ * キーの移動で選んだセルをページの中で見せる印 (位置と大きさは revealCellInPage が書く)。根の直下でズームの包みの外に置き、見えず
+ * 押せない。scrollIntoView は可視性に依らず箱の位置へスクロールする
+ */
+.aqsp-reveal {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 0;
+  pointer-events: none;
+  visibility: hidden;
+}
+
 .aqsp-corner {
   grid-column: 1;
   grid-row: 1;