@varlet/cli 2.0.0-alpha.1663499244572 → 2.0.0-alpha.1663742071515

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 (231) hide show
  1. package/LICENCE +21 -21
  2. package/README.en-US.md +401 -401
  3. package/README.md +396 -396
  4. package/lib/commands/build.d.ts +1 -1
  5. package/lib/commands/build.js +67 -18
  6. package/lib/commands/changelog.d.ts +6 -6
  7. package/lib/commands/changelog.js +27 -26
  8. package/lib/commands/commitLint.d.ts +1 -1
  9. package/lib/commands/commitLint.js +21 -50
  10. package/lib/commands/compile.d.ts +7 -7
  11. package/lib/commands/compile.js +119 -43
  12. package/lib/commands/create.d.ts +8 -8
  13. package/lib/commands/create.js +181 -90
  14. package/lib/commands/dev.d.ts +5 -5
  15. package/lib/commands/dev.js +123 -44
  16. package/lib/commands/gen.d.ts +8 -8
  17. package/lib/commands/gen.js +140 -85
  18. package/lib/commands/jest.d.ts +8 -0
  19. package/lib/commands/jest.js +85 -0
  20. package/lib/commands/lint.d.ts +1 -1
  21. package/lib/commands/lint.js +123 -48
  22. package/lib/commands/preview.d.ts +1 -1
  23. package/lib/commands/preview.js +74 -23
  24. package/lib/commands/release.d.ts +5 -5
  25. package/lib/commands/release.js +270 -132
  26. package/lib/commands/test.d.ts +7 -7
  27. package/lib/commands/test.js +26 -26
  28. package/lib/commands/useVite.d.ts +1 -0
  29. package/lib/commands/useVite.js +70 -0
  30. package/lib/commands/vite.d.ts +3 -3
  31. package/lib/commands/vite.js +69 -20
  32. package/lib/compiler/compileModule.d.ts +5 -5
  33. package/lib/compiler/compileModule.js +190 -79
  34. package/lib/compiler/compileSFC.d.ts +2 -2
  35. package/lib/compiler/compileSFC.js +135 -86
  36. package/lib/compiler/compileScript.d.ts +17 -17
  37. package/lib/compiler/compileScript.js +194 -152
  38. package/lib/compiler/compileSiteEntry.d.ts +13 -13
  39. package/lib/compiler/compileSiteEntry.js +237 -140
  40. package/lib/compiler/compileStyle.d.ts +11 -11
  41. package/lib/compiler/compileStyle.js +91 -43
  42. package/lib/compiler/compileTemplateHighlight.d.ts +10 -10
  43. package/lib/compiler/compileTemplateHighlight.js +193 -145
  44. package/lib/compiler/compileTypes.d.ts +2 -2
  45. package/lib/compiler/compileTypes.js +85 -49
  46. package/lib/config/babel.config.d.ts +2 -2
  47. package/lib/config/babel.config.js +31 -30
  48. package/lib/config/babel.sfc.transform.d.ts +1 -1
  49. package/lib/config/babel.sfc.transform.js +18 -18
  50. package/lib/config/jest.config.d.ts +1 -0
  51. package/lib/config/jest.config.js +37 -0
  52. package/lib/config/jest.media.mock.d.ts +0 -0
  53. package/lib/config/jest.media.mock.js +2 -0
  54. package/lib/config/jest.style.mock.d.ts +0 -0
  55. package/lib/config/jest.style.mock.js +2 -0
  56. package/lib/config/varlet.config.d.ts +1 -1
  57. package/lib/config/varlet.config.js +24 -23
  58. package/lib/config/vite.config.d.ts +5 -5
  59. package/lib/config/vite.config.js +162 -157
  60. package/lib/config/vitest.config.d.ts +2 -2
  61. package/lib/config/vitest.config.js +28 -28
  62. package/lib/index.d.ts +2 -2
  63. package/lib/index.js +102 -84
  64. package/lib/shared/constant.d.ts +43 -44
  65. package/lib/shared/constant.js +50 -51
  66. package/lib/shared/fsUtils.d.ts +12 -12
  67. package/lib/shared/fsUtils.js +108 -61
  68. package/lib/shared/logger.d.ts +8 -8
  69. package/lib/shared/logger.js +23 -23
  70. package/package.json +11 -10
  71. package/preset.js +3 -3
  72. package/site/components/button/Button.vue +106 -106
  73. package/site/components/button/button.less +183 -183
  74. package/site/components/button/index.ts +10 -10
  75. package/site/components/button/props.ts +78 -78
  76. package/site/components/cell/Cell.vue +54 -54
  77. package/site/components/cell/cell.less +78 -78
  78. package/site/components/cell/index.ts +10 -10
  79. package/site/components/cell/props.ts +27 -27
  80. package/site/components/code-example/CodeExample.vue +137 -137
  81. package/site/components/code-example/codeExample.less +41 -41
  82. package/site/components/code-example/index.ts +10 -10
  83. package/site/components/context/index.ts +21 -21
  84. package/site/components/context/lock.ts +92 -92
  85. package/site/components/context/zIndex.ts +20 -20
  86. package/site/components/icon/Icon.vue +75 -75
  87. package/site/components/icon/icon.less +26 -26
  88. package/site/components/icon/index.ts +10 -10
  89. package/site/components/icon/props.ts +24 -24
  90. package/site/components/loading/Loading.vue +84 -84
  91. package/site/components/loading/index.ts +10 -10
  92. package/site/components/loading/loading.less +505 -505
  93. package/site/components/loading/props.ts +42 -42
  94. package/site/components/popup/Popup.tsx +102 -102
  95. package/site/components/popup/index.ts +10 -10
  96. package/site/components/popup/popup.less +125 -125
  97. package/site/components/popup/props.ts +63 -63
  98. package/site/components/progress/Progress.vue +112 -112
  99. package/site/components/progress/index.ts +10 -10
  100. package/site/components/progress/progress.less +101 -101
  101. package/site/components/progress/props.ts +55 -55
  102. package/site/components/ripple/index.ts +188 -188
  103. package/site/components/ripple/ripple.less +20 -20
  104. package/site/components/snackbar/Snackbar.vue +41 -41
  105. package/site/components/snackbar/core.vue +132 -132
  106. package/site/components/snackbar/index.tsx +270 -270
  107. package/site/components/snackbar/props.ts +97 -97
  108. package/site/components/snackbar/snackbar.less +135 -135
  109. package/site/components/styles/common.less +64 -64
  110. package/site/components/styles/elevation.less +126 -126
  111. package/site/components/styles/var.less +27 -27
  112. package/site/components/utils/components.ts +117 -117
  113. package/site/components/utils/elements.ts +102 -102
  114. package/site/index.html +49 -49
  115. package/site/mobile/App.vue +291 -291
  116. package/site/mobile/components/AppHome.vue +134 -134
  117. package/site/mobile/components/AppType.vue +22 -22
  118. package/site/mobile/components/app-bar/AppBar.vue +65 -65
  119. package/site/mobile/components/app-bar/appBar.less +57 -57
  120. package/site/mobile/components/app-bar/index.ts +10 -10
  121. package/site/mobile/components/app-bar/props.ts +25 -25
  122. package/site/mobile/main.ts +78 -78
  123. package/site/mobile.html +41 -41
  124. package/site/module.d.ts +5 -5
  125. package/site/pc/App.vue +43 -43
  126. package/site/pc/Layout.vue +423 -423
  127. package/site/pc/components/AnimationBox.vue +33 -33
  128. package/site/pc/components/AppHeader.vue +368 -368
  129. package/site/pc/components/AppMobile.vue +60 -60
  130. package/site/pc/components/AppSidebar.vue +143 -143
  131. package/site/pc/components/LogoAnimation.vue +117 -117
  132. package/site/pc/floating.ts +9 -9
  133. package/site/pc/main.ts +100 -100
  134. package/site/pc/pages/index/index.less +176 -176
  135. package/site/pc/pages/index/index.vue +130 -130
  136. package/site/pc/pages/index/locale/en-US.ts +1 -1
  137. package/site/pc/pages/index/locale/zh-CN.ts +1 -1
  138. package/site/tsconfig.json +11 -11
  139. package/site/useProgress.ts +72 -72
  140. package/site/utils.ts +165 -167
  141. package/template/create/__tests__/index.spec.ejs +8 -8
  142. package/template/create/example/index.ejs +15 -15
  143. package/template/create/example/locale/en-US.ts +3 -3
  144. package/template/create/example/locale/index.ts +23 -23
  145. package/template/create/example/locale/zh-CN.ts +3 -3
  146. package/template/create/index.ejs +12 -12
  147. package/template/create/less.ejs +3 -3
  148. package/template/create/props.ts +1 -1
  149. package/template/create/tsx.ejs +13 -13
  150. package/template/create/vue.ejs +17 -17
  151. package/template/generators/base/.prettierignore +9 -9
  152. package/template/generators/base/.prettierrc +5 -5
  153. package/template/generators/base/README.md +82 -82
  154. package/template/generators/base/babel.config.js +10 -10
  155. package/template/generators/base/public/highlight.css +1 -1
  156. package/template/generators/base/public/logo.svg +1 -1
  157. package/template/generators/base/shims/shims-md.d.ts +4 -4
  158. package/template/generators/base/shims/shims-vue.d.ts +6 -6
  159. package/template/generators/base/tsconfig.json +13 -13
  160. package/template/generators/config/default/base/docs/home.zh-CN.md +10 -10
  161. package/template/generators/config/default/base/package.json +105 -105
  162. package/template/generators/config/default/base/types/basicComponent.d.ts +7 -7
  163. package/template/generators/config/default/base/types/button.d.ts +12 -12
  164. package/template/generators/config/default/base/types/index.d.ts +6 -6
  165. package/template/generators/config/default/base/varlet.config.js +110 -110
  166. package/template/generators/config/default/sfc/src/button/Button.vue +30 -30
  167. package/template/generators/config/default/sfc/src/button/__tests__/index.spec.js +7 -7
  168. package/template/generators/config/default/sfc/src/button/button.less +14 -14
  169. package/template/generators/config/default/sfc/src/button/docs/zh-CN.md +47 -47
  170. package/template/generators/config/default/sfc/src/button/example/BasicUse.vue +7 -7
  171. package/template/generators/config/default/sfc/src/button/example/ModifyColor.vue +7 -7
  172. package/template/generators/config/default/sfc/src/button/example/index.vue +13 -13
  173. package/template/generators/config/default/sfc/src/button/index.ts +10 -10
  174. package/template/generators/config/default/tsx/src/button/Button.tsx +29 -29
  175. package/template/generators/config/default/tsx/src/button/__tests__/index.spec.js +7 -7
  176. package/template/generators/config/default/tsx/src/button/button.less +14 -14
  177. package/template/generators/config/default/tsx/src/button/docs/zh-CN.md +47 -47
  178. package/template/generators/config/default/tsx/src/button/example/BasicUse.vue +7 -7
  179. package/template/generators/config/default/tsx/src/button/example/ModifyColor.vue +7 -7
  180. package/template/generators/config/default/tsx/src/button/example/index.vue +13 -13
  181. package/template/generators/config/default/tsx/src/button/index.ts +10 -10
  182. package/template/generators/config/i18n/base/docs/home.en-US.md +11 -11
  183. package/template/generators/config/i18n/base/docs/home.zh-CN.md +10 -10
  184. package/template/generators/config/i18n/base/package.json +105 -105
  185. package/template/generators/config/i18n/base/types/basicComponent.d.ts +7 -7
  186. package/template/generators/config/i18n/base/types/button.d.ts +12 -12
  187. package/template/generators/config/i18n/base/types/index.d.ts +7 -7
  188. package/template/generators/config/i18n/base/types/locale.d.ts +24 -24
  189. package/template/generators/config/i18n/base/varlet.config.js +122 -122
  190. package/template/generators/config/i18n/sfc/src/button/Button.vue +36 -36
  191. package/template/generators/config/i18n/sfc/src/button/__tests__/index.spec.js +7 -7
  192. package/template/generators/config/i18n/sfc/src/button/button.less +14 -14
  193. package/template/generators/config/i18n/sfc/src/button/docs/en-US.md +34 -34
  194. package/template/generators/config/i18n/sfc/src/button/docs/zh-CN.md +34 -34
  195. package/template/generators/config/i18n/sfc/src/button/example/BasicUse.vue +11 -11
  196. package/template/generators/config/i18n/sfc/src/button/example/ModifyColor.vue +11 -11
  197. package/template/generators/config/i18n/sfc/src/button/example/index.vue +13 -13
  198. package/template/generators/config/i18n/sfc/src/button/example/locale/en-US.ts +5 -5
  199. package/template/generators/config/i18n/sfc/src/button/example/locale/index.ts +23 -23
  200. package/template/generators/config/i18n/sfc/src/button/example/locale/zh-CN.ts +5 -5
  201. package/template/generators/config/i18n/sfc/src/button/index.ts +10 -10
  202. package/template/generators/config/i18n/sfc/src/locale/__tests__/index.spec.js +51 -51
  203. package/template/generators/config/i18n/sfc/src/locale/docs/en-US.md +26 -26
  204. package/template/generators/config/i18n/sfc/src/locale/docs/zh-CN.md +25 -25
  205. package/template/generators/config/i18n/sfc/src/locale/en-US.d.ts +5 -5
  206. package/template/generators/config/i18n/sfc/src/locale/en-US.ts +7 -7
  207. package/template/generators/config/i18n/sfc/src/locale/index.ts +67 -67
  208. package/template/generators/config/i18n/sfc/src/locale/zh-CN.d.ts +5 -5
  209. package/template/generators/config/i18n/sfc/src/locale/zh-CN.ts +7 -7
  210. package/template/generators/config/i18n/tsx/src/button/Button.tsx +33 -33
  211. package/template/generators/config/i18n/tsx/src/button/__tests__/index.spec.js +7 -7
  212. package/template/generators/config/i18n/tsx/src/button/button.less +14 -14
  213. package/template/generators/config/i18n/tsx/src/button/docs/en-US.md +34 -34
  214. package/template/generators/config/i18n/tsx/src/button/docs/zh-CN.md +34 -34
  215. package/template/generators/config/i18n/tsx/src/button/example/BasicUse.vue +11 -11
  216. package/template/generators/config/i18n/tsx/src/button/example/ModifyColor.vue +11 -11
  217. package/template/generators/config/i18n/tsx/src/button/example/index.vue +13 -13
  218. package/template/generators/config/i18n/tsx/src/button/example/locale/en-US.ts +5 -5
  219. package/template/generators/config/i18n/tsx/src/button/example/locale/index.ts +23 -23
  220. package/template/generators/config/i18n/tsx/src/button/example/locale/zh-CN.ts +5 -5
  221. package/template/generators/config/i18n/tsx/src/button/index.ts +10 -10
  222. package/template/generators/config/i18n/tsx/src/locale/__tests__/index.spec.js +51 -51
  223. package/template/generators/config/i18n/tsx/src/locale/docs/en-US.md +26 -26
  224. package/template/generators/config/i18n/tsx/src/locale/docs/zh-CN.md +25 -25
  225. package/template/generators/config/i18n/tsx/src/locale/en-US.d.ts +5 -5
  226. package/template/generators/config/i18n/tsx/src/locale/en-US.ts +7 -7
  227. package/template/generators/config/i18n/tsx/src/locale/index.ts +67 -67
  228. package/template/generators/config/i18n/tsx/src/locale/zh-CN.d.ts +5 -5
  229. package/template/generators/config/i18n/tsx/src/locale/zh-CN.ts +7 -7
  230. package/tsconfig.json +14 -15
  231. package/varlet.default.config.js +3 -3
