@atlaskit/editor-plugin-table 7.16.11 → 7.16.12

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 (242) hide show
  1. package/.eslintrc.js +3 -3
  2. package/CHANGELOG.md +8 -0
  3. package/dist/cjs/commands/misc.js +3 -3
  4. package/dist/cjs/nodeviews/TableCell.js +10 -10
  5. package/dist/cjs/nodeviews/TableContainer.js +41 -6
  6. package/dist/cjs/nodeviews/TableResizer.js +7 -7
  7. package/dist/cjs/nodeviews/TableRow.js +23 -23
  8. package/dist/cjs/pm-plugins/table-resizing/plugin.js +3 -3
  9. package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +4 -4
  10. package/dist/cjs/pm-plugins/table-resizing/utils/scale-table.js +3 -3
  11. package/dist/cjs/ui/FloatingContextualMenu/styles.js +1 -1
  12. package/dist/cjs/ui/FloatingDragMenu/styles.js +1 -1
  13. package/dist/cjs/ui/common-styles.js +13 -13
  14. package/dist/cjs/ui/ui-styles.js +25 -25
  15. package/dist/cjs/utils/merged-cells.js +3 -3
  16. package/dist/es2019/commands/misc.js +3 -3
  17. package/dist/es2019/nodeviews/TableContainer.js +43 -5
  18. package/dist/es2019/nodeviews/TableResizer.js +7 -7
  19. package/dist/es2019/nodeviews/TableRow.js +21 -21
  20. package/dist/es2019/pm-plugins/table-resizing/plugin.js +3 -3
  21. package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +4 -4
  22. package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js +3 -3
  23. package/dist/es2019/ui/FloatingContextualMenu/styles.js +47 -47
  24. package/dist/es2019/ui/FloatingDragMenu/styles.js +30 -30
  25. package/dist/es2019/ui/common-styles.js +802 -816
  26. package/dist/es2019/ui/ui-styles.js +665 -678
  27. package/dist/es2019/utils/merged-cells.js +3 -3
  28. package/dist/esm/commands/misc.js +3 -3
  29. package/dist/esm/nodeviews/TableCell.js +10 -10
  30. package/dist/esm/nodeviews/TableContainer.js +42 -7
  31. package/dist/esm/nodeviews/TableResizer.js +7 -7
  32. package/dist/esm/nodeviews/TableRow.js +23 -23
  33. package/dist/esm/pm-plugins/table-resizing/plugin.js +3 -3
  34. package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +4 -4
  35. package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js +3 -3
  36. package/dist/esm/ui/FloatingContextualMenu/styles.js +1 -1
  37. package/dist/esm/ui/FloatingDragMenu/styles.js +1 -1
  38. package/dist/esm/ui/common-styles.js +13 -13
  39. package/dist/esm/ui/ui-styles.js +25 -25
  40. package/dist/esm/utils/merged-cells.js +3 -3
  41. package/dist/types/pm-plugins/decorations/utils/index.d.ts +1 -1
  42. package/dist/types/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +1 -1
  43. package/dist/types/pm-plugins/drag-and-drop/utils/getDragBehaviour.d.ts +1 -1
  44. package/dist/types/pm-plugins/table-resizing/utils/index.d.ts +1 -1
  45. package/dist/types/ui/ColumnResizeWidget/index.d.ts +1 -1
  46. package/dist/types/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.d.ts +1 -1
  47. package/dist/types/ui/FloatingToolbarLabel/FloatingToolbarLabel.d.ts +1 -1
  48. package/dist/types/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.d.ts +1 -1
  49. package/dist/types/ui/TableFloatingControls/CornerControls/index.d.ts +1 -1
  50. package/dist/types/ui/icons/DragHandleDisabledIcon.d.ts +1 -1
  51. package/dist/types-ts4.5/pm-plugins/decorations/utils/index.d.ts +1 -1
  52. package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +1 -1
  53. package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/getDragBehaviour.d.ts +1 -1
  54. package/dist/types-ts4.5/pm-plugins/table-resizing/utils/index.d.ts +1 -1
  55. package/dist/types-ts4.5/ui/ColumnResizeWidget/index.d.ts +1 -1
  56. package/dist/types-ts4.5/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.d.ts +1 -1
  57. package/dist/types-ts4.5/ui/FloatingToolbarLabel/FloatingToolbarLabel.d.ts +1 -1
  58. package/dist/types-ts4.5/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.d.ts +1 -1
  59. package/dist/types-ts4.5/ui/TableFloatingControls/CornerControls/index.d.ts +1 -1
  60. package/dist/types-ts4.5/ui/icons/DragHandleDisabledIcon.d.ts +1 -1
  61. package/docs/0-intro.tsx +9 -7
  62. package/package.json +2 -2
  63. package/report.api.md +67 -66
  64. package/src/commands/clear.ts +36 -44
  65. package/src/commands/collapse.ts +8 -8
  66. package/src/commands/column-resize.ts +412 -452
  67. package/src/commands/delete.ts +14 -14
  68. package/src/commands/display-mode.ts +10 -11
  69. package/src/commands/go-to-next-cell.ts +48 -54
  70. package/src/commands/hover.ts +210 -227
  71. package/src/commands/index.ts +35 -35
  72. package/src/commands/insert.ts +208 -235
  73. package/src/commands/misc.ts +655 -748
  74. package/src/commands/referentiality.ts +9 -9
  75. package/src/commands/selection.ts +433 -563
  76. package/src/commands/sort.ts +68 -86
  77. package/src/commands/split-cell.ts +14 -14
  78. package/src/commands/toggle.ts +69 -67
  79. package/src/commands-with-analytics.ts +570 -639
  80. package/src/create-plugin-config.ts +13 -13
  81. package/src/event-handlers.ts +513 -612
  82. package/src/handlers.ts +120 -133
  83. package/src/nodeviews/ExternalDropTargets.tsx +68 -73
  84. package/src/nodeviews/OverflowShadowsObserver.ts +148 -157
  85. package/src/nodeviews/TableCell.ts +47 -54
  86. package/src/nodeviews/TableComponent.tsx +1018 -1112
  87. package/src/nodeviews/TableComponentWithSharedState.tsx +91 -94
  88. package/src/nodeviews/TableContainer.tsx +363 -339
  89. package/src/nodeviews/TableNodeViewBase.ts +19 -24
  90. package/src/nodeviews/TableResizer.tsx +565 -657
  91. package/src/nodeviews/TableRow.ts +580 -629
  92. package/src/nodeviews/TableStickyScrollbar.ts +173 -190
  93. package/src/nodeviews/__mocks__/OverflowShadowsObserver.ts +8 -8
  94. package/src/nodeviews/__mocks__/OverridableMock.ts +14 -15
  95. package/src/nodeviews/table.tsx +345 -375
  96. package/src/nodeviews/types.ts +21 -24
  97. package/src/nodeviews/update-overflow-shadows.ts +8 -14
  98. package/src/plugin.tsx +578 -603
  99. package/src/pm-plugins/analytics/actions.ts +10 -12
  100. package/src/pm-plugins/analytics/commands.ts +31 -37
  101. package/src/pm-plugins/analytics/plugin-factory.ts +4 -2
  102. package/src/pm-plugins/analytics/plugin-key.ts +1 -3
  103. package/src/pm-plugins/analytics/plugin.ts +60 -70
  104. package/src/pm-plugins/analytics/reducer.ts +19 -19
  105. package/src/pm-plugins/analytics/types.ts +10 -10
  106. package/src/pm-plugins/analytics/utils/moved-event.ts +38 -38
  107. package/src/pm-plugins/decorations/plugin.ts +58 -77
  108. package/src/pm-plugins/decorations/utils/column-controls.ts +59 -71
  109. package/src/pm-plugins/decorations/utils/column-resizing.ts +50 -57
  110. package/src/pm-plugins/decorations/utils/compose-decorations.ts +6 -6
  111. package/src/pm-plugins/decorations/utils/index.ts +3 -6
  112. package/src/pm-plugins/decorations/utils/types.ts +7 -12
  113. package/src/pm-plugins/default-table-selection.ts +3 -3
  114. package/src/pm-plugins/drag-and-drop/actions.ts +25 -25
  115. package/src/pm-plugins/drag-and-drop/commands-with-analytics.ts +158 -190
  116. package/src/pm-plugins/drag-and-drop/commands.ts +154 -170
  117. package/src/pm-plugins/drag-and-drop/consts.ts +4 -5
  118. package/src/pm-plugins/drag-and-drop/plugin-factory.ts +23 -20
  119. package/src/pm-plugins/drag-and-drop/plugin-key.ts +1 -3
  120. package/src/pm-plugins/drag-and-drop/plugin.ts +329 -383
  121. package/src/pm-plugins/drag-and-drop/reducer.ts +30 -30
  122. package/src/pm-plugins/drag-and-drop/types.ts +8 -8
  123. package/src/pm-plugins/drag-and-drop/utils/autoscrollers.ts +38 -41
  124. package/src/pm-plugins/drag-and-drop/utils/getDragBehaviour.ts +3 -6
  125. package/src/pm-plugins/drag-and-drop/utils/monitor.ts +57 -70
  126. package/src/pm-plugins/keymap.ts +208 -220
  127. package/src/pm-plugins/main.ts +348 -400
  128. package/src/pm-plugins/plugin-factory.ts +32 -34
  129. package/src/pm-plugins/safari-delete-composition-text-issue-workaround.ts +83 -97
  130. package/src/pm-plugins/sticky-headers/commands.ts +2 -6
  131. package/src/pm-plugins/sticky-headers/plugin-key.ts +1 -3
  132. package/src/pm-plugins/sticky-headers/plugin-state.ts +41 -44
  133. package/src/pm-plugins/sticky-headers/plugin.ts +4 -4
  134. package/src/pm-plugins/sticky-headers/types.ts +8 -8
  135. package/src/pm-plugins/sticky-headers/util.ts +10 -10
  136. package/src/pm-plugins/table-analytics.ts +70 -72
  137. package/src/pm-plugins/table-local-id.ts +180 -184
  138. package/src/pm-plugins/table-resizing/commands.ts +72 -85
  139. package/src/pm-plugins/table-resizing/event-handlers.ts +298 -317
  140. package/src/pm-plugins/table-resizing/plugin-factory.ts +10 -10
  141. package/src/pm-plugins/table-resizing/plugin-key.ts +1 -3
  142. package/src/pm-plugins/table-resizing/plugin.ts +61 -68
  143. package/src/pm-plugins/table-resizing/reducer.ts +30 -33
  144. package/src/pm-plugins/table-resizing/utils/colgroup.ts +84 -84
  145. package/src/pm-plugins/table-resizing/utils/column-state.ts +78 -81
  146. package/src/pm-plugins/table-resizing/utils/content-width.ts +94 -114
  147. package/src/pm-plugins/table-resizing/utils/dom.ts +93 -110
  148. package/src/pm-plugins/table-resizing/utils/index.ts +29 -34
  149. package/src/pm-plugins/table-resizing/utils/misc.ts +94 -119
  150. package/src/pm-plugins/table-resizing/utils/resize-column.ts +93 -106
  151. package/src/pm-plugins/table-resizing/utils/resize-logic.ts +240 -257
  152. package/src/pm-plugins/table-resizing/utils/resize-state.ts +343 -372
  153. package/src/pm-plugins/table-resizing/utils/scale-table.ts +202 -207
  154. package/src/pm-plugins/table-resizing/utils/types.ts +17 -17
  155. package/src/pm-plugins/table-resizing/utils/unit-to-number.ts +1 -2
  156. package/src/pm-plugins/table-selection-keymap.ts +25 -51
  157. package/src/pm-plugins/table-width.ts +191 -204
  158. package/src/pm-plugins/view-mode-sort/index.ts +223 -227
  159. package/src/pm-plugins/view-mode-sort/plugin-key.ts +3 -2
  160. package/src/pm-plugins/view-mode-sort/types.ts +12 -12
  161. package/src/pm-plugins/view-mode-sort/utils.ts +108 -117
  162. package/src/reducer.ts +139 -155
  163. package/src/toolbar.tsx +815 -905
  164. package/src/transforms/column-width.ts +186 -213
  165. package/src/transforms/delete-columns.ts +208 -222
  166. package/src/transforms/delete-rows.ts +117 -121
  167. package/src/transforms/fix-tables.ts +190 -215
  168. package/src/transforms/merge.ts +263 -269
  169. package/src/transforms/replace-table.ts +27 -43
  170. package/src/transforms/split.ts +65 -75
  171. package/src/types.ts +421 -427
  172. package/src/ui/ColumnResizeWidget/index.tsx +40 -47
  173. package/src/ui/DragHandle/HandleIconComponent.tsx +9 -13
  174. package/src/ui/DragHandle/index.tsx +221 -250
  175. package/src/ui/DragPreview/index.tsx +35 -35
  176. package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx +33 -41
  177. package/src/ui/FloatingContextualButton/FixedButton.tsx +154 -157
  178. package/src/ui/FloatingContextualButton/index.tsx +109 -115
  179. package/src/ui/FloatingContextualButton/styles.ts +43 -46
  180. package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +634 -694
  181. package/src/ui/FloatingContextualMenu/index.tsx +83 -101
  182. package/src/ui/FloatingContextualMenu/styles.ts +57 -65
  183. package/src/ui/FloatingDeleteButton/DeleteButton.tsx +37 -37
  184. package/src/ui/FloatingDeleteButton/getPopUpOptions.ts +47 -57
  185. package/src/ui/FloatingDeleteButton/index.tsx +319 -350
  186. package/src/ui/FloatingDragMenu/DragMenu.tsx +555 -596
  187. package/src/ui/FloatingDragMenu/DropdownMenu.tsx +152 -162
  188. package/src/ui/FloatingDragMenu/index.tsx +88 -102
  189. package/src/ui/FloatingDragMenu/styles.ts +51 -54
  190. package/src/ui/FloatingInsertButton/InsertButton.tsx +204 -217
  191. package/src/ui/FloatingInsertButton/getPopupOptions.ts +100 -115
  192. package/src/ui/FloatingInsertButton/index.tsx +248 -292
  193. package/src/ui/FloatingToolbarLabel/FloatingToolbarLabel.tsx +24 -29
  194. package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +308 -329
  195. package/src/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.tsx +85 -94
  196. package/src/ui/TableFloatingColumnControls/ColumnDropTargets/index.tsx +46 -46
  197. package/src/ui/TableFloatingColumnControls/index.tsx +116 -136
  198. package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +79 -91
  199. package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +95 -102
  200. package/src/ui/TableFloatingControls/CornerControls/index.tsx +1 -4
  201. package/src/ui/TableFloatingControls/CornerControls/types.ts +8 -8
  202. package/src/ui/TableFloatingControls/FloatingControlsWithSelection.tsx +50 -50
  203. package/src/ui/TableFloatingControls/NumberColumn/index.tsx +111 -124
  204. package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +86 -105
  205. package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +305 -341
  206. package/src/ui/TableFloatingControls/RowDropTarget/index.tsx +72 -75
  207. package/src/ui/TableFloatingControls/index.tsx +191 -193
  208. package/src/ui/TableFullWidthLabel/index.tsx +20 -20
  209. package/src/ui/common-styles.ts +880 -912
  210. package/src/ui/consts.ts +29 -74
  211. package/src/ui/icons/AddColLeftIcon.tsx +33 -39
  212. package/src/ui/icons/AddColRightIcon.tsx +33 -39
  213. package/src/ui/icons/AddRowAboveIcon.tsx +16 -22
  214. package/src/ui/icons/AddRowBelowIcon.tsx +33 -39
  215. package/src/ui/icons/DisplayModeIcon.tsx +31 -31
  216. package/src/ui/icons/DragHandleDisabledIcon.tsx +19 -21
  217. package/src/ui/icons/DragHandleIcon.tsx +12 -12
  218. package/src/ui/icons/DragInMotionIcon.tsx +45 -52
  219. package/src/ui/icons/MergeCellsIcon.tsx +22 -28
  220. package/src/ui/icons/MinimisedHandle.tsx +9 -9
  221. package/src/ui/icons/SplitCellIcon.tsx +30 -36
  222. package/src/ui/ui-styles.ts +769 -798
  223. package/src/utils/alignment.ts +1 -1
  224. package/src/utils/analytics.ts +192 -208
  225. package/src/utils/collapse.ts +55 -64
  226. package/src/utils/column-controls.ts +237 -254
  227. package/src/utils/create.ts +30 -30
  228. package/src/utils/decoration.ts +482 -502
  229. package/src/utils/dom.ts +127 -134
  230. package/src/utils/drag-menu.ts +322 -373
  231. package/src/utils/get-allow-add-column-custom-step.ts +4 -5
  232. package/src/utils/guidelines.ts +10 -21
  233. package/src/utils/index.ts +68 -68
  234. package/src/utils/merged-cells.ts +245 -254
  235. package/src/utils/nodes.ts +91 -106
  236. package/src/utils/paste.ts +119 -135
  237. package/src/utils/row-controls.ts +199 -213
  238. package/src/utils/selection.ts +77 -87
  239. package/src/utils/snapping.ts +84 -97
  240. package/src/utils/table.ts +44 -44
  241. package/src/utils/transforms.ts +5 -5
  242. package/src/utils/update-plugin-state-decorations.ts +5 -9
