@seafile/sdoc-editor 1.0.32 → 1.0.34

package/dist/basic-sdk/assets/css/dropdown-menu.css

@@ -3,6 +3,11 @@
   min-width: 12rem;
 }
 
+.sdoc-dropdown-menu .sdoc-seatable-selected-table-list-wrapper {
+  max-height: 300px;
+  overflow: auto;
+}
+
 .sdoc-dropdown-menu .sdoc-dropdown-menu-divider {
   width: 100%;
   height: 0;

package/dist/basic-sdk/extension/commons/color-menu/index.css

@@ -28,7 +28,7 @@
 }
 
 .menu-group .sdoc-color-menu.disabled .sdoc-color-toggle {
-  display: none;
+  /* display: none; */
 }
 
 .sdoc-color-menu .sdoc-color-icon {

package/dist/basic-sdk/extension/commons/menu/menu.css

@@ -52,7 +52,6 @@
 
 .menu-group .menu-group-item.sdoc-menu-with-dropdown.disabled {
   color: #999;
-  width: 24px !important;
 }
 
 .sdoc-menu-with-dropdown:not(.disabled):hover {

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

@@ -1,6 +1,6 @@
 import isHotkey from 'is-hotkey';
 import { Editor, Node, Range, Transforms } from '@seafile/slate';
-import { PARAGRAPH, INSERT_POSITION, CODE_BLOCK, CALL_OUT } from '../../constants';
+import { PARAGRAPH, INSERT_POSITION, CODE_BLOCK, CALL_OUT, ORDERED_LIST, UNORDERED_LIST } from '../../constants';
 import { getSelectedNodeEntryByType, isSelectionAtBlockStart } from '../../core';
 import { deleteCalloutIcon, getCalloutEntry, isCalloutContentEmpty, unwrapCallout } from './helper';
 import { insertElement } from '../../toolbar/side-toolbar/helpers';
@@ -56,9 +56,12 @@ const withCallout = editor => {
           if (parentNodeEntry && parentNodeEntry[0].type === CALL_OUT) {
             if (!Node.string(paragraphEntry[0]).length) {
               insertFragment(data);
-              return Transforms.removeNodes(newEditor, {
-                at: paragraphEntry[1]
-              });
+              if ([ORDERED_LIST, UNORDERED_LIST].includes(data[0].type)) {
+                Transforms.removeNodes(newEditor, {
+                  at: paragraphEntry[1]
+                });
+              }
+              return;
             }
           }
         }

package/dist/basic-sdk/extension/plugins/seatable-column/menu/column-list-menu.css

@@ -8,7 +8,7 @@
     background-color: #fff;
     min-width: 12rem;
     width: 200px;
-    max-height: 400px;
+    max-height: 300px;
     overflow: auto;
     padding: 8px 0;
 }

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

@@ -30,10 +30,11 @@ const Column = _ref => {
       setIsClicked(false);
     }
   }, [isSelected, isReadOnly]);
