@douyinfe/semi-foundation 2.23.4 → 2.23.5

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 (13) hide show
  1. package/form/foundation.ts +1 -1
  2. package/lib/cjs/form/foundation.d.ts +1 -1
  3. package/lib/cjs/switch/rtl.scss +14 -14
  4. package/lib/cjs/switch/switch.scss +14 -14
  5. package/lib/cjs/switch/variables.scss +15 -15
  6. package/lib/es/form/foundation.d.ts +1 -1
  7. package/lib/es/switch/rtl.scss +14 -14
  8. package/lib/es/switch/switch.scss +14 -14
  9. package/lib/es/switch/variables.scss +15 -15
  10. package/package.json +2 -2
  11. package/switch/rtl.scss +14 -14
  12. package/switch/switch.scss +14 -14
  13. package/switch/variables.scss +15 -15
package/form/foundation.ts CHANGED
@@ -8,7 +8,7 @@ import scrollIntoView, { Options as scrollIntoViewOptions } from 'scroll-into-vi
8
8
 
9
9
  import { BaseFormAdapter, FormState, CallOpts, FieldState, FieldStaff, ComponentProps, setValuesConfig, ArrayFieldStaff } from './interface';
10
10
 
11
- export { BaseFormAdapter };
11
+ export type { BaseFormAdapter };
12
12
 
13
13
  export default class FormFoundation extends BaseFoundation<BaseFormAdapter> {
14
14
 
package/lib/cjs/form/foundation.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import BaseFoundation from '../base/foundation';
2
2
  import { Options as scrollIntoViewOptions } from 'scroll-into-view-if-needed';
3
3
  import { BaseFormAdapter, FormState, CallOpts, FieldState, FieldStaff, ComponentProps, setValuesConfig, ArrayFieldStaff } from './interface';
4
- export { BaseFormAdapter };
4
+ export type { BaseFormAdapter };
5
5
  export default class FormFoundation extends BaseFoundation<BaseFormAdapter> {
6
6
  data: FormState;
7
7
  fields: Map<string, FieldStaff>;
package/lib/cjs/switch/rtl.scss CHANGED
@@ -7,12 +7,12 @@ $module: #{$prefix}-switch;
7
7
 
8
8
  &-checked {
9
9
  .#{$module}-knob {
10
- transform: translateX(-$motion-switch_checked-translateX);
10
+ transform: translateX(-$spacing-switch_checked-translateX);
11
11
  }
12
12
 
13
13
  &:active {
14
14
  .#{$module}-knob {
15
- transform: translateX($width-switch_knob_expand - $motion-switch_checked-translateX);
15
+ transform: translateX($width-switch_knob_expand - $spacing-switch_checked-translateX);
16
16
  }
17
17
  }
18
18
  }
@@ -34,51 +34,51 @@ $module: #{$prefix}-switch;
34
34
 
35
35
  .#{$module}-loading {
36
36
  .#{$module}-loading-spin {
37
- transform: translateX(-$motion-switch_spin_unchecked-translateX);
37
+ transform: translateX(-$spacing-switch_spin_unchecked-translateX);
38
38
  }
39
39
 
40
40
  &.#{$module}-checked {
41
41
  .#{$module}-loading-spin {
42
- transform: translateX(-$motion-switch_spin_checked-translateX);
42
+ transform: translateX(-$spacing-switch_spin_checked-translateX);
43
43
  }
44
44
  }
45
45
  }
46
46
 
47
47
  .#{$module}-loading.#{$module}-small {
48
48
  .#{$module}-loading-spin {
49
- transform: translateX(-$motion-switch_spin_unchecked_small-translateX);
49
+ transform: translateX(-$spacing-switch_spin_unchecked_small-translateX);
50
50
  }
51
51
  &.#{$module}-checked{
52
52
  .#{$module}-loading-spin {
53
- transform: translateX(-$motion-switch_spin_checked_small-translateX);
53
+ transform: translateX(-$spacing-switch_spin_checked_small-translateX);
54
54
  }
55
55
  }
56
56
  }
57
57
 
58
58
  .#{$module}-loading.#{$module}-large {
59
59
  .#{$module}-loading-spin {
60
- transform: translateX(-$motion-switch_spin_unchecked_large-translateX);
60
+ transform: translateX(-$spacing-switch_spin_unchecked_large-translateX);
61
61
  }
62
62
 
63
63
  &.#{$module}-checked {
64
64
  .#{$module}-loading-spin {
65
- transform: translateX(-$motion-switch_spin_checked_large-translateX);
65
+ transform: translateX(-$spacing-switch_spin_checked_large-translateX);
66
66
  }
67
67
  }
68
68
  }
69
69
 
70
70
  .#{$module}-large {
71
71
  .#{$module}-knob {
72
- transform: translateX(-$motion-switch_unchecked_large-translateX);
72
+ transform: translateX(-$spacing-switch_unchecked_large-translateX);
73
73
  }
74
74
  &.#{$module}-checked {
75
75
  .#{$module}-knob {
76
- transform: translateX(-$motion-switch_checked_large-translateX);
76
+ transform: translateX(-$spacing-switch_checked_large-translateX);
77
77
  }
78
78
 
79
79
  &:active {
80
80
  .#{$module}-knob {
81
- transform: translateX($motion-switch_expand_large-translateX - $motion-switch_checked_large-translateX);
81
+ transform: translateX($spacing-switch_expand_large-translateX - $spacing-switch_checked_large-translateX);
82
82
  }
83
83
  }
84
84
  }
@@ -86,16 +86,16 @@ $module: #{$prefix}-switch;
86
86
 
87
87
  .#{$module}-small {
