@seafile/sdoc-editor 0.1.113 → 0.1.115

package/dist/api/seafile-api.js

@@ -81,6 +81,12 @@ var SeafileAPI = /*#__PURE__*/function () {
       var url = 'api/v2.1/seadoc/revisions/' + docUuid + '/?page=' + page + '&per_page=' + perPage;
       return this.req.get(url);
     }
+  }, {
+    key: "getSdocFiles",
+    value: function getSdocFiles(docUuid, p) {
+      var url = 'api/v2.1/seadoc/dir/' + docUuid + '/?p=' + p + '&doc_uuid=' + docUuid;
+      return this.req.get(url);
+    }
   }]);
   return SeafileAPI;
 }();

package/dist/basic-sdk/extension/commons/menu/menu-item.js

@@ -2,6 +2,7 @@ import React, { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import Tooltip from '../tooltip';
 import classnames from 'classnames';
+import { SDOC_LINK } from '../../constants';
 var MenuItem = function MenuItem(_ref) {
   var disabled = _ref.disabled,
     isActive = _ref.isActive,
@@ -35,7 +36,11 @@ var MenuItem = function MenuItem(_ref) {
     onClick: onClick
   }, /*#__PURE__*/React.createElement("i", {
     className: iconClass
-  })), /*#__PURE__*/React.createElement(Tooltip, {
+  }), type === SDOC_LINK && /*#__PURE__*/React.createElement("span", {
+    className: "sdoc-link-menu-item"
+  }, /*#__PURE__*/React.createElement("span", null, t(text)), /*#__PURE__*/React.createElement("i", {
+    className: "sdocfont  sdoc-drop-down"
+  }))), /*#__PURE__*/React.createElement(Tooltip, {
     target: id
   }, t(text)));
 };

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

@@ -39,6 +39,7 @@ export var ALIGN_LEFT = 'align-left';
 export var ALIGN_RIGHT = 'align-right';
 export var ALIGN_CENTER = 'align-center';
 export var CLEAR_FORMAT = 'clear-format';
+export var SDOC_LINK = 'sdoc-link';
 
 // font
 export var FONT_SIZE = 'font-size';

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

@@ -2,7 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 var _MENUS_CONFIG_MAP, _HEADER_TITLE_MAP;
 // extension plugin
 import * as ELEMENT_TYPE from './element-type';
-import { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, CLEAR_FORMAT, COLOR, HIGHLIGHT_COLOR } from './element-type';
+import { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, CLEAR_FORMAT, COLOR, HIGHLIGHT_COLOR, SDOC_LINK } from './element-type';
 import KEYBOARD from './keyboard';
 import { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BG_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BG_COLOR } from './color';
 import { SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, HEADER_FONT_SIZE } from './font';
@@ -131,6 +131,10 @@ export var MENUS_CONFIG_MAP = (_MENUS_CONFIG_MAP = {}, _defineProperty(_MENUS_CO
   id: "sdoc_".concat(CLEAR_FORMAT),
   iconClass: 'sdocfont sdoc-format-clear',
   text: 'Clear_format'
+}), _defineProperty(_MENUS_CONFIG_MAP, SDOC_LINK, {
+  id: "sdoc_".concat(SDOC_LINK),
+  iconClass: 'sdocfont sdoc-insert',
+  text: 'Insert'
 }), _MENUS_CONFIG_MAP);
 export var HEADERS = [HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6];
 export var HEADER_TITLE_MAP = (_HEADER_TITLE_MAP = {}, _defineProperty(_HEADER_TITLE_MAP, HEADER1, 'Header_one'), _defineProperty(_HEADER_TITLE_MAP, HEADER2, 'Header_two'), _defineProperty(_HEADER_TITLE_MAP, HEADER3, 'Header_three'), _defineProperty(_HEADER_TITLE_MAP, HEADER4, 'Header_four'), _defineProperty(_HEADER_TITLE_MAP, HEADER5, 'Header_five'), _defineProperty(_HEADER_TITLE_MAP, HEADER6, 'Header_six'), _defineProperty(_HEADER_TITLE_MAP, PARAGRAPH, 'Paragraph'), _HEADER_TITLE_MAP);
