@seafile/seafile-editor 0.4.7 → 1.0.0

package/dist/assets/editor/simple-editor.css

@@ -1,77 +0,0 @@
-.seafile-simple-editor {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-  min-width: 768px;
-  overflow: hidden;
-  border: 1px solid #e5e5e5;
-}
-
-.seafile-simple-editor .seafile-editor-topbar {
-  width: 100%;
-  background-color: #fff;
-  border-bottom: 1px solid #e5e5e5;
-  box-shadow: 0 3px 2px -2px rgba(200,200,200,.15);
-  user-select: none;
-  position: relative;
-  z-index: 3;
-  display: flex;
-  justify-content: space-between;
-}
-
-.seafile-simple-editor .seafile-editor-topbar .use-help-icon {
-  background-color: #fff;
-  box-sizing: border-box;
-}
-
-.seafile-simple-editor .seafile-editor-topbar .editor-btn-group {
-  height: 100%;
-  padding: 5px 0 5px 5px;
-  font-size: 0.75rem;
-  border-right: 1px solid #e5e5e5;
-  color: #555555;
-}
-
-.seafile-simple-editor .header-list-container {
-  border-left: 0;
-}
-
-.seafile-simple-editor .editor {
-  margin: 0;
-  padding: 10px;
-  height: 100%;
-  border: none;
-}
-
-/*set scroll bar*/
-.seafile-simple-editor ::-webkit-scrollbar{
-  width: 8px;
-  height: 8px;
-}
-
-.seafile-simple-editor ::-webkit-scrollbar-button {
-  display: none;
-}
-
-.seafile-simple-editor ::-webkit-scrollbar-thumb {
-  background-color: rgb(206, 206, 212);
-  border-radius: 10px;
-}
-
-.editor-container {
-  /* this container is needed to show the scroll bar */
-  height: 100%;
-  overflow-y: auto;
-  flex: 1 1 auto;
-  position: relative;
-}
-
-.editor {
-  min-height: calc(100% - 40px);
-  background: #fff;
-  padding: 40px 60px;
-  margin: 20px 40px;
-  border: 1px solid rgb(230,230,221);
-  overflow-x: hidden;
-}

package/dist/components/click-outside.js

@@ -1,46 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React from 'react';
-var ClickOutside = /*#__PURE__*/function (_React$Component) {
-  _inherits(ClickOutside, _React$Component);
-  var _super = _createSuper(ClickOutside);
-  function ClickOutside(props) {
-    var _this;
-    _classCallCheck(this, ClickOutside);
-    _this = _super.call(this, props);
-    _this.handleDocumentMouseDown = function () {
-      if (_this.isClickedInside) {
-        _this.isClickedInside = false;
-        return;
-      }
-      _this.props.clickOutside();
-    };
-    _this.handleMouseDown = function (e) {
-      _this.isClickedInside = true;
-    };
-    _this.isClickedInside = false;
-    return _this;
-  }
-  _createClass(ClickOutside, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      document.addEventListener('mousedown', this.handleDocumentMouseDown);
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      document.removeEventListener('mousedown', this.handleDocumentMouseDown);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return React.cloneElement(React.Children.only(this.props.children), {
-        onMouseDownCapture: this.handleMouseDown
-      });
-    }
-  }]);
-  return ClickOutside;
-}(React.Component);
-export default ClickOutside;

package/dist/components/context-menu.js