88
88
  .#{$module}-knob {
89
- transform: translateX(-$motion-switch_unchecked_small-translateX);
89
+ transform: translateX(-$spacing-switch_unchecked_small-translateX);
90
90
  }
91
91
  &.#{$module}-checked {
92
92
  .#{$module}-knob {
93
- transform: translateX(-$motion-switch_checked_small-translateX);
93
+ transform: translateX(-$spacing-switch_checked_small-translateX);
94
94
  }
95
95
 
96
96
  &:active {
97
97
  .#{$module}-knob {
98
- transform: translateX($motion-switch_expand_small-translateX - $motion-switch_checked_small-translateX);
98
+ transform: translateX($spacing-switch_expand_small-translateX - $spacing-switch_checked_small-translateX);
99
99
  }
100
100
  }
101
101
  }
package/lib/cjs/switch/switch.scss CHANGED
@@ -44,12 +44,12 @@ $module: #{$prefix}-switch;
44
44
  }
45
45
 
46
46
  .#{$module}-knob {
47
- transform: translateX($motion-switch_checked-translateX);
47
+ transform: translateX($spacing-switch_checked-translateX);
48
48
  }
49
49
 
50
50
  &:active {
51
51
  .#{$module}-knob {
52
- transform: translateX($motion-switch_checked-translateX - $width-switch_knob_expand);
52
+ transform: translateX($spacing-switch_checked-translateX - $width-switch_knob_expand);
53
53
  }
54
54
  }
55
55
  }
@@ -157,7 +157,7 @@ $module: #{$prefix}-switch;
157
157
  .#{$module}-loading {
158
158
 
159
159
  .#{$module}-loading-spin {
160
- transform: translateX($motion-switch_spin_unchecked-translateX);
160
+ transform: translateX($spacing-switch_spin_unchecked-translateX);
161
161
 
162
162
  &>.#{$prefix}-spin-wrapper>svg{
163
163
  width: $width-switch_spin-default;
@@ -169,7 +169,7 @@ $module: #{$prefix}-switch;
169
169
  background-color: $color-switch_spin_checked-bg-default;
170
170
 
171
171
  .#{$module}-loading-spin {
172
- transform: translateX($motion-switch_spin_checked-translateX);
172
+ transform: translateX($spacing-switch_spin_checked-translateX);
173
173
  }
174
174
  }
175
175
  }
@@ -177,7 +177,7 @@ $module: #{$prefix}-switch;
177
177
  .#{$module}-loading.#{$module}-small {
178
178
 
179
179
  .#{$module}-loading-spin {
180
- transform: translateX($motion-switch_spin_unchecked_small-translateX);
180
+ transform: translateX($spacing-switch_spin_unchecked_small-translateX);
181
181
 
182
182
  &>.#{$prefix}-spin-wrapper>svg{
183
183
  width: $width-switch_spin-small;
@@ -187,7 +187,7 @@ $module: #{$prefix}-switch;
187
187
  &.#{$module}-checked{
188
188
 
189
189
  .#{$module}-loading-spin {
190
- transform: translateX($motion-switch_spin_checked_small-translateX);
190
+ transform: translateX($spacing-switch_spin_checked_small-translateX);
191
191
  }
192
192
  }
193
193
  }
@@ -195,7 +195,7 @@ $module: #{$prefix}-switch;
195
195
  .#{$module}-loading.#{$module}-large {
196
196
 
197
197
  .#{$module}-loading-spin {
198
- transform: translateX($motion-switch_spin_unchecked_large-translateX);
198
+ transform: translateX($spacing-switch_spin_unchecked_large-translateX);
199
199
 
200
200
  &>.#{$prefix}-spin-wrapper>svg{
201
201
  width: $width-switch_spin-large;
@@ -206,7 +206,7 @@ $module: #{$prefix}-switch;
206
206
  &.#{$module}-checked {
207
207
 
208
208
  .#{$module}-loading-spin {
209
- transform: translateX($motion-switch_spin_checked_large-translateX);
209
+ transform: translateX($spacing-switch_spin_checked_large-translateX);
210
210
  }
211
211
  }
212
212
  }
@@ -224,16 +224,16 @@ $module: #{$prefix}-switch;
224
224
  height: $width-switch_knob_large;
225
225
  top: $spacing-switch_knob_large-padding;
226
226
  border-radius: $width-switch_knob_large * 0.5;
227
- transform: translateX($motion-switch_unchecked_large-translateX);
227
+ transform: translateX($spacing-switch_unchecked_large-translateX);
228
228
  }
229
229
  &.#{$module}-checked {
230
230
  .#{$module}-knob {
231
- transform: translateX($motion-switch_checked_large-translateX);
231
+ transform: translateX($spacing-switch_checked_large-translateX);
232
232
  }
233
233
 
234
234
  &:active {
235
235
  .#{$module}-knob {
236
- transform: translateX($motion-switch_checked_large-translateX - $motion-switch_expand_large-translateX);
236
+ transform: translateX($spacing-switch_checked_large-translateX - $spacing-switch_expand_large-translateX);
237
237
  }
238
238
  }
239
239
  }
@@ -259,16 +259,16 @@ $module: #{$prefix}-switch;
259
259
  height: $width-switch_knob_large_small;
260
260
  top: $spacing-switch_knob_small-padding;
261
261
  border-radius: $width-switch_knob_large_small * 0.5;
262
- transform: translateX($motion-switch_unchecked_small-translateX);
262
+ transform: translateX($spacing-switch_unchecked_small-translateX);
263
263
  }
264
264
  &.#{$module}-checked {
265
265
  .#{$module}-knob {
