@seafile/sdoc-editor 2.0.24 → 2.0.26

package/dist/basic-sdk/extension/commons/insert-element-dialog/index.js

@@ -24,6 +24,7 @@ var _index5 = require("../../plugins/video/constants/index.js");
 var _constants3 = require("../../../../basic-sdk/constants");
 var _index6 = _interopRequireDefault(require("../../plugins/ai/ai-module/index.js"));
 var _index7 = _interopRequireDefault(require("../../plugins/video/dialog/add-video-link-dialog/index.js"));
+var _index8 = _interopRequireDefault(require("../../plugins/seatable-row/dialog/add-seatable-row-dialog/index.js"));
 const InsertElementDialog = _ref => {
   let {
     editor
@@ -37,6 +38,7 @@ const InsertElementDialog = _ref => {
   const [validEditor, setValidEditor] = (0, _react.useState)(editor);
   const [linkTitle, setLinkTitle] = (0, _react.useState)('');
   const [handleSubmit, setHandleSubmit] = (0, _react.useState)(() => void 0);
+  const [data, setData] = (0, _react.useState)({});
   const {
     t
   } = (0, _reactI18next.useTranslation)('sdoc-editor');
@@ -96,7 +98,8 @@ const InsertElementDialog = _ref => {
       editor: paramEditor,
       linkTitle,
       // link shortcut wrapping link
-      handleSubmit
+      handleSubmit,
+      data
     } = _ref2;
     setInsertPosition(insertPosition);
     setSlateNode(slateNode);
@@ -113,6 +116,7 @@ const InsertElementDialog = _ref => {
     setHandleSubmit(handleSubmit);
     // Apply for comment editor, as it has a different editor instance
     setValidEditor(paramEditor || editor);
+    setData(data);
     if (type === _constants2.LOCAL_IMAGE) {
       setTimeout(() => {
         uploadLocalImageInputRef.current && uploadLocalImageInputRef.current.click();
@@ -133,6 +137,7 @@ const InsertElementDialog = _ref => {
     setInsertVideoCallback(null);
     setValidEditor(null);
     setLinkTitle('');
+    setData('');
   }, []);
   const props = {
     insertPosition,
@@ -141,7 +146,8 @@ const InsertElementDialog = _ref => {
     element,
     closeDialog,
     linkTitle,
-    handleSubmit
+    handleSubmit,
+    data
   };
   switch (dialogType) {
     case _constants2.ELEMENT_TYPE.TABLE:
@@ -240,6 +246,10 @@ const InsertElementDialog = _ref => {
           closeModule: closeDialog
         });
       }
+    case _constants2.ELEMENT_TYPE.SEATABLE_ROW:
+      {
+        return /*#__PURE__*/_react.default.createElement(_index8.default, props);
+      }
     default:
       {
         return null;

package/dist/basic-sdk/extension/constants/element-type.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.WIKI_LINK = exports.VIDEO_LINK = exports.VIDEO = exports.UNORDERED_LIST = exports.TWO_COLUMN = exports.TOP_LEVEL_TYPES = exports.TITLE = exports.THREE_COLUMN = exports.TABLE_ROW = exports.TABLE_CELL = exports.TABLE = exports.SUBTITLE = exports.SEATABLE_TABLE = exports.SEATABLE_COLUMN = exports.SDOC_LINK = exports.QUICK_INSERT = exports.PARAGRAPH = exports.ORDERED_LIST = exports.MULTI_COLUMN = exports.MENTION_TEMP = exports.MENTION = exports.LIST_ITEM = exports.LINK = exports.INLINE_LEVEL_TYPES = exports.IMAGE_BLOCK = exports.IMAGE = exports.HEADER6 = exports.HEADER5 = exports.HEADER4 = exports.HEADER3 = exports.HEADER2 = exports.HEADER1 = exports.HEADER = exports.GROUP = exports.FOUR_COLUMN = exports.FONT_SIZE_REDUCE = exports.FONT_SIZE_INCREASE = exports.FONT_SIZE = exports.FIVE_COLUMN = exports.FILE_LINK_INSET_INPUT_TEMP = exports.FILE_LINK = exports.COLUMN = exports.CODE_LINE = exports.CODE_BLOCK = exports.CHECK_LIST_ITEM = exports.CALL_OUT = exports.BLOCKQUOTE = exports.ASK_AI = void 0;
+exports.WIKI_LINK = exports.VIDEO_LINK = exports.VIDEO = exports.UNORDERED_LIST = exports.TWO_COLUMN = exports.TOP_LEVEL_TYPES = exports.TITLE = exports.THREE_COLUMN = exports.TABLE_ROW = exports.TABLE_CELL = exports.TABLE = exports.SUBTITLE = exports.SEATABLE_TABLE = exports.SEATABLE_ROW = exports.SEATABLE_COLUMN = exports.SDOC_LINK = exports.QUICK_INSERT = exports.PARAGRAPH = exports.ORDERED_LIST = exports.MULTI_COLUMN = exports.MENTION_TEMP = exports.MENTION = exports.LIST_ITEM = exports.LINK = exports.INLINE_LEVEL_TYPES = exports.IMAGE_BLOCK = exports.IMAGE = exports.HEADER6 = exports.HEADER5 = exports.HEADER4 = exports.HEADER3 = exports.HEADER2 = exports.HEADER1 = exports.HEADER = exports.GROUP = exports.FOUR_COLUMN = exports.FONT_SIZE_REDUCE = exports.FONT_SIZE_INCREASE = exports.FONT_SIZE = exports.FIVE_COLUMN = exports.FILE_LINK_INSET_INPUT_TEMP = exports.FILE_LINK = exports.COLUMN = exports.CODE_LINE = exports.CODE_BLOCK = exports.CHECK_LIST_ITEM = exports.CHART = exports.CALL_OUT = exports.BLOCKQUOTE = exports.ASK_AI = void 0;
 const BLOCKQUOTE = exports.BLOCKQUOTE = 'blockquote';
 const TITLE = exports.TITLE = 'title';
 const SUBTITLE = exports.SUBTITLE = 'subtitle';
@@ -43,7 +43,9 @@ const MENTION_TEMP = exports.MENTION_TEMP = 'mention_temp';
 const FILE_LINK_INSET_INPUT_TEMP = exports.FILE_LINK_INSET_INPUT_TEMP = 'file_link_insert_input_temp';
 const QUICK_INSERT = exports.QUICK_INSERT = 'quick_insert';
 const VIDEO_LINK = exports.VIDEO_LINK = 'video_link';
+const CHART = exports.CHART = 'chart';
 const SEATABLE_COLUMN = exports.SEATABLE_COLUMN = 'seatable_column';
+const SEATABLE_ROW = exports.SEATABLE_ROW = 'seatable_row';
 const SEATABLE_TABLE = exports.SEATABLE_TABLE = 'seatable_table';
 const ASK_AI = exports.ASK_AI = 'ask_ai';
 

package/dist/basic-sdk/extension/constants/index.js

@@ -23,6 +23,12 @@ Object.defineProperty(exports, "CALL_OUT", {
     return _elementType.CALL_OUT;
   }
 });
+Object.defineProperty(exports, "CHART", {
+  enumerable: true,
+  get: function () {
+    return _elementType.CHART;
+  }
+});
 Object.defineProperty(exports, "CHECK_LIST_ITEM", {
   enumerable: true,
   get: function () {
@@ -344,6 +350,12 @@ Object.defineProperty(exports, "SEATABLE_COLUMN", {
     return _elementType.SEATABLE_COLUMN;
   }
 });
+Object.defineProperty(exports, "SEATABLE_ROW", {
+  enumerable: true,
+  get: function () {
+    return _elementType.SEATABLE_ROW;
+  }
+});
 Object.defineProperty(exports, "SEATABLE_TABLE", {
   enumerable: true,
   get: function () {
@@ -537,7 +549,7 @@ const FILE_TYPE = exports.FILE_TYPE = {
   [_elementType.SDOC_LINK]: 'sdoc',
   [_elementType.VIDEO]: 'video'
 };
-const SUPPORTED_SIDE_OPERATION_TYPE = exports.SUPPORTED_SIDE_OPERATION_TYPE = [_elementType.PARAGRAPH, _elementType.SUBTITLE, _elementType.HEADER1, _elementType.HEADER2, _elementType.HEADER3, _elementType.HEADER4, _elementType.HEADER5, _elementType.HEADER6, _elementType.CHECK_LIST_ITEM, _elementType.CODE_BLOCK, _elementType.TABLE, _elementType.BLOCKQUOTE, _elementType.CALL_OUT, _elementType.IMAGE_BLOCK, _elementType.VIDEO, _elementType.SEATABLE_TABLE, _elementType.MULTI_COLUMN];
+const SUPPORTED_SIDE_OPERATION_TYPE = exports.SUPPORTED_SIDE_OPERATION_TYPE = [_elementType.PARAGRAPH, _elementType.SUBTITLE, _elementType.HEADER1, _elementType.HEADER2, _elementType.HEADER3, _elementType.HEADER4, _elementType.HEADER5, _elementType.HEADER6, _elementType.CHECK_LIST_ITEM, _elementType.CODE_BLOCK, _elementType.TABLE, _elementType.BLOCKQUOTE, _elementType.CALL_OUT, _elementType.IMAGE_BLOCK, _elementType.VIDEO, _elementType.SEATABLE_TABLE, _elementType.MULTI_COLUMN, _elementType.SEATABLE_ROW];
 const MOUSE_ENTER_EVENT_DISABLED_MAP = exports.MOUSE_ENTER_EVENT_DISABLED_MAP = {
   [_elementType.PARAGRAPH]: [_elementType.CALL_OUT],
   [_elementType.TITLE]: [_elementType.CALL_OUT],
@@ -555,4 +567,4 @@ const MOUSE_ENTER_EVENT_DISABLED_MAP = exports.MOUSE_ENTER_EVENT_DISABLED_MAP =
   [_elementType.HEADER6]: [_elementType.CALL_OUT],
   [_elementType.CALL_OUT]: [_elementType.CALL_OUT]
 };
-const ROOT_ELEMENT_TYPES = exports.ROOT_ELEMENT_TYPES = [_elementType.PARAGRAPH, _elementType.TITLE, _elementType.SUBTITLE, _elementType.CHECK_LIST_ITEM, _elementType.ORDERED_LIST, _elementType.UNORDERED_LIST, _elementType.BLOCKQUOTE, _elementType.HEADER1, _elementType.HEADER2, _elementType.HEADER3, _elementType.HEADER4, _elementType.HEADER5, _elementType.HEADER6, _elementType.CALL_OUT, _elementType.TABLE, _elementType.CODE_BLOCK, _elementType.IMAGE_BLOCK, _elementType.VIDEO, _elementType.SEATABLE_TABLE];
+const ROOT_ELEMENT_TYPES = exports.ROOT_ELEMENT_TYPES = [_elementType.PARAGRAPH, _elementType.TITLE, _elementType.SUBTITLE, _elementType.CHECK_LIST_ITEM, _elementType.ORDERED_LIST, _elementType.UNORDERED_LIST, _elementType.BLOCKQUOTE, _elementType.HEADER1, _elementType.HEADER2, _elementType.HEADER3, _elementType.HEADER4, _elementType.HEADER5, _elementType.HEADER6, _elementType.CALL_OUT, _elementType.TABLE, _elementType.CODE_BLOCK, _elementType.IMAGE_BLOCK, _elementType.VIDEO, _elementType.SEATABLE_TABLE, _elementType.SEATABLE_ROW, _elementType.CHART];

package/dist/basic-sdk/extension/constants/menus-config.js

@@ -223,6 +223,11 @@ const MENUS_CONFIG_MAP = exports.MENUS_CONFIG_MAP = {
     iconClass: 'sdocfont sdoc-find-replace',
     text: 'Search_and_replace'
   },
+  [_elementType.SEATABLE_ROW]: {
+    id: `sdoc_${_elementType.SEATABLE_ROW}`,
+    iconClass: 'sdocfont sdoc-seatable-row',
+    text: 'SeaTable_row'
+  },
   [_elementType.SEATABLE_COLUMN]: {
     id: `sdoc_${_elementType.SEATABLE_COLUMN}`,
     iconClass: 'sdocfont sdoc-choose-column',
@@ -233,6 +238,11 @@ const MENUS_CONFIG_MAP = exports.MENUS_CONFIG_MAP = {
     iconClass: 'sdocfont sdoc-seatable-table',
     type: _elementType.SEATABLE_TABLE,
     text: 'SeaTable_table'
+  },
+  [_elementType.CHART]: {
+    id: `sdoc_${_elementType.CHART}`,
+    iconClass: 'sdocfont sdoc-chart',
+    text: 'Insert_chart'
   }
 };
 
@@ -354,6 +364,12 @@ const SIDE_INSERT_MENUS_CONFIG = exports.SIDE_INSERT_MENUS_CONFIG = {
     type: _elementType.LINK,
     text: 'Link'
   },
+  [_elementType.CHART]: {
+    id: `sdoc_${_elementType.CHART}`,
+    iconClass: 'sdocfont sdoc-chart',
+    type: _elementType.CHART,
+    text: 'Insert_chart'
+  },
   [_elementType.CODE_BLOCK]: {
     id: '',
     iconClass: 'sdocfont sdoc-code-block',
@@ -442,6 +458,7 @@ const SIDE_INSERT_MENUS_SEARCH_MAP = exports.SIDE_INSERT_MENUS_SEARCH_MAP = {
   [_elementType.THREE_COLUMN]: 'Three_column',
   [_elementType.FOUR_COLUMN]: 'Four_column',
   [_elementType.LINK]: 'Link',
+  [_elementType.CHART]: 'Chart',
   [_elementType.CODE_BLOCK]: 'Code_block',
   [_elementType.CALL_OUT]: 'Callout',
   [_elementType.UNORDERED_LIST]: 'Unordered_list',

package/dist/basic-sdk/extension/plugins/ai/ai-module/index.js

@@ -352,10 +352,19 @@ function AIModule(_ref) {
       const path = _slateReact.ReactEditor.findPath(editor, element);
       nextPath = _slate.Path.next(path);
     }
+
+    // Prevent '\\n' from being pre-wrapped
+    const tempResult = searchResult.replace(/\\n/g, '\v');
+    const paragraphs = tempResult.split('\n').map(line => line.replace(/\v/g, '\\n')).filter(line => line.trim() !== '');
     const p = (0, _core.generateEmptyElement)(_constants2.PARAGRAPH);
-    p.children[0].text = searchResult;
-    _slate.Transforms.insertNodes(editor, p, {
-      at: nextPath
+    paragraphs.forEach((line, index) => {
+      p.children[0].text = line;
+      _slate.Transforms.insertNodes(editor, p, {
+        at: nextPath
+      });
+      if (index < paragraphs.length - 1) {
+        nextPath = _slate.Path.next(nextPath);
+      }
     });
     onCloseClick();
     focusToEndPath(nextPath);

package/dist/basic-sdk/extension/plugins/ai/ai-module/style.css

@@ -83,6 +83,12 @@
   pointer-events: all;
 }
 
+.sdoc-ai-module-container .sdoc-ai-result .sdoc-ai-result-content {
+  white-space: pre-wrap;
+  line-height: 33px;
+  font-size: 11pt;
+}
+
 .sdoc-ai-module-container .sdoc-ai-result .sdoc-ai-result-header {
   display: flex;
   justify-content: space-between;

package/dist/basic-sdk/extension/plugins/chart/chart-edit-dialog/index.css

@@ -0,0 +1,20 @@
+.sdoc-chart-edit-dialog {
+  max-width: 1100px;
+  width: 1100px;
+  height: calc(100% - 56px);  
+}
+
+.sdoc-chart-edit-dialog .modal-content {
+  height: 100%;
+}
+  
+.sdoc-chart-edit-dialog .modal-body {
+  padding: 0;
+  overflow: hidden;
+  display: flex;
+}
+
+.sdoc-chart-edit-dialog .sdoc-chart-fullscreen-view {
+  width: 100%;
+  height: 600px;
+}

package/dist/basic-sdk/extension/plugins/chart/chart-edit-dialog/index.js

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _DTableModalHeader2 = _interopRequireDefault(require("dtable-ui-component/lib/DTableModalHeader"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactstrap = require("reactstrap");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _reactI18next = require("react-i18next");
+var _seaChart = require("sea-chart");
+var _context = _interopRequireDefault(require("../../../../../context"));
+require("./index.css");
+const ChartEditDialog = _ref => {
+  var _window, _window$app, _window$app$state, _window2, _window2$app, _window2$app$state;
+  let {
+    editor,
+    element,
+    api,
+    isFullScreen,
+    onCloseEditDialog,
+    t
+  } = _ref;
+  const [statItemData, setStatItemData] = (0, _react.useState)(element.stat_item || {});
+  const onSettingChange = (0, _react.useCallback)(setting => {
+    const newStatItemData = {
+      ...statItemData,
+      ...setting
+    };
+    setStatItemData(newStatItemData);
+  }, [statItemData]);
+  return /*#__PURE__*/_react.default.createElement(_reactstrap.Modal, {
+    className: "sdoc-chart-edit-dialog",
+    isOpen: true,
+    toggle: () => onCloseEditDialog(statItemData)
+  }, /*#__PURE__*/_react.default.createElement(_DTableModalHeader2.default, {
+    toggle: () => onCloseEditDialog(statItemData)
+  }, t(!isFullScreen ? 'Edit_chart' : 'Chart')), /*#__PURE__*/_react.default.createElement(_reactstrap.ModalBody, {
+    className: (0, _classnames.default)({
+      'sdoc-chart-fullscreen-view': isFullScreen
+    })
+  }, !isFullScreen && /*#__PURE__*/_react.default.createElement(_seaChart.Editor, {
+    chart: statItemData,
+    config: _context.default.getSettings(),
+    api: api,
+    tables: editor.tables || [],
+    collaborators: editor.collaborators || [],
+    departments: ((_window = window) === null || _window === void 0 ? void 0 : (_window$app = _window.app) === null || _window$app === void 0 ? void 0 : (_window$app$state = _window$app.state) === null || _window$app$state === void 0 ? void 0 : _window$app$state.departments) || [],
+    hideTypeToggle: true,
+    onChange: onSettingChange
+  }), isFullScreen && /*#__PURE__*/_react.default.createElement(_seaChart.View, {
+    chart: statItemData,
+    api: api,
+    config: _context.default.getSettings(),
+    tables: editor.tables,
+    collaborators: editor.collaborators || [],
+    departments: ((_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$app = _window2.app) === null || _window2$app === void 0 ? void 0 : (_window2$app$state = _window2$app.state) === null || _window2$app$state === void 0 ? void 0 : _window2$app$state.departments) || []
+  })));
+};
+var _default = exports.default = (0, _reactI18next.withTranslation)('sdoc-editor')(ChartEditDialog);

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

@@ -0,0 +1,68 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isInsertChartMenuDisabled = exports.isInViewPort = exports.insertChart = exports.generateChartNode = void 0;
+var _slate = require("@seafile/slate");
+var _seaChart = require("sea-chart");
+var _core = require("../../core");
+var _helper = require("../callout/helper");
+var _constants = require("../../constants");
+const isInsertChartMenuDisabled = (editor, readonly) => {
+  if (readonly) return true;
+  const {
+    selection
+  } = editor;
+  if (selection === null) return true;
+  if ((0, _helper.getCalloutEntry)(editor)) return true;
+  const selectedElems = (0, _core.getSelectedElems)(editor);
+  const hasVoid = selectedElems.some(elem => editor.isVoid(elem));
+  if (hasVoid) return true;
+  const isMatch = selectedElems.every(elem => {
+    const type = (0, _core.getNodeType)(elem);
+    if (type === _constants.PARAGRAPH) return true;
+    return false;
+  });
+  if (isMatch) return false; // enable
+  return true; // disable
+};
+exports.isInsertChartMenuDisabled = isInsertChartMenuDisabled;
+const generateChartNode = editor => {
+  const element = (0, _core.generateEmptyElement)(_constants.CHART);
+  const initConfig = {
+    option: {
+      id: element.id,
+      table_id: editor.tables[0]._id // Default first table
+    },
+    tables: []
+  };
+  const model = new _seaChart.ChartModel(initConfig.option, initConfig.tables);
+  return {
+    ...element,
+    stat_item: {
+      ...model,
+      type: model.config.type
+    }
+  };
+};
+exports.generateChartNode = generateChartNode;
+const insertChart = (editor, insertPosition) => {
+  const chartNode = generateChartNode(editor);
+  let path = _slate.Editor.path(editor, editor.selection)[0];
+  if (insertPosition === _constants.INSERT_POSITION.AFTER) {
+    path = path + 1;
+  }
+  _slate.Transforms.insertNodes(editor, chartNode, {
+    at: [path]
+  });
+};
+exports.insertChart = insertChart;
+const isInViewPort = element => {
+  const viewHeight = window.innerHeight || document.documentElement.clientHeight;
+  const {
+    top
+  } = element.getBoundingClientRect();
+  return top >= 0 && top <= viewHeight;
+};
+exports.isInViewPort = isInViewPort;

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

@@ -0,0 +1,55 @@
+.sdoc-chart-hover-menu-container {
+  position: absolute;
+  height: 42px;
+  z-index: 101;
+  width: auto;
+}
+  
+.sdoc-chart-hover-menu-container .hover-menu-container {
+  height: 36px;
+  padding: 7px 8px;
+  background-color: #fff;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  border-radius: 3px;
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
+  border: 1px solid #e8e8e8;
+}
+
+.sdoc-chart-hover-menu-container .hover-menu-container > span:not(:last-of-type) {
+  padding-right: 6px;
+  border-right: 1px solid #e5e5e5;
+}
+
+.sdoc-chart-hover-menu-container .hover-menu-container .op-item {
+  position: relative;
+  font-size: 12px;
+  color: #212529;
+  padding: 0 5px;
+  border-radius: 2px;
+  min-width: 24px;
+  height: 24px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.sdoc-chart-hover-menu-container .hover-menu-container .op-item:hover {
+  color: #212529;
+  text-decoration: none;
+  background: #f1f1f1;
+}
+
+.sdoc-chart-hover-menu-container .op-group-item:last-child .op-item {
+  margin-left: 8px;
+}
+
+.sdoc-chart-hover-menu-container .hover-menu-container .active {
+  background: #f1f1f1;
+}
+
+.sdoc-chart-hover-menu-container .hover-menu-container .icon-font {
+  font-size: 12px;
+  color: #999999;
+}

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

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactI18next = require("react-i18next");
+var _commons = require("../../../commons");
+var _tooltip = _interopRequireDefault(require("../../../../../components/tooltip"));
+require("./index.css");
+const ChartHoverMenu = _ref => {
+  let {
+    menuPosition,
+    onEditChart,
+    onFullscreen,
+    t
+  } = _ref;
+  const [isShowTooltip, setIsShowTooltip] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    setIsShowTooltip(true);
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(_commons.ElementPopover, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "sdoc-chart-hover-menu-container",
+    style: menuPosition
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "hover-menu-container"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "op-group-item"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    id: "sdoc_chart_edit",
+    role: "button",
+    className: "op-item",
+    onClick: onEditChart
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "sdocfont sdoc-rename icon-font"
+  }), isShowTooltip && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+    target: "sdoc_chart_edit",
+    placement: "top",
+    fade: true
+  }, t('Edit_chart')))), /*#__PURE__*/_react.default.createElement("span", {
+    className: "op-group-item"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    id: "sdoc_chart_full_screen_mode",
+    role: "button",
+    className: "op-item",
+    onClick: onFullscreen
+  }, /*#__PURE__*/_react.default.createElement("i", {
+    className: "sdocfont sdoc-fullscreen icon-font"
+  }), isShowTooltip && /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+    target: "sdoc_chart_full_screen_mode",
+    placement: "top",
+    fade: true
+  }, t('Full_screen_mode')))))));
+};
+var _default = exports.default = (0, _reactI18next.withTranslation)('sdoc-editor')(ChartHoverMenu);

package/dist/basic-sdk/extension/plugins/chart/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _constants = require("../../constants");
+var _menu = _interopRequireDefault(require("./menu"));
+var _plugin = _interopRequireDefault(require("./plugin"));
+var _renderElem = _interopRequireDefault(require("./render-elem"));
+const ChartPlugin = {
+  type: _constants.CHART,
+  nodeType: 'element',
+  editorMenus: [_menu.default],
+  editorPlugin: _plugin.default,
+  renderElements: [_renderElem.default]
+};
+var _default = exports.default = ChartPlugin;

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

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _helpers = require("../helpers");
+var _constants = require("../../../constants");
+var _dropdownMenuItem = _interopRequireDefault(require("../../../commons/dropdown-menu-item"));
+const ChartMenu = _ref => {
+  let {
+    editor,
+    readonly,
+    toggle
+  } = _ref;
+  const disabled = (0, _helpers.isInsertChartMenuDisabled)(editor, readonly);
+  const menuConfig = _constants.MENUS_CONFIG_MAP[_constants.CHART];
+  const onInsertChart = (0, _react.useCallback)(() => {
+    (0, _helpers.insertChart)(editor);
+    toggle && toggle();
+  }, [editor, toggle]);
+  return /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
+    disabled: disabled,
+    menuConfig: menuConfig,
+    onClick: onInsertChart
+  });
+};
+var _default = exports.default = ChartMenu;

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

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _constants = require("../../constants");
+const withChart = editor => {
+  const {
+    isVoid
+  } = editor;
+  const newEditor = editor;
+
+  // Rewrite isVoid
+  newEditor.isVoid = elem => {
+    const {
+      type
+    } = elem;
+    if (type === _constants.CHART) {
+      return true;
+    }
+    return isVoid(elem);
+  };
+  return newEditor;
+};
+var _default = exports.default = withChart;

package/dist/basic-sdk/extension/plugins/chart/render-elem.css

@@ -0,0 +1,64 @@
+.sdoc-chart-container {
+  width: 100%;
+  height: 300px;
+  padding: 8px;
+  cursor: pointer;
+}
+  
+.sdoc-chart-container .sdoc-chart-view {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding: 10px;
+}
+
+.sdoc-chart-container .sdoc-chart-view.init {
+  background-color: #f5f5f5;
+}
+
+.sdoc-chart-container .sdoc-chart-view .sdoc-chart-view-content {
+  width: 100%;
+  height: 100%;
+}
+  
+.sdoc-chart-container .active {
+  box-shadow: 0 0 0 2px #007bff;
+}
+
+.sdoc-chart-container .active .sdoc-chart-view-rect {
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  background-color: #007bff;
+}
+
+.sdoc-chart-container .active .sdoc-chart-view-rect-lt {
+  position: absolute;
+  left: -5px;
+  top: -5px;
+}
+
+.sdoc-chart-container .active .sdoc-chart-view-rect-lb {
+  position: absolute;
+  left: -5px;
+  bottom: -5px;
+}
+
+.sdoc-chart-container .active .sdoc-chart-view-rect-rt {
+  position: absolute;
+  right: -5px;
+  top: -5px;
+}
+
+.sdoc-chart-container .active .sdoc-chart-view-rect-rb {
+  position: absolute;
+  right: -5px;
+  bottom: -5px;
+}
+
+.sdoc-chart-container .sdoc-chart-view .sdoc-chart-tip {
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  position: absolute;
+}