@@ -1,97 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React from 'react';
-import { withTranslation } from 'react-i18next';
-var ContextMenu = /*#__PURE__*/function (_React$Component) {
-  _inherits(ContextMenu, _React$Component);
-  var _super = _createSuper(ContextMenu);
-  function ContextMenu(props) {
-    var _this;
-    _classCallCheck(this, ContextMenu);
-    _this = _super.call(this, props);
-    _this.setMenuPosition = function () {
-      var menuHeight = _this.menu.offsetHeight;
-      // get height of context menu when the menu is drawing completed in this page
-      if (menuHeight === 0) {
-        requestAnimationFrame(_this.setMenuPosition);
-      }
-      var top = 0;
-      if (_this.position.top + menuHeight > document.body.clientHeight) {
-        top = document.body.clientHeight - menuHeight - 5;
-      } else {
-        top = _this.position.top;
-      }
-      var left = _this.position.left + 3;
-      _this.setState({
-        contextStyle: {
-          top: top,
-          left: left,
-          zIndex: '1071',
-          display: 'block'
-        }
-      });
-    };
-    _this.state = {
-      contextStyle: {}
-    };
-    _this.tableUtils = props.tableUtils;
-    return _this;
-  }
-  _createClass(ContextMenu, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.position = this.props.contextMenuPosition;
-      this.setMenuPosition();
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.menu = null;
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      return /*#__PURE__*/React.createElement("div", {
-        role: 'menu',
-        style: this.state.contextStyle,
-        ref: function ref(_ref) {
-          return _this2.menu = _ref;
-        },
-        className: 'seafile-contextmenu dropdown-menu'
-      }, /*#__PURE__*/React.createElement("button", {
-        onMouseDown: function onMouseDown(event) {
-          return _this2.tableUtils.insertRow('before');
-        },
-        className: 'seafile-contextmenu-item dropdown-item'
-      }, this.props.t('Insert_Row_Before')), /*#__PURE__*/React.createElement("button", {
-        onMouseDown: function onMouseDown(event) {
-          return _this2.tableUtils.insertRow('after');
-        },
-        className: 'seafile-contextmenu-item dropdown-item'
-      }, this.props.t('Insert_Row_After')), /*#__PURE__*/React.createElement("button", {
-        onMouseDown: function onMouseDown(event) {
-          return _this2.tableUtils.insertColumn('before');
-        },
-        className: 'seafile-contextmenu-item dropdown-item'
-      }, this.props.t('Insert_Column_Before')), /*#__PURE__*/React.createElement("button", {
-        onMouseDown: function onMouseDown(event) {
-          return _this2.tableUtils.insertColumn('after');
-        },
-        className: 'seafile-contextmenu-item dropdown-item'
-      }, this.props.t('Insert_Column_After')), /*#__PURE__*/React.createElement("div", {
-        className: 'seafile-divider dropdown-divider'
-      }), /*#__PURE__*/React.createElement("button", {
-        onMouseDown: this.tableUtils.removeRow,
-        className: 'seafile-contextmenu-item dropdown-item'
-      }, this.props.t('Remove_Row')), /*#__PURE__*/React.createElement("button", {
-        onMouseDown: this.tableUtils.removeColumn,
-        className: 'seafile-contextmenu-item dropdown-item'
-      }, this.props.t('Remove_Column')));
-    }
-  }]);
-  return ContextMenu;
-}(React.Component);
-export default withTranslation('seafile-editor')(ContextMenu);

package/dist/components/dialogs/add-formula-dialog.js

