@atlaskit/editor-plugin-table 1.1.1 → 1.1.3

package/dist/esm/plugins/table/index.js

@@ -28,32 +28,27 @@ import FloatingInsertButton from './ui/FloatingInsertButton';
 import LayoutButton from './ui/LayoutButton';
 import { isLayoutSupported } from './utils';
 import { ErrorBoundary } from '@atlaskit/editor-common/error-boundary';
-
 var defaultGetEditorFeatureFlags = function defaultGetEditorFeatureFlags() {
   return {};
 };
-
 var tablesPlugin = function tablesPlugin(options) {
   var editorViewRef = {
     current: null
   };
-
   var defaultGetEditorContainerWidth = function defaultGetEditorContainerWidth() {
     if (!editorViewRef.current) {
       var _document, _document$body;
-
       return {
         width: ((_document = document) === null || _document === void 0 ? void 0 : (_document$body = _document.body) === null || _document$body === void 0 ? void 0 : _document$body.offsetWidth) || 500
       };
     }
+    var state = editorViewRef.current.state;
 
-    var state = editorViewRef.current.state; // TODO: ED-15663
+    // TODO: ED-15663
     // Please, do not copy or use this kind of code below
     // @ts-ignore
-
     return state['widthPlugin$'];
   };
-
   return {
     name: 'table',
     nodes: function nodes() {
@@ -76,34 +71,29 @@ var tablesPlugin = function tablesPlugin(options) {
         name: 'table',
         plugin: function plugin(_ref) {
           var dispatchAnalyticsEvent = _ref.dispatchAnalyticsEvent,
-              dispatch = _ref.dispatch,
-              portalProviderAPI = _ref.portalProviderAPI,
-              eventDispatcher = _ref.eventDispatcher;
-
+            dispatch = _ref.dispatch,
+            portalProviderAPI = _ref.portalProviderAPI,
+            eventDispatcher = _ref.eventDispatcher;
           var _ref2 = options || {},
-              fullWidthEnabled = _ref2.fullWidthEnabled,
-              wasFullWidthEnabled = _ref2.wasFullWidthEnabled,
-              breakoutEnabled = _ref2.breakoutEnabled,
-              tableOptions = _ref2.tableOptions,
-              editorAnalyticsAPI = _ref2.editorAnalyticsAPI,
-              getEditorFeatureFlags = _ref2.getEditorFeatureFlags;
-
+            fullWidthEnabled = _ref2.fullWidthEnabled,
+            wasFullWidthEnabled = _ref2.wasFullWidthEnabled,
+            breakoutEnabled = _ref2.breakoutEnabled,
+            tableOptions = _ref2.tableOptions,
+            editorAnalyticsAPI = _ref2.editorAnalyticsAPI,
+            getEditorFeatureFlags = _ref2.getEditorFeatureFlags;
           return createPlugin(dispatchAnalyticsEvent, dispatch, portalProviderAPI, eventDispatcher, pluginConfig(tableOptions), defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, breakoutEnabled, fullWidthEnabled, wasFullWidthEnabled, editorAnalyticsAPI);
         }
       }, {
         name: 'tablePMColResizing',
         plugin: function plugin(_ref3) {
           var dispatch = _ref3.dispatch;
-
           var _ref4 = options || {},
-              fullWidthEnabled = _ref4.fullWidthEnabled,
-              tableOptions = _ref4.tableOptions,
-              editorAnalyticsAPI = _ref4.editorAnalyticsAPI,
-              getEditorFeatureFlags = _ref4.getEditorFeatureFlags;
-
+            fullWidthEnabled = _ref4.fullWidthEnabled,
+            tableOptions = _ref4.tableOptions,
+            editorAnalyticsAPI = _ref4.editorAnalyticsAPI,
+            getEditorFeatureFlags = _ref4.getEditorFeatureFlags;
           var _pluginConfig = pluginConfig(tableOptions),
-              allowColumnResizing = _pluginConfig.allowColumnResizing;
-
+            allowColumnResizing = _pluginConfig.allowColumnResizing;
           return allowColumnResizing ? createFlexiResizingPlugin(dispatch, {
             lastColumnResizable: !fullWidthEnabled
           }, defaultGetEditorContainerWidth, getEditorFeatureFlags || defaultGetEditorFeatureFlags, editorAnalyticsAPI) : undefined;
@@ -113,7 +103,8 @@ var tablesPlugin = function tablesPlugin(options) {
         plugin: function plugin() {
           return createDecorationsPlugin();
         }
-      }, // Needs to be lower priority than editor-tables.tableEditing
+      },
+      // Needs to be lower priority than editor-tables.tableEditing
       // plugin as it is currently swallowing backspace events inside tables
       {
         name: 'tableKeymap',
@@ -131,10 +122,9 @@ var tablesPlugin = function tablesPlugin(options) {
           return tableEditing({
             reportFixedTable: function reportFixedTable(_ref5) {
               var _options$editorAnalyt;
-
               var state = _ref5.state,
-                  tr = _ref5.tr,
-                  reason = _ref5.reason;
+                tr = _ref5.tr,
+                reason = _ref5.reason;
               options === null || options === void 0 ? void 0 : (_options$editorAnalyt = options.editorAnalyticsAPI) === null || _options$editorAnalyt === void 0 ? void 0 : _options$editorAnalyt.attachAnalyticsEvent({
                 action: TABLE_ACTION.FIXED,
                 actionSubject: ACTION_SUBJECT.TABLE,
@@ -151,7 +141,7 @@ var tablesPlugin = function tablesPlugin(options) {
         name: 'tableStickyHeaders',
         plugin: function plugin(_ref6) {
           var dispatch = _ref6.dispatch,
-              eventDispatcher = _ref6.eventDispatcher;
+            eventDispatcher = _ref6.eventDispatcher;
           return options && options.tableOptions.stickyHeaders ? createStickyHeadersPlugin(dispatch, eventDispatcher, function () {
             return [];
           }, (options === null || options === void 0 ? void 0 : options.getEditorFeatureFlags) || defaultGetEditorFeatureFlags) : undefined;
@@ -176,12 +166,14 @@ var tablesPlugin = function tablesPlugin(options) {
             }
           });
         }
-      }]; // workaround for prosemirrors delayed dom selection syncing during pointer drag
+      }];
+
+      // workaround for prosemirrors delayed dom selection syncing during pointer drag
       // causing issues with table selections in Safari
       // https://github.com/ProseMirror/prosemirror-view/commit/885258b80551ac87b81601d3ed25f552aeb22293
+
       // NOTE: this workaround can be removed when next upgrading prosemirror as the issue will be fixed
       // https://github.com/ProseMirror/prosemirror-view/pull/116
-
       if (browser.safari) {
         plugins.push({
           name: 'tableSafariDelayedDomSelectionSyncingWorkaround',
@@ -189,10 +181,10 @@ var tablesPlugin = function tablesPlugin(options) {
             return createTableSafariDelayedDomSelectionSyncingWorkaroundPlugin();
           }
         });
-      } // Workaround for table element breaking issue caused by composition event with an inputType of deleteCompositionText.
-      // https://github.com/ProseMirror/prosemirror/issues/934
-
+      }
 
+      // Workaround for table element breaking issue caused by composition event with an inputType of deleteCompositionText.
+      // https://github.com/ProseMirror/prosemirror/issues/934
       if (browser.safari) {
         plugins.push({
           name: 'tableSafariDeleteCompositionTextIssueWorkaround',
@@ -201,15 +193,14 @@ var tablesPlugin = function tablesPlugin(options) {
           }
         });
       }
-
       return plugins;
     },
     contentComponent: function contentComponent(_ref8) {
       var editorView = _ref8.editorView,
-          popupsMountPoint = _ref8.popupsMountPoint,
-          popupsBoundariesElement = _ref8.popupsBoundariesElement,
-          popupsScrollableElement = _ref8.popupsScrollableElement,
-          dispatchAnalyticsEvent = _ref8.dispatchAnalyticsEvent;
+        popupsMountPoint = _ref8.popupsMountPoint,
+        popupsBoundariesElement = _ref8.popupsBoundariesElement,
+        popupsScrollableElement = _ref8.popupsScrollableElement,
+        dispatchAnalyticsEvent = _ref8.dispatchAnalyticsEvent;
       return /*#__PURE__*/React.createElement(ErrorBoundary, {
         component: ACTION_SUBJECT.TABLES_PLUGIN,
         dispatchAnalyticsEvent: dispatchAnalyticsEvent,
@@ -222,23 +213,23 @@ var tablesPlugin = function tablesPlugin(options) {
         },
         render: function render(_ref9) {
           var resizingPluginState = _ref9.tableResizingPluginState,
-              stickyHeadersState = _ref9.stickyHeadersState,
-              tablePluginState = _ref9.tablePluginState;
+            stickyHeadersState = _ref9.stickyHeadersState,
+            tablePluginState = _ref9.tablePluginState;
           var state = editorView.state;
           var isDragging = resizingPluginState === null || resizingPluginState === void 0 ? void 0 : resizingPluginState.dragging;
           var _ref10 = tablePluginState,
-              tableNode = _ref10.tableNode,
-              tablePos = _ref10.tablePos,
-              targetCellPosition = _ref10.targetCellPosition,
-              isContextualMenuOpen = _ref10.isContextualMenuOpen,
-              layout = _ref10.layout,
-              tableRef = _ref10.tableRef,
-              pluginConfig = _ref10.pluginConfig,
-              insertColumnButtonIndex = _ref10.insertColumnButtonIndex,
-              insertRowButtonIndex = _ref10.insertRowButtonIndex,
-              isHeaderColumnEnabled = _ref10.isHeaderColumnEnabled,
-              isHeaderRowEnabled = _ref10.isHeaderRowEnabled,
-              tableWrapperTarget = _ref10.tableWrapperTarget;
+            tableNode = _ref10.tableNode,
+            tablePos = _ref10.tablePos,
+            targetCellPosition = _ref10.targetCellPosition,
+            isContextualMenuOpen = _ref10.isContextualMenuOpen,
+            layout = _ref10.layout,
+            tableRef = _ref10.tableRef,
+            pluginConfig = _ref10.pluginConfig,
+            insertColumnButtonIndex = _ref10.insertColumnButtonIndex,
+            insertRowButtonIndex = _ref10.insertRowButtonIndex,
+            isHeaderColumnEnabled = _ref10.isHeaderColumnEnabled,
+            isHeaderRowEnabled = _ref10.isHeaderRowEnabled,
+            tableWrapperTarget = _ref10.tableWrapperTarget;
           var allowControls = pluginConfig.allowControls;
           var stickyHeader = stickyHeadersState ? findStickyHeaderForTable(stickyHeadersState, tablePos) : undefined;
           return /*#__PURE__*/React.createElement(React.Fragment, null, targetCellPosition && tableRef && !isDragging && options && options.allowContextualMenu && /*#__PURE__*/React.createElement(FloatingContextualButton, {
@@ -305,13 +296,11 @@ var tablesPlugin = function tablesPlugin(options) {
       // For now, we are using this on (insert-api/api.ts) but we may create a proper place for it
       createNodeHandler: function createNodeHandler(_ref11) {
         var nodeName = _ref11.nodeName,
-            schema = _ref11.schema;
-
+          schema = _ref11.schema;
         // An EditorPlugin may manage more than one node.
         if (nodeName !== 'table') {
           return null;
         }
-
         var table = createTable({
           schema: schema
         });
@@ -331,7 +320,6 @@ var tablesPlugin = function tablesPlugin(options) {
           },
           action: function action(insert, state) {
             var _options$editorAnalyt2;
-
             var tr = insert(createTable({
               schema: state.schema
             }));
@@ -354,5 +342,4 @@ var tablesPlugin = function tablesPlugin(options) {
     }
   };
 };
-
 export default tablesPlugin;

package/dist/esm/plugins/table/nodeviews/OverflowShadowsObserver.js

@@ -8,53 +8,36 @@ export var OverflowShadowsObserver = /*#__PURE__*/function () {
   // updateShadowState is a method to update shadow key
   function OverflowShadowsObserver(updateShadowState, _table, wrapper) {
     var _this = this;
-
     _classCallCheck(this, OverflowShadowsObserver);
-
     _defineProperty(this, "firstCell", null);
-
     _defineProperty(this, "lastCell", null);
-
     _defineProperty(this, "getFirstCell", function (isSticky, hasHeaderRow) {
       var _this$table;
-
       return (_this$table = _this.table) === null || _this$table === void 0 ? void 0 : _this$table.querySelector(isSticky || !hasHeaderRow ? 'table tbody tr td' : 'table tbody tr th');
     });
-
     _defineProperty(this, "getLastCell", function (isSticky, hasHeaderRow) {
       var _this$table2;
-
       return (_this$table2 = _this.table) === null || _this$table2 === void 0 ? void 0 : _this$table2.querySelector(isSticky || !hasHeaderRow ? 'table tbody tr td:last-child' : 'table tbody tr th:last-child');
     });
-
     _defineProperty(this, "isSticky", false);
-
     _defineProperty(this, "stickyRowHeight", 0);
-
     _defineProperty(this, "init", function () {
       var table = _this.table;
-
       if (!_this.wrapper || !table) {
         return;
       }
-
       if (!_this.tableIntersectionObserver) {
         var intersectonOnbserverCallback = function intersectonOnbserverCallback(entry) {
           var _entry$rootBounds, _entry$rootBounds2;
-
           if (!((_entry$rootBounds = entry.rootBounds) !== null && _entry$rootBounds !== void 0 && _entry$rootBounds.height) && !((_entry$rootBounds2 = entry.rootBounds) !== null && _entry$rootBounds2 !== void 0 && _entry$rootBounds2.width)) {
             return;
           }
-
           if (entry.target !== _this.firstCell && entry.target !== _this.lastCell) {
             return;
           }
-
           _this.updateStickyShadowsHeightIfChanged();
-
           _this.checkIntersectionEvent(entry, _this.firstCell === entry.target ? ShadowEvent.SHOW_BEFORE_SHADOW : ShadowEvent.SHOW_AFTER_SHADOW);
         };
-
         _this.tableIntersectionObserver = new IntersectionObserver(function (entries, _) {
           entries.forEach(function (entry) {
             return intersectonOnbserverCallback(entry);
@@ -67,88 +50,71 @@ export var OverflowShadowsObserver = /*#__PURE__*/function () {
         return;
       }
     });
-
     _defineProperty(this, "checkIntersectionEvent", function (entry, shadowKey) {
-      if ( // If it's in full view, don't show shadow.
+      if (
+      // If it's in full view, don't show shadow.
       entry.isIntersecting && entry.intersectionRatio === 1) {
         _this.updateShadowState(shadowKey, false);
-      } else if ( // If it's in partial view, show a shadow
+      } else if (
+      // If it's in partial view, show a shadow
       entry.intersectionRatio < 1) {
         _this.updateShadowState(shadowKey, true);
       }
     });
-
     _defineProperty(this, "observeCells", function (isSticky, hasHeaderRow) {
       var stickyChanged = !!isSticky !== _this.isSticky;
-      _this.isSticky = !!isSticky; // update sticky shadows
+      _this.isSticky = !!isSticky;
 
+      // update sticky shadows
       _this.updateStickyShadowsHeightIfChanged();
-
       if (!stickyChanged) {
         var firstCell = _this.getFirstCell(isSticky, hasHeaderRow);
-
         var lastCell = _this.getLastCell(isSticky, hasHeaderRow);
-
         if (!firstCell || !lastCell || firstCell === _this.firstCell && lastCell === _this.lastCell) {
           return;
         }
       }
-
       _this.firstCell = _this.getFirstCell(isSticky, hasHeaderRow);
       _this.lastCell = _this.getLastCell(isSticky, hasHeaderRow);
-
       if (_this.tableIntersectionObserver && _this.firstCell && _this.lastCell) {
         _this.tableIntersectionObserver.disconnect();
-
         _this.tableIntersectionObserver.observe(_this.firstCell);
-
         _this.tableIntersectionObserver.observe(_this.lastCell);
       }
     });
-
     _defineProperty(this, "updateStickyShadows", function (stickyRowHeight) {
       var _this$wrapper, _this$wrapper2, _this$wrapper2$parent, _this$wrapper3, _this$wrapper3$parent;
-
       if (!_this.isSticky) {
         return;
       }
-
       var stickyCell = _this.getStickyCell();
-
       if (!stickyCell || !((_this$wrapper = _this.wrapper) !== null && _this$wrapper !== void 0 && _this$wrapper.parentElement)) {
         return;
       }
-
-      var heightStyleOrCompute = "".concat(stickyRowHeight || stickyCell.clientHeight + 1, "px"); // Use getElementsByClassName here for a live node list to capture
+      var heightStyleOrCompute = "".concat(stickyRowHeight || stickyCell.clientHeight + 1, "px");
+      // Use getElementsByClassName here for a live node list to capture
       // sticky shadows
-
       var liveRightShadows = (_this$wrapper2 = _this.wrapper) === null || _this$wrapper2 === void 0 ? void 0 : (_this$wrapper2$parent = _this$wrapper2.parentElement) === null || _this$wrapper2$parent === void 0 ? void 0 : _this$wrapper2$parent.getElementsByClassName("".concat(ClassName.TABLE_RIGHT_SHADOW));
       var liveLeftShadows = (_this$wrapper3 = _this.wrapper) === null || _this$wrapper3 === void 0 ? void 0 : (_this$wrapper3$parent = _this$wrapper3.parentElement) === null || _this$wrapper3$parent === void 0 ? void 0 : _this$wrapper3$parent.getElementsByClassName("".concat(ClassName.TABLE_LEFT_SHADOW));
       updateShadowListForStickyStyles(heightStyleOrCompute, liveLeftShadows);
       updateShadowListForStickyStyles(heightStyleOrCompute, liveRightShadows);
     });
-
     this.updateShadowState = updateShadowState;
     this.table = _table;
     this.wrapper = wrapper;
     this.init();
   }
-
   _createClass(OverflowShadowsObserver, [{
     key: "updateStickyShadowsHeightIfChanged",
     value: function updateStickyShadowsHeightIfChanged() {
       if (!this.isSticky) {
         return;
       }
-
       var stickyCell = this.getStickyCell();
-
       if (!stickyCell) {
         return;
       }
-
       var newStickyRowHeight = stickyCell.clientHeight + 1;
-
       if (newStickyRowHeight === this.stickyRowHeight) {
         this.stickyRowHeight = newStickyRowHeight;
         this.updateStickyShadows(this.stickyRowHeight);
@@ -158,7 +124,6 @@ export var OverflowShadowsObserver = /*#__PURE__*/function () {
     key: "getStickyCell",
     value: function getStickyCell() {
       var _this$wrapper4;
-
       var stickyRow = (_this$wrapper4 = this.wrapper) === null || _this$wrapper4 === void 0 ? void 0 : _this$wrapper4.querySelector('tr.sticky');
       var stickyCell = stickyRow && stickyRow.firstElementChild;
       return stickyCell;
@@ -172,6 +137,5 @@ export var OverflowShadowsObserver = /*#__PURE__*/function () {
       }
     }
   }]);
-
   return OverflowShadowsObserver;
 }();