@sdata/web-vue 1.10.0 → 1.11.0

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 (117) hide show
  1. package/dist/sd.css +148 -952
  2. package/dist/sd.min.css +1 -1
  3. package/es/_components/input-label/style/input-label.scss +11 -51
  4. package/es/_components/select-view/select-view.d.ts +1 -1
  5. package/es/_components/select-view/style/index.css +0 -84
  6. package/es/_components/virtual-list/interface.d.ts +10 -1
  7. package/es/{table/hooks/use-table-virtual-size.d.ts → _components/virtual-list/use-virtual-size.d.ts} +4 -2
  8. package/es/{table/hooks/use-table-virtual-size.js → _components/virtual-list/use-virtual-size.js} +17 -20
  9. package/es/_components/virtual-list/virtual-list.js +64 -2
  10. package/es/_components/virtual-list/virtual-list.vue.d.ts +208 -0
  11. package/es/_components/virtual-list/virtual-list.vue_vue_type_script_lang.js +277 -5
  12. package/es/_utils/clipboard.js +2 -1
  13. package/es/auto-complete/auto-complete.d.ts +1 -1
  14. package/es/auto-complete/index.d.ts +24 -15
  15. package/es/auto-complete/style/index.css +0 -16
  16. package/es/auto-complete/style/index.scss +11 -26
  17. package/es/badge/style/index.scss +11 -41
  18. package/es/button/style/index.css +35 -445
  19. package/es/button/style/index.scss +57 -332
  20. package/es/card/style/index.scss +18 -52
  21. package/es/carousel/index.d.ts +1 -0
  22. package/es/cascader/cascader-panel.vue.d.ts +1 -1
  23. package/es/cascader/cascader.vue.d.ts +3 -3
  24. package/es/cascader/index.d.ts +10 -10
  25. package/es/cascader/interface.d.ts +5 -0
  26. package/es/color-picker/style/index.scss +17 -99
  27. package/es/config-provider/config-provider.vue.d.ts +1 -1
  28. package/es/config-provider/index.d.ts +4 -3
  29. package/es/date-picker/index.d.ts +21 -14
  30. package/es/date-picker/panels/date/index.vue.d.ts +1 -1
  31. package/es/date-picker/panels/week/index.vue.d.ts +7 -7
  32. package/es/date-picker/picker.vue.d.ts +1 -1
  33. package/es/date-picker/range-picker.vue.d.ts +1 -1
  34. package/es/descriptions/descriptions.d.ts +1 -1
  35. package/es/descriptions/index.d.ts +4 -4
  36. package/es/descriptions/style/index.scss +18 -63
  37. package/es/form/style/index.css +12 -176
  38. package/es/form/style/status.scss +36 -73
  39. package/es/index.css +148 -952
  40. package/es/index.d.ts +21 -20
  41. package/es/input/style/input.scss +14 -66
  42. package/es/input-number/index.d.ts +5 -0
  43. package/es/input-tag/style/index.css +0 -84
  44. package/es/input-tag/style/input-tag.scss +16 -170
  45. package/es/list/style/index.scss +12 -42
  46. package/es/menu/index.d.ts +8 -0
  47. package/es/menu/style/index.css +0 -178
  48. package/es/menu/style/index.scss +36 -139
  49. package/es/pagination/index.d.ts +3 -3
  50. package/es/pagination/interface.d.ts +2 -1
  51. package/es/pagination/page-options.js +1 -1
  52. package/es/pagination/page-options.vue.d.ts +72 -71
  53. package/es/pagination/page-options.vue_vue_type_script_lang.js +6 -0
  54. package/es/pagination/pagination.d.ts +3 -3
  55. package/es/pagination/style/index.css +0 -12
  56. package/es/pagination/style/index.scss +19 -76
  57. package/es/radio/index.d.ts +3 -0
  58. package/es/result/style/index.css +0 -16
  59. package/es/result/style/index.scss +12 -34
  60. package/es/select/index.d.ts +9 -9
  61. package/es/select/interface.d.ts +2 -1
  62. package/es/select/select.d.ts +3 -3
  63. package/es/slider/index.d.ts +6 -3
  64. package/es/slider/slider.vue.d.ts +1 -1
  65. package/es/steps/index.d.ts +2 -0
  66. package/es/switch/index.d.ts +3 -0
  67. package/es/table/context.d.ts +1 -1
  68. package/es/table/hooks/use-column-resize.d.ts +2 -3
  69. package/es/table/hooks/use-column-resize.js +48 -21
  70. package/es/table/hooks/use-drag.d.ts +4 -2
  71. package/es/table/hooks/use-drag.js +16 -2
  72. package/es/table/index.d.ts +22 -34
  73. package/es/table/interface.d.ts +21 -2
  74. package/es/table/style/index.css +97 -21
  75. package/es/table/style/index.scss +137 -125
  76. package/es/table/table-operation-td.d.ts +2 -2
  77. package/es/table/table-operation-td.js +4 -5
  78. package/es/table/table-operation-th.js +4 -4
  79. package/es/table/table-tbody.js +1 -1
  80. package/es/table/table-td.js +5 -6
  81. package/es/table/table-th.js +25 -24
  82. package/es/table/table-thead.js +1 -1
  83. package/es/table/table-tr.js +1 -1
  84. package/es/table/table.d.ts +12 -16
  85. package/es/table/table.js +399 -190
  86. package/es/tabs/index.d.ts +1 -0
  87. package/es/tabs/style/index.scss +53 -135
  88. package/es/tag/index.d.ts +3 -3
  89. package/es/tag/style/index.css +0 -84
  90. package/es/tag/style/index.scss +19 -146
  91. package/es/tag/tag.vue.d.ts +1 -1
  92. package/es/theme-provider/index.d.ts +9 -9
  93. package/es/time-picker/index.d.ts +1 -0
  94. package/es/timeline/index.d.ts +1 -0
  95. package/es/transfer/index.d.ts +1 -0
  96. package/es/transfer/interface.d.ts +1 -1
  97. package/es/tree/hooks/use-tree-data.d.ts +17 -29
  98. package/es/tree/index.d.ts +6 -1
  99. package/es/tree/interface.d.ts +2 -0
  100. package/es/tree/tree.js +1 -1
  101. package/es/tree/tree.vue.d.ts +3561 -13
  102. package/es/tree/tree.vue_vue_type_script_lang.js +21 -9
  103. package/es/tree-select/hooks/use-selected-state.js +3 -1
  104. package/es/tree-select/index.d.ts +3 -0
  105. package/es/tree-select/tree-select.vue.d.ts +1367 -3
  106. package/json/vetur-attributes.json +1 -6
  107. package/json/vetur-tags.json +0 -1
  108. package/json/web-types.json +7 -11
  109. package/package.json +1 -1
  110. package/es/style/theme/legacy-less-var.scss +0 -15
  111. package/es/table/table-col-group.js +0 -21
  112. package/es/table/table-col-group.vue_vue_type_script_lang.js +0 -32
  113. package/es/table/table-legacy-virtual-list.js +0 -47
  114. package/es/table/table-legacy-virtual-list.vue.d.ts +0 -156
  115. package/es/table/table-legacy-virtual-list.vue_vue_type_script_lang.js +0 -148
  116. package/es/table/table-virtual-list-item.d.ts +0 -22
  117. package/es/table/table-virtual-list-item.js +0 -37
