@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.
@@ -18,7 +18,9 @@ export interface FilterFeatureOptions {
18
18
  stopClickEventPropagation?: boolean;
19
19
  /** 是否对按ESC键时关闭面板的 keydown 事件调用 event.stopPropagation() */
20
20
  stopESCKeyDownEventPropagation?: boolean;
21
- /** 是否隐藏过滤弹出菜单header区域 */
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, document.body, _getPanelOffset(ele, hideFilterPopupHeader))),
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, document.body, _getPanelOffset(ele, hideFilterPopupHeader)));
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
- }), document.body));
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
- /** 是否隐藏过滤弹出菜单header区域 */
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, document.body, _getPanelOffset(ele, hideFilterPopupHeader))),
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, document.body, _getPanelOffset(ele, hideFilterPopupHeader)));
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
- }), document.body));
191
+ hideFilterPopupHeader: hideFilterPopupHeader,
192
+ popupParent: popupParent
193
+ }), popupParent));
190
194
  }
191
195
 
192
196
  function _getPanelOffset(ele, hideFilterPopupHeader) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/table",
3
- "version": "1.1.5-canary.3",
3
+ "version": "1.1.5-canary.4",
4
4
  "description": "金蝶 react table 组件",
5
5
  "title": "table",
6
6
  "keywords": [