@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.
- package/.eslintrc.js +3 -3
- package/CHANGELOG.md +8 -0
- package/dist/cjs/commands/misc.js +3 -3
- package/dist/cjs/nodeviews/TableCell.js +10 -10
- package/dist/cjs/nodeviews/TableContainer.js +41 -6
- package/dist/cjs/nodeviews/TableResizer.js +7 -7
- package/dist/cjs/nodeviews/TableRow.js +23 -23
- package/dist/cjs/pm-plugins/table-resizing/plugin.js +3 -3
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +4 -4
- package/dist/cjs/pm-plugins/table-resizing/utils/scale-table.js +3 -3
- package/dist/cjs/ui/FloatingContextualMenu/styles.js +1 -1
- package/dist/cjs/ui/FloatingDragMenu/styles.js +1 -1
- package/dist/cjs/ui/common-styles.js +13 -13
- package/dist/cjs/ui/ui-styles.js +25 -25
- package/dist/cjs/utils/merged-cells.js +3 -3
- package/dist/es2019/commands/misc.js +3 -3
- package/dist/es2019/nodeviews/TableContainer.js +43 -5
- package/dist/es2019/nodeviews/TableResizer.js +7 -7
- package/dist/es2019/nodeviews/TableRow.js +21 -21
- package/dist/es2019/pm-plugins/table-resizing/plugin.js +3 -3
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +4 -4
- package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js +3 -3
- package/dist/es2019/ui/FloatingContextualMenu/styles.js +47 -47
- package/dist/es2019/ui/FloatingDragMenu/styles.js +30 -30
- package/dist/es2019/ui/common-styles.js +802 -816
- package/dist/es2019/ui/ui-styles.js +665 -678
- package/dist/es2019/utils/merged-cells.js +3 -3
- package/dist/esm/commands/misc.js +3 -3
- package/dist/esm/nodeviews/TableCell.js +10 -10
- package/dist/esm/nodeviews/TableContainer.js +42 -7
- package/dist/esm/nodeviews/TableResizer.js +7 -7
- package/dist/esm/nodeviews/TableRow.js +23 -23
- package/dist/esm/pm-plugins/table-resizing/plugin.js +3 -3
- package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +4 -4
- package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js +3 -3
- package/dist/esm/ui/FloatingContextualMenu/styles.js +1 -1
- package/dist/esm/ui/FloatingDragMenu/styles.js +1 -1
- package/dist/esm/ui/common-styles.js +13 -13
- package/dist/esm/ui/ui-styles.js +25 -25
- package/dist/esm/utils/merged-cells.js +3 -3
- package/dist/types/pm-plugins/decorations/utils/index.d.ts +1 -1
- package/dist/types/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +1 -1
- package/dist/types/pm-plugins/drag-and-drop/utils/getDragBehaviour.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/index.d.ts +1 -1
- package/dist/types/ui/ColumnResizeWidget/index.d.ts +1 -1
- package/dist/types/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.d.ts +1 -1
- package/dist/types/ui/FloatingToolbarLabel/FloatingToolbarLabel.d.ts +1 -1
- package/dist/types/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.d.ts +1 -1
- package/dist/types/ui/TableFloatingControls/CornerControls/index.d.ts +1 -1
- package/dist/types/ui/icons/DragHandleDisabledIcon.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/decorations/utils/index.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/autoscrollers.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/drag-and-drop/utils/getDragBehaviour.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/index.d.ts +1 -1
- package/dist/types-ts4.5/ui/ColumnResizeWidget/index.d.ts +1 -1
- package/dist/types-ts4.5/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.d.ts +1 -1
- package/dist/types-ts4.5/ui/FloatingToolbarLabel/FloatingToolbarLabel.d.ts +1 -1
- package/dist/types-ts4.5/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.d.ts +1 -1
- package/dist/types-ts4.5/ui/TableFloatingControls/CornerControls/index.d.ts +1 -1
- package/dist/types-ts4.5/ui/icons/DragHandleDisabledIcon.d.ts +1 -1
- package/docs/0-intro.tsx +9 -7
- package/package.json +2 -2
- package/report.api.md +67 -66
- package/src/commands/clear.ts +36 -44
- package/src/commands/collapse.ts +8 -8
- package/src/commands/column-resize.ts +412 -452
- package/src/commands/delete.ts +14 -14
- package/src/commands/display-mode.ts +10 -11
- package/src/commands/go-to-next-cell.ts +48 -54
- package/src/commands/hover.ts +210 -227
- package/src/commands/index.ts +35 -35
- package/src/commands/insert.ts +208 -235
- package/src/commands/misc.ts +655 -748
- package/src/commands/referentiality.ts +9 -9
- package/src/commands/selection.ts +433 -563
- package/src/commands/sort.ts +68 -86
- package/src/commands/split-cell.ts +14 -14
- package/src/commands/toggle.ts +69 -67
- package/src/commands-with-analytics.ts +570 -639
- package/src/create-plugin-config.ts +13 -13
- package/src/event-handlers.ts +513 -612
- package/src/handlers.ts +120 -133
- package/src/nodeviews/ExternalDropTargets.tsx +68 -73
- package/src/nodeviews/OverflowShadowsObserver.ts +148 -157
- package/src/nodeviews/TableCell.ts +47 -54
- package/src/nodeviews/TableComponent.tsx +1018 -1112
- package/src/nodeviews/TableComponentWithSharedState.tsx +91 -94
- package/src/nodeviews/TableContainer.tsx +363 -339
- package/src/nodeviews/TableNodeViewBase.ts +19 -24
- package/src/nodeviews/TableResizer.tsx +565 -657
- package/src/nodeviews/TableRow.ts +580 -629
- package/src/nodeviews/TableStickyScrollbar.ts +173 -190
- package/src/nodeviews/__mocks__/OverflowShadowsObserver.ts +8 -8
- package/src/nodeviews/__mocks__/OverridableMock.ts +14 -15
- package/src/nodeviews/table.tsx +345 -375
- package/src/nodeviews/types.ts +21 -24
- package/src/nodeviews/update-overflow-shadows.ts +8 -14
- package/src/plugin.tsx +578 -603
- package/src/pm-plugins/analytics/actions.ts +10 -12
- package/src/pm-plugins/analytics/commands.ts +31 -37
- package/src/pm-plugins/analytics/plugin-factory.ts +4 -2
- package/src/pm-plugins/analytics/plugin-key.ts +1 -3
- package/src/pm-plugins/analytics/plugin.ts +60 -70
- package/src/pm-plugins/analytics/reducer.ts +19 -19
- package/src/pm-plugins/analytics/types.ts +10 -10
- package/src/pm-plugins/analytics/utils/moved-event.ts +38 -38
- package/src/pm-plugins/decorations/plugin.ts +58 -77
- package/src/pm-plugins/decorations/utils/column-controls.ts +59 -71
- package/src/pm-plugins/decorations/utils/column-resizing.ts +50 -57
- package/src/pm-plugins/decorations/utils/compose-decorations.ts +6 -6
- package/src/pm-plugins/decorations/utils/index.ts +3 -6
- package/src/pm-plugins/decorations/utils/types.ts +7 -12
- package/src/pm-plugins/default-table-selection.ts +3 -3
- package/src/pm-plugins/drag-and-drop/actions.ts +25 -25
- package/src/pm-plugins/drag-and-drop/commands-with-analytics.ts +158 -190
- package/src/pm-plugins/drag-and-drop/commands.ts +154 -170
- package/src/pm-plugins/drag-and-drop/consts.ts +4 -5
- package/src/pm-plugins/drag-and-drop/plugin-factory.ts +23 -20
- package/src/pm-plugins/drag-and-drop/plugin-key.ts +1 -3
- package/src/pm-plugins/drag-and-drop/plugin.ts +329 -383
- package/src/pm-plugins/drag-and-drop/reducer.ts +30 -30
- package/src/pm-plugins/drag-and-drop/types.ts +8 -8
- package/src/pm-plugins/drag-and-drop/utils/autoscrollers.ts +38 -41
- package/src/pm-plugins/drag-and-drop/utils/getDragBehaviour.ts +3 -6
- package/src/pm-plugins/drag-and-drop/utils/monitor.ts +57 -70
- package/src/pm-plugins/keymap.ts +208 -220
- package/src/pm-plugins/main.ts +348 -400
- package/src/pm-plugins/plugin-factory.ts +32 -34
- package/src/pm-plugins/safari-delete-composition-text-issue-workaround.ts +83 -97
- package/src/pm-plugins/sticky-headers/commands.ts +2 -6
- package/src/pm-plugins/sticky-headers/plugin-key.ts +1 -3
- package/src/pm-plugins/sticky-headers/plugin-state.ts +41 -44
- package/src/pm-plugins/sticky-headers/plugin.ts +4 -4
- package/src/pm-plugins/sticky-headers/types.ts +8 -8
- package/src/pm-plugins/sticky-headers/util.ts +10 -10
- package/src/pm-plugins/table-analytics.ts +70 -72
- package/src/pm-plugins/table-local-id.ts +180 -184
- package/src/pm-plugins/table-resizing/commands.ts +72 -85
- package/src/pm-plugins/table-resizing/event-handlers.ts +298 -317
- package/src/pm-plugins/table-resizing/plugin-factory.ts +10 -10
- package/src/pm-plugins/table-resizing/plugin-key.ts +1 -3
- package/src/pm-plugins/table-resizing/plugin.ts +61 -68
- package/src/pm-plugins/table-resizing/reducer.ts +30 -33
- package/src/pm-plugins/table-resizing/utils/colgroup.ts +84 -84
- package/src/pm-plugins/table-resizing/utils/column-state.ts +78 -81
- package/src/pm-plugins/table-resizing/utils/content-width.ts +94 -114
- package/src/pm-plugins/table-resizing/utils/dom.ts +93 -110
- package/src/pm-plugins/table-resizing/utils/index.ts +29 -34
- package/src/pm-plugins/table-resizing/utils/misc.ts +94 -119
- package/src/pm-plugins/table-resizing/utils/resize-column.ts +93 -106
- package/src/pm-plugins/table-resizing/utils/resize-logic.ts +240 -257
- package/src/pm-plugins/table-resizing/utils/resize-state.ts +343 -372
- package/src/pm-plugins/table-resizing/utils/scale-table.ts +202 -207
- package/src/pm-plugins/table-resizing/utils/types.ts +17 -17
- package/src/pm-plugins/table-resizing/utils/unit-to-number.ts +1 -2
- package/src/pm-plugins/table-selection-keymap.ts +25 -51
- package/src/pm-plugins/table-width.ts +191 -204
- package/src/pm-plugins/view-mode-sort/index.ts +223 -227
- package/src/pm-plugins/view-mode-sort/plugin-key.ts +3 -2
- package/src/pm-plugins/view-mode-sort/types.ts +12 -12
- package/src/pm-plugins/view-mode-sort/utils.ts +108 -117
- package/src/reducer.ts +139 -155
- package/src/toolbar.tsx +815 -905
- package/src/transforms/column-width.ts +186 -213
- package/src/transforms/delete-columns.ts +208 -222
- package/src/transforms/delete-rows.ts +117 -121
- package/src/transforms/fix-tables.ts +190 -215
- package/src/transforms/merge.ts +263 -269
- package/src/transforms/replace-table.ts +27 -43
- package/src/transforms/split.ts +65 -75
- package/src/types.ts +421 -427
- package/src/ui/ColumnResizeWidget/index.tsx +40 -47
- package/src/ui/DragHandle/HandleIconComponent.tsx +9 -13
- package/src/ui/DragHandle/index.tsx +221 -250
- package/src/ui/DragPreview/index.tsx +35 -35
- package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx +33 -41
- package/src/ui/FloatingContextualButton/FixedButton.tsx +154 -157
- package/src/ui/FloatingContextualButton/index.tsx +109 -115
- package/src/ui/FloatingContextualButton/styles.ts +43 -46
- package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +634 -694
- package/src/ui/FloatingContextualMenu/index.tsx +83 -101
- package/src/ui/FloatingContextualMenu/styles.ts +57 -65
- package/src/ui/FloatingDeleteButton/DeleteButton.tsx +37 -37
- package/src/ui/FloatingDeleteButton/getPopUpOptions.ts +47 -57
- package/src/ui/FloatingDeleteButton/index.tsx +319 -350
- package/src/ui/FloatingDragMenu/DragMenu.tsx +555 -596
- package/src/ui/FloatingDragMenu/DropdownMenu.tsx +152 -162
- package/src/ui/FloatingDragMenu/index.tsx +88 -102
- package/src/ui/FloatingDragMenu/styles.ts +51 -54
- package/src/ui/FloatingInsertButton/InsertButton.tsx +204 -217
- package/src/ui/FloatingInsertButton/getPopupOptions.ts +100 -115
- package/src/ui/FloatingInsertButton/index.tsx +248 -292
- package/src/ui/FloatingToolbarLabel/FloatingToolbarLabel.tsx +24 -29
- package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +308 -329
- package/src/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.tsx +85 -94
- package/src/ui/TableFloatingColumnControls/ColumnDropTargets/index.tsx +46 -46
- package/src/ui/TableFloatingColumnControls/index.tsx +116 -136
- package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +79 -91
- package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +95 -102
- package/src/ui/TableFloatingControls/CornerControls/index.tsx +1 -4
- package/src/ui/TableFloatingControls/CornerControls/types.ts +8 -8
- package/src/ui/TableFloatingControls/FloatingControlsWithSelection.tsx +50 -50
- package/src/ui/TableFloatingControls/NumberColumn/index.tsx +111 -124
- package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +86 -105
- package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +305 -341
- package/src/ui/TableFloatingControls/RowDropTarget/index.tsx +72 -75
- package/src/ui/TableFloatingControls/index.tsx +191 -193
- package/src/ui/TableFullWidthLabel/index.tsx +20 -20
- package/src/ui/common-styles.ts +880 -912
- package/src/ui/consts.ts +29 -74
- package/src/ui/icons/AddColLeftIcon.tsx +33 -39
- package/src/ui/icons/AddColRightIcon.tsx +33 -39
- package/src/ui/icons/AddRowAboveIcon.tsx +16 -22
- package/src/ui/icons/AddRowBelowIcon.tsx +33 -39
- package/src/ui/icons/DisplayModeIcon.tsx +31 -31
- package/src/ui/icons/DragHandleDisabledIcon.tsx +19 -21
- package/src/ui/icons/DragHandleIcon.tsx +12 -12
- package/src/ui/icons/DragInMotionIcon.tsx +45 -52
- package/src/ui/icons/MergeCellsIcon.tsx +22 -28
- package/src/ui/icons/MinimisedHandle.tsx +9 -9
- package/src/ui/icons/SplitCellIcon.tsx +30 -36
- package/src/ui/ui-styles.ts +769 -798
- package/src/utils/alignment.ts +1 -1
- package/src/utils/analytics.ts +192 -208
- package/src/utils/collapse.ts +55 -64
- package/src/utils/column-controls.ts +237 -254
- package/src/utils/create.ts +30 -30
- package/src/utils/decoration.ts +482 -502
- package/src/utils/dom.ts +127 -134
- package/src/utils/drag-menu.ts +322 -373
- package/src/utils/get-allow-add-column-custom-step.ts +4 -5
- package/src/utils/guidelines.ts +10 -21
- package/src/utils/index.ts +68 -68
- package/src/utils/merged-cells.ts +245 -254
- package/src/utils/nodes.ts +91 -106
- package/src/utils/paste.ts +119 -135
- package/src/utils/row-controls.ts +199 -213
- package/src/utils/selection.ts +77 -87
- package/src/utils/snapping.ts +84 -97
- package/src/utils/table.ts +44 -44
- package/src/utils/transforms.ts +5 -5
- 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
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
7
|
+
state: ResizeState,
|
|
8
|
+
colIndex: number,
|
|
9
|
+
amount: number,
|
|
10
|
+
selectedColumns?: number[],
|
|
11
11
|
): ResizeState => {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
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
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
31
|
+
state: ResizeState,
|
|
32
|
+
colIndex: number,
|
|
33
|
+
amount: number,
|
|
34
|
+
selectedColumns?: number[],
|
|
35
35
|
): ResizeState => {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
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
|
-
|
|
64
|
-
|
|
65
|
-
|
|
63
|
+
state: ResizeState,
|
|
64
|
+
amount: number,
|
|
65
|
+
ignoreCols: number[] = [],
|
|
66
66
|
): ResizeState {
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
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
|
-
|
|
113
|
-
|
|
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
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
119
|
+
state: ResizeState,
|
|
120
|
+
srcIdx: number,
|
|
121
|
+
destIdx: number,
|
|
122
|
+
amount: number,
|
|
123
|
+
useFreeSpace: boolean = true,
|
|
124
124
|
): { state: ResizeState; amount: number } {
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
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
|
-
|
|
177
|
-
|
|
178
|
-
|
|
172
|
+
state: ResizeState,
|
|
173
|
+
destIdx: number,
|
|
174
|
+
amount: number,
|
|
179
175
|
): { state: ResizeState; remaining: number } {
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
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
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
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
|
-
|
|
252
|
-
|
|
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
|
-
|
|
252
|
+
colType: ColType,
|
|
263
253
|
): (amount: number, srcCol: ColumnState, destCol: ColumnState) => number {
|
|
264
|
-
|
|
265
|
-
|
|
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
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
):
|
|
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
|
-
|
|
287
|
-
|
|
288
|
-
|
|
269
|
+
resizeState: ResizeState,
|
|
270
|
+
colIndex: number,
|
|
271
|
+
resizeAmount: number,
|
|
289
272
|
): ResizeState {
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
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
|
}
|