Hero CSV Viewer

A feature-rich CSV viewer and editor extension for Visual Studio Code with per-column filtering, word wrap, column resizing, search filtering, sorting, virtual scrolling, inline cell editing, multi-row bulk operations, standard Undo/Redo integration, automatic reload on external file changes, original encoding/delimiter preservation on save, and per-file layout persistence.

Features

• Inline Cell Editing — The table is editable from the moment a file is opened. Double-click, F2, or Enter begins cell editing. Enter/Tab/Shift+Tab confirms and moves focus; Shift+Enter inserts a line break within a cell; Escape cancels. Japanese IME confirmation Enter is correctly distinguished from cell-commit Enter.
• Multi-Row Bulk Selection and Operations — Shift+click on row-number cells to select a contiguous range; Cmd/Ctrl+click to toggle individual rows in/out of the selection. Bulk delete (Delete/Backspace), TSV-format copy (Cmd/Ctrl+C), and up/down move (contiguous selection only) are supported.
• Row / Column Operations — Right-click on a row number cell or a column header to insert above/below or left/right, delete, move up/down or left/right, or rename a column. Multi-row selection swaps the menu to bulk-operation entries.
• Standard Undo / Redo — Integrates with VS Code's native undo/redo stack (Cmd+Z / Cmd+Shift+Z on macOS, Ctrl+Z / Ctrl+Shift+Z on other platforms).
• Column Width Display Modes — Switch between two display modes using the "Auto Arrange" button.
  • Auto Arrange Mode (window fit, default, button ON): Computes the average display width of each column's cell text (excluding the header) and distributes the window width in proportion to those averages. Re-distributes as the window resizes. Column headers are truncated with an ellipsis when they do not fit.
  • Content Width Mode (button OFF): Each column is sized based on its data content with no width limit. Horizontal scrolling is available when columns exceed the window width. Dragging a column boundary switches to this mode.
• Responsive Toolbar — When the panel is narrow, action buttons collapse to icons only, the search box shrinks, and the status bar is hidden, in progressive stages.
• Per-File Layout Persistence — Column-fit mode and word-wrap state are saved per file path and automatically restored on reopen. In Auto Arrange mode the column widths are recomputed each time (absolute widths are not persisted).
• Word Wrap — Wrap long text within cells, preserving in-cell line breaks. Toggleable via the toolbar button.
• Drag-to-Resize Columns — Drag the column boundary (a 12px-wide hit area centered on the boundary) to adjust column widths to any size.
• Column Sorting — Click a header to cycle through ascending, descending, and unsorted states. Numeric columns sort numerically; text columns sort in locale-aware lexicographic order.
• Search & Filtering — Real-time search across all cells. Only matching rows are displayed, with matching cells highlighted.
• Per-Column Filtering — A filter row sits directly beneath the header. Type in a column's box to filter by substring; conditions across multiple columns are combined with AND, and they also combine with the full-text search. The row stays pinned below the header while scrolling.
• Filter by Value Selection — Open the "▾" button in any column's filter box to see that column's distinct values with occurrence counts, and pick them with checkboxes. Selected values match exactly, which is what ID-like columns need (typing 1 matches 10 and 11; selecting 1 does not). The value list reflects the filters already applied to other columns, and a panel-local search narrows long lists.
• External Change Auto-Reload — When the file is rewritten outside the editor (by an AI agent, another editor, or a shell command), the table updates automatically while preserving scroll position, sort order, search query, and column widths. If you have unsaved edits, the extension asks whether to reload or keep your changes instead of overwriting them silently.
• Unsaved / External Change Indicators — Badges in the toolbar show when the document has unsaved edits and when the file has been changed outside the editor without being reloaded.
• Virtual Scrolling — Smooth 60fps scrolling even with 100,000+ row CSV files.
• Automatic Encoding Detection — Auto-detects UTF-8, Shift_JIS, and EUC-JP. Can also be set to a fixed encoding in settings. Files are saved back in the originally detected encoding.
• TSV Support — Supports both .csv and .tsv files. The delimiter is auto-detected and preserved on save.
• VS Code Theme Support — Automatically adapts to both light and dark themes.

Usage

1. Right-click a CSV or TSV file
2. Select "Open With..." then "CSV Viewer"
3. The CSV is displayed in table format and is immediately editable
4. Edit cells, insert/delete/reorder rows and columns, then Cmd+S / Ctrl+S to save

To set as the default editor, select "Configure default editor for '*.csv'..." from the "Open With..." menu.

Editing Shortcuts

Settings

Supported Encodings

Security

• CSP (Content Security Policy): All resource loading in the Webview is blocked by default. Only scripts with a nonce are allowed.
• HTML Escaping: CSV cell data is rendered via textContent only; HTML tags within CSV data are never interpreted, preventing XSS attacks. During cell editing, contenteditable="plaintext-only" is used and paste events are sanitized to text/plain only via the W3C-standard Selection/Range API.
• No External Communication: No network communication is performed. Files are only written on explicit save.

License

MIT