vdesign-ui 0.2.0 → 0.2.2

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 (109) hide show
  1. package/dist/components/actionbar/style.less +8 -12
  2. package/dist/components/actionbar-cell/index.js +7 -0
  3. package/dist/components/{actionbar/actionbar-cell → actionbar-cell}/index.vue +4 -0
  4. package/dist/components/{actions-cell/actions → actions}/index.vue +6 -6
  5. package/dist/components/{actions-cell/actions → actions}/style.less +38 -41
  6. package/dist/components/activityviews/index.vue +7 -1
  7. package/dist/components/activityviews/style.less +42 -46
  8. package/dist/components/badge/style.less +22 -34
  9. package/dist/components/button/index.vue +4 -0
  10. package/dist/components/button/style.less +82 -87
  11. package/dist/components/calendar/index.vue +1 -1
  12. package/dist/components/calendar/style.less +24 -53
  13. package/dist/components/checkbox/index.vue +5 -1
  14. package/dist/components/checkbox/style.less +30 -32
  15. package/dist/components/checkbox-group/index.js +7 -0
  16. package/dist/components/{checkbox/checkbox-group → checkbox-group}/index.vue +1 -2
  17. package/dist/components/common/state/index.vue +1 -48
  18. package/dist/components/common/state/style.less +48 -0
  19. package/dist/components/data-list/style.less +81 -82
  20. package/dist/components/datetime-picker/style.less +12 -12
  21. package/dist/components/dialog/index.vue +4 -0
  22. package/dist/components/dialog/style.less +27 -31
  23. package/dist/components/divider/style.less +1 -1
  24. package/dist/components/dropdown/index.vue +6 -1
  25. package/dist/components/dropdown/style.less +117 -125
  26. package/dist/components/empty/index.vue +10 -8
  27. package/dist/components/empty/style.less +34 -26
  28. package/dist/components/footer/style.less +6 -7
  29. package/dist/components/footnav/index.vue +1 -1
  30. package/dist/components/footnav/style.less +5 -5
  31. package/dist/components/{footnav/footnav-item → footnav-item}/index.vue +7 -1
  32. package/dist/components/{footnav/footnav-item → footnav-item}/style.less +2 -2
  33. package/dist/components/headnav/index.vue +5 -1
  34. package/dist/components/headnav/style.less +54 -58
  35. package/dist/components/icon/style.less +4 -4
  36. package/dist/components/input/index.vue +4 -0
  37. package/dist/components/input/style.less +88 -101
  38. package/dist/components/list/index.vue +5 -0
  39. package/dist/components/list/style.less +45 -52
  40. package/dist/components/loading/index.vue +3 -5
  41. package/dist/components/loading/style.less +28 -22
  42. package/dist/components/mixins/languageMixin.js +7 -3
  43. package/dist/components/mixins/outlineConfigPlugin.js +1 -1
  44. package/dist/components/mixins/themeMixin.js +29 -15
  45. package/dist/components/noticebar/index.vue +7 -1
  46. package/dist/components/noticebar/style.less +125 -129
  47. package/dist/components/overlay/index.vue +34 -11
  48. package/dist/components/pagebreak/style.less +18 -19
  49. package/dist/components/popover/index.vue +2 -1
  50. package/dist/components/popover/style.less +39 -39
  51. package/dist/components/radio/index.js +1 -1
  52. package/dist/components/radio/index.vue +1 -1
  53. package/dist/components/radio/style.less +35 -43
  54. package/dist/components/radio-group/index.js +6 -0
  55. package/dist/components/{radio/radio-group → radio-group}/index.vue +1 -1
  56. package/dist/components/result/completed-dark.png +0 -0
  57. package/dist/components/result/completed.png +0 -0
  58. package/dist/components/result/error-dark.png +0 -0
  59. package/dist/components/result/error.png +0 -0
  60. package/dist/components/result/index.vue +1 -2
  61. package/dist/components/result/style.less +22 -20
  62. package/dist/components/result/wait-dark.png +0 -0
  63. package/dist/components/result/wait.png +0 -0
  64. package/dist/components/{input/search → search}/index.vue +4 -0
  65. package/dist/components/selector/index.vue +4 -0
  66. package/dist/components/selector/style.less +96 -100
  67. package/dist/components/skeleton/style.less +112 -107
  68. package/dist/components/slider/index.vue +1 -1
  69. package/dist/components/slider/style.less +41 -37
  70. package/dist/components/step/style.less +3 -4
  71. package/dist/components/step-item/index.vue +12 -3
  72. package/dist/components/step-item/style.less +61 -60
  73. package/dist/components/{input/stepper → stepper}/index.vue +5 -1
  74. package/dist/components/switch/style.less +8 -8
  75. package/dist/components/tab/index.js +7 -0
  76. package/dist/components/tabs/index.vue +4 -0
  77. package/dist/components/tabs/style.less +97 -105
  78. package/dist/components/tag/style.less +35 -35
  79. package/dist/components/title/index.vue +4 -0
  80. package/dist/components/title/style.less +164 -170
  81. package/dist/components/toast/index.js +9 -3
  82. package/dist/components/toast/style.less +8 -8
  83. package/dist/components/upload/index.vue +4 -0
  84. package/dist/components/upload/style.less +22 -31
  85. package/dist/components/utils/env.js +2 -0
  86. package/dist/token.css +1278 -1278
  87. package/dist/vdesign-ui.common.js +1138 -991
  88. package/dist/vdesign-ui.css +1 -1
  89. package/dist/vdesign-ui.umd.js +1138 -991
  90. package/dist/vdesign-ui.umd.min.js +3 -3
  91. package/package.json +1 -1
  92. package/dist/components/checkbox/checkbox-group/index.js +0 -8
  93. package/dist/components/loading/img_status_loading_white_ani.svg +0 -155
  94. package/dist/components/loading/img_status_refresh_ani.svg +0 -158
  95. package/dist/components/radio/assist.js +0 -34
  96. package/dist/components/radio/style.css +0 -213
  97. package/dist/img/completed-dark.4183a8a8.png +0 -0
  98. package/dist/img/error-dark.b80857da.png +0 -0
  99. package/dist/img/img_status_loading_white_ani.b56fcfae.svg +0 -155
  100. package/dist/img/img_status_refresh_ani.d0e59f12.svg +0 -158
  101. package/dist/img/wait-dark.6aa28731.png +0 -0
  102. /package/dist/components/{actions-cell/actions → actions}/index.js +0 -0
  103. /package/dist/components/{footnav/footnav-item → footnav-item}/index.js +0 -0
  104. /package/dist/components/{input/password → password}/index.js +0 -0
  105. /package/dist/components/{input/password → password}/index.vue +0 -0
  106. /package/dist/components/{input/search → search}/index.js +0 -0
  107. /package/dist/components/{input/stepper → stepper}/index.js +0 -0
  108. /package/dist/components/{tabs/tab → tab}/index.vue +0 -0
  109. /package/dist/components/{checkbox → utils}/assist.js +0 -0
