@seafile/sdoc-editor 0.1.120 → 0.1.122

package/dist/basic-sdk/extension/commons/tooltip/index.css

@@ -4,7 +4,18 @@
   background-color: #303133;
 }
 
-.bs-tooltip-bottom.sdoc-tooltip .arrow::before,
 .sdoc-tooltip.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
   border-bottom-color: #303133;
 }
+
+.sdoc-tooltip.bs-tooltip-auto[x-placement^="top"] .arrow::before {
+  border-top-color: #303133;
+}
+
+.sdoc-tooltip.bs-tooltip-auto[x-placement^="right"] .arrow::before {
+  border-right-color: #303133;
+}
+
+.sdoc-tooltip.bs-tooltip-auto[x-placement^="left"] .arrow::before {
+  border-left-color: #303133;
+}

package/dist/basic-sdk/extension/plugins/font/helpers.js

@@ -130,10 +130,11 @@ export var loadFont = function loadFont() {
   fontLink.className = GOOGLE_FONT_CLASS;
   document.body.appendChild(fontLink);
 };
-export var generatorFontFamily = function generatorFontFamily(fontName, fontWeight) {
+export var generatorFontFamily = function generatorFontFamily(fontName, fontWeight, leaf) {
+  var isCodeBlock = leaf && Object.keys(leaf).includes('token');
   var lang = context.getSetting('lang') || 'zh-cn';
   if (fontName === DEFAULT_FONT) {
-    return "'Arial', ".concat(lang === 'zh-cn' ? "\u5B8B\u4F53" : 'Arial', ", 'sans-serif'");
+    return "".concat(isCodeBlock ? 'monospace' : 'Arial', ", ").concat(lang === 'zh-cn' ? "\u5B8B\u4F53" : 'Arial', ", 'sans-serif'");
   }
   var fontObject = FONT.find(function (item) {
     return item.name === fontName;
@@ -142,5 +143,5 @@ export var generatorFontFamily = function generatorFontFamily(fontName, fontWeig
     fontFamilyName = fontObject.fontFamilyName;
   loadFont(fontObject, fontWeight);
   var validFontName = fontFamilyName && isMac() ? fontFamilyName['mac'] : fontName;
-  return "".concat(validFontName, ", ").concat(lang === 'zh-cn' ? "\u5B8B\u4F53" : 'Arial', ", ").concat(usuallyFontFamilyName || 'sans-serif');
+  return "".concat(isCodeBlock ? 'monospace' : validFontName, ", ").concat(lang === 'zh-cn' ? "\u5B8B\u4F53" : 'Arial', ", ").concat(usuallyFontFamilyName || 'sans-serif');
 };

package/dist/basic-sdk/extension/plugins/header/menu/index.js

@@ -1,12 +1,14 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import React from 'react';
+import React, { Fragment } from 'react';
 import { withTranslation } from 'react-i18next';
 import classnames from 'classnames';
 import { getHeaderType, isMenuDisabled, setHeaderType } from '../helpers';
-import { HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, HEADER_TITLE_MAP, PARAGRAPH } from '../../../constants';
+import { HEADERS, HEADER_TITLE_MAP, PARAGRAPH } from '../../../constants';
+import Tooltip from '../../../commons/tooltip';
 import './style.css';
 var HeaderMenu = /*#__PURE__*/function (_React$Component) {
   _inherits(HeaderMenu, _React$Component);
@@ -78,6 +80,11 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
     _this.setMenuRef = function (ref) {
       _this.menu = ref;
     };
+    _this.getToolTip = function (index) {
+      //chrome in Mac: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/116.0.0.0 Safari/537.36"
+      var isMac = window.navigator.userAgent.indexOf('Macintosh') != -1;
+      return isMac ? "\u2318 +\u2325 +".concat(index) : "ctrl+alt+".concat(index);
+    };
     _this.state = {
       isShowHeaderPopover: false
     };
@@ -86,11 +93,13 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
   _createClass(HeaderMenu, [{
     key: "render",
     value: function render() {
+      var _this2 = this;
       var t = this.props.t;
       var isShowHeaderPopover = this.state.isShowHeaderPopover;
       var headerIconClass = "sdocfont sdoc-".concat(isShowHeaderPopover ? 'caret-up' : 'drop-down');
-      var headerType = this.getValue();
+      var currentType = this.getValue();
       var disabled = this.isDisabled();
+      var itemList = [PARAGRAPH, 'divider'].concat(_toConsumableArray(HEADERS));
       return /*#__PURE__*/React.createElement("div", {
         className: "header-menu"
       }, /*#__PURE__*/React.createElement("div", {
@@ -100,35 +109,38 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
         onClick: disabled ? function () {} : this.onToggleClick
       }, /*#__PURE__*/React.createElement("span", {
         className: "active"
-      }, t(HEADER_TITLE_MAP[headerType])), !disabled && /*#__PURE__*/React.createElement("span", {
+      }, t(HEADER_TITLE_MAP[currentType])), !disabled && /*#__PURE__*/React.createElement("span", {
         className: headerIconClass
       })), isShowHeaderPopover && /*#__PURE__*/React.createElement("div", {
         ref: this.setMenuRef,
         className: "header-popover sdoc-dropdown-menu"
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(PARAGRAPH)
-      }, t(HEADER_TITLE_MAP.paragraph)), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-divider"
-      }), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(HEADER1)
-      }, t(HEADER_TITLE_MAP.header1)), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(HEADER2)
-      }, t(HEADER_TITLE_MAP.header2)), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(HEADER3)
-      }, t(HEADER_TITLE_MAP.header3)), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(HEADER4)
-      }, t(HEADER_TITLE_MAP.header4)), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(HEADER5)
-      }, t(HEADER_TITLE_MAP.header5)), /*#__PURE__*/React.createElement("div", {
-        className: "sdoc-dropdown-menu-item",
-        onClick: this.onMouseDown(HEADER6)
-      }, t(HEADER_TITLE_MAP.header6))));
+      }, itemList.map(function (item, index) {
+        if (item == 'divider') {
+          return /*#__PURE__*/React.createElement("div", {
+            key: index,
+            className: "sdoc-dropdown-menu-divider"
+          });
+        }
+        var isSelected = currentType == item;
+        var titleIndex = index == 0 ? 0 : index - 1;
+        var id = "".concat(item, "-").concat(titleIndex);
+        return /*#__PURE__*/React.createElement(Fragment, {
+          key: index
+        }, /*#__PURE__*/React.createElement("div", {
+          id: id,
+          className: classnames('sdoc-dropdown-menu-item', {
+            'position-relative': isSelected
+          }),
+          onClick: _this2.onMouseDown(item)
+        }, isSelected && /*#__PURE__*/React.createElement("i", {
+          className: "sdocfont sdoc-check-mark"
+        }), /*#__PURE__*/React.createElement("span", {
+          className: item
+        }, t(HEADER_TITLE_MAP[item]))), /*#__PURE__*/React.createElement(Tooltip, {
+          target: id,
+          placement: "right"
+        }, _this2.getToolTip(titleIndex)));
+      })));
     }
   }]);
   return HeaderMenu;

