@seafile/sdoc-editor 2.0.24 → 2.0.25-alph-0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/basic-sdk/assets/css/dropdown-menu.css +1 -1
- package/dist/basic-sdk/extension/commons/insert-element-dialog/index.js +12 -2
- package/dist/basic-sdk/extension/constants/element-type.js +2 -1
- package/dist/basic-sdk/extension/constants/index.js +8 -2
- package/dist/basic-sdk/extension/constants/menus-config.js +5 -0
- package/dist/basic-sdk/extension/plugins/ai/ai-module/index.js +17 -4
- package/dist/basic-sdk/extension/plugins/ai/ai-module/style.css +8 -0
- package/dist/basic-sdk/extension/plugins/index.js +7 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/index.css +414 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/index.js +76 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/record-content.js +209 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/resize-handle/ResizeHandle.js +38 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/resize-handle/index.css +384 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/row-card-header-cell.js +125 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/row-card-header.js +144 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/row-card-item.js +161 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/dialog/add-seatable-row-dialog/seatable-table-record.js +47 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/helpers.js +98 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/index.js +17 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/menu/index.css +3 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/menu/index.js +46 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/menu/seatable-list.js +62 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/model.js +19 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/plugin.js +60 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/render-elem/index.css +124 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/render-elem/index.js +160 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/render-elem/record-header.js +78 -0
- package/dist/basic-sdk/extension/plugins/seatable-row/render-elem/record-item.js +41 -0
- package/dist/basic-sdk/extension/plugins/seatable-tables/formatter/index.js +7 -2
- package/dist/basic-sdk/extension/plugins/table/menu/table-menu/index.js +1 -0
- package/dist/basic-sdk/extension/plugins/table/popover/table-size-popover/index.js +2 -0
- package/dist/basic-sdk/extension/render/custom-element.js +5 -0
- package/dist/basic-sdk/extension/toolbar/header-toolbar/insert-toolbar/index.js +3 -2
- package/dist/basic-sdk/extension/toolbar/insert-element-toolbar/index.js +1 -1
- package/dist/basic-sdk/extension/toolbar/side-toolbar/helpers.js +2 -1
- package/dist/basic-sdk/extension/toolbar/side-toolbar/insert-block-menu.js +2 -1
- package/dist/constants/index.js +1 -0
- package/dist/pages/document-plugin-editor.js +2 -1
- package/package.json +1 -1
- package/public/locales/cs/sdoc-editor.json +7 -1
- package/public/locales/de/sdoc-editor.json +66 -60
- package/public/locales/en/sdoc-editor.json +9 -1
- package/public/locales/es/sdoc-editor.json +7 -1
- package/public/locales/es_AR/sdoc-editor.json +7 -1
- package/public/locales/es_MX/sdoc-editor.json +7 -1
- package/public/locales/fr/sdoc-editor.json +240 -234
- package/public/locales/it/sdoc-editor.json +7 -1
- package/public/locales/ru/sdoc-editor.json +8 -2
- package/public/locales/zh_CN/sdoc-editor.json +6 -1
- package/public/media/sdoc-editor-font/iconfont.css +15 -14
- package/public/media/sdoc-editor-font/iconfont.eot +0 -0
- package/public/media/sdoc-editor-font/iconfont.svg +3 -1
- package/public/media/sdoc-editor-font/iconfont.ttf +0 -0
- package/public/media/sdoc-editor-font/iconfont.woff +0 -0
- package/public/media/sdoc-editor-font/iconfont.woff2 +0 -0
- package/public/media/sdoc-editor-font.css +11 -7
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _utils = require("../../../utils");
|
|
11
|
+
var _eventBus = _interopRequireDefault(require("../../../../utils/event-bus"));
|
|
12
|
+
var _constants = require("../../../../constants");
|
|
13
|
+
var _constants2 = require("../../../constants");
|
|
14
|
+
const SeaTableList = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
editor,
|
|
17
|
+
toggle
|
|
18
|
+
} = _ref;
|
|
19
|
+
const seatableRef = (0, _react.useRef)(null);
|
|
20
|
+
const [computedStyle, setComputedStyle] = (0, _react.useState)({});
|
|
21
|
+
const tables = editor.tables;
|
|
22
|
+
(0, _react.useEffect)(() => {
|
|
23
|
+
if (seatableRef.current) {
|
|
24
|
+
// bottom overflow
|
|
25
|
+
if ((0, _utils.isOverflowPortByDirection)(seatableRef.current, 'bottom')) {
|
|
26
|
+
return setComputedStyle({
|
|
27
|
+
bottom: '0px'
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
// default
|
|
31
|
+
setComputedStyle({
|
|
32
|
+
top: '-20px'
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
}, []);
|
|
36
|
+
const openSelectSeatableTableDialog = (0, _react.useCallback)(item => {
|
|
37
|
+
const eventBus = _eventBus.default.getInstance();
|
|
38
|
+
eventBus.dispatch(_constants.INTERNAL_EVENT.INSERT_ELEMENT, {
|
|
39
|
+
type: _constants2.ELEMENT_TYPE.SEATABLE_ROW,
|
|
40
|
+
data: {
|
|
41
|
+
table: item
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
toggle && toggle();
|
|
45
|
+
|
|
46
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
47
|
+
}, [toggle]);
|
|
48
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
49
|
+
ref: seatableRef,
|
|
50
|
+
className: "sdoc-dropdown-menu-container sdoc-seatable-selected-table-list-wrapper",
|
|
51
|
+
style: computedStyle
|
|
52
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
53
|
+
className: "sdoc-seatable-list-wrapper"
|
|
54
|
+
}, tables.map(item => {
|
|
55
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
56
|
+
key: item._id,
|
|
57
|
+
className: "sdoc-dropdown-menu-item text-truncate d-block",
|
|
58
|
+
onClick: () => openSelectSeatableTableDialog(item)
|
|
59
|
+
}, item.name);
|
|
60
|
+
})));
|
|
61
|
+
};
|
|
62
|
+
var _default = exports.default = SeaTableList;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _constants = require("../../constants");
|
|
8
|
+
class Row {
|
|
9
|
+
constructor(option) {
|
|
10
|
+
this.type = option.type || _constants.SEATABLE_ROW;
|
|
11
|
+
this.table_id = option.table_id;
|
|
12
|
+
this.row_id = option.row_id;
|
|
13
|
+
this.column_width = option.column_width;
|
|
14
|
+
this.children = option.children || [{
|
|
15
|
+
text: ''
|
|
16
|
+
}];
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
var _default = exports.default = Row;
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _slate = require("@seafile/slate");
|
|
8
|
+
var _constants = require("../../constants");
|
|
9
|
+
var _core = require("../../core");
|
|
10
|
+
const withRow = editor => {
|
|
11
|
+
const {
|
|
12
|
+
isVoid,
|
|
13
|
+
deleteBackward,
|
|
14
|
+
normalizeNode
|
|
15
|
+
} = editor;
|
|
16
|
+
const newEditor = editor;
|
|
17
|
+
newEditor.isVoid = element => {
|
|
18
|
+
const {
|
|
19
|
+
type
|
|
20
|
+
} = element;
|
|
21
|
+
if (type === _constants.ELEMENT_TYPE.SEATABLE_ROW) return true;
|
|
22
|
+
return isVoid(element);
|
|
23
|
+
};
|
|
24
|
+
newEditor.deleteBackward = unit => {
|
|
25
|
+
const {
|
|
26
|
+
selection
|
|
27
|
+
} = editor;
|
|
28
|
+
const focusPoint = _slate.Editor.before(editor, selection);
|
|
29
|
+
const point = _slate.Editor.before(editor, selection, {
|
|
30
|
+
distance: 1
|
|
31
|
+
});
|
|
32
|
+
if (!point) return deleteBackward(unit);
|
|
33
|
+
const [node, path] = _slate.Editor.node(editor, [point.path[0], point.path[1]]);
|
|
34
|
+
const isPerviousSeaTableRow = node.type === _constants.SEATABLE_ROW;
|
|
35
|
+
if (isPerviousSeaTableRow && Range.isCollapsed(selection) && (0, _core.isBlockAboveEmpty)(editor) && !_slate.Path.isCommon(path, selection.anchor.path)) {
|
|
36
|
+
deleteBackward(unit);
|
|
37
|
+
(0, _core.focusEditor)(newEditor, _slate.Editor.end(newEditor, focusPoint));
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
deleteBackward(unit);
|
|
41
|
+
};
|
|
42
|
+
newEditor.normalizeNode = _ref => {
|
|
43
|
+
let [node, path] = _ref;
|
|
44
|
+
const type = (0, _core.getNodeType)(node);
|
|
45
|
+
if (type !== _constants.SEATABLE_ROW) {
|
|
46
|
+
return normalizeNode([node, path]);
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
// insert empty node,continue editor
|
|
50
|
+
const isLast = (0, _core.isLastNode)(newEditor, node);
|
|
51
|
+
if (isLast) {
|
|
52
|
+
const p = (0, _core.generateEmptyElement)(_constants.PARAGRAPH);
|
|
53
|
+
_slate.Transforms.insertNodes(newEditor, p, {
|
|
54
|
+
at: [path[0] + 1]
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
return newEditor;
|
|
59
|
+
};
|
|
60
|
+
var _default = exports.default = withRow;
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
.seatable-rows-record-wrapper {
|
|
2
|
+
outline: none;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.seatable-rows-record-container {
|
|
6
|
+
margin: 5px 0;
|
|
7
|
+
border: 1.5px solid #ddd;
|
|
8
|
+
border-radius: 5px;
|
|
9
|
+
width: 100%;
|
|
10
|
+
overflow: auto;
|
|
11
|
+
position: relative;
|
|
12
|
+
user-select: none;
|
|
13
|
+
outline: none;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
.seatable-rows-record-container .seatable-rows-record-table-name {
|
|
17
|
+
margin-left: 10px;
|
|
18
|
+
margin-top: 10px;
|
|
19
|
+
margin-bottom: 3px;
|
|
20
|
+
font-size: 15px;
|
|
21
|
+
font-weight: 500;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table tr {
|
|
26
|
+
background-color: unset !important;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table {
|
|
30
|
+
margin-top: unset !important;
|
|
31
|
+
margin-bottom: 3px !important;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table th {
|
|
35
|
+
font-size: 14px;
|
|
36
|
+
color: #888;
|
|
37
|
+
font-weight: 400;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table td {
|
|
41
|
+
font-size: 14px;
|
|
42
|
+
font-weight: 400;
|
|
43
|
+
color: #212529
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table,
|
|
47
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table td,
|
|
48
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table th {
|
|
49
|
+
border: unset !important;
|
|
50
|
+
padding-bottom: 5px !important;
|
|
51
|
+
padding-top: 5px !important;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.seatable-rows-record-container .seatable-view-records .seatable-rows-record-header,
|
|
55
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table td,
|
|
56
|
+
.seatable-rows-record-wrapper .seatable-rows-record-container table th {
|
|
57
|
+
height: 32px;
|
|
58
|
+
padding: 0 10px;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.seatable-rows-record-container.selected {
|
|
62
|
+
box-shadow: 0 0 0 2px #0aba45;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.seatable-rows-record-container .seatable-view-records {
|
|
66
|
+
margin: 0;
|
|
67
|
+
width: fit-content;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.seatable-rows-record-container .seatable-column-editor-wrapper {
|
|
71
|
+
display: flex;
|
|
72
|
+
align-items: center;
|
|
73
|
+
justify-content: center;
|
|
74
|
+
position: absolute;
|
|
75
|
+
left: 0;
|
|
76
|
+
bottom: 0;
|
|
77
|
+
width: 100%;
|
|
78
|
+
height: 30px;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.seatable-rows-record-container .seatable-column-editor-wrapper .seatable-column-width-tip {
|
|
82
|
+
background-color: #0009;
|
|
83
|
+
border-radius: 3px;
|
|
84
|
+
color: #fff;
|
|
85
|
+
font-size: 13px;
|
|
86
|
+
line-height: 20px;
|
|
87
|
+
padding: 2px 8px;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.seatable-rows-record-header th {
|
|
91
|
+
display: inline-flex;
|
|
92
|
+
align-items: center;
|
|
93
|
+
justify-content: flex-start;
|
|
94
|
+
flex: unset !important;
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
.seatable-rows-record-header .seatable-rows-record-header-cell {
|
|
98
|
+
position: relative;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.seatable-rows-record-header .seatable-rows-record-header-cell span:first-child {
|
|
102
|
+
white-space: nowrap;
|
|
103
|
+
overflow: hidden;
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.seatable-rows-record-body-cell {
|
|
107
|
+
display: inline-flex;
|
|
108
|
+
align-items: center;
|
|
109
|
+
justify-content: flex-start;
|
|
110
|
+
white-space: nowrap;
|
|
111
|
+
text-overflow: ellipsis;
|
|
112
|
+
overflow: hidden;
|
|
113
|
+
word-break: break-all;
|
|
114
|
+
flex: unset !important
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
.seatable-rows-record-body-cell .document-number-formatter {
|
|
118
|
+
text-align: right;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
.seatable-rows-record-body-cell .collaborator-item .collaborator-avatar img {
|
|
122
|
+
min-width: 16px;
|
|
123
|
+
min-height: 16px;
|
|
124
|
+
}
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
|
11
|
+
var _reactI18next = require("react-i18next");
|
|
12
|
+
var _slateReact = require("@seafile/slate-react");
|
|
13
|
+
var _dtableUtils = require("dtable-utils");
|
|
14
|
+
var _recordItem = _interopRequireDefault(require("./record-item"));
|
|
15
|
+
var _recordHeader = _interopRequireDefault(require("./record-header"));
|
|
16
|
+
require("./index.css");
|
|
17
|
+
const RowRecord = _ref => {
|
|
18
|
+
var _tableInfoRef$current, _tableInfoRef$current2;
|
|
19
|
+
let {
|
|
20
|
+
element,
|
|
21
|
+
attributes,
|
|
22
|
+
children,
|
|
23
|
+
editor
|
|
24
|
+
} = _ref;
|
|
25
|
+
const {
|
|
26
|
+
table_id,
|
|
27
|
+
row_id,
|
|
28
|
+
column_width = {}
|
|
29
|
+
} = element;
|
|
30
|
+
const [columns, setColumns] = (0, _react.useState)([]);
|
|
31
|
+
const [rowRecordName, setRowRecordName] = (0, _react.useState)(null);
|
|
32
|
+
const [shownRecord, setShownRecord] = (0, _react.useState)([]);
|
|
33
|
+
const [columnWidthMap, setColumnWidthMap] = (0, _react.useState)(column_width);
|
|
34
|
+
const [isShowColumnWidth, setIsShowColumnWidth] = (0, _react.useState)(false);
|
|
35
|
+
const [isCanModifyColumnWidth, setIsCanModifyColumnWidth] = (0, _react.useState)(false);
|
|
36
|
+
const isSelected = (0, _slateReact.useSelected)();
|
|
37
|
+
const {
|
|
38
|
+
t
|
|
39
|
+
} = (0, _reactI18next.useTranslation)('sdoc-editor');
|
|
40
|
+
const readOnly = (0, _slateReact.useReadOnly)();
|
|
41
|
+
const tableInfoRef = (0, _react.useRef)(null);
|
|
42
|
+
(0, _react.useEffect)(() => {
|
|
43
|
+
async function initTableData() {
|
|
44
|
+
const table = await editor.getTableById(table_id);
|
|
45
|
+
setRowRecordName(table.rows[0]['0000']);
|
|
46
|
+
if (!tableInfoRef.current) {
|
|
47
|
+
tableInfoRef.current = {};
|
|
48
|
+
}
|
|
49
|
+
if (!tableInfoRef.current[table_id]) {
|
|
50
|
+
tableInfoRef.current[table_id] = {
|
|
51
|
+
formulaRows: editor.getTableFormulaResults(table, table.rows),
|
|
52
|
+
idRowMap: table.rows.reduce((result, item) => {
|
|
53
|
+
result[item._id] = item;
|
|
54
|
+
return result;
|
|
55
|
+
}, {})
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
const shownRecord = table.rows.filter(item => row_id === item._id);
|
|
59
|
+
setShownRecord(shownRecord);
|
|
60
|
+
const updatedColumnWidthMap = Object.fromEntries(Object.entries(columnWidthMap).map(_ref2 => {
|
|
61
|
+
let [key, value] = _ref2;
|
|
62
|
+
return [key, value];
|
|
63
|
+
}));
|
|
64
|
+
setColumnWidthMap(updatedColumnWidthMap);
|
|
65
|
+
let validColumns = table.columns;
|
|
66
|
+
validColumns = validColumns.filter((_, index) => index !== 0).map(column => {
|
|
67
|
+
const {
|
|
68
|
+
type
|
|
69
|
+
} = column;
|
|
70
|
+
if (type === _dtableUtils.CellType.LINK) {
|
|
71
|
+
const {
|
|
72
|
+
data
|
|
73
|
+
} = column;
|
|
74
|
+
const {
|
|
75
|
+
display_column_key,
|
|
76
|
+
array_type,
|
|
77
|
+
array_data
|
|
78
|
+
} = data;
|
|
79
|
+
const display_column = {
|
|
80
|
+
key: display_column_key || '0000',
|
|
81
|
+
type: array_type || _dtableUtils.CellType.TEXT,
|
|
82
|
+
data: array_data || null
|
|
83
|
+
};
|
|
84
|
+
return {
|
|
85
|
+
...column,
|
|
86
|
+
data: {
|
|
87
|
+
...data,
|
|
88
|
+
display_column
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
}
|
|
92
|
+
return column;
|
|
93
|
+
});
|
|
94
|
+
setColumns(validColumns);
|
|
95
|
+
}
|
|
96
|
+
initTableData();
|
|
97
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
98
|
+
}, [table_id]);
|
|
99
|
+
(0, _react.useEffect)(() => {
|
|
100
|
+
if (!isSelected) {
|
|
101
|
+
queueMicrotask(() => {
|
|
102
|
+
setIsShowColumnWidth(false);
|
|
103
|
+
setIsCanModifyColumnWidth(false);
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
}, [editor, element, isSelected]);
|
|
107
|
+
const onTableClick = (0, _react.useCallback)(event => {
|
|
108
|
+
if (readOnly) return;
|
|
109
|
+
setIsShowColumnWidth(true);
|
|
110
|
+
}, [readOnly]);
|
|
111
|
+
const onTableDoubleClick = (0, _react.useCallback)(event => {
|
|
112
|
+
if (readOnly) return;
|
|
113
|
+
setIsShowColumnWidth(false);
|
|
114
|
+
setIsCanModifyColumnWidth(true);
|
|
115
|
+
}, [readOnly]);
|
|
116
|
+
const formulaRows = (tableInfoRef === null || tableInfoRef === void 0 ? void 0 : (_tableInfoRef$current = tableInfoRef.current) === null || _tableInfoRef$current === void 0 ? void 0 : (_tableInfoRef$current2 = _tableInfoRef$current[table_id]) === null || _tableInfoRef$current2 === void 0 ? void 0 : _tableInfoRef$current2.formulaRows) || {};
|
|
117
|
+
return /*#__PURE__*/_react.default.createElement("div", Object.assign({}, attributes, {
|
|
118
|
+
className: "seatable-rows-record-wrapper"
|
|
119
|
+
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
120
|
+
className: (0, _classnames.default)('seatable-rows-record-container', {
|
|
121
|
+
'selected': isSelected
|
|
122
|
+
}),
|
|
123
|
+
onClick: onTableClick,
|
|
124
|
+
onDoubleClick: onTableDoubleClick
|
|
125
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
126
|
+
className: "seatable-rows-record-table-name"
|
|
127
|
+
}, rowRecordName), /*#__PURE__*/_react.default.createElement("table", {
|
|
128
|
+
className: "seatable-rows-record-table"
|
|
129
|
+
}, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement(_recordHeader.default, {
|
|
130
|
+
editor: editor,
|
|
131
|
+
element: element,
|
|
132
|
+
columns: columns,
|
|
133
|
+
isCanModifyColumnWidth: isCanModifyColumnWidth,
|
|
134
|
+
columnWidthMap: columnWidthMap,
|
|
135
|
+
setColumnWidthMap: setColumnWidthMap
|
|
136
|
+
})), /*#__PURE__*/_react.default.createElement("tbody", {
|
|
137
|
+
className: "seatable-rows-record-body-container"
|
|
138
|
+
}, shownRecord.map((record, index) => {
|
|
139
|
+
const formulaRow = formulaRows[record._id] || {};
|
|
140
|
+
return /*#__PURE__*/_react.default.createElement(_recordItem.default, {
|
|
141
|
+
key: record._id,
|
|
142
|
+
index: index,
|
|
143
|
+
editor: editor,
|
|
144
|
+
record: record,
|
|
145
|
+
formulaRow: formulaRow,
|
|
146
|
+
columns: columns,
|
|
147
|
+
columnWidthMap: columnWidthMap
|
|
148
|
+
});
|
|
149
|
+
}))), !readOnly && isShowColumnWidth && !isCanModifyColumnWidth && /*#__PURE__*/_react.default.createElement("div", {
|
|
150
|
+
className: "seatable-column-editor-wrapper"
|
|
151
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
152
|
+
className: "seatable-column-width-tip"
|
|
153
|
+
}, t('Double_click_then_adjust_field_width'))), children));
|
|
154
|
+
};
|
|
155
|
+
const renderRow = (props, editor) => {
|
|
156
|
+
return /*#__PURE__*/_react.default.createElement(RowRecord, Object.assign({}, props, {
|
|
157
|
+
editor: editor
|
|
158
|
+
}));
|
|
159
|
+
};
|
|
160
|
+
var _default = exports.default = renderRow;
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = RecordHeader;
|
|
9
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _slateReact = require("@seafile/slate-react");
|
|
11
|
+
var _slate = require("@seafile/slate");
|
|
12
|
+
var _draggable = _interopRequireDefault(require("../../seatable-tables/draggable"));
|
|
13
|
+
const dragAbleStyle = {
|
|
14
|
+
position: 'absolute',
|
|
15
|
+
top: 0,
|
|
16
|
+
right: -3,
|
|
17
|
+
width: 5,
|
|
18
|
+
borderRadius: '3px',
|
|
19
|
+
zIndex: 2,
|
|
20
|
+
margin: '3px 0',
|
|
21
|
+
height: 'calc(100% - 6px)'
|
|
22
|
+
};
|
|
23
|
+
function RecordHeader(_ref) {
|
|
24
|
+
let {
|
|
25
|
+
editor,
|
|
26
|
+
element,
|
|
27
|
+
columns,
|
|
28
|
+
columnWidthMap,
|
|
29
|
+
setColumnWidthMap,
|
|
30
|
+
isCanModifyColumnWidth
|
|
31
|
+
} = _ref;
|
|
32
|
+
const headerCellRef = (0, _react.useRef)({});
|
|
33
|
+
const getWidthFromMouseEvent = (e, currentCell) => {
|
|
34
|
+
const right = e.pageX || e.touches && e.touches[0] && e.touches[0].pageX || e.changedTouches && e.changedTouches[e.changedTouches.length - 1].pageX;
|
|
35
|
+
const left = currentCell.getBoundingClientRect().left;
|
|
36
|
+
return right - left;
|
|
37
|
+
};
|
|
38
|
+
const onDrag = (e, currentCell, currentColumnKey) => {
|
|
39
|
+
const width = getWidthFromMouseEvent(e, currentCell);
|
|
40
|
+
if (width >= 80) {
|
|
41
|
+
const newColumnWidthMap = {
|
|
42
|
+
...columnWidthMap,
|
|
43
|
+
[currentColumnKey]: width
|
|
44
|
+
};
|
|
45
|
+
setColumnWidthMap(newColumnWidthMap);
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
const onDragEnd = () => {
|
|
49
|
+
const path = _slateReact.ReactEditor.findPath(editor, element);
|
|
50
|
+
_slate.Transforms.setNodes(editor, {
|
|
51
|
+
column_width: columnWidthMap
|
|
52
|
+
}, {
|
|
53
|
+
at: [path[0]]
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
return /*#__PURE__*/_react.default.createElement("tr", {
|
|
57
|
+
className: "seatable-rows-record-header"
|
|
58
|
+
}, columns.map(column => {
|
|
59
|
+
const width = columnWidthMap[column.key];
|
|
60
|
+
return /*#__PURE__*/_react.default.createElement("th", {
|
|
61
|
+
ref: ref => {
|
|
62
|
+
headerCellRef.current[column.key] = ref;
|
|
63
|
+
},
|
|
64
|
+
className: "seatable-rows-record-header-cell",
|
|
65
|
+
key: column.key,
|
|
66
|
+
style: {
|
|
67
|
+
width,
|
|
68
|
+
minWidth: width
|
|
69
|
+
}
|
|
70
|
+
}, /*#__PURE__*/_react.default.createElement("span", null, column.name), isCanModifyColumnWidth && /*#__PURE__*/_react.default.createElement(_draggable.default, {
|
|
71
|
+
style: dragAbleStyle,
|
|
72
|
+
onDrag: e => {
|
|
73
|
+
onDrag(e, headerCellRef.current[column.key], column.key);
|
|
74
|
+
},
|
|
75
|
+
onDragEnd: onDragEnd
|
|
76
|
+
}));
|
|
77
|
+
}));
|
|
78
|
+
}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = RecordItem;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var _dtableUtils = require("dtable-utils");
|
|
10
|
+
var _formatter = _interopRequireDefault(require("../../seatable-tables/formatter"));
|
|
11
|
+
function RecordItem(_ref) {
|
|
12
|
+
let {
|
|
13
|
+
record,
|
|
14
|
+
formulaRow,
|
|
15
|
+
columns,
|
|
16
|
+
editor,
|
|
17
|
+
columnWidthMap
|
|
18
|
+
} = _ref;
|
|
19
|
+
return /*#__PURE__*/_react.default.createElement("tr", {
|
|
20
|
+
className: "seatable-rows-record-body"
|
|
21
|
+
}, columns.map(column => {
|
|
22
|
+
const width = columnWidthMap[column.key];
|
|
23
|
+
let cellValue = record[column.key];
|
|
24
|
+
if ([_dtableUtils.CellType.LINK, _dtableUtils.CellType.LINK_FORMULA, _dtableUtils.CellType.FORMULA].includes(column.type)) {
|
|
25
|
+
cellValue = formulaRow[column.key];
|
|
26
|
+
}
|
|
27
|
+
return /*#__PURE__*/_react.default.createElement("td", {
|
|
28
|
+
className: "seatable-rows-record-body-cell",
|
|
29
|
+
key: record._id + '_' + column.key,
|
|
30
|
+
style: {
|
|
31
|
+
width,
|
|
32
|
+
minWidth: width
|
|
33
|
+
}
|
|
34
|
+
}, /*#__PURE__*/_react.default.createElement(_formatter.default, {
|
|
35
|
+
isSample: true,
|
|
36
|
+
column: column,
|
|
37
|
+
cellValue: cellValue,
|
|
38
|
+
collaborators: editor.collaborators
|
|
39
|
+
}));
|
|
40
|
+
}));
|
|
41
|
+
}
|
|
@@ -55,7 +55,8 @@ class CellFormatter extends _react.default.Component {
|
|
|
55
55
|
column,
|
|
56
56
|
cellValue,
|
|
57
57
|
collaborators,
|
|
58
|
-
isSample
|
|
58
|
+
isSample,
|
|
59
|
+
isSeatableRow
|
|
59
60
|
} = this.props;
|
|
60
61
|
const {
|
|
61
62
|
type: columnType
|
|
@@ -274,7 +275,11 @@ class CellFormatter extends _react.default.Component {
|
|
|
274
275
|
});
|
|
275
276
|
}
|
|
276
277
|
default:
|
|
277
|
-
|
|
278
|
+
if (isSeatableRow) {
|
|
279
|
+
return this.renderEmptyFormatter();
|
|
280
|
+
} else {
|
|
281
|
+
return null;
|
|
282
|
+
}
|
|
278
283
|
}
|
|
279
284
|
});
|
|
280
285
|
}
|
|
@@ -24,6 +24,7 @@ const TableMenu = _ref => {
|
|
|
24
24
|
const insertPosition = (0, _helpers.getInsertPosition)(editor, _constants.INSERT_POSITION.AFTER);
|
|
25
25
|
(0, _helpers.insertTable)(editor, size, editor.selection, insertPosition);
|
|
26
26
|
}, [editor]);
|
|
27
|
+
console.log(43543534);
|
|
27
28
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
|
|
28
29
|
disabled: disabled,
|
|
29
30
|
menuConfig: menuConfig,
|
|
@@ -53,6 +53,7 @@ const TableSizePopover = _ref => {
|
|
|
53
53
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
54
54
|
}, [displaySize, selectedSize, maxSize, minSize]);
|
|
55
55
|
const onCreateTable = (0, _react.useCallback)(() => {
|
|
56
|
+
// debugger;
|
|
56
57
|
createTable(selectedSize);
|
|
57
58
|
ref && ref.current && ref.current.toggle();
|
|
58
59
|
|
|
@@ -190,6 +191,7 @@ const TableSizePopover = _ref => {
|
|
|
190
191
|
};
|
|
191
192
|
});
|
|
192
193
|
const renderTableSize = (0, _react.useCallback)(() => {
|
|
194
|
+
// debugger;
|
|
193
195
|
let tableSize = [];
|
|
194
196
|
for (let i = 1; i <= displaySize[0]; i++) {
|
|
195
197
|
let children = [];
|
|
@@ -205,6 +205,11 @@ const CustomRenderElement = props => {
|
|
|
205
205
|
const [renderColumn] = _plugins.SeaTableColumnPlugin.renderElements;
|
|
206
206
|
return renderColumn(props, editor);
|
|
207
207
|
}
|
|
208
|
+
case _elementType.SEATABLE_ROW:
|
|
209
|
+
{
|
|
210
|
+
const [renderRow] = _plugins.SeaTableRowPlugin.renderElements;
|
|
211
|
+
return renderRow(props, editor);
|
|
212
|
+
}
|
|
208
213
|
case _elementType.SEATABLE_TABLE:
|
|
209
214
|
{
|
|
210
215
|
const [renderSeaTableTable] = _plugins.SeaTableViewsPlugin.renderElements;
|
|
@@ -18,7 +18,8 @@ var _menu4 = _interopRequireDefault(require("../../../plugins/code-block/menu"))
|
|
|
18
18
|
var _menu5 = _interopRequireDefault(require("../../../plugins/sdoc-link/menu"));
|
|
19
19
|
var _menu6 = _interopRequireDefault(require("../../../plugins/file-link/menu"));
|
|
20
20
|
var _menu7 = _interopRequireDefault(require("../../../plugins/seatable-column/menu"));
|
|
21
|
-
var _menu8 = _interopRequireDefault(require("../../../plugins/seatable-
|
|
21
|
+
var _menu8 = _interopRequireDefault(require("../../../plugins/seatable-row/menu"));
|
|
22
|
+
var _menu9 = _interopRequireDefault(require("../../../plugins/seatable-tables/menu"));
|
|
22
23
|
var _eventBus = _interopRequireDefault(require("../../../../utils/event-bus"));
|
|
23
24
|
var _constants = require("../../../../constants");
|
|
24
25
|
require("./index.css");
|
|
@@ -101,6 +102,6 @@ const InsertToolbar = _ref => {
|
|
|
101
102
|
}
|
|
102
103
|
}, /*#__PURE__*/_react.default.createElement(_menu.default, props), /*#__PURE__*/_react.default.createElement(_tableMenu.default, props), (editor === null || editor === void 0 ? void 0 : editor.editorType) !== _constants.DOCUMENT_PLUGIN_EDITOR && /*#__PURE__*/_react.default.createElement(_menu2.default, props), /*#__PURE__*/_react.default.createElement(_menu3.default, props), /*#__PURE__*/_react.default.createElement(_menu4.default, props), /*#__PURE__*/_react.default.createElement("div", {
|
|
103
104
|
className: "sdoc-dropdown-menu-divider"
|
|
104
|
-
}), editor.columns && /*#__PURE__*/_react.default.createElement(_menu7.default, props), editor.tables && /*#__PURE__*/_react.default.createElement(
|
|
105
|
+
}), editor.tables && /*#__PURE__*/_react.default.createElement(_menu8.default, props), editor.columns && /*#__PURE__*/_react.default.createElement(_menu7.default, props), editor.tables && /*#__PURE__*/_react.default.createElement(_menu9.default, props), !editor.tables && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_menu5.default, props), /*#__PURE__*/_react.default.createElement(_menu6.default, props)))));
|
|
105
106
|
};
|
|
106
107
|
var _default = exports.default = InsertToolbar;
|
|
@@ -199,7 +199,7 @@ const QuickInsertBlockMenu = _ref => {
|
|
|
199
199
|
editor: editor,
|
|
200
200
|
target: "sdoc-side-menu-item-table",
|
|
201
201
|
trigger: "hover",
|
|
202
|
-
placement: "
|
|
202
|
+
placement: "right-start",
|
|
203
203
|
popperClassName: "sdoc-side-menu-table-size sdoc-insert-element-table-size-wrapper",
|
|
204
204
|
createTable: createTable,
|
|
205
205
|
callback: callback,
|
|
@@ -162,7 +162,8 @@ const isVoidNode = node => {
|
|
|
162
162
|
const isCallout = node.type === _constants.CALL_OUT;
|
|
163
163
|
const isSeaTableTable = node.type === _constants.SEATABLE_TABLE;
|
|
164
164
|
const isSeaTableColumn = node.type === _constants.SEATABLE_COLUMN;
|
|
165
|
-
|
|
165
|
+
const isSeaTableRow = node.type === _constants.SEATABLE_ROW;
|
|
166
|
+
return _slate.Node.string(node) === '' && !hasImage && !isVideo && !isTable && !isCodeBlock && !isCallout && !isSeaTableTable && !isSeaTableColumn && !isSeaTableRow;
|
|
166
167
|
};
|
|
167
168
|
exports.isVoidNode = isVoidNode;
|
|
168
169
|
const isNotSupportTransform = node => {
|
|
@@ -35,6 +35,7 @@ const InsertBlockMenu = _ref => {
|
|
|
35
35
|
const {
|
|
36
36
|
t
|
|
37
37
|
} = (0, _reactI18next.useTranslation)('sdoc-editor');
|
|
38
|
+
console.log(1234);
|
|
38
39
|
const onInsertImageToggle = (0, _react.useCallback)(() => {
|
|
39
40
|
const eventBus = _eventBus.default.getInstance();
|
|
40
41
|
if (insertPosition === _constants.INSERT_POSITION.CURRENT) {
|
|
@@ -162,7 +163,7 @@ const InsertBlockMenu = _ref => {
|
|
|
162
163
|
editor: editor,
|
|
163
164
|
target: "sdoc-side-menu-item-table",
|
|
164
165
|
trigger: "hover",
|
|
165
|
-
placement: "
|
|
166
|
+
placement: "right-start",
|
|
166
167
|
popperClassName: "sdoc-side-menu-table-size sdoc-insert-element-table-size-wrapper",
|
|
167
168
|
createTable: createTable
|
|
168
169
|
})), /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
|
package/dist/constants/index.js
CHANGED
|
@@ -37,6 +37,7 @@ const EXTERNAL_EVENT = exports.EXTERNAL_EVENT = {
|
|
|
37
37
|
CREATE_SDOC_FILE: 'create_sdoc_file',
|
|
38
38
|
CREATE_WIKI_PAGE: 'create_wiki_page',
|
|
39
39
|
ADD_VIDEO_LINK: 'add_video_link',
|
|
40
|
+
CHANGE_HEADER_WIDTH: 'change_header_width',
|
|
40
41
|
// wiki
|
|
41
42
|
INSERT_LINK: 'insert_link',
|
|
42
43
|
// document
|