An open-source headless spreadsheet for business web apps
AllCellPrecedents={start}
let Q be an empty queue
Q.enqueue(start)
while Q is not empty do
cell := Q.dequeue()
S := getCellPrecedents(cell)
for all cells c in S do:
if c is not in AllCellPrecedents then:
insert w to AllCellPrecedents
Q.enqueue(c)
AllCellDependents={start}
let Q be an empty queue
Q.enqueue(start)
while Q is not empty do
cell := Q.dequeue()
S := getCellDependents(cell)
for all cells c in S do:
if c is not in AllCellDependents then:
insert w to AllCellDependents
Q.enqueue(c)
| {{ cell }} | }
| {{ cell }} |
| {String(cell ?? '')} | ))}
Result: {result}
{/if}| {#if hf.doesCellHaveFormula({ sheet: sheetId, row: r, col: c })} {hf.getCellFormula({ sheet: sheetId, row: r, col: c })} {:else} {hf.getCellValue({ sheet: sheetId, row: r, col: c })} {/if} | {/each}
Result: {result}
{/if} ``` ## Next steps - [Configuration options](https://handsontable.com/docs/hyperformula/guide/configuration-options.md) — full list of `buildFromArray` / `buildEmpty` options - [Basic operations](https://handsontable.com/docs/hyperformula/guide/basic-operations.md) — CRUD on cells, rows, columns, sheets - [Advanced usage](https://handsontable.com/docs/hyperformula/guide/advanced-usage.md) — multi-sheet workbooks, named expressions - [Custom functions](https://handsontable.com/docs/hyperformula/guide/custom-functions.md) — register your own formulas ## Demo For a more advanced example, check out the [Svelte demo on Stackblitz](https://stackblitz.com/github/handsontable/hyperformula-demos/tree/3.5.x/svelte-demo?v=30%2F10%2F2026%2006%3A35%3A01). --- ## Integration with Vue URL: https://handsontable.com/docs/hyperformula/guide/integration-with-vue.html # Integration with Vue The HyperFormula API is identical in a Vue 3 app and in plain JavaScript. This guide demonstrates how HyperFormula integrates with the Vue reactivity system and how to surface its values in the template. Install with `npm install hyperformula`. For other options, see the [client-side installation](https://handsontable.com/docs/hyperformula/guide/client-side-installation.md) section. > **TypeScript** > > All examples use TypeScript. Remove the type annotations to use plain JavaScript. ## Basic usage Pass the HyperFormula instance through Vue's [`markRaw`](https://vuejs.org/api/reactivity-advanced.html#markraw) to opt it out of the reactivity system (see [Troubleshooting](#vue-reactivity-issues) below for why this matters). Hold derived data in `ref` so the template updates when you reassign the ref's `.value`. ```vue| {{ cell }} |
| Precedence | Operator | Description |
|---|---|---|
| 1 |
: (colon) , (comma) (space) |
Reference operators: range (colon), union (comma), intersection (space). Currently supported by HyperFormula only at the grammar level of a function. |
| 2 | – | Negation |
| 3 | % | Percent |
| 4 | ^ | Exponentiation |
| 5 | * and / | Multiplication and division |
| 6 | + and – | Addition and subtraction |
| 7 | & (ampersand) | Concatenation of two or more text strings |
| 8 |
< (less than) = (equal to) > (greater than) <= (less than or equal to) >= (greater than or equal to) <> (not equal to) |
Comparison |
| Feature | Maximum limit |
|---|---|
| Number of cells |
Limited by system resources (JavaScript) Can be set in the configuration:
|
| Number of nested levels of functions | 120 |
| Earliest date allowed for the calculation | December 30, 1899 |
| Latest date allowed for the calculation | December 31, 9999 |
| Number of named expressions | Limited by system resources (JavaScript) |
| Characters in a cell | Limited by system resources (JavaScript) |
| Characters in a named expression | Limited by system resources (JavaScript) |
| Characters in a sheet name | Limited by system resources (JavaScript) |
| Characters in a column name | Depends on the configuration of MaxColumns |
| Number of sheets in a workbook | Limited by system resources (JavaScript) |
| Number of custom functions | Limited by system resources (JavaScript) |
| Undo levels | Limited by the configuration - undoLimit (default: 20) |
| Number of elements in a batch operation | Limited by system resources (JavaScript) |