@rc-component/trigger 1.6.0 → 1.6.2

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.
Files changed (5) hide show
  1. package/es/hooks/useAlign.js +4 -4
  2. package/es/index.js +20 -2
  3. package/lib/hooks/useAlign.js +4 -4
  4. package/lib/index.js +20 -2
  5. package/package.json +2 -2
package/es/hooks/useAlign.js CHANGED
@@ -248,7 +248,7 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
248
248
 
249
249
  // Bottom to Top
250
250
  if (needAdjustY && popupPoints[0] === 't' && nextPopupBottom > visibleArea.bottom) {
251
- var tmpNextOffsetY;
251
+ var tmpNextOffsetY = nextOffsetY;
252
252
  if (sameTB) {
253
253
  tmpNextOffsetY -= popupHeight - targetHeight;
254
254
  } else {
@@ -262,7 +262,7 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
262
262
 
263
263
  // Top to Bottom
264
264
  if (needAdjustY && popupPoints[0] === 'b' && nextPopupY < visibleArea.top) {
265
- var _tmpNextOffsetY;
265
+ var _tmpNextOffsetY = nextOffsetY;
266
266
  if (sameTB) {
267
267
  _tmpNextOffsetY += popupHeight - targetHeight;
268
268
  } else {
@@ -284,7 +284,7 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
284
284
 
285
285
  // Right to Left
286
286
  if (needAdjustX && popupPoints[1] === 'l' && nextPopupRight > visibleArea.right) {
287
- var tmpNextOffsetX;
287
+ var tmpNextOffsetX = nextOffsetX;
288
288
  if (sameLR) {
289
289
  tmpNextOffsetX -= popupWidth - targetWidth;
290
290
  } else {
@@ -298,7 +298,7 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
298
298
 
299
299
  // Left to Right
300
300
  if (needAdjustX && popupPoints[1] === 'r' && nextPopupX < visibleArea.left) {
301
- var _tmpNextOffsetX;
301
+ var _tmpNextOffsetX = nextOffsetX;
302
302
  if (sameLR) {
303
303
  _tmpNextOffsetX += popupWidth - targetWidth;
304
304
  } else {
package/es/index.js CHANGED
@@ -10,6 +10,7 @@ import useEvent from "rc-util/es/hooks/useEvent";
10
10
  import useId from "rc-util/es/hooks/useId";
11
11
  import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
12
12
  import isMobile from "rc-util/es/isMobile";
13
+ import warning from "rc-util/es/warning";
13
14
  import * as React from 'react';
14
15
  import TriggerContext from "./context";
15
16
  import useAction from "./hooks/useAction";
@@ -120,8 +121,9 @@ export function generateTrigger() {
120
121
  var originChildProps = (child === null || child === void 0 ? void 0 : child.props) || {};
121
122
  var cloneProps = {};
122
123
  var inPopupOrChild = useEvent(function (ele) {
124
+ var _childDOM$getRootNode, _popupEle$getRootNode;
123
125
  var childDOM = targetEle;
124
- return (childDOM === null || childDOM === void 0 ? void 0 : childDOM.contains(ele)) || ele === childDOM || (popupEle === null || popupEle === void 0 ? void 0 : popupEle.contains(ele)) || ele === popupEle || Object.values(subPopupElements.current).some(function (subPopupEle) {
126
+ return (childDOM === null || childDOM === void 0 ? void 0 : childDOM.contains(ele)) || (childDOM === null || childDOM === void 0 ? void 0 : (_childDOM$getRootNode = childDOM.getRootNode()) === null || _childDOM$getRootNode === void 0 ? void 0 : _childDOM$getRootNode.host) === ele || ele === childDOM || (popupEle === null || popupEle === void 0 ? void 0 : popupEle.contains(ele)) || (popupEle === null || popupEle === void 0 ? void 0 : (_popupEle$getRootNode = popupEle.getRootNode()) === null || _popupEle$getRootNode === void 0 ? void 0 : _popupEle$getRootNode.host) === ele || ele === popupEle || Object.values(subPopupElements.current).some(function (subPopupEle) {
125
127
  return subPopupEle.contains(ele) || ele === subPopupEle;
126
128
  });
127
129
  });
@@ -332,12 +334,28 @@ export function generateTrigger() {
332
334
  }
333
335
  };
334
336
  var win = getWin(popupEle);
337
+ var targetRoot = targetEle === null || targetEle === void 0 ? void 0 : targetEle.getRootNode();
335
338
  win.addEventListener('click', onWindowClick);
339
+
340
+ // shadow root
341
+ var inShadow = targetRoot && targetRoot !== targetEle.ownerDocument;
342
+ if (inShadow) {
343
+ targetRoot.addEventListener('click', onWindowClick);
344
+ }
345
+
346
+ // Warning if target and popup not in same root
347
+ if (process.env.NODE_ENV !== 'production') {
348
+ var popupRoot = popupEle.getRootNode();
349
+ warning(targetRoot === popupRoot, "trigger element and popup element should in same shadow root.");
350
+ }
336
351
  return function () {
337
352
  win.removeEventListener('click', onWindowClick);
353
+ if (inShadow) {
354
+ targetRoot.removeEventListener('click', onWindowClick);
355
+ }
338
356
  };
339
357
  }
340
- }, [clickToHide, popupEle, mask, maskClosable]);
358
+ }, [clickToHide, targetEle, popupEle, mask, maskClosable]);
341
359
 
342
360
  // ======================= Action: Hover ========================
343
361
  var hoverToShow = showActions.has('hover');
package/lib/hooks/useAlign.js CHANGED
@@ -256,7 +256,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
256
256
 
257
257
  // Bottom to Top
258
258
  if (needAdjustY && popupPoints[0] === 't' && nextPopupBottom > visibleArea.bottom) {
259
- var tmpNextOffsetY;
259
+ var tmpNextOffsetY = nextOffsetY;
260
260
  if (sameTB) {
261
261
  tmpNextOffsetY -= popupHeight - targetHeight;
262
262
  } else {
@@ -270,7 +270,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
270
270
 
271
271
  // Top to Bottom
272
272
  if (needAdjustY && popupPoints[0] === 'b' && nextPopupY < visibleArea.top) {
273
- var _tmpNextOffsetY;
273
+ var _tmpNextOffsetY = nextOffsetY;
274
274
  if (sameTB) {
275
275
  _tmpNextOffsetY += popupHeight - targetHeight;
276
276
  } else {
@@ -292,7 +292,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
292
292
 
293
293
  // Right to Left
294
294
  if (needAdjustX && popupPoints[1] === 'l' && nextPopupRight > visibleArea.right) {
295
- var tmpNextOffsetX;
295
+ var tmpNextOffsetX = nextOffsetX;
296
296
  if (sameLR) {
297
297
  tmpNextOffsetX -= popupWidth - targetWidth;
298
298
  } else {
@@ -306,7 +306,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
306
306
 
307
307
  // Left to Right
308
308
  if (needAdjustX && popupPoints[1] === 'r' && nextPopupX < visibleArea.left) {
309
- var _tmpNextOffsetX;
309
+ var _tmpNextOffsetX = nextOffsetX;
310
310
  if (sameLR) {
311
311
  _tmpNextOffsetX += popupWidth - targetWidth;
312
312
  } else {
package/lib/index.js CHANGED
@@ -18,6 +18,7 @@ var _useEvent = _interopRequireDefault(require("rc-util/lib/hooks/useEvent"));
18
18
  var _useId = _interopRequireDefault(require("rc-util/lib/hooks/useId"));
19
19
  var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
20
20
  var _isMobile = _interopRequireDefault(require("rc-util/lib/isMobile"));
21
+ var _warning = _interopRequireDefault(require("rc-util/lib/warning"));
21
22
  var React = _interopRequireWildcard(require("react"));
22
23
  var _context = _interopRequireDefault(require("./context"));
23
24
  var _useAction3 = _interopRequireDefault(require("./hooks/useAction"));
@@ -129,8 +130,9 @@ function generateTrigger() {
129
130
  var originChildProps = (child === null || child === void 0 ? void 0 : child.props) || {};
130
131
  var cloneProps = {};
131
132
  var inPopupOrChild = (0, _useEvent.default)(function (ele) {
133
+ var _childDOM$getRootNode, _popupEle$getRootNode;
132
134
  var childDOM = targetEle;
133
- return (childDOM === null || childDOM === void 0 ? void 0 : childDOM.contains(ele)) || ele === childDOM || (popupEle === null || popupEle === void 0 ? void 0 : popupEle.contains(ele)) || ele === popupEle || Object.values(subPopupElements.current).some(function (subPopupEle) {
135
+ return (childDOM === null || childDOM === void 0 ? void 0 : childDOM.contains(ele)) || (childDOM === null || childDOM === void 0 ? void 0 : (_childDOM$getRootNode = childDOM.getRootNode()) === null || _childDOM$getRootNode === void 0 ? void 0 : _childDOM$getRootNode.host) === ele || ele === childDOM || (popupEle === null || popupEle === void 0 ? void 0 : popupEle.contains(ele)) || (popupEle === null || popupEle === void 0 ? void 0 : (_popupEle$getRootNode = popupEle.getRootNode()) === null || _popupEle$getRootNode === void 0 ? void 0 : _popupEle$getRootNode.host) === ele || ele === popupEle || Object.values(subPopupElements.current).some(function (subPopupEle) {
134
136
  return subPopupEle.contains(ele) || ele === subPopupEle;
135
137
  });
136
138
  });
@@ -341,12 +343,28 @@ function generateTrigger() {
341
343
  }
342
344
  };
343
345
  var win = (0, _util.getWin)(popupEle);
346
+ var targetRoot = targetEle === null || targetEle === void 0 ? void 0 : targetEle.getRootNode();
344
347
  win.addEventListener('click', onWindowClick);
348
+
349
+ // shadow root
350
+ var inShadow = targetRoot && targetRoot !== targetEle.ownerDocument;
351
+ if (inShadow) {
352
+ targetRoot.addEventListener('click', onWindowClick);
353
+ }
354
+
355
+ // Warning if target and popup not in same root
356
+ if (process.env.NODE_ENV !== 'production') {
357
+ var popupRoot = popupEle.getRootNode();
358
+ (0, _warning.default)(targetRoot === popupRoot, "trigger element and popup element should in same shadow root.");
359
+ }
345
360
  return function () {
346
361
  win.removeEventListener('click', onWindowClick);
362
+ if (inShadow) {
363
+ targetRoot.removeEventListener('click', onWindowClick);
364
+ }
347
365
  };
348
366
  }
349
- }, [clickToHide, popupEle, mask, maskClosable]);
367
+ }, [clickToHide, targetEle, popupEle, mask, maskClosable]);
350
368
 
351
369
  // ======================= Action: Hover ========================
352
370
  var hoverToShow = showActions.has('hover');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rc-component/trigger",
3
- "version": "1.6.0",
3
+ "version": "1.6.2",
4
4
  "description": "base abstract trigger component for react",
5
5
  "engines": {
6
6
  "node": ">=8.x"
@@ -46,7 +46,7 @@
46
46
  "@types/classnames": "^2.2.10",
47
47
  "@types/jest": "^26.0.15",
48
48
  "@types/react": "^16.8.19",
49
- "@types/react-dom": "^16.8.4",
49
+ "@types/react-dom": "^18.0.11",
50
50
  "cross-env": "^7.0.1",
51
51
  "dumi": "^2.1.0",
52
52
  "eslint": "^7.0.0",