@@ -156,4 +160,5 @@ export var HEADER_TYPE_ARRAY = ['header1', 'header2', 'header3', 'header4', 'hea
 export var LIST_TYPE_ARRAY = ['unordered_list', 'ordered_list'];
 export var TRANSPARENT = 'transparent';
 export var CLIPBOARD_FORMAT_KEY = 'x-slate-fragment';
-export { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, ELEMENT_TYPE, KEYBOARD, DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, CLEAR_FORMAT, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BG_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BG_COLOR, SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, HEADER_FONT_SIZE };
+export var INSERT_FILE_DISPLAY_TYPE = ['text_link', 'icon_link', 'card_link'];
+export { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, BOLD, ITALIC, UNDERLINE, STRIKETHROUGH, SUPERSCRIPT, SUBSCRIPT, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, LIST_LIC, CHECK_LIST, CHECK_LIST_ITEM, LINK, HTML, CODE_BLOCK, CODE_LINE, IMAGE, TABLE, TABLE_CELL, TABLE_ROW, FORMULA, COLUMN, TEXT_STYLE, TEXT_STYLE_MORE, BOLD_ITALIC, TEXT_ALIGN, ALIGN_LEFT, ALIGN_RIGHT, ALIGN_CENTER, ELEMENT_TYPE, KEYBOARD, DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, CLEAR_FORMAT, DEFAULT_FONT_COLOR, RECENT_USED_HIGHLIGHT_COLORS_KEY, RECENT_USED_FONT_COLORS_KEY, RECENT_USED_TABLE_CELL_BG_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BG_COLOR, SPECIAL_FONT_SIZE_NAME, DEFAULT_COMMON_FONT_SIZE, FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, HEADER_FONT_SIZE, SDOC_LINK };

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

@@ -6,7 +6,7 @@ import renderElement from './render/render-element';
 import renderLeaf from './render/render-leaf';
 import { Toolbar, ContextToolbar } from './toolbar';
 var baseEditor = withHistory(withReact(createEditor()));
-var defaultEditor = Plugins.reduce(function (editor, pluginItem) {
+var defaultEditor = Plugins === null || Plugins === void 0 ? void 0 : Plugins.reduce(function (editor, pluginItem) {
   var withPlugin = pluginItem.editorPlugin;
   if (withPlugin) {
     return withPlugin(editor);

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

@@ -3,9 +3,11 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React, { useCallback, useEffect, useState, useRef } from 'react';
 import { ReactEditor, useSlateStatic, useReadOnly } from '@seafile/slate-react';
 import { Transforms } from '@seafile/slate';
+import EventBus from '../../../utils/event-bus';
 import { useScrollContext } from '../../../hooks/use-scroll-context';
 import CodeBlockHoverMenu from './hover-menu';
 import { setClipboardData } from './helpers';
+import { EXTERNAL_EVENT } from '../../../../constants';
 import '../../../assets/css/code-block.css';
 var CodeBlock = function CodeBlock(_ref) {
   var codeBlockProps = _ref.codeBlockProps;
@@ -114,10 +116,13 @@ var CodeBlock = function CodeBlock(_ref) {
       observerRefValue.removeEventListener('scroll', onScroll);
     };
   }, [onScroll, readOnly, scrollRef]);
-  var isEntering = useCallback(function (e) {
-    return !editor.operations.every(function (operation) {
-      return operation.type === 'set_selection';
-    });
+  var onHiddenHoverMenu = useCallback(function () {
+    setShowHoverMenu(false);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  useEffect(function () {
+    var eventBus = EventBus.getInstance();
+    eventBus.subscribe(EXTERNAL_EVENT.HIDDEN_CODE_BLOCK_HOVER_MENU, onHiddenHoverMenu);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   return /*#__PURE__*/React.createElement("div", {
@@ -129,7 +134,7 @@ var CodeBlock = function CodeBlock(_ref) {
     className: 'sdoc-code-block-pre'
   }, attributes), /*#__PURE__*/React.createElement("code", {
     className: "sdoc-code-block-code ".concat(white_space === 'nowrap' ? 'sdoc-code-no-wrap' : '')
-  }, children)), showHoverMenu && !isEntering() && /*#__PURE__*/React.createElement(CodeBlockHoverMenu, {
+  }, children)), showHoverMenu && /*#__PURE__*/React.createElement(CodeBlockHoverMenu, {
     menuPosition: menuPosition,
     onChangeLanguage: onChangeLanguage,
     language: element.language,

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

@@ -11,6 +11,7 @@ import TablePlugin from './table';
 import HtmlPlugin from './html';
 import TextAlignPlugin from './text-align';
 import FontPlugin from './font';
-var Plugins = [MarkDownPlugin, HtmlPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, TextAlignPlugin, FontPlugin];
+import SdocLinkPlugin from './sdoc-link';
+var Plugins = [MarkDownPlugin, HtmlPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, TextAlignPlugin, FontPlugin, SdocLinkPlugin];
 export default Plugins;
-export { MarkDownPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, HtmlPlugin, TextAlignPlugin, FontPlugin };
+export { MarkDownPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, HtmlPlugin, TextAlignPlugin, FontPlugin, SdocLinkPlugin };

package/dist/basic-sdk/extension/plugins/sdoc-link/helpers.js

@@ -0,0 +1,124 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { ReactEditor } from '@seafile/slate-react';
+import { Editor, Transforms, Range } from '@seafile/slate';
+import slugid from 'slugid';
+import context from '../../../../context';
+import { SDOC_LINK, LINK, INSERT_FILE_DISPLAY_TYPE } from '../../constants';
+import { getNodeType, getSelectedElems } from '../../core';
+export var isMenuDisabled = function isMenuDisabled(editor) {
+  if (editor.selection == null) return true;
+  var selectedElems = getSelectedElems(editor);
+  var notMatch = selectedElems.some(function (elem) {
+    var type = elem.type;
+    if (editor.isVoid(elem)) return true;
+    if (['code-block', 'code-line', 'link'].includes(type)) return true;
+    return false;
+  });
+  if (notMatch) return true; // disabled
+  return false; // enable
+};
+
+export var generateSdocFileNode = function generateSdocFileNode(uuid, text) {
+  var sdocFileNode = {
+    id: slugid.nice(),
+    type: SDOC_LINK,
+    doc_uuid: uuid,
+    title: text,
+    display_type: INSERT_FILE_DISPLAY_TYPE[0],
+    children: [{
+      id: slugid.nice(),
+      text: text || ''
+    }]
+  };
+  return sdocFileNode;
+};
+export var getType = function getType(editor) {
+  var _Editor$nodes = Editor.nodes(editor, {
+      match: function match(n) {
+        return getNodeType(n) === LINK;
+      },
+      universal: true
+    }),
+    _Editor$nodes2 = _slicedToArray(_Editor$nodes, 1),
+    match = _Editor$nodes2[0];
+  if (!match) return 'paragraph';
+  var _match = _slicedToArray(match, 1),
+    n = _match[0];
+  return getNodeType(n);
+};
+export var insertSdocFileLink = function insertSdocFileLink(editor, text, uuid) {
+  if (isMenuDisabled(editor)) return;
+
+  // Selection folded or not
+  var selection = editor.selection;
+  if (selection == null) return;
+  var isCollapsed = Range.isCollapsed(selection);
+  if (isCollapsed) {
+    // Insert Spaces before and after sdoclinks for easy operation
+    editor.insertText(' ');
+    var sdocFileNode = generateSdocFileNode(uuid, text);
+    Transforms.insertNodes(editor, sdocFileNode);
+
+    // Not being able to use insertText directly causes the added Spaces to be added to the linked text, as in the issue above, replaced by insertFragment
+    editor.insertFragment([{
+      id: slugid.nice(),
+      text: ' '
+    }]);
+  } else {
+    var selectedText = Editor.string(editor, selection); // Selected text
+    if (selectedText !== text) {
+      // If the selected text is different from the typed text, delete the text and insert the link
+      editor.deleteFragment();
+      var _sdocFileNode = generateSdocFileNode(uuid, text);
+      Transforms.insertNodes(editor, _sdocFileNode);
+    } else {
+      // If the selected text is the same as the entered text, only the link can be wrapped
+      var _sdocFileNode2 = generateSdocFileNode(uuid, text);
+      Transforms.wrapNodes(editor, _sdocFileNode2, {
+        split: true
+      });
+      Transforms.collapse(editor, {
+        edge: 'end'
+      });
+    }
+  }
+};
+export var unwrapLinkNode = function unwrapLinkNode(editor, element) {
+  if (editor.selection == null) return;
+  var path = ReactEditor.findPath(editor, element);
+  if (path) {
+    Transforms.unwrapNodes(editor, {
+      at: path
+    });
+  }
+};
+export var getParentPathNameArr = function getParentPathNameArr(fileListData, indexId, indexArray) {
+  var arr = Array.from(indexArray);
+  for (var i = 0, len = fileListData.length; i < len; i++) {
+    arr.push(fileListData[i].name);
+    if (fileListData[i].indexId === indexId) {
+      return arr;
+    }
+    var children = fileListData[i].children;
+    if (children && children.length) {
+      var result = getParentPathNameArr(children, indexId, arr);
+      if (result) return result;
+    }
+    arr.pop();
+  }
+  return null;
+};
+export var getNewFileListData = function getNewFileListData(fileListData, indexId, children) {
+  fileListData.forEach(function (item) {
+    if (item.indexId === indexId) {
+      item.children = children;
+    }
+    if (item === null || item === void 0 ? void 0 : item.children) {
+      getNewFileListData(item.children, indexId, children);
+    }
+  });
+  return fileListData;
+};
+export var getUrl = function getUrl(uuid) {
+  return context.getSdocLocalFileUrl(uuid);
+};

package/dist/basic-sdk/extension/plugins/sdoc-link/index.js

@@ -0,0 +1,11 @@
+import { SDOC_LINK } from '../../constants';
+import SdocLinkMenu from './menu';
+import withSdocLink from './plugin';
+import renderSdocLink from './render-elem';
+var SdocLinkPlugin = {
+  type: SDOC_LINK,
+  editorMenus: [SdocLinkMenu],
+  editorPlugin: withSdocLink,
+  renderElements: [renderSdocLink]
+};
+export default SdocLinkPlugin;

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/index.css

@@ -0,0 +1,54 @@
+.sdoc-link-menu {
+  position: relative;
+}
+
+.sdoc-link-menu .menu-group-item {
+  width: 72px;
+  height: 24px;
+  line-height: 24px;
+  margin-right: 8px;
+  border: none !important;
+  color: #444;
+  background-color: #fff;
+}
+
+.sdoc-link-menu .menu-group-item :first-child {
+  margin-right: 5px;
+}
+
+.sdoc-link-menu .sdoc-link-menu-popover {
+  position: absolute;
+  top: 36px;
+  left: 0px;
+  padding: 8px 0;
+  background-color: #fff;
+  border: 1px solid #e5e6e8;
+  border-radius: 2px;
+  box-shadow: 0 0 10px #ccc;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  z-index: 101;
+  white-space: nowrap;
+  width: 180px;
+}
+
+.sdoc-link-menu .sdoc-link-menu-popover .sdoc-link-menu-item {
+  cursor: pointer;
+  height: 30px;
+  width: 100%;
+  user-select: none;
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+  color: #212529;
+  padding-left: 24px;
+}
+
+.sdoc-link-menu .sdoc-link-menu-popover .sdoc-link-menu-item > span :first-child {
+  padding-right: 8px;
+}
+
+.sdoc-link-menu .sdoc-link-menu-popover .sdoc-link-menu-item:hover {
+  background-color: rgb(245, 245, 245);
+}

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

@@ -0,0 +1,71 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useCallback, useState } from 'react';
+import { withTranslation } from 'react-i18next';
+import { SDOC_LINK, MENUS_CONFIG_MAP } from '../../../constants';
+import { MenuItem } from '../../../commons';
+import { getType, isMenuDisabled } from '../helpers';
+import InsertSdocFileDialog from './sdoc-link-file-dialog';
+import './index.css';
+var SdocLinkMenu = function SdocLinkMenu(_ref) {
+  var isRichEditor = _ref.isRichEditor,
+    className = _ref.className,
+    editor = _ref.editor,
+    t = _ref.t;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    showInsertDialog = _useState2[0],
+    setShowInsertDialog = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    showInsertPopover = _useState4[0],
+    setShowInsertPopover = _useState4[1];
+  var isActive = useCallback(function () {
+    return getType(editor) === SDOC_LINK;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var isDisabled = useCallback(function () {
+    return isMenuDisabled(editor);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var onInsertFileDialogToggle = useCallback(function () {
+    setShowInsertPopover(true);
+    // setShowInsertDialog(!showInsertDialog);
+  }, []);
+  var onMouseDown = useCallback(function () {
+    onInsertFileDialogToggle();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var onInsertSdocFile = useCallback(function () {
+    setShowInsertPopover(false);
+    setShowInsertDialog(true);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var onDialogToggle = useCallback(function (value) {
+    setShowInsertDialog(value);
+  }, []);
+  var menuConfig = MENUS_CONFIG_MAP[SDOC_LINK];
+  var props = _objectSpread(_objectSpread({
+    isRichEditor: isRichEditor,
+    className: className
+  }, menuConfig), {}, {
+    disabled: isDisabled(),
+    isActive: isActive(),
+    'onMouseDown': onMouseDown,
+    type: SDOC_LINK
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-link-menu"
+  }, /*#__PURE__*/React.createElement(MenuItem, props), showInsertPopover && /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-link-menu-popover"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-link-menu-item",
+    onMouseDown: onInsertSdocFile
+  }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("i", {
+    className: "sdocfont sdoc-document"
+  })), /*#__PURE__*/React.createElement("span", null, t('Sdoc_document')))), showInsertDialog && /*#__PURE__*/React.createElement(InsertSdocFileDialog, {
+    editor: editor,
+    onDialogToggle: onDialogToggle
+  }));
+};
+export default withTranslation('sdoc-editor')(SdocLinkMenu);

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/local-files.css

@@ -0,0 +1,98 @@
+.sdoc-local-files-library {
+  color: #212529;
+  cursor: pointer;
+  font-size: 14px;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-info {
+  display: flex;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-info > span:nth-child(-n+2) {
+  padding-right: 3px;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-info :first-child {
+  transform: scale(0.6)
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .active {
+  background: #ff8000;
+  border-radius: 2px;
+  box-shadow: inset 0 0 1px #999;
+  color: #fff;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .active .sdoc-local-file-icon {
+  color: #fff;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .inactive:hover {
+  background: #fdefb9;
+  border-radius: 2px;
+  box-shadow: inset 0 0 1px #999;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .inactive > span:nth-child(-n+2) {
+  color: #9aa0ac;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-info .icon-drop-down-scale {
+  transform: scale(1.1) !important;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-info > span:nth-child(3) {
+  padding-left: 3px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  line-height: 24px;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-files {
+  padding-left: 24px;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-files .active {
+  background: #ff8000;
+  border-radius: 2px;
+  box-shadow: inset 0 0 1px #999;
+  color: #fff;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-files .inactive:hover {
+  background: #fdefb9;
+  border-radius: 2px;
+  box-shadow: inset 0 0 1px #999;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-children {
+  padding-left: 24px
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .sdoc-local-folder .sdoc-local-folder-children .inactive .sdoc-local-file-icon {
+  color: #ff9800;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .inactive:hover {
+  background: #fdefb9;
+  border-radius: 2px;
+  box-shadow: inset 0 0 1px #999;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .active {
+  background: #ff8000;
+  border-radius: 2px;
+  box-shadow: inset 0 0 1px #999;
+  color: #fff;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .active .sdoc-local-file-icon {
+  color: #fff;
+  padding-right: 5px;
+}
+
+.sdoc-local-files-library .sdoc-local-folder-container .inactive .sdoc-local-file-icon {
+  color: #ff9800;
+  padding-right: 5px;
+}

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/local-files.js

@@ -0,0 +1,133 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useCallback, useState, useRef, useEffect } from 'react';
+import { withTranslation } from 'react-i18next';
+import slugid from 'slugid';
+import context from '../../../../../context';
+import { getErrorMsg } from '../../../../../utils';
+import toaster from '../../../../../components/toast';
+import { getParentPathNameArr, getNewFileListData } from '../helpers';
+import './local-files.css';
+var LocalFiles = function LocalFiles(_ref) {
+  var onSelectedFile = _ref.onSelectedFile,
+    toggle = _ref.toggle,
+    t = _ref.t;
+  var folderRef = useRef(null);
+  var _useState = useState(new Set([])),
+    _useState2 = _slicedToArray(_useState, 2),
+    expandedFolder = _useState2[0],
+    setExpandedFolder = _useState2[1];
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    currentActiveItem = _useState4[0],
+    setCurrentActiveItem = _useState4[1];
+  var _useState5 = useState([]),
+    _useState6 = _slicedToArray(_useState5, 2),
+    fileListData = _useState6[0],
+    setFileListData = _useState6[1];
+  var collapsedFolder = useCallback(function (data, indexId) {
+    data.forEach(function (item) {
+      if (item.indexId === indexId) {
+        item.children = null;
+      }
+      if (item === null || item === void 0 ? void 0 : item.children) {
+        collapsedFolder(item.children, indexId);
+      }
+    });
+    setFileListData(_toConsumableArray(data));
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var getFileData = useCallback(function (p, indexId, fileListData) {
+    context.getSdocLocalFiles(p).then(function (res) {
+      res.data.forEach(function (item) {
+        item.indexId = slugid.nice();
+      });
+      // Open folder
+      if (indexId && fileListData.length > 0) {
+        var newFileListData = getNewFileListData(fileListData, indexId, res.data);
+        setFileListData(_toConsumableArray(newFileListData));
+        return;
+      }
+      // First load
+      setFileListData(res.data);
+    }).catch(function (error) {
+      toggle();
+      var errorMessage = getErrorMsg(error);
+      toaster.danger(errorMessage);
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  useEffect(function () {
+    getFileData('/');
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var onToggle = useCallback(function (e, item, fileListData) {
+    e.stopPropagation();
+    if (expandedFolder.has(item.indexId)) {
+      collapsedFolder(fileListData, item.indexId);
+      expandedFolder.delete(item.indexId);
+    } else {
+      var pathNameArr = getParentPathNameArr(fileListData, item.indexId, []);
+      var p = pathNameArr.join('/');
+      getFileData(p, item.indexId, fileListData);
+      expandedFolder.add(item.indexId);
+    }
+    setCurrentActiveItem(item);
+    setExpandedFolder(new Set(Array.from(expandedFolder)));
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [expandedFolder]);
+  var onSelectFile = useCallback(function (e, file) {
+    e.stopPropagation();
+    setCurrentActiveItem(file);
+    onSelectedFile(file);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var renderFileTree = useCallback(function (data) {
+    if (!Array.isArray(data)) {
+      return null;
+    }
+    return data.map(function (item) {
+      var _item$children, _item$children2;
+      return /*#__PURE__*/React.createElement("div", {
+        key: item.indexId,
+        className: "sdoc-local-folder-container"
+      }, item.type === 'dir' && /*#__PURE__*/React.createElement("div", {
+        ref: folderRef,
+        className: "sdoc-local-folder",
+        onClick: function onClick(e) {
+          onToggle(e, item, fileListData);
+        }
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-local-folder-info ".concat((currentActiveItem === null || currentActiveItem === void 0 ? void 0 : currentActiveItem.indexId) === item.indexId ? 'active' : 'inactive')
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "".concat(expandedFolder.has(item.indexId) ? 'icon-drop-down-scale' : '')
+      }, /*#__PURE__*/React.createElement("i", {
+        className: "sdocfont ".concat(expandedFolder.has(item.indexId) ? 'sdoc-drop-down' : 'sdoc-right-slide')
+      })), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("i", {
+        className: "sdocfont sdoc-file"
+      })), /*#__PURE__*/React.createElement("span", {
+        className: "sdoc-folder-name"
+      }, item.name)), /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-local-folder-children"
+      }, (item === null || item === void 0 ? void 0 : (_item$children = item.children) === null || _item$children === void 0 ? void 0 : _item$children.length) === 0 && /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-local-folder-children-empty"
+      }, t('Empty')), (item === null || item === void 0 ? void 0 : (_item$children2 = item.children) === null || _item$children2 === void 0 ? void 0 : _item$children2.length) > 0 && renderFileTree(item.children))), item.type === 'file' && /*#__PURE__*/React.createElement("div", {
+        className: "sdoc-local-file-item ".concat((currentActiveItem === null || currentActiveItem === void 0 ? void 0 : currentActiveItem.indexId) === item.indexId ? 'active' : 'inactive'),
+        onClick: function onClick(e) {
+          onSelectFile(e, item);
+        }
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "sdoc-local-file-icon"
+      }, /*#__PURE__*/React.createElement("i", {
+        className: "sdocfont sdoc-document"
+      })), /*#__PURE__*/React.createElement("span", {
+        className: "sdoc-local-file-name"
+      }, item.name)));
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [fileListData, currentActiveItem, expandedFolder]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-local-files-library"
+  }, renderFileTree(fileListData));
+};
+export default withTranslation('sdoc-editor')(LocalFiles);

package/dist/basic-sdk/extension/plugins/sdoc-link/menu/sdoc-link-file-dialog.css

@@ -0,0 +1,35 @@
+.sdoc-file-addition-container {
+  display: flex;
+  flex-direction: row;
+}
+
+.sdoc-file-addition-left {
+  border-right: 1px solid #e9ecef;
+  width: 150px;
+  padding: 12px 8px;
+}
+
+.sdoc-file-addition-left .sdoc-addition-item {
+  padding: 5px 0 5px 8px;
+  border-radius: 3px;
+  display: inline-block;
+  cursor: pointer;
+  width: 100%;
+}
+
+.sdoc-file-addition-left .sdoc-addition-item:hover {
+  background-color: #f5f5f5;
+}
+
+.sdoc-file-addition-container .sdoc-file-addition-left .selected-sdoc-addition-item {
+  background-color: #ff8000;
+  color: #fff;
+}
+
+.sdoc-file-addition-right {
+  height: 440px;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding: 16px 16px;
+  width: 470px;
+}