package/dist/basic-sdk/extension/plugins/header/menu/style.css

@@ -62,3 +62,35 @@
 .header-menu .header-popover .sdoc-dropdown-menu-item {
   font-size: 14px;
 }
+
+.header-menu .header-popover .sdoc-dropdown-menu-item .sdoc-check-mark {
+  position: absolute;
+  left: 8px;
+  transform: scale(.8);
+  color: #798d99;
+}
+
+.header-menu .header-popover .header1 {
+  font-size: 18px;
+}
+
+.header-menu .header-popover .header2 {
+  font-size: 16px;
+}
+
+.header-menu .header-popover .header3 {
+  font-size: 14px;
+}
+
+.header-menu .header-popover .header4 {
+  font-size: 12px;
+}
+
+.header-menu .header-popover .header5 {
+  font-size: 11px;
+}
+
+.header-menu .header-popover .header6 {
+  font-size: 11px;
+}
+

package/dist/basic-sdk/extension/plugins/header/plugin.js

@@ -2,6 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { Editor, Element, Transforms, Node } from '@seafile/slate';
 import { PARAGRAPH, HEADER_TYPE_ARRAY, LIST_TYPE_ARRAY } from '../../constants';
 import { generateEmptyElement, getSelectedNodeByTypes } from '../../core';
+import { isMenuDisabled, setHeaderType } from './helpers';
 var isSelectionAtLineEnd = function isSelectionAtLineEnd(editor, path) {
   var selection = editor.selection;
   if (!selection) return false;
@@ -68,6 +69,14 @@ var withHeader = function withHeader(editor) {
     }
     return insertFragment(data);
   };
+
+  // for hotkey
+  newEditor.setParagraphHeadingType = function (type) {
+    if (isMenuDisabled(newEditor)) {
+      return false;
+    }
+    setHeaderType(newEditor, type);
+  };
   return newEditor;
 };
 export default withHeader;

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

