From 5558a40a0c5bcb116fd71abbcb69aa8ddddfde42 Mon Sep 17 00:00:00 2001
From: _lmmmmmm <lmmmmmm12138@gmail.com>
Date: Sun, 4 Sep 2022 10:14:19 +0800
Subject: [PATCH 1/6] docs(affix): affix demo space

---
 src/affix/_example/base.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/affix/_example/base.vue b/src/affix/_example/base.vue
index 0cb7d8c728..e2a2933b97 100644
--- a/src/affix/_example/base.vue
+++ b/src/affix/_example/base.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="affix-base">
+  <t-space>
     <t-affix ref="affix" :offset-top="140" :offset-bottom="20">
       <t-button>固钉</t-button>
     </t-affix>
-  </div>
+  </t-space>
 </template>

From 28874682b6be44605551d15d420d614aa8b55ffc Mon Sep 17 00:00:00 2001
From: _lmmmmmm <lmmmmmm12138@gmail.com>
Date: Sun, 4 Sep 2022 10:18:11 +0800
Subject: [PATCH 2/6] docs(anchor): anchor demo space

---
 src/anchor/_example/container.vue | 6 +++---
 src/anchor/_example/cursor.vue    | 4 ++--
 src/anchor/_example/large.vue     | 4 ++--
 src/anchor/_example/multiple.vue  | 4 ++--
 src/anchor/_example/small.vue     | 4 ++--
 src/anchor/_example/target.vue    | 4 ++--
 6 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/anchor/_example/container.vue b/src/anchor/_example/container.vue
index 1f6f335040..7ca7629b13 100644
--- a/src/anchor/_example/container.vue
+++ b/src/anchor/_example/container.vue
@@ -6,13 +6,13 @@
       <t-anchor-item :href="`#${path}#content-3`" title="content-3" />
       <t-anchor-item :href="`#${path}#content-4`" title="content-4" />
     </t-anchor>
-    <div id="anchor-container">
+    <t-space id="anchor-container" direction="vertical" :size="0">
       <div :id="`${path}#content-1`" class="anchor-content-1">anchor-content-1</div>
       <div :id="`${path}#content-2`" class="anchor-content-2">anchor-content-2</div>
       <div :id="`${path}#content-3`" class="anchor-content-3">anchor-content-3</div>
       <div :id="`${path}#content-4`" class="anchor-content-4">anchor-content-4</div>
       <div :id="`${path}#content-5`" class="anchor-content-5">anchor-content-5</div>
-    </div>
+    </t-space>
   </div>
 </template>
 <script setup>
