@seafile/seafile-editor 1.0.67 → 1.0.68

package/dist/index.js

@@ -46,18 +46,6 @@ Object.defineProperty(exports, "MarkdownViewer", {
     return _markdownView.default;
   }
 });
-Object.defineProperty(exports, "PlainMarkdownEditor", {
-  enumerable: true,
-  get: function () {
-    return _plainMarkdownEditor.default;
-  }
-});
-Object.defineProperty(exports, "RichMarkdownEditor", {
-  enumerable: true,
-  get: function () {
-    return _richMarkdownEditor.default;
-  }
-});
 Object.defineProperty(exports, "SeaTableEditor", {
   enumerable: true,
   get: function () {
@@ -113,8 +101,6 @@ Object.defineProperty(exports, "slateToMdString", {
   }
 });
 var _eventTypes = require("./constants/event-types");
-var _plainMarkdownEditor = _interopRequireDefault(require("./editors/plain-markdown-editor"));
-var _richMarkdownEditor = _interopRequireDefault(require("./pages/rich-markdown-editor"));
 var _markdownEditor = _interopRequireDefault(require("./pages/markdown-editor"));
 var _markdownView = _interopRequireDefault(require("./pages/markdown-view"));
 var _simpleEditor = _interopRequireDefault(require("./pages/simple-editor"));

package/dist/pages/markdown-editor.js

@@ -11,12 +11,15 @@ var _loading = _interopRequireDefault(require("../containers/loading"));
 var _slateConvert = require("../slate-convert");
 var _useMathjax = _interopRequireDefault(require("../hooks/use-mathjax"));
 var _slateEditor = _interopRequireDefault(require("../editors/slate-editor"));
+var _core = require("../extension/core");
 const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     isFetching,
     value,
+    initValue,
     editorApi,
     mathJaxSource,
+    isSupportInsertSeafileImage,
     onSave: propsOnSave,
     onContentChanged: propsOnContentChanged,
     children
@@ -36,7 +39,10 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   }, [richValue]);
   (0, _react.useEffect)(() => {
     if (!isFetching) {
-      const richValue = (0, _slateConvert.mdStringToSlate)(value);
+      let richValue = (0, _slateConvert.mdStringToSlate)(value);
+      if (!value && initValue) {
+        richValue = [(0, _core.generateHeaderElement)(initValue)];
+      }
       setRichValue(richValue);
       setIsLoading(false);
     }
@@ -48,6 +54,7 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   }, [propsOnContentChanged]);
   const props = {
     isSupportFormula: !!mathJaxSource,
+    isSupportInsertSeafileImage,
     value: richValue,
     editorApi: editorApi,
     onSave: propsOnSave,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/seafile-editor",
-  "version": "1.0.67",
+  "version": "1.0.68",
   "description": "",
   "main": "dist/index.js",
   "scripts": {
@@ -85,12 +85,8 @@
     ]
   },
   "dependencies": {
-    "@codemirror/lang-markdown": "6.2.3",
-    "@codemirror/language-data": "6.3.1",
-    "@codemirror/view": "6.22.1",
     "@seafile/react-image-lightbox": "2.0.5",
     "classnames": "2.3.2",
-    "codemirror": "6.0.1",
     "deep-copy": "1.4.2",
     "deepmerge": "4.3.1",
     "is-url": "^1.2.4",

package/dist/editors/plain-markdown-editor/code-mirror.css

@@ -1,8 +0,0 @@
-.sf-code-mirror .cm-editor {
-  height: 100vh;
-  font-size: 13px;
-}
-
-.sf-code-mirror .cm-editor .cm-scroller {
-  overflow-x: initial;
-}

package/dist/editors/plain-markdown-editor/code-mirror.js

@@ -1,68 +0,0 @@
-"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 _classnames = _interopRequireDefault(require("classnames"));
-var _codemirror = require("codemirror");
-var _view = require("@codemirror/view");
-var _langMarkdown = require("@codemirror/lang-markdown");
-var _languageData = require("@codemirror/language-data");
-require("./code-mirror.css");
-class SeafileCodeMirror extends _react.default.Component {
-  constructor() {
-    super(...arguments);
-    (0, _defineProperty2.default)(this, "onValueChanged", viewUpdate => {
-      const {
-        onChange
-      } = this.props;
-      if (onChange && viewUpdate.docChanged) {
-        const doc = viewUpdate.state.doc;
-        const value = doc.toString();
-        onChange(value);
-      }
-    });
-    (0, _defineProperty2.default)(this, "focus", () => {
-      this.view.focus();
-    });
-    (0, _defineProperty2.default)(this, "scrollIntoView", pos => {
-      _view.EditorView.scrollIntoView(pos);
-    });
-    (0, _defineProperty2.default)(this, "setCodeMirrorRef", ref => {
-      this.codeMirrorRef = ref;
-    });
-  }
-  componentDidMount() {
-    const {
-      initialValue,
-      autoFocus
-    } = this.props;
-    this.view = new _view.EditorView({
-      doc: initialValue,
-      extensions: [_codemirror.basicSetup, (0, _langMarkdown.markdown)({
-        codeLanguages: _languageData.languages
-      }), _view.EditorView.updateListener.of(viewUpdate => {
-        this.onValueChanged(viewUpdate);
-      }), _view.EditorView.lineWrapping],
-      parent: this.codeMirrorRef
-    });
-    if (autoFocus) this.focus();
-  }
-  componentWillUnmount() {
-    if (this.view) {
-      this.view.destroy();
-    }
-  }
-  render() {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames.default)('sf-code-mirror', this.props.className)
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      ref: this.setCodeMirrorRef
-    }));
-  }
-}
-var _default = exports.default = SeafileCodeMirror;