@@ -51,7 +51,7 @@ var renderText = function renderText(props, editor) {
   }
   var font = leaf['font'] || DEFAULT_FONT;
   var fontWeight = leaf.BOLD ? 600 : 400;
-  style['fontFamily'] = generatorFontFamily(font, fontWeight);
+  style['fontFamily'] = generatorFontFamily(font, fontWeight, leaf);
   if (leaf.BOLD) {
     markedChildren = /*#__PURE__*/React.createElement("strong", null, markedChildren);
   }

package/dist/basic-sdk/utils/event-handler.js

@@ -1,9 +1,10 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import isHotkey from 'is-hotkey';
 import EventBus from '../utils/event-bus';
 import { getSelectedNodeByType } from '../extension/core/queries/';
-import { ELEMENT_TYPE } from '../extension/constants';
+import { ELEMENT_TYPE, PARAGRAPH, HEADERS } from '../extension/constants';
 import { INTERNAL_EVENT } from '../constants';
 var EventProxy = /*#__PURE__*/_createClass(function EventProxy(_editor) {
   var _this = this;
@@ -11,6 +12,15 @@ var EventProxy = /*#__PURE__*/_createClass(function EventProxy(_editor) {
   this.onKeyDown = function (event) {
     var editor = _this.editor;
 
+    // paragrah, headings
+    var paragraphHeadingList = [PARAGRAPH].concat(_toConsumableArray(HEADERS));
+    paragraphHeadingList.forEach(function (item, index) {
+      if (isHotkey("cmd+opt+".concat(index), event) || isHotkey("ctrl+alt+".concat(index), event)) {
+        event.preventDefault();
+        editor.setParagraphHeadingType(item);
+      }
+    });
+
     // bold
     if (isHotkey('mod+b', event)) {
       event.preventDefault();

package/dist/components/tip-message/index.js

@@ -118,7 +118,11 @@ var TipMessage = /*#__PURE__*/function (_React$Component) {
       if (lastSavedAt) {
         return /*#__PURE__*/React.createElement("span", {
           className: "tip-message"
-        }, /*#__PURE__*/React.createElement("span", null, t('Recently_saved'), ' '), /*#__PURE__*/React.createElement("span", null, dayjs(lastSavedAt).format('HH:mm')));
+        }, /*#__PURE__*/React.createElement("span", {
+          className: "sdocfont sdoc-save-tip mr-2"
+        }), /*#__PURE__*/React.createElement("span", {
+          className: "save-time"
+        }, dayjs(lastSavedAt).format('HH:mm')));
       }
       return null;
     };

package/dist/components/tip-message/style.css

@@ -4,6 +4,12 @@
   opacity: 0.75;
   color: #999;
   width: max-content;
-  display: inline-block;
-  white-space: nowrap;
+  height: 27px;
+  line-height: 27px;
+  display: inline-flex;
+}
+
+.sdoc-editor-page-wrapper .tip-message .sdocfont {
+  padding-top: 1px;
+  font-size: 14px;
 }

package/package.json

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

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

@@ -14,6 +14,8 @@
     />
       <missing-glyph />
       
+      <glyph glyph-name="sdoc-save-tip" unicode="&#58960;" d="M528 800c153.6 0 272-112 284.8-252.8 121.6-9.6 208-137.6 208-291.2 0-160-86.4-284.8-201.6-288H208c-96 0-208 124.8-208 284.8s89.6 294.4 227.2 288c9.6 0 16 0 22.4-3.2C291.2 694.4 374.4 800 528 800z m3.2-96c-99.2 0-179.2-73.6-208-256-48 3.2-76.8 3.2-96 0-73.6-9.6-131.2-86.4-131.2-185.6S166.4 64 227.2 64h582.4c54.4 0 118.4 96 118.4 198.4 0 89.6-35.2 166.4-99.2 185.6-28.8 9.6-67.2 12.8-92.8 6.4-6.4 169.6-99.2 249.6-204.8 249.6z m163.2-252.8l38.4-41.6c6.4-6.4 6.4-16 0-22.4l-256-249.6c-12.8-12.8-32-16-44.8-3.2l-147.2 140.8c-6.4 6.4-6.4 12.8-3.2 19.2l3.2 3.2 38.4 38.4c6.4 6.4 16 6.4 22.4 0l108.8-105.6L672 448c6.4 9.6 16 9.6 22.4 3.2z"  horiz-adv-x="1024" />
+      
       <glyph glyph-name="sdoc-file" unicode="&#58895;" d="M460.8 723.2H112c-16 0-35.2-12.8-35.2-35.2v-601.6c0-19.2 16-35.2 35.2-35.2h803.2c16 0 35.2 19.2 35.2 35.2V576c0 19.2-16 35.2-35.2 35.2H588.8c-12.8 0-16 6.4-22.4 12.8l-105.6 99.2z m137.6-38.4h313.6c57.6 0 112-48 112-115.2v-489.6c0-60.8-48-115.2-112-115.2h-800C51.2-32 0 16 0 83.2V684.8C0 745.6 48 800 112 800h361.6c12.8 0 16-6.4 22.4-12.8l102.4-102.4z"  horiz-adv-x="1024" />
       
       <glyph glyph-name="sdoc-header6" unicode="&#58894;" d="M96 896v-400h448V896h96v-960h-96V400H96V-64H0V896h96zM787.2 115.2c12.8 16 28.8 28.8 44.8 35.2s35.2 12.8 54.4 12.8c19.2 0 38.4-3.2 54.4-9.6 16-6.4 32-16 41.6-28.8 16-16 25.6-28.8 32-48s9.6-35.2 9.6-54.4c0-28.8-6.4-54.4-19.2-76.8s-32-41.6-54.4-54.4c-25.6-12.8-51.2-19.2-80-19.2-35.2 0-64 9.6-89.6 25.6S736-64 723.2-32s-19.2 70.4-19.2 118.4c0 38.4 3.2 70.4 12.8 102.4s19.2 51.2 32 73.6 32 35.2 54.4 44.8 44.8 12.8 73.6 12.8c25.6 0 48-6.4 70.4-16s32-22.4 44.8-35.2c9.6-16 16-28.8 16-41.6 0-9.6-3.2-16-9.6-22.4s-16-12.8-25.6-12.8c-9.6 0-16 3.2-25.6 9.6-6.4 6.4-12.8 12.8-16 22.4-3.2 9.6-12.8 19.2-22.4 28.8-9.6 6.4-22.4 9.6-35.2 9.6-9.6 0-22.4-3.2-32-9.6-9.6-6.4-19.2-12.8-25.6-22.4-16-22.4-25.6-60.8-28.8-115.2z m83.2-185.6c19.2 0 38.4 9.6 51.2 25.6s19.2 38.4 19.2 64c0 19.2-3.2 35.2-9.6 48-3.2 12.8-12.8 22.4-25.6 28.8-9.6 6.4-22.4 9.6-35.2 9.6-12.8 0-25.6-3.2-35.2-9.6-12.8-6.4-22.4-16-28.8-28.8-6.4-9.6-9.6-25.6-9.6-41.6 0-25.6 6.4-48 22.4-67.2 12.8-19.2 28.8-28.8 51.2-28.8z"  horiz-adv-x="1024" />

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

@@ -1,11 +1,11 @@
 @font-face {
   font-family: "sdocfont"; /* Project id 4097705 */
-  src: url('./sdoc-editor-font/iconfont.eot?t=1691653499663'); /* IE9 */
-  src: url('./sdoc-editor-font/iconfont.eot?t=1691653499663#iefix') format('embedded-opentype'), /* IE6-IE8 */
-       url('./sdoc-editor-font/iconfont.woff2?t=1691653499663') format('woff2'),
-       url('./sdoc-editor-font/iconfont.woff?t=1691653499663') format('woff'),
-       url('./sdoc-editor-font/iconfont.ttf?t=1691653499663') format('truetype'),
-       url('./sdoc-editor-font/iconfont.svg?t=1691653499663#sdocfont') format('svg');
+  src: url('./sdoc-editor-font/iconfont.eot?t=1692612471690'); /* IE9 */
+  src: url('./sdoc-editor-font/iconfont.eot?t=1692612471690#iefix') format('embedded-opentype'), /* IE6-IE8 */
+       url('./sdoc-editor-font/iconfont.woff2?t=1692612471690') format('woff2'),
+       url('./sdoc-editor-font/iconfont.woff?t=1692612471690') format('woff'),
+       url('./sdoc-editor-font/iconfont.ttf?t=1692612471690') format('truetype'),
+       url('./sdoc-editor-font/iconfont.svg?t=1692612471690#sdocfont') format('svg');
 }
 
 .sdocfont {
@@ -16,6 +16,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.sdoc-save-tip:before {
+  content: "\e650";
+}
+
 .sdoc-file:before {
   content: "\e60f";
 }