@@ -35,7 +35,7 @@ const handleClick = ({ e, href, title }) => {
   flex-grow: 1;
   height: 200px;
   overflow: auto;
-  > div {
+  div {
     text-align: center;
     font-size: 22px;
     line-height: 100px;
diff --git a/src/anchor/_example/cursor.vue b/src/anchor/_example/cursor.vue
index 9550190211..a5db77cf05 100644
--- a/src/anchor/_example/cursor.vue
+++ b/src/anchor/_example/cursor.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="anchor-demo">
+  <t-space class="anchor-demo">
     <t-anchor :bounds="150">
       <template #cursor>
         <div class="test-cursor" />
@@ -12,7 +12,7 @@
       <t-anchor-item :href="`#${path}#anchor-target-6`" title="保密协议" />
       <t-anchor-item :href="`#${path}#anchor-target-7`" title="其他" />
     </t-anchor>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
diff --git a/src/anchor/_example/large.vue b/src/anchor/_example/large.vue
index f1b5ef049c..f7e39de612 100644
--- a/src/anchor/_example/large.vue
+++ b/src/anchor/_example/large.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :id="`${path}#large`" class="anchor-demo">
+  <t-space :id="`${path}#large`" class="anchor-demo">
     <t-anchor size="large">
       <t-anchor-item :href="`#${path}#default`" title="定义" />
       <t-anchor-item :href="`#${path}#multiple`" title="服务功能" />
@@ -9,7 +9,7 @@
       <t-anchor-item :href="`#${path}#anchor-target-6`" title="保密协议" />
       <t-anchor-item :href="`#${path}#anchor-target-7`" title="其他" />
     </t-anchor>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
diff --git a/src/anchor/_example/multiple.vue b/src/anchor/_example/multiple.vue
index 9cffaa7961..77947c2ee2 100644
--- a/src/anchor/_example/multiple.vue
+++ b/src/anchor/_example/multiple.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :id="`${path}#multiple`" class="anchor-demo">
+  <t-space :id="`${path}#multiple`" class="anchor-demo">
     <t-anchor :bounds="100" :target-offset="200">
       <t-anchor-item :href="`#${path}#default`" title="定义" />
       <t-anchor-item :href="`#${path}#multiple`" title="服务功能" />
@@ -10,7 +10,7 @@
       <t-anchor-item :href="`#${path}#anchor-target-6`" title="保密协议" />
       <t-anchor-item :href="`#${path}#anchor-target-7`" title="其他" />
     </t-anchor>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
diff --git a/src/anchor/_example/small.vue b/src/anchor/_example/small.vue
index 03a2c590c7..f6c7948471 100644
--- a/src/anchor/_example/small.vue
+++ b/src/anchor/_example/small.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :id="`${path}#small`" class="anchor-demo">
+  <t-space :id="`${path}#small`" class="anchor-demo">
     <t-anchor size="small">
       <t-anchor-item :href="`#${path}#default`" title="定义" />
       <t-anchor-item :href="`#${path}#multiple`" title="服务功能" />
@@ -9,7 +9,7 @@
       <t-anchor-item :href="`#${path}#anchor-target-6`" title="保密协议" />
       <t-anchor-item :href="`#${path}#anchor-target-7`" title="其他" />
     </t-anchor>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { computed, getCurrentInstance } from 'vue';
diff --git a/src/anchor/_example/target.vue b/src/anchor/_example/target.vue
index d5e008445f..0eda7b0082 100644
--- a/src/anchor/_example/target.vue
+++ b/src/anchor/_example/target.vue
@@ -1,5 +1,5 @@
 <template>
-  <div :id="`${path}#anchor-target`" class="anchor-demo">
+  <t-space :id="`${path}#anchor-target`" class="anchor-demo" direction="vertical" :size="0">
     <t-anchor-target :id="`${path}#anchor-target-1`"> 定义 </t-anchor-target>
     <t-anchor-target :id="`${path}#anchor-target-2`"> 服务功能 </t-anchor-target>
     <t-anchor-target :id="`${path}#anchor-target-3`"> 使用指南 </t-anchor-target>
@@ -7,7 +7,7 @@
     <t-anchor-target :id="`${path}#anchor-target-5`"> 创建内容 </t-anchor-target>
     <t-anchor-target :id="`${path}#anchor-target-6`"> 保密协议 </t-anchor-target>
     <t-anchor-target :id="`${path}#anchor-target-7`"> 其他 </t-anchor-target>
-  </div>
+  </t-space>
 </template>
 
 <script setup>

From 45de4d826989d52489d739fb21142c3cb6a8cc10 Mon Sep 17 00:00:00 2001
From: _lmmmmmm <lmmmmmm12138@gmail.com>
Date: Sun, 4 Sep 2022 10:43:11 +0800
Subject: [PATCH 3/6] docs(dropdown): dropdown demo space

---
 src/dropdown/_example/base.vue     | 43 +++++++++---------------------
 src/dropdown/_example/button.vue   | 31 +++++----------------
 src/dropdown/_example/custom.vue   | 11 +++-----
 src/dropdown/_example/disabled.vue | 35 ++++++------------------
 src/dropdown/_example/event.vue    | 11 +++-----
 src/dropdown/_example/long.vue     | 13 +++------
 src/dropdown/_example/multiple.vue |  8 +++---
 src/dropdown/_example/slot.vue     | 10 +++----
 src/dropdown/_example/split.vue    | 26 +++---------------
 9 files changed, 50 insertions(+), 138 deletions(-)

diff --git a/src/dropdown/_example/base.vue b/src/dropdown/_example/base.vue
index d5fafc04e2..ca0de1280e 100644
--- a/src/dropdown/_example/base.vue
+++ b/src/dropdown/_example/base.vue
@@ -1,47 +1,28 @@
 <template>
-  <div class="tdesign-demo-dropdown">
+  <t-space>
     <t-dropdown :options="options" :min-column-width="112" @click="clickHandler">
-      <div class="tdesign-demo-dropdown-trigger">
+      <t-space>
         <t-button variant="text">
-          <span class="tdesign-demo-dropdown__text"> 下拉菜单 <t-icon name="chevron-down" size="16" /> </span>
+          <t-space :size="0">
+            下拉菜单
+            <t-icon name="chevron-down" size="16" />
+          </t-space>
         </t-button>
-      </div>
+      </t-space>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { MessagePlugin } from 'tdesign-vue-next';
 
 const options = [
-  {
-    content: '操作一',
-    value: 1,
-  },
-  {
-    content: '操作二',
-    value: 2,
-  },
-  {
-    content: '操作三',
-    value: 3,
-  },
-  {
-    content: '操作四',
-    value: 4,
-  },
+  { content: '操作一', value: 1 },
+  { content: '操作二', value: 2 },
+  { content: '操作三', value: 3 },
+  { content: '操作四', value: 4 },
 ];
 
 const clickHandler = (data) => {
   MessagePlugin.success(`选中【${data.content}】`);
 };
 </script>
-<style lang="less" scoped>
-.tdesign-demo-dropdown {
-  &__text {
-    display: inline-flex;
-    .t-icon {
-      margin-left: 8px;
-    }
-  }
-}
-</style>
diff --git a/src/dropdown/_example/button.vue b/src/dropdown/_example/button.vue
index 33f782b57e..dcadc80cfa 100644
--- a/src/dropdown/_example/button.vue
+++ b/src/dropdown/_example/button.vue
@@ -1,37 +1,20 @@
 <template>
-  <div>
+  <t-space>
     <t-dropdown :options="options" @click="clickHandler">
-      <t-button theme="default" variant="outline"> 下拉菜单 </t-button>
+      <t-button theme="default" variant="outline">下拉菜单</t-button>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { MessagePlugin } from 'tdesign-vue-next';
 
 const options = [
-  {
-    content: '操作一',
-    value: 1,
-  },
-  {
-    content: '操作二',
-    value: 2,
-  },
-  {
-    content: '操作三',
-    value: 3,
-  },
-  {
-    content: '操作四',
-    value: 4,
-  },
+  { content: '操作一', value: 1 },
+  { content: '操作二', value: 2 },
+  { content: '操作三', value: 3 },
+  { content: '操作四', value: 4 },
 ];
 const clickHandler = (data) => {
   MessagePlugin.success(`选中【${data.content}】`);
 };
 </script>
-<style scoped>
-.t-button {
-  margin-right: 20px;
-}
-</style>
diff --git a/src/dropdown/_example/custom.vue b/src/dropdown/_example/custom.vue
index 206b70f8a6..dc9e2066ae 100644
--- a/src/dropdown/_example/custom.vue
+++ b/src/dropdown/_example/custom.vue
@@ -1,9 +1,9 @@
 <template>
-  <div>
+  <t-space>
     <t-dropdown :options="options" trigger="click" :hide-after-item-click="false" :min-column-width="100">
-      <t-button variant="text"> 下拉菜单 </t-button>
+      <t-button variant="text">下拉菜单</t-button>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup lang="ts">
 const options = [
@@ -35,8 +35,3 @@ const options = [
   },
 ];
 </script>
-<style scoped>
-.t-button {
-  margin-right: 20px;
-}
-</style>
diff --git a/src/dropdown/_example/disabled.vue b/src/dropdown/_example/disabled.vue
index cd6ba01ab3..9c6369d258 100644
--- a/src/dropdown/_example/disabled.vue
+++ b/src/dropdown/_example/disabled.vue
@@ -1,41 +1,22 @@
 <template>
-  <div class="tdesign-demo-dropdown">
+  <t-space>
     <t-dropdown :options="options" :min-column-width="112">
       <t-button variant="text">
-        <span class="tdesign-demo-dropdown__text">
+        <t-space :size="0">
           下拉菜单
           <chevron-down-icon size="16" />
-        </span>
+        </t-space>
       </t-button>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { ChevronDownIcon } from 'tdesign-icons-vue-next';
 
 const options = [
-  {
-    content: '选项一',
-    value: 1,
-  },
-  {
-    content: '选项二',
-    value: 2,
-  },
-  {
-    content: '选项三',
-    value: 3,
-    disabled: true,
-  },
-  {
-    content: '选项四',
-    value: 4,
-    disabled: true,
-  },
+  { content: '选项一', value: 1 },
+  { content: '选项二', value: 2 },
+  { content: '选项三', value: 3, disabled: true },
+  { content: '选项四', value: 4, disabled: true },
 ];
 </script>
-<style scoped>
-.t-button {
-  margin-right: 20px;
-}
-</style>
diff --git a/src/dropdown/_example/event.vue b/src/dropdown/_example/event.vue
index 5194dd8ecb..14e3e13175 100644
--- a/src/dropdown/_example/event.vue
+++ b/src/dropdown/_example/event.vue
@@ -1,9 +1,9 @@
 <template>
-  <div>
+  <t-space>
     <t-dropdown :options="options" :min-column-width="88">
-      <t-button variant="text"> 下拉菜单 </t-button>
+      <t-button variant="text">下拉菜单</t-button>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { MessagePlugin } from 'tdesign-vue-next';
@@ -31,8 +31,3 @@ const options = [
   },
 ];
 </script>
-<style scoped>
-.t-button {
-  margin-right: 20px;
-}
-</style>
diff --git a/src/dropdown/_example/long.vue b/src/dropdown/_example/long.vue
index 890d9b8483..6a6a5c4ba8 100644
--- a/src/dropdown/_example/long.vue
+++ b/src/dropdown/_example/long.vue
@@ -1,18 +1,13 @@
 <template>
-  <div>
+  <t-space>
     <t-dropdown :options="options" :max-height="400" :min-column-width="88">
-      <t-button variant="text"> 下拉菜单 </t-button>
+      <t-button variant="text">下拉菜单</t-button>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup lang="ts">
-const options = Array.from({ length: 20 }).map((v, k) => ({
+const options = Array.from({ length: 20 }).map((_, k) => ({
   content: `选项${k + 1}`,
   value: k + 1,
 }));
 </script>
-<style scoped>
-.t-button {
-  margin-right: 20px;
-}
-</style>
diff --git a/src/dropdown/_example/multiple.vue b/src/dropdown/_example/multiple.vue
index a1b516cebd..ac5ad88f8a 100644
--- a/src/dropdown/_example/multiple.vue
+++ b/src/dropdown/_example/multiple.vue
@@ -1,14 +1,14 @@
 <template>
-  <div class="tdesign-demo-dropdown">
+  <t-space class="tdesign-demo-dropdown">
     <t-dropdown :options="options" :max-column-width="120" @click="clickHandler">
       <t-button variant="text">
-        <span class="tdesign-demo-dropdown__text">
+        <t-space :size="0" class="tdesign-demo-dropdown__text">
           下拉菜单
           <chevron-down-icon size="16" />
-        </span>
+        </t-space>
       </t-button>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { ChevronDownIcon } from 'tdesign-icons-vue-next';
diff --git a/src/dropdown/_example/slot.vue b/src/dropdown/_example/slot.vue
index 88f3410385..62a7890c66 100644
--- a/src/dropdown/_example/slot.vue
+++ b/src/dropdown/_example/slot.vue
@@ -1,15 +1,15 @@
 <template>
-  <div>
+  <t-space>
     <t-dropdown :min-column-width="88" trigger="click" @click="handleClick">
-      <t-button variant="text"> 下拉菜单 </t-button>
+      <t-button variant="text">下拉菜单</t-button>
       <template #dropdown>
         <t-dropdown-menu>
-          <t-dropdown-item :value="1"> 操作一 </t-dropdown-item>
-          <t-dropdown-item :value="2"> 操作二 </t-dropdown-item>
+          <t-dropdown-item :value="1">操作一</t-dropdown-item>
+          <t-dropdown-item :value="2">操作二</t-dropdown-item>
         </t-dropdown-menu>
       </template>
     </t-dropdown>
-  </div>
+  </t-space>
 </template>
 <script setup>
 const handleClick = (data, { e }) => {
diff --git a/src/dropdown/_example/split.vue b/src/dropdown/_example/split.vue
index 041b617b97..e0e0b697ea 100644
--- a/src/dropdown/_example/split.vue
+++ b/src/dropdown/_example/split.vue
@@ -5,27 +5,9 @@
 </template>
 <script setup>
 const options = [
-  {
-    content: '操作一',
-    value: 1,
-  },
-  {
-    content: '操作二',
-    value: 2,
-  },
-  {
-    content: '操作三',
-    value: 3,
-    divider: true,
-  },
-  {
-    content: '操作四',
-    value: 4,
-  },
+  { content: '操作一', value: 1 },
+  { content: '操作二', value: 2 },
+  { content: '操作三', value: 3, divider: true },
+  { content: '操作四', value: 4 },
 ];
 </script>
-<style scoped>
-.t-button {
-  margin-right: 20px;
-}
-</style>

From adb4904fcf5c048b888413b570b1a773453dd47e Mon Sep 17 00:00:00 2001
From: _lmmmmmm <lmmmmmm12138@gmail.com>
Date: Sun, 4 Sep 2022 11:00:42 +0800
Subject: [PATCH 4/6] docs(pagination): pagination demo space

---
 src/pagination/_example/base.vue        |  5 +--
 src/pagination/_example/jump.vue        |  4 +-
 src/pagination/_example/mini.vue        |  4 +-
 src/pagination/_example/more.vue        | 54 +++++++++++++++----------
 src/pagination/_example/page-num.vue    |  4 +-
 src/pagination/_example/simple-mini.vue |  5 ++-
 src/pagination/_example/simple.vue      |  5 ++-
 src/pagination/_example/total.vue       |  4 +-
 8 files changed, 49 insertions(+), 36 deletions(-)

diff --git a/src/pagination/_example/base.vue b/src/pagination/_example/base.vue
index 5b15ebe071..3fddba8e0f 100644
--- a/src/pagination/_example/base.vue
+++ b/src/pagination/_example/base.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <t-space direction="vertical" size="large">
     <t-pagination
       v-model="current"
       v-model:pageSize="pageSize"
@@ -8,7 +8,6 @@
       @page-size-change="onPageSizeChange"
       @current-change="onCurrentChange"
     />
-    <br /><br />
     <!-- :pageSizeOptions="[]" 表示隐藏分页器选项 -->
     <!-- 非受控用法，代码有效，勿删。 -->
     <t-pagination
@@ -20,7 +19,7 @@
       @page-size-change="onPageSizeChange"
       @change="onChange"
     />
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/pagination/_example/jump.vue b/src/pagination/_example/jump.vue
index f759d13e01..b026a79487 100644
--- a/src/pagination/_example/jump.vue
+++ b/src/pagination/_example/jump.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <t-space>
     <t-pagination
       v-model="current"
       v-model:pageSize="pageSize"
@@ -9,7 +9,7 @@
       @page-size-change="onPageSizeChange"
       @current-change="onCurrentChange"
     />
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/pagination/_example/mini.vue b/src/pagination/_example/mini.vue
index d0610fe391..e6bccbc790 100644
--- a/src/pagination/_example/mini.vue
+++ b/src/pagination/_example/mini.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <t-space>
     <t-pagination
       v-model:pageSize="pageSize"
       :total="100"
@@ -8,7 +8,7 @@
       @page-size-change="onPageSizeChange"
       @current-change="onCurrentChange"
     />
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/pagination/_example/more.vue b/src/pagination/_example/more.vue
index bbca91b5b9..40c92c5e0d 100644
--- a/src/pagination/_example/more.vue
+++ b/src/pagination/_example/more.vue
@@ -1,25 +1,29 @@
 <template>
-  <div class="tdesign-demo-block-row">
-    <span>展示首尾页码省略</span>
-    <t-pagination
-      v-model="current"
-      v-model:pageSize="pageSize"
-      :total="100"
-      @change="onChange"
-      @page-size-change="onPageSizeChange"
-      @current-change="onCurrentChange"
-    />
-    <span>不展示首尾页码省略</span>
-    <t-pagination
-      v-model="current"
-      v-model:pageSize="pageSize"
-      :total="100"
-      page-ellipsis-mode="both-ends"
-      @change="onChange"
-      @page-size-change="onPageSizeChange"
-      @current-change="onCurrentChange"
-    />
-  </div>
+  <t-space direction="vertical">
+    <t-space direction="vertical">
+      <span>展示首尾页码省略</span>
+      <t-pagination
+        v-model="current"
+        v-model:pageSize="pageSize"
+        :total="100"
+        @change="onChange"
+        @page-size-change="onPageSizeChange"
+        @current-change="onCurrentChange"
+      />
+    </t-space>
+    <t-space direction="vertical">
+      <span>不展示首尾页码省略</span>
+      <t-pagination
+        v-model="current"
+        v-model:pageSize="pageSize"
+        :total="100"
+        page-ellipsis-mode="both-ends"
+        @change="onChange"
+        @page-size-change="onPageSizeChange"
+        @current-change="onCurrentChange"
+      />
+    </t-space>
+  </t-space>
 </template>
 
 <script setup>
@@ -43,3 +47,11 @@ const onChange = (pageInfo) => {
   console.log(pageInfo);
 };
 </script>
+<style lang="less">
+.t-space {
+  width: 100%;
+  &-item {
+    width: 100%;
+  }
+}
+</style>
diff --git a/src/pagination/_example/page-num.vue b/src/pagination/_example/page-num.vue
index 09d8d0433d..0c02f31a7b 100644
--- a/src/pagination/_example/page-num.vue
+++ b/src/pagination/_example/page-num.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <t-space>
     <t-pagination
       v-model="current"
       v-model:pageSize="pageSize"
@@ -10,7 +10,7 @@
       @page-size-change="onPageSizeChange"
       @current-change="onCurrentChange"
     />
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/pagination/_example/simple-mini.vue b/src/pagination/_example/simple-mini.vue
index 3aec21ee5f..876f845fed 100644
--- a/src/pagination/_example/simple-mini.vue
+++ b/src/pagination/_example/simple-mini.vue
@@ -1,6 +1,7 @@
 <template>
-  <div>
+  <t-space>
     <t-pagination
+      v-model="current"
       v-model:pageSize="pageSize"
       :total="100"
       size="small"
@@ -9,7 +10,7 @@
       @page-size-change="onPageSizeChange"
       @current-change="onCurrentChange"
     />
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/pagination/_example/simple.vue b/src/pagination/_example/simple.vue
index 7c88d9a823..539ccd1ccf 100644
--- a/src/pagination/_example/simple.vue
+++ b/src/pagination/_example/simple.vue
@@ -1,6 +1,7 @@
 <template>
-  <div>
+  <t-space>
     <t-pagination
+      v-model="current"
       v-model:pageSize="pageSize"
       :total="100"
       theme="simple"
@@ -8,7 +9,7 @@
       @page-size-change="onPageSizeChange"
       @current-change="onCurrentChange"
     />
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/pagination/_example/total.vue b/src/pagination/_example/total.vue
index 7b9f839201..57c97e9e2b 100644
--- a/src/pagination/_example/total.vue
+++ b/src/pagination/_example/total.vue
@@ -1,7 +1,7 @@
 <template>
-  <div>
+  <t-space>
     <t-pagination v-model="current" v-model:page-size="pageSize" :total="total" :total-content="renderTotalContent" />
-  </div>
+  </t-space>
 </template>
 
 <script setup lang="jsx">

From ed1df3c2061c96466a53aed47d2e25b988472045 Mon Sep 17 00:00:00 2001
From: _lmmmmmm <lmmmmmm12138@gmail.com>
Date: Sun, 4 Sep 2022 11:15:22 +0800
Subject: [PATCH 5/6] docs(tabs): tabs demo space

---
 src/tabs/_example/ban.vue         | 12 +++++-----
 src/tabs/_example/base.vue        | 18 ++-------------
 src/tabs/_example/combination.vue | 12 +++++-----
 src/tabs/_example/custom.vue      | 22 ++----------------
 src/tabs/_example/drag-sort.vue   | 12 +++++-----
 src/tabs/_example/icon.vue        | 27 +++++-----------------
 src/tabs/_example/operation.vue   | 26 ++++-----------------
 src/tabs/_example/position.vue    | 38 +++++++------------------------
 src/tabs/_example/size.vue        |  8 +++----
 src/tabs/_example/theme.vue       |  8 +++----
 10 files changed, 48 insertions(+), 135 deletions(-)

diff --git a/src/tabs/_example/ban.vue b/src/tabs/_example/ban.vue
index 1a42284021..31d5c8d002 100644
--- a/src/tabs/_example/ban.vue
+++ b/src/tabs/_example/ban.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="tdesign-demo-block-column-large">
-    <div>
+  <t-space direction="vertical" size="large">
+    <t-space>
       <t-radio-group v-model="theme" variant="default-filled">
-        <t-radio-button value="normal"> 常规型 </t-radio-button>
-        <t-radio-button value="card"> 卡片型 </t-radio-button>
+        <t-radio-button value="normal">常规型</t-radio-button>
+        <t-radio-button value="card">卡片型</t-radio-button>
       </t-radio-group>
-    </div>
+    </t-space>
 
     <t-tabs :value="value" :theme="theme" @change="(newValue) => (value = newValue)">
       <t-tab-panel value="first" :label="`选项卡1`">
@@ -18,7 +18,7 @@
         <p style="padding: 25px">{{ `选项卡3的内容` }}</p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { ref } from 'vue';
diff --git a/src/tabs/_example/base.vue b/src/tabs/_example/base.vue
index eb0868e96a..04246627f4 100644
--- a/src/tabs/_example/base.vue
+++ b/src/tabs/_example/base.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="tdesign-demo-block-column-large">
+  <t-space direction="vertical" size="large">
     <t-tabs v-model="value">
       <t-tab-panel :value="1" label="选项卡1" :destroy-on-hide="false">
         <p style="padding: 25px">选项卡1的内容，使用 t-tab-panel 渲染</p>
@@ -14,7 +14,7 @@
 
     <!-- 方式二：使用 list 定义 Tab -->
     <t-tabs v-model="tab" :list="tabList" />
-  </div>
+  </t-space>
 </template>
 
 <script setup lang="jsx">
@@ -32,17 +32,3 @@ const panelRender = () => {
   return <p style="padding: 25px;">选项卡3的内容，使用 t-tab-panel 渲染</p>;
 };
 </script>
-
-<style lang="less">
-.t-demo-tabs {
-  &__desc {
-    margin-bottom: 20px;
-    color: #333;
-    font-size: 14px;
-
-    &:not(:first-of-type) {
-      margin-top: 20px;
-    }
-  }
-}
-</style>
diff --git a/src/tabs/_example/combination.vue b/src/tabs/_example/combination.vue
index e2a42d7f0a..6a2902cf77 100644
--- a/src/tabs/_example/combination.vue
+++ b/src/tabs/_example/combination.vue
@@ -1,17 +1,17 @@
 <template>
-  <div class="tdesign-demo-block-column-large" style="width: 100%">
-    <div>
+  <t-space direction="vertical" size="large">
+    <t-space>
       <t-radio-group v-model="theme" variant="default-filled">
-        <t-radio-button value="normal"> 常规型 </t-radio-button>
-        <t-radio-button value="card"> 卡片型 </t-radio-button>
+        <t-radio-button value="normal">常规型</t-radio-button>
+        <t-radio-button value="card">卡片型</t-radio-button>
       </t-radio-group>
-    </div>
+    </t-space>
     <t-tabs v-model="value" :theme="theme">
       <t-tab-panel v-for="index in 20" :key="index" :value="index + ''" :label="`选项卡${index}`">
         <p style="padding: 25px">选项卡{{ index }}</p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 
 <script setup>
diff --git a/src/tabs/_example/custom.vue b/src/tabs/_example/custom.vue
index 34c9870e58..244921bd44 100644
--- a/src/tabs/_example/custom.vue
+++ b/src/tabs/_example/custom.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="tdesign-demo-block-column-large" style="width: 100%">
+  <t-space>
     <t-tabs v-model="value" theme="card" :addable="true" @add="addTab" @remove="removeTab">
       <t-tab-panel
         v-for="data in panelData"
@@ -13,7 +13,7 @@
         </p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 
 <script setup>
@@ -56,21 +56,3 @@ const removeTab = ({ value: val, index }) => {
   }
 };
 </script>
-
-<style lang="less">
-.t-demo-tabs {
-  &__desc {
-    margin-bottom: 20px;
-    color: #333;
-    font-size: 14px;
-
-    &:not(:first-of-type) {
-      margin-top: 20px;
-    }
-
-    p {
-      margin-bottom: 20px;
-    }
-  }
-}
-</style>
diff --git a/src/tabs/_example/drag-sort.vue b/src/tabs/_example/drag-sort.vue
index 75918a4733..b7c102f4c4 100644
--- a/src/tabs/_example/drag-sort.vue
+++ b/src/tabs/_example/drag-sort.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="tdesign-demo-block-column-large">
-    <div>
+  <t-space direction="vertical" size="large">
+    <t-space>
       <t-radio-group v-model="theme" variant="default-filled">
-        <t-radio-button value="normal"> 常规型 </t-radio-button>
-        <t-radio-button value="card"> 卡片型 </t-radio-button>
+        <t-radio-button value="normal">常规型</t-radio-button>
+        <t-radio-button value="card">卡片型</t-radio-button>
       </t-radio-group>
-    </div>
+    </t-space>
 
     <t-tabs drag-sort :value="value" :theme="theme" @drag-sort="onDragend" @change="(newValue) => (value = newValue)">
       <t-tab-panel v-for="data in panelData" :key="data.value" :value="data.value" :label="data.label">
@@ -14,7 +14,7 @@
         </p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { ref, watch } from 'vue';
diff --git a/src/tabs/_example/icon.vue b/src/tabs/_example/icon.vue
index 707f78a229..82d2c17970 100644
--- a/src/tabs/_example/icon.vue
+++ b/src/tabs/_example/icon.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="t-demo-tabs">
-    <div class="t-demo-tabs__desc">
+  <t-space direction="vertical">
+    <t-space>
       <t-radio-group v-model="theme" variant="default-filled">
-        <t-radio-button value="normal"> 常规型 </t-radio-button>
-        <t-radio-button value="card"> 卡片型 </t-radio-button>
+        <t-radio-button value="normal">常规型</t-radio-button>
+        <t-radio-button value="card">卡片型</t-radio-button>
       </t-radio-group>
-    </div>
+    </t-space>
     <t-tabs :value="value" :theme="theme" @change="handlerChange">
       <t-tab-panel value="first">
         <template #label> <t-icon name="home" class="tabs-icon-margin" /> 首页 </template>
@@ -26,7 +26,7 @@
         </p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 <script setup>
 import { ref } from 'vue';
@@ -39,21 +39,6 @@ const handlerChange = (newValue) => {
 };
 </script>
 <style lang="less">
-.t-demo-tabs {
-  &__desc {
-    margin-bottom: 20px;
-    color: #333;
-    font-size: 14px;
-
-    &:not(:first-of-type) {
-      margin-top: 20px;
-    }
-
-    p {
-      margin-bottom: 20px;
-    }
-  }
-}
 .tabs-icon-margin {
   margin-right: 4px;
 }
diff --git a/src/tabs/_example/operation.vue b/src/tabs/_example/operation.vue
index b1e7742ab2..f3a5f465b5 100644
--- a/src/tabs/_example/operation.vue
+++ b/src/tabs/_example/operation.vue
@@ -1,8 +1,8 @@
 <template>
-  <div class="t-demo-tabs">
-    <div class="t-demo-tabs__desc">
+  <t-space>
+    <t-space>
       <p>可以动态增加选项卡，仅支持卡片型</p>
-    </div>
+    </t-space>
 
     <t-tabs v-model="value" theme="card" :addable="true" @add="addTab" @remove="removeTab">
       <t-tab-panel
@@ -17,7 +17,7 @@
         </p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 
 <script setup>
@@ -63,21 +63,3 @@ const removeTab = ({ value: val }) => {
   }
 };
 </script>
-
-<style lang="less">
-.t-demo-tabs {
-  &__desc {
-    margin-bottom: 20px;
-    color: #333;
-    font-size: 14px;
-
-    &:not(:first-of-type) {
-      margin-top: 20px;
-    }
-
-    p {
-      margin-bottom: 20px;
-    }
-  }
-}
-</style>
diff --git a/src/tabs/_example/position.vue b/src/tabs/_example/position.vue
index 69c55ea940..5df782806f 100644
--- a/src/tabs/_example/position.vue
+++ b/src/tabs/_example/position.vue
@@ -1,13 +1,13 @@
 <template>
-  <div class="t-demo-tabs">
-    <div class="t-demo-tabs__desc">
+  <t-space direction="vertical">
+    <t-space>
       <t-radio-group v-model="placement" variant="default-filled">
-        <t-radio-button value="top"> top </t-radio-button>
-        <t-radio-button value="right"> right </t-radio-button>
-        <t-radio-button value="bottom"> bottom </t-radio-button>
-        <t-radio-button value="left"> left </t-radio-button>
+        <t-radio-button value="top">top</t-radio-button>
+        <t-radio-button value="right">right</t-radio-button>
+        <t-radio-button value="bottom">bottom</t-radio-button>
+        <t-radio-button value="left">left</t-radio-button>
       </t-radio-group>
-    </div>
+    </t-space>
     <t-tabs :value="value" :placement="placement" @change="handlerChange">
       <t-tab-panel value="first" label="选项卡1">
         <p style="padding: 25px">选项卡1</p>
@@ -19,7 +19,7 @@
         <p style="padding: 25px">选项卡3</p>
       </t-tab-panel>
     </t-tabs>
-  </div>
+  </t-space>
 </template>
 
 <script setup>
@@ -32,25 +32,3 @@ const handlerChange = (newValue) => {
   value.value = newValue;
 };
 </script>
-
-<style lang="less">
-.t-demo-tabs {
-  &__desc {
-    margin-bottom: 20px;
-    color: #333;
-    font-size: 14px;
-
-    &:not(:first-of-type) {
-      margin-top: 20px;
-    }
-
-    p {
-      margin-bottom: 20px;
-    }
-  }
-
-  &__btn {
-    margin-right: 20px;
-  }
-}
-</style>
diff --git a/src/tabs/_example/size.vue b/src/tabs/_example/size.vue
index 3d9ddb6a9f..b280ecbdac 100644
--- a/src/tabs/_example/size.vue
+++ b/src/tabs/_example/size.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="tdesign-demo-block-column-large">
-    <div class="tdesign-demo-block-column">
+  <t-space>
+    <t-space direction="vertical">
       <t-tabs :value="value1" size="medium" @change="(newValue) => (value1 = newValue)">
         <t-tab-panel value="first" label="选项卡1">
           <p style="padding: 25px">选项卡1</p>
@@ -24,8 +24,8 @@
           <p style="padding: 25px">选项卡3</p>
         </t-tab-panel>
       </t-tabs>
-    </div>
-  </div>
+    </t-space>
+  </t-space>
 </template>
 <script setup>
 import { ref } from 'vue';
diff --git a/src/tabs/_example/theme.vue b/src/tabs/_example/theme.vue
index 29d470c4b3..9ee5b7e9bf 100644
--- a/src/tabs/_example/theme.vue
+++ b/src/tabs/_example/theme.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="tdesign-demo-block-column-large">
-    <div class="tdesign-demo-block-column">
+  <t-space>
+    <t-space direction="vertical">
       <t-tabs v-model="value1">
         <t-tab-panel value="first" label="选项卡1">
           <p style="padding: 25px">选项卡1</p>
@@ -24,8 +24,8 @@
           <p style="padding: 25px">选项卡3</p>
         </t-tab-panel>
       </t-tabs>
-    </div>
-  </div>
+    </t-space>
+  </t-space>
 </template>
 
 <script setup>

From 0555d6ed43dbfe864f20a72b2816794f3795f105 Mon Sep 17 00:00:00 2001
From: _lmmmmmm <lmmmmmm12138@gmail.com>
Date: Sun, 4 Sep 2022 11:49:08 +0800
Subject: [PATCH 6/6] test: snap update

---
 .../__snapshots__/index.test.jsx.snap         |  567 +-
 test/snap/__snapshots__/csr.test.js.snap      | 7820 +++++++++--------
 test/snap/__snapshots__/ssr.test.js.snap      |   68 +-
 3 files changed, 4297 insertions(+), 4158 deletions(-)

diff --git a/src/jumper/__tests__/__snapshots__/index.test.jsx.snap b/src/jumper/__tests__/__snapshots__/index.test.jsx.snap
index d3e6e8ffb3..8c7abe9999 100644
--- a/src/jumper/__tests__/__snapshots__/index.test.jsx.snap
+++ b/src/jumper/__tests__/__snapshots__/index.test.jsx.snap
@@ -1,78 +1,5 @@
 // Vitest Snapshot v1
 
-exports[`Jumper > :props > :disabled 1`] = `
-<div
-  class="t-jumper"
->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-is-disabled t-button--shape-square t-button--icon-only t-jumper__prev"
-    disabled=""
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-is-disabled t-button--shape-square t-button--icon-only t-jumper__current"
-    disabled=""
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-is-disabled t-button--shape-square t-button--icon-only t-jumper__next"
-    disabled=""
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
 exports[`Jumper > :props > :disabled, default 1`] = `
 <div
   class="t-jumper"
@@ -569,7 +496,7 @@ exports[`Jumper > :props > :layout:vertical 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :showCurrent 1`] = `
+exports[`Jumper > :props > :showCurrent:false 1`] = `
 <div
   class="t-jumper"
 >
@@ -594,27 +521,7 @@ exports[`Jumper > :props > :showCurrent 1`] = `
     
     
   </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
+  <!---->
   <button
     class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
     type="button"
@@ -639,7 +546,7 @@ exports[`Jumper > :props > :showCurrent 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :showCurrent, default 1`] = `
+exports[`Jumper > :props > :showCurrent:true, default 1`] = `
 <div
   class="t-jumper"
 >
@@ -709,12 +616,12 @@ exports[`Jumper > :props > :showCurrent, default 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :showCurrent, false 1`] = `
+exports[`Jumper > :props > :size:large 1`] = `
 <div
   class="t-jumper"
 >
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
+    class="t-button t-size-l t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
     type="button"
   >
     
@@ -734,49 +641,20 @@ exports[`Jumper > :props > :showCurrent, false 1`] = `
     
     
   </button>
-  <!---->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
-exports[`Jumper > :props > :showCurrent, with false 1`] = `
-<div
-  class="t-jumper"
->
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
+    class="t-button t-size-l t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
     type="button"
   >
     
     <svg
-      class="t-icon t-icon-chevron-left"
+      class="t-icon t-icon-round"
       fill="none"
       height="1em"
       viewBox="0 0 16 16"
       width="1em"
     >
       <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
         fill="currentColor"
         fill-opacity="0.9"
       />
@@ -784,9 +662,8 @@ exports[`Jumper > :props > :showCurrent, with false 1`] = `
     
     
   </button>
-  <!---->
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
+    class="t-button t-size-l t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
     type="button"
   >
     
@@ -809,7 +686,7 @@ exports[`Jumper > :props > :showCurrent, with false 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :showCurrent:default 1`] = `
+exports[`Jumper > :props > :size:medium, default 1`] = `
 <div
   class="t-jumper"
 >
@@ -879,62 +756,12 @@ exports[`Jumper > :props > :showCurrent:default 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :showCurrent:false 1`] = `
-<div
-  class="t-jumper"
->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <!---->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
-exports[`Jumper > :props > :showCurrent:true, default 1`] = `
+exports[`Jumper > :props > :size:small 1`] = `
 <div
   class="t-jumper"
 >
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
+    class="t-button t-size-s t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
     type="button"
   >
     
@@ -955,7 +782,7 @@ exports[`Jumper > :props > :showCurrent:true, default 1`] = `
     
   </button>
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
+    class="t-button t-size-s t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
     type="button"
   >
     
@@ -976,7 +803,7 @@ exports[`Jumper > :props > :showCurrent:true, default 1`] = `
     
   </button>
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
+    class="t-button t-size-s t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
     type="button"
   >
     
@@ -999,12 +826,12 @@ exports[`Jumper > :props > :showCurrent:true, default 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :size:large 1`] = `
+exports[`Jumper > :props > :variant, default 1`] = `
 <div
   class="t-jumper"
 >
   <button
-    class="t-button t-size-l t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
+    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
     type="button"
   >
     
@@ -1025,7 +852,7 @@ exports[`Jumper > :props > :size:large 1`] = `
     
   </button>
   <button
-    class="t-button t-size-l t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
+    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
     type="button"
   >
     
@@ -1046,7 +873,7 @@ exports[`Jumper > :props > :size:large 1`] = `
     
   </button>
   <button
-    class="t-button t-size-l t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
+    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
     type="button"
   >
     
@@ -1069,12 +896,12 @@ exports[`Jumper > :props > :size:large 1`] = `
 </div>
 `;
 
-exports[`Jumper > :props > :size:medium 1`] = `
+exports[`Jumper > :props > :variant:outline 1`] = `
 <div
-  class="t-jumper"
+  class="t-jumper t-jumper--outline"
 >
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
+    class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
     type="button"
   >
     
@@ -1095,287 +922,7 @@ exports[`Jumper > :props > :size:medium 1`] = `
     
   </button>
   <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
-exports[`Jumper > :props > :size:medium, default 1`] = `
-<div
-  class="t-jumper"
->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
-exports[`Jumper > :props > :size:small 1`] = `
-<div
-  class="t-jumper"
->
-  <button
-    class="t-button t-size-s t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-s t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-s t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
-exports[`Jumper > :props > :variant, default 1`] = `
-<div
-  class="t-jumper"
->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
-
-exports[`Jumper > :props > :variant:outline 1`] = `
-<div
-  class="t-jumper t-jumper--outline"
->
-  <button
-    class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
+    class="t-button t-size-m t-button--variant-outline t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
     type="button"
   >
     
@@ -1418,73 +965,3 @@ exports[`Jumper > :props > :variant:outline 1`] = `
   </button>
 </div>
 `;
-
-exports[`Jumper > :props > :variant:text, default 1`] = `
-<div
-  class="t-jumper"
->
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__prev"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-left"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__current"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-round"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M8 11.5a3.5 3.5 0 110-7 3.5 3.5 0 010 7zM8 13A5 5 0 108 3a5 5 0 000 10z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default t-button--shape-square t-button--icon-only t-jumper__next"
-    type="button"
-  >
-    
-    <svg
-      class="t-icon t-icon-chevron-right"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
-    >
-      <path
-        d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    
-    
-  </button>
-</div>
-`;
diff --git a/test/snap/__snapshots__/csr.test.js.snap b/test/snap/__snapshots__/csr.test.js.snap
index 8d0e18d4b8..7fdfaf8169 100644
--- a/test/snap/__snapshots__/csr.test.js.snap
+++ b/test/snap/__snapshots__/csr.test.js.snap
@@ -2,26 +2,36 @@
 
 exports[`csr snapshot test > csr test ./src/affix/_example/base.vue 1`] = `
 <div
-  class="affix-base"
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
-  <div>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div>
-      
-      <button
-        class="t-button t-size-m t-button--variant-base t-button--theme-primary"
-        type="button"
-      >
-        <span
-          class="t-button__text"
+      <div>
+        
+        <button
+          class="t-button t-size-m t-button--variant-base t-button--theme-primary"
+          type="button"
         >
-          
-          固钉
-          
-        </span>
-      </button>
-      
+          <span
+            class="t-button__text"
+          >
+            
+            固钉
+            
+          </span>
+        </button>
+        
+      </div>
     </div>
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
@@ -1049,360 +1059,162 @@ exports[`csr snapshot test > csr test ./src/anchor/_example/container.vue 1`] =
     
   </div>
   <div
+    class="t-space t-space-vertical"
     data-v-5085b42e=""
     id="anchor-container"
+    style="gap: 0px;"
   >
+    
+    
     <div
-      class="anchor-content-1"
-      data-v-5085b42e=""
-      id="#content-1"
-    >
-      anchor-content-1
-    </div>
-    <div
-      class="anchor-content-2"
-      data-v-5085b42e=""
-      id="#content-2"
-    >
-      anchor-content-2
-    </div>
-    <div
-      class="anchor-content-3"
-      data-v-5085b42e=""
-      id="#content-3"
-    >
-      anchor-content-3
-    </div>
-    <div
-      class="anchor-content-4"
-      data-v-5085b42e=""
-      id="#content-4"
-    >
-      anchor-content-4
-    </div>
-    <div
-      class="anchor-content-5"
-      data-v-5085b42e=""
-      id="#content-5"
-    >
-      anchor-content-5
-    </div>
-  </div>
-</div>
-`;
-
-exports[`csr snapshot test > csr test ./src/anchor/_example/cursor.vue 1`] = `
-<div
-  class="anchor-demo"
-  data-v-0c89850e=""
->
-  <div
-    class="t-anchor t-size-m"
-    data-v-0c89850e=""
-  >
-    <div
-      class="t-anchor__line"
+      class="t-space-item"
     >
       <div
-        class="t-anchor__line-cursor-wrapper"
+        class="anchor-content-1"
+        data-v-5085b42e=""
+        id="#content-1"
       >
-        
-        <div
-          class="test-cursor"
-          data-v-0c89850e=""
-        />
-        
+        anchor-content-1
       </div>
     </div>
+    <!---->
     
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##default"
-        target="_self"
-        title="定义"
-      >
-        定义
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##multiple"
-        target="_self"
-        title="服务功能"
-      >
-        服务功能
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##small"
-        target="_self"
-        title="使用指南"
-      >
-        使用指南
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##large"
-        target="_self"
-        title="创建签名"
-      >
-        创建签名
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##container"
-        target="_self"
-        title="创建内容"
-      >
-        创建内容
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-6"
-        target="_self"
-        title="保密协议"
-      >
-        保密协议
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-0c89850e=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-7"
-        target="_self"
-        title="其他"
-      >
-        其他
-      </a>
-      <!---->
-    </div>
     
-  </div>
-</div>
-`;
-
-exports[`csr snapshot test > csr test ./src/anchor/_example/large.vue 1`] = `
-<div
-  class="anchor-demo"
-  data-v-4dca4868=""
-  id="#large"
->
-  <div
-    class="t-anchor t-size-l"
-    data-v-4dca4868=""
-  >
     <div
-      class="t-anchor__line"
+      class="t-space-item"
     >
       <div
-        class="t-anchor__line-cursor-wrapper"
+        class="anchor-content-2"
+        data-v-5085b42e=""
+        id="#content-2"
       >
-        <div
-          class="t-anchor__line-cursor"
-        />
+        anchor-content-2
       </div>
     </div>
+    <!---->
+    
     
     <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##default"
-        target="_self"
-        title="定义"
-      >
-        定义
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##multiple"
-        target="_self"
-        title="服务功能"
-      >
-        服务功能
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##small"
-        target="_self"
-        title="使用指南"
-      >
-        使用指南
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##large"
-        target="_self"
-        title="创建签名"
-      >
-        创建签名
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
+      class="t-space-item"
     >
-      <a
-        class="t-anchor__item-link"
-        href="##container"
-        target="_self"
-        title="创建内容"
+      <div
+        class="anchor-content-3"
+        data-v-5085b42e=""
+        id="#content-3"
       >
-        创建内容
-      </a>
-      <!---->
+        anchor-content-3
+      </div>
     </div>
+    <!---->
+    
+    
     <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
+      class="t-space-item"
     >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-6"
-        target="_self"
-        title="保密协议"
+      <div
+        class="anchor-content-4"
+        data-v-5085b42e=""
+        id="#content-4"
       >
-        保密协议
-      </a>
-      <!---->
+        anchor-content-4
+      </div>
     </div>
+    <!---->
+    
+    
     <div
-      class="t-anchor__item"
-      data-v-4dca4868=""
+      class="t-space-item"
     >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-7"
-        target="_self"
-        title="其他"
+      <div
+        class="anchor-content-5"
+        data-v-5085b42e=""
+        id="#content-5"
       >
-        其他
-      </a>
-      <!---->
+        anchor-content-5
+      </div>
     </div>
+    <!---->
+    
     
   </div>
 </div>
 `;
 
-exports[`csr snapshot test > csr test ./src/anchor/_example/multiple.vue 1`] = `
+exports[`csr snapshot test > csr test ./src/anchor/_example/cursor.vue 1`] = `
 <div
-  class="anchor-demo"
-  id="#multiple"
+  class="t-space t-space-horizontal anchor-demo"
+  data-v-0c89850e=""
+  style="gap: 16px;"
 >
+  
+  
   <div
-    class="t-anchor t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-anchor__line"
+      class="t-anchor t-size-m"
+      data-v-0c89850e=""
     >
       <div
-        class="t-anchor__line-cursor-wrapper"
+        class="t-anchor__line"
       >
         <div
-          class="t-anchor__line-cursor"
-        />
+          class="t-anchor__line-cursor-wrapper"
+        >
+          
+          <div
+            class="test-cursor"
+            data-v-0c89850e=""
+          />
+          
+        </div>
       </div>
-    </div>
-    
-    <div
-      class="t-anchor__item"
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##default"
-        target="_self"
-        title="定义"
+      
+      <div
+        class="t-anchor__item"
+        data-v-0c89850e=""
       >
-        定义
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##multiple"
-        target="_self"
-        title="服务功能"
+        <a
+          class="t-anchor__item-link"
+          href="##default"
+          target="_self"
+          title="定义"
+        >
+          定义
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-0c89850e=""
       >
-        服务功能
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##small"
-        target="_self"
-        title="使用指南"
+        <a
+          class="t-anchor__item-link"
+          href="##multiple"
+          target="_self"
+          title="服务功能"
+        >
+          服务功能
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-0c89850e=""
       >
-        使用指南
-      </a>
-      
+        <a
+          class="t-anchor__item-link"
+          href="##small"
+          target="_self"
+          title="使用指南"
+        >
+          使用指南
+        </a>
+        <!---->
+      </div>
       <div
         class="t-anchor__item"
+        data-v-0c89850e=""
       >
         <a
           class="t-anchor__item-link"
@@ -1416,6 +1228,7 @@ exports[`csr snapshot test > csr test ./src/anchor/_example/multiple.vue 1`] = `
       </div>
       <div
         class="t-anchor__item"
+        data-v-0c89850e=""
       >
         <a
           class="t-anchor__item-link"
@@ -1427,372 +1240,700 @@ exports[`csr snapshot test > csr test ./src/anchor/_example/multiple.vue 1`] = `
         </a>
         <!---->
       </div>
+      <div
+        class="t-anchor__item"
+        data-v-0c89850e=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-6"
+          target="_self"
+          title="保密协议"
+        >
+          保密协议
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-0c89850e=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-7"
+          target="_self"
+          title="其他"
+        >
+          其他
+        </a>
+        <!---->
+      </div>
       
     </div>
+  </div>
+  <!---->
+  
+  
+</div>
+`;
+
+exports[`csr snapshot test > csr test ./src/anchor/_example/large.vue 1`] = `
+<div
+  class="t-space t-space-horizontal anchor-demo"
+  data-v-4dca4868=""
+  id="#large"
+  style="gap: 16px;"
+>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div
-      class="t-anchor__item"
+      class="t-anchor t-size-l"
+      data-v-4dca4868=""
     >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-6"
-        target="_self"
-        title="保密协议"
+      <div
+        class="t-anchor__line"
       >
-        保密协议
-      </a>
-      <!---->
+        <div
+          class="t-anchor__line-cursor-wrapper"
+        >
+          <div
+            class="t-anchor__line-cursor"
+          />
+        </div>
+      </div>
+      
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##default"
+          target="_self"
+          title="定义"
+        >
+          定义
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##multiple"
+          target="_self"
+          title="服务功能"
+        >
+          服务功能
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##small"
+          target="_self"
+          title="使用指南"
+        >
+          使用指南
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##large"
+          target="_self"
+          title="创建签名"
+        >
+          创建签名
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##container"
+          target="_self"
+          title="创建内容"
+        >
+          创建内容
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-6"
+          target="_self"
+          title="保密协议"
+        >
+          保密协议
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-4dca4868=""
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-7"
+          target="_self"
+          title="其他"
+        >
+          其他
+        </a>
+        <!---->
+      </div>
+      
     </div>
+  </div>
+  <!---->
+  
+  
+</div>
+`;
+
+exports[`csr snapshot test > csr test ./src/anchor/_example/multiple.vue 1`] = `
+<div
+  class="t-space t-space-horizontal anchor-demo"
+  id="#multiple"
+  style="gap: 16px;"
+>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div
-      class="t-anchor__item"
+      class="t-anchor t-size-m"
     >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-7"
-        target="_self"
-        title="其他"
+      <div
+        class="t-anchor__line"
       >
-        其他
-      </a>
-      <!---->
+        <div
+          class="t-anchor__line-cursor-wrapper"
+        >
+          <div
+            class="t-anchor__line-cursor"
+          />
+        </div>
+      </div>
+      
+      <div
+        class="t-anchor__item"
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##default"
+          target="_self"
+          title="定义"
+        >
+          定义
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##multiple"
+          target="_self"
+          title="服务功能"
+        >
+          服务功能
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##small"
+          target="_self"
+          title="使用指南"
+        >
+          使用指南
+        </a>
+        
+        <div
+          class="t-anchor__item"
+        >
+          <a
+            class="t-anchor__item-link"
+            href="##large"
+            target="_self"
+            title="创建签名"
+          >
+            创建签名
+          </a>
+          <!---->
+        </div>
+        <div
+          class="t-anchor__item"
+        >
+          <a
+            class="t-anchor__item-link"
+            href="##container"
+            target="_self"
+            title="创建内容"
+          >
+            创建内容
+          </a>
+          <!---->
+        </div>
+        
+      </div>
+      <div
+        class="t-anchor__item"
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-6"
+          target="_self"
+          title="保密协议"
+        >
+          保密协议
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+      >
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-7"
+          target="_self"
+          title="其他"
+        >
+          其他
+        </a>
+        <!---->
+      </div>
+      
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/anchor/_example/small.vue 1`] = `
 <div
-  class="anchor-demo"
+  class="t-space t-space-horizontal anchor-demo"
   data-v-804f4798=""
   id="#small"
+  style="gap: 16px;"
 >
+  
+  
   <div
-    class="t-anchor t-size-s"
-    data-v-804f4798=""
+    class="t-space-item"
   >
     <div
-      class="t-anchor__line"
+      class="t-anchor t-size-s"
+      data-v-804f4798=""
     >
       <div
-        class="t-anchor__line-cursor-wrapper"
+        class="t-anchor__line"
       >
         <div
-          class="t-anchor__line-cursor"
-        />
+          class="t-anchor__line-cursor-wrapper"
+        >
+          <div
+            class="t-anchor__line-cursor"
+          />
+        </div>
       </div>
-    </div>
-    
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##default"
-        target="_self"
-        title="定义"
+      
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        定义
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##multiple"
-        target="_self"
-        title="服务功能"
+        <a
+          class="t-anchor__item-link"
+          href="##default"
+          target="_self"
+          title="定义"
+        >
+          定义
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        服务功能
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##small"
-        target="_self"
-        title="使用指南"
+        <a
+          class="t-anchor__item-link"
+          href="##multiple"
+          target="_self"
+          title="服务功能"
+        >
+          服务功能
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        使用指南
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##large"
-        target="_self"
-        title="创建签名"
+        <a
+          class="t-anchor__item-link"
+          href="##small"
+          target="_self"
+          title="使用指南"
+        >
+          使用指南
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        创建签名
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##container"
-        target="_self"
-        title="创建内容"
+        <a
+          class="t-anchor__item-link"
+          href="##large"
+          target="_self"
+          title="创建签名"
+        >
+          创建签名
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        创建内容
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-6"
-        target="_self"
-        title="保密协议"
+        <a
+          class="t-anchor__item-link"
+          href="##container"
+          target="_self"
+          title="创建内容"
+        >
+          创建内容
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        保密协议
-      </a>
-      <!---->
-    </div>
-    <div
-      class="t-anchor__item"
-      data-v-804f4798=""
-    >
-      <a
-        class="t-anchor__item-link"
-        href="##anchor-target-7"
-        target="_self"
-        title="其他"
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-6"
+          target="_self"
+          title="保密协议"
+        >
+          保密协议
+        </a>
+        <!---->
+      </div>
+      <div
+        class="t-anchor__item"
+        data-v-804f4798=""
       >
-        其他
-      </a>
-      <!---->
+        <a
+          class="t-anchor__item-link"
+          href="##anchor-target-7"
+          target="_self"
+          title="其他"
+        >
+          其他
+        </a>
+        <!---->
+      </div>
+      
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/anchor/_example/target.vue 1`] = `
 <div
-  class="anchor-demo"
+  class="t-space t-space-vertical anchor-demo"
   id="#anchor-target"
+  style="gap: 0px;"
 >
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-1"
+    class="t-space-item"
   >
-    
-     定义 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-1"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       定义 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-2"
+    class="t-space-item"
   >
-    
-     服务功能 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-2"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       服务功能 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-3"
+    class="t-space-item"
   >
-    
-     使用指南 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-3"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       使用指南 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-4"
+    class="t-space-item"
   >
-    
-     创建签名 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-4"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       创建签名 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-5"
+    class="t-space-item"
   >
-    
-     创建内容 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-5"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       创建内容 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-6"
+    class="t-space-item"
   >
-    
-     保密协议 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-6"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       保密协议 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-anchor__target"
-    id="#anchor-target-7"
+    class="t-space-item"
   >
-    
-     其他 
-    
-    
-    <svg
-      class="t-icon t-icon-file-copy t-copy"
-      fill="none"
-      height="1em"
-      viewBox="0 0 16 16"
-      width="1em"
+    <div
+      class="t-anchor__target"
+      id="#anchor-target-7"
     >
-      <path
-        d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-      <path
-        d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
-        fill="currentColor"
-        fill-opacity="0.9"
-      />
-    </svg>
-    <!---->
-    
+      
+       其他 
+      
+      
+      <svg
+        class="t-icon t-icon-file-copy t-copy"
+        fill="none"
+        height="1em"
+        viewBox="0 0 16 16"
+        width="1em"
+      >
+        <path
+          d="M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+        <path
+          d="M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z"
+          fill="currentColor"
+          fill-opacity="0.9"
+        />
+      </svg>
+      <!---->
+      
+    </div>
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
@@ -49867,241 +50008,371 @@ exports[`csr snapshot test > csr test ./src/drawer/_example/size-draggable.vue 1
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/base.vue 1`] = `
 <div
-  class="tdesign-demo-dropdown"
-  data-v-31515850=""
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
   
+  
   <div
-    class="tdesign-demo-dropdown-trigger"
-    data-v-31515850=""
+    class="t-space-item"
   >
-    <button
-      class="t-button t-size-m t-button--variant-text t-button--theme-default"
-      data-v-31515850=""
-      type="button"
+    
+    <div
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
     >
-      <span
-        class="t-button__text"
+      
+      
+      <div
+        class="t-space-item"
       >
-        
-        <span
-          class="tdesign-demo-dropdown__text"
-          data-v-31515850=""
+        <button
+          class="t-button t-size-m t-button--variant-text t-button--theme-default"
+          type="button"
         >
-           下拉菜单 
-          <svg
-            class="t-icon t-icon-chevron-down"
-            data-v-31515850=""
+          <span
+            class="t-button__text"
           >
-            <use
-              href="#t-icon-chevron-down"
-            />
-          </svg>
-        </span>
-        
-      </span>
-    </button>
+            
+            <div
+              class="t-space t-space-horizontal"
+              style="gap: 0px;"
+            >
+              
+              
+              <div
+                class="t-space-item"
+              >
+                 下拉菜单 
+              </div>
+              <!---->
+              
+              
+              <div
+                class="t-space-item"
+              >
+                <svg
+                  class="t-icon t-icon-chevron-down"
+                >
+                  <use
+                    href="#t-icon-chevron-down"
+                  />
+                </svg>
+              </div>
+              <!---->
+              
+              
+            </div>
+            
+          </span>
+        </button>
+      </div>
+      <!---->
+      
+      
+    </div>
+    <!---->
+    
   </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/button.vue 1`] = `
 <div
-  data-v-b123bb1e=""
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
   
-  <button
-    class="t-button t-size-m t-button--variant-outline t-button--theme-default"
-    data-v-b123bb1e=""
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-outline t-button--theme-default"
+      type="button"
     >
-      
-       下拉菜单 
-      
-    </span>
-  </button>
+      <span
+        class="t-button__text"
+      >
+        
+        下拉菜单
+        
+      </span>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/custom.vue 1`] = `
 <div
-  data-v-33c84f30=""
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
   
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default"
-    data-v-33c84f30=""
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-text t-button--theme-default"
+      type="button"
     >
-      
-       下拉菜单 
-      
-    </span>
-  </button>
+      <span
+        class="t-button__text"
+      >
+        
+        下拉菜单
+        
+      </span>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/disabled.vue 1`] = `
 <div
-  class="tdesign-demo-dropdown"
-  data-v-503db2fb=""
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
   
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default"
-    data-v-503db2fb=""
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-text t-button--theme-default"
+      type="button"
     >
-      
       <span
-        class="tdesign-demo-dropdown__text"
-        data-v-503db2fb=""
+        class="t-button__text"
       >
-         下拉菜单 
-        <svg
-          class="t-icon t-icon-chevron-down"
-          data-v-503db2fb=""
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+        
+        <div
+          class="t-space t-space-horizontal"
+          style="gap: 0px;"
         >
-          <path
-            d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          
+          
+          <div
+            class="t-space-item"
+          >
+             下拉菜单 
+          </div>
+          <!---->
+          
+          
+          <div
+            class="t-space-item"
+          >
+            <svg
+              class="t-icon t-icon-chevron-down"
+              fill="none"
+              height="1em"
+              viewBox="0 0 16 16"
+              width="1em"
+            >
+              <path
+                d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z"
+                fill="currentColor"
+                fill-opacity="0.9"
+              />
+            </svg>
+          </div>
+          <!---->
+          
+          
+        </div>
+        
       </span>
-      
-    </span>
-  </button>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/event.vue 1`] = `
 <div
-  data-v-699dc5ab=""
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
   
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default"
-    data-v-699dc5ab=""
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-text t-button--theme-default"
+      type="button"
     >
-      
-       下拉菜单 
-      
-    </span>
-  </button>
+      <span
+        class="t-button__text"
+      >
+        
+        下拉菜单
+        
+      </span>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/long.vue 1`] = `
 <div
-  data-v-1c484a7b=""
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
   
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default"
-    data-v-1c484a7b=""
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-text t-button--theme-default"
+      type="button"
     >
-      
-       下拉菜单 
-      
-    </span>
-  </button>
+      <span
+        class="t-button__text"
+      >
+        
+        下拉菜单
+        
+      </span>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/multiple.vue 1`] = `
 <div
-  class="tdesign-demo-dropdown"
+  class="t-space t-space-horizontal tdesign-demo-dropdown"
   data-v-cbef96e2=""
+  style="gap: 16px;"
 >
   
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default"
-    data-v-cbef96e2=""
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-text t-button--theme-default"
+      data-v-cbef96e2=""
+      type="button"
     >
-      
       <span
-        class="tdesign-demo-dropdown__text"
-        data-v-cbef96e2=""
+        class="t-button__text"
       >
-         下拉菜单 
-        <svg
-          class="t-icon t-icon-chevron-down"
+        
+        <div
+          class="t-space t-space-horizontal tdesign-demo-dropdown__text"
           data-v-cbef96e2=""
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
+          style="gap: 0px;"
         >
-          <path
-            d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
+          
+          
+          <div
+            class="t-space-item"
+          >
+             下拉菜单 
+          </div>
+          <!---->
+          
+          
+          <div
+            class="t-space-item"
+          >
+            <svg
+              class="t-icon t-icon-chevron-down"
+              data-v-cbef96e2=""
+              fill="none"
+              height="1em"
+              viewBox="0 0 16 16"
+              width="1em"
+            >
+              <path
+                d="M3.54 6.46l.92-.92L8 9.08l3.54-3.54.92.92L8 10.92 3.54 6.46z"
+                fill="currentColor"
+                fill-opacity="0.9"
+              />
+            </svg>
+          </div>
+          <!---->
+          
+          
+        </div>
+        
       </span>
-      
-    </span>
-  </button>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/dropdown/_example/slot.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
   
-  <button
-    class="t-button t-size-m t-button--variant-text t-button--theme-default"
-    type="button"
+  
+  <div
+    class="t-space-item"
   >
-    <span
-      class="t-button__text"
+    
+    <button
+      class="t-button t-size-m t-button--variant-text t-button--theme-default"
+      type="button"
     >
-      
-       下拉菜单 
-      
-    </span>
-  </button>
+      <span
+        class="t-button__text"
+      >
+        
+        下拉菜单
+        
+      </span>
+    </button>
+    <!---->
+    
+  </div>
   <!---->
   
+  
 </div>
 `;
 
