@rc-component/select 1.5.0 → 1.5.2

package/es/BaseSelect/index.js

@@ -135,7 +135,7 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
   // ============================== Open ==============================
   // Not trigger `open` when `notFoundContent` is empty
   const emptyListContent = !notFoundContent && emptyOptions;
-  const [mergedOpen, triggerOpen] = useOpen(defaultOpen || false, open, onPopupVisibleChange, nextOpen => disabled || emptyListContent ? false : nextOpen);
+  const [mergedOpen, triggerOpen, lockOptions] = useOpen(defaultOpen || false, open, onPopupVisibleChange, nextOpen => disabled || emptyListContent ? false : nextOpen);
 
   // ============================= Search =============================
   const tokenWithEnter = React.useMemo(() => (tokenSeparators || []).some(tokenSeparator => ['\n', '\r\n'].includes(tokenSeparator)), [tokenSeparators]);
@@ -379,8 +379,9 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     toggleOpen: triggerOpen,
     showScrollBar,
     styles,
-    classNames
-  }), [props, notFoundContent, triggerOpen, id, showSearch, multiple, mergedOpen, showScrollBar, styles, classNames]);
+    classNames,
+    lockOptions
+  }), [props, notFoundContent, triggerOpen, id, showSearch, multiple, mergedOpen, showScrollBar, styles, classNames, lockOptions]);
 
   // ==================================================================
   // ==                            Render                            ==

package/es/OptionList.js

