@atlaskit/editor-plugin-table 10.9.7 → 10.9.9

package/dist/es2019/tablePlugin.js

@@ -599,7 +599,7 @@ const tablePlugin = ({
             api: api,
             isOpenedByKeyboard: false,
             popupsMountPoint: popupsMountPoint,
-            target: (_sizeSelectorPluginSt = sizeSelectorPluginState === null || sizeSelectorPluginState === void 0 ? void 0 : sizeSelectorPluginState.targetRef) !== null && _sizeSelectorPluginSt !== void 0 ? _sizeSelectorPluginSt : getDomRefFromSelection(editorView, ACTION_SUBJECT_ID.PICKER_TABLE_SIZE, api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent),
+            target: (_sizeSelectorPluginSt = sizeSelectorPluginState === null || sizeSelectorPluginState === void 0 ? void 0 : sizeSelectorPluginState.targetRef) !== null && _sizeSelectorPluginSt !== void 0 ? _sizeSelectorPluginSt : getDomRefFromSelection(editorView, ACTION_SUBJECT_ID.PICKER_TABLE_SIZE, api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions),
             popupsBoundariesElement: popupsBoundariesElement,
             popupsScrollableElement: popupsScrollableElement
           }));

package/dist/es2019/ui/ContentComponent.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import FloatingContextualButton from './FloatingContextualButton';
 import FloatingContextualMenu from './FloatingContextualMenu';
 import FloatingDeleteButton from './FloatingDeleteButton';
@@ -12,11 +12,8 @@ import FloatingDragMenu from './FloatingDragMenu';
 import FloatingInsertButton from './FloatingInsertButton';
 import { FloatingToolbarLabel } from './FloatingToolbarLabel/FloatingToolbarLabel';
 import { GlobalStylesWrapper } from './global-styles';
+import { useInternalTablePluginStateSelector } from './hooks/useInternalTablePluginStateSelector';
 import { FullWidthDisplay } from './TableFullWidthLabel';
