@seafile/sdoc-editor 2.0.48 → 2.0.50

package/dist/basic-sdk/assets/css/layout.css

@@ -1,3 +1,54 @@
+.sdoc-editor-container.fullscreen .sdoc-content-wrapper {
+  height: 100vh !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-article-container {
+  width: 100% !important;
+  padding: 0 !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-editor__article {
+  padding: calc(100vw / 794 * 40) calc(100vw / 794 * 60) !important;
+  font-size: calc(100vw / 794 * 14.7) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-checkbox-input {
+  width: calc(100vw / 794 * 13) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-code-block-pre {
+  font-size: calc(100vw / 794 * 13.3) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-title {
+  font-size: calc(100vw / 794 * 33.7) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-subtitle {
+  font-size: calc(100vw / 794 * 20) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-1 {
+  font-size: calc(100vw / 794 * 26.7) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-2 {
+  font-size: calc(100vw / 794 * 21.3) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-3 {
+  font-size: calc(100vw / 794 * 18.7) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-4 {
+  font-size: calc(100vw / 794 * 16) !important;
+}
+
+.sdoc-editor-container.fullscreen .sdoc-header-5,
+.sdoc-editor-container.fullscreen .sdoc-header-6 {
+  font-size: calc(100vw / 794 * 14.7) !important;
+}
+
 .sdoc-editor-container {
   flex: 1;
   display: flex;

package/dist/basic-sdk/editor/sdoc-editor.js

@@ -9,6 +9,7 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _slate = require("@seafile/slate");
 var _deepCopy = _interopRequireDefault(require("deep-copy"));
+var _isHotkey = _interopRequireDefault(require("is-hotkey"));
 var _context = _interopRequireDefault(require("../../context"));
 var _commonLoading = _interopRequireDefault(require("../../components/common-loading"));
 var _constants = require("../constants");
@@ -28,6 +29,7 @@ var _outlineModule = require("../../android/outline-module");
 var _jsBridge = _interopRequireDefault(require("../../android/js-bridge"));
 var _helpers = require("../extension/plugins/ai/ai-module/helpers");
 const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  var _ref3;
   let {
     editor: propsEditor,
     document,
@@ -36,6 +38,7 @@ const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     isShowHeaderToolbar = true,
     showOutline = true
   } = _ref;
+  const [showFullScreen, setShowFullScreen] = (0, _react.useState)(false);
   const validEditor = (0, _react.useMemo)(() => {
     if (propsEditor) return propsEditor;
     const defaultEditor = (0, _extension.createDefaultEditor)();
@@ -131,6 +134,45 @@ const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [onRefreshDocument]);
 
+  // Handle presentation fullscreen mode
+  const handleFullScreenPresentation = (0, _react.useCallback)(_ref2 => {
+    let {
+      isShowFullScreen
+    } = _ref2;
+    if (isShowFullScreen) {
+      setShowFullScreen(true);
+    }
+  }, []);
+  (0, _react.useEffect)(() => {
+    const eventBus = _basicSdk.EventBus.getInstance();
+    const unsubscribePresentationFullScreen = eventBus.subscribe(_constants2.EXTERNAL_EVENT.TOGGLE_PRESENTATION_MODE, handleFullScreenPresentation);
+    return () => {
+      unsubscribePresentationFullScreen();
+    };
+  }, [handleFullScreenPresentation]);
+  (0, _react.useEffect)(() => {
+    const handleExit = e => {
+      if ((0, _isHotkey.default)('esc', e)) {
+        e.preventDefault();
+        if (window.document.fullscreenElement) {
+          window.document.exitFullscreen();
+        }
+      }
+    };
+    const onFullscreenChange = () => {
+      if (!window.document.fullscreenElement) {
+        setShowFullScreen(false);
+      }
+    };
+    window.addEventListener('keydown', handleExit);
+    window.document.addEventListener('fullscreenchange', onFullscreenChange);
+    return () => {
+      window.removeEventListener('keydown', handleExit);
+      window.document.removeEventListener('fullscreenchange', onFullscreenChange);
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   // The parent component can call the method of this component through ref
   (0, _react.useImperativeHandle)(ref, () => ({
     setSlateValue: document => {
@@ -205,20 +247,27 @@ const SdocEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   }
   const isShowComment = typeof showComment === 'boolean' ? showComment : true;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_layout.EditorContainer, {
-    editor: validEditor
-  }, /*#__PURE__*/_react.default.createElement(_useColorContext.ColorProvider, null, isShowHeaderToolbar && /*#__PURE__*/_react.default.createElement(_extension.HeaderToolbar, {
+    editor: validEditor,
+    readonly: showFullScreen,
+    fullscreen: showFullScreen
+  }, /*#__PURE__*/_react.default.createElement(_useColorContext.ColorProvider, null, !showFullScreen && isShowHeaderToolbar && /*#__PURE__*/_react.default.createElement(_extension.HeaderToolbar, {
     editor: validEditor
   }), /*#__PURE__*/_react.default.createElement(_layout.EditorContent, {
     docValue: slateValue,
-    showOutline: showOutline !== null && showOutline !== void 0 ? showOutline : true,
+    showOutline: (_ref3 = !showFullScreen && showOutline) !== null && _ref3 !== void 0 ? _ref3 : true,
+    readonly: showFullScreen,
     editor: validEditor,
-    showComment: isShowComment
-  }, /*#__PURE__*/_react.default.createElement(_editableArticle.default, {
+    showComment: !showFullScreen && isShowComment
+  }, showFullScreen ? /*#__PURE__*/_react.default.createElement(_readonlyArticle.default, {
+    editor: validEditor,
+    slateValue: slateValue,
+    showComment: false
+  }) : /*#__PURE__*/_react.default.createElement(_editableArticle.default, {
     editor: validEditor,
     slateValue: slateValue,
     updateSlateValue: onValueChange,
     showComment: isShowComment
-  })))), /*#__PURE__*/_react.default.createElement(_insertElementDialog.default, {
+  })))), !showFullScreen && /*#__PURE__*/_react.default.createElement(_insertElementDialog.default, {
     editor: validEditor
   }));
 });

package/dist/basic-sdk/extension/plugins/multi-column/render/index.js

@@ -27,6 +27,7 @@ const MultiColumn = _ref => {
   } : {});
   const multiColumnContainerClassName = (0, _classnames.default)('sdoc-multicolumn-container', className);
   const [pageWidth, setPageWidth] = (0, _react.useState)((0, _helper.getCurrentPageWidth)(editor));
+  const readOnly = (0, _slateReact.useReadOnly)();
   const handleResizeColumn = newColumn => {
     (0, _helper.updateColumnWidth)(editor, element, newColumn);
   };
@@ -79,14 +80,12 @@ const MultiColumn = _ref => {
     style: style,
     ref: multiColumn,
     "data-id": element.id
-  }, children, /*#__PURE__*/_react.default.createElement(_resizeHandlers.default, {
+  }, children, !readOnly && /*#__PURE__*/_react.default.createElement(_resizeHandlers.default, {
     element: element,
     handleResizeColumn: handleResizeColumn
   })));
 };
 function renderMultiColumn(props) {
-  // When read only
-
   return /*#__PURE__*/_react.default.createElement(MultiColumn, props);
 }
 var _default = exports.default = renderMultiColumn;

package/dist/basic-sdk/extension/plugins/seatable-column/render-elem.js

@@ -68,7 +68,7 @@ const Column = _ref => {
     strikethrough = null
   } = element.children[0];
   const style = {
-    margin: '0 10px',
+    margin: '0',
     border: '1px solid transparent',
     userSelect: 'none',
     display: 'inline-block',

package/dist/basic-sdk/extension/plugins/video/render-elem.js

@@ -27,6 +27,7 @@ const Video = _ref => {
   const videoName = (data === null || data === void 0 ? void 0 : data.name) || (data === null || data === void 0 ? void 0 : data.src);
   const videoSize = data === null || data === void 0 ? void 0 : data.size;
   const isEmbeddableLink = data === null || data === void 0 ? void 0 : data.is_embeddable_link;
+  const readonly = (0, _slateReact.useReadOnly)();
   const handlePlay = () => {
     setVideoStates(prev => ({
       ...prev,
@@ -98,6 +99,7 @@ const Video = _ref => {
     ref: videoRef,
     src: (0, _helpers.getVideoURL)(data),
     controls: true,
+    controlsList: readonly && 'nofullscreen',
     onClick: onClickVideo,
     draggable: false,
     onPlay: handlePlay,

package/dist/basic-sdk/layout/editor-container.js

@@ -17,11 +17,13 @@ require("../assets/css/dropdown-menu.css");
 const EditorContainer = _ref => {
   let {
     children,
-    readonly
+    readonly,
+    fullscreen
   } = _ref;
   const className = (0, _classnames.default)('sdoc-editor-container', {
     'mobile': _utils.isMobile,
-    'readonly': readonly
+    'readonly': readonly,
+    'fullscreen': fullscreen
   });
   return /*#__PURE__*/_react.default.createElement("div", {
     className: className

package/dist/components/doc-operations/index.js

@@ -14,6 +14,7 @@ var _moreOperations = _interopRequireDefault(require("./more-operations"));
 var _shareOperation = _interopRequireDefault(require("./share-operation"));
 var _pluginsOperations = _interopRequireDefault(require("./plugins-operations"));
 var _utils = require("../../utils");
+var _presentationOperation = _interopRequireDefault(require("./presentation-operation"));
 require("./style.css");
 const DocOperations = _ref => {
   let {
@@ -43,6 +44,6 @@ const DocOperations = _ref => {
     handleViewChangesToggle: handleViewChangesToggle,
     handleRevisionMerged: handleRevisionMerged,
     handleRevisionPublished: handleRevisionPublished
-  }), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_pluginsOperations.default, null), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_shareOperation.default, null), !isPublished && /*#__PURE__*/_react.default.createElement(_collaboratorsOperation.default, null), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_moreOperations.default, null));
+  }), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_presentationOperation.default, null), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_pluginsOperations.default, null), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_shareOperation.default, null), !isPublished && /*#__PURE__*/_react.default.createElement(_collaboratorsOperation.default, null), !isSdocRevision && /*#__PURE__*/_react.default.createElement(_moreOperations.default, null));
 };
 var _default = exports.default = (0, _reactI18next.withTranslation)('sdoc-editor')(DocOperations);

package/dist/components/doc-operations/presentation-operation/index.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _basicSdk = require("../../../basic-sdk");
+var _constants = require("../../../constants");
+const PresentationOperation = () => {
+  const onPresentationToggle = (0, _react.useCallback)(() => {
+    const eventBus = _basicSdk.EventBus.getInstance();
+    eventBus.dispatch(_constants.EXTERNAL_EVENT.TOGGLE_PRESENTATION_MODE, {
+      isShowFullScreen: true
+    });
+    const node = document.querySelector('.sdoc-editor-container');
+    if (node !== null && node !== void 0 && node.requestFullscreen) {
+      node.requestFullscreen().catch(err => console.error('Failed to enter fullscreen:', err));
+    }
+  }, []);
+  return /*#__PURE__*/_react.default.createElement("span", {
+    className: "op-item",
+    onClick: onPresentationToggle
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "sdocfont sdoc-presentation"
+  }));
+};
+var _default = exports.default = PresentationOperation;

package/dist/constants/index.js

@@ -38,6 +38,7 @@ const EXTERNAL_EVENT = exports.EXTERNAL_EVENT = {
   CREATE_WIKI_PAGE: 'create_wiki_page',
   ADD_VIDEO_LINK: 'add_video_link',
   CHANGE_HEADER_WIDTH: 'change_header_width',
+  TOGGLE_PRESENTATION_MODE: 'toggle_presentation_mode',
   // wiki
   INSERT_LINK: 'insert_link',
   // document

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/sdoc-editor",
-  "version": "2.0.48",
+  "version": "2.0.50",
   "private": false,
   "description": "This is a sdoc editor",
   "main": "dist/index.js",

package/public/media/sdoc-editor-font/iconfont.css

@@ -1,11 +1,11 @@
 @font-face {
   font-family: "sdocfont"; /* Project id 4097705 */
-  src: url('iconfont.eot?t=1740817787686'); /* IE9 */
-  src: url('iconfont.eot?t=1740817787686#iefix') format('embedded-opentype'), /* IE6-IE8 */
-       url('iconfont.woff2?t=1740817787686') format('woff2'),
-       url('iconfont.woff?t=1740817787686') format('woff'),
-       url('iconfont.ttf?t=1740817787686') format('truetype'),
-       url('iconfont.svg?t=1740817787686#sdocfont') format('svg');
+  src: url('iconfont.eot?t=1744104550669'); /* IE9 */
+  src: url('iconfont.eot?t=1744104550669#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('iconfont.woff2?t=1744104550669') format('woff2'),
+       url('iconfont.woff?t=1744104550669') format('woff'),
+       url('iconfont.ttf?t=1744104550669') format('truetype'),
+       url('iconfont.svg?t=1744104550669#sdocfont') format('svg');
 }
 
 .sdocfont {
@@ -16,6 +16,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.sdoc-presentation:before {
+  content: "\e688";
+}
+
+.sdoc-close-presentation:before {
+  content: "\e689";
+}
+
 .sdoc-seatable-row:before {
   content: "\e687";
 }
@@ -547,3 +555,4 @@
 .sdoc-user:before {
   content: "\e629";
 }
+

package/public/media/sdoc-editor-font/iconfont.svg

@@ -14,6 +14,10 @@
     />
       <missing-glyph />
       
+      <glyph glyph-name="sdoc-presentation" unicode="&#59016;" d="M128 96c-35.2 0-64 28.8-64 67.2V764.8h-16C22.4 764.8 0 787.2 0 816S22.4 864 48 864h928c25.6 0 48-22.4 48-48S1001.6 768 976 768H960v-601.6c0-35.2-28.8-67.2-64-67.2h-105.6c28.8-41.6 51.2-70.4 64-86.4 19.2-25.6 19.2-60.8-9.6-86.4-28.8-25.6-73.6-22.4-92.8 3.2s-118.4 166.4-121.6 169.6H384c-3.2-3.2-99.2-137.6-118.4-166.4s-64-32-86.4-12.8c-25.6 19.2-35.2 60.8-16 89.6 12.8 19.2 35.2 48 64 92.8L128 96zM160 768v-576h704V768H160zM409.6 656l268.8-163.2c9.6-6.4 9.6-22.4 0-28.8l-268.8-163.2c-9.6-6.4-25.6 0-25.6 12.8V643.2c0 12.8 12.8 19.2 25.6 12.8z"  horiz-adv-x="1024" />
+      
+      <glyph glyph-name="sdoc-close-presentation" unicode="&#59017;" d="M172.8 688c-188.8-185.6-188.8-489.6 0-675.2 188.8-185.6 492.8-185.6 678.4 0 188.8 185.6 188.8 489.6 0 675.2-12.8 16-35.2 19.2-54.4 16-19.2-6.4-35.2-19.2-41.6-41.6-6.4-19.2 0-41.6 16-54.4 144-144 144-374.4 0-515.2-144-144-374.4-144-518.4 0-144 140.8-144 371.2 0 515.2 12.8 12.8 19.2 35.2 16 54.4-6.4 19.2-22.4 35.2-41.6 38.4-19.2 6.4-41.6 0-54.4-12.8zM512 896c35.2 0 64-28.8 64-64v-384c0-35.2-28.8-64-64-64s-64 28.8-64 64V832c0 35.2 28.8 64 64 64z"  horiz-adv-x="1024" />
+      
       <glyph glyph-name="sdoc-seatable-row" unicode="&#59015;" d="M0 528L256 384l-256-144v288zM0 64h1024v-96H0v96z m320 368h704v-96H320v96zM0 800h1024v-96H0V800z"  horiz-adv-x="1024" />
       
       <glyph glyph-name="sdoc-ask-ai" unicode="&#59013;" d="M678.4 896l92.8-252.8 252.8-92.8-252.8-92.8-92.8-252.8-92.8 252.8-252.8 92.8c166.4 60.8 252.8 92.8 252.8 92.8L678.4 896zM185.6 198.4L256 384l70.4-185.6L512 128l-185.6-70.4L256-128l-70.4 185.6L0 128z"  horiz-adv-x="1024" />

package/public/media/sdoc-editor-font.css

@@ -1,14 +1,11 @@
 @font-face {
-  font-family: "sdocfont";
-  /* Project id 4097705 */
-  src: url('./sdoc-editor-font/iconfont.eot?t=1740817787686');
-  /* IE9 */
-  src: url('./sdoc-editor-font/iconfont.eot?t=1740817787686#iefix') format('embedded-opentype'),
-    /* IE6-IE8 */
-    url('./sdoc-editor-font/iconfont.woff2?t=1740817787686') format('woff2'),
-    url('./sdoc-editor-font/iconfont.woff?t=1740817787686') format('woff'),
-    url('./sdoc-editor-font/iconfont.ttf?t=1740817787686') format('truetype'),
-    url('./sdoc-editor-font/iconfont.svg?t=1740817787686#sdocfont') format('svg');
+  font-family: "sdocfont"; /* Project id 4097705 */
+  src: url('./sdoc-editor-font/iconfont.eot?t=1744104550669'); /* IE9 */
+  src: url('./sdoc-editor-font/iconfont.eot?t=1744104550669#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('./sdoc-editor-font/iconfont.woff2?t=1744104550669') format('woff2'),
+       url('./sdoc-editor-font/iconfont.woff?t=1744104550669') format('woff'),
+       url('./sdoc-editor-font/iconfont.ttf?t=1744104550669') format('truetype'),
+       url('./sdoc-editor-font/iconfont.svg?t=1744104550669#sdocfont') format('svg');
 }
 
 .sdocfont {
@@ -19,6 +16,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.sdoc-presentation:before {
+  content: "\e688";
+}
+
+.sdoc-close-presentation:before {
+  content: "\e689";
+}
+
 .sdoc-seatable-row:before {
   content: "\e687";
 }
@@ -550,3 +555,4 @@
 .sdoc-user:before {
   content: "\e629";
 }
+