@alfalab/core-components 27.6.1 → 27.7.1-beta.0

package/pure-input/index.css

@@ -36,51 +36,51 @@
     /* error */
     --input-error-color: var(--color-light-text-primary);
 }
-.pure-input__input_gbxzm {
+.pure-input__input_1hrrb {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__input_gbxzm:-webkit-autofill {
+.pure-input__input_1hrrb:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
 }
-.pure-input__input_gbxzm::placeholder {
+.pure-input__input_1hrrb::placeholder {
     color: var(--input-placeholder-color);
 }
-.pure-input__hasLabel_gbxzm::placeholder {
+.pure-input__hasLabel_1hrrb::placeholder {
     color: var(--input-with-label-placeholder-color);
 }
-.pure-input__clearIcon_gbxzm {
+.pure-input__clearIcon_1hrrb {
     color: var(--color-light-graphic-primary);
 }
-.pure-input__errorIcon_gbxzm {
+.pure-input__errorIcon_1hrrb {
     background-image: var(--input-error-icon);
 }
-.pure-input__successIcon_gbxzm {
+.pure-input__successIcon_1hrrb {
     background-image: var(--input-success-icon);
 }
 /* READ-ONLY STATE */
-.pure-input__input_gbxzm:read-only {
+.pure-input__input_1hrrb:read-only {
     color: var(--input-read-only-color)
 }
-.pure-input__input_gbxzm:read-only:focus::placeholder {
+.pure-input__input_1hrrb:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
     }
 /* DISABLED STATE */
-.pure-input__input_gbxzm:disabled {
+.pure-input__input_1hrrb:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
 }
 /* FOCUS STATE */
-.pure-input__input_gbxzm:focus::placeholder {
+.pure-input__input_1hrrb:focus::placeholder {
     color: var(--input-focus-placeholder-color);
 }
 /* ERROR STATE */
-.pure-input__error_gbxzm {
+.pure-input__error_1hrrb {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }
-.pure-input__component_gbxzm {
+.pure-input__component_1hrrb {
     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_gbxzm::placeholder {
+.pure-input__component_1hrrb::placeholder {
     text-overflow: ellipsis;
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
 }
-.pure-input__block_gbxzm {
+.pure-input__block_1hrrb {
     width: 100%;
 }
 /* SIZE */
-.pure-input__s_gbxzm {
+.pure-input__s_1hrrb {
     height: var(--form-control-s-min-height);
 }
-.pure-input__m_gbxzm {
+.pure-input__m_1hrrb {
     height: var(--form-control-m-min-height);
 }
-.pure-input__l_gbxzm {
+.pure-input__l_1hrrb {
     height: var(--form-control-l-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
-.pure-input__xl_gbxzm {
+.pure-input__xl_1hrrb {
     height: var(--form-control-xl-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
 /* DISABLED STATE */
-.pure-input__component_gbxzm:disabled {
+.pure-input__component_1hrrb: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_gbxzm:not(:disabled):focus {
+.pure-input__component_1hrrb:not(:disabled):focus {
     border-bottom: var(--form-control-focus-border-bottom);
     box-shadow: var(--form-control-focus-shadow)
 }
-.pure-input__component_gbxzm:not(:disabled):focus::placeholder {
+.pure-input__component_1hrrb:not(:disabled):focus::placeholder {
         color: var(--input-focus-placeholder-color);
     }
-.pure-input__focusVisible_gbxzm {
+.pure-input__focusVisible_1hrrb {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
 /* HOVER STATE */
-.pure-input__component_gbxzm:not(:disabled):hover {
+.pure-input__component_1hrrb:not(:disabled):hover {
     background-color: var(--form-control-hover-bg-color);
 }
 /* IE hide clear */
-.pure-input__component_gbxzm::-ms-clear {
+.pure-input__component_1hrrb::-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_gbxzm","hasLabel":"pure-input__hasLabel_gbxzm","clearIcon":"pure-input__clearIcon_gbxzm","errorIcon":"pure-input__errorIcon_gbxzm","successIcon":"pure-input__successIcon_gbxzm","error":"pure-input__error_gbxzm","component":"pure-input__component_gbxzm","block":"pure-input__block_gbxzm","s":"pure-input__s_gbxzm","m":"pure-input__m_gbxzm","l":"pure-input__l_gbxzm","xl":"pure-input__xl_gbxzm","focusVisible":"pure-input__focusVisible_gbxzm"};
+var styles = {"input":"pure-input__input_1hrrb","hasLabel":"pure-input__hasLabel_1hrrb","clearIcon":"pure-input__clearIcon_1hrrb","errorIcon":"pure-input__errorIcon_1hrrb","successIcon":"pure-input__successIcon_1hrrb","error":"pure-input__error_1hrrb","component":"pure-input__component_1hrrb","block":"pure-input__block_1hrrb","s":"pure-input__s_1hrrb","m":"pure-input__m_1hrrb","l":"pure-input__l_1hrrb","xl":"pure-input__xl_1hrrb","focusVisible":"pure-input__focusVisible_1hrrb"};
 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_gbxzm {
+.pure-input__input_1hrrb {
     color: var(--input-color);
     caret-color: var(--input-caret-color);
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.pure-input__input_gbxzm:-webkit-autofill {
+.pure-input__input_1hrrb:-webkit-autofill {
     -webkit-text-fill-color: var(--input-color);
 }
-.pure-input__input_gbxzm::placeholder {
+.pure-input__input_1hrrb::placeholder {
     color: var(--input-placeholder-color);
 }
-.pure-input__hasLabel_gbxzm::placeholder {
+.pure-input__hasLabel_1hrrb::placeholder {
     color: var(--input-with-label-placeholder-color);
 }
-.pure-input__clearIcon_gbxzm {
+.pure-input__clearIcon_1hrrb {
     color: var(--color-light-graphic-primary);
 }
-.pure-input__errorIcon_gbxzm {
+.pure-input__errorIcon_1hrrb {
     background-image: var(--input-error-icon);
 }
-.pure-input__successIcon_gbxzm {
+.pure-input__successIcon_1hrrb {
     background-image: var(--input-success-icon);
 }
 /* READ-ONLY STATE */
-.pure-input__input_gbxzm:read-only {
+.pure-input__input_1hrrb:read-only {
     color: var(--input-read-only-color)
 }
-.pure-input__input_gbxzm:read-only:focus::placeholder {
+.pure-input__input_1hrrb:read-only:focus::placeholder {
         color: var(--input-placeholder-color);
     }
 /* DISABLED STATE */
-.pure-input__input_gbxzm:disabled {
+.pure-input__input_1hrrb:disabled {
     color: var(--input-disabled-color);
     -webkit-text-fill-color: var(--input-disabled-color);
 }
 /* FOCUS STATE */
-.pure-input__input_gbxzm:focus::placeholder {
+.pure-input__input_1hrrb:focus::placeholder {
     color: var(--input-focus-placeholder-color);
 }
 /* ERROR STATE */
-.pure-input__error_gbxzm {
+.pure-input__error_1hrrb {
     color: var(--input-error-color);
     caret-color: var(--input-error-color);
 }
-.pure-input__component_gbxzm {
+.pure-input__component_1hrrb {
     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_gbxzm::placeholder {
+.pure-input__component_1hrrb::placeholder {
     text-overflow: ellipsis;
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
 }
-.pure-input__block_gbxzm {
+.pure-input__block_1hrrb {
     width: 100%;
 }
 /* SIZE */
-.pure-input__s_gbxzm {
+.pure-input__s_1hrrb {
     height: var(--form-control-s-min-height);
 }
-.pure-input__m_gbxzm {
+.pure-input__m_1hrrb {
     height: var(--form-control-m-min-height);
 }
-.pure-input__l_gbxzm {
+.pure-input__l_1hrrb {
     height: var(--form-control-l-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
-.pure-input__xl_gbxzm {
+.pure-input__xl_1hrrb {
     height: var(--form-control-xl-min-height);
     padding: var(--form-control-l-paddings);
     padding-top: 1px;
 }
 /* DISABLED STATE */
-.pure-input__component_gbxzm:disabled {
+.pure-input__component_1hrrb: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_gbxzm:not(:disabled):focus {
+.pure-input__component_1hrrb:not(:disabled):focus {
     border-bottom: var(--form-control-focus-border-bottom);
     box-shadow: var(--form-control-focus-shadow)
 }
-.pure-input__component_gbxzm:not(:disabled):focus::placeholder {
+.pure-input__component_1hrrb:not(:disabled):focus::placeholder {
         color: var(--input-focus-placeholder-color);
     }
-.pure-input__focusVisible_gbxzm {
+.pure-input__focusVisible_1hrrb {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 }
 /* HOVER STATE */
-.pure-input__component_gbxzm:not(:disabled):hover {
+.pure-input__component_1hrrb:not(:disabled):hover {
     background-color: var(--form-control-hover-bg-color);
 }
 /* IE hide clear */
-.pure-input__component_gbxzm::-ms-clear {
+.pure-input__component_1hrrb::-ms-clear {
     display: none;
     width: 0;
     height: 0;

package/radio/Component.js

@@ -50,7 +50,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"container":"radio__container_1c2p4","checked":"radio__checked_1c2p4","disabled":"radio__disabled_1c2p4","inactive":"radio__inactive_1c2p4","circle":"radio__circle_1c2p4","label":"radio__label_1c2p4","hint":"radio__hint_1c2p4","focused":"radio__focused_1c2p4","s":"radio__s_1c2p4","content":"radio__content_1c2p4","start":"radio__start_1c2p4","center":"radio__center_1c2p4","addons":"radio__addons_1c2p4","block":"radio__block_1c2p4"};
+var styles = {"container":"radio__container_mhls9","checked":"radio__checked_mhls9","disabled":"radio__disabled_mhls9","inactive":"radio__inactive_mhls9","circle":"radio__circle_mhls9","label":"radio__label_mhls9","hint":"radio__hint_mhls9","focused":"radio__focused_mhls9","s":"radio__s_mhls9","content":"radio__content_mhls9","start":"radio__start_mhls9","center":"radio__center_mhls9","addons":"radio__addons_mhls9","block":"radio__block_mhls9"};
 require('./index.css');
 
 var Radio = React.forwardRef(function (_a, ref) {

package/radio/esm/Component.js

@@ -42,7 +42,7 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"container":"radio__container_1c2p4","checked":"radio__checked_1c2p4","disabled":"radio__disabled_1c2p4","inactive":"radio__inactive_1c2p4","circle":"radio__circle_1c2p4","label":"radio__label_1c2p4","hint":"radio__hint_1c2p4","focused":"radio__focused_1c2p4","s":"radio__s_1c2p4","content":"radio__content_1c2p4","start":"radio__start_1c2p4","center":"radio__center_1c2p4","addons":"radio__addons_1c2p4","block":"radio__block_1c2p4"};
+var styles = {"container":"radio__container_mhls9","checked":"radio__checked_mhls9","disabled":"radio__disabled_mhls9","inactive":"radio__inactive_mhls9","circle":"radio__circle_mhls9","label":"radio__label_mhls9","hint":"radio__hint_mhls9","focused":"radio__focused_mhls9","s":"radio__s_mhls9","content":"radio__content_mhls9","start":"radio__start_mhls9","center":"radio__center_mhls9","addons":"radio__addons_mhls9","block":"radio__block_mhls9"};
 require('./index.css');
 
 var Radio = forwardRef(function (_a, ref) {

package/radio/esm/index.css

@@ -73,77 +73,77 @@
     /* icon */
     --radio-icon-color: var(--color-light-bg-primary);
 }
-.radio__container_1c2p4 {
+.radio__container_mhls9 {
     display: inline-flex;
     align-items: flex-start;
     cursor: pointer
 }
-.radio__container_1c2p4:not(.radio__checked_1c2p4):not(.radio__disabled_1c2p4):not(.radio__inactive_1c2p4) .radio__circle_1c2p4 {
+.radio__container_mhls9:not(.radio__checked_mhls9):not(.radio__disabled_mhls9):not(.radio__inactive_mhls9) .radio__circle_mhls9 {
             background-color: var(--radio-bg-color);
             border: 1.5px solid var(--radio-border-color);
         }
-.radio__container_1c2p4:not(.radio__checked_1c2p4):not(.radio__disabled_1c2p4):not(.radio__inactive_1c2p4):hover:not(:active) .radio__circle_1c2p4 {
+.radio__container_mhls9:not(.radio__checked_mhls9):not(.radio__disabled_mhls9):not(.radio__inactive_mhls9):hover:not(:active) .radio__circle_mhls9 {
             background-color: var(--radio-hover-bg-color);
             border-color: var(--radio-hover-border-color);
         }
-.radio__container_1c2p4:not(.radio__checked_1c2p4):not(.radio__disabled_1c2p4):not(.radio__inactive_1c2p4):active .radio__circle_1c2p4 {
+.radio__container_mhls9:not(.radio__checked_mhls9):not(.radio__disabled_mhls9):not(.radio__inactive_mhls9):active .radio__circle_mhls9 {
             background-color: var(--radio-active-bg-color);
             border-color: var(--radio-active-border-color);
         }
-.radio__container_1c2p4.radio__disabled_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 {
         cursor: var(--disabled-cursor)
     }
-.radio__container_1c2p4.radio__disabled_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 .radio__circle_mhls9 {
             background-color: var(--radio-disabled-bg-color);
             border: 1.5px solid var(--radio-disabled-border-color);
         }
-.radio__container_1c2p4.radio__disabled_1c2p4 .radio__label_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 .radio__label_mhls9 {
             color: var(--radio-disabled-color);
         }
-.radio__container_1c2p4.radio__disabled_1c2p4 .radio__hint_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 .radio__hint_mhls9 {
             color: var(--radio-disabled-color);
         }
-.radio__container_1c2p4.radio__inactive_1c2p4 {
+.radio__container_mhls9.radio__inactive_mhls9 {
         cursor: var(--disabled-cursor)
     }
-.radio__container_1c2p4.radio__inactive_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__inactive_mhls9 .radio__circle_mhls9 {
             background-color: var(--radio-checked-disabled-bg-color);
             border: 1px solid var(--radio-inactive-border-color);
         }
-.radio__container_1c2p4.radio__inactive_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4:before {
+.radio__container_mhls9.radio__inactive_mhls9.radio__checked_mhls9 .radio__circle_mhls9:before {
             background-color: var(--radio-checked-inactive-color);
         }
-.radio__container_1c2p4.radio__checked_1c2p4:not(:active) .radio__circle_1c2p4:before,
-    .radio__container_1c2p4.radio__checked_1c2p4.radio__disabled_1c2p4:active .radio__circle_1c2p4:before {
+.radio__container_mhls9.radio__checked_mhls9:not(:active) .radio__circle_mhls9:before,
+    .radio__container_mhls9.radio__checked_mhls9.radio__disabled_mhls9:active .radio__circle_mhls9:before {
         opacity: 1;
     }
-.radio__container_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__checked_mhls9 .radio__circle_mhls9 {
             background-color: var(--radio-checked-bg-color);
             border: 1.5px solid var(--radio-checked-border-color);
         }
-.radio__container_1c2p4.radio__checked_1c2p4:hover .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__checked_mhls9:hover .radio__circle_mhls9 {
             background-color: var(--radio-checked-hover-bg-color);
             border-color: var(--radio-checked-hover-border-color);
         }
-.radio__container_1c2p4.radio__checked_1c2p4:active .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__checked_mhls9:active .radio__circle_mhls9 {
             background-color: var(--radio-checked-active-bg-color);
             border-color: var(--radio-checked-active-border-color);
         }
-.radio__container_1c2p4.radio__focused_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__focused_mhls9 .radio__circle_mhls9 {
         outline: 2px solid var(--focus-color);
         outline-offset: 2px;
     }
-.radio__container_1c2p4.radio__disabled_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4,
-    .radio__container_1c2p4.radio__inactive_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9.radio__checked_mhls9 .radio__circle_mhls9,
+    .radio__container_mhls9.radio__inactive_mhls9.radio__checked_mhls9 .radio__circle_mhls9 {
         background-color: var(--radio-checked-disabled-bg-color);
         border-color: var(--radio-checked-disabled-border-color);
     }
-.radio__container_1c2p4 input {
+.radio__container_mhls9 input {
         position: absolute;
         z-index: -1;
         opacity: 0;
     }
-.radio__circle_1c2p4 {
+.radio__circle_mhls9 {
     flex-shrink: 0;
     width: 20px;
     height: 20px;
@@ -153,7 +153,7 @@
     margin: var(--gap-3xs);
     transition: background-color 0.2s ease, border 0.2s ease
 }
-.radio__circle_1c2p4:before {
+.radio__circle_mhls9:before {
         content: '';
         background-color: var(--radio-icon-color);
         position: absolute;
@@ -168,40 +168,40 @@
         transition: opacity 0.2s ease;
         opacity: 0;
     }
-.radio__s_1c2p4 .radio__circle_1c2p4 {
+.radio__s_mhls9 .radio__circle_mhls9 {
     width: 16px;
     height: 16px;
     margin: var(--gap-2xs) var(--gap-3xs);
 }
-.radio__content_1c2p4 {
+.radio__content_mhls9 {
     display: flex;
     flex-direction: column;
     margin-left: var(--gap-s);
 }
-.radio__s_1c2p4 .radio__content_1c2p4 {
+.radio__s_mhls9 .radio__content_mhls9 {
     margin-left: var(--gap-xs);
 }
-.radio__start_1c2p4 {
+.radio__start_mhls9 {
     align-items: flex-start;
 }
-.radio__center_1c2p4 {
+.radio__center_mhls9 {
     align-items: center;
 }
-.radio__addons_1c2p4 {
+.radio__addons_mhls9 {
     margin-left: auto;
     padding-left: var(--gap-m);
     line-height: 24px;
 }
-.radio__block_1c2p4 {
+.radio__block_mhls9 {
     width: 100%;
 }
-.radio__label_1c2p4 {
+.radio__label_mhls9 {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     color: var(--radio-label-color);
 }
-.radio__hint_1c2p4 {
+.radio__hint_mhls9 {
     font-size: 14px;
     line-height: 18px;
     font-weight: 400;

package/radio/index.css

@@ -73,77 +73,77 @@
     /* icon */
     --radio-icon-color: var(--color-light-bg-primary);
 }
-.radio__container_1c2p4 {
+.radio__container_mhls9 {
     display: inline-flex;
     align-items: flex-start;
     cursor: pointer
 }
-.radio__container_1c2p4:not(.radio__checked_1c2p4):not(.radio__disabled_1c2p4):not(.radio__inactive_1c2p4) .radio__circle_1c2p4 {
+.radio__container_mhls9:not(.radio__checked_mhls9):not(.radio__disabled_mhls9):not(.radio__inactive_mhls9) .radio__circle_mhls9 {
             background-color: var(--radio-bg-color);
             border: 1.5px solid var(--radio-border-color);
         }
-.radio__container_1c2p4:not(.radio__checked_1c2p4):not(.radio__disabled_1c2p4):not(.radio__inactive_1c2p4):hover:not(:active) .radio__circle_1c2p4 {
+.radio__container_mhls9:not(.radio__checked_mhls9):not(.radio__disabled_mhls9):not(.radio__inactive_mhls9):hover:not(:active) .radio__circle_mhls9 {
             background-color: var(--radio-hover-bg-color);
             border-color: var(--radio-hover-border-color);
         }
-.radio__container_1c2p4:not(.radio__checked_1c2p4):not(.radio__disabled_1c2p4):not(.radio__inactive_1c2p4):active .radio__circle_1c2p4 {
+.radio__container_mhls9:not(.radio__checked_mhls9):not(.radio__disabled_mhls9):not(.radio__inactive_mhls9):active .radio__circle_mhls9 {
             background-color: var(--radio-active-bg-color);
             border-color: var(--radio-active-border-color);
         }
-.radio__container_1c2p4.radio__disabled_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 {
         cursor: var(--disabled-cursor)
     }
-.radio__container_1c2p4.radio__disabled_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 .radio__circle_mhls9 {
             background-color: var(--radio-disabled-bg-color);
             border: 1.5px solid var(--radio-disabled-border-color);
         }
-.radio__container_1c2p4.radio__disabled_1c2p4 .radio__label_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 .radio__label_mhls9 {
             color: var(--radio-disabled-color);
         }
-.radio__container_1c2p4.radio__disabled_1c2p4 .radio__hint_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9 .radio__hint_mhls9 {
             color: var(--radio-disabled-color);
         }
-.radio__container_1c2p4.radio__inactive_1c2p4 {
+.radio__container_mhls9.radio__inactive_mhls9 {
         cursor: var(--disabled-cursor)
     }
-.radio__container_1c2p4.radio__inactive_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__inactive_mhls9 .radio__circle_mhls9 {
             background-color: var(--radio-checked-disabled-bg-color);
             border: 1px solid var(--radio-inactive-border-color);
         }
-.radio__container_1c2p4.radio__inactive_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4:before {
+.radio__container_mhls9.radio__inactive_mhls9.radio__checked_mhls9 .radio__circle_mhls9:before {
             background-color: var(--radio-checked-inactive-color);
         }
-.radio__container_1c2p4.radio__checked_1c2p4:not(:active) .radio__circle_1c2p4:before,
-    .radio__container_1c2p4.radio__checked_1c2p4.radio__disabled_1c2p4:active .radio__circle_1c2p4:before {
+.radio__container_mhls9.radio__checked_mhls9:not(:active) .radio__circle_mhls9:before,
+    .radio__container_mhls9.radio__checked_mhls9.radio__disabled_mhls9:active .radio__circle_mhls9:before {
         opacity: 1;
     }
-.radio__container_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__checked_mhls9 .radio__circle_mhls9 {
             background-color: var(--radio-checked-bg-color);
             border: 1.5px solid var(--radio-checked-border-color);
         }
-.radio__container_1c2p4.radio__checked_1c2p4:hover .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__checked_mhls9:hover .radio__circle_mhls9 {
             background-color: var(--radio-checked-hover-bg-color);
             border-color: var(--radio-checked-hover-border-color);
         }
-.radio__container_1c2p4.radio__checked_1c2p4:active .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__checked_mhls9:active .radio__circle_mhls9 {
             background-color: var(--radio-checked-active-bg-color);
             border-color: var(--radio-checked-active-border-color);
         }
-.radio__container_1c2p4.radio__focused_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__focused_mhls9 .radio__circle_mhls9 {
         outline: 2px solid var(--focus-color);
         outline-offset: 2px;
     }
-.radio__container_1c2p4.radio__disabled_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4,
-    .radio__container_1c2p4.radio__inactive_1c2p4.radio__checked_1c2p4 .radio__circle_1c2p4 {
+.radio__container_mhls9.radio__disabled_mhls9.radio__checked_mhls9 .radio__circle_mhls9,
+    .radio__container_mhls9.radio__inactive_mhls9.radio__checked_mhls9 .radio__circle_mhls9 {
         background-color: var(--radio-checked-disabled-bg-color);
         border-color: var(--radio-checked-disabled-border-color);
     }
-.radio__container_1c2p4 input {
+.radio__container_mhls9 input {
         position: absolute;
         z-index: -1;
         opacity: 0;
     }
-.radio__circle_1c2p4 {
+.radio__circle_mhls9 {
     flex-shrink: 0;
     width: 20px;
     height: 20px;
@@ -153,7 +153,7 @@
     margin: var(--gap-3xs);
     transition: background-color 0.2s ease, border 0.2s ease
 }
-.radio__circle_1c2p4:before {
+.radio__circle_mhls9:before {
         content: '';
         background-color: var(--radio-icon-color);
         position: absolute;
@@ -168,40 +168,40 @@
         transition: opacity 0.2s ease;
         opacity: 0;
     }
-.radio__s_1c2p4 .radio__circle_1c2p4 {
+.radio__s_mhls9 .radio__circle_mhls9 {
     width: 16px;
     height: 16px;
     margin: var(--gap-2xs) var(--gap-3xs);
 }
-.radio__content_1c2p4 {
+.radio__content_mhls9 {
     display: flex;
     flex-direction: column;
     margin-left: var(--gap-s);
 }
-.radio__s_1c2p4 .radio__content_1c2p4 {
+.radio__s_mhls9 .radio__content_mhls9 {
     margin-left: var(--gap-xs);
 }
-.radio__start_1c2p4 {
+.radio__start_mhls9 {
     align-items: flex-start;
 }
-.radio__center_1c2p4 {
+.radio__center_mhls9 {
     align-items: center;
 }
-.radio__addons_1c2p4 {
+.radio__addons_mhls9 {
     margin-left: auto;
     padding-left: var(--gap-m);
     line-height: 24px;
 }
-.radio__block_1c2p4 {
+.radio__block_mhls9 {
     width: 100%;
 }
-.radio__label_1c2p4 {
+.radio__label_mhls9 {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
     color: var(--radio-label-color);
 }
-.radio__hint_1c2p4 {
+.radio__hint_mhls9 {
     font-size: 14px;
     line-height: 18px;
     font-weight: 400;

package/radio/modern/Component.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import mergeRefs from 'react-merge-refs';
 import { useFocus } from '@alfalab/hooks';
 
-var styles = {"container":"radio__container_1c2p4","checked":"radio__checked_1c2p4","disabled":"radio__disabled_1c2p4","inactive":"radio__inactive_1c2p4","circle":"radio__circle_1c2p4","label":"radio__label_1c2p4","hint":"radio__hint_1c2p4","focused":"radio__focused_1c2p4","s":"radio__s_1c2p4","content":"radio__content_1c2p4","start":"radio__start_1c2p4","center":"radio__center_1c2p4","addons":"radio__addons_1c2p4","block":"radio__block_1c2p4"};
+var styles = {"container":"radio__container_mhls9","checked":"radio__checked_mhls9","disabled":"radio__disabled_mhls9","inactive":"radio__inactive_mhls9","circle":"radio__circle_mhls9","label":"radio__label_mhls9","hint":"radio__hint_mhls9","focused":"radio__focused_mhls9","s":"radio__s_mhls9","content":"radio__content_mhls9","start":"radio__start_mhls9","center":"radio__center_mhls9","addons":"radio__addons_mhls9","block":"radio__block_mhls9"};
 require('./index.css');
 
 const Radio = forwardRef(({ onChange, className, circleClassName, contentClassName, name, disabled, inactive, dataTestId, label, checked, hint, size = 's', align = 'start', addons, block, ...restProps }, ref) => {