@rescui/radio-button 0.8.5 → 0.8.7-RUI-226-Update-card-cn-6e43cc89.60

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 (12) hide show
  1. package/lib/_virtual/index.css.js +12 -7
  2. package/lib/_virtual/warning.js +90 -21
  3. package/lib/index.css +97 -86
  4. package/lib/parts/radio-button-control.js +36 -47
  5. package/lib/parts/radio-button-list.js +24 -38
  6. package/lib/parts/radio-button-manager.js +25 -34
  7. package/lib/parts/radio-button.p.module.css.js +19 -19
  8. package/lib/parts/radio-group-context.js +1 -1
  9. package/lib/public-api.p.css +32 -20
  10. package/lib/public-api.pcss +32 -20
  11. package/lib/radio-button.js +14 -26
  12. package/package.json +9 -9
package/lib/parts/radio-button-list.js CHANGED
@@ -1,56 +1,41 @@
1
- import "core-js/modules/es.object.to-string.js";
2
- import "core-js/modules/web.dom-collections.for-each.js";
3
- import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
4
- import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
5
- import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
6
- import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
7
- import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
- import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
- import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["children", "mode", "disabled", "size", "theme", "error", "className", "style"];
11
-
12
- function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
13
-
14
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
15
-
16
1
  import React from 'react';
17
- import PropTypes from 'prop-types';
18
2
  import cn from 'classnames';
3
+ import PropTypes from 'prop-types';
19
4
  import { Menu } from '@rescui/menu';
20
5
  import { useThemeWithUndefined } from '@rescui/ui-contexts';
21
6
  import WarningIcon from '../_virtual/warning.js';
22
7
  import { RadioButtonManager } from './radio-button-manager.js';
23
8
  import styles from './radio-button.p.module.css.js';