package/es/form/style/index.css CHANGED
@@ -15,216 +15,52 @@
15
15
  /******** link *******/
16
16
  /******** radius *******/
17
17
  /********* icon hover *********/
18
- .sd-form-item-status-validating .sd-input-wrapper:not(.sd-input-disabled),
19
- .sd-form-item-status-validating .sd-textarea-wrapper:not(.sd-textarea-disabled) {
20
- background-color: var(--color-fill-2);
21
- border-color: transparent;
22
- }
23
- .sd-form-item-status-validating .sd-input-wrapper:not(.sd-input-disabled):hover,
24
- .sd-form-item-status-validating .sd-textarea-wrapper:not(.sd-textarea-disabled):hover {
25
- background-color: var(--color-fill-3);
26
- border-color: transparent;
27
- }
28
18
  .sd-form-item-status-validating .sd-input-wrapper:not(.sd-input-disabled).sd-input-focus,
29
19
  .sd-form-item-status-validating .sd-textarea-wrapper:not(.sd-textarea-disabled).sd-textarea-focus {
30
- background-color: var(--color-bg-2);
31
- border-color: rgb(var(--primary-6));
32
- box-shadow: 0 0 0 0 var(--color-primary-light-2);
33
- }
34
- .sd-form-item-status-validating .sd-select-view:not(.sd-select-view-disabled),
35
- .sd-form-item-status-validating .sd-input-tag:not(.sd-input-tag-disabled) {
36
- background-color: var(--color-fill-2);
37
- border-color: transparent;
38
- }
39
- .sd-form-item-status-validating .sd-select-view:not(.sd-select-view-disabled):hover,
40
- .sd-form-item-status-validating .sd-input-tag:not(.sd-input-tag-disabled):hover {
41
- background-color: var(--color-fill-3);
42
- border-color: transparent;
20
+ box-shadow: 0 0 0;
43
21
  }
