docs: fix Chinese and English space

packages/varlet-ui/docs/cli.zh-CN.md

@@ -1,24 +1,24 @@
 # @varlet/cli
 
-开箱即用的`Vue3组件库`快速成型工具，提供了一系列命令和工具去解决组件库开发上的问题
+开箱即用的 `Vue3组件库` 快速成型工具，提供了一系列命令和工具去解决组件库开发上的问题
 
 ### 特性
 
 - 1.开箱即用的组件库开发环境
-- 2.开箱即用的组件库编译工具，支持导出`esm`和`umd`两种模块代码
+- 2.开箱即用的组件库编译工具，支持导出 `esm` 和 `umd` 两种模块代码
 - 3.基于配置文件的组件库文档站点,支持百度统计和主题定制
-- 4.支持`单文件组件(sfc)`和`tsx,jsx`两种风格的组件库编写风格
+- 4.支持 `单文件组件(sfc)` 和 `tsx,jsx` 两种风格的组件库编写风格
 - 5.开箱即用的代码检查工具
 - 6.开箱即用的单元测试工具
-- 7.开箱即用的代码发布工具,发布到npm和github,并自动生成更新日志
-- 8.支持`Typescript`
-- 9.支持`暗黑模式`
-- 10.基于`pnpm`
+- 7.开箱即用的代码发布工具,发布到 npm 和 github,并自动生成更新日志
+- 8.支持 `Typescript`
+- 9.支持 `暗黑模式`
+- 10.基于 `pnpm`
 
 ### 快速开始
 
-`@varlet/cli`内置了`单文件组件(sfc)`和`tsx, jsx`两种风格的组件库项目模板，可以通过`gen`命令直接生成。
-帮助用户直接进入组件本身的开发，推荐使用`pnpm`作为包管理工具。
+`@varlet/cli` 内置了 `单文件组件(sfc)` 和 `tsx, jsx` 两种风格的组件库项目模板，可以通过 `gen` 命令直接生成。
+帮助用户直接进入组件本身的开发，推荐使用 `pnpm` 作为包管理工具。
 
 ```shell
 # 安装命令行工具
@@ -36,7 +36,7 @@ pnpm dev
 
 ### 配置文件
 
-项目根目录下的`varlet.config.js`用来管理整个组件库项目的具体细节
+项目根目录下的 `varlet.config.js` 用来管理整个组件库项目的具体细节
 
 | 参数 | 说明 | 类型 | 默认值 |
 | ----- | -------------- | -------- | ---------- |
@@ -45,32 +45,32 @@ pnpm dev
 | `name` | 组件库全名	| _string_ | `Varlet` |
 | `namespace` | 组件库命名空间, 会作为组件前缀 | _string_ | `var` |
 | `title` | 文档中组件库的标题 | _string_ | `VARLET` |
-| `logo` | 文档中组件库的logo | _string_ | `-` |
+| `logo` | 文档中组件库的 logo | _string_ | `-` |
 | `defaultLanguage` | 文档默认语言 | _string_ | `zh-CN` |
 | `useMobile` | 是否显示右侧手机预览 | _boolean_ | `false` |
 | `themes` | 文档主题 | _SiteThemes_ | `-` |
 | `darkThemes` | 暗黑模式文档主题 | _SiteThemes_ | `-` |
 | `highlight` | 文档代码片段样式相关 | _SiteHighlight_ | `-` |
 | `analysis` | 文档统计相关 | _SiteAnalysis_ | `-` |
-| `pc` | pc端文档结构配置 | _SitePC_ | `-` |
-| `mobile` | mobile端文档结构配置 | _SiteMobile_ | `-` |
+| `pc` | pc 端文档结构配置 | _SitePC_ | `-` |
+| `mobile` | mobile 端文档结构配置 | _SiteMobile_ | `-` |
 | `moduleCompatible` | 模块兼容配置 | _Record<string, string>_ | `-` |
 
 #### 模块适配对象
 
-一些外部依赖可能需要进行模块语法的适配，以达到可以正确编译到`commonjs`和`esmodule`的目的，例如`dayjs`的`esmodule`写法是
+一些外部依赖可能需要进行模块语法的适配，以达到可以正确编译到 `commonjs` 和 `esmodule` 的目的，例如 `dayjs` 的 `esmodule` 写法是
 
 ```js
 import dayjs from 'dayjs/esm'
 ```
 
-而为了构建`commonjs`时的写法是
+而为了构建 `commonjs` 时的写法是
 
 ```js
 import * as dayjs from 'dayjs'
 ```
 
-在项目中我们拥抱`esmodule`模块使用第一种写法，并做如下配置进行适配
+在项目中我们拥抱 `esmodule` 模块使用第一种写法，并做如下配置进行适配
 
 ```js
 // varlet.config.js
