@alfalab/core-components 29.2.1 → 30.0.0

package/bottom-sheet/modern/{component-5e4ff82e.js → component-ea68a665.js}

@@ -18,7 +18,7 @@ const getDataTestId = (dataTestId, element) => {
     return dataTestId ? `${dataTestId}${elementPart}` : undefined;
 };
 
-var styles = {"headerWrapper":"bottom-sheet__headerWrapper_18fxg","header":"bottom-sheet__header_18fxg","sticky":"bottom-sheet__sticky_18fxg","highlighted":"bottom-sheet__highlighted_18fxg","justifyEnd":"bottom-sheet__justifyEnd_18fxg","addon":"bottom-sheet__addon_18fxg","addonFixed":"bottom-sheet__addonFixed_18fxg","addonLeft":"bottom-sheet__addonLeft_18fxg","addonRight":"bottom-sheet__addonRight_18fxg","title":"bottom-sheet__title_18fxg","titleCenter":"bottom-sheet__titleCenter_18fxg","titleLeft":"bottom-sheet__titleLeft_18fxg","trimTitle":"bottom-sheet__trimTitle_18fxg","titleBigIndentHorizontal":"bottom-sheet__titleBigIndentHorizontal_18fxg","titleIndentRight":"bottom-sheet__titleIndentRight_18fxg","titleIndentLeft":"bottom-sheet__titleIndentLeft_18fxg"};
+var styles = {"headerWrapper":"bottom-sheet__headerWrapper_1j3ft","header":"bottom-sheet__header_1j3ft","sticky":"bottom-sheet__sticky_1j3ft","highlighted":"bottom-sheet__highlighted_1j3ft","justifyEnd":"bottom-sheet__justifyEnd_1j3ft","addon":"bottom-sheet__addon_1j3ft","addonFixed":"bottom-sheet__addonFixed_1j3ft","addonLeft":"bottom-sheet__addonLeft_1j3ft","addonRight":"bottom-sheet__addonRight_1j3ft","title":"bottom-sheet__title_1j3ft","titleCenter":"bottom-sheet__titleCenter_1j3ft","titleLeft":"bottom-sheet__titleLeft_1j3ft","trimTitle":"bottom-sheet__trimTitle_1j3ft","titleBigIndentHorizontal":"bottom-sheet__titleBigIndentHorizontal_1j3ft","titleIndentRight":"bottom-sheet__titleIndentRight_1j3ft","titleIndentLeft":"bottom-sheet__titleIndentLeft_1j3ft"};
 require('./components/header/index.css');
 
 const Header = ({ title, headerClassName, addonClassName, closerClassName, backerClassName, leftAddons, rightAddons, bottomAddons, hasCloser, hasBacker, titleAlign, trimTitle, sticky, dataTestId, onBack, }) => {
@@ -65,7 +65,7 @@ const Header = ({ title, headerClassName, addonClassName, closerClassName, backe
         bottomAddons));
 };
 