44
22
  .sd-form-item-status-validating .sd-select-view:not(.sd-select-view-disabled).sd-select-view-focus,
45
23
  .sd-form-item-status-validating .sd-input-tag:not(.sd-input-tag-disabled).sd-input-tag-focus {
46
- background-color: var(--color-bg-2);
47
- border-color: rgb(var(--primary-6));
48
- box-shadow: 0 0 0 0 var(--color-primary-light-2);
49
- }
50
- .sd-form-item-status-validating .sd-picker:not(.sd-picker-disabled) {
51
- background-color: var(--color-fill-2);
52
- border-color: transparent;
53
- }
54
- .sd-form-item-status-validating .sd-picker:not(.sd-picker-disabled):hover {
55
- background-color: var(--color-fill-3);
56
- border-color: transparent;
24
+ box-shadow: 0 0 0;
57
25
  }
58
26
  .sd-form-item-status-validating .sd-picker-focused:not(.sd-picker-disabled), .sd-form-item-status-validating .sd-picker-focused:not(.sd-picker-disabled):hover {
59
- background-color: var(--color-bg-2);
60
- border-color: rgb(var(--primary-6));
61
- box-shadow: 0 0 0 0 var(--color-primary-light-2);
27
+ box-shadow: 0 0 0;
62
28
  }
63
29
 
64
- .sd-form-item-status-validating .sd-form-item-message-help {
65
- color: rgb(var(--primary-6));
66
- }
67
- .sd-form-item-status-validating .sd-form-item-feedback {
68
- color: rgb(var(--primary-6));
69
- }
70
-
71
- .sd-form-item-status-success .sd-input-wrapper:not(.sd-input-disabled),
72
- .sd-form-item-status-success .sd-textarea-wrapper:not(.sd-textarea-disabled) {
73
- background-color: var(--color-fill-2);
74
- border-color: transparent;
75
- }
76
- .sd-form-item-status-success .sd-input-wrapper:not(.sd-input-disabled):hover,
77
- .sd-form-item-status-success .sd-textarea-wrapper:not(.sd-textarea-disabled):hover {
78
- background-color: var(--color-fill-3);
79
- border-color: transparent;
80
- }
81
30
  .sd-form-item-status-success .sd-input-wrapper:not(.sd-input-disabled).sd-input-focus,
