@a2simcode/ui 0.0.108 → 0.0.110

package/docs/components/slider.md

@@ -1,101 +1,101 @@
-# Slider 滑块
-
-通过拖动滑块在一个固定区间内进行选择。
-
-## 基础用法
-
-在自定义间距内选择一个数值。
-
-<Demo :source-code="sliderBasicCode">
-  <template #source>
-    <slider-basic />
-  </template>
-  <template #description>
-    展示了基础用法、间断点、带有输入框以及范围选择。
-  </template>
-</Demo>
-
-## 禁用状态
-
-通过设置 `readonly` 属性禁用滑块。
-
-<Demo :source-code="sliderDisabledCode">
-  <template #source>
-    <slider-disabled />
-  </template>
-  <template #description>
-    禁用状态下滑块不可拖动。
-  </template>
-</Demo>
-
-## 自定义提示
-
-可以自定义提示信息的格式或隐藏提示。
-
-<Demo :source-code="sliderTooltipCode">
-  <template #source>
-    <slider-tooltip />
-  </template>
-  <template #description>
-    使用 `format-tooltip` 自定义提示内容，使用 `show-tooltip` 控制提示的显示。
-  </template>
-</Demo>
-
-## 垂直模式
-
-设置 `vertical` 属性为 true 可以启用垂直模式。
-
-<Demo :source-code="sliderVerticalCode">
-  <template #source>
-    <slider-vertical />
-  </template>
-  <template #description>
-    垂直模式下必须设置高度 `height` 属性。
-  </template>
-</Demo>
-
-## 显示标记
-
-使用 `marks` 属性标注关键节点。
-
-<Demo :source-code="sliderMarksCode">
-  <template #source>
-    <slider-marks />
-  </template>
-  <template #description>
-    通过 `marks` 对象可以在滑块上显示标记，key 为位置，value 为标记内容。
-  </template>
-</Demo>
-
-## 不同尺寸
-
-Slider 组件提供三种尺寸。
-
-<Demo :source-code="sliderSizeCode">
-  <template #source>
-    <slider-size />
-  </template>
-  <template #description>
-    通过 `size` 属性设置不同的尺寸：large、default、small。
-  </template>
-</Demo>
-
-## API
-
-<ApiTable :data="sliderApi" componentName="slider" />
-
-<script setup>
-import SliderBasic from '../examples/slider/basic.vue'
-import SliderDisabled from '../examples/slider/disabled.vue'
-import SliderTooltip from '../examples/slider/tooltip.vue'
-import SliderVertical from '../examples/slider/vertical.vue'
-import SliderMarks from '../examples/slider/marks.vue'
-import SliderSize from '../examples/slider/size.vue'
-import sliderApi from './meta/slider'
-import sliderBasicCode from '../examples/slider/basic.vue?raw'
-import sliderDisabledCode from '../examples/slider/disabled.vue?raw'
-import sliderTooltipCode from '../examples/slider/tooltip.vue?raw'
-import sliderVerticalCode from '../examples/slider/vertical.vue?raw'
-import sliderMarksCode from '../examples/slider/marks.vue?raw'
-import sliderSizeCode from '../examples/slider/size.vue?raw'
-</script>
+# Slider 滑块
+
+通过拖动滑块在一个固定区间内进行选择。
+
+## 基础用法
+
+在自定义间距内选择一个数值。
+
+<Demo :source-code="sliderBasicCode">
+  <template #source>
+    <slider-basic />
+  </template>
+  <template #description>
+    展示了基础用法、间断点、带有输入框以及范围选择。
+  </template>
+</Demo>
+
+## 禁用状态
+
+通过设置 `readonly` 属性禁用滑块。
+
+<Demo :source-code="sliderDisabledCode">
+  <template #source>
+    <slider-disabled />
+  </template>
+  <template #description>
+    禁用状态下滑块不可拖动。
+  </template>
+</Demo>
+
+## 自定义提示
+
+可以自定义提示信息的格式或隐藏提示。
+
+<Demo :source-code="sliderTooltipCode">
+  <template #source>
+    <slider-tooltip />
+  </template>
+  <template #description>
+    使用 `format-tooltip` 自定义提示内容，使用 `show-tooltip` 控制提示的显示。
+  </template>
+</Demo>
+
+## 垂直模式
+
+设置 `vertical` 属性为 true 可以启用垂直模式。
+
+<Demo :source-code="sliderVerticalCode">
+  <template #source>
+    <slider-vertical />
+  </template>
+  <template #description>
+    垂直模式下必须设置高度 `height` 属性。
+  </template>
+</Demo>
+
+## 显示标记
+
+使用 `marks` 属性标注关键节点。
+
+<Demo :source-code="sliderMarksCode">
+  <template #source>
+    <slider-marks />
+  </template>
+  <template #description>
+    通过 `marks` 对象可以在滑块上显示标记，key 为位置，value 为标记内容。
+  </template>
+</Demo>
+
+## 不同尺寸
+
+Slider 组件提供三种尺寸。
+
+<Demo :source-code="sliderSizeCode">
+  <template #source>
+    <slider-size />
+  </template>
+  <template #description>
+    通过 `size` 属性设置不同的尺寸：large、default、small。
+  </template>
+</Demo>
+
+## API
+
+<ApiTable :data="sliderApi" componentName="slider" />
+
+<script setup>
+import SliderBasic from '../examples/slider/basic.vue'
+import SliderDisabled from '../examples/slider/disabled.vue'
+import SliderTooltip from '../examples/slider/tooltip.vue'
+import SliderVertical from '../examples/slider/vertical.vue'
+import SliderMarks from '../examples/slider/marks.vue'
+import SliderSize from '../examples/slider/size.vue'
+import sliderApi from './meta/slider'
+import sliderBasicCode from '../examples/slider/basic.vue?raw'
+import sliderDisabledCode from '../examples/slider/disabled.vue?raw'
+import sliderTooltipCode from '../examples/slider/tooltip.vue?raw'
+import sliderVerticalCode from '../examples/slider/vertical.vue?raw'
+import sliderMarksCode from '../examples/slider/marks.vue?raw'
+import sliderSizeCode from '../examples/slider/size.vue?raw'
+</script>

