docs(text): add document of text component

packages/ui-vue/components/text/src/text.component.tsx

@@ -4,14 +4,14 @@ import { TextProps, textProps } from './text.props';
 export default defineComponent({
     name: 'FText',
     props: textProps,
-    emits: [],
+    emits: ['update:modelValue',],
     setup(props: TextProps, context: SetupContext) {
         const isTextArea = ref(true);
         const autoSize = ref(true);
         const textAlginment = ref('');
         const height = ref(0);
         const maxHeight = ref(0);
-
+        const modelValue = ref(props.modelValue);
         const textClass = computed(() => ({
             'f-form-control-text': !isTextArea.value,
             'f-form-context-textarea': isTextArea,
@@ -33,7 +33,7 @@ export default defineComponent({
         return () => {
             return (
                 <span class={textClass.value} style={textStyle.value}>
-                    {text.value}
+                    {modelValue.value}
                 </span>
             );
         };

packages/ui-vue/components/text/src/text.props.ts

@@ -1,4 +1,9 @@
 import { ExtractPropTypes } from 'vue';
 
-export const textProps = {};
+export const textProps = {
+    /**
+     * 组件值
+     */
+    modelValue: { type: String, default: '' }
+};
 export type TextProps = ExtractPropTypes<typeof textProps>;

packages/ui-vue/docs/.vitepress/theme/index.ts

@@ -6,6 +6,7 @@ import RadioGroup from '../../../components/radio-group';
 import Section from '../../../components/section';
 import Switch from '../../../components/switch';
 import Tabs from '../../../components/tabs';
+import Text from '../../../components/text';
 // import DefaultTheme from 'vitepress/theme';
 import FarrisTheme from '../farris-theme';
 import 'vitepress-theme-demoblock/theme/styles/index.css';
@@ -17,7 +18,7 @@ export default {
     // ...DefaultTheme,
     ...FarrisTheme,
     enhanceApp({ app }) {
-        app.use(Accordion).use(Button).use(ButtonEdit).use(RadioGroup).use(Section).use(Switch).use(Tabs);
+        app.use(Accordion).use(Button).use(ButtonEdit).use(RadioGroup).use(Section).use(Switch).use(Tabs).use(Text);
         registerComponents(app);
     }
 };

packages/ui-vue/docs/components/text/index.md

@@ -1 +1,31 @@
-# Text
+# Text 静态文本
+
+Text 组件用来展示只读态的页面数据。
+
+## 基本用法
+
+:::demo
+
+```vue
+<script setup lang="ts">
+import { ref } from 'vue';
+const text = ref('一段用于展示的静态文本');
+</script>
+<template>
+    <f-text v-model="text"> </f-text>
+</template>
+```
+
+:::
+
+## 属性
+
+| 属性名 | 类型     | 默认值 | 说明     |
+| :----- | :------- | :----- | :------- |
+| id     | `string` | --     | 组件标识 |
+
+## 插槽
+
+::: tip
+暂无内容
+:::