@svgrid/grid 2.0.2 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/dist/FlexRender.svelte +96 -96
  2. package/dist/GridFooter.svelte +178 -178
  3. package/dist/SvGrid.css +2377 -2376
  4. package/dist/SvGrid.svelte +2764 -2764
  5. package/dist/SvGridBoard.svelte +2281 -2281
  6. package/dist/SvGridDropdown.svelte +666 -666
  7. package/dist/cdn/svgrid.js +3 -3
  8. package/dist/cdn/svgrid.svelte-external.js +3 -3
  9. package/dist/themes/index.d.ts +45 -0
  10. package/dist/themes/index.js +132 -0
  11. package/package.json +92 -85
  12. package/src/FlexRender.svelte +96 -96
  13. package/src/GridFooter.svelte +178 -178
  14. package/src/SvGrid.controller.svelte.ts +2553 -2553
  15. package/src/SvGrid.css +2377 -2376
  16. package/src/SvGrid.svelte +2764 -2764
  17. package/src/SvGrid.types.ts +944 -944
  18. package/src/SvGridBoard.svelte +2281 -2281
  19. package/src/SvGridDropdown.svelte +666 -666
  20. package/src/a11y.contract.test.ts +49 -49
  21. package/src/a11y.test.ts +59 -59
  22. package/src/a11y.ts +61 -61
  23. package/src/build-api.ts +798 -798
  24. package/src/cell-formatting.ts +169 -169
  25. package/src/cell-render.ts +469 -469
  26. package/src/collaboration.test.ts +104 -104
  27. package/src/collaboration.ts +167 -167
  28. package/src/core.performance.test.ts +30 -30
  29. package/src/core.ts +1111 -1111
  30. package/src/createGrid.svelte.ts +42 -42
  31. package/src/createGrid.test.ts +10 -10
  32. package/src/createGridState.svelte.ts +17 -17
  33. package/src/editing.test.ts +859 -859
  34. package/src/editing.ts +675 -675
  35. package/src/export-data-api.test.ts +126 -126
  36. package/src/export-format.test.ts +107 -107
  37. package/src/export-format.ts +598 -598
  38. package/src/flex-render.ts +3 -3
  39. package/src/index.ts +463 -463
  40. package/src/keyboard.test.ts +59 -59
  41. package/src/keyboard.ts +97 -97
  42. package/src/menus.ts +582 -582
  43. package/src/merge-objects.ts +48 -48
  44. package/src/render-component.ts +28 -28
  45. package/src/selection.test.ts +754 -754
  46. package/src/selection.ts +600 -600
  47. package/src/server-data-source.test.ts +289 -289
  48. package/src/server-data-source.ts +413 -413
  49. package/src/sparkline.test.ts +68 -68
  50. package/src/sparkline.ts +169 -169
  51. package/src/spreadsheet.test.ts +489 -489
  52. package/src/spreadsheet.ts +304 -304
  53. package/src/static-functions.ts +11 -11
  54. package/src/subscribe.ts +38 -38
  55. package/src/svgrid-wrapper.types.ts +439 -439
  56. package/src/svgrid.behavior.test.ts +706 -706
  57. package/src/svgrid.features.test.ts +157 -157
  58. package/src/svgrid.new-features.wrapper.test.ts +251 -251
  59. package/src/svgrid.wrapper.test.ts +40 -40
  60. package/src/themes/index.ts +159 -0
  61. package/src/virtualization/column-virtualizer.test.ts +27 -27
  62. package/src/virtualization/column-virtualizer.ts +30 -30
  63. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  64. package/src/virtualization/types.ts +30 -30
  65. package/src/virtualization/virtualizer.test.ts +47 -47
  66. package/src/virtualization/virtualizer.ts +296 -296
  67. package/themes/ag-alpine.css +59 -0
  68. package/themes/antd.css +59 -0
  69. package/themes/atlassian.css +59 -0
  70. package/themes/bootstrap.css +59 -0
  71. package/themes/carbon.css +59 -0
  72. package/themes/catppuccin.css +59 -0
  73. package/themes/dracula.css +59 -0
  74. package/themes/excel.css +59 -0
  75. package/themes/fluent.css +59 -0
  76. package/themes/github.css +59 -0
  77. package/themes/linear.css +59 -0
  78. package/themes/material.css +59 -0
  79. package/themes/nord.css +59 -0
  80. package/themes/notion.css +59 -0
  81. package/themes/salesforce.css +59 -0
  82. package/themes/sap.css +59 -0
  83. package/themes/shadcn.css +59 -0
  84. package/themes/tailwind.css +59 -0
  85. package/themes/vercel.css +59 -0