@@ -4,302 +4,285 @@ import { bulkColumnsResize, getTotalWidth } from './resize-state';
4
4
  import type { ResizeState } from './types';
5
5
 
6
6
  export const growColumn = (
7
- state: ResizeState,
8
- colIndex: number,
9
- amount: number,
10
- selectedColumns?: number[],
7
+ state: ResizeState,
8
+ colIndex: number,
9
+ amount: number,
10
+ selectedColumns?: number[],
11
11
  ): ResizeState => {
12
- // can't grow if columns don't exist or it's the last column
13
- if (!state.cols[colIndex] || !state.cols[colIndex + 1]) {
14
- return state;
15
- }
16
- const res = moveSpaceFrom(state, colIndex + 1, colIndex, amount);
17
- const remaining = amount - res.amount;
18
- let newState = res.state;
19
-
20
- if (remaining > 0) {
21
- newState = stackSpace(newState, colIndex, remaining).state;
22
- }
23
- if (selectedColumns && selectedColumns.length > 1) {
24
- return bulkColumnsResize(newState, selectedColumns, colIndex);
25
- }
26
-
27
- return newState;
12
+ // can't grow if columns don't exist or it's the last column
13
+ if (!state.cols[colIndex] || !state.cols[colIndex + 1]) {
14
+ return state;
15
+ }
16
+ const res = moveSpaceFrom(state, colIndex + 1, colIndex, amount);
17
+ const remaining = amount - res.amount;
18
+ let newState = res.state;
19
+
20
+ if (remaining > 0) {
21
+ newState = stackSpace(newState, colIndex, remaining).state;
22
+ }
23
+ if (selectedColumns && selectedColumns.length > 1) {
24
+ return bulkColumnsResize(newState, selectedColumns, colIndex);
25
+ }
26
+
27
+ return newState;
28
28
  };
