@alfalab/core-components 22.3.1 → 23.3.0

package/form-control/index.css

@@ -44,11 +44,11 @@
     /* font */
     --form-control-font-family: var(--font-family);
 }
-.form-control__component_1g16l {
+.form-control__component_sm8wz {
     font-family: var(--form-control-font-family);
     width: max-content;
 }
-.form-control__inner_1g16l {
+.form-control__inner_sm8wz {
     display: flex;
     position: relative;
     min-height: 100%;
@@ -61,7 +61,7 @@
     transform: translateZ(0);
 }
 /* Нижняя граница */
-.form-control__inner_1g16l:before {
+.form-control__inner_sm8wz:before {
     content: '';
     display: block;
     position: absolute;
@@ -71,22 +71,22 @@
     transition: transform 0.2s ease, border 0.2s ease;
     transform-origin: bottom;
 }
-.form-control__inputWrapper_1g16l {
+.form-control__inputWrapper_sm8wz {
     flex-grow: 1;
     position: relative;
     overflow: hidden;
 }
-.form-control__input_1g16l {
+.form-control__input_sm8wz {
     height: 100%;
     display: flex;
     align-items: center;
     position: relative;
 }
-.form-control__input_1g16l > * {
+.form-control__input_sm8wz > * {
     padding: var(--form-control-paddings);
     font-family: var(--form-control-font-family);
 }
-.form-control__label_1g16l {
+.form-control__label_sm8wz {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -102,24 +102,24 @@
     transition-property: color, transform;
     transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
 }
-.form-control__labelInner_1g16l {
+.form-control__labelInner_sm8wz {
     width: 100%;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }
-.form-control__addons_1g16l {
+.form-control__addons_sm8wz {
     display: flex;
     flex-shrink: 0;
     align-items: center;
 }
-.form-control__leftAddons_1g16l {
+.form-control__leftAddons_sm8wz {
     padding-left: var(--gap-s);
 }
-.form-control__rightAddons_1g16l {
+.form-control__rightAddons_sm8wz {
     padding-right: var(--gap-s);
 }
-.form-control__sub_1g16l {
+.form-control__sub_sm8wz {
     font-size: 14px;
     line-height: 18px;
     font-weight: 400;
@@ -128,100 +128,100 @@
     margin-top: var(--gap-2xs);
     padding: var(--form-control-sub-paddings);
 }
-.form-control__block_1g16l {
+.form-control__block_sm8wz {
     width: 100%;
 }
 /* SIZES */
-.form-control__s_1g16l .form-control__inner_1g16l {
+.form-control__s_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-s-min-height);
 }
-.form-control__s_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__s_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-s-paddings);
 }
-.form-control__s_1g16l .form-control__label_1g16l {
+.form-control__s_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-s-min-height) / 2 + 1px);
 }
-.form-control__m_1g16l .form-control__inner_1g16l {
+.form-control__m_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-m-min-height);
 }
-.form-control__m_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__m_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-m-paddings);
 }
-.form-control__m_1g16l .form-control__label_1g16l {
+.form-control__m_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-m-min-height) / 2);
 }
-.form-control__l_1g16l .form-control__inner_1g16l {
+.form-control__l_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-l-min-height);
 }
-.form-control__l_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__l_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-l-paddings);
 }
-.form-control__l_1g16l .form-control__label_1g16l {
+.form-control__l_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-l-min-height) / 2);
 }
-.form-control__xl_1g16l .form-control__inner_1g16l {
+.form-control__xl_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-xl-min-height);
 }
-.form-control__xl_1g16l .form-control__label_1g16l {
+.form-control__xl_sm8wz .form-control__label_sm8wz {
     left: var(--gap-m);
 }
-.form-control__xl_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-xl-paddings);
 }
-.form-control__xl_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-xl-paddings);
 }