@@ -34,7 +34,8 @@ const OptionList = (_, ref) => {
     toggleOpen,
     notFoundContent,
     onPopupScroll,
-    showScrollBar
+    showScrollBar,
+    lockOptions
   } = useBaseProps();
   const {
     maxCount,
@@ -54,7 +55,7 @@ const OptionList = (_, ref) => {
     styles: contextStyles
   } = React.useContext(SelectContext);
   const itemPrefixCls = `${prefixCls}-item`;
-  const memoFlattenOptions = useMemo(() => flattenOptions, [open, flattenOptions], (prev, next) => next[0] && prev[1] !== next[1]);
+  const memoFlattenOptions = useMemo(() => flattenOptions, [open, lockOptions], (prev, next) => next[0] && !next[1]);
 
   // =========================== List ===========================
   const listRef = React.useRef(null);

package/es/SelectInput/Content/MultipleContent.js

@@ -138,7 +138,7 @@ export default /*#__PURE__*/React.forwardRef(function MultipleContent({
     prefixCls: `${prefixCls}-content`,
     className: classNames?.content,
     style: styles?.content,
-    prefix: !displayValues.length && (!searchValue || !triggerOpen) ? /*#__PURE__*/React.createElement(Placeholder, null) : null,
+    prefix: !displayValues.length && !inputValue && /*#__PURE__*/React.createElement(Placeholder, null),
     data: displayValues,
     renderItem: renderItem,
     renderRest: renderRest,

package/es/SelectInput/Content/SingleContent.js

@@ -42,9 +42,9 @@ const SingleContent = /*#__PURE__*/React.forwardRef(({
   const optionProps = React.useMemo(() => {
     const restProps = {
       className: `${prefixCls}-content-value`,
-      style: {
-        visibility: mergedSearchValue ? 'hidden' : 'visible'
-      }
+      style: mergedSearchValue ? {
+        visibility: 'hidden'
+      } : {}
     };
     if (displayValue && selectContext?.flattenOptions) {
       const option = selectContext.flattenOptions.find(opt => opt.value === displayValue.value);

package/es/hooks/useBaseProps.d.ts

@@ -8,6 +8,7 @@ export interface BaseSelectContextProps extends BaseSelectProps {
     triggerOpen: boolean;
     multiple: boolean;
     toggleOpen: (open?: boolean) => void;
+    lockOptions: boolean;
 }
 export declare const BaseSelectContext: React.Context<BaseSelectContextProps>;
 export default function useBaseProps(): BaseSelectContextProps;

package/es/hooks/useOpen.d.ts

@@ -15,4 +15,4 @@ export type TriggerOpenType = (nextOpen?: boolean, config?: {
  * SSR handling: During SSR, `open` is always false to avoid Portal issues.
  * On client-side hydration, it syncs with the actual open state.
  */
-export default function useOpen(defaultOpen: boolean, propOpen: boolean, onOpen: (nextOpen: boolean) => void, postOpen: (nextOpen: boolean) => boolean): [boolean, TriggerOpenType];
+export default function useOpen(defaultOpen: boolean, propOpen: boolean, onOpen: (nextOpen: boolean) => void, postOpen: (nextOpen: boolean) => boolean): [open: boolean, toggleOpen: TriggerOpenType, lockOptions: boolean];

package/es/hooks/useOpen.js

@@ -37,6 +37,9 @@ export default function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
   }, []);
   const [stateOpen, internalSetOpen] = useControlledState(defaultOpen, propOpen);
 
+  // Lock for options update
+  const [lock, setLock] = useState(false);
+
   // During SSR, always return false for open state
   const ssrSafeOpen = rendered ? stateOpen : false;
   const mergedOpen = postOpen(ssrSafeOpen);
@@ -54,6 +57,7 @@ export default function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
     taskIdRef.current += 1;
     const id = taskIdRef.current;
     const nextOpenVal = typeof nextOpen === 'boolean' ? nextOpen : !mergedOpen;
+    setLock(!nextOpenVal);
     function triggerUpdate() {
       if (
       // Always check if id is match
@@ -61,6 +65,7 @@ export default function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
       // Check if need to cancel
       !cancelFun?.()) {
         triggerEvent(nextOpenVal);
+        setLock(false);
       }
     }
 
@@ -73,5 +78,5 @@ export default function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
       });
     }
   });
-  return [mergedOpen, toggleOpen];
+  return [mergedOpen, toggleOpen, lock];
 }

package/lib/BaseSelect/index.js

@@ -144,7 +144,7 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
   // ============================== Open ==============================
   // Not trigger `open` when `notFoundContent` is empty
   const emptyListContent = !notFoundContent && emptyOptions;
-  const [mergedOpen, triggerOpen] = (0, _useOpen.default)(defaultOpen || false, open, onPopupVisibleChange, nextOpen => disabled || emptyListContent ? false : nextOpen);
+  const [mergedOpen, triggerOpen, lockOptions] = (0, _useOpen.default)(defaultOpen || false, open, onPopupVisibleChange, nextOpen => disabled || emptyListContent ? false : nextOpen);
 
   // ============================= Search =============================
   const tokenWithEnter = React.useMemo(() => (tokenSeparators || []).some(tokenSeparator => ['\n', '\r\n'].includes(tokenSeparator)), [tokenSeparators]);
@@ -388,8 +388,9 @@ const BaseSelect = /*#__PURE__*/React.forwardRef((props, ref) => {
     toggleOpen: triggerOpen,
     showScrollBar,
     styles,
-    classNames
-  }), [props, notFoundContent, triggerOpen, id, showSearch, multiple, mergedOpen, showScrollBar, styles, classNames]);
+    classNames,
+    lockOptions
+  }), [props, notFoundContent, triggerOpen, id, showSearch, multiple, mergedOpen, showScrollBar, styles, classNames, lockOptions]);
 
   // ==================================================================
   // ==                            Render                            ==

package/lib/OptionList.js

