新增ProFormText、 ProForm， 新增基于VitePress 组件文档

README.en-US.md

@@ -2,6 +2,8 @@
 
 # Pro Components
 
+[Documentation](https://sunshinelixun.github.io/pro-components/)
+
 The Pro Series components are placed here to support heavy-duty components.
 
 [![Vue Support](https://img.shields.io/badge/support-Vue3-green?style=flat)](./package.json) [![Vue Grammar Level](https://img.shields.io/badge/full-Composition%20API-blue?style=flat)](https://v3.vuejs.org/guide/composition-api-introduction.html) [![NPM downloads](http://img.shields.io/npm/dm/@ant-design-vue/pro-layout.svg?style=flat)](https://npmjs.org/package/@ant-design-vue/pro-layout) [![License](https://img.shields.io/github/license/vueComponent/pro-layout)](./LICENSE)
@@ -12,9 +14,8 @@ The Pro Series components are placed here to support heavy-duty components.
 - [Electron](https://www.electronjs.org/)
 
 | [![edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![Edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![chrome](https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![safari](https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![electron_48x48](https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png)](http://godban.github.io/browsers-support-badges/) |
-| --- | --- | --- | --- | --- |
-| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
-
+| ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Edge                                                                                                                                              | last 2 versions                                                                                                                                         | last 2 versions                                                                                                                                         | last 2 versions                                                                                                                                         | last 2 versions                                                                                                                                                     |
 
 ## Contributing
 
@@ -26,8 +27,8 @@ Any type of contribution is welcome, here are some examples of how you may contr
 
 ## Component Kanban
 
-| Components | Downloads | Downloads a version |
-| --- | --- | --- |
+| Components | Downloads                                                                                                                           | Downloads a version                                                                                                                                                         |
+| ---------- | ----------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | pro-layout | [![layout](https://img.shields.io/npm/dw/@ant-design-vue/pro-layout.svg)](https://www.npmjs.com/package/@ant-design-vue/pro-layout) | [![npm package](https://img.shields.io/npm/v/@ant-design-vue/pro-layout.svg?style=flat-square?style=flat-square)](https://www.npmjs.com/package/@ant-design-vue/pro-layout) |
 
 ## LICENSE

README.md

@@ -2,6 +2,8 @@
 
 # Pro Components
 
+[文档](https://sunshinelixun.github.io/pro-components/)
+
 这里放置了 pro 系列组件，用于支撑重型组件
 
 [![Vue Support](https://img.shields.io/badge/support-Vue3-green?style=flat)](./package.json) [![Vue Grammar Level](https://img.shields.io/badge/full-Composition%20API-blue?style=flat)](https://v3.vuejs.org/guide/composition-api-introduction.html) [![NPM downloads](http://img.shields.io/npm/dm/@ant-design-vue/pro-layout.svg?style=flat)](https://npmjs.org/package/@ant-design-vue/pro-layout) [![License](https://img.shields.io/github/license/vueComponent/pro-layout)](./LICENSE)
@@ -12,8 +14,8 @@
 - [Electron](https://www.electronjs.org/)
 
 | [![edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![Edge](https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![chrome](https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![safari](https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png)](http://godban.github.io/browsers-support-badges/) | [![electron_48x48](https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png)](http://godban.github.io/browsers-support-badges/) |
-| --- | --- | --- | --- | --- |
-| Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
+| ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| Edge                                                                                                                                              | last 2 versions                                                                                                                                         | last 2 versions                                                                                                                                         | last 2 versions                                                                                                                                         | last 2 versions                                                                                                                                                     |
 
 ## 参与贡献
 
@@ -25,8 +27,8 @@
 
 ## 组件看板
 
-| 组件 | 下载量 | 版本 |
-| --- | --- | --- |
+| 组件       | 下载量                                                                                                                              | 版本                                                                                                                                                                        |
+| ---------- | ----------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | pro-layout | [![layout](https://img.shields.io/npm/dw/@ant-design-vue/pro-layout.svg)](https://www.npmjs.com/package/@ant-design-vue/pro-layout) | [![npm package](https://img.shields.io/npm/v/@ant-design-vue/pro-layout.svg?style=flat-square?style=flat-square)](https://www.npmjs.com/package/@ant-design-vue/pro-layout) |
 
 ## LICENSE

docs/.vitepress/config.js

@@ -0,0 +1,71 @@
+export default {
+  base: "/pro-components/",
+  description: "中后台重型组件",
+  themeConfig: {
+    logo: "./favicon.svg",
+    siteTitle: "ProComponents-Vue",
+    nav: [
+      {
+        text: "文档",
+        link: "/intro/",
+      },
+      {
+        text: "组件",
+        link: "/components/pro-layout",
+      },
+    ],
+    sidebar: {
+      "/intro/": [
+        {
+          text: "简介",
+          items: [
+            {
+              text: "简介",
+              link: "/intro/",
+            },
+          ],
+        },
+      ],
+      "/components/": [
+        {
+          text: "布局",
+          items: [
+            {
+              text: "ProLayout",
+              link: "/components/pro-layout",
+            },
+          ],
+        },
+        {
+          text: "表单",
+          collapsible: true,
+          items: [
+            {
+              text: "ProForm",
+              link: "/components/pro-form",
+            },
+            {
+              text: "ProFormFields 表单项",
+              link: "/components/pro-form-fields",
+            },
+          ],
+        },
+        {
+          text: "通用",
+          items: [
+            {
+              text: "ProField",
+              link: "/components/pro-field",
+            },
+          ],
+        },
+      ],
+    },
+    socialLinks: [
+      {
+        icon: "github",
+        link: "https://github.com/vueComponent/pro-components",
+      },
+    ],
+  },
+};

docs/.vitepress/theme/index.ts

@@ -0,0 +1,12 @@
+import DefaultTheme from 'vitepress/theme'
+import ProLayout, { PageContainer } from "../../../packages/pro-layout/";
+import {QueryFilter} from "../../../packages/pro-form";
+
+export default {
+  ...DefaultTheme,
+ enhanceApp({ app }) {
+  app.component('ProLayout', ProLayout)
+  app.component('PageContainer', PageContainer)
+  app.component('QueryFilter', QueryFilter)
+ }
+}

docs/components/pro-field.md

@@ -0,0 +1,6 @@
+# 开发中...
+
+内部底层原子化表单组件，业务中请勿使用
+
+- [x] ProField
+- [ ] 更多原子组件...

docs/components/pro-form-fields.md

@@ -0,0 +1,34 @@
+<h1 align="center">
+ProFormFields 表单项
+</h1>
+
+### ProFormText
+
+ProFormText 是 FormItem + Input 的产物
+
+```vue
+<ProFormItem>
+  <Input v-model:value="value" />
+</ProFormItem>
+```
+
+::: warning
+ProFormText 设置的 props 其实是 Form.Item 的，fieldProps 才是包含的组件的
+:::
+
+demo
+
+```vue
+<ProFormText
+  v-model:value="formModel.name"
+  name="name"
+  label="应用名称"
+  :field-props="{
+    allowClear: true,
+    placeholder: '请输入',
+  }"
+  required
+/>
+```
+
+## 更多原子化组件开发中...

docs/components/pro-form.md

@@ -0,0 +1,143 @@
+<h1 align="center">
+Ant Design Pro Form
+</h1>
+
+## Basic Usage
+
+Demo [Examples](https://github.com/vueComponent/pro-components/tree/next/packages/pro-form/examples)
+
+## Install
+
+```bash
+# yarn
+yarn add @ant-design-vue/pro-form
+# npm
+npm i @ant-design-vue/pro-form -S
+```
+
+### Simple Usage
+
+::: details 显示代码
+
+```html
+<template>
+  <QueryFilter
+    :model="formModel"
+    @finish="handleSubmit"
+    @collapsed="onCollapsed"
+  >
+    <FormItem name="name" label="应用名称" required>
+      <input v-model:value="formModel.name" placeholder="请输入" allow-clear />
+    </FormItem>
+    <FormItem name="creater" label="创建人" required>
+      <input v-model:value="formModel.creater" placeholder="请输入" />
+    </FormItem>
+    <FormItem name="sex" label="性别" required>
+      <select v-model:value="formModel.sex">
+        <SelectOption v-for="item in sex" :key="item.value" :value="item.value"
+          >{{ item.label }}</SelectOption
+        >
+      </select>
+    </FormItem>
+    <FormItem name="status" label="应用状态">
+      <input v-model:value="formModel.status" placeholder="请输入" />
+    </FormItem>
+    <FormItem name="startDate" label="响应日期">
+      <DatePicker v-model:value="formModel.startDate" placeholder="请输入" />
+    </FormItem>
+    <FormItem name="create" label="创建时间">
+      <RangePicker
+        v-model:value="formModel.create"
+        :placeholder="['开始时间', '结束时间']"
+      />
+    </FormItem>
+  </QueryFilter>
+</template>
+
+<script lang="ts" setup>
+  import { ref, reactive } from "vue";
+  import { QueryFilter } from "@ant-design-vue/pro-form";
+  import dayjs, { type Dayjs } from "dayjs";
+  import {
+    FormItem,
+    Input,
+    Select,
+    SelectOption,
+    RangePicker,
+    DatePicker,
+  } from "ant-design-vue";
+
+  // main.[js|ts]
+  import "@ant-design-vue/pro-form/dist/style.css"; // pro-form css or style.less
+
+  const formModel = reactive({
+    name: "123",
+    creater: "11",
+    sex: "男",
+    status: "",
+    startDate: "",
+    create: [
+      dayjs("2015/01/01", "YYYY/MM/DD"),
+      dayjs("2016/01/01", "YYYY/MM/DD"),
+    ] as [Dayjs, Dayjs],
+  });
+  const sex = ref([
+    {
+      value: "男",
+      label: "男",
+    },
+    {
+      value: "女",
+      label: "女",
+    },
+  ]);
+
+  function handleSubmit(params: any) {
+    console.log(params);
+  }
+  function onCollapsed(collapsed: boolean) {
+    console.log(collapsed);
+  }
+</script>
+```
+
+:::
+
+## API
+
+### ProLayout
+
+| Property          | Description                                                                                                  | Type                         | Default Value |
+| ----------------- | ------------------------------------------------------------------------------------------------------------ | ---------------------------- | ------------- |
+| formProps         | antd 基础表单 props                                                                                          | object                       |               |
+| searchGutter      | 表单 gutter                                                                                                  | number                       | 24            |
+| style             | 自定义样式                                                                                                   | object                       | undefined     |
+| defaultColsNumber | 自定义折叠状态下默认显示的表单控件数量，没有设置或小于 0，则显示一行控件; 数量大于等于控件数量则隐藏展开按钮 | Number                       | undefined     |
+| collapsed         | 是否折叠超出的表单项，用于受控模式                                                                           | Boolean                      | undefined     |
+| defaultCollapsed  | 默认状态下是否折叠超出的表单项                                                                               | Boolean                      | true          |
+| preserve          | 是否能够查询收起的数据，如果设置为 false，收起后的表单数据将会丢失                                           | Boolean                      | true          |
+| split             | 每一行是否有分割线                                                                                           | Boolean                      | undefined     |
+| submitButtonProps | 提交按钮的 props                                                                                             | Object                       | undefined     |
+| submitter         | 重置、查询、展开收起按钮 props                                                                               | SubmitterProps               | undefined     |
+| onCollapsed       | 切换表单折叠状态时的回调                                                                                     | (collapsed: boolean) => void | undefined     |
+| onFinish          | 表单提交                                                                                                     | (fromModel: any) => void     | undefined     |
+| onSubmit          | 表单提交                                                                                                     | (fromModel: any) => void     | undefined     |
+| onReset           | 重置表单                                                                                                     | (fromModel: any) => void     | undefined     |
+
+## Build project
+
+```bash
+pnpm build # Build library and .d.ts
+```
+
+## TODO:
+
+- [x] BaseFrom
+- [x] QueryFilter
+- [x] ProForm
+  - [x] ProField
+  - [ ] 更多原子组件...
+- [ ] LoginFrom
+- [ ] ModalFrom
+- [ ] DrawerFrom
+- [ ] ProTable