266
- transform: translateX($motion-switch_checked_small-translateX);
266
+ transform: translateX($spacing-switch_checked_small-translateX);
267
267
  }
268
268
 
269
269
  &:active {
270
270
  .#{$module}-knob {
271
- transform: translateX($motion-switch_checked_small-translateX - $motion-switch_expand_small-translateX);
271
+ transform: translateX($spacing-switch_checked_small-translateX - $spacing-switch_expand_small-translateX);
272
272
  }
273
273
  }
274
274
  }
package/lib/cjs/switch/variables.scss CHANGED
@@ -1,18 +1,18 @@
1
1
  // Other
2
2
  $spacing-switch_unchecked-translateX: 2px; // 未选中开关右侧偏移量
3
- $motion-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量 - 动画用
4
- $motion-switch_checked-translateX: 18px; // 选中开关右侧偏移量
5
- $motion-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
6
- $motion-switch_expand_large-translateX: 10px;
7
- $motion-switch_unchecked_large-translateX: 3px;
8
- $motion-switch_spin_unchecked_large-translateX: 2px;
9
- $motion-switch_checked_large-translateX: 26px; // 大尺寸选中开关右侧偏移量
10
- $motion-switch_spin_checked_large-translateX: 22px; // 大尺寸选中开关加载图标右侧偏移量
11
- $motion-switch_expand_small-translateX: 2px;
12
- $motion-switch_unchecked_small-translateX: 1px;
13
- $motion-switch_spin_unchecked_small-translateX: 2px;
14
- $motion-switch_checked_small-translateX: 11px; // 小尺寸选中开关右侧偏移量
15
- $motion-switch_spin_checked_small-translateX: 10px; // 小尺寸选中开关加载图标右侧偏移量
3
+ $spacing-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量
4
+ $spacing-switch_checked-translateX: 18px; // 选中开关右侧偏移量
5
+ $spacing-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
6
+ $spacing-switch_expand_large-translateX: 10px;
7
+ $spacing-switch_unchecked_large-translateX: 3px; // 大尺寸未选中开关右侧偏移量
8
+ $spacing-switch_spin_unchecked_large-translateX: 2px; // 大尺寸未选中开关加载图标右侧偏移量
9
+ $spacing-switch_checked_large-translateX: 26px; // 大尺寸选中开关右侧偏移量
10
+ $spacing-switch_spin_checked_large-translateX: 22px; // 大尺寸选中开关加载图标右侧偏移量
11
+ $spacing-switch_expand_small-translateX: 2px;
12
+ $spacing-switch_unchecked_small-translateX: 1px; // 小尺寸未选中开关右侧偏移量
13
+ $spacing-switch_spin_unchecked_small-translateX: 2px; // 小尺寸未选中开关加载图标右侧偏移量
14
+ $spacing-switch_checked_small-translateX: 11px; // 小尺寸选中开关右侧偏移量
15
+ $spacing-switch_spin_checked_small-translateX: 10px; // 小尺寸选中开关加载图标右侧偏移量
16
16
  $motion-switch-transitionDuration: 200ms; // 开关动画时长
17
17
 
18
18
  // Color
@@ -48,11 +48,11 @@ $width-switch_knob_active: $width-switch_knob_default + $width-switch_knob_expan
48
48
  $height-switch_large: 32px; // 大尺寸开关高度
49
49
  $width-switch_large: 54px; // 大尺寸开关宽度
50
50
  $width-switch_knob_large: 24px; // 大尺寸开关按钮宽度
51
- $width-switch_knob_large_active: $width-switch_knob_large + $motion-switch_expand_large-translateX; // 大尺寸开关按钮按下态宽度
51
+ $width-switch_knob_large_active: $width-switch_knob_large + $spacing-switch_expand_large-translateX; // 大尺寸开关按钮按下态宽度
52
52
  $height-switch_small: 16px; // 小尺寸开关高度
53
53
  $width-switch_small: 26px; // 小尺寸开关宽度
54
54
  $width-switch_knob_large_small: 12px; // 小尺寸开关按钮宽度
55
- $width-switch_knob_small_active: $width-switch_knob_large_small + $motion-switch_expand_small-translateX; // 小尺寸开关按钮按下态宽度
55
+ $width-switch_knob_small_active: $width-switch_knob_large_small + $spacing-switch_expand_small-translateX; // 小尺寸开关按钮按下态宽度
56
56
  $width-switch_knob_disabled-border: 1px; // 小尺寸开关按钮宽度
57
57
  $width-switch_checked_unchecked_text: 26px; // 开关按钮文字宽度
58
58
  $width-switch_spin-small: 10px; // 小尺寸开关加载 spin 宽度
package/lib/es/form/foundation.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import BaseFoundation from '../base/foundation';
2
2
  import { Options as scrollIntoViewOptions } from 'scroll-into-view-if-needed';
3
3
  import { BaseFormAdapter, FormState, CallOpts, FieldState, FieldStaff, ComponentProps, setValuesConfig, ArrayFieldStaff } from './interface';
4
- export { BaseFormAdapter };
4
+ export type { BaseFormAdapter };
5
5
  export default class FormFoundation extends BaseFoundation<BaseFormAdapter> {
6
6
  data: FormState;
7
7
  fields: Map<string, FieldStaff>;
package/lib/es/switch/rtl.scss CHANGED
@@ -7,12 +7,12 @@ $module: #{$prefix}-switch;
7
7
 
8
8
  &-checked {
9
9
  .#{$module}-knob {
10
- transform: translateX(-$motion-switch_checked-translateX);
10
+ transform: translateX(-$spacing-switch_checked-translateX);
11
11
  }
12
12
 
13
13
  &:active {
14
14
  .#{$module}-knob {
15
- transform: translateX($width-switch_knob_expand - $motion-switch_checked-translateX);
15
+ transform: translateX($width-switch_knob_expand - $spacing-switch_checked-translateX);
16
16
  }
17
17
  }
