@semcore/radio 6.24.2-prerelease.1 → 6.24.3-prerelease.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.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
+ ## [6.24.3] - 2024-04-11
6
+
7
+ ### Fixed
8
+
9
+ - Type of `value` in `Radio` item component.
10
+
5
11
  ## [6.24.2] - 2024-04-10
6
12
 
7
13
  ### Changed
package/lib/cjs/Radio.js CHANGED
@@ -35,22 +35,22 @@ var _typography = require("@semcore/typography");
35
35
  var _excluded = ["size", "state", "theme", "keyboardFocused", "value", "tag", "disabled", "includeInputProps", "resolveColor"],
36
36
  _excluded2 = ["children", "Children"];
37
37
  /*__reshadow-styles__:"./style/radio.shadow.css"*/
38
- var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SRadio_1wqor_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_1wqor_gg_ .___SText_1wqor_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-text-primary, #191b23)}.___SRadio_1wqor_gg_ .___SText_1wqor_gg_.__color_1wqor_gg_{color:var(--color_1wqor)}.___SRadio_1wqor_gg_.__disabled_1wqor_gg_{pointer-events:none}.___SText_1wqor_gg_._size_m_1wqor_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SText_1wqor_gg_._size_l_1wqor_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SValue_1wqor_gg_{position:relative;flex-shrink:0;padding:0;outline:0;z-index:0;margin-top:var(--intergalactic-spacing-05x, 2px)}.___SValue_1wqor_gg_::after,.___SValue_1wqor_gg_::before{content:\"\";position:absolute;right:0;bottom:0;border-radius:50%;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SValue_1wqor_gg_::before{top:0;left:0;border:1px solid;transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___SValue_1wqor_gg_::after{top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0}.___SValue_1wqor_gg_.__disabled_1wqor_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SValue_1wqor_gg_._size_m_1wqor_gg_{width:16px;height:16px}.___SValue_1wqor_gg_._size_l_1wqor_gg_{width:20px;height:20px}.___SValue_1wqor_gg_._state_normal_1wqor_gg_::before{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SValue_1wqor_gg_._state_invalid_1wqor_gg_::before{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SControl_1wqor_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_::before{border-color:var(--intergalactic-control-primary-info, #008ff8);background-color:var(--intergalactic-control-primary-info, #008ff8)}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_._size_m_1wqor_gg_::after{width:6px;height:6px}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_._size_l_1wqor_gg_::after{width:8px;height:8px}.___SValue_1wqor_gg_._state_normal_1wqor_gg_.__keyboardFocused_1wqor_gg_::before{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));border-color:var(--intergalactic-border-info-active, #006dca)}.___SValue_1wqor_gg_._state_invalid_1wqor_gg_.__keyboardFocused_1wqor_gg_::before{box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_.__theme_1wqor_gg_::before{border-color:var(--theme_1wqor);background-color:var(--theme_1wqor)}.___SValue_1wqor_gg_._state_normal_1wqor_gg_.__theme_1wqor_gg_::before{border-color:var(--theme_1wqor)}.___SInvalidPattern_1wqor_gg_{height:calc(100% - 2px);margin:1px 0 1px 1px;border-bottom-left-radius:var(--intergalactic-rounded-large, 12px);border-top-left-radius:var(--intergalactic-rounded-large, 12px)}" /*__inner_css_end__*/, "1wqor_gg_") /*__reshadow_css_end__*/, {
39
- "__SRadio": "___SRadio_1wqor_gg_",
40
- "_disabled": "__disabled_1wqor_gg_",
41
- "__SText": "___SText_1wqor_gg_",
42
- "_size_m": "_size_m_1wqor_gg_",
43
- "_size_l": "_size_l_1wqor_gg_",
44
- "__SValue": "___SValue_1wqor_gg_",
45
- "_state_normal": "_state_normal_1wqor_gg_",
46
- "_state_invalid": "_state_invalid_1wqor_gg_",
47
- "__SControl": "___SControl_1wqor_gg_",
48
- "_keyboardFocused": "__keyboardFocused_1wqor_gg_",
49
- "_theme": "__theme_1wqor_gg_",
50
- "--theme": "--theme_1wqor",
51
- "__SInvalidPattern": "___SInvalidPattern_1wqor_gg_",
52
- "_color": "__color_1wqor_gg_",
53
- "--color": "--color_1wqor"
38
+ var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SRadio_gk0p9_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_gk0p9_gg_ .___SText_gk0p9_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-text-primary, #191b23)}.___SRadio_gk0p9_gg_ .___SText_gk0p9_gg_.__color_gk0p9_gg_{color:var(--color_gk0p9)}.___SRadio_gk0p9_gg_.__disabled_gk0p9_gg_{pointer-events:none}.___SText_gk0p9_gg_._size_m_gk0p9_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SText_gk0p9_gg_._size_l_gk0p9_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SValue_gk0p9_gg_{position:relative;flex-shrink:0;padding:0;outline:0;z-index:0;margin-top:var(--intergalactic-spacing-05x, 2px)}.___SValue_gk0p9_gg_::after,.___SValue_gk0p9_gg_::before{content:\"\";position:absolute;right:0;bottom:0;border-radius:50%;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SValue_gk0p9_gg_::before{top:0;left:0;border:1px solid;transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___SValue_gk0p9_gg_::after{top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0}.___SValue_gk0p9_gg_.__disabled_gk0p9_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SValue_gk0p9_gg_._size_m_gk0p9_gg_{width:16px;height:16px}.___SValue_gk0p9_gg_._size_l_gk0p9_gg_{width:20px;height:20px}.___SValue_gk0p9_gg_._state_normal_gk0p9_gg_::before{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SValue_gk0p9_gg_._state_invalid_gk0p9_gg_::before{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SControl_gk0p9_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_::before{border-color:var(--intergalactic-control-primary-info, #008ff8);background-color:var(--intergalactic-control-primary-info, #008ff8)}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_._size_m_gk0p9_gg_::after{width:6px;height:6px}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_._size_l_gk0p9_gg_::after{width:8px;height:8px}.___SValue_gk0p9_gg_._state_normal_gk0p9_gg_.__keyboardFocused_gk0p9_gg_::before{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));border-color:var(--intergalactic-border-info-active, #006dca)}.___SValue_gk0p9_gg_._state_invalid_gk0p9_gg_.__keyboardFocused_gk0p9_gg_::before{box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_.__theme_gk0p9_gg_::before{border-color:var(--theme_gk0p9);background-color:var(--theme_gk0p9)}.___SValue_gk0p9_gg_._state_normal_gk0p9_gg_.__theme_gk0p9_gg_::before{border-color:var(--theme_gk0p9)}.___SInvalidPattern_gk0p9_gg_{height:calc(100% - 2px);margin:1px 0 1px 1px;border-bottom-left-radius:var(--intergalactic-rounded-large, 12px);border-top-left-radius:var(--intergalactic-rounded-large, 12px)}" /*__inner_css_end__*/, "gk0p9_gg_") /*__reshadow_css_end__*/, {
39
+ "__SRadio": "___SRadio_gk0p9_gg_",
40
+ "_disabled": "__disabled_gk0p9_gg_",
41
+ "__SText": "___SText_gk0p9_gg_",
42
+ "_size_m": "_size_m_gk0p9_gg_",
43
+ "_size_l": "_size_l_gk0p9_gg_",
44
+ "__SValue": "___SValue_gk0p9_gg_",
45
+ "_state_normal": "_state_normal_gk0p9_gg_",
46
+ "_state_invalid": "_state_invalid_gk0p9_gg_",
47
+ "__SControl": "___SControl_gk0p9_gg_",
48
+ "_keyboardFocused": "__keyboardFocused_gk0p9_gg_",
49
+ "_theme": "__theme_gk0p9_gg_",
50
+ "--theme": "--theme_gk0p9",
51
+ "__SInvalidPattern": "___SInvalidPattern_gk0p9_gg_",
52
+ "_color": "__color_gk0p9_gg_",
53
+ "--color": "--color_gk0p9"
54
54
  });
