From add12a01979a62444fe69ec05138941d286305dd Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=B9=A4=E4=BB=99?= <guoyunhe.gyh@alibaba-inc.com>
Date: Tue, 15 Oct 2024 13:57:48 +0800
Subject: [PATCH] fix: add root element for SingleSelector to make layout
 easier

---
 assets/index.less                          |   5 +
 src/Selector/MultipleSelector.tsx          |   4 +-
 src/Selector/SingleSelector.tsx            |   4 +-
 tests/__snapshots__/Combobox.test.tsx.snap |  72 ++-
 tests/__snapshots__/Multiple.test.tsx.snap | 532 ++++++++---------
 tests/__snapshots__/Select.test.tsx.snap   | 276 +++++----
 tests/__snapshots__/Tags.test.tsx.snap     | 644 +++++++++++----------
 tests/__snapshots__/ssr.test.tsx.snap      |   2 +-
 8 files changed, 806 insertions(+), 733 deletions(-)

diff --git a/assets/index.less b/assets/index.less
index f2eb17b8..e8ba28ba 100644
--- a/assets/index.less
+++ b/assets/index.less
@@ -70,6 +70,11 @@
       display: flex;
       position: relative;
 
+      .@{select-prefix}-selection-wrap {
+        width: 100%;
+        position: relative;
+      }
+
       .@{select-prefix}-selection-search {
         width: 100%;
         position: relative;
diff --git a/src/Selector/MultipleSelector.tsx b/src/Selector/MultipleSelector.tsx
index 5fbe1503..5c7fac70 100644
--- a/src/Selector/MultipleSelector.tsx
+++ b/src/Selector/MultipleSelector.tsx
@@ -242,12 +242,12 @@ const SelectSelector: React.FC<SelectorProps> = (props) => {
   );
 
   return (
-    <>
+    <span className={`${selectionPrefixCls}-wrap`}>
       {selectionNode}
       {!values.length && !inputValue && (
         <span className={`${selectionPrefixCls}-placeholder`}>{placeholder}</span>
       )}
-    </>
+    </span>
   );
 };
 
diff --git a/src/Selector/SingleSelector.tsx b/src/Selector/SingleSelector.tsx
index 4fe56b86..7f71adf8 100644
--- a/src/Selector/SingleSelector.tsx
+++ b/src/Selector/SingleSelector.tsx
@@ -77,7 +77,7 @@ const SingleSelector: React.FC<SelectorProps> = (props) => {
   }, [item, hasTextInput, placeholder, prefixCls]);
 
   return (
-    <>
+    <span className={`${prefixCls}-selection-wrap`}>
       <span className={`${prefixCls}-selection-search`}>
         <Input
           ref={inputRef}
@@ -121,7 +121,7 @@ const SingleSelector: React.FC<SelectorProps> = (props) => {
           {item.label}
         </span>
       ) : null}
-    </>
+    </span>
   );
 };
 
diff --git a/tests/__snapshots__/Combobox.test.tsx.snap b/tests/__snapshots__/Combobox.test.tsx.snap
index 806f9ea7..7d8f82d1 100644
--- a/tests/__snapshots__/Combobox.test.tsx.snap
+++ b/tests/__snapshots__/Combobox.test.tsx.snap
@@ -8,25 +8,29 @@ exports[`Select.Combobox renders controlled correctly 1`] = `
     class="rc-select-selector"
   >
     <span
-      class="rc-select-selection-search"
+      class="rc-select-selection-wrap"
     >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="rc-select-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        role="combobox"
-        type="search"
-        value=""
-      />
       <span
-        class="rc-select-selection-placeholder"
+        class="rc-select-selection-search"
       >
-        Search
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="rc-select-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          role="combobox"
+          type="search"
+          value=""
+        />
+        <span
+          class="rc-select-selection-placeholder"
+        >
+          Search
+        </span>
       </span>
     </span>
   </div>
@@ -41,25 +45,29 @@ exports[`Select.Combobox renders correctly 1`] = `
     class="rc-select-selector"
   >
     <span