18
18
  }
@@ -34,51 +34,51 @@ $module: #{$prefix}-switch;
34
34
 
35
35
  .#{$module}-loading {
36
36
  .#{$module}-loading-spin {
37
- transform: translateX(-$motion-switch_spin_unchecked-translateX);
37
+ transform: translateX(-$spacing-switch_spin_unchecked-translateX);
38
38
  }
39
39
 
40
40
  &.#{$module}-checked {
41
41
  .#{$module}-loading-spin {
42
- transform: translateX(-$motion-switch_spin_checked-translateX);
42
+ transform: translateX(-$spacing-switch_spin_checked-translateX);
43
43
  }
44
44
  }
45
45
  }
46
46
 
47
47
  .#{$module}-loading.#{$module}-small {
48
48
  .#{$module}-loading-spin {
49
- transform: translateX(-$motion-switch_spin_unchecked_small-translateX);
49
+ transform: translateX(-$spacing-switch_spin_unchecked_small-translateX);
50
50
  }
51
51
  &.#{$module}-checked{
52
52
  .#{$module}-loading-spin {
53
- transform: translateX(-$motion-switch_spin_checked_small-translateX);
53
+ transform: translateX(-$spacing-switch_spin_checked_small-translateX);
54
54
  }
55
55
  }
56
56
  }
57
57
 
58
58
  .#{$module}-loading.#{$module}-large {
59
59
  .#{$module}-loading-spin {
60
- transform: translateX(-$motion-switch_spin_unchecked_large-translateX);
60
+ transform: translateX(-$spacing-switch_spin_unchecked_large-translateX);
61
61
  }
62
62
 
63
63
  &.#{$module}-checked {
64
64
  .#{$module}-loading-spin {
65
- transform: translateX(-$motion-switch_spin_checked_large-translateX);
65
+ transform: translateX(-$spacing-switch_spin_checked_large-translateX);
66
66
  }
67
67
  }
68
68
  }
69
69
 
70
70
  .#{$module}-large {
71
71
  .#{$module}-knob {
72
- transform: translateX(-$motion-switch_unchecked_large-translateX);
72
+ transform: translateX(-$spacing-switch_unchecked_large-translateX);
73
73
  }
74
74
  &.#{$module}-checked {
75
75
  .#{$module}-knob {
76
- transform: translateX(-$motion-switch_checked_large-translateX);
76
+ transform: translateX(-$spacing-switch_checked_large-translateX);
77
77
  }
78
78
 
79
79
  &:active {
80
80
  .#{$module}-knob {
81
- transform: translateX($motion-switch_expand_large-translateX - $motion-switch_checked_large-translateX);
81
+ transform: translateX($spacing-switch_expand_large-translateX - $spacing-switch_checked_large-translateX);
82
82
  }
83
83
  }
84
84
  }
@@ -86,16 +86,16 @@ $module: #{$prefix}-switch;
86
86
 
87
87
  .#{$module}-small {
88
88
  .#{$module}-knob {
89
- transform: translateX(-$motion-switch_unchecked_small-translateX);
89
+ transform: translateX(-$spacing-switch_unchecked_small-translateX);
90
90
  }
91
91
  &.#{$module}-checked {
92
92
  .#{$module}-knob {
93
- transform: translateX(-$motion-switch_checked_small-translateX);
93
+ transform: translateX(-$spacing-switch_checked_small-translateX);
94
94
  }
95
95
 
96
96
  &:active {
97
97
  .#{$module}-knob {
98
- transform: translateX($motion-switch_expand_small-translateX - $motion-switch_checked_small-translateX);
98
+ transform: translateX($spacing-switch_expand_small-translateX - $spacing-switch_checked_small-translateX);
99
99
  }
100
100
  }
101
101
  }
package/lib/es/switch/switch.scss CHANGED
@@ -44,12 +44,12 @@ $module: #{$prefix}-switch;
44
44
  }
45
45
 
46
46
  .#{$module}-knob {
47
- transform: translateX($motion-switch_checked-translateX);
47
+ transform: translateX($spacing-switch_checked-translateX);
48
48
  }
49
49
 
50
50
  &:active {
51
51
  .#{$module}-knob {
52
- transform: translateX($motion-switch_checked-translateX - $width-switch_knob_expand);
52
+ transform: translateX($spacing-switch_checked-translateX - $width-switch_knob_expand);
53
53
  }
54
54
  }
55
55
  }
@@ -157,7 +157,7 @@ $module: #{$prefix}-switch;
157
157
  .#{$module}-loading {
158
158
 
159
159
  .#{$module}-loading-spin {
160
- transform: translateX($motion-switch_spin_unchecked-translateX);
160
+ transform: translateX($spacing-switch_spin_unchecked-translateX);
161
161
 
162
162
  &>.#{$prefix}-spin-wrapper>svg{
163
163
  width: $width-switch_spin-default;
@@ -169,7 +169,7 @@ $module: #{$prefix}-switch;
169
169
  background-color: $color-switch_spin_checked-bg-default;
170
170
 
171
171
  .#{$module}-loading-spin {
172
- transform: translateX($motion-switch_spin_checked-translateX);
172
+ transform: translateX($spacing-switch_spin_checked-translateX);
173
173
  }
174
174
  }
175
175
  }
@@ -177,7 +177,7 @@ $module: #{$prefix}-switch;
177
177
  .#{$module}-loading.#{$module}-small {
