@seafile/sdoc-editor 0.5.71 → 0.5.73

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

@@ -30,6 +30,7 @@ export const MENTION_TEMP = 'mention_temp';
 export const FILE_LINK_INSET_INPUT_TEMP = 'file_link_insert_input_temp';
 export const QUICK_INSERT = 'quick_insert';
 export const COLUMN = 'column';
+export const SEATABLE_VIEW = 'seatable_view';
 
 // font
 export const FONT_SIZE = 'font-size';

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

@@ -1,7 +1,7 @@
 // extension plugin
 import * as ELEMENT_TYPE from './element-type';
 // eslint-disable-next-line no-duplicate-imports
-import { BLOCKQUOTE, TITLE, SUBTITLE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, CHECK_LIST_ITEM, CODE_BLOCK, CODE_LINE, TABLE, TABLE_CELL, TABLE_ROW, LINK, SDOC_LINK, FILE_LINK, IMAGE, IMAGE_BLOCK, TOP_LEVEL_TYPES, INLINE_LEVEL_TYPES, CALL_OUT, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT, COLUMN } from './element-type';
+import { BLOCKQUOTE, TITLE, SUBTITLE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, CHECK_LIST_ITEM, CODE_BLOCK, CODE_LINE, TABLE, TABLE_CELL, TABLE_ROW, LINK, SDOC_LINK, FILE_LINK, IMAGE, IMAGE_BLOCK, TOP_LEVEL_TYPES, INLINE_LEVEL_TYPES, CALL_OUT, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT, COLUMN, SEATABLE_VIEW } from './element-type';
 export { 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_BACKGROUND_COLORS_KEY, DEFAULT_LAST_USED_FONT_COLOR, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, DEFAULT_LAST_USED_TABLE_CELL_BACKGROUND_COLOR } from './color';
 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';
@@ -57,4 +57,4 @@ export const MOUSE_ENTER_EVENT_DISABLED_MAP = {
   [CALL_OUT]: [CALL_OUT]
 };
 export const ROOT_ELEMENT_TYPES = [PARAGRAPH, TITLE, SUBTITLE, CHECK_LIST_ITEM, ORDERED_LIST, UNORDERED_LIST, BLOCKQUOTE, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, CALL_OUT, TABLE, CODE_BLOCK, IMAGE_BLOCK];
-export { ELEMENT_TYPE, BLOCKQUOTE, TITLE, SUBTITLE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, CHECK_LIST_ITEM, CODE_BLOCK, CODE_LINE, TABLE, TABLE_CELL, TABLE_ROW, LINK, SDOC_LINK, FILE_LINK, IMAGE, IMAGE_BLOCK, TOP_LEVEL_TYPES, INLINE_LEVEL_TYPES, CALL_OUT, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT };
+export { ELEMENT_TYPE, BLOCKQUOTE, TITLE, SUBTITLE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, PARAGRAPH, ORDERED_LIST, UNORDERED_LIST, LIST_ITEM, CHECK_LIST_ITEM, CODE_BLOCK, CODE_LINE, TABLE, TABLE_CELL, TABLE_ROW, LINK, SDOC_LINK, FILE_LINK, IMAGE, IMAGE_BLOCK, TOP_LEVEL_TYPES, INLINE_LEVEL_TYPES, CALL_OUT, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT, SEATABLE_VIEW };

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

@@ -1,5 +1,5 @@
 import { RECENT_USED_HIGHLIGHT_COLORS_KEY, DEFAULT_LAST_USED_HIGHLIGHT_COLOR, RECENT_USED_FONT_COLORS_KEY, DEFAULT_FONT_COLOR, DEFAULT_LAST_USED_FONT_COLOR } from './color';
-import { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, ORDERED_LIST, UNORDERED_LIST, CHECK_LIST_ITEM, CODE_BLOCK, LINK, IMAGE, TABLE, SDOC_LINK, FILE_LINK, PARAGRAPH, CALL_OUT, COLUMN } from './element-type';
+import { BLOCKQUOTE, HEADER, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, ORDERED_LIST, UNORDERED_LIST, CHECK_LIST_ITEM, CODE_BLOCK, LINK, IMAGE, TABLE, SDOC_LINK, FILE_LINK, PARAGRAPH, CALL_OUT, COLUMN, SEATABLE_VIEW } from './element-type';
 export const UNDO = 'undo';
 export const REDO = 'redo';
 export const CLEAR_FORMAT = 'clear_format';
