@seafile/seafile-editor 1.0.88 → 1.0.90

package/dist/constants/event-types.js

@@ -10,7 +10,8 @@ const INTERNAL_EVENTS = exports.INTERNAL_EVENTS = {
   ON_OPEN_LINK_MODAL: 'on_open_link_modal',
   ON_CLOSE_LINK_POPOVER: 'on_close_link_popover',
   ON_OPEN_FORMULA_DIALOG: 'on_open_formula_dialog',
-  ON_SELECT_ALL_CELL: 'on_select_all_cell'
+  ON_SELECT_ALL_CELL: 'on_select_all_cell',
+  ON_TOGGLE_IMAGE_POPOVER: 'on_toggle_image_popover'
 };
 const EXTERNAL_EVENTS = exports.EXTERNAL_EVENTS = {
   ON_HELP_INFO_TOGGLE: 'on_help_info_toggle',

package/dist/extension/commons/more-menu/index.js

@@ -1,14 +1,17 @@
 "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 = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactstrap = require("reactstrap");
 var _constants = require("../../constants");
+var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
+var _eventTypes = require("../../../constants/event-types");
 require("./index.css");
 const MoreMenu = _ref => {
   let {
@@ -17,6 +20,8 @@ const MoreMenu = _ref => {
     isRichEditor,
     children
   } = _ref;
+  const popoverRef = (0, _react.useRef)(null);
+  const imagePopoverRef = (0, _react.useRef)(false);
   const validClassName = (0, _classnames.default)(className, {
     'sf-rich-editor': isRichEditor,
     'sf-icon-btn': true,
@@ -24,6 +29,20 @@ const MoreMenu = _ref => {
     'sf-icon-btn-hover': !disabled
   });
   const config = _constants.MENUS_CONFIG_MAP[_constants.MORE_OPERATION];
+  const toggle = (0, _react.useCallback)(() => {
+    if (imagePopoverRef.current) return;
+    popoverRef.current.toggle();
+  }, []);
+  const toggleImagePopover = (0, _react.useCallback)(isPopoverShow => {
+    imagePopoverRef.current = isPopoverShow;
+  }, []);
+  (0, _react.useEffect)(() => {
+    const eventBus = _eventBus.default.getInstance();
+    const unsubscribe = eventBus.subscribe(_eventTypes.INTERNAL_EVENTS.ON_TOGGLE_IMAGE_POPOVER, toggleImagePopover);
+    return () => unsubscribe();
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("button", {
     className: validClassName,
     type: "button",
@@ -36,7 +55,9 @@ const MoreMenu = _ref => {
     trigger: "legacy",
     placement: "bottom-end",
     hideArrow: true,
-    fade: false
+    fade: false,
+    toggle: toggle,
+    ref: popoverRef
   }, children));
 };
 MoreMenu.defaultProps = {

package/dist/extension/plugins/image/helper.js

@@ -36,6 +36,7 @@ const insertImage = (editor, url, title) => {
     at: editor.selection,
     select: true
   });
+  (0, _core.focusEditor)(editor);
 };
 exports.insertImage = insertImage;
 const insertSeafileImage = _ref => {

package/dist/extension/plugins/image/menu/image-menu-popover.js

@@ -12,7 +12,6 @@ var _imageMenuDialog = _interopRequireDefault(require("./image-menu-dialog"));
 var _eventBus = _interopRequireDefault(require("../../../../utils/event-bus"));
 var _eventTypes = require("../../../../constants/event-types");
 var _helper = require("../helper");
-var _core = require("../../../core");
 var _constants = require("../../../../constants");
 require("./style.css");
 const ImageMenuPopover = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
@@ -39,7 +38,6 @@ const ImageMenuPopover = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
     const file = e.target.files[0];
     (0, _helper.handleUpdateImage)(editor, file);
     handelClosePopover();
-    (0, _core.focusEditor)(editor);
   }, [editor, handelClosePopover]);
   const onToggleImageDialog = (0, _react.useCallback)(() => {
     setIsShowInternetImageModal(false);

package/dist/extension/plugins/image/menu/index.js

@@ -9,6 +9,8 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _elementTypes = require("../../../constants/element-types");
 var _menusConfig = require("../../../constants/menus-config");
+var _eventBus = _interopRequireDefault(require("../../../../utils/event-bus"));
+var _eventTypes = require("../../../../constants/event-types");
 var _helper = require("../helper");
 var _commons = require("../../../commons");
 var _imageMenuPopover = _interopRequireDefault(require("./image-menu-popover"));
@@ -31,6 +33,10 @@ const ImageMenu = _ref => {
     }
     setIsShowImagePopover(false);
     unregisterEventHandler();
+    setTimeout(() => {
+      const eventBus = _eventBus.default.getInstance();
+      eventBus.dispatch(_eventTypes.INTERNAL_EVENTS.ON_TOGGLE_IMAGE_POPOVER, false);
+    }, 150);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   const registerEventHandler = (0, _react.useCallback)(() => {
@@ -43,6 +49,7 @@ const ImageMenu = _ref => {
     e.stopPropagation();
     e.nativeEvent.stopImmediatePropagation();
     const state = !isShowImagePopover;
+    const eventBus = _eventBus.default.getInstance();
     if (state) {
       setIsShowImagePopover(state);
       registerEventHandler();
@@ -50,6 +57,7 @@ const ImageMenu = _ref => {
       setIsShowImagePopover(state);
       unregisterEventHandler();
     }
+    eventBus.dispatch(_eventTypes.INTERNAL_EVENTS.ON_TOGGLE_IMAGE_POPOVER, state);
   }, [isShowImagePopover, registerEventHandler, unregisterEventHandler]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_commons.MenuItem, Object.assign({
     type: Image,

package/dist/extension/plugins/image/plugin.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _constants = require("../../constants");
 var _elementTypes = require("../../constants/element-types");
-var _core = require("../../core");
 var _helper = require("./helper");
 const withImages = editor => {
   const {
@@ -33,7 +32,6 @@ const withImages = editor => {
     if (data.types && data.types.includes('Files') && data.files[0].type.includes(_elementTypes.IMAGE)) {
       const file = data.files[0];
       (0, _helper.handleUpdateImage)(newEditor, file);
-      (0, _core.focusEditor)(newEditor);
       return;
     }
     return insertData(data);

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

@@ -64,3 +64,32 @@
 .sf-long-text-inline-editor-container .article>div>:first-child {
   margin-top: 0;
 }
+
+.sf-long-text-inline-editor-container .sf-image-wrapper .full-screen {
+  align-items: center;
+  background-color: #00000080;
+  border: none;
+  border-radius: 3px;
+  box-shadow: none;
+  display: flex;
+  height: 28px;
+  justify-content: center;
+  line-height: 28px;
+  padding: 0;
+  position: absolute;
+  right: 10px;
+  top: 10px;
+  -webkit-user-select: none !important;
+  user-select: none !important;
+  width: 28px;
+  z-index: 1000;
+}
+
+.sf-long-text-inline-editor-container .sf-image-wrapper .full-screen:hover {
+  background-color: #00000080;
+  display: flex;
+}
+
+.sf-long-text-inline-editor-container .sf-image-wrapper .full-screen .iconfont {
+  color: #fff;
+}

package/package.json

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