82
31
  .sd-form-item-status-success .sd-textarea-wrapper:not(.sd-textarea-disabled).sd-textarea-focus {
83
- background-color: var(--color-bg-2);
84
- border-color: rgb(var(--success-6));
85
- box-shadow: 0 0 0 0 var(--color-success-light-2);
86
- }
87
- .sd-form-item-status-success .sd-select-view:not(.sd-select-view-disabled),
88
- .sd-form-item-status-success .sd-input-tag:not(.sd-input-tag-disabled) {
89
- background-color: var(--color-fill-2);
90
- border-color: transparent;
91
- }
92
- .sd-form-item-status-success .sd-select-view:not(.sd-select-view-disabled):hover,
93
- .sd-form-item-status-success .sd-input-tag:not(.sd-input-tag-disabled):hover {
94
- background-color: var(--color-fill-3);
95
- border-color: transparent;
32
+ box-shadow: 0 0 0;
96
33
  }
97
34
  .sd-form-item-status-success .sd-select-view:not(.sd-select-view-disabled).sd-select-view-focus,
98
35
  .sd-form-item-status-success .sd-input-tag:not(.sd-input-tag-disabled).sd-input-tag-focus {
99
- background-color: var(--color-bg-2);
100
- border-color: rgb(var(--success-6));
101
- box-shadow: 0 0 0 0 var(--color-success-light-2);
102
- }
103
- .sd-form-item-status-success .sd-picker:not(.sd-picker-disabled) {
104
- background-color: var(--color-fill-2);
105
- border-color: transparent;
106
- }
107
- .sd-form-item-status-success .sd-picker:not(.sd-picker-disabled):hover {
108
- background-color: var(--color-fill-3);
109
- border-color: transparent;
36
+ box-shadow: 0 0 0;
110
37
  }
111
38
  .sd-form-item-status-success .sd-picker-focused:not(.sd-picker-disabled), .sd-form-item-status-success .sd-picker-focused:not(.sd-picker-disabled):hover {
112
- background-color: var(--color-bg-2);
113
- border-color: rgb(var(--success-6));
114
- box-shadow: 0 0 0 0 var(--color-success-light-2);
39
+ box-shadow: 0 0 0;
115
40
  }
116
41
 
117
- .sd-form-item-status-success .sd-form-item-message-help {
118
- color: rgb(var(--success-6));
119
- }
120
- .sd-form-item-status-success .sd-form-item-feedback {
121
- color: rgb(var(--success-6));
122
- }
123
-
124
- .sd-form-item-status-warning .sd-input-wrapper:not(.sd-input-disabled),
125
- .sd-form-item-status-warning .sd-textarea-wrapper:not(.sd-textarea-disabled) {
126
- background-color: var(--color-warning-light-1);
127
- border-color: transparent;
128
- }
129
- .sd-form-item-status-warning .sd-input-wrapper:not(.sd-input-disabled):hover,
130
- .sd-form-item-status-warning .sd-textarea-wrapper:not(.sd-textarea-disabled):hover {
131
- background-color: var(--color-warning-light-2);
132
- border-color: transparent;
133
- }
134
42
  .sd-form-item-status-warning .sd-input-wrapper:not(.sd-input-disabled).sd-input-focus,
135
43
  .sd-form-item-status-warning .sd-textarea-wrapper:not(.sd-textarea-disabled).sd-textarea-focus {
136
- background-color: var(--color-bg-2);
137
- border-color: rgb(var(--warning-6));
138
- box-shadow: 0 0 0 0 var(--color-warning-light-2);
139
- }
140
- .sd-form-item-status-warning .sd-select-view:not(.sd-select-view-disabled),
141
- .sd-form-item-status-warning .sd-input-tag:not(.sd-input-tag-disabled) {
142
- background-color: var(--color-warning-light-1);
143
- border-color: transparent;
144
- }
145
- .sd-form-item-status-warning .sd-select-view:not(.sd-select-view-disabled):hover,
146
- .sd-form-item-status-warning .sd-input-tag:not(.sd-input-tag-disabled):hover {
147
- background-color: var(--color-warning-light-2);
148
- border-color: transparent;
44
+ box-shadow: 0 0 0;
149
45
  }