@@ -1,116 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React, { Fragment } from 'react';
-import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Input } from 'reactstrap';
-import { withTranslation } from 'react-i18next';
-import { Editor } from 'slate';
-import EditorContext from '../../containers/editor-context';
-var AddFormulaDialog = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(AddFormulaDialog, _React$PureComponent);
-  var _super = _createSuper(AddFormulaDialog);
-  function AddFormulaDialog(props) {
-    var _this;
-    _classCallCheck(this, AddFormulaDialog);
-    _this = _super.call(this, props);
-    _this.setInitialValue = function () {
-      var editor = EditorContext.getEditor();
-      var nodes = Editor.match(editor, editor.selection, {
-        type: 'formula'
-      });
-      if (nodes) {
-        var data = nodes[0].data;
-        _this.setState({
-          formula: data.formula
-        });
-        _this.formulaNode = nodes;
-      }
-    };
-    _this.handleFormulaChange = function (event) {
-      _this.renderFormula(event.target.value);
-      _this.setState({
-        formula: event.target.value
-      });
-    };
-    _this.renderFormula = function (formula) {
-      _this.formulaPreviewer.innerHTML = '';
-      var dom = window.MathJax.tex2svg(formula);
-      _this.formulaPreviewer.appendChild(dom);
-    };
-    _this.handleSubmit = function (event) {
-      event.preventDefault();
-      var formula = _this.state.formula;
-      if (_this.formulaNode) {
-        _this.editorUtils.setFormula({
-          formula: formula,
-          at: _this.formulaNode[1]
-        });
-      } else {
-        _this.editorUtils.addFormula({
-          formula: formula,
-          at: _this.editorSelection
-        });
-      }
-      _this.props.toggleFormulaDialog();
-    };
-    _this.state = {
-      formula: ''
-    };
-    _this.formulaNode = null;
-    _this.editorSelection = null;
-    _this.editorUtils = EditorContext.getEditorUtils();
-    return _this;
-  }
-  _createClass(AddFormulaDialog, [{
-    key: "componentWillMount",
-    value: function componentWillMount() {
-      this.setInitialValue();
-    }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var editor = EditorContext.getEditor();
-      this.editorSelection = editor.selection;
-      if (this.formulaNode) {
-        this.renderFormula(this.state.formula);
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this2 = this;
-      return /*#__PURE__*/React.createElement(Modal, {
-        isOpen: true,
-        toggle: this.props.toggleFormulaDialog,
-        className: this.props.className,
-        returnFocusAfterClose: false
-      }, /*#__PURE__*/React.createElement(ModalHeader, {
-        toggle: this.props.toggleFormulaDialog
-      }, this.props.t('insert_formula')), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
-        className: "form-group"
-      }, /*#__PURE__*/React.createElement("label", {
-        className: "form-check-label"
-      }, this.props.t('formula')), /*#__PURE__*/React.createElement(Input, {
-        type: "textarea",
-        className: "form-control",
-        value: this.state.formula,
-        onChange: this.handleFormulaChange
-      })), /*#__PURE__*/React.createElement("div", {
-        ref: function ref(_ref) {
-          return _this2.formulaPreviewer = _ref;
-        },
-        className: "formula-preview"
-      }))), /*#__PURE__*/React.createElement(ModalFooter, null, /*#__PURE__*/React.createElement(Button, {
-        color: "secondary",
-        onClick: this.props.toggleFormulaDialog
-      }, this.props.t('cancel')), /*#__PURE__*/React.createElement(Button, {
-        color: "primary",
-        disabled: false,
-        onClick: this.handleSubmit
-      }, this.props.t('insert_formula'))));
-    }
-  }]);
-  return AddFormulaDialog;
-}(React.PureComponent);
-export default withTranslation('seafile-editor')(AddFormulaDialog);

package/dist/components/dialogs/add-image-dialog.js

@@ -1,69 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React from 'react';
-import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Form, FormGroup, Label, Input } from 'reactstrap';
-import { withTranslation } from 'react-i18next';
-import EditorContext from '../../containers/editor-context';
-var AddImageDialog = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(AddImageDialog, _React$PureComponent);
-  var _super = _createSuper(AddImageDialog);
-  function AddImageDialog(props) {
-    var _this;
-    _classCallCheck(this, AddImageDialog);
-    _this = _super.call(this, props);
-    _this.handleUrlChange = function (event) {
-      _this.setState({
-        url: event.target.value
-      });
-    };
-    _this.handleSubmit = function (event) {
-      _this.props.insertImage({
-        url: _this.state.url,
-        selection: _this.editorSelection
-      });
-      _this.props.onToggleImageDialog();
-    };
-    _this.state = {
-      url: ''
-    };
-    _this.editorSelection = null;
-    return _this;
-  }
-  _createClass(AddImageDialog, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var editor = EditorContext.getEditor();
-      this.editorSelection = editor.selection;
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/React.createElement(Modal, {
-        isOpen: true,
-        toggle: this.props.onToggleImageDialog,
-        className: this.props.className,
-        zIndex: 1071
-      }, /*#__PURE__*/React.createElement(ModalHeader, {
-        toggle: this.props.onToggleImageDialog
-      }, this.props.t('insert_image')), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Form, null, /*#__PURE__*/React.createElement(FormGroup, null, /*#__PURE__*/React.createElement(Label, {
-        for: "columnName"
-      }, this.props.t('image_address')), /*#__PURE__*/React.createElement(Input, {
-        id: "columnName",
-        value: this.state.value,
-        onChange: this.handleUrlChange,
-        autoFocus: true
-      })))), /*#__PURE__*/React.createElement(ModalFooter, null, /*#__PURE__*/React.createElement(Button, {
-        color: "secondary",
-        onClick: this.props.onToggleImageDialog
-      }, this.props.t('cancel')), /*#__PURE__*/React.createElement(Button, {
-        color: "primary",
-        disabled: this.state.url.length === 0,
-        onClick: this.handleSubmit
-      }, this.props.t('submit')), ' '));
-    }
-  }]);
-  return AddImageDialog;
-}(React.PureComponent);
-export default withTranslation('seafile-editor')(AddImageDialog);

