@a2simcode/ui 0.0.67 → 0.0.69

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (321) hide show
  1. package/.cursor/skills/ui-component-helper/README.md +43 -43
  2. package/.cursor/skills/ui-component-helper/SKILL.md +81 -81
  3. package/LICENSE +53 -53
  4. package/README.md +156 -156
  5. package/dist/components/input-layer/index.d.ts +40 -0
  6. package/dist/components/input-layer/src/input-layer.vue.d.ts +40 -0
  7. package/dist/components/table-panel/index.d.ts +60 -0
  8. package/dist/components/table-panel/src/table-panel.vue.d.ts +60 -0
  9. package/dist/simcode-ui.es.js +4334 -4269
  10. package/dist/simcode-ui.umd.js +2 -2
  11. package/dist/stats.html +1 -1
  12. package/dist/ui.css +1 -1
  13. package/docs/components/autocomplete.md +89 -89
  14. package/docs/components/barcode.md +101 -101
  15. package/docs/components/button-select.md +24 -24
  16. package/docs/components/button.md +117 -117
  17. package/docs/components/buttons.md +119 -119
  18. package/docs/components/cascader-select.md +114 -114
  19. package/docs/components/checkbox.md +114 -114
  20. package/docs/components/code-mirror.md +85 -85
  21. package/docs/components/collapse.md +26 -26
  22. package/docs/components/comp.md +71 -71
  23. package/docs/components/count-up.md +24 -24
  24. package/docs/components/count.md +24 -24
  25. package/docs/components/data-panel.md +24 -24
  26. package/docs/components/dialog-full.md +112 -112
  27. package/docs/components/dialog.md +127 -127
  28. package/docs/components/divider.md +24 -24
  29. package/docs/components/drawer.md +127 -127
  30. package/docs/components/dynamic-layer.md +118 -118
  31. package/docs/components/echarts.md +72 -72
  32. package/docs/components/editor.md +24 -24
  33. package/docs/components/form.md +27 -27
  34. package/docs/components/guid.md +39 -39
  35. package/docs/components/hpanel.md +24 -24
  36. package/docs/components/icon.md +56 -56
  37. package/docs/components/input-button.md +24 -24
  38. package/docs/components/input-code.md +24 -24
  39. package/docs/components/input-color.md +114 -114
  40. package/docs/components/input-layer.md +26 -26
  41. package/docs/components/input-rows.md +370 -370
  42. package/docs/components/input-tag.md +50 -50
  43. package/docs/components/input.md +129 -129
  44. package/docs/components/layer-form.md +61 -61
  45. package/docs/components/layer.md +127 -127
  46. package/docs/components/layout.md +132 -132
  47. package/docs/components/map.md +24 -24
  48. package/docs/components/menu.md +121 -121
  49. package/docs/components/meta/buttons.ts +56 -56
  50. package/docs/components/meta/comp.ts +230 -230
  51. package/docs/components/meta/dynamic-layer.ts +99 -99
  52. package/docs/components/meta/echarts.ts +64 -64
  53. package/docs/components/meta/form-item.ts +50 -50
  54. package/docs/components/meta/form.ts +160 -160
  55. package/docs/components/meta/guid.ts +42 -42
  56. package/docs/components/meta/input-cards.ts +112 -112
  57. package/docs/components/meta/input-color.ts +243 -243
  58. package/docs/components/meta/input-rows.ts +113 -113
  59. package/docs/components/meta/input.ts +411 -411
  60. package/docs/components/meta/layer-form.ts +56 -56
  61. package/docs/components/meta/map.ts +68 -68
  62. package/docs/components/meta/number.ts +296 -296
  63. package/docs/components/meta/page.ts +67 -67
  64. package/docs/components/meta/panel.ts +152 -152
  65. package/docs/components/meta/radio.ts +55 -55
  66. package/docs/components/meta/slider.ts +270 -270
  67. package/docs/components/meta/table-panel.ts +154 -154
  68. package/docs/components/meta/table.ts +363 -363
  69. package/docs/components/meta/tabs.ts +136 -136
  70. package/docs/components/meta/tree-select.ts +199 -199
  71. package/docs/components/meta/workflow-viewer.ts +55 -55
  72. package/docs/components/meta/workflow.ts +113 -113
  73. package/docs/components/number.md +124 -124
  74. package/docs/components/page.md +42 -42
  75. package/docs/components/panel.md +37 -37
  76. package/docs/components/radio.md +87 -87
  77. package/docs/components/rate.md +71 -71
  78. package/docs/components/select.md +133 -133
  79. package/docs/components/slider-captcha.md +41 -41
  80. package/docs/components/slider.md +101 -101
  81. package/docs/components/switch.md +90 -90
  82. package/docs/components/table-panel.md +199 -199
  83. package/docs/components/table.md +319 -304
  84. package/docs/components/tabs.md +26 -26
  85. package/docs/components/title.md +24 -24
  86. package/docs/components/tree.md +207 -207
  87. package/docs/components/upload.md +117 -117
  88. package/docs/components/workflow-viewer.md +21 -21
  89. package/docs/components/workflow.md +21 -21
  90. package/docs/examples/autocomplete/advanced.vue +35 -35
  91. package/docs/examples/autocomplete/basic.vue +32 -32
  92. package/docs/examples/autocomplete/clearable.vue +33 -33
  93. package/docs/examples/autocomplete/custom-template.vue +49 -49
  94. package/docs/examples/autocomplete/disabled.vue +33 -33
  95. package/docs/examples/autocomplete/icon.vue +37 -37
  96. package/docs/examples/barcode/all-types.vue +380 -380
  97. package/docs/examples/barcode/basic.vue +14 -14
  98. package/docs/examples/barcode/props-appearance.vue +243 -243
  99. package/docs/examples/barcode/props-geometry.vue +143 -143
  100. package/docs/examples/barcode/props-logic.vue +216 -216
  101. package/docs/examples/barcode/props-symbology.vue +199 -199
  102. package/docs/examples/barcode/props-text.vue +268 -268
  103. package/docs/examples/button/basic.vue +7 -7
  104. package/docs/examples/button/danger-ghost.vue +17 -17
  105. package/docs/examples/button/disabled.vue +10 -10
  106. package/docs/examples/button/loading.vue +6 -6
  107. package/docs/examples/button/shape.vue +7 -7
  108. package/docs/examples/button/size.vue +14 -14
  109. package/docs/examples/button/type.vue +9 -9
  110. package/docs/examples/button-select/basic.vue +19 -19
  111. package/docs/examples/buttons/basic.vue +45 -45
  112. package/docs/examples/buttons/disabled.vue +36 -36
  113. package/docs/examples/buttons/dropdown.vue +63 -63
  114. package/docs/examples/buttons/group.vue +52 -52
  115. package/docs/examples/buttons/link.vue +47 -47
  116. package/docs/examples/buttons/popup.vue +39 -39
  117. package/docs/examples/buttons/size.vue +45 -45
  118. package/docs/examples/cascader-select/basic.vue +28 -28
  119. package/docs/examples/cascader-select/clearable.vue +34 -34
  120. package/docs/examples/cascader-select/disabled.vue +43 -43
  121. package/docs/examples/cascader-select/filterable.vue +37 -37
  122. package/docs/examples/cascader-select/methods.vue +84 -84
  123. package/docs/examples/cascader-select/multiple.vue +38 -38
  124. package/docs/examples/cascader-select/slot.vue +45 -45
  125. package/docs/examples/checkbox/basic.vue +18 -18
  126. package/docs/examples/checkbox/button.vue +19 -19
  127. package/docs/examples/checkbox/color.vue +25 -25
  128. package/docs/examples/checkbox/disabled.vue +17 -17
  129. package/docs/examples/checkbox/min-max.vue +20 -20
  130. package/docs/examples/checkbox/mixed.vue +56 -56
  131. package/docs/examples/checkbox/size.vue +28 -28
  132. package/docs/examples/code-mirror/basic.vue +11 -11
  133. package/docs/examples/code-mirror/events.vue +42 -42
  134. package/docs/examples/code-mirror/height.vue +25 -25
  135. package/docs/examples/code-mirror/mode.vue +33 -33
  136. package/docs/examples/code-mirror/readonly.vue +14 -14
  137. package/docs/examples/collapse/basic.vue +82 -82
  138. package/docs/examples/comp/basic.vue +7 -7
  139. package/docs/examples/comp/collapse.vue +38 -38
  140. package/docs/examples/comp/tabs.vue +38 -38
  141. package/docs/examples/count/basic.vue +54 -54
  142. package/docs/examples/count-up/basic.vue +89 -89
  143. package/docs/examples/data-panel/basic.vue +110 -110
  144. package/docs/examples/dialog/basic.vue +36 -36
  145. package/docs/examples/dialog/custom-buttons.vue +44 -44
  146. package/docs/examples/dialog/fullscreen.vue +23 -23
  147. package/docs/examples/dialog/no-mask.vue +17 -17
  148. package/docs/examples/dialog/size.vue +44 -44
  149. package/docs/examples/dialog/steps.vue +57 -57
  150. package/docs/examples/dialog-full/basic.vue +29 -29
  151. package/docs/examples/dialog-full/custom-buttons.vue +45 -45
  152. package/docs/examples/dialog-full/no-buttons.vue +18 -18
  153. package/docs/examples/dialog-full/no-header.vue +27 -27
  154. package/docs/examples/dialog-full/steps.vue +71 -71
  155. package/docs/examples/divider/basic.vue +52 -52
  156. package/docs/examples/drawer/basic.vue +35 -35
  157. package/docs/examples/drawer/custom-buttons.vue +34 -34
  158. package/docs/examples/drawer/direction.vue +47 -47
  159. package/docs/examples/drawer/mask.vue +36 -36
  160. package/docs/examples/drawer/no-buttons.vue +20 -20
  161. package/docs/examples/drawer/size.vue +28 -28
  162. package/docs/examples/dynamic-layer/basic.vue +33 -33
  163. package/docs/examples/dynamic-layer/custom-buttons.vue +43 -43
  164. package/docs/examples/dynamic-layer/form.vue +73 -73
  165. package/docs/examples/dynamic-layer/steps.vue +52 -52
  166. package/docs/examples/dynamic-layer/types.vue +40 -40
  167. package/docs/examples/echarts/basic.vue +31 -31
  168. package/docs/examples/echarts/dynamic.vue +43 -43
  169. package/docs/examples/echarts/line.vue +46 -46
  170. package/docs/examples/echarts/pie.vue +44 -44
  171. package/docs/examples/editor/basic.vue +15 -15
  172. package/docs/examples/form/basic.vue +450 -436
  173. package/docs/examples/guid/basic.vue +10 -10
  174. package/docs/examples/guid/size.vue +13 -13
  175. package/docs/examples/hpanel/basic.vue +79 -79
  176. package/docs/examples/icon/basic.vue +9 -9
  177. package/docs/examples/icon/rotate-flip.vue +9 -9
  178. package/docs/examples/icon/size.vue +7 -7
  179. package/docs/examples/input/basic.vue +10 -10
  180. package/docs/examples/input/clearable.vue +12 -12
  181. package/docs/examples/input/disabled.vue +6 -6
  182. package/docs/examples/input/icon.vue +23 -23
  183. package/docs/examples/input/password.vue +18 -18
  184. package/docs/examples/input/size.vue +13 -13
  185. package/docs/examples/input/textarea.vue +25 -25
  186. package/docs/examples/input/word-limit.vue +28 -28
  187. package/docs/examples/input-button/basic.vue +33 -33
  188. package/docs/examples/input-code/basic.vue +29 -29
  189. package/docs/examples/input-color/basic.vue +10 -10
  190. package/docs/examples/input-color/disabled.vue +13 -13
  191. package/docs/examples/input-color/format.vue +17 -17
  192. package/docs/examples/input-color/no-alpha.vue +13 -13
  193. package/docs/examples/input-color/only-button.vue +15 -15
  194. package/docs/examples/input-color/predefine.vue +31 -31
  195. package/docs/examples/input-color/size.vue +15 -15
  196. package/docs/examples/input-layer/basic.vue +69 -69
  197. package/docs/examples/input-rows/basic.vue +73 -73
  198. package/docs/examples/input-rows/drag.vue +48 -48
  199. package/docs/examples/input-rows/layer-form.vue +85 -85
  200. package/docs/examples/input-rows/nested.vue +91 -91
  201. package/docs/examples/input-tag/basic.vue +27 -27
  202. package/docs/examples/input-tag/colors.vue +23 -23
  203. package/docs/examples/input-tag/readonly.vue +17 -17
  204. package/docs/examples/layer/basic.vue +43 -43
  205. package/docs/examples/layer/custom-buttons.vue +61 -61
  206. package/docs/examples/layer/drawer.vue +37 -37
  207. package/docs/examples/layer/full.vue +38 -38
  208. package/docs/examples/layer/modal.vue +34 -34
  209. package/docs/examples/layer/steps.vue +46 -46
  210. package/docs/examples/layer-form/basic.vue +76 -76
  211. package/docs/examples/layer-form/config.vue +82 -82
  212. package/docs/examples/layer-form/size.vue +72 -72
  213. package/docs/examples/layout/basic.vue +36 -36
  214. package/docs/examples/layout/custom-size.vue +50 -50
  215. package/docs/examples/layout/disable-move.vue +37 -37
  216. package/docs/examples/layout/hide-mid-when-narrow.vue +96 -96
  217. package/docs/examples/layout/min-size.vue +73 -73
  218. package/docs/examples/layout/percent-size.vue +80 -80
  219. package/docs/examples/layout/simple.vue +22 -22
  220. package/docs/examples/layout/top-side.vue +34 -34
  221. package/docs/examples/map/basic.vue +22 -22
  222. package/docs/examples/menu/basic.vue +58 -58
  223. package/docs/examples/menu/collapsed.vue +49 -49
  224. package/docs/examples/menu/horizontal.vue +44 -44
  225. package/docs/examples/menu/selection-test.vue +104 -104
  226. package/docs/examples/menu/theme.vue +46 -46
  227. package/docs/examples/menu/vertical.vue +46 -46
  228. package/docs/examples/number/advanced.vue +143 -143
  229. package/docs/examples/number/basic.vue +63 -63
  230. package/docs/examples/number/disabled.vue +49 -49
  231. package/docs/examples/number/size.vue +42 -42
  232. package/docs/examples/number/slots.vue +123 -123
  233. package/docs/examples/number/step-strictly.vue +41 -41
  234. package/docs/examples/number/step.vue +47 -47
  235. package/docs/examples/page/basic.vue +41 -41
  236. package/docs/examples/page/init.vue +87 -87
  237. package/docs/examples/panel/tool-buttons.vue +18 -18
  238. package/docs/examples/radio/basic.vue +17 -17
  239. package/docs/examples/radio/button.vue +17 -17
  240. package/docs/examples/radio/color.vue +18 -18
  241. package/docs/examples/radio/disabled.vue +17 -17
  242. package/docs/examples/radio/size.vue +29 -29
  243. package/docs/examples/rate/basic.vue +24 -24
  244. package/docs/examples/rate/half.vue +24 -24
  245. package/docs/examples/rate/readonly.vue +11 -11
  246. package/docs/examples/rate/text.vue +32 -32
  247. package/docs/examples/select/basic.vue +16 -16
  248. package/docs/examples/select/clearable.vue +22 -22
  249. package/docs/examples/select/disabled.vue +31 -31
  250. package/docs/examples/select/filterable.vue +24 -24
  251. package/docs/examples/select/group.vue +23 -23
  252. package/docs/examples/select/icon.vue +16 -16
  253. package/docs/examples/select/multiple.vue +18 -18
  254. package/docs/examples/select/size.vue +39 -39
  255. package/docs/examples/slider/basic.vue +42 -42
  256. package/docs/examples/slider/disabled.vue +17 -17
  257. package/docs/examples/slider/marks.vue +30 -30
  258. package/docs/examples/slider/size.vue +37 -37
  259. package/docs/examples/slider/tooltip.vue +36 -36
  260. package/docs/examples/slider/vertical.vue +26 -26
  261. package/docs/examples/slider-captcha/basic.vue +44 -44
  262. package/docs/examples/slider-captcha/custom.vue +48 -48
  263. package/docs/examples/switch/basic.vue +16 -16
  264. package/docs/examples/switch/disabled.vue +13 -13
  265. package/docs/examples/switch/loading.vue +13 -13
  266. package/docs/examples/switch/size.vue +15 -15
  267. package/docs/examples/switch/text.vue +13 -13
  268. package/docs/examples/table/actions.vue +116 -116
  269. package/docs/examples/table/add-row.vue +103 -103
  270. package/docs/examples/table/basic.vue +168 -168
  271. package/docs/examples/table/custom-layout.vue +115 -115
  272. package/docs/examples/table/editable.vue +262 -262
  273. package/docs/examples/table/field-selection.vue +87 -87
  274. package/docs/examples/table/frozen-column.vue +140 -140
  275. package/docs/examples/table/height-mode.vue +99 -99
  276. package/docs/examples/table/icon.vue +85 -85
  277. package/docs/examples/table/link.vue +66 -66
  278. package/docs/examples/table/multiple.vue +178 -178
  279. package/docs/examples/table/pagination.vue +151 -151
  280. package/docs/examples/table/single-selection.vue +64 -64
  281. package/docs/examples/table/sub-table-lazy.vue +97 -97
  282. package/docs/examples/table/sub-table.vue +103 -103
  283. package/docs/examples/table/tag.vue +43 -43
  284. package/docs/examples/table/tree-column.vue +119 -119
  285. package/docs/examples/table/tree-data.vue +141 -141
  286. package/docs/examples/table/tree-lazy.vue +80 -0
  287. package/docs/examples/table-panel/basic.vue +228 -228
  288. package/docs/examples/table-panel/batch-operations.vue +285 -285
  289. package/docs/examples/table-panel/filter.vue +209 -209
  290. package/docs/examples/table-panel/multiple-selection.vue +243 -243
  291. package/docs/examples/table-panel/pagination.vue +133 -133
  292. package/docs/examples/tabs/basic.vue +98 -98
  293. package/docs/examples/title/basic.vue +80 -80
  294. package/docs/examples/tree/accordion.vue +46 -46
  295. package/docs/examples/tree/basic.vue +50 -50
  296. package/docs/examples/tree/buttons.vue +53 -53
  297. package/docs/examples/tree/checkable.vue +52 -52
  298. package/docs/examples/tree/custom-keys.vue +39 -39
  299. package/docs/examples/tree/default-expanded.vue +52 -52
  300. package/docs/examples/tree/draggable.vue +29 -29
  301. package/docs/examples/tree/expand-on-click.vue +39 -39
  302. package/docs/examples/tree/flat-data.vue +20 -20
  303. package/docs/examples/tree/icon.vue +40 -40
  304. package/docs/examples/tree/load-data.vue +37 -37
  305. package/docs/examples/tree/methods.vue +74 -74
  306. package/docs/examples/tree/theme.vue +33 -33
  307. package/docs/examples/upload/accept.vue +31 -31
  308. package/docs/examples/upload/basic.vue +12 -12
  309. package/docs/examples/upload/drag.vue +11 -11
  310. package/docs/examples/upload/image.vue +17 -17
  311. package/docs/examples/upload/limit.vue +20 -20
  312. package/docs/examples/upload/multiple.vue +17 -17
  313. package/docs/examples/upload/readonly.vue +17 -17
  314. package/docs/examples/utils/cipher.vue +160 -160
  315. package/docs/examples/utils/common.vue +153 -153
  316. package/docs/examples/utils/date.vue +56 -56
  317. package/docs/examples/utils/dom.vue +52 -52
  318. package/docs/examples/utils/is.vue +70 -70
  319. package/docs/examples/workflow/basic.vue +265 -265
  320. package/docs/examples/workflow-viewer/basic.vue +248 -248
  321. package/package.json +23 -23