55
55
  var RadioGroupRoot = /*#__PURE__*/function (_Component) {
56
56
  (0, _inherits2["default"])(RadioGroupRoot, _Component);
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps, Flex } from '@semcore/flex-box';\nimport { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport { Text } from '@semcore/typography';\n\nexport type RadioSize = 'm' | 'l';\nexport type RadioState = 'normal' | 'invalid';\nexport type RadioValue = string | number | boolean;\n\n/** @deprecated */\nexport interface IRadioProps extends RadioProps, UnknownProperties {}\nexport type RadioProps = BoxProps & {\n /** Radio item value **/\n value?: string;\n\n /** Radio item checked flag **/\n checked?: boolean;\n\n /**\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * Radio button size\n * @default m\n **/\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Radio item text **/\n label?: string;\n /** Blocks access and changes to the radio item **/\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioGroupProps extends RadioGroupProps, UnknownProperties {\n /**\n * HTML tag name for the displayed item\n */\n tag?: React.ElementType | string;\n}\nexport type RadioGroupProps<T extends RadioValue = RadioValue> = {\n /** Radio group name */\n name?: string;\n /** Active default value */\n defaultValue?: T;\n /** Active value */\n value?: T;\n /** Called when the selected element is changed */\n onChange?:\n | ((value: T, e?: React.SyntheticEvent<HTMLInputElement>) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Radio button size */\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Blocks access and changes to the form field */\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioValueProps extends RadioValueProps, UnknownProperties {}\nexport type RadioValueProps = BoxProps &\n KeyboardFocusProps & {\n /** List of elements that can be put on a hidden input */\n includeInputProps?: string[];\n /**\n * @deprecated set `state` on root Radio instead\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * @deprecated\n * The theme of the radio button that you can send your color to\n */\n theme?: string;\n /**\n * @deprecated set `size` on root RadioGroup instead\n * Radio button size\n */\n size?: RadioSize;\n /**\n * @deprecated set `value` on root Radio instead\n * The element value is required for RadioGroup\n */\n value?: RadioValue;\n /**\n * @deprecated set `defaultValue` on root RadioGroup instead\n * Default value if `value` property is not provided\n */\n defaultValue?: RadioValue;\n /**\n * @deprecated set `onChange` on root RadioGroup instead\n * Called when the value changes\n */\n onChange?: (value: boolean, e?: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * @deprecated set `disabled` on root Radio instead\n * Blocks access and changes to the form field\n */\n disabled?: boolean;\n };\n\n/** @deprecated */\nexport interface IRadioCtx extends RadioCtx, UnknownProperties {}\nexport type RadioCtx = {\n getValueProps: PropGetterFn;\n getTextProps: PropGetterFn;\n};\n\ntype IntergalacticRadioGroupComponent<PropsExtending = {}> = (<\n Value extends RadioValue,\n Tag extends Intergalactic.Tag = typeof Flex,\n>(\n props: Intergalactic.InternalTypings.ComponentProps<Tag, typeof Flex, RadioGroupProps<Value>> &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n Intergalactic.InternalTypings.ComponentAdditive<'div', typeof Flex, RadioGroupProps>;\n\nexport type RadioValueControlProps = {};\nexport type RadioValueMarkProps = {};\n\ndeclare const RadioGroup: IntergalacticRadioGroupComponent;\n\nexport { RadioGroup };\n\ndeclare const Radio: Intergalactic.Component<'label', RadioProps, RadioCtx> & {\n Value: Intergalactic.Component<'input', RadioValueProps> & {\n Control: Intergalactic.Component<'input', RadioValueControlProps>;\n RadioMark: Intergalactic.Component<typeof Box, RadioValueMarkProps>;\n };\n Text: typeof Text;\n};\n\ndeclare const wrapRadioGroup: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticRadioGroupComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticRadioGroupComponent<PropsExtending>;\nexport { wrapRadioGroup };\n\nexport default Radio;\n"],"mappings":""}
1
+ {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps, Flex } from '@semcore/flex-box';\nimport { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport { Text } from '@semcore/typography';\n\nexport type RadioSize = 'm' | 'l';\nexport type RadioState = 'normal' | 'invalid';\nexport type RadioValue = string | number | boolean;\n\n/** @deprecated */\nexport interface IRadioProps extends RadioProps, UnknownProperties {}\nexport type RadioProps = BoxProps & {\n /** Radio item value **/\n value?: RadioValue;\n\n /** Radio item checked flag **/\n checked?: boolean;\n\n /**\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * Radio button size\n * @default m\n **/\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Radio item text **/\n label?: string;\n /** Blocks access and changes to the radio item **/\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioGroupProps extends RadioGroupProps, UnknownProperties {\n /**\n * HTML tag name for the displayed item\n */\n tag?: React.ElementType | string;\n}\nexport type RadioGroupProps<T extends RadioValue = RadioValue> = {\n /** Radio group name */\n name?: string;\n /** Active default value */\n defaultValue?: T;\n /** Active value */\n value?: T;\n /** Called when the selected element is changed */\n onChange?:\n | ((value: T, e?: React.SyntheticEvent<HTMLInputElement>) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Radio button size */\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Blocks access and changes to the form field */\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioValueProps extends RadioValueProps, UnknownProperties {}\nexport type RadioValueProps = BoxProps &\n KeyboardFocusProps & {\n /** List of elements that can be put on a hidden input */\n includeInputProps?: string[];\n /**\n * @deprecated set `state` on root Radio instead\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * @deprecated\n * The theme of the radio button that you can send your color to\n */\n theme?: string;\n /**\n * @deprecated set `size` on root RadioGroup instead\n * Radio button size\n */\n size?: RadioSize;\n /**\n * @deprecated set `value` on root Radio instead\n * The element value is required for RadioGroup\n */\n value?: RadioValue;\n /**\n * @deprecated set `defaultValue` on root RadioGroup instead\n * Default value if `value` property is not provided\n */\n defaultValue?: RadioValue;\n /**\n * @deprecated set `onChange` on root RadioGroup instead\n * Called when the value changes\n */\n onChange?: (value: boolean, e?: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * @deprecated set `disabled` on root Radio instead\n * Blocks access and changes to the form field\n */\n disabled?: boolean;\n };\n\n/** @deprecated */\nexport interface IRadioCtx extends RadioCtx, UnknownProperties {}\nexport type RadioCtx = {\n getValueProps: PropGetterFn;\n getTextProps: PropGetterFn;\n};\n\ntype IntergalacticRadioGroupComponent<PropsExtending = {}> = (<\n Value extends RadioValue,\n Tag extends Intergalactic.Tag = typeof Flex,\n>(\n props: Intergalactic.InternalTypings.ComponentProps<Tag, typeof Flex, RadioGroupProps<Value>> &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n Intergalactic.InternalTypings.ComponentAdditive<'div', typeof Flex, RadioGroupProps>;\n\nexport type RadioValueControlProps = {};\nexport type RadioValueMarkProps = {};\n\ndeclare const RadioGroup: IntergalacticRadioGroupComponent;\n\nexport { RadioGroup };\n\ndeclare const Radio: Intergalactic.Component<'label', RadioProps, RadioCtx> & {\n Value: Intergalactic.Component<'input', RadioValueProps> & {\n Control: Intergalactic.Component<'input', RadioValueControlProps>;\n RadioMark: Intergalactic.Component<typeof Box, RadioValueMarkProps>;\n };\n Text: typeof Text;\n};\n\ndeclare const wrapRadioGroup: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticRadioGroupComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticRadioGroupComponent<PropsExtending>;\nexport { wrapRadioGroup };\n\nexport default Radio;\n"],"mappings":""}
package/lib/es6/Radio.js CHANGED
@@ -24,22 +24,22 @@ import resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance
24
24
  import getInputProps, { inputProps } from '@semcore/utils/lib/inputProps';
25
25
  import { useColorResolver } from '@semcore/utils/lib/use/useColorResolver';
26
26
  /*__reshadow-styles__:"./style/radio.shadow.css"*/
27
- var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SRadio_1wqor_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_1wqor_gg_ .___SText_1wqor_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-text-primary, #191b23)}.___SRadio_1wqor_gg_ .___SText_1wqor_gg_.__color_1wqor_gg_{color:var(--color_1wqor)}.___SRadio_1wqor_gg_.__disabled_1wqor_gg_{pointer-events:none}.___SText_1wqor_gg_._size_m_1wqor_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SText_1wqor_gg_._size_l_1wqor_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SValue_1wqor_gg_{position:relative;flex-shrink:0;padding:0;outline:0;z-index:0;margin-top:var(--intergalactic-spacing-05x, 2px)}.___SValue_1wqor_gg_::after,.___SValue_1wqor_gg_::before{content:\"\";position:absolute;right:0;bottom:0;border-radius:50%;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SValue_1wqor_gg_::before{top:0;left:0;border:1px solid;transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___SValue_1wqor_gg_::after{top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0}.___SValue_1wqor_gg_.__disabled_1wqor_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SValue_1wqor_gg_._size_m_1wqor_gg_{width:16px;height:16px}.___SValue_1wqor_gg_._size_l_1wqor_gg_{width:20px;height:20px}.___SValue_1wqor_gg_._state_normal_1wqor_gg_::before{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SValue_1wqor_gg_._state_invalid_1wqor_gg_::before{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SControl_1wqor_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_::before{border-color:var(--intergalactic-control-primary-info, #008ff8);background-color:var(--intergalactic-control-primary-info, #008ff8)}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_._size_m_1wqor_gg_::after{width:6px;height:6px}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_._size_l_1wqor_gg_::after{width:8px;height:8px}.___SValue_1wqor_gg_._state_normal_1wqor_gg_.__keyboardFocused_1wqor_gg_::before{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));border-color:var(--intergalactic-border-info-active, #006dca)}.___SValue_1wqor_gg_._state_invalid_1wqor_gg_.__keyboardFocused_1wqor_gg_::before{box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SControl_1wqor_gg_:checked~.___SValue_1wqor_gg_.__theme_1wqor_gg_::before{border-color:var(--theme_1wqor);background-color:var(--theme_1wqor)}.___SValue_1wqor_gg_._state_normal_1wqor_gg_.__theme_1wqor_gg_::before{border-color:var(--theme_1wqor)}.___SInvalidPattern_1wqor_gg_{height:calc(100% - 2px);margin:1px 0 1px 1px;border-bottom-left-radius:var(--intergalactic-rounded-large, 12px);border-top-left-radius:var(--intergalactic-rounded-large, 12px)}" /*__inner_css_end__*/, "1wqor_gg_") /*__reshadow_css_end__*/, {
28
- "__SRadio": "___SRadio_1wqor_gg_",
29
- "_disabled": "__disabled_1wqor_gg_",
30
- "__SText": "___SText_1wqor_gg_",
31
- "_size_m": "_size_m_1wqor_gg_",
32
- "_size_l": "_size_l_1wqor_gg_",
33
- "__SValue": "___SValue_1wqor_gg_",
34
- "_state_normal": "_state_normal_1wqor_gg_",
35
- "_state_invalid": "_state_invalid_1wqor_gg_",
36
- "__SControl": "___SControl_1wqor_gg_",
37
- "_keyboardFocused": "__keyboardFocused_1wqor_gg_",
38
- "_theme": "__theme_1wqor_gg_",
39
- "--theme": "--theme_1wqor",
40
- "__SInvalidPattern": "___SInvalidPattern_1wqor_gg_",
41
- "_color": "__color_1wqor_gg_",
42
- "--color": "--color_1wqor"
27
+ var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SRadio_gk0p9_gg_{display:inline-flex;align-items:flex-start;cursor:pointer}.___SRadio_gk0p9_gg_ .___SText_gk0p9_gg_{margin-left:var(--intergalactic-spacing-2x, 8px);color:var(--intergalactic-text-primary, #191b23)}.___SRadio_gk0p9_gg_ .___SText_gk0p9_gg_.__color_gk0p9_gg_{color:var(--color_gk0p9)}.___SRadio_gk0p9_gg_.__disabled_gk0p9_gg_{pointer-events:none}.___SText_gk0p9_gg_._size_m_gk0p9_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SText_gk0p9_gg_._size_l_gk0p9_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SValue_gk0p9_gg_{position:relative;flex-shrink:0;padding:0;outline:0;z-index:0;margin-top:var(--intergalactic-spacing-05x, 2px)}.___SValue_gk0p9_gg_::after,.___SValue_gk0p9_gg_::before{content:\"\";position:absolute;right:0;bottom:0;border-radius:50%;background:var(--intergalactic-bg-primary-neutral, #ffffff)}.___SValue_gk0p9_gg_::before{top:0;left:0;border:1px solid;transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___SValue_gk0p9_gg_::after{top:50%;left:50%;transform:translate(-50%,-50%);width:0;height:0}.___SValue_gk0p9_gg_.__disabled_gk0p9_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.___SValue_gk0p9_gg_._size_m_gk0p9_gg_{width:16px;height:16px}.___SValue_gk0p9_gg_._size_l_gk0p9_gg_{width:20px;height:20px}.___SValue_gk0p9_gg_._state_normal_gk0p9_gg_::before{border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SValue_gk0p9_gg_._state_invalid_gk0p9_gg_::before{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SControl_gk0p9_gg_{position:absolute;clip:rect(1px,1px,1px,1px)}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_::before{border-color:var(--intergalactic-control-primary-info, #008ff8);background-color:var(--intergalactic-control-primary-info, #008ff8)}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_._size_m_gk0p9_gg_::after{width:6px;height:6px}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_._size_l_gk0p9_gg_::after{width:8px;height:8px}.___SValue_gk0p9_gg_._state_normal_gk0p9_gg_.__keyboardFocused_gk0p9_gg_::before{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));border-color:var(--intergalactic-border-info-active, #006dca)}.___SValue_gk0p9_gg_._state_invalid_gk0p9_gg_.__keyboardFocused_gk0p9_gg_::before{box-shadow:var(--intergalactic-keyboard-focus-invalid, 0px 0px 0px 3px rgba(255, 73, 83, 0.5))}.___SControl_gk0p9_gg_:checked~.___SValue_gk0p9_gg_.__theme_gk0p9_gg_::before{border-color:var(--theme_gk0p9);background-color:var(--theme_gk0p9)}.___SValue_gk0p9_gg_._state_normal_gk0p9_gg_.__theme_gk0p9_gg_::before{border-color:var(--theme_gk0p9)}.___SInvalidPattern_gk0p9_gg_{height:calc(100% - 2px);margin:1px 0 1px 1px;border-bottom-left-radius:var(--intergalactic-rounded-large, 12px);border-top-left-radius:var(--intergalactic-rounded-large, 12px)}" /*__inner_css_end__*/, "gk0p9_gg_") /*__reshadow_css_end__*/, {
28
+ "__SRadio": "___SRadio_gk0p9_gg_",
29
+ "_disabled": "__disabled_gk0p9_gg_",
30
+ "__SText": "___SText_gk0p9_gg_",
31
+ "_size_m": "_size_m_gk0p9_gg_",
32
+ "_size_l": "_size_l_gk0p9_gg_",
33
+ "__SValue": "___SValue_gk0p9_gg_",
34
+ "_state_normal": "_state_normal_gk0p9_gg_",
35
+ "_state_invalid": "_state_invalid_gk0p9_gg_",
36
+ "__SControl": "___SControl_gk0p9_gg_",
37
+ "_keyboardFocused": "__keyboardFocused_gk0p9_gg_",
38
+ "_theme": "__theme_gk0p9_gg_",
39
+ "--theme": "--theme_gk0p9",
40
+ "__SInvalidPattern": "___SInvalidPattern_gk0p9_gg_",
41
+ "_color": "__color_gk0p9_gg_",
42
+ "--color": "--color_gk0p9"
43
43
  });
44
44
  import logger from '@semcore/utils/lib/logger';
45
45
  import { Text as TypographyText } from '@semcore/typography';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps, Flex } from '@semcore/flex-box';\nimport { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport { Text } from '@semcore/typography';\n\nexport type RadioSize = 'm' | 'l';\nexport type RadioState = 'normal' | 'invalid';\nexport type RadioValue = string | number | boolean;\n\n/** @deprecated */\nexport interface IRadioProps extends RadioProps, UnknownProperties {}\nexport type RadioProps = BoxProps & {\n /** Radio item value **/\n value?: string;\n\n /** Radio item checked flag **/\n checked?: boolean;\n\n /**\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * Radio button size\n * @default m\n **/\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Radio item text **/\n label?: string;\n /** Blocks access and changes to the radio item **/\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioGroupProps extends RadioGroupProps, UnknownProperties {\n /**\n * HTML tag name for the displayed item\n */\n tag?: React.ElementType | string;\n}\nexport type RadioGroupProps<T extends RadioValue = RadioValue> = {\n /** Radio group name */\n name?: string;\n /** Active default value */\n defaultValue?: T;\n /** Active value */\n value?: T;\n /** Called when the selected element is changed */\n onChange?:\n | ((value: T, e?: React.SyntheticEvent<HTMLInputElement>) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Radio button size */\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Blocks access and changes to the form field */\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioValueProps extends RadioValueProps, UnknownProperties {}\nexport type RadioValueProps = BoxProps &\n KeyboardFocusProps & {\n /** List of elements that can be put on a hidden input */\n includeInputProps?: string[];\n /**\n * @deprecated set `state` on root Radio instead\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * @deprecated\n * The theme of the radio button that you can send your color to\n */\n theme?: string;\n /**\n * @deprecated set `size` on root RadioGroup instead\n * Radio button size\n */\n size?: RadioSize;\n /**\n * @deprecated set `value` on root Radio instead\n * The element value is required for RadioGroup\n */\n value?: RadioValue;\n /**\n * @deprecated set `defaultValue` on root RadioGroup instead\n * Default value if `value` property is not provided\n */\n defaultValue?: RadioValue;\n /**\n * @deprecated set `onChange` on root RadioGroup instead\n * Called when the value changes\n */\n onChange?: (value: boolean, e?: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * @deprecated set `disabled` on root Radio instead\n * Blocks access and changes to the form field\n */\n disabled?: boolean;\n };\n\n/** @deprecated */\nexport interface IRadioCtx extends RadioCtx, UnknownProperties {}\nexport type RadioCtx = {\n getValueProps: PropGetterFn;\n getTextProps: PropGetterFn;\n};\n\ntype IntergalacticRadioGroupComponent<PropsExtending = {}> = (<\n Value extends RadioValue,\n Tag extends Intergalactic.Tag = typeof Flex,\n>(\n props: Intergalactic.InternalTypings.ComponentProps<Tag, typeof Flex, RadioGroupProps<Value>> &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n Intergalactic.InternalTypings.ComponentAdditive<'div', typeof Flex, RadioGroupProps>;\n\nexport type RadioValueControlProps = {};\nexport type RadioValueMarkProps = {};\n\ndeclare const RadioGroup: IntergalacticRadioGroupComponent;\n\nexport { RadioGroup };\n\ndeclare const Radio: Intergalactic.Component<'label', RadioProps, RadioCtx> & {\n Value: Intergalactic.Component<'input', RadioValueProps> & {\n Control: Intergalactic.Component<'input', RadioValueControlProps>;\n RadioMark: Intergalactic.Component<typeof Box, RadioValueMarkProps>;\n };\n Text: typeof Text;\n};\n\ndeclare const wrapRadioGroup: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticRadioGroupComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticRadioGroupComponent<PropsExtending>;\nexport { wrapRadioGroup };\n\nexport default Radio;\n"],"mappings":""}
1
+ {"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps, Flex } from '@semcore/flex-box';\nimport { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport { Text } from '@semcore/typography';\n\nexport type RadioSize = 'm' | 'l';\nexport type RadioState = 'normal' | 'invalid';\nexport type RadioValue = string | number | boolean;\n\n/** @deprecated */\nexport interface IRadioProps extends RadioProps, UnknownProperties {}\nexport type RadioProps = BoxProps & {\n /** Radio item value **/\n value?: RadioValue;\n\n /** Radio item checked flag **/\n checked?: boolean;\n\n /**\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * Radio button size\n * @default m\n **/\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Radio item text **/\n label?: string;\n /** Blocks access and changes to the radio item **/\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioGroupProps extends RadioGroupProps, UnknownProperties {\n /**\n * HTML tag name for the displayed item\n */\n tag?: React.ElementType | string;\n}\nexport type RadioGroupProps<T extends RadioValue = RadioValue> = {\n /** Radio group name */\n name?: string;\n /** Active default value */\n defaultValue?: T;\n /** Active value */\n value?: T;\n /** Called when the selected element is changed */\n onChange?:\n | ((value: T, e?: React.SyntheticEvent<HTMLInputElement>) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Radio button size */\n size?: RadioSize;\n /** The theme of the radio button that you can send your color to */\n theme?: string;\n /** Blocks access and changes to the form field */\n disabled?: boolean;\n};\n\n/** @deprecated */\nexport interface IRadioValueProps extends RadioValueProps, UnknownProperties {}\nexport type RadioValueProps = BoxProps &\n KeyboardFocusProps & {\n /** List of elements that can be put on a hidden input */\n includeInputProps?: string[];\n /**\n * @deprecated set `state` on root Radio instead\n * The value displaying the state of the component\n * @default normal\n */\n state?: RadioState;\n /**\n * @deprecated\n * The theme of the radio button that you can send your color to\n */\n theme?: string;\n /**\n * @deprecated set `size` on root RadioGroup instead\n * Radio button size\n */\n size?: RadioSize;\n /**\n * @deprecated set `value` on root Radio instead\n * The element value is required for RadioGroup\n */\n value?: RadioValue;\n /**\n * @deprecated set `defaultValue` on root RadioGroup instead\n * Default value if `value` property is not provided\n */\n defaultValue?: RadioValue;\n /**\n * @deprecated set `onChange` on root RadioGroup instead\n * Called when the value changes\n */\n onChange?: (value: boolean, e?: React.SyntheticEvent<HTMLInputElement>) => void;\n /**\n * @deprecated set `disabled` on root Radio instead\n * Blocks access and changes to the form field\n */\n disabled?: boolean;\n };\n\n/** @deprecated */\nexport interface IRadioCtx extends RadioCtx, UnknownProperties {}\nexport type RadioCtx = {\n getValueProps: PropGetterFn;\n getTextProps: PropGetterFn;\n};\n\ntype IntergalacticRadioGroupComponent<PropsExtending = {}> = (<\n Value extends RadioValue,\n Tag extends Intergalactic.Tag = typeof Flex,\n>(\n props: Intergalactic.InternalTypings.ComponentProps<Tag, typeof Flex, RadioGroupProps<Value>> &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n Intergalactic.InternalTypings.ComponentAdditive<'div', typeof Flex, RadioGroupProps>;\n\nexport type RadioValueControlProps = {};\nexport type RadioValueMarkProps = {};\n\ndeclare const RadioGroup: IntergalacticRadioGroupComponent;\n\nexport { RadioGroup };\n\ndeclare const Radio: Intergalactic.Component<'label', RadioProps, RadioCtx> & {\n Value: Intergalactic.Component<'input', RadioValueProps> & {\n Control: Intergalactic.Component<'input', RadioValueControlProps>;\n RadioMark: Intergalactic.Component<typeof Box, RadioValueMarkProps>;\n };\n Text: typeof Text;\n};\n\ndeclare const wrapRadioGroup: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticRadioGroupComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticRadioGroupComponent<PropsExtending>;\nexport { wrapRadioGroup };\n\nexport default Radio;\n"],"mappings":""}
@@ -12,7 +12,7 @@ export type RadioValue = string | number | boolean;
12
12
  export interface IRadioProps extends RadioProps, UnknownProperties {}
13
13
  export type RadioProps = BoxProps & {
14
14
  /** Radio item value **/
15
- value?: string;
15
+ value?: RadioValue;
16
16
 
17
17
  /** Radio item checked flag **/
18
18
  checked?: boolean;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/radio",
3
3
  "description": "Semrush Radio Component",
4
- "version": "6.24.2-prerelease.1",
4
+ "version": "6.24.3-prerelease.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -9,12 +9,12 @@
9
9
  "author": "UI-kit team <ui-kit-team@semrush.com>",
10
10
  "license": "MIT",
11
11
  "dependencies": {
12
- "@semcore/utils": "4.22.2-prerelease.1",
13
- "@semcore/flex-box": "5.21.2-prerelease.1",
14
- "@semcore/typography": "5.29.2-prerelease.1"
12
+ "@semcore/utils": "4.23.0-prerelease.0",
13
+ "@semcore/flex-box": "5.22.0-prerelease.0",
14
+ "@semcore/typography": "5.30.0-prerelease.0"
15
15
  },
16
16
  "peerDependencies": {
17
- "@semcore/core": "^2.19.2-prerelease.1",
17
+ "@semcore/core": "^2.20.0-prerelease.0",
18
18
  "react": "16.8 - 18",
19
19
  "react-dom": "16.8 - 18"
20
20
  },