@@ -195,7 +195,13 @@ export const MENUS_CONFIG_MAP = {
   [COLUMN]: {
     id: "sdoc".concat(COLUMN),
     iconClass: 'sdocfont sdoc-choose-column',
-    text: 'Insert_column'
+    text: 'SeaTable_column'
+  },
+  [SEATABLE_VIEW]: {
+    id: SEATABLE_VIEW,
+    iconClass: 'sdocfont sdoc-header4',
+    type: SEATABLE_VIEW,
+    text: 'SeaTable_view'
   }
 };
 

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

@@ -18,10 +18,11 @@ import CalloutPlugin from './callout';
 import SearchReplacePlugin from './search-replace';
 import MentionPlugin from './mention';
 import QuickInsertPlugin from './quick-insert';
-import ColumnPlugin from './column';
 import WikiLinkPlugin from './wiki-link';
+import SeaTableColumnPlugin from './seatable-column';
+import SeaTableViewsPlugin from './seatable-views';
 const Plugins = [MarkDownPlugin, HtmlPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, TextAlignPlugin, FontPlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin, CalloutPlugin, SearchReplacePlugin];
-const WikiPlugins = [MarkDownPlugin, HtmlPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, TextAlignPlugin, FontPlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin, CalloutPlugin, SearchReplacePlugin, QuickInsertPlugin, WikiLinkPlugin];
+const WikiPlugins = [...Plugins, QuickInsertPlugin, WikiLinkPlugin];
 const CommentPlugins = [MarkDownPlugin, HtmlPlugin, ParagraphPlugin, TextPlugin, ListPlugin, ImagePlugin, LinkPlugin, MentionPlugin, BlockquotePlugin];
 export default Plugins;
-export { MarkDownPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, HtmlPlugin, TextAlignPlugin, FontPlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin, CalloutPlugin, SearchReplacePlugin, MentionPlugin, QuickInsertPlugin, CommentPlugins, WikiPlugins, ColumnPlugin, WikiLinkPlugin };
+export { MarkDownPlugin, HeaderPlugin, LinkPlugin, BlockquotePlugin, ListPlugin, CheckListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, TextPlugin, HtmlPlugin, TextAlignPlugin, FontPlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin, CalloutPlugin, SearchReplacePlugin, MentionPlugin, QuickInsertPlugin, CommentPlugins, WikiPlugins, WikiLinkPlugin, SeaTableColumnPlugin, SeaTableViewsPlugin };

package/dist/basic-sdk/extension/plugins/{column → seatable-column}/helpers.js

@@ -4,6 +4,7 @@ import slugid from 'slugid';
 import { BLOCKQUOTE, CHECK_LIST_ITEM, COLUMN, IMAGE, ORDERED_LIST, PARAGRAPH, TABLE_CELL, UNORDERED_LIST } from '../../constants/element-type';
 import { focusEditor, getNodeType } from '../../core';
 import Column from './model';