@@ -1,24 +1,24 @@
1
- # Editor 富文本编辑器
2
-
3
- 基于 wangeditor 的富文本编辑器组件。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="editorBasicCode">
8
- <template #source>
9
- <editor-basic />
10
- </template>
11
- <template #description>
12
- 基础用法,支持 `v-model:value` 双向绑定。
13
- </template>
14
- </Demo>
15
-
16
- ## API
17
-
18
- <ApiTable :data="editorApi" componentName="editor" />
19
-
20
- <script setup>
21
- import EditorBasic from '../examples/editor/basic.vue'
22
- import editorApi from './meta/editor'
23
- import editorBasicCode from '../examples/editor/basic.vue?raw'
24
- </script>
1
+ # Editor 富文本编辑器
2
+
3
+ 基于 wangeditor 的富文本编辑器组件。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="editorBasicCode">
8
+ <template #source>
9
+ <editor-basic />
10
+ </template>
11
+ <template #description>
12
+ 基础用法,支持 `v-model:value` 双向绑定。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## API
17
+
18
+ <ApiTable :data="editorApi" componentName="editor" />
19
+
20
+ <script setup>
21
+ import EditorBasic from '../examples/editor/basic.vue'
22
+ import editorApi from './meta/editor'
23
+ import editorBasicCode from '../examples/editor/basic.vue?raw'
24
+ </script>
@@ -1,27 +1,27 @@
1
- # Form 表单
2
-
3
- `j-form` 是一个强大的动态表单组件,支持通过 Schema 配置来生成表单,提供了完整的表单验证、数据管理和事件处理能力。
4
-
5
- ## 基础用法
6
-
7
- 通过 `schema` 属性定义表单结构,`config` 属性配置表单样式。
8
-
9
- <Demo :source-code="basicCode">
10
- <template #source>
11
- <basic />
12
- </template>
13
- <template #description>
14
- 使用 `j-form` 快速创建一个包含多个输入项的表单。通过 `validate` 方法进行表单验证,通过 `getFormData` 方法获取表单数据。
15
- </template>
16
- </Demo>
17
-
18
- ## API
19
-
20
- <ApiTable :data="formApi" componentName="form" />
21
-
22
- <script setup>
23
- import Basic from '../examples/form/basic.vue'
24
- import formApi from './meta/form'
25
-
26
- import basicCode from '../examples/form/basic.vue?raw'
27
- </script>
1
+ # Form 表单
2
+
3
+ `j-form` 是一个强大的动态表单组件,支持通过 Schema 配置来生成表单,提供了完整的表单验证、数据管理和事件处理能力。
4
+
5
+ ## 基础用法
6
+
7
+ 通过 `schema` 属性定义表单结构,`config` 属性配置表单样式。
8
+
9
+ <Demo :source-code="basicCode">
10
+ <template #source>
11
+ <basic />
12
+ </template>
13
+ <template #description>
14
+ 使用 `j-form` 快速创建一个包含多个输入项的表单。通过 `validate` 方法进行表单验证,通过 `getFormData` 方法获取表单数据。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## API
19
+
20
+ <ApiTable :data="formApi" componentName="form" />
21
+
22
+ <script setup>
23
+ import Basic from '../examples/form/basic.vue'
24
+ import formApi from './meta/form'
25
+
26
+ import basicCode from '../examples/form/basic.vue?raw'
27
+ </script>
@@ -1,39 +1,39 @@
1
- # GUID 全局唯一标识符
2
-
3
- 用于生成和展示全局唯一标识符(GUID/UUID)。当不指定值时,组件会自动生成一个UUID,这在创建新记录或需要唯一标识时非常有用。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="guidBasicCode">
8
- <template #source>
9
- <guid-basic />
10
- </template>
11
- <template #description>
12
- 自动生成UUID,如果需要指定特定的GUID值,可以通过 v-model 绑定。
13
- </template>
14
- </Demo>
15
-
16
- ## 不同尺寸
17
-
18
- Guid 组件提供三种尺寸。
19
-
20
- <Demo :source-code="guidSizeCode">
21
- <template #source>
22
- <guid-size />
23
- </template>
24
- <template #description>
25
- 使用 size 属性改变组件大小。除了默认大小外,还有另外两个选项:large, small。
26
- </template>
27
- </Demo>
28
-
29
- ## API
30
-
31
- <ApiTable :data="guidApi" componentName="guid" />
32
-
33
- <script setup>
34
- import GuidBasic from '../examples/guid/basic.vue'
35
- import GuidSize from '../examples/guid/size.vue'
36
- import guidApi from './meta/guid'
37
- import guidBasicCode from '../examples/guid/basic.vue?raw'
38
- import guidSizeCode from '../examples/guid/size.vue?raw'
39
- </script>
1
+ # GUID 全局唯一标识符
2
+
3
+ 用于生成和展示全局唯一标识符(GUID/UUID)。当不指定值时,组件会自动生成一个UUID,这在创建新记录或需要唯一标识时非常有用。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="guidBasicCode">
8
+ <template #source>
9
+ <guid-basic />
10
+ </template>
11
+ <template #description>
12
+ 自动生成UUID,如果需要指定特定的GUID值,可以通过 v-model 绑定。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## 不同尺寸
17
+
18
+ Guid 组件提供三种尺寸。
19
+
20
+ <Demo :source-code="guidSizeCode">
21
+ <template #source>
22
+ <guid-size />
23
+ </template>
24
+ <template #description>
25
+ 使用 size 属性改变组件大小。除了默认大小外,还有另外两个选项:large, small。
26
+ </template>
27
+ </Demo>
28
+
29
+ ## API
30
+
31
+ <ApiTable :data="guidApi" componentName="guid" />
32
+
33
+ <script setup>
34
+ import GuidBasic from '../examples/guid/basic.vue'
35
+ import GuidSize from '../examples/guid/size.vue'
36
+ import guidApi from './meta/guid'
37
+ import guidBasicCode from '../examples/guid/basic.vue?raw'
38
+ import guidSizeCode from '../examples/guid/size.vue?raw'
39
+ </script>
@@ -1,24 +1,24 @@
1
- # Hpanel 水平布局
2
-
3
- 用于水平排列内容的面板,支持左、中(主内容)、右三个区域。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="hpanelBasicCode">
8
- <template #source>
9
- <hpanel-basic />
10
- </template>
11
- <template #description>
12
- 使用 `left`、`default` 和 `right` 插槽来定义面板的不同部分。
13
- </template>
14
- </Demo>
15
-
16
- ## API
17
-
18
- <ApiTable :data="hpanelApi" componentName="hpanel" />
19
-
20
- <script setup>
21
- import HpanelBasic from '../examples/hpanel/basic.vue'
22
- import hpanelApi from './meta/hpanel'
23
- import hpanelBasicCode from '../examples/hpanel/basic.vue?raw'
24
- </script>
1
+ # Hpanel 水平布局
2
+
3
+ 用于水平排列内容的面板,支持左、中(主内容)、右三个区域。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="hpanelBasicCode">
8
+ <template #source>
9
+ <hpanel-basic />
10
+ </template>
11
+ <template #description>
12
+ 使用 `left`、`default` 和 `right` 插槽来定义面板的不同部分。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## API
17
+
18
+ <ApiTable :data="hpanelApi" componentName="hpanel" />
19
+
20
+ <script setup>
21
+ import HpanelBasic from '../examples/hpanel/basic.vue'
22
+ import hpanelApi from './meta/hpanel'
23
+ import hpanelBasicCode from '../examples/hpanel/basic.vue?raw'
24
+ </script>
@@ -1,56 +1,56 @@
1
- # Icon 图标
2
-
3
- 语义化的矢量图形。使用了 [@iconify/vue](https://iconify.design/docs/icon-components/vue/)。
4
-
5
- ## 基础用法
6
-
7
- 通过 `icon` 属性来指定图标名称。你可以从 [Iconify](https://icon-sets.iconify.design/) 搜索成千上万个图标。
8
-
9
- <Demo :source-code="iconBasicCode">
10
- <template #source>
11
- <icon-basic />
12
- </template>
13
- <template #description>
14
- 使用 icon、color 来定义图标和颜色。
15
- </template>
16
- </Demo>
17
-
18
- ## 不同尺寸
19
-
20
- 使用 `size` 属性来配置图标尺寸。
21
-
22
- <Demo :source-code="iconSizeCode">
23
- <template #source>
24
- <icon-size />
25
- </template>
26
- <template #description>
27
- size 接受数字(单位为px)。
28
- </template>
29
- </Demo>
30
-
31
- ## 旋转与翻转
32
-
33
- 使用 `rotate` 和 `flip` 属性来调整图标方向。
34
-
35
- <Demo :source-code="iconRotateFlipCode">
36
- <template #source>
37
- <icon-rotate-flip />
38
- </template>
39
- <template #description>
40
- 使用 rotate 定义角度,使用 flip 定义翻转方向。
41
- </template>
42
- </Demo>
43
-
44
- ## API
45
-
46
- <ApiTable :data="iconApi" componentName="icon" />
47
-
48
- <script setup>
49
- import IconBasic from '../examples/icon/basic.vue'
50
- import IconSize from '../examples/icon/size.vue'
51
- import IconRotateFlip from '../examples/icon/rotate-flip.vue'
52
- import iconApi from './meta/icon'
53
- import iconBasicCode from '../examples/icon/basic.vue?raw'
54
- import iconSizeCode from '../examples/icon/size.vue?raw'
55
- import iconRotateFlipCode from '../examples/icon/rotate-flip.vue?raw'
56
- </script>
1
+ # Icon 图标
2
+
3
+ 语义化的矢量图形。使用了 [@iconify/vue](https://iconify.design/docs/icon-components/vue/)。
4
+
5
+ ## 基础用法
6
+
7
+ 通过 `icon` 属性来指定图标名称。你可以从 [Iconify](https://icon-sets.iconify.design/) 搜索成千上万个图标。
8
+
9
+ <Demo :source-code="iconBasicCode">
10
+ <template #source>
11
+ <icon-basic />
12
+ </template>
13
+ <template #description>
14
+ 使用 icon、color 来定义图标和颜色。
15
+ </template>
16
+ </Demo>
17
+
18
+ ## 不同尺寸
19
+
20
+ 使用 `size` 属性来配置图标尺寸。
21
+
22
+ <Demo :source-code="iconSizeCode">
23
+ <template #source>
24
+ <icon-size />
25
+ </template>
26
+ <template #description>
27
+ size 接受数字(单位为px)。
28
+ </template>
29
+ </Demo>
30
+
31
+ ## 旋转与翻转
32
+
33
+ 使用 `rotate` 和 `flip` 属性来调整图标方向。
34
+
35
+ <Demo :source-code="iconRotateFlipCode">
36
+ <template #source>
37
+ <icon-rotate-flip />
38
+ </template>
39
+ <template #description>
40
+ 使用 rotate 定义角度,使用 flip 定义翻转方向。
41
+ </template>
42
+ </Demo>
43
+
44
+ ## API
45
+
46
+ <ApiTable :data="iconApi" componentName="icon" />
47
+
48
+ <script setup>
49
+ import IconBasic from '../examples/icon/basic.vue'
50
+ import IconSize from '../examples/icon/size.vue'
51
+ import IconRotateFlip from '../examples/icon/rotate-flip.vue'
52
+ import iconApi from './meta/icon'
53
+ import iconBasicCode from '../examples/icon/basic.vue?raw'
54
+ import iconSizeCode from '../examples/icon/size.vue?raw'
55
+ import iconRotateFlipCode from '../examples/icon/rotate-flip.vue?raw'
56
+ </script>
@@ -1,24 +1,24 @@
1
- # InputButton 输入按钮
2
-
3
- 通过点击按钮打开一个弹窗层,用于输入或选择复杂的数据。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="inputButtonBasicCode">
8
- <template #source>
9
- <input-button-basic />
10
- </template>
11
- <template #description>
12
- 点击按钮打开弹窗,在弹窗中完成输入后点击确定。
13
- </template>
14
- </Demo>
15
-
16
- ## API
17
-
18
- <ApiTable :data="inputButtonApi" componentName="input-button" />
19
-
20
- <script setup>
21
- import InputButtonBasic from '../examples/input-button/basic.vue'
22
- import inputButtonApi from './meta/input-button'
23
- import inputButtonBasicCode from '../examples/input-button/basic.vue?raw'
24
- </script>
1
+ # InputButton 输入按钮
2
+
3
+ 通过点击按钮打开一个弹窗层,用于输入或选择复杂的数据。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="inputButtonBasicCode">
8
+ <template #source>
9
+ <input-button-basic />
10
+ </template>
11
+ <template #description>
12
+ 点击按钮打开弹窗,在弹窗中完成输入后点击确定。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## API
17
+
18
+ <ApiTable :data="inputButtonApi" componentName="input-button" />
19
+
20
+ <script setup>
21
+ import InputButtonBasic from '../examples/input-button/basic.vue'
22
+ import inputButtonApi from './meta/input-button'
23
+ import inputButtonBasicCode from '../examples/input-button/basic.vue?raw'
24
+ </script>
@@ -1,24 +1,24 @@
1
- # InputCode 脚本输入框
2
-
3
- 通过点击按钮打开一个集成了脚本编辑器的弹窗,用于编写代码或脚本内容。
4
-
5
- ## 基础用法
6
-
7
- <Demo :source-code="inputCodeBasicCode">
8
- <template #source>
9
- <input-code-basic />
10
- </template>
11
- <template #description>
12
- 点击按钮打开代码编辑器,支持多种语言模式和示例代码对比。
13
- </template>
14
- </Demo>
15
-
16
- ## API
17
-
18
- <ApiTable :data="inputCodeApi" componentName="input-code" />
19
-
20
- <script setup>
21
- import InputCodeBasic from '../examples/input-code/basic.vue'
22
- import inputCodeApi from './meta/input-code'
23
- import inputCodeBasicCode from '../examples/input-code/basic.vue?raw'
24
- </script>
1
+ # InputCode 脚本输入框
2
+
3
+ 通过点击按钮打开一个集成了脚本编辑器的弹窗,用于编写代码或脚本内容。
4
+
5
+ ## 基础用法
6
+
7
+ <Demo :source-code="inputCodeBasicCode">
8
+ <template #source>
9
+ <input-code-basic />
10
+ </template>
11
+ <template #description>
12
+ 点击按钮打开代码编辑器,支持多种语言模式和示例代码对比。
13
+ </template>
14
+ </Demo>
15
+
16
+ ## API
17
+
18
+ <ApiTable :data="inputCodeApi" componentName="input-code" />
19
+
20
+ <script setup>
21
+ import InputCodeBasic from '../examples/input-code/basic.vue'
22
+ import inputCodeApi from './meta/input-code'
23
+ import inputCodeBasicCode from '../examples/input-code/basic.vue?raw'
24
+ </script>