@svgrid/grid 2.6.22 → 2.7.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 (331) hide show
  1. package/CHANGELOG.md +88 -88
  2. package/README.md +199 -199
  3. package/dist/FlexRender.svelte +96 -96
  4. package/dist/GridFooter.svelte +181 -181
  5. package/dist/GridMenus.svelte +184 -6
  6. package/dist/SvAutoComplete.svelte +169 -165
  7. package/dist/SvAvatar.svelte +75 -75
  8. package/dist/SvCalendar.svelte +503 -503
  9. package/dist/SvCarousel.svelte +141 -141
  10. package/dist/SvCheckBox.svelte +102 -102
  11. package/dist/SvCircularProgress.svelte +109 -109
  12. package/dist/SvColorInput.svelte +181 -181
  13. package/dist/SvComboBox.svelte +279 -275
  14. package/dist/SvContextMenu.svelte +116 -116
  15. package/dist/SvCountryInput.svelte +163 -163
  16. package/dist/SvDateRangeInput.svelte +25 -3
  17. package/dist/SvDrawer.svelte +254 -254
  18. package/dist/SvDropDownList.svelte +378 -374
  19. package/dist/SvDurationInput.svelte +126 -126
  20. package/dist/SvField.svelte +293 -293
  21. package/dist/SvForm.svelte +437 -437
  22. package/dist/SvGrid.controller.svelte.d.ts +48 -1
  23. package/dist/SvGrid.controller.svelte.js +214 -52
  24. package/dist/SvGrid.css +221 -0
  25. package/dist/SvGrid.helpers.d.ts +55 -0
  26. package/dist/SvGrid.helpers.js +83 -0
  27. package/dist/SvGrid.svelte +145 -0
  28. package/dist/SvGrid.types.d.ts +105 -0
  29. package/dist/SvGridCellEditor.svelte +744 -662
  30. package/dist/SvGridChart.svelte +1716 -1716
  31. package/dist/SvGridChartPanel.svelte +485 -485
  32. package/dist/SvGridChartView.svelte +70 -70
  33. package/dist/SvGridDropdown.svelte +728 -728
  34. package/dist/SvGridSelect.svelte +270 -266
  35. package/dist/SvGridSelect.svelte.d.ts +1 -1
  36. package/dist/SvGroupCell.svelte +116 -116
  37. package/dist/SvListBox.svelte +334 -326
  38. package/dist/SvMaskedInput.svelte +122 -122
  39. package/dist/SvMenu.svelte +124 -124
  40. package/dist/SvMenuList.svelte +146 -146
  41. package/dist/SvMultiSelect.svelte +293 -289
  42. package/dist/SvMultiSelect.svelte.d.ts +1 -1
  43. package/dist/SvNumberInput.svelte +172 -168
  44. package/dist/SvOtpInput.svelte +158 -158
  45. package/dist/SvPasswordInput.svelte +151 -151
  46. package/dist/SvPhoneInput.svelte +133 -133
  47. package/dist/SvPopover.svelte +197 -197
  48. package/dist/SvProgress.svelte +116 -116
  49. package/dist/SvRadioGroup.svelte +107 -107
  50. package/dist/SvRating.svelte +112 -112
  51. package/dist/SvResult.svelte +73 -73
  52. package/dist/SvRichCell.svelte +125 -0
  53. package/dist/SvRichCell.svelte.d.ts +15 -0
  54. package/dist/SvRichText.svelte +211 -211
  55. package/dist/SvRowGroupPanel.svelte +170 -170
  56. package/dist/SvScrollArea.svelte +61 -61
  57. package/dist/SvSlider.svelte +203 -203
  58. package/dist/SvSwitchButton.svelte +108 -108
  59. package/dist/SvTagsInput.svelte +115 -115
  60. package/dist/SvTextArea.svelte +5 -1
  61. package/dist/SvTextInput.svelte +147 -147
  62. package/dist/SvTimePicker.svelte +245 -245
  63. package/dist/SvToaster.svelte +159 -159
  64. package/dist/SvToggleButton.svelte +85 -85
  65. package/dist/SvTooltip.svelte +161 -161
  66. package/dist/SvTour.svelte +208 -208
  67. package/dist/SvTree.svelte +444 -444
  68. package/dist/SvTreeSelect.svelte +239 -235
  69. package/dist/SvTreeSelect.svelte.d.ts +1 -1
  70. package/dist/builtin-editors.d.ts +2 -2
  71. package/dist/builtin-editors.js +19 -3
  72. package/dist/cdn/GridMenus-C4oLsJyj.js +600 -0
  73. package/dist/cdn/GridMenus-yEivjNwl.js +601 -0
  74. package/dist/cdn/SvDateRangeInput-Bh0A0JkF.js +199 -0
  75. package/dist/cdn/SvDateRangeInput-DflbiP7N.js +198 -0
  76. package/dist/cdn/SvDateTimePicker-BWwpfB_o.js +812 -0
  77. package/dist/cdn/SvDateTimePicker-Bivn8dAP.js +816 -0
  78. package/dist/cdn/SvGridCellEditor-AXL8cHGO.js +550 -0
  79. package/dist/cdn/SvGridCellEditor-Ba7rY3eu.js +549 -0
  80. package/dist/cdn/{SvGridChart-BwVos976.js → SvGridChart-Bs2GIR2Q.js} +1 -1
  81. package/dist/cdn/{SvGridChart-BEJmNNx9.js → SvGridChart-CwhFz7GV.js} +1 -1
  82. package/dist/cdn/{SvGridChartPanel-BOknOkrP.js → SvGridChartPanel-1WXuStzM.js} +1 -1
  83. package/dist/cdn/{SvGridChartPanel-D2PjII4O.js → SvGridChartPanel-e5_nqNP9.js} +1 -1
  84. package/dist/cdn/{SvGridChartView-00LPUHL1.js → SvGridChartView-SmPW10dI.js} +1 -1
  85. package/dist/cdn/{SvGridChartView-BhUEJ5ki.js → SvGridChartView-eSPuJE6g.js} +1 -1
  86. package/dist/cdn/{SvGridDropdown-D0VdjeR8.js → SvGridDropdown-B1ZcLpgs.js} +1 -1
  87. package/dist/cdn/{SvGridDropdown-D13MtJ2j.js → SvGridDropdown-CtdbHcIS.js} +1 -1
  88. package/dist/cdn/date-format-CcP1tafP.js +1395 -0
  89. package/dist/cdn/date-format-DZT7T1wf.js +1393 -0
  90. package/dist/cdn/{editor-registry-CiI0xlKg.js → editor-registry-BhgE3S84.js} +51 -25
  91. package/dist/cdn/{src-C9Hihx1W.js → src-COC0vnpg.js} +7233 -6701
  92. package/dist/cdn/{src-D1lXwq1l.js → src-pYGV2rMR.js} +5747 -5215
  93. package/dist/cdn/svgrid.js +15 -13
  94. package/dist/cdn/svgrid.svelte-external.js +15 -13
  95. package/dist/cell-values.d.ts +16 -0
  96. package/dist/cell-values.js +28 -0
  97. package/dist/chart-export.js +8 -8
  98. package/dist/clipboard.d.ts +22 -0
  99. package/dist/clipboard.js +405 -27
  100. package/dist/editing.js +12 -7
  101. package/dist/editors/cell-editors.d.ts +11 -0
  102. package/dist/editors/cell-editors.js +18 -1
  103. package/dist/grid-messages.d.ts +15 -0
  104. package/dist/grid-messages.js +15 -0
  105. package/dist/index.d.ts +4 -0
  106. package/dist/index.js +4 -0
  107. package/dist/list-option.d.ts +6 -0
  108. package/dist/menus.js +40 -7
  109. package/dist/sanitize-html.d.ts +37 -0
  110. package/dist/sanitize-html.js +234 -0
  111. package/dist/selection-bar-view.svelte.d.ts +25 -0
  112. package/dist/selection-bar-view.svelte.js +13 -0
  113. package/dist/selection.d.ts +2 -1
  114. package/dist/selection.js +129 -13
  115. package/package.json +11 -11
  116. package/src/FlexRender.svelte +96 -96
  117. package/src/GridFooter.svelte +181 -181
  118. package/src/GridMenus.svelte +184 -6
  119. package/src/SvAutoComplete.svelte +169 -165
  120. package/src/SvAvatar.svelte +75 -75
  121. package/src/SvCalendar.svelte +503 -503
  122. package/src/SvCalendar.test.ts +226 -226
  123. package/src/SvCarousel.svelte +141 -141
  124. package/src/SvCheckBox.svelte +102 -102
  125. package/src/SvCircularProgress.svelte +109 -109
  126. package/src/SvColorInput.svelte +181 -181
  127. package/src/SvComboBox.svelte +279 -275
  128. package/src/SvContextMenu.svelte +116 -116
  129. package/src/SvCountryInput.svelte +163 -163
  130. package/src/SvDateRangeInput.svelte +25 -3
  131. package/src/SvDrawer.svelte +254 -254
  132. package/src/SvDropDownList.svelte +378 -374
  133. package/src/SvDurationInput.svelte +126 -126
  134. package/src/SvField.svelte +293 -293
  135. package/src/SvForm.svelte +437 -437
  136. package/src/SvForm.test.ts +411 -411
  137. package/src/SvGrid.controller.svelte.ts +251 -61
  138. package/src/SvGrid.css +221 -0
  139. package/src/SvGrid.helpers.ts +87 -0
  140. package/src/SvGrid.svelte +145 -0
  141. package/src/SvGrid.types.ts +2092 -1980
  142. package/src/SvGridCellEditor.svelte +744 -662
  143. package/src/SvGridChart.svelte +1716 -1716
  144. package/src/SvGridChartPanel.svelte +485 -485
  145. package/src/SvGridChartView.svelte +70 -70
  146. package/src/SvGridDropdown.svelte +728 -728
  147. package/src/SvGridSelect.svelte +270 -266
  148. package/src/SvGroupCell.svelte +116 -116
  149. package/src/SvListBox.svelte +334 -326
  150. package/src/SvMaskedInput.svelte +122 -122
  151. package/src/SvMenu.svelte +124 -124
  152. package/src/SvMenu.test.ts +97 -97
  153. package/src/SvMenuList.svelte +146 -146
  154. package/src/SvMultiSelect.svelte +293 -289
  155. package/src/SvNumberInput.svelte +172 -168
  156. package/src/SvOtpInput.svelte +158 -158
  157. package/src/SvPasswordInput.svelte +151 -151
  158. package/src/SvPhoneInput.svelte +133 -133
  159. package/src/SvPopover.svelte +197 -197
  160. package/src/SvProgress.svelte +116 -116
  161. package/src/SvRadioGroup.svelte +107 -107
  162. package/src/SvRating.svelte +112 -112
  163. package/src/SvResult.svelte +73 -73
  164. package/src/SvRichCell.svelte +125 -0
  165. package/src/SvRichText.svelte +211 -211
  166. package/src/SvRowGroupPanel.svelte +170 -170
  167. package/src/SvScrollArea.svelte +61 -61
  168. package/src/SvSlider.svelte +203 -203
  169. package/src/SvSwitchButton.svelte +108 -108
  170. package/src/SvTagsInput.svelte +115 -115
  171. package/src/SvTextArea.svelte +5 -1
  172. package/src/SvTextInput.svelte +147 -147
  173. package/src/SvTimePicker.svelte +245 -245
  174. package/src/SvToaster.svelte +159 -159
  175. package/src/SvToaster.test.ts +95 -95
  176. package/src/SvToggleButton.svelte +85 -85
  177. package/src/SvTooltip.svelte +161 -161
  178. package/src/SvTour.svelte +208 -208
  179. package/src/SvTree.svelte +444 -444
  180. package/src/SvTreeSelect.svelte +239 -235
  181. package/src/a11y/dismissable.test.ts +119 -119
  182. package/src/a11y/dismissable.ts +114 -114
  183. package/src/a11y.contract.test.ts +49 -49
  184. package/src/a11y.test.ts +59 -59
  185. package/src/a11y.ts +61 -61
  186. package/src/ai.test.ts +502 -502
  187. package/src/ai.ts +1419 -1419
  188. package/src/build-api.coverage.test.ts +633 -633
  189. package/src/build-api.ts +846 -846
  190. package/src/builtin-editors.grid.test.ts +83 -83
  191. package/src/builtin-editors.test.ts +18 -1
  192. package/src/builtin-editors.ts +19 -3
  193. package/src/cell-formatting.ts +171 -171
  194. package/src/cell-render.test.ts +513 -513
  195. package/src/cell-render.ts +496 -496
  196. package/src/cell-values.ts +148 -118
  197. package/src/chart-export.ts +202 -202
  198. package/src/chart-view.svelte.ts +36 -36
  199. package/src/chart.ts +2321 -2321
  200. package/src/clipboard.test.ts +93 -20
  201. package/src/clipboard.ts +433 -33
  202. package/src/collaboration.test.ts +104 -104
  203. package/src/collaboration.ts +167 -167
  204. package/src/column-groups.ts +78 -78
  205. package/src/core.performance.test.ts +30 -30
  206. package/src/core.ts +1865 -1865
  207. package/src/createAutocomplete.svelte.ts +132 -132
  208. package/src/createCombobox.svelte.ts +191 -191
  209. package/src/createCountryInput.svelte.ts +157 -157
  210. package/src/createDropdownList.svelte.ts +168 -168
  211. package/src/createForm.svelte.ts +386 -386
  212. package/src/createGrid.svelte.ts +42 -42
  213. package/src/createGrid.test.ts +10 -10
  214. package/src/createGridState.svelte.ts +17 -17
  215. package/src/createListbox.svelte.ts +250 -250
  216. package/src/createMenu.svelte.ts +224 -224
  217. package/src/createPopoverSelect.svelte.ts +213 -213
  218. package/src/createSlider.svelte.ts +191 -191
  219. package/src/createTooltip.svelte.ts +144 -144
  220. package/src/createTree.svelte.ts +322 -322
  221. package/src/date-string-column.test.ts +87 -0
  222. package/src/datetime/date-core.ts +206 -206
  223. package/src/datetime/date-restrict.ts +61 -61
  224. package/src/datetime/timezone.ts +135 -135
  225. package/src/dock-manager-model.ts +596 -596
  226. package/src/dock-model.ts +374 -374
  227. package/src/editing.test.ts +974 -949
  228. package/src/editing.ts +609 -606
  229. package/src/editor-block-prop.test.ts +132 -0
  230. package/src/editor-contract.ts +171 -171
  231. package/src/editor-registry.grid.test.ts +144 -144
  232. package/src/editor-registry.ts +122 -122
  233. package/src/editors/cell-editors.ts +27 -1
  234. package/src/export-data-api.test.ts +126 -126
  235. package/src/export-format.test.ts +107 -107
  236. package/src/export-format.ts +601 -601
  237. package/src/filter-operators.ts +160 -160
  238. package/src/filtering/excel-filters.ts +325 -325
  239. package/src/flex-render.ts +3 -3
  240. package/src/form-field.ts +127 -127
  241. package/src/grid-messages.ts +34 -0
  242. package/src/group-display.test.ts +167 -167
  243. package/src/group-display.ts +200 -200
  244. package/src/headless.ts +87 -87
  245. package/src/index.ts +13 -0
  246. package/src/js-scroller.svelte.ts +173 -173
  247. package/src/keyboard-handlers.ts +270 -270
  248. package/src/keyboard.test.ts +59 -59
  249. package/src/keyboard.ts +97 -97
  250. package/src/list-nav.test.ts +49 -49
  251. package/src/list-nav.ts +29 -29
  252. package/src/list-option.test.ts +56 -56
  253. package/src/list-option.ts +179 -173
  254. package/src/menus.test.ts +43 -0
  255. package/src/menus.ts +597 -567
  256. package/src/merge-objects.ts +48 -48
  257. package/src/move-cells.test.ts +850 -0
  258. package/src/number-editor-literal.test.ts +84 -0
  259. package/src/number-editor.grid.test.ts +160 -0
  260. package/src/overlays.test.ts +90 -90
  261. package/src/positioning.ts +268 -268
  262. package/src/render-component.ts +28 -28
  263. package/src/row-drag-touch.ts +211 -211
  264. package/src/row-drag.test.ts +353 -353
  265. package/src/row-drag.ts +415 -415
  266. package/src/row-resize.test.ts +524 -524
  267. package/src/row-resize.ts +228 -228
  268. package/src/sanitize-html.test.ts +182 -0
  269. package/src/sanitize-html.ts +235 -0
  270. package/src/scheduler-ical.ts +181 -181
  271. package/src/scheduler-model.test.ts +562 -562
  272. package/src/scheduler-model.ts +873 -873
  273. package/src/selection-bar-view.svelte.ts +36 -0
  274. package/src/selection.test.ts +900 -743
  275. package/src/selection.ts +131 -13
  276. package/src/server-data-source.test.ts +383 -383
  277. package/src/server-data-source.ts +469 -469
  278. package/src/sparkline.test.ts +68 -68
  279. package/src/sparkline.ts +169 -169
  280. package/src/spreadsheet.test.ts +488 -488
  281. package/src/spreadsheet.ts +312 -312
  282. package/src/static-functions.ts +11 -11
  283. package/src/subscribe.ts +38 -38
  284. package/src/summaries.ts +113 -113
  285. package/src/svgrid-wrapper.types.ts +563 -563
  286. package/src/svgrid.async-editor-options.test.ts +273 -273
  287. package/src/svgrid.auto-row-height.test.ts +204 -204
  288. package/src/svgrid.behavior.test.ts +910 -910
  289. package/src/svgrid.charting.test.ts +534 -534
  290. package/src/svgrid.comments-autocomplete.test.ts +127 -127
  291. package/src/svgrid.context-menu.test.ts +147 -147
  292. package/src/svgrid.features.test.ts +157 -157
  293. package/src/svgrid.filter-depth.test.ts +163 -163
  294. package/src/svgrid.filter-menu-listbox.svelte.test.ts +377 -331
  295. package/src/svgrid.filter-menu-scroll.test.ts +112 -112
  296. package/src/svgrid.grand-total.test.ts +188 -188
  297. package/src/svgrid.group-display-mode.test.ts +171 -171
  298. package/src/svgrid.group-footers.test.ts +121 -121
  299. package/src/svgrid.group-pagination.test.ts +153 -153
  300. package/src/svgrid.in-suggest-snapshot.svelte.test.ts +91 -0
  301. package/src/svgrid.menu-scroll-close.test.ts +204 -0
  302. package/src/svgrid.new-features.wrapper.test.ts +251 -251
  303. package/src/svgrid.selection-bar-seam.test.ts +185 -0
  304. package/src/svgrid.tree-data.test.ts +186 -186
  305. package/src/svgrid.upsell-license.test.ts +117 -0
  306. package/src/svgrid.wrapper.test.ts +63 -63
  307. package/src/svgriddropdown.async-panel.svelte.test.ts +195 -195
  308. package/src/test-setup.ts +62 -62
  309. package/src/themes/index.ts +288 -288
  310. package/src/toast-store.svelte.ts +250 -250
  311. package/src/toast-store.test.ts +147 -147
  312. package/src/tree-row-model.test.ts +168 -168
  313. package/src/ui-buttons.test.ts +144 -144
  314. package/src/ui-inputs.test.ts +118 -118
  315. package/src/ui-localization.test.ts +113 -113
  316. package/src/ui-range.test.ts +70 -70
  317. package/src/ui-selection.test.ts +155 -155
  318. package/src/ui-tier1.test.ts +142 -142
  319. package/src/virtual.test.ts +88 -88
  320. package/src/virtualization/column-virtualizer.test.ts +27 -27
  321. package/src/virtualization/column-virtualizer.ts +30 -30
  322. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  323. package/src/virtualization/types.ts +30 -30
  324. package/src/virtualization/virtualizer.test.ts +47 -47
  325. package/src/virtualization/virtualizer.ts +322 -322
  326. package/dist/cdn/GridMenus-BuoBPqxx.js +0 -493
  327. package/dist/cdn/GridMenus-n4llxoOI.js +0 -494
  328. package/dist/cdn/SvDateTimePicker-CHnUkWcH.js +0 -2206
  329. package/dist/cdn/SvDateTimePicker-CRQH_U7E.js +0 -2201
  330. package/dist/cdn/SvGridCellEditor-BGUCzuPB.js +0 -523
  331. package/dist/cdn/SvGridCellEditor-G8IMWIws.js +0 -522
