@seafile/seafile-editor 1.0.85-beta6 → 1.0.85-beta8

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

@@ -15,12 +15,11 @@ var _eventHandler = _interopRequireDefault(require("../../utils/event-handler"))
 var _withPropsEditor = _interopRequireDefault(require("./with-props-editor"));
 var _core = require("../../extension/core");
 var _common = require("../../utils/common");
-require("./style.css");
+require("./index.css");
 const isMacOS = (0, _common.isMac)();
 const InlineEditor = _ref => {
   let {
-    showTitle,
-    focusNodePath,
+    isFocus,
     value,
     editorApi,
     onSave,
@@ -31,13 +30,14 @@ const InlineEditor = _ref => {
   } = _ref;
   const [slateValue, setSlateValue] = (0, _react.useState)(value);
   const editor = (0, _react.useMemo)(() => {
-    if (showTitle) return (0, _withPropsEditor.default)(_extension.inlineEditor, {
+    const baseEditor = (0, _extension.inlineEditor)();
+    if (isFocus) return (0, _withPropsEditor.default)(baseEditor, {
       editorApi,
       onSave,
       columns
     });
-    return _extension.inlineEditor;
-  }, [columns, editorApi, onSave, showTitle]);
+    return baseEditor;
+  }, [columns, editorApi, onSave, isFocus]);
   const eventProxy = (0, _react.useMemo)(() => {
     return new _eventHandler.default(editor);
   }, [editor]);
@@ -53,21 +53,9 @@ const InlineEditor = _ref => {
     const eventBus = _eventBus.default.getInstance();
     eventBus.dispatch('change');
   }, [editor, onContentChanged]);
-  const focusNode = (0, _react.useCallback)((editor, focusNodePath) => {
+  const focusFirstNode = (0, _react.useCallback)(editor => {
     const [firstNode] = editor.children;
     if (!firstNode) return;
-    if (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;
-      }
-    }
     const [firstNodeFirstChild] = firstNode.children;
     if (firstNodeFirstChild) {
       const startOfFirstNode = _slate.Editor.start(editor, [0, 0]);
@@ -103,7 +91,7 @@ const InlineEditor = _ref => {
     });
     const timer = setTimeout(() => {
       editor.forceNormalize = false;
-      focusNode(editor, focusNodePath);
+      focusFirstNode(editor);
     }, 300);
     return () => {
       editor.forceNormalize = false;
@@ -126,12 +114,12 @@ const InlineEditor = _ref => {
   const onEditorClick = (0, _react.useCallback)(() => {
     const value = editor.children;
     if (value.length === 1 && _slate.Node.string(value[0]).length === 0) {
-      focusNode(editor);
+      focusFirstNode(editor);
     }
-  }, [editor, focusNode]);
+  }, [editor, focusFirstNode]);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-simple-slate-editor-container"
-  }, showTitle && /*#__PURE__*/_react.default.createElement(_extension.InlineToolbar, {
+  }, isFocus && /*#__PURE__*/_react.default.createElement(_extension.InlineToolbar, {
     editor: editor,
     isSupportFormula: isSupportFormula,
     isSupportColumn: !!columns,

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

@@ -19,7 +19,6 @@ require("./style.css");
 const isMacOS = (0, _common.isMac)();
 const SimpleSlateEditor = _ref => {
   let {
-    focusNodePath,
     value,
     editorApi,
     onSave,
@@ -48,21 +47,9 @@ const SimpleSlateEditor = _ref => {
     const eventBus = _eventBus.default.getInstance();
     eventBus.dispatch('change');
   }, [editor, onContentChanged]);
-  const focusNode = (0, _react.useCallback)((editor, focusNodePath) => {
+  const focusFirstNode = (0, _react.useCallback)(editor => {
     const [firstNode] = editor.children;
     if (!firstNode) return;
-    if (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;
-      }
-    }
     const [firstNodeFirstChild] = firstNode.children;
     if (firstNodeFirstChild) {
       const startOfFirstNode = _slate.Editor.start(editor, [0, 0]);
@@ -98,7 +85,7 @@ const SimpleSlateEditor = _ref => {
     });
     const timer = setTimeout(() => {
       editor.forceNormalize = false;
-      focusNode(editor, focusNodePath);
+      focusFirstNode(editor);
     }, 300);
     return () => {
       editor.forceNormalize = false;
@@ -121,9 +108,9 @@ const SimpleSlateEditor = _ref => {
   const onEditorClick = (0, _react.useCallback)(() => {
     const value = editor.children;
     if (value.length === 1 && _slate.Node.string(value[0]).length === 0) {
-      focusNode(editor);
+      focusFirstNode(editor);
     }
-  }, [editor, focusNode]);
+  }, [editor, focusFirstNode]);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-simple-slate-editor-container"
   }, /*#__PURE__*/_react.default.createElement(_extension.Toolbar, {

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

@@ -0,0 +1,82 @@
+"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 _isHotkey = _interopRequireDefault(require("is-hotkey"));
+var _markdownPreview = _interopRequireDefault(require("../markdown-preview"));
+const FallbackEditor = _ref => {
+  let {
+    isShowEditor,
+    value: propsValue,
+    onChange: propsOnChange,
+    closeEditor
+  } = _ref;
+  const [value, setValue] = (0, _react.useState)(propsValue);
+  const showEditorRef = (0, _react.useRef)(false);
+  const inputRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    if (isShowEditor === showEditorRef.current) return;
+    if (isShowEditor && !showEditorRef.current) {
+      setTimeout(() => inputRef.current.focus());
+    }
+  }, [isShowEditor]);
+  const onChange = (0, _react.useCallback)(event => {
+    const newValue = event.target.value;
+    if (newValue === value) return;
+    setValue(newValue);
+    propsOnChange && propsOnChange({
+      text: newValue,
+      preview: newValue ? newValue.slice(0, 30) : '',
+      links: [],
+      images: []
+    });
+  }, [value, propsOnChange]);
+  const onKeyDown = (0, _react.useCallback)(e => {
+    let {
+      selectionStart,
+      selectionEnd,
+      value
+    } = e.currentTarget;
+    if ((0, _isHotkey.default)('enter', e)) {
+      e.preventDefault();
+      closeEditor && closeEditor();
+      inputRef.current.blur();
+    } else if (e.keyCode === 37 && selectionStart === 0 || e.keyCode === 39 && selectionEnd === value.length) {
+      e.stopPropagation();
+    }
+  }, [closeEditor]);
+  const onPaste = (0, _react.useCallback)(e => {
+    e.stopPropagation();
+  }, []);
+  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,
+    rows: 5,
+    value: value,
+    onChange: onChange,
+    onKeyDown: onKeyDown,
+    onPaste: onPaste,
+    onCut: onCut
+  });
+};
+var _default = exports.default = FallbackEditor;

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

@@ -69,3 +69,9 @@
 .sf-editor-menu-popover .popover-inner {
   display: flex;
 }
+
+/* weixin editor  */
+.sf-long-text-inline-fallback-editor-container {
+  width: 100%;
+  resize: none;
+}

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

@@ -9,11 +9,10 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _isHotkey = _interopRequireDefault(require("is-hotkey"));
 var _clickOutside = _interopRequireDefault(require("./click-outside"));
-var _formatter = _interopRequireDefault(require("./formatter"));
-var _editor = _interopRequireDefault(require("./editor"));
-var _slateConvert = require("../../slate-convert");
+var _normalEditor = _interopRequireDefault(require("./normal-editor"));
+var _fallbackEditor = _interopRequireDefault(require("./fallback-editor"));
 var _getBrowserInfo = _interopRequireDefault(require("../../utils/get-browser-Info"));
-var _extension = require("../../extension");
+require("./index.css");
 const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     autoSave,
@@ -26,43 +25,25 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
     onSaveEditorValue,
     editorApi
   } = _ref;
-  const [isShowEditor, setShowEditor] = (0, _react.useState)(false);
+  const [isFocusEditor, setFocusEditor] = (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)([0, 0]);
   const {
     isWindowsWechat
   } = (0, _react.useMemo)(() => {
     return (0, _getBrowserInfo.default)(isCheckBrowser);
   }, [isCheckBrowser]);
-  const openEditor = (0, _react.useCallback)(function () {
-    let focusNodePath = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [0, 0];
-    setFocusNodePath(focusNodePath);
-    setShowEditor(true);
+  const openEditor = (0, _react.useCallback)(() => {
+    setFocusEditor(true);
   }, []);
   const closeEditor = (0, _react.useCallback)(() => {
     if (longTextValueChangedRef.current) {
       onSaveEditorValue(valueRef.current);
     }
-    setShowEditor(false);
+    setFocusEditor(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((0, _extension.getNodePathById)({
-      children: richValue
-    }, nodeId));
-  }, [onPreviewClick, openEditor, getAttributeNode]);
   const onEditorValueChanged = (0, _react.useCallback)(value => {
     valueRef.current = value;
     longTextValueChangedRef.current = true;
@@ -84,21 +65,26 @@ const LongTextInlineEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) =>
     };
   }, [openEditor, closeEditor]);
   const onClick = (0, _react.useCallback)(() => {
-    if (isShowEditor) return;
-    setShowEditor(true);
-  }, [isShowEditor]);
+    if (isFocusEditor) return;
+    onPreviewClick && onPreviewClick();
+    setFocusEditor(true);
+  }, [isFocusEditor, onPreviewClick]);
   return /*#__PURE__*/_react.default.createElement(_clickOutside.default, {
     onClickOutside: closeEditor
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "w-100",
     onKeyDown: onHotKey,
     onClick: onClick
-  }, /*#__PURE__*/_react.default.createElement(_editor.default, {
-    showTitle: isShowEditor,
+  }, isWindowsWechat ? /*#__PURE__*/_react.default.createElement(_fallbackEditor.default, {
+    isShowEditor: isFocusEditor,
+    value: valueRef.current.text,
+    onChange: onEditorValueChanged,
+    closeEditor: closeEditor
+  }) : /*#__PURE__*/_react.default.createElement(_normalEditor.default, {
+    isFocus: isFocusEditor,
     lang: lang,
     isWindowsWechat: isWindowsWechat,
     headerName: headerName,
-    focusNodePath: focusNodePath,
     value: valueRef.current.text,
     autoSave: autoSave,
     saveDelay: saveDelay,

package/dist/pages/longtext-inline-editor/{editor.js → normal-editor.js}

@@ -7,19 +7,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _simpleEditor = _interopRequireDefault(require("./simple-editor"));
+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"));
-require("./index.css");
-const Editor = _ref => {
+const NormalEditor = _ref => {
   let {
-    showTitle,
+    isFocus,
     lang,
     headerName,
     value: propsValue,
-    isWindowsWechat,
-    focusNodePath,
     autoSave = true,
     saveDelay = 60000,
     isCheckBrowser = false,
@@ -97,14 +95,14 @@ const Editor = _ref => {
     };
   }, [autoSave, saveDelay, handelAutoSave]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "sf-long-text-inline-editor-container",
+    className: (0, _classnames.default)('sf-long-text-inline-editor-container', {
+      'preview': !isFocus
+    }),
     style: style,
     ref: editorContainerRef
-  }, !showExpandEditor && !isWindowsWechat ? /*#__PURE__*/_react.default.createElement(_simpleEditor.default, {
-    isInline: true,
-    showTitle: showTitle,
-    focusNodePath: focusNodePath,
+  }, !showExpandEditor ? /*#__PURE__*/_react.default.createElement(_simpleEditor.default, {
     ref: editorRef,
+    isFocus: isFocus,
     value: value.text,
     onSave: handelAutoSave,
     editorApi: editorApi,
@@ -117,7 +115,6 @@ const Editor = _ref => {
   }), /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-slate-editor-content"
   }, /*#__PURE__*/_react.default.createElement(_markdownPreview.default, {
-    isWindowsWechat: isWindowsWechat,
     value: value.text,
     isShowOutline: false
   })))), showExpandEditor && /*#__PURE__*/_react.default.createElement(_longtextEditorDialog.default, {
@@ -134,4 +131,4 @@ const Editor = _ref => {
     onCloseEditorDialog: onCloseEditorDialog
   }));
 };
-var _default = exports.default = Editor;
+var _default = exports.default = NormalEditor;

package/dist/pages/simple-editor.js

@@ -11,8 +11,10 @@ var _loading = _interopRequireDefault(require("../containers/loading"));
 var _slateConvert = require("../slate-convert");
 var _useMathjax = _interopRequireDefault(require("../hooks/use-mathjax"));
 var _simpleSlateEditor = _interopRequireDefault(require("../editors/simple-slate-editor"));
+var _inlineEditor = _interopRequireDefault(require("../editors/inline-editor"));
 const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
+    isInline,
     isFetching,
     value,
     editorApi,
@@ -60,6 +62,9 @@ const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   if (isFetching || isLoading || isLoadingMathJax) {
     return /*#__PURE__*/_react.default.createElement(_loading.default, null);
   }
+  if (isInline) {
+    return /*#__PURE__*/_react.default.createElement(_inlineEditor.default, props);
+  }
   return /*#__PURE__*/_react.default.createElement(_simpleSlateEditor.default, props);
 });
 var _default = exports.default = SimpleEditor;

package/package.json

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

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

@@ -1,31 +0,0 @@
-.longtext-preview-container {
-  width: 100%;
-  height: 100%;
-  padding: 16px;
-  overflow: auto;
-}
-
-.longtext-preview-container .sf-slate-viewer-scroll-container {
-  overflow-y: auto;
-  height: fit-content;
-  padding: 0;
-  background: #fff;
-}
-
-.longtext-preview-container .sf-slate-viewer-article-container {
-  height: 100%;
-  width: 100%;
-  margin: 0;
-}
-
-.longtext-preview-container .sf-slate-viewer-article-container .article {
-  padding: 0;
-  height: auto;
-  min-height: 100% !important;
-  border: 0;
-  color: #212529;
-}
-
-.longtext-preview-container .article :first-child {
-  margin-top: 0;
-}

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

@@ -1,66 +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 _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/simple-editor.js

@@ -1,65 +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 _loading = _interopRequireDefault(require("../../containers/loading"));
-var _slateConvert = require("../../slate-convert");
-var _useMathjax = _interopRequireDefault(require("../../hooks/use-mathjax"));
-var _inlineEditor = _interopRequireDefault(require("../../editors/inline-editor"));
-const SimpleEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    isFetching,
-    value,
-    editorApi,
-    mathJaxSource,
-    onSave: propsOnSave,
-    onContentChanged: propsOnContentChanged,
-    ...otherProps
-  } = _ref;
-  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: () => {
-        const mdStringValue = (0, _slateConvert.slateToMdString)(richValue);
-        return mdStringValue;
-      },
-      getSlateValue: () => {
-        return richValue;
-      }
-    };
-  }, [richValue]);
-  (0, _react.useEffect)(() => {
-    if (!isFetching) {
-      const richValue = (0, _slateConvert.mdStringToSlate)(value);
-      setRichValue(richValue);
-      setIsLoading(false);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [isFetching]);
-  const onContentChanged = (0, _react.useCallback)(content => {
-    setRichValue(content);
-    propsOnContentChanged && propsOnContentChanged();
-  }, [propsOnContentChanged]);
-  const props = {
-    isSupportFormula: !!mathJaxSource,
-    value: richValue,
-    editorApi: editorApi,
-    onSave: propsOnSave,
-    onContentChanged: onContentChanged,
-    ...otherProps
-  };
-  if (isFetching || isLoading || isLoadingMathJax) {
-    return /*#__PURE__*/_react.default.createElement(_loading.default, null);
-  }
-  return /*#__PURE__*/_react.default.createElement(_inlineEditor.default, props);
-});
-var _default = exports.default = SimpleEditor;