-  const style = _objectSpread(_objectSpread({}, isClicked && {
+  const style = _objectSpread({
+    margin: '0 10px',
+    border: '1px solid transparent'
+  }, isClicked && {
     border: '1px solid red'
-  }), {}, {
-    margin: '0 10px'
   });
   return /*#__PURE__*/React.createElement("span", Object.assign({}, attributes, {
     style: style

package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/collaborator-wrapper.js

@@ -0,0 +1,101 @@
+import _CreatorFormatter from "dtable-ui-component/lib/CreatorFormatter";
+import _CollaboratorFormatter from "dtable-ui-component/lib/CollaboratorFormatter";
+import _Loading from "dtable-ui-component/lib/Loading";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import React from 'react';
+import EventBus from '../../../../utils/event-bus';
+import { EXTERNAL_EVENT } from '../../../../../constants';
+function withCollaborators(Component) {
+  return class Wrapper extends React.Component {
+    constructor(props) {
+      super(props);
+      _defineProperty(this, "getFormattedCellValue", () => {
+        const {
+          value
+        } = this.props;
+        if (!value || Array.isArray(value) && value.length === 0) {
+          return null;
+        }
+        const isSingleValue = value && !Array.isArray(value);
+        const formattedCellValue = isSingleValue ? [value] : value;
+        return formattedCellValue;
+      });
+      _defineProperty(this, "onCollaboratorsChanged", emailUserMap => {
+        const {
+          isLoading
+        } = this.state;
+        if (!isLoading) return;
+        const cellValue = this.getFormattedCellValue();
+        if (!cellValue) {
+          this.setState({
+            isLoading: false,
+            collaborators: []
+          });
+          // this.unsubscribeUsersChanged();
+          return;
+        }
+        const collaborators = cellValue.map(email => emailUserMap[email]).filter(Boolean);
+        if (collaborators.length === cellValue.length) {
+          this.setState({
+            isLoading: false,
+            collaborators: collaborators
+          });
+          // this.unsubscribeUsersChanged();
+          return;
+        }
+
+        // nothing todo
+      });
+      this.state = {
+        isLoading: true,
+        collaborators: []
+      };
+    }
+    async componentDidMount() {
+      // TODO: Cheating, non-compliant operations
+      const {
+        collaboratorManager
+      } = window.seafile || window.seafileConfig;
+      const cellValue = this.getFormattedCellValue();
+      if (!cellValue) {
+        this.setState({
+          isLoading: false,
+          collaborators: []
+        });
+        return;
+      }
+      const emailUserMap = await collaboratorManager.getEmailUserMap(cellValue);
+      if (emailUserMap) {
+        const collaborators = cellValue.map(email => emailUserMap[email]);
+        this.setState({
+          isLoading: false,
+          collaborators: collaborators
+        });
+        return;
+      }
+      const eventBus = EventBus.getInstance();
+      this.unsubscribeUsersChanged = eventBus.subscribe(EXTERNAL_EVENT.COLLABORATORS_UPDATED, this.onCollaboratorsChanged);
+    }
+    render() {
+      const {
+        isLoading,
+        collaborators
+      } = this.state;
+      if (isLoading) {
+        return /*#__PURE__*/React.createElement(_Loading, null);
+      }
+      const {
+        value,
+        containerClassName
+      } = this.props;
+      return /*#__PURE__*/React.createElement(Component, {
+        collaborators: collaborators,
+        value: value,
+        containerClassName: containerClassName
+      });
+    }
+  };
+}
+const CustomCollaboratorFormatter = withCollaborators(_CollaboratorFormatter);
+const CustomCreatorFormatter = withCollaborators(_CreatorFormatter);
+export { CustomCollaboratorFormatter, CustomCreatorFormatter };

package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/index.js

@@ -6,7 +6,6 @@ import _EmailFormatter from "dtable-ui-component/lib/EmailFormatter";
 import _UrlFormatter from "dtable-ui-component/lib/UrlFormatter";
 import _AutoNumberFormatter from "dtable-ui-component/lib/AutoNumberFormatter";
 import _FormulaFormatter from "dtable-ui-component/lib/FormulaFormatter";
-import _CreatorFormatter from "dtable-ui-component/lib/CreatorFormatter";
 import _MTimeFormatter from "dtable-ui-component/lib/MTimeFormatter";
 import _CTimeFormatter from "dtable-ui-component/lib/CTimeFormatter";
 import _CheckboxFormatter from "dtable-ui-component/lib/CheckboxFormatter";
@@ -18,12 +17,13 @@ import _GeolocationFormatter from "dtable-ui-component/lib/GeolocationFormatter"
 import _FileFormatter from "dtable-ui-component/lib/FileFormatter";
 import _ImageFormatter from "dtable-ui-component/lib/ImageFormatter";
 import _SimpleLongTextFormatter from "dtable-ui-component/lib/SimpleLongTextFormatter";
-import _CollaboratorFormatter from "dtable-ui-component/lib/CollaboratorFormatter";
 import _TextFormatter from "dtable-ui-component/lib/TextFormatter";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import React, { Fragment } from 'react';
 import { CellType, SELECT_OPTION_COLORS } from 'dtable-utils';
 import { withTranslation } from 'react-i18next';
+import { CustomCollaboratorFormatter, CustomCreatorFormatter } from './collaborator-wrapper';
+import LinkFormatter from './link-formatter';
 class CellFormatter extends React.Component {
   constructor() {
     super(...arguments);
@@ -64,13 +64,11 @@ class CellFormatter extends React.Component {
           }
         case CellType.COLLABORATOR:
           {
-            // TODO
             if (!Array.isArray(cellValue) || cellValue.length === 0) return this.renderEmptyFormatter();
             cellValue = cellValue.filter(item => item);
             if (cellValue.length === 0) return this.renderEmptyFormatter();
-            return /*#__PURE__*/React.createElement(_CollaboratorFormatter, {
+            return /*#__PURE__*/React.createElement(CustomCollaboratorFormatter, {
               value: cellValue,
-              collaborators: collaborators,
               containerClassName: containerClassName
             });
           }
@@ -173,12 +171,10 @@ class CellFormatter extends React.Component {
         case CellType.CREATOR:
         case CellType.LAST_MODIFIER:
           {
-            // TODO
-            return /*#__PURE__*/React.createElement(_CreatorFormatter, {
+            if (cellValue.length === 0) return this.renderEmptyFormatter();
+            return /*#__PURE__*/React.createElement(CustomCreatorFormatter, {
               value: cellValue,
-              collaborators: collaborators,
-              containerClassName: containerClassName,
-              renderEmptyFormatter: this.renderEmptyFormatter
+              containerClassName: containerClassName
             });
           }
         case CellType.FORMULA:
@@ -194,8 +190,15 @@ class CellFormatter extends React.Component {
           }
         case CellType.LINK:
           {
-            // TODO
-            return null;
+            if (!Array.isArray(cellValue) || cellValue.length === 0) return this.renderEmptyFormatter();
+            return /*#__PURE__*/React.createElement(LinkFormatter, {
+              value: cellValue,
+              column: column,
+              collaborators: collaborators,
+              containerClassName: containerClassName,
+              renderEmptyFormatter: this.renderEmptyFormatter,
+              t: this.props.t
+            });
           }
         case CellType.AUTO_NUMBER:
           {

package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/link-formatter/index.css

@@ -0,0 +1,41 @@
+/* link */
+.seatable-view-body-column-cell .document-link-formatter {
+  display: flex;
+  align-items: center;
+  overflow: hidden;
+  flex-wrap: nowrap;
+  width: 100%;
+  height: 100%;
+}
+
+.seatable-view-body-column-cell .document-link-formatter .document-link-item {
+  flex-shrink: 0;
+  height: 20px;
+  margin-right: 4px;
+  padding: 0 6px;
+  font-size: 13px;
+  max-width: 100%;
+  background: #eceff4;
+  border-radius: 3px;
+  align-items: center;
+  vertical-align: middle;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  line-height: 20px;
+  width: fit-content;
+}
+
+.seatable-view-body-column-cell .document-link-formatter .document-checkbox-item {
+  width: fit-content;
+  margin-right: 10px;
+  line-height: 36px;
+}
+
+.seatable-view-body-column-cell .document-link-formatter .document-long-text-item {
+  display: inline-flex;
+  margin-right: 10px;
+  font-size: 13px;
+  max-width: 100%;
+  flex-shrink: 0;
+}

package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/link-formatter/index.js

@@ -0,0 +1,275 @@
+import _DepartmentSingleSelectFormatter from "dtable-ui-component/lib/DepartmentSingleSelectFormatter";
+import _LongTextFormatter from "dtable-ui-component/lib/LongTextFormatter";
+import _CheckboxFormatter from "dtable-ui-component/lib/CheckboxFormatter";
+import _MultipleSelectFormatter from "dtable-ui-component/lib/MultipleSelectFormatter";
+import _MTimeFormatter from "dtable-ui-component/lib/MTimeFormatter";
+import _CTimeFormatter from "dtable-ui-component/lib/CTimeFormatter";
+import _DateFormatter from "dtable-ui-component/lib/DateFormatter";
+import _NumberFormatter from "dtable-ui-component/lib/NumberFormatter";
+import React from 'react';
+import { CellType, FORMULA_RESULT_TYPE, getDurationDisplayString, getGeolocationDisplayString, getMultipleOptionName } from 'dtable-utils';
+import { CustomCreatorFormatter } from '../collaborator-wrapper';
+import { getCellDisplayValue, getFormulaArrayValue, isArrayFormalColumn } from './utils';
+function LinkFormatter(props) {
+  const {
+    column,
+    value,
+    containerClassName,
+    collaborators
+  } = props;
+  const {
+    data
+  } = column;
+  if (!Array.isArray(value) || value.length === 0) return props.renderEmptyFormatter();
+  let {
+    display_column: displayColumn
+  } = data || {};
+  if (!displayColumn) return props.renderEmptyFormatter();
+  const {
+    type: displayColumnType,
+    data: displayColumnData
+  } = displayColumn;
+  const cellValue = getFormulaArrayValue(value, !isArrayFormalColumn(displayColumnType));
+  if (!Array.isArray(cellValue) || cellValue.length === 0) return props.renderEmptyFormatter();
+  switch (displayColumnType) {
+    case CellType.TEXT:
+    case CellType.AUTO_NUMBER:
+    case CellType.EMAIL:
+    case CellType.URL:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, value);
+        }));
+      }
+    case CellType.NUMBER:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value && value !== 0) return null;
+          return /*#__PURE__*/React.createElement(_NumberFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            containerClassName: "document-link-item",
+            data: displayColumnData || {},
+            value: value
+          });
+        }));
+      }
+    case CellType.DATE:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value || typeof value !== 'string') return null;
+          const {
+            format
+          } = displayColumnData || {};
+          return /*#__PURE__*/React.createElement(_DateFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            value: value,
+            format: format,
+            containerClassName: "document-link-item"
+          });
+        }));
+      }
+    case CellType.CTIME:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement(_CTimeFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            value: value,
+            containerClassName: "document-link-item"
+          });
+        }));
+      }
+    case CellType.MTIME:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement(_MTimeFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            value: value,
+            containerClassName: "document-link-item"
+          });
+        }));
+      }
+    case CellType.DURATION:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, getDurationDisplayString(value, displayColumnData));
+        }));
+      }
+    case CellType.CREATOR:
+    case CellType.LAST_MODIFIER:
+      {
+        return /*#__PURE__*/React.createElement(CustomCreatorFormatter, {
+          value: cellValue
+        });
+      }
+    case CellType.SINGLE_SELECT:
+      {
+        if (!cellValue || cellValue.length === 0) {
+          return props.renderEmptyFormatter();
+        }
+        const options = displayColumnData && Array.isArray(displayColumnData.options) ? displayColumnData.options : [];
+        return /*#__PURE__*/React.createElement(_MultipleSelectFormatter, {
+          value: cellValue,
+          options: options || [],
+          containerClassName: "dtable-dataset-".concat(displayColumnType, "-formatter")
+        });
+      }
+    case CellType.MULTIPLE_SELECT:
+      {
+        if (!cellValue || cellValue.length === 0) {
+          return props.renderEmptyFormatter();
+        }
+        const options = displayColumnData && Array.isArray(displayColumnData.options) ? displayColumnData.options : [];
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          const valueDisplayString = Array.isArray(value) ? getMultipleOptionName(options, value) : getMultipleOptionName(options, [value]);
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, valueDisplayString);
+        }));
+      }
+    case CellType.COLLABORATOR:
+      {
+        if (!cellValue || cellValue.length === 0) {
+          return props.renderEmptyFormatter();
+        }
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          const valueDisplayString = Array.isArray(value) ? getCellDisplayValue({
+            [displayColumn.key]: value
+          }, displayColumn, collaborators) : getCellDisplayValue({
+            [displayColumn.key]: [value]
+          }, displayColumn, collaborators);
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, valueDisplayString);
+        }));
+      }
+    case CellType.CHECKBOX:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          return /*#__PURE__*/React.createElement(_CheckboxFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            value: Boolean(value),
+            containerClassName: "document-".concat(displayColumnType, "-item")
+          });
+        }));
+      }
+    case CellType.GEOLOCATION:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, getGeolocationDisplayString(value, displayColumnData, {
+            hyphen: ' '
+          }));
+        }));
+      }
+    case CellType.LONG_TEXT:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement(_LongTextFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            value: value,
+            containerClassName: "document-".concat(displayColumnType, "-item")
+          });
+        }));
+      }
+    case CellType.FORMULA:
+    case CellType.LINK_FORMULA:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, getCellDisplayValue({
+            [displayColumn.key]: value
+          }, displayColumn, collaborators));
+        }));
+      }
+    case FORMULA_RESULT_TYPE.BOOL:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, value + '');
+        }));
+      }
+    case FORMULA_RESULT_TYPE.STRING:
+      {
+        return /*#__PURE__*/React.createElement("div", {
+          className: containerClassName
+        }, cellValue.map((value, index) => {
+          if (!value) return null;
+          return /*#__PURE__*/React.createElement("div", {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            className: "document-link-item"
+          }, value);
+        }));
+      }
+    case CellType.DEPARTMENT_SINGLE_SELECT:
+      {
+        const {
+          userId,
+          departments = []
+        } = window.seafile || window.seafileConfig;
+        if (!userId) return null;
+        return cellValue.map((item, index) => {
+          return /*#__PURE__*/React.createElement(_DepartmentSingleSelectFormatter, {
+            key: "link-".concat(displayColumnType, "-").concat(index),
+            tip: props.t('Deleted_department'),
+            value: item,
+            departments: departments,
+            containerClassName: containerClassName
+          });
+        });
+      }
+    default:
+      {
+        return props.renderEmptyFormatter();
+      }
+  }
+}
+export default LinkFormatter;

