@semcore/radio 5.1.4 → 5.3.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 (6) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/lib/cjs/Radio.js +14 -14
  3. package/lib/cjs/style/radio.shadow.css +16 -18
  4. package/lib/es6/Radio.js +14 -14
  5. package/lib/es6/style/radio.shadow.css +16 -18
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,18 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
+ ## [5.3.0] - 2022-12-12
6
+
7
+ ### Added
8
+
9
+ - Design tokens based theming.
10
+
11
+ ## [5.2.0] - 2022-11-30
12
+
13
+ ### Changed
14
+
15
+ - Updated border-color in focus state from `--blue-400` to `--blue-500`, `--red-400` to `--red-500`.
16
+
5
17
  ## [5.1.4] - 2022-11-30
6
18
 
7
19
  ### Changed
package/lib/cjs/Radio.js CHANGED
@@ -62,23 +62,23 @@ var style = (
62
62
  /*__reshadow_css_start__*/
63
63
  _core.sstyled.insert(
64
64
  /*__inner_css_start__*/
65
- ".___SRadio_1qh5k_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_1qh5k_gg_.__disabled_1qh5k_gg_{opacity:0.3;cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SText_1qh5k_gg_{margin-left:8px}.___SText_1qh5k_gg_._size_m_1qh5k_gg_{font-size:14px;line-height:1.42}.___SText_1qh5k_gg_._size_l_1qh5k_gg_{font-size:16px;line-height:1.5}.___SValue_1qh5k_gg_{position:relative;flex-shrink:0;padding:0;outline:none;z-index:0;margin-top:2px}.___SValue_1qh5k_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:#fff;border:1px solid;border-radius:50%}.___SValue_1qh5k_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0;border-radius:50%;background:#fff}.___SValue_1qh5k_gg_._size_m_1qh5k_gg_{width:16px;height:16px}.___SValue_1qh5k_gg_._size_l_1qh5k_gg_{width:20px;height:20px}.___SValue_1qh5k_gg_._state_normal_1qh5k_gg_:before{border-color:#c4c7cf}.___SValue_1qh5k_gg_._state_invalid_1qh5k_gg_:before{border-color:#ff4953}.___SControl_1qh5k_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_:before{border-color:#008ff8;background-color:#008ff8}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_._size_m_1qh5k_gg_:after{width:6px;height:6px}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_._size_l_1qh5k_gg_:after{width:8px;height:8px}.___SValue_1qh5k_gg_._state_normal_1qh5k_gg_.__keyboardFocused_1qh5k_gg_:before{box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2);border-color:#008ff8}.___SValue_1qh5k_gg_._state_invalid_1qh5k_gg_.__keyboardFocused_1qh5k_gg_:before{box-shadow:0px 0px 0px 3px rgba(255, 73, 83, 0.2)}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_.__theme_1qh5k_gg_:before{border-color:var(--theme_1qh5k);background-color:var(--theme_1qh5k)}.___SValue_1qh5k_gg_._state_normal_1qh5k_gg_.__theme_1qh5k_gg_:before{border-color:var(--theme_1qh5k)}"
65
+ ".___SRadio_j28wz_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_j28wz_gg_.__disabled_j28wz_gg_{opacity:var(--intergalactic-disabled-opacity,.3);cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SText_j28wz_gg_{margin-left:var(--intergalactic-spacing-2x,8px)}.___SText_j28wz_gg_._size_m_j28wz_gg_{font-size:var(--intergalactic-fs-200,14px);line-height:var(--intergalactic-lh-200,142%)}.___SText_j28wz_gg_._size_l_j28wz_gg_{font-size:var(--intergalactic-fs-300,16px);line-height:var(--intergalactic-lh-300,150%)}.___SValue_j28wz_gg_{position:relative;flex-shrink:0;padding:0;outline:none;z-index:0;margin-top:var(--intergalactic-spacing-05x,2px)}.___SValue_j28wz_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral,#fff);border:1px solid;border-radius:50%}.___SValue_j28wz_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0;border-radius:50%;background:var(--intergalactic-bg-primary-neutral,#fff)}.___SValue_j28wz_gg_._size_m_j28wz_gg_{width:16px;height:16px}.___SValue_j28wz_gg_._size_l_j28wz_gg_{width:20px;height:20px}.___SValue_j28wz_gg_._state_normal_j28wz_gg_:before{border-color:var(--intergalactic-border-primary,#c4c7cf)}.___SValue_j28wz_gg_._state_invalid_j28wz_gg_:before{border-color:var(--intergalactic-border-danger-active,#d1002f)}.___SControl_j28wz_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_:before{border-color:var(--intergalactic-control-primary-info,#008ff8);background-color:var(--intergalactic-bg-primary-info,#008ff8)}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_._size_m_j28wz_gg_:after{width:6px;height:6px}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_._size_l_j28wz_gg_:after{width:8px;height:8px}.___SValue_j28wz_gg_._state_normal_j28wz_gg_.__keyboardFocused_j28wz_gg_:before{box-shadow:var(--intergalactic-keyboard-focus,0 0 0 3px rgba(0,143,248,.3));border-color:var(--intergalactic-border-info-active,#006dca)}.___SValue_j28wz_gg_._state_invalid_j28wz_gg_.__keyboardFocused_j28wz_gg_:before{box-shadow:var(--intergalactic-keyboard-focus-invalid,0 0 0 3px rgba(255,73,83,.3))}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_.__theme_j28wz_gg_:before{border-color:var(--theme_j28wz);background-color:var(--theme_j28wz)}.___SValue_j28wz_gg_._state_normal_j28wz_gg_.__theme_j28wz_gg_:before{border-color:var(--theme_j28wz)}"
66
66
  /*__inner_css_end__*/
67
- , "1qh5k_gg_")
67
+ , "j28wz_gg_")
68
68
  /*__reshadow_css_end__*/