@@ -50112,7 +50383,6 @@ exports[`csr snapshot test > csr test ./src/dropdown/_example/split.vue 1`] = `
   
   <button
     class="t-button t-size-m t-button--variant-outline t-button--theme-default"
-    data-v-7fd82e2b=""
     type="button"
   >
     <span
@@ -75340,1707 +75610,1853 @@ exports[`csr snapshot test > csr test ./src/notification/_example/type4Fn.vue 1`
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/base.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-vertical"
+  style="gap: 24px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
+      class="t-pagination t-size-m"
     >
-      共 100 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
-    >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
       >
+        共 100 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
+      >
+        
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              5 条/页
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            5 条/页
-          </span>
           <!---->
-          <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
-        <!---->
-      </div>
-      <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
-      disabled="true"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <li
-        class="t-pagination__number t-is-current"
-      >
-        1
-      </li>
-      <!---->
-      
-      <li
-        class="t-pagination__number"
-      >
-        2
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        3
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        4
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        5
-      </li>
-      
-      <li
-        class="t-pagination__number t-pagination__number--more"
+        <!---->
+        
+      </div>
+      <!---->
+      <div
+        class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
+        disabled="true"
       >
         <svg
-          class="t-icon t-icon-ellipsis"
+          class="t-icon t-icon-chevron-left"
           fill="none"
           height="1em"
           viewBox="0 0 16 16"
           width="1em"
         >
           <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
             fill="currentColor"
             fill-opacity="0.9"
           />
         </svg>
-      </li>
-      <li
-        class="t-pagination__number"
+      </div>
+      <ul
+        class="t-pagination__pager"
       >
-        20
-      </li>
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+        <li
+          class="t-pagination__number t-is-current"
+        >
+          1
+        </li>
+        <!---->
+        
+        <li
+          class="t-pagination__number"
+        >
+          2
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          3
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          4
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          5
+        </li>
+        
+        <li
+          class="t-pagination__number t-pagination__number--more"
+        >
+          <svg
+            class="t-icon t-icon-ellipsis"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          20
+        </li>
+      </ul>
+      <!---->
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+        <svg
+          class="t-icon t-icon-chevron-right"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <!---->
+      <!---->
     </div>
-    <!---->
-    <!---->
   </div>
-  <br />
-  <br />
-  <!-- :pageSizeOptions="[]" 表示隐藏分页器选项 -->
-  <!-- 非受控用法，代码有效，勿删。 -->
+  <!---->
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 36 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-m"
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
+      >
+        共 36 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
       >
+        
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              10 条/页
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            10 条/页
-          </span>
-          <!---->
           <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
         <!---->
+        
       </div>
-      <!---->
-      
-    </div>
-    <div
-      class="t-pagination__btn t-pagination__btn-prev"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-page-first"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M12.4 4.46l-.91-.92L7.03 8l4.46 4.46.92-.92L8.86 8l3.55-3.54zM4.8 4v8h1.3V4H4.8z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <div
-      class="t-pagination__btn t-pagination__btn-prev"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <!---->
-      <!---->
-      
-      <li
-        class="t-pagination__number"
-      >
-        1
-      </li>
-      <li
-        class="t-pagination__number t-is-current"
+      <div
+        class="t-pagination__btn t-pagination__btn-prev"
+        disabled="false"
       >
-        2
-      </li>
-      <li
-        class="t-pagination__number"
+        <svg
+          class="t-icon t-icon-page-first"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M12.4 4.46l-.91-.92L7.03 8l4.46 4.46.92-.92L8.86 8l3.55-3.54zM4.8 4v8h1.3V4H4.8z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <div
+        class="t-pagination__btn t-pagination__btn-prev"
+        disabled="false"
       >
-        3
-      </li>
-      <li
-        class="t-pagination__number"
+        <svg
+          class="t-icon t-icon-chevron-left"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <ul
+        class="t-pagination__pager"
       >
-        4
-      </li>
-      
-      <!---->
+        <!---->
+        <!---->
+        
+        <li
+          class="t-pagination__number"
+        >
+          1
+        </li>
+        <li
+          class="t-pagination__number t-is-current"
+        >
+          2
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          3
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          4
+        </li>
+        
+        <!---->
+        <!---->
+      </ul>
       <!---->
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-page-last"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+        <svg
+          class="t-icon t-icon-chevron-right"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
-        <path
-          d="M3.6 11.54l.91.92L8.97 8 4.51 3.54l-.92.92L7.14 8l-3.55 3.54zm7.6.46V4H9.9v8h1.3z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+        <svg
+          class="t-icon t-icon-page-last"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M3.6 11.54l.91.92L8.97 8 4.51 3.54l-.92.92L7.14 8l-3.55 3.54zm7.6.46V4H9.9v8h1.3z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <!---->
     </div>
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/jump.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 101 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-m"
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
       >
+        共 101 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
+      >
+        
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              20 条/页
+            </span>
             <!---->
             <!---->
-            
-          </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            20 条/页
-          </span>
-          <!---->
-          <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
+            <span
+              class="t-input__suffix t-input__suffix-icon"
             >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
-        </div>
-        <!---->
-      </div>
-      <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
-      disabled="true"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <!---->
-      <!---->
-      
-      <li
-        class="t-pagination__number t-is-current"
-      >
-        1
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        2
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        3
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        4
-      </li>
-      <li
-        class="t-pagination__number"
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
+          </div>
+          <!---->
+        </div>
+        <!---->
+        
+      </div>
+      <!---->
+      <div
+        class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
+        disabled="true"
       >
-        5
-      </li>
-      <li
-        class="t-pagination__number"
+        <svg
+          class="t-icon t-icon-chevron-left"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <ul
+        class="t-pagination__pager"
       >
-        6
-      </li>
-      
-      <!---->
+        <!---->
+        <!---->
+        
+        <li
+          class="t-pagination__number t-is-current"
+        >
+          1
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          2
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          3
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          4
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          5
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          6
+        </li>
+        
+        <!---->
+        <!---->
+      </ul>
       <!---->
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <!---->
-    <div
-      class="t-pagination__jump"
-    >
-      跳至
+        <svg
+          class="t-icon t-icon-chevron-right"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <!---->
       <div
-        class="t-input-adornment t-input-adornment--append"
+        class="t-pagination__jump"
       >
-        <!---->
+        跳至
         <div
-          class="t-input-number t-size-m t-input-number--normal t-pagination__input"
+          class="t-input-adornment t-input-adornment--append"
         >
           <!---->
           <div
-            class="t-input__wrap"
-            unselectable="off"
+            class="t-input-number t-size-m t-input-number--normal t-pagination__input"
           >
+            <!---->
             <div
-              class="t-input"
+              class="t-input__wrap"
+              unselectable="off"
             >
-              <!---->
-              <!---->
-              <input
-                autocomplete="off"
-                class="t-input__inner"
-                placeholder=""
-                type="text"
-              />
-              <!---->
-              <!---->
-              <!---->
+              <div
+                class="t-input"
+              >
+                <!---->
+                <!---->
+                <input
+                  autocomplete="off"
+                  class="t-input__inner"
+                  placeholder=""
+                  type="text"
+                />
+                <!---->
+                <!---->
+                <!---->
+                <!---->
+              </div>
               <!---->
             </div>
             <!---->
+            <!---->
           </div>
-          <!---->
-          <!---->
+          <span
+            class="t-input-adornment__append"
+          >
+            / 6 页
+          </span>
         </div>
-        <span
-          class="t-input-adornment__append"
-        >
-          / 6 页
-        </span>
       </div>
     </div>
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/mini.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-s"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 100 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-s"
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
+      >
+        共 100 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
       >
+        
         <div
-          class="t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              5 条/页
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            5 条/页
-          </span>
           <!---->
-          <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
         <!---->
+        
       </div>
       <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
-      disabled="true"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
+        disabled="true"
       >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <li
-        class="t-pagination__number t-is-current"
+        <svg
+          class="t-icon t-icon-chevron-left"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <ul
+        class="t-pagination__pager"
       >
-        1
-      </li>
+        <li
+          class="t-pagination__number t-is-current"
+        >
+          1
+        </li>
+        <!---->
+        
+        <li
+          class="t-pagination__number"
+        >
+          2
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          3
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          4
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          5
+        </li>
+        
+        <li
+          class="t-pagination__number t-pagination__number--more"
+        >
+          <svg
+            class="t-icon t-icon-ellipsis"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          20
+        </li>
+      </ul>
       <!---->
-      
-      <li
-        class="t-pagination__number"
-      >
-        2
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        3
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        4
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        5
-      </li>
-      
-      <li
-        class="t-pagination__number t-pagination__number--more"
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
         <svg
-          class="t-icon t-icon-ellipsis"
+          class="t-icon t-icon-chevron-right"
           fill="none"
           height="1em"
           viewBox="0 0 16 16"
           width="1em"
         >
           <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
             fill="currentColor"
             fill-opacity="0.9"
           />
         </svg>
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        20
-      </li>
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+      </div>
+      <!---->
+      <!---->
     </div>
-    <!---->
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/more.vue 1`] = `
 <div
-  class="tdesign-demo-block-row"
+  class="t-space t-space-vertical"
+  style="gap: 16px;"
 >
-  <span>
-    展示首尾页码省略
-  </span>
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 100 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-space t-space-vertical"
+      style="gap: 16px;"
     >
       
+      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-space-item"
+      >
+        <span>
+          展示首尾页码省略
+        </span>
+      </div>
+      <!---->
+      
+      
+      <div
+        class="t-space-item"
       >
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-pagination t-size-m"
         >
+          <div
+            class="t-pagination__total"
+          >
+            共 100 项数据
+          </div>
+          <div
+            class="t-select__wrap t-pagination__select"
+          >
+            
+            <div
+              class="t-input__wrap t-select-input t-select"
+            >
+              <div
+                class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+              >
+                <!---->
+                <div
+                  class="t-input__prefix"
+                >
+                  
+                  <!---->
+                  <!---->
+                  
+                </div>
+                <input
+                  class="t-input__inner"
+                  placeholder="请选择"
+                  readonly=""
+                  type="text"
+                  unselectable="on"
+                />
+                <span
+                  class="t-input__input-pre"
+                >
+                  5 条/页
+                </span>
+                <!---->
+                <!---->
+                <span
+                  class="t-input__suffix t-input__suffix-icon"
+                >
+                  <svg
+                    class="t-fake-arrow t-select__right-icon"
+                    fill="none"
+                    height="16"
+                    viewBox="0 0 16 16"
+                    width="16"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                      stroke="black"
+                      stroke-opacity="0.9"
+                      stroke-width="1.3"
+                    />
+                  </svg>
+                </span>
+              </div>
+              <!---->
+            </div>
+            <!---->
+            
+          </div>
           <!---->
           <div
-            class="t-input__prefix"
+            class="t-pagination__btn t-pagination__btn-prev"
+            disabled="false"
+          >
+            <svg
+              class="t-icon t-icon-chevron-left"
+              fill="none"
+              height="1em"
+              viewBox="0 0 16 16"
+              width="1em"
+            >
+              <path
+                d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+                fill="currentColor"
+                fill-opacity="0.9"
+              />
+            </svg>
+          </div>
+          <ul
+            class="t-pagination__pager"
           >
+            <li
+              class="t-pagination__number"
+            >
+              1
+            </li>
+            <li
+              class="t-pagination__number t-pagination__number--more"
+            >
+              <svg
+                class="t-icon t-icon-ellipsis"
+                fill="none"
+                height="1em"
+                viewBox="0 0 16 16"
+                width="1em"
+              >
+                <path
+                  d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+                  fill="currentColor"
+                  fill-opacity="0.9"
+                />
+              </svg>
+            </li>
             
-            <!---->
-            <!---->
+            <li
+              class="t-pagination__number"
+            >
+              10
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              11
+            </li>
+            <li
+              class="t-pagination__number t-is-current"
+            >
+              12
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              13
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              14
+            </li>
             
-          </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            5 条/页
-          </span>
-          <!---->
+            <li
+              class="t-pagination__number t-pagination__number--more"
+            >
+              <svg
+                class="t-icon t-icon-ellipsis"
+                fill="none"
+                height="1em"
+                viewBox="0 0 16 16"
+                width="1em"
+              >
+                <path
+                  d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+                  fill="currentColor"
+                  fill-opacity="0.9"
+                />
+              </svg>
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              20
+            </li>
+          </ul>
           <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
+          <div
+            class="t-pagination__btn t-pagination__btn-next"
+            disabled="false"
           >
             <svg
-              class="t-fake-arrow t-select__right-icon"
+              class="t-icon t-icon-chevron-right"
               fill="none"
-              height="16"
+              height="1em"
               viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
+              width="1em"
             >
               <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
+                d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+                fill="currentColor"
+                fill-opacity="0.9"
               />
             </svg>
-          </span>
+          </div>
+          <!---->
+          <!---->
         </div>
-        <!---->
       </div>
       <!---->
       
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <li
-        class="t-pagination__number"
-      >
-        1
-      </li>
-      <li
-        class="t-pagination__number t-pagination__number--more"
-      >
-        <svg
-          class="t-icon t-icon-ellipsis"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
-        >
-          <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
-      </li>
-      
-      <li
-        class="t-pagination__number"
-      >
-        10
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        11
-      </li>
-      <li
-        class="t-pagination__number t-is-current"
-      >
-        12
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        13
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        14
-      </li>
       
-      <li
-        class="t-pagination__number t-pagination__number--more"
-      >
-        <svg
-          class="t-icon t-icon-ellipsis"
-          fill="none"
-          height="1em"
-          viewBox="0 0 16 16"
-          width="1em"
-        >
-          <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
-            fill="currentColor"
-            fill-opacity="0.9"
-          />
-        </svg>
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        20
-      </li>
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
     </div>
-    <!---->
-    <!---->
   </div>
-  <span>
-    不展示首尾页码省略
-  </span>
+  <!---->
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 100 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-space t-space-vertical"
+      style="gap: 16px;"
     >
       
+      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-space-item"
+      >
+        <span>
+          不展示首尾页码省略
+        </span>
+      </div>
+      <!---->
+      
+      
+      <div
+        class="t-space-item"
       >
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-pagination t-size-m"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-pagination__total"
+          >
+            共 100 项数据
+          </div>
+          <div
+            class="t-select__wrap t-pagination__select"
           >
             
-            <!---->
+            <div
+              class="t-input__wrap t-select-input t-select"
+            >
+              <div
+                class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+              >
+                <!---->
+                <div
+                  class="t-input__prefix"
+                >
+                  
+                  <!---->
+                  <!---->
+                  
+                </div>
+                <input
+                  class="t-input__inner"
+                  placeholder="请选择"
+                  readonly=""
+                  type="text"
+                  unselectable="on"
+                />
+                <span
+                  class="t-input__input-pre"
+                >
+                  5 条/页
+                </span>
+                <!---->
+                <!---->
+                <span
+                  class="t-input__suffix t-input__suffix-icon"
+                >
+                  <svg
+                    class="t-fake-arrow t-select__right-icon"
+                    fill="none"
+                    height="16"
+                    viewBox="0 0 16 16"
+                    width="16"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                      stroke="black"
+                      stroke-opacity="0.9"
+                      stroke-width="1.3"
+                    />
+                  </svg>
+                </span>
+              </div>
+              <!---->
+            </div>
             <!---->
             
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            5 条/页
-          </span>
           <!---->
+          <div
+            class="t-pagination__btn t-pagination__btn-prev"
+            disabled="false"
+          >
+            <svg
+              class="t-icon t-icon-chevron-left"
+              fill="none"
+              height="1em"
+              viewBox="0 0 16 16"
+              width="1em"
+            >
+              <path
+                d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+                fill="currentColor"
+                fill-opacity="0.9"
+              />
+            </svg>
+          </div>
+          <ul
+            class="t-pagination__pager"
+          >
+            <!---->
+            <!---->
+            
+            <li
+              class="t-pagination__number"
+            >
+              10
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              11
+            </li>
+            <li
+              class="t-pagination__number t-is-current"
+            >
+              12
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              13
+            </li>
+            <li
+              class="t-pagination__number"
+            >
+              14
+            </li>
+            
+            <!---->
+            <!---->
+          </ul>
           <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
+          <div
+            class="t-pagination__btn t-pagination__btn-next"
+            disabled="false"
           >
             <svg
-              class="t-fake-arrow t-select__right-icon"
+              class="t-icon t-icon-chevron-right"
               fill="none"
-              height="16"
+              height="1em"
               viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
+              width="1em"
             >
               <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
+                d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+                fill="currentColor"
+                fill-opacity="0.9"
               />
             </svg>
-          </span>
+          </div>
+          <!---->
+          <!---->
         </div>
-        <!---->
       </div>
       <!---->
       
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <!---->
-      <!---->
-      
-      <li
-        class="t-pagination__number"
-      >
-        10
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        11
-      </li>
-      <li
-        class="t-pagination__number t-is-current"
-      >
-        12
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        13
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        14
-      </li>
       
-      <!---->
-      <!---->
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
     </div>
-    <!---->
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/page-num.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-m"
-    show-sizer=""
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 645 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-m"
+      show-sizer=""
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
+      >
+        共 645 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
       >
+        
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              每页 30 条
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            每页 30 条
-          </span>
-          <!---->
           <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
         <!---->
+        
       </div>
       <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
-      disabled="true"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
+        disabled="true"
       >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <li
-        class="t-pagination__number t-is-current"
+        <svg
+          class="t-icon t-icon-chevron-left"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <ul
+        class="t-pagination__pager"
       >
-        1
-      </li>
+        <li
+          class="t-pagination__number t-is-current"
+        >
+          1
+        </li>
+        <!---->
+        
+        <li
+          class="t-pagination__number"
+        >
+          2
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          3
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          4
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          5
+        </li>
+        
+        <li
+          class="t-pagination__number t-pagination__number--more"
+        >
+          <svg
+            class="t-icon t-icon-ellipsis"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          22
+        </li>
+      </ul>
       <!---->
-      
-      <li
-        class="t-pagination__number"
-      >
-        2
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        3
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        4
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        5
-      </li>
-      
-      <li
-        class="t-pagination__number t-pagination__number--more"
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
         <svg
-          class="t-icon t-icon-ellipsis"
+          class="t-icon t-icon-chevron-right"
           fill="none"
           height="1em"
           viewBox="0 0 16 16"
           width="1em"
         >
           <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
             fill="currentColor"
             fill-opacity="0.9"
           />
         </svg>
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        22
-      </li>
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+      </div>
+      <!---->
+      <!---->
     </div>
-    <!---->
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/simple.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 100 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-m"
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
+      >
+        共 100 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
       >
+        
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              5 条/页
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            5 条/页
-          </span>
           <!---->
-          <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
         <!---->
+        
       </div>
       <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
-      disabled="true"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
+        disabled="true"
       >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <!---->
-    <div
-      class="t-pagination__jump"
-    >
-      跳至
+        <svg
+          class="t-icon t-icon-chevron-left"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <!---->
       <div
-        class="t-input-adornment t-input-adornment--append"
+        class="t-pagination__jump"
       >
-        <!---->
+        跳至
         <div
-          class="t-input-number t-size-m t-input-number--normal t-pagination__input"
+          class="t-input-adornment t-input-adornment--append"
         >
           <!---->
           <div
-            class="t-input__wrap"
-            unselectable="off"
+            class="t-input-number t-size-m t-input-number--normal t-pagination__input"
           >
+            <!---->
             <div
-              class="t-input"
+              class="t-input__wrap"
+              unselectable="off"
             >
-              <!---->
-              <!---->
-              <input
-                autocomplete="off"
-                class="t-input__inner"
-                placeholder=""
-                type="text"
-              />
-              <!---->
-              <!---->
-              <!---->
+              <div
+                class="t-input"
+              >
+                <!---->
+                <!---->
+                <input
+                  autocomplete="off"
+                  class="t-input__inner"
+                  placeholder=""
+                  type="text"
+                />
+                <!---->
+                <!---->
+                <!---->
+                <!---->
+              </div>
               <!---->
             </div>
             <!---->
+            <!---->
           </div>
-          <!---->
-          <!---->
+          <span
+            class="t-input-adornment__append"
+          >
+            / 20 页
+          </span>
         </div>
-        <span
-          class="t-input-adornment__append"
-        >
-          / 20 页
-        </span>
       </div>
-    </div>
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+        <svg
+          class="t-icon t-icon-chevron-right"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <!---->
+      <!---->
     </div>
-    <!---->
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/simple-mini.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-s"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 100 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-s"
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
       >
+        共 100 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
+      >
+        
         <div
-          class="t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              5 条/页
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            5 条/页
-          </span>
           <!---->
-          <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
         <!---->
+        
+      </div>
+      <!---->
+      <div
+        class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
+        disabled="true"
+      >
+        <svg
+          class="t-icon t-icon-chevron-left"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
       </div>
       <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev t-is-disabled"
-      disabled="true"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <!---->
-    <div
-      class="t-pagination__jump"
-    >
-      跳至
       <div
-        class="t-input-adornment t-input-adornment--append"
+        class="t-pagination__jump"
       >
-        <!---->
+        跳至
         <div
-          class="t-input-number t-size-s t-input-number--normal t-pagination__input"
+          class="t-input-adornment t-input-adornment--append"
         >
           <!---->
           <div
-            class="t-input__wrap"
-            unselectable="off"
+            class="t-input-number t-size-s t-input-number--normal t-pagination__input"
           >
+            <!---->
             <div
-              class="t-input"
+              class="t-input__wrap"
+              unselectable="off"
             >
-              <!---->
-              <!---->
-              <input
-                autocomplete="off"
-                class="t-input__inner"
-                placeholder=""
-                type="text"
-              />
-              <!---->
-              <!---->
-              <!---->
+              <div
+                class="t-input"
+              >
+                <!---->
+                <!---->
+                <input
+                  autocomplete="off"
+                  class="t-input__inner"
+                  placeholder=""
+                  type="text"
+                />
+                <!---->
+                <!---->
+                <!---->
+                <!---->
+              </div>
               <!---->
             </div>
             <!---->
+            <!---->
           </div>
-          <!---->
-          <!---->
+          <span
+            class="t-input-adornment__append"
+          >
+            / 20 页
+          </span>
         </div>
-        <span
-          class="t-input-adornment__append"
-        >
-          / 20 页
-        </span>
       </div>
-    </div>
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+        <svg
+          class="t-icon t-icon-chevron-right"
+          fill="none"
+          height="1em"
+          viewBox="0 0 16 16"
+          width="1em"
+        >
+          <path
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
+            fill="currentColor"
+            fill-opacity="0.9"
+          />
+        </svg>
+      </div>
+      <!---->
+      <!---->
     </div>
-    <!---->
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/pagination/_example/total.vue 1`] = `
-<div>
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
   <div
-    class="t-pagination t-size-m"
+    class="t-space-item"
   >
     <div
-      class="t-pagination__total"
-    >
-      共 685 项数据
-    </div>
-    <div
-      class="t-select__wrap t-pagination__select"
+      class="t-pagination t-size-m"
     >
-      
       <div
-        class="t-input__wrap t-select-input t-select"
+        class="t-pagination__total"
+      >
+        共 685 项数据
+      </div>
+      <div
+        class="t-select__wrap t-pagination__select"
       >
+        
         <div
-          class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
+          class="t-input__wrap t-select-input t-select"
         >
-          <!---->
           <div
-            class="t-input__prefix"
+            class="t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width"
           >
-            
+            <!---->
+            <div
+              class="t-input__prefix"
+            >
+              
+              <!---->
+              <!---->
+              
+            </div>
+            <input
+              class="t-input__inner"
+              placeholder="请选择"
+              readonly=""
+              type="text"
+              unselectable="on"
+            />
+            <span
+              class="t-input__input-pre"
+            >
+              10 条/页
+            </span>
             <!---->
             <!---->
-            
+            <span
+              class="t-input__suffix t-input__suffix-icon"
+            >
+              <svg
+                class="t-fake-arrow t-select__right-icon"
+                fill="none"
+                height="16"
+                viewBox="0 0 16 16"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
+                  stroke="black"
+                  stroke-opacity="0.9"
+                  stroke-width="1.3"
+                />
+              </svg>
+            </span>
           </div>
-          <input
-            class="t-input__inner"
-            placeholder="请选择"
-            readonly=""
-            type="text"
-            unselectable="on"
-          />
-          <span
-            class="t-input__input-pre"
-          >
-            10 条/页
-          </span>
           <!---->
-          <!---->
-          <span
-            class="t-input__suffix t-input__suffix-icon"
-          >
-            <svg
-              class="t-fake-arrow t-select__right-icon"
-              fill="none"
-              height="16"
-              viewBox="0 0 16 16"
-              width="16"
-              xmlns="http://www.w3.org/2000/svg"
-            >
-              <path
-                d="M3.75 5.7998L7.99274 10.0425L12.2361 5.79921"
-                stroke="black"
-                stroke-opacity="0.9"
-                stroke-width="1.3"
-              />
-            </svg>
-          </span>
         </div>
         <!---->
+        
       </div>
       <!---->
-      
-    </div>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-prev"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-left"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
-    </div>
-    <ul
-      class="t-pagination__pager"
-    >
-      <li
-        class="t-pagination__number"
-      >
-        1
-      </li>
-      <li
-        class="t-pagination__number t-pagination__number--more"
+      <div
+        class="t-pagination__btn t-pagination__btn-prev"
+        disabled="false"
       >
         <svg
-          class="t-icon t-icon-ellipsis"
+          class="t-icon t-icon-chevron-left"
           fill="none"
           height="1em"
           viewBox="0 0 16 16"
           width="1em"
         >
           <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+            d="M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z"
             fill="currentColor"
             fill-opacity="0.9"
           />
         </svg>
-      </li>
-      
-      <li
-        class="t-pagination__number"
-      >
-        10
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        11
-      </li>
-      <li
-        class="t-pagination__number t-is-current"
-      >
-        12
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        13
-      </li>
-      <li
-        class="t-pagination__number"
+      </div>
+      <ul
+        class="t-pagination__pager"
       >
-        14
-      </li>
-      
-      <li
-        class="t-pagination__number t-pagination__number--more"
+        <li
+          class="t-pagination__number"
+        >
+          1
+        </li>
+        <li
+          class="t-pagination__number t-pagination__number--more"
+        >
+          <svg
+            class="t-icon t-icon-ellipsis"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </li>
+        
+        <li
+          class="t-pagination__number"
+        >
+          10
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          11
+        </li>
+        <li
+          class="t-pagination__number t-is-current"
+        >
+          12
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          13
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          14
+        </li>
+        
+        <li
+          class="t-pagination__number t-pagination__number--more"
+        >
+          <svg
+            class="t-icon t-icon-ellipsis"
+            fill="none"
+            height="1em"
+            viewBox="0 0 16 16"
+            width="1em"
+          >
+            <path
+              d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+              fill="currentColor"
+              fill-opacity="0.9"
+            />
+          </svg>
+        </li>
+        <li
+          class="t-pagination__number"
+        >
+          69
+        </li>
+      </ul>
+      <!---->
+      <div
+        class="t-pagination__btn t-pagination__btn-next"
+        disabled="false"
       >
         <svg
-          class="t-icon t-icon-ellipsis"
+          class="t-icon t-icon-chevron-right"
           fill="none"
           height="1em"
           viewBox="0 0 16 16"
           width="1em"
         >
           <path
-            d="M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z"
+            d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
             fill="currentColor"
             fill-opacity="0.9"
           />
         </svg>
-      </li>
-      <li
-        class="t-pagination__number"
-      >
-        69
-      </li>
-    </ul>
-    <!---->
-    <div
-      class="t-pagination__btn t-pagination__btn-next"
-      disabled="false"
-    >
-      <svg
-        class="t-icon t-icon-chevron-right"
-        fill="none"
-        height="1em"
-        viewBox="0 0 16 16"
-        width="1em"
-      >
-        <path
-          d="M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z"
-          fill="currentColor"
-          fill-opacity="0.9"
-        />
-      </svg>
+      </div>
+      <!---->
+      <!---->
     </div>
-    <!---->
-    <!---->
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
@@ -127024,1743 +127440,1808 @@ exports[`csr snapshot test > csr test ./src/table/_example/virtual-scroll.vue 1`
 
 exports[`csr snapshot test > csr test ./src/tabs/_example/ban.vue 1`] = `
 <div