29
29
 
30
30
  export const shrinkColumn = (
31
- state: ResizeState,
32
- colIndex: number,
33
- amount: number,
34
- selectedColumns?: number[],
31
+ state: ResizeState,
32
+ colIndex: number,
33
+ amount: number,
34
+ selectedColumns?: number[],
35
35
  ): ResizeState => {
36
- // can't shrink if columns don't exist
37
- if (!state.cols[colIndex]) {
38
- return state;
39
- }
40
- // try to shrink dragging column by giving from the column to the right first
41
- const res = moveSpaceFrom(state, colIndex, colIndex + 1, -amount);
42
- let newState = res.state;
43
-
44
- const isOverflownTable = getTotalWidth(newState) > newState.maxSize;
45
- const isLastColumn = !newState.cols[colIndex + 1];
46
- // stop resizing the last column once table is not overflown
47
- if (isLastColumn && !isOverflownTable) {
48
- return newState;
49
- }
50
-
51
- const remaining = amount + res.amount;
52
- if (remaining < 0) {
53
- newState = stackSpace(newState, colIndex + 1, remaining).state;
54
- }
55
- if (selectedColumns && selectedColumns.length > 1) {
56
- return bulkColumnsResize(newState, selectedColumns, colIndex);
57
- }
58
-
59
- return newState;
36
+ // can't shrink if columns don't exist
37
+ if (!state.cols[colIndex]) {
38
+ return state;
39
+ }
40
+ // try to shrink dragging column by giving from the column to the right first
41
+ const res = moveSpaceFrom(state, colIndex, colIndex + 1, -amount);
42
+ let newState = res.state;
43
+
44
+ const isOverflownTable = getTotalWidth(newState) > newState.maxSize;
45
+ const isLastColumn = !newState.cols[colIndex + 1];
46
+ // stop resizing the last column once table is not overflown
47
+ if (isLastColumn && !isOverflownTable) {
48
+ return newState;
49
+ }
50
+
51
+ const remaining = amount + res.amount;
52
+ if (remaining < 0) {
53
+ newState = stackSpace(newState, colIndex + 1, remaining).state;
54
+ }
55
+ if (selectedColumns && selectedColumns.length > 1) {
56
+ return bulkColumnsResize(newState, selectedColumns, colIndex);
57
+ }
58
+
59
+ return newState;
60
60
  };