69
69
  , {
70
- "__SRadio": "___SRadio_1qh5k_gg_",
71
- "_disabled": "__disabled_1qh5k_gg_",
72
- "__SText": "___SText_1qh5k_gg_",
73
- "_size_m": "_size_m_1qh5k_gg_",
74
- "_size_l": "_size_l_1qh5k_gg_",
75
- "__SValue": "___SValue_1qh5k_gg_",
76
- "_state_normal": "_state_normal_1qh5k_gg_",
77
- "_state_invalid": "_state_invalid_1qh5k_gg_",
78
- "__SControl": "___SControl_1qh5k_gg_",
79
- "_keyboardFocused": "__keyboardFocused_1qh5k_gg_",
80
- "_theme": "__theme_1qh5k_gg_",
81
- "--theme": "--theme_1qh5k"
70
+ "__SRadio": "___SRadio_j28wz_gg_",
71
+ "_disabled": "__disabled_j28wz_gg_",
72
+ "__SText": "___SText_j28wz_gg_",
73
+ "_size_m": "_size_m_j28wz_gg_",
74
+ "_size_l": "_size_l_j28wz_gg_",
75
+ "__SValue": "___SValue_j28wz_gg_",
76
+ "_state_normal": "_state_normal_j28wz_gg_",
77
+ "_state_invalid": "_state_invalid_j28wz_gg_",
78
+ "__SControl": "___SControl_j28wz_gg_",
79
+ "_keyboardFocused": "__keyboardFocused_j28wz_gg_",
80
+ "_theme": "__theme_j28wz_gg_",
81
+ "--theme": "--theme_j28wz"
82
82
  });
83
83
 
