@rc-component/trigger 1.15.0 → 1.15.2

package/es/Popup/index.d.ts

@@ -10,6 +10,7 @@ export interface PopupProps {
     target: HTMLElement;
     onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
     onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+    onPointerEnter?: React.MouseEventHandler<HTMLDivElement>;
     zIndex?: number;
     mask?: boolean;
     onVisibleChanged: (visible: boolean) => void;

package/es/Popup/index.js

@@ -33,6 +33,7 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
     zIndex = props.zIndex,
     onMouseEnter = props.onMouseEnter,
     onMouseLeave = props.onMouseLeave,
+    onPointerEnter = props.onPointerEnter,
     ready = props.ready,
     offsetX = props.offsetX,
     offsetY = props.offsetY,
@@ -164,6 +165,7 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
         }, style),
         onMouseEnter: onMouseEnter,
         onMouseLeave: onMouseLeave,
+        onPointerEnter: onPointerEnter,
         onClick: onClick
       }, arrow && /*#__PURE__*/React.createElement(Arrow, {
         prefixCls: prefixCls,

package/es/hooks/useWatch.d.ts

@@ -1 +1 @@
-export default function useWatch(open: boolean, target: HTMLElement, popup: HTMLElement, onAlign: VoidFunction): void;
+export default function useWatch(open: boolean, target: HTMLElement, popup: HTMLElement, onAlign: VoidFunction, onScroll: VoidFunction): void;

package/es/hooks/useWatch.js

@@ -1,7 +1,7 @@
 import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
 import { collectScroller, getWin } from "../util";
-export default function useWatch(open, target, popup, onAlign) {
+export default function useWatch(open, target, popup, onAlign, onScroll) {
   useLayoutEffect(function () {
     if (open && target && popup) {
       var targetElement = target;
@@ -12,6 +12,7 @@ export default function useWatch(open, target, popup, onAlign) {
       var mergedList = new Set([win].concat(_toConsumableArray(targetScrollList), _toConsumableArray(popupScrollList)));
       function notifyScroll() {
         onAlign();
+        onScroll();
       }
       mergedList.forEach(function (scroller) {
         scroller.addEventListener('scroll', notifyScroll, {

package/es/index.js

@@ -226,12 +226,23 @@ export function generateTrigger() {
       scaleY = _useAlign2[8],
       alignInfo = _useAlign2[9],
       onAlign = _useAlign2[10];
+    var _useAction = useAction(mobile, action, showAction, hideAction),
+      _useAction2 = _slicedToArray(_useAction, 2),
+      showActions = _useAction2[0],
+      hideActions = _useAction2[1];
+    var clickToShow = showActions.has('click');
+    var clickToHide = hideActions.has('click') || hideActions.has('contextMenu');
     var triggerAlign = useEvent(function () {
       if (!inMotion) {
         onAlign();
       }
     });
-    useWatch(mergedOpen, targetEle, popupEle, triggerAlign);
+    var onScroll = function onScroll() {
+      if (openRef.current && alignPoint && clickToHide) {
+        triggerOpen(false);
+      }
+    };
+    useWatch(mergedOpen, targetEle, popupEle, triggerAlign, onScroll);
     useLayoutEffect(function () {
       triggerAlign();
     }, [mousePos, popupPlacement]);
@@ -294,11 +305,6 @@ export function generateTrigger() {
     };
 
     // =========================== Action ===========================
-    var _useAction = useAction(mobile, action, showAction, hideAction),
-      _useAction2 = _slicedToArray(_useAction, 2),
-      showActions = _useAction2[0],
-      hideActions = _useAction2[1];
-
     /**
      * Util wrapper for trigger action
      */
@@ -317,8 +323,6 @@ export function generateTrigger() {
     }
 
     // ======================= Action: Click ========================
-    var clickToShow = showActions.has('click');
-    var clickToHide = hideActions.has('click') || hideActions.has('contextMenu');
     if (clickToShow || clickToHide) {
       cloneProps.onClick = function (event) {
         var _originChildProps$onC;
@@ -455,7 +459,10 @@ export function generateTrigger() {
       style: popupStyle,
       target: targetEle,
       onMouseEnter: onPopupMouseEnter,
-      onMouseLeave: onPopupMouseLeave,
+      onMouseLeave: onPopupMouseLeave
+      // https://github.com/ant-design/ant-design/issues/43924
+      ,
+      onPointerEnter: onPopupMouseEnter,
       zIndex: zIndex
       // Open
       ,

package/lib/Popup/index.d.ts

@@ -10,6 +10,7 @@ export interface PopupProps {
     target: HTMLElement;
     onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
     onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+    onPointerEnter?: React.MouseEventHandler<HTMLDivElement>;
     zIndex?: number;
     mask?: boolean;
     onVisibleChanged: (visible: boolean) => void;

package/lib/Popup/index.js

@@ -41,6 +41,7 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
     zIndex = props.zIndex,
     onMouseEnter = props.onMouseEnter,
     onMouseLeave = props.onMouseLeave,
+    onPointerEnter = props.onPointerEnter,
     ready = props.ready,
     offsetX = props.offsetX,
     offsetY = props.offsetY,
@@ -172,6 +173,7 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
         }, style),
         onMouseEnter: onMouseEnter,
         onMouseLeave: onMouseLeave,
+        onPointerEnter: onPointerEnter,
         onClick: onClick
       }, arrow && /*#__PURE__*/React.createElement(_Arrow.default, {
         prefixCls: prefixCls,

package/lib/hooks/useWatch.d.ts

@@ -1 +1 @@
-export default function useWatch(open: boolean, target: HTMLElement, popup: HTMLElement, onAlign: VoidFunction): void;
+export default function useWatch(open: boolean, target: HTMLElement, popup: HTMLElement, onAlign: VoidFunction, onScroll: VoidFunction): void;

package/lib/hooks/useWatch.js

@@ -8,7 +8,7 @@ exports.default = useWatch;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
 var _util = require("../util");
-function useWatch(open, target, popup, onAlign) {
+function useWatch(open, target, popup, onAlign, onScroll) {
   (0, _useLayoutEffect.default)(function () {
     if (open && target && popup) {
       var targetElement = target;
@@ -19,6 +19,7 @@ function useWatch(open, target, popup, onAlign) {
       var mergedList = new Set([win].concat((0, _toConsumableArray2.default)(targetScrollList), (0, _toConsumableArray2.default)(popupScrollList)));
       function notifyScroll() {
         onAlign();
+        onScroll();
       }
       mergedList.forEach(function (scroller) {
         scroller.addEventListener('scroll', notifyScroll, {

package/lib/index.js

@@ -236,12 +236,23 @@ function generateTrigger() {
       scaleY = _useAlign2[8],
       alignInfo = _useAlign2[9],
       onAlign = _useAlign2[10];
+    var _useAction = (0, _useAction3.default)(mobile, action, showAction, hideAction),
+      _useAction2 = (0, _slicedToArray2.default)(_useAction, 2),
+      showActions = _useAction2[0],
+      hideActions = _useAction2[1];
+    var clickToShow = showActions.has('click');
+    var clickToHide = hideActions.has('click') || hideActions.has('contextMenu');
     var triggerAlign = (0, _useEvent.default)(function () {
       if (!inMotion) {
         onAlign();
       }
     });
-    (0, _useWatch.default)(mergedOpen, targetEle, popupEle, triggerAlign);
+    var onScroll = function onScroll() {
+      if (openRef.current && alignPoint && clickToHide) {
+        triggerOpen(false);
+      }
+    };
+    (0, _useWatch.default)(mergedOpen, targetEle, popupEle, triggerAlign, onScroll);
     (0, _useLayoutEffect.default)(function () {
       triggerAlign();
     }, [mousePos, popupPlacement]);
@@ -304,11 +315,6 @@ function generateTrigger() {
     };
 
     // =========================== Action ===========================
-    var _useAction = (0, _useAction3.default)(mobile, action, showAction, hideAction),
-      _useAction2 = (0, _slicedToArray2.default)(_useAction, 2),
-      showActions = _useAction2[0],
-      hideActions = _useAction2[1];
-
     /**
      * Util wrapper for trigger action
      */
@@ -327,8 +333,6 @@ function generateTrigger() {
     }
 
     // ======================= Action: Click ========================
-    var clickToShow = showActions.has('click');
-    var clickToHide = hideActions.has('click') || hideActions.has('contextMenu');
     if (clickToShow || clickToHide) {
       cloneProps.onClick = function (event) {
         var _originChildProps$onC;
@@ -465,7 +469,10 @@ function generateTrigger() {
       style: popupStyle,
       target: targetEle,
       onMouseEnter: onPopupMouseEnter,
-      onMouseLeave: onPopupMouseLeave,
+      onMouseLeave: onPopupMouseLeave
+      // https://github.com/ant-design/ant-design/issues/43924
+      ,
+      onPointerEnter: onPopupMouseEnter,
       zIndex: zIndex
       // Open
       ,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rc-component/trigger",
-  "version": "1.15.0",
+  "version": "1.15.2",
   "description": "base abstract trigger component for react",
   "engines": {
     "node": ">=8.x"