178
178
 
179
179
  .#{$module}-loading-spin {
180
- transform: translateX($motion-switch_spin_unchecked_small-translateX);
180
+ transform: translateX($spacing-switch_spin_unchecked_small-translateX);
181
181
 
182
182
  &>.#{$prefix}-spin-wrapper>svg{
183
183
  width: $width-switch_spin-small;
@@ -187,7 +187,7 @@ $module: #{$prefix}-switch;
187
187
  &.#{$module}-checked{
188
188
 
189
189
  .#{$module}-loading-spin {
190
- transform: translateX($motion-switch_spin_checked_small-translateX);
190
+ transform: translateX($spacing-switch_spin_checked_small-translateX);
191
191
  }
192
192
  }
193
193
  }
@@ -195,7 +195,7 @@ $module: #{$prefix}-switch;
195
195
  .#{$module}-loading.#{$module}-large {
196
196
 
197
197
  .#{$module}-loading-spin {
198
- transform: translateX($motion-switch_spin_unchecked_large-translateX);
198
+ transform: translateX($spacing-switch_spin_unchecked_large-translateX);
199
199
 
200
200
  &>.#{$prefix}-spin-wrapper>svg{
201
201
  width: $width-switch_spin-large;
@@ -206,7 +206,7 @@ $module: #{$prefix}-switch;
206
206
  &.#{$module}-checked {
207
207
 
208
208
  .#{$module}-loading-spin {
209
- transform: translateX($motion-switch_spin_checked_large-translateX);
209
+ transform: translateX($spacing-switch_spin_checked_large-translateX);
210
210
  }
211
211
  }
212
212
  }
@@ -224,16 +224,16 @@ $module: #{$prefix}-switch;
224
224
  height: $width-switch_knob_large;
225
225
  top: $spacing-switch_knob_large-padding;
226
226
  border-radius: $width-switch_knob_large * 0.5;
227
- transform: translateX($motion-switch_unchecked_large-translateX);
227
+ transform: translateX($spacing-switch_unchecked_large-translateX);
228
228
  }
229
229
  &.#{$module}-checked {
230
230
  .#{$module}-knob {
231
- transform: translateX($motion-switch_checked_large-translateX);
231
+ transform: translateX($spacing-switch_checked_large-translateX);
232
232
  }
233
233
 
234
234
  &:active {
235
235
  .#{$module}-knob {
236
- transform: translateX($motion-switch_checked_large-translateX - $motion-switch_expand_large-translateX);
236
+ transform: translateX($spacing-switch_checked_large-translateX - $spacing-switch_expand_large-translateX);
237
237
  }
238
238
  }
239
239
  }
@@ -259,16 +259,16 @@ $module: #{$prefix}-switch;
259
259
  height: $width-switch_knob_large_small;
260
260
  top: $spacing-switch_knob_small-padding;
261
261
  border-radius: $width-switch_knob_large_small * 0.5;
262
- transform: translateX($motion-switch_unchecked_small-translateX);
262
+ transform: translateX($spacing-switch_unchecked_small-translateX);
263
263
  }
264
264
  &.#{$module}-checked {
265
265
  .#{$module}-knob {
266
- transform: translateX($motion-switch_checked_small-translateX);
266
+ transform: translateX($spacing-switch_checked_small-translateX);
267
267
  }
268
268
 
269
269
  &:active {
270
270
  .#{$module}-knob {
271
- transform: translateX($motion-switch_checked_small-translateX - $motion-switch_expand_small-translateX);
271
+ transform: translateX($spacing-switch_checked_small-translateX - $spacing-switch_expand_small-translateX);
272
272
  }
273
273
  }
274
274
  }
package/lib/es/switch/variables.scss CHANGED
@@ -1,18 +1,18 @@
1
1
  // Other
2
2
  $spacing-switch_unchecked-translateX: 2px; // 未选中开关右侧偏移量
3
- $motion-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量 - 动画用
4
- $motion-switch_checked-translateX: 18px; // 选中开关右侧偏移量
5
- $motion-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
6
- $motion-switch_expand_large-translateX: 10px;
7
- $motion-switch_unchecked_large-translateX: 3px;
8
- $motion-switch_spin_unchecked_large-translateX: 2px;
9
- $motion-switch_checked_large-translateX: 26px; // 大尺寸选中开关右侧偏移量
10
- $motion-switch_spin_checked_large-translateX: 22px; // 大尺寸选中开关加载图标右侧偏移量
11
- $motion-switch_expand_small-translateX: 2px;
12
- $motion-switch_unchecked_small-translateX: 1px;
13
- $motion-switch_spin_unchecked_small-translateX: 2px;
14
- $motion-switch_checked_small-translateX: 11px; // 小尺寸选中开关右侧偏移量
15
- $motion-switch_spin_checked_small-translateX: 10px; // 小尺寸选中开关加载图标右侧偏移量
3
+ $spacing-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量
4
+ $spacing-switch_checked-translateX: 18px; // 选中开关右侧偏移量
5
+ $spacing-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
6
+ $spacing-switch_expand_large-translateX: 10px;
7
+ $spacing-switch_unchecked_large-translateX: 3px; // 大尺寸未选中开关右侧偏移量
8
+ $spacing-switch_spin_unchecked_large-translateX: 2px; // 大尺寸未选中开关加载图标右侧偏移量
9
+ $spacing-switch_checked_large-translateX: 26px; // 大尺寸选中开关右侧偏移量
10
+ $spacing-switch_spin_checked_large-translateX: 22px; // 大尺寸选中开关加载图标右侧偏移量
11
+ $spacing-switch_expand_small-translateX: 2px;
12
+ $spacing-switch_unchecked_small-translateX: 1px; // 小尺寸未选中开关右侧偏移量
13
+ $spacing-switch_spin_unchecked_small-translateX: 2px; // 小尺寸未选中开关加载图标右侧偏移量
14
+ $spacing-switch_checked_small-translateX: 11px; // 小尺寸选中开关右侧偏移量
15
+ $spacing-switch_spin_checked_small-translateX: 10px; // 小尺寸选中开关加载图标右侧偏移量
16
16
  $motion-switch-transitionDuration: 200ms; // 开关动画时长