@@ -1,59 +1,59 @@
1
- import { describe, expect, it } from 'vitest'
2
- import { getKeyboardIntent, getNextActiveCell } from './keyboard'
3
-
4
- describe('keyboard navigation engine', () => {
5
- it('maps keys to navigation intents', () => {
6
- expect(getKeyboardIntent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))).toBe(
7
- 'moveLeft',
8
- )
9
- expect(getKeyboardIntent(new KeyboardEvent('keydown', { key: 'Home', ctrlKey: true }))).toBe(
10
- 'gridStart',
11
- )
12
- expect(getKeyboardIntent(new KeyboardEvent('keydown', { key: ' ' }))).toBe(
13
- 'activate',
14
- )
15
- })
16
-
17
- it('computes next active cell within bounds', () => {
18
- const next = getNextActiveCell(
19
- { rowIndex: 1, colIndex: 1, cellId: null },
20
- 'moveDown',
21
- { maxRow: 2, maxCol: 3, pageSize: 10 },
22
- )
23
- expect(next.rowIndex).toBe(2)
24
- expect(next.colIndex).toBe(1)
25
- })
26
-
27
- it('handles row and grid boundary intents', () => {
28
- const rowEnd = getNextActiveCell(
29
- { rowIndex: 2, colIndex: 1, cellId: null },
30
- 'rowEnd',
31
- { maxRow: 2, maxCol: 4, pageSize: 2 },
32
- )
33
- expect(rowEnd.colIndex).toBe(4)
34
-
35
- const gridStart = getNextActiveCell(
36
- { rowIndex: 2, colIndex: 4, cellId: null },
37
- 'gridStart',
38
- { maxRow: 2, maxCol: 4, pageSize: 2 },
39
- )
40
- expect(gridStart.rowIndex).toBe(0)
41
- expect(gridStart.colIndex).toBe(0)
42
- })
43
-
44
- it('clamps page navigation to valid bounds', () => {
45
- const pageUp = getNextActiveCell(
46
- { rowIndex: 1, colIndex: 0, cellId: null },
47
- 'pageUp',
48
- { maxRow: 20, maxCol: 2, pageSize: 10 },
49
- )
50
- const pageDown = getNextActiveCell(
51
- { rowIndex: 18, colIndex: 0, cellId: null },
52
- 'pageDown',
53
- { maxRow: 20, maxCol: 2, pageSize: 10 },
54
- )
55
-
56
- expect(pageUp.rowIndex).toBe(0)
57
- expect(pageDown.rowIndex).toBe(20)
58
- })
59
- })
1
+ import { describe, expect, it } from 'vitest'
2
+ import { getKeyboardIntent, getNextActiveCell } from './keyboard'
3
+
4
+ describe('keyboard navigation engine', () => {
5
+ it('maps keys to navigation intents', () => {
6
+ expect(getKeyboardIntent(new KeyboardEvent('keydown', { key: 'ArrowLeft' }))).toBe(
7
+ 'moveLeft',
8
+ )
9
+ expect(getKeyboardIntent(new KeyboardEvent('keydown', { key: 'Home', ctrlKey: true }))).toBe(
10
+ 'gridStart',
11
+ )
12
+ expect(getKeyboardIntent(new KeyboardEvent('keydown', { key: ' ' }))).toBe(
13
+ 'activate',
14
+ )
15
+ })
16
+
17
+ it('computes next active cell within bounds', () => {
18
+ const next = getNextActiveCell(
19
+ { rowIndex: 1, colIndex: 1, cellId: null },
20
+ 'moveDown',
21
+ { maxRow: 2, maxCol: 3, pageSize: 10 },
22
+ )
23
+ expect(next.rowIndex).toBe(2)
24
+ expect(next.colIndex).toBe(1)
25
+ })
26
+
27
+ it('handles row and grid boundary intents', () => {
28
+ const rowEnd = getNextActiveCell(
29
+ { rowIndex: 2, colIndex: 1, cellId: null },
30
+ 'rowEnd',
31
+ { maxRow: 2, maxCol: 4, pageSize: 2 },
32
+ )
33
+ expect(rowEnd.colIndex).toBe(4)
34
+
35
+ const gridStart = getNextActiveCell(
36
+ { rowIndex: 2, colIndex: 4, cellId: null },
37
+ 'gridStart',
38
+ { maxRow: 2, maxCol: 4, pageSize: 2 },
39
+ )
40
+ expect(gridStart.rowIndex).toBe(0)
41
+ expect(gridStart.colIndex).toBe(0)
42
+ })
43
+
44
+ it('clamps page navigation to valid bounds', () => {
45
+ const pageUp = getNextActiveCell(
46
+ { rowIndex: 1, colIndex: 0, cellId: null },
47
+ 'pageUp',
48
+ { maxRow: 20, maxCol: 2, pageSize: 10 },
49
+ )
50
+ const pageDown = getNextActiveCell(
51
+ { rowIndex: 18, colIndex: 0, cellId: null },
52
+ 'pageDown',
53
+ { maxRow: 20, maxCol: 2, pageSize: 10 },
54
+ )
55
+
56
+ expect(pageUp.rowIndex).toBe(0)
57
+ expect(pageDown.rowIndex).toBe(20)
58
+ })
59
+ })
package/src/keyboard.ts CHANGED
@@ -1,97 +1,97 @@
1
- import type { ActiveCellState } from './core'
2
-
3
- export type GridKeyboardIntent =
4
- | 'moveLeft'
5
- | 'moveRight'
6
- | 'moveUp'
7
- | 'moveDown'
8
- | 'tabNext'
9
- | 'tabPrev'
10
- | 'rowStart'
11
- | 'rowEnd'
12
- | 'gridStart'
13
- | 'gridEnd'
14
- | 'pageUp'
15
- | 'pageDown'
16
- | 'activate'
17
- | 'clearCells'
18
- | 'noop'
19
-
20
- export function getKeyboardIntent(event: KeyboardEvent): GridKeyboardIntent {
21
- // Ctrl+Home / Ctrl+End come before plain Home / End so the modifier wins.
22
- if (event.ctrlKey && event.key === 'Home') return 'gridStart'
23
- if (event.ctrlKey && event.key === 'End') return 'gridEnd'
24
-
25
- if (event.key === 'ArrowLeft') return 'moveLeft'
26
- if (event.key === 'ArrowRight') return 'moveRight'
27
- if (event.key === 'ArrowUp') return 'moveUp'
28
- if (event.key === 'ArrowDown') return 'moveDown'
29
- if (event.key === 'Home') return 'rowStart'
30
- if (event.key === 'End') return 'rowEnd'
31
- if (event.key === 'PageUp') return 'pageUp'
32
- if (event.key === 'PageDown') return 'pageDown'
33
-
34
- // Excel-style data-entry navigation:
35
- // Enter → move down (Shift+Enter → up)
36
- // Tab → move right (Shift+Tab → left), wraps at row boundaries
37
- // Delete → clear contents of the selected cells
38
- // F2 / Space → start editing the active cell
39
- if (event.key === 'Enter') return event.shiftKey ? 'moveUp' : 'moveDown'
40
- if (event.key === 'Tab') return event.shiftKey ? 'tabPrev' : 'tabNext'
41
- if (event.key === 'F2') return 'activate'
42
- if (event.key === ' ') return 'activate'
43
- if (event.key === 'Delete') return 'clearCells'
44
-
45
- return 'noop'
46
- }
47
-
48
- export function getNextActiveCell(
49
- current: ActiveCellState,
50
- intent: GridKeyboardIntent,
51
- bounds: { maxRow: number; maxCol: number; pageSize?: number },
52
- ): ActiveCellState {
53
- const pageSize = bounds.pageSize ?? 10
54
- let rowIndex = current.rowIndex
55
- let colIndex = current.colIndex
56
-
57
- if (intent === 'moveLeft') colIndex -= 1
58
- if (intent === 'moveRight') colIndex += 1
59
- if (intent === 'moveUp') rowIndex -= 1
60
- if (intent === 'moveDown') rowIndex += 1
61
- if (intent === 'tabNext') {
62
- // Right one column; if we fall off the right edge, wrap to the
63
- // first column of the next row - Excel's "data entry" behavior.
64
- colIndex += 1
65
- if (colIndex > bounds.maxCol) {
66
- colIndex = 0
67
- rowIndex += 1
68
- }
69
- }
70
- if (intent === 'tabPrev') {
71
- colIndex -= 1
72
- if (colIndex < 0) {
73
- colIndex = bounds.maxCol
74
- rowIndex -= 1
75
- }
76
- }
77
- if (intent === 'rowStart') colIndex = 0
78
- if (intent === 'rowEnd') colIndex = bounds.maxCol
79
- if (intent === 'gridStart') {
80
- rowIndex = 0
81
- colIndex = 0
82
- }
83
- if (intent === 'gridEnd') {
84
- rowIndex = bounds.maxRow
85
- colIndex = bounds.maxCol
86
- }
87
- if (intent === 'pageUp') rowIndex -= pageSize
88
- if (intent === 'pageDown') rowIndex += pageSize
89
-
90
- rowIndex = Math.min(Math.max(rowIndex, 0), Math.max(bounds.maxRow, 0))
91
- colIndex = Math.min(Math.max(colIndex, 0), Math.max(bounds.maxCol, 0))
92
- return {
93
- rowIndex,
94
- colIndex,
95
- cellId: current.cellId,
96
- }
97
- }
1
+ import type { ActiveCellState } from './core'
2
+
3
+ export type GridKeyboardIntent =
4
+ | 'moveLeft'
5
+ | 'moveRight'
6
+ | 'moveUp'
7
+ | 'moveDown'
8
+ | 'tabNext'
9
+ | 'tabPrev'
10
+ | 'rowStart'
11
+ | 'rowEnd'
12
+ | 'gridStart'
13
+ | 'gridEnd'
14
+ | 'pageUp'
15
+ | 'pageDown'
16
+ | 'activate'
17
+ | 'clearCells'
18
+ | 'noop'
19
+
20
+ export function getKeyboardIntent(event: KeyboardEvent): GridKeyboardIntent {
21
+ // Ctrl+Home / Ctrl+End come before plain Home / End so the modifier wins.
22
+ if (event.ctrlKey && event.key === 'Home') return 'gridStart'
23
+ if (event.ctrlKey && event.key === 'End') return 'gridEnd'
24
+
25
+ if (event.key === 'ArrowLeft') return 'moveLeft'
26
+ if (event.key === 'ArrowRight') return 'moveRight'
27
+ if (event.key === 'ArrowUp') return 'moveUp'
28
+ if (event.key === 'ArrowDown') return 'moveDown'
29
+ if (event.key === 'Home') return 'rowStart'
30
+ if (event.key === 'End') return 'rowEnd'
31
+ if (event.key === 'PageUp') return 'pageUp'
32
+ if (event.key === 'PageDown') return 'pageDown'
33
+
34
+ // Excel-style data-entry navigation:
35
+ // Enter → move down (Shift+Enter → up)
36
+ // Tab → move right (Shift+Tab → left), wraps at row boundaries
37
+ // Delete → clear contents of the selected cells
38
+ // F2 / Space → start editing the active cell
39
+ if (event.key === 'Enter') return event.shiftKey ? 'moveUp' : 'moveDown'
40
+ if (event.key === 'Tab') return event.shiftKey ? 'tabPrev' : 'tabNext'
41
+ if (event.key === 'F2') return 'activate'
42
+ if (event.key === ' ') return 'activate'
43
+ if (event.key === 'Delete') return 'clearCells'
44
+
45
+ return 'noop'
46
+ }
47
+
48
+ export function getNextActiveCell(
49
+ current: ActiveCellState,
50
+ intent: GridKeyboardIntent,
51
+ bounds: { maxRow: number; maxCol: number; pageSize?: number },
52
+ ): ActiveCellState {
53
+ const pageSize = bounds.pageSize ?? 10
54
+ let rowIndex = current.rowIndex
55
+ let colIndex = current.colIndex
56
+
57
+ if (intent === 'moveLeft') colIndex -= 1
58
+ if (intent === 'moveRight') colIndex += 1
59
+ if (intent === 'moveUp') rowIndex -= 1
60
+ if (intent === 'moveDown') rowIndex += 1
61
+ if (intent === 'tabNext') {
62
+ // Right one column; if we fall off the right edge, wrap to the
63
+ // first column of the next row - Excel's "data entry" behavior.
64
+ colIndex += 1
65
+ if (colIndex > bounds.maxCol) {
66
+ colIndex = 0
67
+ rowIndex += 1
68
+ }
69
+ }
70
+ if (intent === 'tabPrev') {
71
+ colIndex -= 1
72
+ if (colIndex < 0) {
73
+ colIndex = bounds.maxCol
74
+ rowIndex -= 1
75
+ }
76
+ }
77
+ if (intent === 'rowStart') colIndex = 0
78
+ if (intent === 'rowEnd') colIndex = bounds.maxCol
79
+ if (intent === 'gridStart') {
80
+ rowIndex = 0
81
+ colIndex = 0
82
+ }
83
+ if (intent === 'gridEnd') {
84
+ rowIndex = bounds.maxRow
85
+ colIndex = bounds.maxCol
86
+ }
87
+ if (intent === 'pageUp') rowIndex -= pageSize
88
+ if (intent === 'pageDown') rowIndex += pageSize
89
+
90
+ rowIndex = Math.min(Math.max(rowIndex, 0), Math.max(bounds.maxRow, 0))
91
+ colIndex = Math.min(Math.max(colIndex, 0), Math.max(bounds.maxCol, 0))
92
+ return {
93
+ rowIndex,
94
+ colIndex,
95
+ cellId: current.cellId,
96
+ }
97
+ }