package/docs/components/switch.md

@@ -1,90 +1,90 @@
-# Switch 开关
-
-在两种状态之间切换。
-
-## 基础用法
-
-绑定 v-model 到一个 Boolean 类型的变量。
-
-<Demo :source-code="basicCode">
-  <template #source>
-    <basic />
-  </template>
-  <template #description>
-    最基本的用法。
-  </template>
-</Demo>
-
-## 尺寸
-
-提供三种不同尺寸。
-
-<Demo :source-code="sizeCode">
-  <template #source>
-    <size />
-  </template>
-  <template #description>
-    通过 `size` 属性设置尺寸，可选值为 `large`、`default`、`small`。
-  </template>
-</Demo>
-
-## 文字描述
-
-你可以添加 `active-text` 和 `inactive-text` 属性来显示文字描述。
-
-<Demo :source-code="textCode">
-  <template #source>
-    <text />
-  </template>
-  <template #description>
-    使用 `active-text` 和 `inactive-text` 属性来显示开关状态的文字描述。
-  </template>
-</Demo>
-
-## 禁用状态
-
-设置 `disabled` 属性来禁用开关。
-
-<Demo :source-code="disabledCode">
-  <template #source>
-    <disabled />
-  </template>
-  <template #description>
-    使用 `disabled` 属性来设置开关为禁用状态。
-  </template>
-</Demo>
-
-## 加载状态
-
-设置 `loading` 属性来显示加载状态。
-
-<Demo :source-code="loadingCode">
-  <template #source>
-    <loading />
-  </template>
-  <template #description>
-    使用 `loading` 属性来显示开关的加载状态。
-  </template>
-</Demo>
-
-## API
-
-### 属性
-
-<ApiTable :data="switchApi" componentName="switch" />
-
-<script setup>
-import basicCode from '../examples/switch/basic.vue?raw'
-import sizeCode from '../examples/switch/size.vue?raw'
-import textCode from '../examples/switch/text.vue?raw'
-import disabledCode from '../examples/switch/disabled.vue?raw'
-import loadingCode from '../examples/switch/loading.vue?raw'
-
-import Basic from '../examples/switch/basic.vue'
-import Size from '../examples/switch/size.vue'
-import Text from '../examples/switch/text.vue'
-import Disabled from '../examples/switch/disabled.vue'
-import Loading from '../examples/switch/loading.vue'
-
-import switchApi from '../components/meta/switch'
-</script>
+# Switch 开关
+
+在两种状态之间切换。
+
+## 基础用法
+
+绑定 v-model 到一个 Boolean 类型的变量。
+
+<Demo :source-code="basicCode">
+  <template #source>
+    <basic />
+  </template>
+  <template #description>
+    最基本的用法。
+  </template>
+</Demo>
+
+## 尺寸
+
+提供三种不同尺寸。
+
+<Demo :source-code="sizeCode">
+  <template #source>
+    <size />
+  </template>
+  <template #description>
+    通过 `size` 属性设置尺寸，可选值为 `large`、`default`、`small`。
+  </template>
+</Demo>
+
+## 文字描述
+
+你可以添加 `active-text` 和 `inactive-text` 属性来显示文字描述。
+
+<Demo :source-code="textCode">
+  <template #source>
+    <text />
+  </template>
+  <template #description>
+    使用 `active-text` 和 `inactive-text` 属性来显示开关状态的文字描述。
+  </template>
+</Demo>
+
+## 禁用状态
+
+设置 `disabled` 属性来禁用开关。
+
+<Demo :source-code="disabledCode">
+  <template #source>
+    <disabled />
+  </template>
+  <template #description>
+    使用 `disabled` 属性来设置开关为禁用状态。
+  </template>
+</Demo>
+
+## 加载状态
+
+设置 `loading` 属性来显示加载状态。
+
+<Demo :source-code="loadingCode">
+  <template #source>
+    <loading />
+  </template>
+  <template #description>
+    使用 `loading` 属性来显示开关的加载状态。
+  </template>
+</Demo>
+
+## API
+
+### 属性
+
+<ApiTable :data="switchApi" componentName="switch" />
+
+<script setup>
+import basicCode from '../examples/switch/basic.vue?raw'
+import sizeCode from '../examples/switch/size.vue?raw'
+import textCode from '../examples/switch/text.vue?raw'
+import disabledCode from '../examples/switch/disabled.vue?raw'
+import loadingCode from '../examples/switch/loading.vue?raw'
+
+import Basic from '../examples/switch/basic.vue'
+import Size from '../examples/switch/size.vue'
+import Text from '../examples/switch/text.vue'
+import Disabled from '../examples/switch/disabled.vue'
+import Loading from '../examples/switch/loading.vue'
+
+import switchApi from '../components/meta/switch'
+</script>