@alfalab/core-components-radio-group 3.0.5 → 3.0.6

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 (9) hide show
  1. package/Component.js +4 -4
  2. package/cssm/Component.js +3 -3
  3. package/cssm/index.module.css +7 -2
  4. package/esm/Component.js +4 -4
  5. package/esm/index.css +23 -18
  6. package/index.css +23 -18
  7. package/modern/Component.js +4 -3
  8. package/modern/index.css +23 -18
  9. package/package.json +1 -1
package/Component.js CHANGED
@@ -10,7 +10,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
10
10
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
11
11
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
12
12
 
13
- var styles = {"component":"radio-group__component_mw9ie","error":"radio-group__error_mw9ie","radioList":"radio-group__radioList_mw9ie","vertical":"radio-group__vertical_mw9ie","radio":"radio-group__radio_mw9ie","horizontal":"radio-group__horizontal_mw9ie","tag":"radio-group__tag_mw9ie","tagLabel":"radio-group__tagLabel_mw9ie","label":"radio-group__label_mw9ie","sub":"radio-group__sub_mw9ie","errorMessage":"radio-group__errorMessage_mw9ie","hint":"radio-group__hint_mw9ie","hiddenInput":"radio-group__hiddenInput_mw9ie"};
13
+ var styles = {"component":"radio-group__component_1upfw","error":"radio-group__error_1upfw","radioList":"radio-group__radioList_1upfw","vertical":"radio-group__vertical_1upfw","radio":"radio-group__radio_1upfw","horizontal":"radio-group__horizontal_1upfw","tag":"radio-group__tag_1upfw","tagLabel":"radio-group__tagLabel_1upfw","label":"radio-group__label_1upfw","sub":"radio-group__sub_1upfw","errorMessage":"radio-group__errorMessage_1upfw","hint":"radio-group__hint_1upfw","hiddenInput":"radio-group__hiddenInput_1upfw"};
14
14
  require('./index.css')
15
15
 
