@seafile/sdoc-editor 0.2.14 → 0.2.15

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

@@ -51,7 +51,7 @@
 .sdoc-editor-container .article .sdoc-image-content {
   display: flex;
   flex-direction: column;
-  align-items: center;
+  align-items: start;
 }
 
 .sdoc-editor-container .article .sdoc-image-content :first-child {
@@ -59,8 +59,8 @@
 }
 
 .sdoc-editor-container .article .sdoc-image-content .sdoc-image-caption-input-wrapper {
-  border: 0px;
-  width: 120px;
+  border: 0;
+  outline: none;
   margin-top: 8px;
   color: #8A8F8D;
   background-color: transparent;

package/dist/basic-sdk/extension/plugins/code-block/hover-menu/index.css

@@ -75,24 +75,6 @@
   background: #f2f2f2;
 }
 
-.sdoc-code-block-hover-menu-container .hover-menu-container .op-tooltip:hover::after {
-  position: absolute;
-  color: #212529;
-  content: attr(op-item-tooltip);
-  top: -40px;
-  left: -20px;
-  width: 70px;
-  height: 30px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background-color: #fff;
-  border-radius: 3px;
-  border: 1px solid #e8e8e8;
-  font-size: 12px;
-  box-shadow: 0 0 5px #ccc;
-}
-
 .sdoc-code-block-hover-menu-container .icon-font {
   font-size: 12px;
   color: #444;

package/dist/basic-sdk/extension/plugins/code-block/hover-menu/index.js

@@ -2,6 +2,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useEffect, useState } from 'react';
 import { Input } from 'reactstrap';
 import { withTranslation } from 'react-i18next';
+import Tooltip from '../../../../../components/tooltip';
 import { ElementPopover } from '../../../commons/';
 import { genCodeLangs } from '../prismjs';
 import { getSelectedLangOption } from '../helpers';
@@ -29,6 +30,10 @@ var CodeBlockHoverMenu = function CodeBlockHoverMenu(_ref) {
     _useState6 = _slicedToArray(_useState5, 2),
     langsData = _useState6[0],
     setLangsData = _useState6[1];
+  var _useState7 = useState(false),
+    _useState8 = _slicedToArray(_useState7, 2),
+    isShowTooltip = _useState8[0],
+    setIsShowTooltip = _useState8[1];
   var onHiddenLangsList = useCallback(function (e) {
     if (!e.target.parentNode.className.includes('sdoc-search-langs')) {
       setIsShowlangsList(false);
@@ -36,6 +41,7 @@ var CodeBlockHoverMenu = function CodeBlockHoverMenu(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   useEffect(function () {
+    setIsShowTooltip(true);
     window.addEventListener('click', onHiddenLangsList);
     return function () {
       window.removeEventListener('click', onHiddenLangsList);
@@ -103,37 +109,49 @@ var CodeBlockHoverMenu = function CodeBlockHoverMenu(_ref) {
   }))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-code-block-hover-operation-divider"
   }), /*#__PURE__*/React.createElement("div", {
+    id: "sdoc_code_block_auto_wrap",
     className: "sdoc-code-block-hover-operation-item"
   }, /*#__PURE__*/React.createElement("div", {
     role: "button",
-    className: "op-item ".concat(white_space === 'normal' ? 'active' : '', " op-tooltip"),
-    "op-item-tooltip": t('Auto_wrap'),
+    className: "op-item ".concat(white_space === 'normal' ? 'active' : ''),
     onClick: onAutoLineWrap
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-auto-linefeed icon-font"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_code_block_auto_wrap",
+    placement: "top",
+    fade: true
+  }, t('Auto_wrap'))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-code-block-hover-operation-divider"
   }), /*#__PURE__*/React.createElement("div", {
+    id: "sdoc_code_block_copy",
     className: "sdoc-code-block-hover-operation-item"
   }, /*#__PURE__*/React.createElement("div", {
     role: "button",
-    className: "op-item op-tooltip",
-    "op-item-tooltip": t('Copy'),
+    className: "op-item",
     onClick: onCopyCodeBlock
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-copy icon-font"
-  }))), /*#__PURE__*/React.createElement("div", {
+  })), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_code_block_copy",
+    placement: "top",
+    fade: true
+  }, t('Copy'))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-code-block-hover-operation-divider"
   }), /*#__PURE__*/React.createElement("div", {
+    id: "sdoc_code_block_delete",
     className: "sdoc-code-block-hover-operation-item"
   }, /*#__PURE__*/React.createElement("div", {
     role: "button",
-    className: "op-item op-tooltip",
-    "op-item-tooltip": t('Delete'),
+    className: "op-item",
     onClick: onDelete
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-delete icon-font"
-  }))), isShowlangsList && /*#__PURE__*/React.createElement("div", {
+  })), isShowTooltip && /*#__PURE__*/React.createElement(Tooltip, {
+    target: "sdoc_code_block_delete",
+    placement: "top",
+    fade: true
+  }, t('Delete'))), isShowlangsList && /*#__PURE__*/React.createElement("div", {
     className: "sdoc-langs-list-container"
   }, /*#__PURE__*/React.createElement("div", {
     className: "sdoc-search-langs"

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

@@ -120,7 +120,9 @@ var ImageHoverMenu = function ImageHoverMenu(_ref) {
   }, t('Image_border'))), display_type === IMAGE_DISPLAY_TYPE[1] && /*#__PURE__*/React.createElement("span", {
     id: "sdoc_image_caption",
     role: "button",
-    className: classnames('op-item', 'ml-1'),
+    className: classnames('op-item', 'ml-1', {
+      'active': (data === null || data === void 0 ? void 0 : data.caption.length) !== 0
+    }),
     onClick: function onClick() {
       onShowCaption();
     }

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

@@ -249,6 +249,9 @@ var Image = function Image(_ref) {
     contentEditable: false
   }, /*#__PURE__*/React.createElement("span", null, t('Width'), ':', parseInt(movingWidth || imageRef.current.clientWidth)), /*#__PURE__*/React.createElement("span", null, "\xA0\xA0"), /*#__PURE__*/React.createElement("span", null, t('Height'), ':', imageRef.current.clientHeight))), display_type === 'Block' && (isShowCaption || (data === null || data === void 0 ? void 0 : data.caption)) && /*#__PURE__*/React.createElement("input", {
     className: "sdoc-image-caption-input-wrapper",
+    style: {
+      width: (data === null || data === void 0 ? void 0 : data.width) || '120px'
+    },
     placeholder: t('Insert_caption'),
     value: caption,
     onBlur: onSetCaption,

package/package.json

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