@seafile/seafile-editor 2.0.19 → 2.0.20-beta

package/dist/extension/toolbar/header-toolbar/insert-toolbar/index.js

@@ -0,0 +1,100 @@
+"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 _reactI18next = require("react-i18next");
+var _reactstrap = require("reactstrap");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _tooltip = _interopRequireDefault(require("../../../commons/tooltip"));
+var _menu = _interopRequireDefault(require("../../../plugins/image/menu"));
+var _menu2 = _interopRequireDefault(require("../../../plugins/table/menu"));
+var _menu3 = _interopRequireDefault(require("../../../plugins/code-block/menu"));
+var _menu4 = _interopRequireDefault(require("../../../plugins/formula/menu"));
+var _menu5 = _interopRequireDefault(require("../../../plugins/column/menu"));
+var _constants = require("../../../../constants");
+require("./style.css");
+const InsertToolbar = _ref => {
+  let {
+    isRichEditor = true,
+    className = 'menu-group-item',
+    editor,
+    readonly,
+    isSupportFormula,
+    isSupportColumn
+  } = _ref;
+  const [isShowMenu, setMenuShow] = (0, _react.useState)(false);
+  const {
+    t
+  } = (0, _reactI18next.useTranslation)(_constants.TRANSLATE_NAMESPACE);
+  const popoverRef = (0, _react.useRef)(null);
+  const disabled = readonly;
+  const insertButtonRef = (0, _react.useRef)(null);
+  const insertToolbarId = 'sf-insert-toolbar-btn';
+  const toggle = (0, _react.useCallback)(event => {
+    var _event$target;
+    if (event !== null && event !== void 0 && event.target && (event === null || event === void 0 ? void 0 : (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.tagName) === 'INPUT') {
+      return;
+    }
+    popoverRef.current && popoverRef.current.toggle();
+    setMenuShow(!isShowMenu);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isShowMenu]);
+  const validClassName = (0, _classnames.default)(className, 'sf-menu-with-dropdown sf-insert-toolbar-btn', {
+    'menu-show': isShowMenu,
+    'disabled': disabled,
+    'rich-icon-btn d-flex': isRichEditor,
+    'rich-icon-btn-disabled': isRichEditor && disabled,
+    'rich-icon-btn-hover': isRichEditor && !disabled,
+    'btn btn-icon btn-secondary btn-active d-flex': !isRichEditor
+  });
+  const caretIconClass = `sf-menu-with-dropdown-triangle-icon iconfont icon-${isShowMenu ? 'caret-up' : 'drop-down'}`;
+  const {
+    bottom
+  } = insertButtonRef.current ? insertButtonRef.current.getBoundingClientRect() : {
+    bottom: 92.5
+  };
+  const props = {
+    editor,
+    readonly,
+    toggle
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("button", {
+    type: "button",
+    className: validClassName,
+    id: insertToolbarId,
+    disabled: disabled,
+    ref: insertButtonRef
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "sf-menu-with-dropdown-icon"
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "iconfont icon-sdoc-insert mr-1"
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: "text-truncate"
+  }, t('Insert'))), /*#__PURE__*/_react.default.createElement("div", {
+    className: "sf-menu-with-dropdown-triangle"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: caretIconClass
+  }))), /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+    target: insertToolbarId
+  }, t('Insert')), !disabled && /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledPopover, {
+    target: insertToolbarId,
+    className: "sf-menu-popover sf-dropdown-menu sf-insert-menu-popover",
+    trigger: "legacy",
+    placement: "bottom-start",
+    hideArrow: true,
+    toggle: toggle,
+    fade: false,
+    ref: popoverRef
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "sf-insert-menu-container sf-dropdown-menu-container",
+    style: {
+      maxHeight: window.innerHeight - bottom - 100
+    }
+  }, /*#__PURE__*/_react.default.createElement(_menu.default, props), /*#__PURE__*/_react.default.createElement(_menu2.default, props), /*#__PURE__*/_react.default.createElement(_menu3.default, props), isSupportFormula && /*#__PURE__*/_react.default.createElement(_menu4.default, props), isSupportColumn && /*#__PURE__*/_react.default.createElement(_menu5.default, props))));
+};
+var _default = exports.default = InsertToolbar;

package/dist/extension/toolbar/header-toolbar/insert-toolbar/style.css

