@a2simcode/ui 0.0.176 → 0.0.177

package/docs/components/buttons.md

@@ -1,119 +1,119 @@
-# Buttons 按钮组
-
-用于批量管理和展示按钮，支持分组、下拉菜单等功能。
-
-## 基础用法
-
-通过 `list` 属性传入按钮配置数组。
-
-<Demo :source-code="buttonsBasicCode">
-  <template #source>
-    <buttons-basic />
-  </template>
-  <template #description>
-    每个按钮项需要包含唯一的 `id` 标识，可配置 `label`、`click` 等属性，`type`、`icon` 等属性需配置在 `config` 对象中。
-  </template>
-</Demo>
-
-## 按钮分组
-
-通过设置 `groupId` 可以将按钮自动分组展示。
-
-<Demo :source-code="buttonsGroupCode">
-  <template #source>
-    <buttons-group />
-  </template>
-  <template #description>
-    相同 `groupId` 的按钮会紧凑显示在一起，不同组之间会有间距。
-  </template>
-</Demo>
-
-## 下拉菜单
-
-通过 `children` 属性可以创建带下拉菜单的按钮。
-
-<Demo :source-code="buttonsDropdownCode">
-  <template #source>
-    <buttons-dropdown />
-  </template>
-  <template #description>
-    配置 `children` 数组后，子按钮会以下拉形式展示，适合放置次要操作。
-  </template>
-</Demo>
-
-## 不同尺寸
-
-通过 `size` 属性设置按钮组内所有按钮的尺寸。
-
-<Demo :source-code="buttonsSizeCode">
-  <template #source>
-    <buttons-size />
-  </template>
-  <template #description>
-    支持 `large`、`default`、`small` 三种尺寸。
-  </template>
-</Demo>
-
-## 链接形式
-
-通过 `isLink` 属性可以将所有按钮以链接形式展示。
-
-<Demo :source-code="buttonsLinkCode">
-  <template #source>
-    <buttons-link />
-  </template>
-  <template #description>
-    设置 `isLink` 为 `true` 后，所有按钮都会以链接形式展示。
-  </template>
-</Demo>
-
-## 禁用状态
-
-通过按钮项的 `disabled` 属性可以禁用单个按钮。
-
-<Demo :source-code="buttonsDisabledCode">
-  <template #source>
-    <buttons-disabled />
-  </template>
-  <template #description>
-    禁用的按钮不会触发点击事件。
-  </template>
-</Demo>
-
-## 点击打开弹窗
-
-演示通过按钮点击事件打开弹窗。
-
-<Demo :source-code="buttonsPopupCode">
-  <template #source>
-    <buttons-popup />
-  </template>
-  <template #description>
-    在 `click` 事件回调中解构获取 `openLayer` 方法，通过它动态打开弹窗。
-  </template>
-</Demo>
-
-## API
-
-### Buttons 属性
-
-<ApiTable :data="buttonsApi" componentName="buttons" />
-
-<script setup>
-import ButtonsBasic from '../examples/buttons/basic.vue'
-import ButtonsGroup from '../examples/buttons/group.vue'
-import ButtonsDropdown from '../examples/buttons/dropdown.vue'
-import ButtonsSize from '../examples/buttons/size.vue'
-import ButtonsLink from '../examples/buttons/link.vue'
-import ButtonsDisabled from '../examples/buttons/disabled.vue'
-import ButtonsPopup from '../examples/buttons/popup.vue'
-import buttonsApi from './meta/buttons'
-
-import buttonsBasicCode from '../examples/buttons/basic.vue?raw'
-import buttonsGroupCode from '../examples/buttons/group.vue?raw'
-import buttonsDropdownCode from '../examples/buttons/dropdown.vue?raw'
-import buttonsSizeCode from '../examples/buttons/size.vue?raw'
-import buttonsLinkCode from '../examples/buttons/link.vue?raw'
-import buttonsDisabledCode from '../examples/buttons/disabled.vue?raw'
-import buttonsPopupCode from '../examples/buttons/popup.vue?raw'
-</script>
+# Buttons 按钮组
+
+用于批量管理和展示按钮，支持分组、下拉菜单等功能。
+
+## 基础用法
+
+通过 `list` 属性传入按钮配置数组。
+
+<Demo :source-code="buttonsBasicCode">
+  <template #source>
+    <buttons-basic />
+  </template>
+  <template #description>
+    每个按钮项需要包含唯一的 `id` 标识，可配置 `label`、`click` 等属性，`type`、`icon` 等属性需配置在 `config` 对象中。
+  </template>
+</Demo>
+
+## 按钮分组
+
+通过设置 `groupId` 可以将按钮自动分组展示。
+
+<Demo :source-code="buttonsGroupCode">
+  <template #source>
+    <buttons-group />
+  </template>
+  <template #description>
+    相同 `groupId` 的按钮会紧凑显示在一起，不同组之间会有间距。
+  </template>
+</Demo>
+
+## 下拉菜单
+
+通过 `children` 属性可以创建带下拉菜单的按钮。
+
+<Demo :source-code="buttonsDropdownCode">
+  <template #source>
+    <buttons-dropdown />
+  </template>
+  <template #description>
+    配置 `children` 数组后，子按钮会以下拉形式展示，适合放置次要操作。
+  </template>
+</Demo>
+
+## 不同尺寸
+
+通过 `size` 属性设置按钮组内所有按钮的尺寸。
+
+<Demo :source-code="buttonsSizeCode">
+  <template #source>
+    <buttons-size />
+  </template>
+  <template #description>
+    支持 `large`、`default`、`small` 三种尺寸。
+  </template>
+</Demo>
+
+## 链接形式
+
+通过 `isLink` 属性可以将所有按钮以链接形式展示。
+
+<Demo :source-code="buttonsLinkCode">
+  <template #source>
+    <buttons-link />
+  </template>
+  <template #description>
+    设置 `isLink` 为 `true` 后，所有按钮都会以链接形式展示。
+  </template>
+</Demo>
+
+## 禁用状态
+
+通过按钮项的 `disabled` 属性可以禁用单个按钮。
+
+<Demo :source-code="buttonsDisabledCode">
+  <template #source>
+    <buttons-disabled />
+  </template>
+  <template #description>
+    禁用的按钮不会触发点击事件。
+  </template>
+</Demo>
+
+## 点击打开弹窗
+
+演示通过按钮点击事件打开弹窗。
+
+<Demo :source-code="buttonsPopupCode">
+  <template #source>
+    <buttons-popup />
+  </template>
+  <template #description>
+    在 `click` 事件回调中解构获取 `openLayer` 方法，通过它动态打开弹窗。
+  </template>
+</Demo>
+
+## API
+
+### Buttons 属性
+
+<ApiTable :data="buttonsApi" componentName="buttons" />
+
+<script setup>
+import ButtonsBasic from '../examples/buttons/basic.vue'
+import ButtonsGroup from '../examples/buttons/group.vue'
+import ButtonsDropdown from '../examples/buttons/dropdown.vue'
+import ButtonsSize from '../examples/buttons/size.vue'
+import ButtonsLink from '../examples/buttons/link.vue'
+import ButtonsDisabled from '../examples/buttons/disabled.vue'
+import ButtonsPopup from '../examples/buttons/popup.vue'
+import buttonsApi from './meta/buttons'
+
+import buttonsBasicCode from '../examples/buttons/basic.vue?raw'
+import buttonsGroupCode from '../examples/buttons/group.vue?raw'
+import buttonsDropdownCode from '../examples/buttons/dropdown.vue?raw'
+import buttonsSizeCode from '../examples/buttons/size.vue?raw'
+import buttonsLinkCode from '../examples/buttons/link.vue?raw'
+import buttonsDisabledCode from '../examples/buttons/disabled.vue?raw'
+import buttonsPopupCode from '../examples/buttons/popup.vue?raw'
+</script>

