@seafile/seafile-editor 1.0.85-beta9 → 1.0.86-beta

package/dist/editors/inline-editor/index.js

@@ -19,25 +19,26 @@ require("./index.css");
 const isMacOS = (0, _common.isMac)();
 const InlineEditor = _ref => {
   let {
-    isFocus,
+    isShowEditor,
+    focusNodePath,
     value,
     editorApi,
     onSave,
     columns,
     onContentChanged,
     isSupportFormula,
-    onExpandEditorToggle
+    onExpandEditorToggle,
+    updateFocus
   } = _ref;
   const [slateValue, setSlateValue] = (0, _react.useState)(value);
   const editor = (0, _react.useMemo)(() => {
     const baseEditor = (0, _extension.inlineEditor)();
-    if (isFocus) return (0, _withPropsEditor.default)(baseEditor, {
+    return (0, _withPropsEditor.default)(baseEditor, {
       editorApi,
       onSave,
       columns
     });
-    return baseEditor;
-  }, [columns, editorApi, onSave, isFocus]);
+  }, [columns, editorApi, onSave]);
   const eventProxy = (0, _react.useMemo)(() => {
     return new _eventHandler.default(editor);
   }, [editor]);
@@ -53,9 +54,25 @@ const InlineEditor = _ref => {
     const eventBus = _eventBus.default.getInstance();
     eventBus.dispatch('change');
   }, [editor, onContentChanged]);
