@alfalab/core-components 33.0.0 → 33.0.1-beta.0

package/badge/index.css

@@ -31,7 +31,7 @@
 :root {
     --badge-icon-bg-color: var(--color-light-bg-primary);
 }
-.badge__component_xpble {
+.badge__component_16xdm {
     font-size: 12px;
     line-height: 16px;
     font-weight: 700;
@@ -47,117 +47,117 @@
     color: var(--color-light-text-primary-inverted);
     overflow: hidden;
 }
-.badge__count_xpble {
+.badge__count_16xdm {
     display: inline-flex;
     padding: 2px;
 }
-.badge__outlineCount_xpble {
+.badge__outlineCount_16xdm {
     background-color: var(--badge-icon-bg-color);
     border-radius: 99px;
 }
-.badge__s_xpble {
+.badge__s_16xdm {
     height: 16px;
     min-width: 16px;
     padding: 0 var(--gap-2xs);
 }
-.badge__m_xpble {
+.badge__m_16xdm {
     height: 20px;
     min-width: 20px;
     padding: 0 6px;
 }
-.badge__l_xpble {
+.badge__l_16xdm {
     height: 24px;
     min-width: 24px;
     padding: 0 6px;
 }
-.badge__heightS_xpble {
+.badge__heightS_16xdm {
     font-size: 11px;
     line-height: 16px;
     font-weight: 700;
     padding: 0 var(--gap-2xs);
 }
-.badge__heightM_xpble {
+.badge__heightM_16xdm {
     font-size: 14px;
     line-height: 20px;
     font-weight: 700;
     padding: 0 var(--gap-2xs);
 }
-.badge__heightL_xpble {
+.badge__heightL_16xdm {
     font-size: 14px;
     line-height: 20px;
     font-weight: 700;
     padding: 0 var(--gap-xs);
 }
-.badge__heightXL_xpble {
+.badge__heightXL_16xdm {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
     padding: 0 var(--gap-s);
 }
-.badge__heightXXL_xpble {
+.badge__heightXXL_16xdm {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
     padding: 0 var(--gap-m);
 }
-.badge__wrapper_xpble {
+.badge__wrapper_16xdm {
     border-radius: 50%;
     box-sizing: border-box
 }
-.badge__wrapper_xpble.badge__s_xpble {
+.badge__wrapper_16xdm.badge__s_16xdm {
         padding: 2px;
         width: 18px;
         height: 18px;
     }
-.badge__wrapper_xpble.badge__m_xpble {
+.badge__wrapper_16xdm.badge__m_16xdm {
         padding: 2px;
         width: 24px;
         height: 24px;
     }
-.badge__wrapper_xpble.badge__xl_xpble {
+.badge__wrapper_16xdm.badge__xl_16xdm {
         padding: 5px;
         width: 40px;
         height: 40px;
     }
-.badge__icon_xpble {
+.badge__icon_16xdm {
     height: auto;
     min-width: 0;
     padding: 0;
     color: var(--color-light-graphic-positive)
 }
-.badge__icon_xpble.badge__positive_xpble {
+.badge__icon_16xdm.badge__positive_16xdm {
         color: var(--color-light-graphic-positive);
         background-color: var(--color-light-graphic-positive);
     }
-.badge__icon_xpble.badge__attention_xpble {
+.badge__icon_16xdm.badge__attention_16xdm {
         color: var(--color-light-graphic-attention);
         background-color: var(--color-light-graphic-attention);
     }
-.badge__icon_xpble.badge__negative_xpble {
+.badge__icon_16xdm.badge__negative_16xdm {
         color: var(--color-light-graphic-negative);
         background-color: var(--color-light-graphic-negative);
     }
-.badge__icon_xpble.badge__link_xpble {
+.badge__icon_16xdm.badge__link_16xdm {
         color: var(--color-light-graphic-link);
         background-color: var(--color-light-graphic-link);
     }
-.badge__icon_xpble.badge__tertiary_xpble {
+.badge__icon_16xdm.badge__tertiary_16xdm {
         color: var(--color-light-graphic-tertiary);
         background-color: var(--color-light-graphic-tertiary);
     }
-.badge__icon_xpble.badge__secondary_xpble {
+.badge__icon_16xdm.badge__secondary_16xdm {
         color: var(--color-light-graphic-secondary);
         background-color: var(--color-light-graphic-secondary);
     }
-.badge__icon_xpble.badge__primary_xpble {
+.badge__icon_16xdm.badge__primary_16xdm {
         color: var(--color-light-graphic-primary);
         background-color: var(--color-light-graphic-primary);
     }
-.badge__icon_xpble.badge__s_xpble {
+.badge__icon_16xdm.badge__s_16xdm {
     width: 14px;
     height: 14px;
 }
-.badge__icon_xpble:before {
+.badge__icon_16xdm:before {
     position: absolute;
     z-index: -1;
     left: 18%;
@@ -168,44 +168,44 @@
     border-radius: var(--border-radius-pill);
     content: '';
 }
-.badge__outline_xpble {
+.badge__outline_16xdm {
     background-color: var(--badge-icon-bg-color);
 }
-.badge__outlineColor_xpble.badge__attention_xpble {
+.badge__outlineColor_16xdm.badge__attention_16xdm {
         background-color: var(--color-light-graphic-attention);
     }
-.badge__outlineColor_xpble.badge__positive_xpble {
+.badge__outlineColor_16xdm.badge__positive_16xdm {
         background-color: var(--color-light-graphic-positive);
     }
-.badge__outlineColor_xpble.badge__negative_xpble {
+.badge__outlineColor_16xdm.badge__negative_16xdm {
         background-color: var(--color-light-graphic-negative);
     }
-.badge__outlineColor_xpble.badge__link_xpble {
+.badge__outlineColor_16xdm.badge__link_16xdm {
         background-color: var(--color-light-graphic-link);
     }
-.badge__outlineColor_xpble .badge__tertiary_xpble {
+.badge__outlineColor_16xdm .badge__tertiary_16xdm {
         background-color: var(--color-light-graphic-tertiary);
     }
-.badge__outlineColor_xpble.badge__secondary_xpble {
+.badge__outlineColor_16xdm.badge__secondary_16xdm {
         background-color: var(--color-light-graphic-secondary);
     }
-.badge__outlineColor_xpble.badge__primary_xpble {
+.badge__outlineColor_16xdm.badge__primary_16xdm {
         background-color: var(--color-light-graphic-primary);
     }
-.badge__dot_xpble {
+.badge__dot_16xdm {
     width: 8px;
     height: 8px;
     min-width: 0;
     padding: 0;
 }
-.badge__isHidden_xpble {
+.badge__isHidden_16xdm {
     display: none;
 }
-.badge__m_xpble svg {
+.badge__m_16xdm svg {
     width: 20px;
     height: 20px;
 }
-.badge__xl_xpble svg {
+.badge__xl_16xdm svg {
     width: 30px;
     height: 30px;
 }

package/badge/modern/Component.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"component":"badge__component_xpble","count":"badge__count_xpble","outlineCount":"badge__outlineCount_xpble","s":"badge__s_xpble","m":"badge__m_xpble","l":"badge__l_xpble","heightS":"badge__heightS_xpble","heightM":"badge__heightM_xpble","heightL":"badge__heightL_xpble","heightXL":"badge__heightXL_xpble","heightXXL":"badge__heightXXL_xpble","wrapper":"badge__wrapper_xpble","xl":"badge__xl_xpble","icon":"badge__icon_xpble","positive":"badge__positive_xpble","attention":"badge__attention_xpble","negative":"badge__negative_xpble","link":"badge__link_xpble","tertiary":"badge__tertiary_xpble","secondary":"badge__secondary_xpble","primary":"badge__primary_xpble","outline":"badge__outline_xpble","outlineColor":"badge__outlineColor_xpble","dot":"badge__dot_xpble","isHidden":"badge__isHidden_xpble"};
+var styles = {"component":"badge__component_16xdm","count":"badge__count_16xdm","outlineCount":"badge__outlineCount_16xdm","s":"badge__s_16xdm","m":"badge__m_16xdm","l":"badge__l_16xdm","heightS":"badge__heightS_16xdm","heightM":"badge__heightM_16xdm","heightL":"badge__heightL_16xdm","heightXL":"badge__heightXL_16xdm","heightXXL":"badge__heightXXL_16xdm","wrapper":"badge__wrapper_16xdm","xl":"badge__xl_16xdm","icon":"badge__icon_16xdm","positive":"badge__positive_16xdm","attention":"badge__attention_16xdm","negative":"badge__negative_16xdm","link":"badge__link_16xdm","tertiary":"badge__tertiary_16xdm","secondary":"badge__secondary_16xdm","primary":"badge__primary_16xdm","outline":"badge__outline_16xdm","outlineColor":"badge__outlineColor_16xdm","dot":"badge__dot_16xdm","isHidden":"badge__isHidden_16xdm"};
 require('./index.css');
 
 const Badge = ({ className, size = 'm', view, visibleIconOutline = false, visibleColorOutline = false, content, height = 16, iconColor, dataTestId, }) => {

package/badge/modern/index.css

@@ -31,7 +31,7 @@
 :root {
     --badge-icon-bg-color: var(--color-light-bg-primary);
 }
-.badge__component_xpble {
+.badge__component_16xdm {
     font-size: 12px;
     line-height: 16px;
     font-weight: 700;
@@ -47,117 +47,117 @@
     color: var(--color-light-text-primary-inverted);
     overflow: hidden;
 }
-.badge__count_xpble {
+.badge__count_16xdm {
     display: inline-flex;
     padding: 2px;
 }
-.badge__outlineCount_xpble {
+.badge__outlineCount_16xdm {
     background-color: var(--badge-icon-bg-color);
     border-radius: 99px;
 }
-.badge__s_xpble {
+.badge__s_16xdm {
     height: 16px;
     min-width: 16px;
     padding: 0 var(--gap-2xs);
 }
-.badge__m_xpble {
+.badge__m_16xdm {
     height: 20px;
     min-width: 20px;
     padding: 0 6px;
 }
-.badge__l_xpble {
+.badge__l_16xdm {
     height: 24px;
     min-width: 24px;
     padding: 0 6px;
 }
-.badge__heightS_xpble {
+.badge__heightS_16xdm {
     font-size: 11px;
     line-height: 16px;
     font-weight: 700;
     padding: 0 var(--gap-2xs);
 }
-.badge__heightM_xpble {
+.badge__heightM_16xdm {
     font-size: 14px;
     line-height: 20px;
     font-weight: 700;
     padding: 0 var(--gap-2xs);
 }
-.badge__heightL_xpble {
+.badge__heightL_16xdm {
     font-size: 14px;
     line-height: 20px;
     font-weight: 700;
     padding: 0 var(--gap-xs);
 }
-.badge__heightXL_xpble {
+.badge__heightXL_16xdm {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
     padding: 0 var(--gap-s);
 }
-.badge__heightXXL_xpble {
+.badge__heightXXL_16xdm {
     font-size: 16px;
     line-height: 24px;
     font-weight: 700;
     padding: 0 var(--gap-m);
 }
-.badge__wrapper_xpble {
+.badge__wrapper_16xdm {
     border-radius: 50%;
     box-sizing: border-box
 }
-.badge__wrapper_xpble.badge__s_xpble {
+.badge__wrapper_16xdm.badge__s_16xdm {
         padding: 2px;
         width: 18px;
         height: 18px;
     }
-.badge__wrapper_xpble.badge__m_xpble {
+.badge__wrapper_16xdm.badge__m_16xdm {
         padding: 2px;
         width: 24px;
         height: 24px;
     }
-.badge__wrapper_xpble.badge__xl_xpble {
+.badge__wrapper_16xdm.badge__xl_16xdm {
         padding: 5px;
         width: 40px;
         height: 40px;
     }
-.badge__icon_xpble {
+.badge__icon_16xdm {
     height: auto;
     min-width: 0;
     padding: 0;
     color: var(--color-light-graphic-positive)
 }
-.badge__icon_xpble.badge__positive_xpble {
+.badge__icon_16xdm.badge__positive_16xdm {
         color: var(--color-light-graphic-positive);
         background-color: var(--color-light-graphic-positive);
     }
-.badge__icon_xpble.badge__attention_xpble {
+.badge__icon_16xdm.badge__attention_16xdm {
         color: var(--color-light-graphic-attention);
         background-color: var(--color-light-graphic-attention);
     }
-.badge__icon_xpble.badge__negative_xpble {
+.badge__icon_16xdm.badge__negative_16xdm {
         color: var(--color-light-graphic-negative);
         background-color: var(--color-light-graphic-negative);
     }
-.badge__icon_xpble.badge__link_xpble {
+.badge__icon_16xdm.badge__link_16xdm {
         color: var(--color-light-graphic-link);
         background-color: var(--color-light-graphic-link);
     }
-.badge__icon_xpble.badge__tertiary_xpble {
+.badge__icon_16xdm.badge__tertiary_16xdm {
         color: var(--color-light-graphic-tertiary);
         background-color: var(--color-light-graphic-tertiary);
     }
-.badge__icon_xpble.badge__secondary_xpble {
+.badge__icon_16xdm.badge__secondary_16xdm {
         color: var(--color-light-graphic-secondary);
         background-color: var(--color-light-graphic-secondary);
     }
-.badge__icon_xpble.badge__primary_xpble {
+.badge__icon_16xdm.badge__primary_16xdm {
         color: var(--color-light-graphic-primary);
         background-color: var(--color-light-graphic-primary);
     }
-.badge__icon_xpble.badge__s_xpble {
+.badge__icon_16xdm.badge__s_16xdm {
     width: 14px;
     height: 14px;
 }
-.badge__icon_xpble:before {
+.badge__icon_16xdm:before {
     position: absolute;
     z-index: -1;
     left: 18%;
@@ -168,44 +168,44 @@
     border-radius: var(--border-radius-pill);
     content: '';
 }
-.badge__outline_xpble {
+.badge__outline_16xdm {
     background-color: var(--badge-icon-bg-color);
 }
-.badge__outlineColor_xpble.badge__attention_xpble {
+.badge__outlineColor_16xdm.badge__attention_16xdm {
         background-color: var(--color-light-graphic-attention);
     }
-.badge__outlineColor_xpble.badge__positive_xpble {
+.badge__outlineColor_16xdm.badge__positive_16xdm {
         background-color: var(--color-light-graphic-positive);
     }
-.badge__outlineColor_xpble.badge__negative_xpble {
+.badge__outlineColor_16xdm.badge__negative_16xdm {
         background-color: var(--color-light-graphic-negative);
     }
-.badge__outlineColor_xpble.badge__link_xpble {
+.badge__outlineColor_16xdm.badge__link_16xdm {
         background-color: var(--color-light-graphic-link);
     }
-.badge__outlineColor_xpble .badge__tertiary_xpble {
+.badge__outlineColor_16xdm .badge__tertiary_16xdm {
         background-color: var(--color-light-graphic-tertiary);
     }
-.badge__outlineColor_xpble.badge__secondary_xpble {
+.badge__outlineColor_16xdm.badge__secondary_16xdm {
         background-color: var(--color-light-graphic-secondary);
     }
-.badge__outlineColor_xpble.badge__primary_xpble {
+.badge__outlineColor_16xdm.badge__primary_16xdm {
         background-color: var(--color-light-graphic-primary);
     }
-.badge__dot_xpble {
+.badge__dot_16xdm {
     width: 8px;
     height: 8px;
     min-width: 0;
     padding: 0;
 }
-.badge__isHidden_xpble {
+.badge__isHidden_16xdm {
     display: none;
 }
-.badge__m_xpble svg {
+.badge__m_16xdm svg {
     width: 20px;
     height: 20px;
 }
-.badge__xl_xpble svg {
+.badge__xl_16xdm svg {
     width: 30px;
     height: 30px;
 }

package/bank-card/Component.js

@@ -15,7 +15,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"component":"bank-card__component_eujo4","aspectRatioContainer":"bank-card__aspectRatioContainer_eujo4","content":"bank-card__content_eujo4","label":"bank-card__label_eujo4","focused":"bank-card__focused_eujo4","filled":"bank-card__filled_eujo4","input":"bank-card__input_eujo4","bankLogo":"bank-card__bankLogo_eujo4","brandLogo":"bank-card__brandLogo_eujo4","usePhoto":"bank-card__usePhoto_eujo4"};
+var styles = {"component":"bank-card__component_6w765","aspectRatioContainer":"bank-card__aspectRatioContainer_6w765","content":"bank-card__content_6w765","label":"bank-card__label_6w765","focused":"bank-card__focused_6w765","filled":"bank-card__filled_6w765","input":"bank-card__input_6w765","bankLogo":"bank-card__bankLogo_6w765","brandLogo":"bank-card__brandLogo_6w765","usePhoto":"bank-card__usePhoto_6w765"};
 require('./index.css');
 
 // prettier-ignore

package/bank-card/esm/Component.js

@@ -8,7 +8,7 @@ import { MastercardLIcon } from '@alfalab/icons-logotype/MastercardLIcon';
 import { MirXxlIcon } from '@alfalab/icons-logotype/MirXxlIcon';
 import { validateCardNumber } from './utils.js';
 
-var styles = {"component":"bank-card__component_eujo4","aspectRatioContainer":"bank-card__aspectRatioContainer_eujo4","content":"bank-card__content_eujo4","label":"bank-card__label_eujo4","focused":"bank-card__focused_eujo4","filled":"bank-card__filled_eujo4","input":"bank-card__input_eujo4","bankLogo":"bank-card__bankLogo_eujo4","brandLogo":"bank-card__brandLogo_eujo4","usePhoto":"bank-card__usePhoto_eujo4"};
+var styles = {"component":"bank-card__component_6w765","aspectRatioContainer":"bank-card__aspectRatioContainer_6w765","content":"bank-card__content_6w765","label":"bank-card__label_6w765","focused":"bank-card__focused_6w765","filled":"bank-card__filled_6w765","input":"bank-card__input_6w765","bankLogo":"bank-card__bankLogo_6w765","brandLogo":"bank-card__brandLogo_6w765","usePhoto":"bank-card__usePhoto_6w765"};
 require('./index.css');
 
 // prettier-ignore

package/bank-card/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 1pp0w */
+/* hash: e8n6i */
 :root {
     --color-black: #000;
     --color-black-60: rgba(0, 0, 0, 0.6);
@@ -23,7 +23,7 @@
 :root {
     --border-radius-l: 12px;
 }
-.bank-card__component_eujo4 {
+.bank-card__component_6w765 {
     /* TODO: как это будет собираться и работать в webView */
     --form-control-border-radius: 0;
     --form-control-border-bottom: 1px solid var(--color-black-60);
@@ -42,11 +42,11 @@
 
     font-family: var(--font-family-styrene);
 }
-.bank-card__aspectRatioContainer_eujo4 {
+.bank-card__aspectRatioContainer_6w765 {
     /* Эталонный размер 343x215 */
     padding-bottom: 62.6%;
 }
-.bank-card__content_eujo4 {
+.bank-card__content_6w765 {
     position: absolute;
     top: 0;
     right: 0;
@@ -59,7 +59,7 @@
     border-radius: var(--border-radius-l);
     box-sizing: border-box;
 }
-.bank-card__label_eujo4 {
+.bank-card__label_6w765 {
     left: 0;
     transform: translateY(-1px);
     color: var(--color-black-60);
@@ -67,25 +67,25 @@
     line-height: 24px
 }
 @media (max-width: 360px) {
-.bank-card__label_eujo4 {
+.bank-card__label_6w765 {
         font-size: 16px
 }
     }
-.bank-card__focused_eujo4 .bank-card__label_eujo4,
-.bank-card__filled_eujo4 .bank-card__label_eujo4 {
+.bank-card__focused_6w765 .bank-card__label_6w765,
+.bank-card__filled_6w765 .bank-card__label_6w765 {
     color: var(--color-black);
     transform: translateY(-19px) scale(0.6)
 }
 @media (max-width: 360px) {
-.bank-card__focused_eujo4 .bank-card__label_eujo4,
-.bank-card__filled_eujo4 .bank-card__label_eujo4 {
+.bank-card__focused_6w765 .bank-card__label_6w765,
+.bank-card__filled_6w765 .bank-card__label_6w765 {
         transform: translateY(-22px) scale(0.75)
 }
     }
-.bank-card__focused_eujo4:before {
+.bank-card__focused_6w765:before {
     transform: scale(1) !important;
 }
-.bank-card__input_eujo4 {
+.bank-card__input_6w765 {
     font-size: 20px;
     line-height: 24px;
     font-weight: 400;
@@ -99,33 +99,33 @@
     padding-left: 0 !important
 }
 @media (max-width: 360px) {
-.bank-card__input_eujo4 {
+.bank-card__input_6w765 {
         font-size: 16px
 }
     }
-.bank-card__bankLogo_eujo4 {
+.bank-card__bankLogo_6w765 {
     position: absolute;
     top: 20px;
     left: 20px
 }
-.bank-card__bankLogo_eujo4 svg {
+.bank-card__bankLogo_6w765 svg {
         max-height: 32px;
         width: auto;
         display: block
     }
-.bank-card__bankLogo_eujo4 svg g {
+.bank-card__bankLogo_6w765 svg g {
             fill: var(--color-black);
         }
-.bank-card__brandLogo_eujo4 {
+.bank-card__brandLogo_6w765 {
     position: absolute;
     bottom: 20px;
     right: 20px
 }
-.bank-card__brandLogo_eujo4 svg {
+.bank-card__brandLogo_6w765 svg {
         display: block;
         fill: var(--color-black);
     }
-.bank-card__usePhoto_eujo4 {
+.bank-card__usePhoto_6w765 {
     display: block;
     margin: 0;
     padding: 0;
@@ -143,7 +143,7 @@
     /* В макете иконка прилегает к правому краю поля, а по дизайн-системе там должен быть отступ */
     margin-right: calc(var(--gap-s) * -1)
 }
-.bank-card__usePhoto_eujo4 svg {
+.bank-card__usePhoto_6w765 svg {
         fill: var(--color-black);
         display: block;
     }