@atlaskit/editor-plugin-table 19.0.0 → 19.0.1
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 +9 -0
- package/dist/cjs/nodeviews/TableResizer.js +1 -1
- package/dist/cjs/pm-plugins/keymap.js +12 -12
- package/dist/cjs/pm-plugins/main.js +3 -3
- package/dist/cjs/tablePlugin.js +45 -40
- package/dist/cjs/ui/ContentComponent.js +1 -0
- package/dist/cjs/ui/global-styles.js +2 -1
- package/dist/cjs/ui/toolbar.js +11 -5
- package/dist/es2019/nodeviews/TableResizer.js +1 -1
- package/dist/es2019/pm-plugins/keymap.js +2 -2
- package/dist/es2019/pm-plugins/main.js +3 -3
- package/dist/es2019/tablePlugin.js +10 -4
- package/dist/es2019/ui/ContentComponent.js +1 -0
- package/dist/es2019/ui/global-styles.js +2 -1
- package/dist/es2019/ui/toolbar.js +10 -4
- package/dist/esm/nodeviews/TableResizer.js +1 -1
- package/dist/esm/pm-plugins/keymap.js +12 -12
- package/dist/esm/pm-plugins/main.js +3 -3
- package/dist/esm/tablePlugin.js +45 -40
- package/dist/esm/ui/ContentComponent.js +1 -0
- package/dist/esm/ui/global-styles.js +2 -1
- package/dist/esm/ui/toolbar.js +11 -5
- package/dist/types/pm-plugins/keymap.d.ts +1 -1
- package/dist/types/pm-plugins/main.d.ts +1 -1
- package/dist/types/tablePluginType.d.ts +6 -0
- package/dist/types/ui/global-styles.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/tablePluginType.d.ts +6 -0
- package/dist/types-ts4.5/ui/global-styles.d.ts +2 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-table
|
|
2
2
|
|
|
3
|
+
## 19.0.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`ed96586aa0e43`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ed96586aa0e43) -
|
|
8
|
+
Cleanup experiment platform_editor_table_resizer_extended_zone: ship treatment
|
|
9
|
+
(needExtendedResizeZone always true)
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
3
12
|
## 19.0.0
|
|
4
13
|
|
|
5
14
|
### Major Changes
|
|
@@ -517,7 +517,7 @@ var TableResizer = exports.TableResizer = function TableResizer(_ref) {
|
|
|
517
517
|
snap: guidelineSnaps,
|
|
518
518
|
handlePositioning: "adjacent",
|
|
519
519
|
isHandleVisible: isTableSelected,
|
|
520
|
-
needExtendedResizeZone:
|
|
520
|
+
needExtendedResizeZone: true,
|
|
521
521
|
appearance: isTableSelected && isWholeTableInDanger ? 'danger' : undefined,
|
|
522
522
|
handleHighlight: "shadow"
|
|
523
523
|
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
|
|
@@ -17,18 +17,18 @@ var _columnResize = require("./commands/column-resize");
|
|
|
17
17
|
var _commandsWithAnalytics2 = require("./commands/commands-with-analytics");
|
|
18
18
|
var _goToNextCell = require("./commands/go-to-next-cell");
|
|
19
19
|
var _insert = require("./commands/insert");
|
|
20
|
-
function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI) {
|
|
20
|
+
function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled) {
|
|
21
21
|
var _pluginInjectionApi$a;
|
|
22
|
-
var isTableScalingEnabled = arguments.length >
|
|
23
|
-
var isTableAlignmentEnabled = arguments.length >
|
|
24
|
-
var isFullWidthEnabled = arguments.length >
|
|
25
|
-
var pluginInjectionApi = arguments.length >
|
|
26
|
-
var getIntl = arguments.length >
|
|
27
|
-
var isTableFixedColumnWidthsOptionEnabled = arguments.length >
|
|
28
|
-
var shouldUseIncreasedScalingPercent = arguments.length >
|
|
29
|
-
var isCommentEditor = arguments.length >
|
|
30
|
-
var isChromelessEditor = arguments.length >
|
|
31
|
-
var isTableResizingEnabled = arguments.length >
|
|
22
|
+
var isTableScalingEnabled = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
|
|
23
|
+
var isTableAlignmentEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
24
|
+
var isFullWidthEnabled = arguments.length > 7 ? arguments[7] : undefined;
|
|
25
|
+
var pluginInjectionApi = arguments.length > 8 ? arguments[8] : undefined;
|
|
26
|
+
var getIntl = arguments.length > 9 ? arguments[9] : undefined;
|
|
27
|
+
var isTableFixedColumnWidthsOptionEnabled = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
|
|
28
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 11 ? arguments[11] : undefined;
|
|
29
|
+
var isCommentEditor = arguments.length > 12 ? arguments[12] : undefined;
|
|
30
|
+
var isChromelessEditor = arguments.length > 13 ? arguments[13] : undefined;
|
|
31
|
+
var isTableResizingEnabled = arguments.length > 14 ? arguments[14] : undefined;
|
|
32
32
|
var list = {};
|
|
33
33
|
var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
|
|
34
34
|
(0, _keymaps.bindKeymapWithCommand)(
|
|
@@ -99,7 +99,7 @@ function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, e
|
|
|
99
99
|
// Ignored via go/ees005
|
|
100
100
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
101
101
|
_keymaps.addColumnAfterVO.common, (0, _insert.addColumnAfter)(api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent), list);
|
|
102
|
-
if (_keymaps.moveRowDown.common && _keymaps.moveRowUp.common && _keymaps.moveColumnLeft.common && _keymaps.moveColumnRight.common) {
|
|
102
|
+
if (dragAndDropEnabled && _keymaps.moveRowDown.common && _keymaps.moveRowUp.common && _keymaps.moveColumnLeft.common && _keymaps.moveColumnRight.common) {
|
|
103
103
|
var isNewKeyMapExperiment = (0, _expValEquals.expValEquals)('editor-a11y-fy26-keyboard-move-row-column', 'isEnabled', true);
|
|
104
104
|
// Move row/column shortcuts
|
|
105
105
|
/**
|
|
@@ -34,7 +34,7 @@ var _decoration = require("./utils/decoration");
|
|
|
34
34
|
var _paste = require("./utils/paste");
|
|
35
35
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
36
36
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
37
|
-
var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
|
|
37
|
+
var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
|
|
38
38
|
var _accessibilityUtils;
|
|
39
39
|
var state = (0, _pluginFactory.createPluginState)(dispatch, _objectSpread(_objectSpread(_objectSpread({
|
|
40
40
|
pluginConfig: pluginConfig,
|
|
@@ -45,7 +45,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
|
|
|
45
45
|
wasFullWidthModeEnabled: previousFullWidthModeEnabled,
|
|
46
46
|
isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
|
|
47
47
|
isHeaderColumnEnabled: false,
|
|
48
|
-
isDragAndDropEnabled:
|
|
48
|
+
isDragAndDropEnabled: dragAndDropEnabled,
|
|
49
49
|
isTableScalingEnabled: isTableScalingEnabled
|
|
50
50
|
}, _defaultTableSelection.defaultHoveredCell), _defaultTableSelection.defaultTableSelection), {}, {
|
|
51
51
|
getIntl: getIntl
|
|
@@ -78,7 +78,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatchAnalytic
|
|
|
78
78
|
tableRow: (0, _tableNodeViews.tableRowView)({
|
|
79
79
|
eventDispatcher: eventDispatcher,
|
|
80
80
|
pluginInjectionApi: pluginInjectionApi,
|
|
81
|
-
isDragAndDropEnabled:
|
|
81
|
+
isDragAndDropEnabled: dragAndDropEnabled
|
|
82
82
|
}),
|
|
83
83
|
tableCell: (0, _tableNodeViews.tableCellView)({
|
|
84
84
|
eventDispatcher: eventDispatcher,
|
package/dist/cjs/tablePlugin.js
CHANGED
|
@@ -75,6 +75,7 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
75
75
|
};
|
|
76
76
|
var options = _objectSpread(_objectSpread({}, config), {}, {
|
|
77
77
|
tableOptions: (_config$tableOptions = config === null || config === void 0 ? void 0 : config.tableOptions) !== null && _config$tableOptions !== void 0 ? _config$tableOptions : {},
|
|
78
|
+
dragAndDropEnabled: (config === null || config === void 0 ? void 0 : config.dragAndDropEnabled) || (0, _platformFeatureFlags.fg)('platform_editor_enable_table_dnd'),
|
|
78
79
|
isTableScalingEnabled: (config === null || config === void 0 ? void 0 : config.isTableScalingEnabled) || (0, _platformFeatureFlags.fg)('platform_editor_enable_table_scaling')
|
|
79
80
|
});
|
|
80
81
|
var defaultGetEditorContainerWidth = function defaultGetEditorContainerWidth() {
|
|
@@ -291,10 +292,11 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
291
292
|
wasFullWidthEnabled = _ref3.wasFullWidthEnabled,
|
|
292
293
|
tableOptions = _ref3.tableOptions,
|
|
293
294
|
getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
|
|
295
|
+
dragAndDropEnabled = _ref3.dragAndDropEnabled,
|
|
294
296
|
isTableScalingEnabled = _ref3.isTableScalingEnabled,
|
|
295
297
|
isCommentEditor = _ref3.isCommentEditor,
|
|
296
298
|
isChromelessEditor = _ref3.isChromelessEditor;
|
|
297
|
-
return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
|
|
299
|
+
return (0, _main.createPlugin)(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, (0, _createPluginConfig.pluginConfig)(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
|
|
298
300
|
}
|
|
299
301
|
}, {
|
|
300
302
|
name: 'tablePMColResizing',
|
|
@@ -326,6 +328,7 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
326
328
|
var getIntl = _ref6.getIntl,
|
|
327
329
|
nodeViewPortalProviderAPI = _ref6.nodeViewPortalProviderAPI;
|
|
328
330
|
var _ref7 = options || {},
|
|
331
|
+
dragAndDropEnabled = _ref7.dragAndDropEnabled,
|
|
329
332
|
_ref7$isTableScalingE = _ref7.isTableScalingEnabled,
|
|
330
333
|
isTableScalingEnabled = _ref7$isTableScalingE === void 0 ? false : _ref7$isTableScalingE,
|
|
331
334
|
_ref7$fullWidthEnable = _ref7.fullWidthEnabled,
|
|
@@ -335,7 +338,7 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
335
338
|
_ref7$isChromelessEdi = _ref7.isChromelessEditor,
|
|
336
339
|
isChromelessEditor = _ref7$isChromelessEdi === void 0 ? false : _ref7$isChromelessEdi,
|
|
337
340
|
tableOptions = _ref7.tableOptions;
|
|
338
|
-
return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
|
|
341
|
+
return (0, _keymap.keymapPlugin)(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
|
|
339
342
|
}
|
|
340
343
|
}, {
|
|
341
344
|
name: 'tableSelectionKeymap',
|
|
@@ -346,10 +349,12 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
346
349
|
}, {
|
|
347
350
|
name: 'tableEditing',
|
|
348
351
|
plugin: function plugin() {
|
|
352
|
+
var _ref9 = options || {},
|
|
353
|
+
dragAndDropEnabled = _ref9.dragAndDropEnabled;
|
|
349
354
|
return (0, _pmPlugins.tableEditing)({
|
|
350
|
-
reportFixedTable: function reportFixedTable(
|
|
351
|
-
var tr =
|
|
352
|
-
reason =
|
|
355
|
+
reportFixedTable: function reportFixedTable(_ref0) {
|
|
356
|
+
var tr = _ref0.tr,
|
|
357
|
+
reason = _ref0.reason;
|
|
353
358
|
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
|
|
354
359
|
action: _analytics.TABLE_ACTION.FIXED,
|
|
355
360
|
actionSubject: _analytics.ACTION_SUBJECT.TABLE,
|
|
@@ -360,71 +365,71 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
360
365
|
eventType: _analytics.EVENT_TYPE.TRACK
|
|
361
366
|
})(tr);
|
|
362
367
|
},
|
|
363
|
-
dragAndDropEnabled:
|
|
368
|
+
dragAndDropEnabled: dragAndDropEnabled
|
|
364
369
|
});
|
|
365
370
|
}
|
|
366
371
|
}, {
|
|
367
372
|
name: 'tableStickyHeaders',
|
|
368
|
-
plugin: function plugin(
|
|
369
|
-
var dispatch =
|
|
373
|
+
plugin: function plugin(_ref1) {
|
|
374
|
+
var dispatch = _ref1.dispatch;
|
|
370
375
|
return options && options.tableOptions.stickyHeaders ? (0, _plugin4.createPlugin)(dispatch, function () {
|
|
371
376
|
return [];
|
|
372
377
|
}) : undefined;
|
|
373
378
|
}
|
|
374
379
|
}, {
|
|
375
380
|
name: 'tableDragAndDrop',
|
|
376
|
-
plugin: function plugin(
|
|
377
|
-
var dispatch =
|
|
378
|
-
return (0, _plugin3.createPlugin)(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api);
|
|
381
|
+
plugin: function plugin(_ref10) {
|
|
382
|
+
var dispatch = _ref10.dispatch;
|
|
383
|
+
return options !== null && options !== void 0 && options.dragAndDropEnabled ? (0, _plugin3.createPlugin)(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api) : undefined;
|
|
379
384
|
}
|
|
380
385
|
}, {
|
|
381
386
|
name: 'tableViewModeSort',
|
|
382
|
-
plugin: function plugin(
|
|
383
|
-
var nodeViewPortalProviderAPI =
|
|
387
|
+
plugin: function plugin(_ref11) {
|
|
388
|
+
var nodeViewPortalProviderAPI = _ref11.nodeViewPortalProviderAPI;
|
|
384
389
|
return api !== null && api !== void 0 && api.editorViewMode ? (0, _viewModeSort.createPlugin)(api, nodeViewPortalProviderAPI) : undefined;
|
|
385
390
|
}
|
|
386
391
|
}, {
|
|
387
392
|
name: 'tableLocalId',
|
|
388
|
-
plugin: function plugin(
|
|
389
|
-
var dispatch =
|
|
393
|
+
plugin: function plugin(_ref12) {
|
|
394
|
+
var dispatch = _ref12.dispatch;
|
|
390
395
|
return !(0, _platformFeatureFlags.fg)('platform_editor_adf_with_localid') ? (0, _tableLocalId.createPlugin)(dispatch) : undefined;
|
|
391
396
|
}
|
|
392
397
|
}, {
|
|
393
398
|
name: 'tableWidth',
|
|
394
|
-
plugin: function plugin(
|
|
399
|
+
plugin: function plugin(_ref13) {
|
|
395
400
|
var _options$fullWidthEna, _options$maxWidthEnab, _options$isTableScali, _options$tableOptions3, _options$isCommentEdi;
|
|
396
|
-
var dispatchAnalyticsEvent =
|
|
397
|
-
dispatch =
|
|
401
|
+
var dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent,
|
|
402
|
+
dispatch = _ref13.dispatch;
|
|
398
403
|
return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? (0, _tableWidth.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$maxWidthEnab = options.maxWidthEnabled) !== null && _options$maxWidthEnab !== void 0 ? _options$maxWidthEnab : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions3 = options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
|
|
399
404
|
}
|
|
400
405
|
}, {
|
|
401
406
|
name: 'tableWidthInCommentFix',
|
|
402
|
-
plugin: function plugin(
|
|
407
|
+
plugin: function plugin(_ref14) {
|
|
403
408
|
var _options$tableOptions4;
|
|
404
|
-
var dispatch =
|
|
409
|
+
var dispatch = _ref14.dispatch;
|
|
405
410
|
return options !== null && options !== void 0 && options.tableOptions.allowTableResizing && options !== null && options !== void 0 && options.isCommentEditor ? (0, _tableWidthInCommentFix.createPlugin)(dispatch, (_options$tableOptions4 = options.tableOptions.allowTableAlignment) !== null && _options$tableOptions4 !== void 0 ? _options$tableOptions4 : false) : undefined;
|
|
406
411
|
}
|
|
407
412
|
},
|
|
408
413
|
// TODO: ED-26961 - should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
|
|
409
414
|
{
|
|
410
415
|
name: 'tableOverflowAnalyticsPlugin',
|
|
411
|
-
plugin: function plugin(
|
|
416
|
+
plugin: function plugin(_ref15) {
|
|
412
417
|
var _options$tableOptions5;
|
|
413
|
-
var dispatch =
|
|
414
|
-
dispatchAnalyticsEvent =
|
|
418
|
+
var dispatch = _ref15.dispatch,
|
|
419
|
+
dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
|
|
415
420
|
return (0, _tableAnalytics.createPlugin)(dispatch, dispatchAnalyticsEvent, (_options$tableOptions5 = options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing) !== null && _options$tableOptions5 !== void 0 ? _options$tableOptions5 : false);
|
|
416
421
|
}
|
|
417
422
|
}, {
|
|
418
423
|
name: 'tableAnalyticsPlugin',
|
|
419
|
-
plugin: function plugin(
|
|
420
|
-
var dispatch =
|
|
421
|
-
dispatchAnalyticsEvent =
|
|
424
|
+
plugin: function plugin(_ref16) {
|
|
425
|
+
var dispatch = _ref16.dispatch,
|
|
426
|
+
dispatchAnalyticsEvent = _ref16.dispatchAnalyticsEvent;
|
|
422
427
|
return (0, _plugin.createPlugin)(dispatch, dispatchAnalyticsEvent);
|
|
423
428
|
}
|
|
424
429
|
}, {
|
|
425
430
|
name: 'tableGetEditorViewReferencePlugin',
|
|
426
|
-
plugin: function plugin(
|
|
427
|
-
var dispatchAnalyticsEvent =
|
|
431
|
+
plugin: function plugin(_ref17) {
|
|
432
|
+
var dispatchAnalyticsEvent = _ref17.dispatchAnalyticsEvent;
|
|
428
433
|
return new _safePlugin.SafePlugin({
|
|
429
434
|
view: function view(editorView) {
|
|
430
435
|
editorViewRef.current = editorView;
|
|
@@ -478,8 +483,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
478
483
|
}
|
|
479
484
|
}, {
|
|
480
485
|
name: 'tableSizeSelectorPlugin',
|
|
481
|
-
plugin: function plugin(
|
|
482
|
-
var dispatch =
|
|
486
|
+
plugin: function plugin(_ref18) {
|
|
487
|
+
var dispatch = _ref18.dispatch;
|
|
483
488
|
return isTableSelectorEnabled ? (0, _tableSizeSelector.createPlugin)(dispatch) : undefined;
|
|
484
489
|
}
|
|
485
490
|
}, {
|
|
@@ -510,12 +515,12 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
510
515
|
}
|
|
511
516
|
return plugins;
|
|
512
517
|
},
|
|
513
|
-
contentComponent: function contentComponent(
|
|
514
|
-
var editorView =
|
|
515
|
-
popupsMountPoint =
|
|
516
|
-
popupsBoundariesElement =
|
|
517
|
-
popupsScrollableElement =
|
|
518
|
-
dispatchAnalyticsEvent =
|
|
518
|
+
contentComponent: function contentComponent(_ref19) {
|
|
519
|
+
var editorView = _ref19.editorView,
|
|
520
|
+
popupsMountPoint = _ref19.popupsMountPoint,
|
|
521
|
+
popupsBoundariesElement = _ref19.popupsBoundariesElement,
|
|
522
|
+
popupsScrollableElement = _ref19.popupsScrollableElement,
|
|
523
|
+
dispatchAnalyticsEvent = _ref19.dispatchAnalyticsEvent;
|
|
519
524
|
return /*#__PURE__*/_react.default.createElement(_ContentComponent.ContentComponent, {
|
|
520
525
|
api: api,
|
|
521
526
|
editorView: editorView,
|
|
@@ -530,8 +535,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
530
535
|
});
|
|
531
536
|
},
|
|
532
537
|
pluginsOptions: {
|
|
533
|
-
quickInsert: function quickInsert(
|
|
534
|
-
var formatMessage =
|
|
538
|
+
quickInsert: function quickInsert(_ref20) {
|
|
539
|
+
var formatMessage = _ref20.formatMessage;
|
|
535
540
|
return [{
|
|
536
541
|
id: 'table',
|
|
537
542
|
title: formatMessage(_messages.toolbarInsertBlockMessages.table),
|
|
@@ -601,8 +606,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
601
606
|
return editorViewRef.current;
|
|
602
607
|
}, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)((0, _createPluginConfig.pluginConfig)(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
603
608
|
},
|
|
604
|
-
usePluginHook: function usePluginHook(
|
|
605
|
-
var editorView =
|
|
609
|
+
usePluginHook: function usePluginHook(_ref21) {
|
|
610
|
+
var editorView = _ref21.editorView;
|
|
606
611
|
var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['editorViewMode'], function (states) {
|
|
607
612
|
var _states$editorViewMod;
|
|
608
613
|
return {
|
|
@@ -219,6 +219,7 @@ var ContentComponent = exports.ContentComponent = function ContentComponent(_ref
|
|
|
219
219
|
fallbackComponent: null
|
|
220
220
|
}, /*#__PURE__*/_react.default.createElement(_globalStyles.GlobalStylesWrapper, {
|
|
221
221
|
featureFlags: api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState(),
|
|
222
|
+
isDragAndDropEnabledOption: options === null || options === void 0 ? void 0 : options.dragAndDropEnabled,
|
|
222
223
|
api: api
|
|
223
224
|
}), /*#__PURE__*/_react.default.createElement(ContentComponentInternal, {
|
|
224
225
|
api: api,
|
|
@@ -15,6 +15,7 @@ var _commonStyles = require("./common-styles");
|
|
|
15
15
|
|
|
16
16
|
var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWrapper(_ref) {
|
|
17
17
|
var featureFlags = _ref.featureFlags,
|
|
18
|
+
isDragAndDropEnabledOption = _ref.isDragAndDropEnabledOption,
|
|
18
19
|
api = _ref.api;
|
|
19
20
|
var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['editorViewMode'], function (states) {
|
|
20
21
|
var _states$editorViewMod;
|
|
@@ -27,7 +28,7 @@ var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWra
|
|
|
27
28
|
return (0, _react.jsx)(_react.Global, {
|
|
28
29
|
styles: (0, _commonStyles.tableStyles)({
|
|
29
30
|
featureFlags: featureFlags,
|
|
30
|
-
isDragAndDropEnabled: !isLivePageViewMode
|
|
31
|
+
isDragAndDropEnabled: isDragAndDropEnabledOption && !isLivePageViewMode
|
|
31
32
|
})
|
|
32
33
|
});
|
|
33
34
|
};
|
package/dist/cjs/ui/toolbar.js
CHANGED
|
@@ -417,11 +417,17 @@ var getToolbarConfig = exports.getToolbarConfig = function getToolbarConfig(getE
|
|
|
417
417
|
var areAnyNewToolbarFlagsEnabled = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
|
|
418
418
|
if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
|
|
419
419
|
var _api$editorViewMode;
|
|
420
|
-
var
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
420
|
+
var isDragHandleMenuOpened = false;
|
|
421
|
+
var isTableRowOrColumnDragged = false;
|
|
422
|
+
if (options !== null && options !== void 0 && options.dragAndDropEnabled) {
|
|
423
|
+
var _getDragDropPluginSta = (0, _pluginFactory.getPluginState)(state),
|
|
424
|
+
_getDragDropPluginSta2 = _getDragDropPluginSta.isDragMenuOpen,
|
|
425
|
+
isDragMenuOpen = _getDragDropPluginSta2 === void 0 ? false : _getDragDropPluginSta2,
|
|
426
|
+
_getDragDropPluginSta3 = _getDragDropPluginSta.isDragging,
|
|
427
|
+
isDragging = _getDragDropPluginSta3 === void 0 ? false : _getDragDropPluginSta3;
|
|
428
|
+
isDragHandleMenuOpened = isDragMenuOpen;
|
|
429
|
+
isTableRowOrColumnDragged = isDragging;
|
|
430
|
+
}
|
|
425
431
|
var isTableOrColumnResizing = !!(resizeState !== null && resizeState !== void 0 && resizeState.dragging || tableWidthState !== null && tableWidthState !== void 0 && tableWidthState.resizing);
|
|
426
432
|
var isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
427
433
|
var isTableState = isTableRowOrColumnDragged || isTableOrColumnResizing || isTableMenuOpened;
|
|
@@ -513,7 +513,7 @@ export const TableResizer = ({
|
|
|
513
513
|
snap: guidelineSnaps,
|
|
514
514
|
handlePositioning: "adjacent",
|
|
515
515
|
isHandleVisible: isTableSelected,
|
|
516
|
-
needExtendedResizeZone:
|
|
516
|
+
needExtendedResizeZone: true,
|
|
517
517
|
appearance: isTableSelected && isWholeTableInDanger ? 'danger' : undefined,
|
|
518
518
|
handleHighlight: "shadow"
|
|
519
519
|
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
|
|
@@ -10,7 +10,7 @@ import { activateNextResizeArea, initiateKeyboardColumnResizing, stopKeyboardCol
|
|
|
10
10
|
import { addRowAroundSelection, changeColumnWidthByStepWithAnalytics, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut, deleteTableIfSelectedWithAnalytics, emptyMultipleCellsWithAnalytics } from './commands/commands-with-analytics';
|
|
11
11
|
import { goToNextCellVertical } from './commands/go-to-next-cell';
|
|
12
12
|
import { addColumnAfter as addColumnAfterCommand, addColumnBefore as addColumnBeforeCommand, insertTableWithNestingSupport } from './commands/insert';
|
|
13
|
-
export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled = false, isTableAlignmentEnabled = false, isFullWidthEnabled, pluginInjectionApi, getIntl, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
|
|
13
|
+
export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled = false, isTableAlignmentEnabled = false, isFullWidthEnabled, pluginInjectionApi, getIntl, isTableFixedColumnWidthsOptionEnabled = false, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, isTableResizingEnabled) {
|
|
14
14
|
var _pluginInjectionApi$a;
|
|
15
15
|
const list = {};
|
|
16
16
|
const ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
|
|
@@ -82,7 +82,7 @@ export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProvide
|
|
|
82
82
|
// Ignored via go/ees005
|
|
83
83
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
84
84
|
addColumnAfterVO.common, addColumnAfterCommand(api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent), list);
|
|
85
|
-
if (moveRowDown.common && moveRowUp.common && moveColumnLeft.common && moveColumnRight.common) {
|
|
85
|
+
if (dragAndDropEnabled && moveRowDown.common && moveRowUp.common && moveColumnLeft.common && moveColumnRight.common) {
|
|
86
86
|
const isNewKeyMapExperiment = expValEquals('editor-a11y-fy26-keyboard-move-row-column', 'isEnabled', true);
|
|
87
87
|
// Move row/column shortcuts
|
|
88
88
|
/**
|
|
@@ -24,7 +24,7 @@ import { fixTables } from './transforms/fix-tables';
|
|
|
24
24
|
import { replaceSelectedTable } from './transforms/replace-table';
|
|
25
25
|
import { findControlsHoverDecoration } from './utils/decoration';
|
|
26
26
|
import { transformSliceToCorrectEmptyTableCells, transformSliceToFixHardBreakProblemOnCopyFromCell, transformSliceToRemoveOpenTable, transformSliceToRemoveNestedTables, isHeaderRowRequired, transformSliceTableLayoutDefaultToCenter } from './utils/paste';
|
|
27
|
-
export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) => {
|
|
27
|
+
export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) => {
|
|
28
28
|
var _accessibilityUtils;
|
|
29
29
|
const state = createPluginState(dispatch, {
|
|
30
30
|
pluginConfig,
|
|
@@ -35,7 +35,7 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
|
|
|
35
35
|
wasFullWidthModeEnabled: previousFullWidthModeEnabled,
|
|
36
36
|
isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
|
|
37
37
|
isHeaderColumnEnabled: false,
|
|
38
|
-
isDragAndDropEnabled:
|
|
38
|
+
isDragAndDropEnabled: dragAndDropEnabled,
|
|
39
39
|
isTableScalingEnabled: isTableScalingEnabled,
|
|
40
40
|
...defaultHoveredCell,
|
|
41
41
|
...defaultTableSelection,
|
|
@@ -69,7 +69,7 @@ export const createPlugin = (dispatchAnalyticsEvent, dispatch, portalProviderAPI
|
|
|
69
69
|
tableRow: tableRowView({
|
|
70
70
|
eventDispatcher,
|
|
71
71
|
pluginInjectionApi,
|
|
72
|
-
isDragAndDropEnabled:
|
|
72
|
+
isDragAndDropEnabled: dragAndDropEnabled
|
|
73
73
|
}),
|
|
74
74
|
tableCell: tableCellView({
|
|
75
75
|
eventDispatcher,
|
|
@@ -63,6 +63,7 @@ const tablePlugin = ({
|
|
|
63
63
|
const options = {
|
|
64
64
|
...config,
|
|
65
65
|
tableOptions: (_config$tableOptions = config === null || config === void 0 ? void 0 : config.tableOptions) !== null && _config$tableOptions !== void 0 ? _config$tableOptions : {},
|
|
66
|
+
dragAndDropEnabled: (config === null || config === void 0 ? void 0 : config.dragAndDropEnabled) || fg('platform_editor_enable_table_dnd'),
|
|
66
67
|
isTableScalingEnabled: (config === null || config === void 0 ? void 0 : config.isTableScalingEnabled) || fg('platform_editor_enable_table_scaling')
|
|
67
68
|
};
|
|
68
69
|
const defaultGetEditorContainerWidth = () => {
|
|
@@ -279,11 +280,12 @@ const tablePlugin = ({
|
|
|
279
280
|
wasFullWidthEnabled,
|
|
280
281
|
tableOptions,
|
|
281
282
|
getEditorFeatureFlags,
|
|
283
|
+
dragAndDropEnabled,
|
|
282
284
|
isTableScalingEnabled,
|
|
283
285
|
isCommentEditor,
|
|
284
286
|
isChromelessEditor
|
|
285
287
|
} = options || {};
|
|
286
|
-
return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
|
|
288
|
+
return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
|
|
287
289
|
}
|
|
288
290
|
}, {
|
|
289
291
|
name: 'tablePMColResizing',
|
|
@@ -317,13 +319,14 @@ const tablePlugin = ({
|
|
|
317
319
|
nodeViewPortalProviderAPI
|
|
318
320
|
}) => {
|
|
319
321
|
const {
|
|
322
|
+
dragAndDropEnabled,
|
|
320
323
|
isTableScalingEnabled = false,
|
|
321
324
|
fullWidthEnabled = false,
|
|
322
325
|
isCommentEditor = false,
|
|
323
326
|
isChromelessEditor = false,
|
|
324
327
|
tableOptions
|
|
325
328
|
} = options || {};
|
|
326
|
-
return keymapPlugin(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
|
|
329
|
+
return keymapPlugin(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
|
|
327
330
|
}
|
|
328
331
|
}, {
|
|
329
332
|
name: 'tableSelectionKeymap',
|
|
@@ -333,6 +336,9 @@ const tablePlugin = ({
|
|
|
333
336
|
}, {
|
|
334
337
|
name: 'tableEditing',
|
|
335
338
|
plugin: () => {
|
|
339
|
+
const {
|
|
340
|
+
dragAndDropEnabled
|
|
341
|
+
} = options || {};
|
|
336
342
|
return tableEditing({
|
|
337
343
|
reportFixedTable: ({
|
|
338
344
|
tr,
|
|
@@ -348,7 +354,7 @@ const tablePlugin = ({
|
|
|
348
354
|
eventType: EVENT_TYPE.TRACK
|
|
349
355
|
})(tr);
|
|
350
356
|
},
|
|
351
|
-
dragAndDropEnabled
|
|
357
|
+
dragAndDropEnabled
|
|
352
358
|
});
|
|
353
359
|
}
|
|
354
360
|
}, {
|
|
@@ -361,7 +367,7 @@ const tablePlugin = ({
|
|
|
361
367
|
plugin: ({
|
|
362
368
|
dispatch
|
|
363
369
|
}) => {
|
|
364
|
-
return createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api);
|
|
370
|
+
return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api) : undefined;
|
|
365
371
|
}
|
|
366
372
|
}, {
|
|
367
373
|
name: 'tableViewModeSort',
|
|
@@ -215,6 +215,7 @@ export const ContentComponent = ({
|
|
|
215
215
|
fallbackComponent: null
|
|
216
216
|
}, /*#__PURE__*/React.createElement(GlobalStylesWrapper, {
|
|
217
217
|
featureFlags: api === null || api === void 0 ? void 0 : (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState(),
|
|
218
|
+
isDragAndDropEnabledOption: options === null || options === void 0 ? void 0 : options.dragAndDropEnabled,
|
|
218
219
|
api: api
|
|
219
220
|
}), /*#__PURE__*/React.createElement(ContentComponentInternal, {
|
|
220
221
|
api: api,
|
|
@@ -8,6 +8,7 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
|
|
|
8
8
|
import { tableStyles } from './common-styles';
|
|
9
9
|
export const GlobalStylesWrapper = ({
|
|
10
10
|
featureFlags,
|
|
11
|
+
isDragAndDropEnabledOption,
|
|
11
12
|
api
|
|
12
13
|
}) => {
|
|
13
14
|
const {
|
|
@@ -22,7 +23,7 @@ export const GlobalStylesWrapper = ({
|
|
|
22
23
|
return jsx(Global, {
|
|
23
24
|
styles: tableStyles({
|
|
24
25
|
featureFlags,
|
|
25
|
-
isDragAndDropEnabled: !isLivePageViewMode
|
|
26
|
+
isDragAndDropEnabled: isDragAndDropEnabledOption && !isLivePageViewMode
|
|
26
27
|
})
|
|
27
28
|
});
|
|
28
29
|
};
|
|
@@ -395,10 +395,16 @@ export const getToolbarConfig = (getEditorContainerWidth, api, editorAnalyticsAP
|
|
|
395
395
|
const areAnyNewToolbarFlagsEnabled = areToolbarFlagsEnabled(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
|
|
396
396
|
if (editorExperiment('platform_editor_controls', 'variant1')) {
|
|
397
397
|
var _api$editorViewMode, _api$editorViewMode$s;
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
398
|
+
let isDragHandleMenuOpened = false;
|
|
399
|
+
let isTableRowOrColumnDragged = false;
|
|
400
|
+
if (options !== null && options !== void 0 && options.dragAndDropEnabled) {
|
|
401
|
+
const {
|
|
402
|
+
isDragMenuOpen = false,
|
|
403
|
+
isDragging = false
|
|
404
|
+
} = getDragDropPluginState(state);
|
|
405
|
+
isDragHandleMenuOpened = isDragMenuOpen;
|
|
406
|
+
isTableRowOrColumnDragged = isDragging;
|
|
407
|
+
}
|
|
402
408
|
const isTableOrColumnResizing = !!(resizeState !== null && resizeState !== void 0 && resizeState.dragging || tableWidthState !== null && tableWidthState !== void 0 && tableWidthState.resizing);
|
|
403
409
|
const isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
404
410
|
const isTableState = isTableRowOrColumnDragged || isTableOrColumnResizing || isTableMenuOpened;
|
|
@@ -508,7 +508,7 @@ export var TableResizer = function TableResizer(_ref) {
|
|
|
508
508
|
snap: guidelineSnaps,
|
|
509
509
|
handlePositioning: "adjacent",
|
|
510
510
|
isHandleVisible: isTableSelected,
|
|
511
|
-
needExtendedResizeZone:
|
|
511
|
+
needExtendedResizeZone: true,
|
|
512
512
|
appearance: isTableSelected && isWholeTableInDanger ? 'danger' : undefined,
|
|
513
513
|
handleHighlight: "shadow"
|
|
514
514
|
// eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
|
|
@@ -10,18 +10,18 @@ import { activateNextResizeArea, initiateKeyboardColumnResizing, stopKeyboardCol
|
|
|
10
10
|
import { addRowAroundSelection, changeColumnWidthByStepWithAnalytics, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut, deleteTableIfSelectedWithAnalytics, emptyMultipleCellsWithAnalytics } from './commands/commands-with-analytics';
|
|
11
11
|
import { goToNextCellVertical } from './commands/go-to-next-cell';
|
|
12
12
|
import { addColumnAfter as addColumnAfterCommand, addColumnBefore as addColumnBeforeCommand, insertTableWithNestingSupport } from './commands/insert';
|
|
13
|
-
export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI) {
|
|
13
|
+
export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled) {
|
|
14
14
|
var _pluginInjectionApi$a;
|
|
15
|
-
var isTableScalingEnabled = arguments.length >
|
|
16
|
-
var isTableAlignmentEnabled = arguments.length >
|
|
17
|
-
var isFullWidthEnabled = arguments.length >
|
|
18
|
-
var pluginInjectionApi = arguments.length >
|
|
19
|
-
var getIntl = arguments.length >
|
|
20
|
-
var isTableFixedColumnWidthsOptionEnabled = arguments.length >
|
|
21
|
-
var shouldUseIncreasedScalingPercent = arguments.length >
|
|
22
|
-
var isCommentEditor = arguments.length >
|
|
23
|
-
var isChromelessEditor = arguments.length >
|
|
24
|
-
var isTableResizingEnabled = arguments.length >
|
|
15
|
+
var isTableScalingEnabled = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : false;
|
|
16
|
+
var isTableAlignmentEnabled = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : false;
|
|
17
|
+
var isFullWidthEnabled = arguments.length > 7 ? arguments[7] : undefined;
|
|
18
|
+
var pluginInjectionApi = arguments.length > 8 ? arguments[8] : undefined;
|
|
19
|
+
var getIntl = arguments.length > 9 ? arguments[9] : undefined;
|
|
20
|
+
var isTableFixedColumnWidthsOptionEnabled = arguments.length > 10 && arguments[10] !== undefined ? arguments[10] : false;
|
|
21
|
+
var shouldUseIncreasedScalingPercent = arguments.length > 11 ? arguments[11] : undefined;
|
|
22
|
+
var isCommentEditor = arguments.length > 12 ? arguments[12] : undefined;
|
|
23
|
+
var isChromelessEditor = arguments.length > 13 ? arguments[13] : undefined;
|
|
24
|
+
var isTableResizingEnabled = arguments.length > 14 ? arguments[14] : undefined;
|
|
25
25
|
var list = {};
|
|
26
26
|
var ariaNotifyPlugin = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.accessibilityUtils) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions.ariaNotify;
|
|
27
27
|
bindKeymapWithCommand(
|
|
@@ -92,7 +92,7 @@ export function keymapPlugin(getEditorContainerWidth, api, nodeViewPortalProvide
|
|
|
92
92
|
// Ignored via go/ees005
|
|
93
93
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
94
94
|
addColumnAfterVO.common, addColumnAfterCommand(api, isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent), list);
|
|
95
|
-
if (moveRowDown.common && moveRowUp.common && moveColumnLeft.common && moveColumnRight.common) {
|
|
95
|
+
if (dragAndDropEnabled && moveRowDown.common && moveRowUp.common && moveColumnLeft.common && moveColumnRight.common) {
|
|
96
96
|
var isNewKeyMapExperiment = expValEquals('editor-a11y-fy26-keyboard-move-row-column', 'isEnabled', true);
|
|
97
97
|
// Move row/column shortcuts
|
|
98
98
|
/**
|
|
@@ -27,7 +27,7 @@ import { fixTables } from './transforms/fix-tables';
|
|
|
27
27
|
import { replaceSelectedTable } from './transforms/replace-table';
|
|
28
28
|
import { findControlsHoverDecoration } from './utils/decoration';
|
|
29
29
|
import { transformSliceToCorrectEmptyTableCells, transformSliceToFixHardBreakProblemOnCopyFromCell, transformSliceToRemoveOpenTable, transformSliceToRemoveNestedTables, isHeaderRowRequired, transformSliceTableLayoutDefaultToCenter } from './utils/paste';
|
|
30
|
-
export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
|
|
30
|
+
export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig, getEditorContainerWidth, getEditorFeatureFlags, getIntl, fullWidthModeEnabled, previousFullWidthModeEnabled, dragAndDropEnabled, editorAnalyticsAPI, pluginInjectionApi, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, allowFixedColumnWidthOption) {
|
|
31
31
|
var _accessibilityUtils;
|
|
32
32
|
var state = createPluginState(dispatch, _objectSpread(_objectSpread(_objectSpread({
|
|
33
33
|
pluginConfig: pluginConfig,
|
|
@@ -38,7 +38,7 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
|
|
|
38
38
|
wasFullWidthModeEnabled: previousFullWidthModeEnabled,
|
|
39
39
|
isHeaderRowEnabled: !!pluginConfig.allowHeaderRow,
|
|
40
40
|
isHeaderColumnEnabled: false,
|
|
41
|
-
isDragAndDropEnabled:
|
|
41
|
+
isDragAndDropEnabled: dragAndDropEnabled,
|
|
42
42
|
isTableScalingEnabled: isTableScalingEnabled
|
|
43
43
|
}, defaultHoveredCell), defaultTableSelection), {}, {
|
|
44
44
|
getIntl: getIntl
|
|
@@ -71,7 +71,7 @@ export var createPlugin = function createPlugin(dispatchAnalyticsEvent, dispatch
|
|
|
71
71
|
tableRow: tableRowView({
|
|
72
72
|
eventDispatcher: eventDispatcher,
|
|
73
73
|
pluginInjectionApi: pluginInjectionApi,
|
|
74
|
-
isDragAndDropEnabled:
|
|
74
|
+
isDragAndDropEnabled: dragAndDropEnabled
|
|
75
75
|
}),
|
|
76
76
|
tableCell: tableCellView({
|
|
77
77
|
eventDispatcher: eventDispatcher,
|
package/dist/esm/tablePlugin.js
CHANGED
|
@@ -66,6 +66,7 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
66
66
|
};
|
|
67
67
|
var options = _objectSpread(_objectSpread({}, config), {}, {
|
|
68
68
|
tableOptions: (_config$tableOptions = config === null || config === void 0 ? void 0 : config.tableOptions) !== null && _config$tableOptions !== void 0 ? _config$tableOptions : {},
|
|
69
|
+
dragAndDropEnabled: (config === null || config === void 0 ? void 0 : config.dragAndDropEnabled) || fg('platform_editor_enable_table_dnd'),
|
|
69
70
|
isTableScalingEnabled: (config === null || config === void 0 ? void 0 : config.isTableScalingEnabled) || fg('platform_editor_enable_table_scaling')
|
|
70
71
|
});
|
|
71
72
|
var defaultGetEditorContainerWidth = function defaultGetEditorContainerWidth() {
|
|
@@ -282,10 +283,11 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
282
283
|
wasFullWidthEnabled = _ref3.wasFullWidthEnabled,
|
|
283
284
|
tableOptions = _ref3.tableOptions,
|
|
284
285
|
getEditorFeatureFlags = _ref3.getEditorFeatureFlags,
|
|
286
|
+
dragAndDropEnabled = _ref3.dragAndDropEnabled,
|
|
285
287
|
isTableScalingEnabled = _ref3.isTableScalingEnabled,
|
|
286
288
|
isCommentEditor = _ref3.isCommentEditor,
|
|
287
289
|
isChromelessEditor = _ref3.isChromelessEditor;
|
|
288
|
-
return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
|
|
290
|
+
return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, nodeViewPortalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, getIntl, fullWidthEnabled, wasFullWidthEnabled, dragAndDropEnabled, editorAnalyticsAPI, api, isTableScalingEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, options === null || options === void 0 ? void 0 : options.allowFixedColumnWidthOption);
|
|
289
291
|
}
|
|
290
292
|
}, {
|
|
291
293
|
name: 'tablePMColResizing',
|
|
@@ -317,6 +319,7 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
317
319
|
var getIntl = _ref6.getIntl,
|
|
318
320
|
nodeViewPortalProviderAPI = _ref6.nodeViewPortalProviderAPI;
|
|
319
321
|
var _ref7 = options || {},
|
|
322
|
+
dragAndDropEnabled = _ref7.dragAndDropEnabled,
|
|
320
323
|
_ref7$isTableScalingE = _ref7.isTableScalingEnabled,
|
|
321
324
|
isTableScalingEnabled = _ref7$isTableScalingE === void 0 ? false : _ref7$isTableScalingE,
|
|
322
325
|
_ref7$fullWidthEnable = _ref7.fullWidthEnabled,
|
|
@@ -326,7 +329,7 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
326
329
|
_ref7$isChromelessEdi = _ref7.isChromelessEditor,
|
|
327
330
|
isChromelessEditor = _ref7$isChromelessEdi === void 0 ? false : _ref7$isChromelessEdi,
|
|
328
331
|
tableOptions = _ref7.tableOptions;
|
|
329
|
-
return keymapPlugin(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
|
|
332
|
+
return keymapPlugin(defaultGetEditorContainerWidth, api, nodeViewPortalProviderAPI, editorAnalyticsAPI, dragAndDropEnabled, isTableScalingEnabled, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableAlignment, fullWidthEnabled, api, getIntl, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent, isCommentEditor, isChromelessEditor, tableOptions === null || tableOptions === void 0 ? void 0 : tableOptions.allowTableResizing);
|
|
330
333
|
}
|
|
331
334
|
}, {
|
|
332
335
|
name: 'tableSelectionKeymap',
|
|
@@ -337,10 +340,12 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
337
340
|
}, {
|
|
338
341
|
name: 'tableEditing',
|
|
339
342
|
plugin: function plugin() {
|
|
343
|
+
var _ref9 = options || {},
|
|
344
|
+
dragAndDropEnabled = _ref9.dragAndDropEnabled;
|
|
340
345
|
return tableEditing({
|
|
341
|
-
reportFixedTable: function reportFixedTable(
|
|
342
|
-
var tr =
|
|
343
|
-
reason =
|
|
346
|
+
reportFixedTable: function reportFixedTable(_ref0) {
|
|
347
|
+
var tr = _ref0.tr,
|
|
348
|
+
reason = _ref0.reason;
|
|
344
349
|
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
|
|
345
350
|
action: TABLE_ACTION.FIXED,
|
|
346
351
|
actionSubject: ACTION_SUBJECT.TABLE,
|
|
@@ -351,71 +356,71 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
351
356
|
eventType: EVENT_TYPE.TRACK
|
|
352
357
|
})(tr);
|
|
353
358
|
},
|
|
354
|
-
dragAndDropEnabled:
|
|
359
|
+
dragAndDropEnabled: dragAndDropEnabled
|
|
355
360
|
});
|
|
356
361
|
}
|
|
357
362
|
}, {
|
|
358
363
|
name: 'tableStickyHeaders',
|
|
359
|
-
plugin: function plugin(
|
|
360
|
-
var dispatch =
|
|
364
|
+
plugin: function plugin(_ref1) {
|
|
365
|
+
var dispatch = _ref1.dispatch;
|
|
361
366
|
return options && options.tableOptions.stickyHeaders ? createStickyHeadersPlugin(dispatch, function () {
|
|
362
367
|
return [];
|
|
363
368
|
}) : undefined;
|
|
364
369
|
}
|
|
365
370
|
}, {
|
|
366
371
|
name: 'tableDragAndDrop',
|
|
367
|
-
plugin: function plugin(
|
|
368
|
-
var dispatch =
|
|
369
|
-
return createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api);
|
|
372
|
+
plugin: function plugin(_ref10) {
|
|
373
|
+
var dispatch = _ref10.dispatch;
|
|
374
|
+
return options !== null && options !== void 0 && options.dragAndDropEnabled ? createDragAndDropPlugin(dispatch, editorAnalyticsAPI, options === null || options === void 0 ? void 0 : options.isTableScalingEnabled, isTableFixedColumnWidthsOptionEnabled, options.isCommentEditor, api) : undefined;
|
|
370
375
|
}
|
|
371
376
|
}, {
|
|
372
377
|
name: 'tableViewModeSort',
|
|
373
|
-
plugin: function plugin(
|
|
374
|
-
var nodeViewPortalProviderAPI =
|
|
378
|
+
plugin: function plugin(_ref11) {
|
|
379
|
+
var nodeViewPortalProviderAPI = _ref11.nodeViewPortalProviderAPI;
|
|
375
380
|
return api !== null && api !== void 0 && api.editorViewMode ? createViewModeSortPlugin(api, nodeViewPortalProviderAPI) : undefined;
|
|
376
381
|
}
|
|
377
382
|
}, {
|
|
378
383
|
name: 'tableLocalId',
|
|
379
|
-
plugin: function plugin(
|
|
380
|
-
var dispatch =
|
|
384
|
+
plugin: function plugin(_ref12) {
|
|
385
|
+
var dispatch = _ref12.dispatch;
|
|
381
386
|
return !fg('platform_editor_adf_with_localid') ? createTableLocalIdPlugin(dispatch) : undefined;
|
|
382
387
|
}
|
|
383
388
|
}, {
|
|
384
389
|
name: 'tableWidth',
|
|
385
|
-
plugin: function plugin(
|
|
390
|
+
plugin: function plugin(_ref13) {
|
|
386
391
|
var _options$fullWidthEna, _options$maxWidthEnab, _options$isTableScali, _options$tableOptions3, _options$isCommentEdi;
|
|
387
|
-
var dispatchAnalyticsEvent =
|
|
388
|
-
dispatch =
|
|
392
|
+
var dispatchAnalyticsEvent = _ref13.dispatchAnalyticsEvent,
|
|
393
|
+
dispatch = _ref13.dispatch;
|
|
389
394
|
return options !== null && options !== void 0 && options.tableOptions.allowTableResizing ? createTableWidthPlugin(dispatch, dispatchAnalyticsEvent, (_options$fullWidthEna = options.fullWidthEnabled) !== null && _options$fullWidthEna !== void 0 ? _options$fullWidthEna : false, (_options$maxWidthEnab = options.maxWidthEnabled) !== null && _options$maxWidthEnab !== void 0 ? _options$maxWidthEnab : false, (_options$isTableScali = options.isTableScalingEnabled) !== null && _options$isTableScali !== void 0 ? _options$isTableScali : false, (_options$tableOptions3 = options.tableOptions.allowTableResizing) !== null && _options$tableOptions3 !== void 0 ? _options$tableOptions3 : false, (_options$isCommentEdi = options.isCommentEditor) !== null && _options$isCommentEdi !== void 0 ? _options$isCommentEdi : false) : undefined;
|
|
390
395
|
}
|
|
391
396
|
}, {
|
|
392
397
|
name: 'tableWidthInCommentFix',
|
|
393
|
-
plugin: function plugin(
|
|
398
|
+
plugin: function plugin(_ref14) {
|
|
394
399
|
var _options$tableOptions4;
|
|
395
|
-
var dispatch =
|
|
400
|
+
var dispatch = _ref14.dispatch;
|
|
396
401
|
return options !== null && options !== void 0 && options.tableOptions.allowTableResizing && options !== null && options !== void 0 && options.isCommentEditor ? createTableWidthInCommentFixPlugin(dispatch, (_options$tableOptions4 = options.tableOptions.allowTableAlignment) !== null && _options$tableOptions4 !== void 0 ? _options$tableOptions4 : false) : undefined;
|
|
397
402
|
}
|
|
398
403
|
},
|
|
399
404
|
// TODO: ED-26961 - should be deprecated and eventually replaced with 'tableAnalyticsPlugin'
|
|
400
405
|
{
|
|
401
406
|
name: 'tableOverflowAnalyticsPlugin',
|
|
402
|
-
plugin: function plugin(
|
|
407
|
+
plugin: function plugin(_ref15) {
|
|
403
408
|
var _options$tableOptions5;
|
|
404
|
-
var dispatch =
|
|
405
|
-
dispatchAnalyticsEvent =
|
|
409
|
+
var dispatch = _ref15.dispatch,
|
|
410
|
+
dispatchAnalyticsEvent = _ref15.dispatchAnalyticsEvent;
|
|
406
411
|
return createTableOverflowAnalyticsPlugin(dispatch, dispatchAnalyticsEvent, (_options$tableOptions5 = options === null || options === void 0 ? void 0 : options.tableOptions.allowTableResizing) !== null && _options$tableOptions5 !== void 0 ? _options$tableOptions5 : false);
|
|
407
412
|
}
|
|
408
413
|
}, {
|
|
409
414
|
name: 'tableAnalyticsPlugin',
|
|
410
|
-
plugin: function plugin(
|
|
411
|
-
var dispatch =
|
|
412
|
-
dispatchAnalyticsEvent =
|
|
415
|
+
plugin: function plugin(_ref16) {
|
|
416
|
+
var dispatch = _ref16.dispatch,
|
|
417
|
+
dispatchAnalyticsEvent = _ref16.dispatchAnalyticsEvent;
|
|
413
418
|
return createTableAnalyticsPlugin(dispatch, dispatchAnalyticsEvent);
|
|
414
419
|
}
|
|
415
420
|
}, {
|
|
416
421
|
name: 'tableGetEditorViewReferencePlugin',
|
|
417
|
-
plugin: function plugin(
|
|
418
|
-
var dispatchAnalyticsEvent =
|
|
422
|
+
plugin: function plugin(_ref17) {
|
|
423
|
+
var dispatchAnalyticsEvent = _ref17.dispatchAnalyticsEvent;
|
|
419
424
|
return new SafePlugin({
|
|
420
425
|
view: function view(editorView) {
|
|
421
426
|
editorViewRef.current = editorView;
|
|
@@ -469,8 +474,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
469
474
|
}
|
|
470
475
|
}, {
|
|
471
476
|
name: 'tableSizeSelectorPlugin',
|
|
472
|
-
plugin: function plugin(
|
|
473
|
-
var dispatch =
|
|
477
|
+
plugin: function plugin(_ref18) {
|
|
478
|
+
var dispatch = _ref18.dispatch;
|
|
474
479
|
return isTableSelectorEnabled ? createSizeSelectorPlugin(dispatch) : undefined;
|
|
475
480
|
}
|
|
476
481
|
}, {
|
|
@@ -501,12 +506,12 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
501
506
|
}
|
|
502
507
|
return plugins;
|
|
503
508
|
},
|
|
504
|
-
contentComponent: function contentComponent(
|
|
505
|
-
var editorView =
|
|
506
|
-
popupsMountPoint =
|
|
507
|
-
popupsBoundariesElement =
|
|
508
|
-
popupsScrollableElement =
|
|
509
|
-
dispatchAnalyticsEvent =
|
|
509
|
+
contentComponent: function contentComponent(_ref19) {
|
|
510
|
+
var editorView = _ref19.editorView,
|
|
511
|
+
popupsMountPoint = _ref19.popupsMountPoint,
|
|
512
|
+
popupsBoundariesElement = _ref19.popupsBoundariesElement,
|
|
513
|
+
popupsScrollableElement = _ref19.popupsScrollableElement,
|
|
514
|
+
dispatchAnalyticsEvent = _ref19.dispatchAnalyticsEvent;
|
|
510
515
|
return /*#__PURE__*/React.createElement(ContentComponent, {
|
|
511
516
|
api: api,
|
|
512
517
|
editorView: editorView,
|
|
@@ -521,8 +526,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
521
526
|
});
|
|
522
527
|
},
|
|
523
528
|
pluginsOptions: {
|
|
524
|
-
quickInsert: function quickInsert(
|
|
525
|
-
var formatMessage =
|
|
529
|
+
quickInsert: function quickInsert(_ref20) {
|
|
530
|
+
var formatMessage = _ref20.formatMessage;
|
|
526
531
|
return [{
|
|
527
532
|
id: 'table',
|
|
528
533
|
title: formatMessage(messages.table),
|
|
@@ -592,8 +597,8 @@ var tablePlugin = function tablePlugin(_ref) {
|
|
|
592
597
|
return editorViewRef.current;
|
|
593
598
|
}, options, isTableFixedColumnWidthsOptionEnabled, shouldUseIncreasedScalingPercent)(pluginConfig(options === null || options === void 0 ? void 0 : options.tableOptions))
|
|
594
599
|
},
|
|
595
|
-
usePluginHook: function usePluginHook(
|
|
596
|
-
var editorView =
|
|
600
|
+
usePluginHook: function usePluginHook(_ref21) {
|
|
601
|
+
var editorView = _ref21.editorView;
|
|
597
602
|
var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['editorViewMode'], function (states) {
|
|
598
603
|
var _states$editorViewMod;
|
|
599
604
|
return {
|
|
@@ -211,6 +211,7 @@ export var ContentComponent = function ContentComponent(_ref3) {
|
|
|
211
211
|
fallbackComponent: null
|
|
212
212
|
}, /*#__PURE__*/React.createElement(GlobalStylesWrapper, {
|
|
213
213
|
featureFlags: api === null || api === void 0 || (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState(),
|
|
214
|
+
isDragAndDropEnabledOption: options === null || options === void 0 ? void 0 : options.dragAndDropEnabled,
|
|
214
215
|
api: api
|
|
215
216
|
}), /*#__PURE__*/React.createElement(ContentComponentInternal, {
|
|
216
217
|
api: api,
|
|
@@ -8,6 +8,7 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
|
|
|
8
8
|
import { tableStyles } from './common-styles';
|
|
9
9
|
export var GlobalStylesWrapper = function GlobalStylesWrapper(_ref) {
|
|
10
10
|
var featureFlags = _ref.featureFlags,
|
|
11
|
+
isDragAndDropEnabledOption = _ref.isDragAndDropEnabledOption,
|
|
11
12
|
api = _ref.api;
|
|
12
13
|
var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['editorViewMode'], function (states) {
|
|
13
14
|
var _states$editorViewMod;
|
|
@@ -20,7 +21,7 @@ export var GlobalStylesWrapper = function GlobalStylesWrapper(_ref) {
|
|
|
20
21
|
return jsx(Global, {
|
|
21
22
|
styles: tableStyles({
|
|
22
23
|
featureFlags: featureFlags,
|
|
23
|
-
isDragAndDropEnabled: !isLivePageViewMode
|
|
24
|
+
isDragAndDropEnabled: isDragAndDropEnabledOption && !isLivePageViewMode
|
|
24
25
|
})
|
|
25
26
|
});
|
|
26
27
|
};
|
package/dist/esm/ui/toolbar.js
CHANGED
|
@@ -410,11 +410,17 @@ export var getToolbarConfig = function getToolbarConfig(getEditorContainerWidth,
|
|
|
410
410
|
var areAnyNewToolbarFlagsEnabled = areToolbarFlagsEnabled(Boolean(api === null || api === void 0 ? void 0 : api.toolbar));
|
|
411
411
|
if (editorExperiment('platform_editor_controls', 'variant1')) {
|
|
412
412
|
var _api$editorViewMode;
|
|
413
|
-
var
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
413
|
+
var isDragHandleMenuOpened = false;
|
|
414
|
+
var isTableRowOrColumnDragged = false;
|
|
415
|
+
if (options !== null && options !== void 0 && options.dragAndDropEnabled) {
|
|
416
|
+
var _getDragDropPluginSta = getDragDropPluginState(state),
|
|
417
|
+
_getDragDropPluginSta2 = _getDragDropPluginSta.isDragMenuOpen,
|
|
418
|
+
isDragMenuOpen = _getDragDropPluginSta2 === void 0 ? false : _getDragDropPluginSta2,
|
|
419
|
+
_getDragDropPluginSta3 = _getDragDropPluginSta.isDragging,
|
|
420
|
+
isDragging = _getDragDropPluginSta3 === void 0 ? false : _getDragDropPluginSta3;
|
|
421
|
+
isDragHandleMenuOpened = isDragMenuOpen;
|
|
422
|
+
isTableRowOrColumnDragged = isDragging;
|
|
423
|
+
}
|
|
418
424
|
var isTableOrColumnResizing = !!(resizeState !== null && resizeState !== void 0 && resizeState.dragging || tableWidthState !== null && tableWidthState !== void 0 && tableWidthState.resizing);
|
|
419
425
|
var isTableMenuOpened = pluginState.isContextualMenuOpen || isDragHandleMenuOpened;
|
|
420
426
|
var isTableState = isTableRowOrColumnDragged || isTableOrColumnResizing || isTableMenuOpened;
|
|
@@ -4,5 +4,5 @@ import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
|
|
|
4
4
|
import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
5
5
|
import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
6
6
|
import type { PluginInjectionAPI, PluginInjectionAPIWithA11y } from '../types';
|
|
7
|
-
export declare function keymapPlugin(getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, nodeViewPortalProviderAPI: PortalProviderAPI, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableAlignmentEnabled?: boolean, isFullWidthEnabled?: boolean, pluginInjectionApi?: PluginInjectionAPIWithA11y, getIntl?: () => IntlShape, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, isTableResizingEnabled?: boolean): SafePlugin;
|
|
7
|
+
export declare function keymapPlugin(getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, nodeViewPortalProviderAPI: PortalProviderAPI, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, dragAndDropEnabled?: boolean, isTableScalingEnabled?: boolean, isTableAlignmentEnabled?: boolean, isFullWidthEnabled?: boolean, pluginInjectionApi?: PluginInjectionAPIWithA11y, getIntl?: () => IntlShape, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, isTableResizingEnabled?: boolean): SafePlugin;
|
|
8
8
|
export default keymapPlugin;
|
|
@@ -5,4 +5,4 @@ import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
|
|
|
5
5
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
6
6
|
import type { GetEditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
|
|
7
7
|
import type { PluginConfig, PluginInjectionAPI } from '../types';
|
|
8
|
-
export declare const createPlugin: (dispatchAnalyticsEvent: DispatchAnalyticsEvent, dispatch: Dispatch, portalProviderAPI: PortalProviderAPI, nodeViewPortalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginConfig: PluginConfig, getEditorContainerWidth: GetEditorContainerWidth, getEditorFeatureFlags: GetEditorFeatureFlags, getIntl: () => IntlShape, fullWidthModeEnabled?: boolean, previousFullWidthModeEnabled?: boolean, editorAnalyticsAPI?: EditorAnalyticsAPI, pluginInjectionApi?: PluginInjectionAPI, isTableScalingEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, allowFixedColumnWidthOption?: boolean) => SafePlugin<import("../types").TablePluginState>;
|
|
8
|
+
export declare const createPlugin: (dispatchAnalyticsEvent: DispatchAnalyticsEvent, dispatch: Dispatch, portalProviderAPI: PortalProviderAPI, nodeViewPortalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginConfig: PluginConfig, getEditorContainerWidth: GetEditorContainerWidth, getEditorFeatureFlags: GetEditorFeatureFlags, getIntl: () => IntlShape, fullWidthModeEnabled?: boolean, previousFullWidthModeEnabled?: boolean, dragAndDropEnabled?: boolean, editorAnalyticsAPI?: EditorAnalyticsAPI, pluginInjectionApi?: PluginInjectionAPI, isTableScalingEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, allowFixedColumnWidthOption?: boolean) => SafePlugin<import("../types").TablePluginState>;
|
|
@@ -23,6 +23,12 @@ export interface TablePluginOptions {
|
|
|
23
23
|
* Note: This feature requires ADF schema changes to be supported.
|
|
24
24
|
*/
|
|
25
25
|
allowFixedColumnWidthOption?: boolean;
|
|
26
|
+
/**
|
|
27
|
+
* @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-49683 Internal documentation for deprecation (no external access)}
|
|
28
|
+
* Deprecating this prop to enable drag and drop in tables by default.
|
|
29
|
+
* See {@link https://hello.atlassian.net/wiki/spaces/EDITOR/pages/6312469305/Deprecating+legacy+table+controls} for rollout plan
|
|
30
|
+
**/
|
|
31
|
+
dragAndDropEnabled?: boolean;
|
|
26
32
|
fullWidthEnabled?: boolean;
|
|
27
33
|
getEditorFeatureFlags?: GetEditorFeatureFlags;
|
|
28
34
|
isChromelessEditor?: boolean;
|
|
@@ -5,7 +5,8 @@
|
|
|
5
5
|
import { jsx } from '@emotion/react';
|
|
6
6
|
import type { FeatureFlags } from '@atlaskit/editor-common/types';
|
|
7
7
|
import type { PluginInjectionAPI } from '../types';
|
|
8
|
-
export declare const GlobalStylesWrapper: ({ featureFlags, api, }: {
|
|
8
|
+
export declare const GlobalStylesWrapper: ({ featureFlags, isDragAndDropEnabledOption, api, }: {
|
|
9
9
|
api?: PluginInjectionAPI;
|
|
10
10
|
featureFlags: FeatureFlags | undefined;
|
|
11
|
+
isDragAndDropEnabledOption?: boolean;
|
|
11
12
|
}) => jsx.JSX.Element;
|
|
@@ -4,5 +4,5 @@ import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
|
|
|
4
4
|
import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
5
5
|
import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
|
|
6
6
|
import type { PluginInjectionAPI, PluginInjectionAPIWithA11y } from '../types';
|
|
7
|
-
export declare function keymapPlugin(getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, nodeViewPortalProviderAPI: PortalProviderAPI, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, isTableScalingEnabled?: boolean, isTableAlignmentEnabled?: boolean, isFullWidthEnabled?: boolean, pluginInjectionApi?: PluginInjectionAPIWithA11y, getIntl?: () => IntlShape, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, isTableResizingEnabled?: boolean): SafePlugin;
|
|
7
|
+
export declare function keymapPlugin(getEditorContainerWidth: GetEditorContainerWidth, api: PluginInjectionAPI | undefined | null, nodeViewPortalProviderAPI: PortalProviderAPI, editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null, dragAndDropEnabled?: boolean, isTableScalingEnabled?: boolean, isTableAlignmentEnabled?: boolean, isFullWidthEnabled?: boolean, pluginInjectionApi?: PluginInjectionAPIWithA11y, getIntl?: () => IntlShape, isTableFixedColumnWidthsOptionEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, isTableResizingEnabled?: boolean): SafePlugin;
|
|
8
8
|
export default keymapPlugin;
|
|
@@ -5,4 +5,4 @@ import type { PortalProviderAPI } from '@atlaskit/editor-common/portal';
|
|
|
5
5
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
6
6
|
import type { GetEditorContainerWidth, GetEditorFeatureFlags } from '@atlaskit/editor-common/types';
|
|
7
7
|
import type { PluginConfig, PluginInjectionAPI } from '../types';
|
|
8
|
-
export declare const createPlugin: (dispatchAnalyticsEvent: DispatchAnalyticsEvent, dispatch: Dispatch, portalProviderAPI: PortalProviderAPI, nodeViewPortalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginConfig: PluginConfig, getEditorContainerWidth: GetEditorContainerWidth, getEditorFeatureFlags: GetEditorFeatureFlags, getIntl: () => IntlShape, fullWidthModeEnabled?: boolean, previousFullWidthModeEnabled?: boolean, editorAnalyticsAPI?: EditorAnalyticsAPI, pluginInjectionApi?: PluginInjectionAPI, isTableScalingEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, allowFixedColumnWidthOption?: boolean) => SafePlugin<import("../types").TablePluginState>;
|
|
8
|
+
export declare const createPlugin: (dispatchAnalyticsEvent: DispatchAnalyticsEvent, dispatch: Dispatch, portalProviderAPI: PortalProviderAPI, nodeViewPortalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, pluginConfig: PluginConfig, getEditorContainerWidth: GetEditorContainerWidth, getEditorFeatureFlags: GetEditorFeatureFlags, getIntl: () => IntlShape, fullWidthModeEnabled?: boolean, previousFullWidthModeEnabled?: boolean, dragAndDropEnabled?: boolean, editorAnalyticsAPI?: EditorAnalyticsAPI, pluginInjectionApi?: PluginInjectionAPI, isTableScalingEnabled?: boolean, shouldUseIncreasedScalingPercent?: boolean, isCommentEditor?: boolean, isChromelessEditor?: boolean, allowFixedColumnWidthOption?: boolean) => SafePlugin<import("../types").TablePluginState>;
|
|
@@ -23,6 +23,12 @@ export interface TablePluginOptions {
|
|
|
23
23
|
* Note: This feature requires ADF schema changes to be supported.
|
|
24
24
|
*/
|
|
25
25
|
allowFixedColumnWidthOption?: boolean;
|
|
26
|
+
/**
|
|
27
|
+
* @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-49683 Internal documentation for deprecation (no external access)}
|
|
28
|
+
* Deprecating this prop to enable drag and drop in tables by default.
|
|
29
|
+
* See {@link https://hello.atlassian.net/wiki/spaces/EDITOR/pages/6312469305/Deprecating+legacy+table+controls} for rollout plan
|
|
30
|
+
**/
|
|
31
|
+
dragAndDropEnabled?: boolean;
|
|
26
32
|
fullWidthEnabled?: boolean;
|
|
27
33
|
getEditorFeatureFlags?: GetEditorFeatureFlags;
|
|
28
34
|
isChromelessEditor?: boolean;
|
|
@@ -5,7 +5,8 @@
|
|
|
5
5
|
import { jsx } from '@emotion/react';
|
|
6
6
|
import type { FeatureFlags } from '@atlaskit/editor-common/types';
|
|
7
7
|
import type { PluginInjectionAPI } from '../types';
|
|
8
|
-
export declare const GlobalStylesWrapper: ({ featureFlags, api, }: {
|
|
8
|
+
export declare const GlobalStylesWrapper: ({ featureFlags, isDragAndDropEnabledOption, api, }: {
|
|
9
9
|
api?: PluginInjectionAPI;
|
|
10
10
|
featureFlags: FeatureFlags | undefined;
|
|
11
|
+
isDragAndDropEnabledOption?: boolean;
|
|
11
12
|
}) => jsx.JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-table",
|
|
3
|
-
"version": "19.0.
|
|
3
|
+
"version": "19.0.1",
|
|
4
4
|
"description": "Table plugin for the @atlaskit/editor",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0",
|
|
57
57
|
"@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.1.0",
|
|
58
58
|
"@atlaskit/primitives": "^19.0.0",
|
|
59
|
-
"@atlaskit/tmp-editor-statsig": "^62.
|
|
59
|
+
"@atlaskit/tmp-editor-statsig": "^62.3.0",
|
|
60
60
|
"@atlaskit/toggle": "^15.5.0",
|
|
61
61
|
"@atlaskit/tokens": "^13.0.0",
|
|
62
62
|
"@atlaskit/tooltip": "^21.1.0",
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
"uuid": "^3.1.0"
|
|
70
70
|
},
|
|
71
71
|
"peerDependencies": {
|
|
72
|
-
"@atlaskit/editor-common": "^112.
|
|
72
|
+
"@atlaskit/editor-common": "^112.22.0",
|
|
73
73
|
"react": "^18.2.0",
|
|
74
74
|
"react-dom": "^18.2.0",
|
|
75
75
|
"react-intl-next": "npm:react-intl@^5.18.1"
|