-  const focusFirstNode = (0, _react.useCallback)(editor => {
+  const focusNode = (0, _react.useCallback)((editor, focusNodePath) => {
     const [firstNode] = editor.children;
     if (!firstNode) return;
+    if (focusNodePath && Array.isArray(focusNodePath)) {
+      const customFocusNodePath = (0, _core.getNode)(editor, focusNodePath);
+      if (customFocusNodePath) {
+        const startOfFirstNode = _slate.Editor.start(editor, focusNodePath);
+        const range = {
+          anchor: startOfFirstNode,
+          focus: startOfFirstNode
+        };
+        (0, _core.focusEditor)(editor, range);
+        return;
+      }
+    }
+    if (focusNodePath && typeof focusNodePath === 'object' && focusNodePath.anchor) {
+      (0, _core.focusEditor)(editor, focusNodePath);
+      return;
+    }
     const [firstNodeFirstChild] = firstNode.children;
     if (firstNodeFirstChild) {
       const startOfFirstNode = _slate.Editor.start(editor, [0, 0]);
@@ -67,22 +84,6 @@ const InlineEditor = _ref => {
     }
   }, []);
 
-  // const focusEndNode = useCallback((editor) => {
-  //   const lastChildIndex = editor.children.length - 1;
-  //   if (lastChildIndex < 0) return;
-  //   const lastNode = editor.children[lastChildIndex];
-  //   if (!lastNode) return;
-  //   const [lastNodeFirstChild] = lastNode.children;
-  //   if (lastNodeFirstChild) {
-  //     const endOfFirstNode = Editor.end(editor, [lastChildIndex, 0]);
-  //     const range = {
-  //       anchor: endOfFirstNode,
-  //       focus: endOfFirstNode,
-  //     };
-  //     focusEditor(editor, range);
-  //   }
-  // }, []);
-
   // useMount: focus editor
   (0, _react.useEffect)(() => {
     editor.forceNormalize = true;
@@ -91,7 +92,9 @@ const InlineEditor = _ref => {
     });
     const timer = setTimeout(() => {
       editor.forceNormalize = false;
-      focusFirstNode(editor);
+      if (isShowEditor) {
+        focusNode(editor, focusNodePath);
+      }
     }, 300);
     return () => {
       editor.forceNormalize = false;
@@ -99,6 +102,14 @@ const InlineEditor = _ref => {
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  (0, _react.useEffect)(() => {
+    if (focusNodePath) {
+      console.log(focusNodePath);
+      focusNode(editor, focusNodePath);
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [focusNodePath]);
 
   // willUnmount
   (0, _react.useEffect)(() => {
@@ -114,12 +125,15 @@ const InlineEditor = _ref => {
   const onEditorClick = (0, _react.useCallback)(() => {
     const value = editor.children;
     if (value.length === 1 && _slate.Node.string(value[0]).length === 0) {
-      focusFirstNode(editor);
+      focusNode(editor);
+    }
+    if (!isShowEditor) {
+      updateFocus(editor.selection);
     }
-  }, [editor, focusFirstNode]);
+  }, [isShowEditor, editor, focusNode, updateFocus]);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-simple-slate-editor-container"
-  }, isFocus && /*#__PURE__*/_react.default.createElement(_extension.InlineToolbar, {
+  }, isShowEditor && /*#__PURE__*/_react.default.createElement(_extension.InlineToolbar, {
     editor: editor,
     isSupportFormula: isSupportFormula,
     isSupportColumn: !!columns,

package/dist/editors/simple-slate-editor/index.js

@@ -24,7 +24,8 @@ const SimpleSlateEditor = _ref => {
     onSave,
     columns,
     onContentChanged,
-    isSupportFormula
+    isSupportFormula,
+    onExpandEditorToggle
   } = _ref;
   const [slateValue, setSlateValue] = (0, _react.useState)(value);
   const editor = (0, _react.useMemo)(() => (0, _withPropsEditor.default)(_extension.baseEditor, {
@@ -47,7 +48,7 @@ const SimpleSlateEditor = _ref => {
     const eventBus = _eventBus.default.getInstance();
     eventBus.dispatch('change');
   }, [editor, onContentChanged]);
-  const focusFirstNode = (0, _react.useCallback)(editor => {
+  const focusNode = (0, _react.useCallback)(editor => {
     const [firstNode] = editor.children;
     if (!firstNode) return;
     const [firstNodeFirstChild] = firstNode.children;
@@ -85,7 +86,7 @@ const SimpleSlateEditor = _ref => {
     });
     const timer = setTimeout(() => {
       editor.forceNormalize = false;
-      focusFirstNode(editor);
+      focusNode(editor);
     }, 300);
     return () => {
       editor.forceNormalize = false;
@@ -108,9 +109,9 @@ const SimpleSlateEditor = _ref => {
   const onEditorClick = (0, _react.useCallback)(() => {
     const value = editor.children;
     if (value.length === 1 && _slate.Node.string(value[0]).length === 0) {
-      focusFirstNode(editor);
+      focusNode(editor);
     }
-  }, [editor, focusFirstNode]);
+  }, [editor, focusNode]);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-simple-slate-editor-container"
   }, /*#__PURE__*/_react.default.createElement(_extension.Toolbar, {

package/dist/extension/plugins/link/render-elem/index.js

@@ -28,6 +28,9 @@ const renderLink = (_ref, editor) => {
     left: 0
   });
   const isReadonly = (0, _slateReact.useReadOnly)();
+
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  const isLinkActive = (0, _react.useMemo)(() => (0, _helper.isLinkType)(editor), [editor.selection]);
   const onClosePopover = (0, _react.useCallback)(e => {
     unregisterClickEvent();
     setIsShowPopover(false);
@@ -77,7 +80,7 @@ const renderLink = (_ref, editor) => {
   }, attributes), /*#__PURE__*/_react.default.createElement("a", {
     href: element.url,
     onClick: onHrefClick
-  }, children)), isShowPopover && /*#__PURE__*/_react.default.createElement(_linkPopover.default, {
+  }, children)), isLinkActive && isShowPopover && /*#__PURE__*/_react.default.createElement(_linkPopover.default, {
     popoverPosition: popoverPosition,
     linkUrl: element.url,
     editor: editor,

package/dist/extension/plugins/link/render-elem/link-popover.js

@@ -14,7 +14,6 @@ var _helper = require("../helper");
 var _common = require("../../../../utils/common");
 var _eventTypes = require("../../../../constants/event-types");
 var _constants = require("../../../../constants");
-require("./style.css");
 const LinkPopover = _ref => {
   let {
     linkUrl,

package/dist/extension/plugins/link/render-elem/style.css

@@ -59,4 +59,4 @@
 
 .sf-link-op-icon:hover {
   background: #f2f2f2;
-}
+}

package/dist/extension/plugins/table/plugin.js

@@ -286,7 +286,20 @@ const withTable = editor => {
     // selected only one cell
     const tableCell = (0, _core.getSelectedNodeByType)(newEditor, _elementTypes.TABLE_CELL);
     if (tableCell) {
-      (0, _setEventTransfer.default)(event, 'fragment', tableCell.children);
+      const selection = window.getSelection();
+      const range = selection.getRangeAt(0);
+      const selectedContent = range.cloneContents();
+      const div = document.createElement('div');
+      // Unwrap image wrapper
+      selectedContent.childNodes.forEach(node => {
+        if (node.classList && node.classList.contains('sf-image-wrapper')) {
+          const img = node.querySelector('img');
+          div.appendChild(img.cloneNode(true));
+          return;
+        }
+        div.appendChild(node.cloneNode(true));
+      });
+      (0, _setEventTransfer.default)(event, 'html', div.innerHTML.toString());
       return true;
     }
     return false;

package/dist/pages/longtext-inline-editor/fallback-editor.js

@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _isHotkey = _interopRequireDefault(require("is-hotkey"));
-var _markdownPreview = _interopRequireDefault(require("../markdown-preview"));
 const FallbackEditor = _ref => {
   let {
     isShowEditor,
@@ -56,18 +55,6 @@ const FallbackEditor = _ref => {
   const onCut = (0, _react.useCallback)(e => {
     e.stopPropagation();
   }, []);
-  if (!isShowEditor) {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-long-text-inline-fallback-editor-container"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-simple-slate-editor-container"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-slate-editor-content"
-    }, /*#__PURE__*/_react.default.createElement(_markdownPreview.default, {
-      value: value,
-      isShowOutline: false
-    }))));
-  }
   return /*#__PURE__*/_react.default.createElement("textarea", {
     className: "form-control sf-long-text-inline-fallback-editor-container",
     ref: inputRef,

package/dist/pages/longtext-inline-editor/formatter/index.css

@@ -0,0 +1,68 @@
+.sf-long-text-inline-editor-container.preview .longtext-preview-container {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  border-radius: 3px;
+  cursor: pointer;
+  padding: 16px 12px;
+  background-color: #FFF;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container .sf-slate-viewer-scroll-container {
+  overflow-y: auto;
+  height: fit-content;
+  padding: 0;
+  background: #fff;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container .sf-slate-viewer-article-container {
+  height: 100%;
+  width: 100%;
+  margin: 0;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container .sf-slate-viewer-article-container .article {
+  padding: 0;
+  height: auto;
+  min-height: 100% !important;
+  border: 0;
+  color: #212529;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ol,
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ul {
+  padding-inline-start: 40px;
+  margin-bottom: 1em;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ol li a,
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ul li a {
+  word-break: break-all;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ul.contains-task-list,
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ol.contains-task-list {
+  padding-inline-start: 20px;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ul li.task-list-item,
+.sf-long-text-inline-editor-container.preview .longtext-preview-container ol li.task-list-item {
+  min-height: 20px;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container li.task-list-item input[type=checkbox] {
+  position: absolute;
+  left: -1.4em;
+  top: .4em;
+  display: inline-block;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container thead tr {
+  min-height: 42px;
+}
+
+.sf-long-text-inline-editor-container.preview .longtext-preview-container tbody tr {
+  font-weight: normal;
+  min-height: 42px;
+}
+

package/dist/pages/longtext-inline-editor/formatter/index.js

@@ -0,0 +1,66 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _loading = _interopRequireDefault(require("../../../containers/loading"));
+var _slateConvert = require("../../../slate-convert");
+var _slateViewer = _interopRequireDefault(require("../../../editors/slate-viewer"));
+require("./index.css");
+// Windows old Wechat (3.0 or earlier) inner core is chrome 53 and don't support ECMA6, can't use seafile-editor markdownViewer
+// Windows new Wechat (lastest version 3.3.5) support seafile-editor markdownViewer
+// so use dangerouslySetInnerHTML to preview
+class Formatter extends _react.default.PureComponent {
+  constructor(props) {
+    super(props);
+    (0, _defineProperty2.default)(this, "convertMarkdown", mdFile => {
+      _slateConvert.processor.process(mdFile).then(result => {
+        let innerHtml = String(result).replace(/<a /ig, '<a target="_blank" tabindex="-1"');
+        this.setState({
+          innerHtml
+        });
+      });
+    });
+    this.state = {
+      innerHtml: null
+    };
+  }
+  componentDidMount() {
+    const {
+      isWindowsWechat,
+      value
+    } = this.props;
+    if (isWindowsWechat) {
+      this.convertMarkdown(value);
+    }
+  }
+  render() {
+    const {
+      isWindowsWechat,
+      value,
+      isShowOutline
+    } = this.props;
+    const {
+      innerHtml
+    } = this.state;
+    if (isWindowsWechat && innerHtml === null) {
+      return /*#__PURE__*/_react.default.createElement(_loading.default, null);
+    }
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "longtext-preview-container"
+    }, isWindowsWechat && /*#__PURE__*/_react.default.createElement("div", {
+      className: "article",
+      dangerouslySetInnerHTML: {
+        __html: this.state.innerHtml
+      }
+    }), !isWindowsWechat && /*#__PURE__*/_react.default.createElement(_slateViewer.default, {
+      value: value,
+      isShowOutline: isShowOutline
+    }));
+  }
+}
+var _default = exports.default = Formatter;

package/dist/pages/longtext-inline-editor/index.css

@@ -1,6 +1,7 @@
 .sf-long-text-inline-editor-container {
   width: 100%;
   height: 100%;
+  min-height: 38px;
   border: 1px solid rgba(0, 40, 100, .12);
   border-radius: 3px;
   transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
@@ -37,16 +38,6 @@
   padding: 16px !important;
 }
 
-/* preview */
-.sf-long-text-inline-editor-container .longtext-preview-container {
-  padding: 10px;
-  background-color: #fff;
-}
-
-.sf-long-text-inline-editor-container .sf-slate-editor-content .article > div[role="textbox"] > :first-child {
-  margin-top: 0 !important;
-}
-
 .sf-long-text-inline-editor-container .sf-slate-editor-toolbar .sf-menu-group,
 .sf-editor-menu-popover .popover-inner .sf-menu-group  {
 	padding: 4px 0 4px 8px !important;
@@ -70,8 +61,6 @@
   display: flex;
 }
 
-/* weixin editor  */
-.sf-long-text-inline-fallback-editor-container {
-  width: 100%;
-  resize: none;
+.sf-long-text-inline-editor-container:not(.preview) .article>div[role=textbox]>:first-child {
+  margin-top: 0;
 }

package/dist/pages/longtext-inline-editor/index.js

@@ -9,9 +9,12 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _isHotkey = _interopRequireDefault(require("is-hotkey"));
 var _clickOutside = _interopRequireDefault(require("./click-outside"));
-var _normalEditor = _interopRequireDefault(require("./normal-editor"));
+var _formatter = _interopRequireDefault(require("./formatter"));
 var _fallbackEditor = _interopRequireDefault(require("./fallback-editor"));
+var _normalEditor = _interopRequireDefault(require("./normal-editor"));
+var _slateConvert = require("../../slate-convert");
 var _getBrowserInfo = _interopRequireDefault(require("../../utils/get-browser-Info"));
+var _extension = require("../../extension");
 require("./index.css");
 const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
@@ -25,25 +28,42 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
     onSaveEditorValue,
     editorApi
   } = _ref;
-  const [isFocusEditor, setFocusEditor] = (0, _react.useState)(false);
+  const [isShowEditor, setShowEditor] = (0, _react.useState)(false);
   const valueRef = (0, _react.useRef)(typeof value === 'string' ? {
     text: value
   } : value);
   const longTextValueChangedRef = (0, _react.useRef)(false);
+  const [focusNodePath, setFocusNodePath] = (0, _react.useState)(null);
   const {
     isWindowsWechat
   } = (0, _react.useMemo)(() => {
     return (0, _getBrowserInfo.default)(isCheckBrowser);
   }, [isCheckBrowser]);
-  const openEditor = (0, _react.useCallback)(() => {
-    setFocusEditor(true);
+  const openEditor = (0, _react.useCallback)(function () {
+    let focusNodePath = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [0, 0];
+    setFocusNodePath(focusNodePath);
+    setShowEditor(true);
   }, []);
   const closeEditor = (0, _react.useCallback)(() => {
     if (longTextValueChangedRef.current) {
       onSaveEditorValue(valueRef.current);
     }
-    setFocusEditor(false);
+    setShowEditor(false);
   }, [longTextValueChangedRef, valueRef, onSaveEditorValue]);
+  const getAttributeNode = (0, _react.useCallback)(function (node, attribute) {
+    let deep = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 4;
+    if (!node || !node.getAttribute) return null;
+    if (deep === -1) return null;
+    if (node.getAttribute(attribute)) return node.getAttribute(attribute);
+    if (node.parentNode) return getAttributeNode(node.parentNode, attribute, deep--);
+  }, []);
+  const previewClick = (0, _react.useCallback)((event, richValue) => {
+    if (event.target.nodeName === 'A') return;
+    // const nodeId = getAttributeNode(event.target, 'data-id');
+    onPreviewClick && onPreviewClick();
+
+    // openEditor(getNodePathById({ children: richValue }, nodeId));
+  }, [onPreviewClick, openEditor, getAttributeNode]);
   const onEditorValueChanged = (0, _react.useCallback)(value => {
     valueRef.current = value;
     longTextValueChangedRef.current = true;
@@ -64,27 +84,36 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
       closeEditor: closeEditor
     };
   }, [openEditor, closeEditor]);
-  const onClick = (0, _react.useCallback)(() => {
-    if (isFocusEditor) return;
-    onPreviewClick && onPreviewClick();
-    setFocusEditor(true);
-  }, [isFocusEditor, onPreviewClick]);
+  const updateFocus = (0, _react.useCallback)(focusRange => {
+    console.log(focusRange);
+    openEditor(focusRange);
+  }, [openEditor]);
+
+  // if (!isShowEditor) {
+  //   const richValue = mdStringToSlate(valueRef.current.text);
+  //   return (
+  //     <div className="sf-long-text-inline-editor-container preview" onClick={(event) => previewClick(event, richValue)} >
+  //       {valueRef.current.text && (<Formatter value={isWindowsWechat ? valueRef.current : richValue} />)}
+  //     </div>
+  //   );
+  // }
+
   return /*#__PURE__*/_react.default.createElement(_clickOutside.default, {
     onClickOutside: closeEditor
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "w-100",
-    onKeyDown: onHotKey,
-    onClick: onClick
+    onKeyDown: onHotKey
   }, isWindowsWechat ? /*#__PURE__*/_react.default.createElement(_fallbackEditor.default, {
-    isShowEditor: isFocusEditor,
+    isShowEditor: isShowEditor,
     value: valueRef.current.text,
     onChange: onEditorValueChanged,
     closeEditor: closeEditor
   }) : /*#__PURE__*/_react.default.createElement(_normalEditor.default, {
-    isFocus: isFocusEditor,
+    isShowEditor: isShowEditor,
+    updateFocus: updateFocus,
     lang: lang,
-    isWindowsWechat: isWindowsWechat,
     headerName: headerName,
+    focusNodePath: focusNodePath,
     value: valueRef.current.text,
     autoSave: autoSave,
     saveDelay: saveDelay,

package/dist/pages/longtext-inline-editor/normal-editor.js

@@ -7,14 +7,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
 var _simpleEditor = _interopRequireDefault(require("../simple-editor"));
 var _getPreviewContent = _interopRequireDefault(require("../../utils/get-preview-content"));
 var _markdownPreview = _interopRequireDefault(require("../markdown-preview"));
 var _longtextEditorDialog = _interopRequireDefault(require("../longtext-editor-dialog"));
 const NormalEditor = _ref => {
   let {
-    isFocus,
+    isShowEditor,
+    updateFocus,
+    focusNodePath,
     lang,
     headerName,
     value: propsValue,
@@ -28,24 +29,23 @@ const NormalEditor = _ref => {
   const editorContainerRef = (0, _react.useRef)(null);
   const editorRef = (0, _react.useRef)(null);
   const [style, setStyle] = (0, _react.useState)({});
-  const [isValueChanged, setValueChanged] = (0, _react.useState)(false);
   const [showExpandEditor, setShowExpandEditor] = (0, _react.useState)(false);
-  const [value, setValue] = (0, _react.useState)(typeof propsValue === 'string' ? {
+  const valueRef = (0, _react.useRef)(typeof propsValue === 'string' ? {
     text: propsValue
   } : propsValue);
+  const valueChangedRef = (0, _react.useRef)(false);
   const saveValue = (0, _react.useCallback)(function (value) {
     let save = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-    setValueChanged(true);
-    setValue(value);
+    valueChangedRef.current = true;
     onEditorValueChanged && onEditorValueChanged(value);
     if (!save) return;
     onSaveEditorValue && onSaveEditorValue(value);
-    setValueChanged(false);
+    valueChangedRef.current = false;
   }, [onSaveEditorValue, onEditorValueChanged]);
   const handelAutoSave = (0, _react.useCallback)(() => {
-    if (!isValueChanged) return;
-    saveValue(value, true);
-  }, [isValueChanged, value, saveValue]);
+    if (!valueChangedRef.current) return;
+    saveValue(valueRef.current, true);
+  }, [saveValue]);
   const onContentChanged = (0, _react.useCallback)(() => {
     // delay to update editor's content
     setTimeout(() => {
@@ -59,14 +59,14 @@ const NormalEditor = _ref => {
         links,
         checklist
       } = (0, _getPreviewContent.default)(slateNodes, false);
-      const value = {
+      valueRef.current = {
         text: markdownString,
         preview: previewText,
         images: images,
         links: links,
         checklist
       };
-      saveValue(value);
+      saveValue(valueRef.current);
     }, 0);
   }, [saveValue]);
   const openEditorDialog = (0, _react.useCallback)(() => {
@@ -79,7 +79,10 @@ const NormalEditor = _ref => {
     setShowExpandEditor(true);
   }, [editorContainerRef]);
   const onCloseEditorDialog = (0, _react.useCallback)(value => {
-    value && saveValue(value);
+    if (value) {
+      valueRef.current = value;
+      saveValue(value);
+    }
     setStyle({});
     setShowExpandEditor(false);
   }, [saveValue]);
@@ -95,16 +98,16 @@ const NormalEditor = _ref => {
     };
   }, [autoSave, saveDelay, handelAutoSave]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('sf-long-text-inline-editor-container', {
-      'preview': !isFocus
-    }),
+    className: "sf-long-text-inline-editor-container",
     style: style,
     ref: editorContainerRef
   }, !showExpandEditor ? /*#__PURE__*/_react.default.createElement(_simpleEditor.default, {
     ref: editorRef,
-    isFocus: isFocus,
+    isShowEditor: isShowEditor,
+    updateFocus: updateFocus,
     isInline: true,
-    value: value.text,
+    focusNodePath: focusNodePath,
+    value: valueRef.current.text,
     onSave: handelAutoSave,
     editorApi: editorApi,
     onContentChanged: onContentChanged,
@@ -116,13 +119,13 @@ const NormalEditor = _ref => {
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-slate-editor-content"
   }, /*#__PURE__*/_react.default.createElement(_markdownPreview.default, {
-    value: value.text,
+    value: valueRef.current.text,
     isShowOutline: false
   })))), showExpandEditor && /*#__PURE__*/_react.default.createElement(_longtextEditorDialog.default, {
     lang: lang,
     readOnly: false,
     headerName: headerName,
-    value: value.text,
+    value: valueRef.current.text,
     autoSave: autoSave,
     saveDelay: saveDelay,
     isCheckBrowser: isCheckBrowser,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/seafile-editor",
-  "version": "1.0.85beta9",
+  "version": "1.0.86beta",
   "description": "",
   "main": "dist/index.js",
   "scripts": {