@@ -1,122 +1,122 @@
1
- module.exports = {
2
- name: 'Basic',
3
- namespace: 'b',
4
- title: 'Basic UI',
5
- logo: './logo.svg',
6
- useMobile: true,
7
- themes: {
8
- 'color-body': '#fff',
9
- 'color-bar': '#fff',
10
- 'color-sub-bar': '#f5f5f5',
11
- 'color-text': '#555',
12
- 'color-sub-text': '#888',
13
- 'color-border': 'rgba(0, 0, 0, 0.12)',
14
- 'color-shadow': '#eee',
15
- 'color-introduce-border': '#009688',
16
- 'color-primary': '#009688',
17
- 'color-link': '#009688',
18
- 'color-type': '#009688',
19
- 'color-progress': '#009688',
20
- 'color-progress-track': '#fff',
21
- 'color-side-bar': '#009688',
22
- 'color-side-bar-active-background': '#00968821',
23
- 'color-app-bar': '#009688',
24
- 'color-nav-button-hover-background': 'rgba(0, 0, 0, 0.08)',
25
- 'color-pc-language-active': '#009688',
26
- 'color-pc-language-active-background': '#00968821',
27
- 'color-mobile-language-active': '#009688',
28
- 'color-mobile-language-active-background': '#00968821',
29
- 'color-mobile-cell-hover': '#009688',
30
- },
31
- darkThemes: {
32
- 'color-body': '#121212',
33
- 'color-bar': '#1e1e1e',
34
- 'color-sub-bar': '#272727',
35
- 'color-text': '#fff',
36
- 'color-sub-text': '#aaa',
37
- 'color-border': '#333',
38
- 'color-shadow': '#121212',
39
- 'color-introduce-border': '#555',
40
- 'color-primary': '#009688',
41
- 'color-link': '#009688',
42
- 'color-type': '#009688',
43
- 'color-progress': '#009688',
44
- 'color-progress-track': '#202020',
45
- 'color-side-bar': '#009688',
46
- 'color-side-bar-active-background': '#00968821',
47
- 'color-app-bar': '#009688',
48
- 'color-nav-button-hover-background': 'rgba(255, 255, 255, 0.08)',
49
- 'color-pc-language-active': '#009688',
50
- 'color-pc-language-active-background': '#00968821',
51
- 'color-mobile-language-active': '#009688',
52
- 'color-mobile-language-active-background': '#00968821',
53
- 'color-mobile-cell-hover': '#009688',
54
- },
55
- highlight: {
56
- style: './highlight.css',
57
- },
58
- pc: {
59
- redirect: '/home',
60
- title: {
61
- 'zh-CN': '一个组件库',
62
- 'en-US': 'Components Library',
63
- },
64
- header: {
65
- darkMode: null,
66
- versions: null,
67
- i18n: {
68
- 'zh-CN': '中文',
69
- 'en-US': 'English',
70
- },
71
- playground: null,
72
- github: 'https://github.com/varletjs/varlet',
73
- },
74
- menu: [
75
- {
76
- text: {
77
- 'zh-CN': '开发指南',
78
- 'en-US': 'Developer guide',
79
- },
80
- type: 1,
81
- },
82
- {
83
- text: {
84
- 'zh-CN': '基本介绍',
85
- 'en-US': 'Basic Introduce',
86
- },
87
- doc: 'home',
88
- type: 3,
89
- },
90
- {
91
- text: {
92
- 'zh-CN': '基础组件',
93
- 'en-US': 'Basic Components',
94
- },
95
- type: 1,
96
- },
97
- {
98
- text: {
99
- 'zh-CN': 'Button 按钮',
100
- 'en-US': 'Button',
101
- },
102
- doc: 'button',
103
- type: 2,
104
- },
105
- ],
106
- },
107
- mobile: {
108
- redirect: '/home',
109
- title: {
110
- 'zh-CN': '一个组件库',
111
- 'en-US': 'Components Library',
112
- },
113
- header: {
114
- i18n: {
115
- 'zh-CN': '中文',
116
- 'en-US': 'English',
117
- },
118
- darkMode: null,
119
- github: 'https://github.com/varletjs/varlet',
120
- },
121
- },
122
- }
1
+ module.exports = {
2
+ name: 'Basic',
3
+ namespace: 'b',
4
+ title: 'Basic UI',
5
+ logo: './logo.svg',
6
+ useMobile: true,
7
+ themes: {
8
+ 'color-body': '#fff',
9
+ 'color-bar': '#fff',
10
+ 'color-sub-bar': '#f5f5f5',
11
+ 'color-text': '#555',
12
+ 'color-sub-text': '#888',
13
+ 'color-border': 'rgba(0, 0, 0, 0.12)',
14
+ 'color-shadow': '#eee',
15
+ 'color-introduce-border': '#009688',
16
+ 'color-primary': '#009688',
17
+ 'color-link': '#009688',
18
+ 'color-type': '#009688',
19
+ 'color-progress': '#009688',
20
+ 'color-progress-track': '#fff',
21
+ 'color-side-bar': '#009688',
22
+ 'color-side-bar-active-background': '#00968821',
23
+ 'color-app-bar': '#009688',
24
+ 'color-nav-button-hover-background': 'rgba(0, 0, 0, 0.08)',
25
+ 'color-pc-language-active': '#009688',
26
+ 'color-pc-language-active-background': '#00968821',
27
+ 'color-mobile-language-active': '#009688',
28
+ 'color-mobile-language-active-background': '#00968821',
29
+ 'color-mobile-cell-hover': '#009688',
30
+ },
31
+ darkThemes: {
32
+ 'color-body': '#121212',
33
+ 'color-bar': '#1e1e1e',
34
+ 'color-sub-bar': '#272727',
35
+ 'color-text': '#fff',
36
+ 'color-sub-text': '#aaa',
37
+ 'color-border': '#333',
38
+ 'color-shadow': '#121212',
39
+ 'color-introduce-border': '#555',
40
+ 'color-primary': '#009688',
41
+ 'color-link': '#009688',
42
+ 'color-type': '#009688',
43
+ 'color-progress': '#009688',
44
+ 'color-progress-track': '#202020',
45
+ 'color-side-bar': '#009688',
46
+ 'color-side-bar-active-background': '#00968821',
47
+ 'color-app-bar': '#009688',
48
+ 'color-nav-button-hover-background': 'rgba(255, 255, 255, 0.08)',
49
+ 'color-pc-language-active': '#009688',
50
+ 'color-pc-language-active-background': '#00968821',
51
+ 'color-mobile-language-active': '#009688',
52
+ 'color-mobile-language-active-background': '#00968821',
53
+ 'color-mobile-cell-hover': '#009688',
54
+ },
55
+ highlight: {
56
+ style: './highlight.css',
57
+ },
58
+ pc: {
59
+ redirect: '/home',
60
+ title: {
61
+ 'zh-CN': '一个组件库',
62
+ 'en-US': 'Components Library',
63
+ },
64
+ header: {
65
+ darkMode: null,
66
+ versions: null,
67
+ i18n: {
68
+ 'zh-CN': '中文',
69
+ 'en-US': 'English',
70
+ },
71
+ playground: null,
72
+ github: 'https://github.com/varletjs/varlet',
73
+ },
74
+ menu: [
75
+ {
76
+ text: {
77
+ 'zh-CN': '开发指南',
78
+ 'en-US': 'Developer guide',
79
+ },
80
+ type: 1,
81
+ },
82
+ {
83
+ text: {
84
+ 'zh-CN': '基本介绍',
85
+ 'en-US': 'Basic Introduce',
86
+ },
87
+ doc: 'home',
88
+ type: 3,
89
+ },
90
+ {
91
+ text: {
92
+ 'zh-CN': '基础组件',
93
+ 'en-US': 'Basic Components',
94
+ },
95
+ type: 1,
96
+ },
97
+ {
98
+ text: {
99
+ 'zh-CN': 'Button 按钮',
100
+ 'en-US': 'Button',
101
+ },
102
+ doc: 'button',
103
+ type: 2,
104
+ },
105
+ ],
106
+ },
107
+ mobile: {
108
+ redirect: '/home',
109
+ title: {
110
+ 'zh-CN': '一个组件库',
111
+ 'en-US': 'Components Library',
112
+ },
113
+ header: {
114
+ i18n: {
115
+ 'zh-CN': '中文',
116
+ 'en-US': 'English',
117
+ },
118
+ darkMode: null,
119
+ github: 'https://github.com/varletjs/varlet',
120
+ },
121
+ },
122
+ }
@@ -1,36 +1,36 @@
1
- <template>
2
- <button class="basic-button" :style="{ background: color }">
3
- <slot />
4
- <!-- {{ pack.button }}-->
5
- </button>
6
- </template>
7
-
8
- <script lang="ts">
9
- import { defineComponent, PropType } from 'vue'
10
-
11
- // i18n for component's internal
12
- // import { pack } from '../locale'
13
-
14
- export default defineComponent({
15
- name: 'BButton',
16
- props: {
17
- color: {
18
- type: String,
19
- },
20
- onClick: {
21
- type: Function as PropType<(e: Event) => void>,
22
- },
23
- },
24
- setup(props) {
25
- const handleClick = (e: Event) => props.onClick?.(e)
26
-
27
- return {
28
- handleClick,
29
- }
30
- },
31
- })
32
- </script>
33
-
34
- <style lang="less">
35
- @import 'button';
36
- </style>
1
+ <template>
2
+ <button class="basic-button" :style="{ background: color }">
3
+ <slot />
4
+ <!-- {{ pack.button }}-->
5
+ </button>
6
+ </template>
7
+
8
+ <script lang="ts">
9
+ import { defineComponent, PropType } from 'vue'
10
+
11
+ // i18n for component's internal
12
+ // import { pack } from '../locale'
13
+
14
+ export default defineComponent({
15
+ name: 'BButton',
16
+ props: {
17
+ color: {
18
+ type: String,
19
+ },
20
+ onClick: {
21
+ type: Function as PropType<(e: Event) => void>,
22
+ },
23
+ },
24
+ setup(props) {
25
+ const handleClick = (e: Event) => props.onClick?.(e)
26
+
27
+ return {
28
+ handleClick,
29
+ }
30
+ },
31
+ })
32
+ </script>
33
+
34
+ <style lang="less">
35
+ @import 'button';
36
+ </style>
@@ -1,7 +1,7 @@
1
- import Button from '../index'
2
- import { createApp } from 'vue'
3
-
4
- test('test button use', () => {
5
- const app = createApp({}).use(Button)
6
- expect(app.component(Button.name)).toBeTruthy()
7
- })
1
+ import Button from '../index'
2
+ import { createApp } from 'vue'
3
+
4
+ test('test button use', () => {
5
+ const app = createApp({}).use(Button)
6
+ expect(app.component(Button.name)).toBeTruthy()
7
+ })
@@ -1,14 +1,14 @@
1
- .basic-button {
2
- display: flex;
3
- padding: 10px;
4
- background: #009688;
5
- color: #fff;
6
- outline: none;
7
- border: none;
8
- border-radius: 2px;
9
- cursor: pointer;
10
-
11
- &:active {
12
- opacity: 0.9;
13
- }
14
- }
1
+ .basic-button {
2
+ display: flex;
3
+ padding: 10px;
4
+ background: #009688;
5
+ color: #fff;
6
+ outline: none;
7
+ border: none;
8
+ border-radius: 2px;
9
+ cursor: pointer;
10
+
11
+ &:active {
12
+ opacity: 0.9;
13
+ }
14
+ }
@@ -1,35 +1,35 @@
1
- # Button
2
-
3
- ### Basic Use
4
- ```html
5
- <b-button>start</b-button>
6
- ```
7
-
8
- ### Theme Color Button
9
- ```html
10
- <b-button color="#009688">start</b-button>
11
- ```
12
-
13
- ```vue
14
- import ModifyColor from '../example/ModifyColor'
15
- ```
16
-
17
- ## API
18
-
19
- ### Props
20
-
21
- | Prop | Description | Type | Default |
22
- | --- | --- | --- | --- |
23
- | `color` | 按钮颜色 | _string_ | `default` |
24
-
25
- ### Events
26
-
27
- | Event | Description | Arguments |
28
- | --- | --- | --- |
29
- | `click` | Triggered when the button is clicked | `event: Event` |
30
-
31
- ### Slots
32
-
33
- | Slot | Description | Arguments |
34
- |-----------| --- | --- |
1
+ # Button
2
+
3
+ ### Basic Use
4
+ ```html
5
+ <b-button>start</b-button>
6
+ ```
7
+
8
+ ### Theme Color Button
9
+ ```html
10
+ <b-button color="#009688">start</b-button>
11
+ ```
12
+
13
+ ```vue
14
+ import ModifyColor from '../example/ModifyColor'
15
+ ```
16
+
17
+ ## API
18
+
19
+ ### Props
20
+
21
+ | Prop | Description | Type | Default |
22
+ | --- | --- | --- | --- |
23
+ | `color` | 按钮颜色 | _string_ | `default` |
24
+
25
+ ### Events
26
+
27
+ | Event | Description | Arguments |
28
+ | --- | --- | --- |
29
+ | `click` | Triggered when the button is clicked | `event: Event` |
30
+
31
+ ### Slots
32
+
33
+ | Slot | Description | Arguments |
34
+ |-----------| --- | --- |
35
35
  | `default` | Button content | `-` |