-var styles$1 = {"modal":"bottom-sheet__modal_1gf4k","component":"bottom-sheet__component_1gf4k","withTransition":"bottom-sheet__withTransition_1gf4k","withZeroTransition":"bottom-sheet__withZeroTransition_1gf4k","scrollableContainer":"bottom-sheet__scrollableContainer_1gf4k","marker":"bottom-sheet__marker_1gf4k","content":"bottom-sheet__content_1gf4k","noHeader":"bottom-sheet__noHeader_1gf4k","noFooter":"bottom-sheet__noFooter_1gf4k","scrollLocked":"bottom-sheet__scrollLocked_1gf4k","appear":"bottom-sheet__appear_1gf4k","enter":"bottom-sheet__enter_1gf4k","appearActive":"bottom-sheet__appearActive_1gf4k","enterActive":"bottom-sheet__enterActive_1gf4k","enterDone":"bottom-sheet__enterDone_1gf4k","appearDone":"bottom-sheet__appearDone_1gf4k","exit":"bottom-sheet__exit_1gf4k","exitActive":"bottom-sheet__exitActive_1gf4k"};
+var styles$1 = {"modal":"bottom-sheet__modal_1enkg","component":"bottom-sheet__component_1enkg","withTransition":"bottom-sheet__withTransition_1enkg","scrollableContainer":"bottom-sheet__scrollableContainer_1enkg","marker":"bottom-sheet__marker_1enkg","content":"bottom-sheet__content_1enkg","noHeader":"bottom-sheet__noHeader_1enkg","noFooter":"bottom-sheet__noFooter_1enkg","scrollLocked":"bottom-sheet__scrollLocked_1enkg","appear":"bottom-sheet__appear_1enkg","enter":"bottom-sheet__enter_1enkg","appearActive":"bottom-sheet__appearActive_1enkg","enterActive":"bottom-sheet__enterActive_1enkg","enterDone":"bottom-sheet__enterDone_1enkg","appearDone":"bottom-sheet__appearDone_1enkg","exit":"bottom-sheet__exit_1enkg","exitActive":"bottom-sheet__exitActive_1enkg"};
 require('./index.css');
 
 const TIMEOUT = 300;
@@ -76,7 +76,7 @@ const MARKET_HEIGHT = 24;
 /* Верхний отступ шторки, если она открыта на максимальную высоту */
 const HEADER_OFFSET = 24;
 const CLOSE_OFFSET = 0.2;
-const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, containerClassName, containerProps, headerClassName, footerClassName, addonClassName, closerClassName, backerClassName, modalClassName, modalWrapperClassName, className, leftAddons, rightAddons, bottomAddons, hasCloser, hasBacker, titleAlign = 'left', trimTitle, stickyHeader, stickyFooter = true, initialHeight = 'default', hideOverlay, hideHeader, disableOverlayClick, disableBlockingScroll, children, zIndex, transitionProps = {}, dataTestId, swipeable = true, ignoreScreenChange = false, backdropProps, onClose, onBack, }, ref) => {
+const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, containerClassName, containerProps, headerClassName, footerClassName, addonClassName, closerClassName, backerClassName, modalClassName, modalWrapperClassName, className, leftAddons, rightAddons, bottomAddons, hasCloser, hasBacker, titleAlign = 'left', trimTitle, stickyHeader, stickyFooter = true, initialHeight = 'default', hideOverlay, hideHeader, disableOverlayClick, disableBlockingScroll, children, zIndex, transitionProps = {}, dataTestId, swipeable = true, backdropProps, onClose, onBack, }, ref) => {
     const [sheetOffset, setSheetOffset] = useState(0);
     const [backdropOpacity, setBackdropOpacity] = useState(1);
     const [scrollLocked, setScrollLocked] = useState(false);
@@ -84,7 +84,6 @@ const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, c
     const scrollableContainer = useRef(null);
     const scrollableContainerScrollValue = useRef(0);
     const emptyHeader = !hasCloser && !hasBacker && !leftAddons && !rightAddons && !title;
-    const [transitionClassName, setTransitionClassName] = useState(styles$1.withTransition);
     // eslint-disable-next-line  @typescript-eslint/no-non-null-assertion
     const fullHeight = use100vh();
     const targetHeight = `${fullHeight - HEADER_OFFSET}px`;
@@ -148,12 +147,6 @@ const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, c
             onClose();
         }
         else {
-            /**
-             * Установить мгновенную анимацию шторке если она не закрыта при свайпе и установлен проп ignoreScreenChange
-             */
-            if (ignoreScreenChange) {
-                setTransitionClassName(styles$1.withZeroTransition);
-            }
             setSheetOffset(0);
             setBackdropOpacity(1);
         }