+import * as CellType from './constants/cell-types';
 export const isMenuDisabled = (editor, readonly) => {
   if (readonly) return true;
   const {
@@ -64,4 +65,49 @@ export const setSeaTableColumn = (editor, data) => {
 export const getColumnByKey = (columns, key) => {
   const column = columns.find(item => item.key === key);
   return column || null;
+};
+export const getColumnWidth = column => {
+  let {
+    type,
+    data
+  } = column;
+  switch (type) {
+    case CellType.DATE:
+      {
+        let isShowHourAndMinute = data && data.format && data.format.indexOf('HH:mm') > -1;
+        return isShowHourAndMinute ? 160 : 100;
+      }
+    case CellType.CTIME:
+    case CellType.MTIME:
+    case CellType.LINK:
+    case CellType.GEOLOCATION:
+      {
+        return 160;
+      }
+    case CellType.COLLABORATOR:
+      {
+        return 100;
+      }
+    case CellType.CHECKBOX:
+      {
+        return 40;
+      }
+    case CellType.NUMBER:
+    case CellType.AUTO_NUMBER:
+      {
+        return 120;
+      }
+    case CellType.RATE:
+      {
+        const {
+          rate_max_number
+        } = data || {};
+        const rateMaxNumber = rate_max_number || 5;
+        return 16 * rateMaxNumber + 20;
+      }
+    default:
+      {
+        return 100;
+      }
+  }
 };

package/dist/basic-sdk/extension/plugins/{column → seatable-column}/index.js

@@ -1,10 +1,10 @@
 import { COLUMN } from '../../constants/element-type';
 import withColumn from './plugin';
 import renderColumn from './render-elem';
-const ColumnPlugin = {
+const SeaTableColumnPlugin = {
   type: COLUMN,
   nodeType: 'element',
   editorPlugin: withColumn,
   renderElements: [renderColumn]
 };
-export default ColumnPlugin;
+export default SeaTableColumnPlugin;

package/dist/basic-sdk/extension/plugins/{column → seatable-column/menu}/column-list-menu.js

@@ -1,7 +1,7 @@
 import React, { useMemo, useCallback } from 'react';
-import { COLUMNS_ICON_CONFIG } from './constants/column';
-import { insertSeaTableColumn, getColumnType } from './helpers';
-import { COLUMN } from '../../constants/element-type';
+import { COLUMNS_ICON_CONFIG } from '../constants/column';
+import { insertSeaTableColumn, getColumnType } from '../helpers';
+import { COLUMN } from '../../../constants/element-type';
 import './column-list-menu.css';
 const NOT_SUPPORT_COLUMN_TYPES = ['button', 'file'];
 export default function ColumnListMenu(_ref) {

package/dist/basic-sdk/extension/plugins/{column/menu/seatable-column.js → seatable-column/menu/index.js}

@@ -1,10 +1,10 @@
 import React from 'react';
 import { MENUS_CONFIG_MAP, ELEMENT_TYPE } from '../../../constants';
 import DropdownMenuItem from '../../../commons/dropdown-menu-item';
-import ColumnListMenu from '../column-list-menu';
+import ColumnListMenu from './column-list-menu';
 import { UncontrolledPopover } from 'reactstrap';
 import { isMenuDisabled } from '../helpers';
-const SeatableColumnMenu = _ref => {
+const SeaTableColumnMenu = _ref => {
   let {
     editor,
     readonly
@@ -28,4 +28,4 @@ const SeatableColumnMenu = _ref => {
     readonly: readonly
   })));
 };
-export default SeatableColumnMenu;
+export default SeaTableColumnMenu;

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

@@ -6,7 +6,6 @@ const Column = _ref => {
     props,
     editor
   } = _ref;
-  // eslint-disable-next-line react-hooks/rules-of-hooks
   const {
     attributes,
     element,

package/dist/basic-sdk/extension/plugins/seatable-views/helpers.js

@@ -0,0 +1,50 @@
+import { Editor, Transforms } from '@seafile/slate';
+import slugId from 'slugid';
+import { getNodeType, isTextNode, getParentNode, generateDefaultText } from '../../core';
+import { ELEMENT_TYPE, SEATABLE_VIEW } from '../../constants';
+export const isInsertSeaTableViewDisabled = (editor, readonly) => {
+  if (readonly) return true;
+  const {
+    selection
+  } = editor;
+  if (selection === null) return true;
+  const [match] = Editor.nodes(editor, {
+    match: n => {
+      let type = getNodeType(n);
+      if (!type && isTextNode(n) && n.id) {
+        const parentNode = getParentNode(editor.children, n.id);
+        type = getNodeType(parentNode);
+      }
+      if (type.startsWith('header')) return true;
+      if (type === ELEMENT_TYPE.CODE_BLOCK) return true;
+      if (type === ELEMENT_TYPE.ORDERED_LIST) return true;
+      if (type === ELEMENT_TYPE.UNORDERED_LIST) return true;
+      if (type === ELEMENT_TYPE.BLOCKQUOTE) return true;
+      if (type === ELEMENT_TYPE.LIST_ITEM) return true;
+      if (type === ELEMENT_TYPE.TABLE) return true;
+      if (type === ELEMENT_TYPE.TABLE_CELL) return true;
+      if (type === ELEMENT_TYPE.TABLE_ROW) return true;
+      if (type === ELEMENT_TYPE.CALL_OUT) return true;
+      if (Editor.isVoid(editor, n)) return true;
+      return false;
+    },
+    universal: true
+  });
+  if (match) return true;
+  return false;
+};
+export const generateSeaTableView = (table_id, view_id) => {
+  return {
+    id: slugId.nice(),
+    type: SEATABLE_VIEW,
+    table_id,
+    view_id,
+    children: [generateDefaultText()]
+  };
+};
+export const insertSeaTableView = (editor, item) => {
+  const table_id = editor.table_id;
+  const view_id = item._id;
+  const node = generateSeaTableView(table_id, view_id);
+  Transforms.setNodes(editor, node);
+};

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

@@ -0,0 +1,14 @@
+import { SEATABLE_VIEW } from '../../constants';
+import ImageMenu from './menu';
+import SeaTableView from './model';
+import withSeaTableView from './plugin';
+import renderSeaTableView from './render-element';
+const SeaTableViewsPlugin = {
+  type: SEATABLE_VIEW,
+  nodeType: 'element',
+  model: SeaTableView,
+  editorMenus: [ImageMenu],
+  editorPlugin: withSeaTableView,
+  renderElements: [renderSeaTableView]
+};
+export default SeaTableViewsPlugin;

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

@@ -0,0 +1,40 @@
+import React, { useCallback } from 'react';
+import { UncontrolledPopover } from 'reactstrap';
+import { insertSeaTableView, isInsertSeaTableViewDisabled } from '../helpers';
+import { MENUS_CONFIG_MAP, SEATABLE_VIEW } from '../../../constants';
+import DropdownMenuItem from '../../../commons/dropdown-menu-item';
+const SeaTableViewMenu = _ref => {
+  let {
+    editor,
+    readonly
+  } = _ref;
+  const disabled = isInsertSeaTableViewDisabled(editor, readonly);
+  const menuConfig = MENUS_CONFIG_MAP[SEATABLE_VIEW];
+  const views = editor.views;
+  const onViewClick = useCallback(item => {
+    insertSeaTableView(editor, item);
+  }, [editor]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DropdownMenuItem, {
+    disabled: disabled,
+    menuConfig: menuConfig,
+    className: "pr-2"
+  }, !disabled && /*#__PURE__*/React.createElement("i", {
+    className: "sdocfont sdoc-right-slide sdoc-dropdown-item-right-icon"
+  })), !disabled && /*#__PURE__*/React.createElement(UncontrolledPopover, {
+    target: menuConfig.id,
+    trigger: "hover",
+    className: "sdoc-menu-popover sdoc-dropdown-menu sdoc-sub-dropdown-menu",
+    placement: "right-start",
+    hideArrow: true,
+    fade: false
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "sdoc-dropdown-menu-container"
+  }, views.map(item => {
+    return /*#__PURE__*/React.createElement("div", {
+      key: item._id,
+      className: "sdoc-dropdown-menu-item",
+      onClick: () => onViewClick(item)
+    }, item.name);
+  }))));
+};
+export default SeaTableViewMenu;

package/dist/basic-sdk/extension/plugins/seatable-views/model.js

@@ -0,0 +1,12 @@
+import { SEATABLE_VIEW } from '../../constants/element-type';
+class SeaTableView {
+  constructor(options) {
+    this.type = options.type || SEATABLE_VIEW;
+    this.table_id = options.table_id;
+    this.view_id = options.view_id;
+    this.children = options.children || [{
+      text: ''
+    }];
+  }
+}
+export default SeaTableView;

package/dist/basic-sdk/extension/plugins/seatable-views/plugin.js

@@ -0,0 +1,71 @@
+import { Transforms, Path, Editor, Element, Range } from '@seafile/slate';
+import { focusEditor, generateEmptyElement, getNodeType, isBlockAboveEmpty, isLastNode } from '../../core';
+import { PARAGRAPH, SEATABLE_VIEW } from '../../constants/element-type';
+const withSeaTableView = editor => {
+  const {
+    isVoid,
+    deleteBackward,
+    normalizeNode
+  } = editor;
+  const newEditor = editor;
+
+  // rewrite isVoid
+  newEditor.isVoid = elem => {
+    const {
+      type
+    } = elem;
+    if (type === SEATABLE_VIEW) {
+      return true;
+    }
+    return isVoid(elem);
+  };
+  newEditor.deleteBackward = unit => {
+    const {
+      selection
+    } = editor;
+    const focusPoint = Editor.before(editor, selection);
+    const point = Editor.before(editor, selection, {
+      distance: 1
+    });
+    if (!point) return deleteBackward(unit);
+    const [node, path] = Editor.node(editor, [point.path[0], point.path[1]]);
+    const isPerviousSeaTableView = node.type === SEATABLE_VIEW;
+    if (isPerviousSeaTableView && Range.isCollapsed(selection) && isBlockAboveEmpty(editor) && !Path.isCommon(path, selection.anchor.path)) {
+      deleteBackward(unit);
+      focusEditor(newEditor, Editor.end(newEditor, focusPoint));
+      return;
+    }
+    if (Element.isElement(node) && node.type === SEATABLE_VIEW) {
+      // If the wrapping element is image_block, delete the wrapping element
+      const [parentNode, p] = Editor.node(editor, [path[0]]);
+      if (parentNode.type === SEATABLE_VIEW) {
+        Transforms.removeNodes(editor, {
+          at: p
+        });
+        return;
+      }
+      focusEditor(editor, Path.next(path));
+    }
+    deleteBackward(unit);
+  };
+
+  // Rewrite normalizeNode
+  newEditor.normalizeNode = _ref => {
+    let [node, path] = _ref;
+    const type = getNodeType(node);
+    if (type !== SEATABLE_VIEW) {
+      return normalizeNode([node, path]);
+    }
+
+    // insert empty node，continue editor
+    const isLast = isLastNode(newEditor, node);
+    if (isLast) {
+      const p = generateEmptyElement(PARAGRAPH);
+      Transforms.insertNodes(newEditor, p, {
+        at: [path[0] + 1]
+      });
+    }
+  };
+  return newEditor;
+};
+export default withSeaTableView;

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

@@ -0,0 +1,21 @@
+.seatable-view-container {
+  width: 100%;
+  min-height: 200px;
+  max-height: 400px;
+  overflow: auto;
+}
+
+.seatable-view-container.selected {
+  border: 1px solid red;
+}
+
+.seatable-view-container .seatable-view-records {
+  margin: 0;
+}
+
+.seatable-view-body-column-cell {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  word-break: break-all;
+}

package/dist/basic-sdk/extension/plugins/seatable-views/render-element/index.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import SeaTableView from './seatable-view';
+const renderSeaTableView = (props, editor) => {
+  return /*#__PURE__*/React.createElement(SeaTableView, Object.assign({}, props, {
+    editor: editor
+  }));
+};
+export default renderSeaTableView;

package/dist/basic-sdk/extension/plugins/seatable-views/render-element/record-header.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { getColumnWidth } from '../../seatable-column/helpers';
+export default function RecordHeader(_ref) {
+  let {
+    columns
+  } = _ref;
+  return /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", {
+    className: "seatable-view-column-header-row"
+  }, columns.map(column => {
+    const width = getColumnWidth(column);
+    return /*#__PURE__*/React.createElement("th", {
+      className: "seatable-view-column-header-cell",
+      key: column.key,
+      style: {
+        width
+      }
+    }, column.name);
+  })));
+}

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

