@seafile/seafile-editor 2.0.30 → 2.0.31-beta

package/dist/constants/event-types.js

@@ -20,6 +20,6 @@ const EXTERNAL_EVENTS = exports.EXTERNAL_EVENTS = {
   ON_ARTICLE_INFO_TOGGLE: 'on_article_info_toggle',
   ON_LINK_CLICK: 'on_link_click',
   ON_INSERT_IMAGE: 'on_insert_image',
-  INSERT_IMAGE: 'insert_image',
+  INSERT_ATTACHMENTS: 'insert_attachments',
   CLEAR_ARTICLE: 'clear_article'
 };

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

@@ -18,10 +18,10 @@ var _core = require("../../extension/core");
 var _common = require("../../utils/common");
 var _eventTypes = require("../../constants/event-types");
 var _elementTypes = require("../../extension/constants/element-types");
-var _useInsertImage = _interopRequireDefault(require("../../hooks/use-insert-image"));
+var _useAttachments = _interopRequireDefault(require("../../hooks/use-attachments"));
 require("./index.css");
 const isMacOS = (0, _common.isMac)();
-const InlineEditor = _ref => {
+const InlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     enableEdit,
     value,
@@ -50,7 +50,7 @@ const InlineEditor = _ref => {
   const eventProxy = (0, _react.useMemo)(() => {
     return new _eventHandler.default(editor);
   }, [editor]);
-  (0, _useInsertImage.default)(editor);
+  (0, _useAttachments.default)(editor);
   const decorate = (0, _extension.useHighlight)(editor);
   const onChange = (0, _react.useCallback)(value => {
     setSlateValue(value);
@@ -129,7 +129,8 @@ const InlineEditor = _ref => {
     };
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  const handleClear = (0, _react.useCallback)(() => {
+  const handleClear = (0, _react.useCallback)(editorId => {
+    if (editorId !== editor._id) return;
     editor.children = [{
       type: _elementTypes.PARAGRAPH,
       id: _slugid.default.nice(),
@@ -158,8 +159,12 @@ const InlineEditor = _ref => {
     return () => {
       clearSubscribe();
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, [handleClear]);
+  (0, _react.useImperativeHandle)(ref, () => {
+    return {
+      getEditor: () => editor
+    };
+  }, [editor]);
   const onEditorClick = (0, _react.useCallback)(() => {
     if (!enableEdit) {
       focusRangeRef.current = editor.selection;
@@ -201,5 +206,5 @@ const InlineEditor = _ref => {
     onKeyDown: eventProxy.onKeyDown,
     onCopy: eventProxy.onCopy
   })))))));
-};
+});
 var _default = exports.default = InlineEditor;

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

@@ -16,7 +16,7 @@ var _withPropsEditor = _interopRequireDefault(require("./with-props-editor"));
 var _editorHelp = _interopRequireDefault(require("./editor-help"));
 var _core = require("../../extension/core");
 var _useScrollContext = require("../../hooks/use-scroll-context");
-var _useInsertImage = _interopRequireDefault(require("../../hooks/use-insert-image"));
+var _useAttachments = _interopRequireDefault(require("../../hooks/use-attachments"));
 var _common = require("../../utils/common");
 var _outline = _interopRequireDefault(require("../../containers/outline"));
 var _useContainerStyle = _interopRequireDefault(require("../../hooks/use-container-style"));
@@ -28,6 +28,7 @@ function SlateEditor(_ref) {
     editorApi,
     onSave,
     onContentChanged,
+    isReadonly,
     isSupportFormula,
     isSupportInsertSeafileImage,
     children
@@ -44,7 +45,7 @@ function SlateEditor(_ref) {
   const eventProxy = (0, _react.useMemo)(() => {
     return new _eventHandler.default(editor);
   }, [editor]);
-  (0, _useInsertImage.default)(editor);
+  (0, _useAttachments.default)(editor);
   const decorate = (0, _extension.useHighlight)(editor);
   const onChange = (0, _react.useCallback)(value => {
     setSlateValue(value);
@@ -111,6 +112,7 @@ function SlateEditor(_ref) {
     className: `sf-slate-editor-container ${_common.isMobile && 'mobile'}`
   }, /*#__PURE__*/_react.default.createElement(_extension.Toolbar, {
     editor: editor,
+    readonly: isReadonly,
     isRichEditor: true,
     isSupportFormula: isSupportFormula,
     isSupportInsertSeafileImage: isSupportInsertSeafileImage
@@ -138,6 +140,7 @@ function SlateEditor(_ref) {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "article"
   }, /*#__PURE__*/_react.default.createElement(_extension.SetNodeToDecorations, null), /*#__PURE__*/_react.default.createElement(_slateReact.Editable, {
+    readOnly: isReadonly,
     decorate: decorate,
     renderElement: _extension.renderElement,
     renderLeaf: _extension.renderLeaf,

package/dist/extension/editor.js

@@ -8,13 +8,14 @@ exports.inlineEditor = exports.createSlateEditor = exports.baseEditor = void 0;
 var _slate = require("slate");
 var _slateHistory = require("slate-history");
 var _slateReact = require("slate-react");
-var _plugins = _interopRequireDefault(require("./plugins"));
 var _slugid = require("slugid");
+var _plugins = _interopRequireDefault(require("./plugins"));
 const baseEditor = exports.baseEditor = _plugins.default.reduce((editor, pluginItem) => {
   const withPlugin = pluginItem.editorPlugin;
   if (withPlugin) {
     return withPlugin(editor);
   }
+  editor._id = (0, _slugid.nice)();
   return editor;
 }, (0, _slateHistory.withHistory)((0, _slateReact.withReact)((0, _slate.createEditor)())));
 const inlineEditor = () => {
@@ -25,6 +26,7 @@ const inlineEditor = () => {
     }
     return editor;
   }, (0, _slateHistory.withHistory)((0, _slateReact.withReact)((0, _slate.createEditor)())));
+  editor._id = (0, _slugid.nice)();
   return editor;
 };
 exports.inlineEditor = inlineEditor;

package/dist/hooks/{use-insert-image.js → use-attachments.js}

@@ -10,15 +10,16 @@ var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
 var _eventTypes = require("../constants/event-types");
 var _helper = require("../extension/plugins/image/helper");
 var _helper2 = require("../extension/plugins/link/helper");
-const useSeafileUtils = editor => {
+const useAttachments = editor => {
   (0, _react.useEffect)(() => {
-    const insertImage = _ref => {
+    const insertImage = (editorId, _ref) => {
       let {
         title,
         url,
         isImage,
         selection = editor.selection
       } = _ref;
+      if (editorId !== editor._id) return;
       if (isImage) {
         (0, _helper.insertSeafileImage)({
           editor,
@@ -36,8 +37,8 @@ const useSeafileUtils = editor => {
       }
     };
     const eventBus = _eventBus.default.getInstance();
-    const subscribe = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.INSERT_IMAGE, insertImage);
+    const subscribe = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.INSERT_ATTACHMENTS, insertImage);
     return subscribe;
   }, [editor]);
 };
-var _default = exports.default = useSeafileUtils;
+var _default = exports.default = useAttachments;

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

@@ -8,9 +8,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _isHotkey = _interopRequireDefault(require("is-hotkey"));
+var _slugid = require("slugid");
 var _eventBus = _interopRequireDefault(require("../../utils/event-bus"));
 var _eventTypes = require("../../constants/event-types");
-const FallbackEditor = _ref => {
+const FallbackEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     enableEdit,
     value: propsValue,
@@ -20,16 +21,20 @@ const FallbackEditor = _ref => {
   const [value, setValue] = (0, _react.useState)(propsValue);
   const showEditorRef = (0, _react.useRef)(false);
   const inputRef = (0, _react.useRef)(null);
+  const editor = (0, _react.useMemo)(() => ({
+    _id: (0, _slugid.nice)(4)
+  }), []);
   (0, _react.useEffect)(() => {
     if (enableEdit === showEditorRef.current) return;
     if (enableEdit && !showEditorRef.current) {
       setTimeout(() => inputRef.current.focus());
     }
   }, [enableEdit]);
-  const handleClear = (0, _react.useCallback)(() => {
+  const handleClear = (0, _react.useCallback)(editorId => {
+    if (editorId !== editor._id) return;
     setValue('');
     inputRef.current.focus();
-  }, []);
+  }, [editor]);
   (0, _react.useEffect)(() => {
     const eventBus = _eventBus.default.getInstance();
     const clearSubscribe = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.CLEAR_ARTICLE, handleClear);
@@ -71,6 +76,11 @@ const FallbackEditor = _ref => {
       images: []
     });
   }, [value, propsOnChange]);
+  (0, _react.useImperativeHandle)(ref, () => {
+    return {
+      getEditor: () => editor
+    };
+  }, [editor]);
   return /*#__PURE__*/_react.default.createElement("textarea", {
     className: "form-control sf-long-text-inline-fallback-editor-container",
     ref: inputRef,
@@ -81,5 +91,5 @@ const FallbackEditor = _ref => {
     onPaste: onPaste,
     onCut: onCut
   });
-};
+});
 var _default = exports.default = FallbackEditor;

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

@@ -34,6 +34,7 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
     text: value
   } : value);
   const longTextValueChangedRef = (0, _react.useRef)(false);
+  const editorRef = (0, _react.useRef)(null);
   const {
     isWindowsWechat
   } = (0, _react.useMemo)(() => {
@@ -70,12 +71,14 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
     }
   }, [enableEdit, closeEditor]);
   (0, _react.useImperativeHandle)(ref, () => {
+    var _editorRef$current;
     return {
       enableEdit: enableEdit,
       openEditor: openEditor,
-      closeEditor: closeEditor
+      closeEditor: closeEditor,
+      getEditor: ((_editorRef$current = editorRef.current) === null || _editorRef$current === void 0 ? void 0 : _editorRef$current.getEditor) || (() => null)
     };
-  }, [enableEdit, openEditor, closeEditor]);
+  }, [enableEdit, openEditor, closeEditor, editorRef]);
   const handelEnableEdit = (0, _react.useCallback)(() => {
     onClick && onClick();
     openEditor();
@@ -86,11 +89,13 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
     className: "w-100",
     onKeyDown: onHotKey
   }, isWindowsWechat ? /*#__PURE__*/_react.default.createElement(_fallbackEditor.default, {
+    ref: editorRef,
     enableEdit: enableEdit,
     value: valueRef.current.text,
     onChange: onEditorValueChanged,
     closeEditor: closeEditor
   }) : /*#__PURE__*/_react.default.createElement(_normalEditor.default, {
+    ref: editorRef,
     enableEdit: enableEdit,
     handelEnableEdit: handelEnableEdit,
     lang: lang,

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

@@ -13,7 +13,7 @@ var _getPreviewContent = _interopRequireDefault(require("../../utils/get-preview
 var _markdownPreview = _interopRequireDefault(require("../markdown-preview"));
 var _longtextEditorDialog = _interopRequireDefault(require("../longtext-editor-dialog"));
 var _slateConvert = require("../../slate-convert");
-const NormalEditor = _ref => {
+const NormalEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     enableEdit,
     handelEnableEdit,
@@ -93,6 +93,15 @@ const NormalEditor = _ref => {
       timer && clearTimeout(timer);
     };
   }, [autoSave, saveDelay, handelAutoSave]);
+  (0, _react.useImperativeHandle)(ref, () => {
+    return {
+      getEditor: () => {
+        var _editorRef$current, _editorRef$current2;
+        const editor = ((_editorRef$current = editorRef.current) === null || _editorRef$current === void 0 ? void 0 : _editorRef$current.getEditor) && ((_editorRef$current2 = editorRef.current) === null || _editorRef$current2 === void 0 ? void 0 : _editorRef$current2.getEditor());
+        return editor || null;
+      }
+    };
+  }, [editorRef]);
   if (!enableEdit && !valueRef.current.text) {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)('sf-long-text-inline-editor-container', {
@@ -144,5 +153,5 @@ const NormalEditor = _ref => {
     onEditorValueChanged: saveValue,
     onCloseEditorDialog: onCloseEditorDialog
   }));
-};
+});
 var _default = exports.default = NormalEditor;

package/dist/pages/markdown-editor.js

@@ -14,6 +14,7 @@ var _slateEditor = _interopRequireDefault(require("../editors/slate-editor"));
 var _core = require("../extension/core");
 const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
+    isReadonly = false,
     isFetching,
     value,
     initValue,
@@ -53,6 +54,7 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     propsOnContentChanged && propsOnContentChanged();
   }, [propsOnContentChanged]);
   const props = {
+    isReadonly: isReadonly,
     isSupportFormula: !!mathJaxSource,
     isSupportInsertSeafileImage,
     value: richValue,

package/dist/pages/simple-editor.js

@@ -29,7 +29,9 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   const {
     isLoadingMathJax
   } = (0, _useMathjax.default)(mathJaxSource);
+  const editorRef = (0, _react.useRef)();
   (0, _react.useImperativeHandle)(ref, () => {
+    var _editorRef$current;
     return {
       getValue: () => {
         const mdStringValue = (0, _slateConvert.slateToMdString)(richValue);
@@ -37,9 +39,10 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       },
       getSlateValue: () => {
         return richValue;
-      }
+      },
+      getEditor: ((_editorRef$current = editorRef.current) === null || _editorRef$current === void 0 ? void 0 : _editorRef$current.getEditor) || (() => null)
     };
-  }, [richValue]);
+  }, [richValue, editorRef]);
   (0, _react.useEffect)(() => {
     if (!isFetching) {
       const richValue = (0, _slateConvert.mdStringToSlate)(value);
@@ -65,8 +68,12 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     return /*#__PURE__*/_react.default.createElement(_loading.default, null);
   }
   if (isInline) {
-    return /*#__PURE__*/_react.default.createElement(_inlineEditor.default, props);
+    return /*#__PURE__*/_react.default.createElement(_inlineEditor.default, Object.assign({}, props, {
+      ref: editorRef
+    }));
   }
-  return /*#__PURE__*/_react.default.createElement(_simpleSlateEditor.default, props);
+  return /*#__PURE__*/_react.default.createElement(_simpleSlateEditor.default, Object.assign({}, props, {
+    ref: editorRef
+  }));
 });
 var _default = exports.default = SimpleEditor;

package/package.json

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