package/docs/components/cascader-select.md

@@ -1,114 +1,114 @@
-# CascaderSelect 级联选择
-
-当选项具有层级关系时，使用级联选择器展示并选择内容。
-
-## 基础用法
-
-<Demo :source-code="cascaderSelectBasicCode">
-  <template #source>
-    <cascader-select-basic />
-  </template>
-  <template #description>
-    使用 v-model 实现双向数据绑定。
-  </template>
-</Demo>
-
-## 禁用和只读
-
-通过 `disabled` 和 `readonly` 属性指定级联选择器的状态。
-
-<Demo :source-code="cascaderSelectDisabledCode">
-  <template #source>
-    <cascader-select-disabled />
-  </template>
-  <template #description>
-    通过 disabled 属性指定是否禁用级联选择器，通过 readonly 属性指定是否只读。
-  </template>
-</Demo>
-
-## 可清除
-
-使用 `clearable` 属性即可得到一个可清除的级联选择器。
-
-<Demo :source-code="cascaderSelectClearableCode">
-  <template #source>
-    <cascader-select-clearable />
-  </template>
-  <template #description>
-    设置 `clearable` 属性为 `true` 即可显示清除按钮。
-  </template>
-</Demo>
-
-## 可搜索
-
-使用 `filterable` 属性即可启用搜索功能。
-
-<Demo :source-code="cascaderSelectFilterableCode">
-  <template #source>
-    <cascader-select-filterable />
-  </template>
-  <template #description>
-    设置 `filterable` 属性为 `true` 即可启用搜索功能。
-  </template>
-</Demo>
-
-## 多选
-
-使用 `multiple` 属性即可启用多选功能。
-
-<Demo :source-code="cascaderSelectMultipleCode">
-  <template #source>
-    <cascader-select-multiple />
-  </template>
-  <template #description>
-    设置 `multiple` 属性为 `true` 即可启用多选功能。
-  </template>
-</Demo>
-
-## 自定义插槽
-
-使用各个插槽来自定义级联选择器的内容。
-
-<Demo :source-code="cascaderSelectSlotCode">
-  <template #source>
-    <cascader-select-slot />
-  </template>
-  <template #description>
-    通过 `#default` 插槽自定义节点内容，通过 `#empty` 插槽自定义空状态。
-  </template>
-</Demo>
-
-## 方法调用
-
-通过模板引用访问组件的暴露方法。
-
-<Demo :source-code="cascaderSelectMethodsCode">
-  <template #source>
-    <cascader-select-methods />
-  </template>
-  <template #description>
-    使用 `getCheckedNodes()` 获取选中节点，使用 `clearCheckedNodes()` 清空选中节点。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="cascaderSelectApi" componentName="cascader-select" />
-
-<script setup>
-import CascaderSelectBasic from '../examples/cascader-select/basic.vue'
-import CascaderSelectDisabled from '../examples/cascader-select/disabled.vue'
-import CascaderSelectClearable from '../examples/cascader-select/clearable.vue'
-import CascaderSelectFilterable from '../examples/cascader-select/filterable.vue'
-import CascaderSelectMultiple from '../examples/cascader-select/multiple.vue'
-import CascaderSelectSlot from '../examples/cascader-select/slot.vue'
-import CascaderSelectMethods from '../examples/cascader-select/methods.vue'
-import cascaderSelectApi from './meta/cascader-select'
-import cascaderSelectBasicCode from '../examples/cascader-select/basic.vue?raw'
-import cascaderSelectDisabledCode from '../examples/cascader-select/disabled.vue?raw'
-import cascaderSelectClearableCode from '../examples/cascader-select/clearable.vue?raw'
-import cascaderSelectFilterableCode from '../examples/cascader-select/filterable.vue?raw'
-import cascaderSelectMultipleCode from '../examples/cascader-select/multiple.vue?raw'
-import cascaderSelectSlotCode from '../examples/cascader-select/slot.vue?raw'
-import cascaderSelectMethodsCode from '../examples/cascader-select/methods.vue?raw'
-</script>
+# CascaderSelect 级联选择
+
+当选项具有层级关系时，使用级联选择器展示并选择内容。
+
+## 基础用法
+
+<Demo :source-code="cascaderSelectBasicCode">
+  <template #source>
+    <cascader-select-basic />
+  </template>
+  <template #description>
+    使用 v-model 实现双向数据绑定。
+  </template>
+</Demo>
+
+## 禁用和只读
+
+通过 `disabled` 和 `readonly` 属性指定级联选择器的状态。
+
+<Demo :source-code="cascaderSelectDisabledCode">
+  <template #source>
+    <cascader-select-disabled />
+  </template>
+  <template #description>
+    通过 disabled 属性指定是否禁用级联选择器，通过 readonly 属性指定是否只读。
+  </template>
+</Demo>
+
+## 可清除
+
+使用 `clearable` 属性即可得到一个可清除的级联选择器。
+
+<Demo :source-code="cascaderSelectClearableCode">
+  <template #source>
+    <cascader-select-clearable />
+  </template>
+  <template #description>
+    设置 `clearable` 属性为 `true` 即可显示清除按钮。
+  </template>
+</Demo>
+
+## 可搜索
+
+使用 `filterable` 属性即可启用搜索功能。
+
+<Demo :source-code="cascaderSelectFilterableCode">
+  <template #source>
+    <cascader-select-filterable />
+  </template>
+  <template #description>
+    设置 `filterable` 属性为 `true` 即可启用搜索功能。
+  </template>
+</Demo>
+
+## 多选
+
+使用 `multiple` 属性即可启用多选功能。
+
+<Demo :source-code="cascaderSelectMultipleCode">
+  <template #source>
+    <cascader-select-multiple />
+  </template>
+  <template #description>
+    设置 `multiple` 属性为 `true` 即可启用多选功能。
+  </template>
+</Demo>
+
+## 自定义插槽
+
+使用各个插槽来自定义级联选择器的内容。
+
+<Demo :source-code="cascaderSelectSlotCode">
+  <template #source>
+    <cascader-select-slot />
+  </template>
+  <template #description>
+    通过 `#default` 插槽自定义节点内容，通过 `#empty` 插槽自定义空状态。
+  </template>
+</Demo>
+
+## 方法调用
+
+通过模板引用访问组件的暴露方法。
+
+<Demo :source-code="cascaderSelectMethodsCode">
+  <template #source>
+    <cascader-select-methods />
+  </template>
+  <template #description>
+    使用 `getCheckedNodes()` 获取选中节点，使用 `clearCheckedNodes()` 清空选中节点。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="cascaderSelectApi" componentName="cascader-select" />
+
+<script setup>
+import CascaderSelectBasic from '../examples/cascader-select/basic.vue'
+import CascaderSelectDisabled from '../examples/cascader-select/disabled.vue'
+import CascaderSelectClearable from '../examples/cascader-select/clearable.vue'
+import CascaderSelectFilterable from '../examples/cascader-select/filterable.vue'
+import CascaderSelectMultiple from '../examples/cascader-select/multiple.vue'
+import CascaderSelectSlot from '../examples/cascader-select/slot.vue'
+import CascaderSelectMethods from '../examples/cascader-select/methods.vue'
+import cascaderSelectApi from './meta/cascader-select'
+import cascaderSelectBasicCode from '../examples/cascader-select/basic.vue?raw'
+import cascaderSelectDisabledCode from '../examples/cascader-select/disabled.vue?raw'
+import cascaderSelectClearableCode from '../examples/cascader-select/clearable.vue?raw'
+import cascaderSelectFilterableCode from '../examples/cascader-select/filterable.vue?raw'
+import cascaderSelectMultipleCode from '../examples/cascader-select/multiple.vue?raw'
+import cascaderSelectSlotCode from '../examples/cascader-select/slot.vue?raw'
+import cascaderSelectMethodsCode from '../examples/cascader-select/methods.vue?raw'
+</script>