@svgrid/grid 2.6.21 → 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 (358) hide show
  1. package/CHANGELOG.md +150 -88
  2. package/README.md +221 -199
  3. package/dist/FlexRender.svelte +96 -96
  4. package/dist/GridFooter.svelte +181 -181
  5. package/dist/GridMenus.svelte +201 -18
  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 +61 -9
  23. package/dist/SvGrid.controller.svelte.js +363 -123
  24. package/dist/SvGrid.css +222 -1
  25. package/dist/SvGrid.helpers.d.ts +55 -0
  26. package/dist/SvGrid.helpers.js +83 -0
  27. package/dist/SvGrid.svelte +255 -56
  28. package/dist/SvGrid.types.d.ts +146 -1
  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/column-resize-DsfNXMom.js +102 -0
  89. package/dist/cdn/date-format-CcP1tafP.js +1395 -0
  90. package/dist/cdn/date-format-DZT7T1wf.js +1393 -0
  91. package/dist/cdn/{editor-registry-CiI0xlKg.js → editor-registry-BhgE3S84.js} +51 -25
  92. package/dist/cdn/row-resize-BRcimkUT.js +95 -0
  93. package/dist/cdn/{src-BYq-qyrp.js → src-COC0vnpg.js} +7846 -7317
  94. package/dist/cdn/{src-DBel9wRZ.js → src-pYGV2rMR.js} +10033 -9504
  95. package/dist/cdn/svgrid.js +15 -11
  96. package/dist/cdn/svgrid.svelte-external.js +15 -11
  97. package/dist/cell-values.d.ts +16 -0
  98. package/dist/cell-values.js +28 -0
  99. package/dist/chart-export.js +8 -8
  100. package/dist/clipboard.d.ts +22 -0
  101. package/dist/clipboard.js +405 -27
  102. package/dist/column-groups.js +1 -1
  103. package/dist/column-resize.d.ts +46 -0
  104. package/dist/column-resize.js +205 -0
  105. package/dist/columns.d.ts +0 -3
  106. package/dist/columns.js +0 -57
  107. package/dist/core.d.ts +19 -4
  108. package/dist/core.js +460 -119
  109. package/dist/editing.js +12 -7
  110. package/dist/editors/cell-editors.d.ts +11 -0
  111. package/dist/editors/cell-editors.js +18 -1
  112. package/dist/filtering/excel-filters.js +28 -0
  113. package/dist/grid-messages.d.ts +15 -0
  114. package/dist/grid-messages.js +15 -0
  115. package/dist/group-display.d.ts +1 -1
  116. package/dist/index.d.ts +6 -1
  117. package/dist/index.js +10 -0
  118. package/dist/list-option.d.ts +6 -0
  119. package/dist/menus.js +41 -8
  120. package/dist/row-resize.d.ts +11 -0
  121. package/dist/row-resize.js +7 -1
  122. package/dist/sanitize-html.d.ts +37 -0
  123. package/dist/sanitize-html.js +234 -0
  124. package/dist/selection-bar-view.svelte.d.ts +25 -0
  125. package/dist/selection-bar-view.svelte.js +13 -0
  126. package/dist/selection.d.ts +2 -1
  127. package/dist/selection.js +133 -8
  128. package/dist/spreadsheet.d.ts +1 -1
  129. package/dist/spreadsheet.js +1 -1
  130. package/package.json +11 -11
  131. package/src/FlexRender.svelte +96 -96
  132. package/src/GridFooter.svelte +181 -181
  133. package/src/GridMenus.svelte +201 -18
  134. package/src/SvAutoComplete.svelte +169 -165
  135. package/src/SvAvatar.svelte +75 -75
  136. package/src/SvCalendar.svelte +503 -503
  137. package/src/SvCalendar.test.ts +226 -226
  138. package/src/SvCarousel.svelte +141 -141
  139. package/src/SvCheckBox.svelte +102 -102
  140. package/src/SvCircularProgress.svelte +109 -109
  141. package/src/SvColorInput.svelte +181 -181
  142. package/src/SvComboBox.svelte +279 -275
  143. package/src/SvContextMenu.svelte +116 -116
  144. package/src/SvCountryInput.svelte +163 -163
  145. package/src/SvDateRangeInput.svelte +25 -3
  146. package/src/SvDrawer.svelte +254 -254
  147. package/src/SvDropDownList.svelte +378 -374
  148. package/src/SvDurationInput.svelte +126 -126
  149. package/src/SvField.svelte +293 -293
  150. package/src/SvForm.svelte +437 -437
  151. package/src/SvForm.test.ts +411 -411
  152. package/src/SvGrid.controller.svelte.ts +404 -133
  153. package/src/SvGrid.css +222 -1
  154. package/src/SvGrid.helpers.ts +87 -0
  155. package/src/SvGrid.svelte +255 -56
  156. package/src/SvGrid.types.ts +2092 -1940
  157. package/src/SvGridCellEditor.svelte +744 -662
  158. package/src/SvGridChart.svelte +1716 -1716
  159. package/src/SvGridChartPanel.svelte +485 -485
  160. package/src/SvGridChartView.svelte +70 -70
  161. package/src/SvGridDropdown.svelte +728 -728
  162. package/src/SvGridSelect.svelte +270 -266
  163. package/src/SvGroupCell.svelte +116 -116
  164. package/src/SvListBox.svelte +334 -326
  165. package/src/SvMaskedInput.svelte +122 -122
  166. package/src/SvMenu.svelte +124 -124
  167. package/src/SvMenu.test.ts +97 -97
  168. package/src/SvMenuList.svelte +146 -146
  169. package/src/SvMultiSelect.svelte +293 -289
  170. package/src/SvNumberInput.svelte +172 -168
  171. package/src/SvOtpInput.svelte +158 -158
  172. package/src/SvPasswordInput.svelte +151 -151
  173. package/src/SvPhoneInput.svelte +133 -133
  174. package/src/SvPopover.svelte +197 -197
  175. package/src/SvProgress.svelte +116 -116
  176. package/src/SvRadioGroup.svelte +107 -107
  177. package/src/SvRating.svelte +112 -112
  178. package/src/SvResult.svelte +73 -73
  179. package/src/SvRichCell.svelte +125 -0
  180. package/src/SvRichText.svelte +211 -211
  181. package/src/SvRowGroupPanel.svelte +170 -170
  182. package/src/SvScrollArea.svelte +61 -61
  183. package/src/SvSlider.svelte +203 -203
  184. package/src/SvSwitchButton.svelte +108 -108
  185. package/src/SvTagsInput.svelte +115 -115
  186. package/src/SvTextArea.svelte +5 -1
  187. package/src/SvTextInput.svelte +147 -147
  188. package/src/SvTimePicker.svelte +245 -245
  189. package/src/SvToaster.svelte +159 -159
  190. package/src/SvToaster.test.ts +95 -95
  191. package/src/SvToggleButton.svelte +85 -85
  192. package/src/SvTooltip.svelte +161 -161
  193. package/src/SvTour.svelte +208 -208
  194. package/src/SvTree.svelte +444 -444
  195. package/src/SvTreeSelect.svelte +239 -235
  196. package/src/a11y/dismissable.test.ts +119 -119
  197. package/src/a11y/dismissable.ts +114 -114
  198. package/src/a11y.contract.test.ts +49 -49
  199. package/src/a11y.test.ts +59 -59
  200. package/src/a11y.ts +61 -61
  201. package/src/ai.test.ts +502 -502
  202. package/src/ai.ts +1419 -1419
  203. package/src/build-api.coverage.test.ts +633 -633
  204. package/src/build-api.ts +846 -846
  205. package/src/builtin-editors.grid.test.ts +83 -83
  206. package/src/builtin-editors.test.ts +18 -1
  207. package/src/builtin-editors.ts +19 -3
  208. package/src/cell-formatting.ts +171 -171
  209. package/src/cell-render.test.ts +513 -513
  210. package/src/cell-render.ts +496 -496
  211. package/src/cell-values.ts +148 -118
  212. package/src/chart-export.ts +202 -202
  213. package/src/chart-view.svelte.ts +36 -36
  214. package/src/chart.ts +2321 -2321
  215. package/src/clipboard.test.ts +93 -20
  216. package/src/clipboard.ts +433 -33
  217. package/src/collaboration.test.ts +104 -104
  218. package/src/collaboration.ts +167 -167
  219. package/src/column-groups.ts +78 -78
  220. package/src/column-resize.test.ts +381 -0
  221. package/src/column-resize.ts +227 -0
  222. package/src/columns.test.ts +0 -103
  223. package/src/columns.ts +0 -58
  224. package/src/core.aggregate.test.ts +134 -0
  225. package/src/core.filter.test.ts +156 -0
  226. package/src/core.grouping.test.ts +146 -0
  227. package/src/core.performance.test.ts +30 -30
  228. package/src/core.row-shape.test.ts +119 -0
  229. package/src/core.rowmodel-cache.test.ts +121 -0
  230. package/src/core.sort.test.ts +293 -0
  231. package/src/core.ts +1865 -1468
  232. package/src/createAutocomplete.svelte.ts +132 -132
  233. package/src/createCombobox.svelte.ts +191 -191
  234. package/src/createCountryInput.svelte.ts +157 -157
  235. package/src/createDropdownList.svelte.ts +168 -168
  236. package/src/createForm.svelte.ts +386 -386
  237. package/src/createGrid.svelte.ts +42 -42
  238. package/src/createGrid.test.ts +10 -10
  239. package/src/createGridState.svelte.ts +17 -17
  240. package/src/createListbox.svelte.ts +250 -250
  241. package/src/createMenu.svelte.ts +224 -224
  242. package/src/createPopoverSelect.svelte.ts +213 -213
  243. package/src/createSlider.svelte.ts +191 -191
  244. package/src/createTooltip.svelte.ts +144 -144
  245. package/src/createTree.svelte.ts +322 -322
  246. package/src/date-string-column.test.ts +87 -0
  247. package/src/datetime/date-core.ts +206 -206
  248. package/src/datetime/date-restrict.ts +61 -61
  249. package/src/datetime/timezone.ts +135 -135
  250. package/src/dock-manager-model.ts +596 -596
  251. package/src/dock-model.ts +374 -374
  252. package/src/editing.test.ts +974 -949
  253. package/src/editing.ts +609 -606
  254. package/src/editor-block-prop.test.ts +132 -0
  255. package/src/editor-contract.ts +171 -171
  256. package/src/editor-registry.grid.test.ts +144 -144
  257. package/src/editor-registry.ts +122 -122
  258. package/src/editors/cell-editors.ts +27 -1
  259. package/src/export-data-api.test.ts +126 -126
  260. package/src/export-format.test.ts +107 -107
  261. package/src/export-format.ts +601 -601
  262. package/src/filter-operators.ts +160 -160
  263. package/src/filtering/excel-filters.ts +325 -295
  264. package/src/filtering/normalize-fast-path.test.ts +104 -0
  265. package/src/flex-render.ts +3 -3
  266. package/src/form-field.ts +127 -127
  267. package/src/grid-messages.ts +34 -0
  268. package/src/group-display.test.ts +167 -167
  269. package/src/group-display.ts +200 -200
  270. package/src/headless.ts +87 -87
  271. package/src/index.ts +25 -1
  272. package/src/js-scroller.svelte.ts +173 -173
  273. package/src/keyboard-handlers.ts +270 -270
  274. package/src/keyboard.test.ts +59 -59
  275. package/src/keyboard.ts +97 -97
  276. package/src/list-nav.test.ts +49 -49
  277. package/src/list-nav.ts +29 -29
  278. package/src/list-option.test.ts +56 -56
  279. package/src/list-option.ts +179 -173
  280. package/src/menus.test.ts +43 -0
  281. package/src/menus.ts +597 -567
  282. package/src/merge-objects.ts +48 -48
  283. package/src/move-cells.test.ts +850 -0
  284. package/src/number-editor-literal.test.ts +84 -0
  285. package/src/number-editor.grid.test.ts +160 -0
  286. package/src/overlays.test.ts +90 -90
  287. package/src/positioning.ts +268 -268
  288. package/src/render-component.ts +28 -28
  289. package/src/resize-props.test.ts +361 -0
  290. package/src/row-drag-touch.ts +211 -211
  291. package/src/row-drag.test.ts +353 -353
  292. package/src/row-drag.ts +415 -415
  293. package/src/row-resize.test.ts +524 -493
  294. package/src/row-resize.ts +228 -210
  295. package/src/sanitize-html.test.ts +182 -0
  296. package/src/sanitize-html.ts +235 -0
  297. package/src/scheduler-ical.ts +181 -181
  298. package/src/scheduler-model.test.ts +562 -562
  299. package/src/scheduler-model.ts +873 -873
  300. package/src/selection-bar-view.svelte.ts +36 -0
  301. package/src/selection.test.ts +900 -743
  302. package/src/selection.ts +135 -8
  303. package/src/server-data-source.test.ts +383 -383
  304. package/src/server-data-source.ts +469 -469
  305. package/src/sparkline.test.ts +68 -68
  306. package/src/sparkline.ts +169 -169
  307. package/src/spreadsheet.test.ts +488 -488
  308. package/src/spreadsheet.ts +312 -312
  309. package/src/static-functions.ts +11 -11
  310. package/src/subscribe.ts +38 -38
  311. package/src/summaries.ts +113 -113
  312. package/src/svgrid-wrapper.types.ts +563 -563
  313. package/src/svgrid.async-editor-options.test.ts +273 -273
  314. package/src/svgrid.auto-row-height.test.ts +204 -204
  315. package/src/svgrid.behavior.test.ts +910 -910
  316. package/src/svgrid.charting.test.ts +534 -534
  317. package/src/svgrid.comments-autocomplete.test.ts +127 -127
  318. package/src/svgrid.context-menu.test.ts +147 -147
  319. package/src/svgrid.features.test.ts +157 -157
  320. package/src/svgrid.filter-depth.test.ts +163 -163
  321. package/src/svgrid.filter-menu-listbox.svelte.test.ts +377 -331
  322. package/src/svgrid.filter-menu-scroll.test.ts +112 -112
  323. package/src/svgrid.grand-total.test.ts +188 -188
  324. package/src/svgrid.group-display-mode.test.ts +171 -171
  325. package/src/svgrid.group-footers.test.ts +121 -121
  326. package/src/svgrid.group-pagination.test.ts +153 -153
  327. package/src/svgrid.in-suggest-snapshot.svelte.test.ts +91 -0
  328. package/src/svgrid.menu-scroll-close.test.ts +204 -0
  329. package/src/svgrid.new-features.wrapper.test.ts +251 -251
  330. package/src/svgrid.selection-bar-seam.test.ts +185 -0
  331. package/src/svgrid.tree-data.test.ts +186 -186
  332. package/src/svgrid.upsell-license.test.ts +117 -0
  333. package/src/svgrid.wrapper.test.ts +63 -63
  334. package/src/svgriddropdown.async-panel.svelte.test.ts +195 -195
  335. package/src/test-setup.ts +62 -62
  336. package/src/themes/index.ts +288 -288
  337. package/src/toast-store.svelte.ts +250 -250
  338. package/src/toast-store.test.ts +147 -147
  339. package/src/tree-row-model.test.ts +168 -168
  340. package/src/ui-buttons.test.ts +144 -144
  341. package/src/ui-inputs.test.ts +118 -118
  342. package/src/ui-localization.test.ts +113 -113
  343. package/src/ui-range.test.ts +70 -70
  344. package/src/ui-selection.test.ts +155 -155
  345. package/src/ui-tier1.test.ts +142 -142
  346. package/src/virtual.test.ts +88 -88
  347. package/src/virtualization/column-virtualizer.test.ts +27 -27
  348. package/src/virtualization/column-virtualizer.ts +30 -30
  349. package/src/virtualization/svelte-virtualizer.svelte.ts +26 -26
  350. package/src/virtualization/types.ts +30 -30
  351. package/src/virtualization/virtualizer.test.ts +47 -47
  352. package/src/virtualization/virtualizer.ts +322 -322
  353. package/dist/cdn/GridMenus-BfTAKn84.js +0 -488
  354. package/dist/cdn/GridMenus-C3bJd7w8.js +0 -489
  355. package/dist/cdn/SvDateTimePicker-CHnUkWcH.js +0 -2206
  356. package/dist/cdn/SvDateTimePicker-CRQH_U7E.js +0 -2201
  357. package/dist/cdn/SvGridCellEditor-BGUCzuPB.js +0 -523
  358. package/dist/cdn/SvGridCellEditor-G8IMWIws.js +0 -522
