@atlaskit/editor-plugin-table 7.29.6 → 7.29.7

package/dist/esm/pm-plugins/keymap.js

@@ -2,7 +2,6 @@ import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 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';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { goToNextCell, moveCursorBackward, setFocusToCellMenu } from '../commands';
 import { addRowAroundSelection, changeColumnWidthByStepWithAnalytics, deleteSelectedRowsOrColumnsWithAnalyticsViaShortcut, deleteTableIfSelectedWithAnalytics, emptyMultipleCellsWithAnalytics } from '../commands-with-analytics';
 import { activateNextResizeArea, initiateKeyboardColumnResizing, stopKeyboardColumnResizing } from '../commands/column-resize';
@@ -76,9 +75,7 @@ export function keymapPlugin(getEditorContainerWidth, api, editorAnalyticsAPI, d
     ariaNotify: ariaNotifyPlugin,
     getIntl: getIntl
   }), list);
-  if (fg('platform_editor_a11y_table_context_menu')) {
-    bindKeymapWithCommand(focusToContextMenuTrigger.common, setFocusToCellMenu(), list);
-  }
+  bindKeymapWithCommand(focusToContextMenuTrigger.common, setFocusToCellMenu(), list);
   return keymap(list);
 }
 export default keymapPlugin;

package/dist/esm/ui/FloatingContextualButton/index.js

@@ -16,7 +16,6 @@ import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
 import { akEditorSmallZIndex } from '@atlaskit/editor-shared-styles';
 import ExpandIcon from '@atlaskit/icon/utility/migration/chevron-down';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { toggleContextualMenu } from '../../commands';
 import { TableCssClassName as ClassName } from '../../types';
 import FixedButton from './FixedButton';
@@ -49,13 +48,11 @@ var FloatingContextualButtonInner = /*#__PURE__*/React.memo(function (props) {
   var targetCellRef;
   targetCellRef = findDomRefAtPos(targetCellPosition, domAtPos);
   useEffect(function () {
-    if (fg('platform_editor_a11y_table_context_menu')) {
-      if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
-        var state = editorView.state,
-          dispatch = editorView.dispatch;
-        // open the menu when the keyboard shortcut is pressed
-        toggleContextualMenu()(state, dispatch);
-      }
+    if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
+      var state = editorView.state,
+        dispatch = editorView.dispatch;
+      // open the menu when the keyboard shortcut is pressed
+      toggleContextualMenu()(state, dispatch);
     }
   }, [isCellMenuOpenByKeyboard, isContextualMenuOpen, editorView]);
   if (!targetCellRef || !(targetCellRef instanceof HTMLElement)) {
@@ -74,7 +71,7 @@ var FloatingContextualButtonInner = /*#__PURE__*/React.memo(function (props) {
     className: ClassName.CONTEXTUAL_MENU_BUTTON,
     selected: isContextualMenuOpen,
     title: labelCellOptions,
-    keymap: fg('platform_editor_a11y_table_context_menu') ? focusToContextMenuTrigger : undefined,
+    keymap: focusToContextMenuTrigger,
     onClick: handleClick,
     iconBefore: jsx(ExpandIcon, {
       label: "",
@@ -82,7 +79,7 @@ var FloatingContextualButtonInner = /*#__PURE__*/React.memo(function (props) {
       isFacadeDisabled: true
     }),
     "aria-label": labelCellOptions,
-    "aria-expanded": fg('platform_editor_a11y_table_context_menu') ? isContextualMenuOpen : undefined
+    "aria-expanded": isContextualMenuOpen
   }));
   var parentSticky = targetCellRef.parentElement && targetCellRef.parentElement.className.indexOf('sticky') > -1;
   if (stickyHeader && parentSticky && tableWrapper) {

package/dist/esm/ui/FloatingContextualMenu/ContextualMenu.js

@@ -41,7 +41,6 @@ import TableColumnAddRightIcon from '@atlaskit/icon/core/table-column-add-right'
 import TableColumnDeleteIcon from '@atlaskit/icon/core/table-column-delete';
 import TableRowAddBelowIcon from '@atlaskit/icon/core/table-row-add-below';
 import TableRowDeleteIcon from '@atlaskit/icon/core/table-row-delete';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { Box, xcss } from '@atlaskit/primitives';
 import { clearHoverSelection, hoverColumns, hoverMergedCells, hoverRows, setFocusToCellMenu, toggleContextualMenu } from '../../commands';
 import { deleteColumnsWithAnalytics, deleteRowsWithAnalytics, distributeColumnsWidthsWithAnalytics, emptyMultipleCellsWithAnalytics, insertColumnWithAnalytics, insertRowWithAnalytics, mergeCellsWithAnalytics, setColorWithAnalytics, sortColumnWithAnalytics, splitCellWithAnalytics } from '../../commands-with-analytics';
@@ -99,16 +98,14 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
         targetCellPosition = _getPluginState.targetCellPosition,
         isDragAndDropEnabled = _getPluginState.isDragAndDropEnabled;
       if (allowBackgroundColor) {
-        var _node$attrs, _node$attrs2, _node$attrs3;
+        var _node$attrs, _node$attrs2;
         var node = isOpen && targetCellPosition ? state.doc.nodeAt(targetCellPosition) : null;
         var background = hexToEditorBackgroundPaletteColor((node === null || node === void 0 || (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.background) || '#ffffff');
         var selectedRowIndex;
         var selectedColumnIndex;
-        if (fg('platform_editor_a11y_table_context_menu')) {
-          var selectedRowAndColumnFromPalette = getSelectedRowAndColumnFromPalette(cellBackgroundColorPalette, background, colorPalletteColumns);
-          selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
-          selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
-        }
+        var selectedRowAndColumnFromPalette = getSelectedRowAndColumnFromPalette(cellBackgroundColorPalette, background, colorPalletteColumns);
+        selectedRowIndex = selectedRowAndColumnFromPalette.selectedRowIndex;
+        selectedColumnIndex = selectedRowAndColumnFromPalette.selectedColumnIndex;
         return {
           content: isDragAndDropEnabled ? formatMessage(messages.backgroundColor) : formatMessage(messages.cellBackground),
           value: {
@@ -132,7 +129,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
             // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
             ,
             className: isDragAndDropEnabled ? ClassName.CONTEXTUAL_MENU_ICON_SMALL : ClassName.CONTEXTUAL_MENU_ICON
-          }), fg('platform_editor_a11y_table_context_menu') ? isSubmenuOpen && jsx("div", {
+          }), isSubmenuOpen && jsx("div", {
             // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
             className: ClassName.CONTEXTUAL_SUBMENU,
             ref: _this.handleSubMenuRef
@@ -162,22 +159,8 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
               paletteColorTooltipMessages: backgroundPaletteTooltipMessages,
               hexToPaletteColor: hexToEditorBackgroundPaletteColor
             }
-          }))) : isSubmenuOpen &&
-          // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-          jsx("div", {
-            className: ClassName.CONTEXTUAL_SUBMENU,
-            ref: _this.handleSubMenuRef
-          }, jsx(ColorPalette, {
-            cols: 7,
-            onClick: _this.setColor,
-            selectedColor: (node === null || node === void 0 || (_node$attrs3 = node.attrs) === null || _node$attrs3 === void 0 ? void 0 : _node$attrs3.background) || '#ffffff',
-            paletteOptions: {
-              palette: cellBackgroundColorPalette,
-              paletteColorTooltipMessages: backgroundPaletteTooltipMessages,
-              hexToPaletteColor: hexToEditorBackgroundPaletteColor
-            }
-          }))),
-          'aria-expanded': fg('platform_editor_a11y_table_context_menu') ? isSubmenuOpen : undefined
+          })))),
+          'aria-expanded': isSubmenuOpen
         };
       }
     });