150
46
  .sd-form-item-status-warning .sd-select-view:not(.sd-select-view-disabled).sd-select-view-focus,
151
47
  .sd-form-item-status-warning .sd-input-tag:not(.sd-input-tag-disabled).sd-input-tag-focus {
152
- background-color: var(--color-bg-2);
153
- border-color: rgb(var(--warning-6));
154
- box-shadow: 0 0 0 0 var(--color-warning-light-2);
155
- }
156
- .sd-form-item-status-warning .sd-picker:not(.sd-picker-disabled) {
157
- background-color: var(--color-warning-light-1);
158
- border-color: transparent;
159
- }
160
- .sd-form-item-status-warning .sd-picker:not(.sd-picker-disabled):hover {
161
- background-color: var(--color-warning-light-2);
162
- border-color: transparent;
48
+ box-shadow: 0 0 0;
163
49
  }
164
50
  .sd-form-item-status-warning .sd-picker-focused:not(.sd-picker-disabled), .sd-form-item-status-warning .sd-picker-focused:not(.sd-picker-disabled):hover {
165
- background-color: var(--color-bg-2);
166
- border-color: rgb(var(--warning-6));
167
- box-shadow: 0 0 0 0 var(--color-warning-light-2);
51
+ box-shadow: 0 0 0;
168
52
  }
169
53
 
170
- .sd-form-item-status-warning .sd-form-item-message-help {
171
- color: rgb(var(--warning-6));
172
- }
173
- .sd-form-item-status-warning .sd-form-item-feedback {
174
- color: rgb(var(--warning-6));
175
- }
176
-
177
- .sd-form-item-status-error .sd-input-wrapper:not(.sd-input-disabled),
178
- .sd-form-item-status-error .sd-textarea-wrapper:not(.sd-textarea-disabled) {
179
- background-color: var(--color-danger-light-1);
180
- border-color: transparent;
181
- }
182
- .sd-form-item-status-error .sd-input-wrapper:not(.sd-input-disabled):hover,
183
- .sd-form-item-status-error .sd-textarea-wrapper:not(.sd-textarea-disabled):hover {
184
- background-color: var(--color-danger-light-2);
185
- border-color: transparent;
186
- }
187
54
  .sd-form-item-status-error .sd-input-wrapper:not(.sd-input-disabled).sd-input-focus,
188
55
  .sd-form-item-status-error .sd-textarea-wrapper:not(.sd-textarea-disabled).sd-textarea-focus {
189
- background-color: var(--color-bg-2);
190
- border-color: rgb(var(--danger-6));
191
- box-shadow: 0 0 0 0 var(--color-danger-light-2);
192
- }
193
- .sd-form-item-status-error .sd-select-view:not(.sd-select-view-disabled),
194
- .sd-form-item-status-error .sd-input-tag:not(.sd-input-tag-disabled) {
195
- background-color: var(--color-danger-light-1);
196
- border-color: transparent;
197
- }
198
- .sd-form-item-status-error .sd-select-view:not(.sd-select-view-disabled):hover,
199
- .sd-form-item-status-error .sd-input-tag:not(.sd-input-tag-disabled):hover {
200
- background-color: var(--color-danger-light-2);
201
- border-color: transparent;
56
+ box-shadow: 0 0 0;
202
57
  }
203
58
  .sd-form-item-status-error .sd-select-view:not(.sd-select-view-disabled).sd-select-view-focus,