@@ -1,493 +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('also injects a strip into the built-in row-number gutter (showRowNumbers)', () => {
134
- // The native gutter cell is `.sv-grid-cell.sv-grid-row-number-cell`, NOT
135
- // `.sv-row-gutter`; the action must recognise it so `showRowNumbers` grids
136
- // are row-resizable without a custom gutter column.
137
- const host = document.createElement('div')
138
- const table = document.createElement('table')
139
- const tbody = document.createElement('tbody')
140
- const tr = document.createElement('tr')
141
- tr.className = 'sv-grid-row'
142
- const gutter = document.createElement('td')
143
- gutter.className = 'sv-grid-cell sv-grid-row-number-cell'
144
- const marker = document.createElement('span')
145
- marker.setAttribute('data-svgrid-row', '0')
146
- gutter.appendChild(marker)
147
- tr.appendChild(gutter)
148
- tbody.appendChild(tr)
149
- table.appendChild(tbody)
150
- host.appendChild(table)
151
- document.body.appendChild(host)
152
- track(host)
153
- const action = rowResize(host, { onResize: vi.fn() })
154
- expect(tr.querySelector(`.${STRIP_CLASS}`)).not.toBeNull()
155
- action.destroy()
156
- })
157
-
158
- it('does not override an already-positioned gutter cell', () => {
159
- const { host, rows } = buildGrid([{}])
160
- track(host)
161
- gutterOf(rows[0]!).style.position = 'sticky'
162
- const action = rowResize(host, { onResize: vi.fn() })
163
- expect(gutterOf(rows[0]!).style.position).toBe('sticky')
164
- action.destroy()
165
- })
166
-
167
- it('injects no strips when created disabled', () => {
168
- const { host, rows } = buildGrid([{}, {}])
169
- track(host)
170
- const action = rowResize(host, { onResize: vi.fn(), disabled: true })
171
- expect(stripOf(rows[0]!)).toBeNull()
172
- expect(stripOf(rows[1]!)).toBeNull()
173
- action.destroy()
174
- })
175
- })
176
-
177
- // ---------------------------------------------------------------------------
178
- // Drag lifecycle
179
- // ---------------------------------------------------------------------------
180
-
181
- describe('rowResize - drag', () => {
182
- it('reports the new height on pointerup and fires move callbacks', () => {
183
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
184
- track(host)
185
- mockRowHeight(rows[0]!, 32)
186
- const onResize = vi.fn()
187
- const onResizeMove = vi.fn()
188
- const action = rowResize(host, { onResize, onResizeMove })
189
- const strip = stripOf(rows[0]!)!
190
-
191
- strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
192
- expect(strip.classList.contains('is-resizing')).toBe(true)
193
- expect(document.body.style.cursor).toBe('row-resize')
194
-
195
- // Drag down 20px -> 52.
196
- window.dispatchEvent(pointer('pointermove', { clientY: 120 }))
197
- expect(onResizeMove).toHaveBeenLastCalledWith(0, 52)
198
- expect(rows[0]!.style.height).toBe('52px')
199
-
200
- window.dispatchEvent(pointer('pointerup', { clientY: 120 }))
201
- expect(onResize).toHaveBeenCalledWith(0, 52)
202
- expect(strip.classList.contains('is-resizing')).toBe(false)
203
- expect(document.body.style.cursor).toBe('')
204
- action.destroy()
205
- })
206
-
207
- it('clamps the height to the min bound', () => {
208
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
209
- track(host)
210
- mockRowHeight(rows[0]!, 32)
211
- const onResize = vi.fn()
212
- const action = rowResize(host, { onResize, min: 24 })
213
- const strip = stripOf(rows[0]!)!
214
- strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
215
- // Drag far up -> would be negative, clamps to 24.
216
- window.dispatchEvent(pointer('pointerup', { clientY: 0 }))
217
- expect(onResize).toHaveBeenCalledWith(0, 24)
218
- action.destroy()
219
- })
220
-
221
- it('clamps the height to the max bound', () => {
222
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
223
- track(host)
224
- mockRowHeight(rows[0]!, 32)
225
- const onResize = vi.fn()
226
- const action = rowResize(host, { onResize, max: 50 })
227
- const strip = stripOf(rows[0]!)!
228
- strip.dispatchEvent(pointer('pointerdown', { clientY: 100 }))
229
- window.dispatchEvent(pointer('pointerup', { clientY: 1000 }))
230
- expect(onResize).toHaveBeenCalledWith(0, 50)
231
- action.destroy()
232
- })
233
-
234
- it('works without an onResizeMove callback (optional)', () => {
235
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
236
- track(host)
237
- mockRowHeight(rows[0]!, 30)
238
- const onResize = vi.fn()
239
- const action = rowResize(host, { onResize })
240
- const strip = stripOf(rows[0]!)!
241
- strip.dispatchEvent(pointer('pointerdown', { clientY: 50 }))
242
- expect(() => window.dispatchEvent(pointer('pointermove', { clientY: 60 }))).not.toThrow()
243
- window.dispatchEvent(pointer('pointerup', { clientY: 60 }))
244
- expect(onResize).toHaveBeenCalledWith(0, 40)
245
- action.destroy()
246
- })
247
-
248
- it('ignores pointermove / pointerup when no drag is active', () => {
249
- const { host } = buildGrid([{ rowIndex: 0 }])
250
- track(host)
251
- const onResize = vi.fn()
252
- const onResizeMove = vi.fn()
253
- const action = rowResize(host, { onResize, onResizeMove })
254
- // No pointerdown first - listeners were only attached on down, so these
255
- // shouldn't do anything even if dispatched.
256
- window.dispatchEvent(pointer('pointermove', { clientY: 10 }))
257
- window.dispatchEvent(pointer('pointerup', { clientY: 10 }))
258
- expect(onResize).not.toHaveBeenCalled()
259
- expect(onResizeMove).not.toHaveBeenCalled()
260
- action.destroy()
261
- })
262
- })
263
-
264
- // ---------------------------------------------------------------------------
265
- // pointerdown guards
266
- // ---------------------------------------------------------------------------
267
-
268
- describe('rowResize - pointerdown guards', () => {
269
- it('ignores pointerdown when disabled', () => {
270
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
271
- track(host)
272
- mockRowHeight(rows[0]!, 32)
273
- const onResize = vi.fn()
274
- // Start enabled so a strip exists, then disable via update.
275
- const action = rowResize(host, { onResize })
276
- const strip = stripOf(rows[0]!)!
277
- action.update({ onResize, disabled: true })
278
- // update removes strips, but dispatch on the (now-detached) strip anyway:
279
- // even if it were still in the DOM, current.disabled short-circuits.
280
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
281
- window.dispatchEvent(pointer('pointerup', { clientY: 50 }))
282
- expect(onResize).not.toHaveBeenCalled()
283
- action.destroy()
284
- })
285
-
286
- it('ignores pointerdown on a non-strip target', () => {
287
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
288
- track(host)
289
- const onResize = vi.fn()
290
- const action = rowResize(host, { onResize })
291
- gutterOf(rows[0]!).dispatchEvent(pointer('pointerdown', { clientY: 10 }))
292
- expect(document.body.style.cursor).toBe('')
293
- action.destroy()
294
- })
295
-
296
- it('ignores a strip whose row has a non-finite row index', () => {
297
- const { host, rows } = buildGrid([{}])
298
- track(host)
299
- // Remove the data-svgrid-row marker so rowIndexOf returns NaN.
300
- rows[0]!.querySelector('[data-svgrid-row]')!.removeAttribute('data-svgrid-row')
301
- const onResize = vi.fn()
302
- const action = rowResize(host, { onResize })
303
- const strip = stripOf(rows[0]!)!
304
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
305
- expect(document.body.style.cursor).toBe('')
306
- expect(strip.classList.contains('is-resizing')).toBe(false)
307
- action.destroy()
308
- })
309
-
310
- it('ignores a strip not inside a tr.sv-grid-row', () => {
311
- const host = track(document.createElement('div'))
312
- document.body.appendChild(host)
313
- // A loose strip with no matching ancestor row.
314
- const strip = document.createElement('div')
315
- strip.className = STRIP_CLASS
316
- host.appendChild(strip)
317
- const onResize = vi.fn()
318
- const action = rowResize(host, { onResize })
319
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
320
- expect(document.body.style.cursor).toBe('')
321
- action.destroy()
322
- })
323
- })
324
-
325
- // ---------------------------------------------------------------------------
326
- // update() + destroy()
327
- // ---------------------------------------------------------------------------
328
-
329
- describe('rowResize - update + destroy', () => {
330
- it('removes strips when toggled to disabled and restores when re-enabled', () => {
331
- const { host, rows } = buildGrid([{}, {}])
332
- track(host)
333
- const onResize = vi.fn()
334
- const action = rowResize(host, { onResize, disabled: false })
335
- expect(stripOf(rows[0]!)).not.toBeNull()
336
-
337
- action.update({ onResize, disabled: true })
338
- expect(stripOf(rows[0]!)).toBeNull()
339
- expect(stripOf(rows[1]!)).toBeNull()
340
-
341
- action.update({ onResize, disabled: false })
342
- expect(stripOf(rows[0]!)).not.toBeNull()
343
- action.destroy()
344
- })
345
-
346
- it('does not repaint when disabled flag is unchanged on update', () => {
347
- const { host, rows } = buildGrid([{}])
348
- track(host)
349
- const action = rowResize(host, { onResize: vi.fn() })
350
- const firstStrip = stripOf(rows[0]!)
351
- // Same disabled value -> decorate is NOT called, strip stays the same node.
352
- action.update({ onResize: vi.fn() })
353
- expect(stripOf(rows[0]!)).toBe(firstStrip)
354
- action.destroy()
355
- })
356
-
357
- it('destroy removes all strips and detaches listeners', () => {
358
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
359
- track(host)
360
- mockRowHeight(rows[0]!, 32)
361
- const onResize = vi.fn()
362
- const action = rowResize(host, { onResize })
363
- expect(stripOf(rows[0]!)).not.toBeNull()
364
-
365
- action.destroy()
366
- expect(stripOf(rows[0]!)).toBeNull()
367
-
368
- // After destroy the pointerdown listener is gone; re-create a strip
369
- // manually and confirm no drag starts.
370
- const strip = document.createElement('div')
371
- strip.className = STRIP_CLASS
372
- gutterOf(rows[0]!).appendChild(strip)
373
- strip.dispatchEvent(pointer('pointerdown', { clientY: 10 }))
374
- expect(document.body.style.cursor).toBe('')
375
- })
376
-
377
- it('uses default min=20 / max=320 when bounds are omitted', () => {
378
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
379
- track(host)
380
- mockRowHeight(rows[0]!, 100)
381
- const onResize = vi.fn()
382
- const action = rowResize(host, { onResize })
383
- const strip = stripOf(rows[0]!)!
384
- strip.dispatchEvent(pointer('pointerdown', { clientY: 0 }))
385
- // Drag way past max -> clamps to 320.
386
- window.dispatchEvent(pointer('pointermove', { clientY: 10000 }))
387
- expect(rows[0]!.style.height).toBe('320px')
388
- // Drag way below min -> clamps to 20.
389
- window.dispatchEvent(pointer('pointerup', { clientY: -10000 }))
390
- expect(onResize).toHaveBeenCalledWith(0, 20)
391
- action.destroy()
392
- })
393
- })
394
-
395
- // ---------------------------------------------------------------------------
396
- // Keyboard resize (#79)
397
- // ---------------------------------------------------------------------------
398
-
399
- describe('rowResize - keyboard', () => {
400
- function key(k: string, init: Partial<KeyboardEvent> = {}): KeyboardEvent {
401
- return new KeyboardEvent('keydown', { key: k, bubbles: true, cancelable: true, ...init })
402
- }
403
-
404
- it('makes the strip focusable', () => {
405
- const { host, rows } = buildGrid([{}])
406
- track(host)
407
- const action = rowResize(host, { onResize: vi.fn() })
408
- expect(stripOf(rows[0]!)!.tabIndex).toBe(0)
409
- action.destroy()
410
- })
411
-
412
- it('ArrowDown grows the row by 10px and reports the new height', () => {
413
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
414
- track(host)
415
- mockRowHeight(rows[0]!, 32)
416
- const onResize = vi.fn()
417
- const action = rowResize(host, { onResize })
418
- stripOf(rows[0]!)!.dispatchEvent(key('ArrowDown'))
419
- expect(rows[0]!.style.height).toBe('42px')
420
- expect(onResize).toHaveBeenCalledWith(0, 42)
421
- action.destroy()
422
- })
423
-
424
- it('ArrowUp shrinks the row and Shift gives a 1px step', () => {
425
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
426
- track(host)
427
- mockRowHeight(rows[0]!, 60)
428
- const onResize = vi.fn()
429
- const action = rowResize(host, { onResize })
430
- const strip = stripOf(rows[0]!)!
431
- strip.dispatchEvent(key('ArrowUp'))
432
- expect(onResize).toHaveBeenLastCalledWith(0, 50)
433
- strip.dispatchEvent(key('ArrowUp', { shiftKey: true }))
434
- expect(onResize).toHaveBeenLastCalledWith(0, 59)
435
- action.destroy()
436
- })
437
-
438
- it('clamps to the configured min and max', () => {
439
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
440
- track(host)
441
- mockRowHeight(rows[0]!, 42)
442
- const onResize = vi.fn()
443
- const action = rowResize(host, { onResize, min: 40, max: 44 })
444
- const strip = stripOf(rows[0]!)!
445
- strip.dispatchEvent(key('ArrowUp'))
446
- expect(onResize).toHaveBeenLastCalledWith(0, 40)
447
- strip.dispatchEvent(key('ArrowDown'))
448
- expect(onResize).toHaveBeenLastCalledWith(0, 44)
449
- action.destroy()
450
- })
451
-
452
- it('ignores keys other than the arrows and consumes the ones it handles', () => {
453
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
454
- track(host)
455
- mockRowHeight(rows[0]!, 32)
456
- const onResize = vi.fn()
457
- const action = rowResize(host, { onResize })
458
- const strip = stripOf(rows[0]!)!
459
- const other = key('Enter')
460
- strip.dispatchEvent(other)
461
- expect(onResize).not.toHaveBeenCalled()
462
- expect(other.defaultPrevented).toBe(false)
463
- const handled = key('ArrowDown')
464
- strip.dispatchEvent(handled)
465
- expect(handled.defaultPrevented).toBe(true)
466
- action.destroy()
467
- })
468
-
469
- it('does nothing while disabled, and stops after destroy', () => {
470
- const { host, rows } = buildGrid([{ rowIndex: 0 }])
471
- track(host)
472
- mockRowHeight(rows[0]!, 32)
473
- const onResize = vi.fn()
474
- const action = rowResize(host, { onResize, disabled: true })
475
- // Disabled removes the strips entirely, so drive a hand-made one.
476
- const strip = document.createElement('div')
477
- strip.className = STRIP_CLASS
478
- gutterOf(rows[0]!).appendChild(strip)
479
- strip.dispatchEvent(key('ArrowDown'))
480
- expect(onResize).not.toHaveBeenCalled()
481
-
482
- action.update({ onResize })
483
- stripOf(rows[0]!)!.dispatchEvent(key('ArrowDown'))
484
- expect(onResize).toHaveBeenCalledTimes(1)
485
-
486
- action.destroy()
487
- const orphan = document.createElement('div')
488
- orphan.className = STRIP_CLASS
489
- gutterOf(rows[0]!).appendChild(orphan)
490
- orphan.dispatchEvent(key('ArrowDown'))
491
- expect(onResize).toHaveBeenCalledTimes(1)
492
- })
493
- })
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
+ })