@rc-component/select 1.2.2 → 1.2.4

package/es/BaseSelect/index.js

@@ -318,9 +318,6 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
       }
     }
     if (!disabled) {
-      triggerOpen(false, {
-        lazy: true
-      });
       onBlur?.(event);
     }
   };

package/es/Select.d.ts

@@ -125,7 +125,7 @@ export interface SelectProps<ValueType = any, OptionType extends BaseOptionType
     classNames?: Partial<Record<SemanticName, string>>;
     styles?: Partial<Record<SemanticName, React.CSSProperties>>;
 }
-declare const TypedSelect: (<ValueType = any, OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType>(props: React.PropsWithChildren<SelectProps<ValueType, OptionType>> & React.RefAttributes<BaseSelectRef>) => React.ReactElement) & {
+declare const TypedSelect: (<ValueType = any, OptionType extends DefaultOptionType | BaseOptionType = DefaultOptionType>(props: React.PropsWithChildren<SelectProps<ValueType, OptionType>> & React.RefAttributes<BaseSelectRef>) => React.ReactElement) & {
     Option: typeof Option;
     OptGroup: typeof OptGroup;
 };

package/es/SelectInput/index.js

@@ -10,6 +10,7 @@ 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 {
@@ -106,6 +107,11 @@ export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
   // ====================== Open ======================
   const onInternalMouseDown = useEvent(event => {
     if (!disabled) {
+      // 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);
       if (inputDOM && event.target !== inputDOM && !inputDOM.contains(event.target)) {
         event.preventDefault();
@@ -129,7 +135,12 @@ export default /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
     onMouseDown?.(event);
   });
   const onInternalBlur = event => {
-    toggleOpen(false);
+    macroTask(() => {
+      const inputNode = getDOM(inputRef.current);
+      if (!inputNode || inputNode !== document.activeElement && !inputNode.contains(document.activeElement)) {
+        toggleOpen(false);
+      }
+    });
     onBlur?.(event);
   };
 

package/es/hooks/useOpen.d.ts

@@ -1,3 +1,4 @@
+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.

package/es/hooks/useOpen.js

@@ -5,7 +5,7 @@ const internalMacroTask = fn => {
   channel.port1.onmessage = fn;
   channel.port2.postMessage(null);
 };
-const macroTask = (fn, times = 1) => {
+export const macroTask = (fn, times = 1) => {
   if (times <= 0) {
     fn();
     return;
@@ -50,15 +50,14 @@ export default function useOpen(propOpen, onOpen, postOpen) {
   });
   const toggleOpen = useEvent((nextOpen, config = {}) => {
     const {
-      ignoreNext = false,
-      lazy = false
+      ignoreNext = false
     } = 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 || !lazy) {
+    if (nextOpenVal) {
       if (!taskLockRef.current) {
         triggerEvent(nextOpenVal);
 

package/es/hooks/useSelectTriggerControl.js

@@ -10,7 +10,9 @@ export default function useSelectTriggerControl(elements, open, triggerOpen, cus
     if (target.shadowRoot && event.composed) {
       target = event.composedPath()[0] || target;
     }
-    if (open && elements().filter(element => element).every(element => !element.contains(target) && element !== target)) {
+    if (open &&
+    // Marked by SelectInput mouseDown event
+    !event._ignore_global_close && elements().filter(element => element).every(element => !element.contains(target) && element !== target)) {
       // Should trigger close
       triggerOpen(false);
     }

package/lib/BaseSelect/index.js

@@ -327,9 +327,6 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
       }
     }
     if (!disabled) {
-      triggerOpen(false, {
-        lazy: true
-      });
       onBlur?.(event);
     }
   };

package/lib/Select.d.ts

@@ -125,7 +125,7 @@ export interface SelectProps<ValueType = any, OptionType extends BaseOptionType
     classNames?: Partial<Record<SemanticName, string>>;
     styles?: Partial<Record<SemanticName, React.CSSProperties>>;
 }
-declare const TypedSelect: (<ValueType = any, OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType>(props: React.PropsWithChildren<SelectProps<ValueType, OptionType>> & React.RefAttributes<BaseSelectRef>) => React.ReactElement) & {
+declare const TypedSelect: (<ValueType = any, OptionType extends DefaultOptionType | BaseOptionType = DefaultOptionType>(props: React.PropsWithChildren<SelectProps<ValueType, OptionType>> & React.RefAttributes<BaseSelectRef>) => React.ReactElement) & {
     Option: typeof Option;
     OptGroup: typeof OptGroup;
 };

package/lib/SelectInput/index.js

@@ -15,6 +15,7 @@ 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; }
@@ -115,6 +116,11 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function SelectIn
   // ====================== Open ======================
   const onInternalMouseDown = (0, _util.useEvent)(event => {
     if (!disabled) {
+      // 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);
       if (inputDOM && event.target !== inputDOM && !inputDOM.contains(event.target)) {
         event.preventDefault();
@@ -138,7 +144,12 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function SelectIn
     onMouseDown?.(event);
   });
   const onInternalBlur = event => {
-    toggleOpen(false);
+    (0, _useOpen.macroTask)(() => {
+      const inputNode = (0, _findDOMNode.getDOM)(inputRef.current);
+      if (!inputNode || inputNode !== document.activeElement && !inputNode.contains(document.activeElement)) {
+        toggleOpen(false);
+      }
+    });
     onBlur?.(event);
   };
 

package/lib/hooks/useOpen.d.ts

@@ -1,3 +1,4 @@
+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.

package/lib/hooks/useOpen.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useOpen;
+exports.macroTask = void 0;
 var _util = require("@rc-component/util");
 var _react = require("react");
 const internalMacroTask = fn => {
@@ -25,7 +26,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.
  */
-
+exports.macroTask = macroTask;
 /**
  * When `open` is controlled, follow the controlled value;
  * Otherwise use uncontrolled logic.
@@ -56,15 +57,14 @@ function useOpen(propOpen, onOpen, postOpen) {
   });
   const toggleOpen = (0, _util.useEvent)((nextOpen, config = {}) => {
     const {
-      ignoreNext = false,
-      lazy = false
+      ignoreNext = false
     } = 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 || !lazy) {
+    if (nextOpenVal) {
       if (!taskLockRef.current) {
         triggerEvent(nextOpenVal);
 

package/lib/hooks/useSelectTriggerControl.js

@@ -18,7 +18,9 @@ function useSelectTriggerControl(elements, open, triggerOpen, customizedTrigger)
     if (target.shadowRoot && event.composed) {
       target = event.composedPath()[0] || target;
     }
-    if (open && elements().filter(element => element).every(element => !element.contains(target) && element !== target)) {
+    if (open &&
+    // Marked by SelectInput mouseDown event
+    !event._ignore_global_close && elements().filter(element => element).every(element => !element.contains(target) && element !== target)) {
       // Should trigger close
       triggerOpen(false);
     }

package/package.json

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