-const useSharedTablePluginStateSelector = (api, key) => {
-  const value = useSharedPluginStateSelector(api, `table.${key}`);
-  return value;
-};
 const ContentComponentInternal = ({
   api,
   editorView,
@@ -31,30 +28,72 @@ const ContentComponentInternal = ({
   var _api$analytics, _api$accessibilityUti;
   const editorAnalyticsAPI = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   const ariaNotifyPlugin = api === null || api === void 0 ? void 0 : (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify;
-  const resizingTableLocalId = useSharedTablePluginStateSelector(api, 'resizingTableLocalId');
-  const resizingTableRef = useSharedTablePluginStateSelector(api, 'resizingTableRef');
-  const isTableResizing = useSharedTablePluginStateSelector(api, 'isTableResizing');
-  const isResizing = useSharedTablePluginStateSelector(api, 'isResizing');
-  const widthToWidest = useSharedTablePluginStateSelector(api, 'widthToWidest');
-  const tableNode = useSharedTablePluginStateSelector(api, 'tableNode');
-  const targetCellPosition = useSharedTablePluginStateSelector(api, 'targetCellPosition');
-  const isContextualMenuOpen = useSharedTablePluginStateSelector(api, 'isContextualMenuOpen');
-  const tableRef = useSharedTablePluginStateSelector(api, 'tableRef');
-  const pluginConfig = useSharedTablePluginStateSelector(api, 'pluginConfig');
-  const insertColumnButtonIndex = useSharedTablePluginStateSelector(api, 'insertColumnButtonIndex');
-  const insertRowButtonIndex = useSharedTablePluginStateSelector(api, 'insertRowButtonIndex');
-  const isHeaderColumnEnabled = useSharedTablePluginStateSelector(api, 'isHeaderColumnEnabled');
-  const isHeaderRowEnabled = useSharedTablePluginStateSelector(api, 'isHeaderRowEnabled');
-  const isDragAndDropEnabled = useSharedTablePluginStateSelector(api, 'isDragAndDropEnabled');
-  const tableWrapperTarget = useSharedTablePluginStateSelector(api, 'tableWrapperTarget');
-  const isCellMenuOpenByKeyboard = useSharedTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard');
+  const resizingTableLocalId = useInternalTablePluginStateSelector(api, 'resizingTableLocalId', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const resizingTableRef = useInternalTablePluginStateSelector(api, 'resizingTableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isTableResizing = useInternalTablePluginStateSelector(api, 'isTableResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isResizing = useInternalTablePluginStateSelector(api, 'isResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const widthToWidest = useInternalTablePluginStateSelector(api, 'widthToWidest', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const tableNode = useInternalTablePluginStateSelector(api, 'tableNode', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const targetCellPosition = useInternalTablePluginStateSelector(api, 'targetCellPosition', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isContextualMenuOpen = useInternalTablePluginStateSelector(api, 'isContextualMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const tableRef = useInternalTablePluginStateSelector(api, 'tableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const pluginConfig = useInternalTablePluginStateSelector(api, 'pluginConfig', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const insertColumnButtonIndex = useInternalTablePluginStateSelector(api, 'insertColumnButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const insertRowButtonIndex = useInternalTablePluginStateSelector(api, 'insertRowButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isHeaderColumnEnabled = useInternalTablePluginStateSelector(api, 'isHeaderColumnEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isHeaderRowEnabled = useInternalTablePluginStateSelector(api, 'isHeaderRowEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isDragAndDropEnabled = useInternalTablePluginStateSelector(api, 'isDragAndDropEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const tableWrapperTarget = useInternalTablePluginStateSelector(api, 'tableWrapperTarget', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isCellMenuOpenByKeyboard = useInternalTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
   const {
     allowControls
-  } = pluginConfig;
-  const stickyHeader = useSharedTablePluginStateSelector(api, 'stickyHeader');
-  const dragMenuDirection = useSharedTablePluginStateSelector(api, 'dragMenuDirection');
-  const dragMenuIndex = useSharedTablePluginStateSelector(api, 'dragMenuIndex');
-  const isDragMenuOpen = useSharedTablePluginStateSelector(api, 'isDragMenuOpen');
+  } = pluginConfig !== null && pluginConfig !== void 0 ? pluginConfig : {};
+  const stickyHeader = useInternalTablePluginStateSelector(api, 'stickyHeader', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const dragMenuDirection = useInternalTablePluginStateSelector(api, 'dragMenuDirection', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const dragMenuIndex = useInternalTablePluginStateSelector(api, 'dragMenuIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  const isDragMenuOpen = useInternalTablePluginStateSelector(api, 'isDragMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
   return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
     isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
     editorView: editorView,

package/dist/es2019/ui/DragHandle/index.js

@@ -7,7 +7,6 @@ import { injectIntl } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/browser';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findTable, TableMap } from '@atlaskit/editor-tables';
 import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
@@ -19,6 +18,7 @@ import { findDuplicatePosition, hasMergedCellsInSelection } from '../../pm-plugi
 import { TableCssClassName as ClassName } from '../../types';
 import { dragTableInsertColumnButtonSize } from '../consts';
 import { DragPreview } from '../DragPreview';
+import { useInternalTablePluginStateSelector } from '../hooks/useInternalTablePluginStateSelector';
 import { HandleIconComponent } from './HandleIconComponent';
 const DragHandleComponent = ({
   isDragMenuTarget,
@@ -275,13 +275,13 @@ const DragHandleComponentWithSharedState = ({
   });
 
   // hoveredColumns
-  const hoveredColumnsSelector = useSharedPluginStateSelector(api, 'table.hoveredColumns', {
+  const hoveredColumnsSelector = useInternalTablePluginStateSelector(api, 'hoveredColumns', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   const hoveredColumns = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredColumnsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredColumns;
 
   // hoveredRows
-  const hoveredRowsSelector = useSharedPluginStateSelector(api, 'table.hoveredRows', {
+  const hoveredRowsSelector = useInternalTablePluginStateSelector(api, 'hoveredRows', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   const hoveredRows = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredRowsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredRows;

package/dist/es2019/ui/hooks/useInternalTablePluginStateSelector.js

@@ -0,0 +1,21 @@
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export const useInternalTablePluginStateSelector = (api, key, options) => {
+  // Need to disable the eslint rule here because the key is for the TableSharedStateInternal type
+  // and we are using it as a string to access the value in the useSharedPluginStateSelector
+  // which is typed only for the public TableSharedState type.
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  const value = useSharedPluginStateSelector(api, `table.${key}`, options);
+  return value;
+};

package/dist/esm/nodeviews/TableComponentWithSharedState.js

@@ -3,18 +3,12 @@ import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { findTable } from '@atlaskit/editor-tables';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
+import { useInternalTablePluginStateSelector } from '../ui/hooks/useInternalTablePluginStateSelector';
 import TableComponent from './TableComponent';
 
 // Ignored via go/ees005
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
-var useSharedTablePluginStateSelector = function useSharedTablePluginStateSelector(api, key) {
-  var value = useSharedPluginStateSelector(api, "table.".concat(key), {
-    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
-  });
-  return value;
-};
-
 /**
  * Use useSharedPluginState to control re-renders from plugin dependencies
  */
@@ -40,16 +34,36 @@ export var TableComponentWithSharedState = function TableComponentWithSharedStat
     mediaState = _useSharedPluginState.mediaState,
     selectionState = _useSharedPluginState.selectionState,
     editorViewModeState = _useSharedPluginState.editorViewModeState;
-  var isTableResizingSelector = useSharedTablePluginStateSelector(api, 'isTableResizing');
-  var isHeaderColumnEnabledSelector = useSharedTablePluginStateSelector(api, 'isHeaderColumnEnabled');
-  var isHeaderRowEnabledSelector = useSharedTablePluginStateSelector(api, 'isHeaderRowEnabled');
-  var orderingSelector = useSharedTablePluginStateSelector(api, 'ordering');
-  var isResizingSelector = useSharedTablePluginStateSelector(api, 'isResizing');
-  var isInDangerSelector = useSharedTablePluginStateSelector(api, 'isInDanger');
-  var hoveredCellSelector = useSharedTablePluginStateSelector(api, 'hoveredCell');
-  var hoveredRowsSelector = useSharedTablePluginStateSelector(api, 'hoveredRows');
-  var isTableHoveredSelector = useSharedTablePluginStateSelector(api, 'isTableHovered');
-  var isWholeTableInDangerSelector = useSharedTablePluginStateSelector(api, 'isWholeTableInDanger');
+  var isTableResizingSelector = useInternalTablePluginStateSelector(api, 'isTableResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderColumnEnabledSelector = useInternalTablePluginStateSelector(api, 'isHeaderColumnEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderRowEnabledSelector = useInternalTablePluginStateSelector(api, 'isHeaderRowEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var orderingSelector = useInternalTablePluginStateSelector(api, 'ordering', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isResizingSelector = useInternalTablePluginStateSelector(api, 'isResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isInDangerSelector = useInternalTablePluginStateSelector(api, 'isInDanger', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var hoveredCellSelector = useInternalTablePluginStateSelector(api, 'hoveredCell', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var hoveredRowsSelector = useInternalTablePluginStateSelector(api, 'hoveredRows', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isTableHoveredSelector = useInternalTablePluginStateSelector(api, 'isTableHovered', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isWholeTableInDangerSelector = useInternalTablePluginStateSelector(api, 'isWholeTableInDanger', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
 
   // mediaState
   var isFullscreenSelector = useSharedPluginStateSelector(api, 'media.isFullscreen', {
@@ -117,8 +131,8 @@ export var TableComponentWithSharedState = function TableComponentWithSharedStat
     isMediaFullscreen: isFullscreen,
     options: options,
     allowControls: allowControls,
-    isHeaderRowEnabled: isHeaderRowEnabled,
-    isHeaderColumnEnabled: isHeaderColumnEnabled,
+    isHeaderRowEnabled: isHeaderRowEnabled !== null && isHeaderRowEnabled !== void 0 ? isHeaderRowEnabled : false,
+    isHeaderColumnEnabled: isHeaderColumnEnabled !== null && isHeaderColumnEnabled !== void 0 ? isHeaderColumnEnabled : false,
     isDragAndDropEnabled: (options === null || options === void 0 ? void 0 : options.isDragAndDropEnabled) && !isLivePageViewMode,
     isTableScalingEnabled: options === null || options === void 0 ? void 0 : options.isTableScalingEnabled,
     allowTableAlignment: allowTableAlignment,

package/dist/esm/nodeviews/TableContainer.js

@@ -58,7 +58,7 @@ var AlignmentTableContainer = function AlignmentTableContainer(_ref2) {
   });
   var wasFullWidthModeEnabled = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? wasFullWidthModeEnabledSelector : tableState === null || tableState === void 0 ? void 0 : tableState.wasFullWidthModeEnabled;
   useEffect(function () {
-    if (editorExperiment('platform_editor_usesharedpluginstateselector', false) && !tableState) {
+    if (!tableState && editorExperiment('platform_editor_usesharedpluginstateselector', false)) {
       return;
     }
     if (editorView && getPos) {

package/dist/esm/nodeviews/TableResizer.js

@@ -13,7 +13,6 @@ import { focusTableResizer, ToolTipContent } from '@atlaskit/editor-common/keyma
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
 import { logException } from '@atlaskit/editor-common/monitoring';
 import { ResizerNext } from '@atlaskit/editor-common/resizer';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { chainCommands } from '@atlaskit/editor-prosemirror/commands';
 import { akEditorGutterPaddingDynamic } from '@atlaskit/editor-shared-styles';
 import { findTable } from '@atlaskit/editor-tables/utils';
@@ -31,6 +30,7 @@ import { generateResizedPayload, generateResizeFrameRatePayloads, useMeasureFram
 import { defaultGuidelines, defaultGuidelinesForPreserveTable, PRESERVE_TABLE_GUIDELINES_LENGTH_OFFSET } from '../pm-plugins/utils/guidelines';
 import { defaultSnappingWidths, defaultTablePreserveSnappingWidths, findClosestSnap, PRESERVE_TABLE_SNAPPING_LENGTH_OFFSET } from '../pm-plugins/utils/snapping';
 import { TABLE_GUIDELINE_VISIBLE_ADJUSTMENT, TABLE_HIGHLIGHT_GAP, TABLE_HIGHLIGHT_TOLERANCE, TABLE_SNAP_GAP } from '../ui/consts';
+import { useInternalTablePluginStateSelector } from '../ui/hooks/useInternalTablePluginStateSelector';
 var RESIZE_STEP_VALUE = 10;
 var handles = {
   right: true
@@ -133,7 +133,7 @@ export var TableResizer = function TableResizer(_ref) {
     tableState = _useSharedPluginState.tableState;
 
   // widthToWidest
-  var widthToWidestSelector = useSharedPluginStateSelector(pluginInjectionApi, 'table.widthToWidest', {
+  var widthToWidestSelector = useInternalTablePluginStateSelector(pluginInjectionApi, 'widthToWidest', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   var widthToWidest = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? widthToWidestSelector : tableState.widthToWidest;

package/dist/esm/pm-plugins/utils/paste.js

@@ -194,36 +194,34 @@ var containsNonTableBlockChildren = function containsNonTableBlockChildren(fragm
 };
 export var transformSliceToRemoveOpenTable = function transformSliceToRemoveOpenTable(slice, schema) {
   var _slice$content$firstC4;
-  if (fg('platform_editor_nested_tables_paste_wrap_fix')) {
-    // Case 1: A slice of a block selection inside a nested table
-    // Prosemirror wraps nested block selections in their respective tables
-    // We are using `safeInsert` to paste nested tables, so we do not want to preserve this wrapping
+  // Case 1: A slice of a block selection inside a nested table
+  // Prosemirror wraps nested block selections in their respective tables
+  // We are using `safeInsert` to paste nested tables, so we do not want to preserve this wrapping
 
-    // slice starts and ends inside a nested table at the same depth
-    if (slice.openStart >= 7 && slice.openEnd >= 7) {
-      var cleaned = slice;
-      var descendedDepth = 0;
-      var tableDepthDecrement = 2;
+  // slice starts and ends inside a nested table at the same depth
+  if (slice.openStart >= 7 && slice.openEnd >= 7) {
+    var cleaned = slice;
+    var descendedDepth = 0;
+    var tableDepthDecrement = 2;
 
-      // if the slice is a single cell table and contains cells with single cell tables, descend into it until we find textblock children
-      if (isFragmentSingleCellTable(slice.content, schema)) {
-        var _slice$content$firstC2;
-        (_slice$content$firstC2 = slice.content.firstChild) === null || _slice$content$firstC2 === void 0 || _slice$content$firstC2.descendants(function (node) {
-          if (isNodeSingleCellTable(node, schema)) {
-            descendedDepth += tableDepthDecrement;
-          } else if (node.type === schema.nodes.table) {
-            return false;
-          } else if (containsNonTableBlockChildren(node.content, schema)) {
-            descendedDepth += tableDepthDecrement;
-            // create a new slice with the content of non-table block children and the depth of the nested tables subtracted
-            cleaned = new Slice(node.content, slice.openStart - descendedDepth - tableDepthDecrement, slice.openEnd - descendedDepth - tableDepthDecrement);
-            return false;
-          }
-        });
-      }
-      if (!cleaned.eq(slice)) {
-        return cleaned;
-      }
+    // if the slice is a single cell table and contains cells with single cell tables, descend into it until we find textblock children
+    if (isFragmentSingleCellTable(slice.content, schema)) {
+      var _slice$content$firstC2;
+      (_slice$content$firstC2 = slice.content.firstChild) === null || _slice$content$firstC2 === void 0 || _slice$content$firstC2.descendants(function (node) {
+        if (isNodeSingleCellTable(node, schema)) {
+          descendedDepth += tableDepthDecrement;
+        } else if (node.type === schema.nodes.table) {
+          return false;
+        } else if (containsNonTableBlockChildren(node.content, schema)) {
+          descendedDepth += tableDepthDecrement;
+          // create a new slice with the content of non-table block children and the depth of the nested tables subtracted
+          cleaned = new Slice(node.content, slice.openStart - descendedDepth - tableDepthDecrement, slice.openEnd - descendedDepth - tableDepthDecrement);
+          return false;
+        }
+      });
+    }
+    if (!cleaned.eq(slice)) {
+      return cleaned;
     }
   }
 

package/dist/esm/tablePlugin.js

@@ -596,7 +596,7 @@ var tablePlugin = function tablePlugin(_ref) {
             api: api,
             isOpenedByKeyboard: false,
             popupsMountPoint: popupsMountPoint,
-            target: (_sizeSelectorPluginSt = sizeSelectorPluginState === null || sizeSelectorPluginState === void 0 ? void 0 : sizeSelectorPluginState.targetRef) !== null && _sizeSelectorPluginSt !== void 0 ? _sizeSelectorPluginSt : getDomRefFromSelection(editorView, ACTION_SUBJECT_ID.PICKER_TABLE_SIZE, api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.fireAnalyticsEvent),
+            target: (_sizeSelectorPluginSt = sizeSelectorPluginState === null || sizeSelectorPluginState === void 0 ? void 0 : sizeSelectorPluginState.targetRef) !== null && _sizeSelectorPluginSt !== void 0 ? _sizeSelectorPluginSt : getDomRefFromSelection(editorView, ACTION_SUBJECT_ID.PICKER_TABLE_SIZE, api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions),
             popupsBoundariesElement: popupsBoundariesElement,
             popupsScrollableElement: popupsScrollableElement
           }));

package/dist/esm/ui/ContentComponent.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import FloatingContextualButton from './FloatingContextualButton';
 import FloatingContextualMenu from './FloatingContextualMenu';
 import FloatingDeleteButton from './FloatingDeleteButton';
@@ -12,11 +12,8 @@ import FloatingDragMenu from './FloatingDragMenu';
 import FloatingInsertButton from './FloatingInsertButton';
 import { FloatingToolbarLabel } from './FloatingToolbarLabel/FloatingToolbarLabel';
 import { GlobalStylesWrapper } from './global-styles';
+import { useInternalTablePluginStateSelector } from './hooks/useInternalTablePluginStateSelector';
 import { FullWidthDisplay } from './TableFullWidthLabel';
-var useSharedTablePluginStateSelector = function useSharedTablePluginStateSelector(api, key) {
-  var value = useSharedPluginStateSelector(api, "table.".concat(key));
-  return value;
-};
 var ContentComponentInternal = function ContentComponentInternal(_ref) {
   var _api$analytics, _api$accessibilityUti;
   var api = _ref.api,
@@ -30,28 +27,71 @@ var ContentComponentInternal = function ContentComponentInternal(_ref) {
     defaultGetEditorFeatureFlags = _ref.defaultGetEditorFeatureFlags;
   var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   var ariaNotifyPlugin = api === null || api === void 0 || (_api$accessibilityUti = api.accessibilityUtils) === null || _api$accessibilityUti === void 0 ? void 0 : _api$accessibilityUti.actions.ariaNotify;
-  var resizingTableLocalId = useSharedTablePluginStateSelector(api, 'resizingTableLocalId');
-  var resizingTableRef = useSharedTablePluginStateSelector(api, 'resizingTableRef');
-  var isTableResizing = useSharedTablePluginStateSelector(api, 'isTableResizing');
-  var isResizing = useSharedTablePluginStateSelector(api, 'isResizing');
-  var widthToWidest = useSharedTablePluginStateSelector(api, 'widthToWidest');
-  var tableNode = useSharedTablePluginStateSelector(api, 'tableNode');
-  var targetCellPosition = useSharedTablePluginStateSelector(api, 'targetCellPosition');
-  var isContextualMenuOpen = useSharedTablePluginStateSelector(api, 'isContextualMenuOpen');
-  var tableRef = useSharedTablePluginStateSelector(api, 'tableRef');
-  var pluginConfig = useSharedTablePluginStateSelector(api, 'pluginConfig');
-  var insertColumnButtonIndex = useSharedTablePluginStateSelector(api, 'insertColumnButtonIndex');
-  var insertRowButtonIndex = useSharedTablePluginStateSelector(api, 'insertRowButtonIndex');
-  var isHeaderColumnEnabled = useSharedTablePluginStateSelector(api, 'isHeaderColumnEnabled');
-  var isHeaderRowEnabled = useSharedTablePluginStateSelector(api, 'isHeaderRowEnabled');
-  var isDragAndDropEnabled = useSharedTablePluginStateSelector(api, 'isDragAndDropEnabled');
-  var tableWrapperTarget = useSharedTablePluginStateSelector(api, 'tableWrapperTarget');
-  var isCellMenuOpenByKeyboard = useSharedTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard');
-  var allowControls = pluginConfig.allowControls;
-  var stickyHeader = useSharedTablePluginStateSelector(api, 'stickyHeader');
-  var dragMenuDirection = useSharedTablePluginStateSelector(api, 'dragMenuDirection');
-  var dragMenuIndex = useSharedTablePluginStateSelector(api, 'dragMenuIndex');
-  var isDragMenuOpen = useSharedTablePluginStateSelector(api, 'isDragMenuOpen');
+  var resizingTableLocalId = useInternalTablePluginStateSelector(api, 'resizingTableLocalId', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var resizingTableRef = useInternalTablePluginStateSelector(api, 'resizingTableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isTableResizing = useInternalTablePluginStateSelector(api, 'isTableResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isResizing = useInternalTablePluginStateSelector(api, 'isResizing', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var widthToWidest = useInternalTablePluginStateSelector(api, 'widthToWidest', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var tableNode = useInternalTablePluginStateSelector(api, 'tableNode', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var targetCellPosition = useInternalTablePluginStateSelector(api, 'targetCellPosition', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isContextualMenuOpen = useInternalTablePluginStateSelector(api, 'isContextualMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var tableRef = useInternalTablePluginStateSelector(api, 'tableRef', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var pluginConfig = useInternalTablePluginStateSelector(api, 'pluginConfig', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var insertColumnButtonIndex = useInternalTablePluginStateSelector(api, 'insertColumnButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var insertRowButtonIndex = useInternalTablePluginStateSelector(api, 'insertRowButtonIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderColumnEnabled = useInternalTablePluginStateSelector(api, 'isHeaderColumnEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isHeaderRowEnabled = useInternalTablePluginStateSelector(api, 'isHeaderRowEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isDragAndDropEnabled = useInternalTablePluginStateSelector(api, 'isDragAndDropEnabled', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var tableWrapperTarget = useInternalTablePluginStateSelector(api, 'tableWrapperTarget', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isCellMenuOpenByKeyboard = useInternalTablePluginStateSelector(api, 'isCellMenuOpenByKeyboard', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var _ref2 = pluginConfig !== null && pluginConfig !== void 0 ? pluginConfig : {},
+    allowControls = _ref2.allowControls;
+  var stickyHeader = useInternalTablePluginStateSelector(api, 'stickyHeader', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var dragMenuDirection = useInternalTablePluginStateSelector(api, 'dragMenuDirection', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var dragMenuIndex = useInternalTablePluginStateSelector(api, 'dragMenuIndex', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
+  var isDragMenuOpen = useInternalTablePluginStateSelector(api, 'isDragMenuOpen', {
+    disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
+  });
   return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && (tableRef || isCellMenuOpenByKeyboard) && !isResizing && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
     isNumberColumnEnabled: tableNode && tableNode.attrs.isNumberColumnEnabled,
     editorView: editorView,
@@ -139,17 +179,17 @@ var ContentComponentInternal = function ContentComponentInternal(_ref) {
     offset: [0, 10]
   }));
 };
-export var ContentComponent = function ContentComponent(_ref2) {
+export var ContentComponent = function ContentComponent(_ref3) {
   var _api$featureFlags;
-  var api = _ref2.api,
-    editorView = _ref2.editorView,
-    dispatchAnalyticsEvent = _ref2.dispatchAnalyticsEvent,
-    options = _ref2.options,
-    popupsMountPoint = _ref2.popupsMountPoint,
-    popupsBoundariesElement = _ref2.popupsBoundariesElement,
-    popupsScrollableElement = _ref2.popupsScrollableElement,
-    defaultGetEditorContainerWidth = _ref2.defaultGetEditorContainerWidth,
-    defaultGetEditorFeatureFlags = _ref2.defaultGetEditorFeatureFlags;
+  var api = _ref3.api,
+    editorView = _ref3.editorView,
+    dispatchAnalyticsEvent = _ref3.dispatchAnalyticsEvent,
+    options = _ref3.options,
+    popupsMountPoint = _ref3.popupsMountPoint,
+    popupsBoundariesElement = _ref3.popupsBoundariesElement,
+    popupsScrollableElement = _ref3.popupsScrollableElement,
+    defaultGetEditorContainerWidth = _ref3.defaultGetEditorContainerWidth,
+    defaultGetEditorFeatureFlags = _ref3.defaultGetEditorFeatureFlags;
   return /*#__PURE__*/React.createElement(ErrorBoundary, {
     component: ACTION_SUBJECT.TABLES_PLUGIN,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,

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

@@ -9,7 +9,6 @@ import { injectIntl } from 'react-intl-next';
 import { browser } from '@atlaskit/editor-common/browser';
 import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { tableMessages as messages } from '@atlaskit/editor-common/messages';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findTable, TableMap } from '@atlaskit/editor-tables';
 import { draggable } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
@@ -21,6 +20,7 @@ import { findDuplicatePosition, hasMergedCellsInSelection } from '../../pm-plugi
 import { TableCssClassName as ClassName } from '../../types';
 import { dragTableInsertColumnButtonSize } from '../consts';
 import { DragPreview } from '../DragPreview';
+import { useInternalTablePluginStateSelector } from '../hooks/useInternalTablePluginStateSelector';
 import { HandleIconComponent } from './HandleIconComponent';
 var DragHandleComponent = function DragHandleComponent(_ref) {
   var isDragMenuTarget = _ref.isDragMenuTarget,
@@ -268,13 +268,13 @@ var DragHandleComponentWithSharedState = function DragHandleComponentWithSharedS
     tableState = _ref6.tableState;
 
   // hoveredColumns
-  var hoveredColumnsSelector = useSharedPluginStateSelector(api, 'table.hoveredColumns', {
+  var hoveredColumnsSelector = useInternalTablePluginStateSelector(api, 'hoveredColumns', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   var hoveredColumns = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredColumnsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredColumns;
 
   // hoveredRows
-  var hoveredRowsSelector = useSharedPluginStateSelector(api, 'table.hoveredRows', {
+  var hoveredRowsSelector = useInternalTablePluginStateSelector(api, 'hoveredRows', {
     disabled: editorExperiment('platform_editor_usesharedpluginstateselector', false)
   });
   var hoveredRows = editorExperiment('platform_editor_usesharedpluginstateselector', true) ? hoveredRowsSelector : tableState === null || tableState === void 0 ? void 0 : tableState.hoveredRows;

package/dist/esm/ui/hooks/useInternalTablePluginStateSelector.js

@@ -0,0 +1,21 @@
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export var useInternalTablePluginStateSelector = function useInternalTablePluginStateSelector(api, key, options) {
+  // Need to disable the eslint rule here because the key is for the TableSharedStateInternal type
+  // and we are using it as a string to access the value in the useSharedPluginStateSelector
+  // which is typed only for the public TableSharedState type.
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  var value = useSharedPluginStateSelector(api, "table.".concat(key), options);
+  return value;
+};

package/dist/types/ui/hooks/useInternalTablePluginStateSelector.d.ts

@@ -0,0 +1,20 @@
+import { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import { TablePlugin } from '../../tablePluginType';
+import { TableSharedStateInternal } from '../../types';
+type Options = {
+    disabled?: boolean;
+};
+/**
+ * **This hook is only for internal use and should not be used outside of the table plugin.**
+ *
+ * Hook to select a value from the internal table plugin state.
+ * This is a wrapper around `useSharedPluginStateSelector` to provide access to the entire
+ * `TableSharedStateInternal` type. Since tables plugin has a lot of internal state that is not
+ * exposed via the `TableSharedState` type, we need to use this hook to access it in a type safe way.
+ *
+ * @param api The editor API
+ * @param key Key of TableSharedStateInternal to select
+ * @returns
+ */
+export declare const useInternalTablePluginStateSelector: <K extends "isFullWidthModeEnabled" | "wasFullWidthModeEnabled" | "isHeaderRowEnabled" | "isHeaderColumnEnabled" | "ordering" | "isInDanger" | "hoveredRows" | "hoveredColumns" | "hoveredCell" | "isTableHovered" | "tableNode" | "widthToWidest" | "tableRef" | "tablePos" | "targetCellPosition" | "isContextualMenuOpen" | "pluginConfig" | "insertColumnButtonIndex" | "insertRowButtonIndex" | "isDragAndDropEnabled" | "tableWrapperTarget" | "isCellMenuOpenByKeyboard" | "isWholeTableInDanger" | "isDragMenuOpen" | "dragMenuDirection" | "dragMenuIndex" | "isResizing" | "isTableResizing" | "resizingTableRef" | "resizingTableLocalId" | "stickyHeader">(api: ExtractInjectionAPI<TablePlugin> | undefined, key: K, options?: Options) => TableSharedStateInternal[K] | undefined;
+export {};