package/dist/components/selector/style.less CHANGED
@@ -37,270 +37,266 @@
37
37
  &-xl {
38
38
 
39
39
  &__title {
40
- font-size: calc(var(--en-single-f-e-r-fontSize) * 1px);
40
+ font-size: var(--en-single-f-e-r-fontSize);
41
41
  font-weight: var(--en-single-f-e-r-fontWeight);
42
42
  color: var(--color-selector-xl-text-default);
43
43
  white-space: nowrap;
44
44
  overflow: hidden;
45
45
  text-overflow: ellipsis;
46
-
46
+
47
47
  &--active {
48
- font-size: calc(var(--en-single-f-f-b-fontSize) * 1px);
48
+ font-size: var(--en-single-f-f-b-fontSize);
49
49
  font-weight: var(--en-single-f-f-b-fontWeight);
50
50
  color: var(--color-selector-xl-text-active);
51
51
  }
52
-
52
+
53
53
  &--disabled {
54
- font-size: calc(var(--en-single-f-f-b-fontSize) * 1px);
54
+ font-size: var(--en-single-f-f-b-fontSize);
55
55
  font-weight: var(--en-single-f-f-b-fontWeight);
56
56
  color: var(--color-selector-xl-text-disable);
57
57
  }
58
58
  }
59
-
59
+
60
60
  &__icon {
61
61
  display: flex;
62
- font-size: calc(var(--icon-selector-xl) * 1px);
63
- margin-inline-end: calc(var(--spacing-selector-xl-margin_y) * 1px);
64
-
62
+ font-size: var(--icon-selector-xl);
63
+ margin-inline-end: var(--spacing-selector-xl-margin_y);
64
+
65
65
  &--disabled {
66
66
  opacity: var(--opacity-30);
67
67
  }
68
68
  }
69
-
69
+
70
70
  &__arrow {
71
- font-size: calc(var(--icon-small) * 1px);
72
- margin-inline-start: calc(var(--spacing-selector-l-margin_y) * 1px);
71
+ font-size: var(--icon-small);
72
+ margin-inline-start: var(--spacing-selector-l-margin_y);
73
73
  color: var(--color-selector-icon_down-default);
74
74
  transition: transform .3s;
75
-
75
+
76
76
  &--active {
77
77
  color: var(--color-selector-icon_down-active);
78
78
  }
79
-
79
+
80
80
  &--disabled {
81
81
  color: var(--color-selector-icon_down-disable);
82
82
  }
83
83
  }
84
-
85
-
86
- }
84
+
85
+ }
87
86
 
