@atlaskit/editor-plugin-table 7.16.14 → 7.16.16
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 +16 -0
- package/dist/cjs/commands/column-resize.js +6 -3
- package/dist/cjs/commands/delete.js +2 -1
- package/dist/cjs/commands/insert.js +8 -5
- package/dist/cjs/commands-with-analytics.js +6 -4
- package/dist/cjs/event-handlers.js +2 -1
- package/dist/cjs/nodeviews/TableComponent.js +21 -10
- package/dist/cjs/nodeviews/TableContainer.js +7 -3
- package/dist/cjs/nodeviews/TableResizer.js +3 -2
- package/dist/cjs/plugin.js +4 -3
- package/dist/cjs/pm-plugins/drag-and-drop/plugin.js +4 -2
- package/dist/cjs/pm-plugins/keymap.js +5 -4
- package/dist/cjs/pm-plugins/main.js +2 -2
- package/dist/cjs/pm-plugins/table-resizing/event-handlers.js +12 -7
- package/dist/cjs/pm-plugins/table-resizing/utils/colgroup.js +6 -5
- package/dist/cjs/pm-plugins/table-resizing/utils/consts.js +2 -1
- package/dist/cjs/pm-plugins/table-resizing/utils/index.js +6 -0
- package/dist/cjs/pm-plugins/table-resizing/utils/misc.js +6 -4
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-column.js +5 -3
- package/dist/cjs/pm-plugins/table-resizing/utils/resize-state.js +13 -8
- package/dist/cjs/pm-plugins/table-resizing/utils/scale-table.js +17 -9
- package/dist/cjs/toolbar.js +7 -4
- package/dist/cjs/transforms/column-width.js +3 -1
- package/dist/cjs/transforms/delete-columns.js +2 -1
- package/dist/cjs/ui/FloatingContextualMenu/ContextualMenu.js +4 -2
- package/dist/cjs/ui/FloatingDragMenu/DragMenu.js +3 -2
- package/dist/cjs/ui/FloatingDragMenu/index.js +4 -1
- package/dist/cjs/ui/FloatingInsertButton/index.js +3 -1
- package/dist/cjs/ui/TableFloatingControls/index.js +2 -2
- package/dist/cjs/utils/drag-menu.js +2 -1
- package/dist/es2019/commands/column-resize.js +6 -3
- package/dist/es2019/commands/delete.js +2 -2
- package/dist/es2019/commands/insert.js +8 -8
- package/dist/es2019/commands-with-analytics.js +6 -6
- package/dist/es2019/event-handlers.js +2 -2
- package/dist/es2019/nodeviews/TableComponent.js +21 -10
- package/dist/es2019/nodeviews/TableContainer.js +7 -3
- package/dist/es2019/nodeviews/TableResizer.js +3 -2
- package/dist/es2019/plugin.js +4 -3
- package/dist/es2019/pm-plugins/drag-and-drop/plugin.js +4 -2
- package/dist/es2019/pm-plugins/keymap.js +5 -5
- package/dist/es2019/pm-plugins/main.js +2 -2
- package/dist/es2019/pm-plugins/table-resizing/event-handlers.js +12 -7
- package/dist/es2019/pm-plugins/table-resizing/utils/colgroup.js +6 -6
- package/dist/es2019/pm-plugins/table-resizing/utils/consts.js +1 -0
- package/dist/es2019/pm-plugins/table-resizing/utils/index.js +1 -1
- package/dist/es2019/pm-plugins/table-resizing/utils/misc.js +7 -5
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-column.js +5 -5
- package/dist/es2019/pm-plugins/table-resizing/utils/resize-state.js +12 -8
- package/dist/es2019/pm-plugins/table-resizing/utils/scale-table.js +17 -12
- package/dist/es2019/toolbar.js +7 -7
- package/dist/es2019/transforms/column-width.js +3 -2
- package/dist/es2019/transforms/delete-columns.js +2 -2
- package/dist/es2019/ui/FloatingContextualMenu/ContextualMenu.js +4 -2
- package/dist/es2019/ui/FloatingDragMenu/DragMenu.js +3 -2
- package/dist/es2019/ui/FloatingDragMenu/index.js +4 -1
- package/dist/es2019/ui/FloatingInsertButton/index.js +3 -1
- package/dist/es2019/ui/TableFloatingControls/index.js +2 -2
- package/dist/es2019/utils/drag-menu.js +2 -2
- package/dist/esm/commands/column-resize.js +6 -3
- package/dist/esm/commands/delete.js +2 -1
- package/dist/esm/commands/insert.js +8 -5
- package/dist/esm/commands-with-analytics.js +6 -4
- package/dist/esm/event-handlers.js +2 -1
- package/dist/esm/nodeviews/TableComponent.js +21 -10
- package/dist/esm/nodeviews/TableContainer.js +7 -3
- package/dist/esm/nodeviews/TableResizer.js +3 -2
- package/dist/esm/plugin.js +4 -3
- package/dist/esm/pm-plugins/drag-and-drop/plugin.js +4 -2
- package/dist/esm/pm-plugins/keymap.js +5 -4
- package/dist/esm/pm-plugins/main.js +2 -2
- package/dist/esm/pm-plugins/table-resizing/event-handlers.js +12 -7
- package/dist/esm/pm-plugins/table-resizing/utils/colgroup.js +6 -5
- package/dist/esm/pm-plugins/table-resizing/utils/consts.js +1 -0
- package/dist/esm/pm-plugins/table-resizing/utils/index.js +1 -1
- package/dist/esm/pm-plugins/table-resizing/utils/misc.js +7 -5
- package/dist/esm/pm-plugins/table-resizing/utils/resize-column.js +5 -3
- package/dist/esm/pm-plugins/table-resizing/utils/resize-state.js +13 -8
- package/dist/esm/pm-plugins/table-resizing/utils/scale-table.js +17 -9
- package/dist/esm/toolbar.js +7 -4
- package/dist/esm/transforms/column-width.js +3 -1
- package/dist/esm/transforms/delete-columns.js +2 -1
- package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js +4 -2
- package/dist/esm/ui/FloatingDragMenu/DragMenu.js +3 -2
- package/dist/esm/ui/FloatingDragMenu/index.js +4 -1
- package/dist/esm/ui/FloatingInsertButton/index.js +3 -1
- package/dist/esm/ui/TableFloatingControls/index.js +2 -2
- package/dist/esm/utils/drag-menu.js +2 -1
- package/dist/types/commands/delete.d.ts +1 -1
- package/dist/types/commands/insert.d.ts +4 -4
- package/dist/types/commands-with-analytics.d.ts +3 -3
- package/dist/types/event-handlers.d.ts +1 -1
- package/dist/types/nodeviews/TableContainer.d.ts +4 -2
- package/dist/types/nodeviews/TableResizer.d.ts +2 -1
- package/dist/types/pm-plugins/keymap.d.ts +1 -1
- package/dist/types/pm-plugins/main.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/colgroup.d.ts +2 -2
- package/dist/types/pm-plugins/table-resizing/utils/consts.d.ts +1 -0
- package/dist/types/pm-plugins/table-resizing/utils/index.d.ts +1 -1
- package/dist/types/pm-plugins/table-resizing/utils/misc.d.ts +2 -2
- package/dist/types/pm-plugins/table-resizing/utils/resize-column.d.ts +2 -2
- package/dist/types/pm-plugins/table-resizing/utils/resize-state.d.ts +3 -2
- package/dist/types/pm-plugins/table-resizing/utils/scale-table.d.ts +3 -3
- package/dist/types/toolbar.d.ts +2 -2
- package/dist/types/transforms/column-width.d.ts +1 -1
- package/dist/types/transforms/delete-columns.d.ts +1 -1
- package/dist/types/ui/FloatingDragMenu/DragMenu.d.ts +2 -1
- package/dist/types/utils/drag-menu.d.ts +1 -1
- package/dist/types-ts4.5/commands/delete.d.ts +1 -1
- package/dist/types-ts4.5/commands/insert.d.ts +4 -4
- package/dist/types-ts4.5/commands-with-analytics.d.ts +3 -3
- package/dist/types-ts4.5/event-handlers.d.ts +1 -1
- package/dist/types-ts4.5/nodeviews/TableContainer.d.ts +4 -2
- package/dist/types-ts4.5/nodeviews/TableResizer.d.ts +2 -1
- package/dist/types-ts4.5/pm-plugins/keymap.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/main.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/colgroup.d.ts +2 -2
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/consts.d.ts +1 -0
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/index.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/misc.d.ts +2 -2
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/resize-column.d.ts +2 -2
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/resize-state.d.ts +3 -2
- package/dist/types-ts4.5/pm-plugins/table-resizing/utils/scale-table.d.ts +3 -3
- package/dist/types-ts4.5/toolbar.d.ts +2 -2
- package/dist/types-ts4.5/transforms/column-width.d.ts +1 -1
- package/dist/types-ts4.5/transforms/delete-columns.d.ts +1 -1
- package/dist/types-ts4.5/ui/FloatingDragMenu/DragMenu.d.ts +2 -1
- package/dist/types-ts4.5/utils/drag-menu.d.ts +1 -1
- package/package.json +8 -2
- package/src/commands/column-resize.ts +9 -3
- package/src/commands/delete.ts +2 -1
- package/src/commands/insert.ts +31 -12
- package/src/commands-with-analytics.ts +24 -8
- package/src/event-handlers.ts +2 -0
- package/src/nodeviews/TableComponent.tsx +41 -12
- package/src/nodeviews/TableContainer.tsx +6 -0
- package/src/nodeviews/TableResizer.tsx +4 -0
- package/src/plugin.tsx +9 -0
- package/src/pm-plugins/drag-and-drop/plugin.ts +13 -4
- package/src/pm-plugins/keymap.ts +17 -4
- package/src/pm-plugins/main.ts +2 -0
- package/src/pm-plugins/table-resizing/event-handlers.ts +21 -10
- package/src/pm-plugins/table-resizing/utils/colgroup.ts +14 -4
- package/src/pm-plugins/table-resizing/utils/consts.ts +1 -0
- package/src/pm-plugins/table-resizing/utils/index.ts +1 -0
- package/src/pm-plugins/table-resizing/utils/misc.ts +24 -5
- package/src/pm-plugins/table-resizing/utils/resize-column.ts +11 -4
- package/src/pm-plugins/table-resizing/utils/resize-state.ts +17 -6
- package/src/pm-plugins/table-resizing/utils/scale-table.ts +32 -9
- package/src/toolbar.tsx +15 -9
- package/src/transforms/column-width.ts +2 -1
- package/src/transforms/delete-columns.ts +11 -2
- package/src/ui/FloatingContextualMenu/ContextualMenu.tsx +12 -5
- package/src/ui/FloatingDragMenu/DragMenu.tsx +3 -0
- package/src/ui/FloatingDragMenu/index.tsx +7 -0
- package/src/ui/FloatingInsertButton/index.tsx +7 -0
- package/src/ui/TableFloatingControls/index.tsx +18 -16
- package/src/utils/drag-menu.ts +2 -0
|
@@ -158,10 +158,12 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI) {
|
|
|
158
158
|
_getTablePluginState5 = _getTablePluginState4.isTableScalingEnabled,
|
|
159
159
|
isTableScalingEnabled = _getTablePluginState5 === void 0 ? false : _getTablePluginState5;
|
|
160
160
|
var isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
|
|
161
|
-
|
|
161
|
+
var isTableScalingEnabledWithLockButton = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
|
|
162
|
+
var shouldUseIncreasedScalingPercent = isTableScalingEnabledWithLockButton && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
163
|
+
if (isTableScalingEnabledWithLockButton) {
|
|
162
164
|
isTableScalingEnabledOnCurrentTable = tableNode.attrs.displayMode !== 'fixed';
|
|
163
165
|
}
|
|
164
|
-
insertColgroupFromNode(tableRef, tableNode, isTableScalingEnabledOnCurrentTable);
|
|
166
|
+
insertColgroupFromNode(tableRef, tableNode, isTableScalingEnabledOnCurrentTable, shouldUseIncreasedScalingPercent);
|
|
165
167
|
}
|
|
166
168
|
}
|
|
167
169
|
editorView.focus();
|
|
@@ -15,6 +15,7 @@ export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAn
|
|
|
15
15
|
var isFullWidthEnabled = arguments.length > 5 ? arguments[5] : undefined;
|
|
16
16
|
var pluginInjectionApi = arguments.length > 6 ? arguments[6] : undefined;
|
|
17
17
|
var getIntl = arguments.length > 7 ? arguments[7] : undefined;
|
|
18
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 8 ? arguments[8] : undefined;
|
|
18
19
|
var list = {};
|
|
19
20
|
var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
|
|
20
21
|
bindKeymapWithCommand(nextCell.common, goToNextCell(editorAnalyticsAPI, ariaNotifyPlugin, getIntl)(1), list);
|
|
@@ -26,8 +27,8 @@ export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAn
|
|
|
26
27
|
// Add row/column shortcuts
|
|
27
28
|
bindKeymapWithCommand(addRowBefore.common, addRowAroundSelection(editorAnalyticsAPI)('TOP'), list);
|
|
28
29
|
bindKeymapWithCommand(addRowAfter.common, addRowAroundSelection(editorAnalyticsAPI)('BOTTOM'), list);
|
|
29
|
-
bindKeymapWithCommand(addColumnBefore.common, addColumnBeforeCommand(isTableScalingEnabled), list);
|
|
30
|
-
bindKeymapWithCommand(addColumnAfter.common, addColumnAfterCommand(isTableScalingEnabled), list);
|
|
30
|
+
bindKeymapWithCommand(addColumnBefore.common, addColumnBeforeCommand(isTableScalingEnabled, shouldUseIncreasedScalingPercent), list);
|
|
31
|
+
bindKeymapWithCommand(addColumnAfter.common, addColumnAfterCommand(isTableScalingEnabled, shouldUseIncreasedScalingPercent), list);
|
|
31
32
|
if (dragAndDropEnabled) {
|
|
32
33
|
// Move row/column shortcuts
|
|
33
34
|
/**
|
|
@@ -43,8 +44,8 @@ export function keymapPlugin(getEditorContainerWidth, editorAnalyticsAPI, dragAn
|
|
|
43
44
|
bindKeymapWithCommand(moveColumnRight.common, moveSourceWithAnalyticsViaShortcut(editorAnalyticsAPI)('table-column', 1), list);
|
|
44
45
|
|
|
45
46
|
// Delete row/column shortcuts
|
|
46
|
-
bindKeymapWithCommand(deleteColumn.common, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(editorAnalyticsAPI), list);
|
|
47
|
-
bindKeymapWithCommand(deleteRow.common, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(editorAnalyticsAPI), list);
|
|
47
|
+
bindKeymapWithCommand(deleteColumn.common, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(editorAnalyticsAPI, isTableScalingEnabled, shouldUseIncreasedScalingPercent), list);
|
|
48
|
+
bindKeymapWithCommand(deleteRow.common, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut(editorAnalyticsAPI, isTableScalingEnabled, shouldUseIncreasedScalingPercent), list);
|
|
48
49
|
}
|
|
49
50
|
if (getBooleanFF('platform.editor.a11y-column-resizing_emcvz')) {
|
|
50
51
|
bindKeymapWithCommand(startColumnResizing.common, initiateKeyboardColumnResizing({
|
|
@@ -25,7 +25,7 @@ import { isHeaderRowRequired } from '../utils/paste';
|
|
|
25
25
|
import { defaultHoveredCell, defaultTableSelection } from './default-table-selection';
|
|
26
26
|
import { createPluginState, getPluginState } from './plugin-factory';
|
|
27
27
|
import { pluginKey } from './plugin-key';
|
|
28
|
-
export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, isTableAlignmentEnabled) {
|
|
28
|
+
export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, tableResizingEnabled, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, isTableAlignmentEnabled, shouldUseIncreasedScalingPercent) {
|
|
29
29
|
var _accessibilityUtils;
|
|
30
30
|
var state = createPluginState(dispatch, _objectSpread(_objectSpread(_objectSpread({
|
|
31
31
|
pluginConfig: pluginConfig,
|
|
@@ -82,7 +82,7 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
|
|
|
82
82
|
}
|
|
83
83
|
if (tr) {
|
|
84
84
|
// "fixTables" removes empty rows as we don't allow that in schema
|
|
85
|
-
var updatedTr = handleCut(tr, oldState, newState, editorAnalyticsAPI, editorViewRef || undefined, isTableScalingEnabled);
|
|
85
|
+
var updatedTr = handleCut(tr, oldState, newState, editorAnalyticsAPI, editorViewRef || undefined, isTableScalingEnabled, shouldUseIncreasedScalingPercent);
|
|
86
86
|
return fixTables(updatedTr) || updatedTr;
|
|
87
87
|
}
|
|
88
88
|
if (transactions.find(function (tr) {
|
|
@@ -47,7 +47,8 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
|
|
|
47
47
|
getEditorContainerWidth: getEditorContainerWidth
|
|
48
48
|
});
|
|
49
49
|
var shouldScale = tableDepth === 0 && isTableScalingEnabled;
|
|
50
|
-
|
|
50
|
+
var isTableScalingEnabledWithLockButton = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
|
|
51
|
+
if (isTableScalingEnabledWithLockButton) {
|
|
51
52
|
shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
|
|
52
53
|
}
|
|
53
54
|
var resizeState = getResizeState({
|
|
@@ -57,7 +58,8 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
|
|
|
57
58
|
tableRef: dom,
|
|
58
59
|
start: start,
|
|
59
60
|
domAtPos: domAtPos,
|
|
60
|
-
isTableScalingEnabled: shouldScale
|
|
61
|
+
isTableScalingEnabled: shouldScale,
|
|
62
|
+
shouldUseIncreasedScalingPercent: isTableScalingEnabledWithLockButton && getBooleanFF('platform.editor.table.use-increased-scaling-percent')
|
|
61
63
|
});
|
|
62
64
|
if (evenColumns({
|
|
63
65
|
resizeState: resizeState,
|
|
@@ -132,7 +134,8 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
|
|
|
132
134
|
// only selected (or selected - 1) columns should be distributed
|
|
133
135
|
var resizingSelectedColumns = selectedColumns.indexOf(colIndex) > -1 || selectedColumns.indexOf(colIndex + 1) > -1;
|
|
134
136
|
var _shouldScale = tableDepth === 0 && isTableScalingEnabled;
|
|
135
|
-
|
|
137
|
+
var _isTableScalingEnabledWithLockButton = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
|
|
138
|
+
if (_isTableScalingEnabledWithLockButton) {
|
|
136
139
|
_shouldScale = _shouldScale && originalTable.attrs.displayMode !== 'fixed';
|
|
137
140
|
}
|
|
138
141
|
var resizedDelta = clientX - startX;
|
|
@@ -141,7 +144,7 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
|
|
|
141
144
|
tr = updateColumnWidths(newResizeState, table, start)(tr);
|
|
142
145
|
tr.setNodeAttribute(start - 1, 'width', newResizeState.tableWidth);
|
|
143
146
|
} else {
|
|
144
|
-
var _newResizeState = resizeColumn(resizeState, colIndex, clientX - startX, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, _shouldScale);
|
|
147
|
+
var _newResizeState = resizeColumn(resizeState, colIndex, clientX - startX, dom, originalTable, resizingSelectedColumns ? selectedColumns : undefined, _shouldScale, _isTableScalingEnabledWithLockButton && getBooleanFF('platform.editor.table.use-increased-scaling-percent'));
|
|
145
148
|
tr = updateColumnWidths(_newResizeState, table, start)(tr);
|
|
146
149
|
}
|
|
147
150
|
if (colIndex === map.width - 1) {
|
|
@@ -209,13 +212,15 @@ export var handleMouseDown = function handleMouseDown(view, event, localResizeHa
|
|
|
209
212
|
var map = TableMap.get(table);
|
|
210
213
|
var colIndex = map.colCount($cell.pos - $cell.start(-1)) + $cell.nodeAfter.attrs.colspan - 1;
|
|
211
214
|
var shouldScale = tableDepth === 0 && isTableScalingEnabled;
|
|
212
|
-
|
|
215
|
+
var isTableScalingEnabledWithLockButton = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
|
|
216
|
+
var shouldUseIncreasedScalingPercent = isTableScalingEnabledWithLockButton && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
217
|
+
if (isTableScalingEnabledWithLockButton) {
|
|
213
218
|
shouldScale = shouldScale && originalTable.attrs.displayMode !== 'fixed';
|
|
214
219
|
}
|
|
215
220
|
if (getBooleanFF('platform.editor.table.colum-resizing-improvements')) {
|
|
216
|
-
resizeColumnAndTable(resizeState, colIndex, clientX - dragging.startX, dom, table, undefined, shouldScale);
|
|
221
|
+
resizeColumnAndTable(resizeState, colIndex, clientX - dragging.startX, dom, table, undefined, shouldScale, undefined, shouldUseIncreasedScalingPercent);
|
|
217
222
|
} else {
|
|
218
|
-
resizeColumn(resizeState, colIndex, clientX - dragging.startX, dom, table, undefined, shouldScale);
|
|
223
|
+
resizeColumn(resizeState, colIndex, clientX - dragging.startX, dom, table, undefined, shouldScale, shouldUseIncreasedScalingPercent);
|
|
219
224
|
}
|
|
220
225
|
updateControls()(state);
|
|
221
226
|
}
|
|
@@ -13,7 +13,7 @@ import { getTableScalingPercent } from './misc';
|
|
|
13
13
|
export var getColWidthFix = function getColWidthFix(colwidth, tableColumnCount) {
|
|
14
14
|
return colwidth - 1 / tableColumnCount;
|
|
15
15
|
};
|
|
16
|
-
export var generateColgroup = function generateColgroup(table, tableRef) {
|
|
16
|
+
export var generateColgroup = function generateColgroup(table, tableRef, shouldUseIncreasedScalingPercent) {
|
|
17
17
|
var cols = [];
|
|
18
18
|
var map = TableMap.get(table);
|
|
19
19
|
table.content.firstChild.content.forEach(function (cell) {
|
|
@@ -22,7 +22,7 @@ export var generateColgroup = function generateColgroup(table, tableRef) {
|
|
|
22
22
|
// We slice here to guard against our colwidth array having more entries
|
|
23
23
|
// Than the we actually span. We'll patch the document at a later point.
|
|
24
24
|
if (tableRef) {
|
|
25
|
-
var scalePercent = getTableScalingPercent(table, tableRef);
|
|
25
|
+
var scalePercent = getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent);
|
|
26
26
|
cell.attrs.colwidth.slice(0, colspan).forEach(function (width) {
|
|
27
27
|
var fixedColWidth = getColWidthFix(width, map.width);
|
|
28
28
|
var scaledWidth = fixedColWidth * scalePercent;
|
|
@@ -56,11 +56,12 @@ export var generateColgroup = function generateColgroup(table, tableRef) {
|
|
|
56
56
|
export var insertColgroupFromNode = function insertColgroupFromNode(tableRef, table) {
|
|
57
57
|
var isTableScalingEnabled = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
58
58
|
var shouldRemove = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : true;
|
|
59
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
|
|
59
60
|
var colgroup = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelector('colgroup');
|
|
60
61
|
if (colgroup && shouldRemove) {
|
|
61
62
|
tableRef === null || tableRef === void 0 || tableRef.removeChild(colgroup);
|
|
62
63
|
}
|
|
63
|
-
colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined);
|
|
64
|
+
colgroup = renderColgroupFromNode(table, isTableScalingEnabled ? tableRef !== null && tableRef !== void 0 ? tableRef : undefined : undefined, shouldUseIncreasedScalingPercent);
|
|
64
65
|
if (shouldRemove) {
|
|
65
66
|
tableRef === null || tableRef === void 0 || tableRef.insertBefore(colgroup, tableRef === null || tableRef === void 0 ? void 0 : tableRef.firstChild);
|
|
66
67
|
}
|
|
@@ -85,8 +86,8 @@ export var isMinCellWidthTable = function isMinCellWidthTable(table) {
|
|
|
85
86
|
});
|
|
86
87
|
return isTableMinCellWidth;
|
|
87
88
|
};
|
|
88
|
-
function renderColgroupFromNode(table, maybeTableRef) {
|
|
89
|
-
var rendered = DOMSerializer.renderSpec(document, ['colgroup', {}].concat(_toConsumableArray(generateColgroup(table, maybeTableRef))));
|
|
89
|
+
function renderColgroupFromNode(table, maybeTableRef, shouldUseIncreasedScalingPercent) {
|
|
90
|
+
var rendered = DOMSerializer.renderSpec(document, ['colgroup', {}].concat(_toConsumableArray(generateColgroup(table, maybeTableRef, shouldUseIncreasedScalingPercent))));
|
|
90
91
|
return rendered.dom;
|
|
91
92
|
}
|
|
92
93
|
export var getColgroupChildrenLength = function getColgroupChildrenLength(table) {
|
|
@@ -2,5 +2,6 @@ export var COLUMN_MIN_WIDTH = 48;
|
|
|
2
2
|
export var TABLE_DEFAULT_WIDTH = 760;
|
|
3
3
|
export var TABLE_MAX_WIDTH = 1800;
|
|
4
4
|
export var MAX_SCALING_PERCENT = 0.3;
|
|
5
|
+
export var MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION = 0.4;
|
|
5
6
|
// Used to calculate the width of a table using the Editor width
|
|
6
7
|
export var TABLE_EDITOR_MARGIN = 76;
|
|
@@ -7,4 +7,4 @@ export { getLayoutSize, getDefaultLayoutMaxWidth, pointsAtCell, currentColWidth,
|
|
|
7
7
|
export { updateControls, isClickNear, getResizeCellPos } from './dom';
|
|
8
8
|
export { scale, scaleWithParent, scaleTable, previewScaleTable } from './scale-table';
|
|
9
9
|
export { resizeColumn, resizeColumnAndTable } from './resize-column';
|
|
10
|
-
export { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_DEFAULT_WIDTH, MAX_SCALING_PERCENT } from './consts';
|
|
10
|
+
export { COLUMN_MIN_WIDTH, TABLE_MAX_WIDTH, TABLE_DEFAULT_WIDTH, MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION } from './consts';
|
|
@@ -4,7 +4,7 @@ import { getBreakpoint, mapBreakpointToLayoutMaxWidth } from '@atlaskit/editor-c
|
|
|
4
4
|
import { calcTableColumnWidths, containsClassName } from '@atlaskit/editor-common/utils';
|
|
5
5
|
import { akEditorFullWidthLayoutWidth, akEditorGutterPadding, akEditorTableNumberColumnWidth } from '@atlaskit/editor-shared-styles';
|
|
6
6
|
import { hasTableBeenResized } from './colgroup';
|
|
7
|
-
import { MAX_SCALING_PERCENT } from './consts';
|
|
7
|
+
import { MAX_SCALING_PERCENT, MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION } from './consts';
|
|
8
8
|
|
|
9
9
|
// Translates named layouts in number values.
|
|
10
10
|
export function getLayoutSize(tableLayout) {
|
|
@@ -90,19 +90,21 @@ export var getTableElementWidth = function getTableElementWidth(table) {
|
|
|
90
90
|
export var getTableContainerElementWidth = function getTableContainerElementWidth(table) {
|
|
91
91
|
return getTableContainerWidth(table);
|
|
92
92
|
};
|
|
93
|
-
export var getTableScalingPercent = function getTableScalingPercent(table, tableRef) {
|
|
93
|
+
export var getTableScalingPercent = function getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent) {
|
|
94
94
|
var _tableRef$parentEleme;
|
|
95
|
+
var maxScalingPercent = shouldUseIncreasedScalingPercent ? MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION : MAX_SCALING_PERCENT;
|
|
95
96
|
var tableWidth = getTableContainerElementWidth(table);
|
|
96
97
|
var renderWidth = (tableRef === null || tableRef === void 0 || (_tableRef$parentEleme = tableRef.parentElement) === null || _tableRef$parentEleme === void 0 ? void 0 : _tableRef$parentEleme.clientWidth) || tableWidth;
|
|
97
98
|
// minus 1 here to avoid any 1px scroll in Firefox
|
|
98
99
|
var scalePercent = (renderWidth - 1) / tableWidth;
|
|
99
|
-
scalePercent = Math.max(scalePercent, 1 -
|
|
100
|
+
scalePercent = Math.max(scalePercent, 1 - maxScalingPercent);
|
|
100
101
|
return Math.min(scalePercent, 1);
|
|
101
102
|
};
|
|
102
|
-
export var getStaticTableScalingPercent = function getStaticTableScalingPercent(table, tableRenderWidth) {
|
|
103
|
+
export var getStaticTableScalingPercent = function getStaticTableScalingPercent(table, tableRenderWidth, shouldUseIncreasedScalingPercent) {
|
|
104
|
+
var maxScalingPercent = shouldUseIncreasedScalingPercent ? MAX_SCALING_PERCENT_TABLES_WITH_FIXED_COLUMN_WIDTHS_OPTION : MAX_SCALING_PERCENT;
|
|
103
105
|
var tableWidth = getTableContainerElementWidth(table);
|
|
104
106
|
// minus 1 here to avoid any 1px scroll in Firefox
|
|
105
107
|
var scalePercent = (tableRenderWidth - 1) / tableWidth;
|
|
106
|
-
scalePercent = Math.max(scalePercent, 1 -
|
|
108
|
+
scalePercent = Math.max(scalePercent, 1 - maxScalingPercent);
|
|
107
109
|
return Math.min(scalePercent, 1);
|
|
108
110
|
};
|
|
@@ -9,14 +9,15 @@ import { growColumn, shrinkColumn, updateAffectedColumn } from './resize-logic';
|
|
|
9
9
|
import { updateColgroup } from './resize-state';
|
|
10
10
|
export var resizeColumn = function resizeColumn(resizeState, colIndex, amount, tableRef, tableNode, selectedColumns) {
|
|
11
11
|
var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
12
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
|
|
12
13
|
var scalePercent = 1;
|
|
13
14
|
var resizeAmount = amount;
|
|
14
15
|
if (isTableScalingEnabled) {
|
|
15
|
-
scalePercent = getTableScalingPercent(tableNode, tableRef);
|
|
16
|
+
scalePercent = getTableScalingPercent(tableNode, tableRef, shouldUseIncreasedScalingPercent);
|
|
16
17
|
resizeAmount = amount / scalePercent;
|
|
17
18
|
}
|
|
18
19
|
var newState = resizeAmount > 0 ? growColumn(resizeState, colIndex, resizeAmount, selectedColumns) : resizeAmount < 0 ? shrinkColumn(resizeState, colIndex, resizeAmount, selectedColumns) : resizeState;
|
|
19
|
-
updateColgroup(newState, tableRef, tableNode, isTableScalingEnabled);
|
|
20
|
+
updateColgroup(newState, tableRef, tableNode, isTableScalingEnabled, shouldUseIncreasedScalingPercent);
|
|
20
21
|
return newState;
|
|
21
22
|
};
|
|
22
23
|
|
|
@@ -25,6 +26,7 @@ export var resizeColumnAndTable = function resizeColumnAndTable(resizeState, col
|
|
|
25
26
|
var _tableRef$closest;
|
|
26
27
|
var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
27
28
|
var originalTableWidth = arguments.length > 7 ? arguments[7] : undefined;
|
|
29
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
|
|
28
30
|
// TODO: can we use document state, and apply scaling factor?
|
|
29
31
|
var tableWidth = tableRef.clientWidth;
|
|
30
32
|
var tableContainerWidth = (_tableRef$closest = tableRef.closest('.pm-table-container')) === null || _tableRef$closest === void 0 ? void 0 : _tableRef$closest.clientWidth;
|
|
@@ -52,7 +54,7 @@ export var resizeColumnAndTable = function resizeColumnAndTable(resizeState, col
|
|
|
52
54
|
|
|
53
55
|
// this function only updates the colgroup in DOM, it reverses the scalePercent
|
|
54
56
|
// todo: change isScalingEnabled to true when reimplementing scaling
|
|
55
|
-
updateColgroup(newState, tableRef, tableNode, false);
|
|
57
|
+
updateColgroup(newState, tableRef, tableNode, false, shouldUseIncreasedScalingPercent);
|
|
56
58
|
|
|
57
59
|
// use the difference in width from affected column to update overall table width
|
|
58
60
|
var delta = newState.cols[colIndex].width - resizeState.cols[colIndex].width;
|
|
@@ -18,9 +18,11 @@ export var getResizeState = function getResizeState(_ref) {
|
|
|
18
18
|
start = _ref.start,
|
|
19
19
|
domAtPos = _ref.domAtPos,
|
|
20
20
|
_ref$isTableScalingEn = _ref.isTableScalingEnabled,
|
|
21
|
-
isTableScalingEnabled = _ref$isTableScalingEn === void 0 ? false : _ref$isTableScalingEn
|
|
21
|
+
isTableScalingEnabled = _ref$isTableScalingEn === void 0 ? false : _ref$isTableScalingEn,
|
|
22
|
+
_ref$shouldUseIncreas = _ref.shouldUseIncreasedScalingPercent,
|
|
23
|
+
shouldUseIncreasedScalingPercent = _ref$shouldUseIncreas === void 0 ? false : _ref$shouldUseIncreas;
|
|
22
24
|
if (isTableScalingEnabled) {
|
|
23
|
-
var scalePercent = getTableScalingPercent(table, tableRef);
|
|
25
|
+
var scalePercent = getTableScalingPercent(table, tableRef, shouldUseIncreasedScalingPercent);
|
|
24
26
|
minWidth = Math.ceil(minWidth / scalePercent);
|
|
25
27
|
}
|
|
26
28
|
// If the table has been resized, we can use the column widths from the table node
|
|
@@ -51,8 +53,9 @@ export var getResizeState = function getResizeState(_ref) {
|
|
|
51
53
|
var shouldReinsertColgroup = !isTableScalingEnabled;
|
|
52
54
|
|
|
53
55
|
// Getting the resize state from DOM
|
|
54
|
-
var colgroupChildren = insertColgroupFromNode(tableRef, table, isTableScalingEnabled, shouldReinsertColgroup
|
|
55
|
-
|
|
56
|
+
var colgroupChildren = insertColgroupFromNode(tableRef, table, isTableScalingEnabled, shouldReinsertColgroup,
|
|
57
|
+
// don't reinsert colgroup when preserving table width - this causes widths to jump
|
|
58
|
+
shouldUseIncreasedScalingPercent);
|
|
56
59
|
var cols = Array.from(colgroupChildren).map(function (_, index) {
|
|
57
60
|
// If the table hasn't been resized and we have a table width attribute, we can use it
|
|
58
61
|
// to calculate the widths of the columns
|
|
@@ -85,7 +88,7 @@ export var getResizeState = function getResizeState(_ref) {
|
|
|
85
88
|
};
|
|
86
89
|
|
|
87
90
|
// updates Colgroup DOM node with new widths
|
|
88
|
-
export var updateColgroup = function updateColgroup(state, tableRef, tableNode, isTableScalingEnabled) {
|
|
91
|
+
export var updateColgroup = function updateColgroup(state, tableRef, tableNode, isTableScalingEnabled, shouldUseIncreasedScalingPercent) {
|
|
89
92
|
var cols = tableRef === null || tableRef === void 0 ? void 0 : tableRef.querySelectorAll('col');
|
|
90
93
|
var columnsCount = cols === null || cols === void 0 ? void 0 : cols.length;
|
|
91
94
|
/**
|
|
@@ -94,7 +97,7 @@ export var updateColgroup = function updateColgroup(state, tableRef, tableNode,
|
|
|
94
97
|
We need to remove !isColumnResizing if we handled auto scale table when mouseUp event.
|
|
95
98
|
* */
|
|
96
99
|
if (isTableScalingEnabled && tableNode) {
|
|
97
|
-
var scalePercent = getTableScalingPercent(tableNode, tableRef);
|
|
100
|
+
var scalePercent = getTableScalingPercent(tableNode, tableRef, shouldUseIncreasedScalingPercent);
|
|
98
101
|
state.cols.filter(function (column) {
|
|
99
102
|
return column && !!column.width;
|
|
100
103
|
}) // if width is 0, we dont want to apply that.
|
|
@@ -328,7 +331,8 @@ export var getNewResizeStateFromSelectedColumns = function getNewResizeStateFrom
|
|
|
328
331
|
});
|
|
329
332
|
var resizeState;
|
|
330
333
|
var isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
|
|
331
|
-
|
|
334
|
+
var isTableScalingEnabledWithLockButton = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
|
|
335
|
+
if (isTableScalingEnabledWithLockButton) {
|
|
332
336
|
isTableScalingEnabledOnCurrentTable = table.node.attrs.displayMode !== 'fixed';
|
|
333
337
|
}
|
|
334
338
|
resizeState = getResizeState({
|
|
@@ -338,7 +342,8 @@ export var getNewResizeStateFromSelectedColumns = function getNewResizeStateFrom
|
|
|
338
342
|
tableRef: tableRef,
|
|
339
343
|
start: table.start,
|
|
340
344
|
domAtPos: domAtPos,
|
|
341
|
-
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable
|
|
345
|
+
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
|
|
346
|
+
shouldUseIncreasedScalingPercent: isTableScalingEnabledWithLockButton && getBooleanFF('platform.editor.table.use-increased-scaling-percent')
|
|
342
347
|
});
|
|
343
348
|
var newResizeState = evenSelectedColumnsWidths(resizeState, rect);
|
|
344
349
|
var widthsBefore = resizeState.widths;
|
|
@@ -16,6 +16,7 @@ import { syncStickyRowToTable } from './dom';
|
|
|
16
16
|
// Will only resize/scale if a table has been previously resized.
|
|
17
17
|
export var scale = function scale(tableRef, options, domAtPos) {
|
|
18
18
|
var isTableScalingEnabledOnCurrentTable = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
19
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
|
|
19
20
|
var node = options.node,
|
|
20
21
|
containerWidth = options.containerWidth,
|
|
21
22
|
previousContainerWidth = options.previousContainerWidth,
|
|
@@ -51,12 +52,14 @@ export var scale = function scale(tableRef, options, domAtPos) {
|
|
|
51
52
|
tableRef: tableRef,
|
|
52
53
|
start: start,
|
|
53
54
|
domAtPos: domAtPos,
|
|
54
|
-
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable
|
|
55
|
+
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
|
|
56
|
+
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
|
|
55
57
|
});
|
|
56
58
|
return scaleTableTo(resizeState, newWidth);
|
|
57
59
|
};
|
|
58
60
|
export var scaleWithParent = function scaleWithParent(tableRef, parentWidth, table, start, domAtPos) {
|
|
59
61
|
var isTableScalingEnabledOnCurrentTable = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
|
|
62
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
60
63
|
var resizeState = getResizeState({
|
|
61
64
|
minWidth: tableCellMinWidth,
|
|
62
65
|
maxSize: parentWidth,
|
|
@@ -64,7 +67,8 @@ export var scaleWithParent = function scaleWithParent(tableRef, parentWidth, tab
|
|
|
64
67
|
tableRef: tableRef,
|
|
65
68
|
start: start,
|
|
66
69
|
domAtPos: domAtPos,
|
|
67
|
-
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable
|
|
70
|
+
isTableScalingEnabled: isTableScalingEnabledOnCurrentTable,
|
|
71
|
+
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
|
|
68
72
|
});
|
|
69
73
|
if (table.attrs.isNumberColumnEnabled) {
|
|
70
74
|
parentWidth -= akEditorTableNumberColumnWidth;
|
|
@@ -109,7 +113,8 @@ export var previewScaleTable = function previewScaleTable(tableRef, options, dom
|
|
|
109
113
|
tableRef.style.width = "".concat(width, "px");
|
|
110
114
|
}
|
|
111
115
|
var isTableScalingEnabledOnCurrentTable = isTableScalingEnabled;
|
|
112
|
-
|
|
116
|
+
var isTableScalingEnabledWithLockButton = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button');
|
|
117
|
+
if (isTableScalingEnabledWithLockButton) {
|
|
113
118
|
isTableScalingEnabledOnCurrentTable = isTableScalingEnabled && node.attrs.displayMode !== 'fixed';
|
|
114
119
|
}
|
|
115
120
|
// If the table hasn't been resize, the colgroup 48px width values will gracefully scale down.
|
|
@@ -118,16 +123,19 @@ export var previewScaleTable = function previewScaleTable(tableRef, options, dom
|
|
|
118
123
|
syncStickyRowToTable(tableRef);
|
|
119
124
|
return;
|
|
120
125
|
}
|
|
121
|
-
var
|
|
122
|
-
|
|
126
|
+
var shouldUseIncreasedScalingPercent = isTableScalingEnabledWithLockButton && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
127
|
+
var resizeState = parentWidth ? scaleWithParent(tableRef, parentWidth, node, start, domAtPos, false,
|
|
128
|
+
// Here isTableScalingEnabled = false
|
|
129
|
+
shouldUseIncreasedScalingPercent) : scale(tableRef, options, domAtPos, false, shouldUseIncreasedScalingPercent);
|
|
123
130
|
if (resizeState) {
|
|
124
|
-
updateColgroup(resizeState, tableRef, node, false);
|
|
131
|
+
updateColgroup(resizeState, tableRef, node, false, shouldUseIncreasedScalingPercent);
|
|
125
132
|
}
|
|
126
133
|
};
|
|
127
134
|
|
|
128
135
|
// Scale the table to meet new requirements (col, layout change etc)
|
|
129
136
|
export var scaleTable = function scaleTable(tableRef, options, domAtPos) {
|
|
130
137
|
var isTableScalingEnabledOnCurrentTable = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
138
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
|
|
131
139
|
return function (tr) {
|
|
132
140
|
if (!tableRef) {
|
|
133
141
|
return tr;
|
|
@@ -141,16 +149,16 @@ export var scaleTable = function scaleTable(tableRef, options, domAtPos) {
|
|
|
141
149
|
// If its not a re-sized table, we still want to re-create cols
|
|
142
150
|
// To force reflow of columns upon delete.
|
|
143
151
|
if (!isTableScalingEnabledOnCurrentTable) {
|
|
144
|
-
insertColgroupFromNode(tableRef, node);
|
|
152
|
+
insertColgroupFromNode(tableRef, node, false, undefined, shouldUseIncreasedScalingPercent);
|
|
145
153
|
}
|
|
146
154
|
tr.setMeta('scrollIntoView', false);
|
|
147
155
|
return tr;
|
|
148
156
|
}
|
|
149
157
|
var resizeState;
|
|
150
158
|
if (parentWidth) {
|
|
151
|
-
resizeState = scaleWithParent(tableRef, parentWidth, node, start, domAtPos, isTableScalingEnabledOnCurrentTable);
|
|
159
|
+
resizeState = scaleWithParent(tableRef, parentWidth, node, start, domAtPos, isTableScalingEnabledOnCurrentTable, shouldUseIncreasedScalingPercent);
|
|
152
160
|
} else {
|
|
153
|
-
resizeState = scale(tableRef, options, domAtPos, isTableScalingEnabledOnCurrentTable);
|
|
161
|
+
resizeState = scale(tableRef, options, domAtPos, isTableScalingEnabledOnCurrentTable, shouldUseIncreasedScalingPercent);
|
|
154
162
|
}
|
|
155
163
|
if (resizeState) {
|
|
156
164
|
tr = updateColumnWidths(resizeState, node, start)(tr);
|
package/dist/esm/toolbar.js
CHANGED
|
@@ -109,6 +109,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
|
|
|
109
109
|
var _pluginState$pluginCo, _pluginState$pluginCo2;
|
|
110
110
|
var formatMessage = _ref2.formatMessage;
|
|
111
111
|
var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
112
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
|
|
112
113
|
var top = initialSelectionRect.top,
|
|
113
114
|
bottom = initialSelectionRect.bottom,
|
|
114
115
|
right = initialSelectionRect.right,
|
|
@@ -123,7 +124,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
|
|
|
123
124
|
var selectionRect = getClosestSelectionRect(state);
|
|
124
125
|
var index = selectionRect === null || selectionRect === void 0 ? void 0 : selectionRect.right;
|
|
125
126
|
if (index) {
|
|
126
|
-
insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled)(INPUT_METHOD.FLOATING_TB, index)(state, dispatch, view);
|
|
127
|
+
insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, shouldUseIncreasedScalingPercent)(INPUT_METHOD.FLOATING_TB, index)(state, dispatch, view);
|
|
127
128
|
}
|
|
128
129
|
return true;
|
|
129
130
|
},
|
|
@@ -159,7 +160,7 @@ export var getToolbarCellOptionsConfig = function getToolbarCellOptionsConfig(ed
|
|
|
159
160
|
onClick: function onClick(state, dispatch, view) {
|
|
160
161
|
var selectionRect = getClosestSelectionRect(state);
|
|
161
162
|
if (selectionRect) {
|
|
162
|
-
deleteColumnsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.FLOATING_TB, selectionRect)(state, dispatch, view);
|
|
163
|
+
deleteColumnsWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, shouldUseIncreasedScalingPercent)(INPUT_METHOD.FLOATING_TB, selectionRect)(state, dispatch, view);
|
|
163
164
|
}
|
|
164
165
|
return true;
|
|
165
166
|
},
|
|
@@ -310,6 +311,7 @@ export var getClosestSelectionOrTableRect = function getClosestSelectionOrTableR
|
|
|
310
311
|
return isSelectionType(selection, 'cell') ? getSelectionRect(selection) : tableRect;
|
|
311
312
|
};
|
|
312
313
|
export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth, editorAnalyticsAPI, getEditorFeatureFlags, getEditorView, options) {
|
|
314
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
|
|
313
315
|
return function (config) {
|
|
314
316
|
return function (state, intl) {
|
|
315
317
|
var tableObject = findTable(state.selection);
|
|
@@ -326,7 +328,7 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
|
|
|
326
328
|
var isNested = pluginState.tablePos && isTableNested(state, pluginState.tablePos);
|
|
327
329
|
alignmentMenu = options !== null && options !== void 0 && options.isTableAlignmentEnabled && !isNested ? getAlignmentOptionsConfig(state, intl, editorAnalyticsAPI, getEditorContainerWidth) : [];
|
|
328
330
|
var cellItems;
|
|
329
|
-
cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled);
|
|
331
|
+
cellItems = pluginState.isDragAndDropEnabled ? [] : getCellItems(state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, shouldUseIncreasedScalingPercent);
|
|
330
332
|
var columnSettingsItems;
|
|
331
333
|
columnSettingsItems = pluginState.isDragAndDropEnabled ? getColumnSettingItems(state, getEditorView(), intl, getEditorContainerWidth, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) : [];
|
|
332
334
|
var colorPicker = getColorPicker(state, menu, intl, editorAnalyticsAPI, getEditorView);
|
|
@@ -429,11 +431,12 @@ var separator = function separator(hidden) {
|
|
|
429
431
|
var getCellItems = function getCellItems(state, view, _ref3, getEditorContainerWidth, editorAnalyticsAPI) {
|
|
430
432
|
var formatMessage = _ref3.formatMessage;
|
|
431
433
|
var isTableScalingEnabled = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
|
|
434
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
432
435
|
var initialSelectionRect = getClosestSelectionRect(state);
|
|
433
436
|
if (initialSelectionRect) {
|
|
434
437
|
var cellOptions = getToolbarCellOptionsConfig(state, view, initialSelectionRect, {
|
|
435
438
|
formatMessage: formatMessage
|
|
436
|
-
}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled);
|
|
439
|
+
}, getEditorContainerWidth, editorAnalyticsAPI, isTableScalingEnabled, shouldUseIncreasedScalingPercent);
|
|
437
440
|
return [cellOptions, separator(cellOptions.hidden)];
|
|
438
441
|
}
|
|
439
442
|
return [];
|
|
@@ -92,6 +92,7 @@ export var updateColumnWidths = function updateColumnWidths(resizeState, table,
|
|
|
92
92
|
*/
|
|
93
93
|
export var rescaleColumns = function rescaleColumns() {
|
|
94
94
|
var isTableScalingEnabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
95
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
95
96
|
return function (table, view) {
|
|
96
97
|
return function (tr) {
|
|
97
98
|
if (!view) {
|
|
@@ -177,7 +178,8 @@ export var rescaleColumns = function rescaleColumns() {
|
|
|
177
178
|
tableRef: tableRef,
|
|
178
179
|
domAtPos: domAtPos,
|
|
179
180
|
maxSize: previousTableInfo.possibleMaxWidth,
|
|
180
|
-
isTableScalingEnabled: shouldScale
|
|
181
|
+
isTableScalingEnabled: shouldScale,
|
|
182
|
+
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
|
|
181
183
|
});
|
|
182
184
|
|
|
183
185
|
// Two scenarios that require scaling:
|
|
@@ -206,6 +206,7 @@ function fixRowSpans(table) {
|
|
|
206
206
|
}
|
|
207
207
|
export var deleteColumns = function deleteColumns(rect, allowCustomStep, view) {
|
|
208
208
|
var isTableScalingEnabled = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
|
|
209
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
|
|
209
210
|
return function (tr) {
|
|
210
211
|
var updatedTr = tr;
|
|
211
212
|
updatedTr.setMeta(META_KEYS.OVERFLOW_TRIGGER, {
|
|
@@ -218,7 +219,7 @@ export var deleteColumns = function deleteColumns(rect, allowCustomStep, view) {
|
|
|
218
219
|
}
|
|
219
220
|
var table = findTable(updatedTr.selection);
|
|
220
221
|
if (table) {
|
|
221
|
-
updatedTr = rescaleColumns(isTableScalingEnabled)(table, view)(updatedTr);
|
|
222
|
+
updatedTr = rescaleColumns(isTableScalingEnabled, shouldUseIncreasedScalingPercent)(table, view)(updatedTr);
|
|
222
223
|
}
|
|
223
224
|
return updatedTr;
|
|
224
225
|
};
|
|
@@ -29,6 +29,7 @@ import { splitCell } from '@atlaskit/editor-tables/utils';
|
|
|
29
29
|
import CrossCircleIcon from '@atlaskit/icon/glyph/cross-circle';
|
|
30
30
|
import EditorBackgroundColorIcon from '@atlaskit/icon/glyph/editor/background-color';
|
|
31
31
|
import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
|
|
32
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
32
33
|
import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, toggleContextualMenu } from '../../commands';
|
|
33
34
|
import { deleteColumnsWithAnalytics, deleteRowsWithAnalytics, distributeColumnsWidthsWithAnalytics, emptyMultipleCellsWithAnalytics, insertColumnWithAnalytics, insertRowWithAnalytics, mergeCellsWithAnalytics, setColorWithAnalytics, sortColumnWithAnalytics, splitCellWithAnalytics } from '../../commands-with-analytics';
|
|
34
35
|
import { getPluginState } from '../../pm-plugins/plugin-factory';
|
|
@@ -382,6 +383,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
382
383
|
var _ref2 = getEditorFeatureFlags ? getEditorFeatureFlags() : {},
|
|
383
384
|
_ref2$tableDuplicateC = _ref2.tableDuplicateCellColouring,
|
|
384
385
|
tableDuplicateCellColouring = _ref2$tableDuplicateC === void 0 ? false : _ref2$tableDuplicateC;
|
|
386
|
+
var shouldUseIncreasedScalingPercent = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
385
387
|
switch (item.value.name) {
|
|
386
388
|
case 'sort_column_desc':
|
|
387
389
|
sortColumnWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, selectionRect.left, SortOrder.DESC)(state, dispatch);
|
|
@@ -411,7 +413,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
411
413
|
_this.toggleOpen();
|
|
412
414
|
break;
|
|
413
415
|
case 'insert_column':
|
|
414
|
-
insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, tableDuplicateCellColouring)(INPUT_METHOD.CONTEXT_MENU, selectionRect.right)(state, dispatch, editorView);
|
|
416
|
+
insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, tableDuplicateCellColouring, shouldUseIncreasedScalingPercent)(INPUT_METHOD.CONTEXT_MENU, selectionRect.right)(state, dispatch, editorView);
|
|
415
417
|
_this.toggleOpen();
|
|
416
418
|
break;
|
|
417
419
|
case 'insert_row':
|
|
@@ -422,7 +424,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
|
|
|
422
424
|
_this.toggleOpen();
|
|
423
425
|
break;
|
|
424
426
|
case 'delete_column':
|
|
425
|
-
deleteColumnsWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.CONTEXT_MENU, selectionRect)(state, dispatch, editorView);
|
|
427
|
+
deleteColumnsWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, shouldUseIncreasedScalingPercent)(INPUT_METHOD.CONTEXT_MENU, selectionRect)(state, dispatch, editorView);
|
|
426
428
|
_this.toggleOpen();
|
|
427
429
|
break;
|
|
428
430
|
case 'delete_row':
|
|
@@ -181,7 +181,8 @@ export var DragMenu = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
181
181
|
scrollableElement = _ref.scrollableElement,
|
|
182
182
|
boundariesElement = _ref.boundariesElement,
|
|
183
183
|
isTableScalingEnabled = _ref.isTableScalingEnabled,
|
|
184
|
-
tableDuplicateCellColouring = _ref.tableDuplicateCellColouring
|
|
184
|
+
tableDuplicateCellColouring = _ref.tableDuplicateCellColouring,
|
|
185
|
+
shouldUseIncreasedScalingPercent = _ref.shouldUseIncreasedScalingPercent;
|
|
185
186
|
var state = editorView.state,
|
|
186
187
|
dispatch = editorView.dispatch;
|
|
187
188
|
var selection = state.selection;
|
|
@@ -205,7 +206,7 @@ export var DragMenu = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
205
206
|
hasMergedCellsInTable = getMergedCellsPositions(state.tr).length > 0;
|
|
206
207
|
}
|
|
207
208
|
var allowBackgroundColor = (_pluginConfig$allowBa = pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.allowBackgroundColor) !== null && _pluginConfig$allowBa !== void 0 ? _pluginConfig$allowBa : false;
|
|
208
|
-
var dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled, tableDuplicateCellColouring);
|
|
209
|
+
var dragMenuConfig = getDragMenuConfig(direction, getEditorContainerWidth, !shouldMoveDisabled, hasMergedCellsInTable, editorView, tableMap, index, targetCellPosition, selectionRect, editorAnalyticsAPI, pluginConfig === null || pluginConfig === void 0 ? void 0 : pluginConfig.isHeaderRowRequired, isTableScalingEnabled, tableDuplicateCellColouring, shouldUseIncreasedScalingPercent);
|
|
209
210
|
var _convertToDropdownIte = convertToDropdownItems(dragMenuConfig, formatMessage, selectionRect),
|
|
210
211
|
menuItems = _convertToDropdownIte.menuItems,
|
|
211
212
|
menuCallback = _convertToDropdownIte.menuCallback;
|
|
@@ -2,6 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { Popup } from '@atlaskit/editor-common/ui';
|
|
3
3
|
import { akEditorFloatingDialogZIndex, akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
|
|
4
4
|
import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
|
|
5
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
5
6
|
import { dragMenuDropdownWidth, tablePopupMenuFitHeight } from '../consts';
|
|
6
7
|
import DragMenu from './DragMenu';
|
|
7
8
|
var FloatingDragMenu = function FloatingDragMenu(_ref) {
|
|
@@ -32,6 +33,7 @@ var FloatingDragMenu = function FloatingDragMenu(_ref) {
|
|
|
32
33
|
var _ref2 = getEditorFeatureFlags ? getEditorFeatureFlags() : {},
|
|
33
34
|
_ref2$tableDuplicateC = _ref2.tableDuplicateCellColouring,
|
|
34
35
|
tableDuplicateCellColouring = _ref2$tableDuplicateC === void 0 ? false : _ref2$tableDuplicateC;
|
|
36
|
+
var shouldUseIncreasedScalingPercent = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
35
37
|
return /*#__PURE__*/React.createElement(Popup, {
|
|
36
38
|
alignX: direction === 'row' ? 'right' : undefined,
|
|
37
39
|
alignY: direction === 'row' ? 'start' : undefined,
|
|
@@ -66,7 +68,8 @@ var FloatingDragMenu = function FloatingDragMenu(_ref) {
|
|
|
66
68
|
boundariesElement: boundariesElement,
|
|
67
69
|
scrollableElement: scrollableElement,
|
|
68
70
|
isTableScalingEnabled: isTableScalingEnabled,
|
|
69
|
-
tableDuplicateCellColouring: tableDuplicateCellColouring
|
|
71
|
+
tableDuplicateCellColouring: tableDuplicateCellColouring,
|
|
72
|
+
shouldUseIncreasedScalingPercent: shouldUseIncreasedScalingPercent
|
|
70
73
|
}));
|
|
71
74
|
};
|
|
72
75
|
FloatingDragMenu.displayName = 'FloatingDragMenu';
|
|
@@ -18,6 +18,7 @@ import { akEditorTableCellOnStickyHeaderZIndex } from '@atlaskit/editor-shared-s
|
|
|
18
18
|
import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
|
|
19
19
|
import { TableMap } from '@atlaskit/editor-tables/table-map';
|
|
20
20
|
import { findTable } from '@atlaskit/editor-tables/utils';
|
|
21
|
+
import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
21
22
|
import { insertColumnWithAnalytics, insertRowWithAnalytics } from '../../commands-with-analytics';
|
|
22
23
|
import { getPluginState } from '../../pm-plugins/plugin-factory';
|
|
23
24
|
import { TableCssClassName as ClassName } from '../../types';
|
|
@@ -195,12 +196,13 @@ export var FloatingInsertButton = /*#__PURE__*/function (_React$Component) {
|
|
|
195
196
|
var _getPluginState = getPluginState(editorView.state),
|
|
196
197
|
_getPluginState$isTab = _getPluginState.isTableScalingEnabled,
|
|
197
198
|
isTableScalingEnabled = _getPluginState$isTab === void 0 ? false : _getPluginState$isTab;
|
|
199
|
+
var shouldUseIncreasedScalingPercent = isTableScalingEnabled && getBooleanFF('platform.editor.table.preserve-widths-with-lock-button') && getBooleanFF('platform.editor.table.use-increased-scaling-percent');
|
|
198
200
|
var _ref = getEditorFeatureFlags ? getEditorFeatureFlags() : {},
|
|
199
201
|
_ref$tableDuplicateCe = _ref.tableDuplicateCellColouring,
|
|
200
202
|
tableDuplicateCellColouring = _ref$tableDuplicateCe === void 0 ? false : _ref$tableDuplicateCe;
|
|
201
203
|
var state = editorView.state,
|
|
202
204
|
dispatch = editorView.dispatch;
|
|
203
|
-
insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, tableDuplicateCellColouring)(INPUT_METHOD.BUTTON, insertColumnButtonIndex)(state, dispatch, editorView);
|
|
205
|
+
insertColumnWithAnalytics(editorAnalyticsAPI, isTableScalingEnabled, tableDuplicateCellColouring, shouldUseIncreasedScalingPercent)(INPUT_METHOD.BUTTON, insertColumnButtonIndex)(state, dispatch, editorView);
|
|
204
206
|
}
|
|
205
207
|
}
|
|
206
208
|
}]);
|
|
@@ -88,7 +88,7 @@ export var TableFloatingControls = function TableFloatingControls(_ref) {
|
|
|
88
88
|
updateCellHoverLocation: updateCellHoverLocation,
|
|
89
89
|
stickyTop: stickyTop,
|
|
90
90
|
isDragAndDropEnabled: isDragAndDropEnabled
|
|
91
|
-
}) : null, tableActive && /*#__PURE__*/React.createElement(React.Fragment, null, isDragAndDropEnabled ? /*#__PURE__*/React.createElement(React.Fragment, null, getBooleanFF('platform.editor.table.use-shared-state-hook') ? /*#__PURE__*/React.createElement(DragCornerControlsWithSelection, {
|
|
91
|
+
}) : null, tableActive && /*#__PURE__*/React.createElement(React.Fragment, null, isDragAndDropEnabled ? /*#__PURE__*/React.createElement(React.Fragment, null, !getBooleanFF('platform.editor.drag-and-drop_wmv9t') && (getBooleanFF('platform.editor.table.use-shared-state-hook') ? /*#__PURE__*/React.createElement(DragCornerControlsWithSelection, {
|
|
92
92
|
editorView: editorView,
|
|
93
93
|
tableRef: tableRef,
|
|
94
94
|
isInDanger: isInDanger,
|
|
@@ -99,7 +99,7 @@ export var TableFloatingControls = function TableFloatingControls(_ref) {
|
|
|
99
99
|
tableRef: tableRef,
|
|
100
100
|
isInDanger: isInDanger,
|
|
101
101
|
isResizing: isResizing
|
|
102
|
-
}), /*#__PURE__*/React.createElement(DragControls, {
|
|
102
|
+
})), /*#__PURE__*/React.createElement(DragControls, {
|
|
103
103
|
tableRef: tableRef,
|
|
104
104
|
tableNode: tableNode,
|
|
105
105
|
hoveredCell: hoveredCell,
|