204
59
  .sd-form-item-status-error .sd-input-tag:not(.sd-input-tag-disabled).sd-input-tag-focus {
205
- background-color: var(--color-bg-2);
206
- border-color: rgb(var(--danger-6));
207
- box-shadow: 0 0 0 0 var(--color-danger-light-2);
208
- }
209
- .sd-form-item-status-error .sd-picker:not(.sd-picker-disabled) {
210
- background-color: var(--color-danger-light-1);
211
- border-color: transparent;
212
- }
213
- .sd-form-item-status-error .sd-picker:not(.sd-picker-disabled):hover {
214
- background-color: var(--color-danger-light-2);
215
- border-color: transparent;
60
+ box-shadow: 0 0 0;
216
61
  }
217
62
  .sd-form-item-status-error .sd-picker-focused:not(.sd-picker-disabled), .sd-form-item-status-error .sd-picker-focused:not(.sd-picker-disabled):hover {
218
- background-color: var(--color-bg-2);
219
- border-color: rgb(var(--danger-6));
220
- box-shadow: 0 0 0 0 var(--color-danger-light-2);
221
- }
222
-
223
- .sd-form-item-status-error .sd-form-item-message-help {
224
- color: rgb(var(--danger-6));
225
- }
226
- .sd-form-item-status-error .sd-form-item-feedback {
227
- color: rgb(var(--danger-6));
63
+ box-shadow: 0 0 0;
228
64
  }
229
65
 