package/dist/components/dialogs/add-link-dialog.js

@@ -1,133 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React, { Fragment } from 'react';
-import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
-import { withTranslation } from 'react-i18next';
-import EditorContext from '../../containers/editor-context';
-var AddLinkDialog = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(AddLinkDialog, _React$PureComponent);
-  var _super = _createSuper(AddLinkDialog);
-  function AddLinkDialog(props) {
-    var _this;
-    _classCallCheck(this, AddLinkDialog);
-    _this = _super.call(this, props);
-    _this.setInitialValue = function () {
-      var text = _this.editorUtils.getSelectedText();
-      if (_this.isLinkActive) {
-        var linkNode = _this.editorUtils.getCurrentLinkNode();
-        _this.setState({
-          title: _this.editorUtils.getLinkText(linkNode),
-          url: linkNode.data.href
-        });
-      } else {
-        _this.setState({
-          title: text,
-          url: ''
-        });
-      }
-    };
-    _this.handleUrlChange = function (event) {
-      _this.setState({
-        url: event.target.value
-      });
-    };
-    _this.handleTitleChange = function (event) {
-      _this.setState({
-        title: event.target.value
-      });
-    };
-    _this.handleSubmit = function (event) {
-      event.preventDefault();
-      if (_this.state.title.length === 0 || _this.state.url.length === 0) return;
-      if (!_this.isLinkActive) {
-        _this.editorUtils.insertLink({
-          text: _this.state.title,
-          url: _this.state.url,
-          selection: _this.editorSelection
-        });
-      } else {
-        _this.editorUtils.setLink({
-          text: _this.state.title,
-          url: _this.state.url,
-          selection: _this.editorSelection
-        });
-      }
-      _this.props.toggleLinkDialog();
-    };
-    _this.onKeyDown = function (e) {
-      if (e.keyCode === 13) {
-        _this.handleSubmit(e);
-      }
-    };
-    _this.editorUtils = EditorContext.getEditorUtils();
-    _this.isLinkActive = _this.editorUtils.isLinkActive();
-    _this.editorSelection = null;
-    _this.state = {
-      url: '',
-      title: ''
-    };
-    return _this;
-  }
-  _createClass(AddLinkDialog, [{
-    key: "componentWillMount",
-    value: function componentWillMount() {
-      this.setInitialValue();
-    }
-  }, {
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      var editor = EditorContext.getEditor();
-      this.editorSelection = editor.selection;
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/React.createElement(Modal, {
-        isOpen: true,
-        autoFocus: false,
-        toggle: this.props.toggleLinkDialog,
-        className: this.props.className,
-        zIndex: 1071,
-        returnFocusAfterClose: false
-      }, /*#__PURE__*/React.createElement(ModalHeader, {
-        toggle: this.props.toggleLinkDialog
-      }, this.props.t('insert_link')), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
-        className: "form-group"
-      }, /*#__PURE__*/React.createElement("label", {
-        className: "form-check-label",
-        htmlFor: "addLink"
-      }, this.props.t('link_address')), /*#__PURE__*/React.createElement("input", {
-        onKeyDown: this.onKeyDown,
-        autoFocus: true,
-        type: "url",
-        className: "form-control",
-        id: "addLink",
-        value: this.state.url,
-        onChange: this.handleUrlChange
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "form-group"
-      }, /*#__PURE__*/React.createElement("label", {
-        className: "form-check-label",
-        htmlFor: "addTitle"
-      }, this.props.t('link_title')), /*#__PURE__*/React.createElement("input", {
-        onKeyDown: this.onKeyDown,
-        type: "text",
-        className: "form-control",
-        id: "addTitle",
-        value: this.state.title,
-        onChange: this.handleTitleChange
-      })))), /*#__PURE__*/React.createElement(ModalFooter, null, /*#__PURE__*/React.createElement(Button, {
-        color: "secondary",
-        onClick: this.props.toggleLinkDialog
-      }, this.props.t('cancel')), /*#__PURE__*/React.createElement(Button, {
-        color: "primary",
-        disabled: false,
-        onClick: this.handleSubmit
-      }, this.props.t('add_link'))));
-    }
-  }]);
-  return AddLinkDialog;
-}(React.PureComponent);
-export default withTranslation('seafile-editor')(AddLinkDialog);

