A spreadsheet app, not just a grid

Try it

1. Total a columnSelect Sales!G2:G49, then Home › Editing › AutoSum.A SUM lands under the last row.
2. Format a regionPick a region cell, then Fill Color, Borders or Merge & Center.The format is stored on the cells and survives XLSX export.
3. Change a priceEdit a unit price on the Sales sheet.Summary recalculates across sheets.
4. Read a notePoint at the amber corner on Sales!G3 to read it. Select the cell and press Shift+F2 to edit.The note opens beside the cell. Clear the note to delete it.
5. Use the right-click menuRight-click a cell, then Insert › Row above. The arrow keys work too.Undo removes the new row.
6. Narrow the windowUse the button to switch between a wide and narrow window.Fold the ribbonGroups shrink, then fold into dropdowns, as in Excel.

How it is built

// The full app: ribbon, name box, formula bar, tabs
createSpreadsheetShell(host, { ribbon: true, grid });

// The same ribbon on a grid of its own
createGrid(host, { workbook, config: { ribbon: true } });

Every ribbon command calls grid.actions, so your own toolbar can call the same methods.

Keyboard

Tab

Reach the ribbon tabs

←→

Move between tabs

Esc

Return to the grid

Hide or show the panel (double-click a tab).