@rc-component/select 1.2.4 → 1.2.6

package/es/BaseSelect/index.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import { useAllowClear } from "../hooks/useAllowClear";
 import { BaseSelectContext } from "../hooks/useBaseProps";
 import useLock from "../hooks/useLock";
-import useSelectTriggerControl from "../hooks/useSelectTriggerControl";
+import useSelectTriggerControl, { isInside } from "../hooks/useSelectTriggerControl";
 import SelectTrigger from "../SelectTrigger";
 import { getSeparatedContent, isValidCount } from "../utils/valueUtil";
 import Polite from "./Polite";
@@ -288,6 +288,12 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     keyLockRef.current = false;
   };
 
+  // ========================== Focus / Blur ==========================
+  const getSelectElements = () => [getDOM(containerRef.current), triggerRef.current?.getPopupElement()];
+
+  // Close when click on non-select element
+  useSelectTriggerControl(getSelectElements, mergedOpen, triggerOpen, !!mergedComponents.root);
+
   // ========================== Focus / Blur ==========================
   /** Record real focus status */
   // const focusRef = React.useRef<boolean>(false);
@@ -302,6 +308,14 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
       onFocus?.(event);
     }
   };
+  const onRootBlur = () => {
+    // Delay close should check the activeElement
+    if (mergedOpen) {
+      triggerOpen(false, {
+        cancelFun: () => isInside(getSelectElements(), document.activeElement)
+      });
+    }
+  };
   const onInternalBlur = event => {
     setFocused(false);
     if (mergedSearchValue) {
@@ -317,11 +331,12 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
         });
       }
     }
+    onRootBlur();
     if (!disabled) {
       onBlur?.(event);
     }
   };
-  const onInternalMouseDown = (event, ...restArgs) => {
+  const onRootMouseDown = (event, ...restArgs) => {
     const {
       target
     } = event;
@@ -330,9 +345,7 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     // We should give focus back to selector if clicked item is not focusable
     if (popupElement?.contains(target) && triggerOpen) {
       // Tell `open` not to close since it's safe in the popup
-      triggerOpen(true, {
-        ignoreNext: true
-      });
+      triggerOpen(true);
     }
     onMouseDown?.(event, ...restArgs);
   };
@@ -352,9 +365,6 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     };
   }
 
