@seafile/sdoc-editor 3.0.130 → 3.0.132

package/dist/extension/plugins/embed-link/constants.js

@@ -3,8 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EMBED_LINK_SOURCE = void 0;
+exports.MIN_EMBED_LINK_HEIGHT = exports.MAX_EMBED_LINK_HEIGHT = exports.EMBED_LINK_SOURCE = exports.DEFAULT_EMBED_LINK_HEIGHT = void 0;
 var EMBED_LINK_SOURCE = exports.EMBED_LINK_SOURCE = {
   SEATABLE: 'seatable',
   FIGMA: 'figma'
-};
+};
+var DEFAULT_EMBED_LINK_HEIGHT = exports.DEFAULT_EMBED_LINK_HEIGHT = 300;
+var MIN_EMBED_LINK_HEIGHT = exports.MIN_EMBED_LINK_HEIGHT = 300;
+var MAX_EMBED_LINK_HEIGHT = exports.MAX_EMBED_LINK_HEIGHT = 550;

package/dist/extension/plugins/embed-link/helper.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.normalizeFigmaEmbedLink = exports.isInsertEmbedLinkDisabled = exports.insertEmbedLink = exports.getEmbedLinkType = exports.generateEmbedLinkNode = void 0;
+exports.updateEmbedLink = exports.normalizeFigmaEmbedLink = exports.isInsertEmbedLinkDisabled = exports.insertEmbedLink = exports.getEmbedLinkType = exports.generateEmbedLinkNode = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _slate = require("@seafile/slate");
 var _slateReact = require("@seafile/slate-react");
@@ -131,4 +131,15 @@ var insertEmbedLink = exports.insertEmbedLink = function insertEmbedLink(editor,
     (0, _core.focusEditor)(editor, range);
     return;
   }
+};
+var updateEmbedLink = exports.updateEmbedLink = function updateEmbedLink(editor, data) {
+  _slate.Transforms.setNodes(editor, {
+    data: data
+  }, {
+    match: function match(n) {
+      return (0, _core.getNodeType)(n) === _elementType.EMBED_LINK;
+    },
+    at: editor.selection,
+    voids: true
+  });
 };

package/dist/extension/plugins/embed-link/index.css

@@ -1,9 +1,8 @@
 .sdoc-embed-link-container {
   position: relative;
-  width: 100%;
-  height: 300px;
   border: 1px solid #ccc;
   margin: 5px 0;
+  width: 100%;
 }
 
 .sdoc-embed-link-container.isSelected {
@@ -40,6 +39,11 @@
   z-index: 1;
 }
 