-  class="tdesign-demo-block-column-large"
+  class="t-space t-space-vertical"
+  style="gap: 24px;"
 >
-  <div>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div
-      class="t-radio-group t-size-m t-radio-group--filled"
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
     >
       
-      <label
-        class="t-radio-button t-is-checked"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="normal"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           常规型 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
+      
+      <div
+        class="t-space-item"
       >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="card"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
+        <div
+          class="t-radio-group t-size-m t-radio-group--filled"
         >
           
+          <label
+            class="t-radio-button t-is-checked"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="normal"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              常规型
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="card"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              卡片型
+              
+              
+            </span>
+          </label>
           
-           卡片型 
-          
-          
-        </span>
-      </label>
+          <div
+            class="t-radio-group__bg-block"
+            style="width: 0px; left: 0px;"
+          />
+        </div>
+      </div>
+      <!---->
+      
       
-      <div
-        class="t-radio-group__bg-block"
-        style="width: 0px; left: 0px;"
-      />
     </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
         <div
-          class="t-tabs__operations t-tabs__operations--right"
+          class="t-tabs__nav"
         >
-          <transition-stub>
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
+          <div
+            class="t-tabs__operations t-tabs__operations--right"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-is-top"
-        >
+          </div>
+          
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__nav-container t-is-top"
           >
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__nav-scroll"
             >
               <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
                 <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
