@seafile/sdoc-editor 2.0.82 → 2.0.83

package/dist/editor/sdoc-editor.js

@@ -0,0 +1,278 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _slate = require("@seafile/slate");
+var _deepCopy = _interopRequireDefault(require("deep-copy"));
+var _isHotkey = _interopRequireDefault(require("is-hotkey"));
+var _jsBridge = _interopRequireDefault(require("../android/js-bridge"));
+var _outlineModule = require("../android/outline-module");
+var _fileLoading = _interopRequireDefault(require("../components/file-loading"));
+var _constants = require("../constants");
+var _context = _interopRequireDefault(require("../context"));
+var _extension = require("../extension");
+var _insertElementDialog = _interopRequireDefault(require("../extension/commons/insert-element-dialog"));
+var _core = require("../extension/core");
+var _helpers = require("../extension/plugins/ai/ai-module/helpers");
+var _useColorContext = require("../hooks/use-color-context");
+var _layout = require("../layout");
+var _nodeId = _interopRequireDefault(require("../node-id"));
+var _socket = require("../socket");
+var _commonUtils = require("../utils/common-utils");
+var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
+var _readonlyArticle = _interopRequireDefault(require("../views/readonly-article"));
+var _editableArticle = _interopRequireDefault(require("./editable-article"));
+var SdocEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var propsEditor = _ref.editor,
+    document = _ref.document,
+    isReloading = _ref.isReloading,
+    showComment = _ref.showComment,
+    _ref$isShowHeaderTool = _ref.isShowHeaderToolbar,
+    isShowHeaderToolbar = _ref$isShowHeaderTool === void 0 ? true : _ref$isShowHeaderTool,
+    _ref$showOutline = _ref.showOutline,
+    showOutline = _ref$showOutline === void 0 ? true : _ref$showOutline;
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    showFullScreen = _useState2[0],
+    setShowFullScreen = _useState2[1];
+  var validEditor = (0, _react.useMemo)(function () {
+    if (propsEditor) return propsEditor;
+    var defaultEditor = (0, _extension.createDefaultEditor)();
+    var editorConfig = _context["default"].getEditorConfig();
+    var newEditor = (0, _nodeId["default"])((0, _socket.withSocketIO)(defaultEditor, {
+      document: document,
+      config: editorConfig
+    }));
+    var cursors = document.cursors;
+    newEditor.cursors = cursors || {};
+    newEditor.width = _constants.PAGE_EDIT_AREA_WIDTH; // default width
+    return newEditor;
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var _useState3 = (0, _react.useState)(document.elements),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    slateValue = _useState4[0],
+    _setSlateValue = _useState4[1];
+
+  // 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.elements. This unexpected action cause the editor to display the old content
+  (0, _react.useEffect)(function () {
+    _setSlateValue(document.elements);
+  }, [document.elements]);
+  (0, _react.useEffect)(function () {
+    validEditor.readonly = false;
+    return function () {
+      validEditor.selection = null;
+    };
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  // useMount: init socket connection
+  (0, _react.useEffect)(function () {
+    if (propsEditor) return;
+    validEditor.openConnection();
+    return function () {
+      validEditor.closeConnection();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  // useMount: focus editor
+  (0, _react.useEffect)(function () {
+    var timer = setTimeout(function () {
+      var _validEditor$children = (0, _slicedToArray2["default"])(validEditor.children, 1),
+        firstNode = _validEditor$children[0];
+      if (firstNode) {
+        var _firstNode$children = (0, _slicedToArray2["default"])(firstNode.children, 1),
+          firstNodeFirstChild = _firstNode$children[0];
+        if (firstNodeFirstChild) {
+          var endOfFirstNode = _slate.Editor.end(validEditor, [0, 0]);
+          var range = {
+            anchor: endOfFirstNode,
+            focus: endOfFirstNode
+          };
+          (0, _core.focusEditor)(validEditor, range);
+        }
+      }
+    }, 300);
+    return function () {
+      clearTimeout(timer);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(function () {
+    var mobileLogin = _context["default"].getSetting('mobileLogin');
+    if (mobileLogin) {
+      _jsBridge["default"].init();
+      (0, _outlineModule.registerOutlineEventHandler)();
+      (0, _outlineModule.updateOutlineValue)(document.elements);
+    }
+    return function () {
+      _jsBridge["default"].finishPage();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var onRefreshDocument = (0, _react.useCallback)(function () {
+    window.location.reload();
+  }, []);
+
+  // useMount: refresh document
+  (0, _react.useEffect)(function () {
+    var eventBus = _eventBus["default"].getInstance();
+    eventBus.subscribe(_constants.INTERNAL_EVENT.REFRESH_DOCUMENT, onRefreshDocument);
+
+    // Remove Marks on special conditions like unexpected exit or refresh page using AI or context comment
+    var hasSpecialMark = !_slate.Editor.nodes(validEditor, {
+      at: [],
+      match: function match(n) {
+        return _slate.Text.isText(n) && (n.sdoc_ai === true || n.comment === true);
+      }
+    }).next().done;
+    if (hasSpecialMark) {
+      (0, _helpers.removeMarks)(validEditor);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [onRefreshDocument]);
+
+  // Handle presentation fullscreen mode
+  var handleFullScreenPresentation = (0, _react.useCallback)(function (_ref2) {
+    var isShowFullScreen = _ref2.isShowFullScreen;
+    if (isShowFullScreen) {
+      // Boundary situation
+      (0, _helpers.removeMarks)(validEditor);
+      setShowFullScreen(true);
+    }
+  }, [validEditor]);
+  (0, _react.useEffect)(function () {
+    var eventBus = _eventBus["default"].getInstance();
+    var unsubscribePresentationFullScreen = eventBus.subscribe(_constants.INTERNAL_EVENT.TOGGLE_PRESENTATION_MODE, handleFullScreenPresentation);
+    return function () {
+      unsubscribePresentationFullScreen();
+    };
+  }, [handleFullScreenPresentation]);
+  (0, _react.useEffect)(function () {
+    var handleExit = function handleExit(e) {
+      if ((0, _isHotkey["default"])('esc', e)) {
+        e.preventDefault();
+        if (window.document.fullscreenElement) {
+          window.document.exitFullscreen();
+        }
+      }
+    };
+    var onFullscreenChange = function onFullscreenChange() {
+      if (!window.document.fullscreenElement) {
+        setShowFullScreen(false);
+      }
+    };
+    window.addEventListener('keydown', handleExit);
+    window.document.addEventListener('fullscreenchange', onFullscreenChange);
+    return function () {
+      window.removeEventListener('keydown', handleExit);
+      window.document.removeEventListener('fullscreenchange', onFullscreenChange);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  // The parent component can call the method of this component through ref
+  (0, _react.useImperativeHandle)(ref, function () {
+    return {
+      setSlateValue: function setSlateValue(document) {
+        // Force update of editor's child elements
+        validEditor.children = document.elements;
+        _setSlateValue((0, _toConsumableArray2["default"])(document.elements));
+      },
+      updateDocumentVersion: function updateDocumentVersion(document) {
+        validEditor.updateDocumentVersion(document);
+      },
+      // get value
+      getSlateValue: function getSlateValue() {
+        return (0, _deepCopy["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, document), {}, {
+          elements: slateValue
+        }));
+      }
+
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    };
+  }, [document, validEditor, slateValue]);
+  var onValueChange = function onValueChange(value) {
+    var eventBus = _eventBus["default"].getInstance();
+    _setSlateValue(value);
+    // After the content is updated, update the search content
+    setTimeout(function () {
+      eventBus.dispatch(_constants.INTERNAL_EVENT.UPDATE_SEARCH_REPLACE_HIGHLIGHT, value);
+    }, 0);
+    if (_commonUtils.isMobile) {
+      (0, _outlineModule.updateOutlineValue)(value);
+    }
+  };
+  var isFreezed = _context["default"].getSetting('isFreezed');
+  if (isReloading) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "h-100 w-100 d-flex align-items-center justify-content-center"
+    }, /*#__PURE__*/_react["default"].createElement(_fileLoading["default"], null));
+  }
+  if (_commonUtils.isMobile || showFullScreen) {
+    return /*#__PURE__*/_react["default"].createElement(_layout.EditorContainer, {
+      editor: validEditor,
+      readonly: true,
+      fullscreen: showFullScreen
+    }, /*#__PURE__*/_react["default"].createElement(_useColorContext.ColorProvider, null, /*#__PURE__*/_react["default"].createElement(_layout.EditorContent, {
+      docValue: slateValue,
+      readonly: true,
+      showOutline: false,
+      editor: validEditor,
+      showComment: false
+    }, /*#__PURE__*/_react["default"].createElement(_readonlyArticle["default"], {
+      editor: validEditor,
+      slateValue: slateValue,
+      showComment: false
+    }))));
+  }
+  if (isFreezed) {
+    return /*#__PURE__*/_react["default"].createElement(_layout.EditorContainer, {
+      editor: validEditor,
+      readonly: isFreezed
+    }, /*#__PURE__*/_react["default"].createElement(_useColorContext.ColorProvider, null, isShowHeaderToolbar && /*#__PURE__*/_react["default"].createElement(_extension.HeaderToolbar, {
+      editor: validEditor,
+      readonly: isFreezed
+    }), /*#__PURE__*/_react["default"].createElement(_layout.EditorContent, {
+      docValue: slateValue,
+      showOutline: true,
+      readonly: isFreezed,
+      editor: validEditor,
+      showComment: true
+    }, /*#__PURE__*/_react["default"].createElement(_readonlyArticle["default"], {
+      editor: validEditor,
+      slateValue: slateValue,
+      showComment: true
+    }))));
+  }
+  var isShowComment = typeof showComment === 'boolean' ? showComment : true;
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_layout.EditorContainer, {
+    editor: validEditor
+  }, /*#__PURE__*/_react["default"].createElement(_useColorContext.ColorProvider, null, isShowHeaderToolbar && /*#__PURE__*/_react["default"].createElement(_extension.HeaderToolbar, {
+    editor: validEditor
+  }), /*#__PURE__*/_react["default"].createElement(_layout.EditorContent, {
+    docValue: slateValue,
+    showOutline: showOutline !== null && showOutline !== void 0 ? showOutline : true,
+    editor: validEditor,
+    showComment: isShowComment
+  }, /*#__PURE__*/_react["default"].createElement(_editableArticle["default"], {
+    editor: validEditor,
+    slateValue: slateValue,
+    updateSlateValue: onValueChange,
+    showComment: isShowComment
+  })))), /*#__PURE__*/_react["default"].createElement(_insertElementDialog["default"], {
+    editor: validEditor
+  }));
+});
+var _default = exports["default"] = SdocEditor;

package/dist/editor/wiki-editor.js

@@ -0,0 +1,196 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _slate = require("@seafile/slate");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _deepCopy = _interopRequireDefault(require("deep-copy"));
+var _fileLoading = _interopRequireDefault(require("../components/file-loading"));
+var _constants = require("../constants");
+var _context = _interopRequireDefault(require("../context"));
+var _extension = require("../extension");
+var _insertElementDialog = _interopRequireDefault(require("../extension/commons/insert-element-dialog"));
+var _core = require("../extension/core");
+var _useColorContext = require("../hooks/use-color-context");
+var _useScrollContext = require("../hooks/use-scroll-context");
+var _layout = require("../layout");
+var _nodeId = _interopRequireDefault(require("../node-id"));
+var _wikiOutline = _interopRequireDefault(require("../outline/wiki-outline"));
+var _socket = require("../socket");
+var _commonUtils = require("../utils/common-utils");
+var _eventBus = _interopRequireDefault(require("../utils/event-bus"));
+var _readonlyArticle = _interopRequireDefault(require("../views/readonly-article"));
+var _editableArticle = _interopRequireDefault(require("./editable-article"));
+var WikiEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
+  var propsEditor = _ref.editor,
+    document = _ref.document,
+    isReloading = _ref.isReloading,
+    isWikiReadOnly = _ref.isWikiReadOnly,
+    scrollRef = _ref.scrollRef;
+  var validEditor = (0, _react.useMemo)(function () {
+    if (propsEditor) return propsEditor;
+    var defaultEditor = (0, _extension.createDefaultEditor)();
+    var editorConfig = _context["default"].getEditorConfig();
+    var newEditor = (0, _nodeId["default"])((0, _socket.withSocketIO)(defaultEditor, {
+      document: document,
+      config: editorConfig
+    }));
+    var cursors = document.cursors;
+    newEditor.cursors = cursors || {};
+    newEditor.width = _constants.WIKI_EDITOR_EDIT_AREA_WIDTH; // default width
+    return newEditor;
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var _useState = (0, _react.useState)(document.elements),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    slateValue = _useState2[0],
+    _setSlateValue = _useState2[1];
+
+  // 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.elements. This unexpected action cause the editor to display the old content
+  (0, _react.useEffect)(function () {
+    _setSlateValue(document.elements);
+  }, [document.elements]);
+  (0, _react.useEffect)(function () {
+    validEditor.readonly = false;
+    return function () {
+      validEditor.selection = null;
+    };
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  // useMount: init socket connection
+  (0, _react.useEffect)(function () {
+    if (propsEditor) return;
+    validEditor.openConnection();
+    return function () {
+      validEditor.closeConnection();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  // useMount: focus editor
+  (0, _react.useEffect)(function () {
+    var timer = setTimeout(function () {
+      var _validEditor$children = (0, _slicedToArray2["default"])(validEditor.children, 1),
+        firstNode = _validEditor$children[0];
+      if (firstNode) {
+        var _firstNode$children = (0, _slicedToArray2["default"])(firstNode.children, 1),
+          firstNodeFirstChild = _firstNode$children[0];
+        if (firstNodeFirstChild) {
+          var endOfFirstNode = _slate.Editor.end(validEditor, [0, 0]);
+          var range = {
+            anchor: endOfFirstNode,
+            focus: endOfFirstNode
+          };
+          (0, _core.focusEditor)(validEditor, range);
+        }
+      }
+    }, 300);
+    return function () {
+      clearTimeout(timer);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  (0, _react.useEffect)(function () {
+    if (scrollRef) {
+      scrollRef.current.id = 'sdoc-scroll-container';
+    }
+  }, [scrollRef]);
+  var onRefreshDocument = (0, _react.useCallback)(function () {
+    window.location.reload();
+  }, []);
+
+  // useMount: refresh document
+  (0, _react.useEffect)(function () {
+    var eventBus = _eventBus["default"].getInstance();
+    eventBus.subscribe(_constants.INTERNAL_EVENT.REFRESH_DOCUMENT, onRefreshDocument);
+  }, [onRefreshDocument]);
+
+  // The parent component can call the method of this component through ref
+  (0, _react.useImperativeHandle)(ref, function () {
+    return {
+      setSlateValue: function setSlateValue(document) {
+        // Force update of editor's child elements
+        validEditor.children = document.elements;
+        _setSlateValue((0, _toConsumableArray2["default"])(document.elements));
+      },
+      updateDocumentVersion: function updateDocumentVersion(document) {
+        validEditor.updateDocumentVersion(document);
+      },
+      // get value
+      getSlateValue: function getSlateValue() {
+        return (0, _deepCopy["default"])((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, document), {}, {
+          elements: slateValue
+        }));
+      }
+
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+    };
+  }, [document, validEditor, slateValue]);
+  var onValueChange = function onValueChange(value) {
+    var eventBus = _eventBus["default"].getInstance();
+    // After the content is updated, update the search content
+    setTimeout(function () {
+      eventBus.dispatch(_constants.INTERNAL_EVENT.UPDATE_SEARCH_REPLACE_HIGHLIGHT, value);
+    }, 0);
+    _setSlateValue(value);
+  };
+  if (isReloading) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "h-100 w-100 d-flex align-items-center justify-content-center"
+    }, /*#__PURE__*/_react["default"].createElement(_fileLoading["default"], null));
+  }
+  if (_commonUtils.isMobile || isWikiReadOnly) {
+    return /*#__PURE__*/_react["default"].createElement(_layout.EditorContainer, {
+      editor: validEditor,
+      readonly: true
+    }, /*#__PURE__*/_react["default"].createElement(_useColorContext.ColorProvider, null, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sdoc-content-wrapper"
+    }, /*#__PURE__*/_react["default"].createElement(_useScrollContext.ScrollContext.Provider, {
+      value: {
+        scrollRef: scrollRef
+      }
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sdoc-editor-content readonly"
+    }, /*#__PURE__*/_react["default"].createElement(_readonlyArticle["default"], {
+      editor: validEditor,
+      slateValue: slateValue,
+      showComment: false
+    })), !_commonUtils.isMobile && isWikiReadOnly && /*#__PURE__*/_react["default"].createElement(_wikiOutline["default"], {
+      doc: slateValue
+    })))));
+  }
+  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_layout.EditorContainer, {
+    editor: validEditor
+  }, /*#__PURE__*/_react["default"].createElement(_useColorContext.ColorProvider, null, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "sdoc-content-wrapper"
+  }, /*#__PURE__*/_react["default"].createElement(_useScrollContext.ScrollContext.Provider, {
+    value: {
+      scrollRef: scrollRef
+    }
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])('sdoc-editor-content', {
+      'readonly': isWikiReadOnly
+    })
+  }, /*#__PURE__*/_react["default"].createElement(_editableArticle["default"], {
+    editor: validEditor,
+    slateValue: slateValue,
+    updateSlateValue: onValueChange,
+    showComment: false
+  })), /*#__PURE__*/_react["default"].createElement(_wikiOutline["default"], {
+    doc: slateValue
+  }))))), /*#__PURE__*/_react["default"].createElement(_insertElementDialog["default"], {
+    editor: validEditor
+  }));
+});
+var _default = exports["default"] = WikiEditor;

package/dist/extension/commons/Inline-bug-fix-wrapper/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var InlineBugFixer = function InlineBugFixer() {
+  return /*#__PURE__*/_react["default"].createElement("span", {
+    contentEditable: false,
+    style: {
+      fontSize: 0
+    }
+  }, String.fromCodePoint(160) /* Non-breaking space */);
+};
+var _default = exports["default"] = InlineBugFixer;

package/dist/extension/commons/color-menu/color-item.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactI18next = require("react-i18next");
+var _classnames = _interopRequireDefault(require("classnames"));
+var ColorItem = function ColorItem(_ref) {
+  var t = _ref.t,
+    color = _ref.color,
+    lastUsedColor = _ref.lastUsedColor;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: (0, _classnames["default"])('sdoc-color-item', {
+      'selected': lastUsedColor === color.value
+    }),
+    style: {
+      backgroundColor: color.value
+    },
+    color: color.value,
+    "data-color": color.value,
+    title: color.index ? t(color.name, {
+      value: color.index
+    }) : t(color.name)
+  });
+};
+var _default = exports["default"] = (0, _reactI18next.withTranslation)('sdoc-editor')(ColorItem);