-  // Close when click on non-select element
-  useSelectTriggerControl(() => [getDOM(containerRef.current), triggerRef.current?.getPopupElement()], mergedOpen, triggerOpen, !!mergedComponents.root);
-
   // ============================ Context =============================
   const baseSelectContext = React.useMemo(() => ({
     ...props,
@@ -463,7 +473,7 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     tokenWithEnter: tokenWithEnter
     // Open
     ,
-    onMouseDown: onInternalMouseDown
+    onMouseDown: onRootMouseDown
     // Components
     ,
     components: mergedComponents
@@ -488,7 +498,8 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     empty: emptyOptions,
     onPopupVisibleChange: onTriggerVisibleChange,
     onPopupMouseEnter: onPopupMouseEnter,
-    onPopupMouseDown: onInternalMouseDown
+    onPopupMouseDown: onRootMouseDown,
+    onPopupBlur: onRootBlur
   }, renderNode);
   return /*#__PURE__*/React.createElement(BaseSelectContext.Provider, {
     value: baseSelectContext

package/es/SelectInput/index.js

@@ -10,7 +10,6 @@ import { isValidateOpenKey } from "../utils/keyUtil";
 import { clsx } from 'clsx';
 import { getDOM } from "@rc-component/util/es/Dom/findDOMNode";
 import { composeRef } from "@rc-component/util/es/ref";
-import { macroTask } from "../hooks/useOpen";
 const DEFAULT_OMIT_PROPS = ['value', 'onChange', 'removeIcon', 'placeholder', 'maxTagCount', 'maxTagTextLength', 'maxTagPlaceholder', 'choiceTransitionName', 'onInputKeyDown', 'onPopupScroll', 'tabIndex', 'activeValue', 'onSelectorRemove', 'focused'];
 export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
   const {
@@ -38,7 +37,6 @@ export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
     autoFocus,
     // Events
     onMouseDown,
-    onBlur,
     onClearMouseDown,
     onInputKeyDown,
     onSelectorRemove,
@@ -107,12 +105,13 @@ export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
   // ====================== Open ======================
   const onInternalMouseDown = useEvent(event => {
     if (!disabled) {
+      const inputDOM = getDOM(inputRef.current);
+
       // https://github.com/ant-design/ant-design/issues/56002
       // Tell `useSelectTriggerControl` to ignore this event
       // When icon is dynamic render, the parentNode will miss
       // so we need to mark the event directly
-      event.nativeEvent._ignore_global_close = true;
-      const inputDOM = getDOM(inputRef.current);
+      event.nativeEvent._ori_target = inputDOM;
       if (inputDOM && event.target !== inputDOM && !inputDOM.contains(event.target)) {
         event.preventDefault();
       }
@@ -134,15 +133,6 @@ export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
     }
     onMouseDown?.(event);
   });
-  const onInternalBlur = event => {
-    macroTask(() => {
-      const inputNode = getDOM(inputRef.current);
-      if (!inputNode || inputNode !== document.activeElement && !inputNode.contains(document.activeElement)) {
-        toggleOpen(false);
-      }
-    });
-    onBlur?.(event);
-  };
 
   // =================== Components ===================
   const {
@@ -177,8 +167,7 @@ export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
     style: style
     // Mouse Events
     ,
-    onMouseDown: onInternalMouseDown,
-    onBlur: onInternalBlur
+    onMouseDown: onInternalMouseDown
   }), /*#__PURE__*/React.createElement(Affix, {
     className: clsx(`${prefixCls}-prefix`, classNames?.prefix),
     style: styles?.prefix

package/es/SelectTrigger.d.ts

@@ -25,6 +25,7 @@ export interface SelectTriggerProps {
     onPopupVisibleChange?: (visible: boolean) => void;
     onPopupMouseEnter: () => void;
     onPopupMouseDown: React.MouseEventHandler<HTMLDivElement>;
+    onPopupBlur?: React.FocusEventHandler<HTMLDivElement>;
 }
 declare const RefSelectTrigger: React.ForwardRefExoticComponent<SelectTriggerProps & React.RefAttributes<RefTriggerProps>>;
 export default RefSelectTrigger;

package/es/SelectTrigger.js

@@ -66,6 +66,7 @@ const SelectTrigger = (props, ref) => {
     onPopupVisibleChange,
     onPopupMouseEnter,
     onPopupMouseDown,
+    onPopupBlur,
     ...restProps
   } = props;
 
@@ -117,7 +118,8 @@ const SelectTrigger = (props, ref) => {
     },
     popup: /*#__PURE__*/React.createElement("div", {
       onMouseEnter: onPopupMouseEnter,
-      onMouseDown: onPopupMouseDown
+      onMouseDown: onPopupMouseDown,
+      onBlur: onPopupBlur
     }, popupNode),
     ref: triggerPopupRef,
     stretch: stretch,

package/es/hooks/useOpen.d.ts

@@ -1,11 +1,10 @@
 export declare const macroTask: (fn: VoidFunction, times?: number) => void;
 /**
  * Trigger by latest open call, if nextOpen is undefined, means toggle.
- * ignoreNext will skip next call in the macro task queue.
+ * `weak` means this call can be ignored if previous call exists.
  */
 export type TriggerOpenType = (nextOpen?: boolean, config?: {
-    ignoreNext?: boolean;
-    lazy?: boolean;
+    cancelFun?: () => boolean;
 }) => void;
 /**
  * When `open` is controlled, follow the controlled value;

package/es/hooks/useOpen.js

@@ -17,7 +17,7 @@ export const macroTask = (fn, times = 1) => {
 
 /**
  * Trigger by latest open call, if nextOpen is undefined, means toggle.
- * ignoreNext will skip next call in the macro task queue.
+ * `weak` means this call can be ignored if previous call exists.
  */
 
 /**
@@ -41,7 +41,6 @@ export default function useOpen(propOpen, onOpen, postOpen) {
   const ssrSafeOpen = rendered ? stateOpen : false;
   const mergedOpen = postOpen(ssrSafeOpen);
   const taskIdRef = useRef(0);
-  const taskLockRef = useRef(false);
   const triggerEvent = useEvent(nextOpen => {
     if (onOpen && mergedOpen !== nextOpen) {
       onOpen(nextOpen);
@@ -50,32 +49,29 @@ export default function useOpen(propOpen, onOpen, postOpen) {
   });
   const toggleOpen = useEvent((nextOpen, config = {}) => {
     const {
-      ignoreNext = false
+      cancelFun
     } = config;
     taskIdRef.current += 1;
     const id = taskIdRef.current;
     const nextOpenVal = typeof nextOpen === 'boolean' ? nextOpen : !mergedOpen;
-
-    // Since `mergedOpen` is post-processed, we need to check if the value really changed
-    if (nextOpenVal) {
-      if (!taskLockRef.current) {
+    function triggerUpdate() {
+      if (
+      // Always check if id is match
+      id === taskIdRef.current &&
+      // Check if need to cancel
+      !cancelFun?.()) {
         triggerEvent(nextOpenVal);
-
-        // Lock if needed
-        if (ignoreNext) {
-          taskLockRef.current = ignoreNext;
-          macroTask(() => {
-            taskLockRef.current = false;
-          }, 2);
-        }
       }
-      return;
     }
-    macroTask(() => {
-      if (id === taskIdRef.current && !taskLockRef.current) {
-        triggerEvent(nextOpenVal);
-      }
-    });
+
+    // Weak update can be ignored
+    if (nextOpenVal) {
+      triggerUpdate();
+    } else {
+      macroTask(() => {
+        triggerUpdate();
+      });
+    }
   });
   return [mergedOpen, toggleOpen];
 }

package/es/hooks/useSelectTriggerControl.d.ts

@@ -1 +1,3 @@
-export default function useSelectTriggerControl(elements: () => (HTMLElement | SVGElement | undefined)[], open: boolean, triggerOpen: (open: boolean) => void, customizedTrigger: boolean): void;
+import type { TriggerOpenType } from './useOpen';
+export declare function isInside(elements: (HTMLElement | SVGElement | undefined)[], target: HTMLElement): boolean;
+export default function useSelectTriggerControl(elements: () => (HTMLElement | SVGElement | undefined)[], open: boolean, triggerOpen: TriggerOpenType, customizedTrigger: boolean): void;

package/es/hooks/useSelectTriggerControl.js

@@ -1,5 +1,8 @@
 import * as React from 'react';
 import { useEvent } from '@rc-component/util';
+export function isInside(elements, target) {
+  return elements.filter(element => element).some(element => element.contains(target) || element === target);
+}
 export default function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger) {
   const onGlobalMouseDown = useEvent(event => {
     // If trigger is customized, Trigger will take control of popupVisible
@@ -10,9 +13,12 @@ export default function useSelectTriggerControl(elements, open, triggerOpen, cus
     if (target.shadowRoot && event.composed) {
       target = event.composedPath()[0] || target;
     }
+    if (event._ori_target) {
+      target = event._ori_target;
+    }
     if (open &&
     // Marked by SelectInput mouseDown event
-    !event._ignore_global_close && elements().filter(element => element).every(element => !element.contains(target) && element !== target)) {
+    !isInside(elements(), target)) {
       // Should trigger close
       triggerOpen(false);
     }

package/lib/BaseSelect/index.js

@@ -10,7 +10,7 @@ var React = _interopRequireWildcard(require("react"));
 var _useAllowClear = require("../hooks/useAllowClear");
 var _useBaseProps = require("../hooks/useBaseProps");
 var _useLock = _interopRequireDefault(require("../hooks/useLock"));
-var _useSelectTriggerControl = _interopRequireDefault(require("../hooks/useSelectTriggerControl"));
+var _useSelectTriggerControl = _interopRequireWildcard(require("../hooks/useSelectTriggerControl"));
 var _SelectTrigger = _interopRequireDefault(require("../SelectTrigger"));
 var _valueUtil = require("../utils/valueUtil");
 var _Polite = _interopRequireDefault(require("./Polite"));
@@ -297,6 +297,12 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     keyLockRef.current = false;
   };
 
+  // ========================== Focus / Blur ==========================
+  const getSelectElements = () => [(0, _findDOMNode.getDOM)(containerRef.current), triggerRef.current?.getPopupElement()];
+
+  // Close when click on non-select element
+  (0, _useSelectTriggerControl.default)(getSelectElements, mergedOpen, triggerOpen, !!mergedComponents.root);
+
   // ========================== Focus / Blur ==========================
   /** Record real focus status */
   // const focusRef = React.useRef<boolean>(false);
@@ -311,6 +317,14 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
       onFocus?.(event);
     }
   };
+  const onRootBlur = () => {
+    // Delay close should check the activeElement
+    if (mergedOpen) {
+      triggerOpen(false, {
+        cancelFun: () => (0, _useSelectTriggerControl.isInside)(getSelectElements(), document.activeElement)
+      });
+    }
+  };
   const onInternalBlur = event => {
     setFocused(false);
     if (mergedSearchValue) {
@@ -326,11 +340,12 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
         });
       }
     }
+    onRootBlur();
     if (!disabled) {
       onBlur?.(event);
     }
   };
