@alfalab/core-components 25.6.0 → 26.0.0

package/progress-bar/modern/index.css

@@ -50,46 +50,46 @@
     /* accent */
     --progressbar-accent-color: var(--color-light-graphic-accent);
 }
-.progress-bar__container_1kjod {
+.progress-bar__container_1orc9 {
     background: var(--progressbar-bg-color);
 
     display: flex;
     overflow: hidden
 }
-.progress-bar__container_1kjod.progress-bar__s_1kjod {
+.progress-bar__container_1orc9.progress-bar__s_1orc9 {
         border-radius: var(--border-radius-s);
         height: 4px;
     }
-.progress-bar__container_1kjod.progress-bar__m_1kjod {
+.progress-bar__container_1orc9.progress-bar__m_1orc9 {
         border-radius: var(--border-radius-m);
         height: 8px;
     }
-.progress-bar__filled_1kjod {
+.progress-bar__filled_1orc9 {
     border-radius: inherit;
     width: 100%;
     transition: transform 0.4s ease
 }
-.progress-bar__filled_1kjod.progress-bar__positive_1kjod {
+.progress-bar__filled_1orc9.progress-bar__positive_1orc9 {
         background: var(--progressbar-positive-color);
     }
-.progress-bar__filled_1kjod.progress-bar__negative_1kjod {
+.progress-bar__filled_1orc9.progress-bar__negative_1orc9 {
         background: var(--progressbar-negative-color);
     }
-.progress-bar__filled_1kjod.progress-bar__attention_1kjod {
+.progress-bar__filled_1orc9.progress-bar__attention_1orc9 {
         background: var(--progressbar-attention-color);
     }
-.progress-bar__filled_1kjod.progress-bar__link_1kjod {
+.progress-bar__filled_1orc9.progress-bar__link_1orc9 {
         background: var(--progressbar-link-color);
     }
-.progress-bar__filled_1kjod.progress-bar__tertiary_1kjod {
+.progress-bar__filled_1orc9.progress-bar__tertiary_1orc9 {
         background: var(--progressbar-tertiary-color);
     }
-.progress-bar__filled_1kjod.progress-bar__secondary_1kjod {
+.progress-bar__filled_1orc9.progress-bar__secondary_1orc9 {
         background: var(--progressbar-secondary-color);
     }
-.progress-bar__filled_1kjod.progress-bar__primary_1kjod {
+.progress-bar__filled_1orc9.progress-bar__primary_1orc9 {
         background: var(--progressbar-primary-color);
     }
-.progress-bar__filled_1kjod.progress-bar__accent_1kjod {
+.progress-bar__filled_1orc9.progress-bar__accent_1orc9 {
         background: var(--progressbar-accent-color);
     }

package/pure-input/Component.js

@@ -50,7 +50,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"input":"pure-input__input_1ofni","hasLabel":"pure-input__hasLabel_1ofni","clearIcon":"pure-input__clearIcon_1ofni","errorIcon":"pure-input__errorIcon_1ofni","successIcon":"pure-input__successIcon_1ofni","error":"pure-input__error_1ofni","component":"pure-input__component_1ofni","block":"pure-input__block_1ofni","s":"pure-input__s_1ofni","m":"pure-input__m_1ofni","l":"pure-input__l_1ofni","xl":"pure-input__xl_1ofni","focusVisible":"pure-input__focusVisible_1ofni"};
+var styles = {"input":"pure-input__input_1ce7a","hasLabel":"pure-input__hasLabel_1ce7a","clearIcon":"pure-input__clearIcon_1ce7a","errorIcon":"pure-input__errorIcon_1ce7a","successIcon":"pure-input__successIcon_1ce7a","error":"pure-input__error_1ce7a","component":"pure-input__component_1ce7a","block":"pure-input__block_1ce7a","s":"pure-input__s_1ce7a","m":"pure-input__m_1ce7a","l":"pure-input__l_1ce7a","xl":"pure-input__xl_1ce7a","focusVisible":"pure-input__focusVisible_1ce7a"};
 require('./index.css');
 
 var PureInput = React__default['default'].forwardRef(function (_a, ref) {

package/pure-input/esm/Component.js

@@ -42,7 +42,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"input":"pure-input__input_1ofni","hasLabel":"pure-input__hasLabel_1ofni","clearIcon":"pure-input__clearIcon_1ofni","errorIcon":"pure-input__errorIcon_1ofni","successIcon":"pure-input__successIcon_1ofni","error":"pure-input__error_1ofni","component":"pure-input__component_1ofni","block":"pure-input__block_1ofni","s":"pure-input__s_1ofni","m":"pure-input__m_1ofni","l":"pure-input__l_1ofni","xl":"pure-input__xl_1ofni","focusVisible":"pure-input__focusVisible_1ofni"};
+var styles = {"input":"pure-input__input_1ce7a","hasLabel":"pure-input__hasLabel_1ce7a","clearIcon":"pure-input__clearIcon_1ce7a","errorIcon":"pure-input__errorIcon_1ce7a","successIcon":"pure-input__successIcon_1ce7a","error":"pure-input__error_1ce7a","component":"pure-input__component_1ce7a","block":"pure-input__block_1ce7a","s":"pure-input__s_1ce7a","m":"pure-input__m_1ce7a","l":"pure-input__l_1ce7a","xl":"pure-input__xl_1ce7a","focusVisible":"pure-input__focusVisible_1ce7a"};
 require('./index.css');
 
 var PureInput = React.forwardRef(function (_a, ref) {

package/pure-input/esm/index.css

@@ -36,51 +36,51 @@
     /* error */
     --input-error-color: var(--color-light-text-primary);
 }
-.pure-input__input_1ofni {
+.pure-input__input_1ce7a {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__input_1ofni:-webkit-autofill {
+.pure-input__input_1ce7a:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
 }
-.pure-input__input_1ofni::placeholder {
+.pure-input__input_1ce7a::placeholder {
     color: var(--input-placeholder-color);
 }
-.pure-input__hasLabel_1ofni::placeholder {
+.pure-input__hasLabel_1ce7a::placeholder {
     color: var(--input-with-label-placeholder-color);
 }
-.pure-input__clearIcon_1ofni {
+.pure-input__clearIcon_1ce7a {
     color: var(--color-light-graphic-primary);
 }
-.pure-input__errorIcon_1ofni {
+.pure-input__errorIcon_1ce7a {
     background-image: var(--input-error-icon);
 }
-.pure-input__successIcon_1ofni {
+.pure-input__successIcon_1ce7a {
     background-image: var(--input-success-icon);
 }
 /* READ-ONLY STATE */
-.pure-input__input_1ofni:read-only {
+.pure-input__input_1ce7a:read-only {
     color: var(--input-read-only-color)
 }
-.pure-input__input_1ofni:read-only:focus::placeholder {
+.pure-input__input_1ce7a:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
     }
 /* DISABLED STATE */
-.pure-input__input_1ofni:disabled {
+.pure-input__input_1ce7a:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
 }
 /* FOCUS STATE */
-.pure-input__input_1ofni:focus::placeholder {
+.pure-input__input_1ce7a:focus::placeholder {
     color: var(--input-focus-placeholder-color);
 }
 /* ERROR STATE */
-.pure-input__error_1ofni {
+.pure-input__error_1ce7a {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }
-.pure-input__component_1ofni {
+.pure-input__component_1ce7a {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -101,56 +101,56 @@
     -webkit-appearance: none;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__component_1ofni::placeholder {
+.pure-input__component_1ce7a::placeholder {
     text-overflow: ellipsis;
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
 }
-.pure-input__block_1ofni {
+.pure-input__block_1ce7a {
     width: 100%;
 }
 /* SIZE */
-.pure-input__s_1ofni {
+.pure-input__s_1ce7a {
     height: var(--form-control-s-min-height);
 }
-.pure-input__m_1ofni {
+.pure-input__m_1ce7a {
     height: var(--form-control-m-min-height);
 }
-.pure-input__l_1ofni {
+.pure-input__l_1ce7a {
     height: var(--form-control-l-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
-.pure-input__xl_1ofni {
+.pure-input__xl_1ce7a {
     height: var(--form-control-xl-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
 /* DISABLED STATE */
-.pure-input__component_1ofni:disabled {
+.pure-input__component_1ce7a:disabled {
     cursor: var(--disabled-cursor);
     color: var(--input-disabled-color);
     border-bottom: var(--form-control-disabled-border-bottom);
     background-color: var(--form-control-disabled-bg-color);
 }
 /* FOCUS STATE */
-.pure-input__component_1ofni:not(:disabled):focus {
+.pure-input__component_1ce7a:not(:disabled):focus {
     border-bottom: var(--form-control-focus-border-bottom);
     box-shadow: var(--form-control-focus-shadow)
 }
-.pure-input__component_1ofni:not(:disabled):focus::placeholder {
+.pure-input__component_1ce7a:not(:disabled):focus::placeholder {
         color: var(--input-focus-placeholder-color);
     }
-.pure-input__focusVisible_1ofni {
+.pure-input__focusVisible_1ce7a {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
 /* HOVER STATE */
-.pure-input__component_1ofni:not(:disabled):hover {
+.pure-input__component_1ce7a:not(:disabled):hover {
     background-color: var(--form-control-hover-bg-color);
 }
 /* IE hide clear */
-.pure-input__component_1ofni::-ms-clear {
+.pure-input__component_1ce7a::-ms-clear {
     display: none;
     width: 0;
     height: 0;

package/pure-input/index.css

@@ -36,51 +36,51 @@
     /* error */
     --input-error-color: var(--color-light-text-primary);
 }
-.pure-input__input_1ofni {
+.pure-input__input_1ce7a {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__input_1ofni:-webkit-autofill {
+.pure-input__input_1ce7a:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
 }
-.pure-input__input_1ofni::placeholder {
+.pure-input__input_1ce7a::placeholder {
     color: var(--input-placeholder-color);
 }
-.pure-input__hasLabel_1ofni::placeholder {
+.pure-input__hasLabel_1ce7a::placeholder {
     color: var(--input-with-label-placeholder-color);
 }
-.pure-input__clearIcon_1ofni {
+.pure-input__clearIcon_1ce7a {
     color: var(--color-light-graphic-primary);
 }
-.pure-input__errorIcon_1ofni {
+.pure-input__errorIcon_1ce7a {
     background-image: var(--input-error-icon);
 }
-.pure-input__successIcon_1ofni {
+.pure-input__successIcon_1ce7a {
     background-image: var(--input-success-icon);
 }
 /* READ-ONLY STATE */
-.pure-input__input_1ofni:read-only {
+.pure-input__input_1ce7a:read-only {
     color: var(--input-read-only-color)
 }
-.pure-input__input_1ofni:read-only:focus::placeholder {
+.pure-input__input_1ce7a:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
     }
 /* DISABLED STATE */
-.pure-input__input_1ofni:disabled {
+.pure-input__input_1ce7a:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
 }
 /* FOCUS STATE */
-.pure-input__input_1ofni:focus::placeholder {
+.pure-input__input_1ce7a:focus::placeholder {
     color: var(--input-focus-placeholder-color);
 }
 /* ERROR STATE */
-.pure-input__error_1ofni {
+.pure-input__error_1ce7a {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }
-.pure-input__component_1ofni {
+.pure-input__component_1ce7a {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -101,56 +101,56 @@
     -webkit-appearance: none;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__component_1ofni::placeholder {
+.pure-input__component_1ce7a::placeholder {
     text-overflow: ellipsis;
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
 }
-.pure-input__block_1ofni {
+.pure-input__block_1ce7a {
     width: 100%;
 }
 /* SIZE */
-.pure-input__s_1ofni {
+.pure-input__s_1ce7a {
     height: var(--form-control-s-min-height);
 }
-.pure-input__m_1ofni {
+.pure-input__m_1ce7a {
     height: var(--form-control-m-min-height);
 }
-.pure-input__l_1ofni {
+.pure-input__l_1ce7a {
     height: var(--form-control-l-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
-.pure-input__xl_1ofni {
+.pure-input__xl_1ce7a {
     height: var(--form-control-xl-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
 /* DISABLED STATE */
-.pure-input__component_1ofni:disabled {
+.pure-input__component_1ce7a:disabled {
     cursor: var(--disabled-cursor);
     color: var(--input-disabled-color);
     border-bottom: var(--form-control-disabled-border-bottom);
     background-color: var(--form-control-disabled-bg-color);
 }
 /* FOCUS STATE */
-.pure-input__component_1ofni:not(:disabled):focus {
+.pure-input__component_1ce7a:not(:disabled):focus {
     border-bottom: var(--form-control-focus-border-bottom);
     box-shadow: var(--form-control-focus-shadow)
 }
-.pure-input__component_1ofni:not(:disabled):focus::placeholder {
+.pure-input__component_1ce7a:not(:disabled):focus::placeholder {
         color: var(--input-focus-placeholder-color);
     }
-.pure-input__focusVisible_1ofni {
+.pure-input__focusVisible_1ce7a {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
 /* HOVER STATE */
-.pure-input__component_1ofni:not(:disabled):hover {
+.pure-input__component_1ce7a:not(:disabled):hover {
     background-color: var(--form-control-hover-bg-color);
 }
 /* IE hide clear */
-.pure-input__component_1ofni::-ms-clear {
+.pure-input__component_1ce7a::-ms-clear {
     display: none;
     width: 0;
     height: 0;

package/pure-input/modern/Component.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import mergeRefs from 'react-merge-refs';
 import { useFocus } from '@alfalab/hooks';
 
-var styles = {"input":"pure-input__input_1ofni","hasLabel":"pure-input__hasLabel_1ofni","clearIcon":"pure-input__clearIcon_1ofni","errorIcon":"pure-input__errorIcon_1ofni","successIcon":"pure-input__successIcon_1ofni","error":"pure-input__error_1ofni","component":"pure-input__component_1ofni","block":"pure-input__block_1ofni","s":"pure-input__s_1ofni","m":"pure-input__m_1ofni","l":"pure-input__l_1ofni","xl":"pure-input__xl_1ofni","focusVisible":"pure-input__focusVisible_1ofni"};
+var styles = {"input":"pure-input__input_1ce7a","hasLabel":"pure-input__hasLabel_1ce7a","clearIcon":"pure-input__clearIcon_1ce7a","errorIcon":"pure-input__errorIcon_1ce7a","successIcon":"pure-input__successIcon_1ce7a","error":"pure-input__error_1ce7a","component":"pure-input__component_1ce7a","block":"pure-input__block_1ce7a","s":"pure-input__s_1ce7a","m":"pure-input__m_1ce7a","l":"pure-input__l_1ce7a","xl":"pure-input__xl_1ce7a","focusVisible":"pure-input__focusVisible_1ce7a"};
 require('./index.css');
 
 const PureInput = React.forwardRef(({ size = 's', type = 'text', block = false, className, dataTestId, ...restProps }, ref) => {

package/pure-input/modern/index.css

@@ -36,51 +36,51 @@
     /* error */
     --input-error-color: var(--color-light-text-primary);
 }
-.pure-input__input_1ofni {
+.pure-input__input_1ce7a {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__input_1ofni:-webkit-autofill {
+.pure-input__input_1ce7a:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
 }
-.pure-input__input_1ofni::placeholder {
+.pure-input__input_1ce7a::placeholder {
     color: var(--input-placeholder-color);
 }
-.pure-input__hasLabel_1ofni::placeholder {
+.pure-input__hasLabel_1ce7a::placeholder {
     color: var(--input-with-label-placeholder-color);
 }
-.pure-input__clearIcon_1ofni {
+.pure-input__clearIcon_1ce7a {
     color: var(--color-light-graphic-primary);
 }
-.pure-input__errorIcon_1ofni {
+.pure-input__errorIcon_1ce7a {
     background-image: var(--input-error-icon);
 }
-.pure-input__successIcon_1ofni {
+.pure-input__successIcon_1ce7a {
     background-image: var(--input-success-icon);
 }
 /* READ-ONLY STATE */
-.pure-input__input_1ofni:read-only {
+.pure-input__input_1ce7a:read-only {
     color: var(--input-read-only-color)
 }
-.pure-input__input_1ofni:read-only:focus::placeholder {
+.pure-input__input_1ce7a:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
     }
 /* DISABLED STATE */
-.pure-input__input_1ofni:disabled {
+.pure-input__input_1ce7a:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
 }
 /* FOCUS STATE */
-.pure-input__input_1ofni:focus::placeholder {
+.pure-input__input_1ce7a:focus::placeholder {
     color: var(--input-focus-placeholder-color);
 }
 /* ERROR STATE */
-.pure-input__error_1ofni {
+.pure-input__error_1ce7a {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }
-.pure-input__component_1ofni {
+.pure-input__component_1ce7a {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -101,56 +101,56 @@
     -webkit-appearance: none;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__component_1ofni::placeholder {
+.pure-input__component_1ce7a::placeholder {
     text-overflow: ellipsis;
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
 }
-.pure-input__block_1ofni {
+.pure-input__block_1ce7a {
     width: 100%;
 }
 /* SIZE */
-.pure-input__s_1ofni {
+.pure-input__s_1ce7a {
     height: var(--form-control-s-min-height);
 }
-.pure-input__m_1ofni {
+.pure-input__m_1ce7a {
     height: var(--form-control-m-min-height);
 }
-.pure-input__l_1ofni {
+.pure-input__l_1ce7a {
     height: var(--form-control-l-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
-.pure-input__xl_1ofni {
+.pure-input__xl_1ce7a {
     height: var(--form-control-xl-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
 /* DISABLED STATE */
-.pure-input__component_1ofni:disabled {
+.pure-input__component_1ce7a:disabled {
     cursor: var(--disabled-cursor);
     color: var(--input-disabled-color);
     border-bottom: var(--form-control-disabled-border-bottom);
     background-color: var(--form-control-disabled-bg-color);
 }
 /* FOCUS STATE */
-.pure-input__component_1ofni:not(:disabled):focus {
+.pure-input__component_1ce7a:not(:disabled):focus {
     border-bottom: var(--form-control-focus-border-bottom);
     box-shadow: var(--form-control-focus-shadow)
 }
-.pure-input__component_1ofni:not(:disabled):focus::placeholder {
+.pure-input__component_1ce7a:not(:disabled):focus::placeholder {
         color: var(--input-focus-placeholder-color);
     }
-.pure-input__focusVisible_1ofni {
+.pure-input__focusVisible_1ce7a {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
 /* HOVER STATE */
-.pure-input__component_1ofni:not(:disabled):hover {
+.pure-input__component_1ce7a:not(:disabled):hover {
     background-color: var(--form-control-hover-bg-color);
 }
 /* IE hide clear */
-.pure-input__component_1ofni::-ms-clear {
+.pure-input__component_1ce7a::-ms-clear {
     display: none;
     width: 0;
     height: 0;

package/radio/Component.d.ts

@@ -40,6 +40,10 @@ type RadioProps = Omit<NativeProps, 'size' | 'type' | 'onChange' | 'checked' | '
      * Класс компонента
      */
     className?: string;
+    /**
+     * Доп. класс радио кнопки
+     */
+    circleClassName?: string;
     /**
      * Выравнивание
      */
@@ -97,6 +101,10 @@ declare const Radio: React.ForwardRefExoticComponent<Pick<NativeProps, "accept"
      * Класс компонента
      */
     className?: string | undefined;
+    /**
+     * Доп. класс радио кнопки
+     */
+    circleClassName?: string | undefined;
     /**
      * Выравнивание
      */

package/radio/Component.js

@@ -50,12 +50,12 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"container":"radio__container_1w2lq","checked":"radio__checked_1w2lq","disabled":"radio__disabled_1w2lq","inactive":"radio__inactive_1w2lq","circle":"radio__circle_1w2lq","label":"radio__label_1w2lq","hint":"radio__hint_1w2lq","focused":"radio__focused_1w2lq","s":"radio__s_1w2lq","content":"radio__content_1w2lq","start":"radio__start_1w2lq","center":"radio__center_1w2lq","addons":"radio__addons_1w2lq","block":"radio__block_1w2lq"};
+var styles = {"container":"radio__container_1wms3","checked":"radio__checked_1wms3","disabled":"radio__disabled_1wms3","inactive":"radio__inactive_1wms3","circle":"radio__circle_1wms3","label":"radio__label_1wms3","hint":"radio__hint_1wms3","focused":"radio__focused_1wms3","s":"radio__s_1wms3","content":"radio__content_1wms3","start":"radio__start_1wms3","center":"radio__center_1wms3","addons":"radio__addons_1wms3","block":"radio__block_1wms3"};
 require('./index.css');
 
 var Radio = React.forwardRef(function (_a, ref) {
     var _b;
-    var onChange = _a.onChange, className = _a.className, name = _a.name, disabled = _a.disabled, inactive = _a.inactive, dataTestId = _a.dataTestId, label = _a.label, checked = _a.checked, hint = _a.hint, _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.align, align = _d === void 0 ? 'start' : _d, addons = _a.addons, block = _a.block, restProps = __rest(_a, ["onChange", "className", "name", "disabled", "inactive", "dataTestId", "label", "checked", "hint", "size", "align", "addons", "block"]);
+    var onChange = _a.onChange, className = _a.className, circleClassName = _a.circleClassName, name = _a.name, disabled = _a.disabled, inactive = _a.inactive, dataTestId = _a.dataTestId, label = _a.label, checked = _a.checked, hint = _a.hint, _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.align, align = _d === void 0 ? 'start' : _d, addons = _a.addons, block = _a.block, restProps = __rest(_a, ["onChange", "className", "circleClassName", "name", "disabled", "inactive", "dataTestId", "label", "checked", "hint", "size", "align", "addons", "block"]);
     var labelRef = React.useRef(null);
     var focused = hooks.useFocus(labelRef, 'keyboard')[0];
     var handleChange = function (event) {
@@ -73,7 +73,7 @@ var Radio = React.forwardRef(function (_a, ref) {
             _b[styles.block] = block,
             _b)), ref: mergeRefs__default['default']([labelRef, ref]) },
         React__default['default'].createElement("input", __assign({ type: 'radio', onChange: handleChange, "data-test-id": dataTestId, disabled: disabled || inactive, checked: checked, name: name }, restProps)),
-        React__default['default'].createElement("span", { className: styles.circle }),
+        React__default['default'].createElement("span", { className: cn__default['default'](styles.circle, circleClassName) }),
         (label || hint) && (React__default['default'].createElement("span", { className: styles.content },
             label && React__default['default'].createElement("span", { className: styles.label }, label),
             hint && React__default['default'].createElement("span", { className: styles.hint }, hint))),

package/radio/cssm/Component.d.ts

@@ -40,6 +40,10 @@ type RadioProps = Omit<NativeProps, 'size' | 'type' | 'onChange' | 'checked' | '
      * Класс компонента
      */
     className?: string;
+    /**
+     * Доп. класс радио кнопки
+     */
+    circleClassName?: string;
     /**
      * Выравнивание
      */
@@ -97,6 +101,10 @@ declare const Radio: React.ForwardRefExoticComponent<Pick<NativeProps, "accept"
      * Класс компонента
      */
     className?: string | undefined;
+    /**
+     * Доп. класс радио кнопки
+     */
+    circleClassName?: string | undefined;
     /**
      * Выравнивание
      */

package/radio/cssm/Component.js

@@ -54,7 +54,7 @@ function __rest(s, e) {
 
 var Radio = React.forwardRef(function (_a, ref) {
     var _b;
-    var onChange = _a.onChange, className = _a.className, name = _a.name, disabled = _a.disabled, inactive = _a.inactive, dataTestId = _a.dataTestId, label = _a.label, checked = _a.checked, hint = _a.hint, _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.align, align = _d === void 0 ? 'start' : _d, addons = _a.addons, block = _a.block, restProps = __rest(_a, ["onChange", "className", "name", "disabled", "inactive", "dataTestId", "label", "checked", "hint", "size", "align", "addons", "block"]);
+    var onChange = _a.onChange, className = _a.className, circleClassName = _a.circleClassName, name = _a.name, disabled = _a.disabled, inactive = _a.inactive, dataTestId = _a.dataTestId, label = _a.label, checked = _a.checked, hint = _a.hint, _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.align, align = _d === void 0 ? 'start' : _d, addons = _a.addons, block = _a.block, restProps = __rest(_a, ["onChange", "className", "circleClassName", "name", "disabled", "inactive", "dataTestId", "label", "checked", "hint", "size", "align", "addons", "block"]);
     var labelRef = React.useRef(null);
     var focused = hooks.useFocus(labelRef, 'keyboard')[0];
     var handleChange = function (event) {
@@ -72,7 +72,7 @@ var Radio = React.forwardRef(function (_a, ref) {
             _b[styles__default['default'].block] = block,
             _b)), ref: mergeRefs__default['default']([labelRef, ref]) },
         React__default['default'].createElement("input", __assign({ type: 'radio', onChange: handleChange, "data-test-id": dataTestId, disabled: disabled || inactive, checked: checked, name: name }, restProps)),
-        React__default['default'].createElement("span", { className: styles__default['default'].circle }),
+        React__default['default'].createElement("span", { className: cn__default['default'](styles__default['default'].circle, circleClassName) }),
         (label || hint) && (React__default['default'].createElement("span", { className: styles__default['default'].content },
             label && React__default['default'].createElement("span", { className: styles__default['default'].label }, label),
             hint && React__default['default'].createElement("span", { className: styles__default['default'].hint }, hint))),

package/radio/esm/Component.d.ts

@@ -40,6 +40,10 @@ type RadioProps = Omit<NativeProps, 'size' | 'type' | 'onChange' | 'checked' | '
      * Класс компонента
      */
     className?: string;
+    /**
+     * Доп. класс радио кнопки
+     */
+    circleClassName?: string;
     /**
      * Выравнивание
      */
@@ -97,6 +101,10 @@ declare const Radio: React.ForwardRefExoticComponent<Pick<NativeProps, "accept"
      * Класс компонента
      */
     className?: string | undefined;
+    /**
+     * Доп. класс радио кнопки
+     */
+    circleClassName?: string | undefined;
     /**
      * Выравнивание
      */

package/radio/esm/Component.js

@@ -42,12 +42,12 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"container":"radio__container_1w2lq","checked":"radio__checked_1w2lq","disabled":"radio__disabled_1w2lq","inactive":"radio__inactive_1w2lq","circle":"radio__circle_1w2lq","label":"radio__label_1w2lq","hint":"radio__hint_1w2lq","focused":"radio__focused_1w2lq","s":"radio__s_1w2lq","content":"radio__content_1w2lq","start":"radio__start_1w2lq","center":"radio__center_1w2lq","addons":"radio__addons_1w2lq","block":"radio__block_1w2lq"};
+var styles = {"container":"radio__container_1wms3","checked":"radio__checked_1wms3","disabled":"radio__disabled_1wms3","inactive":"radio__inactive_1wms3","circle":"radio__circle_1wms3","label":"radio__label_1wms3","hint":"radio__hint_1wms3","focused":"radio__focused_1wms3","s":"radio__s_1wms3","content":"radio__content_1wms3","start":"radio__start_1wms3","center":"radio__center_1wms3","addons":"radio__addons_1wms3","block":"radio__block_1wms3"};
 require('./index.css');
 
 var Radio = forwardRef(function (_a, ref) {
     var _b;
-    var onChange = _a.onChange, className = _a.className, name = _a.name, disabled = _a.disabled, inactive = _a.inactive, dataTestId = _a.dataTestId, label = _a.label, checked = _a.checked, hint = _a.hint, _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.align, align = _d === void 0 ? 'start' : _d, addons = _a.addons, block = _a.block, restProps = __rest(_a, ["onChange", "className", "name", "disabled", "inactive", "dataTestId", "label", "checked", "hint", "size", "align", "addons", "block"]);
+    var onChange = _a.onChange, className = _a.className, circleClassName = _a.circleClassName, name = _a.name, disabled = _a.disabled, inactive = _a.inactive, dataTestId = _a.dataTestId, label = _a.label, checked = _a.checked, hint = _a.hint, _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.align, align = _d === void 0 ? 'start' : _d, addons = _a.addons, block = _a.block, restProps = __rest(_a, ["onChange", "className", "circleClassName", "name", "disabled", "inactive", "dataTestId", "label", "checked", "hint", "size", "align", "addons", "block"]);
     var labelRef = useRef(null);
     var focused = useFocus(labelRef, 'keyboard')[0];
     var handleChange = function (event) {
@@ -65,7 +65,7 @@ var Radio = forwardRef(function (_a, ref) {
             _b[styles.block] = block,
             _b)), ref: mergeRefs([labelRef, ref]) },
         React.createElement("input", __assign({ type: 'radio', onChange: handleChange, "data-test-id": dataTestId, disabled: disabled || inactive, checked: checked, name: name }, restProps)),
-        React.createElement("span", { className: styles.circle }),
+        React.createElement("span", { className: cn(styles.circle, circleClassName) }),
         (label || hint) && (React.createElement("span", { className: styles.content },
             label && React.createElement("span", { className: styles.label }, label),
             hint && React.createElement("span", { className: styles.hint }, hint))),