@alfalab/core-components 47.5.0 → 47.6.0-beta.0

package/button/esm/components/base-button/index.css

@@ -111,7 +111,7 @@
     /* text mobile inverted */
 
     /* loader mobile */
-} .button__component_4e59w {
+} .button__component_11b67 {
     position: relative;
     display: inline-flex;
     vertical-align: middle;
@@ -132,159 +132,159 @@
     cursor: pointer;
     transition: background 0.2s ease, border 0.2s ease, color 0.2s ease;
     box-sizing: border-box;
-} .button__hug_4e59w {
+} .button__hug_11b67 {
     justify-content: center;
     text-align: center;
-} .button__fill_4e59w {
+} .button__fill_11b67 {
     text-align: left;
-} .button__hint_4e59w {
+} .button__hint_11b67 {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
 
     display: block;
-} .button__allowBackdropBlur_4e59w.button__secondary_4e59w,
-    .button__allowBackdropBlur_4e59w.button__accent_4e59w[disabled],
-    .button__allowBackdropBlur_4e59w.button__primary_4e59w[disabled] {
+} .button__allowBackdropBlur_11b67.button__secondary_11b67,
+    .button__allowBackdropBlur_11b67.button__accent_11b67[disabled],
+    .button__allowBackdropBlur_11b67.button__primary_11b67[disabled] {
         -webkit-backdrop-filter: blur(80px);
                 backdrop-filter: blur(80px);
-    } .button__focused_4e59w {
+    } .button__focused_11b67 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
-} .button__loading_4e59w .button__label_4e59w,
-.button__loading_4e59w .button__addons_4e59w {
+} .button__loading_11b67 .button__label_11b67,
+.button__loading_11b67 .button__addons_11b67 {
     opacity: 0;
-} .button__stretchText_4e59w {
+} .button__stretchText_11b67 {
     flex-grow: 1;
-} .button__loader_4e59w {
+} .button__loader_11b67 {
     position: absolute;
     left: 0;
     right: 0;
     margin: 0 auto;
 } /* Size */ /* За счет того, что у кнопок есть border 1px,
-для полного соответствия макетам padding необходимо уменьшить на 1px (16px -> 15px) */ .button__size-32_4e59w {
+для полного соответствия макетам padding необходимо уменьшить на 1px (16px -> 15px) */ .button__size-32_11b67 {
     min-width: 80px;
     min-height: var(--size-xxs-height);
     padding: 0 15px;
     font-size: 14px
-} .button__size-32_4e59w.button__iconOnly_4e59w {
+} .button__size-32_11b67.button__iconOnly_11b67 {
         min-width: var(--size-xxs-height);
-    } .button__size-40_4e59w {
+    } .button__size-40_11b67 {
     min-width: 88px;
     min-height: var(--size-xs-height);
     padding: 0 19px;
     font-size: 14px
-} .button__size-40_4e59w.button__iconOnly_4e59w {
+} .button__size-40_11b67.button__iconOnly_11b67 {
         min-width: var(--size-xs-height);
-    } .button__size-48_4e59w {
+    } .button__size-48_11b67 {
     min-width: 104px;
     min-height: var(--size-s-height);
     font-size: 16px;
     line-height: 24px
-} .button__size-48_4e59w.button__iconOnly_4e59w {
+} .button__size-48_11b67.button__iconOnly_11b67 {
         min-width: var(--size-s-height);
-    } .button__size-56_4e59w {
+    } .button__size-56_11b67 {
     min-width: 128px;
     min-height: var(--size-m-height);
     padding: 0 27px;
     font-size: 16px;
     line-height: 24px
-} .button__size-56_4e59w.button__iconOnly_4e59w {
+} .button__size-56_11b67.button__iconOnly_11b67 {
         min-width: var(--size-m-height);
-    } .button__size-64_4e59w {
+    } .button__size-64_11b67 {
     min-width: 160px;
     min-height: var(--size-l-height);
     padding: 0 31px;
     font-size: 18px;
     line-height: 24px
-} .button__size-64_4e59w.button__iconOnly_4e59w {
+} .button__size-64_11b67.button__iconOnly_11b67 {
         min-width: var(--size-l-height);
-    } .button__size-72_4e59w {
+    } .button__size-72_11b67 {
     min-width: 168px;
     min-height: var(--size-xl-height);
     padding: 0 35px;
     font-size: 18px;
     line-height: 24px
-} .button__size-72_4e59w.button__iconOnly_4e59w {
+} .button__size-72_11b67.button__iconOnly_11b67 {
         min-width: var(--size-xl-height);
-    } .button__withRightAddons_4e59w.button__size-32_4e59w {
+    } .button__withRightAddons_11b67.button__size-32_11b67 {
         padding-right: 11px;
-    } .button__withRightAddons_4e59w.button__size-40_4e59w {
+    } .button__withRightAddons_11b67.button__size-40_11b67 {
         padding-right: 15px;
-    } .button__withRightAddons_4e59w.button__size-48_4e59w {
+    } .button__withRightAddons_11b67.button__size-48_11b67 {
         padding-right: 19px;
-    } .button__withRightAddons_4e59w.button__size-56_4e59w {
+    } .button__withRightAddons_11b67.button__size-56_11b67 {
         padding-right: 23px;
-    } .button__withRightAddons_4e59w.button__size-64_4e59w {
+    } .button__withRightAddons_11b67.button__size-64_11b67 {
         padding-right: 27px;
-    } .button__withRightAddons_4e59w.button__size-72_4e59w {
+    } .button__withRightAddons_11b67.button__size-72_11b67 {
         padding-right: 31px;
-    } .button__withRightAddons_4e59w.button__ghost_4e59w,
-    .button__withRightAddons_4e59w.button__text_4e59w {
+    } .button__withRightAddons_11b67.button__ghost_11b67,
+    .button__withRightAddons_11b67.button__text_11b67 {
         padding-right: 0;
-    } .button__withLeftAddons_4e59w.button__size-32_4e59w {
+    } .button__withLeftAddons_11b67.button__size-32_11b67 {
         padding-left: 11px;
-    } .button__withLeftAddons_4e59w.button__size-40_4e59w {
+    } .button__withLeftAddons_11b67.button__size-40_11b67 {
         padding-left: 15px;
-    } .button__withLeftAddons_4e59w.button__size-48_4e59w {
+    } .button__withLeftAddons_11b67.button__size-48_11b67 {
         padding-left: 19px;
-    } .button__withLeftAddons_4e59w.button__size-56_4e59w {
+    } .button__withLeftAddons_11b67.button__size-56_11b67 {
         padding-left: 23px;
-    } .button__withLeftAddons_4e59w.button__size-64_4e59w {
+    } .button__withLeftAddons_11b67.button__size-64_11b67 {
         padding-left: 27px;
-    } .button__withLeftAddons_4e59w.button__size-72_4e59w {
+    } .button__withLeftAddons_11b67.button__size-72_11b67 {
         padding-left: 31px;
-    } .button__withLeftAddons_4e59w.button__ghost_4e59w,
-    .button__withLeftAddons_4e59w.button__text_4e59w {
+    } .button__withLeftAddons_11b67.button__ghost_11b67,
+    .button__withLeftAddons_11b67.button__text_11b67 {
         padding-left: 0;
-    } .button__link_4e59w,
-.button__transparent_4e59w {
+    } .button__link_11b67,
+.button__transparent_11b67 {
     min-width: 0;
-} .button__ghost_4e59w.button__ghost_4e59w,
-.button__text_4e59w.button__text_4e59w {
+} .button__ghost_11b67.button__ghost_11b67,
+.button__text_11b67.button__text_11b67 {
     min-width: 0;
     min-height: 0;
     padding: 0;
     border: none;
     appearance: none
-} .button__ghost_4e59w.button__ghost_4e59w.button__iconOnly_4e59w, .button__text_4e59w.button__text_4e59w.button__iconOnly_4e59w {
+} .button__ghost_11b67.button__ghost_11b67.button__iconOnly_11b67, .button__text_11b67.button__text_11b67.button__iconOnly_11b67 {
         min-width: 0;
-    } /* Disabled */ .button__component_4e59w[disabled] {
+    } /* Disabled */ .button__component_11b67[disabled] {
     cursor: var(--disabled-cursor)
-} .button__component_4e59w[disabled] * {
+} .button__component_11b67[disabled] * {
         pointer-events: none;
-    } /* Addons */ .button__addons_4e59w {
+    } /* Addons */ .button__addons_11b67 {
     display: flex;
     flex-shrink: 0;
     align-items: center;
     margin: 0
-} .button__addons_4e59w:first-child {
+} .button__addons_11b67:first-child {
         margin-right: 6px;
-    } .button__addons_4e59w:last-child {
+    } .button__addons_11b67:last-child {
         margin-left: 6px;
-    } .button__addons_4e59w:only-child {
+    } .button__addons_11b67:only-child {
         margin: 0;
-    } .button__size-48_4e59w .button__addons_4e59w:first-child, .button__size-56_4e59w .button__addons_4e59w:first-child {
+    } .button__size-48_11b67 .button__addons_11b67:first-child, .button__size-56_11b67 .button__addons_11b67:first-child {
         margin-right: var(--gap-xs);
-    } .button__size-48_4e59w .button__addons_4e59w:last-child, .button__size-56_4e59w .button__addons_4e59w:last-child {
+    } .button__size-48_11b67 .button__addons_11b67:last-child, .button__size-56_11b67 .button__addons_11b67:last-child {
         margin-left: var(--gap-xs);
-    } .button__size-48_4e59w .button__addons_4e59w:only-child, .button__size-56_4e59w .button__addons_4e59w:only-child {
+    } .button__size-48_11b67 .button__addons_11b67:only-child, .button__size-56_11b67 .button__addons_11b67:only-child {
         margin: 0;
-    } .button__size-64_4e59w .button__addons_4e59w:first-child, .button__size-72_4e59w .button__addons_4e59w:first-child {
+    } .button__size-64_11b67 .button__addons_11b67:first-child, .button__size-72_11b67 .button__addons_11b67:first-child {
         margin-right: var(--gap-s);
-    } .button__size-64_4e59w .button__addons_4e59w:last-child, .button__size-72_4e59w .button__addons_4e59w:last-child {
+    } .button__size-64_11b67 .button__addons_11b67:last-child, .button__size-72_11b67 .button__addons_11b67:last-child {
         margin-left: var(--gap-s);
-    } .button__size-64_4e59w .button__addons_4e59w:only-child, .button__size-72_4e59w .button__addons_4e59w:only-child {
+    } .button__size-64_11b67 .button__addons_11b67:only-child, .button__size-72_11b67 .button__addons_11b67:only-child {
         margin: 0;
-    } .button__iconOnly_4e59w {
+    } .button__iconOnly_11b67 {
     padding: 0;
-} /* Block */ .button__block_4e59w {
+} /* Block */ .button__block_11b67 {
     display: flex;
     width: 100%;
-} /* Nowrap */ .button__nowrap_4e59w {
+} /* Nowrap */ .button__nowrap_11b67 {
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
-} .button__rounded_4e59w {
+} .button__rounded_11b67 {
     border-radius: var(--border-radius-pill);
 }

package/button/esm/components/base-button/inverted.css

@@ -168,141 +168,141 @@
     /* text mobile inverted */
 
     /* loader mobile */
-} .button__accent_iofn4 {
+} .button__accent_fbljf {
     color: var(--button-inverted-accent-color);
     background-color: var(--button-inverted-accent-base-bg-color);
     border: 1px solid transparent
 } @media (hover: hover) {
-        .button__accent_iofn4:hover {
+        .button__accent_fbljf:hover {
             background-color: var(--button-inverted-accent-hover-bg-color);
         }
-    } .button__accent_iofn4:active {
+    } .button__accent_fbljf:active {
         background-color: var(--button-inverted-accent-active-bg-color);
-    } .button__accent_iofn4 > .button__loader_iofn4 {
+    } .button__accent_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-static-color);
-    } .button__primary_iofn4 {
+    } .button__primary_fbljf {
     border: 1px solid transparent;
-} .button__secondary_iofn4 {
+} .button__secondary_fbljf {
     color: var(--button-inverted-secondary-color);
     border: 1px solid var(--button-inverted-secondary-base-border-color)
-} .button__secondary_iofn4 > .button__loader_iofn4 {
+} .button__secondary_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__outlined_iofn4 {
+    } .button__outlined_fbljf {
     color: var(--button-inverted-outlined-color);
     background-color: var(--button-inverted-outlined-base-bg-color);
     border: 1px solid var(--button-inverted-outlined-base-border-color)
 } @media (hover: hover) {
-        .button__outlined_iofn4:hover {
+        .button__outlined_fbljf:hover {
             background-color: var(--button-inverted-outlined-hover-bg-color);
             border-color: var(--button-inverted-outlined-hover-border-color);
         }
-    } .button__outlined_iofn4:active {
+    } .button__outlined_fbljf:active {
         background-color: var(--button-inverted-outlined-active-bg-color);
-    } .button__outlined_iofn4 > .button__loader_iofn4 {
+    } .button__outlined_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__tertiary_iofn4 {
+    } .button__tertiary_fbljf {
     color: var(--button-inverted-tertiary-color);
     background-color: var(--button-inverted-tertiary-base-bg-color);
     border: 1px solid var(--button-inverted-tertiary-base-border-color)
 } @media (hover: hover) {
-        .button__tertiary_iofn4:hover {
+        .button__tertiary_fbljf:hover {
             background-color: var(--button-inverted-tertiary-hover-bg-color);
             border-color: var(--button-inverted-tertiary-hover-border-color);
         }
-    } .button__tertiary_iofn4:active {
+    } .button__tertiary_fbljf:active {
         background-color: var(--button-inverted-tertiary-active-bg-color);
-    } .button__tertiary_iofn4 > .button__loader_iofn4 {
+    } .button__tertiary_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__filled_iofn4 {
+    } .button__filled_fbljf {
     color: var(--color-light-text-primary-inverted);
     background-color: var(--color-light-neutral-translucent-300-inverted);
     border: 1px solid transparent
 } @media (hover: hover) {
-        .button__filled_iofn4:hover {
+        .button__filled_fbljf:hover {
             background-color: var(--color-light-neutral-translucent-300-inverted-hover);
         }
-    } .button__filled_iofn4:active {
+    } .button__filled_fbljf:active {
         background-color: var(--color-light-neutral-translucent-300-inverted-press);
-    } .button__filled_iofn4 > .button__loader_iofn4 {
+    } .button__filled_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__transparent_iofn4 {
+    } .button__transparent_fbljf {
     color: var(--button-inverted-transparent-base-color);
     background-color: transparent;
     border: 1px solid transparent
 } @media (hover: hover) {
-        .button__transparent_iofn4:hover {
+        .button__transparent_fbljf:hover {
             background-color: var(--button-inverted-transparent-hover-bg-color);
         }
-    } .button__transparent_iofn4:active {
+    } .button__transparent_fbljf:active {
         background-color: var(--button-inverted-transparent-active-bg-color);
-    } .button__transparent_iofn4 > .button__loader_iofn4 {
+    } .button__transparent_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__link_iofn4 {
+    } .button__link_fbljf {
     color: var(--button-inverted-link-base-color);
     background-color: transparent;
     border: 1px solid transparent
 } @media (hover: hover) {
-        .button__link_iofn4:hover {
+        .button__link_fbljf:hover {
             background-color: var(--button-inverted-link-hover-bg-color);
         }
-    } .button__link_iofn4:active {
+    } .button__link_fbljf:active {
         /* TODO: какой цвет? */
         background-color: var(--button-inverted-link-active-bg-color);
-    } .button__link_iofn4 > .button__loader_iofn4 {
+    } .button__link_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__text_iofn4 {
+    } .button__text_fbljf {
     background-color: transparent;
     color: var(--button-inverted-text-base-color)
 } @media (hover: hover) {
-        .button__text_iofn4:hover {
+        .button__text_fbljf:hover {
             color: var(--button-inverted-text-hover-color);
         }
-    } .button__text_iofn4 > .button__loader_iofn4 {
+    } .button__text_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__ghost_iofn4 {
+    } .button__ghost_fbljf {
     background-color: transparent;
     color: var(--button-inverted-ghost-base-color)
 } @media (hover: hover) {
-        .button__ghost_iofn4:hover {
+        .button__ghost_fbljf:hover {
             color: var(--button-inverted-ghost-hover-color);
         }
-    } .button__ghost_iofn4 > .button__loader_iofn4 {
+    } .button__ghost_fbljf > .button__loader_fbljf {
         color: var(--button-spinner-inverted-color);
-    } .button__component_iofn4[disabled].button__accent_iofn4 {
+    } .button__component_fbljf[disabled].button__accent_fbljf {
         color: var(--button-inverted-accent-disabled-color);
         background-color: var(--button-inverted-accent-disabled-bg-color)
-    } .button__component_iofn4[disabled].button__accent_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__accent_fbljf.button__loading_fbljf {
             background-color: var(--button-inverted-accent-base-bg-color);
-        } .button__component_iofn4[disabled].button__secondary_iofn4 {
+        } .button__component_fbljf[disabled].button__secondary_fbljf {
         border-color: var(--button-inverted-secondary-disabled-border-color)
-    } .button__component_iofn4[disabled].button__secondary_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__secondary_fbljf.button__loading_fbljf {
             color: var(--button-inverted-secondary-color);
             background-color: var(--button-inverted-secondary-base-bg-color);
             border-color: var(--button-inverted-secondary-base-border-color);
-        } .button__component_iofn4[disabled].button__outlined_iofn4 {
+        } .button__component_fbljf[disabled].button__outlined_fbljf {
         background-color: var(--button-inverted-outlined-disabled-bg-color)
-    } .button__component_iofn4[disabled].button__outlined_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__outlined_fbljf.button__loading_fbljf {
             color: var(--button-inverted-outlined-color);
-        } .button__component_iofn4[disabled].button__tertiary_iofn4 {
+        } .button__component_fbljf[disabled].button__tertiary_fbljf {
         background-color: var(--button-inverted-tertiary-disabled-bg-color)
-    } .button__component_iofn4[disabled].button__tertiary_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__tertiary_fbljf.button__loading_fbljf {
             color: var(--button-inverted-tertiary-color);
-        } .button__component_iofn4[disabled].button__filled_iofn4 {
+        } .button__component_fbljf[disabled].button__filled_fbljf {
         color: var(--color-light-text-tertiary-inverted);
         background-color: var(--color-light-neutral-translucent-100-inverted)
-    } .button__component_iofn4[disabled].button__filled_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__filled_fbljf.button__loading_fbljf {
             color: var(--color-light-text-primary-inverted);
             background-color: var(--color-light-neutral-translucent-300-inverted);
-        } .button__component_iofn4[disabled].button__transparent_iofn4 {
+        } .button__component_fbljf[disabled].button__transparent_fbljf {
         background-color: transparent
-    } .button__component_iofn4[disabled].button__transparent_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__transparent_fbljf.button__loading_fbljf {
             color: var(--button-inverted-transparent-base-color);
-        } .button__component_iofn4[disabled].button__link_iofn4 {
+        } .button__component_fbljf[disabled].button__link_fbljf {
         background-color: transparent
-    } .button__component_iofn4[disabled].button__link_iofn4.button__loading_iofn4 {
+    } .button__component_fbljf[disabled].button__link_fbljf.button__loading_fbljf {
             color: var(--button-inverted-link-base-color);
-        } .button__component_iofn4[disabled].button__text_iofn4.button__loading_iofn4 {
+        } .button__component_fbljf[disabled].button__text_fbljf.button__loading_fbljf {
             color: var(--button-inverted-text-base-color);
-        } .button__component_iofn4[disabled].button__ghost_iofn4.button__loading_iofn4 {
+        } .button__component_fbljf[disabled].button__ghost_fbljf.button__loading_fbljf {
             color: var(--button-inverted-ghost-base-color);
         }

package/button/esm/desktop/Component.desktop.js

@@ -7,13 +7,13 @@ import '../../../shared/esm';
 import '../../../spinner/esm';
 import '@alfalab/hooks';
 
-var defaultColors = {"primary":"button__primary_2kh0t","loader":"button__loader_2kh0t","secondary":"button__secondary_2kh0t","text":"button__text_2kh0t","ghost":"button__ghost_2kh0t","component":"button__component_2kh0t","loading":"button__loading_2kh0t","outlined":"button__outlined_2kh0t","tertiary":"button__tertiary_2kh0t","transparent":"button__transparent_2kh0t","link":"button__link_2kh0t"};
+var defaultColors = {"primary":"button__primary_42fjx","loader":"button__loader_42fjx","secondary":"button__secondary_42fjx","text":"button__text_42fjx","ghost":"button__ghost_42fjx","component":"button__component_42fjx","loading":"button__loading_42fjx","outlined":"button__outlined_42fjx","tertiary":"button__tertiary_42fjx","transparent":"button__transparent_42fjx","link":"button__link_42fjx"};
 require('./default.desktop.css');
 
-var styles = {"size-32":"button__size-32_1mlev","size-40":"button__size-40_1mlev","size-48":"button__size-48_1mlev","size-56":"button__size-56_1mlev","size-64":"button__size-64_1mlev","size-72":"button__size-72_1mlev"};
+var styles = {"size-32":"button__size-32_1py8z","size-40":"button__size-40_1py8z","size-48":"button__size-48_1py8z","size-56":"button__size-56_1py8z","size-64":"button__size-64_1py8z","size-72":"button__size-72_1py8z"};
 require('./desktop.css');
 
-var invertedColors = {"primary":"button__primary_yjbkn","loader":"button__loader_yjbkn","secondary":"button__secondary_yjbkn","text":"button__text_yjbkn","ghost":"button__ghost_yjbkn","component":"button__component_yjbkn","loading":"button__loading_yjbkn","outlined":"button__outlined_yjbkn","tertiary":"button__tertiary_yjbkn","transparent":"button__transparent_yjbkn","link":"button__link_yjbkn"};
+var invertedColors = {"primary":"button__primary_11w5o","loader":"button__loader_11w5o","secondary":"button__secondary_11w5o","text":"button__text_11w5o","ghost":"button__ghost_11w5o","component":"button__component_11w5o","loading":"button__loading_11w5o","outlined":"button__outlined_11w5o","tertiary":"button__tertiary_11w5o","transparent":"button__transparent_11w5o","link":"button__link_11w5o"};
 require('./inverted.desktop.css');
 
 var colorStyles = {

package/button/esm/desktop/default.desktop.css

@@ -130,47 +130,47 @@
     /* text mobile inverted */
 
     /* loader mobile */
-} .button__primary_2kh0t {
+} .button__primary_42fjx {
     color: var(--button-primary-color);
     background-color: var(--button-primary-base-bg-color)
 } @media (hover: hover) {
-        .button__primary_2kh0t:hover {
+        .button__primary_42fjx:hover {
             background-color: var(--button-primary-hover-bg-color);
         }
-    } .button__primary_2kh0t:active {
+    } .button__primary_42fjx:active {
         background-color: var(--button-primary-active-bg-color);
-    } .button__primary_2kh0t > .button__loader_2kh0t {
+    } .button__primary_42fjx > .button__loader_42fjx {
         color: var(--button-spinner-primary-color);
-    } .button__secondary_2kh0t {
+    } .button__secondary_42fjx {
     background-color: var(--button-secondary-base-bg-color)
-} .button__secondary_2kh0t:hover {
+} .button__secondary_42fjx:hover {
         background-color: var(--button-secondary-hover-bg-color);
-    } .button__secondary_2kh0t:active {
+    } .button__secondary_42fjx:active {
         background-color: var(--button-secondary-active-bg-color);
-    } .button__text_2kh0t:active {
+    } .button__text_42fjx:active {
         color: var(--button-text-active-color);
-    } .button__ghost_2kh0t:active {
+    } .button__ghost_42fjx:active {
         color: var(--button-ghost-active-color);
-    } .button__component_2kh0t[disabled].button__primary_2kh0t {
+    } .button__component_42fjx[disabled].button__primary_42fjx {
         color: var(--button-primary-disabled-color);
         background-color: var(--button-primary-disabled-bg-color)
-    } .button__component_2kh0t[disabled].button__primary_2kh0t.button__loading_2kh0t {
+    } .button__component_42fjx[disabled].button__primary_42fjx.button__loading_42fjx {
             background-color: var(--button-primary-base-bg-color);
-        } .button__component_2kh0t[disabled].button__secondary_2kh0t {
+        } .button__component_42fjx[disabled].button__secondary_42fjx {
         color: var(--button-secondary-disabled-color);
         background-color: var(--button-secondary-disabled-bg-color);
-    } .button__component_2kh0t[disabled].button__outlined_2kh0t {
+    } .button__component_42fjx[disabled].button__outlined_42fjx {
         color: var(--button-outlined-disabled-color);
         border-color: var(--button-outlined-disabled-border-color);
-    } .button__component_2kh0t[disabled].button__tertiary_2kh0t {
+    } .button__component_42fjx[disabled].button__tertiary_42fjx {
         color: var(--button-tertiary-disabled-color);
         border-color: var(--button-tertiary-disabled-border-color);
-    } .button__component_2kh0t[disabled].button__transparent_2kh0t {
+    } .button__component_42fjx[disabled].button__transparent_42fjx {
         color: var(--button-transparent-disabled-color);
-    } .button__component_2kh0t[disabled].button__link_2kh0t {
+    } .button__component_42fjx[disabled].button__link_42fjx {
         color: var(--button-link-disabled-color);
-    } .button__component_2kh0t[disabled].button__text_2kh0t {
+    } .button__component_42fjx[disabled].button__text_42fjx {
         color: var(--button-text-disabled-color);
-    } .button__component_2kh0t[disabled].button__ghost_2kh0t {
+    } .button__component_42fjx[disabled].button__ghost_42fjx {
         color: var(--button-ghost-disabled-color);
     }

package/button/esm/desktop/desktop.css

@@ -104,16 +104,16 @@
     /* text mobile inverted */
 
     /* loader mobile */
-} .button__size-32_1mlev {
+} .button__size-32_1py8z {
     border-radius: var(--button-xxs-size-border-radius);
-} .button__size-40_1mlev {
+} .button__size-40_1py8z {
     border-radius: var(--button-xs-size-border-radius);
-} .button__size-48_1mlev {
+} .button__size-48_1py8z {
     border-radius: var(--button-s-size-border-radius);
-} .button__size-56_1mlev {
+} .button__size-56_1py8z {
     border-radius: var(--button-m-size-border-radius);
-} .button__size-64_1mlev {
+} .button__size-64_1py8z {
     border-radius: var(--button-l-size-border-radius);
-} .button__size-72_1mlev {
+} .button__size-72_1py8z {
     border-radius: var(--button-xl-size-border-radius);
 }

package/button/esm/desktop/inverted.desktop.css

@@ -138,47 +138,47 @@
     /* text mobile inverted */
 
     /* loader mobile */
-} .button__primary_yjbkn {
+} .button__primary_11w5o {
     color: var(--button-inverted-primary-color);
     background-color: var(--button-inverted-primary-base-bg-color)
 } @media (hover: hover) {
-        .button__primary_yjbkn:hover {
+        .button__primary_11w5o:hover {
             background-color: var(--button-inverted-primary-hover-bg-color);
         }
-    } .button__primary_yjbkn:active {
+    } .button__primary_11w5o:active {
         background-color: var(--button-inverted-primary-active-bg-color);
-    } .button__primary_yjbkn > .button__loader_yjbkn {
+    } .button__primary_11w5o > .button__loader_11w5o {
         color: var(--button-spinner-inverted-primary-color);
-    } .button__secondary_yjbkn {
+    } .button__secondary_11w5o {
     background-color: var(--button-inverted-secondary-base-bg-color)
-} .button__secondary_yjbkn:hover {
+} .button__secondary_11w5o:hover {
         background-color: var(--button-inverted-secondary-hover-bg-color);
-    } .button__secondary_yjbkn:active {
+    } .button__secondary_11w5o:active {
         background-color: var(--button-inverted-secondary-active-bg-color);
-    } .button__text_yjbkn:active {
+    } .button__text_11w5o:active {
         color: var(--button-inverted-text-active-color);
-    } .button__ghost_yjbkn:active {
+    } .button__ghost_11w5o:active {
         color: var(--button-inverted-ghost-active-color);
-    } .button__component_yjbkn[disabled].button__primary_yjbkn {
+    } .button__component_11w5o[disabled].button__primary_11w5o {
         color: var(--button-inverted-primary-disabled-color);
         background-color: var(--button-inverted-primary-disabled-bg-color)
-    } .button__component_yjbkn[disabled].button__primary_yjbkn.button__loading_yjbkn {
+    } .button__component_11w5o[disabled].button__primary_11w5o.button__loading_11w5o {
             background-color: var(--button-inverted-primary-base-bg-color);
-        } .button__component_yjbkn[disabled].button__secondary_yjbkn {
+        } .button__component_11w5o[disabled].button__secondary_11w5o {
         color: var(--button-inverted-secondary-disabled-color);
         background-color: var(--button-inverted-secondary-disabled-bg-color);
-    } .button__component_yjbkn[disabled].button__outlined_yjbkn {
+    } .button__component_11w5o[disabled].button__outlined_11w5o {
         color: var(--button-inverted-outlined-disabled-color);
         border-color: var(--button-inverted-outlined-disabled-border-color);
-    } .button__component_yjbkn[disabled].button__tertiary_yjbkn {
+    } .button__component_11w5o[disabled].button__tertiary_11w5o {
         color: var(--button-inverted-tertiary-disabled-color);
         border-color: var(--button-inverted-tertiary-disabled-border-color);
-    } .button__component_yjbkn[disabled].button__transparent_yjbkn {
+    } .button__component_11w5o[disabled].button__transparent_11w5o {
         color: var(--button-inverted-transparent-disabled-color);
-    } .button__component_yjbkn[disabled].button__link_yjbkn {
+    } .button__component_11w5o[disabled].button__link_11w5o {
         color: var(--button-inverted-link-disabled-color);
-    } .button__component_yjbkn[disabled].button__text_yjbkn {
+    } .button__component_11w5o[disabled].button__text_11w5o {
         color: var(--button-inverted-text-disabled-color);
-    } .button__component_yjbkn[disabled].button__ghost_yjbkn {
+    } .button__component_11w5o[disabled].button__ghost_11w5o {
         color: var(--button-inverted-ghost-disabled-color);
     }

package/button/esm/mobile/Component.mobile.js

@@ -7,13 +7,13 @@ import '../../../shared/esm';
 import '../../../spinner/esm';
 import '@alfalab/hooks';
 
-var defaultColors = {"primary":"button__primary_1ewvd","loader":"button__loader_1ewvd","secondary":"button__secondary_1ewvd","text":"button__text_1ewvd","ghost":"button__ghost_1ewvd","component":"button__component_1ewvd","loading":"button__loading_1ewvd","outlined":"button__outlined_1ewvd","tertiary":"button__tertiary_1ewvd","transparent":"button__transparent_1ewvd","link":"button__link_1ewvd"};
+var defaultColors = {"primary":"button__primary_1i9ph","loader":"button__loader_1i9ph","secondary":"button__secondary_1i9ph","text":"button__text_1i9ph","ghost":"button__ghost_1i9ph","component":"button__component_1i9ph","loading":"button__loading_1i9ph","outlined":"button__outlined_1i9ph","tertiary":"button__tertiary_1i9ph","transparent":"button__transparent_1i9ph","link":"button__link_1i9ph"};
 require('./default.mobile.css');
 
-var invertedColors = {"primary":"button__primary_99wwh","loader":"button__loader_99wwh","secondary":"button__secondary_99wwh","text":"button__text_99wwh","ghost":"button__ghost_99wwh","component":"button__component_99wwh","loading":"button__loading_99wwh","outlined":"button__outlined_99wwh","tertiary":"button__tertiary_99wwh","transparent":"button__transparent_99wwh","link":"button__link_99wwh"};
+var invertedColors = {"primary":"button__primary_arvfl","loader":"button__loader_arvfl","secondary":"button__secondary_arvfl","text":"button__text_arvfl","ghost":"button__ghost_arvfl","component":"button__component_arvfl","loading":"button__loading_arvfl","outlined":"button__outlined_arvfl","tertiary":"button__tertiary_arvfl","transparent":"button__transparent_arvfl","link":"button__link_arvfl"};
 require('./inverted.mobile.css');
 
-var styles = {"size-32":"button__size-32_1ormk","size-40":"button__size-40_1ormk","size-48":"button__size-48_1ormk","size-56":"button__size-56_1ormk","size-64":"button__size-64_1ormk","size-72":"button__size-72_1ormk"};
+var styles = {"size-32":"button__size-32_i1bk6","size-40":"button__size-40_i1bk6","size-48":"button__size-48_i1bk6","size-56":"button__size-56_i1bk6","size-64":"button__size-64_i1bk6","size-72":"button__size-72_i1bk6"};
 require('./mobile.css');
 
 var colorStyles = {