Merge pull request #1 from Moonofweisheng/develop

优化组件的易用性

README.md

@@ -6,19 +6,40 @@
 <p align="center">📱 一个参照<a href="https://ftf.jd.com/wot-design/">Wot-design</a>，基于 Vue3 打造的uni-app组件库</p>
 
 <p align="center">
+
+<a href="https://github.com/Moonofweisheng/wot-design-uni">
+  <img alt="GitHub Repo stars" src="https://img.shields.io/github/stars/Moonofweisheng/wot-design-uni?logo=github&color=%234d80f0&link=https%3A%2F%2Fgithub.com%2FMoonofweisheng%2Fwot-design-uni">
+ </a>
+
+<a href="https://www.npmjs.com/package/wot-design-uni">
+  <img alt="npm" src="https://img.shields.io/npm/v/wot-design-uni?logo=npm&color=%234d80f0&link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fwot-design-uni">
+</a>
+
+<a href="https://www.npmjs.com/package/wot-design-uni">
+  <img alt="npm" src="https://img.shields.io/npm/dw/wot-design-uni?logo=npm&link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fwot-design-uni">
+</a>
+
+<a href="https://www.npmjs.com/package/wot-design-uni">
+  <img src="https://img.shields.io/npm/dt/wot-design-uni?style=flat-square">
+</a>
+
+<a href="https://github.com/Moonofweisheng/wot-design-uni">
+  <img alt="GitHub" src="https://img.shields.io/github/license/Moonofweisheng/wot-design-uni?logo=github">
+ </a>
+
 <a href="https://app.netlify.com/sites/wot-design-uni/deploys" target="_blank" referrerpolicy="no-referrer">
   <img src="https://api.netlify.com/api/v1/badges/0991d8a9-0fb0-483b-8961-5bde066bbd50/deploy-status" alt="deploy-status" />
 </a>
+
 </p>
 
 <p align="center">
   🔥 <a href="https://wot-design-uni.netlify.app/">文档网站 (Netlify)</a>
 </p>
 
-
 ## ✨ 特性
 
-- 🚀 支持 APP、H5、微信小程序、支付宝小程序、钉钉小程序 等平台.
+- 🚀 支持 APP、H5、微信小程序 等平台.
 - 🚀 50+ 个高质量组件，覆盖移动端主流场景.
 - 💪 使用 Typescript 构建，提供良好的组件类型系统.
 - 💪 采用 Vue3 最新特性，提升组件性能.
@@ -28,22 +49,13 @@
 
 ## 📱 预览
 
-手机扫描上的二维码访问演示：
+扫描二维码访问演示：
-
-
 
 <p>
 <img src="https://wot-design-uni.netlify.app/wx.jpg" width="200" height="200" style="margin-right:30px"/>
 <img src="https://wot-design-uni.netlify.app/alipay.png" width="200" height="200" />
 </p>
 