+                  class="t-tabs__bar t-is-top"
+                />
+                
+                <div
+                  class="t-tabs__nav-item t-is-active t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-active"
                   >
-                    选项卡1
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡1
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-is-disabled t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper t-is-disabled"
+                  class="t-tabs__nav-item t-is-disabled t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-disabled"
                   >
-                    选项卡2
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡2
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡3
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡3
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
       <div
-        class="t-tab-panel"
+        class="t-tabs__content"
       >
         
-        <p
-          style="padding: 25px;"
+        <div
+          class="t-tab-panel"
         >
-          选项卡1的内容
-        </p>
+          
+          <p
+            style="padding: 25px;"
+          >
+            选项卡1的内容
+          </p>
+          
+        </div>
+        <!---->
+        <!---->
         
       </div>
-      <!---->
-      <!---->
       
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/tabs/_example/base.vue 1`] = `
 <div
-  class="tdesign-demo-block-column-large"
+  class="t-space t-space-vertical"
+  style="gap: 24px;"
 >
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
         <div
-          class="t-tabs__operations t-tabs__operations--right"
+          class="t-tabs__nav"
         >
-          <transition-stub>
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
+          <div
+            class="t-tabs__operations t-tabs__operations--right"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-is-top"
-        >
+          </div>
+          
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__nav-container t-is-top"
           >
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__nav-scroll"
             >
               <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
                 <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
+                  class="t-tabs__bar t-is-top"
+                />
+                
+                <div
+                  class="t-tabs__nav-item t-is-active t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-active"
                   >
-                    选项卡1
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡1
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡2
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡2
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡3
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡3
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
       <div
-        class="t-tab-panel"
+        class="t-tabs__content"
       >
         
-        <p
-          style="padding: 25px;"
+        <div
+          class="t-tab-panel"
         >
-          选项卡1的内容，使用 t-tab-panel 渲染
-        </p>
-        
-      </div>
-      <div
-        class="t-tab-panel"
-        style="display: none;"
-      >
-        
-        <p
-          style="padding: 25px;"
+          
+          <p
+            style="padding: 25px;"
+          >
+            选项卡1的内容，使用 t-tab-panel 渲染
+          </p>
+          
+        </div>
+        <div
+          class="t-tab-panel"
+          style="display: none;"
         >
-          选项卡2的内容，使用 t-tab-panel 渲染
-        </p>
+          
+          <p
+            style="padding: 25px;"
+          >
+            选项卡2的内容，使用 t-tab-panel 渲染
+          </p>
+          
+        </div>
+        <!---->
         
       </div>
-      <!---->
       
     </div>
-    
   </div>
-  <!-- 方式二：使用 list 定义 Tab -->
+  <!---->
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
         <div
-          class="t-tabs__operations t-tabs__operations--right"
+          class="t-tabs__nav"
         >
-          <transition-stub>
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
+          <div
+            class="t-tabs__operations t-tabs__operations--right"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-is-top"
-        >
+          </div>
+          
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__nav-container t-is-top"
           >
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__nav-scroll"
             >
               <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
                 <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
+                  class="t-tabs__bar t-is-top"
+                />
+                
+                <div
+                  class="t-tabs__nav-item t-is-active t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-active"
                   >
-                    选项卡一
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡一
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡二
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡二
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡三
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡三
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    
-    <div
-      class="t-tab-panel"
-    >
-      <p
-        style="padding: 25px;"
+      
+      <div
+        class="t-tab-panel"
       >
-        这是选项卡一的内容，使用 t-tabs 渲染
-      </p>
+        <p
+          style="padding: 25px;"
+        >
+          这是选项卡一的内容，使用 t-tabs 渲染
+        </p>
+      </div>
+      <!---->
+      <!---->
+      
+      
     </div>
-    <!---->
-    <!---->
-    
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/tabs/_example/combination.vue 1`] = `
 <div
-  class="tdesign-demo-block-column-large"
-  style="width: 100%;"
+  class="t-space t-space-vertical"
+  style="gap: 24px;"
 >
-  <div>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div
-      class="t-radio-group t-size-m t-radio-group--filled"
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
     >
       
-      <label
-        class="t-radio-button t-is-checked"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="normal"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           常规型 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
+      
+      <div
+        class="t-space-item"
       >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="card"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
+        <div
+          class="t-radio-group t-size-m t-radio-group--filled"
         >
           
+          <label
+            class="t-radio-button t-is-checked"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="normal"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              常规型
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="card"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              卡片型
+              
+              
+            </span>
+          </label>
           
-           卡片型 
-          
-          
-        </span>
-      </label>
+          <div
+            class="t-radio-group__bg-block"
+            style="width: 0px; left: 0px;"
+          />
+        </div>
+      </div>
+      <!---->
+      
       
-      <div
-        class="t-radio-group__bg-block"
-        style="width: 0px; left: 0px;"
-      />
     </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
         <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
-        <div
-          class="t-tabs__operations t-tabs__operations--right"
+          class="t-tabs__nav"
         >
-          <transition-stub>
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
+          <div
+            class="t-tabs__operations t-tabs__operations--right"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-is-top"
-        >
+          </div>
+          
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__nav-container t-is-top"
           >
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__nav-scroll"
             >
               <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
                 <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
+                  class="t-tabs__bar t-is-top"
+                />
+                
+                <div
+                  class="t-tabs__nav-item t-is-active t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-active"
                   >
-                    选项卡1
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡1
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡2
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡2
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡3
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡3
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡4
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡4
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡5
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡5
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡6
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡6
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡7
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡7
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡8
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡8
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡9
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡9
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡10
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡10
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡11
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡11
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡12
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡12
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡13
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡13
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡14
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡14
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡15
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡15
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡16
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡16
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡17
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡17
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡18
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡18
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡19
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡19
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    选项卡20
-                  </span>
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      选项卡20
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
-      <div
-        class="t-tab-panel"
-      >
-        
-        <p
-          style="padding: 25px;"
-        >
-          选项卡1
-        </p>
-        
-      </div>
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      <!---->
-      
-    </div>
-    
-  </div>
-</div>
-`;
-
-exports[`csr snapshot test > csr test ./src/tabs/_example/custom.vue 1`] = `
-<div
-  class="tdesign-demo-block-column-large"
-  style="width: 100%;"
->
-  <div
-    class="t-tabs"
-  >
-    
-    <div
-      class="t-tabs__header t-is-top"
-    >
       <div
-        class="t-tabs__nav"
-        style="min-height: 48px;"
+        class="t-tabs__content"
       >
         
         <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
-        <div
-          class="t-tabs__operations t-tabs__operations--right"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-          <div
-            class="t-tabs__add-btn t-tabs__btn t-size-m"
-          >
-            <svg
-              class="t-icon t-icon-add"
-              fill="none"
-              height="1em"
-              viewBox="0 0 16 16"
-              width="1em"
-            >
-              <path
-                d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z"
-                fill="currentColor"
-                fill-opacity="0.9"
-              />
-            </svg>
-          </div>
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable"
+          class="t-tab-panel"
         >
-          <div
-            class="t-tabs__nav-scroll"
+          
+          <p
+            style="padding: 25px;"
           >
-            <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
-            >
-              <!---->
-              
-              <div
-                class="t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m"
-                draggable="false"
-              >
-                <span
-                  class="t-tabs__nav-item-text-wrapper"
-                >
-                  原有选项卡1
-                </span>
-                <svg
-                  class="t-icon t-icon-close remove-btn"
-                  fill="none"
-                  height="1em"
-                  viewBox="0 0 16 16"
-                  width="1em"
-                >
-                  <path
-                    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="currentColor"
-                    fill-opacity="0.9"
-                  />
-                </svg>
-              </div>
-              <div
-                class="t-tabs__nav-item t-tabs__nav--card t-size-m"
-                draggable="false"
-              >
-                <span
-                  class="t-tabs__nav-item-text-wrapper"
-                >
-                  原有选项卡2
-                </span>
-                <svg
-                  class="t-icon t-icon-close remove-btn"
-                  fill="none"
-                  height="1em"
-                  viewBox="0 0 16 16"
-                  width="1em"
-                >
-                  <path
-                    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="currentColor"
-                    fill-opacity="0.9"
-                  />
-                </svg>
-              </div>
-              
-            </div>
-          </div>
+            选项卡1
+          </p>
+          
         </div>
-      </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
-      <div
-        class="t-tab-panel"
-      >
-        
-        <p
-          style="padding: 25px;"
-        >
-          原有选项卡1内容
-        </p>
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
+        <!---->
         
       </div>
-      <!---->
       
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
-exports[`csr snapshot test > csr test ./src/tabs/_example/drag-sort.vue 1`] = `
+exports[`csr snapshot test > csr test ./src/tabs/_example/custom.vue 1`] = `
 <div
-  class="tdesign-demo-block-column-large"
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
-  <div>
-    <div
-      class="t-radio-group t-size-m t-radio-group--filled"
-    >
-      
-      <label
-        class="t-radio-button t-is-checked"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="normal"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           常规型 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="card"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           卡片型 
-          
-          
-        </span>
-      </label>
-      
-      <div
-        class="t-radio-group__bg-block"
-        style="width: 0px; left: 0px;"
-      />
-    </div>
-  </div>
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
-        <div
-          class="t-tabs__operations t-tabs__operations--right"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
         <div
-          class="t-tabs__nav-container t-is-top"
+          class="t-tabs__nav"
+          style="min-height: 48px;"
         >
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__operations t-tabs__operations--right"
           >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__add-btn t-tabs__btn t-size-m"
             >
-              <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="true"
+              <svg
+                class="t-icon t-icon-add"
+                fill="none"
+                height="1em"
+                viewBox="0 0 16 16"
+                width="1em"
               >
-                <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
-                >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
-                  >
-                    选项卡1
-                  </span>
-                </div>
-                <!---->
-              </div>
+                <path
+                  d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z"
+                  fill="currentColor"
+                  fill-opacity="0.9"
+                />
+              </svg>
+            </div>
+          </div>
+          
+          <div
+            class="t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable"
+          >
+            <div
+              class="t-tabs__nav-scroll"
+            >
               <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="true"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
+                <!---->
+                
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m"
+                  draggable="false"
                 >
                   <span
                     class="t-tabs__nav-item-text-wrapper"
                   >
-                    选项卡2
+                    原有选项卡1
                   </span>
+                  <svg
+                    class="t-icon t-icon-close remove-btn"
+                    fill="none"
+                    height="1em"
+                    viewBox="0 0 16 16"
+                    width="1em"
+                  >
+                    <path
+                      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="currentColor"
+                      fill-opacity="0.9"
+                    />
+                  </svg>
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="true"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-tabs__nav--card t-size-m"
+                  draggable="false"
                 >
                   <span
                     class="t-tabs__nav-item-text-wrapper"
                   >
-                    选项卡3
+                    原有选项卡2
                   </span>
+                  <svg
+                    class="t-icon t-icon-close remove-btn"
+                    fill="none"
+                    height="1em"
+                    viewBox="0 0 16 16"
+                    width="1em"
+                  >
+                    <path
+                      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="currentColor"
+                      fill-opacity="0.9"
+                    />
+                  </svg>
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
       <div
-        class="t-tab-panel"
+        class="t-tabs__content"
       >
         
-        <p
-          style="padding: 25px;"
+        <div
+          class="t-tab-panel"
         >
-          选项卡1内容
-        </p>
+          
+          <p
+            style="padding: 25px;"
+          >
+            原有选项卡1内容
+          </p>
+          
+        </div>
+        <!---->
         
       </div>
-      <!---->
-      <!---->
       
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
-exports[`csr snapshot test > csr test ./src/tabs/_example/icon.vue 1`] = `
+exports[`csr snapshot test > csr test ./src/tabs/_example/drag-sort.vue 1`] = `
 <div
-  class="t-demo-tabs"
+  class="t-space t-space-vertical"
+  style="gap: 24px;"
 >
+  
+  
   <div
-    class="t-demo-tabs__desc"
+    class="t-space-item"
   >
     <div
-      class="t-radio-group t-size-m t-radio-group--filled"
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
     >
       
-      <label
-        class="t-radio-button t-is-checked"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="normal"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           常规型 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
+      
+      <div
+        class="t-space-item"
       >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="card"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
+        <div
+          class="t-radio-group t-size-m t-radio-group--filled"
         >
           
+          <label
+            class="t-radio-button t-is-checked"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="normal"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              常规型
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="card"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              卡片型
+              
+              
+            </span>
+          </label>
           
-           卡片型 
-          
-          
-        </span>
-      </label>
+          <div
+            class="t-radio-group__bg-block"
+            style="width: 0px; left: 0px;"
+          />
+        </div>
+      </div>
+      <!---->
+      
       
-      <div
-        class="t-radio-group__bg-block"
-        style="width: 0px; left: 0px;"
-      />
     </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
         <div
-          class="t-tabs__operations t-tabs__operations--right"
+          class="t-tabs__nav"
         >
-          <transition-stub>
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
+          <div
+            class="t-tabs__operations t-tabs__operations--right"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-is-top"
-        >
+          </div>
+          
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__nav-container t-is-top"
           >
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__nav-scroll"
             >
               <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
                 <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
+                  class="t-tabs__bar t-is-top"
+                />
+                
+                <div
+                  class="t-tabs__nav-item t-is-active t-size-m"
+                  draggable="true"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-active"
                   >
-                    
-                    <svg
-                      class="t-icon t-icon-home tabs-icon-margin"
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
                     >
-                      <use
-                        href="#t-icon-home"
-                      />
-                    </svg>
-                     首页 
-                    
-                  </span>
+                      选项卡1
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="true"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    
-                    <svg
-                      class="t-icon t-icon-calendar tabs-icon-margin"
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
                     >
-                      <use
-                        href="#t-icon-calendar"
-                      />
-                    </svg>
-                     日程 
-                    
-                  </span>
+                      选项卡2
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="true"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
                   >
-                    
-                    <svg
-                      class="t-icon t-icon-layers tabs-icon-margin"
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
                     >
-                      <use
-                        href="#t-icon-layers"
-                      />
-                    </svg>
-                     事项 
-                    
-                  </span>
+                      选项卡3
+                    </span>
+                  </div>
+                  <!---->
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
+      <div
+        class="t-tabs__content"
+      >
+        
+        <div
+          class="t-tab-panel"
+        >
+          
+          <p
+            style="padding: 25px;"
+          >
+            选项卡1内容
+          </p>
+          
+        </div>
+        <!---->
+        <!---->
+        
+      </div>
+      
     </div>
+  </div>
+  <!---->
+  
+  
+</div>
+`;
+
+exports[`csr snapshot test > csr test ./src/tabs/_example/icon.vue 1`] = `
+<div
+  class="t-space t-space-vertical"
+  style="gap: 16px;"
+>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div
-      class="t-tabs__content"
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
     >
       
+      
       <div
-        class="t-tab-panel"
+        class="t-space-item"
       >
-        
-        <p
-          style="padding: 25px;"
+        <div
+          class="t-radio-group t-size-m t-radio-group--filled"
         >
-          normal选项卡1内容
-        </p>
-        
+          
+          <label
+            class="t-radio-button t-is-checked"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="normal"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              常规型
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="card"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              卡片型
+              
+              
+            </span>
+          </label>
+          
+          <div
+            class="t-radio-group__bg-block"
+            style="width: 0px; left: 0px;"
+          />
+        </div>
       </div>
       <!---->
-      <!---->
+      
       
     </div>
-    
-  </div>
-</div>
-`;
-
-exports[`csr snapshot test > csr test ./src/tabs/_example/operation.vue 1`] = `
-<div
-  class="t-demo-tabs"
->
-  <div
-    class="t-demo-tabs__desc"
-  >
-    <p>
-      可以动态增加选项卡，仅支持卡片型
-    </p>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
-        style="min-height: 48px;"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
         <div
-          class="t-tabs__operations t-tabs__operations--right"
+          class="t-tabs__nav"
         >
-          <transition-stub>
-            <!---->
-          </transition-stub>
+          
           <div
-            class="t-tabs__add-btn t-tabs__btn t-size-m"
+            class="t-tabs__operations t-tabs__operations--left"
           >
-            <svg
-              class="t-icon t-icon-add"
-              fill="none"
-              height="1em"
-              viewBox="0 0 16 16"
-              width="1em"
-            >
-              <path
-                d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z"
-                fill="currentColor"
-                fill-opacity="0.9"
-              />
-            </svg>
+            <transition-stub>
+              <!---->
+            </transition-stub>
           </div>
-        </div>
-        
-        <div
-          class="t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable"
-        >
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__operations t-tabs__operations--right"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+            <!---->
+          </div>
+          
+          <div
+            class="t-tabs__nav-container t-is-top"
           >
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__nav-scroll"
             >
-              <!---->
-              
               <div
-                class="t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
-                <span
-                  class="t-tabs__nav-item-text-wrapper"
+                <div
+                  class="t-tabs__bar t-is-top"
+                />
+                
+                <div
+                  class="t-tabs__nav-item t-is-active t-size-m"
+                  draggable="false"
                 >
-                  原有选项卡
-                </span>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-tabs__nav--card t-size-m"
-                draggable="false"
-              >
-                <span
-                  class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-item-wrapper t-is-active"
+                  >
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      
+                      <svg
+                        class="t-icon t-icon-home tabs-icon-margin"
+                      >
+                        <use
+                          href="#t-icon-home"
+                        />
+                      </svg>
+                       首页 
+                      
+                    </span>
+                  </div>
+                  <!---->
+                </div>
+                <div
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  原有选项卡
-                </span>
-                <svg
-                  class="t-icon t-icon-close remove-btn"
-                  fill="none"
-                  height="1em"
-                  viewBox="0 0 16 16"
-                  width="1em"
+                  <div
+                    class="t-tabs__nav-item-wrapper"
+                  >
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      
+                      <svg
+                        class="t-icon t-icon-calendar tabs-icon-margin"
+                      >
+                        <use
+                          href="#t-icon-calendar"
+                        />
+                      </svg>
+                       日程 
+                      
+                    </span>
+                  </div>
+                  <!---->
+                </div>
+                <div
+                  class="t-tabs__nav-item t-size-m"
+                  draggable="false"
                 >