61
61
 
62
62
  export function reduceSpace(
63
- state: ResizeState,
64
- amount: number,
65
- ignoreCols: number[] = [],
63
+ state: ResizeState,
64
+ amount: number,
65
+ ignoreCols: number[] = [],
66
66
  ): ResizeState {
67
- let remaining = amount;
68
-
69
- // keep trying to resolve resize request until we run out of free space,
70
- // or nothing to resize
71
- while (remaining > 0) {
72
- // filter candidates only with free space
73
- const candidates = state.cols.filter((column) => {
74
- return getFreeSpace(column) && ignoreCols.indexOf(column.index) === -1;
75
- });
76
- if (candidates.length === 0) {
77
- break;
78
- }
79
- const requestedResize = Math.floor(remaining / candidates.length);
80
- if (requestedResize === 0) {
81
- break;
82
- }
83
-
84
- candidates.forEach((candidate) => {
85
- let newWidth = candidate.width - requestedResize;
86
- if (newWidth < candidate.minWidth) {
87
- // If the new requested width is less than our min
88
- // Calc what width we didn't use, we'll try extract that
89
- // from other cols.
90
- const remainder = candidate.minWidth - newWidth;
91
- newWidth = candidate.minWidth;
92
- remaining = remaining - requestedResize + remainder;
93
- } else {
94
- remaining -= requestedResize;
95
- }
96
-
97
- state = {
98
- ...state,
99
- cols: [
100
- ...state.cols.slice(0, candidate.index),
101
- { ...candidate, width: newWidth },
102
- ...state.cols.slice(candidate.index + 1),
103
- ],
104
- };
105
- });
106
- }
107
-
108
- return state;
67
+ let remaining = amount;
68
+
69
+ // keep trying to resolve resize request until we run out of free space,
70
+ // or nothing to resize
71
+ while (remaining > 0) {
72
+ // filter candidates only with free space
73
+ const candidates = state.cols.filter((column) => {
74
+ return getFreeSpace(column) && ignoreCols.indexOf(column.index) === -1;
75
+ });
76
+ if (candidates.length === 0) {
77
+ break;
78
+ }
79
+ const requestedResize = Math.floor(remaining / candidates.length);
80
+ if (requestedResize === 0) {
81
+ break;
82
+ }
83
+
84
+ candidates.forEach((candidate) => {
85
+ let newWidth = candidate.width - requestedResize;
86
+ if (newWidth < candidate.minWidth) {
87
+ // If the new requested width is less than our min
88
+ // Calc what width we didn't use, we'll try extract that
89
+ // from other cols.
90
+ const remainder = candidate.minWidth - newWidth;
91
+ newWidth = candidate.minWidth;
92
+ remaining = remaining - requestedResize + remainder;
93
+ } else {
94
+ remaining -= requestedResize;
95
+ }
96
+
97
+ state = {
98
+ ...state,
99
+ cols: [
100
+ ...state.cols.slice(0, candidate.index),
101
+ { ...candidate, width: newWidth },
102
+ ...state.cols.slice(candidate.index + 1),
103
+ ],
104
+ };
105
+ });
106
+ }
107
+
108
+ return state;
109
109
  }