88
87
  &-l {
89
88
 
90
89
  &__title {
91
- font-size: calc(var(--en-single-f-d-r-fontSize) * 1px);
90
+ font-size: var(--en-single-f-d-r-fontSize);
92
91
  font-weight: var(--en-single-f-d-r-fontWeight);
93
92
  color: var(--color-selector-l-text-default);
94
93
  white-space: nowrap;
95
94
  overflow: hidden;
96
95
  text-overflow: ellipsis;
97
-
96
+
98
97
  &--active {
99
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
98
+ font-size: var(--en-single-f-d-s-fontSize);
100
99
  font-weight: var(--en-single-f-d-s-fontWeight);
101
100
  color: var(--color-selector-l-text-active);
102
101
  }
103
-
102
+
104
103
  &--disabled {
105
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
104
+ font-size: var(--en-single-f-d-s-fontSize);
106
105
  font-weight: var(--en-single-f-d-s-fontWeight);
107
106
  color: var(--color-selector-l-text-disable);
108
107
  }
109
108
  }
110
-
109
+
111
110
  &__icon {
112
111
  display: flex;
113
- font-size: calc(var(--icon-selector-l) * 1px);
114
- margin-inline-end: calc(var(--spacing-selector-l-margin_y) * 1px);
115
-
112
+ font-size: var(--icon-selector-l);
113
+ margin-inline-end: var(--spacing-selector-l-margin_y);
114
+
116
115
  &--disabled {
117
116
  opacity: var(--opacity-30);
118
117
  }
119
118
  }
120
-
119
+
121
120
  &__arrow {
122
- font-size: calc(var(--icon-small) * 1px);
123
- margin-inline-start: calc(var(--spacing-selector-l-margin_y) * 1px);
121
+ font-size: var(--icon-small);
122
+ margin-inline-start: var(--spacing-selector-l-margin_y);
124
123
  color: var(--color-selector-icon_down-default);
125
124
  transition: transform .3s;
126
-
125
+
127
126
  &--active {
128
127
  color: var(--color-selector-icon_down-active);
129
128
  }
130
-
129
+
131
130
  &--disabled {
132
131
  color: var(--color-selector-icon_down-disable);
133
132
  }
134
133
  }
135
-
136
134
  }