@@ -1,35 +1,35 @@
1
- # 按钮
2
-
3
- ### 基本使用
4
- ```html
5
- <b-button>组件库从我开始</b-button>
6
- ```
7
-
8
- ### 主题色按钮
9
- ```html
10
- <b-button color="#009688">组件库从我开始</b-button>
11
- ```
12
-
13
- ```vue
14
- import ModifyColor from '../example/ModifyColor'
15
- ```
16
-
17
- ## API
18
-
19
- ### 属性
20
-
21
- | 参数 | 说明 | 类型 | 默认值 |
22
- | --- | --- | --- | --- |
23
- | `color` | 按钮颜色 | _string_ | `default` |
24
-
25
- ### 事件
26
-
27
- | 事件名 | 说明 | 参数 |
28
- | --- | --- | --- |
29
- | `click` | 点击按钮时触发 | `event: Event` |
30
-
31
- ### 插槽
32
-
33
- | 插槽名 | 说明 | 参数 |
34
- | --- | --- | --- |
1
+ # 按钮
2
+
3
+ ### 基本使用
4
+ ```html
5
+ <b-button>组件库从我开始</b-button>
6
+ ```
7
+
8
+ ### 主题色按钮
9
+ ```html
10
+ <b-button color="#009688">组件库从我开始</b-button>
11
+ ```
12
+
13
+ ```vue
14
+ import ModifyColor from '../example/ModifyColor'
15
+ ```
16
+
17
+ ## API
18
+
19
+ ### 属性
20
+
21
+ | 参数 | 说明 | 类型 | 默认值 |
22
+ | --- | --- | --- | --- |
23
+ | `color` | 按钮颜色 | _string_ | `default` |
24
+
25
+ ### 事件
26
+
27
+ | 事件名 | 说明 | 参数 |
28
+ | --- | --- | --- |
29
+ | `click` | 点击按钮时触发 | `event: Event` |
30
+
31
+ ### 插槽
32
+
33
+ | 插槽名 | 说明 | 参数 |
34
+ | --- | --- | --- |
35
35
  | `default` | 按钮内容 | `-` |
