@kdcloudjs/table 1.1.5-canary.3 → 1.1.5-canary.4
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/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.js +15 -9
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +2 -2
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/es/table/pipeline/features/columnFilter.d.ts +3 -1
- package/es/table/pipeline/features/columnFilter.js +4 -2
- package/es/table/pipeline/features/filter/Filter.d.ts +2 -1
- package/es/table/pipeline/features/filter/Filter.js +10 -6
- package/lib/table/pipeline/features/columnFilter.d.ts +3 -1
- package/lib/table/pipeline/features/columnFilter.js +4 -2
- package/lib/table/pipeline/features/filter/Filter.d.ts +2 -1
- package/lib/table/pipeline/features/filter/Filter.js +10 -6
- package/package.json +1 -1
|
@@ -18,7 +18,9 @@ export interface FilterFeatureOptions {
|
|
|
18
18
|
stopClickEventPropagation?: boolean;
|
|
19
19
|
/** 是否对按ESC键时关闭面板的 keydown 事件调用 event.stopPropagation() */
|
|
20
20
|
stopESCKeyDownEventPropagation?: boolean;
|
|
21
|
-
/**
|
|
21
|
+
/** 是否隐藏过滤面板的header区域 */
|
|
22
22
|
hideFilterPopupHeader?: boolean;
|
|
23
|
+
/** 指定过滤面板渲染的父节点 */
|
|
24
|
+
getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
|
|
23
25
|
}
|
|
24
26
|
export declare function filter(opts?: FilterFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
|
|
@@ -30,7 +30,8 @@ export function filter() {
|
|
|
30
30
|
filterIcon = opts.filterIcon,
|
|
31
31
|
stopClickEventPropagation = opts.stopClickEventPropagation,
|
|
32
32
|
stopESCKeyDownEventPropagation = opts.stopESCKeyDownEventPropagation,
|
|
33
|
-
hideFilterPopupHeader = opts.hideFilterPopupHeader
|
|
33
|
+
hideFilterPopupHeader = opts.hideFilterPopupHeader,
|
|
34
|
+
getPopupParent = opts.getPopupParent;
|
|
34
35
|
var inputFilters = (_b = (_a = filters !== null && filters !== void 0 ? filters : pipeline.getStateAtKey(stateKey)) !== null && _a !== void 0 ? _a : defaultFilters) !== null && _b !== void 0 ? _b : [];
|
|
35
36
|
inputFilters = mode === 'single' ? _sliceInstanceProperty(inputFilters).call(inputFilters, 0, 1) : inputFilters;
|
|
36
37
|
var inputFiltersMap = new _Map(_mapInstanceProperty(inputFilters).call(inputFilters, function (filterItem) {
|
|
@@ -95,7 +96,8 @@ export function filter() {
|
|
|
95
96
|
className: cx((_cx = {}, _defineProperty(_cx, Classes.tableFilterTrigger, true), _defineProperty(_cx, "active", filterActive), _cx)),
|
|
96
97
|
stopClickEventPropagation: stopClickEventPropagation,
|
|
97
98
|
stopESCKeyDownEventPropagation: stopESCKeyDownEventPropagation,
|
|
98
|
-
hideFilterPopupHeader: hideFilterPopupHeader
|
|
99
|
+
hideFilterPopupHeader: hideFilterPopupHeader,
|
|
100
|
+
getPopupParent: getPopupParent
|
|
99
101
|
})]); // result.headerCellProps = mergeCellProps(col.headerCellProps, {
|
|
100
102
|
// style: {
|
|
101
103
|
// paddingRight: '18px'
|
|
@@ -14,6 +14,7 @@ interface FilterProps {
|
|
|
14
14
|
stopClickEventPropagation?: boolean;
|
|
15
15
|
stopESCKeyDownEventPropagation?: boolean;
|
|
16
16
|
hideFilterPopupHeader?: boolean;
|
|
17
|
+
getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
|
|
17
18
|
}
|
|
18
|
-
declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader }: FilterProps): JSX.Element;
|
|
19
|
+
declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader, getPopupParent }: FilterProps): JSX.Element;
|
|
19
20
|
export default Filter;
|
|
@@ -26,10 +26,11 @@ function Panel(_ref) {
|
|
|
26
26
|
filterIcon = _ref.filterIcon,
|
|
27
27
|
hidePanel = _ref.hidePanel,
|
|
28
28
|
renderPanelContent = _ref.renderPanelContent,
|
|
29
|
-
hideFilterPopupHeader = _ref.hideFilterPopupHeader
|
|
29
|
+
hideFilterPopupHeader = _ref.hideFilterPopupHeader,
|
|
30
|
+
popupParent = _ref.popupParent;
|
|
30
31
|
var filterPanelRef = React.useRef(null);
|
|
31
32
|
|
|
32
|
-
var _React$useState = React.useState(calculatePopupRelative(ele,
|
|
33
|
+
var _React$useState = React.useState(calculatePopupRelative(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader))),
|
|
33
34
|
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
34
35
|
position = _React$useState2[0],
|
|
35
36
|
setPosition = _React$useState2[1];
|
|
@@ -40,7 +41,7 @@ function Panel(_ref) {
|
|
|
40
41
|
};
|
|
41
42
|
|
|
42
43
|
var handleFilterPanelResize = function handleFilterPanelResize(resize) {
|
|
43
|
-
setPosition(calculatePopupRelative(ele,
|
|
44
|
+
setPosition(calculatePopupRelative(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader)));
|
|
44
45
|
};
|
|
45
46
|
|
|
46
47
|
useEffect(function () {
|
|
@@ -75,7 +76,8 @@ function Filter(_ref2) {
|
|
|
75
76
|
isFilterActive = _ref2.isFilterActive,
|
|
76
77
|
stopClickEventPropagation = _ref2.stopClickEventPropagation,
|
|
77
78
|
stopESCKeyDownEventPropagation = _ref2.stopESCKeyDownEventPropagation,
|
|
78
|
-
hideFilterPopupHeader = _ref2.hideFilterPopupHeader
|
|
79
|
+
hideFilterPopupHeader = _ref2.hideFilterPopupHeader,
|
|
80
|
+
getPopupParent = _ref2.getPopupParent;
|
|
79
81
|
|
|
80
82
|
var _React$useState3 = React.useState(false),
|
|
81
83
|
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
@@ -133,6 +135,7 @@ function Filter(_ref2) {
|
|
|
133
135
|
|
|
134
136
|
var iconClassName = cx((_cx = {}, _defineProperty(_cx, className, true), _defineProperty(_cx, 'filter-panel-open', showPanel), _cx));
|
|
135
137
|
var displayFilterIcon = typeof filterIcon === 'function' ? filterIcon(isFilterActive) : filterIcon;
|
|
138
|
+
var popupParent = (getPopupParent === null || getPopupParent === void 0 ? void 0 : getPopupParent(iconWrapRef.current)) || document.body;
|
|
136
139
|
return /*#__PURE__*/React.createElement(FilterIconSpanStyle, {
|
|
137
140
|
style: style,
|
|
138
141
|
className: iconClassName,
|
|
@@ -151,8 +154,9 @@ function Filter(_ref2) {
|
|
|
151
154
|
filterIcon: displayFilterIcon,
|
|
152
155
|
hidePanel: hidePanel,
|
|
153
156
|
renderPanelContent: renderPanelContent,
|
|
154
|
-
hideFilterPopupHeader: hideFilterPopupHeader
|
|
155
|
-
|
|
157
|
+
hideFilterPopupHeader: hideFilterPopupHeader,
|
|
158
|
+
popupParent: popupParent
|
|
159
|
+
}), popupParent));
|
|
156
160
|
}
|
|
157
161
|
|
|
158
162
|
function _getPanelOffset(ele, hideFilterPopupHeader) {
|
|
@@ -18,7 +18,9 @@ export interface FilterFeatureOptions {
|
|
|
18
18
|
stopClickEventPropagation?: boolean;
|
|
19
19
|
/** 是否对按ESC键时关闭面板的 keydown 事件调用 event.stopPropagation() */
|
|
20
20
|
stopESCKeyDownEventPropagation?: boolean;
|
|
21
|
-
/**
|
|
21
|
+
/** 是否隐藏过滤面板的header区域 */
|
|
22
22
|
hideFilterPopupHeader?: boolean;
|
|
23
|
+
/** 指定过滤面板渲染的父节点 */
|
|
24
|
+
getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
|
|
23
25
|
}
|
|
24
26
|
export declare function filter(opts?: FilterFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
|
|
@@ -56,7 +56,8 @@ function filter() {
|
|
|
56
56
|
filterIcon = opts.filterIcon,
|
|
57
57
|
stopClickEventPropagation = opts.stopClickEventPropagation,
|
|
58
58
|
stopESCKeyDownEventPropagation = opts.stopESCKeyDownEventPropagation,
|
|
59
|
-
hideFilterPopupHeader = opts.hideFilterPopupHeader
|
|
59
|
+
hideFilterPopupHeader = opts.hideFilterPopupHeader,
|
|
60
|
+
getPopupParent = opts.getPopupParent;
|
|
60
61
|
var inputFilters = (_b = (_a = filters !== null && filters !== void 0 ? filters : pipeline.getStateAtKey(stateKey)) !== null && _a !== void 0 ? _a : defaultFilters) !== null && _b !== void 0 ? _b : [];
|
|
61
62
|
inputFilters = mode === 'single' ? (0, _slice.default)(inputFilters).call(inputFilters, 0, 1) : inputFilters;
|
|
62
63
|
var inputFiltersMap = new _map.default((0, _map2.default)(inputFilters).call(inputFilters, function (filterItem) {
|
|
@@ -118,7 +119,8 @@ function filter() {
|
|
|
118
119
|
className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, _styles.Classes.tableFilterTrigger, true), (0, _defineProperty2.default)(_cx, "active", filterActive), _cx)),
|
|
119
120
|
stopClickEventPropagation: stopClickEventPropagation,
|
|
120
121
|
stopESCKeyDownEventPropagation: stopESCKeyDownEventPropagation,
|
|
121
|
-
hideFilterPopupHeader: hideFilterPopupHeader
|
|
122
|
+
hideFilterPopupHeader: hideFilterPopupHeader,
|
|
123
|
+
getPopupParent: getPopupParent
|
|
122
124
|
})]); // result.headerCellProps = mergeCellProps(col.headerCellProps, {
|
|
123
125
|
// style: {
|
|
124
126
|
// paddingRight: '18px'
|
|
@@ -14,6 +14,7 @@ interface FilterProps {
|
|
|
14
14
|
stopClickEventPropagation?: boolean;
|
|
15
15
|
stopESCKeyDownEventPropagation?: boolean;
|
|
16
16
|
hideFilterPopupHeader?: boolean;
|
|
17
|
+
getPopupParent?: (triggerElement: HTMLElement) => HTMLElement;
|
|
17
18
|
}
|
|
18
|
-
declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader }: FilterProps): JSX.Element;
|
|
19
|
+
declare function Filter({ size, style, className, FilterPanelContent, filterIcon, setFilter, setFilterModel, filterModel, isFilterActive, stopClickEventPropagation, stopESCKeyDownEventPropagation, hideFilterPopupHeader, getPopupParent }: FilterProps): JSX.Element;
|
|
19
20
|
export default Filter;
|
|
@@ -58,11 +58,12 @@ function Panel(_ref) {
|
|
|
58
58
|
filterIcon = _ref.filterIcon,
|
|
59
59
|
hidePanel = _ref.hidePanel,
|
|
60
60
|
renderPanelContent = _ref.renderPanelContent,
|
|
61
|
-
hideFilterPopupHeader = _ref.hideFilterPopupHeader
|
|
61
|
+
hideFilterPopupHeader = _ref.hideFilterPopupHeader,
|
|
62
|
+
popupParent = _ref.popupParent;
|
|
62
63
|
|
|
63
64
|
var filterPanelRef = _react.default.useRef(null);
|
|
64
65
|
|
|
65
|
-
var _React$useState = _react.default.useState((0, _utils.calculatePopupRelative)(ele,
|
|
66
|
+
var _React$useState = _react.default.useState((0, _utils.calculatePopupRelative)(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader))),
|
|
66
67
|
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
|
67
68
|
position = _React$useState2[0],
|
|
68
69
|
setPosition = _React$useState2[1];
|
|
@@ -73,7 +74,7 @@ function Panel(_ref) {
|
|
|
73
74
|
};
|
|
74
75
|
|
|
75
76
|
var handleFilterPanelResize = function handleFilterPanelResize(resize) {
|
|
76
|
-
setPosition((0, _utils.calculatePopupRelative)(ele,
|
|
77
|
+
setPosition((0, _utils.calculatePopupRelative)(ele, popupParent, _getPanelOffset(ele, hideFilterPopupHeader)));
|
|
77
78
|
};
|
|
78
79
|
|
|
79
80
|
(0, _react.useEffect)(function () {
|
|
@@ -108,7 +109,8 @@ function Filter(_ref2) {
|
|
|
108
109
|
isFilterActive = _ref2.isFilterActive,
|
|
109
110
|
stopClickEventPropagation = _ref2.stopClickEventPropagation,
|
|
110
111
|
stopESCKeyDownEventPropagation = _ref2.stopESCKeyDownEventPropagation,
|
|
111
|
-
hideFilterPopupHeader = _ref2.hideFilterPopupHeader
|
|
112
|
+
hideFilterPopupHeader = _ref2.hideFilterPopupHeader,
|
|
113
|
+
getPopupParent = _ref2.getPopupParent;
|
|
112
114
|
|
|
113
115
|
var _React$useState3 = _react.default.useState(false),
|
|
114
116
|
_React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
|
|
@@ -167,6 +169,7 @@ function Filter(_ref2) {
|
|
|
167
169
|
|
|
168
170
|
var iconClassName = (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, className, true), (0, _defineProperty2.default)(_cx, 'filter-panel-open', showPanel), _cx));
|
|
169
171
|
var displayFilterIcon = typeof filterIcon === 'function' ? filterIcon(isFilterActive) : filterIcon;
|
|
172
|
+
var popupParent = (getPopupParent === null || getPopupParent === void 0 ? void 0 : getPopupParent(iconWrapRef.current)) || document.body;
|
|
170
173
|
return /*#__PURE__*/_react.default.createElement(FilterIconSpanStyle, {
|
|
171
174
|
style: style,
|
|
172
175
|
className: iconClassName,
|
|
@@ -185,8 +188,9 @@ function Filter(_ref2) {
|
|
|
185
188
|
filterIcon: displayFilterIcon,
|
|
186
189
|
hidePanel: hidePanel,
|
|
187
190
|
renderPanelContent: renderPanelContent,
|
|
188
|
-
hideFilterPopupHeader: hideFilterPopupHeader
|
|
189
|
-
|
|
191
|
+
hideFilterPopupHeader: hideFilterPopupHeader,
|
|
192
|
+
popupParent: popupParent
|
|
193
|
+
}), popupParent));
|
|
190
194
|
}
|
|
191
195
|
|
|
192
196
|
function _getPanelOffset(ele, hideFilterPopupHeader) {
|