137
-
135
+
138
136
  &-m {
139
-
137
+
140
138
  &__title {
141
- font-size: calc(var(--en-single-f-c-r-fontSize) * 1px);
139
+ font-size: var(--en-single-f-c-r-fontSize);
142
140
  font-weight: var(--en-single-f-c-r-fontWeight);
143
141
  color: var(--color-selector-m-text-default);
144
142
  white-space: nowrap;
145
143
  overflow: hidden;
146
144
  text-overflow: ellipsis;
147
-
145
+
148
146
  &--active {
149
- font-size: calc(var(--en-single-f-c-s-fontSize) * 1px);
147
+ font-size: var(--en-single-f-c-s-fontSize);
150
148
  font-weight: var(--en-single-f-c-s-fontWeight);
151
149
  color: var(--color-selector-m-text-active);
152
150
  }
153
-
151
+
154
152
  &--disabled {
155
- font-size: calc(var(--en-single-f-c-s-fontSize) * 1px);
153
+ font-size: var(--en-single-f-c-s-fontSize);
156
154
  font-weight: var(--en-single-f-c-s-fontWeight);
157
155
  color: var(--color-selector-m-text-disable);
158
156
  }
159
157
  }
160
-
158
+
161
159
  &__icon {
162
160
  display: flex;
163
- font-size: calc(var(--icon-selector-m) * 1px);
164
- margin-inline-end: calc(var(--spacing-selector-m-margin_y) * 1px);
165
-
161
+ font-size: var(--icon-selector-m);
162
+ margin-inline-end: var(--spacing-selector-m-margin_y);
163
+
166
164
  &--disabled {
167
165
  opacity: var(--opacity-30);
168
166
  }
169
167
  }
170
-
168
+
171
169
  &__arrow {
172
- font-size: calc(var(--icon-small) * 1px);
173
- margin-inline-start: calc(var(--spacing-selector-m-margin_y) * 1px);
170
+ font-size: var(--icon-small);
171
+ margin-inline-start: var(--spacing-selector-m-margin_y);
174
172
  color: var(--color-selector-icon_down-default);
175
173
  transition: transform .3s;
176
-
174
+
177
175
  &--active {
178
176
  color: var(--color-selector-icon_down-active);
179
177
  }
180
-
178
+
181
179
  &--disabled {
182
180
  color: var(--color-selector-icon_down-disable);
183
181
  }
184
182
  }
185
183
  }
186
-
184
+
187
185
  &-s {
188
-
186
+
189
187
  &__title {
190
- font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
188
+ font-size: var(--en-single-f-b-r-fontSize);
191
189
  font-weight: var(--en-single-f-b-r-fontWeight);
192
190
  color: var(--color-selector-s-text-default);
193
191
  white-space: nowrap;
194
192
  overflow: hidden;
195
193
  text-overflow: ellipsis;
196
-
194
+
197
195
  &--active {
198
- font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
196
+ font-size: var(--en-single-f-b-r-fontSize);
199
197
  font-weight: var(--en-single-f-b-r-fontWeight);
200
198
  color: var(--color-selector-s-text-active);
201
199
  }
202
-
200
+
203
201
  &--disabled {
204
- font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
202
+ font-size: var(--en-single-f-b-r-fontSize);
205
203
  font-weight: var(--en-single-f-b-r-fontWeight);
206
204
  color: var(--color-selector-s-text-disable);
207
205
  }
208
206
  }
209
-
207
+
210
208
  &__icon {
211
209
  display: flex;
212
- font-size: calc(var(--icon-selector-s) * 1px);
213
- margin-inline-end: calc(var(--spacing-selector-s-margin_y) * 1px);
214
-
210
+ font-size: var(--icon-selector-s);
211
+ margin-inline-end: var(--spacing-selector-s-margin_y);
212
+
215
213
  &--disabled {
216
214
  opacity: var(--opacity-30);
217
215
  }
218
216
  }
219
-
217
+
220
218
  &__arrow {
221
- font-size: calc(var(--icon-extra-small) * 1px);
222
- margin-inline-start: calc(var(--spacing-selector-s-margin_y) * 1px);
219
+ font-size: var(--icon-extra-small);
220
+ margin-inline-start: var(--spacing-selector-s-margin_y);
223
221
  color: var(--color-selector-icon_down-default);
224
222
  transition: transform .3s;
225
-
223
+
226
224
  &--active {
227
225
  color: var(--color-selector-icon_down-active);
228
226
  }
229
-
227
+
230
228
  &--disabled {
231
229
  color: var(--color-selector-icon_down-disable);
232
230
  }
233
231
  }
234
-
235
232
  }
