@seafile/sdoc-editor 3.0.83 → 3.0.85

package/dist/assets/css/sdoc-editor-plugins.css

@@ -275,6 +275,12 @@
 .sdoc-code-block-pre {
   background: #FAFAFA;
   border: 1px solid #f0f0f0;
+  position: relative;
+  overflow-y: hidden !important;
+}
+
+.sdoc-code-block-pre.hidden {
+  padding-bottom: 48px !important;
 }
 
 .sdoc-code-block-pre .sdoc-code-no-wrap {
@@ -285,6 +291,38 @@
   white-space: pre;
 }
 
+.sdoc-code-block-container .sdoc-code-block-hidden-icon {
+  height: 32px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  left: 48%;
+  bottom: 8px;
+}
+
+.sdoc-code-block-container .sdoc-code-block-hidden-icon .icon-container {
+  width: 32px;
+  height: 20px;
+  background-color: #999;
+  border-radius: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+
+.sdoc-code-block-container .sdoc-code-block-hidden-icon .icon-container .sdocfont {
+  color: #fff;
+  font-size: 12px;
+}
+
+.sdoc-code-block-code.hide-code {
+  max-height: 580.2px;
+  display: block;
+  overflow: hidden;
+}
+
 .sdoc-code-block-code .sdoc-code-line {
   position: relative;
   counter-increment: number;

package/dist/extension/plugins/code-block/render-elem.js

@@ -11,6 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm
 var _react = _interopRequireWildcard(require("react"));
 var _slate = require("@seafile/slate");
 var _slateReact = require("@seafile/slate-react");
+var _classnames = _interopRequireDefault(require("classnames"));
 var _constants = require("../../../constants");
 var _useScrollContext = require("../../../hooks/use-scroll-context");
 var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
@@ -41,6 +42,10 @@ var CodeBlock = function CodeBlock(_ref) {
     _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
     showHoverMenu = _useState4[0],
     setShowHoverMenu = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    showAllCode = _useState6[0],
+    setShowAllCode = _useState6[1];
   var onChangeLanguage = (0, _react.useCallback)(function (lang) {
     var language = lang.value;
     var path = _slateReact.ReactEditor.findPath(editor, element);
@@ -133,6 +138,10 @@ var CodeBlock = function CodeBlock(_ref) {
   var handleScroll = function handleScroll() {
     _eventBus["default"].getInstance().dispatch(_constants.INTERNAL_EVENT.UPDATE_SEARCH_REPLACE_HIGHLIGHT);
   };
+  var isHiddenCodeBlockParts = children.length > 30;
+  var toggleHidden = function toggleHidden() {
+    setShowAllCode(!showAllCode);
+  };
   return /*#__PURE__*/_react["default"].createElement("div", Object.assign({
     "data-id": element.id
   }, attributes, {
@@ -141,11 +150,24 @@ var CodeBlock = function CodeBlock(_ref) {
     onMouseLeave: onMouseLeave
   }), /*#__PURE__*/_react["default"].createElement("pre", {
     onScroll: handleScroll,
-    className: 'sdoc-code-block-pre',
+    className: (0, _classnames["default"])('sdoc-code-block-pre', {
+      'hidden': isHiddenCodeBlockParts
+    }),
     ref: codeBlockRef
   }, /*#__PURE__*/_react["default"].createElement("code", {
-    className: "sdoc-code-block-code ".concat(white_space === 'nowrap' ? 'sdoc-code-no-wrap' : '')
-  }, children)), showHoverMenu && /*#__PURE__*/_react["default"].createElement(_hoverMenu["default"], {
+    className: "sdoc-code-block-code ".concat(white_space === 'nowrap' ? 'sdoc-code-no-wrap' : '', " ").concat(!showAllCode ? 'hide-code' : '')
+  }, children)), children.length > 30 && /*#__PURE__*/_react["default"].createElement("span", {
+    className: "sdoc-code-block-hidden-icon",
+    onClick: toggleHidden,
+    contentEditable: false,
+    suppressContentEditableWarning: true
+  }, /*#__PURE__*/_react["default"].createElement("span", {
+    className: "icon-container"
+  }, !showAllCode ? /*#__PURE__*/_react["default"].createElement("i", {
+    className: "sdocfont sdoc-arrow-down arrow"
+  }) : /*#__PURE__*/_react["default"].createElement("i", {
+    className: "sdocfont sdoc-arrow-up arrow"
+  }))), showHoverMenu && /*#__PURE__*/_react["default"].createElement(_hoverMenu["default"], {
     menuPosition: menuPosition,
     onChangeLanguage: onChangeLanguage,
     language: element.language,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "3.0.83",
+  "version": "3.0.85",
   "main": "dist/index.js",
   "scripts": {
     "test": "jest",
@@ -72,5 +72,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b46d847b2723878e37bf05209d47a2059a49d098"
+  "gitHead": "17559d80caf39007b3ddec54671e986ba6c9254a"
 }