package/dist/components/dialogs/comment-dialog.js

@@ -1,97 +0,0 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React from 'react';
-import { withTranslation } from 'react-i18next';
-import { Button } from 'reactstrap';
-import { processor } from '../../utils/seafile-markdown2html';
-import '../../assets/css/comment-dialog.css';
-var CommentDialog = /*#__PURE__*/function (_React$Component) {
-  _inherits(CommentDialog, _React$Component);
-  var _super = _createSuper(CommentDialog);
-  function CommentDialog(props) {
-    var _this;
-    _classCallCheck(this, CommentDialog);
-    _this = _super.call(this, props);
-    _this.handleCommentChange = function (event) {
-      var comment = event.target.value;
-      _this.setState({
-        comment: comment
-      });
-    };
-    _this.submitComment = function () {
-      var comment = _this.state.comment.trim();
-      if (comment.length > 0 && _this.props.quote.length > 0) {
-        var detail = {
-          quote: _this.props.quote,
-          position: _this.props.commentPosition
-        };
-        var detailJSON = JSON.stringify(detail);
-        _this.props.editorApi.postComment(comment, detailJSON).then(function (res) {
-          _this.props.onCommentAdded();
-        });
-      }
-    };
-    _this.setQuoteText = function (mdQuote) {
-      processor.process(mdQuote).then(function (result) {
-        var quote = String(result);
-        _this.setState({
-          quote: quote
-        });
-      });
-    };
-    _this.state = {
-      comment: '',
-      quote: ''
-    };
-    return _this;
-  }
-  _createClass(CommentDialog, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.setQuoteText(this.props.quote);
-    }
-  }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
-      if (this.props.quote !== nextProps.quote) {
-        this.setQuoteText(nextProps.quote);
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var t = this.props.t;
-      var _this$state = this.state,
-        comment = _this$state.comment,
-        quote = _this$state.quote;
-      return /*#__PURE__*/React.createElement("div", {
-        className: "seafile-editor-comment comment-dialog"
-      }, /*#__PURE__*/React.createElement("div", null, this.props.editorApi.name), /*#__PURE__*/React.createElement("blockquote", {
-        className: "comment-dialog-quote"
-      }, /*#__PURE__*/React.createElement("div", {
-        dangerouslySetInnerHTML: {
-          __html: quote
-        }
-      })), /*#__PURE__*/React.createElement("textarea", {
-        value: comment,
-        onChange: this.handleCommentChange
-      }), /*#__PURE__*/React.createElement("div", {
-        className: "button-group"
-      }, /*#__PURE__*/React.createElement(Button, {
-        size: "sm",
-        color: "primary",
-        onClick: this.submitComment
-      }, t('submit')), /*#__PURE__*/React.createElement(Button, {
-        size: "sm",
-        color: "secondary",
-        onClick: this.props.toggleCommentDialog
-      }, t('cancel'))), /*#__PURE__*/React.createElement("span", {
-        className: "comment-dialog-triangle"
-      }));
-    }
-  }]);
-  return CommentDialog;
-}(React.Component);
-export default withTranslation('seafile-editor')(CommentDialog);