@svgrid/grid 2.2.27 → 2.2.29

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 (248) hide show
  1. package/README.md +199 -199
  2. package/dist/FlexRender.svelte +96 -96
  3. package/dist/GridFooter.svelte +179 -179
  4. package/dist/GridMenus.svelte +782 -734
  5. package/dist/SvAutoComplete.svelte +165 -165
  6. package/dist/SvCalendar.svelte +503 -503
  7. package/dist/SvCarousel.svelte +141 -141
  8. package/dist/SvCheckBox.svelte +101 -101
  9. package/dist/SvColorInput.svelte +181 -181
  10. package/dist/SvComboBox.svelte +275 -275
  11. package/dist/SvContextMenu.svelte +116 -116
  12. package/dist/SvCountryInput.svelte +160 -160
  13. package/dist/SvDrawer.svelte +254 -250
  14. package/dist/SvDropDownList.svelte +374 -374
  15. package/dist/SvDurationInput.svelte +126 -126
  16. package/dist/SvField.svelte +293 -293
  17. package/dist/SvForm.svelte +437 -437
  18. package/dist/SvGrid.controller.svelte.d.ts +14 -1
  19. package/dist/SvGrid.controller.svelte.js +112 -28
  20. package/dist/SvGrid.css +2704 -2723
  21. package/dist/SvGrid.svelte +3361 -3333
  22. package/dist/SvGrid.types.d.ts +20 -5
  23. package/dist/SvGridChart.svelte +1724 -1724
  24. package/dist/SvGridChartPanel.svelte +485 -485
  25. package/dist/SvGridChartView.svelte +70 -70
  26. package/dist/SvGridDropdown.svelte +696 -696
  27. package/dist/SvGridSelect.svelte +259 -259
  28. package/dist/SvGroupCell.svelte +109 -109
  29. package/dist/SvListBox.svelte +326 -287
  30. package/dist/SvListBox.svelte.d.ts +10 -1
  31. package/dist/SvMaskedInput.svelte +122 -122
  32. package/dist/SvMenu.svelte +124 -124
  33. package/dist/SvMenuList.svelte +146 -146
  34. package/dist/SvMultiSelect.svelte +281 -281
  35. package/dist/SvNumberInput.svelte +168 -168
  36. package/dist/SvOtpInput.svelte +158 -158
  37. package/dist/SvPasswordInput.svelte +151 -151
  38. package/dist/SvPhoneInput.svelte +133 -131
  39. package/dist/SvPopover.svelte +197 -197
  40. package/dist/SvRadioGroup.svelte +107 -107
  41. package/dist/SvRowGroupPanel.svelte +170 -170
  42. package/dist/SvScrollArea.svelte +61 -61
  43. package/dist/SvSlider.svelte +200 -200
  44. package/dist/SvSwitchButton.svelte +107 -107
  45. package/dist/SvTagsInput.svelte +112 -112
  46. package/dist/SvTextInput.svelte +147 -147
  47. package/dist/SvTimePicker.svelte +245 -245
  48. package/dist/SvToaster.svelte +159 -159
  49. package/dist/SvToggleButton.svelte +85 -85
  50. package/dist/SvTooltip.svelte +161 -161
  51. package/dist/SvTour.svelte +204 -204
  52. package/dist/SvTree.svelte +437 -437
  53. package/dist/SvTreeSelect.svelte +233 -233
  54. package/dist/cdn/GridMenus-Da_p7SKS.js +486 -0
  55. package/dist/cdn/GridMenus-Ds3OpzZT.js +490 -0
  56. package/dist/cdn/{SvDateTimePicker-B1sDc9Pz.js → SvDateTimePicker-B8GopjhC.js} +2 -2
  57. package/dist/cdn/{SvDateTimePicker-Bh0FTs1E.js → SvDateTimePicker-DB0aIEk8.js} +2 -2
  58. package/dist/cdn/{SvGridChart-Bgk4hDs8.js → SvGridChart-BcLCYvw9.js} +1 -1
  59. package/dist/cdn/{SvGridChart-BKQsO5fZ.js → SvGridChart-BhnFdLd0.js} +1 -1
  60. package/dist/cdn/{SvGridChartPanel-DkCc2Z7b.js → SvGridChartPanel-Cmx9DHAS.js} +1 -1
  61. package/dist/cdn/{SvGridChartPanel-DSkHIQDd.js → SvGridChartPanel-DvjwxLvK.js} +1 -1
  62. package/dist/cdn/{SvGridChartView-BrbVaELm.js → SvGridChartView-B40DTJSX.js} +1 -1
  63. package/dist/cdn/{SvGridChartView-i9rWvSKg.js → SvGridChartView-PwqI4s02.js} +1 -1
  64. package/dist/cdn/{SvGridDropdown-D08sVmAy.js → SvGridDropdown-DjALc_4f.js} +1 -1
  65. package/dist/cdn/{SvGridDropdown-CGxxopQ4.js → SvGridDropdown-hpnHvOGt.js} +1 -1
  66. package/dist/cdn/{src-cgs1wcUS.js → src-BLJfdyL0.js} +4034 -3889
  67. package/dist/cdn/{src-Cw8d9U8j.js → src-DYDCiC0D.js} +7053 -6908
  68. package/dist/cdn/svgrid.js +9 -9
  69. package/dist/cdn/svgrid.svelte-external.js +9 -9
  70. package/dist/chart-export.js +8 -8
  71. package/dist/column-groups.js +8 -10
  72. package/dist/column-id.d.ts +9 -0
  73. package/dist/column-id.js +25 -0
  74. package/dist/core.js +2 -1
  75. package/dist/createListbox.svelte.d.ts +15 -2
  76. package/dist/createListbox.svelte.js +27 -6
  77. package/dist/editing.d.ts +1 -0
  78. package/dist/editing.js +45 -10
  79. package/dist/filtering/excel-filters.d.ts +30 -10
  80. package/dist/filtering/excel-filters.js +96 -15
  81. package/dist/index.d.ts +2 -2
  82. package/dist/index.js +2 -2
  83. package/dist/menus.d.ts +2 -0
  84. package/dist/menus.js +25 -0
  85. package/dist/row-resize.js +40 -0
  86. package/dist/selection.js +1 -1
  87. package/package.json +10 -10
  88. package/src/FlexRender.svelte +96 -96
  89. package/src/GridFooter.svelte +179 -179
  90. package/src/GridMenus.svelte +782 -734
  91. package/src/SvAutoComplete.svelte +165 -165
  92. package/src/SvCalendar.svelte +503 -503
  93. package/src/SvCalendar.test.ts +226 -226
  94. package/src/SvCarousel.svelte +141 -141
  95. package/src/SvCheckBox.svelte +101 -101
  96. package/src/SvColorInput.svelte +181 -181
  97. package/src/SvComboBox.svelte +275 -275
  98. package/src/SvContextMenu.svelte +116 -116
  99. package/src/SvCountryInput.svelte +160 -160
  100. package/src/SvDrawer.svelte +254 -250
  101. package/src/SvDrawer.test.ts +18 -1
  102. package/src/SvDropDownList.svelte +374 -374
  103. package/src/SvDurationInput.svelte +126 -126
  104. package/src/SvField.svelte +293 -293
  105. package/src/SvForm.svelte +437 -437
  106. package/src/SvForm.test.ts +411 -411
  107. package/src/SvGrid.controller.svelte.ts +3335 -3239
  108. package/src/SvGrid.css +2704 -2723
  109. package/src/SvGrid.svelte +3361 -3333
  110. package/src/SvGrid.types.ts +1628 -1613
  111. package/src/SvGridChart.svelte +1724 -1724
  112. package/src/SvGridChartPanel.svelte +485 -485
  113. package/src/SvGridChartView.svelte +70 -70
  114. package/src/SvGridDropdown.svelte +696 -696
  115. package/src/SvGridSelect.svelte +259 -259
  116. package/src/SvGroupCell.svelte +109 -109
  117. package/src/SvListBox.svelte +326 -287
  118. package/src/SvMaskedInput.svelte +122 -122
  119. package/src/SvMenu.svelte +124 -124
  120. package/src/SvMenu.test.ts +97 -97
  121. package/src/SvMenuList.svelte +146 -146
  122. package/src/SvMultiSelect.svelte +281 -281
  123. package/src/SvNavPane.test.ts +15 -4
  124. package/src/SvNumberInput.svelte +168 -168
  125. package/src/SvOtpInput.svelte +158 -158
  126. package/src/SvPasswordInput.svelte +151 -151
  127. package/src/SvPhoneInput.svelte +133 -131
  128. package/src/SvPopover.svelte +197 -197
  129. package/src/SvRadioGroup.svelte +107 -107
  130. package/src/SvRowGroupPanel.svelte +170 -170
  131. package/src/SvScrollArea.svelte +61 -61
  132. package/src/SvSlider.svelte +200 -200
  133. package/src/SvSwitchButton.svelte +107 -107
  134. package/src/SvTagsInput.svelte +112 -112
  135. package/src/SvTextInput.svelte +147 -147
  136. package/src/SvTimePicker.svelte +245 -245
  137. package/src/SvToaster.svelte +159 -159
  138. package/src/SvToaster.test.ts +95 -95
  139. package/src/SvToggleButton.svelte +85 -85
  140. package/src/SvTooltip.svelte +161 -161
  141. package/src/SvTour.svelte +204 -204
  142. package/src/SvTree.svelte +437 -437
  143. package/src/SvTreeSelect.svelte +233 -233
  144. package/src/a11y/dismissable.test.ts +119 -119
  145. package/src/a11y/dismissable.ts +114 -114
  146. package/src/a11y.contract.test.ts +49 -49
  147. package/src/a11y.test.ts +59 -59
  148. package/src/a11y.ts +61 -61
  149. package/src/ai.test.ts +502 -502
  150. package/src/ai.ts +1391 -1391
  151. package/src/build-api.coverage.test.ts +633 -633
  152. package/src/build-api.ts +895 -895
  153. package/src/builtin-editors.grid.test.ts +85 -85
  154. package/src/cell-formatting.ts +169 -169
  155. package/src/cell-render.ts +469 -469
  156. package/src/chart-export.ts +201 -201
  157. package/src/chart-view.svelte.ts +36 -36
  158. package/src/chart.ts +2296 -2296
  159. package/src/collaboration.test.ts +104 -104
  160. package/src/collaboration.ts +167 -167
  161. package/src/column-groups.test.ts +48 -0
  162. package/src/column-groups.ts +8 -10
  163. package/src/column-id.ts +30 -0
  164. package/src/core.performance.test.ts +30 -30
  165. package/src/core.ts +1112 -1111
  166. package/src/createAutocomplete.svelte.ts +132 -132
  167. package/src/createCombobox.svelte.ts +191 -191
  168. package/src/createCountryInput.svelte.ts +157 -157
  169. package/src/createDropdownList.svelte.ts +168 -168
  170. package/src/createForm.svelte.ts +386 -386
  171. package/src/createGrid.svelte.ts +42 -42
  172. package/src/createGrid.test.ts +10 -10
  173. package/src/createGridState.svelte.ts +17 -17
  174. package/src/createListbox.svelte.ts +39 -7
  175. package/src/createMenu.svelte.ts +225 -225
  176. package/src/createPopoverSelect.svelte.ts +213 -213
  177. package/src/createSlider.svelte.ts +191 -191
  178. package/src/createTooltip.svelte.ts +144 -144
  179. package/src/createTree.svelte.ts +319 -319
  180. package/src/editing.test.ts +949 -859
  181. package/src/editing.ts +709 -675
  182. package/src/editor-contract.ts +157 -157
  183. package/src/export-data-api.test.ts +126 -126
  184. package/src/export-format.test.ts +107 -107
  185. package/src/export-format.ts +598 -598
  186. package/src/filter-operators.ts +157 -157
  187. package/src/filtering/excel-filters.test.ts +44 -1
  188. package/src/filtering/excel-filters.ts +91 -14
  189. package/src/flex-render.ts +3 -3
  190. package/src/form-field.ts +127 -127
  191. package/src/index.ts +715 -713
  192. package/src/js-scroller.svelte.ts +173 -173
  193. package/src/keyboard.test.ts +59 -59
  194. package/src/keyboard.ts +97 -97
  195. package/src/list-nav.test.ts +49 -49
  196. package/src/list-nav.ts +29 -29
  197. package/src/list-option.test.ts +56 -56
  198. package/src/list-option.ts +172 -172
  199. package/src/menus.test.ts +736 -700
  200. package/src/menus.ts +679 -652
  201. package/src/merge-objects.ts +48 -48
  202. package/src/overlays.test.ts +90 -90
  203. package/src/render-component.ts +28 -28
  204. package/src/row-resize.test.ts +100 -0
  205. package/src/row-resize.ts +36 -0
  206. package/src/scheduler-model.test.ts +562 -562
  207. package/src/scheduler-model.ts +872 -872
  208. package/src/selection.test.ts +754 -754
  209. package/src/selection.ts +600 -600
  210. package/src/server-data-source.test.ts +289 -289
  211. package/src/server-data-source.ts +413 -413
  212. package/src/sparkline.test.ts +68 -68
  213. package/src/sparkline.ts +169 -169
  214. package/src/spreadsheet.test.ts +489 -489
  215. package/src/spreadsheet.ts +312 -312
  216. package/src/static-functions.ts +11 -11
  217. package/src/subscribe.ts +38 -38
  218. package/src/svgrid-wrapper.types.ts +524 -524
  219. package/src/svgrid.api-extensions.test.ts +8 -3
  220. package/src/svgrid.behavior.test.ts +706 -706
  221. package/src/svgrid.cell-dom-ids.test.ts +96 -0
  222. package/src/svgrid.charting.test.ts +534 -534
  223. package/src/svgrid.conditional-stat-scope.test.ts +111 -0
  224. package/src/svgrid.features.test.ts +157 -157
  225. package/src/svgrid.filter-menu-listbox.svelte.test.ts +308 -0
  226. package/src/svgrid.filter-menu-scroll.test.ts +3 -1
  227. package/src/svgrid.group-header-ids.test.ts +121 -0
  228. package/src/svgrid.new-features.wrapper.test.ts +251 -251
  229. package/src/svgrid.wrapper.test.ts +40 -40
  230. package/src/test-setup.ts +62 -62
  231. package/src/themes/index.ts +215 -215
  232. package/src/toast-store.svelte.ts +246 -246
  233. package/src/toast-store.test.ts +147 -147
  234. package/src/ui-buttons.test.ts +144 -144
  235. package/src/ui-inputs.test.ts +118 -118
  236. package/src/ui-range.test.ts +70 -70
  237. package/src/ui-selection.test.ts +155 -155
  238. package/src/ui-tier1.test.ts +142 -142
  239. package/src/virtual.test.ts +88 -88
  240. package/src/virtualization/column-virtualizer.test.ts +27 -27
  241. package/src/virtualization/column-virtualizer.ts +30 -30
  242. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  243. package/src/virtualization/types.ts +30 -30
  244. package/src/virtualization/virtualizer.test.ts +47 -47
  245. package/src/virtualization/virtualizer.ts +296 -296
  246. package/themes/ember.css +71 -71
  247. package/dist/cdn/GridMenus-BzxEYNtW.js +0 -421
  248. package/dist/cdn/GridMenus-Dr-nGEXn.js +0 -417