17
17
 
18
18
  // Color
@@ -48,11 +48,11 @@ $width-switch_knob_active: $width-switch_knob_default + $width-switch_knob_expan
48
48
  $height-switch_large: 32px; // 大尺寸开关高度
49
49
  $width-switch_large: 54px; // 大尺寸开关宽度
50
50
  $width-switch_knob_large: 24px; // 大尺寸开关按钮宽度
51
- $width-switch_knob_large_active: $width-switch_knob_large + $motion-switch_expand_large-translateX; // 大尺寸开关按钮按下态宽度
51
+ $width-switch_knob_large_active: $width-switch_knob_large + $spacing-switch_expand_large-translateX; // 大尺寸开关按钮按下态宽度
52
52
  $height-switch_small: 16px; // 小尺寸开关高度
53
53
  $width-switch_small: 26px; // 小尺寸开关宽度
54
54
  $width-switch_knob_large_small: 12px; // 小尺寸开关按钮宽度
55
- $width-switch_knob_small_active: $width-switch_knob_large_small + $motion-switch_expand_small-translateX; // 小尺寸开关按钮按下态宽度
55
+ $width-switch_knob_small_active: $width-switch_knob_large_small + $spacing-switch_expand_small-translateX; // 小尺寸开关按钮按下态宽度
56
56
  $width-switch_knob_disabled-border: 1px; // 小尺寸开关按钮宽度
57
57
  $width-switch_checked_unchecked_text: 26px; // 开关按钮文字宽度
58
58
  $width-switch_spin-small: 10px; // 小尺寸开关加载 spin 宽度
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@douyinfe/semi-foundation",
3
- "version": "2.23.4",
3
+ "version": "2.23.5",
4
4
  "description": "",
5
5
  "scripts": {
6
6
  "build:lib": "node ./scripts/compileLib.js",
@@ -23,7 +23,7 @@
23
23
  "*.scss",
24
24
  "*.css"
25
25
  ],
26
- "gitHead": "39123342dc7146f2afb9d7c6e1a8f108b2c04a9c",
26
+ "gitHead": "c3cd98419912c96831a20c5a9f8ce33295b19d5d",
27
27
  "devDependencies": {
28
28
  "@babel/plugin-transform-runtime": "^7.15.8",
29
29
  "@babel/preset-env": "^7.15.8",
package/switch/rtl.scss CHANGED
@@ -7,12 +7,12 @@ $module: #{$prefix}-switch;
7
7
 
8
8
  &-checked {
9
9
  .#{$module}-knob {
10
- transform: translateX(-$motion-switch_checked-translateX);
10
+ transform: translateX(-$spacing-switch_checked-translateX);
11
11
  }
12
12
 
13
13
  &:active {
14
14
  .#{$module}-knob {
15
- transform: translateX($width-switch_knob_expand - $motion-switch_checked-translateX);
15
+ transform: translateX($width-switch_knob_expand - $spacing-switch_checked-translateX);
16
16
  }
17
17
  }
18
18
  }
@@ -34,51 +34,51 @@ $module: #{$prefix}-switch;
34
34
 
35
35
  .#{$module}-loading {
36
36
  .#{$module}-loading-spin {
37
- transform: translateX(-$motion-switch_spin_unchecked-translateX);
37
+ transform: translateX(-$spacing-switch_spin_unchecked-translateX);
38
38
  }
39
39
 
40
40
  &.#{$module}-checked {
41
41
  .#{$module}-loading-spin {
42
- transform: translateX(-$motion-switch_spin_checked-translateX);
42
+ transform: translateX(-$spacing-switch_spin_checked-translateX);
43
43
  }
44
44
  }
45
45
  }
46
46
 
47
47
  .#{$module}-loading.#{$module}-small {
48
48
  .#{$module}-loading-spin {
49
- transform: translateX(-$motion-switch_spin_unchecked_small-translateX);
49
+ transform: translateX(-$spacing-switch_spin_unchecked_small-translateX);
50
50
  }
51
51
  &.#{$module}-checked{
52
52
  .#{$module}-loading-spin {
53
- transform: translateX(-$motion-switch_spin_checked_small-translateX);
53
+ transform: translateX(-$spacing-switch_spin_checked_small-translateX);
54
54
  }
55
55
  }
56
56
  }
57
57
 
58
58
  .#{$module}-loading.#{$module}-large {
59
59
  .#{$module}-loading-spin {
60
- transform: translateX(-$motion-switch_spin_unchecked_large-translateX);
60
+ transform: translateX(-$spacing-switch_spin_unchecked_large-translateX);
61
61
  }
62
62
 
63
63
  &.#{$module}-checked {
64
64
  .#{$module}-loading-spin {
65
- transform: translateX(-$motion-switch_spin_checked_large-translateX);
65
+ transform: translateX(-$spacing-switch_spin_checked_large-translateX);
66
66
  }
67
67
  }
68
68
  }
69
69
 
70
70
  .#{$module}-large {
71
71
  .#{$module}-knob {