@@ -0,0 +1,22 @@
+import React from 'react';
+import { getColumnWidth } from '../../seatable-column/helpers';
+export default function RecordItem(_ref) {
+  let {
+    editor,
+    record,
+    columns,
+    getViewCellValue
+  } = _ref;
+  return /*#__PURE__*/React.createElement("tr", {
+    className: "seatable-view-body-column-row"
+  }, columns.map(column => {
+    const width = getColumnWidth(column);
+    return /*#__PURE__*/React.createElement("td", {
+      className: "seatable-view-body-column-cell",
+      key: record._id + '_' + column.key,
+      style: {
+        width
+      }
+    }, getViewCellValue(record, column));
+  }));
+}

package/dist/basic-sdk/extension/plugins/seatable-views/render-element/record-list.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import RecordItem from './record-item';
+export default function RecordList(_ref) {
+  let {
+    records,
+    columns,
+    editor,
+    getViewCellValue
+  } = _ref;
+  return /*#__PURE__*/React.createElement("tbody", null, records.map(record => {
+    return /*#__PURE__*/React.createElement(RecordItem, {
+      key: record._id,
+      record: record,
+      columns: columns,
+      editor: editor,
+      getViewCellValue: getViewCellValue
+    });
+  }));
+}

package/dist/basic-sdk/extension/plugins/seatable-views/render-element/seatable-view.js