24
- var THEME_STYLES = {
9
+ const THEME_STYLES = {
25
10
  light: styles.themeLight,
26
11
  dark: styles.themeDark
27
12
  };
28
- var SIZE_STYLES = {
13
+ const SIZE_STYLES = {
29
14
  s: styles.listSizeS,
30
15
  m: styles.listSizeM,
31
16
  l: styles.listSizeL
32
17
  };
33
18
 
34
- var RadioButtonList = function RadioButtonList(_ref) {
35
- var children = _ref.children,
36
- _ref$mode = _ref.mode,
37
- mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
38
- disabled = _ref.disabled,
39
- _ref$size = _ref.size,
40
- size = _ref$size === void 0 ? 'm' : _ref$size,
41
- themeFromProps = _ref.theme,
42
- error = _ref.error,
43
- className = _ref.className,
44
- style = _ref.style,
45
- restProps = _objectWithoutProperties(_ref, _excluded);
46
-
47
- var theme = useThemeWithUndefined(themeFromProps);
48
- return /*#__PURE__*/React.createElement(RadioButtonManager, _objectSpread({
19
+ const RadioButtonList = _ref => {
20
+ let {
21
+ children,
22
+ mode = 'classic',
23
+ disabled,
24
+ size = 'm',
25
+ theme: themeFromProps,
26
+ error,
27
+ className,
28
+ style,
29
+ ...restProps
30
+ } = _ref;
31
+ const theme = useThemeWithUndefined(themeFromProps);
32
+ return /*#__PURE__*/React.createElement(RadioButtonManager, {
49
33
  disabled: disabled,
50
34
  size: size,
51
35
  mode: mode,
52
- theme: theme
53
- }, restProps), /*#__PURE__*/React.createElement("div", {
36
+ theme: theme,
37
+ ...restProps
38
+ }, /*#__PURE__*/React.createElement("div", {
54
39
  className: cn(className, styles.container, THEME_STYLES[theme], SIZE_STYLES[size]),
55
40
  style: style
56
41
  }, error && typeof error !== 'boolean' && /*#__PURE__*/React.createElement("div", {
@@ -58,7 +43,8 @@ var RadioButtonList = function RadioButtonList(_ref) {
58
43
  "data-rs-internal": "radio-button-list__error-message"
59
44
  }, /*#__PURE__*/React.createElement(WarningIcon, {
60
45
  "data-rs-internal": "radio-button-list__error-icon",
61
- className: styles.errorIcon
46
+ className: styles.errorIcon,
47
+ "data-render-all-sizes": true
62
48
  }), /*#__PURE__*/React.createElement("span", null, error)), /*#__PURE__*/React.createElement(Menu, {
63
49
  disabled: disabled,
64
50
  theme: theme,
@@ -70,8 +56,8 @@ var RadioButtonList = function RadioButtonList(_ref) {
70
56
  }, children)));
71
57
  };
72
58
 
73
- RadioButtonList.propTypes = _objectSpread(_objectSpread({}, RadioButtonManager.propTypes), {}, {
59
+ RadioButtonList.propTypes = { ...RadioButtonManager.propTypes,
74
60
  error: PropTypes.oneOfType([PropTypes.bool, PropTypes.node]),
75
61
  style: PropTypes.object
76
- });
62
+ };
77
63
  export { RadioButtonList };
package/lib/parts/radio-button-manager.js CHANGED
@@ -1,42 +1,33 @@
1
- import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
2
- import "core-js/modules/es.function.name.js";
3
1
  import React, { useState, useRef, useCallback } from 'react';
4
2
  import PropTypes from 'prop-types';
5
3
  import { useThemeWithUndefined } from '@rescui/ui-contexts';
6
4
  import RadioContext from './radio-group-context.js';
7
5
 
8
- var RadioButtonManager = function RadioButtonManager(_ref) {
9
- var defaultValue = _ref.defaultValue,
10
- children = _ref.children,
11
- valueFromProps = _ref.value,
12
- _ref$disabled = _ref.disabled,
13
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
14
- _ref$error = _ref.error,
15
- error = _ref$error === void 0 ? false : _ref$error,
16
- nameFromProps = _ref.name,
17
- onChange = _ref.onChange,
18
- _ref$size = _ref.size,
19
- size = _ref$size === void 0 ? 'm' : _ref$size,
20
- _ref$mode = _ref.mode,
21
- mode = _ref$mode === void 0 ? 'classic' : _ref$mode,
22
- themeFromProps = _ref.theme;
23
- var theme = useThemeWithUndefined(themeFromProps);
24
- var isControlled = typeof valueFromProps !== 'undefined';
6
+ const RadioButtonManager = _ref => {
7
+ let {
8
+ defaultValue,
9
+ children,
10
+ value: valueFromProps,
11
+ disabled = false,
12
+ error = false,
13
+ name: nameFromProps,
14
+ onChange,
15
+ size = 'm',
16
+ mode = 'classic',
17
+ theme: themeFromProps
18
+ } = _ref;
19
+ const theme = useThemeWithUndefined(themeFromProps);
20
+ const isControlled = typeof valueFromProps !== 'undefined';
21
+ const [value, setValue] = useState(isControlled ? valueFromProps : defaultValue); // set unique id to the component on mount without rerender
25
22
 
26
- var _useState = useState(isControlled ? valueFromProps : defaultValue),
27
- _useState2 = _slicedToArray(_useState, 2),
28
- value = _useState2[0],
29
- setValue = _useState2[1]; // set unique id to the component on mount without rerender
30
-
31
-
32
- var nameId = useRef(null);
23
+ const nameId = useRef(null);
33
24
 
34
25
  if (nameId.current === null) {
35
26
  nameId.current = RadioButtonManager.idCounter++;
36
27
  }
37
28
 
38
- var name = nameFromProps !== null && nameFromProps !== void 0 ? nameFromProps : "_placeholder-radio-name-".concat(nameId.current);
39
- var handleSetValue = useCallback(function (val) {
29
+ const name = nameFromProps ?? `_placeholder-radio-name-${nameId.current}`;
30
+ const handleSetValue = useCallback(val => {
40
31
  setValue(val);
41
32
 
42
33
  if (onChange) {
@@ -45,12 +36,12 @@ var RadioButtonManager = function RadioButtonManager(_ref) {
45
36
  }, [onChange]);
46
37
  return /*#__PURE__*/React.createElement(RadioContext.Provider, {
47
38
  value: {
48
- error: error,
49
- theme: theme,
50
- size: size,
51
- mode: mode,
52
- disabled: disabled,
53
- name: name,
39
+ error,
40
+ theme,
41
+ size,
42
+ mode,
43
+ disabled,
44
+ name,
54
45
  setValue: handleSetValue,
55
46
  value: isControlled ? valueFromProps : value
56
47
  }
package/lib/parts/radio-button.p.module.css.js CHANGED
@@ -1,22 +1,22 @@
1
1
  var styles = {
2
- "themeLight": "_themeLight_e9v4g7_8",
3
- "themeDark": "_themeDark_e9v4g7_11",
4
- "container": "_container_e9v4g7_15",
5
- "listSizeS": "_listSizeS_e9v4g7_20",
6
- "listSizeM": "_listSizeM_e9v4g7_23",
7
- "listSizeL": "_listSizeL_e9v4g7_26",
8
- "sizeS": "_sizeS_e9v4g7_30",
9
- "sizeM": "_sizeM_e9v4g7_33",
10
- "sizeL": "_sizeL_e9v4g7_36",
11
- "classic": "_classic_e9v4g7_40",
12
- "rock": "_rock_e9v4g7_43",
13
- "main": "_main_e9v4g7_47",
14
- "errorMessage": "_errorMessage_e9v4g7_59",
15
- "errorIcon": "_errorIcon_e9v4g7_71",
16
- "input": "_input_e9v4g7_77",
17
- "icon": "_icon_e9v4g7_90",
18
- "enabled": "_enabled_e9v4g7_111",
19
- "disabled": "_disabled_e9v4g7_120",
20
- "error": "_error_e9v4g7_59"
2
+ "themeLight": "_themeLight_6p6zc3_8",
3
+ "themeDark": "_themeDark_6p6zc3_11",
4
+ "container": "_container_6p6zc3_15",
5
+ "listSizeS": "_listSizeS_6p6zc3_20",
6
+ "listSizeM": "_listSizeM_6p6zc3_23",
7
+ "listSizeL": "_listSizeL_6p6zc3_26",
8
+ "sizeS": "_sizeS_6p6zc3_30",
9
+ "sizeM": "_sizeM_6p6zc3_33",
10
+ "sizeL": "_sizeL_6p6zc3_36",
11
+ "classic": "_classic_6p6zc3_40",
12
+ "rock": "_rock_6p6zc3_43",
13
+ "main": "_main_6p6zc3_47",
14
+ "errorMessage": "_errorMessage_6p6zc3_59",
15
+ "errorIcon": "_errorIcon_6p6zc3_71",
16
+ "input": "_input_6p6zc3_77",
17
+ "icon": "_icon_6p6zc3_90",
18
+ "enabled": "_enabled_6p6zc3_111",
19
+ "disabled": "_disabled_6p6zc3_120",
20
+ "error": "_error_6p6zc3_59"
21
21
  };
22
22
  export { styles as default };
package/lib/parts/radio-group-context.js CHANGED
@@ -2,6 +2,6 @@ import { createContext } from 'react';
2
2
  var RadioContext = /*#__PURE__*/createContext({
3
3
  value: '',
4
4
  // eslint-disable-next-line @typescript-eslint/no-empty-function
5
- setValue: function setValue() {}
5
+ setValue: () => {}
6
6
  });
7
7
  export { RadioContext as default };
package/lib/public-api.p.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @define-mixin rs-radio-button-list-size-s{
2
2
  &[class] [data-rs-internal='radio-button-list__error-message']{
3
- --_rs-typography-letter-spacing:normal;
3
+ --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
4
4
  --_rs-typography-text-transform:initial;
5
5
  --_rs-typography-font-variant-numeric:initial;
6
6
  --_rs-typography-font-family:var(
@@ -37,7 +37,7 @@
37
37
  --_rs-menu-mi-icon-offset:8px;
38
38
  --_rs-menu-mi-vertical-padding:6px;
39
39
  --_rs-menu-mi-horizontal-padding:8px;
40
- --_rs-typography-letter-spacing:0.0045em;
40
+ --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
41
41
  --_rs-typography-text-transform:initial;
42
42
  --_rs-typography-font-variant-numeric:initial;
43
43
  --_rs-typography-font-family:var(
@@ -73,7 +73,7 @@
73
73
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__group-header"]{
74
74
  --_rs-menu-gh-vertical-padding:6px;
75
75
  --_rs-menu-gh-horizontal-padding:8px;
76
- --_rs-typography-letter-spacing:normal;
76
+ --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
77
77
  --_rs-typography-text-transform:initial;
78
78
  --_rs-typography-font-variant-numeric:initial;
79
79
  --_rs-typography-font-family:var(
@@ -111,7 +111,7 @@
111
111
  }
112
112
  @define-mixin rs-radio-button-list-size-m{
113
113
  &[class] [data-rs-internal='radio-button-list__error-message']{
114
- --_rs-typography-letter-spacing:normal;
114
+ --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
115
115
  --_rs-typography-text-transform:initial;
116
116
  --_rs-typography-font-variant-numeric:initial;
117
117
  --_rs-typography-font-family:var(
@@ -148,7 +148,7 @@
148
148
  --_rs-menu-mi-icon-offset:8px;
149
149
  --_rs-menu-mi-vertical-padding:8px;
150
150
  --_rs-menu-mi-horizontal-padding:16px;
151
- --_rs-typography-letter-spacing:0.0015em;
151
+ --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
152
152
  --_rs-typography-text-transform:initial;
153
153
  --_rs-typography-font-variant-numeric:initial;
154
154
  --_rs-typography-font-family:var(
@@ -176,20 +176,23 @@
176
176
  --_rs-typography-text-auto-offset:16px;
177
177
  --_rs-typography-ul-list-li-padding-left:22px;
178
178
  --_rs-typography-ol-list-li-padding-left:26px;
179
- --_rs-typography-list-li-margin-top-from-text:16px;
179
+ --_rs-typography-list-li-margin-top-from-text:var(
180
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text,
181
+ 16px
182
+ );
180
183
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
181
184
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
182
185
  --_rs-typography-link-border-bottom-width-from-text:1px;
183
186
  }
184
187
  @media screen and (max-width: 640px){
185
188
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__menu-item"]{
186
- --_rs-typography-list-li-margin-top-from-text:12px;
189
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
187
190
  }
188
191
  }
189
192
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__group-header"]{
190
193
  --_rs-menu-gh-vertical-padding:8px;
191
194
  --_rs-menu-gh-horizontal-padding:16px;
192
- --_rs-typography-letter-spacing:normal;
195
+ --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
193
196
  --_rs-typography-text-transform:initial;
194
197
  --_rs-typography-font-variant-numeric:initial;
195
198
  --_rs-typography-font-family:var(
@@ -227,7 +230,7 @@
227
230
  }
228
231
  @define-mixin rs-radio-button-list-size-l{
229
232
  &[class] [data-rs-internal='radio-button-list__error-message']{
230
- --_rs-typography-letter-spacing:normal;
233
+ --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
231
234
  --_rs-typography-text-transform:initial;
232
235
  --_rs-typography-font-variant-numeric:initial;
233
236
  --_rs-typography-font-family:var(
@@ -264,7 +267,7 @@
264
267
  --_rs-menu-mi-icon-offset:16px;
265
268
  --_rs-menu-mi-vertical-padding:12px;
266
269
  --_rs-menu-mi-horizontal-padding:16px;
267
- --_rs-typography-letter-spacing:normal;
270
+ --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
268
271
  --_rs-typography-text-transform:initial;
269
272
  --_rs-typography-font-variant-numeric:initial;
270
273
  --_rs-typography-font-family:var(
@@ -292,20 +295,23 @@
292
295
  --_rs-typography-text-auto-offset:32px;
293
296
  --_rs-typography-ul-list-li-padding-left:26px;
294
297
  --_rs-typography-ol-list-li-padding-left:32px;
295
- --_rs-typography-list-li-margin-top-from-text:24px;
298
+ --_rs-typography-list-li-margin-top-from-text:var(
299
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text,
300
+ 24px
301
+ );
296
302
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
297
303
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
298
304
  --_rs-typography-link-border-bottom-width-from-text:1px;
299
305
  }
300
306
  @media screen and (max-width: 640px){
301
307
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__menu-item"]{
302
- --_rs-typography-list-li-margin-top-from-text:16px;
308
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
303
309
  }
304
310
  }
305
311
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__group-header"]{
306
312
  --_rs-menu-gh-vertical-padding:12px;
307
313
  --_rs-menu-gh-horizontal-padding:16px;
308
- --_rs-typography-letter-spacing:normal;
314
+ --_rs-typography-letter-spacing:var(--rs-h3-letter-spacing, normal);
309
315
  --_rs-typography-text-transform:initial;
310
316
  --_rs-typography-font-variant-numeric:initial;
311
317
  --_rs-typography-font-family:var(
@@ -360,7 +366,7 @@
360
366
  --_rs-menu-mi-icon-offset:8px;
361
367
  --_rs-menu-mi-vertical-padding:6px;
362
368
  --_rs-menu-mi-horizontal-padding:8px;
363
- --_rs-typography-letter-spacing:0.0045em;
369
+ --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
364
370
  --_rs-typography-text-transform:initial;
365
371
  --_rs-typography-font-variant-numeric:initial;
366
372
  --_rs-typography-font-family:var(
@@ -404,7 +410,7 @@
404
410
  --_rs-menu-mi-icon-offset:8px;
405
411
  --_rs-menu-mi-vertical-padding:8px;
406
412
  --_rs-menu-mi-horizontal-padding:16px;
407
- --_rs-typography-letter-spacing:0.0015em;
413
+ --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
408
414
  --_rs-typography-text-transform:initial;
409
415
  --_rs-typography-font-variant-numeric:initial;
410
416
  --_rs-typography-font-family:var(
@@ -432,14 +438,17 @@
432
438
  --_rs-typography-text-auto-offset:16px;
433
439
  --_rs-typography-ul-list-li-padding-left:22px;
434
440
  --_rs-typography-ol-list-li-padding-left:26px;
435
- --_rs-typography-list-li-margin-top-from-text:16px;
441
+ --_rs-typography-list-li-margin-top-from-text:var(
442
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text,
443
+ 16px
444
+ );
436
445
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
437
446
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
438
447
  --_rs-typography-link-border-bottom-width-from-text:1px;
439
448
  }
440
449
  @media screen and (max-width: 640px){
441
450
  &[class][class]{
442
- --_rs-typography-list-li-margin-top-from-text:12px;
451
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
443
452
  }
444
453
  }
445
454
  & [data-rs-internal="radio-button__control"]{
@@ -453,7 +462,7 @@
453
462
  --_rs-menu-mi-icon-offset:16px;
454
463
  --_rs-menu-mi-vertical-padding:12px;
455
464
  --_rs-menu-mi-horizontal-padding:16px;
456
- --_rs-typography-letter-spacing:normal;
465
+ --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
457
466
  --_rs-typography-text-transform:initial;
458
467
  --_rs-typography-font-variant-numeric:initial;
459
468
  --_rs-typography-font-family:var(
@@ -481,14 +490,17 @@
481
490
  --_rs-typography-text-auto-offset:32px;
482
491
  --_rs-typography-ul-list-li-padding-left:26px;
483
492
  --_rs-typography-ol-list-li-padding-left:32px;
484
- --_rs-typography-list-li-margin-top-from-text:24px;
493
+ --_rs-typography-list-li-margin-top-from-text:var(
494
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text,
495
+ 24px
496
+ );
485
497
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
486
498
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
487
499
  --_rs-typography-link-border-bottom-width-from-text:1px;
488
500
  }
489
501
  @media screen and (max-width: 640px){
490
502
  &[class][class]{
491
- --_rs-typography-list-li-margin-top-from-text:16px;
503
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
492
504
  }
493
505
  }
494
506
  & [data-rs-internal="radio-button__control"]{
package/lib/public-api.pcss CHANGED
@@ -1,6 +1,6 @@
1
1
  @define-mixin rs-radio-button-list-size-s{
2
2
  &[class] [data-rs-internal='radio-button-list__error-message']{
3
- --_rs-typography-letter-spacing:normal;
3
+ --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
4
4
  --_rs-typography-text-transform:initial;
5
5
  --_rs-typography-font-variant-numeric:initial;
6
6
  --_rs-typography-font-family:var(
@@ -37,7 +37,7 @@
37
37
  --_rs-menu-mi-icon-offset:8px;
38
38
  --_rs-menu-mi-vertical-padding:6px;
39
39
  --_rs-menu-mi-horizontal-padding:8px;
40
- --_rs-typography-letter-spacing:0.0045em;
40
+ --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
41
41
  --_rs-typography-text-transform:initial;
42
42
  --_rs-typography-font-variant-numeric:initial;
43
43
  --_rs-typography-font-family:var(
@@ -73,7 +73,7 @@
73
73
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__group-header"]{
74
74
  --_rs-menu-gh-vertical-padding:6px;
75
75
  --_rs-menu-gh-horizontal-padding:8px;
76
- --_rs-typography-letter-spacing:normal;
76
+ --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
77
77
  --_rs-typography-text-transform:initial;
78
78
  --_rs-typography-font-variant-numeric:initial;
79
79
  --_rs-typography-font-family:var(
@@ -111,7 +111,7 @@
111
111
  }
112
112
  @define-mixin rs-radio-button-list-size-m{
113
113
  &[class] [data-rs-internal='radio-button-list__error-message']{
114
- --_rs-typography-letter-spacing:normal;
114
+ --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
115
115
  --_rs-typography-text-transform:initial;
116
116
  --_rs-typography-font-variant-numeric:initial;
117
117
  --_rs-typography-font-family:var(
@@ -148,7 +148,7 @@
148
148
  --_rs-menu-mi-icon-offset:8px;
149
149
  --_rs-menu-mi-vertical-padding:8px;
150
150
  --_rs-menu-mi-horizontal-padding:16px;
151
- --_rs-typography-letter-spacing:0.0015em;
151
+ --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
152
152
  --_rs-typography-text-transform:initial;
153
153
  --_rs-typography-font-variant-numeric:initial;
154
154
  --_rs-typography-font-family:var(
@@ -176,20 +176,23 @@
176
176
  --_rs-typography-text-auto-offset:16px;
177
177
  --_rs-typography-ul-list-li-padding-left:22px;
178
178
  --_rs-typography-ol-list-li-padding-left:26px;
179
- --_rs-typography-list-li-margin-top-from-text:16px;
179
+ --_rs-typography-list-li-margin-top-from-text:var(
180
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text,
181
+ 16px
182
+ );
180
183
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
181
184
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
182
185
  --_rs-typography-link-border-bottom-width-from-text:1px;
183
186
  }
184
187
  @media screen and (max-width: 640px){
185
188
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__menu-item"]{
186
- --_rs-typography-list-li-margin-top-from-text:12px;
189
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
187
190
  }
188
191
  }
189
192
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__group-header"]{
190
193
  --_rs-menu-gh-vertical-padding:8px;
191
194
  --_rs-menu-gh-horizontal-padding:16px;
192
- --_rs-typography-letter-spacing:normal;
195
+ --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
193
196
  --_rs-typography-text-transform:initial;
194
197
  --_rs-typography-font-variant-numeric:initial;
195
198
  --_rs-typography-font-family:var(
@@ -227,7 +230,7 @@
227
230
  }
228
231
  @define-mixin rs-radio-button-list-size-l{
229
232
  &[class] [data-rs-internal='radio-button-list__error-message']{
230
- --_rs-typography-letter-spacing:normal;
233
+ --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
231
234
  --_rs-typography-text-transform:initial;
232
235
  --_rs-typography-font-variant-numeric:initial;
233
236
  --_rs-typography-font-family:var(
@@ -264,7 +267,7 @@
264
267
  --_rs-menu-mi-icon-offset:16px;
265
268
  --_rs-menu-mi-vertical-padding:12px;
266
269
  --_rs-menu-mi-horizontal-padding:16px;
267
- --_rs-typography-letter-spacing:normal;
270
+ --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
268
271
  --_rs-typography-text-transform:initial;
269
272
  --_rs-typography-font-variant-numeric:initial;
270
273
  --_rs-typography-font-family:var(
@@ -292,20 +295,23 @@
292
295
  --_rs-typography-text-auto-offset:32px;
293
296
  --_rs-typography-ul-list-li-padding-left:26px;
294
297
  --_rs-typography-ol-list-li-padding-left:32px;
295
- --_rs-typography-list-li-margin-top-from-text:24px;
298
+ --_rs-typography-list-li-margin-top-from-text:var(
299
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text,
300
+ 24px
301
+ );
296
302
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
297
303
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
298
304
  --_rs-typography-link-border-bottom-width-from-text:1px;
299
305
  }
300
306
  @media screen and (max-width: 640px){
301
307
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__menu-item"]{
302
- --_rs-typography-list-li-margin-top-from-text:16px;
308
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
303
309
  }
304
310
  }
305
311
  & [data-rs-internal="radio-button-list__menu"] [data-rs-internal="menu__group-header"]{
306
312
  --_rs-menu-gh-vertical-padding:12px;
307
313
  --_rs-menu-gh-horizontal-padding:16px;
308
- --_rs-typography-letter-spacing:normal;
314
+ --_rs-typography-letter-spacing:var(--rs-h3-letter-spacing, normal);
309
315
  --_rs-typography-text-transform:initial;
310
316
  --_rs-typography-font-variant-numeric:initial;
311
317
  --_rs-typography-font-family:var(
@@ -360,7 +366,7 @@
360
366
  --_rs-menu-mi-icon-offset:8px;
361
367
  --_rs-menu-mi-vertical-padding:6px;
362
368
  --_rs-menu-mi-horizontal-padding:8px;
363
- --_rs-typography-letter-spacing:0.0045em;
369
+ --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
364
370
  --_rs-typography-text-transform:initial;
365
371
  --_rs-typography-font-variant-numeric:initial;
366
372
  --_rs-typography-font-family:var(
@@ -404,7 +410,7 @@
404
410
  --_rs-menu-mi-icon-offset:8px;
405
411
  --_rs-menu-mi-vertical-padding:8px;
406
412
  --_rs-menu-mi-horizontal-padding:16px;
407
- --_rs-typography-letter-spacing:0.0015em;
413
+ --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
408
414
  --_rs-typography-text-transform:initial;
409
415
  --_rs-typography-font-variant-numeric:initial;
410
416
  --_rs-typography-font-family:var(
@@ -432,14 +438,17 @@
432
438
  --_rs-typography-text-auto-offset:16px;
433
439
  --_rs-typography-ul-list-li-padding-left:22px;
434
440
  --_rs-typography-ol-list-li-padding-left:26px;
435
- --_rs-typography-list-li-margin-top-from-text:16px;
441
+ --_rs-typography-list-li-margin-top-from-text:var(
442
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text,
443
+ 16px
444
+ );
436
445
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
437
446
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
438
447
  --_rs-typography-link-border-bottom-width-from-text:1px;
439
448
  }
440
449
  @media screen and (max-width: 640px){
441
450
  &[class][class]{
442
- --_rs-typography-list-li-margin-top-from-text:12px;
451
+ --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
443
452
  }
444
453
  }
445
454
  & [data-rs-internal="radio-button__control"]{
@@ -453,7 +462,7 @@
453
462
  --_rs-menu-mi-icon-offset:16px;
454
463
  --_rs-menu-mi-vertical-padding:12px;
455
464
  --_rs-menu-mi-horizontal-padding:16px;
456
- --_rs-typography-letter-spacing:normal;
465
+ --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
457
466
  --_rs-typography-text-transform:initial;
458
467
  --_rs-typography-font-variant-numeric:initial;
459
468
  --_rs-typography-font-family:var(
@@ -481,14 +490,17 @@
481
490
  --_rs-typography-text-auto-offset:32px;
482
491
  --_rs-typography-ul-list-li-padding-left:26px;
483
492
  --_rs-typography-ol-list-li-padding-left:32px;
484
- --_rs-typography-list-li-margin-top-from-text:24px;
493
+ --_rs-typography-list-li-margin-top-from-text:var(
494
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text,
495
+ 24px
496
+ );
485
497
  --_rs-typography-link-standalone-border-offset-from-text-base:1.15em;
486
498
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
487
499
  --_rs-typography-link-border-bottom-width-from-text:1px;
488
500
  }
489
501
  @media screen and (max-width: 640px){
490
502
  &[class][class]{
491
- --_rs-typography-list-li-margin-top-from-text:16px;
503
+ --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
492
504
  }
493
505
  }
494
506
  & [data-rs-internal="radio-button__control"]{
package/lib/radio-button.js CHANGED
@@ -1,42 +1,30 @@
1
- import "core-js/modules/es.object.to-string.js";
2
- import "core-js/modules/web.dom-collections.for-each.js";
3
- import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
4
- import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
5
- import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
6
- import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
7
- import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
8
- import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
9
- import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
10
- var _excluded = ["children", "className", "disabled"];
11
-
12
- function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
13
-
14
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? Object.defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
15
-
16
1
  import React from 'react';
17
2
  import PropTypes from 'prop-types';
18
3
  import { MenuItem } from '@rescui/menu';
19
4
  import { RadioButtonControl } from './parts/radio-button-control.js';
20
- var RadioButton = /*#__PURE__*/React.forwardRef(function RadioButton(_ref, ref) {
21
- var children = _ref.children,
22
- className = _ref.className,
23
- disabled = _ref.disabled,
24
- restProps = _objectWithoutProperties(_ref, _excluded);
25
-
5
+ const RadioButton = /*#__PURE__*/React.forwardRef(function RadioButton(_ref, ref) {
6
+ let {
7
+ children,
8
+ className,
9
+ disabled,
10
+ ...restProps
11
+ } = _ref;
26
12
  return /*#__PURE__*/React.createElement(MenuItem, {
27
13
  tag: 'label',
28
14
  disabled: disabled,
29
15
  className: className,
30
16
  tabIndex: null,
31
- icon: /*#__PURE__*/React.createElement(RadioButtonControl, _objectSpread({
17
+ icon: /*#__PURE__*/React.createElement(RadioButtonControl, {
32
18
  ref: ref,
33
19
  disabled: disabled,
34
- notUseLabelTag: true
35
- }, restProps))
20
+ notUseLabelTag: true,
21
+ ...restProps
22
+ })
36
23
  }, children);
37
24
  });
38
- RadioButton.propTypes = _objectSpread(_objectSpread({}, RadioButtonControl.propTypes), {}, {
25
+ RadioButton.propTypes = { ...RadioButtonControl.propTypes,
26
+
39
27
  /** Node or text to show near the input */
40
28
  children: PropTypes.node
41
- });
29
+ };
42
30
  export { RadioButton, RadioButton as default };