package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/link-formatter/utils.js

@@ -0,0 +1,73 @@
+import { CellType, getCellValueDisplayString } from 'dtable-utils';
+export const isValidCellValue = value => {
+  if (value === undefined) return false;
+  if (value === null) return false;
+  if (value === '') return false;
+  if (JSON.stringify(value) === '{}') return false;
+  if (JSON.stringify(value) === '[]') return false;
+  return true;
+};
+export const getCellDisplayValue = (record, column, collaborators) => {
+  const {
+    type,
+    data,
+    key
+  } = column;
+  return getCellValueDisplayString(record, type, key, {
+    data,
+    collaborators,
+    geolocationHyphen: ' '
+  });
+};
+export const getTwoDimensionArrayValue = value => {
+  if (!Array.isArray(value)) return [];
+  return value.map(item => {
+    if (Object.prototype.toString.call(item) !== '[object Object]') {
+      return item;
+    }
+    if (!Object.prototype.hasOwnProperty.call(item, 'display_value')) return item;
+    const {
+      display_value
+    } = item;
+    if (!Array.isArray(display_value) || display_value.length === 0) return display_value;
+    return display_value.map(i => {
+      if (Object.prototype.toString.call(i) === '[object Object]') {
+        if (!Object.prototype.hasOwnProperty.call(i, 'display_value')) return i;
+        const {
+          display_value
+        } = i;
+        return display_value;
+      }
+      return i;
+    });
+  });
+};
+export const getFormulaArrayValue = function (value) {
+  let isFlat = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  if (!Array.isArray(value)) return [];
+  if (!isFlat) return getTwoDimensionArrayValue(value);
+  return value.map(item => {
+    if (Object.prototype.toString.call(item) !== '[object Object]') {
+      return item;
+    }
+    if (!Object.prototype.hasOwnProperty.call(item, 'display_value')) return item;
+    const {
+      display_value
+    } = item;
+    if (!Array.isArray(display_value) || display_value.length === 0) return display_value;
+    return display_value.map(i => {
+      if (Object.prototype.toString.call(i) === '[object Object]') {
+        if (!Object.prototype.hasOwnProperty.call(i, 'display_value')) return i;
+        const {
+          display_value
+        } = i;
+        return display_value;
+      }
+      return i;
+    });
+  }).flat().filter(item => isValidCellValue(item));
+};
+export function isArrayFormalColumn(columnType) {
+  const multipleValueTypes = [CellType.IMAGE, CellType.FILE, CellType.MULTIPLE_SELECT, CellType.COLLABORATOR];
+  return multipleValueTypes.includes(columnType);
+}

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