230
66
  .sd-form-item-control-children {
package/es/form/style/status.scss CHANGED
@@ -1,58 +1,21 @@
1
1
  @use '@style/theme/index.scss' as theme;
2
2
  @use 'sass:string';
3
3
  @use 'sass:map';
4
- @use '@style/theme/legacy-less-var.scss' as legacyLessVar;
4
+ @use 'sass:meta';
5
+ @use '@components/form/style/token.scss' as token;
5
6
  @use '@components/form/style/token.scss' as *;
6
7
 
7
8
  $form-prefix-cls: string.unquote('#{theme.$prefix}-form');
8
9
 
9
10
  // for input & textarea
10
- $__less-vars: (
11
- 'form-color-bg_error': $form-color-bg_error,
12
- 'form-color-bg_error_focus': $form-color-bg_error_focus,
13
- 'form-color-bg_error_hover': $form-color-bg_error_hover,
14
- 'form-color-bg_success': $form-color-bg_success,
15
- 'form-color-bg_success_focus': $form-color-bg_success_focus,
16
- 'form-color-bg_success_hover': $form-color-bg_success_hover,
17
- 'form-color-bg_validating': $form-color-bg_validating,
18
- 'form-color-bg_validating_focus': $form-color-bg_validating_focus,
19
- 'form-color-bg_validating_hover': $form-color-bg_validating_hover,
20
- 'form-color-bg_warning': $form-color-bg_warning,
21
- 'form-color-bg_warning_focus': $form-color-bg_warning_focus,
22
- 'form-color-bg_warning_hover': $form-color-bg_warning_hover,
23
- 'form-color-border_error': $form-color-border_error,
24
- 'form-color-border_error_focus': $form-color-border_error_focus,
25
- 'form-color-border_error_hover': $form-color-border_error_hover,
26
- 'form-color-border_success': $form-color-border_success,
27
- 'form-color-border_success_focus': $form-color-border_success_focus,
28
- 'form-color-border_success_hover': $form-color-border_success_hover,
29
- 'form-color-border_validating': $form-color-border_validating,
30
- 'form-color-border_validating_focus': $form-color-border_validating_focus,
31
- 'form-color-border_validating_hover': $form-color-border_validating_hover,
32
- 'form-color-border_warning': $form-color-border_warning,
33
- 'form-color-border_warning_focus': $form-color-border_warning_focus,
34
- 'form-color-border_warning_hover': $form-color-border_warning_hover,
35
- 'form-color-shadow_error_focus': $form-color-shadow_error_focus,
36
- 'form-color-shadow_success_focus': $form-color-shadow_success_focus,
37
- 'form-color-shadow_validating_focus': $form-color-shadow_validating_focus,
38
- 'form-color-shadow_warning_focus': $form-color-shadow_warning_focus,
39
- 'form-color-tip-icon-text_error': $form-color-tip-icon-text_error,
40
- 'form-color-tip-icon-text_success': $form-color-tip-icon-text_success,
41
- 'form-color-tip-icon-text_validating': $form-color-tip-icon-text_validating,
42
- 'form-color-tip-icon-text_warning': $form-color-tip-icon-text_warning,
43
- 'form-color-tip-text_error': $form-color-tip-text_error,
44
- 'form-color-tip-text_success': $form-color-tip-text_success,
45
- 'form-color-tip-text_validating': $form-color-tip-text_validating,
46
- 'form-color-tip-text_warning': $form-color-tip-text_warning,
47
- 'form-size-shadow_error_focus': $form-size-shadow_error_focus,
48
- 'form-size-shadow_success_focus': $form-size-shadow_success_focus,
49
- 'form-size-shadow_validating_focus': $form-size-shadow_validating_focus,
50
- 'form-size-shadow_warning_focus': $form-size-shadow_warning_focus,
51
- 'prefix': theme.$prefix,
52
- );
53
-
54
- @function less-var($name, $fallback: null) {
55
- @return legacyLessVar.get($__less-vars, $name, $fallback);
11
+ @function token-var($name, $fallback: null) {
12
+ $value: map.get(meta.module-variables('token'), $name);
13
+
14
+ @if $value == null {
15
+ @return $fallback;
16
+ }
17
+
18
+ @return $value;
56
19
  }
57
20
 
58
21
  @mixin input-status($status) {
@@ -61,12 +24,12 @@ $__less-vars: (
61
24
 
62
25
  .#{$input-prefix-cls}-wrapper:not(.#{$input-prefix-cls}-disabled),
63
26
  .#{$textarea-prefix-cls}-wrapper:not(.#{$textarea-prefix-cls}-disabled) {
64
- background-color: less-var('form-color-bg_#{$status}');
65
- border-color: less-var('form-color-border_#{$status}');
27
+ background-color: token-var('form-color-bg_#{$status}');
28
+ border-color: token-var('form-color-border_#{$status}');
66
29
 
67
30
  &:hover {
68
- background-color: less-var('form-color-bg_#{$status}_hover');
69
- border-color: less-var('form-color-border_#{$status}_hover');
31
+ background-color: token-var('form-color-bg_#{$status}_hover');
32
+ border-color: token-var('form-color-border_#{$status}_hover');
70
33
  }
71
34
  }
72
35
 
@@ -74,10 +37,10 @@ $__less-vars: (
74
37
  .#{$textarea-prefix-cls}-wrapper:not(
75
38
  .#{$textarea-prefix-cls}-disabled
76
39
  ).#{$textarea-prefix-cls}-focus {
77
- background-color: less-var('form-color-bg_#{$status}_focus');
78
- border-color: less-var('form-color-border_#{$status}_focus');
79
- box-shadow: 0 0 0 less-var('form-size-shadow_#{$status}_focus')
80
- less-var('form-color-shadow_#{$status}_focus');
40
+ background-color: token-var('form-color-bg_#{$status}_focus');
41
+ border-color: token-var('form-color-border_#{$status}_focus');
42
+ box-shadow: 0 0 0 token-var('form-size-shadow_#{$status}_focus')
43
+ token-var('form-color-shadow_#{$status}_focus');
81
44
  }
82
45
  }
83
46
 
@@ -87,12 +50,12 @@ $__less-vars: (
87
50
 
88
51
  .#{$select-view-prefix-cls}:not(.#{$select-view-prefix-cls}-disabled),
89
52
  .#{$input-prefix-cls}:not(.#{$input-prefix-cls}-disabled) {
90
- background-color: less-var('form-color-bg_#{$status}');
91
- border-color: less-var('form-color-border_#{$status}');
53
+ background-color: token-var('form-color-bg_#{$status}');
54
+ border-color: token-var('form-color-border_#{$status}');
92
55
 
93
56
  &:hover {
94
- background-color: less-var('form-color-bg_#{$status}_hover');
95
- border-color: less-var('form-color-border_#{$status}_hover');
57
+ background-color: token-var('form-color-bg_#{$status}_hover');
58
+ border-color: token-var('form-color-border_#{$status}_hover');
96
59
  }
97
60
  }
98
61
 
@@ -100,32 +63,32 @@ $__less-vars: (
100
63
  .#{$select-view-prefix-cls}-disabled
101
64
  ).#{$select-view-prefix-cls}-focus,
102
65
  .#{$input-prefix-cls}:not(.#{$input-prefix-cls}-disabled).#{$input-prefix-cls}-focus {
103
- background-color: less-var('form-color-bg_#{$status}_focus');
104
- border-color: less-var('form-color-border_#{$status}_focus');
105
- box-shadow: 0 0 0 less-var('form-size-shadow_#{$status}_focus')
106
- less-var('form-color-shadow_#{$status}_focus');
66
+ background-color: token-var('form-color-bg_#{$status}_focus');
67
+ border-color: token-var('form-color-border_#{$status}_focus');
68
+ box-shadow: 0 0 0 token-var('form-size-shadow_#{$status}_focus')
69
+ token-var('form-color-shadow_#{$status}_focus');
107
70
  }
