@atlaskit/editor-plugin-table 12.2.6 → 12.2.7
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/CHANGELOG.md +8 -0
- package/package.json +4 -4
- package/afm-cc/tsconfig.json +0 -123
- package/afm-dev-agents/tsconfig.json +0 -123
- package/afm-jira/tsconfig.json +0 -123
- package/afm-passionfruit/tsconfig.json +0 -123
- package/afm-post-office/tsconfig.json +0 -123
- package/afm-rovo-extension/tsconfig.json +0 -123
- package/afm-townsquare/tsconfig.json +0 -123
- package/afm-volt/tsconfig.json +0 -114
- package/build/tsconfig.json +0 -23
- package/docs/0-intro.tsx +0 -57
- package/src/index.ts +0 -21
- package/src/nodeviews/ExternalDropTargets.tsx +0 -91
- package/src/nodeviews/OverflowShadowsObserver.ts +0 -156
- package/src/nodeviews/TableCell.ts +0 -134
- package/src/nodeviews/TableComponent.tsx +0 -1590
- package/src/nodeviews/TableComponentWithSharedState.tsx +0 -278
- package/src/nodeviews/TableContainer.tsx +0 -926
- package/src/nodeviews/TableNodeViewBase.ts +0 -29
- package/src/nodeviews/TableResizer.tsx +0 -884
- package/src/nodeviews/TableRow.ts +0 -830
- package/src/nodeviews/TableStickyScrollbar.ts +0 -211
- package/src/nodeviews/__mocks__/OverflowShadowsObserver.ts +0 -15
- package/src/nodeviews/__mocks__/OverridableMock.ts +0 -26
- package/src/nodeviews/table-container-styles.ts +0 -9
- package/src/nodeviews/table-node-views.ts +0 -76
- package/src/nodeviews/table.tsx +0 -530
- package/src/nodeviews/toDOM.ts +0 -244
- package/src/nodeviews/types.ts +0 -36
- package/src/nodeviews/update-overflow-shadows.ts +0 -11
- package/src/pm-plugins/analytics/actions.ts +0 -21
- package/src/pm-plugins/analytics/commands.ts +0 -47
- package/src/pm-plugins/analytics/plugin-factory.ts +0 -9
- package/src/pm-plugins/analytics/plugin-key.ts +0 -5
- package/src/pm-plugins/analytics/plugin.ts +0 -80
- package/src/pm-plugins/analytics/reducer.ts +0 -27
- package/src/pm-plugins/analytics/types.ts +0 -20
- package/src/pm-plugins/analytics/utils/moved-event.ts +0 -51
- package/src/pm-plugins/commands/clear.ts +0 -43
- package/src/pm-plugins/commands/collapse.ts +0 -17
- package/src/pm-plugins/commands/column-resize.ts +0 -478
- package/src/pm-plugins/commands/commands-with-analytics.ts +0 -715
- package/src/pm-plugins/commands/delete.ts +0 -42
- package/src/pm-plugins/commands/display-mode.ts +0 -18
- package/src/pm-plugins/commands/go-to-next-cell.ts +0 -198
- package/src/pm-plugins/commands/hover.ts +0 -242
- package/src/pm-plugins/commands/index.ts +0 -51
- package/src/pm-plugins/commands/insert.ts +0 -438
- package/src/pm-plugins/commands/misc.ts +0 -811
- package/src/pm-plugins/commands/referentiality.ts +0 -15
- package/src/pm-plugins/commands/selection.ts +0 -537
- package/src/pm-plugins/commands/sort.ts +0 -102
- package/src/pm-plugins/commands/split-cell.ts +0 -28
- package/src/pm-plugins/commands/toggle.ts +0 -109
- package/src/pm-plugins/create-plugin-config.ts +0 -17
- package/src/pm-plugins/decorations/plugin.ts +0 -107
- package/src/pm-plugins/decorations/utils/column-controls.ts +0 -91
- package/src/pm-plugins/decorations/utils/column-resizing.ts +0 -71
- package/src/pm-plugins/decorations/utils/compose-decorations.ts +0 -9
- package/src/pm-plugins/decorations/utils/types.ts +0 -16
- package/src/pm-plugins/default-table-selection.ts +0 -14
- package/src/pm-plugins/drag-and-drop/actions.ts +0 -48
- package/src/pm-plugins/drag-and-drop/commands-with-analytics.ts +0 -222
- package/src/pm-plugins/drag-and-drop/commands.ts +0 -194
- package/src/pm-plugins/drag-and-drop/consts.ts +0 -7
- package/src/pm-plugins/drag-and-drop/plugin-factory.ts +0 -33
- package/src/pm-plugins/drag-and-drop/plugin-key.ts +0 -5
- package/src/pm-plugins/drag-and-drop/plugin.ts +0 -398
- package/src/pm-plugins/drag-and-drop/reducer.ts +0 -38
- package/src/pm-plugins/drag-and-drop/types.ts +0 -18
- package/src/pm-plugins/drag-and-drop/utils/autoscrollers.ts +0 -49
- package/src/pm-plugins/drag-and-drop/utils/getDragBehaviour.ts +0 -9
- package/src/pm-plugins/drag-and-drop/utils/monitor.ts +0 -73
- package/src/pm-plugins/handlers.ts +0 -161
- package/src/pm-plugins/keymap.ts +0 -436
- package/src/pm-plugins/main.ts +0 -433
- package/src/pm-plugins/plugin-factory.ts +0 -42
- package/src/pm-plugins/plugin-key.ts +0 -8
- package/src/pm-plugins/reducer.ts +0 -145
- package/src/pm-plugins/safari-delete-composition-text-issue-workaround.ts +0 -102
- package/src/pm-plugins/sticky-headers/commands.ts +0 -8
- package/src/pm-plugins/sticky-headers/plugin-key.ts +0 -5
- package/src/pm-plugins/sticky-headers/plugin-state.ts +0 -52
- package/src/pm-plugins/sticky-headers/plugin.ts +0 -12
- package/src/pm-plugins/sticky-headers/types.ts +0 -20
- package/src/pm-plugins/sticky-headers/util.ts +0 -18
- package/src/pm-plugins/table-analytics.ts +0 -100
- package/src/pm-plugins/table-local-id.ts +0 -213
- package/src/pm-plugins/table-resizing/commands.ts +0 -116
- package/src/pm-plugins/table-resizing/event-handlers.ts +0 -352
- package/src/pm-plugins/table-resizing/plugin-factory.ts +0 -29
- package/src/pm-plugins/table-resizing/plugin-key.ts +0 -5
- package/src/pm-plugins/table-resizing/plugin.ts +0 -94
- package/src/pm-plugins/table-resizing/reducer.ts +0 -37
- package/src/pm-plugins/table-resizing/utils/colgroup.ts +0 -306
- package/src/pm-plugins/table-resizing/utils/column-state.ts +0 -120
- package/src/pm-plugins/table-resizing/utils/consts.ts +0 -11
- package/src/pm-plugins/table-resizing/utils/content-width.ts +0 -118
- package/src/pm-plugins/table-resizing/utils/dom.ts +0 -132
- package/src/pm-plugins/table-resizing/utils/misc.ts +0 -282
- package/src/pm-plugins/table-resizing/utils/resize-column.ts +0 -34
- package/src/pm-plugins/table-resizing/utils/resize-logic.ts +0 -289
- package/src/pm-plugins/table-resizing/utils/resize-state.ts +0 -417
- package/src/pm-plugins/table-resizing/utils/scale-table.ts +0 -290
- package/src/pm-plugins/table-resizing/utils/types.ts +0 -25
- package/src/pm-plugins/table-resizing/utils/unit-to-number.ts +0 -1
- package/src/pm-plugins/table-selection-keymap.ts +0 -64
- package/src/pm-plugins/table-size-selector.ts +0 -39
- package/src/pm-plugins/table-width-in-comment-fix.ts +0 -113
- package/src/pm-plugins/table-width.ts +0 -153
- package/src/pm-plugins/transforms/column-width.ts +0 -249
- package/src/pm-plugins/transforms/delete-columns.ts +0 -281
- package/src/pm-plugins/transforms/delete-rows.ts +0 -154
- package/src/pm-plugins/transforms/fix-tables.ts +0 -249
- package/src/pm-plugins/transforms/merge.ts +0 -301
- package/src/pm-plugins/transforms/replace-table.ts +0 -38
- package/src/pm-plugins/transforms/split.ts +0 -90
- package/src/pm-plugins/utils/alignment.ts +0 -33
- package/src/pm-plugins/utils/analytics.ts +0 -238
- package/src/pm-plugins/utils/collapse.ts +0 -93
- package/src/pm-plugins/utils/column-controls.ts +0 -250
- package/src/pm-plugins/utils/create.ts +0 -64
- package/src/pm-plugins/utils/decoration.ts +0 -672
- package/src/pm-plugins/utils/dom.ts +0 -251
- package/src/pm-plugins/utils/drag-menu.tsx +0 -491
- package/src/pm-plugins/utils/get-allow-add-column-custom-step.ts +0 -10
- package/src/pm-plugins/utils/guidelines.ts +0 -30
- package/src/pm-plugins/utils/merged-cells.ts +0 -239
- package/src/pm-plugins/utils/nodes.ts +0 -162
- package/src/pm-plugins/utils/paste.ts +0 -386
- package/src/pm-plugins/utils/row-controls.ts +0 -211
- package/src/pm-plugins/utils/selection.ts +0 -17
- package/src/pm-plugins/utils/snapping.ts +0 -136
- package/src/pm-plugins/utils/table.ts +0 -60
- package/src/pm-plugins/utils/update-plugin-state-decorations.ts +0 -13
- package/src/pm-plugins/view-mode-sort/consts.ts +0 -3
- package/src/pm-plugins/view-mode-sort/index.ts +0 -291
- package/src/pm-plugins/view-mode-sort/plugin-key.ts +0 -7
- package/src/pm-plugins/view-mode-sort/types.ts +0 -23
- package/src/pm-plugins/view-mode-sort/utils.ts +0 -136
- package/src/tablePlugin.tsx +0 -971
- package/src/tablePluginType.ts +0 -102
- package/src/types/index.ts +0 -592
- package/src/ui/ColumnResizeWidget/index.tsx +0 -61
- package/src/ui/ContentComponent.tsx +0 -311
- package/src/ui/DragHandle/HandleIconComponent.tsx +0 -21
- package/src/ui/DragHandle/index.tsx +0 -391
- package/src/ui/DragPreview/index.tsx +0 -51
- package/src/ui/FloatingAlignmentButtons/FloatingAlignmentButtons.tsx +0 -59
- package/src/ui/FloatingContextualButton/FixedButton.tsx +0 -203
- package/src/ui/FloatingContextualButton/index.tsx +0 -168
- package/src/ui/FloatingContextualButton/styles.ts +0 -69
- package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +0 -931
- package/src/ui/FloatingContextualMenu/index.tsx +0 -141
- package/src/ui/FloatingContextualMenu/styles.ts +0 -77
- package/src/ui/FloatingDeleteButton/DeleteButton.tsx +0 -54
- package/src/ui/FloatingDeleteButton/getPopUpOptions.ts +0 -65
- package/src/ui/FloatingDeleteButton/index.tsx +0 -383
- package/src/ui/FloatingDeleteButton/types.ts +0 -3
- package/src/ui/FloatingDragMenu/DragMenu.tsx +0 -668
- package/src/ui/FloatingDragMenu/DropdownMenu.tsx +0 -221
- package/src/ui/FloatingDragMenu/index.tsx +0 -136
- package/src/ui/FloatingDragMenu/styles.ts +0 -83
- package/src/ui/FloatingInsertButton/InsertButton.tsx +0 -263
- package/src/ui/FloatingInsertButton/getPopupOptions.ts +0 -131
- package/src/ui/FloatingInsertButton/index.tsx +0 -314
- package/src/ui/FloatingToolbarLabel/FloatingToolbarLabel.tsx +0 -31
- package/src/ui/SizeSelector/index.tsx +0 -74
- package/src/ui/TableFloatingColumnControls/ColumnControls/index.tsx +0 -397
- package/src/ui/TableFloatingColumnControls/ColumnDropTargets/ColumnDropTarget.tsx +0 -105
- package/src/ui/TableFloatingColumnControls/ColumnDropTargets/index.tsx +0 -63
- package/src/ui/TableFloatingColumnControls/index.tsx +0 -151
- package/src/ui/TableFloatingControls/CornerControls/ClassicCornerControls.tsx +0 -106
- package/src/ui/TableFloatingControls/CornerControls/DragCornerControls.tsx +0 -143
- package/src/ui/TableFloatingControls/CornerControls/types.ts +0 -12
- package/src/ui/TableFloatingControls/FloatingControlsWithSelection.tsx +0 -88
- package/src/ui/TableFloatingControls/NumberColumn/index.tsx +0 -175
- package/src/ui/TableFloatingControls/RowControls/ClassicControls.tsx +0 -131
- package/src/ui/TableFloatingControls/RowControls/DragControls.tsx +0 -429
- package/src/ui/TableFloatingControls/RowDropTarget/index.tsx +0 -96
- package/src/ui/TableFloatingControls/index.tsx +0 -275
- package/src/ui/TableFullWidthLabel/index.tsx +0 -38
- package/src/ui/common-styles.ts +0 -1218
- package/src/ui/consts.ts +0 -109
- package/src/ui/event-handlers.ts +0 -662
- package/src/ui/global-styles.tsx +0 -55
- package/src/ui/hooks/useInternalTablePluginStateSelector.ts +0 -38
- package/src/ui/icons/AddColLeftIcon.tsx +0 -37
- package/src/ui/icons/AddColRightIcon.tsx +0 -37
- package/src/ui/icons/AddRowAboveIcon.tsx +0 -22
- package/src/ui/icons/AddRowBelowIcon.tsx +0 -39
- package/src/ui/icons/DragHandleDisabledIcon.tsx +0 -25
- package/src/ui/icons/DragHandleIcon.tsx +0 -16
- package/src/ui/icons/DragInMotionIcon.tsx +0 -54
- package/src/ui/icons/MergeCellsIcon.tsx +0 -26
- package/src/ui/icons/MinimisedHandle.tsx +0 -15
- package/src/ui/icons/SortingIconWrapper.tsx +0 -43
- package/src/ui/icons/SplitCellIcon.tsx +0 -34
- package/src/ui/toolbar.tsx +0 -1153
- package/src/ui/ui-styles.ts +0 -960
- package/tsconfig.app.json +0 -135
- package/tsconfig.dev.json +0 -54
- package/tsconfig.json +0 -18
|
@@ -1,417 +0,0 @@
|
|
|
1
|
-
import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
2
|
-
import { tableCellMinWidth, tableNewColumnMinWidth } from '@atlaskit/editor-common/styles';
|
|
3
|
-
import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
4
|
-
import { calcTableColumnWidths } from '@atlaskit/editor-common/utils';
|
|
5
|
-
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
|
|
6
|
-
import type { EditorState } from '@atlaskit/editor-prosemirror/state';
|
|
7
|
-
import type { Rect } from '@atlaskit/editor-tables/table-map';
|
|
8
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
9
|
-
|
|
10
|
-
import { getSelectedTableInfo } from '../../utils/analytics';
|
|
11
|
-
|
|
12
|
-
import { getColWidthFix, hasTableBeenResized, insertColgroupFromNode } from './colgroup';
|
|
13
|
-
import type { ColumnState } from './column-state';
|
|
14
|
-
import { getCellsRefsInColumn, getColumnStateFromDOM } from './column-state';
|
|
15
|
-
import { syncStickyRowToTable } from './dom';
|
|
16
|
-
import { getTableMaxWidth, getTableScalingPercent } from './misc';
|
|
17
|
-
import type { ResizeState, ResizeStateWithAnalytics } from './types';
|
|
18
|
-
|
|
19
|
-
export const getResizeState = ({
|
|
20
|
-
minWidth,
|
|
21
|
-
maxSize,
|
|
22
|
-
table,
|
|
23
|
-
tableRef,
|
|
24
|
-
start,
|
|
25
|
-
domAtPos,
|
|
26
|
-
isTableScalingEnabled = false,
|
|
27
|
-
shouldUseIncreasedScalingPercent = false,
|
|
28
|
-
isCommentEditor = false,
|
|
29
|
-
}: {
|
|
30
|
-
minWidth: number;
|
|
31
|
-
maxSize: number;
|
|
32
|
-
table: PMNode;
|
|
33
|
-
tableRef: HTMLTableElement | null;
|
|
34
|
-
start: number;
|
|
35
|
-
domAtPos: (pos: number) => { node: Node; offset: number };
|
|
36
|
-
isTableScalingEnabled: boolean;
|
|
37
|
-
shouldUseIncreasedScalingPercent: boolean;
|
|
38
|
-
isCommentEditor: boolean;
|
|
39
|
-
}): ResizeState => {
|
|
40
|
-
if (
|
|
41
|
-
(isTableScalingEnabled && !isCommentEditor) ||
|
|
42
|
-
(isTableScalingEnabled && isCommentEditor && table.attrs?.width)
|
|
43
|
-
) {
|
|
44
|
-
const scalePercent = getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent);
|
|
45
|
-
minWidth = Math.ceil(minWidth / scalePercent);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
if (hasTableBeenResized(table)) {
|
|
49
|
-
// If the table has been resized, we can use the column widths from the table node
|
|
50
|
-
const cols = calcTableColumnWidths(table).map((width, index) => ({
|
|
51
|
-
width: width === 0 ? tableNewColumnMinWidth : width,
|
|
52
|
-
minWidth: width === 0 ? tableNewColumnMinWidth : minWidth,
|
|
53
|
-
index,
|
|
54
|
-
}));
|
|
55
|
-
|
|
56
|
-
const widths = cols.map((col) => col.width);
|
|
57
|
-
const tableWidth = widths.reduce((sum, width) => sum + width, 0);
|
|
58
|
-
const overflow = tableWidth > maxSize;
|
|
59
|
-
|
|
60
|
-
return {
|
|
61
|
-
cols,
|
|
62
|
-
widths,
|
|
63
|
-
maxSize,
|
|
64
|
-
tableWidth,
|
|
65
|
-
overflow,
|
|
66
|
-
isScaled: isTableScalingEnabled,
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
const shouldReinsertColgroup = !isTableScalingEnabled;
|
|
71
|
-
|
|
72
|
-
// Getting the resize state from DOM
|
|
73
|
-
const colgroupChildren = insertColgroupFromNode(
|
|
74
|
-
tableRef,
|
|
75
|
-
table,
|
|
76
|
-
isTableScalingEnabled,
|
|
77
|
-
shouldReinsertColgroup, // don't reinsert colgroup when preserving table width - this causes widths to jump
|
|
78
|
-
shouldUseIncreasedScalingPercent,
|
|
79
|
-
isCommentEditor,
|
|
80
|
-
);
|
|
81
|
-
const cols = Array.from(colgroupChildren).map((_, index) => {
|
|
82
|
-
// If the table hasn't been resized and we have a table width attribute, we can use it
|
|
83
|
-
// to calculate the widths of the columns
|
|
84
|
-
if (isTableScalingEnabled) {
|
|
85
|
-
// isCommentEditor when table cols were not resized,
|
|
86
|
-
// we want to use tableRef.parentElement.clientWidth, which is the same as maxSize
|
|
87
|
-
const tableNodeWidth =
|
|
88
|
-
isCommentEditor && !table.attrs?.width ? maxSize : getTableContainerWidth(table);
|
|
89
|
-
return {
|
|
90
|
-
index,
|
|
91
|
-
width: tableNodeWidth / colgroupChildren.length,
|
|
92
|
-
minWidth,
|
|
93
|
-
};
|
|
94
|
-
}
|
|
95
|
-
const cellsRefs = getCellsRefsInColumn(index, table, start, domAtPos);
|
|
96
|
-
return getColumnStateFromDOM(cellsRefs, index, minWidth);
|
|
97
|
-
});
|
|
98
|
-
|
|
99
|
-
const widths = cols.map((col) => col.width);
|
|
100
|
-
const tableWidth = widths.reduce((sum, width) => sum + width, 0);
|
|
101
|
-
|
|
102
|
-
const overflow = tableWidth > maxSize;
|
|
103
|
-
|
|
104
|
-
return {
|
|
105
|
-
cols,
|
|
106
|
-
widths,
|
|
107
|
-
maxSize,
|
|
108
|
-
tableWidth,
|
|
109
|
-
overflow,
|
|
110
|
-
isScaled: isTableScalingEnabled,
|
|
111
|
-
};
|
|
112
|
-
};
|
|
113
|
-
|
|
114
|
-
// updates Colgroup DOM node with new widths
|
|
115
|
-
export const updateColgroup = (
|
|
116
|
-
state: ResizeState,
|
|
117
|
-
tableRef: HTMLElement | null,
|
|
118
|
-
tableNode?: PMNode,
|
|
119
|
-
isTableScalingEnabled?: boolean,
|
|
120
|
-
scalePercent?: number,
|
|
121
|
-
): void => {
|
|
122
|
-
const cols = expValEquals('platform_editor_tables_scaling_css', 'isEnabled', true)
|
|
123
|
-
? (tableRef?.querySelectorAll(':scope > colgroup > col') as NodeListOf<HTMLElement> | undefined)
|
|
124
|
-
: (tableRef?.querySelectorAll('col') as NodeListOf<HTMLElement> | undefined);
|
|
125
|
-
const columnsCount = cols?.length;
|
|
126
|
-
/**
|
|
127
|
-
updateColgroup will update whole table scale when click the column resize handle, this behavior will affect when table overflowed, when now resize handle been dragged and extend to make table overflowed, table will show overflow. This need to be confirmed because it conflict with how isTableScalingEnabled work.
|
|
128
|
-
We don't want to scale the table when resizing columns, only when viewpoint shrinks the table.
|
|
129
|
-
We need to remove !isColumnResizing if we handled auto scale table when mouseUp event.
|
|
130
|
-
* */
|
|
131
|
-
if (isTableScalingEnabled && tableNode) {
|
|
132
|
-
state.cols
|
|
133
|
-
.filter((column) => column && !!column.width) // if width is 0, we dont want to apply that.
|
|
134
|
-
.forEach((column, i) => {
|
|
135
|
-
const fixedColWidth = getColWidthFix(column.width, columnsCount ?? 0);
|
|
136
|
-
const scaledWidth = fixedColWidth * (scalePercent || 1);
|
|
137
|
-
const finalWidth = Math.max(scaledWidth, tableCellMinWidth);
|
|
138
|
-
// we aren't handling the remaining pixels here when the 48px min width is reached
|
|
139
|
-
if (cols?.[i]) {
|
|
140
|
-
cols[i].style.width = `${finalWidth}px`;
|
|
141
|
-
}
|
|
142
|
-
});
|
|
143
|
-
} else {
|
|
144
|
-
state.cols
|
|
145
|
-
.filter((column) => column && !!column.width) // if width is 0, we dont want to apply that.
|
|
146
|
-
.forEach((column, i) => {
|
|
147
|
-
if (cols?.[i]) {
|
|
148
|
-
cols[i].style.width = `${getColWidthFix(column.width, columnsCount ?? 0)}px`;
|
|
149
|
-
}
|
|
150
|
-
});
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
// colgroup has updated, reflect new widths in sticky header
|
|
154
|
-
syncStickyRowToTable(tableRef);
|
|
155
|
-
};
|
|
156
|
-
|
|
157
|
-
export const getTotalWidth = ({ cols }: ResizeState): number => {
|
|
158
|
-
return cols.reduce((totalWidth, col) => totalWidth + col.width, 0);
|
|
159
|
-
};
|
|
160
|
-
|
|
161
|
-
// adjust columns to take up the total width
|
|
162
|
-
// difference in total columns widths vs table width happens due to the "Math.floor"
|
|
163
|
-
export const adjustColumnsWidths = (resizeState: ResizeState, maxSize: number): ResizeState => {
|
|
164
|
-
const totalWidth = getTotalWidth(resizeState);
|
|
165
|
-
const diff = maxSize - totalWidth;
|
|
166
|
-
if (diff > 0 || (diff < 0 && Math.abs(diff) < tableCellMinWidth)) {
|
|
167
|
-
let updated = false;
|
|
168
|
-
return {
|
|
169
|
-
...resizeState,
|
|
170
|
-
cols: resizeState.cols.map((col) => {
|
|
171
|
-
if (!updated && col.width + diff > col.minWidth) {
|
|
172
|
-
updated = true;
|
|
173
|
-
return { ...col, width: col.width + diff };
|
|
174
|
-
}
|
|
175
|
-
return col;
|
|
176
|
-
}),
|
|
177
|
-
};
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
return resizeState;
|
|
181
|
-
};
|
|
182
|
-
|
|
183
|
-
export const evenAllColumnsWidths = (resizeState: ResizeState): ResizeState => {
|
|
184
|
-
const maxSize = getTotalWidth(resizeState);
|
|
185
|
-
const evenWidth = Math.floor(maxSize / resizeState.cols.length);
|
|
186
|
-
const cols = resizeState.cols.map((col) => ({ ...col, width: evenWidth }));
|
|
187
|
-
|
|
188
|
-
return adjustColumnsWidths({ ...resizeState, cols }, maxSize);
|
|
189
|
-
};
|
|
190
|
-
|
|
191
|
-
const getSpace = (columns: ColumnState[], start: number, end: number) =>
|
|
192
|
-
columns
|
|
193
|
-
.slice(start, end)
|
|
194
|
-
.map((col) => col.width)
|
|
195
|
-
.reduce((sum, width) => sum + width, 0);
|
|
196
|
-
|
|
197
|
-
const evenSelectedColumnsWidths = (resizeState: ResizeState, rect: Rect): ResizeState => {
|
|
198
|
-
const cols = resizeState.cols;
|
|
199
|
-
const selectedSpace = getSpace(cols, rect.left, rect.right);
|
|
200
|
-
const allSpace = getSpace(cols, 0, cols.length);
|
|
201
|
-
|
|
202
|
-
const allWidth = allSpace / cols.length;
|
|
203
|
-
const width = selectedSpace / (rect.right - rect.left);
|
|
204
|
-
|
|
205
|
-
// Result equals even distribution of all columns -
|
|
206
|
-
// unset widths of all columns
|
|
207
|
-
if (allWidth === width) {
|
|
208
|
-
return {
|
|
209
|
-
...resizeState,
|
|
210
|
-
widths: cols.map(() => width),
|
|
211
|
-
cols: resizeState.cols.map((col) => ({
|
|
212
|
-
...col,
|
|
213
|
-
width: 0,
|
|
214
|
-
})),
|
|
215
|
-
};
|
|
216
|
-
}
|
|
217
|
-
|
|
218
|
-
return {
|
|
219
|
-
...resizeState,
|
|
220
|
-
widths: cols.map((col, i) => (i >= rect.left && i < rect.right ? width : col.width)),
|
|
221
|
-
cols: cols.map((col, i) => ({
|
|
222
|
-
...col,
|
|
223
|
-
width: i >= rect.left && i < rect.right ? width : col.width,
|
|
224
|
-
})),
|
|
225
|
-
};
|
|
226
|
-
};
|
|
227
|
-
|
|
228
|
-
export const bulkColumnsResize = (
|
|
229
|
-
resizeState: ResizeState,
|
|
230
|
-
columnsIndexes: number[],
|
|
231
|
-
sourceColumnIndex: number,
|
|
232
|
-
) => {
|
|
233
|
-
const currentTableWidth = getTotalWidth(resizeState);
|
|
234
|
-
const colIndex =
|
|
235
|
-
columnsIndexes.indexOf(sourceColumnIndex) > -1 ? sourceColumnIndex : sourceColumnIndex + 1;
|
|
236
|
-
const sourceCol = resizeState.cols[colIndex];
|
|
237
|
-
const seenColumns: {
|
|
238
|
-
[key: number]: { width: number; minWidth: number; index: number };
|
|
239
|
-
} = {};
|
|
240
|
-
const widthsDiffs: number[] = [];
|
|
241
|
-
const cols = resizeState.cols.map((col) => {
|
|
242
|
-
if (columnsIndexes.indexOf(col.index) > -1) {
|
|
243
|
-
const diff = col.width - sourceCol.width;
|
|
244
|
-
if (diff !== 0) {
|
|
245
|
-
widthsDiffs.push(diff);
|
|
246
|
-
}
|
|
247
|
-
return { ...col, width: sourceCol.width };
|
|
248
|
-
}
|
|
249
|
-
return col;
|
|
250
|
-
});
|
|
251
|
-
|
|
252
|
-
let newState = {
|
|
253
|
-
...resizeState,
|
|
254
|
-
cols: cols.map((col) => {
|
|
255
|
-
if (
|
|
256
|
-
columnsIndexes.indexOf(col.index) > -1 ||
|
|
257
|
-
// take from prev columns only if dragging the first handle to the left
|
|
258
|
-
(columnsIndexes.indexOf(sourceColumnIndex) > -1 && col.index < colIndex)
|
|
259
|
-
) {
|
|
260
|
-
return col;
|
|
261
|
-
}
|
|
262
|
-
while (widthsDiffs.length) {
|
|
263
|
-
const diff = widthsDiffs.shift() || 0;
|
|
264
|
-
const column = seenColumns[col.index] || col;
|
|
265
|
-
const maybeWidth = column.width + diff;
|
|
266
|
-
|
|
267
|
-
if (maybeWidth > column.minWidth) {
|
|
268
|
-
seenColumns[column.index] = { ...column, width: maybeWidth };
|
|
269
|
-
} else {
|
|
270
|
-
widthsDiffs.push(maybeWidth - column.minWidth);
|
|
271
|
-
seenColumns[column.index] = { ...column, width: column.minWidth };
|
|
272
|
-
break;
|
|
273
|
-
}
|
|
274
|
-
}
|
|
275
|
-
return seenColumns[col.index] || col;
|
|
276
|
-
}),
|
|
277
|
-
};
|
|
278
|
-
|
|
279
|
-
// minimum possible table widths at the current layout
|
|
280
|
-
const minTableWidth = resizeState.maxSize;
|
|
281
|
-
// new table widths after bulk resize
|
|
282
|
-
const newTotalWidth = getTotalWidth(newState);
|
|
283
|
-
// when all columns are selected, what do we do when sum of columns widths is lower than min possible table widths?
|
|
284
|
-
if (columnsIndexes.length === resizeState.cols.length && newTotalWidth < minTableWidth) {
|
|
285
|
-
// table is not in overflow -> normal resize of a single column
|
|
286
|
-
if (currentTableWidth === minTableWidth) {
|
|
287
|
-
return resizeState;
|
|
288
|
-
}
|
|
289
|
-
// table is in overflow: keep the dragged column at its widths and evenly distribute columns
|
|
290
|
-
// to recover from overflow state
|
|
291
|
-
else {
|
|
292
|
-
const columnWidth = Math.floor(
|
|
293
|
-
(minTableWidth - sourceCol.width) / (newState.cols.length - 1),
|
|
294
|
-
);
|
|
295
|
-
newState = {
|
|
296
|
-
...resizeState,
|
|
297
|
-
cols: newState.cols.map((col) => {
|
|
298
|
-
if (col.index === sourceCol.index) {
|
|
299
|
-
return col;
|
|
300
|
-
}
|
|
301
|
-
|
|
302
|
-
return { ...col, width: columnWidth };
|
|
303
|
-
}),
|
|
304
|
-
};
|
|
305
|
-
}
|
|
306
|
-
}
|
|
307
|
-
|
|
308
|
-
// fixes total table widths by adding missing pixels to columns widths here and there
|
|
309
|
-
return adjustColumnsWidths(newState, resizeState.maxSize);
|
|
310
|
-
};
|
|
311
|
-
|
|
312
|
-
// Get the layout
|
|
313
|
-
const normaliseTableLayout = (input: string | undefined | null) => {
|
|
314
|
-
switch (input) {
|
|
315
|
-
case 'wide':
|
|
316
|
-
return input;
|
|
317
|
-
case 'full-width':
|
|
318
|
-
return input;
|
|
319
|
-
default:
|
|
320
|
-
return 'default';
|
|
321
|
-
}
|
|
322
|
-
};
|
|
323
|
-
|
|
324
|
-
export const getNewResizeStateFromSelectedColumns = (
|
|
325
|
-
rect: Rect,
|
|
326
|
-
state: EditorState,
|
|
327
|
-
domAtPos: (pos: number) => { node: Node; offset: number },
|
|
328
|
-
getEditorContainerWidth: GetEditorContainerWidth,
|
|
329
|
-
isTableScalingEnabled = false,
|
|
330
|
-
isTableFixedColumnWidthsOptionEnabled = false,
|
|
331
|
-
isCommentEditor = false,
|
|
332
|
-
): ResizeStateWithAnalytics | undefined => {
|
|
333
|
-
// Fail early so that we don't do complex calculations for no reason
|
|
334
|
-
const numColumnsSelected = rect.right - rect.left;
|
|
335
|
-
if (numColumnsSelected <= 1) {
|
|
336
|
-
return;
|
|
337
|
-
}
|
|
338
|
-
|
|
339
|
-
const { totalRowCount, totalColumnCount, table } = getSelectedTableInfo(state.selection);
|
|
340
|
-
|
|
341
|
-
if (!table) {
|
|
342
|
-
return;
|
|
343
|
-
}
|
|
344
|
-
|
|
345
|
-
// Fail early so that we don't do complex calculations for no reason
|
|
346
|
-
if (!hasTableBeenResized(table.node)) {
|
|
347
|
-
return;
|
|
348
|
-
}
|
|
349
|
-
|
|
350
|
-
const maybeTable = domAtPos(table.start).node;
|
|
351
|
-
|
|
352
|
-
const maybeTableElement = maybeTable instanceof HTMLElement ? maybeTable : null;
|
|
353
|
-
const tableRef = maybeTableElement?.closest('table');
|
|
354
|
-
|
|
355
|
-
if (!tableRef) {
|
|
356
|
-
return;
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
const layout = normaliseTableLayout(tableRef?.dataset.layout);
|
|
360
|
-
|
|
361
|
-
const maxSize = getTableMaxWidth({
|
|
362
|
-
table: table.node,
|
|
363
|
-
tableStart: table.start,
|
|
364
|
-
state,
|
|
365
|
-
layout,
|
|
366
|
-
getEditorContainerWidth,
|
|
367
|
-
});
|
|
368
|
-
|
|
369
|
-
let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
|
|
370
|
-
const isTableScalingWithFixedColumnWidthsOptionEnabled =
|
|
371
|
-
isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled;
|
|
372
|
-
if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
|
|
373
|
-
isTableScalingEnabledOnCurrentTable = table.node.attrs.displayMode !== 'fixed';
|
|
374
|
-
}
|
|
375
|
-
|
|
376
|
-
let shouldUseIncreasedScalingPercent = isTableScalingWithFixedColumnWidthsOptionEnabled;
|
|
377
|
-
|
|
378
|
-
if (isTableScalingEnabled && isCommentEditor) {
|
|
379
|
-
isTableScalingEnabledOnCurrentTable = true;
|
|
380
|
-
shouldUseIncreasedScalingPercent = true;
|
|
381
|
-
}
|
|
382
|
-
|
|
383
|
-
const resizeState = getResizeState({
|
|
384
|
-
minWidth: tableCellMinWidth,
|
|
385
|
-
maxSize,
|
|
386
|
-
table: table.node,
|
|
387
|
-
tableRef,
|
|
388
|
-
start: table.start,
|
|
389
|
-
domAtPos,
|
|
390
|
-
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
|
|
391
|
-
shouldUseIncreasedScalingPercent,
|
|
392
|
-
isCommentEditor,
|
|
393
|
-
});
|
|
394
|
-
|
|
395
|
-
const newResizeState = evenSelectedColumnsWidths(resizeState, rect);
|
|
396
|
-
|
|
397
|
-
const widthsBefore = resizeState.widths;
|
|
398
|
-
const widthsAfter = newResizeState.widths;
|
|
399
|
-
|
|
400
|
-
const changed = resizeState.widths.some(
|
|
401
|
-
(widthBefore, index) => widthBefore !== widthsAfter[index],
|
|
402
|
-
);
|
|
403
|
-
|
|
404
|
-
return {
|
|
405
|
-
resizeState: newResizeState,
|
|
406
|
-
table,
|
|
407
|
-
changed,
|
|
408
|
-
attributes: {
|
|
409
|
-
position: rect.left,
|
|
410
|
-
count: rect.right - rect.left,
|
|
411
|
-
totalRowCount,
|
|
412
|
-
totalColumnCount,
|
|
413
|
-
widthsBefore,
|
|
414
|
-
widthsAfter,
|
|
415
|
-
},
|
|
416
|
-
};
|
|
417
|
-
};
|
|
@@ -1,290 +0,0 @@
|
|
|
1
|
-
import { getTableContainerWidth } from '@atlaskit/editor-common/node-width';
|
|
2
|
-
import { tableCellMinWidth } from '@atlaskit/editor-common/styles';
|
|
3
|
-
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
|
|
4
|
-
import type { Transaction } from '@atlaskit/editor-prosemirror/state';
|
|
5
|
-
import type { DomAtPos } from '@atlaskit/editor-prosemirror/utils';
|
|
6
|
-
import { akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
-
|
|
9
|
-
import type { PluginInjectionAPI } from '../../../types';
|
|
10
|
-
import { updateColumnWidths } from '../../transforms/column-width';
|
|
11
|
-
import { getTableWidth } from '../../utils/nodes';
|
|
12
|
-
import { getLayoutSize } from '../utils/misc';
|
|
13
|
-
import { reduceSpace } from '../utils/resize-logic';
|
|
14
|
-
import {
|
|
15
|
-
adjustColumnsWidths,
|
|
16
|
-
getResizeState,
|
|
17
|
-
getTotalWidth,
|
|
18
|
-
updateColgroup,
|
|
19
|
-
} from '../utils/resize-state';
|
|
20
|
-
import type { ResizeState } from '../utils/types';
|
|
21
|
-
|
|
22
|
-
import { hasTableBeenResized, insertColgroupFromNode } from './colgroup';
|
|
23
|
-
import { syncStickyRowToTable } from './dom';
|
|
24
|
-
|
|
25
|
-
interface ScaleOptions {
|
|
26
|
-
node: PMNode;
|
|
27
|
-
prevNode: PMNode;
|
|
28
|
-
start: number;
|
|
29
|
-
containerWidth?: number;
|
|
30
|
-
previousContainerWidth?: number;
|
|
31
|
-
parentWidth?: number;
|
|
32
|
-
layoutChanged?: boolean;
|
|
33
|
-
isFullWidthModeEnabled?: boolean;
|
|
34
|
-
isTableResizingEnabled?: boolean;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
// Base function to trigger the actual scale on a table node.
|
|
38
|
-
// Will only resize/scale if a table has been previously resized.
|
|
39
|
-
const scale = (
|
|
40
|
-
tableRef: HTMLTableElement,
|
|
41
|
-
options: ScaleOptions,
|
|
42
|
-
domAtPos: DomAtPos,
|
|
43
|
-
isTableScalingEnabledOnCurrentTable = false,
|
|
44
|
-
shouldUseIncreasedScalingPercent = false,
|
|
45
|
-
isCommentEditor = false,
|
|
46
|
-
): ResizeState | undefined => {
|
|
47
|
-
const {
|
|
48
|
-
node,
|
|
49
|
-
containerWidth,
|
|
50
|
-
previousContainerWidth,
|
|
51
|
-
prevNode,
|
|
52
|
-
start,
|
|
53
|
-
layoutChanged,
|
|
54
|
-
isTableResizingEnabled,
|
|
55
|
-
} = options;
|
|
56
|
-
|
|
57
|
-
const maxSize = isTableResizingEnabled
|
|
58
|
-
? getTableContainerWidth(node)
|
|
59
|
-
: getLayoutSize(node.attrs.layout, containerWidth, {});
|
|
60
|
-
|
|
61
|
-
const prevTableWidth = getTableWidth(prevNode);
|
|
62
|
-
const previousMaxSize = isTableResizingEnabled
|
|
63
|
-
? getTableContainerWidth(node)
|
|
64
|
-
: getLayoutSize(prevNode.attrs.layout, previousContainerWidth, {});
|
|
65
|
-
|
|
66
|
-
let newWidth = maxSize;
|
|
67
|
-
|
|
68
|
-
// adjust table width if layout is updated
|
|
69
|
-
const hasOverflow = prevTableWidth > previousMaxSize;
|
|
70
|
-
|
|
71
|
-
if (layoutChanged && hasOverflow) {
|
|
72
|
-
// No keep overflow if the old content can be in the new size
|
|
73
|
-
const canFitInNewSize = prevTableWidth < maxSize;
|
|
74
|
-
if (canFitInNewSize) {
|
|
75
|
-
newWidth = maxSize;
|
|
76
|
-
} else {
|
|
77
|
-
// Keep the same scale.
|
|
78
|
-
const overflowScale = prevTableWidth / previousMaxSize;
|
|
79
|
-
newWidth = Math.floor(newWidth * overflowScale);
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
if (node.attrs.isNumberColumnEnabled) {
|
|
84
|
-
newWidth -= akEditorTableNumberColumnWidth;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
const resizeState = getResizeState({
|
|
88
|
-
minWidth: tableCellMinWidth,
|
|
89
|
-
maxSize,
|
|
90
|
-
table: node,
|
|
91
|
-
tableRef,
|
|
92
|
-
start,
|
|
93
|
-
domAtPos,
|
|
94
|
-
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
|
|
95
|
-
shouldUseIncreasedScalingPercent,
|
|
96
|
-
isCommentEditor,
|
|
97
|
-
});
|
|
98
|
-
|
|
99
|
-
return scaleTableTo(resizeState, newWidth);
|
|
100
|
-
};
|
|
101
|
-
|
|
102
|
-
const scaleWithParent = (
|
|
103
|
-
tableRef: HTMLTableElement,
|
|
104
|
-
parentWidth: number,
|
|
105
|
-
table: PMNode,
|
|
106
|
-
start: number,
|
|
107
|
-
domAtPos: DomAtPos,
|
|
108
|
-
isTableScalingEnabledOnCurrentTable = false,
|
|
109
|
-
shouldUseIncreasedScalingPercent = false,
|
|
110
|
-
isCommentEditor = false,
|
|
111
|
-
) => {
|
|
112
|
-
const resizeState = getResizeState({
|
|
113
|
-
minWidth: tableCellMinWidth,
|
|
114
|
-
maxSize: parentWidth,
|
|
115
|
-
table,
|
|
116
|
-
tableRef,
|
|
117
|
-
start,
|
|
118
|
-
domAtPos,
|
|
119
|
-
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
|
|
120
|
-
shouldUseIncreasedScalingPercent,
|
|
121
|
-
isCommentEditor,
|
|
122
|
-
});
|
|
123
|
-
|
|
124
|
-
if (table.attrs.isNumberColumnEnabled) {
|
|
125
|
-
parentWidth -= akEditorTableNumberColumnWidth;
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
return scaleTableTo(resizeState, Math.floor(parentWidth));
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
// Scales the table to a given size and updates its colgroup DOM node
|
|
132
|
-
export function scaleTableTo(state: ResizeState, maxSize: number): ResizeState {
|
|
133
|
-
const scaleFactor = maxSize / getTotalWidth(state);
|
|
134
|
-
|
|
135
|
-
let newState = {
|
|
136
|
-
...state,
|
|
137
|
-
maxSize,
|
|
138
|
-
cols: state.cols.map((col) => {
|
|
139
|
-
const { minWidth, width } = col;
|
|
140
|
-
let newColWidth = Math.floor(width * scaleFactor);
|
|
141
|
-
if (newColWidth < minWidth) {
|
|
142
|
-
newColWidth = minWidth;
|
|
143
|
-
}
|
|
144
|
-
return { ...col, width: newColWidth };
|
|
145
|
-
}),
|
|
146
|
-
};
|
|
147
|
-
|
|
148
|
-
const newTotalWidth = getTotalWidth(newState);
|
|
149
|
-
if (newTotalWidth > maxSize) {
|
|
150
|
-
newState = reduceSpace(newState, newTotalWidth - maxSize);
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
return adjustColumnsWidths(newState, maxSize);
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
export const previewScaleTable = (
|
|
157
|
-
tableRef: HTMLTableElement | null | undefined,
|
|
158
|
-
options: ScaleOptions,
|
|
159
|
-
domAtPos: DomAtPos,
|
|
160
|
-
isTableScalingEnabled: boolean = false,
|
|
161
|
-
isTableWithFixedColumnWidthsOptionEnabled: boolean = false,
|
|
162
|
-
isCommentEditor: boolean = false,
|
|
163
|
-
) => {
|
|
164
|
-
const { node, start, parentWidth } = options;
|
|
165
|
-
|
|
166
|
-
if (!tableRef) {
|
|
167
|
-
return;
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
if (parentWidth) {
|
|
171
|
-
const isNumberColumnEnabled = node.attrs.isNumberColumnEnabled;
|
|
172
|
-
const width = isNumberColumnEnabled
|
|
173
|
-
? parentWidth - akEditorTableNumberColumnWidth
|
|
174
|
-
: parentWidth;
|
|
175
|
-
tableRef.style.width = `${width}px`;
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
let isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
|
|
179
|
-
const isTableScalingWithFixedColumnWidthsOptionEnabled =
|
|
180
|
-
isTableScalingEnabled && isTableWithFixedColumnWidthsOptionEnabled;
|
|
181
|
-
|
|
182
|
-
if (isTableScalingWithFixedColumnWidthsOptionEnabled) {
|
|
183
|
-
isTableScalingEnabledOnCurrentTable =
|
|
184
|
-
isTableScalingEnabled && node.attrs.displayMode !== 'fixed';
|
|
185
|
-
}
|
|
186
|
-
// If the table hasn't been resize, the colgroup 48px width values will gracefully scale down.
|
|
187
|
-
// If we are scaling the table down with isTableScalingEnabled, the colgroup widths may be scaled to a value that is not 48px.
|
|
188
|
-
if (!hasTableBeenResized(node) && !isTableScalingEnabledOnCurrentTable) {
|
|
189
|
-
syncStickyRowToTable(tableRef);
|
|
190
|
-
return;
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
const shouldUseIncreasedScalingPercent =
|
|
194
|
-
isTableScalingWithFixedColumnWidthsOptionEnabled || (isTableScalingEnabled && isCommentEditor);
|
|
195
|
-
|
|
196
|
-
const resizeState = parentWidth
|
|
197
|
-
? scaleWithParent(
|
|
198
|
-
tableRef,
|
|
199
|
-
parentWidth,
|
|
200
|
-
node,
|
|
201
|
-
start,
|
|
202
|
-
domAtPos,
|
|
203
|
-
false, // Here isTableScalingEnabled = false
|
|
204
|
-
shouldUseIncreasedScalingPercent,
|
|
205
|
-
)
|
|
206
|
-
: scale(tableRef, options, domAtPos, false, shouldUseIncreasedScalingPercent);
|
|
207
|
-
|
|
208
|
-
if (resizeState) {
|
|
209
|
-
updateColgroup(resizeState, tableRef, node, false, 1);
|
|
210
|
-
}
|
|
211
|
-
};
|
|
212
|
-
|
|
213
|
-
// Scale the table to meet new requirements (col, layout change etc)
|
|
214
|
-
export const scaleTable =
|
|
215
|
-
(
|
|
216
|
-
tableRef: HTMLTableElement | null | undefined,
|
|
217
|
-
options: ScaleOptions,
|
|
218
|
-
domAtPos: DomAtPos,
|
|
219
|
-
api: PluginInjectionAPI | undefined | null,
|
|
220
|
-
isTableScalingEnabledOnCurrentTable = false,
|
|
221
|
-
shouldUseIncreasedScalingPercent = false,
|
|
222
|
-
isCommentEditor = false,
|
|
223
|
-
) =>
|
|
224
|
-
(tr: Transaction) => {
|
|
225
|
-
if (!tableRef) {
|
|
226
|
-
return tr;
|
|
227
|
-
}
|
|
228
|
-
const { node, start, parentWidth, layoutChanged } = options;
|
|
229
|
-
// If a table has not been resized yet, columns should be auto.
|
|
230
|
-
if (hasTableBeenResized(node) === false) {
|
|
231
|
-
// If its not a re-sized table, we still want to re-create cols
|
|
232
|
-
// To force reflow of columns upon delete.
|
|
233
|
-
if (!isTableScalingEnabledOnCurrentTable) {
|
|
234
|
-
const isTableScalingEnabled = false;
|
|
235
|
-
insertColgroupFromNode(
|
|
236
|
-
tableRef,
|
|
237
|
-
node,
|
|
238
|
-
isTableScalingEnabled,
|
|
239
|
-
undefined,
|
|
240
|
-
shouldUseIncreasedScalingPercent,
|
|
241
|
-
isCommentEditor,
|
|
242
|
-
);
|
|
243
|
-
}
|
|
244
|
-
tr.setMeta('scrollIntoView', false);
|
|
245
|
-
return tr;
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
let resizeState;
|
|
249
|
-
if (parentWidth) {
|
|
250
|
-
resizeState = scaleWithParent(
|
|
251
|
-
tableRef,
|
|
252
|
-
parentWidth,
|
|
253
|
-
node,
|
|
254
|
-
start,
|
|
255
|
-
domAtPos,
|
|
256
|
-
isTableScalingEnabledOnCurrentTable,
|
|
257
|
-
shouldUseIncreasedScalingPercent,
|
|
258
|
-
);
|
|
259
|
-
} else {
|
|
260
|
-
resizeState = scale(
|
|
261
|
-
tableRef,
|
|
262
|
-
options,
|
|
263
|
-
domAtPos,
|
|
264
|
-
isTableScalingEnabledOnCurrentTable,
|
|
265
|
-
shouldUseIncreasedScalingPercent,
|
|
266
|
-
);
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
if (resizeState) {
|
|
270
|
-
tr = updateColumnWidths(resizeState, node, start, api)(tr);
|
|
271
|
-
|
|
272
|
-
if (!fg('platform_editor_fix_table_resizing_undo')) {
|
|
273
|
-
tr.setMeta('addToHistory', false);
|
|
274
|
-
}
|
|
275
|
-
|
|
276
|
-
if (tr.docChanged) {
|
|
277
|
-
tr.setMeta('scrollIntoView', false);
|
|
278
|
-
// TODO: ED-8995 - We need to do this check to reduce the number of race conditions when working with tables.
|
|
279
|
-
// This metadata is been used in the sendTransaction function in the Collab plugin
|
|
280
|
-
/* Added !layoutChanged check here to solve unnecessary scroll bar after publish when click on breakout button multiple times and publish
|
|
281
|
-
scaleTable is only called once every time a breakout button is clicked, so it is safe not to add the meta 'scaleTable' to the tr.
|
|
282
|
-
Leaving the tr.setMeta('scaleTable', true) here for race conditions that we aren't aware of.
|
|
283
|
-
*/
|
|
284
|
-
!layoutChanged && tr.setMeta('scaleTable', true);
|
|
285
|
-
return tr;
|
|
286
|
-
}
|
|
287
|
-
}
|
|
288
|
-
|
|
289
|
-
return tr;
|
|
290
|
-
};
|