@@ -0,0 +1,47 @@
+.menu-group-item.sf-insert-toolbar-btn {
+  width: 76px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background-color: transparent;
+  color: #444
+}
+
+.menu-group-item.sf-insert-toolbar-btn:not(.disable):hover {
+  background-color: #F2F2F2;
+}
+
+.menu-group-item.sf-insert-toolbar-btn.disabled {
+  /* 64: 76 - 12 */
+  width: 64px !important;
+  color: #BDBDBD;
+}
+
+.sf-insert-toolbar-btn .sf-menu-with-dropdown-icon {
+  flex: 1;
+  justify-content: flex-start;
+  padding-left: 6px;
+  padding-right: 2px;
+  font-size: 14px;
+}
+
+.sf-insert-menu-popover .popover {
+  min-width: 200px;
+  z-index: 1070;
+}
+
+.sf-insert-menu-popover .sf-insert-menu-container {
+  padding: 8px 0;
+}
+
+.menu-group-item.sf-menu-with-dropdown {
+  border: 0!important;
+  height: 24px;
+  margin-right: 10px;
+  overflow: hidden;
+  padding: 0!important;
+}
+
+.menu-group-item.sf-insert-toolbar-btn .iconfont {
+  font-size: 12px;
+}

package/dist/extension/toolbar/inline-toolbar/index.css

@@ -38,3 +38,7 @@
 .sf-slate-editor-toolbar .sf-slate-article-info-control .iconfont {
   font-size: 13px;
 }
+
+.sf-long-text-inline-editor-container .sf-header-menu .sf-header-popover {
+  min-width: 145px;
+}

package/dist/extension/toolbar/inline-toolbar/index.js

@@ -14,20 +14,13 @@ var _menu2 = _interopRequireDefault(require("../../plugins/header/menu"));
 var _menu3 = _interopRequireDefault(require("../../plugins/text-style/menu"));
 var _menu4 = _interopRequireDefault(require("../../plugins/link/menu"));
 var _constants = require("../../constants");
-var _menu5 = _interopRequireDefault(require("../../plugins/image/menu"));
-var _menu6 = _interopRequireDefault(require("../../plugins/code-block/menu"));
-var _menu7 = _interopRequireDefault(require("../../plugins/check-list/menu"));
-var _menu8 = _interopRequireDefault(require("../../plugins/list/menu"));
+var _menu5 = _interopRequireDefault(require("../../plugins/check-list/menu"));
+var _menu6 = _interopRequireDefault(require("../../plugins/list/menu"));
 var _elementTypes = require("../../constants/element-types");
-var _tableOperator = require("../../plugins/table/menu/table-operator");
-var _helper = require("../../plugins/table/helper");
-var _menu9 = _interopRequireDefault(require("../../plugins/clear-format/menu"));
+var _menu7 = _interopRequireDefault(require("../../plugins/clear-format/menu"));
 var _shortcutDialog = _interopRequireDefault(require("../user-help/shortcut-dialog"));
+var _insertToolbar = _interopRequireDefault(require("../header-toolbar/insert-toolbar"));
 require("./index.css");