@@ -176,12 +169,6 @@ const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, c
          */
         if (offset > 0) {
             setScrollLocked(true);
-            /**
-             * Вернуть плавную анимацию шторке при свайпе
-             */
-            if (transitionClassName === styles$1.withZeroTransition) {
-                setTransitionClassName(styles$1.withTransition);
-            }
         }
     };
     const backdropSwipeablehandlers = useSwipeable({
@@ -215,10 +202,7 @@ const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, c
         if (!open) {
             setSheetOffset(0);
         }
-        if (ignoreScreenChange && open) {
-            setTransitionClassName(styles$1.withZeroTransition);
-        }
-    }, [open, ignoreScreenChange]);
+    }, [open]);
     const getSwipeStyles = () => ({
         transform: sheetOffset ? `translateY(${sheetOffset}px)` : '',
     });
@@ -240,22 +224,23 @@ const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, c
             onExited: handleExited,
             onEntered: handleEntered,
         } },
-        React.createElement("div", Object.assign({ className: cn(styles$1.component, className, {
-                [transitionClassName]: !sheetOffset,
-            }), style: {
-                ...getSwipeStyles(),
-                ...getHeightStyles(),
-            } }, sheetSwipeablehandlers),
-            React.createElement("div", Object.assign({}, containerProps, { className: cn(styles$1.scrollableContainer, containerProps?.className, containerClassName, {
-                    [styles$1.scrollLocked]: scrollLocked,
-                }), ref: scrollableContainer }),
-                swipeable && React.createElement("div", { className: cn(styles$1.marker) }),
-                !hideHeader && !emptyHeader && React.createElement(Header, Object.assign({}, headerProps)),
-                React.createElement("div", { className: cn(styles$1.content, contentClassName, {
-                        [styles$1.noHeader]: hideHeader || emptyHeader,
-                        [styles$1.noFooter]: !actionButton,
-                    }) }, children),
-                actionButton && (React.createElement(Footer, { sticky: stickyFooter, className: footerClassName }, actionButton))))));
+        React.createElement("div", { style: { ...getHeightStyles() } },
+            React.createElement("div", Object.assign({ className: cn(styles$1.component, className, {
+                    [styles$1.withTransition]: !sheetOffset,
+                }), style: {
+                    ...getSwipeStyles(),
+                    ...getHeightStyles(),
+                } }, sheetSwipeablehandlers),
+                React.createElement("div", Object.assign({}, containerProps, { className: cn(styles$1.scrollableContainer, containerProps?.className, containerClassName, {
+                        [styles$1.scrollLocked]: scrollLocked,
+                    }), ref: scrollableContainer }),
+                    swipeable && React.createElement("div", { className: cn(styles$1.marker) }),
+                    !hideHeader && !emptyHeader && React.createElement(Header, Object.assign({}, headerProps)),
+                    React.createElement("div", { className: cn(styles$1.content, contentClassName, {
+                            [styles$1.noHeader]: hideHeader || emptyHeader,
+                            [styles$1.noFooter]: !actionButton,
+                        }) }, children),
+                    actionButton && (React.createElement(Footer, { sticky: stickyFooter, className: footerClassName }, actionButton)))))));
 });
 
 export { BottomSheet as B, CLOSE_OFFSET as C, HEADER_OFFSET as H, Header as a };

package/bottom-sheet/modern/component.js

@@ -12,4 +12,4 @@ import './components/backer/Component.js';
 import './components/footer/Component.js';
 import '../../backdrop/modern';
 import './components/swipeable-backdrop/Component.js';
-export { B as BottomSheet, C as CLOSE_OFFSET, H as HEADER_OFFSET } from './component-5e4ff82e.js';
+export { B as BottomSheet, C as CLOSE_OFFSET, H as HEADER_OFFSET } from './component-ea68a665.js';

package/bottom-sheet/modern/components/backer/Component.js

@@ -3,7 +3,7 @@ import cn from 'classnames';
 import { ArrowBackMIcon } from '@alfalab/icons-glyph/ArrowBackMIcon';
 import { IconButton } from '../../../../icon-button/modern';
 