-  const onInternalMouseDown = (event, ...restArgs) => {
+  const onRootMouseDown = (event, ...restArgs) => {
     const {
       target
     } = event;
@@ -339,9 +354,7 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     // We should give focus back to selector if clicked item is not focusable
     if (popupElement?.contains(target) && triggerOpen) {
       // Tell `open` not to close since it's safe in the popup
-      triggerOpen(true, {
-        ignoreNext: true
-      });
+      triggerOpen(true);
     }
     onMouseDown?.(event, ...restArgs);
   };
@@ -361,9 +374,6 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     };
   }
 
-  // Close when click on non-select element
-  (0, _useSelectTriggerControl.default)(() => [(0, _findDOMNode.getDOM)(containerRef.current), triggerRef.current?.getPopupElement()], mergedOpen, triggerOpen, !!mergedComponents.root);
-
   // ============================ Context =============================
   const baseSelectContext = React.useMemo(() => ({
     ...props,
@@ -472,7 +482,7 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     tokenWithEnter: tokenWithEnter
     // Open
     ,
-    onMouseDown: onInternalMouseDown
+    onMouseDown: onRootMouseDown
     // Components
     ,
     components: mergedComponents
@@ -497,7 +507,8 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     empty: emptyOptions,
     onPopupVisibleChange: onTriggerVisibleChange,
     onPopupMouseEnter: onPopupMouseEnter,
-    onPopupMouseDown: onInternalMouseDown
+    onPopupMouseDown: onRootMouseDown,
+    onPopupBlur: onRootBlur
   }, renderNode);
   return /*#__PURE__*/React.createElement(_useBaseProps.BaseSelectContext.Provider, {
     value: baseSelectContext

package/lib/SelectInput/index.js

@@ -15,7 +15,6 @@ var _keyUtil = require("../utils/keyUtil");
 var _clsx = require("clsx");
 var _findDOMNode = require("@rc-component/util/lib/Dom/findDOMNode");
 var _ref = require("@rc-component/util/lib/ref");
-var _useOpen = require("../hooks/useOpen");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -47,7 +46,6 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function SelectIn
     autoFocus,
     // Events
     onMouseDown,
-    onBlur,
     onClearMouseDown,
     onInputKeyDown,
     onSelectorRemove,
@@ -116,12 +114,13 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function SelectIn
   // ====================== Open ======================
   const onInternalMouseDown = (0, _util.useEvent)(event => {
     if (!disabled) {
+      const inputDOM = (0, _findDOMNode.getDOM)(inputRef.current);
+
       // https://github.com/ant-design/ant-design/issues/56002
       // Tell `useSelectTriggerControl` to ignore this event
       // When icon is dynamic render, the parentNode will miss
       // so we need to mark the event directly
-      event.nativeEvent._ignore_global_close = true;
-      const inputDOM = (0, _findDOMNode.getDOM)(inputRef.current);
+      event.nativeEvent._ori_target = inputDOM;
       if (inputDOM && event.target !== inputDOM && !inputDOM.contains(event.target)) {
         event.preventDefault();
       }
@@ -143,15 +142,6 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function SelectIn
     }
     onMouseDown?.(event);
   });
-  const onInternalBlur = event => {
-    (0, _useOpen.macroTask)(() => {
-      const inputNode = (0, _findDOMNode.getDOM)(inputRef.current);
-      if (!inputNode || inputNode !== document.activeElement && !inputNode.contains(document.activeElement)) {
-        toggleOpen(false);
-      }
-    });
-    onBlur?.(event);
-  };
 
   // =================== Components ===================
   const {
@@ -186,8 +176,7 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function SelectIn
     style: style
     // Mouse Events
     ,
-    onMouseDown: onInternalMouseDown,
-    onBlur: onInternalBlur
+    onMouseDown: onInternalMouseDown
   }), /*#__PURE__*/React.createElement(_Affix.default, {
     className: (0, _clsx.clsx)(`${prefixCls}-prefix`, classNames?.prefix),
     style: styles?.prefix

package/lib/SelectTrigger.d.ts

@@ -25,6 +25,7 @@ export interface SelectTriggerProps {
     onPopupVisibleChange?: (visible: boolean) => void;
     onPopupMouseEnter: () => void;
     onPopupMouseDown: React.MouseEventHandler<HTMLDivElement>;
+    onPopupBlur?: React.FocusEventHandler<HTMLDivElement>;
 }
 declare const RefSelectTrigger: React.ForwardRefExoticComponent<SelectTriggerProps & React.RefAttributes<RefTriggerProps>>;
 export default RefSelectTrigger;

package/lib/SelectTrigger.js

@@ -75,6 +75,7 @@ const SelectTrigger = (props, ref) => {
     onPopupVisibleChange,
     onPopupMouseEnter,
     onPopupMouseDown,
+    onPopupBlur,
     ...restProps
   } = props;
 
@@ -126,7 +127,8 @@ const SelectTrigger = (props, ref) => {
     },
     popup: /*#__PURE__*/React.createElement("div", {
       onMouseEnter: onPopupMouseEnter,
-      onMouseDown: onPopupMouseDown
+      onMouseDown: onPopupMouseDown,
+      onBlur: onPopupBlur
     }, popupNode),
     ref: triggerPopupRef,
     stretch: stretch,

package/lib/hooks/useOpen.d.ts

@@ -1,11 +1,10 @@
 export declare const macroTask: (fn: VoidFunction, times?: number) => void;
 /**
  * Trigger by latest open call, if nextOpen is undefined, means toggle.
- * ignoreNext will skip next call in the macro task queue.
+ * `weak` means this call can be ignored if previous call exists.
  */
 export type TriggerOpenType = (nextOpen?: boolean, config?: {
-    ignoreNext?: boolean;
-    lazy?: boolean;
+    cancelFun?: () => boolean;
 }) => void;
 /**
  * When `open` is controlled, follow the controlled value;

package/lib/hooks/useOpen.js

@@ -24,7 +24,7 @@ const macroTask = (fn, times = 1) => {
 
 /**
  * Trigger by latest open call, if nextOpen is undefined, means toggle.
- * ignoreNext will skip next call in the macro task queue.
+ * `weak` means this call can be ignored if previous call exists.
  */
 exports.macroTask = macroTask;
 /**
@@ -48,7 +48,6 @@ function useOpen(propOpen, onOpen, postOpen) {
   const ssrSafeOpen = rendered ? stateOpen : false;
   const mergedOpen = postOpen(ssrSafeOpen);
   const taskIdRef = (0, _react.useRef)(0);
-  const taskLockRef = (0, _react.useRef)(false);
   const triggerEvent = (0, _util.useEvent)(nextOpen => {
     if (onOpen && mergedOpen !== nextOpen) {
       onOpen(nextOpen);
@@ -57,32 +56,29 @@ function useOpen(propOpen, onOpen, postOpen) {
   });
   const toggleOpen = (0, _util.useEvent)((nextOpen, config = {}) => {
     const {
-      ignoreNext = false
+      cancelFun
     } = config;
     taskIdRef.current += 1;
     const id = taskIdRef.current;
     const nextOpenVal = typeof nextOpen === 'boolean' ? nextOpen : !mergedOpen;
-
-    // Since `mergedOpen` is post-processed, we need to check if the value really changed
-    if (nextOpenVal) {
-      if (!taskLockRef.current) {
+    function triggerUpdate() {
+      if (
+      // Always check if id is match
+      id === taskIdRef.current &&
+      // Check if need to cancel
+      !cancelFun?.()) {
         triggerEvent(nextOpenVal);
-
-        // Lock if needed
-        if (ignoreNext) {
-          taskLockRef.current = ignoreNext;
-          macroTask(() => {
-            taskLockRef.current = false;
-          }, 2);
-        }
       }
-      return;
     }
-    macroTask(() => {
-      if (id === taskIdRef.current && !taskLockRef.current) {
-        triggerEvent(nextOpenVal);
-      }
-    });
+
+    // Weak update can be ignored
+    if (nextOpenVal) {
+      triggerUpdate();
+    } else {
+      macroTask(() => {
+        triggerUpdate();
+      });
+    }
   });
   return [mergedOpen, toggleOpen];
 }

package/lib/hooks/useSelectTriggerControl.d.ts

@@ -1 +1,3 @@
-export default function useSelectTriggerControl(elements: () => (HTMLElement | SVGElement | undefined)[], open: boolean, triggerOpen: (open: boolean) => void, customizedTrigger: boolean): void;
+import type { TriggerOpenType } from './useOpen';
+export declare function isInside(elements: (HTMLElement | SVGElement | undefined)[], target: HTMLElement): boolean;
+export default function useSelectTriggerControl(elements: () => (HTMLElement | SVGElement | undefined)[], open: boolean, triggerOpen: TriggerOpenType, customizedTrigger: boolean): void;

package/lib/hooks/useSelectTriggerControl.js

@@ -4,10 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useSelectTriggerControl;
+exports.isInside = isInside;
 var React = _interopRequireWildcard(require("react"));
 var _util = require("@rc-component/util");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function isInside(elements, target) {
+  return elements.filter(element => element).some(element => element.contains(target) || element === target);
+}
 function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger) {
   const onGlobalMouseDown = (0, _util.useEvent)(event => {
     // If trigger is customized, Trigger will take control of popupVisible
@@ -18,9 +22,12 @@ function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger)
     if (target.shadowRoot && event.composed) {
       target = event.composedPath()[0] || target;
     }
+    if (event._ori_target) {
+      target = event._ori_target;
+    }
     if (open &&
     // Marked by SelectInput mouseDown event
-    !event._ignore_global_close && elements().filter(element => element).every(element => !element.contains(target) && element !== target)) {
+    !isInside(elements(), target)) {
       // Should trigger close
       triggerOpen(false);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rc-component/select",
-  "version": "1.2.4",
+  "version": "1.2.6",
   "description": "React Select",
   "engines": {
     "node": ">=8.x"