-                  <path
-                    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="currentColor"
-                    fill-opacity="0.9"
-                  />
-                </svg>
+                  <div
+                    class="t-tabs__nav-item-wrapper"
+                  >
+                    <span
+                      class="t-tabs__nav-item-text-wrapper"
+                    >
+                      
+                      <svg
+                        class="t-icon t-icon-layers tabs-icon-margin"
+                      >
+                        <use
+                          href="#t-icon-layers"
+                        />
+                      </svg>
+                       事项 
+                      
+                    </span>
+                  </div>
+                  <!---->
+                </div>
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
       <div
-        class="t-tab-panel"
+        class="t-tabs__content"
       >
         
-        <p
-          style="padding: 25px;"
+        <div
+          class="t-tab-panel"
         >
-          原有选项卡内容
-        </p>
+          
+          <p
+            style="padding: 25px;"
+          >
+            normal选项卡1内容
+          </p>
+          
+        </div>
+        <!---->
+        <!---->
         
       </div>
-      <!---->
       
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
-exports[`csr snapshot test > csr test ./src/tabs/_example/position.vue 1`] = `
+exports[`csr snapshot test > csr test ./src/tabs/_example/operation.vue 1`] = `
 <div
-  class="t-demo-tabs"
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
+  
+  
   <div
-    class="t-demo-tabs__desc"
+    class="t-space-item"
   >
     <div
-      class="t-radio-group t-size-m t-radio-group--filled"
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
     >
       
-      <label
-        class="t-radio-button t-is-checked"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="top"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           top 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="right"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           right 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="bottom"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           bottom 
-          
-          
-        </span>
-      </label>
-      <label
-        class="t-radio-button"
-      >
-        <input
-          class="t-radio-button__former"
-          name=""
-          type="radio"
-          value="left"
-        />
-        <span
-          class="t-radio-button__input"
-        />
-        <span
-          class="t-radio-button__label"
-        >
-          
-          
-           left 
-          
-          
-        </span>
-      </label>
       
       <div
-        class="t-radio-group__bg-block"
-        style="width: 0px; left: 0px;"
-      />
+        class="t-space-item"
+      >
+        <p>
+          可以动态增加选项卡，仅支持卡片型
+        </p>
+      </div>
+      <!---->
+      
+      
     </div>
   </div>
+  <!---->
+  
+  
   <div
-    class="t-tabs"
+    class="t-space-item"
   >
-    
     <div
-      class="t-tabs__header t-is-top"
+      class="t-tabs"
     >
+      
       <div
-        class="t-tabs__nav"
+        class="t-tabs__header t-is-top"
       >
-        
-        <div
-          class="t-tabs__operations t-tabs__operations--left"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-        </div>
-        <div
-          class="t-tabs__operations t-tabs__operations--right"
-        >
-          <transition-stub>
-            <!---->
-          </transition-stub>
-          <!---->
-        </div>
-        
         <div
-          class="t-tabs__nav-container t-is-top"
+          class="t-tabs__nav"
+          style="min-height: 48px;"
         >
+          
+          <div
+            class="t-tabs__operations t-tabs__operations--left"
+          >
+            <transition-stub>
+              <!---->
+            </transition-stub>
+          </div>
           <div
-            class="t-tabs__nav-scroll"
+            class="t-tabs__operations t-tabs__operations--right"
           >
+            <transition-stub>
+              <!---->
+            </transition-stub>
             <div
-              class="t-tabs__nav-wrap t-is-smooth"
-              style="transform: translate3d(0px, 0, 0);"
+              class="t-tabs__add-btn t-tabs__btn t-size-m"
             >
-              <div
-                class="t-tabs__bar t-is-top"
-              />
-              
-              <div
-                class="t-tabs__nav-item t-is-active t-size-m"
-                draggable="false"
+              <svg
+                class="t-icon t-icon-add"
+                fill="none"
+                height="1em"
+                viewBox="0 0 16 16"
+                width="1em"
               >
-                <div
-                  class="t-tabs__nav-item-wrapper t-is-active"
-                >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
-                  >
-                    选项卡1
-                  </span>
-                </div>
-                <!---->
-              </div>
+                <path
+                  d="M7.35 8.65v3.85h1.3V8.65h3.85v-1.3H8.65V3.5h-1.3v3.85H3.5v1.3h3.85z"
+                  fill="currentColor"
+                  fill-opacity="0.9"
+                />
+              </svg>
+            </div>
+          </div>
+          
+          <div
+            class="t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable"
+          >
+            <div
+              class="t-tabs__nav-scroll"
+            >
               <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
+                class="t-tabs__nav-wrap t-is-smooth"
+                style="transform: translate3d(0px, 0, 0);"
               >
+                <!---->
+                
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m"
+                  draggable="false"
                 >
                   <span
                     class="t-tabs__nav-item-text-wrapper"
                   >
-                    选项卡2
+                    原有选项卡
                   </span>
+                  <!---->
                 </div>
-                <!---->
-              </div>
-              <div
-                class="t-tabs__nav-item t-size-m"
-                draggable="false"
-              >
                 <div
-                  class="t-tabs__nav-item-wrapper"
+                  class="t-tabs__nav-item t-tabs__nav--card t-size-m"
+                  draggable="false"
                 >
                   <span
                     class="t-tabs__nav-item-text-wrapper"
                   >
-                    选项卡3
+                    原有选项卡
                   </span>
+                  <svg
+                    class="t-icon t-icon-close remove-btn"
+                    fill="none"
+                    height="1em"
+                    viewBox="0 0 16 16"
+                    width="1em"
+                  >
+                    <path
+                      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="currentColor"
+                      fill-opacity="0.9"
+                    />
+                  </svg>
                 </div>
-                <!---->
+                
               </div>
-              
             </div>
           </div>
         </div>
       </div>
-    </div>
-    <div
-      class="t-tabs__content"
-    >
-      
       <div
-        class="t-tab-panel"
+        class="t-tabs__content"
       >
         
-        <p
-          style="padding: 25px;"
+        <div
+          class="t-tab-panel"
         >
-          选项卡1
-        </p>
+          
+          <p
+            style="padding: 25px;"
+          >
+            原有选项卡内容
+          </p>
+          
+        </div>
+        <!---->
         
       </div>
-      <!---->
-      <!---->
       
     </div>
-    
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
-exports[`csr snapshot test > csr test ./src/tabs/_example/size.vue 1`] = `
+exports[`csr snapshot test > csr test ./src/tabs/_example/position.vue 1`] = `
 <div
-  class="tdesign-demo-block-column-large"
+  class="t-space t-space-vertical"
+  style="gap: 16px;"
 >
+  
+  
+  <div
+    class="t-space-item"
+  >
+    <div
+      class="t-space t-space-horizontal"
+      style="gap: 16px;"
+    >
+      
+      
+      <div
+        class="t-space-item"
+      >
+        <div
+          class="t-radio-group t-size-m t-radio-group--filled"
+        >
+          
+          <label
+            class="t-radio-button t-is-checked"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="top"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              top
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="right"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              right
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="bottom"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              bottom
+              
+              
+            </span>
+          </label>
+          <label
+            class="t-radio-button"
+          >
+            <input
+              class="t-radio-button__former"
+              name=""
+              type="radio"
+              value="left"
+            />
+            <span
+              class="t-radio-button__input"
+            />
+            <span
+              class="t-radio-button__label"
+            >
+              
+              
+              left
+              
+              
+            </span>
+          </label>
+          
+          <div
+            class="t-radio-group__bg-block"
+            style="width: 0px; left: 0px;"
+          />
+        </div>
+      </div>
+      <!---->
+      
+      
+    </div>
+  </div>
+  <!---->
+  
+  
   <div
-    class="tdesign-demo-block-column"
+    class="t-space-item"
   >
     <div
       class="t-tabs"
@@ -128875,343 +129356,524 @@ exports[`csr snapshot test > csr test ./src/tabs/_example/size.vue 1`] = `
       </div>
       
     </div>
+  </div>
+  <!---->
+  
+  
+</div>
+`;
+
+exports[`csr snapshot test > csr test ./src/tabs/_example/size.vue 1`] = `
+<div
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
+>
+  
+  
+  <div
+    class="t-space-item"
+  >
     <div
-      class="t-tabs"
+      class="t-space t-space-vertical"
+      style="gap: 16px;"
     >
       
+      
       <div
-        class="t-tabs__header t-is-top"
+        class="t-space-item"
       >
         <div
-          class="t-tabs__nav"
+          class="t-tabs"
         >
           
           <div
-            class="t-tabs__operations t-tabs__operations--left"
+            class="t-tabs__header t-is-top"
           >
-            <transition-stub>
-              <!---->
-            </transition-stub>
+            <div
+              class="t-tabs__nav"
+            >
+              
+              <div
+                class="t-tabs__operations t-tabs__operations--left"
+              >
+                <transition-stub>
+                  <!---->
+                </transition-stub>
+              </div>
+              <div
+                class="t-tabs__operations t-tabs__operations--right"
+              >
+                <transition-stub>
+                  <!---->
+                </transition-stub>
+                <!---->
+              </div>
+              
+              <div
+                class="t-tabs__nav-container t-is-top"
+              >
+                <div
+                  class="t-tabs__nav-scroll"
+                >
+                  <div
+                    class="t-tabs__nav-wrap t-is-smooth"
+                    style="transform: translate3d(0px, 0, 0);"
+                  >
+                    <div
+                      class="t-tabs__bar t-is-top"
+                    />
+                    
+                    <div
+                      class="t-tabs__nav-item t-is-active t-size-m"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper t-is-active"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡1
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-size-m"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡2
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-size-m"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡3
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    
+                  </div>
+                </div>
+              </div>
+            </div>
           </div>
           <div
-            class="t-tabs__operations t-tabs__operations--right"
+            class="t-tabs__content"
           >
-            <transition-stub>
-              <!---->
-            </transition-stub>
+            
+            <div
+              class="t-tab-panel"
+            >
+              
+              <p
+                style="padding: 25px;"
+              >
+                选项卡1
+              </p>
+              
+            </div>
             <!---->
+            <!---->
+            
           </div>
           
+        </div>
+      </div>
+      <!---->
+      
+      
+      <div
+        class="t-space-item"
+      >
+        <div
+          class="t-tabs"
+        >
+          
           <div
-            class="t-tabs__nav-container t-is-top"
+            class="t-tabs__header t-is-top"
           >
             <div
-              class="t-tabs__nav-scroll"
+              class="t-tabs__nav"
             >
+              
               <div
-                class="t-tabs__nav-wrap t-is-smooth"
-                style="transform: translate3d(0px, 0, 0);"
+                class="t-tabs__operations t-tabs__operations--left"
               >
-                <div
-                  class="t-tabs__bar t-is-top"
-                />
-                
-                <div
-                  class="t-tabs__nav-item t-is-active t-size-l"
-                  draggable="false"
-                >
-                  <div
-                    class="t-tabs__nav-item-wrapper t-is-active"
-                  >
-                    <span
-                      class="t-tabs__nav-item-text-wrapper"
-                    >
-                      选项卡1
-                    </span>
-                  </div>
+                <transition-stub>
                   <!---->
-                </div>
-                <div
-                  class="t-tabs__nav-item t-size-l"
-                  draggable="false"
-                >
-                  <div
-                    class="t-tabs__nav-item-wrapper"
-                  >
-                    <span
-                      class="t-tabs__nav-item-text-wrapper"
-                    >
-                      选项卡2
-                    </span>
-                  </div>
+                </transition-stub>
+              </div>
+              <div
+                class="t-tabs__operations t-tabs__operations--right"
+              >
+                <transition-stub>
                   <!---->
-                </div>
+                </transition-stub>
+                <!---->
+              </div>
+              
+              <div
+                class="t-tabs__nav-container t-is-top"
+              >
                 <div
-                  class="t-tabs__nav-item t-size-l"
-                  draggable="false"
+                  class="t-tabs__nav-scroll"
                 >
                   <div
-                    class="t-tabs__nav-item-wrapper"
+                    class="t-tabs__nav-wrap t-is-smooth"
+                    style="transform: translate3d(0px, 0, 0);"
                   >
-                    <span
-                      class="t-tabs__nav-item-text-wrapper"
+                    <div
+                      class="t-tabs__bar t-is-top"
+                    />
+                    
+                    <div
+                      class="t-tabs__nav-item t-is-active t-size-l"
+                      draggable="false"
                     >
-                      选项卡3
-                    </span>
+                      <div
+                        class="t-tabs__nav-item-wrapper t-is-active"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡1
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-size-l"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡2
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-size-l"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡3
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    
                   </div>
-                  <!---->
                 </div>
-                
               </div>
             </div>
           </div>
-        </div>
-      </div>
-      <div
-        class="t-tabs__content"
-      >
-        
-        <div
-          class="t-tab-panel"
-        >
-          
-          <p
-            style="padding: 25px;"
+          <div
+            class="t-tabs__content"
           >
-            选项卡1
-          </p>
+            
+            <div
+              class="t-tab-panel"
+            >
+              
+              <p
+                style="padding: 25px;"
+              >
+                选项卡1
+              </p>
+              
+            </div>
+            <!---->
+            <!---->
+            
+          </div>
           
         </div>
-        <!---->
-        <!---->
-        
       </div>
+      <!---->
+      
       
     </div>
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
 exports[`csr snapshot test > csr test ./src/tabs/_example/theme.vue 1`] = `
 <div
-  class="tdesign-demo-block-column-large"
+  class="t-space t-space-horizontal"
+  style="gap: 16px;"
 >
+  
+  
   <div
-    class="tdesign-demo-block-column"
+    class="t-space-item"
   >
     <div
-      class="t-tabs"
+      class="t-space t-space-vertical"
+      style="gap: 16px;"
     >
       
+      
       <div
-        class="t-tabs__header t-is-top"
+        class="t-space-item"
       >
         <div
-          class="t-tabs__nav"
+          class="t-tabs"
         >
           
           <div
-            class="t-tabs__operations t-tabs__operations--left"
-          >
-            <transition-stub>
-              <!---->
-            </transition-stub>
-          </div>
-          <div
-            class="t-tabs__operations t-tabs__operations--right"
-          >
-            <transition-stub>
-              <!---->
-            </transition-stub>
-            <!---->
-          </div>
-          
-          <div
-            class="t-tabs__nav-container t-is-top"
+            class="t-tabs__header t-is-top"
           >
             <div
-              class="t-tabs__nav-scroll"
+              class="t-tabs__nav"
             >
+              
               <div
-                class="t-tabs__nav-wrap t-is-smooth"
-                style="transform: translate3d(0px, 0, 0);"
+                class="t-tabs__operations t-tabs__operations--left"
               >
-                <div
-                  class="t-tabs__bar t-is-top"
-                />
-                
-                <div
-                  class="t-tabs__nav-item t-is-active t-size-m"
-                  draggable="false"
-                >
-                  <div
-                    class="t-tabs__nav-item-wrapper t-is-active"
-                  >
-                    <span
-                      class="t-tabs__nav-item-text-wrapper"
-                    >
-                      选项卡1
-                    </span>
-                  </div>
+                <transition-stub>
                   <!---->
-                </div>
-                <div
-                  class="t-tabs__nav-item t-size-m"
-                  draggable="false"
-                >
-                  <div
-                    class="t-tabs__nav-item-wrapper"
-                  >
-                    <span
-                      class="t-tabs__nav-item-text-wrapper"
-                    >
-                      选项卡2
-                    </span>
-                  </div>
+                </transition-stub>
+              </div>
+              <div
+                class="t-tabs__operations t-tabs__operations--right"
+              >
+                <transition-stub>
                   <!---->
-                </div>
+                </transition-stub>
+                <!---->
+              </div>
+              
+              <div
+                class="t-tabs__nav-container t-is-top"
+              >
                 <div
-                  class="t-tabs__nav-item t-size-m"
-                  draggable="false"
+                  class="t-tabs__nav-scroll"
                 >
                   <div
-                    class="t-tabs__nav-item-wrapper"
+                    class="t-tabs__nav-wrap t-is-smooth"
+                    style="transform: translate3d(0px, 0, 0);"
                   >
-                    <span
-                      class="t-tabs__nav-item-text-wrapper"
+                    <div
+                      class="t-tabs__bar t-is-top"
+                    />
+                    
+                    <div
+                      class="t-tabs__nav-item t-is-active t-size-m"
+                      draggable="false"
                     >
-                      选项卡3
-                    </span>
+                      <div
+                        class="t-tabs__nav-item-wrapper t-is-active"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡1
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-size-m"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡2
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-size-m"
+                      draggable="false"
+                    >
+                      <div
+                        class="t-tabs__nav-item-wrapper"
+                      >
+                        <span
+                          class="t-tabs__nav-item-text-wrapper"
+                        >
+                          选项卡3
+                        </span>
+                      </div>
+                      <!---->
+                    </div>
+                    
                   </div>
-                  <!---->
                 </div>
-                
               </div>
             </div>
           </div>
-        </div>
-      </div>
-      <div
-        class="t-tabs__content"
-      >
-        
-        <div
-          class="t-tab-panel"
-        >
-          
-          <p
-            style="padding: 25px;"
+          <div
+            class="t-tabs__content"
           >
-            选项卡1
-          </p>
+            
+            <div
+              class="t-tab-panel"
+            >
+              
+              <p
+                style="padding: 25px;"
+              >
+                选项卡1
+              </p>
+              
+            </div>
+            <!---->
+            <!---->
+            
+          </div>
           
         </div>
-        <!---->
-        <!---->
-        
       </div>
+      <!---->
       
-    </div>
-    <div
-      class="t-tabs"
-    >
       
       <div
-        class="t-tabs__header t-is-top"
+        class="t-space-item"
       >
         <div
-          class="t-tabs__nav"
+          class="t-tabs"
         >
           
           <div
-            class="t-tabs__operations t-tabs__operations--left"
-          >
-            <transition-stub>
-              <!---->
-            </transition-stub>
-          </div>
-          <div
-            class="t-tabs__operations t-tabs__operations--right"
-          >
-            <transition-stub>
-              <!---->
-            </transition-stub>
-            <!---->
-          </div>
-          
-          <div
-            class="t-tabs__nav-container t-tabs__nav--card t-is-top"
+            class="t-tabs__header t-is-top"
           >
             <div
-              class="t-tabs__nav-scroll"
+              class="t-tabs__nav"
             >
+              
               <div
-                class="t-tabs__nav-wrap t-is-smooth"
-                style="transform: translate3d(0px, 0, 0);"
+                class="t-tabs__operations t-tabs__operations--left"
               >
-                <!---->
-                
-                <div
-                  class="t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m"
-                  draggable="false"
-                >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
-                  >
-                    选项卡1
-                  </span>
+                <transition-stub>
                   <!---->
-                </div>
-                <div
-                  class="t-tabs__nav-item t-tabs__nav--card t-size-m"
-                  draggable="false"
-                >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
-                  >
-                    选项卡2
-                  </span>
+                </transition-stub>
+              </div>
+              <div
+                class="t-tabs__operations t-tabs__operations--right"
+              >
+                <transition-stub>
                   <!---->
-                </div>
+                </transition-stub>
+                <!---->
+              </div>
+              
+              <div
+                class="t-tabs__nav-container t-tabs__nav--card t-is-top"
+              >
                 <div
-                  class="t-tabs__nav-item t-tabs__nav--card t-size-m"
-                  draggable="false"
+                  class="t-tabs__nav-scroll"
                 >
-                  <span
-                    class="t-tabs__nav-item-text-wrapper"
+                  <div
+                    class="t-tabs__nav-wrap t-is-smooth"
+                    style="transform: translate3d(0px, 0, 0);"
                   >
-                    选项卡3
-                  </span>
-                  <!---->
+                    <!---->
+                    
+                    <div
+                      class="t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m"
+                      draggable="false"
+                    >
+                      <span
+                        class="t-tabs__nav-item-text-wrapper"
+                      >
+                        选项卡1
+                      </span>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-tabs__nav--card t-size-m"
+                      draggable="false"
+                    >
+                      <span
+                        class="t-tabs__nav-item-text-wrapper"
+                      >
+                        选项卡2
+                      </span>
+                      <!---->
+                    </div>
+                    <div
+                      class="t-tabs__nav-item t-tabs__nav--card t-size-m"
+                      draggable="false"
+                    >
+                      <span
+                        class="t-tabs__nav-item-text-wrapper"
+                      >
+                        选项卡3
+                      </span>
+                      <!---->
+                    </div>
+                    
+                  </div>
                 </div>
-                
               </div>
             </div>
           </div>
-        </div>
-      </div>
-      <div
-        class="t-tabs__content"
-      >
-        
-        <div
-          class="t-tab-panel"
-        >
-          
-          <p
-            style="padding: 25px;"
+          <div
+            class="t-tabs__content"
           >
-            选项卡1
-          </p>
+            
+            <div
+              class="t-tab-panel"
+            >
+              
+              <p
+                style="padding: 25px;"
+              >
+                选项卡1
+              </p>
+              
+            </div>
+            <!---->
+            <!---->
+            
+          </div>
           
         </div>
-        <!---->
-        <!---->
-        
       </div>
+      <!---->
+      
       
     </div>
   </div>
+  <!---->
+  
+  
 </div>
 `;
 
diff --git a/test/snap/__snapshots__/ssr.test.js.snap b/test/snap/__snapshots__/ssr.test.js.snap
index 2d824626b9..61d49eed03 100644
--- a/test/snap/__snapshots__/ssr.test.js.snap
+++ b/test/snap/__snapshots__/ssr.test.js.snap
@@ -1,6 +1,6 @@
 // Vitest Snapshot v1
 
-exports[`ssr snapshot test > ssr test ./src/affix/_example/base.vue 1`] = `"<div class=\\"affix-base\\"><div><div><!--[--><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->固钉<!--]--></span></button><!--]--></div></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/affix/_example/base.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div><div><!--[--><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->固钉<!--]--></span></button><!--]--></div></div></div><!----><!--]--><!--]--></div>"`;
 
 exports[`ssr snapshot test > ssr test ./src/affix/_example/container.vue 1`] = `"<div class=\\"affix-container\\" data-v-8141d1d6><div class=\\"affix-container-demo1\\" data-v-8141d1d6><div class=\\"background\\" data-v-8141d1d6><div data-v-8141d1d6><div><!--[--><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary\\" type=\\"button\\" data-v-8141d1d6><span class=\\"t-button__text\\"><!--[-->affixed :false<!--]--></span></button><!--]--></div></div></div></div></div>"`;
 