@@ -1,524 +1,524 @@
1
- import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
2
- import { rowResize } from './row-resize'
3
-
4
- const STRIP_CLASS = 'sv-grid-row-resize-handle'
5
-
6
- // ---------------------------------------------------------------------------
7
- // Helpers
8
- // ---------------------------------------------------------------------------
9
-
10
- /** Build a host `<table>` with `rows` body rows. Each row carries the
11
- * `tr.sv-grid-row` class + a `.sv-row-gutter` cell holding a
12
- * `data-svgrid-row` marker, matching what SvGrid renders. Extra classes
13
- * let individual tests opt rows out (header / spacer / no-gutter). */
14
- function buildGrid(
15
- specs: Array<{ rowClasses?: string[]; gutter?: boolean; rowIndex?: number }>,
16
- ): { host: HTMLElement; rows: HTMLTableRowElement[] } {
17
- const host = document.createElement('div')
18
- const table = document.createElement('table')
19
- const tbody = document.createElement('tbody')
20
- const rows: HTMLTableRowElement[] = []
21
- specs.forEach((spec, i) => {
22
- const tr = document.createElement('tr')
23
- tr.className = ['sv-grid-row', ...(spec.rowClasses ?? [])].join(' ')
24
- const cell = document.createElement('td')
25
- cell.className = 'sv-grid-cell'
26
- if (spec.gutter !== false) cell.classList.add('sv-row-gutter')
27
- const marker = document.createElement('span')
28
- marker.setAttribute('data-svgrid-row', String(spec.rowIndex ?? i))
29
- cell.appendChild(marker)
30
- tr.appendChild(cell)
31
- tbody.appendChild(tr)
32
- rows.push(tr)
33
- })
34
- table.appendChild(tbody)
35
- host.appendChild(table)
36
- document.body.appendChild(host)
37
- return { host, rows }
38
- }
39
-
40
- function gutterOf(tr: HTMLTableRowElement): HTMLTableCellElement {
41
- return tr.querySelector<HTMLTableCellElement>('.sv-row-gutter')!
42
- }
43
- function stripOf(tr: HTMLTableRowElement): HTMLElement | null {
44
- return tr.querySelector<HTMLElement>(`.${STRIP_CLASS}`)
45
- }
46
-
47
- /** Mock getBoundingClientRect so a TR reports a real height in jsdom
48
- * (which otherwise returns all-zero rects). */
49
- function mockRowHeight(tr: HTMLTableRowElement, height: number): void {
50
- tr.getBoundingClientRect = () =>
51
- ({ height, width: 100, top: 0, left: 0, right: 100, bottom: height, x: 0, y: 0, toJSON() {} }) as DOMRect
52
- }
53
-
54
- function pointer(type: string, init: Partial<PointerEvent> = {}): PointerEvent {
55
- return new PointerEvent(type, { bubbles: true, cancelable: true, pointerId: 1, ...init } as PointerEventInit)
56
- }
57
-
58
- const hosts: HTMLElement[] = []
59
- function track(host: HTMLElement): HTMLElement {
60
- hosts.push(host)
61
- return host
62
- }
63
-
64
- beforeEach(() => {
65
- // jsdom lacks pointer-capture methods on elements; stub them so the action's
66
- // try/catch wrapped calls have something to invoke.
67
- if (!HTMLElement.prototype.setPointerCapture) {
68
- HTMLElement.prototype.setPointerCapture = function () {}
69
- }
70
- if (!HTMLElement.prototype.releasePointerCapture) {
71
- HTMLElement.prototype.releasePointerCapture = function () {}
72
- }
73
- })
74
-
75
- afterEach(() => {
76
- while (hosts.length) hosts.pop()!.remove()
77
- document.body.innerHTML = ''
78
- document.body.style.cursor = ''
79
- })
80
-
81
- // ---------------------------------------------------------------------------
82
- // decorate()
83
- // ---------------------------------------------------------------------------
84
-
85
- describe('rowResize - strip injection', () => {
86
- it('injects a resize strip into every gutter cell', () => {
87
- const { host, rows } = buildGrid([{}, {}, {}])
88
- track(host)
89
- const action = rowResize(host, { onResize: vi.fn() })
90
- for (const tr of rows) {
91
- const strip = stripOf(tr)
92
- expect(strip).not.toBeNull()
93
- expect(strip!.getAttribute('role')).toBe('separator')
94
- expect(strip!.getAttribute('aria-orientation')).toBe('horizontal')
95
- expect(strip!.getAttribute('aria-label')).toBe('Resize row')
96
- expect(strip!.style.cursor).toBe('row-resize')
97
- }
98
- // Gutter cells become a positioning context with visible overflow.
99
- expect(gutterOf(rows[0]!).style.position).toBe('relative')
100
- expect(gutterOf(rows[0]!).style.overflow).toBe('visible')
101
- action.destroy()
102
- })
103
-
104
- it('does not double-inject a strip on re-decorate', async () => {
105
- const { host, rows } = buildGrid([{}])
106
- track(host)
107
- const action = rowResize(host, { onResize: vi.fn() })
108
- expect(rows[0]!.querySelectorAll(`.${STRIP_CLASS}`).length).toBe(1)
109
- // Trigger the MutationObserver by appending an unrelated node.
110
- gutterOf(rows[0]!).appendChild(document.createElement('span'))
111
- await Promise.resolve()
112
- await new Promise((r) => setTimeout(r, 0))
113
- expect(rows[0]!.querySelectorAll(`.${STRIP_CLASS}`).length).toBe(1)
114
- action.destroy()
115
- })
116
-
117
- it('skips header rows, spacer rows, and rows without a gutter cell', () => {
118
- const { host, rows } = buildGrid([
119
- { rowClasses: ['sv-grid-header-row'] },
120
- { rowClasses: ['sv-grid-row-spacer'] },
121
- { gutter: false },
122
- {}, // normal row gets a strip
123
- ])
124
- track(host)
125
- const action = rowResize(host, { onResize: vi.fn() })
126
- expect(stripOf(rows[0]!)).toBeNull()
127
- expect(stripOf(rows[1]!)).toBeNull()
128
- expect(stripOf(rows[2]!)).toBeNull()
129
- expect(stripOf(rows[3]!)).not.toBeNull()
130
- action.destroy()
131
- })
132
-
133
- it("anchor 'row' falls back to the first body cell when there is no gutter", () => {
134
- // What `<SvGrid rowResize>` relies on: most grids have no row-number
135
- // column, and without the fallback the prop would be inert on them.
136
- const { host, rows } = buildGrid([{ gutter: false }, { gutter: false }])
137
- track(host)
138
- const action = rowResize(host, { onResize: vi.fn(), anchor: 'row' })
139
- expect(stripOf(rows[0]!)).not.toBeNull()
140
- expect(stripOf(rows[1]!)).not.toBeNull()
141
- // The strip hangs off the row's first cell, since that is all there is.
142
- expect(stripOf(rows[0]!)!.parentElement).toBe(rows[0]!.querySelector('.sv-grid-cell'))
143
- action.destroy()
144
- })
145
-
146
- it("anchor 'row' still prefers a real gutter when the row has one", () => {
147
- const { host, rows } = buildGrid([{ gutter: true }])
148
- track(host)
149
- const action = rowResize(host, { onResize: vi.fn(), anchor: 'row' })
150
- expect(stripOf(rows[0]!)!.parentElement).toBe(gutterOf(rows[0]!))
151
- action.destroy()
152
- })
153
-
154
- it("defaults to anchor 'gutter', leaving gutterless rows alone", () => {
155
- // The exported action's existing contract. Adding the fallback must not
156
- // start decorating rows for consumers who never asked for it.
157
- const { host, rows } = buildGrid([{ gutter: false }])
158
- track(host)
159
- const action = rowResize(host, { onResize: vi.fn() })
160
- expect(stripOf(rows[0]!)).toBeNull()
161
- action.destroy()
162
- })
163
-
164
- it('also injects a strip into the built-in row-number gutter (showRowNumbers)', () => {
165
- // The native gutter cell is `.sv-grid-cell.sv-grid-row-number-cell`, NOT
166
- // `.sv-row-gutter`; the action must recognise it so `showRowNumbers` grids
167
- // are row-resizable without a custom gutter column.
168
- const host = document.createElement('div')
169
- const table = document.createElement('table')
170
- const tbody = document.createElement('tbody')
171
- const tr = document.createElement('tr')
172
- tr.className = 'sv-grid-row'
173
- const gutter = document.createElement('td')
174
- gutter.className = 'sv-grid-cell sv-grid-row-number-cell'
175
- const marker = document.createElement('span')
176
- marker.setAttribute('data-svgrid-row', '0')
177
- gutter.appendChild(marker)
178
- tr.appendChild(gutter)
179
- tbody.appendChild(tr)
180
- table.appendChild(tbody)
181
- host.appendChild(table)
182
- document.body.appendChild(host)
183
- track(host)
184
- const action = rowResize(host, { onResize: vi.fn() })
185
- expect(tr.querySelector(`.${STRIP_CLASS}`)).not.toBeNull()
186
- action.destroy()
187
- })
188
-
189
- it('does not override an already-positioned gutter cell', () => {
190
- const { host, rows } = buildGrid([{}])
191
- track(host)
192
- gutterOf(rows[0]!).style.position = 'sticky'
193
- const action = rowResize(host, { onResize: vi.fn() })
194
- expect(gutterOf(rows[0]!).style.position).toBe('sticky')
195
- action.destroy()
196
- })
197
-
198
- it('injects no strips when created disabled', () => {
199
- const { host, rows } = buildGrid([{}, {}])
200
- track(host)
201
- const action = rowResize(host, { onResize: vi.fn(), disabled: true })
202
- expect(stripOf(rows[0]!)).toBeNull()
203
- expect(stripOf(rows[1]!)).toBeNull()
204
- action.destroy()
205
- })
206
- })
207
-
208
- // ---------------------------------------------------------------------------
209
- // Drag lifecycle
210
- // ---------------------------------------------------------------------------
211
-
212
- describe('rowResize - drag', () => {
213
- it('reports the new height on pointerup and fires move callbacks', () => {
214
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
215
- track(host)
216
- mockRowHeight(rows[0]!, 32)
217
- const onResize = vi.fn()
218
- const onResizeMove = vi.fn()
219
- const action = rowResize(host, { onResize, onResizeMove })
220
- const strip = stripOf(rows[0]!)!
221
-
222
- strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
223
- expect(strip.classList.contains('is-resizing')).toBe(true)
224
- expect(document.body.style.cursor).toBe('row-resize')
225
-
226
- // Drag down 20px -> 52.
227
- window.dispatchEvent(pointer('pointermove', { clientY: 120 }))
228
- expect(onResizeMove).toHaveBeenLastCalledWith(0, 52)
229
- expect(rows[0]!.style.height).toBe('52px')
230
-
231
- window.dispatchEvent(pointer('pointerup', { clientY: 120 }))
232
- expect(onResize).toHaveBeenCalledWith(0, 52)
233
- expect(strip.classList.contains('is-resizing')).toBe(false)
234
- expect(document.body.style.cursor).toBe('')
235
- action.destroy()
236
- })
237
-
238
- it('clamps the height to the min bound', () => {
239
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
240
- track(host)
241
- mockRowHeight(rows[0]!, 32)
242
- const onResize = vi.fn()
243
- const action = rowResize(host, { onResize, min: 24 })
244
- const strip = stripOf(rows[0]!)!
245
- strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
246
- // Drag far up -> would be negative, clamps to 24.
247
- window.dispatchEvent(pointer('pointerup', { clientY: 0 }))
248
- expect(onResize).toHaveBeenCalledWith(0, 24)
249
- action.destroy()
250
- })
251
-
252
- it('clamps the height to the max bound', () => {
253
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
254
- track(host)
255
- mockRowHeight(rows[0]!, 32)
256
- const onResize = vi.fn()
257
- const action = rowResize(host, { onResize, max: 50 })
258
- const strip = stripOf(rows[0]!)!
259
- strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
260
- window.dispatchEvent(pointer('pointerup', { clientY: 1000 }))
261
- expect(onResize).toHaveBeenCalledWith(0, 50)
262
- action.destroy()
263
- })
264
-
265
- it('works without an onResizeMove callback (optional)', () => {
266
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
267
- track(host)
268
- mockRowHeight(rows[0]!, 30)
269
- const onResize = vi.fn()
270
- const action = rowResize(host, { onResize })
271
- const strip = stripOf(rows[0]!)!
272
- strip.dispatchEvent(pointer('pointerdown', { clientY: 50 }))
273
- expect(() => window.dispatchEvent(pointer('pointermove', { clientY: 60 }))).not.toThrow()
274
- window.dispatchEvent(pointer('pointerup', { clientY: 60 }))
275
- expect(onResize).toHaveBeenCalledWith(0, 40)
276
- action.destroy()
277
- })
278
-
279
- it('ignores pointermove / pointerup when no drag is active', () => {
280
- const { host } = buildGrid([{ rowIndex: 0 }])
281
- track(host)
282
- const onResize = vi.fn()
283
- const onResizeMove = vi.fn()
284
- const action = rowResize(host, { onResize, onResizeMove })
285
- // No pointerdown first - listeners were only attached on down, so these
286
- // shouldn't do anything even if dispatched.
287
- window.dispatchEvent(pointer('pointermove', { clientY: 10 }))
288
- window.dispatchEvent(pointer('pointerup', { clientY: 10 }))
289
- expect(onResize).not.toHaveBeenCalled()
290
- expect(onResizeMove).not.toHaveBeenCalled()
291
- action.destroy()
292
- })
293
- })
294
-
295
- // ---------------------------------------------------------------------------
296
- // pointerdown guards
297
- // ---------------------------------------------------------------------------
298
-
299
- describe('rowResize - pointerdown guards', () => {
300
- it('ignores pointerdown when disabled', () => {
301
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
302
- track(host)
303
- mockRowHeight(rows[0]!, 32)
304
- const onResize = vi.fn()
305
- // Start enabled so a strip exists, then disable via update.
306
- const action = rowResize(host, { onResize })
307
- const strip = stripOf(rows[0]!)!
308
- action.update({ onResize, disabled: true })
309
- // update removes strips, but dispatch on the (now-detached) strip anyway:
310
- // even if it were still in the DOM, current.disabled short-circuits.
311
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
312
- window.dispatchEvent(pointer('pointerup', { clientY: 50 }))
313
- expect(onResize).not.toHaveBeenCalled()
314
- action.destroy()
315
- })
316
-
317
- it('ignores pointerdown on a non-strip target', () => {
318
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
319
- track(host)
320
- const onResize = vi.fn()
321
- const action = rowResize(host, { onResize })
322
- gutterOf(rows[0]!).dispatchEvent(pointer('pointerdown', { clientY: 10 }))
323
- expect(document.body.style.cursor).toBe('')
324
- action.destroy()
325
- })
326
-
327
- it('ignores a strip whose row has a non-finite row index', () => {
328
- const { host, rows } = buildGrid([{}])
329
- track(host)
330
- // Remove the data-svgrid-row marker so rowIndexOf returns NaN.
331
- rows[0]!.querySelector('[data-svgrid-row]')!.removeAttribute('data-svgrid-row')
332
- const onResize = vi.fn()
333
- const action = rowResize(host, { onResize })
334
- const strip = stripOf(rows[0]!)!
335
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
336
- expect(document.body.style.cursor).toBe('')
337
- expect(strip.classList.contains('is-resizing')).toBe(false)
338
- action.destroy()
339
- })
340
-
341
- it('ignores a strip not inside a tr.sv-grid-row', () => {
342
- const host = track(document.createElement('div'))
343
- document.body.appendChild(host)
344
- // A loose strip with no matching ancestor row.
345
- const strip = document.createElement('div')
346
- strip.className = STRIP_CLASS
347
- host.appendChild(strip)
348
- const onResize = vi.fn()
349
- const action = rowResize(host, { onResize })
350
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
351
- expect(document.body.style.cursor).toBe('')
352
- action.destroy()
353
- })
354
- })
355
-
356
- // ---------------------------------------------------------------------------
357
- // update() + destroy()
358
- // ---------------------------------------------------------------------------
359
-
360
- describe('rowResize - update + destroy', () => {
361
- it('removes strips when toggled to disabled and restores when re-enabled', () => {
362
- const { host, rows } = buildGrid([{}, {}])
363
- track(host)
364
- const onResize = vi.fn()
365
- const action = rowResize(host, { onResize, disabled: false })
366
- expect(stripOf(rows[0]!)).not.toBeNull()
367
-
368
- action.update({ onResize, disabled: true })
369
- expect(stripOf(rows[0]!)).toBeNull()
370
- expect(stripOf(rows[1]!)).toBeNull()
371
-
372
- action.update({ onResize, disabled: false })
373
- expect(stripOf(rows[0]!)).not.toBeNull()
374
- action.destroy()
375
- })
376
-
377
- it('does not repaint when disabled flag is unchanged on update', () => {
378
- const { host, rows } = buildGrid([{}])
379
- track(host)
380
- const action = rowResize(host, { onResize: vi.fn() })
381
- const firstStrip = stripOf(rows[0]!)
382
- // Same disabled value -> decorate is NOT called, strip stays the same node.
383
- action.update({ onResize: vi.fn() })
384
- expect(stripOf(rows[0]!)).toBe(firstStrip)
385
- action.destroy()
386
- })
387
-
388
- it('destroy removes all strips and detaches listeners', () => {
389
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
390
- track(host)
391
- mockRowHeight(rows[0]!, 32)
392
- const onResize = vi.fn()
393
- const action = rowResize(host, { onResize })
394
- expect(stripOf(rows[0]!)).not.toBeNull()
395
-
396
- action.destroy()
397
- expect(stripOf(rows[0]!)).toBeNull()
398
-
399
- // After destroy the pointerdown listener is gone; re-create a strip
400
- // manually and confirm no drag starts.
401
- const strip = document.createElement('div')
402
- strip.className = STRIP_CLASS
403
- gutterOf(rows[0]!).appendChild(strip)
404
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
405
- expect(document.body.style.cursor).toBe('')
406
- })
407
-
408
- it('uses default min=20 / max=320 when bounds are omitted', () => {
409
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
410
- track(host)
411
- mockRowHeight(rows[0]!, 100)
412
- const onResize = vi.fn()
413
- const action = rowResize(host, { onResize })
414
- const strip = stripOf(rows[0]!)!
415
- strip.dispatchEvent(pointer('pointerdown', { clientY: 0 }))
416
- // Drag way past max -> clamps to 320.
417
- window.dispatchEvent(pointer('pointermove', { clientY: 10000 }))
418
- expect(rows[0]!.style.height).toBe('320px')
419
- // Drag way below min -> clamps to 20.
420
- window.dispatchEvent(pointer('pointerup', { clientY: -10000 }))
421
- expect(onResize).toHaveBeenCalledWith(0, 20)
422
- action.destroy()
423
- })
424
- })
425
-
426
- // ---------------------------------------------------------------------------
427
- // Keyboard resize (#79)
428
- // ---------------------------------------------------------------------------
429
-
430
- describe('rowResize - keyboard', () => {
431
- function key(k: string, init: Partial<KeyboardEvent> = {}): KeyboardEvent {
432
- return new KeyboardEvent('keydown', { key: k, bubbles: true, cancelable: true, ...init })
433
- }
434
-
435
- it('makes the strip focusable', () => {
436
- const { host, rows } = buildGrid([{}])
437
- track(host)
438
- const action = rowResize(host, { onResize: vi.fn() })
439
- expect(stripOf(rows[0]!)!.tabIndex).toBe(0)
440
- action.destroy()
441
- })
442
-
443
- it('ArrowDown grows the row by 10px and reports the new height', () => {
444
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
445
- track(host)
446
- mockRowHeight(rows[0]!, 32)
447
- const onResize = vi.fn()
448
- const action = rowResize(host, { onResize })
449
- stripOf(rows[0]!)!.dispatchEvent(key('ArrowDown'))
450
- expect(rows[0]!.style.height).toBe('42px')
451
- expect(onResize).toHaveBeenCalledWith(0, 42)
452
- action.destroy()
453
- })
454
-
455
- it('ArrowUp shrinks the row and Shift gives a 1px step', () => {
456
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
457
- track(host)
458
- mockRowHeight(rows[0]!, 60)
459
- const onResize = vi.fn()
460
- const action = rowResize(host, { onResize })
461
- const strip = stripOf(rows[0]!)!
462
- strip.dispatchEvent(key('ArrowUp'))
463
- expect(onResize).toHaveBeenLastCalledWith(0, 50)
464
- strip.dispatchEvent(key('ArrowUp', { shiftKey: true }))
465
- expect(onResize).toHaveBeenLastCalledWith(0, 59)
466
- action.destroy()
467
- })
468
-
469
- it('clamps to the configured min and max', () => {
470
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
471
- track(host)
472
- mockRowHeight(rows[0]!, 42)
473
- const onResize = vi.fn()
474
- const action = rowResize(host, { onResize, min: 40, max: 44 })
475
- const strip = stripOf(rows[0]!)!
476
- strip.dispatchEvent(key('ArrowUp'))
477
- expect(onResize).toHaveBeenLastCalledWith(0, 40)
478
- strip.dispatchEvent(key('ArrowDown'))
479
- expect(onResize).toHaveBeenLastCalledWith(0, 44)
480
- action.destroy()
481
- })
482
-
483
- it('ignores keys other than the arrows and consumes the ones it handles', () => {
484
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
485
- track(host)
486
- mockRowHeight(rows[0]!, 32)
487
- const onResize = vi.fn()
488
- const action = rowResize(host, { onResize })
489
- const strip = stripOf(rows[0]!)!
490
- const other = key('Enter')
491
- strip.dispatchEvent(other)
492
- expect(onResize).not.toHaveBeenCalled()
493
- expect(other.defaultPrevented).toBe(false)
494
- const handled = key('ArrowDown')
495
- strip.dispatchEvent(handled)
496
- expect(handled.defaultPrevented).toBe(true)
497
- action.destroy()
498
- })
499
-
500
- it('does nothing while disabled, and stops after destroy', () => {
501
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
502
- track(host)
503
- mockRowHeight(rows[0]!, 32)
504
- const onResize = vi.fn()
505
- const action = rowResize(host, { onResize, disabled: true })
506
- // Disabled removes the strips entirely, so drive a hand-made one.
507
- const strip = document.createElement('div')
508
- strip.className = STRIP_CLASS
509
- gutterOf(rows[0]!).appendChild(strip)
510
- strip.dispatchEvent(key('ArrowDown'))
511
- expect(onResize).not.toHaveBeenCalled()
512
-
513
- action.update({ onResize })
514
- stripOf(rows[0]!)!.dispatchEvent(key('ArrowDown'))
515
- expect(onResize).toHaveBeenCalledTimes(1)
516
-
517
- action.destroy()
518
- const orphan = document.createElement('div')
519
- orphan.className = STRIP_CLASS
520
- gutterOf(rows[0]!).appendChild(orphan)
521
- orphan.dispatchEvent(key('ArrowDown'))
522
- expect(onResize).toHaveBeenCalledTimes(1)
523
- })
524
- })
1
+ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
2
+ import { rowResize } from './row-resize'
3
+
4
+ const STRIP_CLASS = 'sv-grid-row-resize-handle'
5
+
6
+ // ---------------------------------------------------------------------------
7
+ // Helpers
8
+ // ---------------------------------------------------------------------------
9
+
10
+ /** Build a host `<table>` with `rows` body rows. Each row carries the
11
+ * `tr.sv-grid-row` class + a `.sv-row-gutter` cell holding a
12
+ * `data-svgrid-row` marker, matching what SvGrid renders. Extra classes
13
+ * let individual tests opt rows out (header / spacer / no-gutter). */
14
+ function buildGrid(
15
+ specs: Array<{ rowClasses?: string[]; gutter?: boolean; rowIndex?: number }>,
16
+ ): { host: HTMLElement; rows: HTMLTableRowElement[] } {
17
+ const host = document.createElement('div')
18
+ const table = document.createElement('table')
19
+ const tbody = document.createElement('tbody')
20
+ const rows: HTMLTableRowElement[] = []
21
+ specs.forEach((spec, i) => {
22
+ const tr = document.createElement('tr')
23
+ tr.className = ['sv-grid-row', ...(spec.rowClasses ?? [])].join(' ')
24
+ const cell = document.createElement('td')
25
+ cell.className = 'sv-grid-cell'
26
+ if (spec.gutter !== false) cell.classList.add('sv-row-gutter')
27
+ const marker = document.createElement('span')
28
+ marker.setAttribute('data-svgrid-row', String(spec.rowIndex ?? i))
29
+ cell.appendChild(marker)
30
+ tr.appendChild(cell)
31
+ tbody.appendChild(tr)
32
+ rows.push(tr)
33
+ })
34
+ table.appendChild(tbody)
35
+ host.appendChild(table)
36
+ document.body.appendChild(host)
37
+ return { host, rows }
38
+ }
39
+
40
+ function gutterOf(tr: HTMLTableRowElement): HTMLTableCellElement {
41
+ return tr.querySelector<HTMLTableCellElement>('.sv-row-gutter')!
42
+ }
43
+ function stripOf(tr: HTMLTableRowElement): HTMLElement | null {
44
+ return tr.querySelector<HTMLElement>(`.${STRIP_CLASS}`)
45
+ }
46
+
47
+ /** Mock getBoundingClientRect so a TR reports a real height in jsdom
48
+ * (which otherwise returns all-zero rects). */
49
+ function mockRowHeight(tr: HTMLTableRowElement, height: number): void {
50
+ tr.getBoundingClientRect = () =>
51
+ ({ height, width: 100, top: 0, left: 0, right: 100, bottom: height, x: 0, y: 0, toJSON() {} }) as DOMRect
52
+ }
53
+
54
+ function pointer(type: string, init: Partial<PointerEvent> = {}): PointerEvent {
55
+ return new PointerEvent(type, { bubbles: true, cancelable: true, pointerId: 1, ...init } as PointerEventInit)
56
+ }
57
+
58
+ const hosts: HTMLElement[] = []
59
+ function track(host: HTMLElement): HTMLElement {
60
+ hosts.push(host)
61
+ return host
62
+ }
63
+
64
+ beforeEach(() => {
65
+ // jsdom lacks pointer-capture methods on elements; stub them so the action's
66
+ // try/catch wrapped calls have something to invoke.
67
+ if (!HTMLElement.prototype.setPointerCapture) {
68
+ HTMLElement.prototype.setPointerCapture = function () {}
69
+ }
70
+ if (!HTMLElement.prototype.releasePointerCapture) {
71
+ HTMLElement.prototype.releasePointerCapture = function () {}
72
+ }
73
+ })
74
+
75
+ afterEach(() => {
76
+ while (hosts.length) hosts.pop()!.remove()
77
+ document.body.innerHTML = ''
78
+ document.body.style.cursor = ''
79
+ })
80
+
81
+ // ---------------------------------------------------------------------------
82
+ // decorate()
83
+ // ---------------------------------------------------------------------------
84
+
85
+ describe('rowResize - strip injection', () => {
86
+ it('injects a resize strip into every gutter cell', () => {
87
+ const { host, rows } = buildGrid([{}, {}, {}])
88
+ track(host)
89
+ const action = rowResize(host, { onResize: vi.fn() })
90
+ for (const tr of rows) {
91
+ const strip = stripOf(tr)
92
+ expect(strip).not.toBeNull()
93
+ expect(strip!.getAttribute('role')).toBe('separator')
94
+ expect(strip!.getAttribute('aria-orientation')).toBe('horizontal')
95
+ expect(strip!.getAttribute('aria-label')).toBe('Resize row')
96
+ expect(strip!.style.cursor).toBe('row-resize')
97
+ }
98
+ // Gutter cells become a positioning context with visible overflow.
99
+ expect(gutterOf(rows[0]!).style.position).toBe('relative')
100
+ expect(gutterOf(rows[0]!).style.overflow).toBe('visible')
101
+ action.destroy()
102
+ })
103
+
104
+ it('does not double-inject a strip on re-decorate', async () => {
105
+ const { host, rows } = buildGrid([{}])
106
+ track(host)
107
+ const action = rowResize(host, { onResize: vi.fn() })
108
+ expect(rows[0]!.querySelectorAll(`.${STRIP_CLASS}`).length).toBe(1)
109
+ // Trigger the MutationObserver by appending an unrelated node.
110
+ gutterOf(rows[0]!).appendChild(document.createElement('span'))
111
+ await Promise.resolve()
112
+ await new Promise((r) => setTimeout(r, 0))
113
+ expect(rows[0]!.querySelectorAll(`.${STRIP_CLASS}`).length).toBe(1)
114
+ action.destroy()
115
+ })
116
+
117
+ it('skips header rows, spacer rows, and rows without a gutter cell', () => {
118
+ const { host, rows } = buildGrid([
119
+ { rowClasses: ['sv-grid-header-row'] },
120
+ { rowClasses: ['sv-grid-row-spacer'] },
121
+ { gutter: false },
122
+ {}, // normal row gets a strip
123
+ ])
124
+ track(host)
125
+ const action = rowResize(host, { onResize: vi.fn() })
126
+ expect(stripOf(rows[0]!)).toBeNull()
127
+ expect(stripOf(rows[1]!)).toBeNull()
128
+ expect(stripOf(rows[2]!)).toBeNull()
129
+ expect(stripOf(rows[3]!)).not.toBeNull()
130
+ action.destroy()
131
+ })
132
+
133
+ it("anchor 'row' falls back to the first body cell when there is no gutter", () => {
134
+ // What `<SvGrid rowResize>` relies on: most grids have no row-number
135
+ // column, and without the fallback the prop would be inert on them.
136
+ const { host, rows } = buildGrid([{ gutter: false }, { gutter: false }])
137
+ track(host)
138
+ const action = rowResize(host, { onResize: vi.fn(), anchor: 'row' })
139
+ expect(stripOf(rows[0]!)).not.toBeNull()
140
+ expect(stripOf(rows[1]!)).not.toBeNull()
141
+ // The strip hangs off the row's first cell, since that is all there is.
142
+ expect(stripOf(rows[0]!)!.parentElement).toBe(rows[0]!.querySelector('.sv-grid-cell'))
143
+ action.destroy()
144
+ })
145
+
146
+ it("anchor 'row' still prefers a real gutter when the row has one", () => {
147
+ const { host, rows } = buildGrid([{ gutter: true }])
148
+ track(host)
149
+ const action = rowResize(host, { onResize: vi.fn(), anchor: 'row' })
150
+ expect(stripOf(rows[0]!)!.parentElement).toBe(gutterOf(rows[0]!))
151
+ action.destroy()
152
+ })
153
+
154
+ it("defaults to anchor 'gutter', leaving gutterless rows alone", () => {
155
+ // The exported action's existing contract. Adding the fallback must not
156
+ // start decorating rows for consumers who never asked for it.
157
+ const { host, rows } = buildGrid([{ gutter: false }])
158
+ track(host)
159
+ const action = rowResize(host, { onResize: vi.fn() })
160
+ expect(stripOf(rows[0]!)).toBeNull()
161
+ action.destroy()
162
+ })
163
+
164
+ it('also injects a strip into the built-in row-number gutter (showRowNumbers)', () => {
165
+ // The native gutter cell is `.sv-grid-cell.sv-grid-row-number-cell`, NOT
166
+ // `.sv-row-gutter`; the action must recognise it so `showRowNumbers` grids
167
+ // are row-resizable without a custom gutter column.
168
+ const host = document.createElement('div')
169
+ const table = document.createElement('table')
170
+ const tbody = document.createElement('tbody')
171
+ const tr = document.createElement('tr')
172
+ tr.className = 'sv-grid-row'
173
+ const gutter = document.createElement('td')
174
+ gutter.className = 'sv-grid-cell sv-grid-row-number-cell'
175
+ const marker = document.createElement('span')
176
+ marker.setAttribute('data-svgrid-row', '0')
177
+ gutter.appendChild(marker)
178
+ tr.appendChild(gutter)
179
+ tbody.appendChild(tr)
180
+ table.appendChild(tbody)
181
+ host.appendChild(table)
182
+ document.body.appendChild(host)
183
+ track(host)
184
+ const action = rowResize(host, { onResize: vi.fn() })
185
+ expect(tr.querySelector(`.${STRIP_CLASS}`)).not.toBeNull()
186
+ action.destroy()
187
+ })
188
+
189
+ it('does not override an already-positioned gutter cell', () => {
190
+ const { host, rows } = buildGrid([{}])
191
+ track(host)
192
+ gutterOf(rows[0]!).style.position = 'sticky'
193
+ const action = rowResize(host, { onResize: vi.fn() })
194
+ expect(gutterOf(rows[0]!).style.position).toBe('sticky')
195
+ action.destroy()
196
+ })
197
+
198
+ it('injects no strips when created disabled', () => {
199
+ const { host, rows } = buildGrid([{}, {}])
200
+ track(host)
201
+ const action = rowResize(host, { onResize: vi.fn(), disabled: true })
202
+ expect(stripOf(rows[0]!)).toBeNull()
203
+ expect(stripOf(rows[1]!)).toBeNull()
204
+ action.destroy()
205
+ })
206
+ })
207
+
208
+ // ---------------------------------------------------------------------------
209
+ // Drag lifecycle
210
+ // ---------------------------------------------------------------------------
211
+
212
+ describe('rowResize - drag', () => {
213
+ it('reports the new height on pointerup and fires move callbacks', () => {
214
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
215
+ track(host)
216
+ mockRowHeight(rows[0]!, 32)
217
+ const onResize = vi.fn()
218
+ const onResizeMove = vi.fn()
219
+ const action = rowResize(host, { onResize, onResizeMove })
220
+ const strip = stripOf(rows[0]!)!
221
+
222
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
223
+ expect(strip.classList.contains('is-resizing')).toBe(true)
224
+ expect(document.body.style.cursor).toBe('row-resize')
225
+
226
+ // Drag down 20px -> 52.
227
+ window.dispatchEvent(pointer('pointermove', { clientY: 120 }))
228
+ expect(onResizeMove).toHaveBeenLastCalledWith(0, 52)
229
+ expect(rows[0]!.style.height).toBe('52px')
230
+
231
+ window.dispatchEvent(pointer('pointerup', { clientY: 120 }))
232
+ expect(onResize).toHaveBeenCalledWith(0, 52)
233
+ expect(strip.classList.contains('is-resizing')).toBe(false)
234
+ expect(document.body.style.cursor).toBe('')
235
+ action.destroy()
236
+ })
237
+
238
+ it('clamps the height to the min bound', () => {
239
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
240
+ track(host)
241
+ mockRowHeight(rows[0]!, 32)
242
+ const onResize = vi.fn()
243
+ const action = rowResize(host, { onResize, min: 24 })
244
+ const strip = stripOf(rows[0]!)!
245
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
246
+ // Drag far up -> would be negative, clamps to 24.
247
+ window.dispatchEvent(pointer('pointerup', { clientY: 0 }))
248
+ expect(onResize).toHaveBeenCalledWith(0, 24)
249
+ action.destroy()
250
+ })
251
+
252
+ it('clamps the height to the max bound', () => {
253
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
254
+ track(host)
255
+ mockRowHeight(rows[0]!, 32)
256
+ const onResize = vi.fn()
257
+ const action = rowResize(host, { onResize, max: 50 })
258
+ const strip = stripOf(rows[0]!)!
259
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
260
+ window.dispatchEvent(pointer('pointerup', { clientY: 1000 }))
261
+ expect(onResize).toHaveBeenCalledWith(0, 50)
262
+ action.destroy()
263
+ })
264
+
265
+ it('works without an onResizeMove callback (optional)', () => {
266
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
267
+ track(host)
268
+ mockRowHeight(rows[0]!, 30)
269
+ const onResize = vi.fn()
270
+ const action = rowResize(host, { onResize })
271
+ const strip = stripOf(rows[0]!)!
272
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 50 }))
273
+ expect(() => window.dispatchEvent(pointer('pointermove', { clientY: 60 }))).not.toThrow()
274
+ window.dispatchEvent(pointer('pointerup', { clientY: 60 }))
275
+ expect(onResize).toHaveBeenCalledWith(0, 40)
276
+ action.destroy()
277
+ })
278
+
279
+ it('ignores pointermove / pointerup when no drag is active', () => {
280
+ const { host } = buildGrid([{ rowIndex: 0 }])
281
+ track(host)
282
+ const onResize = vi.fn()
283
+ const onResizeMove = vi.fn()
284
+ const action = rowResize(host, { onResize, onResizeMove })
285
+ // No pointerdown first - listeners were only attached on down, so these
286
+ // shouldn't do anything even if dispatched.
287
+ window.dispatchEvent(pointer('pointermove', { clientY: 10 }))
288
+ window.dispatchEvent(pointer('pointerup', { clientY: 10 }))
289
+ expect(onResize).not.toHaveBeenCalled()
290
+ expect(onResizeMove).not.toHaveBeenCalled()
291
+ action.destroy()
292
+ })
293
+ })
294
+
295
+ // ---------------------------------------------------------------------------
296
+ // pointerdown guards
297
+ // ---------------------------------------------------------------------------
298
+
299
+ describe('rowResize - pointerdown guards', () => {
300
+ it('ignores pointerdown when disabled', () => {
301
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
302
+ track(host)
303
+ mockRowHeight(rows[0]!, 32)
304
+ const onResize = vi.fn()
305
+ // Start enabled so a strip exists, then disable via update.
306
+ const action = rowResize(host, { onResize })
307
+ const strip = stripOf(rows[0]!)!
308
+ action.update({ onResize, disabled: true })
309
+ // update removes strips, but dispatch on the (now-detached) strip anyway:
310
+ // even if it were still in the DOM, current.disabled short-circuits.
311
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
312
+ window.dispatchEvent(pointer('pointerup', { clientY: 50 }))
313
+ expect(onResize).not.toHaveBeenCalled()
314
+ action.destroy()
315
+ })
316
+
317
+ it('ignores pointerdown on a non-strip target', () => {
318
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
319
+ track(host)
320
+ const onResize = vi.fn()
321
+ const action = rowResize(host, { onResize })
322
+ gutterOf(rows[0]!).dispatchEvent(pointer('pointerdown', { clientY: 10 }))
323
+ expect(document.body.style.cursor).toBe('')
324
+ action.destroy()
325
+ })
326
+
327
+ it('ignores a strip whose row has a non-finite row index', () => {
328
+ const { host, rows } = buildGrid([{}])
329
+ track(host)
330
+ // Remove the data-svgrid-row marker so rowIndexOf returns NaN.
331
+ rows[0]!.querySelector('[data-svgrid-row]')!.removeAttribute('data-svgrid-row')
332
+ const onResize = vi.fn()
333
+ const action = rowResize(host, { onResize })
334
+ const strip = stripOf(rows[0]!)!
335
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
336
+ expect(document.body.style.cursor).toBe('')
337
+ expect(strip.classList.contains('is-resizing')).toBe(false)
338
+ action.destroy()
339
+ })
340
+
341
+ it('ignores a strip not inside a tr.sv-grid-row', () => {
342
+ const host = track(document.createElement('div'))
343
+ document.body.appendChild(host)
344
+ // A loose strip with no matching ancestor row.
345
+ const strip = document.createElement('div')
346
+ strip.className = STRIP_CLASS
347
+ host.appendChild(strip)
348
+ const onResize = vi.fn()
349
+ const action = rowResize(host, { onResize })
350
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
351
+ expect(document.body.style.cursor).toBe('')
352
+ action.destroy()
353
+ })
354
+ })
355
+
356
+ // ---------------------------------------------------------------------------
357
+ // update() + destroy()
358
+ // ---------------------------------------------------------------------------
359
+
360
+ describe('rowResize - update + destroy', () => {
361
+ it('removes strips when toggled to disabled and restores when re-enabled', () => {
362
+ const { host, rows } = buildGrid([{}, {}])
363
+ track(host)
364
+ const onResize = vi.fn()
365
+ const action = rowResize(host, { onResize, disabled: false })
366
+ expect(stripOf(rows[0]!)).not.toBeNull()
367
+
368
+ action.update({ onResize, disabled: true })
369
+ expect(stripOf(rows[0]!)).toBeNull()
370
+ expect(stripOf(rows[1]!)).toBeNull()
371
+
372
+ action.update({ onResize, disabled: false })
373
+ expect(stripOf(rows[0]!)).not.toBeNull()
374
+ action.destroy()
375
+ })
376
+
377
+ it('does not repaint when disabled flag is unchanged on update', () => {
378
+ const { host, rows } = buildGrid([{}])
379
+ track(host)
380
+ const action = rowResize(host, { onResize: vi.fn() })
381
+ const firstStrip = stripOf(rows[0]!)
382
+ // Same disabled value -> decorate is NOT called, strip stays the same node.
383
+ action.update({ onResize: vi.fn() })
384
+ expect(stripOf(rows[0]!)).toBe(firstStrip)
385
+ action.destroy()
386
+ })
387
+
388
+ it('destroy removes all strips and detaches listeners', () => {
389
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
390
+ track(host)
391
+ mockRowHeight(rows[0]!, 32)
392
+ const onResize = vi.fn()
393
+ const action = rowResize(host, { onResize })
394
+ expect(stripOf(rows[0]!)).not.toBeNull()
395
+
396
+ action.destroy()
397
+ expect(stripOf(rows[0]!)).toBeNull()
398
+
399
+ // After destroy the pointerdown listener is gone; re-create a strip
400
+ // manually and confirm no drag starts.
401
+ const strip = document.createElement('div')
402
+ strip.className = STRIP_CLASS
403
+ gutterOf(rows[0]!).appendChild(strip)
404
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
405
+ expect(document.body.style.cursor).toBe('')
406
+ })
407
+
408
+ it('uses default min=20 / max=320 when bounds are omitted', () => {
409
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
410
+ track(host)
411
+ mockRowHeight(rows[0]!, 100)
412
+ const onResize = vi.fn()
413
+ const action = rowResize(host, { onResize })
414
+ const strip = stripOf(rows[0]!)!
415
+ strip.dispatchEvent(pointer('pointerdown', { clientY: 0 }))
416
+ // Drag way past max -> clamps to 320.
417
+ window.dispatchEvent(pointer('pointermove', { clientY: 10000 }))
418
+ expect(rows[0]!.style.height).toBe('320px')
419
+ // Drag way below min -> clamps to 20.
420
+ window.dispatchEvent(pointer('pointerup', { clientY: -10000 }))
421
+ expect(onResize).toHaveBeenCalledWith(0, 20)
422
+ action.destroy()
423
+ })
424
+ })
425
+
426
+ // ---------------------------------------------------------------------------
427
+ // Keyboard resize (#79)
428
+ // ---------------------------------------------------------------------------
429
+
430
+ describe('rowResize - keyboard', () => {
431
+ function key(k: string, init: Partial<KeyboardEvent> = {}): KeyboardEvent {
432
+ return new KeyboardEvent('keydown', { key: k, bubbles: true, cancelable: true, ...init })
433
+ }
434
+
435
+ it('makes the strip focusable', () => {
436
+ const { host, rows } = buildGrid([{}])
437
+ track(host)
438
+ const action = rowResize(host, { onResize: vi.fn() })
439
+ expect(stripOf(rows[0]!)!.tabIndex).toBe(0)
440
+ action.destroy()
441
+ })
442
+
443
+ it('ArrowDown grows the row by 10px and reports the new height', () => {
444
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
445
+ track(host)
446
+ mockRowHeight(rows[0]!, 32)
447
+ const onResize = vi.fn()
448
+ const action = rowResize(host, { onResize })
449
+ stripOf(rows[0]!)!.dispatchEvent(key('ArrowDown'))
450
+ expect(rows[0]!.style.height).toBe('42px')
451
+ expect(onResize).toHaveBeenCalledWith(0, 42)
452
+ action.destroy()
453
+ })
454
+
455
+ it('ArrowUp shrinks the row and Shift gives a 1px step', () => {
456
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
457
+ track(host)
458
+ mockRowHeight(rows[0]!, 60)
459
+ const onResize = vi.fn()
460
+ const action = rowResize(host, { onResize })
461
+ const strip = stripOf(rows[0]!)!
462
+ strip.dispatchEvent(key('ArrowUp'))
463
+ expect(onResize).toHaveBeenLastCalledWith(0, 50)
464
+ strip.dispatchEvent(key('ArrowUp', { shiftKey: true }))
465
+ expect(onResize).toHaveBeenLastCalledWith(0, 59)
466
+ action.destroy()
467
+ })
468
+
469
+ it('clamps to the configured min and max', () => {
470
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
471
+ track(host)
472
+ mockRowHeight(rows[0]!, 42)
473
+ const onResize = vi.fn()
474
+ const action = rowResize(host, { onResize, min: 40, max: 44 })
475
+ const strip = stripOf(rows[0]!)!
476
+ strip.dispatchEvent(key('ArrowUp'))
477
+ expect(onResize).toHaveBeenLastCalledWith(0, 40)
478
+ strip.dispatchEvent(key('ArrowDown'))
479
+ expect(onResize).toHaveBeenLastCalledWith(0, 44)
480
+ action.destroy()
481
+ })
482
+
483
+ it('ignores keys other than the arrows and consumes the ones it handles', () => {
484
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
485
+ track(host)
486
+ mockRowHeight(rows[0]!, 32)
487
+ const onResize = vi.fn()
488
+ const action = rowResize(host, { onResize })
489
+ const strip = stripOf(rows[0]!)!
490
+ const other = key('Enter')
491
+ strip.dispatchEvent(other)
492
+ expect(onResize).not.toHaveBeenCalled()
493
+ expect(other.defaultPrevented).toBe(false)
494
+ const handled = key('ArrowDown')
495
+ strip.dispatchEvent(handled)
496
+ expect(handled.defaultPrevented).toBe(true)
497
+ action.destroy()
498
+ })
499
+
500
+ it('does nothing while disabled, and stops after destroy', () => {
501
+ const { host, rows } = buildGrid([{ rowIndex: 0 }])
502
+ track(host)
503
+ mockRowHeight(rows[0]!, 32)
504
+ const onResize = vi.fn()
505
+ const action = rowResize(host, { onResize, disabled: true })
506
+ // Disabled removes the strips entirely, so drive a hand-made one.
507
+ const strip = document.createElement('div')
508
+ strip.className = STRIP_CLASS
509
+ gutterOf(rows[0]!).appendChild(strip)
510
+ strip.dispatchEvent(key('ArrowDown'))
511
+ expect(onResize).not.toHaveBeenCalled()
512
+
513
+ action.update({ onResize })
514
+ stripOf(rows[0]!)!.dispatchEvent(key('ArrowDown'))
515
+ expect(onResize).toHaveBeenCalledTimes(1)
516
+
517
+ action.destroy()
518
+ const orphan = document.createElement('div')
519
+ orphan.className = STRIP_CLASS
520
+ gutterOf(rows[0]!).appendChild(orphan)
521
+ orphan.dispatchEvent(key('ArrowDown'))
522
+ expect(onResize).toHaveBeenCalledTimes(1)
523
+ })
524
+ })