72
- transform: translateX(-$motion-switch_unchecked_large-translateX);
72
+ transform: translateX(-$spacing-switch_unchecked_large-translateX);
73
73
  }
74
74
  &.#{$module}-checked {
75
75
  .#{$module}-knob {
76
- transform: translateX(-$motion-switch_checked_large-translateX);
76
+ transform: translateX(-$spacing-switch_checked_large-translateX);
77
77
  }
78
78
 
79
79
  &:active {
80
80
  .#{$module}-knob {
81
- transform: translateX($motion-switch_expand_large-translateX - $motion-switch_checked_large-translateX);
81
+ transform: translateX($spacing-switch_expand_large-translateX - $spacing-switch_checked_large-translateX);
82
82
  }
83
83
  }
84
84
  }
@@ -86,16 +86,16 @@ $module: #{$prefix}-switch;
86
86
 
87
87
  .#{$module}-small {
88
88
  .#{$module}-knob {
89
- transform: translateX(-$motion-switch_unchecked_small-translateX);
89
+ transform: translateX(-$spacing-switch_unchecked_small-translateX);
90
90
  }
91
91
  &.#{$module}-checked {
92
92
  .#{$module}-knob {
93
- transform: translateX(-$motion-switch_checked_small-translateX);
93
+ transform: translateX(-$spacing-switch_checked_small-translateX);
94
94
  }
95
95
 
96
96
  &:active {
97
97
  .#{$module}-knob {
98
- transform: translateX($motion-switch_expand_small-translateX - $motion-switch_checked_small-translateX);
98
+ transform: translateX($spacing-switch_expand_small-translateX - $spacing-switch_checked_small-translateX);
99
99
  }
100
100
  }
101
101
  }
package/switch/switch.scss CHANGED
@@ -44,12 +44,12 @@ $module: #{$prefix}-switch;
44
44
  }
45
45
 
46
46
  .#{$module}-knob {
47
- transform: translateX($motion-switch_checked-translateX);
47
+ transform: translateX($spacing-switch_checked-translateX);
48
48
  }
49
49
 
50
50
  &:active {
51
51
  .#{$module}-knob {
52
- transform: translateX($motion-switch_checked-translateX - $width-switch_knob_expand);
52
+ transform: translateX($spacing-switch_checked-translateX - $width-switch_knob_expand);
53
53
  }
54
54
  }
55
55
  }
@@ -157,7 +157,7 @@ $module: #{$prefix}-switch;
157
157
  .#{$module}-loading {
158
158
 
159
159
  .#{$module}-loading-spin {
160
- transform: translateX($motion-switch_spin_unchecked-translateX);
160
+ transform: translateX($spacing-switch_spin_unchecked-translateX);
161
161
 
162
162
  &>.#{$prefix}-spin-wrapper>svg{
163
163
  width: $width-switch_spin-default;
@@ -169,7 +169,7 @@ $module: #{$prefix}-switch;
169
169
  background-color: $color-switch_spin_checked-bg-default;
170
170
 
171
171
  .#{$module}-loading-spin {
172
- transform: translateX($motion-switch_spin_checked-translateX);
172
+ transform: translateX($spacing-switch_spin_checked-translateX);
173
173
  }
174
174
  }
175
175
  }
@@ -177,7 +177,7 @@ $module: #{$prefix}-switch;
177
177
  .#{$module}-loading.#{$module}-small {
178
178
 
179
179
  .#{$module}-loading-spin {
180
- transform: translateX($motion-switch_spin_unchecked_small-translateX);
180
+ transform: translateX($spacing-switch_spin_unchecked_small-translateX);
181
181
 
182
182
  &>.#{$prefix}-spin-wrapper>svg{
183
183
  width: $width-switch_spin-small;
@@ -187,7 +187,7 @@ $module: #{$prefix}-switch;
187
187
  &.#{$module}-checked{
188
188
 
189
189
  .#{$module}-loading-spin {
190
- transform: translateX($motion-switch_spin_checked_small-translateX);
190
+ transform: translateX($spacing-switch_spin_checked_small-translateX);
191
191
  }
192
192
  }
193
193
  }
@@ -195,7 +195,7 @@ $module: #{$prefix}-switch;
195
195
  .#{$module}-loading.#{$module}-large {
196
196
 
197
197
  .#{$module}-loading-spin {
198
- transform: translateX($motion-switch_spin_unchecked_large-translateX);
198
+ transform: translateX($spacing-switch_spin_unchecked_large-translateX);
199
199
 
200
200
  &>.#{$prefix}-spin-wrapper>svg{
201
201
  width: $width-switch_spin-large;
@@ -206,7 +206,7 @@ $module: #{$prefix}-switch;
206
206
  &.#{$module}-checked {
207
207
 
208
208
  .#{$module}-loading-spin {
209
- transform: translateX($motion-switch_spin_checked_large-translateX);
209
+ transform: translateX($spacing-switch_spin_checked_large-translateX);
210
210
  }
211
211
  }
212
212
  }
@@ -224,16 +224,16 @@ $module: #{$prefix}-switch;
224
224
  height: $width-switch_knob_large;
225
225
  top: $spacing-switch_knob_large-padding;
226
226
  border-radius: $width-switch_knob_large * 0.5;
227
- transform: translateX($motion-switch_unchecked_large-translateX);
227
+ transform: translateX($spacing-switch_unchecked_large-translateX);
228
228
  }
229
229
  &.#{$module}-checked {
230
230
  .#{$module}-knob {
231
- transform: translateX($motion-switch_checked_large-translateX);
231
+ transform: translateX($spacing-switch_checked_large-translateX);
232
232
  }
233
233
 
