@seafile/sdoc-editor 0.3.16 → 0.3.18

package/dist/assets/css/simple-editor.css

@@ -1,6 +1,6 @@
 /* reset common css */
 .sdoc-editor-page-wrapper .dropdown-item,
-.sdoc-context-menu .dropdown-item {
+.sdoc-context-menu .dropdown-item:not(:disabled) {
   color: #212529;
 }
 

package/dist/basic-sdk/comment/components/editor-comment.js

@@ -8,6 +8,7 @@ import { useSelectionElement } from '../../hooks/use-selection-element';
 import { useCommentContext } from '../hooks/comment-hooks/use-comment-context';
 import ElementsCommentCount from './elements-comment-count';
 import { ELEMENT_TYPE } from '../../extension/constants';
+import { Z_INDEX } from '../../constants';
 const EditorComment = _ref => {
   let {
     deleteUnseenNotifications
@@ -55,7 +56,8 @@ const EditorComment = _ref => {
       top: '-99999px'
     };
     return {
-      top: cursor.y
+      top: cursor.y,
+      zIndex: Z_INDEX.COMMENT_ADD
     };
   }, [cursor, isShowComments, selectionElement, element_comments_map]);
   const hiddenComment = useCallback(() => {
@@ -77,7 +79,8 @@ const EditorComment = _ref => {
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-add-comment mr-1"
   }))), /*#__PURE__*/React.createElement(ElementsCommentCount, {
-    elementCommentsMap: element_comments_map
+    elementCommentsMap: element_comments_map,
+    selectionElement: selectionElement
   }), /*#__PURE__*/React.createElement("div", {
     className: "comment-list-wrapper",
     style: isShowComments ? {

package/dist/basic-sdk/comment/components/elements-comment-count/element-comment-count.js

@@ -5,9 +5,11 @@ import { useScrollContext } from '../../../hooks/use-scroll-context';
 import { getElementCommentCountTop } from '../../helper';
 import { eventStopPropagation } from '../../../utils/mouse-event';
 import { focusToCommentElement } from '../../utils';
+import { Z_INDEX } from '../../../constants';
 const ElementCommentCount = _ref => {
   let {
     elementId,
+    isElementSelected,
     commentsCount
   } = _ref;
   const editor = useSlateStatic();
@@ -24,13 +26,17 @@ const ElementCommentCount = _ref => {
     const scrollTop = (scrollRef === null || scrollRef === void 0 ? void 0 : (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTop) || 0;
     const newTop = getElementCommentCountTop(editor, element, scrollTop);
     setTop(newTop);
-  }, [editor, elementId, element, scrollRef]);
+  }, [editor, elementId, element, scrollRef, isElementSelected]);
   if (!element) return null;
+  let style = {
+    top
+  };
+  if (isElementSelected) {
+    style['zIndex'] = Z_INDEX.ACTIVE_COMMENT_COUNT;
+  }
   return /*#__PURE__*/React.createElement("div", {
     className: "element-comments-count",
-    style: {
-      top
-    },
+    style: style,
     onClick: onClick
   }, /*#__PURE__*/React.createElement("i", {
     className: "sdocfont sdoc-comment-count"

package/dist/basic-sdk/comment/components/elements-comment-count/index.js

@@ -3,7 +3,8 @@ import ElementCommentCount from './element-comment-count';
 import './index.css';
 const ElementsCommentCount = _ref => {
   let {
-    elementCommentsMap
+    elementCommentsMap,
+    selectionElement
   } = _ref;
   if (!elementCommentsMap) return null;
   return /*#__PURE__*/React.createElement("div", {
@@ -14,9 +15,11 @@ const ElementsCommentCount = _ref => {
     const unresolvedComment = comments.filter(item => !item.resolved);
     const unresolvedCommentCount = unresolvedComment.length;
     if (unresolvedCommentCount === 0) return null;
+    const isSelected = selectionElement.id === elementId;
     return /*#__PURE__*/React.createElement(ElementCommentCount, {
       key: elementId,
       elementId: elementId,
+      isElementSelected: isSelected,
       commentsCount: unresolvedCommentCount
     });
   }));

package/dist/basic-sdk/comment/components/style.css

@@ -25,6 +25,7 @@
 
 .sdoc-comment-container .comment-container-right .comment-add-wrapper .sdocfont {
   color: #999;
+  background-color: #FFF;
 }
 
 .sdoc-comment-container .comment-container-right .comment-add-wrapper .sdocfont:hover {

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

@@ -1,3 +1,4 @@
+import * as Z_INDEX from './z-index';
 export const INTERNAL_EVENT = {
   CANCEL_TABLE_SELECT_RANGE: 'cancel_table_select_range',
   SET_TABLE_SELECT_RANGE: 'set_table_select_range',
@@ -41,4 +42,5 @@ export const REBASE_ORIGIN = {
   OTHER: 'other',
   MY: 'my'
 };
-export const REBASE_MARKS = [REBASE_MARK_KEY.ORIGIN, REBASE_MARK_KEY.REBASE_TYPE, REBASE_MARK_KEY.MODIFY_TYPE, REBASE_MARK_KEY.OLD_ELEMENT];
+export const REBASE_MARKS = [REBASE_MARK_KEY.ORIGIN, REBASE_MARK_KEY.REBASE_TYPE, REBASE_MARK_KEY.MODIFY_TYPE, REBASE_MARK_KEY.OLD_ELEMENT];
+export { Z_INDEX };

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

@@ -0,0 +1,2 @@
+export const ACTIVE_COMMENT_COUNT = 1;
+export const COMMENT_ADD = 2;

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

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useState, useRef } from 'react';
-import CustomTableSizeDialog from '../../plugins/table/dialog/custom-table-size-dialog';
+import { CustomTableSizeDialog, SplitCellSettingDialog } from '../../plugins/table/dialogs';
 import AddLinkDialog from '../../plugins/link/dialog/add-link-dialog';
 import SelectFileDialog from '../select-file-dialog/index.js';
 import EventBus from '../../../utils/event-bus';
@@ -77,6 +77,10 @@ const InsertElementDialog = _ref => {
       {
         return /*#__PURE__*/React.createElement(CustomTableSizeDialog, props);
       }
+    case ELEMENT_TYPE.TABLE_CELL:
+      {
+        return /*#__PURE__*/React.createElement(SplitCellSettingDialog, props);
+      }
     case ELEMENT_TYPE.LINK:
       {
         return /*#__PURE__*/React.createElement(AddLinkDialog, props);

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

@@ -5,7 +5,7 @@ export { DEFAULT_COLORS, STANDARD_COLORS, DEFAULT_RECENT_USED_LIST, DEFAULT_FONT
 export { FONT_SIZE, DEFAULT_FONT, FONT, GOOGLE_FONT_CLASS, RECENT_USED_FONTS_KEY, SDOC_FONT_SIZE } from './font';
 export { DIFF_TYPE, ADDED_STYLE, DELETED_STYLE } from './diff-view';
 export { KEYBOARD, MAC_HOTKEYS, WIN_HOTKEYS } from './keyboard';
-export { UNDO, REDO, TEXT_STYLE, TEXT_STYLE_MAP, TEXT_STYLE_MORE, TEXT_ALIGN, REMOVE_TABLE, CLEAR_FORMAT, MENUS_CONFIG_MAP, SIDE_TRANSFORM_MENUS_CONFIG, SIDE_INSERT_MENUS_CONFIG } from './menus-config';
+export { UNDO, REDO, TEXT_STYLE, TEXT_STYLE_MAP, TEXT_STYLE_MORE, TEXT_ALIGN, REMOVE_TABLE, COMBINE_CELL, CLEAR_FORMAT, MENUS_CONFIG_MAP, SIDE_TRANSFORM_MENUS_CONFIG, SIDE_INSERT_MENUS_CONFIG } from './menus-config';
 export const HEADERS = [HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6];
 export const HEADER_TITLE_MAP = {
   [TITLE]: 'Title',

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

@@ -4,6 +4,7 @@ export const UNDO = 'undo';
 export const REDO = 'redo';
 export const CLEAR_FORMAT = 'clear_format';
 export const REMOVE_TABLE = 'remove_table';
+export const COMBINE_CELL = 'combine_cell';
 
 // text style
 export const TEXT_STYLE = 'text_style';
@@ -89,6 +90,11 @@ export const MENUS_CONFIG_MAP = {
     iconClass: 'sdocfont sdoc-delete-table',
     text: 'Delete_table'
   },
+  [COMBINE_CELL]: {
+    id: "sdoc_".concat(COMBINE_CELL),
+    iconClass: 'sdocfont sdoc-merge-cell',
+    text: 'Combine_cell'
+  },
   [TEXT_STYLE]: [{
     id: ITALIC,
     iconClass: 'sdocfont sdoc-italic',

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

@@ -1,4 +1,4 @@
-export const TABLE_MAX_ROWS = 50;
+export const TABLE_MAX_ROWS = 500;
 export const TABLE_MAX_COLUMNS = 50;
 export const EMPTY_SELECTED_RANGE = {
   minRowIndex: -1,

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

@@ -0,0 +1,3 @@
+import CustomTableSizeDialog from './custom-table-size-dialog';
+import SplitCellSettingDialog from './split-cell-setting-dialog';
+export { CustomTableSizeDialog, SplitCellSettingDialog };

package/dist/basic-sdk/extension/plugins/table/dialogs/split-cell-setting-dialog.js

@@ -0,0 +1,99 @@
+import React, { useCallback, useState } from 'react';
+import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Alert, Row, Col, FormGroup, Label, Input } from 'reactstrap';
+import { useTranslation } from 'react-i18next';
+import { getSelectedInfo, splitCell } from '../helpers';
+const SplitCellSettingDialog = _ref => {
+  let {
+    editor,
+    closeDialog
+  } = _ref;
+  const {
+    t
+  } = useTranslation();
+  const {
+    cell
+  } = getSelectedInfo(editor);
+  const {
+    rowspan = 1,
+    colspan = 1
+  } = cell;
+  const [rowNumber, setRowNumber] = useState(rowspan);
+  const [columnNumber, setColumnNumber] = useState(colspan);
+  const CELL_SPLIT_MAX_ROWS = rowspan;
+  const CELL_SPLIT_MAX_COLUMNS = colspan;
+  const [errorMessage, setErrorMessage] = useState('');
+  const onRowNumberChange = useCallback(e => {
+    setRowNumber(e.target.value);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const onColumnNumberChange = useCallback(e => {
+    setColumnNumber(e.target.value);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const handleSubmit = useCallback(() => {
+    const parsedRowNumber = parseInt(rowNumber);
+    const parsedColumnNumber = parseInt(columnNumber);
+    if (!parsedRowNumber || !parsedColumnNumber || parsedRowNumber < 0 || parsedColumnNumber < 0) {
+      setErrorMessage(t('Please_enter_a_non-negative_integer'));
+      return false;
+    }
+    let targetRowNumber = parsedRowNumber;
+    let targetColumnNumber = parsedColumnNumber;
+    if (parsedRowNumber > CELL_SPLIT_MAX_ROWS) {
+      targetRowNumber = CELL_SPLIT_MAX_ROWS;
+      setRowNumber(targetRowNumber);
+      setErrorMessage(t('The_maximum_row_number_is_{number}').replace('{number}', CELL_SPLIT_MAX_ROWS));
+      return false;
+    }
+    if (parsedColumnNumber > CELL_SPLIT_MAX_COLUMNS) {
+      targetColumnNumber = CELL_SPLIT_MAX_COLUMNS;
+      setColumnNumber(targetColumnNumber);
+      setErrorMessage(t('The_maximum_column_number_is_{number}').replace('{number}', CELL_SPLIT_MAX_COLUMNS));
+      return false;
+    }
+    splitCell(editor, targetRowNumber, targetColumnNumber);
+    closeDialog();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [rowNumber, columnNumber]);
+  return /*#__PURE__*/React.createElement(Modal, {
+    isOpen: true,
+    autoFocus: false,
+    toggle: closeDialog,
+    zIndex: 1071,
+    returnFocusAfterClose: true
+  }, /*#__PURE__*/React.createElement(ModalHeader, {
+    toggle: closeDialog
+  }, t('Split_cell')), /*#__PURE__*/React.createElement(ModalBody, null, /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
+    md: 6
+  }, /*#__PURE__*/React.createElement(FormGroup, null, /*#__PURE__*/React.createElement(Label, {
+    for: "row-number"
+  }, t('Row_number')), /*#__PURE__*/React.createElement(Input, {
+    id: "row-number",
+    name: "row-number",
+    type: "number",
+    min: 1,
+    value: rowNumber,
+    onChange: onRowNumberChange
+  }))), /*#__PURE__*/React.createElement(Col, {
+    md: 6
+  }, /*#__PURE__*/React.createElement(FormGroup, null, /*#__PURE__*/React.createElement(Label, {
+    for: "column-number"
+  }, t('Column_number')), /*#__PURE__*/React.createElement(Input, {
+    id: "column-number",
+    name: "column-number",
+    type: "number",
+    min: 1,
+    value: columnNumber,
+    onChange: onColumnNumberChange
+  })))), errorMessage && /*#__PURE__*/React.createElement(Alert, {
+    className: "mt-2 mb-0",
+    color: "danger"
+  }, t(errorMessage))), /*#__PURE__*/React.createElement(ModalFooter, null, /*#__PURE__*/React.createElement(Button, {
+    color: "secondary",
+    onClick: closeDialog
+  }, t('Cancel')), /*#__PURE__*/React.createElement(Button, {
+    color: "primary",
+    onClick: handleSubmit
+  }, t('Submit'))));
+};
+export default SplitCellSettingDialog;