@@ -18,17 +18,17 @@ exports[`ssr snapshot test > ssr test ./src/alert/_example/title.vue 1`] = `"<di
 
 exports[`ssr snapshot test > ssr test ./src/anchor/_example/base.vue 1`] = `"<div id=\\"#default\\" class=\\"anchor-demo\\" style=\\"display:flex;\\" data-v-58502234><div style=\\"flex:1;\\" data-v-58502234></div><div data-v-58502234><div><!--[--><div class=\\"t-anchor t-size-m\\"><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-58502234><a href=\\"#基础锚点\\" title=\\"基础锚点\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">基础锚点</a><!----></div><div class=\\"t-anchor__item\\" data-v-58502234><a href=\\"#多级锚点\\" title=\\"多级锚点\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">多级锚点</a><!----></div><div class=\\"t-anchor__item\\" data-v-58502234><a href=\\"#指定容器锚点\\" title=\\"指定容器锚点\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">指定容器锚点</a><!----></div><div class=\\"t-anchor__item\\" data-v-58502234><a href=\\"#特定交互锚点\\" title=\\"特定交互锚点\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">特定交互锚点</a><!----></div><div class=\\"t-anchor__item\\" data-v-58502234><a href=\\"#不同尺寸的锚点\\" title=\\"不同尺寸的锚点\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">不同尺寸的锚点</a><!----></div><!--]--></div><!--]--></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/anchor/_example/container.vue 1`] = `"<div id=\\"#container\\" class=\\"anchor-demo anchor-container-demo\\" data-v-5085b42e><div class=\\"t-anchor t-size-m\\" id=\\"#default\\" data-v-5085b42e><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-1\\" title=\\"content-1\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-1</a><!----></div><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-2\\" title=\\"content-2\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-2</a><!----></div><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-3\\" title=\\"content-3\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-3</a><!----></div><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-4\\" title=\\"content-4\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-4</a><!----></div><!--]--></div><div id=\\"anchor-container\\" data-v-5085b42e><div id=\\"#content-1\\" class=\\"anchor-content-1\\" data-v-5085b42e>anchor-content-1</div><div id=\\"#content-2\\" class=\\"anchor-content-2\\" data-v-5085b42e>anchor-content-2</div><div id=\\"#content-3\\" class=\\"anchor-content-3\\" data-v-5085b42e>anchor-content-3</div><div id=\\"#content-4\\" class=\\"anchor-content-4\\" data-v-5085b42e>anchor-content-4</div><div id=\\"#content-5\\" class=\\"anchor-content-5\\" data-v-5085b42e>anchor-content-5</div></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/anchor/_example/container.vue 1`] = `"<div id=\\"#container\\" class=\\"anchor-demo anchor-container-demo\\" data-v-5085b42e><div class=\\"t-anchor t-size-m\\" id=\\"#default\\" data-v-5085b42e><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-1\\" title=\\"content-1\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-1</a><!----></div><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-2\\" title=\\"content-2\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-2</a><!----></div><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-3\\" title=\\"content-3\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-3</a><!----></div><div class=\\"t-anchor__item\\" data-v-5085b42e><a href=\\"##content-4\\" title=\\"content-4\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">content-4</a><!----></div><!--]--></div><div class=\\"t-space t-space-vertical\\" style=\\"gap:0px;\\" id=\\"anchor-container\\" data-v-5085b42e><!--[--><!--[--><div class=\\"t-space-item\\"><div id=\\"#content-1\\" class=\\"anchor-content-1\\" data-v-5085b42e>anchor-content-1</div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#content-2\\" class=\\"anchor-content-2\\" data-v-5085b42e>anchor-content-2</div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#content-3\\" class=\\"anchor-content-3\\" data-v-5085b42e>anchor-content-3</div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#content-4\\" class=\\"anchor-content-4\\" data-v-5085b42e>anchor-content-4</div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#content-5\\" class=\\"anchor-content-5\\" data-v-5085b42e>anchor-content-5</div></div><!----><!--]--><!--]--></div></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/anchor/_example/cursor.vue 1`] = `"<div class=\\"anchor-demo\\" data-v-0c89850e><div class=\\"t-anchor t-size-m\\" data-v-0c89850e><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><!--[--><div class=\\"test-cursor\\" data-v-0c89850e></div><!--]--></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/anchor/_example/cursor.vue 1`] = `"<div class=\\"t-space t-space-horizontal anchor-demo\\" style=\\"gap:16px;\\" data-v-0c89850e><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-anchor t-size-m\\" data-v-0c89850e><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><!--[--><div class=\\"test-cursor\\" data-v-0c89850e></div><!--]--></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\" data-v-0c89850e><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/anchor/_example/large.vue 1`] = `"<div id=\\"#large\\" class=\\"anchor-demo\\" data-v-4dca4868><div class=\\"t-anchor t-size-l\\" data-v-4dca4868><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/anchor/_example/large.vue 1`] = `"<div class=\\"t-space t-space-horizontal anchor-demo\\" style=\\"gap:16px;\\" id=\\"#large\\" data-v-4dca4868><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-anchor t-size-l\\" data-v-4dca4868><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\" data-v-4dca4868><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/anchor/_example/multiple.vue 1`] = `"<div id=\\"#multiple\\" class=\\"anchor-demo\\"><div class=\\"t-anchor t-size-m\\"><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\"><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!--[--><div class=\\"t-anchor__item\\"><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><!--]--></div><div class=\\"t-anchor__item\\"><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/anchor/_example/multiple.vue 1`] = `"<div class=\\"t-space t-space-horizontal anchor-demo\\" style=\\"gap:16px;\\" id=\\"#multiple\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-anchor t-size-m\\"><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\"><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!--[--><div class=\\"t-anchor__item\\"><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><!--]--></div><div class=\\"t-anchor__item\\"><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\"><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/anchor/_example/small.vue 1`] = `"<div id=\\"#small\\" class=\\"anchor-demo\\" data-v-804f4798><div class=\\"t-anchor t-size-s\\" data-v-804f4798><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/anchor/_example/small.vue 1`] = `"<div class=\\"t-space t-space-horizontal anchor-demo\\" style=\\"gap:16px;\\" id=\\"#small\\" data-v-804f4798><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-anchor t-size-s\\" data-v-804f4798><div class=\\"t-anchor__line\\"><div class=\\"t-anchor__line-cursor-wrapper\\" style=\\"\\"><div class=\\"t-anchor__line-cursor\\"></div></div></div><!--[--><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##default\\" title=\\"定义\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">定义</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##multiple\\" title=\\"服务功能\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">服务功能</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##small\\" title=\\"使用指南\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">使用指南</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##large\\" title=\\"创建签名\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建签名</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##container\\" title=\\"创建内容\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">创建内容</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##anchor-target-6\\" title=\\"保密协议\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">保密协议</a><!----></div><div class=\\"t-anchor__item\\" data-v-804f4798><a href=\\"##anchor-target-7\\" title=\\"其他\\" class=\\"t-anchor__item-link\\" target=\\"_self\\">其他</a><!----></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/anchor/_example/target.vue 1`] = `"<div id=\\"#anchor-target\\" class=\\"anchor-demo\\"><div id=\\"#anchor-target-1\\" class=\\"t-anchor__target\\"><!--[--> 定义 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div><div id=\\"#anchor-target-2\\" class=\\"t-anchor__target\\"><!--[--> 服务功能 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div><div id=\\"#anchor-target-3\\" class=\\"t-anchor__target\\"><!--[--> 使用指南 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div><div id=\\"#anchor-target-4\\" class=\\"t-anchor__target\\"><!--[--> 创建签名 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div><div id=\\"#anchor-target-5\\" class=\\"t-anchor__target\\"><!--[--> 创建内容 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div><div id=\\"#anchor-target-6\\" class=\\"t-anchor__target\\"><!--[--> 保密协议 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div><div id=\\"#anchor-target-7\\" class=\\"t-anchor__target\\"><!--[--> 其他 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/anchor/_example/target.vue 1`] = `"<div class=\\"t-space t-space-vertical anchor-demo\\" style=\\"gap:0px;\\" id=\\"#anchor-target\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-1\\" class=\\"t-anchor__target\\"><!--[--> 定义 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-2\\" class=\\"t-anchor__target\\"><!--[--> 服务功能 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-3\\" class=\\"t-anchor__target\\"><!--[--> 使用指南 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-4\\" class=\\"t-anchor__target\\"><!--[--> 创建签名 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-5\\" class=\\"t-anchor__target\\"><!--[--> 创建内容 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-6\\" class=\\"t-anchor__target\\"><!--[--> 保密协议 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div id=\\"#anchor-target-7\\" class=\\"t-anchor__target\\"><!--[--> 其他 <!--]--><!--[--><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-file-copy t-copy\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M4 1.92C4 1.34 4.52 1 5 1h4.37a1 1 0 01.71.3L13.71 5a1 1 0 01.29.7v6.38c0 .58-.52.92-1 .92H5c-.48 0-1-.34-1-.92V1.92zM5 2v10h8V6.01H9V2H5zm5 .65V5h2.32L10 2.65z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M2 5v9.01a1 1 0 001 1h8v-1H3V5H2z\\" fill-opacity=\\"0.9\\"></path></svg><!----><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
 exports[`ssr snapshot test > ssr test ./src/avatar/_example/adjust.vue 1`] = `"<div class=\\"demo-avatar\\" data-v-9a5c3c54><div class=\\"t-avatar t-avatar--circle\\" style=\\"\\" data-v-9a5c3c54><span style=\\"transform:;\\"><!--[-->王<!--]--></span></div><div class=\\"t-avatar t-avatar--circle\\" style=\\"\\" data-v-9a5c3c54><span style=\\"transform:;\\"><!--[-->王亿<!--]--></span></div><div class=\\"t-avatar t-avatar--circle\\" style=\\"\\" data-v-9a5c3c54><span style=\\"transform:;\\"><!--[-->王亿亿<!--]--></span></div></div>"`;
 
@@ -349,23 +349,23 @@ exports[`ssr snapshot test > ssr test ./src/drawer/_example/size.vue 1`] = `"<di
 
 exports[`ssr snapshot test > ssr test ./src/drawer/_example/size-draggable.vue 1`] = `"<div data-v-c9000ec0><!-- @click-cancel 和 :onClickCancel 两种写法都支持； :onClickOverlay 和 @click-overlay 两种写法都支持--><div class=\\"t-drawer t-drawer--right\\" style=\\"\\" tabindex=\\"0\\" data-v-c9000ec0><div class=\\"t-drawer__mask\\"></div><div class=\\"t-drawer__content-wrapper t-drawer__content-wrapper--right\\" style=\\"width:300px;height:;\\"><div class=\\"t-drawer__header\\">标题名称</div><!----><div class=\\"t-drawer__body narrow-scrollbar\\"><!--[--><p data-v-c9000ec0>抽屉的内容</p><!--]--></div><div class=\\"t-drawer__footer\\"><div style=\\"display:flex;justify-content:flex-start;\\"><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary t-drawer__confirm\\" type=\\"button\\"><span class=\\"t-button__text\\">确认</span></button><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-default t-drawer__cancel\\" type=\\"button\\"><span class=\\"t-button__text\\">取消</span></button><!----></div></div><div style=\\"z-index:1;position:absolute;background:transparent;width:16px;height:100%;cursor:col-resize;\\"></div></div></div><div class=\\"tdesign-radio-button\\" data-v-c9000ec0><div class=\\"t-radio-group t-size-m t-radio-group__outline\\" data-v-c9000ec0><!--[--><label class=\\"t-radio-button\\" data-v-c9000ec0><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"left\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->从左侧拖拽抽屉<!--]--><!--]--></span></label><label class=\\"t-radio-button t-is-checked\\" data-v-c9000ec0><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"right\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->从右侧拖拽抽屉<!--]--><!--]--></span></label><label class=\\"t-radio-button\\" data-v-c9000ec0><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"top\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->从上方拖拽抽屉<!--]--><!--]--></span></label><label class=\\"t-radio-button\\" data-v-c9000ec0><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"bottom\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->从下方拖拽抽屉<!--]--><!--]--></span></label><!--]--><!----></div></div><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default btn-top-margin\\" type=\\"button\\" data-v-c9000ec0><span class=\\"t-button__text\\"><!--[--> 打开抽屉 <!--]--></span></button></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/base.vue 1`] = `"<div class=\\"tdesign-demo-dropdown\\" data-v-31515850><!--[--><div class=\\"tdesign-demo-dropdown-trigger\\" data-v-31515850><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-31515850><span class=\\"t-button__text\\"><!--[--><span class=\\"tdesign-demo-dropdown__text\\" data-v-31515850> 下拉菜单 <svg class=\\"t-icon t-icon-chevron-down\\" style=\\"font-size:16;\\" data-v-31515850><use href=\\"#t-icon-chevron-down\\"></use></svg></span><!--]--></span></button></div><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/base.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[--><div class=\\"t-space t-space-horizontal\\" style=\\"gap:0px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"> 下拉菜单 </div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><svg class=\\"t-icon t-icon-chevron-down\\" style=\\"font-size:16;\\"><use href=\\"#t-icon-chevron-down\\"></use></svg></div><!----><!--]--><!--]--></div><!--]--></span></button></div><!----><!--]--><!--]--></div><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/button.vue 1`] = `"<div data-v-b123bb1e><!--[--><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\" data-v-b123bb1e><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/button.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->下拉菜单<!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/custom.vue 1`] = `"<div data-v-33c84f30><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-33c84f30><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/custom.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->下拉菜单<!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/disabled.vue 1`] = `"<div class=\\"tdesign-demo-dropdown\\" data-v-503db2fb><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-503db2fb><span class=\\"t-button__text\\"><!--[--><span class=\\"tdesign-demo-dropdown__text\\" data-v-503db2fb> 下拉菜单 <svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-down\\" style=\\"font-size:16;\\" data-v-503db2fb><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></span><!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/disabled.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[--><div class=\\"t-space t-space-horizontal\\" style=\\"gap:0px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"> 下拉菜单 </div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-down\\" style=\\"font-size:16;\\"><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></div><!----><!--]--><!--]--></div><!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/event.vue 1`] = `"<div data-v-699dc5ab><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-699dc5ab><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/event.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->下拉菜单<!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/long.vue 1`] = `"<div data-v-1c484a7b><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-1c484a7b><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/long.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->下拉菜单<!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/multiple.vue 1`] = `"<div class=\\"tdesign-demo-dropdown\\" data-v-cbef96e2><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-cbef96e2><span class=\\"t-button__text\\"><!--[--><span class=\\"tdesign-demo-dropdown__text\\" data-v-cbef96e2> 下拉菜单 <svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-down\\" style=\\"font-size:16;\\" data-v-cbef96e2><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></span><!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/multiple.vue 1`] = `"<div class=\\"t-space t-space-horizontal tdesign-demo-dropdown\\" style=\\"gap:16px;\\" data-v-cbef96e2><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\" data-v-cbef96e2><span class=\\"t-button__text\\"><!--[--><div class=\\"t-space t-space-horizontal tdesign-demo-dropdown__text\\" style=\\"gap:0px;\\" data-v-cbef96e2><!--[--><!--[--><div class=\\"t-space-item\\"> 下拉菜单 </div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-down\\" style=\\"font-size:16;\\" data-v-cbef96e2><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></div><!----><!--]--><!--]--></div><!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/slot.vue 1`] = `"<div><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]--></div>"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/slot.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-text t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[-->下拉菜单<!--]--></span></button><!----><!--]--></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/dropdown/_example/split.vue 1`] = `"<!--[--><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\" data-v-7fd82e2b><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]-->"`;
+exports[`ssr snapshot test > ssr test ./src/dropdown/_example/split.vue 1`] = `"<!--[--><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\"><span class=\\"t-button__text\\"><!--[--> 下拉菜单 <!--]--></span></button><!----><!--]-->"`;
 
 exports[`ssr snapshot test > ssr test ./src/form/_example/align.vue 1`] = `"<div data-v-3e048083><div class=\\"controls\\" data-v-3e048083><div class=\\"t-radio-group t-size-m t-radio-group--filled\\" data-v-3e048083><!--[--><label class=\\"t-radio-button\\" data-v-3e048083><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"left\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->左对齐<!--]--><!--]--></span></label><label class=\\"t-radio-button t-is-checked\\" data-v-3e048083><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"right\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->右对齐<!--]--><!--]--></span></label><label class=\\"t-radio-button\\" data-v-3e048083><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"top\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->顶部对齐<!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><form class=\\"t-form\\" data-v-3e048083><!--[--><div class=\\"t-form__item t-form-item__name\\" data-v-3e048083><div class=\\"t-form__label t-form__label--right\\" style=\\"width:60px;\\"><label for>姓名</label></div><div class=\\"t-form__controls\\" style=\\"margin-left:60px;\\"><div class=\\"t-form__controls-content\\"><!--[--><div class=\\"t-input__wrap\\" data-v-3e048083><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder=\\"请输入\\" type=\\"text\\" value><!----><!----><!----><!----></div><!----></div><!--]--><!----></div><!--[--><!----><!----><!--]--></div></div><div class=\\"t-form__item t-form-item__password\\" data-v-3e048083><div class=\\"t-form__label t-form__label--right\\" style=\\"width:60px;\\"><label for>密码</label></div><div class=\\"t-form__controls\\" style=\\"margin-left:60px;\\"><div class=\\"t-form__controls-content\\"><!--[--><div class=\\"t-input__wrap\\" data-v-3e048083><div class=\\"t-input t-input--suffix\\"><!----><!----><input class=\\"t-input__inner\\" placeholder=\\"请输入\\" type=\\"password\\" value><!----><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-browse-off t-input__suffix-clear\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M10.77 11.98l1.38 1.37.7-.7-9.7-9.7-.7.7 1.2 1.21a7.9 7.9 0 00-2.53 2.91L1 8l.12.23a7.72 7.72 0 009.65 3.75zM10 11.2A6.67 6.67 0 012.11 8c.56-1 1.34-1.83 2.26-2.43l1.08 1.09a2.88 2.88 0 003.9 3.9l.64.64zM6.21 7.42l2.37 2.37a1.88 1.88 0 01-2.37-2.37zM14.88 8.23L15 8l-.12-.23a7.73 7.73 0 00-9.35-3.86l.8.8A6.7 6.7 0 0113.9 8a6.87 6.87 0 01-2.02 2.26l.7.7a7.9 7.9 0 002.3-2.73z\\" fill-opacity=\\"0.9\\"></path><path fill=\\"currentColor\\" d=\\"M10.88 8c0 .37-.07.73-.2 1.06l-.82-.82.02-.24a1.88 1.88 0 00-2.12-1.86l-.82-.82A2.87 2.87 0 0110.88 8z\\" fill-opacity=\\"0.9\\"></path></svg></span></div><!----></div><!--]--><!----></div><!--[--><!----><!----><!--]--></div></div><div class=\\"t-form__item t-form-item__\\" style=\\"padding-top:8px;\\" data-v-3e048083><div class=\\"t-form__label t-form__label--right\\" style=\\"width:60px;\\"><label for></label></div><div class=\\"t-form__controls\\" style=\\"margin-left:60px;\\"><div class=\\"t-form__controls-content\\"><!--[--><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary\\" type=\\"submit\\" data-v-3e048083><span class=\\"t-button__text\\"><!--[-->登录<!--]--></span></button><!--]--><!----></div><!--[--><!----><!----><!--]--></div></div><!--]--></form></div>"`;
 