package/dist/editors/plain-markdown-editor/index.js

@@ -1,140 +0,0 @@
-"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 _isHotkey = _interopRequireDefault(require("is-hotkey"));
-var _mdToHtml = _interopRequireDefault(require("../../slate-convert/md-to-html"));
-var _codeMirror = _interopRequireDefault(require("./code-mirror"));
-require("./style.css");
-class PlainMarkdownEditor extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    /*
-    *   the data about scroll, these variable has nothing to width react
-    *   they are not state
-    * */
-    (0, _defineProperty2.default)(this, "scrollData", {
-      scrollPercentage: 0,
-      leftPanel: null,
-      rightPanel: null
-    });
-    (0, _defineProperty2.default)(this, "setContent", markdownContent => {
-      this.setState({
-        editorValue: markdownContent
-      });
-      _mdToHtml.default.process(markdownContent, (error, vfile) => {
-        var html = String(vfile);
-        this.setState({
-          previewValue: html
-        });
-      });
-    });
-    (0, _defineProperty2.default)(this, "updateCode", newCode => {
-      this.setContent(newCode);
-      this.props.onContentChanged && this.props.onContentChanged(newCode);
-    });
-    (0, _defineProperty2.default)(this, "onEnterLeftPanel", () => {
-      this.setState({
-        isMouseInLeftSide: true
-      });
-    });
-    (0, _defineProperty2.default)(this, "onLeaveLeftPanel", () => {
-      this.setState({
-        isMouseInLeftSide: false
-      });
-    });
-    (0, _defineProperty2.default)(this, "onLeftScroll", e => {
-      const {
-        isMouseInLeftSide
-      } = this.state;
-      if (!isMouseInLeftSide) return;
-      let srcElement = this.scrollData.leftPanel;
-      this.scrollData.scrollPercentage = srcElement.scrollTop / srcElement.scrollHeight;
-      this.scrollData.rightPanel.scrollTop = this.scrollData.scrollPercentage * this.scrollData.rightPanel.scrollHeight;
-    });
-    (0, _defineProperty2.default)(this, "onEnterRightPanel", () => {
-      this.setState({
-        isMouseInRightSide: true
-      });
-    });
-    (0, _defineProperty2.default)(this, "onLeaveRightPanel", () => {
-      this.setState({
-        isMouseInRightSide: false
-      });
-    });
-    (0, _defineProperty2.default)(this, "onRightScroll", e => {
-      const {
-        isMouseInRightSide
-      } = this.state;
-      if (!isMouseInRightSide) return;
-      let srcElement = this.scrollData.rightPanel;
-      this.scrollData.scrollPercentage = srcElement.scrollTop / srcElement.scrollHeight;
-      this.scrollData.leftPanel.scrollTop = this.scrollData.scrollPercentage * this.scrollData.leftPanel.scrollHeight;
-    });
-    (0, _defineProperty2.default)(this, "onHotKey", event => {
-      const {
-        onSave
-      } = this.props;
-      if ((0, _isHotkey.default)('mod+s', event)) {
-        event.preventDefault();
-        onSave && onSave(this.state.editorValue);
-        return true;
-      }
-    });
-    this.state = {
-      editorValue: props.value,
-      previewValue: '',
-      isMouseInLeftSide: false,
-      isMouseInRightSide: false
-    };
-  }
-  componentDidMount() {
-    // get relevant dom when component mounted instead of get them when scrolling to improve performance
-    this.scrollData.leftPanel = document.querySelector('.sf-plain-editor-left-panel');
-    this.scrollData.rightPanel = document.querySelector('.sf-plain-editor-right-panel');
-    this.setContent(this.props.value);
-  }
-  componentDidUpdate() {
-    // render math formula
-    // window.MathJax.typesetPromise(document.querySelectorAll('.math-display'));
-  }
-  render() {
-    const {
-      editorValue,
-      previewValue
-    } = this.state;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-plain-editor"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-plain-editor-main d-flex",
-      onKeyDown: this.onHotKey
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-plain-editor-left-panel",
-      onMouseLeave: this.onLeaveLeftPanel,
-      onMouseEnter: this.onEnterLeftPanel,
-      onScroll: this.onLeftScroll
-    }, /*#__PURE__*/_react.default.createElement(_codeMirror.default, {
-      autoFocus: true,
-      initialValue: editorValue,
-      onChange: this.updateCode
-    })), /*#__PURE__*/_react.default.createElement("div", {
-      className: "sf-plain-editor-right-panel",
-      onMouseEnter: this.onEnterRightPanel,
-      onMouseLeave: this.onLeaveRightPanel,
-      onScroll: this.onRightScroll
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "preview"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "rendered-markdown article",
-      dangerouslySetInnerHTML: {
-        __html: previewValue
-      }
-    })))));
-  }
-}
-var _default = exports.default = PlainMarkdownEditor;