108
71
  }
109
72
 
110
73
  // datepicker
111
74
  @mixin picker($status) {
112
75
  .#{theme.$prefix}-picker:not(.#{theme.$prefix}-picker-disabled) {
113
- background-color: less-var('form-color-bg_#{$status}');
114
- border-color: less-var('form-color-border_#{$status}');
76
+ background-color: token-var('form-color-bg_#{$status}');
77
+ border-color: token-var('form-color-border_#{$status}');
115
78
 
116
79
  &:hover {
117
- background-color: less-var('form-color-bg_#{$status}_hover');
118
- border-color: less-var('form-color-border_#{$status}_hover');
80
+ background-color: token-var('form-color-bg_#{$status}_hover');
81
+ border-color: token-var('form-color-border_#{$status}_hover');
119
82
  }
120
83
  }
121
84
 
122
85
  .#{theme.$prefix}-picker-focused:not(.#{theme.$prefix}-picker-disabled) {
123
86
  &,
124
87
  &:hover {
125
- background-color: less-var('form-color-bg_#{$status}_focus');
126
- border-color: less-var('form-color-border_#{$status}_focus');
127
- box-shadow: 0 0 0 less-var('form-size-shadow_#{$status}_focus')
128
- less-var('form-color-shadow_#{$status}_focus');
88
+ background-color: token-var('form-color-bg_#{$status}_focus');
89
+ border-color: token-var('form-color-border_#{$status}_focus');
90
+ box-shadow: 0 0 0 token-var('form-size-shadow_#{$status}_focus')
91
+ token-var('form-color-shadow_#{$status}_focus');
129
92
  }
130
93
  }
131
94
  }
@@ -139,11 +102,11 @@ $__less-vars: (
139
102
 
140
103
  .#{theme.$prefix}-form-item-status-#{$status} {
141
104
  .#{$form-prefix-cls}-item-message-help {
142
- color: less-var('form-color-tip-text_#{$status}');
105
+ color: token-var('form-color-tip-text_#{$status}');
143
106
  }
144
107
 
145
108
  .#{$form-prefix-cls}-item-feedback {
146
- color: less-var('form-color-tip-icon-text_#{$status}');
109
+ color: token-var('form-color-tip-icon-text_#{$status}');
147
110
  }
148
111
  }
149
112
  }