110
110
 
111
111
  enum ColType {
112
- SOURCE = 'src',
113
- DEST = 'dest',
112
+ SOURCE = 'src',
113
+ DEST = 'dest',
114
114
  }
115
115
 
116
116
  // TODO: should handle when destIdx:
117
117
  // - is beyond the range, and then not give it back
118
118
  function moveSpaceFrom(
119
- state: ResizeState,
120
- srcIdx: number,
121
- destIdx: number,
122
- amount: number,
123
- useFreeSpace: boolean = true,
119
+ state: ResizeState,
120
+ srcIdx: number,
121
+ destIdx: number,
122
+ amount: number,
123
+ useFreeSpace: boolean = true,
124
124
  ): { state: ResizeState; amount: number } {
125
- const srcCol = state.cols[srcIdx];
126
- const destCol = state.cols[destIdx];
127
-
128
- if (useFreeSpace) {
129
- const freeSpace = getFreeSpace(srcCol);
130
- // if taking more than source column's free space, only take that much
131
- if (amountFor(ColType.DEST)(amount) > freeSpace) {
132
- amount = amount > 0 ? freeSpace : -freeSpace;
133
- }
134
- }
135
-
136
- // if the source column shrinks past its min size, don't give the space away
137
- if (
138
- amountFor(ColType.SOURCE)(amount) < 0 &&
139
- widthFor(ColType.SOURCE)(amount, srcCol, destCol) < srcCol.minWidth
140
- ) {
141
- amount = srcCol.width - srcCol.minWidth;
142
- }
143
-
144
- const newDest = destCol
145
- ? { ...destCol, width: widthFor(ColType.DEST)(amount, srcCol, destCol) }
146
- : undefined;
147
- if (!newDest && amountFor(ColType.SOURCE)(amount) < 0) {
148
- // non-zero-sum game, ensure that we're not removing more than the total table width either
149
- const totalWidth = getTotalWidth(state);
150
- if (
151
- totalWidth -
152
- srcCol.width +
153
- widthFor(ColType.SOURCE)(amount, srcCol, destCol) <
154
- state.maxSize
155
- ) {
156
- // would shrink table below max width, stop it
157
- amount = state.maxSize - (totalWidth - srcCol.width) - srcCol.width - 1;
158
- }
159
- }
160
-
161
- const newSrc = {
162
- ...srcCol,
163
- width: widthFor(ColType.SOURCE)(amount, srcCol, destCol),
164
- };
165
-
166
- const newCols = state.cols
167
- .map((existingCol, idx) =>
168
- idx === srcIdx ? newSrc : idx === destIdx ? newDest : existingCol,
169
- )
170
- .filter(Boolean) as ColumnState[];
171
-
172
- return { state: { ...state, cols: newCols }, amount };
125
+ const srcCol = state.cols[srcIdx];
126
+ const destCol = state.cols[destIdx];
127
+
128
+ if (useFreeSpace) {
129
+ const freeSpace = getFreeSpace(srcCol);
130
+ // if taking more than source column's free space, only take that much
131
+ if (amountFor(ColType.DEST)(amount) > freeSpace) {
132
+ amount = amount > 0 ? freeSpace : -freeSpace;
133
+ }
134
+ }
135
+
136
+ // if the source column shrinks past its min size, don't give the space away
137
+ if (
138
+ amountFor(ColType.SOURCE)(amount) < 0 &&
139
+ widthFor(ColType.SOURCE)(amount, srcCol, destCol) < srcCol.minWidth
140
+ ) {
141
+ amount = srcCol.width - srcCol.minWidth;
142
+ }
143
+
144
+ const newDest = destCol
145
+ ? { ...destCol, width: widthFor(ColType.DEST)(amount, srcCol, destCol) }
146
+ : undefined;
147
+ if (!newDest && amountFor(ColType.SOURCE)(amount) < 0) {
148
+ // non-zero-sum game, ensure that we're not removing more than the total table width either
149
+ const totalWidth = getTotalWidth(state);
150
+ if (
151
+ totalWidth - srcCol.width + widthFor(ColType.SOURCE)(amount, srcCol, destCol) <
152
+ state.maxSize
153
+ ) {
154
+ // would shrink table below max width, stop it
155
+ amount = state.maxSize - (totalWidth - srcCol.width) - srcCol.width - 1;
156
+ }
157
+ }
158
+
159
+ const newSrc = {
160
+ ...srcCol,
161
+ width: widthFor(ColType.SOURCE)(amount, srcCol, destCol),
162
+ };
163
+
164
+ const newCols = state.cols
165
+ .map((existingCol, idx) => (idx === srcIdx ? newSrc : idx === destIdx ? newDest : existingCol))
166
+ .filter(Boolean) as ColumnState[];
167
+
168
+ return { state: { ...state, cols: newCols }, amount };
173
169
  }