-.form-control__xl_1g16l .form-control__leftAddons_1g16l {
+.form-control__xl_sm8wz .form-control__leftAddons_sm8wz {
     padding-left: var(--gap-m);
 }
-.form-control__xl_1g16l .form-control__rightAddons_1g16l {
+.form-control__xl_sm8wz .form-control__rightAddons_sm8wz {
     padding-right: var(--gap-m);
 }
-.form-control__xl_1g16l.form-control__hasLeftAddons_1g16l .form-control__label_1g16l {
+.form-control__xl_sm8wz.form-control__hasLeftAddons_sm8wz .form-control__label_sm8wz {
     left: var(--gap-s);
 }
-.form-control__xl_1g16l.form-control__hasLeftAddons_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz.form-control__hasLeftAddons_sm8wz .form-control__input_sm8wz > * {
     padding-left: var(--gap-s);
 }
-.form-control__xl_1g16l.form-control__hasRightAddons_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz.form-control__hasRightAddons_sm8wz .form-control__input_sm8wz > * {
     padding-right: var(--gap-s);
 }
-.form-control__xl_1g16l .form-control__sub_1g16l {
+.form-control__xl_sm8wz .form-control__sub_sm8wz {
     margin-top: var(--gap-xs);
 }
-.form-control__xl_1g16l .form-control__label_1g16l {
+.form-control__xl_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-xl-min-height) / 2 - 1px);
 }
 /* DISABLED STATE */
-.form-control__disabled_1g16l {
+.form-control__disabled_sm8wz {
     opacity: var(--form-control-disabled-opacity);
 }
 /* FOCUS STATE */
-.form-control__focused_1g16l:not(.form-control__disabled_1g16l):before,
-.form-control__hasError_1g16l:before {
+.form-control__focused_sm8wz:not(.form-control__disabled_sm8wz):before,
+.form-control__hasError_sm8wz:before {
     transform: scaleY(2);
 }
-.form-control__filled_1g16l .form-control__label_1g16l {
+.form-control__filled_sm8wz .form-control__label_sm8wz {
     transform: translateY(-100%) scale(0.875);
 }
-.form-control__hiddenLabel_1g16l {
+.form-control__hiddenLabel_sm8wz {
     opacity: 0;
     height: 0;
     padding: var(--form-control-paddings);
     display: block;
     box-sizing: border-box;
 }
-.form-control__xl_1g16l .form-control__hiddenLabel_1g16l {
+.form-control__xl_sm8wz .form-control__hiddenLabel_sm8wz {
     padding: var(--form-control-l-paddings);
 }
 /* min-height and width: max-content; fix for IE */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    .form-control__component_1g16l {
+    .form-control__component_sm8wz {
         float: left;
         clear: left;
     }
 
-    .form-control__inner_1g16l:after {
+    .form-control__inner_sm8wz:after {
         min-height: inherit;
         font-size: 0;
         content: '';

package/form-control/inverted.css

@@ -47,51 +47,51 @@
     --form-control-inverted-error-shadow: none;
     --form-control-inverted-error-border-bottom: 1px solid var(--color-static-border-accent);
 }
-.form-control__component_1ivrw {
+.form-control__component_1gnnm {
     color: var(--form-control-inverted-color);
 }
-.form-control__inner_1ivrw {
+.form-control__inner_1gnnm {
     background-color: var(--form-control-inverted-bg-color);
 }
 /* Нижняя граница */
-.form-control__inner_1ivrw:before {
+.form-control__inner_1gnnm:before {
     border-bottom: var(--form-control-inverted-border-bottom);
 }
-.form-control__label_1ivrw {
+.form-control__label_1gnnm {
     color: var(--form-control-inverted-label-color);
 }
-.form-control__hint_1ivrw {
+.form-control__hint_1gnnm {
     color: var(--form-control-inverted-hint-color);
 }
 /* DISABLED STATE */
-.form-control__disabled_1ivrw {
+.form-control__disabled_1gnnm {
     background-color: var(--form-control-inverted-disabled-bg-color);
     color: var(--form-control-inverted-disabled-color);
 }
-.form-control__disabled_1ivrw:before {
+.form-control__disabled_1gnnm:before {
     border-bottom: var(--form-control-inverted-disabled-border-bottom);
 }
 /* FOCUS STATE */
-.form-control__focused_1ivrw:not(.form-control__disabled_1ivrw):not(.form-control__hasError_1ivrw):before {
+.form-control__focused_1gnnm:not(.form-control__disabled_1gnnm):not(.form-control__hasError_1gnnm):before {
     border-bottom: var(--form-control-inverted-focus-border-bottom);
 }
-.form-control__focused_1ivrw.form-control__inner_1ivrw {
+.form-control__focused_1gnnm.form-control__inner_1gnnm {
     background-color: var(--form-control-inverted-focus-bg-color);
 }
 /* HOVER STATE */
-.form-control__inner_1ivrw:not(.form-control__disabled_1ivrw):hover {
+.form-control__inner_1gnnm:not(.form-control__disabled_1gnnm):hover {
     background-color: var(--form-control-inverted-hover-bg-color);
 }
 /* ERROR STATE */
-.form-control__error_1ivrw {
+.form-control__error_1gnnm {
     color: var(--form-control-inverted-error-color);
 }
-.form-control__hasError_1ivrw .form-control__label_1ivrw {
+.form-control__hasError_1gnnm .form-control__label_1gnnm {
     color: var(--form-control-inverted-error-label-color);
 }
-.form-control__hasError_1ivrw {
+.form-control__hasError_1gnnm {
     box-shadow: var(--form-control-inverted-error-shadow);
 }
-.form-control__hasError_1ivrw:before {
+.form-control__hasError_1gnnm:before {
     border-bottom: var(--form-control-inverted-error-border-bottom);
 }

package/form-control/modern/Component.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"component":"form-control__component_1g16l","inner":"form-control__inner_1g16l","inputWrapper":"form-control__inputWrapper_1g16l","input":"form-control__input_1g16l","label":"form-control__label_1g16l","labelInner":"form-control__labelInner_1g16l","addons":"form-control__addons_1g16l","leftAddons":"form-control__leftAddons_1g16l","rightAddons":"form-control__rightAddons_1g16l","sub":"form-control__sub_1g16l","block":"form-control__block_1g16l","s":"form-control__s_1g16l","hasLabel":"form-control__hasLabel_1g16l","m":"form-control__m_1g16l","l":"form-control__l_1g16l","xl":"form-control__xl_1g16l","hasLeftAddons":"form-control__hasLeftAddons_1g16l","hasRightAddons":"form-control__hasRightAddons_1g16l","disabled":"form-control__disabled_1g16l","focused":"form-control__focused_1g16l","hasError":"form-control__hasError_1g16l","filled":"form-control__filled_1g16l","hiddenLabel":"form-control__hiddenLabel_1g16l"};
+var styles = {"component":"form-control__component_sm8wz","inner":"form-control__inner_sm8wz","inputWrapper":"form-control__inputWrapper_sm8wz","input":"form-control__input_sm8wz","label":"form-control__label_sm8wz","labelInner":"form-control__labelInner_sm8wz","addons":"form-control__addons_sm8wz","leftAddons":"form-control__leftAddons_sm8wz","rightAddons":"form-control__rightAddons_sm8wz","sub":"form-control__sub_sm8wz","block":"form-control__block_sm8wz","s":"form-control__s_sm8wz","hasLabel":"form-control__hasLabel_sm8wz","m":"form-control__m_sm8wz","l":"form-control__l_sm8wz","xl":"form-control__xl_sm8wz","hasLeftAddons":"form-control__hasLeftAddons_sm8wz","hasRightAddons":"form-control__hasRightAddons_sm8wz","disabled":"form-control__disabled_sm8wz","focused":"form-control__focused_sm8wz","hasError":"form-control__hasError_sm8wz","filled":"form-control__filled_sm8wz","hiddenLabel":"form-control__hiddenLabel_sm8wz"};
 require('./index.css');
 
-var defaultColors = {"component":"form-control__component_wwv4h","inner":"form-control__inner_wwv4h","label":"form-control__label_wwv4h","hint":"form-control__hint_wwv4h","disabled":"form-control__disabled_wwv4h","focused":"form-control__focused_wwv4h","hasError":"form-control__hasError_wwv4h","error":"form-control__error_wwv4h"};
+var defaultColors = {"component":"form-control__component_d0ix2","inner":"form-control__inner_d0ix2","label":"form-control__label_d0ix2","hint":"form-control__hint_d0ix2","disabled":"form-control__disabled_d0ix2","focused":"form-control__focused_d0ix2","hasError":"form-control__hasError_d0ix2","error":"form-control__error_d0ix2"};
 require('./default.css');
 
-var invertedColors = {"component":"form-control__component_1ivrw","inner":"form-control__inner_1ivrw","label":"form-control__label_1ivrw","hint":"form-control__hint_1ivrw","disabled":"form-control__disabled_1ivrw","focused":"form-control__focused_1ivrw","hasError":"form-control__hasError_1ivrw","error":"form-control__error_1ivrw"};
+var invertedColors = {"component":"form-control__component_1gnnm","inner":"form-control__inner_1gnnm","label":"form-control__label_1gnnm","hint":"form-control__hint_1gnnm","disabled":"form-control__disabled_1gnnm","focused":"form-control__focused_1gnnm","hasError":"form-control__hasError_1gnnm","error":"form-control__error_1gnnm"};
 require('./inverted.css');
 
 const colorStyles = {

package/form-control/modern/default.css

@@ -42,51 +42,51 @@
     --form-control-error-shadow: none;
     --form-control-error-border-bottom: 1px solid var(--color-static-border-accent);
 }
-.form-control__component_wwv4h {
+.form-control__component_d0ix2 {
     color: var(--form-control-color);
 }
-.form-control__inner_wwv4h {
+.form-control__inner_d0ix2 {
     background-color: var(--form-control-bg-color);
 }
 /* Нижняя граница */
-.form-control__inner_wwv4h:before {
+.form-control__inner_d0ix2:before {
     border-bottom: var(--form-control-border-bottom);
 }
-.form-control__label_wwv4h {
+.form-control__label_d0ix2 {
     color: var(--form-control-label-color);
 }
-.form-control__hint_wwv4h {
+.form-control__hint_d0ix2 {
     color: var(--form-control-hint-color);
 }
 /* DISABLED STATE */
-.form-control__disabled_wwv4h {
+.form-control__disabled_d0ix2 {
     background-color: var(--form-control-disabled-bg-color);
     color: var(--form-control-disabled-color);
 }
-.form-control__disabled_wwv4h:before {
+.form-control__disabled_d0ix2:before {
     border-bottom: var(--form-control-disabled-border-bottom);
 }
 /* FOCUS STATE */
-.form-control__focused_wwv4h:not(.form-control__disabled_wwv4h):not(.form-control__hasError_wwv4h):before {
+.form-control__focused_d0ix2:not(.form-control__disabled_d0ix2):not(.form-control__hasError_d0ix2):before {
     border-bottom: var(--form-control-focus-border-bottom);
 }
-.form-control__focused_wwv4h.form-control__inner_wwv4h {
+.form-control__focused_d0ix2.form-control__inner_d0ix2 {
     background-color: var(--form-control-focus-bg-color);
 }
 /* HOVER STATE */
-.form-control__inner_wwv4h:not(.form-control__disabled_wwv4h):hover {
+.form-control__inner_d0ix2:not(.form-control__disabled_d0ix2):hover {
     background-color: var(--form-control-hover-bg-color);
 }
 /* ERROR STATE */
-.form-control__error_wwv4h {
+.form-control__error_d0ix2 {
     color: var(--form-control-error-color);
 }
-.form-control__hasError_wwv4h .form-control__label_wwv4h {
+.form-control__hasError_d0ix2 .form-control__label_d0ix2 {
     color: var(--form-control-error-label-color);
 }
-.form-control__hasError_wwv4h {
+.form-control__hasError_d0ix2 {
     box-shadow: var(--form-control-error-shadow);
 }
-.form-control__hasError_wwv4h:before {
+.form-control__hasError_d0ix2:before {
     border-bottom: var(--form-control-error-border-bottom);
 }

package/form-control/modern/index.css

@@ -44,11 +44,11 @@
     /* font */
     --form-control-font-family: var(--font-family);
 }
-.form-control__component_1g16l {
+.form-control__component_sm8wz {
     font-family: var(--form-control-font-family);
     width: max-content;
 }
-.form-control__inner_1g16l {
+.form-control__inner_sm8wz {
     display: flex;
     position: relative;
     min-height: 100%;
@@ -61,7 +61,7 @@
     transform: translateZ(0);
 }
 /* Нижняя граница */
-.form-control__inner_1g16l:before {
+.form-control__inner_sm8wz:before {
     content: '';
     display: block;
     position: absolute;
@@ -71,22 +71,22 @@
     transition: transform 0.2s ease, border 0.2s ease;
     transform-origin: bottom;
 }
-.form-control__inputWrapper_1g16l {
+.form-control__inputWrapper_sm8wz {
     flex-grow: 1;
     position: relative;
     overflow: hidden;
 }
-.form-control__input_1g16l {
+.form-control__input_sm8wz {
     height: 100%;
     display: flex;
     align-items: center;
     position: relative;
 }
-.form-control__input_1g16l > * {
+.form-control__input_sm8wz > * {
     padding: var(--form-control-paddings);
     font-family: var(--form-control-font-family);
 }
-.form-control__label_1g16l {
+.form-control__label_sm8wz {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -102,24 +102,24 @@
     transition-property: color, transform;
     transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
 }
-.form-control__labelInner_1g16l {
+.form-control__labelInner_sm8wz {
     width: 100%;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
 }
-.form-control__addons_1g16l {
+.form-control__addons_sm8wz {
     display: flex;
     flex-shrink: 0;
     align-items: center;
 }
-.form-control__leftAddons_1g16l {
+.form-control__leftAddons_sm8wz {
     padding-left: var(--gap-s);
 }
-.form-control__rightAddons_1g16l {
+.form-control__rightAddons_sm8wz {
     padding-right: var(--gap-s);
 }
-.form-control__sub_1g16l {
+.form-control__sub_sm8wz {
     font-size: 14px;
     line-height: 18px;
     font-weight: 400;
@@ -128,100 +128,100 @@
     margin-top: var(--gap-2xs);
     padding: var(--form-control-sub-paddings);
 }
-.form-control__block_1g16l {
+.form-control__block_sm8wz {
     width: 100%;
 }
 /* SIZES */
-.form-control__s_1g16l .form-control__inner_1g16l {
+.form-control__s_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-s-min-height);
 }
-.form-control__s_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__s_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-s-paddings);
 }
-.form-control__s_1g16l .form-control__label_1g16l {
+.form-control__s_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-s-min-height) / 2 + 1px);
 }
-.form-control__m_1g16l .form-control__inner_1g16l {
+.form-control__m_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-m-min-height);
 }
-.form-control__m_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__m_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-m-paddings);
 }
-.form-control__m_1g16l .form-control__label_1g16l {
+.form-control__m_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-m-min-height) / 2);
 }
-.form-control__l_1g16l .form-control__inner_1g16l {
+.form-control__l_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-l-min-height);
 }
-.form-control__l_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__l_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-l-paddings);
 }
-.form-control__l_1g16l .form-control__label_1g16l {
+.form-control__l_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-l-min-height) / 2);
 }
-.form-control__xl_1g16l .form-control__inner_1g16l {
+.form-control__xl_sm8wz .form-control__inner_sm8wz {
     min-height: var(--form-control-xl-min-height);
 }
-.form-control__xl_1g16l .form-control__label_1g16l {
+.form-control__xl_sm8wz .form-control__label_sm8wz {
     left: var(--gap-m);
 }
-.form-control__xl_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-xl-paddings);
 }
-.form-control__xl_1g16l .form-control__hasLabel_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz .form-control__hasLabel_sm8wz .form-control__input_sm8wz > * {
     padding: var(--form-control-labeled-xl-paddings);
 }
-.form-control__xl_1g16l .form-control__leftAddons_1g16l {
+.form-control__xl_sm8wz .form-control__leftAddons_sm8wz {
     padding-left: var(--gap-m);
 }
-.form-control__xl_1g16l .form-control__rightAddons_1g16l {
+.form-control__xl_sm8wz .form-control__rightAddons_sm8wz {
     padding-right: var(--gap-m);
 }
-.form-control__xl_1g16l.form-control__hasLeftAddons_1g16l .form-control__label_1g16l {
+.form-control__xl_sm8wz.form-control__hasLeftAddons_sm8wz .form-control__label_sm8wz {
     left: var(--gap-s);
 }
-.form-control__xl_1g16l.form-control__hasLeftAddons_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz.form-control__hasLeftAddons_sm8wz .form-control__input_sm8wz > * {
     padding-left: var(--gap-s);
 }
-.form-control__xl_1g16l.form-control__hasRightAddons_1g16l .form-control__input_1g16l > * {
+.form-control__xl_sm8wz.form-control__hasRightAddons_sm8wz .form-control__input_sm8wz > * {
     padding-right: var(--gap-s);
 }
-.form-control__xl_1g16l .form-control__sub_1g16l {
+.form-control__xl_sm8wz .form-control__sub_sm8wz {
     margin-top: var(--gap-xs);
 }
-.form-control__xl_1g16l .form-control__label_1g16l {
+.form-control__xl_sm8wz .form-control__label_sm8wz {
     top: calc(var(--form-control-xl-min-height) / 2 - 1px);
 }
 /* DISABLED STATE */
-.form-control__disabled_1g16l {
+.form-control__disabled_sm8wz {
     opacity: var(--form-control-disabled-opacity);
 }
 /* FOCUS STATE */
-.form-control__focused_1g16l:not(.form-control__disabled_1g16l):before,
-.form-control__hasError_1g16l:before {
+.form-control__focused_sm8wz:not(.form-control__disabled_sm8wz):before,
+.form-control__hasError_sm8wz:before {
     transform: scaleY(2);
 }
-.form-control__filled_1g16l .form-control__label_1g16l {
+.form-control__filled_sm8wz .form-control__label_sm8wz {
     transform: translateY(-100%) scale(0.875);
 }
-.form-control__hiddenLabel_1g16l {
+.form-control__hiddenLabel_sm8wz {
     opacity: 0;
     height: 0;
     padding: var(--form-control-paddings);
     display: block;
     box-sizing: border-box;
 }
-.form-control__xl_1g16l .form-control__hiddenLabel_1g16l {
+.form-control__xl_sm8wz .form-control__hiddenLabel_sm8wz {
     padding: var(--form-control-l-paddings);
 }
 /* min-height and width: max-content; fix for IE */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    .form-control__component_1g16l {
+    .form-control__component_sm8wz {
         float: left;
         clear: left;
     }
 
-    .form-control__inner_1g16l:after {
+    .form-control__inner_sm8wz:after {
         min-height: inherit;
         font-size: 0;
         content: '';

package/form-control/modern/inverted.css

@@ -47,51 +47,51 @@
     --form-control-inverted-error-shadow: none;
     --form-control-inverted-error-border-bottom: 1px solid var(--color-static-border-accent);
 }
-.form-control__component_1ivrw {
+.form-control__component_1gnnm {
     color: var(--form-control-inverted-color);
 }
-.form-control__inner_1ivrw {
+.form-control__inner_1gnnm {
     background-color: var(--form-control-inverted-bg-color);
 }
 /* Нижняя граница */
-.form-control__inner_1ivrw:before {
+.form-control__inner_1gnnm:before {
     border-bottom: var(--form-control-inverted-border-bottom);
 }
-.form-control__label_1ivrw {
+.form-control__label_1gnnm {
     color: var(--form-control-inverted-label-color);
 }
-.form-control__hint_1ivrw {
+.form-control__hint_1gnnm {
     color: var(--form-control-inverted-hint-color);
 }
 /* DISABLED STATE */
-.form-control__disabled_1ivrw {
+.form-control__disabled_1gnnm {
     background-color: var(--form-control-inverted-disabled-bg-color);
     color: var(--form-control-inverted-disabled-color);
 }
-.form-control__disabled_1ivrw:before {
+.form-control__disabled_1gnnm:before {
     border-bottom: var(--form-control-inverted-disabled-border-bottom);
 }
 /* FOCUS STATE */
-.form-control__focused_1ivrw:not(.form-control__disabled_1ivrw):not(.form-control__hasError_1ivrw):before {
+.form-control__focused_1gnnm:not(.form-control__disabled_1gnnm):not(.form-control__hasError_1gnnm):before {
     border-bottom: var(--form-control-inverted-focus-border-bottom);
 }
-.form-control__focused_1ivrw.form-control__inner_1ivrw {
+.form-control__focused_1gnnm.form-control__inner_1gnnm {
     background-color: var(--form-control-inverted-focus-bg-color);
 }
 /* HOVER STATE */
-.form-control__inner_1ivrw:not(.form-control__disabled_1ivrw):hover {
+.form-control__inner_1gnnm:not(.form-control__disabled_1gnnm):hover {
     background-color: var(--form-control-inverted-hover-bg-color);
 }
 /* ERROR STATE */
-.form-control__error_1ivrw {
+.form-control__error_1gnnm {
     color: var(--form-control-inverted-error-color);
 }
-.form-control__hasError_1ivrw .form-control__label_1ivrw {
+.form-control__hasError_1gnnm .form-control__label_1gnnm {
     color: var(--form-control-inverted-error-label-color);
 }
-.form-control__hasError_1ivrw {
+.form-control__hasError_1gnnm {
     box-shadow: var(--form-control-inverted-error-shadow);
 }
-.form-control__hasError_1ivrw:before {
+.form-control__hasError_1gnnm:before {
     border-bottom: var(--form-control-inverted-error-border-bottom);
 }