@@ -0,0 +1,57 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import classNames from 'classnames';
+import { useSelected } from '@seafile/slate-react';
+import Loading from '../../../../../components/loading';
+import RecordHeader from './record-header';
+import RecordList from './record-list';
+import './index.css';
+function SeaTableView(_ref) {
+  let {
+    element,
+    className,
+    attributes,
+    children,
+    editor,
+    t
+  } = _ref;
+  const isSelected = useSelected();
+  const [isLoading, setIsLoading] = useState(true);
+  const [records, setRecords] = useState([]);
+  const [columns, setColumns] = useState([]);
+  useEffect(() => {
+    const {
+      table_id,
+      view_id
+    } = element;
+    const rows = editor.getViewRowsById(table_id, view_id);
+    const columns = editor.getViewColsById(table_id, view_id);
+    setRecords(rows);
+    setColumns(columns);
+    setIsLoading(false);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [element]);
+  const containerClass = classNames('seatable-view-container', {
+    selected: isSelected
+  });
+  const getViewCellValue = useCallback((row, column) => {
+    const {
+      table_id,
+      view_id
+    } = element;
+    return editor.getViewCellValue(table_id, view_id, row, column);
+  }, [editor, element]);
+  return /*#__PURE__*/React.createElement("div", Object.assign({}, attributes, {
+    className: containerClass,
+    contentEditable: false
+  }), isLoading && /*#__PURE__*/React.createElement(Loading, null), !isLoading && /*#__PURE__*/React.createElement("table", {
+    className: "seatable-view-records"
+  }, /*#__PURE__*/React.createElement(RecordHeader, {
+    columns: columns
+  }), /*#__PURE__*/React.createElement(RecordList, {
+    editor: editor,
+    records: records,
+    columns: columns,
+    getViewCellValue: getViewCellValue
+  })), children);
+}
+export default SeaTableView;

package/dist/basic-sdk/extension/plugins/table/render/table-header/rows-header/index.js

@@ -64,7 +64,6 @@ const RowsHeader = _ref => {
     className: classnames('position-fixed sdoc-table-add-element-icon-content', {
       'background-color-tip-blue': isHoverInAddIcon
     }),
-    contentEditable: false,
     style: addIconPosition,
     onMouseEnter: () => onMouseEnter(addIconPosition),
     onMouseLeave: onMouseLeave,

package/dist/basic-sdk/extension/render/custom-element.js

@@ -1,11 +1,11 @@
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import { useReadOnly, useSlateStatic } from '@seafile/slate-react';
 import { BLOCKQUOTE, LINK, CHECK_LIST_ITEM, HEADER1, HEADER2, HEADER3, HEADER4, HEADER5, HEADER6, LIST_ITEM, ORDERED_LIST, PARAGRAPH, UNORDERED_LIST, CODE_BLOCK, CODE_LINE, IMAGE, IMAGE_BLOCK, ELEMENT_TYPE, SDOC_LINK, FILE_LINK, TITLE, SUBTITLE, CALL_OUT, SUPPORTED_SIDE_OPERATION_TYPE, MENTION, MENTION_TEMP, FILE_LINK_INSET_INPUT_TEMP, QUICK_INSERT } from '../constants';
-import { BlockquotePlugin, LinkPlugin, CheckListPlugin, HeaderPlugin, ListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin, CalloutPlugin, MentionPlugin, QuickInsertPlugin, ColumnPlugin, WikiLinkPlugin } from '../plugins';
+import { BlockquotePlugin, LinkPlugin, CheckListPlugin, HeaderPlugin, ListPlugin, CodeBlockPlugin, ImagePlugin, TablePlugin, SdocLinkPlugin, ParagraphPlugin, FileLinkPlugin, CalloutPlugin, MentionPlugin, QuickInsertPlugin, WikiLinkPlugin, SeaTableColumnPlugin, SeaTableViewsPlugin } from '../plugins';
 import { onDragOver, onDragLeave, onDrop } from '../toolbar/side-toolbar/event';
 import { getParentNode } from '../core';
 import { setDataRoot, setMouseEnter } from './helper';
-import { COLUMN, WIKI_LINK } from '../constants/element-type';
+import { COLUMN, WIKI_LINK, SEATABLE_VIEW } from '../constants/element-type';
 import { WIKI_EDITOR, DIFF_VIEWER } from '../../constants';
 const CustomRenderElement = props => {
   const editor = useSlateStatic();
@@ -169,15 +169,20 @@ const CustomRenderElement = props => {
         const [renderQuickInsert] = QuickInsertPlugin.renderElements;
         return renderQuickInsert(props, editor);
       }
+    case WIKI_LINK:
+      {
+        const [renderWikiLink] = WikiLinkPlugin.renderElements;
+        return renderWikiLink(props, editor);
+      }
     case COLUMN:
       {
-        const [renderColumn] = ColumnPlugin.renderElements;
+        const [renderColumn] = SeaTableColumnPlugin.renderElements;
         return renderColumn(props, editor);
       }
-    case WIKI_LINK:
+    case SEATABLE_VIEW:
       {
-        const [renderWikiLink] = WikiLinkPlugin.renderElements;
-        return renderWikiLink(props, editor);
+        const [renderSeaTableView] = SeaTableViewsPlugin.renderElements;
+        return renderSeaTableView(props, editor);
       }
     default:
       {

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

@@ -6,9 +6,10 @@ import ImageMenu from '../../../plugins/image/menu';
 import TableMenu from '../../../plugins/table/menu/table-menu';
 import LinkMenu from '../../../plugins/link/menu';
 import CodeBlockMenu from '../../../plugins/code-block/menu';
-import SeatableColumnMenu from '../../../plugins/column/menu/seatable-column';
 import SdocLinkMenu from '../../../plugins/sdoc-link/menu';
 import FileLinkMenu from '../../../plugins/file-link/menu';
+import SeaTableColumnMenu from '../../../plugins/seatable-column/menu';
+import SeaTableViewMenu from '../../../plugins/seatable-views/menu';
 import EventBus from '../../../../utils/event-bus';
 import './index.css';
 const InsertToolbar = _ref => {
@@ -84,9 +85,9 @@ const InsertToolbar = _ref => {
     style: {
       maxHeight: window.innerHeight - bottom - 100
     }
-  }, /*#__PURE__*/React.createElement(ImageMenu, props), /*#__PURE__*/React.createElement(TableMenu, props), /*#__PURE__*/React.createElement(LinkMenu, props), /*#__PURE__*/React.createElement(CodeBlockMenu, props), editor.getColumnCellValue && /*#__PURE__*/React.createElement(SeatableColumnMenu, props), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(ImageMenu, props), /*#__PURE__*/React.createElement(TableMenu, props), /*#__PURE__*/React.createElement(LinkMenu, props), /*#__PURE__*/React.createElement(CodeBlockMenu, props), /*#__PURE__*/React.createElement("div", {
     className: "sdoc-dropdown-menu-divider"
-  }), /*#__PURE__*/React.createElement(SdocLinkMenu, props), /*#__PURE__*/React.createElement(FileLinkMenu, props))));
+  }), editor.columns && /*#__PURE__*/React.createElement(SeaTableColumnMenu, props), editor.views && /*#__PURE__*/React.createElement(SeaTableViewMenu, props), /*#__PURE__*/React.createElement(SdocLinkMenu, props), /*#__PURE__*/React.createElement(FileLinkMenu, props))));
 };
 InsertToolbar.defaultProps = {
   isRichEditor: true,

package/dist/index.js

@@ -7,5 +7,4 @@ import PublishedRevisionViewer from './pages/published-revision-viewer';
 import WikiViewer from './pages/wiki-viewer';
 import SdocWikiViewer from './pages/sdoc-wiki-viewer';
 import DocumentPluginEditor from './pages/document-plugin-editor';
-import DocumentPluginViewer from './pages/document-plugin-viewer';
-export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer, WikiViewer, SdocWikiViewer, DocumentPluginEditor, DocumentPluginViewer };
+export { SDocViewer, SimpleEditor, SimpleViewer, EventBus, EXTERNAL_EVENT, DiffViewer, PublishedRevisionViewer, WikiViewer, SdocWikiViewer, DocumentPluginEditor };