-var styles = {"backer":"bottom-sheet__backer_1dfmr","button":"bottom-sheet__button_1dfmr"};
+var styles = {"backer":"bottom-sheet__backer_168ue","button":"bottom-sheet__button_168ue"};
 require('./index.css');
 
 const Backer = ({ className, size = 'xs', icon = ArrowBackMIcon, dataTestId, onClick, ...restProps }) => {

package/bottom-sheet/modern/components/backer/index.css

@@ -1,9 +1,9 @@
-/* hash: 1m24z */
+/* hash: 1ymev */
 :root {
     --bottom-sheet-backer-bg-color: var(--color-light-bg-primary-inverted-alpha-3);
 }
 
-.bottom-sheet__backer_1dfmr {
+.bottom-sheet__backer_168ue {
     width: 32px;
     height: 32px;
     display: flex;
@@ -13,7 +13,7 @@
     color: var(--color-light-graphic-primary);
 }
 
-.bottom-sheet__button_1dfmr {
+.bottom-sheet__button_168ue {
     background: var(--bottom-sheet-backer-bg-color);
     -webkit-backdrop-filter: blur(10px);
             backdrop-filter: blur(10px);

package/bottom-sheet/modern/components/closer/Component.js

@@ -4,7 +4,7 @@ import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
 import { BaseModalContext } from '../../../../base-modal/modern';
 import { IconButton } from '../../../../icon-button/modern';
 
-var styles = {"closer":"bottom-sheet__closer_2fz5k","button":"bottom-sheet__button_2fz5k"};
+var styles = {"closer":"bottom-sheet__closer_of1dk","button":"bottom-sheet__button_of1dk"};
 require('./index.css');
 
 const Closer = ({ className, size = 'xs', icon = CrossMIcon, dataTestId, ...restProps }) => {

package/bottom-sheet/modern/components/closer/index.css

@@ -1,9 +1,9 @@
-/* hash: 1w8dm */
+/* hash: 1y3gd */
 :root {
     --bottom-sheet-closer-bg-color: var(--color-light-bg-primary-inverted-alpha-3);
 }
 
-.bottom-sheet__closer_2fz5k {
+.bottom-sheet__closer_of1dk {
     width: 32px;
     height: 32px;
     display: flex;
@@ -13,7 +13,7 @@
     color: var(--color-light-graphic-primary);
 }
 
-.bottom-sheet__button_2fz5k {
+.bottom-sheet__button_of1dk {
     background: var(--bottom-sheet-closer-bg-color);
     -webkit-backdrop-filter: blur(10px);
             backdrop-filter: blur(10px);

package/bottom-sheet/modern/components/footer/Component.js

@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { BaseModalContext } from '../../../../base-modal/modern';
 
-var styles = {"footer":"bottom-sheet__footer_1opm0","sticky":"bottom-sheet__sticky_1opm0","highlighted":"bottom-sheet__highlighted_1opm0"};
+var styles = {"footer":"bottom-sheet__footer_1gnta","sticky":"bottom-sheet__sticky_1gnta","highlighted":"bottom-sheet__highlighted_1gnta"};
 require('./index.css');
 
 const Footer = ({ children, className, sticky }) => {

package/bottom-sheet/modern/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: 1wcn7 */
+/* hash: 5iu1s */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-border-primary: #dbdee1;
@@ -18,15 +18,15 @@
     --bottom-sheet-footer-border-top: 1px solid var(--color-light-border-primary);
     --bottom-sheet-footer-background-color: var(--color-light-bg-primary);
 }
-.bottom-sheet__footer_1opm0 {
+.bottom-sheet__footer_1gnta {
     padding: var(--gap-m) var(--gap-m);
     background-color: var(--color-light-bg-primary);
 }
-.bottom-sheet__sticky_1opm0 {
+.bottom-sheet__sticky_1gnta {
     position: sticky;
     bottom: 0;
 }
-.bottom-sheet__highlighted_1opm0 {
+.bottom-sheet__highlighted_1gnta {
     border-top: var(--bottom-sheet-footer-border-top);
     background-color: var(--bottom-sheet-footer-background-color);
 }

package/bottom-sheet/modern/components/header/Component.js

@@ -12,4 +12,4 @@ import '../backer/Component.js';
 import '../footer/Component.js';
 import '../../../../backdrop/modern';
 import '../swipeable-backdrop/Component.js';
-export { a as Header } from '../../component-5e4ff82e.js';
+export { a as Header } from '../../component-ea68a665.js';

package/bottom-sheet/modern/components/header/index.css

@@ -1,4 +1,4 @@
-/* hash: 1d9qf */
+/* hash: 1eaio */
 :root {
     --color-light-bg-primary: #fff;
 }
@@ -30,7 +30,7 @@
     --bottom-sheet-title-font-family: var(--font-family-system);
     --bottom-sheet-title-margin-vertical: var(--gap-2xs);
 }
-.bottom-sheet__headerWrapper_18fxg {
+.bottom-sheet__headerWrapper_1j3ft {
     padding: var(--gap-xs);
     padding-bottom: 0;
     background-color: var(--color-light-bg-primary);
@@ -38,38 +38,38 @@
     border-top-left-radius: var(--border-radius-xl);
     z-index: 1;
 }
-.bottom-sheet__header_18fxg {
+.bottom-sheet__header_1j3ft {
     display: flex;
 }
-.bottom-sheet__sticky_18fxg {
+.bottom-sheet__sticky_1j3ft {
     position: sticky;
     top: 0;
 }
-.bottom-sheet__highlighted_18fxg {
+.bottom-sheet__highlighted_1j3ft {
     border-bottom: var(--bottom-sheet-header-border-bottom);
 }
-.bottom-sheet__justifyEnd_18fxg {
+.bottom-sheet__justifyEnd_1j3ft {
     justify-content: flex-end;
 }
-.bottom-sheet__addon_18fxg {
+.bottom-sheet__addon_1j3ft {
     display: flex;
     justify-content: center;
     align-items: center;
     min-width: 48px;
     height: 48px;
 }
-.bottom-sheet__addonFixed_18fxg {
+.bottom-sheet__addonFixed_1j3ft {
     position: fixed;
 }
-.bottom-sheet__addonLeft_18fxg {
+.bottom-sheet__addonLeft_1j3ft {
     left: 0;
     margin-left: var(--gap-xs);
 }
-.bottom-sheet__addonRight_18fxg {
+.bottom-sheet__addonRight_1j3ft {
     right: 0;
     margin-right: var(--gap-xs);
 }
-.bottom-sheet__title_18fxg {
+.bottom-sheet__title_1j3ft {
     padding: var(--gap-xs) var(--gap-xs);
     margin: var(--bottom-sheet-title-margin-vertical) 0;
     width: 100%;
@@ -78,23 +78,23 @@
     line-height: var(--bottom-sheet-title-line-height);
     font-family: var(--bottom-sheet-title-font-family);
 }
-.bottom-sheet__titleCenter_18fxg {
+.bottom-sheet__titleCenter_1j3ft {
     text-align: center;
 }
-.bottom-sheet__titleLeft_18fxg {
+.bottom-sheet__titleLeft_1j3ft {
     text-align: left;
 }
-.bottom-sheet__trimTitle_18fxg {
+.bottom-sheet__trimTitle_1j3ft {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
 }
-.bottom-sheet__titleBigIndentHorizontal_18fxg {
+.bottom-sheet__titleBigIndentHorizontal_1j3ft {
     margin: var(--bottom-sheet-title-margin-vertical) var(--gap-4xl);
 }
-.bottom-sheet__titleIndentRight_18fxg {
+.bottom-sheet__titleIndentRight_1j3ft {
     margin-right: var(--gap-4xl);
 }
-.bottom-sheet__titleIndentLeft_18fxg {
+.bottom-sheet__titleIndentLeft_1j3ft {
     margin-left: var(--gap-4xl);
 }

package/bottom-sheet/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 8ht63 */
+/* hash: iipsg */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-graphic-quaternary: #dbdee1;
@@ -24,14 +24,14 @@
     --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
     --bottom-sheet-out-transition: 0.3s ease;
 }
-.bottom-sheet__modal_1gf4k {
+.bottom-sheet__modal_1enkg {
     background-color: transparent;
     position: fixed;
     bottom: 0;
     width: 100%;
     max-width: 600px;
 }
-.bottom-sheet__component_1gf4k {
+.bottom-sheet__component_1enkg {
     overflow: hidden;
     position: relative;
     display: flex;
@@ -41,20 +41,17 @@
     background: var(--color-light-bg-primary);
     transform: translateY(100%);
 }
-.bottom-sheet__withTransition_1gf4k {
+.bottom-sheet__withTransition_1enkg {
     transition: var(--bottom-sheet-out-transition);
 }
-.bottom-sheet__withZeroTransition_1gf4k {
-    transition: 0s linear;
-}
-.bottom-sheet__scrollableContainer_1gf4k {
+.bottom-sheet__scrollableContainer_1enkg {
     overflow: auto;
     display: flex;
     flex-direction: column;
     position: relative;
     height: 100%;
 }
-.bottom-sheet__marker_1gf4k {
+.bottom-sheet__marker_1enkg {
     position: fixed;
     top: var(--gap-2xs);
     left: 50%;
@@ -65,7 +62,7 @@
     background-color: var(--color-light-graphic-quaternary);
     z-index: 1000;
 }
-.bottom-sheet__content_1gf4k {
+.bottom-sheet__content_1enkg {
     display: flex;
     flex-direction: column;
     flex: 1;
@@ -73,29 +70,29 @@
     color: var(--color-light-text-primary);
     background-color: var(--color-light-bg-primary);
 }
-.bottom-sheet__noHeader_1gf4k {
+.bottom-sheet__noHeader_1enkg {
     padding-top: var(--gap-xl);
 }
-.bottom-sheet__noFooter_1gf4k {
+.bottom-sheet__noFooter_1enkg {
     padding-bottom: var(--gap-m);
 }
-.bottom-sheet__scrollLocked_1gf4k {
+.bottom-sheet__scrollLocked_1enkg {
     overflow: hidden;
 }
-.bottom-sheet__appear_1gf4k .bottom-sheet__component_1gf4k, .bottom-sheet__enter_1gf4k .bottom-sheet__component_1gf4k {
+.bottom-sheet__appear_1enkg .bottom-sheet__component_1enkg, .bottom-sheet__enter_1enkg .bottom-sheet__component_1enkg {
         transition: none;
     }
-.bottom-sheet__appearActive_1gf4k .bottom-sheet__component_1gf4k, .bottom-sheet__enterActive_1gf4k .bottom-sheet__component_1gf4k {
+.bottom-sheet__appearActive_1enkg .bottom-sheet__component_1enkg, .bottom-sheet__enterActive_1enkg .bottom-sheet__component_1enkg {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
     }
-.bottom-sheet__enterDone_1gf4k .bottom-sheet__component_1gf4k, .bottom-sheet__appearDone_1gf4k .bottom-sheet__component_1gf4k {
+.bottom-sheet__enterDone_1enkg .bottom-sheet__component_1enkg, .bottom-sheet__appearDone_1enkg .bottom-sheet__component_1enkg {
         transform: translateY(0);
     }
-.bottom-sheet__exit_1gf4k .bottom-sheet__component_1gf4k {
+.bottom-sheet__exit_1enkg .bottom-sheet__component_1enkg {
         transform: translateY(0);
     }
-.bottom-sheet__exitActive_1gf4k .bottom-sheet__component_1gf4k {
+.bottom-sheet__exitActive_1enkg .bottom-sheet__component_1enkg {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
     }

package/bottom-sheet/modern/index.d.ts

@@ -1 +1 @@
-export * from "./component-5e4ff82e";
+export * from "./component-ea68a665";

package/bottom-sheet/modern/index.js

@@ -12,4 +12,4 @@ import './components/backer/Component.js';
 import './components/footer/Component.js';
 import '../../backdrop/modern';
 import './components/swipeable-backdrop/Component.js';
-export { B as BottomSheet, C as CLOSE_OFFSET, H as HEADER_OFFSET } from './component-5e4ff82e.js';
+export { B as BottomSheet, C as CLOSE_OFFSET, H as HEADER_OFFSET } from './component-ea68a665.js';

package/button/Component.js

@@ -51,13 +51,13 @@ function __rest(s, e) {
     return t;
 }
 
-var styles = {"component":"button__component_1wnyv","focused":"button__focused_1wnyv","loading":"button__loading_1wnyv","text":"button__text_1wnyv","addons":"button__addons_1wnyv","stretchText":"button__stretchText_1wnyv","loader":"button__loader_1wnyv","xxs":"button__xxs_1wnyv","iconOnly":"button__iconOnly_1wnyv","xs":"button__xs_1wnyv","s":"button__s_1wnyv","m":"button__m_1wnyv","l":"button__l_1wnyv","xl":"button__xl_1wnyv","withRightAddons":"button__withRightAddons_1wnyv","ghost":"button__ghost_1wnyv","withLeftAddons":"button__withLeftAddons_1wnyv","link":"button__link_1wnyv","block":"button__block_1wnyv","nowrap":"button__nowrap_1wnyv"};
+var styles = {"component":"button__component_lq45i","focused":"button__focused_lq45i","loading":"button__loading_lq45i","text":"button__text_lq45i","addons":"button__addons_lq45i","stretchText":"button__stretchText_lq45i","loader":"button__loader_lq45i","xxs":"button__xxs_lq45i","iconOnly":"button__iconOnly_lq45i","xs":"button__xs_lq45i","s":"button__s_lq45i","m":"button__m_lq45i","l":"button__l_lq45i","xl":"button__xl_lq45i","withRightAddons":"button__withRightAddons_lq45i","ghost":"button__ghost_lq45i","withLeftAddons":"button__withLeftAddons_lq45i","link":"button__link_lq45i","block":"button__block_lq45i","nowrap":"button__nowrap_lq45i"};
 require('./index.css');
 
-var defaultColors = {"primary":"button__primary_14e8w","secondary":"button__secondary_14e8w","outlined":"button__outlined_14e8w","tertiary":"button__tertiary_14e8w","filled":"button__filled_14e8w","transparent":"button__transparent_14e8w","link":"button__link_14e8w","ghost":"button__ghost_14e8w","component":"button__component_14e8w","loading":"button__loading_14e8w"};
+var defaultColors = {"primary":"button__primary_1hq2g","secondary":"button__secondary_1hq2g","outlined":"button__outlined_1hq2g","tertiary":"button__tertiary_1hq2g","filled":"button__filled_1hq2g","transparent":"button__transparent_1hq2g","link":"button__link_1hq2g","ghost":"button__ghost_1hq2g","component":"button__component_1hq2g","loading":"button__loading_1hq2g"};
 require('./default.css');
 
-var invertedColors = {"primary":"button__primary_72hru","secondary":"button__secondary_72hru","outlined":"button__outlined_72hru","tertiary":"button__tertiary_72hru","filled":"button__filled_72hru","transparent":"button__transparent_72hru","link":"button__link_72hru","ghost":"button__ghost_72hru","component":"button__component_72hru","loading":"button__loading_72hru"};
+var invertedColors = {"primary":"button__primary_kebbp","secondary":"button__secondary_kebbp","outlined":"button__outlined_kebbp","tertiary":"button__tertiary_kebbp","filled":"button__filled_kebbp","transparent":"button__transparent_kebbp","link":"button__link_kebbp","ghost":"button__ghost_kebbp","component":"button__component_kebbp","loading":"button__loading_kebbp"};
 require('./inverted.css');
 
 var colorStyles = {