@douyinfe/semi-foundation 2.37.0 → 2.37.1

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.
@@ -25,7 +25,7 @@ $module: #{$prefix}-cascader;
25
25
  border: $width-cascader_hover-border $color-cascader_default-border-hover solid;
26
26
  }
27
27
 
28
- &:focus {
28
+ &:focus:not(&-disabled) {
29
29
  border: $width-cascader_focus-border solid $color-cascader_default-border-focus;
30
30
  background-color: $color-cascader_default-bg-default;
31
31
  outline: 0;
@@ -21,7 +21,7 @@
21
21
  background-color: var(--semi-color-fill-1);
22
22
  border: 1px transparent solid;
23
23
  }
24
- .semi-cascader:focus {
24
+ .semi-cascader:focus:not(.semi-cascader-disabled) {
25
25
  border: 1px solid var(--semi-color-focus-border);
26
26
  background-color: var(--semi-color-fill-0);
27
27
  outline: 0;
@@ -25,7 +25,7 @@ $module: #{$prefix}-cascader;
25
25
  border: $width-cascader_hover-border $color-cascader_default-border-hover solid;
26
26
  }
27
27
 
28
- &:focus {
28
+ &:focus:not(&-disabled) {
29
29
  border: $width-cascader_focus-border solid $color-cascader_default-border-focus;
30
30
  background-color: $color-cascader_default-bg-default;
31
31
  outline: 0;
@@ -107,8 +107,8 @@ $inner-width: $width-icon-medium;
107
107
  flex-wrap: nowrap;
108
108
  border-radius: $radius-radio_cardRadioGroup;
109
109
  padding: $spacing-radio_cardRadioGroup-paddingY $spacing-radio_cardRadioGroup-paddingX;
110
- background: transparent;
111
- border: $width-radio_cardRadioGroup_checked-border solid transparent;
110
+ background: $color-radio_cardRadioGroup-bg-default;
111
+ border: $width-radio_cardRadioGroup_checked-border solid $color-radio_cardRadioGroup_border-default;
112
112
  transition: background-color $transition_duration_radio-bg $transition_function-radio-bg $transition_delay-radio-bg,
113
113
  border $transition_duration-radio-border $transition_function-radio-border $transition_delay-radio-border;
114
114
 
@@ -172,7 +172,7 @@ $inner-width: $width-icon-medium;
172
172
 
173
173
  &_disabled {
174
174
  &:active {
175
- background: transparent;
175
+ background: $color-radio_cardRadioGroup_disabled-bg-active;
176
176
  }
177
177
  }
178
178
 
@@ -32,10 +32,13 @@ $color-radio_buttonRadio-text-disabled: var(--semi-color-disabled-text); // 按
32
32
  $color-radio_addon_buttonRadio-bg-hover: var(--semi-color-fill-1); // 按钮样式单选悬浮态背景色
33
33
  $color-radio_addon_buttonRadio-text-checked: var(--semi-color-primary); // 按钮样式单选选中项文字颜色
34
34
  $color-radio_addon_buttonRadio-bg-checked: var(--semi-color-bg-3); // 按钮样式单选选中项背景颜色
35
+ $color-radio_cardRadioGroup-bg-default: transparent; // 卡片样式单选默认背景色
35
36
  $color-radio_cardRadioGroup-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中态背景色
36
37
  $color-radio_cardRadioGroup_disabled-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中且禁用时的背景色
38
+ $color-radio_cardRadioGroup_disabled-bg-active: transparent; // 卡片样式单选禁用时的背景色 - 按下态
37
39
  $color-radio_cardRadioGroup-bg-hover: var(--semi-color-fill-0); // 卡片样式单选悬浮态背景色
38
40
  $color-radio_cardRadioGroup-bg-active: var(--semi-color-fill-1); // 卡片样式单选按下态背景色
41
+ $color-radio_cardRadioGroup_border-default: transparent; // 卡片样式单选默认描边颜色
39
42
  $color-radio_cardRadioGroup_border-active: var(--semi-color-primary); // 卡片样式单选选中态描边颜色
40
43
  $color-radio_cardRadioGroup_checked_border-active: var(--semi-color-primary-active); // 卡片样式单选选中态描边颜色 - 按下态
41
44
  $color-radio_cardRadioGroup_checked_border-hover: var(--semi-color-primary-hover); // 卡片样式单选选中态描边颜色 - 悬浮态
@@ -21,7 +21,7 @@
21
21
  background-color: var(--semi-color-fill-1);
22
22
  border: 1px transparent solid;
23
23
  }
24
- .semi-cascader:focus {
24
+ .semi-cascader:focus:not(.semi-cascader-disabled) {
25
25
  border: 1px solid var(--semi-color-focus-border);
26
26
  background-color: var(--semi-color-fill-0);
27
27
  outline: 0;
@@ -25,7 +25,7 @@ $module: #{$prefix}-cascader;
25
25
  border: $width-cascader_hover-border $color-cascader_default-border-hover solid;
26
26
  }
27
27
 
28
- &:focus {
28
+ &:focus:not(&-disabled) {
29
29
  border: $width-cascader_focus-border solid $color-cascader_default-border-focus;
30
30
  background-color: $color-cascader_default-bg-default;
31
31
  outline: 0;
@@ -107,8 +107,8 @@ $inner-width: $width-icon-medium;
107
107
  flex-wrap: nowrap;
108
108
  border-radius: $radius-radio_cardRadioGroup;
109
109
  padding: $spacing-radio_cardRadioGroup-paddingY $spacing-radio_cardRadioGroup-paddingX;
110
- background: transparent;
111
- border: $width-radio_cardRadioGroup_checked-border solid transparent;
110
+ background: $color-radio_cardRadioGroup-bg-default;
111
+ border: $width-radio_cardRadioGroup_checked-border solid $color-radio_cardRadioGroup_border-default;
112
112
  transition: background-color $transition_duration_radio-bg $transition_function-radio-bg $transition_delay-radio-bg,
113
113
  border $transition_duration-radio-border $transition_function-radio-border $transition_delay-radio-border;
114
114
 
@@ -172,7 +172,7 @@ $inner-width: $width-icon-medium;
172
172
 
173
173
  &_disabled {
174
174
  &:active {
175
- background: transparent;
175
+ background: $color-radio_cardRadioGroup_disabled-bg-active;
176
176
  }
177
177
  }
178
178
 
@@ -32,10 +32,13 @@ $color-radio_buttonRadio-text-disabled: var(--semi-color-disabled-text); // 按
32
32
  $color-radio_addon_buttonRadio-bg-hover: var(--semi-color-fill-1); // 按钮样式单选悬浮态背景色
33
33
  $color-radio_addon_buttonRadio-text-checked: var(--semi-color-primary); // 按钮样式单选选中项文字颜色
34
34
  $color-radio_addon_buttonRadio-bg-checked: var(--semi-color-bg-3); // 按钮样式单选选中项背景颜色
35
+ $color-radio_cardRadioGroup-bg-default: transparent; // 卡片样式单选默认背景色
35
36
  $color-radio_cardRadioGroup-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中态背景色
36
37
  $color-radio_cardRadioGroup_disabled-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中且禁用时的背景色
38
+ $color-radio_cardRadioGroup_disabled-bg-active: transparent; // 卡片样式单选禁用时的背景色 - 按下态
37
39
  $color-radio_cardRadioGroup-bg-hover: var(--semi-color-fill-0); // 卡片样式单选悬浮态背景色
38
40
  $color-radio_cardRadioGroup-bg-active: var(--semi-color-fill-1); // 卡片样式单选按下态背景色
41
+ $color-radio_cardRadioGroup_border-default: transparent; // 卡片样式单选默认描边颜色
39
42
  $color-radio_cardRadioGroup_border-active: var(--semi-color-primary); // 卡片样式单选选中态描边颜色
40
43
  $color-radio_cardRadioGroup_checked_border-active: var(--semi-color-primary-active); // 卡片样式单选选中态描边颜色 - 按下态
41
44
  $color-radio_cardRadioGroup_checked_border-hover: var(--semi-color-primary-hover); // 卡片样式单选选中态描边颜色 - 悬浮态
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@douyinfe/semi-foundation",
3
- "version": "2.37.0",
3
+ "version": "2.37.1",
4
4
  "description": "",
5
5
  "scripts": {
6
6
  "build:lib": "node ./scripts/compileLib.js",
7
7
  "prepublishOnly": "npm run build:lib"
8
8
  },
9
9
  "dependencies": {
10
- "@douyinfe/semi-animation": "2.12.0",
10
+ "@douyinfe/semi-animation": "2.37.1",
11
11
  "async-validator": "^3.5.0",
12
12
  "classnames": "^2.2.6",
13
13
  "date-fns": "^2.29.3",
@@ -23,7 +23,7 @@
23
23
  "*.scss",
24
24
  "*.css"
25
25
  ],
26
- "gitHead": "3d2a2680186785f167b1bb0f9c719a2945c3c1f0",
26
+ "gitHead": "2d2a5d947fcb294ca82bc3aa9b05c061c3640499",
27
27
  "devDependencies": {
28
28
  "@babel/plugin-transform-runtime": "^7.15.8",
29
29
  "@babel/preset-env": "^7.15.8",
package/radio/radio.scss CHANGED
@@ -107,8 +107,8 @@ $inner-width: $width-icon-medium;
107
107
  flex-wrap: nowrap;
108
108
  border-radius: $radius-radio_cardRadioGroup;
109
109
  padding: $spacing-radio_cardRadioGroup-paddingY $spacing-radio_cardRadioGroup-paddingX;
110
- background: transparent;
111
- border: $width-radio_cardRadioGroup_checked-border solid transparent;
110
+ background: $color-radio_cardRadioGroup-bg-default;
111
+ border: $width-radio_cardRadioGroup_checked-border solid $color-radio_cardRadioGroup_border-default;
112
112
  transition: background-color $transition_duration_radio-bg $transition_function-radio-bg $transition_delay-radio-bg,
113
113
  border $transition_duration-radio-border $transition_function-radio-border $transition_delay-radio-border;
114
114
 
@@ -172,7 +172,7 @@ $inner-width: $width-icon-medium;
172
172
 
173
173
  &_disabled {
174
174
  &:active {
175
- background: transparent;
175
+ background: $color-radio_cardRadioGroup_disabled-bg-active;
176
176
  }
177
177
  }
178
178
 
@@ -32,7 +32,7 @@ export default class RadioFoundation extends BaseFoundation<RadioAdapter> {
32
32
  if (target.matches(':focus-visible')) {
33
33
  this._adapter.setFocusVisible(true);
34
34
  }
35
- } catch (error){
35
+ } catch (error) {
36
36
  warning(true, 'Warning: [Semi Radio] The current browser does not support the focus-visible');
37
37
  }
38
38
  }
@@ -32,10 +32,13 @@ $color-radio_buttonRadio-text-disabled: var(--semi-color-disabled-text); // 按
32
32
  $color-radio_addon_buttonRadio-bg-hover: var(--semi-color-fill-1); // 按钮样式单选悬浮态背景色
33
33
  $color-radio_addon_buttonRadio-text-checked: var(--semi-color-primary); // 按钮样式单选选中项文字颜色
34
34
  $color-radio_addon_buttonRadio-bg-checked: var(--semi-color-bg-3); // 按钮样式单选选中项背景颜色
35
+ $color-radio_cardRadioGroup-bg-default: transparent; // 卡片样式单选默认背景色
35
36
  $color-radio_cardRadioGroup-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中态背景色
36
37
  $color-radio_cardRadioGroup_disabled-bg-checked: var(--semi-color-primary-light-default); // 卡片样式单选选中且禁用时的背景色
38
+ $color-radio_cardRadioGroup_disabled-bg-active: transparent; // 卡片样式单选禁用时的背景色 - 按下态
37
39
  $color-radio_cardRadioGroup-bg-hover: var(--semi-color-fill-0); // 卡片样式单选悬浮态背景色
38
40
  $color-radio_cardRadioGroup-bg-active: var(--semi-color-fill-1); // 卡片样式单选按下态背景色
41
+ $color-radio_cardRadioGroup_border-default: transparent; // 卡片样式单选默认描边颜色
39
42
  $color-radio_cardRadioGroup_border-active: var(--semi-color-primary); // 卡片样式单选选中态描边颜色
40
43
  $color-radio_cardRadioGroup_checked_border-active: var(--semi-color-primary-active); // 卡片样式单选选中态描边颜色 - 按下态
41
44
  $color-radio_cardRadioGroup_checked_border-hover: var(--semi-color-primary-hover); // 卡片样式单选选中态描边颜色 - 悬浮态