+.sdoc-embed-link-container.isSelected .image-resizer {
+  z-index: 1;
+  cursor: ns-resize;
+}
+
 .embed-link-zoom-out-container {
   position: fixed;
   inset: 0;

package/dist/extension/plugins/embed-link/render-elem.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.renderEmbedLink = renderEmbedLink;
 var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/createForOfIteratorHelper"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
@@ -23,13 +24,18 @@ var _helper = require("./helper");
 var _hoverMenu = _interopRequireDefault(require("./hover-menu"));
 require("./index.css");
 var EmbedLink = function EmbedLink(_ref) {
+  var _element$data2;
   var editor = _ref.editor,
     element = _ref.element;
   var EmbedLinkRef = (0, _react.useRef)();
+  var embedLinkContainerRef = (0, _react.useRef)(null);
   var fullscreenRef = (0, _react.useRef)();
   var scrollRef = (0, _useScrollContext.useScrollContext)();
   var isSelected = (0, _slateReact.useSelected)();
   var readOnly = (0, _slateReact.useReadOnly)();
+  var resizerRef = (0, _react.useRef)(null);
+  var resizeStartYRef = (0, _react.useRef)(0);
+  var resizeStartHeightRef = (0, _react.useRef)(0);
   var _useTranslation = (0, _reactI18next.useTranslation)('sdoc-editor'),
     t = _useTranslation.t;
   var _useState = (0, _react.useState)({
@@ -43,6 +49,14 @@ var EmbedLink = function EmbedLink(_ref) {
     _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
     isShowZoomOut = _useState4[0],
     setIsShowZoomOut = _useState4[1];
+  var _useState5 = (0, _react.useState)(null),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    movingHeight = _useState6[0],
+    setMovingHeight = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+    isResizing = _useState8[0],
+    setIsResizing = _useState8[1];
   var originalLink = element.link,
     link_type = element.link_type;
   var link = originalLink;
@@ -52,6 +66,76 @@ var EmbedLink = function EmbedLink(_ref) {
   var isValidUrl = (0, _react.useMemo)(function () {
     return (0, _isUrl["default"])(link);
   }, [link]);
+  var registerEvent = (0, _react.useCallback)(function (eventList) {
+    eventList.forEach(function (element) {
+      document.addEventListener(element.eventName, element.event);
+    });
+  }, []);
+  var getEmbedLinkHeight = (0, _react.useCallback)(function () {
+    var _element$data;
+    var height = movingHeight !== null && movingHeight !== void 0 ? movingHeight : element === null || element === void 0 ? void 0 : (_element$data = element.data) === null || _element$data === void 0 ? void 0 : _element$data.height;
+    var parsedHeight = Number(height);
+    if (parsedHeight > 0) {
+      return Math.min(Math.max(parsedHeight, _constants.MIN_EMBED_LINK_HEIGHT), _constants.MAX_EMBED_LINK_HEIGHT);
+    }
+    return _constants.DEFAULT_EMBED_LINK_HEIGHT;
+  }, [element === null || element === void 0 ? void 0 : (_element$data2 = element.data) === null || _element$data2 === void 0 ? void 0 : _element$data2.height, movingHeight]);
+  var onMouseMove = (0, _react.useCallback)(function (event) {
+    event.preventDefault();
+    event.stopPropagation();
+    var changeY = event.clientY - resizeStartYRef.current;
+    var embedLinkHeight = resizeStartHeightRef.current + changeY;
+    embedLinkHeight = Math.min(Math.max(embedLinkHeight, _constants.MIN_EMBED_LINK_HEIGHT), _constants.MAX_EMBED_LINK_HEIGHT);
+    if (embedLinkContainerRef.current) {
+      embedLinkContainerRef.current.style.height = "".concat(embedLinkHeight, "px");
+    }
+    setMovingHeight(embedLinkHeight);
+  }, []);
+  var onResizeEnd = (0, _react.useCallback)(function (event) {
+    var _ref2, _embedLinkContainerRe;
+    event.preventDefault();
+    event.stopPropagation();
+    unregisterEvent([{
+      'eventName': 'mousemove',
+      'event': onMouseMove
+    }, {
+      'eventName': 'mouseup',
+      'event': onResizeEnd
+    }]);
+    var resolvedHeight = (_ref2 = movingHeight !== null && movingHeight !== void 0 ? movingHeight : (_embedLinkContainerRe = embedLinkContainerRef.current) === null || _embedLinkContainerRe === void 0 ? void 0 : _embedLinkContainerRe.getBoundingClientRect().height) !== null && _ref2 !== void 0 ? _ref2 : getEmbedLinkHeight();
+    var finalHeight = Math.min(Math.max(Number(resolvedHeight) || _constants.DEFAULT_EMBED_LINK_HEIGHT, _constants.MIN_EMBED_LINK_HEIGHT), _constants.MAX_EMBED_LINK_HEIGHT);
+    var newData = (0, _objectSpread2["default"])({}, element.data || {});
+    delete newData.width;
+    newData.height = finalHeight;
+    (0, _helper.updateEmbedLink)(editor, newData);
+
+    // Reset hover menu position
+    setTimeout(function () {
+      setIsResizing(false);
+    }, 100);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [editor, element.data, getEmbedLinkHeight, movingHeight, onMouseMove]);
+  var unregisterEvent = (0, _react.useCallback)(function (eventList) {
+    eventList.forEach(function (element) {
+      document.removeEventListener(element.eventName, element.event);
+    });
+  }, []);
+  var onResizeStart = (0, _react.useCallback)(function (event) {
+    var _embedLinkContainerRe2;
+    event.preventDefault();
+    event.stopPropagation();
+    setIsResizing(true);
+    resizeStartYRef.current = event.clientY;
+    var currentHeight = ((_embedLinkContainerRe2 = embedLinkContainerRef.current) === null || _embedLinkContainerRe2 === void 0 ? void 0 : _embedLinkContainerRe2.getBoundingClientRect().height) || getEmbedLinkHeight();
+    resizeStartHeightRef.current = currentHeight;
+    registerEvent([{
+      'eventName': 'mousemove',
+      'event': onMouseMove
+    }, {
+      'eventName': 'mouseup',
+      'event': onResizeEnd
+    }]);
+  }, [getEmbedLinkHeight, onMouseMove, onResizeEnd, registerEvent]);
   var onDeleteEmbedLink = (0, _react.useCallback)(function () {
     var path = _slateReact.ReactEditor.findPath(editor, element);
     _slate.Transforms.removeNodes(editor, {
@@ -99,7 +183,9 @@ var EmbedLink = function EmbedLink(_ref) {
       resizeObserver.observe(scrollRef.current);
     }
     return function () {
-      observerRefValue.removeEventListener('scroll', handleScroll);
+      if (observerRefValue) {
+        observerRefValue.removeEventListener('scroll', handleScroll);
+      }
       if (resizeObserver) {
         resizeObserver.disconnect();
       }
@@ -130,9 +216,14 @@ var EmbedLink = function EmbedLink(_ref) {
     };
   }, [isShowZoomOut, setIsShowZoomOut]);
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
+    ref: embedLinkContainerRef,
     className: (0, _classnames["default"])('sdoc-embed-link-container', {
       'isSelected': isSelected
     }),
+    style: {
+      height: getEmbedLinkHeight(),
+      maxHeight: _constants.MAX_EMBED_LINK_HEIGHT
+    },
     onDoubleClick: handleDoubleClick,
     scrolling: "no"
   }, isValidUrl && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("iframe", {
@@ -144,10 +235,14 @@ var EmbedLink = function EmbedLink(_ref) {
     className: "iframe-overlay",
     onDoubleClick: handleDoubleClick,
     onClick: handleOnClick
+  }), !readOnly && isSelected && /*#__PURE__*/_react["default"].createElement("span", {
+    className: "image-resizer",
+    ref: resizerRef,
+    onMouseDown: onResizeStart
   })), !isValidUrl && /*#__PURE__*/_react["default"].createElement("div", {
     ref: EmbedLinkRef,
     className: "sdoc-embed-link-tip"
-  }, t('Embed_link_invalid_tip'))), isSelected && !readOnly && !isShowZoomOut && /*#__PURE__*/_react["default"].createElement(_hoverMenu["default"], {
+  }, t('Embed_link_invalid_tip'))), isSelected && !readOnly && !isShowZoomOut && !isResizing && /*#__PURE__*/_react["default"].createElement(_hoverMenu["default"], {
     isValidUrl: isValidUrl,
     menuPosition: menuPosition,
     onOpen: handleDoubleClick,

package/dist/extension/plugins/link/dialog/add-link-dialog/select-forms/linked-page.js

@@ -133,8 +133,9 @@ var LinkedPagesForm = function LinkedPagesForm(_ref) {
     var depth = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
     var isFromSearch = arguments.length > 3 ? arguments[3] : undefined;
     var page = wikiPageList.find(function (p) {
-      return p.id === item.id;
+      return (p === null || p === void 0 ? void 0 : p.id) === item.id;
     });
+    if (!page) return null;
     if (isFromSearch) {
       page.isDir = false;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "3.0.130",
+  "version": "3.0.132",
   "main": "dist/index.js",
   "scripts": {
     "test": "jest",
@@ -72,5 +72,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "385f3e1f6ad99aa52159eef05c15071ac1dbf6f7"
+  "gitHead": "92ca8076d7b334e37a5971eae5f6f6e64c8dc56d"
 }