174
170
 
175
171
  function stackSpace(
176
- state: ResizeState,
177
- destIdx: number,
178
- amount: number,
172
+ state: ResizeState,
173
+ destIdx: number,
174
+ amount: number,
179
175
  ): { state: ResizeState; remaining: number } {
180
- let candidates = getCandidates(state, destIdx, amount);
181
-
182
- while (candidates.length && amount) {
183
- // search for most (or least) free space in candidates
184
- let candidateIdx = findNextFreeColumn(candidates, amount);
185
- if (candidateIdx === -1) {
186
- // stack to the right -> growing the dragging column and go overflow
187
- if (amount > 0) {
188
- return {
189
- state: {
190
- ...state,
191
- cols: [
192
- ...state.cols.slice(0, destIdx),
193
- {
194
- ...state.cols[destIdx],
195
- width: state.cols[destIdx].width + amount,
196
- },
197
- ...state.cols.slice(destIdx + 1),
198
- ],
199
- },
200
- remaining: amount,
201
- };
202
- }
203
-
204
- // stacking to the left, if no free space remains
205
- break;
206
- }
207
-
208
- const column = candidates.find((col) => col.index === candidateIdx);
209
- if (!column || getFreeSpace(column) <= 0) {
210
- // no more columns with free space remain
211
- break;
212
- }
213
-
214
- const res = moveSpaceFrom(state, column.index, destIdx, amount);
215
- state = res.state;
216
- amount -= res.amount;
217
-
218
- candidates = candidates.filter((col) => col.index !== candidateIdx);
219
- }
220
-
221
- return {
222
- state,
223
- remaining: amount,
224
- };
176
+ let candidates = getCandidates(state, destIdx, amount);
177
+
178
+ while (candidates.length && amount) {
179
+ // search for most (or least) free space in candidates
180
+ let candidateIdx = findNextFreeColumn(candidates, amount);
181
+ if (candidateIdx === -1) {
182
+ // stack to the right -> growing the dragging column and go overflow
183
+ if (amount > 0) {
184
+ return {
185
+ state: {
186
+ ...state,
187
+ cols: [
188
+ ...state.cols.slice(0, destIdx),
189
+ {
190
+ ...state.cols[destIdx],
191
+ width: state.cols[destIdx].width + amount,
192
+ },
193
+ ...state.cols.slice(destIdx + 1),
194
+ ],
195
+ },
196
+ remaining: amount,
197
+ };
198
+ }
199
+
200
+ // stacking to the left, if no free space remains
201
+ break;
202
+ }
203
+
204
+ const column = candidates.find((col) => col.index === candidateIdx);
205
+ if (!column || getFreeSpace(column) <= 0) {
206
+ // no more columns with free space remain
207
+ break;
208
+ }
209
+
210
+ const res = moveSpaceFrom(state, column.index, destIdx, amount);
211
+ state = res.state;
212
+ amount -= res.amount;
213
+
214
+ candidates = candidates.filter((col) => col.index !== candidateIdx);
215
+ }
216
+
217
+ return {
218
+ state,
219
+ remaining: amount,
220
+ };
225
221
  }
