feat: comobobox mode should not has selected item (#738)

close ant-design/ant-design#34975

Author: afc163

assets/index.less

@@ -238,7 +238,7 @@
 
       // ------- Active -------
       &-active {
-        background: green;
+        background: #ddd;
       }
 
       // ------ Disabled ------

src/OptionList.tsx

@@ -36,8 +36,17 @@ const OptionList: React.ForwardRefRenderFunction<RefOptionListProps, OptionListP
   _,
   ref,
 ) => {
-  const { prefixCls, id, open, multiple, searchValue, toggleOpen, notFoundContent, onPopupScroll } =
-    useBaseProps();
+  const {
+    prefixCls,
+    id,
+    open,
+    multiple,
+    mode,
+    searchValue,
+    toggleOpen,
+    notFoundContent,
+    onPopupScroll,
+  } = useBaseProps();
   const {
     flattenOptions,
     onActiveValue,
@@ -108,6 +117,12 @@ const OptionList: React.ForwardRefRenderFunction<RefOptionListProps, OptionListP
     setActive(defaultActiveFirstOption !== false ? getEnabledActiveIndex(0) : -1);
   }, [memoFlattenOptions.length, searchValue]);
 
+  // https://github.com/ant-design/ant-design/issues/34975
+  const isSelected = React.useCallback(
+    (value: RawValueType) => rawValues.has(value) && mode !== 'combobox',
+    [mode, [...rawValues].toString()],
+  );
+
   // Auto scroll to item position in single mode
   useEffect(() => {
     /**
@@ -246,7 +261,7 @@ const OptionList: React.ForwardRefRenderFunction<RefOptionListProps, OptionListP
         key={index}
         role={group ? 'presentation' : 'option'}
         id={`${id}_list_${index}`}
-        aria-selected={rawValues.has(value)}
+        aria-selected={isSelected(value)}
       >
         {value}
       </div>
@@ -293,7 +308,7 @@ const OptionList: React.ForwardRefRenderFunction<RefOptionListProps, OptionListP
           const passedProps = omit(otherProps, omitFieldNameList);
 
           // Option
-          const selected = rawValues.has(value);
+          const selected = isSelected(value);
 
           const optionPrefixCls = `${itemPrefixCls}-option`;
           const optionClassName = classNames(itemPrefixCls, optionPrefixCls, className, {

tests/Combobox.test.tsx

@@ -507,4 +507,18 @@ describe('Select.Combobox', () => {
 
     expect(wrapper.find('List').prop('data')).toHaveLength(2);
   });
+
+  // https://github.com/ant-design/ant-design/issues/34975
+  it('should not contain selected className in combobox mode', () => {
+    const onChange = jest.fn();
+    const wrapper = mount(
+      <Select mode="combobox" onChange={onChange}>
+        <Option value="One">One</Option>
+        <Option value="Two">Two</Option>
+      </Select>,
+    );
+    toggleOpen(wrapper);
+    selectItem(wrapper);
+    expect(wrapper.find('.rc-select-item-option-selected').length).toBe(0);
+  });
 });