@atlaskit/editor-plugin-table 7.29.6 → 7.29.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-table
2
2
 
3
+ ## 7.29.7
4
+
5
+ ### Patch Changes
6
+
7
+ - [#152968](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/152968)
8
+ [`501e975100eab`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/501e975100eab) -
9
+ [ED-24137] feature flag clean up for the Cell Options menu a11y work
10
+
3
11
  ## 7.29.6
4
12
 
5
13
  ### Patch Changes
@@ -18,7 +18,6 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
18
18
  var _withPluginState = require("@atlaskit/editor-common/with-plugin-state");
19
19
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
20
20
  var _pmPlugins = require("@atlaskit/editor-tables/pm-plugins");
21
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
22
21
  var _insert = require("./commands/insert");
23
22
  var _createPluginConfig = require("./create-plugin-config");
24
23
  var _plugin = require("./pm-plugins/analytics/plugin");
@@ -393,7 +392,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
393
392
  isCellMenuOpenByKeyboard = _ref20.isCellMenuOpenByKeyboard;
394
393
  var allowControls = pluginConfig.allowControls;
395
394
  var stickyHeader = stickyHeadersState ? (0, _stickyHeaders.findStickyHeaderForTable)(stickyHeadersState, tablePos) : undefined;
396
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard && (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/_react.default.createElement(_FloatingContextualButton.default, {
395
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/_react.default.createElement(_FloatingContextualButton.default, {
397
396
  isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
398
397
  editorView: editorView,
399
398
  tableNode: tableNode,
@@ -9,7 +9,6 @@ var _analytics = require("@atlaskit/editor-common/analytics");
9
9
  var _keymaps = require("@atlaskit/editor-common/keymaps");
10
10
  var _commands = require("@atlaskit/editor-prosemirror/commands");
11
11
  var _keymap = require("@atlaskit/editor-prosemirror/keymap");
12
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
13
12
  var _commands2 = require("../commands");
14
13
  var _commandsWithAnalytics = require("../commands-with-analytics");
15
14
  var _columnResize = require("../commands/column-resize");
@@ -83,9 +82,7 @@ function keymapPlugin(getEditorContainerWidth, api, editorAnalyticsAPI, dragAndD
83
82
  ariaNotify: ariaNotifyPlugin,
84
83
  getIntl: getIntl
85
84
  }), list);
86
- if ((0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
87
- (0, _keymaps.bindKeymapWithCommand)(_keymaps.focusToContextMenuTrigger.common, (0, _commands2.setFocusToCellMenu)(), list);
88
- }
85
+ (0, _keymaps.bindKeymapWithCommand)(_keymaps.focusToContextMenuTrigger.common, (0, _commands2.setFocusToCellMenu)(), list);
89
86
  return (0, _keymap.keymap)(list);
90
87
  }
91
88
  var _default = exports.default = keymapPlugin;
@@ -18,7 +18,6 @@ var _uiMenu = require("@atlaskit/editor-common/ui-menu");
18
18
  var _utils = require("@atlaskit/editor-prosemirror/utils");
19
19
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
20
20
  var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-down"));
21
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
22
21
  var _commands = require("../../commands");
23
22
  var _types = require("../../types");
24
23
  var _FixedButton = _interopRequireDefault(require("./FixedButton"));
@@ -60,13 +59,11 @@ var FloatingContextualButtonInner = /*#__PURE__*/_react.default.memo(function (p
60
59
  var targetCellRef;
61
60
  targetCellRef = (0, _utils.findDomRefAtPos)(targetCellPosition, domAtPos);
62
61
  (0, _react.useEffect)(function () {
63
- if ((0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
64
- if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
65
- var state = editorView.state,
66
- dispatch = editorView.dispatch;
67
- // open the menu when the keyboard shortcut is pressed
68
- (0, _commands.toggleContextualMenu)()(state, dispatch);
69
- }
62
+ if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
63
+ var state = editorView.state,
64
+ dispatch = editorView.dispatch;
65
+ // open the menu when the keyboard shortcut is pressed
66
+ (0, _commands.toggleContextualMenu)()(state, dispatch);
70
67
  }
71
68
  }, [isCellMenuOpenByKeyboard, isContextualMenuOpen, editorView]);
72
69
  if (!targetCellRef || !(targetCellRef instanceof HTMLElement)) {
@@ -85,7 +82,7 @@ var FloatingContextualButtonInner = /*#__PURE__*/_react.default.memo(function (p
85
82
  className: _types.TableCssClassName.CONTEXTUAL_MENU_BUTTON,
86
83
  selected: isContextualMenuOpen,
87
84
  title: labelCellOptions,
88
- keymap: (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? _keymaps.focusToContextMenuTrigger : undefined,
85
+ keymap: _keymaps.focusToContextMenuTrigger,
89
86
  onClick: handleClick,
90
87
  iconBefore: (0, _react2.jsx)(_chevronDown.default, {
91
88
  label: "",
@@ -93,7 +90,7 @@ var FloatingContextualButtonInner = /*#__PURE__*/_react.default.memo(function (p
93
90
  isFacadeDisabled: true
94
91
  }),
95
92
  "aria-label": labelCellOptions,
96
- "aria-expanded": (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? isContextualMenuOpen : undefined
93
+ "aria-expanded": isContextualMenuOpen
97
94
  }));
98
95
  var parentSticky = targetCellRef.parentElement && targetCellRef.parentElement.className.indexOf('sticky') > -1;
99
96
  if (stickyHeader && parentSticky && tableWrapper) {
@@ -39,7 +39,6 @@ var _tableColumnAddRight = _interopRequireDefault(require("@atlaskit/icon/core/t
39
39
  var _tableColumnDelete = _interopRequireDefault(require("@atlaskit/icon/core/table-column-delete"));
40
40
  var _tableRowAddBelow = _interopRequireDefault(require("@atlaskit/icon/core/table-row-add-below"));
41
41
  var _tableRowDelete = _interopRequireDefault(require("@atlaskit/icon/core/table-row-delete"));
42
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
43
42
  var _primitives = require("@atlaskit/primitives");
44
43
  var _commands = require("../../commands");
45
44
  var _commandsWithAnalytics = require("../../commands-with-analytics");
@@ -106,16 +105,14 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
106
105
  targetCellPosition = _getPluginState.targetCellPosition,
107
106
  isDragAndDropEnabled = _getPluginState.isDragAndDropEnabled;
108
107
  if (allowBackgroundColor) {
109
- var _node$attrs, _node$attrs2, _node$attrs3;
108
+ var _node$attrs, _node$attrs2;
110
109
  var node = isOpen && targetCellPosition ? state.doc.nodeAt(targetCellPosition) : null;
111
110
  var background = (0, _editorPalette.hexToEditorBackgroundPaletteColor)((node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.background) || '#ffffff');
112
111
  var selectedRowIndex;
113
112
  var selectedColumnIndex;
114
- if ((0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
115
- var selectedRowAndColumnFromPalette = (0, _uiColor.getSelectedRowAndColumnFromPalette)(_uiColor.cellBackgroundColorPalette, background, _consts.colorPalletteColumns);
116
- selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
117
- selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
118
- }
113
+ var selectedRowAndColumnFromPalette = (0, _uiColor.getSelectedRowAndColumnFromPalette)(_uiColor.cellBackgroundColorPalette, background, _consts.colorPalletteColumns);
114
+ selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
115
+ selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
119
116
  return {
120
117
  content: isDragAndDropEnabled ? formatMessage(_messages.tableMessages.backgroundColor) : formatMessage(_messages.tableMessages.cellBackground),
121
118
  value: {
@@ -139,7 +136,7 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
139
136
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
140
137
  ,
141
138
  className: isDragAndDropEnabled ? _types.TableCssClassName.CONTEXTUAL_MENU_ICON_SMALL : _types.TableCssClassName.CONTEXTUAL_MENU_ICON
142
- }), (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? isSubmenuOpen && (0, _react2.jsx)("div", {
139
+ }), isSubmenuOpen && (0, _react2.jsx)("div", {
143
140
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
144
141
  className: _types.TableCssClassName.CONTEXTUAL_SUBMENU,
145
142
  ref: _this.handleSubMenuRef
@@ -169,22 +166,8 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
169
166
  paletteColorTooltipMessages: _uiColor.backgroundPaletteTooltipMessages,
170
167
  hexToPaletteColor: _editorPalette.hexToEditorBackgroundPaletteColor
171
168
  }
172
- }))) : isSubmenuOpen &&
173
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
174
- (0, _react2.jsx)("div", {
175
- className: _types.TableCssClassName.CONTEXTUAL_SUBMENU,
176
- ref: _this.handleSubMenuRef
177
- }, (0, _react2.jsx)(_uiColor.ColorPalette, {
178
- cols: 7,
179
- onClick: _this.setColor,
180
- selectedColor: (node === null || node === void 0 || (_node$attrs3 = node.attrs) === null || _node$attrs3 === void 0 ? void 0 : _node$attrs3.background) || '#ffffff',
181
- paletteOptions: {
182
- palette: _uiColor.cellBackgroundColorPalette,
183
- paletteColorTooltipMessages: _uiColor.backgroundPaletteTooltipMessages,
184
- hexToPaletteColor: _editorPalette.hexToEditorBackgroundPaletteColor
185
- }
186
- }))),
187
- 'aria-expanded': (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? isSubmenuOpen : undefined
169
+ })))),
170
+ 'aria-expanded': isSubmenuOpen
188
171
  };
189
172
  }
190
173
  });
@@ -510,7 +493,7 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
510
493
  tableWithFixedColumnWidthsOption = _ref4$tableWithFixedC === void 0 ? false : _ref4$tableWithFixedC;
511
494
  // context menu opened by keyboard and any item except 'background' activated
512
495
  // or color has been chosen from color palette
513
- if (isCellMenuOpenByKeyboard && (item.value.name !== 'background' || item.value.name === 'background' && _this.state.isSubmenuOpen) && (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
496
+ if (isCellMenuOpenByKeyboard && (item.value.name !== 'background' || item.value.name === 'background' && _this.state.isSubmenuOpen)) {
514
497
  var tr = state.tr;
515
498
  tr.setMeta(_pluginKey.pluginKey, {
516
499
  type: 'SET_CELL_MENU_OPEN',
@@ -579,7 +562,7 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
579
562
  // 1st time when user chooses the background color item.
580
563
  // 2nd when color has been chosen from color palette.
581
564
  // here we are handling the 1st call relying on the isSubmenuOpen state value
582
- if (isCellMenuOpenByKeyboard && !_this.state.isSubmenuOpen && (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
565
+ if (isCellMenuOpenByKeyboard && !_this.state.isSubmenuOpen) {
583
566
  _this.setState({
584
567
  isSubmenuOpen: true
585
568
  });
@@ -608,39 +591,32 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
608
591
  dispatch = _this$props12$editorV.dispatch,
609
592
  dom = _this$props12$editorV.dom,
610
593
  isCellMenuOpenByKeyboard = _this$props12.isCellMenuOpenByKeyboard;
611
- if ((0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
612
- if (payload) {
613
- var event = payload.event;
614
- if (event && event instanceof KeyboardEvent) {
615
- if (!_this.state.isSubmenuOpen) {
616
- if (arrowsList.has(event.key)) {
617
- // preventing default behavior for avoiding cursor jump to next/previous table column
618
- // when left/right arrow pressed.
619
- event.preventDefault();
620
- }
621
- (0, _commands.toggleContextualMenu)()(state, dispatch);
622
- _this.setState({
623
- isSubmenuOpen: false
624
- });
625
- (0, _commands.setFocusToCellMenu)(false)(state, dispatch);
626
- dom.focus();
594
+ if (payload) {
595
+ var event = payload.event;
596
+ if (event && event instanceof KeyboardEvent) {
597
+ if (!_this.state.isSubmenuOpen) {
598
+ if (arrowsList.has(event.key)) {
599
+ // preventing default behavior for avoiding cursor jump to next/previous table column
600
+ // when left/right arrow pressed.
601
+ event.preventDefault();
627
602
  }
628
- } else {
629
- // mouse click outside
630
603
  (0, _commands.toggleContextualMenu)()(state, dispatch);
631
604
  _this.setState({
632
605
  isSubmenuOpen: false
633
606
  });
634
- if (isCellMenuOpenByKeyboard) {
635
- (0, _commands.setFocusToCellMenu)(false)(state, dispatch);
636
- }
607
+ (0, _commands.setFocusToCellMenu)(false)(state, dispatch);
608
+ dom.focus();
609
+ }
610
+ } else {
611
+ // mouse click outside
612
+ (0, _commands.toggleContextualMenu)()(state, dispatch);
613
+ _this.setState({
614
+ isSubmenuOpen: false
615
+ });
616
+ if (isCellMenuOpenByKeyboard) {
617
+ (0, _commands.setFocusToCellMenu)(false)(state, dispatch);
637
618
  }
638
619
  }
639
- } else {
640
- (0, _commands.toggleContextualMenu)()(state, dispatch);
641
- _this.setState({
642
- isSubmenuOpen: false
643
- });
644
620
  }
645
621
  });
646
622
  (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleItemMouseEnter", function (_ref5) {
@@ -700,17 +676,15 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
700
676
  (0, _createClass2.default)(ContextualMenu, [{
701
677
  key: "componentDidMount",
702
678
  value: function componentDidMount() {
703
- if ((0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
704
- // ArrowKeyNavigationProvider in DropdownMenu expects that menu handle will stay focused
705
- // until user pressed ArrowDown.
706
- // Behavior above fails the A11Y requirement about first item in menu should be focused immediately.
707
- // so here is triggering componentDidUpdate inside dropdown to set focus on first element
708
- var isCellMenuOpenByKeyboard = this.props.isCellMenuOpenByKeyboard;
709
- if (isCellMenuOpenByKeyboard) {
710
- this.setState(_objectSpread(_objectSpread({}, this.state), {}, {
711
- isOpenAllowed: isCellMenuOpenByKeyboard
712
- }));
713
- }
679
+ // ArrowKeyNavigationProvider in DropdownMenu expects that menu handle will stay focused
680
+ // until user pressed ArrowDown.
681
+ // Behavior above fails the A11Y requirement about first item in menu should be focused immediately.
682
+ // so here is triggering componentDidUpdate inside dropdown to set focus on first element
683
+ var isCellMenuOpenByKeyboard = this.props.isCellMenuOpenByKeyboard;
684
+ if (isCellMenuOpenByKeyboard) {
685
+ this.setState(_objectSpread(_objectSpread({}, this.state), {}, {
686
+ isOpenAllowed: isCellMenuOpenByKeyboard
687
+ }));
714
688
  }
715
689
  }
716
690
  }, {
@@ -727,11 +701,7 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
727
701
  isDragAndDropEnabled = _getPluginState13.isDragAndDropEnabled;
728
702
  var items = isDragAndDropEnabled ? this.createNewContextMenuItems() : this.createOriginalContextMenuItems();
729
703
  var isOpenAllowed = false;
730
- if ((0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu')) {
731
- isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
732
- } else {
733
- isOpenAllowed = isOpen;
734
- }
704
+ isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
735
705
  return (0, _react2.jsx)("div", {
736
706
  "data-testid": "table-cell-contextual-menu",
737
707
  onMouseLeave: this.closeSubmenu,
@@ -743,7 +713,7 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
743
713
  ,
744
714
  arrowKeyNavigationProviderOptions: {
745
715
  type: _uiMenu.ArrowKeyNavigationType.MENU,
746
- disableArrowKeyNavigation: isCellMenuOpenByKeyboard && !this.state.isSubmenuOpen && (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? false : true
716
+ disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
747
717
  },
748
718
  items: items,
749
719
  isOpen: isOpenAllowed,
@@ -753,15 +723,15 @@ var ContextualMenu = exports.ContextualMenu = /*#__PURE__*/function (_Component)
753
723
  onMouseLeave: this.handleItemMouseLeave,
754
724
  fitHeight: 188,
755
725
  fitWidth: isDragAndDropEnabled ? _consts.contextualMenuDropdownWidthDnD : _consts.contextualMenuDropdownWidth,
756
- shouldFocusFirstItem: (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? function () {
726
+ shouldFocusFirstItem: function shouldFocusFirstItem() {
757
727
  return Boolean(isCellMenuOpenByKeyboard);
758
- } : undefined,
728
+ },
759
729
  boundariesElement: boundariesElement,
760
730
  offset: offset,
761
731
  section: isDragAndDropEnabled ? {
762
732
  hasSeparator: true
763
733
  } : undefined,
764
- allowEnterDefaultBehavior: (0, _platformFeatureFlags.fg)('platform_editor_a11y_table_context_menu') ? this.state.isSubmenuOpen : false
734
+ allowEnterDefaultBehavior: this.state.isSubmenuOpen
765
735
  }));
766
736
  }
767
737
  }]);
@@ -10,7 +10,6 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
10
10
  import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
11
11
  import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
12
12
  import { tableEditing } from '@atlaskit/editor-tables/pm-plugins';
13
- import { fg } from '@atlaskit/platform-feature-flags';
14
13
  import { insertTableWithSize } from './commands/insert';
15
14
  import { pluginConfig } from './create-plugin-config';
16
15
  import { createPlugin as createTableAnalyticsPlugin } from './pm-plugins/analytics/plugin';
@@ -387,7 +386,7 @@ const tablesPlugin = ({
387
386
  allowControls
388
387
  } = pluginConfig;
389
388
  const stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePos) : undefined;
390
- return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard && fg('platform_editor_a11y_table_context_menu')) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
389
+ return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
391
390
  isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
392
391
  editorView: editorView,
393
392
  tableNode: tableNode,
@@ -2,7 +2,6 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
2
2
  import { addColumnAfter, addColumnAfterVO, addColumnBefore, addColumnBeforeVO, addRowAfter, addRowAfterVO, addRowBefore, addRowBeforeVO, backspace, bindKeymapWithCommand, decreaseMediaSize, deleteColumn, deleteRow, escape, focusToContextMenuTrigger, increaseMediaSize, moveColumnLeft, moveColumnRight, moveLeft, moveRight, moveRowDown, moveRowUp, nextCell, previousCell, startColumnResizing, toggleTable } from '@atlaskit/editor-common/keymaps';
3
3
  import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
4
4
  import { keymap } from '@atlaskit/editor-prosemirror/keymap';
5
- import { fg } from '@atlaskit/platform-feature-flags';
6
5
  import { goToNextCell, moveCursorBackward, setFocusToCellMenu } from '../commands';
7
6
  import { addRowAroundSelection, changeColumnWidthByStepWithAnalytics, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut, deleteTableIfSelectedWithAnalytics, emptyMultipleCellsWithAnalytics } from '../commands-with-analytics';
8
7
  import { activateNextResizeArea, initiateKeyboardColumnResizing, stopKeyboardColumnResizing } from '../commands/column-resize';
@@ -65,9 +64,7 @@ export function keymapPlugin(getEditorContainerWidth, api, editorAnalyticsAPI, d
65
64
  ariaNotify: ariaNotifyPlugin,
66
65
  getIntl: getIntl
67
66
  }), list);
68
- if (fg('platform_editor_a11y_table_context_menu')) {
69
- bindKeymapWithCommand(focusToContextMenuTrigger.common, setFocusToCellMenu(), list);
70
- }
67
+ bindKeymapWithCommand(focusToContextMenuTrigger.common, setFocusToCellMenu(), list);
71
68
  return keymap(list);
72
69
  }
73
70
  export default keymapPlugin;
@@ -16,7 +16,6 @@ import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
16
16
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
17
17
  import { akEditorSmallZIndex } from '@atlaskit/editor-shared-styles';
18
18
  import ExpandIcon from '@atlaskit/icon/utility/migration/chevron-down';
19
- import { fg } from '@atlaskit/platform-feature-flags';
20
19
  import { toggleContextualMenu } from '../../commands';
21
20
  import { TableCssClassName as ClassName } from '../../types';
22
21
  import FixedButton from './FixedButton';
@@ -55,15 +54,13 @@ const FloatingContextualButtonInner = /*#__PURE__*/React.memo(props => {
55
54
  let targetCellRef;
56
55
  targetCellRef = findDomRefAtPos(targetCellPosition, domAtPos);
57
56
  useEffect(() => {
58
- if (fg('platform_editor_a11y_table_context_menu')) {
59
- if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
60
- const {
61
- state,
62
- dispatch
63
- } = editorView;
64
- // open the menu when the keyboard shortcut is pressed
65
- toggleContextualMenu()(state, dispatch);
66
- }
57
+ if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
58
+ const {
59
+ state,
60
+ dispatch
61
+ } = editorView;
62
+ // open the menu when the keyboard shortcut is pressed
63
+ toggleContextualMenu()(state, dispatch);
67
64
  }
68
65
  }, [isCellMenuOpenByKeyboard, isContextualMenuOpen, editorView]);
69
66
  if (!targetCellRef || !(targetCellRef instanceof HTMLElement)) {
@@ -82,7 +79,7 @@ const FloatingContextualButtonInner = /*#__PURE__*/React.memo(props => {
82
79
  className: ClassName.CONTEXTUAL_MENU_BUTTON,
83
80
  selected: isContextualMenuOpen,
84
81
  title: labelCellOptions,
85
- keymap: fg('platform_editor_a11y_table_context_menu') ? focusToContextMenuTrigger : undefined,
82
+ keymap: focusToContextMenuTrigger,
86
83
  onClick: handleClick,
87
84
  iconBefore: jsx(ExpandIcon, {
88
85
  label: "",
@@ -90,7 +87,7 @@ const FloatingContextualButtonInner = /*#__PURE__*/React.memo(props => {
90
87
  isFacadeDisabled: true
91
88
  }),
92
89
  "aria-label": labelCellOptions,
93
- "aria-expanded": fg('platform_editor_a11y_table_context_menu') ? isContextualMenuOpen : undefined
90
+ "aria-expanded": isContextualMenuOpen
94
91
  }));
95
92
  const parentSticky = targetCellRef.parentElement && targetCellRef.parentElement.className.indexOf('sticky') > -1;
96
93
  if (stickyHeader && parentSticky && tableWrapper) {
@@ -30,7 +30,6 @@ import TableColumnAddRightIcon from '@atlaskit/icon/core/table-column-add-right'
30
30
  import TableColumnDeleteIcon from '@atlaskit/icon/core/table-column-delete';
31
31
  import TableRowAddBelowIcon from '@atlaskit/icon/core/table-row-add-below';
32
32
  import TableRowDeleteIcon from '@atlaskit/icon/core/table-row-delete';
33
- import { fg } from '@atlaskit/platform-feature-flags';
34
33
  import { Box, xcss } from '@atlaskit/primitives';
35
34
  import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, setFocusToCellMenu, toggleContextualMenu } from '../../commands';
36
35
  import { deleteColumnsWithAnalytics, deleteRowsWithAnalytics, distributeColumnsWidthsWithAnalytics, emptyMultipleCellsWithAnalytics, insertColumnWithAnalytics, insertRowWithAnalytics, mergeCellsWithAnalytics, setColorWithAnalytics, sortColumnWithAnalytics, splitCellWithAnalytics } from '../../commands-with-analytics';
@@ -89,16 +88,14 @@ export class ContextualMenu extends Component {
89
88
  isDragAndDropEnabled
90
89
  } = getPluginState(editorView.state);
91
90
  if (allowBackgroundColor) {
92
- var _node$attrs, _node$attrs2, _node$attrs3;
91
+ var _node$attrs, _node$attrs2;
93
92
  const node = isOpen && targetCellPosition ? state.doc.nodeAt(targetCellPosition) : null;
94
93
  const background = hexToEditorBackgroundPaletteColor((node === null || node === void 0 ? void 0 : (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.background) || '#ffffff');
95
94
  let selectedRowIndex;
96
95
  let selectedColumnIndex;
97
- if (fg('platform_editor_a11y_table_context_menu')) {
98
- const selectedRowAndColumnFromPalette = getSelectedRowAndColumnFromPalette(cellBackgroundColorPalette, background, colorPalletteColumns);
99
- selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
100
- selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
101
- }
96
+ const selectedRowAndColumnFromPalette = getSelectedRowAndColumnFromPalette(cellBackgroundColorPalette, background, colorPalletteColumns);
97
+ selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
98
+ selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
102
99
  return {
103
100
  content: isDragAndDropEnabled ? formatMessage(messages.backgroundColor) : formatMessage(messages.cellBackground),
104
101
  value: {
@@ -122,7 +119,7 @@ export class ContextualMenu extends Component {
122
119
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
123
120
  ,
124
121
  className: isDragAndDropEnabled ? ClassName.CONTEXTUAL_MENU_ICON_SMALL : ClassName.CONTEXTUAL_MENU_ICON
125
- }), fg('platform_editor_a11y_table_context_menu') ? isSubmenuOpen && jsx("div", {
122
+ }), isSubmenuOpen && jsx("div", {
126
123
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
127
124
  className: ClassName.CONTEXTUAL_SUBMENU,
128
125
  ref: this.handleSubMenuRef
@@ -152,22 +149,8 @@ export class ContextualMenu extends Component {
152
149
  paletteColorTooltipMessages: backgroundPaletteTooltipMessages,
153
150
  hexToPaletteColor: hexToEditorBackgroundPaletteColor
154
151
  }
155
- }))) : isSubmenuOpen &&
156
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
157
- jsx("div", {
158
- className: ClassName.CONTEXTUAL_SUBMENU,
159
- ref: this.handleSubMenuRef
160
- }, jsx(ColorPalette, {
161
- cols: 7,
162
- onClick: this.setColor,
163
- selectedColor: (node === null || node === void 0 ? void 0 : (_node$attrs3 = node.attrs) === null || _node$attrs3 === void 0 ? void 0 : _node$attrs3.background) || '#ffffff',
164
- paletteOptions: {
165
- palette: cellBackgroundColorPalette,
166
- paletteColorTooltipMessages: backgroundPaletteTooltipMessages,
167
- hexToPaletteColor: hexToEditorBackgroundPaletteColor
168
- }
169
- }))),
170
- 'aria-expanded': fg('platform_editor_a11y_table_context_menu') ? isSubmenuOpen : undefined
152
+ })))),
153
+ 'aria-expanded': isSubmenuOpen
171
154
  };
172
155
  }
173
156
  });
@@ -541,7 +524,7 @@ export class ContextualMenu extends Component {
541
524
  } = getEditorFeatureFlags ? getEditorFeatureFlags() : {};
542
525
  // context menu opened by keyboard and any item except 'background' activated
543
526
  // or color has been chosen from color palette
544
- if (isCellMenuOpenByKeyboard && (item.value.name !== 'background' || item.value.name === 'background' && this.state.isSubmenuOpen) && fg('platform_editor_a11y_table_context_menu')) {
527
+ if (isCellMenuOpenByKeyboard && (item.value.name !== 'background' || item.value.name === 'background' && this.state.isSubmenuOpen)) {
545
528
  const {
546
529
  tr
547
530
  } = state;
@@ -615,7 +598,7 @@ export class ContextualMenu extends Component {
615
598
  // 1st time when user chooses the background color item.
616
599
  // 2nd when color has been chosen from color palette.
617
600
  // here we are handling the 1st call relying on the isSubmenuOpen state value
618
- if (isCellMenuOpenByKeyboard && !this.state.isSubmenuOpen && fg('platform_editor_a11y_table_context_menu')) {
601
+ if (isCellMenuOpenByKeyboard && !this.state.isSubmenuOpen) {
619
602
  this.setState({
620
603
  isSubmenuOpen: true
621
604
  });
@@ -648,41 +631,34 @@ export class ContextualMenu extends Component {
648
631
  },
649
632
  isCellMenuOpenByKeyboard
650
633
  } = this.props;
651
- if (fg('platform_editor_a11y_table_context_menu')) {
652
- if (payload) {
653
- const {
654
- event
655
- } = payload;
656
- if (event && event instanceof KeyboardEvent) {
657
- if (!this.state.isSubmenuOpen) {
658
- if (arrowsList.has(event.key)) {
659
- // preventing default behavior for avoiding cursor jump to next/previous table column
660
- // when left/right arrow pressed.
661
- event.preventDefault();
662
- }
663
- toggleContextualMenu()(state, dispatch);
664
- this.setState({
665
- isSubmenuOpen: false
666
- });
667
- setFocusToCellMenu(false)(state, dispatch);
668
- dom.focus();
634
+ if (payload) {
635
+ const {
636
+ event
637
+ } = payload;
638
+ if (event && event instanceof KeyboardEvent) {
639
+ if (!this.state.isSubmenuOpen) {
640
+ if (arrowsList.has(event.key)) {
641
+ // preventing default behavior for avoiding cursor jump to next/previous table column
642
+ // when left/right arrow pressed.
643
+ event.preventDefault();
669
644
  }
670
- } else {
671
- // mouse click outside
672
645
  toggleContextualMenu()(state, dispatch);
673
646
  this.setState({
674
647
  isSubmenuOpen: false
675
648
  });
676
- if (isCellMenuOpenByKeyboard) {
677
- setFocusToCellMenu(false)(state, dispatch);
678
- }
649
+ setFocusToCellMenu(false)(state, dispatch);
650
+ dom.focus();
651
+ }
652
+ } else {
653
+ // mouse click outside
654
+ toggleContextualMenu()(state, dispatch);
655
+ this.setState({
656
+ isSubmenuOpen: false
657
+ });
658
+ if (isCellMenuOpenByKeyboard) {
659
+ setFocusToCellMenu(false)(state, dispatch);
679
660
  }
680
661
  }
681
- } else {
682
- toggleContextualMenu()(state, dispatch);
683
- this.setState({
684
- isSubmenuOpen: false
685
- });
686
662
  }
687
663
  });
688
664
  _defineProperty(this, "handleItemMouseEnter", ({
@@ -747,20 +723,18 @@ export class ContextualMenu extends Component {
747
723
  });
748
724
  }
749
725
  componentDidMount() {
750
- if (fg('platform_editor_a11y_table_context_menu')) {
751
- // ArrowKeyNavigationProvider in DropdownMenu expects that menu handle will stay focused
752
- // until user pressed ArrowDown.
753
- // Behavior above fails the A11Y requirement about first item in menu should be focused immediately.
754
- // so here is triggering componentDidUpdate inside dropdown to set focus on first element
755
- const {
756
- isCellMenuOpenByKeyboard
757
- } = this.props;
758
- if (isCellMenuOpenByKeyboard) {
759
- this.setState({
760
- ...this.state,
761
- isOpenAllowed: isCellMenuOpenByKeyboard
762
- });
763
- }
726
+ // ArrowKeyNavigationProvider in DropdownMenu expects that menu handle will stay focused
727
+ // until user pressed ArrowDown.
728
+ // Behavior above fails the A11Y requirement about first item in menu should be focused immediately.
729
+ // so here is triggering componentDidUpdate inside dropdown to set focus on first element
730
+ const {
731
+ isCellMenuOpenByKeyboard
732
+ } = this.props;
733
+ if (isCellMenuOpenByKeyboard) {
734
+ this.setState({
735
+ ...this.state,
736
+ isOpenAllowed: isCellMenuOpenByKeyboard
737
+ });
764
738
  }
765
739
  }
766
740
  render() {
@@ -777,11 +751,7 @@ export class ContextualMenu extends Component {
777
751
  } = getPluginState(editorView.state);
778
752
  const items = isDragAndDropEnabled ? this.createNewContextMenuItems() : this.createOriginalContextMenuItems();
779
753
  let isOpenAllowed = false;
780
- if (fg('platform_editor_a11y_table_context_menu')) {
781
- isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
782
- } else {
783
- isOpenAllowed = isOpen;
784
- }
754
+ isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
785
755
  return jsx("div", {
786
756
  "data-testid": "table-cell-contextual-menu",
787
757
  onMouseLeave: this.closeSubmenu,
@@ -793,7 +763,7 @@ export class ContextualMenu extends Component {
793
763
  ,
794
764
  arrowKeyNavigationProviderOptions: {
795
765
  type: ArrowKeyNavigationType.MENU,
796
- disableArrowKeyNavigation: isCellMenuOpenByKeyboard && !this.state.isSubmenuOpen && fg('platform_editor_a11y_table_context_menu') ? false : true
766
+ disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
797
767
  },
798
768
  items: items,
799
769
  isOpen: isOpenAllowed,
@@ -803,15 +773,15 @@ export class ContextualMenu extends Component {
803
773
  onMouseLeave: this.handleItemMouseLeave,
804
774
  fitHeight: 188,
805
775
  fitWidth: isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth,
806
- shouldFocusFirstItem: fg('platform_editor_a11y_table_context_menu') ? () => {
776
+ shouldFocusFirstItem: () => {
807
777
  return Boolean(isCellMenuOpenByKeyboard);
808
- } : undefined,
778
+ },
809
779
  boundariesElement: boundariesElement,
810
780
  offset: offset,
811
781
  section: isDragAndDropEnabled ? {
812
782
  hasSeparator: true
813
783
  } : undefined,
814
- allowEnterDefaultBehavior: fg('platform_editor_a11y_table_context_menu') ? this.state.isSubmenuOpen : false
784
+ allowEnterDefaultBehavior: this.state.isSubmenuOpen
815
785
  }));
816
786
  }
817
787
  }
@@ -13,7 +13,6 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
13
13
  import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
14
14
  import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
15
15
  import { tableEditing } from '@atlaskit/editor-tables/pm-plugins';
16
- import { fg } from '@atlaskit/platform-feature-flags';
17
16
  import { insertTableWithSize } from './commands/insert';
18
17
  import { pluginConfig } from './create-plugin-config';
19
18
  import { createPlugin as createTableAnalyticsPlugin } from './pm-plugins/analytics/plugin';
@@ -386,7 +385,7 @@ var tablesPlugin = function tablesPlugin(_ref) {
386
385
  isCellMenuOpenByKeyboard = _ref20.isCellMenuOpenByKeyboard;
387
386
  var allowControls = pluginConfig.allowControls;
388
387
  var stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePos) : undefined;
389
- return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard && fg('platform_editor_a11y_table_context_menu')) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
388
+ return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
390
389
  isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
391
390
  editorView: editorView,
392
391
  tableNode: tableNode,