@kdcloudjs/table 1.2.2-canary.11 → 1.2.2-canary.13
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/LICENSE +568 -568
- package/README.md +111 -111
- package/dist/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.js +3628 -3483
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +11 -13
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/dist/kd-ui-complete.less +777 -777
- package/es/_utils/formatUtil.js +5 -1
- package/es/_utils/hooks.js +3 -3
- package/es/_utils/usePopper.js +13 -13
- package/es/locale/locale.js +7 -6
- package/es/style/color/colors.less +1 -1
- package/es/style/core/index.less +1 -1
- package/es/style/core/motion/other.less +27 -27
- package/es/style/core/motion/slide.less +53 -53
- package/es/style/core/motion.less +1 -1
- package/es/style/core/reset.less +185 -185
- package/es/style/index.less +1 -1
- package/es/style/mixins/index.less +18 -18
- package/es/style/mixins/overlay.less +21 -21
- package/es/style/mixins/reset.less +12 -12
- package/es/style/themes/default.less +445 -445
- package/es/table/base/BlankComponent.d.ts +11 -0
- package/es/table/base/BlankComponent.js +61 -0
- package/es/table/base/calculations.js +3 -3
- package/es/table/base/empty.js +2 -2
- package/es/table/base/globalStyleComponent.d.ts +5 -1
- package/es/table/base/globalStyleComponent.js +11 -7
- package/es/table/base/header.js +19 -8
- package/es/table/base/helpers/FastScrollManager.d.ts +96 -0
- package/es/table/base/helpers/FastScrollManager.js +167 -0
- package/es/table/base/helpers/SpanManager.js +2 -1
- package/es/table/base/helpers/TableDOMUtils.js +6 -5
- package/es/table/base/html-table.d.ts +1 -1
- package/es/table/base/html-table.js +16 -5
- package/es/table/base/interfaces.d.ts +2 -0
- package/es/table/base/loading.js +2 -2
- package/es/table/base/renderTemplates.js +16 -16
- package/es/table/base/styles.d.ts +2 -2
- package/es/table/base/styles.js +59 -4
- package/es/table/base/table.d.ts +14 -0
- package/es/table/base/table.js +163 -98
- package/es/table/base/utils.d.ts +1 -0
- package/es/table/base/utils.js +9 -3
- package/es/table/pipeline/features/colGroupExtendable.d.ts +1 -1
- package/es/table/pipeline/features/colGroupExtendable.js +7 -3
- package/es/table/pipeline/features/columnDrag.js +21 -12
- package/es/table/pipeline/features/columnFilter.js +5 -2
- package/es/table/pipeline/features/columnResizeWidth.js +11 -4
- package/es/table/pipeline/features/contextMenu.js +15 -8
- package/es/table/pipeline/features/featureApi/RowDragApi.js +2 -1
- package/es/table/pipeline/features/filter/DefaultFilterContent.js +5 -4
- package/es/table/pipeline/features/filter/Filter.d.ts +2 -1
- package/es/table/pipeline/features/filter/Filter.js +13 -8
- package/es/table/pipeline/features/filter/FilterPanel.d.ts +3 -1
- package/es/table/pipeline/features/filter/FilterPanel.js +15 -5
- package/es/table/pipeline/features/rangeSelection.js +10 -10
- package/es/table/pipeline/features/rowDetail.js +2 -2
- package/es/table/pipeline/features/rowDrag.js +47 -19
- package/es/table/pipeline/features/rowGrouping.js +2 -2
- package/es/table/pipeline/features/sort.js +7 -6
- package/es/table/pipeline/features/tips.js +10 -6
- package/es/table/pipeline/features/treeMode.js +5 -5
- package/es/table/pipeline/features/treeSelect.js +2 -2
- package/es/table/pipeline/pipeline.js +2 -1
- package/es/table/pivot/cross-table/buildCrossTable.js +8 -6
- package/es/table/pivot/cross-table/cross-table.js +3 -1
- package/es/table/pivot/cross-table/interfaces.d.ts +1 -1
- package/es/table/pivot/cross-tree-table/buildCrossTreeTable.js +10 -8
- package/es/table/pivot/cross-tree-table/cross-tree-table.js +11 -8
- package/es/table/pivot/pivot-utils/builders.js +3 -3
- package/es/table/pivot/pivot-utils/convert-utils.js +3 -3
- package/es/table/style/index.less +1 -1
- package/es/table/transforms/autoWidth.js +3 -3
- package/es/table/transforms/columnResize.js +5 -3
- package/es/table/transforms/sort.js +8 -6
- package/es/table/transforms/tips.js +4 -4
- package/es/table/transforms/treeMode.js +8 -6
- package/es/table/utils/buildTree.js +3 -3
- package/es/table/utils/collectNodes.js +3 -3
- package/es/table/utils/element.d.ts +1 -1
- package/es/table/utils/element.js +5 -3
- package/es/table/utils/exportTableAsExcel.js +3 -3
- package/es/table/utils/getTreeDepth.js +3 -3
- package/es/table/utils/groupBy.js +3 -3
- package/es/table/utils/makeRecursiveMapper.js +3 -3
- package/es/table/utils/mergeCellProps.js +1 -0
- package/es/table/utils/others.js +3 -3
- package/es/table/utils/traverseColumn.js +3 -3
- package/es/table/utils/tree-data-helpers/StrictTreeDataHelper.js +8 -7
- package/es/table/utils/tree-data-helpers/TreeDataHelper.js +5 -4
- package/lib/_utils/arrayUtil.js +3 -2
- package/lib/_utils/formatUtil.js +5 -1
- package/lib/_utils/hooks.js +3 -3
- package/lib/_utils/index.js +3 -2
- package/lib/_utils/type.js +5 -3
- package/lib/_utils/usePopper.js +21 -18
- package/lib/config-provider/ConfigContext.js +2 -1
- package/lib/config-provider/compDefaultProps.js +2 -1
- package/lib/config-provider/configProvider.js +4 -3
- package/lib/config-provider/defaultConfig.js +2 -1
- package/lib/config-provider/index.js +2 -1
- package/lib/locale/index.js +4 -3
- package/lib/locale/locale.js +14 -10
- package/lib/locale/zh-CN.js +2 -1
- package/lib/style/color/colors.less +1 -1
- package/lib/style/components.less +1 -1
- package/lib/style/core/index.less +1 -1
- package/lib/style/core/motion/other.less +27 -27
- package/lib/style/core/motion/slide.less +53 -53
- package/lib/style/core/motion.less +1 -1
- package/lib/style/core/reset.less +185 -185
- package/lib/style/index.less +1 -1
- package/lib/style/mixins/index.less +18 -18
- package/lib/style/mixins/overlay.less +21 -21
- package/lib/style/mixins/reset.less +12 -12
- package/lib/style/themes/default.less +445 -445
- package/lib/table/base/BlankComponent.d.ts +11 -0
- package/lib/table/base/BlankComponent.js +75 -0
- package/lib/table/base/calculations.js +3 -3
- package/lib/table/base/empty.js +4 -4
- package/lib/table/base/globalStyleComponent.d.ts +5 -1
- package/lib/table/base/globalStyleComponent.js +16 -11
- package/lib/table/base/header.js +19 -8
- package/lib/table/base/helpers/FastScrollManager.d.ts +96 -0
- package/lib/table/base/helpers/FastScrollManager.js +175 -0
- package/lib/table/base/helpers/SpanManager.js +5 -3
- package/lib/table/base/helpers/TableDOMUtils.js +9 -7
- package/lib/table/base/helpers/getRichVisibleRectsStream.js +2 -2
- package/lib/table/base/html-table.d.ts +1 -1
- package/lib/table/base/html-table.js +16 -5
- package/lib/table/base/interfaces.d.ts +2 -0
- package/lib/table/base/loading.js +2 -2
- package/lib/table/base/renderTemplates.js +18 -18
- package/lib/table/base/styles.d.ts +2 -2
- package/lib/table/base/styles.js +74 -11
- package/lib/table/base/table.d.ts +14 -0
- package/lib/table/base/table.js +173 -109
- package/lib/table/base/utils.d.ts +1 -0
- package/lib/table/base/utils.js +28 -13
- package/lib/table/common-views.js +8 -4
- package/lib/table/internals.js +3 -2
- package/lib/table/pipeline/const.js +3 -2
- package/lib/table/pipeline/features/autoFill.js +6 -3
- package/lib/table/pipeline/features/colGroupExtendable.d.ts +1 -1
- package/lib/table/pipeline/features/colGroupExtendable.js +10 -5
- package/lib/table/pipeline/features/columnDrag.js +21 -12
- package/lib/table/pipeline/features/columnFilter.js +5 -2
- package/lib/table/pipeline/features/columnResizeWidth.js +19 -9
- package/lib/table/pipeline/features/contextMenu.js +16 -9
- package/lib/table/pipeline/features/featureApi/RowDragApi.js +5 -3
- package/lib/table/pipeline/features/filter/DefaultFilterContent.js +9 -7
- package/lib/table/pipeline/features/filter/Filter.d.ts +2 -1
- package/lib/table/pipeline/features/filter/Filter.js +17 -11
- package/lib/table/pipeline/features/filter/FilterPanel.d.ts +3 -1
- package/lib/table/pipeline/features/filter/FilterPanel.js +19 -8
- package/lib/table/pipeline/features/filter/util.js +3 -2
- package/lib/table/pipeline/features/footerDataSource.js +2 -1
- package/lib/table/pipeline/features/rangeSelection.js +14 -12
- package/lib/table/pipeline/features/rowDetail.js +2 -2
- package/lib/table/pipeline/features/rowDrag.js +53 -22
- package/lib/table/pipeline/features/rowGrouping.js +2 -2
- package/lib/table/pipeline/features/sort.js +7 -6
- package/lib/table/pipeline/features/tips.js +10 -6
- package/lib/table/pipeline/features/treeMode.js +9 -7
- package/lib/table/pipeline/features/treeSelect.js +2 -2
- package/lib/table/pipeline/index.js +2 -2
- package/lib/table/pipeline/pipeline.js +4 -2
- package/lib/table/pivot/cross-table/buildCrossTable.js +8 -6
- package/lib/table/pivot/cross-table/constants.js +2 -1
- package/lib/table/pivot/cross-table/cross-table.js +6 -3
- package/lib/table/pivot/cross-table/interfaces.d.ts +1 -1
- package/lib/table/pivot/cross-tree-table/buildCrossTreeTable.js +10 -8
- package/lib/table/pivot/cross-tree-table/cross-tree-table.js +13 -9
- package/lib/table/pivot/pivot-utils/builders.js +3 -3
- package/lib/table/pivot/pivot-utils/convert-utils.js +3 -3
- package/lib/table/style/index.less +1 -1
- package/lib/table/transforms/autoWidth.js +5 -5
- package/lib/table/transforms/columnResize.js +7 -5
- package/lib/table/transforms/sort.js +10 -8
- package/lib/table/transforms/tips.js +4 -4
- package/lib/table/transforms/treeMode.js +10 -8
- package/lib/table/use/useResizeObserver.js +2 -1
- package/lib/table/utils/browserType.js +4 -2
- package/lib/table/utils/buildTree.js +3 -3
- package/lib/table/utils/collectNodes.js +3 -3
- package/lib/table/utils/console.js +3 -2
- package/lib/table/utils/copyToClipboard.js +2 -1
- package/lib/table/utils/element.d.ts +1 -1
- package/lib/table/utils/element.js +5 -3
- package/lib/table/utils/exportTableAsExcel.js +3 -3
- package/lib/table/utils/getTreeDepth.js +3 -3
- package/lib/table/utils/groupBy.js +3 -3
- package/lib/table/utils/keyCode.js +2 -1
- package/lib/table/utils/makeRecursiveMapper.js +3 -3
- package/lib/table/utils/mergeCellProps.js +1 -0
- package/lib/table/utils/others.js +5 -4
- package/lib/table/utils/proto.js +2 -1
- package/lib/table/utils/selectColumn.js +4 -2
- package/lib/table/utils/traverseColumn.js +3 -3
- package/lib/table/utils/tree-data-helpers/StrictTreeDataHelper.js +11 -9
- package/lib/table/utils/tree-data-helpers/TreeDataHelper.js +8 -6
- package/package.json +218 -218
|
@@ -49,7 +49,7 @@ function renderTableHeaderInIE(info, props, extra) {
|
|
|
49
49
|
style: typeof (extra === null || extra === void 0 ? void 0 : extra.stickyRightOffset) === 'number' ? {
|
|
50
50
|
width: extra === null || extra === void 0 ? void 0 : extra.stickyRightOffset
|
|
51
51
|
} : undefined
|
|
52
|
-
})), left.length > 0 ?
|
|
52
|
+
})), left.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
|
53
53
|
className: Classes.fixedLeft
|
|
54
54
|
}, /*#__PURE__*/React.createElement(TableHeader, {
|
|
55
55
|
info: _extends(_extends({}, info), {
|
|
@@ -75,7 +75,7 @@ function renderTableHeaderInIE(info, props, extra) {
|
|
|
75
75
|
}),
|
|
76
76
|
theaderPosition: "left",
|
|
77
77
|
rowCount: rowCount
|
|
78
|
-
}))
|
|
78
|
+
})) : null, right.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
|
79
79
|
className: Classes.fixedRight,
|
|
80
80
|
style: fixedRightTableStyle
|
|
81
81
|
}, /*#__PURE__*/React.createElement(TableHeader, {
|
|
@@ -102,7 +102,7 @@ function renderTableHeaderInIE(info, props, extra) {
|
|
|
102
102
|
}),
|
|
103
103
|
theaderPosition: 'right',
|
|
104
104
|
rowCount: rowCount
|
|
105
|
-
}))
|
|
105
|
+
})) : null);
|
|
106
106
|
}
|
|
107
107
|
function renderTableBodyInIE(info, props, extra) {
|
|
108
108
|
var dataSource = props.dataSource,
|
|
@@ -134,33 +134,33 @@ function renderTableBodyInIE(info, props, extra) {
|
|
|
134
134
|
}, /*#__PURE__*/React.createElement("div", {
|
|
135
135
|
className: Classes.virtual,
|
|
136
136
|
tabIndex: -1
|
|
137
|
-
}, topBlank > 0 &&
|
|
137
|
+
}, topBlank > 0 && /*#__PURE__*/React.createElement("div", {
|
|
138
138
|
key: "top-blank",
|
|
139
139
|
className: cx(Classes.virtualBlank, 'top'),
|
|
140
140
|
style: {
|
|
141
141
|
height: topBlank
|
|
142
142
|
}
|
|
143
|
-
})
|
|
143
|
+
}), /*#__PURE__*/React.createElement(HtmlTable, _extends({
|
|
144
144
|
tbodyHtmlTag: "tbody"
|
|
145
145
|
}, commonProps, {
|
|
146
146
|
tbodyPosition: hasLockColumn ? 'center' : undefined,
|
|
147
147
|
horizontalRenderInfo: info,
|
|
148
148
|
verticalRenderInfo: verticalRenderInfo
|
|
149
|
-
})), bottomBlank > 0 &&
|
|
149
|
+
})), bottomBlank > 0 && /*#__PURE__*/React.createElement("div", {
|
|
150
150
|
key: "bottom-blank",
|
|
151
151
|
className: cx(Classes.virtualBlank, 'bottom'),
|
|
152
152
|
style: {
|
|
153
153
|
height: bottomBlank
|
|
154
154
|
}
|
|
155
|
-
}))
|
|
155
|
+
})), left.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
|
156
156
|
className: Classes.fixedLeft
|
|
157
|
-
}, topBlank > 0 &&
|
|
157
|
+
}, topBlank > 0 && /*#__PURE__*/React.createElement("div", {
|
|
158
158
|
key: "top-blank",
|
|
159
159
|
className: cx(Classes.virtualBlank, 'top'),
|
|
160
160
|
style: {
|
|
161
161
|
height: topBlank
|
|
162
162
|
}
|
|
163
|
-
})
|
|
163
|
+
}), /*#__PURE__*/React.createElement(HtmlTable, _extends({
|
|
164
164
|
tbodyHtmlTag: "tbody"
|
|
165
165
|
}, commonProps, {
|
|
166
166
|
tbodyPosition: "left",
|
|
@@ -174,21 +174,21 @@ function renderTableBodyInIE(info, props, extra) {
|
|
|
174
174
|
visible: _sliceInstanceProperty(visible).call(visible, 0, left.length)
|
|
175
175
|
}),
|
|
176
176
|
verticalRenderInfo: verticalRenderInfo
|
|
177
|
-
})), bottomBlank > 0 &&
|
|
177
|
+
})), bottomBlank > 0 && /*#__PURE__*/React.createElement("div", {
|
|
178
178
|
key: "bottom-blank",
|
|
179
179
|
className: cx(Classes.virtualBlank, 'bottom'),
|
|
180
180
|
style: {
|
|
181
181
|
height: bottomBlank
|
|
182
182
|
}
|
|
183
|
-
}))
|
|
183
|
+
})) : null, right.length > 0 ? /*#__PURE__*/React.createElement("div", {
|
|
184
184
|
className: Classes.fixedRight
|
|
185
|
-
}, topBlank > 0 &&
|
|
185
|
+
}, topBlank > 0 && /*#__PURE__*/React.createElement("div", {
|
|
186
186
|
key: "top-blank",
|
|
187
187
|
className: cx(Classes.virtualBlank, 'top'),
|
|
188
188
|
style: {
|
|
189
189
|
height: topBlank
|
|
190
190
|
}
|
|
191
|
-
})
|
|
191
|
+
}), /*#__PURE__*/React.createElement(HtmlTable, _extends({
|
|
192
192
|
tbodyHtmlTag: "tbody"
|
|
193
193
|
}, commonProps, {
|
|
194
194
|
tbodyPosition: "right",
|
|
@@ -202,13 +202,13 @@ function renderTableBodyInIE(info, props, extra) {
|
|
|
202
202
|
visible: _sliceInstanceProperty(visible).call(visible, visible.length - right.length)
|
|
203
203
|
}),
|
|
204
204
|
verticalRenderInfo: verticalRenderInfo
|
|
205
|
-
})), bottomBlank > 0 &&
|
|
205
|
+
})), bottomBlank > 0 && /*#__PURE__*/React.createElement("div", {
|
|
206
206
|
key: "bottom-blank",
|
|
207
207
|
className: cx(Classes.virtualBlank, 'bottom'),
|
|
208
208
|
style: {
|
|
209
209
|
height: bottomBlank
|
|
210
210
|
}
|
|
211
|
-
}))
|
|
211
|
+
})) : null, /*#__PURE__*/React.createElement("div", {
|
|
212
212
|
className: Classes.rowDetailContainer
|
|
213
213
|
}));
|
|
214
214
|
}
|
|
@@ -295,7 +295,7 @@ function renderRowDetailInIE(params) {
|
|
|
295
295
|
if (!domHelper) return;
|
|
296
296
|
var artTable = domHelper.artTable;
|
|
297
297
|
var rowDetailContainer = artTable && artTable.querySelector(".".concat(Classes.rowDetailContainer));
|
|
298
|
-
return /*#__PURE__*/ReactDom.createPortal(/*#__PURE__*/React.createElement(RowDetail, _extends({}, params)), rowDetailContainer);
|
|
298
|
+
return /*#__PURE__*/ReactDom.createPortal( /*#__PURE__*/React.createElement(RowDetail, _extends({}, params)), rowDetailContainer);
|
|
299
299
|
}
|
|
300
300
|
function RowDetail(props) {
|
|
301
301
|
var detailRef = useRef(null);
|
|
@@ -113,9 +113,9 @@ export declare type BaseTableCSSVariables = Partial<{
|
|
|
113
113
|
'--primary-color-level1': string;
|
|
114
114
|
/** 主题色浅色2,深色选中、悬浮 */
|
|
115
115
|
'--primary-color-level2': string;
|
|
116
|
-
|
|
116
|
+
/** 图标默认颜色 */
|
|
117
117
|
'--icon-color': string;
|
|
118
|
-
|
|
118
|
+
/** 边框颜色 */
|
|
119
119
|
'--strong-border-color': string;
|
|
120
120
|
/** 表头中一行的高度,注意该属性将被作为 CSS variable,不能使用数字作为简写 */
|
|
121
121
|
'--header-row-height': string;
|
package/es/table/base/styles.js
CHANGED
|
@@ -3,6 +3,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
|
|
|
3
3
|
import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
|
|
4
4
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
|
5
5
|
import styled, { css, createGlobalStyle } from 'styled-components';
|
|
6
|
+
import { swapRTLDirection } from './utils';
|
|
6
7
|
export var LOCK_SHADOW_PADDING = 20;
|
|
7
8
|
var prefix = 'kd-';
|
|
8
9
|
export var Classes = {
|
|
@@ -111,8 +112,18 @@ var Z = {
|
|
|
111
112
|
scrollItem: 30,
|
|
112
113
|
loadingIndicator: 40
|
|
113
114
|
};
|
|
114
|
-
export var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .", "{\n position: absolute;\n top:0;\n
|
|
115
|
-
|
|
115
|
+
export var GlobalStyle = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n .", "{\n position: absolute;\n top:0;\n ", ":0;\n z-index: 9999;\n pointer-events:none;\n user-select: none;\n\n display:flex;\n opacity: 0.9;\n align-items:center;\n min-width:80px;\n padding: 0px 8px;\n border: 1px solid #d9d9d9;\n box-shadow: 0px 6px 16px 3px rgba(0,0,0,0.08);\n border-radius: 2px;\n background: #fff;\n max-height:48px;\n\n .", "{\n font-size:12px;\n overflow:hidden;\n text-overflow: ellipsis;\n white-space:nowrap;\n }\n \n }\n\n .", "{\n position: absolute;\n top:0;\n left:0;\n z-index: 9998;\n pointer-events:none;\n user-select: none;\n height: 2px;\n background: var(--primary-color);\n }\n .", ":before{\n content: \" \";\n position: absolute;\n width: 8px;\n height: 8px;\n top:-4px;\n border: 2px solid var(--primary-color);\n border-radius: 50%;\n background:#fff;\n }\n"])), Classes.rowDragElement, function (props) {
|
|
116
|
+
return swapRTLDirection(props.direction, 'left');
|
|
117
|
+
}, Classes.rowDragElementLabel, Classes.rowDragLine, Classes.treeTableRowDragLine);
|
|
118
|
+
var outerBorderStyleMixin = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n border-top: 1px solid #cccccc;\n border-right: 1px solid #cccccc;\n border-bottom: 1px solid #cccccc;\n border-left: 1px solid #cccccc;\n\n td.", ",\n th.", " {\n border-", ": none;\n }\n td.", ",\n th.", " {\n border-", ": none;\n }\n\n thead tr.", " th,\n tbody tr.", " td {\n border-top: none;\n }\n &.has-footer tfoot tr.", " td {\n border-bottom: none;\n }\n &:not(.has-footer) tbody tr.", " td {\n border-bottom: none;\n }\n td.", ":not(.", "){\n border-", ": var(---cell-border-vertical);\n }\n td.", ":not(.", "){\n border-", ": var(---cell-border-vertical);\n }\n"])), Classes.first, Classes.first, function (props) {
|
|
119
|
+
return props.direction === 'rtl' ? 'right' : 'left';
|
|
120
|
+
}, Classes.last, Classes.last, function (props) {
|
|
121
|
+
return props.direction === 'rtl' ? 'left' : 'right';
|
|
122
|
+
}, Classes.first, Classes.first, Classes.last, Classes.last, Classes.rowSpan, Classes.first, function (props) {
|
|
123
|
+
return props.direction === 'rtl' ? 'right' : 'left';
|
|
124
|
+
}, Classes.rowSpan, Classes.last, function (props) {
|
|
125
|
+
return props.direction === 'rtl' ? 'left' : 'right';
|
|
126
|
+
});
|
|
116
127
|
export var defaultCSSVariables = {
|
|
117
128
|
'--row-height': '48px',
|
|
118
129
|
'--color': '#333',
|
|
@@ -145,8 +156,52 @@ export var defaultCSSVariables = {
|
|
|
145
156
|
export var variableConst = getCssVariableText(defaultCSSVariables);
|
|
146
157
|
var notBorderedStyleMixin = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n --cell-border-vertical: none;\n --header-cell-border-vertical: none;\n"])));
|
|
147
158
|
var borderedStyleMixin = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n //th\u9690\u85CF\u5217\u5BBD\u62D6\u62FD\u7684\u80CC\u666F\u8272\uFF0C\u4F7F\u7528th\u7684\u53F3\u8FB9\u6846\u4EE3\u66FF\n .", "::after{\n background-color: inherit;\n }\n"])), Classes.tableHeaderCellResize);
|
|
148
|
-
export var StyledArtTableWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n :root {\n ", "\n }\n ", "\n\n box-sizing: border-box;\n * {\n box-sizing: border-box;\n }\n cursor: default;\n color: var(--color);\n font-size: var(--font-size);\n line-height: var(--line-height);\n position: relative;\n\n // \u8868\u683C\u5916\u8FB9\u6846\u7531 art-table-wrapper \u63D0\u4F9B\uFF0C\u800C\u4E0D\u662F\u7531\u5355\u5143\u683C\u63D0\u4F9B\n &.use-outer-border {\n ", ";\n }\n\n // \u8868\u683C\u4E0D\u542F\u7528\u8FB9\u6846\u7EBF\uFF0C\u9690\u85CFth\u3001td\u7684\u5355\u5143\u683C\u5DE6\u53F3\u8FB9\u6846\u7EBF\n &:not(.", ") {\n ", "\n }\n &.", "{\n ", "\n }\n\n .no-scrollbar {\n ::-webkit-scrollbar {\n display: none;\n }\n }\n\n .", " {\n overflow: auto;\n flex-shrink: 1;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n\n .", " {\n overflow: hidden;\n background: var(--header-bgcolor);\n display: flex;\n flex-shrink: 0;\n border-bottom: var(--header-cell-border-horizontal);\n }\n\n .", " {\n display: flex;\n // justify-content: flex-start;\n align-items: center;\n height: inherit;\n }\n\n .", " {\n overflow-x:auto;\n flex-shrink: 0;\n flex-grow: 0;\n scrollbar-width: none; // \u517C\u5BB9\u706B\u72D0\n & {\n ::-webkit-scrollbar {\n display:none;\n }\n }\n }\n\n .", " {\n display: flex;\n flex: none;\n }\n .", "{\n flex-grow:1;\n }\n .", ", .", " {\n background: var(--bgcolor);\n overflow: auto;\n overflow-x: hidden;\n overflow-anchor: none;\n position:relative;\n &.empty {\n position: relative;\n }\n }\n\n .", " {\n position: relative;\n }\n .", ", .", " {\n .", "{\n background-color: #e6effb !important;\n }\n .", "{\n border-top: 1px solid #0E5FD8 !important;\n }\n .", "{\n border-left: 1px solid #0E5FD8 !important;\n }\n .", "{\n border-bottom: 1px solid #0E5FD8 !important;\n }\n .", "{\n border-right: 1px solid #0E5FD8 !important;\n }\n }\n\n .", " {\n user-select:none;\n }\n\n .", " {\n user-select:none;\n // .", " .", " >td{\n // cursor:move;\n // }\n\n // .", " .", " >td{\n // cursor:no-drop;\n // }\n \n }\n\n .", "{\n opacity: 0.5;\n }\n .", "{\n border: 1px solid var(--primary-color)\n }\n\n .", " td{\n border-top: 1px solid var(--primary-color) !important;\n border-bottom: 1px solid var(--primary-color) !important;\n \n }\n .", " td:first-child{\n border-left: 1px solid var(--primary-color) !important;\n \n }\n .", " td:last-child{\n border-right: 1px solid var(--primary-color) !important;\n \n }\n\n\n // .", " td{\n // border-top: 1px solid var(--primary-color) !important;\n // }\n\n .", " td{\n border-top: 1px solid var(--primary-color) !important;\n border-bottom: 1px solid var(--primary-color) !important;\n }\n\n .", " td:first-child{\n border-left: 1px solid var(--primary-color) !important;\n }\n\n .", " td:last-child{\n border-right: 1px solid var(--primary-color) !important;\n }\n\n // .", " td{\n // border-bottom: 1px solid var(--primary-color) !important;\n // }\n\n .", " {\n cursor:pointer;\n }\n\n\n &.sticky-header .", " {\n position: sticky;\n top: 0;\n z-index: ", ";\n }\n\n &.sticky-footer .", " {\n position: sticky;\n bottom: 0;\n z-index: ", ";\n }\n\n table {\n width: 0;\n table-layout: fixed;\n border-collapse: separate;\n border-spacing: 0;\n display: table;\n margin: 0;\n padding: 0;\n flex-shrink: 0;\n flex-grow: 0;\n position:relative;\n }\n\n // \u5728 tr \u4E0A\u8BBE\u7F6E .no-hover \u53EF\u4EE5\u7981\u7528\u9F20\u6807\u60AC\u505C\u6548\u679C\n tr:not(.no-hover):hover > td {\n background: var(--hover-bgcolor);\n }\n // \u4F7F\u7528 js \u6DFB\u52A0\u60AC\u6D6E\u6548\u679C\n tr:not(.no-hover).row-hover > td {\n background: var(--hover-bgcolor);\n }\n // \u5728 tr \u8BBE\u7F6E highlight \u53EF\u4EE5\u4E3A\u5E95\u4E0B\u7684 td \u8BBE\u7F6E\u4E3A\u9AD8\u4EAE\u8272\n // \u800C\u8BBE\u7F6E .no-highlight \u7684\u8BDD\u5219\u53EF\u4EE5\u7981\u7528\u9AD8\u4EAE\u6548\u679C\uFF1B\n tr:not(.no-highlight).highlight > td {\n background: var(--highlight-bgcolor);\n }\n\n th {\n font-weight: normal;\n text-align: left;\n padding: var(--cell-padding);\n height: var(--header-row-height);\n color: var(--header-color);\n background: var(--header-bgcolor);\n border:1px solid transparent;\n border-right: var(--header-cell-border-vertical);\n border-bottom: var(--header-cell-border-horizontal);\n position: relative;\n }\n\n th.resizeable{\n border-right: var(--header-cell-border-vertical)\n }\n\n th.", " {\n border-right: var(--header-cell-border-vertical);\n border-bottom: none;\n }\n\n tr.", " th {\n border-top: var(--header-cell-border-horizontal);\n }\n th.", " {\n border-left: var(--header-cell-border-vertical);\n }\n\n td {\n padding: var(--cell-padding);\n background: var(--bgcolor);\n height: var(--row-height);\n border:1px solid transparent;\n border-right: var(--cell-border-vertical);\n border-bottom: var(--cell-border-horizontal);\n word-break: break-all;\n }\n td.", " {\n border-left: var(--cell-border-vertical);\n }\n tr.", " td {\n border-top: var(--cell-border-horizontal);\n }\n &.has-header tbody tr.", " td {\n border-top: none;\n }\n &.has-footer tbody tr.", " td {\n border-bottom: none;\n }\n\n .", ",\n .", " {\n z-index: ", ";\n }\n\n //#region \u9501\u5217\u9634\u5F71\n .", " {\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: ", ";\n pointer-events: none;\n overflow: hidden;\n\n .", " {\n height: 100%;\n }\n\n .", " {\n margin-right: ", "px;\n box-shadow: none;\n\n &.show-shadow {\n box-shadow: var(--lock-shadow);\n border-right: var(--cell-border-vertical);\n }\n }\n\n .", " {\n margin-left: ", "px;\n box-shadow: none;\n\n &.show-shadow {\n box-shadow: var(--lock-shadow);\n border-left: var(--cell-border-vertical);\n }\n }\n }\n //#endregion\n\n //#region \u7A7A\u8868\u683C\u5C55\u73B0\n .", " {\n pointer-events: none;\n color: #99a3b3;\n font-size: 12px;\n text-align: center;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n\n .empty-image {\n width: 50px;\n height: 50px;\n }\n\n .empty-tips {\n margin-top: 16px;\n line-height: 1.5;\n }\n }\n //#endregion\n\n //#region sticky\u517C\u5BB9\n &.sticky-polyfill-wrapper{\n //\u9501\u5B9A\u5217\u517C\u5BB9 \u4EC5\u5728\u9501\u5B9A\u5217\u7684\u60C5\u51B5\u4E0B\u751F\u6548\n .", " {\n overflow-x: hidden;\n }\n .", ", .", " {\n position:relative;\n }\n .", " {\n overflow: hidden;\n display: flex;\n }\n .", " {\n position: relative;\n }\n\n .", " {\n display: flex;\n overflow: auto;\n overflow-x: hidden;\n overflow-anchor: none;\n }\n\n .", ", .", "{\n position: absolute;\n z-index: ", ";\n top: 0;\n }\n .", "{\n left:0;\n }\n .", "{\n right:0;\n }\n\n .", "{\n .", "{\n position: absolute;\n top: 0;\n width: 100%;\n z-index: ", ";\n }\n }\n\n tr:not(.no-hover).row-hover > td {\n background: var(--hover-bgcolor);\n }\n }\n //#endregion sticky\u517C\u5BB9\n\n //#region \u7C98\u6027\u6EDA\u52A8\u6761\n .", "{\n display:flex;\n background: var(--bgcolor);\n }\n .", "{\n height: 1px;\n flex-shrink: 0;\n border-top: 1px solid var(--border-color);\n }\n\n .", "{\n height: 1px;\n flex-shrink: 0;\n border-top: 1px solid var(--border-color);\n }\n .", " {\n overflow-y: hidden;\n overflow-x: auto;\n z-index: ", ";\n flex-shrink: 1;\n flex-grow: 0;\n border-top: 1px solid var(--border-color);\n }\n\n .", " {\n // \u5FC5\u987B\u6709\u9AD8\u5EA6\u624D\u80FD\u51FA\u73B0\u6EDA\u52A8\u6761\n height: 1px;\n visibility: hidden;\n }\n //#endregion\n\n //#region \u52A0\u8F7D\u6837\u5F0F\n .", " {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: auto;\n\n .", " {\n filter: none;\n width: 100%;\n height: 100%;\n overflow: hidden;//\u5217\u5168\u90E8\u56FA\u5B9A\u65F6\uFF0C\u5B58\u5728\u53CC\u6A2A\u5411\u6EDA\u52A8\u6761\n display: flex;\n position: relative;\n flex-direction: column;\n }\n\n .", " {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n pointer-events: none;\n }\n\n .", " {\n position: sticky;\n z-index: ", ";\n transform: translateY(-50%);\n }\n }\n //#endregion\n\n //#region \u8868\u683C\u8FC7\u6EE4\n .", " {\n color:var(--icon-color);\n &.active{\n color:var(--primary-color);\n }\n padding: 6px 4px;\n &:hover{\n background-color: #e5e5e5;\n }\n &:focus {\n outline: none\n }\n }\n //#endregion\n\n //#region \u8868\u683C\u6392\u5E8F\n .", " {\n color:var(--icon-color);\n &.active{\n color:var(--primary-color);\n }\n }\n .", " {\n color:var(--icon-color);\n &.active{\n color:var(--primary-color);\n }\n }\n //#endregion\n\n //#region \u6EDA\u52A8\u6761\u5360\u4F4D\n .", " {\n // visibility: hidden;\n background: var(--header-bgcolor);\n position:sticky;\n z-index:5;\n right:0px;\n flex-shrink: 0;\n }\n .", " .", " {\n border-top: var(--cell-border-horizontal);\n }\n //#endregion\n\n //#region \u62D6\u62FD\u5217\u5BBD\u5927\u5C0F\n .", "::after{\n background-color: var(--border-color);\n }\n //\u89E3\u51B3\u90E8\u5206\u6D4F\u89C8\u5668(chrome109)\u6700\u540E\u4E00\u4E2A\u5355\u5143\u683C\u7684\u5217\u5BBD\u62D6\u62FD\u533A\u57DF\u7EDD\u5BF9\u5B9A\u4F4D\u8D85\u51FA\u8868\u683C\uFF0C\u5BFC\u81F4\u8868\u683C\u7AD6\u5206\u5272\u7EBF\u65E0\u6CD5\u5BF9\u9F50\n .", " th.", " .", "{\n right: 0;\n width: 5px;\n &::after{\n left: 4px;\n }\n }\n //#endregion\n\n "])), variableConst, variableConst, outerBorderStyleMixin, Classes.artTableBordered, notBorderedStyleMixin, Classes.artTableBordered, borderedStyleMixin, Classes.artTable, Classes.tableHeader, Classes.tableHeaderCellContent, Classes.virtual, Classes.tableFooter, Classes.tableBody, Classes.tableBody, Classes.tableFooter, Classes.tableRow, Classes.tableBody, Classes.tableFooter, Classes.tableCellRangeSelected, Classes.tableCellRangeTop, Classes.tableCellRangeLeft, Classes.tableCellRangeBottom, Classes.tableCellRangeRight, Classes.rangeSelection, Classes.rowDragging, Classes.tableBody, Classes.tableRow, Classes.tableFooter, Classes.tableRow, Classes.rowDragStart, Classes.rowDragNoData, Classes.rowDragEndParent, Classes.rowDragEndParent, Classes.rowDragEndParent, Classes.rowDragEndToTop, Classes.rowDragEndInto, Classes.rowDragEndInto, Classes.rowDragEndInto, Classes.rowDragEndToBottom, Classes.rowDragCell, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, Classes.leaf, Classes.first, Classes.first, Classes.first, Classes.first, Classes.first, Classes.last, Classes.lockLeft, Classes.lockRight, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, LOCK_SHADOW_PADDING, Classes.rightLockShadow, LOCK_SHADOW_PADDING, Classes.emptyWrapper, Classes.virtual, Classes.tableBody, Classes.tableFooter, Classes.tableHeaderMain, Classes.tableHeader, Classes.tableFooterMain, Classes.fixedLeft, Classes.fixedRight, Z.lock, Classes.fixedLeft, Classes.fixedRight, Classes.rowDetailContainer, Classes.rowDetailItem, Z.rowDetail, Classes.horizontalStickyScrollContainer, Classes.horizontalScrollLeftSpacer, Classes.horizontalScrollRightSpacer, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingContentWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator, Classes.tableFilterTrigger, Classes.tableSortIcon, Classes.tableExtendIcon, Classes.verticalScrollPlaceholder, Classes.tableFooter, Classes.verticalScrollPlaceholder, Classes.tableHeaderCellResize, Classes.tableHeaderRow, Classes.last, Classes.tableHeaderCellResize);
|
|
149
|
-
|
|
159
|
+
export var StyledArtTableWrapper = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n :root {\n ", "\n }\n ", "\n\n box-sizing: border-box;\n * {\n box-sizing: border-box;\n }\n cursor: default;\n color: var(--color);\n font-size: var(--font-size);\n line-height: var(--line-height);\n position: relative;\n\n // \u8868\u683C\u5916\u8FB9\u6846\u7531 art-table-wrapper \u63D0\u4F9B\uFF0C\u800C\u4E0D\u662F\u7531\u5355\u5143\u683C\u63D0\u4F9B\n &.use-outer-border {\n ", ";\n }\n\n // \u8868\u683C\u4E0D\u542F\u7528\u8FB9\u6846\u7EBF\uFF0C\u9690\u85CFth\u3001td\u7684\u5355\u5143\u683C\u5DE6\u53F3\u8FB9\u6846\u7EBF\n &:not(.", ") {\n ", "\n }\n &.", "{\n ", "\n }\n\n .no-scrollbar {\n ::-webkit-scrollbar {\n display: none;\n }\n }\n\n .", " {\n overflow: auto;\n flex-shrink: 1;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n }\n\n .", " {\n overflow: hidden;\n background: var(--header-bgcolor);\n display: flex;\n flex-shrink: 0;\n border-bottom: var(--header-cell-border-horizontal);\n }\n\n .", " {\n display: flex;\n // justify-content: flex-start;\n align-items: center;\n height: inherit;\n }\n\n .", " {\n overflow-x:auto;\n flex-shrink: 0;\n flex-grow: 0;\n scrollbar-width: none; // \u517C\u5BB9\u706B\u72D0\n & {\n ::-webkit-scrollbar {\n display:none;\n }\n }\n }\n\n .", " {\n display: flex;\n flex: none;\n }\n .", "{\n flex-grow:1;\n }\n .", ", .", " {\n background: var(--bgcolor);\n overflow: auto;\n overflow-x: hidden;\n overflow-anchor: none;\n position:relative;\n &.empty {\n position: relative;\n }\n }\n\n .", " {\n position: relative;\n }\n .", ", .", " {\n .", "{\n background-color: #e6effb !important;\n }\n .", "{\n border-top: 1px solid #0E5FD8 !important;\n }\n .", "{\n border-", ": 1px solid #0E5FD8 !important;\n }\n .", "{\n border-bottom: 1px solid #0E5FD8 !important;\n }\n .", "{\n border-", ": 1px solid #0E5FD8 !important;\n }\n }\n\n .", " {\n user-select:none;\n }\n\n .", " {\n user-select:none;\n // .", " .", " >td{\n // cursor:move;\n // }\n\n // .", " .", " >td{\n // cursor:no-drop;\n // }\n \n }\n\n .", "{\n opacity: 0.5;\n }\n .", "{\n border: 1px solid var(--primary-color)\n }\n\n .", " td{\n border-top: 1px solid var(--primary-color) !important;\n border-bottom: 1px solid var(--primary-color) !important;\n \n }\n .", " td:first-child{\n border-", ": 1px solid var(--primary-color) !important;\n \n }\n .", " td:last-child{\n border-", ": 1px solid var(--primary-color) !important;\n \n }\n\n\n // .", " td{\n // border-top: 1px solid var(--primary-color) !important;\n // }\n\n .", " td{\n border-top: 1px solid var(--primary-color) !important;\n border-bottom: 1px solid var(--primary-color) !important;\n }\n\n .", " td:first-child{\n border-", ": 1px solid var(--primary-color) !important;\n }\n\n .", " td:last-child{\n border-", ": 1px solid var(--primary-color) !important;\n }\n\n // .", " td{\n // border-bottom: 1px solid var(--primary-color) !important;\n // }\n\n .", " {\n cursor:pointer;\n }\n\n\n &.sticky-header .", " {\n position: sticky;\n top: 0;\n z-index: ", ";\n }\n\n &.sticky-footer .", " {\n position: sticky;\n bottom: 0;\n z-index: ", ";\n }\n\n table {\n width: 0;\n table-layout: fixed;\n border-collapse: separate;\n border-spacing: 0;\n display: table;\n margin: 0;\n padding: 0;\n flex-shrink: 0;\n flex-grow: 0;\n position:relative;\n }\n\n // \u5728 tr \u4E0A\u8BBE\u7F6E .no-hover \u53EF\u4EE5\u7981\u7528\u9F20\u6807\u60AC\u505C\u6548\u679C\n tr:not(.no-hover):hover > td {\n background: var(--hover-bgcolor);\n }\n // \u4F7F\u7528 js \u6DFB\u52A0\u60AC\u6D6E\u6548\u679C\n tr:not(.no-hover).row-hover > td {\n background: var(--hover-bgcolor);\n }\n // \u5728 tr \u8BBE\u7F6E highlight \u53EF\u4EE5\u4E3A\u5E95\u4E0B\u7684 td \u8BBE\u7F6E\u4E3A\u9AD8\u4EAE\u8272\n // \u800C\u8BBE\u7F6E .no-highlight \u7684\u8BDD\u5219\u53EF\u4EE5\u7981\u7528\u9AD8\u4EAE\u6548\u679C\uFF1B\n tr:not(.no-highlight).highlight > td {\n background: var(--highlight-bgcolor);\n }\n\n th {\n font-weight: normal;\n text-align: ", ";\n padding: var(--cell-padding);\n height: var(--header-row-height);\n color: var(--header-color);\n background: var(--header-bgcolor);\n border:1px solid transparent;\n border-", ": var(--header-cell-border-vertical);\n border-bottom: var(--header-cell-border-horizontal);\n position: relative;\n }\n\n th.resizeable{\n border-", ": var(--header-cell-border-vertical)\n }\n\n th.", " {\n border-", ": var(--header-cell-border-vertical);\n border-bottom: none;\n }\n\n tr.", " th {\n border-top: var(--header-cell-border-horizontal);\n }\n th.", " {\n border-", ": var(--header-cell-border-vertical);\n }\n\n td {\n padding: var(--cell-padding);\n background: var(--bgcolor);\n height: var(--row-height);\n border:1px solid transparent;\n border-", ": var(--cell-border-vertical);\n border-bottom: var(--cell-border-horizontal);\n word-break: break-all;\n }\n td.", " {\n border-", ": var(--cell-border-vertical);\n }\n tr.", " td {\n border-top: var(--cell-border-horizontal);\n }\n &.has-header tbody tr.", " td {\n border-top: none;\n }\n &.has-footer tbody tr.", " td {\n border-bottom: none;\n }\n\n .", ",\n .", " {\n z-index: ", ";\n }\n\n //#region \u9501\u5217\u9634\u5F71\n .", " {\n position: absolute;\n top: 0;\n bottom: 0;\n z-index: ", ";\n pointer-events: none;\n overflow: hidden;\n\n .", " {\n height: 100%;\n }\n\n .", " {\n margin-", ": ", "px;\n \n box-shadow: none;\n\n &.show-shadow {\n box-shadow: var(--lock-shadow);\n border-", ": var(--cell-border-vertical);\n }\n }\n\n .", " {\n margin-", ": ", "px;\n box-shadow: none;\n\n &.show-shadow {\n box-shadow: var(--lock-shadow);\n border-", ": var(--cell-border-vertical);\n }\n }\n }\n //#endregion\n\n //#region \u7A7A\u8868\u683C\u5C55\u73B0\n .", " {\n pointer-events: none;\n color: #99a3b3;\n font-size: 12px;\n text-align: center;\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n\n .empty-image {\n width: 50px;\n height: 50px;\n }\n\n .empty-tips {\n margin-top: 16px;\n line-height: 1.5;\n }\n }\n //#endregion\n\n //#region sticky\u517C\u5BB9\n &.sticky-polyfill-wrapper{\n //\u9501\u5B9A\u5217\u517C\u5BB9 \u4EC5\u5728\u9501\u5B9A\u5217\u7684\u60C5\u51B5\u4E0B\u751F\u6548\n .", " {\n overflow-x: hidden;\n }\n .", ", .", " {\n position:relative;\n }\n .", " {\n overflow: hidden;\n display: flex;\n }\n .", " {\n position: relative;\n }\n\n .", " {\n display: flex;\n overflow: auto;\n overflow-x: hidden;\n overflow-anchor: none;\n }\n\n .", ", .", "{\n position: absolute;\n z-index: ", ";\n top: 0;\n }\n .", "{\n ", ":0;\n }\n .", "{\n rig", "ht:0;\n }\n\n .", "{\n .", "{\n position: absolute;\n top: 0;\n width: 100%;\n z-index: ", ";\n }\n }\n\n tr:not(.no-hover).row-hover > td {\n background: var(--hover-bgcolor);\n }\n }\n //#endregion sticky\u517C\u5BB9\n\n //#region \u7C98\u6027\u6EDA\u52A8\u6761\n .", "{\n display:flex;\n background: var(--bgcolor);\n }\n .", "{\n height: 1px;\n flex-shrink: 0;\n border-top: 1px solid var(--border-color);\n }\n\n .", "{\n height: 1px;\n flex-shrink: 0;\n border-top: 1px solid var(--border-color);\n }\n .", " {\n overflow-y: hidden;\n overflow-x: auto;\n z-index: ", ";\n flex-shrink: 1;\n flex-grow: 0;\n border-top: 1px solid var(--border-color);\n }\n\n .", " {\n // \u5FC5\u987B\u6709\u9AD8\u5EA6\u624D\u80FD\u51FA\u73B0\u6EDA\u52A8\u6761\n height: 1px;\n visibility: hidden;\n }\n //#endregion\n\n //#region \u52A0\u8F7D\u6837\u5F0F\n .", " {\n position: relative;\n width: 100%;\n height: 100%;\n overflow: auto;\n\n .", " {\n filter: none;\n width: 100%;\n height: 100%;\n overflow: hidden;//\u5217\u5168\u90E8\u56FA\u5B9A\u65F6\uFF0C\u5B58\u5728\u53CC\u6A2A\u5411\u6EDA\u52A8\u6761\n display: flex;\n position: relative;\n flex-direction: column;\n }\n\n .", " {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n pointer-events: none;\n }\n\n .", " {\n position: sticky;\n z-index: ", ";\n transform: translateY(-50%);\n }\n }\n //#endregion\n\n //#region \u8868\u683C\u8FC7\u6EE4\n .", " {\n color:var(--icon-color);\n &.active{\n color:var(--primary-color);\n }\n padding: 6px 4px;\n &:hover{\n background-color: #e5e5e5;\n }\n &:focus {\n outline: none\n }\n }\n //#endregion\n\n //#region \u8868\u683C\u6392\u5E8F\n .", " {\n color:var(--icon-color);\n &.active{\n color:var(--primary-color);\n }\n }\n .", " {\n color:var(--icon-color);\n &.active{\n color:var(--primary-color);\n }\n }\n //#endregion\n\n //#region \u6EDA\u52A8\u6761\u5360\u4F4D\n .", " {\n // visibility: hidden;\n background: var(--header-bgcolor);\n position:sticky;\n z-index:5;\n ", ":0px;\n flex-shrink: 0;\n }\n .", " .", " {\n border-top: var(--cell-border-horizontal);\n }\n //#endregion\n\n //#region \u62D6\u62FD\u5217\u5BBD\u5927\u5C0F\n .", "::after{\n background-color: var(--border-color);\n }\n //\u89E3\u51B3\u90E8\u5206\u6D4F\u89C8\u5668(chrome109)\u6700\u540E\u4E00\u4E2A\u5355\u5143\u683C\u7684\u5217\u5BBD\u62D6\u62FD\u533A\u57DF\u7EDD\u5BF9\u5B9A\u4F4D\u8D85\u51FA\u8868\u683C\uFF0C\u5BFC\u81F4\u8868\u683C\u7AD6\u5206\u5272\u7EBF\u65E0\u6CD5\u5BF9\u9F50\n .", " th.", " .", "{\n ", ": 0;\n width: 5px;\n &::after{\n ", ": 4px;\n }\n }\n"])), variableConst, variableConst, outerBorderStyleMixin, Classes.artTableBordered, notBorderedStyleMixin, Classes.artTableBordered, borderedStyleMixin, Classes.artTable, Classes.tableHeader, Classes.tableHeaderCellContent, Classes.virtual, Classes.tableFooter, Classes.tableBody, Classes.tableBody, Classes.tableFooter, Classes.tableRow, Classes.tableBody, Classes.tableFooter, Classes.tableCellRangeSelected, Classes.tableCellRangeTop, Classes.tableCellRangeLeft, function (props) {
|
|
160
|
+
return swapRTLDirection(props.direction, 'left');
|
|
161
|
+
}, Classes.tableCellRangeBottom, Classes.tableCellRangeRight, function (props) {
|
|
162
|
+
return swapRTLDirection(props.direction, 'right');
|
|
163
|
+
}, Classes.rangeSelection, Classes.rowDragging, Classes.tableBody, Classes.tableRow, Classes.tableFooter, Classes.tableRow, Classes.rowDragStart, Classes.rowDragNoData, Classes.rowDragEndParent, Classes.rowDragEndParent, function (props) {
|
|
164
|
+
return swapRTLDirection(props.direction, 'left');
|
|
165
|
+
}, Classes.rowDragEndParent, function (props) {
|
|
166
|
+
return swapRTLDirection(props.direction, 'right');
|
|
167
|
+
}, Classes.rowDragEndToTop, Classes.rowDragEndInto, Classes.rowDragEndInto, function (props) {
|
|
168
|
+
return swapRTLDirection(props.direction, 'left');
|
|
169
|
+
}, Classes.rowDragEndInto, function (props) {
|
|
170
|
+
return swapRTLDirection(props.direction, 'right');
|
|
171
|
+
}, Classes.rowDragEndToBottom, Classes.rowDragCell, Classes.tableHeader, Z.header, Classes.tableFooter, Z.footer, function (props) {
|
|
172
|
+
return swapRTLDirection(props.direction, 'left');
|
|
173
|
+
}, function (props) {
|
|
174
|
+
return swapRTLDirection(props.direction, 'right');
|
|
175
|
+
}, function (props) {
|
|
176
|
+
return swapRTLDirection(props.direction, 'right');
|
|
177
|
+
}, Classes.leaf, function (props) {
|
|
178
|
+
return swapRTLDirection(props.direction, 'right');
|
|
179
|
+
}, Classes.first, Classes.first, function (props) {
|
|
180
|
+
return swapRTLDirection(props.direction, 'left');
|
|
181
|
+
}, function (props) {
|
|
182
|
+
return swapRTLDirection(props.direction, 'right');
|
|
183
|
+
}, Classes.first, function (props) {
|
|
184
|
+
return swapRTLDirection(props.direction, 'left');
|
|
185
|
+
}, Classes.first, Classes.first, Classes.last, Classes.lockLeft, Classes.lockRight, Z.lock, Classes.lockShadowMask, Z.lockShadow, Classes.lockShadow, Classes.leftLockShadow, function (props) {
|
|
186
|
+
return swapRTLDirection(props.direction, 'right');
|
|
187
|
+
}, LOCK_SHADOW_PADDING, function (props) {
|
|
188
|
+
return swapRTLDirection(props.direction, 'right');
|
|
189
|
+
}, Classes.rightLockShadow, function (props) {
|
|
190
|
+
return swapRTLDirection(props.direction, 'left');
|
|
191
|
+
}, LOCK_SHADOW_PADDING, function (props) {
|
|
192
|
+
return swapRTLDirection(props.direction, 'left');
|
|
193
|
+
}, Classes.emptyWrapper, Classes.virtual, Classes.tableBody, Classes.tableFooter, Classes.tableHeaderMain, Classes.tableHeader, Classes.tableFooterMain, Classes.fixedLeft, Classes.fixedRight, Z.lock, Classes.fixedLeft, function (props) {
|
|
194
|
+
return swapRTLDirection(props.direction, 'left');
|
|
195
|
+
}, Classes.fixedRight, function (props) {
|
|
196
|
+
return swapRTLDirection(props.direction, 'right');
|
|
197
|
+
}, Classes.rowDetailContainer, Classes.rowDetailItem, Z.rowDetail, Classes.horizontalStickyScrollContainer, Classes.horizontalScrollLeftSpacer, Classes.horizontalScrollRightSpacer, Classes.stickyScroll, Z.scrollItem, Classes.stickyScrollItem, Classes.loadingWrapper, Classes.loadingContentWrapper, Classes.loadingIndicatorWrapper, Classes.loadingIndicator, Z.loadingIndicator, Classes.tableFilterTrigger, Classes.tableSortIcon, Classes.tableExtendIcon, Classes.verticalScrollPlaceholder, function (props) {
|
|
198
|
+
return swapRTLDirection(props.direction, 'right');
|
|
199
|
+
}, Classes.tableFooter, Classes.verticalScrollPlaceholder, Classes.tableHeaderCellResize, Classes.tableHeaderRow, Classes.last, Classes.tableHeaderCellResize, function (props) {
|
|
200
|
+
return swapRTLDirection(props.direction, 'right');
|
|
201
|
+
}, function (props) {
|
|
202
|
+
return swapRTLDirection(props.direction, 'left');
|
|
203
|
+
});
|
|
204
|
+
export var ButtonCSS = css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n ", "\n .", "{\n color: var(--color);\n background:#ffffff;\n border:1px solid var(--strong-border-color);\n border-radius: 2px;\n cursor: pointer;\n &:hover{\n color: var(--primary-color);\n border:1px solid var(--primary-color);\n }\n }\n .", " {\n color:#ffffff;\n background-color: var(--primary-color);\n border:none;\n &:hover{\n color:#ffffff;\n background-color: var(--primary-color-level2);\n border:none;\n }\n }\n"])), variableConst, Classes.button, Classes.buttonPrimary);
|
|
150
205
|
function getCssVariableText(obj) {
|
|
151
206
|
return _Object$keys(obj).reduce(function (acc, key) {
|
|
152
207
|
var _context;
|
package/es/table/base/table.d.ts
CHANGED
|
@@ -23,6 +23,8 @@ export interface BaseTableProps {
|
|
|
23
23
|
};
|
|
24
24
|
/** 虚拟滚动开启情况下,表格中每一行的预估高度 */
|
|
25
25
|
estimatedRowHeight?: number;
|
|
26
|
+
/** 性能差浏览器和处理器,性能差则启动快速滚动优化,默认为 false */
|
|
27
|
+
isLowPerformance?: boolean;
|
|
26
28
|
/** @deprecated 表格头部是否置顶,默认为 true。请使用 isStickyHeader 代替 */
|
|
27
29
|
isStickyHead?: boolean;
|
|
28
30
|
/** 表格头部是否置顶,默认为 true */
|
|
@@ -88,6 +90,7 @@ export interface BaseTableProps {
|
|
|
88
90
|
/** 每个数据块的数据条数 */
|
|
89
91
|
blockSize?: number;
|
|
90
92
|
};
|
|
93
|
+
direction?: string;
|
|
91
94
|
}
|
|
92
95
|
export interface BaseTableState {
|
|
93
96
|
/** 是否要展示自定义滚动条(stickyScroll) */
|
|
@@ -106,6 +109,13 @@ export interface BaseTableState {
|
|
|
106
109
|
offsetX: number;
|
|
107
110
|
/** 横向虚拟滚动 最大渲染尺寸 */
|
|
108
111
|
maxRenderWidth: number;
|
|
112
|
+
/** 快速滚动时保留的上一次渲染数据 */
|
|
113
|
+
previousRenderData?: {
|
|
114
|
+
offsetY: number;
|
|
115
|
+
maxRenderHeight: number;
|
|
116
|
+
maxRenderWidth: number;
|
|
117
|
+
verticalRenderRange: VerticalRenderRange;
|
|
118
|
+
};
|
|
109
119
|
}
|
|
110
120
|
export declare class BaseTable extends React.Component<BaseTableProps, BaseTableState> {
|
|
111
121
|
static defaultProps: {
|
|
@@ -119,6 +129,7 @@ export declare class BaseTable extends React.Component<BaseTableProps, BaseTable
|
|
|
119
129
|
stickyScrollHeight: string;
|
|
120
130
|
useVirtual: string;
|
|
121
131
|
estimatedRowHeight: number;
|
|
132
|
+
isLowPerformance: boolean;
|
|
122
133
|
isLoading: boolean;
|
|
123
134
|
components: {};
|
|
124
135
|
getTableProps: typeof noop;
|
|
@@ -136,6 +147,9 @@ export declare class BaseTable extends React.Component<BaseTableProps, BaseTable
|
|
|
136
147
|
private hasScrollY;
|
|
137
148
|
private resizeObserver?;
|
|
138
149
|
private offsetY;
|
|
150
|
+
private fastScrollManager;
|
|
151
|
+
private topBlankRef;
|
|
152
|
+
private bottomBlankRef;
|
|
139
153
|
/** @deprecated BaseTable.getDoms() 已经过时,请勿调用 */
|
|
140
154
|
getDoms(): TableDOMHelper;
|
|
141
155
|
constructor(props: Readonly<BaseTableProps>);
|