226
222
 
227
223
  function findNextFreeColumn(columns: ColumnState[], amount: number): number {
228
- if (columns.length === 0) {
229
- return -1;
230
- }
231
- const direction = amount < 0 ? 'left' : 'right';
232
- if (direction === 'left') {
233
- columns = columns.slice().reverse();
234
- }
235
-
236
- let freeIndex = -1;
237
- columns.forEach((column) => {
238
- if (getFreeSpace(column) && freeIndex === -1) {
239
- freeIndex = column.index;
240
- }
241
- });
242
-
243
- if (freeIndex === -1) {
244
- return -1;
245
- }
246
-
247
- return freeIndex;
224
+ if (columns.length === 0) {
225
+ return -1;
226
+ }
227
+ const direction = amount < 0 ? 'left' : 'right';
228
+ if (direction === 'left') {
229
+ columns = columns.slice().reverse();
230
+ }
231
+
232
+ let freeIndex = -1;
233
+ columns.forEach((column) => {
234
+ if (getFreeSpace(column) && freeIndex === -1) {
235
+ freeIndex = column.index;
236
+ }
237
+ });
238
+
239
+ if (freeIndex === -1) {
240
+ return -1;
241
+ }
242
+
243
+ return freeIndex;
248
244
  }
249
245
 
