@seafile/seafile-editor 1.0.4-1 → 1.0.4-10

package/dist/constants/event-types.js

@@ -6,5 +6,6 @@ export const INTERNAL_EVENTS = {
   ON_OPEN_FORMULA_DIALOG: 'on_open_formula_dialog'
 };
 export const EXTERNAL_EVENTS = {
-  ON_HELP_INFO_TOGGLE: 'on_help_info_toggle'
+  ON_HELP_INFO_TOGGLE: 'on_help_info_toggle',
+  ON_LINK_CLICK: 'on_link_click'
 };

package/dist/editors/simple-slate-editor /index.js

@@ -6,7 +6,7 @@ import EventBus from '../../utils/event-bus';
 import EventProxy from '../../utils/event-handler';
 import withPropsEditor from './with-props-editor';
 import { focusEditor } from '../../extension/core';
-import '../../assets/css/slate-editor.css';
+import './style.css';
 export default function SimpleSlateEditor(_ref) {
   let {
     value,
@@ -51,7 +51,7 @@ export default function SimpleSlateEditor(_ref) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   return /*#__PURE__*/React.createElement("div", {
-    className: "sf-slate-editor-container"
+    className: "sf-simple-slate-editor-container"
   }, /*#__PURE__*/React.createElement(Toolbar, {
     editor: editor,
     isSupportFormula: isSupportFormula

package/dist/editors/simple-slate-editor /style.css

@@ -0,0 +1,72 @@
+.sf-simple-slate-editor-container {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  min-width: 0;
+}
+
+.sf-simple-slate-editor-container .sf-slate-editor-toolbar {
+  display: flex;
+  justify-content: flex-start;
+  height: 44px;
+  align-items: center;
+  padding: 0 10px;
+  background-color: #fff;
+  user-select: none;
+  border-bottom: 1px solid #e5e6e8;
+  position: relative;
+  z-index: 102;
+}
+
+.sf-simple-slate-editor-container .sf-slate-editor-content {
+  width: 100%;
+  height: calc(100% - 44px);
+  display: flex;
+  background: #f5f5f5;
+  position: relative;
+  min-height: 0;
+}
+
+.sf-simple-slate-editor-container .sf-slate-scroll-container,
+  .sf-simple-slate-editor-container .sf-slate-article-container {
+  height: 100%;
+  width: 100%;
+  overflow: auto;
+}
+
+/* .sf-simple-slate-editor-container .sf-slate-article-container {
+  flex: 1;
+  position: relative;
+  max-width: 950px;
+  min-width: 400px;
+  margin: 0 auto;
+  padding-top: 20px;
+  padding-bottom: 20px;
+} */
+
+.sf-simple-slate-editor-container .sf-slate-editor-content .article {
+  margin: 0;
+  padding: 10px;
+  height: 100%;
+  border: none;
+  background-color: #fff;
+}
+
+.sf-simple-slate-editor-container .sf-slate-editor-content .article div:first-child {
+  outline: none;
+}
+
+.sf-simple-slate-editor-container ::-webkit-scrollbar{
+  width: 8px;
+  height: 8px;
+}
+
+.sf-simple-slate-editor-container ::-webkit-scrollbar-button {
+  display: none;
+}
+
+.sf-simple-slate-editor-container ::-webkit-scrollbar-thumb {
+  background-color: rgb(206, 206, 212);
+  border-radius: 10px;
+}

package/dist/editors/slate-editor/index.js

@@ -8,7 +8,7 @@ import withPropsEditor from './with-props-editor';
 import EditorHelp from './editor-help';
 import { focusEditor } from '../../extension/core';
 import { ScrollContext } from '../../hooks/use-scroll-context';
-import '../../assets/css/slate-editor.css';
+import './style.css';
 export default function SlateEditor(_ref) {
   let {
     value,
@@ -28,10 +28,14 @@ export default function SlateEditor(_ref) {
   }, [editor]);
   const onChange = useCallback(value => {
     setSlateValue(value);
-    onSave && onSave(value);
+    const operations = editor.operations;
+    const modifyOps = operations.filter(o => o.type !== 'set_selection');
+    if (modifyOps.length > 0) {
+      onSave && onSave(value);
+    }
     const eventBus = EventBus.getInstance();
     eventBus.dispatch('change');
-  }, [onSave]);
+  }, [editor.operations, onSave]);
 
   // useMount: focus editor
   useEffect(() => {

package/dist/{assets/css/slate-editor.css → editors/slate-editor/style.css}

@@ -3,6 +3,7 @@
   display: flex;
   flex-direction: column;
   min-height: 0;
+  min-width: 0;
 }
 
 .sf-slate-editor-container .sf-slate-editor-toolbar {

package/dist/editors/slate-viewer/index.js

@@ -7,15 +7,17 @@ import './style.css';
 export default function SlateViewer(_ref) {
   let {
     value,
-    isShowOutline
+    isShowOutline,
+    scrollRef: externalScrollRef
   } = _ref;
   const scrollRef = useRef(null);
+  const containerScrollRef = externalScrollRef ? externalScrollRef : scrollRef;
   return /*#__PURE__*/React.createElement(Slate, {
     editor: baseEditor,
     initialValue: value
   }, /*#__PURE__*/React.createElement(ScrollContext.Provider, {
     value: {
-      scrollRef
+      scrollRef: containerScrollRef
     }
   }, /*#__PURE__*/React.createElement("div", {
     ref: scrollRef,

package/dist/editors/slate-viewer/style.css

@@ -5,7 +5,6 @@
   min-width: 0;
   overflow: auto;
   background: #f4f4f4;
-  border: 1px solid #ededed;
   padding: 30px 0 15px;
 }
 
@@ -37,4 +36,27 @@
   background: #fff;
 }
 
+@media (max-width: 991.98px) {
+  .sf-slate-viewer-outline {
+    display: none !important;
+  }
+}
+
+@media (max-width: 768px) {
+  .sf-slate-viewer-article-container {
+    padding: 0 10px;
+    width: 100%;
+    margin: 0 !important;
+  }
+
+  .sf-slate-viewer-article-container .article {
+    margin: 0 !important;
+    padding: 20px !important;
+  }
+
+  .sf-slate-viewer-outline {
+    display: none !important;
+  }
+}
+
 

package/dist/extension/plugins/link/helper.js

@@ -92,12 +92,12 @@ export const insertLink = props => {
   const isCollapsed = Range.isCollapsed(selection);
   if (isCollapsed) {
     // If selection is collapsed, we insert a space and then insert link node that help operation easier
-    editor.insertText(' ');
+    editor.insertText('');
     Editor.insertFragment(editor, [linkNode]);
     // Using insertText directly causes the added Spaces to be added to the linked text, as in the issue above, so replaced by insertFragment
     Editor.insertFragment(editor, [{
       id: slugid.nice(),
-      text: ' '
+      text: ''
     }]);
     focusEditor(editor);
     return;

package/dist/extension/plugins/link/render-elem/index.js

@@ -5,7 +5,7 @@ import { useReadOnly } from 'slate-react';
 import LinkPopover from './link-popover';
 import { getLinkInfo } from '../helper';
 import EventBus from '../../../../utils/event-bus';
-import { INTERNAL_EVENTS } from '../../../../constants/event-types';
+import { EXTERNAL_EVENTS, INTERNAL_EVENTS } from '../../../../constants/event-types';
 import './style.css';
 const renderLink = (_ref, editor) => {
   let {
@@ -30,11 +30,14 @@ const renderLink = (_ref, editor) => {
   const unregisterClickEvent = useCallback(() => {
     document.removeEventListener('click', onClosePopover);
   }, [onClosePopover]);
-  const onOpenPopover = useCallback(e => {
-    if (isReadonly) return;
+  const onLinkClick = useCallback(e => {
     e.stopPropagation();
-    // Only one popover can be open at the same time, close other popover and update new popover controller function.
     const eventBus = EventBus.getInstance();
+    if (isReadonly) {
+      eventBus.dispatch(EXTERNAL_EVENTS.ON_LINK_CLICK, e);
+      return;
+    }
+    // Only one popover can be open at the same time, close other popover and update new popover controller function.
     eventBus.dispatch(INTERNAL_EVENTS.ON_CLOSE_LINK_POPOVER);
     eventBus.subscribe(INTERNAL_EVENTS.ON_CLOSE_LINK_POPOVER, () => setIsShowPopover(false));
     const linkInfo = getLinkInfo(editor);
@@ -54,7 +57,8 @@ const renderLink = (_ref, editor) => {
     registerClickEvent();
   }, [editor, isReadonly, registerClickEvent]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", Object.assign({
-    onClick: onOpenPopover,
+    onClick: onLinkClick,
+    "data-url": element.url,
     className: classNames('sf-virtual-link', {
       selected: isShowPopover
     })

package/dist/extension/toolbar/header-toolbar/index.js

@@ -65,7 +65,7 @@ const Toolbar = _ref => {
   };
   return /*#__PURE__*/React.createElement("div", {
     className: "sf-slate-editor-toolbar"
-  }, /*#__PURE__*/React.createElement(MenuGroup, null), /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(HeaderMenu, commonProps)), /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(TextStyleMenu, Object.assign({}, commonProps, {
+  }, isRichEditor && /*#__PURE__*/React.createElement(MenuGroup, null), /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(HeaderMenu, commonProps)), /*#__PURE__*/React.createElement(MenuGroup, null, /*#__PURE__*/React.createElement(TextStyleMenu, Object.assign({}, commonProps, {
     type: TEXT_STYLE_MAP.BOLD
   })), /*#__PURE__*/React.createElement(TextStyleMenu, Object.assign({}, commonProps, {
     type: TEXT_STYLE_MAP.ITALIC

package/dist/pages/markdown-view.js

@@ -9,6 +9,7 @@ export default function MarkdownViewer(_ref) {
     value,
     mathJaxSource,
     isShowOutline,
+    scrollRef,
     beforeRenderCallback
   } = _ref;
   const [richValue, setRichValue] = useState([]);
@@ -28,7 +29,8 @@ export default function MarkdownViewer(_ref) {
   const props = {
     isSupportFormula: !!mathJaxSource,
     value: richValue,
-    isShowOutline: isShowOutline
+    isShowOutline: isShowOutline,
+    scrollRef: scrollRef
   };
   if (isFetching || isLoading || isLoadingMathJax) {
     return /*#__PURE__*/React.createElement(Loading, null);

package/dist/slate-convert/md-to-slate/transform.js

@@ -274,7 +274,7 @@ export const transformHtml = node => {
     } = new DOMParser().parseFromString(node.value, 'text/html');
     const img = body.firstChild;
     const src = img.getAttribute('src');
-    if (src) return defaultTextNode;
+    if (!src) return defaultTextNode;
     const alt = img.getAttribute('alt');
     const title = img.getAttribute('title');
     const width = img.getAttribute('width');
@@ -304,6 +304,13 @@ export const transformHtml = node => {
   }
   return defaultTextNode;
 };
+export const transformBlockHtml = node => {
+  return {
+    id: slugid.nice(),
+    type: PARAGRAPH,
+    children: transformHtml(node)
+  };
+};
 export const transformMath = node => {
   return {
     id: slugid.nice(),
@@ -323,7 +330,8 @@ const elementHandlers = {
   // ordered_list | unordered_list | check_list_item
   'code': transformCodeBlock,
   'thematicBreak': transformHr,
-  'math': transformMath
+  'math': transformMath,
+  'html': transformBlockHtml
 };
 export const formatMdToSlate = children => {
   const validChildren = children.filter(child => elementHandlers[child.type]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seafile/seafile-editor",
-  "version": "1.0.4-1",
+  "version": "1.0.4-10",
   "description": "",
   "main": "dist/index.js",
   "scripts": {