@@ -1,49 +1,49 @@
1
- import { describe, expect, it } from 'vitest'
2
- import { enabledIndices, wrapMove } from './list-nav'
3
-
4
- describe('enabledIndices', () => {
5
- it('lists every index when nothing is disabled', () => {
6
- expect(enabledIndices(3)).toEqual([0, 1, 2])
7
- })
8
-
9
- it('skips indices the predicate marks disabled', () => {
10
- expect(enabledIndices(5, (i) => i === 1 || i === 3)).toEqual([0, 2, 4])
11
- })
12
-
13
- it('returns an empty array for a zero count', () => {
14
- expect(enabledIndices(0)).toEqual([])
15
- })
16
- })
17
-
18
- describe('wrapMove', () => {
19
- const list = [0, 2, 4] // e.g. indices 1 and 3 are disabled
20
-
21
- it('moves forward to the next enabled index', () => {
22
- expect(wrapMove(list, 2, 1)).toBe(4)
23
- })
24
-
25
- it('wraps past the end back to the head', () => {
26
- expect(wrapMove(list, 4, 1)).toBe(0)
27
- })
28
-
29
- it('wraps before the head to the tail', () => {
30
- expect(wrapMove(list, 0, -1)).toBe(4)
31
- })
32
-
33
- it('from an absent current, delta 1 lands on the first entry', () => {
34
- expect(wrapMove(list, -1, 1)).toBe(0)
35
- })
36
-
37
- it('from an absent current, delta -1 lands on the last-but-one', () => {
38
- expect(wrapMove(list, -1, -1)).toBe(2)
39
- })
40
-
41
- it('stays put for a single-entry list', () => {
42
- expect(wrapMove([5], 5, 1)).toBe(5)
43
- expect(wrapMove([5], 5, -1)).toBe(5)
44
- })
45
-
46
- it('returns -1 for an empty list', () => {
47
- expect(wrapMove([], 0, 1)).toBe(-1)
48
- })
49
- })
1
+ import { describe, expect, it } from 'vitest'
2
+ import { enabledIndices, wrapMove } from './list-nav'
3
+
4
+ describe('enabledIndices', () => {
5
+ it('lists every index when nothing is disabled', () => {
6
+ expect(enabledIndices(3)).toEqual([0, 1, 2])
7
+ })
8
+
9
+ it('skips indices the predicate marks disabled', () => {
10
+ expect(enabledIndices(5, (i) => i === 1 || i === 3)).toEqual([0, 2, 4])
11
+ })
12
+
13
+ it('returns an empty array for a zero count', () => {
14
+ expect(enabledIndices(0)).toEqual([])
15
+ })
16
+ })
17
+
18
+ describe('wrapMove', () => {
19
+ const list = [0, 2, 4] // e.g. indices 1 and 3 are disabled
20
+
21
+ it('moves forward to the next enabled index', () => {
22
+ expect(wrapMove(list, 2, 1)).toBe(4)
23
+ })
24
+
25
+ it('wraps past the end back to the head', () => {
26
+ expect(wrapMove(list, 4, 1)).toBe(0)
27
+ })
28
+
29
+ it('wraps before the head to the tail', () => {
30
+ expect(wrapMove(list, 0, -1)).toBe(4)
31
+ })
32
+
33
+ it('from an absent current, delta 1 lands on the first entry', () => {
34
+ expect(wrapMove(list, -1, 1)).toBe(0)
35
+ })
36
+
37
+ it('from an absent current, delta -1 lands on the last-but-one', () => {
38
+ expect(wrapMove(list, -1, -1)).toBe(2)
39
+ })
40
+
41
+ it('stays put for a single-entry list', () => {
42
+ expect(wrapMove([5], 5, 1)).toBe(5)
43
+ expect(wrapMove([5], 5, -1)).toBe(5)
44
+ })
45
+
46
+ it('returns -1 for an empty list', () => {
47
+ expect(wrapMove([], 0, 1)).toBe(-1)
48
+ })
49
+ })
package/src/list-nav.ts CHANGED
@@ -1,29 +1,29 @@
1
- /**
2
- * list-nav - the pure, framework-free navigation math shared by the roving-focus
3
- * cores (createListbox, createPopoverSelect, createMenu). No runes, no DOM - just
4
- * index arithmetic, so it is unit-testable on its own and behaves identically
5
- * everywhere. The cores wrap these in `$state`.
6
- */
7
-
8
- /** Indices of items that can take roving focus / selection - i.e. the ones the
9
- * caller does not mark disabled. `count` is the total item count; `isDisabled`
10
- * is consulted per index (a separator counts as disabled to the caller). */
11
- export function enabledIndices(count: number, isDisabled?: (index: number) => boolean): number[] {
12
- const out: number[] = []
13
- for (let i = 0; i < count; i++) if (!isDisabled?.(i)) out.push(i)
14
- return out
15
- }
16
-
17
- /**
18
- * The next index when moving `delta` steps through `list`, wrapping around the
19
- * ends. `current` need not be in `list` (it may sit on a disabled item): when it
20
- * is absent we start just before the head so `delta: 1` lands on the first entry
21
- * and `delta: -1` on the last-but-one - the same behaviour every existing core
22
- * already had. Returns `-1` for an empty list.
23
- */
24
- export function wrapMove(list: readonly number[], current: number, delta: number): number {
25
- const len = list.length
26
- if (len === 0) return -1
27
- const pos = list.indexOf(current)
28
- return list[(pos + delta + len) % len]!
29
- }
1
+ /**
2
+ * list-nav - the pure, framework-free navigation math shared by the roving-focus
3
+ * cores (createListbox, createPopoverSelect, createMenu). No runes, no DOM - just
4
+ * index arithmetic, so it is unit-testable on its own and behaves identically
5
+ * everywhere. The cores wrap these in `$state`.
6
+ */
7
+
8
+ /** Indices of items that can take roving focus / selection - i.e. the ones the
9
+ * caller does not mark disabled. `count` is the total item count; `isDisabled`
10
+ * is consulted per index (a separator counts as disabled to the caller). */
11
+ export function enabledIndices(count: number, isDisabled?: (index: number) => boolean): number[] {
12
+ const out: number[] = []
13
+ for (let i = 0; i < count; i++) if (!isDisabled?.(i)) out.push(i)
14
+ return out
15
+ }
16
+
17
+ /**
18
+ * The next index when moving `delta` steps through `list`, wrapping around the
19
+ * ends. `current` need not be in `list` (it may sit on a disabled item): when it
20
+ * is absent we start just before the head so `delta: 1` lands on the first entry
21
+ * and `delta: -1` on the last-but-one - the same behaviour every existing core
22
+ * already had. Returns `-1` for an empty list.
23
+ */
24
+ export function wrapMove(list: readonly number[], current: number, delta: number): number {
25
+ const len = list.length
26
+ if (len === 0) return -1
27
+ const pos = list.indexOf(current)
28
+ return list[(pos + delta + len) % len]!
29
+ }
@@ -1,56 +1,56 @@
1
- /**
2
- * Tests for the option-list helpers, focused on `flattenForVirtual` - the pure
3
- * model that lets the selection controls window a GROUPED list and mix row
4
- * heights, reusing the shared virtualizer.
5
- */
6
- import { describe, expect, it } from 'vitest'
7
- import { flattenForVirtual, normalizeOptions, type ListOption } from './list-option'
8
-
9
- describe('flattenForVirtual', () => {
10
- it('passes an ungrouped list through as option rows (uniform height)', () => {
11
- const options = normalizeOptions([1, 2, 3])
12
- const m = flattenForVirtual(options, { rowHeight: 32 })
13
- expect(m.hasGroups).toBe(false)
14
- expect(m.entries).toHaveLength(3)
15
- expect(m.entries.every((e) => e.type === 'option')).toBe(true)
16
- expect(m.entries.map((e) => e.size)).toEqual([32, 32, 32])
17
- // Ungrouped: option index === flat index.
18
- expect(m.optionFlatIndex).toEqual([0, 1, 2])
19
- expect(m.sizeAt(1)).toBe(32)
20
- })
21
-
22
- it('interleaves group heading rows and keeps option->flat mapping', () => {
23
- const options: ListOption[] = [
24
- { value: 'a', label: 'A', group: 'G1' },
25
- { value: 'b', label: 'B', group: 'G1' },
26
- { value: 'c', label: 'C', group: 'G2' },
27
- ]
28
- const m = flattenForVirtual(options, { rowHeight: 30, groupHeaderHeight: 20 })
29
- expect(m.hasGroups).toBe(true)
30
- // [G1 header, a, b, G2 header, c]
31
- expect(m.entries.map((e) => e.type)).toEqual(['group', 'option', 'option', 'group', 'option'])
32
- expect(m.entries.map((e) => e.size)).toEqual([20, 30, 30, 20, 30])
33
- // Option indices 0,1,2 land at flat rows 1,2,4.
34
- expect(m.optionFlatIndex).toEqual([1, 2, 4])
35
- expect(m.entries[0]).toMatchObject({ type: 'group', label: 'G1' })
36
- })
37
-
38
- it('supports a per-option variable height function', () => {
39
- const options = normalizeOptions(['x', 'y', 'z'])
40
- const m = flattenForVirtual(options, { rowHeight: (_opt, i) => 20 + i * 10 })
41
- expect(m.entries.map((e) => e.size)).toEqual([20, 30, 40])
42
- expect(m.sizeAt(2)).toBe(40)
43
- })
44
-
45
- it('clamps non-positive heights to at least 1px', () => {
46
- const options = normalizeOptions(['x'])
47
- const m = flattenForVirtual(options, { rowHeight: 0, groupHeaderHeight: 0 })
48
- expect(m.sizeAt(0)).toBe(1)
49
- })
50
-
51
- it('is empty for no options', () => {
52
- const m = flattenForVirtual([], { rowHeight: 32 })
53
- expect(m.entries).toEqual([])
54
- expect(m.optionFlatIndex).toEqual([])
55
- })
56
- })
1
+ /**
2
+ * Tests for the option-list helpers, focused on `flattenForVirtual` - the pure
3
+ * model that lets the selection controls window a GROUPED list and mix row
4
+ * heights, reusing the shared virtualizer.
5
+ */
6
+ import { describe, expect, it } from 'vitest'
7
+ import { flattenForVirtual, normalizeOptions, type ListOption } from './list-option'
8
+
9
+ describe('flattenForVirtual', () => {
10
+ it('passes an ungrouped list through as option rows (uniform height)', () => {
11
+ const options = normalizeOptions([1, 2, 3])
12
+ const m = flattenForVirtual(options, { rowHeight: 32 })
13
+ expect(m.hasGroups).toBe(false)
14
+ expect(m.entries).toHaveLength(3)
15
+ expect(m.entries.every((e) => e.type === 'option')).toBe(true)
16
+ expect(m.entries.map((e) => e.size)).toEqual([32, 32, 32])
17
+ // Ungrouped: option index === flat index.
18
+ expect(m.optionFlatIndex).toEqual([0, 1, 2])
19
+ expect(m.sizeAt(1)).toBe(32)
20
+ })
21
+
22
+ it('interleaves group heading rows and keeps option->flat mapping', () => {
23
+ const options: ListOption[] = [
24
+ { value: 'a', label: 'A', group: 'G1' },
25
+ { value: 'b', label: 'B', group: 'G1' },
26
+ { value: 'c', label: 'C', group: 'G2' },
27
+ ]
28
+ const m = flattenForVirtual(options, { rowHeight: 30, groupHeaderHeight: 20 })
29
+ expect(m.hasGroups).toBe(true)
30
+ // [G1 header, a, b, G2 header, c]
31
+ expect(m.entries.map((e) => e.type)).toEqual(['group', 'option', 'option', 'group', 'option'])
32
+ expect(m.entries.map((e) => e.size)).toEqual([20, 30, 30, 20, 30])
33
+ // Option indices 0,1,2 land at flat rows 1,2,4.
34
+ expect(m.optionFlatIndex).toEqual([1, 2, 4])
35
+ expect(m.entries[0]).toMatchObject({ type: 'group', label: 'G1' })
36
+ })
37
+
38
+ it('supports a per-option variable height function', () => {
39
+ const options = normalizeOptions(['x', 'y', 'z'])
40
+ const m = flattenForVirtual(options, { rowHeight: (_opt, i) => 20 + i * 10 })
41
+ expect(m.entries.map((e) => e.size)).toEqual([20, 30, 40])
42
+ expect(m.sizeAt(2)).toBe(40)
43
+ })
44
+
45
+ it('clamps non-positive heights to at least 1px', () => {
46
+ const options = normalizeOptions(['x'])
47
+ const m = flattenForVirtual(options, { rowHeight: 0, groupHeaderHeight: 0 })
48
+ expect(m.sizeAt(0)).toBe(1)
49
+ })
50
+
51
+ it('is empty for no options', () => {
52
+ const m = flattenForVirtual([], { rowHeight: 32 })
53
+ expect(m.entries).toEqual([])
54
+ expect(m.optionFlatIndex).toEqual([])
55
+ })
56
+ })
@@ -1,172 +1,172 @@
1
- /** Shared option shape for the SvGrid UI-kit selection controls. */
2
- export type ListOption = {
3
- value: string | number
4
- label: string
5
- disabled?: boolean
6
- /** Optional group heading this option belongs under. */
7
- group?: string
8
- /** Optional color swatch (any CSS color) shown before the label. */
9
- color?: string
10
- }
11
-
12
- /**
13
- * Coerce a raw options array into well-formed ListOptions. A primitive item
14
- * (`1`, `'a'`) becomes `{ value, label: String(value) }`; an object missing a
15
- * `label` or `value` gets the other filled in. This makes a caller who passes
16
- * e.g. `[1, 2, 3]` or `['a', 'b']` render sensibly instead of crashing a keyed
17
- * `#each` on `undefined`/duplicate `value`s.
18
- */
19
- export function normalizeOptions(raw: ReadonlyArray<ListOption | string | number> | null | undefined): ListOption[] {
20
- if (!raw) return []
21
- return raw.map((o) => {
22
- if (o != null && typeof o === 'object') {
23
- const opt = o as Partial<ListOption>
24
- const value = opt.value ?? opt.label ?? ''
25
- return { ...(opt as ListOption), value, label: opt.label ?? String(value) }
26
- }
27
- return { value: o, label: String(o) }
28
- })
29
- }
30
-
31
- /** Case-insensitive substring filter over option labels. */
32
- export function filterOptions(options: ReadonlyArray<ListOption>, query: string): ListOption[] {
33
- const q = query.trim().toLowerCase()
34
- if (!q) return [...options]
35
- return options.filter((o) => o.label.toLowerCase().includes(q))
36
- }
37
-
38
- /** An option carrying its position in the flat source array (for prop-getters). */
39
- export type IndexedOption = ListOption & { index: number }
40
- /** A section of options that share a `group` heading (null = ungrouped). */
41
- export type OptionGroup = { group: string | null; options: IndexedOption[] }
42
-
43
- /**
44
- * Bucket options by their `group` heading, preserving each option's flat index
45
- * so grouped rendering still drives `optionProps(index)` etc. Groups appear in
46
- * first-seen order. When no option sets `group`, the result is a single
47
- * `group: null` section (render it flat).
48
- */
49
- export function groupOptions(options: ReadonlyArray<ListOption>): OptionGroup[] {
50
- const groups: OptionGroup[] = []
51
- const byName = new Map<string | null, OptionGroup>()
52
- options.forEach((o, index) => {
53
- const key = o.group ?? null
54
- let g = byName.get(key)
55
- if (!g) { g = { group: key, options: [] }; byName.set(key, g); groups.push(g) }
56
- g.options.push({ ...o, index })
57
- })
58
- return groups
59
- }
60
-
61
- /** Whether any option declares a `group` (so headings are worth rendering). */
62
- export function hasGroups(options: ReadonlyArray<ListOption>): boolean {
63
- return options.some((o) => o.group != null)
64
- }
65
-
66
- /** Fixed px, or a per-option function - lets a virtualized list mix row heights. */
67
- export type RowHeight = number | ((opt: IndexedOption, index: number) => number)
68
-
69
- /** One row of the flattened virtualization model: a group heading or an option. */
70
- export type VirtualListRow =
71
- | { type: 'group'; label: string; size: number }
72
- | { type: 'option'; opt: IndexedOption; size: number }
73
-
74
- export type FlatVirtualModel = {
75
- /** Group headings + options in render order, each with its px height. */
76
- entries: VirtualListRow[]
77
- /** Whether any group heading rows are present. */
78
- hasGroups: boolean
79
- /** Height (px) of the entry at flat index `i` - feeds the virtualizer's `estimateSize`. */
80
- sizeAt: (i: number) => number
81
- /** Maps an OPTION index (position in the source options array, as used by
82
- * `optionProps(index)`) to its flat entry index - so the active option can
83
- * be scrolled into view even with group rows interleaved. */
84
- optionFlatIndex: number[]
85
- }
86
-
87
- /**
88
- * Flatten a (possibly grouped) option list into a single virtualization model:
89
- * group headings become rows interleaved with their options, and each row
90
- * carries its pixel height. This is what lets the selection controls window a
91
- * GROUPED list (previously they fell back to rendering every node) and support
92
- * variable row heights, while reusing the shared `createSvelteVirtualizer`.
93
- *
94
- * Pure - no DOM. Builds on `groupOptions`, which already tags each option with
95
- * its flat `index` (the value `optionProps(index)` expects).
96
- */
97
- export function flattenForVirtual(
98
- options: ReadonlyArray<ListOption>,
99
- opts: { rowHeight: RowHeight; groupHeaderHeight?: number },
100
- ): FlatVirtualModel {
101
- const headerH = Math.max(1, opts.groupHeaderHeight ?? 28)
102
- const rh = opts.rowHeight
103
- const sizeOf = (o: IndexedOption) => Math.max(1, typeof rh === 'function' ? rh(o, o.index) : rh)
104
-
105
- const entries: VirtualListRow[] = []
106
- const optionFlatIndex = new Array<number>(options.length)
107
- let anyGroups = false
108
-
109
- for (const g of groupOptions(options)) {
110
- if (g.group != null) {
111
- anyGroups = true
112
- entries.push({ type: 'group', label: g.group, size: headerH })
113
- }
114
- for (const opt of g.options) {
115
- optionFlatIndex[opt.index] = entries.length
116
- entries.push({ type: 'option', opt, size: sizeOf(opt) })
117
- }
118
- }
119
-
120
- return {
121
- entries,
122
- hasGroups: anyGroups,
123
- sizeAt: (i) => entries[i]?.size ?? 0,
124
- optionFlatIndex,
125
- }
126
- }
127
-
128
- /**
129
- * Next enabled option index whose label starts with `buffer` (type-ahead),
130
- * searching forward from just after `from` and wrapping. Returns -1 for no
131
- * match / empty buffer. Case-insensitive.
132
- */
133
- export function nextTypeaheadIndex(
134
- options: ReadonlyArray<ListOption>,
135
- buffer: string,
136
- from: number,
137
- ): number {
138
- const b = buffer.trim().toLowerCase()
139
- if (!b || !options.length) return -1
140
- const n = options.length
141
- for (let k = 1; k <= n; k++) {
142
- const i = (from + k) % n
143
- const o = options[i]
144
- if (o && !o.disabled && o.label.toLowerCase().startsWith(b)) return i
145
- }
146
- return -1
147
- }
148
-
149
- /**
150
- * A tiny type-ahead buffer: accumulates printable characters within `timeout`
151
- * ms of each other, then resets. Frameworkfree; the caller supplies scheduling.
152
- */
153
- export function createTypeaheadBuffer(timeout = 600) {
154
- let buffer = ''
155
- let timer: ReturnType<typeof setTimeout> | undefined
156
- return {
157
- get value() { return buffer },
158
- /** Append a character and (re)arm the reset timer. Returns the new buffer. */
159
- push(char: string): string {
160
- buffer += char
161
- if (timer) clearTimeout(timer)
162
- timer = setTimeout(() => { buffer = '' }, timeout)
163
- return buffer
164
- },
165
- clear() { buffer = ''; if (timer) clearTimeout(timer) },
166
- }
167
- }
168
-
169
- /** Whether a keydown is a bare printable character (a type-ahead candidate). */
170
- export function isTypeaheadKey(e: KeyboardEvent): boolean {
171
- return e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && e.key !== ' '
172
- }
1
+ /** Shared option shape for the SvGrid UI-kit selection controls. */
2
+ export type ListOption = {
3
+ value: string | number
4
+ label: string
5
+ disabled?: boolean
6
+ /** Optional group heading this option belongs under. */
7
+ group?: string
8
+ /** Optional color swatch (any CSS color) shown before the label. */
9
+ color?: string
10
+ }
11
+
12
+ /**
13
+ * Coerce a raw options array into well-formed ListOptions. A primitive item
14
+ * (`1`, `'a'`) becomes `{ value, label: String(value) }`; an object missing a
15
+ * `label` or `value` gets the other filled in. This makes a caller who passes
16
+ * e.g. `[1, 2, 3]` or `['a', 'b']` render sensibly instead of crashing a keyed
17
+ * `#each` on `undefined`/duplicate `value`s.
18
+ */
19
+ export function normalizeOptions(raw: ReadonlyArray<ListOption | string | number> | null | undefined): ListOption[] {
20
+ if (!raw) return []
21
+ return raw.map((o) => {
22
+ if (o != null && typeof o === 'object') {
23
+ const opt = o as Partial<ListOption>
24
+ const value = opt.value ?? opt.label ?? ''
25
+ return { ...(opt as ListOption), value, label: opt.label ?? String(value) }
26
+ }
27
+ return { value: o, label: String(o) }
28
+ })
29
+ }
30
+
31
+ /** Case-insensitive substring filter over option labels. */
32
+ export function filterOptions(options: ReadonlyArray<ListOption>, query: string): ListOption[] {
33
+ const q = query.trim().toLowerCase()
34
+ if (!q) return [...options]
35
+ return options.filter((o) => o.label.toLowerCase().includes(q))
36
+ }
37
+
38
+ /** An option carrying its position in the flat source array (for prop-getters). */
39
+ export type IndexedOption = ListOption & { index: number }
40
+ /** A section of options that share a `group` heading (null = ungrouped). */
41
+ export type OptionGroup = { group: string | null; options: IndexedOption[] }
42
+
43
+ /**
44
+ * Bucket options by their `group` heading, preserving each option's flat index
45
+ * so grouped rendering still drives `optionProps(index)` etc. Groups appear in
46
+ * first-seen order. When no option sets `group`, the result is a single
47
+ * `group: null` section (render it flat).
48
+ */
49
+ export function groupOptions(options: ReadonlyArray<ListOption>): OptionGroup[] {
50
+ const groups: OptionGroup[] = []
51
+ const byName = new Map<string | null, OptionGroup>()
52
+ options.forEach((o, index) => {
53
+ const key = o.group ?? null
54
+ let g = byName.get(key)
55
+ if (!g) { g = { group: key, options: [] }; byName.set(key, g); groups.push(g) }
56
+ g.options.push({ ...o, index })
57
+ })
58
+ return groups
59
+ }
60
+
61
+ /** Whether any option declares a `group` (so headings are worth rendering). */
62
+ export function hasGroups(options: ReadonlyArray<ListOption>): boolean {
63
+ return options.some((o) => o.group != null)
64
+ }
65
+
66
+ /** Fixed px, or a per-option function - lets a virtualized list mix row heights. */
67
+ export type RowHeight = number | ((opt: IndexedOption, index: number) => number)
68
+
69
+ /** One row of the flattened virtualization model: a group heading or an option. */
70
+ export type VirtualListRow =
71
+ | { type: 'group'; label: string; size: number }
72
+ | { type: 'option'; opt: IndexedOption; size: number }
73
+
74
+ export type FlatVirtualModel = {
75
+ /** Group headings + options in render order, each with its px height. */
76
+ entries: VirtualListRow[]
77
+ /** Whether any group heading rows are present. */
78
+ hasGroups: boolean
79
+ /** Height (px) of the entry at flat index `i` - feeds the virtualizer's `estimateSize`. */
80
+ sizeAt: (i: number) => number
81
+ /** Maps an OPTION index (position in the source options array, as used by
82
+ * `optionProps(index)`) to its flat entry index - so the active option can
83
+ * be scrolled into view even with group rows interleaved. */
84
+ optionFlatIndex: number[]
85
+ }
86
+
87
+ /**
88
+ * Flatten a (possibly grouped) option list into a single virtualization model:
89
+ * group headings become rows interleaved with their options, and each row
90
+ * carries its pixel height. This is what lets the selection controls window a
91
+ * GROUPED list (previously they fell back to rendering every node) and support
92
+ * variable row heights, while reusing the shared `createSvelteVirtualizer`.
93
+ *
94
+ * Pure - no DOM. Builds on `groupOptions`, which already tags each option with
95
+ * its flat `index` (the value `optionProps(index)` expects).
96
+ */
97
+ export function flattenForVirtual(
98
+ options: ReadonlyArray<ListOption>,
99
+ opts: { rowHeight: RowHeight; groupHeaderHeight?: number },
100
+ ): FlatVirtualModel {
101
+ const headerH = Math.max(1, opts.groupHeaderHeight ?? 28)
102
+ const rh = opts.rowHeight
103
+ const sizeOf = (o: IndexedOption) => Math.max(1, typeof rh === 'function' ? rh(o, o.index) : rh)
104
+
105
+ const entries: VirtualListRow[] = []
106
+ const optionFlatIndex = new Array<number>(options.length)
107
+ let anyGroups = false
108
+
109
+ for (const g of groupOptions(options)) {
110
+ if (g.group != null) {
111
+ anyGroups = true
112
+ entries.push({ type: 'group', label: g.group, size: headerH })
113
+ }
114
+ for (const opt of g.options) {
115
+ optionFlatIndex[opt.index] = entries.length
116
+ entries.push({ type: 'option', opt, size: sizeOf(opt) })
117
+ }
118
+ }
119
+
120
+ return {
121
+ entries,
122
+ hasGroups: anyGroups,
123
+ sizeAt: (i) => entries[i]?.size ?? 0,
124
+ optionFlatIndex,
125
+ }
126
+ }
127
+
128
+ /**
129
+ * Next enabled option index whose label starts with `buffer` (type-ahead),
130
+ * searching forward from just after `from` and wrapping. Returns -1 for no
131
+ * match / empty buffer. Case-insensitive.
132
+ */
133
+ export function nextTypeaheadIndex(
134
+ options: ReadonlyArray<ListOption>,
135
+ buffer: string,
136
+ from: number,
137
+ ): number {
138
+ const b = buffer.trim().toLowerCase()
139
+ if (!b || !options.length) return -1
140
+ const n = options.length
141
+ for (let k = 1; k <= n; k++) {
142
+ const i = (from + k) % n
143
+ const o = options[i]
144
+ if (o && !o.disabled && o.label.toLowerCase().startsWith(b)) return i
145
+ }
146
+ return -1
147
+ }
148
+
149
+ /**
150
+ * A tiny type-ahead buffer: accumulates printable characters within `timeout`
151
+ * ms of each other, then resets. Frameworkfree; the caller supplies scheduling.
152
+ */
153
+ export function createTypeaheadBuffer(timeout = 600) {
154
+ let buffer = ''
155
+ let timer: ReturnType<typeof setTimeout> | undefined
156
+ return {
157
+ get value() { return buffer },
158
+ /** Append a character and (re)arm the reset timer. Returns the new buffer. */
159
+ push(char: string): string {
160
+ buffer += char
161
+ if (timer) clearTimeout(timer)
162
+ timer = setTimeout(() => { buffer = '' }, timeout)
163
+ return buffer
164
+ },
165
+ clear() { buffer = ''; if (timer) clearTimeout(timer) },
166
+ }
167
+ }
168
+
169
+ /** Whether a keydown is a bare printable character (a type-ahead candidate). */
170
+ export function isTypeaheadKey(e: KeyboardEvent): boolean {
171
+ return e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && e.key !== ' '
172
+ }