package/dist/editors/plain-markdown-editor/style.css

@@ -1,38 +0,0 @@
-.sf-plain-editor {
-  flex: 1;
-  display: flex;
-  min-height: 0;
-  min-width: 0;
-  position: relative;
-}
-
-/* fix plain editor main height */
-.sf-plain-editor-main {
-  position: absolute;
-  inset: 0;
-}
-
-.sf-plain-editor-left-panel {
-  height: 100%;
-  width: 50%;
-  background-color: #fff;
-  border-right: 1px solid rgb(230,230,221);
-  overflow-y: scroll;
-  overflow-x: hidden;
-}
-
-.sf-plain-editor-right-panel {
-  height: 100%;
-  width: 50%;
-  background-color: rgb(250,250,249);
-  overflow-y: scroll;
-  overflow-x: hidden;
-}
-
-.rendered-markdown.article {
-  padding:0 20px 20px;
-}
-
-.rendered-markdown tbody tr:first-child {
-  font-weight: 400;
-}

package/dist/pages/rich-markdown-editor.js

@@ -1,115 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _slateEditor = _interopRequireDefault(require("../editors/slate-editor"));
-var _plainMarkdownEditor = _interopRequireDefault(require("../editors/plain-markdown-editor"));
-var _loading = _interopRequireDefault(require("../containers/loading"));
-var _slateConvert = require("../slate-convert");
-var _useMathjax = _interopRequireDefault(require("../hooks/use-mathjax"));
-var _core = require("../extension/core");
-const EDITOR_MODE = {
-  RICH: 'rich',
-  PLAIN: 'plain'
-};
-const RichMarkdownEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    mode = EDITOR_MODE.RICH,
-    isFetching,
-    initValue,
-    value,
-    editorApi,
-    onSave: propsOnSave,
-    onContentChanged: propsOnContentChanged,
-    mathJaxSource,
-    isSupportInsertSeafileImage,
-    children
-  } = _ref;
-  const currentMode = (0, _react.useRef)(mode);
-  const [mdStringValue, setMdStringValue] = (0, _react.useState)('');
-  const [richValue, setRichValue] = (0, _react.useState)([]);
-  const [isLoading, setIsLoading] = (0, _react.useState)(true);
-  const {
-    isLoadingMathJax
-  } = (0, _useMathjax.default)(mathJaxSource);
-  (0, _react.useImperativeHandle)(ref, () => {
-    return {
-      getValue: () => {
-        if (mode === EDITOR_MODE.RICH) {
-          const newValue = (0, _slateConvert.slateToMdString)(richValue);
-          return newValue;
-        } else {
-          return mdStringValue;
-        }
-      }
-    };
-  }, [mdStringValue, mode, richValue]);
-  (0, _react.useEffect)(() => {
-    if (!isFetching) {
-      let richValue = (0, _slateConvert.mdStringToSlate)(value);
-      if (!value && initValue) {
-        richValue = [(0, _core.generateHeaderElement)(initValue)];
-      }
-      setRichValue(richValue);
-      setMdStringValue(value);
-      setIsLoading(false);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isFetching]);
-  (0, _react.useEffect)(() => {
-    if (mode !== currentMode.current && mode === EDITOR_MODE.RICH) {
-      setIsLoading(true);
-      queueMicrotask(() => {
-        currentMode.current = mode;
-        const newRichValue = (0, _slateConvert.mdStringToSlate)(mdStringValue);
-        setRichValue(newRichValue);
-        setIsLoading(false);
-      });
-    }
-    if (mode !== currentMode.current && mode === EDITOR_MODE.PLAIN) {
-      setIsLoading(true);
-      queueMicrotask(() => {
-        currentMode.current = mode;
-        const newMdStringValue = (0, _slateConvert.slateToMdString)(richValue);
-        setMdStringValue(newMdStringValue);
-        setIsLoading(false);
-      });
-    }
-  }, [mdStringValue, mode, richValue]);
-  const onContentChanged = (0, _react.useCallback)(content => {
-    if (mode === EDITOR_MODE.RICH) {
-      setRichValue(content);
-    } else {
-      setMdStringValue(content);
-    }
-    propsOnContentChanged && propsOnContentChanged();
-  }, [mode, propsOnContentChanged]);
-  const props = {
-    onSave: propsOnSave,
-    onContentChanged: onContentChanged,
-    isSupportFormula: !!mathJaxSource,
-    isSupportInsertSeafileImage,
-    ...(children && {
-      children
-    }),
-    ...(mode === EDITOR_MODE.PLAIN && {
-      value: mdStringValue
-    }),
-    ...(mode === EDITOR_MODE.RICH && {
-      value: richValue
-    }),
-    ...(mode === EDITOR_MODE.RICH && {
-      editorApi: editorApi
-    })
-  };
-  if (isFetching || isLoading || isLoadingMathJax) {
-    return /*#__PURE__*/_react.default.createElement(_loading.default, null);
-  }
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, mode === 'rich' && /*#__PURE__*/_react.default.createElement(_slateEditor.default, props), mode === 'plain' && /*#__PURE__*/_react.default.createElement(_plainMarkdownEditor.default, props));
-});
-var _default = exports.default = RichMarkdownEditor;