@@ -503,7 +486,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
         tableWithFixedColumnWidthsOption = _ref4$tableWithFixedC === void 0 ? false : _ref4$tableWithFixedC;
       // context menu opened by keyboard and any item except 'background' activated
       // or color has been chosen from color palette
-      if (isCellMenuOpenByKeyboard && (item.value.name !== 'background' || item.value.name === 'background' && _this.state.isSubmenuOpen) && fg('platform_editor_a11y_table_context_menu')) {
+      if (isCellMenuOpenByKeyboard && (item.value.name !== 'background' || item.value.name === 'background' && _this.state.isSubmenuOpen)) {
         var tr = state.tr;
         tr.setMeta(tablePluginKey, {
           type: 'SET_CELL_MENU_OPEN',
@@ -572,7 +555,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
             // 1st time when user chooses the background color item.
             // 2nd when color has been chosen from color palette.
             // here we are handling the 1st call relying on the isSubmenuOpen state value
-            if (isCellMenuOpenByKeyboard && !_this.state.isSubmenuOpen && fg('platform_editor_a11y_table_context_menu')) {
+            if (isCellMenuOpenByKeyboard && !_this.state.isSubmenuOpen) {
               _this.setState({
                 isSubmenuOpen: true
               });
@@ -601,39 +584,32 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
         dispatch = _this$props12$editorV.dispatch,
         dom = _this$props12$editorV.dom,
         isCellMenuOpenByKeyboard = _this$props12.isCellMenuOpenByKeyboard;
-      if (fg('platform_editor_a11y_table_context_menu')) {
-        if (payload) {
-          var event = payload.event;
-          if (event && event instanceof KeyboardEvent) {
-            if (!_this.state.isSubmenuOpen) {
-              if (arrowsList.has(event.key)) {
-                // preventing default behavior for avoiding cursor jump to next/previous table column
-                // when left/right arrow pressed.
-                event.preventDefault();
-              }
-              toggleContextualMenu()(state, dispatch);
-              _this.setState({
-                isSubmenuOpen: false
-              });
-              setFocusToCellMenu(false)(state, dispatch);
-              dom.focus();
+      if (payload) {
+        var event = payload.event;
+        if (event && event instanceof KeyboardEvent) {
+          if (!_this.state.isSubmenuOpen) {
+            if (arrowsList.has(event.key)) {
+              // preventing default behavior for avoiding cursor jump to next/previous table column
+              // when left/right arrow pressed.
+              event.preventDefault();
             }
-          } else {
-            // mouse click outside
             toggleContextualMenu()(state, dispatch);
             _this.setState({
               isSubmenuOpen: false
             });
-            if (isCellMenuOpenByKeyboard) {
-              setFocusToCellMenu(false)(state, dispatch);
-            }
+            setFocusToCellMenu(false)(state, dispatch);
+            dom.focus();
+          }
+        } else {
+          // mouse click outside
+          toggleContextualMenu()(state, dispatch);
+          _this.setState({
+            isSubmenuOpen: false
+          });
+          if (isCellMenuOpenByKeyboard) {
+            setFocusToCellMenu(false)(state, dispatch);
           }
         }
-      } else {
-        toggleContextualMenu()(state, dispatch);
-        _this.setState({
-          isSubmenuOpen: false
-        });
       }
     });
     _defineProperty(_assertThisInitialized(_this), "handleItemMouseEnter", function (_ref5) {
@@ -693,17 +669,15 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
   _createClass(ContextualMenu, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      if (fg('platform_editor_a11y_table_context_menu')) {
-        // ArrowKeyNavigationProvider in DropdownMenu expects that menu handle will stay focused
-        // until user pressed ArrowDown.
-        // Behavior above fails the A11Y requirement about first item in menu should be focused immediately.
-        // so here is triggering componentDidUpdate inside dropdown to set focus on first element
-        var isCellMenuOpenByKeyboard = this.props.isCellMenuOpenByKeyboard;
-        if (isCellMenuOpenByKeyboard) {
-          this.setState(_objectSpread(_objectSpread({}, this.state), {}, {
-            isOpenAllowed: isCellMenuOpenByKeyboard
-          }));
-        }
+      // ArrowKeyNavigationProvider in DropdownMenu expects that menu handle will stay focused
+      // until user pressed ArrowDown.
+      // Behavior above fails the A11Y requirement about first item in menu should be focused immediately.
+      // so here is triggering componentDidUpdate inside dropdown to set focus on first element
+      var isCellMenuOpenByKeyboard = this.props.isCellMenuOpenByKeyboard;
+      if (isCellMenuOpenByKeyboard) {
+        this.setState(_objectSpread(_objectSpread({}, this.state), {}, {
+          isOpenAllowed: isCellMenuOpenByKeyboard
+        }));
       }
     }
   }, {
@@ -720,11 +694,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
         isDragAndDropEnabled = _getPluginState13.isDragAndDropEnabled;
       var items = isDragAndDropEnabled ? this.createNewContextMenuItems() : this.createOriginalContextMenuItems();
       var isOpenAllowed = false;
-      if (fg('platform_editor_a11y_table_context_menu')) {
-        isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
-      } else {
-        isOpenAllowed = isOpen;
-      }
+      isOpenAllowed = isCellMenuOpenByKeyboard ? this.state.isOpenAllowed : isOpen;
       return jsx("div", {
         "data-testid": "table-cell-contextual-menu",
         onMouseLeave: this.closeSubmenu,
@@ -736,7 +706,7 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
         ,
         arrowKeyNavigationProviderOptions: {
           type: ArrowKeyNavigationType.MENU,
-          disableArrowKeyNavigation: isCellMenuOpenByKeyboard && !this.state.isSubmenuOpen && fg('platform_editor_a11y_table_context_menu') ? false : true
+          disableArrowKeyNavigation: !isCellMenuOpenByKeyboard || this.state.isSubmenuOpen
         },
         items: items,
         isOpen: isOpenAllowed,
@@ -746,15 +716,15 @@ export var ContextualMenu = /*#__PURE__*/function (_Component) {
         onMouseLeave: this.handleItemMouseLeave,
         fitHeight: 188,
         fitWidth: isDragAndDropEnabled ? contextualMenuDropdownWidthDnD : contextualMenuDropdownWidth,
-        shouldFocusFirstItem: fg('platform_editor_a11y_table_context_menu') ? function () {
+        shouldFocusFirstItem: function shouldFocusFirstItem() {
           return Boolean(isCellMenuOpenByKeyboard);
-        } : undefined,
+        },
         boundariesElement: boundariesElement,
         offset: offset,
         section: isDragAndDropEnabled ? {
           hasSeparator: true
         } : undefined,
-        allowEnterDefaultBehavior: fg('platform_editor_a11y_table_context_menu') ? this.state.isSubmenuOpen : false
+        allowEnterDefaultBehavior: this.state.isSubmenuOpen
       }));
     }
   }]);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-table",
-	"version": "7.29.6",
+	"version": "7.29.7",
 	"description": "Table plugin for the @atlaskit/editor",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -109,9 +109,6 @@
 		"platform_editor_dark_mode_cell_header_color_fix": {
 			"type": "boolean"
 		},
-		"platform_editor_a11y_table_context_menu": {
-			"type": "boolean"
-		},
 		"platform_editor_breakout_use_css": {
 			"type": "boolean"
 		},

package/src/plugin.tsx

@@ -39,7 +39,6 @@ import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { tableEditing } from '@atlaskit/editor-tables/pm-plugins';
-import { fg } from '@atlaskit/platform-feature-flags';
 
 import { insertTableWithSize } from './commands/insert';
 import { pluginConfig } from './create-plugin-config';
@@ -576,9 +575,7 @@ const tablesPlugin: TablePlugin = ({ config: options, api }) => {
 							return (
 								<>
 									{targetCellPosition &&
-										(tableRef ||
-											(isCellMenuOpenByKeyboard &&
-												fg('platform_editor_a11y_table_context_menu'))) &&
+										(tableRef || isCellMenuOpenByKeyboard) &&
 										!isResizing &&
 										options &&
 										options.allowContextualMenu && (

package/src/pm-plugins/keymap.ts

@@ -34,7 +34,6 @@ import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { GetEditorContainerWidth } from '@atlaskit/editor-common/types';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
-import { fg } from '@atlaskit/platform-feature-flags';
 
 import { goToNextCell, moveCursorBackward, setFocusToCellMenu } from '../commands';
 import {
@@ -317,6 +316,7 @@ export function keymapPlugin(
 		),
 		list,
 	);
+	
 	bindKeymapWithCommand(
 		escape.common!,
 		stopKeyboardColumnResizing({
@@ -326,9 +326,7 @@ export function keymapPlugin(
 		list,
 	);
 
-	if (fg('platform_editor_a11y_table_context_menu')) {
-		bindKeymapWithCommand(focusToContextMenuTrigger.common!, setFocusToCellMenu(), list);
-	}
+	bindKeymapWithCommand(focusToContextMenuTrigger.common!, setFocusToCellMenu(), list);
 
 	return keymap(list) as SafePlugin;
 }

package/src/ui/FloatingContextualButton/index.tsx

@@ -21,7 +21,6 @@ import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import { akEditorSmallZIndex } from '@atlaskit/editor-shared-styles';
 import ExpandIcon from '@atlaskit/icon/utility/migration/chevron-down';
-import { fg } from '@atlaskit/platform-feature-flags';
 
 import { toggleContextualMenu } from '../../commands';
 import type { RowStickyState } from '../../pm-plugins/sticky-headers';
@@ -77,12 +76,10 @@ const FloatingContextualButtonInner = React.memo((props: Props & WrappedComponen
 	targetCellRef = findDomRefAtPos(targetCellPosition, domAtPos);
 
 	useEffect(() => {
-		if (fg('platform_editor_a11y_table_context_menu')) {
-			if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
-				const { state, dispatch } = editorView;
-				// open the menu when the keyboard shortcut is pressed
-				toggleContextualMenu()(state, dispatch);
-			}
+		if (isCellMenuOpenByKeyboard && !isContextualMenuOpen) {
+			const { state, dispatch } = editorView;
+			// open the menu when the keyboard shortcut is pressed
+			toggleContextualMenu()(state, dispatch);
 		}
 	}, [isCellMenuOpenByKeyboard, isContextualMenuOpen, editorView]);
 
@@ -106,15 +103,11 @@ const FloatingContextualButtonInner = React.memo((props: Props & WrappedComponen
 				className={ClassName.CONTEXTUAL_MENU_BUTTON}
 				selected={isContextualMenuOpen}
 				title={labelCellOptions}
-				keymap={
-					fg('platform_editor_a11y_table_context_menu') ? focusToContextMenuTrigger : undefined
-				}
+				keymap={focusToContextMenuTrigger}
 				onClick={handleClick}
 				iconBefore={<ExpandIcon label="" color="currentColor" isFacadeDisabled={true} />}
 				aria-label={labelCellOptions}
-				aria-expanded={
-					fg('platform_editor_a11y_table_context_menu') ? isContextualMenuOpen : undefined
-				}
+				aria-expanded={isContextualMenuOpen}
 			/>
 		</div>
 	);