@alfalab/core-components 37.5.1 → 38.0.0

package/button/inverted.css

@@ -96,150 +96,150 @@
     /* loader */
     --button-spinner-static-color: var(--color-static-graphic-light);
     --button-spinner-inverted-color: var(--color-light-graphic-primary-inverted);
-} .button__primary_q1n00 {
+} .button__primary_1vg1s {
     color: var(--button-inverted-primary-color);
     background-color: var(--button-inverted-primary-base-bg-color);
     border: 1px solid transparent
-} .button__primary_q1n00:hover {
+} .button__primary_1vg1s:hover {
         background-color: var(--button-inverted-primary-hover-bg-color)
-    } @media (hover: none) { .button__primary_q1n00:hover {
+    } @media (hover: none) { .button__primary_1vg1s:hover {
             background-color: var(--button-inverted-primary-base-bg-color)
     }
-        } .button__primary_q1n00:active {
+        } .button__primary_1vg1s:active {
         background-color: var(--button-inverted-primary-active-bg-color);
-    } .button__primary_q1n00 > .button__loader_q1n00 {
+    } .button__primary_1vg1s > .button__loader_1vg1s {
         color: var(--button-spinner-static-color);
-    } .button__secondary_q1n00 {
+    } .button__secondary_1vg1s {
     color: var(--button-inverted-secondary-color);
     background-color: var(--button-inverted-secondary-base-bg-color);
     border: 1px solid var(--button-inverted-secondary-base-border-color)
-} .button__secondary_q1n00:hover {
+} .button__secondary_1vg1s:hover {
         background-color: var(--button-inverted-secondary-hover-bg-color)
-    } @media (hover: none) { .button__secondary_q1n00:hover {
+    } @media (hover: none) { .button__secondary_1vg1s:hover {
             background-color: var(--button-inverted-secondary-base-bg-color)
     }
-        } .button__secondary_q1n00:active {
+        } .button__secondary_1vg1s:active {
         background-color: var(--button-inverted-secondary-active-bg-color);
-    } .button__secondary_q1n00 > .button__loader_q1n00 {
+    } .button__secondary_1vg1s > .button__loader_1vg1s {
         color: var(--button-spinner-inverted-color);
-    } .button__outlined_q1n00 {
+    } .button__outlined_1vg1s {
     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)
-} .button__outlined_q1n00:hover {
+} .button__outlined_1vg1s:hover {
         background-color: var(--button-inverted-outlined-hover-bg-color)
-    } @media (hover: none) { .button__outlined_q1n00:hover {
+    } @media (hover: none) { .button__outlined_1vg1s:hover {
             background-color: var(--button-inverted-outlined-base-bg-color)
     }
-        } .button__outlined_q1n00:active {
+        } .button__outlined_1vg1s:active {
         background-color: var(--button-inverted-outlined-active-bg-color);
-    } .button__tertiary_q1n00 {
+    } .button__tertiary_1vg1s {
     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)
-} .button__tertiary_q1n00:hover {
+} .button__tertiary_1vg1s:hover {
         background-color: var(--button-inverted-tertiary-hover-bg-color);
         border-color: var(--button-inverted-tertiary-hover-border-color)
-    } @media (hover: none) { .button__tertiary_q1n00:hover {
+    } @media (hover: none) { .button__tertiary_1vg1s:hover {
             background-color: var(--button-inverted-tertiary-base-bg-color);
             border-color: var(--button-inverted-tertiary-base-border-color)
     }
-        } .button__tertiary_q1n00:active {
+        } .button__tertiary_1vg1s:active {
         background-color: var(--button-inverted-tertiary-active-bg-color);
-    } .button__tertiary_q1n00 > .button__loader_q1n00 {
+    } .button__tertiary_1vg1s > .button__loader_1vg1s {
         color: var(--button-spinner-inverted-color);
-    } .button__filled_q1n00 {
+    } .button__filled_1vg1s {
     color: var(--color-dark-text-primary);
     background-color: var(--color-dark-bg-quaternary)
-} .button__filled_q1n00:hover {
+} .button__filled_1vg1s:hover {
         background-color: rgb(99, 112, 126)
-    } @media (hover: none) { .button__filled_q1n00:hover {
+    } @media (hover: none) { .button__filled_1vg1s:hover {
             background-color: var(--color-dark-bg-quaternary)
     }
-        } .button__filled_q1n00:active {
+        } .button__filled_1vg1s:active {
         background-color: rgb(61, 74, 88);
-    } .button__transparent_q1n00 {
+    } .button__transparent_1vg1s {
     color: var(--color-light-text-primary-inverted);
     background-color: rgba(255, 255, 255, 0.1)
-} .button__transparent_q1n00:hover {
+} .button__transparent_1vg1s:hover {
         background-color: rgba(255, 255, 255, 0.2)
-    } @media (hover: none) { .button__transparent_q1n00:hover {
+    } @media (hover: none) { .button__transparent_1vg1s:hover {
             background-color: rgba(255, 255, 255, 0.1)
     }
-        } .button__transparent_q1n00:active {
+        } .button__transparent_1vg1s:active {
         /* TODO: какой цвет? */
         background-color: rgba(255, 255, 255, 0.05);
-    } .button__link_q1n00 {
+    } .button__link_1vg1s {
     color: var(--button-inverted-link-base-color);
     background-color: transparent;
     border: 1px solid transparent
-} .button__link_q1n00:hover {
+} .button__link_1vg1s:hover {
         background-color: var(--button-inverted-link-hover-bg-color)
-    } @media (hover: none) { .button__link_q1n00:hover {
+    } @media (hover: none) { .button__link_1vg1s:hover {
             background-color: transparent
     }
-        } .button__link_q1n00:active {
+        } .button__link_1vg1s:active {
         /* TODO: какой цвет? */
         background-color: var(--button-inverted-link-active-bg-color);
-    } .button__link_q1n00 > .button__loader_q1n00 {
+    } .button__link_1vg1s > .button__loader_1vg1s {
         color: var(--button-spinner-inverted-color);
-    } .button__ghost_q1n00 {
+    } .button__ghost_1vg1s {
     color: var(--button-inverted-ghost-base-color)
-} .button__ghost_q1n00:hover {
+} .button__ghost_1vg1s:hover {
         color: var(--button-inverted-ghost-hover-color)
-    } @media (hover: none) { .button__ghost_q1n00:hover {
+    } @media (hover: none) { .button__ghost_1vg1s:hover {
             color: var(--button-inverted-ghost-base-color)
     }
-        } .button__ghost_q1n00:active {
+        } .button__ghost_1vg1s:active {
         color: var(--button-inverted-ghost-active-color);
-    } .button__ghost_q1n00 > .button__loader_q1n00 {
+    } .button__ghost_1vg1s > .button__loader_1vg1s {
         color: var(--button-spinner-inverted-color);
-    } .button__component_q1n00[disabled].button__primary_q1n00 {
+    } .button__component_1vg1s[disabled].button__primary_1vg1s {
         color: var(--button-inverted-primary-disabled-color);
         background-color: var(--button-inverted-primary-disabled-bg-color)
-    } .button__component_q1n00[disabled].button__primary_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__primary_1vg1s.button__loading_1vg1s {
             background-color: var(--button-inverted-primary-base-bg-color);
-        } .button__component_q1n00[disabled].button__secondary_q1n00 {
+        } .button__component_1vg1s[disabled].button__secondary_1vg1s {
         color: var(--button-inverted-secondary-disabled-color);
         background-color: var(--button-inverted-secondary-disabled-bg-color);
         border-color: var(--button-inverted-secondary-disabled-border-color)
-    } .button__component_q1n00[disabled].button__secondary_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__secondary_1vg1s.button__loading_1vg1s {
             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_q1n00[disabled].button__outlined_q1n00 {
+        } .button__component_1vg1s[disabled].button__outlined_1vg1s {
         color: var(--button-inverted-outlined-disabled-color);
         background-color: var(--button-inverted-outlined-disabled-bg-color);
         border-color: var(--button-inverted-outlined-disabled-border-color)
-    } .button__component_q1n00[disabled].button__outlined_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__outlined_1vg1s.button__loading_1vg1s {
             color: var(--button-inverted-outlined-color);
-        } .button__component_q1n00[disabled].button__tertiary_q1n00 {
+        } .button__component_1vg1s[disabled].button__tertiary_1vg1s {
         color: var(--button-inverted-tertiary-disabled-color);
         background-color: var(--button-inverted-tertiary-disabled-bg-color);
         border-color: var(--button-inverted-tertiary-disabled-border-color)
-    } .button__component_q1n00[disabled].button__tertiary_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__tertiary_1vg1s.button__loading_1vg1s {
             color: var(--button-inverted-tertiary-color);
-        } .button__component_q1n00[disabled].button__filled_q1n00 {
+        } .button__component_1vg1s[disabled].button__filled_1vg1s {
         color: rgba(255, 255, 255, 0.3);
         background-color: rgba(72, 87, 103, 0.3);
         border-color: transparent
-    } .button__component_q1n00[disabled].button__filled_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__filled_1vg1s.button__loading_1vg1s {
             color: var(--color-dark-text-primary);
             background-color: var(--color-dark-bg-quaternary);
             border-color: transparent;
-        } .button__component_q1n00[disabled].button__transparent_q1n00 {
+        } .button__component_1vg1s[disabled].button__transparent_1vg1s {
         color: rgba(255, 255, 255, 0.3);
         background-color: rgba(255, 255, 255, 0.03)
-    } .button__component_q1n00[disabled].button__transparent_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__transparent_1vg1s.button__loading_1vg1s {
             color: var(--color-light-text-primary-inverted);
             background-color: rgba(255, 255, 255, 0.1);
-        } .button__component_q1n00[disabled].button__link_q1n00 {
+        } .button__component_1vg1s[disabled].button__link_1vg1s {
         color: var(--button-inverted-link-disabled-color);
         background-color: transparent
-    } .button__component_q1n00[disabled].button__link_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__link_1vg1s.button__loading_1vg1s {
             color: var(--button-inverted-link-base-color);
-        } .button__component_q1n00[disabled].button__ghost_q1n00 {
+        } .button__component_1vg1s[disabled].button__ghost_1vg1s {
         color: var(--button-inverted-ghost-disabled-color)
-    } .button__component_q1n00[disabled].button__ghost_q1n00.button__loading_q1n00 {
+    } .button__component_1vg1s[disabled].button__ghost_1vg1s.button__loading_1vg1s {
             color: var(--button-inverted-ghost-base-color);
         }

package/button/modern/Component.js

@@ -4,13 +4,13 @@ import cn from 'classnames';
 import { Spinner } from '../../spinner/modern';
 import { useFocus } from '@alfalab/hooks';
 
-const styles = {"component":"button__component_s2bbp","focused":"button__focused_s2bbp","loading":"button__loading_s2bbp","text":"button__text_s2bbp","addons":"button__addons_s2bbp","stretchText":"button__stretchText_s2bbp","loader":"button__loader_s2bbp","xxs":"button__xxs_s2bbp","iconOnly":"button__iconOnly_s2bbp","xs":"button__xs_s2bbp","s":"button__s_s2bbp","m":"button__m_s2bbp","l":"button__l_s2bbp","xl":"button__xl_s2bbp","withRightAddons":"button__withRightAddons_s2bbp","ghost":"button__ghost_s2bbp","withLeftAddons":"button__withLeftAddons_s2bbp","link":"button__link_s2bbp","block":"button__block_s2bbp","nowrap":"button__nowrap_s2bbp"};
+const styles = {"component":"button__component_1btgs","focused":"button__focused_1btgs","loading":"button__loading_1btgs","text":"button__text_1btgs","addons":"button__addons_1btgs","stretchText":"button__stretchText_1btgs","loader":"button__loader_1btgs","xxs":"button__xxs_1btgs","iconOnly":"button__iconOnly_1btgs","xs":"button__xs_1btgs","s":"button__s_1btgs","m":"button__m_1btgs","l":"button__l_1btgs","xl":"button__xl_1btgs","withRightAddons":"button__withRightAddons_1btgs","ghost":"button__ghost_1btgs","withLeftAddons":"button__withLeftAddons_1btgs","link":"button__link_1btgs","block":"button__block_1btgs","nowrap":"button__nowrap_1btgs"};
 require('./index.css');
 
-const defaultColors = {"primary":"button__primary_11boi","loader":"button__loader_11boi","secondary":"button__secondary_11boi","outlined":"button__outlined_11boi","tertiary":"button__tertiary_11boi","filled":"button__filled_11boi","transparent":"button__transparent_11boi","link":"button__link_11boi","ghost":"button__ghost_11boi","component":"button__component_11boi","loading":"button__loading_11boi"};
+const defaultColors = {"primary":"button__primary_7oz8t","loader":"button__loader_7oz8t","secondary":"button__secondary_7oz8t","outlined":"button__outlined_7oz8t","tertiary":"button__tertiary_7oz8t","filled":"button__filled_7oz8t","transparent":"button__transparent_7oz8t","link":"button__link_7oz8t","ghost":"button__ghost_7oz8t","component":"button__component_7oz8t","loading":"button__loading_7oz8t"};
 require('./default.css');
 
-const invertedColors = {"primary":"button__primary_q1n00","loader":"button__loader_q1n00","secondary":"button__secondary_q1n00","outlined":"button__outlined_q1n00","tertiary":"button__tertiary_q1n00","filled":"button__filled_q1n00","transparent":"button__transparent_q1n00","link":"button__link_q1n00","ghost":"button__ghost_q1n00","component":"button__component_q1n00","loading":"button__loading_q1n00"};
+const invertedColors = {"primary":"button__primary_1vg1s","loader":"button__loader_1vg1s","secondary":"button__secondary_1vg1s","outlined":"button__outlined_1vg1s","tertiary":"button__tertiary_1vg1s","filled":"button__filled_1vg1s","transparent":"button__transparent_1vg1s","link":"button__link_1vg1s","ghost":"button__ghost_1vg1s","component":"button__component_1vg1s","loading":"button__loading_1vg1s"};
 require('./inverted.css');
 
 // TODO Вид кнопок зависит от порядка импорта стилей. Исправить!!!.

package/button/modern/default.css

@@ -98,147 +98,147 @@
     /* loader */
     --button-spinner-static-color: var(--color-static-graphic-light);
     --button-spinner-default-color: var(--color-light-graphic-primary);
-} .button__primary_11boi {
+} .button__primary_7oz8t {
     color: var(--button-primary-color);
     background-color: var(--button-primary-base-bg-color);
     border: 1px solid transparent
-} .button__primary_11boi:hover {
+} .button__primary_7oz8t:hover {
         background-color: var(--button-primary-hover-bg-color)
-    } @media (hover: none) { .button__primary_11boi:hover {
+    } @media (hover: none) { .button__primary_7oz8t:hover {
             background-color: var(--button-primary-base-bg-color)
     }
-        } .button__primary_11boi:active {
+        } .button__primary_7oz8t:active {
         background-color: var(--button-primary-active-bg-color);
-    } .button__primary_11boi > .button__loader_11boi {
+    } .button__primary_7oz8t > .button__loader_7oz8t {
         color: var(--button-spinner-static-color);
-    } .button__secondary_11boi {
+    } .button__secondary_7oz8t {
     color: var(--button-secondary-color);
     background-color: var(--button-secondary-base-bg-color);
     border: 1px solid var(--button-secondary-base-border-color)
-} .button__secondary_11boi:hover {
+} .button__secondary_7oz8t:hover {
         background-color: var(--button-secondary-hover-bg-color)
-    } @media (hover: none) { .button__secondary_11boi:hover {
+    } @media (hover: none) { .button__secondary_7oz8t:hover {
             background-color: var(--button-secondary-base-bg-color)
     }
-        } .button__secondary_11boi:active {
+        } .button__secondary_7oz8t:active {
         background-color: var(--button-secondary-active-bg-color);
-    } .button__secondary_11boi > .button__loader_11boi {
+    } .button__secondary_7oz8t > .button__loader_7oz8t {
         color: var(--button-spinner-default-color);
-    } .button__outlined_11boi {
+    } .button__outlined_7oz8t {
     color: var(--button-outlined-color);
     background-color: var(--button-outlined-base-bg-color);
     border: 1px solid var(--button-outlined-base-border-color)
-} .button__outlined_11boi:hover {
+} .button__outlined_7oz8t:hover {
         background-color: var(--button-outlined-hover-bg-color)
-    } @media (hover: none) { .button__outlined_11boi:hover {
+    } @media (hover: none) { .button__outlined_7oz8t:hover {
             background-color: var(--button-outlined-base-bg-color)
     }
-        } .button__outlined_11boi:active {
+        } .button__outlined_7oz8t:active {
         background-color: var(--button-outlined-active-bg-color);
-    } .button__tertiary_11boi {
+    } .button__tertiary_7oz8t {
     color: var(--button-tertiary-color);
     background-color: var(--button-tertiary-base-bg-color);
     border: 1px solid var(--button-tertiary-base-border-color)
-} .button__tertiary_11boi:hover {
+} .button__tertiary_7oz8t:hover {
         background-color: var(--button-tertiary-hover-bg-color);
         border-color: var(--button-tertiary-hover-border-color)
-    } @media (hover: none) { .button__tertiary_11boi:hover {
+    } @media (hover: none) { .button__tertiary_7oz8t:hover {
             background-color: var(--button-tertiary-base-bg-color);
             border-color: var(--button-tertiary-base-border-color)
     }
-        } .button__tertiary_11boi:active {
+        } .button__tertiary_7oz8t:active {
         background-color: var(--button-tertiary-active-bg-color);
-    } .button__tertiary_11boi > .button__loader_11boi {
+    } .button__tertiary_7oz8t > .button__loader_7oz8t {
         color: var(--button-spinner-default-color);
-    } .button__filled_11boi {
+    } .button__filled_7oz8t {
     color: var(--color-light-text-primary);
     background-color: var(--color-light-bg-quaternary)
-} .button__filled_11boi:hover {
+} .button__filled_7oz8t:hover {
         background-color: var(--color-light-bg-quaternary-shade-7)
-    } @media (hover: none) { .button__filled_11boi:hover {
+    } @media (hover: none) { .button__filled_7oz8t:hover {
             background-color: var(--color-light-bg-quaternary)
     }
-        } .button__filled_11boi:active {
+        } .button__filled_7oz8t:active {
         background-color: var(--color-light-bg-quaternary-shade-15);
-    } .button__transparent_11boi {
+    } .button__transparent_7oz8t {
     color: var(--color-light-text-primary);
     background-color: var(--color-light-bg-primary-inverted-alpha-10)
-} .button__transparent_11boi:hover {
+} .button__transparent_7oz8t:hover {
         background-color: var(--color-light-bg-primary-inverted-alpha-20)
-    } @media (hover: none) { .button__transparent_11boi:hover {
+    } @media (hover: none) { .button__transparent_7oz8t:hover {
             background-color: var(--color-light-bg-primary-inverted-alpha-10)
     }
-        } .button__transparent_11boi:active {
+        } .button__transparent_7oz8t:active {
         background-color: var(--color-light-bg-primary-inverted-alpha-40);
-    } .button__link_11boi {
+    } .button__link_7oz8t {
     color: var(--button-link-base-color);
     background-color: transparent;
     border: 1px solid transparent
-} .button__link_11boi:hover {
+} .button__link_7oz8t:hover {
         background-color: var(--button-link-hover-bg-color)
-    } @media (hover: none) { .button__link_11boi:hover {
+    } @media (hover: none) { .button__link_7oz8t:hover {
             background-color: transparent
     }
-        } .button__link_11boi:active {
+        } .button__link_7oz8t:active {
         background-color: var(--button-link-active-bg-color);
-    } .button__link_11boi > .button__loader_11boi {
+    } .button__link_7oz8t > .button__loader_7oz8t {
         color: var(--button-spinner-default-color);
-    } .button__ghost_11boi {
+    } .button__ghost_7oz8t {
     color: var(--button-ghost-base-color)
-} .button__ghost_11boi:hover {
+} .button__ghost_7oz8t:hover {
         color: var(--button-ghost-hover-color)
-    } @media (hover: none) { .button__ghost_11boi:hover {
+    } @media (hover: none) { .button__ghost_7oz8t:hover {
             color: var(--button-ghost-base-color)
     }
-        } .button__ghost_11boi:active {
+        } .button__ghost_7oz8t:active {
         color: var(--button-ghost-active-color);
-    } .button__ghost_11boi > .button__loader_11boi {
+    } .button__ghost_7oz8t > .button__loader_7oz8t {
         color: var(--button-spinner-default-color);
-    } /* Disabled */ .button__component_11boi[disabled].button__primary_11boi {
+    } /* Disabled */ .button__component_7oz8t[disabled].button__primary_7oz8t {
         color: var(--button-primary-disabled-color);
         background-color: var(--button-primary-disabled-bg-color)
-    } .button__component_11boi[disabled].button__primary_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__primary_7oz8t.button__loading_7oz8t {
             background-color: var(--button-primary-base-bg-color);
-        } .button__component_11boi[disabled].button__secondary_11boi {
+        } .button__component_7oz8t[disabled].button__secondary_7oz8t {
         color: var(--button-secondary-disabled-color);
         background-color: var(--button-secondary-disabled-bg-color);
         border-color: var(--button-secondary-disabled-border-color)
-    } .button__component_11boi[disabled].button__secondary_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__secondary_7oz8t.button__loading_7oz8t {
             color: var(--button-secondary-color);
             background-color: var(--button-secondary-base-bg-color);
             border-color: var(--button-secondary-base-border-color);
-        } .button__component_11boi[disabled].button__outlined_11boi {
+        } .button__component_7oz8t[disabled].button__outlined_7oz8t {
         color: var(--button-outlined-disabled-color);
         background-color: var(--button-outlined-disabled-bg-color);
         border-color: var(--button-outlined-disabled-border-color)
-    } .button__component_11boi[disabled].button__outlined_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__outlined_7oz8t.button__loading_7oz8t {
             color: var(--button-outlined-color);
-        } .button__component_11boi[disabled].button__tertiary_11boi {
+        } .button__component_7oz8t[disabled].button__tertiary_7oz8t {
         color: var(--button-tertiary-disabled-color);
         background-color: var(--button-tertiary-disabled-bg-color);
         border-color: var(--button-tertiary-disabled-border-color)
-    } .button__component_11boi[disabled].button__tertiary_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__tertiary_7oz8t.button__loading_7oz8t {
             color: var(--button-tertiary-color);
             border-color: var(--button-tertiary-base-border-color);
-        } .button__component_11boi[disabled].button__filled_11boi {
+        } .button__component_7oz8t[disabled].button__filled_7oz8t {
         color: var(--color-light-text-primary-alpha-30);
         background-color: var(--color-light-bg-quaternary-alpha-30)
-    } .button__component_11boi[disabled].button__filled_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__filled_7oz8t.button__loading_7oz8t {
             color: var(--color-light-text-primary);
             background-color: var(--color-light-bg-quaternary);
-        } .button__component_11boi[disabled].button__transparent_11boi {
+        } .button__component_7oz8t[disabled].button__transparent_7oz8t {
         color: var(--color-light-text-primary-alpha-30);
         background-color: var(--color-light-bg-primary-inverted-alpha-3)
-    } .button__component_11boi[disabled].button__transparent_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__transparent_7oz8t.button__loading_7oz8t {
             color: var(--color-light-text-primary);
             background-color: var(--color-light-bg-primary-inverted-alpha-10);
-        } .button__component_11boi[disabled].button__link_11boi {
+        } .button__component_7oz8t[disabled].button__link_7oz8t {
         color: var(--button-link-disabled-color);
         background-color: transparent
-    } .button__component_11boi[disabled].button__link_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__link_7oz8t.button__loading_7oz8t {
             color: var(--button-link-base-color);
-        } .button__component_11boi[disabled].button__ghost_11boi {
+        } .button__component_7oz8t[disabled].button__ghost_7oz8t {
         color: var(--button-ghost-disabled-color)
-    } .button__component_11boi[disabled].button__ghost_11boi.button__loading_11boi {
+    } .button__component_7oz8t[disabled].button__ghost_7oz8t.button__loading_7oz8t {
             color: var(--button-ghost-base-color);
         }