@seafile/sdoc-editor 0.3.6 → 0.3.7

package/dist/basic-sdk/extension/plugins/table/index.js

@@ -3,7 +3,7 @@ import { TableMenu } from './menu';
 import Table from './model';
 import withTable from './plugin';
 import { renderTable, renderTableRow, renderTableCell } from './render-elem';
-var TablePlugin = {
+const TablePlugin = {
   type: TABLE,
   nodeType: 'element',
   model: Table,

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/cell-bg-color-menu.js

@@ -4,30 +4,33 @@ import { ColorMenu } from '../../../../commons';
 import { RECENT_USED_TABLE_CELL_BACKGROUND_COLORS_KEY } from '../../../../constants';
 import { setCellStyle } from '../../helpers';
 import { useColorContext } from '../../../../../hooks/use-color-context';
-var menuConfig = {
+const menuConfig = {
   id: 'sdoc_background_color',
   iconClass: 'sdocfont sdoc-bg-color',
   text: 'Background_color'
 };
-var CellBackgroundColorMenu = function CellBackgroundColorMenu(_ref) {
-  var isRichEditor = _ref.isRichEditor,
-    className = _ref.className,
-    editor = _ref.editor;
-  var _useColorContext = useColorContext(),
-    lastUsedTableCellBackgroundColor = _useColorContext.lastUsedTableCellBackgroundColor,
-    updateLastUsedTableCellBackgroundColor = _useColorContext.updateLastUsedTableCellBackgroundColor;
-  var setColor = useCallback(function (color) {
+const CellBackgroundColorMenu = _ref => {
+  let {
+    isRichEditor,
+    className,
+    editor
+  } = _ref;
+  const {
+    lastUsedTableCellBackgroundColor,
+    updateLastUsedTableCellBackgroundColor
+  } = useColorContext();
+  const setColor = useCallback(color => {
     setCellStyle(editor, {
       background_color: color
     });
   }, [editor]);
-  var props = _objectSpread(_objectSpread({
-    isRichEditor: isRichEditor,
-    className: className,
+  const props = _objectSpread(_objectSpread({
+    isRichEditor,
+    className,
     disabled: false,
     isActive: false
   }, menuConfig), {}, {
-    onMouseDown: function onMouseDown() {},
+    onMouseDown: () => {},
     setColor: setColor,
     recentUsedColorsKey: RECENT_USED_TABLE_CELL_BACKGROUND_COLORS_KEY,
     lastUsedColor: lastUsedTableCellBackgroundColor,

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/cell-text-align-menu.js

@@ -1,18 +1,22 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import React, { useCallback, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import CommonMenu from './common-menu';
 import { setCellStyle } from '../../helpers';
 import { TABLE_CELL_STYLE } from '../../constants';
-var CellTextAlignMenu = function CellTextAlignMenu(_ref) {
-  var editor = _ref.editor,
-    readonly = _ref.readonly;
-  var textAlignRef = useRef(null);
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var setTextAlignStyle = useCallback(function (textAlign) {
+const CellTextAlignMenu = _ref => {
+  let {
+    editor,
+    readonly
+  } = _ref;
+  const textAlignRef = useRef(null);
+  const {
+    t
+  } = useTranslation();
+  const setTextAlignStyle = useCallback(textAlign => {
     if (readonly) return;
-    setCellStyle(editor, _defineProperty({}, TABLE_CELL_STYLE.TEXT_ALIGN, textAlign));
+    setCellStyle(editor, {
+      [TABLE_CELL_STYLE.TEXT_ALIGN]: textAlign
+    });
     textAlignRef.current && textAlignRef.current.hidePopover();
   }, [editor, readonly]);
   return /*#__PURE__*/React.createElement(CommonMenu, {
@@ -22,23 +26,17 @@ var CellTextAlignMenu = function CellTextAlignMenu(_ref) {
     disabled: readonly
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return setTextAlignStyle('left');
-    }
+    onClick: () => setTextAlignStyle('left')
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-align-left mr-2"
   }), t('Left')), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return setTextAlignStyle('center');
-    }
+    onClick: () => setTextAlignStyle('center')
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-align-center mr-2"
   }), t('Center')), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return setTextAlignStyle('right');
-    }
+    onClick: () => setTextAlignStyle('right')
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-align-right mr-2"
   }), t('Right')));

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/common-menu.js

@@ -1,82 +1,75 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import { UncontrolledPopover } from 'reactstrap';
-var CommonMenu = /*#__PURE__*/function (_Component) {
-  _inherits(CommonMenu, _Component);
-  var _super = _createSuper(CommonMenu);
-  function CommonMenu(props) {
-    var _this;
-    _classCallCheck(this, CommonMenu);
-    _this = _super.call(this, props);
-    _this.getClassName = function () {
-      var _this$props = _this.props,
-        isRichEditor = _this$props.isRichEditor,
-        className = _this$props.className,
-        disabled = _this$props.disabled;
-      var itemClass = 'btn btn-icon btn-secondary btn-active d-flex';
+class CommonMenu extends Component {
+  constructor(props) {
+    super(props);
+    this.getClassName = () => {
+      const {
+        isRichEditor,
+        className,
+        disabled
+      } = this.props;
+      let itemClass = 'btn btn-icon btn-secondary btn-active d-flex';
       if (!isRichEditor) return itemClass + ' ' + className + ' sdoc-menu-with-dropdown';
       itemClass = "rich-icon-btn d-flex ".concat(disabled ? 'rich-icon-btn-disabled' : 'rich-icon-btn-hover');
       return itemClass + ' ' + className + ' sdoc-menu-with-dropdown';
     };
-    _this.hidePopover = function () {
-      _this.ref && _this.ref.toggle && _this.ref.toggle();
+    this.hidePopover = () => {
+      this.ref && this.ref.toggle && this.ref.toggle();
     };
-    _this.setRef = function (ref) {
-      _this.ref = ref;
-      if (!_this.ref) return;
-      var toggle = _this.ref.toggle;
-      _this.ref.toggle = function () {
+    this.setRef = ref => {
+      this.ref = ref;
+      if (!this.ref) return;
+      const {
+        toggle
+      } = this.ref;
+      this.ref.toggle = () => {
         toggle && toggle();
-        _this.setState({
-          isShowMenu: !_this.state.isShowMenu
+        this.setState({
+          isShowMenu: !this.state.isShowMenu
         });
       };
     };
-    _this.state = {
+    this.state = {
       isShowMenu: false
     };
-    return _this;
   }
-  _createClass(CommonMenu, [{
-    key: "render",
-    value: function render() {
-      var _this$props2 = this.props,
-        id = _this$props2.id,
-        iconClass = _this$props2.iconClass,
-        children = _this$props2.children,
-        disabled = _this$props2.disabled;
-      var isShowMenu = this.state.isShowMenu;
-      var className = this.getClassName();
-      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
-        id: id,
-        type: "button",
-        className: className
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-menu-with-dropdown-icon"
-      }, /*#__PURE__*/React.createElement("i", {
-        className: iconClass
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-menu-with-dropdown-triangle"
-      }, /*#__PURE__*/React.createElement("i", {
-        className: "sdoc-menu-with-dropdown-triangle-icon sdocfont sdoc-".concat(isShowMenu ? 'caret-up' : 'drop-down')
-      }))), !disabled && /*#__PURE__*/React.createElement(UncontrolledPopover, {
-        target: id,
-        className: "sdoc-common-menu-popover sdoc-table-menu-popover",
-        trigger: "legacy",
-        placement: "bottom-start",
-        hideArrow: true,
-        fade: false,
-        ref: this.setRef
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu"
-      }, children)));
-    }
-  }]);
-  return CommonMenu;
-}(Component);
+  render() {
+    const {
+      id,
+      iconClass,
+      children,
+      disabled
+    } = this.props;
+    const {
+      isShowMenu
+    } = this.state;
+    const className = this.getClassName();
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("button", {
+      id: id,
+      type: "button",
+      className: className
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "sdoc-menu-with-dropdown-icon"
+    }, /*#__PURE__*/React.createElement("i", {
+      className: iconClass
+    })), /*#__PURE__*/React.createElement("div", {
+      className: "sdoc-menu-with-dropdown-triangle"
+    }, /*#__PURE__*/React.createElement("i", {
+      className: "sdoc-menu-with-dropdown-triangle-icon sdocfont sdoc-".concat(isShowMenu ? 'caret-up' : 'drop-down')
+    }))), !disabled && /*#__PURE__*/React.createElement(UncontrolledPopover, {
+      target: id,
+      className: "sdoc-common-menu-popover sdoc-table-menu-popover",
+      trigger: "legacy",
+      placement: "bottom-start",
+      hideArrow: true,
+      fade: false,
+      ref: this.setRef
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "sdoc-dropdown-menu"
+    }, children)));
+  }
+}
 CommonMenu.defaultProps = {
   isRichEditor: true,
   className: 'menu-group-item'

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/index.js

@@ -8,11 +8,13 @@ import RemoveTable from './remove-table-menu';
 import TableColumnMenu from './table-column-menu';
 import TableRowMenu from './table-row-menu';
 import './index.css';
-var ActiveTableMenu = function ActiveTableMenu(_ref) {
-  var isRichEditor = _ref.isRichEditor,
-    className = _ref.className,
-    editor = _ref.editor,
-    readonly = _ref.readonly;
+const ActiveTableMenu = _ref => {
+  let {
+    isRichEditor,
+    className,
+    editor,
+    readonly
+  } = _ref;
   if (!isAllInTable(editor)) return null;
   return /*#__PURE__*/React.createElement(MenuGroup, {
     className: "menu-group sdoc-table-menu-group"

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/remove-table-menu.js

@@ -5,18 +5,20 @@ import { MenuItem } from '../../../../commons';
 import { MENUS_CONFIG_MAP, REMOVE_TABLE } from '../../../../constants';
 import { removeTableElement } from '../../helpers';
 import { TABLE_ELEMENT } from '../../constants';
-var RemoveTable = function RemoveTable(_ref) {
-  var isRichEditor = _ref.isRichEditor,
-    className = _ref.className,
-    editor = _ref.editor,
-    readonly = _ref.readonly;
-  var removeTable = useCallback(function () {
+const RemoveTable = _ref => {
+  let {
+    isRichEditor,
+    className,
+    editor,
+    readonly
+  } = _ref;
+  const removeTable = useCallback(() => {
     if (readonly) return;
     removeTableElement(editor, TABLE_ELEMENT.TABLE);
   }, [editor, readonly]);
-  var menuConfig = MENUS_CONFIG_MAP[REMOVE_TABLE];
-  var props = _objectSpread(_objectSpread({
-    isRichEditor: isRichEditor,
+  const menuConfig = MENUS_CONFIG_MAP[REMOVE_TABLE];
+  const props = _objectSpread(_objectSpread({
+    isRichEditor,
     className: classnames(className, 'sdoc-remove-table menu-group-item'),
     disabled: readonly,
     isActive: false

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/table-column-menu.js

@@ -3,18 +3,21 @@ import { useTranslation } from 'react-i18next';
 import CommonMenu from './common-menu';
 import { insertTableElement, removeTableElement } from '../../helpers';
 import { TABLE_ELEMENT } from '../../constants';
-var TableColumnMenu = function TableColumnMenu(_ref) {
-  var editor = _ref.editor,
-    readonly = _ref.readonly;
-  var tableColumnRef = useRef(null);
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var insertColumn = useCallback(function (type) {
+const TableColumnMenu = _ref => {
+  let {
+    editor,
+    readonly
+  } = _ref;
+  const tableColumnRef = useRef(null);
+  const {
+    t
+  } = useTranslation();
+  const insertColumn = useCallback(type => {
     if (readonly) return;
     insertTableElement(editor, type);
     tableColumnRef.current && tableColumnRef.current.hidePopover();
   }, [editor, readonly]);
-  var removeColumn = useCallback(function (type) {
+  const removeColumn = useCallback(type => {
     if (readonly) return;
     removeTableElement(editor, type);
     tableColumnRef.current && tableColumnRef.current.hidePopover();
@@ -26,14 +29,10 @@ var TableColumnMenu = function TableColumnMenu(_ref) {
     disabled: readonly
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return insertColumn(TABLE_ELEMENT.COLUMN);
-    }
+    onClick: () => insertColumn(TABLE_ELEMENT.COLUMN)
   }, t('Insert_column')), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return removeColumn(TABLE_ELEMENT.COLUMN);
-    }
+    onClick: () => removeColumn(TABLE_ELEMENT.COLUMN)
   }, t('Remove_column')));
 };
 export default TableColumnMenu;

package/dist/basic-sdk/extension/plugins/table/menu/active-table-menu/table-row-menu.js

@@ -3,18 +3,21 @@ import { useTranslation } from 'react-i18next';
 import CommonMenu from './common-menu';
 import { insertTableElement, removeTableElement } from '../../helpers';
 import { TABLE_ELEMENT } from '../../constants';
-var TableRowMenu = function TableRowMenu(_ref) {
-  var editor = _ref.editor,
-    readonly = _ref.readonly;
-  var tableRowRef = useRef(null);
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var insertRow = useCallback(function (type) {
+const TableRowMenu = _ref => {
+  let {
+    editor,
+    readonly
+  } = _ref;
+  const tableRowRef = useRef(null);
+  const {
+    t
+  } = useTranslation();
+  const insertRow = useCallback(type => {
     if (readonly) return;
     insertTableElement(editor, type);
     tableRowRef.current && tableRowRef.current.hidePopover();
   }, [editor, readonly]);
-  var removeRow = useCallback(function (type) {
+  const removeRow = useCallback(type => {
     if (readonly) return;
     removeTableElement(editor, type);
     tableRowRef.current && tableRowRef.current.hidePopover();
@@ -26,14 +29,10 @@ var TableRowMenu = function TableRowMenu(_ref) {
     disabled: readonly
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return insertRow(TABLE_ELEMENT.ROW);
-    }
+    onClick: () => insertRow(TABLE_ELEMENT.ROW)
   }, t('Insert_row')), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-item",
-    onClick: function onClick() {
-      return removeRow(TABLE_ELEMENT.ROW);
-    }
+    onClick: () => removeRow(TABLE_ELEMENT.ROW)
   }, t('Remove_row')));
 };
 export default TableRowMenu;

package/dist/basic-sdk/extension/plugins/table/menu/table-context-menu/index.js

@@ -1,8 +1,3 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React from 'react';
 import { withTranslation } from 'react-i18next';
 import ObjectUtils from '../../../../../utils/object-utils';
@@ -13,128 +8,120 @@ import { TABLE_MAX_COLUMNS, TABLE_MAX_ROWS, TABLE_ELEMENT, TABLE_ELEMENT_POSITIO
 import { insertTableElement, removeTableElement } from '../../helpers';
 import InsertTableElement from './insert-table-element';
 import './index.css';
-var TableContextMenu = /*#__PURE__*/function (_React$Component) {
-  _inherits(TableContextMenu, _React$Component);
-  var _super = _createSuper(TableContextMenu);
-  function TableContextMenu(props) {
-    var _this;
-    _classCallCheck(this, TableContextMenu);
-    _this = _super.call(this, props);
-    _this.updateMenuPosition = function () {
-      var menuHeight = _this.menu.offsetHeight;
+class TableContextMenu extends React.Component {
+  constructor(props) {
+    super(props);
+    this.updateMenuPosition = () => {
+      const menuHeight = this.menu.offsetHeight;
 
       // get height of context menu when the menu is drawing completed in this page
       if (menuHeight === 0) {
-        requestAnimationFrame(_this.updateMenuPosition);
+        requestAnimationFrame(this.updateMenuPosition);
         return;
       }
-      var top = 0;
-      if (_this.position.top + menuHeight > document.body.clientHeight) {
+      let top = 0;
+      if (this.position.top + menuHeight > document.body.clientHeight) {
         top = document.body.clientHeight - menuHeight - 5;
       } else {
-        top = _this.position.top;
+        top = this.position.top;
       }
-      var left = _this.position.left + 3;
-      _this.setState({
+      const left = this.position.left + 3;
+      this.setState({
         contextStyle: {
-          top: top,
-          left: left
+          top,
+          left
         }
       });
     };
-    _this.insertTableElement = function (type, position, count) {
-      var editor = _this.props.editor;
+    this.insertTableElement = (type, position, count) => {
+      const {
+        editor
+      } = this.props;
       insertTableElement(editor, type, position, count);
     };
-    _this.removeTableElement = function (type) {
-      var editor = _this.props.editor;
+    this.removeTableElement = type => {
+      const {
+        editor
+      } = this.props;
       removeTableElement(editor, type);
     };
-    _this.renderRemoveBtn = function (type, title) {
+    this.renderRemoveBtn = (type, title) => {
       return /*#__PURE__*/React.createElement("button", {
-        onMouseDown: _this.removeTableElement.bind(_assertThisInitialized(_this), type),
+        onMouseDown: this.removeTableElement.bind(this, type),
         className: "dropdown-item"
-      }, _this.props.t(title));
+      }, this.props.t(title));
     };
-    _this.state = {
+    this.state = {
       contextStyle: {}
     };
-    _this.position = null;
-    return _this;
+    this.position = null;
   }
-  _createClass(TableContextMenu, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.position = this.props.contextMenuPosition;
+  componentDidMount() {
+    this.position = this.props.contextMenuPosition;
+    this.updateMenuPosition();
+  }
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    const nextContextMenuPosition = nextProps.contextMenuPosition;
+    if (!ObjectUtils.isSameObject(nextContextMenuPosition, this.props.contextMenuPosition)) {
+      this.position = nextContextMenuPosition;
       this.updateMenuPosition();
     }
-  }, {
-    key: "UNSAFE_componentWillReceiveProps",
-    value: function UNSAFE_componentWillReceiveProps(nextProps) {
-      var nextContextMenuPosition = nextProps.contextMenuPosition;
-      if (!ObjectUtils.isSameObject(nextContextMenuPosition, this.props.contextMenuPosition)) {
-        this.position = nextContextMenuPosition;
-        this.updateMenuPosition();
-      }
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.menu = null;
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      var contextStyle = this.state.contextStyle;
-      var editor = this.props.editor;
-      var currentTable = getSelectedNodeByType(editor, ELEMENT_TYPE.TABLE);
-      if (!currentTable) return null;
-      var currentRow = getSelectedNodeByType(editor, ELEMENT_TYPE.TABLE_ROW);
-      var currentRowsCount = currentTable.children.length;
-      var currentColumnsCount = currentRow.children.length;
-      var tableSelectedRange = editor.tableSelectedRange;
-      var selectedRows = tableSelectedRange.maxRowIndex - tableSelectedRange.minRowIndex + 1;
-      var selectedCols = tableSelectedRange.maxColIndex - tableSelectedRange.minColIndex + 1;
-      var canAddRowsCount = currentRowsCount + selectedRows > TABLE_MAX_ROWS ? TABLE_MAX_ROWS - currentRowsCount : selectedRows;
-      var canAddColsCount = currentColumnsCount + selectedCols > TABLE_MAX_COLUMNS ? TABLE_MAX_COLUMNS - currentColumnsCount : selectedCols;
-      return /*#__PURE__*/React.createElement(ElementPopover, {
-        className: "sdoc-context-menu"
-      }, /*#__PURE__*/React.createElement("div", {
-        style: contextStyle,
-        ref: function ref(_ref) {
-          return _this2.menu = _ref;
-        },
-        className: "sdoc-table-context-menu dropdown-menu"
-      }, /*#__PURE__*/React.createElement(InsertTableElement, {
-        type: TABLE_ELEMENT.ROW,
-        count: canAddRowsCount,
-        currentCount: currentRowsCount,
-        position: TABLE_ELEMENT_POSITION.BEFORE,
-        insertTableElement: this.insertTableElement
-      }), /*#__PURE__*/React.createElement(InsertTableElement, {
-        type: TABLE_ELEMENT.ROW,
-        count: canAddRowsCount,
-        currentCount: currentRowsCount,
-        position: TABLE_ELEMENT_POSITION.AFTER,
-        insertTableElement: this.insertTableElement
-      }), /*#__PURE__*/React.createElement(InsertTableElement, {
-        type: TABLE_ELEMENT.COLUMN,
-        count: canAddColsCount,
-        currentCount: currentColumnsCount,
-        position: TABLE_ELEMENT_POSITION.BEFORE,
-        insertTableElement: this.insertTableElement
-      }), /*#__PURE__*/React.createElement(InsertTableElement, {
-        type: TABLE_ELEMENT.COLUMN,
-        count: canAddColsCount,
-        currentCount: currentColumnsCount,
-        position: TABLE_ELEMENT_POSITION.AFTER,
-        insertTableElement: this.insertTableElement
-      }), /*#__PURE__*/React.createElement("div", {
-        className: 'seafile-divider dropdown-divider'
-      }), this.renderRemoveBtn(TABLE_ELEMENT.ROW, 'Delete_row'), this.renderRemoveBtn(TABLE_ELEMENT.COLUMN, 'Delete_column'), this.renderRemoveBtn(TABLE_ELEMENT.TABLE, 'Delete_table')));
-    }
-  }]);
-  return TableContextMenu;
-}(React.Component);
+  }
+  componentWillUnmount() {
+    this.menu = null;
+  }
+  render() {
+    const {
+      contextStyle
+    } = this.state;
+    const {
+      editor
+    } = this.props;
+    const currentTable = getSelectedNodeByType(editor, ELEMENT_TYPE.TABLE);
+    if (!currentTable) return null;
+    const currentRow = getSelectedNodeByType(editor, ELEMENT_TYPE.TABLE_ROW);
+    const currentRowsCount = currentTable.children.length;
+    const currentColumnsCount = currentRow.children.length;
+    const {
+      tableSelectedRange
+    } = editor;
+    const selectedRows = tableSelectedRange.maxRowIndex - tableSelectedRange.minRowIndex + 1;
+    const selectedCols = tableSelectedRange.maxColIndex - tableSelectedRange.minColIndex + 1;
+    const canAddRowsCount = currentRowsCount + selectedRows > TABLE_MAX_ROWS ? TABLE_MAX_ROWS - currentRowsCount : selectedRows;
+    const canAddColsCount = currentColumnsCount + selectedCols > TABLE_MAX_COLUMNS ? TABLE_MAX_COLUMNS - currentColumnsCount : selectedCols;
+    return /*#__PURE__*/React.createElement(ElementPopover, {
+      className: "sdoc-context-menu"
+    }, /*#__PURE__*/React.createElement("div", {
+      style: contextStyle,
+      ref: ref => this.menu = ref,
+      className: "sdoc-table-context-menu dropdown-menu"
+    }, /*#__PURE__*/React.createElement(InsertTableElement, {
+      type: TABLE_ELEMENT.ROW,
+      count: canAddRowsCount,
+      currentCount: currentRowsCount,
+      position: TABLE_ELEMENT_POSITION.BEFORE,
+      insertTableElement: this.insertTableElement
+    }), /*#__PURE__*/React.createElement(InsertTableElement, {
+      type: TABLE_ELEMENT.ROW,
+      count: canAddRowsCount,
+      currentCount: currentRowsCount,
+      position: TABLE_ELEMENT_POSITION.AFTER,
+      insertTableElement: this.insertTableElement
+    }), /*#__PURE__*/React.createElement(InsertTableElement, {
+      type: TABLE_ELEMENT.COLUMN,
+      count: canAddColsCount,
+      currentCount: currentColumnsCount,
+      position: TABLE_ELEMENT_POSITION.BEFORE,
+      insertTableElement: this.insertTableElement
+    }), /*#__PURE__*/React.createElement(InsertTableElement, {
+      type: TABLE_ELEMENT.COLUMN,
+      count: canAddColsCount,
+      currentCount: currentColumnsCount,
+      position: TABLE_ELEMENT_POSITION.AFTER,
+      insertTableElement: this.insertTableElement
+    }), /*#__PURE__*/React.createElement("div", {
+      className: 'seafile-divider dropdown-divider'
+    }), this.renderRemoveBtn(TABLE_ELEMENT.ROW, 'Delete_row'), this.renderRemoveBtn(TABLE_ELEMENT.COLUMN, 'Delete_column'), this.renderRemoveBtn(TABLE_ELEMENT.TABLE, 'Delete_table')));
+  }
+}
 export default withTranslation('sdoc-editor')(TableContextMenu);