250
246
  function amountFor(colType: ColType): (amount: number) => number {
251
- return (amount) =>
252
- colType === ColType.SOURCE
253
- ? amount > 0
254
- ? -amount
255
- : amount
256
- : amount < 0
257
- ? -amount
258
- : amount;
247
+ return (amount) =>
248
+ colType === ColType.SOURCE ? (amount > 0 ? -amount : amount) : amount < 0 ? -amount : amount;
259
249
  }
260
250
 
261
251
  function widthFor(
262
- colType: ColType,
252
+ colType: ColType,
263
253
  ): (amount: number, srcCol: ColumnState, destCol: ColumnState) => number {
264
- return (amount, srcCol, destCol) =>
265
- (colType === ColType.SOURCE ? srcCol : destCol).width +
266
- amountFor(colType)(amount);
254
+ return (amount, srcCol, destCol) =>
255
+ (colType === ColType.SOURCE ? srcCol : destCol).width + amountFor(colType)(amount);
267
256
  }
268
257
 
269
- function getCandidates(
270
- state: ResizeState,
271
- destIdx: number,
272
- amount: number,
273
- ): ColumnState[] {
274
- const candidates = state.cols;
275
-
276
- // only consider rows after the selected column in the direction of resize
277
- return amount < 0
278
- ? candidates.slice(0, destIdx)
279
- : candidates.slice(destIdx + 1);
258
+ function getCandidates(state: ResizeState, destIdx: number, amount: number): ColumnState[] {
259
+ const candidates = state.cols;
260
+
261
+ // only consider rows after the selected column in the direction of resize
262
+ return amount < 0 ? candidates.slice(0, destIdx) : candidates.slice(destIdx + 1);
280
263
  }
281
264
 
282
265
  /**
283
266
  * Update the given column based on resizeAmount, maintaining all other columns
284
267
  */
285
268
  export function updateAffectedColumn(
286
- resizeState: ResizeState,
287
- colIndex: number,
288
- resizeAmount: number,
269
+ resizeState: ResizeState,
270
+ colIndex: number,
271
+ resizeAmount: number,
289
272
  ): ResizeState {
290
- const updatedCols = resizeState.cols.map((col, index) => {
291
- if (index === colIndex) {
292
- const newWidth = Math.max(col.width + resizeAmount, col.minWidth);
293
- return {
294
- ...col,
295
- width: newWidth,
296
- };
297
- }
298
- return col;
299
- });
300
-
301
- return {
302
- ...resizeState,
303
- cols: updatedCols,
304
- };
273
+ const updatedCols = resizeState.cols.map((col, index) => {
274
+ if (index === colIndex) {
275
+ const newWidth = Math.max(col.width + resizeAmount, col.minWidth);
276
+ return {
277
+ ...col,
278
+ width: newWidth,
279
+ };
280
+ }
281
+ return col;
282
+ });
283
+
284
+ return {
285
+ ...resizeState,
286
+ cols: updatedCols,
287
+ };
305
288
  }