@@ -1,11 +1,11 @@
1
- <script setup>
2
- import { watchLang } from '@varlet/cli/site/utils'
3
- import BButton from '../Button'
4
- import { pack, use } from './locale'
5
-
6
- watchLang(use)
7
- </script>
8
-
9
- <template>
10
- <b-button>{{ pack.start }}</b-button>
11
- </template>
1
+ <script setup>
2
+ import { watchLang } from '@varlet/cli/site/utils'
3
+ import BButton from '../Button'
4
+ import { pack, use } from './locale'
5
+
6
+ watchLang(use)
7
+ </script>
8
+
9
+ <template>
10
+ <b-button>{{ pack.start }}</b-button>
11
+ </template>
@@ -1,11 +1,11 @@
1
- <script setup>
2
- import { watchLang } from '@varlet/cli/site/utils'
3
- import BButton from '../Button'
4
- import { pack, use } from './locale'
5
-
6
- watchLang(use, 'pc')
7
- </script>
8
-
9
- <template>
10
- <b-button color="#03A9F4">{{ pack.start }}</b-button>
11
- </template>
1
+ <script setup>
2
+ import { watchLang } from '@varlet/cli/site/utils'
3
+ import BButton from '../Button'
4
+ import { pack, use } from './locale'
5
+
6
+ watchLang(use, 'pc')
7
+ </script>
8
+
9
+ <template>
10
+ <b-button color="#03A9F4">{{ pack.start }}</b-button>
11
+ </template>
@@ -1,13 +1,13 @@
1
- <script setup>
2
- import AppType from '@varlet/cli/site/mobile/components/AppType'
3
- import { watchLang } from '@varlet/cli/site/utils'
4
- import BasicUse from './BasicUse'
5
- import { pack, use } from './locale'
6
-
7
- watchLang(use)
8
- </script>
9
-
10
- <template>
11
- <app-type>{{ pack.basicUse }}</app-type>
12
- <basic-use />
13
- </template>
1
+ <script setup>
2
+ import AppType from '@varlet/cli/site/mobile/components/AppType'
3
+ import { watchLang } from '@varlet/cli/site/utils'
4
+ import BasicUse from './BasicUse'
5
+ import { pack, use } from './locale'
6
+
7
+ watchLang(use)
8
+ </script>
9
+
10
+ <template>
11
+ <app-type>{{ pack.basicUse }}</app-type>
12
+ <basic-use />
13
+ </template>
@@ -1,5 +1,5 @@
1
- export default {
2
- basicUse: 'Basic use',
3
- modifyColor: 'Modify Color',
4
- start: 'Start',
5
- }
1
+ export default {
2
+ basicUse: 'Basic use',
3
+ modifyColor: 'Modify Color',
4
+ start: 'Start',
5
+ }
@@ -1,23 +1,23 @@
1
- // lib
2
- import _zhCN from '../../../locale/zh-CN'
3
- import _enCN from '../../../locale/en-US'
4
- // mobile example doc
5
- import zhCN from './zh-CN'
6
- import enUS from './en-US'
7
- import { useLocale, add as _add, use as _use } from '../../../locale'
8
-
9
- const { add, use: exampleUse, pack, packs, merge } = useLocale()
10
-
11
- const use = (lang: string) => {
12
- _use(lang)
13
- exampleUse(lang)
14
- }
15
-
16
- export { add, pack, packs, merge, use }
17
-
18
- // lib
19
- _add('zh-CN', _zhCN)
20
- _add('en-US', _enCN)
21
- // mobile example doc
22
- add('zh-CN', zhCN as any)
23
- add('en-US', enUS as any)
1
+ // lib
2
+ import _zhCN from '../../../locale/zh-CN'
3
+ import _enCN from '../../../locale/en-US'
4
+ // mobile example doc
5
+ import zhCN from './zh-CN'
6
+ import enUS from './en-US'
7
+ import { useLocale, add as _add, use as _use } from '../../../locale'
8
+
9
+ const { add, use: exampleUse, pack, packs, merge } = useLocale()
10
+
11
+ const use = (lang: string) => {
12
+ _use(lang)
13
+ exampleUse(lang)
14
+ }
15
+
16
+ export { add, pack, packs, merge, use }
17
+
18
+ // lib
19
+ _add('zh-CN', _zhCN)
20
+ _add('en-US', _enCN)
21
+ // mobile example doc
22
+ add('zh-CN', zhCN as any)
23
+ add('en-US', enUS as any)
@@ -1,5 +1,5 @@
1
- export default {
2
- basicUse: '基本使用',
3
- modifyColor: '修改颜色',
4
- start: '起步',
5
- }
1
+ export default {
2
+ basicUse: '基本使用',
3
+ modifyColor: '修改颜色',
4
+ start: '起步',
5
+ }
@@ -1,10 +1,10 @@
1
- import type { App } from 'vue'
2
- import Button from './Button.vue'
3
-
4
- Button.install = function (app: App) {
5
- app.component(Button.name, Button)
6
- }
7
-
8
- export const _ButtonComponent = Button
9
-
10
- export default Button
1
+ import type { App } from 'vue'
2
+ import Button from './Button.vue'
3
+
4
+ Button.install = function (app: App) {
5
+ app.component(Button.name, Button)
6
+ }
7
+
8
+ export const _ButtonComponent = Button
9
+
10
+ export default Button