@seafile/sdoc-editor 0.5.69 → 0.5.71

package/dist/basic-sdk/editor/editable-article.js

@@ -1,6 +1,6 @@
 import React, { useCallback, useMemo, Fragment } from 'react';
 import { Editable, ReactEditor, Slate } from '@seafile/slate-react';
-import { Editor, Node, Transforms } from '@seafile/slate';
+import { Editor, Node, Range, Transforms } from '@seafile/slate';
 import scrollIntoView from 'scroll-into-view-if-needed';
 import { renderLeaf, renderElement, ContextToolbar, SideToolbar } from '../extension';
 import { getAboveBlockNode, getNextNode, getPrevNode, isSelectionAtBlockEnd, isSelectionAtBlockStart, getCurrentNode, isCurrentLineEmpty, isCurrentLineHasText } from '../extension/core';
@@ -89,8 +89,9 @@ const EditableArticle = _ref => {
       if (getPrevNode(editor)) {
         [prevNode, prevPath] = getPrevNode(editor);
       }
-      // If the cursor is at the beginning, and the current line is not empty, is not a CODE_LINE, and the previous line is a CODE_LINE.
-      if (prevNode && isSelectionAtBlockStart(editor) && !isCurrentLineEmpty(editor) && prevNode.type === CODE_LINE && currentNode.type !== CODE_LINE) {
+      // If the cursor is collapsed at the beginning, and the current line is not empty, is not a CODE_LINE, and the previous line is a CODE_LINE.
+      const isCursorCollapsed = Range.isCollapsed(editor.selection);
+      if (isCursorCollapsed && prevNode && isSelectionAtBlockStart(editor) && !isCurrentLineEmpty(editor) && prevNode.type === CODE_LINE && currentNode.type !== CODE_LINE) {
         if (!isCurrentLineHasText(currentNode)) {
           const prevNodeText = Node.string(prevNode);
           Transforms.removeNodes(editor, {

package/dist/basic-sdk/editor/sdoc-editor.js

@@ -25,8 +25,7 @@ const SdocEditor = forwardRef((_ref, ref) => {
     isReloading,
     showComment,
     isShowHeaderToolbar = true,
-    showOutline = true,
-    isWikiReadOnly
+    showOutline = true
   } = _ref;
   const validEditor = propsEditor || useMemo(() => {
     const defaultEditor = createDefaultEditor();
@@ -167,22 +166,6 @@ const SdocEditor = forwardRef((_ref, ref) => {
   }
   const isShowComment = typeof showComment === 'boolean' ? showComment : true;
   const Provider = isShowComment ? CollaboratorsProvider : Fragment;
-  if (isWikiReadOnly) {
-    return /*#__PURE__*/React.createElement(EditorContainer, {
-      editor: validEditor,
-      readonly: isWikiReadOnly
-    }, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement(EditorContent, {
-      docValue: slateValue,
-      showOutline: showOutline !== null && showOutline !== void 0 ? showOutline : true,
-      readonly: isWikiReadOnly,
-      editor: validEditor,
-      showComment: isShowComment
-    }, /*#__PURE__*/React.createElement(ReadOnlyArticle, {
-      editor: validEditor,
-      slateValue: slateValue,
-      showComment: isShowComment
-    }))));
-  }
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorContainer, {
     editor: validEditor
   }, /*#__PURE__*/React.createElement(Provider, null, /*#__PURE__*/React.createElement(ColorProvider, null, isShowHeaderToolbar && /*#__PURE__*/React.createElement(HeaderToolbar, {

package/dist/basic-sdk/editor/wiki-editor.js

@@ -0,0 +1,161 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import React, { useEffect, useState, useImperativeHandle, forwardRef, useMemo, useCallback } from 'react';
+import { Editor } from '@seafile/slate';
+import deepCopy from 'deep-copy';
+import context from '../../context';
+import CommonLoading from '../../components/common-loading';
+import { INTERNAL_EVENT, PAGE_EDIT_AREA_WIDTH } from '../constants';
+import { createDefaultEditor } from '../extension';
+import withNodeId from '../node-id';
+import { withSocketIO } from '../socket';
+import { focusEditor } from '../extension/core';
+import InsertElementDialog from '../extension/commons/insert-element-dialog';
+import { EditorContainer, EditorContent } from '../layout';
+import EditableArticle from './editable-article';
+import { ColorProvider } from '../hooks/use-color-context';
+import ReadOnlyArticle from '../views/readonly-article';
+import { isMobile } from '../../utils';
+import { EventBus } from '../../basic-sdk';
+import { EXTERNAL_EVENT } from '../../constants';
+const WikiEditor = forwardRef((_ref, ref) => {
+  let {
+    editor: propsEditor,
+    document,
+    isReloading,
+    isWikiReadOnly,
+    topSlot
+  } = _ref;
+  const validEditor = propsEditor || useMemo(() => {
+    const defaultEditor = createDefaultEditor();
+    const editorConfig = context.getEditorConfig();
+    const newEditor = withNodeId(withSocketIO(defaultEditor, {
+      document,
+      config: editorConfig
+    }));
+    const {
+      cursors
+    } = document;
+    newEditor.cursors = cursors || {};
+    newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
+    return newEditor;
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const [slateValue, setSlateValue] = useState(document.children);
+
+  // Fix: The editor's children are not updated when the document is updated in revision
+  // In revision mode, the document is updated, but the editor's children are not updated,as onValueChange override the new document.children. This unexpected action cause the editor to display the old content
+  useEffect(() => {
+    setSlateValue(document.children);
+  }, [document.children]);
+  useEffect(() => {
+    validEditor.readonly = false;
+    return () => {
+      validEditor.selection = null;
+    };
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  // useMount: init socket connection
+  useEffect(() => {
+    if (propsEditor) return;
+    validEditor.openConnection();
+    return () => {
+      validEditor.closeConnection();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  // useMount: focus editor
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      const [firstNode] = validEditor.children;
+      if (firstNode) {
+        const [firstNodeFirstChild] = firstNode.children;
+        if (firstNodeFirstChild) {
+          const endOfFirstNode = Editor.end(validEditor, [0, 0]);
+          const range = {
+            anchor: endOfFirstNode,
+            focus: endOfFirstNode
+          };
+          focusEditor(validEditor, range);
+        }
+      }
+    }, 300);
+    return () => {
+      clearTimeout(timer);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const onRefreshDocument = useCallback(() => {
+    window.location.reload();
+  }, []);
+
+  // useMount: refresh document
+  useEffect(() => {
+    const eventBus = EventBus.getInstance();
+    eventBus.subscribe(EXTERNAL_EVENT.REFRESH_DOCUMENT, onRefreshDocument);
+  }, [onRefreshDocument]);
+
+  // The parent component can call the method of this component through ref
+  useImperativeHandle(ref, () => ({
+    setSlateValue: document => {
+      // Force update of editor's child elements
+      validEditor.children = document.children;
+      setSlateValue([...document.children]);
+    },
+    updateDocumentVersion: document => {
+      validEditor.updateDocumentVersion(document);
+    },
+    // get value
+    getSlateValue: () => {
+      return deepCopy(_objectSpread(_objectSpread({}, document), {}, {
+        children: slateValue
+      }));
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }), [document, validEditor, slateValue]);
+  const onValueChange = value => {
+    const eventBus = EventBus.getInstance();
+    eventBus.dispatch(INTERNAL_EVENT.UPDATE_SEARCH_REPLACE_HIGHLIGHT, value);
+    setSlateValue(value);
+  };
+  if (isReloading) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "h-100 w-100 d-flex align-items-center justify-content-center"
+    }, /*#__PURE__*/React.createElement(CommonLoading, null));
+  }
+  if (isMobile || isWikiReadOnly) {
+    return /*#__PURE__*/React.createElement(EditorContainer, {
+      editor: validEditor,
+      readonly: true
+    }, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement(EditorContent, {
+      docValue: slateValue,
+      readonly: true,
+      showOutline: false,
+      editor: validEditor,
+      showComment: false
+    }, topSlot, /*#__PURE__*/React.createElement(ReadOnlyArticle, {
+      editor: validEditor,
+      slateValue: slateValue,
+      showComment: false
+    }))));
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorContainer, {
+    editor: validEditor
+  }, /*#__PURE__*/React.createElement(ColorProvider, null, /*#__PURE__*/React.createElement(EditorContent, {
+    docValue: slateValue,
+    showOutline: false,
+    editor: validEditor,
+    showComment: false
+  }, topSlot, /*#__PURE__*/React.createElement(EditableArticle, {
+    editor: validEditor,
+    slateValue: slateValue,
+    updateSlateValue: onValueChange,
+    showComment: false
+  })))), /*#__PURE__*/React.createElement(InsertElementDialog, {
+    editor: validEditor
+  }));
+});
+export default WikiEditor;

package/dist/basic-sdk/extension/commons/file-insert-dialog/index.js

@@ -1,17 +1,18 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import React, { useCallback, useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { ReactEditor } from '@seafile/slate-react';
 import { useTranslation } from 'react-i18next';
-import { Editor } from '@seafile/slate';
+import { Editor, Node } from '@seafile/slate';
 import classNames from 'classnames';
 import context from '../../../../context';
 import { LocalStorage, isEnglish } from '../../../../utils';
 import { EXTERNAL_EVENT } from '../../../../constants';
 import EventBus from '../../../utils/event-bus';
-import { INTERNAL_EVENT } from '../../../constants';
+import { INTERNAL_EVENT, WIKI_EDITOR } from '../../../constants';
 import { SDOC_LINK } from '../../constants';
 import toaster from '../../../../components/toast';
 import { insertSdocFileLink, insertTextWhenRemoveFileNameCollector, removeTempInput } from '../../plugins/sdoc-link/helpers';
+import { insertWikiPageLink } from '../../plugins/wiki-link/helpers';
 import './style.css';
 const FileLinkInsertDialog = _ref => {
   let {
@@ -19,7 +20,6 @@ const FileLinkInsertDialog = _ref => {
     element,
     closeDialog
   } = _ref;
-  const eventBus = EventBus.getInstance();
   const historyFileWrapperRef = useRef(document.querySelector('.sdoc-history-files-wrapper'));
   const [files, setFiles] = useState([]);
   const [position, setPosition] = useState({
@@ -31,6 +31,7 @@ const FileLinkInsertDialog = _ref => {
     t
   } = useTranslation();
   const [header, setHeader] = useState(t('Recent_visited'));
+  const eventBus = EventBus.getInstance();
   const deleteInputAndInsertText = useCallback(function () {
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
@@ -63,6 +64,17 @@ const FileLinkInsertDialog = _ref => {
         const counterTopGap = 8;
         popoverTop = top - popoverHeight - counterTopGap;
       }
+      if (editor.editorType === WIKI_EDITOR) {
+        const wikiEditorContainer = document.querySelector('.sdoc-editor-container');
+        if (wikiEditorContainer) {
+          const {
+            left,
+            top
+          } = wikiEditorContainer.getBoundingClientRect();
+          popoverLeft -= left;
+          popoverTop -= top;
+        }
+      }
       setPosition({
         top: popoverTop,
         left: popoverLeft
@@ -81,9 +93,10 @@ const FileLinkInsertDialog = _ref => {
     getPosition();
   }, [getPosition]);
   const getHistoryFiles = useCallback(e => {
-    const files = LocalStorage.getItem('sdoc-recent-files') || [];
+    const getItemKey = editor.editorType === WIKI_EDITOR ? 'wiki-recent-files' : 'sdoc-recent-files';
+    const files = LocalStorage.getItem(getItemKey) || [];
     setFiles(files);
-  }, []);
+  }, [editor.editorType]);
   useEffect(() => {
     getHistoryFiles();
   }, [getHistoryFiles]);
@@ -168,17 +181,23 @@ const FileLinkInsertDialog = _ref => {
   }, []);
   useEffect(() => {
     if (!(element === null || element === void 0 ? void 0 : element.children)) return;
-    const searchText = element.children[0].text;
+    const searchText = Node.string(element);
     onSearch(searchText);
   }, [element, onSearch]);
   const onSelect = useCallback(fileInfo => {
     const {
       doc_uuid,
-      name
+      name,
+      wikiRepoId,
+      pageId
     } = fileInfo;
     removeTempInput(editor, element);
     closeDialog();
-    insertSdocFileLink(editor, name, doc_uuid);
+    if (editor.editorType === WIKI_EDITOR) {
+      insertWikiPageLink(editor, name, wikiRepoId, pageId);
+    } else {
+      insertSdocFileLink(editor, name, doc_uuid);
+    }
   }, [closeDialog, editor, element]);
   const onShowMore = useCallback(() => {
     eventBus.dispatch(INTERNAL_EVENT.INSERT_ELEMENT, {
@@ -189,10 +208,17 @@ const FileLinkInsertDialog = _ref => {
   }, [editor, element, eventBus]);
   const onCreateFile = useCallback(() => {
     const eventBus = EventBus.getInstance();
-    eventBus.dispatch(EXTERNAL_EVENT.CREATE_SDOC_FILE, {
+    const dispatchEventKey = editor.editorType === WIKI_EDITOR ? EXTERNAL_EVENT.CREATE_WIKI_PAGE : EXTERNAL_EVENT.CREATE_SDOC_FILE;
+    eventBus.dispatch(dispatchEventKey, {
       newFileName: newFileName.trim()
     });
-  }, [newFileName]);
+  }, [editor.editorType, newFileName]);
+  const createFileTipDefault = useMemo(() => {
+    return editor.editorType === WIKI_EDITOR ? 'New_page' : 'Create_a_new_sdoc_file';
+  }, [editor.editorType]);
+  const createFileName = useMemo(() => {
+    return editor.editorType === WIKI_EDITOR ? newFileName : "".concat(newFileName, ".sdoc");
+  }, [editor.editorType, newFileName]);
   return /*#__PURE__*/React.createElement("div", {
     className: "sdoc-history-files-content popover",
     style: _objectSpread(_objectSpread({}, position), {}, {
@@ -225,7 +251,7 @@ const FileLinkInsertDialog = _ref => {
   }), /*#__PURE__*/React.createElement("span", {
     className: "new-file-name"
   }, newFileName ? t('Create_file_name_sdoc', {
-    file_name_sdoc: "".concat(newFileName, ".sdoc")
-  }) : t('Create_a_new_sdoc_file'))));
+    file_name_sdoc: createFileName
+  }) : t(createFileTipDefault))));
 };
 export default FileLinkInsertDialog;

package/dist/basic-sdk/extension/commons/insert-element-dialog/index.js

@@ -18,6 +18,8 @@ const InsertElementDialog = _ref => {
   const [slateNode, setSlateNode] = useState(null);
   const [insertLinkCallback, setInsertLinkCallback] = useState(null);
   const [validEditor, setValidEditor] = useState(editor);
+  const [linkTitle, setLinkTitle] = useState('');
+  const [handleSubmit, setHandleSubmit] = useState(() => void 0);
   const uploadLocalImageInputRef = useRef();
   const onFileChanged = useCallback(event => {
     const files = event.target.files;
@@ -45,7 +47,10 @@ const InsertElementDialog = _ref => {
       slateNode,
       insertFileLinkCallback,
       insertSdocFileLinkCallback,
-      editor: paramEditor
+      editor: paramEditor,
+      linkTitle,
+      // link shortcut wrapping link
+      handleSubmit
     } = _ref2;
     setInsertPosition(insertPosition);
     setSlateNode(slateNode);
@@ -55,6 +60,8 @@ const InsertElementDialog = _ref => {
       insertSdocFileLinkCallback,
       insertFileLinkCallback
     });
+    setLinkTitle(linkTitle);
+    setHandleSubmit(handleSubmit);
     // Apply for comment editor, as it has a different editor instance
     setValidEditor(paramEditor || editor);
     if (type === LOCAL_IMAGE) {
@@ -70,13 +77,16 @@ const InsertElementDialog = _ref => {
     setDialogType('');
     setInsertLinkCallback(null);
     setValidEditor(null);
+    setLinkTitle('');
   }, []);
   const props = {
     insertPosition,
     slateNode,
     editor: validEditor,
     element,
-    closeDialog
+    closeDialog,
+    linkTitle,
+    handleSubmit
   };
   switch (dialogType) {
     case ELEMENT_TYPE.TABLE:

package/dist/basic-sdk/extension/constants/element-type.js

@@ -20,6 +20,7 @@ export const TABLE_ROW = 'table_row';
 export const TABLE_CELL = 'table_cell';
 export const LINK = 'link';
 export const SDOC_LINK = 'sdoc_link';
+export const WIKI_LINK = 'wiki_link';
 export const FILE_LINK = 'file_link';
 export const IMAGE = 'image';
 export const IMAGE_BLOCK = 'image_block';

package/dist/basic-sdk/extension/constants/index.js

@@ -1,7 +1,7 @@
 // extension plugin
 import * as ELEMENT_TYPE from './element-type';
 // eslint-disable-next-line no-duplicate-imports
-import { BLOCKQUOTE, TITLE, SUBTITLE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, CHECK_LIST_ITEM, CODE_BLOCK, CODE_LINE, TABLE, TABLE_CELL, TABLE_ROW, LINK, SDOC_LINK, FILE_LINK, IMAGE, IMAGE_BLOCK, TOP_LEVEL_TYPES, INLINE_LEVEL_TYPES, CALL_OUT, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT } from './element-type';
+import { BLOCKQUOTE, TITLE, SUBTITLE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, CHECK_LIST_ITEM, CODE_BLOCK, CODE_LINE, TABLE, TABLE_CELL, TABLE_ROW, LINK, SDOC_LINK, FILE_LINK, IMAGE, IMAGE_BLOCK, TOP_LEVEL_TYPES, INLINE_LEVEL_TYPES, CALL_OUT, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT, COLUMN } from './element-type';
 export { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BACKGROUND_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BACKGROUND_COLOR } from './color';
 export { FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, SDOC_FONT_SIZE } from './font';
 export { DIFF_TYPE, ADDED_STYLE, DELETED_STYLE } from './diff-view';
@@ -38,7 +38,7 @@ export const FILE_TYPE = {
   [FILE_LINK]: 'file',
   [SDOC_LINK]: 'sdoc'
 };
-export const SUPPORTED_SIDE_OPERATION_TYPE = [PARAGRAPH, SUBTITLE, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, CHECK_LIST_ITEM, CODE_BLOCK, TABLE, BLOCKQUOTE, CALL_OUT, IMAGE_BLOCK];
+export const SUPPORTED_SIDE_OPERATION_TYPE = [PARAGRAPH, SUBTITLE, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, CHECK_LIST_ITEM, CODE_BLOCK, TABLE, BLOCKQUOTE, CALL_OUT, IMAGE_BLOCK, COLUMN];
 export const MOUSE_ENTER_EVENT_DISABLED_MAP = {
   [PARAGRAPH]: [CALL_OUT],
   [TITLE]: [CALL_OUT],

package/dist/basic-sdk/extension/plugins/column/column-list-menu.css

@@ -0,0 +1,35 @@
+.column-list-menu {
+    position: absolute;
+    left: -8px;
+    background-color: #fff;
+    min-width: 12rem;
+    width: 200px;
+}
+
+.column-list-menu .column-list-menu-item-container {
+    padding: 3px 12px;
+}
+
+.column-list-menu .column-list-menu-item-container .column-list-menu-item {
+    height: fit-content;
+    width: 100%;
+    display: flex;
+    align-items: center;
+}
+
+.column-list-menu .column-list-menu-item-container .column-list-menu-item .control-icon {
+    margin-right: 10px;
+    flex-shrink: 0;
+}
+
+.column-list-menu .column-list-menu-item-container .column-list-menu-item .control-label {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    flex-grow: 1;
+}
+
+.column-list-menu .column-list-menu-item-container:hover {
+    background-color: #f5f5f5;
+    cursor: pointer;
+}

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

@@ -0,0 +1,47 @@
+import React, { useMemo, useCallback } from 'react';
+import { COLUMNS_ICON_CONFIG } from './constants/column';
+import { insertSeaTableColumn, getColumnType } from './helpers';
+import { COLUMN } from '../../constants/element-type';
+import './column-list-menu.css';
+const NOT_SUPPORT_COLUMN_TYPES = ['button', 'file'];
+export default function ColumnListMenu(_ref) {
+  let {
+    editor
+  } = _ref;
+  const columns = useMemo(() => {
+    if (!editor.columns) return [];
+    return editor.columns.filter(column => !NOT_SUPPORT_COLUMN_TYPES.includes(column.type));
+  }, [editor.columns]);
+  const options = useMemo(() => {
+    return columns.map(item => {
+      const iconClass = COLUMNS_ICON_CONFIG[item.type];
+      return {
+        value: item.key,
+        label: item.name,
+        iconClass
+      };
+    });
+  }, [columns]);
+  const isActive = editor => {
+    return getColumnType(editor) === COLUMN;
+  };
+  const onMousedown = useCallback(option => {
+    const active = isActive(editor);
+    insertSeaTableColumn(editor, active, option);
+  }, [editor]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "column-list-menu"
+  }, options.map(option => {
+    return /*#__PURE__*/React.createElement("div", {
+      key: option.value,
+      className: "column-list-menu-item-container",
+      onClick: () => onMousedown(option)
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "column-list-menu-item"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "control-icon ".concat(option.iconClass)
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "control-label"
+    }, option.label)));
+  }));
+}

package/dist/basic-sdk/extension/plugins/column/helpers.js

@@ -1,24 +1,29 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { Editor, Transforms } from '@seafile/slate';
+import { Editor, Transforms, Range } from '@seafile/slate';
 import slugid from 'slugid';
 import { BLOCKQUOTE, CHECK_LIST_ITEM, COLUMN, IMAGE, ORDERED_LIST, PARAGRAPH, TABLE_CELL, UNORDERED_LIST } from '../../constants/element-type';
 import { focusEditor, getNodeType } from '../../core';
 import Column from './model';
 export const isMenuDisabled = (editor, readonly) => {
   if (readonly) return true;
-  if (editor.selection == null) return true;
+  const {
+    selection
+  } = editor;
+  if (selection == null) return true;
+  if (!Range.isCollapsed(selection)) return true;
   const [nodeEntry] = Editor.nodes(editor, {
     match: n => {
       const type = getNodeType(n);
 
       // Only available for p and blockquote
-      if (type === PARAGRAPH) return true;
-      if (type === BLOCKQUOTE) return true;
+      if (type === BLOCKQUOTE) return false;
+      if (type === PARAGRAPH) return false;
       if (type === UNORDERED_LIST) return true;
       if (type === ORDERED_LIST) return true;
       if (type === CHECK_LIST_ITEM) return true;
       if (type === IMAGE) return true;
       if (type === TABLE_CELL) return true;
+      if (Editor.isVoid(editor, n)) return true;
       return false;
     },
     universal: true,
@@ -27,9 +32,9 @@ export const isMenuDisabled = (editor, readonly) => {
 
   // Match to p blockquote, do not disable
   if (nodeEntry) {
-    return false;
+    return true;
   }
-  return true;
+  return false;
 };
 export const getColumnType = editor => {
   const [match] = Editor.nodes(editor, {
@@ -40,9 +45,9 @@ export const getColumnType = editor => {
   const [n] = match;
   return getNodeType(n);
 };
-export const insertSeaTableColumn = (editor, active) => {
+export const insertSeaTableColumn = (editor, active, option) => {
   if (!active) {
-    const column = new Column({});
+    const column = new Column(option);
     column.id = slugid.nice();
     Transforms.insertNodes(editor, _objectSpread({}, column));
   }

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

@@ -1,11 +1,9 @@
 import { COLUMN } from '../../constants/element-type';
-import ColumnMenu from './menu';
 import withColumn from './plugin';
 import renderColumn from './render-elem';
 const ColumnPlugin = {
   type: COLUMN,
   nodeType: 'element',
-  editorMenus: [ColumnMenu],
   editorPlugin: withColumn,
   renderElements: [renderColumn]
 };

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

@@ -0,0 +1,31 @@
+import React from 'react';
+import { MENUS_CONFIG_MAP, ELEMENT_TYPE } from '../../../constants';
+import DropdownMenuItem from '../../../commons/dropdown-menu-item';
+import ColumnListMenu from '../column-list-menu';
+import { UncontrolledPopover } from 'reactstrap';
+import { isMenuDisabled } from '../helpers';
+const SeatableColumnMenu = _ref => {
+  let {
+    editor,
+    readonly
+  } = _ref;
+  const disabled = isMenuDisabled(editor, readonly);
+  const menuConfig = MENUS_CONFIG_MAP[ELEMENT_TYPE.COLUMN];
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownMenuItem, {
+    disabled: disabled,
+    menuConfig: menuConfig,
+    className: "pr-2"
+  }, !disabled && /*#__PURE__*/React.createElement("i", {
+    className: "sdocfont sdoc-right-slide sdoc-dropdown-item-right-icon"
+  })), !disabled && /*#__PURE__*/React.createElement(UncontrolledPopover, {
+    target: menuConfig.id,
+    trigger: "hover",
+    placement: "right-start",
+    hideArrow: true,
+    fade: false
+  }, /*#__PURE__*/React.createElement(ColumnListMenu, {
+    editor: editor,
+    readonly: readonly
+  })));
+};
+export default SeatableColumnMenu;

package/dist/basic-sdk/extension/plugins/column/model.js

@@ -1,14 +1,12 @@
 import { generateDefaultText } from '../../core';
 class Column {
-  constructor(options) {
-    this.type = options.type || 'column';
-    this.data = options.data || {
-      key: '',
-      name: '',
-      bold: false,
-      italic: false
+  constructor(option) {
+    this.type = 'column';
+    this.children = [generateDefaultText()];
+    this.data = {
+      key: option.value,
+      name: option.label
     };
-    this.children = options.children || [generateDefaultText()];
   }
 }
 export default Column;