fix: Adjust Select style (#20387)

* fix: Select style sync with v3

* update demo

* update test case

components/list/__tests__/__snapshots__/pagination.test.js.snap

@@ -333,7 +333,7 @@ exports[`List.pagination should change page size work 2`] = `
     class="ant-pagination-options"
   >
     <div
-      class="ant-select ant-pagination-options-size-changer ant-select-single ant-select-show-arrow"
+      class="ant-select ant-pagination-options-size-changer ant-select-single ant-select-show-arrow ant-select-open"
     >
       <div
         class="ant-select-selector"
@@ -345,7 +345,7 @@ exports[`List.pagination should change page size work 2`] = `
             aria-activedescendant="rc_select_TEST_OR_SSR_list_0"
             aria-autocomplete="list"
             aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
+            aria-expanded="true"
             aria-haspopup="listbox"
             aria-owns="rc_select_TEST_OR_SSR_list"
             autocomplete="off"
@@ -365,7 +365,7 @@ exports[`List.pagination should change page size work 2`] = `
       <div>
         <div
           class="ant-select-dropdown"
-          style="width: 0px;"
+          style="width: 0px; opacity: 0;"
         >
           <div>
             <div
@@ -503,6 +503,9 @@ exports[`List.pagination should change page size work 2`] = `
       <div
         style="position: absolute; top: 0px; left: 0px; width: 100%;"
       />
+      <div
+        style="position: absolute; top: 0px; left: 0px; width: 100%;"
+      />
     </div>
   </li>
 </ul>

components/list/__tests__/pagination.test.js

@@ -168,6 +168,7 @@ describe('List.pagination', () => {
       .at(2)
       .simulate('click');
 
+    wrapper.find('.ant-select-selector').simulate('mousedown');
     expect(
       wrapper
         .find('Pagination')

components/select/demo/option-label-prop.md

@@ -32,30 +32,44 @@ ReactDOM.render(
     optionLabelProp="label"
   >
     <Option value="china" label="China">
+      <div className="demo-option-label-item">
         <span role="img" aria-label="China">
           🇨🇳
         </span>
         China (中国)
+      </div>
     </Option>
     <Option value="usa" label="USA">
+      <div className="demo-option-label-item">
         <span role="img" aria-label="USA">
           🇺🇸
         </span>
         USA (美国)
+      </div>
     </Option>
     <Option value="japan" label="Japan">
+      <div className="demo-option-label-item">
         <span role="img" aria-label="Japan">
           🇯🇵
         </span>
         Japan (日本)
+      </div>
     </Option>
     <Option value="korea" label="Korea">
+      <div className="demo-option-label-item">
         <span role="img" aria-label="Korea">
           🇰🇷
         </span>
         Korea (韩国)
+      </div>
     </Option>
   </Select>,
   mountNode,
 );
 ```
+
+```css
+.demo-option-label-item > span {
+  margin-right: 6px;
+}
+```

components/select/style/index.less

@@ -229,6 +229,10 @@
         color: @text-color;
         font-weight: @select-item-selected-font-weight;
         background-color: @select-item-selected-bg;
+
+        .@{select-prefix-cls}-item-option-state {
+          color: @primary-color;
+        }
       }
 
       &-disabled {

components/select/style/multiple.less

@@ -19,6 +19,10 @@
     align-items: center;
     // Multiple is little different that horizontal is follow the vertical
     padding: 0 @select-multiple-padding @select-multiple-padding;
+
+    .@{select-prefix-cls}-show-search& {
+      cursor: text;
+    }
   }
 
   // ======================== Selections ========================

package.json

@@ -123,7 +123,7 @@
     "rc-progress": "~2.5.0",
     "rc-rate": "~2.5.0",
     "rc-resize-observer": "^0.1.0",
-    "rc-select": "~10.0.0-alpha.31",
+    "rc-select": "~10.0.0-alpha.34",
     "rc-slider": "~8.7.1",
     "rc-steps": "~3.5.0",
     "rc-switch": "~1.9.0",