From e66cd5e258e2c7ca8bec787ee3320238cc780b11 Mon Sep 17 00:00:00 2001
From: Uyarn <uyarnchen@gmail.com>
Date: Tue, 18 Jan 2022 17:08:46 +0800
Subject: [PATCH 1/2] fix(icon): ssr

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 7cf98c5d4..5ed593faa 100755
--- a/package.json
+++ b/package.json
@@ -75,7 +75,7 @@
     "dayjs": "^1.9.7",
     "lodash": "^4.17.21",
     "raf": "^3.4.1",
-    "tdesign-icons-vue": "~0.0.7",
+    "tdesign-icons-vue": "~0.0.8-alpha.4",
     "validator": "^13.5.1"
   },
   "peerDependencies": {

From 0de63bd2c11981e061256684a787a2194fe2d9ff Mon Sep 17 00:00:00 2001
From: Uyarn <uyarnchen@gmail.com>
Date: Tue, 18 Jan 2022 17:31:14 +0800
Subject: [PATCH 2/2] chore: update snapshot

---
 package.json                                  |   2 +-
 test/ssr/__snapshots__/ssr.test.js.snap       | 208 +++++++++---------
 .../__snapshots__/demo.test.js.snap           |  48 ++--
 .../__snapshots__/index.test.js.snap          |  56 ++---
 .../unit/menu/__snapshots__/demo.test.js.snap |  16 +-
 .../slider/__snapshots__/index.test.js.snap   |   4 +-
 .../__snapshots__/demo.test.js.snap           |  40 ++--
 .../__snapshots__/index.test.js.snap          |  46 ++--
 8 files changed, 202 insertions(+), 218 deletions(-)

diff --git a/package.json b/package.json
index 5ed593faa..bb2534d26 100755
--- a/package.json
+++ b/package.json
@@ -75,7 +75,7 @@
     "dayjs": "^1.9.7",
     "lodash": "^4.17.21",
     "raf": "^3.4.1",
-    "tdesign-icons-vue": "~0.0.8-alpha.4",
+    "tdesign-icons-vue": "~0.0.8",
     "validator": "^13.5.1"
   },
   "peerDependencies": {
diff --git a/test/ssr/__snapshots__/ssr.test.js.snap b/test/ssr/__snapshots__/ssr.test.js.snap
index bcab5bb79..3ff02cbed 100644
--- a/test/ssr/__snapshots__/ssr.test.js.snap
+++ b/test/ssr/__snapshots__/ssr.test.js.snap
@@ -2807,7 +2807,7 @@ exports[`ssr snapshot test renders ./examples/comment/demos/reply.vue correctly
       <div class="t-comment__inner">
         <div class="t-comment__avatar"><img src="https://tdesign.gtimg.com/site/avatar.jpg" alt="" class="t-comment__avatar-image"></div>
         <div class="t-comment__content">
-          <div class="t-comment__author"><span class="t-comment__name"><span>评论作者名B</span> <svg class="t-icon t-icon-caret-right-small t-size-s author-icon">
+          <div class="t-comment__author"><span class="t-comment__name"><span>评论作者名B</span> <svg class="author-icon t-icon t-icon-caret-right-small t-size-s">
               <use href="#t-icon-caret-right-small"></use>
             </svg> <span>评论作者名A</span></span><span class="t-comment__time">今天16:38</span></div>
           <div class="t-comment__detail">这里是评论者写的评论内容。</div>
@@ -3099,7 +3099,7 @@ exports[`ssr snapshot test renders ./examples/config-provider/demos/others.vue c
       <div class="t-select t-size-m"><span class="t-select__placeholder">see empty data in TreeSelect</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="see empty data in TreeSelect" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -3114,7 +3114,7 @@ exports[`ssr snapshot test renders ./examples/config-provider/demos/others.vue c
     <div class="t-popup__reference t-select__popup-reference">
       <div name="t-popup--animation" appear="true"></div>
       <div class="t-select t-size-m"><span class="t-select__placeholder">see loading text in TreeSelect</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span>
-        <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="see loading text in TreeSelect" type="text" value="" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="see loading text in TreeSelect" type="text" value="" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -3131,7 +3131,7 @@ exports[`ssr snapshot test renders ./examples/config-provider/demos/others.vue c
       <div class="t-select t-size-m"><span class="t-select__placeholder" style="display:none;">tree select</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span>
         <div class="t-input t-size-m t-select__input"><input placeholder="tree select" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -4310,7 +4310,7 @@ exports[`ssr snapshot test renders ./examples/form/demos/validator-status.vue co
       <div class="t-form__label t-form__label--right" style="width:80px;"><label for="">帮助</label></div>
       <div class="t-form__controls" style="margin-left:80px;">
         <div class="t-form__controls-content">
-          <div class="t-input t-size-m"><input placeholder="请输入" type="text" value="" class="t-input__inner"></div><span class="t-form__status"><svg class="t-icon t-icon-help-circle" style="0:c;1:o;2:l;3:o;4:r;5::;6: ;7:#;8:0;9:0;10:0;11:6;font-size:16px;"><use href="#t-icon-help-circle"></use></svg></span>
+          <div class="t-input t-size-m"><input placeholder="请输入" type="text" value="" class="t-input__inner"></div><span class="t-form__status"><svg class="t-icon t-icon-help-circle" style="font-size:16px;color:#0006;"><use href="#t-icon-help-circle"></use></svg></span>
         </div>
         <div class="t-form__help">自定义帮助图标</div>
       </div>
@@ -4788,7 +4788,7 @@ exports[`ssr snapshot test renders ./examples/icon/demos/base.vue correctly 1`]
       <use href="#t-icon-check-circle-filled"></use>
     </svg> <svg class="t-icon t-icon-check-circle-filled">
       <use href="#t-icon-check-circle-filled"></use>
-    </svg> <svg class="t-icon t-icon-check-circle-filled" style="font-size:medium;">
+    </svg> <svg class="t-icon t-icon-check-circle-filled t-size-m">
       <use href="#t-icon-check-circle-filled"></use>
     </svg> <svg class="t-icon t-icon-check-circle-filled t-size-l">
       <use href="#t-icon-check-circle-filled"></use>
@@ -4809,24 +4809,24 @@ exports[`ssr snapshot test renders ./examples/icon/demos/base.vue correctly 1`]
 
 exports[`ssr snapshot test renders ./examples/icon/demos/enhanced.vue correctly 1`] = `
 <div class="t-demo-iconfont">
-  <div><svg class="t-icon t-icon-cps-icon-home-sheep">
+  <div><svg class="t-icon cps-icon-home-sheep">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-cps-icon-home-sheep" style="font-size:medium;">
+    </svg> <svg class="t-icon cps-icon-home-sheep t-size-m">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-cps-icon-home-sheep t-size-l">
+    </svg> <svg class="t-icon cps-icon-home-sheep t-size-l">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-cps-icon-home-sheep" style="font-size:25px;">
+    </svg> <svg class="t-icon cps-icon-home-sheep" style="font-size:25px;">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-cps-icon-home-sheep" style="font-size:2em;">
+    </svg> <svg class="t-icon cps-icon-home-sheep" style="font-size:2em;">
       <use href="#cps-icon-home-sheep"></use>
     </svg></div><br>
-  <div><svg class="t-icon t-icon-cps-icon-home-sheep" style="color:red;">
+  <div><svg class="t-icon cps-icon-home-sheep" style="color:red;">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-cps-icon-home-sheep" style="color:green;">
+    </svg> <svg class="t-icon cps-icon-home-sheep" style="color:green;">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-cps-icon-home-sheep" style="color:orange;">
+    </svg> <svg class="t-icon cps-icon-home-sheep" style="color:orange;">
       <use href="#cps-icon-home-sheep"></use>
-    </svg> <svg class="t-icon t-icon-t-icon-home">
+    </svg> <svg class="t-icon t-icon-home">
       <use href="#t-icon-home"></use>
     </svg></div>
 </div>
@@ -4835,14 +4835,14 @@ exports[`ssr snapshot test renders ./examples/icon/demos/enhanced.vue correctly
 exports[`ssr snapshot test renders ./examples/icon/demos/iconfont.vue correctly 1`] = `
 <div class="t-demo-iconfont">
   <div class="t-demo-row"><i class="t-icon t-icon-loading"></i> <i class="t-icon t-icon-close"></i> <i class="t-icon t-icon-check-circle-filled"></i></div> <br>
-  <div class="t-demo-row"><i class="t-icon t-icon-check-circle-filled t-size-s"></i> <i class="t-icon t-icon-check-circle-filled"></i> <i class="t-icon t-icon-check-circle-filled" style="font-size:medium;"></i> <i class="t-icon t-icon-check-circle-filled t-size-l"></i> <i class="t-icon t-icon-check-circle-filled" style="font-size:25px;"></i> <i class="t-icon t-icon-check-circle-filled" style="font-size:2em;"></i></div> <br>
+  <div class="t-demo-row"><i class="t-icon t-icon-check-circle-filled t-size-s"></i> <i class="t-icon t-icon-check-circle-filled"></i> <i class="t-icon t-icon-check-circle-filled t-size-m"></i> <i class="t-icon t-icon-check-circle-filled t-size-l"></i> <i class="t-icon t-icon-check-circle-filled" style="font-size:25px;"></i> <i class="t-icon t-icon-check-circle-filled" style="font-size:2em;"></i></div> <br>
   <div class="t-demo-row"><i class="t-icon t-icon-check-circle-filled" style="color:red;"></i> <i class="t-icon t-icon-check-circle-filled" style="color:green;"></i> <i class="t-icon t-icon-check-circle-filled" style="color:orange;"></i></div>
 </div>
 `;
 
 exports[`ssr snapshot test renders ./examples/icon/demos/iconfont-enhanced.vue correctly 1`] = `
 <div class="t-demo-iconfont">
-  <div><i class="t-icon cps-icon cps-icon-home-sheep"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="font-size:medium;"></i> <i class="t-icon cps-icon cps-icon-home-sheep t-size-l"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="font-size:25px;"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="font-size:2em;"></i></div><br>
+  <div><i class="t-icon cps-icon cps-icon-home-sheep"></i> <i class="t-icon cps-icon cps-icon-home-sheep t-size-m"></i> <i class="t-icon cps-icon cps-icon-home-sheep t-size-l"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="font-size:25px;"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="font-size:2em;"></i></div><br>
   <div><i class="t-icon cps-icon cps-icon-home-sheep" style="color:red;"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="color:green;"></i> <i class="t-icon cps-icon cps-icon-home-sheep" style="color:orange;"></i> <i class="t-icon t-icon-home"></i></div> <br>
 </div>
 `;
@@ -4860,7 +4860,7 @@ exports[`ssr snapshot test renders ./examples/icon/demos/single.vue correctly 1`
       <path fill="currentColor" d="M8 15A7 7 0 108 1a7 7 0 000 14zM4.5 8.2l.7-.7L7 9.3l3.8-3.8.7.7L7 10.7 4.5 8.2z" fill-opacity="0.9"></path>
     </svg> <svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-check-circle-filled">
       <path fill="currentColor" d="M8 15A7 7 0 108 1a7 7 0 000 14zM4.5 8.2l.7-.7L7 9.3l3.8-3.8.7.7L7 10.7 4.5 8.2z" fill-opacity="0.9"></path>
-    </svg> <svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-check-circle-filled" style="font-size:medium;">
+    </svg> <svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-check-circle-filled t-size-m">
       <path fill="currentColor" d="M8 15A7 7 0 108 1a7 7 0 000 14zM4.5 8.2l.7-.7L7 9.3l3.8-3.8.7.7L7 10.7 4.5 8.2z" fill-opacity="0.9"></path>
     </svg> <svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-check-circle-filled t-size-l">
       <path fill="currentColor" d="M8 15A7 7 0 108 1a7 7 0 000 14zM4.5 8.2l.7-.7L7 9.3l3.8-3.8.7.7L7 10.7 4.5 8.2z" fill-opacity="0.9"></path>
@@ -4985,10 +4985,10 @@ exports[`ssr snapshot test renders ./examples/input/demos/textarea.vue correctly
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/center.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -4997,10 +4997,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/center.vue corr
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/default.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="2021" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="2021" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5009,10 +5009,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/default.vue cor
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/disabled.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m t-is-disabled"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m t-is-disabled"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input disabled="disabled" autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner t-is-disabled t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input disabled="disabled" autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner t-is-disabled t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5021,10 +5021,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/disabled.vue co
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/empty.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="输入" value="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="输入" value="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5033,10 +5033,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/empty.vue corre
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/format.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3%" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3%" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5045,10 +5045,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/format.vue corr
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/left.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m t-is-controls-right"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+  <div class="t-input-number t-size-m t-is-controls-right"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
         <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
         <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5072,10 +5072,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/size.vue correc
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
-  <div class="t-input-number t-size-m" style="margin:0 50px;"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m" style="margin:0 50px;"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5091,10 +5091,10 @@ exports[`ssr snapshot test renders ./examples/input-number/demos/size.vue correc
 
 exports[`ssr snapshot test renders ./examples/input-number/demos/step.vue correctly 1`] = `
 <div>
-  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size:medium;">
+  <div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
         <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
       </svg></button>
-    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3.20" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size:medium;">
+    <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="3.20" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
         <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
       </svg></button>
   </div>
@@ -5214,11 +5214,11 @@ exports[`ssr snapshot test renders ./examples/layout/demos/combine.vue correctly
             <li class="t-menu__item t-menu__item--plain"><span class="t-menu__content">菜单内容二</span></li>
             <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">菜单内容三</span></li>
           </ul>
-          <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+          <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
                 <use href="#t-icon-search"></use>
-              </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-notification-filled t-menu__operations-icon">
+              </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-notification-filled">
                 <use href="#t-icon-notification-filled"></use>
-              </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-home t-menu__operations-icon">
+              </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-home">
                 <use href="#t-icon-home"></use>
               </svg></a></div>
         </div>
@@ -5293,11 +5293,11 @@ exports[`ssr snapshot test renders ./examples/layout/demos/top.vue correctly 1`]
             <li class="t-menu__item t-menu__item--plain"><span class="t-menu__content">菜单内容二</span></li>
             <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">菜单内容三</span></li>
           </ul>
-          <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+          <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
                 <use href="#t-icon-search"></use>
-              </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-notification-filled t-menu__operations-icon">
+              </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-notification-filled">
                 <use href="#t-icon-notification-filled"></use>
-              </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-home t-menu__operations-icon">
+              </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-home">
                 <use href="#t-icon-home"></use>
               </svg></a></div>
         </div>
@@ -5955,7 +5955,7 @@ exports[`ssr snapshot test renders ./examples/menu/demos/closable-side.vue corre
     资源编辑
   </span></li>
     </ul>
-    <div class="t-menu__operations"><svg class="t-icon t-icon-chevron-right t-menu__operations-icon">
+    <div class="t-menu__operations"><svg class="t-menu__operations-icon t-icon t-icon-chevron-right">
         <use href="#t-icon-chevron-right"></use>
       </svg></div>
   </div>
@@ -6015,13 +6015,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/double.vue correctly 1`
           </ul>
         </li>
       </ul>
-      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
             <use href="#t-icon-search"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
             <use href="#t-icon-mail"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
             <use href="#t-icon-user"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
             <use href="#t-icon-ellipsis"></use>
           </svg></a></div>
     </div>
@@ -6047,13 +6047,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/double.vue correctly 1`
           </ul>
         </li>
       </ul>
-      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
             <use href="#t-icon-search"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
             <use href="#t-icon-mail"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
             <use href="#t-icon-user"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
             <use href="#t-icon-ellipsis"></use>
           </svg></a></div>
     </div>
@@ -6082,7 +6082,7 @@ exports[`ssr snapshot test renders ./examples/menu/demos/group-side.vue correctl
         <li class="t-menu__item t-menu__item--plain"><span class="t-menu__content">菜单内容</span></li>
       </div>
     </ul>
-    <div class="t-menu__operations"><svg class="t-icon t-icon-view-list t-menu__operations-icon">
+    <div class="t-menu__operations"><svg class="t-menu__operations-icon t-icon t-icon-view-list">
         <use href="#t-icon-view-list"></use>
       </svg></div>
   </div>
@@ -6099,13 +6099,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/head-menu-dark.vue corr
       <li class="t-menu__item t-menu__item--plain"><span class="t-menu__content">菜单内容二</span></li>
       <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">菜单内容三</span></li>
     </ul>
-    <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+    <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
           <use href="#t-icon-search"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
           <use href="#t-icon-mail"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
           <use href="#t-icon-user"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
           <use href="#t-icon-ellipsis"></use>
         </svg></a></div>
   </div>
@@ -6135,13 +6135,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/head-menu-mode-tile.vue
       <li class="t-menu__item t-menu__item--plain"><span class="t-menu__content">菜单内容二</span></li>
       <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">菜单内容三</span></li>
     </ul>
-    <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+    <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
           <use href="#t-icon-search"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
           <use href="#t-icon-mail"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
           <use href="#t-icon-user"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
           <use href="#t-icon-ellipsis"></use>
         </svg></a></div>
   </div>
@@ -6194,13 +6194,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/head-menu-tile.vue corr
     </li></span></li>
     <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">菜单4</span></li>
     </ul>
-    <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+    <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
           <use href="#t-icon-search"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
           <use href="#t-icon-mail"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
           <use href="#t-icon-user"></use>
-        </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+        </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
           <use href="#t-icon-ellipsis"></use>
         </svg></a></div>
   </div>
@@ -6267,7 +6267,7 @@ exports[`ssr snapshot test renders ./examples/menu/demos/multi-side.vue correctl
       资源编辑
     </span></li>
       </ul>
-      <div class="t-menu__operations"><svg class="t-icon t-icon-view-list t-menu__operations-icon">
+      <div class="t-menu__operations"><svg class="t-menu__operations-icon t-icon t-icon-view-list">
           <use href="#t-icon-view-list"></use>
         </svg></div>
     </div>
@@ -6342,7 +6342,7 @@ exports[`ssr snapshot test renders ./examples/menu/demos/multi-side.vue correctl
       资源编辑
     </span></li>
       </ul>
-      <div class="t-menu__operations"><svg class="t-icon t-icon-view-list t-menu__operations-icon">
+      <div class="t-menu__operations"><svg class="t-menu__operations-icon t-icon t-icon-view-list">
           <use href="#t-icon-view-list"></use>
         </svg></div>
     </div>
@@ -6405,13 +6405,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/multiple.vue correctly
           </div>
         </li>
       </ul>
-      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
             <use href="#t-icon-search"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
             <use href="#t-icon-mail"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
             <use href="#t-icon-user"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
             <use href="#t-icon-ellipsis"></use>
           </svg></a></div>
     </div>
@@ -6445,13 +6445,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/multiple.vue correctly
           </div>
         </li>
       </ul>
-      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
             <use href="#t-icon-search"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
             <use href="#t-icon-mail"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
             <use href="#t-icon-user"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
             <use href="#t-icon-ellipsis"></use>
           </svg></a></div>
     </div>
@@ -6499,7 +6499,7 @@ exports[`ssr snapshot test renders ./examples/menu/demos/popup-side.vue correctl
     资源列表
   </span></li>
     </ul>
-    <div class="t-menu__operations"><svg class="t-icon t-icon-view-list t-menu__operations-icon">
+    <div class="t-menu__operations"><svg class="t-menu__operations-icon t-icon t-icon-view-list">
         <use href="#t-icon-view-list"></use>
       </svg></div>
   </div>
@@ -6530,13 +6530,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/single.vue correctly 1`
         <li class="t-menu__item t-is-active t-menu__item--plain"><span class="t-menu__content">菜单2</span></li>
         <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">禁用菜单</span></li>
       </ul>
-      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
             <use href="#t-icon-search"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
             <use href="#t-icon-mail"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
             <use href="#t-icon-user"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
             <use href="#t-icon-ellipsis"></use>
           </svg></a></div>
     </div>
@@ -6549,13 +6549,13 @@ exports[`ssr snapshot test renders ./examples/menu/demos/single.vue correctly 1`
         <li class="t-menu__item t-menu__item--plain"><span class="t-menu__content">菜单2</span></li>
         <li class="t-menu__item t-is-disabled t-menu__item--plain"><span class="t-menu__content">禁用菜单</span></li>
       </ul>
-      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-icon t-icon-search t-menu__operations-icon">
+      <div class="t-menu__operations"><a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-search">
             <use href="#t-icon-search"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-mail t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-mail">
             <use href="#t-icon-mail"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-user t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-user">
             <use href="#t-icon-user"></use>
-          </svg></a> <a href="javascript:;"><svg class="t-icon t-icon-ellipsis t-menu__operations-icon">
+          </svg></a> <a href="javascript:;"><svg class="t-menu__operations-icon t-icon t-icon-ellipsis">
             <use href="#t-icon-ellipsis"></use>
           </svg></a></div>
     </div>
@@ -9194,10 +9194,10 @@ exports[`ssr snapshot test renders ./examples/slider/demos/input-number.vue corr
           </div>
         </div>
         <div class="t-slider__input-container">
-          <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+          <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
                 <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
               </svg></button>
-            <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+            <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
                 <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
               </svg></button>
           </div>
@@ -9224,18 +9224,18 @@ exports[`ssr snapshot test renders ./examples/slider/demos/input-number.vue corr
           </div>
         </div>
         <div class="t-slider__input-container">
-          <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+          <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
                 <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
               </svg></button>
-            <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+            <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
                 <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
               </svg></button>
           </div>
           <div class="t-slider__center-line"></div>
-          <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+          <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
                 <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
               </svg></button>
-            <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+            <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
                 <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
               </svg></button>
           </div>
@@ -9262,10 +9262,10 @@ exports[`ssr snapshot test renders ./examples/slider/demos/input-number-vertical
         </div>
       </div>
       <div class="t-slider__input-container is-vertical">
-        <div class="t-input-number t-size-m t-is-controls-right t-slider__input is-vertical"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+        <div class="t-input-number t-size-m t-is-controls-right t-slider__input is-vertical"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
               <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
             </svg></button>
-          <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+          <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
               <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
             </svg></button>
         </div>
@@ -9292,18 +9292,18 @@ exports[`ssr snapshot test renders ./examples/slider/demos/input-number-vertical
         </div>
       </div>
       <div class="t-slider__input-container is-vertical">
-        <div class="t-input-number t-size-m t-is-controls-right t-slider__input is-vertical"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+        <div class="t-input-number t-size-m t-is-controls-right t-slider__input is-vertical"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
               <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
             </svg></button>
-          <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+          <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
               <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
             </svg></button>
         </div>
         <div class="t-slider__center-line"></div>
-        <div class="t-input-number t-size-m t-is-controls-right t-slider__input is-vertical"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size:medium;">
+        <div class="t-input-number t-size-m t-is-controls-right t-slider__input is-vertical"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
               <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
             </svg></button>
-          <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size:medium;">
+          <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" value="0" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
               <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
             </svg></button>
         </div>
@@ -14888,7 +14888,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/base.vue correct
       <div class="t-select t-size-m"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span>
         <div class="t-input t-size-m t-select__input"><input placeholder="请选择" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -14910,7 +14910,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/collapsed.vue co
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">guangzhou<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close" style="display:none;">shenzhen<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark">+1</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -14927,7 +14927,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/collapsed.vue co
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">guangzhou<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close" style="display:none;">shenzhen<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark">更多...</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -14949,7 +14949,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/dvalue.vue corre
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span><span title="shenzhen,guangzhou" class="t-select__single">shenzhen,guangzhou</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="shenzhen,guangzhou" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -14976,7 +14976,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/filterable.vue c
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span><span title="shenzhen" class="t-select__single">shenzhen</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="shenzhen" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -14998,7 +14998,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/lazy.vue correct
       <div class="t-select t-size-m"><span class="t-select__placeholder">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="请选择" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -15020,7 +15020,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/multiple.vue cor
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">guangzhou<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">shenzhen<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+2</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -15042,7 +15042,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/prefix.vue corre
       <div class="t-select t-size-m t-has-prefix"><span class="t-select__left-icon"><svg class="t-icon t-icon-user"><use href="#t-icon-user"></use></svg></span><span class="t-select__placeholder">请输入</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="请输入" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -15064,7 +15064,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/props.vue correc
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span><span title="shenzhen" class="t-select__single">shenzhen</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="shenzhen" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -15086,7 +15086,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/valuetype.vue co
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+0</span><span title="[object Object]" class="t-select__single">[object Object]</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="[object Object]" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
@@ -15103,7 +15103,7 @@ exports[`ssr snapshot test renders ./examples/tree-select/demos/valuetype.vue co
       <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display:none;">请选择</span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">undefined<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">undefined<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display:none;">+2</span>
         <div class="t-input t-size-m t-select__input" style="display:none;"><input placeholder="" type="text" value="" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size:medium;">
           <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size:medium;display:none;">
+        </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display:none;">
           <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
         </svg>
         <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display:none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" size="small" class="t-loading__gradient t-icon-loading">
diff --git a/test/unit/input-number/__snapshots__/demo.test.js.snap b/test/unit/input-number/__snapshots__/demo.test.js.snap
index 4b46feddf..5f83cc10c 100644
--- a/test/unit/input-number/__snapshots__/demo.test.js.snap
+++ b/test/unit/input-number/__snapshots__/demo.test.js.snap
@@ -10,10 +10,9 @@ exports[`InputNumber center demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -39,10 +38,9 @@ exports[`InputNumber center demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -67,10 +65,9 @@ exports[`InputNumber defaultDemo demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -96,10 +93,9 @@ exports[`InputNumber defaultDemo demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -124,10 +120,9 @@ exports[`InputNumber disabled demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -154,10 +149,9 @@ exports[`InputNumber disabled demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -182,10 +176,9 @@ exports[`InputNumber format demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -211,10 +204,9 @@ exports[`InputNumber format demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -239,10 +231,9 @@ exports[`InputNumber left demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-chevron-down"
+        class="t-icon t-icon-chevron-down t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -268,10 +259,9 @@ exports[`InputNumber left demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-chevron-up"
+        class="t-icon t-icon-chevron-up t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -348,10 +338,9 @@ exports[`InputNumber size demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -377,10 +366,9 @@ exports[`InputNumber size demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -456,10 +444,9 @@ exports[`InputNumber step demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -485,10 +472,9 @@ exports[`InputNumber step demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -513,10 +499,9 @@ exports[`InputNumber undefined demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-remove"
+        class="t-icon t-icon-remove t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
@@ -542,10 +527,9 @@ exports[`InputNumber undefined demo works fine 1`] = `
       type="button"
     >
       <svg
-        class="t-icon t-icon-add"
+        class="t-icon t-icon-add t-size-m"
         fill="none"
         height="1em"
-        style="font-size: medium;"
         viewBox="0 0 16 16"
         width="1em"
       >
diff --git a/test/unit/input-number/__snapshots__/index.test.js.snap b/test/unit/input-number/__snapshots__/index.test.js.snap
index 7718a5c41..08e80c7e8 100644
--- a/test/unit/input-number/__snapshots__/index.test.js.snap
+++ b/test/unit/input-number/__snapshots__/index.test.js.snap
@@ -1,100 +1,100 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`InputNumber :props :defaultValue, default value 6 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :disabled, function can not be call 1`] = `
-<div class="t-input-number t-size-m t-is-disabled"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m t-is-disabled"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input disabled="disabled" autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-is-disabled t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input disabled="disabled" autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-is-disabled t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :format, with 6% 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :max, value 6 < max 10 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :max, value 16 > max 10 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input t-is-error"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input t-is-error"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :min, value -1 < min 1 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input t-is-error"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input t-is-error"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase t-is-disabled"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :min, value 6 > min 1 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :mode, without class t-is-controls-right 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :mode:column, with class t-is-controls-right 1`] = `
-<div class="t-input-number t-size-m t-is-controls-right"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size: medium;">
+<div class="t-input-number t-size-m t-is-controls-right"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
       <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
       <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :mode:row, without class t-is-controls-right 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
@@ -111,10 +111,10 @@ exports[`InputNumber :props :size:large, with class t-size-l 1`] = `
 `;
 
 exports[`InputNumber :props :size:medium, with class t-size-m 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
@@ -131,30 +131,30 @@ exports[`InputNumber :props :size:small, with class t-size-s 1`] = `
 `;
 
 exports[`InputNumber :props :step, 2 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props :value, 6 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
 `;
 
 exports[`InputNumber :props class, with class t-input-number 1`] = `
-<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove" style="font-size: medium;">
+<div class="t-input-number t-size-m"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-remove t-size-m">
       <path fill="currentColor" d="M3.5 7.35h9v1.3h-9v-1.3z" fill-opacity="0.9"></path>
     </svg></button>
-  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add" style="font-size: medium;">
+  <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner t-input-number-text-align"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-add t-size-m">
       <path fill="currentColor" d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z" fill-opacity="0.9"></path>
     </svg></button>
 </div>
diff --git a/test/unit/menu/__snapshots__/demo.test.js.snap b/test/unit/menu/__snapshots__/demo.test.js.snap
index ce94c07dd..034de6b64 100644
--- a/test/unit/menu/__snapshots__/demo.test.js.snap
+++ b/test/unit/menu/__snapshots__/demo.test.js.snap
@@ -58,7 +58,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-search t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-search"
           >
             <use
               href="#t-icon-search"
@@ -70,7 +70,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-mail t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-mail"
           >
             <use
               href="#t-icon-mail"
@@ -82,7 +82,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-user t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-user"
           >
             <use
               href="#t-icon-user"
@@ -94,7 +94,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-ellipsis t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-ellipsis"
           >
             <use
               href="#t-icon-ellipsis"
@@ -164,7 +164,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-search t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-search"
           >
             <use
               href="#t-icon-search"
@@ -176,7 +176,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-mail t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-mail"
           >
             <use
               href="#t-icon-mail"
@@ -188,7 +188,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-user t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-user"
           >
             <use
               href="#t-icon-user"
@@ -200,7 +200,7 @@ exports[`Menu single demo works fine 1`] = `
           href="javascript:;"
         >
           <svg
-            class="t-icon t-icon-ellipsis t-menu__operations-icon"
+            class="t-menu__operations-icon t-icon t-icon-ellipsis"
           >
             <use
               href="#t-icon-ellipsis"
diff --git a/test/unit/slider/__snapshots__/index.test.js.snap b/test/unit/slider/__snapshots__/index.test.js.snap
index 3058fa5cc..62c18ea1c 100644
--- a/test/unit/slider/__snapshots__/index.test.js.snap
+++ b/test/unit/slider/__snapshots__/index.test.js.snap
@@ -54,10 +54,10 @@ exports[`Slider [marks] render right 1`] = `
     </div>
   </div>
   <div class="t-slider__input-container">
-    <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down" style="font-size: medium;">
+    <div class="t-input-number t-size-m t-is-controls-right t-slider__input"><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__decrease"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-down t-size-m">
           <path fill="currentColor" d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z" fill-opacity="0.9"></path>
         </svg></button>
-      <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up" style="font-size: medium;">
+      <div class="t-input"><input autocomplete="off" ref="refInputElem" placeholder="" class="t-input__inner"></div><button type="button" class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-input-number__increase"><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-chevron-up t-size-m">
           <path fill="currentColor" d="M12.46 9.54l-.92.92L8 6.92l-3.54 3.54-.92-.92L8 5.08l4.46 4.46z" fill-opacity="0.9"></path>
         </svg></button>
     </div>
diff --git a/test/unit/tree-select/__snapshots__/demo.test.js.snap b/test/unit/tree-select/__snapshots__/demo.test.js.snap
index 609f25adc..8ca07ff67 100644
--- a/test/unit/tree-select/__snapshots__/demo.test.js.snap
+++ b/test/unit/tree-select/__snapshots__/demo.test.js.snap
@@ -160,10 +160,10 @@ exports[`TreeSelect base demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -421,10 +421,10 @@ exports[`TreeSelect collapsed demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -674,10 +674,10 @@ exports[`TreeSelect collapsed demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -935,10 +935,10 @@ exports[`TreeSelect filterable demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -1139,10 +1139,10 @@ exports[`TreeSelect lazy demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -1398,10 +1398,10 @@ exports[`TreeSelect multiple demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -1613,10 +1613,10 @@ exports[`TreeSelect prefix demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -1824,10 +1824,10 @@ exports[`TreeSelect props demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -2035,10 +2035,10 @@ exports[`TreeSelect valuetype demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
@@ -2290,10 +2290,10 @@ exports[`TreeSelect valuetype demo works fine 1`] = `
           />
         </svg>
         <svg
-          class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear"
+          class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear"
           fill="none"
           height="1em"
-          style="font-size: medium; display: none;"
+          style="display: none;"
           viewBox="0 0 16 16"
           width="1em"
         >
diff --git a/test/unit/tree-select/__snapshots__/index.test.js.snap b/test/unit/tree-select/__snapshots__/index.test.js.snap
index a274097a9..1e61a607c 100644
--- a/test/unit/tree-select/__snapshots__/index.test.js.snap
+++ b/test/unit/tree-select/__snapshots__/index.test.js.snap
@@ -23,7 +23,7 @@ exports[`TreeSelect :props :clearable 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -59,7 +59,7 @@ exports[`TreeSelect :props :defaultValue 1`] = `
     <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display: none;"></span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">shenzhen<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark t-tag--close">guangzhou<svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close t-tag__icon-close"><path fill="currentColor" d="M8 8.92L11.08 12l.92-.92L8.92 8 12 4.92 11.08 4 8 7.08 4.92 4 4 4.92 7.08 8 4 11.08l.92.92L8 8.92z" fill-opacity="0.9"></path></svg></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+2</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -95,7 +95,7 @@ exports[`TreeSelect :props :disabled 1`] = `
     <div class="t-select t-is-disabled t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-is-disabled t-select__input" style="display: none;"><input disabled="disabled" placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -129,7 +129,7 @@ exports[`TreeSelect :props :empty string 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -165,7 +165,7 @@ exports[`TreeSelect :props :filterable 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder" style="display: none;"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -199,7 +199,7 @@ exports[`TreeSelect :props :loading 1`] = `
       </div>
     </transition-stub>
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
-      <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -233,7 +233,7 @@ exports[`TreeSelect :props :loadingText 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -269,7 +269,7 @@ exports[`TreeSelect :props :max 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -305,7 +305,7 @@ exports[`TreeSelect :props :minCollapsedNum 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+-1</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -341,7 +341,7 @@ exports[`TreeSelect :props :multiple 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -377,7 +377,7 @@ exports[`TreeSelect :props :placeholder 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder">please select address</span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="please select address" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -413,7 +413,7 @@ exports[`TreeSelect :props :popupProps 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -485,7 +485,7 @@ exports[`TreeSelect :props :treeProps 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -521,7 +521,7 @@ exports[`TreeSelect :props :value 1`] = `
     <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display: none;"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span><span title="shenzhen" class="t-select__single">shenzhen</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="shenzhen" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -557,7 +557,7 @@ exports[`TreeSelect :props :valueType 1`] = `
     <div class="t-select t-size-m t-select-selected"><span class="t-select__placeholder" style="display: none;"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span><span title="[object Object]" class="t-select__single">[object Object]</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="[object Object]" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -593,7 +593,7 @@ exports[`TreeSelect <slot> <collapsedItems> 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -629,7 +629,7 @@ exports[`TreeSelect <slot> <empty> 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -663,7 +663,7 @@ exports[`TreeSelect <slot> <loadingText> 1`] = `
       </div>
     </transition-stub>
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
-      <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -699,7 +699,7 @@ exports[`TreeSelect <slot> <prefixIcon> 1`] = `
     <div class="t-select t-size-m t-has-prefix"><span class="t-select__left-icon"><div><i>icon</i></div></span><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -735,7 +735,7 @@ exports[`TreeSelect function :collapsedItems 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -771,7 +771,7 @@ exports[`TreeSelect function :empty 1`] = `
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -805,7 +805,7 @@ exports[`TreeSelect function :loadingText 1`] = `
       </div>
     </transition-stub>
     <div class="t-select t-size-m"><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
-      <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">
@@ -841,7 +841,7 @@ exports[`TreeSelect function :prefixIcon 1`] = `
     <div class="t-select t-size-m t-has-prefix"><span class="t-select__left-icon"></span><span class="t-select__placeholder"></span><span class="t-tag t-tag--default t-size-m t-tag--dark" style="display: none;">+0</span>
       <div class="t-input t-size-m t-select__input" style="display: none;"><input placeholder="" type="text" class="t-input__inner"></div><svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="t-fake-arrow t-select__right-icon" style="font-size: medium;">
         <path d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921" stroke="black" stroke-opacity="0.9" stroke-width="1.3"></path>
-      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-select__right-icon t-select__right-icon-clear" style="font-size: medium; display: none;">
+      </svg><svg fill="none" viewBox="0 0 16 16" width="1em" height="1em" class="t-icon t-icon-close-circle-filled t-size-m t-select__right-icon t-select__right-icon-clear" style="display: none;">
         <path fill="currentColor" d="M15 8A7 7 0 101 8a7 7 0 0014 0zM5.67 4.95L8 7.29l2.33-2.34.7.7L8.7 8l2.34 2.35-.71.7L8 8.71l-2.33 2.34-.7-.7L7.3 8 4.96 5.65l.71-.7z" fill-opacity="0.9"></path>
       </svg>
       <div class="t-loading--center t-size-s t-loading t-select__right-icon t-select__active-icon" style="display: none;"><svg viewBox="0 0 14 14" version="1.1" width="1em" height="1em" xmlns="http://www.w3.org/2000/svg" class="t-loading__gradient t-icon-loading" size="small">