Release v1.10.0: freeze multiple rows and columns, keep freezes stable across edits

- #9 Freeze multiple rows at once (multi-line headers), additive and in freeze order, with unfreeze-one and unfreeze-all
- Freeze multiple columns at once via Shift-selected headers
- Track frozen columns in state (pinnedCols) and re-apply on every grid rebuild, track frozen rows by reference with position re-anchoring
- Preserve freezes across row/column delete and insert, undo/redo, save, delimiter change and external reload (fixes seven freeze-loss regressions)
- Suppress the file-watcher self-write echo so saving no longer re-parses and wipes in-memory view state
- Add unit tests for multi-row freeze partition, column index remap and re-anchor

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: Robin-Reiche

CHANGELOG.md

@@ -2,6 +2,15 @@
 
 All notable changes to CSV Grid Editor are documented here.
 
+## [1.10.0] - 2026-06-12
+
+### Added
+- **Freeze multiple rows** - You can now pin more than one row to the top at once, which makes multi-line headers (a group row plus a unit row, for example) stay readable while you scroll (requested in [#9](https://github.com/Robin-Reiche/csv-grid-editor/issues/9)). Select several rows (drag or `Shift`+click the `#` gutter) and choose **Freeze N rows**, or keep adding rows one at a time, freezing is additive and the rows stay in the order you froze them. Right-click a pinned row to **Unfreeze** just that one, or **Unfreeze all rows**. This also covers the multi-level-header use case from [#8](https://github.com/Robin-Reiche/csv-grid-editor/issues/8) without changing the CSV.
+- **Freeze multiple columns at once** - `Shift`+click several column headers and choose **Freeze N columns** to pin them all in one go, the companion to multi-row freeze.
+
+### Fixed
+- **Freezes were lost during normal editing** - Frozen rows and columns are now preserved across deleting and inserting rows or columns, undo and redo, saving, and changing the delimiter, and frozen rows survive an external reload. Previously any of these could silently clear the freeze because the grid rebuild or re-parse lost track of the pinned rows and columns.
+
 ## [1.9.0] - 2026-06-12
 
 ### Added

README.md

@@ -97,10 +97,10 @@ For files larger than 10 MB you get a quick menu to open the full file, preview
 - **Manual Override** - Click the delimiter badge in the toolbar to change the delimiter on the fly (comma `,`, semicolon `;`, tab, pipe `|`). The grid re-parses the file immediately.
 
 ### Column Freeze
-- **Freeze / Unfreeze** - Right-click any column header to pin it to the left side of the grid, right-click again to unfreeze. Frozen columns show a 📌 marker before the column name.
+- **Freeze / Unfreeze** - Right-click any column header to pin it to the left side of the grid, right-click again to unfreeze. `Shift`+click several headers first to **Freeze N columns** at once. Frozen columns show a 📌 marker before the column name.
 
 ### Row Freeze
-- **Freeze / Unfreeze** - Right-click any row and choose **Freeze row** to pin it to the top of the grid as an always-visible reference while you scroll, sort and filter. Right-click the pinned row to unfreeze. One row can be frozen at a time. A 📌 marker on the pinned row shows its original row number, and the row stays visible regardless of any active filter.
+- **Freeze / Unfreeze** - Right-click any row and choose **Freeze row** to pin it to the top of the grid as an always-visible reference while you scroll, sort and filter. Select several rows first (drag or `Shift`+click the `#` gutter) and choose **Freeze N rows** to pin them all at once, handy for multi-line headers. Freezing is additive and the rows stay in the order you froze them. Right-click a pinned row to **Unfreeze** just that one, or **Unfreeze all rows**. A 📌 marker on each pinned row shows its original row number, and pinned rows stay visible regardless of any active filter.
 
 ### Rename Columns
 - **Rename** - Double-click a column header (or right-click it → **Rename column**) to rename it. The new name is written to the CSV header row and is fully undoable.

package.json

@@ -2,7 +2,7 @@
   "name": "csv-grid-editor",
   "displayName": "CSV Grid Editor: CSV & TSV Viewer",
   "description": "Open, view and edit CSV and TSV files in a fast sortable filterable grid. Inline editing, find and replace, freeze rows, column stats, Excel copy and paste and export to JSON. Free.",
-  "version": "1.9.0",
+  "version": "1.10.0",
   "publisher": "RobinReiche",
   "license": "MIT",
   "icon": "icon.png",

src/csvEditorProvider.ts

@@ -200,7 +200,15 @@ export class CsvEditorProvider implements vscode.CustomEditorProvider<CsvDocumen
             watcher.onDidChange(async () => {
                 try {
                     const raw = await vscode.workspace.fs.readFile(document.uri);
-                    document.content = new TextDecoder().decode(raw);
+                    const text = new TextDecoder().decode(raw);
+                    // Ignore our own writes. saveCustomDocument writes document.content
+                    // verbatim, so a watcher event whose content equals what we already
+                    // hold is the echo of our own save, not an external edit. Reloading
+                    // on it would re-parse the CSV into fresh arrays and wipe in-memory
+                    // view state (frozen rows, in particular). Only genuinely external
+                    // changes differ from document.content.
+                    if (text === document.content) return;
+                    document.content = text;
                     webviewPanel.webview.postMessage({
                         type: 'update',
                         text: document.content,

src/webview/features/delete-row-col.ts

@@ -8,6 +8,8 @@ import {
     deleteRowsFromData,
     insertRowsIntoData,
     insertColumnsIntoData,
+    shiftIndicesAfterDelete,
+    shiftIndicesAfterInsert,
 } from '../grid/mutations';
 import {
     copySelection,
@@ -16,7 +18,7 @@ import {
     getSelectedRowDisplayIndices,
     getSelectedColIndices,
 } from './range-select';
-import { freezeRow, unfreezeRow, isRowFrozen } from './freeze-rows';
+import { freezeRows, unfreezeRow, unfreezeAllRows, frozenRowCount } from './freeze-rows';
 
 // ── Data mutations ────────────────────────────────────────────────────────────
 
@@ -33,11 +35,12 @@ function deleteColumns(colIndices: number[]): void {
     const indices = colIndices.filter(c => Number.isInteger(c) && c >= 0);
     if (indices.length === 0) return;
     pushUndo();
-    // map() rebuilds every row array, replacing the frozen row's reference —
-    // re-anchor it to the new array at the same position so the freeze survives.
-    const frozenIdx = state.frozenRowRef ? state.data.indexOf(state.frozenRowRef) : -1;
+    // map() rebuilds every row array, replacing the frozen rows' references —
+    // re-anchor them by position (row count is unchanged) so the freezes survive.
+    const frozenIdxs = state.frozenRowRefs.map(r => state.data.indexOf(r)).filter(i => i >= 0);
     state.data = deleteColumnsFromData(state.data, indices);
-    if (frozenIdx >= 0) state.frozenRowRef = state.data[frozenIdx];
+    state.frozenRowRefs = frozenIdxs.map(i => state.data[i]);
+    state.pinnedCols = shiftIndicesAfterDelete(state.pinnedCols, indices); // keep frozen columns frozen
     state.hiddenCols.clear(); // column indices shifted — drop index-based hide state
     state.isAutoFitted = false;
     state.autoFitCache = null;
@@ -144,11 +147,12 @@ function insertColumns(baseIndex: number, position: 'left' | 'right', count: num
 
     pushUndo();
     // map() (inside insertColumnsIntoData) rebuilds every row array — re-anchor the
-    // frozen row afterwards so the freeze survives a column insert (row positions
-    // are unchanged).
-    const frozenIdx = state.frozenRowRef ? state.data.indexOf(state.frozenRowRef) : -1;
+    // frozen rows by position afterwards so the freezes survive a column insert (row
+    // positions are unchanged).
+    const frozenIdxs = state.frozenRowRefs.map(r => state.data.indexOf(r)).filter(i => i >= 0);
     state.data = insertColumnsIntoData(state.data, insertAt, count);
-    if (frozenIdx >= 0) state.frozenRowRef = state.data[frozenIdx];
+    state.frozenRowRefs = frozenIdxs.map(i => state.data[i]);
+    state.pinnedCols = shiftIndicesAfterInsert(state.pinnedCols, insertAt, count); // keep frozen columns frozen
     state.hiddenCols.clear(); // column indices shifted — drop index-based hide state
     state.isAutoFitted = false;
     state.autoFitCache = null;
@@ -164,7 +168,7 @@ function hideMenu(): void {
     document.getElementById('row-context-menu')?.classList.add('hidden');
 }
 
-function showContextMenu(x: number, y: number, rowIndex: number | null, colId: string | null, isPinnedRow = false): void {
+function showContextMenu(x: number, y: number, rowIndex: number | null, colId: string | null, isPinnedRow = false, pinnedOrig: number | null = null): void {
     const menu = document.getElementById('row-context-menu') as HTMLElement | null;
     if (!menu) return;
 
@@ -217,36 +221,54 @@ function showContextMenu(x: number, y: number, rowIndex: number | null, colId: s
         menu.appendChild(sep);
     }
 
-    // ── Freeze / Unfreeze row ─────────────────────────────────────────────────
+    // ── Freeze / Unfreeze row(s) ──────────────────────────────────────────────
     // A pure view aid (available in preview too). Suppressed while duplicate
     // detection is active, since that mode drives the grid's rowData itself —
     // the two are mutually exclusive (runDetect() drops any frozen row).
     if (state.dupRowSet.size === 0 && !state.dupShowOnly) {
-        if (isPinnedRow && state.frozenRowRef !== null) {
-            // Right-clicked the pinned band — it can only be the single frozen row,
-            // so offer Unfreeze directly without depending on a (possibly absent)
-            // body row index.
-            const item = document.createElement('div');
-            item.className = 'row-ctx-item';
-            item.textContent = '📌 Unfreeze row';
-            item.addEventListener('click', () => { unfreezeRow(); hideMenu(); });
-            menu.appendChild(item);
-
-            const sep = document.createElement('div');
-            sep.className = 'col-ctx-separator';
-            menu.appendChild(sep);
-        } else if (rowIndex !== null) {
-            const node        = resolveNode();
-            const clickedOrig = node?.data?._origIndex != null ? Number(node.data._origIndex) : null;
+        if (isPinnedRow) {
+            // Right-clicked a pinned (frozen) row. pinnedOrig is resolved from the
+            // DOM by the contextmenu handler. Only show the per-row item when it
+            // resolved, so an unresolved click can NEVER fall back to clearing all
+            // freezes. "Unfreeze all rows" is a separate, explicit action.
+            const clickedOrig = pinnedOrig;
             if (clickedOrig != null) {
-                const frozen = isRowFrozen(clickedOrig);
                 const item = document.createElement('div');
                 item.className = 'row-ctx-item';
-                item.textContent = frozen ? '📌 Unfreeze row' : '📌 Freeze row';
-                item.addEventListener('click', () => {
-                    if (frozen) unfreezeRow(); else freezeRow(clickedOrig);
-                    hideMenu();
-                });
+                item.textContent = '📌 Unfreeze row';
+                item.addEventListener('click', () => { unfreezeRow(clickedOrig); hideMenu(); });
+                menu.appendChild(item);
+            }
+            if (frozenRowCount() > 1) {
+                const all = document.createElement('div');
+                all.className = 'row-ctx-item';
+                all.textContent = '📌 Unfreeze all rows';
+                all.addEventListener('click', () => { unfreezeAllRows(); hideMenu(); });
+                menu.appendChild(all);
+            }
+            if (clickedOrig != null || frozenRowCount() > 1) {
+                const sep = document.createElement('div');
+                sep.className = 'col-ctx-separator';
+                menu.appendChild(sep);
+            }
+        } else if (rowIndex !== null) {
+            // Body rows are never frozen themselves (a frozen row moves to the
+            // pinned band), so the body menu only offers Freeze. With a multi-row
+            // selection that includes the clicked row, freeze them all at once.
+            const selectedRows = getSelectedRowDisplayIndices();
+            const inSel = selectedRows.length > 1 && selectedRows.includes(rowIndex);
+            const displayRows = inSel ? selectedRows : [rowIndex];
+            const origs: number[] = [];
+            for (const di of displayRows) {
+                const oi = state.gridApi?.getDisplayedRowAtIndex(di)?.data?._origIndex;
+                if (oi != null) origs.push(Number(oi));
+            }
+
+            if (origs.length > 0) {
+                const item = document.createElement('div');
+                item.className = 'row-ctx-item';
+                item.textContent = origs.length > 1 ? `📌 Freeze ${origs.length} rows` : '📌 Freeze row';
+                item.addEventListener('click', () => { freezeRows(origs); hideMenu(); });
                 menu.appendChild(item);
 
                 const sep = document.createElement('div');
@@ -408,6 +430,17 @@ export function setupDeleteRowCol(): void {
         const riStr   = agRow?.getAttribute('row-index');
         const rowIndex = riStr != null ? parseInt(riStr, 10) : null;
 
-        showContextMenu(e.clientX, e.clientY, rowIndex, colId, isPinnedRow);
+        // For a pinned (frozen) row, resolve which row it is independently of AG
+        // Grid's pinned-row index scheme: the '#' gutter cell renders "📌<origIndex>"
+        // (builder.ts valueGetter), so read that from the matching row in the band.
+        let pinnedOrig: number | null = null;
+        if (isPinnedRow && agRow && riStr != null) {
+            const ft = agRow.closest('.ag-floating-top');
+            const gutter = ft?.querySelector(`.ag-row[row-index="${riStr}"] [col-id="row-index"]`);
+            const m = (gutter?.textContent ?? '').match(/\d+/);
+            pinnedOrig = m ? parseInt(m[0], 10) : null;
+        }
+
+        showContextMenu(e.clientX, e.clientY, rowIndex, colId, isPinnedRow, pinnedOrig);
     });
 }

src/webview/features/delimiter.ts

@@ -1,6 +1,7 @@
 import { state } from '../state';
 import { parseCsv } from '../utils/csv';
 import { buildGrid } from '../grid/builder';
+import { frozenRowPositions, reanchorFrozenRows } from './freeze-rows';
 
 export function updateDelimiterBadge(delimiter: string): void {
     const badge = document.getElementById('delim-badge');
@@ -26,7 +27,12 @@ export function setupDelimiterBadge(): void {
             state.currentDelimiter = raw === '\\t' ? '\t' : raw;
             updateDelimiterBadge(state.currentDelimiter);
             dropdown.classList.add('hidden');
+            // A different delimiter re-splits the same lines into different columns,
+            // so the rows are the same rows at the same positions — re-anchor the
+            // frozen rows across the re-parse instead of losing them.
+            const frozen = frozenRowPositions();
             state.data = parseCsv(state.rawCsvText, state.currentDelimiter);
+            reanchorFrozenRows(frozen);
             state.hiddenCols.clear(); // re-parse may change the column set — drop index-based hide state
             state.autoFitCache = null;
             state.colTypes = [];

src/webview/features/duplicates.ts

@@ -9,20 +9,32 @@ export function setupFreezeColumns(): void {
     const menu = document.getElementById('col-context-menu') as HTMLElement | null;
     if (!menu) return;
 
+    // If the right-clicked column is part of a multi-column selection, freeze /
+    // unfreeze applies to all selected columns, otherwise just the clicked one.
+    const targetColIds = (colId: string): string[] => {
+        const colIndex = parseInt(colId.replace('col_', ''), 10);
+        const sel = getSelectedColIndices();
+        return sel.length > 1 && sel.includes(colIndex) ? sel.map(i => 'col_' + i) : [colId];
+    };
+
     document.getElementById('col-ctx-freeze')?.addEventListener('click', () => {
         const colId = menu.dataset.colId;
-        if (colId && state.gridApi) {
-            state.gridApi.applyColumnState({ state: [{ colId, pinned: 'left' }] });
-        }
         menu.classList.add('hidden');
+        if (!colId || !state.gridApi) return;
+        const ids = targetColIds(colId);
+        // Track the freeze in state so it survives a buildGrid rebuild, then apply
+        // it live without a rebuild.
+        for (const id of ids) { const ci = parseInt(id.slice(4), 10); if (!isNaN(ci)) state.pinnedCols.add(ci); }
+        state.gridApi.applyColumnState({ state: ids.map(id => ({ colId: id, pinned: 'left' })) });
     });
 
     document.getElementById('col-ctx-unfreeze')?.addEventListener('click', () => {
         const colId = menu.dataset.colId;
-        if (colId && state.gridApi) {
-            state.gridApi.applyColumnState({ state: [{ colId, pinned: null }] });
-        }
         menu.classList.add('hidden');
+        if (!colId || !state.gridApi) return;
+        const ids = targetColIds(colId);
+        for (const id of ids) { const ci = parseInt(id.slice(4), 10); state.pinnedCols.delete(ci); }
+        state.gridApi.applyColumnState({ state: ids.map(id => ({ colId: id, pinned: null })) });
     });
 
     document.addEventListener('click', () => menu.classList.add('hidden'));
@@ -48,18 +60,24 @@ export function setupFreezeColumns(): void {
         const col         = colStateArr.find((s: any) => s.colId === colId);
         const isPinned    = col?.pinned === 'left';
 
-        const freezeEl   = document.getElementById('col-ctx-freeze');
-        const unfreezeEl = document.getElementById('col-ctx-unfreeze');
-        if (freezeEl)   freezeEl.style.display  = isPinned ? 'none'  : 'block';
-        if (unfreezeEl) unfreezeEl.style.display = isPinned ? 'block' : 'none';
-
-        // Reflect a multi-column selection in the insert/delete labels so the user
-        // sees "Insert/Delete N columns" before clicking (matches the data-cell menu
-        // and Google Sheets). N inserts happen anchored to the selection edge.
+        // Reflect a multi-column selection in every action label so the user sees
+        // "Freeze/Unfreeze/Insert/Delete N columns" before clicking (matches the
+        // data-cell menu and Google Sheets). N inserts anchor to the selection edge.
         const colIndex = parseInt(colId.replace('col_', ''), 10);
         const selectedCols = getSelectedColIndices();
         const n = selectedCols.length > 1 && selectedCols.includes(colIndex) ? selectedCols.length : 1;
 
+        const freezeEl   = document.getElementById('col-ctx-freeze');
+        const unfreezeEl = document.getElementById('col-ctx-unfreeze');
+        if (freezeEl) {
+            freezeEl.style.display = isPinned ? 'none' : 'block';
+            freezeEl.textContent   = n > 1 ? `📌 Freeze ${n} columns` : '📌 Freeze column';
+        }
+        if (unfreezeEl) {
+            unfreezeEl.style.display = isPinned ? 'block' : 'none';
+            unfreezeEl.textContent   = n > 1 ? `📌 Unfreeze ${n} columns` : '📌 Unfreeze column';
+        }
+
         const delEl = document.getElementById('col-ctx-delete');
         if (delEl)  delEl.textContent  = n > 1 ? `✕ Delete ${n} columns`      : '✕ Delete column';
         const insL = document.getElementById('col-ctx-insert-left');