@svgrid/grid 1.1.1 → 1.1.2

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 (50) hide show
  1. package/dist/FlexRender.svelte +96 -96
  2. package/dist/SvGrid.controller.svelte.js +17 -6
  3. package/dist/SvGrid.css +2012 -2012
  4. package/dist/SvGrid.svelte +2569 -2346
  5. package/dist/build-api.js +2 -2
  6. package/dist/cell-values.d.ts +1 -1
  7. package/dist/cell-values.js +7 -7
  8. package/dist/column-types.js +1 -1
  9. package/dist/core.d.ts +1 -1
  10. package/dist/core.js +2 -2
  11. package/dist/summaries.js +4 -4
  12. package/package.json +1 -1
  13. package/src/FlexRender.svelte +96 -96
  14. package/src/SvGrid.controller.svelte.ts +2363 -2352
  15. package/src/SvGrid.css +2012 -2012
  16. package/src/SvGrid.svelte +2569 -2346
  17. package/src/SvGrid.types.ts +537 -537
  18. package/src/a11y.contract.test.ts +49 -49
  19. package/src/a11y.test.ts +59 -59
  20. package/src/a11y.ts +59 -59
  21. package/src/build-api.ts +683 -683
  22. package/src/cell-formatting.ts +169 -169
  23. package/src/cell-values.ts +4 -4
  24. package/src/column-types.ts +1 -1
  25. package/src/core.performance.test.ts +30 -30
  26. package/src/core.ts +1077 -1077
  27. package/src/createGrid.svelte.ts +42 -42
  28. package/src/createGrid.test.ts +10 -10
  29. package/src/createGridState.svelte.ts +17 -17
  30. package/src/editing.ts +669 -669
  31. package/src/flex-render.ts +3 -3
  32. package/src/index.ts +208 -208
  33. package/src/keyboard.test.ts +59 -59
  34. package/src/keyboard.ts +97 -97
  35. package/src/merge-objects.ts +48 -48
  36. package/src/render-component.ts +28 -28
  37. package/src/spreadsheet.test.ts +489 -489
  38. package/src/spreadsheet.ts +304 -304
  39. package/src/static-functions.ts +11 -11
  40. package/src/subscribe.ts +38 -38
  41. package/src/summaries.ts +4 -4
  42. package/src/svgrid-wrapper.types.ts +412 -412
  43. package/src/svgrid.features.test.ts +157 -157
  44. package/src/svgrid.wrapper.test.ts +40 -40
  45. package/src/virtualization/column-virtualizer.test.ts +27 -27
  46. package/src/virtualization/column-virtualizer.ts +30 -30
  47. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  48. package/src/virtualization/types.ts +30 -30
  49. package/src/virtualization/virtualizer.test.ts +47 -47
  50. package/src/virtualization/virtualizer.ts +296 -296
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
+ }
@@ -1,48 +1,48 @@
1
- /**
2
- * Merges objects together while keeping their getters alive.
3
- * Taken from SolidJS:
4
- * https://github.com/solidjs/solid/blob/24abc825c0996fd2bc8c1de1491efe9a7e743aff/packages/solid/src/server/rendering.ts#L82-L115
5
- */
6
- export function mergeObjects<T>(source: T): T
7
- export function mergeObjects<T, U>(source: T, source1: U): T & U
8
- export function mergeObjects<T, U, V>(
9
- source: T,
10
- source1: U,
11
- source2: V,
12
- ): T & U & V
13
- export function mergeObjects<T, U, V, W>(
14
- source: T,
15
- source1: U,
16
- source2: V,
17
- source3: W,
18
- ): T & U & V & W
19
- export function mergeObjects(...sources: any): any {
20
- const target = {}
21
-
22
- for (let source of sources) {
23
- if (typeof source === 'function') source = source()
24
-
25
- if (source) {
26
- const descriptors = Object.getOwnPropertyDescriptors(source)
27
-
28
- for (const key in descriptors) {
29
- if (key in target) continue
30
-
31
- Object.defineProperty(target, key, {
32
- enumerable: true,
33
- get() {
34
- for (let i = sources.length - 1; i >= 0; i--) {
35
- let scopedSource = sources[i]
36
- if (typeof scopedSource === 'function') scopedSource = scopedSource()
37
-
38
- const value = (scopedSource || {})[key]
39
- if (value !== undefined) return value
40
- }
41
- },
42
- })
43
- }
44
- }
45
- }
46
-
47
- return target
48
- }
1
+ /**
2
+ * Merges objects together while keeping their getters alive.
3
+ * Taken from SolidJS:
4
+ * https://github.com/solidjs/solid/blob/24abc825c0996fd2bc8c1de1491efe9a7e743aff/packages/solid/src/server/rendering.ts#L82-L115
5
+ */
6
+ export function mergeObjects<T>(source: T): T
7
+ export function mergeObjects<T, U>(source: T, source1: U): T & U
8
+ export function mergeObjects<T, U, V>(
9
+ source: T,
10
+ source1: U,
11
+ source2: V,
12
+ ): T & U & V
13
+ export function mergeObjects<T, U, V, W>(
14
+ source: T,
15
+ source1: U,
16
+ source2: V,
17
+ source3: W,
18
+ ): T & U & V & W
19
+ export function mergeObjects(...sources: any): any {
20
+ const target = {}
21
+
22
+ for (let source of sources) {
23
+ if (typeof source === 'function') source = source()
24
+
25
+ if (source) {
26
+ const descriptors = Object.getOwnPropertyDescriptors(source)
27
+
28
+ for (const key in descriptors) {
29
+ if (key in target) continue
30
+
31
+ Object.defineProperty(target, key, {
32
+ enumerable: true,
33
+ get() {
34
+ for (let i = sources.length - 1; i >= 0; i--) {
35
+ let scopedSource = sources[i]
36
+ if (typeof scopedSource === 'function') scopedSource = scopedSource()
37
+
38
+ const value = (scopedSource || {})[key]
39
+ if (value !== undefined) return value
40
+ }
41
+ },
42
+ })
43
+ }
44
+ }
45
+ }
46
+
47
+ return target
48
+ }
@@ -1,28 +1,28 @@
1
- import type { Component, ComponentProps, Snippet } from 'svelte'
2
-
3
- export class RenderComponentConfig<TComponent extends Component> {
4
- constructor(
5
- public component: TComponent,
6
- public props?: ComponentProps<TComponent> | Record<string, never>,
7
- ) {}
8
- }
9
-
10
- export class RenderSnippetConfig<TProps> {
11
- constructor(
12
- public snippet: Snippet<[TProps]>,
13
- public params?: TProps,
14
- ) {}
15
- }
16
-
17
- export const renderComponent = <
18
- TComponent extends Component<any>,
19
- TProps extends ComponentProps<TComponent>,
20
- >(
21
- component: TComponent,
22
- props?: TProps,
23
- ) => new RenderComponentConfig(component, props)
24
-
25
- export const renderSnippet = <TProps>(
26
- snippet: Snippet<[TProps]>,
27
- params?: TProps,
28
- ) => new RenderSnippetConfig(snippet, params)
1
+ import type { Component, ComponentProps, Snippet } from 'svelte'
2
+
3
+ export class RenderComponentConfig<TComponent extends Component> {
4
+ constructor(
5
+ public component: TComponent,
6
+ public props?: ComponentProps<TComponent> | Record<string, never>,
7
+ ) {}
8
+ }
9
+
10
+ export class RenderSnippetConfig<TProps> {
11
+ constructor(
12
+ public snippet: Snippet<[TProps]>,
13
+ public params?: TProps,
14
+ ) {}
15
+ }
16
+
17
+ export const renderComponent = <
18
+ TComponent extends Component<any>,
19
+ TProps extends ComponentProps<TComponent>,
20
+ >(
21
+ component: TComponent,
22
+ props?: TProps,
23
+ ) => new RenderComponentConfig(component, props)
24
+
25
+ export const renderSnippet = <TProps>(
26
+ snippet: Snippet<[TProps]>,
27
+ params?: TProps,
28
+ ) => new RenderSnippetConfig(snippet, params)