-
-## 安装
-
-```bash
-yarn add wot-design-uni
-```
-
 ## 快速上手
 
 详细说明见 [快速上手](https://wot-design-uni.netlify.app/guide/quickUse.html)
@@ -51,5 +63,3 @@ yarn add wot-design-uni
 ## LICENSE
 
 [MIT](https://github.com/Moonofweisheng/wot-design-uni/blob/develop/LICENSE)
-
-

docs/.vitepress/config.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: weisheng
  * @Date: 2023-07-27 10:26:09
- * @LastEditTime: 2023-08-01 17:31:40
+ * @LastEditTime: 2023-08-22 19:02:54
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: \wot-design-uni\docs\.vitepress\config.ts
@@ -35,6 +35,7 @@ export default defineConfig({
     },
     socialLinks: [
       { icon: 'github', link: 'https://github.com/Moonofweisheng/wot-design-uni' },
+      { icon: { svg: '<svg t="1692699544299" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4184" width="200" height="200"><path d="M512 1024C230.4 1024 0 793.6 0 512S230.4 0 512 0s512 230.4 512 512-230.4 512-512 512z m259.2-569.6H480c-12.8 0-25.6 12.8-25.6 25.6v64c0 12.8 12.8 25.6 25.6 25.6h176c12.8 0 25.6 12.8 25.6 25.6v12.8c0 41.6-35.2 76.8-76.8 76.8h-240c-12.8 0-25.6-12.8-25.6-25.6V416c0-41.6 35.2-76.8 76.8-76.8h355.2c12.8 0 25.6-12.8 25.6-25.6v-64c0-12.8-12.8-25.6-25.6-25.6H416c-105.6 0-188.8 86.4-188.8 188.8V768c0 12.8 12.8 25.6 25.6 25.6h374.4c92.8 0 169.6-76.8 169.6-169.6v-144c0-12.8-12.8-25.6-25.6-25.6z" fill="#6D6D72" p-id="4185"></path></svg>' }, link: "https://gitee.com/fant-mini/wot-design-uni", ariaLabel: 'Gitee' }
     ],
     search: {
       provider: 'algolia',
@@ -45,18 +46,61 @@ export default defineConfig({
       },
     },
 
-    // carbonAds: {
-    //   code: 'CEBIEK3N',
-    //   placement: 'vitejsdev',
-    // },
-
     footer: {
       message: `Released under the MIT License.`,
       copyright: 'Copyright © 2023-present weisheng',
     },
     nav: [
-      { text: '指南', link: '/guide/quickUse', activeMatch: '/guide/' },
+      {
-      { text: '组件', link: '/component/button', activeMatch: '/component/' },
+        text: '指南', activeMatch: '/guide/', items: [
+          {
+            text: '介绍',
+            link: '/guide/introduction',
+          },
+          {
+            text: '快速上手',
+            link: '/guide/quickUse',
+          },
+          {
+            text: '定制主题',
+            link: '/guide/customTheme',
+          },
+          {
+            text: '字体',
+            link: '/guide/typography',
+          },
+          {
+            text: '更新日志',
+            link: '/guide/changelog',
+          },
+          {
+            text: '常见问题',
+            link: '/guide/commonProblems',
+          }
+        ]
+      },
+      {
+        text: '组件', activeMatch: '/component/', items: [
+          {
+            text: '基础组件',
+            link: "/component/button",
+          },
+          {
+            text: "导航组件",
+            link: "/component/pagination"
+          }, {
+            text: "数据输入",
+            link: "/component/calendar",
+          }, {
+            text: "反馈组件",
+            link: "/component/actionSheet",
+          }, {
+            text: "数据展示",
+            link: "/component/badge",
+          }
+
+        ]
+      },
       { text: '捐赠作者', link: '/reward/reward', activeMatch: '/reward/' },
 
       {

docs/guide/introduction.md

@@ -1,6 +1,6 @@
 #  介绍
 
-该组件库基于`uni-app`+`vue3`构建，根据`wot desing mini`的设计规范进行开发，旨在给开发者提供统一的UI交互，同时提高研发的开发效率。
+`wot-design-uni`组件库基于`vue3`+`Typescript`构建，参照`wot desing`的设计规范进行开发，旨在给开发者提供统一的UI交互，同时提高研发的开发效率。
 
 ## 快速上手
 
@@ -18,11 +18,15 @@
   <div style="text-align: center;">支付宝扫码</div>
 </div>
 
-## 特性
+## ✨ 特性
 
-* 50+ 组件
+- 🚀 支持 APP、H5、微信小程序 等平台.
-* Vue3 + TypeScript 开发
+- 🚀 50+ 个高质量组件，覆盖移动端主流场景.
-* 支持 APP、H5、微信小程序、支付宝小程序、钉钉小程序 等平台
+- 💪 使用 Typescript 构建，提供良好的组件类型系统.
+- 💪 采用 Vue3 最新特性，提升组件性能.
+- 📖 提供丰富的文档和组件示例.
+- 🎨 支持主题定制，可以定制scss变量以及组件的样式自定义.
+- 🍭 支持暗黑模式
 
 > 使用Vue3最新特性开发，持续优化体验
 

docs/guide/quickUse.md

@@ -1,12 +1,18 @@
 # 快速上手
 
-本节介绍如何在`uni-app`项目中使用 `Wot Design Uni`
+本节介绍如何在`uni-app`项目中安装、配置并使用 `Wot Design Uni`。
 
-## 安装
+:::warning 关于安装
+`Wot Design Uni`提供了`uni_modules`和`npm`两种安装方式，按需选择。
+- 使用`uni_modules`安装无需额外配置，即插即用，但是每次更新组件库需要处理代码差异（一般直接覆盖就可以）。
+- 使用`npm`安装需要配置`easycom`，更新组件库时无需处理代码差异。
+:::
 
-`Wot Design Uni` 支持 uni_modules 规范，已经上架到 uni-app 的插件市场，故我们推荐使用 uni_modules 的方式引入，方便更新。
+## uni_modules 安装
 
-在`uni-app插件市场`选择使用`HBuildX`导入，或者选择手动在src目录下创建uni_modules文件夹并将Wot Design Uni解压到uni_modules中，结构如下:
+`Wot Design Uni` 支持 [uni_modules](https://uniapp.dcloud.net.cn/plugin/uni_modules.html#uni-modules) 规范，已经上架到 uni-app 的插件市场，故我们推荐使用 uni_modules 的方式引入，方便更新。
+
+在`uni-app插件市场`选择使用`HBuildX`导入，或者选择手动在src目录下创建uni_modules文件夹并将`Wot Design Uni`解压到uni_modules中，结构如下:
 ``` 
 - uni_modules
 - - - wot-design-uni 
@@ -15,8 +21,71 @@
 下载地址：<a href="https://ext.dcloud.net.cn/plugin?id=13889"><span >wot-design-uni</span></a>
 
 
+## npm 安装
+
+::: code-group
+```bash [npm]
+npm i wot-design-uni
+```
+
+```bash [yarn]
+yarn add wot-design-uni
+```
+
+```bash [pnpm]
+pnpm add wot-design-uni
+```
+:::
+
+### 配置easycom
+传统vue组件，需要安装、引用、注册，三个步骤后才能使用组件。`easycom`将其精简为一步。  
+只要组件路径符合规范（具体见[easycom](https://uniapp.dcloud.net.cn/collocation/pages.html#easycom)），就可以不用引用、注册，直接在页面中使用。
+
+:::tip 温馨提醒
+- uni-app 考虑到编译速度，直接在`pages.json`内修改`easycom`不会触发重新编译，需要改动页面内容触发。
+- 请确保您的pages.json中只有一个easycom字段，否则请自行合并多个引入规则。
+:::
+
+```JSON
+// pages.json
+{
+	"easycom": {
+		"autoscan": true,
+		"custom": {
+		  "^wd-(.*)": "wot-design-uni/components/wd-$1/wd-$1.vue"
+		}
+	},
+	
+	// 此为本身已有的内容
+	"pages": [
+		// ......
+	]
+}
+```
+
+
+## Volar 支持
+如果您使用 `Volar`，请在 `tsconfig.json` 中通过 `compilerOptions.type` 指定全局组件类型。
+:::tip
+cli项目使用`uni_modules`安装无需配置，对`Volar`的支持自动生效，`HbuildX`项目不支持此配置，故此步骤仅在`cli`项目使用`npm`安装时需要配置。
+:::
+```json
+// tsconfig.json
+{
+  "compilerOptions": {
+    "types": ["wot-design-uni/global.d.ts"]
+  }
+}
+```
+
+
+
 ## 使用
-`Wot Design Uni`的组件支持easycom规范，故可以直接在.vue中使用，无需在页面内import，也不需要在components内声明，即可在任意页面使用。值得注意的是，uni-app平台不支持全局挂载组件，所以```Message```、```Toast```等组件仍需在SFC中显式使用，例如:
+`Wot Design Uni`安装完成之后，支持easycom规范，故可以直接在SFC中使用，无需在页面内import，也不需要在components内声明，即可在任意页面使用。值得注意的是，`uni-app`平台不支持全局挂载组件，所以```Message```、```Toast```等组件仍需在SFC中显式使用，例如:
 ``` html
 <wd-toast></wd-toast>
 ```
+
+:::tip 温馨提醒
+使用uni_modules 安装时`Wot Design Uni`的组件天然支持`easycom`规范，无需额外配置，而使用npm安装需要自行配置`easycom`。
+:::

docs/index.md

@@ -25,7 +25,7 @@ hero:
 features:
   - icon: 🚀
     title: 多平台覆盖
-    details: 支持 APP、H5、微信小程序、支付宝小程序、钉钉小程序 等平台。
+    details: 支持 APP、H5、微信小程序 等平台。
   - icon: 🚀
     title: 50+ 组件
     details: 超过50个高质量组件，覆盖移动端主流场景。

index.html

@@ -22,7 +22,6 @@
     <title></title>
     <!--preload-links-->
     <!--app-context-->
-    <script src="https://cdn.jsdelivr.net/npm/@vant/touch-emulator"></script>
   </head>
   <body>
     <div id="app"><!--app-html--></div>

package.json

@@ -82,6 +82,7 @@
     "@typescript-eslint/eslint-plugin": "^5.55.0",
     "@typescript-eslint/parser": "^5.55.0",
     "@vant/area-data": "^1.4.1",
+    "@vant/touch-emulator": "^1.4.0",
     "@vue/tsconfig": "^0.1.3",
     "eslint": "^8.36.0",
     "eslint-config-prettier": "^8.7.0",

src/components/demo-block/demo-block.vue

@@ -29,16 +29,18 @@ import { ref, watch } from 'vue'
 
 interface Props {
   customClass?: string
-  title: string
+  title?: string
-  ver: number
+  ver?: number
-  hor: number
+  hor?: number
-  transparent: boolean
+  transparent?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
+  title: '',
   customClass: '',
   ver: 10,
-  hor: 15
+  hor: 15,
+  transparent: false
 })
 
 const style = ref<string>('')

src/main.ts

@@ -1,7 +1,7 @@
 /*
  * @Author: weisheng
  * @Date: 2023-03-09 19:23:03
- * @LastEditTime: 2023-06-10 23:01:56
+ * @LastEditTime: 2023-08-22 23:02:46
  * @LastEditors: weisheng
  * @Description:
  * @FilePath: \wot-design-uni\src\main.ts
@@ -9,9 +9,13 @@
  */
 import { createSSRApp } from 'vue'
 import App from './App.vue'
+// #ifdef H5
+import '@vant/touch-emulator'
+// #endif
+
 export function createApp() {
   const app = createSSRApp(App)
-  app.config.warnHandler = () => null
+  // app.config.warnHandler = () => null
   return {
     app
   }

src/pages/messageBox/Index.vue

@@ -1,7 +1,6 @@
 <template>
   <page-wraper>
     <wd-message-box></wd-message-box>
-    <wd-toast></wd-toast>
     <wd-message-box selector="wd-message-box-slot" use-slot>
       <wd-rate custom-class="custom-rate-class" v-model="value" />
     </wd-message-box>
@@ -31,7 +30,7 @@
   </page-wraper>
 </template>
 <script lang="ts" setup>
-import { useMessage } from '@/uni_modules/wot-design-uni/components/wd-message-box'
+import { useMessage } from '@/uni_modules/wot-design-uni'
 import { ref } from 'vue'
 const value = ref<number>(1)
 const value1 = ref<string>('')

src/pages/search/Index.vue

@@ -44,7 +44,9 @@
 </template>
 <script lang="ts" setup>
 import { ref } from 'vue'
-import { clickOut } from '@/uni_modules/wot-design-uni'
+import { clickOut, useToast } from '@/uni_modules/wot-design-uni'
+
+const toast = useToast()
 
 function clickoutside() {
   clickOut.closeOutside()

src/uni_modules/wot-design-uni/components/mixins/useCell.ts

@@ -2,8 +2,8 @@ import { getCurrentInstance, inject, nextTick, onBeforeMount, onMounted, ref, wa
 
 export function useCell() {
   const border = ref<boolean>(false) // 是否展示边框
-  const cellGroup: any = inject('cell-group') || {}
+  const cellGroup: any = inject('cell-group', null) || {}
-  const cellList: any = inject('cell-list') || ref<any[]>([])
+  const cellList: any = inject('cell-list', null) || ref<any[]>([])
   const { proxy } = getCurrentInstance() as any
 
   watch(

src/uni_modules/wot-design-uni/components/wd-action-sheet/wd-action-sheet.vue

@@ -94,16 +94,16 @@ interface Props {
   customClass?: string
   customHeaderClass?: string
   show: boolean
-  actions: Array<Action>
+  actions?: Array<Action>
-  panels: Array<Panel>
+  panels?: Array<Panel>
   title?: string
   cancelText?: string
-  closeOnClickAction: boolean
+  closeOnClickAction?: boolean
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  duration: number
+  duration?: number
-  zIndex: number
+  zIndex?: number
-  lazyRender: boolean
+  lazyRender?: boolean
-  safeAreaInsetBottom: boolean
+  safeAreaInsetBottom?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-badge/wd-badge.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-06-12 18:40:59
- * @LastEditTime: 2023-08-15 15:47:51
+ * @LastEditTime: 2023-08-22 23:23:37
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-badge\wd-badge.vue
@@ -33,7 +33,7 @@ export default {
 import { computed, ref, watch } from 'vue'
 type BadgeType = 'primary' | 'success' | 'warning' | 'danger' | 'info'
 interface Props {
-  modelValue: number | string | null
+  modelValue?: number | string | null
   bgColor?: string
   max?: number
   isDot?: boolean
@@ -41,7 +41,7 @@ interface Props {
   type?: BadgeType
   top?: number
   right?: number
-  customClass: string
+  customClass?: string
 }
 const props = withDefaults(defineProps<Props>(), {
   customClass: '',

src/uni_modules/wot-design-uni/components/wd-button/wd-button.vue

@@ -71,15 +71,15 @@ type ButtonType = 'primary' | 'success' | 'info' | 'warning' | 'error' | 'defaul
 type ButtonSize = 'small' | 'medium' | 'large'
 
 interface Props {
-  plain: boolean
+  plain?: boolean
-  disabled: boolean
+  disabled?: boolean
-  round: boolean
+  round?: boolean
-  suck: boolean
+  suck?: boolean
-  block: boolean
+  block?: boolean
-  type: ButtonType
+  type?: ButtonType
-  size: ButtonSize
+  size?: ButtonSize
   icon?: string
-  loading: boolean
+  loading?: boolean
   loadingColor?: string
   openType?: string
   formType?: string
@@ -91,8 +91,8 @@ interface Props {
   sendMessageImg?: string
   appParameter?: string
   showMessageCard?: boolean
-  customClass: string
+  customClass?: string
-  customStyle: string
+  customStyle?: string
 }
 const props = withDefaults(defineProps<Props>(), {
   type: 'primary',

src/uni_modules/wot-design-uni/components/wd-calendar-view/month/month.vue

@@ -1,6 +1,7 @@
 <template>
+  <view>
     <wd-toast selector="wd-month" />
-  <view class="month" :data-date="date">
+    <view class="month">
       <view class="wd-month">
         <view class="wd-month__title">{{ monthTitle(date) }}</view>
         <view class="wd-month__days">
@@ -22,6 +23,7 @@
         </view>
       </view>
     </view>
+  </view>
 </template>
 
 <script lang="ts">
@@ -61,7 +63,7 @@ interface Props {
   formatter?: Function
   maxRange?: number
   rangePrompt?: string
-  allowSameDay: boolean
+  allowSameDay?: boolean
   defaultTime: Array<number>
 }
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-calendar-view/monthPanel/month-panel.vue

@@ -78,13 +78,13 @@ interface Props {
   formatter?: Function
   maxRange?: number
   rangePrompt?: string
-  allowSameDay: boolean
+  allowSameDay?: boolean
-  showPanelTitle: boolean
+  showPanelTitle?: boolean
   defaultTime: Array<number>
   panelHeight: number
   // eslint-disable-next-line @typescript-eslint/ban-types
   timeFilter?: Function
-  hideSecond: boolean
+  hideSecond?: boolean
 }
 const props = withDefaults(defineProps<Props>(), {
   allowSameDay: false,

src/uni_modules/wot-design-uni/components/wd-calendar-view/wd-calendar-view.vue

@@ -63,13 +63,13 @@ interface Props {
   // 选中值，为 13 位时间戳或时间戳数组
   modelValue: number | Array<number> | null
   // 日期类型
-  type: CalendarType
+  type?: CalendarType
   // 最小日期，为 13 位时间戳
-  minDate: number
+  minDate?: number
   // 最大日期，为 13 位时间戳
-  maxDate: number
+  maxDate?: number
   // 周起始天
-  firstDayOfWeek: number
+  firstDayOfWeek?: number
   // 日期格式化函数
   // eslint-disable-next-line @typescript-eslint/ban-types
   formatter?: Function
@@ -78,18 +78,18 @@ interface Props {
   // type 为范围选择时有效，选择超出最大日期范围时的错误提示文案
   rangePrompt?: string
   // type 为范围选择时有效，是否允许选择同一天
-  allowSameDay: boolean
+  allowSameDay?: boolean
   // 是否展示面板标题，自动计算当前滚动的日期月份
-  showPanelTitle: boolean
+  showPanelTitle?: boolean
   // 选中日期所使用的当日内具体时刻
-  defaultTime: string | Array<string>
+  defaultTime?: string | Array<string>
   // 可滚动面板的高度
-  panelHeight: number
+  panelHeight?: number
   // type 为 'datetime' 或 'datetimerange' 时有效，用于过滤时间选择器的数据
   // eslint-disable-next-line @typescript-eslint/ban-types
   timeFilter?: Function
   // type 为 'datetime' 或 'datetimerange' 时有效，是否不展示秒修改
-  hideSecond: boolean
+  hideSecond?: boolean
 }
 const props = withDefaults(defineProps<Props>(), {
   customClass: '',

src/uni_modules/wot-design-uni/components/wd-calendar-view/year/year.vue

@@ -43,7 +43,7 @@ interface Props {
   formatter?: Function
   maxRange?: number
   rangePrompt?: string
-  allowSameDay: boolean
+  allowSameDay?: boolean
   defaultTime: Array<number>
 }
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-calendar-view/yearPanel/year-panel.vue

@@ -48,8 +48,8 @@ interface Props {
   formatter?: Function
   maxRange?: number
   rangePrompt?: string
-  allowSameDay: boolean
+  allowSameDay?: boolean
-  showPanelTitle: boolean
+  showPanelTitle?: boolean
   defaultTime: Array<number>
   panelHeight: number
 }
@@ -61,11 +61,6 @@ const props = withDefaults(defineProps<Props>(), {
 const title = ref<string>('')
 const scrollTop = ref<number>(0) // 滚动位置
 
-const scrollIntoViewValue = ref<string>('')
-
-let contentObserver: null | UniApp.IntersectionObserver = null
-const instance = getCurrentInstance() as any
-
 // 滚动区域的高度
 const scrollHeight = computed(() => {
   const scrollHeight: number = (props.panelHeight || 378) + (props.showPanelTitle ? 26 : 16)

src/uni_modules/wot-design-uni/components/wd-cell-group/wd-cell-group.vue

@@ -45,8 +45,8 @@ interface Props {
   customClass?: string
   title?: string
   value?: string
-  useSlot: boolean
+  useSlot?: boolean
-  border: boolean
+  border?: boolean
 }
 const props = withDefaults(defineProps<Props>(), {
   useSlot: false,

src/uni_modules/wot-design-uni/components/wd-cell/wd-cell.vue

@@ -64,15 +64,15 @@ interface Props {
   value?: string
   icon?: string
   label?: string
-  isLink: boolean
+  isLink?: boolean
   to?: string
-  replace: boolean
+  replace?: boolean
-  clickable: boolean
+  clickable?: boolean
   size?: string
   titleWidth?: string
-  center: boolean
+  center?: boolean
-  required: boolean
+  required?: boolean
-  vertical: boolean
+  vertical?: boolean
   customClass?: string
   customIconClass?: string
   customLabelClass?: string
@@ -81,6 +81,7 @@ interface Props {
 }
 
 const props = withDefaults(defineProps<Props>(), {
+  customClass: '',
   customIconClass: '',
   customLabelClass: '',
   customValueClass: '',

src/uni_modules/wot-design-uni/components/wd-checkbox-group/wd-checkbox-group.vue

@@ -22,13 +22,13 @@ type checkShape = 'circle' | 'square' | 'button'
 interface Props {
   customClass?: string
   modelValue: Array<string | number | boolean>
-  cell: boolean
+  cell?: boolean
-  shape: checkShape
+  shape?: checkShape
-  checkedColor: string
+  checkedColor?: string
-  disabled: boolean
+  disabled?: boolean
-  min: number
+  min?: number
-  max: number
+  max?: number
-  inline: boolean
+  inline?: boolean
   size?: string
   name?: string
 }

src/uni_modules/wot-design-uni/components/wd-checkbox/wd-checkbox.vue

@@ -50,11 +50,11 @@ interface Props {
   customShapeClass?: string
   customClass?: string
   modelValue: string | number | boolean
-  shape: checkShape
+  shape?: checkShape
   checkedColor?: string
-  disabled: boolean | null
+  disabled?: boolean | null
-  trueValue: string | number | boolean
+  trueValue?: string | number | boolean
-  falseValue: string | number | boolean
+  falseValue?: string | number | boolean
   size?: string
   maxWidth?: string
 }
@@ -75,7 +75,7 @@ const inited = ref<boolean>(false)
 // 相同组件的伪类选择器无效，这里配合类名手动模拟 last-child、first-child
 const isFirst = ref<boolean>(false)
 const isLast = ref<boolean>(false)
-const parent = inject<any>('checkGroup')
+const parent = inject<any>('checkGroup', null)
 const { proxy } = getCurrentInstance() as any
 
 watch(

src/uni_modules/wot-design-uni/components/wd-col-picker/wd-col-picker.vue

@@ -104,12 +104,12 @@ interface Props {
   modelValue: Array<Record<string, any>>
   columns: Array<Array<Record<string, any>>>
   label?: string
-  labelWidth: string
+  labelWidth?: string
-  useLabelSlot: boolean
+  useLabelSlot?: boolean
-  useDefaultSlot: boolean
+  useDefaultSlot?: boolean
-  disabled: boolean
+  disabled?: boolean
-  readonly: boolean
+  readonly?: boolean
-  placeholder: string
+  placeholder?: string
   title?: string
   // 接收当前列的选中项 item、当前列下标、当前列选中项下标下一列数据处理函数 resolve、结束选择 finish
   // eslint-disable-next-line @typescript-eslint/ban-types
@@ -119,19 +119,19 @@ interface Props {
   displayFormat?: Function
   // eslint-disable-next-line @typescript-eslint/ban-types
   beforeConfirm?: Function
-  alignRight: boolean
+  alignRight?: boolean
-  error: boolean
+  error?: boolean
-  required: boolean
+  required?: boolean
   size?: string
-  valueKey: string
+  valueKey?: string
-  labelKey: string
+  labelKey?: string
-  tipKey: string
+  tipKey?: string
-  loadingColor: string
+  loadingColor?: string
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  autoComplete: boolean
+  autoComplete?: boolean
-  zIndex: number
+  zIndex?: number
-  safeAreaInsetBottom: boolean
+  safeAreaInsetBottom?: boolean
-  ellipsis: boolean
+  ellipsis?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-col/wd-col.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-06-13 11:34:35
- * @LastEditTime: 2023-08-15 13:06:34
+ * @LastEditTime: 2023-08-22 22:26:37
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-col\wd-col.vue
@@ -35,7 +35,8 @@ interface Props {
 
 const props = withDefaults(defineProps<Props>(), {
   span: 24,
-  offset: 0
+  offset: 0,
+  customClass: ''
 })
 
 const style = ref<string>('')

src/uni_modules/wot-design-uni/components/wd-collapse-item/wd-collapse-item.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-08-01 11:12:05
- * @LastEditTime: 2023-08-15 16:30:17
+ * @LastEditTime: 2023-08-22 22:28:28
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-collapse-item\wd-collapse-item.vue
@@ -41,7 +41,7 @@ const $body = '.wd-collapse-item__body'
 interface Props {
   customClass?: string
   title?: string
-  disabled: boolean
+  disabled?: boolean
   name: string
   // 打开前的回调函数，返回 false 可以阻止打开，支持返回 Promise
   // eslint-disable-next-line @typescript-eslint/ban-types

src/uni_modules/wot-design-uni/components/wd-collapse/wd-collapse.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-08-01 11:12:05
- * @LastEditTime: 2023-08-04 13:34:15
+ * @LastEditTime: 2023-08-22 22:28:17
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-collapse\wd-collapse.vue
@@ -58,10 +58,10 @@ interface Props {
   customClass?: string
   customMoreSlotClass?: string
   modelValue: string | Array<string> | boolean
-  accordion: boolean
+  accordion?: boolean
-  viewmore: boolean
+  viewmore?: boolean
-  useMoreSlot: boolean
+  useMoreSlot?: boolean
-  lineNum: number
+  lineNum?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-config-provider/wd-config-provider.vue

@@ -28,8 +28,8 @@ export default {
 import { computed } from 'vue'
 type ConfigProviderTheme = 'light' | 'dark'
 interface Props {
-  theme: ConfigProviderTheme
+  theme?: ConfigProviderTheme
-  themeVars: Record<string, any>
+  themeVars?: Record<string, any>
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-curtain/wd-curtain.vue

@@ -6,14 +6,13 @@
       position="center"
       :close-on-click-modal="closeOnClickModal"
       :hide-when-close="hideWhenClose"
-      @beforeenter="beforeenter"
+      @before-enter="beforeenter"
       @enter="enter"
-      @afterenter="afterenter"
+      @after-enter="afterenter"
-      @beforeleave="beforeleave"
+      @before-leave="beforeleave"
       @leave="leave"
-      @afterleave="afterleave"
+      @after-leave="afterleave"
       @close="close"
-      @closed="closed"
       @clickmodal="clickModal"
       :custom-class="`wd-curtain ${customClass}`"
     >
@@ -42,12 +41,12 @@ type ClosePosition = 'inset' | 'top' | 'bottom' | 'top-left' | 'top-right' | 'bo
 interface Props {
   customClass?: string
   value: boolean
-  closePosition: ClosePosition
+  closePosition?: ClosePosition
   src?: string
   to?: string
   width?: number
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  hideWhenClose: boolean
+  hideWhenClose?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -139,6 +138,7 @@ function leave() {
 
 function afterleave() {
   emit('afterleave')
+  emit('closed')
 }
 
 function close() {
@@ -146,10 +146,6 @@ function close() {
   emit('close')
 }
 
-function closed() {
-  emit('closed')
-}
-
 function clickModal() {
   emit('clickmodal')
 }

src/uni_modules/wot-design-uni/components/wd-datetime-picker-view/wd-datetime-picker-view.vue

@@ -63,17 +63,17 @@ interface Props {
   modelValue: string | number | Date
   // PickerView的Props 开始
   // 加载中
-  loading: boolean
+  loading?: boolean
-  loadingColor: string
+  loadingColor?: string
   // 选项总高度
-  columnsHeight: number
+  columnsHeight?: number
   // 选项对象中，value对应的 key
-  valueKey: string
+  valueKey?: string
   // 选项对象中，展示的文本对应的 key
-  labelKey: string
+  labelKey?: string
   // PickerView的Props 结束
   // 时间选择器的类型
-  type: DateTimeType
+  type?: DateTimeType
   // 自定义过滤选项的函数，返回列的选项数组
   // eslint-disable-next-line @typescript-eslint/ban-types
   filter?: Function
@@ -84,18 +84,18 @@ interface Props {
   // eslint-disable-next-line @typescript-eslint/ban-types
   columnFormatter?: Function
   // 最小日期 20(x-10)年1月1日
-  minDate: number
+  minDate?: number
   // 最大日期 20(x+10)年1月1日
-  maxDate: number
+  maxDate?: number
   // 最小小时
-  minHour: number
+  minHour?: number
   // 最大小时
-  maxHour: number
+  maxHour?: number
   // 最小分钟
-  minMinute: number
+  minMinute?: number
   // 最大分钟
-  maxMinute: number
+  maxMinute?: number
-  startSymbol: boolean
+  startSymbol?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-datetime-picker/wd-datetime-picker.vue

@@ -138,60 +138,60 @@ import { deepClone, getType, isArray, isDef, isEqual, padZero } from '../common/
 import { useCell } from '../mixins/useCell'
 import { DateTimeType, getPickerValue } from '../wd-datetime-picker-view/type'
 interface Props {
-  customClass: string
+  customClass?: string
-  customViewClass: string
+  customViewClass?: string
-  customLabelClass: string
+  customLabelClass?: string
-  customValueClass: string
+  customValueClass?: string
   // 选择器左侧文案
   label?: string
   // 选择器占位符
-  placeholder: string
+  placeholder?: string
   // 禁用
-  disabled: boolean
+  disabled?: boolean
   // 只读
-  readonly: boolean
+  readonly?: boolean
-  loading: boolean
+  loading?: boolean
-  loadingColor: string
+  loadingColor?: string
   /* popup */
   // 弹出层标题
   title?: string
   // 取消按钮文案
-  cancelButtonText: string
+  cancelButtonText?: string
   // 确认按钮文案
-  confirmButtonText: string
+  confirmButtonText?: string
   // 是否必填
-  required: boolean
+  required?: boolean
   size?: string
-  labelWidth: string
+  labelWidth?: string
-  useDefaultSlot: boolean
+  useDefaultSlot?: boolean
-  useLabelSlot: boolean
+  useLabelSlot?: boolean
-  error: boolean
+  error?: boolean
-  alignRight: boolean
+  alignRight?: boolean
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  safeAreaInsetBottom: boolean
+  safeAreaInsetBottom?: boolean
-  ellipsis: boolean
+  ellipsis?: boolean
   // 选项总高度
-  columnsHeight: number
+  columnsHeight?: number
   // 选项对象中，value对应的 key
-  valueKey: string
+  valueKey?: string
   // 选项对象中，展示的文本对应的 key
-  labelKey: string
+  labelKey?: string
   // 选中项，当 type 为 time 时，类型为字符串，否则为 时间戳
   modelValue: string | number | Date | Array<string | number | Date>
   // 时间选择器的类型
-  type: DateTimeType
+  type?: DateTimeType
   // 最小日期 20(x-10)年1月1日
-  minDate: number
+  minDate?: number
   // 最大日期 20(x+10)年1月1日
-  maxDate: number
+  maxDate?: number
   // 最小小时
-  minHour: number
+  minHour?: number
   // 最大小时
-  maxHour: number
+  maxHour?: number
   // 最小分钟
-  minMinute: number
+  minMinute?: number
   // 最大分钟
-  maxMinute: number
+  maxMinute?: number
   // 自定义过滤选项的函数，返回列的选项数组
   // eslint-disable-next-line @typescript-eslint/ban-types
   filter?: Function
@@ -208,7 +208,7 @@ interface Props {
   // eslint-disable-next-line @typescript-eslint/ban-types
   displayFormatTabLabel?: Function
   defaultValue?: string | number | Date | Array<string | number | Date>
-  zIndex: number
+  zIndex?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-divider/wd-divider.vue

@@ -21,7 +21,7 @@ export default {
 <script lang="ts" setup>
 interface Props {
   customClass?: string
-  color: string
+  color?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-drop-menu-item/wd-drop-menu-item.vue

@@ -61,14 +61,14 @@ interface Props {
   // 当前选中的value
   modelValue?: string | number
   // 可能是 array || String
-  options: Array<Record<string, any>>
+  options?: Array<Record<string, any>>
-  useDropItemSlot: boolean
+  useDropItemSlot?: boolean
-  disabled: boolean
+  disabled?: boolean
-  iconName: string
+  iconName?: string
   title?: string
-  valueKey: string
+  valueKey?: string
-  labelKey: string
+  labelKey?: string
-  tipKey: string
+  tipKey?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-drop-menu/wd-drop-menu.vue

@@ -34,13 +34,13 @@ import { getRect } from '../common/util'
 
 type DropDirction = 'up' | 'down'
 interface Props {
-  customClass: string
+  customClass?: string
-  customStyle: string
+  customStyle?: string
-  zIndex: number
+  zIndex?: number
-  direction: DropDirction
+  direction?: DropDirction
-  modal: boolean
+  modal?: boolean
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  duration: number
+  duration?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-grid-item/wd-grid-item.vue

@@ -37,16 +37,16 @@ interface Props {
   customText?: string
   customIcon?: string
   customClass?: string
-  icon: string
+  icon?: string
-  iconSize: string
+  iconSize?: string
   text?: string
   url?: string
-  linkType: LinkType
+  linkType?: LinkType
-  useSlot: boolean
+  useSlot?: boolean
-  useIconSlot: boolean
+  useIconSlot?: boolean
-  useTextSlot: boolean
+  useTextSlot?: boolean
   // badge属性
-  isDot: boolean
+  isDot?: boolean
   type?: BadgeType
   value?: number
   max?: number

src/uni_modules/wot-design-uni/components/wd-grid/wd-grid.vue

@@ -22,11 +22,11 @@ const nextTick = () => new Promise((resolve) => setTimeout(resolve, 20))
 
 interface Props {
   customClass?: string
-  clickable: boolean
+  clickable?: boolean
-  square: boolean
+  square?: boolean
   column?: number
-  border: boolean
+  border?: boolean
-  bgColor: string
+  bgColor?: string
   gutter?: number
 }
 

src/uni_modules/wot-design-uni/components/wd-img-cropper/wd-img-cropper.vue

@@ -96,26 +96,26 @@ const TOP_PERCENT = 0.85
 interface Props {
   customClass?: string
   modelValue: boolean
-  cancelButtonText: string
+  cancelButtonText?: string
-  confirmButtonText: string
+  confirmButtonText?: string
   // 是否禁用旋转
-  disabledRotate: boolean
+  disabledRotate?: boolean
   /** canvas绘图参数 start **/
   // canvasToTempFilePath —— fileType
-  fileType: string
+  fileType?: string
   // canvasToTempFilePath —— quality
-  quality: number
+  quality?: number
   // 设置导出图片尺寸
-  exportScale: number
+  exportScale?: number
   /** canvas绘图参数 end **/
   // 图片源路径
-  imgSrc: string
+  imgSrc?: string
   // 图片宽
-  imgWidth: string | number
+  imgWidth?: string | number
   // 图片高
-  imgHeight: string | number
+  imgHeight?: string | number
   // 最大缩放
-  maxScale: number
+  maxScale?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -646,7 +646,7 @@ defineExpose({
 })
 </script>
 
-<!-- #ifdef MP-WEIXIN || MP-QQ  -->
+<!-- #ifdef MP-WEIXIN || MP-QQ || H5  -->
 <script module="animation" lang="wxs">
 
 function setAnimation(newValue, oldValue, ownerInstance){

src/uni_modules/wot-design-uni/components/wd-img/wd-img.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: weisheng
  * @Date: 2023-06-12 10:04:19
- * @LastEditTime: 2023-08-15 13:11:35
+ * @LastEditTime: 2023-08-22 22:37:02
  * @LastEditors: weisheng
  * @Description: 
  * @FilePath: \wot-design-uni\src\uni_modules\wot-design-uni\components\wd-img\wd-img.vue
@@ -32,9 +32,9 @@ interface Props {
   customStyle?: string
   customImage?: string
   src: string
-  round: boolean
+  round?: boolean
-  mode: string
+  mode?: string
-  lazyLoad: boolean
+  lazyLoad?: boolean
   width?: string | number
   height?: string | number
 }

src/uni_modules/wot-design-uni/components/wd-input-number/wd-input-number.vue

@@ -41,17 +41,17 @@ import { debounce, getType } from '../common/util'
 interface Props {
   customClass?: string
   modelValue: number | string
-  min: number
+  min?: number
-  max: number
+  max?: number
-  step: number
+  step?: number
-  stepStrictly: boolean
+  stepStrictly?: boolean
-  precision: number
+  precision?: number
-  disabled: boolean
+  disabled?: boolean
-  withoutInput: boolean
+  withoutInput?: boolean
-  inputWidth: string | number
+  inputWidth?: string | number
-  allowNull: boolean
+  allowNull?: boolean
-  placeholder: string
+  placeholder?: string
-  name: string
+  name?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-input/wd-input.vue

@@ -141,55 +141,55 @@ import { objToStyle, requestAnimationFrame } from '../common/util'
 import { useCell } from '../mixins/useCell'
 
 interface Props {
-  customTextareaContainerClass: string
+  customTextareaContainerClass?: string
-  customTextareaClass: string
+  customTextareaClass?: string
-  customInputClass: string
+  customInputClass?: string
-  customLabelClass: string
+  customLabelClass?: string
-  customClass: string
+  customClass?: string
-  customStyle: string
+  customStyle?: string
   // 原生属性
-  placeholder: string
+  placeholder?: string
   placeholderStyle?: string
-  placeholderClass: string
+  placeholderClass?: string
-  autoHeight: boolean
+  autoHeight?: boolean
-  fixed: boolean
+  fixed?: boolean
-  cursorSpacing: number
+  cursorSpacing?: number
-  cursor: number
+  cursor?: number
-  showConfirmBar: boolean
+  showConfirmBar?: boolean
-  selectionStart: number
+  selectionStart?: number
-  selectionEnd: number
+  selectionEnd?: number
-  adjustPosition: boolean
+  adjustPosition?: boolean
-  holdKeyboard: boolean
+  holdKeyboard?: boolean
-  confirmType: string
+  confirmType?: string
-  confirmHold: boolean
+  confirmHold?: boolean
-  focus: boolean
+  focus?: boolean
-  type: string
+  type?: string
-  maxlength: number
+  maxlength?: number
-  disabled: boolean
+  disabled?: boolean
-  alignRight: boolean
+  alignRight?: boolean
   // 原生属性结束
   modelValue: string | number
   minlength?: number
-  showPassword: boolean
+  showPassword?: boolean
-  clearable: boolean
+  clearable?: boolean
-  showClear: boolean
+  showClear?: boolean
-  readonly: boolean
+  readonly?: boolean
-  useSuffixSlot: boolean
+  useSuffixSlot?: boolean
-  usePrefixSlot: boolean
+  usePrefixSlot?: boolean
   prefixIcon?: string
   suffixIcon?: string
-  showWordLimit: boolean
+  showWordLimit?: boolean
-  showWordCount: boolean
+  showWordCount?: boolean
   suffix?: string
   suffixCount?: number
   label?: string
-  labelWidth: string
+  labelWidth?: string
-  useLabelSlot: boolean
+  useLabelSlot?: boolean
   size?: string
-  error: boolean
+  error?: boolean
-  center: boolean
+  center?: boolean
-  noBorder: boolean
+  noBorder?: boolean
-  required: boolean
+  required?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-modal/wd-modal.vue

@@ -23,15 +23,16 @@ export default {
 <script lang="ts" setup>
 interface Props {
   show: boolean
-  duration: Record<string, number> | number | boolean
+  duration?: Record<string, number> | number | boolean
-  zIndex: number
+  zIndex?: number
   customStyle?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {
   show: false,
   duration: 300,
-  zIndex: 10
+  zIndex: 10,
+  customStyle: ''
 })
 
 const emit = defineEmits(['click'])

src/uni_modules/wot-design-uni/components/wd-notice-bar/wd-notice-bar.vue

@@ -36,12 +36,12 @@ type NoticeBarType = 'warning' | 'info' | 'danger' | ''
 interface Props {
   customClass?: string
   text?: string
-  type: NoticeBarType
+  type?: NoticeBarType
-  scrollable: boolean
+  scrollable?: boolean
-  delay: number
+  delay?: number
-  speed: number
+  speed?: number
-  closable: boolean
+  closable?: boolean
-  wrapable: boolean
+  wrapable?: boolean
   prefix?: string
   color?: string
   backgroundColor?: string

src/uni_modules/wot-design-uni/components/wd-pagination/wd-pagination.vue

@@ -57,14 +57,14 @@ import { ref, watch } from 'vue'
 interface Props {
   customClass?: string
   modelValue: number // 当前页
-  totalPage: number
+  totalPage?: number
-  showIcon: boolean // 是否展示分页为Icon图标
+  showIcon?: boolean // 是否展示分页为Icon图标
-  showMessage: boolean
+  showMessage?: boolean
-  total: number
+  total?: number
-  pageSize: number
+  pageSize?: number
-  prevText: string
+  prevText?: string
-  nextText: string
+  nextText?: string
-  hideIfOnePage: boolean
+  hideIfOnePage?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-picker-view/wd-picker-view.vue

@@ -49,14 +49,14 @@ import { ColumnItem, formatArray } from './type'
 interface Props {
   customClass?: string
   // 加载中
-  loading: boolean
+  loading?: boolean
-  loadingColor: string
+  loadingColor?: string
   // 选项总高度
-  columnsHeight: number
+  columnsHeight?: number
   // 选项对象中，value对应的 key
-  valueKey: string
+  valueKey?: string
   // 选项对象中，展示的文本对应的 key
-  labelKey: string
+  labelKey?: string
   // 初始值
   modelValue: string | number | boolean | Array<string | number | boolean>
   // 选择器数据

src/uni_modules/wot-design-uni/components/wd-picker/wd-picker.vue

@@ -91,44 +91,44 @@ interface Props {
   // 选择器左侧文案
   label?: string
   // 选择器占位符
-  placeholder: string
+  placeholder?: string
   // 禁用
-  disabled: boolean
+  disabled?: boolean
   // 只读
-  readonly: boolean
+  readonly?: boolean
-  loading: boolean
+  loading?: boolean
-  loadingColor: string
+  loadingColor?: string
   /* popup */
   // 弹出层标题
   title?: string
   // 取消按钮文案
-  cancelButtonText: string
+  cancelButtonText?: string
   // 确认按钮文案
-  confirmButtonText: string
+  confirmButtonText?: string
   // 是否必填
-  required: boolean
+  required?: boolean
   size?: string
   labelWidth?: string
-  useDefaultSlot: boolean
+  useDefaultSlot?: boolean
-  useLabelSlot: boolean
+  useLabelSlot?: boolean
-  error: boolean
+  error?: boolean
-  alignRight: boolean
+  alignRight?: boolean
   // eslint-disable-next-line @typescript-eslint/ban-types
   beforeConfirm?: Function
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  safeAreaInsetBottom: boolean
+  safeAreaInsetBottom?: boolean
-  ellipsis: boolean
+  ellipsis?: boolean
 
   // 选项总高度
-  columnsHeight: number
+  columnsHeight?: number
   // 选项对象中，value对应的 key
-  valueKey: string
+  valueKey?: string
   // 选项对象中，展示的文本对应的 key
-  labelKey: string
+  labelKey?: string
   // 初始值
-  modelValue: string | number | Array<string | number>
+  modelValue?: string | number | Array<string | number>
   // 选择器数据
-  columns: Array<string | number | ColumnItem | Array<string | number | ColumnItem>>
+  columns?: Array<string | number | ColumnItem | Array<string | number | ColumnItem>>
   // 多级联动
   // eslint-disable-next-line @typescript-eslint/ban-types
   columnChange?: Function
@@ -136,13 +136,15 @@ interface Props {
   // eslint-disable-next-line @typescript-eslint/ban-types
   displayFormat?: Function
   // 自定义层级
-  zIndex: number
+  zIndex?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {
   modelValue: '',
   customClass: '',
   customViewClass: '',
+  customLabelClass: '',
+  customValueClass: '',
   // 选择器占位符
   placeholder: '请选择',
   // 禁用

src/uni_modules/wot-design-uni/components/wd-popover/wd-popover.vue

@@ -88,16 +88,16 @@ interface Props {
   customPop?: string
   customClass?: string
   // 是否显示 popover 箭头
-  visibleArrow: boolean
+  visibleArrow?: boolean
   // 显示内容
   content: string | Record<string, any>[]
-  placement: PlacementType
+  placement?: PlacementType
-  offset: number
+  offset?: number
-  useContentSlot: boolean
+  useContentSlot?: boolean
-  disabled: boolean
+  disabled?: boolean
-  showClose: boolean
+  showClose?: boolean
   modelValue: boolean
-  mode: PopoverMode
+  mode?: PopoverMode
 }
 const props = withDefaults(defineProps<Props>(), {
   customClass: '',

src/uni_modules/wot-design-uni/components/wd-popup/wd-popup.vue

@@ -31,19 +31,19 @@ import { isObj, requestAnimationFrame } from '../common/util'
 
 interface Props {
   transition?: string
-  closable: boolean
+  closable?: boolean
-  position: string
+  position?: string
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
-  duration: number | boolean
+  duration?: number | boolean
-  modal: boolean
+  modal?: boolean
-  zIndex: number
+  zIndex?: number
-  hideWhenClose: boolean
+  hideWhenClose?: boolean
-  modalStyle: string
+  modalStyle?: string
-  safeAreaInsetBottom: boolean
+  safeAreaInsetBottom?: boolean
   modelValue: boolean
-  customStyle: string
+  customStyle?: string
-  lazyRender: boolean
+  lazyRender?: boolean
-  customClass: string
+  customClass?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-progress/wd-progress.vue

@@ -34,10 +34,10 @@ type ProgressStatus = 'success' | 'danger' // 状态类型
 
 interface Props {
   customClass?: string
-  percentage: number
+  percentage?: number
   hideText?: boolean
   color?: string | string[] | Record<string, any>[]
-  duration: number
+  duration?: number
   status?: ProgressStatus
 }
 

src/uni_modules/wot-design-uni/components/wd-radio-group/wd-radio-group.vue

@@ -21,12 +21,12 @@ type RadioShape = 'dot' | 'button' | 'check'
 interface Props {
   customClass?: string
   modelValue: string | number | boolean
-  shape: RadioShape
+  shape?: RadioShape
-  checkedColor: string
+  checkedColor?: string
-  disabled: boolean
+  disabled?: boolean
-  cell: boolean
+  cell?: boolean
-  size: string
+  size?: string
-  inline: boolean
+  inline?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-radio/wd-radio.vue

@@ -39,10 +39,10 @@ interface Props {
   value?: string | number | boolean
   shape?: RadioShape
   checkedColor?: string
-  disabled: boolean | null
+  disabled?: boolean | null
-  cell: boolean | null
+  cell?: boolean | null
   size?: string
-  inline: boolean | null
+  inline?: boolean | null
   maxWidth?: string
 }
 

src/uni_modules/wot-design-uni/components/wd-rate/wd-rate.vue

@@ -33,17 +33,17 @@ import { computed, ref, watch } from 'vue'
 
 interface Props {
   customClass?: string
-  num: number
+  num?: number
   modelValue: string | number | null
-  readonly: boolean
+  readonly?: boolean
-  size: string
+  size?: string
-  space: string
+  space?: string
-  color: string
+  color?: string
-  activeColor: string | Array<string>
+  activeColor?: string | Array<string>
-  icon: string
+  icon?: string
-  activeIcon: string
+  activeIcon?: string
-  disabled: boolean
+  disabled?: boolean
-  disabledColor: string
+  disabledColor?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-search/wd-search.vue

@@ -63,18 +63,18 @@ import { computed, ref, watch } from 'vue'
 import { requestAnimationFrame } from '../common/util'
 
 interface Props {
-  useActionSlot: boolean
+  useActionSlot?: boolean
-  useLabelSlot: boolean
+  useLabelSlot?: boolean
-  userSuffixSlot: boolean
+  userSuffixSlot?: boolean
-  placeholder: string
+  placeholder?: string
-  cancelTxt: string
+  cancelTxt?: string
-  light: boolean
+  light?: boolean
-  hideCancel: boolean
+  hideCancel?: boolean
-  disabled: boolean
+  disabled?: boolean
-  maxlength: number | string
+  maxlength?: number | string
-  modelValue: string
+  modelValue?: string
-  placeholderLeft: boolean
+  placeholderLeft?: boolean
-  customClass: string
+  customClass?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-select-picker/wd-select-picker.vue

@@ -110,40 +110,40 @@ interface Props {
   customLabelClass?: string
   customValueClass?: string
   label?: string
-  labelWidth: string
+  labelWidth?: string
-  disabled: boolean
+  disabled?: boolean
-  readonly: boolean
+  readonly?: boolean
-  placeholder: string
+  placeholder?: string
   title?: string
-  alignRight: boolean
+  alignRight?: boolean
-  error: boolean
+  error?: boolean
-  required: boolean
+  required?: boolean
-  useLabelSlot: boolean
+  useLabelSlot?: boolean
-  useDefaultSlot: boolean
+  useDefaultSlot?: boolean
   size?: string
-  checkedColor: string
+  checkedColor?: string
-  min: number
+  min?: number
-  max: number
+  max?: number
   selectSize?: string
-  loading: boolean
+  loading?: boolean
-  loadingColor: string
+  loadingColor?: string
-  closeOnClickModal: boolean
+  closeOnClickModal?: boolean
   modelValue: Array<number | boolean | string> | number | boolean | string
   columns: Array<Record<string, any>>
-  type: SelectPickerType
+  type?: SelectPickerType
-  valueKey: string
+  valueKey?: string
-  labelKey: string
+  labelKey?: string
-  confirmButtonText: string
+  confirmButtonText?: string
   // 外部展示格式化函数
   // eslint-disable-next-line @typescript-eslint/ban-types
   displayFormat?: Function
   // eslint-disable-next-line @typescript-eslint/ban-types
   beforeConfirm?: Function
-  zIndex: number
+  zIndex?: number
-  safeAreaInsetBottom: boolean
+  safeAreaInsetBottom?: boolean
-  filterable: boolean
+  filterable?: boolean
-  filterPlaceholder: string
+  filterPlaceholder?: string
-  ellipsis: boolean
+  ellipsis?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-slider/wd-slider.vue

@@ -62,14 +62,14 @@ interface Props {
   customMinClass?: string
   customMaxClass?: string
   customClass?: string
-  hideMinMax: boolean
+  hideMinMax?: boolean
-  hideLabel: boolean
+  hideLabel?: boolean
-  disabled: boolean
+  disabled?: boolean
-  inactiveColor: string
+  inactiveColor?: string
-  activeColor: string
+  activeColor?: string
-  max: number
+  max?: number
-  min: number
+  min?: number
-  step: number
+  step?: number
   modelValue: number | number[]
 }
 

src/uni_modules/wot-design-uni/components/wd-sort-button/wd-sort-button.vue

@@ -26,11 +26,11 @@ export default {
 <script lang="ts" setup>
 interface Props {
   customClass?: string
-  title: string
+  title?: string
   modelValue: number
-  allowReset: boolean
+  allowReset?: boolean
-  descFirst: boolean
+  descFirst?: boolean
-  line: boolean
+  line?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-status-tip/wd-status-tip.vue

@@ -31,10 +31,10 @@ import { ref, watch } from 'vue'
 type StatusTipType = 'search' | 'network' | 'content' | 'collect' | 'comment' | 'halo' | 'message'
 
 interface Props {
-  customClass: string
+  customClass?: string
-  customStyle: string
+  customStyle?: string
-  type: StatusTipType
+  type?: StatusTipType
-  tip: string
+  tip?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-step/wd-step.vue

@@ -53,9 +53,9 @@ interface Props {
   description?: string
   icon?: string
   status?: StepStatus
-  iconSlot: boolean
+  iconSlot?: boolean
-  titleSlot: boolean
+  titleSlot?: boolean
-  descriptionSlot: boolean
+  descriptionSlot?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-steps/wd-steps.vue

@@ -27,11 +27,11 @@ import { getCurrentInstance, provide, watch } from 'vue'
 
 interface Props {
   customClass?: string
-  active: number
+  active?: number
-  vertical: boolean
+  vertical?: boolean
-  dot: boolean
+  dot?: boolean
   space?: string
-  alignCenter: boolean
+  alignCenter?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-sticky/wd-sticky.vue

@@ -33,8 +33,8 @@ import { addUnit, getRect, objToStyle } from '../common/util'
 interface Props {
   customStyle?: string
   customClass?: string
-  zIndex: number
+  zIndex?: number
-  offsetTop: number
+  offsetTop?: number
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -52,9 +52,9 @@ const width = ref<number>(0)
 const observerList = ref<UniApp.IntersectionObserver[]>([])
 const state = ref<string>('')
 
-const boxHeight: Ref<number> = inject('box-height') || ref(0)
+const boxHeight: Ref<number> = inject('box-height', null) || ref(0)
 // eslint-disable-next-line @typescript-eslint/ban-types
-const observerForChild: Function | null = inject('observerForChild') || null
+const observerForChild: Function | null = inject('observerForChild', null)
 
 const { proxy } = getCurrentInstance() as any
 const instance = getCurrentInstance() as any

src/uni_modules/wot-design-uni/components/wd-swipe-action/wd-swipe-action.vue

@@ -35,7 +35,7 @@ export default {
 }
 </script>
 <script lang="ts" setup>
-import { getCurrentInstance, nextTick, onBeforeMount, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { getCurrentInstance, onBeforeMount, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 import { closeOther, pushToQueue, removeFromQueue } from '../common/clickoutside'
 import { useTouch } from '../mixins/useTouch'
 import { getRect } from '../common/util'
@@ -44,8 +44,8 @@ interface Props {
   customClass?: string
   // eslint-disable-next-line @typescript-eslint/ban-types
   beforeClose?: Function
-  disabled: boolean
+  disabled?: boolean
-  modelValue: string
+  modelValue?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-switch/wd-switch.vue

@@ -20,15 +20,15 @@ import { getType, objToStyle } from '../common/util'
 
 interface Props {
   modelValue: boolean | string | number
-  disabled: boolean
+  disabled?: boolean
-  activeValue: boolean | string | number
+  activeValue?: boolean | string | number
-  inactiveValue: boolean | string | number
+  inactiveValue?: boolean | string | number
   activeColor?: string
   inactiveColor?: string
-  size: string
+  size?: string
   // eslint-disable-next-line @typescript-eslint/ban-types
   beforeChange?: Function
-  customClass: string
+  customClass?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-tab/wd-tab.vue

@@ -27,7 +27,7 @@ interface Props {
   // tab的label
   title?: string
   // tab禁用，无法点击
-  disabled: boolean
+  disabled?: boolean
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-tabs/wd-tabs.vue

@@ -143,19 +143,19 @@ interface Props {
   // 绑定值
   modelValue: number
   // 标签数超过阈值可滑动
-  slidableNum: number
+  slidableNum?: number
   // 标签数超过阈值显示导航地图
-  mapNum: number
+  mapNum?: number
   // 粘性布局
-  sticky: boolean
+  sticky?: boolean
   // 粘性布局吸顶位置
-  offsetTop: number
+  offsetTop?: number
   // 开启手势滑动
-  swipeable: boolean
+  swipeable?: boolean
   // 底部条宽度，单位像素
-  lineWidth: number
+  lineWidth?: number
   // 底部条高度，单位像素
-  lineHeight: number
+  lineHeight?: number
   color?: string
   inactiveColor?: string
 }

src/uni_modules/wot-design-uni/components/wd-tag/wd-tag.vue

@@ -40,17 +40,17 @@ import { objToStyle } from '../common/util'
 import { computed, ref, watch } from 'vue'
 
 interface Props {
-  useIconSlot: boolean
+  useIconSlot?: boolean
   type?: string
   icon?: string
-  closable: boolean
+  closable?: boolean
-  plain: boolean
+  plain?: boolean
-  dynamic: boolean
+  dynamic?: boolean
   color?: string
   bgColor?: string
-  round: boolean
+  round?: boolean
-  mark: boolean
+  mark?: boolean
-  customClass: string
+  customClass?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-tooltip/wd-tooltip.vue

@@ -55,19 +55,19 @@ type PlacementType =
   | 'right-end'
 
 interface Props {
-  customStyle: string
+  customStyle?: string
-  customArrow: string
+  customArrow?: string
-  customPop: string
+  customPop?: string
-  customClass: string
+  customClass?: string
   // 是否显示 popover 箭头
-  visibleArrow: boolean
+  visibleArrow?: boolean
   // 显示内容
   content?: Record<string, any>[] | string
-  placement: PlacementType
+  placement?: PlacementType
-  offset: number
+  offset?: number
-  useContentSlot: boolean
+  useContentSlot?: boolean
-  disabled: boolean
+  disabled?: boolean
-  showClose: boolean
+  showClose?: boolean
   modelValue: boolean
 }
 const props = withDefaults(defineProps<Props>(), {

src/uni_modules/wot-design-uni/components/wd-transition/wd-transition.vue

@@ -51,11 +51,11 @@ type TransitionName =
   | 'zoom-out'
 
 interface Props {
-  show: boolean
+  show?: boolean
   duration?: Record<string, number> | number | boolean
-  name: TransitionName | ''
+  name?: TransitionName | ''
-  customStyle: string
+  customStyle?: string
-  lazyRender: boolean
+  lazyRender?: boolean
   customClass?: string
   // 定义进入过渡的开始状态。在元素被插入之前生效，在元素被插入之后的下一帧移除。
   enterClass?: string

src/uni_modules/wot-design-uni/components/wd-upload/wd-upload.vue

@@ -56,31 +56,31 @@ import { context, getType, isDef, isEqual } from '../common/util'
 import { chooseFile } from './utils'
 
 interface Props {
-  customClass: string
+  customClass?: string
-  customEvokeClass: string
+  customEvokeClass?: string
-  customPreviewClass: string
+  customPreviewClass?: string
   // 多选
-  multiple: boolean
+  multiple?: boolean
   // 接受类型 暂定接受类型为图片，视频后续添加
-  accept: string
+  accept?: string
-  sizeType: Array<string>
+  sizeType?: Array<string>
-  sourceType: Array<string>
+  sourceType?: Array<string>
-  header: Record<string, any>
+  header?: Record<string, any>
-  name: string
+  name?: string
-  formData: Record<string, any>
+  formData?: Record<string, any>
   // 上传相关
   action: string
-  fileList: Record<string, any>[]
+  fileList?: Record<string, any>[]
-  statusKey: string
+  statusKey?: string
-  maxSize: number
+  maxSize?: number
   limit?: number
-  showLimitMum: boolean
+  showLimitMum?: boolean
-  disabled: boolean
+  disabled?: boolean
-  useDefaultSlot: boolean
+  useDefaultSlot?: boolean
   // loading 相关
-  loadingType: string
+  loadingType?: string
-  loadingColor: string
+  loadingColor?: string
-  loadingSize: string
+  loadingSize?: string
   // eslint-disable-next-line @typescript-eslint/ban-types
   beforePreview?: Function
   // eslint-disable-next-line @typescript-eslint/ban-types

src/uni_modules/wot-design-uni/readme.md

@@ -6,19 +6,40 @@
 <p align="center">📱 一个参照<a href="https://ftf.jd.com/wot-design/">Wot-design</a>，基于 Vue3 打造的uni-app组件库</p>
 
 <p align="center">
+
+<a href="https://github.com/Moonofweisheng/wot-design-uni">
+  <img alt="GitHub Repo stars" src="https://img.shields.io/github/stars/Moonofweisheng/wot-design-uni?logo=github&color=%234d80f0&link=https%3A%2F%2Fgithub.com%2FMoonofweisheng%2Fwot-design-uni">
+ </a>
+
+<a href="https://www.npmjs.com/package/wot-design-uni">
+  <img alt="npm" src="https://img.shields.io/npm/v/wot-design-uni?logo=npm&color=%234d80f0&link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fwot-design-uni">
+</a>
+
+<a href="https://www.npmjs.com/package/wot-design-uni">
+  <img alt="npm" src="https://img.shields.io/npm/dw/wot-design-uni?logo=npm&link=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Fwot-design-uni">
+</a>
+
+<a href="https://www.npmjs.com/package/wot-design-uni">
+  <img src="https://img.shields.io/npm/dt/wot-design-uni?style=flat-square">
+</a>
+
+<a href="https://github.com/Moonofweisheng/wot-design-uni">
+  <img alt="GitHub" src="https://img.shields.io/github/license/Moonofweisheng/wot-design-uni?logo=github">
+ </a>
+
 <a href="https://app.netlify.com/sites/wot-design-uni/deploys" target="_blank" referrerpolicy="no-referrer">
   <img src="https://api.netlify.com/api/v1/badges/0991d8a9-0fb0-483b-8961-5bde066bbd50/deploy-status" alt="deploy-status" />
 </a>
+
 </p>
 
 <p align="center">
   🔥 <a href="https://wot-design-uni.netlify.app/">文档网站 (Netlify)</a>
 </p>
 
-
 ## ✨ 特性
 
-- 🚀 支持 APP、H5、微信小程序、支付宝小程序、钉钉小程序 等平台.
+- 🚀 支持 APP、H5、微信小程序 等平台.
 - 🚀 50+ 个高质量组件，覆盖移动端主流场景.
 - 💪 使用 Typescript 构建，提供良好的组件类型系统.
 - 💪 采用 Vue3 最新特性，提升组件性能.
@@ -28,22 +49,13 @@
 
 ## 📱 预览
 
-手机扫描上的二维码访问演示：
+扫描二维码访问演示：
-
-
 
 <p>
 <img src="https://wot-design-uni.netlify.app/wx.jpg" width="200" height="200" style="margin-right:30px"/>
 <img src="https://wot-design-uni.netlify.app/alipay.png" width="200" height="200" />
 </p>
 
-
-## 安装
-
-```bash
-yarn add wot-design-uni
-```
-
 ## 快速上手
 
 详细说明见 [快速上手](https://wot-design-uni.netlify.app/guide/quickUse.html)
@@ -51,5 +63,3 @@ yarn add wot-design-uni
 ## LICENSE
 
 [MIT](https://github.com/Moonofweisheng/wot-design-uni/blob/develop/LICENSE)
-
-

yarn.lock

@@ -3084,6 +3084,11 @@
   resolved "https://registry.npmmirror.com/@vant/area-data/-/area-data-1.4.1.tgz#b4f1bce05dbb147dc08fd2ed9b2a0f63d3329b29"
   integrity sha512-D8zI/rfxREhnIKGoYzsEJZ73fte4JARhFeFftLIH7ynu1sPrCBEgPkLEbwPyvw3VC4JdSIuzaK5uOhu+BcoPXw==
 
+"@vant/touch-emulator@^1.4.0":
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/@vant/touch-emulator/-/touch-emulator-1.4.0.tgz#02420ca5f312a7eb6c36c349cbb8e80e6f29ff2f"
+  integrity sha512-Zt+zISV0+wpOew2S1siOJ3G22y+hapHAKmXM+FhpvWzsRc4qahaYXatCAITuuXt0EcDp7WvEeTO4F7p9AtX/pw==
+
 "@vitejs/plugin-legacy@^4.0.3":
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-legacy/-/plugin-legacy-4.1.1.tgz#27aad7ab082d2d554cf48a8e4f1c0ae9f3eca522"