234
234
  &:active {
235
235
  .#{$module}-knob {
236
- transform: translateX($motion-switch_checked_large-translateX - $motion-switch_expand_large-translateX);
236
+ transform: translateX($spacing-switch_checked_large-translateX - $spacing-switch_expand_large-translateX);
237
237
  }
238
238
  }
239
239
  }
@@ -259,16 +259,16 @@ $module: #{$prefix}-switch;
259
259
  height: $width-switch_knob_large_small;
260
260
  top: $spacing-switch_knob_small-padding;
261
261
  border-radius: $width-switch_knob_large_small * 0.5;
262
- transform: translateX($motion-switch_unchecked_small-translateX);
262
+ transform: translateX($spacing-switch_unchecked_small-translateX);
263
263
  }
264
264
  &.#{$module}-checked {
265
265
  .#{$module}-knob {
266
- transform: translateX($motion-switch_checked_small-translateX);
266
+ transform: translateX($spacing-switch_checked_small-translateX);
267
267
  }
268
268
 
269
269
  &:active {
270
270
  .#{$module}-knob {
271
- transform: translateX($motion-switch_checked_small-translateX - $motion-switch_expand_small-translateX);
271
+ transform: translateX($spacing-switch_checked_small-translateX - $spacing-switch_expand_small-translateX);
272
272
  }
273
273
  }
274
274
  }
package/switch/variables.scss CHANGED
@@ -1,18 +1,18 @@
1
1
  // Other
2
2
  $spacing-switch_unchecked-translateX: 2px; // 未选中开关右侧偏移量
3
- $motion-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量 - 动画用
4
- $motion-switch_checked-translateX: 18px; // 选中开关右侧偏移量
5
- $motion-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
6
- $motion-switch_expand_large-translateX: 10px;
7
- $motion-switch_unchecked_large-translateX: 3px;
8
- $motion-switch_spin_unchecked_large-translateX: 2px;
9
- $motion-switch_checked_large-translateX: 26px; // 大尺寸选中开关右侧偏移量
10
- $motion-switch_spin_checked_large-translateX: 22px; // 大尺寸选中开关加载图标右侧偏移量
11
- $motion-switch_expand_small-translateX: 2px;
12
- $motion-switch_unchecked_small-translateX: 1px;
13
- $motion-switch_spin_unchecked_small-translateX: 2px;
14
- $motion-switch_checked_small-translateX: 11px; // 小尺寸选中开关右侧偏移量
15
- $motion-switch_spin_checked_small-translateX: 10px; // 小尺寸选中开关加载图标右侧偏移量
3
+ $spacing-switch_spin_unchecked-translateX: 2px; // 未选中开关加载图标右侧偏移量
4
+ $spacing-switch_checked-translateX: 18px; // 选中开关右侧偏移量
5
+ $spacing-switch_spin_checked-translateX: 16px; // 选中开关加载图标右侧偏移量
6
+ $spacing-switch_expand_large-translateX: 10px;
7
+ $spacing-switch_unchecked_large-translateX: 3px; // 大尺寸未选中开关右侧偏移量
8
+ $spacing-switch_spin_unchecked_large-translateX: 2px; // 大尺寸未选中开关加载图标右侧偏移量
9
+ $spacing-switch_checked_large-translateX: 26px; // 大尺寸选中开关右侧偏移量
10
+ $spacing-switch_spin_checked_large-translateX: 22px; // 大尺寸选中开关加载图标右侧偏移量
11
+ $spacing-switch_expand_small-translateX: 2px;
12
+ $spacing-switch_unchecked_small-translateX: 1px; // 小尺寸未选中开关右侧偏移量
13
+ $spacing-switch_spin_unchecked_small-translateX: 2px; // 小尺寸未选中开关加载图标右侧偏移量
14
+ $spacing-switch_checked_small-translateX: 11px; // 小尺寸选中开关右侧偏移量
15
+ $spacing-switch_spin_checked_small-translateX: 10px; // 小尺寸选中开关加载图标右侧偏移量
16
16
  $motion-switch-transitionDuration: 200ms; // 开关动画时长
17
17
 
18
18
  // Color
@@ -48,11 +48,11 @@ $width-switch_knob_active: $width-switch_knob_default + $width-switch_knob_expan
48
48
  $height-switch_large: 32px; // 大尺寸开关高度
49
49
  $width-switch_large: 54px; // 大尺寸开关宽度
50
50
  $width-switch_knob_large: 24px; // 大尺寸开关按钮宽度
51
- $width-switch_knob_large_active: $width-switch_knob_large + $motion-switch_expand_large-translateX; // 大尺寸开关按钮按下态宽度
51
+ $width-switch_knob_large_active: $width-switch_knob_large + $spacing-switch_expand_large-translateX; // 大尺寸开关按钮按下态宽度
52
52
  $height-switch_small: 16px; // 小尺寸开关高度
53
53
  $width-switch_small: 26px; // 小尺寸开关宽度
54
54
  $width-switch_knob_large_small: 12px; // 小尺寸开关按钮宽度
55
- $width-switch_knob_small_active: $width-switch_knob_large_small + $motion-switch_expand_small-translateX; // 小尺寸开关按钮按下态宽度
55
+ $width-switch_knob_small_active: $width-switch_knob_large_small + $spacing-switch_expand_small-translateX; // 小尺寸开关按钮按下态宽度
56
56
  $width-switch_knob_disabled-border: 1px; // 小尺寸开关按钮宽度
57
57
  $width-switch_checked_unchecked_text: 26px; // 开关按钮文字宽度
58
58
  $width-switch_spin-small: 10px; // 小尺寸开关加载 spin 宽度