-// import TableMenu from '../../plugins/table/menu';
-// import FormulaMenu from '../../plugins/formula/menu';
-// import ColumnMenu from '../../plugins/column/menu';
-
 const InlineToolbar = _ref => {
   let {
     editor,
@@ -39,9 +32,6 @@ const InlineToolbar = _ref => {
     onExpandEditorToggle
   } = _ref;
   (0, _useSelectionUpdate.default)();
-
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const isShowSubTableMenu = (0, _react.useMemo)(() => (0, _helper.isInTable)(editor), [editor.selection]);
   const [isShowHelpModal, setIsShowHelpModal] = (0, _react.useState)(false);
   const onHelpIconToggle = (0, _react.useCallback)(() => {
     setIsShowHelpModal(!isShowHelpModal);
@@ -53,22 +43,25 @@ const InlineToolbar = _ref => {
   };
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "sf-slate-editor-toolbar"
-  }, isRichEditor && /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu2.default, commonProps)), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu3.default, Object.assign({}, commonProps, {
+  }, isRichEditor && /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_insertToolbar.default, {
+    editor: editor,
+    readonly: readonly,
+    isSupportFormula: isSupportFormula,
+    isSupportColumn: isSupportColumn
+  })), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu2.default, commonProps)), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu3.default, Object.assign({}, commonProps, {
+    type: _constants.TEXT_STYLE_MAP.ITALIC
+  })), /*#__PURE__*/_react.default.createElement(_menu3.default, Object.assign({}, commonProps, {
     type: _constants.TEXT_STYLE_MAP.BOLD
   })), /*#__PURE__*/_react.default.createElement(_menu3.default, Object.assign({}, commonProps, {
-    type: _constants.TEXT_STYLE_MAP.ITALIC
+    type: _constants.TEXT_STYLE_MAP.UNDERLINE
   })), /*#__PURE__*/_react.default.createElement(_menu3.default, Object.assign({}, commonProps, {
     type: _constants.TEXT_STYLE_MAP.CODE
-  })), /*#__PURE__*/_react.default.createElement(_menu4.default, commonProps)), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu.default, commonProps), /*#__PURE__*/_react.default.createElement(_menu7.default, commonProps), /*#__PURE__*/_react.default.createElement(_menu8.default, Object.assign({}, commonProps, {
+  })), /*#__PURE__*/_react.default.createElement(_menu4.default, commonProps)), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu.default, commonProps), /*#__PURE__*/_react.default.createElement(_menu5.default, commonProps), /*#__PURE__*/_react.default.createElement(_menu6.default, Object.assign({}, commonProps, {
     type: _elementTypes.ORDERED_LIST
-  })), /*#__PURE__*/_react.default.createElement(_menu8.default, Object.assign({}, commonProps, {
+  })), /*#__PURE__*/_react.default.createElement(_menu6.default, Object.assign({}, commonProps, {
     type: _elementTypes.UNORDERED_LIST
-  }))), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu6.default, commonProps), /*#__PURE__*/_react.default.createElement(_commons.MoreMenu, commonProps, /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu5.default, Object.assign({}, commonProps, {
-    isSupportInsertSeafileImage: isSupportInsertSeafileImage
-  }))), isShowSubTableMenu && /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, {
-    className: "sf-menu-group sf-table-operations-group"
-  }, /*#__PURE__*/_react.default.createElement(_tableOperator.AlignmentDropDown, commonProps), /*#__PURE__*/_react.default.createElement(_tableOperator.ColumnOperationDropDownList, commonProps), /*#__PURE__*/_react.default.createElement(_tableOperator.RowOperationDropDownList, commonProps), /*#__PURE__*/_react.default.createElement(_tableOperator.RemoveTableMenu, commonProps)), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu9.default, commonProps)), !isRichEditor && /*#__PURE__*/_react.default.createElement("div", {
-    className: "sf-slate-help-info-control",
+  }))), /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_commons.MoreMenu, commonProps, /*#__PURE__*/_react.default.createElement(_commons.MenuGroup, null, /*#__PURE__*/_react.default.createElement(_menu7.default, commonProps)), !isRichEditor && /*#__PURE__*/_react.default.createElement("div", {
+    className: "sf-menu-group-item sf-slate-help-info-control",
     onClick: onHelpIconToggle
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "iconfont icon-use-help"

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

@@ -8,6 +8,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _isHotkey = _interopRequireDefault(require("is-hotkey"));
+var _eventBus = _interopRequireDefault(require("../../utils/event-bus"));
+var _eventTypes = require("../../constants/event-types");
 const FallbackEditor = _ref => {
   let {
     enableEdit,
@@ -24,6 +26,18 @@ const FallbackEditor = _ref => {
       setTimeout(() => inputRef.current.focus());
     }
   }, [enableEdit]);
+  const handleClear = (0, _react.useCallback)(() => {
+    setValue('');
+    inputRef.current.focus();
+  }, []);
+  (0, _react.useEffect)(() => {
+    const eventBus = _eventBus.default.getInstance();
+    const clearSubscribe = eventBus.subscribe(_eventTypes.EXTERNAL_EVENTS.CLEAR_ARTICLE, handleClear);
+    return () => {
+      clearSubscribe();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   const onChange = (0, _react.useCallback)(event => {
     const newValue = event.target.value;
     if (newValue === value) return;

package/package.json

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

package/public/locales/en/seafile-editor.json

@@ -230,5 +230,10 @@
   "Insert_on_the_right": "Insert on the right",
   "Insert_on_the_left": "Insert on the left",
   "Row(s)": "row(s)",
-  "Column(s)": "column(s)"
+  "Column(s)": "column(s)",
+  "Insert": "Insert",
+  "Horizontal_align": "Horizontal align",
+  "Underline": "Underline",
+  "Row_number": "Row number",
+  "Column_number": "Column number"
 }

package/public/locales/zh-CN/seafile-editor.json

@@ -230,5 +230,10 @@
   "Insert_on_the_right": "在右侧插入",
   "Insert_on_the_left": "在左侧插入",
   "Row(s)": "行",
-  "Column(s)": "列"
+  "Column(s)": "列",
+  "Insert": "插入",
+  "Horizontal_align": "水平对齐",
+  "Underline": "下划线",
+  "Row_number": "行数",
+  "Column_number": "列数"
 }

package/public/locales/zh_CN/seafile-editor.json

@@ -230,5 +230,10 @@
   "Insert_on_the_right": "在右侧插入",
   "Insert_on_the_left": "在左侧插入",
   "Row(s)": "行",
-  "Column(s)": "列"
+  "Column(s)": "列",
+  "Insert": "插入",
+  "Horizontal_align": "水平对齐",
+  "Underline": "下划线",
+  "Row_number": "行数",
+  "Column_number": "列数"
 }