fix(CellGroup): resolved bordered invalid (#1010)

* fix(CellGroup): resolved bordered invalid * test: update snapshots
Tencent · Aug 15, 2023 · ac7edf8 · ac7edf8
1 parent 023a2e3
commit ac7edf8
Show file tree

Hide file tree

Showing 8 changed files with 820 additions and 758 deletions.
diff --git a/src/cell/__test__/__snapshots__/demo.test.jsx.snap b/src/cell/__test__/__snapshots__/demo.test.jsx.snap
diff --git a/src/cell/cell-group-props.ts b/src/cell/cell-group-props.ts
@@ -9,7 +9,10 @@ import { PropType } from 'vue';
 
 export default {
   /** 是否显示组边框 */
-  bordered: Boolean,
+  bordered: {
+    type: Boolean,
+    default: false,
+  },
   /** 单元格组风格 */
   theme: {
     type: String as PropType<TdCellGroupProps['theme']>,

diff --git a/src/cell/cell-group.vue b/src/cell/cell-group.vue
@@ -1,15 +1,15 @@
 <template>
-  <div :class="rootClass">
-    <div v-if="title" :class="`${name}__title`">
-      <slot name="title">{{ title }}</slot>
-    </div>
-
+  <div v-if="titleContent" :class="`${name}__title`">
+    <t-node :content="titleContent" />
+  </div>
+  <div :class="contentClass">
     <slot />
   </div>
 </template>
 
 <script lang="ts">
-import { defineProps, computed } from 'vue';
+import { defineProps, computed, getCurrentInstance } from 'vue';
+import { renderTNode, TNode } from '../shared';
 import CellGroupProps from './cell-group-props';
 import config from '../config';
 
@@ -18,10 +18,13 @@ const name = `${prefix}-cell-group`;
 
 export default {
   name,
+  components: { TNode },
 };
 </script>
 
 <script lang="ts" setup>
 const props = defineProps(CellGroupProps);
-const rootClass = computed(() => [name, `${name}--${props.theme}`]);
+const internalInstance = getCurrentInstance();
+const titleContent = computed(() => renderTNode(internalInstance, 'title'));
+const contentClass = computed(() => [name, `${name}--${props.theme}`, { [`${name}--bordered`]: props.bordered }]);
 </script>
diff --git a/src/cell/cell.en-US.md b/src/cell/cell.en-US.md
@@ -28,7 +28,7 @@ click | `(context: { e: MouseEvent })` | Typescript：`string \| TNode`。[see m
 
 name | type | default | description | required
 -- | -- | -- | -- | --
-bordered | Boolean | - | \- | N
+bordered | Boolean | false | \- | N
 theme | String | default | `0.15.0`。options：default/card | N
 title | String | - | \- | N
 

diff --git a/src/cell/cell.md b/src/cell/cell.md
@@ -28,7 +28,7 @@ click | `(context: { e: MouseEvent })` | 右侧内容。TS 类型：`string \| T
 
 名称 | 类型 | 默认值 | 说明 | 必传
 -- | -- | -- | -- | --
-bordered | Boolean | - | 是否显示组边框 | N
+bordered | Boolean | false | 是否显示组边框 | N
 theme | String | default | `0.15.0`。单元格组风格。可选项：default/card | N
 title | String | - | 单元格组标题 | N
 

diff --git a/src/cell/type.ts b/src/cell/type.ts
@@ -64,6 +64,7 @@ export interface TdCellProps {
 export interface TdCellGroupProps {
   /**
    * 是否显示组边框
+   * @default false
    */
   bordered?: boolean;
   /**