@@ -42,7 +42,8 @@ const OptionList = (_, ref) => {
     toggleOpen,
     notFoundContent,
     onPopupScroll,
-    showScrollBar
+    showScrollBar,
+    lockOptions
   } = (0, _useBaseProps.default)();
   const {
     maxCount,
@@ -62,7 +63,7 @@ const OptionList = (_, ref) => {
     styles: contextStyles
   } = React.useContext(_SelectContext.default);
   const itemPrefixCls = `${prefixCls}-item`;
-  const memoFlattenOptions = (0, _useMemo.default)(() => flattenOptions, [open, flattenOptions], (prev, next) => next[0] && prev[1] !== next[1]);
+  const memoFlattenOptions = (0, _useMemo.default)(() => flattenOptions, [open, lockOptions], (prev, next) => next[0] && !next[1]);
 
   // =========================== List ===========================
   const listRef = React.useRef(null);

package/lib/SelectInput/Content/MultipleContent.js

@@ -147,7 +147,7 @@ var _default = exports.default = /*#__PURE__*/React.forwardRef(function Multiple
     prefixCls: `${prefixCls}-content`,
     className: classNames?.content,
     style: styles?.content,
-    prefix: !displayValues.length && (!searchValue || !triggerOpen) ? /*#__PURE__*/React.createElement(_Placeholder.default, null) : null,
+    prefix: !displayValues.length && !inputValue && /*#__PURE__*/React.createElement(_Placeholder.default, null),
     data: displayValues,
     renderItem: renderItem,
     renderRest: renderRest,

package/lib/SelectInput/Content/SingleContent.js

@@ -51,9 +51,9 @@ const SingleContent = /*#__PURE__*/React.forwardRef(({
   const optionProps = React.useMemo(() => {
     const restProps = {
       className: `${prefixCls}-content-value`,
-      style: {
-        visibility: mergedSearchValue ? 'hidden' : 'visible'
-      }
+      style: mergedSearchValue ? {
+        visibility: 'hidden'
+      } : {}
     };
     if (displayValue && selectContext?.flattenOptions) {
       const option = selectContext.flattenOptions.find(opt => opt.value === displayValue.value);

package/lib/hooks/useBaseProps.d.ts

@@ -8,6 +8,7 @@ export interface BaseSelectContextProps extends BaseSelectProps {
     triggerOpen: boolean;
     multiple: boolean;
     toggleOpen: (open?: boolean) => void;
+    lockOptions: boolean;
 }
 export declare const BaseSelectContext: React.Context<BaseSelectContextProps>;
 export default function useBaseProps(): BaseSelectContextProps;

package/lib/hooks/useOpen.d.ts

@@ -15,4 +15,4 @@ export type TriggerOpenType = (nextOpen?: boolean, config?: {
  * SSR handling: During SSR, `open` is always false to avoid Portal issues.
  * On client-side hydration, it syncs with the actual open state.
  */
-export default function useOpen(defaultOpen: boolean, propOpen: boolean, onOpen: (nextOpen: boolean) => void, postOpen: (nextOpen: boolean) => boolean): [boolean, TriggerOpenType];
+export default function useOpen(defaultOpen: boolean, propOpen: boolean, onOpen: (nextOpen: boolean) => void, postOpen: (nextOpen: boolean) => boolean): [open: boolean, toggleOpen: TriggerOpenType, lockOptions: boolean];

package/lib/hooks/useOpen.js

@@ -44,6 +44,9 @@ function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
   }, []);
   const [stateOpen, internalSetOpen] = (0, _util.useControlledState)(defaultOpen, propOpen);
 
+  // Lock for options update
+  const [lock, setLock] = (0, _react.useState)(false);
+
   // During SSR, always return false for open state
   const ssrSafeOpen = rendered ? stateOpen : false;
   const mergedOpen = postOpen(ssrSafeOpen);
@@ -61,6 +64,7 @@ function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
     taskIdRef.current += 1;
     const id = taskIdRef.current;
     const nextOpenVal = typeof nextOpen === 'boolean' ? nextOpen : !mergedOpen;
+    setLock(!nextOpenVal);
     function triggerUpdate() {
       if (
       // Always check if id is match
@@ -68,6 +72,7 @@ function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
       // Check if need to cancel
       !cancelFun?.()) {
         triggerEvent(nextOpenVal);
+        setLock(false);
       }
     }
 
@@ -80,5 +85,5 @@ function useOpen(defaultOpen, propOpen, onOpen, postOpen) {
       });
     }
   });
-  return [mergedOpen, toggleOpen];
+  return [mergedOpen, toggleOpen, lock];
 }

package/package.json

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