@@ -645,21 +645,21 @@ exports[`ssr snapshot test > ssr test ./src/notification/_example/type.vue 1`] =
 
 exports[`ssr snapshot test > ssr test ./src/notification/_example/type4Fn.vue 1`] = `"<div data-v-2af5ef59><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\" data-v-2af5ef59><span class=\\"t-button__text\\"><!--[-->信息<!--]--></span></button><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\" data-v-2af5ef59><span class=\\"t-button__text\\"><!--[-->成功<!--]--></span></button><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\" data-v-2af5ef59><span class=\\"t-button__text\\"><!--[-->警告<!--]--></span></button><button class=\\"t-button t-size-m t-button--variant-outline t-button--theme-default\\" type=\\"button\\" data-v-2af5ef59><span class=\\"t-button__text\\"><!--[-->错误<!--]--></span></button></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/base.vue 1`] = `"<div><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number t-is-current\\">1</li><!----><!--[--><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">20</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div><br><br><!-- :pageSizeOptions=\\"[]\\" 表示隐藏分页器选项 --><!-- 非受控用法，代码有效，勿删。 --><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 36 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"10 条/页\\"><span class=\\"t-input__input-pre\\">10 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-page-first\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M12.4 4.46l-.91-.92L7.03 8l4.46 4.46.92-.92L8.86 8l3.55-3.54zM4.8 4v8h1.3V4H4.8z\\" fill-opacity=\\"0.9\\"></path></svg></div><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><!----><!----><!--[--><li class=\\"t-pagination__number\\">1</li><li class=\\"t-pagination__number t-is-current\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><!--]--><!----><!----></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-page-last\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3.6 11.54l.91.92L8.97 8 4.51 3.54l-.92.92L7.14 8l-3.55 3.54zm7.6.46V4H9.9v8h1.3z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/base.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:24px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number t-is-current\\">1</li><!----><!--[--><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">20</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 36 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"10 条/页\\"><span class=\\"t-input__input-pre\\">10 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-page-first\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M12.4 4.46l-.91-.92L7.03 8l4.46 4.46.92-.92L8.86 8l3.55-3.54zM4.8 4v8h1.3V4H4.8z\\" fill-opacity=\\"0.9\\"></path></svg></div><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><!----><!----><!--[--><li class=\\"t-pagination__number\\">1</li><li class=\\"t-pagination__number t-is-current\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><!--]--><!----><!----></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-page-last\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3.6 11.54l.91.92L8.97 8 4.51 3.54l-.92.92L7.14 8l-3.55 3.54zm7.6.46V4H9.9v8h1.3z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/jump.vue 1`] = `"<div><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 101 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"20 条/页\\"><span class=\\"t-input__input-pre\\">20 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><!----><!----><!--[--><li class=\\"t-pagination__number t-is-current\\">1</li><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><li class=\\"t-pagination__number\\">6</li><!--]--><!----><!----></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><div class=\\"t-pagination__jump\\">跳至<div class=\\"t-input-adornment t-input-adornment--append\\"><!----><div class=\\"t-input-number t-size-m t-input-number--normal t-pagination__input\\"><!----><div class=\\"t-input__wrap\\" unselectable=\\"off\\"><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder type=\\"text\\" autocomplete=\\"off\\" value=\\"1\\"><!----><!----><!----><!----></div><!----></div><!----><!----></div><span class=\\"t-input-adornment__append\\">/ 6 页</span></div></div></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/jump.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 101 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"20 条/页\\"><span class=\\"t-input__input-pre\\">20 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><!----><!----><!--[--><li class=\\"t-pagination__number t-is-current\\">1</li><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><li class=\\"t-pagination__number\\">6</li><!--]--><!----><!----></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><div class=\\"t-pagination__jump\\">跳至<div class=\\"t-input-adornment t-input-adornment--append\\"><!----><div class=\\"t-input-number t-size-m t-input-number--normal t-pagination__input\\"><!----><div class=\\"t-input__wrap\\" unselectable=\\"off\\"><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder type=\\"text\\" autocomplete=\\"off\\" value=\\"1\\"><!----><!----><!----><!----></div><!----></div><!----><!----></div><span class=\\"t-input-adornment__append\\">/ 6 页</span></div></div></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/mini.vue 1`] = `"<div><div class=\\"t-pagination t-size-s\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number t-is-current\\">1</li><!----><!--[--><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">20</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/mini.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-s\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number t-is-current\\">1</li><!----><!--[--><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">20</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/more.vue 1`] = `"<div class=\\"tdesign-demo-block-row\\"><span>展示首尾页码省略</span><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number\\">1</li><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><!--[--><li class=\\"t-pagination__number\\">10</li><li class=\\"t-pagination__number\\">11</li><li class=\\"t-pagination__number t-is-current\\">12</li><li class=\\"t-pagination__number\\">13</li><li class=\\"t-pagination__number\\">14</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">20</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div><span>不展示首尾页码省略</span><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><!----><!----><!--[--><li class=\\"t-pagination__number\\">10</li><li class=\\"t-pagination__number\\">11</li><li class=\\"t-pagination__number t-is-current\\">12</li><li class=\\"t-pagination__number\\">13</li><li class=\\"t-pagination__number\\">14</li><!--]--><!----><!----></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/more.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><span>展示首尾页码省略</span></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number\\">1</li><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><!--[--><li class=\\"t-pagination__number\\">10</li><li class=\\"t-pagination__number\\">11</li><li class=\\"t-pagination__number t-is-current\\">12</li><li class=\\"t-pagination__number\\">13</li><li class=\\"t-pagination__number\\">14</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">20</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><span>不展示首尾页码省略</span></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><!----><!----><!--[--><li class=\\"t-pagination__number\\">10</li><li class=\\"t-pagination__number\\">11</li><li class=\\"t-pagination__number t-is-current\\">12</li><li class=\\"t-pagination__number\\">13</li><li class=\\"t-pagination__number\\">14</li><!--]--><!----><!----></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/page-num.vue 1`] = `"<div><div class=\\"t-pagination t-size-m\\" show-sizer><div class=\\"t-pagination__total\\">共 645 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"每页 30 条\\"><span class=\\"t-input__input-pre\\">每页 30 条</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number t-is-current\\">1</li><!----><!--[--><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">22</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/page-num.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\" show-sizer><div class=\\"t-pagination__total\\">共 645 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"每页 30 条\\"><span class=\\"t-input__input-pre\\">每页 30 条</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number t-is-current\\">1</li><!----><!--[--><li class=\\"t-pagination__number\\">2</li><li class=\\"t-pagination__number\\">3</li><li class=\\"t-pagination__number\\">4</li><li class=\\"t-pagination__number\\">5</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">22</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/simple.vue 1`] = `"<div><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><div class=\\"t-pagination__jump\\">跳至<div class=\\"t-input-adornment t-input-adornment--append\\"><!----><div class=\\"t-input-number t-size-m t-input-number--normal t-pagination__input\\"><!----><div class=\\"t-input__wrap\\" unselectable=\\"off\\"><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder type=\\"text\\" autocomplete=\\"off\\" value=\\"1\\"><!----><!----><!----><!----></div><!----></div><!----><!----></div><span class=\\"t-input-adornment__append\\">/ 20 页</span></div></div><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/simple.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><div class=\\"t-pagination__jump\\">跳至<div class=\\"t-input-adornment t-input-adornment--append\\"><!----><div class=\\"t-input-number t-size-m t-input-number--normal t-pagination__input\\"><!----><div class=\\"t-input__wrap\\" unselectable=\\"off\\"><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder type=\\"text\\" autocomplete=\\"off\\" value=\\"1\\"><!----><!----><!----><!----></div><!----></div><!----><!----></div><span class=\\"t-input-adornment__append\\">/ 20 页</span></div></div><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/simple-mini.vue 1`] = `"<div><div class=\\"t-pagination t-size-s\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><div class=\\"t-pagination__jump\\">跳至<div class=\\"t-input-adornment t-input-adornment--append\\"><!----><div class=\\"t-input-number t-size-s t-input-number--normal t-pagination__input\\"><!----><div class=\\"t-input__wrap\\" unselectable=\\"off\\"><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder type=\\"text\\" autocomplete=\\"off\\" value=\\"1\\"><!----><!----><!----><!----></div><!----></div><!----><!----></div><span class=\\"t-input-adornment__append\\">/ 20 页</span></div></div><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/simple-mini.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-s\\"><div class=\\"t-pagination__total\\">共 100 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-size-s t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"5 条/页\\"><span class=\\"t-input__input-pre\\">5 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev t-is-disabled\\" disabled><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><div class=\\"t-pagination__jump\\">跳至<div class=\\"t-input-adornment t-input-adornment--append\\"><!----><div class=\\"t-input-number t-size-s t-input-number--normal t-pagination__input\\"><!----><div class=\\"t-input__wrap\\" unselectable=\\"off\\"><div class=\\"t-input\\"><!----><!----><input class=\\"t-input__inner\\" placeholder type=\\"text\\" autocomplete=\\"off\\" value=\\"1\\"><!----><!----><!----><!----></div><!----></div><!----><!----></div><span class=\\"t-input-adornment__append\\">/ 20 页</span></div></div><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/pagination/_example/total.vue 1`] = `"<div><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 685 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"10 条/页\\"><span class=\\"t-input__input-pre\\">10 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number\\">1</li><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><!--[--><li class=\\"t-pagination__number\\">10</li><li class=\\"t-pagination__number\\">11</li><li class=\\"t-pagination__number t-is-current\\">12</li><li class=\\"t-pagination__number\\">13</li><li class=\\"t-pagination__number\\">14</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">69</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/pagination/_example/total.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-pagination t-size-m\\"><div class=\\"t-pagination__total\\">共 685 项数据</div><div class=\\"t-select__wrap t-pagination__select\\"><!--[--><div class=\\"t-input__wrap t-select-input t-select\\" style=\\"\\"><div class=\\"t-input t-is-default t-is-readonly t-input--prefix t-input--suffix t-input--auto-width\\"><!----><div class=\\"t-input__prefix\\"><!--[--><!----><!----><!--]--></div><input class=\\"t-input__inner\\" readonly placeholder=\\"请选择\\" type=\\"text\\" unselectable=\\"on\\" value=\\"10 条/页\\"><span class=\\"t-input__input-pre\\">10 条/页</span><!----><!----><span class=\\"t-input__suffix t-input__suffix-icon\\"><svg class=\\"t-fake-arrow t-select__right-icon\\" width=\\"16\\" height=\\"16\\" viewbox=\\"0 0 16 16\\" fill=\\"none\\" xmlns=\\"http://www.w3.org/2000/svg\\" style=\\"\\"><path d=\\"M3.75 5.7998L7.99274 10.0425L12.2361 5.79921\\" stroke=\\"black\\" stroke-opacity=\\"0.9\\" stroke-width=\\"1.3\\"></path></svg></span></div><!----></div><!----><!--]--></div><!----><div class=\\"t-pagination__btn t-pagination__btn-prev\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-left\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M9.54 3.54l.92.92L6.92 8l3.54 3.54-.92.92L5.08 8l4.46-4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><ul class=\\"t-pagination__pager\\"><li class=\\"t-pagination__number\\">1</li><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><!--[--><li class=\\"t-pagination__number\\">10</li><li class=\\"t-pagination__number\\">11</li><li class=\\"t-pagination__number t-is-current\\">12</li><li class=\\"t-pagination__number\\">13</li><li class=\\"t-pagination__number\\">14</li><!--]--><li class=\\"t-pagination__number t-pagination__number--more\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-ellipsis\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M3 9a1 1 0 110-2 1 1 0 010 2zM7 8a1 1 0 102 0 1 1 0 00-2 0zM12 8a1 1 0 102 0 1 1 0 00-2 0z\\" fill-opacity=\\"0.9\\"></path></svg></li><li class=\\"t-pagination__number\\">69</li></ul><!----><div class=\\"t-pagination__btn t-pagination__btn-next\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-chevron-right\\" style=\\"\\"><path fill=\\"currentColor\\" d=\\"M6.46 12.46l-.92-.92L9.08 8 5.54 4.46l.92-.92L10.92 8l-4.46 4.46z\\" fill-opacity=\\"0.9\\"></path></svg></div><!----><!----></div></div><!----><!--]--><!--]--></div>"`;
 
 exports[`ssr snapshot test > ssr test ./src/popconfirm/_example/base.vue 1`] = `"<div class=\\"popconfirm-demo\\" data-v-75e70bce><div class=\\"tdesign-demo-block\\" data-v-75e70bce><div class=\\"demo-item\\" data-v-75e70bce><!--[--><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary\\" type=\\"button\\" data-v-75e70bce><span class=\\"t-button__text\\"><!--[-->删除订单<!--]--></span></button><!----><!--]--></div><!-- 受控用法：自由控制浮层显示与否 --><div class=\\"demo-item\\" data-v-75e70bce><!--[--><button class=\\"t-button t-size-m t-button--variant-base t-button--theme-primary\\" type=\\"button\\" data-v-75e70bce><span class=\\"t-button__text\\"><!--[-->提交审核<!--]--></span></button><!----><!--]--></div></div></div>"`;
 
@@ -1024,25 +1024,25 @@ exports[`ssr snapshot test > ssr test ./src/table/_example/tree-select.vue 1`] =
 
 exports[`ssr snapshot test > ssr test ./src/table/_example/virtual-scroll.vue 1`] = `"<div class=\\"demo-container\\"><div class=\\"item\\"><div class=\\"t-table\\" style=\\"position:relative;\\"><!----><!----><div class=\\"t-table__content\\" style=\\"height:200px;\\"><div class=\\"t-table__virtual-scroll-cursor\\" style=\\"transform:translate(0, 48000px);-ms-transform:translate(0, 48000px);-moz-transform:translate(0, 48000px);-webkit-transform:translate(0, 48000px);\\"></div><table class=\\"t-table--layout-fixed t-table--full-height\\" style=\\"width:;\\"><colgroup><!--[--><col style=\\"\\"><col style=\\"\\"><col style=\\"\\"><col style=\\"\\"><!--]--></colgroup><thead class=\\"t-table__header\\"><!--[--><tr><!--[--><th data-colkey=\\"id\\" class=\\"t-table__th-id\\" style=\\"\\"><div class=\\"t-table__th-cell-inner\\">id</div></th><th data-colkey=\\"instance\\" class=\\"t-table__th-instance\\" style=\\"\\"><div class=\\"t-table__th-cell-inner\\">集群名称</div></th><th data-colkey=\\"survivalTime\\" class=\\"t-table__th-survivalTime\\" style=\\"\\"><div class=\\"t-table__th-cell-inner\\">存活时间(s)</div></th><th data-colkey=\\"owner\\" class=\\"t-table__th-owner\\" style=\\"\\"><div class=\\"t-table__th-cell-inner\\">管理员</div></th><!--]--></tr><!--]--></thead><tbody class=\\"t-table__body\\" style=\\"transform:translate(0, 0px);-ms-transform:translate(0, 0px);-moz-transform:translate(0, 0px);-webkit-transform:translate(0, 0px);\\"><tr class=\\"t-table__empty-row\\"><td colspan=\\"4\\"><div class=\\"t-table__empty\\" style=\\"\\">暂无数据</div></td></tr></tbody><!----></table></div><!----><!----><!----><!----><!----><div class=\\"t-table__pagination-wrap\\" style=\\"opacity:1;\\"><!----></div><div class=\\"t-table__resize-line\\" style=\\"display:none;left:10px;height:10px;bottom:0;\\"></div></div></div></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/ban.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\"><div><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 常规型 <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 卡片型 <!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-is-disabled t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-disabled\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1的内容</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/ban.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:24px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->常规型<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->卡片型<!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-is-disabled t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-disabled\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1的内容</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/base.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1的内容，使用 t-tab-panel 渲染</p><!--]--></div><div class=\\"t-tab-panel\\" style=\\"display:none;\\"><!--[--><p style=\\"padding:25px;\\">选项卡2的内容，使用 t-tab-panel 渲染</p><!--]--></div><!----><!--]--></div><!--]--></div><!-- 方式二：使用 list 定义 Tab --><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡一</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡二</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡三</span></div><!----></div><!--]--></div></div></div></div></div><!--[--><div class=\\"t-tab-panel\\"><p style=\\"padding: 25px\\">这是选项卡一的内容，使用 t-tabs 渲染</p></div><!----><!----><!--]--><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/base.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:24px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1的内容，使用 t-tab-panel 渲染</p><!--]--></div><div class=\\"t-tab-panel\\" style=\\"display:none;\\"><!--[--><p style=\\"padding:25px;\\">选项卡2的内容，使用 t-tab-panel 渲染</p><!--]--></div><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡一</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡二</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡三</span></div><!----></div><!--]--></div></div></div></div></div><!--[--><div class=\\"t-tab-panel\\"><p style=\\"padding: 25px\\">这是选项卡一的内容，使用 t-tabs 渲染</p></div><!----><!----><!--]--><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/combination.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\" style=\\"width:100%;\\"><div><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 常规型 <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 卡片型 <!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡4</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡5</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡6</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡7</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡8</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡9</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡10</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡11</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡12</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡13</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡14</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡15</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡16</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡17</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡18</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡19</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡20</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/combination.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:24px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->常规型<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->卡片型<!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡4</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡5</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡6</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡7</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡8</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡9</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡10</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡11</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡12</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡13</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡14</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡15</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡16</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡17</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡18</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡19</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡20</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/custom.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\" style=\\"width:100%;\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"min-height:48px;\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><div class=\\"t-tabs__add-btn t-tabs__btn t-size-m\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-add\\" style=\\"\\"><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></div></div><!--]--><div class=\\"t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><!----><!--[--><div class=\\"t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡1</span><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-close remove-btn\\" style=\\"\\"><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></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡2</span><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-close remove-btn\\" style=\\"\\"><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></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">原有选项卡1内容</p><!--]--></div><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/custom.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"min-height:48px;\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><div class=\\"t-tabs__add-btn t-tabs__btn t-size-m\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-add\\" style=\\"\\"><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></div></div><!--]--><div class=\\"t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><!----><!--[--><div class=\\"t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡1</span><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-close remove-btn\\" style=\\"\\"><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></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡2</span><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-close remove-btn\\" style=\\"\\"><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></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">原有选项卡1内容</p><!--]--></div><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/drag-sort.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\"><div><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 常规型 <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 卡片型 <!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"true\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"true\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"true\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1内容</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/drag-sort.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:24px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->常规型<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->卡片型<!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"true\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"true\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"true\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1内容</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/icon.vue 1`] = `"<div class=\\"t-demo-tabs\\"><div class=\\"t-demo-tabs__desc\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 常规型 <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> 卡片型 <!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\"><!--[--><svg class=\\"t-icon t-icon-home tabs-icon-margin\\" style=\\"\\"><use href=\\"#t-icon-home\\"></use></svg> 首页 <!--]--></span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\"><!--[--><svg class=\\"t-icon t-icon-calendar tabs-icon-margin\\" style=\\"\\"><use href=\\"#t-icon-calendar\\"></use></svg> 日程 <!--]--></span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\"><!--[--><svg class=\\"t-icon t-icon-layers tabs-icon-margin\\" style=\\"\\"><use href=\\"#t-icon-layers\\"></use></svg> 事项 <!--]--></span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">normal选项卡1内容</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/icon.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"normal\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->常规型<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"card\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->卡片型<!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\"><!--[--><svg class=\\"t-icon t-icon-home tabs-icon-margin\\" style=\\"\\"><use href=\\"#t-icon-home\\"></use></svg> 首页 <!--]--></span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\"><!--[--><svg class=\\"t-icon t-icon-calendar tabs-icon-margin\\" style=\\"\\"><use href=\\"#t-icon-calendar\\"></use></svg> 日程 <!--]--></span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\"><!--[--><svg class=\\"t-icon t-icon-layers tabs-icon-margin\\" style=\\"\\"><use href=\\"#t-icon-layers\\"></use></svg> 事项 <!--]--></span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">normal选项卡1内容</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/operation.vue 1`] = `"<div class=\\"t-demo-tabs\\"><div class=\\"t-demo-tabs__desc\\"><p>可以动态增加选项卡，仅支持卡片型</p></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"min-height:48px;\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><div class=\\"t-tabs__add-btn t-tabs__btn t-size-m\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-add\\" style=\\"\\"><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></div></div><!--]--><div class=\\"t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><!----><!--[--><div class=\\"t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡</span><!----></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡</span><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-close remove-btn\\" style=\\"\\"><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></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">原有选项卡内容</p><!--]--></div><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/operation.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><p>可以动态增加选项卡，仅支持卡片型</p></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"min-height:48px;\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><div class=\\"t-tabs__add-btn t-tabs__btn t-size-m\\"><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-add\\" style=\\"\\"><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></div></div><!--]--><div class=\\"t-tabs__nav-container t-tabs__nav--card t-is-top t-is-addable\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><!----><!--[--><div class=\\"t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡</span><!----></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">原有选项卡</span><svg fill=\\"none\\" viewbox=\\"0 0 16 16\\" width=\\"1em\\" height=\\"1em\\" class=\\"t-icon t-icon-close remove-btn\\" style=\\"\\"><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></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">原有选项卡内容</p><!--]--></div><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/position.vue 1`] = `"<div class=\\"t-demo-tabs\\"><div class=\\"t-demo-tabs__desc\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"top\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> top <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"right\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> right <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"bottom\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> bottom <!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"left\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[--> left <!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/position.vue 1`] = `"<div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-radio-group t-size-m t-radio-group--filled\\"><!--[--><label class=\\"t-radio-button t-is-checked\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name checked value=\\"top\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->top<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"right\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->right<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"bottom\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->bottom<!--]--><!--]--></span></label><label class=\\"t-radio-button\\"><input type=\\"radio\\" class=\\"t-radio-button__former\\" name value=\\"left\\"><span class=\\"t-radio-button__input\\"></span><span class=\\"t-radio-button__label\\"><!--[--><!--[-->left<!--]--><!--]--></span></label><!--]--><div style=\\"width:0px;left:0px;\\" class=\\"t-radio-group__bg-block\\"></div></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/size.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\"><div class=\\"tdesign-demo-block-column\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-l\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-l\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-l\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/size.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-l\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-l\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-l\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
-exports[`ssr snapshot test > ssr test ./src/tabs/_example/theme.vue 1`] = `"<div class=\\"tdesign-demo-block-column-large\\"><div class=\\"tdesign-demo-block-column\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-tabs__nav--card t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><!----><!--[--><div class=\\"t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span><!----></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span><!----></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div></div>"`;
+exports[`ssr snapshot test > ssr test ./src/tabs/_example/theme.vue 1`] = `"<div class=\\"t-space t-space-horizontal\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-space t-space-vertical\\" style=\\"gap:16px;\\"><!--[--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><div class=\\"t-tabs__bar t-is-top\\" style=\\"\\"></div><!--[--><div class=\\"t-tabs__nav-item t-is-active t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper t-is-active\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span></div><!----></div><div class=\\"t-tabs__nav-item t-size-m\\" draggable=\\"false\\"><div class=\\"t-tabs__nav-item-wrapper\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span></div><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--[--><div class=\\"t-space-item\\"><div class=\\"t-tabs\\"><!--[--><div class=\\"t-tabs__header t-is-top\\"><div class=\\"t-tabs__nav\\" style=\\"\\"><!--[--><div class=\\"t-tabs__operations t-tabs__operations--left\\"><!----></div><div class=\\"t-tabs__operations t-tabs__operations--right\\"><!----><!----></div><!--]--><div class=\\"t-tabs__nav-container t-tabs__nav--card t-is-top\\"><div class=\\"t-tabs__nav-scroll\\"><div class=\\"t-tabs__nav-wrap t-is-smooth\\" style=\\"transform:translate3d(0px, 0, 0);\\"><!----><!--[--><div class=\\"t-tabs__nav-item t-tabs__nav--card t-is-active t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡1</span><!----></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡2</span><!----></div><div class=\\"t-tabs__nav-item t-tabs__nav--card t-size-m\\" draggable=\\"false\\"><span class=\\"t-tabs__nav-item-text-wrapper\\">选项卡3</span><!----></div><!--]--></div></div></div></div></div><div class=\\"t-tabs__content\\"><!--[--><div class=\\"t-tab-panel\\"><!--[--><p style=\\"padding:25px;\\">选项卡1</p><!--]--></div><!----><!----><!--]--></div><!--]--></div></div><!----><!--]--><!--]--></div></div><!----><!--]--><!--]--></div>"`;
 
 exports[`ssr snapshot test > ssr test ./src/tag/_example/base.vue 1`] = `"<div data-v-307c55f7><div class=\\"tag-demo\\" data-v-307c55f7><span class=\\"t-tag t-tag--default t-tag--dark t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签一<!--]--><!----></span><a href=\\"https://www.tencent.com/zh-cn\\" target=\\"_blank\\" data-v-307c55f7><span class=\\"t-tag t-tag--default t-tag--dark t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->超链接<!--]--><!----></span></a></div><div class=\\"tag-demo\\" data-v-307c55f7><span class=\\"t-tag t-tag--primary t-tag--dark t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签一<!--]--><!----></span><span class=\\"t-tag t-tag--success t-tag--dark t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签二<!--]--><!----></span><span class=\\"t-tag t-tag--warning t-tag--dark t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签三<!--]--><!----></span><span class=\\"t-tag t-tag--danger t-tag--dark t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签四<!--]--><!----></span></div><div class=\\"tag-demo light\\" data-v-307c55f7><span class=\\"t-tag t-tag--primary t-tag--light t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签一<!--]--><!----></span><span class=\\"t-tag t-tag--success t-tag--light t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签二<!--]--><!----></span><span class=\\"t-tag t-tag--warning t-tag--light t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签三<!--]--><!----></span><span class=\\"t-tag t-tag--danger t-tag--light t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签四<!--]--><!----></span></div><div class=\\"tag-demo\\" data-v-307c55f7><span class=\\"t-tag t-tag--primary t-tag--outline t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签一<!--]--><!----></span><span class=\\"t-tag t-tag--success t-tag--outline t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签二<!--]--><!----></span><span class=\\"t-tag t-tag--warning t-tag--outline t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签三<!--]--><!----></span><span class=\\"t-tag t-tag--danger t-tag--outline t-size-m\\" style=\\"\\" data-v-307c55f7><!----><!--[-->标签四<!--]--><!----></span></div></div>"`;