16
16
  var RadioGroup = React.forwardRef(function (_a, ref) {
@@ -36,10 +36,10 @@ var RadioGroup = React.forwardRef(function (_a, ref) {
36
36
  var renderTag = function (child) {
37
37
  var childValue = child.props.value;
38
38
  var checked = isChecked(childValue);
39
- var clone = React.cloneElement(child, tslib.__assign(tslib.__assign({ onClick: function (event) { return handleChange(event, childValue); }, disabled: disabled }, child.props), { checked: checked, name: name }));
39
+ var clone = React.cloneElement(child, tslib.__assign(tslib.__assign({ onClick: function (event) { return handleChange(event, childValue); }, disabled: disabled }, child.props), { checked: checked, name: name, tabIndex: -1 }));
40
40
  return (React__default.default.createElement("label", { className: cn__default.default(styles.radio, styles.tagLabel) },
41
- clone,
42
- React__default.default.createElement("input", { type: 'radio', autoComplete: 'off', onChange: function (event) { return handleChange(event, childValue); }, disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles.hiddenInput, value: child.props.value })));
41
+ React__default.default.createElement("input", { type: 'radio', autoComplete: 'off', onChange: function (event) { return handleChange(event, childValue); }, disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles.hiddenInput, value: child.props.value }),
42
+ clone));
43
43
  };
44
44
  var errorMessage = typeof error === 'boolean' ? '' : error;
45
45
  return (React__default.default.createElement("div", { className: cn__default.default(styles.component, styles[type], styles[direction], (_b = {}, _b[styles.error] = error, _b), className), "data-test-id": dataTestId, ref: ref },
package/cssm/Component.js CHANGED
@@ -35,10 +35,10 @@ var RadioGroup = React.forwardRef(function (_a, ref) {
35
35
  var renderTag = function (child) {
36
36
  var childValue = child.props.value;
37
37
  var checked = isChecked(childValue);
38
- var clone = React.cloneElement(child, tslib.__assign(tslib.__assign({ onClick: function (event) { return handleChange(event, childValue); }, disabled: disabled }, child.props), { checked: checked, name: name }));
38
+ var clone = React.cloneElement(child, tslib.__assign(tslib.__assign({ onClick: function (event) { return handleChange(event, childValue); }, disabled: disabled }, child.props), { checked: checked, name: name, tabIndex: -1 }));
39
39
  return (React__default.default.createElement("label", { className: cn__default.default(styles__default.default.radio, styles__default.default.tagLabel) },
40
- clone,
41
- React__default.default.createElement("input", { type: 'radio', autoComplete: 'off', onChange: function (event) { return handleChange(event, childValue); }, disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles__default.default.hiddenInput, value: child.props.value })));
40
+ React__default.default.createElement("input", { type: 'radio', autoComplete: 'off', onChange: function (event) { return handleChange(event, childValue); }, disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles__default.default.hiddenInput, value: child.props.value }),
41
+ clone));
42
42
  };
43
43
  var errorMessage = typeof error === 'boolean' ? '' : error;
44
44
  return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.component, styles__default.default[type], styles__default.default[direction], (_b = {}, _b[styles__default.default.error] = error, _b), className), "data-test-id": dataTestId, ref: ref },
package/cssm/index.module.css CHANGED
@@ -1,5 +1,6 @@
1
1
  :root {
2
2
  } /* deprecated */ :root {
3
+ --color-light-border-link: #007aff;
3
4
  --color-light-text-negative: #d91d0b;
4
5
  --color-light-text-primary: #0b1f35;
5
6
  --color-light-text-secondary: rgba(11, 31, 53, 0.7);
@@ -22,6 +23,7 @@
22
23
  --gap-xl-neg: -24px;
23
24
  } :root {
24
25
  } :root {
26
+ --focus-color: var(--color-light-border-link);
25
27
  } :root {
26
28
  --radio-group-error-color: var(--color-light-text-negative);
27
29
  --radio-group-hint-color: var(--color-light-text-secondary);
@@ -72,7 +74,10 @@
72
74
  z-index: -1;
73
75
  top: 0;
74
76
  left: 0;
75
- opacity: 0;
76
- } .tagLabel {
77
+ opacity: 0
78
+ } .hiddenInput:focus ~ button {
79
+ outline: 2px solid var(--focus-color);
80
+ outline-offset: 2px;
81
+ } .tagLabel {
77
82
  position: relative;
78
83
  }
package/esm/Component.js CHANGED
@@ -3,7 +3,7 @@ import React, { forwardRef, useState, Children, isValidElement, cloneElement } f
3
3
  import cn from 'classnames';
4
4
  import { useDidUpdateEffect } from '@alfalab/hooks';
5
5
 
6
- var styles = {"component":"radio-group__component_mw9ie","error":"radio-group__error_mw9ie","radioList":"radio-group__radioList_mw9ie","vertical":"radio-group__vertical_mw9ie","radio":"radio-group__radio_mw9ie","horizontal":"radio-group__horizontal_mw9ie","tag":"radio-group__tag_mw9ie","tagLabel":"radio-group__tagLabel_mw9ie","label":"radio-group__label_mw9ie","sub":"radio-group__sub_mw9ie","errorMessage":"radio-group__errorMessage_mw9ie","hint":"radio-group__hint_mw9ie","hiddenInput":"radio-group__hiddenInput_mw9ie"};
6
+ var styles = {"component":"radio-group__component_1upfw","error":"radio-group__error_1upfw","radioList":"radio-group__radioList_1upfw","vertical":"radio-group__vertical_1upfw","radio":"radio-group__radio_1upfw","horizontal":"radio-group__horizontal_1upfw","tag":"radio-group__tag_1upfw","tagLabel":"radio-group__tagLabel_1upfw","label":"radio-group__label_1upfw","sub":"radio-group__sub_1upfw","errorMessage":"radio-group__errorMessage_1upfw","hint":"radio-group__hint_1upfw","hiddenInput":"radio-group__hiddenInput_1upfw"};
7
7
  require('./index.css')
8
8
 
9
9
  var RadioGroup = forwardRef(function (_a, ref) {
@@ -29,10 +29,10 @@ var RadioGroup = forwardRef(function (_a, ref) {
29
29
  var renderTag = function (child) {
30
30
  var childValue = child.props.value;
31
31
  var checked = isChecked(childValue);
32
- var clone = cloneElement(child, __assign(__assign({ onClick: function (event) { return handleChange(event, childValue); }, disabled: disabled }, child.props), { checked: checked, name: name }));
32
+ var clone = cloneElement(child, __assign(__assign({ onClick: function (event) { return handleChange(event, childValue); }, disabled: disabled }, child.props), { checked: checked, name: name, tabIndex: -1 }));
33
33
  return (React.createElement("label", { className: cn(styles.radio, styles.tagLabel) },
34
- clone,
35
- React.createElement("input", { type: 'radio', autoComplete: 'off', onChange: function (event) { return handleChange(event, childValue); }, disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles.hiddenInput, value: child.props.value })));
34
+ React.createElement("input", { type: 'radio', autoComplete: 'off', onChange: function (event) { return handleChange(event, childValue); }, disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles.hiddenInput, value: child.props.value }),
35
+ clone));
36
36
  };
37
37
  var errorMessage = typeof error === 'boolean' ? '' : error;
38
38
  return (React.createElement("div", { className: cn(styles.component, styles[type], styles[direction], (_b = {}, _b[styles.error] = error, _b), className), "data-test-id": dataTestId, ref: ref },
package/esm/index.css CHANGED
@@ -1,6 +1,7 @@
1
- /* hash: 1xnam */
1
+ /* hash: 1tg4l */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
+ --color-light-border-link: #007aff;
4
5
  --color-light-text-negative: #d91d0b;
5
6
  --color-light-text-primary: #0b1f35;
6
7
  --color-light-text-secondary: rgba(11, 31, 53, 0.7);
@@ -23,57 +24,61 @@
23
24
  --gap-xl-neg: -24px;
24
25
  } :root {
25
26
  } :root {
27
+ --focus-color: var(--color-light-border-link);
26
28
  } :root {
27
29
  --radio-group-error-color: var(--color-light-text-negative);
28
30
  --radio-group-hint-color: var(--color-light-text-secondary);
29
31
  --radio-group-label-color: var(--color-light-text-primary);
30
- } .radio-group__component_mw9ie {
32
+ } .radio-group__component_1upfw {
31
33
  display: flex;
32
34
  flex-direction: column;
33
- } .radio-group__error_mw9ie {
35
+ } .radio-group__error_1upfw {
34
36
  padding-left: var(--gap-xs);
35
37
  border-left: 1px solid var(--radio-group-error-color);
36
- } .radio-group__radioList_mw9ie {
38
+ } .radio-group__radioList_1upfw {
37
39
  display: flex;
38
- } .radio-group__vertical_mw9ie .radio-group__radioList_mw9ie {
40
+ } .radio-group__vertical_1upfw .radio-group__radioList_1upfw {
39
41
  flex-direction: column;
40
42
  align-items: flex-start;
41
- } .radio-group__vertical_mw9ie .radio-group__radio_mw9ie {
43
+ } .radio-group__vertical_1upfw .radio-group__radio_1upfw {
42
44
  margin-bottom: var(--gap-m)
43
- } .radio-group__vertical_mw9ie .radio-group__radio_mw9ie:last-child {
45
+ } .radio-group__vertical_1upfw .radio-group__radio_1upfw:last-child {
44
46
  margin-bottom: 0;
45
- } .radio-group__horizontal_mw9ie .radio-group__radioList_mw9ie {
47
+ } .radio-group__horizontal_1upfw .radio-group__radioList_1upfw {
46
48
  flex-wrap: wrap;
47
49
  margin-right: var(--gap-xl-neg);
48
50
  margin-bottom: var(--gap-xs-neg);
49
- } .radio-group__tag_mw9ie.radio-group__horizontal_mw9ie .radio-group__radioList_mw9ie {
51
+ } .radio-group__tag_1upfw.radio-group__horizontal_1upfw .radio-group__radioList_1upfw {
50
52
  margin-right: var(--gap-xs-neg);
51
- } .radio-group__horizontal_mw9ie .radio-group__radio_mw9ie {
53
+ } .radio-group__horizontal_1upfw .radio-group__radio_1upfw {
52
54
  margin-right: var(--gap-xl);
53
55
  margin-bottom: var(--gap-xs);
54
- } .radio-group__horizontal_mw9ie .radio-group__tagLabel_mw9ie {
56
+ } .radio-group__horizontal_1upfw .radio-group__tagLabel_1upfw {
55
57
  margin-right: var(--gap-xs);
56
- } .radio-group__label_mw9ie {
58
+ } .radio-group__label_1upfw {
57
59
  font-size: 16px;
58
60
  line-height: 24px;
59
61
  font-weight: 400;
60
62
  margin-bottom: var(--gap-s);
61
63
  color: var(--radio-group-label-color);
62
- } .radio-group__sub_mw9ie {
64
+ } .radio-group__sub_1upfw {
63
65
  font-size: 14px;
64
66
  line-height: 18px;
65
67
  font-weight: 400;
66
68
  margin-top: var(--gap-s);
67
- } .radio-group__errorMessage_mw9ie {
69
+ } .radio-group__errorMessage_1upfw {
68
70
  color: var(--radio-group-error-color);
69
- } .radio-group__hint_mw9ie {
71
+ } .radio-group__hint_1upfw {
70
72
  color: var(--radio-group-hint-color);
71
- } .radio-group__hiddenInput_mw9ie {
73
+ } .radio-group__hiddenInput_1upfw {
72
74
  position: absolute;
73
75
  z-index: -1;
74
76
  top: 0;
75
77
  left: 0;
76
- opacity: 0;
77
- } .radio-group__tagLabel_mw9ie {
78
+ opacity: 0
79
+ } .radio-group__hiddenInput_1upfw:focus ~ button {
80
+ outline: 2px solid var(--focus-color);
81
+ outline-offset: 2px;
82
+ } .radio-group__tagLabel_1upfw {
78
83
  position: relative;
79
84
  }
package/index.css CHANGED
@@ -1,6 +1,7 @@
1
- /* hash: 1xnam */
1
+ /* hash: 1tg4l */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
+ --color-light-border-link: #007aff;
4
5
  --color-light-text-negative: #d91d0b;
5
6
  --color-light-text-primary: #0b1f35;
6
7
  --color-light-text-secondary: rgba(11, 31, 53, 0.7);
@@ -23,57 +24,61 @@
23
24
  --gap-xl-neg: -24px;
24
25
  } :root {
25
26
  } :root {
27
+ --focus-color: var(--color-light-border-link);
26
28
  } :root {
27
29
  --radio-group-error-color: var(--color-light-text-negative);
28
30
  --radio-group-hint-color: var(--color-light-text-secondary);
29
31
  --radio-group-label-color: var(--color-light-text-primary);
30
- } .radio-group__component_mw9ie {
32
+ } .radio-group__component_1upfw {
31
33
  display: flex;
32
34
  flex-direction: column;
33
- } .radio-group__error_mw9ie {
35
+ } .radio-group__error_1upfw {
34
36
  padding-left: var(--gap-xs);
35
37
  border-left: 1px solid var(--radio-group-error-color);
36
- } .radio-group__radioList_mw9ie {
38
+ } .radio-group__radioList_1upfw {
37
39
  display: flex;
38
- } .radio-group__vertical_mw9ie .radio-group__radioList_mw9ie {
40
+ } .radio-group__vertical_1upfw .radio-group__radioList_1upfw {
39
41
  flex-direction: column;
40
42
  align-items: flex-start;
41
- } .radio-group__vertical_mw9ie .radio-group__radio_mw9ie {
43
+ } .radio-group__vertical_1upfw .radio-group__radio_1upfw {
42
44
  margin-bottom: var(--gap-m)
43
- } .radio-group__vertical_mw9ie .radio-group__radio_mw9ie:last-child {
45
+ } .radio-group__vertical_1upfw .radio-group__radio_1upfw:last-child {
44
46
  margin-bottom: 0;
45
- } .radio-group__horizontal_mw9ie .radio-group__radioList_mw9ie {
47
+ } .radio-group__horizontal_1upfw .radio-group__radioList_1upfw {
46
48
  flex-wrap: wrap;
47
49
  margin-right: var(--gap-xl-neg);
48
50
  margin-bottom: var(--gap-xs-neg);
49
- } .radio-group__tag_mw9ie.radio-group__horizontal_mw9ie .radio-group__radioList_mw9ie {
51
+ } .radio-group__tag_1upfw.radio-group__horizontal_1upfw .radio-group__radioList_1upfw {
50
52
  margin-right: var(--gap-xs-neg);
51
- } .radio-group__horizontal_mw9ie .radio-group__radio_mw9ie {
53
+ } .radio-group__horizontal_1upfw .radio-group__radio_1upfw {
52
54
  margin-right: var(--gap-xl);
53
55
  margin-bottom: var(--gap-xs);
54
- } .radio-group__horizontal_mw9ie .radio-group__tagLabel_mw9ie {
56
+ } .radio-group__horizontal_1upfw .radio-group__tagLabel_1upfw {
55
57
  margin-right: var(--gap-xs);
56
- } .radio-group__label_mw9ie {
58
+ } .radio-group__label_1upfw {
57
59
  font-size: 16px;
58
60
  line-height: 24px;
59
61
  font-weight: 400;
60
62
  margin-bottom: var(--gap-s);
61
63
  color: var(--radio-group-label-color);
62
- } .radio-group__sub_mw9ie {
64
+ } .radio-group__sub_1upfw {
63
65
  font-size: 14px;
64
66
  line-height: 18px;
65
67
  font-weight: 400;
66
68
  margin-top: var(--gap-s);
67
- } .radio-group__errorMessage_mw9ie {
69
+ } .radio-group__errorMessage_1upfw {
68
70
  color: var(--radio-group-error-color);
69
- } .radio-group__hint_mw9ie {
71
+ } .radio-group__hint_1upfw {
70
72
  color: var(--radio-group-hint-color);
71
- } .radio-group__hiddenInput_mw9ie {
73
+ } .radio-group__hiddenInput_1upfw {
72
74
  position: absolute;
73
75
  z-index: -1;
74
76
  top: 0;
75
77
  left: 0;
76
- opacity: 0;
77
- } .radio-group__tagLabel_mw9ie {
78
+ opacity: 0
79
+ } .radio-group__hiddenInput_1upfw:focus ~ button {
80
+ outline: 2px solid var(--focus-color);
81
+ outline-offset: 2px;
82
+ } .radio-group__tagLabel_1upfw {
78
83
  position: relative;
79
84
  }
package/modern/Component.js CHANGED
@@ -2,7 +2,7 @@ import React, { forwardRef, useState, Children, isValidElement, cloneElement } f
2
2
  import cn from 'classnames';
3
3
  import { useDidUpdateEffect } from '@alfalab/hooks';
4
4
 
5
- const styles = {"component":"radio-group__component_mw9ie","error":"radio-group__error_mw9ie","radioList":"radio-group__radioList_mw9ie","vertical":"radio-group__vertical_mw9ie","radio":"radio-group__radio_mw9ie","horizontal":"radio-group__horizontal_mw9ie","tag":"radio-group__tag_mw9ie","tagLabel":"radio-group__tagLabel_mw9ie","label":"radio-group__label_mw9ie","sub":"radio-group__sub_mw9ie","errorMessage":"radio-group__errorMessage_mw9ie","hint":"radio-group__hint_mw9ie","hiddenInput":"radio-group__hiddenInput_mw9ie"};
5
+ const styles = {"component":"radio-group__component_1upfw","error":"radio-group__error_1upfw","radioList":"radio-group__radioList_1upfw","vertical":"radio-group__vertical_1upfw","radio":"radio-group__radio_1upfw","horizontal":"radio-group__horizontal_1upfw","tag":"radio-group__tag_1upfw","tagLabel":"radio-group__tagLabel_1upfw","label":"radio-group__label_1upfw","sub":"radio-group__sub_1upfw","errorMessage":"radio-group__errorMessage_1upfw","hint":"radio-group__hint_1upfw","hiddenInput":"radio-group__hiddenInput_1upfw"};
6
6
  require('./index.css')
7
7
 
8
8
  const RadioGroup = forwardRef(({ children, className, direction = 'vertical', label, error, hint, onChange, onBlur, onFocus, type = 'radio', dataTestId, disabled = false, name, value, }, ref) => {
@@ -37,10 +37,11 @@ const RadioGroup = forwardRef(({ children, className, direction = 'vertical', la
37
37
  ...child.props,
38
38
  checked,
39
39
  name,
40
+ tabIndex: -1,
40
41
  });
41
42
  return (React.createElement("label", { className: cn(styles.radio, styles.tagLabel) },
42
- clone,
43
- React.createElement("input", { type: 'radio', autoComplete: 'off', onChange: (event) => handleChange(event, childValue), disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles.hiddenInput, value: child.props.value })));
43
+ React.createElement("input", { type: 'radio', autoComplete: 'off', onChange: (event) => handleChange(event, childValue), disabled: disabled || child.props.disabled, name: name, checked: checked, className: styles.hiddenInput, value: child.props.value }),
44
+ clone));
44
45
  };
45
46
  const errorMessage = typeof error === 'boolean' ? '' : error;
46
47
  return (React.createElement("div", { className: cn(styles.component, styles[type], styles[direction], { [styles.error]: error }, className), "data-test-id": dataTestId, ref: ref },
package/modern/index.css CHANGED
@@ -1,6 +1,7 @@
1
- /* hash: 1xnam */
1
+ /* hash: 1tg4l */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
+ --color-light-border-link: #007aff;
4
5
  --color-light-text-negative: #d91d0b;
5
6
  --color-light-text-primary: #0b1f35;
6
7
  --color-light-text-secondary: rgba(11, 31, 53, 0.7);
@@ -23,57 +24,61 @@
23
24
  --gap-xl-neg: -24px;
24
25
  } :root {
25
26
  } :root {
27
+ --focus-color: var(--color-light-border-link);
26
28
  } :root {
27
29
  --radio-group-error-color: var(--color-light-text-negative);
28
30
  --radio-group-hint-color: var(--color-light-text-secondary);
29
31
  --radio-group-label-color: var(--color-light-text-primary);
30
- } .radio-group__component_mw9ie {
32
+ } .radio-group__component_1upfw {
31
33
  display: flex;
32
34
  flex-direction: column;
33
- } .radio-group__error_mw9ie {
35
+ } .radio-group__error_1upfw {
34
36
  padding-left: var(--gap-xs);
35
37
  border-left: 1px solid var(--radio-group-error-color);
36
- } .radio-group__radioList_mw9ie {
38
+ } .radio-group__radioList_1upfw {
37
39
  display: flex;
38
- } .radio-group__vertical_mw9ie .radio-group__radioList_mw9ie {
40
+ } .radio-group__vertical_1upfw .radio-group__radioList_1upfw {
39
41
  flex-direction: column;
40
42
  align-items: flex-start;
41
- } .radio-group__vertical_mw9ie .radio-group__radio_mw9ie {
43
+ } .radio-group__vertical_1upfw .radio-group__radio_1upfw {
42
44
  margin-bottom: var(--gap-m)
43
- } .radio-group__vertical_mw9ie .radio-group__radio_mw9ie:last-child {
45
+ } .radio-group__vertical_1upfw .radio-group__radio_1upfw:last-child {
44
46
  margin-bottom: 0;
45
- } .radio-group__horizontal_mw9ie .radio-group__radioList_mw9ie {
47
+ } .radio-group__horizontal_1upfw .radio-group__radioList_1upfw {
46
48
  flex-wrap: wrap;
47
49
  margin-right: var(--gap-xl-neg);
48
50
  margin-bottom: var(--gap-xs-neg);
49
- } .radio-group__tag_mw9ie.radio-group__horizontal_mw9ie .radio-group__radioList_mw9ie {
51
+ } .radio-group__tag_1upfw.radio-group__horizontal_1upfw .radio-group__radioList_1upfw {
50
52
  margin-right: var(--gap-xs-neg);
51
- } .radio-group__horizontal_mw9ie .radio-group__radio_mw9ie {
53
+ } .radio-group__horizontal_1upfw .radio-group__radio_1upfw {
52
54
  margin-right: var(--gap-xl);
53
55
  margin-bottom: var(--gap-xs);
54
- } .radio-group__horizontal_mw9ie .radio-group__tagLabel_mw9ie {
56
+ } .radio-group__horizontal_1upfw .radio-group__tagLabel_1upfw {
55
57
  margin-right: var(--gap-xs);
56
- } .radio-group__label_mw9ie {
58
+ } .radio-group__label_1upfw {
57
59
  font-size: 16px;
58
60
  line-height: 24px;
59
61
  font-weight: 400;
60
62
  margin-bottom: var(--gap-s);
61
63
  color: var(--radio-group-label-color);
62
- } .radio-group__sub_mw9ie {
64
+ } .radio-group__sub_1upfw {
63
65
  font-size: 14px;
64
66
  line-height: 18px;
65
67
  font-weight: 400;
66
68
  margin-top: var(--gap-s);
67
- } .radio-group__errorMessage_mw9ie {
69
+ } .radio-group__errorMessage_1upfw {
68
70
  color: var(--radio-group-error-color);
69
- } .radio-group__hint_mw9ie {
71
+ } .radio-group__hint_1upfw {
70
72
  color: var(--radio-group-hint-color);
71
- } .radio-group__hiddenInput_mw9ie {
73
+ } .radio-group__hiddenInput_1upfw {
72
74
  position: absolute;
73
75
  z-index: -1;
74
76
  top: 0;
75
77
  left: 0;
76
- opacity: 0;
77
- } .radio-group__tagLabel_mw9ie {
78
+ opacity: 0
79
+ } .radio-group__hiddenInput_1upfw:focus ~ button {
80
+ outline: 2px solid var(--focus-color);
81
+ outline-offset: 2px;
82
+ } .radio-group__tagLabel_1upfw {
78
83
  position: relative;
79
84
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-radio-group",
3
- "version": "3.0.5",
3
+ "version": "3.0.6",
4
4
  "description": "Radio group",
5
5
  "keywords": [],
6
6
  "license": "MIT",