package/dist/pages/document-plugin-editor.js

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { withTranslation } from 'react-i18next';
 import context from '../context';
 import { SDocEditor } from '../basic-sdk';
@@ -6,8 +6,9 @@ import { PAGE_EDIT_AREA_WIDTH } from '../basic-sdk/constants';
 import { createDefaultEditor } from '../basic-sdk/extension';
 import withNodeId from '../basic-sdk/node-id';
 import { withSocketIO } from '../basic-sdk/socket';
-import { ColumnPlugin } from '../basic-sdk/extension/plugins';
+import { SeaTableColumnPlugin, SeaTableViewsPlugin } from '../basic-sdk/extension/plugins';
 import ErrorBoundary from './error-boundary';
+import useForceUpdate from '../basic-sdk/hooks/use-force-update';
 import '../assets/css/simple-editor.css';
 import '../assets/css/plugin-editor.css';
 const DocumentPluginEditor = _ref => {
@@ -15,13 +16,20 @@ const DocumentPluginEditor = _ref => {
     document,
     showOutline,
     scrollRef,
+    tableId,
     columns,
-    getColumnCellValue
+    views,
+    getViewRowsById,
+    getViewColsById,
+    getColumnCellValue,
+    getViewCellValue
   } = _ref;
   context.initApi();
+  const forceUpdate = useForceUpdate();
   const validEditor = useMemo(() => {
-    const withColumnPlugin = ColumnPlugin.editorPlugin;
-    const defaultEditor = withColumnPlugin(createDefaultEditor());
+    const withColumnPlugin = SeaTableColumnPlugin.editorPlugin;
+    const withViewsPlugin = SeaTableViewsPlugin.editorPlugin;
+    const defaultEditor = withViewsPlugin(withColumnPlugin(createDefaultEditor()));
     const editorConfig = context.getEditorConfig();
     const newEditor = withNodeId(withSocketIO(defaultEditor, {
       document,
@@ -30,13 +38,23 @@ const DocumentPluginEditor = _ref => {
     const {
       cursors
     } = document;
-    newEditor.columns = columns || [];
     newEditor.getColumnCellValue = getColumnCellValue;
+    newEditor.table_id = tableId;
+    newEditor.views = views || [];
+    newEditor.columns = columns || [];
+    newEditor.getViewRowsById = getViewRowsById;
+    newEditor.getViewColsById = getViewColsById;
+    newEditor.getViewCellValue = getViewCellValue;
     newEditor.cursors = cursors || {};
     newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
+
     return newEditor;
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
+  useEffect(() => {
+    validEditor.getColumnCellValue = getColumnCellValue ? getColumnCellValue : null;
+    forceUpdate();
+  }, [forceUpdate, getColumnCellValue, validEditor.getColumnCellValue]);
   return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(SDocEditor, {
     editor: validEditor,
     scrollRef: scrollRef,

package/package.json

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

package/public/locales/en/sdoc-editor.json

@@ -43,7 +43,6 @@
   "Delete_row": "Delete row",
   "Delete_column": "Delete column",
   "Insert_row": "Insert row",
-  "Insert_column": "Insert column",
   "Set_align": "Set align",
   "Left": "Left",
   "Center": "Center",
@@ -461,5 +460,7 @@
   "Fit_table_to_page_width": "Fit table to page width",
   "Enter_text_or_press_forward_slash_to_insert_element": "Enter text or press '/' to insert element",
   "Vertical_align": "Vertical alignment",
-  "Horizontal_align": "Horizontal alignment"
-}
+  "Horizontal_align": "Horizontal alignment",
+  "SeaTable_column": "SeaTable column",
+  "SeaTable_view": "SeaTable view"
+}

package/dist/pages/document-plugin-viewer.js

@@ -1,55 +0,0 @@
-import React, { useEffect, useMemo } from 'react';
-import { withTranslation } from 'react-i18next';
-import context from '../context';
-import { SDocViewer } from '../basic-sdk';
-import { PAGE_EDIT_AREA_WIDTH } from '../basic-sdk/constants';
-import { createDefaultEditor } from '../basic-sdk/extension';
-import withNodeId from '../basic-sdk/node-id';
-import { withSocketIO } from '../basic-sdk/socket';
-import { ColumnPlugin } from '../basic-sdk/extension/plugins';
-import ErrorBoundary from './error-boundary';
-import useForceUpdate from '../basic-sdk/hooks/use-force-update';
-import '../assets/css/simple-editor.css';
-import '../assets/css/plugin-editor.css';
-const DocumentPluginViewer = _ref => {
-  let {
-    scrollRef,
-    document,
-    showOutline,
-    columns,
-    getColumnCellValue
-  } = _ref;
-  context.initApi();
-  const forceUpdate = useForceUpdate();
-  const validEditor = useMemo(() => {
-    const withColumnPlugin = ColumnPlugin.editorPlugin;
-    const defaultEditor = withColumnPlugin(createDefaultEditor());
-    const editorConfig = context.getEditorConfig();
-    const newEditor = withNodeId(withSocketIO(defaultEditor, {
-      document,
-      config: editorConfig
-    }));
-    const {
-      cursors
-    } = document;
-    newEditor.columns = columns || [];
-    newEditor.getColumnCellValue = getColumnCellValue;
-    newEditor.cursors = cursors || {};
-    newEditor.width = PAGE_EDIT_AREA_WIDTH; // default width
-    return newEditor;
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-  useEffect(() => {
-    validEditor.getColumnCellValue = getColumnCellValue ? getColumnCellValue : null;
-    forceUpdate();
-  }, [forceUpdate, getColumnCellValue, validEditor.getColumnCellValue]);
-  return /*#__PURE__*/React.createElement(ErrorBoundary, null, /*#__PURE__*/React.createElement(SDocViewer, {
-    editor: validEditor,
-    scrollRef: scrollRef,
-    document: document,
-    showComment: false,
-    showToolbar: true,
-    showOutline: showOutline
-  }));
-};
-export default withTranslation('sdoc-editor')(DocumentPluginViewer);