feat: extra插槽

stories/Card.stories.ts

@@ -1,17 +1,28 @@
+/*
+ * @Author: zhaojinfeng 121016171@qq.com
+ * @Date: 2023-07-10 14:39:45
+ * @LastEditors: zhaojinfeng 121016171@qq.com
+ * @LastEditTime: 2023-07-13 16:23:26
+ * @FilePath: \uni\stories\Card.stories.ts
+ * @Description:
+ *
+ */
 import type { Meta, StoryObj } from '@storybook/vue3'
 import ThCard from '../packages/card/index.vue'
 import ThCardTitle from '../packages/card-title/index.vue'
+import ThCardText from '../packages/card-text/index.vue'
+import ThTag from '../packages/tag/index.vue'
 
 const meta = {
   title: '卡片/Card',
   component: ThCard,
   tags: ['autodocs'],
-  render: (args: any) => ({
+  render: args => ({
     components: { ThCard },
     setup() {
       return { args }
     },
-    template: '<div w-full><th-card /></div>',
+    template: '<th-card :no-shadow="args.noShadow" />',
   }),
 } satisfies Meta<typeof ThCard>
 export default meta
@@ -19,13 +30,16 @@ export default meta
 type Story = StoryObj<typeof meta>
 
 export const Title: Story = {
+  args: {
+    noShadow: false,
+  },
   render: (args: any) => ({
     components: { ThCard, ThCardTitle },
     setup() {
       return { args }
     },
     template: `
-    <th-card>
+    <th-card :no-shadow="args.noShadow">
     <th-card-title>
     Title
     </th-card-title>
@@ -33,3 +47,31 @@ export const Title: Story = {
     `,
   }),
 }
+
+export const TitleExtra: Story = {
+  render: args => ({
+    components: { ThCard, ThCardText, ThTag },
+    setup() {
+      return { args }
+    },
+    template: `
+    <th-card>
+    <th-card-text label="Label">
+    Text
+    </th-card-text>
+    <th-card-text label="Label">
+    Text
+    </th-card-text>
+    <th-card-text label="Label">
+    Text
+    </th-card-text>
+    <th-card-text label="Label">
+    Text
+    </th-card-text>
+    <template #extra>
+    <th-tag text="标签" />
+    </template>
+    </th-card>
+    `,
+  }),
+}