Add per-table "hide chrome/headers when unfocused" clean-look option

New Settings checkbox: while a table isn't the selected canvas object,
its title bar, column letters and row numbers disappear entirely -- not
just visually, their reserved space collapses too, so the table shrinks
to just its cell grid. Clicking back into it (e.g. any cell) reselects
it and brings everything back.

TableObject.hideChromeUnfocused (store/types.ts) + setTableHideChromeUnfocused
(document.ts) + io/json.ts normalization, following the existing
per-object appearance-setting pattern. CanvasObject.vue gates its title
bar on a new showChrome computed and passes its existing `selected` prop
down to TableGrid.vue (previously only took tableId) so it can make the
same call for its own headers.

TableGrid.vue's HEAD_W (a plain constant) becomes a `headW` computed,
and the existing `headerH` computed now returns 0 for both whenever
hidden -- sufficient on its own since rowTop()/colLeft() already sum
those two values as their base offset and are the single source every
other position calculation in the file (sticky-frozen offsets, the
in-cell editor overlay, clip/fill marquees, scroll-into-view, row
virtualization) already goes through.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
wkh
2026-09-10 00:16:10 +02:00
co-authored by Claude Sonnet 5
parent c26b1dd857
commit 7646162767
8 changed files with 101 additions and 14 deletions
+9 -2
View File
@@ -58,7 +58,13 @@ scroll- und zoombare Fläche, die **Objekte** trägt:
Canvas-Objekt, unabhängig vom DOM. Nur Zeilen, nicht Spalten (in der
Praxis wird eher die Zeilenzahl groß).
Spaltenbreite per Drag am Spaltenkopf (ab **24 px**), **Zeilenhöhe** per Drag
an der Unterkante des Zeilenkopfs (Standard + je Zeile).
an der Unterkante des Zeilenkopfs (Standard + je Zeile). **„Ohne Rahmen/
Kopfzeilen, wenn nicht ausgewählt"** (Einstellungen → Objekt, je Tabelle):
solange die Tabelle nicht das ausgewählte Canvas-Objekt ist, verschwinden
Titelleiste, Spaltenbuchstaben und Zeilennummern komplett — nicht nur
optisch, ihr reservierter Platz fällt mit weg, die Tabelle schrumpft auf
reines Zellraster. Ein Klick hinein (z. B. auf eine Zelle) wählt sie
wieder aus und blendet alles zurück ein.
- **Diagramm-Objekt** — Chart.js (Balken/Linie), frei positionier- **und**
skalierbar. Datenquelle = ein Tabellen-Objekt; jede Zelländerung aktualisiert
es sofort.
@@ -646,7 +652,8 @@ wichtigen Punkte:
- **Objekt** (das gewählte):
- Tabelle → Name, Zeilen/Spalten (exakt), Darstellung, Viewport-Größe,
fixierte Kopfzeilen/Spalten, Position, Zahlenformat-Locale, **Standard-
Zeilenhöhe**, **Tabellen-Hintergrund/-Textfarbe**, und – bei aktiver
Zeilenhöhe**, **Tabellen-Hintergrund/-Textfarbe**, **„Ohne Rahmen/
Kopfzeilen, wenn nicht ausgewählt"** (s. u.), und – bei aktiver
Zellauswahl – die **Auswahl**-Formatierung (s. o.).
- Diagramm → Name, Ansicht, Quelltabelle, Größe, Position, Zahlenformat-Locale,
**Hintergrund**, **Text-/Achsenfarbe**.