-      class="rc-select-selection-search"
+      class="rc-select-selection-wrap"
     >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="rc-select-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        role="combobox"
-        type="search"
-        value=""
-      />
       <span
-        class="rc-select-selection-placeholder"
+        class="rc-select-selection-search"
       >
-        Search
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="rc-select-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          role="combobox"
+          type="search"
+          value=""
+        />
+        <span
+          class="rc-select-selection-placeholder"
+        >
+          Search
+        </span>
       </span>
     </span>
   </div>
diff --git a/tests/__snapshots__/Multiple.test.tsx.snap b/tests/__snapshots__/Multiple.test.tsx.snap
index 8e83d55b..a84f838f 100644
--- a/tests/__snapshots__/Multiple.test.tsx.snap
+++ b/tests/__snapshots__/Multiple.test.tsx.snap
@@ -7,45 +7,49 @@ exports[`Select.Multiple max tag render not display maxTagPlaceholder if maxTagC
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            readonly=""
-            role="combobox"
-            style="opacity: 0;"
-            type="search"
-            unselectable="on"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              readonly=""
+              role="combobox"
+              style="opacity: 0;"
+              type="search"
+              unselectable="on"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
-    <span
-      class="rc-select-selection-placeholder"
-    />
+      <span
+        class="rc-select-selection-placeholder"
+      />
+    </span>
   </div>
 </div>
 `;
@@ -57,112 +61,116 @@ exports[`Select.Multiple max tag render truncates tags by maxTagCount and show m
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
-        <span
-          class="rc-select-selection-item"
-          title="One"
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            One
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="One"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              One
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
-          title="Two"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            Two
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="Two"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
+            >
+              Two
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
             >
-              ×
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
+            class="rc-select-selection-item"
           >
-            <span>
-              Omitted
+            <span
+              class="rc-select-selection-item-content"
+            >
+              <span>
+                Omitted
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
-      >
+        </div>
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            readonly=""
-            role="combobox"
-            style="opacity: 0;"
-            type="search"
-            unselectable="on"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              readonly=""
+              role="combobox"
+              style="opacity: 0;"
+              type="search"
+              unselectable="on"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
+    </span>
   </div>
 </div>
 `;
@@ -174,113 +182,117 @@ exports[`Select.Multiple max tag render truncates tags by maxTagCount and show m
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
-        <span
-          class="rc-select-selection-item"
-          title="One"
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            One
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="One"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              One
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
-          title="Two"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            Two
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="Two"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              Two
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
+            class="rc-select-selection-item"
           >
-            <span>
-              1
-               values omitted
+            <span
+              class="rc-select-selection-item-content"
+            >
+              <span>
+                1
+                 values omitted
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
-      >
+        </div>
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            readonly=""
-            role="combobox"
-            style="opacity: 0;"
-            type="search"
-            unselectable="on"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              readonly=""
+              role="combobox"
+              style="opacity: 0;"
+              type="search"
+              unselectable="on"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
+    </span>
   </div>
 </div>
 `;
@@ -292,96 +304,100 @@ exports[`Select.Multiple max tag render truncates values by maxTagTextLength 1`]
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
-        <span
-          class="rc-select-selection-item"
-          title="One"
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            On...
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="One"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              On...
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
-          title="Two"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            Tw...
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="Two"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
+            >
+              Tw...
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
             >
-              ×
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
-      >
+        </div>
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            readonly=""
-            role="combobox"
-            style="opacity: 0;"
-            type="search"
-            unselectable="on"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              readonly=""
+              role="combobox"
+              style="opacity: 0;"
+              type="search"
+              unselectable="on"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
+    </span>
   </div>
 </div>
 `;
diff --git a/tests/__snapshots__/Select.test.tsx.snap b/tests/__snapshots__/Select.test.tsx.snap
index 7054f61c..be851696 100644
--- a/tests/__snapshots__/Select.test.tsx.snap
+++ b/tests/__snapshots__/Select.test.tsx.snap
@@ -116,30 +116,34 @@ exports[`Select.Basic no search 1`] = `
     class="rc-select-selector"
   >
     <span
-      class="rc-select-selection-search"
+      class="rc-select-selection-wrap"
     >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="rc-select-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        readonly=""
-        role="combobox"
-        style="opacity: 0;"
-        type="search"
-        unselectable="on"
-        value=""
-      />
-    </span>
-    <span
-      class="rc-select-selection-item"
-      title="1"
-    >
-      1
+      <span
+        class="rc-select-selection-search"
+      >
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="rc-select-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          readonly=""
+          role="combobox"
+          style="opacity: 0;"
+          type="search"
+          unselectable="on"
+          value=""
+        />
+      </span>
+      <span
+        class="rc-select-selection-item"
+        title="1"
+      >
+        1
+      </span>
     </span>
   </div>
 </div>
@@ -155,29 +159,33 @@ exports[`Select.Basic render renders aria-attributes correctly 1`] = `
     class="antd-selector"
   >
     <span
-      class="antd-selection-search"
-    >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-label="some-label"
-        aria-labelledby="test-id"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="antd-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        role="combobox"
-        type="search"
-        value=""
-      />
-    </span>
-    <span
-      class="antd-selection-item"
-      title="2"
+      class="antd-selection-wrap"
     >
-      2
+      <span
+        class="antd-selection-search"
+      >
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-label="some-label"
+          aria-labelledby="test-id"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="antd-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          role="combobox"
+          type="search"
+          value=""
+        />
+      </span>
+      <span
+        class="antd-selection-item"
+        title="2"
+      >
+        2
+      </span>
     </span>
   </div>
   <span
@@ -203,27 +211,31 @@ exports[`Select.Basic render renders correctly 1`] = `
     class="antd-selector"
   >
     <span
-      class="antd-selection-search"
+      class="antd-selection-wrap"
     >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="antd-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        role="combobox"
-        type="search"
-        value=""
-      />
-    </span>
-    <span
-      class="antd-selection-item"
-      title="2"
-    >
-      2
+      <span
+        class="antd-selection-search"
+      >
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="antd-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          role="combobox"
+          type="search"
+          value=""
+        />
+      </span>
+      <span
+        class="antd-selection-item"
+        title="2"
+      >
+        2
+      </span>
     </span>
   </div>
   <span
@@ -251,27 +263,31 @@ exports[`Select.Basic render renders data-attributes correctly 1`] = `
     class="antd-selector"
   >
     <span
-      class="antd-selection-search"
+      class="antd-selection-wrap"
     >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="antd-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        role="combobox"
-        type="search"
-        value=""
-      />
-    </span>
-    <span
-      class="antd-selection-item"
-      title="2"
-    >
-      2
+      <span
+        class="antd-selection-search"
+      >
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="antd-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          role="combobox"
+          type="search"
+          value=""
+        />
+      </span>
+      <span
+        class="antd-selection-item"
+        title="2"
+      >
+        2
+      </span>
     </span>
   </div>
   <span
@@ -297,28 +313,32 @@ exports[`Select.Basic render renders disabled select correctly 1`] = `
     class="antd-selector"
   >
     <span
-      class="antd-selection-search"
-    >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="antd-selection-search-input"
-        disabled=""
-        id="rc_select_TEST_OR_SSR"
-        role="combobox"
-        type="search"
-        value=""
-      />
-    </span>
-    <span
-      class="antd-selection-item"
-      title="2"
+      class="antd-selection-wrap"
     >
-      2
+      <span
+        class="antd-selection-search"
+      >
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="antd-selection-search-input"
+          disabled=""
+          id="rc_select_TEST_OR_SSR"
+          role="combobox"
+          type="search"
+          value=""
+        />
+      </span>
+      <span
+        class="antd-selection-item"
+        title="2"
+      >
+        2
+      </span>
     </span>
   </div>
 </div>
@@ -335,27 +355,31 @@ exports[`Select.Basic render renders role prop correctly 1`] = `
     class="antd-selector"
   >
     <span
-      class="antd-selection-search"
+      class="antd-selection-wrap"
     >
-      <input
-        aria-autocomplete="list"
-        aria-controls="rc_select_TEST_OR_SSR_list"
-        aria-expanded="false"
-        aria-haspopup="listbox"
-        aria-owns="rc_select_TEST_OR_SSR_list"
-        autocomplete="off"
-        class="antd-selection-search-input"
-        id="rc_select_TEST_OR_SSR"
-        role="button"
-        type="search"
-        value=""
-      />
-    </span>
-    <span
-      class="antd-selection-item"
-      title="2"
-    >
-      2
+      <span
+        class="antd-selection-search"
+      >
+        <input
+          aria-autocomplete="list"
+          aria-controls="rc_select_TEST_OR_SSR_list"
+          aria-expanded="false"
+          aria-haspopup="listbox"
+          aria-owns="rc_select_TEST_OR_SSR_list"
+          autocomplete="off"
+          class="antd-selection-search-input"
+          id="rc_select_TEST_OR_SSR"
+          role="button"
+          type="search"
+          value=""
+        />
+      </span>
+      <span
+        class="antd-selection-item"
+        title="2"
+      >
+        2
+      </span>
     </span>
   </div>
   <span
diff --git a/tests/__snapshots__/Tags.test.tsx.snap b/tests/__snapshots__/Tags.test.tsx.snap
index 71f69217..89c74d8a 100644
--- a/tests/__snapshots__/Tags.test.tsx.snap
+++ b/tests/__snapshots__/Tags.test.tsx.snap
@@ -8,94 +8,98 @@ exports[`Select.Tags OptGroup renders correctly 1`] = `
     <div
       class="rc-select-selector"
     >
-      <div
-        class="rc-select-selection-overflow"
+      <span
+        class="rc-select-selection-wrap"
       >
         <div
-          class="rc-select-selection-overflow-item"
-          style="opacity: 1;"
+          class="rc-select-selection-overflow"
         >
-          <span
-            class="rc-select-selection-item"
-            title="Jack"
+          <div
+            class="rc-select-selection-overflow-item"
+            style="opacity: 1;"
           >
             <span
-              class="rc-select-selection-item-content"
-            >
-              Jack
-            </span>
-            <span
-              aria-hidden="true"
-              class="rc-select-selection-item-remove"
-              style="user-select: none;"
-              unselectable="on"
+              class="rc-select-selection-item"
+              title="Jack"
             >
               <span
-                class="rc-select-selection-item-remove-icon"
+                class="rc-select-selection-item-content"
               >
-                ×
+                Jack
+              </span>
+              <span
+                aria-hidden="true"
+                class="rc-select-selection-item-remove"
+                style="user-select: none;"
+                unselectable="on"
+              >
+                <span
+                  class="rc-select-selection-item-remove-icon"
+                >
+                  ×
+                </span>
               </span>
             </span>
-          </span>
-        </div>
-        <div
-          class="rc-select-selection-overflow-item"
-          style="opacity: 1;"
-        >
-          <span
-            class="rc-select-selection-item"
-            title="foo"
+          </div>
+          <div
+            class="rc-select-selection-overflow-item"
+            style="opacity: 1;"
           >
             <span
-              class="rc-select-selection-item-content"
-            >
-              foo
-            </span>
-            <span
-              aria-hidden="true"
-              class="rc-select-selection-item-remove"
-              style="user-select: none;"
-              unselectable="on"
+              class="rc-select-selection-item"
+              title="foo"
             >
               <span
-                class="rc-select-selection-item-remove-icon"
+                class="rc-select-selection-item-content"
               >
-                ×
+                foo
+              </span>
+              <span
+                aria-hidden="true"
+                class="rc-select-selection-item-remove"
+                style="user-select: none;"
+                unselectable="on"
+              >
+                <span
+                  class="rc-select-selection-item-remove-icon"
+                >
+                  ×
+                </span>
               </span>
             </span>
-          </span>
-        </div>
-        <div
-          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-          style="opacity: 1;"
-        >
+          </div>
           <div
-            class="rc-select-selection-search"
-            style="width: 0px;"
+            class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+            style="opacity: 1;"
           >
-            <input
-              aria-activedescendant="rc_select_TEST_OR_SSR_list_1"
-              aria-autocomplete="list"
-              aria-controls="rc_select_TEST_OR_SSR_list"
-              aria-expanded="true"
-              aria-haspopup="listbox"
-              aria-owns="rc_select_TEST_OR_SSR_list"
-              autocomplete="off"
-              class="rc-select-selection-search-input"
-              id="rc_select_TEST_OR_SSR"
-              role="combobox"
-              type="search"
-              value=""
-            />
-            <span
-              aria-hidden="true"
-              class="rc-select-selection-search-mirror"
+            <div
+              class="rc-select-selection-search"
+              style="width: 0px;"
             >
-               
-            </span>
+              <input
+                aria-activedescendant="rc_select_TEST_OR_SSR_list_1"
+                aria-autocomplete="list"
+                aria-controls="rc_select_TEST_OR_SSR_list"
+                aria-expanded="true"
+                aria-haspopup="listbox"
+                aria-owns="rc_select_TEST_OR_SSR_list"
+                autocomplete="off"
+                class="rc-select-selection-search-input"
+                id="rc_select_TEST_OR_SSR"
+                role="combobox"
+                type="search"
+                value=""
+              />
+              <span
+                aria-hidden="true"
+                class="rc-select-selection-search-mirror"
+              >
+                 
+              </span>
+            </div>
           </div>
         </div>
-      </div>
+      </span>
     </div>
     <div
       class="rc-select-dropdown rc-select-dropdown-placement-bottomLeft"
@@ -235,42 +239,46 @@ exports[`Select.Tags max tag render not display maxTagPlaceholder if maxTagCount
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            role="combobox"
-            type="search"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              role="combobox"
+              type="search"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
-    <span
-      class="rc-select-selection-placeholder"
-    />
+      <span
+        class="rc-select-selection-placeholder"
+      />
+    </span>
   </div>
 </div>
 `;
@@ -282,109 +290,113 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
-        <span
-          class="rc-select-selection-item"
-          title="One"
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            One
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="One"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              One
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
-          title="Two"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            Two
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="Two"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              Two
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
+            class="rc-select-selection-item"
           >
-            <span>
-              Omitted
+            <span
+              class="rc-select-selection-item-content"
+            >
+              <span>
+                Omitted
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
-      >
+        </div>
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            role="combobox"
-            type="search"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              role="combobox"
+              type="search"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
+    </span>
   </div>
 </div>
 `;
@@ -396,110 +408,114 @@ exports[`Select.Tags max tag render truncates tags by maxTagCount and show maxTa
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
-        <span
-          class="rc-select-selection-item"
-          title="One"
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            One
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="One"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              One
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
-          title="Two"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            Two
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="Two"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              Two
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-rest"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
+            class="rc-select-selection-item"
           >
-            <span>
-              1
-               values omitted
+            <span
+              class="rc-select-selection-item-content"
+            >
+              <span>
+                1
+                 values omitted
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
-      >
+        </div>
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            role="combobox"
-            type="search"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              role="combobox"
+              type="search"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
+    </span>
   </div>
 </div>
 `;
@@ -511,93 +527,97 @@ exports[`Select.Tags max tag render truncates values by maxTagTextLength 1`] = `
   <div
     class="rc-select-selector"
   >
-    <div
-      class="rc-select-selection-overflow"
+    <span
+      class="rc-select-selection-wrap"
     >
       <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
+        class="rc-select-selection-overflow"
       >
-        <span
-          class="rc-select-selection-item"
-          title="One"
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            On...
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="One"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
+            >
+              On...
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
             >
-              ×
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item"
-        style="opacity: 1;"
-      >
-        <span
-          class="rc-select-selection-item"
-          title="Two"
+        </div>
+        <div
+          class="rc-select-selection-overflow-item"
+          style="opacity: 1;"
         >
           <span
-            class="rc-select-selection-item-content"
-          >
-            Tw...
-          </span>
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-item-remove"
-            style="user-select: none;"
-            unselectable="on"
+            class="rc-select-selection-item"
+            title="Two"
           >
             <span
-              class="rc-select-selection-item-remove-icon"
+              class="rc-select-selection-item-content"
             >
-              ×
+              Tw...
+            </span>
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-item-remove"
+              style="user-select: none;"
+              unselectable="on"
+            >
+              <span
+                class="rc-select-selection-item-remove-icon"
+              >
+                ×
+              </span>
             </span>
           </span>
-        </span>
-      </div>
-      <div
-        class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
-        style="opacity: 1;"
-      >
+        </div>
         <div
-          class="rc-select-selection-search"
-          style="width: 0px;"
+          class="rc-select-selection-overflow-item rc-select-selection-overflow-item-suffix"
+          style="opacity: 1;"
         >
-          <input
-            aria-autocomplete="list"
-            aria-controls="rc_select_TEST_OR_SSR_list"
-            aria-expanded="false"
-            aria-haspopup="listbox"
-            aria-owns="rc_select_TEST_OR_SSR_list"
-            autocomplete="off"
-            class="rc-select-selection-search-input"
-            id="rc_select_TEST_OR_SSR"
-            role="combobox"
-            type="search"
-            value=""
-          />
-          <span
-            aria-hidden="true"
-            class="rc-select-selection-search-mirror"
+          <div
+            class="rc-select-selection-search"
+            style="width: 0px;"
           >
-             
-          </span>
+            <input
+              aria-autocomplete="list"
+              aria-controls="rc_select_TEST_OR_SSR_list"
+              aria-expanded="false"
+              aria-haspopup="listbox"
+              aria-owns="rc_select_TEST_OR_SSR_list"
+              autocomplete="off"
+              class="rc-select-selection-search-input"
+              id="rc_select_TEST_OR_SSR"
+              role="combobox"
+              type="search"
+              value=""
+            />
+            <span
+              aria-hidden="true"
+              class="rc-select-selection-search-mirror"
+            >
+               
+            </span>
+          </div>
         </div>
       </div>
-    </div>
+    </span>
   </div>
 </div>
 `;
diff --git a/tests/__snapshots__/ssr.test.tsx.snap b/tests/__snapshots__/ssr.test.tsx.snap
index de916d8d..8594094b 100644
--- a/tests/__snapshots__/ssr.test.tsx.snap
+++ b/tests/__snapshots__/ssr.test.tsx.snap
@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Select.SSR should work 1`] = `"<div class="rc-select rc-select-single"><div class="rc-select-selector"><span class="rc-select-selection-search"><input type="search" autoComplete="off" class="rc-select-selection-search-input" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-owns="undefined_list" aria-autocomplete="list" aria-controls="undefined_list" readonly="" unselectable="on" style="opacity:0" value=""/><span class="rc-select-selection-placeholder"></span></span></div></div>"`;
+exports[`Select.SSR should work 1`] = `"<div class="rc-select rc-select-single"><div class="rc-select-selector"><span class="rc-select-selection-wrap"><span class="rc-select-selection-search"><input type="search" autoComplete="off" class="rc-select-selection-search-input" role="combobox" aria-expanded="false" aria-haspopup="listbox" aria-owns="undefined_list" aria-autocomplete="list" aria-controls="undefined_list" readonly="" unselectable="on" style="opacity:0" value=""/><span class="rc-select-selection-placeholder"></span></span></span></div></div>"`;