236
233
 
237
234
  &-form {
238
- width: calc(var(--width-selector-form) * 1px);
239
- height: calc(var(--height-selector-form) * 1px);
240
- // line-height: calc(var(--height-selector-form) * 1px);
241
- padding-inline-start: calc(var(--spacing-selector-padding_y) * 1px);
242
- padding-inline-end: calc(var(--spacing-selector-padding_y) * 1px);
235
+ width: var(--width-selector-form);
236
+ height: var(--height-selector-form);
237
+ padding-inline-start: var(--spacing-selector-padding_y);
238
+ padding-inline-end: var(--spacing-selector-padding_y);
243
239
  background-color: var(--color-selector-form-bg-default);
244
- border-radius: calc(var(--radius-selector-form) * 1px);
240
+ border-radius: var(--radius-selector-form);
245
241
  justify-content: space-between;
246
-
242
+
247
243
  .@{selector-prefix-cls}__inner {
248
244
  justify-content: space-between;
249
245
  }
250
-
246
+
251
247
  &--active {
252
248
  background-color: var(--color-selector-form-bg-active);
253
249
  }
254
-
250
+
255
251
  &--disabled {
256
252
  background-color: var(--color-selector-form-bg-disable);
257
253
  }
258
-
254
+
259
255
  &__title {
260
- font-size: calc(var(--en-single-f-d-r-fontSize) * 1px);
256
+ font-size: var(--en-single-f-d-r-fontSize);
261
257
  font-weight: var(--en-single-f-d-r-fontWeight);
262
258
  color: var(--color-selector-form-text-default);
263
259
  white-space: nowrap;
264
260
  overflow: hidden;
265
261
  text-overflow: ellipsis;
266
-
262
+
267
263
  &--active {
268
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
264
+ font-size: var(--en-single-f-d-s-fontSize);
269
265
  font-weight: var(--en-single-f-d-s-fontWeight);
270
266
  color: var(--color-selector-xl-text-active);
271
267
  }
272
-
268
+
273
269
  &--disabled {
274
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
270
+ font-size: var(--en-single-f-d-s-fontSize);
275
271
  font-weight: var(--en-single-f-d-s-fontWeight);
276
272
  color: var(--color-selector-xl-text-disable);
277
273
  }
278
274
  }
279
-
275
+
280
276
  &__icon {
281
- font-size: calc(var(--icon-selector-l) * 1px);
282
- margin-inline-end: calc(var(--spacing-selector-icon-margin_right) * 1px);
283
-
277
+ font-size: var(--icon-selector-l);
278
+ margin-inline-end: var(--spacing-selector-icon-margin_right);
279
+
284
280
  &--disabled {
285
281
  opacity: var(--opacity-30);
286
282
  }
287
283
  }
288
-
284
+
289
285
  &__arrow {
290
- font-size: calc(var(--icon-small) * 1px);
291
- margin-inline-start: calc(var(--spacing-selector-down-margin_left) * 1px);
286
+ font-size: var(--icon-small);
287
+ margin-inline-start: var(--spacing-selector-down-margin_left);
292
288
  color: var(--color-selector-icon_down-default);
293
289
  transition: transform .3s;
294
-
290
+
295
291
  &--active {
296
292
  color: var(--color-selector-icon_down-active);
297
293
  }
298
-
294
+
299
295
  &--disabled {
300
296
  color: var(--color-selector-icon_down-disable);
301
297
  }
302
298
  }
303
- }
299
+ }
304
300
 