@@ -31,7 +31,7 @@ const SeaTableTableMenu = _ref => {
     hideArrow: true,
     fade: false
   }, /*#__PURE__*/React.createElement("div", {
-    className: "sdoc-dropdown-menu-container",
+    className: "sdoc-dropdown-menu-container sdoc-seatable-selected-table-list-wrapper",
     style: {
       bottom: computedBottom
     }

package/dist/basic-sdk/extension/plugins/seatable-tables/render-element/index.css

@@ -1,7 +1,7 @@
 .seatable-view-container {
   width: 100%;
   overflow: auto;
-  border: 1px solid transparent;
+  border: 2px solid transparent;
   position: relative;
 }
 
@@ -42,3 +42,8 @@
 .seatable-view-records.no_alternate_color tr:nth-child(2n+1) {
   background-color: #fff;
 }
+
+.seatable-view-body-column-cell .collaborator-item .collaborator-avatar img {
+  min-width: 16px;
+  min-height: 16px;
+}

package/dist/basic-sdk/extension/plugins/seatable-tables/render-element/record-item.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { FORMULA_COLUMN_TYPES } from 'dtable-utils';
+import { CellType } from 'dtable-utils';
 import { getColumnWidth } from '../../seatable-column/helpers';
 import Formatter from '../formatter';
 export default function RecordItem(_ref) {
@@ -18,7 +18,7 @@ export default function RecordItem(_ref) {
   }, index), columns.map(column => {
     const width = getColumnWidth(column);
     let cellValue = record[column.key];
-    if (FORMULA_COLUMN_TYPES.includes(column.type)) {
+    if ([CellType.LINK, CellType.LINK_FORMULA, CellType.FORMULA].includes(column.type)) {
       cellValue = formulaRow[column.key];
     }
     return /*#__PURE__*/React.createElement("td", {

package/dist/basic-sdk/extension/plugins/seatable-tables/render-element/seatable-table.js

@@ -1,8 +1,9 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
 import { useReadOnly, useSelected } from '@seafile/slate-react';
-import { getFilteredRowsWithoutFormulaCalculation, sortTableRows } from 'dtable-utils';
+import { CellType, getFilteredRowsWithoutFormulaCalculation, sortTableRows } from 'dtable-utils';
 import Loading from '../../../../../components/loading';
 import RecordHeader from './record-header';
 import RecordList from './record-list';
@@ -118,6 +119,33 @@ function SeaTableTable(_ref) {
       } = element;
       validColumns = table.columns.filter(item => shown_column_keys.includes(item.key));
     }
+    // formatted columns
+    validColumns = validColumns.map(column => {
+      const {
+        type
+      } = column;
+      if (type === CellType.LINK) {
+        const {
+          data
+        } = column;
+        const {
+          display_column_key,
+          array_type,
+          array_data
+        } = data;
+        const display_column = {
+          key: display_column_key || '0000',
+          type: array_type || CellType.TEXT,
+          data: array_data || null
+        };
+        return _objectSpread(_objectSpread({}, column), {}, {
+          data: _objectSpread(_objectSpread({}, data), {}, {
+            display_column
+          })
+        });
+      }
+      return column;
+    });
     setColumns(validColumns);
     setIsLoading(false);
     // eslint-disable-next-line react-hooks/exhaustive-deps

package/dist/basic-sdk/extension/plugins/seatable-tables/seatable-settings/index.js

@@ -108,7 +108,7 @@ export default function TableSettings(_ref) {
     columns: columns,
     filterConjunction: settings.filter_conjunction || 'And',
     filters: settings.filters || [],
-    collaborators: [],
+    collaborators: editor.collaborators,
     onFiltersChange: onFiltersChange,
     isNeedSubmit: true
   }), /*#__PURE__*/React.createElement(SortSetter, {

package/dist/basic-sdk/extension/plugins/table/menu/color-selector-popover/style.css

@@ -1,165 +1,3 @@
-.menu-group .sdoc-color-menu.menu-show {
-  background: #e5e5e5;
-  border-radius: 2px;
-}
-
-.menu-group .sdoc-color-menu .last-used-color-container {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-}
-
-.menu-group .sdoc-color-menu .last-used-color-container.disabled {
-  padding-right: 0;
-}
-
-.menu-group .sdoc-color-menu .sdoc-color-toggle {
-  height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.menu-group .sdoc-color-menu .sdoc-color-toggle:hover,
-.menu-group .sdoc-color-menu .last-used-color-container:not(.disabled):hover {
-  background-color: #E5E5E5;
-}
-
-.menu-group .sdoc-color-menu.disabled .sdoc-color-toggle {
-  display: none;
-}
-
-.sdoc-color-menu .sdoc-color-icon {
-  height: 12px;
-  width: 12px;
-  transform: scale(.85);
-  line-height: 12px;
-}
-
-.sdoc-color-menu .last-used-color {
-  width: 14px;
-  height: 3px;
-  border-radius: 1px;
-  margin-top: 1px;
-  border: 1px solid rgba(0, 0, 0, .08);
-}
-
-.sdoc-color-menu-popover .popover {
-  left: -24px !important;
-}
-
-.sdoc-color-menu-popover .sdoc-color-dropdown-menu {
-  width: 251px;
-  padding: 0 0 12px 0;
-}
-
-.sdoc-color-menu-popover .sdoc-color-no-color-container {
-  width: 100%;
-  height: 24px;
-  margin-bottom: 5px;
-}
-
-.sdoc-color-menu-popover .sdoc-color-no-color-content {
-  height: 100%;
-  width: 100%;
-  text-align: center;
-  border: 1px solid rgba(0, 0, 0, .12);
-  border-radius: 2px;
-  font-size: 12px;
-  line-height: 22px;
-  cursor: pointer;
-}
-
-.sdoc-color-menu-popover .sdoc-color-default-colors-container {
-  display: flex;
-  flex-wrap: wrap;
-}
-
-.sdoc-color-menu-popover .sdoc-color-item {
-  position: relative;
-  height: 20px;
-  width: 20px;
-  margin-right: 3px;
-  margin-bottom: 3px;
-  border: 0.5px solid rgba(0, 0, 0, .08);
-}
-
-.sdoc-color-menu-popover .sdoc-color-item:not(.selected):hover::before {
-  content: '';
-  position: absolute;
-  width: calc(100% + 5px);
-  height: calc((100% + 5px));
-  top: -2.5px;
-  left: -2.5px;
-  pointer-events: none;
-  border: 1px solid rgba(0, 0, 0, .24);
-}
-
-.sdoc-color-menu-popover .sdoc-color-item.selected::after {
-  content: '';
-  position: absolute;
-  width: calc(100% + 5px);
-  height: calc((100% + 5px));
-  top: -2.5px;
-  left: -2.5px;
-  pointer-events: none;
-  border: 1px solid rgba(0, 0, 0, .88);
-}
-
-.sdoc-color-menu-popover .sdoc-color-item:hover {
-  cursor: pointer;
-}
-
-.sdoc-color-menu-popover .sdoc-color-item:nth-child(10n) {
-  margin-right: 0px;
-}
-
-.sdoc-color-menu-popover .sdoc-color-sub-title {
-  font-size: 11px;
-  line-height: 16px;
-  margin: 7px 0;
-  color: rgba(0, 0, 0, 0.4);
-}
-
-.sdoc-color-menu-popover .sdoc-colors-divider {
-  width: 100%;
-  height: 1px;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
-  margin: 0px 0 8px 0;
-}
-
-.sdoc-color-menu-popover .sdoc-more-colors {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  height: 30px;
-  font-size: 12px;
-  padding: 0 12px;
-}
-
-.sdoc-color-menu-popover .sdoc-more-colors .sdocfont {
-  font-size: 12px;
-  transform: scale(.6);
-  color: #888;
-}
-
-.sdoc-color-menu-popover .sdoc-more-colors.show-pick {
-  cursor: pointer;
-  background-color: rgba(51, 77, 102, .06);
-}
-
-.sdoc-more-colors-popover .popover {
-  left: 10px !important;
-}
-
-/* commission */
-.menu-group #button-sdoc-highlight-color .sdoc-color-icon {
-  position: relative;
-  left: 1px;
-}
-
 .sdoc-table-cell-bg-colors-popover .popover {
   margin-left: 30px;
 }

package/dist/basic-sdk/extension/toolbar/header-toolbar/insert-toolbar/index.js

@@ -67,7 +67,7 @@ const InsertToolbar = _ref => {
     className: "sdocfont sdoc-insert mr-1"
   }), /*#__PURE__*/React.createElement("span", {
     className: "text-truncate"
-  }, t('Insert'))), !disabled && /*#__PURE__*/React.createElement("div", {
+  }, t('Insert'))), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-menu-with-dropdown-triangle"
   }, /*#__PURE__*/React.createElement("span", {
     className: caretIconClass

package/dist/constants/index.js

@@ -21,7 +21,9 @@ export const EXTERNAL_EVENT = {
   CREATE_SDOC_FILE: 'create_sdoc_file',
   CREATE_WIKI_PAGE: 'create_wiki_page',
   // wiki
-  INSERT_LINK: 'insert_link'
+  INSERT_LINK: 'insert_link',
+  // document
+  COLLABORATORS_UPDATED: 'collaborators_updated'
 };
 export const TIP_TYPE = {
   DELETE_NO_CHANGES_REVISION: 'delete_no_changes_revision',

package/package.json

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

package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/creator-formatter.js

@@ -1,124 +0,0 @@
-import _CreatorFormatter from "dtable-ui-component/lib/CreatorFormatter";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import React, { Component } from 'react';
-import context from '@/context';
-import { isValidEmail } from '@/utils/common-utils';
-class DtableCreatorFormatter extends Component {
-  constructor(_props) {
-    super(_props);
-    _defineProperty(this, "calculateCollaboratorData", props => {
-      const {
-        value
-      } = props;
-      this.getCollaborator(value);
-    });
-    _defineProperty(this, "getCollaborator", value => {
-      if (!value) {
-        this.setState({
-          isDataLoaded: true,
-          collaborator: null
-        });
-        return;
-      }
-      this.setState({
-        isDataLoaded: false,
-        collaborator: null
-      });
-      const {
-        collaborators
-      } = this.props;
-      let collaborator = Array.isArray(collaborators) && collaborators.find(c => c && c.username === value);
-      if (collaborator) {
-        this.setState({
-          isDataLoaded: true,
-          collaborator: collaborator
-        });
-        return;
-      }
-      const mediaUrl = context.getSetting('mediaUrl');
-      const defaultAvatarUrl = "".concat(mediaUrl, "/avatars/default.png");
-      if (value === 'anonymous') {
-        collaborator = {
-          name: 'anonymous',
-          avatar_url: defaultAvatarUrl
-        };
-        this.setState({
-          isDataLoaded: true,
-          collaborator
-        });
-        return;
-      }
-      let dtableCollaborators = window.app.collaboratorsCache;
-      collaborator = dtableCollaborators[value];
-      if (collaborator) {
-        this.setState({
-          isDataLoaded: true,
-          collaborator
-        });
-        return;
-      }
-      if (!isValidEmail(value)) {
-        collaborator = {
-          name: value,
-          avatar_url: defaultAvatarUrl
-        };
-        dtableCollaborators[value] = collaborator;
-        this.setState({
-          isDataLoaded: true,
-          collaborator: collaborator
-        });
-        return;
-      }
-      context.getUserCommonInfo(value).then(res => {
-        collaborator = res.data;
-        dtableCollaborators[value] = collaborator;
-        this.setState({
-          isDataLoaded: true,
-          collaborator: collaborator
-        });
-      }).catch(() => {
-        let mediaUrl = context.getSetting('mediaUrl');
-        let defaultAvatarUrl = "".concat(mediaUrl, "/avatars/default.png");
-        collaborator = {
-          name: value,
-          avatar_url: defaultAvatarUrl
-        };
-        dtableCollaborators[value] = collaborator;
-        this.setState({
-          isDataLoaded: true,
-          collaborator: collaborator
-        });
-      });
-    });
-    this.state = {
-      isDataLoaded: false,
-      collaborator: null
-    };
-  }
-  componentDidMount() {
-    this.calculateCollaboratorData(this.props);
-  }
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    this.calculateCollaboratorData(nextProps);
-  }
-  render() {
-    const {
-      isDataLoaded,
-      collaborator
-    } = this.state;
-    const {
-      value,
-      containerClassName
-    } = this.props;
-    if (!value || !collaborator) return this.props.renderEmptyFormatter();
-    if (isDataLoaded) {
-      return /*#__PURE__*/React.createElement(_CreatorFormatter, {
-        collaborators: [collaborator],
-        value: value,
-        containerClassName: containerClassName
-      });
-    }
-    return this.props.renderEmptyFormatter();
-  }
-}
-export default DtableCreatorFormatter;