@atlaskit/editor-plugin-table 10.6.7 → 10.6.8
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 +10 -0
- package/dist/cjs/tablePlugin.js +1 -1
- package/dist/cjs/ui/toolbar.js +11 -37
- package/dist/es2019/tablePlugin.js +1 -1
- package/dist/es2019/ui/toolbar.js +3 -28
- package/dist/esm/tablePlugin.js +1 -1
- package/dist/esm/ui/toolbar.js +5 -31
- package/dist/types/ui/toolbar.d.ts +2 -2
- package/dist/types-ts4.5/ui/toolbar.d.ts +2 -2
- package/package.json +2 -5
- package/src/tablePlugin.tsx +1 -0
- package/src/ui/toolbar.tsx +4 -33
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 10.6.8
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#138977](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/138977)
|
|
8
|
+
[`3d812d3a14c39`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3d812d3a14c39) -
|
|
9
|
+
[ux] Revert "Adds a new temporary floating toolbar's config option to hide any toolbars when any
|
|
10
|
+
table's menu is opened."
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
3
13
|
## 10.6.7
|
|
4
14
|
|
|
5
15
|
### Patch Changes
|
package/dist/cjs/tablePlugin.js
CHANGED
|
@@ -610,7 +610,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
610
610
|
}
|
|
611
611
|
}];
|
|
612
612
|
},
|
|
613
|
-
floatingToolbar: (0, _toolbar.getToolbarConfig)(defaultGetEditorContainerWidth, api, editorAnalyticsAPI, function () {
|
|
613
|
+
floatingToolbar: (0, _toolbar.getToolbarConfig)(defaultGetEditorContainerWidth, api, editorAnalyticsAPI, (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags, function () {
|
|
614
614
|
return editorViewRef.current;
|
|
615
615
|
}, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)((0, _createPluginConfig.pluginConfig)(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
616
616
|
},
|
package/dist/cjs/ui/toolbar.js
CHANGED
|
@@ -37,8 +37,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
|
37
37
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
38
38
|
var _commands = require("../pm-plugins/commands");
|
|
39
39
|
var _commandsWithAnalytics = require("../pm-plugins/commands/commands-with-analytics");
|
|
40
|
-
var _pluginFactory = require("../pm-plugins/
|
|
41
|
-
var _pluginFactory2 = require("../pm-plugins/plugin-factory");
|
|
40
|
+
var _pluginFactory = require("../pm-plugins/plugin-factory");
|
|
42
41
|
var _pluginKey = require("../pm-plugins/table-resizing/plugin-key");
|
|
43
42
|
var _misc = require("../pm-plugins/table-resizing/utils/misc");
|
|
44
43
|
var _resizeState = require("../pm-plugins/table-resizing/utils/resize-state");
|
|
@@ -156,7 +155,7 @@ var getToolbarCellOptionsConfig = exports.getToolbarCellOptionsConfig = function
|
|
|
156
155
|
left = initialSelectionRect.left;
|
|
157
156
|
var numberOfColumns = right - left;
|
|
158
157
|
var numberOfRows = bottom - top;
|
|
159
|
-
var pluginState = (0,
|
|
158
|
+
var pluginState = (0, _pluginFactory.getPluginState)(editorState);
|
|
160
159
|
var options = [{
|
|
161
160
|
id: 'editor.table.insertColumn',
|
|
162
161
|
title: formatMessage(_messages.tableMessages.insertColumn),
|
|
@@ -319,7 +318,7 @@ var getToolbarCellOptionsConfig = exports.getToolbarCellOptionsConfig = function
|
|
|
319
318
|
0: Math.max(numberOfColumns, numberOfRows)
|
|
320
319
|
}),
|
|
321
320
|
onClick: function onClick(state, dispatch) {
|
|
322
|
-
var _getPluginState = (0,
|
|
321
|
+
var _getPluginState = (0, _pluginFactory.getPluginState)(state),
|
|
323
322
|
targetCellPosition = _getPluginState.targetCellPosition;
|
|
324
323
|
(0, _commandsWithAnalytics.emptyMultipleCellsWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.FLOATING_TB, targetCellPosition)(state, dispatch);
|
|
325
324
|
return true;
|
|
@@ -362,46 +361,21 @@ var getClosestSelectionOrTableRect = function getClosestSelectionOrTableRect(sta
|
|
|
362
361
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
363
362
|
return (0, _utils3.isSelectionType)(selection, 'cell') ? (0, _utils3.getSelectionRect)(selection) : tableRect;
|
|
364
363
|
};
|
|
365
|
-
var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getEditorContainerWidth, api, editorAnalyticsAPI, getEditorView, options) {
|
|
366
|
-
var isTableFixedColumnWidthsOptionEnabled = arguments.length >
|
|
367
|
-
var shouldUseIncreasedScalingPercent = arguments.length >
|
|
364
|
+
var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getEditorContainerWidth, api, editorAnalyticsAPI, getEditorFeatureFlags, getEditorView, options) {
|
|
365
|
+
var isTableFixedColumnWidthsOptionEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
366
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
|
|
368
367
|
return function (config) {
|
|
369
368
|
return function (state, intl) {
|
|
370
369
|
var tableObject = (0, _utils3.findTable)(state.selection);
|
|
371
|
-
var pluginState = (0,
|
|
370
|
+
var pluginState = (0, _pluginFactory.getPluginState)(state);
|
|
372
371
|
var resizeState = _pluginKey.pluginKey.getState(state);
|
|
373
372
|
var tableWidthState = _tableWidth.pluginKey.getState(state);
|
|
374
373
|
var isTableScalingEnabled = (options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) || false;
|
|
375
|
-
var nodeType = state.schema.nodes.table;
|
|
376
|
-
var toolbarTitle = 'Table floating controls';
|
|
377
|
-
if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_3')) {
|
|
378
|
-
var isDragHandleMenuOpened = false;
|
|
379
|
-
var isTableRowOrColumnDragged = false;
|
|
380
|
-
if (options !== null && options !== void 0 && options.dragAndDropEnabled) {
|
|
381
|
-
var _getDragDropPluginSta = (0, _pluginFactory.getPluginState)(state),
|
|
382
|
-
_getDragDropPluginSta2 = _getDragDropPluginSta.isDragMenuOpen,
|
|
383
|
-
isDragMenuOpen = _getDragDropPluginSta2 === void 0 ? false : _getDragDropPluginSta2,
|
|
384
|
-
_getDragDropPluginSta3 = _getDragDropPluginSta.isDragging,
|
|
385
|
-
isDragging = _getDragDropPluginSta3 === void 0 ? false : _getDragDropPluginSta3;
|
|
386
|
-
isDragHandleMenuOpened = isDragMenuOpen;
|
|
387
|
-
isTableRowOrColumnDragged = isDragging;
|
|
388
|
-
}
|
|
389
|
-
var isTableOrColumnResizing = !!(resizeState !== null && resizeState !== void 0 && resizeState.dragging || tableWidthState !== null && tableWidthState !== void 0 && tableWidthState.resizing);
|
|
390
|
-
var isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
391
|
-
var shouldSuppressAllToolbars = !pluginState.editorHasFocus || isTableMenuOpened || isTableOrColumnResizing || isTableRowOrColumnDragged;
|
|
392
|
-
if (shouldSuppressAllToolbars) {
|
|
393
|
-
return {
|
|
394
|
-
title: toolbarTitle,
|
|
395
|
-
items: [],
|
|
396
|
-
nodeType: nodeType,
|
|
397
|
-
__suppressAllToolbars: true
|
|
398
|
-
};
|
|
399
|
-
}
|
|
400
|
-
}
|
|
401
374
|
|
|
402
375
|
// We don't want to show floating toolbar while resizing the table
|
|
403
376
|
var isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
|
|
404
377
|
if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
|
|
378
|
+
var nodeType = state.schema.nodes.table;
|
|
405
379
|
var isNested = pluginState.tablePos && (0, _nodes.isTableNested)(state, pluginState.tablePos);
|
|
406
380
|
var isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
|
|
407
381
|
var areTableColumWidthsFixed = tableObject.node.attrs.displayMode === 'fixed';
|
|
@@ -489,7 +463,7 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
|
|
|
489
463
|
} : undefined;
|
|
490
464
|
};
|
|
491
465
|
return {
|
|
492
|
-
title:
|
|
466
|
+
title: 'Table floating controls',
|
|
493
467
|
getDomRef: getDomRef,
|
|
494
468
|
nodeType: nodeType,
|
|
495
469
|
offset: [0, 18],
|
|
@@ -607,7 +581,7 @@ var getColumnSettingItems = function getColumnSettingItems(editorState, editorVi
|
|
|
607
581
|
var isTableScalingEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
608
582
|
var isTableFixedColumnWidthsOptionEnabled = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
|
|
609
583
|
var isCommentEditor = arguments.length > 8 && arguments[8] !== undefined ? arguments[8] : false;
|
|
610
|
-
var pluginState = (0,
|
|
584
|
+
var pluginState = (0, _pluginFactory.getPluginState)(editorState);
|
|
611
585
|
var selectionOrTableRect = getClosestSelectionOrTableRect(editorState);
|
|
612
586
|
if (!selectionOrTableRect || !editorView) {
|
|
613
587
|
return [];
|
|
@@ -643,7 +617,7 @@ var getColumnSettingItems = function getColumnSettingItems(editorState, editorVi
|
|
|
643
617
|
var getColorPicker = function getColorPicker(state, menu, _ref5, editorAnalyticsAPI, getEditorView) {
|
|
644
618
|
var _node$attrs;
|
|
645
619
|
var formatMessage = _ref5.formatMessage;
|
|
646
|
-
var _getPluginState2 = (0,
|
|
620
|
+
var _getPluginState2 = (0, _pluginFactory.getPluginState)(state),
|
|
647
621
|
targetCellPosition = _getPluginState2.targetCellPosition,
|
|
648
622
|
pluginConfig = _getPluginState2.pluginConfig;
|
|
649
623
|
if (!pluginConfig.allowBackgroundColor) {
|
|
@@ -605,7 +605,7 @@ const tablesPlugin = ({
|
|
|
605
605
|
return tr;
|
|
606
606
|
}
|
|
607
607
|
}],
|
|
608
|
-
floatingToolbar: getToolbarConfig(defaultGetEditorContainerWidth, api, editorAnalyticsAPI, () => editorViewRef.current, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)(pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
608
|
+
floatingToolbar: getToolbarConfig(defaultGetEditorContainerWidth, api, editorAnalyticsAPI, (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags, () => editorViewRef.current, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)(pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
609
609
|
},
|
|
610
610
|
usePluginHook({
|
|
611
611
|
editorView
|
|
@@ -32,7 +32,6 @@ import { fg } from '@atlaskit/platform-feature-flags';
|
|
|
32
32
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
33
33
|
import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, hoverTable, removeDescendantNodes } from '../pm-plugins/commands';
|
|
34
34
|
import { deleteColumnsWithAnalytics, deleteRowsWithAnalytics, deleteTableWithAnalytics, distributeColumnsWidthsWithAnalytics, emptyMultipleCellsWithAnalytics, insertColumnWithAnalytics, insertRowWithAnalytics, mergeCellsWithAnalytics, setColorWithAnalytics, setTableAlignmentWithAnalytics, sortColumnWithAnalytics, splitCellWithAnalytics, toggleFixedColumnWidthsOptionAnalytics, toggleHeaderColumnWithAnalytics, toggleHeaderRowWithAnalytics, toggleNumberColumnWithAnalytics, wrapTableInExpandWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
35
|
-
import { getPluginState as getDragDropPluginState } from '../pm-plugins/drag-and-drop/plugin-factory';
|
|
36
35
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
37
36
|
import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizing/plugin-key';
|
|
38
37
|
import { getStaticTableScalingPercent } from '../pm-plugins/table-resizing/utils/misc';
|
|
@@ -345,41 +344,17 @@ const getClosestSelectionOrTableRect = state => {
|
|
|
345
344
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
346
345
|
return isSelectionType(selection, 'cell') ? getSelectionRect(selection) : tableRect;
|
|
347
346
|
};
|
|
348
|
-
export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAPI, getEditorView, options, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false) => config => (state, intl) => {
|
|
347
|
+
export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAPI, getEditorFeatureFlags, getEditorView, options, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent = false) => config => (state, intl) => {
|
|
349
348
|
const tableObject = findTable(state.selection);
|
|
350
349
|
const pluginState = getPluginState(state);
|
|
351
350
|
const resizeState = tableResizingPluginKey.getState(state);
|
|
352
351
|
const tableWidthState = tableWidthPluginKey.getState(state);
|
|
353
352
|
const isTableScalingEnabled = (options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) || false;
|
|
354
|
-
const nodeType = state.schema.nodes.table;
|
|
355
|
-
const toolbarTitle = 'Table floating controls';
|
|
356
|
-
if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_3')) {
|
|
357
|
-
let isDragHandleMenuOpened = false;
|
|
358
|
-
let isTableRowOrColumnDragged = false;
|
|
359
|
-
if (options !== null && options !== void 0 && options.dragAndDropEnabled) {
|
|
360
|
-
const {
|
|
361
|
-
isDragMenuOpen = false,
|
|
362
|
-
isDragging = false
|
|
363
|
-
} = getDragDropPluginState(state);
|
|
364
|
-
isDragHandleMenuOpened = isDragMenuOpen;
|
|
365
|
-
isTableRowOrColumnDragged = isDragging;
|
|
366
|
-
}
|
|
367
|
-
const isTableOrColumnResizing = !!(resizeState !== null && resizeState !== void 0 && resizeState.dragging || tableWidthState !== null && tableWidthState !== void 0 && tableWidthState.resizing);
|
|
368
|
-
const isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
369
|
-
const shouldSuppressAllToolbars = !pluginState.editorHasFocus || isTableMenuOpened || isTableOrColumnResizing || isTableRowOrColumnDragged;
|
|
370
|
-
if (shouldSuppressAllToolbars) {
|
|
371
|
-
return {
|
|
372
|
-
title: toolbarTitle,
|
|
373
|
-
items: [],
|
|
374
|
-
nodeType,
|
|
375
|
-
__suppressAllToolbars: true
|
|
376
|
-
};
|
|
377
|
-
}
|
|
378
|
-
}
|
|
379
353
|
|
|
380
354
|
// We don't want to show floating toolbar while resizing the table
|
|
381
355
|
const isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
|
|
382
356
|
if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
|
|
357
|
+
const nodeType = state.schema.nodes.table;
|
|
383
358
|
const isNested = pluginState.tablePos && isTableNested(state, pluginState.tablePos);
|
|
384
359
|
const isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
|
|
385
360
|
const areTableColumWidthsFixed = tableObject.node.attrs.displayMode === 'fixed';
|
|
@@ -458,7 +433,7 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
|
|
|
458
433
|
onBlur: clearHoverSelection()
|
|
459
434
|
} : undefined;
|
|
460
435
|
return {
|
|
461
|
-
title:
|
|
436
|
+
title: 'Table floating controls',
|
|
462
437
|
getDomRef,
|
|
463
438
|
nodeType,
|
|
464
439
|
offset: [0, 18],
|
package/dist/esm/tablePlugin.js
CHANGED
|
@@ -601,7 +601,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
|
|
|
601
601
|
}
|
|
602
602
|
}];
|
|
603
603
|
},
|
|
604
|
-
floatingToolbar: getToolbarConfig(defaultGetEditorContainerWidth, api, editorAnalyticsAPI, function () {
|
|
604
|
+
floatingToolbar: getToolbarConfig(defaultGetEditorContainerWidth, api, editorAnalyticsAPI, (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags, function () {
|
|
605
605
|
return editorViewRef.current;
|
|
606
606
|
}, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)(pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
607
607
|
},
|
package/dist/esm/ui/toolbar.js
CHANGED
|
@@ -36,7 +36,6 @@ import { fg } from '@atlaskit/platform-feature-flags';
|
|
|
36
36
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
37
37
|
import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, hoverTable, removeDescendantNodes } from '../pm-plugins/commands';
|
|
38
38
|
import { deleteColumnsWithAnalytics, deleteRowsWithAnalytics, deleteTableWithAnalytics, distributeColumnsWidthsWithAnalytics, emptyMultipleCellsWithAnalytics, insertColumnWithAnalytics, insertRowWithAnalytics, mergeCellsWithAnalytics, setColorWithAnalytics, setTableAlignmentWithAnalytics, sortColumnWithAnalytics, splitCellWithAnalytics, toggleFixedColumnWidthsOptionAnalytics, toggleHeaderColumnWithAnalytics, toggleHeaderRowWithAnalytics, toggleNumberColumnWithAnalytics, wrapTableInExpandWithAnalytics } from '../pm-plugins/commands/commands-with-analytics';
|
|
39
|
-
import { getPluginState as getDragDropPluginState } from '../pm-plugins/drag-and-drop/plugin-factory';
|
|
40
39
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
41
40
|
import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizing/plugin-key';
|
|
42
41
|
import { getStaticTableScalingPercent } from '../pm-plugins/table-resizing/utils/misc';
|
|
@@ -354,9 +353,9 @@ var getClosestSelectionOrTableRect = function getClosestSelectionOrTableRect(sta
|
|
|
354
353
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
355
354
|
return isSelectionType(selection, 'cell') ? getSelectionRect(selection) : tableRect;
|
|
356
355
|
};
|
|
357
|
-
export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth, api, editorAnalyticsAPI, getEditorView, options) {
|
|
358
|
-
var isTableFixedColumnWidthsOptionEnabled = arguments.length >
|
|
359
|
-
var shouldUseIncreasedScalingPercent = arguments.length >
|
|
356
|
+
export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth, api, editorAnalyticsAPI, getEditorFeatureFlags, getEditorView, options) {
|
|
357
|
+
var isTableFixedColumnWidthsOptionEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
358
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : false;
|
|
360
359
|
return function (config) {
|
|
361
360
|
return function (state, intl) {
|
|
362
361
|
var tableObject = findTable(state.selection);
|
|
@@ -364,36 +363,11 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
|
|
|
364
363
|
var resizeState = tableResizingPluginKey.getState(state);
|
|
365
364
|
var tableWidthState = tableWidthPluginKey.getState(state);
|
|
366
365
|
var isTableScalingEnabled = (options === null || options === void 0 ? void 0 : options.isTableScalingEnabled) || false;
|
|
367
|
-
var nodeType = state.schema.nodes.table;
|
|
368
|
-
var toolbarTitle = 'Table floating controls';
|
|
369
|
-
if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_3')) {
|
|
370
|
-
var isDragHandleMenuOpened = false;
|
|
371
|
-
var isTableRowOrColumnDragged = false;
|
|
372
|
-
if (options !== null && options !== void 0 && options.dragAndDropEnabled) {
|
|
373
|
-
var _getDragDropPluginSta = getDragDropPluginState(state),
|
|
374
|
-
_getDragDropPluginSta2 = _getDragDropPluginSta.isDragMenuOpen,
|
|
375
|
-
isDragMenuOpen = _getDragDropPluginSta2 === void 0 ? false : _getDragDropPluginSta2,
|
|
376
|
-
_getDragDropPluginSta3 = _getDragDropPluginSta.isDragging,
|
|
377
|
-
isDragging = _getDragDropPluginSta3 === void 0 ? false : _getDragDropPluginSta3;
|
|
378
|
-
isDragHandleMenuOpened = isDragMenuOpen;
|
|
379
|
-
isTableRowOrColumnDragged = isDragging;
|
|
380
|
-
}
|
|
381
|
-
var isTableOrColumnResizing = !!(resizeState !== null && resizeState !== void 0 && resizeState.dragging || tableWidthState !== null && tableWidthState !== void 0 && tableWidthState.resizing);
|
|
382
|
-
var isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
383
|
-
var shouldSuppressAllToolbars = !pluginState.editorHasFocus || isTableMenuOpened || isTableOrColumnResizing || isTableRowOrColumnDragged;
|
|
384
|
-
if (shouldSuppressAllToolbars) {
|
|
385
|
-
return {
|
|
386
|
-
title: toolbarTitle,
|
|
387
|
-
items: [],
|
|
388
|
-
nodeType: nodeType,
|
|
389
|
-
__suppressAllToolbars: true
|
|
390
|
-
};
|
|
391
|
-
}
|
|
392
|
-
}
|
|
393
366
|
|
|
394
367
|
// We don't want to show floating toolbar while resizing the table
|
|
395
368
|
var isWidthResizing = tableWidthState === null || tableWidthState === void 0 ? void 0 : tableWidthState.resizing;
|
|
396
369
|
if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
|
|
370
|
+
var nodeType = state.schema.nodes.table;
|
|
397
371
|
var isNested = pluginState.tablePos && isTableNested(state, pluginState.tablePos);
|
|
398
372
|
var isTableScalingWithFixedColumnWidthsOptionShown = isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
|
|
399
373
|
var areTableColumWidthsFixed = tableObject.node.attrs.displayMode === 'fixed';
|
|
@@ -481,7 +455,7 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
|
|
|
481
455
|
} : undefined;
|
|
482
456
|
};
|
|
483
457
|
return {
|
|
484
|
-
title:
|
|
458
|
+
title: 'Table floating controls',
|
|
485
459
|
getDomRef: getDomRef,
|
|
486
460
|
nodeType: nodeType,
|
|
487
461
|
offset: [0, 18],
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import type { Command, FloatingToolbarDropdown, FloatingToolbarHandler, FloatingToolbarItem, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { Command, FloatingToolbarDropdown, FloatingToolbarHandler, FloatingToolbarItem, GetEditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { EditorState } from '@atlaskit/editor-prosemirror/state';
|
|
4
4
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
5
5
|
import { Rect } from '@atlaskit/editor-tables/table-map';
|
|
@@ -8,4 +8,4 @@ import type { PluginConfig, PluginInjectionAPI, ToolbarMenuConfig, ToolbarMenuCo
|
|
|
8
8
|
export declare const getToolbarMenuConfig: (config: ToolbarMenuConfig, state: ToolbarMenuState, { formatMessage }: ToolbarMenuContext, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingWithFixedColumnWidthsOptionShown?: boolean, areTableColumnWidthsFixed?: boolean) => FloatingToolbarItem<Command>;
|
|
9
9
|
export declare const getToolbarCellOptionsConfig: (editorState: EditorState, editorView: EditorView | undefined | null, initialSelectionRect: Rect, { formatMessage }: ToolbarMenuContext, getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => FloatingToolbarDropdown<Command>;
|
|
10
10
|
export declare const getClosestSelectionRect: (state: EditorState) => Rect | undefined;
|
|
11
|
-
export declare const getToolbarConfig: (getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, getEditorView: () => EditorView | null, options?: TablePluginOptions, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => (config: PluginConfig) => FloatingToolbarHandler;
|
|
11
|
+
export declare const getToolbarConfig: (getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, getEditorFeatureFlags: GetEditorFeatureFlags, getEditorView: () => EditorView | null, options?: TablePluginOptions, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => (config: PluginConfig) => FloatingToolbarHandler;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
|
|
2
|
-
import type { Command, FloatingToolbarDropdown, FloatingToolbarHandler, FloatingToolbarItem, GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { Command, FloatingToolbarDropdown, FloatingToolbarHandler, FloatingToolbarItem, GetEditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
|
|
3
3
|
import type { EditorState } from '@atlaskit/editor-prosemirror/state';
|
|
4
4
|
import type { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
5
5
|
import { Rect } from '@atlaskit/editor-tables/table-map';
|
|
@@ -8,4 +8,4 @@ import type { PluginConfig, PluginInjectionAPI, ToolbarMenuConfig, ToolbarMenuCo
|
|
|
8
8
|
export declare const getToolbarMenuConfig: (config: ToolbarMenuConfig, state: ToolbarMenuState, { formatMessage }: ToolbarMenuContext, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingWithFixedColumnWidthsOptionShown?: boolean, areTableColumnWidthsFixed?: boolean) => FloatingToolbarItem<Command>;
|
|
9
9
|
export declare const getToolbarCellOptionsConfig: (editorState: EditorState, editorView: EditorView | undefined | null, initialSelectionRect: Rect, { formatMessage }: ToolbarMenuContext, getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean) => FloatingToolbarDropdown<Command>;
|
|
10
10
|
export declare const getClosestSelectionRect: (state: EditorState) => Rect | undefined;
|
|
11
|
-
export declare const getToolbarConfig: (getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, getEditorView: () => EditorView | null, options?: TablePluginOptions, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => (config: PluginConfig) => FloatingToolbarHandler;
|
|
11
|
+
export declare const getToolbarConfig: (getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, getEditorFeatureFlags: GetEditorFeatureFlags, getEditorView: () => EditorView | null, options?: TablePluginOptions, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean) => (config: PluginConfig) => FloatingToolbarHandler;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "10.6.
|
|
3
|
+
"version": "10.6.8",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"@atlaskit/pragmatic-drag-and-drop": "^1.5.0",
|
|
53
53
|
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0",
|
|
54
54
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.0",
|
|
55
|
-
"@atlaskit/primitives": "^14.
|
|
55
|
+
"@atlaskit/primitives": "^14.4.0",
|
|
56
56
|
"@atlaskit/theme": "^18.0.0",
|
|
57
57
|
"@atlaskit/tmp-editor-statsig": "^4.6.0",
|
|
58
58
|
"@atlaskit/toggle": "^15.0.0",
|
|
@@ -197,9 +197,6 @@
|
|
|
197
197
|
},
|
|
198
198
|
"platform_editor_controls_patch_2": {
|
|
199
199
|
"type": "boolean"
|
|
200
|
-
},
|
|
201
|
-
"platform_editor_controls_patch_3": {
|
|
202
|
-
"type": "boolean"
|
|
203
200
|
}
|
|
204
201
|
}
|
|
205
202
|
}
|
package/src/tablePlugin.tsx
CHANGED
|
@@ -768,6 +768,7 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
|
|
|
768
768
|
defaultGetEditorContainerWidth,
|
|
769
769
|
api,
|
|
770
770
|
editorAnalyticsAPI,
|
|
771
|
+
options?.getEditorFeatureFlags || defaultGetEditorFeatureFlags,
|
|
771
772
|
() => editorViewRef.current,
|
|
772
773
|
options,
|
|
773
774
|
isTableFixedColumnWidthsOptionEnabled,
|
package/src/ui/toolbar.tsx
CHANGED
|
@@ -23,6 +23,7 @@ import type {
|
|
|
23
23
|
FloatingToolbarHandler,
|
|
24
24
|
FloatingToolbarItem,
|
|
25
25
|
GetEditorContainerWidth,
|
|
26
|
+
GetEditorFeatureFlags,
|
|
26
27
|
Icon,
|
|
27
28
|
typeOption,
|
|
28
29
|
} from '@atlaskit/editor-common/types';
|
|
@@ -86,7 +87,6 @@ import {
|
|
|
86
87
|
toggleNumberColumnWithAnalytics,
|
|
87
88
|
wrapTableInExpandWithAnalytics,
|
|
88
89
|
} from '../pm-plugins/commands/commands-with-analytics';
|
|
89
|
-
import { getPluginState as getDragDropPluginState } from '../pm-plugins/drag-and-drop/plugin-factory';
|
|
90
90
|
import { getPluginState } from '../pm-plugins/plugin-factory';
|
|
91
91
|
import { pluginKey as tableResizingPluginKey } from '../pm-plugins/table-resizing/plugin-key';
|
|
92
92
|
import { getStaticTableScalingPercent } from '../pm-plugins/table-resizing/utils/misc';
|
|
@@ -479,6 +479,7 @@ export const getToolbarConfig =
|
|
|
479
479
|
getEditorContainerWidth: GetEditorContainerWidth,
|
|
480
480
|
api: PluginInjectionAPI | undefined | null,
|
|
481
481
|
editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null,
|
|
482
|
+
getEditorFeatureFlags: GetEditorFeatureFlags,
|
|
482
483
|
getEditorView: () => EditorView | null,
|
|
483
484
|
options?: TablePluginOptions,
|
|
484
485
|
isTableFixedColumnWidthsOptionEnabled = false,
|
|
@@ -491,42 +492,12 @@ export const getToolbarConfig =
|
|
|
491
492
|
const resizeState = tableResizingPluginKey.getState(state);
|
|
492
493
|
const tableWidthState = tableWidthPluginKey.getState(state);
|
|
493
494
|
const isTableScalingEnabled = options?.isTableScalingEnabled || false;
|
|
494
|
-
const nodeType = state.schema.nodes.table;
|
|
495
|
-
const toolbarTitle = 'Table floating controls';
|
|
496
|
-
|
|
497
|
-
if (
|
|
498
|
-
editorExperiment('platform_editor_controls', 'variant1') &&
|
|
499
|
-
fg('platform_editor_controls_patch_3')
|
|
500
|
-
) {
|
|
501
|
-
let isDragHandleMenuOpened = false;
|
|
502
|
-
let isTableRowOrColumnDragged = false;
|
|
503
|
-
if (options?.dragAndDropEnabled) {
|
|
504
|
-
const { isDragMenuOpen = false, isDragging = false } = getDragDropPluginState(state);
|
|
505
|
-
isDragHandleMenuOpened = isDragMenuOpen;
|
|
506
|
-
isTableRowOrColumnDragged = isDragging;
|
|
507
|
-
}
|
|
508
|
-
|
|
509
|
-
const isTableOrColumnResizing = !!(resizeState?.dragging || tableWidthState?.resizing);
|
|
510
|
-
const isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
511
|
-
const shouldSuppressAllToolbars =
|
|
512
|
-
!pluginState.editorHasFocus ||
|
|
513
|
-
isTableMenuOpened ||
|
|
514
|
-
isTableOrColumnResizing ||
|
|
515
|
-
isTableRowOrColumnDragged;
|
|
516
|
-
if (shouldSuppressAllToolbars) {
|
|
517
|
-
return {
|
|
518
|
-
title: toolbarTitle,
|
|
519
|
-
items: [],
|
|
520
|
-
nodeType,
|
|
521
|
-
__suppressAllToolbars: true,
|
|
522
|
-
};
|
|
523
|
-
}
|
|
524
|
-
}
|
|
525
495
|
|
|
526
496
|
// We don't want to show floating toolbar while resizing the table
|
|
527
497
|
const isWidthResizing = tableWidthState?.resizing;
|
|
528
498
|
|
|
529
499
|
if (tableObject && pluginState.editorHasFocus && !isWidthResizing) {
|
|
500
|
+
const nodeType = state.schema.nodes.table;
|
|
530
501
|
const isNested = pluginState.tablePos && isTableNested(state, pluginState.tablePos);
|
|
531
502
|
const isTableScalingWithFixedColumnWidthsOptionShown =
|
|
532
503
|
isTableScalingEnabled && isTableFixedColumnWidthsOptionEnabled && !isNested;
|
|
@@ -674,7 +645,7 @@ export const getToolbarConfig =
|
|
|
674
645
|
: undefined;
|
|
675
646
|
|
|
676
647
|
return {
|
|
677
|
-
title:
|
|
648
|
+
title: 'Table floating controls',
|
|
678
649
|
getDomRef,
|
|
679
650
|
nodeType,
|
|
680
651
|
offset: [0, 18],
|