305
301
  &--slot {
306
302
  position: absolute;
@@ -312,7 +308,7 @@
312
308
  .@{selector-prefix-cls}-xl {
313
309
 
314
310
  &__title {
315
- font-size: calc(var(--en-single-f-f-b-fontSize) * 1px);
311
+ font-size: var(--en-single-f-f-b-fontSize);
316
312
  font-weight: var(--en-single-f-f-b-fontWeight);
317
313
  color: var(--color-selector-xl-text-active);
318
314
  }
@@ -327,7 +323,7 @@
327
323
  .@{selector-prefix-cls}-l {
328
324
 
329
325
  &__title {
330
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
326
+ font-size: var(--en-single-f-d-s-fontSize);
331
327
  font-weight: var(--en-single-f-d-s-fontWeight);
332
328
  color: var(--color-selector-l-text-active);
333
329
  }
@@ -342,7 +338,7 @@
342
338
  .@{selector-prefix-cls}-m {
343
339
 
344
340
  &__title {
345
- font-size: calc(var(--en-single-f-c-s-fontSize) * 1px);
341
+ font-size: var(--en-single-f-c-s-fontSize);
346
342
  font-weight: var(--en-single-f-c-s-fontWeight);
347
343
  color: var(--color-selector-m-text-active);
348
344
  }
@@ -356,7 +352,7 @@
356
352
  .@{selector-prefix-cls}-s {
357
353
 
358
354
  &__title {
359
- font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
355
+ font-size: var(--en-single-f-b-r-fontSize);
360
356
  font-weight: var(--en-single-f-b-r-fontWeight);
361
357
  color: var(--color-selector-s-text-active);
362
358
  }
@@ -372,7 +368,7 @@
372
368
  background-color: var(--color-selector-form-bg-active);
373
369
 
374
370
  &__title {
375
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
371
+ font-size: var(--en-single-f-d-s-fontSize);
376
372
  font-weight: var(--en-single-f-d-s-fontWeight);
377
373
  color: var(--color-selector-xl-text-active);
378
374
  }
@@ -392,7 +388,7 @@
392
388
  .@{selector-prefix-cls}-xl {
393
389
 
394
390
  &__title {
395
- font-size: calc(var(--en-single-f-f-b-fontSize) * 1px);
391
+ font-size: var(--en-single-f-f-b-fontSize);
396
392
  font-weight: var(--en-single-f-f-b-fontWeight);
397
393
  color: var(--color-selector-xl-text-disable);
398
394
  }
@@ -411,7 +407,7 @@
411
407
  .@{selector-prefix-cls}-l {
412
408
 
413
409
  &__title {
414
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
410
+ font-size: var(--en-single-f-d-s-fontSize);
415
411
  font-weight: var(--en-single-f-d-s-fontWeight);
416
412
  color: var(--color-selector-l-text-disable);
417
413
  }
@@ -429,7 +425,7 @@
429
425
  .@{selector-prefix-cls}-m {
430
426
 
431
427
  &__title {
432
- font-size: calc(var(--en-single-f-c-s-fontSize) * 1px);
428
+ font-size: var(--en-single-f-c-s-fontSize);
433
429
  font-weight: var(--en-single-f-c-s-fontWeight);
434
430
  color: var(--color-selector-m-text-disable);
435
431
  }
@@ -447,7 +443,7 @@
447
443
  .@{selector-prefix-cls}-s {
448
444
 
449
445
  &__title {
450
- font-size: calc(var(--en-single-f-b-r-fontSize) * 1px);
446
+ font-size: var(--en-single-f-b-r-fontSize);
451
447
  font-weight: var(--en-single-f-b-r-fontWeight);
452
448
  color: var(--color-selector-s-text-disable);
453
449
  }
@@ -466,7 +462,7 @@
466
462
  background-color: var(--color-selector-form-bg-disable);
467
463
 
468
464
  &__title {
469
- font-size: calc(var(--en-single-f-d-s-fontSize) * 1px);
465
+ font-size: var(--en-single-f-d-s-fontSize);
470
466
  font-weight: var(--en-single-f-d-s-fontWeight);
471
467
  color: var(--color-selector-xl-text-disable);
472
468
  }