84
84
  var RadioGroupRoot = /*#__PURE__*/function (_Component) {
package/lib/cjs/style/radio.shadow.css CHANGED
@@ -1,5 +1,3 @@
1
- @import '@semcore/utils/style/var.css';
2
-
3
1
  SRadio {
4
2
  display: inline-flex;
5
3
  align-items: flex-start;
@@ -7,24 +5,24 @@ SRadio {
7
5
  }
8
6
 
9
7
  SRadio[disabled] {
10
- opacity: var(--disabled-opacity);
8
+ opacity: var(--intergalactic-disabled-opacity, 0.3);
11
9
  cursor: default;
12
10
  pointer-events: none;
13
11
  user-select: none;
14
12
  }
15
13
 
16
14
  SText {
17
- margin-left: 8px;
15
+ margin-left: var(--intergalactic-spacing-2x, 8px);
18
16
  }
19
17
 
20
18
  SText[size='m'] {
21
- font-size: var(--fs-200);
22
- line-height: var(--lh-200);
19
+ font-size: var(--intergalactic-fs-200, 14px);
20
+ line-height: var(--intergalactic-lh-200, 142%);
23
21
  }
24
22
 
25
23
  SText[size='l'] {
26
- font-size: var(--fs-300);
27
- line-height: var(--lh-300);
24
+ font-size: var(--intergalactic-fs-300, 16px);
25
+ line-height: var(--intergalactic-lh-300, 150%);
28
26
  }
29
27
 
30
28
  SValue {
@@ -34,7 +32,7 @@ SValue {
34
32
  outline: none;
35
33
  z-index: 0;
36
34
 
37
- margin-top: 2px;
35
+ margin-top: var(--intergalactic-spacing-05x, 2px);
38
36
 
39
37
  &::before {
40
38
  content: '';
@@ -43,7 +41,7 @@ SValue {
43
41
  left: 0;
44
42
  right: 0;
45
43
  bottom: 0;
46
- background: #fff;
44
+ background: var(--intergalactic-bg-primary-neutral, #ffffff);
47
45
  border: 1px solid;
48
46
  border-radius: 50%;
49
47
  }
@@ -61,7 +59,7 @@ SValue {
61
59
  width: 0;
62
60
  height: 0;
63
61
  border-radius: 50%;
64
- background: #fff;
62
+ background: var(--intergalactic-bg-primary-neutral, #ffffff);
65
63
  }
66
64
  }
67
65
 
@@ -76,11 +74,11 @@ SValue[size='l'] {
76
74
  }
77
75
 
78
76
  SValue[state='normal']::before {
79
- border-color: var(--gray-200);
77
+ border-color: var(--intergalactic-border-primary, #c4c7cf);
80
78
  }
81
79
 
82
80
  SValue[state='invalid']::before {
83
- border-color: var(--red-400);
81
+ border-color: var(--intergalactic-border-danger-active, #d1002f);
84
82
  }
85
83
 
86
84
  SControl {
@@ -89,8 +87,8 @@ SControl {
89
87
  }
90
88
 
91
89
  SControl:checked ~ SValue::before {
92
- border-color: var(--blue-400);
93
- background-color: var(--blue-400);
90
+ border-color: var(--intergalactic-control-primary-info, #008ff8);
91
+ background-color: var(--intergalactic-bg-primary-info, #008ff8);
94
92
  }
95
93
 
96
94
  SControl:checked ~ SValue[size='m']::after {
@@ -104,12 +102,12 @@ SControl:checked ~ SValue[size='l']::after {
104
102
  }
105
103
 
106
104
  SValue[state='normal'][keyboardFocused]::before {
107
- box-shadow: var(--keyboard-focus);
108
- border-color: var(--blue-400);
105
+ box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.3));
106
+ border-color: var(--intergalactic-border-info-active, #006dca);
109
107
  }
110
108
 
111
109
  SValue[state='invalid'][keyboardFocused]::before {
112
- box-shadow: var(--keyboard-focus-invalid);
110
+ box-shadow: var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.3));
113
111
  }
114
112
 
115
113
  SControl:checked ~ SValue[theme]::before {
package/lib/es6/Radio.js CHANGED
@@ -31,23 +31,23 @@ var style = (
31
31
  /*__reshadow_css_start__*/
32
32
  _sstyled.insert(
33
33
  /*__inner_css_start__*/
34
- ".___SRadio_1qh5k_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_1qh5k_gg_.__disabled_1qh5k_gg_{opacity:0.3;cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SText_1qh5k_gg_{margin-left:8px}.___SText_1qh5k_gg_._size_m_1qh5k_gg_{font-size:14px;line-height:1.42}.___SText_1qh5k_gg_._size_l_1qh5k_gg_{font-size:16px;line-height:1.5}.___SValue_1qh5k_gg_{position:relative;flex-shrink:0;padding:0;outline:none;z-index:0;margin-top:2px}.___SValue_1qh5k_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:#fff;border:1px solid;border-radius:50%}.___SValue_1qh5k_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0;border-radius:50%;background:#fff}.___SValue_1qh5k_gg_._size_m_1qh5k_gg_{width:16px;height:16px}.___SValue_1qh5k_gg_._size_l_1qh5k_gg_{width:20px;height:20px}.___SValue_1qh5k_gg_._state_normal_1qh5k_gg_:before{border-color:#c4c7cf}.___SValue_1qh5k_gg_._state_invalid_1qh5k_gg_:before{border-color:#ff4953}.___SControl_1qh5k_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_:before{border-color:#008ff8;background-color:#008ff8}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_._size_m_1qh5k_gg_:after{width:6px;height:6px}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_._size_l_1qh5k_gg_:after{width:8px;height:8px}.___SValue_1qh5k_gg_._state_normal_1qh5k_gg_.__keyboardFocused_1qh5k_gg_:before{box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2);border-color:#008ff8}.___SValue_1qh5k_gg_._state_invalid_1qh5k_gg_.__keyboardFocused_1qh5k_gg_:before{box-shadow:0px 0px 0px 3px rgba(255, 73, 83, 0.2)}.___SControl_1qh5k_gg_:checked~.___SValue_1qh5k_gg_.__theme_1qh5k_gg_:before{border-color:var(--theme_1qh5k);background-color:var(--theme_1qh5k)}.___SValue_1qh5k_gg_._state_normal_1qh5k_gg_.__theme_1qh5k_gg_:before{border-color:var(--theme_1qh5k)}"
34
+ ".___SRadio_j28wz_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_j28wz_gg_.__disabled_j28wz_gg_{opacity:var(--intergalactic-disabled-opacity,.3);cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SText_j28wz_gg_{margin-left:var(--intergalactic-spacing-2x,8px)}.___SText_j28wz_gg_._size_m_j28wz_gg_{font-size:var(--intergalactic-fs-200,14px);line-height:var(--intergalactic-lh-200,142%)}.___SText_j28wz_gg_._size_l_j28wz_gg_{font-size:var(--intergalactic-fs-300,16px);line-height:var(--intergalactic-lh-300,150%)}.___SValue_j28wz_gg_{position:relative;flex-shrink:0;padding:0;outline:none;z-index:0;margin-top:var(--intergalactic-spacing-05x,2px)}.___SValue_j28wz_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral,#fff);border:1px solid;border-radius:50%}.___SValue_j28wz_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0;border-radius:50%;background:var(--intergalactic-bg-primary-neutral,#fff)}.___SValue_j28wz_gg_._size_m_j28wz_gg_{width:16px;height:16px}.___SValue_j28wz_gg_._size_l_j28wz_gg_{width:20px;height:20px}.___SValue_j28wz_gg_._state_normal_j28wz_gg_:before{border-color:var(--intergalactic-border-primary,#c4c7cf)}.___SValue_j28wz_gg_._state_invalid_j28wz_gg_:before{border-color:var(--intergalactic-border-danger-active,#d1002f)}.___SControl_j28wz_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_:before{border-color:var(--intergalactic-control-primary-info,#008ff8);background-color:var(--intergalactic-bg-primary-info,#008ff8)}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_._size_m_j28wz_gg_:after{width:6px;height:6px}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_._size_l_j28wz_gg_:after{width:8px;height:8px}.___SValue_j28wz_gg_._state_normal_j28wz_gg_.__keyboardFocused_j28wz_gg_:before{box-shadow:var(--intergalactic-keyboard-focus,0 0 0 3px rgba(0,143,248,.3));border-color:var(--intergalactic-border-info-active,#006dca)}.___SValue_j28wz_gg_._state_invalid_j28wz_gg_.__keyboardFocused_j28wz_gg_:before{box-shadow:var(--intergalactic-keyboard-focus-invalid,0 0 0 3px rgba(255,73,83,.3))}.___SControl_j28wz_gg_:checked~.___SValue_j28wz_gg_.__theme_j28wz_gg_:before{border-color:var(--theme_j28wz);background-color:var(--theme_j28wz)}.___SValue_j28wz_gg_._state_normal_j28wz_gg_.__theme_j28wz_gg_:before{border-color:var(--theme_j28wz)}"
35
35
  /*__inner_css_end__*/
36
- , "1qh5k_gg_")
36
+ , "j28wz_gg_")
37
37
  /*__reshadow_css_end__*/
38
38
  , {
39
- "__SRadio": "___SRadio_1qh5k_gg_",
40
- "_disabled": "__disabled_1qh5k_gg_",
41
- "__SText": "___SText_1qh5k_gg_",
42
- "_size_m": "_size_m_1qh5k_gg_",
43
- "_size_l": "_size_l_1qh5k_gg_",
44
- "__SValue": "___SValue_1qh5k_gg_",
45
- "_state_normal": "_state_normal_1qh5k_gg_",
46
- "_state_invalid": "_state_invalid_1qh5k_gg_",
47
- "__SControl": "___SControl_1qh5k_gg_",
48
- "_keyboardFocused": "__keyboardFocused_1qh5k_gg_",
49
- "_theme": "__theme_1qh5k_gg_",
50
- "--theme": "--theme_1qh5k"
39
+ "__SRadio": "___SRadio_j28wz_gg_",
40
+ "_disabled": "__disabled_j28wz_gg_",
41
+ "__SText": "___SText_j28wz_gg_",
42
+ "_size_m": "_size_m_j28wz_gg_",
43
+ "_size_l": "_size_l_j28wz_gg_",
44
+ "__SValue": "___SValue_j28wz_gg_",
45
+ "_state_normal": "_state_normal_j28wz_gg_",
46
+ "_state_invalid": "_state_invalid_j28wz_gg_",
47
+ "__SControl": "___SControl_j28wz_gg_",
48
+ "_keyboardFocused": "__keyboardFocused_j28wz_gg_",
49
+ "_theme": "__theme_j28wz_gg_",
50
+ "--theme": "--theme_j28wz"
51
51
  });
52
52
 
53
53
  var RadioGroupRoot = /*#__PURE__*/function (_Component) {
package/lib/es6/style/radio.shadow.css CHANGED
@@ -1,5 +1,3 @@
1
- @import '@semcore/utils/style/var.css';
2
-
3
1
  SRadio {
4
2
  display: inline-flex;
5
3
  align-items: flex-start;
@@ -7,24 +5,24 @@ SRadio {
7
5
  }
8
6
 
9
7
  SRadio[disabled] {
10
- opacity: var(--disabled-opacity);
8
+ opacity: var(--intergalactic-disabled-opacity, 0.3);
11
9
  cursor: default;
12
10
  pointer-events: none;
13
11
  user-select: none;
14
12
  }
15
13
 
16
14
  SText {
17
- margin-left: 8px;
15
+ margin-left: var(--intergalactic-spacing-2x, 8px);
18
16
  }
19
17
 
20
18
  SText[size='m'] {
21
- font-size: var(--fs-200);
22
- line-height: var(--lh-200);
19
+ font-size: var(--intergalactic-fs-200, 14px);
20
+ line-height: var(--intergalactic-lh-200, 142%);
23
21
  }
24
22
 
25
23
  SText[size='l'] {
26
- font-size: var(--fs-300);
27
- line-height: var(--lh-300);
24
+ font-size: var(--intergalactic-fs-300, 16px);
25
+ line-height: var(--intergalactic-lh-300, 150%);
28
26
  }
29
27
 
30
28
  SValue {
@@ -34,7 +32,7 @@ SValue {
34
32
  outline: none;
35
33
  z-index: 0;
36
34
 
37
- margin-top: 2px;
35
+ margin-top: var(--intergalactic-spacing-05x, 2px);
38
36
 
39
37
  &::before {
40
38
  content: '';
@@ -43,7 +41,7 @@ SValue {
43
41
  left: 0;
44
42
  right: 0;
45
43
  bottom: 0;
46
- background: #fff;
44
+ background: var(--intergalactic-bg-primary-neutral, #ffffff);
47
45
  border: 1px solid;
48
46
  border-radius: 50%;
49
47
  }
@@ -61,7 +59,7 @@ SValue {
61
59
  width: 0;
62
60
  height: 0;
63
61
  border-radius: 50%;
64
- background: #fff;
62
+ background: var(--intergalactic-bg-primary-neutral, #ffffff);
65
63
  }
66
64
  }
67
65
 
@@ -76,11 +74,11 @@ SValue[size='l'] {
76
74
  }
77
75
 
78
76
  SValue[state='normal']::before {
79
- border-color: var(--gray-200);
77
+ border-color: var(--intergalactic-border-primary, #c4c7cf);
80
78
  }
81
79
 
82
80
  SValue[state='invalid']::before {
83
- border-color: var(--red-400);
81
+ border-color: var(--intergalactic-border-danger-active, #d1002f);
84
82
  }
85
83
 
86
84
  SControl {
@@ -89,8 +87,8 @@ SControl {
89
87
  }
90
88
 
91
89
  SControl:checked ~ SValue::before {
92
- border-color: var(--blue-400);
93
- background-color: var(--blue-400);
90
+ border-color: var(--intergalactic-control-primary-info, #008ff8);
91
+ background-color: var(--intergalactic-bg-primary-info, #008ff8);
94
92
  }
95
93
 
96
94
  SControl:checked ~ SValue[size='m']::after {
@@ -104,12 +102,12 @@ SControl:checked ~ SValue[size='l']::after {
104
102
  }
105
103
 
106
104
  SValue[state='normal'][keyboardFocused]::before {
107
- box-shadow: var(--keyboard-focus);
108
- border-color: var(--blue-400);
105
+ box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.3));
106
+ border-color: var(--intergalactic-border-info-active, #006dca);
109
107
  }
110
108
 
111
109
  SValue[state='invalid'][keyboardFocused]::before {
112
- box-shadow: var(--keyboard-focus-invalid);
110
+ box-shadow: var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.3));
113
111
  }
114
112
 
115
113
  SControl:checked ~ SValue[theme]::before {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/radio",
3
3
  "description": "Semrush Radio Component",
4
- "version": "5.1.4",
4
+ "version": "5.3.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",