@@ -83,7 +83,7 @@ module.exports = {
 
 #### SiteThemes
 
-主题变量相关，由于默认的主题变量可能时常修改，以`varlet`官方文档的主题为准
+主题变量相关，由于默认的主题变量可能时常修改，以 `varlet` 官方文档的主题为准
 
 | 参数 |
 | ----- |
@@ -116,7 +116,7 @@ module.exports = {
 
 | 参数 | 说明 | 类型 | 默认值 |
 | ----- | -------------- | -------- | ---------- |
-| `style` | highlight的css地址 | _string_ | `-` |
+| `style` | highlight 的 css 地址 | _string_ | `-` |
 
 #### SiteAnalysis
 
@@ -259,7 +259,7 @@ varlet-cli gen <projectName>
 
 ### babel
 
-对`babel`进行配置，首先在`package.json`中指定目标浏览器
+对 `babel` 进行配置，首先在 `package.json` 中指定目标浏览器
 
 ```json
 {
@@ -270,7 +270,7 @@ varlet-cli gen <projectName>
 }
 ```
 
-创建`babel.config,js`
+创建 `babel.config,js`
 
 ```js
 // babel.config.js
@@ -290,7 +290,7 @@ module.exports = {
 
 #### git-hook
 
-`husky`，`lint-staged`配合`eslint`，`stylelint`，`varlet-cli commit-lint`做commit前的检查，`package.json`配置如下
+`husky`，`lint-staged` 配合 `eslint`，`stylelint`，`varlet-cli commit-lint` 做 commit 前的检查，`package.json` 配置如下
 
 ```json
 {
@@ -332,7 +332,7 @@ module.exports = {
 }
 ```
 
-创建`.prettierignore`
+创建 `.prettierignore`
 
 ```text
 // .prettierignore
@@ -347,7 +347,7 @@ src/*/__tests__/**
 
 ### typescript
 
-创建`tsconfig.json`
+创建 `tsconfig.json`
 
 ```json
 {
@@ -367,5 +367,5 @@ src/*/__tests__/**
 
 #### 发布前注意
 
-- 1.npm的仓库源必须指向npm官方镜像
-- 2.执行npm login进行登录
+- 1.npm 的仓库源必须指向 npm 官方镜像
+- 2.执行 npm login 进行登录

packages/varlet-ui/docs/openSourceGuide.zh-CN.md

@@ -4,7 +4,7 @@
 首先感谢您有兴趣加入我们的开源项目，以下介绍一些注意事项。
 
 ### 快速开始
-包管理的安装和link依赖都必须使用[pnpm](https://pnpm.io/)
+包管理的安装和link依赖都必须使用 [pnpm](https://pnpm.io/)，
 首先 fork 仓库，基于 dev 分支进行开发，在项目根目录下。
 node 版本 16+。
 
@@ -19,5 +19,5 @@ pnpm dev
 
 ### 加入我们
 
-如果您想参与组件库的开发和维护，可以在[issue](https://github.com/varletjs/varlet/issues)中留下您的邮箱，
+如果您想参与组件库的开发和维护，可以在 [issue](https://github.com/varletjs/varlet/issues) 中留下您的邮箱，
 我们会给您发送邀请邮件。

packages/varlet-ui/docs/quickstart.zh-CN.md

@@ -24,7 +24,7 @@
 ### Webpack/Vite
 
 ```shell
-# 通过 npm 或 yarn 安装 或 pnpm安装
+# 通过 npm 或 yarn 安装 或 pnpm 安装
 
 # npm
 npm i @varlet/ui -S

packages/varlet-ui/src/badge/docs/zh-CN.md

@@ -148,7 +148,7 @@ export default {
 | `max-value` | 徽标中显示的最大值，当 `value` 大于 `max-value` 时会显示 `max-value+` (当 `value` 与 `max-value` 都存在时生效)| _number_ | `-` |
 | `position` | 徽标标签中有其他标签时定义徽标在其他标签上的位置，可选值 `right-top` `top-bottom` `left-top` `left-bottom` | _string_ | `right-top` |
 | `color` | 自定义徽标颜色 | _string_ | `-` |
-| `icon` | 自定义徽标中图标的内容（优先级高于`value`） | _string_ | `-` |
+| `icon` | 自定义徽标中图标的内容（优先级高于 `value` ） | _string_ | `-` |
 
 ### 插槽
 
@@ -168,4 +168,3 @@ export default {
 | `--badge-success-color` | `var(--color-success)`|
 | `--badge-warning-color` |  `var(--color-warning)`|
 | `--badge-info-color` | `var(--color-info)`|
-

packages/varlet-ui/src/collapse/docs/zh-CN.md

@@ -33,7 +33,7 @@ export default {
     const changeHandle = (val) => {
       console.log(val)
     }
-    
+
     return {
       value,
       changeHandle
@@ -69,7 +69,7 @@ import { ref } from 'vue'
 export default {
   setup() {
     const value = ref('')
-    
+
     return {
       value
     }
@@ -162,7 +162,7 @@ export default {
 | ----- | -------------- | -------- |
 | `default` | 面板的内容 | `-` |
 | `title` | 面板的标题 | `-` |
-| `icon` | 自定义右侧icon | `-` |
+| `icon` | 自定义右侧 icon | `-` |
 
 ### 样式变量
 以下为组件使用的 css 变量,可以使用 [StyleProvider 组件](#/zh-CN/style-provider)进行样式定制

packages/varlet-ui/src/image/docs/zh-CN.md

@@ -3,7 +3,7 @@
 ### 介绍
 
 组件提供了更方便的尺寸，填充模式，圆角的设置方式，水波效果增强图片点击交互体验。
-支持`懒加载`、`loading 图片`、 `error 图片`、应用 `Lazy` 指令的默认设置。
+支持 `懒加载`、`loading 图片`、 `error 图片`、应用 `Lazy` 指令的默认设置。
 
 ### 引入
 
@@ -25,32 +25,32 @@ createApp().use(Image)
 ```html
 <var-image width="85px" height="85px" src="https://varlet.gitee.io/varlet-ui/cat.jpg" />
 
-<var-image 
-  width="85px" 
+<var-image
+  width="85px"
   height="85px"
-  fit="cover" 
-  src="https://varlet.gitee.io/varlet-ui/cat.jpg" 
+  fit="cover"
+  src="https://varlet.gitee.io/varlet-ui/cat.jpg"
 />
 
-<var-image 
+<var-image
   width="85px"
-  height="85px" 
+  height="85px"
   fit="contain"
-  src="https://varlet.gitee.io/varlet-ui/cat.jpg" 
+  src="https://varlet.gitee.io/varlet-ui/cat.jpg"
 />
 
-<var-image 
+<var-image
   width="85px"
   height="85px"
   fit="none"
   src="https://varlet.gitee.io/varlet-ui/cat.jpg"
 />
 
-<var-image 
+<var-image
   width="85px"
-  height="85px" 
+  height="85px"
   fit="scale-down"
-  src="https://varlet.gitee.io/varlet-ui/cat.jpg" 
+  src="https://varlet.gitee.io/varlet-ui/cat.jpg"
 />
 ```
 
@@ -89,7 +89,7 @@ createApp().use(Image)
 ### 设置懒加载状态图片
 
 ```html
-<var-image 
+<var-image
   lazy
   loading="https://xxx.xxx/loading.png"
   error="https://xxx.xxx/error.png"
@@ -127,8 +127,8 @@ export default {
 
 ### 属性
 
-| 参数 | 说明 | 类型 | 默认值 | 
-| --- | --- | --- | --- | 
+| 参数 | 说明 | 类型 | 默认值 |
+| --- | --- | --- | --- |
 | `src` | 图片地址 | _string_ | `-` |
 | `fit` | 填充模式, 可选值为 `fill` `contain` `cover` `none` `scale-down` | _string_ | `fill` |
 | `alt` | 替代文本 | _string_ | `-` |

packages/varlet-ui/src/list/docs/zh-CN.md

@@ -14,7 +14,7 @@ createApp().use(List)
 
 ### 基本使用
 
-当检测到滚动容器滚动到底部底部时会触发`load`事件，并会设置`loading`为`true`，在加载结束时您需要手动设置`loading`为`false`，表示加载结束。
+当检测到滚动容器滚动到底部底部时会触发 `load` 事件，并会设置 `loading` 为 `true`，在加载结束时您需要手动设置 `loading` 为 `false`，表示加载结束。
 
 ```html
 <var-list
@@ -36,7 +36,7 @@ export default {
     const loading = ref(false)
     const finished = ref(false)
     const list = reactive([])
-    
+
     const load = () => {
       setTimeout(() => {
         for (let i = 0; i < 20; i++) {
@@ -63,7 +63,7 @@ export default {
 
 ### 加载失败
 
-您可以使用`v-model:error`手动设置错误状态，会展示错误提示，点击错误提示会帮您把`error`设置成`false`并再次触发`load`事件。
+您可以使用 `v-model:error` 手动设置错误状态，会展示错误提示，点击错误提示会帮您把 `error` 设置成 `false` 并再次触发 `load` 事件。
 
 ```html
 <var-list
@@ -85,7 +85,7 @@ export default {
     const loading = ref(false)
     const error = ref(false)
     const list = reactive([])
-    
+
     const load = () => {
       setTimeout(() => {
         if (list.length === 40) {
@@ -115,12 +115,12 @@ export default {
 ### 提示文字
 
 ```html
-<var-list 
-  loading-text="正在努力输出" 
-  finished-text="一滴都没有了" 
-  error-text="出错了出错了" 
-  :finished="finished" 
-  v-model:loading="loading" 
+<var-list
+  loading-text="正在努力输出"
+  finished-text="一滴都没有了"
+  error-text="出错了出错了"
+  :finished="finished"
+  v-model:loading="loading"
   @load="load"
 >
   <var-cell :key="item" v-for="item in list">
@@ -137,7 +137,7 @@ export default {
     const loading = ref(false)
     const finished = ref(false)
     const list = reactive([])
-    
+
     const load = () => {
       setTimeout(() => {
         for (let i = 0; i < 20; i++) {
@@ -163,17 +163,17 @@ export default {
 ```
 
 ### 注意
-我们是通过监听滚动容器的`scroll`事件检测是否触底并执行加载。
-滚动容器是指最近的一个`overflow-y`为`auto`或者`scroll`的元素。
-当您设置一个元素的`overflow-x`为除了`visible`以外的值时，浏览器为了维护一个`bfc`的结构会使您的`overflow-y`修正为`auto`。
+我们是通过监听滚动容器的 `scroll` 事件检测是否触底并执行加载。
+滚动容器是指最近的一个 `overflow-y` 为 `auto` 或者 `scroll` 的元素。
+当您设置一个元素的 `overflow-x` 为除了 `visible` 以外的值时，浏览器为了维护一个 `bfc` 的结构会使您的 `overflow-y` 修正为 `auto`。
 这时我们就会误认为这个元素也是一个滚动容器，注意规避。
 
 ## API
 
 ### 属性
 
-| 参数 | 说明 | 类型 | 默认值 | 
-| --- | --- | --- | --- | 
+| 参数 | 说明 | 类型 | 默认值 |
+| --- | --- | --- | --- |
 | `v-model:loading` | 加载状态 | _boolean_ | `false` |
 | `v-model:error` | 错误状态 | _boolean_ | `false` |
 | `immediate-check` | 是否在组件初始化时立刻检测位置 | _boolean_ | `true` |
@@ -187,7 +187,7 @@ export default {
 
 | 方法名 | 说明 | 参数 |
 | --- | --- | --- |
-| `check` | 触发位置检查, 触底触发load事件。 | `-` |
+| `check` | 触发位置检查, 触底触发 load 事件。 | `-` |
 
 ### 事件
 

packages/varlet-ui/src/loading/docs/zh-CN.md

@@ -84,7 +84,7 @@ export default {
 | `description`    | `loading` 的描述文字 | `-` |
 
 ### 样式变量
-以下为组件使用的 css 变量，可以使用[StyleProvider组件] (#/zh-CN/style-provider)进行样式定制。
+以下为组件使用的 css 变量，可以使用[ StyleProvider 组件] ( #/zh-CN/style-provider )进行样式定制。
 
 | 变量名 | 默认值 |
 | --- | --- |